/* Стили для хэдера */
.header_container {
    margin: auto;
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
    width: 100%;
    max-width: 1280px;
    height: 100%;
    background-color: rgb(255, 255, 255);
    padding: 10px 0 10px 0;
}

.item_header:first-child {
    margin: 0 0 0 1.5%;
}

.item_header:last-child {
    margin: 0 1.5% 0 10px;
}

.item_header.logo.desktop {
    display: flex;
    flex-direction: column;
    align-items: center;
}

.item_header.tablet_menu {
    display: none;
}

.item_header.logo.desktop>.logo_img {
    width: calc(170px + (10 * 4.284 * 0.77) *((100vw - 1024px) / 1280));
}


/* Стили для меню */

.header_container>.header_menu {
    display: flex;
    align-self: flex-end;
    flex-direction: row;
    justify-content: space-around;
    align-items: flex-end;
    flex-wrap: nowrap;
}

.header_menu>.menu-item {
    margin-right: calc(10px + (15 * 4.284 * 0.77) *((100vw - 1024px) / 1280));
    min-width: calc(85px + (30 * 4.284 * 0.77) *((100vw - 1024px) / 1280));
    padding-bottom: 25px;
    margin-bottom: -15px;
    position: relative;

}

.header_menu>.menu-item:first-child {
    margin-left: calc(10px + (5 * 4.284 * 0.77) *((100vw - 1024px) / 1280));
}

.header_menu>.menu-item:last-child {
    margin-right: calc(10px + (5 * 4.284 * 0.77) *((100vw - 1024px) / 1280));
}

.header_menu a {
    color: #000000;
}

.header_menu>.menu-item>a {
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 1px calc(7px + (2 * 4.284 * 0.77) *((100vw - 1024px) / 1280)) calc(5px + (2 * 4.284 * 0.77) *((100vw - 1024px) / 1280)) calc(7px + (2 * 4.284 * 0.77) *((100vw - 1024px) / 1280));
/*     font-size: calc(11px + (1 * 4.284 * 0.77) *((100vw - 1024px) / 1280)); */
	font-size:12.5px;
    font-weight: bold;
    white-space: nowrap;
    border-radius: 10px;
    text-transform: uppercase;
}

.header_menu>.menu-item>a>img {
    width: calc(40px + (5 * 4.284 * 0.77) *((100vw - 1024px) / 1280));
    margin: 10px 2px 10px 2px;
    filter: invert(30%);
    height: auto;
    transition: .3s transform ease;
}

body.mouse .item_menu_hover>.menu-item.active>a>img {
    filter: invert(100%);
    transform: scale(1.05);
}

body.mouse .item_menu_hover>.menu-item.active>a {
    background-color: #ef7f1a;
    -webkit-box-shadow: 0px 0px 4px rgb(68, 68, 68);
    -moz-box-shadow: 0px 0px 4px rgb(68, 68, 68);
    box-shadow: 0px 0px 4px rgb(68, 68, 68);
}

body.touch .item_menu_hover>.menu-item.active>a>img {
    filter: invert(100%);
    transform: scale(1.05);
}

body.touch .item_menu_hover>.menu-item.active>a {
    background-color: #ef7f1a;
    -webkit-box-shadow: 0px 0px 4px rgb(68, 68, 68);
    -moz-box-shadow: 0px 0px 4px rgb(68, 68, 68);
    box-shadow: 0px 0px 4px rgb(68, 68, 68);
}


.header_menu .sub-menu_container {
    display: flex;
    margin: 0;
    width: 100%;
    max-width: 1200px;
    flex-direction: row;
    justify-content: flex-start;
    flex-wrap: wrap;
	
}

.header_menu .sub-menu {
    display: none;
    justify-content: space-around;
    position: absolute;
    margin-top: 10px;
    background-color: rgba(255, 255, 255, .98);
    width: 100vw;
    overflow: hidden;
    min-height: 68px;
    -webkit-box-shadow: 0px 5px 5px rgb(230, 230, 230);
    -moz-box-shadow: 0px 5px 5px rgb(230, 230, 230);
    box-shadow: 0px 5px 5px rgb(230, 230, 230);
    transition: 0.2s;
    padding: 20px;
}




body.touch .header_menu.item_menu_hover>.menu-item.active .sub-menu {
    display: flex;
}

body.mouse .header_menu.item_menu_hover>.menu-item.active .sub-menu {
    display: flex;
}

.header_menu .sub-menu>.sub-menu_container>.menu-item {
    box-sizing: border-box;
    width: 25%;
}

.header_menu .sub-menu>.sub-menu_container>.menu-item img {
    max-width: 38px;
    height: auto;
    margin: 0 15px 0 0;
    filter: invert(30%);
    transition: .3s transform ease;
}

.header_menu .sub-menu>.sub-menu_container>.menu-item:hover {
    background-color: #ef7f1a;
    border-color: #ebe9e9cb;
    -webkit-box-shadow: 0px 0px 5px rgb(0, 0, 0);
    -moz-box-shadow: 0px 0px 5px rgb(0, 0, 0);
    box-shadow: 0px 0px 5px rgb(0, 0, 0);
}

