/*---------------------------------------------

Filename: FAMOA_Styles.css
Title: Main Styles for www.famoa-incentive.co.uk
Author: Rachael Coultas - rachael@firstmedia.co.uk

Look but don't touch!

Background Blue: #cff0fc
Nav Blue: #e4eaf1
Nav Grey: #727272
Nav Blue divider: #7a93b5
Nav Selection: #416493
Nav Dark Blue: #00285e

h1 Blue: #355a8a
Product h1 Blue: #082f64
Red: #8b0808

------------------------------------------------- Body -------------*/

body {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 100%;	
	line-height: 100%;
	text-align: center;
	padding: 0px;
	margin: 0px;
	background-color: #cff0fc;
}
* {margin: 0px; padding: 0px;}

a img {
	border: none;
}


/*----------------------------------------------- Framework----------*/

#wrapper {
	width: 900px;
	margin: 0px auto;
	text-align: left;
	background-color: #FFFFFF;
	padding-bottom: 20px;
}

#leftcol {
	float: left;
	width: 180px;
	margin: 0px 30px 20px 30px;
}

#content_wrap {
	width: 630px;
	float: left;
	margin-bottom: 20px;
}
	
#twocol #main_content {
	width: 630px;
	float: right;
	background-color: #FFFFFF;
}
#twocol #rightcol {
	display: none;
}
#threecol #main_content {
	float: left;
	width: 440px;
	background-color: #FFFFFF;
	mar
}
#threecol #main_content.indexpage {
	float: left;
	width: 300px;
	background-color: #FFFFFF;
	mar
}
#threecol #rightcol {
	float: right;
	width: 180px;
	background-color: #ebf0f5;
}
#threecol #rightcol.index {
	float: right;
	width: 300px;
	min-height:275px;
	margin-bottom:10px;
	background-color: #0099CC;
	-moz-border-radius: 5px;
-webkit-border-radius: 5px;
}
#threecol #rightcol.index p {
font-size:12px; margin:10px; color:#FFFFFF;
}

/*----------------------------------------------- Header -----------*/

#header {
	width: 840px;
	height: 140px;
	margin: 0px auto;
	background-color: #FFFFFF;
}
#header img {
	margin: 35px 0px 0px 0px;

}
#header ul {
	list-style: none;
	margin: 0px;
	padding: 35px 0px 0px 0px;
	text-align: right;
}
#header li {
	float: right;
}
#header a:link, #header a:visited {
	display: block;
	color: #929292;
	text-decoration: none;
	font-size: 0.7em;
	font-weight: bold;
	padding: 0px 8px;
}
#header a:hover {
	color: #929292;
	text-decoration: underline;
}


/*----------------------------------------------- Main Navigation --*/

#main_nav {
	width: 840px;
	height: 35px;
	background: url(../assets/nav_back.jpg) repeat-x top center;
	margin-left: 30px;
}
#main_nav ul {
	list-style: none;
	margin: 0px;
	padding: 0px;
}
#main_nav li {
	float: left;
}
#main_nav a:link, #main_nav a:visited {
	display: block;
	color: #00285e;
	text-decoration: none;
	border-right: #7a93b5 1px solid;
	font-size: 0.8em;
	line-height: 35px;
	font-weight: bold;
	padding: 0px 12px;
}
#main_nav a:hover {
	background-color: #416493;
	color: #FFFFFF;
}

body.home a#nav_home,
body.points a#nav_points,
body.works a#nav_works,
body.special a#nav_offers,
body.product a#nav_products,
body.delivery a#nav_delivery,
body.account a#nav_account,
body.contact a#nav_contact {
	background-color: #416493;
	color: #FFFFFF;
}


/*----------------------------------------------- Title ------------*/

#title {
	width: 840px;
	height: 100px;
	margin: 0px 0px 20px 30px;
	border-bottom: 1px solid #999999;
}
body.home #title {background: url(../assets/titles/home.jpg) repeat-x top center;}
body.products #title {background: url(../assets/titles/product_range.jpg) repeat-x top center;}
body.delivery #title {background: url(../assets/titles/delivery.jpg) repeat-x top center;}
body.contact #title {background: url(../assets/titles/contactus.jpg) repeat-x top center;}
body.special #title {background: url(../assets/titles/special_offers.jpg) repeat-x top center;}
body.points #title {background: url(../assets/titles/points.jpg) repeat-x top center;}
body.account #title {background: url(../assets/titles/account.jpg) repeat-x top center;}
body.login #title {background: url(../assets/titles/login.jpg) repeat-x top center;}
body.works #title {background: url(../assets/titles/howitworks.jpg) repeat-x top center;}
body.basket #title {background: url(../assets/titles/basket.jpg) repeat-x top center;}

