@media (max-width: 991px) {
    
    .search-overlay input[type=text] {
        width: 300px;    
    }

}

/* Mobiles Portrait */
@media screen and (max-width : 767px) {

    #header .header_main_actions .open-search {
        position: relative;
        display: block;
        float: none;
        margin: 15px 0 0;
        text-align: center;
        padding: 5px;
        color: #fff !important;
        border-radius: 10px;
        z-index: 1;
        background-color: var(--primary);
        transition: linear background 0.8s;
        -webkit-transition: linear background 0.8s;
        -moz-transition: linear background 0.8s;
        -o-transition: linear background 0.8s;
    }

    #header .header_main_actions .open-search::before {
        position: absolute;
        content: "";
        top: 0;
        bottom: 0;
        left: 50%;
        right: 50%;
        border-radius: 10px;
        background: var(--primary);
        transition: linear all 0.3s;
        -webkit-transition: linear all 0.3s;
        -moz-transition: linear all 0.3s;
        -o-transition: linear all 0.3s;
        z-index: -1;
    }

    #header .header_main_actions .open-search:hover {
        background: transparent;
    }

    #header .header_main_actions .open-search:hover::before {
        left: 0;
        right: 0;
    }

    .search-overlay-content {
        left: 0;
        transform: translate(0, -50%);
        width: 100%;
        padding: 0 15px;
    }

    .search-overlay input[type=text] {
        width: calc(100% - 65px);
    }

    .search-overlay button {
        width: 65px;
    }

    .quicksearch_results ul {
        max-height: 120px;
    }
}