body, html{
    height: 100%;
    margin: 0;
    font-family: serif;
    line-height: 180%;
    color: #444;
    text-align: center;
    background-image: linear-gradient(19deg, #21d4fd 0%, #d721ff 100%);

}

.foto1{
    background-image: url(img/IMG-20240124-WA0045.jpg);
    min-height: 100%;
}
.foto2{
    background-image: url(img/IMG-20240124-WA0050.jpg);
    min-height: 60%;
}
.foto3{
    background-image: url(img/IMG-20240124-WA0051.jpg);
    min-height: 40%;
}
.foto4{
    background-image: url(img/IMG-20240124-WA0055.jpg);
    min-height: 100%;
}

.foto1, .foto2, .foto3, .foto4{
    position: relative;
    opacity: 0.75;
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    background-attachment: fixed;
}

.letreiro{
    color: #fbfbfb;
    font-size: 550%;
    position: absolute;
    top: 47%;
    text-shadow: 5px 1px 4px rgba(0,0,0,0.46);
}
.letreiro2{
    color: #c73256;
    font-size: 450%;
    top: 57%;
}

.letreiro3{
    color: #d1345d;
    font-size: 350%;
    top: 65%;
}
.letreiro4{
    color:#fbfbfb;
    font-size: 250%;
    top: 45%;
}


.letreiro, .letreiro2, .letreiro3, .letreiro4{
    position: absolute;
    width: 100%;
    text-transform: uppercase;
    letter-spacing: 8px;
    box-shadow: 0 0 10px;
    border-radius: 41px;
    text-shadow: 0, 0, 10px #000;

}

section{
    padding: 50px 80px;
}
.dark{
    background-color: #444;
    color: #fff;

}


@media(max-width :768px){
    .letreiro{
        font-size: 300%
}

.letreiro2{
    font-size: 250%;
}

.letreiro3{
    font-size: 200%;
}
.letreiro4{
    font-size: 200%;
}



}