#site_header.up {
opacity: 1;
transition: all .3s ease;
background-color: white;
}
#site_header.down {
opacity:0;
transition: all .3s ease;
}
#site_header.up:has(.open),
#site_header.down:has(.open) {
opacity: 1;
} #site_header.up:hover,
#site_header.down:hover {
opacity: 1;
transition: all .3s ease;
background-color: white;
}
#site_header:hover {
opacity: 1;
transition: all .3s ease;
}
.div_header:has(.open) {
width: 100%;
background-color: white;
} @media (min-width: 769px) { .menu_hover.spem_menu_a {
line-height: 2;
font-weight: 600;
color: var(--main-gold);
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
display: inline;
}
.spem_menu_li:hover > .spem_menu_a {
opacity: 0;
}
.spem_menu_a,
.menu_hover {
transition: all .2s ease;
}  .dropdown {
position: relative;
}
.dropdown-content.spem_menu_ul {
transform-origin: top;
position: absolute;
left: -1.5px;
border-top: 6px solid transparent;
width: max-content;
transition: all .3s ease;
flex-direction: column;
}
.dropdown-content li:first-child,
.dropdown-content li:last-child {
border-top: none;
}
.dropdown-content li {
padding: 1rem;
border-bottom: 1px solid var(--main-gold);
width: 100%;
text-align: center;
}
.dropdown-content li {
background-color: var(--light-grey);
}
}
@media (max-width: 768px) {
.spem_menu.open {
width: 100%;
left: 0;
top: 0;
bottom: 0;
}
.spem_menu_nav {
position: fixed;
}
.spem_menu_nav li {
width: 70%;
}
.spem_menu_nav.open {
transform: scaleY(1);
position: fixed;
pointer-events: auto;
}
.spem_menu_nav.open li {
width: 70%;
} .burger_span.open {
background: transparent;
}
.burger_span.open::before,
.burger_span.open::after {
top: 0;
background-color: var(--main-grey);
}
.burger_span.open::before {
transform: rotate(45deg);
}
.burger_span.open::after {
transform: rotate(-45deg);
}
}