/* TAMANHO PARA NOTEBOOK E MACBOOK*/
@media (max-width: 1280px) {

/* Área dos produtos jovempan */

.card-jovempan{
    width: 255px;
    height: 195px;
    background-color: white;

}
.card-jovempan a{
    font-size: 18px;
    
}


/* Área dos produtos revistaoeste */

.card-oeste{
    width: 255px;
    height: 195px;
    background-color: white;

position: absolute;
top: 20px; /* Ajuste a posição vertical */
right: 350px; /* Move para o lado direito */

}
.card-oeste a{
    font-size: 18px;
    
}
.top-oeste p{

    font-size: 20px;

}


/* Área dos produtos onefootball */

.card-onefootball{
    width: 255px;
    height: 195px;
    background: #ffffff;

position: absolute;
top: 20px; /* Ajuste a posição vertical */
right: 65px; /* Move para o lado direito */

}
.card-onefootball a{
    font-size: 18px;
    
}



/* Área dos produtos ancapsu */

.card-ancapsu{
    width: 255px;
    height: 195px;
    background-color: white;

position: absolute;
top: 233px; /* Ajuste a posição vertical */
right: 65px; /* Move para o lado direito */

}
.card-ancapsu img{
    margin-top: 12px;
    margin-bottom: 15px;
    margin-left: 20px;

}
.top-ancapsu p{
    font-size: 20px;
}


/* Área dos produtos historinhas biblica */

.card-historinhas-biblica{
    width: 255px;
    height: 195px;
    background-color: white;

position: absolute;
top: 448px; /* Ajuste a posição vertical */
right: 65px; /* Move para o lado direito */

}
.top-historinhas-biblica p{
    font-family: 'Courier New', Courier, monospace;
    font-size: 22px;
    font-weight: bold;
    margin-top: 10px;
}


/* Área dos produtos antagonista */

.card-antagonista{
    width: 255px;
    height: 195px;
    background-color: white;

position: absolute;
top: 230px; /* Ajuste a posição vertical */
right: 350px; /* Move para o lado direito */

}
.top-antagonista p{
    font-size: 20px;
}


/* Área dos produtos biblia */

.card-biblia{
    width: 255px;
    height: 195px;
    background-color: white;

position: absolute;
top: 450px; /* Ajuste a posição vertical */
right: 350px; /* Move para o lado direito */

}
.card-biblia img{
    margin-top: 15px;
    margin-bottom: 10px;
    margin-left: 2px;

}
.top-biblia p{
    font-family: 'Courier New', Courier, monospace;
    font-size: 20px;
    font-weight: bold;
    margin-top: 10px;
}



/* Área dos produtos gazeta */
.card-gazeta{
    width: 255px;
    height: 195px;
    background-color: white;


}
.card-gazeta img{
    width: 170px;

}
.top-gazeta p{
    font-size: 20px;
}


/* Área dos produtos gospel */

.card-gospel{
    width: 255px;
    height: 195px;
    background-color: white;

}
.card-gospel img{
    width: 170px;

}
.top-gospel p{
    font-family: 'Courier New', Courier, monospace;
    font-size: 23px;
    font-weight: bold;
    margin-top: 10px;
}



}

