@charset "utf-8";
/* CSS Document */

div.clear  { clear: both; }
*{
	border:0;
	margin:0;
	paddig:0;
	outline:0;
}
img{
	max-width:100%;
	height:auto;
}
div.clear  { clear: both; }
body{
	background-image:url(../images/bg.jpg);
	background-position:top;
	background-attachment:fixed;
	background-size:cover;
	font-family:Arial, Helvetica, sans-serif;
	font-size:12px;
}
header{
	padding-top:8px;
}
#div-center{
	margin:0 auto;
	width:95%;
	max-width:950px;
	background-color:white;
}
#logo{
	width:28%;
	display:inline-block;
	vertical-align:top;
	padding-left:2%;
	padding-top:5px;
}
#logo img{
	max-width:100%;
	height:auto;
}

#data-top{
	width:68%;
	vertical-align:top;
	display:inline-block;
	text-align:right;
	padding-right:1%;
}

@font-face{
font-family:"helvetic";
src:url("../fonts/helveticaneueltstdcn.eot");
src:url("../fonts/helveticaneueltstdcn.eot?#iefix")format("embedded-opentype"),
	url("../fonts/helveticaneueltstdcn.woff")format("woff"),
	url("../fonts/helveticaneueltstdcn.ttf")format("truetype"),
	url("../fonts/helveticaneueltstdcn.svg#Chalet")format("svg");
font-weight:normal;
font-style:normal;
}

@font-face{
font-family:"rockwell";
src:url("../fonts/rock.eot");
src:url("../fonts/rock.eot?#iefix")format("embedded-opentype"),
	url("../fonts/rock.woff")format("woff"),
	url("../fonts/rock.ttf")format("truetype"),
	url("../fonts/rock.svg#Chalet")format("svg");
font-weight:normal;
font-style:normal;
}

/*BODY*/
#div-body{
	padding:25px;
	text-align:justify;
	line-height:18px;
}
.text1{
	font-size:30px;
	line-height:30px;
	font-family:"rockwell";
}
.text2{
	font-size:20px;
	color:#850f17;
	line-height:22px;
	font-family:"rockwell";
	text-align:left;
}
.text3{
	font-weight:bold;
}
.text4{
	font-size:16px;
	color:#850f17;
	line-height:18px;
	text-transform:uppercase;
	text-align:center;
	font-weight:bold;
}
.text5{
	font-weight:bold;
	font-style:italic;
}
.text6{
	font-size:12px;
	font-weight:bold;
	color:#850f17;
	text-transform:uppercase;
}
.link-img{
	width:14.5%;
	display:inline-block;
	padding:1%;
	float:left;
}

/*HOME*/
.text-index{
	display:inline-block;
	vertical-align:top;
	float:left;
}
.img_index{
	width:57%;
	display:inline-block;
	text-align:right;
	padding-bottom:30px;
	float:right;
}
.img_index img{
	max-width:100%;
	height:auto;
}

.text_services{
	width:40%;
	display:inline-block;
}

