@charset "utf-8";
/* CSS Document */
/* RESET */
html,
body,h1 {
	margin: 0;
	padding: 0;
	font-size: 100%;
	font-family: inherit;
	line-height: inherit;
	background-color:#000;
}
ol,ul{
	list-style: none;
}
img {
	border:none;
	}
/*END RESET*/
body {
	font-family:'Roboto Condensed', sans-serif;
}
#menutop {
	width:100%;
	height:100px;
	background-color:#000;
	position:fixed;
	z-index:999;
}
#menu {
	width:65%;
	height: 100px;
	font-weight:400;
	font-size:16px;
	position:relative;
	left: 15%;
	}
ul {
	list-style-type:none;
	margin:0;
	padding:0;
	float:right;
}
li {
	display:inline;
	float: left;
	text-transform:uppercase;
}
li a {
	display:block;
	height: 100px;
	padding-left: 20px;
	padding-right: 20px;
	text-align: center;
	line-height: 100px;
	color: #fff;
	text-decoration: none;
}
li a:hover {
	color: #00a0c8;
	text-decoration: none;
}
.interior {
	clear:both;
	margin: 0 auto;
	height:auto;
	max-width:1000px;
}
.interiormenu {
	clear:both;
	margin: 0 auto;
	height:auto;
	max-width:1000px;
	height:100px;
	text-align:right;
	clear:both;
}
.interiorcabecera {
	clear:both;
	margin: 0 auto;
	height:500px;
	max-width:1000px;
	clear:both;
	background-image:url(../images/seo.jpg);
}
.interiorgray {
	clear:both;
	margin: 0 auto;
	max-width:1000px;
	background: #CCC;
	height:300px;
}
.interiorcyan {
	clear:both;
	margin: 0 auto;
	max-width:1000px;
	background: #00a0c8;
	height:300px;
}
.interiorfooter {
	margin: 0 auto;
	max-width:1000px;
	background: #00a0c8;
	height:100px;
}
.logo {
	float:left;
	display:block;
	position:relative;
}
#cabecera {
	width:100%;
	height:500px;
	left:0px;
	top: 100px;
	position: absolute;
	margin: 0 auto;
	text-align:center;
}
.imainteriorleft{
	float:left;
	width: 30%;
	margin-left:15%;
  	margin-right: 10%;
}
.imainteriorright{
	float:left;
	width: 30%;
	margin-left:10%;
  	margin-right:15%;
}
.imaprofile{
	width: 60%;
	max-width: 150px;
	margin-top:5%;
}
.textoright{
	display: block;
	width:30%;
	height:auto;
	float:left;
	text-align: justify;
	font-weight: 300;
	font-size:18px;
	color:#000;
}
.textoleft{
	display: block;
	width:30%;
	height:auto;
	float:left;
	margin-left:15%;
	text-align: justify;
	font-weight: 300;
	font-size:18px;
	color:#000;
}
.textcabecera{
	display: block;
	width:428px;
	height:307px;
	background-image:url(../images/cabeceratextofondo.png);
	background-repeat:no-repeat;
	top: 19%;
	left:28%;
	padding-top: 150px;
	padding-left: 10px;
	padding-right: 10px;
	position: relative;
	text-align: center;
	font-weight: 400;
	font-size:18px;
	color:#fff;
}
.imacabecera{
	width:130px;
	height:auto;
	float:left;
	top: 180px;
	left:480px;
	position: relative;
}
/*fin de  cabecera*/
#content {
	height: auto;
	width:100%;
	top:600px;
	position:absolute;
}
#contentinterna {
	height: auto;
	width:100%;
	top:100px;
	position:absolute;
}
/*capacitaciones*/
#contentcap {
	min-height:300px;
	width:100%;
	background:#fff;
	left:0px;
	margin: 0 auto;
	}
.titularcap {
	margin: 0 auto;
	display: block;
	text-align:center;
	font-size:36px;
	font-weight: 600;
	margin-bottom: 20px;
	padding-top: 20px;
}
.titularcapblue{
	font-weight: 600;
	font-size:36px;
	color: #00a0c8;
	}
