﻿
/* NAVEGACION PRINCIPAL DE LACTOLANDA.COM.PY
··································································································· */
.cero {
	margin-bottom: 0px !important;
}


nav {
	font: 16px 'Lato',"Helvetica Neue", "Helvetica", Helvetica, Arial, sans-serif;
	-webkit-font-smoothing: antialiased;
	-webkit-text-size-adjust: 100%;
	margin: 20px 0 0 !important;
}


.menu {
	-webkit-box-shadow: 1px 0px 0px rgba(252,252,252,0.8);
	box-shadow: 1px 0px 0px rgba(252,252,252,0.8);
	display:block;
	position:relative;
	line-height: 2.6;
	background: rgb(252,252,252); /* Old browsers */
	background: -moz-linear-gradient(top,  rgb(252,252,252) 0%, rgb(252,252,252) 95%, rgb(240,240,240) 95%, rgb(240,240,240) 100%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgb(252,252,252)), color-stop(95%,rgb(252,252,252)), color-stop(95%,rgb(240,240,240)), color-stop(100%,rgb(240,240,240))); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top,  rgb(252,252,252) 0%,rgb(252,252,252) 95%,rgb(240,240,240) 95%,rgb(240,240,240) 100%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top,  rgb(252,252,252) 0%,rgb(252,252,252) 95%,rgb(240,240,240) 95%,rgb(240,240,240) 100%); /* Opera 11.10+ */
	background: -ms-linear-gradient(top,  rgb(252,252,252) 0%,rgb(252,252,252) 95%,rgb(240,240,240) 95%,rgb(240,240,240) 100%); /* IE10+ */
	background: linear-gradient(to bottom,  rgb(252,252,252) 0%,rgb(252,252,252) 95%,rgb(240,240,240) 95%,rgb(240,240,240) 100%); /* W3C */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#fcfcfc', endColorstr='#f0f0f0',GradientType=0 ); /* IE6-9 */
}
.menu,
.menu ul { margin:0; padding:0; list-style:none; position:relative; z-index: 1; }
.menu ul a { display: inline-block; vertical-align: top; }
.menu ul ul a { float:none; }
.menu .mega-menu a { float:none; padding:0; }
.menu ul ul,
.menu .mega-menu,
.menu .mega-menu ol li {
	opacity:0;
	visibility:hidden;
	display:none !important/9;
		-webkit-transition:opacity 150ms ease-in-out;
		-moz-transition:opacity 150ms ease-in-out;
		-o-transition:opacity 150ms ease-in-out;
		-ms-transition:opacity 150ms ease-in-out;
		transition:opacity 150ms ease-in-out;
}

.menu li:hover>ul,
.menu li:hover>.mega-menu,
.menu li:hover>.mega-menu ol li { opacity:1; visibility: visible; display:block !important/9; }
.menu ul:after{ content:""; clear:both; display:block }
.menu ul li {
	float: left;
		-webkit-transition:all 150ms ease-in-out;
		-moz-transition:all 150ms ease-in-out;
		-o-transition:all 150ms ease-in-out;
		-ms-transition:all 150ms ease-in-out;
		transition:all 150ms ease-in-out;
}

.menu ul li a {
	display:block;
	padding:5px 10px;
	color:rgb(118,126,158);
	font-weight: 500;
	text-decoration:none;
	text-transform: uppercase;
}
.menu ul li a:hover,
.menu ul li a.active { color: rgb(0,79,163); }
.menu ul li a:hover {
	color: rgb(0,79,163);

	background: rgb(252,252,252); /* Old browsers */
	background: -moz-linear-gradient(top,  rgb(252,252,252) 0%, rgb(252,252,252) 95%, rgb(0,79,163) 95%, rgb(0,79,163) 100%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgb(252,252,252)), color-stop(95%,rgb(252,252,252)), color-stop(95%,rgb(0,79,163)), color-stop(100%,rgb(0,79,163))); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top,  rgb(252,252,252) 0%,rgb(252,252,252) 95%,rgb(0,79,163) 95%,rgb(0,79,163) 100%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top,  rgb(252,252,252) 0%,rgb(252,252,252) 95%,rgb(0,79,163) 95%,rgb(0,79,163) 100%); /* Opera 11.10+ */
	background: -ms-linear-gradient(top,  rgb(252,252,252) 0%,rgb(252,252,252) 95%,rgb(0,79,163) 95%,rgb(0,79,163) 100%); /* IE10+ */
	background: linear-gradient(to bottom,  rgb(252,252,252) 0%,rgb(252,252,252) 95%,rgb(0,79,163) 95%,rgb(0,79,163) 100%); /* W3C */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#fcfcfc', endColorstr='#25aae1',GradientType=0 ); /* IE6-9 */
}
.menu ul li a.active {
	color: rgb(0,79,163);

	background: rgb(252,252,252); /* Old browsers */
	background: -moz-linear-gradient(top,  rgb(252,252,252) 0%, rgb(252,252,252) 95%, rgb(0,79,163) 95%, rgb(0,79,163) 100%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgb(252,252,252)), color-stop(95%,rgb(252,252,252)), color-stop(95%,rgb(0,79,163)), color-stop(100%,rgb(0,79,163))); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top,  rgb(252,252,252) 0%,rgb(252,252,252) 95%,rgb(0,79,163) 95%,rgb(0,79,163) 100%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top,  rgb(252,252,252) 0%,rgb(252,252,252) 95%,rgb(0,79,163) 95%,rgb(0,79,163) 100%); /* Opera 11.10+ */
	background: -ms-linear-gradient(top,  rgb(252,252,252) 0%,rgb(252,252,252) 95%,rgb(0,79,163) 95%,rgb(0,79,163) 100%); /* IE10+ */
	background: linear-gradient(to bottom,  rgb(252,252,252) 0%,rgb(252,252,252) 95%,rgb(0,79,163) 95%,rgb(0,79,163) 100%); /* W3C */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#fcfcfc', endColorstr='#25aae1',GradientType=0 ); /* IE6-9 */
}

