a{
	text-decoration: none;
	color: white;
	border-style: none;
}
/*-------------------------------------------------------------RESPONSIVE ----------------------------------------------------------------------------------------------------------*/

@media screen and (min-width: 280px){

body{
	position: relative;
	text-align : justify;
}

@font-face {
    font-family: helvetica;
    src: url(css/fonts/Helvetica.otf);
}

@font-face {
    font-family: avenir;
    src: url(css/fonts/avenir.ttf);
}

@font-face {
    font-family: avenir-next;
    src: url(css/fonts/avenir-next.ttf);
}
@font-face {
    font-family: helvetica-bold;
    src: url(css/fonts/helveticabold.otf),
    url(css/fonts/helveticabold.eot),
    url(css/fonts/helveticabold.woff),
    url(css/fonts/helveticabold.svg),
    url(css/fonts/helveticabold.ttf);
    font-weight: bold;
}


/*--------------------------------------------------------- Linea de contactos y redes sociales*/
 
 #social a{
 	text-decoration: none;
	border-style: none;
	color: white;
 }

 #social{
	width: 100%;
	height: 30px;
	background: #565656;
	position: relative;
	margin: 0px;
	margin-bottom: 0px;
	text-align: center;
}

#info-social{
	width: 100%;
	height: 30px;
	background: #565656;
	position: relative;
	display: inline-block;
}

.ct{
	position: relative;
	display: inline-block;
	width: 5%;
	background: #565656;
	font-size: 0pt;
	vertical-align: middle;
	padding: 6px 8px;
	float: left;
}

#contacto img{
	height: 20px;
	width: 20px;
	vertical-align: middle;
}

#whatsapp img{
		height: 20px;
	width: 20px;
	vertical-align: middle;
}

.redes-sociales img{

		height: 12px;
	width: 12px;
	margin-top: 4px;
}

.redes-sociales{
	position: relative;
	display: inline-block;
	width: 73.7%;
	text-align: right;
	background: #565656;
	padding: 3.5px 10px;
	float: left;
	transition: 0.4s;
}



.rs{
	position: relative;
	display: inline-block;
	width: 20px;
	height: 20px;
	border-radius: 50%;
	text-align: center;
	background: white;
	text-align: center;
}

.rs:hover{
	background: #C0BDBD;
	cursor: pointer;
}

/*----------------------------------------------------Navegador de la pagina y logo */

header {
	width: 100%;
	height: 0px;
	background: #FF0000;
	position: relative;
	text-align: center;
}

#menu{
	display: none;
}



.topnav {
  overflow: hidden;
  background-color: #FF0000;

}


.topnav a {
	float: left;
	display: block;
	color: #f2f2f2;
	text-align: center;
	padding: 7px 8px;
	text-decoration: none;
	font-size: 14px;
	font-family: avenir;
	

}

.active{
	display: inline-block;
	margin-top: -20px;
}



@media screen and (max-width: 767px) {
  .topnav a:not(:first-child) {display: none;}
  .topnav a.icon {
    float: right;
    display: block;
  }
}

@media screen and (max-width: 767px) {
  .topnav.responsive {position: relative;}
  .topnav.responsive .icon {
    position: absolute;
    right: 0;
    top: 0;
  }
  .topnav.responsive a {
    float: none;
    display: block;
    text-align: left;
  }
}


.container {
    display: inline-block;
    cursor: pointer;
    float: right;
    margin-top: 10px;
    margin-right: 29px;
}

.bar1, .bar2, .bar3 {
    width: 35px;
    height: 5px;
    background-color: #565656;
    margin: 6px 0;
    transition: 0.4s;
}

.change .bar1 {
    -webkit-transform: rotate(-45deg) translate(-9px, 6px);
    transform: rotate(-45deg) translate(-9px, 6px);
}

.change .bar2 {opacity: 0;}

.change .bar3 {
    -webkit-transform: rotate(45deg) translate(-8px, -8px);
    transform: rotate(45deg) translate(-8px, -8px);
}

#menu1{
	width: 100%;
	position: absolute;
	z-index: 9999;
}


#menu1 a{
	width: 100%;

}

	#menu1 h1 figure{
		width: 100%;
		height: 68px;
		background:  #FF0000;
		margin: auto 0px;


}

#menu1 h1 figure:hover{
		background: #B30000;
	}

	#menu1 h1 figure img{
		height: 50px;
		width:  150px;
		float: left;
	}


#buscado{
	background: #565656;
}

#buscado:hover{
	background: #B30000;
}

#buscado img{
width: 11px;
height: 11px;

}

#menu1  a:hover{
	background: #B30000;
}

/*----------------------------------------------vide0------------------------------------------------------------------------------*/


video{
	
	z-index: 2;
	width: 100%;
	height: 300px;
}

.ytvideo iframe{
	height: 450px;
}

/*----------------------------------------------------------------------------  catalogo */

#catalogo00{
	font-family: helvetica-bold, Arial;
	font-weight: bold;
	font-size: 20pt;
	color: #FF0000;
	text-align: center;
	margin-top: 45px;
}

#usos{
	background: #FFFFFF;
	width: 100%;
	height: 830px;
	text-align: center;
	position: relative;
}

@media screen and (min-width: 480px) {
  
  #usos{
	background: #FFFFFF;
	width: 100%;
	height: 420px;
	text-align: center;
	position: relative;
}



}



.iconos-usos{
	position: relative;
	display: inline-block;
	width: 120px;
	height: 120px;

	margin:auto 0px;
	margin-top: 50px;
	margin-right: 12px;
	margin-left:12px;
	cursor: pointer;
	
}

.iconos-usos img{
	width: 90px;
	height: 90px;
}

#auto:hover{
	opacity: .7;
}

