@font-face {
    font-family: "CaviarDreams";
    src: url('fuentes/CaviarDreams.ttf') format("truetype");
}
* {
	margin:0;
	padding:0;
}
body {
	margin: 0;
	padding: 0;
}
#header {
	width:100%;
	float:left;
	height: 100vh;
}
#menu {
	width:100%;
	float:left;
	display: flex;
  	display: -webkit-flex;
  	flex-flow: row wrap;
  	-webkit-flex-flow: row wrap;
}
#menu a {
	text-decoration:none;
}
.m1, .m2, .m3, .m4, .m5 {
	width:20%;
	height: 100vh;
}
.m1 {
	background: url(../images/nosotros.jpg) no-repeat center center;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
	margin: 0;
	padding: 0;
	text-align:center;
}
.m1 h1 {
	color:#ffffff;
	font-family: "CaviarDreams";
	margin-top:50vh;
}
/* Sweep To Right */
.hvr-sweep-to-right {
  display: inline-block;
  vertical-align: middle;
  -webkit-transform: translateZ(0);
  transform: translateZ(0);
  box-shadow: 0 0 1px rgba(0, 0, 0, 0);
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
  -moz-osx-font-smoothing: grayscale;
  position: relative;
  -webkit-transition-property: color;
  transition-property: color;
  -webkit-transition-duration: 0.3s;
  transition-duration: 0.3s;
}
.hvr-sweep-to-right:before {
  content: "";
  position: absolute;
  z-index: -1;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: rgba(216,141,59,0.5);
  -webkit-transform: scaleX(0);
  transform: scaleX(0);
  -webkit-transform-origin: 0 50%;
  transform-origin: 0 50%;
  -webkit-transition-property: transform;
  transition-property: transform;
  -webkit-transition-duration: 0.3s;
  transition-duration: 0.3s;
  -webkit-transition-timing-function: ease-out;
  transition-timing-function: ease-out;
}
.hvr-sweep-to-right:hover, .hvr-sweep-to-right:focus, .hvr-sweep-to-right:active {
  color: white;
}
.hvr-sweep-to-right:hover:before, .hvr-sweep-to-right:focus:before, .hvr-sweep-to-right:active:before {
  -webkit-transform: scaleX(1);
  transform: scaleX(1);
}
.m2 {
	background: url(../images/servicios.jpg) no-repeat center center;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
	margin: 0;
	padding: 0;
	text-align:center;
}
.m2 h1 {
	color:#ffffff;
	font-family: "CaviarDreams";
	margin-top:80vh;
}
.m3 {
	background: url(../images/clientes.jpg) no-repeat center center;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
	margin: 0;
	padding: 0;
	text-align:center;
}
.m3 h1 {
	color:#ffffff;
	font-family: "CaviarDreams";
	margin-top:15vh;
}
.m4 {
	background: url(../images/catalogo.jpg) no-repeat center center;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
	margin: 0;
	padding: 0;
	text-align:center;
}
.m4 h1 {
	color:#ffffff;
	font-family: "CaviarDreams";
	margin-top:80vh;
}
.m5 {
	background: url(../images/contactenos.jpg) no-repeat center center;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
	margin: 0;
	padding: 0;
	text-align:center;
}
.m5 h1 {
	color:#ffffff;
	font-family: "CaviarDreams";
	margin-top:15vh;
}
.c-menu {
	width:50%;
	max-width: 800px;
	margin: 0 auto;
}
#menu2 {
	width:100%;
	height:60px;
	float:left;
	background-color:rgba(0,0,0,1);
	position:absolute;
	z-index:1000;
	margin-top:-21%;
}
#nosotros2 {
	margin-top:-20.5%;
	position:absolute;
}

