/* GLOBAL STYLES ----------------------------------------------- */

body {
	font-family: Verdana, Arial, Helvetica, sans-serif; /* Sets the global font */
	font-size: 100%; /* Sets the font size to 100% of the user's browser preference, */
	color: #000000; /* Sets the tiled background image for the page */
	background-repeat: repeat;
	background-image: url(assets/WP50.jpg);
}

/* CONTAINER -------------------------------------------------- */

#container {
	background-color: #FBEBB8; /* Sets the background colour for the container div */
	width: 780px; /* Sets the width of the container (optimized for users with 800 by 600 screen resolution) */
	border: 1px solid #000000;
	margin-left: auto;
	margin-right: auto;
	margin-top: -14px;
}

/* SIDEBAR -------------------------------------------------- */

#sidebar {
	display: inline; /* Fixes IE double float margin bug (doubled margin on the side that matches the direction the div is floated). */
	float: left; /* Moves div to the left side of its container and allows content div to sit on its right. */
	width: 165px; /* Sets the width of the sidebar column */
	margin-top: 5px; /* Adds 5 pixels of margin above the sidebar */
	margin-left: 5px;  /* Adds 5 pixels of margin to the left of the sidebar */
}

/* NAV -------------------------------------------------- */

#nav ul {
  margin: 0px;  /* Zeros out the margins on the list */
  padding: 0px; /* Zeros out the padding on the list */
}

#nav li {
	font-size: 85%; /* Sets the font size of links to 85% of the user's browser preferences */
	list-style: none; /* Removes the bullet from list items */
	color: #FFFFFF;
} 

#nav a {
	display: block; /* Changes the a element from its default inline display property to display as a block. */
	width: 100%; /* Forces links to expand to fill their entire container, making the entire button area clickable instead of just the text. */
	margin-bottom: 5px; /* Puts space between buttons. */
	text-align: center; /* Centers the button text */
	padding-top: 5px; /* Puts space between the link and the top edge of the button */
	padding-bottom: 5px; /* Puts space between the link and the top edge of the button */
	color: #333366;
} 

#nav a:link, #nav a:visited {
	color: #FFFFFF; /* Sets the text color of links and visited links. */
	text-decoration: none; /* Sets the background colour for the links. */
	background-color: #000099;
} 
#nav  a:hover   {
	color: #FFFFFF; /* Sets the background colour for the links */
	background-color: #b78763;
} 
#nav a:active {
	background-color: #000000;
}


/* SUBNAV -------------------------------------------------- */

#subnav {
  border: 1px solid #CCCCCC; /* Adds a 1 pixel, solid, light gray border around the div */
  margin-top: 5px; /* Adds 5 pixels of space between it and the div above it */
  width: 163px; /* Sets the div width to 163, allowing 2 pixels for the borders on either side */
}

#subnav p {
	font-size: 10pt; /* Sets the font size to 80% of the user's browser preference */
	text-align: center; /* Centers the links in the div */
	margin-right: 5px; /* Adds 5 pixels of space on the right of subnav paragraphs */
	margin-left: 5px; /* Adds 5 pixels of space on the left of subnav paragraphs */
}

#subnav ul {
  margin: 0px; /* Zeros out the margins on the list */
  padding: 0px; /* Zeros out the padding on the list */
}

#subnav li {
	list-style: none; /* Removes the bullet from each list item */
	margin-bottom: 5px; /* Adds 5 pixels of bottom margin space to give the links breathing room */
	text-align: center; /* Centers the links */
	color: #000000;
}

#subnav a {
	color: #000000; /* Sets the text colour of the secondary links */
	font-size: 85%; /* Sets the font size to 85% of the user's browser preference */
}

/* SIDE CONTENT ---------------------------------------------- */

#sideContent {
  border: 1px solid #CCCCCC; /* Adds a 1 pixel, solid, light gray border around the div */
  margin-top: 5px; /* Adds 5 pixels of space between it and the div above it */
  width: 163px; /* Sets the div width to 163, allowing 2 pixels for the borders on either side */
}

#sideContent p {
  font-size: 80%; /* Sets the font size to 80% of the user's browser preference */
  margin-right: 5px; /* Adds 5 pixels of space on the right of sideContent paragraphs */
  margin-left: 5px; /* Adds 5 pixels of space on the left of sideContent paragraphs */
}

/* CONTENT -------------------------------------------------- */

#content {
	margin-top: 0px; /* Removes all margin space above the content div */
	margin-right: 20px; /* Adds 20 pixels of margin space to the right of the content div */
	margin-bottom: 0px; /* Removes all margin space beneath the content div */
	margin-left: 200px;
}

#content h1 {
	font-size: 18pt; /* Sets the font size to 110% of the user's browser preference */
	margin-top: 0px; /* Removes all margin space above the content h1 */
}

#content li {
  font-size: 80%; /* Sets the font size to 80% of the user's browser preference */
}

#content p {
  font-size: 85%; /* Sets the font size to 85% of the user's browser preference */
  line-height: 1.4; /* Adds space or "leading" between lines of text */
}
#25 div {
	font-family: "Times New Roman", Times, serif;
	color: #FF0000;
}


/* FOOTER -------------------------------------------------- */

#footer {
	color: #7F7F48; /* Sets the text colour of the footer */
	margin-top: 5px; /* Adds 5 pixels of space above the footer */
	margin-right: 10px; /* Adds 10 pixels of space to the right of the footer */
	margin-bottom: 5px; /* Adds 5 pixels of space below the footer */
	margin-left: 5px; /* Adds 5 pixels of space to the left of the footer */
	border: 1px solid #CCCCCC; /* Adds a 1 pixel, solid, light gray border around the div */
}

#footer ul {
  text-align: center;  /* Centers all the text in the footer div */
  margin: 5px 0px; /* Adds 5 pixels of space above and below the footer list, and 0 pixels of space to the right and left of the list */
	}

#footer li {
	display: inline;  /* Changes the list items from block to inline elements */
	}

#footer a:link, #footer a:visited {
	margin: 5px; /* Adds 5 pixels of space all around the links to give them breathing room within the footer */
	font-size: 80%; /* Sets the font size to 80% of the user's browser preference, */
	color: #000000; /* Sets the text colour of the links */
}
	
#footer a:hover, #footer a:active {
	color: #0000FF; /* Sets the background colour */
	text-decoration: none; /* Removes the underlines from links */
}

/* CLASSES -------------------------------------------------- */

.fltlft {
	float: left; /* Moves the image to the left side of its container and allows text to flow around its right side. */
	margin-right: 8px; /* Adds 8 pixels of space to the right of the image so that it does not touch the text */
	border: 1px solid #2B331C; /* Puts a border around the image */
}
#offer {
	border: 2px solid #000000;
	background-color: #FFFFFF;
}



.fltrt {
	float: right; /* Moves the image to the right side of its container and allows text to flow around its left side. */
	margin-left: 8px; /* Adds 8 pixels of space to the left of the image so that it does not touch the text */
}

.clearfloat {
	font-size: 1px; /* Sets the font size to 1 pixel */
	line-height: 0px; /* Sets line-height to 0 -font and line-height, even if not explicitly on the page, might add diemnsion to the clearing element rather than make it larely invisible */
	clear: both; /* Keeps floated divs from draping over objects beneath them. */
	height: 0px; /* Makes sure the clearing element has no height */
}
.img {
	margin-top: 10px;
}
.table {
	padding-left: 25px;
}
