/* css only for hover effect all hover effect must write in this Media query */
@media only screen and (min-width: 1200px) {
}


@media only screen and (max-width: 1660px) {
.bannerCon{max-width: 41%;}
}

@media only screen and (max-width: 1440px) {
}
 
@media only screen and (max-width: 1366px) {

.bannerCon{max-width: 42%;}
.testimonial_slider .slick-next{right: -100px;}
.testimonial_slider .slick-prev {left: -100px;}
.bannerSec:before{right: 30%;}
}
 
@media only screen and (max-width: 1280px) {

}

	
/* common css for below screen 1199 */
@media only screen and (max-width: 1199px) {
html{font-size: 14px;}

.commonSec{padding: 80px 0;}
.secTitle{font-size: 2.75rem;}
.btn{padding: 14px;}
.btn-lg{min-width: 320px;}

/* Banner */
.bannerImg{margin-top: 180px;}
.bannerTitle{font-size: 4.25rem;line-height: 1;}
.bannersubHed{font-size: 2.25rem;line-height: 1.2;}
.bannerCon{max-width: 52%;}
.bannerCon p{padding-bottom: 10px;font-size: 1.125rem;}
.bannerCon .btn {min-width: 270px;line-height: 1.4;padding: 8px 15px;}

/* about */
.commonSec.aboutSec{padding-top: 80px;}
.aboutCon p{padding: 10px 0;font-size: 1.25rem;line-height: 1.6;}

/* Work */
.workCon p{padding: 20px 5px;}

.testBox{padding: 150px 70px 50px;}

.serviceAbout p{font-size: 1rem;}

/* clientsSec  */
.clientsImg img{max-width: 12.5rem;}
.clientsList{padding-top: 70px;}

/*.footerCon{padding: 30px;}
.socialicon ul li{padding: 0 10px;}*/

.footInner{padding: 50px 0;}



}


/* common css for below screen 991 */
@media only screen and (max-width: 991px) {
p{font-size: 1rem;}
.commonSec{padding: 60px 0;}

.btn{min-width: 180px;padding:15px;font-size: 1rem;}
.bannerCon .btn{min-width: 200px;padding: 7px 15px;font-size: 1rem;line-height: 1.2;}
/* banner */
.bannerSec:before{bottom: 50px;}
.bannerImg{margin-top: 100px;}
.bannerTitle{font-size: 3rem;padding-bottom: 10px;line-height: 1.1;}
.bannersubHed {font-size: 1.5rem;padding-bottom: 10px;}
.bannerCon p{font-size: 1rem;}
.bannerCon .btn .icon {font-size: 1.5rem; padding-left: 5px;}
.bannerSec:after{top: 60px; right: -10px;}
.bannerImg:before{left: -41px; top: 70%;}

/* Header */
.siteLogo{max-width: 200px;padding: 10px 0;}
.siteLogo:before{height: 54px;width: 245px;}


/* About */
.commonSec.aboutSec{padding-top: 60px;}
.aboutCon p{font-size: 1rem;}

/* work */
.workCon p{padding: 15px 0;}

/* services */
.servicesLargBox{width: 100%;}
.serviceAbout{padding-top: 0;}
.servicesBox{padding: 10px;}
.servicesBox{width: 33.33%;}
.servicesBox .serviceImg img{max-width: 6.5rem;}
.servicesCon{padding: 20px 10px;}
.servicesName{font-size: 1.25rem;line-height: 1.8;padding-bottom: 0;}

.btn-lg{min-width: 250px;padding: 12px;}

/* testimonial */
.testBox{padding: 90px 50px 30px;}
.testInnerBox{padding: 30px;width: 100%;box-shadow: -2px 11px 23px 2px rgb(242 242 242 / 95%);}
.userPic{width: 100px;height: 100px;margin-top: -100px;}
.testAbout p{padding: 25px 10px;}
.clientsList{ padding-top: 30px;}
.testAbout .userName{padding: 0;font-size: 1.75rem;}
.testInnerBox:before{width: 126px;height: 100px;}

/* Footer */
/*.footerCon { padding: 20px;width: 100%;display: inline-block;vertical-align: middle;margin: -2px;}
.coninfo {width: 50%;float: left;padding: 15px 0 15px 30px;margin: 0;}
.coninfo .icon{top: 15px;}
.socialicon{padding-left: 0;}
.coninfo.location{margin: 0;padding-top: 0;}
.socialicon ul li{padding: 0 8px;}
.socialicon ul li:first-child{padding-left: 0;}
.icon.icon-location-1{top: 0;}*/

.footInner{padding: 35px 0;}
.footLogo{max-width: 250px;}
.coninfoInner{padding: 10px 0;}
.footHed{margin-bottom: 10px;}
.coninfoInner ul li a{line-height: 1.4;}
.socialicon ul li{display: inline-block;vertical-align: middle;padding: 5px;}

}

