/* ============================================
   Component: Homepage Nav Tree
   Source: Styles/css/components/homepage-header-menu-layout.css (2058,2800)
   ============================================ */

.nav_icon {
    -webkit-transition: all 0.35s ease-in-out 0s;
    -moz-transition: all 0.35s ease-in-out 0s;
    -o-transition: all 0.35s ease-in-out 0s;
    transition: all 0.35s ease-in-out 0s;
}

.nav_first-level {
    color: #34657f;
    font-size: 24px;
    font-weight: 700;
}

@media screen and (min-width: 1024px) {
    .nav_first-level {
        font-size: 39.9px;
        font-weight: 500;
    }

    .nav_first-level:hover {
        color: #34657f !important;
    }

    .nav_first-level:hover .nav_icon:before {
        background-color: #34657f !important;
        -webkit-box-shadow: 7px 7px 0 0 #34657f, 0 14px 0 0 #34657f !important;
        -moz-box-shadow: 7px 7px 0 0 #34657f, 0 14px 0 0 #34657f !important;
        box-shadow: 7px 7px 0 0 #34657f, 0 14px 0 0 #34657f !important;
    }
}

@media screen and (min-width: 1600px) {
    .nav_first-level {
        font-size: 42px;
        line-height: 70px;
    }
}

.nav_children-back a,
.nav_children-open a {
    -webkit-box-align: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    -webkit-box-pack: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    -webkit-align-items: center;
    align-items: center;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-justify-content: center;
    justify-content: center;
}

@media screen and (min-width: 1024px) {

    .nav_children-back a,
    .nav_children-open a {
        -webkit-box-pack: start;
        -moz-box-pack: start;
        -ms-flex-pack: start;
        -webkit-justify-content: flex-start;
        justify-content: flex-start;
    }
}

.nav_children-back .nav_icon,
.nav_children-open .nav_icon {
    display: inline-block;
    height: 20px;
    position: relative;
    width: 20px;
}

.nav_children-back .nav_icon:before,
.nav_children-open .nav_icon:before {
    background-color: #34657f;
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    border-radius: 50%;
    -webkit-box-shadow: 7px 7px 0 0 #34657f, 0 14px 0 0 #34657f;
    -moz-box-shadow: 7px 7px 0 0 #34657f, 0 14px 0 0 #34657f;
    box-shadow: 7px 7px 0 0 #34657f, 0 14px 0 0 #34657f;
    content: '';
    height: 6px;
    left: 50%;
    position: absolute;
    top: 0;
    -webkit-transform: translateX(-50%);
    -moz-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    -o-transform: translateX(-50%);
    transform: translateX(-50%);
    width: 6px;
}

.nav_children-open .nav_icon {
    margin-left: 5px;
}

.nav_children-open .nav_icon:after,
.nav_children-open .nav_icon:before {
    -webkit-transition: all 0.35s ease-in-out 0s;
    -moz-transition: all 0.35s ease-in-out 0s;
    -o-transition: all 0.35s ease-in-out 0s;
    transition: all 0.35s ease-in-out 0s;
}

.nav_children-open .nav_text {
    width: 80%;
}

.nav_children-back {
    font-size: 18px;
    font-weight: 500;
    position: relative;
}

.nav_children-back:after {
    background-color: #34657f;
    bottom: 0;
    content: '';
    height: 2px;
    left: 0;
    position: absolute;
    width: 100%;
}

@media screen and (min-width: 1024px) {
    .nav_children-back:after {
        background-color: transparent;
    }
}

.nav_children-back .nav_text {
    color: #34657f;
}

@media screen and (min-width: 1024px) {
    .nav_children-back .nav_text {
        font-size: 0;
        opacity: 0;
        visibility: hidden;
    }
}

.nav_children-back .nav_icon {
    margin-right: 5px;
    -webkit-transform: rotate(180deg);
    -moz-transform: rotate(180deg);
    -ms-transform: rotate(180deg);
    -o-transform: rotate(180deg);
    transform: rotate(180deg);
}