.header_menu .sub-menu>.sub-menu_container>.menu-item:hover img {
    filter: invert(100%);
    transform: scale(1.05);
}

.header_menu .sub-menu>.sub-menu_container>.menu-item a {
    height: 100%;
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: flex-start;
    padding: 10px 20px 10px 15px;
    font-size: calc(15px + (1 * 4.284 * 0.77) *((100vw - 1024px) / 1280));
}









/* Стили для раздела с контактами */

.call_back {
    display: flex;
    height: 100%;
    flex-direction: column;
    align-items: center;
    justify-content: space-around;

}

.phone_number {
    display: block;
    font-size: calc(21px + (5 * 4.284 * 0.77) *((100vw - 1024px) / 1280));
    white-space: nowrap;
    font-weight: 900;
    transition: 0.2s;
    color: #25245c;
}

a.mail {
    display: block;
    font-size: calc(13px + (5 * 4.284 * 0.77) *((100vw - 1024px) / 1280));
    white-space: nowrap;
    font-weight: 700;
    margin: 5px 20px;
    transition: 0.2s;
    color: #25245c;
}

a.mail:hover {
    transform: scale(1.05);
}

.phone_number:hover {
    transform: scale(1.05);
}

.phone_number>span {
    font-size: 0.6em;
}

.content_socials {
    display: flex;
    justify-content: space-around;
    min-height: 30px;
    width: 100%;
    margin: 5px 0 10px 0;
}

.vk-icon {
    background-image: url(/img/icons/vk.png);
    background-color: #597da3;
}

.ins-icon {
    background-image: url(/img/icons/ins.png);
    background-color: #f14040;
}

.mail-icon {
    background: url(/img/icons/email.png);
    background-color: #2a73e0;
}

.social_net {
    border-radius: 100%;
    height: calc(29px + (6 * 4.284 * 0.77) *((100vw - 1024px) / 1280));
    width: calc(29px + (6 * 4.284 * 0.77) *((100vw - 1024px) / 1280));
    background-repeat: no-repeat;
    background-size: 60%;
    background-position: center;
    transition: 0.1s;
    -webkit-box-shadow: 0px 0px 2px rgb(68, 68, 68);
    -moz-box-shadow: 0px 0px 2px rgb(68, 68, 68);
    box-shadow: 0px 0px 2px rgb(68, 68, 68);
}

.social_net:hover {
    transform: scale(1.17);

}

.call_back>.button {
    margin-top: 5px;
    width: 100%;
}

/* Стили для контактов для планшета */


/* Анимации */

/* Анимация иконок */
@keyframes animation_icon {
    0% {
        transform: scale(1.00);
    }

    50% {
        transform: scale(1.12);
    }

    100% {
        transform: scale(1.08);
    }
}

/* body.mouse .item_menu_hover.active>a>img {
    -webkit-animation: animation_icon;
    -webkit-animation-duration: 0.5s, 0.5s, 0.5s;
    -webkit-animation-fill-mode: forwards;
    animation: animation_icon;
    animation-duration: 0.5s, 0.5s, 0.5s;
    animation-fill-mode: forwards;
}

.sub-menu>.menu-item:hover>a>img {
    -webkit-animation-name: animation_icon;
    -webkit-animation-duration: 0.5s, 0.5s, 0.5s;
    -webkit-animation-fill-mode: forwards;
    animation-name: animation_icon;
    animation-duration: 0.5s, 0.5s, 0.5s;
    animation-fill-mode: forwards;
} */

@media (min-width: 980px) {
    .header_container>.header_menu {
        padding-top: 10px;
    }

}

/* Анимация логотипа */
/* .logo:hover>.logo_img {
    -moz-animation: rubberBand 0.8s;
    -webkit-animation: rubberBand 0.8s;
    animation: rubberBand 0.8s;
}


@keyframes animation_submenu {
    0% {
        opacity: 0%;
        transform: translate(0, -100%);
    }

    100% {
        transform: translate(0, 0);
    }
}

@media (min-width: 768px) {
    .header_menu .sub-menu {
        z-index: -99;
    }

    body.mouse .header_menu.item_menu_hover>.menu-item.active .sub-menu {
        animation-name: animation_submenu;
        animation-duration: 0.3s;
        animation-fill-mode: forwards;
    }



} */



/* Стили для плагина Menu Image */

.menu-image-title-after.menu-image-not-hovered img,
.menu-image-hovered.menu-image-title-after .menu-image-hover-wrapper,
.menu-image-title-before.menu-image-title {
    padding-right: 0px;
}

.menu-image-title-before.menu-image-not-hovered img,
.menu-image-hovered.menu-image-title-before .menu-image-hover-wrapper,
.menu-image-title-after.menu-image-title {
    padding-left: 0px;
}