/*
****************************************************************
CORE SCREEN HTML STYLES

Generic rules applied to core html types, a, p img etc. for screen targeted styles
*****************************************************************
*/

html
{
	height : 100.1%;
}

body
{
	margin              : 0px;
	padding             : 0px;
	background-color	: White;
	text-align          : center;
	font-family			: Verdana;
}
    
a
{
	text-decoration : none;
}
a img
{
    border : none;
}

h1
{
    font-size   : 14px;
    line-height : 16px;
    font-weight : bold;
    line-height : 18px;
    margin      : 0px 0px 0px 0px;
    padding     : 0px 0px 0px 0px;
    color		: #656A70;
}
    
h2
{
    font-size   : 12px;
    line-height : 14px;
    font-weight : bold;
    margin      : 0px 0px 0px 0px;
    padding     : 0px 0px 0px 0px;
    color		: #656A70;
}

h3
{
    font-size   : 11px;
    font-weight : bold;
    margin      : 0px 0px 0px 0px;
    padding     : 0px 0px 0px 0px;
}

p 
{
    font-size   : 11px;
    line-height : 20px;
	margin      : 0px 0px 0px 0px;
    padding     : 0px 0px 0px 0px;
    color		: #656A70;
}

.none { display : none; }


/* 
 *  IMPORTANT NOTES:
 *
 *  - LAYING OUT ELEMENTS [ie v.7] & [ff v.2.0.0.11]:
 *      
 *    When using [position : relative] : position (top, left, right, bottom) is taken from 0,0 in parent and IGNORS any border setting on the parent
 *      e.g. if (elementLeft = 10 && parentBorder = 5) THEN elementFinalLeft = 10 (i.e. no change)
 *
 *    When using [position : absolute] : position (top, left, right, bottom) is taken from 0,0 in parent PLUS border width OR from the parents (width/height - border width)
 *      e.g. if (elementLeft = 10 && parentBorder = 5) THEN elementFinalLeft = 15 !!!
 */

/*
****************************************************************
SCREEN LAYOUT HTML STYLES
*****************************************************************
*/
div.root
{
	width : 970px;	
	margin : 0px auto;
	background-color : White;
}
div.root div.header
{
	width : 970px;	
}
div.root div.header div.column.left
{
	/*width : 425px;*/
	height : 80px;
	text-align : left;
}
div.root div.header div.column.left img
{
	margin : 5px 10px;
}
div.root div.header div.column.right
{
	/*width : 545px;*/
	height : 80px;
}
div.root div.header div.column.right div#manufacturerHeaderPanel
{
	margin : 15px 20px 15px 0px;
}
div.root div.header div.column.single
{
	width : 970px;
}

div.root div.header div.column.right div#manufacturerHeaderPanel div
{
	float : left;
}

div.root div.header div.column.right div#manufacturerHeaderPanel div,
div.root div.header div.column.right div#manufacturerHeaderPanel div a,
div.root div.header div.column.right div#manufacturerHeaderPanel div a img
{	
	height : 50px;	
	display : block;
}
div.root div.header div.column.right div#manufacturerHeaderPanel div a
{
	position : relative;
}
div.root div.header div.column.right div#manufacturerHeaderPanel div a img 
{
	margin : 0; 
	padding : 0; 
	border : none;
	left : 0;
	top : 0;
	position : absolute;		
}
div.root div.header div.column.right div#manufacturerHeaderPanel div.Ford,
div.root div.header div.column.right div#manufacturerHeaderPanel div.Ford a,
div.root div.header div.column.right div#manufacturerHeaderPanel div.Ford a img { width : 115px; }
div.root div.header div.column.right div#manufacturerHeaderPanel div.Mazda,
div.root div.header div.column.right div#manufacturerHeaderPanel div.Mazda a,
div.root div.header div.column.right div#manufacturerHeaderPanel div.Mazda a img { width : 50px; }
div.root div.header div.column.right div#manufacturerHeaderPanel div.Seat,
div.root div.header div.column.right div#manufacturerHeaderPanel div.Seat a,
div.root div.header div.column.right div#manufacturerHeaderPanel div.Seat a img { width : 70px; }
div.root div.header div.column.right div#manufacturerHeaderPanel div.Peugeot,
div.root div.header div.column.right div#manufacturerHeaderPanel div.Peugeot a img { width : 70px; }
div.root div.header div.column.right div#manufacturerHeaderPanel div.Citroen,
div.root div.header div.column.right div#manufacturerHeaderPanel div.Citroen a,
div.root div.header div.column.right div#manufacturerHeaderPanel div.Citroen a img { width : 100px; }
div.root div.header div.column.right div#manufacturerHeaderPanel div.Kia,
div.root div.header div.column.right div#manufacturerHeaderPanel div.Kia a,
div.root div.header div.column.right div#manufacturerHeaderPanel div.Kia a img { width : 100px; }
div.root div.header div.column.right div#manufacturerHeaderPanel div.Fiat,
div.root div.header div.column.right div#manufacturerHeaderPanel div.Fiat a,
div.root div.header div.column.right div#manufacturerHeaderPanel div.Fiat a img { width : 50px; }