.piccap{
	width:20%;
	height:auto;
	margin-left:4%;
}
/*contenido0*/
#content0 {
	height:300px;
	width:100%;
	left:0px;
	margin: 0 auto;
}
.pic {
	height:400px;
	width:100%;
	margin: 0 auto;
	text-align:center;
}
.pic1 {
	height:250px;
	width:100%;
	margin: 0 auto;
	text-align:center;
}
.picnosotros {
	height:200px;
	width:1000px;
	margin: 0 auto;
	background-image: url(../images/training1.png);
	background-repeat:no-repeat;
	text-align:center;
}
.picnosotros2 {
	clear:both;
	height:200px;
	width:1000px;
	margin: 0 auto;
	background-image: url(../images/training2.png);
	background-repeat:no-repeat;
	text-align:center;
}
.picfull{
	width:1000px;
	height:400px;
}
.picfull1{
	width:1000px;
	height:250px;
}
.piccolor{
	width:24%;
	height:auto;
	margin: 0 auto;
}
/*por que training comercial*/
.boxcontent {
	display: block;
	position:relative;
	width:20%;
	height:auto;
	float:left;
	font-size:16px;
	text-align:center;
	color: #666;
	padding-left:4%;	
	}
.profcontent {
	display: block;
	position:relative;
	width:27%;
	height:auto;
	float:left;
	font-size:16px;
	text-align:center;
	color: #666;
	padding-left:4%;	
	}
.bluetitle {
	color: #00a0c8;
	font-size:24px;
	}
.whitetitle {
	color: #FFF;
	font-size:24px;
	}
/*contenido1*/
#content1 {
	height:383px;
	width:100%;
	margin: 0 auto;
}
.contentpicleft {
	height:auto;
	width:45%;
	float:left;
	}
.contenttextright {
	margin-top:15px;
	display: block;
	position:relative;
	width:45%;
	height:auto;
	float:right;
	text-align: left;
	color: #666;
}
.contentpicright {
	height:auto;
	width:45%;
	float:right;
	}
.contenttextleft {
	margin-top:15px;
	display: block;
	position:relative;
	width:47%;
	height:auto;
	float:left;
	text-align: left;
	color: #666;
	margin-left: 2%;
}
.contenttextleft1 {
	margin-top:50px;
	display: block;
	position:relative;
	width:47%;
	height:auto;
	float:left;
	text-align: center;
	color: #000;
	font-size:14px;	
	margin-left: 2%;
}
.contenttextleft2 {
	margin-top:45px;
	display: block;
	position:relative;
	width:20%;
	height:auto;
	float:right;
	text-align: center;
	color: #fff;
	font-size: 14px;
	margin-right: 25%;
}
.contenttextleftblue {
	margin-top:10px;
	display: block;
	position:relative;
	width:47%;
	height:auto;
	float:left;
	text-align: left;
	color: #666;
	margin-left: 2%;
}
.contentleftwhite {
	margin-top:15px;
	display: block;
	position:relative;
	width:47%;
	height:auto;
	float:left;
	text-align: left;
	color: #fff;
	margin-left:2%;
}
.contenttextright2 {
	margin-top:50px;
	display: block;
	position:relative;
	width:20%;
	height:auto;
	float:right;
	text-align: center;
	color: #000;
	font-size:14px;	
	margin-right: 2%;
}
/*contenido2*/
#content2 {
	height:300px;
	width:100%;
	margin: 0 auto;
}
/*contenido3*/
#content3 {
	height:300px;
	width:100%;
	margin: 0 auto;
}
/*contenido4*/
#content4 {
	height:300px;
	width:100%;
	margin: 0 auto;
}
/*contenido5*/
#content5 {
	height:300px;
	width:100%;
	background: #FFF;
	margin: 0 auto;
}
/*nosotros*/
#nosotros {
	height:auto;
	width:100%;
	background: #FFF;
	margin: 0 auto;
}
/*equipo*/
#equipo {
	height:300px;
	width:100%;
	background: #FFF;
	margin: 0 auto;
}
#footer {
	clear:both;
	height:100px;
	width: 100%;
	text-align:center;
}
.face {
	display: block;
	width: 10px;
	height: 10px;
	position: fixed;
	left:32%;
	}
