/* imac 27 4k inch Styles here */
/* @media only screen
and (max-width : 2880px)
and (max-height : 5120px) {
#banner { height: 800px; }
#banner .banner-content p {padding-right: 4vw;}

} */
/* imac 21 4k inch Styles here */
@media (min-width: 1920px) and (max-width: 2560px) {

}

@media only screen and (width: 2560px) {
/* styles for viewport exactly 2560px wide */
/*   .container { max-width: 1920px; } */
#ResponsibleApproach {padding: 20px 0px;}
#ResponsibleApproach .item {height: 750px;}
#ResponsibleApproach .container {
transform: translate(0px, 60px);
}
#ResponsibleApproach .item .Expertise_wrapper ul li {font-size: 22px;}
#ResponsibleApproach .item .Expertise_wrapper h3 {height: 550px;}
#featureWork {margin-top: 0px;}
#ResponsibleApproach .wrapper {
    height: 82vh;
}
#featureWork .swiper-slide video,#featureWork .swiper-slide img { height: 100%; }
}


@media only screen
and (max-width : 2304px)
and (max-height : 4096px) {
/* Styles here */
/*    #banner { height: 800px; }
#banner .banner-content p {padding-right: 4vw;} */
}

/* imac 21 inch Styles here */
@media only screen
and (max-width : 1080px)
and (max-height : 1920px) {
/*       #banner { height: 800px; }
#banner .banner-content p {padding-right: 4vw;} */
/* Styles here */
}

@media (min-width: 1920px) and (max-width: 2560px) {


}


@media (min-width: 1600px) and (max-width: 1919px) {

}


@media only screen and (min-width: 1400px) and (max-width: 1599px) {
/* #shaping h2 {font-size: 98px;
line-height: 100px;} */

#Careers .desc {
font-size: 90px;
line-height: 86px;
}

#Careers .desc { padding-right: 180px; }
#videoBottom .desc,#Clientele .desc {font-size: 56px;
line-height: 67px;}
#featureWork .swiper-slide video,#featureWork .swiper-slide img {height: 570px;}
#featureWork .SectionTitle{ margin-bottom: 30px!important;}
.overlayFrom .form-section {width: 82%;}
#ResponsibleApproach .container {
transform: translate(0px, 36px);
}
#ResponsibleApproach .item { height: 570px; }
#ResponsibleApproach .item .Expertise_wrapper h3 {height: 360px;font-size: 56px; line-height: 67px; padding: 30px 0px 20px;}
/* #ResponsibleApproach .item .Expertise_wrapper h3 {font-size: 76px;height: 370px;} */
#ResponsibleApproach {padding: 0px 0px;}

#ResponsibleApproach .wrapper {
    height: 90vh;
}
#ResponsibleApproach .item .Expertise_wrapper .expert-con-det{ height: 350px;}

}

@media only screen and (min-width: 1200px) and (max-width: 1399px)  {
    .SectionTitle{font-size: 24px;}
#shaping h2 {font-size: 75px; line-height: 80px;}

#Careers .desc {
font-size: 80px;
line-height: 74px;
}
#Careers .desc { padding-right: 170px; font-size: 46px;
        line-height: 54px; }
#videoBottom .desc,#Clientele .desc {font-size: 46px;
        line-height: 54px;}
#featureWork .swiper-slide video,#featureWork .swiper-slide img {height: 420px;}
.overlayFrom .form-section {width: 82%;}
#videoBottom h3 {font-size: 24px;}
#ResponsibleApproach .item { width: 1100px;}
.overlayFrom .form-section {padding: 60px;}
#ResponsibleApproach .container {
transform: translate(0px, 57px);
}

#ResponsibleApproach .item .Expertise_wrapper h3 {
font-size: 46px;
        line-height: 54px;
