/*
	JACKS PAINT & HARDWARE STYLESHEET
	developed by Digital Valley (www.digitalvalley.co.za)
*/

body {
	margin-left: auto;
	margin-right: auto;
	margin-top: 0px;
	min-width: 900px;
	width: 850px;
	text-align: center;
	background-color: #222222;
	font-family: verdana;
}

#main {
	width: 850px;
	text-align: left;
	background-color: #D43037;
	vertical-align: top;
}

#left {
	float: left;
	width: 588px;
}

#right {
	float: right;
	width: 262px;
	background-color: #EFDD01;
	background-image: url(images/rightBottom.gif);
	background-position: left bottom;
	background-repeat: no-repeat;
}

#clearFloats {
	clear: both;
}

#mainContent {
	float: left;
	padding-bottom: 4px;
	vertical-align: top;
	font-size: 11px;
	color: #FFFFFF;
	line-height: 18px;
	text-align: justify;
	width: 100%;
}

#leftContent {
	/*
	padding-left: 18px;
	padding-right: 18px;
	padding-top: 18px;
	padding-bottom: 18px;
	*/

	padding-bottom: 4px;
	vertical-align: top;
	font-size: 11px;
	color: #FFFFFF;
	line-height: 18px;
	text-align: justify;
}

#rightContent {
	vertical-align: top;
	font-size: 11px;
	color: #333333;
	line-height: 18px;
	text-align: center;
	/* margin-bottom: 17px; */
	margin-bottom: 60px;
}

#rightContent a, #rightContent a:visited, #rightContent a:active {
	font-weight: bold;
	color: #D43037;
	text-decoration: none;
}

#rightContent a:hover {
	text-decoration: underline;
}

#right p {
	text-align: justify;
}

#left object {
  float: left;
}

#left a, #left a:visited, #left a:active {
	color: #FFFFFF;
	text-decoration: none;
}

#left a:hover {
	text-decoration: underline;
}

#mainContent a, #mainContent a:visited, #mainContent a:active {
	color: #FFFFFF;
	text-decoration: none;
}

#mainContent a:hover {
	text-decoration: underline;
}

#mainContent h3 {
	background-image: url(images/hdr_bar_lg.gif);
}

#main table {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 11px;
	color: #FFFFFF;
	line-height: 18px;
	text-decoration: none;
	margin-left: 28px;
	margin-right: 28px;
}

#main table p {
	padding: 0px;
}

#footer {
	width: 850px;
	height: 80px;
	background-image: url(images/paint_splat.gif);
	background-position: left top;
	background-repeat: no-repeat;
	clear: both;
	margin: 0px;
	padding-top: 10px;
}

#footerContent {
	font-size: 10px;
	color: #FFFFFF;
}

#footer a {
	font-weight: bold;
	color: #EFDD01;
	text-decoration: none;
}

#footer a:hover {
	text-decoration: underline;
}

#footer_index {
	width: 750px;
	height: 80px;
	clear: both;
	margin: 0px;
	padding-top: 10px;
}

#footer_index a {
	font-weight: bold;
	color: #EFDD01;
	text-decoration: none;
}

#footer_index a:hover {
	text-decoration: underline;
}

#header {
	min-width: 850px;
	width: 850px;
	height: 100px;
	background-color: #D43037;
}

#headerContent {
	margin-bottom: 18px;
}

#mainNav {
	float: left;
	padding-top: 12px;
	padding-left: 18px;
}

#mainNav a {
	font-size: 12px;
	font-weight: bold;
	color: #FFFFFF;
	text-decoration: none;
	margin-right: 12px;
}

#mainNav a:hover {
	text-decoration: underline;
}

p {
	padding-left: 28px;
	padding-right: 28px;
}

h2 {
	font-size: 18px;
	color: #EFDD01;
	padding-top: 18px;
	text-transform: uppercase;
}

