/*.image-container {*/
/*    display: flex;*/
/*    flex-wrap: nowrap;*/
/*}*/
/*.image-row {*/
/*    display: flex;*/
/*    width: 100%;*/
/*}*/
/*.image-container>.image-row>a{*/
/*    object-fit: cover;*/
/*    width: 8vw;*/
/*    margin: 10px;*/
/*    padding: 15px 5px 0px 10px;*/
/*    border-radius: 10px 10px 10px 10px;*/
/*    -webkit-border-radius: 10px 10px 10px 10px;*/
/*    -moz-border-radius: 10px 10px 10px 10px;*/
/*}*/

/* ==================== CONTAINER E ROW ==================== */
.image-container,
.image-container-passado {
    display: flex !important;
    flex-wrap: wrap !important;
    width: 100% !important;
}

.image-row,
.image-row-passado {
    display: flex !important;
    flex-wrap: wrap !important;
    justify-content: center !important;
    width: 100% !important;
    gap: 8px !important;
}

/* ==================== CARDS DOS MESES ==================== */
.image-row > a,
.image-row-passado > a {
    width: 8vw !important;
    max-width: 145px !important;
    margin: 5px !important;
    padding: 10px 6px 6px !important;
    border-radius: 10px !important;
    flex: 0 0 auto !important;
    box-sizing: border-box !important;
    text-align: center;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
}

/* Ícone */
.image-row a img,
.image-row-passado a img {
    width: 37px !important;
    margin-bottom: 5px !important;
}

/* Texto - Evita quebra de linha */
.image-row a p.h4,
.image-row-passado a p.h4,
.image-row a strong,
.image-row-passado a strong {
    font-size: 0.97rem !important;
    margin: 2px 0 0 0 !important;
    line-height: 1.1 !important;
    white-space: nowrap !important;
    font-weight: bold;
}

/* ==================== RESPONSIVIDADE ==================== */

/* Desktop - 4 por linha */
@media (min-width: 992px) {
    .image-row > a,
    .image-row-passado > a {
        width: 22% !important;
        max-width: 135px !important;
    }
}

/* Tablet - 3 por linha */
@media (min-width: 769px) and (max-width: 991px) {
    .image-row > a,
    .image-row-passado > a {
        width: 30% !important;
    }
}

/* Mobile - 2 por linha */
@media (max-width: 768px) {
    .image-row > a,
    .image-row-passado > a {
        width: 47% !important;
        max-width: 158px !important;
        padding: 9px 5px 5px !important;
    }

    .image-row a img,
    .image-row-passado a img {
        width: 35px !important;
    }
}

/* Celulares pequenos */
@media (max-width: 480px) {
    .image-row > a,
    .image-row-passado > a {
        width: 46% !important;
        padding: 8px 4px 4px !important;
    }
}
/*========================================================================*/
.image-container>.image-row>a>img {
    width: 3vw;
}
.image-container a>h6 {
   text-decoration: none;
   font-size: 2.2em;
   font-weight: 1500;       
}
.botão {
    margin: 10px;
    border: none;
    background-color: white;
}
.botão:hover{
    width: 190px;
}
.image-container-passado {
    display: flex;
    flex-wrap: wrap;  
}    
.image-row-passado {
    display: flex;
    flex-wrap: wrap;  
    justify-content: center;       
}
.image-container-passado>.image-row-passado>.passado{   
    object-fit: contain;
    width: 8vw;  
    margin: 10px;
    padding: 15px 5px 0px 10px;
    border-radius: 10px 10px 10px 10px;
    -webkit-border-radius: 10px 10px 10px 10px;
    -moz-border-radius: 10px 10px 10px 10px;
}  
.image-container-passado>.image-row-passado>.passado>img {
    width: 3vw;
}

/* Responsividade  */

@media (max-width: 1428px) {
    .image-container>.image-row>a>img {
        width: 2.8vw;
    }
    .image-container a>h6 {
        font-size: 2em; 
        white-space: nowrap;
        transform: scale(0.7);
    }
    .image-container>.image-row>a{ 
        width: 7.2vw;        
        margin: 10px;
        padding: 15px 5px 0px 10px;
        border-radius: 10px 10px 10px 10px;
        -webkit-border-radius: 10px 10px 10px 10px;
        -moz-border-radius: 10px 10px 10px 10px;
    }    

    .image-container-passado>.image-row-passado>.passado{   
        object-fit: contain;
        width: 7.2vw;  
        margin: 10px;
        padding: 15px 5px 0px 10px;
        border-radius: 10px 10px 10px 10px;
        -webkit-border-radius: 10px 10px 10px 10px;
        -moz-border-radius: 10px 10px 10px 10px;
    }  
}

