#header-top { height: 7rem; background-color: $white; box-shadow: 1px 0px 8px $black; display: flex; flex-direction: row; justify-content: space-between; color: $black; position: sticky; .region-header-top-left { display:flex; flex-direction: row; padding: 1rem; align-items: center; color: $black; font-weight: 800; position: sticky; ul{ list-style: none; display: flex; flex-direction: row; li { padding-right: 1rem; a { color: $black; .is-active { color: $blue-light; } } } .ul2{ flex-direction: column; } } :hover{ color: $blue-light; } // :visited { // color: $blue-light; // } } li ul { display: flex; flex-direction: column; } // .region-header-top-rigth { // width: 7rem; // height: 7rem; // } #block-burger { background-color: $blue-light; font-size: 0.7rem; color: $white; display: block; width: 7rem; height: 7rem; margin-top: 0; h2::after{ display: block; font-family: 'Font Awesome'; content: "\f0c9"; font-size: 5rem; } #block-burger-menu{ display: block; // content: url(../../images/pictos/icons8-menu.svg); margin-top: 0; align-self: center; text-align: center; } ul { display: none; .open{ width: 100vw; position: relative; bottom:8%;; left: calc(-30vw + 50%); display: block; height: fit-content; padding-bottom: 1rem; padding-top: 1rem; background-color: $blue-light; line-height: 2rem; list-style: none; .ul1 .sous-liste{ left: calc(-50vw + 50%); padding-top: 0; a{ opacity: 1; } } a{ color: $white; font-weight: 800; font-size: 1.7rem; opacity: 0.7; } } } } }