@import url(http://fonts.googleapis.com/css?family=Open+Sans:300italic,400italic,600italic,700italic,400,300,600,700);
/*transmedia
------------------------------------*/
.transmedia-wrapper{width:100%;background:#0D0D0F url('../img/transmedia/bg4.jpg') center top repeat-y;}

/*-----------Vid-Nav-----------*/
/* Clearfix */
.clear{clear:both;}
.clearfix:before,
.clearfix:after {content: " ";display: table;}
.clearfix:after {clear: both;}
.clearfix { *zoom: 1;}
/* Basic Styles */
nav {position: relative;width:100%;margin-bottom:15px;}
nav ul {padding: 0;width: 600px;height: 40px;}
nav li {display: inline;float: left;cursor:hand;}
nav a {color: #999;display: inline-block;padding-left:10px;padding-right:10px;margin:3px;width: auto;text-align: center;text-decoration: none;line-height: 40px;}
nav li a {background: rgba(220,220,220,0.1);border:1px solid #222;border-bottom:3px solid #900;-webkit-box-shadow: 0px 3px 5px 0px rgba(0,0,0, 0.75);-moz-box-shadow:0px 3px 5px 0px rgba(0,0,0, 0.75);box-shadow:0px 3px 5px 0px rgba(0,0,0, 0.75);}
nav a:hover, nav a:active {background-color: #900;color: #EEE;text-decoration:none;cursor:hand;}
/*----------------------------*/
.vid-info {padding: 10px;margin-bottom: 10px;background: #555;border: solid 1px #666;}
.vid-info h4{color:#FFF;}
.vid-info p{color:#ddd;}
.full {background:#000 url(../img/loading.gif) no-repeat center center;-webkit-box-shadow: 0px 3px 5px 0px rgba(0,0,0, 0.75);-moz-box-shadow:0px 3px 5px 0px rgba(0,0,0, 0.75);box-shadow:0px 3px 5px 0px rgba(0,0,0, 0.75);}
.responsive-media {height: 0;padding-top: 1px;position: relative;margin-bottom: -3px;padding-bottom: 56.25%;}
.vid-data{width:100%;background: rgba(220,220,220,0.1);border:1px solid #222;padding:5px 10px;margin-bottom:5px;-webkit-box-shadow: 0px 3px 5px 0px rgba(0,0,0, 0.75);-moz-box-shadow:0px 3px 5px 0px rgba(0,0,0, 0.75);box-shadow:0px 3px 5px 0px rgba(0,0,0, 0.75);}
.vid-data h4{color: #999;font-size: 18px;font-family: 'Crimson Text', serif;line-height: 18px;margin: 1px 0 3px;text-decoration: none;}
.vid-data p {font-size:12px;margin:0px;padding:1px;color:#777;}
.vid-data strong {color:#888;}
.col-vid{background: rgba(220,220,220,0.1);}
.vid {float:left;width:100%;height:100%;list-style:none;display:block;padding:0;margin:0;margin-top:10px;margin-bottom:10px;}
.vid h3{color:#CCC;}
.scroll-vid {overflow: auto;	position: relative;max-width: 97%;height:31.200em;}
.vid li{background: #222;border:1px solid #444;display:inline-block;max-width: 100%;max-height: 100%;margin: 0px;padding: 0px;text-decoration:none;float:left;width:100%;}
.vid li .vid-img {float:left;width: 32%;display: block;max-height: 100%;}
.vid .descripcion :hover{text-decoration: underline;cursor:pointer;}
.vid .descripcion {float:left;padding:5px 10px;display:block;width:68%;height: 100%;border-left:1px solid #444;}
.vid .descripcion h3{color: #FB9528;font-size: 1.150em;font-family: 'Crimson Text', serif;line-height:1.150em;padding:0;margin:0;text-decoration: none;}
.vid .descripcion span{color:#999;font-size:0.850em; }
.vid .descripcion p {font-size:0.800em;color:#FB6330;}
.vid li:hover {border:1px solid #999;filter: grayscale(1); -webkit-filter: grayscale(1); -moz-filter: grayscale(1);-ms-filter: grayscale(1);-o-filter: grayscale(1);}
.espacio1 {margin-top:1em;margin-bottom: 1em;border: 0;border-top: 1px solid #222;}
.espacio2 {margin-top:1em;margin-bottom: 2em;border: 0;border-top: 1px solid #222;}
/************BOX ÁREAS********************/
.box_wrap{width:100%;margin: 0 auto;position:relative;}
.box_container{position:obsolute;width:1140px;margin: 0 auto;border:1px solid #fff;}
.box_container_top {width:100%;height:38px;border-left:4px solid #900;background: rgba(220,220,220,0.1);margin-bottom:5px;}
.box_container_top h2 {font-size:24px;margin-left:10px;line-height: 36px;color:#DDD;}
.box_container_top h3 {font-size:20px;margin-left:10px;line-height: 36px;color:#DDD;}
.box_area {background-color:#eee;width: 23.800em;height: 26.250em;padding:3px;float:left;margin: 5px 3px;position: relative;-webkit-box-shadow: 0px 3px 5px 0px rgba(0,0,0, 0.75);-moz-box-shadow:0px 3px 5px 0px rgba(0,0,0, 0.75);box-shadow:0px 3px 5px 0px rgba(0,0,0, 0.75);}	
.box_data{padding:10px;text-align:center;}
.box_area h2 {font-size:24px;line-height: 32px;color:#222;}
.area-img {width: 100%;height: auto;}
.ver-mas {height: 37px;line-height:40px;border-top: 1px solid #AEABAB;font-size:12px;text-transform:uppercase;color:#666666;}	
a.link-area {width: 23.800em;height: 26.250em;display: block;background: url('../img/mas.png') center no-repeat #444;position: absolute;top: 0;left: 0;opacity: 0;-webkit-transition: all 0.3s fff;transition: all 0.3s fff;}
a.link-area:hover {opacity: 0.7;transition: all 0.3s fff;}
/********** Media Query's **************/
@media screen and (max-width:1024px){
	.scroll-vid {margin-top:2em;max-width: 100%;height:25.200em;padding:5px;background: rgba(220,220,220,0.1);}
}
@media screen and (max-width:991px){
    .box_container{width: 640px;}
    .ver-mas {text-align: center;font-size: 10px;} 
}
@media (max-width: 767px){
	.row {margin:auto;}
	.vid{margin:auto 0;}
	.scroll-vid {margin-top:1em;max-width: 100%;height:20.200em;padding:3px;background: rgba(220,220,220,0.1);}
}
@media screen and (max-width:639px){
    .box_container{width: 320px;}
    .ver-mas {text-align: center;font-size: 18px;}
	.scroll-vid {max-width: 100%;height:17.200em;}
	nav {height: auto;}
  	nav ul {width: 100%;display: block;height: auto;}
  	nav li {width: 50%;float: left;position: relative;	}
  	nav a {text-align: center;width: 100%;text-indent: 25px;}
}
@media (max-width: 480px){
	nav li {display: block;float: none;width: 100%;text-align: center;}
	.scroll-vid {max-width: 100%;height:13.200em;}
}