.nav_children-back .nav_icon:before {
    background-color: #34657f;
    -webkit-box-shadow: 7px 7px 0 0 #34657f, 0 14px 0 0 #34657f;
    -moz-box-shadow: 7px 7px 0 0 #34657f, 0 14px 0 0 #34657f;
    box-shadow: 7px 7px 0 0 #34657f, 0 14px 0 0 #34657f;
}

.nav_children>.nav_children-back {
    display: none;
}

@media screen and (min-width: 1024px) {
    .nav_children>.nav_children-back.show {
        display: block;
        position: absolute;
        top: 0;
        -webkit-transform: translate(77vw, 2vh);
        -moz-transform: translate(77vw, 2vh);
        -ms-transform: translate(77vw, 2vh);
        -o-transform: translate(77vw, 2vh);
        transform: translate(77vw, 2vh);
        z-index: 3;
    }
}

@media screen and (min-width: 1600px) {
    .nav_children>.nav_children-back.show {
        -webkit-transform: translate(75vw, 3vh);
        -moz-transform: translate(75vw, 3vh);
        -ms-transform: translate(75vw, 3vh);
        -o-transform: translate(75vw, 3vh);
        transform: translate(75vw, 3vh);
    }
}

@media screen and (min-width: 1024px) {
    .nav_children>.nav_children-back .nav_icon:before {
        background-color: #34657f;
        -webkit-border-radius: 0;
        -moz-border-radius: 0;
        border-radius: 0;
        -webkit-box-shadow: none;
        -moz-box-shadow: none;
        box-shadow: none;
        height: 2px;
        position: absolute;
        top: 50%;
        -webkit-transform: translate(-50%, -50%) rotate(45deg);
        -moz-transform: translate(-50%, -50%) rotate(45deg);
        -ms-transform: translate(-50%, -50%) rotate(45deg);
        -o-transform: translate(-50%, -50%) rotate(45deg);
        transform: translate(-50%, -50%) rotate(45deg);
        width: 100%;
        z-index: 10;
    }

    .nav_children>.nav_children-back .nav_icon:after {
        background-color: #34657f;
        content: '';
        height: 2px;
        left: 50%;
        position: absolute;
        top: 50%;
        -webkit-transform: translate(-50%, -50%) rotate(-45deg);
        -moz-transform: translate(-50%, -50%) rotate(-45deg);
        -ms-transform: translate(-50%, -50%) rotate(-45deg);
        -o-transform: translate(-50%, -50%) rotate(-45deg);
        transform: translate(-50%, -50%) rotate(-45deg);
        width: 100%;
        z-index: 10;
    }
}

.nav_children-list {
    background-color: #eff4f1;
    font-size: 18px;
    left: 0;
    opacity: 0;
    padding: 0 20px;
    position: absolute;
    top: 0;
    visibility: hidden;
    width: 100%;
    z-index: 2;
}

@media screen and (min-width: 1024px) {
    .nav_children-list {
        left: -4px;
        width: -webkit-calc(100% + 3px);
        width: -moz-calc(100% + 3px);
        width: calc(100% + 3px);
    }
}

@media screen and (min-width: 1600px) {
    .nav_children-list {
        left: auto;
        right: 1px;
        width: 40vw;
    }
}

@media screen and (min-width: 1024px) {
    .nav_children-list:hover li a {
        color: #34657f;
    }
}

.nav_children-list:hover li a .nav_icon:after,
.nav_children-list:hover li a .nav_icon:before {
    background-color: #34657f;
}

@media screen and (min-width: 1024px) {
    .nav_children-list li.inactive a {
        color: #34657f;
    }
}

.nav_children-list li.inactive a .nav_icon:after,
.nav_children-list li.inactive a .nav_icon:before {
    background-color: #34657f;
}

.nav_children-list li.inactive:hover a,
.nav_children-list li:hover a {
    color: #34657f;
}

.nav_children-list li.inactive:hover a .nav_icon:after,
.nav_children-list li.inactive:hover a .nav_icon:before,
.nav_children-list li:hover a .nav_icon:after,
.nav_children-list li:hover a .nav_icon:before {
    background-color: #34657f;
}

