/* Tablets & small laptops */
@media (max-width: 1366px) { 
    .container, .container-lg, .container-md, .container-sm, .container-xl, .container-xxl{
        max-width: 1000px;
    }
    .hero .carousel-item .carousel-caption .cl-caption{
        max-width: 790px;
        width: 100%;
    }
    p{
        font-size: 18px;
    }
    .navbar-brand .logo-wrap{
        width: 150px;
        height: 180px;
    }
    .logo-wrap img{
        width: 120px;
    }
    .hero-ac-btn-link a{
        height: 55px;
        border: 13px solid transparent;
        border-image: url(../img/crm-corner.svg) 16 round;
    }
    .hero .carousel-item .carousel-caption .cl-caption{
        margin-top: 50px;
    }
    .cl-caption-wrap{
        margin-top: 30px;
    }
    .ticket-label{
        margin: 20px 0 0 0;
    }
    .hero-ac-btn{
        margin-top: 20px;
    }
    .hero .carousel-item .carousel-caption .cl-caption h2{
        font-size: 50px;
    }
    .ticket-label{
        border: 15px solid transparent;
        border-image: url("../img/red-corner.svg") 17 round !important;
    }
    .intro-img .beer-cup{
        width: 240px;
    }
    .intro-img .rolling-badge{
        left: 100px;
    }
    .ticket-label ul li{
        font-size: 22px;
        padding-right: 5px;
        padding-left: 5px;
    }
    .ticket-label ul li span{
        height: 20px;
        width: 20px;
        margin-left: 13px;
    }
    .scrolled .navbar-nav a{
        padding-top: 25px;
        padding-bottom: 25px;
    }
    .navbar-nav a{
        font-size: 16px;
    }
    .intro h1, .bloq-name h2, .kitchn-in h2, .co-wo h2, .event-head-in h2, .whats-hp-head h2, .reviews-hdr h2, .stories-head h2, .cta-head h2{
        font-size: 48px;
    }
    .intro-img .beer-spill{
        top: -100px;
        left: -70px;
    }
    .beer-box-in a{
        height: 88px;
        bottom: 30px;
    }
    .beer-box-in a span{
        font-size: 18px;
        height: 88px;
    }
    .beer-box-in a span{
        bottom: -10px;
    }
    .beer-box-in .beer-card-cup{
        width: 125px;
        bottom: 100px;
    }
    .beer-box-in .beer-bg{
        width: 310px;
        bottom: 10px;
    }
    .beer-box{
        height: 400px;
        border: 110px solid transparent;
        border-image: url(../img/beer-card.png) 186 round;
    }
    .whats-hp{
        min-height: auto;
    }
    .video-container.expanded {
        width: 260px;
        height: 440px;
    }
    .cta-cont ul li{
        font-size: 30px;
    }
    .si-obj {
        position: absolute;
        top: 2%;
        left: 2%;
        width: 150px;
        height: 150px;
    }
    .si-obj-2{
        width: 150px;
        height: 150px;
    }
    .si-obj-3{
        width: 150px;
        height: 150px;
    }
    .si-obj-4{
        width: 150px;
        height: 150px;
    }
    .chips-five{
        right: -10px;
    }
    .page-head{
        height: 300px;
    }
    .page-head-cont{
        padding-bottom: 30px;
    }
    .page-head-cont h1{
        font-size: 34px;
    }
    .beer-box-wrp{
        height: 361px;
    }
    .beer-action span{
        max-width: 160px;
    }
    .rew-box .rew-box-in-right h4{
        font-size: 24px;
    }
    .abt-brew h2, .brew-exp h2{
        font-size: 48px;
    }
    .service-head-in h2{
        font-size: 48px;
    }
    .ser-bloq h2{
        font-size: 48px;
    }
    .corporate-exp-in h2{
        font-size: 48px;
    }
    .corporate-exp-in h4{
        font-size: 32px;
    }
    .beer-in-head-in h2{
        font-size: 48px;
    }
    .beer-in-head-in h4{
        font-size: 32px;
    }
    .contact-hdr-in h2{
        font-size: 48px;
    }
    .lts-connect h4{
        font-size: 48px;
    }
}

