/* BANNER */

.home-slider {

    max-height: 650px;

    height: 650px;

    position: relative;

}

.imgCentro img {

    object-fit: none;

    object-position: bottom;

}

.home-slider h1 {

    width: 300px;

    margin-bottom: 170px;

    margin-left: 101px;

}

.home-slider .slider-inner {

    width: 100%;

    height: 100%;

    display: flex;

    background-position: top;

    background-size: contain;

    background-repeat: no-repeat;

    max-height: 650px;

}

.home-slider .slider-inner .grid {

    justify-content: center;

    height: 100%;

    position: relative;

    display: flex;

    flex-direction: column;

}

.home-slider .mobile-img {

    position: absolute;

    width: 100%;

    height: 100%;

    display: none;

}

.home-slider .mobile-img img {

    width: 100%;

    height: 100%;

    object-fit: cover;

    object-position: center;

}

.slider-inner .grid p {

    max-width: 500px;

    margin-bottom: 60px;

    color: var(--portal-preto);

    line-height: 17px;

}

.home-slider .home-slider-owl {

    height: 100%;

}



.home-slider .owl-theme .owl-dots {

    margin: 30px auto 0 auto !important;

}

.home-slider .owl-stage-outer {

    height: 100%;

}

.home-slider .owl-stage {

    display: flex;

    align-items: center;

    justify-content: center;

    height: 100%;

}

.home-slider .owl-dots {

    top: inherit;

    bottom: 70px !important;

}

.home-slider .owl-stage .owl-item {

    height: 100%;

}

.home-slider .owl-stage-outer {

    overflow: visible;

}

.span-img {

    position: absolute;

    bottom: -75px;

}

.imgEsquerda {

    left: -75px;

}

.imgDireita {

    right: -75px;

}

.imgCentro {

    left: 0;

    right: 0;

    margin-left: auto;

    margin-right: auto;

    bottom: -100px;

}

@media(max-width: 768px) {

    .home-slider .slider-inner h1 {

        transform: translateX(0%);

        padding-top: 30px;

    }

    .menuDropdownMobile .cerveja-item {

        display: none;

    }

}

@media(max-width: 600px) {

    .home-slider .mobile-img {

        display: block;

        margin-left: -8.5%;

    }

    .home-slider .mobile-img {

        width: 100vw;

    }

    .home-slider h1 {

        margin-left: 45px;

        font-size: 50px;

        line-height: 60px;

    }

    .imgCentro img {

        max-height: 300px!important;

    }

}

@media(max-width: 575px) {

    .home-slider .mobile-img {

      width: 105vw;

    }

    .home-slider .mobile-img {

        margin-left: -2.5%;

    }

}

.span-img {

    object-fit: none;

    object-position: bottom;

}

/* CERVEJAS */

.cervejas-title {

    color:var(--opa-marrom-escuro);

    position: relative;

    width: 100%;

}

.cervejas-title span {

    color:var(--opa-marrom-claro);

}

.cervejas-title h2 {

    position: absolute;

    top: 98px;

}

.cervejas-title .marca-dagua {

    color:var(--opa-marrom-claro);

}

.cervejas-slider {

    width: 100%;

}

.card-cerveja .cerveja-item {

    height: 364px;

    width: 114px !important;

    object-fit: cover;

    object-position: center;

    margin: 0 auto;

}



.cervejas-slider .card-cerveja .shadow {

    width: 200px !important;

    height: 47px;

    margin: 0 auto;

    margin-bottom: 0!important;

    position: relative;

  }

  

.cervejas-slider .card-cerveja .shadow:after {

    content: '';

    position: absolute;

    background-image: url(/wp-content/themes/labbotheme/assets/img/shadow-menu.png);

    background-repeat: no-repeat;

    background-size: cover;

    background-position: center;

    width: 200px;

    height: 47px;

    bottom: 0;

    left: 0;  

}





.card-cerveja h4{

    text-align: center;

    color: var(--opa-vermelho);

    height: 58px;

}

.detalhe-cerveja {

    display: flex;

    justify-content: space-evenly;

    margin-top: 7px;

    color: var(--opa-marrom-claro);

    gap: 0.6rem;

}

.detalhe-cerveja div {

    text-align: center;

}



.slider-buttons {

    display: flex;

    width: 115%;

    position: absolute;

    top: 50%;

    left: -87px;

}

.opa-next {

    right: 0;

    position: absolute;

}

.shadow {

    width: 100% !important;

    object-fit: contain;

    height: 47px;

    margin-bottom: 10px;

}

.cervejas .owl-dots {

    margin: 53px auto 73px;

}