max-width: 710px;
height: 230px;
}
#ResponsibleApproach .item .Expertise_wrapper ul li {font-size: 15px;}
#Clientele h3 {padding-right: 400px;font-size: 24px;
    line-height: 33px;}
#ResponsibleApproach .wrapper {
    height: 90vh;
}
}


@media only screen and (min-device-width: 768px) and (max-device-width: 1199px) and (orientation: landscape) 

{
.row { margin: 0px; margin: 0px; }

#shaping {
padding-top: 130px;
}
#shaping h2 {font-size: 86px;
line-height: 100px;}

#ResponsibleApproach .item .Expertise_wrapper h3 {font-size: 40px;
        line-height: 1.3;
        letter-spacing: 1px; height: 320px;}
#StirrupVideo {margin-top: 50px;margin-bottom: 30px;}
#videoBottom h3 {font-size: 22px;
        margin-top: 40px;
        padding-right: 0px;
        line-height: 31px;}
#ResponsibleApproach .item { width: 100%; height: 500px; padding: 10px; padding-top: 20px; }
#featureWork {margin-top: 0px;padding: 30px 0px;margin-bottom: 30px;}

#featureWork .swiper-slide video,#featureWork .swiper-slide img {height: 350px;}
#featureWork .featureWorkSwiper {overflow: visible;margin-left: 0%;}
#featureWork .skills,#featureWork h6 { padding: 0px 10px; }

#Clientele h3 {font-size: 22px;
        margin-top: 40px;
        padding-right: 0px;
        line-height: 31px;}

#Careers {height: 65vh;}
.footer_wrp .customContainer .footer_lhs .cvr .social_wrp {margin-top: 30px;margin-bottom: 30px;}
.footer_wrp .Lets-Talk a {font-size: 50px;margin-bottom: 30px;}
.overlayFrom .form-section {padding: 50px;width: 90%;}
.overlayFrom .form-section h1 {font-size: 52px;}
.cursor { display: none; }
#StirrupVideo .StirrupVideoImg {margin: auto 20px;}
#ResponsibleApproach { padding-bottom: 0px; }

#Careers .desc,#Clientele .desc,#videoBottom .desc 
{font-size: 40px;
line-height: 1.3;
letter-spacing: 1px;}

.SectionTitle {font-size: 22px;}
.footer_wrp .customContainer .footer_rhs { margin-top: 30px; }
}


@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation: portrait) 
{

.row { margin: 0px; margin: 0px; }

#shaping {
padding-top: 130px;
}
#shaping h2 {font-size: 65px;
line-height: 76px;}

#StirrupVideo .StirrupVideoImg {margin: auto 20px;}
#videoBottom .desc {
font-size: 34px;
line-height: 1.3;
letter-spacing: 1px;
}
#ResponsibleApproach { padding-top: 0px; }
#StirrupVideo {margin-top: 50px;margin-bottom: 30px; overflow: hidden; }
#videoBottom h3 {font-size: 20px;margin-top: 40px; padding-right: 0px; line-height: 32px; }
#ResponsibleApproach .item { width: 100%; height: 500px; padding: 10px; padding-top: 20px; }
#featureWork {margin-top: 0px;padding: 30px 0px;margin-bottom: 30px;}

#featureWork .swiper-slide video,#featureWork .swiper-slide img {height: 350px;}
#featureWork .featureWorkSwiper {overflow: visible;margin-left: 0%;}
#featureWork .skills,#featureWork h6 { padding: 0px 10px; }
#Clientele .desc {font-size: 34px;
        line-height: 1.3;
        letter-spacing: 1px;}
#Clientele h3 {font-size: 20px;
        margin-top: 40px;
        padding-right: 0px;
        line-height: 32px;}
#Careers .desc {font-size: 34px;
        line-height: 1.3;
        letter-spacing: 1px;}
