#header {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    position: fixed;
    width: 100%;
    top: 0;
    z-index: 9;
    left: 0;
    box-sizing: border-box;
    transition: all 150ms ease-in-out;
    background: var(--white);
}

#header.bg_transparent {
    background: linear-gradient(180deg, #001137 13.13%, rgba(0, 17, 55, 0.00) 100%);
}

#header.bg_transparent.scrolled {
    background: var(--primary);
}

#header .header_top {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 20px 40px;
    position: relative;
    min-height: 80px;
}

#header .header_bottom .hidden_container {
    padding: 0 0 20px;
}

#header .header_bottom {
    display: flex;
    align-items: center;
    justify-content: center;
    max-height: 1000px;
    box-sizing: border-box;
    transition: all 300ms ease-in-out;
}

#header:not(:hover) .header_bottom.hidden {
    max-height: 0;
    overflow: hidden;
}

#header ul.main_menu li a {
    text-decoration: none;
    /*color: #000;*/
    color: var(--primary);
}

#header.bg_transparent ul.main_menu li a {
    color: var(--white);
}

#header .contact_link_container {
    display: flex;
    gap: var(--gap-s);
}

#header .contact_link_container > a {
    display: flex;
    gap: var(--gap-s);
    align-items: center;
    text-decoration: none;
    color: var(--error);
    margin: 0;
    position: relative;
}

#header .contact_link_container > a:before {
    content: '';
    background: center / cover no-repeat url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' fill='none'%3e%3cpath fill='%23FF0000' d='m19.97 15.117-.908 3.937a1.214 1.214 0 0 1-1.19.946C8.016 20 0 11.984 0 2.129c0-.573.39-1.062.946-1.19L4.884.032A1.226 1.226 0 0 1 6.282.74l1.817 4.238c.213.5.07 1.081-.35 1.424L5.644 8.09a13.659 13.659 0 0 0 6.231 6.23l1.722-2.102c.34-.42.926-.566 1.425-.35l4.239 1.816c.51.269.841.862.709 1.433Z'/%3e%3c/svg%3e");
    width: 20px;
    height: 20px;
    display: block;
}

#header .contact_link_container > a.mail_link:before {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='20' height='16' fill='none'%3e%3cpath fill='%23FF0000' d='M10 11.75a2.986 2.986 0 0 1-1.842-.641L0 4.766v8.859C0 14.66.84 15.5 1.875 15.5h16.25c1.035 0 1.875-.84 1.875-1.875v-8.86l-8.156 6.348c-.551.426-1.2.637-1.844.637ZM.636 3.676l8.29 6.449a1.751 1.751 0 0 0 2.15 0l8.29-6.45c.364-.312.634-.792.634-1.3C20 1.339 19.16.5 18.125.5H1.875C.839.5 0 1.34 0 2.375c0 .508.235.988.636 1.3Z'/%3e%3c/svg%3e");
    height: 15px;
}

/*** Search ***/

.search-wrapper {
    height: 95px;
    max-height: 0;
    width: 100%;
    box-sizing: border-box;
    top: 0;
    z-index: 7;
    overflow: hidden;
    transition: 0.15s;
    position: relative;
}

.search-wrapper.open {
    max-height: 95px;
}

.search-wrapper .close-search {
    position: absolute;
    top: 10px;
    right: 10px;
    cursor: pointer;
    width: 15px;
    height: 15px;
    transition: 0.3s;
    background: no-repeat center / 20px url("data:image/svg+xml,%3C%3Fxml version='1.0' %3F%3E%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 128 128'%3E%3Cpath fill='%23525050' d='M123.5 11.6l-7-7L64 56.8 11.6 4.5l-7.1 7L56.9 64 4.5 116.4l7 7L64 71.2l52.4 52.4 7.1-7L71.1 64z'/%3E%3C/svg%3E");
}

.search-wrapper .close-search:hover {
    opacity: 0.7;
}

.search-wrapper > div {
    padding: 20px 50px;
    box-sizing: border-box;
    height: 100%;
    display: flex;
    align-items: flex-end;
}

.search-wrapper > div form {
    position: relative;
    height: 100%;
    width: 100%;
}

.search-wrapper > div form * {
    height: 100%;
}

.search-wrapper > div form input[type=text] {
    width: 100%;
    box-sizing: border-box;
    background-color: transparent;
    /*border: none;*/
    border: 1px solid var(--white);
    padding-left: 20px;
    outline: none;
}

