/*
Theme Name: TPS 2016
Theme URI: http://http://tps.rrww.gob.sv/
Author: Luis Eliezer Garcia
Description: Theme desarrollado para TPS 2016 por el Programador Luis Garcia
Version: 1.0
*/
body{
	margin:0;
	padding:0;
	font-family: 'Century Gothic', CenturyGothic, AppleGothic, sans-serif;
	font-size:15px;
	color:#333;
}
.mobil{
	display:none;
}
#headerPrincipal{
	height:160px;
	background:url(images/bg_header.png) bottom left repeat-x;
}
header{
overflow:hidden;
}
#logo{
	float:left;
	margin:13px 0 12px 0;
}
.derecha{
	float:right;
	margin-top:6px;
}
#redes{
	padding:16px 0 0 0;
}
#redes ul{
	margin:0;
	padding:0;
	list-style:none;
}
#redes li{
	display:inline-block;
	width:50px;
	height:50px;
	margin-right:20px;
	border-radius:50px;
	-moz-border-radius:50px;
	-webkit-border-radius:50px;
	position:relative;
	background:#ccc;
}
#redes li.facebook{
	background:#ccc url(images/icon-facebook.png) center center no-repeat;
}
#redes li.twitter{
	background:#ccc url(images/icon-twitter.png) center center no-repeat;
}
#redes li.youtube{
	background:#ccc url(images/icon-youtube.png) center center no-repeat;
}
#redes li:hover{
	background-color:#09C;
}
#redes li:last-child{
	margin-right:0;
}
#redes li a{
	position:absolute;
	width:100%;
	height:100%;
	text-indent:-3000px;
}
#principal{
	height:40px;
  }

#principal ul {
	list-style: none;
	margin: 0;
	padding: 0;
  }

#principal li {
	display: inline-block;
	list-style: none;
	margin:0;
  }

#principal li a, #principal li a:link, #principal li a:visited {
  color: #fff;
  display: block;
  font-size:13px;
  text-transform:uppercase;
  margin:0;
  padding:9px 10px;
  text-decoration:none;
  }

#principal li:hover > a{
  text-decoration: none;
  background-color:#006699;
  }



#principal li li a, #principal li li a:link, #principal li li a:visited {
  background:#003366;
  width: 190px;
  color:#fff;
  float: none;
  margin: 0px;
  height:auto;
  line-height:normal;
  padding:12px;
  text-align:left;
  font-size:10px;
  font-weight:normal;
  border-bottom: 1px solid #006699;
  }

#principal li li a:hover, #principal li li a:active {
  background-color:#006699;
  }

#principal li ul {
z-index: 9999;
  position: absolute;
  left: -999em;
  height: auto;
  width: 190px;
  margin: 0px;
  padding:0;
  }

#principal li li {
}

#principal li ul a {
width: 190px;
  }

#principal li ul a:hover, #principal li ul a:active {
	
}

#principal li ul ul {
margin: -40px 0 0 213px;
  }

#principal li:hover ul ul, #principal li:hover ul ul ul, #principal li.sfhover ul ul, #principal li.sfhover ul ul ul {
left: -999em;
  }

#principal li:hover ul, #principal li li:hover ul, #principal li li li:hover ul, #principal li.sfhover ul, #principal li li.sfhover ul, #principal li li li.sfhover ul {
left: auto;
  }

#principal li:hover, #principal li.sfhover {
position: static;
  }
#featured{
	position:relative;
	height:auto;
}
#contenedorSlider{
	border-bottom:12px solid #90B323;
}
#contenedorSlider img{
	width:100%;
	height:auto;
}
#contadorCaja{
	width:44%;
	position:absolute;
	left:50%;
	bottom:-20%;
	margin-left:-22%;
}
#contadorCaja .bloque{
	background:rgba(255,255,255,.95);
	font-size:24px !important;
	text-align:center;
	line-height:20px;
	padding:10px;
	margin:0 !important;
	color:#095293;
}
.sombra{
	background:url(images/sombra.png) top center no-repeat;
	height:15px;
	margin:0;
	padding:0;
}
#cuerpo{
	padding:25px 0;
	background:#D9EBFF;
}
#barraLogos{
	padding-top:10px;
	background:#fff;
	min-height:370px;
}
#barraLogos h2, #barraLogos2 h2{
 font-size: 20px;	
}
#barraLogos img, #barraLogos2 img{
	display:block;
	margin:10px auto;
	max-width:100%;
	height:auto;
}
#barraLogos2 .bloque{
	font-size:22px !important;
	text-align:center;
	line-height:20px;
	padding:10px 0 30px 0;
	margin:0 !important;
	color:#095293;
}
#noticias{
	padding-top:110px;
	height:430px;
}
.videoWrapper {
	position: relative;
	padding-bottom: 56.25%; /* 16:9 */
	padding-top: 25px;
	height: 0;
	margin-bottom: 20px;
}
.videoWrapper iframe {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}
#redesboque{
	background:url(images/sombra.png) top center no-repeat;
	padding:30px 0;
}
#redesboque .seccion{
	background:#f0f0f0;
	padding:15px;
}
#redesboque .seccion h3{
	margin:0 0 10px 0;
	padding:0;
	color:#006699
}