.instagram {
	display:block;
	width:25px;
	height:25px;
	position: fixed;
	left: 41%;
	}
.google {
	display:block;
	width:25px;
	height:25px;
	position: fixed;
	left: 50%;
	}
.google img {
	width: 150%;
	height:auto;
	}
	
.tube {
	display:block;
	width:25px;
	height:25px;
	position: fixed;
	left: 58%;
	}
.llamar {
	display:block;
	width:25px;
	height:25px;
	position: fixed;
	left: 66%;
	}
#socialinferior {
	height: 42px;
	width: 100%;
	z-index: 99999;
	position:fixed;
	bottom: 0;
	}
.textfootsmall {
	padding-top:20px;
	color: #fff;
	font-size:16px;
	font-weight:300;
	}
.textfootsmall a{
	font-weight:400;
	text-decoration: none;
	color: #fff;
	}
.textfootsmall a:hover{
	text-decoration: none;
	color: #CCC;
	}

.overlay{
     display: none;
     position: fixed;
     top: 0;
     left: 0;
     width: 100%;
     height: 100%;
     background: #000;
     z-index:1001;
     opacity:.75;
     -moz-opacity: 0.75;
     filter: alpha(opacity=75);
}
.modal {
     display: none;
     position: fixed;
     top: 25%;
     left: 42%;
     width: 14%;
	 min-width: 150px;
     height: 60%;
     background: #000;
     color: #00a0c6;
     z-index:1002;
	 border: #FFF solid 10px;
	 padding-right: 60px;
}
.modal a{
	text-decoration:none;
	color:#FFF;
	float:right;
}
.modal a:hover{
	text-decoration:none;
	color:#00a0c6;
}
.formularioflotante {
     display: block;
     position: fixed;
     top: 2%;
     left: 80%;
     width: 14%;
	 min-width: 150px;
     height: 60%;
     background: #F60;
     color: #fff;
     z-index:1005;
	 border: #FFF solid 10px;
	 padding-right: 60px;
}
.formularioflotante a{
	text-decoration:none;
	color:#FFF;
	float:right;
}
.formularioflotante a:hover{
	text-decoration:none;
	color:#00a0c6;
}
#rich {
	clear:both;
	height:100px;
	width: 100%;
	text-align:center;
	padding-bottom: 50px;
	background-color:#000;
	color:#FFF;
	font-size:18px;
}
[itemprop="name"] {
	color:#00C1EE;
	line-height: 3em;
}
/*metricas*/
#metricasheader {
	width:100%;
	max-height: 625px;
	margin: 0 auto;
}
#metricasbanner {
	width:100%;
	max-height: 390px;
	margin: 0 auto;
}
#metricasvideo {
	width:100%;
	margin: 0 auto;
}
#metricastaller {
	height:auto;
	width:100%;
	margin: 0 auto;
}
.interiorvideo {
	margin: 0 auto;
	max-height: 720px;
	max-width:1000px;
	overflow:hidden;
	background-color:#bf0020;
}
.interiormetricasrojo {
	margin: 0 auto;
	max-width:1000px;
	color: #FFF;
	background-color: #bf0020;
	padding-top: 2%;
}
.titulotaller {
	max-width:40%;
	font-size:54px;
	font-weight:900;
	padding-left: 15%;
}
.contenidotaller {
	clear:both;
	height: auto;
	max-width:28%;
	font-size:18px;
	font-weight:300;
	padding-left: 15%;
	padding-top: 0;
	float:left;
}
.contenidotaller2 {
	height: auto;
	max-width:28%;
	font-size:18px;
	font-weight:300;
	padding-left: 5%;
	padding-top: 0;
	float:left;
}
#metricaspensum{
	width:100%;
	height:auto;
}
.interiormetricasazul {
	max-width:1000px;
	color: #FFF;
	background-color: #1066d0;
	margin: 0 auto;
	height:1150px;
}
.contenidopensum {
	max-width:40%;
	float:left;
	padding-bottom: 3%;
	padding-left: 2%;
	padding-top: 4%;
}
.titulopensum {
	font-size:28px;
	font-weight:700;
}
.textopensum {
	height: auto;
	font-size:18px;
	font-weight:300;
	line-height: 30px;
}
.pictallerhorario {
	max-width:10%;
	padding-left: 15%;
	padding-top: -5%;
}
.pictallerinscripcion {
	min-width:10%;
	padding-left: 10%;
	padding-top: 2%;
}
.pictallerinscripcionright {
	min-width:10%;
	padding-left: 60%;
	padding-top: 2%;
}
.pictallerm {
	max-width:10%;
	float: left;
	padding-top: 5%;
	padding-left: 15%;
	padding-top: -5%;
}
/*mapas*/
#mapas {
	height:400px;
	width:100%;
	margin: 0 auto;

}
.mapacontactos iframe {
    width: 45%;
    height: 400px;
	float:left;
	padding-left:3%;
	}