#camion:hover{
	opacity: .7;
}

#maquinaria:hover{
	opacity: .7;
}

#motocicleta:hover{
	opacity: .7;
}

#marina:hover{
	opacity: .7;
}

/*---------*/
#industria01:hover{
	opacity: .7;
}

#alimento:hover{
	opacity: .7;
}

#classic:hover{
	opacity: .7;
}



#auto{
	background-image: url("prueba/Icon_Auto.png");
	width: 90px;
	height: 90px;
	background-size: cover;
}

#camion{
	background-image: url("prueba/Icon_Camion.png");
	width: 90px;
	height: 90px;
	background-size: cover;
}

#maquinaria{
	background-image: url("prueba/Icon_Maquinaria.png");
	width: 90px;
	height: 90px;
	background-size: cover;
}

#motocicleta{
	background-image: url("prueba/Icon_Motocicleta.png");
	width: 90px;
	height: 90px;
	background-size: cover;
}

#marina{
	background-image: url("prueba/Icon_Marina.png");
	width: 90px;
	height: 90px;
	background-size: cover;
}

#industria01{
	background-image: url("prueba/Icon_Industria.png");
	width: 90px;
	height: 90px;
	background-size: cover;
}

#alimento{
	background-image: url("prueba/Icon_Alimenticio.png");
	width: 90px;
	height: 90px;
	background-size: cover;
}

#classic{
	background-image: url("prueba/Icon_Classic.png");
	width: 90px;
	height: 90px;
	background-size: cover;
}

/* img:hover{
	background: #630000;
}*/


 #usos figure figcaption{
	margin-top: 10px;
	width: 90px;
	height: 40px;
	font-size: 10pt;
	font-family: helvetica;
	color: #B30000;
	vertical-align: middle;

    
    text-align: center;
}

@media screen and (min-width: 480px) {
	.iconos-usos{width: 90px;height: 90px;}
	.iconos-usos img{width: 90px; height: 90px;}
	 #usos figure figcaption{font-size: 15px;}

	 video{
	 	margin-top: 0px;
	width: 100%;
	height: auto;
}
}


#mas-info{
	margin-top: 35px;
	display: inline-block;
	color: white;
	background: #FF0000;
	padding: 5px 25px;
	cursor: pointer;
	font-family: avenir;
	font-size: 9pt;
}

#mas-info:hover{
	background: #630000;
}

#usos a{
	text-decoration: none;
	border-style: none;
	color: black;
}


/*------------------------------------------------------------------------------ Caracteristicas */

#car00{
	font-family: helvetica-bold, Arial;
	font-weight: bold;
	font-size: 20pt;
	text-align: center;
	color: #FFFFFF;
	margin-top: 50px;
}

#caracteristicas{
	background: #b30000;
	width: 100%;
	height:  880px;
	position: relative;
	text-align: center;
	border-style: solid;
	border-color: #B30000;
	margin-top: 40px;
}

.cardiv{
	margin-bottom: -80px;
}

.paks img{
	margin-right: 30px;
}

.paks{
	display: inline-block;
	width: 100%;
	height: 200px;
	margin:auto 0px;
	margin-top: 30px;
}

.pak1{
	width: 115px;
	height: 81px;
	
}

.pak2{
	width: 130px;
	height: 84px;
	
}

.pak3{
	width: 115px;
	height: 105px;
	
}

.pak4{
	width: 108px;
	height: 98px;
	
}

.paks figcaption{
	float: right;
	width: 45%;
	height: 160px;
	text-align: justify;
	font-family: helvetica;
	font-size: 10pt;
	color: #FFFFFF;
	margin-left: -50px;
	margin-right: 30px;
}

.paks figcaption p{
	font-size: 15pt;
	margin-top: 5px;
	font-family: helvetica-bold, Arial;
	font-weight: bold;
}

#mas-info2{
	margin-left: 50px;
	display: inline-block;
	color: white;
	background: #FF0000;
	padding: 5px 25px;
	cursor: pointer;
	font-family: avenir;
	font-size: 8pt;
	margin:auto 0px;
}

 #caracteristicas a{
	text-decoration: none;
	border-style: none;
	color: black;
	color: #ffffff;
	}

#mas-info2:hover{
	background: #630000;
}



/*------------------------------------------------------------------Parallax Pagina de inicio*/

#parallax1{
	background-image: url("img/parallax1.jpg");
	width: 100%;
	min-height: 260px;

	background-size: cover;
}

#parallax2{
	background-image: url("img/parallax8.jpg");
	height: 256px;

/*	background-attachment: fixed;
	background-position: center;
	background-repeat: no-repeat;*/
	background-size: cover;
}

#parallax3{
	background-image: url("img/parallax3.png");
	height: 206px;

/*	background-attachment: fixed;
	background-position: center;
	background-repeat: no-repeat;*/
	background-size: cover;
}

#parallax4{
	background-image: url("img/parallax04.png");
	height: 232px;

/*	background-attachment: fixed;
	background-position: center;
	background-repeat: no-repeat;*/
	background-size: cover;
}

#parallax04{
	background-image: url("img/parallax004.png");
	height: 232px;

/*	background-attachment: fixed;
	background-position: center;
	background-repeat: no-repeat;*/
	background-size: cover;
}

#parallax5{
	background-image: url("img/parallax5.jpg");
	height: 232px;

/*	background-attachment: fixed;
	background-position: center;
	background-repeat: no-repeat;*/
	background-size: cover;
}

#parallax6{
	background-image: url("img/parallax6.jpg");
	height: 318px;

/*	background-attachment: fixed;
	background-position: center;
	background-repeat: no-repeat;*/
	background-size: cover;
}