/* Standard laptops */
@media (max-width: 1440px) { 
    .container, .container-lg, .container-md, .container-sm, .container-xl, .container-xxl{
        max-width: 1000px;
    }
    .hero .carousel-item .carousel-caption .cl-caption{
        max-width: 790px;
        width: 100%;
    }
    p{
        font-size: 18px;
    }
    .navbar-brand .logo-wrap{
        width: 150px;
        height: 180px;
    }
    .logo-wrap img{
        width: 120px;
    }
    .hero-ac-btn-link a{
        height: 55px;
        border: 13px solid transparent;
        border-image: url(../img/crm-corner.svg) 16 round;
    }
    .hero .carousel-item .carousel-caption .cl-caption{
        margin-top: 50px;
    }
    .cl-caption-wrap{
        margin-top: 30px;
    }
    .ticket-label{
        margin: 20px 0 0 0;
    }
    .hero-ac-btn{
        margin-top: 20px;
    }
    .hero .carousel-item .carousel-caption .cl-caption h2{
        font-size: 50px;
    }
    .ticket-label{
        border: 15px solid transparent;
        border-image: url("../img/red-corner.svg") 17 round !important;
    }
    .intro-img .beer-cup{
        width: 240px;
    }
    .intro-img .rolling-badge{
        left: 100px;
    }
    .ticket-label ul li{
        font-size: 22px;
        padding-right: 5px;
        padding-left: 5px;
    }
    .ticket-label ul li span{
        height: 20px;
        width: 20px;
        margin-left: 13px;
    }
    .scrolled .navbar-nav a{
        padding-top: 25px;
        padding-bottom: 25px;
    }
    .navbar-nav a{
        font-size: 16px;
    }
    .intro h1, .bloq-name h2, .kitchn-in h2, .co-wo h2, .event-head-in h2, .whats-hp-head h2, .reviews-hdr h2, .stories-head h2, .cta-head h2{
        font-size: 48px;
    }
    .intro-img .beer-spill{
        top: -100px;
        left: -70px;
    }
    .beer-box-in a{
        height: 88px;
        bottom: 30px;
    }
    .beer-box-in a span{
        height: 88px;
        font-size: 18px;
    }
    .beer-box-in a span{
        bottom: -10px;
    }
    .beer-box-in .beer-card-cup{
        width: 125px;
        bottom: 100px;
    }
    .beer-box-in .beer-bg{
        width: 310px;
        bottom: 10px;
    }
    .beer-box{
        height: 400px;
        border: 110px solid transparent;
        border-image: url(../img/beer-card.png) 186 round;
    }
    .whats-hp{
        min-height: auto;
    }
    .video-container.expanded {
        width: 260px;
        height: 440px;
    }
    .cta-cont ul li{
        font-size: 30px;
    }
    .si-obj {
        position: absolute;
        top: 2%;
        left: 2%;
        width: 150px;
        height: 150px;
    }
    .si-obj-2{
        width: 150px;
        height: 150px;
    }
    .si-obj-3{
        width: 150px;
        height: 150px;
    }
    .si-obj-4{
        width: 150px;
        height: 150px;
    }
    .chips-five{
        right: -10px;
    }
    .page-head{
        height: 300px;
    }
    .page-head-cont{
        padding-bottom: 30px;
    }
    .page-head-cont h1{
        font-size: 34px;
    }
    .beer-box-wrp{
        height: 361px;
    }
    .beer-action span{
        max-width: 160px;
    }
    .rew-box .rew-box-in-right h4{
        font-size: 24px;
    }
    .abt-brew h2, .brew-exp h2{
        font-size: 48px;
    }
    .service-head-in h2{
        font-size: 48px;
    }
    .ser-bloq h2{
        font-size: 48px;
    }
    .corporate-exp-in h2{
        font-size: 48px;
    }
    .corporate-exp-in h4{
        font-size: 32px;
    }
    .beer-in-head-in h2{
        font-size: 48px;
    }
    .beer-in-head-in h4{
        font-size: 32px;
    }
    .contact-hdr-in h2{
        font-size: 48px;
    }
    .lts-connect h4{
        font-size: 48px;
    }
}

