@charset "utf-8";
body {background: #7c542c url(../images/bg-body.jpg) top left repeat-x; font-family: "Century Gothic", Arial, Helvetica, sans-serif; color:#fff; font-size:100%;}
body input {font-family: "Century Gothic", Arial, Helvetica, sans-serif;}
#wrapper {width:980px; margin:0 auto; text-align:center;}
	#top {background:#523518 url(../images/bg-top.gif) top left no-repeat; width:980px; height:120px; display:block;}
		#logo {float:left; }
			#logo h1 {font-size:2.4em; font-weight:bold; color:#ffb015;  margin:0; padding:0; margin-top:30px; margin-left:80px; text-align:left;}
			#logo h1 span {font-size:.6em; font-weight:normal; margin:0; padding:0;}
			#logo p {margin-left:80px; font-size:1.3em;}
			
		#phone {float:right;}
			#phone .orange {color:#ffb015; font-size:.8em;}
			#phone p {font-weight:bold; font-size:1.3em; margin-top:45px; margin-right:35px; line-height:1.1em;}
			
	#header {background:url(../images/bg-header.gif) top right no-repeat; width:900px; height:246px; display:block; text-align:left; padding-left:80px; padding-top:45px; position:relative;}
		#header h2 {font-weight:bold; font-size:1.5em; margin-bottom:25px;}
		#header ul {margin-bottom:30px;}
		#header ul li {height:30px; font-size:1.1em; padding-top:10px; padding-left:50px;}
		#header ul #number-1 {background: url(../images/gfx-bullet1.gif) top left no-repeat;}
		#header ul #number-2 {background:url(../images/gfx-bullet2.gif) top left no-repeat;}
		#header ul #number-3 {background:url(../images/gfx-bullet3.gif) top left no-repeat;}
		#header p {font-size:1.2em;}
		#header #arrow {position:absolute; left:5px; bottom:-35px;}
		
	#content {}
		#content h3 {color:white; font-size:1.2em; font-weight:bold; float:left; display:inline;}
		#content .inactive {color:#734928;}
		#content #header-s1 {margin-right:220px; }
		#content #header-s2 {margin-right:70px;}
		#content #header-s3 {width:180px;}
		#content h3 .subtext {font-weight:normal; font-size:.9em; display:block;}
		#content #step-1{background:url(../images/bg-step1.gif) top left no-repeat; text-align:left; padding-left:80px; padding-top:12px; margin-bottom:30px; width:900px;}
		#content #step-2{background:url(../images/bg-step2.gif) top left no-repeat; text-align:left; padding-left:80px; padding-top:12px; margin-bottom:30px; width:900px; }
		#content #step-3{background:url(../images/bg-step3.gif) top left no-repeat; text-align:left; padding-left:80px; padding-top:12px; margin-bottom:30px; width:900px;}
		#content #left {margin-top:40px; width:650px; float:left;display:inline;}
			#content #left h4 {font-weight:normal; margin-bottom:10px;}
			#content #left h4 .help {color:#cba27a; text-decoration:none;}
			#content #left ul {margin-left:30px;}
			#content #left ul li {margin-bottom:5px;}
			#content #left ul .other {margin-left:25px;}
				#content #left ul .other input {width:220px;}
				#content #left ul .numberinput {width:25px; text-align:center;}
			#content #left .continue {margin-left:30px; margin-top:30px;}
			#content #left .input-details {color:#cba27a; margin-top:5px; font-size:.8em;}
			#content #left .zip-details {color:#cba27a; margin-top:5px; font-size:.8em; float:left; margin-left:160px; display:inline;}
			#content #left .button-details {color:#cba27a; margin-left:30px; margin-top:5px; font-size:.8em;}
			#content #left #txtZipCode {width:460px;}
			/* */
			#content #step-3 ul {width:400px;}
			#content #step-3 ul li label {float:left; clear:left; padding-top:4px; width:160px; display:block;}
			#content #step-3 ul li input {float:left; clear:right; width:220px; font-family:"Century Gothic", Arial, Helvetica, sans-serif; margin-bottom:10px;}
			#content #step-3 ul li select {float:left; clear:right; width:224px; font-family:"Century Gothic", Arial, Helvetica, sans-serif; margin-bottom:10px;}
			#content #step-3 #areaCode, 
			#content #step-3 #prefix,
			#content #step-3 #ext,
			#content #step-3 #number, #content #step-3 #PhoneNumber {width:30px;margin-right:5px;}		/* this needs to be PhoneNumber to match with the data base - RL */
			#content #step-3 #extension {float:left;padding-top:4px;margin-right:5px;}
			#content #step-3 #phone p {float:left; padding-top:4px; margin-right:5px;}
			#content #step-3 #getQuotes {background:url(../images/btn-getQuotes.gif) top left no-repeat; width:219px; height:46px; display:block; text-indent:-9999px; font-size:1px; line-height:1px; margin-left:30px; margin-top:30px; border:0;}
			
			
		#content #right {margin-top:40px; margin-right:35px; float:right; display:inline; width:200px;}
			#content #right img {margin-bottom:5px;}
		
	#footer {font-size:.8em; color:#fff;}
		#footer ul li {display:inline;}
		#footer a {color:#fff; text-decoration:none;}
		#footer a:visited {text-decoration:underline;}
		#footer a:hover {color:#d49005;}

	.clear {clear:both;}
	#txtAdditionalComments {width:65%; height:60px; margin:0;}
	


/* ================================================================================ */
/* 360P additions																	*/
/* ================================================================================ */

input#getQuotes {cursor: pointer;}


/* Tool tip system */

	.help {
		cursor:				help;}
	
	span.tip {
		background-color:	#eef0f4 }
	
	div#tipDiv {
		position:			absolute; 
		visibility:			hidden; 
		left:				0; 
		top:				0; 
		z-index:			10000;
		width:				240px; 
		background-color:	#fff; 
		border:				1px solid #dbc791; 
		padding-top:		6px; 
		padding-right:		8px; 
		padding-bottom:		10px; 
		padding-left:		10px; 
		font-size:			11px; 
		line-height:		1.3;
		color:				#362706; }
	
	div#tipDiv div.img {
		text-align:			left; }
		
	div#tipDiv div.txt {
		text-align:			left; 
		margin-top:			0px; }
		
	/* for when the tooltip only displays text */
	div#tipDiv div.otxt {
		text-align:			left;
		margin-top:			-4px; }
		
	div#tipDiv .alt {
		text-align:			center; 
		color:				#336; 
		font-weight:		bolder;
		font-style:			italic; }

/* ========================================================================= */