#caja{
	float:left;
	width:70%;
	box-sizing:border-box;
	-moz-box-sizing:border-box;
	-webkit-box-sizing:border-box;
}
#caja .contenedorcaja{
	background:#fff;
	padding:25px;
	box-sizing:border-box;
	-moz-box-sizing:border-box;
	-webkit-box-sizing:border-box;
	overflow:hidden;
}
#caja img{
	max-width:100%;
	height:auto;
}
#caja h1{
	color:#90B323;
	margin:0 0 15px 0;
	padding:0;
}
#cajaFull{
	background:#fff;
	padding:25px;
	box-sizing:border-box;
	-moz-box-sizing:border-box;
	-webkit-box-sizing:border-box;
	overflow:hidden;
}
#cajaFull h1{
	color:#90B323;
	margin:0 0 15px 0;
	padding:0;
	text-align:center;
	text-transform:uppercase
}
.breadcrumbs{
	padding:5px 8px;
	background:#f0f0f0;
	border-radius:4px;
	-moz-border-radius:4px;
	-webkit-border-radius:4px;
	margin-bottom:20px;
	font-size:10px;
	text-transform:uppercase;
}
#barraLogos2{
	background:#fff;
	width:28%;
	float:right;
	box-sizing:border-box;
	-moz-box-sizing:border-box;
	-webkit-box-sizing:border-box;
	padding:10px;
}
#barraLogos2 h2{
	background:#095293;
	padding:14px 8px;
	color:#fff;
	font-size:16px;
	text-align:center;
	text-transform:uppercase;
	border-radius:4px;
	-moz-border-radius:4px;
	-webkit-border-radius:4px;
	margin:0 0 10px 0;
}
h4.panel-title{
	font-size:16px;
	color:#069;
	line-height:20px;
}
.panel-collapse blockquote{
	font-size:14px;
}
.noticia{
	/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#ffffff+0,f2f2f2+100 */
background: #ffffff; /* Old browsers */
background: -moz-linear-gradient(top, #ffffff 0%, #f2f2f2 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top, #ffffff 0%,#f2f2f2 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom, #ffffff 0%,#f2f2f2 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#f2f2f2',GradientType=0 ); /* IE6-9 */
	box-sizing:border-box;
	-moz-box-sizing:border-box;
	-webkit-box-sizing:border-box;
	padding:8px;
}
.noticia h3{
	font-size:22px;
	margin:0;
	text-align:center;
	padding:10px 0 0 0;
	font-weight:bold;
}
.noticia h3 a{
	color:#014898;
}
#barraLogos2 .widget{
	margin-bottom:15px;
}
.jadas{
	border:15px solid #FFF;
	background:#025caf;
}
.jadas figcaption{ 
	position:absolute; 
	z-index:1; 
	text-align:center; 
	width:100%; 
	bottom:14%; 
	color:#FFF; 
	text-transform:uppercase;
}
.jadas figcaption h3 a{ 
	color:#fff;
}
.jadas figcaption h3{text-shadow: -1px 2px 2px rgba(0, 0, 0, 0.75); font-size:20px; font-weight: bold; }
.jadas figure img, .notis figure img{ margin: auto;  bottom: 0; right: 0; width:100%; height:auto}
.jadas address{position:relative; height:45%; font-style:normal}
.jadas ul{ padding:15px 36px 0 36px; list-style:none}
.jadas ul li{ color:#FFF; padding:10px 0 10px 35px;overflow-wrap: break-word;word-wrap: break-word;-ms-word-break: break-all;word-break: break-all;word-break: break-word;-ms-hyphens: auto;-moz-hyphens: auto;-webkit-hyphens: auto;hyphens: auto; font-size:13px;}
.jadas ul li:nth-child(1){ background:url(images/cell.gif) no-repeat 0 8px}
.jadas ul li:nth-child(2){ background:url(images/mail.gif) no-repeat 0 8px}
.jadas ul li:nth-child(3){ background:url(images/web.gif) no-repeat 0 12px}
.jadas li a{color: #fff ;}
.relativo{
position:relative;
}
.verconsulado{
	text-align:center;
	margin-top:-15px;
}
.infoconsular{
	list-style:none;
}
.infoconsular li{
	margin:5px 0;
}
footer{
	background:#002346;
	text-align:center;
	color:#FFF;
	padding:8px;
}
#mapa{
	height:300px;
}
.alignright {float:right; margin:0 0 1em 1em; }
.alignleft {float:left; margin:0 2% 1% 0; }
.aligncenter {display: block; margin-left: auto; margin-right: auto; clear:both; }
.alignnone {display: block; padding:4px; }
a img.alignright {float:right; margin:0 0 1em 1em; }
a img.alignleft {float:left; margin:0 1em 1em 0; }
a img.aligncenter {display: block; margin-left: auto; margin-right: auto; clear:both; }
.videoWrapper {
	position: relative;
	padding-bottom: 56.25%; /* 16:9 */
	padding-top: 25px;
	height: 0;
}
.videoWrapper iframe {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}
.articulo{
	font-size:12px;
	overflow:hidden;
	padding-bottom:10px;
	border-bottom:15px solid #f9f9f9;
	margin-bottom:30px;
}
.articulo h2{
	font-size:22px;
	margin:0 0 10px 0;
	padding:0;
}
.articulo img{
	border:1px solid #f0f0f0;
	padding:4px;
}
.home2{
	padding-top:80px;
}
.fecha{
	color:#003366;
	padding:10px 0;
}
@media only screen and (max-width: 1600px) {
#contadorCaja{
	width:35%;
	bottom:-15%;
	margin-left:-17.5%;
}
@media only screen and (max-width: 1280px) {
#contadorCaja{
	width:44%;
	bottom:-20%;
	margin-left:-22%;
}
}
@media only screen and (max-width: 1024px) {
#contadorCaja{
	width:50%;
	margin-left:-25%;
}
#contadorCaja .bloque .countdown_text{
	font-size:18px !important;
}
#caja{
	width:60%;
	font-size:14px;
}
#caja h1{
	font-size:24px;
}

