﻿@media only screen and (max-width : 800px) {
	.logo { float: left; padding-left: 0px; font-size:18px; }
	.nav { right:0px; width:100%;}
	.menu-top-res { float: none; margin: 10px 15px 10px 0px; clear: both; text-align: right; display: block; z-index:9999 }
	.menu-top-res a { font-size: 19px !important; color: #39abd0; text-decoration: none; font-weight: bold; }
	ul.topnav { background: rgba(0, 0,0,0.9); }
	.nav li a { border-bottom:1px solid rgba(255, 255,255,0.1); padding: 10px 15px;  }
	.service-box img { float: none!important; width: 50%!important; }
	.service-content { float: none!important; width: 100%!important; }
	.service-content ul { font-size: 14px!important; }
	.services .servImg { height:450px;}
	.nav li a::before { bottom: -1px; width:100%;  background:rgba(255, 255,255,0.4);}

.punchline {     font-size: 20px;     line-height: 24px;    top: 130px; }
.punchline .small { font-size:16px; padding:0 40px; display:block}
.home { padding:20px 0px; }
.home h2 {
     font-size: 16px;
     line-height: 24px;
	 padding:0;
}

.home p {
    color: #8a8c8e;
    font-size: 13px;
    font-weight: 500;
    line-height: 18px;
    padding-bottom: 20px;
 }

#services .wrap { max-width:100%}
#services li .more {     font-size: 13px;    line-height: 18px; }
.applications { padding:0 20px 40px}
}
@media only screen and (max-width : 1200px) {
.services li .more { line-height:16px; font-size:13px;}
}

@media only screen and (max-width : 767px) {
ul.topnav li { float: left; margin-right: 0!important; }
.service-box { margin-bottom: 40px !important; text-align: left; background: #fff; padding: 15px; }
.btn1 { margin: 0 0 20px 0!important; width: 45%!important; }
.btn2 { width: 45%!important; }
#owl-demo .item { height:300px;}
video{ min-height:300px;}
.top-header-frame {padding:20px 20px; text-align:left; font-size:24px; float:left;}
.inner-header-frame #owl-demo .item { height:300px;}
.services-span h2 { font-size:28px; padding-top: 30px;}
.services h2 { font-size:28px; }
.aboutus h2 { font-size:28px; margin:0px; padding:0px;}
.services { padding:20px 0px 0}
.services .servImg { height:300px;}
.applications h2 { padding:0px; margin:0px; font-size:28px; }
.txt { width:100%; font-size:16px;}
.nav { top:70px; }

#box1 li {float:none;}
#box2 li {float:none;}
#form input{margin-bottom:20px;}
#expertise h2 {  font-size: 32px;    line-height: 30px;}
#services h2 {  font-size: 28px;    line-height: 30px;}
#expertise h4 {   font-size: 24px}
.serv-block1 {margin-bottom:20px;}
.serv-block2 {margin-bottom:20px;}
#expertise .stxt { font-size: 24px; }

.applications .contain { width:100%}
.applications li { padding: 20px 0;}
#border img { max-width:100%; margin:0px; }
.aboutus h3 { font-size: 16px; line-height: 24px;}
.aboutus {
    color: #c9c9c9;
    font-size: 13px;
    line-height: 18px;
}
}

@media only screen 
  and (min-device-width: 768px) 
  and (max-device-width: 1024px) {
	  
	#box1 p:last-child {padding-top: 70px; }  
	
	#box1 li {width: 358px;}
	
	#box2 li {width: 358px;}
	
	#form input{margin-bottom:20px;}
	
	#serv-block1 #serv-text2 {min-height: 192px; margin-bottom:20px;}
	
	#serv-block2 #serv-text2 {min-height: 170px;}
	
	#serv-block3 #serv-text2 {min-height: 160px;}
	.applications li .h3 { font-size:21px;}
	.applications li .more li { font-size: 15px;    line-height: 21px;background:rgba(0, 0, 0, 0) url("../images/bullet.png") no-repeat scroll 0 8px}

	
	
	  
  }