

.container--flex{
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: center;
}

.column{
    width: 100%;
}

/*____________________________Estilo de main _____________________*/
.classroom-description{
    text-align: center;
}
.evangelio-classroom{
    padding: 5px;
    border-bottom: 2px solid orange;
    margin-bottom: 30px;
    display: inline-block;
   
}

.img-evangelio{
    width: 100%;
    height: 350px;
    object-fit: cover;
    margin-bottom: 20px;
}

.evangelioHogar{
    object-position: left;
}

.description-txt{
  font-size: 17px;
  line-height: 20px;
  text-align: justify;
  margin-bottom: 20px;
}

.Schedule{
   margin-bottom: 20px;
   text-align: left;


}

.time-txt{
    font-size: 17px;
    line-height: 25px;
    margin-bottom: 20px;
    text-align: left;
}
.link-aetrf{
    text-decoration: none;
    color:blue;
}


.classroom{
    padding: 10px;
    border:2px solid orange;
    text-align: left;
    position: relative;
    cursor: pointer;
    font-size: 17px;

}


.icon-angle-down:before{
    color: orange;
    margin: 0 0 0 10px;
    position: relative;
    font-size: 30px;
    top: 5px;
}


.classlist, .book_list{
    list-style: none;
    font-size: 17px;
    border: 0;
    margin: 0;
    overflow: hidden;
    height: 0px;
    margin-bottom: 20px;
    padding: 0;
    text-align:left;
    transition: height .3s linear;
}

.classlist{
    background-color: white;
    border: 1px solid orange;

}
.link-class{
    display: block;
    text-decoration: none;
    color:black;
    padding: 10px;
    
}

.link-class:hover{
   background: #D3D3D3;
   font-weight: bolder;
}

.d-libro{
    text-decoration: none;
    color:white;
    padding: 5px;
    margin: 10px;
    border-radius: 6%;
    background: cornflowerblue;
}



.mostrar-clases{
    height: 220px;
    overflow: scroll;
}



.see-class{
    width: 100%;
}

/*________________Estilos de responsive bases_______________________________*/


@media screen and (min-width:480px){

    /*_____________-estilos de main-cursos_________________*/

    .container-curso [class*="clase-"]{
        width: 32%;
        margin-bottom: 50px;
        height: 200px;
        margin: auto;
        margin-bottom: 15px;
    }
}

/*________________Estilos de responsive bases_______________________________*/

@media screen and (min-width:770px){

    .column--33{
        width: 32%;
    
    }

    

    .evangelio-classroom{
        font-size: 2em;
        margin-bottom: 20px;
    }

    .classroom-description .column--50{
        width: 48%;
    }
    
    .classroom-description{
        margin-bottom: 40px;

    }

    .img-evangelio{
        width: 80%;
        height:auto;
        object-position:center;
        margin: auto;
    }
    
    .description-txt, .Schedule, .time-txt{
        width: 95%;
        margin: auto;

    }

    .description-txt{
        margin-bottom: 20px;
    }
    .Schedule, .time-txt{
        text-align: left;
        margin-bottom: 15px;
    }

/*_______________main-cursos_____________________________*/
    
    

    .container-class{
        position: relative;
        margin-bottom: 20px;
   
    }
}


@media screen and (min-width:1024px){
   

    .classroom-description{
        margin-bottom: 80px;
    }
    .evangelio-classroom{
        margin-bottom: 80px;
        font-size: 2.5em;
    }
    .img-mediumnidad{
        width: 70%;
        height: auto;
        
    }

    .d-libro{
        color:white;
        padding: 5px;
        margin: 10px;
        border-radius: 6%;
        background: cornflowerblue;
    }

    .link-aetrf{
        color:cornflowerblue;
        padding: 3px;
        border-radius: 6%;
        
    } 
}   