/*flecha del drop*/
.menu .arrow:after{
	content:"";
	float:right;
	text-align:right;
	width:0;
	height:0;
	display:block;
	border-left:3px solid rgba(255,255,255,0);
	border-right:3px solid rgba(255,255,255,0);
	border-top:3px solid #fff;
	top:11px;
	margin:0 0 0 5px;
	position:relative;
	border-left:3px solid transparent/9;
	border-right:3px solid transparent/9;
}

.menu ul li ul li .arrow:after {
	border-top:3px solid transparent;
	border-bottom:3px solid transparent;
	border-left:3px solid rgb(255,255,255);
	margin:-2px 0 0 5px;
}

.menu i {
	font-size:2em;
	font-weight:300;
	font-style:normal;
	display: inline-block;
	margin:0 5px 0;
	padding:0;
}

.menu .right{float:right}
.menu .right ul,.menu .right .mega-menu{right:0}


.menu ul ul {
	background:rgb(140,215,250);
	position:absolute;
	top:100%;
	width:270px;
	-webkit-box-shadow:0 1px 1px rgba(0,0,0,.04);
	box-shadow:0 1px 1px rgba(0,0,0,.04)
}
.menu ul ul ul { position:absolute; left:100%; top:1px}
.menu ul ul li a {text-transform: none; font-weight:400;padding:8px 12px; color:rgb(255,255,255); }
.menu ul ul li {
	float:none;
	position:relative;
	-webkit-transition:none;
	-moz-transition:none;
	-o-transition:none;
	-ms-transition:none;
	transition:none;
}

.menu ul ul li a:active, .menu ul ul li:hover { background:rgb(37,170,225)!important;}

.mega-menu {
	position:absolute;
	top:100%;
	padding:20px;
	background: rgb(140,215,250);
	-webkit-box-shadow:0 1px 1px rgba(0,0,0,.04);
	box-shadow:0 1px 1px rgba(0,0,0,.04);
		-webkit-box-sizing:border-box;
		-moz-box-sizing:border-box;
		box-sizing:border-box;
}
.mega-menu ol { list-style:none; padding:0; }
.mega-menu ol li { width:100%; }
.mega-menu ol li a {
	color:rgb(255,255,255);
	padding:0;
	font-weight: 400;
	text-transform:none;
	text-shadow: 0 1px 0 rgb(37,170,225);
}
.mega-menu ol li a:hover { color:rgb(140,215,250); background: rgb(37,170,225); border-bottom: 1px solid rgba(135,203,237,.5);}



.mega-menu div {
	position: relative;
	padding: 20px;
	height: 260px;
	box-shadow: -28px 0 0 -27px rgb(135,203,237), 0 -28px 0 -27px rgb(135,203,237);
}
.mega-menu > div:nth-child(-n+3) { box-shadow: -28px 0 0 -27px rgb(135,203,237);}
.mega-menu > div:nth-child(3n+1) { box-shadow:  0 -28px 0 -27px rgb(135,203,237);}
.mega-menu > div:first-child { box-shadow: none; }

.mega-menu div:hover { background: rgb(37,170,225);}

.mega-menu div h4 {
	text-shadow: 1px 1px 0 rgb(37,170,225);
	font-size:1.3em;
	font-weight:700;
	color:rgb(255,255,255);
	padding:0 0 8px 0;
	margin:0;
}

