/* cedarcreations.css */
/* Owen Bourne, 2006  */

/*
	Main style of the body of the page.
*/
body {
	font-family: Arial, sans-serif;							/* Use the Arial font. */
	color: #000000;											/* Text colour should be black. */
	background: #cccccc url("images/background.gif");		/* Use a light-gray background colour if the background image isn't found. */
}


/*
	Hyperlink colours and text formatting options.
*/
a:link, a:visited {
	/* Colour of the text for a link (before and after it has been visited). */
	color: #990000;
	text-decoration: none;									/* Don't change the text formatting (appears as normal text). */
}

a:hover {
	/* Change the link text to be underlined when the mouse is over the text. */
	text-decoration: underline;
}


/*
	Heading colours and text formatting options.
*/
h1 {
	/* The largest possible heading. */
	font: bold 120% Arial, sans-serif;
	color: #990000;											/* The colour of the text that makes up the heading. */
	/* Don't apply any additional spacing when this heading is applied. */
	margin: 0px;
	padding: 0px;
}

h2 {
	/* The second largest possible heading. This is used for the page title above the links for the other pages. */
	font: bold 114% Arial, sans-serif;
	color: #000000;											/* The colour of the text that makes up the heading. */
	/* Don't apply any additional spacing when this heading is applied. */
	margin: 0px;
	padding: 0px;
}

h3 {
	font: bold 100% Arial, sans-serif;
	color: #990000;											/* The colour of the text that makes up the heading. */
	/* Don't apply any additional spacing when this heading is applied. */
	margin: 0px;
	padding: 0px;
}


/*
	List styles (currently unused in the cedarcreations site).
*/
ul {
	list-style-type: square;								/* Use square-shaped indicators for unordered list elements (bullets). */
}

ul ul {
	/* Formatting for 2nd order nested elements. */
	list-style-type: disc;									/* Use disc-shaped indicators for sub-elements of an unordered list (bullets). */
}

ul ul ul {
	/* Formatting for 3rd order nested elements. */
	list-style-type: none;									/* Use no indicators for sub-sub-elements of an unordered list (bullets). */
}


/*
	Form (data entry) styles.
*/
form {
	/* Do not apply any additional spacing to compensate for form elements. */
	margin: 0px;
	padding: 0px;
}

label {
	/* A label to identify the input element? */
	font: bold 1em Arial, sans-serif;
	color: #334D55;
}

input {
	font-family: Arial, sans-serif;
}


/***********************************************/
/*	Layout Divs (to customize components of
/*	the site).
/***********************************************/

#containment {
	/* The outer-most table properties. */
	width: 800px;									/* The table width (in pixels). */
	background-color: #FFFFFF;						/* The background colour of the table. */
	border-color: #000000;							/* The colour of the border around the table. */
	border-width: medium;							/* The width of the table border. */
	border-style: solid;							/* The line-style of the border. */
}

#content {
	/* The table that separates the left-pane from the content. */
	width: 792px;									/* The table width (in pixels). */
	vertical-align: top;							/* The vertical alignment of the table. */
	text-align: left;								/* The alignment of the text within the table. */
}

#menu-pane {
	/* The menu-pane table properties. This table contains the page title and the menu options. */
	width: 784px;									/* The table width (in pixels). Tuned so that the left-pane lines up correctly with its edge. */
	background-color: #F8F8F8;						/* The background colour of the menu table. */
	border-color: #666666;							/* The colour of the border around the menu table. */
	border-width: thin;								/* The width of the border around the menu table. */
	border-style: solid;							/* The style of the line used for the border. */
	text-align: center;								/* The alignment of the text within the table. */
}

#left-pane {
	/* The left-pane table properties. This table contains the 'random' pictures and a short description of the site. */
	width: 198px;									/* The table width (in pixels). */
	background-color: #F8F8F8;						/* The background colour of the left table. Should match #menu-pane. */
	border-color: #666666;							/* The colour of the border around the left table. Should match #menu-pane. */
	border-width: thin;								/* The width of the border around the left table. Should match #menu-pane. */
	border-style: solid;							/* The style of the line used for the border. Should match #menu-pane. */
	text-align: center;
	font: 90% Arial, sans-serif;					/* Use a smaller font for the text in the left-pane. */
}

#gallerycontainer {
	/* The gallery container. This table contains an image on the left, with a sub-table in the right column. */
	width: 580px;
	background-color: #F8F8F8;
	border-color: #666666;
	border-width: thin;
	border-style: solid;
}


/*
	Special-case formatting.
*/
#copyright {
	/* A specialized font to make the copyright notice appear differently to the other text. */
	font: 80% Arial, sans-serif;					/* Use a smaller version of the Arial font. */
	color: #888888;									/* The colour of the copyright notice. */
	text-align: left;								/* Align the copyright notice to the left. */
}

#clicktoenlarge {
	/* A specialized font to make the 'click to enlarge' text appear differently to other text. */
	font: 70% Arial, sans-serif;
	color: #000000;
	text-align: center;
}

#gallerylinks {
	font: 90% Arial, sans-serif;
	color: #9900000;
	text-align: right;
}

#indexheadings {
	/* The right-aligned headings for the main page. This helps to balance the page. */
	font: bold 120% Arial, sans-serif;
	color: #990000;
	margin: 0px;
	padding: 0px;
	text-align: right;	
}