html{

}

#bg {
  position: fixed; 
  top: 0; 
  left: 0; 
	
  /* Preserve aspet ratio */
  min-width: 100%;
  min-height: 100%;
}

body{
	font-size: medium;
	font-family: "Lucida Grande", "Lucida Sans Unicode", sans-serif;
}

/*types*/

.didot {
	font-family: 'Varela Round', sans-serif;	/*color: red;*/
}

.museo {
	font-family: 'Fredoka One', cursive;	/*color: blue;*/
}

.lucida{
	font-family: 'Varela Round', sans-serif;	/*color: green;*/
}

a.negro:link, a.negro:visited, a.negro:hover, a.negro:active{
	color: #000;
}

h1.didot{
	font-size: 7.1em;
	/*position: absolute;
	top: -6px;
	left: 162px;*/
}

h2.didot{
	font-size: 5.5em;
	/*position: absolute;
	top: 110px;
	left: 189px;*/
}

h3.didot{
	font-size: 12pt;
	font-style: italic;
	line-height: 1em;	/*position: absolute;
	top: 220px;
	left: 63px;
	text-align: center;*/
}

h4.didot{
	font-size: 1.5em;
	font-style: italic;
	line-height: 1em;
	/*position: absolute;
	top: 359px;
	left: 108px;
	text-align: center;*/
}

h5.didot{
	font-size: 1.2em;
	font-style: italic;
	letter-spacing: 0.05em;
	line-height: 1em;
	/*position: absolute;
	top: 439px;
	left: 107px;
	text-align: center;*/
}

p.didot{
	font-size: 0.8em;
	font-style: italic;
	line-height: 1.2em;
	/*position: absolute;
	top: 512px;
	left: 140px;
	text-align: center;*/
}

h1.museo{
	font-size: 2.6em;
	line-height: 1.2em;
	/*position: absolute;
	top: 60px;
	left: 452px;
	text-align: center;*/
}

h2.museo{
	font-size: 1.2em;
	line-height: 1.2em;
	/*position: absolute;
	top: 165px;
	left: 444px;
	text-align: center;*/
}

h3.museo{
	font-size: 0.9em;
	line-height: 1.2em;	/*position: absolute;
	top: 283px;
	left: 462px;
	text-align: center;*/
}

h4.museo{
	font-size: 0.8em;
	line-height: 1.2em;
	/*position: absolute;
	top: 378px;
	left: 489px;
	text-align: center;*/
}

h5.museo{
	font-size: 17px;
	line-height: 1.2em;
	font-family: 'Fredoka One', cursive;	/*text-align: center;
	position: absolute;
	top: 452px;
	left: 470px;*/
}

p.museo{
	font-size: 15px;
	line-height: 0.8;	/*text-align: center;
	position: absolute;
	top: 549px;
	left: 518px;*/
}

h1.lucida{
	font-size: 0.9em;
	line-height: 1.4em;
	/*text-align: center;
	position: absolute;
	top: 98px;
	left: 695px;*/
}

h2.lucida{
	font-size: 0.8em;
	line-height: 1.45em;
	/*position: absolute;
	top: 196px;
	left: 660px;
	text-align: center;*/
}

h3.lucida{
	font-size: 0.7em;
	line-height: 1.45em;
	/*text-align: center;
	position: absolute;
	top: 360px;
	left: 701px;*/
}

p{
	font-size: 0.5em;
	line-height: 1.4em;
	/*text-align: center;
	color: green;
	position: absolute;
	top: 499px;
	left: 646px;*/
}

p.avenir{
	font-size: 14px;
	line-height: 1.4em;
	color: #0071bc;	/*position: absolute;
	top: 85px;
	left: 978px;
	text-align: center;
	color: red;*/
}

/*temrina types*/

#contenedorMenu{
	height: 149px;
	background: url(../assets/fondos/papelMenu.png);
	z-index: -2;
	position: relative;
}

