/* CSS Document */

/*initialisation*/
html, body, ul, ol, li, p, h1, h2, h3, h4, h5, h6, form, fieldset {
	margin: 0;
	padding: 0;
	border: 0;
/*	margin-left: 5px;*//*Not sure why there is a margin there*/
}

/* hide from IE mac \*/
html {
	min-height: 100%;
	margin-bottom: 1px;
}
/* end hiding from IE5 mac */

a img {border: 0 none;}
img {border: 0 none;}

body {
	font-family: Geneva, Arial, Helvetica, sans-serif;
	font-size: 100.1%;
	color: #000000;
	background-color: #EDE4C9;
	text-align: left;
}

a{text-decoration:none;}
a:link {color: #000000; text-decoration: none}
a:visited {color: #000000; text-decoration: none}
a:hover {text-decoration: underline}

/* Not sure about the em elements*/
p em {
color: #990000;
}
/* Not sure about the em elements*/

#wrapper{
	width: 778px;
	background-color:#EDE4C9;
	margin: auto;/*wrapper always centered horizontally*/
	margin-top: 0px;
}

#wrapper_index{
	width: 770px;
	height: 600px;
	background-color:#EDE4C9;
	margin: auto;/*wrapper_index always centered horizontally*/
	margin-top: 0px;
}


#header{
	height: 146px;
/*	background-repeat: no-repeat;
	background-image: url(../images/layout2b.gif);*/
}

#content{
	margin-left: 10px;
	margin-right: 15px;
	margin-top: 0px;
	margin-bottom: 0px;
}

#content p.right{
float: right;
}

#content p{
font-size: 85%;
margin: 0px;
}

#content h1{
font-size: 95%;
padding: 0;
margin-left: 0px;
margin-right: 0px;
margin-top: 0px;
margin-bottom: 0px;
}

#content h2{
	font-size: 86%;
	padding: 0;
	margin-left: 0px;
	margin-right: 0px;
	margin-top: 0px;
	margin-bottom: 0px;
	text-align: center;
}

#content h3{
	font-size: 85%;
	padding: 0;
	margin-left: 100px;
	margin-right: 0px;
	margin-top: 10px;
	margin-bottom: 5px;
}

#content h4{
	font-size: 80%;
	padding: 0;
	margin-left: 0px;
	margin-right: 0px;
	margin-top: 0px;
	margin-bottom: 10px;
}

#content h5{
	font-size: 80%;
	padding: 0;
	margin-left: 0px;
	margin-right: 0px;
	margin-top: 0px;
	margin-bottom: 10px;
	text-align: right;
}

#content h6{
	font-size: 84%;
	padding: 0;
	margin-left: 0px;
	margin-right: 0px;
	margin-top: 0px;
	margin-bottom: 0px;
	font-weight:bold;
	color:#33CC33;
}


#content_2{
	margin-left: 0px;
	margin-right: 0px;
	margin-top: 0px;
	margin-bottom: 0px;
	width: 565px;
	height: 360px;
	overflow: auto;
}

#content_2 p{
font-size: 80%;
margin: 0px;
}

#content_2 h1{
font-size: 85%;
padding: 0;
margin-left: 0px;
margin-right: 0px;
margin-top: 0px;
margin-bottom: 10px;
}

#content_2 h2{
	font-size: 85%;
	padding: 0;
	margin-left: 0px;
	margin-right: 0px;
	margin-top: 10px;
	margin-bottom: 10px;
}

#content_2 h3{
	font-size: 85%;
	padding: 0;
	margin-left: 100px;
	margin-right: 0px;
	margin-top: 10px;
	margin-bottom: 5px;
}

#content_3{
	margin-left: 10px;
	margin-right: 0px;
	margin-top: 0px;
	margin-bottom: 10px;
	width: 730px;
	height: 320px;
	background-image:url(../images/palm2.jpg);
	background-repeat:no-repeat;
}

#content_3 p{
font-size: 100%;
margin: 0px;
margin-left: 15px;
color:#FFFFFF;
font-weight:bold;
}

#content_3 a{text-decoration:none;}
#content_3 a:link {color: #FFFFFF; text-decoration: none}
#content_3 a:visited {color: #FFFFFF; text-decoration: none}
#content_3 a:hover {color: #000000;text-decoration: underline}

#content_4{
	margin-left: 0px;
	margin-right: 0px;
	margin-top: 0px;
	margin-bottom: 0px;
	width: 520px;
}

.container{
width: 99%; 
float:right;
/*background-color:#EDE4C9;*/
}

/* Begin description of the Columns*/
.leftcol_1{
	margin-left: 0px;
	margin-top: 0px;
	margin-bottom: 0px;
	width: 285px;
	background-color:#EDE4C9;
	float: left;
	font-size:90%;
}

.leftcol_1 ul {
	margin-left: 0px;
	margin-top: 0px;
	list-style-type: none;
}

.leftcol_1 li {
	margin-left: 0px;
	margin-top: 0px;
	padding: 0px 0px 8px 0px;
	list-style-type: none;
	font-size:100%;
}

