@charset "utf-8";
@import "reset.css";
@import "fonts/stylesheet.css";

body { margin: 0 auto; font-family: 'Montserrat', sans-serif; font-weight: 500; font-size: 14px; color: #273575; -webkit-font-smoothing: antialiased; }

/* links  */ 

a { color: #273575; -webkit-transition: all 0.2s ease;
-moz-transition: all 0.2s ease;
-ms-transition: all 0.2s ease;
-o-transition: all 0.2s ease;
transition: all 0.2s ease; }
a:hover { color: #6bc4d1; -webkit-transition: all 0.2s ease; }

.link2, .link3, .link4, #contacto button { float: left; height: 66px; width: 100%; background-color: white; color: #6bc4d1; font-size: 20px; -ms-display: flex; display: -webkit-flex; display: flex; align-items:center; justify-content: center; }
.link2:hover { color: white; background-color: #273575; }
.link_white { color: white; } .link_white:hover { color: #273575; }
.link3, #contacto button { float: right; width: 380px; background-color: #273575; color: white; }
.link3:hover, .link4:hover { color: white; background-color: #666; }
.link4 { background-color: #273575; color: white; } 
	
/* títulos y texto */ 

p { line-height: 20px; }
h1 { font-size: 60px; text-transform: uppercase; font-weight: 700; }
h2 { font-size: 42px; text-transform: uppercase; font-weight: 700; }
h3 { font-size: 36px; text-transform: uppercase; font-weight: 700; }
h4 { font-size: 22px; text-transform: uppercase; }

hr { width: 100%; border-bottom: 1px solid #273575; margin: 30px 0; }

strong { font-weight: 600; }
.big_text { font-size: 23px; line-height: 28px; }
.light { font-weight: 300; }

/* colores  */ 

.bg_blue { background-color: #273575; }
.bg_cyan { background-color: #6bc4d1; }

.clr_gray { color: #666; }
.clr_white { color: white; }
.clr_cyan { color: #6bc4d1; }

/* arreglos  */ 

.pre-load-web { width:100%; height: 100%; width: 100vw; height: 100vh; position:absolute; position:fixed; left:0; top:0; -ms-display: flex; display: -webkit-flex; display: flex; align-items:center; justify-content: center; z-index:100000; }

.center_center { -ms-display: flex; display: -webkit-flex; display: flex; align-items:center; justify-content: center; } 
.center_vertical { -ms-display: flex; display: -webkit-flex; display: flex; align-items:center; justify-content: flex-start; } 

.listado { width: 100%; -ms-display: flex; display: -webkit-flex; display: flex; align-items: flex-start; justify-content:space-between; flex-wrap: wrap; } 

.center { text-align: center; }
.padding { padding: 85px 30px; }
.padding_2 { padding: 0 30px; }
.margin_bottom { margin-bottom: 60px; }
.margin_bottom_2 { margin-bottom: 15px; }
.ancho { width: 100%; }
.fullscreen { width: 100%; height: 100vh; }
.image:hover { opacity: 0.7;}
.top { margin-top: 80px; }

/* general  */ 

.main { position: absolute; width: 100vw; overflow: hidden; }
.section { position: relative; float: left; width: 100%; }
.cont { position: relative; margin: 0 auto; width: 100%; max-width: 1080px; }
.col1 { float: left; width: 35%; padding-top: 70px; }
.col2 { float: left; width: 65%; }
.col3 { float: left; width: 17%; }
.col4 { float: left; width: 83%; }
.col6 { float: left; width: 312px; height: 198px; background-size: cover; }
.col7 { float: left; width: 768px; padding-left: 40px; }

.fila { float: left; width: 100%; }

/* header  */ 

.header { position: fixed; top: 0; width: 100%; height: 92px; padding: 0 30px;background-color: white; -ms-display: flex; display: -webkit-flex; display: flex; align-items:center; justify-content: space-between; z-index: 4000; }
.nav li { display: inline-block; margin: 0 15px; font-size: 11px; }
.social li { display: inline-block; margin-left: 8px; vertical-align: middle; }
#menu_mobile { display: none; width: 30px; text-align: right; }

/* home  */ 

.whatsapp { position: fixed; bottom: 30px; right: 30px; z-index: 2000; width: 60px; height: 60px; color: white; border-radius: 50%; text-align: center; background-color: #39b54a; padding-top: 15px; z-index: 2000; }
.whatsapp:hover { background-color: #666; color: white; }

.slick div, .slick { position: relative; width: 100%; height: 100%; }
.slick div { background-repeat: no-repeat; background-position: center center; background-size: cover; }

/* galeria  */ 

.item_galeria { width: 33.33333%; height: 19vw; border: 0; margin: 0; background-repeat: no-repeat; background-size: cover; }
.item_galeria:hover { opacity: 0.7; }

/* noticias  */ 

.noticias { float: left; width: 100%; padding: 30px 0; border-bottom: 1px solid white; }
.noticias:hover { color: white; background-color: #80d9e0; }
.item_titulo { float: left; width: 100%; padding-bottom: 10px; border-bottom: 1px solid white; margin-bottom: 10px; -ms-display: flex; display: -webkit-flex; display: flex; align-items: flex-start; justify-content: space-between; }

/* contacto y footer  */ 

input, textarea { display: inline-block; height: 40px; background-color: transparent; color: #273575; border: 0; border-bottom: 1px solid #273575; width: 45%; margin-bottom: 40px; font-size: 16px; border-radius: 0; }
textarea { width: 100%; height: 280px; padding: 20px; border: 1px solid #273575; margin-bottom: 0; }
input[type=text]:focus, input[type=email]:focus, textarea:focus { border-bottom: 1px solid #666; }
#contacto button { border: 0; margin: 0; cursor: pointer; }
#contacto button:hover { background-color: #666; }

#footer { padding: 45px 30px; }
.nav_footer li { margin-bottom: 10px; font-size: 11px; }
.nav_footer li a:hover { color: #6bc4d1; }

#clientes .cont { padding: 0 30px; }
#contacto { padding-top: 0; }

/* noticias y capacitaciones  */ 

.compartir { display: inline-block; text-align: center; padding: 30px; }
.compartir li { display: inline-block; text-align: center; margin: 0 10px; vertical-align: middle; }

#noticias_titulo { background-image: url('imgs/bg.png'); background-repeat: no-repeat; background-position: right top; }

@media (max-width: 900px) {

	#menu_mobile { display: inline-block; }
	#close, .nav_footer { display: none; }

	body { font-size: 11px; }
	h1 { font-size: 22px; }
	h2 { font-size: 20px; }
	h3 { font-size: 16px; }
	h4 { font-size: 13px; }
	p { line-height: 17px; }
	hr { margin: 15px 0; }

	.link2, .link3, .link4, #contacto button { height: 40px; font-size: 13px; }
	.whatsapp {  font-size: 12px; width: 50px; height: 50px; padding-top: 13px; }

	.top { margin-top: 50px; }
	.padding { padding: 60px 30px; }
	.margin_bottom { margin-bottom: 30px; }
	.margin_bottom_2 { margin-bottom: 10px; }
	.cont { width: 100%; }
	
	.nav { position: fixed; width: 100%; height: 100vh; top: 92px; left: 0; background-color: white; background-color: rgba(255,255,255,0.9); text-align: center; padding: 40px 0; display: none; }
	.nav li { display: block; width: 100%; margin: 0; margin-bottom: 20px; font-weight: 700; }
	
	.big_text { font-size: 14px; line-height: 16px; }

	.col1, .col2, .col3, .col4, .col5, .col6, .col7 { width: 100%; padding: 0; }  
	.col3 { text-align: center; margin-bottom: 10px; }
	.col3 img { height: 70px; }
	.col4 { text-align: center; }
	.col6 { margin-bottom: 15px; }
	
	.item_galeria { width: 33.33333%; height: 33.3vw; }
	#img_capacitacion { height: 120px; }
	.link3, #contacto button { width: 100%; margin-bottom: 30px; }
	input, textarea { margin-bottom: 10px; font-size: 11px; }
	textarea { height: 110px; margin-top: 10px; }
	#logo_footer { width: 140px; }

	.compartir li { margin: 0 5px; }

}
