/* 
   --------------------------- Copyright Notice ---------------------------------
   All information, images and any parts thereof on this web site are the 
   property of Vaal Media CC, and are published under the name 
   of Home Guru. 
   
   No part of this web site may be stored, reproduced, transmitted, recorded, 
   translated, or used to produce derivative works in any manual or electronic 
   and automated form (e.g. by means of electronic, photographic or mechanical 
   methods), without written permission from Vaal Media CC. 
     
   http://www.homeguru.co.za
   Copyright (C) Vaal Media CC
   ------------------------------------------------------------------------------
*/

/* --- Page properties --- */

body {
	background-color: #666666;
	margin-top: 5px;
	margin-right: 2%;
	margin-bottom: 5px;
	margin-left: 2%;
}

/* --- Location formating for the logo that appears at the top of the page --- */

#logoimg {
	padding-top: 5px;
	padding-right: 5px;
	padding-bottom: 5px;
	padding-left: 10px;
	margin-top: 0px;
	margin-right: 0px;
	margin-bottom: 0px;
	margin-left: 0px;
}

/* --- Site navigation that appears at the very top of the page in the row above the logo --- */

#flagnav {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 10px;
	color: #CCC;
	background-color: #333;
	height: 12px;
	margin: 0px;
	padding-top: 2px;
	padding-right: 5px;
	padding-bottom: 2px;
	padding-left: 2px;
	border: 2px solid #000;
}

#flagnav a {
	color: #CCC;
	text-decoration: underline;
}

#flagnav a:hover {
	color: #FFF;
	text-decoration: underline;
}

.searchinput  {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 9px;
	color: #333;
	margin-top: 2px;
	margin-right: 0px;
	margin-bottom: 2px;
	margin-left: 0px;
	padding: 0px;
	font-weight: bold;
	background-color: #FFF;
}

.searchbutton {
	color: #F00;
	font-size: 9px;
	font-weight: bold;
}

.inputfield {
	font-size: 10px;
	font-family: Arial, Helvetica, sans-serif;
	margin-top: 1px;
	margin-bottom: 1px;
}
/* --- The main table that encloses all the components on the page --- */

#tablemain {
	background-color: #1f1a17;
}

/* --- The left column of the main table --- */

#leftcol {
	font-family:Arial, Helvetica, sans-serif;
	vertical-align: top;
	border-right-width: 1px;
	border-right-style: dotted;
	border-right-color: #666666;
	margin: 0px;
	padding: 0px;
}

#leftcol h1 {
	font-size: 11px;
	color: #FFFF00;
	text-align: center;
	text-transform: capitalize;
	background-color: #333;
	margin: 0px;
	padding: 1px;
	background-image: url(../img/blacktile.gif);
	background-repeat: repeat-x;
	font-weight: bold;
	border-bottom-width: 2px;
	border-bottom-style: solid;
	border-bottom-color: #F00;
	background-position: bottom;
}

#leftcol h2 {
	text-transform: capitalize;
	color: #F00;
	font-size: 11px;
	padding-left: 2px;
	text-align: center;
	padding-right: 2px;
	margin-top: 3px;
	margin-bottom: 3px;
}

#leftcol h3 {
	font-size: 11px;
	color: #FFFFFF;
	text-align: left;
	font-weight: normal;
	margin-left: 5px;
}

#leftcol p {
	font-size:10px;
	color:#FFFFCC;
	margin-top: 0px;
	margin-bottom: 8px;
	text-align: justify;
	padding-right: 3px;
	padding-left: 3px;
}

#leftcol a {
	color: #FFFF00;
}

#leftcol a:hover {
	color: #990000;
}

#leftcol div {
	background-color: #000;
	margin: 0px;
	border: 3px solid #F00;
	padding: 0px;
	text-align: center;
}

#leftcol img {
	margin-left: 15px;
}


/* --- The centre column of the main table --- */

#maincontent {
	vertical-align: top;
	font-family: "arial", serif, Times, "Times New Roman";
	color: #FF9;
	font-size: 12px;
	padding-top: 0px;
	padding-right: 5px;
	padding-bottom: 20px;
	padding-left: 5px;
}

