/*
	CSS personalizado para 07 CANAL YOUTUBE
*/

/**************************************** GAMA DE COLORES ****************************************/

/*    Rojo Oscuro: DD0000 rgb(221,  0,  0) */
/*           Gris: 999999 rgb(153,153,153) */
/*     Rojo Medio: F3A6A6 rgb(243,166,166) */
/*     Rojo Claro: F9D2D2 rgb(249,210,210) */
/* Rojo Muy Claro: FDEDED rgb(253,237,237) */
/*          Beige: CB9D61 rgb(203,157, 97) */

/************************************ MODIFICADOS DE syle-home ***********************************/

/******************************************* GENERALES *******************************************/

/****************************************** #rowSuscribe *****************************************/

#rowSuscribe .divSuscribe { height: 400px; display: flex; }
#rowSuscribe .divYoutube  { height: 100%; width: 50%; display: flex; align-items: flex-end; justify-content: center; background-image: url("/wp-content/uploads/cabecera_youtube.jpg"); }
#rowSuscribe .divYoutube  { background-repeat: no-repeat; background-position: center center; background-size: cover; }
#rowSuscribe .divYouku    { height: 100%; width: 50%; display: flex; align-items: flex-end; justify-content: center; background-image: url("/wp-content/uploads/cabecera_youku.jpg"); }
#rowSuscribe .divYouku    { background-repeat: no-repeat; background-position: center center; background-size: cover; }

#rowSuscribe .aButton     { margin-bottom: 30px; padding: 15px; width: 500px; }
#rowSuscribe .aButton h2  { color: #FFFFFF; }

@media (max-width: 1180px) {
	#rowSuscribe .aButton     { width: 440px; }
}

@media (max-width: 980px) {
	#rowSuscribe .divSuscribe { height: 300px; }
	#rowSuscribe .aButton     { margin-bottom: 25px; padding: 10px; width: 340px; }
	#rowSuscribe .aButton h2  { font-size: 20px; }
}

@media (max-width: 780px) {
	#rowSuscribe .divSuscribe { height: 260px; }
	#rowSuscribe .aButton     { margin-bottom: 20px; width: 270px; }
	#rowSuscribe .aButton h2  { font-size: 16px; }
}

@media (max-width: 580px) {
	#rowSuscribe .divSuscribe { height: auto; flex-wrap: wrap; }
	#rowSuscribe .divYoutube  { height: 200px; width: 100%; }
	#rowSuscribe .divYouku    { height: 200px; width: 100%; }
	#rowSuscribe .aButton     { margin-bottom: 15px; padding: 10px 0px; }
}

@media (max-width: 480px) {
	#rowSuscribe .aButton    { width: 240px; }
	#rowSuscribe .aButton h2 { font-size: 14px; }
}

/****************************************** #rowPlayList *****************************************/

#rowPlayList .divPlayList                           { margin: 0px auto; padding: 0px 40px; width: 100%; max-width: 980px; }
#rowPlayList .epyt-video-wrapper                    { padding: 10px; background: #FFFFFF; }
#rowPlayList .epyt-video-wrapper     iframe         { margin: 10px; width: calc(100% - 20px); height: calc(100% - 20px); }
#rowPlayList .epyt-gallery-list                     { margin: 0px; }
#rowPlayList .epyt-gallery-allthumbs                { display: flex; flex-wrap: wrap; justify-content: space-between; }
#rowPlayList .epyt-gallery-thumb                    { float: none; margin-bottom: 10px; padding: 5px; width: calc((100% - 30px) / 4); background: #FFFFFF; }
#rowPlayList .epyt-gallery-rowbreak                 { display: none; }
#rowPlayList .epyt-gallery-clear                    { display: none; }
#rowPlayList .epyt-gallery-title                    { padding: 10px; font-family: var(--font-family-narrow); font-size: 14px; font-weight: 600; line-height: 110%; }
#rowPlayList .epyt-gallery-playhover .epyt-play-img { width: 48px; max-width: none !important; }
#rowPlayList .epyt-pagination                       { padding: 20px 0px; }
#rowPlayList .epyt-pagination *                     { font-family: var(--font-family-narrow); font-size: 18px; font-weight: 700; color: #FFFFFF; }
#rowPlayList .epyt-pagination:last-of-type          { margin-top: 15px; padding-top: 10px; border-top: solid 1px var(--color1-hex); }


@media (max-width: 780px) {
	#rowPlayList .divPlayList                           { padding: 0px 30px; }
	#rowPlayList .epyt-gallery-thumb                    { width: calc((100% - 20px) / 3); }
	#rowPlayList .epyt-pagination                       { padding: 15px 0px; }
}

@media (max-width: 580px) {
	#rowPlayList .divPlayList                           { padding: 0px 20px; }
	#rowPlayList .epyt-video-wrapper                    { padding: 5px; }
	#rowPlayList .epyt-video-wrapper     iframe         { margin: 5px; width: calc(100% - 10px); height: calc(100% - 10px); }
	#rowPlayList .epyt-gallery-thumb                    { width: calc((100% - 10px) / 2); }
	#rowPlayList .epyt-gallery-title                    { padding: 5px; font-size: 13px; }
	#rowPlayList .epyt-gallery-playhover .epyt-play-img { width: 40px; }
	#rowPlayList .epyt-pagination                       { padding: 15px 0px; }
	#rowPlayList .epyt-pagination *                     { font-size: 16px; }
	#rowPlayList .epyt-pagination:last-of-type          { margin-top: 10px; padding-top: 5px; }
}

@media (max-width: 380px) {
	#rowPlayList .epyt-gallery-thumb                    { width: 100%; }
	#rowPlayList .epyt-gallery-playhover .epyt-play-img { width: 48px; }
}