div.root div.header div.column.right div#manufacturerHeaderPanel div a img
{
	position : absolute;
}

div.root div.content
{
	padding : 0;
	margin : 0;
	width : 970px;
	text-align : left;
	vertical-align : top;
	font-size : 11px;
	font-weight : normal;	
	color : #656A70;
}
div.root div.content a
{
}
div.root div.content div.column
{
	float : left;
}
div.root div.content div.column.single
{
	width : 100%;
	padding : 0px 0px 5px 0px;
	text-align : left;
	vertical-align : top;	
}
div.root div.content div.column.left,
div.root div.content div.column.right
{
	width : 225px;
	padding : 0px 0px 5px 0px;
	margin : 0;
	text-align : left;
	vertical-align : top;
}
div.root div.content div.column.middle
{
	width : 510px;
	padding : 0px 0px 5px 0px;
	margin : 0px 5px;
	text-align : left;
	vertical-align : top;
}
div.root div.content div.layout.form div.column.left
{
	width : 740px;
	margin-right : 5px;
}
div.root div.footer
{
	padding : 10px 0px 0px 0px;
}

/* Featured Items Panel */
div.panel.featureditems
{
	padding : 5px 0px;
	width : 100%;	
}
div.panel.featureditems div.item
{
	width : 240px;
	height : 190px;
	float : left;
	text-align : center;
	overflow : hidden;		
}
div.panel.featureditems div.item.even
{
	margin : 0px 4px;
}
div.panel.featureditems div.item div.title
{
	padding : 10px 0px;
	margin : 0px 3px;
	height : 14px;
	overflow : hidden;
}
div.panel.featureditems div.item div.image img
{
	width : 230px;
	height : 90px;	
}
div.panel.featureditems div.item div.description
{
	padding : 5px;
	text-align : left;	
}
div.panel.featureditems div.item div.description p
{
	line-height : 14px;
}

/* Franchise Logos Panel */
div.panel.franchiseLogos
{
	text-align : center;
	width : 100%;
}
div.panel.franchiseLogos div.logos
{
	width : 240px;
	margin : 0 auto;
}
div.panel.franchiseLogos div.logos img.franchiseLogo
{
	width : 60px;
	height : 60px;
	margin : 0px 10px;
	padding : 0;	
	float : left;
}

/* News Ticker */
div.panel.newsTicker
{
	width : 734px;
	height : 20px;
	margin : 0px auto;
	padding-bottom : 10px;	
}
div.panel.newsTicker div
{
	float : left;
}
div.panel.newsTicker div.tickerLabel
{
	width : 50px;
	height : 20px;
	color : White;
	font-size : 11px;
	font-weight : bold;
	padding : 3px 0 0 0;
	margin : 0;
	cursor : default;
	border : solid 1px #656A70;
}
div.panel.newsTicker div.tickerFeed
{
	width : 659px;
	height : 18px;	
	color : Black;
	font-size : 11px;
	font-weight : normal;
	padding : 5px 10px 0 10px;
	margin : 0;
}
div.panel.newsTicker div.tickerFeed marquee
{
	/*width : auto;*/
	display : block;
}
div.panel.newsTicker div.tickerFeed marquee a
{
	color : #656A70;
	padding : 0px 10px;
}
div.panel.newsTicker div.tickerFeed marquee a:hover
{
	color : Black;
}

/*******************************************************
Form Styles
********************************************************/
form#frmLocations div.location
{
	padding : 10px 0px 0px 0px;
}
form#frmLocations div.location label
{
	font-weight : bold;
	font-size : 14px;
	width : 29%;
	display : block;
	float : left;
}

div.formTitle
{
	margin-bottom : 5px;
}
div.formTitle h1
{
	color : White;
	padding : 10px 0 10px 10px;	
}
form.twocolumn 
{   
    margin-bottom : 10px;
}

form.twocolumn h2
{
    padding : 15px 0 15px 5px;
    margin : 0 0 0 -5px;
}

