
@charset "utf-8";
/* CSS Document */
@font-face
{
 font-family:"Gravity Book";
 src:url(../pictures/font/Gravity-Book.ttf);
}
@font-face
{
 font-family:"Gravity Light";
 src:url(../pictures/font/Gravity-Light.ttf);
}

@font-face
{
 font-family:"Comfortaa Regular";
 src:url(../pictures/font/Comfortaa-Regular.ttf);
}

body
{
 font-family:"Gravity Book";
}
*{
	margin: 0;
	padding: 0;
}
	dl{ width: 60px; float:left;}
		dt, dd{ padding:5px 0px;  color:#fff;}
		dt{ background: #1B1B20; color:#fff; cursor: pointer; }
		dd{ background: #1B1B20; display: none; line-height: 1.6em;  }
		dt.activo, dt:hover{ background: #1B1B20;  }

		dt:before{ content: ""; margin-right: 10px;}
		dt.activo:before{ content: ""; font-family:"Neutra Text Alt"; }
		.li{ width:100%; height:50px; background:#1B1B20;}
		.la{ font-size:16px; color:#FFF; margin-top:17px; text-align:center;} 
.le{ font-size:16px; color:#FFF; text-align:center; margin-top:17px; text-decoration:none;} 
.mundo{ float:left; margin-top:5px; margin-left:20px;}
.cinta{ margin-left:210px; margin-top:-50px; color:#fff;}
.mundo1{ width:230px; margin-left:205px; margin-top:-37px; background:#1B1B20;}
.cinta1{ width:70px; background:#1B1B20; margin-left:152px; padding:5px 5px; text-decoration:none;}

.lc{margin-left:25px;}
.spanish{text-decoration:none; color:#FFF;}
.logo{width:200px; height:70px; max-width:100%;}
.ima{width:1350px; height:575px;}
.back{ background:#343F45;}
.icono{width:20px; height:20px;}
.inicio{color:#FFF;}
.txt{ text-align:justify; color:#000;}
.pictures{width:570px; height:360px; padding:15px 15px; max-width:100%; max-height:100%;}
.vision{font-size:22px;}
.products{padding:20px 130px; color:#8C8C8D; font-size:25px;}
.viñeta{width:7px; height:7px;}
.tab{margin-left:45px;}
.contact{padding:20px 120px; color:#8C8C8D; font-size:25px;}
.servicios{padding:20px 130px; color:#8C8C8D; font-size:25px;}

*{margin:0; padding:0;}

.contenedor {
	width: 100%;
	margin:auto;
}
header{ width:100%; height:auto; background:#000;}
 

 
header nav {
	background:#000;
	margin-bottom:0px;
}
 
header nav ul {
	list-style: none;
	overflow: hidden;
}
 
header nav ul li {
	float: left;
}
 
header nav ul li a {
	display: block;
	padding:35px 13px;
	color:#fff;
	text-decoration: none;
	font-size:16px;
}
.wrapperbanner {
	width:100%;
	max-width:1000px;
	margin:auto;
	overflow:hidden;
	margin-right:80px;
}


.img{
	margin-left:25px;
	}
 
 
/* --- Clase que agregaremos cuando el usuario haga scroll --- */
.menu-fixed {
	position:fixed;
	z-index:1000;
	top:0;
	width:100%;
}
.wrapper {
	width:100%;
	max-width:1200px;
	margin:auto;
	overflow:hidden;
}

#espacio{
	width:100%;
	height:auto;
}
.texto{
	width:100%;
	height:auto;
}

#cuerpoprincipal{
	width:100%;
	height:auto;
	background:#1D1D1D;
}

.wrapper2 {
	width:100%;
	max-width:1350px;
	margin:auto;
	overflow:hidden;
}
td{
	color:#FFF;
}
.lado1{
	width:25%;
	height:auto;
	float:left;
	position:static;

	}
.lado2{
	width:40%;
	height:auto;
	margin:auto;
	
	}
.lado3{
	width:35%;
	height:auto;
	float:right;
	position:static;

	}
#cuadrado{
	width:80px;
	height:120px;
	display:inline-block;
	max-width:100%;
}
#imagen{
	display:inline-block;
	background-image:url(../pictures/iconos/CIRCULO-01.png);
	width:70px;
	height:95px;
	position:absolute;
	overflow:hidden;
	max-width:100%;
	;}
p#headline{
	position:absolute;
	-webkit-transition:margin 0.8s;
	font-size:10px;
	margin-left:5px;
	margin-top:75px;
	opacity:0;
	max-width:100%;
	text-align:center;
}
#imagen:hover p#headline{
	margin-top:80px;
	opacity:0.8;
	color:#FFF;
	text-transform:uppercase;
	max-width:100%;}

.footer{
	width:100%;
	height:45px;
	position:static;
	margin:auto;
	background:#000;
}
.footerprincipal{
	width:100%;
	height:45px;
	position:static;
	margin:auto;
}
.footer1{
	width:auto; height:45px;}
.footer2{
	width:400px; height:auto; float:right; padding:5px 5px; margin-right:42px;}
.images{
	width:30px;
	height:30px;
	background:url(../pictures/web.png);
	float:right;
	
}
.desing{
	width:110px;
	height:auto;
	float:left;
	margin-left:220px;
	color:#FFF;
	padding:6px 5px;
	font-family:Comfortaa;
}

.wrapper3{
	width:100%;
	max-width:1250px;
	margin:auto;
	overflow:hidden;
	height:auto;
}
.wrapper4{
	width:100%;
	max-width:1350px;
	margin:auto;
	overflow:hidden;
	height:auto;
}
.wrapper5{
	width:100%;
	max-width:1250px;
	margin:auto;
	overflow:hidden;
	height:auto;
}
.letrafooter{
	color:#FFF;
	font-size:16px;
	padding:15px 10px;}
hr{
	height:5px;
	background:#343F45;}
#menu{

	width:80%;
	padding:0;
	margin:20px auto;

}
.menu2{
	list-style:none;
	margin:0;
	color:#000;}
.menu2 li{
	float:left;
	padding:0;
	line-height:1;
	text-align:center;
	color:#000;
	}
.menu2 li a{
	color:#000;
	padding:10px 40px;
	font-size:25px;
	display:block;
	-webkit-transition: all .3s ease-in-out;
	-moz-transition: all .3s ease-in-out;
	-ms-transition: all .3s ease-in-out;
	-o-transition: all .3s ease-in-out;
}

	

#letraw{ width:100%; height:100px;  margin-top:50px;}
.l123{
	width:auto; height:100px; padding:30px 50px; font-size:50px; font-family:"Gravity Light";}
.l1234{
	width:10%; height:100px; float:right; padding:40px 35px;}
.in{font-size:22px; font-family:"Gravity Book"; height:30px; }
.largo1{
	width:100%;
	background-color:#343F45;
	height:1px;
	border-style:solid;
	border-width:0.5px;
	border-color:#343F45;
}
.lec{color:#FFF;}
.atras{ width:auto; height:30px; float:right; background:#F00; margin-top:10px;} 
.in{font-size:22px; font-family:"Gravity Book"; color:#000; height:auto; }
section{
	width:100%;
	height:575px;
	background:#000;
	overflow:hidden;
}
#container{
	width:100%; height:auto; background-color:transparent; margin:auto; max-width:1366px;}
	
	
.footer1{
	width:auto; height:40px;}
.footer2{
	width:200px; height:auto; float:right; padding:5px 5px; margin-right:42px;}
.footer3{width:250px; height:40px; float:right;
}

.foo{ width:100px; height:30px; background:url(../pictures/ovalos-02.png); margin-top:5px; margin-left:40px;}
.foo1{ width:100px; height:30px; background:url(../pictures/ovalos-01.png); float:right;margin-top:5px;}

.foo:hover{  background:url(../pictures/iconos/fa.png);}
.foo1:hover{ background:url(../pictures/iconos/you.png);}
.lec{color:#FFF; text-decoration:none; font-size:13px;}
.lec1{color:#FFF; font-size:12px; margin-right:10px;}
.lec3{color:#FFF; font-size:12px; margin-right:10px; }
.lec2{color:#FFF; font-size:12px; margin-right:10px; float:left; padding:5px 5px;margin-top:18px;}
.desing{
	width:auto;
	height:auto;
	float:left;
	margin-left:40px;
	color:#FFF;
	padding:10px 5px;
	font-size:12px;
	
}
.letrafooter{
	color:#FFF;
	font-size:12px;
	padding:15px 10px;}