@import url('https://fonts.googleapis.com/css2?family=Delius&display=swap');

/* Essentials*/

body{
    overflow-x: hidden;
}

.cute-font{
    font-family: Delius;
}

.normal-color{
    color: white;
}

.bolder{
    font-weight: bolder;
}

/* Whatsapp*/

.whats-link {
    position: fixed;
    right: 2rem;
    bottom: 2rem;
    z-index: 3;
}

.whats-link a img{
    width: 3rem;
    height: 3rem;
}

/* Section */

.section{
    margin: 1rem;
    border-radius: 2%;
}

/* Section - Intro */

.section-intro {
    height: 90vh;
    position: relative;
    background-image: url(img/FestaAniversario.jpg);
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    border-radius: 2%;
}

.section-intro::before{
    content: "";
    position: absolute;
    top: 0; left: 0; right: 0; bottom: 0;
    background-color: rgba(0, 0, 0, 0.5);
    z-index: 0;
}

.section-intro .content {
    position: relative;
    z-index: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    height: 100%;
    text-align: center;
    padding: 2rem;
}

.section-intro .content h1{
    font-size: 3rem;
}

.section-intro .content h5{
    font-size: 1.5rem;
}

/* Section - Themes*/

.section-themes{
    height: 15rem;   
    padding: 7vh;
}

@media(max-width: 768px){
    .section-themes{
        height: 25rem;   
        padding: 7vh;
    }    
}

/* Section - Carousel*/

.section-carousel{
    height: 100vh;
    padding: 5vh;
}

@media(max-width: 768px)
{
    .section-carousel{
        height: 50vh;
        padding: 5vh;
    }    
}

.carrossel{
    display: flex;
    justify-content: center;
    align-items: center;
}

.carousel-item img{
    max-width: 100vh;
    max-height: 80vh;
    object-fit: contain;
}

@media(max-width: 768px)
{
    .carousel-item img{
        max-width: 100vh;
        max-height: 30vh;
        object-fit: contain;
    }    
}

.bg-pink{
    background-color: #ffe9ec;
}

.bg-white{
    background-color: white;
}

.baloon{
    background-color: white;

}

footer{
    padding: 1%;
}