.mobileSlider{ visibility: hidden; height: 0; overflow: hidden }
@font-face {
    font-family: bebas;
    src: url(BebasNeue.otf);
}
@font-face {
    font-family: webly;
    src: url(weblysleekuil.ttf);
}

body{ margin:0; padding:0}
.mainInner_new{ max-width:1100px; margin:0 auto; min-width:auto}
.threePointMain{ margin:40px 0; height:auto}
.pic_before{display:none}
#container{ padding-bottom:0 !important }
#banner-slide{ height:auto !important}
.bjqs-wrapper{ height:auto !important; float:left !important; margin-bottom:0px !important } 
.bjqs-slide{ height:auto !important;}
ul.bjqs{ float:left !important; height:auto !important}
li.bjqs-slide{ height:auto !important}

@media only screen and (max-width: 1000px){
.slideImagecareers{ background-attachment:inherit; padding:25% 0}
}

	
@media only screen and (max-width: 768px){
    .threePointMain{ background:none}
    .bjqs-wrapper{ height:auto !important; float:left !important} 
    .bjqs-slide{ height:auto !important;}
    ul.bjqs{ float:left !important; height:auto !important}
    li.bjqs-slide{ height:auto !important}
    .boxInner span{padding:10px 20px 30px; box-sizing:border-box; font-size:17px; width:100%}
    .boxInner{ height:217px; overflow:hidden; float:left}
    .purpleBackground{ height:217px; font-size:29px}  
    .zopim{display:none !important}
    .img_width{ width:66%}	
    .logoCareers{height:40px; padding:0 10px}
    .findRole{ font-size:16px; padding:5px 10px; margin:5px 10px}
    .leftPointImg{ padding-left:20px; padding-right:0}
    .pointRow .sidePart{ width:40%}
    .pointTextInner{ padding:0 10px; box-sizing:border-box}
	.box_width{ width:66%}
    
    
    .mobileSlider{ visibility: visible; height: auto; overflow: visible }
    .mobileSlider #banner-slide-mobile{ height:500px; }
    .mobileSlider #banner-slide-mobile .bjqs-wrapper{ height:500px; width: 1100px; }
    .mobileSlider #banner-slide-mobile .bjqs-wrapper ul.bjqs{ height:500px; width: 1100px; }
    .mobileSlider #banner-slide-mobile .bjqs-wrapper ul.bjqs li{ width:100% }
    .mobileSlider #banner-slide-mobile .bjqs-wrapper ul.bjqs li .teamTestimonial{ width:100% }
    .mobileSlider #banner-slide-mobile .bjqs-wrapper ul.bjqs li .teamTestimonial .teamImg{ width:65% }
    
}

@media only screen and (min-width: 601px) and (max-width: 767px){
	.boxInner span{ height:226px; padding:30px 20px; box-sizing:border-box; width:100%}
	.purpleBackground{ height:217px; font-size:30px}  		
		
}

@media only screen and (min-width: 470px) and (max-width: 600px){
		.findRoleImages > img {  width: 450px;}
		.pointRow .sidePart{ width:100%}
		.leftPointImg{ float:none; margin:0 auto; display:table; padding:0}
		.pointTextInner{ text-align:center; padding:0 30px}
		.rightAlignText{ text-align:center}
		.pic_before{display:block}
		.pic_after{display:none}
		.boxInner{ width:100%; height:auto}
		.boxInner span{ width:100%; box-sizing:border-box; padding:15px 30px; height:auto}
		.purpleBackground{ height:auto}	
		.bjqs-wrapper{ float:left; height:0; margin-bottom:50px}
		.bjqs ul{ height:0}
		.bjqs-slide{ height:0}
	}

@media only screen and (max-width: 469px){
		.slideImagecareers{padding:50% 0; height:0}
		.logoCareers{height:40px; padding:0 10px}
		.pointTextInner h1{ font-size:32px} 
		.findRole{ font-size:16px; padding:5px 10px; margin:5px 10px}
		.findRoleImages img {  width: 100%;}
		.pointRow .sidePart{ width:100%}
		.leftPointImg{ float:none; margin:0 auto; display:table; padding:0}
		.pointTextInner{ text-align:center; padding:0 30px}
		.rightAlignText{ text-align:center}
		.pic_before{display:block}
		.pic_after{display:none}
		.careersHeading{ font-size:56px}
		.boxInner{ width:100%; height:auto}
		.boxInner span{ width:100%; box-sizing:border-box; padding:15px 30px}
		.purpleBackground{ height:auto}		
		.teamTestimonial{ width:100%}
		
}