/*PARA TABLET GRANDE*/
@media (max-width: 895px){
    
    /* Reset e configurações gerais */ 
    body {
        display: block;
    }
    /* Sidebar */
    .sidebar {
        width: 100%;
        height: 13vh;
        position: relative;
        flex-direction: row;
        padding: 0px;
    
    }
    .logo img {
        width: 250px;
        margin-top: 50px;
    }
    .menu{
        display: flex;
    
    }
    .menu-btn {
        width: 100%;
        padding: 8px;
        transition: none;
        font-size: 13px;
        border-radius: 8px;
        margin-right: 10px;
        
    }
    .menu-btn:hover{
    text-decoration: none;
    background: #626364;
    transition: 0.8s;
    }
    .menu-btn img.icon {
        width: 20px;
        height: 20px;
    }
    .supot{
        margin-top: 0px;
        font-size: 23px;
        margin-left: 30px;
    }
    .supot:hover{
        background-color: #ff5e00;
        transition: 0.5s;
        cursor: pointer;
        color: #000000;
    }

/* ---------------------------------------------------*/

/* Área dos produtos jovempan */
.content {
    margin-left: 8%;
    padding: 20px;
    height: 120vh;

}
.card-jovempan{

    width: 265px;
    height: 195px;


}

/* Área dos produtos revistaoeste */
.card-oeste{

    width: 265px;
    height: 195px;

top: 150px; /* Ajuste a posição vertical */
right: 150px; /* Move para o lado direito */

}

/* Área dos produtos onefootball */
.card-onefootball{
    width: 265px;
    height: 195px;


top: 367px; /* Ajuste a posição vertical */
right: 150px; /* Move para o lado direito */

}


/* Área dos produtos ancapsu */

.card-ancapsu{
    width: 265px;
    height: 195px;
    background-color: white;

position: absolute;
top: 580px; /* Ajuste a posição vertical */
right: 150px; /* Move para o lado direito */

}
.card-ancapsu img{
    margin-top: 12px;
    margin-bottom: 15px;
    margin-left: 20px;

}
.top-ancapsu p{
    font-size: 20px;
}


/* Área dos produtos historinhas biblica */

.card-historinhas-biblica{
    width: 265px;
    height: 195px;
    background-color: white;

position: absolute;
top: 1020px; /* Ajuste a posição vertical */
right: 515px; /* Move para o lado direito */

}
.top-historinhas-biblica p{
    font-family: 'Courier New', Courier, monospace;
    font-size: 22px;
    font-weight: bold;
    margin-top: 10px;
}


/* Área dos produtos antagonista */

.card-antagonista{
    width: 265px;
    height: 195px;
    background-color: white;

position: absolute;
top: 800px; /* Ajuste a posição vertical */
right: 150px; /* Move para o lado direito */

}
.top-antagonista p{
    font-size: 20px;
}


/* Área dos produtos biblia */

.card-biblia{
    width: 265px;
    height: 195px;
    background-color: white;

position: absolute;
top: 800px; /* Ajuste a posição vertical */
right: 515px; /* Move para o lado direito */

}
.card-biblia img{
    margin-top: 15px;
    margin-bottom: 10px;
    margin-left: 2px;

}
.top-biblia p{
    font-family: 'Courier New', Courier, monospace;
    font-size: 20px;
    font-weight: bold;
    margin-top: 10px;
}



/* Área dos produtos gazeta */
.card-gazeta{
    width: 265px;
    height: 195px;
    background-color: white;

}
.card-gazeta img{
    width: 170px;

}
.top-gazeta p{
    font-size: 20px;
}


/* Área dos produtos gospel */

.card-gospel{
    width: 265px;
    height: 195px;
    background-color: white;

}
.card-gospel img{
    width: 170px;

}
.top-gospel p{
    font-family: 'Courier New', Courier, monospace;
    font-size: 23px;
    font-weight: bold;
    margin-top: 10px;
}



/* Rodapé */
.footer {
    font-size: 20px;
    margin-left: 0%;
}



}

/*PARA TABLETS  PEQUENOS E MEDIOS*/
@media (min-width: 767px) and (max-width: 835px){


    .logo img {
        width: 220px;
    }
    .menu-btn {
        padding: 5px;
        font-size: 12px;
        
    }
    .menu-btn img.icon {
        width: 18px;
        height: 18px;
    }
    .supot{
        font-size: 20px;
        margin-left: 20px;
    }
    

/* ---------------------------------------------------*/

/* Área dos produtos jovempan */
.content {
    margin-left: 8%;
    padding: 20px;
    height: 135vh;

}

/* Área dos produtos revistaoeste */
.card-oeste{

    width: 265px;
    height: 195px;

top: 140px; /* Ajuste a posição vertical */
right: 70px; /* Move para o lado direito */

}

/* Área dos produtos onefootball */
.card-onefootball{
    width: 265px;
    height: 195px;


    top: 355px; /* Ajuste a posição vertical */
    right: 70px; /* Move para o lado direito */

}
    


/* Área dos produtos ancapsu */

.card-ancapsu{
    width: 265px;
    height: 195px;
    background-color: white;

position: absolute;
top: 790px; /* Ajuste a posição vertical */
right: 70px; /* Move para o lado direito */

}

/* Área dos produtos historinhas biblica */

.card-historinhas-biblica{
    width: 265px;
    height: 195px;
    background-color: white;

position: absolute;
top: 1010px; /* Ajuste a posição vertical */
right: 410px; /* Move para o lado direito */

}

/* Área dos produtos antagonista */

.card-antagonista{
    width: 265px;
    height: 195px;
    background-color: white;

position: absolute;
top: 790px; /* Ajuste a posição vertical */
right: 410px; /* Move para o lado direito */

}

/* Área dos produtos biblia */

.card-biblia{
    width: 265px;
    height: 195px;
    background-color: white;

position: absolute;
top: 570px; /* Ajuste a posição vertical */
right: 70px; /* Move para o lado direito */

}

/* Área dos produtos gazeta */
.card-gazeta{
    width: 265px;
    height: 195px;
    background-color: white;

}

/* Área dos produtos gospel */

.card-gospel{
    width: 265px;
    height: 195px;
    background-color: white;

}


    
}

