@import url('https://fonts.googleapis.com/css?family=Oswald:200,300,400,500,600,700');
@import url('https://fonts.googleapis.com/css?family=Raleway:200,300,400,500,600,700,800');
@import url('https://fonts.googleapis.com/css?family=Electrolize');
@import url('https://fonts.googleapis.com/css?family=Coda:400,800|Michroma|PT+Sans:400,400i,700,700i|Squada+One');
@import url('https://fonts.googleapis.com/css?family=Roboto:300,400,500,700');
* {
   margin: 0;
   /*font-family: 'Raleway', sans-serif;
    font-family: 'Electrolize', sans-serif;
    font-family: 'PT Sans', sans-serif;*/
    font-family: 'Roboto', sans-serif;
}
p {
   line-height: 1.5;
   font-weight: 400;
}
/* Header Style */
.banner{
   background: url(../images/innerpage/about-banner.jpg);
}
/* About Style */
.about_div{
   width: 90%;
   margin: auto;
   padding: 50px 0;
   display: flex;
   justify-content: space-between;
   margin-top: 50px;
   border-bottom: 2px solid #959595;
}
.about_div img{
   width: 30%;
   height: 100%;
}
.abt_cont{
   width: 60%;
}
.heading {
   text-align: left;
   margin-bottom: 20px;
   font-family: 'Oswald', sans-serif;
   color: #005386;
   font-weight: 400;
   font-size: 2.5em;
}
/* About Style */
.main_cont{
   width: 90%;
   margin: auto;
   margin-top: 100px;
   display: flex;
   justify-content: space-between;
}
.mission_div{
   width: 45%;
   display: flex;
   justify-content: space-between;
}
.mission_div img,.vision_cont img{
   width: 40%;
   height: 100%;
}
.mission_cont,.vision_cont{
   width: 55%;
}
.mission_contp{
   text-align: justify;
}
.vision_cont{
   text-align: justify;
}
.vision_cont h1{
   text-align: right;
}
/* Why JVS Style */
.why_div{
   width: 100%;
   padding: 50px 0;
   margin-top: 100px;
   background-color: #005386;
}
.why_div h1{
   text-align: center;
   color: #fff;
}
.why_sec{
   display: flex;
   justify-content: space-around;
}
.why_cont{
   width: 10%;
   padding: 30px;
   border: 1px solid #fff;
   margin-top: 30px;
}
.why_cont img{
   width: 50%;
   margin: 0 auto;
   display: block;
}
.why_cont p{
   color: #fff;
   margin-top: 20px;
}
.line{
   width: 25px;
   height: 2px;
   background-color: #fff;
   margin: auto 20px;
}
/* Success Style */
.proj_div{
   width: 50%;
   margin: auto;
   display: flex;
   justify-content: space-between;
   padding: 100px 0;
}
.proj_cont h1{
   margin-bottom: 0;
   font-size: 4em;
}
.proj_cont p{
   color: #8a8a8a;
   font-size: 15px;
   text-transform: uppercase;
   font-weight: 500;
}
/* Industry Style */
.industry_div{
   width: 95%;
   padding-right: 5%;
   background-color: #f2f2f2;
   position: relative;
   height: 450px;
}
.industry_div img{
   position: absolute;
   bottom: 0;
}
.industry_div div{
   width: 50%;
   margin: auto;
   float: right;
}
.industry_div h1{
   margin-top: 50px;
   text-transform: uppercase;
}
.industry_div ul{
   padding: 0;
   list-style: none;
   line-height: 2;
   font-size: 1.2em;
   color: #005386;
   text-transform: uppercase;
}
.industry_div ul li::before{
   content: '\f00c';
   font-family: FontAwesome;
   margin-right: 10px;
   color: #005386;
}
/* Media Query */
@media only screen and (max-width: 1070px){
   .industry_div div{
      width: 35%;
   }
}
@media only screen and (max-width: 960px){
   .about_div{
      display: block;
   }   
   .about_div img {
       float: left;
       margin-right: 30px;
   }
   .abt_cont {
       width: 100%;
   }
   .abt_cont{
      text-align: justify;
   }
   .main_cont{
      display: block;
   }
   .mission_div{
      width: 100%;
   }
   .line{
      display: none;
   }
   .why_sec{
      flex-wrap: wrap;
   }
   .why_cont{
      width: 20%;
   }
   .proj_div{
      width: 90%;
   }
   .industry_div{
      height: auto;
      padding: 30px 0;
      margin: auto;
      width: 90%;
   }
   .industry_div img{
      width: 50%;
      margin: auto;
      display: block;
      position: relative;
   }
   .industry_div div{
      float: none;
      width: 90%;
      margin: auto;
      text-align: center;
   }
   .industry_div h1{
      text-align: center;
   }
}
@media only screen and (max-width: 768px){
   .about_div img{
      width: 45%;
   }
   .why_cont{
      width: 35%;
   }
}
@media only screen and (max-width: 500px){
   .about_div img{
      width: 45%;
   }
   .mission_div img, .vision_cont img{
      display: none;
   }
   .mission_cont, .vision_cont{
      width: 100%;
   }
   .mission_cont{
      margin-bottom: 30px;
   }
   .vision_cont h1{
      text-align: left;
   }
   .why_cont{
      width: 70%;
   }
   .proj_cont h1{
      font-size: 2em;
   }
   .proj_cont p span{
      font-size: 1.5em;
   }
   .industry_div img{
      width: 90%;
   }
}