#menu{
	height: 150px;
	width: 1024px;
	margin: auto;
}

#menu h5.elementoMenu{
	width: 110px;
	text-align: center;
	float: left;
	margin-top: 110px;
	font-family: 'Fredoka One', cursive;
}
.plecazul {
	background-color: #0071bc;
	height: 50px;
	width: 100%;
	position: absolute;
	left: 0px;
	top: 99px;
	z-index: -1;
}

#menu #lang{
	width: 95px;
	text-align: center;
	float: left;
	margin-top: -25px;
	margin-right: 0%;
	margin-left: 75%;
}

#menu a:link, #menu a:visited{
	color: #FFFFFF;
	text-decoration: none;
}

#menu a:hover, #menu a:active{
	color: #bbb;
	text-decoration: none;
}

#lineaMenu {
	
	height: 120px;
	position: fixed;
	top: 0px;
	right: 0px;
	left: 0px;
	z-index: 40;
	
	/*height: 1px;*/
	border-bottom: 1px solid #fff;
	
}

/*landing*/

div.parte{
	position: relative;
	min-height: 699px;
	/* [disabled]top: 500px; */
}

#botella1{
	position: absolute;
	top: 500px;
	left: -210px;
	z-index: 1;
}
#sobrenosotros {
	position: absolute;
	top: 260px;
	left: 0px;
}

#botella2{
	position: absolute;
	top: 950px;
	left: 900px;
}
#pinacontacto {
	position: absolute;
	top: -400px;
	left: 750px;
	z-index: 0;
}
#mangoequipo {
	position: absolute;
	top: -280px;
	left: -200px;
	z-index: 1;
}
#picfooter {
	position: absolute;
	left: 5%;
	top: 4733px;
}

#olivo1{
	position: absolute;
	top: 31px;
	right: 163px;
}

#landing{
	position: absolute;
	top: 120px;
	left: 350px;
}

#saltoLanding{
	height: 50px;
}

div.lineaLanding{
	height: 1px;
	border-top: 1px solid #d7d7d7;
	border-bottom: 1px solid #ffffff;
	background: #000;
	width: 263px;
	margin: auto;
}

/*termina landing*/

/*history one*/

#historyOne{
	position: absolute;
	top: 128px;
	left: 301px;
}

div.lineaHistroy{
	height: 1px;
	border-top: 1px solid #d7d7d7;
	border-bottom: 1px solid #ffffff;
	background: #000;
	width: 177px;
	margin: auto;
}

/*temrina histroy one*/

/*history two*/

#historyTwo{
	position: absolute;
	top: 109px;
	left: 301px;
}

/*temrina histroy two*/

/*brands*/

#brands{
	position: absolute;
	top: 455px;
	left: 5px;
	width: 1200px;
	height: 500px;
	right: 5px;
}
#botella01{
	position: absolute;
	top: 70px;
	left: 0px;
	cursor: pointer;
}
#botella02{
	position: absolute;
	top: 70px;
	left: 250px;
	cursor: pointer;
}
#botella03{
	position: absolute;
	top: 70px;
	left: 500px;
	cursor: pointer;
}
#botella04 {
	position: absolute;
	top: 70px;
	left: 750px;
	cursor: pointer;
}
#botella05 {
	position: absolute;
	top: 70px;
	left: 1000px;
	cursor: pointer;
}
#botella06 {
	position: absolute;
	top: 300px;
	left: 0px;
	cursor: pointer;
}
#botella07 {
	position: absolute;
	top: 300px;
	left: 250px;
	cursor: pointer;
}
#botella08 {
	position: absolute;
	top: 300px;
	left: 500px;
	cursor: pointer;
}
#botella09 {
	position: absolute;
	top: 300px;
	left: 750px;
	cursor: pointer;
}
#botella10 {
	position: absolute;
	top: 300px;
	left: 1000px;
	cursor: pointer;
}

#ramitas2{
	position: absolute;
	left: -60px;
	top: 7830px;
}

