@charset "UTF-8";
@font-face {
    font-family: Gellatio;
    src: url(../fontes/gellatioregular.ttf);
}
@font-face {
    font-family: QuicheSans;
    src: url(../fontes/quichesans.otf);
}
:root{
    --cor0: rgb(100, 65, 45);
    --cor1: rgb(182, 153, 145);
    --cor2: rgb(255, 248, 224);
    --cor3: rgba(255, 255, 255, 0.603);
    --tcursivo: Gellatio, cursive;
    --tnormal: QuicheSans, Roboto, sans-serif;
    --padrao: Calibri, sans-serif;
}
/* MAIN */
.h1{
    padding: 20px;
    padding-top: 30px;
    font-family: var(--tcursivo);
    font-size: 1.5em;
    text-align: center;
    background-color: var(--cor0);
    color: white;
}
.sconteudo{
    width: 90vw;
    max-width: 800px;
    padding: 20px 0px;
    margin: auto;
    background-color: var(--cor2);
    box-shadow: inset 0 0 3px 5px rgba(0, 0, 0, 0.507);
    text-align: center;
}
.sconteudo a{
    color: black;
    text-decoration: none;
}
.container{
    padding: 10px;
    display: inline-block;
    margin: 15px;
    background-color: var(--cor0);
    border-radius: 10px;
    box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.507);
}
.conteudo{
    width: 300px;
    height: 100px;
    box-shadow: 0px 0px 5px var(--cor3);
    display: block;
}
.ilustracao{
    border-radius: 10px 10px 0px 0px;
}
.descricao{
    border-radius: 0px 0px 10px 10px;
    background-color: var(--cor2);
}
.descricao h2{
    font-family: var(--tnormal);
    padding: 10px;
}
.descricao p{
    text-align: justify;
    margin: 0px 10px 0px 10px;
    font-size: 0.85em;
}

/* ______________________________________________________________________ */

#ilustracao1{
    background: var(--cor1) url(../images/bolosFestivos/ft6.jpg) no-repeat center center ;
    background-size: cover ;
}
#ilustracao2{
    background: var(--cor1) url(../images/docinhosTradicionais/ft1.jpeg) no-repeat center center ;
    background-size: cover ;
}
#ilustracao3{
    background: var(--cor1) url(../images/bentoCake/ft1.jpeg) no-repeat center 70% ;
    background-size: cover ;
}
#ilustracao4{
    background: var(--cor1) url(../images/boloDePote/ft2.jpg) no-repeat center 30%;
    background-size: cover ;
}
#ilustracao5{
    background: var(--cor1) url(../images/boloVulcao/ft1.jpg) no-repeat center center;
    background-size: cover ;
}
#ilustracao6{
    background: var(--cor1) url(../images/boloFatia/ft1.jpeg) no-repeat center 65%;
    background-size: cover ;
}
/*////////////*/
#ilustracao8{
    background: var(--cor1) url(../images/copoDaFelicidade/ft1.jpeg) no-repeat center center;
    background-size: cover ;
}
#ilustracao9{
    background: var(--cor1) url(../images/bombomAberto/ft2.jpeg) no-repeat center center;
    background-size: cover ;
}
/* ______________________________________________________________________ */
@media screen and (max-width: 390px) {
    .conteudo{
        width: 200px;
        height: 80px;
    }
    .descricao h2{
        padding: 5px;
        padding-bottom: 2px;
        font-size: .9em;
    }
    .descricao p{
        font-size: .8em;
    }
}
@media screen and (max-width: 315px) {
    nav{
        padding-right: 0px;
    }
    .container{
        margin: 15px auto ;
    }
}