* { padding: 0; margin: 0; }
/*styles the body element */
body {
/*sets the font type and size*/
 font-family: Helvetica;
 font-size: 14px;
 /*sets the backgound image */
 
}

/*extended the class p and creates a a red paragraph*/  
p.red {color: red}

/*extended the class p and creates a paragraph that will be centered and have correct line height for
the footer section*/
p.footer{ line-height: 2; text-align: center; color: white }


/*setting up the font style for h1 to be used for titles*/
h1 {
	font-size: 25px;
	font-weight: normal;
	color: #0000ff;
	font-family: Lucida Grande;
	padding-bottom: 10px;	
}

/*setting up the font style for h2 to be used for the title on the home page*/
h2 {
	font-size: 25px;
	font-weight: normal;
	color: #0000ff;
	font-family: Lucida Grande;
	padding-bottom: 10px;
	text-align: center
}


p.editablePad{

padding-left: 7px;
padding-right: 7px;
}

p.editablePad2{

padding-left: 7px;
padding-right: 7px;
padding-top: 8px;
padding-bottom: 8px;
text-align: justify
}

p.editablePad3{

padding-left: 7px;
padding-right: 7px;
padding-top: 8px;
padding-bottom: 8px;

}

p.editablePad4{

padding-left: 7px;
padding-right: 8px;
padding-top: 8px;
padding-bottom: 8px;

}

p.center{

	text-align: center
}

/*setting up the div elements in the html page and applying style to them*/

/*setting the wrapper div size*/
#wrapper { 
 margin: 0 auto;
 width: 825px;
}

/*setting the conatainer div size*/
#container {
 height: 620px;
 width: 825px;
 padding-top: 90px;

}



#logo { 
 
 height: 114px;
 width: 114px;
 float: left;
 padding-right: 17px;
 padding-bottom: 17px;
}


/*styling the header div*/
#banner { 
 
 height: 114px;
 width: 694px;
 float: left;
 padding-bottom: 17px;
}

/*styling the leftnavigation div*/
#outernavigation {
 
 background-image: url(images/navbar.gif);
 height: 484px;
 width: 114px;
 float: left;
 margin-right: 17px;
}

#innernavigation {
 
 
 height: 470px;
 width: 100px;
 float: left;
 background-color:#000000;
 margin-top: 7px;
 margin-left: 7px;
 
}




/*styling the main div*/
#main { 
 
 height: 484px;
 width: 493px;
 float: left;
 background-image: url(images/main.gif);
 
 
 
}

#editable { 
 float:left;
 height: 470px;
 width: 479px;
 margin-left: 7px;
 margin-top: 7px;
 background-color:#000000;
 overflow:auto;
 color:white;
}


 /*styling the rightcolum div */
#rightbanner { 
 float: right;

 height: 484px;
 width: 184px;
}
 /*styling the footer div */
#footer { 
 height: 50px;
 width: 790px;
 color: white
}



A:link {text-decoration: none; color: white;}
A:visited {text-decoration: none; color: white;}
A:active {text-decoration: none; color: white;}
A:hover { text-decoration: underline; color: blue;}






/*setting up the rollover links*/
.rollover a {
text-decoration : none;
font-family: Helvetica; 
color: white;
font-size: 20px;
display:block; 
width:95px;
/*sets the background colour of the links*/ 

background-color:#000000;
/*sets the borders around the links */
border-bottom-style: solid;
border-bottom-width: 1px;
border-bottom-color: #999999;
/*sets the padding around the links */
padding-top: 7px;
padding-bottom: 7px;
padding-left: 5px;
}

/*setting up the mouse over element of the rollover links*/
.rollover a:hover { 
text-decoration : none; 
background-color: #999999; 
color: white
}

/*sets the small link images in the right coloum to float left and sets up the padding*/
img.floatLeft {
    clear: left;
    float: left; 
    padding-bottom: 10px;
	padding-left: 15px;
	padding-right: 5px;
	border: 0; 
}
/*sets up the top amazon image in the right coloum to float left and sets the padding */ 
img.floatLeftTop { 
    float: left;
	padding-top: 10px;
    padding-bottom: 10px;
	padding-left: 15px;
	padding-right: 5px;
	border: 0; 
}

/*styles the <br> tag to clear anything on the left*/
br {
	clear: left;

}





/*applys style to the img.floatRight class*/
img.pad {

padding-bottom: 10px;
padding-top: 10px;
align:text-right;



}


/*applys style to the img.floatRight class*/
p.floatleftpad {
padding-left: 10px;




}

