@charset "utf-8";
/* CSS Document */

html, body{
	font-family: 'Istok Web', sans-serif;
	font-weight:normal;
	height:100%;
	margin:0 auto; 
	width:100%; }

h1{ 
	color:#575756;	
	font-family: 'Archivo Black', sans-serif;
	font-size:34px;
	font-weight:bold;
	line-height:32px; }	

h2{
	color:#575756;	
	font-family: 'Archivo Black', sans-serif;
	font-size:22px;
	font-weight:bold; }

h3{ 
	color:#fff;
	font-family: 'Istok Web', sans-serif;
	font-size:18px;
	font-weight:bold; }

h4{
	color:#fff;
	font-family: 'Archivo Black', sans-serif;
	font-size:40px;
	font-weight:bold; }

h5{
	color:#fff;	
	font-family: 'Archivo Black', sans-serif;
	font-size:22px;
	font-weight:bold; }

a{ 	
	font-family: 'Istok Web', sans-serif;
	color:#01547C;
	text-decoration:none; }

a:hover{ 
	color:#2a2a2a;
	transition-duration: 1s; }
	
b, strong{ font-weight:bold; }

label{
	color:#4cb3d4 !important;
	font-size:12px;
	font-weight:bold; }

/*------------------------------------
				[MAIN]
-------------------------------------*/
header{
	background-color:#fff;
	height:107px;
	padding:5px 0;
	width:100%; }
	
footer{
	float:left;
	background-color:#0A8CBD;
	height:auto;
	width:100%; }
	
#wrapper{
	float:left;
	height:auto;
	min-height:100%;
	min-width:1200px; 
	width:100%; }

/*------------------------------------
				[MENU]
-------------------------------------*/
#content-menu{
	margin:0 auto;	
	width:1200px; }
	
#logo{
	float:left;
	padding:20px 0;
	width:200px; }
	
#menu{
	float:left;
	padding:0 15px;
	text-align:right;
	width:calc(100% - 230px); }
	
#social{
	float:left;
	padding:20px 15px;
	text-align:right;
	width:calc(100% - 230px); }
	
#ulmenu{
	float:right;
	width:auto; }
	
.menu{ 
	float:left;
	font-weight:bold;
	margin:10px;
	text-transform:uppercase; }
	
.logo{ width:100%; }

.icon{ font-size:25px; }

ul#ulmenu li a{
        position: relative;
        color:#01547C;    }
    
    ul#ulmenu li a:after{
    	color:#2a2a2a;    
        position: absolute;
        bottom: 7px;
        left: 0px;
        width: 100%;
        height: 4px;
        background-color: #184093;
        content: "";
        opacity: 0;
        transition: opacity 0.3s ease 0s, transform 0.3s ease 0s;
        transform: translateY(20px);  }
        
    ul#ulmenu li a:hover:after{
    	color:#2a2a2a;
        opacity:1;
        transform: translateY(15px); }
        
/*------------------------------------
  	  	  [RESPONSIVE MENU]
-------------------------------------*/
#content-responsive-menu{
	background-color:#01547C;
	box-shadow:1px 1px 12px #2a2a2a;
	color:#fff;
	display:none;
	height:auto;
	margin-left:15px;
	margin-top:115px;
	line-height:25px;
	padding:15px;
	position:absolute;
	width:180px;
	z-index:9999; }
	
.menur{
	color:#fff;
	font-weight:normal;
	margin:15px 0;
	text-transform:uppercase; }
	
.res{ display:none; } 

.icon-menu{
	cursor:pointer;
	display:none;
	float:right;
	font-size:32px; }
        
/*------------------------------------
 			  [BANNER]
-------------------------------------*/
#banner{
	float:left;
	height:auto;
	width:100%; }
	
#content-banner{ width:100%; }
	
.banner{ width:100%; }

.caption{
	text-shadow:0px 0px 12px #2a2a2a;
	margin-left:50%;
	margin-top:-250px;
	left:-275px;
	position:absolute;
	text-align:center;
	width:550px; }
	
.action{
	color:#fff;
	cursor:pointer;
	background-color:#0A8CBD;
	border-radius:15px;
	font-size:30px;
	font-weight:bold;
	margin:15px auto;
	padding:10px;
	padding-top:16px;
	text-align:center;
	width:200px; }
	
