/*******************************************************
TITLE: Fixed Three-Column Layout v1.0
DATE: 200801
AUTHOR: The CSS Tinderbox - http://www.csstinderbox.com
Modified by Mwalimu (the toy rental club)
*******************************************************/

/* << ----------------// General Styles //---------------->> */

body {
margin:10px;
padding:0;
font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
font-size:16px;
line-height:18px;
color:#000000;
}

p {
margin:4px 0 6px 0;
}

strong {
font-weight:bold;
}

em {
font-style:italic;
}

h1, h2, h3 {
	margin-bottom: 20px;
	text-transform: lowercase;
	font-family: Georgia, "Times New Roman", Times, serif;
	font-weight: normal;
	color: #333333;
}

h1 {
font-size:26px;
}

h2 {
font-size:23px;
}

h3 {
font-size:20px;
}

h4 {
font-size:17px;
}

ul {
margin:5px 0 5px 20px;
padding:0;
list-style-type:disc;
}

ol {
margin:5px 0 5px 30px;
padding:0;
list-style-type:decimal;
}

ul li, ol li {
margin:0 0 4px 0;
padding:0;
}

img { border: none; }

img.left {
	float: left;
	margin: 0 15px 15px 0;
}

img.right {
	float: right;
	margin: 0 15px 0 15px;
}

hr { display: none; }

.hr {
	height: 36px;
	margin-bottom: 15px;
	background: url(images/img06.gif) repeat-x left center;
}

#columnOne p, #columnTwo p, #columnThree p, #columnOne ul li, #columnTwo ul li, #columnThree ul li, #columnOne ol li, #columnTwo ol li, #columnThree ol li {
font-size:13px;
}

#columnOne h2, #columnTwo h2, #columnThree h2 {
font-size:16px;
}

/* << ----------------// Outer container that holds all the columns //---------------->> */
#mainContainer {
margin:0 auto;
padding:0;
width:980px;
overflow: hidden;
}

/* << ----------------// Header //---------------->> */
#header {
margin:0;
padding:0;
width:900px;
height:150px;
}

/* Logo */

#logo {
	float: left;
	width: 218px; 
	height: 150px;
	padding-left: 22px;
}


/* Banner */

#banner {
	float: left;
	width: 490px;
	height: 147px;
	background: url(images/banner.gif);
}

#contactus {	
	float:left;
	width: 40px;
	padding-top: 66px;
	padding-left: 40px;
	height: 47px;
}



/* << ----------------// Left column //---------------->> */
#columnOne {
float:left;
margin:0;
padding:0 5px 10px 0px;
width:230px;
background-color:#FFFFFF;
}


/* << ----------------// Sidebar //---------------->> */
#sidebar {
	width:200px;
	min-height: 100%;
	margin:0 10px 0 0px;
	padding: 0px 20px 20px 20px;
	background-color: #D00000;
}

#subhead {clear:both; margin:0px; padding:4px 20px 3px 20px; background-color:	#EEE8AA; font-family:"trebuchet ms",arial,sans-serif; color:#0065CC; font-weight:bold; font-size:120%;}
#sidebar h1 {clear:both; margin:30px 0 20px 0; padding:4px 20px 3px 20px; font-family:"trebuchet ms",arial,sans-serif; color:#FFFFFF; font-weight:bold; font-size:120%;}
#sidebar h2 {clear:both; margin:20px 10px 10px 20px; font-family:"trebuchet ms",arial,sans-serif; color:#FFFFFF; font-weight:bold; font-size:120%;}
#sidebar p {clear:both; margin:0 10px 10px 20px; color:#FFFFFF; line-height:1.3em; font-size:100%;}
#sidebar p.center {text-align:center;}
#sidebar p.right {text-align:right;}

#sidebar ul {list-style:none; margin:0.5em 10px 1.0em 20px;}
#sidebar ul li {margin:5px 0 0.2em 2px; padding:0px 0px 0 11px; line-height:1.2em; font-size:100%;}
#sidebar ol {margin:0.5em 10px 1.0em 40px !important /*Non-IE6*/; margin:0.5em 10px 1.0em 45px /*IE6*/;}
#sidebar ol li {list-style-position:outside; margin:0 0 0.4em 0; font-size:100%;}

#sidebar-grid {width:180px; border-bottom:solid 1px rgb(200,200,200);}
#sidebar-grid dt a, #sidebar-grid dt a:visited {display:block; min-height:2.0em /*Non-IE6*/; height:auto !important; height:2.0em /*IE6*/; line-height:2.0em; padding:0px 10px 0px 20px;  border-top: solid 1px rgb(200,200,200); text-decoration:none; color:#FFFFFF; font-weight:bold; font-size:110%;}
#sidebar-grid dd a, #sidebar-grid dd a:visited {display:block; min-height:1.7em /*Non-IE6*/; height:auto !important; height:1.7em /*IE6*/; line-height:1.7em; padding:0px 10px 0px 2px; border:none; font-weight:normal; text-decoration:none; color:#FFD700; font-size:110%;}
#sidebar-grid dt a:hover, #sidebar-grid dd a:hover {background-color:#6495ED; /*background-color:rgb(143,174,215) /*For blue background*/; color:rgb(42,90,138); text-decoration:none;}


