#bg {
	position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    z-index: -1;

    background: #ebebeb url('../img/fondos/Xauen_1.png');
    background-color: #ebebeb;
    background-size: cover;
    background-position: left bottom;
    background-attachment: fixed;
    background-repeat: no-repeat;
}

.headernav{}

.headernav{
    font: 1.2em 'NeutraDisplayMedium', Arial, sans-serif;
    float: right;
    display: block;
    position:fixed; 
    right:50px; 
    top:60px;
    z-index: 999;
}

.headernav ul{padding: 0;}
.headernav ul li:first-child{margin-left: 0;}
.headernav ul li{float:left; margin: 2px 0 0 50px;}
.headernav ul li a{color: #fff; width:100%; text-decoration: none; }
.headernav ul li.selected a{border-bottom: 2px solid #fff} 

#logo{height: 90px; margin: 30px 30px 30px 40px; }

#header {
	position: fixed;
	left: 0;
	top: 0;
	height: 160px;
	overflow: hidden;
	z-index: 2;
	width: 100%;
	background-attachment: scroll !important;
}

.overlay {z-index: 4;}
.navfixed {position: fixed; top: 160px; left: 0; z-index: 3; min-height: 100px;}

#separador {height:300px; width:100%;}

#productos_wrapper{
    width: 1200px;
    position: relative;
    margin: 0 auto;
}

#productos, #menu_productos{
    position: relative;
    margin: 0 auto;
}

.productosbg{
	background-image: url('../img/fondos/productos_header.png');
}

.nicescroll-rails{
	z-index: 9999 !important;
}

#slider{
    width: 1200px;
    height: 560px;
    margin: 20px auto;
    background: #fff;
    position: relative;
    overflow: hidden;
}

/*#slider h1, #slider h2, #slider p, #slider a {opacity: 0;}*/
#slider{z-index: 1;}
#slide_content {opacity: 0;}
#slider section{max-width: 100%;}
#slider header{font-size: 1em; margin-top: 50px;}
#slider header h1{line-height: 1.1em; font-size: 2.3em;}
#slider header h2{margin: 0; font-family: 'NeutraDisplayNormal'; font-size: 1em; line-height: 1.5em;}
#slider section p{font-size: 0.6em; line-height: 1.1em;}
#slider section a{font-size: 0.8em; }

#slider .boton {border: none; position: absolute; top: 45%; z-index: 9;}
#slider .boton.left {left: 30px;}
#slider .boton.right {right: 30px; left:auto;}


/*#productos {
    opacity: 0;
    -webkit-transition: all 1s ease-in-out;
    -moz-transition: all 1s ease-in-out;
    -o-transition: all 1s ease-in-out;
    -ms-transition: all 1s ease-in-out;
    transition: all 1s ease-in-out;
}*/

.block {
    position: absolute;
    background: #fff;
    width: 385px;
    height: 385px;
    margin-bottom: 15px;
    background-position: center center;
    overflow: hidden;
} .block .btn {border: 3px solid;}

.block .product_content1, .block .product_content2 {opacity: 0; padding: 20px; width: 310px; height: 100%;}
.block h1{font-family: 'NeutraDisplayBold'; font-size: 4em; line-height: 1em; margin-bottom: 0em; margin-top: 10px;}
.block h2{font-family: 'NeutraDisplayMedium'; font-size: 2em; line-height: 1em; margin:0.5em 0;}
.block p{font-family: 'NeutraDisplayNormal'; font-size: 1.2em; line-height: 1.2em;}
.block .btn {padding: 10px; margin-top: 10px; width: 285px;}
.block a{font-family: 'NeutraDisplayNormal'; font-size: 1.2em; text-decoration: none;}
/*.block .botonera {position: absolute; bottom: 20px; left: 20px;}*/
.block .overlay {z-index: 1;}
#desc_categoria {
    font-size: 2em;
    color: #fff;
    padding: 0 20px;
    width: 50%;
}

#mobile-menu-button1{display: none; position: absolute; left: 25px; top: 15px;}
#mobile-menu-button1 i{color: #fff; font-size: 25px; cursor: pointer;}

@media only screen and (max-width: 1200px) {
    #productos_wrapper{
        width: 100%;
    }

    #slider{
        width: 800px;
        height: 500px;
    }
    #slider header {margin-top: 25px;}

    #logo{height: 70px; margin: 25px;}

    .headernav {
        right: 20px;
        height: 120px;
        top: 50px;
    }
    .headernav ul li{
        margin-left: 20px;
    }
    
}

