/* -----------------------------------*/
/* ---------->>> LAYOUT <<<-----------*/
/* -----------------------------------*/
div.layoutContainer {
	display: block;
	padding: 0 20px;
	width: 960px;
}
div.header {
	height: 80px;
	margin-bottom: 5px;	
	width: 100%;
}
div.leftCol {
	display: inline;
	float: left;
	width: 620px;
}
div.rightCol {
	display: inline;
	float:right;
	width:300px;
	position:relative;
	padding: 5px;
}
div.gridContainer {
	clear: both;
	display: block;
	width: 100%;
	margin-bottom: 10px;
}
div.clear {
	background: none;
	border: 0 none;
	clear: both;
	display: block;
	float: none;
	font-size: 0;
	height: 0;
	margin: 0;
	overflow: hidden;
	padding: 0;
	visibility: hidden;
	width: 0;
}
div.halfGrid {
	display: inline;
	float: left;
	width: 50%;
}
div.thirdGrid {
	display: inline;
	float: left;
	width: 33.3%;	
}
/* -----------------------------------*/
/* ---------->>> HTML ELEMENTS <<<-----------*/
/* -----------------------------------*/

#layoutWrapper h1, #layoutWrapper h2, #layoutWrapper h3, #layoutWrapper h4, #layoutWrapper h5, #layoutWrapper h6 {
	clear: both;
	text-align: left;
}

#layoutWrapper h1 {
	font-size: 18px;
}
#layoutWrapper h2 {
	font-size: 14px;
	margin-top: 10px;
}
#layoutWrapper h3 {
	font-size: 12px;
}
div.leftCol, div.rightCol {
	font-size: 12px;
}
/* -----------------------------------*/
/* ---------->>> LEFT COL <<<-----------*/
/* -----------------------------------*/
.contentSPO {
	padding: 5px 10px;
}
/* Utilities for SPO */
.floatLeft {
	float: left;
	}
.floatRight {
	float: right;
	}
.clearFloat {
	clear: both;
	float: none;
	}
/* SPO_topWrapper.jsp related styles */
#serviceInfoBar {
	background-position: top left;
	background-repeat: no-repeat;
	position:relative;
	} 
div.header #serviceLogo, #serviceLogoSaturn {
	height: 30px;
	margin-top: 26px;
	margin-right: 24px;
	margin-left: 10px;
	width: 215px;
}
#serviceLogoSaturn {
	display: none; /* hide as default */
}

div.header div#serviceInfoBar div#servicePhoneNumberContainer{
	position: absolute;
	right:0px;
	text-align:center;
	width:300px;
	margin-top:28px;
	height: 34px;
	padding-top:4px;
}
div.header div#serviceInfoBar #servicePhoneNumber{
	background-position: top left;
	background-repeat: no-repeat;
	font-size: 18px;
	line-height:19px;
	padding-bottom:8px;
	padding-left:40px;
}
/* ServiceApptForm popup */
#SPO_ServiceApptIframe {
	width: 600px;
	height: 420px;
	margin-top: 20px;
	overflow: auto;
	background-color: #FFF;
	color: #000;
	}
/* Tabs */
/* override the ui.tabs.css */
#serviceTabs { 
	width: 300px !important; 
	font-size: 11px;
	font-family: Arial, Helvetica, sans-serif;
	}
#serviceTabs ul#tabNavs { 
	position: relative; 
	width: 300px; height: 30px; 
	padding: 0; 
	}
#serviceTabs ul#tabNavs li { 
	position: relative; 
	margin: 0 4px -1px 0; 
	padding: 0;  
	min-width: 146px !important;
	width: 146px; height: 26px;  
	text-align: center; 
	background-color: #EEE;
	}
#serviceTabs ul#tabNavs #tabNav2 { /* override */
	margin-right: 0; 
	}
#serviceTabs #tabNavs li a { 
	text-decoration: none; 
	display: block; 
	}
#serviceTabs #tabNavs li a, #serviceTabs #tabNavs li a span {
	background-image: none;
	}
#serviceTabs #tabNavs li.ui-tabs-selected { 
	padding-bottom: 1px; 
	border-bottom-width: 0; 
	height: 29px; 
	background-color: #FFF;
	}
#serviceTabs #tabNavs li.ui-tabs-selected a, #serviceTabs #tabNavs li.ui-state-disabled a, #serviceTabs #tabNavs li.ui-state-processing a { 
	cursor: text; 
	}
#serviceTabs #tabNavs li a, #serviceTabs.ui-tabs-collapsible #tabNavs li.ui-tabs-selected a { 
	cursor: pointer; 
	} /* first selector in group seems obsolete, but required to overcome bug in Opera applying cursor: text overall if defined elsewhere... */
#serviceTabs1 .ui-tabs-hide { 
	display: none !important; 
	}
#serviceTab1, #serviceTab2 {
	border-top-width: 0 !important;
	min-width: 278px;
	width: 278px !important;
	height: 135px !important;
	padding: 10px;
	line-height: 1.5em;
	background-color: #FFF;
	color: 000;
	}
/* Location and Hours - SPO_HoursLocation.jsp */
.dealerTitle {
	font-weight: 700;
	font-size: 14px;
	}
#serviceLocationLink {
	background-position: center right;
	background-repeat: no-repeat;
	width: 100px;
	}
.hoursDiv {
	width: 130px;
	}
#ServiceHours {
	padding-right: 8px;
	}
#PartsHours {
	padding-left: 8px;
	}
.operationDay { 
	width: 25px;
	margin-right: 8px;
	float: left;
	text-align: right;
	}
#ServiceHours, #PartsHours, .operationDay {
	float: left;
	}
/* -----------------------------------*/
/* ---------->>> RIGHT COL <<<-----------*/
/* -----------------------------------*/
div.CICContainer, div.rightColHeader {
	margin: 10px 0;
}
h2.rightColHeader {
	padding: 0 10px;
}
div.rightColContent {
	padding: 10px;
}