/*
Theme Name: GAS TV
Theme URI: http://gastv.mx
Description:
Author: Robert
Author URI: http://Origenlab.com
Version: 2.0
*/

@import url(http://fonts.googleapis.com/css?family=Lato:100,300,400,700);

/* Apply a natural box layout model to all elements: http://paulirish.com/2012/box-sizing-border-box-ftw/ */
* { -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; }

.chromeframe {position: absolute; top: 0;}

/* Ok, this is where the fun starts.
-------------------------------------------------------------------------------*/

/* A Linux- and Windows-friendly sans-serif font stack: http://prospects.mhurrell.co.uk/post/updating-the-helvetica-font-stack */
body {background:#111; font-family: 'Lato', sans-serif; font-weight:100;}

body, select, input, textarea {color: #fff;}

a {color: #666; text-decoration:none}
a:hover {color: #444;}

/* Custom text-selection colors (remove any text shadows: http://twitter.com/miketaylr/status/12228805301) */
::-moz-selection{background: #fcd700; color: #fff; text-shadow: none;}
::selection {background: #fcd700; color: #fff; text-shadow: none;}

/*	j.mp/webkit-tap-highlight-color */
a:link {-webkit-tap-highlight-color: #fcd700;}

ins {background-color: #fcd700; color: #000; text-decoration: none;}
mark {background-color: #fcd700; color: #000; font-style: italic; font-weight: bold;}

/* Mozilla dosen't style place holders by default */
input:-moz-placeholder { color:#a9a9a9; }
textarea:-moz-placeholder { color:#a9a9a9; }
input:focus { outline:none}

.limite { width: 90%; max-width:960px; margin-right:auto; margin-left:auto;}

/* ==========================================================================
   HEADER Css
   ========================================================================== */

   #logo { display:block; margin:20px 0; background:url(img/gastv-jumex.png?a=5) no-repeat center; height:175px; text-indent:-999px}

   #search { width:150px; margin-left:auto}
	   #search ul li { float:left; font-size:10px; padding-right:5px; font-weight:300}
	   #search ul li + li { border-left:1px solid #FFF; padding-left:5px}
	   #search ul li a { color:#FFF;}

	   #search form div { background: #fff none repeat scroll 0 0;
    color: #000;
    margin-left: -3px;
    width: 183px;}
	   #searchsubmit { border:0; width:20px; text-indent:-999px; border:0; background:none; background:url(img/lupa.png) no-repeat center;}
	   input[type="search"] { background:none; border:0; color:#333; width:120px; -webkit-box-shadow: 0 0 0 0 #FFF;
box-shadow: 0 0 0 0 #FFF;  }

   .redes a { display:block; float:left; width:16px; height:16px; margin-right:2px; margin-bottom:5px }
   .insta { background:url(img/gas-pt.png) no-repeat; }
   .tw { background:url(img/gas-tw.png) no-repeat; }
   .vimeo { background:url(img/gas-vimeo.png) no-repeat; }
	.yutube { background:url(img/gas-youtube.jpg) no-repeat; }
   .facebo { background:url(img/gas-facebo.png) no-repeat; }
   .redes
   {
    width: 194px;
   }

   #slider { margin-bottom:20px; height:450px; background: url(img/loader.gif) no-repeat center; background-size:300px}
   /* #slider * { -moz-box-sizing: content-box; -webkit-box-sizing: content-box; box-sizing: content-box; } */

#slider .category-videos { background:url(img/video-cat.jpg) center no-repeat;}

/* ==========================================================================
   NAVEGADOR Css
   ========================================================================== */

   #navegador { position:relative; margin:10px 0 20px;}
	   #navegador ul { display:table; width:100% }
	   #navegador ul li { height:37px; font-size:14px; color:#FFF; display:table-cell; vertical-align:middle; text-align:center; max-width:90px; font-weight:400; width: 18% }
	   #navegador ul li + li { border-left:1px solid #FFF;  width: 13% }
	   #navegador li a { display:block; color:#FFF; text-transform:uppercase; font-size: 80%; }
	   #navegador li:hover a { color:#333 }
	  #navegador li:hover { background:#E5BDA1; }



/* ==========================================================================
   CONTENEDOR Css
   ========================================================================== */

#widget-res-calendario { display:none; text-align:center; }

   #contenedor { position:relative; margin-bottom:20px; min-height:1020px}
   .page #contenedor { min-height:inherit;}
   #contenedor p { font-size:.9em; font-weight:300; margin-bottom:15px}
   #contenido { padding-right:320px; position:relative}
   #contenido p iframe { width:100% !important;}
   #sidebar { width:300px; position:absolute; right:0; top:0 }
   #sidebar img { vertical-align:top; }

   .indexloop>a { display:block;  width:33.3%; float:left; position:relative; color:#FFF; background:#E5BDA1; }
   .indexloop figure { height:200px; background-size:cover; background-repeat:no-repeat; background-position:center;
-webkit-transition: all .5s ease;
-moz-transition: all .5s ease;
-ms-transition: all .5s ease;
-o-transition: all .5s ease;
transition: all .5s ease; }
   .indexloop>a:hover figure { opacity:.4}
   .indexloop .titulos { background:rgba(0,0,0,.6); position:absolute; bottom:0; min-height:60px; padding:5px;  font-size:.75em; width:100%; }
   .indexloop h3 { text-transform:uppercase; font-size:1.2em; font-weight:400 }
   .indexloop h2 { font-size:1em;  font-weight:100 }

   .catloop>a { display:block;  width:50%; float:left; position:relative; color:#FFF; background:#E5BDA1; }
   .catloop figure { height:160px; background-size:cover; background-repeat:no-repeat; background-position:center;
-webkit-transition: all .5s ease;
-moz-transition: all .5s ease;
-ms-transition: all .5s ease;
-o-transition: all .5s ease;
transition: all .5s ease; }
   .catloop>a:hover figure { opacity:.4}
   .catloop .titulos { background:rgba(0,0,0,.6); position:absolute; bottom:0; height:55px; padding:5px;  font-size:.75em; width:100%; }
   .catloop h3 { text-transform:uppercase; font-size:1.2em; font-weight:400 }
   .catloop h2, .catloop p { font-size:1em;  font-weight:100 }
.category-videos figure:before {  content:url(img/video-cat-min.jpg); transform: scale(.5); }

   .agendaloop>a { display:block;  width:100%; position:relative; color:#FFF; margin-bottom:10px }
   .agendaloop figure { height:170px; background-size:cover; background-repeat:no-repeat; background-position:center;
-webkit-transition: all .5s ease;
-moz-transition: all .5s ease;
-ms-transition: all .5s ease;
-o-transition: all .5s ease;
transition: all .5s ease; }
   .agendaloop>a:hover figure { opacity:.5}
   .agendaloop .titulos { background:rgba(0,0,0,.6); position:absolute; bottom:0; height:55px; padding:5px;  font-size:.8em; width:100%; }
   .agendaloop h3 { font-size:1.2em; text-transform:uppercase; color:#E5BDA1; display: inline; font-weight:400; }
   .agendaloop h2 { font-size:1.2em; display: inline; font-weight:400; }
   .agendaloop .tituls { font-size:1.2em; font-weight:400; padding:0 6px; }
   .agendaloop .datos { font-size:.95em;  font-weight:100; }

#navegador .video:hover  {background:#E5BDA1;}
.indexloop .category-danza, .catloop .category-danza, #navegador .danza:hover {background:#E24259;}
.indexloop .category-arquitectura, .catloop .category-arquitectura, #navegador .arquitectura:hover {background:#F56C34;}
.indexloop .category-musica, .catloop .category-musica, #navegador .musica:hover {background:#FFE000;}
.indexloop .category-diseno, .catloop .category-diseno, #navegador .diseno:hover {background:#2CDBA5;}
.indexloop .category-cine, .catloop .category-cine, #navegador .cine:hover {background:#6F9ECF;}
.indexloop .category-artes-visuales, .catloop .category-artes-visuales, #navegador .artes-visuales:hover {background:#7D4BD0;}


   .navigation { text-align:center; margin: 15px 0; font-size:.8em }
   .navigation li { display: inline-block; margin:0 5px; }
   .navigation a { display: inline-block; padding:7px 4px; color:#FFF }
   .navigation a:hover, .navigation li.active a { border:1px solid #FFF; padding:6px 3px; }

   .lomas { border:1px solid #FFF; padding:6px; float:left; width:60%}
   .lomas h4 { font-size:1.2em; color: #FFF; font-weight:400; text-transform:uppercase; }
   .lomas hr { border:0; border-bottom:1px solid #555; padding:0; margin:4px 0 8px 0; }
   .lomas ul { list-style:inside decimal-leading-zero; font-size:.8em; font-weight:300; padding:10px}
   .lomas li { margin-bottom:5px }
   .lomas a { color:#333; }
   .lomas span { display:none; padding:10px; line-height:.9em; color:#333; background:#D5D5D5; font-size:.8em; margin-right:5px; font-weight:300; cursor:pointer; }
	#lomasgas, #lomastwitter { background:#A2A2A2;color:#333; overflow:hidden; }
	#lomastwitter { height:0px; }
.extendido { height:125px !important;}
.escondido { height:0 !important; }
   .backspan {background:#A2A2A2 !important; }

   #newsletter { border:1px solid #FFF; padding:6px; float:left; width:38%; margin-left:2% }
   #newsletter .mc4wp-form { margin:0;}
   #newsletter h4 { font-size:1.2em; color: #FFF; font-weight:400; text-transform:uppercase; }
   #newsletter hr { border:0; border-bottom:1px solid #555; padding:0; margin:4px 0 8px 0; }
   .marc { background: #A2A2A2;  padding:10px; color:#333 }
   #contenedor .marc p { font-size:.75em; font-weight:300; margin-bottom:0px}
   .marc .campos { text-align:right; margin:10px 0 4px; }
   .marc a { color: #E1E1E1 ;}

.mc4wp-form input[type="email"] { font-size:.7em; height:20px; padding:0 5px; text-align:left; color:#333; width:100%; margin-bottom: 11px; }
.mc4wp-form input[type="submit"] { color:#333; background:#D5D5D5; padding:2px 5px; border:0; margin-bottom:15px; font-size:.6em}


   .widget_em_calendar { background:#FFF; padding:10px 10px 20px; text-align:center; }
   .widget-title { text-align:center; font-size:.9em; text-transform:uppercase; padding:0 20px; border:2px solid #000; color:#000; line-height:26px; font-weight:700; color:#333; display:inline; }
   .em-calendar{ margin:0 auto; }
.em-calnav-prev, .em-calnav-next {visibility:hidden}
.em-calnav-prev:after {visibility:visible; content:"<"}
.em-calnav-next:after {visibility:visible; content:">"}
   .em-calendar thead { color: #333; font-size:.85em !important;}
   .em-calendar thead a { color: inherit;}
   .em-calendar tbody td { color:#333; font-size:.75em; padding:4px 10px; width:14.4% }
   .em-calendar .days-names { color:#333; font-size:1.2em; font-weight:300; }
   .eventful-today { background:url(img/punto.png) no-repeat center!important; -webkit-border-radius: 100%; border-radius: 100%; color:#333 !important; }
   .eventless-today { background:url(img/punto.png) no-repeat center !important; -webkit-border-radius: 100%; border-radius: 100%; color:#333 !important; }
   .em-calendar .eventful a, .eventful-today a { color:#FFB500 !important; }

.em-search-wrapper { display:none; }

   .post-cat { font-size:1.2em; border-top:1px solid #FFF; color:#999999; font-weight:400; margin-bottom: 10px; text-transform:uppercase; padding-top:10px }
   .entrada { background:#FFF; padding:30px 5%; color:#333}
   .entrada p { line-height: 1.5em}
   .entrada h1 { font-size:2.4em; font-weight:700; text-transform:uppercase; padding-bottom:10px; border-bottom:1px solid #999; margin-bottom:10px }
   .entrada img { max-width:100%}
   .autor { color:#999; font-size:1em; margin: 10px 0; font-weight:300	}
   .autor strong { color:#333}

   hr { margin:20px 0; padding:0; height:1px; border-bottom:1px solid #999}

   .nex-prev { margin-bottom:20px; }
   .recientes { margin-bottom:20px; }
   .nex-prev img, .recientes img { width:100%;}

   #sidebar2 { width:33%; float:left; background:#FFF; padding:20px; color:#333; font-size:.9em; margin-right:2%;}
   #sidebar2 h2 { font-size:1.2em; margin-bottom:20px}
   #destacada { width:65%; float:left}
   #evento img { width:100%;}
.single-event #contenedor { min-height: inherit;}
.single-event .nex-prev { margin-bottom:0px; margin-top:20px; }
.single-event .nex-prev a { color:#FFF }

.image-campaign { margin:0 auto; width: 300px !important; }
.image-campaign li { margin:0 !important; text-align:center; float:none !important; }

.embed-youtube iframe, .entry-pagina p iframe { width:100% !important; margin:0 auto}

.prvpost { float:left; }
.nexpost { float:right; }
.prvpost, .nexpost { font-size:1.8em; vertical-align:middle}
.prvpost a, .nexpost a {color:#555; font-size:.4em; font-weight:300;  vertical-align:middle}

.em-pagination { display:block; margin:10px 0; text-align:center;}
.em-pagination a, .em-pagination strong { display: inline-block; padding:7px 4px; color:#FFF; margin:0 5px; font-weight:100;   }
 .em-pagination strong { border:1px solid #FFF; padding:6px 3px; }
.em-pagination a:hover, .navigation li.active a { border:1px solid #FFF; padding:6px 3px; }


.widget_adpress_widget h3 { display:none;}

.entrada .yarpp-related h3 { font-weight: 300 !important; font-size: 1em !important; color: #9E9E9E; text-transform: inherit !important; }
.yarpp-thumbnails-horizontal .yarpp-thumbnail { border: 1px solid #9E9E9E; }
.yarpp-thumbnail > img, .yarpp-thumbnail-default { margin:0 0 5px; width:100%;}
.entrada .yarpp-related .yarpp-thumbnail-title { font-weight: 300 !important; font-size: .8em !important; display:block; width:auto; margin: 0 5px 5px }
.yarpp-thumbnails-horizontal { text-align:center; }

div.sharedaddy h3.sd-title { display:block}


.sd-social-icon .sd-content ul li a.sd-button, .sd-social-text .sd-content ul li a.sd-button, .sd-content ul li a.sd-button, .sd-content ul li .option a.share-ustom, .sd-content ul li.preview-item div.option.option-smart-off a, .sd-content ul li.advanced a.share-more, .sd-social-icon-text .sd-content ul li a.sd-button, .sd-social-official .sd-content>ul>li>a.sd-button, #sharing_email .sharing_send, .sd-social-official .sd-content>ul>li .digg_button >a { background: #f6f6f6; border: 0px; }

.sd-social-icon .sd-content ul li a.sd-button:hover, .sd-social-icon .sd-content ul li a.sd-button:active, .sd-social-text .sd-content ul li a.sd-button:hover, .sd-social-text .sd-content ul li a.sd-button:active, .sd-social-icon-text .sd-content ul li a.sd-button:hover, .sd-social-icon-text .sd-content ul li a.sd-button:active, .sd-social-official .sd-content>ul>li>a.sd-button:hover, .sd-social-official .sd-content>ul>li>a.sd-button:active, .sd-social-official .sd-content>ul>li .digg_button>a:hover, .sd-social-official .sd-content>ul>li .digg_button>a:active { border:0; background: #e5e5e5; }

.flex-title .danza, .agendaloop h3.danza {color:#E24259;}
.flex-title .arquitectura, .agendaloop h3.arquitectura {color:#F56C34;}
.flex-title .musica, .agendaloop h3.musica {color:#FFE000;}
.flex-title .diseno, .agendaloop h3.diseno {color:#2CDBA5;}
.flex-title .cine, .agendaloop h3.cine {color:#6F9ECF;}
.flex-title .artes-visuales, .agendaloop h3.artes_visuales {color:#7D4BD0;}

.form1 { width:50%; float:left; border-right: 1px solid #FFF; padding-right:10%; padding-top:30px;  padding-bottom:30px; }
.form1 input[type="email"], .form1 textarea { color:#333; width:100% !important; max-width: 100% !important; font-size:.8em; padding:5px; border:0; }
.form1 input[type="submit"] { display:block; background:#f6f6f6; border:0; color:#333; background:#D5D5D5;}
.reds2 { width:49%; float:right; padding-top: 130px; padding-bottom:30px}
.reds2 a { display:block; height:16px; margin-left:20px; padding-left:20px; line-height:16px; color:#FFF; font-weight:400; }

.entrada .slideshow-window { background-color: transparent; border:0 }


body #contenedor #contenido div div.slideshow-controls a, body div div.slideshow-controls a:hover {
border: 0px !important;
line-height: 32px !important;
text-align: center !important;
-khtml-border-radius: 0 !important;
-webkit-border-radius: 0 !important;
-moz-border-radius: 0 !important;
border-radius: 0 !important;
}


/* ==========================================================================
   FOOTER Css
   ========================================================================== */

   #footer { border-top:1px solid #999999; padding-bottom:42px; color:#999999; font-size:.6em; font-weight:300;}
   #footer a {color:#999}
   .avisopriv { float:left; }
   .origen { float:right; }
   .origen a { color:#999999; }





ol.commentlist {list-style: none;}
ol.commentlist li.comment {border-bottom: 1px dotted #666; padding: 10px;}
ol.commentlist li.comment div.vcard cite.fn {font-style: normal;}
ol.commentlist li.comment div.vcard img.avatar {float:right; margin: 0 0 10px 10px;}
ol.commentlist li.comment div.comment-meta {font-size: 10px;}
ol.commentlist li.comment div.comment-meta a {color: #ccc;}
ol.commentlist li.comment div.reply {font-size: 11px;}
ol.commentlist li.comment div.reply a {font-weight: bold;}
ol.commentlist li.comment ul.children {list-style: none; margin: 10px 0 0;}
ol.commentlist li.comment ul.children li.depth-2 {border-left: 5px solid #555; margin: 0 0 10px 10px;}
ol.commentlist li.comment ul.children li.depth-3 {border-left: 5px solid #999; margin: 0 0 10px 10px;}
ol.commentlist li.comment ul.children li.depth-4 {border-left: 5px solid #bbb; margin: 0 0 10px 10px;}
ol.commentlist li.even {background: #fff;}
ol.commentlist li.odd {background: #f6f6f6;}
ol.commentlist li.parent {border-left: 5px solid #111;}

/* ==========================================================================
   RESPONSIVE CSS
   ========================================================================== */

@media screen and (max-device-width: 380px) {
   #contenido { padding-right:0px;}
   #sidebar { width:auto; position:static;}
.indexloop>a { width:100%; }
.catloop>a { width:100%; }
#newsletter, .lomas {width:100%;}
#newsletter{ margin-top:15px; margin-left:0;}

#widget-res-calendario { display:block; background:#FFF; margin-bottom:20px; padding-bottom:10px; }
}
@media only screen and (min-width: 550px) and (max-width: 850px) {
.indexloop>a { width:50%; }
.catloop>a { width:100%; }
#newsletter, .lomas {width:100%;}
#newsletter{ margin-top:15px; margin-left:0;}
}

@media only screen and (max-width: 650px) {
.limite { width:98%; }
}

@media only screen and (min-width: 380px) and (max-width: 550px) {
   #contenido { padding-right:0px;}
   #sidebar { width:auto; position:static;}
.indexloop>a { width:50%; }
#newsletter, .lomas {width:100%;}
#newsletter{ margin-top:15px; margin-left:0;}

#widget-res-calendario { display:block; background:#FFF; margin-bottom:20px; padding-bottom:10px; }
}
@media screen and (max-width: 650px) {
  .nav-collapse li {
  width: 100%;}
  #navegador { margin:20px 0 0}
  #navegador li { display:block !important; max-width:100% !important;  border-top:1px solid #FFF; width:100% !important;}
  #navegador li+li { border-left:0 !important;}
  #navegador li a { line-height:37px}

 .interna #contenido { width:100%; padding-right:0;}
 .interna #sidebar { width:auto; position:static;}

#sidebar2 { width:100%; float: none; margin-bottom:20px; }
#destacada { width:100%; float: none; }

.form1 { width:100%; float: none; border-right: 0; padding-right:0; padding-top:0;  padding-bottom:0px; }
.reds2 { width:100%; float: none; padding-top: 0px; padding-bottom:30px}

}

#ouibounce-modal {
	display: none;
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	z-index:2;
}
#ouibounce-modal .underlay {
	width: 100%;
	height: 100%;
	position: absolute;
	top: 0;
	left: 0;
	background-color: rgba(0,0,0,.5);
	cursor: pointer;
	-webkit-animation: fadein .5s;
	animation: fadein .5s
}
#ouibounce-modal .modal {
	z-index: 1;
	position: absolute;
	margin: auto;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	-webkit-animation: popin .3s;
	animation: popin .3s;
	height: 372px; max-width:480px; min-width:380px; width:100%; background:rgba(255,255,255,.5); text-align:center; }
#ouibounce-modal  img { max-width:50%;}
   .padding { padding:30px;}
   .sucribete {background: black; color: white; text-align: center; margin-top: 20px; padding: 10px; font-size:12px;}
   .sucribete span { font-size: 18px;}
   #ouibounce-modal  #mc4wp_email { border: none; width: 96%; margin-top: 20px; height: 24px; padding: 0 2%; font-size: 14px; }
   #ouibounce-modal  .button {  border: none; background: #D5D5D5; margin-top: 15px; width: 60px; float: right; font-size:12px;  }
  .terminos { text-align:left; font-size: 13px;	margin-top:10px; }
  .terminos a { color: white; }

@-webkit-keyframes fadein {
0% {
opacity:0
}
100% {
opacity:1
}
}
@-ms-keyframes fadein {
0% {
opacity:0
}
100% {
opacity:1
}
}
@keyframes fadein {
0% {
opacity:0
}
100% {
opacity:1
}
}
@-webkit-keyframes popin {
0% {
-webkit-transform:scale(0);
transform:scale(0);
opacity:0
}
85% {
-webkit-transform:scale(1.05);
transform:scale(1.05);
opacity:1
}
100% {
-webkit-transform:scale(1);
transform:scale(1);
opacity:1
}
}
@-ms-keyframes popin {
0% {
-ms-transform:scale(0);
transform:scale(0);
opacity:0
}
85% {
-ms-transform:scale(1.05);
transform:scale(1.05);
opacity:1
}
100% {
-ms-transform:scale(1);
transform:scale(1);
opacity:1
}
}
@keyframes popin {
0% {
-webkit-transform:scale(0);
-ms-transform:scale(0);
transform:scale(0);
opacity:0
}
85% {
-webkit-transform:scale(1.05);
-ms-transform:scale(1.05);
transform:scale(1.05);
opacity:1
}
100% {
-webkit-transform:scale(1);
-ms-transform:scale(1);
transform:scale(1);
opacity:1
}
}