#Careers {height: 50vh;}
.footer_wrp .customContainer .footer_lhs .cvr .social_wrp {margin-top: 30px;margin-bottom: 30px;}
.footer_wrp .Lets-Talk a {font-size: 50px;}
.overlayFrom .form-section {display: block;padding: 30px;}
.overlayFrom .form-section h1 {font-size: 50px; margin-bottom: 30px; }
.overlayFrom .form-container {
width: 100%;
}

#ResponsibleApproach .wrapper {
height: 70vh;
}


.cursor { display: none; }
.header_wrp ul li a:after { display: none; }


.hamburger {
display: flex;
}

.navList {
position: absolute;
top: 100%;
right: 0;
flex-direction: column;
background: #fff;
width: 200px;
padding: 10px 0;
box-shadow:none;
display: block;   /* show when active */
position: fixed;
width: 100%;
height: 89vh;
padding: 20px;
opacity: 0;
visibility: hidden;
transition: opacity 0.5s ease-in-out, visibility 0.5s ease-in-out;
}

.header_wrp ul {width: 100%;padding: 15px;}

.navList.show {
opacity: 1;
visibility: visible;

}


.navList li {
opacity: 0;
transform: translateX(-30px);
transition: all 0.4s ease;
}
.navList.show li {transform: translateX(0);opacity: 1;}
/* Stagger effect */
.navList.show li:nth-child(1) { transition-delay: 0.1s; }
.navList.show li:nth-child(2) { transition-delay: 0.2s; }
.navList.show li:nth-child(3) { transition-delay: 0.3s; }
.navList.show li:nth-child(4) { transition-delay: 0.4s; }
.navList.show li:nth-child(5) { transition-delay: 0.5s; }
.navList.show li:nth-child(6) { transition-delay: 0.6s; }


/* Animate hamburger into X */
.hamburger.active span:nth-child(1) {
transform: rotate(45deg) translate(7px, 5px);
}
.hamburger.active span:nth-child(2) {
opacity: 0;
}
.hamburger.active span:nth-child(3) {
transform: rotate(-45deg) translate(7px, -5px);
}


.header_wrp ul li a {border-bottom: solid 1px #e4e4e4;
width: 100%;
padding: 12px 0px;}


.header_wrp {width: 95%;padding: 0px 24px;}
#ResponsibleApproach .item .Expertise_wrapper h3 {font-size: 34px;
        line-height: 1.3;
        letter-spacing: 1px; max-width: 600px; height: 330px; }
.header_wrp.container {max-width: 730px;}
#featureWork .skills ul li {font-size: 0.6rem;}
.footer_wrp .customContainer {width: 90%;}

}

/* Extra small */
@media (min-width: 320px) and (max-width: 767px)
{

.row { margin: 0px; margin: 0px; }

#shaping {
padding-top: 130px;
}
#shaping h2 {font-size: 46px;line-height: 55px;}



#StirrupVideo {margin-top: 50px;margin-bottom: 30px;}
#videoBottom h3 { font-size: 20px; margin-top: 40px; padding-right: 0px; line-height: 29px; }
#ResponsibleApproach .item { width: 100%; height: auto; padding: 10px 20px; padding-top: 20px; margin-top: 20px;  }
#ResponsibleApproach .item .Expertise_wrapper { top: 47%; height: auto; padding: 13px 40px; }
#ResponsibleApproach .item .Expertise_wrapper .expert-con-det{ max-width: 100%;}
/* #ResponsibleApproach .item:nth-child(1) { background-color: #200e6a; }
#ResponsibleApproach .item:nth-child(2) { background-color: #185c34; }
#ResponsibleApproach .item:nth-child(3) { background-color: #5f0f32; }
#ResponsibleApproach .item:nth-child(4) { background-color: #925da3; }
#ResponsibleApproach .item:nth-child(5) { background-color: #185c34; } *//* height: 420px;  */
#ResponsibleApproach .item video { position: absolute; left: 50%; transform: translateX(-50%); top: 0; width: calc(100% - 40px); height: auto;}
 