.cervejas .owl-dot {

    border: none!important;

    background: none!important;

}

.cervejas .owl-dot span {

    border: 1px solid var(--opa-vermelho)!important;

    background: var(--opa-branco) !important;

}

.cervejas .owl-dot.active span, .cervejas .owl-dot:hover span {

    background: var(--opa-vermelho)!important;

}

.cervejas .owl-theme .owl-nav.disabled + .owl-dots {

    margin-top: 36px!important;

    margin-bottom: 100px!important;

}

.cervejas .owl-nav {

    display: none;

}

.cervejas-slider .slider-buttons .disabled {

    filter: invert(61%) sepia(64%) saturate(318%) hue-rotate(360deg) brightness(93%) contrast(81%);

}

/* CTAS */

.ctas {

    display: grid;

    grid-template-columns: repeat(2, minmax(0, 1fr));

    grid-gap: 1.563rem;

    position: relative;

}

.ctas .arrows {

    margin-right: 15px;

}

.ctas .btn-texto {

    margin-top: -5px;

}

.ctas::after {

    content: url(/wp-content/uploads/2023/01/Copo3.webp);

    position: absolute;

    left: -27px;

    top: -160px;

}

.cta-1, .cta-2, .cta-3, .cta-4 {

    height: 400px;

    display: flex;

}

.cta-1 {

    background-color: var(--opa-verde-escuro);

}

.cta-2 {

    background-color: var(--opa-amarelo);

    overflow: hidden;

}

.cta-3 {

    background-color: var(--opa-marrom-claro);

}

.cta-4 {

    background-color: var(--opa-marrom-escuro);

}

.cta-1 .cta-img, .cta-2 .cta-img {

    object-fit: cover;

    object-position: center;

}

.cta-1 .cta-img {

    /* width: 532px; */

    width: 55%;

    height: 400px;

}

.cta-1 .btn-opa {

    max-width: 250px;

    width: 100%;

}

.cta-2 .cta-img {

    width: 50%;

    /* width: 460px; */

    height: 400px;

}

.cta-content {

    width: 100%;

}

.cta-1 .cta-content {

    /* padding: 83px 72px; */

    display: flex;

    align-items: flex-end;

    justify-content: center;

    flex-direction: column;

    padding: 0 7%;

}

.cta-1 .cta-content h2 {

    text-align: end;

    margin-bottom: 20px;

    color: var(--opa-bege);

}

.cta-2 .cta-content {

    /* padding: 83px 97px; */

    display: flex;

    align-items: center;

    justify-content: center;

    flex-direction: column;

    padding: 0 10%;

}

.cta-2 .cta-content h2 {

    margin-bottom: 20px;

    color: var(--opa-vermelho);

}

.cta-2 .btn-opa {

    background-color: var(--opa-vermelho);

    /* width: 266px; */

    min-width: 260px;

    width: 100%;

}

.cta-2 .btn-texto {

    color:var(--opa-branco)

}

.cta-2 .btn-texto b {

    color:var(--opa-marrom-claro)

}

.cta-van {

    position: relative;

    width: 50%;

}

.cta-van:after{

    content: '';

    background-image: url(/wp-content/uploads/2022/06/cta3-1.png);

    background-repeat: no-repeat;

    background-size: contain;

    width: 38rem;

    height: 25rem;

    position: absolute;

    bottom: -33%;

    left: -10px;

}



.cta-3 .cta-content {

    text-align: right;

    display: flex;

    align-items: flex-end;

    justify-content: center;

    flex-direction: column;

    padding: 0 7%;

    max-width: 50%;

}

.cta-3 .btn-texto {

    color:var(--opa-bege-claro)

}

.cta-3 .btn-opa {

    background-color: var(--opa-marrom-escuro);

    max-width: 250px;

    width: 100%;

}

.cta-3 .cta-content h2 {

    margin-bottom: 20px;

    color: var(--opa-bege-claro);

}

.cta-4 {

    background-image: url(/wp-content/uploads/2023/01/cta4.webp);

    position: relative;

}

.cta-4 .cta-content {

    padding: 83px 97px;

}

.cta-bone {

    width: 592px;

    height: 288px;

    object-fit: cover;

    object-position: center;

    position: absolute;

    top: 185px;

    left: 282px;

}

.cta-4 .cta-content h2 {

    width: 271px;

    margin-bottom: 20px;

    color: var(--opa-amarelo);

}

.cta-4 .btn-opa {

    background-color: var(--opa-verde-escuro);

    width: 266px;

}

.blog-card {

    width:557px;

}

.blog-content .blog-card {

    width:100%;

    position: relative;

}