#moto-parallax{
	background-image: url("prueba/Motopakelo.jpg");
	height: 287px;

/*	background-attachment: fixed;
	background-position: center;
	background-repeat: no-repeat;*/
	background-size: cover;
}

#moto-parallax1{
	background-image: url("prueba/Motopakelo1.png");
	height: 287px;

/*	background-attachment: fixed;
	background-position: center;
	background-repeat: no-repeat;*/
	background-size: cover;
}

/*------------------------------------------------------------------Logos */

#logos{
	width: 100%;
	height: 450px;
	background: #f2f0f0;
	text-align: center;

}

#log{
	width: 100%;
	height: 450px;
	margin: 0px auto;
	border-color: #f2f0f0;
	border-style: dashed;


}

#log p{
	margin-top: 30px;
	font-size: 15pt;
	font-family: helvetica-bold, Arial;
	font-weight: bold;
	color: red;

}

#log hr{
	width: 220px;
	height: 2px;
	background-color: #630000;
}

#log figure{
	display: inline-block;
	width: 280px;
	height: 200px;
	width: 120px;
	height: 100px;
	margin: auto;
	margin-top: 5px;
	margin-right: 10px;
	border-style: dashed;
	border-color: #f2f0f0;

}


#log figcaption{
	color: #FB0000;
	font-size: 7.5pt;
	margin-top: 30px;
	font-family: helvetica;

}

#log img{
margin-top: 20px;
}

#logo1{
	width: 49px;
	height: 36px;
}

#logo2{
	width: 78px;
	height: 41px;
}

#logo3{
	width: 48px;
	height: 48px;
}

#logo4{
	width: 49px;
	height: 36px;
}

#logo5{
	width: 65px;
	height: 45px;
}

@media screen and (min-width: 480px) {

#logos{
	height: 600px;
}

	#log figure{
	display: inline-block;
	height: 200px;
	width: 150px;}

	#logo1{
	width: 69px;
	height: 56px;
}

#logo2{
	width: 98px;
	height: 61px;
}

#logo3{
	width: 68px;
	height: 68px;
}

#logo4{
	width: 69px;
	height: 56px;
}

#logo5{
	width: 85px;
	height: 65px;
}
}
/*------------------------------------------------------------ FORMULARIO DE CONTACTO */

.dos-columnas{

	width: 100%;
}

#formulario{
	width: 100%;
	height: 1060px;
	background: #2B2B2B;
	text-align: center;
}

.formulario1{
	width: 100%;
	margin-top: auto;
	color: #ffffff;
	display: inline-block;
	height: 500px;
	vertical-align: middle;

}

.caja1{
	width: 30%;
	height: 20px;
	margin: 10px;
	padding: 2%;
	font-size: 13pt;
	font-family: helvetica;
}

.caja2{
	width: 70%;
	height: 150px;
	margin: 10px;
	padding: 10px;
	font-size: 13pt;
	font-family: helvetica;
}

.caja3{
	width: 70%;
	height: 20px;
	margin: 10px;
	padding: 10px;
	font-size: 13pt;
	font-family: helvetica;
}

.boton{
	padding: 10px;
	margin: 10px;
	width: 75%;
	cursor: pointer;
	background: #b30000;
	border-style: none;
	color: #FFFFFF;
	font-family: avenir;
	font-size: 12pt;
}

.boton:hover{
	opacity: .7;
}

h4{
	font-size: 15pt;
	font-family: helvetica;
}

textarea{
	resize: none;
}



.formulario1 .mex{

	width: 100%;
	height: 50px;
	font-family: helvetica-bold, Arial;
	font-weight: bold;
	font-size: 25pt;
	margin:auto 0px;
}

.formulario1 .mex a{
	text-decoration: none;
	color: white;
}


.formulario1 .info-form{
	width: 250px;
	height: 80px;
	border-color: black;
}


.formulario1 figure figcaption{
	color: #ffffff;
	font-size: 13pt;
	font-family: helvetica;
	width: 85%;
	height: 80px;
	float: right;

}



.formulario1 figure figcaption a{
	text-decoration: none;
	border-style: none;
	color: white;
}



.formulario1 figure .imagen{
	width: 30px;
	height: 30px;
	float: left;
	margin-top: 20px;
	vertical-align: middle;
}



.tel{
	transform: rotate(90deg);
}

.logo{
	width: 150px;
	height: 44px;
	margin-left: 10px;
}
@media screen and (min-width: 480px) {
	.formulario1 .info-form{	margin-left: 120px;}
}

@media screen and (min-width: 645px) {
	.formulario1{width: 45%; margin-top: 50px;}
	#formulario{height: 600px;}
	.formulario1 .info-form{	margin-left: 60px;}
}


/*---------------------------------------------------disA*/

#disA{
	height: 750px;
	width: 100%;
	background: #b30000;
	text-align: center;
	margin-top: -50px;
}

h6{
	font-family: helvetica-bold, Arial;
	font-weight: bold;
	font-size: 15pt;
	color: white;
}

.pe{

	font-family: helvetica;
	font-size: 10pt;
	color: white;
}

.pe span{
	font-family: helvetica-bold, Arial;
	font-weight: bold;
	font-size: 12pt;
}

.pe a{
	text-decoration: none;
	color: white;
	border-style: none;
}

/*--------------------------------------------------------------- Footer */

footer{
	width: 100%;
	height: 120px;
	background: #b30000;
	text-align: center;
}

footer div{
	position: relative;
	display: inline-block;
	width: 40px;
	height: 40px;
	border-radius: 50%;
	text-align: center;
	background: white;
	text-align: center;
	background: white;
	margin-top: 20px;
	margin-right: 10px;
	cursor: pointer;
	margin-bottom:15px;
}