#ResponsibleApproach .item .Expertise_wrapper ul { display: block; }
#ResponsibleApproach .item .Expertise_wrapper h3 {font-size: 22px; line-height: 30px; height: auto;}
#ResponsibleApproach .item .Expertise_wrapper h3 br{ display: none;}
#ResponsibleApproach .item .Expertise_wrapper .expert-con-det{ height: auto;}
#ResponsibleApproach .item .Expertise_wrapper .expert-con-det p{ display: none; font-size: 20px; line-height: 28px;}
#featureWork {margin-top: 0px;padding: 30px 0px;margin-bottom: 30px;}
#ResponsibleApproach .item .Expertise_wrapper ul li { width: 100%; margin-bottom: 4px;
    font-size: 16px;} 
#ResponsibleApproach .for-mobile{ display: block;}

#featureWork{ background: #090912;}
#featureWork .swiper-slide video,#featureWork .swiper-slide img {height: 350px;}
#featureWork .featureWorkSwiper {overflow: visible;margin-left: 0%; padding: 0 20px;}
#featureWork .skills,#featureWork h6 { padding: 0px 10px; }

#Clientele h3 {font-size: 20px;
        margin-top: 40px;
        padding-right: 0px;
        line-height: 29px;}
        #Clientele h3 br,#Clientele .desc br,#videoBottom h3 br, #videoBottom .desc br { display: none; }

#Careers {height: 65vh;}
.footer_wrp .customContainer .footer_lhs .cvr .social_wrp {margin-top: 0px;margin-bottom: 30px;}
.footer_wrp .Lets-Talk a {font-size: 50px;}
.overlayFrom .form-section {width: 90%;padding: 20px; display: block; }
.overlayFrom .form-section h1 {font-size: 40px; margin-bottom: 20px; }
.overlayFrom .form-container {
width: 100%;
}


#ResponsibleApproach .container {
transform: translate(0px, 0px);
padding-top: 50px;
padding-bottom: 12px;
}
#StirrupVideo .StirrupVideoImg {margin: auto 20px;}

.cursor { display: none; }
.header_wrp ul li a:after { display: none; }


.hamburger {
display: flex;
}

.navList {
position: absolute;
top: 100%;
right: 0;
flex-direction: column;
background: #fff;
width: 200px;
padding: 10px 0;
box-shadow:none;
display: block;   /* show when active */
position: fixed;
width: 100%;
height: 89vh;
padding: 20px;
opacity: 0;
visibility: hidden;
transition: opacity 0.5s ease-in-out, visibility 0.5s ease-in-out;
}

.header_wrp ul {width: 100%;padding-top: 15px; padding: 15px 20px 0;}

.navList li {
opacity: 0;
transform: translateX(-30px);
transition: all 0.4s ease;
}

.navList.show {
opacity: 1;
visibility: visible;

}

.navList.show li {transform: translateX(0);opacity: 1;}
/* Stagger effect */
.navList.show li:nth-child(1) { transition-delay: 0.1s; }
.navList.show li:nth-child(2) { transition-delay: 0.2s; }
.navList.show li:nth-child(3) { transition-delay: 0.3s; }
.navList.show li:nth-child(4) { transition-delay: 0.4s; }
.navList.show li:nth-child(5) { transition-delay: 0.5s; }
.navList.show li:nth-child(6) { transition-delay: 0.6s; }


/* Animate hamburger into X */
.hamburger.active span:nth-child(1) {
transform: rotate(45deg) translate(7px, 5px);
}
.hamburger.active span:nth-child(2) {
opacity: 0;
}
.hamburger.active span:nth-child(3) {
transform: rotate(-45deg) translate(7px, -5px);
}


.header_wrp ul li a {border-bottom: solid 1px #e4e4e4;
width: 100%;
padding: 12px 0px;}


.header_wrp {width: 95%;padding: 0px 24px;}