/* common css for below screen 767 */
@media only screen and (max-width: 767px) { 

html{font-size: 12px;}   
.commonSec{padding: 40px 0;}
.secTitle{font-size: 2.125rem;}
.btn{min-width: 165px;}

/* Header */
.menuIcon { display: inline-block; margin: 0}

.sidebar-overlay {top: 60px;}
.menuMain {padding-right: 0 ;}
.nevbar {    height: 100vh; position: fixed;left: -300px;top: 60px;bottom: 0;width: 280px;background: #fff;margin: 0;z-index: 999999;transition: all .6s ease-in-out;padding-top: 20px;}

.nevbar.slideMenu{left: 0;}
.nevbar ul li{display: block; padding: 8px 15px;}
.nevbar ul li a{color: #2a00f7;padding-left: 20px;}
.nevbar ul li:last-child{padding-left: 20px;}
.nevbar ul li a.btn {min-width: 160px;padding: 8px;}
.bodyFixed .sidebar-overlay {opacity: .5;visibility: visible;}
.bodyFixed{overflow: hidden;}

/*.headerMain.header-sticky{position: static;}*/
.headerMain.header-sticky .nevbar ul li a:after{display: none;}

/* Banner */
.bannerSec:before{right: 0;top: 55px;}
.bannerImg{margin-top: 100px;}
.bannerTitle{font-size: 3.25rem;}

.wavesLine{top: 15%;}
.commonSec.aboutSec{padding-top: 40px;}

.btn-lg{min-width: 200px;}
.clientsImg img{max-width: 11rem;}

/* Service */
.servicesList{margin: 0;display: flex; flex-wrap: wrap;}
.servicesBox .serviceImg{padding-bottom: 80%;}
/*.servicesCon p{min-height: 210px;}*/
.testInnerBox:before{left: 30px;width: 125px;height: 103px;}
.servicesName{line-height: 1.4;}
.slick-dots li{width: 8px;height: 8px;margin: 0 3px;}



.conInfo{padding: 4px 0;padding-left: 26px;}
.footHed{font-size: 1.25rem;}
.socialicon{padding-top: 0;}
.socialicon ul li{padding: 3px;}
.conInfo a .icon, .conInfo span .icon{font-size: 1.125rem;top: 6px;}
.socialicon ul li a{width: 30px;height: 30px;line-height: 34px;}


}

@media only screen and (max-width: 600px) { 

.servicesMain{padding: 0;}
.servicesMain .secTitle{padding-bottom: 0;}
.servicesBox{padding: 5px;}



}

@media only screen and (max-width: 568px) {
.commonSec{padding: 30px 0;}
.commonSec.aboutSec{padding-top: 30px;}

.bannerSec:before{position: static;}
.bannerImg{width: 100%; margin-top: 60px;}
.bannerCon{max-width: 93%;margin: auto;background: rgb(42 0 247 / 70%);padding: 20px;border-radius: 30px 0 0;top: inherit;left: 40px;bottom: 30px;transform: translateY(0);}
.bannerTitle{font-size: 2.75rem;padding-bottom: 7px;}
.bannersubHed{font-size: 1.75rem;padding-bottom: 7px;}
.bannerCon p{padding-bottom: 10px;}
.bannerCon .btn{min-width: 140px;padding: 5px 15px;font-size: 1rem;line-height: 1.2;}
.btn{min-width: 140px;padding: 7px 15px;font-size: 1rem;line-height: 1.4;}

.workCon p{padding: 5px 0;}
.servicesBox{width: 50%;}
.servicesBox .serviceImg{padding-bottom: 62%;}
.servicesCon{/*min-height: 350px;*/padding: 10px;}
.clientsList{padding-top: 20px;}


.coninfo{width: 100%;padding: 10px 0 10px 30px;}
.coninfo .icon{top: 10px;}

.testInnerBox:before{width: 90px;height: 76px;}
.testBox{padding: 90px 15px 20px;}
.testInnerBox{padding: 10px;}

.servicesBox:nth-child(even) .servicesBoxInner{border-radius: 30px 0 0 30px;}
.servicesBox:nth-child(odd) .servicesBoxInner { border-radius: 0 30px 30px 0;}


.footLogo{max-width: 200px;}
.footInner{padding: 25px 10px;}

}

/* common css for below screen 479 */
@media only screen and (max-width: 479px) {
.btn{min-width: 150px;}

.servicesBox .serviceImg{padding-bottom: 70%;}
.servicesBox .serviceImg img{max-width: 5.5rem;}
}

@media only screen and (max-width: 380px) {


}

@media only screen and (max-width: 350px) {
}

/* common css for screen size between 480 to 767 */
@media only screen and (min-width: 480px) and (max-width: 767px) {
}


/* common css for screen size between 568 to 767 */
@media only screen and (min-width: 568px) and (max-width: 767px) {
.bannerSec:after{display: none;}
}


/* common css for screen size between 600 to 767 */
@media only screen and (min-width: 600px) and (max-width: 767px) {
}


/* common css for screen size between 568 to 1199 */
@media only screen and (min-width: 568px) and (max-width: 1199px) {
.servicesBox:nth-child(3) .servicesBoxInner, .servicesBox:nth-child(6) .servicesBoxInner{border-radius: 0;}
.servicesBox:nth-child(5) .servicesBoxInner{border-radius: 30px 0 30px 0;}
.servicesBox:nth-child(4) .servicesBoxInner, .servicesBox:nth-child(7) .servicesBoxInner{border-radius: 0 30px 0 30px;}
}

/* common css for screen size between 568 to 991 */
@media only screen and (min-width: 767px) and (max-width: 991px) {

.siteLogo {
    max-width: 165px;
    padding: 10px 0;
}
.siteLogo:before {
    height: 50px;
    width: 200px;
}
.menuMain{padding-right: 0;}
.nevbar ul li{padding: 0 10px;}
.nevbar ul li a{font-size: 1rem;}
.nevbar ul li a.btn {
    color: #2a00f7;
    min-width: 150px;
    padding: 7px;
}
.nevbar ul li:last-child{padding-left: 10px;}
.bannerSec:before{right: 23%;}

}


/* common css for screen size between 1024 to 1199 */
@media only screen and (min-width: 992px) and (max-width: 1366px) {
.servicesMain p{line-height: 1.4;}

/* Header */
.siteLogo{max-width: 245px;padding: 12px 0;}
.siteLogo:before{height: 71px;width: 285px;}
.menuMain{padding-right: 0;}
.nevbar ul li{padding: 0 15px;}
.nevbar ul li:last-child{padding-left: 20px; padding-right: 0;}
.nevbar ul li a.btn{padding: 10px;}

/* Banner */
.bannerSec:after{top: 130px; right: -9px;}
.bannerImg:before{left: -70px;top: 60%;}
.bannerSec:before{right: 24%;}
}	

/* common css for screen size between 1024 to 1366 */
@media only screen and (min-width: 1024px) and (max-width: 1366px) {

.bannerSec:before{right: 20%;}

}