@charset "utf-8";
/*
 * Oficiales:
 * Gris: RGB(151,153,155) - #97999B
 * Azul: RGB(12,35,64)    - #0c2340
 *
 * Paleta:
 * Azul Transparencia: #35465B
 * Azul Claro:         #96bece
 * Amarillo:           #ff9900
 * 
 */
html {
/* medidas relativas */
	font-size: 62.5%;
}
/* tamaño del documento al total de la pantalla 
 * del dispositivo */
html, body {
	height: 100%;
	padding: 0;
	margin: 0;
}

body{
	/* posicion relative para body porque dentro del el
	 * habrá elementos con posicion absoulta */
	position: relative;
	
	/*font-family: 'Titillium Web', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;*/
	font-family: 'Titillium Web', sans-serif;
	line-height: 1.8;
	color: #818181;
	
	font-size: 14px;
	font-size: 1.4rem;
}

/* Estilos de Encabezado */
#page-header {
	padding:30px 30px;
}

#section-header {
	padding:10px;
	margin:0;
	border-bottom:15px solid #96bece;
	background-color:#0c2340;
}

#emblema,
#emblema-blue {
	padding:0;
	/* ajusta el tamaño de la imagen al bloque */
	width:100%;
	height:100%;
}
#emblema { max-width:300px; }

#emblema-blue { 	max-width:238px; }

@media(max-width: 768px)
{
	#page-header,#section-header {
		padding:25px 15px;
		margin:0;
	}
	
	#page-header .row .col-sm-3,
	#section-header .row .col-sm-3{
		text-align:center;
	}
}

/* Estilos de Menu */
#page-header .row .col-sm-9,
#section-header .row .col-sm-9 {
	padding:0;
	margin:0;
}
nav 
{
	padding:0;
}
.navbar
{
	padding:0;
	margin:20px 0 0 0;
}

.navbar-inverse
{
	background-color:#0c2340;
	border:1px solid #0c2340;
}

.nav-with-shadow,
#section-header
{
	-moz-box-shadow: 2px 4px 4px rgba(0, 0, 0,0.5);
	-webkit-box-shadow: 4px 2px 4px rgba(0, 0, 0, .5);
	box-shadow: 2px 4px 4px rgba(0, 0, 0, .5);
}

.navbar-nav > li
{
	max-width:120px;
	text-align:center;
}

.navbar-inverse .navbar-nav > li > a
{	
	line-height:14px;
	font-size:14px;
	font-size:1.4rem;
	color:#e0e0e0;
}

.navbar-inverse .navbar-nav > li > a:hover,
.navbar-inverse .navbar-nav > li > a:focus {}

@media(max-width: 768px)
{
	.navbar li{
		max-width:100%;
	}
	.navbar-inverse 
	{
		border-radius:0 0 5px 5px;
	}
	.navbar-header{}
	.navbar-toggle
	{
		border:none !important;
		background-color:#35465B !important;
	}
	.navbar-toggle:hover
	{
		background-color:#97999b !important;
	}
	.navbar-toggle .icon-bar
	{
		background-color:white;
	}
	
	.navbar-collapse
	{
		border:none !important;
		background-color:#35465b;
	}
}

/* Estilos de Carousel */

#page-carousel
{
	padding:0;
	margin:0;
}
.carousel-inner img 
{
	width: 100%; /* Set width to 100% */
	height:500px;
	margin: auto;
}

/* Estilos generales de Secciones, Titulos y Paneles */
.section{
	padding:60px 50px;
}
.panel,
.panel-heading,
.panel-body,
.panel-footer 
{
	border:none;
}
.panel-shadow:hover {
  box-shadow: 5px 0px 40px rgba(0,0,0, .2);
}

.title-heading,
.panel-heading,
.panel-contenido .panel-body h3
{
	font-family: Lato, sans-serif;
}
.title-heading
{
	letter-spacing:8px;
	margin-bottom:50px;
}
@media screen and (max-width: 768px) {
	.title-heading,
	.panel-heading,
	.panel-contenido .panel-body h3
	{
		text-align: center;
    margin: 25px 0;
	}
}

/*
 * *** Estilos generales de textos
 */
#intro-quienes-somos p,
#intro-porque-elegirnos p,
.panel-body
{
	text-align:justify;
}

/* 
	*** Estilos de Bloque Presentacion *** 
*/
#intro-quienes-somos p,
#intro-porque-elegirnos p{
	font-size:16px;
	font-size:1.6rem;
}
#intro-porque-elegirnos
{
	color:#0c2340;
	background-color:#96bece;
}
.logo
{
	font-size:200px;
	color:#0c2340;
}
@media screen and (max-width: 768px) {
		#intro-quienes-somos .col-sm-8,
		#intro-quienes-somos .col-sm-4,
		#intro-porque-elegirnos .col-sm-8,
		#intro-porque-elegirnos .col-sm-4
		{
			text-align:center;
		}
		.logo{
			font-size:150px;
		}
}
/* Estilos Bloque Primarios */
.panel-primario .panel-heading
{
	line-height:26px;
	font-size:26px;
	font-size:2.6rem;
	
	background-color:#ffffff;
	color:#3f5168;
	border-bottom:1px solid #3f5168 !important;
}