.nav_children-list li.current-page>a {
    color: #34657f;
    font-style: italic;
}

.nav_children-list .nav_children.active a {
    color: #34657f;
}

@media screen and (max-width: 1023px) {
    .nav_children-list {
        left: 100%;
        -webkit-transition: all 0.35s ease-in-out 0s;
        -moz-transition: all 0.35s ease-in-out 0s;
        -o-transition: all 0.35s ease-in-out 0s;
        transition: all 0.35s ease-in-out 0s;
    }
}

.nav_children-list.show {
    opacity: 1;
    visibility: visible;
}

@media screen and (max-width: 1023px) {
    .nav_children-list.show {
        left: 0;
        opacity: 1;
    }
}

@media screen and (min-width: 1024px) {
    .nav_children-list.show {
        opacity: 1;
        overflow-y: scroll;
        padding: 5% 5% 0 20%;
        text-align: left;
        -webkit-transform: translateX(100%);
        -moz-transform: translateX(100%);
        -ms-transform: translateX(100%);
        -o-transform: translateX(100%);
        transform: translateX(100%);
    }

    .nav_children-list.show .nav_children-open a {
        -webkit-box-pack: start;
        -moz-box-pack: start;
        -ms-flex-pack: start;
        -webkit-justify-content: flex-start;
        justify-content: flex-start;
    }
}

@media screen and (min-width: 1600px) {
    .nav_children-list.show {
        padding: 5% 5% 0 10% !important;
        text-align: left;
    }
}

@media screen and (min-width: 1024px) {
    .nav_children-list.show .nav_children-list {
        padding: 0 0 0 30px !important;
        -webkit-transform: translate(0) !important;
        -moz-transform: translate(0) !important;
        -ms-transform: translate(0) !important;
        -o-transform: translate(0) !important;
        transform: translate(0) !important;
    }
}

.nav_children-list.show .nav_children-list.show {
    display: block;
}

@media screen and (min-width: 1024px) {
    .nav_children-list .nav_children-list.show {
        -webkit-transform: translateX(0);
        -moz-transform: translateX(0);
        -ms-transform: translateX(0);
        -o-transform: translateX(0);
        transform: translateX(0);
    }
}

.nav_children.current-page .nav_children-list {
    font-style: normal;
}

.nav_children-list a {
    color: #34657f;
}

@media screen and (min-width: 1600px) {
    .nav_children-list a {
        font-size: 20px;
    }
}

.nav_children-list .nav {
    font-weight: 300;
    position: relative;
}

.nav_children-list .nav.show {
    height: 100%;
    max-height: 700px;
    opacity: 1;
    padding-left: 20px;
    position: relative;
    -webkit-transition: max-height 0.7s ease-in-out;
    -o-transition: max-height 0.7s ease-in-out;
    -moz-transition: max-height 0.7s ease-in-out;
    transition: max-height 0.7s ease-in-out;
    visibility: visible;
}

.nav_children-list .nav a {
    padding: 5px 0;
}

.nav_children-list .nav_children-open .nav_icon {
    height: 15px;
    width: 15px;
}

.nav_children-list .nav_children-open .nav_icon:before {
    -webkit-border-radius: 0;
    -moz-border-radius: 0;
    border-radius: 0;
    -webkit-box-shadow: none;
    -moz-box-shadow: none;
    box-shadow: none;
    height: 2px;
    width: 100%;
}

.nav_children-list .nav_children-open .nav_icon:after,
.nav_children-list .nav_children-open .nav_icon:before {
    top: 50%;
    -webkit-transform: translate(-50%, -50%);
    -moz-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    -o-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
}

.nav_children-list .nav_children-open .nav_icon:after {
    background-color: #34657f;
    content: '';
    height: 100%;
    left: 50%;
    position: absolute;
    width: 2px;
}

.nav_children-list .nav_children-open.show .nav_icon:after {
    content: none;
}