.blog-content .blog-card:after{

    content: '';

    background-color: rgba(0, 0, 0, 0.7);

    position: absolute;

    top: 0;

    left: 0;

    width: 100%;

    height: 100%;

    z-index: 0;

}

.blog-content .blog-card img,

.blog-content .blog-card h4,

.blog-content .blog-card span{

    position: relative;

    z-index: 2;

}





@media (max-width:1440px) {

    .cta-1 .cta-img {

        width: 340px;

    }

    .cta-2 .cta-content {

        padding: 83px 30px;

    }

    .cta-van {

        width: 477px;

        height: 300px;

    }

    .tampa {

        left: 3%;

    }

    .copo-news {

        top: -130px;

        z-index: 0;

    }



    .copo-news img {

        width: 70%;

        float: right;

    }

}

@media (max-width:1600px) {

    .cta-van:after{

        left: -25%;

    }

}



@media (max-width:1366px) {

    .cta-1 .cta-content {

        padding: 83px 32px;

    }

    .cta-van {

        width: 446px;

        height: 100%;

    }

    .cta-van:after{

        left: -25%;

    }

}

@media (max-width:1024px) {

    .imgCentro img {

        object-fit: contain;

        max-height: 500px;

    }

    .slider-buttons {

        width: 100%;

        left: -3px;

    }

    .ctas::after {

        left: -67px;

        top: -211px;

        transform: scale(.7);

    }

    .ctas .titulo-1 {

        font-size: 50px;

        line-height: 62px;

    }

    .cta-1 .btn-opa {

        width: 210px;

    }

    .cta-1 .cta-img, .cta-2 .cta-img {

        width: 210px;

        height: 350px;

    }

    .cta-1, .cta-2, .cta-3, .cta-4 {

        height: 350px;

    }

    .cta-content {

        padding: 58px 32px!important;

    }

    .cta-2 .btn-opa {

        width: 210px;

    }

    .cta-van {

        width: 324px;

        height: 185px;

        margin-top: 242px;

        margin-left: -54px;

    }

    .cta-4 {

        background-size: cover;

        background-position: bottom;

    }

    .cta-bone {

        width: 300px;

        height: 158px;

        top: 241px;

        left: 231px;

    }

    .blog {

        padding-left: 125px;

    }

    .blog .owl-theme .owl-nav.disabled + .owl-dots {

        margin-left: -102px;

    }

    .tampa {

        left: -2%;

        transform: scale(.8);

    }

    .copo-news {

        top: -171px;

        transform: scale(.8);

        right: -33px;

    }

    .main-newsletter .left {

        padding: 50px 30px;

        width: 516px;

    }

    .sendNews {

        top: 146px;

        left: 459px;

    }

    .main-newsletter .right {

        width: 444px;

    }

    .span-img {

        object-fit: cover;

    }

}

@media (max-width:991px) {

    .home-slider {

        max-height: 450px;

        height: 450px;

    }

    .home-slider .slider-inner {

        max-height: 450px;

    }

    .imgEsquerda, .imgDireita {

        display: none;

    }

    .imgCentro img {

        max-height: 395px;

        object-fit: contain;

    }

    .slider-buttons {

        width: 113%;

        left: -40px;

    }

    .ctas {

        grid-template-columns: 100%;

    }

    .cta-1 .cta-img, .cta-2 .cta-img {

        width: 466px;

    }

    .cta-content {

        padding: 58px 130px !important;

    }

    .cta-van {

        width: 605px;

        height: 325px;

        margin-top: 95px;

        margin-left: -35px;

    }

    .cta-bone {

        width: 575px;

        height: 290px;

        top: 165px;

        left: 480px;

    }

    .newsletter {

        height: 400px;

    }

    .main-newsletter {

        margin-top: -250px;

    }

    .main-newsletter .left {

        width: 100%;

        padding: 40px 30px;

    }

    .main-newsletter .right {

        width: 100%;

        align-items: center;

    }

    .sendNews {

        top: 30px;

        left: initial;

        right: 4px;

        padding: 16px 19px;

    }



}

@media (min-width:500px) and (max-width:991px) {

    .cervejas .cervejas-slider-owl .owl-dot:nth-child(n+6) {

        display: none!important;

    }

}

@media (max-width:768px) {

    .slider-buttons {

        width: 103%;

        left: -11px;

    }

    .cta-1 .cta-img, .cta-2 .cta-img {

        width: 100%;

    }

    .cta-content {

        padding: 70px 100px !important;

    }

    .cta-bone {

        left: 283px;

    }

    .blog {

        padding: 0 1.5rem 0 0.7rem;

    }

    .tampa {

        display: none;

    }

    .newsletter{

        align-items: flex-end;

        padding-bottom: 3rem;

    }

}

