.search-overlay{

    position:fixed;

    inset:0;

    background:rgba(0,0,0,.45);

    opacity:0;

    visibility:hidden;

    transition:.3s;

    z-index:5000;
}

.search-overlay.active{

    opacity:1;

    visibility:visible;
}

.search-modal{

    position:fixed;

    top:150px;

    left:50%;

    transform:translateX(-50%);

    width:700px;

    max-width:90%;

    background:white;

    border-radius:20px;

    padding:30px;

    z-index:5001;

    opacity:0;

    visibility:hidden;

    transition:.3s;
}

.search-modal.active{

    opacity:1;

    visibility:visible;
}

#siteSearch{

    width:100%;

    padding:18px;

    border:1px solid #ddd;

    border-radius:12px;

    font-size:18px;
}

.search-result{

    padding:15px;

    border-bottom:1px solid #eee;

    cursor:pointer;
}

.search-result:hover{

    background:#fff5f6;
}