header .logo {background: url('img/header-logo.svg');width:216px;height:50px;transition: 0.6s;background-repeat: no-repeat;}
header {position: fixed;display: inline-flex;top: 0; left: 0;right: 0; width :auto;padding: 10px 10px;z-index: 10;justify-content: space-between;padding: 1rem 2rem;transition: 0.6s;}
header.sticky{background-color: rgba(0,0,0,.4);-webkit-backdrop-filter: blur(150px) saturate(1.8);backdrop-filter: blur(20px) saturate(1.8);z-index: 10;opacity: 1s ease;}

header.sticky .menu-btn__burger{background-color: #fff;}
header.sticky .menu-btn__burger::before {background-color: #fff;}
header.sticky .menu-btn__burger::after {background-color: #fff;}
header.sticky ul li a{color: #fff}
header a{text-decoration: none;color: #fff;font-size: 6rem;}
header ul{position: relative; display: flex; justify-content: center; align-items: center;margin:20px 20px 100px 10px;}

nav {list-style:none;}

.sidebar{right:100%;}
.sidebar.open{height: 100vh;width:320px;position: absolute;top: 0;left:0;padding: 0 60px;display: flex;flex-direction: column;}
.menu-items{display:none;transition: 0.5s;}
.menu-items.open{position: absolute;top:0;left:0;display: flex;justify-content: space-around;height: 100vh;min-width: 360px;padding-top: 30px; flex-direction: column;background-color: rgba(0,0,0,.4);backdrop-filter: blur(10px);z-index:12;}
.menu-items.open li a{position: absolute;display: flex;text-transform: uppercase;font-size: 1.5rem;transition: transform 0.4s ease-in-out;margin-top: 60px;margin-left: 100px;}

.menu-items li a:hover{color:#0182ae;}




.menu__copy{padding-left: 20px;color:gray;font-family:'Avenir',Arial,sans-serif;font-weight:30;}
.menu__copy a{color:#fefefe;font-size:12px;margin-right:8px;margin-right:0.5rem}
.menu-copyright {color:#fefefe;font-size:12px;}
.menu__copy a:hover{color:#0182ae}
.menu__socials{justify-content: space-between;width:180px;}
.menu__socials a{font-size:20px!important;font-size:1.25rem!important;color:#fff;}
.menu__socials a:hover{color:#0182ae}



/*BURGER MENU BOTTOM */
.menu-btn {position: relative;display:flex;flex-direction: column;cursor:pointer;justify-content: space-between;user-select: none;margin-top: 30px;width: 36px;height: 36px;cursor: pointer;transition: all .5s ease-in-out;z-index: 14;}
.menu-btn__burger {width: 20px;height: 1.5px;background: #fff;border-radius: 3px;transition: all .5s ease-in-out;z-index:10;}
.menu-btn__burger::before,.menu-btn__burger::after {content:'';position:absolute;width: 20px;height: 1.5px;background: #fff;border-radius: 2px;transition: all .5s ease-in-out;}
.menu-btn::after {content: 'MENU';font-size: 1.5rem;position: absolute !important;margin-left: 30px;margin-top: -.5em;color: #fff;transition: all .5s ease-in-out;}
.menu-btn.open::after {content: 'CLOSE';font-size: 1.5rem;position: absolute !important;margin-left: 30px;margin-top: -.5em;color: #ae0132;transition: all .5s ease-in-out;}
.menu-btn__burger::before {transform: translateY(-6px);}
.menu-btn__burger::after {transform: translateY(+6px);}

/* ANIMATION */
.menu-btn.open .menu-btn__burger {transform: translatex(-50px);background: transparent;box-shadow: none;}
.menu-btn.open .menu-btn__burger::before{background:#ae0132;transform: rotate(45deg) translate(35px, -35px);}
.menu-btn.open .menu-btn__burger::after{background:#ae0132;transform: rotate(-45deg) translate(35px, 35px);}