.@font-face
{
 font-family:"Gravity Book";
 src:url(../pictures/font/Gravity-Book.ttf);
}
@font-face
{
 font-family:"Comfortaa Regular";
 src:url(../pictures/font/Comfortaa-Regular.ttf);
}
@font-face
{
 font-family:"Gravity Light";
 src:url(../pictures/font/Gravity-Light.ttf);
}
		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:130px; margin-left:150px; margin-top:-37px; background:#1B1B20;}
.cinta1{ width:70px; background:#1B1B20; margin-left:140px; padding:5px 5px; text-decoration:none;}

.lc{margin-left:25px;}
.spanish{text-decoration:none; color:#FFF;}
.logo{width:360px; height:120px; max-width:100%; margin-left:60px;}
.elegir{width:450px;}
.preci{padding:0px 10px;}
.linea{width:450px;}
.lineal{width:220px; margin-bottom:30px;}
.pict{max-width:50%;}
.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;}

body
{
 font-family:"Gravity Book";
}
*{
	margin: 0;
	padding: 0;
}

.banner{width:100%;
	height:670px;
	background:#5C5A5C;	

}


header{
	position: fixed;
	width: 100%;
	height: 120px;
	background-color: transparent;
	-webkit-transition: background-color .5s;
	-moz-transition: background-color .5s;
}

nav{

	display: table;
	margin: auto;
	margin-top: 15px;
	height: 70px;
	-webkit-transition: margin-left .5s;
	-moz-transition: margin-left .5s;;
}

ul{
	display: block;
	float: left;
	list-style: none;
}

ul li{
	
	float: left;
	margin: 8px;
	padding: 4px 1px;
	font-size:15px;		
}

ul a{
	color: #FFF;
	text-decoration: none;
}

img#logo{
	float:left;
	display: block;
	margin-left: 30px;
	margin-right: 30px;
	margin-top:150px;
	-webkit-transition: width .5s, height .5s, margin-right .5s, margin-top .5s;
	-moz-transition: width .5s, height .5s, margin-right .5s, margin-top .5s;
}


#services{
	text-align: center;
	width:100%;
	height:auto;
}
#services p{
	text-align: justify;
}

#services .service-box{
	display:inline-block;
	width: 28%;
	height: auto;
	background-color:transparent;
	margin:1%;
	overflow:hidden;
	
}

#services .service-box img{
	width:300x;
	height: 300px;

}

.wrapper {
	width:100%;
	max-width:1350px;
	margin:auto;
	overflow:hidden;
}
#servicios{
	width:100%;
	height:250px;
	background:#999;
	background:url(../pictures/baner%20de%20servicios-01.png);
	max-width:100%;
	
}
#ver{
	width:35px;
	height:35px;
	background:url(../pictures/iconos/flechaas-01-01.png);
	float:right;
	margin-right:160px;
	position:static;
}
#ver1{
	width:35px;
	height:35px;
	background:url(../pictures/iconos/flechaas-01-01.png);
	float:right;
	margin-right:170px;
	position:static;
}

hr{
	width:100%;
	height:5px;
	background:#343F45;}




.wrapper3{
	width:100%;
	max-width:1250px;
	margin:auto;
	overflow:hidden;
	height:auto;
}



.selecion{
	width:80%;
	height:100px;
	background-color:transparent;
	margin-left:150px;
}

.txt{
	font-size:60px;
	color:#FFF;
	padding:45px 10px;
	text-align:center;
}

.selecion123{
	width:90%;
	height:80px;
	background-color:transparent;
	margin-left:70px;
		
}

.txt123{
	color:#FFF;
	font-size:30px;
	text-align:center;
	padding:20px;
}
#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%;}	
	
	
.letrafooter{
	color:#FFF;
	font-size:12px;
	padding:15px 10px;}
.footer{
	width:100%;
	height:45px;
	position:static;
	margin:auto;
	background:#000;
}
.footerprincipal{
	width:100%;
	height:45px;
	position:static;
	margin:auto;
}
.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)}
.images{
	width:30px;
	height:30px;
	background:url(../pictures/web.png);
	float:right;
	
}
.desing{
	width:auto;
	height:auto;
	float:left;
	margin-left:10px;
	color:#FFF;
	padding:10px 5px;
	font-size:12px;
	font-family:Comfortaa;
	
}
.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;

	}
