

@media only screen and (max-width:1300px){

  .wrapper{width:90%}
  .about-section::before{ background-size:83%;}
  .about-section{ padding-top: 70px;}
  .about-section h3, .about-section p, .what-we-do h3, .achievements h3, .image-gallery h3 { margin-bottom: 20px;}
  h3{ font-size: 30px;}
  .what-we-do li .box .text strong, .achievements .box2 strong{ font-size: 25px;}
  .what-we-do li .box .text br{ display: none; padding-right: 20px;}
  .achievements { margin-top: 20px;}
  .image-gallery { margin-top: 50px;}
  .footer-grey { margin-top: 80px;}

}

@media only screen and (max-width:1200px){
  .about-section::before{ background-size:66%;}
}


@media only screen and (max-width:1023px){
  .wrapper{width:95%}
  .about-section::before{ display: none;}
  .about-section{ padding-left: 0;}
  .about-section p img{ display: block;}
  .block { width:32.33%; margin-bottom: 20px;}
  .submitclass {width:32.33%;}
  .tagline .text1{ font-size: 18px;}
  .tagline .text2{ font-size: 35px;}

}

@media only screen and (max-width:767px){  
  .about-section { padding-top: 25px;}
  .about-section h3, .about-section p, .what-we-do h3, .achievements h3, .image-gallery h3 {margin-bottom: 10px;}
h3{ font-size: 25px;}

.what-we-do li .box .text strong, .achievements .box2 strong{ font-size: 20px;}
  
}

@media only screen and (max-width:700px){
  .block { width: 48%; margin: 5px 1%;}
  .submitclass { width:100%}
  .what-we-do li .box .text span, .footer-grey p { font-size: 14px; line-height: 1.5;}
p{ font-size: 14px;}
.achievements .box2 span { font-size: 14px;}

.tagline .text1{ font-size: 16px;}
.tagline .text2{ font-size: 30px; line-height: 1;}
.tagline .text2:before{height: 50px;}


  }

@media only screen and (max-width:500px){
  header { padding: 0 10px;}
  .form-section { padding: 0;}
  .about-section{ padding: 15px;}

  .wrapper{width:100%}
  header{height: 65px;}
  .logo-bb{ width:30%}
  .logo-bb img{width:100%}

  .logo-nss{ width:50%}
  .logo-nss img{width:100%}

  .tagline .text2 { font-size: 24px;}
  .what-we-do{ padding: 15px;}
  .what-we-do ul{ display: block;}
  .what-we-do li { width: 100%; float: left; margin: 15px 0 30px 0;}
  .what-we-do li .box .icon{ box-shadow: none; text-align: center;}
  .what-we-do li .box .text{ margin-top: 0;}
  .what-we-do li .box .icon img{width:60%; display: inline-block;}
  .what-we-do li .box .text strong, .what-we-do li .box .text span{ text-align: center;}
  .what-we-do li:after{ right: 0; margin: 0 auto;}
  .what-we-do li .box .text { text-align: center;}
  .what-we-do li:after{ bottom: -20px;}
  .about-section h3 { text-align: center;}
  .about-section p{ text-align: center;}
  .about-section p img { display: inline-block; width: 100%;}
  .group-pic2 { margin-top: 10px;}
  .achievements{ padding: 0 20px;}
  .image-gallery{ padding: 20px; margin-top: 30px;}
  .footer-grey { padding: 20px;}

  footer .copy{ width: 100%; float: left; text-align: center;}
  footer .copy p{ text-align: center;}
  footer .social-icon { text-align: center; float: left; width:100%; margin-top: 10px;}
  footer .social-icon li{ float: none; display: inline-block;}

  footer { padding: 10px 0;}
  .footer-grey { margin-top: 60px;}

  img.desktop{display: none;}
img.mobile{display: block;}
.tagline{ display: none;}

}

@media only screen and (max-width:414px){
  .block{width:98%; border:1px solid #ececec; }
  .block:after{ display: none;}
  .tagline .text2 {font-size: 20px;}
  .tagline .text2:before { height: 40px;}
  form { width:98%; margin: 0 1%;}
  .achievements .box2 { padding: 5px;}


 
}