/* ===========================
   ======= Body style ======== 
   =========================== */
   
body {
	background-image: url('img/bg.png');
	color: #000305;
	font-size: 90%; /* Base font size: 14px */
	font-family: 'Trebuchet MS', Trebuchet, 'Lucida Sans Unicode', 'Lucida Grande', 'Lucida Sans', Arial, sans-serif;
	line-height: 1.429;
	margin: 0;
	padding: 0;
	text-align: left;
	}
	
.body {
	clear: both; 
	margin: 0 auto; 
	width: 90%;
}
.mainHeader,.mainContent,.mainFooter{
	display:inline-block;
	width:100%;
}

/* ===========================
   ========= Headings ======== 
   =========================== */
h1 {font-size: 1.429em}
h2 {font-size: 1.429em}	/* 22px */
h3 {font-size: 1.286em}	/* 20px */
h4 {font-size: 1.286em}	/* 18px */
h5 {font-size: 1.143em}	/* 16px */
h6 {font-size: 1em}		/* 14px */

h1,h2,h3{
	background: #008daa;
	padding-left:20px;
	color:#fff;
	font-weight:normal;
	margin-bottom:0;
	box-shadow: 2px 2px 2px #333333;
}

/* ===========================
   ======= Anchor style ====== 
   =========================== */
a {
	outline: 0;
	}

a img {
	border: 0px; 
	text-decoration: none;
}

a:link, a:visited {
	color: #CF5C3F;
	padding: 0 1px;
	text-decoration: none;
}

a:hover, a:active {
	background-color: #CF5C3F;
	color: #fff;
	text-decoration: none;
}

/* ===========================
   ===== Main Navigation ===== 
   =========================== */

#logosection2 {
   display:none;
}
#logo1{
	display:none;
}
.mainHeader nav {
	background: #383838;
	font-size: 1.143em;
	height: 30px;
	line-height: 20px;
	margin: 0 auto 10px auto;
	text-align: center;
	border-radius: 5px;
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
}
	
.mainHeader nav ul {
	list-style: none; 
	margin: 0 auto;
}

.mainHeader nav ul li {
	float: left; 
	display: inline; 
}

.mainHeader nav ul li.spec {
	float: right;
	display: inline-block;
	height: 20px;
	padding: 5px 23px 5px 35px;
	color: #fff;
	font-weight:bold;
	background: url("images/phone-icon.png") left center no-repeat;
}
	
.mainHeader nav a:link, .mainHeader nav a:visited {
	color: #fff;
	display: inline-block;
	height: 20px;
	padding: 5px 15px;
	text-decoration: none;
}
.mainHeader nav a:hover, .mainHeader nav a:active,
.mainHeader nav .active a:link, .mainHeader nav .active a:visited {
	background: #008daa;
	color: #fff;
}
.mainHeader nav a:hover{
	text-shadow: 2px 2px #333333;
}	
.mainHeader nav li a {
	border-right: 1px solid #ffffff;
}
.mainHeader #logosection{
	display:inline-block;
	width:100%;
}
.mainHeader #logosection .logoBlocks{
	display:inline-block;
}
.mainHeader #logosection #logo {
	text-align:left;
	width:23%;
}
.mainHeader #logosection #mid {
	text-align:center;
	width:36%;
}
.mainHeader #logosection #mid img{
	width:95%;
}
.mainHeader #logosection #right {
	text-align:right;
	width:39%;
}
.mainHeader #logosection #right img{
	width:98%;
}
.mainHeader #logosection #logo img {
	width: 80%;
	height: auto;
}
#logosection a:hover{
	background:none;
}
/* ===========================
   ======= Content Area ====== 
   =========================== */
.block{
	width:100%;
	display:inline-block;
	float:left;
}
.block-h{
	width:48.5%;
	display:inline-block;
}
.block-main{
	width:70%;
	display:inline-block;
}
.sub-block-h{
	width:48.5%;
	display:inline-block;
}
.sub-block-custm1{
	width:70%;
	display:inline-block;
}
.sub-block-custm3{
	width:25%;
	display:inline-block;
	padding-top:20px;
}
.sub-block-custom4{
	width:100%;
	display:inline-block;
}