@media (max-width:500px) {

    .cta-1 .cta-img, .cta-2 .cta-img, .cta-van {

        display: none;

    }

    .cta-content {

        padding: 70px !important;

        text-align: center;

        display: flex;

        flex-direction: column;

        justify-content: center;

        align-items: center;

    }

    .cta-bone {

        width: 196px;

        height: 101px;

        top: 294px;

    }

    .cta-3 .cta-content {

        margin-left: 0;

        text-align: center;

        align-items: center;

        max-width: 100%;

    }

    .blog-card {

        width: 455px;

    }

    .blog .owl-theme .owl-nav.disabled + .owl-dots {

        margin-left: 0;

    }

    .slider-buttons {

        width: 96%;

        left: 10px;

        z-index: 2;

        height: 0;

    }

    .slider-buttons .slider-prev-noticias{

        margin-top: 2rem;

    }

    .cta-1 .cta-content h2 {

        text-align: center;

    }

    .cervejas .cervejas-slider-owl .owl-dot:nth-child(n+11) {

        display: none!important;

    }

}

@media (max-width:500px) {

    .cta-bone {

        left: 227px;

    }

    .blog-card {

        width: 375px;

    }

    .copo-news {

        top: -142px;

        transform: scale(.5);

        right: -76px;

    }

    .imgCentro img {

        max-height: 259px;

    }

}

@media (max-width:380px) {

    .ctas::after {

        left: -93px;

        top: -211px;

        transform: scale(.5);

    }

    .ctas .titulo-1 {

        font-size: 36px;

        line-height: 45px;

    }

    .blog-card {

        width: 330px;

    }

}

@media (max-width:320px) {

    .cta-1, .cta-2, .cta-3, .cta-4 {

        height: 300px;

    }

    .cta-3 .btn-opa, .cta-4 .btn-opa {

        max-width: 210px;

    }

    .blog-card {

        width: 270px;

    }

    .main-newsletter .left h2 {

        font-size: 36px;

        line-height: 45px;

    }

    .main-newsletter .right ul li:last-child {

        margin-right:0;

    }

}



/* BLOG */



.banner-simple {

    width: 100%;

    height: 39.06rem;

    background-color: red;

}







/* Intro */

#intro {

    width: 100%;

    position: fixed;

    top: 0;

    left: 0;

    height: 100vh;

    width: 100vw;

    z-index: 9999;

    background-color: var(--opa-mine-shaft);

    overflow: hidden;

    display: none;

    background-position: center;

    background-repeat: no-repeat;

    background-size: cover;

}

#intro .left{

    width: 100%;

    height: 100vh;

    display: flex;

    flex-direction: column;

    justify-content: center;

    align-items: center;

}



#intro .left img{

    margin-bottom: 5%;

}



#intro .left h2{

    font-family: var(--font-family-gin-regular);

    font-style: normal;

    font-weight: 400;

    font-size: 3.75rem;

    line-height: 4.5rem;

    color: var(--opa-branco);

    text-align: center;

    margin-bottom: 2rem;

    width: 28%;

}



#intro .left .permission{

    font-family: var(--font-family-gin-regular);

    font-style: normal;

    font-weight: 400;

    font-size: 2.625rem;

    line-height: 3.125rem;

    color: var(--opa-branco);

    text-align: center;

    width: 50%;

    display: none;

}



#intro .left h3{

    font-family: var(--font-family-soleil);

    font-style: normal;

    font-weight: 400;

    font-size: 2rem;

    line-height: 2.5rem;

    color: var(--opa-vermelho);

    margin-bottom: 3rem;

}



#intro .left .buttons{

    display: flex;

    gap: 1rem;

}



#intro .left .buttons button{

    font-family: var(--font-family-gin-regular);

    font-style: normal;

    font-weight: 400;

    font-size: 2rem;

    color: var(--opa-branco);

    border: 2px solid var(--opa-branco);

    background-color: transparent;

    padding: 1rem 4rem;

    text-transform: uppercase;

    transition: var(--transition);

    cursor: pointer;

}



#intro .left .buttons button:active,

#intro .left .buttons button:focus,

#intro .left .buttons button:hover{

    background-color: var(--opa-marrom-claro);

    color: var(--opa-branco);

}



#intro .right{

    width: 100%;

    height: 100vh;

}



#intro .right img{

    width: 100%;

    height: 100vh;

    object-fit: cover;

}



@media (max-width:991px) {

    #intro .left h2{

        font-size: 2.75rem;

        line-height: 3.5rem;

        width: 90%;

    }

}