div.lineaBrands{
	width: 216px;
	height: 2px;
	background: #000;
	border-bottom: 1px solid #fff;
	margin: auto;
}

#nombreOlaf{
	position: absolute;
	top: 399px;
	left: 98px;
	cursor: pointer;
}

#nombreOlive{
	position: absolute;
	top: 399px;
	left: 242px;
	cursor: pointer;
}

#nombreValentto{
	position: absolute;
	top: 399px;
	left: 463px; 
	cursor: pointer;
}

/*termina brands*/

/*olaf brand*/

#olafBrand{
	position: absolute;
	top: 200px;
	left: 20%;
	width: 1024px;
	height: 400px;
}

#olafLogo{
	position: absolute;
	top: 202px;
	left: 62px;
}

#botellasOlaf{
	position: absolute;
	top: 41px;
	left: 77px;
	z-index: 2;
}

#infoOlaf{
	position: absolute;
	top: 90px;
	right: 300px;
	z-index: 3;
}

div.lineaBrand{
	height: 2px;
	border-bottom: 1px solid #fff;
	background: #000;
	width: 216px;
}

/*termina olive brand*/

/*olive gold*/

#oliveGoldBrand{
	position: absolute;
	top: 120px;
	left: 60px;
	width: 820px;
	height: 500px;
}

#oliveGoldLogo{
	position: absolute;
	top: 217px;
	left: 75px;
}

#botellasGold{
	position: absolute;
	top: 43px;
	left: 242px;
}


#infoGold{
	position: absolute;
	top: 170px;
	right: 0px;
}


/*termina olive gold*/

/*valento*/

#valentoBrand{
	position: absolute;
	top: 120px;
	left: 60px;
	width: 820px;
	height: 500px;
}

#valentoLogo{
	position: absolute;
	top: 199px;
	left: 32px;
}

#lataValento{
	position: absolute;
	top: 104px;
	left: 274px;
}

#infoValento{
	position: absolute;
	top: 120px;
	right: 0px;
}

/*temrina valento*/

/*fact 1*/

#fact1{
	position: absolute;
	top: 185px;
	left: 60px;
	width: 820px;
	height: 390px;
	z-index: 30;
}

div.lineaFact{
	width: 334px;
	height: 2px;
	border-bottom: 1px solid #fff;
	background: #000;
}

#aceiteAceituna{
	position: absolute;
	top: 345px;
	right: 20px;
	z-index: 0;
}

/*termina fact 1*/

#fact2{
	position: absolute;
	top: 135px;
	left: 60px;
	width: 820px;
	height: 390px;
}

/*benefits*/

#benefits{
	height: 579px;
	width: 940px;
	position: absolute;
	top: 75px;
	/*background: red;*/
}

#indicacion{
	position: absolute;
	top: 18px;
	right: 95px;
}

#indicadorIz1{
	position: absolute;
	top: 236px;
	right: 265px;
}

#uno{
	position: absolute;
	top: 237px;
	left: 506px;
	z-index: 20;
	cursor: pointer;
}

#indicadorIz2{
	position: absolute;
	top: 274px;
	left: 265px;
}

#dos{
	position: absolute;
	top: 275px;
	left: 364px;
	z-index: 21;
	cursor: pointer;
}

#indicadorIz3{
	position: absolute;
	top: 93px;
	right: 265px;
}

#tres{
	position: absolute;
	top: 94px;
	left: 515px;
	z-index: 22;
	cursor: pointer;
}

#indicadorIz4{
	position: absolute;
	top: 129px;
	right: 265px;
}

#cuatro{
	position: absolute;
	top: 130px;
	left: 515px;
	z-index: 23;
	cursor: pointer;
}

#indicadorIz5{
	position: absolute;
	top: 370px;
	right: 265px;
}

#cinco{
	position: absolute;
	top: 371px;
	left: 459px;
	z-index: 24;
	cursor: pointer;
}

#indicadorIz6{
	position: absolute;
	top: 324px;
	right: 265px;
}