.search-wrapper > div form input[type=submit] {
    position: absolute;
    top: 0;
    right: 0;
    width: 50px;
    text-indent: -9999px;
    overflow: hidden;
    border: none;
    transition: 0.3s;
    cursor: pointer;
    background: no-repeat center / 25px url("data:image/svg+xml,%3Csvg fill='none' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 18 18'%3E%3Cg clip-path='url(%23clip0)' fill-rule='evenodd' clip-rule='evenodd'%3E%3Cpath d='M0 7.4a7.2 7.2 0 0111.3-6 7.1 7.1 0 011.7 9.8.3.3 0 00.2.3l4.4 4.5a1.2 1.2 0 01-.3 1.9 1.2 1.2 0 01-1.3-.3l-3-3-1.5-1.4a.3.3 0 00-.5 0A7.1 7.1 0 010 7.4zm7.2-5.8a5.5 5.5 0 00-5.5 6.6A5.5 5.5 0 006 12.6 5.6 5.6 0 0012.6 7a5.5 5.5 0 00-5.4-5.5z' fill='%23171717'/%3E%3Cpath d='M0 7.4a7.2 7.2 0 0111.3-6 7.1 7.1 0 011.7 9.8.3.3 0 00.2.3l4.4 4.5a1.2 1.2 0 01-.3 1.9 1.2 1.2 0 01-1.3-.3l-3-3-1.5-1.4a.3.3 0 00-.5 0A7.1 7.1 0 010 7.4zm7.2-5.8a5.5 5.5 0 00-5.5 6.6 5.5 5.5 0 007.5 4 5.5 5.5 0 001.8-9c-1-1-2.4-1.5-3.8-1.6z' fill='%23525050'/%3E%3C/g%3E%3Cdefs%3E%3CclipPath id='clip0'%3E%3Cpath fill='%23525050' d='M0 0h18v18H0z'/%3E%3C/clipPath%3E%3C/defs%3E%3C/svg%3E");
}

#header.bg_transparent .search-wrapper > div form input[type=submit] {
    background: no-repeat center / 25px url("data:image/svg+xml,%3Csvg fill='none' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 18 18'%3E%3Cg clip-path='url(%23clip0)' fill-rule='evenodd' clip-rule='evenodd'%3E%3Cpath d='M0 7.4a7.2 7.2 0 0111.3-6 7.1 7.1 0 011.7 9.8.3.3 0 00.2.3l4.4 4.5a1.2 1.2 0 01-.3 1.9 1.2 1.2 0 01-1.3-.3l-3-3-1.5-1.4a.3.3 0 00-.5 0A7.1 7.1 0 010 7.4zm7.2-5.8a5.5 5.5 0 00-5.5 6.6A5.5 5.5 0 006 12.6 5.6 5.6 0 0012.6 7a5.5 5.5 0 00-5.4-5.5z' fill='white'/%3E%3Cpath d='M0 7.4a7.2 7.2 0 0111.3-6 7.1 7.1 0 011.7 9.8.3.3 0 00.2.3l4.4 4.5a1.2 1.2 0 01-.3 1.9 1.2 1.2 0 01-1.3-.3l-3-3-1.5-1.4a.3.3 0 00-.5 0A7.1 7.1 0 010 7.4zm7.2-5.8a5.5 5.5 0 00-5.5 6.6 5.5 5.5 0 007.5 4 5.5 5.5 0 001.8-9c-1-1-2.4-1.5-3.8-1.6z' fill='white'/%3E%3C/g%3E%3Cdefs%3E%3CclipPath id='clip0'%3E%3Cpath fill='white' d='M0 0h18v18H0z'/%3E%3C/clipPath%3E%3C/defs%3E%3C/svg%3E");
}

#header.bg_transparent .search-wrapper > div form input::placeholder {
    color: var(--white);
}

#header.bg_transparent .search-wrapper > div form input {
    color: white;
    padding-right: 50px;
}

.search-wrapper > div form input[type=submit]:hover {
    opacity: 0.7;
}

.search-wrapper > div ::-webkit-input-placeholder {
    /* Chrome/Opera/Safari */
    color: #525050;
}

.search-wrapper > div ::-moz-placeholder {
    /* Firefox 19+ */
    color: #525050;
}

.search-wrapper > div :-ms-input-placeholder {
    /* IE 10+ */
    color: #525050;
}

.search-wrapper > div :-moz-placeholder {
    /* Firefox 18- */
    color: #525050;
}

/*TODO variable on primary colour*/
.search-toggle {
    background: no-repeat center / 28px url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='28' height='28' fill='none'%3e%3cpath fill='%23001137' d='m27.3 24-6-6c1.3-1.8 2-4 2-6.3a11.7 11.7 0 1 0-5.2 9.7l6 6a2.3 2.3 0 1 0 3.2-3.4ZM3.5 11.7a8.2 8.2 0 1 1 16.4 0 8.2 8.2 0 0 1-16.4 0Z'/%3e%3c/svg%3e");
    display: flex;
    height: 100%;
    width: 30px;
    aspect-ratio: 10 / 10;
    cursor: pointer;
}

.bg_transparent .search-toggle {
    background: no-repeat center / 28px url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='28' height='28' fill='none'%3e%3cpath fill='white' d='m27.3 24-6-6c1.3-1.8 2-4 2-6.3a11.7 11.7 0 1 0-5.2 9.7l6 6a2.3 2.3 0 1 0 3.2-3.4ZM3.5 11.7a8.2 8.2 0 1 1 16.4 0 8.2 8.2 0 0 1-16.4 0Z'/%3e%3c/svg%3e");

}

.bg_transparent  .menu_cta a:nth-child(2) {
    filter: invert(1) grayscale(1005);
}