/*Bold*/
@font-face{
  font-family:"FlameBold";
  src: url(../../assets/font/FlameBold.eot);
  src: url(../../assets/font/FlameBold.ttf)  format("truetype"), /* Safari, Android, iOS */
  url(../../assets/font/FlameBold.eot?#iefix) format("embedded-opentype"), /* IE6-IE8 */
  url(../../assets/font/FlameBold.woff) format("woff"), /* Pretty Modern Browsers */
  url(../../assets/font/FlameBold.svg#RoyalChicken) format("svg");
}
@font-face{
  font-family:"FlameBold";
  src: url(../../assets/font/FlameBold.eot);
}
@font-face{
  font-family:"FlameBold";
        src: url(../../assets/font/FlameBold.ttf)  format("truetype");
}

/*Regular*/
@font-face{
  font-family:"FlameRegular";
  src: url(../../assets/font/FlameRegular.eot);
        src: url(../../assets/font/FlameRegular.ttf)  format("truetype"), /* Safari, Android, iOS */
       url(../../assets/font/FlameRegular.eot?#iefix) format("embedded-opentype"), /* IE6-IE8 */
             url(../../assets/font/FlameRegular.woff) format("woff"), /* Pretty Modern Browsers */
             url(../../assets/font/FlameRegular.svg#RoyalChicken) format("svg");
}
@font-face{
  font-family:"FlameRegular";
  src: url(../../assets/font/FlameRegular.eot);
}
@font-face{
  font-family:"FlameRegular";
        src: url(../../assets/font/FlameRegular.ttf)  format("truetype");
}

/*Regular Sans*/
@font-face{
  font-family:"FlameRegularSans";
  src: url(../../assets/font/FlameSansRegular.eot);
        src: url(../../assets/font/FlameSansRegular.ttf)  format("truetype"), /* Safari, Android, iOS */
       url(../../assets/font/FlameSansRegular.eot?#iefix) format("embedded-opentype"), /* IE6-IE8 */
             url(../../assets/font/FlameSansRegular.woff) format("woff"), /* Pretty Modern Browsers */
             url(../../assets/font/FlameSansRegular.svg#RoyalChicken) format("svg");
}
@font-face{
  font-family:"FlameSansRegular";
  src: url(../../assets/font/FlameSansRegular.eot);
}
@font-face{
  font-family:"FlameSansRegular";
        src: url(../../assets/font/FlameSansRegular.ttf)  format("truetype");
}

/*-------------------------------------------------------------------------------------------*/
.sabor-n h2 { font-size: 3.1rem; }
.mg-cero {display: block; margin: 0 auto;}
.d-none {display: none;} .invalid-feedback {display: none;}.btn.disabled {pointer-events: none; opacity: 0.65;}
.top-zero {top:0 !important;}
/*Volver a la Homepage*/
.nav-header {position: absolute; background: #f5ebdc !important; width: 100% !important;
z-index: 1005; text-align: left;}
.nav-header .container {width: 100%; max-width: 1200px; padding: 0; margin: 0 auto;}
.nav-header a {font-family: 'FlameRegular' !important; font-weight: 100; font-size: 1.2rem;
color: #502213; text-decoration: none;}
.nav-header img {width: 46px; height: 48px; margin: 5px 20px;}
/* Dropdown Scroll Banner */
.btn-anchor {text-decoration: none !important;}
.btn-anchor:hover h3, .btn-anchor:hover .fa-angle-down {color: #ff8732 !important}
.hero .text {z-index: 1000 !important;}
.hidden-desktop {display: none !important;}
* { -o-box-sizing: border-box; box-sizing: border-box; }
html, body {background: #f5ebdc; overflow-x: hidden;}
body{ margin:0; padding:0; font-size:14px; font-family: 'Oswald',sans-serif; font-weight:400;}
section {position: relative;}
.center-true {position: relative !important; top: 50%; left: 50%; transform: translate(-50%, -50%);}
.container.wrapper {width: 100%; max-width: 100%; padding: 0; margin: 0 auto;}
.color1 {color: #d62300;}
.color2 {color: #ff8732;}
.color3 {color: #ffaa00;}
/*adjusts*/
strong {font-family: 'FlameBold' !important;}
.maxw {max-width: 440px;}
.gavin {width: 100% !important; left: 0% !important;}
.color-orange {color: #ff8732;}
.color-green {color: #198737;}
.bg-orange {background: #ff8732 !important;}
.color-mayo {color: #f5ebdc;}
.scroll-slide .box-text .color-mayo {display: block;}
.square.bg-dark.box-corona h3 {color: #f5ebdc !important;}
.box-corona .corona {width: 40%;}
.square-inner.box-megan img {width: 80%; right: 0 !important; left: auto !important;}
.square-inner.box-megan .box-color {background: #502314 !important;}
.broun-bg {background: #502314 !important;}
.box-nuggets {padding: 0;}
.box-nuggets .square-inner {text-align: left !important;}
.box-nuggets .square-inner img.size70 {position: absolute; left: 0; bottom: 0; width: 65%;}
.box-nuggets h3 {font-size: 23px;}
.box-vegetal {padding: 0;}
.box-vegetal .box-color {border-top-left-radius: 50%; border-bottom-left-radius: 50%;}
.box-vegetal img {width: 80% !important;}
.box-vegetal .logoWV { width: 50% !important; margin: 0 auto 50px; display: block;}
.box-3cols img {width: 40% !important;}
.box-3cols .col-burger {text-align: center;}
.transparent {background: transparent !important;}
.full-height {overflow:hidden; position: relative; display: block; margin: 0; padding: 0; height: 100vh;}
.full-height .row {height: 100vh;}
.offwhite {background: #f5ebdc;}
.dark {background: #502314;}
.red {background: #d62300;}
.yellow {background: #ffaa00;}
.green {background: #198737;}
.p-100 {padding: 100px 0 !important;}
.purple {background: #a3248f;}
.dark h2 {color: #ff8732;}
.green h2, .green h3, .green h4, .green p {color: #fbfbf5;}
.dark p {color: #ff8732;}
.dark a {border-color: #ff8732 !important;}
a.btn {color: #ffffff; border: 1px solid #fff; border-radius: 35px;}
a.btn p {margin: 0; padding: 15px 20px;}
a.btn:hover {opacity: 0.8;}
.bg-fix {position: relative;}
.bg-fix .col-6 {z-index: 1000;}
.bg-fix .box-color {background: #502314; position: absolute; top: 0; left: 0; height: 100%; z-index: 0;}
/*row*/
.row {margin: 0;}
.block {width:100%; height: 100%; margin: 0;}
.no-margin {margin: 0; padding: 0;}
.no-padding-bottom {padding-bottom: 0;}
h1 {font-family: 'FlameBold' !important; font-weight: 100;  font-size: 4.8rem; color: #502314;}
h2 {font-family: 'FlameBold' !important; font-weight: 100;  font-size: 3.5rem; color: #502314;}
h3 {font-family: 'FlameRegular' !important; font-weight: 100;  font-size: 2.2rem; color: #502314;}
h4 {font-family: 'FlameRegular' !important; font-weight: 100;  font-size: 1.6rem; color: #502314;}
p {font-family: 'FlameRegular' !important; font-weight: 100;  font-size: 1.2rem; color: #745649;}
p.sans {font-family: 'FlameSansRegular' !important;  font-size: 1.2rem; color: #745649;}
section .col-6 {display: flex; position: relative;}
section.section-items .col-6, section.no-padding .col-6 {padding: 0 !important;}
.box-text {padding: 10% 6%; display: -webkit-flexbox; display: -ms-flexbox; display: -webkit-flex; display: flex; -webkit-flex-align: center; -ms-flex-align: center; -webkit-align-items: center; align-items: center; justify-content: center;flex-wrap: wrap;}
.m-w-85{max-width: 85% !important;}
.box-text.center {max-width: 980px; margin: 0 auto; text-align: center;}
.margin-adjust {padding: 15% 6% !important;}
.columns {display: flex; flex-direction: row; flex-wrap: wrap; width: 100%; overflow:hidden;}
.column1 {flex: 40%;}
.column2 {flex: 50%;}
.column3 {flex: 20%;}
.column4 {flex: 33%;}
.columns img {width: 100%;}
.columns.whop-sec img {width: 70%;}
.total-c {position:relative; top: 50%; left: 50%; transform: translate(-50%, -50%); height: fit-content; max-height: 100vh;}
.quote-s p {font-size: 22px; letter-spacing: 0.5px; }
.xs-reveal {display: none;}

/* -----------------------------------------------
 * video
 * --------------------------------------------- */
.hero {height: 100vh !important;}
.hero video {width: 100%; display: block; background-color: #502314; background-size: cover; background-position: 50% 50%; position: absolute; margin: auto; width: 100%; height: 100%; right: -100%; bottom: -100%; top: -100%; left: -100%; object-fit: cover;}
.hero h1, .hero h2 {color: #f5ebdc !important; margin-bottom: 40px;}
.hero h2 {font-size: 3rem !important; margin-bottom: 100px;}
.hero h3 {font-size: 1.8rem; color: #ffaa00;}
.fa-angle-down {color: #ffaa00; font-size: 2rem;}
.hero .text {position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); z-index: 0; width: 100%; max-width: 50%; text-align: center; margin-right: auto; margin-left: auto;}
.hero .BK-Logo {max-width: 450px; margin-bottom: 20px;};
.b1 {background-color: transparent; }
/* -----------------------------------------------
 * horizontal banner
 * --------------------------------------------- */
.banner-car {height: 100% !important;}
.wrapper-text {width: 100%; max-width: 1050px; margin: 0 auto;}
#slider{ position:absolute; top:0; left:0; width:100%; height:100%; color:#14151d; overflow:hidden; }
#slider .slide{ overflow:hidden; z-index:50; position:absolute; top:0; right:0; width:0; height:100%; }
#slider .slide:first-child{ width:100%;}
#slider .slide>div{ width:100vw; height:100%;  position:absolute; top:0; right:0; background-image:url(https://s3-us-west-2.amazonaws.com/s.cdpn.io/710995/transparent-noise.png);}
#slider .slide .vis{ width:600px; height:600px; background-position:center center; background-repeat:no-repeat; background-size:contain; position:absolute; top:calc(50% - 300px); left:calc(50% - 300px); opacity:0.5; filter:grayscale(1); mix-blend-mode:overlay;}
#slider .slide:not(:first-child) h1,#slider .slide:not(:first-child) p,#slider .slide:not(:first-child) a{ display:none; }
#slcontent{ width:100%; height:60%; display:table; z-index:70; position:absolute; top:20%; left:0;}
#slcontent>div{ display:table-row; transform:translateY(50px); opacity:0; }
#slcontent>div>div{ display:table-cell; vertical-align:middle; }
#slclient>div{ padding-left:27vw;}
#slprojet>div{ padding-left:15vw;}
#slcompteur{height:130px; font-family: 'Oswald',sans-serif; font-weight:700;   }
#slcompteur>div{ padding-left:15vw; display:block; position:absolute; height:125px; overflow:hidden;  }
#slcompteur b{ color:#ffffff; opacity:0.3; font-size:200px; margin-top:-16px; line-height:180px; display:inline-block; vertical-align:middle; }
#slcompteur b>span{ display:inline-block; text-align:center; vertical-align:top; height:150px; overflow:hidden;}
#slcompteur i{ color:#ffffff; line-height:20px; font-size:20px; font-style:normal; display:inline-block; vertical-align:top;}
#sltype>div{ padding-left:40vw;}
#slother>div{ padding-left:20vw;}
#slider .line span{ display:inline-block; position:relative; line-height:18px; height:18px; vertical-align:top; }
#slider .line .scroll{ overflow:hidden;color:#ffffff;}
#slider .line>div>span:first-child:before{ content:""; display:block; height:1px; width:20px; right:calc(100% + 4px); bottom:4px; position:absolute; background:#14151d;}
#slider .line>div>span:first-child:after{ content:""; display:block; height:1px; width:100vw; right:calc(100% + 34px); bottom:4px; background:#ffffff; position:absolute; opacity:0.4; }
#more{ display:block; font-weight:100; font-family:arial; width:40px; height:40px; color:#ffffff; text-decoration:none; position:absolute; top:calc(50% - 20px); right:30vw; transition:all 0.2s linear; }
#more i{ display:block; position:absolute; background:#ffffff; transition:all 0.2s ease-out;}
#more i:nth-child(1){ width:20px; height:4px; top:calc(50% - 2px);}
#more i:nth-child(2){ width:4px; height:20px; left:calc(50% - 2px);}
#more i:nth-child(3){ width:20px; height:4px; top:calc(50% - 2px); right:0px;}
#more i:nth-child(4){ width:4px; height:20px; left:calc(50% - 2px); bottom:0px;}
#more.hide{ pointer-events:none; }
#more.hide i:nth-child(1){ transform:translateX(-60px); opacity:0; }
#more.hide i:nth-child(2){ transform:translateY(-60px); opacity:0;}
#more.hide i:nth-child(3){transform:translateX(60px); opacity:0;}
#more.hide i:nth-child(4){ transform:translateY(60px); opacity:0;}
#more:hover{ width:50px; height:50px; top:calc(50% - 25px); right:calc(30vw - 5px);}
.square-inner.img-box {position: relative; overflow: hidden;}
.square-inner.img-box img {position: absolute; top:100px; bottom: 0; left: 25%; z-index: 20;}
.box-color {background: orange; width: 100%; height: 100%; will-change: width, height; position: absolute; top: 0; left: 0; z-index: 10;}
.box-color.green {background: #2b9848;}
.box-color.red {background: #d62300;}
.box-color.yellow {background: #ffaa00;}
/* -----------------------------------------------
 * accordion
 * --------------------------------------------- */
.tabpanel-icon {background-image: url('../../assets/img/icon-pan.png'); position: absolute; left: -42px; top: 0; width: 44px; height: 43px; border-top-left-radius: 12px; border-bottom-left-radius: 12px; background-color: #502314; background-position: 11px 48%; background-size: auto 23px; background-repeat: no-repeat;}
.tabpanel-icon.tab2 {background-image: url('../../assets/img/icon-lechuga.png');}
.tabpanel-icon.tab3 {background-image: url('../../assets/img/icon-jitomate.png');}
.tabpanel-icon.tab4 {background-image: url('../../assets/img/icon-pepinillos.png');}
.tabpanel-icon.tab5 {background-image: url('../../assets/img/icon-carne.png');}
.accordion {position: absolute; top: 30%; right: 0; font-size: 1rem; width: 15%; margin: 0 auto; border-radius: 5px; display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; margin-bottom: 0; padding-left: 0; -webkit-box-orient: vertical; -webkit-box-direction: normal; -webkit-flex-direction: column; -ms-flex-direction: column; flex-direction: column; -webkit-box-align: end; -webkit-align-items: flex-end; -ms-flex-align: end; align-items: flex-end; -webkit-box-flex: 0; -webkit-flex: 0 auto; -ms-flex: 0 auto; flex: 0 auto; list-style-type: none;}
.accordion h3 {font-size: 1.2rem; margin: 0; padding: 0; -webkit-touch-callout: none; /* iOS Safari */ -webkit-user-select: none; /* Safari */ -khtml-user-select: none; /* Konqueror HTML */ -moz-user-select: none; /* Old versions of Firefox */ -ms-user-select: none; /* Internet Explorer/Edge */ user-select: none; /* Non-prefixed version, currently supported by Chrome, Edge, Opera and Firefox */}
.accordion-header, .accordion-body {background: white;}
.accordion-header.extra-pad h3 {padding-left: 15px;}
.accordion-header {padding: 9.5px; background: #502314; color: #f5ebdc; transition: all .3s; margin-bottom: 4px;}
.accordion__item {position: relative; margin-bottom: 1px;}
.accordion-header:hover {color: #ffffff; position: relative; z-index: 5;}
.accordion-body {background: #d62300; color: #ffffff; display: none; width: 100%; min-width: 540px; position: absolute; top: 43px; right: 0; z-index: 999;}
.accordion-body h3 {color: #ffaa00 !important; font-size: 1.2rem; margin-bottom: 10px;}
.accordion-body p {color: #ffffff !important; font-size: 1rem ;}
.accordion-body__contents {padding: 0;}
.accordion__item.active:last-child .accordion-header {border-radius: none;}
.accordion:first-child > .accordion__item > .accordion-header {border-bottom: 1px solid transparent;}
.accordion__item > .accordion-header h3:after {margin-left: 25px; content: " "; font-family: 'FlameRegular'; font-size: 1em; float: right; position: relative; top: 0px; transition: .3s all; transform: rotate(0deg);}
.accordion__item.active > .accordion-header h3:after {transform: rotate(-225deg);}
.accordion__item.active > .accordion-header h3 {color: #fff !important;}
.accordion__item.active .accordion-header {background: #d62300; color: #ffffff;}
.accordion__item .accordion__item .accordion-header {background: #f1f1f1; color: #353535;}
.acc-orange .accordion-header, .acc-orange .tabpanel-icon {background-color: #ff8732 !important;}
.acc-orange h3, .acc-orange .accordion__item > .accordion-header h3:after {color: #502314 !important;}
.acc-orange .accordion-body {background: #502314;}
.acc-orange .accordion-body p {color: #f5ebdc !important;}
.acc-orange .accordion-body h3 {color: #ff8732 !important;}
.acc-green .accordion-header, .acc-green .tabpanel-icon {background-color: #198737 !important;}
.acc-green h3, .acc-green .accordion__item > .accordion-header h3:after {color: #f5ebdc !important;}
.acc-green .accordion-body {background: #502314;}
.acc-green .accordion-body p {color: #f5ebdc !important;}
.acc-green .accordion-body h3 {color: #198737 !important;}
.acc-red .accordion-header, .acc-red .tabpanel-icon {background-color: #d62300 !important;}
.acc-red h3, .acc-red .accordion__item > .accordion-header h3:after {color: #f5ebdc !important;}
.acc-red .accordion-body {background: #502314;}
.acc-red .accordion-body p {color: #f5ebdc !important;}
.acc-red .accordion-body h3 {color: #d62300 !important;}
.acc-yellow .accordion-header, .acc-yellow .tabpanel-icon {background-color: #ffaa00 !important;}
.acc-yellow h3, .acc-yellow .accordion__item > .accordion-header h3:after {color: #502314 !important;}
.acc-yellow .accordion-body {background: #502314;}
.acc-yellow .accordion-body p {color: #f5ebdc !important;}
.acc-yellow .accordion-body h3 {color: #ffaa00 !important;;}
.acc-choco .accordion-header, .acc-choco .tabpanel-icon {background-color: #502314 !important;}
.acc-choco h3, .acc-choco .accordion__item > .accordion-header h3:after {color: #f5ebdc !important;}
.acc-choco .accordion-body {background: #502314;}
.acc-choco .accordion-body p {color: #f5ebdc !important;}
.acc-choco .accordion-body h3 {color: #f5ebdc !important;}
/* -----------------------------------------------
 * card flip
 * --------------------------------------------- */
.stamp {position: absolute; top: 15px; right: 15px; z-index: 1000; width: 90px;}
.stamp.haz2 {max-width: 90px; top: 120px !important;}
.square .first-box { padding: 0 20%; text-align: center; display: flex; align-items: center; height: 100%;}
.square .first-box h3 {margin-bottom: 25px;}
.square-inner.animate-box {position: relative;}
.square-inner.animate-box img {position: absolute; top: 15%; left: 25%; z-index: 1000;}
.square-inner.animate-box img.bk2 {top: 35%; left: 0; z-index: 999;width: 100%}
.square-inner.animate-box img.bk3 {top: 35%; left: 15%; z-index: 999;width: 100%; max-width: 60px;}
.scroll-slide.red h2 {color: #ffaa00;}
.scroll-slide.red p {color: #ffffff !important;}
.square-inner {width: -webkit-fill-available; height: -webkit-fill-available; text-align: center;}
.square-inner img {width: 50%; -webkit-touch-callout: none; /* iOS Safari */ -webkit-user-select: none; /* Safari */ -khtml-user-select: none; /* Konqueror HTML */ -moz-user-select: none; /* Old versions of Firefox */ -ms-user-select: none; /* Internet Explorer/Edge */ user-select: none; /* Non-prefixed version, currently supported by Chrome, Edge, Opera and Firefox */}
.square-inner img.size100 {width: 100%;}
.square-inner img.size70 {width: 70%;}
.total-center {width: 100%; text-align: center; margin: 0 auto; max-width: 95%; align-items: end;}
.total-center div { width: 22%; display: inline-block;}
.total-center img {width: auto; max-height: 190px; max-width: 150px; margin-bottom: 20px;}
.square-container {display: flex; flex-wrap: wrap; position: relative;}
.square {background: #f5ebdc; position: relative; flex-basis: calc(25%); margin: 0; border: 0; box-sizing: border-box;}
.square p {color: #502314;-webkit-touch-callout: none; /* iOS Safari */ -webkit-user-select: none; /* Safari */ -khtml-user-select: none; /* Konqueror HTML */ -moz-user-select: none; /* Old versions of Firefox */ -ms-user-select: none; /* Internet Explorer/Edge */ user-select: none; /* Non-prefixed version, currently supported by Chrome, Edge, Opera and Firefox */}
.square::before { content: ''; display: block; padding-top: 100%;}
.square.bg-dark::before {background: #502314 !important;}
.square.bg-red::before {background: #d62300;}
.square.bg-yellow::before {background: #ffaa00;}
.square.bg-green::before {background: #ffaa00;}
.square.bg-dark h3, .square.bg-red h3, .square.bg-green h3,
.square.bg-dark p, .square.bg-red p, .square.bg-green p {-webkit-touch-callout: none; /* iOS Safari */ -webkit-user-select: none; /* Safari */ -khtml-user-select: none; /* Konqueror HTML */ -moz-user-select: none; /* Old versions of Firefox */ -ms-user-select: none; /* Internet Explorer/Edge */ user-select: none; /* Non-prefixed version, currently supported by Chrome, Edge, Opera and Firefox */}
.square .content {position: absolute; top: 0; left: 0; height: 100%; width: 100%;}
  /*flip card*/
  .flip-container, .flip-container2, .flip-container3, .flip-container4,
  .flip-container5, .flip-container6, .flip-container7, .flip-container8 {width: 100%; height: 100%; box-sizing: border-box; -webkit-perspective: 1000; -moz-perspective: 1000; -ms-perspective: 1000; perspective: 1000; -ms-transform: perspective(1000px); -moz-transform: perspective(1000px); -moz-transform-style: preserve-3d; -ms-transform-style: preserve-3d;}
  .content-flip {-webkit-transition: 0.6s; -webkit-transform-style: preserve-3d; -ms-transition: 0.6s; -moz-transition: 0.6s; -moz-transform: perspective(1000px); -moz-transform-style: preserve-3d; -ms-transform-style: preserve-3d; transition: 0.6s; transform-style: preserve-3d; position: relative;}
  .side {box-sizing: border-box;-webkit-backface-visibility: hidden; -moz-backface-visibility: hidden; -ms-backface-visibility: hidden; backface-visibility: hidden; -webkit-transition: 0.6s; -webkit-transform-style: preserve-3d; -webkit-transform: rotateY(0deg); -moz-transition: 0.6s; -moz-transform-style: preserve-3d; -moz-transform: rotateY(0deg); -o-transition: 0.6s; -o-transform-style: preserve-3d; -o-transform: rotateY(0deg); -ms-transition: 0.6s; -ms-transform-style: preserve-3d; -ms-transform: rotateY(0deg); transition: 0.6s; transform-style: preserve-3d; transform: rotateY(0deg); position: absolute; top: 0; left: 0;}
  .side-1 {position: relative; width: 100%; -webkit-transform: rotateY(0deg); -ms-transform: rotateY(0deg); background: lightgreen; z-index: 2;}
  .side-1 h3 {font-family: 'FlameBold' !important; color: #502314 !important; z-index: 1; background: #f5ebdc; padding: 10px 15px 10px 50px; font-size: 30px;  border-radius: 31px; position: absolute; bottom: 10px; left: 30px; -webkit-touch-callout: none; /* iOS Safari */ -webkit-user-select: none; /* Safari */ -khtml-user-select: none; /* Konqueror HTML */ -moz-user-select: none; /* Old versions of Firefox */ -ms-user-select: none; /* Internet Explorer/Edge */ user-select: none; /* Non-prefixed version, currently supported by Chrome, Edge, Opera and Firefox */}
  .side-1 h3:after {border-radius: 5px; position: absolute; content: ''; border: solid 2px #502314; width: 25px; height: 25px; left: 13px; top: 17px;}
  .side-1 h3:before {width: 30px; position: absolute; content: url(../../assets/img/tilde.svg); left: 17px; top: 10px; z-index: 1;}
  .side-1 .no-n {font-family: 'FlameRegular' !important;}
  .side-1 .no-n:before {content: ''!important;}
  .side-1 img {width: 100%;-webkit-touch-callout: none; /* iOS Safari */ -webkit-user-select: none; /* Safari */ -khtml-user-select: none; /* Konqueror HTML */ -moz-user-select: none; /* Old versions of Firefox */ -ms-user-select: none; /* Internet Explorer/Edge */ user-select: none; /* Non-prefixed version, currently supported by Chrome, Edge, Opera and Firefox */}
  .side-2 {cursor: pointer; padding: 25% 20px; text-align: center; width: 100%; -webkit-transform: rotateY(-180deg); -moz-transform: rotateY(-180deg); -o-transform: rotateY(-180deg); -ms-transform: rotateY(-180deg); transform: rotateY(-180deg);}
  .side-2 h3, .side-2 p {-webkit-touch-callout: none; /* iOS Safari */ -webkit-user-select: none; /* Safari */ -khtml-user-select: none; /* Konqueror HTML */ -moz-user-select: none; /* Old versions of Firefox */ -ms-user-select: none; /* Internet Explorer/Edge */ user-select: none; /* Non-prefixed version, currently supported by Chrome, Edge, Opera and Firefox */}
  .flip-container.hover .side-1, .flip-container2.hover .side-1, .flip-container3.hover .side-1, .flip-container4.hover .side-1,
  .flip-container5.hover .side-1, .flip-container6.hover .side-1, .flip-container7.hover .side-1, .flip-container8.hover .side-1 {-webkit-transform: rotateY(180deg); -moz-transform: rotateY(180deg); -o-transform: rotateY(180deg); transform: rotateY(180deg);}
  .flip-container.hover .side-2, .flip-container2.hover .side-2, .flip-container3.hover .side-2, .flip-container4.hover .side-2,
  .flip-container5.hover .side-2, .flip-container6.hover .side-2, .flip-container7.hover .side-2, .flip-container8.hover .side-2 {-webkit-transform: rotateY(0deg); -moz-transform: rotateY(0deg); -o-transform: rotateY(0deg); -ms-transform: rotateY(0deg); transform: rotateY(0deg);}
/* -----------------------------------------------
 * carousel
 * --------------------------------------------- */
.scroll-slider {position: relative; overflow: hidden; display: block; margin: 0; padding: 0; height: 100vh;}
.scroll-wrapper {width: 100% !important; position: relative; display: -webkit-box; display: flex; flex-wrap: nowrap; height: 100%; box-sizing: border-box; -webkit-touch-callout: none; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; touch-action: pan-y; -webkit-tap-highlight-color: transparent;}
.scroll-slide {-webkit-box-flex: 1; flex: 0 0 100%; max-width: 100%; height: 100%;}
.item {display: -webkit-box; display: flex; -webkit-box-pack: center; justify-content: center; -webkit-box-align: center; align-items: center; height: 100%;}
.item-container {position: relative;}
.item-title {font-size: 4vw; line-height: 1;}
.item-image {width: 50%;}
.item-image img {width: -webkit-fill-available !important;}
/* -----------------------------------------------
 * animate
 * --------------------------------------------- */
.reveal {position: relative; opacity: 0;}
.reveal.active {opacity: 1;}
.active.fade-bottom {animation: fade-bottom 1s ease-in;}
.active.fade-top {animation: fade-top 1s ease-in;}
.active.fade-left {animation: fade-left 1s ease-in;}
.active.fade-left-level1 {animation: fade-left 0.8s ease-in;}
.active.fade-left-level2 {animation: fade-left 0.6s ease-in;}
.active.fade-left-level3 {animation: fade-left 0.5s ease-in;}
.active.fade-right {animation: fade-right 1s ease-in;}
.active.fade-left-fast {animation: fade-left-fast 0.5s ease-in;}
.active.fade-left-faster {animation: fade-left-faster 0.8s ease-in;}
.active.fade-left-faster2 {animation: fade-left-faster2 0.5s ease-in;}
.active.fade-right-fast {animation: fade-right-fast 0.5s ease-in;}
.active.fade-bottom-fast {animation: fade-bottom-fast 0.5s ease-in;}
.active.fade-bottom-fast2 {animation: fade-bottom-fast2 0.5s ease-in;}
.active.fade-left-scale {animation: fade-left-scale 1s ease-in;}
@keyframes fade-bottom {0% {transform: translateY(50px);opacity: 0;}100% {transform: translateY(0);opacity: 1;}}
@keyframes fade-top {0% {transform: translateY(-50px);opacity: 0;}100% {transform: translateY(0);opacity: 1;}}
@keyframes fade-left {0% {transform: translateX(-100px);opacity: 0;} 100% {transform: translateX(0);opacity: 1;}}
@keyframes fade-left-fast {0% {transform: translateX(-100px);opacity: 1;}100% {transform: translateX(0);opacity: 1;}}
@keyframes fade-left-faster2 {0% {transform: translateX(-100px);opacity: 1;}100% {transform: translateX(0);opacity: 1;}}
@keyframes fade-left-faster {0% {transform: translateX(-100px);opacity: 0;}100% {transform: translateX(0);opacity: 1;}}
@keyframes fade-left-level1 {0% {transform: translateX(-100px);opacity: 0;} 100% {transform: translateX(0);opacity: 1;}}
@keyframes fade-left-level2 {0% {transform: translateX(-100px);opacity: 0;} 100% {transform: translateX(0);opacity: 1;}}
@keyframes fade-left-level3 {0% {transform: translateX(-100px);opacity: 0;} 100% {transform: translateX(0);opacity: 1;}}
@keyframes fade-right {0% {transform: translateX(100px);opacity: 0;}100% {transform: translateX(0);opacity: 1;}}
@keyframes fade-right-fast {0% {transform: translateX(100px);opacity: 0;}100% {transform: translateX(0);opacity: 1;}}
@keyframes fade-bottom-fast {0% {transform: translateY(50px);opacity: 0;}100% {transform: translateY(0);opacity: 1;}}
@keyframes fade-bottom-fast2 {0% {transform: translateY(50px);opacity: 1;}100% {transform: translateY(0);opacity: 1;}}
@keyframes fade-left-scale {from {width:0px;} to {width:calc( 100% - 1px );}}
/* -----------------------------------------------
 * Timeline
 * --------------------------------------------- */
.timeline {width: 100%; max-width: 1240px; margin: 0 auto; list-style: none; padding: 10px 0; position: relative;}
.timeline:before {top: 0; bottom: 0; position: absolute; content:" "; width: 2px; background: rgb(162,134,107); background: linear-gradient(180deg, rgba(162,134,107,0) 0%, rgba(255,170,0,1) 50%, rgba(30,32,65,0) 100%);left: 50%; margin-left: -1.5px;}
.timeline > li {position: relative; width: 50%; float: left; clear: left;}
.timeline > li:nth-child(1) {margin-top: 200px;}
.timeline > li:nth-child(2) {margin-top: 480px;}
.timeline > li:nth-child(3) {margin-top: 330px;}
.timeline > li:nth-child(4) {margin-top: 260px;}
.timeline > li:nth-child(5) {margin-top: 240px;}
.timeline > li:nth-child(6) {margin-top: 170px;}
.timeline > li:nth-child(7) {margin-top: 240px;}
.multi-img-tl img {width: 40% !important; max-width: 110px;}
.multi-img-tl .mright {display: inline-block; float: right;}
.multi-img-tl .mleft {display: inline-block; float: left;}
.txt-left {padding-right: 140px; text-align: right;}
.txt-right {padding-left: 70px; text-align: left;}
.timeline > li:before, .timeline > li:after {content:" "; display: table;}
.timeline > li:after {clear: both;}
.timeline > li:before, .timeline > li:after {content:" "; display: table;}
.timeline > li:after {clear: both;}
.timeline > li > .timeline-panel {width: calc(100% - 25px); width: -moz-calc(100% - 25px); width: -webkit-calc(100% - 25px); float: left; position: relative;}
.timeline > li > .timeline-badge {color: #ffaa00; width: 260px; height: auto; line-height: 50px; text-align: center; position: absolute; top: 7px; right: -130px; z-index: 100;}
.timeline > li > .timeline-badge img {width: 100%;}
.timeline > li.timeline-inverted > .timeline-panel {float: right;}
.timeline > li.timeline-inverted > .timeline-panel:before {border-left-width: 0; border-right-width: 15px; left: -15px; right: auto;}
.timeline > li.timeline-inverted > .timeline-panel:after {border-left-width: 0; border-right-width: 14px; left: -14px; right: auto;}
.timeline > li.timeline-inverted {float: right; clear: right;}
.timeline > li.timeline-inverted > .timeline-badge {left: -130px;}
.no-float {float: none !important;}
/* -----------------------------------------------
 * footer
 * --------------------------------------------- */
 .box-burger-col {margin-top: -15%;}
.col-burger {padding: 25px 50px; position: relative;}
/*.col-burger .box-color {position: absolute; z-index: 1 !important; width: 100%; height: 30%; top: 0; background: #f5ebdc;}*/
.col-burger img {z-index: 10;}
.col-burger .box-text {text-align: center; border-bottom-left-radius: 25px; border-bottom-right-radius: 25px; z-index: 10; padding: 10% 5% !important;}
.col-burger h2 {font-size: 2.5rem;}
.col-burger h2, .col-burger p {color: #f5ebdc !important;}
.footer {overflow:hidden; position: relative; display: block; margin: 0; padding: 0; height: 100vh;}
.footer .col-12 {z-index: 1000;}
.footer .box-color.footer {background: #502314; position: absolute; top: 0; left: 0; height: 100%; z-index: 0;}
.footer .box-text {text-align: center; height: 100vh}
.footer .box-text h2 {color: #ff8733 !important;}
.footer .box-text a {background: #d82300; border: none; max-width: 300px; width: 100%; padding: 0px; margin-top: 20px;}
.footer .box-text a p {color: #ff8733;}
.footer {background-size: cover;  background-image: url('../../assets/img/KVcierre_desktop.jpg'); background-position: center; background-repeat: no-repeat;}
.footer .footer-bg {position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width: auto; min-width: 100%; height:100%;}
.footer-logo {width: 50%;}
.footer .footer-logo img {position: relative; max-width: 450px; left: 0; right: 0; top: 0;}
.footer .conservantes-img {display: flex; flex-direction: row; flex-wrap: wrap; width: 100%; justify-content: space-between; margin-top: 50px;    }
.footer .conservantes-img img { max-width: 25%;}
.footer-legal { position: absolute; bottom: 30px; left: 50%; transform: translateX(-50%); width: 90%;}
.footer-legal p {font-size: 14px; color: #fbfbf5;}
.height100 {height: 100%;}
/*FIREFOX*
/@-moz-document url-prefix() { 
   .square-inner img.size70 {width: 70%; position: inherit; display: block;}
  .square-inner.img-box img { position: inherit;}
  .square-inner.img-box.box-megan img {width: 100%;}
  .square-inner.img-box.box-megan .box-color.green {display: none;}
  .square-inner.animate-box img {position: inherit;}
  .square-inner.animate-box img.bk2 {position: inherit;}
  .square-inner.animate-box img.bk3 {display: none;}
}
/* -----------------------------------------------
 * screens
 * --------------------------------------------- */
@media (max-width: 1440px) {
  .hero .text {max-width: 70%;}
  .total-center div {width: 42%;}

}

@media (max-width: 1390px) {
  .accordion {width: 25%;}
  .box-corona .first-box h3 {font-size: 2.6vw !important;}
  .square-container .square h3 {font-size: 22px !important;}
  .side-1 h3:after {top:11px;}
  .side-1 h3:before {top:5px;}
  .square-container .square p {font-size: 1.6vw !important;}
}
@media (max-width: 1200px) {
  .hero .text {max-width: 90%;}
  .hero h1 {font-size: 6vw;}
  .hero h2 {font-size: 6vw;}
}
/* -----------------------------------------------
 * mobile
 * --------------------------------------------- */
@media (max-width: 768px) {
  .sabor-n h2 {font-size: 8vw;}
  .box-vegetal .logoWV {width: 70% !important;}
  .lg-reveal {display: none;}
  .xs-reveal {display: inherit;}
  .box-vegetal {margin-bottom: 50px;}
  .box-text {padding: 20% 6% 15%;}
  .full-height {height: auto;} 
  .min-height {height: 360px;} 
  .full-width {width: 100% !important; left: 0 !important; right: 0 !important;} 
  .timeline-body {padding-right: 25px;}
  .total-center {align-items: center;}  
  .total-center img { max-width: 75%;  max-height: 80px; margin: 15px;}
  .total-center h3 { font-size: 23px;}
  .total-center div {width: 22%;}
  .box-nuggets h3 {font-size: 18px;}
  .box-corona .first-box h3 {font-size: 4vw !important;}
  .square-container .square h3 {font-size: 3.8vw !important;}
  .square-container .square p {font-size: 3.4vw !important;}
  .side-1 h3:after { width: 20px; height: 20px;  left: 13px; }
  .side-1 h3:before {width: 25px;}
  .m-w-85{max-width: 95% !important;}
  .banner-car.fix-ios {min-height: 120% !important;}
  .banner-car.fix-ios img
  .full-height, .full-height .row {height: auto !important;}
  .hidden-desktop {display: block !important;}
  .hidden-mobile {display: none !important;}
  .page-section {padding: 0 !important;}  
  .total-center {padding-top: 50px;}
  /*video*/
  .hero {height: 90vh !important;}  
  .hero .text {z-index: 1000;} 
  .hero h1 {font-size: 10vw !important; margin: 10px 0;}
  .hero h2 {font-size: 8vw !important;}
  .hero h3 {font-size: 6vw !important;}
  .hero .BK-Logo {max-width: 290px;}  
  section.section-items .col-6 {display: block; position: relative; width: 100%;}
  .square-inner.img-box {position: absolute !important; bottom: 0 !important;}
  .square-inner.img-box.box-green {position: inherit !important;}
  .square-inner.img-box.box-green .box-color.green {display: none;}
  .square-inner.img-box.box-green img {left: 3% !important; width: 65% !important}
  .box-nuggets .square-inner img.size70 {position: inherit !important;}
  .gif.hidden-desktop {margin-top: 5%;}
  .col-burger h2, h2 {font-size: 8vw;}  
  .side-2 p {font-size: 3vw !important;}
  /*timeline*/
  .txt-left {padding-right: 0;}
  .timeline {margin: 0 auto 60px;}
  ul.timeline .txt-left {text-align: left !important;}
  ul.timeline h3 {font-size: 6vw !important;}
  ul.timeline p {font-size: 17px !important;}
  .no-padding-bottom {padding-top: 0 !important;}
  ul.timeline:before {left: 40px;}
  ul.timeline > li {margin-bottom: 0px; position: relative; width:100%;float: left; clear: left;}
  ul.timeline > li > .timeline-panel {width: calc(100% - 65px);width: -moz-calc(100% - 65px);width: -webkit-calc(100% - 65px);}
  ul.timeline > li > .timeline-badge {left: 15px;margin-left: 0;top: 0; width: 50px !important; height: 24px !important;}
  .multi-img-tl .mleft, .multi-img-tl .mright  {display: block; float: none;}
  .multi-img-tl img {width: 100% !important; display: block; margin:0 auto 15px;}
  ul.timeline > li > .timeline-panel {float: right; padding-left: 15px;}
  .timeline > li.timeline-inverted > .timeline-panel {padding-left: 15px !important;}
  ul.timeline > li > .timeline-panel:before {border-left-width: 0; border-right-width: 15px; left: -15px; right: auto;}
  ul.timeline > li > .timeline-panel:after {border-left-width: 0; border-right-width: 14px; left: -14px; right: auto;}
  .timeline > li.timeline-inverted {float: left; clear: left; margin-top: 30px; margin-bottom: 30px;}
  .timeline > li.timeline-inverted > .timeline-badge {left: 15px;}
  .timeline > li:nth-child(1) {margin-top: 30px !important;}
  .timeline > li:nth-child(2) {margin-top: 100px !important;}
  .timeline > li:nth-child(3) {margin-top: 0 !important;}
  .timeline > li:nth-child(4) {margin-top: 40px !important;}
  .timeline > li:nth-child(5) {margin-top: 0px !important;}
  .timeline > li:nth-child(6) {margin-top: 50px !important;}
  .timeline > li:nth-child(7) {margin-top: 20px !important;}
  .txt-right {padding-left: 0px !important;}
  .square h3 {font-size: 4vw !important; left: 10px !important;}
  .square {flex-basis: calc(50%) !important;}
  .stamp {top: -5px; width: 40px;}
  .column2 {width: 100% !important; flex: 100% !important;}
  .accordion {position: inherit !important; width: 100%; display: block !important;}
  .accordion-header.extra-pad h3 {padding-left: 0px !important;}
  .stamp.haz2 {position: inherit !important; margin-bottom: 10px;}
  .accordion-body {min-width: 100% !important; position: inherit !important; top: 0 !important;}
  .box-accordion {padding-left: 50px;}
  .columns.whop-sec img {width: 100%; top: 10%;}
  .scroll-slider {height: auto;}
  section.page-section .col-6 {width: 100% !important; flex: 100% !important;}
  .square-inner.animate-box img {position: inherit !important;}
  .square-inner.img-box img {position: inherit !important; left: 10% !important; width: 85% !important; top: 20px;}
  .square-inner.box-megan {position: relative !important;}
  .square-inner.box-megan img {bottom: 0; left: unset !important; width: 100% !important; right: 0px !important;}
  .square-inner.box-megan .box-color {position: absolute;}
  .smartphone, .bk3 {display: none;}
  .footer {height: 600px}
  .footer img {width: 100%;}
  .footer {background-image: url('../../assets/img/KVcierre_mobile.jpg');}
  .footer .footer-logo img {max-width: 300px; opacity: 1 !important;}
  .footer .box-text {padding: 3rem 0 !important; height: auto;}
  .footer .conservantes-img img { width: 190px; text-align: center; margin: 0 auto 15px;}
}
/*iOS*/
@supports (-webkit-touch-callout: none) {
   /* CSS specific to iOS devices */
   .full-height, .col-6, .square-inner.fix-ios {height: auto !important;}
   .box-nuggets, .square-inner.box-megan {height: auto !important;}
   .box-nuggets .square-inner img.size70 {height: auto !important;}
}
}
@supports not (-webkit-touch-callout: none) {
   /* CSS for other than iOS devices */ 
}