@media (min-width: 220px) { 
    
    .hero h1{font-size:30px; line-height:32px;}
    .x-large{font-size:38px!important}
    
    .hero h1{transform: rotate(-9deg) skew(-15deg);}
    
    .hero{height:600px}
    
    .caption{
        top:-40px;
        right:45px;
    }
    
    .cans-glass{
        width:100%;
        position:relative;
        z-index:500;
        margin:auto;
        top:300px;
    }
    
    .parallax { height: 530px }
    
    .product-desc .top-padding-5 {padding-top:0rem}
    .product-desc p { max-width:none; text-align:center}
    .product-desc h6 { text-align:center}
    
}

@media (min-width: 300px) { 
    
    .hero h1{font-size:30px; line-height:32px;}
    .x-large{font-size:38px!important}
    
    .hero h1{transform: rotate(-9deg) skew(-15deg);}
    
    .hero{height:600px}
    
    .caption{
        top:-30px;
        right:45px;
    }
    
    .cans-glass{
        width:100%;
        position:relative;
        z-index:500;
        margin:auto;
        top:300px;
    }
    
    .product-desc .top-padding-5 {padding-top:0rem}
    .product-desc p { max-width:none; text-align:center}
    .product-desc h6 { text-align:center}
    
}

@media (min-width: 320px) {
    
    .parallax .top-padding-lg{padding-top:6rem}
    
    .parallax .bottom-padding-lg{padding-bottom:2rem}
    
    h2 {
        font-size:25px;
        line-height:38px;
    }

    .custom-text h2 span{
        font-size:35px;
    }
    
    .main-logo{
        width:50px;
        height:50px;
    }
    
    .no-overflow-mobile{
        overflow:hidden;
    }
    
    .hero .row{
        height:700px;
    }
    
   .top-padding-mobile{
        padding-top:5rem
    }    

    .hero h1{font-size:36px; line-height:38px;}
    .x-large{font-size:46px!important}
    
    .hero h1{transform: rotate(-9deg) skew(-15deg);}
    
    .caption .sub{
        padding-bottom:10px;
        transform: rotate(-9deg) skew(-15deg);
    }
    
    .hero{height:700px}
    
    .caption{
        top:-30px;
        right:40px;
    }
    
    .cans-glass{
        width:100%;
        position:relative;
        z-index:500;
        margin:auto;
        top:330px;
    } 
    
    .parallax { height: 570px }
    
    .product-desc .top-padding-5 {padding-top:0rem}
    .product-desc p { max-width:none; text-align:center}
    .product-desc h6 { text-align:center}
    
}

@media (min-width: 350px) { 
    
    .hero h1{font-size:40px; line-height:42px;}
    .x-large{font-size:50px!important}
    
    .hero{height:700px}
    
    .caption{
        top:-30px;
        right:60px;
    }
    
    .cans-glass{
        width:100%;
        position:relative;
        z-index:500;
        margin:auto;
        top:300px;
    }
    
    .parallax { height: 700px }
    
    .product-desc .top-padding-5 {padding-top:0rem}
    .product-desc p { max-width:none; text-align:center}
    .product-desc h6 { text-align:center}
    
}

@media (min-width: 380px) { 
    
    .x-large{font-size:50px!important}
    
    .hero{height:740px}
    
    .hero h1{transform: rotate(-9deg) skew(-15deg);}
    
    .caption .sub{
        padding-bottom:10px;
        transform: rotate(-9deg) skew(-15deg);
    }
    
    .caption{
        top:-30px;
        right:60px;
    }
    
    .caption p span{
        font-size:20px;
    }
    
    .cans-glass{
        width:100%;
        position:relative;
        z-index:500;
        margin:auto;
        top:330px;
    }
    
    .parallax { height: 740px }
    
    .product-desc .top-padding-5 {padding-top:0rem}
    .product-desc p { max-width:none; text-align:center}
    .product-desc h6 { text-align:center}
    
}

@media (min-width: 400px) { 
    
    .hero h1{font-size:40px; line-height:42px;transform: rotate(-9deg) skew(-15deg);}
    .x-large{font-size:50px!important}
    
    .hero{height:740px}
    
    .caption{
        top:-30px;
        right:85px;
    }
    
    .caption p span{
        font-size:20px;
    }
    
    .caption .sub{
        padding-bottom:10px;
        transform: rotate(-9deg) skew(-15deg);
    }
    
    .cans-glass{
        width:100%;
        position:relative;
        z-index:500;
        margin:auto;
        top:300px;
    }
    
    #inside-technology .row p {max-width:none}
    #best-of .row p {max-width:none}
    
    .product-desc .top-padding-5 {padding-top:0rem}
    .product-desc p { max-width:none; text-align:center}
    .product-desc h6 { text-align:center}
    
}

