@font-face {
  font-family: 'gardenia-blackbold';
  src: url('../fonts/gardenia-black-webfont.woff2') format('woff2'),
       url('../fonts/gardenia-black-webfont.woff') format('woff');
  font-weight: normal;
  font-style: normal;
}
@font-face {
  font-family: 'gardenia-boldbold';
  src: url('../fonts/gardenia-bold-webfont.woff2') format('woff2'),
       url('../fonts/gardenia-bold-webfont.woff') format('woff');
  font-weight: normal;
  font-style: normal;
}
@font-face {
  font-family: 'gardenia-bookregular';
  src: url('../fonts/gardenia-book-webfont.woff2') format('woff2'),
       url('../fonts/gardenia-book-webfont.woff') format('woff');
  font-weight: normal;
  font-style: normal;
}
@font-face {
  font-family: 'gardenia-extraboldbold';
  src: url('../fonts/gardenia-extrabold-webfont.woff2') format('woff2'),
       url('../fonts/gardenia-extrabold-webfont.woff') format('woff');
  font-weight: normal;
  font-style: normal;
}

body{ color:#69256a; line-height: normal; font-family: 'gardenia-bookregular';}

body .navbar{background: url("../img/menu.png") no-repeat center top; height: 143px; padding-top: 0; align-items: flex-start;z-index:5;}
body .navbar-brand img{width:120px;margin-top: 0}
body .navbar .nav-link{ text-transform:uppercase; font-family:'gardenia-boldbold'; font-size:1.125rem}

.nav-item{color:#69256a;font-size:18px;font-weight: bold;padding-left:26px;}
.dropdown-item{color:#69256a;font-size:18px;font-weight: bold;padding-left:26px;}
.nav-link{color:#69256a;}
.nav-link:hover{color:#91b85c;}
.navbar-toggler-icon{background-image: url("../img/navbar.png") !important;}
.navbar-toggler{border:0px solid transparent;}
.shadow-top{border-top:3px solid rgba(51,18,52,1);}
.dropdown-menu{padding-top: 0px;}
.class{ display: none; position: absolute; top:0; left:0; background:red; width: 100%; height: 100%;}



/* SECTION 1 */
#banner1{background: url("../img/banner1.png") no-repeat center top #4f1341; position: relative; overflow: hidden;}
#banner1 .box{ margin:10vw auto;}
#banner1 .text{ font-weight: 500;font-size:26px;color:#ffffff;text-transform: uppercase;}
#banner1 .banner1-sheet,
#banner1 .banner1-product-options{ position: absolute; top: 62%; right: 0; max-width:40%; transform: translate(0 ,-50%);z-index: 3;  }
#banner1 .banner1-img-1{position: absolute; bottom: 10vw; left: 7vw}
#banner1 .banner1-img-2{ position: absolute;bottom: 10vw;left: 52%;}
#banner1 .banner1-img-3{ position: absolute;top: 8vw;right: 2%;}
.nav-label-mobile{ right: 18px !important;top: 83px !important;width: 9.7% !important;left: auto !important;}
.first-title{font-family:'gardenia-blackbold';font-size:3.625rem;color:#ffffff;text-transform: uppercase}
.first-title span{color:#f5d545}
.nav-label{position:absolute;top:130px;right:22vw;z-index:4;}

/* end */

/* SECTION 2 */
#section-2{background: url("../img/banner2.png") no-repeat;text-transform: uppercase;}
#section-2 .title{ font-family:'gardenia-blackbold'; padding: 50px auto 60px;margin:50px auto 60px;font-size:1.875rem;color:#69256a;}
#section-2 .title .ico-pin{ width: 33px; height: 41px; display: inline-block; margin-right:10px; background: url('../img/ico-pin.png') no-repeat; vertical-align:text-bottom}
#section-2 .btn-local{padding:17px 23px 10px;background-color: #69256a;text-decoration: none;color:#ffffff;font-family:'gardenia-blackbold'; font-size:1.25rem;-webkit-box-shadow: 0px 4px 0px 0px rgba(40,15,36,1);-moz-box-shadow: 0px 4px 0px 0px rgba(40,15,36,1);box-shadow: 0px 4px 0px 0px rgba(40,15,36,1);}
#section-2 .btn-local:hover,
#section-2 .btn-local.active{background-color: #77af5c;text-decoration: none;color:#ffffff;}
#section-2 .local-group{display: block;margin:0px auto;}
#section-2 .map{ margin:4vw auto; height: 14vw; border-bottom:4px solid #dbdbdb}

/* end */

/* SECTION 3 */
#section-3{ position: relative; background:url('../img/section-3-bg.png') no-repeat #f5d545 center; font-family:'gardenia-boldbold'; text-align: center;}
#section-3 .section-3-img-1{ position: absolute;top: 4%;left: 5%;}
#section-3 .section-3-img-2{ position: absolute;bottom: 4%;right: 5%;}
.title{font-size:16px;color:#6a256a;}
.thumb{position:relative;}
.thumb-hover{position: absolute;top: 0;left: 0;width: 100%; height:100%; opacity:0;padding:1.5vw; cursor:pointer; background: rgba(0, 0, 0, 0.7); color:#ffffff;}
.thumb-hover:hover{opacity:1;}
.thumb-hover h5{font-size:1.25rem; text-transform:uppercase; margin-bottom:0.5rem}
.thumb-hover p{ text-align:left; color:#ffffff; padding:0}


.thumb p.legend{color:#6a256a;text-align: center;font-size:40px;padding:60px 0px 20px; text-transform:uppercase; font-family: 'gardenia-extraboldbold';}

/* SECTION 4 */
#section-4{position:relative; background:url('../img/bg-item.jpg') no-repeat center top #f5d545; overflow: hidden;}
#section-4 h3{ font-family: 'gardenia-extraboldbold'; font-size:2.3125rem; text-transform: uppercase}
#section-4 .text{position: absolute; color: #FFFFFF;}

.section-4-box-1{position: absolute;left: -6vw;top: 213px}
.section-4-box-1 .text{ top: 220px;left: 133px;}

.section-4-box-2{position: absolute; right:-46px; top:915px;text-align: right}
.section-4-box-2 .text{top:308px;left: 170px;}
.section-4-box-2 .text p{text-align: right}

.section-4-box-3{position:absolute; left:-8vw; top:1563px}
.section-4-box-3 .text{ top: 213px; left: 166px; width: 300px;}

.section-4-box-4{position: absolute; right: -7vw;top: 2306px;}
.section-4-box-4 .text{ top: 260px; left: 140px; text-align: right;}

/* end */

/* footer */
#footer{background-image: url("../img/footer.png"); background-repeat: no-repeat;height:400px;background-color:#69256a; text-transform: uppercase; font-size:0.875rem; color:#FFFFFF}
#footer .title{ font-family:'gardenia-boldbold'; color:#FFFFFF}
#footer h6{font-weight: 500;font-size:30px;color:#69256a;text-align:center;padding:128px 0px 100px;}
#footer h6 span{padding:5px 0px 0px 37px;}

#footer p{font-weight: 500;font-size:12px;color:#ffffff;text-transform: uppercase;padding:0px;margin:0px;}
#footer .footer-img-1{ position: absolute;top: 120px;left: 371px}
#footer .footer-img-2{ position: absolute;top: 124px;right: 378px}
#footer .list-unstyled{ font-family:'gardenia-bookregular'; margin-bottom: 0}
#footer .list-unstyled li{ line-height:120%}
#footer #social{ color:#c145c3; font-size:0.8125rem}
#footer #social a{ color:#c145c3!important}
/* end */


@media (max-width: 1500px){
  .nav-label, .plant{display:none;}
  
}


@media (min-width: 991px) and (max-width: 1567px){
  #banner1 .banner1-img-1{ width:80px;left:3vw; bottom:2vw }
}

@media (max-width: 991px) {
  #section-4{background:url('../img/bg-item-mobile.jpg') no-repeat center top; background-size: 100% auto}
}


@media (min-width: 769px) and (max-width: 991px){
  #banner1 .banner1-img-1 { bottom: 0vw; left: 17vw; width: 80px}
  #banner1 .banner1-img-2{ left:82%}
  #banner1 .banner1-img-3{ top: 22vw; right: 2%}
  #section-2 .btn-local{font-size:1rem}
  #section-3 .section-3-img-1{ top:1%}
  #section-3{ background-image: none}
  #section-3 .thumb{ width: 100%; max-width: 100%; flex: 0 0 100%; margin-bottom: 5vw;}
  #section-3 .thumb img{ width: 30% !important; float: left; }
  #section-3 .thumb .thumb-hover{ position:relative; width:65% !important; float: left; margin-left:2%; opacity:1; background:none; color:#6a256a; text-align: left; padding-bottom: 0; height: auto }
  #section-3 .thumb .thumb-hover p{ color:#6a256a; margin-bottom:0}
  #section-3 .thumb p.legend{ display:none}
  
  #section-4 .container{ position: relative; height: auto !important; max-width:100%; padding:0; margin:0}
  #section-4 .container .row{ position: absolute !important;height: 100%;top: 0;left: 0;z-index: 10;width: 100%;margin: 0;padding: 0;}
  #section-4 h3{ margin-bottom: 1vw; font-size: 4vw}
  
  #section-4 .img-mobile{display:block !important}

  /*#section-4 .section-4-box-1{ left:-28vw; top:4vw}
  #section-4 .section-4-box-1 .text{top:auto; bottom:1.3vw; left: 44vw; width: 60%}
  #section-4 h3{ font-size:5vw}


  #section-4 .section-4-box-2{ top:64vw; right:5vw}
  #section-4 .section-4-box-2 .text{top: auto; bottom: 1vw; left: auto;  right: 27vw}

  #section-4 .section-4-box-3{ top:131vw; left:-5vw}
  #section-4 .section-4-box-3{ top:131vw; left:-5vw}
  #section-4 .section-4-box-3 img{ width:130vw; max-width: none}
  #section-4 .section-4-box-3 .text{ top:45vw; left:42vw}
  */


  #section-4 .section-4-box-4{ right: -7vw; top: 207vw}
  #section-4 .section-4-box-4 .text{ top:auto; bottom:1vw; right:37vw; left:auto}

}

@media (min-width: 629px) and (max-width: 768px){
  #section-3 .thumb{ background:none !important}
}

@media (max-width: 769px) {
  body .navbar{ position: fixed; top:0; width:100%; height: 90px; z-index:100; background: url('../img/menu-mobile.png') center bottom}
  body .navbar-brand img{ padding:0; width:80px !important; margin-top:8px}
  body #banner1{padding-top: 80px; background-position: center 80px}

  section{ overflow: hidden;}

  .first-title{font-size:1.25rem; text-align: center}
  .desktop{display:none;}
  .navbar-brand img{width:140px !important;padding:20px; }  
  .navbar-nav{text-align: center;margin-left: -50px;margin-right: -50px !important;}
  .dropdown-menu{text-align: center;margin-left: -50px;margin-right: -50px !important;background-color: #441845;}
  .dropdown-item:hover{background-color: transparent;color:#fff;}
  .dropdown-item{color:#fff;text-transform: uppercase;font-size:16px;}
  .collapsing {margin-left: -50px;margin-right: -50px !important;background-color: #69256a;}  
  .nav-link{color:#fff !important;}
  .navbar-nav li{background-color: #69256a;border-top:1px solid #fff;padding:4px 0px;} 


  #banner1 .container{margin: 0;padding: 0;}
  #banner1 .banner1-img-1{bottom: 7vw;left: 2vw;width: 11%}
  #banner1 .banner1-img-2{top:38%;left: 90%;width: 8.2%}
  #banner1 .banner1-img-3{top:38%;left: 6%;width: 6%}
  #banner1 .text{font-size: 0.625rem; text-align: center; padding: 0 !important; margin: 0; line-height: 100%}

  #banner1 .banner1-sheet,
  #banner1 .banner1-product-options{ position:relative; max-width:70%; float:right; transform:translate(0); margin-top:-8vw; margin-bottom:10px}

  #section-2{ background: none}
  #section-2 .map{height: 240px;border-bottom-width: 2px}
  #section-2 .title{ font-size:0.9375rem; margin:5vw auto}
  #section-2 .title .ico-pin{width: 20px;background-size: 100%;background-position: bottom;height: 30px}

  #section-2 .btn-local:hover, 
  #section-2 .btn-local,
  #section-2 .btn-local.active{ font-size:0.625rem; padding-left: 1vw;  padding-right: 1vw;}

  #section-3 article.thumb-hover{ position: relative;opacity: 1;background: none;color: #6a256a}
  #section-3 article.thumb-hover h5{ text-transform: uppercase; font-family: 'gardenia-extraboldbold'}
  #section-3 article.thumb-hover p{ color: #6a256a;font-size: 0.875rem;}

  #section-3{ background-image:none}
  #section-3 .legend{ display:none}
  #section-3 .thumb{ background:url('../img/section-3-bg-mobile.png') no-repeat center 21vw; background-size:100% auto}
  #section-3 .section-3-img-1{ top:34%; left:5%; width:20px}
  #section-3 .section-3-img-2{ top: 64%;right: 5%;width:20px}
/* */
  #section-4 .container{ position: relative; height: auto !important; max-width:100%; padding:0; margin:0}
  #section-4 .container .row{ position: absolute !important;height: 100%;top: 0;left: 0;z-index: 10;width: 100%;margin: 0;padding: 0;}
  #section-4 h3{ margin-bottom: 1vw; font-size: 4vw}
  #section-4 .section-4-box-1{ left:-28vw; top:4vw}
  #section-4 .section-4-box-1 .text{top:auto; bottom:1.3vw; left: 44vw; width: 60%}
  #section-4 h3{ font-size:5vw}
  #section-4 .img-mobile{display:block !important}


  #section-4 .section-4-box-2{ top:64vw; right:5vw}
  #section-4 .section-4-box-2 .text{top: auto; bottom: 1vw; left: auto;  right: 27vw}

  #section-4 .section-4-box-3{ top:131vw; left:-5vw}
  #section-4 .section-4-box-3 img{ width:130vw; max-width: none}
  #section-4 .section-4-box-3 .text{ top:45vw; left:42vw}


  #section-4 .section-4-box-4{ right: -7vw; top: 207vw}
  #section-4 .section-4-box-4 .text{ top:auto; bottom:1vw; right:37vw; left:auto} 


  #footer{ background:none; height: auto;}
  #footer .container{ position: absolute !important;top: 0;left: 0; max-width:100%}
  #footer .footer-img-2{top: 36vw; right:-28px; width:140px}
  #footer .footer-mobile{ width: 100%; position: relative; z-index: -1}

  #footer h6{ display: table; margin:0 auto; padding:8vw 0px 11vw}
  #footer h6 img{ width:25px}
  #footer h6 span{ font-size:14px; padding:25px 0px 0px 15px}
  #footer #social img{ max-width:9vw }
  #footer .titanium{ margin-top:1vw !important; margin-bottom: 1vw; font-size:12px}
}

/* Footer onça*/
@media (min-width: 768px) { 
  #footer .footer-img-1,
  #footer .footer-img-2{ display:none} 
}

@media (min-width: 992px) { 
  #footer .footer-img-1{left: 15px; display: block;}
  #footer .footer-img-2{right: -12px; display: block;}
}

@media (min-width: 1200px) {
  #footer .footer-img-1{ left: 18vw; }
  #footer .footer-img-2{ right: 20vw}
}