.ord-left{
	float:left;
}
.ord-right{
	float:right;
}
.mainContent p{
	color:#033333;
}
p.title{
	background:#f2f2f2;
	font-size:16px;
	padding: 2px 0 2px 2%;
	box-shadow: 2px 2px 2px #333333;
	display:inline-block;
	width:98%;
}
#line{
	width:100%;
	float:left;
	clear:both;
}
#line2{
	width:100%;
	float:left;
	clear:both;
	height:4px;
	background:#008daa
}
/* ====== About US ====== */
#card {
	width:100%;
	height:auto;
}
/* ====== Tables Repire and Installation ====== */
table.service{
	width:100%;
	background:#324566;
}
table.service thead th{
	color:#ffffff;
}
table.service tbody td{
	background:#ffffff;
}
table.service tbody td img{
	display:inline-block;
	margin-top:4px;
}
table.service tbody td p{
	margin:0;
}

table .tmb{
	display:inline-block;
	width:25px;
	height:25px;
	background: url("../images/search.png") center center no-repeat;
	cursor:pointer;
	margin-left:10px;
}
#allBrands{
	margin-top:0 !important;
	box-shadow:2px 2px 2px #333333;
	border: 3px double #324566;
	width: 99%;
}
/* ====== Clients ====== */
#clients span.clName{
	color:#324566;
	font-weight:bold;
}
#clients span.serviceType{

}
#clients span.clMess{
	color:#324566;
	font-style:italic;
	font-weight:bold;
	font-size:16px;
}
#sep{
		height:3px;
		width:100%;
		border-top:1px solid #324566;
		border-bottom:1px solid #324566;
}
/* ====== Payment ====== */
#payment img{
	float:left;
	margin-right:7px;
	margin-bottom:5px;
}
/* ====== New Machine ====== */
#new-app img{
	float:left;
	margin-right:7px;
	margin-bottom:5px;
}
/* ====== Contact form ====== */
#contact-phone{
	height:26px;
	line-height:26px;
	padding-left:35px;
	background: url("images/phone-icon-bk.png") left center no-repeat;
}
form input[type="text"],form textarea,form label,form p,form img,form span{
	display:inline-block;
}
form p{
	width:100%;
	margin-top:0;
}
form label{
	width:15%;
	font-weight:bold;
}
form label.labText{
	width:100%;
}
form label textarea{
 vertical-align: top;
}
form input[type="text"],form textarea{
	border: 1px solid #333333;
	-moz-box-shadow: 4px 4px 6px -3px #333333 inset;
   -webkit-box-shadow: 4px 4px 6px -3px #333333 inset;
   box-shadow: 4px 4px 6px -3px #333333 inset;
   padding:3px 7px;
   color:#324566;
   font-weight:bold;
}
form span#send{
	text-indent:-99999px;
	overflow:hidden;
	background: url("images/send.jpg") center center no-repeat;
	display:inline-block;
	width:74px;
	height:28px;
	border-radius:4px;
	cursor:pointer;
}
form span#vvv{
	background: #ffff0a;
	display:inline-block;
	width:105px;
	height:28px;
	line-height:28px;
	border-radius:4px 4px;
	margin-left:15px;
	border:1px solid #333;
	font-weight:bold;
	text-align:center;
	font-size:16px;
}
a.partners {
	text-decoration: none;
	background:none;
	margin-top:15px;
	display:inline-block
}
/* ====== Footer ====== */
.mainFooter span{
	font-weight:bold;
}
.mainFooter a{
	font-weight:bold;
	color:#002576;
	background: url("https://static.licdn.com/scds/common/u/img/webpromo/btn_in_20x15.png") no-repeat left center;
	padding-left:20px;
}
/* ===========================
   ====== Media Queries ====== 
   =========================== */