form.twocolumn fieldset
{
    margin : 10px 0px 10px 0px;
    padding : 0;
    border-width : 0px;
    width : 700px;
}
form.twocolumn fieldset div.item
{
	margin : 5px 0px;
}

form.twocolumn fieldset table
{
    width : 720px;
}

form.twocolumn fieldset.radio_group 
{
    margin-bottom : 0;    
}

form.twocolumn legend
{
    margin : 0 0 10px -7px;
    padding : 0 0 0 0;
    font-size : 14px;
    font-weight : bold;
    color :  #656A70;
}

form.twocolumn div.divider
{
    margin : 0 0 5px 0;
    padding : 0 0 3px 0;
    border-bottom : 1px solid #eee;
}

form.twocolumn p
{
    margin : 0;
    padding : 0 0 10px 0;
    font-size : 10px;
}

form.twocolumn label
{
    display : block;
    float : left;
    position : relative;
    width : 30%;
    color : Black;
    margin : 2px 0 0 0;
    font-weight : bold;
}

form.twocolumn fieldset.radio_group label
{
    float : left;
    display : block;
    width : auto;
    margin : 3px 0 0 0;
    font-size : 10px;
    font-weight : normal;
}

form.twocolumn label abbr
{
    border : 0px;
}

form.twocolumn label img
{
    padding : 0;
    border : none;
    vertical-align : text-top;
    position : absolute;
    right : 5px;
    top : 50%;
    margin-top : -5px;
}

form.twocolumn span.advice,
form.twocolumn span.field_error
{
    margin : 5px 60px 0 220px;
    display : block;
    color : #999;
    font-size : 10px;
}

