header {
    border-bottom: 1px solid #e6e6e6;
    margin-bottom: 2.875rem;
}
/*.main-header{
    margin-bottom: 2.875rem;
}*/
.header-wrapper{
    justify-content: space-between;
    align-items: center;
    /*border-bottom: 1px solid #000;*/
}

.header-wrapper .logo{
    width:286px;
    padding-top: 2.625rem;
    padding-bottom: 2.875rem;
}

.header-wrapper .nav-wrapper{
    align-items: center;
}

.header-wrapper .nav-wrapper .mob{
    display: none;
}

.header-wrapper .nav-item{
    font-size: 0.9365rem;
    line-height: 2.625rem;
    letter-spacing: 1.123px;
    margin-right: 3rem;
    font-family: "PFDasGroteskProBlack";
    text-transform: uppercase;
    position: relative;
}

.header-wrapper .nav-item:before{
    width: 0;
    content: "";
    position: absolute;
    left: 0;
    bottom: 0.525rem;
    border-bottom: 2px solid #FBDD66;
    transition: width 0.3s;
}

.header-wrapper .nav-item:hover:before{
    width: 100%;
}

.header-wrapper .sub-menu{
    position: absolute;
    top: calc(100% + 2.875rem);
    left: -1.6875rem;
    z-index: 2;
    background-color: #FBDD66;
    overflow: hidden;
    max-height: 0;
    transition: max-height 0.3s;
}

.header-wrapper .nav-item:last-child .sub-menu{
    right: -2rem;
    left: unset
}


.header-wrapper .nav-item:hover .sub-menu_, .header-wrapper .nav-item.active .sub-menu{
    max-height: 1000px;
}

.header-wrapper .sub-menu ul{
    padding: 1.375rem 1.6875rem;
    min-width: 218px;
    box-sizing: border-box;
}

.header-wrapper .sub-menu li{
    font-size: 1.0625rem;
    letter-spacing: 0.17px;
    line-height: 2rem;
    font-family: "PFDasGroteskProMedium";
    text-transform: capitalize;
}

.header-wrapper .sub-menu .caret-wrapper{
    display: none;
}

.header-wrapper .search{
    margin-left: 1.75rem;
    cursor: pointer;
    padding: 1rem 0 1rem 1rem;
    position: relative;
}

.header-wrapper .search.hide{
    display: none;
}

.header-wrapper .search-icon{
    width: 1.0625rem;
}

.header-wrapper .search-wrapper{
    position: absolute;
    right: 0;
    top: calc(100% + 2.6rem);
    width: 450px;
    max-height: 0;
    transition: max-height 0.3s;
    overflow: hidden;
    z-index: 10;
}

.header-wrapper .search-wrapper.active{
    max-height: 1000px;
}

.header-wrapper .search-box{
    padding: 1rem 2rem;
    background-color: #FBDD66;
}

.header-wrapper .search-wrapper input {
    width: 100%;
    background-color: transparent;
    border:none;
    outline: none;
    font-size: 1.0625rem;
    height: 40px;
}

.header-wrapper .search-wrapper button {
    width: fit-content;
    margin: 0 auto;
    align-items: center;
    font-size: 0.75rem;
    letter-spacing: 0.6px;
    padding: 10px 26px;
    background-color: #fff;
    border: unset;
    border: 1px solid #999999;
}

.header-wrapper .search-wrapper .close{
    /* position: absolute;
    right: 1rem;
    top: 50%;
    width: 1rem;
    transform: translateY(-50%); */
    position: absolute;
    right: 1rem;
    top: 1rem;
    width: 1rem;
}

.header-wrapper .nav-btn{
    display: none;
}