/* --- Clase que agregaremos cuando el usuario haga scroll --- */
.menu-fixed {
	margin: 0 auto;
	position:fixed;
	z-index:1000;
	top:0px;
	left:0;
	width:100%;
	height:60px;
	background-color:rgba(0,0,0,1);
}
/**/
.contenedor2 {
	width:100%;
	margin: 0 auto;
}
#nav li {
	display: inline-block;
	text-align:center;
}
#lt-menu {
	width:18%;
	font-family: "CaviarDreams";
	font-family:16px;
}
#lt-menu a {
	text-decoration:none;
	color:#ffffff;
	line-height:60px;
}
#lt-menu a:hover {
	text-decoration:none;
	color:#5d804c;
	font-family: "CaviarDreams";
}
#lt-menu a:focus {
	text-decoration:none;
	color:#5d804c;
	font-family: "CaviarDreams";
}
/***Slider****/
#jssor_1 {
	position: relative; 
	margin: 0 auto; 
	top: 0px; 
	left: 0px; 
	width: 1600px; 
	height: 331px; 
	overflow: hidden; 
	visibility: hidden;
}
#slides {
	cursor: default; 
	position: relative; 
	top: 0px; 
	left: 0px; 
	width: 1600px; 
	height: 331px; 
	overflow: hidden;
}
/*******/

#nosotros {
	width:100%;
	float:left;
	background: url(../images/quien-somos_.jpg) no-repeat center center;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
	margin: 0;
	padding: 0;
}
.contenedor {
	width:81%;
	max-width:1300px;
	margin:0 auto;
	font-family: "CaviarDreams";
}
#nosotros h1 {
	color:#d88d3b;
	margin-top:5%;
	font-size:40px;
}
#nosotros h2 {
	color:#d88d3b;
	margin-top:5%;
	font-size:20px;
}
#nosotros p {
	color:#643d00;
	width:47%;
	font-size:22px;
	text-align: justify;
}
#n-txt {
	padding-bottom:7%;
}

/****Slider****/
@charset "UTF-8";
/* CSS Document */