#cuerpoprincipal{
	width:100%;
	height:300px;
	background:#1D1D1D;
}
.wrapper2 {
	width:100%;
	max-width:1350px;
	margin:auto;
	overflow:hidden;
}
td{
	color:#FFF;
}
.largo{
	width:89%;
	background-color:#343F45;
	height:1px;
	border-style:solid;
	border-width:0.5px;
	border-color:#343F45;
}
.largo1{
	width:100%;
	background-color:#343F45;
	height:1px;
	border-style:solid;
	border-width:0.5px;
	border-color:#343F45;
}

.elegirnos{
	text-align:center;
	font-size:45px;
}
#cuerpo3{
	width:100%;
	height:auto;
	position:static;
}
#elige1{

	width:100%;
	height:auto;
	position:static;

}
#elige1 .texto1{
	display:inline-block;
	width: 30%;
	height: auto;
	background: white;
	margin:1%;
	overflow: hidden;
	
}

.magen{
	width:120px;
	height:120px;
	padding:12px 0px;
	position:static;
-webkit-transition: all 1s ease;
-moz-transition: all 1s ease;
-ms-transition: all 1s ease;
transition: all 1s ease;

}
.magen:hover{
height: 120px;
width: 120px;
margin-left: -20px;}

.magen1{
	width:70%;
	height: auto;
	float:right;
	text-align:left;
	position:static;
	
}

#contorno{
	width:100%;
	height:auto;

}
.web{
	width:45%;
	height:auto;
	margin-left:50px;
}
.letraweb{
	width:46%;
	height:200px;
	float:right;
}
.simba{
	width:45%;
	height:auto;
	float:right;
	margin-right:50px;
}
.lweb{
	text-align:center;
	font-size:20px;
	padding:5px 0px;
	width:100%;
}

.clientes1{
	width:auto;
	height:117px;
	margin:30px;
	display:inline-block;
}
#clientes{
	width:100%;
	height:auto;
	}
.h{font-size:30px; color:#000; font-family:"Gravity Light"; }
.hr{width:70%;
	background-color:#343F45;
	height:1px;
	border-style:solid;
	border-width:0.5px;
	border-color:#343F45;}
.erp{ text-decoration:none; color:#FFF;} 


.box{
	text-align:justify;
	font-family:"Gravity Book";
	padding:20px 8px;}
.box1{
	text-align:justify;
	font-family:"Gravity Book";
	padding:20px 20px;}
.tt{
	text-decoration:none;
	color:#FFF; font-weight:100;}
.texto{
	width:600px; height:10px;
	float:left;
	margin-top:400px;
	margin-left:380px;
	}
.t1{
	font-size:75px;
	color:#FFF; font-family:"Gravity Light"; }
.texto123{
	width:600px; height:80px;
	float:left;
	margin-top:0px;
	margin-left:380px;}
.t123{
	font-size:75px;
	color:#FFF; font-family:"Gravity Book"; }
#ver{
	width:35px;
	height:35px;
	background:url(../pictures/iconos/flecha%20blano%20y%20negro-01.png);
	float:right;
	margin-right:160px;
	position:static;

}
#ver:hover{
	width:35px;
	height:35px;
	background:url(../pictures/iconos/flechaas-01-01.png);
	position:static;
	float:right;
	margin-right:160px;

}
#ver1{
	width:35px;
	position:static;
	height:35px;
	background:url(../pictures/iconos/flecha%20blano%20y%20negro-01.png);
	float:right;
	margin-right:170px;
		
}
	
#ver1:hover{
	width:35px;
	height:35px;
	position:static;
	background:url(../pictures/iconos/flechaas-01-01.png);
	float:right;
	margin-right:170px;

}
.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;text-align:left; }
.lec2{color:#FFF; font-size:12px; margin-right:10px; float:left; text-align:left; margin-top:14px;}
p{ text-align:justify;}
img{ max-width:100%;}

#container{
	width:100%; height:auto; background-color:transparent; margin:auto; max-width:1366px;}