@import url(https://fonts.googleapis.com/css?family=Maven+Pro:400,500,700|Reenie+Beanie|Buda:300);

/* Hacks para mejorar la compatibilidad con diferentes dispositivos */

html { -webkit-text-size-adjust: none; } /* Ajuste de texto para iPhone */
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section { display: block; } /* Reset de los nuevos tags HTML5 */
img {	max-width: 100%; height: auto; width: auto\9; border:0; } /* Internet Explorer 8 */

/* Base RWD */

div.principal { margin: 0 auto; width: 1140px; }

div.rwd_col1 { float: left; width: 25%; }
div.rwd_col2 { float: left; width: 50%; }
div.rwd_col3 { float: left; width: 75%; }
div.rwd_colunotres { float: left; width: 33.3%; }
div.rwd_coldostres { float: left; width: 66.6%; }

.reset { clear: both }

/* Estilos */

body, html { margin: 0; padding: 0 }
body { background-color: #333; background-image:url(images/bkgd.png); }
a:link { color: #008C68; text-decoration:none }

h1, h2, h3  { margin: 0; padding: 0; font-weight: normal }

.Centrar 	{ text-align: center }
.Derecha 	{ text-align: right }


div.Cab { background-image:url(images/bkgdTop.png); background-repeat:repeat-x; height:200px; position:fixed; width:100%;  z-index:1000}
div.menu { height:45px; }
div.Rutas { min-height:270px; }
div.Transfomaciones { min-height:355px; background-image:url(images/bkgdTransformaciones.png); background-repeat:repeat; border-bottom:#333; border-bottom-style:solid; border-bottom-width:1px; }
div.Responsabilidad { min-height:355px; background-image:url(images/bkgdResponSoc.png); background-repeat:repeat; border-bottom:#333; border-bottom-style:solid; border-bottom-width:1px; }
div.Sostenibilidad { min-height:355px; background-image:url(images/bkgdSostenibilidad.png); background-repeat:repeat; border-bottom:#333; border-bottom-style:solid; border-bottom-width:1px; }
div.Investigacion { min-height:355px; background-image:url(images/bkgdInvestigacion.png); background-repeat:repeat; border-bottom:#333; border-bottom-style:solid; border-bottom-width:1px; }
div.CulturaOrg { min-height:355px; background-image:url(images/bkgdCultOrg.png); background-repeat:repeat; border-bottom:#333; border-bottom-style:solid; border-bottom-width:1px; }
div.Puertos1 { height:238px; background-image:url(images/bkgdOlasT.png); background-repeat:repeat-x; }
div.Puertos2 { min-height:343px; background-image:url(images/bkgdOlasB.png); background-repeat:repeat-x }
div.Puertos3 { height:8px; background-image:url(images/bkgdOlasB.png); background-repeat:repeat-x;}
div.Tripulantes1 { min-height:185px; }
div.Tripulantes2 { background-image:url(images/grupoItacas.jpg); background-position:center center; height:870px; -webkit-box-shadow: 0px 5px 5px 0px rgba(0, 0, 0, 0.55); -moz-box-shadow: 0px 5px 5px 0px rgba(0, 0, 0, 0.55); box-shadow: 0px 5px 5px 0px rgba(0, 0, 0, 0.55);  }
div.Hoja { background-image:url(images/hojaRayas.png); -webkit-border-radius: 10px; -moz-border-radius: 10px; border-radius: 10px; padding:10px; }
div.Equipaje1 { min-height:185px; }
div.PuntosExpT { background-image:url(images/puntosExpT.png); height:3px;}
div.Experiencia { background-image:url(images/bkgdExperiencia.png); min-height:860px;}
div.PuntosExpB { background-image:url(images/puntosExpB.png); height:3px;}
div.Equipaje { background-color:#FFF; position:relative; -webkit-border-radius: 10px; -moz-border-radius: 10px; border-radius: 10px; padding:20px; margin:20px; min-height:180px; }
div.IcoEquipaje { position:absolute; top:-40px; left:40px; width:116px; height:99px; }
div.IcoOjo { position:absolute; top:-40px; left:220px; width:89px; height:86px; }
div.IcoGente { position:absolute; top:-20px; left:310px; width:137px; height:60px; }
div.IcoTiro { position:absolute; top:-40px; left:40px; width:121px; height:86px; }
div.IcoConjunto { position:absolute; top:-60px; left:120px; width:147px; height:116px; }
div.IcoHoja { position:absolute; top:-50px; left:300px; width:99px; height:92px; }
div.Sello { min-height:260px; }
div.ContactoBorde { background-image:url(images/bordeContacto.png); height:30px; }
div.Contacto { min-height:450px; background-color:#00BFD2;  box-shadow: 0px 5px 5px 0px rgba(0, 0, 0, 0.55); }


.Menu { color: #FFF; font-family: 'Maven Pro', sans-serif; font-size: 24px; letter-spacing:-1px; line-height: 25px ; font-weight:400; text-shadow: 2px 2px 2px rgba(150, 150, 150, 1); }
.Menu a { color: #FFF; text-decoration: none }
.Menu a:hover { color:#369; text-decoration: underline }

.sepMenu { color: #FFF; font-family: 'Maven Pro', sans-serif; font-size: 20px;  line-height: 30px ; font-weight:400; padding-left:10px; padding-right:10px; }

.fraseTop { font-family: 'Buda', sans-serif; font-size:35px; color:#FFF; }
.frase { font-family: 'Reenie Beanie', cursive; color:#FFF; font-size:35px; text-shadow: 2px 2px 2px rgba(0, 0, 0, 1); }
.titPpal { font-family: 'Maven Pro', sans-serif; color:#00BFD2; font-weight:500; font-size:50px; text-shadow: 2px 2px 2px rgba(0, 0, 0, 1); }
.subTit1 { font-family: 'Maven Pro', sans-serif; color:#F3ECE2; font-weight:500; font-size:55px; text-shadow: 2px 2px 2px rgba(0, 0, 0, 1); letter-spacing:-1px; }
.subTit2 { font-family: 'Maven Pro', sans-serif; color:#666666; font-weight:500; font-size:55px; text-shadow: 2px 2px 2px rgba(150, 150, 150, 1); letter-spacing:-1px; }

.txtBlanco { font-family: 'Maven Pro', sans-serif; color:#FFF; font-weight:400; font-size:35px; line-height:40px; letter-spacing:-1px; }
.txtGris { font-family: 'Maven Pro', sans-serif; color:#333; font-weight:400; font-size:35px; line-height:40px; letter-spacing:-1px; }
.nombres { font-family: 'Reenie Beanie', cursive; color:#333; font-size:50px; letter-spacing:-2px; line-height:45px;}
.bio { font-family: 'Maven Pro', sans-serif; color:#333; font-weight:400; font-size:20px; line-height:20px; }
.experiencia { font-family: 'Reenie Beanie', cursive; color:#FFF; font-size:50px; letter-spacing:-2px; line-height:50px;}
.txtExperiencia { font-family: 'Maven Pro', sans-serif; color:#877656; font-weight:400; font-size:25px; line-height:25px; letter-spacing:-1px; }
.txtExperienciaC { font-family: 'Maven Pro', sans-serif; color:#877656; font-weight:400; font-size:25px; line-height:25px; letter-spacing:-2px; }
.txtAzul { font-family: 'Maven Pro', sans-serif; color:#00BFD2; font-weight:400; font-size:35px; line-height:40px; letter-spacing:-1px; text-shadow: 2px 2px 2px rgba(0, 0, 0, 1); }
.titBlanco { font-family: 'Maven Pro', sans-serif; color:#FFF; font-weight:500; font-size:50px; text-shadow: 2px 2px 2px rgba(0, 0, 0, 1); }
.txtContacto { font-family: 'Maven Pro', sans-serif; color:#FFF; font-weight:500; font-size:25px; line-height:25px; text-shadow: 1px 1px 1px rgba(0, 0, 0, 1); }
.txtCamContacto { font-family: 'Maven Pro', sans-serif; color:#333; font-weight:400; font-size:25px; line-height:25px;}
.Campo { margin: 5px; padding: 5px; border: 1px dotted #00BFD2; font-family: 'Buda', sans-serif; font-size:20px; color:#333; -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px; box-shadow: 2px 2px 2px 2px rgba(0, 0, 0, 0.55); width:90%; }
.botonCampo { background-color:#369; margin: 5px; padding: 5px; font-family: 'Buda', sans-serif; font-size:20px; color:#FFF; -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px; box-shadow: 2px 2px 2px 2px rgba(0, 0, 0, 0.55); }
.txtPie { font-family: 'Maven Pro', sans-serif; color:#FFF; font-weight:700; font-size:20px; line-height:25px;}
.txtPie a { color: #FFF; text-decoration: none }
.txtPie a:hover { color:#00BFD2; text-decoration: underline }







/* Media Query */
@media screen and (max-width: 1140px) {
  embed, iframe, object, video { height: auto; max-width: 100% !important; width: auto; }
  img {	height: auto; max-width: 100%; width: auto\9; }
  div.principal { width: 98%; }

}

@media screen and (max-width: 768px) {
  div.rwd_col1 { width: 50%; }
  div.rwd_col2 { width: 100%; }
  div.rwd_col3 { width: 50%; }
  div.rwd_colunotres { width: 100%; }
  div.rwd_coldostres { width: 100%; }
  
  div.Hoja {width: 90%}
  
  .Menu { color: #FFF; font-family: 'Maven Pro', sans-serif; font-size: 20px; letter-spacing:-1px; line-height: 20px ; font-weight:400; text-shadow: 2px 2px 2px rgba(150, 150, 150, 1); }
  .nombres { font-size:35px;}
  .fraseTop { font-size:25px; }
  
}

@media screen and (max-width: 360px) {
  div.rwd_col1 { float: none; width: 100%; }
  div.rwd_col2 { float: none; width: 100%; }
  div.rwd_col3 { float: none; width: 100%; }	
}