.leftcol_2{
margin-left: 10px;
margin-right: 20px;
margin-top: 0px;
width: 300px;
margin-bottom: 20px;
float: left;
}

#leftcol_3{
margin-left: 0px;
margin-right: 0px;
margin-top: 0px;
width: 180px;
margin-bottom: 0px;
float: left;
}

#leftcol_3 #nav{
border-bottom: 1px solid #000000;
width: 150px;
margin-left:20px;
}

#leftcol_3 #nav ul {
margin: 0; 
padding: 0;
background-color: transparent;
list-style-type: none;
font-size: 80%;
border: 1px solid #000000;
}

#leftcol_3 #nav ul li a{
background-color: #6795C2;
border-bottom: 1px solid #000000;
color: #ffffff;
display: block;
padding: 4px 0 6px 4px;
text-decoration: none;
font-weight:bold;
height: 1%;
}

#leftcol_3 #nav a:hover{ 
background-color: #91B3CC;
border-right: 1px solid #000000;
border-bottom: 1.5px solid #000000;
color: #000000;
font-weight:bold;
}

.leftcol_4{
	margin-left: 2px;
	margin-top: 0px;
	margin-bottom: 0px;
	width: 270px;
	background-color:#EDE4C9;
	float: left;
	font-size:90%;
}

#leftcol_5{
margin-left: 0px;
margin-right: 0px;
margin-top: 0px;
width: 230px;
margin-bottom: 0px;
float: left;
}

.rightcol_1{
margin-right: 0px;
margin-top: 0px;
width: 420px;
background-color:#EDE4C9;
margin-bottom: 0px;
float: right;
}

.rightcol_1 a {
	font-size: 95%;
	padding: 0;
	margin-left: 0px;
	margin-right: 0px;
	margin-top: 0px;
	margin-bottom: 0px;
	font-weight:bold;
}

.rightcol_1 a:link {color: #305478; text-decoration: none}
.rightcol_1 a:visited {color: #305478; text-decoration: none}
.rightcol_1 a:hover {text-decoration: underline}



.rightcol_2{
width:280px;
height:370px;
margin-left:220px;
overflow: auto;
}

.rightcol_3{
margin-right: 0px;
margin-top: 0px;
width: 460px;
background-color:#EDE4C9;
margin-bottom: 0px;
float: right;
}

/* End description of the Columns*/

/* Begin list*/

.list_1{
	margin-left: 0px;
	margin-top: 0px;
	margin-bottom: 0px;
	background-color:#EDE4C9;
}

.list_1 ul {
	margin-left: 10px;  /*need to be the same as the .leftcol_1 margin-left to keep the bullet in*/
	list-style-type: decimal;
	line-height: 1;
	font-size: 90%;
}

.list_1 li {
	margin-left: 10px;
	margin-top: 0px;
	padding: 0px 0px 8px 0px;
	list-style-type: decimal;
	font-size:102%;
}

.list_2{
	margin-left: 0px;
	margin-top: 0px;
	margin-bottom: 0px;
	background-color:#EDE4C9;
/*	float: left;*/
}

.list_2 ul {
	margin-left: 10px;  /*need to be the same as the .leftcol_1 margin-left to keep the bullet in*/
	list-style-type: none;
	line-height: 1.2;
	font-size: 90%;
}

.list_2 li {
	margin-left: 10px;
	margin-top: 0px;
	padding: 0px 0px 0px 0px;
	list-style-type: none;
	font-size:102%;
}

/* End list*/

/* Begin Floating images */
.leftimage{
float: left;
margin: 0px 10px 20px 0px;
border: 2px solid #4477AA;
}

.rightimage{
float: right;
margin: 0px 10px 20px 10px;
border: 2px solid #4477AA;
}
/* End Floating images */

/* Begin leftmenu section*/
.leftmenu {
    float: left;
    width: 120px;
	height: 200px;
    font-size: 80%;
	margin-top:50px;
	margin-left:20px;
}

.leftmenu ul {
    list-style-type: none;
	border-top: 1px solid #333;
}

.leftmenu ul li {
    width: 120px;

	border-bottom: 1px solid #333;
	border-right: 1px solid #333;
	border-left: 1px solid #333;
    background-color: #d5edb3;
}

.leftmenu li a {
    display: block;
    color: #283f13;
    padding: 3px 0px 3px 5px;
	text-decoration:none;
}

.leftmenu li a:hover, #leftmenu li a:focus {
    background-color: #960;
    color: #fff; 
}
/* End of leftmenu section*/

#footer{
	clear: both;
	height: 40px;
	margin-top:0px;
	background-repeat: no-repeat;
	background-image: url(../images/footer2b.gif);
}

#footer ul {
    color: #FFFFFF;
	padding: 8px 0px 0px 20px;
    list-style-type: none;
}

#footer ul li {
    color: #C4D6E3;
}

#footer li a {
    color: #C4D6E3;
    padding: 3px 0px 3px 2px;
}

#footer p {
font-size: 70%;
padding: 0px;
}

/* hr to create a sepataor line*/
hr {
  border: 0;
  width: 80%;
  color:#0033CC;
}
/* End of hr section*/

