/*

	Stylesheet for the Fuelwise Fuel Cards Network
	
	JSR Technology <keith@jsrtechnology.com>

*/

body { background:#0055A5 url(background-body.jpg) top center no-repeat; margin:0; 
	text-align:center; font-family: arial, sans-serif; font-size:12px; }

/* MASTHEAD */

#masthead { text-align:right; width:870px; margin:50px auto 20px auto; }
	#masthead p { display:block; float:right; margin:0; width:281px; }
	#masthead p.logo { color:#ffffff; text-align:center; line-height:2em; margin:0 100px 0 0; }
	#masthead p.logo a { color:#ffffff; text-decoration:none; }
	#masthead p.logo img { border:none; }

/* MAIN */

#main { width:870px; padding:20px; background:#ffffff url('corner-content.gif') top right no-repeat;; color:#000000; margin:0 auto; text-align:left; }

/* MENU  */

#menu { float:left; width:150px; }
	#menu ul { list-style-type:none; padding:0; margin:0;  }
	#menu li { }
	#menu li a { display:block; margin:0 0 4px 0; padding:3px 5px; background:#eeeeee; color:#000000; text-decoration:none; }
	#menu li a.selected { background:#00A7E8; color:#ffffff; font-weight:bold; }
	#menu li a:hover { text-decoration:underline; }
	#menu #phone { background:#00A7E8; color:#ffffff; padding:5px 10px; margin:10px 0;  }
	#menu #phone p { font-weight:bold; margin:0;}
	#menu #phone strong { color:#000; }
	#menu #phone span { color:#000; font-weight:normal!important;}
	#menu #email { background:#00A7E8; color:#000; padding:5px 10px; margin:10px 0; }
	#menu #email p { font-weight:bold; margin:0;}
	#menu #email a { color:#fff; text-decoration:none; }
	#menu #email a:hover { text-decoration:underline; }
	
/* CONTENT */

#content { float:right; width:710px; }

	#mainpic { height:200px; background:#00A7E8 url('corner-main.gif') top right no-repeat; }
		#mainpic .text { display:block; float:right; height:160px; width:265px; padding:10px 13px 10px 0; color:#ffffff; }
		#mainpic .text h1 { margin:0 0 10px 0; font-size:25px; text-transform:uppercase; }
		#mainpic .text p { margin:0 0 10px 0; color:#000000; }
		#mainpic img { float:left; margin-left:10px; height:200px; width:400px; background:#000; }
		#mainpic span { float:left; margin-left:10px; height:200px; width:400px; background:#000; }
		
	.minibox { height:100px; background:#BBB; margin:10px 0 0 0; }
		.minibox p { display:block; float:right; width:460px; padding:10px 10px 10px 0; color:#ffffff; line-height:1.5em; }
		.minibox a { text-decoration:none;  color:#000000;}
		.minibox a:hover { text-decoration:underline; } 
		.minibox strong { text-transform:uppercase; }
		.minibox a:hover  strong {}
		.minibox img { float:left; margin-left:10px; height:100px; width:100px; background:#000; }

	.accrossthetop { background:#fff url('box-back.jpg') no-repeat top left; padding:10px 20px; margin-bottom:10px; height:171px;}
	
	
	
	.leftfifty { background:#fff url('box-back.jpg') no-repeat top left; 
	float:left; width:300px; height:150px; padding:10px 20px; margin-bottom:10px;  }
	.rightfifty { background:#fff url('box-back.jpg') no-repeat top left; 
	float:right; width:300px; height:150px; padding:10px 20px; margin-bottom:10px; }
		.leftfifty a, .rightfifty  a { color:#0055A5; text-decoration:none; border-bottom:1px dotted #0055A5 }
		.leftfifty a:hover, .rightfifty a:hover { border-bottom-style:solid;  }
		
	.leftbox, .rightbox { width:225px; height:80px; background:#fff url('box-back.jpg') no-repeat top left; margin:0 0 10px 0; padding:1px 8px 1px 1px;}
		.leftbox { float:left; }
		.rightbox { float:right; }
		 .leftbox p, .rightbox p { display:block; float:right; margin:5px 5px 0 0; width:125px;}
		.leftbox img .rightbox img {  display:block; float:left; margin:0; border-bottom:5px solid #00A7E8; width:80px; height:80px; }
		.leftbox a, .rightbox a { text-decoration:none;  color:#000000;}
		.leftbox a:hover, .rightbox a:hover { text-decoration:underline; } 
		.leftbox strong, .rightbox strong { text-transform:uppercase; }	
			
	.rowbox { float:left; background:#BBB; width:110px; margin:10px 5px 0 5px; padding:10px 0; text-align:center; }
		.rbleft { margin-left:0;}
		.rbright { margin-right:0; }
		.rowbox span {  }
		.rowbox a { text-decoration:none; font-weight:bold; color:#000000;}
		.rowbox a:hover { text-decoration:underline; } 
		.rowbox strong { text-transform:uppercase; }
		.rowbox a:hover  strong {}
		.rowbox a img { float:left; height:100px; width:110px; background:#000; border:none; margin-bottom:10px }
		
	#content .innards { padding:0 10px;  }
		#content .innards h2 { background:#0055A5 url('h2-corner.gif') no-repeat bottom right; padding:5px 10px; margin:10px -10px; color:#fff; font-size:20px; }
		#content .innards h2 a { color:#fff; text-decoration:underline; }
		#content .innards p { text-align:justify; line-height:1.5em; } 
		#content .innards li { margin-bottom: 0.5em; list-style-type:square; }
		#content .innards a { color:#0055A5; text-decoration:none; border-bottom:1px dotted #0055A5 }
		#content .innards a:hover { border-bottom-style:solid;  }
		#content .innards .google-map { margin:10px -10px; }
		
		
		
		
		
		
	#slider { height:300px; width:870px; margin:0px 0 10px 0; }
	
		
		
		
		
		

/* FOOTER */

#footer { color:#777; text-align:center; margin:40px 0 20px 0; }
	#footer  a { color:#777; text-decoration:none; border-bottom:none; }
	#footer  a:hover { text-decoration:underline;  }
	#footer .links { margin:30px; line-height:2em; font-size:10px; font-weight:bold; border:1px solid #777; margin:0 70px; padding:10px; }

/* MISC. CLASSES */
.bigpic { border:1px solid #dddddd; }
.clear { clear:both; } 
.centre, p.centre { text-align:center; }


.jsr {  margin:20px; font-weight:bold; font-family:Arial, Helvetica, sans-serif; font-size:10px }
.jsr a { padding:3px 6px; border:1px solid #ddd!important; color:#ddd!important; text-decoration:none; }
.jsr a:hover { border:1px solid #aaa!important; color:#aaa!important; }