@media (min-width: 420px) { 
    
    .parallax .top-padding-lg{padding-top:6rem}
    
    .parallax .bottom-padding-lg{padding-bottom:2rem}
    
    .product-desc .top-padding-5 {padding-top:0rem}
    .product-desc p { max-width:none; text-align:center}
    .product-desc h6 { text-align:center}
    
}

@media (min-width: 460px) { 
    
    .main-logo{
        width:50px;
        height:50px;
    }
    
    .no-overflow-mobile{
        overflow:hidden;
    }
    
    .hero{
        height:760px;
    }
    
    h2 {
        font-size:30px;
        line-height:46px;
    }

    .custom-text h2 span{
        font-size:40px;
    }
    
    .custom-text{
        margin-top:0px;
    } 
    
    .top-padding-mobile{
        padding-top:2rem
    }
    
    .main-logo{
        width:60px;
        height:60px;
    }
    
    .x-large{font-size:50px!important}
    
    .caption{
        top:-20px;
        left:90px;
    }
    
    .hero h1{
        font-size:40px; 
        line-height:42px;
        transform: rotate(-9deg) skew(-15deg);
    }    
    
    .caption .sub{
        padding-bottom:10px;
        transform: rotate(-9deg) skew(-15deg);
    }
    
    .caption p span{
        font-size:20px;
    }
    
    .hero{height:800px}
    .hero .row{height:770px}
    
    .cans-glass{
        width:100%;
        position:relative;
        z-index:500;
        margin:auto;
        top:300px;
    }
    
    .parallax { height: 760px }
    
    .parallax .top-padding-lg{padding-top:7rem}
    
    .parallax .bottom-padding-lg{padding-bottom:4rem}
    
    h2 {
        font-size:32px;
        line-height:42px;
    }

    .custom-text h2 span{
        font-size:36px;
    }
    
    .product-desc .top-padding-5 {padding-top:0rem}
    
    .product-desc p { max-width:none; text-align:center}
    .product-desc h2 { text-align:center}
    .product-desc h6 { text-align:center}
    
    .product-desc h2 {
        transform: rotate(-9deg) skew(-15deg);
        margin-bottom:35px;
        font-size:45px;
    }
    
    #inside-technology .row p {max-width:none}
    #best-of .row p {max-width:none}
    
}

@media (min-width: 510px) { 
    
    .x-large{font-size:56px!important}
    
    .caption{
        top:-20px;
        left:90px;
    }
    
    .hero h1{
        font-size:44px; 
        line-height:46px;
        transform: rotate(-9deg) skew(-15deg);
    }    
    
    .caption .sub{
        padding-bottom:10px;
        transform: rotate(-9deg) skew(-15deg);
    }
    
    .caption p span{
        font-size:20px;
    }
    
    .cans-glass{
        width:400px;
        position:absolute;
        top:330px;
        left:60px;
        z-index:500;
    }
    
}

@media (min-width: 559px) { 
    
    .parallax { height: 830px }
    
    .parallax .top-padding-lg{padding-top:7.5rem}
    
    .parallax .bottom-padding-lg{padding-bottom:4rem}
    
    .cans-glass{
        width:400px;
        position:absolute;
        top:330px;
        left:90px;
        z-index:500;
    }
    
    .caption p span{
        font-size:20px;
    }
    
    #inside-technology .row p {max-width:none}
    #best-of .row p {max-width:none}
    
}

/*Small devices (landscape phones, 576px and up)*/
@media (min-width: 576px) { 
    
    .no-overflow-mobile{
        overflow:hidden;
    }
    
    .hero{
        height:600px;
    }
    
    h2 {
        font-size:32px;
        line-height:42px;
    }

    .custom-text h2 span{
        font-size:36px;
    }
    
    .custom-text{
        margin-top:25px;
    }  
    
    .x-large{font-size:51px!important}
    
    .hero h1{
        font-size:40px; 
        line-height:42px;
        transform: rotate(-9deg) skew(-15deg);
    }    
    
    .caption .sub{
        padding-bottom:10px;
        transform: rotate(-9deg) skew(-15deg);
    }
    
    .caption p span{
        font-size:18px;
    } 
    
    .caption{
        position:absolute;
        top:50px;
        right:-170px;
        z-index:1000;
    }
    
    .cans-glass{
        width:250px;
        position:absolute;
        top:160px;
        left:0px;
        z-index:500;
    }
    
    .no-overflow-mobile { overflow:hidden}
    
    .parallax { height: 800px }
    
    .parallax .top-padding-lg{padding-top:7.5rem}
    
    .parallax .bottom-padding-lg{padding-bottom:4rem}
    
    .product-desc .top-padding-5 {padding-top:0rem}
    
    .product-desc p { max-width:none; text-align:center}
    .product-desc h2 { text-align:center}
    .product-desc h6 { text-align:center}
    
    .product-desc h2 {
        transform: rotate(-9deg) skew(-15deg);
        margin-bottom:35px;
        font-size:50px;
    }
    
    #inside-technology .row p {max-width:none}
    #best-of .row p {max-width:none}
    
}

