html, body{
margin:0;
padding:0;
font-family: 'Sora', sans-serif;
width: 100%;
max-width: 100%;
height: 100%;
min-height: 100vh;
background:#FFE2F2;
font-size:15px;
color:#635B59;
}
a{
text-decoration: none;
transition:all 0.2s linear;
}
ul{
margin:0;
padding:0;
}
ul li{
padding:0;
margin:0;
list-style: none;
}
img{
max-width: 100%;
height:auto;
border:0;
outline: 0;
}
button, input, a, select, textarea{
outline: 0 !important;
border:0;
text-decoration: none;
}
.container{
max-width:1100px !important;
width:100% !important;
}
#topo{
position: relative;
z-index:1;
background-color: #fff;
height:100vh;
display: flex;
align-items: center;
justify-content: center;
padding:30px 0 100px;
}
#topo:after{
content:"";
width:45%;
height:100%;
background-color:#FFE2F2;
position:absolute;
top:0;
right:0;
}
#topo .container{
position: relative;
z-index:2;
}
.scroll-down{
position: absolute;
bottom:12px;
left:50%;
transform:translatex(-50%);
z-index:6;
}
.scroll-down .mouse{
width: 30px;
height: 45px;
border: 2px solid #E08AB9;
border-radius: 18px;
position: relative;
margin: 0 auto 10px;
}
.scroll-down .mouse i{
position: absolute;
top: 0;
left: 50%;
transform: translatex(-50%);
color:#E08AB9;
font-size: 18px;
opacity: 1;
animation: mouse 1.7s infinite;
display: block;
}
@keyframes mouse{
	from{
		opacity:1;
		top:-0px;
	}
	to{
	opacity:0.1;
	top:25px;
	}
}

.text-topo .logo{
max-width: 190px;
margin: 0 0 30px;
}
.text-topo h1{
text-align: left;
font: normal normal bold 24px/31px Sora;
letter-spacing: 0px;
color: #E08AB9;
margin: 0 0 30px;
}
.text-topo h1 span{
font-weight:300;
display: block;
}
.text-topo p{
text-align: left;
font: normal normal 300 17px/28px Sora;
letter-spacing: 0px;
color: #635B59;
margin: 0 0 30px;
max-width: 380px;
}
a.btn-lulu{
background: #E08AB9 0% 0% no-repeat padding-box;
border-radius: 10px;
text-align: center;
font: normal normal 800 16px/22px Sora;
letter-spacing: 0px;
color: #FFFFFF;
text-transform: uppercase;
text-decoration: none;
flex-wrap: wrap;
height: 54px;
padding: 5px 0;
transition: all 0.2s linear;
max-width: 346px;
}
a.btn-lulu:hover{
transform:scale(1.03);
background: #d47eae 0% 0% no-repeat padding-box;
}
.image-lulu{
position:relative;
margin-bottom: -200px;
margin-right:-30px;
}
.image-lulu img{
position:relative;
z-index:3;
}
.image-lulu:after{
content:"";
width:400px;
height:400px;
background:url(../images/icon.png);
background-size:100%;
background-repeat: no-repeat;
background-position: center;
position: absolute;
top: -70px;
right: 40px;
}
.col-left{
animation: slideIn 1s forwards;
}
@keyframes slideIn {
  from {
    transform: translateX(-20%);
	opacity: 0;
  }
  to {
    transform: translateX(0);
	opacity: 1;
  }
}

.col-right {
	animation: slideInRight 1s forwards;
}

@keyframes slideInRight {
  from {
    transform: translateX(20%);
	opacity: 0;
  }
  to {
    transform: translateX(0);
	opacity: 1;
  }
}

#timeline{
position:relative;
padding:60px 0;
}
#timeline h2{
text-align: center;
font: normal normal 300 30px/40px Sora;
letter-spacing: 0px;
color: #E08AB9;
margin:0 auto 40px;
}
#timeline h2 strong{
font-weight: 700;
}
.carrosel{
background: #fff;
border-radius: 20px;
}
.times .time .content-time{
padding: 50px 60px;
}
.times .time .content-time .texto{
width: calc(100% - 510px);
padding-top: 15px;
}
.times .time .content-time .texto h3{
text-align: left;
font: normal normal 300 40px/50px Sora;
letter-spacing: 0px;
color: #E08AB9;
}
.times .time .content-time .texto p{
text-align: left;
font: normal normal 300 17px/29px Sora;
letter-spacing: 0px;
color: #635B59;
}
.times .time .content-time .image{
max-width: 460px;
}
.times .time{
opacity: 0;
visibility: hidden;
transition:all 0.3s linear;
}
.times .time.slick-current{
opacity: 1;
visibility: visible;
}
.slick-next{
position: absolute;
top: 50%;
right: 0;
transform: translatey(-50%);
font-size: 0;
background-color: transparent;
width: 50px;
height: 50px;
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='rgba(224,138,185,1)'%3E%3Cpath d='M13.1717 12.0007L8.22192 7.05093L9.63614 5.63672L16.0001 12.0007L9.63614 18.3646L8.22192 16.9504L13.1717 12.0007Z'%3E%3C/path%3E%3C/svg%3E");
background-size: 100%;
background-repeat: no-repeat;
background-position: center;
transition: all 0.3s linear;
z-index: 5;
}
.slick-next:hover{
transform:translatey(-50%) scale(1.03);
}
.slick-prev{
position: absolute;
top: 50%;
left: 0;
transform: translatey(-50%);
font-size: 0;
background-color: transparent;
width: 50px;
height: 50px;
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='rgba(224,138,185,1)'%3E%3Cpath d='M10.8284 12.0007L15.7782 16.9504L14.364 18.3646L8 12.0007L14.364 5.63672L15.7782 7.05093L10.8284 12.0007Z'%3E%3C/path%3E%3C/svg%3E");
background-size: 100%;
background-repeat: no-repeat;
background-position: center;
transition: all 0.3s linear;
z-index: 5;
}
.slick-prev:hover{
transform:translatey(-50%) scale(1.03);
}
footer{
background:#E08AB9;
padding:20px 0;
}
.content-footer .logo-rodape{
max-width: 150px;
margin-right:40px;
}
.content-footer{
max-width: 760px;
margin: 0 auto;
}
.content-footer .text-rodape span{
text-align: left;
font: normal normal 300 20px/30px Sora;
letter-spacing: 0px;
color: #FFFFFF;
}
.content-footer .text-rodape strong{
text-align: left;
font: normal normal bold 20px/30px Sora;
letter-spacing: 0px;
color: #FFFFFF;
}
main{
overflow:hidden;
}