.panel-primario .panel-footer
{
	background-color:#0c2340;
	color:#ffffff;
}
.panel-primario .panel-body{
	height:210px;
}
@media screen and (max-width: 768px) {
  .panel-primario .panel-body{
		height:auto;
	}  
}

@media screen and (max-width: 480px) {
  .panel-primario .panel-body{
		height:auto;
	}  
}
/* Estilos Bloque Secundarios */
.panel-secundario .panel-heading
{
	color:#ffffff;
	line-height:22px;
	font-size:22px;
	font-size:2.2rem;
	
	background-color:#96bece;
	border-bottom:1px solid #ff9900 !important;
}
.panel-secundario .panel-footer
{
	color:#ffffff;
	text-align:right;
	background-color:#0c2340;
}

.panel-secundario .panel-footer .btn {
		border: 1px solid #ffffff;
		background-color: #97999b !important;
		color: #ffffff;
}

.panel-secundario .panel-footer .btn:hover {
		border: 1px solid #96bece;
		background-color: #fff !important;
		color: #96bece;
}

.panel-secundario .panel-body{
	height:150px;
}

@media screen and (max-width: 768px) {
  .panel-secundario .panel-body{
		height:auto;
	}  
}

@media screen and (max-width: 480px) {
  .panel-secundario .panel-body{
		height:auto;
	}  
}
/* Contenidos */

/* Estilos generales de Secciones, Titulos y Paneles */
.contenido{
	padding:30px 50px;
}

.panel-contenido .panel-heading
{
	line-height:26px;
	font-size:26px;
	font-size:2.6rem;
	
	padding:20px;
	
	letter-spacing:8px;
	margin-bottom:20px;
	border-bottom:2px solid #ff9900;
}
.panel-contenido .panel-heading .emblema-vista{
	float:left;
	margin-right:10px;
	opacity:0.5;
}
.panel-contenido .panel-body{
	font-size:16px;
	font-size:1.6rem;
}

.panel-contenido .panel-body h3
{
	padding:5px 10px;
	border-bottom:1px solid #96bece;
}

.contenido .ilustracion{
	margin:25% auto;
}
@media screen and (max-width: 768px) {
  .panel-contenido .panel-heading .emblema-vista{
	float:none;
	margin-right:none;
  }
  .contenido .ilustracion{
		text-align:center;
		margin:0;
	}
}

/* Estilos de Pie de pagina */
#page-footer
{
	background-color:#0c2340;
	border-top:10px solid #ff9900;
	
	text-align:center;
	
	padding-top:20px;
}

#page-footer p
{
	color:#ffffff;
}

#page-footer p.copyrights
{
	font-size:10px;
	font-size:1.0rem;
	
	margin-top:20px;
}

/* Animaciones */

.slideanim {visibility:hidden;}
.slide {
	/* The name of the animation */
	animation-name: slide;
	-webkit-animation-name: slide; 
	/* The duration of the animation */
	animation-duration: 1s; 
	-webkit-animation-duration: 1s;
	/* Make the element visible */
	visibility: visible; 
}

/* Go from 0% to 100% opacity (see-through) and specify the percentage from when to slide in the element along the Y-axis */
@keyframes slide {
	0% {
			opacity: 0;
			transform: translateY(70%);
	} 
	100% {
			opacity: 1;
			transform: translateY(0%);
	} 
}
@-webkit-keyframes slide {
	0% {
			opacity: 0;
			-webkit-transform: translateY(70%);
	} 
	100% {
			opacity: 1;
			-webkit-transform: translateY(0%);
	}
}

.btn-enlace
{
	color:#ffffff;
}
.btn-enlace:hover
{
	color:#ffffff;
	opacity:0.8 !important;
}
.btn-enlace + .tooltip > .tooltip-inner{
	background-color:#96bece;
	color:#ffffff;
	padding:15px;
}

.btn-enlace + .tooltip.bottom > .tooltip-arrow {
  border-bottom: 5px solid #96bece;
}

/* Tarjeta de Presentacion */
.tarjeta{
	margin:20px 0;
	border:1px solid #818181;
	border-radius:5px;
	padding:15px 5px;
}
.tarjeta .emblema-tarjeta{
	width:100%;
}
.tarjeta h3{
	margin:10px 0 5px 0;
	padding:0;
}
.tarjeta p{
	margin:3px 0;
}
/* */