@media screen and (min-width: 1024px) {
    .nav_children-list .nav_children-open a {
        -webkit-box-pack: center;
        -moz-box-pack: center;
        -ms-flex-pack: center;
        -webkit-justify-content: center;
        justify-content: center;
    }
}

@media screen and (min-width: 1600px) {
    .nav_children-list .nav_children-open a {
        -webkit-box-pack: start;
        -moz-box-pack: start;
        -ms-flex-pack: start;
        -webkit-justify-content: flex-start;
        justify-content: flex-start;
    }
}

@media screen and (min-width: 1024px) {
    .nav_children-list .nav_children-back {
        opacity: 0;
        visibility: hidden;
    }
}

.nav_children-list .nav_children-list {
    display: none;
}

.nav_children-scroll {
    border: 2px solid #6495ed;
    left: -5%;
    position: absolute;
    top: 50%;
    -webkit-transform: rotate(90deg);
    -moz-transform: rotate(90deg);
    -ms-transform: rotate(90deg);
    -o-transform: rotate(90deg);
    transform: rotate(90deg);
}

@media screen and (min-width: 1024px) {
    .nav_children .nav {
        padding-bottom: 0;
        padding-top: 0;
    }

    .nav_children.active .nav_first-level {
        color: #34657f !important;
    }

    .nav_children.active .nav_first-level .nav_icon:before {
        background-color: #34657f !important;
    }
}

.nav_children.active .nav_children-list {
    opacity: 1;
    visibility: visible;
}

@media screen and (max-width: 1023px) {
    .nav_children.active .nav_children-list {
        left: 0;
        opacity: 1;
    }
}

@media screen and (min-width: 1024px) {
    .nav_children.active .nav_children-list {
        opacity: 1;
        overflow-y: scroll;
        padding: 5% 5% 0 20%;
        text-align: left;
        -webkit-transform: translateX(100%);
        -moz-transform: translateX(100%);
        -ms-transform: translateX(100%);
        -o-transform: translateX(100%);
        transform: translateX(100%);
    }

    .nav_children.active .nav_children-list .nav_children-open a {
        -webkit-box-pack: start;
        -moz-box-pack: start;
        -ms-flex-pack: start;
        -webkit-justify-content: flex-start;
        justify-content: flex-start;
    }
}

@media screen and (min-width: 1600px) {
    .nav_children.active .nav_children-list {
        padding: 5% 5% 0 10% !important;
        text-align: left;
    }
}

@media screen and (min-width: 1024px) {
    .nav_children.active .nav_children-list .nav_children-list {
        padding: 0 0 0 30px !important;
        -webkit-transform: translate(0) !important;
        -moz-transform: translate(0) !important;
        -ms-transform: translate(0) !important;
        -o-transform: translate(0) !important;
        transform: translate(0) !important;
    }
}

.nav_children.active .nav_children-list .nav_children-open.show .nav_icon:before {
    -webkit-box-shadow: none !important;
    -moz-box-shadow: none !important;
    box-shadow: none !important;
}

.nav_children.current-page .nav_children-open>.nav_icon:after,
.nav_children.current-page .nav_children-open>.nav_icon:before,
.nav_children.current-page .nav_first-level .nav_icon:after,
.nav_children.current-page .nav_first-level .nav_icon:before {
    background-color: #34657f;
    -webkit-transition: all 0.35s ease-in-out 0s;
    -moz-transition: all 0.35s ease-in-out 0s;
    -o-transition: all 0.35s ease-in-out 0s;
    transition: all 0.35s ease-in-out 0s;
}

.nav_children.current-page .nav_first-level .nav_icon:after,
.nav_children.current-page .nav_first-level .nav_icon:before {
    -webkit-box-shadow: 7px 7px 0 0 #34657f, 0 14px 0 0 #34657f;
    -moz-box-shadow: 7px 7px 0 0 #34657f, 0 14px 0 0 #34657f;
    box-shadow: 7px 7px 0 0 #34657f, 0 14px 0 0 #34657f;
}

