


.section {
  text-align: center;
}


  .section {
    padding: 12rem 0;
  }
  
  .hero {
	padding:0;
	background-image: url(../images_new/header_bg.jpg);
	background-size:cover;
	border-bottom:10px solid #c0c0c0;
  }

  .heading {
	  margin-top:65%;
}

  .heading h1 {
	  font-family: 'Open Sans', sans-serif;
	  font-size:4rem;
	  text-align:left;
	  line-height:45px;
	  float:left;
  }

  .heading h2 {
	  font-family: 'Open Sans', sans-serif;
	  font-size:2.2rem;
	  text-align:left;
	  line-height:32px;
	  float:left;
	  font-style:italic;
  }


  .logo {
	  padding-top:10%;
	  text-align:left;
	  float:left;
  }

  .benefits h2 {
	padding-bottom:30px;
}

  .benefits {
	  padding:10rem;
	  background-image: url(../images_new/benefits_bg.jpg);
	  background-size:cover;
	  border-bottom:10px solid #c0c0c0;
	  text-align:left;
	  font-family: 'Open Sans', sans-serif;
	  font-size:21px;
  }
  
  .benefits b {
	  color:rgba(0,0,0,1.00);
	  font-family: 'Open Sans', sans-serif;
	  padding-bottom:20px;
	  font-size:27px;
  }
  

  .speed {
	  background-color:#ffffff;
	  color:#000000;
  }
  
  .speed h2 {
	  color:#000000;
	  font-family: 'Open Sans', sans-serif;
	  padding-bottom:20px;
  }
  
  hr {
	  background-color: #cccccc; height: 1px; border: 0;
	  width:50%;
  }
  
   .speed img { 
	margin:5px;
	border-radius:7px;

   }
   
   .platforms h2{
	  color:rgba(0,0,0,1.00);	  
	  font-family: 'Open Sans', sans-serif;
	  padding:0 0 100px 0;
	}
	
	.platforms h3{
	  color:rgba(0,0,0,1.00);	  
	  font-family: 'Open Sans', sans-serif;
	  font-size:22px;
	  padding-top:5%;
	  line-height:35px;
	}
  
  	.platforms h4{
	  color:rgba(0,0,0,1.00);	  
	  font-family: 'Open Sans', sans-serif;
	  font-size:22px;
	}
  
     .platforms li { 
  	  font-family: 'Open Sans', sans-serif;
	  font-size:18px;
	  list-style:inside;
	  padding-left:20px;
   }
   
   .platforms img {
	   padding-bottom:5%;
   }
   
   .contact {
	   background-color:#ecedee;
	   text-align:left;
   }

   .contact h2 {
	  color:rgba(0,0,0,1.00);	  
	  font-family: 'Open Sans', sans-serif;
	  padding:0 0 30px 0;
   }

   .contact h3 {
	  color:rgba(0,0,0,1.00);	  
	  font-family: 'Open Sans', sans-serif;
	  padding:0;
	  font-size:22px;
	  font-weight:400;
   }

   .contact p { 
  	  font-family: 'Open Sans', sans-serif;
	  font-size:18px;
   }
   
   .contact input.button-primary {
      background-color:#565d67 !important;
	  border:none !important;
	  border-radius:0;
	  font-size:18px;
	  float:right;
	  font-family: 'Open Sans', sans-serif;
	  padding:5px 25px;
   }
   
   .contact input, .contact textarea {
	  font-family: 'Open Sans', sans-serif;
	  font-size:18px;
	  height:50px;
	  padding:10px 12px;
   }
   
   
   .footer {
	  padding:2rem 0 0.5rem 0;
	  background-color:#565d67;
	  color:#ffffff;
	  font-family: 'Open Sans', sans-serif;
	  font-size:18px;
	  text-align:left;
   }
   
   .footer p {
	   line-height:47px;
   }
   
   .footer img {
	   float:right;
   }
   
  

@media (max-width: 1200px) {
	
	  .heading{
		  margin-top:25%;
	  }

	  .benefits{
	 	 padding:5rem;
	  }

	  .benefits img{
	 	 margin-top:3rem;
	  }

}
  
  


@media (max-width: 1000px) {
	
	  .heading h1 {
	  font-size:3rem;
	  text-align:left;
	  line-height:42px;
	  }

	  .benefits{
	 	 padding:2rem;
	  }
	
}


@media (max-width: 850px) {
	
	  .logo {
		  float:none;
		  padding-top:5%;
	  }
	
	  .heading {
	  margin-top:5%;
	  }
	  
	  .hero .seven img {
		  width:80%;
		  margin:0 10%;
	  }
	  
	  .benefits{
	 	 padding:2rem;
		 text-align:center;
	  }
	  
	   .benefits li{
		   padding-left:0;
	   }
	   
	   .speed {
		   padding:3rem;
	   }

	  .platforms {
		  padding:2rem;
		  text-align:center;
	  }

	  .platforms h2 {
		  padding:0;
	  }

	 .platforms h3{
		 font-size:25px;
	 }

	 .platforms h4{
		 font-size:22px;
	 }

	.contact {
		padding:2rem;
	}

	.flex { display: flex; flex-direction: column; }
    .first { order: 2; margin:0;}
	.first h3 {padding-top:0 !important;}
    .second { order: 1;  padding-bottom:0 !important; margin-bottom:0 !important; height:auto; overflow:hidden;}
    .third {  padding-bottom:0 !important; margin-bottom:0 !important; height:auto; overflow:hidden; padding-top:50px; border-top:1px solid #D8D8D8}
	.fourth h3 {padding-top:0 !important;}

}




@media (max-width: 450px) {

	
	  .heading {
	  margin-top:5%;
	  }
	  
	  .hero .seven img {
		  width:80%;
		  margin:0 10%;
	  }

	
}