.mega-menu.full-width ol { list-style:none; padding:0 0 0 70px; }
/* iconos menu */
.mega-menu.full-width .leche { background: url('../imagenes/iconos/nav/leche-icon.png') no-repeat left center;}
.mega-menu.full-width .yoghurt { background: url('../imagenes/iconos/nav/yoghurt-icon.png') no-repeat left center;}
.mega-menu.full-width .bebida-lactea { background: url('../imagenes/iconos/nav/bebida-lactea-icon.png') no-repeat left center;}
.mega-menu.full-width .queso { background: url('../imagenes/iconos/nav/queso-icon.png') no-repeat left center;}
.mega-menu.full-width .crema-de-leche { background: url('../imagenes/iconos/nav/crema-icon.png') no-repeat left center;}
.mega-menu.full-width .dulce-de-leche { background: url('../imagenes/iconos/nav/dulce-icon.png') no-repeat left center;}
.mega-menu.full-width .postres { background: url('../imagenes/iconos/nav/postre-icon.png') no-repeat left center;}
.mega-menu.full-width .manteca { background: url('../imagenes/iconos/nav/manteca-icon.png') no-repeat left center;}
.mega-menu.full-width .otros { background: url('../imagenes/iconos/nav/otros-icon.png') no-repeat left center;}

/* iconos menu :hover */
.mega-menu.full-width .leche:hover { background:rgb(37,170,225) url('../imagenes/iconos/nav/leche-icon.png') no-repeat left center;}
.mega-menu.full-width .yoghurt:hover { background:rgb(37,170,225) url('../imagenes/iconos/nav/yoghurt-icon.png') no-repeat left center;}
.mega-menu.full-width .bebida-lactea:hover { background:rgb(37,170,225) url('../imagenes/iconos/nav/bebida-lactea-icon.png') no-repeat left center;}
.mega-menu.full-width .queso:hover { background:rgb(37,170,225) url('../imagenes/iconos/nav/queso-icon.png') no-repeat left center;}
.mega-menu.full-width .crema-de-leche:hover { background:rgb(37,170,225) url('../imagenes/iconos/nav/crema-icon.png') no-repeat left center;}
.mega-menu.full-width .dulce-de-leche:hover { background:rgb(37,170,225) url('../imagenes/iconos/nav/dulce-icon.png') no-repeat left center;}
.mega-menu.full-width .postres:hover { background:rgb(37,170,225) url('../imagenes/iconos/nav/postre-icon.png') no-repeat left center;}
.mega-menu.full-width .manteca:hover { background:rgb(37,170,225) url('../imagenes/iconos/nav/manteca-icon.png') no-repeat left center;}



.mega-menu .col-1{width:135px}
.mega-menu .col-2{width:284px}
.mega-menu .col-3{width:441px}
.mega-menu .col-4{width:594px}
.mega-menu .col-5{width:747px}
.mega-menu .col-6{width:900px}
.mega-menu .col-1,
.mega-menu .col-2,
.mega-menu .col-3,
.mega-menu .col-4,
.mega-menu .col-5,
.mega-menu .col-6 {display: inline-block; }

.mega-menu.full-width { left:0; width:100%;}

.full-width .col-1{width:14.1%}
.full-width .col-2{width:33%}
.full-width .col-3{width:46.7%}
.full-width .col-4{width:63%}
.full-width .col-5{width:79.3%}
.full-width .col-6{width:95.6%}
.full-width .col-1,
.full-width .col-2,
.full-width .col-3,
.full-width .col-4,
.full-width .col-5,
.full-width .col-6{ display: inline-block; }


@media only screen and (max-width: 767px){
	.menu ul li{width:100%;cursor:pointer}
	.menu ul li{position:relative}
	.menu .mega-menu ol li{height:0}
	.menu li:hover>.mega-menu ol li{height:auto}
	
	.mega-menu,.menu ul ul{z-index:100}
	.menu ul ul{width:100%;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box}
	.menu ul ul ul{left:0}
	.menu ul ul li:hover>ul{position:relative;border:none;border-top:1px solid #e4e4e4; -webkit-box-shadow:none;box-shadow:none}
	.menu ul li ul li .arrow:after{border-left:3px solid transparent;border-right:3px solid transparent;border-top:3px solid #bbb;margin:0}
	

	.mega-menu div { height: auto; }
	.mega-menu > div:nth-child(-n+3){ border-bottom: 1px solid rgb(135,203,237) }
	.mega-menu > div:nth-child(-n+3) { box-shadow:none;}
	.mega-menu > div:nth-child(3n+1) { box-shadow:none;}

	.mega-menu { padding:18px 0; }
	.mega-menu ol li:last-child{margin:0 0 20px 0}

	.menu .col-1, .full-width .col-1,
	.menu .col-2, .full-width .col-2,
	.menu .col-3, .full-width .col-3,
	.menu .col-4, .full-width .col-4,
	.menu .col-5, .full-width .col-5,
	.menu .col-6, .full-width .col-6 { float:left;margin:0 0 0 5%;width:90%; }
}
