.action:hover{ background-color:#2a2a2a; }

/*------------------------------------
 			  [ABOUT]
-------------------------------------*/
#about{
	background-color:#F6F6F6;
	float:left;
	height:auto;
	width:100%; }
	
#content-about{
	margin:0 auto;
	width:1200px; }
	
#about-left, #about-right{
	float:left;
	line-height:25px;
	padding:15px;
	width:calc(45% - 30px); }
	
#about-left{
	padding-top:5%;
	margin-left:10%; }
	
.button{
	color:#fff;
	cursor:pointer;
	background-color:#0A8CBD;
	border-radius:15px;
	font-size:20px;
	font-weight:bold;
	margin:15px auto;
	padding:8px;
	padding-top:12px;
	text-align:center;
	width:110px; }
	
.button:hover{ background-color:#2a2a2a; }

/*------------------------------------
 			  [SPECIAL]
-------------------------------------*/
#special{
	background-color:#F6F6F6;
	float:left;
	height:auto;
	margin-bottom:35px;
	width:100%; }
	
#content-special{
	margin:35px auto;
	width:1200px; }
	
.title-section{
	margin-bottom:35px;
	padding:8px;
	text-align:center;
	width:calc(100% - 16px); }

.content-boxes{
	height:auto;
	float:left;
	width:100%; }
	
.box-project{ 
	float:left;
	margin-bottom:15px; 
	width:30%; }
	
.margin{ margin-right:40px; }

.top-box{
	color:#fff;
	float:left;
	height:275px;
	margin-bottom: -4px;
	overflow:hidden;
	width:100%; }

.bottom-box{
	color:#fff;
	float:left;
	line-height:20px;
	min-height:220px;
	padding:30px;
	width:calc(100% - 60px); }
	
.foto{ width:100%; }

.blue1{ background-color:#287FC3; }
.blue2{ background-color:#256AB3; }
.blue3{ background-color:#2354A2; }

.blue4{ background-color:#04547B; }
.blue5{ background-color:#05749B; }
.blue6{ background-color:#0C8CBD; }
.blue7{ background-color:#4CB3D4; }
.blue8{ background-color:#6DBCDB; }
.blue9{ background-color:#A1CEDA; }
.blue0{ background-color:#04547B; }



.more{
	color:#fff;
	float:right; }
	
/*------------------------------------
 			  [YEAR]
-------------------------------------*/
#year{
	float:left;
	height:auto;
	margin-bottom:35px;
	width:100%; }
	
#content-year{
	margin:35px auto;
	width:1200px; }
	
.box-year{
	border-radius:55px;
	display:block;
	float:left;
	margin-bottom:25px;
	transition: background .2s linear;	
	width:30%; }
	
.box-year {
    display: block;
    position: relative;
    width: 30%;
}
.box-year:before {
    border-radius: 55px;
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
    height: 99%;
	background: none;
    transition: background .2s linear;
}
.box-year:hover:before {
	background: rgba(0, 138, 184, .5);	}
	
.caption-text{
	color:#fff;
	font-size:24px;
	font-weight:bold;
	position:absolute;
	text-align:center;
	text-transform:uppercase;
	top:45%;
	width:100%; }
	
/*------------------------------------
 			  [BLOG]
-------------------------------------*/
#blog{
	float:left;
	height:auto;
	margin-bottom:35px;
	width:100%; }
	
#content-blog{
	margin:0 auto;
	width:1200px; }

.top-box-blog{
	color:#fff;
	float:left;
	height: 215px;	
	margin-bottom: -4px;
    overflow: hidden;
	width:35%; }
	
.bottom-box-blog{
	color:#2a2a2a;
	float:left;
	line-height:20px;
	min-height:160px;
	padding:30px;
	width:calc(65% - 60px); }
	
.bottom-box-home{
	color:#2a2a2a;
	float:left;
	line-height:20px;
	min-height:160px;
	padding:30px;
	width:calc(100% - 60px); }

.blog{
	color:#01547C !important;
	font-size:18px;
	font-weight:bold;
	text-align:center; }
	
.more2{
	color:#01547C;
	float:right; }
	
/*------------------------------------
		  [BANNER PROMO]
-------------------------------------*/
#advertisements{
	background:url("../img/banners/hoja.jpg") no-repeat center;
	float:left;
	height:auto;
	width:100%; }
	
#adv-left, #adv-right{
	float:left;
	padding:35px 35px 0px 5px;
	text-align:center;
	width:calc(50% - 70px); }
	
#content-adv{ width:100%; }

.caption2{
	text-shadow:0px 0px 12px #2a2a2a;
	margin-top:118px;
	width:100%; }
	
.bann-adv{ width:70%; }

/*------------------------------------
			  [MAGAZINE]
-------------------------------------*/
#magazine{
	background-color:#F6F6F6;
	float:left;
	height:auto;
	padding:25px 0;
	text-align:center;
	width:100%; }
	
#content-magazine{
	margin:0 auto;
	width:40%; }
	
#magazine-left,
#magazine-right{
	float:left;
	margin:0 25px;
	width:40%; }

.ma-top{
	float:left;
	width:100%; }
	
.ma-bottom{
	color:#fff;
	float:left;
	font-family: 'Archivo Black', sans-serif;
	line-height:22px;
	margin-top:-4px;
	padding:15px;
	text-align:center;
	width:calc(100% - 30px);}
	
/*------------------------------------
			[GENERAL]
-------------------------------------*/
#content-general{
	float:left;
	padding:0px 15px 15px 15px;
	left:50%;
	margin-left:-575px;
	position:relative;
	width:1170px; }
	
