#search-modal {
    height: 1px;
    top: 0%;
    transition: height .5s ease-in-out;
    visibility: hidden;
}

body.show-modal #search-modal {
    background: rgba(51, 51, 51, 0.8);
    border: none;
    color: #666;
    display: initial;
    height: 100%;
    left: 50%;
    overflow-y: auto;
    position: fixed;
    transform: translate(-50%, -50%);
    transition: height .5s ease-in-out;
    top: 50%;
    visibility: visible;
    width: 100%;
    z-index: 999999;
}

body.show-modal {
    /*background-color: #333!important;*/
    overflow: hidden;
    position: fixed;
    width: 100%;
}

body.show-modal #main-content,
body.show-modal .pre-header,
body.show-modal header,
body.show-modal footer
{
    opacity: 0.05;
    pointer-events: none;
}

#search-modal .modal-header {
    align-items: center;
    display: flex;
    flex-flow: column;
    height: 20%;
    justify-content: center;
}

#search-modal .modal-header .wrapper-header {
    max-width: 600px;
    text-align: right;
    width: 100%;
}

#search-modal .modal-header .wrapper-header .close-modal a {
    color: #FFF;
    font-size: 30px;
    transition: color .5s ease-in-out;
}

#search-modal .modal-header .wrapper-header .close-modal a:hover {
    color: #2BC98A; /*Verde pantone*/
}

#search-modal .modal-body {
    align-items: center;
    display: flex;
    flex-flow: column;
    height: 80%;
    justify-content: center;
}

#search-modal .modal-body .wrapper {
    display: flex;
    flex-direction: column;
}

#search-modal .modal-body .searchform {
    max-width: 600px;
    width: 100%;
}

#search-modal .modal-body .searchform .search-field {
    background: transparent;
    border: 2px solid #FFF;
    -webkit-border-radius: 50px;
    -moz-border-radius: 50px;
    border-radius: 50px;
    box-shadow: none;
    color: #FFF;
    outline: none;
    padding: 6px 8px;
    width: 100%;
}

#search-modal .modal-body .searchform input[type="submit"] {
    background-color: #2BC98A; /*Verde pantone*/
    border: none;
    -webkit-border-radius: 50px;
    -moz-border-radius: 50px;
    border-radius: 50px;
    color: #FFF;
    cursor: pointer;
    margin: 20px auto 0;
    outline: none;
    padding: 6px 8px;
    width: 200px;
}

#search-modal .modal-body input::placeholder {
    color: #FFF;
}