@media only screen and (min-width: 1600px)
{
    .banner-content h1 {
    font-size: 70px;
    line-height: 80px;
}
}
@media only screen and (min-width: 1500px) {
.wrapper-inner{
max-width: 1366px;
margin: 0 auto;
width:100%;
padding: 0 15px;
}
} 

@media only screen and (max-width: 1400px)
{
.banner-content p { 
    max-width: 80%;
}
.video-banner {
    height: 90vh;
}

}
@media only screen and (max-width:1100px)
{
    .banner-content h1 {
    font-size: 50px;
    line-height: 60px;
}
.footer-links1 .fo-links h3 {
    line-height:35px;
    font-size: 25px;
}
}


@media only screen and (min-width:992px) and (max-width:1100px){
.video-banner {
    height: 90vh;
}
.aim-sub-heading h5 {
    font-size: 25px;
    line-height: 35px;
}

}
@media only screen and (max-width: 992px)
{
    .aimbx {width: 100%;}
    .common-title .common-heading {
    font-size: 40px;
    line-height: 40px;
    margin-bottom: 40px;
}
.common-title .common-heading .span-color {
    font-size: 40px;
    line-height: 50px;
}
.common-title .common-heading span {
    font-size: 25px;
    line-height:35px;
}
.work-box p {
    font-size: 20px;
    line-height: 30px;
}
.col-2{
    --ms-flex: 0 0 33.33%;
    flex: 0 0 33.33%;
    max-width: 33.33%;
}
.story-box .story-img {
    height: 300px;
}
footer .border-rg:first-child .fo-links {
    padding-left: 20px;
}
.fl-btn {
    top: 1%;
} 
footer .border-rg:nth-child(2) .fo-links{border: none;}
.cm-padding {
    padding: 50px 0;
}
.video-banner {
    height: 90vh;
}
.banner-content h1 {
    font-size: 44px;
    line-height: 50px;
}
/*.banner-content {
    position: absolute;
    left: 10%;
    top: 32%;
    z-index: 2;
    transform: translate(-10% ,-50%);
}*/

body.homepg-demo {
    margin-top:50px;
}
.aim-sub-heading h5 {
    font-size: 23px;
    line-height:32px;
}
.banner-content p {
    font-size: 20px;
    line-height: 29px;
}
.banner-content .degree:after {
    bottom: 15px;
    width: 7px;
    height: 7px;
}




}

@media only screen and (max-width: 800px) {
}
@media only screen and (min-width: 768px) {
}

