/* CSS Definitions for pop up pages via the footer */
/* =============================================== */

body {
	width:200px;
	margin:0px;
	padding:0px;
	font:84%/1.2 Verdana, Arial, Helvetica, sans-serif;
	text-align:left;
}

h1, h2, h3, h4 {
	margin:0px;
	padding:0px;
	color:#999999;
}

h2 { font-size:1em; }
h3 { font-size:0.82em; }
h4 { font-size:1.4em; }

table { border:none; padding:0px; margin:0px; }

hr {
	height:1px;
	background-color: #cccccc;
	color: #cccccc;
	border:0;
}

/* Puts 1px grey border above the wrapping DIV */
#contentWrap { 
	width:434px;
	border-top:1px solid #cccccc;
	padding:5px 0px 0px 0px;
	text-align:center;
}

#contentWrap a { 
	color:#707070; 
	text-decoration:underline; 
}
#contentWrap a:hover { 
	text-decoration:none; 
}

/* This DIV is used for modules which are centered and have a smaller width */
#innerContentSmall {
	width:350px;
	margin:0 auto;
	text-align:left;
	color:#707070;
	font-size:0.75em;
}

/* This DIV however is for the fullscreen content such as FAQS, Privacy etc */
#innerContentLarge {
	width:430px;
	text-align:left;
	text-align:left;
	color:#707070;
	font-size:0.75em;
}

#innerContentLarge h3 { font-size:1em; color:#707070; margin:0px 0px 14px 0px;}
#innerContentLarge h4 { font-size:1em; margin:0px 0px 3px 0px; color:#707070; padding:0px;}
#innerContentLarge p { font-size:1em; margin:0px 0px 15px 0px; color:#707070; padding:0px;}


/* This DIV is strictly for the larger skin, i.e. the about us pop up which serves multiple pages */
#innerContentColumns {
	width:600px;
	text-align:left;
	text-align:left;
	color:#707070;
	font-size:0.75em;
}

#innerContentColumns a {
	font-weight:bold;
}

#innerColumnLeft {
	float:left;
	width:360px;
	margin:0px 20px 0px 0px;
}

#innerColumnLeft li {
	margin:0px 0px 10px 0px;
}

#innerColumnLeft .aboutBrands {
	margin:20px 0px 20px 0px;
	clear:both;
}

#innerColumnLeft .aboutBrands img {
	float:left;
	margin:0px 10px 0px 0px;
}

innerColumnLeft td {
	width:180px;
}

#innerColumnRight {
	float:right;
	width:220px;
}

#innerColumnRight ul {
	list-style-type:none;
	margin:0px;
	padding:0px;
	text-align:left;
}

#innerColumnRight li {
	margin:2px 0px 2px 0px;
}

/* The form modules */
#signUpForm form, #signUpForm fieldset {
	margin:0px;
	padding:0px;
	border:none;
}

#signUpForm fieldset {
	margin:2px 0px 8px 0px;
}
#signUpForm ul {
	margin:0px;
	padding:8px;
	list-style-type:none;
}

#signUpForm li {
	clear:both;
}

#signUpForm em {
	color:#FF0000;
}

#signUpForm label {
	color:#555555;
	float:left;
	width:150px;
	text-align:right;
	margin:0px 15px 12px 0px;
}

input.formInput, textarea.formTextarea, select.formSelect, input.formInputSmall, select.formSelectSmall, input.formDate {
	background-repeat: repeat-x;
	float:left;
	background-position:bottom;
	background-color:#ffffff;
	border:1px solid #CCCCCC;
}

input.formInput.formDisabled {
	color: #ccc;
}

input.formInput {
	background-image:url(form/input_bg.jpg);
	width:160px;
}

select.formSelect {
	width:160px;
}

span.specialMessage {
	float:right;
	margin:0px 10px 0px 0px;
	color:#ff0000;
}