@media only screen and (max-width : 1000px)
{
	.mainHeader nav ul li.spec {
		font-size:70%;
	}
	.block-h{
		width:100%;
	}
	.mainHeader ul li a{
		font-size:70%;
	}
	
}
   
   
@media only screen and (max-width : 850px)
{
	#logosection2 {
	   display:inline-block;
	   width:100%;
	}
	#logosection2 .logoBlocks{
	   width:49%;
	   float:left;
	}
	#logosection2 #mid1{
	   float:left;
	}
	#logosection2 #right2{
	   float:right;
	}
	#logosection {
	   display:none !important;
	}
	#logo1{
		display:inline-block !important;
		float:left;
		width:40%;
		margin-top:30px;
	}
	#logo1 a{
		background:none;
	}
	.body {
		clear: both; 
		margin: 0 auto; 
		width: 90%;
		font-size: 90%;
	}
	
	.mainHeader nav {
		background: #383838;
		font-size: 1.143em;
		height: 150px;
		line-height: 15px;
		margin-bottom: 7px;
		border-radius: 5px;
		-moz-border-radius: 5px;
		-webkit-border-radius: 5px;
		width:50%;
		float:right;
	}
		
	.mainHeader nav ul {
		list-style: none; 
		margin: 0 auto;
		padding-left: 0;
	}
	
	.mainHeader nav li {
		margin-left: 0 auto;
		width: 100%;
	}
	
	.mainHeader nav ul li.spec {
		display:none !important;
	}
	
	.mainHeader nav a:link, .mainHeader nav a:visited {
		color: #FFF;
		display: block;
		height: 15px;
		padding: 5px 0;
		text-decoration: none;
	}
	
	.mainHeader nav a:active,
	.mainHeader nav .active a:link, .mainHeader nav .active a:visited {
		background: #008daa;
		color: #fff;
		text-shadow: none !important;
	}
		
	.mainHeader nav li a {
		border-right: 1px solid #ffffff;
		font-size:60%;
	}
	
	.mainHeader img {
		width: 100%;
		height: auto;
		margin-bottom: 3%;
	}
	#cardService{
		width:100%;
		text-align:center;
		float:none;
	}
	#cardService #card{
		width:50%;
	}
	.sub-block-custm1{
		width:100%;
	}
	form label {
		font-weight: bold;
		width: 40%;
		margin-bottom:7px;
	}
}

@media only screen and (max-width : 550px)
{
	#logosection2 {
	   display:none !important;
	}
	#logosection {
	   display:inline-block !important;
	   text-align:center;
	}
	#logo1{
		display:none !important;
	}
	.body {
		clear: both; 
		margin: 0 auto; 
		width: 90%;
		font-size: 90%;
	}
	
	.mainHeader nav {
		background: #383838;
		font-size: 1.143em;
		height: 180px;
		line-height: 20px;
		margin-bottom: 7px;
		border-radius: 5px;
		-moz-border-radius: 5px;
		-webkit-border-radius: 5px;
		width:100%;
	}
		
	.mainHeader nav ul {
		list-style: none; 
		margin: 0 auto;
		padding-left: 0;
	}
	
	.mainHeader nav li {
		margin-left: 0 auto;
		width: 100%;
	}
	
	.mainHeader nav ul li.spec {
		display:none !important;
	}
	
	.mainHeader nav a:link, .mainHeader nav a:visited {
		color: #FFF;
		display: block;
		height: 20px;
		padding: 5px 0;
		text-decoration: none;
	}
	
	.mainHeader nav a:active,
	.mainHeader nav .active a:link, .mainHeader nav .active a:visited {
		background: #008daa;
		color: #fff;
		text-shadow: none !important;
	}
		
	.mainHeader nav li a {
		border-right: 1px solid #ffffff;
		font-size:100%;
	}
	
	.mainHeader img {
		width: 100%;
		height: auto;
		margin-bottom: 3%;
	}
	#cardService{
		width:99%;
		text-align:center;
		float:none;
	}
	.mainHeader #logosection #logo {
		text-align: center;
		width: 93%;
	}
	.mainHeader #logosection #mid {
		text-align: center;
		width: 93%;
	}
	.mainHeader #logosection #right {
		text-align: center;
		width: 93%;
	}
	form label {
		font-weight: bold;
		width: 30%;
		margin-bottom:7px;
	}
}