/*Medium devices (tablets, 768px and up)*/
@media (min-width: 768px) {
    
    h2 {
        font-size:32px;
        line-height:42px;
    }

    .custom-text h2 span{
        font-size:40px;
    }
    
    .x-large{font-size:51px!important}
    
    .hero h1{
        font-size:40px; 
        line-height:42px;
        transform: rotate(-9deg) skew(-15deg);
    }    
    
    .caption .sub{
        padding-bottom:10px;
        transform: rotate(-9deg) skew(-15deg);
    }
    
    .caption p span{
        font-size:17px;
    }
    
    .no-overflow-mobile { overflow:hidden}
    
    .caption{
        position:absolute;
        top:50px;
        right:-350px;
        z-index:1000;
    }   
    
    .cans-glass{
        width:450px;
        position:absolute;
        top:80px;
        left:0px;
        z-index:500;
    }
    
    .parallax { height: 390px }
    
    .parallax .top-padding-lg{padding-top:6.5rem}
    
    .parallax .bottom-padding-lg{padding-bottom:6rem}
    
    .product{
        width:300px;
        margin-top:4rem;
        margin-bottom:2rem;
    }
    
    .product-desc .top-padding-5 {padding-top:3rem}
    
    .product-desc p { max-width:300px; text-align:left}
    .product-desc h2 { text-align:left}
    .product-desc h6 { text-align:left}
    
    .product-desc h2 {
        transform: rotate(-9deg) skew(-15deg);
        margin-bottom:45px;
        font-size:50px;
    }
    
}

/*Large devices (desktops, 992px and up)*/
@media (min-width: 992px) { 
    
    h2 {
        font-size:36px;
        line-height:46px;
    }

    .custom-text h2 span{
        font-size:50px;
    }
    
    .no-overflow-mobile { overflow:hidden}
    
    .caption{
        position:absolute;
        top:50px;
        right:-450px;
        z-index:1000;
    }
    
    .x-large{font-size:68px!important}
    
    .hero h1{
        font-size:53px; 
        line-height:54px;
        transform: rotate(-9deg) skew(-15deg);
    }    
    
    .caption .sub{
        padding-bottom:10px;
        transform: rotate(-9deg) skew(-15deg);
    }
    
    .caption p span{
        font-size:20px;
    }
    
    .cans-glass{
        width:450px;
        position:absolute;
        top:90px;
        left:95px;
        z-index:500;
    }
    
    .parallax { height: 450px }
    
    .parallax .top-padding-lg{padding-top:6rem}
    
    .parallax .bottom-padding-lg{padding-bottom:8rem}
    
    .bg-dark{ background-color:rgba(2,37,62,.5)!important;}
    
    .product{
        width:400px;
        margin-top:3rem;
        margin-bottom:2rem;
    }
    
    .product-desc .top-padding-5 {padding-top:4.5rem}
    
    .product-desc p { max-width:350px; text-align:left}
    .product-desc h2 { text-align:left}
    .product-desc h6 { text-align:left}
    
    .product-desc h2 {
        transform: rotate(-9deg) skew(-15deg);
        margin-bottom:55px;
        font-size:60px;
    }
    
}

/*Extra large devices (large desktops, 1200px and up)*/
@media (min-width: 1200px) {   
    
    h2 {
        font-size:36px;
        line-height:46px;
    }

    .custom-text h2 span{
        font-size:50px;
    }
    
    .no-overflow-mobile { overflow:hidden}
    
    .caption{
        position:absolute;
        top:50px;
        right:-500px;
        z-index:1000;
    }
    
    .hero h1{
        font-size:53px; 
        line-height:54px;
        transform: rotate(-9deg) skew(-15deg);
    }    
    
    .caption .sub{
        padding-bottom:10px;
        transform: rotate(-9deg) skew(-15deg);
    }
    
    .caption p span{
        font-size:20px;
    }
    
    .cans-glass{
        width:500px;
        position:absolute;
        top:50px;
        left:155px;
        z-index:500;
    }
    
    .x-large{font-size:68px!important}
    
    .parallax { height: 450px }
    
    .parallax .top-padding-lg{padding-top:6rem}
    
    .parallax .bottom-padding-lg{padding-bottom:8rem}
    
    .bg-dark{ background-color:rgba(2,37,62,.5)!important;}
    
    .product{
        width:400px;
        margin-top:3rem;
        margin-bottom:2rem;
    }
    
    .product-desc .top-padding-5 {padding-top:4.5rem}
    
    .product-desc p { max-width:350px; text-align:left}
    .product-desc h2 { text-align:left}
    .product-desc h6 { text-align:left}
    
    .product-desc h2 {
        transform: rotate(-9deg) skew(-15deg);
        margin-bottom:70px;
        font-size:60px;
    }
    
    #inside-technology .row p {max-width:300px}
    #best-of .row p {max-width:300px; margin-left:auto; margin-right:auto}
        
}