.search-icon {
     cursor: pointer;
 }

 .search-wrapper {
     position: fixed;
     left: 0;
     top: 0;
     width: 100%;
     height: 100%;
     z-index: 9999;
     background-color: rgba(2, 45, 98, 0.95);
     opacity: 1;
     visibility: hidden;
     transform: scale(1.1);
     transition: visibility 0s linear 0.25s, opacity 0.25s 0s, transform 0.25s;
 }

 .show-modal {
     opacity: 1;
     visibility: visible;
     transform: scale(1.0);
     transition: visibility 0s linear 0s, opacity 0.25s 0s, transform 0.25s;

 }


 .search-content {
     position: absolute;
     top: 50%;
     left: 50%;
     transform: translate(-50%, -50%);
     padding: 1rem 1.5rem;
     width: 44rem;
     border-radius: 0.5rem;

 }

 .search-wrapper input {
     padding: 0.9rem 1rem;
     width: 80%;
     margin: 0 auto;
     border: none;
     border-radius: 10px;
     font-size: 0.9em;
 }

 .search-wrapper input:focus {
     outline: none;
 }

 .search-search-icon {
     text-align: center;
     padding: 0.7rem 1rem;
     cursor: pointer;
 }

 .search-wrapper .btn {
     padding: 0.9rem 1rem;
     margin: 0 auto;
     border-radius: 10px;
     cursor: pointer;
     background-color: #022D62;
     color: white;
     text-align: center;
     font-size: 1em;
     outline: none;
 }

 .close-button {
     position: relative;
     left: 95%;
     top: 10%;
     transform: translate(10px, -20px);
     padding: 0.5rem 0.7rem;
     font-size: 1rem;
     transition: all 0.3s;
     cursor: pointer;
     font-size: 2rem;
     font-weight: bold;
     color: #ffffff;
 }