﻿@font-face {
    font-family: 'Panton';
    src: url('../Fonts/Fontfabric - Panton Black.otf');
}

@font-face {
    font-family: 'Odin';
    src: url('../Fonts/Odin Rounded - Light.otf');
}

@font-face {
    font-family: GloberSemiBold;
    src: url('../Fonts/Fontfabric - GloberSemiBold.otf') format('opentype');
}


.verMas, .btn{
    margin-top: 5px;
    font-size: 15px;
	color: #4141a0;
	height: 32px;
	display: inline-block;
    border: solid 1px;
    border-radius: 3px;
    text-align: center;
    padding: 2px 10px;
    border-color: #4141a0;
    transition: all .3s ease;
}

.verMas:hover, .btn:hover{
	color: #fff;
	background-color: #4141a0;
}

.verMas:visited, #verMas:focus, #verMas:hover{
	outline: none;
    text-decoration: none;
}

*{
    font-family: GloberSemiBold, sans-serif;
}

a{
    text-decoration: none;  
    color: #b9b9b9; 
}

a:hover{
    text-decoration: none;  
    color: #55504f;  
}

img{
    width: 100%;
    height: 100%;
}

.previousVideo:hover, .nextVideo:hover, .previousVideoXs:hover, .nextVideoXs:hover{
    background-color: #f9c73d;
    color: #000;
}

.previousVideo, .nextVideo{
    background-color: #171717;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    font-size: 35px;
    width: 40px;
    height: 40px;
    line-height: 40px;
    text-align: center;
    border-style: solid;
    border-width: 1px;
    border-radius: 3px;
    font-size: 18px;
    color: #3f3f3f;
    transition: all ease .2s;
}

.previousVideoXs, .nextVideoXs{
    font-size: 35px;
    width: 40px;
    height: 40px;
    line-height: 40px;
    text-align: center;
    border-style: solid;
    border-width: 1px;
    border-radius: 3px;
    font-size: 18px;
    color: #3f3f3f;
     transition: all ease .2s;
     margin-bottom: 1%;
}

.previousVideoXs, .nextVideoXs {
    position: relative;
}

.previousVideoXs{
    float: left;
}

.nextVideoXs{
    float: right;
}

#videoContainerXs{
    visibility: hidden;
}


#videoContainer, #videoContainerXs{
    background-color: #171717;
    position: relative;
}


.previousVideo{
 
    left: 5%;
    visibility: visible;
}

.nextVideo{
  right: 5%;
  visibility: visible;
}

@media screen and (max-width: 720px) {
  #videoContainerXs{
    visibility: visible;
   }
    .previousVideo, .nextVideo{
    visibility: hidden;
    }
}


#imagenPrograma{
   width: 120px;
    height: 120px;
    margin: 0 auto;
}

.tituloProgramaVideo{
    font-size: 24px;
    margin: 0 0 10px 0;
    color: #4141a0;
    display: inline-block;
    vertical-align: middle;
}

/*.btn{
     color: #4141a0;
     border: solid 1px #4141a0;
}*/

#mediaplayer{
    display: block;
    margin: 0 auto;
  /*  width: 100%;
    height: 100%;*/
}

#nombreEpisodio{
    margin-top: 25px;
}

#detallePrograma{
    color: #8e8e8e;
}

#fechaVideo{
    margin-left: 5px;
    font-size: 11px;
    color: #c6c6c6;
}

.nombreProgramaVideo{
    margin-bottom: 10px;
    font-size: 11px;
}

#infoEpisodio{
    margin-top: 15px;
}

#tituloInfoGeneral{
     font-size: 15px;
    /*margin: 0 0 10px 0;*/
    color: #4141a0;
    display: inline-block;
    vertical-align: middle;
}
/* */
#descEpisodio{
    font-size: 15px;
    color: #8e8e8e;
    line-height: 1.7em;
}
 
#detallePrograma{
    margin-top: 15px;
}

#tituloEpisodiosAdicionales {
   color: #4141a0;
   font-size: 18px;
}