#categoria {width: 100%;}
#categoria header h1{font-family: 'NeutraDisplayMedium'; font-size: 3em; width: 100%; border: 2px solid #000; text-align: center;}
#categoria header h2{display:none; font-family: 'NeutraDisplayBold'; width: 385px;  font-size: 1.3em; border: 1px solid #000; text-align: center; height: 50px; line-height: 2.5em;}

#producto_foto {float:left; display: none; margin-bottom: 20px; margin-right: 18px; text-align: center;}
#producto_foto img {border: 1px solid #000;}
#producto_banner .block{position: relative; overflow: hidden;}
#menu_productos{position: relative;}
#menu_productos a{position: absolute; text-align: center; font-size: 1.3em; height: 50px; width: 385px; margin: 0 0 15px 0; padding: 0; color: #000; line-height: 2.5em; font-family: 'NeutraDisplayBold'; text-decoration: none; border: 2px solid #000;}

#producto_banner{position: relative;}
.botonera {float: left; display: none;}
.botonera .btn{width: 382px; height: 50px; border: 1px solid #000; text-align: center; margin: 10px 0 15px 0;}
.botonera a{color: #000; text-decoration: none; line-height: 2.5em; font-family: 'NeutraDisplayBold';font-size: 1.3em;}

@media only screen and (max-width: 1195px) {
    #categoria, #producto{margin:0 auto; max-width: 790px;}
}

@media only screen and (max-width: 1195px) {
    
}

    
@media only screen and (max-width: 990px) {
    .headernav{top: 0; line-height: 2em;}
    .headernav li:nth-child(4) {
        clear: both;
        margin-left: 0;
    }

    .navfixed{top:120px;}
    #menu{display: none;}
    .navfixed{min-height: 45px;}
    #mobile-menu-button1{display: block;}
    #separador{height: 195px;}

    #nav{padding-bottom: 10px;}
    #nav ul {padding: 0 10px; margin: 0; width: 100%}
    #nav ul li.selected {border-bottom: 2px solid #fff;}
    #nav ul li {clear: left; margin-left: 0; line-height: 1.6em;}
    #nav ul li a, #nav ul li.selected a{color: #fff; border: none; }
    #menu {margin: 12px 0 0 60px;}
}

@media only screen and (max-width: 800px) {
    #slider{
        width: 100%;
        height: 500px;
    }

    
}

@media only screen and (max-width: 790px) {
    #categoria {width: 98% !important;}
    #producto{margin:0 auto; }
    #producto_foto img{max-width: 99%;}
    #producto_foto {margin-right: 0;}
    #categoria header h1{font-size: 2em;}
    #categoria header h2{margin: 10px auto;}
    #producto_foto {width: 100%;}
    #producto_banner .block {margin-left: auto; margin-right: auto;}
    .botonera{width: 99%;} .botonera .btn{max-width: 99%;}
    .botonera .btn{margin: 15px auto; }
    #categoria header h2{max-width: 99%;}
}

@media only screen and (min-width: 740px){
    .headernav {
        display: block !important;
    }
}


@media only screen and (max-width: 740px) {
    #mobile-menu-button {
    display: none;
    }
}

@media only screen and (max-width: 600px) {
    #slider {min-height: 300px;}
    #slider .boton {top: 85%;}
    .headernav {width: 210px; background-color: rgba(255,255,255,0.8); display: none; right: 55px; top: 25px; height: 250px;}
    .headernav ul {padding: 0 10px; margin: 0;}
    .headernav ul li.selected {border-bottom: 2px solid #000;}
    .headernav ul li {clear: left; margin-left: 0;}
    .headernav ul li a, .headernav ul li.selected a{color: #000; border: none; }
    .headernav ul li.info {display: none;}
    #mobile-menu-button {
        display: block;
    }
    .headernav{top:25px !important;}

}

@media only screen and (max-width: 380px) {
    /*.block .product_content1, .block .product_content2 {width: 310px;}*/
    .block{width: 100% !important;}
    #productos{width: 100% !important;}
    #menu_productos, #menu_productos a {width: 98% !important;}
    #header{height: 80px;}
    .navfixed {top: 80px;}
    #separador {height:150px; }
}

@media only screen and (max-height: 500px) {
    .headernav ul li {line-height: 1.5em;}
    .headernav {right: 60px; height: 200px;}
    #header{height: 80px;}
    .navfixed {top: 80px;}
    #separador {height:130px; }
    .headernav ul{margin-top: 10px;}
    #logo {
        height: 35px !important;
        margin: 10px !important;
    }
    .headernav{top:0;}
}

@media only screen and (max-height: 300px) {
    #slider{max-height: 250px;}
    #slider header h1 {font-size: 3.2em;}
    #slider header h2 {font-size: 1.6em;}
    #slider section p {font-size: 1.2em;}
    #mobile-menu-button {
     right: 0.5em !important; 
    }
}