/* jssor slider bullet navigator skin 01 css */
        /*
        .jssorb01 div           (normal)
        .jssorb01 div:hover     (normal mouseover)
        .jssorb01 .av           (active)
        .jssorb01 .av:hover     (active mouseover)
        .jssorb01 .dn           (mousedown)
        */
        .jssorb01 {
            position: absolute;
        }
        .jssorb01 div, .jssorb01 div:hover, .jssorb01 .av {
            position: absolute;
            /* size of bullet elment */
            width: 12px;
            height: 12px;
            filter: alpha(opacity=70);
            opacity: .7;
            overflow: hidden;
            cursor: pointer;
            border: #000 1px solid;
        }
        .jssorb01 div { background-color: gray; }
        .jssorb01 div:hover, .jssorb01 .av:hover { background-color: #d3d3d3; }
        .jssorb01 .av { background-color: #fff; }
        .jssorb01 .dn, .jssorb01 .dn:hover { background-color: #555555; }

        /* jssor slider arrow navigator skin 02 css */
        /*
        .jssora02l                  (normal)
        .jssora02r                  (normal)
        .jssora02l:hover            (normal mouseover)
        .jssora02r:hover            (normal mouseover)
        .jssora02l.jssora02ldn      (mousedown)
        .jssora02r.jssora02rdn      (mousedown)
        */
        .jssora02l, .jssora02r {
            display: block;
            position: absolute;
            /* size of arrow element */
            width: 55px;
            height: 55px;
            cursor: pointer;
            background: url('../images/a02.png') no-repeat;
            overflow: hidden;
        }
        .jssora02l { background-position: -3px -33px; }
        .jssora02r { background-position: -63px -33px; }
        .jssora02l:hover { background-position: -123px -33px; }
        .jssora02r:hover { background-position: -183px -33px; }
        .jssora02l.jssora02ldn { background-position: -3px -33px; }
        .jssora02r.jssora02rdn { background-position: -63px -33px; }
		

.bnn1 {
	position: absolute; 
	top: 355px; 
	left: 450px; 
	width: 740px; 
	height: 200px; 
	background-color: rgba(100,61,0,0.7); 
	font-size: 50px; 
	color: #ffffff; 
	line-height: 200px; 
	text-align: center;
	font-family: "CaviarDreams";
}
.bnn2 {
	position: absolute; 
	top: 65px; 
	left: 50px; 
	width: 740px; 
	height: 200px; 
	background-color: rgba(100,61,0,0.7); 
	font-size: 50px; 
	color: #ffffff; 
	line-height: 200px; 
	text-align: center;
	font-family: "CaviarDreams";
}
.bnn3 {
	position: absolute; 
	top: 65px; 
	left: 1000px; 
	width: 740px; 
	height: 200px; 
	background-color: rgba(100,61,0,0.7); 
	font-size: 50px; 
	color: #ffffff; 
	line-height: 200px; 
	text-align: center;
	font-family: "CaviarDreams";
}
/*****end******/

#servicios {
	width:100%;
	height:auto;
	float:left;
}
.servicio1 {
	width:100%;
	height: 100vh;
	background:url(../images/fondo-serv1.jpg) 50% 50% no-repeat fixed;
	-webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
}
.servicio2 {
	width:100%;
	height: 100vh;
	background:url(../images/fondo-serv2.jpg) 50% 50% no-repeat fixed;
	-webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
}
.servicio3 {
	width:100%;
	height: 100vh;
	background:url(../images/fondo-serv3.jpg) 50% 50% no-repeat fixed;
	-webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
}
.servicio4 {
	width:100%;
	height: 100vh;
	background:url(../images/fondo-serv4.jpg) 50% 50% no-repeat fixed;
	-webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
}
.scontenedor {
	width:81%;
	max-width:1300px;
	margin:0 auto;
	font-family: "CaviarDreams";
	display: flex;
  	display: -webkit-flex;
  	flex-flow: row wrap;
  	-webkit-flex-flow: row wrap;
}
.sizq {
	width:48%;
}
.sder {
	width:52%;
}
.sizq h1 {
	color:#ffffff;
	font-size:36px;
	margin-top:15%;
}
.sizq p {
	color:#ffffff;
	font-size:26px;
	margin-top:10%;
	width:80%;
}
.sder img {
	margin-top:15%;
}
#clientes {
	width:100%;
	height: auto;
	float:left;
	background: url(../images/fondo-clientes-01_opt.jpg) no-repeat center center;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
	margin: 0;
	padding: 0;
}
.ccontenedor {
	width:61%;
	max-width:970px;
	margin:0 auto;
	font-family: "CaviarDreams";
	display: flex;
  	display: -webkit-flex;
  	flex-flow: row wrap;
  	-webkit-flex-flow: row wrap;
	margin-top:10%;
}
.c1, .c2, .c3, .c4, .c5, .c6, .c7, .c8, .c9 {
	width:33.3%;
	padding-bottom:10%;
}
#contacto {
	width:100%;
	height:auto;
	float:left;
	background-color:#d88d3b;
}
#contacto2 {
	margin-top:-50px;
	position:absolute;
}
.cnt-contenedor {
	width:63%;
	max-width:1000px;
	margin:0 auto;
	font-family: "CaviarDreams";
	display: flex;
  	display: -webkit-flex;
  	flex-flow: row wrap;
  	-webkit-flex-flow: row wrap;
}
.cizq {
	width:49%;
	display: flex;
  	display: -webkit-flex;
  	flex-flow: row wrap;
  	-webkit-flex-flow: row wrap;
}
.apellido, .nombre {
	width:50%;
}
.telefono, .empresa, .email, .comentario, .boton {
	width:100%;
}
#apellido {
    border: 1px solid #FFFFFF;
	width:90%;
	height:25px;
	background-color:#FFFFFF;
	padding-left:5px;
	margin-top:20%;
}
#name {
    border: 1px solid #FFFFFF;
	width:90%;
	height:25px;
	background-color:#FFFFFF;
	padding-left:5px;
	margin-top:20%;
	margin-left:10%;
}
#telefono {
    border: 1px solid #FFFFFF;
	width:100%;
	height:25px;
	background-color:#FFFFFF;
	padding-left:5px;
	margin-top:5%;
}
#empresa {
    border: 1px solid #FFFFFF;
	width:100%;
	height:25px;
	background-color:#FFFFFF;
	padding-left:5px;
	margin-top:5%;
}
#correo {
	border: 1px solid #FFFFFF;
	width:100%;
	height:25px;
	background-color:#FFFFFF;
	padding-left:5px;
	margin-top:5%;
}