a#redLink {
	color:#ff0000;
	text-decoration:none;
}

a#redLink:hover {
	color:#ff0000;
	text-decoration:none;
}

input.formDate {
	width:135px;
	background-image:url(form/input_bg.jpg);
}

input.formInputSmall, input.formSelectSmall {
	background-image:url(form/input_bg.jpg);
	width:80px;
}

textarea.formTextarea {
	background-image:url(form/textarea_bg.jpg);
	width:220px;
	margin:0px 7px 0px 0px;
	float:right;
}

input.formButton {
	float:right;
	margin:0px 15px 0px 0px;
}

/* PNG based module within form */
#innerFormBG {
	background-image:url(form/inner_form_bg_top.jpg);
	background-repeat:no-repeat;
	width:375px;
	margin:0 auto;
	text-align:center;
}

#nestedInnerForm {
	padding:15px;
}

#innerFormBottom {
	background-image:url(form/inner_form_bg_bot.jpg);
	background-repeat:no-repeat;
	width:375px;
	height:18px;
	margin:0 auto;
}

#siteMap ul {
	list-style-type:none;
	padding:0px;
	margin:0px;
}

#siteMap li {
	border-bottom:1px solid #cccccc;
	padding:5px 0px 5px 0px;
}

/* Date picker styles */
.emptySlot {
	width: 30px;
	position:relative;
	float: left;
	padding: 2px 0px 2px 0px;	
	border-bottom: 1px solid #dddddd;
}
.fullSlot {
	cursor: pointer;
	position:relative;
	width: 30px;
	text-align: center;
	float: left;
	color: #333333;
	padding: 2px 0px 2px 0px;
	border-bottom: 1px solid #cccccc;
}
.currentDay {
	width: 28px;
	border-left: 1px solid #cccccc;
	border-right: 1px solid #cccccc;
	font-weight: bold;
	background-color: #fcf8d5;
}
.calendar{
	width: 210px;
	margin-top: 10px;
	background-color: #FFFFFF;
	float:left;
	border:1px solid #cccccc;
}
.slotContainer {
	width: 210px;
	background-image:url(calendar/smallGradient.gif);
	background-repeat:repeat-x;
	clear:both;
}

.slotContainer:after {
	content:".";
	visibility:hidden;
	height:0;
	display:block;
	clear:both;
}
.title {
	width: 210px;
	height: 30px;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 12px;
	font-weight: bold;
	text-align: center;
	background-color: #f0f0f0;
	color: #666666;
	border-bottom: 1px solid #cccccc;
	padding: 4px 0px 4px 0px;
	vertical-align:middle;
	display:table-cell;
	background-image:url(calendar/smallGradient2.gif);
	background-repeat:repeat-x;
	background-position:bottom;
}
.columnHeader {
	padding: 4px 0px 4px 0px;
	position:relative;
	width: 30px;
	text-align: center;
	float: left;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 11px;
	font-weight: bold;
	background-image:url(form/input_bg.jpg);
	background-repeat:repeat-x;
	background-position:bottom;
	color: #666666;
	border-bottom: 1px solid #cccccc;
}

.dateButton {
	margin:0px 0px 0px 5px;
	cursor:pointer;
}
.titleContainer{
	position:relative;
}
.navPrev, .navNext {
	width:21px;;
	height:20px;
	position:absolute;
	top:5px;
	cursor:pointer;
	background-repeat:no-repeat;
}
.navPrev {
	background-image:url(calendar/leftUp.gif);
	left:5px;
}
.navPrev:hover {
	background-image:url(calendar/leftOver.gif);
}
.navPrev:down {
	background-image:url(calendar/leftDown.gif);
}
.navNext {
	right:5px;
	background-image:url(calendar/rightUp.gif);
}
.navNext:hover {
	background-image:url(calendar/rightOver.gif);
}
.navNext:down {
	background-image:url(calendar/rightDown.gif);
}