/*VIDEOS YOUTUBE*/
.videocrese{
    background:rgb(0, 17, 36);
}
.videocrese .descripcion{
    font-size:20px;
    color:white;
}
.contiene_video_youtube {
    width: 100%;           
    overflow:hidden;
    padding:20px;
}
.contiene_video_youtube .imagen {
    height:270px;
    width: 100%;            
    position: relative; /* Añadimos esta propiedad para establecer un contexto de posición */
 
}
.contiene_video_youtube .imagen img {
    position: absolute; /* Establecemos la posición absoluta para la imagen */
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: cover; /* Hacemos que la imagen cubra el contenedor */
   border-radius:7px;
}
.contiene_video_youtube h2 {
    font-size:16px;
    text-align:center;
}
/*VIDEOS YOUTUBE*/
/*VIDEO INDIVIDUAL*/
.lista{
    border-radius: 7px;
}
.contiene_lista_videos{
    width:100%;
    border:1px solid rgb(85, 85, 85);
    margin-bottom:5px;    
    overflow:hidden; 
    padding:5px;                   
}
.contiene_lista_videos .video{
   
    float:left;
    width:40%;            
}
.contiene_lista_videos .contenido{

    float:left;
    width:60%;    
    padding:6px;        
}

.container_video{
    width: 100%;
    overflow:hidden;
    background:rgb(1, 16, 34);
}
.izquierda_video{
    float:left;
    width:70%;
    padding:20px;
    background:rgb(3, 4, 24);
}
.izquierda_video h2{
   font-size:20px;
}
.izquierda_video .descripciones{
   color:rgb(168, 168, 168);
   white-space: pre-wrap;
   word-break: break-word;
}
.derecha_video{
    float:right;
    width:30%;
    padding:20px;
    background:rgb(3, 4, 24);
}
.derecha_video h2{
    padding:7px;
    color:white;
    font-size:16px;
 
}
.derecha_video .lista{
    padding:7px;
    color:white;
    background: #00132a;
    background-image: repeating-linear-gradient(45deg, transparent, transparent 5px, rgba(255, 255, 255, 0.02) 5px, rgba(255, 255, 255, 0.02) 10px), repeating-linear-gradient(-45deg, transparent, transparent 5px, rgba(255, 255, 255, 0.02) 5px, rgba(255, 255, 255, 0.02) 10px);
    background-size: 100px 100px;
}
.derecha_video .lista h4{
    font-size:16px;
    margin-bottom: 5px;
}
.derecha_video .lista .descripcion{
    font-size:14px;
    line-height: 1.4;
    color: #e0e0e0;
}

/* Forzar estilos del botón de videos en la lista para evitar que el texto sea invisible */
.derecha_video .lista .video a.btncrese_rojo,
.derecha_video .lista .video a.btncrese {
    background-color: #a10b00 !important;
    color: #ffffff !important;
    font-weight: 700 !important;
    display: block !important;
    text-align: center !important;
    padding: 8px !important;
    border-radius: 5px !important;
    margin-top: 8px !important;
    text-shadow: none !important;
}
.derecha_video .lista .video a.btncrese_rojo:hover,
.derecha_video .lista .video a.btncrese:hover {
    background-color: #7a0800 !important;
    color: #ffffff !important;
}
/*VIDEO INDIVIDUAL*/

/* Eliminar fondo blanco de la tarjeta del especialista en la página de video */
.izquierda_video .taller {
    background: transparent !important;
    box-shadow: none !important;
    border: none !important;
}
.izquierda_video .taller .contenido {
    background: transparent !important;
}
/* Hacer que el texto del especialista resalte en fondo oscuro */
.izquierda_video .especialista_video .titulo {
    color: #ffffff !important;
    font-size: 1.2rem;
    font-weight: 700;
}
.izquierda_video .especialista_video .descripcion {
    color: #c8d6e5 !important;
    font-size: 0.95rem;
    line-height: 1.6;
}
.izquierda_video .taller .titulo a,
.izquierda_video .taller .titulo {
    color: #ffffff !important;
}
.izquierda_video .taller .descripcion {
    color: #c8d6e5 !important;
}


@media (max-width: 992PX) {
    .izquierda_video{
        width:100%;
    }
    .derecha_video{
        width:100%;
    }
 
    .izquierda_video h2{
        font-size:27px!important;
    }
    .derecha_video h2{
        font-size:27px!important;
    }
    .derecha_video .lista h4{
        font-size:24px!important;
    }
    .derecha_video .lista .descripcion{
        font-size:20px!important;
    }
}
@media (min-width: 0px) and (max-width: 600px) {
    .izquierda_video h2{
        font-size:20px!important;
         
    }
    .derecha_video h2{
        font-size:20px!important;
        
    }
    .derecha_video .lista h4{
        font-size:17px!important;
        line-height: 16px;
    }
    .derecha_video .lista .descripcion{
        font-size:13px!important;
        line-height: 16px;
    }
}