/*
   styles.css
   Lavieri Hnos.

   Created by Duxdesign
*/

address, article, aside, canvas, details, figcaption, figure, footer, header, hgroup, nav, menu, nav, section, summary {display: block;}
figure {margin:0;}


body { background: #DDD5C2; color: #FFF; }
a { text-decoration: none; color: #301E10; }

#container { min-width: 960px; max-width: 1920px; }
#header , #calltoaction , #maincontent , #footer , #copy { clear: both; }
#container , .mainmenu , .bx-content , #featured , #featured-cta , #products-home , #calltoaction , #maincontent , #footer , #copy { position: relative; z-index: 11; }

/*Grids*/

.grid01 , .grid02 , .grid03 , .grid04 , .grid05 , .grid06 { margin: 0 auto; }
.grid01 { width: 960px; }
.grid02 { width: 860px; }
.grid03 { width: 720px; }
.grid05 { width: 500px; }
.grid06 { width: 400px; }
.grid07 { width: 250px; }

/*Selection*/

::selection { background: #f1ede2; /* WebKit, Opera, & IE9 */ color: #585140; }
::-moz-selection { background: #f1ede2; color: #585140; }

/*Header*/

#header { padding-top: 15px; background: url(../images/bg-texture.png) repeat; height: 300px; }
.ins-header h1 { font: 2.5em 'Bitter', Georgia, serif !important; margin-top: 20px; text-shadow: 2px 2px 1px rgba(0, 0, 0, 0.40); text-rendering: optimizeLegibility; }

/*MainMenu*/

.mainmenu { padding: 30px 25px 100px; height: 58px; }
.mainmenu ul { padding: 10px; text-align: center; }
.mainmenu ul , .mainmenu li { background: #665733; }
.mainmenu li { display: inline-block; text-align: center; padding: 0 15px; border-right: 1px solid #8e8268; }
.mainmenu li:last-child { border: none; }
.mainmenu li a:hover { color: #FFFFCC; }
.mainmenu .active , .vermas:hover { color: #FFEB8F; }
.mainmenu a { color: #FFF; text-decoration: none; font: 1.05em 'Bitter', Georgia, serif; text-shadow: 2px 2px 2px rgba(0, 0, 0, 0.61); letter-spacing: 0.04em; line-height: 1.1em; }

.mainmenu li:first-child { padding-left:  0; }

.logo { position: absolute; top: 0; z-index: 99; left: 300px; }
.pushtoleft { margin-left: 140px; padding: 0 !important; }
.removebrd { border-right: none !important; }

/*Sidebar*/

#wrp-sidebar { border-left: 4px solid #e4e4e4; width: 200px; float: right; text-align: right; }

#sidebar { margin: 40px 0; }
#sidebar > * { text-transform: capitalize; }
#sidebar h2 { font: italic 1.25em Georgia, serif; color: #403927; background: #f1ede2; border-radius: 6px; margin: 15px 0; padding: 10px; -webkit-box-shadow: 0px 1px 2px rgba(50, 50, 50, 0.57); -moz-box-shadow: 0px 1px 2px rgba(50, 50, 50, 0.57); box-shadow: 0px 1px 2px rgba(50, 50, 50, 0.57); cursor: pointer; }
#sidebar h3 { font: 0.8em 'Bitter',Georgia,serif; color: #301E10; padding: 5px; background: #E8DCB9; letter-spacing: 2px; text-transform: uppercase; }
#sidebar ul li a { font: 0.85em Verdana, Geneva, sans-serif; }
#sidebar li { border-bottom: 1px solid #CCC; margin: 8px 0; padding: 5px 0; }
#sidebar li a { padding: 6px; }
#sidebar li a:hover { background: #FFEB8F; border-radius: 6px 6px 0 0; }
.notbrd { border: none!important; }

.arrow_box { position: relative; }
.arrow_box:after, .arrow_box:before { right: 100%; border: solid transparent; content: " "; height: 0; width: 0; position: absolute; pointer-events: none; }
.arrow_box:after { border-right-color: #4b3905; border-width: 20px; top: 50%; margin-top: -20px; }
.arrow_box:before { border-right-color: #4b3905; border-width: 21px; top: 50%; margin-top: -21px; }

#toTop { position: fixed; bottom: 10px; margin-left: 220px; z-index: 99; }

/*Navigation Thumbs*/

#products-home { height: 117px; padding-top: 15px;  }
.bgthumbs { background: url(../images/bg-productos.png) repeat-x ; }
.bginsheader { background: url(../images/bg-ins-header.jpg) repeat-x top left; }
.products-texture { background: url(../images/bg-texture.png) repeat; }

.bx-thumbs { margin-top: 10px; position: relative; z-index: 12; }
.bx-thumbs a { float: left; width: 66px; height: 66px; border: 1px solid #493328; overflow: hidden; margin: 2px 7px; position: relative; outline: none; cursor: pointer; background-repeat: no-repeat; background-position: center center; opacity: 0.8; border-radius: 34px; -webkit-border-radius: 34px; -moz-border-radius: 34px; box-shadow: 0px 0px 3px rgba(0,0,0,0.6), 0px 0px 0px 40px rgba(0,0,0,0.3) inset; -webkit-transition: all 0.4s ease-in-out; -moz-transition: all 0.4s ease-in-out; -o-transition: all 0.4s ease-in-out; -ms-transition: all 0.4s ease-in-out; transition: all 0.4s ease-in-out; }
.bx-thumbs a:hover { opacity: 1.0; box-shadow: 0px 0px 3px rgba(0,0,0,0.6), 0px 0px 0px 0px rgba(0,0,0,0.1) inset; }
.bx-thumbs a.bx-thumbs-current { opacity: 1.0; border-color: #FFF; box-shadow: 0px 0px 3px rgba(0,0,0,0.6); }
.bx-thumbs a:first-child { margin-left: 278px; }

.bx-thumbs-names { margin-bottom: 20px; font:italic 1.15em Times, serif; color: #502511; }
.bx-thumbs-names li { display: inline-block; text-align: center; }
.ptr-caf { margin-left: 20px; }
.ptr-cho { margin-left: 20px; }
.ptr-bom { margin-left: 10px; }
.ptr-tab { margin-left: 5px; }
.ptr-car { margin-left: 10px; }

/*Breadcrumbs*/

#breadcrumbs { clear: left; /*float: left; margin-bottom: 20px;*/ }
#breadcrumbs li { display: inline-block; color: #665733; font-style: italic; }
#breadcrumbs li a { color: #665733; }
#breadcrumbs li a:hover { text-decoration: underline; }
#breadcrumbs li span { margin: 0 5px; }

/* pager */

#content-navigation { clear: both; float: left; font: italic 1em Georgia,Times,serif; margin-top: 15px; text-align: right; }
#content-navigation a { margin: 0 10px; text-decoration: underline; }

/*Featured*/

#featured , .bx-content { background: url(../images/bg-feat-transp.png) repeat-y center; }
#featured { padding: 1px 0 20px; }
.featured-text { color: #FFF; text-align: center; font-family: Georgia, Times, serif; }
.featured-text h3 { font-size: 2.1em; font-weight: 200; }
.featured-text p { font-size: 1.2em; font-weight: 100; line-height: 1.2em; text-shadow: 2px 2px 2px rgba(0, 0, 0, 0.61); }

.feat-line-wrp { margin: 8px 0; }
.feat-line { border-radius: 2px 0 2px 0; width: 200px; display: inline-block; margin: 0 5px; }
.feat-line { border: 3px solid #FFF; vertical-align: middle; }

/* featured call to action */

#featured-cta { padding: 40px 0; text-align: center; }
.vermas { /*background: #483125;*/ background: #8b2d25; color: #FFF; font: 1em 'Bitter',Georgia,serif; letter-spacing: 0.08em; margin: 3px; padding: 10px 45px; text-decoration: none; text-shadow: 2px 2px 2px rgba(0, 0, 0, 0.61); border: 1px solid #2F170F; }

/*Fullpage Blur effect*/

.bx-content { height: 90px; }
.bx-content h2 { position: relative; z-index: 300; color: #fff; padding-top: 15px; font: 3.7em Georgia, Times, serif; text-align: center; text-shadow: 2px 2px 2px rgba(0, 0, 0, 0.61); }

.bx-container { position: fixed; top: 0; left: 0; width: 50%; height: 50%; z-index: 0; }
.bx-container img { position: absolute; top: 0;	left: 0; width: 50%; z-index: 101; display: none; }
.bx-canvas { position:absolute; top: 0; left: 0; width: 50%; }

.bx-overlay, .bx-loading { width: 100%; height: 100%; position: fixed; top: 0px; left: 0px; background: transparent url(../images/pattern.png) repeat top left; z-index:10; }
.bx-loading { z-index: 9999; background: #000; }
.bx-loading span { color: #fff; font-size: 13px; position: fixed; font-family: Arial, sans-serif; text-transform: uppercase; letter-spacing: 8px; margin: -12px 0 0 -46px; left: 50%; top: 50%; text-shadow: 0px 0px 1px rgba(255,255,255,0.9), 1px 2px 5px rgba(0,0,0,0.5); }

/*Call To Action*/

#calltoaction { background: url(../images/bg-noise.gif) repeat #2F170F; padding: 35px 0; width: 100%; text-align: center; }
#calltoaction cite { color: #FFF; font: italic 1.4em Georgia, Times, serif; text-shadow: 2px 2px 2px rgba(0, 0, 0, 0.61); }

/*Home Content*/

#maincontent { padding: 10px 0 30px; background: #FFF; }
.bghome { background: #301E10 !important; }
.homecontent { padding: 20px 0; overflow: hidden; }
#homeprod { width: 293px; margin: 5px 10px; float: left; background: #FFF; border: 1px dashed #301E10; padding-bottom: 5px; }
#homeprod header , #homeprod div { border-right: 6px solid #FFF; border-left: 6px solid #FFF; }
#homeprod header { background: #e8dcb9; padding: 10px 0; color: #301E10; font: 0.8em  Verdana, Geneva, sans-serif; letter-spacing: 0.4em; text-transform: uppercase; text-align: center; border-top: 6px solid #FFF; }
#homeprod div { border-bottom: 6px solid #FFF; }
#homeprod p { margin: 20px; color: #301E10; font: italic 1em/1.2em Georgia, Times, serif; word-spacing: 0.04em; }
#homeprod p:first-letter { font-size: 1.7em; }

#homeutil { width: 293px; margin: 0 10px; float: left; }
#homeutil header { margin: 20px; letter-spacing: 0.02em; }
#homeutil h2 { font: 1.75em 'Bitter', Georgia, serif; line-height: 0.9em;  }
#homeutil h3 { font: 1.1em Georgia, Times, serif; margin-bottom: 20px; }
#homeutil div { margin: 30px; }
#homeutil cite { font:italic 0.8em Georgia, Times, serif; line-height: 1.8em; text-align: center;  }

.homeutil-tabs { height: 25px; text-align: center; }
.homeutil-tabs li { display: inline-block; padding: 4px 6px; }
.homeutil-tabs li a { color: #DDD; font: 0.74em Verdana, Geneva, sans-serif; text-transform: uppercase; text-decoration: none; }
.homeutil-tabs li:hover { background: #502511 !important; transition: all 1s ease; -webkit-transition: all 1s ease; -moz-transition: all 1s ease; -o-transition: all 1s ease; }

.homeutil-tabs li {  }
.homeutil-tabs li:first-child { background: #918163;  }
.homeutil-tabs li:last-child { background: #716854;  }

.colbox1 { background: #3f4b00; padding: 16px 0 16px 43px; }
.colbox2 { background: #8b2d25; padding: 18px 0 16px 55px; }
.colbox3 { background: #c8902e; padding: 18px 0 16px 65px; }
.colbox4 { background: #502511; }
.colbox5 { background: #ba8572; }
.colbox6 { background: #f1ede2; }
.colbox6 hgroup { color: #3f4b00; margin: 20px; }
.colbox6 h2 { font: 1.8em 'Bitter', Georgia, serif; }
.colbox6 h3 { font-weight: 100; }
.colbox6 p { font-size: 1.25em !important; font-style: normal !important; }
.colbox6 p span { font-size: 0.8em !important; color: #555; }
.colbox4 h4 { font: 0.9em Georgia, Times, serif; }

.badge-img { position: relative; top: 8px; }
.badge-line { border-bottom: 1px solid #cac5c5; display: inline-block; margin: 0 5px; vertical-align: middle; width: 99px; }
.imgbrd { border: 7px solid #FFF; box-shadow: 2px 2px 5px rgba(50, 50, 50, 0.75); -webkit-box-shadow: 2px 2px 5px rgba(50, 50, 50, 0.75); -moz-box-shadow: 2px 2px 5px rgba(50, 50, 50, 0.75); }

/* Contents */

#product , #about , #receta { color: #665733; float: left; /*margin: 10px;*/ padding-bottom: 30px; border-bottom: 1px solid #ebebeb; }
#product hgroup , #product header , #product article { clear: both; float: left; }
#product h1 , #about h1 { font-size: 1.9em; font-weight: 100; margin: 20px 0 10px; }
#product h4 , #about h4 { font-style: italic; font-weight: 100; text-align: left; line-height:1.2em; font-size: 1.15em; letter-spacing: 0.04em; margin: 20px 0; padding-top: 20px; border-top: 1px dotted #808285; }
#product p { float:left; }
#product p , #about p , #receta { font: 0.83em/1.5em Verdana, Geneva, sans-serif; margin: 8px 0; }
#product-thumb { background: none repeat scroll 0 0 #E9E4D1; border: 1px solid #CCC; float: left; margin: 69px 0 0 30px; padding: 15px; }

.product-info li { line-height: 1.5em; }
.product-info li a { background: url(../images/ico-desc.png) no-repeat left; padding-left: 16px; color: inherit; font: 600 0.83em/1.5em Verdana, Geneva, sans-serif; border-bottom: 1px dashed #251D07; padding-bottom: 1px; }
.product-info li a:hover { color: brown; border-bottom: 1px dashed brown;}

.novedad { background: url("../images/ico-logo.png") no-repeat scroll right center; border-radius: 2px; color: #FFF; font: bold 0.7em Verdana,Geneva,sans-serif;  left: 35px; padding: 8px 47px 9px 10px; position: relative; text-transform: uppercase; }

#about { clear: both; }
#about p a { font-weight: bold; color: #A62D2D; letter-spacing: 0.05em; }
#about p a:hover { text-decoration: underline; }
#about cite { line-height: 1.5em; }
h1.bonafide:after { content: url(../images/productos/bonafide/logo-bonafide.jpg); display: inline-block; padding-left: 8px; vertical-align: top; margin-bottom: 10px; }

.tourvirtual { overflow: hidden; float: left; padding: 24px 20px; }
.tourvirtual a { margin: 20px 5px 0; }

#insumos { clear: both; }
#insumos li h5 { margin: 8px 0; font: 1.15em/1.8em 'Bitter', Georgia, serif; }
#insumos ul li { font: 0.82em/1.5em Verdana, Geneva, sans-serif }

#receta { padding: 20px; }
#receta article , #receta img , .ingredientes { float: left; }
#receta img { position: relative; margin: 10px 25px 10px 10px; }
#receta h3 { font-size: 1.5em; margin-bottom: 10px; }
#receta h4 { font: 1em Georgia, Times, serif; letter-spacing: 0.04em; margin-bottom: 5px; }
#receta em { color: #C8902E; }
.ingredientes { margin-right: 20px; }
.destacado { width: 46%; background: #FFFFCC; border: 1px dashed #F1EDE2; padding: 25px; float: right; margin-top: 10px; }
.destacado p { margin: 8px 0; font: 100 italic 1.1em/1.6em 'Bitter', Georgia, serif; color: #533014;  }
.thumb-recetas { margin: -15px 0 0 170px; position: absolute; }

/*Footer*/

#footer { background: #301E10; }
.footercontent { padding: 25px 0; }
.footercontent hgroup , .footercontent ul { display: inline-block; margin-left: 10px; }
.footercontent h2 { color: #FFF; font: 1.7em 'Bitter', Georgia, serif; margin-bottom: 20px; text-rendering: optimizeLegibility; }
.footercontent h3 , .footercontent h4 { font-weight: 100; }
.footercontent h3 { color: #FFFFCC; }
.footercontent h4 { color: #FFEB8F; font-style: italic; }
.footercontent ul { border-left: 1px solid #665733; padding: 10px 0 10px 20px;  }
.footercontent ul a { color: #FFF; font-size: 1.3em; }

.tel , .mail { padding: 0 2px 0 10px;  display: inline-block; }
.mail:before { content: url(../images/ico-mail.gif); }
.tel:before { content: url(../images/ico-tel.gif); }

/*Copy*/

#copy { background: #4B3905; }
.copycontent { padding: 20px 0; font: 0.8em normal Verdana, Geneva, sans-serif; text-align: center; }
.copycontent p , .copycontent a { color: #FFF; }

/*Animations*/

.rTR:hover , .rTL:hover { border-color: #F1EDE2; }
.rTR { transform: rotate(-5deg); -webkit-transform: rotate(-5deg); -moz-transform: rotate(-5deg); -o-transform: rotate(-5deg);  }
.rTL { transform: rotate(5deg); -webkit-transform: rotate(5deg); -moz-transform: rotate(5deg); -o-transform: rotate(5deg); }

.scale a:hover { -webkit-transform: scale(1.4); transform: scale(1.4); }


.popup { background-color: rgba(0,0,0,0.7); position:fixed; top:0; left:0; width:100%; height:100%; z-index:999; }
.popup .contenido { position:absolute; top:100px; left:50%; margin-left:-413px; width:826px; height:550px; overflow:auto; }
.popup .contenido .close { position:absolute; top:0; left:0; background-color:#000; color:#fff; cursor:pointer; font-family:"Gill Sans", "Gill Sans MT", "Myriad Pro", "DejaVu Sans Condensed", Helvetica, Arial, sans-serif; padding:10px; font-size:16px;}

.top-banner {background-color: #82CDAF; color: #1F1C13; padding: 1rem 4rem; text-align: center; display: flex; position: relative; z-index: 80; align-items: center; font-family: sans-serif; justify-content: center; }
.top-banner p { font-size: 1.2rem;}
.top-banner p strong {text-transform: uppercase; }
.top-banner svg {fill: currentColor; width: 52px; height: 52px; margin-right: 1rem; flex: 0 0 52px;}

@media (max-width: 992px) {
	.top-banner {padding: 1rem;}
	.top-banner p { font-size: .8rem; text-align: left;}
	.top-banner p strong { display: block;}
	.top-banner svg {width: 32px; height: 32px; flex: 0 0 32px;}
}

@media (max-width: 520px) {
	.top-banner p strong { display: inline;}
}