/* << ----------------// Column Two //---------------->> */
#columnTwo {
float:left;
margin:0 0 0 5px;
padding:0 5px 10px 10px;
width:475px;
background-color:#FFFFFF;
}


/* << ----------------// Horizontal navigation //---------------->> */
/*Credits: Dynamic Drive CSS Library */
/*URL: http://www.dynamicdrive.com/style/ */

#navHorizontal{
padding: 0;
width: 100%;
border-top: 5px solid #D10000; /*Highlight red color theme*/
background: transparent;
voice-family: "\"}\"";
voice-family: inherit;
}

#navHorizontal ul{
margin:0;
margin-left: 40px; /*margin between first menu item and left browser edge*/
padding: 0;
list-style: none;
}

#navHorizontal li{
display: inline;
margin: 0 2px 0 0;
padding: 0;
text-transform:uppercase;
}

#navHorizontal a{
float: left;
display: block;
font: bold 12px Arial;
color: white;
text-decoration: none;
margin: 0 1px 0 0; /*Margin between each menu item*/
padding: 5px 10px 5px 10px; /*Padding within each menu item*/
background-color: #6495ED; /*Default menu color*/
border-bottom: 8px solid white;
}

#navHorizontal a:hover{
background-color: #D10000; /*Highlight red color theme*/
padding-top: 10px; /*Set padding-top value to default's padding-top + padding-bottom */
padding-bottom: 0; /*Set padding-bottom value to 0 */
border-bottom-color: #D10000; /*Highlight red color theme*/
color: white;
}

#navHorizontal .current a{ /** currently selected menu item **/
background-color: #D10000; /*Highlight red color theme*/
padding-top: 10px; /*Set padding-top value to default's padding-top + padding-bottom */
padding-bottom: 0; /*Set padding-bottom value to 0 */
border-bottom-color: #D10000; /*Highlight red color theme*/
color: white;
}

#ul {	list-style: disc outside url('images/bluebull.gif');
	font-size:16px;
	margin: 2em;
	width: 20em;
	padding: 5px 10px 5px 34px;
	line-height: 26pt;
}

#ul a:link {
color: #0000FF;
text-decoration:none;
}

a:visited {
color: #0000FF;
font-weight:bold;
text-decoration:none;
}

#ul a:hover, a:active {
color:#D00000;
text-decoration:underline;
}

/* << ----------------// Column Three //---------------->> */
#columnThree {
float:left;
margin:0;
padding:0px 2px 10px 2px;
width:240px;
background-color:#FFFFFF;
}

#columnThree h1, h2, h3, h4 {
	font-family: Georgia, "Times New Roman", Times, serif;
	font-weight: normal;
	color: #FFFFFF;
}

#columnThree h1 {
font-size:20px;
text-transform: lowercase;
}

#columnThree h2 {
text-transform: lowercase;
font-size:18px;
}

#columnThree h3 {
text-transform: lowercase;
font-size:16px;
}

#columnThree h4 {
font-size:14px;
}

#rss_parenting  {position: absolute;
		top: 220px;
		right: 60px;
		width: 240px;
		background-color: #B0E0E6; 
		color:black;
		float: right;
		border:1px solid maroon;
		font-weight:bold;
		border: 0px;
		padding: 4px; 
		margin-left: 10px;
		text-align: left;
		font-family: "Trebuchet MS", Georgia, "Times New Roman", Times, serif;
		font-size: small;
		display: block;
}

#image-main {float: left;
margin-left: 20px;
border: 0px;
clear: both;
}

#imageright {
	float: left;
	padding-top: 14px;
	padding-left: 14px; 
	display: block;
	text-decoration: none;
	border: 0px;
	clear: both;
}


#videojug  	{position: absolute;
		width: 200px;
		height: 173px;
		border: 0px;
		margin: 100px 60px 10px 10px;
		padding: 0px;
		text-align: center;
		font-family: Georgia, "Times New Roman", Times, serif;
		font-size: small;
		display: block;
}

#videojug2  	{float: left;
		width: 200px;
		height: 173px;
		border: 0px;
		padding-top: 10px;
		padding-left: 34px; 
		text-align: center;
		font-family: Georgia, "Times New Roman", Times, serif;
		font-size: small;		
}

#videojug3  	{float: right;
		width: 200px;
		height: 173px;
		border: 0px;
		padding: 0px; 
		text-align: center;
		font-family: Georgia, "Times New Roman", Times, serif;
		font-size: small;		
}

/* << ----------------// Footer //---------------->> */
#footer {
	width: 980px;
	margin: 0 auto;
	padding: 10px 0;
	background: url(images/img06.gif) repeat-x;
	border-top: 1px solid #FFFFFF;
	font-size: 16px;
}

#footer p {
	margin: 0;
	line-height: normal;
	color: #999999;
}

#footer a {
	color: #999999;
}


/* << ----------------// Fix so that the outer DIV will wrap around all floated DIVs within //---------------->> */
.clearfix:after {
content: "."; 
display: block; 
height: 0; 
clear: both; 
visibility: hidden;
}

.clearfix {display: inline-table;}

/* Hides from IE-mac \*/
* html .clearfix {height: 1%;}
.clearfix {display: block;}
/* End hide from IE-mac */