﻿/*  
---------------------------------------------------
Header large screens 13
---------------------------------------------------  
*/

/* Header */
body.header-13-lg header#site-header .row {
    align-items: flex-end;
    height: var(--large-header);
    justify-content: space-between;
}


/* Main Navigation */
html.no-touch body.header-13-lg header#site-header nav.main ul > li:hover > ul, body.header-13-lg header#site-header nav.main ul > li.open-child > ul {
    top: calc((var(--large-header) / 2) - 5px);
}

body.header-13-lg header#site-header nav.main {
    position: relative;
    top: 0px;
    right: 0px;
    height: calc(var(--large-header) / 2);
}

    body.header-13-lg header#site-header nav.main > ul > li > span::before {
        top: calc((var(--large-header) / 2) - 10px);
        right: var(--base-half-spacing);
        left: var(--base-half-spacing);
        border-radius: var(--base-border-radius);
        width: 0;
    }

    html.no-touch body.header-13-lg header#site-header nav.main > ul > li.has-child:hover > span::before,
    body.header-13-lg header#site-header nav.main > ul > li.has-child:focus > span::before,
    body.header-13-lg header#site-header nav.main > ul > li.has-child:active > span::before,
    body.header-13-lg header#site-header nav.main > ul > li.has-child.active > span::before,
    body.header-13-lg header#site-header nav.main > ul > li.has-child.open-child > span::before {
        width: calc(100% - var(--base-half-spacing) - 5px);
    }

body.main-navigation-underline-link-hover header#site-header nav.main a:hover,
body.main-navigation-underline-link-hover header#site-header nav.main a:focus,
body.main-navigation-underline-link-hover header#site-header nav.main a:active {
    text-decoration: none;
    text-decoration-color: inherit;
}

.hidden-desktop {
    display: none;
}

.Main-navigation-desktop {
    display: flex;
    gap: 190px;
}

button.expand-subpages {
    border: 0;
    background-color: transparent;
    position: relative;
    height: 50px;
    display: flex;
    align-items: center;
    gap: 6px;
    font-weight: bold;
    font-size: 20px;
}

.expand-header-close {
    display: none;
}


body.header-13-lg header#site-header nav.secondary {
    margin-right: calc(var(--base-half-spacing) / 2);
    top: 0;
    right: 0;
    position: absolute
}

nav.secondary > ul {
    display: flex;
    flex-direction: row;
    width: fit-content;
    color: var(--black, #000);
    font-family: Inter;
    font-size: 18px;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
}

.language-selector-icon {
    background-image: url('../../images/shared/earth-globe-icon.svg');
    background-repeat: no-repeat;
    background-position: center center;
    background-size: contain;
    width: 32px;
    height: 32px;
    display: block;
    align-content: center;
    position: absolute;
    top: 12px;
    z-index: 2;
    background-color: #ffde00;
}

body.header-13-lg header#site-header nav.cta-links {
    z-index: 0;
}

.LinkMenuIconDesktop {
    background-image: url('../../images/shared/arrow_down.svg');
    background-repeat: no-repeat;
    background-position: center center;
    width: 14px;
    height: 25px;
    display: inline-block;
}

.expand-subpages:hover .LinkMenuIconDesktop {
    -moz-transform: rotate(180deg);
    -ms-transform: rotate(180deg);
    -o-transform: rotate(180deg);
    -webkit-transform: rotate(180deg);
    transform: rotate(180deg);
}

.submenuPopUp {
    border-bottom: 3px solid #FFDE00;
}

#countItem_1 .submenuPopUp {
    border-bottom: 3px solid #FFDE00;
    display: flex;
    flex-wrap: nowrap;
    width: calc(90vw - 805% / 2);
    gap: 0 40px;
}

#countItem_1:hover .submenuPopUp {
    left: calc(10vw - calc(91vw - 999px / 2) / 2);
    padding: 40px 50px;
}

#countItem_1 .submenuPopUp li.has-children.link-item-border {
    flex: 1 1 33%;
    max-width: 33%;
}

#countItem_1 li.no-child.link-item-border {
    flex: 1 1 33%;
    max-width: 33%;
}