.bar-menus{
	background-color:#184093;
	border-right:60px solid #021e5d;
	color:#fff;
	font-size:14px;
	height:30px;
	margin-top:25px;
	padding:15px;
	width:calc(100% - 90px); }
	
.tab1{
	cursor:pointer;
	border-top:2px solid #fff; }
	
.tab2, .tab3{ cursor:pointer; }

.title-content{
	margin:15px 0;
	padding:8px;
	width:calc(100% - 16px); }
	
#left-content{
	float:left;
	padding:15px 0;
	width:40%; }
	
#right-content{
	float:left;
	line-height:25px;
	padding:0 15px;
	margin-left:25px;
	width:calc(55% -  30px); }
	
#right-content-quienes-somos{
	float:left;
	line-height:25px;
	padding:15px;
	margin-left:25px;
	width:calc(55% -  30px); }
	
#right-content-ayeryhoy,
#right-content-profesores{ 
	display:none;
	float:left;
	line-height:25px;
	padding:15px;
	margin-left:25px;
	width:calc(55% -  50px); }
	
.foto-tiempo,
.foto-profesores{ display:none; }
	
/*.bluebox{ 
	background-color:#0C8CBD;
	border-radius:12px;
	color:#fff;
	padding:10px; }*/
	
#body-content{
	float:left;
	line-height:25px;
	padding:15px 0;
	width:100%; }
	
.icon-graduation-cap-1{ 
	color:#b3b3b3;
	margin-right:8px; }

.list-attr{ 
	display:flex;
	margin-bottom:8px; }
	
.bar-menus-list{
	border-left:2px solid #184093;
	float:left;
	margin:0 10px;
	padding:10px 0; }

.title-interior{
	border-bottom:2px solid #2a2a2a;
	margin:25px 0;
	padding:15px 0;
	width:calc(100% - 30px); }
	
.subtemas{
	border-top:2px solid #2a2a2a;
	cursor:pointer;
	float:left;
	padding:15px;
	width:calc(100% - 30px); }
	
.subtemas:hover{ background-color:#efefef; }

.subtemasop1,
.subtemasop2,
.subtemasop3,
.subtemasop4{
	background-color:#f5f5f5;
	display:none;
	float:left;
	margin-bottom:10px;
	padding:45px;
	width:calc(100% - 90px); }

.final{ 
	border-bottom:1px solid #ccc;
	margin-bottom:35px; }
	
.img-int{ 
	box-shadow: 0 0 12px #2a2a2a;
	margin-top:45px;
	width:100%; }

#share{
	float:left;
	padding:25px;
	text-align:right;
	width:calc(100% - 50px); }
	
.button-right{
	color:#cecece;
	float:right; }
	
.box-services{
	float:left;
	margin:25px 0;
	width:100%; }
	
.box-services-left{ 
	border:1px solid #2a2a2a;
	float:left;
	font-size:36px;
	padding:15px;
	text-align:center;
	width:52px; }
	
.box-services-right{
	float:left;
	padding:0 15px;
	text-align:justify;
	width:calc(100% - 150px); }

#gray-box{
	padding:25px;
	width:calc(100% - 50px); }
	