#barraLogos2{
	width:38%;
}
}
@media only screen and (max-width: 800px) {
#contadorCaja{
	bottom:-30%;
}
#principal li a, #principal li a:link, #principal li a:visited {
  font-size:12px;
  padding:10px 4px;
  }
}
@media only screen and (max-width: 650px) {
.mobil{
	display:block
}
.navbar {
  margin-bottom: 0px !important;
}
#headerPrincipal{
	height:auto;
	background:#fff;
}
#headerPrincipal #principal{ display:none;}
#headerPrincipal .container{
	padding:0 !important;
	margin:0 !important;
	width:100% !important;
}
#logo{
	float:none;
	margin:10px 0;
	text-align:center
}
#logo img{
	max-width:100%;
	height:auto;
}
#logo-transparencia, .derecha{
	display:none;
}
#contadorCaja{
	bottom:-40%;
	width:70%;
	margin-left:-35%;
}
#principal{
	background:#003366;
	height:auto;
  }
#principal li {
	display: block;
  }

#principal li li a, #principal li li a:link, #principal li li a:visited {
  width:auto;
  border-bottom: 1px solid #006699;
  }

#principal li ul {
  position:relative;
  left: 0;
  width: auto;
  }

#principal li li {
}

#principal li ul a {
width: auto;
  }
#principal li ul ul {
margin: 0px;
  }

#principal li:hover ul ul, #principal li:hover ul ul ul, #principal li.sfhover ul ul, #principal li.sfhover ul ul ul {
left: auto;
  }
#caja{
	width:100%;
	font-size:14px;
}
#barraLogos2{
	width:100%;
}
}
@media only screen and (max-width: 550px) {

.home2{
	padding-top:10px;
	
}
#cuerpo{background:#D9EBFF url(images/sombra.png) top center no-repeat;}
#contadorCaja{
	position:relative;
	bottom:auto;
	width:100%;
	left:auto;
	margin:auto;
	margin-left:auto;
}
#contadorCaja .sombra{
	display:none;}
	
	}
	
}