form.twocolumn span.advice {color : #999;}

form.twocolumn span.readonly
{
    display : block;
    padding-top : 2px;
    color : #656A70; 
    font-weight : bold;
}

form.twocolumn span.field_error 
{
    color : #b82713; 
    font-weight : bold;
}

form.twocolumn select 
{
    width : 20%;
}

form.twocolumn input,
form.twocolumn textarea 
{
    width : 60%;
}
form.twocolumn fieldset.radiogroup { width : auto; }
form.twocolumn fieldset.radiogroup input { float : left; clear : left; width : 5%; }

form.twocolumn textarea
{
    height : 100px; 
    min-height : 100px;
    overflow : auto;
}

form.twocolumn span.checkbox input
{
    width : auto;
    border : none;
    vertical-align : middle;
}

form.twocolumn fieldset.radio_group input
{
    float : left;
    clear : left;
    width : auto;
    display : block;
    border : none;
}

form.twocolumn fieldset.radio_group input
{
    height : 20px;
}

form.twocolumn img.calendar 
{   
    margin : -1px 0 0 3px; 
    vertical-align : middle;
}

form.twocolumn div.submit 
{
    padding : 0 0 0 0;
}

form.twocolumn div.submit input
{
    margin : 0 10px 5px 598px;
    padding : 0;
    font-size : 10px;
    font-weight : bold;
    white-space : nowrap;
	border : none;
	background : transparent url('/GkGroup/assets/images/buttons/blueButton.jpg') no-repeat;
	background-position : 0px 2px;
	width : 105px;
	height : 25px;
	color : White;
	cursor : pointer;
   
}

form.twocolumn div.submit input:hover 
{   
    color : Black;
}

form.twocolumn div.submit span
{
    text-align : right;
    padding : 0 0 5px 0;   
}

form.twocolumn caption
{
    font-weight : bold;
    font-size : 12px;
    text-align : left;
    margin : 0 0 0 0;
    padding : 3px 0 3px 10px;
    width : 727px;
    background-color : #2E5379;
    color : #ffffff;
}

form.twocolumn thead
{
   background-color : #DEEBF7;
   border : 0;
   margin : 0;
   padding : 0;  
}

div.divider input
{
    padding : 0 2px 0 2px;
    color : #414c98;
    font-size : 10px;
    height : 16px;
    border : 1px solid #819CB7;
}

form td.center.blank
{
    width : 110px;
}

form td.center.blank input
{
    margin : 0;
    padding : 0;
    text-align : center;
    line-height : 10px;
    color : #fff;
    background-repeat : no-repeat;
    border : none;
    background-color : transparent;
    cursor : pointer;
}

form td.center.blank input
{
    width : 100px;
    height : 22px;
    font-weight : bold;
    font-size : 12px;
    background-image : url(/assets/vospers/images/submit.button.inactive.bkgd.gif);
    background-repeat : no-repeat; 
    background-color : transparent;
}
/*******************************************************/

/***************************************************************
##Form Feedback
***************************************************************/
div.divFormFeedBack
{
	padding : 10px;
}
div.divFormFeedBack h1
{
	padding-bottom : 10px;
}
div.divFormFeedBack a
{
	text-decoration : none;
	color : #02497F;
	font-weight : bold;
}
div.divFormFeedBack a:hover
{
	text-decoration : underline;
}
/*******************************************************/

/***************************************************************
##Form Error Summary
***************************************************************/
div.error.summary
{
    margin : 5px 5px 10px 5px;
    padding : 10px;
    color : Black;
    background-color : #DADADA;
    border : 1px solid #656A70;
}

div.error.summary h2
{
    margin : 0 0 5px 0;
    font-size : 14px;
    color : #b82713;
}

div.error.summary p {margin : 0 0 5px 0;}
/***************************************************************/


/***************************************************************
##Calendar Pop-Up Styles
***************************************************************/
div.calendar 
{
    background-color : #fff;
}

div.calendar table 
{
    border : none;
}

.cpYearNavigation,
.cpMonthNavigation
{
    background-color : #eee;
    text-align : center;
    vertical-align : middle;
    text-decoration : none;
    color : #000;
    font-weight : bold;
}

.cpDayColumnHeader,
.cpYearNavigation,
.cpMonthNavigation,
.cpCurrentMonthDate,
.cpCurrentMonthDateDisabled,
.cpOtherMonthDate,
.cpOtherMonthDateDisabled,
.cpCurrentDate,
.cpCurrentDateDisabled,
.cpTodayText,
.cpTodayTextDisabled,
.cpText 
{
    font-size : 9px;
}

td.cpDayColumnHeader
{
    text-align : right;
    border-color : #C0C0C0;
    border-style : solid;
    border-width : 0px 0px 1px 0px;
}

.cpCurrentMonthDate,
.cpOtherMonthDate,
.cpCurrentDate  
{
    text-align : right; 
    text-decoration : none;
}

.cpCurrentMonthDateDisabled,
.cpOtherMonthDateDisabled,
.cpCurrentDateDisabled 
{
    color : #D0D0D0; 
    text-align : right; 
    text-decoration : line-through;
}

.cpCurrentMonthDate,
.cpCurrentDate 
{
    color : #000000;
}

.cpOtherMonthDate 
{
    color : #808080;
}

td.cpCurrentDate
{
    color : #fff;
    background-color : #eee;
    border : solid 1px #800000;
}

td.cpCurrentDateDisabled 
{
    border-width : 1px; 
    border : solid 1px #FFAAAA;
}

td.cpTodayText,
td.cpTodayTextDisabled  
{
    border : solid 1px #C0C0C0; 
    border-width : 1px 0px 0px 0px;
}

a.cpTodayText,
span.cpTodayTextDisabled 
{
    height : 20px;
}

a.cpTodayText 
{
    color : #000;
}

.cpTodayTextDisabled 
{
    color : #D0D0D0;
}

.cpBorder 
{
    border : solid 1px #666;
}
/***************************************************************/

/***************************************************************
##Breadcrumb Styles
***************************************************************/
div#breadcrumb
{	
	border : solid 1px #C4C4C4;
	font-size : 11px;
	height : 15px;
	text-decoration : none;
	width : 722px;	
	padding : 5px;	
	margin : 5px 0px;
	cursor : default;
}
div#breadcrumb a.label
{
	float : left;
	font-size : 11px;
	font-weight : bold;
	color : Black;
	padding-right : 5px;
}
div#breadcrumb ol
{
	text-decoration : none;
	list-style : none;
	list-style-image : none;
	list-style-type : none;
	margin : 0;
	padding : 0;		
	height : 11px;
}
div#breadcrumb ol li
{
	float : left;
	padding : 0 5px;
}
div#breadcrumb ol li a
{
	color : #656A70;	
	cursor : pointer;
	text-decoration : none;
}
div#breadcrumb ol li a:hover { text-decoration : underline; }
div#breadcrumb ol li.selected { color : Black; }
div#breadcrumb ol li.seperator { color : #656A70; }
/***************************************************************/

/***************************************************************
##Sitemap Styles
***************************************************************/
#sitemap h2,
#sitemap h2 a
{
	font-size : 11px;
	line-height : 11px;
	padding : 5px 0px;
	color : #02497F;
}
#sitemap ul a
{
	color : #02497F;
}
#sitemap a:hover
{
	text-decoration : underline;
}
/***************************************************************/

/***************************************************************
##Disclaimer Styles
***************************************************************/
div.disclaimer 
{		
	clear : left;
	padding : 10px;
	text-align : left;
}
div.disclaimer p { font-size : 7pt; color : #666; }
/***************************************************************/