h3 {
	font-size: 12px;
	height: 34px;
	vertical-align: middle;
	background-image: url(images/hdr_bar.gif);
	background-position: 16px 0px;
	background-repeat: no-repeat;
	padding-top: 7px;
	padding-left: 28px;
	padding-right: 28px;
	clear: left;
	color: #FFFFFF;
}

.home #leftContent h3 {
	background-image: url(images/hdr_bar_home.gif);
	color:#000000;
}

h4 {
	font-size: 12px;
	color: #D43037;
}

h5 {
	font-size: 12px;
	color: #FFFFFF;
	padding-top: 30px;
}

select {
	width: 210px;
	border-style: solid;
	border-width: 1px;
	border-color: #E6DD5A;
	background-color: #FCF066;
}

select.shorter {width:120px;}

input {
	border-style: solid;
	border-width: 1px;
	border-color: #EFDD01;
}

textArea {
	border-style: solid;
	border-width: 1px;
	border-color: #EFDD01;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 12px;
}

.tbl_contact input {
	width: 250px;
	border-style: solid;
	border-width: 1px;
	border-color: #EFDD01;
	margin-left: 10px;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 11px;
}

.tbl_contact textArea {
	width: 370px;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 11px;
}

.tbl_contact select {
	width: 250px;
	margin-left: 10px;
}

.tbl_contact .button {
	width: 115px;
	border-style: solid;
	border-width: 1px;
	border-color: #FFFFFF;
	background-color: #EFDD01;
	font-weight: bold;
	color: #D43037;
}

/* Right column boxes */

.box a {font-size: 12px; color: #00476F; }
#box_search { padding: 0 36px; height: 130px; text-align: left; background: url("images/bg_box_search.gif") left top no-repeat; }
#box_chat { padding: 0 36px; height: 130px; text-align: left; background: url("images/bg_box_chat.gif") left top no-repeat; }
#box_calc { padding: 0 36px 0 28px; height: 170px; text-align: left; background: url("images/bg_box_calc.gif") left top no-repeat; }
#box_calc p {padding: 0;}
#box_calc h5 {margin-top: 10px}
#box_login { margin: 0 auto; width: 253px; height: 180px; text-align: center; background: url(images/bg_box_login.gif) left top no-repeat; }
#box_login table td { color: #333333; }

#logospread { width: 420px; height: 60px; margin: 0 auto; padding: 25px 0 5px 0; clear:both }
#logospread img {padding: 0 15px;}

#subNav {
	background-color: #C43037;
	border-style: solid;
	border-width: 1px;
	border-color: #A43037;
	padding: 8px;
	margin-left: 18px;
	margin-right: 18px;
}

#subNav a {
	margin-left: 8px;
	margin-right: 8px;
}

#message {
	background-color: #FFFFFF;
	border-style: solid;
	border-width: 1px;
	border-color: #EFDD01;
	padding: 8px;
	margin-left: 18px;
	margin-right: 18px;
	color: #000000;
}

.table_calc {
	vertical-align: top;
	font-size: 11px;
	color: #000000;
	line-height: 18px;
	text-align: justify;
	background-image: url(images/lg_calculator.jpg);
	padding: 18px;
	width: 520px;
}

#selectBox {
	margin-bottom: 10px;
}
#selectBox select {margin:5px;}

.store_name {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 14px;
	font-weight: bold;
	color: #FFFFFF;
}

.pic_border {
	border: 2px solid #FFFFFF;
	color: #FFFFFF;
}

.store_details {
	background-color: #FFFFFF;
	border-style: solid;
	border-width: 2px;
	border-color: #000000;
}

.store_details td {
	font-size: 10px;
	color: #000000;
}

#franchiseBox {
	border-style: solid;
	border-width: 1px;
	border-color: #FFFFFF;
	background-image: url(images/jacks_building_sm.jpg);
	background-position: left bottom;
	background-repeat: no-repeat;
	background-color: #333333;
	padding: 8px;
	margin: 5px 15px 15px 30px;
	width: 296px;
	height: 150px;
	float: right;
	color: #FFFFFF;
}