@media(max-width:1600px){
.container{
width:1000px !important;
max-width: 100% !important;
}
.image-lulu{
padding:30px;
margin-bottom: -170px;
}
.image-lulu::after {
content: "";
width: 300px;
height: 300px;
top: 0px;
right: 70px;
}
.text-topo .logo {
max-width: 150px;
margin: 0px 0 20px;
}
.text-topo h1 {
text-align: left;
font: normal normal bold 20px/26px Sora;
letter-spacing: 0px;
color: #E08AB9;
margin: 0 0 20px;
max-width: 340px;
}
.text-topo p {
text-align: left;
font: normal normal 300 15px/25px Sora;
letter-spacing: 0px;
color: #635B59;
margin: 0 0 30px;
max-width: 370px;
}
a.btn-lulu {
font: normal normal 800 14px/20px Sora;
height: 50px;
max-width: 320px;
}
#topo{
padding: 30px 0 40px;
}
.scroll-down .mouse {
width: 26px;
height: 40px;
border: 1px solid #E08AB9;
}
.scroll-down .mouse i{
font-size:16px;
}
#timeline h2 {
text-align: center;
font: normal normal 300 26px/36px Sora;
}
.times .time .content-time .image {
max-width: 400px;
}
.times .time .content-time .texto {
width: calc(100% - 470px);
padding-top: 15px;
}
.times .time .content-time .texto h3 {
text-align: left;
font: normal normal 300 36px/46px Sora;
}
.times .time .content-time .texto p {
text-align: left;
font: normal normal 300 16px/26px Sora;
}
.slick-next, .slick-prev{
width:40px;
height:40px;
}
.content-footer .logo-rodape {
max-width: 130px;
margin-right: 40px;
}
.content-footer .text-rodape span {
text-align: left;
font: normal normal 300 18px/28px Sora;
}
.content-footer .text-rodape strong {
text-align: left;
font: normal normal bold 18px/28px Sora;
}
.content-footer {
max-width: 680px;
margin: 0 auto;
}

}

@media(max-width:992px){
#topo{
height:auto;
min-height:100vh;
padding:40px 0 35px;
}
.text-topo .logo {
max-width: 150px;
margin: 0px auto 25px;
}
.text-topo{
position:relative;
z-index:6;
}
.text-topo h1 {
text-align: center;
margin: 0 auto 20px;
}
.text-topo p {
text-align: center;
margin: 0 auto 30px;
max-width: 350px;
}
a.btn-lulu{
margin:0 auto;
position:relative;
z-index:6;
}
.image-lulu {
padding: 0;
margin-bottom: -40px;
margin-right: -75px;
width: 450px;
}
#topo::after {
content: "";
width: 100%;
height: 49%;
background-color: #FFE2F2;
position: absolute;
top: auto;
right: 0;
bottom: 0;
}
.image-lulu::after {
content: "";
width: 240px;
height: 240px;
top: -35px;
right: 60px;
}
.col-left{
position: relative;
z-index: 5;
}
.content-footer{
width:100%;
max-width: 100%;
}
.content-footer .logo-rodape{
max-width: 130px;
margin:0 auto 20px;
}
.content-footer .text-rodape{
width:100%;
max-width: 100%;
text-align:center;
}
.content-footer .text-rodape span {
text-align: left;
font: normal normal 300 16px/23px Sora;
}
.content-footer .text-rodape strong {
text-align: center;
font: normal normal bold 16px/22px Sora;
}
#timeline h2 {
text-align: center;
font: normal normal 300 20px/26px Sora;
max-width: 340px;
margin: 0 auto 25px;
}
#timeline {
position: relative;
padding: 30px 0 50px;
}
.times .time .content-time {
padding: 20px 20px 30px;
}
.carrosel {
background: #fff;
border-radius: 12px;
}
.times .time .content-time .texto {
width: 100%;
padding-top: 15px;
}
.times .time .content-time .texto h3 {
text-align: center;
font: normal normal 300 30px/40px Sora;
}
.times .time .content-time .texto p {
text-align: center;
font: normal normal 300 15px/26px Sora;
margin: 0 auto 30px;
}
.times .time .content-time .image {
max-width: 100%;
margin: 0 auto;
}


}