/* 
FILE NAME: navbar.css
WRITTEN BY: Hyelin Lee and Diane Seol
WHEN: April 2009
PURPOSE: Diane - the webpages' style codes for body, #content, #img, #logoheader, .quicklinks, .logo, .header,
				 #mainslidshow, #mainslideshowcaption, absolute positions for menubar/linkbar/menu/link,
				 (made the logo, header2, "motto" div images, thumbnails), #boththumbnails, .announcementsheader,
				 .anniversary, #links,.centeredimage, #footer, .awardtitle, .recentawards,
				 #video, .secondslideshow 
	 
		 Hyelin - the webpages' style codes for .list, a, .dots, ul, all basic navbar css codes for menubar/linkbar/menu/link 
		 		 (made all the bmp, png, jpg files for navbar, footer, and etc.), #information, h1, h2, h3,
		 		 .thetext1, #thetext2, .thetext3, #image, #image2, .image3, .awardtitle1, p.tag
		 		 formatted all the codes to look neat
MODIFICATION: Hyelin and Diane both adjusted all the style codes throughout the coding process
May 2: Diane adjusted CSS to fix navbar issues with spacing between links, and changed layout of navbar from relative
to absolute positioning.
*/


/*Diane*/
body {
	font-family: "century gothic", sans-serif;
	background-color: #948d85;
	}
	
#content {
	background-color: white;
	position: absolute;
	margin-top: 5px;
	margin-bottom: 5px;
	margin-left: 5px;
	margin-right: 5px;
	width: 850px;
    }

img {
	border: none;
	}
	
/*Hyelin*/
.list {
	list-style: none;
	margin-right: 70px;
	float: right;
	width: auto;
	}

a {
	text-decoration: none;
	}
	
.dots {
	margin-left: 70px;
	}

/* Sohie */
.whatwedo {
	font-family: "century gothic", sans-serif;	
	font-size: 9pt;
	padding: 30px;
}
#pad {
	line-height: 2mm;
}
/*Diane*/
#logoheader, .quicklinks {
	float: left;
	width: auto;
	}

/*logo class refers to the Wayland Public Schools Foundation image on the top left of each page*/	
.logo {
	position: absolute; 
	left: 10px;
	top: 10px;
	padding: 10px;
	}

/*header class is the image that appears in the top right of each page*/
.header {
	position: absolute;
	left: 475px;
	top: 20px;
	padding: 10px;
	}

#mainslideshow {
	float: left;
	width: auto;
	margin-top: 210px;
	margin-left: 10px;
	margin-right: 10px;
	background-color: #FFAB0F;
	padding-left: 40px;
	padding-top: 0px;
	}
	
#mainslideshowcaption {	
	text-align: center;
	}
	
ul {
 	list-style-type: none;
	}
	
/*Hyelin*/
#menubar a{
  	display: block;
	margin-top: 0px;
	} 


/*menubar refers to the options that drop down in the navbar*/
#menubar {
   position: absolute;
   left: 0px;
   top: 20px;
	}	
	
/*linkbar refers to the five options in the navbar when nothing has dropped down*/
#linkbar {
   position:absolute;
   left: 5px;
   top: 160px;
   width: 840px;
   height: 31px;
   background-color: #948d85;
	}
	
/*each menu refers to the individual items that drop down in the navbar*/
#menu1, #menu2, #menu3, #menu4, #menu5,#menu6,
#link1, #link2, #link3, #link4, #link5,#link6 {
	visibility: visible;
	}
	
#menu1 img, #menu2 img, #menu3 img, #menu4 img, #menu5 img, #menu6 img{
	margin-bottom: -5px;
	}

#link1{
	position: absolute;
	margin-left: 15px;
	}

#link2 {
	position: absolute;
	margin-left: 125px;
	}
	
#link3 {
	position: absolute;
	margin-left: 250px; /* used to be 250 */
	}
	
#link4 {
	position: absolute;
	margin-left: 385px;  /* used to be 450 */
	}
	
#link5 {
	position: absolute;
	margin-left: 530px;
	}
#link6 {
	position: absolute;
	margin-left: 650px;
	}

