@media screen and (max-width: 320px), (min-device-width: 320px) and (max-device-width: 480px) and (orientation : portrait) {
/* Styles */


body{
margin:0;
padding:0;
font-family: 'Lato', sans-serif;
color:#363636;
 }
 
 h1,h2,h3,h4{
	 font-weight:400;
	 text-transform: capitalize;
	  margin:0;
	 padding:0;
	 padding-top:0.1em;
   font-family: 'PT Sans', sans-serif;
    
 }
	 
h1{
	font-size:1.6em;
    color:#1f458e;
    text-align:left;
    
    
}
 
 h2{
	font-size:1.2em;
	margin-top:10px;
    text-transform: capitalize;
	/*color:#1f458e;*/
}


h3{
	
	text-transform: capitalize;
	font-size:1.2em;
	
}


 P{
	 font-size:0.9em;
	 color:#454545;
	 line-height:23px;
	    text-align:justify;
		font-family: 'Lato', sans-serif;
 }
 

#top{
 width:100%;
 margin:0;
 /*background: url('../images/back.png') center center repeat;*/
 background-size:cover;
 display:inline-block;
 height:70px;
 clear:both;
 box-shadow: 3px 3px 5px #eee;
  }
 
 .outer{
 width:85%;
 height:auto;
 margin:0px auto; 
 text-align:center;
 padding:1%;
 
  }
  
img{
 max-width:100%;height:auto;
  
   }
  
 
 .logo{ 
 max-width:60%;
 height:auto;
 padding:0px;
 margin:10px auto;
 text-align:center;
 
 
  }
  
  .menu{
  float:right;
  margin:0;
   width:100%;
   }
   
   
      .banner{
    margin:0px auto;
   padding-bottom:0%;
   padding-top:0%;
   width:100%;
 background: url('../images/bannerback.png') ;
  height:auto;
 background-size:cover;
 -moz-background-size:cover;
  }
   
  
   .ab{
    	
 background: url('../images/about1.png') no-repeat ;
 text-align:center;
 margin:0px auto;
padding-top:8%;
padding-bottom:10%;
position:relative;
top:15px;
 background-size:cover;
 -moz-background-size:cover;
  }
  
   
   
   

  
  .service{
  width:100%;
  height:auto;
  float:left;
  text-align:center;
  margin:0px auto; 
  margin-top:20px;
   
       }
   
   
    .wrapper{
	   width:95%;
	   margin:10px auto;
	   text-align:center;
	  
   }
   
   
   .colmain{
   width:100%;
   height:auto;
   margin:20px auto;
   text-align:center;
   padding:0px;
   
       }
   
   .cols{
    width:80%;
    height:auto;
   float:left;
   margin-left:4.5%;
  margin-right:4.5%;
  text-align:center;
  margin-bottom:13px;
   
   }
   
   .bluebutton{
	   width:20%;
	   padding:7px;
	   color:#fff;
	   background-color:#1f458e;
	   font-size:0.9em;
	  
   }
   
   .btext{
	   	   color:#1f458e; 
		   text-decoration:none;
		   font-size:0.9em;  
   }
   
   .btext a:hover{
	   	   color:#1f458e;   
   }
   
   .product{
	   width:30%;
	   height:auto;
	   text-align:center;
	   margin:0px auto;
	   padding:0%;
	   
   }
   
   
   
   
 #blueback{
   width:100%;
   height:auto;
   background:url(../images/innerback.png) repeat;
   float:left;
   margin-top:0%;
   padding-bottom:0%;
   background-size:cover;
   }
   
   
   .whitebox{
   width:83%;
   height:auto;
   background-color:#fff;
    padding:10px;
   padding-bottom:1%;
   display:inline-block;
    text-align:left;
   border-top:3px solid #1f458e;
   
 
}


    .line{
   width:100%;
   height:auto;
   margin:0px auto;
   padding-bottom:10px;
   padding-top:10px;
   text-align:center;
   float:right;
    }
   
   .client{
    width:100%;
    height:auto;
   display:inline-block;
    margin:0px auto;
   text-align:center;
   margin-bottom:0px;
  padding:10px;
   margin-right:10px;
    }
   
   
   .ip{
	   width:30%;
	   display:inline-block;
	   margin-right:10px;
	   float:left;
	   margin-bottom:5px;
   }
	 
   
   
   .wrap{
	   width:95%;
	   float:left;
	   text-align:center;
	   margin:0px auto;
	    position:relative;
	  left:8%;
   }
   
   
   
   
    .footer{
   width:100%;
   height:auto;
   background-color:#31353d;
   float:left;  
      
    }
     .copy{
   width:100%;
   height:auto;
   background-color:#262a32;
   float:left;  
   padding-top:5px; 
   padding-bottom:5px;
   color:#777a8b;
 text-decoration:none;
 font-size:0.8em;
 text-align:center;  
    }
 
 
 .icons{
 float:left;
 padding:3px; 
 margin-top:8px;  
  }
  
   .footouter{
		width:90%;
		height:auto;
		margin:0px auto;
		text-align:center;
	}
   
 .box,.fab,.traf{
 width:60%;
 float:left;
 height:auto;
 color:#ccc;

   }
   
   .fab{
	   width:70%;
	    
	   
		
   }
   
   .traf{
	   width:80%;
	  
   }
 
 
   .box h3,.fab h3,.traf h3 {
	 
	 text-transform:uppercase; 
	 margin:0;
	 padding:0;
	  color:#fff;
      font-size:1.0em;
    text-align:left;
 }
   
  
   .cone{
	   float:left;width:80%;
   }
   
   
   .ctwo{
	   float:right;width:96%;background-color:#ebebeb;padding-right:10px;
   }
			
    .center{
	 float:left;position:relative;left:7%;margin-right:15px;
   }
  
 .serback{
	   
	   width:90%;
	   float:left;
	   margin:0;
	   padding:0;
	   height:auto;
	    padding:0%;
	   margin:1.5%;
	    border-top:1px solid #1f458e;;
		float:left;
   }
   
   

}
@media screen and (min-width: 320px) and (max-width: 480px), (min-device-width: 320px) and
(max-device-width: 480px) and (orientation : landscape) {

#top{
 width:100%;
 margin:0;
 /*background: url('../images/back.png') center center repeat;*/
 background-size:cover;
 display:inline-block;
 height:70px;
 clear:both;
 box-shadow: 3px 3px 5px #eee;
  }
 
 .outer{
 width:85%;
 height:auto;
 margin:0px auto; 
 text-align:center;
 padding:1%;
 
  }
  
