body{padding-top: 4rem;}
.bg-black{display:none!important;}
.app-header{
    padding:.5rem 0;
    background:var(--color-bg);
    position:fixed;
    width:100%;
    top:0;
    left:0; 
    z-index:96;
    box-shadow: 0 1rem 2rem -1rem rgba(0,0,0,.25);
}
.app-header a:hover{ text-decoration:none;}

.app-header__phone{
    display:inline-flex;
    align-items:center;
    font-weight:bold; 
    color:inherit;
    min-height:2.2rem;
    }
.app-header__phone span{white-space: nowrap;}
.app-header__phone svg{
    color:#1ab56f;
    width:1.5rem;
    height:1.5rem;
    margin-right:.25rem;
}

.app-header__logo{display:block; max-width:6rem;}
.app-header__logo svg{
    display:block;
    max-width:100%;
}

.app-header__callback{
    font-size:.875rem;
    padding:.5rem 1rem;
}


.app-header__menu{font-weight:bold; background:var(--color-bg); display:none; position:fixed; top:0; left:0; width:100%; height:100%; z-index: -1;}
.app-header__menu .dropdown-menu{padding:0;}
.app-header__menu .dropdown-menu a{padding:.5rem 1rem;}
.app-header__menu a{color:inherit}
.app-header__menu a:not(.active):hover{ color:var(--color-brand); text-decoration:none;}
.app-header__menu .notices-counter a{display:inline-block; position:relative;}
.app-header__menu.is-show{ display: flex; align-items: center; justify-content: center;}
.app-header__menu .dropdown-menu a:active{ background:var(--color-brand); color:var(--color-bg);}

.hamburger {
padding:0;
display:block;
position: relative;
width: 1.5rem;
height: 1.5rem;
cursor: pointer;
border:none;
background:none;
}

.hamburger::before {
content:'';
transform: translateY(-.5rem);
}
.hamburger::after {
content:'';
transform: translateY(.5rem);
}
.hamburger > span,
.hamburger::before,
.hamburger::after {
display: block;
position: absolute;
width: 100%;
height: 2px;
top:0;
left:0;
bottom:0;
margin:auto;
background-color: #222;
transition-duration: .25s;
}

.hamburger.is-active span {
opacity:0;
}
.hamburger.is-active::before {
transform: rotate(45deg) translateY(0);
}
.hamburger.is-active::after {
transform: rotate(-45deg) translateY(0);
}

.social-links {padding:0; list-style:none; display:flex; align-items:center;}
.social-links__link{padding:.5rem;}
.app-header__menu .social-links {position:absolute; bottom:.5rem; left:0; width:100%; justify-content:center;}
.app-header__menu .social-links svg{width:1.5rem; height:1.5rem;}
.social-telegram svg {color: #2ca5da;}
.social-vk svg {color: #0077ff;}
.social-youtube svg {color: #ff0000;}
.social-whatsap svg {color: #0ec143;}

@media screen and (max-width:48em){
    .app-header__menu .menu{flex-direction:column;}
    .app-header__callback{font-size:.75rem; padding:.5rem;}
    .app-header .row{margin:0 -.25rem;}
    .app-header .row>div{padding:0 .25rem;}
}
@media screen and (min-width:48em){
    body{padding-top: 5rem;}
    .app-header{ padding:1rem 0; box-shadow: 0 1rem 2rem -2rem rgba(0,0,0,.25);}
    .app-header__menu{display:block; position:static; background:transparent; height:auto;}
    .app-header__menu .nav-link{padding:0 .5rem;}
    .app-header__menu .nav{justify-content: space-between;}
    .app-header__menu .dropdown:hover>.dropdown-menu {
        display: block;
        -webkit-animation: slide-up 0.3s ease-in-out;
        animation: slide-up 0.3s ease-in-out;
        margin: 0;
    }
}
@media screen and (min-width:64em){

    .app-header__menu .nav{flex-wrap: nowrap;}
}