#franchiseBox a, #franchiseBox a:visited {
	color: #EFDD01;
	text-decoration: none;
}

#franchiseBox a:hover {
	text-decoration: underline;
}

#franchise_sidePics {
	float: right;
	margin-top: -50px;
	margin-right: 8px;
	position: relative;
}

#blackBox {
	border-style: solid;
	border-width: 1px;
	border-color: #FFFFFF;
	background-color: #333333;
	padding: 8px;
	margin: 16px;
	width: 40%;
	float: right;
	color: #FFFFFF;
}

#blackBox a, #blackBox a:visited {
	color: #EFDD01;
	text-decoration: none;
}

#blackBox a:hover {
	text-decoration: underline;
}

/*
  Daniel Dinnie's new css bits from here on
*/

.white {
  color:#FFFFFF;
}

.white_no_break {
	color: #FFFFFF;
	display: inline;
}

#leftStore {
	padding-left: 18px;
	padding-right: 18px;
	padding-top: 18px;
	padding-bottom: 18px;
	vertical-align: top;
	font-size: 11px;
	color: #FFFFFF;
	line-height: 18px;
	text-align: justify;
}

select.select_50 {
	width: 50px;
	border-style: solid;
	border-width: 1px;
	border-color: #E6DD5A;
	background-color: #FCF066;
}

#view_store_left {
	float:left;
	width:20%;
}

#view_store_middle {
	font-size: 11px;
	float:left;
	width:60%;
	background-color:#D43037;
	height:100%;
	color: #FFFFFF;
}

#view_article_left {
	float:left;
	width:20%;
	height:100%;
}

#view_article_middle {
	font-size: 11px;
	float:left;
	width:60%;
	background-color:#D43037;
	height:100%;
	color: #FFFFFF;
}

#view_all_article_left {
	float:left;
	width:20%;
	height:100%;
}

#view_all_article_middle {
	font-size: 11px;
	float:left;
	width:60%;
	background-color:#D43037;
	height:100%;
	color: #FFFFFF;
}

#select_160 {
	width: 160px;
	border-style: solid;
	border-width: 1px;
	border-color: #E6DD5A;
	background-color: #FCF066;
}

.button {
	border-style: solid;
	border-width: 1px;
	border-color: #FFFFFF;
	background-color: #EFDD01;
	font-weight: bold;
	font-size: 11px;
	color: #D43037;
	text-decoration: none;
	text-align: center;
	text-transform: uppercase;
	padding-top: 2px;
	padding-bottom: 2px;
	padding-left: 4px;
	padding-right: 4px;
}

.button:hover {
	background-color: #D43037;
	font-weight: bold;
	color: #EFDD01;
}

/*
   end of Daniel Dinnie's bits
*/



/*
	Luke's css from here on
*/

table .table_heading
{
	background-color: #C43037;
	text-align: center;
	font-weight: 700;
	white-space: nowrap;
}

table .table_heading2
{
	background-color: #C43037;
	border: solid #A43037 1px;
	text-align: center;
	font-weight: 700;
	font-size: 130%;
	white-space: nowrap;
}

table .table_data, .table_data_alt
{
	white-space: nowrap;
}

table .table_button, .table_button_alt
{
	text-align: right;
	white-space: nowrap;
}

table .table_button_alt
{
	background-color: #A43037;
}

table .table_data_alt
{
	background-color: #A43037;
}

table.table_form
{
}

table.table_display
{
}

#eye
{
	height: 300px;
	width: 640px;
	border: solid 1px #C43037;
}

#message_entries
{
	list-style: none;
	margin-left: 10px;
}
#message_entries li
{
	width: 520px;
}

div.chatDiv
{
	margin-left: 20px;
	width: auto;
}

#new_message
{
	width: 635px;
}

#chatButtons
{
	text-align: right;
	padding: 10px 0px 10px 0px;
}