img{
 max-width:100%;height:auto;
  
   }
  
 
 .logo{ 
 max-width:60%;
 height:auto;
 padding:0px;
 margin:10px auto;
 text-align:center;
 
 
  }
  
  .menu{
  float:right;
  margin:0;
   width:100%;
   }
   
   
      .banner{
    margin:0px auto;
   padding-bottom:0%;
   padding-top:0%;
   width:100%;
 background: url('../images/bannerback.png') ;
  height:auto;
 background-size:cover;
 -moz-background-size:cover;
  }
   
  
   .ab{
    	
 background: url('../images/about1.png') no-repeat ;
 text-align:center;
 margin:0px auto;
padding-top:8%;
padding-bottom:10%;
position:relative;
top:15px;
 background-size:cover;
 -moz-background-size:cover;
  }
  
   
   
   

  
  .service{
  width:100%;
  height:auto;
  float:left;
  text-align:center;
  margin:0px auto; 
  margin-top:20px;
   
       }
   
   
    .wrapper{
	   width:95%;
	   margin:10px auto;
	   text-align:center;
	  
   }
   
   
   .colmain{
   width:100%;
   height:auto;
   margin:20px auto;
   text-align:center;
   padding:0px;
   
       }
   
   .cols{
    width:80%;
    height:auto;
   float:left;
   margin-left:4.5%;
  margin-right:4.5%;
  text-align:center;
  margin-bottom:13px;
   
   }
   
   .bluebutton{
	   width:20%;
	   padding:7px;
	   color:#fff;
	   background-color:#1f458e;
	   font-size:0.9em;
	  
   }
   
   .btext{
	   	   color:#1f458e; 
		   text-decoration:none;
		   font-size:0.9em;  
   }
   
   .btext a:hover{
	   	   color:#1f458e;   
   }
   
   .product{
	   width:30%;
	   height:auto;
	   text-align:center;
	   margin:0px auto;
	   padding:0%;
	   
   }
   
   
   
   
 #blueback{
   width:100%;
   height:auto;
   background:url(../images/innerback.png) repeat;
   float:left;
   margin-top:0%;
   padding-bottom:0%;
   background-size:cover;
   }
   
   
   .whitebox{
   width:83%;
   height:auto;
   background-color:#fff;
    padding:10px;
   padding-bottom:1%;
   display:inline-block;
    text-align:left;
   border-top:3px solid #1f458e;
   
 
}


    .line{
   width:100%;
   height:auto;
   margin:0px auto;
   padding-bottom:10px;
   padding-top:10px;
   text-align:center;
   float:right;
    }
   
   .client{
    width:100%;
    height:auto;
   display:inline-block;
    margin:0px auto;
   text-align:center;
   margin-bottom:0px;
  padding:10px;
   margin-right:10px;
    }
   
   
   .ip{
	   width:30%;
	   display:inline-block;
	   margin-right:10px;
	   float:left;
	   margin-bottom:5px;
   }
	 
   
   
   .wrap{
	   width:95%;
	   float:left;
	   text-align:center;
	   margin:0px auto;
	    position:relative;
	  left:8%;
   }
   
   
   
   
    .footer{
   width:100%;
   height:auto;
   background-color:#31353d;
   float:left;  
      
    }
     .copy{
   width:100%;
   height:auto;
   background-color:#262a32;
   float:left;  
   padding-top:5px; 
   padding-bottom:5px;
   color:#777a8b;
 text-decoration:none;
 font-size:0.8em;
 text-align:center;  
    }
 
 
 .icons{
 float:left;
 padding:3px; 
 margin-top:8px;  
  }
  
   .footouter{
		width:90%;
		height:auto;
		margin:0px auto;
		text-align:center;
	}
   
 .box,.fab,.traf{
 width:60%;
 float:left;
 height:auto;
 color:#ccc;

   }
   
   .fab{
	   width:70%;
	    
	   
		
   }
   
   .traf{
	   width:80%;
	  
   }
 
 
   .box h3,.fab h3,.traf h3 {
	 
	 text-transform:uppercase; 
	 margin:0;
	 padding:0;
	  color:#fff;
      font-size:1.0em;
    text-align:left;
 }
   
  
   .cone{
	   float:left;width:80%;
   }
   
   
   .ctwo{
	   float:right;width:96%;background-color:#ebebeb;padding-right:10px;
   }
			
    .center{
	 float:left;position:relative;left:7%;margin-right:15px;
   }
  
 .serback{
	   
	   width:90%;
	   float:left;
	   margin:0;
	   padding:0;
	   height:auto;
	    padding:0%;
	   margin:1.5%;
	    border-top:1px solid #1f458e;;
		float:left;
   }


}