#breadcrumbs {
	margin-top: 0px;
	font-size: .7em;
	font-weight: bold;
	color: #999999;
	padding-top: 75px;
}
#breadcrumbs a:link, #breadcrumbs a:visited {
	color: #999999;
	text-decoration: none;
}
#breadcrumbs a:hover {
	color: #00285e;
	text-decoration: underline;
}




/*---------------- Left Column Navigation --*/

#leftcol ul {
	margin: 0px;
	padding: 0px;
	list-style: none;
}
#leftcol li {
	display: inline;
}
#leftcol a:link, #leftcol a:visited {
	display: block;
	color: #727272;
	text-decoration: none;
	font-size: 0.75em;
	font-weight: bold;
	border-bottom: solid 1px #b2c0d1;
	padding: 5px 20px;
	background-color: #e4eaf1;
}
#leftcol a:hover {
	background-color: #FFFFFF;
	color: #355a8a;
}	

/*-------------------------- Main Content --*/

#main_content h1 {
	color: #355a8a;
	font-size: 1.5em;
	margin-bottom: 20px;
}	
#main_content h2 {
	color: #355a8a;
	font-size: 1.2em;
	margin-bottom: 5px;
}
#main_content p {
	color: #686868;
	font-size: 0.75em;
	margin-bottom: 20px;
	line-height: 1.2em;
}
#main_content td {
	color: #686868;
}
#main_content p.label { font-size: 0.7em; line-height: 1em; font-weight:bold;}

#main_content ul {
	list-style: none;
	padding: 0px;
	margin: 0px 0px 20px 0px;
}
#main_content li {
	background: url(../assets/blue_bullett.gif) no-repeat left center;
	color: #686868;
	font-size: 0.75em;
	padding-left:20px;
	margin-left: 20px;
}
#main_content li a:link, #main_content li a:visited {
	color: #686868;
	font-size: 0.8em;
	line-height: 1.5em;
	text-decoration: none;
	padding-left: 13px;
	font-weight: bold;
	
}
#main_content li a:hover {
	text-decoration: underline;
	color: #355a8a;
}



/*-------------------------- Right Column --*/

#rightcol h1 {
	color: #355a8a;
	font-size: 1.2em;
	margin-bottom: 10px;
	padding:10px 10px 0px 10px;
	color:#FFFFFF;
}	
#rightcol p {
	color: #fff;
	font-size: 0.7em;
	margin-bottom: 5px;
	line-height: 1.5em;
}



/*-- Shopping Basket --*/

#basket {
	background: url(../assets/shopping_basket.jpg) no-repeat top center;
	padding: 38px 0px 0px 0px;
	cursor:hand;
}
#yourpoints {
	background: url(../assets/yourpoints.jpg) no-repeat top center;
	padding: 38px 0px 0px 0px;
}
div#basket div.item h1, div#yourpoints h1 {
	display: block;
	background-color: #b1bfd3;
	color: #FFFFFF;
	font-size: .8em;
	padding: 10px;
}
div#basket div.item h1 span, div#yourpoints h1 span {
	color: #062e62;
	padding-left: 8px;
	font-size: 1.2em;
}
	
#basket span.title, #yourpoints span.title {
	color: #00285e;
	font-size: .8em;
	line-height: 1.4em;
	font-weight: bold;
	padding: 0px 20px 5px 10px;
	display: block;
}
#basket span.size, #yourpoints span.size {
	font-size: .75em;
	color: #666666;
	padding: 0px 20px 10px 10px;
	float: left;
}
#basket span.points, #yourpoints span.points {
	font-size: .75em;
	color: #8b0808;
	padding: 0px 10px 10px 10px;
	font-weight: bold;
	float: right;
}
.checkout_butt {
	float: right;
	padding: 0px 10px 10px 0px;
}

/*-------------------------- Tables --*/

#table_points td.border {
	border-bottom: 1px solid #999999;
	font-size: .8em;
	color: #666666;
}
#table_points .price {
	font-size: 1.3em;
	font-weight: bold;
	color: #355a8a;
}
#table_basketitem .title {
	color: #355a8a;
	font-size: 1em;
	font-weight: bold;
	margin-bottom: 10px;
	display: block;
}
#table_basketitem .size {
	color: #666666;
	font-size: 1em;
	margin-bottom: 10px;
}
#table_basketitem .points {
	color: #686868;
	font-size: 0.8em;
	margin-bottom: 10px;
}


