#header-search-form{
    padding:0 20px;
    font-size:0;
}

#header-search-form input.search-field{
    display:inline-block;
    width:70%;
    height:38px;
    padding:10px;
    border-radius:4px;
    border:none;
    vertical-align: top;
    box-shadow:inset 0 0 0px 1px #999;
    border-radius:4px 0px 0px 4px;
    font-size: 0.75rem;
}
#header-search-form input.search-submit{
    display:inline-block;
    position: relative;
    width:30%;
    height:38px;
    padding: 11px 0px;
    background:#328f47;
    vertical-align: top;
    font-family: 'Exo 2', sans-serif;
    font-size: 0.75rem;
    font-weight:900;
    border-radius:0 4px 4px 0;
    transition: all .2s ease-in-out;
}
#header-search-form input.search-submit:hover,
#header-search-form input.search-submit:focus,
#header-search-form input.search-submit:active{
    background:#37af53;
}
#header-search-form button#search-close{
    display:none;
}

#search-activate{
    cursor: pointer;
}
@media (min-width:1024px){
    header #ubermenu-main-2-primary-2{
        transition: all .1s ease-in-out;
    }
    header.searching #ubermenu-main-2-primary-2{
        visibility: hidden;
    }
    header:not(.searching) #ubermenu-main-2-primary-2{
        visibility:visible;
        transition-delay: 0.3s;
    }

    .ubermenu-skin-clean-white.ubermenu-horizontal .ubermenu-item-level-0 > .ubermenu-target{
        padding-top:10px;
        padding-bottom:10px;
    }

    #header-search-form{  
         visibility: hidden;
        position: absolute;
        transition: all 0.3s ease-in-out;
        transform: translateY(-180px);
        top: 0px;
        width: 100%;
        z-index:999;
    }
    header.active #header-search-form{
         visibility: visible;
    }
     #header-search-form input.search-field{
        width:80%;
        font-size:1rem;
        position:relative;
        z-index:2;
     }
    #header-search-form input.search-submit{
        width:20%;
    }
    header.searching #header-search-form{
        transform: translateY(0); 
    }

    #header-search-form form.search-form{
        display:inline-block;
        width:90%;
        vertical-align: middle;
    }
    #header-search-form button#search-close{
        display:inline-block;
        width:auto;
        text-align:left;
        background:transparent;
        color:#fff;
        border:none;
        padding:10px 15px;
        vertical-align: middle;
        font-size:1.25rem;
    }
    header.not-transparent #header-search-form button#search-close{
        color:#000;
    }
}