#videoBottom .desc br { display: none; } 

#ResponsibleApproach {padding: 20px 0px;}
.footer_wrp .customContainer .footer_rhs { margin-top: 20px; }
.footer_wrp .Lets-Talk a {margin-bottom: 30px;}
.footer_wrp .customContainer .footer_lhs .cvr .social_wrp img { width: 20px; }

#Careers .desc,#Clientele .desc,#videoBottom .desc {font-size: 32px;
        line-height: 42px;
        letter-spacing: 1px;}

        #Careers .desc br,#Clientele .desc br,#videoBottom .desc  br { display: none; }
.SectionTitle {font-size: 22px;}

.footerNewWrp ul li a{ height: 60px;}
.footerNewWrp .socialWrp{ flex-direction: column;}



} 

@media (max-width: 1680px) {
#ResponsibleApproach .item .Expertise_wrapper .expert-con-det { height: 210px; }
#ResponsibleApproach .item .Expertise_wrapper h3{ font-size: 40px; line-height: 44px;}
#ResponsibleApproach .item .Expertise_wrapper .expert-con-det p{ font-size: 22px; line-height: 26px;}
#ResponsibleApproach .item{margin-top: 60px;}
    #ResponsibleApproach .item {
        height: 495px;
    }
}
@media only screen and (min-width: 1512px) and (max-width: 1599px) {
        .fancybox__nav{ width: 95%;}
}
@media (max-width: 1100px) {
        #shaping h2{ font-size: 66px; line-height: 72px;}
}
@media (max-width: 991px) {
        #shaping{ padding: 150px 0 130px;}
        #shaping h2{ width: 100%;}
        #shaping h2 br{ display: none;}
        #shaping .scrolDown{ bottom: -100px;}
        .copyrigt_wrp .container{ width: 100%; justify-content: center; padding: 10px 0 0 ;}
        .copyrigt_wrp .footer_bottom_lhs{ text-align: center; padding: 20px 0 ;}
        .footer_bottom_rhs{ display: flex; flex-direction: column; width: 100%; }
        .footer_bottom_rhs a{ display: block; text-align: center; margin-left: 0!important; margin: 5px 0;}
        .desktop-ft-logo{ display: none;}
        .mob-ft-logo{ display: block;}
        #ResponsibleApproach .item .Expertise_wrapper .expert-con-det{ height: auto;}
        #ResponsibleApproach .list{ padding: 20px;}
        .Lets-Talk{ padding-bottom: 20px;}
        #videoBottom { padding-bottom: 60px; }
        #ResponsibleApproach .item {margin-top: 30px;}
        .fancybox__nav{ top: 51%; width: 95%;}
        .carousel__button.is-prev, .carousel__button.is-next{ width: 38px; height: 38px;}
        #ResponsibleApproach .item .Expertise_wrapper h3{ font-size: 32px; line-height: 37px; height: auto; padding: 30px 0px 20px;}
        #ResponsibleApproach .item .Expertise_wrapper .expert-con-det{ max-width: 70%;}
        #ResponsibleApproach .item .Expertise_wrapper ul li{ padding-right: 15px;}
        #featureWork { background: #090912; }
}
@media (max-width: 767px) {

}
@media (max-width: 575px) {
        .container{ padding: 0 20px!important;}
        #shaping h2 { font-size: 40px; line-height: 46px; }
    #ResponsibleApproach .item .Expertise_wrapper ul li{ font-size: 14px; line-height: 18px;}  
    #ResponsibleApproach .item .Expertise_wrapper h3{  font-size: 18px; line-height: 20px; padding: 10px 0;} 
    #Careers .container{ gap: 30px;}
    .footerNewWrp { padding: 60px 0; }
    .fancybox__nav{ top: 53%; width: 95%;}
    .carousel__button.is-prev, .carousel__button.is-next{ width: 34px; height: 34px;}
}