p.floatright2 {
/* floats the image right*/
float: right;
/*sets the padding*/ 
padding-bottom: 10px;
padding-left: 7px;
padding-right: 10px;
/*sets the border*/
border: 0;
}

/*applys style to the img.floatRight class*/
img.floatRight {
/* floats the image right*/
float: right;
/*sets the padding*/ 
padding-bottom: 10px;
padding-left: 7px;
padding-right: 10px;
/*sets the border*/
border: 0;
}

/*applys style to the p.thumb class */
p.thumb{
float:left;
margin:.5em 0;
margin-right:10px;
margin-left: 55px;
border:1px solid #999;	
padding:2px;
}

/*applys style to the p.thumb a element*/
p.thumb a{
display:block;
float:left;
width:100px;
height:100px;
line-height:100px;
overflow:hidden;
position:relative;
z-index:1;	
}
	
/*applys style to the p.thumb a img element*/
p.thumb a img{
float:left;
position:absolute;
top:-20px;
left:-50px;	
}
	
/* mouse over for the p.thumb*/
	
p.thumb a:hover{
overflow:visible;
z-index:1000;
border:none;		
}
/* applys style to the image on mouse over*/
p.thumb a:hover img{
border:1px solid #999;	
background:#fff;
padding:2px;			
}	
	



/* Begin CSS Drop Down Menu */



#menuh
	{
	font-size: small;
	font-family: arial, helvetica, sans-serif;
	/*width:100%;*/
	float:left;
	/*margin:2em;*/
	/*margin-top: 1em;*/
	/*width 100px;*/
	}
		
#menuh a
	{
	text-align: center;
	display:block;
	width: 99px;
	border: 1px solid #555;
	white-space:nowrap;
	margin:0;
	
	
	}
	

	
#menuh a.top_parent, #menuh a.top_parent:hover  /* attaches down-arrow to all top-parents */
	{
	background-image: url(navdown_white.gif);
	background-position: right center;
	background-repeat: no-repeat;
	}
	
#menuh a.parent, #menuh a.parent:hover 	/* attaches side-arrow to all parents */
	{
	background-image: url(nav_white.gif);
	background-position: right center;
	background-repeat: no-repeat;
	}

#menuh ul
	{
	list-style:none;
	margin:0;
	padding:0;
	float:left;
	width:101px;	/* width of all menu boxes */
	}

#menuh li
	{
	position:relative;
    min-height: 1px; 			/* Sophie Dennis contribution for IE7 */
    vertical-align: bottom; /* Sophie Dennis contribution for IE7 */
	}

#menuh ul ul
	{
	position:absolute;
	z-index:500;
	top:auto;
	display:none;
	padding: 1em;
	margin: -1em 0 0 -1em;
	}

#menuh ul ul ul
	{
	top:0;
	left:100%;
	}

div#menuh li:hover
	{
	cursor:pointer;
	z-index:100;
	}

div#menuh li:hover ul ul,
div#menuh li li:hover ul ul,
div#menuh li li li:hover ul ul,
div#menuh li li li li:hover ul ul
{display:none;}

div#menuh li:hover ul,
div#menuh li li:hover ul,
div#menuh li li li:hover ul,
div#menuh li li li li:hover ul
{display:block;}

/* End CSS Drop Down Menu */


/*button css*/

a.button{
	background:url(img/button.gif);
	display:block;
	color:#555555;
	font-weight:bold;
	height:25px;
	line-height:24px;
	margin-bottom:14px;
	text-decoration:none;
	width:125px;
}
a:hover.button{
	color:#0066CC;
}

/* -------------------- */
/* CLASSES				*/
/* -------------------- */
	.add{
		background:url(img/add.gif) no-repeat 10px 8px;
		text-indent:30px;
		display:block;
	}
	.delete{
		background:url(img/download.gif) no-repeat 10px 4px;
		text-indent:30px;
		display:block;
	}
	.user{
		background:url(img/user.gif) no-repeat 10px 8px;
		text-indent:30px;
		display:block;
	}
	.alert{
		background:url(img/alert.gif) no-repeat 10px 8px;
		text-indent:30px;
		display:block;
	}
	.msg{
		background:url(img/msg.gif) no-repeat 10px 8px;
		text-indent:30px;
		display:block;
	}
	.download{
		background:url(img/download.gif) no-repeat 10px 8px;
		text-indent:30px;
		display:block;
	}

	.lens{
		background:url(img/lens.gif) no-repeat 10px 5px;
		text-indent:30px;
		display:block;
	}
	.info{
		background:url(img/info.gif) no-repeat 10px 4px;
		text-indent:30px;
		display:block;
	}