#seis{
	position: absolute;
	top: 325px;
	left: 559px;
	z-index: 25;
	cursor: pointer;
}

#indicadorIz7{
	position: absolute;
	top: 365px;
	left: 265px;
}

#siete{
	position: absolute;
	top: 366px;
	left: 312px;
	z-index: 26;
	cursor: pointer;
}

#olivo3{
	position: absolute;
	top: 59px;
	left: 301px;
}

#olives3{
	position: absolute;
	top: 429px;
	left: 731px;
}

#personas{
	height: 555px;
	width: 433px;
	position: absolute;
	bottom: 0px;
	left: 222px;
}

div.persona{
	height: 555px;
	width: 433px;
	overflow: hidden;
}

div.activo{
	display: block;
}

div.inactivo{
	display: none;
}

#infoBenefits1{
	width: 220px;
	position: absolute;
	top: 182px;
	right: 37px;
}

#infoBenefits2{
	width: 220px;
	position: absolute;
	top: 219px;
	left: 37px;
}

#infoBenefits3{
	width: 220px;
	position: absolute;
	top: 40px;
	right: 37px;
}

#infoBenefits4{
	width: 220px;
	position: absolute;
	top: 76px;
	right: 37px;
}

#infoBenefits5{
	width: 220px;
	position: absolute;
	top: 317px;
	right: 37px;
}

#infoBenefits6{
	width: 220px;
	position: absolute;
	top: 271px;
	right: 37px;
}

#infoBenefits7{
	width: 220px;
	position: absolute;
	top: 311px;
	left: 37px;
}

div.lineaDobleBenefits{
	height: 2px;
	background: #000;
	border-bottom: 1px solid #fff;
}

div.lineaBenefits{
	height: 1px;
	background: #000;
	border-bottom: 1px solid #fff;
}

/*termina benefits*/

/*quality 1*/

#quality1{
	width: 745px;
	position: absolute;
	top: 200px;
	left: 25%;
	height: 600px;
}

#cuchara{
	position: absolute;
	top: 7660px;
	right: -30px;
}

#aceitunasAceiteTop{
	position: absolute;
	top: 900px;
	right: 0px;
}

#ramas1{
	position: absolute;
	top: 2370px;
	left: 0px;
}

div.moduloQuality{
	width: 181px;
	position: relative;
	top: 20px;
	float: left;
	text-align:left;
}

div.espacioQuality{
	height: 210px;
	width: 180px;
	float: left;
	position: relative;
	padding-top: 30px;
	color: #0071bc;
	padding-left: 10px;
}

div.lineaDobleQuality{
	width: 177px;
	height: 2px;
	background: #000;
	border-bottom: 1px solid #fff;
}

/*termina quality*/

/*quality 2*/

#quality2{
	width: 765px;
	position: absolute;
	top: 223px;
	left: 88px;
	height: 315px;
}

/*contact*/

#contact{
	width: 1000px;
	position: absolute;
	top: 0px;
	left: 88px;
	height: 385px;
}

#cuchara2{
	position: absolute;
	top: 8712px;
	right: 0px;
}

#olivoContacto{
	position: absolute;
	left: 600px;
	top: 3300px;
}

div.moduloContact{
	width: 350px;
	float: left;
}
div.moduloContactMapa {
	width: 500px;
	float: left;
	z-index: 3;
	position: relative;
}

div.lineaContact{
	width: 177px;
	height: 1px;
	background: #000;
	border-bottom: 1px solid #fff;
}

img#iconoFacebook{
	margin-right: 10px;
}

img#iconoStumble{
	margin-left: 10px;
}

div#contenedorRedes{
	width: 94px;
	margin: auto;
}

/*termina contact*/

/*cms*/

div.indterseccion{
	height: 200px;
}

.rojo{
	color: red;
}

.verde{
	color: green;
}

div.field_with_errors input, div.field_with_errors textarea{
	border-bottom: 1px solid red;
}

