/home/moonrcjl/template.moontelict.com/a.laxfy/assets/scss/components/_search.scss
@use '../utils' as *;

/*----------------------------------------*/
/*  2.16 Search css start
/*----------------------------------------*/


.mt-header-search-bar {
    height: 400px;
    position: fixed;
    top: -100%;
    left: 0;
    right: 0;
    z-index: 99999999;
    background: var(--mt-common-white);
    @include transition(.4s);

    &.mt-search-open {
        top: 0;
    }

}

.contact-search-form-box {
    & form {
        position: relative;

        & input {
            color: #000;
            border: 0;
            border-bottom: 1px solid #000;
            border-radius: 0;
            padding-left: 0;

            @include placeholder {
                color: #000000;
            }
        }

        & button {
            position: absolute;
            right: 0;
            top: 13px;
            font-size: 17px;
            color: #000;
        }
    }
}

.mt-search-close {
    position: absolute;
    right: 50px;
    top: 35px;
    font-size: 50px;
    color: var(--mt-common-black);
    font-weight: 300;
    width: 45px;
    height: 45px;

    &:hover {
        @include transform(rotate(90deg));
 
    }
}

.mt-search-bar-title {
    color: var(--mt-common-black);

    @media #{$md,$xs} {
        font-size: 25px;
    }
}