@import url('https://fonts.googleapis.com/css2?family=Abel&display=swap');

body {
    background-color: #A5BDA6;
    font-size: 16px;
    font-family: "Abel", sans-serif;
    margin: 0;
    padding: 0;
}


/* Cabeçalho */

.cabecalho {
    margin: 80px 0px 89px 0px;
    display: flex;
    width: 100%;
    height: 120px;
    justify-content: center;
}

.cabecalho img {
    margin: 0;
    padding: 0;
    width: 331px;
    height: 120px;
}


@media screen and (max-width: 580px) {
    .cabecalho img {
        width: calc(331px - 10%);
        height: calc(120px - 10%);
    }
}

@media screen and (max-width: 440px) {
    .cabecalho {
        margin: 75px 0px 60px;
    }

    .cabecalho img {
        width: calc(331px - 20%);
        height: calc(120px - 20%);
    }
}


/* Corpo */

.corpo {
    margin: 0 auto;
    padding: 0;
    position: relative;
    max-width: 1171px;
    overflow: hidden;
}

.corpo .texto {
    align-items: center;
    background-color: #FFFFFFA1;
    display: flex;
    font-size: 32pt;
    height: 85px;
    justify-content: center;
    letter-spacing: 6px;
    margin: 0;
    padding: 0;
    position: absolute;
    width: 100%;
    top: calc(50% - 42.5px);
}

.corpo .imagens {
    display: flex;
    justify-content: center;
    align-items: center;
}

.corpo #prin {
    width: 1171px;
    height: 545px;
}

.corpo #img2 {
    display: none;
    margin: 0;
    padding: 0;
    width: 808px;
    height: 545px;
}

@media screen and (max-width: 1171px) {
    .corpo {
        width: 100%;
    }

    .corpo #prin {
        width: 100%;
        height: auto;
    }

}

@media screen and (max-width: 808px) {
    .corpo #prin {
        display: none;
    }

    .corpo #img2 {
        display: block;
        width: 100%;
        height: auto;
    }
}

@media screen and (max-width: 580px) {

    .corpo {
        max-width: 808px;
    }

    .corpo .texto {
        font-size: 25pt;
        height: 75px;
    }

    .corpo .imagens #img1 {
        display: none;
    }
}

@media screen and (max-width: 440px) {

    .corpo {
        max-width: 808px;
    }

    .corpo .texto {
        font-size: 20pt;
        height: 65px;
    }

    .corpo .imagens #img1 {
        display: none;
    }
}


/* Rodapé */

.rodape {
    margin-top: 85px;
    padding: 0;
}

.imgs {
    display: flex;
    justify-content: center;
    gap: 30px;
}

.imgs #insta {
    width: 33px;
    height: 33px;
}

.imgs #linkedin {
    width: 31px;
    height: 31px;
}

.imgs #behance {
    width: 43px;
    height: 27px;
}

.rodape .texto {
    display: flex;
    justify-content: center;
    margin: 44px 0px 70px 0px;
}

.rodape .texto a {
    margin: 0px;
    padding: 0px;
    font-size: 20pt;
    color: white;
    letter-spacing: 1px;
    text-decoration: none;
}

@media screen and (max-width: 580px) {
    .rodape {
        margin-top: 75px;
    }

    .rodape .texto a {
        font-size: 17pt;
    }
}

@media screen and (max-width: 440px) {
    .rodape .texto a {
        font-size: 15pt;
    }
}