@media screen and (min-width: 500px) and (max-width: 768px){

    /*Telas menores*/
    .conteiner__imglendo {
        width: 260px;
        position: relative;
        left: -20px;
    }

    .conteiner__imglivros {
        width: 250px;
    }
}

@media screen and (min-width: 769px) and (max-width: 992px){
    /*TABLETS*/
    .cabecalho span{
        display: flex;
        flex-direction: row;

    }
    .hero {
        background-color: var(--cor-primaria);
        display: flex;
        flex-flow: row nowrap;
        justify-content: space-around;
        gap: 10px;
    }

    .hero__conteudo {
        width: 700px;
    }

    .hero__titulo{
        color: var(--cor-terciaria);
        font-size: 2em;
        padding-bottom: 5px;
    }

    .hero__texto {
        color: var(--cor-terciaria);
        font-size: 1em;
    }


    .conteiner__img{
        position: relative;
        top: -10px;
        margin-right: 10px;
    }

    .conteiner__img img {
        height: 290px;
        width: 290px;
    }

    
    .botao {
        background-color: var(--cor-terciaria);
        width: 200px;
    }
    
    .botao:hover {
        background-color: #d4d4d4;
    }
    .botao a {
        color: #000000;
        font-size: 1em;
        font-weight: 500;
    }
    
    .conteiner {
        background-color: var(--cor-terciaria);
        display: flex;
        flex-flow: row nowrap;
        justify-content: space-evenly;
        align-items: center;
        padding: 0;
        height: 52vh;
    }

    .conteiner__conteudo {
        font-size: 1.2em;
        color: #000000;
    }

    .conteiner__titulo {
        font-size: 1.7rem;
        margin-bottom: 5px;
    }

    .conteiner__texto{
        color: #000000;
        line-height: 1.5em;
    }

    .conteiner__imglendo {
        width: 360px;
        position: static;
    }

    .rodape{
        background-color: var(--cor-primaria);
        color: var(--cor-terciaria);
    }
}

@media screen and (min-width: 993px)and (max-width: 1920px) {
    /*DESKTOP*/
    .cabecalho span{
        display: flex;
        flex-direction: row;

    }
    .hero {
        background-color: var(--cor-primaria);
        display: flex;
        flex-flow: row nowrap;
        justify-content: space-around;
        gap: 10px;
    }

    .hero__conteudo {
        width: 700px;
    }

    .hero__titulo{
        color: var(--cor-terciaria);
        font-size: 2em;
        padding-bottom: 10px;
    }

    .hero__texto {
        color: var(--cor-terciaria);
        font-size: 1em;
    }

    .conteiner__img{
        position: relative;
        top: -10px;
        margin-right: 10px;
    }

    .conteiner__img img {
        height: 300px;
        width: 350px;
    }

    
    .botao {
        background-color: var(--cor-terciaria);
        width: 200px;
    }
    
    .botao:hover {
        background-color: #d4d4d4;
    }
    .botao a {
        color: #000000;
        font-size: 1em;
        font-weight: 500;
    }
    
    .conteiner {
        background-color: var(--cor-terciaria);
        display: flex;
        flex-flow: row nowrap;
        justify-content: space-evenly;
        align-items: center;
        padding: 0;
    }

    .conteiner__conteudo {
        font-size: 1.2em;
        color: #000000;
    }

    .conteiner__titulo {
        font-size: 1.8em;
        margin-bottom: 5px;
    }

    .conteiner__texto{
        color: #000000;
        line-height: 1.5em;
    }

    .conteiner__imglendo {
        width: 360px;
        position: static;
    }

    .rodape{
        background-color: var(--cor-primaria);
        color: var(--cor-terciaria);
    }
}