/*PARA CELULARES MAIORES*/
@media (min-width: 365px) and (max-width: 420px){
    

    /* Sidebar */

    .sidebar {
        padding-top: 100px;
        height: 28vh;
    }
    .apagar{
        display: none;
    }
    .menu{
        margin-left: 9%;
    }
    .logo img {
        width: 220px;
        position: absolute;
        margin-top: -130px;
        margin-left: -12px;
    } 
    .menu-btn{
        padding-left: 30px;
        padding-right: 30px;
    }
    .fi{
    font-size: 34px;
    margin-top: 1px;
    margin-bottom: -1px;
    color: #ff6600;
    }
    .fa-solid{
    font-size: 34px;
    margin: 2px;
    color: #ff6600;
    }

    .supot{
        font-size: 20px;
        margin-left: 230px;
        position: absolute;
        margin-top: -170px;

    }

/* ---------------------------------------------------*/

/* Área dos produtos jovempan */
.content {
    margin-left: 8%;
    padding: 20px;
    height: 258vh;

}
/* Área dos produtos revistaoeste */
.card-oeste{
    width: 265px;
    height: 195px;
top: 458px; /* Ajuste a posição vertical */
right: 77px; /* Move para o lado direito */

}
/* Área dos produtos onefootball */
.card-onefootball{
    width: 265px;
    height: 195px;


top: 680px; /* Ajuste a posição vertical */
right: 77px; /* Move para o lado direito */

}

/* Área dos produtos ancapsu */
.card-ancapsu{
    width: 265px;
    height: 195px;
    background-color: white;

position: absolute;
top: 900px; /* Ajuste a posição vertical */
right: 77px; /* Move para o lado direito */

}

/* Área dos produtos historinhas biblica */
.card-historinhas-biblica{
    width: 265px;
    height: 195px;
    background-color: white;

position: absolute;
top: 1115px; /* Ajuste a posição vertical */
right: 77px; /* Move para o lado direito */

}

/* Área dos produtos antagonista */
.card-antagonista{
    width: 265px;
    height: 195px;
    background-color: white;

position: absolute;
top: 1340px; /* Ajuste a posição vertical */
right: 77px; /* Move para o lado direito */

}

/* Área dos produtos biblia */
.card-biblia{
    width: 265px;
    height: 195px;
    background-color: white;

position: absolute;
top: 1558px; /* Ajuste a posição vertical */
right: 77px; /* Move para o lado direito */

}

/* Área dos produtos gospel */
.card-gospel{
    width: 265px;
    height: 195px;
    background-color: white;

    position: absolute;
    top: 1777px; /* Ajuste a posição vertical */
    right: 77px; /* Move para o lado direito */

}

/* Área dos produtos gazeta */
.card-gazeta{
    width: 265px;
    height: 195px;
    background-color: white;

    position: absolute;
    top: 1998px; /* Ajuste a posição vertical */
    right: 77px; /* Move para o lado direito */
}


.footer {
    font-size: 12px;
    margin-left: 0%;
}

}

/*PARA CELULARES MENORES */
@media (min-width: 290px) and (max-width: 364px) {
    

/* Sidebar */

.sidebar {
    padding-top: 95px;
    height: 40vh;

}
.menu{
    margin-left: 5%;
}
.logo img {
    width: 170px;
    position: absolute;
    margin-top: -102px;
    margin-left: -1px;
} 
.menu-btn{
    padding-left: 25px;
    padding-right: 25px;

}
.apagar{
    display: none;
}
.menu-btn img.icon {
    width: 30px;
    height: 30px;
}
.supot{
    font-size: 17px;
    margin-left: 168px;
    position: absolute;
    margin-top: -140px;

}


/* ---------------------------------------------------*/

/* Área dos produtos jovempan */
.content {
    margin-left: 0%;
    padding: 20px;
    height: 450vh;

}

/* Área dos produtos revistaoeste */
.card-oeste{
    width: 265px;
    height: 195px;

top: 420px; /* Ajuste a posição vertical */
right: 20px; /* Move para o lado direito */

}

/* Área dos produtos onefootball */
.card-onefootball{
    width: 265px;
    height: 195px;


top: 636px; /* Ajuste a posição vertical */
right: 20px; /* Move para o lado direito */

}

/* Área dos produtos ancapsu */
.card-ancapsu{
    width: 265px;
    height: 195px;
    background-color: white;

position: absolute;
top: 855px; /* Ajuste a posição vertical */
right: 20px; /* Move para o lado direito */

}

/* Área dos produtos historinhas biblica */
.card-historinhas-biblica{
    width: 265px;
    height: 195px;
    background-color: white;

position: absolute;
top: 1070px; /* Ajuste a posição vertical */
right: 20px; /* Move para o lado direito */

}

/* Área dos produtos antagonista */
.card-antagonista{
    width: 265px;
    height: 195px;
    background-color: white;

position: absolute;
top: 1288px; /* Ajuste a posição vertical */
right: 20px; /* Move para o lado direito */

}

/* Área dos produtos biblia */
.card-biblia{
    width: 265px;
    height: 195px;
    background-color: white;

position: absolute;
top: 1505px; /* Ajuste a posição vertical */
right: 20px; /* Move para o lado direito */

}

/* Área dos produtos gazeta */
.card-gazeta{
    width: 265px;
    height: 195px;
    background-color: white;

    position: absolute;
    top: 1935px; /* Ajuste a posição vertical */
    right: 20px; /* Move para o lado direito */
}

/* Área dos produtos gospel */
.card-gospel{
    width: 265px;
    height: 195px;
    background-color: white;

    position: absolute;
    top: 1720px; /* Ajuste a posição vertical */
    right: 20px; /* Move para o lado direito */

}


.footer {
    font-size: 10px;
    margin-left: 0%;
}



    
    
    
}

/*PARTE DAS NOTIFICAÇOES FANTANSMA*/
@media (max-width: 1100px) {
    #notificacao-wrapper {
        display: none;
    }

}