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

body { margin: 0 auto; font-family: 'Open Sans', sans-serif; font-size: 13px; color: #333333; font-weight:  600; -webkit-font-smoothing: antialiased; }

/* links  */ 

a { color: #333333; -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: #00AD8F; -webkit-transition: all 0.2s ease; }

.link1 { display: inline-block; color: #333333; background-color: #EEEEEE; width: 192px; height: 40px; border-radius: 5px; text-align: center; padding-top: 10px; font-weight:  600; }
.link1:hover { color: white; background-color:#00AD8F; }

.link_white { color: white; }
.link_white:hover { text-decoration: underline; color: white; }

.link25 { display: block; margin-top: 20px; color: #00AD8F; }
.link25:hover { color: #333333; }

/* títulos y texto */ 

p { line-height: 18px; font-weight:  400; margin-bottom: 20px; }
h1 { color: #00AD8F; font-weight: 700; font-size: 40px; margin-bottom: 30px; text-transform: uppercase; }
h2 { color: #00AD8F; font-weight: 700; font-size: 20px; margin-bottom: 10px; text-transform: uppercase; }
strong { font-weight: 700; }

/* colores  */ 

.clr_white { color: white; }
.clr_main { color: #00AD8F; }

/* arreglos  */ 

.pre-load-web { width:100%; height: 100%; width: 100vw; height: 100vh; background-color: white; position:absolute; position:fixed; left:0; top:0; z-index:100000 }
.pre-load-web .imagen-load { left:50%; margin-left: -26px; position:absolute; top: 50%; margin-top: -26px; }

.left { text-align: left; }
.padding { padding: 68px 40px; }
.padding2 { padding: 68px 40px; padding-bottom: 20px; }
.image:hover { opacity: 0.7; }
.center { text-align: center; }

/* estructura  */ 

.main { position: absolute; width: 100%; }
.section { float: left; width: 100%; text-align: center; background-repeat: no-repeat; background-position: center top; }
.cont { margin: 0 auto; width: 100%; max-width: 1000px; display: table; }
.listado { float: left; width: 100%; -ms-display: flex; display: -webkit-flex; display: flex; align-items: flex-start; justify-content:space-between; flex-wrap: wrap; }
.fila { position: relative; float: left; width: 100%; margin-bottom: 20px; }
.ancho { width: 100%; display: block; }

.top { margin-top: 165px; }
.col2 {  -webkit-column-count: 2; -moz-column-count: 2; column-count: 2; -webkit-column-gap: 20px; -moz-column-gap: 20px;  column-gap: 20px; text-align: start; vertical-align: top; }

/* secciones  */ 

.header { position: fixed; width: 100%; border-bottom: 3px solid #00AD8F; background-color: white; z-index: 3000; }
.header_top { float: left; width: 100%; background-color: #EEEEEE; padding: 10px 40px; }
.social { float: left; }
.social li { display: inline-block; margin-right: 20px; }
.lan { float: right; font-size: 11px; }
.logo { float: left; margin: 20px 40px;  }
.nav { float: right; margin-top: 50px; margin-right: 40px; }
.nav li { float: left; margin-left: 20px; color: #00AD8F; }
.nav li a { display:block; padding-bottom: 20px; }
.nav li ul { position: absolute; padding: 10px 0; width: 230px; border-radius: 8px; background-color: #00AD8F; display: none; }
.nav li ul li { margin: 0; width: 100%; display: block; }
.nav li ul li a { display: block;  padding: 10px 30px; padding-right: 0; color: white; }
.nav li ul li a:hover, .select { background-color: #008A72; color: white; }
.arrow { position: absolute; margin-top: -20px; margin-left: 40px; }
.submenu:hover > .nav li ul { display: block; }

.header_small .logo img { width: 120px; }
.header_small .nav { margin-top: 35px; }

.menu, .close { position: fixed; top: 67px; right: -40px; }

/* home  */ 

.slick, .slick div { width: 100%; height: 40vw; overflow: hidden; }
.slick div { background-repeat: no-repeat; background-size: 100% auto; background-position: center bottom; }
.slick div p { position: absolute; width: 850px; left: 50%; margin-left: -425px; margin-top: 70px; z-index: 1000;  }

.titulo1 { background-color: rgba(51,51,51,0.9); color: white; font-size: 50px; padding: 30px 60px; border-radius: 8px; margin-bottom: 20px; margin-top: 10px; font-weight: 600; display: block; line-height: 52px; }
.titulo2 { background-color: white; color: #333; font-size: 30px; padding: 20px 30px; border-radius: 5px; display: inline-block;  font-weight: 600; }

.shadow { display: inline-block; width: 100%; }
.item { display: inline-block; width: 31%; margin-bottom: 40px; vertical-align: top; }
.item_img { position: relative; float: left; width: 100%; height: 200px; overflow: hidden; margin-bottom: 20px; border-radius: 5px; transition: all 0.2s ease; }
.item_img img { width: 100%; }
.fecha { position: absolute; top: 0; width: 120px; background-color: rgba(0,173,143,0.9); color: white; font-size: 18px; font-weight: 700; padding: 5px 0; z-index: 1000; border-radius: 5px; left: 50%; margin-left: -60px; text-align: center; }
.tapa { position: absolute; width: 100%; height: 100%; background-color: rgba(0,173,143,0.9); -ms-display: flex; display: -webkit-flex; display: flex; align-items:center; justify-content: center; display: none; z-index: 1500;  transition: all 0.2s ease;  }
.cruz { position: absolute; background-color: white; height: 77px; width: 77px; border-radius: 50%; color: #00AD8F; font-weight: 700; font-size: 40px; padding-top: 10px; }
.cruz2 { position: absolute; background-color: white; height: 40px; width: 40px; border-radius: 50%; color: #00AD8F; font-weight: 700; font-size: 26px; padding-top: 2px; }

.item_img:hover > .tapa { display: flex; transition: all 0.2s ease; -webkit-transition: all 0.2s ease; }

#banner { background-image: url('imgs/img1.jpg'); background-size: auto 100%; }
.banner { float: left; background-color: rgba(0,173,143,0.9); width: 100%; color: white; }

#map { width: 100%; height: 50vh; }

.atras, .adelante { position: absolute; top: 42%; left: -40px; color: #999999; }
.adelante { left: auto; right: -40px; }

.fila_img { float: left; width: 50%; border-radius: 8px; padding-right: 30px; margin-bottom: 30px; }
.fila_img img { width: 100%; }
.fila_txt { float: right; width: 50%; padding-left: 15px; text-align: left; }
.fila_txt p iframe { width: 100%; }
.col_left { float: left; width: 50%; padding-right: 20px; }
.col_right { float: right; width: 50%; padding-left: 20px; }
input, textarea { width: 100%; border-radius: 5px; height: 40px; padding: 0 15px; color: #333;  margin-bottom: 20px; background-color: #EEEEEE; font-family: 'Open Sans', sans-serif; }
textarea { height: 160px; padding: 15px; }
button { float: right; width: 100%; border: 0; text-align: left; background-color: #00AD8F; color: white; border-radius: 5px; font-weight: 600; padding: 0 15px; height: 40px; cursor: pointer; font-family: 'Open Sans', sans-serif; font-size: 13px; text-align: center; font-size: 15px; }
button:hover { background-color: #333; }

.footer { float: left; width: 100%; background-color: #00AD8F; color: white; }
.footer .cont { -ms-display: flex; display: -webkit-flex; display: flex; align-items: flex-start; justify-content:space-between; vertical-align: top; }
.footer p { line-height: 25px; }
.newsletter { float: left; width: 230px; }
.newsletter input { background-color: transparent; width: 100%; border-radius: 5px; height: 40px; padding: 0 15px; color: white; border: 1px solid white; margin-bottom: 3px; }
.newsletter button { width: 100%; border: 0; text-align: left; background-color: white; color: #00AD8F; border-radius: 5px; font-weight: 600; padding: 0 15px; height: 40px; cursor: pointer; font-family: 'Open Sans', sans-serif; font-size: 13px; }
.newsletter button:hover { background-color: #333; color: white; }

.select-style { padding: 0; margin: 0; width: 100%; height: 40px; border-radius: 5px; overflow: hidden; background-color: #EEEEEE; background: #EEEEEE url("imgs/arrow.gif") no-repeat 96% 50%; margin-bottom: 20px; font-weight: 400; }
.select-style select { padding: 15px; padding-top: 8px; width: 130%; border: none;  box-shadow: none; background-color: transparent; background-image: none;  -webkit-appearance: none; -moz-appearance: none;  appearance: none; font-family: 'Open Sans', sans-serif; font-size: 13px; font-weight: 400; }
.select-style select:focus { outline: none; }

.filtros { float: left; width: 100%; margin-bottom: 40px; }
.filtros .select-style { width: 200px; display: inline-block; margin: 0 5px; }

.sponsor { display: inline-block; margin: 10px; }

.thumb { position: relative; display: inline-block; width: 32%; height: 100px; overflow: hidden; margin-top: 5px; border-radius: 5px; }
.thumb img { height: 100%; }
.thumb:hover > .tapa { display: flex; transition: all 0.2s ease; -webkit-transition: all 0.2s ease; }

.compartir { float: left; margin-top: 20px; text-align: left; }
.compartir li { display: inline-block; margin-right: 10px; }
.imprimir { float: right; margin-top: 20px; text-align: right; }
.imprimir li { display: inline-block; margin-left: 10px; }

.lighbox_main { position: fixed; top: 0; left: 0; width: 100%; height: 100%; background-color: rgba(0,0,0,0.8); display: none; z-index: 5000; }
.lightbox { position: relative; position: absolute; background-color: white; width: 558px; padding: 60px; left: 50%; margin-left: -280px; top: 40px; }
.lightbox .link1 { margin-bottom: 20px; }
.close_lightbox { position: absolute; top: 30px; right: 30px; }

@media (max-width: 900px) {

	body { font-size: 11px; }

	p { line-height: 14px; }
	h1 { font-size: 25px; margin-bottom: 20px; }
	h2 { font-size: 14px; }
	.padding, .padding2 { padding: 30px 20px; }
	.header { border-bottom: 2px solid #00AD8F; transition: all 0.2s ease;  }
	.header_top { padding: 10px 20px; }
	.logo { margin: 20px; }
	.logo img { width: 120px; }
	.lan { font-size: 10px; }
	.nav { width: 100%; margin: 0; padding: 20px; padding-top: 0; display: none; transition: all 0.2s ease; }
	.nav li {  margin: 0; width: 100%; }
	.nav li a { padding-bottom: 10px; }
	.nav li ul li a { padding: 10px 20px; }
	.select2 { padding-bottom: 10px; }

	.top { margin-top: 125px; }
	.social li { margin-right: 10px; }

	.col2 {  -webkit-column-count: 1; -moz-column-count: 1; column-count: 1; -webkit-column-gap: 0; -moz-column-gap: 0; column-gap: 0; text-align: center; }

	.menu { right: 20px; }
	
	.slick div p { width: 100%; left: 0; margin-left: 0; margin-top: 30px; padding: 20px; }
	.titulo1 { font-size: 22px; padding: 10px 20px; line-height: 22px; margin-top: 20px; }
	.titulo2 { font-size: 15px; padding: 10px 20px; }
	.slick div p .link1 { width: 200px; }
	
	.slick, .slick div { height: 65vh; }
	.slick div { background-size: auto 100%; }

	.item { width: 100%; margin-bottom: 20px; }
	.item_img { height: 50vw; margin-bottom: 10px; } 
	.fecha { font-size: 13px; }
	.cruz { height: 50px; width: 50px; font-size: 20px; padding-top: 12px; }

	.footer .cont { display: block; text-align: center; }  
	.footer .cont .col { float: left; width: 100%; }
	.newsletter { width: 100%; margin-top: 10px; }
	
	.link1 { padding-top: 12px; width: 100%; } 
	.fila_img, .fila_txt, .col_left, .col_right { width: 100%; padding: 0; margin: 0; }	
	.fila_img { margin-bottom: 10px; }		
	input, textarea { margin-bottom: 10px; } 
	textarea { height: 80px; }	
	
	.filtros .select-style { width: 100%; display: inline-block; margin: 0; margin-bottom: 10px; }

	.lightbox .link1 { margin-bottom: 10px; }
	.lightbox { width: 90%; margin: 0; margin-left: 5%; top: 5%; left: 0; padding: 20px; } 
}