* {margin: 0; padding: 0; font-family: Bahnschrift, sans-serif; font-size: 40px;}
html {scroll-behavior: smooth;}
body {background-color: #FEFEF4;}
h1 {font-size: 40px; font-family: shantell-sans-bouncy, sans-serif; color: #B60046; letter-spacing: 1px; margin-bottom: 2px;}
h2 {font-size: 40px; font-family: shantell-sans-bouncy, sans-serif; color: #FEFEF4; letter-spacing: 1px; margin-bottom: 2px;}
h4 {font-size: 130px;  margin-bottom: -40px; font-family: shantell-sans-bouncy, sans-serif; letter-spacing: 10px;}
.tittle {width: 100%; height: 710px;  background-color: #B60046; margin: 0 auto; min-width: 1200px; overflow: hidden;}

.presentationtittle {width: 100%; height: 100%;}
.definesentence {width:80%; height:310px; min-width: 1200px; margin: 0 auto; text-align: center; padding-top: 150px;}
@keyframes animation1 {from{transform: translateY(650px);} to{transform: translateY(0);}}
.animation1 {animation: animation1 1.8s ease-in-out; color: #24EADA;}

.menu {width:100%; height: 11000px; background-color: #FEFEF4;}
.nav {width: 86%; height:30px; min-width: 1200px; margin: 0 auto; position: sticky; top: 0; z-index: 10000;}
ul {list-style-type: none; margin: 0; padding-right: 0.6%;}
.li_1 {width: fit-content; height: 50px; align-content: center; text-align: center; float: right; padding-left: 15px; font-size: 10px;  color: black;}
.li_1:hover {color: #24EADA;}
.li_1:active {color: #B60046;}

.sectionfnaw {width: 100%; height:600px; margin: 0 auto; padding-top: 40px; float: left; min-width: 1200px;}
.mainfnaw {width:50%; height:100%; float: left;}
.slidercontainer {width:82%; height: 100%; padding-left: 14%;}
.slider {width:100%; height: 100%; position: relative; overflow: hidden;}
.list {position: absolute; top: 0; left: 0; height: 100%; display: flex; width: max-content; transition: 1s;}
.list img {width: 100%; height: 100%; object-fit: cover;}
.buttons {position: absolute; top: 45%; left: 1%; width:98%; display: flex; justify-content: space-between;}
.buttons button {width: 50px; height: 50px; border-radius: 50%; background-color: #fff5; color: #B60046; border: none; font-size: 30px;}
.dots {position: absolute; bottom: 10px; color: #B60046; left: 0; width: 100%; margin: 0; padding: 0; display:flex; justify-content: center;}
.dots li {list-style: none; width: 10px; height: 10px; background-color: #B60046; margin: 20px; border-radius: 20px; transition: 1s;}
.dots li.active {width: 30px;}
.textinho {width: 82%; height: fit-content; margin-top: 400px; font-size: 20px; padding-left: 4%;}
.sectionfnaw2 {width: 100%; height:600px; margin: 0 auto; padding-top: 80px; float: left; min-width: 1200px;}
.mainfnaw3 {width:82%; height:100%; padding-left: 14%;}
.notefnaw {width: fit-content; height: fit-content; margin-top: 530px; float: right; color: #B60046;}
.fnaw1 {width: 82%; height: 50%; float: left; padding-left: 4%;}
.ru {width:50%; height: 100%; object-fit: scale-down; float: left;}

.sectiondespair {width: 100%; height:1930px; margin: 0 auto; margin-top: 80px; float: left; min-width: 1200px; background-color: #B60046;}
.dr1 {width: 100%; height:200px; float: left; min-width: 1200px; margin-top: 80px;}
.textinho2 {width:82%; padding-left: 14%; font-size: 20px; color: #FEFEF4;}
.dr2  {width: 100%; height:1000px; margin: 0 auto; float: left; min-width: 1200px; margin-top: -30px;}
.maindespair1 {width: 60%; height: 100%; float: right;}
.mainimagedr {width:82%; height: 100%; padding-left: 4%;}
.drm {width:100%; height: 100%; object-fit: cover;}
.dr3 {width: 100%; height:500px; margin: 0 auto; float: left; min-width: 1200px; margin-top: 80px;}
.imageback {width:82%; padding-left: 14%; height: 100%;}
.textinho3 {width:82%; padding-left: 4%; height: fit-content; font-size: 20px; color: #FEFEF4; padding-top: 180px}

.valfiller {width:100%; height:80px; margin: 0 auto; float: left; min-width: 1200px;}
.sectionvalentine {width: 100%; height:fit-content; margin: 0 auto; float: left; min-width: 1200px;}
.noteval {width: 50%; height: 600px; float: left;}
.textinho4 {width:82%; padding-left: 14%; height: fit-content; font-size: 20px; padding-top: 370px;}
.illustrationvalentine {width: 50%; height:600px; float: left;}
.valim {width:82%; padding-left: 4%; height: 100%;}
.valentined {width:100%; height: 100%; object-fit: scale-down;}

.sectionangel {width: 100%; height:3470px; margin: 0 auto; float: left; min-width: 1200px;}
.illustrationangel {width: 50%; height: 650px; float: left;}
.angel1 {width:82%; padding-left: 14%; height: 100%;}
.noteangel {width: 50%; height: 650px; float: left; margin-bottom: 80px;}
.textinho6 {width: 82%; height: fit-content; margin-top: 300px; font-size: 20px; padding-left: 4%;}
.illustrationangel3 {width: 50%; height: 680px; float: left;  margin-bottom: 80px;}
.illustrationangel4 {width: 50%; height: 750px; float: left;  margin-bottom: 100px;}
.illustrationangel2 {width: 86%; height: 950px; margin: 0 auto;}
.angel2  {width: 100%; height: 100%;}

.sectionplanetloop {width: 100%; height:780px; margin: 0 auto; float: left; min-width: 1200px; margin-top: 80px; background-color: #B60046;}
.plpt1 {width: 100%; height:150px; float: left; min-width: 1200px; margin-top: 80px;}
.noteplanet {width: 50%; height: 200px; float: right;}
.textinho5 {width:82%; padding-left: 4%; font-size: 20px; color: #FEFEF4;}
.illustrationplanet {width: 100%; height:390px; margin: 0 auto; float: left; min-width: 1200px; margin-top: 80px;}
.drawings3 {width: 86%; height:100%; min-width: 1200px; margin: 0 auto;}
.pld1 {width: 30%; height: 100%; float: left;}
.pld3 {width: 35%; height: 100%; float: left; margin-left: 5%; padding-top: 1%;}

.sectionextras {width: 100%; height:2880px; margin: 0 auto; float: left; min-width: 1200px;}
.extrafiller {height: 80px; width: 100%; margin: 0 auto; float: left; min-width: 1200px;}
.extra1 {width: 50%; height:800px; float: left;}
.princess {width:82%; padding-left: 4%; height: 100%;}
.extra2 {width: 50%; height:800px; float: left; margin-top: 80px;}
.idol {width:82%; padding-left: 14%; height: 100%;}
.notaidol {width:82%; margin-left: 4%; height: 20px;}
.extra3 {width: 60%; height:1000px; float: right; margin-top: 80px;}

.backbutton {width: 100%; height:142px; float: left; background-color: #B60046; min-width: 1200px;}
.back {width: 40%; height:100%; min-width: 440px; border: none; cursor: pointer; float: right; font-size: 50px; background-color: transparent; color:#FEFEF4; padding-left: 60px;}
.back:hover {color:#24EADA;}
.back:active {color:#1da398;}