/*Begin rounded box css code*/
.bl260 {background: url(../images/1bl.gif) 0 100% no-repeat #DDCE9B; width: 285px}

.bl {background: url(../images/1bl.gif) 0 100% no-repeat #DDCE9B; width: 730px}

.br {background: url(../images/1br.gif) 100% 100% no-repeat}

.tl {background: url(../images/1tl.gif) 0 0 no-repeat}

.tr {background: url(../images/1tr.gif) 100% 0 no-repeat; padding:10px}

.tr ul {
	list-style-type: none;
}

.tr li {
	margin-left: 0px;
	margin-top: 0px;
	padding: 0px 0px 5px 0px;
/*	padding-top: 0px;
	padding-right: 12px;
	padding-bottom: 0px;
	padding-left: 12px;*/
	list-style-type: none;
	font-size:94%;
	color: #000000;
}

.tr h4 {
	font-size: 50%;
}


.tr2 {background: url(../images/1tr.gif) 100% 0 no-repeat; padding:10px}

.tr2 ul {
	list-style-type: none;
}

.tr2 li {
	margin-left: 0px;
	margin-top: 0px;
	padding: 0px 15px 5px 0px;
/*	padding-top: 0px;
	padding-right: 12px;
	padding-bottom: 0px;
	padding-left: 12px;*/
	list-style-type: none;
	font-size:93%;
	color: #000000;
}

.tr2 h4 {
	font-size: 50%;
}


.clear {font-size: 1px; height: 1px}

/*End rounded box css code*/

/* Beginning of the gallery_1 css section*/
   /* The containing box for the gallery. */
#container_gallery1 {
	position:relative;
	width:726px;
	height:352px;
	margin:0px 10 0 10;
	border:1px solid;
	background:#fff url(../images/back.jpg) 6px 10px no-repeat;
	border-color: #000066;
    }

/* Defines text at the bottom of the background image*/
.bottom_text{
	margin-top: 312px;
	margin-left: 5px;
	float:left;
	color: #000000;
	font-size:120%;
}
	
	/* Removing the list bullets and indentation */
#container_gallery1 ul {
    padding:0; 
    margin:0; 
    list-style-type:none; 
    }
	
	/* Remove the images and text from sight */
#container_gallery1 a.gallery span {
    position:absolute; 
    width:1px; 
    height:1px; 
    top:-1px; 
    left:-1px; 
    overflow:hidden; 
    background:#fff;
    }
	
	/* Adding the thumbnail images */
#container_gallery1 a.gallery, #container_gallery1 a.gallery:visited {
    display:block; 
    text-decoration:none; 
    border:1px solid #000; 
    margin:1px 1px 1px 1px; 
    text-align:left; 
    cursor:default;
    }
	
#container_gallery1 a.slidea {
    background:url(../images/p4_t.jpg); 
    height:80px; 
    width:120px;
    }
#container_gallery1 a.slideb {
    background:url(../images/p5_t.jpg); 
    height:80px; 
    width:120px;
    }
#container_gallery1 a.slidec {
    background:url(../images/p2_t.jpg); 
    height:80px; 
    width:120px;
    }
#container_gallery1 a.slided {
    background:url(../images/p6_t.jpg); 
    height:80px; 
    width:120px;
    }
#container_gallery1 a.slidee {
    background:url(../images/p7_t.jpg); 
    height:80px; 
    width:120px;
    }
#container_gallery1 a.slidef {
    background:url(../images/p8_t.jpg); 
    height:80px; 
    width:120px;
    }
#container_gallery1 a.slideg {
    background:url(../images/p1_t.jpg); 
    height:80px; 
    width:120px;
    }
#container_gallery1 a.slideh {
    background:url(../images/p3_t.jpg); 
    height:80px; 
    width:120px;
    }
	
	/* set the size of the unordered list to neatly house the thumbnails */
#container_gallery1 ul {
	width:248px;
	height:340px;
	margin:4px;
	margin-top: 9px;
	float:right;/* move the thumbnails into the correct position */
	}

#container_gallery1 li {
    float:left;
    }

	/* change the thumbnail border color */
#container_gallery1 a.gallery:hover {
    border:1px solid #fff; 
    }
	
	/* styling the :hover span */
#container_gallery1 a.gallery:hover span {
    position:absolute; 
    width:450px; 
    height:340px; 
    top:10px; 
    left:5px;
    color:#000; 
    background:#fff; 
    }
	
#container_gallery1 a.gallery:hover img {
    border:1px solid #fff; 
    float:left; 
    margin-right:0px;
    }
	
/* End of the gallery_1 css section*/

/*End of the CSS code*/




/*-----------------------------------*/
/* Misc. functions that could be used*/

/*placeholder*/
.clear {font-size: 1px; height: 1px}

/*you could, for instance, easily target any em elements that reside within p elements.*/
p em {
color: #990000;
}

/*<blockquote>This is some quoted text. We are going to style this blockqoute and then we will apply a hover effect to it.</blockquote>*/

blockquote {
	font-size: 80%;
	background-color: #D6E8C1;
	border: 1px solid #003366;
	padding: 5px;
	width: 100px;
}
blockquote:hover {
border: 1px solid red;
}