.gray{ 
	background-color:#F2F2F2; }
	
.title-widget{
	color:#01547C;
	font-family: 'Archivo Black', sans-serif;
	font-size:22px;
	font-weight:bold;
	margin-bottom:25px;
	text-align:center;
	width:100%; }
	
.box-special{
	background-color:#fff;
	float:left;
	margin:20px 0;
	width:100%; }
	
.box-special-left{
	float:left;
	width:120px; }
	
.box-special-right{
	float:left;
	font-size:12px;
	padding:10px 10px 0px 10px;
	width:calc(100% - 170px); }
	
/*------------------------------------
		  	[SERVICIOS]
-------------------------------------*/
.centerbox{ text-align:center; }

.marginserv{ margin-right:58px; }

.marleftbox{ margin-left:35%; }
	
/*------------------------------------
		  		[BLOG]
-------------------------------------*/
#left-content-blog{
	float:left;
	margin-right:15px;
	width:800px; }
	
#right-content-blog{
	float:left;
	width:355px; }
	
.box-blog {
    float: left;
    margin:15px 0;
    width: 100%; }

#nav-bottom-blog{
	float:left;
	margin:25px 0; 
	padding:15px;
	width:calc(100% - 30px);  }
	
#nav-top-blog{
	background-color:#0A8CBD;
	color:#fff;
	float:left;
	margin:25px 0; 
	padding:15px;
	width:calc(100% - 30px);  }
	
.left-top-nav{ 
	float:left;
	padding-top:25px;
	width:200px; }
	
.right-top-nav{
	float:left;
	width:calc(100% - 200px); }
	
#nav-pagination{
	width:500px; }
	
.page{
	background-color:#0A8CBD;
	color:#fff;
	cursor:pointer;
	float:left;
	font-size:13px;
	height:15px;
	margin:0 2px;
	padding:12px;
	text-align:center;
	width:25px; }
	
.first, .last{
	background-color:#0A8CBD;
	color:#fff;
	cursor:pointer;
	float:left;
	font-size:13px;	
	height:15px;
	margin:0 2px;
	padding:12px;
	text-align:center;
	width:auto; }
	
.page:hover,
.first:hover, 
.last:hover{ 
	background-color:#2a2a2a;
	transition-duration:1s;  }
	
.active{ 
	background-color:#2a2a2a;
	font-weight:bold; }
	
.active:hover{ 
	background-color:#184093;
	font-weight:bold; }
	
.top-left-blog{
	background-color:#2a2a2a;
	color:#fff;
	float:left;
	font-size:18px;
	padding:15px;
	width:calc(100% - 30px); }
	
.box-thumb-blog{
	float:left;
	margin:15px 0;
	padding:8px;
	width:calc(100% - 16px); }
	
.left-thumb{
	float:left;
	height: 90px;
    overflow: hidden;
	width:100px; }
	
.right-thumb{ 
	float:left;
	padding:10px;
	width:calc(100% - 120px); }
	
.thumb-title{
	font-size:16px;
	font-weight:bold;
	width:100%; }
	
.thumb-body{
	font-size:13px;
	margin-top:15px;
	width:100%; }

.blog-active{ background-color:#f5f5f5; }

.box-thumb-blog:hover{ background-color:#f5f5f5; }

.blog-active:hover{ background-color:#fff; }
	
.thumb{
	height:auto;
	width:100%; }
	
.img-blog-note{
	float:left;
	text-align:center;
	width:100%; }
	
.content-blog-note{ 
	float:left;
	line-height:25px;
	margin-top:25px;
	padding:15px;
	text-align:justify;
	width:calc(100% - 30px); }
	
.shadow{ box-shadow:0px 0px 12px #2a2a2a; }

/*------------------------------------
		  	   [VIDEO]
-------------------------------------*/
#popup-old{ 
    background-color: #fff;
    box-shadow: 1px 1px 12px #ccc;
    height:550px;
    margin-left: 50%;
    margin-top: 10px;
    padding:12px;
    position: absolute;
    text-align:right;
    width:calc(40% - 24px);
    z-index:999; }

#popup{ 
    background-color: #fff;
    box-shadow: 1px 1px 12px #ccc;
    height:auto;
    margin-left: 50%;
    margin-top: 10px;
    left: -20%;    
    padding:12px;
    position: absolute;
    text-align:right;
    width:calc(40% - 24px);
    z-index:999; }

#close-popup{
    color: #fff;
    cursor: pointer;
    background-color: #2a2a2a;
    float: right;
    width: 15px;
    padding: 6px 5px;
    text-align: center;
    border-radius: 15px;
    font-size: 12px;
    position: relative;
    margin-top: -25px;
    z-index: 999;
    box-shadow: 1px 1px #fff; }

#video-widget{ 
    float: left;
    margin: 5px 0;
    width: 100%; }

/*------------------------------------
		  	[CONTACTO]
-------------------------------------*/
#google-map{
	float:left;
	padding:15px;
	width:calc(100% - 30px); }
	
