#search-form {
     display: flex;
     align-items: center;
     justify-content: center;
     margin-bottom: 20px;
     width: 200px;
}
 #search-input {
     font-size: 18px;
     padding: 10px;
     border: 1px solid #ddd;
     border-radius: 4px 0 0 4px;
     box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
     outline: none;
     transition: border-color 0.2s ease;
     width: 200px;
     height: 45px;
}
 #search-input:focus {
     border-color: #00b5ad;
}
 #search-form button {
     font-size: 19px;
     padding: 8px;
     border: none;
     border-radius: 0 4px 4px 0;
     background-color: #00b5ad;
     color: #fff;
     cursor: pointer;
     transition: background-color 0.2s ease;
}
 #search-form button:hover {
     background-color: #00a09d;
}
 #search-results {
     list-style: none;
     margin: 0;
     padding: 0;
}
 #search-results a {
     display: block;
     font-size: 18px;
     color: #333;
     text-decoration: none;
     padding: 18px;
     border-bottom: 1px solid #ddd;
     transition: background-color 0.2s ease;
}
 #search-results a:hover {
     background-color: #f5f5f5;
}
 #search-form button:focus {
     animation: pulse 1s infinite;
}
 @keyframes pulse {
     0% {
         transform: scale(1);
    }
     50% {
         transform: scale(1.1);
    }
     100% {
         transform: scale(1);
    }
}
 outline: none;
/* remove the default focus outline */
 box-shadow: 0 0 0 3px #00b5ad;
/* add a custom focus effect */undefined}undefined #search-form button {
 transition: all 0.2s ease;
/* transition all properties with a duration of 0.2 seconds and an easing effect */undefined}undefined #search-results a span {
 font-size: 14px;
 color: #999;
 font-style: italic;
 margin-left: 10px;undefined}undefined