.interiormapas {
	clear:both;
	margin: 0 auto;
	height:400px;
	max-width:1000px;
	background-color: #C06;
}
.cabeceragracias {
	clear:both;
	margin: 0 auto;
	height:500px;
	max-width:1000px;
	clear:both;
	background-image:url(../images/seo.jpg);
}
.textgracias{
	display: block;
	width:600px;
	height:400px;
	background-image:url(../images/cabeceragracias.png);
	background-repeat:no-repeat;
	top: 10%;
	left:20%;
	padding-top: 210px;
	padding-left: 10px;
	padding-right: 10px;
	position: relative;
	text-align: center;
	font-weight: 400;
	font-size:21px;
	color:#fff;
}


	/* para iphone 640px o menos */
	@media screen and (max-width:768px) {		
			#menutop {
				height:120px;
			}
			#menu {
				width:30%;
				height: 120px;
				left: 3%;
				}
			ul {
				float:left;
				top:15px;
			}
			li {
				display:inline;
				float: left;
				text-transform:uppercase;
			}
			li a {
				display:block;
				height: 30px;
				padding-left: 5px;
				line-height: 30px;
				color: #fff;
				text-decoration: none;
				border-left:#FFF solid;
			}
			li a:hover {
				color: #00a0c8;
				text-decoration: none;
				border-left:#00a0c8 solid;
			}
			.formularioflotante {
				 top: 30%;
				 left: 25%;
				 width: 40%;
				 min-width: 180px;
				 height: 55%;
				 background: #F60;
				 color: #fff;
				 z-index:1005;
				 border: #FFF solid 10px;
				 padding-left: 40px;
				 font-size:12px;
			}
			.formularioflotante a{
				text-decoration:none;
				color:#FFF;
				float:right;
			}
			.formularioflotante a:hover{
				text-decoration:none;
				color:#00a0c6;
			}			
			
			#cabecera {
				top: 120px;
			}
			.textcabecera{
				top: 19%;
				left:17%;
				padding-top: 150px;
				padding-left: 10px;
				padding-right: 10px;
			}
			.piccap{
				width:45%;
				height:auto;
				margin-left:4%;
				margin-top:1%;
			}
			.modal {
				 top: 30%;
				 left: 25%;
				 width: 40%;
				 min-width: 180px;
				 height: 55%;
				 background: #000;
				 color: #fff;
				 z-index:1005;
				 border: #FFF solid 10px;
				 padding-left: 40px;
				 font-size:12px;
			}
			.modal a{
				text-decoration:none;
				color:#FFF;
				float:right;
			}
			.modal a:hover{
				text-decoration:none;
				color:#00a0c6;
			}
			#contentcap {
				height:auto;
				width:100%;
				background:#fff;
				left:0px;
				margin: 0 auto;
				}
			.titularcap {
				margin: 0 auto;
				display: block;
				text-align:center;
				font-size:28px;
				font-weight: 600;
				margin-bottom: 20px;
				padding-top: 20px;
			}
			.titularcapblue{
				font-weight: 600;
				font-size:28px;
				color: #00a0c8;
				}
			.boxcontent {
				font-size:12px;
				}
			.profcontent {
				font-size:12px;
				}
			.bluetitle {
				color: #00a0c8;
				font-size:18px;
				}
			.whitetitle {
				color: #FFF;
				font-size:18px;
				}
			#content0 {
				height:200px;
			}
			.pic {
				height:200px;
			}
			.pic1 {
				height:200px;
			}
			#content1 {
				height:200px;
				border-top: #F60 solid 5px;
			}				
			.contentpicleft {
				width: 70%;
				padding-left: 15%;
				padding-top: 2%;
			}
			.contenttextright {
				width:95%;
				float:left;
				padding-left: 15px;
			}
			.contentpicright {
				width: 70%;
				padding-left: 15%;
				padding-top: 2%;
				float:left;
			}	
			.contenttextleft{
				width:95%;
				padding-left: 15px;
			}
			.contenttextleftblue {
				width:95%;
			}
			.interiorgray {
				height: 523px;
			}
			#content2 {
				height: 523px;
				position: relative;
			}			
			#content3 {
				height:523px;
				position: relative;
			}
	
			#content4 {
				height:526px;
				position:relative;
			}
			.interiorcyan {
				height: 526px;
			}
			.contentleftwhite {
				width:95%;
			}
			.picnosotros {
				height:182px;
				width:100%;
				background-image: url(../images/training640_2.png);
				background-size: 100%;
				overflow: hidden;
			}
			.picnosotros2 {
				height:182px;
				width:100%;
				background-image: url(../images/training640_1.png);
				background-size: 100%;
				overflow: hidden;
			}	
			.contenttextleft1 {
				margin-top:20px;
				position:relative;
				width:25%;
				height:auto;
				float:left;
				text-align: center;
				color: #000;
				font-size:14px;	
				margin-left: 4%;
			}
			.contenttextleft2 {
				margin-top:35px;
				display: block;
				position:relative;
				width:25%;
				height:auto;
				float:right;
				text-align: center;
				color: #fff;
				font-size: 14px;
				margin-right: 35%;
			}
			.contenttextright2 {
				margin-top:35px;
				width:25%;
				font-size:14px;	
				margin-right: 3%;
			}
			#intro img {
				padding-left: 23%;
			}
			.face {
				left:25%;
				}
			.instagram {
				left: 38%;
				}
			.google {
				left: 50%;
				}
			.tube {
				left: 62%;
				}
			.llamar {
				left: 75%;
				}
			#socialinferior {
				height: 42px;
				width: 100%;
				z-index: 99999;
				position:fixed;
				bottom: 0;
				}	
			.interiormetricasazul {
				height: 810px;
			}			
			.pictallerinscripcionright{
				width: 50%;
				float:right;
				padding: 1%;
				}
			.titulotaller{
				font-size:21px;
				padding-left: 10%;
				}
			.contenidotaller{
				width: 80%;
				max-width:100%;
				padding-left: 10%;
				}
			.contenidotaller2{
				width: 80%;
				max-width:100%;
				padding-left: 10%;
				}
			.pictallerinscripcion{
				width: 50%;
				}
			.pictallerm {
				padding-left: 5%;
				padding-top:8%;
				
				}
			#metricasheader{
			}
			.contenidopensum {
				max-width:70%;
				float:left;
				padding: 1%
			}
			.titulopensum {
				font-size:21px;
			}
			.textopensum {
				font-size:18px;
				line-height: 25px;
			}
			#mapas {
				height:300px;
			}
			.mapacontactos iframe {
				height: 300px;
				}
			.interiormapas {
				height:300px;
			}
	}
	
	/* para 480px o menos */
	@media screen and (max-width:480px) {		
			.logo{
			width: 45%;	
			}
			.logo img{
			width: 100%;
			padding-top: 5%;
			}
			#menu {
				width:50%;
				font-size:15px;
				}
			.formularioflotante {
				 top: 25%;
				 left: 10%;
				 width: 40%;
				 min-width: 100px;
				 height: 60%;
				 padding-left: 10%;
				 font-size:12px;
			}
			.textcabecera{
				top: 10%;
				left:0%;
				padding-top: 140px;
				padding-left: 0;
				padding-right: 0;
				width:100%;
				background-image:url(../images/cabeceratextofondo.png);
				background-size: 100%;
				font-size:16px;
			}
			.piccap{
				width:45%;
				height:auto;
				margin-left:3%;
				margin-top:1%;
			}
			.interiormetricasazul {
				height: 720px;
			}			
			.pictallerinscripcionright{
				width: 50%;
				float:right;
				padding: 1%;
				}
			.titulotaller{
				font-size:21px;
				padding-left: 10%;
				}
			.contenidotaller{
				width: 80%;
				max-width:100%;
				padding-left: 10%;
				}
			.contenidotaller2{
				width: 80%;
				max-width:100%;
				padding-left: 10%;
				}
			.pictallerinscripcion{
				width: 50%;
				}
			.pictallerm {
				padding-left: 5%;
				padding-top:8%;				
				}
			#metricasheader{
			}
			.contenidopensum {
				max-width:70%;
				float:left;
				padding: 1%
			}
			.titulopensum {
				font-size:21px;
			}
			.textopensum {
				font-size:18px;
				line-height: 25px;
			}

			.modal {
				 top: 15%;
				 left: 15%;
				 min-width: 200px;
				 height: 65%;
				 padding-left: 40px;
				 font-size:14px;
			}
			
			#contentcap {
				height:auto;
				width:100%;
				background:#fff;
				left:0px;
				margin: 0 auto;
				}
			#content1 {
				height:200px;
				border-top: #F60 solid 5px;
			}				
			.contentpicleft {
				width: 85%;
				padding-left: 7%;
				padding-top: 1%;
			}
			.contenttextright {
				width:90%;
				float:left;
				padding-left: 10px;
			}
			.contentpicright {
				width: 85%;
				padding-left: 7%;
				padding-top: 1%;
			}	
			.contenttextleft{
				width:90%;
				padding-left: 10px;
			}
			.picnosotros {
				float:left;
				width: 100%;
				height:auto;
				background-image: url(../images/training480_2.png);
				background-size: 100%;
			}
			.picnosotros2 {
				float:left;
				width: 100%;
				height:auto;
				background-image: url(../images/training480_1.png);
				background-size: 100%;
				top: 0;
			}	
			.contenttextleft1 {
				margin-top:5px;
				font-size:12px;	
			}
			.contenttextleft2 {
				margin-top:10px;
				font-size: 12px;
			}
			.contenttextright2 {
				margin-top:15px;
				font-size:12px;	
			}
			#intro img {
				padding-left: 12%;
			}
			.face {
				left:15%;
				}
			.instagram {
				left: 30%;
				}
			.google {
				left: 45%;
				}
			.tube {
				left: 60%;
				}
			.llamar {
				left: 75%;
				}
	}
	@media screen and (max-width:320px) {	
	.logo{
		width: 45%;	
		}
	.logo img{
		width: 100%;
		padding-top: 20%;
		}
	#menu {
				width:55%;
				font-size:12px;
				}
			ol img{
				display: none;
				}
			.formularioflotante {
				 top: 25%;
				 left: 10%;
				 width: 40%;
				 min-width: 100px;
				 height: 60%;
				 padding-left: 10%;
				 font-size:12px;
			}


			.interiorcabecera {
					height:300px;
			}	
			.textcabecera{
				top: 10%;
				left:0%;
				padding-top: 100px;
				padding-left: 0;
				padding-right: 0;
				width:100%;
				background-image:url(../images/cabeceratextofondo.png);
				background-size: 100%;
				font-size:14px;
			}
			#content {
			top:400px;
			}
			#intro{
				width: 90%;	
				}
			#intro img{
				width: 90%;
				}
			.modal {
				 top: 15%;
				 left: 15%;
				 min-width: 200px;
				 height: 65%;
				 padding-left: 40px;
				 font-size:14px;
			}
			.boxcontent{
				width: 80%;
				padding:0 10%;
				}
			#content1 {
				margin-top: 200px;
				border-top: none;
			}	
			.contenttextright2{
				display: none;
				}	
			.contenttextleft1{
				margin-left: 5%;	
				width: 35%;			
				}				
			.contenttextleft2{
				margin-right: 5%;	
				width: 35%;			
				}	
			#mapas {
				height:400px;
			}
			.mapacontactos iframe {
				height: 200px;
				width: 90%;
				float: none;
				}
			.interiormapas {
				height:400px;
			}
			.pictallerm {
				padding-left: 5%;
				padding-top:12%;				
			}	
			#rich {
				height:200px;
			}
			.picnosotros {
				background-size: 150%;
			}
	
	}