#form{
	margin:0 auto;
	width:1200px; }
	
#form-top, #form-bottom{ 
	float:left;
	padding:0 15px;
	width:calc(100% - 30px); }
	
.left-contact, 
.right-contact{
	float:left;
	padding:10px;
	width:calc(50% - 20px);}
	
.button-contact{
	float:left;
	text-align:right;
	width:100%; }
	
.social-msg{ 
	color:#4cb3d4;
	font-weight:bold;
	text-transform:uppercase; }
	
.input-type-a{
	background-color:#f1f1f1;
	border:none;
	border-radius:8px;
	margin:10px 0;
	padding:15px;
	width:calc(100% - 30px); }
	
.select-type-a{
	background-color:#f1f1f1;
	border:none;
	border-radius:8px;
	margin:10px 0;
	padding:15px;
	width:100%; }
	
.textarea-type-a{
	background-color:#f1f1f1;
	border:none;
	border-radius:8px;
	height:200px;
	margin:10px 0;
	max-height:200px;
	max-width:calc(100% - 30px);
	padding:15px;
	width:calc(100% - 30px); }
	
.submit-type-a{
	background-color:#4cb3d4;
	border:none;
	color:#fff;
	cursor:pointer;
	margin-top:110px;
	padding:12px;
	width:120px; }
	
.submit-type-a:hover{ 
	background-color:#2a2a2a;
	transition-duration:1s; }
	
.icong{ 
	color:#4cb3d4 !important;
	font-size:36px; }
	
.icong:hover{ color:#2a2a2a; }
	
/*------------------------------------
		  	[FOOTER]
-------------------------------------*/
#footer{
	font-size:13px;
	margin:0 auto;
	padding:15px;
	width:1170px; }
	
.foot-col{
	color:#fff;
	float:left;
	line-height:22px;
	padding:25px; }

.colleft{ width:calc(40% - 50px); }

.colcenter{
	font-size:12px;
	text-align:left;
	width:calc(30% - 50px); }

.colright{
	width:calc(30% - 50px); }
	
.title-footer{
	font-family: 'Archivo Black', sans-serif;
	font-size:24px;
	font-weight:bold;
	margin-bottom:20px;
	width:100%; }

.iconf{ 
	color:#fff !important;
	font-size:24px; }
	
.footlink{ color:#fff; }

.footlink:hover{ 
	color:#c5c5c5;
	transition-duration:1s; }
	
.logo-footer{
	margin-bottom:25px;
	width:100%;  }
	
.left-location{ margin-left:22px; }

.menuf{ 
	text-align:left; }
	
.lmenu{ color:#fff; }

.lmenu:hover{ color:#2a2a2a; }

.box-footer-blog{
	float:left;
	margin-bottom:8px;	
	padding:10px 10px 10px 0px;
	text-align:left;
	width:calc(100% - 10px); }
	
.last-footer-box-title{
	border-bottom:1px solid #fff;
	color:#fff;
	font-family: 'Archivo Black', sans-serif;
	font-size:20px;
	font-weight:bold;
	float:left;
	width:100%; }

.last-footer-box-body{
	color:#fff;
	float:left;
	width:100%; }
	
#bottom-footer{
	border-top:1px solid #fff;
	float:left;
	padding:8px 0;
	width:100%; }

#content-bottom-footer{
	color:#fff;
	font-size:12px;
	margin:0 auto;
	padding-top:7px;
	text-align:center;
	width:1200px; }

#social-footer,
#legend-footer{
	color:#fff;
	font-size:12px;
	float:left;
	width:48%; }
	
#legend-footer{ text-align:right; }

#social-footer{ padding-top:7px; }

.legal{
	line-height:25px;
	text-align:justify;
	width:90%; }