footer p{
	color: #ffffff;
	font-size: 10pt;
	margin-right: 0px;
	margin: 0px;
	font-family: helvetica;
}

footer img{
	width: 25px;
	height: 25px;
	margin-top: 7px;
}

footer div:hover{
	background: #DB2222;
}

/*---------------------------------------------------------------------------------- Pagina web historia */


.Historia{
	position: relative;
	width: 100%;
	height: 403px;
	background: #ff0000;
	text-align: center;
}

.Historia1 figcaption img{
	width: auto;
	height: 70px;
	margin-top: 10px;
	margin-left: -30px;
}
.Historia figcaption img{
	width: auto;
	height: 70px;
	margin-top: 10px;
		margin-left: -30px;

}

.Historia1{
	width: 100%;
	height: 403px;
	background: #b30000;
	text-align: center;

}

.Historia figure, .Historia1 figure{
	width: 100%;
	height: 403px;
	margin: 0 auto;
	display: table;
}

h2{
	width: 125px;
	height: 100px;

	font-size: 30pt;
	line-height: 100px;
	font-family: avenir-next;
	background: linear-gradient(white, grey);
	-webkit-background-clip: text;
	-webkit-text-fill-color: transparent;
	margin-left: 82px;
	margin: auto;

}

.Historia figcaption{
	width: 100%;
	height: 186px;
}

.Historia1 figcaption{
	width: 100%;
	height: 186px;
}

.Historia img{

	width: auto;
	height: 160px;
	
	margin-top: 30px;
}

.Historia1 img{
	width: auto;
	height: 160px;
	
	margin-top: 30px;
}

