@import "reset.css";

/* ALL SITE CSS
--------------------------------------------*/

body { background: #fff; text-align: center; }

	#container { width: 780px; margin: 0 auto; text-align: left; }
	
		#header { height: 308px; position: relative; background: url('../../img/layout/header-bg.jpg') bottom center no-repeat; }
		
			#logo { position: absolute; top: 30px; left: 0; }
			#header-nav { margin: 0; padding: 0; position: absolute; top: 56px; right: 0; }
				#header-nav li { list-style: none; display: inline; float: left; }
				#header-nav li a { display: block; background: #000; color: #fff; text-transform: uppercase; width: 106px; text-align: center; text-decoration: none; font-weight: bolder; font-size: 11px; line-height: 1; margin: 0 0 0 1px; padding: 7px 0 6px 0; }
				#header-nav li a:hover { background: #e80307; }
				
		#nav { height: 113px; overflow: hidden; margin-bottom: 14px; }
		
			#nav ul { margin: 0; padding: 0; }
				#nav ul li { list-style: none; display: inline; float: left; }
					#nav ul li a { display: block; height: 113px; width: 195px; background: url('../../img/layout/nav.png') no-repeat; text-indent: -9000px; }
						#nav-residential { background-position: 0 0; }
							#nav-residential:hover { background-position: 0 -113px !important; }
						#nav-business { background-position: -195px 0 !important; }
							#nav-business:hover { background-position: -195px -113px !important; }
						#nav-carrier { background-position: -390px 0 !important; }
							#nav-carrier:hover { background-position: -390px -113px !important; }
						#nav-visitors { background-position: -585px 0 !important; }
							#nav-visitors:hover { background-position: -585px -113px !important; }
							
		#content { overflow: hidden; margin-bottom: 20px; }
		
			.callout { float: left; width: 256px; height: 159px; border: 1px solid #8f8f8f; background: url('../../img/layout/callout-bg.png') center center no-repeat; margin-right: 3px; position: relative; }
			.callout.last { margin-right: 0 !important; }
				.callout p { line-height: 1.2; }
				.callout p.title { text-transform: uppercase; color: #e80307; font-weight: bold; margin-bottom: 4px; line-height: 1; width: 230px; }
				.callout a { display: block; width: 80px; background: url('../../img/layout/callout-link-bg.png') no-repeat; padding: 6px 0 6px 30px; color: #e80307; font-weight: bold; font-size: 11px; line-height: 1; position: absolute; bottom: 13px; left: 13px; }
				.callout a:hover { color: #000; text-decoration: none; }
			
			#callout1 div {  margin: 13px 0 0 13px; }
				 #callout1 #main-img { position: absolute; bottom: 1px; right: 1px; }
				
			#callout2 div { width: 127px; margin: 13px 0 0 13px; }
				#callout2 img { position: absolute; top: 8px; right: 2px; }
				
			#callout-securus div { margin: 13px 0 0 13px; }
				#callout-securus  #main-img { position: absolute; bottom: 1px; right: 2px; }
			
			#callout-tbinet div { margin: 53px 0 0 13px; }
					
			#callout3 div { margin: 13px 13px 0 13px; }
				#callout3 img { position: absolute; bottom: 14px; right: 8px; }
				
			#postal-reg { text-align: left; padding: 10px; }
				#postal-title { font-size: 14px; color: #e80307; font-weight: bold; }
				#postal-reg a { color: #e80307; font-weight: bold; }
				#postal-reg a:hover { color: #000; text-decoration: none; }
				
		#footer { overflow: hidden; margin-bottom: 16px; }
		
			#footer-left { float: left; width: 450px; font-size: 10px; color: #8f8f8f; }
				#footer-left img { float: left; margin: 0 10px 0 0; }
				#footer-left p { margin-top: 12px; }
				
			#footer-right { float: right; width: 290px; font-size: 10px; color: #8f8f8f; text-align: right; }
				#footer-right p { margin-top: 12px; }