html { line-height: 1.15; -ms-text-size-adjust: 100%; -webkit-text-size-adjust: 100%; }
dl dl, dl ol, dl ul, ol dl, ol ol, ol ul, ul dl, ul ol, ul ul { margin-block-start: 0; margin-block-end: 0; }
hr { box-sizing: content-box; height: 0; overflow: visible; }
main { display: block; }
a { background-color: transparent; }
b, strong {font-weight: bolder; }
video { display: inline-block; }
img { border-style: none; }
svg:not(:root) { overflow: hidden; }
button, input, select { margin: 0; }
button { overflow: visible; text-transform: none; }
button, [type="button"], [type="reset"], [type="submit"] { -webkit-appearance: button; }
[hidden] { display: none; }
h1 { font-size: 2em; margin: 0.67em 0; }
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section { display: block; }
ol, ul { list-style: none; }
blockquote, q { quotes: none; }
blockquote:before, blockquote:after, q:before, q:after { content: ''; content: none; }
table { border-collapse: collapse; border-spacing: 0; }
* {margin: 0; padding: 0; box-sizing: border-box; }
* a {cursor: pointer; text-decoration: none; color:#fff }
* i {font-style: italic; }
* p { font-size: 1rem;}
@font-face {
    font-family: 'Avenir Black';
    src: url('fonts/avenir-black.eot');
    src: url('fonts/avenir-black.eot?#iefix') format('embedded-opentype'),
        url('fonts/avenir-black.woff2') format('woff2'),
        url('fonts/avenir-black.woff') format('woff'),
        url('fonts/avenir-black.ttf') format('truetype');
    font-weight: 900;
    font-style: normal;
}
@font-face {
    font-family: 'Avenir Book';
    src: url('fonts/avenir-book.eot');
    src: url('fonts/avenir-book.eot?#iefix') format('embedded-opentype'),
        url('fonts/avenir-book.woff2') format('woff2'),
        url('fonts/avenir-book.woff') format('woff'),
        url('fonts/avenir-book.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}
.displayFlex {
    display: -webkit-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
}
.displayNone { display: none }
.trans5 {
    -webkit-transition: all 0.5s ease;
    -moz-transition: all 0.5s ease;
    -ms-transition: all 0.5s ease;
    -o-transition: all 0.5s ease;
    transition: all 0.5s ease
}
.margin{
  position: relative;
  width: calc(100% - 50px);
  margin: 0 auto;
}
.backWhite{ background: #fff }
.backAlimentos{ background: #e76049; }
.colorAlimentos, .activeAlimentos{ color: #e76049; }
.fillAlimentos{ fill: #e76049; }

.backHerbolaria{ background: #4d7979; }
.colorHerbolaria, .activeHerbolaria{ color: #4d7979; }
.fillHerbolaria{ fill: #4d7979; }

.backCuidadoPersonal{ background: #c25e8f; }
.colorCuidadoPersonal, .activePersonal{ color: #c25e8f; }
.fillCuidadoPersonal{ fill: #c25e8f; }
h1,h2,h3,h4{ font-family: 'Avenir Black', sans-serif; }
b{ font-family: 'Avenir Black', sans-serif; }
body{
  font-family: 'Avenir Book', sans-serif;
  top: 0;
  left: 0;
  width: 100vw;
  min-width: 250px;
  font-size: 16px;
  color: #333333;
}
nav{
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  min-width: 250px;
  height: 60px;
  z-index:500;
}
nav>div{
  height: 100%;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: space-between;
  -webkit-justify-content: space-between;
  -ms-flex-pack: space-between;
  justify-content: space-between;
}
nav>div>a{
  display: block;
  height: 80%;
}
.buttonMenu{
  width: 45px;
  height: 45px;
}
.titleMenu{
  width: calc(100% - 150px);
  max-width: 280px;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  /* border:1px solid red; */
}
.titleMenu>img{
  width: 100%;
}
.priceButton, .otherButton{
  display: block;
  position: relative;
  width: 150px;
  line-height: 60px;
  margin: 10px auto;
  text-align: center;
}
.priceButton:hover{
  opacity: 0.7;
}
.pleca{
  position: relative;
  width: 100vw;
  min-width: 250px;
  height: 60px;
}
#index{
  width: 100vw;
  min-width: 250px;
  height: 100vh;
  background-image: url('../img/back.png');
  background-position: top center;
  background-size: contain;
  background-repeat: no-repeat;
}
.arbutton{
  position: fixed;
  bottom: 50px;
  right:0;
  width: 120px;
  height: 100px;
  background: #2a61a4;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  z-index: 2000;
}
.arbutton2{
  width: 60px;
  height: 60px;
}
.arbutton>input{
  height: 0;
  opacity: 0;
}
.arbutton>p{
  margin: 5px auto;
  font-size: 0.7rem;
  width: 80%;
  text-align: center;
}
.arbutton>img{
  height: 50%
}
#menu{
  position: fixed;
  top:60px;
  left: -100vw;
  width: 100vw;
  min-width: 250px;
  height: calc(100vh - 60px);
  z-index: 1000;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
   -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;

}
#menu>a:first-child{
  margin-top: 100px;
}
#menu>a{
  padding: 10px 0;
  font-size: 1.5rem;
  width: 80%;
  margin: 10px auto;
  text-align: center;
}
main{
  position: relative;
  margin: 60px auto 0 auto;
  width: 100vw;
  min-width: 250px;
}
main>section{
  position: relative;
  width: 100%;
  height: 100vh;
}
#cover>div{
  /* border:1px solid green; */
  height: 100%;
}
#cover>.margin>h1{
  font-size: 1.5rem;
  text-align: center;
}
#cover>.margin>.data{
  font-size: 1rem;
  text-align: center;
}
#info>.margin{
  height: 100%
}
/* slider */
.slider{
  position: relative;
  width: 80%;
  height: 350px;
  margin: 20px auto 0 auto;
  /* border:1px solid blue; */
}
.slider>li{
  width: 100%;
  margin: 80px auto;
  height: 300px;
  background-repeat: no-repeat;
  background-position: center bottom;
  background-size: contain;
  /* border:1px solid red; */
}
.slider>.interface{
  position: absolute;
  bottom: 0;
  width: 100%;
  height: 50px;
  /* border: 1px solid red; */
}
.slider>.interface>div{
  height: 100%;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
}
.slider>.interface>div>li{
  width: 15px;
  height: 15px;
  border-radius: 50%;
  margin: 0 10px;
}
.tabsInfo{
  width: 100%;
  min-width: 250px;
  height: 100%;
}
.interfaceTabs{
  width: 100%;
  height:50px;
  border-bottom:1px solid #808080;
}
.interfaceTabs>li{
  width: 33.33%;
  height: 100%;
  line-height: 50px;
  text-align: center;
  cursor: pointer;
}
.interfaceTabs>li>h2{
  font-size: 1.1rem;
}
.interfaceSection{
  position: relative;
  width: 100%;
  height: calc(100% - 50px);
  overflow: hidden;
}
.interfaceSection>.wrapper{
  position: absolute;
  left: 0;
  width: 300%;
  height: 100%;
}
.interfaceSection>.wrapper>li{
  width: 33.33%;
  height: 100%;
  padding: 20px 5px;
}
.acercaTab>p{
  margin: 0 auto 30px auto;
  text-align: center;
}
.acercaTab>h3{
  text-align: center;
  margin: 10px auto;
  font-size: 1.1rem;
}
.ingredientesTab>h4{
  font-size: 1.2rem;
  text-align: center;
}
.ingredientesTab>.tablaIngredientes{
  margin: 10px auto;
  width: 80%;
  height: 400px;
  background-position: center top;
  background-repeat: no-repeat;
  background-size: contain;
  /* border:1px solid blue; */
}
.beneficiosTab>h3{
  margin: 10px 0;
}
.beneficios>li{
  margin: 5px auto;
}
.beneficios>li>svg{
  width: 25px;
  height: 25px;
  /* border:1px solid blue; */
}
.beneficios>li>h5{
  color: #808080;
  height: 30px;
  padding: 0 5px;
  /* border:1px solid green; */
  line-height: 30px;
  font-size: 1.1rem;
}
.certificados{
  width: 100%;
  height: 100px;
}
.certificados>li{
  margin: 0 5px;
  width: 80px;
  height: 80px;
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
}
#galerias{
  margin: 0 auto;
  text-align: center;
  color: #fff;
}
#galerias>.phrase{
  margin: 0 auto;
  width: 80%;
  padding: 20px 0;
}
#galerias>.slider>.interface>div>li{
  background: #fff;
}
#galerias>.pleca{
  position: absolute;
  bottom: 0;
  background: #fff;

}
.pleca>p{
  color: #fff;
  text-transform: uppercase;
}
#relacionados{
  height: auto;
}
#relacionados>h2{
  text-align: center;
  text-transform: uppercase;
  line-height: 60px;
}
.productosRelacionados{
  width: 100%;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-box-align: center;
-webkit-align-items: center;
-ms-flex-align: center;
align-items: center;
}
.productosRelacionados>li{
  width: 100%;
  width: 300px;
  height: 300px;
  margin: 10px auto;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
}
.productosRelacionados>li>div{
  margin-top: 20px;
  height: calc(100% - 80px);
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
  /* border: 1px solid red; */
}
.productosRelacionados>li>h6{
  width: 80%;
  margin: 5px auto;
  font-size: 1rem;
  text-align: center;
  color: #fff;
  height: 60px;
  /* border:1px solid red; */
}
footer{
  width: 100%;
  min-width: 250px;
  padding: 20px 0;
  text-align: center;
  color: #fff;
}