*{margin: 0; padding: 0}
@import url(http://fonts.googleapis.com/css?family=Source+Sans+Pro:200,300,400,600,700,900,200italic,300italic,400italic,600italic,700italic,900italic);
body{background-color:#242424;font-family: "Source Sans Pro", sans-serif;margin: 50px 17px 17px 17px;}
.contenedor{background-color:#242424; font-family: "Source Sans Pro", sans-serif; width: 926px; margin:auto; padding: 0;}

hr{width: 770px; float: right; border: 0; border-top: 1px solid #4e4e4e; border-bottom: 1px solid #333; height:0; margin: 2px 0 5px 0;}
.margenlogo {width: 146px; height: auto; align-items: center; position: relative; float: left; margin: 3px 0 0 0;}
.margenheader {width: 770px; height: 120px; position: relative; float: right;}


nav {width: 770px; height: 70px; position: relative; float: right; }
/*estilos botonera*/
.encaja{width: 770px; margin: 0 auto; padding: 0; height:80px;}
a {color:#fff; font-weight: 400; text-decoration:none; margin: 0 5px 0 5px 0; font-family: 'Source Sans Pro', sans-serif; font-size:12px; line-height:40px; }
.abre {float:left; text-align:center; width:115px; height: 5px; transition:0.5s; }
.abre:hover {  height: 40px;   }
#inicio:hover { background: #C7A489; }
#institucional:hover { background: #E98546;}
#noticias:hover { background: #7BC1A3; }
#programacion:hover { background: #0AA3B6; }
#envivo:hover { background: #BDBDB9;}
#buscar:hover { background: #D7797D; }

#inicio { background: #C7A489; margin-right:16px;}
#institucional { background: #E98546; margin-right:16px;}
#noticias { background: #7BC1A3; margin-right:16px;}
#programacion { background: #0AA3B6; margin-right:16px;}
#envivo { background: #BDBDB9; margin-right:16px;}
#buscar { background: #D7797D; }
.over {height: 40px; }
#formbuscar .campo {color:#fff; border:1px solid #999 !important; background-color:#b16569; height:12px; width:75px; font-size: 10px; margin-top:-2px; }
#formbuscar .botonbuscar { background:url(../imagenes/search.png) no-repeat 5px 10px; cursor:pointer; border: 0px #ccc solid; width:31px; height:20px; }
/*estilos botonera*/

/* comienzo formulario tda*/
#izq{ width: 146px; float: right; height: auto; margin 0 auto; float: left; margin: 27px 0 0 0;}
.article1tda{ width: 122x; float: left; display: block; float: left;}
#contenedorformulario{ background: #333; width: 122px; height: 380px; float: left; padding: 0 12px 0 12px;}
#tit1a{ width: 122px; display: block; float: left; color: #ccc; font-style: italic; font-size: 11px; font-weight: 600; margin: -5px 0 0 0;}
#tit1ab{ width: 122px; display: block; float: left; color: #ccc; font-size: 19px; font-weight: 900; margin: -2px 0 -5px 0;}
.lineatda0a{ border-bottom: rgba(204, 204, 204, 0.62) solid 2px; width: 146px; float: left; margin: 0 0 10px -12px;}
.lineatda0b{ border-bottom: rgba(204, 204, 204, 0.62) solid 2px; width: 146px; float: left; margin: 10px 0 10px -12px;}
#text2{ font-size: 11px; font-weight: 400; font-style: italic; color: rgba(255, 255, 255, 0.46); width: 122px; float: left; border-top: rgba(204, 204, 204, 0.15) solid 1px; height: 18px; margin: 5px 5px 5px 0; text-align: center; padding: 5px 0 0 0;}
#text3{ width: 136px; font-size: 12px; font-weight: 600; font-style: italic; color: #ccc; float: left; margin: 0 0 5px -7px; padding: 0 0 0 10px;}
#campo{ height: 12px; width: 122px; color:#ccc; border: ridge #555 1px; background: #414042; font-size: 11px; font-weight: 100; float: left; margin: -3px 12px 12px 0;}
#boton{ width: 122px; height: 15px; float: left; margin: 5px 12px 5px 0; background: #bcbcbc; font-size: 10px; color: #444;}
#boton:hover{ width: 122px; height: 15px; float: left; margin: 5px 12px 5px 0; background: #444; font-size: 10px; color: #bcbcbc;}

/* fin formulario tda*/




/* comienzo explicación tda*/

.tda{ width: 770px; float: right; height: auto; margin: -3px 0 0 0;}
.article1tda{ width: 770px; float: left; display: block;}
.tdatitulo{ background: rgb(123, 193, 163); width: 760px; height: 20px; font-size: 26px; font-weight: 200; color: #fff; float: left; margin: 0 0 3px 0; padding: 0 0 15px 10px;}
.lineatda{ border-bottom:#7BC1A3 solid 1px; width: 770px; float: right; margin: 3px 0 5px 0;}
#tdafaja{ background: #666; width: 770px; height: 24px; float: left;}


.subt1{ font-size: 14px; font-weight: 300; color: #fff; float: left; position: relative; margin: 10px 0 5px 0;cursor: pointer;}
.back1{ background: url(../imagenes/px_bg_noticias.png); height: 10px; width: 10px; float: left; position: relative; margin: 4px 6px 0 5px;cursor: pointer;}
.text1{ height: 0px; overflow: hidden; font-size: 12px; color: #777; width: 750px; float: left; padding:0 0 0 20px;}

.subt1:hover{ font-size: 14px; font-weight: 500; color: #fff; float: left; position: relative; margin: 10px 0 5px 0;cursor: pointer;}
.back1:hover{ background: #7BC1A3; height: 10px; width: 10px; float: left; position: relative; margin: 4px 6px 0 5px;cursor: pointer;}
.text1:hover{ height: auto; overflow: hidden;font-size: 12px; color: #777; width: 750px; float: left; padding: 5px 2px 15px 20px;}

.subt2hover{ font-size: 14px; font-weight: 500; color: #fff; float: left; position: relative; margin: 10px 0 5px 0;cursor: pointer;}
.back1hover{ background: #7BC1A3; height: 10px; width: 10px; float: left; position: relative; margin: 4px 6px 0 5px;cursor: pointer;}
.text1hover{ height: auto; overflow: hidden;font-size: 12px; color: #777; width: 750px; float: left; padding: 5px 2px 15px 20px;}


.subt2{ font-size: 14px; font-weight: 300; color: #fff; float: left; position: relative; margin: 10px 0 5px 0;cursor: pointer;}
.back2{ background: url(../imagenes/px_bg_noticias.png); height: 10px; width: 10px; float: left; position: relative; margin: 4px 6px 0 5px;cursor: pointer;}
.text2{ height: 0px; overflow: hidden; font-size: 12px; color: #777; width: 750px; float: left; padding:0 0 0 20px;}

.subt2:hover{ font-size: 14px; font-weight: 500; color: #fff; float: left; position: relative; margin: 10px 0 5px 0;cursor: pointer;}
.back2:hover{ background: #7BC1A3; height: 10px; width: 10px; float: left; position: relative; margin: 4px 6px 0 5px;cursor: pointer;}
.text2:hover{ height: auto; overflow: hidden;font-size: 12px; color: #777; width: 750px; float: left; padding: 5px 2px 15px 20px;}

.subt2hover{ font-size: 14px; font-weight: 500; color: #fff; float: left; position: relative; margin: 10px 0 5px 0;cursor: pointer;}
.back2hover{ background: #7BC1A3; height: 10px; width: 10px; float: left; position: relative; margin: 4px 6px 0 5px;cursor: pointer;}
.text2hover{ height: auto; overflow: hidden;font-size: 12px; color: #777; width: 750px; float: left; padding: 5px 2px 15px 20px;}


.subt3{ font-size: 14px; font-weight: 300; color: #fff; float: left; position: relative; margin: 10px 0 5px 0;cursor: pointer;}
.back3{ background: url(../imagenes/px_bg_noticias.png); height: 10px; width: 10px; float: left; position: relative; margin: 4px 6px 0 5px;cursor: pointer;}
.text3{ height: 0px; overflow: hidden; font-size: 12px; color: #777; width: 750px; float: left; padding:0 0 0 20px;}
.ssubcat3{ font-size: 13px; font-weight: 800; font-style: italic;  color: #999; width: 750px; float: left;}

.subt3:hover{ font-size: 14px; font-weight: 500; color: #fff; float: left; position: relative; margin: 10px 0 5px 0;cursor: pointer;}
.back3:hover{ background: #7BC1A3; height: 10px; width: 10px; float: left; position: relative; margin: 4px 6px 0 5px;cursor: pointer;}
.text3:hover{ height: auto; overflow: hidden; font-size: 12px; color: #777; width: 750px; float: left; padding: 5px 2px 15px 20px;}
.subcat3:hover{ font-size: 13px; font-weight: 800; font-style: italic;  color: #999; width: 750px; float: left;}

.subt3hover{ font-size: 14px; font-weight: 500; color: #fff; float: left; position: relative; margin: 10px 0 5px 0;cursor: pointer;}
.back3hover{ background: #7BC1A3; height: 10px; width: 10px; float: left; position: relative; margin: 4px 6px 0 5px;cursor: pointer;}
.text3hover{ height: auto; overflow: hidden; font-size: 12px; color: #777; width: 750px; float: left; padding: 5px 2px 15px 20px;}
.subcat3hover{ font-size: 13px; font-weight: 800; font-style: italic;  color: #999; width: 750px; float: left;}


.subt4{ font-size: 14px; font-weight: 300; color: #fff; float: left; position: relative; margin: 10px 0 5px 0;cursor: pointer;}
.back4{ background: url(../imagenes/px_bg_noticias.png); height: 10px; width: 10px; float: left; position: relative; margin: 4px 6px 0 5px;cursor: pointer;}
.text4{ height: auto; overflow: hidden; height: 0px; overflow: hidden; font-size: 12px; color: #777; width: 750px; float: left; padding:0 0 0 20px;}
.ssubcat4{ font-size: 13px; font-weight: 800; font-style: italic;  color: #999; width: 750px; float: left;}

.subt4:hover{ font-size: 14px; font-weight: 500; color: #fff; float: left; position: relative; margin: 10px 0 5px 0;cursor: pointer;}
.back4:hover{ background: #7BC1A3; height: 10px; width: 10px; float: left; position: relative; margin: 4px 6px 0 5px;cursor: pointer;}
.text4:hover{ height: auto; overflow: hidden; font-size: 12px; color: #777; width: 750px; float: left; padding: 5px 2px 15px 20px;}
.subcat4:hover{ font-size: 13px; font-weight: 800; font-style: italic;  color: #999; width: 750px; float: left;}

.subt4hover{ font-size: 14px; font-weight: 500; color: #fff; float: left; position: relative; margin: 10px 0 5px 0;cursor: pointer;}
.back4hover{ background: #7BC1A3; height: 10px; width: 10px; float: left; position: relative; margin: 4px 6px 0 5px;cursor: pointer;}
.text4hover{ height: auto; overflow: hidden; font-size: 12px; color: #777; width: 750px; float: left; padding: 5px 2px 15px 20px;}
.subcat4hover{ font-size: 13px; font-weight: 800; font-style: italic;  color: #999; width: 750px; float: left;}
.lineatda2{ border-bottom:#414042 solid 1px; width: 765px; float: right; margin: 2px 0 5px 0;}
.fajatda{ background: #414042; width: 770px; height: 25px; float:left;}

/* fin explicación tda*/


/* comienzo videotutorial*/
.titguia{  background:#444; width: 750px; height: 11px; font-style: italic; font-size: 14px; font-weight: 400; color: rgba(255, 255, 255, 0.62); float: left; padding: 2px 0 8px 13px; margin: 15px 0 25px 5px; border-bottom:rgba(123, 193, 163, 0.39) solid 1px; border-top:rgba(123, 193, 163, 0.39)solid 1px;}


.tuto1{ width: 750px; height:0; float: left; margin: 15px 0 15px 20px;}
.tuto1:hover{ width: 750px; height: 500px; float: left; margin: 15px 0 15px 20px;}
.tuto1hover{ width: 750px; height: 500px; float: left; margin: 15px 0 15px 20px;}
.vt1{ font-size: 14px; font-weight: 400; color: #7BC1A3; float: left; margin: -5px 0 0 20px;cursor: pointer;}
.v1{ width:0; height:0;}
.vt1:hover{ font-size: 14px; font-weight: 400; color: #dedede; float: left; margin: -5px 0 0 20px;cursor: pointer;}
.v1:hover{ width:725px; height:433px; margin: 15px 12px 30px -5px; float: left; border: #7BC1A3 solid 15px; overflow: hidden;}
.vt1hover{ font-size: 14px; font-weight: 400; color: #dedede; float: left; margin: -5px 0 0 20px;cursor: pointer;}
.v1hover{ width:725px; height:433px; margin: 15px 12px 30px -5px; float: left; border: #7BC1A3 solid 15px; overflow: hidden;}

.tuto2{ width: 750px; height:0; float: left; margin: 15px 0 15px 20px;}
.tuto2:hover{ width: 750px; height: 500px; float: left; margin: 15px 0 15px 20px;}
.tuto2hover{ width: 750px; height: 500px; float: left; margin: 15px 0 15px 20px;}
.vt2{ font-size: 14px; font-weight: 400; color: #7BC1A3; float: left; margin: -5px 0 0 20px;cursor: pointer;}
.v2{ width:0; height:0;}
.vt2:hover{ font-size: 14px; font-weight: 400; color: #dedede; float: left; margin: -5px 0 0 20px;cursor: pointer;}
.v2:hover{ width:725px; height:433px; margin: 15px 12px 30px -5px; float: left; border: #7BC1A3 solid 15px; overflow: hidden;}
.vt2hover{ font-size: 14px; font-weight: 400; color: #dedede; float: left; margin: -5px 0 0 20px;cursor: pointer;}
.v2hover{ width:725px; height:433px; margin: 15px 12px 30px -5px; float: left; border: #7BC1A3 solid 15px; overflow: hidden;}

.tuto3{ width: 750px; height:0; float: left; margin: 15px 0 15px 20px;}
.tuto3:hover{ width: 750px; height: 500px; float: left; margin: 15px 0 15px 20px;}
.tuto3hover{ width: 750px; height: 500px; float: left; margin: 15px 0 15px 20px;}
.vt3{ font-size: 14px; font-weight: 400; color: #7BC1A3; float: left; margin: -5px 0 0 20px;cursor: pointer;}
.v3{ width:0; height:0;}
.vt3:hover{ font-size: 14px; font-weight: 400; color: #dedede; float: left; margin: -5px 0 0 20px;cursor: pointer;}
.v3:hover{ width:725px; height:433px; margin: 15px 12px 30px -5px; float: left; border: #7BC1A3 solid 15px; overflow: hidden;}
.vt3hover{ font-size: 14px; font-weight: 400; color: #dedede; float: left; margin: -5px 0 0 20px;cursor: pointer;}
.v3hover{ width:725px; height:433px; margin: 15px 12px 30px -5px; float: left; border: #7BC1A3 solid 15px; overflow: hidden;}



.lineatda3{ border-bottom:rgba(123, 193, 163, 0.56) solid 1px; width: 755px; float: left; margin: 0 0 -5px 15px;}

/* fin videotutorial*/




#separador{ clear: both;}

.lineafinal{ border-bottom:#414042 solid 1px; width: 926px; float: right; margin: 12px 0 12px 0;}
#auspiciantes{ background: url(../imagenes/auspiciantes.png);  width: 926px; height: 30px; display: block; float: left; margin: -8px 0 -8px 0; align-items: center;}
/* footer*/
#legales{ width: 896px; height: 65px; font-size: 11px; font-weight: 400; color:#999; text-align: center; padding: 0 15px 15px 5px; margin: 0x 0 15px 0;}