@media only screen and (max-width: 767px)
{
    .col-4,.col-6,.col-5,.col-3,.col-8,.col-7{
     flex: 0 0 100%;
    max-width: 100%; 
    }
	
.partner-logo-img img {
    margin: auto;
}
 
.mouse-box{display: none;}     
.footer-strip p br,.common-title .common-heading br{display: none;}
footer .border-rg:first-child .fo-links {
    padding-left: 20px;
}
.aim-sub-heading {text-align: left;padding-right: 0;}
.aimbx {
    width: 100%;
    padding: 0 15px;
}
.aim-sub-content p {
    width: 100%;
}
.fo-links {padding:15px 0 0;}
.new-footer-layout .border-rg:first-child .fo-links {
    padding-left:0;
}
.copy-para p, .footer-strip p {   
     margin-bottom: 0;
    text-align: center;
    font-size: 13px;
} 
.common-title .common-heading {
    font-size: 40px;
    margin-bottom: 50px;
}

.work-client-section{display: none;}
header {padding: 10px 0;}
.work-client-section a,.work-client-section:hover .work-btn {padding: 7px 24px;}
.humburger:before {
    top: 7px;
    left: -15px;
    width: 50px;
    height: 50px;
}


a.menu-active {transform: translateY(0);}
.menus a span {
    left: 0px;
    font-size: 15px;
    line-height: 32px;
}
.hamburger-header {
    padding-right: 0;
}
.cm-padding {
    padding: 20px 0;
}

.common-title .common-heading {
    font-size: 25px;
    margin-bottom: 20px;
    line-height: 35px;
}
.common-title .common-heading .span-color {
    font-size: 25px;
    line-height: 35px;
}
.common-title .common-heading span {
    font-size: 18px;
    line-height: 28px;
}
.footer-links1 .fo-links h3 {
    line-height:36px;
    font-size: 26px;
}
.see-btn {
    font-size: 16px;
    line-height: 28px;
    padding: 7px 20px;
}
.footer-strip {
    padding: 24px 0 0;
}
.header-new {
    background: #fff;
}

.slick-arrow {
    top: -90px;
}


@keyframes showMenu {
  0% {
    transform: translateY(-50%) translateX(-50%) scale(0);
    opacity: 0;
  }
  50% {
    opacity: 1;
  }
  100% {
    transform: translateY(-50%) translateX(-50%) scale(3);
    opacity: 1;
  }
}
@keyframes hideMenu {
  0% {
    transform: translateY(-50%) translateX(-50%) scale(3);
    opacity: 1;
  }
  95% {
    opacity: 1;
  }
  100% {
    transform: translateY(-50%) translateX(-50%) scale(0.001);
    opacity: 0;
  }
}
.menuBg {
  /*background: #242424;*/
  width:100%;
  height:100%;

}
.humburger {
    width: 22px;
    height: 22px;
}  
.hamburger-icon:before{display: none;}
.story-box p {
    font-size: 16px;
    line-height: 26px;
}
.partner-logo-img {
    text-align: center;
    max-width: 200px;
    margin: 0 auto 20px;
}
/*.partner-logo-img:last-child{
    margin-bottom: 0;
}*/

.header-left {
    align-items: flex-start;
}  
.banner-main .mobile-view{position: relative;}
.banner-main .mobile-view:after {
    content: '';
    position: absolute;
    right: 0;
    bottom:0px;
    width: 100%;
    background: #fff;
    height: 40%;
} 


.col-2 {
    --ms-flex: 0 0 50%;
    flex: 0 0 50%;
    max-width: 50%;
}
.menus a {
    line-height: 40px;
    font-size: 30px;
    display: block;
}
    .menus a {
        opacity: 0;
        transform: translateY(0);
        transform: translateX(-100%);
    }
a.menu-active{
    transform: translateX(0);
    opacity: 1;
    }

.grapes-menu-section {
    height: 100%;
    display: block;
    align-items: center;
    margin-top:40px;
}
.story-box .story-img {
    height: auto;
}
.story-box img {
    height: auto;
    width: 100%;
}
.logo-section {
    width: 100px;
}
.parallex-image .content {
    width: 100%;
}
.banner-content p {
    max-width: 100%;
}
.bg-holder {
background-position: center bottom !important;
}
.bg-holder .content {
    width: 100%;
    position: relative;
    top:15px;
    transform: translate(0,0);
    text-align: center;
    left: 0;
}
.work-box .bg-holder .content p {
    color: #fff;
    font-size: 16px;
    line-height: 22px;
    padding: 0px 10px 16px;
}
.work-box .bg-holder .content  p br{display: none;}
.work-box .content img {
max-width: 80px;
}
.bg-holder.dekstop-scroll{position: relative;}
.bg-holder:nth-child(2) .content img{transform: scale(0.5);margin-bottom:-10px;}
.bg-holder:nth-child(2) .content{top: -6px;}
.bg-holder:nth-child(3) .content{top: 0;}  
.bg-holder.dekstop-scroll:nth-child(3):before,
.bg-holder.dekstop-scroll:nth-child(1):before{background: rgb(0 0 0 / 0%);}  
.bg-holder:nth-child(3) .content img{transform: scale(0.7);margin-bottom: 0;}
.bg-holder:nth-child(5) .content img{max-width:150px;}
.bg-holder.dekstop-scroll:before{
    content: '';
    position: absolute;
    left: 0;
    top: 0;
    background: rgba(0 0 0 /30%);
    width: 100%;
    height: 100%;
}
.bg-holder#pic1 {
  background: url('../img/mobile-lava.jpg') no-repeat;
  background-size: cover!important;
}