#maincontent h1 {
	font-size: 12px;
	color: #FFFF00;
	font-weight: bold;
	background-color: #000;
	text-align: center;
	text-decoration: none;
	padding: 2px;
	text-transform: capitalize;
	margin-top: 2px;
	margin-bottom: 2px;
	background-image: url(../img/blacktile.gif);
	background-repeat: repeat-x;
	background-position: center center;
	margin-right: 1px;
	margin-left: 1px;
}

#maincontent h2 {
	font-size: 12px;
	color: #CCCCCC;
	text-decoration: none;
	border-left-width: 5px;
	border-left-style: groove;
	border-left-color: #FFFF00;
	padding-left: 3px;
	text-transform: capitalize;
	border-bottom-width: 1px;
	border-bottom-style: dotted;
	border-bottom-color: #333;
}

#maincontent h3 {
	font-size: 11px;
	color: #FFC;
	text-transform: none;
	margin-left: 2px;
	margin-top: 2px;
	margin-bottom: 2px;
	font-weight: bold;
	text-align: left;
}

#maincontent h4 {
	font-size: 14px;
	color: #FF9;
	text-align: center;	
}

#maincontent p {
	font-size: 11px;
	color: #FFFFFF;
	margin-right: 2px;
	margin-left: 2px;
	margin-top: 2px;
	margin-bottom: 2px;
}

#maincontent a {
	color: #FFFF00;
}

#maincontent a:hover {
	color: #990000;
	font-weight: bold;
}

#maincontent ul, ol {
	font-size: 11px;
	color: #FFFFFF;
}

#category p {
	color:#FFF;
	font-size:11px;
	font-weight:normal;
}

#category h3 {
	font-size: 12px;
	font-weight: bold;
	text-decoration: none;
}

#category a {
	color:#FFF;
	text-decoration: none;
	font-weight: normal;
}

#category a:hover {
	color: #FF0;
	text-decoration: none;
	font-weight: normal;
}

#category {
	padding: 3px;
	vertical-align: top;
	border-right-width: 1px;
	border-bottom-width: 1px;
	border-left-width: 1px;
	border-right-style: solid;
	border-bottom-style: solid;
	border-left-style: solid;
	border-right-color: #FF0;
	border-bottom-color: #FF0;
	border-left-color: #FF0;
}

#category th {
	color: #FF0;
	font-size: 14px;
	padding-top: 3px;
	padding-bottom: 3px;
	border-top-width: 1px;
	border-right-width: 1px;
	border-left-width: 1px;
	border-top-style: solid;
	border-right-style: solid;
	border-left-style: solid;
	border-top-color: #FF0;
	border-right-color: #FF0;
	border-left-color: #FF0;
	background-color: #000;
	background-image: url(../img/blackover.gif);
	background-repeat: repeat-x;
	background-position: center center;
}

#category ul {
	margin: 0px;
	list-style-position: outside;
	list-style-type: none;
	padding: 0px;
	
}

#category li {
	background-image: url(../img/pen.gif);
	background-repeat: no-repeat;
	background-position: left bottom;
	padding-left: 25px;
	padding-top: 4px;
	padding-bottom: 4px;
	
}






#category_mem p {
	color:#FFF;
	font-size:11px;
	font-weight:normal;
}

#category_mem h3 {
	font-size: 12px;
	font-weight: bold;
	text-decoration: none;
}

#category_mem a {
	color:#FFF;
	text-decoration: none;
	font-weight: normal;
}

#category_mem a:hover {
	color: #FF0;
	text-decoration: none;
	font-weight: normal;
}

#category_mem {
	padding: 3px;
	vertical-align: top;
	border-right-width: 1px;
	border-bottom-width: 1px;
	border-left-width: 1px;
	border-right-style: solid;
	border-bottom-style: solid;
	border-left-style: solid;
	border-right-color: #FF0;
	border-bottom-color: #FF0;
	border-left-color: #FF0;
}

#category_mem th {
	color: #FF0;
	font-size: 14px;
	padding-top: 3px;
	padding-bottom: 3px;
	border-top-width: 1px;
	border-right-width: 1px;
	border-left-width: 1px;
	border-top-style: solid;
	border-right-style: solid;
	border-left-style: solid;
	border-top-color: #FF0;
	border-right-color: #FF0;
	border-left-color: #FF0;
	background-color: #000;
	background-image: url(../img/blackover.gif);
	background-repeat: repeat-x;
	background-position: center center;
}

#category_mem ul {
	margin: 0px;
	list-style-position: outside;
	list-style-type: none;
	padding: 0px;
	
}