.Historia p, .Historia1 p{
	width: `100%;
	height: 66px;
	
	color: #ffffff;
	font-family: helvetica;
	font-size: 16px;
	
	margin: auto;

}
.Historia1 p{
	margin-right: 25px;
}

/*-----------------------------------------------------------------------------------PAKELOLAB-------------------------*/

#pakelolab{
	width: 100%;
	height:953px;
	background: #ff0000;

}

#lab{
	width: 100%;
	height: 1053px;
	margin: 0px auto;

}

.paklab{
	width: 100%;
	height: 700px;
	display: inline-block;
	margin: 5px;
	text-align: center;
	

}

#lab1 {
	width: 412px;
	height: 274px;
	width: 90%;
	height: 25%;	

}

#lab2{
	width: 450px;
	height: 276px;
	width: 100%;
	height: 25%;

}

#figlab{
	width: 100%;
	height: 720px;
	width: 90%;
	height: 100%;
	text-align: justify;
	margin: 0px auto;


}

#figlab2{
	
	width: 90%;
	height: 75%;
	text-align: justify;
	margin: 0px auto;
	margin-top: -230px;
}

.paklab h3{
	color: #ffffff;
	font-size: 15px;
	font-family: helvetica-bold, Arial;
	font-weight: bold;
	text-align: center;
}

.paklab p{
	font-size: 13px;
	color: #ffffff;
	font-family: helvetica;
	margin-bottom: 0em;
	margin-top: 0em;
}

@media screen and (min-width: 480px){
	#lab1{height: 250px;}
	#figlab2{margin-top: -200px;}
	#lab2{margin-top: 00px; height: 250px;}
	#pakelolab{height: 1033px;}
	.Historia1 p{margin-right: 0px;}
}

/*-------------------------------------------------------------------------------CATALOGOS----------------*/

#catalogo{
	width: 100%;
	height: 647px;
	height: 1300px;
	background: #FFFFFF;
}

#cat{
	width: 950px;
	width: 100%;
	height: 887px;

	margin:0px auto;
	text-align: center;

}

#cat img{
	width: 200px;
	height: 137px;
	display: inline-block;
	color: red;
}

#cat h3{
	color: #b30000;
	font-size: 19px;
	font-family: helvetica-bold, Arial;
	font-weight: bold;
}

#cat figure{
	width: 210px;
	height: 240px;
	margin: 10px;
	margin-top: 50px;
	display: inline-block;
}

#cat figcaption{
	width: 200px;
	height: 50px;
}

#cat figcaption a{
	text-decoration: none;
}

#cat figcaption p{
	width: 100px;
	padding: 3px;
	margin:0px auto;
	background: #FB0000;
	color: #ffffff;
	font-family: helvetica;
}

#cat figcaption p:hover{
	background: #b30000;
}

#gris{
	width: 98px;
	height: 8px;
	background:  rgba(130, 130, 130, 1);
	margin-top: 50px;
	margin-bottom: 25px;
}

#Advertencia{
	text-align: justify;
}

#Advertencia p{
	color: #565656;
	font-size: 15px;
}

/*---------------------------------------------------------------------MULTIMEDIA--------------------------------*/

#videos-pakelo{
	position: relative;
	width: 100%;
	height: 1980px;
	background: #ffffff;
	text-align: center;
}

#videos{
	width: 950px;
	width: 100%;
	height: 100%;
	margin: 0px auto;

}

#videos div{
	margin-top: 50px;
	border-style: solid;
	border-width: 6px;
	width: 303px;
	height: 227px;
	display: inline-block;
	margin-left: 2px;
	margin-right: 25px;
	
}

#videos iframe{
	width: 100%;
	height: 227px;

}

#videos figcaption{
	color: #b30000;
	font-size: 17px;
	font-weight: bold;
	margin-top: 20PX;
	font-family: helvetica-bold, Arial;
	font-weight: bold;
}

/*-------------------------------------------------------------Buscador de aceite ------------------------------------------*/

#buscador{
	/*height="860" scrolling="no" width="100%" style="top:-150px;  z-index: -2; position: absolute;*/
	height: 840px;
	width: 100%;
	margin-top: -160px;
	
}

@media screen and (min-width: 480px){#buscador{height: 820px;}}

.loader {
    position: fixed;
    left: 0px;
    top: 0px;
    width: 100%;
    height: 100%;
    z-index: 9999;
    background: url('img/pakload.gif') 50% 50% no-repeat rgb(249,249,249);
}
}

/*----------------------------------------------------------------------------------------------------*/
/*----------------------------------------------------------------------------------------------------*/
/*----------------------------------------------------------------------------------------------------*/
			/*----------------------780 modo tablet.------------------------------*/
/*----------------------------------------------------------------------------------------------------*/
/*----------------------------------------------------------------------------------------------------*/
/*----------------------------------------------------------------------------------------------------*/

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

	

	/*--------------------------------------------------------- Linea de contactos y redes sociales=================================================================================================*/


 #social{
	width: 100%;
	height: 30px;
	background: #565656;
	position: relative;
	margin: 0px;
	margin-bottom: 0px;
	text-align: center;
}

#info-social{
	width: 750px;
	height: 30px;
	background: #565656;
	position: relative;
	display: inline-block;
}

.ct{
	position: relative;
	display: inline-block;
	width: 25%;
	background: #565656;
	font-size: 10pt;
	font-family: helvetica;
	color: #EDEDED;
	vertical-align: middle;
	padding: 6px 8px;
	float: left;
}

#contacto img{
	height: 15px;
	width: 20px;
	vertical-align: middle;
}

#whatsapp img{
	height: 15px;
	width: 15px;
	vertical-align: middle;
}

.redes-sociales img{
	height: 12px;
	width: 12px;
	margin-top: 4px;
}

.redes-sociales{
	position: relative;
	display: inline-block;
	width: 40%;
	text-align: right;
	background: #565656;
	padding: 3.5px 10px;
	float: right;
}



.rs{
	position: relative;
	display: inline-block;
	width: 20px;
	height: 20px;
	border-radius: 50%;
	text-align: center;
	background: white;
	text-align: center;
}

.rs:hover{
	background: #C0BDBD;
	cursor: pointer;
}

/*----------------------------------------------------Navegador de la pagina y logo */

header {
	width: 100%;
	height: 110px;
	background: #FF0000;
	position: relative;
	text-align: center;
}

#menu1{
	display: none;
}

#menu{
	display: initial;
}

#menu {
	width: 750px;
	height: 110px;
	position: relative;
	display: inline-block;
}


header h1{
		display: inline-block;
		width: 25%;
		margin:0px;
		height: 110px;
		float: left;
		background:  #FF0000;
		line-height: 110px;
				
}

	header h1 figure{
		width: 200px;
		margin: 0px;
		height: 100px;
		vertical-align: middle;
		float: left;
		background:  #FF0000;
		position: relative;
		z-index: 40;
			
}

	header h1 figure img{
		height: 68px;
		width:  100%;
		vertical-align: middle;
		position: relative;

		

	}

header nav{

	display: inline-block;
	width: 75%;
	margin: 0px;
	background: #FF0000;
	height: 100%;
	line-height: 110px;
	position: relative;
		




}


header nav ul li{
	position: relative;
	height: 100%;
	margin:0px;
	display: inline-block;
	list-style: none;
	background: red;

}

header nav ul {
	margin: 0px;
	float: left;
	height: 110px;
}

header nav ul li a{
	text-decoration: none;
	color: #FFFFFF;
	font-size: 9px;
	font-family: avenir;
	padding: 7px;
	background: #FF0000;
	margin: 0px;
	font-weight: bold;
}

#buscador{
	background: #565656;
}

#buscador:hover{
	background: #B30000;
}

#buscador img{
width: 11px;
height: 11px;
}

header nav ul li a:hover{
	background: #B30000;
}

/*----------------------------------------------vide0------------------------------------------------------------------------------*/


.ytvideo iframe{
	height: 560px;
}


/*----------------------------------------------------------------------------  Usos de aceite */

#usos{
	background: #FFFFFF;
	width: 100%;
	height: 450px;
	text-align: center;
	position: relative;
}

.iconos-usos{
	position: relative;
	display: inline-block;
	width: 90px;
	height: 90px;
	margin-right: 30px;
	margin-top: 60px;
	cursor: pointer;
	
}

.iconos-usos img{
	width: 90px;
	height: 90px;

}

 #usos figure figcaption{
	margin-top: 10px;
	width: 90px;
	height: 40px;
	font-size: 10pt;
	font-family: helvetica;
	color: #B30000;
	vertical-align: middle;
    float: left;
}

#mas-info{
	margin-top: 70px;
	display: inline-block;
	color: white;
	background: #FF0000;
	padding: 5px 25px;
	cursor: pointer;
	font-family: avenir;
	font-size: 12pt;
}

#mas-info:hover{
	background: #630000;
}

#usos a{
	text-decoration: none;
	border-style: none;
	color: black;
}


/*------------------------------------------------------------------------------ Caracteristicas */

#car00{
	font-family: helvetica-bold, Arial;
	font-weight: bold;
	font-size: 20pt;
	text-align: center;
	color: #FFFFFF;
	margin-top: 50px;
}

#caracteristicas{
	background: #b30000;
	width: 100%;
	height:  920px;
	position: relative;
	text-align: center;
	border-style: solid;
	border-color: #B30000;
}

.cardiv{
	margin-bottom: -60px;
}

.paks img{
	float: left;
	margin-right: 0px;
	margin-left: 80px;
}

.paks{
	display: inline-block;
	width: 560px;
	height: 175px;
}

.pak1{
	width: 115px;
	height: 81px;
	
}

.pak2{
	width: 130px;
	height: 84px;
	
}

.pak3{
	width: 115px;
	height: 105px;
	
}

.pak4{
	width: 108px;
	height: 98px;
	
}

.paks figcaption{
	float: right;
	width: 320px;
	height: 160px;
	text-align: justify;
	font-family: helvetica;
	font-size: 12pt;
	color: #FFFFFF;
}

.paks figcaption p{
	font-size: 19pt;
	margin-top: 5px;
	font-family: helvetica-bold, Arial;
	font-weight: bold;
	text-align: left;
}

#mas-info2{
	margin-left: 50px;
	display: inline-block;
	color: white;
	background: #FF0000;
	padding: 5px 25px;
	cursor: pointer;
	font-family: avenir;
	font-size: 12pt;
}

#mas-info2:hover{
	background: #630000;
}

/*------------------------------------------------------------------Parallax Pagina de inicio*/


#parallax1{
	background-image: url("img/parallax1.jpg");
	width: 100%;
	height: 400px;

	background-attachment: fixed;
	background-position: center;
	background-repeat: no-repeat 50% 50%;
	background-size: cover;
}

#parallax2{
	background-image: url("img/parallax8.jpg");
	
	height: 256px; 

    background-attachment: fixed;
	background-position: center;
	background-repeat: no-repeat 50% 50%;
	background-size: cover;
}

#parallax3{
	background-image: url("img/parallax3.jpg");
	height: 256px;

	background-attachment: fixed;
	background-position: center;
	background-repeat: no-repeat;
	background-size: cover;
}

#parallax4{
	background-image: url("img/parallax04.png");
	height: 232px;

	
	background-position: center;
	background-repeat: no-repeat;
	background-size: cover;
}

#parallax04{
	background-image: url("img/parallax004.png");
	height: 232px;

	background-attachment: fixed;
	background-position: center;
	background-repeat: no-repeat;
	background-size: cover;
}

#parallax5{
	background-image: url("img/parallax5.jpg");
	height: 232px;

	background-attachment: fixed;
	background-position: center;
	background-repeat: no-repeat;
	background-size: cover;
}

#parallax6{
	background-image: url("img/parallax6.jpg");
	height: 318px;

	background-attachment: fixed;
	background-position: center;
	background-repeat: no-repeat;
	background-size: cover;
}

#moto-parallax{
	background-image: url("prueba/Motopakelo.jpg");
	height: 287px;

	background-attachment: fixed;
	background-position: center;
	background-repeat: no-repeat;
	background-size: cover;
}

#moto-parallax1{
	background-image: url("prueba/Motopakelo1.png");
	height: 287px;

	background-attachment: fixed;
	background-position: center;
	background-repeat: no-repeat;
	background-size: cover;
}
/*------------------------------------------------------------------Logos */

#logos{
	width: 100%;
	height: 450px;
	background: #f2f0f0;
	text-align: center;

	
}

#log{
	width: 720px;
	height: 450px;
	margin: 0px auto;
	border-color: #f2f0f0;
	border-style: dashed;

}

#log p{
	margin-top: 30px;
	font-size: 25pt;
	font-family: helvetica-bold, Arial;
	font-weight: bold;
	color: red;

}

#log hr{
	width: 220px;
	height: 2px;
	background-color: #630000;
}

#log figure{
	display: inline-block;
	width: 160px;
	height: 200px;
	width: 120px;
	height: 150px;
	margin: auto;
	margin-top: 50px;
	margin-right: 10px;

}


#log figcaption{
	color: #FB0000;
	font-size: 7.5pt;
	margin-top: 30px;
	font-family: helvetica;

}

#log img{
margin-top: 20px;
}

#logo1{
	width: 69px;
	height: 56px;
}

#logo2{
	width: 78px;
	height: 81px;
}

#logo3{
	width: 68px;
	height: 68px;
}

#logo4{
	width: 69px;
	height: 56px;
}

#logo5{
	width: 75px;
	height: 65px;
}
/*------------------------------------------------------------ FORMULARIO DE CONTACTO */

#formulario{
	width: 100%;
	height: 600px;
	background: #2B2B2B;
	text-align: center;
}

.formulario1{
	margin-top: auto;
	color: #ffffff;
	display: inline-block;
	width: 48%;
	height: 500px;
	vertical-align: middle;
}

.caja1{
	width: 30%;
	height: 20px;
	margin: 10px;
	padding: 2%;
	font-size: 13pt;
	font-family: helvetica;
}

.caja2{
	width: 70%;
	height: 150px;
	margin: 10px;
	padding: 10px;
	font-size: 13pt;
	font-family: helvetica;
}

.caja3{
	width: 70%;
	height: 20px;
	margin: 10px;
	padding: 10px;
	font-size: 13pt;
	font-family: helvetica;
}

.boton{
	padding: 10px;
	margin: 10px;
	width: 75%;
	cursor: pointer;
	background: #b30000;
	border-style: none;
	color: #FFFFFF;
	font-family: avenir;
	font-size: 12pt;
}

.boton:hover{
	opacity: .7;
}

h4{
	font-size: 25pt;
	font-family: helvetica;
}

textarea{
	resize: none;
}



.formulario1 .mex{
	margin-top: 45px;
	width: 300px;
	height: 50px;
	font-family: helvetica-bold, Arial;
	font-weight: bold;
	font-size: 25pt;
	margin-left: 125px;
}

.formulario1 .info-form{
	width: 300px;
	height: 80px;
}


.formulario1 figure figcaption{
	color: #ffffff;
	font-size: 14pt;
	font-family: helvetica;
	width: 230px;
	height: 60px;
	margin-top: -30px;
}

.abajo{
	margin-top: 30px;
}

.formulario1 figure .imagen{
	float: left;
	line-height: 80px;
	width: 30px;
	height: 30px;
	margin-right: 20px;
	margin-top: 10px;
}

.p{
	margin-top: -20px;
}

.tel{
	transform: rotate(90deg);
}

.logo{
	width: 150px;
	height: 44px;
	margin-left: 0px;
}

.formulario1 figure figcaption{
	float: left;
}

.formulario1 figure figcaption p{
	float: left;
}



/*---------------------------------------------------disA*/

#disA{
	height: 650px;
	width: 100%;
	background: #b30000;
	text-align: center;
	margin-top: -50px;
}

#disA section{
	width: 100%;
	height: 550px;
	margin-top: -50px;
}

#disA div{
	width: 35%;
	display: inline-block;
	vertical-align: top;

}

h6{
	font-family: helvetica-bold, Arial;
	font-weight: bold;
	font-size: 25pt;
	color: white;
}

.pe{

	font-family: helvetica;
	font-size: 13pt;
	color: white;
}

.pe span{
	font-family: helvetica-bold, Arial;
	font-weight: bold;
	font-size: 15pt;
}

.pe a{
	text-decoration: none;
	color: white;
	border-style: none;
}



/*--------------------------------------------------------------- Footer */

footer{
	width: 100%;
	height: 120px;
	background: #b30000;
	text-align: center;
}

footer div{
	position: relative;
	display: inline-block;
	width: 40px;
	height: 40px;
	border-radius: 50%;
	text-align: center;
	background: white;
	text-align: center;
	background: white;
	margin-top: 20px;
	margin-right: 10px;
	cursor: pointer;
	margin-bottom:15px;
}

footer p{
	margin-top: 20px;
	color: #ffffff;
	font-size: 10pt;
	margin-right: 0px;
	margin: 0px;
	font-family: helvetica;
}

footer img{
	width: 25px;
	height: 25px;
	margin-top: 7px;
}

footer div:hover{
	background: #DB2222;
}

/*---------------------------------------------------------------------------------- Pagina web historia */


.Historia{
	position: relative;
	width: 100%;
	height: 403px;
	background: #ff0000;
	text-align: center;
}

.Historia1{
	width: 100%;
	height: 403px;
	background: #b30000;
	text-align: center;

}

.Historia1 figcaption img{
	width: auto;
	height: 70px;
	margin-top: 10px;
	margin-right: -30px;
}
.Historia figcaption img{
	width: auto;
	height: 70px;
	margin-top: 10px;
		margin-left: -30px;
}

.Historia figure, .Historia1 figure{
	width: 720px;
	height: 403px;
	margin: 0 auto;
	display: table;
}

h2{
	width: 125px;
	height: 100px;

	font-size: 30pt;
	line-height: 100px;
	font-family: avenir-next;
	background: linear-gradient(white, grey);
	-webkit-background-clip: text;
	-webkit-text-fill-color: transparent;
	margin-left: 82px;
	margin: auto;
	margin-top: 90px;

}

.Historia figcaption{
	float: right;
	width: 414px;
	height: 406px;
	width: 260px;
}

.Historia1 figcaption{
	width: 414px;
	height: 406px;
	width: 260px;
}

.Historia img{
	float: left;
	width: auto;
	height: 180px;
	margin-top: 70px;
}

.Historia1 img{
	margin-top: 100px;
	float: right;
	width: auto;
	height: 180px;
	margin-top: 70px;
}

.Historia p, .Historia1 p{
	width: `100%;
	height: 66px;
	
	color: #ffffff;
	font-family: helvetica;
	font-size: 18px;
	margin-left: 55px;
	margin-top: 80px;
	margin: auto;

}