/*.bg-holder#pic2 {
  background: url('../img/mobile-jbl.jpg') no-repeat;
   background-size: cover!important;
}*/

/*.bg-holder#pic3 {
  background: url('../img/work3.png') no-repeat;
 background-size: cover!important;
}*/
.work-box span {
    margin-bottom: 0px;
}
section.liMarque {
    padding: 15px;
}
.marquee-txt span {
    font-size: 20px;
    line-height: 30px;
}
/*.bg-holder#pic3,.bg-holder#pic2,.bg-holder#pic1 {
 background-size: contain!important;
}*/
.bg-holder#pic2 {
  background: url('../img/mobile-jbl.png')no-repeat; 
}
.bg-holder#pic4 {
  background: url('../img/mobile-cp.jpg')no-repeat;
 background-size: cover!important;
}
.bg-holder#pic5 {
  background: url('../img/mobile-lr.jpg')no-repeat;
 background-size: cover!important;
}
.marquee-txt span:after{top: 12px;}
.video-banner {
    height: 100vh;
}
.banner-content p {
    max-width: 80%;
}






}

@media only screen and (max-width: 639px) {
  .desktop-view{display: none!important;}
.mobile-view{display: block!important;position: relative;}
.banner-content {
    position: absolute;
    left: 10px;
    bottom: 57px;
    z-index: 2;
    transform: translate(0 ,0);
    top: inherit;
    padding: 20px;
}


}
 @media only screen and (max-width: 576px)
 {



.banner-content h1 {
    font-size: 30px;
    line-height: 40px;
 }
 .copy-links ul {
    justify-content: flex-start;
        flex-wrap: wrap;
} 
.copy-links ul li {
    padding: 0 6px;
    margin-bottom: 10px;
}


.banner-content {
    bottom:0px;
}



}

@media only screen and (max-width:479px)
{
    .menus {top:20%;width: 100%;flex-direction: column;}
    .accolades-slider .slick-list{padding-right:50px;}

.grape-left-side {
    width: 100%;
}
.grape-row {
    padding: 0 0px;
}
.menus a {
    line-height:35px;
    font-size: 25px;
    display:block;
    padding: 0 0 0 30px;  
    margin-bottom: 5%;
    margin-left: 10%;
}
.col-2 {
    --ms-flex: 0 0 100%;
    flex:0 0 100%;
    max-width: 100%;
}
.partner-logos .col-2 {
    --ms-flex: 0 0 50%;
    flex:0 0 50%;
    max-width:50%;
}
.allocate-boximg p {
    text-align: center;
}
.allocate-boximg .image-size {
    text-align: center;
}

.banner-content {
    bottom:-10px;
}
.new-footer-links ul li {
    width: 50%;
    margin: 0 0 10px 0;
}
.new-footer-links ul {
    justify-content: flex-start;}

.copyright .row {
    flex-direction: column-reverse;
}
.copyright li a{font-size: 13px;}
.banner-content p {
    max-width: 100%;
    font-size: 18px;
    line-height: 28px;
}
.banner-content p br{display: none;}
.parallex-image p {
    font-size: 18px;
    line-height: 28px;
}
.aim-sub-heading h5 {
    font-size: 20px;
    line-height: 30px;
}
.banner-content .degree {padding-right: 13px;}
.banner-content .degree:after {
    bottom: 9px;
    width: 5px;
    height: 5px;
    border: 2px solid #DD4456;
}


}
@media only screen and (max-width: 450px) {
.banner-main .mobile-view:after {
    bottom: -53px;
}
.banner-content {
    bottom:-40px;
}
}
@media only screen and (max-width: 359px) {
.banner-main .banner-inner svg{
    margin-top: 0px;
}
.banner-content {
    bottom: -50px;
}
.banner-main .mobile-view:after {
    bottom: -100px;
}

}
@media only screen and (max-width: 330px) {

.banner-content {
    bottom:-70px;
}

}