#category_mem li {
	background-image: url(../img/newmem.gif);
	background-repeat: no-repeat;
	background-position: left bottom;
	padding-left: 35px;
	padding-top: 4px;
	padding-bottom: 4px;
	
}

/* --- The right hand column of the main table --- */

#rightcol {
	padding-top: 0px;
	padding-right: 5px;
	padding-bottom: 10px;
	padding-left: 2px;
	vertical-align: top;
	border-left-width: 1px;
	border-left-style: dotted;
	border-left-color: #666666;
	font-family: Arial, Helvetica, sans-serif;
}

#rightcol h1 {
	font-size: 12px;
	color: #FFFF00;
	text-transform: capitalize;
	text-align: center;
	padding-top: 1px;
	border-top-width: 1px;
	border-top-style: solid;
	border-top-color: #666666;
	border-bottom-width: 1px;
	border-bottom-style: solid;
	border-bottom-color: #666666;
	padding-bottom: 1px;
	margin-top: 2px;
	margin-bottom: 2px;
	margin-right: 0px;
	margin-left: 0px;
}

#rightcol h2 {
	color: #999999;
	font-size: 12px;
	margin-left: 1px;
}

#rightcol h3 {
	font-size: 11px;
	color: #FFFFFF;
	font-weight: normal;
	margin-left: 1px;
}

#rightcol p{
	font-size: 11px;
	color: #FFFF99;
	margin-left: 1px;
}

#rightcol a {
	color: #FFFF00;
	text-decoration: none;
}

#rightcol a:hover {
	color: #990000;
}

/* --- The main navigation located within the left column of the main table --- */

#mainnavigation div{
	float: left;
	margin-left: 20px;
	margin-top: 0px;
}

#mainnavigation li{
	list-style-type: none;
	padding: 1px;
	display: block;
	margin: 1px 1px 1px -20px;
	width: 120px;
}

#mainnavigation li a{
	font-family: Verdana, Arial, Helvetica, sans-serif;
	text-align: center;
	font-size: 11px;
	text-decoration: none;
	color: #FFFF00;
	border-top-width: 1px;
	border-right-width: 1px;
	border-bottom-width: 1px;
	border-left-width: 1px;
	border-top-style: solid;
	border-right-style: solid;
	border-bottom-style: solid;
	border-left-style: solid;
	border-top-color: #FFFFFF;
	border-right-color: #999999;
	border-bottom-color: #999999;
	border-left-color: #FFFFFF;
	display: block;
	background-color: #666666;
	list-style-type: none;
}

#mainnavigation li a:hover{
	border-top-width: 1px;
	border-right-width: 1px;
	border-bottom-width: 1px;
	border-left-width: 1px;
	border-top-style: solid;
	border-right-style: solid;
	border-bottom-style: solid;
	border-left-style: solid;
	border-top-color: #999999;
	border-right-color: #FFFFFF;
	border-bottom-color: #FFFFFF;
	border-left-color: #999999;
	color: #FFFFFF;
}

/* --- Navigation at bottom of page --- */

#bottomrow {
	margin: 5px;
	font-family: Arial, Helvetica, sans-serif;
}

#bottomrow h1{
	background-color: #333;
	font-size: 11px;
	text-align: center;
	color: #CCC;
	margin-right: 3px;
	padding-top: 1px;
	padding-bottom: 1px;
}

#bottomrow h2 {
	color: #FF0;
	font-size: 10px;
	border-bottom-width: 1px;
	border-bottom-style: solid;
	border-bottom-color: #333;
	padding-top: 1px;
	padding-right: 5px;
	padding-bottom: 1px;
	padding-left: 0px;
	margin-right: 5px;
	margin-left: 1px;
	margin-top: 3px;
	margin-bottom: 0px;
}


#bottomrow p {
	color: #999999;
	font-size: 11px;
	margin: 1px;
}

#bottomrow a {
	color: #999999;
	text-decoration: none;
}

#bottomrow a:hover {
	color: #999999;
	text-decoration: underline;
}

#form {
	background-color: #333333;
	border: 1px solid #FFFF00;
	margin-top: 2px;
	margin-bottom: 2px;
}
.notactive {
	font-weight: bold;
	color: #F00;
	font-size: 12px;
}
.activeon {
	font-size: 12px;
	font-weight: bold;
	color: #0F0;
}