/*-----------------------------------------------------------------------------------PAKELOLAB-------------------------*/

#pakelolab{

	width: 100%;
	height: 733px;
	background: #ff0000;

}

#lab{
	width: 720px;
	height: 733px;
	margin: 0px auto;



}

.paklab{

	width: 48%;
	height: 95%;
	display: inline-block;
	margin: 5px;
	text-align: center;	

}




#lab1 {
	width: 412px;
	height: 274px;
	width: 90%;
	height: 25%;
	margin-bottom: 00px;

}

#lab2{
	width: 100%;
	height: 25%;
	margin-bottom: 130px;
	

}

#figlab{
	
	width: 412px;
	height: 420px;
	width: 90%;
	height: 100%;
	text-align: justify;
	margin: 0px auto;



}

#figlab2{
	

	width: 450px;
	height: 400px;
	width: 90%;
	height: 100%;
	text-align: justify;
	margin: 0px auto;


}

.paklab h3{
	color: #ffffff;
	font-size: 15px;
	font-family: helvetica-bold, Arial;
	font-weight: bold;
	text-align: center;
}

.paklab p{
	font-size: 17px;
	font-family: helvetica;
	margin-bottom: 0em;
	color: #ffffff;

}

@media screen and (min-width: 1120px){
	.paklab p{
	font-size: 17px;}
	#lab2{margin-top: 0px;}
}