/* Larger laptops & desktops */
@media (max-width: 1620px) { 
    .container, .container-lg, .container-md, .container-sm, .container-xl, .container-xxl{
        max-width: 1000px;
    }
    .hero .carousel-item .carousel-caption .cl-caption{
        max-width: 790px;
        width: 100%;
    }
    p{
        font-size: 18px;
    }
    .navbar-brand .logo-wrap{
        width: 150px;
        height: 180px;
    }
    .logo-wrap img{
        width: 120px;
    }
    .hero-ac-btn-link a{
        height: 55px;
        border: 13px solid transparent;
        border-image: url(../img/crm-corner.svg) 16 round;
    }
    .hero .carousel-item .carousel-caption .cl-caption{
        margin-top: 50px;
    }
    .cl-caption-wrap{
        margin-top: 30px;
    }
    .ticket-label{
        margin: 20px 0 0 0;
    }
    .hero-ac-btn{
        margin-top: 20px;
    }
    .hero .carousel-item .carousel-caption .cl-caption h2{
        font-size: 50px;
    }
    .ticket-label{
        border: 15px solid transparent;
        border-image: url("../img/red-corner.svg") 17 round !important;
    }
    .d6-obj-three{
        left: -75px;
    }
    .intro-img .beer-cup{
        width: 240px;
    }
    .intro-img .rolling-badge{
        left: 50px;
        bottom: -10px;
    }
    .ticket-label ul li{
        font-size: 22px;
        padding-right: 5px;
        padding-left: 5px;
    }
    .ticket-label ul li span{
        height: 20px;
        width: 20px;
        margin-left: 13px;
    }
    .scrolled .navbar-nav a{
        padding-top: 25px;
        padding-bottom: 25px;
    }
    .navbar-nav a{
        font-size: 16px;
    }
    .intro h1, .bloq-name h2, .kitchn-in h2, .co-wo h2, .event-head-in h2, .whats-hp-head h2, .reviews-hdr h2, .stories-head h2, .cta-head h2{
        font-size: 48px;
    }
    .intro-img .beer-spill{
        top: -100px;
        left: -70px;
    }
    .beer-box-in a{
        height: 88px;
        bottom: 30px;
    }
    .beer-box-in a span{
        height: 88px;
        font-size: 18px;
    }
    .beer-box-in a span{
        bottom: -10px;
    }
    .beer-box-in .beer-card-cup{
        width: 110px;
        bottom: 75px;
    }
    .beer-box-in .beer-bg{
        width: 275px;
        bottom: 10px;
    }
    .beer-box{
        height: 360px;
        border: 110px solid transparent;
        border-image: url(../img/beer-card.png) 186 round;
    }
    .whats-hp{
        min-height: auto;
    }
    .video-container.expanded {
        width: 260px;
        height: 440px;
    }
    .cta-cont ul li{
        font-size: 30px;
    }
    .si-obj {
        position: absolute;
        top: 2%;
        left: 2%;
        width: 150px;
        height: 150px;
    }
    .si-obj-2{
        width: 150px;
        height: 150px;
    }
    .si-obj-3{
        width: 150px;
        height: 150px;
    }
    .si-obj-4{
        width: 150px;
        height: 150px;
    }
    .chips-five{
        right: -10px;
    }
    .page-head{
        height: 300px;
    }
    .page-head-cont{
        padding-bottom: 30px;
    }
    .page-head-cont h1{
        font-size: 34px;
    }
    .beer-box-wrp{
        height: 361px;
    }
    .beer-action span{
        max-width: 160px;
    }
    .rew-box .rew-box-in-right h4{
        font-size: 24px;
    }
    .abt-brew h2, .brew-exp h2{
        font-size: 48px;
    }



    .service-head-in h2{
        font-size: 48px;
    }
    .ser-bloq h2{
        font-size: 48px;
    }
    .corporate-exp-in h2{
        font-size: 48px;
    }
    .corporate-exp-in h4{
        font-size: 32px;
    }
    .beer-in-head-in h2{
        font-size: 48px;
    }
    .beer-in-head-in h4{
        font-size: 32px;
    }
    .contact-hdr-in h2{
        font-size: 48px;
    }
    .lts-connect h4{
        font-size: 48px;
    }
    .footer-art-left{
        width: 400px;
        height: 300px;
    }
    .footer-art-right{
        width: 400px;
        height: 300px;
    }
    .menu-sam2-in .menu-sam2-in-ovrly-txt h4{
        font-size: 22px;
    }
    .lega-left-d, .lega-right-d{
        height: 150px;
        width: 150px;
    }
    .origin-story-head h2{
        font-size: 48px;
    }
    .legacy h2, .expertise-in h2, .ph-head-in h2{
        font-size: 48px;
    }
    .craft-brew h2, .craft-brew-2 h2, .p-dining h2, .d6-packages h2{
        font-size: 48px;
    }
    .ori-img-left .ori-img-in{
        top: -187px;
    }
    .ori-img-right .ori-img-in{
        bottom: -139px;
    }
    .okf h2{
        font-size: 22px;
    }
    .okf ul{
        font-size: 18px;
    }
    .sr-ob-two{
        right: -180px;
    }
    .sr-ob-three{
        left: -160px;
    }
    .footer-ico-right{
        font-size: 16px;
        line-height: 1.2;
    }
    .okto-one{
        top: 75px;
        left: -168px;
    }
    .okto-two{
        right: -162px;
    }
}
@media (max-width: 767.98px) {
    .built{
        margin-top: 15px;
    }
    .navbar-nav .nav-link{
        padding: 5px !important;
    }
    .navbar-nav .dropdown-menu{
        background-color: #5a2d24;
        border-radius: 0;
    }
    .carousel-control-next-icon, .carousel-control-prev-icon{
        display: none;
    }
    .hero{
        height: auto;
    }
    .logo-normal{
        display: none;
    }
    .logo-mobile{
        display: block;
        padding-top: 10px;
        padding-bottom: 10px;

    }
    .navbar-brand{
        position: relative;
    }
    .logo-wrap img{
        height: 50px;
        width: auto;
        position: relative;
        top: auto;
        left: auto;
        transform: none;
    }
    .navbar-brand .logo-wrap{
        background: transparent;
        width: auto;
        height: auto;
    }
    .navigation{
        background-color: #261815;
    }
    .navbar-toggler{
        right: 0;
        background-color: #5a2d24;
        top: 0;
    }
    .chips{
        display: none;
    }
    .cta-cont ul{
        display: block;
    }
    .hero .carousel-item .carousel-caption .cl-caption{
        margin-top: 35px;
        padding-left: 15px;
        padding-right: 15px;
    }
    .hero .carousel-item .carousel-caption .cl-caption h2{
        font-size: 34px;
    }
    .hero .carousel-item{
        height: 770px;
    }
    .hero-ac-btn-link a{
        margin-bottom: 15px;
    }
    .cl-caption-in{
        padding-left: 15px;
        padding-right: 15px;
    }
    .ticket-label ul li span{
        display: none;
    }
    .intro-img .beer-spill{
        position: initial;
    }
    .intro{
        padding-top: 50px;
        padding-bottom: 50px;
    }
    .intro h1, .bloq-name h2, .kitchn-in h2, .co-wo h2, .event-head-in h2, .whats-hp-head h2, .reviews-hdr h2, .stories-head h2, .cta-head h2{
        font-size: 32px;
    }
    .intro-img .rolling-badge{
        width: 130px;
        height: 130px;
        left: 35px;
    }
    .offer{
        padding-top: 60px;
        padding-bottom: 60px;
    }
    .offer-bloq{
        position: relative;
        z-index: 1;
        background-color: rgba(255, 255, 255, 0.8);
        padding: 30px 25px;
        border-radius: 6px;
    }
    .offer-bloq h2{
        font-size: 36px;
    }
    .offer-bloq h4{
        margin-bottom: 10px !important;
    }
    .signature-styles{
        padding-top: 60px;
        padding-bottom: 60px;
    }
    .beer-box{
        border: 150px solid transparent;
        border-image: url(../img/beer-card.png) 186 round;
    }
    .si-obj, .si-obj-2, .si-obj-3, .si-obj-4{
        display: none;
    }
    .beer-box-in a span{
        bottom: -18px;
    }
    .sig-footer-in{
        margin-top: 30px;
    }
    .kitchen{
        padding-top: 60px;
        padding-bottom: 60px;
    }
    .ticket-label{
        border: 22px solid transparent;
        border-image: url(../img/red-corner.svg) 17 round !important;
    }
    .kitchen{
        background-position: bottom -1% center;
        background-size: contain;
    }
    .our-menu{
        padding-top: 60px;
        padding-bottom: 60px;
    }
    .menu-head h2{
        font-size: 34px;
    }
    .ov-m-wrap{
        padding-left: 10px;
        padding-right: 10px;
    }
    .menu-center-text-in{
        margin-top: 20px;
    }
    .menu-action a{
        margin-bottom: 15px;
    }
    .co-working{
        padding-top: 60px;
        padding-bottom: 60px;
    }
    .whats-hp{
        padding-top: 60px;
        padding-bottom: 60px;
    }
    .whats-hp-head h4{
        font-size: 20px;
    }
    .whats-hp-lis-in ul{
        padding: 0 0 0 40px;
    }
    .whats-hp-lis-in ul li{
        line-height: 1.3;
        margin-bottom: 15px;
        margin-top: 15px;
    }
    .whats-hp-lis-in ul li::before{
        width: 26px;
        height: 26px;
        top: 3px;
        transform: none;
        left: -40px;
    }
    .reviews{
        padding-top: 60px;
        padding-bottom: 60px;
    }
    .stories{
        padding-top: 60px;
        padding-bottom: 60px;
    }
    .stories-head p{
        font-size: 22px;
    }
    .cta{
        padding-top: 60px;
        padding-bottom: 60px;
    }
    .cta-cont ul li{
        font-size: 22px;
    }
    .cta-cont ul{
        text-align: center;
    }
    .cta-action{
        position: relative;
        z-index: 1;
    }
    .cta-cont{
        position: relative;
        z-index: 1;
    }
    .footer{
        padding-top: 40px;
        padding-bottom: 40px;
    }
    .footer-box{
        text-align: center;
        padding-top: 10px;
        padding-bottom: 10px;
    }
    .footer-ico{
        text-align: left;
    }
    .box-logo{
        display: flex;
        justify-content: center;
    }
    .copyrights{
        text-align: center;
    }
    .foo-social{
        justify-content: center;
        margin-top: 10px;
    }
    .page-head-cont{
        display: block;
    }
    .page-head {
        height: 195px;
    }
    .page-head-cont h1{
        font-size: 28px;
    }
    .page-body{
        padding-top: 60px;
        padding-bottom: 60px;
        overflow: hidden;
    }
    .abt-brew h2, .brew-exp h2{
        font-size: 34px;
    }
    .brew-exp{
        padding-top: 60px;
        padding-bottom: 60px;
    }
    .tch-meet{
        margin-top: 50px;
    }
    .why-brew{
        padding-top: 60px;
        padding-bottom: 60px;
    }
    .lega-in h2{
        font-size: 34px;
    }
    .ori-img-left .ori-img-in{
        position: static;
        margin-bottom: 20px;
    }
    .ori-img-right{
        display: none;
    }
    .origin-story{
        padding-top: 60px;
        padding-bottom: 60px;
    }
    .origin-story-head h2{
        font-size: 34px;
    }
    .legacy{
        padding-top: 60px;
        padding-bottom: 60px;
    }
    .legacy .rp-img{
        margin-bottom: 30px;
    }
    .legacy h2, .expertise-in h2, .ph-head-in h2{
        font-size: 34px;
    }
    .expertise{
        padding-top: 60px;
        padding-bottom: 60px;
    }
    .philosophy{
        padding-top: 60px;
        padding-bottom: 60px;
    }
    .ph-bloq{
        margin-top: 10px;
        margin-bottom: 10px;
    }
    .ph-head-in p{
        margin-bottom: 0;
    }
    .service-head-in h2{
        font-size: 32px;
    }
    .ser-main{
        padding-top: 60px;
        padding-bottom: 60px;
    }
    .ser-bloq h2{
        font-size: 32px;
    }
    .craft-brew{
        padding-top: 60px;
        padding-bottom: 60px;
    }
    .craft-brew-2{
        padding-top: 0;
        padding-bottom: 60px;
    }
    .craft-brew img{
        margin-bottom: 30px;
    }
    .craft-brew h2, .craft-brew-2 h2, .p-dining h2, .d6-packages h2{
        font-size: 34px;
    }
    .craft-brew-2 img{
        margin-top: 30px;
    }
    .d6-packages{
        padding-top: 60px;
        padding-bottom: 60px;
    }
    .p-dining{
        padding-top: 60px;
        padding-bottom: 60px;
    }
    .corp-exp{
        margin-top: 30px;
    }
    .need-smthing-hd-in h2{
        font-size: 34px;
    }
    .need-smthing{
        padding-top: 60px;
        padding-bottom: 60px;
    }
    .need-smthing-list ul li{
        font-size: 22px;
    }
    .story-page-ind .story-journal{
        margin-bottom: 25px;
    }
    .contact-hdr-in h2{
        font-size: 34px;
    }
    .contact-hdr-in h3{
        font-size: 28px;
    }
    .con-booking{
        display: block;
        text-align: center;
    }
    .con-booking button{
        margin-bottom: 15px;
        margin-right: 0;
    }
    .lts-connect{
        padding-top: 60px;
        padding-bottom: 60px;
    }
    .lts-connect h4{
        font-size: 34px;
        margin-top: 30px;
    }
    .contct{
        padding-top: 60px;
        padding-bottom: 60px;
    }
    .okf-left{
        width: 100px;
    }
    .okf-right{
        width: calc(100% - 115px);
    }
    .okf-left img.beer {
        width: 80px !important;
    }
    .okto-fest-body .txt-cf-1{
        z-index: 1;
        position: relative;
    }
    .okto-cel-left{
        width: 150px;
    }
    .okto-cel-right{
        width: 150px;
    }
    .okto-list{
        display: block;
    }
    .okto-list li{
        margin: 10px 0;
    }
    .left-map{
        opacity: 0.3;
    }
    .center-map{
        opacity: 0.3;
        position: absolute;
        left: 0;
        bottom: 152px;
        transform:none;
        width: 125px;
        height: 127px;
    }
    .right-map{
        opacity: 0.3;
    }
    .con-video{
        margin-bottom: 20px;
    }
    .contct-con-in-left{
        width: 40px;
        height: 40px;
        margin-right: 15px;
        font-size: 18px;
    }
    .contct h5{
        font-size: 18px;
    }
    .contct-con-in-right{
        width: calc(100% - 55px);
    }
    .contct-con ul li{
        font-size: 18px;
    }
    .cta-cont ul{
        padding: 10px 3px;
    }
    .cta-action {
        display: flex;
        justify-content: center;
        flex-direction: column;
    }
    .corpo-d2, .corpo-d1{
        opacity: 0.5;
    }
    .d6-obj-three {
        left: -24px;
        width: 100px;
        height: 100px;
    }
    .d6-obj-two{
        right: -50px;
        top: 168px;
        width: 100px;
        height: 250px;
    }
    .d6-obj-five{
        top: 35%;
        width: 190px;
        height: 190px;
    }
    .d6-obj-four{
        right: -12%;
        top: 83%;
        width: 150px;
        height: 150px;
    }
    .d6-obj-one{
        left: -48px;
        bottom: -85px;
        width: 100px;
        height: 250px;
    }
}
@media screen and (min-width: 410px) and (max-width: 890px) {
    .menu-sam {
        height: auto;
        border: 23px solid transparent;
        border-image: url(../img/menu-border.svg) 16 round;
    }
    
    .co-wo-bloq {
        border: 23px solid transparent;
        border-image: url(../img/border-brown.svg) 20 round;
        height: 100%;
        position: relative;
        z-index: 1;
    }
    .rew-box{
        border: 23px solid transparent;
        border-image: url(../img/rev-border.svg) 16 round;
        margin: 0 10px;
    }
    .btn-action{
        border: 17px solid transparent;
        border-image: url(../img/crm-corner.svg) 19 round;
    }
    .ticket-label {
        border: 24px solid transparent;
        border-image: url(../img/red-corner.svg) 17 round !important;
    }
    .cl-caption .ticket-label {
        border: 26px solid transparent;
        border-image: url(../img/red-corner.svg) 17 round !important;
    }
    .whats-hp-action .btn-action03{
        border: 17px solid transparent;
        border-image: url(../img/crm-corner.svg) 22 round;
    }
    .d6-package{
        border: 23px solid transparent;
        border-image: url(../img/rev-border-dark.svg) 21 round;
    }
    .ph-bloq {
        border: 23px solid transparent;
        border-image: url(../img/rev-border-dark.svg) 24 round;
    }
}