#menu1 {
    visibility:  hidden;
    width: 200px;
	position: absolute;
   	left: 36px;
	top: 11px;
	}
	
#menu2 {
    visibility:  hidden;
	position: absolute;
	left: 145px;
	top: 11px;
	}
	
#menu3 {
    visibility:  hidden;
	position: absolute;
	left: 275px;  /* used to be 265 */
	top: 11px;
	}
	
#menu4 {
    visibility:  hidden;
	position: absolute;
	left: 390px;  /* used to be 474 */
	top: 11px;
    }
	
#menu5 {
    visibility:  hidden;
	position: absolute;
	left: 550px;
	top: 11px;
    }

#menu6 {
    visibility:  hidden;
	position: absolute;
	left: 650px;
	top: 11px;
    }

/*Diane*/
#boththumbnails {
	position: absolute;
	/* 	left: 50px; re-adjusting for removing of one thumbnail 10/10/09 */
	left: 145px;
	top: 600px;
	}
	
/*the motto div contains the three sections to the right of the slideshow: the apple image, the quick links,
and the 25th anniversary logo*/
#motto {
	margin-top: 225px;
	margin-left: 500px;
	margin-right: 10px;
	padding-left: 20px;
	}

.announcementsheader {
	float: right;
	width: auto;
	}
	
.anniversary {
	margin-left: 70px;
	}

#links {
	border-top: 1px solid gray;
	border-bottom: 1px solid gray;
	padding-top: 10px;
	padding-bottom: 5px;
	margin-bottom: 10px;
	text-align: center;
	color: #ff9f10;
	}

#information {
	margin-left: 50px; 
	margin-right: 40px;
    }
	
/*Hyelin*/
h1 {
	margin-top: 200px;
	}

h1, h2, h3 {
	border-bottom: 1px solid gray;
	color: #FF9500;
	margin-left:40px;
	margin-right: 40px;
	}
	
.grantheader {
	width: 300px;
	margin-left: 20px;
	font-size: 24pt;
	color: #6C6C6C;
	font-style: bold;
	font-family: helvetica;
	}
.deadline {
	width: 500px;
	margin-left: 50px;
	font-size: 14pt;
	color: red;
	font-style: bold;
}
	
.thetext1 {
	width: 700px;
	margin-left: 50px;
	margin-right: 50px;
	}

.donors {
	width: 700px;
	font-size: 10pt;
	margin-left: 50px;
	margin-right: 10px;
	line-height: 10pt;
	}
	
.thetext2 {
	width: 375px;
	margin-left: 40px;
	margin-top: 10px;
	text-align: justify;
	}
.thetext2list {
	width: 370px;
	margin-left: 40px;
	margin-top: 10px;
	}
	
.thetext3 {
	margin-left: 60px;
	margin-right: 50px;
	}
	
#image, image2 {
	float: right;
	margin-left: auto;
	margin-right: auto;
	width: auto;
	}

#image2 {
	margin-top: 75px;
	float: right;
	width: auto;
	}
	
.image3 {
	float: right;
	margin-right: 20px;
	width: auto;
	}

/*Diane*/
.centeredimage {
	text-align: center;
	margin: auto;
	}

#footer {
	text-align: center;
	margin-top: 30px;
	padding-top: 10px;
	}

.awardtitle1 {
	color: #FF9500;
	font-size: 15px;
	margin-left: 50px;
	}

.awardtitle {
	color: #0044CC;
	font-size: 15px;
	font-weight: bold;
	
}
.division {
	color: #FF9933;
	font-size: 18px;
	font-weight: bold;
	}
	
.recentawards {
	width: 400px;
	text-align: justify;
	margin-left: 50px;
	font-size: 13px;
	margin-top: 10px;
	}
	
#video{
	margin-top: 40px;
	padding: 10px;
	margin-left: 185px;
	margin-right: 185px;
	}
	
.secondslideshow {
	margin-left: 225px;
	}
	
.arrows {
	margin-left: 175px;
	}
/*Hyelin*/
	
#tag {
	font-size: 9px;
	margin-left: 50px;
	}