/*FORM*/
.div-banner{
	width:100%;
	display:block;
	position:relative;
	
}
.cont-formulario{
	position:absolute;
	background-image:url(../images/white.png);
	width:35%;
	z-index:9999;
	padding-bottom:15px;
	padding-top:15px;
	margin-left:63%;
	margin-top:5px;
}
.tittle-form{
	width:85%;
	margin:0 auto;
	background-color:black;
	color:white;
	font-family:"rockwell";
	font-size:16px;
	text-transform:uppercase;
	text-align:center;
	padding-top:5px;
	padding-bottom:5px;
	border-top-left-radius: 10px;
    border-top-right-radius: 10px;
    
    -moz-border-radius-topleft:10px;
    -moz-border-radius-topright:10px;

    -webkit-border-top-left-radius:10px;
    -webkit-border-top-right-radius:10px;
}
.div-inputs{
	width:85%;
	margin:0 auto;
}
.input-ini1, .input-ini2,.input-ini3,.input-captcha, .input-ini21  {
	border: 1px solid #949292;
	width:55%;
	height:21px;
	display:inline-block;
	margin-top:8px;
	font-size:12px;
	font-family:Verdana, Geneva, sans-serif;
	margin-bottom:4px;
}
.input-ini2  {
	width:37%;
	margin-left:3.5%;
	
}
.input-ini21  {
	width:37%;
	margin-left:3.5%;
	font-size:11px;
	height:23px;
}
.input-ini3  {
	width:100%;
}
.input-captcha  {
	width:100px;
}
/*SERVICES*/
.list-services ul{
	list-style:none;
	padding:0;
	margin:0 !important;	
}
.list-services li{
   display:block;
   vertical-align:top;
   margin-top:10px;
   	background-image:url(../images/icon.jpg);
	background-repeat:no-repeat;
	padding-left:10px;
}
.list-services a{
	text-decoration:none;
}

/*PACKING*/

.box-table{
	width:90%;
	border: solid 1px #bcbbbb;
	margin-top:20px;
	margin-bottom:20px;
	
}
.box-size{
	width:28%;
	padding-left:2%;
	padding-right:2%;
	display:inline-block;
	vertical-align:top;
	padding-top:5px;
	padding-bottom:5px;
}
.box-item{
	width:63.2%;
	padding-left:2%;
	padding-right:2%;
	display:inline-block;
	vertical-align:top;
	background-color:#efefef;
	min-height:40px;
		padding-top:5px;
	padding-bottom:5px;
}

.line-box{
	height:1px;
	width:100%;
	display:block;
	background-color:#CCC;
}

/*QUOTES*/
.tittle-form{
	width:85%;
	text-align:center;
	margin:0 auto;
}
.cont-form{
    border-radius: 10px;
    -moz-border-radius:10px;
    -webkit-border-radius:10px;
	border: solid 1px #bcbbbb;
	width:80%;
	margin:0 auto;
	margin-top:20px;
	margin-bottom:20px;
}
.head-form{
    background-color:black;
	padding:15px;
	font-size:20px;
	text-transform:uppercase;
	font-weight:bold;
	border-top-left-radius: 10px;
    border-top-right-radius: 10px;
    
    -moz-border-radius-topleft:10px;
    -moz-border-radius-topright:10px;
    -moz-border-radius-bottomleft:0px;
    -moz-border-radius-bottomright:0px;

    -webkit-border-top-left-radius:10px;
    -webkit-border-top-right-radius:10px;
    -webkit-border-bottom-left-radius:0px;
    -webkit-border-bottom-right-radius:0px;
	color:white;
	text-align:center;
}
.marg-form{
	padding:25px;
}
.input1{
	border: 1px solid #949292;
	height:22px;
	font-size:12px;
	margin-top:3px;
	width:100%;
}

.cont1{
	width:70%;
	display:inline-block;
}
.cont2{
	width:25%;
	margin-left:3%;
	margin-top:5px;
	display:inline-block;
}
.cont3{
	width:48%;
	display:inline-block;
}
.cont4{
	width:48%;
	margin-left:3%;
	margin-top:5px;
	display:inline-block;
}
.botonformulario {
	border: none;
	color: #fff;
	background-color: #8e1115;
	width:99px;
	height:31px;
	text-align:center;
	text-transform:uppercase;
	font-size:14px;
	margin-top:3px;
}