#tblOrderHistory .header {
	background: url(../assets/title_back.jpg);
	color: #ffffff;
	font-size: 0.7em;
	font-weight:bold;
	padding: 5px;

}
#tblOrderHistory td {
	border: 1px solid #999999;
	font-size: .7em;
	color: #666666;
	padding: 5px;
}

#tblPersonalDetails td {
	
	font-size: .8em;
	color: #666666;
	padding: 5px;
}

#tblSummary td {
	
	font-size: .8em;
	color: #666666;
	padding: 5px;
}

/*-------------------------- Form --*/

form#login {
	width: 60%;
}
fieldset {
	background-color: #f5fcfe;
	border: 1px solid #d5dce6;
	padding: 20px;
	margin-bottom: 15px;
}
legend {
	color: #355a8a;
	font-size: .7em;
	text-transform: uppercase;
	font-weight: bold;
	position: relative;
	top: -27px;
	left: -8px;
}
input {
	margin-bottom: 10px;
}
input#submit {
	margin-bottom: 0px;
}
label {
	font-size: .7em;
	font-weight: bold;
	color: #666666;
}
	


form#purchase_points {
 	background-color: #FFFFFF;
	width: 300px;
	margin: 20px 20px 20px 0px;	
}

form#purchase_points hr {
	border: none;
	background-color: #98abc3;
	color: #98abc3;
	height: 1px;
 	width: 285px;
	text-align: left;
	margin: 0px;
	padding: 0px;
}
form#purchase_points h1 {
	font-size: 0.85em;
	color: #2e5384;
	font-weight: bold;
	margin: 10px 0px;	
}
form#purchase_points .point_price {
	color: #686868;
	float: right;
	margin: -15px 20px 10px 0px;
}
form#purchase_points p {
	font-size: 0.65em;
	color: #686868;
	font-weight: bold;
	margin: -10px 0px 5px 18px;	
}
form#purchase_points input {
	margin-top: 2px;
	margin-left: 0px;
}
form#purchase_points input.btn {
	float: right;
	margin: 15px -45px 20px 0px;
}

.error {
	color: #990000;
	font-weight: bold;
}

/*-------------------------- Float Right Div --*/

.float_right {
	width: 181px;
	height: 136px;
	background-color: #ebf0f5;
	float: right;
	margin-top: 20px;
}

#main_content .float_right p {
	margin: 15px 0px 0px 8px;
}

#main_content .float_right .total_points {
	color: #062e62;
	float: left;
	margin-top: -3px;
	padding: 6px 58px 6px 15px;	
	display: block;
	background-color: #c7d2e0;
	font-weight: bold;
	font-size: 0.75em;
}

.float_right .total_points strong {
	color: #8b0808;
	font-weight: bold;
}

#main_content .float_right p .points {
	color: #8b0808;
	float: right;
	margin-top: -16px;
	margin-right: 8px;
	font-weight: bold;
}

/*-------------------------- Products --*/

div.item {
	border-bottom: 1px solid #999999;
	margin-bottom: 15px;
}

div.item img {
	float: left;
	margin: 0px 10px 10px 0px;
}

#main_content .description {
	color: #062e62;
	font-size: 0.85em;
	font-weight: bold;
	margin-bottom: 5px;
}

#main_content .sizes {
	color: #686868;
	font-size: 0.75em;
	font-weight: bold;
	margin-bottom: 0px;
}

#main_content .points {
	color: #8b0808;
	font-size: 1em;
	font-weight: bold;
	margin-top: 10px;
}

img.add_basket {
	border: none;
	margin-bottom: 40px;
}



/*------------------------------------------------ Footer ----------*/

#footer {
	width: 840px;
	height: 50px;
	background: url(../assets/footer_back.jpg) repeat-x top center;
	clear: both;
	margin-left: 30px;
}
#footer .left {
	color: #385c8b;
	font-size: 0.8em;
	margin-left: 20px;
	padding-top: 10px;
	float: left;
}
#footer .right {
	color: #385c8b;
	font-size: 0.8em;
	margin-right: 20px;
	padding-top: 10px;
	float: right;
}
#footer a:link, #footer a:visited {
	color: #385c8b;
	text-decoration: none;
}	
#footer a:hover {
	color: #00285e;
	text-decoration: none;
}
	
	
	
/*------------------------------------------------ Hacks and Filters ----------*/

.clearfix {
	clear: both;
	width: 100%;
}
	
	