@media screen and (max-width: 1220px) {
    .header-wrapper .nav-item{
        margin-right: 2rem;
    }
    .header-wrapper .search{
        margin-left: 1rem;
    }
}
@media screen and (max-width: 1180px) {
    .main-header{
        margin-bottom: 2rem;
    }
}
@media screen and (max-width: 980px) {
    .main-header{
        position: relative;
        z-index: 10;
    }
    .header-wrapper{
        background-color: #fff;
    }
    .header-wrapper .logo{
        width:225px;
        padding-top: 1.375rem;
        padding-bottom: 1.375rem;
    }
    .header-wrapper nav{
        position: absolute;
        left: 0;
        top: -150vh;
        z-index: -1;
        background-color: #fff;
        width: 100%;
        min-height: calc(100vh - 72px);
        padding: 0 1.625rem;
        box-sizing: border-box;
        transition: top 0.3s;
    }

    .header-wrapper nav.active{
        top: 100%;
    }

    .header-wrapper nav > ul{
        flex-direction: column;
    }
    .header-wrapper .nav-item{
        margin-right: 0;
        border-bottom: 1px solid #E6E6E6;
    }
    .header-wrapper .nav-item:hover:before{
        width: 0;
    }
    .header-wrapper .sub-menu{
        position: relative;
        max-height: 1000px;
        left: 0;
        background-color: #fff;
        overflow: initial;
    }
    .header-wrapper .nav-item:last-child .sub-menu{
        right:0;
    }
    .header-wrapper .sub-menu .caret-wrapper{
        display: block;
        position: absolute;
        right: 0;
        top: -2rem;
    }
    .header-wrapper .sub-menu .caret{
        transform-origin: center;
        transition: transform 0.3s;
    }
    .header-wrapper .sub-menu.active .caret{
        transform: rotate(180deg);
    }
    .header-wrapper .sub-menu ul{
        padding-top: 0;
        padding-bottom: 0;  
        max-height: 0;
        overflow: hidden;
        transition: max-height 0.3s;  
    }
    .header-wrapper .sub-menu.active ul{
        max-height: 1000px;
        padding-bottom: 0.5rem;
    }
    .header-wrapper .nav-wrapper .mob{
        display: block;
        padding-bottom: 3rem;
    }
    .header-wrapper .nav-wrapper .mob .info{
        border-bottom: 1px solid #e6e6e6;
        margin-bottom: 2.125rem;
        font-size: 0.9365rem;
        line-height: 2.125rem;
        padding: 0.5rem 0;
    }
    .header-wrapper .nav-btn{
        display: block;
        padding: 0.5rem 0 0.5rem 0.5rem; 
        margin-left: 1.625rem;
        cursor: pointer;
    }

    .header-wrapper .search.hide{
        display: none;
    }
    .header-wrapper .search-wrapper{
        top: calc(100% + 1rem);
        right : calc(-1 * (28px + 2.125rem));   
    }

    .header-wrapper .nav-btn.close .icon{
        display: none;
    }
    .header-wrapper .nav-btn.close .icon-close{
        display: block;
    }
    .header-wrapper .nav-btn .icon-close{
        display: none;
        width: 24px;
    }
}

@media screen and (max-width: 780px) {
    .main-header{
        margin-bottom: 0;
    }
    .header-wrapper{
        border-bottom: none;
        position: relative;
    }
}

@media screen and (max-width: 620px) {
    .header-wrapper .search-wrapper {
        width: calc(100vw - 52px);
    } 
    .header-wrapper .search-box{
        padding: 1rem 1.625rem;
    }   
}
@media screen and (max-width: 580px) {
    .header-wrapper .logo{
        width:174px;
    } 
    .header-wrapper .search-wrapper {
        top: calc(100% + 12px);
    }
}

@media screen and (max-width: 520px) {
    /*
    .header-wrapper{
        border-bottom: none;
        position: relative;
    }
    
    .header-wrapper:after{
        content: "";
        width: calc(100% + 52px);
        border-top:1px solid #000;
        position: absolute;
        bottom: 0;
        left: -26px;
    }
    */
}
@media screen and (max-width: 480px) {
    .nav-wrapper .social ul{
        width: 100%;
        justify-content: space-between;
    }    
}
@media screen and (min-width: 900px) {
.header-wrapper .sub-menu ul li ul {
    max-height: 0;
    padding: 0;
    visibility: hidden;
    transition: all 0.3s;
    opacity: 0;
    margin-inline-start: 20px;
}
.header-wrapper .sub-menu ul li:hover ul {
    max-height: 1000px;
    visibility: visible;
    opacity: 1;
}
.header-wrapper .sub-menu ul li:hover ul {
    max-height: 1000px;
}
}
/*
.drop input[type=checkbox]:checked ~ .control:after {
    transform: rotate(90deg);
}*/
li.sub-sub {
    position: relative;
    list-style-type: disclosure-closed;
    transition: all .3s;
}
li.sub-sub:hover {
    list-style-type: disclosure-open;
}