/*MENU*/
#cont-menu2{
	background-color:#97110f;
	font-family:"helvetic";
	height:auto;
}
#div-menu2{
	width:99%;
	margin:0 auto;
}
#div-menu2 ul{
	list-style:none;
	padding:0;
	margin:0 !important;
}
#div-menu2 li{
   display:inline-block;
   /* margin: 0px;*/
   vertical-align:top;
   float:left;	
   background-color:white;

}
#div-menu2 a{
	margin-left:1px;
	color:white;
	text-decoration:none;
	text-transform:uppercase;
	font-size:13px;
	display:block;
	padding:10px;
	text-align:center;
	background-color:#97110f;
}
#div-menu2 a:hover{
	background-color:#790d0b;
}
nav ul{
    list-style: none outside none;
    font-family: Arial,Helvetica,sans-serif;
    margin: 0px auto;
    width: 90%;
	
}
nav li{
	display:inline-block;
   /* margin: 0px;*/
   vertical-align:top;
   font-family:"rockwell";
}
nav a{
	color:black;
	text-decoration:none;
	text-transform:uppercase;
	font-size:13px;
	display:block;
/*	padding:10px;

*/	text-align:center;
	padding:0px 8px;
	padding-top:15px;
	padding-bottom:15px;

}
nav a:hover{
	color:white;
	background-color:black;
	border-top-left-radius: 10px;
    border-top-right-radius: 10px;
    
    -moz-border-radius-topleft:10px;
    -moz-border-radius-topright:10px;

    -webkit-border-top-left-radius:10px;
    -webkit-border-top-right-radius:10px;

}


/*FOOTER*/
footer{
	width:100%;
	background-color:#151716;
	padding-top:30px;
	padding-bottom:30px;
	color:white;
}
.data-footer{
	width:47%;
	display:inline-block;
	padding-left:3%
}
.consultation{
	width:45%;
	display:inline-block;
	padding-right:3%;
	text-align:right;
}
.consultation img{
	float:right;
	padding-left:1%;
}
.font-consultation{
	font-size:16px;
	color:gray;
	font-weight:bold;
}
.menu_footer a{
	color:white;
	text-decoration:none;
}

.menu_footer a:hover{
	color:#c51310;
}

.footer-gray{
	width:98%;
	text-align:right;
	padding:1%;
	background-color:#cfcfcf;
}
.div-copy, .div-design{
	display:inline-block;
	width:60%;
	vertical-align:top;
	padding-top:5px;
	text-align:left;
}
.div-design{
	width:24%;
	text-transform:none;
	text-align:right;
}
.div-first{
	display:inline-block;
	width:15%;
}



@media(min-width:1081px){

}

@media(max-width:1080px){
	
}

@media(max-width:800px){
nav a{
	font-size:12px;
	padding:6px;
}
.img_index{
	width:95%;
	display:block;
	text-align:left;
	padding-left:0;
	margin-top:8px;
}
.text-index{
	width:95%;
	display:block;
	padding-bottom:10px;
}
.link-img{
	width:31%;
}
.cont-form{
	width:98%;
}


.cont-formulario{
	width:45%;
	margin-left:45%;
}

}

@media(max-width:600px){
.cont-formulario{
	width:55%;
}
#logo, #data-top{
	width:90%;
	display:block;
	margin:0 auto;
	text-align:center;
	padding-left:0;
	padding-right:0;
	padding-top:8px;
	padding-bottom:5px;
}
#data-top img{
	max-width:100%;
	height:auto;
	padding-bottom:5px;
}
nav a{
	font-size:14px;
	padding:10px;
}
nav li{
   display:block;
}
.data-footer{
	width:95%;
	display:block;
	padding-left:0;
	text-align:center;
}
.consultation{
	margin:0 auto;
	margin-top:10px;
	width:234px;
	display:block;
	padding-right:0;
	text-align:center;
}
.link-img{
	width:45%;
	padding-left:2%;
}
.cont1{
	width:90%;
	display:block;
}
.cont2{
	width:60%;
	margin-left:0;
	display:block;
}
.cont3{
	width:90%;
	display:block;
}
.cont4{
	width:90%;
	margin-left:0;
	display:block;
}
.box-size{
	width:100%;
	display:block;

}
.box-item{
	width:96%;
	display:block;
}
.div-copy, .div-design, .div-first{
	display:block;
	width:100%;
	float:none;
	text-align:center;
}

}



