@import url('initial.css');

/*
yellow: #fd7
*/

body, html, .greytext {
	font-family: "Times New Roman", Times, serif;
	color: #666;
	font-size: 14px;
	line-height: 20px;
}
body{background:#c8c1b3 url(images/background.jpg) no-repeat top center;}

a { color: inherit}
a:hover { color: #fc6; text-decoration: none}
p, dl {padding: 0 0 20px 0; margin: 0px;}
dt {font-weight: bold}
h1, h2 {font-size: 17px; color: black; margin: 0 0 20px 0; line-height: 20px}
h2 {color: #888; clear: both;}
ul {list-style-type:square; margin: 0}

/*-------------*/
/*---- ID's ---*/
/*-------------*/

#wrapper {
	position: relative;
	margin: auto;
	margin-top: 20px;
	width: 980px;
	border: 2px solid white;
	background-color: white;
	background-position: left 220px;
	background-image:url(images/page_background.png);
	background-repeat: no-repeat;
}

#menu, #silly_table {float: left;}
#silly_table {width: 840px}


#menu {	width: 140px;	font-weight: bold;	font-size: 17px;	color: black; }
#menu ul {list-style-type: none;}
#menu li { margin-left: 0px; padding-bottom: 20px; color: black; line-height: 19px;}
#menu a, #menu span { padding-left: 22px; color: black; text-decoration: none; display: block;  width: 118px; height: 19px; margin-top: 1px; }
#menu a.youarehere {background-color: #fc6;}
#menu a:hover {background-color: #fd7;}
/*main sub menus*/
#menu ul ul li {padding: 0; font-weight: lighter; font-size: 15px; line-height: 19px;}

#portfolio_menu { width: 180px; font-weight: bold;	font-size: 17px; padding: 0 18px 0 22px; overflow: hidden;}
#portfolio_menu ul {list-style-type: none;}
#portfolio_menu ul ul {list-style-type: square; margin-left: 20px;}
#portfolio_menu li { margin-left: 0px; padding-bottom: 20px;}
#portfolio_menu a {text-decoration: none; line-height: 20px; color: black}
#portfolio_menu ul ul li {padding: 0px; font-weight: lighter; font-size: 15px; line-height: 19px;}


#content { padding: 0 38px 0 22px; overflow: hidden}
#content img { position: relative; left: -2px}
#content p {margin-right: 20px;}


#sidebar {
	width: 180px;
	background: top url(images/sidebar.png) no-repeat;
	font-size: 90%;
	color: black;
	height: 464px;
	margin-left: -20px;
}
#sidebar .condensed{line-height:normal;}
#sidebar a {text-decoration: none; color:#73603F;}
#sidebar a:hover {color: #fd7;}
#sidebar h1 {font-size: 15px; margin-bottom: 0px;}
#sidebar h2{font-size: 12px; margin-bottom: 0px; color: black}
#sidebar div {margin: 0px 10px;}
#sidebar .newsitem {margin: 0;}
#sidebar hr {border: none; border-top: solid 1px #999; margin: -10px 10px 10px 10px;}


#footer {clear:both; width: 962px; height: 18px; background-image: url(images/footer.png); vertical-align: middle; padding: 9px;}

#quotes {clear:both; width: 389px; margin: 0 auto 20px auto;}
#quotes p{padding: 5px; background-color:#f1f1f1; border: 1px solid #ddd}

#frontpagenews ul{margin-left: 20px;}

/*-------------*/
/*-- CLASSES --*/
/*-------------*/

/* --- THUMBNAILS ---*/
.thickbox img, .thumbnails img{ 
	/*.thumbnails is the better selector so thumbnails that don't have thickbox links can still be formatted like the rest
	  however many old pages don't use .thumbnails divs but they all were converted to thickbox so that selector remains*/
	margin: 0 19px 19px 0;
	border: 1px solid grey;
	vertical-align: top;
}
.thickbox img:hover, .thumbnails img:hover {border: 1px solid #fc6;}
.captionbox {text-align: center; float: left;}
.captionboxright {text-align: center; float: right;}
.captionbox p, .captionboxright p {margin-top: -18px; font-size: 90%; line-height:normal}

/*--- PREVIEWS ---*/
.previews td {padding-right: 0px !important; padding-left: 0px !important; vertical-align: middle;}
.preview { position: relative; text-align: center; margin: 0 19px 19px 0; width: 120px; float: left;}
.preview img {width: 118px; height: 118px; border: 1px solid grey;}
.preview a:hover .hoverText, .preview a:hover .hoverBox {visibility: visible; display: block}
.hoverBox { width: 120px; height: 120px; position: absolute; left: -2px; top: 0;
						background-color: black; visibility: hidden;filter:alpha(opacity=50); opacity: 0.5;}
.hoverText {width: 110px; height: 110px; display: none; position: absolute; top:15%; left: -2px; padding: 5px;
						color: white; font-size: 17px; font-weight: bold;}

/*--- MISC ---*/
/*.firstheader {margin-top: 0px; line-height: 20px;} SHOULD APPLY TO ALL HEADERS NOW*/

.bigbackgroundtext {
	filter: alpha(opacity=33);
	opacity: 0.33;
	color:#999;
	font-size: 60px;
	font-weight: bold;
	line-height: 0px;
	margin: 0 0 20px 0;
	padding: 0 0 20px 80px;
	display:block;
}

#loader {margin-left: -2px; background: url(images/gradient_container.png) no-repeat top left; clear:both}
#loader p, #loader h1 {margin-left: 3px;}
#loader h1 {color: white}
#loader img {position: relative; left: 0px;}

.floatleft, .alignleft {
	float: left;
	margin-right: 19px !important;
}
.floatright, .alignright {
	float: right;
	margin-left: 19px !important;
}

.two_wide {width: 260px; float: left;}

.three_wide {width: 400px; float: left;}