/*=================================*/
/* Rumark website
/* September 2012
/* By: Isaac Banda (T-ICT Services Centre)
/* ibs204@gmail.com
/* All rights reserved
/*=================================*/

body {
	margin-left: 0px;
	margin-top: 0px;
	margin-right: 0px;
	margin-bottom: 0px;
	background-color: #FFFFFF;
	
}
#container {      /*This is the main box. All content appears within this box*/
	width: 56.25em; /* equal to 900px */
	margin-right: auto; /*By setting margins, left and right into Auto, the browser will display this box at the center of the screen*/
	margin-left: auto;
	background-color: #FFFFFF;
	height:100%;
}
#navbar {
	background: #ffffff;
	font-family: georgia, serif;
	font-weight: normal;
	clear: both;
	margin-right: auto;
	margin-left: auto;
	padding-top: 1em;
	width: 56.25em;   /* equal to 900px */
}
ul {
	margin: 0px;
	padding: 0px;
}

/* to stretch the navbar div to contain floated list */
#navbar:after {
        content: ".";
        display: block;
        line-height: 1px;
        font-size: 1px;
        clear: both;
		width: 56.25em;
	    margin-right: auto;
	    margin-left: auto;;
}

ul#navlist {
        list-style: none;
        padding: 0;
        margin: 0 auto;
        width: 100%;
        font-size: 0.8em;
}

ul#navlist li {
        display: block;
        float: left;
        width: 16.24%;  /*adjusts the navigation bar*/
        margin: 0;
        padding: 0;
}

ul#navlist li a {
	    display: block;
        width: 100%;
        padding: 0.5em;
        border-width: 1px;
        border-color: #ffe #aaab9c #ccc #fff;
        border-style: solid;
        color: #777;
        text-decoration: none;
        background: #f7f2ea;
}

#navbar>ul#navlist li a { width: auto; }
#logo {
	width: 740px;
	float: left;
	height: 100px;
	padding-top: 10px;
	padding-right: 0px;
	padding-bottom: 10px;
	padding-left: 0px;
}
#slogan {
	padding: 10px;
	float: right;
	width: 110px;
	margin: 10px;
}

ul#navlist li#active a {
        background: #f0e7d7;
        color: #800000;
}

ul#navlist li a:hover, ul#navlist li#active a:hover {
        color: #800000;
        background:  #f0e7d7;
        border-color: #aaab9c #fff #fff #ccc;
}
#story {
	float: left;    /*aligns the box on the left side of the main box*/
	width: 630px;
	height:auto;
	padding: 10px;
	min-height:400px
}
#apDiv2 {
}

#footer {
	padding:0;
	clear: both;
	margin-top:0
}
#rights {
	padding: 10px;
}
#apDiv1 {
	position:absolute;
	width:901px;
	height:29px;
	z-index:1;
	left: 58px;
	top: 125px;
}
#footerNavbar {
	font-size: 14px;
	float: right;
	height: 30px;
}
li {
	display: inline; /*changes the style of the li tag from vertical to horizontal*/
	list-style-type: none;  /*removes the bullets*/
	margin-right: 5px;
	margin-left: 5px;
}
.style4 {
	font-size: 14px;
	color: #555555;
}
.style3 {
	color: #058707;
	font-style: italic;
	font-size: 23px;
}
.style6 {font-size: 13.5px}
a:link{
color:#555555
}
#slider {
	background-image: url(images/loading.gif);
	background-repeat: no-repeat;
	background-position: 50px 50px;
	height: 15.63em;
	width: 39.38em;
}
#SlideHolder {
	background-image: url(images/slide1.gif);
	background-repeat: no-repeat;
	height: 15.63em; /*equal to 250px*/
	width: 39.38em;   /*equal to 630px*/
	border: 1px solid #ddd;
}
div.content{  /*div holding content on home page*/
	float:left;
	display:block;
	width:39.38em;
	border:1px solid #ddd;
	height:152.24px; 
	overflow:hidden;
	padding:3px;
	margin-bottom:6px;
	margin-top:1px;
	font-size:14px
	
}
div.aboutcontent{  /*div holding content on about us page*/
	float:left;
	display:block;
	width:847px;
	border:1px solid #ddd;
	height:auto; 
	overflow:hidden;
	padding:10px;
	margin-bottom:6px;
	margin-top:1px;
	font-size:14px
	
}
div.line{  /*div that holds the line separating the picture slideshow from the content below it*/
width:870px;
border-bottom:1px solid #ddd;
margin-bottom:13px;
margin-top:8px;
}
div.vision{background:url(images/bg_rightcol_256px.jpg) no-repeat 0 0;width:100%;padding:0;margin:0 0 10px 0} /*div holding content for the RUMARK Vision*/
div.vision h2{  /*css for modifying heading on Vision DIV*/
	font-size:14px;
	margin:4px 1px 0 1px;
	padding:6px;
	background:url(/images/bg_rightcol_h2.jpg) repeat 0 0;
	border-top:1px solid #ddd;
	border-bottom:1px solid #ddd;
	border-left:none;
	font-weight:normal;
	color: #777;
}
div.vision h2.subhead{  /*css modifying vision subheading*/
	margin:0;
	border-top:none;
	padding:7px 7px 6px 7px;
	background-color: #f7f2ea;
	background-image: none;
	background-repeat: no-repeat;
	background-position: 0 0;
	border-color: #ffe #aaab9c #ccc #fff;
}
div.visiondata{display:block;width:180px;float:left;overflow:hidden;padding:2px}  /*div holding the vision statement*/
#sidebar {
	margin: 10px;
	width: 190px;
	border: 1px solid #ddd;
	float: right;    /*aligns the box on the right side of the main box*/
	height: 250px;
	margin-right:20px;
	font-size:14px
}
#sidebar2 {   /*div for the Mission statement*/
	margin: 31px;
	width: 190px;
	border: 1px solid #ddd;
	float: right;    /*aligns the box on the right side of the main box*/
	height: 160px;
	margin-right:20px;
	clear:right
	margin-top:50px;
	font-size:14px
}
div.map{background:url(images/bg_rightcol_256px.jpg) no-repeat 0 0;width:100%;padding:0;margin:0 0 10px 0} /*div holding content for the map*/
div.map h2{  /*css for modifying heading on the map DIV*/
	font-size:14px;
	margin:4px 1px 0 1px;
	padding:6px;
	background:url(/images/bg_rightcol_h2.jpg) repeat 0 0;
	border-top:1px solid #ddd;
	border-bottom:1px solid #ddd;
	border-left:none;
	font-weight:normal;
	color: #777;
}
div.map h2.mapsubhed{  /*css modifying map subheading*/
	margin:0;
	border-top:none;
	padding:7px 7px 6px 7px;
	background-color: #f7f2ea;
	background-image: none;
	background-repeat: no-repeat;
	background-position: 0 0;
	border-color: #ffe #aaab9c #ccc #fff;
}
#mapsidebar {   /*div for the map*/
	margin: 2px;
	width: 439px;
	float: right;    /*aligns the box on the right side of the main box*/
	height: 295px;
	margin-right:2px;
	margin-top:0px;
	font-size:14px;
	border: 1px solid #ddd;
}
div.mappicture{
	width: 439px;
	height: 263px;
}