body{font-family: "Apercu"; color: #000; font-size: 14px; padding-top: 70px;}
h1 {font-family: "Apercu Pro Black"; }
a{ text-decoration: none; }
.abremenu{ display: none; }
.container{ width: 65%; margin: 0 auto; position: relative; }
.clearfix{ clear: both; position: relative; }
#topo{ position: fixed; top: 0; left: 0; z-index: 10; width: 100%; height: 50px; padding: 10px 0; background:#fff; border-bottom: #eee solid 1px; }
#topo .marca{ float: left; }
#topo .marca img{ width: auto; height: 30px; }
#topo .menu{ float: left; margin: 9px 0 0 45px; }
#topo .menu ul li{ float: left;  margin: 0 0 0 40px }
#topo .menu ul li a{color: #000; text-transform: uppercase; font-size: 14px; }
.banner{ position: relative; }
.banner img{ width: 100%; height: auto; }
.banner .stellabanner{ background: url(../img/stella01.png) top center no-repeat; background-size: cover; width: 250px; height: 416px; position: absolute; bottom: -138px; left: 10%; }
.sobre{ padding: 160px 0 30px 0; }
.sobre img{width: 45%; margin: 0 3% 0 0; height: auto; float: left;}
.sobre .txt{ float: left; width: 50%; margin: 30px 0 0 0; }
.sobre .txt h2{font-family: "Apercu Pro Black"; font-size: 60px; text-transform: uppercase;}
.sobre .txt p{ line-height: 150%; width: 60%; margin: 0 0 20px 0;}
.sobre .txt strong{ font-weight: bold; }
.kit{ padding: 100px 0 80px 0; background: #f8f8f8; position: relative; }
.kit img{ float: left; margin: 0 4% 0 0; width: 50%; height: auto; }
.kit .beba{ background:url(../img/beba-moderacao.png) top center no-repeat; width: 228px; height: 28px; display: block; text-indent: -9999px; position: absolute; left: 50%; bottom: 20px; margin-left: -114px; }
.kit .itens{ width: 40%; float: left; margin: 40px 0 0 0; }
.kit .itens h2{ text-transform: uppercase; font-size: 16px; margin: 0 0 20px 0; }
.kit .itens ul li{ margin: 0 0 20px 0; background: url(../img/check.png) no-repeat top left; background-size: auto 14px; padding-left: 25px; text-transform: uppercase; font-size: 14px; }
.kit .itens ul li span{ font-size: 10px; line-height: 200%; display: block; }
.kit .imgstella{ background: url(../img/stella02.png) top center no-repeat; background-size: cover; width: 250px; height: 523px; position: absolute; top: -165px; right: 0; }
.passo{ position: relative; padding: 80px 0 80px 0; }
.passo .title h2{ margin: 0;  display: block; float: left; font-size: 50px; width: 37%; }
.passo .title h2 img{ width: 80%; height: auto; }
.passo .title a{ float: left; width: 60%; }
.passo .title  a img{ width: 100%; height: auto; }
.passo .receita{ margin: 40px 0 0 0; }
.passo .receita ul.desktop{ float: left; width: 48%; margin: 0 1%; }
.passo .receita ul li{ min-height: 29px; float: left; margin: 0 0 10px 0; text-transform: uppercase; width: 100%; line-height: 150%; list-style: disc; font-size: 11px; }
.passo .receita ul.desktop li:nth-child(1){ list-style: none; }
.passo .receita ul li strong{ font-family: "Apercu Pro Black"; }
.passo span{ width: 100%; text-align: center; display: block; margin-top: 40px; line-height: 150%; font-style: italic; }
.video{ padding: 100px 0 0 0;background: rgb(248,248,248); background: linear-gradient(180deg, rgba(248,248,248,1) 0%, rgba(248,248,248,1) 20%, rgba(255,255,255,1) 100%); position: relative; text-align: center; }
.video h2{ font-size: 28px; text-transform: uppercase; margin: 0 0 10px 0; letter-spacing: 2px; }
.video h3{font-family: "Apercu Pro Black"; font-size: 28px; text-transform: uppercase; letter-spacing: 2px; margin: 0 0 40px 0; }
.video img{ width: 60%; }
#rodape{ background: url(../img/logostella.png) top center no-repeat; width: 100%; padding-top: 380px; margin: 100px 0 0 0; }
#rodape .cont{ border-top:#d21539 solid 4px; background:#fff; padding: 10px 0;}
#rodape .cont img{ float: left; height: 30px; width: auto; margin: 7px 0 0 0;}
#rodape .cont .redes{ float: right; }
#rodape .cont .redes li{ float: left; margin: 3px 0 0 10px; }
#rodape .cont .redes li a{ background: url(../img/redes.png) no-repeat; width: 37px; text-indent: -9999px; display: block; height: 36px; background-size: cover; }
#rodape .cont .redes li a.youtube{ background-position: 0 0; }
#rodape .cont .redes li a.instagram{ background-position: -44px 0; }
#rodape .cont .redes li a.facebook{ background-position: -88px 0; }
#rodape .cont .redes li a.twitter{ background-position: -132px 0; }
#rodape .final{ background:#d21539; text-align: center; font-size: 13px; font-style: italic; color: #fff; line-height: 150%; padding: 25px 0;}
.mobile{ display: none; }
#age{background: url(../img/age.jpg) top center no-repeat; width: 100%; height: 100%; background-size: cover;}
#age ul{ position: absolute; left: 31%; top: 76%; }
#age ul li{ float: left; margin: 0 20px 0 0; }
#age ul li a{font-size: 22px; font-family: "Apercu Pro Black"; text-transform: uppercase; border:#9f9f9f solid 1px; border-radius: 50px; color: #000; padding: 10px 30px;}
@media screen and (max-width: 1000px) {
    .container{ width: 90%; }
    .mobile{ display: block; }
    .abremenu{ display: block; position: absolute; right: 0; top: 3px; }
    #topo .menu{ position: fixed; background:#fff; top: 41px; right: 0; width: 60%; z-index: 8; display: none; }
    #topo .menu ul li{ float: none; margin:20px 0 0px 10%; border-bottom: #ededed solid 1px; padding-bottom: 20px; z-index: 10; }
    .banner .stellabanner{ display: none; }
    .sobre{ padding: 0px 0 30px 0; }
    .sobre img{ width: 100%; }
    .sobre .txt{ width: 90%; margin: 30px 0 0 5%; }
    .sobre .txt p{ width: 100%; }
    .kit{ padding: 70px 0; }
    .kit img{ width: 100%; margin: 0; }
    .kit .itens{ width: 100%; }
    .kit .imgstella{ display: none; }
    .passo .receita ul.desktop{ float: left; width: 98%; margin: 0 1% 20px 1%; }
    .passo .receita ul li{ width: 100%; margin-right: 0; }
    .video{ padding: 50px 0 0 0; }
    .video h2{ font-size: 20px; }
    .video h3{ font-size: 24px; line-height: 130%; }
    .video img{ width: 80%; margin-left: 10%; }
    #rodape{ background-size: 300px auto; margin-top: 60px; padding-top: 165px; }
    #rodape .cont img{ height: 25px; margin-top: 8px; }
    #rodape .final{ font-size: 11px; }
    #age{ background-size: 130% auto ; background-position: left top; }
    #age ul{ left: initial; right: 5%; top:33%; }
    #age ul li a{font-size: 16px;}
}