/*-------------------------------------------------------------------------------CATALOGOS----------------*/

#catalogo{
	width: 100%;
	height: 647px;
	height: 1300px;
	background: #FFFFFF;
}

#cat{
	width: 950px;
	width: 100%;
	height: 887px;

	margin:0px auto;
	text-align: center;

}

#cat img{
	width: 200px;
	height: 137px;
	display: inline-block;
	color: red;
}

#cat h3{
	color: #b30000;
	font-size: 19px;
	font-family: helvetica-bold, Arial;
	font-weight: bold;
}

#cat figure{
	width: 210px;
	height: 240px;
	margin: 10px;
	margin-top: 50px;
	display: inline-block;
}

#cat figcaption{
	width: 200px;
	height: 50px;
}

#cat figcaption a{
	text-decoration: none;
}

#cat figcaption p{
	width: 100px;
	padding: 3px;
	margin:0px auto;
	background: #FB0000;
	color: #ffffff;
	font-family: helvetica;
}

#cat figcaption p:hover{
	background: #b30000;
}

#gris{
	width: 98px;
	height: 8px;
	background:  rgba(130, 130, 130, 1);
	margin-top: 50px;
	margin-bottom: 25px;
}

#Advertencia{
	text-align: justify;
}

#Advertencia p{
	color: #565656;
	font-size: 15px;
}

