/* These are redefined html elements. */

body {
	background: #000; /* This sets the background color of the page to black. */
}


table {
	border: 1px solid #999999; /* This puts a thin gray border around the table. */
	width: 760px; /* This sets the width of the table to 760 pixels in standards compliant browsers. */
	background: #900;
}

/* This provides the styles for the Skip to Main Content link. */

#skipnav {
 	position: absolute; /* Sets the position to absolute and takes it out of the flow of the document. */
	margin-left: -3000px; /* Adds a large negative margin to place the link off the screen so sighted users can not see it. */
}

/* This is the start of styles for the content area of the page. */

#header {
	background: #990000 url(images/composer_ban.jpg) no-repeat; /* This sets the header background color to deep red, and sets a background image, which does not repeat. */
	vertical-align: top; /* This sets the vertical alignment of the header cell to the top. */
}

#header h1 {
  color: #FFF; /* This sets the heading 1 text to white. */
  margin: 15px; /* This sets a 15 pixel margin all around the heading 1. */
  letter-spacing: 0.1em; /* This sets the font face for heading 1 to the listed fonts. */
  font-family: Georgia, "Times New Roman", Times, serif;
}
#header p {
	color: #F0F0F0; /* This sets the font color of the header area's p element. */
	font: 90% Verdana, Arial, Helvetica, sans-serif;/* This sets the font size to a scalable unit of measurement for standards compliant browsers. */
	margin-right: 10px; /* This and the following two properties put 10 pixels of margin around the p element within the header. */
	margin-bottom: 10px;
	margin-left: 10px;
	border: 1px solid #999999; /* This ads a border around the p element of the header. */
	
}
#header a {
	color: #F0F0F0; /* This sets all states of links to a light gray color. */
}

/* This is the start of styles for the content area of the page. */

#content {
	background: #FFF; /* This sets the content area to white. */
	vertical-align: top; /* This sets the vertical alignment of the content cell to top. */
	padding: 10px; /* This gives the content cell 10 pixels of padding all around in standards compliant browsers. */
}
#content p {
	font: 85%/140% Verdana, Arial, Helvetica, sans-serif;
	line-height: 140%; /* This sets the font properties for standards compliant browsers, including leading. */
	color: #333333; /* This sets the color of the text in the content area to dark gray. */
}
#content h2 {
	font: 120% Georgia, "Times New Roman", Times, serif; /* This sets the font face in the content area to those in this list for standards compliant browsers. */
	color: #000; /* This sets the font color of the level 2 heading in the content area to black. */
}
#content h3 {
	color: #333333; /* This sets the font color to gray. */
	font: 100% Georgia, "Times New Roman", Times, serif;
	border-bottom: 2px dotted #666666; /* This sets the font size to a scalable size for standards compliant browsers, puts a dotted border under the heading. */
}
#content li {
	font: 75% Verdana, Arial, Helvetica, sans-serif; /* This sets the font size for standards compliant browsers. */
}
#content a:link, #content a:visited {
	color: #900; /* This sets the color of link text in the content area to red. */
}

#content a:hover, #content a:focus {
	background: #ECECEC; 
}
/* This sets a light gray background on the hover and focus states of the links. */


/* This is the start of styles for the sidebar area of the page. */

#sidebar {
	background: #F4F4F4; /* Sets the background color of the sidebar area to light gray. */
	vertical-align: top; /* Sets the vertical alignment of the sidebar cell to top. */
	border-right: 2px dotted #000066; /* Sets a right border on the sidebar area. */
	width: 150px; /* Sets the width of the sidebar cell to 150 pixels. */
	padding: 10px; /* Pads the sidebar cell with 10 pixels all around. */
}
#sidebar p {
	margin-bottom: 3px; /* Adds three pixels of margin space to the bottom of the paragraph element. */
	margin-top: 0px; /* Zeros out the top margin of the p element. */
}
#sidebar h2 {
	font: 120% Georgia, "Times New Roman", Times, serif;/* Sets the font properties for standards compliant browsers. */
	color: #000; /* Sets the sidebar heading 2 font color to black. */
}


#sidebar a:link, #sidebar a:visited {
	color: #FFF; /* Sets the link font color to white. */
	text-decoration: none; /* Removes the underline from link text. */
	background: #000; /* Sets the background-button area-to black. */
	display: block; /* Sets display to block so each link will appear in its own space instead of next to each other. */
	padding: 6px; /* Sets padding all around the link text to put space between it and the border of the button. */
	width: 125px; /* Sets the width of the button to 125 pixels. */
	border: 1px solid #999999; /* Puts a gray border all around the button. */
	font: 90% Verdana, Arial, Helvetica, sans-serif; /* Sets the font properties of the links. */
}

#sidebar a:hover, #sidebar a:focus {
	color: #000; /* Sets the font color of the hover and focus states of the links to black. */
	background: #FFF url(images/link_bg.jpg) no-repeat center center; /* Sets the background color of the button to white, and adds a background gradient image. */
}

/* This is the start of styles for the footerr area of the page. */

#footer {
	background: #900;
}

#footer p {
	font: 80% Verdana, Arial, Helvetica, sans-serif;/* Sets font properties for standards compliant browsers. */
	color: #FFF; /* Sets the footer paragraph font color to white. */
	margin: 10px; /* Sets 10 pixels of margin space all around the footer paragraph element. */
}

/* This is class to use on images that need to float to the left of text. */

.lftimg {
	float: left; /* Floats the image to the left of the text, and allows the text to wrap. */
	margin-right: 10px; /* Creates 10 pixels of space to the right of the image. */
	border: 1px solid #333333; /* Sets a gray border around the image. */
}
table.admin {
  background: #FFFFFF;
  width: 400px;
  font: 80% Verdana, Arial, Helvetica, sans-serif;
}

table.dress {
  background: #FFFFFF;
  width: 400px;
  font: 80% Verdana, Arial, Helvetica, sans-serif;
  border: 1px solid #000000;
  margin-left: 30px;
}
table.dress caption {
  font-size: 120%;
  font-weight: bold;
}
table.dress td {
  padding: 5px;
}
table.dress th {
  text-align: left;
  padding: 5px;
}
.clearer {
  font-size: 1px;
  line-height: 0px;
  margin: 0px;
  height: 5px;
  clear: both;
}
.directorimg {
  float: left;
  margin-right: 10px;
}
#content h1 {
	font-size: 150%;
}