.nav_children-scrollbar {
    height: 80%;
    left: -webkit-calc(100% + 60px);
    left: -moz-calc(100% + 60px);
    left: calc(100% + 60px);
    opacity: 0;
    position: absolute;
    top: 15%;
    -webkit-transform: translateY(-15%);
    -moz-transform: translateY(-15%);
    -ms-transform: translateY(-15%);
    -o-transform: translateY(-15%);
    transform: translateY(-15%);
    visibility: hidden;
    z-index: 3;
}

.nav_children-scrollbar.show {
    opacity: 1;
    visibility: visible;
}

.nav_children-scrollbar .scroll-bar-input {
    background: #fff;
}

@media screen and (min-width: 1024px) {
    .menu_search {
        z-index: 2;
    }
}

.nav_shadow-bottom,
.nav_shadow-top {
    height: 50px;
    pointer-events: none;
    position: absolute;
    z-index: 1;
}

@media screen and (min-width: 1024px) {

    .nav_shadow-bottom,
    .nav_shadow-top {
        display: block;
    }

    .nav_shadow-bottom {
        height: 200px;
    }
}

.nav_shadow-top {
    top: var(--menuFirstLvlOffsetTop);
    width: var(--menuFirstLvlWidthTop);
}

.nav_shadow-bottom {
    bottom: 9.5%;
    width: var(--menuFirstLvlWidthBottom);
}

.nav_shadow-top {
    background: -moz-linear-gradient(top,
            #fff 0,
            #fff 20%,
            hsla(0, 0%, 100%, 0) 99%);
    background: -webkit-linear-gradient(top,
            #fff,
            #fff 20%,
            hsla(0, 0%, 100%, 0) 99%);
    background: -webkit-gradient(linear,
            left top,
            left bottom,
            from(#fff),
            color-stop(20%, #fff),
            color-stop(99%, hsla(0, 0%, 100%, 0)));
    background: -o-linear-gradient(top,
            #fff 0,
            #fff 20%,
            hsla(0, 0%, 100%, 0) 99%);
    background: linear-gradient(180deg,
            #fff 0,
            #fff 20%,
            hsla(0, 0%, 100%, 0) 99%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#ffffff", endColorstr="#00ffffff", GradientType=0);
}

.nav_shadow-bottom {
    background: -moz-linear-gradient(top,
            hsla(0, 0%, 100%, 0) 0,
            #fff 79%,
            #fff 100%);
    background: -webkit-linear-gradient(top,
            hsla(0, 0%, 100%, 0),
            #fff 79%,
            #fff);
    background: -webkit-gradient(linear,
            left top,
            left bottom,
            from(hsla(0, 0%, 100%, 0)),
            color-stop(79%, #fff),
            to(#fff));
    background: -o-linear-gradient(top,
            hsla(0, 0%, 100%, 0) 0,
            #fff 79%,
            #fff 100%);
    background: linear-gradient(180deg, hsla(0, 0%, 100%, 0) 0, #fff 79%, #fff);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#00ffffff", endColorstr="#ffffff", GradientType=0);
}

.nav_shadow-bottom.showNavArrow {
    bottom: 70px;
    display: block;
    height: 80px;
    position: fixed;
}

.nav_shadow-bottom.showNavArrow:before {
    border: 2px solid #34657f;
    border-left: none;
    border-top: none;
    bottom: 20px;
    content: '';
    height: 15px;
    left: 50%;
    position: absolute;
    -webkit-transform: translateX(-50%) rotate(45deg);
    -moz-transform: translateX(-50%) rotate(45deg);
    -ms-transform: translateX(-50%) rotate(45deg);
    -o-transform: translateX(-50%) rotate(45deg);
    transform: translateX(-50%) rotate(45deg);
    width: 15px;
}

.nav_shadow-bottom,
.nav_shadow-top {
    display: none;
}

@media screen and (min-width: 1024px) {
    .menu_content {
        -ms-grid-columns: 74px 50% 50%;
        grid-template-columns: 74px 50% 50%;
    }
}

@media screen and (min-width: 1600px) {
    .menu_content {
        -ms-grid-columns: 93px 60% 40%;
        grid-template-columns: 93px 60% 40%;
    }
}