/* Esto simplemente es para que nuestro nav (responsive-menu) aparezca a la izquierda (left) */

#responsive-menu{
float: left;
background: #a01114; /* Color de fondo del menú */
width: 100%; /* Ancho */
padding-top:0;
margin-bottom:30px;
position:relative;
text-align:center;
}

/* Quitamos estilos predeterminados de la etiqueta UL (margen, relleno, estilo de lista y tamaño de letra)  */

#responsive-menu ul{
/*margin: 0;
*//*padding: 0;*/
list-style: none;
margin:0 auto;
text-align: center;
}

#responsive-menu li{
padding-top:0;
top:0;
/*display:inline-block;*/
float: left; /* Flotado a la izquierda */
text-transform:none;
text-align: center; /* Texto centrado */
font-family:Arial, Helvetica, sans-serif;
font-size: 11px; 
/*font-family:"helvetic";*/
border-right:1px solid #fff;
}

/* Añadimos estilo a los enlaces */
#responsive-menu li a{
/*display: block;*/ 
color: #fff; /* Color de letra */
text-decoration: none; /* Sin subrayado */
padding-top:10px;
padding-bottom:10px;
font-size: 12px; 
top:0;
text-transform:lowercase;
text-transform:none;
} 

#responsive-menu li a:hover{
border-radius:0;
background: #880e12; 

/* Color de fondo de cada elemento al pasar el cursor */
/* color: #ffc700;  Color de letra al pasar el cursor */
} 

#nav-responsive{
display: none; /* Ocultamos el enlace */
background: url(../images/desplegar.jpg) no-repeat 15px 17px; /* Imagen que desplegará el menú al hacer click */
text-decoration: none; /* Sin subrayado */
float: left; /* Flotado a la derecha */
width: 60px; /* Ancho */
height: 60px; /* Alto */
left: 0; /* Derecha */
top: 0; /* Arriba */
opacity: .6; /* Opacidad */ 
position:absolute;
}

/* Agregaremos la clase .nav-active al enlace #nav-responsive, cuando el menu esté desplegado */

#nav-responsive.nav-active{
opacity: 1; /* Opacidad */
}


/* A partir de aquí, vista móvil */

@media only screen and (max-width: 768px) {

/* Mostramos el enlace que desplegará el menú (#nav-responsive) */
#nav-responsive{
display: block;
}

#responsive-menu{
width: 100%; /* Ancho (vista móvil) */
float: none; /* Dejamos de flotar el menú ya que el ancho es 100% */
padding-top: 60px; 
/*Relleno por arriba a partir del cual se mostrarán los elementos <li> */
}

#responsive-menu ul{
box-shadow: 0 1px 2px rgba(0,0,0,.5); /* Sombra al menú */
max-height: 0;
overflow: hidden;

}

/* Añadimos estilo a cada elemento <li> (Vista móvil) */

#responsive-menu li{
background: #a01114; /* Color de fondo */
border-bottom: 1px solid #fff; /* Borde inferior tamaño-tipo-color */
float: none;
display: block;
border-right:0;
}

#responsive-menu li:last-child{
border-bottom: 0; 
/* Quitamos el borde al útlimo elemento <li> del menú (Vista móvil) */
}

/* Estilos para los enlaces (Vista móvil) */
#responsive-menu li a{
/*padding: 15px 0;*/
height: auto;
line-height: normal;
border-right:0;
font-size: 10px; 
}

#responsive-menu li a:hover{
background:#880e12; /* Color de fondo para cada enlace al pasar el cursor */
}

#responsive-menu ul.open-responsive-menu{
max-height: 400px; /* Máximo alto para el menú desplegado */
transition: max-height .5s; /* Efecto en el despliegue del menú */
}

}