input.login{
	padding: 5px 0 5px 5px;
	margin: none;
	border: none;
	background: #fff;
	width: 155px;
}

div.moduloLanding{
	width: 155px;
	float: left;
}

div.moduloHistory{
	width: 280px;
}

div.moduloBrands{
	width: 160px;
	float: left;
}

div.moduloBrand{
	width: 220px;
}

div.moduloFact{
	width: 220px;
	float: left;
}

div.moduloQualityCms{
}

input.cmsLanding{
	background: #fff;
	margin: 0;
	padding: 5px 0 5px 5px;
	border: none;
	width: 155px;
}

input.cmsBrands{
	background: #fff;
	margin: 0;
	padding: 5px 0 5px 5px;
	border: none;
	width: 160px;
}

input.cmsBrand{
	background: #fff;
	margin: 0;
	padding: 5px 0 5px 5px;
	border: none;
	width: 220px;
}

input.cmsFact{
	background: #fff;
	margin: 0;
	padding: 5px 0 5px 5px;
	border: none;
	width: 220px;
}

input.cmsQuality{
	background: #fff;
	margin: 0;
	padding: 5px 0 5px 5px;
	border: none;
	width: 172px;
}

input.cmsContact{
	background: #fff;
	margin: 0;
	padding: 5px 0 5px 5px;
	border: none;
	width: 177px;
}

textarea.cmsLanding{
	background: #fff;
	margin: 0;
	padding: 5px 0 5px 5px;
	border: none;
	width: 155px;
	height: 100px;
	resize: none;
}

textarea.cmsHistory{
	background: #fff;
	margin: 0;
	padding: 5px 0 5px 5px;
	border: none;
	width: 280px;
	height: 100px;
	resize: none;
}

textarea.cmsFact{
	background: #fff;
	margin: 0;
	padding: 5px 0 5px 5px;
	border: none;
	width: 220px;
	height: 100px;
	resize: none;
}

textarea.cmsQuality{
	background: #fff;
	margin: 0;
	padding: 5px 0 5px 5px;
	border: none;
	width: 172px;
	height: 100px;
	resize: none;
}

textarea.cmsContact{
	background: #fff;
	margin: 0;
	padding: 5px 0 5px 5px;
	border: none;
	width: 177px;
	height: 100px;
	resize: none;
}

#infoOlafCms{
	position: absolute;
	top: 10px;
	right: 0px;
}

#infoGoldCms{
	position: absolute;
	top: 10px;
	right: 0px;
}

#infoValentoCms{
	position: absolute;
	top: 10px;
	right: 0px;
}

input.boton{
	background: #bbb;
	border: none;
	
	cursor: pointer;
	
	color: #fff;
	
	padding: 5px 10px;
	
	text-shadow: 1px 1px 1px #999;
	filter: dropshadow(color=#999, offx=1, offy=1);
	
	border-radius: 5px; 
	-moz-border-radius: 5px; 
	-webkit-border-radius: 5px;
	
	background: #e2e2e2; /* Old browsers */
	background: -moz-linear-gradient(top,  #e2e2e2 0%, #bfbfbf 100%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#e2e2e2), color-stop(100%,#bfbfbf)); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top,  #e2e2e2 0%,#bfbfbf 100%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top,  #e2e2e2 0%,#bfbfbf 100%); /* Opera 11.10+ */
	background: -ms-linear-gradient(top,  #e2e2e2 0%,#bfbfbf 100%); /* IE10+ */
	background: linear-gradient(to bottom,  #e2e2e2 0%,#bfbfbf 100%); /* W3C */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#e2e2e2', endColorstr='#bfbfbf',GradientType=0 ); /* IE6-9 */
	
	-webkit-box-shadow:  1px 1px 1px 1px rgba(0, 0, 0, 0.3);
	box-shadow:  1px 1px 1px 1px rgba(0, 0, 0, 0.3);
	border: 1px solid #ccc;
}