/*---------------------------------------------------------------------MULTIMEDIA--------------------------------*/

#videos-pakelo{
	position: relative;
	width: 100%;
	height: 1080px;
	background: none;
	text-align: center;
}

#videos{
	width: 950px;
	width: 100%;
	height: 1200px;
	margin:0px auto;
}

#videos div{
	margin-top: 50px;
	border-style: solid;
	border-width: 6px;
	width: 303px;
	height: 227px;
	display: inline-block;
	margin-left: 25px;
	margin-right: 25px;
	
}

#videos iframe{
	width: 100%;
	height: 227px;

}

#videos figcaption{
	color: #b30000;
	font-size: 17px;
	font-weight: bold;
	margin-top: 20PX;
	font-family: helvetica-bold, Arial;
	font-weight: bold;
}

/*-------------------------------------------------------------Buscador de aceite ------------------------------------------*/

#buscador{
	/*height="860" scrolling="no" width="100%" style="top:-150px;  z-index: -2; position: absolute;*/
	height: 760px;
	width: 100%;
	margin-top: -160px;
	
}

.loader {
    position: fixed;
    left: 0px;
    top: 0px;
    width: 100%;
    height: 100%;
    z-index: 9999;
    background: url('img/pakload.gif') 50% 50% no-repeat rgb(249,249,249);
}

	/*------------------958px min width==============================================================================================================================================================*/



}

/*----------------------------------------------------------------------------------------------------*/
/*----------------------------------------------------------------------------------------------------*/
/*----------------------------------------------------------------------------------------------------*/
			/*----------------------950 modo tablet intermedio.------------------------------*/
/*----------------------------------------------------------------------------------------------------*/
/*----------------------------------------------------------------------------------------------------*/
/*----------------------------------------------------------------------------------------------------*/

	
@media screen and (min-width: 950px){



	/*------------------Redes sociales*/

	#info-social{
		width: 920px;
	}

	.ct{
		font-size: 9pt;
		width: 20%;
	}

	.redes-sociales{
	width: 50%;
	}

	/*---------------------navegador -------------------------------*/
	
	#menu {
	width: 920px;
	}

	header nav ul li a{
	font-size: 10px;
	padding: 13px;
}

	header h1 figure{
	
		z-index: 40;
}


/*------------------------------------------------logos-----------------------------------------------*/

#log{
	width: 920px;
}

#log figure{
	width: 140px;
	height: 200px;
	}


	#logo1{
	width: 98px;
	height: 72px;
}

#logo2{
	width: 156px;
	height: 82px;
}

#logo3{
	width: 96px;
	height: 96px;
}

#logo4{
	width: 98px;
	height: 72px;
}

#logo5{
	width: 129px;
	height: 89px;
}

#log figcaption{
	font-size: 15pt;
	}

/*------------------------------------------------------------------caracteristicas--------------------------------------------*/



.cardiv{
	margin-bottom: 30px;
}


}

/*----------------------------------------------------------------------------------------------------*/
/*----------------------------------------------------------------------------------------------------*/
/*----------------------------------------------------------------------------------------------------*/
			/*----------------------1120 modo webSite.------------------------------*/
/*----------------------------------------------------------------------------------------------------*/
/*----------------------------------------------------------------------------------------------------*/
/*----------------------------------------------------------------------------------------------------*/


@media screen and (min-width: 1120px){
		

	
	/**---------------------redes sociales---------------------------------------------------------------------------------*/

		#info-social{
		width: 980px;
	}


	.ct{
		font-size: 10pt;
		width: 18%;
	}

	.redes-sociales{
	width: 50%;
	}

	/*-----------------------navegador---------------------------------------------------------------------------------------*/

		header nav ul li a{
	font-size: 11px;
	}
	
	#menu {
	width: 980px;
	}


	/*----------------------------- caracteristicas  ------------------------------------------------------------------------*/

	#caracteristicas{
	height:  600px;
}


/*---------------------Logos ------------------------------------------------------------------------------------------------*/

#log{
	width: 980px;
}

#logos figure{
	margin-right: 20px;
}



/*-------------------------formulario ---------------------------------------------------------------------------------------*/

#formulario{
	height: 560px;
}

.caja1{
	width: 25%;
}

.caja2{
	width: 58%;
}

.caja3{
	width: 58%;
}

.boton{
	width: 60.5%;

}

/*----------------------------------Historia---------------------------------------------------------------------------------*/

.Historia figure, .Historia1 figure{
	width: 980px;
}

.Historia img{
	height: 250px;
	width: auto;
}

.Historia1 img{
		height: 250px;
	width: auto;

}

/*-----------------------------------------------------pakelolab-------------------------------------------------------------*/

#lab{
	width: 700px;
}


/*---------------------------------------------------Catalogo----------------------------------------------------------------*/

#cat{
	width: 980px;
}



/*-------------------------------------Multimedia---------------------------------------------------------------------------*/

#videos-pakelo{
	position: relative;
	width: 100%;
	height: 780px;
	background: none;
	text-align: center;
}

#videos{
	height: 700px;
	width: 70%;
	}



}