#countItem_2 .submenuPopUp {
    border-bottom: 3px solid #FFDE00;
    display: flex;
    flex-wrap: nowrap;
    width: calc(100vw - 810% / 2);
    gap: 0 40px;
}

    #countItem_2 .submenuPopUp li.has-children.link-item-border, #countItem_2 .submenuPopUp li.no-child {
        flex: 1 1 33%;
        max-width: 33%;
    }


#countItem_2:hover .submenuPopUp {
    left: calc(0vw - calc(100vw - 770% / 2) / 2);
    padding: 40px 50px;
}

#countItem_2 li.no-child.link-item-border {
    flex: 1 1 33%;
    max-width: 33%;
}

#countItem_3 .submenuPopUp {
    border-bottom: 3px solid #FFDE00;
    display: flex;
    flex-wrap: nowrap;
    width: calc(100vw - 880% / 2);
    gap: 0 40px;
}

#countItem_3:hover .submenuPopUp {
    left: calc(0vw - calc(89vw - 58% / 2) / 2);
    padding: 40px 50px;
}

#countItem_3 .submenuPopUp li.has-children.link-item-border {
    flex: 1 1 50%;
    max-width: 50%;
}

.link-item-border {
    border-bottom: 0 none;
}

.submenu-header-item {
    display: contents
}

body.header-13-lg header#site-header nav.cta-links .btn {
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
    align-self: center;
    width: 140px;
    height: 48px;
    padding: 2px 10px 6px 10px;
    color: #FFDE00;
    font-size: 18px;
    font-style: normal;
    font-weight: 500;
    line-height: normal;
    letter-spacing: 0.54px;
}

header#site-header #logo img[src*='svg'], header#site-header #logo img[src*="svg"] {
    width: 314px;
}

html[dir="ltr"] body.header-13-lg header#site-header nav.cta-links {
    margin-right: var(--base-half-spacing);
    right: 0;
    top: 55px;
}

.routes-pods-thumbs .listing-pods {
    width: 80%;
    margin: auto;
}

.routes-pods-thumbs .usn_pod_textimage {
    text-align: center !important;
}

.routes-pods-thumbs img {
    width: 232px !important;
}

.routes-pods-thumbs-row {
    display: flex;
    gap: 150px;
    justify-content: center;
    margin-bottom: 40px;
}

.item.swp-item.items-3.col-12.item_text-below.usn_pod_relatedcontent.text-left {
    width: 100%;
    display: flex;
    flex: 0 0 100%;
    max-width: 100%;
    flex-direction: column;
}

.usn_pod_relatedcontent .inner a {
    width: 100%;
    display: flex;
    flex: 0 0 100%;
    max-width: 100%;
    flex-direction: row-reverse;
}

.usn_pod_relatedcontent .image {
    width: 22%;
}

.usn_pod_relatedcontent .info  {
    width: 78%;
}

@media (max-width: 767px) {
    .routes-pods-thumbs-row {
        display: flex;
        gap: 25px;
        justify-content: center;
        margin-bottom: 25px;
        flex-direction: column;
        align-items: center;
    }
}

@media (min-width: 1200px) and (max-width: 1520px) {
    /*#countItem_1:hover .submenuPopUp {
        left: calc(10vw - 1105px / 2);
    }

    #countItem_1 .submenuPopUp {
        width: 950px;
    }*/
}

@media (min-width: 992px) and (max-width: 1600px) {

    #countItem_1:hover .submenuPopUp {
        left: calc(14vw - 999px / 2);
    }

    #countItem_1 .submenuPopUp {
        width: 950px;
    }


    #countItem_2:hover .submenuPopUp {
        left: calc(2vw - 999px / 2);
    }

    #countItem_2 .submenuPopUp {
        width: 950px;
    }

    #countItem_3:hover .submenuPopUp {
        left: calc(0vw - 1340px / 2);
    }

    #countItem_3 .submenuPopUp {
        width: 950px;
    }
}



@media (min-width: 992px) and (max-width: 1060px) {
    button.expand-subpages {
        border: 0;
        background-color: transparent;
        position: relative;
        height: 45px;
        display: flex;
        align-items: center;
        gap: 6px;
        font-size: 18px;
        font-style: normal;
        font-weight: 700;
    }

    .Main-navigation-desktop {
        gap: 155px;
    }
}