@media (max-width: 1440px) {
    .image-container-passado>.image-row-passado>.passado{   
        object-fit: contain;
        width: 11vw;  
        margin: 10px;
        padding: 15px 5px 0px 10px;
        border-radius: 10px 10px 10px 10px;
        -webkit-border-radius: 10px 10px 10px 10px;
        -moz-border-radius: 10px 10px 10px 10px;
    }  
    .image-container-passado>.image-row-passado>.passado>img {
        width: 3vw;
    }
    .image-container-passado a>h6 {
        width: 100%;
        font-size: 2.2em; 
        white-space: nowrap;
    }
}


@media (max-width: 1148px) {
    .image-container-passado>.image-row-passado>.passado{   
        object-fit: contain;
        width: 13vw;  
        margin: 10px;
        padding: 15px 5px 0px 10px;
        border-radius: 10px 10px 10px 10px;
        -webkit-border-radius: 10px 10px 10px 10px;
        -moz-border-radius: 10px 10px 10px 10px;
    }  
    .image-container-passado>.image-row-passado>.passado>img {
        width: 4vw;
    }
    .image-container-passado a>h6 {
        width: 100%;
        font-size: 2.2em; 
        white-space: nowrap;
    }
}

@media (max-width: 944px) {
    .image-container-passado>.image-row-passado>.passado{   
        object-fit: contain;
        width: 15vw;  
        margin: 10px;
        padding: 15px 5px 0px 10px;
        border-radius: 10px 10px 10px 10px;
        -webkit-border-radius: 10px 10px 10px 10px;
        -moz-border-radius: 10px 10px 10px 10px;
    }  
    .image-container-passado>.image-row-passado>.passado>img {
        width: 5vw;
    }
    .image-container-passado a>h6 {
        font-size: 1.8em;
    }
}


@media (max-width: 672px) {
    .image-container-passado>.image-row-passado>.passado{   
        object-fit: contain;
        width: 20vw;  
        margin: 10px;
        padding: 15px 5px 0px 10px;
        border-radius: 10px 10px 10px 10px;
        -webkit-border-radius: 10px 10px 10px 10px;
        -moz-border-radius: 10px 10px 10px 10px;
    }  
    .image-container-passado>.image-row-passado>.passado>img {
        width: 8vw;
    }
    .image-container-passado a>h6 {
        font-size: 1.8em;
    }
}

@media (max-width: 991px) {
    .image-container>.image-row>a>img {
        width: 5vw;
    }
    .image-container>.image-row>a{ 
        width: 12vw;        
        margin: 10px;
        padding: 15px 5px 0px 10px;
        border-radius: 10px 10px 10px 10px;
        -webkit-border-radius: 10px 10px 10px 10px;
        -moz-border-radius: 10px 10px 10px 10px;
    }    
}


@media (max-width: 498px) {

    .botão {
        margin: 3px;
        border: none;
        background-color: white;
    }

    .botão>img{
        width: 25px;
    }


    .image-container>.image-row>a>img {
        width: 7vw;
    }
    .image-container>.image-row>a{ 
        width: 13vw;        
        margin: 5px;
        padding: 15px 5px 0px 10px;
        border-radius: 10px 10px 10px 10px;
        -webkit-border-radius: 10px 10px 10px 10px;
        -moz-border-radius: 10px 10px 10px 10px;
    }   
    .image-container>.image-row>a>h6{
        text-align: left;
    }
    .image-container-passado>.image-row-passado>.passado{   
        object-fit: contain;
        width: 20vw;  
        margin: 10px;
        padding: 15px 5px 0px 10px;
        border-radius: 10px 10px 10px 10px;
        -webkit-border-radius: 10px 10px 10px 10px;
        -moz-border-radius: 10px 10px 10px 10px;
    }  
    .image-container-passado>.image-row-passado>.passado>img {
        width: 8vw;
    }
    .image-container-passado a>h6 {
        font-size: 1.8em;
    }
}