#cms_footer {
	width: 100%;
	height: 50px;
	clear: both;
	margin: 0px;
	padding-top: 10px;
	background-color: #C43037;
}

#cms_main {
	width: 100%;
	text-align: left;
	background-color: #D43037;
	vertical-align: top;
}

#cms_header {
	width: 100%;
	height: 100px;
	background-color: #D43037;
}

/*
	End of Luke's Css
*/

/* new css, added by matt from 19-03-2009 */
/*#news_headlines {width: 150px; padding: 10px; font-family: verdana; font-size: 11px; color: #fff; background: #aa3033;}*/
#news_headlines, #news_archive, #advice_archive {margin:0 auto; width:253px; height:180px; color:#D43037; text-align:left; background:url("images/bg_box_login.gif") left top no-repeat;}
#news_headlines {font-size: 10px; }
#news_headlines h5, #news_archive h5, #advice_archive h5 {margin-bottom:6px; text-align:center;}
#news_headlines {margin-top: 12px; padding: 0; /*list-style: none;*/}
/*#news_headlines ul li {margin: 2px 0; padding: 0 0 5px 0; text-align:left;}
#news_headlines ul li a {font-weight: bold; color: #D43037;}
#news_headlines ul li a:hover {text-decoration: underline; background: none;}*/
#news_archive {height:127px; background: url("images/bg_news_search.gif") left top no-repeat;}
#news_archive table {width:195px; color:#D43037;}
#advice_archive table {color:#D43037;}
#advice_archive select {width:190px;}

#news_search {width:120px; height:16px;}

.news_item { margin-bottom: 15px; padding-bottom: 15px; border-bottom: solid 1px #eee; }
.news_item h3 a { font-weight: normal; }

.backlink {width:550px; margin-top:-10px; padding:0 10px; text-align:right;}
.news_image {float:left; margin:8px 10px 8px 0px;}
.news_detail {width:560px; margin-left:14px;}
#extra_news_images {float:left; clear:both; width:570px; margin-left:14px;}
.news_thumbs {width:144px; margin:10px 5px 0 0px; border:3px solid #000;}

/* Layout structure */
#loading {position:absolute; z-index:100; top:0; left:0; width:100%; height:100%; padding-top:40%; text-align:center; font-size:2em; color:#333; background:#FFF;}
#loading p {font-size:0.5em;}

.clear {clear:both;}

/* promotions */
#redbrush {float:left; width:700px; margin-left:26px; margin-top:10px; color:#333; background:url("images/bg_red_brush_promo.jpg") top left no-repeat;}
#redbrush div {width:677px; margin:135px 10px 0; padding:15px 0; background:#FAE62F;}
#redbrush .preview {margin:25px; float: left; border:0;}
#redbrush .view {margin:25px; margin-left:420px; border:0;}
#redbrush h4 {margin: 20px 0 0 20px; font-size: 18px; color:#D43037; text-transform: uppercase;}
.promo {float:left; width:312px; height:270px; margin:30px 0 0 36px; border:2px solid #EFDD01; background:#333;}
.promo img {border:0;}

/* flash divs */

#flashcontent {width: 588px; text-align: center; clear: both; background:#D43037; margin-bottom: 15px}
#flashcontent h1, #flashmenu h1 {font-size: 18px; color: #EFDD01; text-transform: uppercase; letter-spacing: 1px;}
#flashcontent a, #flashmenu a {font-weight: bold;}
#flashcontent a, #flashmenu a {font-weight: bold; color: #EFDD01; text-decoration: none;}
#flashcontent a:hover, #flashmenu a:hover {text-decoration: underline;}
#flashmenu {width:850px; height:100px; text-align: center; clear: both; background:#222222; color:#FFFFFF}

/* Franchise */

.contactFranchise {
	float: right;
	display: block;
	width: 200px;
	margin: 0 46px;
	padding: 10px;
	background:#333333;
	border:#FFE500 1px solid;
	font-size: 14px;
	text-align:justify;
	line-height: 22px;
}