body, html {height: 100%;margin: 0;background-color: #f2f2f2;font-family: "Roboto", sans-serif;}
html{scroll-behavior: smooth;}

/* ----------- HEADER ----------- */

.carrousel__container {overflow: hidden;}

.list__reset {list-style: none;padding-left: 0;margin-top: 0;}
.carrousel__list {display: flex;overflow: hidden;position: relative;}
.carrousel__list__item {width: 100%;flex-grow: 0;height: 100vh;display: flex;}
.red {background-image:linear-gradient(rgba(23, 23, 29, 0.9), rgba(23, 23, 29, 0.6)), url("musician-7895187.jpg");background-position: center;background-repeat: no-repeat;background-size: cover;position: relative;}
.blue {background-image: linear-gradient(rgba(23, 23, 29, 0.9), rgba(23, 23, 29, 0.6)), url("recording-studio-1869560.jpg");background-position: center;background-repeat: no-repeat;background-size: cover;position: relative;}
.black {background-image: linear-gradient(rgba(23, 23, 29, 0.9), rgba(23, 23, 29, 0.6)), url("concert-3387324.jpg");background-position: center;background-repeat: no-repeat;background-size: cover;position: relative;}

/* ----------- NAV ----------- */


nav {width:100%;z-index: 1; position: absolute;display:flex;padding-top:1%;}

.logo{width:20%;margin:auto;}
.logo img{width:50%;text-align: center;margin:auto;display:block;}

.menu{width:40%; padding: 16px 26px;margin:auto;display:flex;}
.menu a, .menu div{color:#f2f2f2;text-decoration: none;text-transform: uppercase;margin:auto;text-align: center;}
.menu a:hover, .menu div:hover{text-decoration: none;color:#ff9900;transition:0.6s all ease;border-bottom:1px solid #ff9900;}

.dropbtn {border:none; background-color:transparent;color:#f2f2f2;font-size:1em;cursor: pointer;}
.dropdown {position: relative;display: inline-block;}
.dropdown-content {display: none;position: absolute;background-color: #f2f2f2;min-width: 160px;box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);z-index: 1;}
.dropdown-content a { color: #1a1a1a; padding: 12px 16px; text-decoration: none; display: block;font-weight:500;}
.dropdown-content a:hover {background-color: #1a1a1a;color:#f2f2f2;transition:0.6s all ease;}
.dropdown:hover .dropdown-content {display: block;}

/* ----------- HERO TEXT ----------- */

.hero-text {position: absolute;width:50%;color: #f2f2f2;line-height: 2em;text-align: left;top: 30%;left: 7%;}
.h1-01{font-weight: 300;text-transform: uppercase;font-size:3em;}
.h1-02{font-weight: 700;text-transform: uppercase;font-size:3em;}
.hero-text p{font-size: 2em;line-height: 0;text-align: right;}

.reseaux{left:7%;bottom:10%;position: absolute;}
.reseaux a{width:100%;display:block;text-decoration: none;color:#f2f2f2;}
.reseaux a ion-icon{font-size:1.5em;padding:30% 0;}
.reseaux a ion-icon:hover{color:#ff9900;transition:0.6s all ease;}

.pages{right:7%;bottom:10%;position: absolute;}
.buttons__list {display: flex;}
.buttons__list__item{padding:20%;}
.buttons__list__item button{background-color:transparent;border:none;}
.buttons__list__item button ion-icon{font-size: 2em;color:#f2f2f2;}
#prev__btn:hover{background-color:#ff9900;transition:0.6s all ease;}
#next__btn:hover{background-color:#ff9900;transition:0.6s all ease;}