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

@media screen and (max-width: 880px)
    {
/*---------------------Estilo y diseño de Invitacion---------------------*/

     .invita .text{ 
                   display: block;                     
                  }

     .invita .text .colum{
                          margin-top: 50px;
                          margin-left: 5px;
                         }

     .invita .text .colum img{
                              width: 49%;      /* Establece el ancho de un elemento */
                              height: 50%;
                              margin-bottom: 40px;
                             }
    
     .invita .text .colum .der{
                               display: flex;
                               width: 115%;      /* Establece el ancho de un elemento */
                               height: 50%;
                              }

     .invita .text .colum .der .inv{
                                    width: 45%;
                                    margin-inline: 15px;
                                   }
    
     .invita .text .colum .der .horario{
                                        width: 37%;
                                       }
    }


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

@media screen and (max-width: 768px)
    {
/*------------------------Carrusel de Imagenesn--------------------------*/
     .slider{
             height: 400px;
            }
    }



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

@media screen and (max-width: 540px)
    {
/*------------------------Carrusel de Imagenesn--------------------------*/
     .slider{
             height: 210px;
            }


/*------------------------Introduccion--------------------------*/

     .intro .title{
                   font-size: 15px;
                  }

     .intro .text{
                  display: block;
                 }

     .intro .text .columna{
                           width: 100%;
                           margin-bottom: 30px;
                          }


/*---------------------Estilo y diseño de Invitacion---------------------*/

     .invita .text .colum .der{
                               display: block;
                               width: 95%;
                              }
    
     .invita .text .colum .der .inv{
                                    width: 100%;
                                    text-align: center;
                                    margin-left: -1px;
                                   }

     .invita .text .colum .der .horario{
                                        width: 95%;
                                        margin-left: 10px;
                                       }


/*------------------------Perfiles--------------------------*/

     .Instructores .perfiles{
                             display: block;
                             margin-left: 26%;
                            }

     .Instructores .perfiles .perfil{
                                     margin-bottom: 40px;
                                     width: 60%;
                                    }

     .Instructores .perfiles .perfil .card::before{
                                                   width: 40.5%;
                                                  }

     .Instructores .perfiles .perfil .card .img{
                                                width: 28%;
                                                margin-inline: 9%;
                                               }
    }


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

@media screen and (max-width: 412px)
    {
/*------------------------Carrusel de Imagenesn--------------------------*/
     .slider{
             height: 220px;
            }

/*------------------Estilo y diseño de Introduccion------------------*/
     .intro .title{
                   font-size: 13px;
                   margin-bottom: 50px;
                  }

     .intro .text .columna h1{
                              font-size: 30px;
                             }

     .intro .text .columna p{
                             font-size: 17px;
                            }
                
/*------------------------Invitacion--------------------------*/

     .invita .text .colum img{
                              width: 100%;     
                              height: 50%;
                             }

     .invita .text .colum .der .inv{
                                    font-size: 17px;
                                   }

     .invita .text .colum .der .horario h1{
                                           font-size: 35px;
                                         }

     .invita .text .colum .der .horario p{
                                          font-size: 20px;
                                         }
    }