/* 
Type: CSS Document 
Created by: Jeetendra Shimpi
Email: jshimpi@gmail.com
Company: Jaal Web Systems. India.
Website: http://www.jaalsystems.com
Telephone:  +91 9821554195
*/

/* -------------- General Styles ---------------- */

*{margin: 0; padding: 0;}
body { width: 100%; background: #fff url(../images/body-bg.jpg) no-repeat top center; font: 12px arial;}
img{border: 0;}
ul{list-style-type: none;}
a{text-decoration: none; color: #007FFF;}
a:hover{text-decoration: underline;}

.bluecolor{color: #005CA1;}
.redcolor{color: #FF0000;}


/* ---------------- Black Strip Structure ---------------- */ 

#blackstrip
{
width: 100%;
overflow: hidden;
margin: 0 auto;
background: #999;
height: 35px;
}

	#stripcontent
	{
	width: 950px;
	margin: 10px auto;
	overflow: hidden;
	font: bold 14px "Arial Narrow";
	color: #000;
	}

	#stripcontent a{color: #000;}

	#strip-left
	{
	width: 350px;
 	float: left;
	}
	
	#strip-mid
	{
	width: 190px;
	float: left;
	}


	#strip-right
	{
	width: 310px;
	float: right;
	text-align: right;
	}
	
	
	
/* ---------------- Main Structure ---------------- */ 

#wrapmaster
{
width: 100%;
overflow: hidden;
margin: 0 auto;
}


/* ------------- Header Style --------------- */

#header-master
{
width: 950px;
padding: 15px 0;
margin: 0 auto;
overflow: hidden;
}

	#header-left
	{
	width: 565px;
	float: left;
	}
	
	#header-right
	{
	width: 300px;
	float: right;
	}
		#header-right ul.joinlinks
		{
		width: 230px;
		margin: 0;
		padding: 0;
		float: right;
		}
		
		#header-right ul.joinlinks li
		{
		height: 23px;
		padding: 7px 0 0 10px;
		margin: 0 0px 0 0;
		float: left;
		font: bold 12px arial;
		}
		
		
		#header-right ul.joinlinks li.big{width: 150px; background:url(../images/big-rounded-block.gif) no-repeat top left;}
		#header-right ul.joinlinks li a	{color: #fff;}
		#header-right ul.joinlinks li.sm{width: 60px; background:url(../images/sm-rounded-block.gif) no-repeat top left}

		#saveearth
		{
		float: right;
		padding: 0 15px 0 0;
		margin: 10px 0 0 0;
		}

/* ---------------- Homepage Banner Structure ---------------- */ 

#hpbannebox
{
width: 950px;
overflow: hidden;
margin: 0 auto;
height: 350px;
}

/* ---------------- Inside Banner Structure ---------------- */ 

#insidebannerbox
{
width: 950px;
overflow: hidden;
margin: 0 auto;
}





/* ---------------- Compare Tracking Device style ---------------- */ 

table#comparestyle
{
border: 1px solid #ccc;
border-collapse: collapse;
}

table#comparestyle td
{
border: 1px solid #ccc;
border-collapse: collapse;
padding: 5px;
height: 18px;
font: 12px arial;
}

table#comparestyle th
{
height: 30px;
border-collapse: collapse;
vertical-align: middle;
background: #CC0000;
color: #fff;
padding: 5px;
font: bold 12px arial;
}

table#comparestyle td blockquote
{
margin: 0 0 0 20px;
color: #999;
}




/* ---------------- Content Structure ---------------- */ 

#contentmaster
{
width: 950px;
overflow: hidden;
margin: 0 auto;
}

	#body-home #leftcolumn
	{
	width:440px;
	float:left;
	padding: 20px 20px 20px 0;
	}
	
	#body-inside #leftcolumn
	{
	width: 700px;
	float:left;
	padding: 20px 40px 20px 0;
	}
	
	#body-inside #rightcolumn
	{
	width: 210px;
	float: left;
	padding: 0px 0px 20px 0;
	}
	
	#body-home #rightcolumn
	{
	width: 455px;
	float: left;
	padding: 20px 0px 20px 0;
	}
	
	

		/* Left Column Structure */
		 
		#leftcolumn h1
		{
		font: 20px arial; 
		color:#000;
		margin: 0 0 10px 0;
		}
		
		#leftcolumn p
		{
		font: 12px arial; 
		color:#666;
		margin: 0 0 10px 0;
		line-height: 18px;
		}
	
		#leftcolumn a
		{
		color: #0066CC;
		}

		#leftcolumn h2
		{
		color: #555;
		font: bold 15px arial;
		margin: 10px 0 0 0;
		}
		
		#leftcolumn h3
		{
		font: bold 12px arial;
		color:#007FFF;
		}
		
		#leftcolumn hr
		{
		border:0;
		background: #F0F0F0;
		color:#ccc;
		size:1px;
		height:1px;
		}
		
		#leftcolumn ul
		{
		margin-bottom:20px;
		}
		
		#leftcolumn ul.content-links
		{
		padding:0 0 0 10px;
		margin:5px 0;
		}
		
		#leftcolumn ul.content-links li
		{
		background:url(../images/square-bullet.gif) no-repeat left center;
		padding: 0 0 0 10px;
		margin0: 0 0 5px 0;
		line-height: 22px;
		color: #666;
		}
		
		#leftcolumn ul.content-links li a
		{
		color:#666;
		}
		
		
		
.servicesbox
{
width: 700px;
float: left;
border-bottom: 1px solid #ccc;
margin: 20px 0 20px 0;
padding: 0 0 20px 0;
}

.servicesbox .sleftcol
{
width: 120px;
float: left;
}

.servicesbox .srightcol
{
width: 580px;
float: left;
}


#leftcolumn .servicesbox .srightcol h2
{
font: 20px "Trebuchet MS";
color: #000;
}

.servicesbox .srightcol ul
{
margin: 0;
padding: 0;
}

.servicesbox .srightcol ul li
{
float: left;
background: url(../images/redarrow.gif) no-repeat top left;
font: 13px arial;
width: 560px;
display: block;
padding: 0 0 10px 20px;
margin0: 0 0 5px 0;
line-height: 16px;
color: #666;
}


		
		
		
		
#videobox
{
width: 700px;
background: #00CC00;
}

	#videobox ul
	{
	width: 700px;
	margin: 0;
	padding: 0;
	}

	#videobox ul li
	{
	width: 150px;
	margin: 0 30px 20px 0;
	float: left;
	padding: 0;
	text-align: center;
	}




		

		/* Right Column Structure */
		
		#hpservicesbox
		{
		width: 485px;
		float: left;
		}
	
			#hpservicesbox h2 a
			{
			font: 15px arial;
			color: #000;
			}
	
			#hpservicesbox ul
			{
			margin: 5px 0 0 0;
			padding: 0;
			}
	
			#hpservicesbox ul li
			{
			width: 150px;
			float: left;
			margin: 0 0 0 0;
			padding: 0 0px 0 10px;
			display: inline;
			line-height: 20px;
			color: #666;
			background: url(../images/square-bullet.gif) no-repeat center left;
			}
			
			#hpservicesbox ul li a
			{
			color: #007FFF;
			}
			
			
		#hpdevicebox
		{
		width: 450px;
		float: left;
		border: 1px solid #ccc;
		margin: 5px 0 0 0;
		height: 110px;
		padding: 5px 0 0px 0px;
		background:  url(../images/hptrackingdevice-bg.jpg) repeat-x top left;
		}
			#hpdevicebox h2 a
			{
			font: bold 12px arial;
			color: #007FFF;
			margin: 0 0 10px 10px;
			}
			
			#hpdevicebox h2 span a
			{
			font: 11px arial;
			text-align: right;
			margin: 0 0 0 300px;
			}
	
			#hpdevicebox ul
			{
			margin: 20px 0 0 0;
			padding: 0 0 0px 0;
			}
	
			#hpdevicebox ul li
			{
			float: left;
			height: 65px;
			margin: 0 0 5px 0;
			padding: 0 18px 0 15px;
			border-right: 1px solid #ccc;
			color: #666;
			}
			
			
			#hpdevicebox ul li span
			{
			display: block;
			margin: 0 0 10px 0;
			text-align: center;
			}
			
/* ------------- Testimonials --------------- */

#testimonial
{
width:209px;
margin: 20px 0;
padding: 15px 0 0 0;
float:left;
background:url(../images/quotes.jpg) no-repeat left top;
color: #666;
line-height: 18px;
}

#testimonial .testi-name
{
color: #666;
font: 11px arial;
margin :5px 0 0 0;
font-style: italic;
}

#testimonial img
{
float:right;
position:relative;
bottom:25px;
right:25px;
}
	
	
/* ------------- News --------------- */
	
	
#newsbox
{
margin: 0;
padding: 0;
}

#newsbox ul li
{
margin-bottom:5px;
background:url(../images/square-bullet.gif) no-repeat left 5px;
padding-left:15px;
}

#newsbox ul li a
{
color: #0099CC;
font-size:11px;
}
	
	
/* ------------- Testimonials --------------- */

#deviceinside
{
width:185px;
margin: 20px 0;
padding: 10px;
float:left;
color: #666;
line-height: 18px;
background:#EEF1F5 url(../images/deviceboxbg.jpg) repeat-x top left;
border:1px solid #DCE3EB;
}

#deviceinside h2 a,
#newsbox h2 a,
#testimonial h2 a
{
font: 15px arial;
margin: 0 0 5px 0;
color: #666;
}

#deviceinside span a
{
font: 11px arial;
color: #0066CC;
}

.devicepageboxes
{
width: 700px;
margin: 5px auto;
overflow: hidden;
border-bottom: 1px solid #eee;
padding: 10px;
}

#leftcolumn .devicepageboxes h2
{
margin: 0 0 10px 0;
}

.specsreadmore
{
float: left;
width: 180px;
color: #000;
padding: 5px;
}

.specsreadmore a
{
color: #000;
}

.fleft
{
float: left;
margin: 0 5px 0 5px;
}






			
/* ------------- Footer Style --------------- */

#footer-master
{
width: 100%;
margin: 20px 0 0 0;
overflow: hidden;
padding: 0;
background: url(../images/footer-bg.jpg) repeat-x bottom left;
}

	#footerlinks
	{
	width: 950px;
	margin:0 auto;
	overflow:hidden;
	}
	
		#footerlinks ul{margin: 0; padding: 0;}
		
		#footerlinks ul li
		{
		display:inline;
		margin: 0 17px 0 0;
		float:left;
		border:1px solid #E4EAEF;
		padding: 10px 15px;
		background: url(../images/footerlinks-bg.jpg) repeat-x left  bottom;
		height:16px;
		color: #666;
		}
		
		
		#footerlinks ul li a{color: #333;}
		
		#footerlinks ul li a span.twitter
		{
		color:#0099CC;
		font-weight:bold;
		}
		
		#footerlinks ul li a span.facebook
		{
		color:#4D6EA9;
		font-weight:bold;
		}	
	
#footercopy
{
width: 950px;
overflow: hidden;
margin: 0 auto;
padding: 20px 0;
font: 11px arial;
}
#footercopy a
{
color: #0066CC;
}


	#footer-left
	{
	width: 300px;
	float: left;
	}
	
	#footer-right
	{
	width: 650px;
	float: right;
	text-align: right;
	}







/* ------------- Testimonials Style --------------- */

span.byline
{
font: bold 12px arial;
font-style: italic;
display: block;
color: #666666;
margin: 5px 0 0 0;
}



/* ------------- Rightside Devices Style --------------- */

	#rightcolumn #devices
	{
	width:200px;
	height:210px;
	background:url(../images/grey-grad2.jpg) repeat-x left bottom;
	border:1px solid #DCE3EB;
	font-size:11px;
	float:left;
	}

	div.rotator 
	{
	width:197px;
	padding:5px;
	height:200px;
	border:1px solid #DCE3EB;
	font-size:11px;
	float:left;
	}

	div.r1 { 
	width:197px;
	padding:5px;
	border:1px solid #DCE3EB;
	font-size:11px;
	float:left;
	}
	div.navigation
	{ 
	}

	div.navigation  h3 a
	{
	color:#666;
	font-size:15px;
	}

	div.navigation  img
	{
	float:left;
	margin-right:10px;
	margin-bottom:10px;
	}

	div.navigation  span
	{
	float:right;
	color:#007FFF;
	margin-top:10px;
	position:absolute;
	bottom:10px;
	}

	div.navigation  span a{color:#007FFF;}
	
	div.navigation ul
	{
	margin:0;
	padding:0;
	}


/* ------------- Form  Style --------------- */

table.hpform
{
font: 12px arial;
color: #666;
margin: 10px 0 0 0px;
}

table.hpform input,
table.hpform select
{
font: 12px arial;
color: #666;
margin: 2px 0 10px 0;
padding: 2px;
background: #fff;
border: 1px solid #ccc;
}

table.hpform input.test {
background: #999999 url(../images/submit-black.jpg) no-repeat left top;
width:82px;
height:31px;
border:0;
}



/* ------------- New Banner Box Style --------------- */

#newbannerbox
{
width: 950px;
overflow: hidden;
margin: 0 auto;
height: 320px;
}

#hpb-top
{
width: 950px;
float: left;
}
	#hbp-top-left
	{
	width: 733px;
	float: left;
	height: 248px;
	}
	
	#hbp-top-right
	{
	width: 197px;
	float: left;
	background: url(../images/header-rgt-bg.jpg) repeat-x top left;
	padding: 10px;
	height: 228px;
	}

	#hbp-top-right h2
	{
	font: 20px arial;
	color: #fff;
	margin: 0 0 15px 0;
	}
	
	#hbp-top-right p
	{
	font: 13px arial;
	line-height: 20px;
	color: #fff;
	}


#hpb-bottom
{
width: 950px;
height: 100px;
float: left;
}

	#hpb-bottom ul
	{
	margin: 0;
	padding: 0;
	background: #00CC00;
	}
	
	#hpb-bottom ul li
	{
	float: left;
	width: 165px;
	height: 65px;
	background:  url(../images/grey-grad.jpg) repeat-x top left;
	margin: 0 5px 0 0;
	padding: 10px 10px 5px 10px;
	}
	

	#hpb-bottom ul li h2
	{
	font: bold 12px arial;
	text-transform: uppercase;
	margin: 0 5px 5px 0;
	padding: 0;
	color: #CC0000;
	}

	#hpb-bottom ul li h2 a{color: #CC0000;}
	#hpb-bottom ul li span
	{
	font: 11px arial;
	margin: 0 5px 0 0;
	padding: 0;
	}
	
	#hpb-bottom ul li span.arrow
	{
	float: right;
	margin: 0 0 25px 0;
	padding: 0 0 20px 0;
	}

	#hpb-bottom ul li a{color: #0066CC;}
	#hpb-bottom ul li a:hover{ text-decoration: none;}
