@charset "utf-8";
html, body, body div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, abbr, address, cite, code, del, dfn, em, img, ins, kbd, q, samp, small, strong, sub, sup, var, b, i, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, figure, footer, header, menu, nav, section, time, mark, audio, video, details, summary {margin: 0;padding: 0;border: 0;font-size: 100%; vertical-align: baseline;background: transparent;}
article, aside, figure, footer, header, nav, section, details, summary {display: block;}
html {box-sizing: border-box;}
*,*:before,*:after {box-sizing: inherit;}
img,object,embed {max-width: 100%;}
html {overflow-y: scroll;}
ul {list-style: none;}
blockquote, q {quotes: none;}
blockquote:before,blockquote:after,q:before,q:after {content: ''; content: none;}
a {margin: 0; padding: 0; font-size: 100%; vertical-align: baseline; background: transparent;}
del {text-decoration: line-through;}
abbr[title], dfn[title] {border-bottom: 1px dotted #000; cursor: help;}
table {border-collapse: collapse; border-spacing: 0;}
th {font-weight: bold; vertical-align: bottom;}
td {font-weight: normal; vertical-align: top;}
hr {display: block; height: 1px; border: 0; border-top: 1px solid #ccc; margin: 1em 0; padding: 0;}
input, select {vertical-align: middle;}
pre {white-space: pre; white-space: pre-wrap; white-space: pre-line; word-wrap: break-word;}
input[type="radio"] {vertical-align: text-bottom;}
input[type="checkbox"] {vertical-align: bottom;}
.ie7 input[type="checkbox"] {vertical-align: baseline;}
.ie6 input {vertical-align: text-bottom;}
select, input, textarea {font: 99% sans-serif;}
table {font-size: inherit; font: 100%;}
small {font-size: 85%;}
strong {font-weight: bold;}
td, td img {vertical-align: top;}
sub, sup {font-size: 75%; line-height: 0; position: relative;}
sup {top: -0.5em;}
sub {bottom: -0.25em;}
pre, code, kbd, samp {font-family: monospace, sans-serif;}
.clickable,label,input[type=button],input[type=submit],input[type=file],button {cursor: pointer;}
button, input, select, textarea {margin: 0;}
button, input[type=button] {width: auto; overflow: visible;}
.ie7 img {-ms-interpolation-mode: bicubic;}
.clearfix:before, .clearfix:after { content: "\0020"; display: block; height: 0; overflow: hidden; }
.clearfix:after { clear: both; }
/*.clearfix { zoom: 1; }*/
/*====================================================*/


html, body {width:100%; font-family:Roboto,'Trebuchet MS', sans-serif; color:#000; font-size:14px; margin:0 auto; padding:0; display:block; border:0; font-weight:400;}

body {position:relative; background:#f3f3f3;}

* {box-sizing:border-box; -webkit-box-sizing:border-box;}
 
a, a:focus {text-decoration:none; border:none; outline:none;}
strong, b {font-weight:bold;}
img {max-width:100%;  display:inline-block;}
p {font-family:'Trebuchet MS', sans-serif; font-size:13px; line-height:1;}

.hidden {display:none!important;}

.flex {display:flex; flex-wrap:wrap; flex-direction:row;}

.container {margin:0 auto; width:98%; position:relative;}

#main {padding:92px 4% 60px 285px; width:100%; max-width:1770px;}

.gototop {position:fixed; bottom:-130px; right:1%; width:48px; transition:ease 0.3s all; cursor:pointer;}
.gototop.show {bottom:30px;}


/*GENERIC*/
.thumb {width:100%; display:flex; align-items:center; margin-bottom:6px; overflow:hidden; aspect-ratio:16/9; }
	.thumb:hover img {transform:scale(1.05);}
	.thumb img {display:block; transition:0.3s ease all;}
.title {font-size:16px; width:100%; color:#000000; margin-bottom:6px; font-weight:500; line-height:1.1;}
.serie {font-size:13px; width:auto; border:1px solid #a01013; color:#a01013; padding:3px 4px 2px 4px; display:inline-block; border-radius:3px; margin-bottom:6px; line-height:1.1;}
.categ {font-size:13px; width:100%; color:#606060; font-style:italic; line-height:1.1;}

.serie:hover {border-color:#ec1c24!important; color:#ec1c24!important;}
.title:hover {color:#ec1c24!important;}




/*HEADER*/
header {width:100%; padding:20px 30px 20px 30px; position:fixed; top:0; left:0; z-index:99; background:#f3f3f3;}
header .boton_menu {display:none;}
header .logo {width:225px;}
header .buscador {padding:0; width:70%; position:absolute; top:20px; left:295px; }
header .buscador #buscar {width:60%; height:30px; border:1px solid #ccc; background:#f6f6f6; border-right:none; padding:0 0 0 5px; line-height:30px; border-radius:2px 0 0 2px;}
header .buscador #boton {width:60px; height:30px; border:1px solid #ccc; padding:0; background:none; border-radius:0 2px 2px 0;}
header .buscador #boton svg {max-width:100%; padding:4px;}
header .buscador #boton svg .lupa {max-width:100%; color:#ccc; opacity:0.6;}
header .buscador .flecha {display:none;}
header .desplegar_busqueda {display:none;}
header .logo_bibliote {position:absolute; right:1%; top:22px; width:160px;}




/*MENU*/
.categorias {width:260px; position:absolute; top:0; left:0; padding:92px 0 20px 0;}
.categorias .boton_menu {display:none;}
.categorias .logo {display:none;}
.categorias ul {margin:0; padding:0;}
.categorias ul li {height:38px; line-height:38px; padding:0 0 0 30px;}
.categorias ul li a {color:#606060; font-size:14px; font-weight:bold; display:block;}
.categorias ul li:hover {background:#e0e0e0;}
.categorias ul li:hover a {color:#ec1c24;}
.categorias ul li a svg {margin:0 10px -4px 0; height:18px; fill:#606060;}
.categorias ul li:hover a svg {fill:#ec1c24;}
.categorias ul li.active {background:#e5e5e5;}
.categorias ul li.active a {color:#ec1c24;}
.categorias ul li.active a svg {fill:#ec1c24;}





/*HOME*/
.grupo {width:100%; position:relative; padding:0 0 10px 0;}
.grupo .categ_title {font-size:21px; font-weight:bold; margin-bottom:15px; color:#ec1c24; padding-left:1%;}
.grupo .categ_title svg {height:23px; margin:0 10px -4px 0; fill:#ec1c24;}
.grupo a .categ_title:hover {color:#606060;}
.grupo a .categ_title:hover svg  {fill:#606060;}
.grupo .categ_title img {margin:0 6px -2px 0}
.grupo .ver_todos {position:absolute; top:5px; right:1%; font-size:15px; font-weight:700; color:#ec1c24;}
.grupo .ver_todos:hover {color:#606060;}
.grupo .ver_todos:hover span {background:#606060;}
.grupo .ver_todos .plus {width:14px; height:14px; margin:0 0 -2px 0; display:inline-block;}
.grupo .ver_todos .plus_path {fill:#ec1c24;}
.grupo .ver_todos:hover .plus_path {fill:#606060;}
.grupo .flex {width:100%;}
.grupo .videolink {width:20%; display:block; padding:0 1% 20px 1%;}
.grupo .videolink .thumb {margin-bottom:5px;}

.grupo .videolink .title {font-size:14px; margin-bottom:4px;}
.grupo .videolink .serie {font-size:11px; margin-bottom:5px;}
.grupo .videolink .categ {font-size:11px; }
.grupo .videolink .unidad {font-size:11px; color:#a01013; margin-bottom:3px;}

.linea {height:2px; background:#dadada; width:98%; margin-bottom:30px; margin-left:1%;}




/*VIDEO VIEW*/
.video {padding-left:1%; padding-right:5%;}
.video .aspect-ratio {position: relative;  width: 100%;  height: 0;  padding-bottom: 56.25%; margin-bottom:10px;}
.video #frame_video {width:100%; height:100%; position:absolute; top:0; left:0;}

.video .titulo {font-size:21px; margin-bottom:8px; font-weight:700;}
.video .serie  {font-size:15px; margin-bottom:8px; }
.video .categ  {font-size:15px; margin-bottom:20px;}
.video .embed {float:right; border:1px solid #ccc; padding:3px 6px; color:#606060; font-size:12px; cursor:pointer;}
.video .embed.copiado {background:#ccc; color:white;}



/*RELATED*/
.relacionados {padding-right:5%;}
.relacionados h3 {font-weight:700; font-size:16px; margin:20px 0 10px 0; padding:0 0 0 1%;}
.relacionados .flex {width:100%;}
.relacionados .videolink {width:20%; display:block; padding:0 1% 10px 1%;}

.relacionados .videolink .title {font-size:14px; margin-bottom:4px;}
.relacionados .videolink .serie {font-size:11px; margin-bottom:5px;}
.relacionados .videolink .categ {font-size:11px;}


/*BUSQUEDA*/
.busqueda {width:66%; padding-left:1%; display:flex; flex-wrap:wrap;}
.busqueda h3 {width:100%; font-size:16px; margin-bottom:20px; padding:0 0 10px 0; font-weight:400; line-height:1.1; border-bottom:1px solid #ccc;}
.busqueda .result {width:100%; border-bottom:1px solid #ccc; padding:0 0 10px 0; margin:0 0 10px 0;}
.busqueda .result .thumblink {width:165px; float:left; margin-right:10px;}
.busqueda .result .thumblink img {display:block;}

.busqueda .result .datos .title {font-size:18px;}
.busqueda .result .datos .serie {font-size:12px;}
.busqueda .result .datos .unidad {font-size:13px; color:#a01013; margin-bottom:3px;}
.busqueda .result .datos .categ {font-size:13px;}



/*SERIES*/
.series_container {width:100%; position:relative; padding:0 0 20px 0;}
.series_container .serie_title {font-size:21px; font-weight:700; margin-bottom:20px; color:#a01013; padding-left:1%;}
.series_container .flex {width:100%;}
.series_container .flex .videolink {width:20%; display:block; padding:0 1%; position:relative; margin-bottom:20px;}
.series_container .flex .videolink .nro_orden {position:absolute; top:0; left:5%; background:#a01013; color:white; font-weight:bold; width:30px; height:30px; line-height:30px; text-align:center; z-index:9;}


/*CATEGORIAS*/
.listado_series h1 {font-size:24px; color:#ec1c24; margin-bottom:40px; line-height:30px; padding-left:1%;}
.listado_series h1 img {margin:0 10px 0 0;}
.listado_series h1 svg {margin:0 10px -5px 0; height:23px; fill:#606060}
.listado_series .categ_title {color:#a01013}


footer {position:fixed; bottom:0; right:0; background:#f3f3f3; font-size:11px; color:#606060; padding:5px 5px;}



@media (max-width:1280px) {

	.categorias {width:103px;	}
	.categorias ul li {line-height:1.2; height:auto; padding:10px 5px;}
	.categorias ul li a {font-size:12px; text-align:center; }
	.categorias ul li a svg {display:block; margin:0 auto 3px auto;}
	
	#main {padding-left:150px}
	
	.busqueda {width:100%;}
}


@media (max-width:990px) {
	
	#main {padding-left:125px; padding-right:2%;}
	
	header .buscador {width:55%; left:250px;}
	
	.grupo .videolink {width:25%;}
	.home .grupo .videolink:last-child {display:none;}
	
	.relacionados .videolink {width:25%;}
	.relacionados .videolink:last-child {display:none;}
	
}

@media (max-width:768px) {
	
	header {padding-left:2%;}
	header .boton_menu {display:block; width:30px; float:left; margin-right:15px; cursor:pointer;}
	header .boton_menu .barritas_g {fill:#ec1c24;}
	
	header .buscador {width:43%; left:unset; right:7%;}
	header .buscador #buscar {width:80%;}
	header .buscador #boton {width:20%}
	header .link_bibliote {display:block; position:absolute; top:22px; right:2%; width:15px;  overflow:hidden;}
	header .logo_bibliote {position:relative; top:unset; right:unset; max-width:none;}
	
	.sombra {display:none; background:rgba(0,0,0,0.5); position:absolute; top:0; left:0; width:100%; height:100%; z-index:999;}
	.sombra.shown {display:block;}
	
	#main {padding-left:2%; padding-right:2%;}
	
	.categorias {width:260px; transition:0.3s ease all; transform:translateX(-255px); background:#f3f3f3; z-index:9999; padding-top:20px;}
	.categorias.shown {transform:translateX(0);}
	.categorias .boton_menu {display:block; width:30px; float:left; margin:0 15px; cursor:pointer;}
	.categorias .boton_menu .barritas_g {fill:#ec1c24;}
	.categorias .logo {display:block; margin-bottom:40px; padding-left:15px; }
	.categorias .logo img {width:110px; margin-top:5px;}
	.categorias ul li {line-height:38px; height:38px; padding:0 0 0 15px;}
	.categorias ul li a {font-size:14px; text-align:left; }
	.categorias ul li a svg {display:inline-block; margin:0 10px -4px 0;}
	
	.grupo .videolink {width:50%;}
	
	.video {padding-right:0;}
	.video .embed {display:none;}
	
	.relacionados {padding-right:0;}
	.relacionados .videolink {width:50%;}
}

@media (max-width:480px) {
	
	header .logo {float:left; width:110px; padding-top:5px;}
	
	header .buscador {width:0; right:-7%; padding:0 3%; background:#f3f3f3; z-index:99; opacity:0; transition:0.3s ease all;}
	header .buscador.shown {opacity:1; width:100%; right:0;}
	header .buscador.shown .flecha {display:block;}
	
	header .buscador #buscar {width:70%;}
	header .buscador #boton {width:20%}
	header .buscador .flecha {width:10%; color:#ccc; opacity:0.6; cursor:pointer;}
	header .buscador .flecha svg {width:30px; margin:0 auto; opacity:0.6; padding:4px;}
	
	header .desplegar_busqueda {width:19%; height:30px; display:block; position:absolute; right:8%; top:20px; border:1px solid #ccc; padding:4px; cursor:pointer;}
	header .desplegar_busqueda svg .lupa {color:#ccc; opacity:0.6; }
	header .desplegar_busqueda.hidden {display:none;}
	
	.grupo {margin:0 auto; max-width:330px;}
	.grupo .videolink {width:100%;}
	.grupo .videolink:last-child {display:block;}
	.grupo .categ_title {font-size:18px; line-height:21px;}
	.grupo .ver_todos {font-size:14px; line-height:21px; top:3px;}
	
	.relacionados {margin:0 auto; max-width:330px;}
	.relacionados .videolink {width:100%;}
	.relacionados .videolink:last-child {display:block;}
	
	.busqueda .result .thumblink {width:110px;}
	.busqueda .result .datos .title {font-size:14px;}
	.busqueda .result .datos .serie {font-size:11px;}
	.busqueda .result .datos .categ {font-size:11px;}
	
}