textarea{
	border: 1px solid #FFFFFF;
	text-decoration:none;
	width:96%;
	height:75px;
	padding:10px;
	background-color:#FFFFFF;
	margin-top:5%;
}

input[type=submit]
{
	-webkit-appearance: none;
	background-color:#FFFFFF;
	color:#8d8b91;
	height:30px;
	width:25%;
	font-size:15px;
	border: 0px solid white;
	font-family: "CaviarDreams";
	margin-top:5%;
	transition: all 500ms ease;
	margin-left:75%;
}
input[type=submit]:hover
{
	background-color:#8d8b91;
	color:#FFFFFF;
	border: 1px solid #8d8b91;
}
.cder {
	width:51%;
}
.info {
	color:#ffffff;
	margin-left:25%;
}
.cinfo {
	width:75%;
	border: 3px dashed #ffffff;
	margin-left:25%;
	text-align:center;
	color:#ffffff;
	font-size:24px;
	margin-top:10%;
}
#txt-info {
		padding-top:3%;
	}
.mapa {
	width:100%;
	height:auto;
}
#mapa {
	width:100%;
	height:350px;
	margin-top:5%;
	padding-bottom:4%;
}
footer {
	background-color:#ffffff;
}
.fcontenedor {
	width:31%;
	max-width:490px;
	margin:0 auto;
	font-family: "CaviarDreams";
	display: flex;
  	display: -webkit-flex;
  	flex-flow: row wrap;
  	-webkit-flex-flow: row wrap;
}
#logo_kalitex {
	width:95%;
}
#logo_kala {
	width:93%;
	margin-left:17%;
	margin-top:19%;
}
#derechos {
	width:100%;
	padding-top:5%;
	padding-bottom:5%;
	color:#643d00;
}
.espacio {
	width:100%;
	height:50px;
}
.libro {
	width:100%;
	text-align: center;
}
#ico_libro {
	width: 20%;
	max-width: 100px;
	min-width: 100px;
	margin-left: -15%;
	margin-top: 5%;
}
#rindustrial {
	display:none;
}
#mercha {
	display:none;
}
#subli {
	display:none;
}
#vestir {
	display:none;
}
#yura {
	margin-left:25%;
}
@media screen and (max-width: 800px) {
	.m1, .m2, .m3, .m4, .m5 {
		width:100%;
		height: 120px;
	}
	.m1 {
		background: url(../images/mnosotros.jpg) no-repeat center center;
		text-align:left;
	}
	.m1 h1 {
		color:#ffffff;
		font-family: "CaviarDreams";
		margin-top:30px;
		margin-left:20px;
	}
	.m2 {
		background: url(../images/mservicios.jpg) no-repeat center center;
		text-align:right;
	}
	.m2 h1 {
		color:#ffffff;
		font-family: "CaviarDreams";
		margin-top:30px;
		margin-right:20px;
	}
	.m3 {
		background: url(../images/mclientes.jpg) no-repeat center center;
		text-align:left;
	}
	.m3 h1 {
		color:#ffffff;
		font-family: "CaviarDreams";
		margin-top:30px;
		margin-left:20px;
	}
	.m4 {
		background: url(../images/mcatalogo.jpg) no-repeat center center;
		text-align:right;
	}
	.m4 h1 {
		color:#ffffff;
		font-family: "CaviarDreams";
		margin-top:30px;
		margin-right:20px;
	}
	.m5 {
		background: url(../images/mcontactenos.jpg) no-repeat center center;
		text-align:left;
	}
	.m5 h1 {
		color:#ffffff;
		font-family: "CaviarDreams";
		margin-top:30px;
		margin-left:20px;
	}
	#menu2 {
		width:80%;
		height:38px;
		float:left;
		background-color:rgba(0,0,0,1);
		position:absolute;
		z-index:1000;
		margin-top:-21%;
	}
	.menu-fixed {
		margin: 0 auto;
		position:fixed;
		z-index:1000;
		top:0px;
		left:0;
		width:80%;
		height:38px;
		background-color:rgba(0,0,0,1);
	}
	#lt-menu a {
		line-height:40px;
	}
	#nosotros p {
		color:#643d00;
		width:95%;
		font-size:22px;
	}
	.servicio1 {
		width:100%;
		height: auto;
		background:#49220d;
	}
	.servicio2 {
		width:100%;
		height: auto;
		background:#6c331f;
	}
	.servicio3 {
		width:100%;
		height: auto;
		background:#423c3c;
	}
	.servicio4 {
		width:100%;
		height: auto;
		background:#472f24;
	}
	.sizq {
		width:100%;
	}
	.sder {
		width:100%;
	}
	#rindustrial {
		display:block;
		margin:0 auto;
		margin-top:10%;
		padding-bottom:5%;
	}
	#arrow2, #arrow3, #arrow4 {
		display:none;
	}
	#mercha {
		display:block;
		margin:0 auto;
		margin-top:10%;
		padding-bottom:5%;
	}
	#subli {
		display:block;
		margin:0 auto;
		margin-top:10%;
		padding-bottom:5%;
	}
	#vestir {
		display:block;
		margin:0 auto;
		margin-top:10%;
		padding-bottom:5%;
	}
	#clientes {
		height: auto;
	}
	.c1, .c2, .c3, .c4, .c5, .c6, .c7, .c8, .c9 {
		width:50%;
		padding-bottom:10%;
	}
	.ccontenedor {
		margin-top:8vh;
	}
	.cizq {
		width:100%;
	}
	.cder {
		width:100%;
	}
	.cinfo {
		width:75%;
		border: 3px dashed #ffffff;
		margin-left:0px;
		text-align:center;
		color:#ffffff;
		font-size:24px;
		margin:0 auto;
		margin-top:10%;
	}
	.info {
		color:#ffffff;
		margin-left:0px;
		margin:0 auto;
		text-align:center;
		font-size:24px;
	}
	.fcontenedor {
		width:71%;
		max-width:490px;
		margin:0 auto;
		font-family: "CaviarDreams";
		display: flex;
		display: -webkit-flex;
		flex-flow: row wrap;
		-webkit-flex-flow: row wrap;
		text-align:center;
	}
	.c-menu {
		width:98%;
	}
	#menu2 {
		width:100%;
	}
	.menu-fixed {
		width:100%;
	}
	.sizq p {
		width:95%;
	}
}
@media screen and (max-width: 480px) {
	.c-menu {
		width:98%;
	}
	#menu2 {
		width:100%;
		font-size:13px;
		margin-top:-34%;
	}
	#nosotros2 {
		margin-top:-33.5%;
	}
	.menu-fixed {
		width:100%;
	}
	#nosotros h1 {
		font-size:30px;
	}
	#nosotros p {
		font-size:18px;
	}
	.sizq h1 {
		font-size:30px;
	}
	.sizq p {
		font-size:18px;
		width:95%;
	}
	.c1, .c2, .c3, .c4, .c5, .c6, .c7, .c8, .c9 {
		width:100%;
		padding-bottom:10%;
		text-align:center;
	}
	.apellido, .nombre {
		width:100%;
	}
	#apellido {
		width:100%;
		margin-top:20%;
	}
	#name {
		width:100%;
		margin-top:5%;
		margin-left:0px;
	}
	.cnt-contenedor {
		width:83%;
	}
	.cinfo {
		width:95%;
		font-size:20px;
	}
	.info {
		font-size:18px;
	}
	.fcontenedor {
		width:95%;
	}
	.fizq{
		width:50%;
	}
	.fder {
		width:50%;
	}
	#logo_kalitex {
		width:85%;
	}
	#logo_kala {
		width:83%;
		margin-left:17%;
		margin-top:19%;
	}
	#jssor_1 {
		width: 1600px; 
		height: 531px; 
	}
	#slides {
		width: 1600px; 
		height: 531px; 
	}
	.bnn1 { 
		top: 455px; 
	}
	.bnn2 {
		top: 165px; 
	}
	.bnn3 {
		top: 165px; 
	}
	.m1, .m2, .m3, .m4, .m5 {
		width:100%;
		height: 110px;
	}
	#yura {
		margin-left:1%;
	}
	#ico_libro {
		width: 20%;
		max-width: 100px;
		min-width: 100px;
		margin-left: 0px;
		margin-top: 5%;
	}
}