@media (max-width: 991px) {

    /* Start Main Navigation Css Mobile */
/*
    html.no-touch body.header-13-lg header#site-header nav.main ul > li:hover > ul, body.header-13-lg header#site-header nav.main ul > li.open-child > ul {
        top: 0;
        left: initial;
        right: inherit;
    }
*/

    .Main-navigation-desktop {
        display: block;
        gap: 0;
        width: 100% !important;
    }
/*
    html.reveal-out header#site-header {
        background-color: #fff;
    }

    .reveal-out div.hidden-desktop {
        border-bottom: 1px solid #010524;
        display: flex;
        height: 45px;
        padding: 10px;
        flex-direction: column;
        align-items: center;
        gap: 10px;
        width: 200px;
        color: #000;
        text-align: center;
        font-size: 22px;
        font-style: normal;
        font-weight: 500;
        line-height: normal;
        margin: 0 auto;
    }

    .reveal-out .mobile-menu-cnt {
        background-color: #fff !important;
        position: absolute;
        top: 0;
        right: auto;
        height: calc(100vh);
        z-index: 1;
        width: 100% !important;
        display: flex;
        flex-direction: column;
    }*/

    body.header-13-lg header#site-header .row {
        align-items: flex-start;
        height: auto;
        justify-content: space-between;
    }

    /*body.header-13-lg header#site-header nav.main {
        position: relative;
        top: 0px;
        right: auto;
        z-index: 1;
        background-color: #fff;
        height: auto;
        order: 3;
    }

    nav.secondary > ul {
        display: flex;
        flex-direction: column;
        width: 100%;
    }

    .directional-icons-chevron nav.main ul li.has-child > span::after, .directional-icons-chevron nav.main ul ul li.has-child > span::after {
        content: "\f3d0";
        transform: rotate(-90deg);
    }


    body.header-03-sm header#site-header nav.cta-links {
        order: 3;
        position: relative;
        padding: 10px;
        border-bottom: 1px #E6E6E6 solid;
        margin-top: 10px;
    }

    .cta-links .btn, .cta-links a.btn:link, .cta-links a.btn:link, .cta-links a.btn:hover, .cta-links a.btn:link, .cta-links a.btn:active, .cta-links a.btn:visited {
        background-color: transparent;
        border: 0 none;
        text-align: left;
        padding: 0;
        color: #333;
        font-weight: normal;
    }

        .cta-links .btn > span {
            position: relative;
        }

    header#site-header nav.main a:hover {
        text-decoration: none !important;
        text-decoration-color: transparent !important;
    }


    body.header-03-sm header#site-header nav.secondary {
        order: 3;
        position: relative;
        top: 0px;
        right: auto;
        z-index: 1;
        padding: 0px;
    }

    button.expand-subpages {
        width: 100%;
        text-align: left;
        border: 0 none;
        background-color: transparent;
        padding: 10px 10px;
        line-height: 150% !important;
        display: flex;
        justify-content: space-between;
        font-weight: 700;
    }

    .submenuPopUp {
        position: absolute;
        top: 60px;
        background-color: #fff !important;
        width: 100%;
        height: calc(92vh);
        z-index: 1;
    }

    nav.main ul > li.open-child_mobile > ul {
        display: block;
        z-index: 9;*/
        /*border: 1px solid #ff0000;*/
        /*height: calc(100vh);
        top: 0;
        position: fixed;
    }


    header#site-header .expand-header-close {
        position: relative;
        top: 0;
        right: 0;
        z-index: 1;
        text-decoration: none !important;
        cursor: pointer;
        background: none;
        outline: none;
        text-indent: initial;
        display: flex;
        width: 150px;
        height: 55px;
        padding: 0 5px;
        flex-direction: column;
        justify-content: center;
        align-items: center;
        gap: 10px;
        border-radius: 5px;
        border: 1px solid #010524;
        margin: 20px auto;*/
        /* End Main Navigation Css Mobile */
    /*}

        header#site-header .expand-header-close label {
            margin-bottom: 0 !important;
        }

    .header#site-header .expand-header {
        display: none;
    }

    .reveal-out header#site-header .expand-header {
        display: none;
    }

    .LinkMenuIcon {
        background-image: url('../../images/shared/arrow_right.svg');
        background-repeat: no-repeat;
        background-position: center center;
        width: 10px;
        height: 25px;
        display: inline-block;
    }

    nav.secondary ul li {
        overflow: hidden;
        height: 100%;
        display: block;
        border-bottom: 1px #e6e6e6 solid;
        padding: 0 10px;
        min-height: 45px;
        margin-top: 20px;
    }

    body.header-03-sm header#site-header nav.main > ul, body.header-03-sm header#site-header nav.main > ul li {
        border: 0 none;
        margin: 10px 0 0 0;
        font-weight: 700;
    }

        body.header-03-sm header#site-header nav.main > ul li:not(:first-child) {
            border: 0 none;
            margin: 20px 0 0 0;
            font-weight: 700;
        }

    .submenuPopUp {
        border-bottom: 0 none;
    }

    .link-item-border {
        border-bottom: 1px #E6E6E6 solid !important;
    }

    .expand-subpages:hover .LinkMenuIconDesktop {
        -moz-transform: rotate(180deg);
        -ms-transform: rotate(180deg);
        -o-transform: rotate(180deg);
        -webkit-transform: rotate(180deg);
        transform: rotate(0deg);
    }

    button.expand-subpages {
        border: 0;
        background-color: transparent;
        position: relative;
        height: 45px;
        display: flex;
        align-items: center;
        gap: 6px;
        font-size: 16px;
        font-style: normal;
        font-weight: 700;
    }

    body.header-13-lg header#site-header nav.cta-links .btn {
        background-color: transparent;
        border: 0 none;
        text-align: left;
        padding: 0;
        color: #333 !important;
        font-weight: normal;
        justify-content: left;
    }

    body.header-03-sm header#site-header nav.cta-links {
        order: 3;
        position: relative;
        padding: 0 10px;
        border-bottom: 1px #E6E6E6 solid;
        margin-top: 10px;
    }

    html[dir="ltr"] body.header-13-lg header#site-header nav.cta-links {
        margin-right: var(--base-half-spacing);
        right: 0;
        top: auto;
        margin-top: 90px;
    }*/

    .language-selector-icon {
        display: none;
    }

    .usn_pod_relatedcontent .inner a {
        flex-direction: column;
    }

    .usn_pod_relatedcontent .image {
        width: 100%;
    }

    .usn_pod_relatedcontent .info {
        width: 100%;
    }

    /* START New Css Mobile Menu*/
    body.header-13-lg header#site-header nav.main {
        height: auto;
    }
    body.header-03-sm nav.main ul li.has-child.open-child_mobile > span::after, body.header-03-sm header#site-header nav.main ul ul li {
        background-color: #000426;
        color: #fff !important;
    }

    body.header-03-sm nav.main ul ul > li.active > span > a {
        color: #ffde00;
    }
    body.header-03-sm nav.main ul ul > li > span > a {
        color: #fff;
    }
        body.header-03-sm nav.main ul ul > li > span > a:hover, body.header-03-sm nav.main ul ul > li:hover > span > a {
            color: #fff;
        }
    body.header-03-sm nav.main ul ul li.has-child > span::after {
        color: #fff !important;
    }
    body.header-13-lg header#site-header nav.secondary {
        margin-right: calc(var(--base-half-spacing) / 2);
        top: 0;
        right: 0;
        position: relative;
    }

    html[dir="ltr"] body.header-13-lg header#site-header nav.cta-links {
        margin-right: var(--base-half-spacing);
        right: 0;
        position: relative;
        top: 0px;
    }

    body.header-13-lg header#site-header nav.cta-links .btn, body.header-13-lg header#site-header nav.cta-links .btn > span {
        background-color: transparent;
        border: none;
        padding: 0;
        height: auto;
        width: 100%;
        color: #333;
        justify-content: flex-start;
    }
    /* END New Css Mobile Menu*/

}

@media (min-width: 991px) {
    nav.secondary ul li.dropdown .dropdown-menu {
        width: 140px;
        max-width: 140px;
        min-width: 140px;
    }
}
}
