/* 
Title: The Heightsmen of Boston College - Main screen stylsheet
Filename: styles.css
Author: Jim O'Neill, www.jimoneill.net
*/

/* =Reset
------------------------ */
@import "reset.css";


/* =General
------------------------ */
html {
	font-size: 100.01%; /* Ensures font consistency across browsers */
	margin: 0;
	padding: 0;
}
body {
	background: #800000;
	color: #000;
	font: 10px/1.5 Arial, sans-serif;
	line-height: 1.5; /* Sets base leading for lines of text */
	margin: 0;
	padding: 0;
}

p {margin: 0 0 1em 0; padding: 0;}

input, select, th, td {font-size: 1em}

img, a img {
	border: none; /* Remove default border on linked images */
}
ul {
	list-style: disc outside;
	margin: 0 0 1.0em 0;
	padding: 0 0 0 1.5em;
}
ol {
	list-style: decimal outside;
	margin: 0 0 1.0em 0;
	padding: 0 0 0 1.7em;
}
	ul li, ol li {
		margin: 0 0 0.2em 0;
		padding: 0;
	}

/* Basic link styles */
a, a:link {
	color: #cc0000;
	text-decoration: underline;
}
a:visited {
	color: #cc0000;
}
a:hover, a:active {
	color: #b58000;
	text-decoration: underline;
}
a:focus {}


/* =Master
---------------------- */
#container-outer {
	background: #800000 url(../images/bg/container_bg_outer.gif) repeat-y 50% 0;
	font-size: 1.2em; /* 12px (based on value from body) */
	margin: 0 auto;
	padding: 0;
	position: relative;
	text-align: left; /* Normalize alignment */
	width: 920px;
}
	#container {
		background: transparent url(../images/bg/container_bg_bottom.gif) no-repeat 0 100%;
		padding: 0 15px 14px 15px;
	}
		#container-inner {
			background: #d3ba85 url(../images/bg/container_bg_inner.gif) repeat-x 0 0;
		}
	

/* =Branding
---------------------- */
#branding {
	position: absolute;
	top: 0;
	left: 15px;
	z-index: 10;
	padding: 4px 0 0 30px;
}
	#branding-logo {
		cursor: pointer;
		width: 237px;
		height: 117px;
		margin-bottom: 0;
	}
		#branding-logo h1 {
			line-height: 1;
			margin: 0;
			padding: 0;
			height: 100%;
			overflow: hidden;
			text-indent: -5000px;
			width: 100%;
		}
			#branding-logo h1 a {
				background: transparent url(../images/branding/heightsmen_logo_web.gif) no-repeat 0 0; 
				display: block;
				height: 100%;
				margin: 0;
				padding: 0;
				width: 100%;
			}
			#branding-logo h1 a:hover, #branding-logo h1 a:active {
			}


/* =Nav
---------------------- */
#nav {
	position: absolute;
	top: 159px;
	left: 51px;
	z-index: 15;
	width: 230px;
	height: 290px;
}

	#nav-main {
	}
		.tie {
			background: transparent url(../images/nav/nav_home.gif) no-repeat 0 0;
			position: absolute;
			z-index: 50;
			width: 58px;
			height: 287px;
		}
		.group .tie {background: transparent url(../images/nav/nav_pattern1.gif) no-repeat 0 0;}
		.calendar .tie {background: transparent url(../images/nav/nav_pattern5.gif) no-repeat 0 0;}
		.repertoire .tie {background: transparent url(../images/nav/nav_pattern6.gif) no-repeat 0 0;}
		.recordings .tie {background: transparent url(../images/nav/nav_pattern4.gif) no-repeat 0 0;}
		.media .tie {background: transparent url(../images/nav/nav_pattern2.gif) no-repeat 0 0;}
		.alumni .tie {background: transparent url(../images/nav/nav_pattern7.gif) no-repeat 0 0;}
		.contact .tie {background: transparent url(../images/nav/nav_pattern3.gif) no-repeat 0 0;}
		
		#nav-main ul {
			list-style: none outside;
			margin: 0;
			padding: 5px 0 0 32px
		}
			#nav-main li {
				padding: 4px 8px 4px 46px;
				margin: 0 0 0.2em 0;
				font-size: 1.5em;
				line-height: 1;
			}
				#nav-main a, #nav-main a:link, #nav-main a:visited {
					color: #511717;
					text-decoration: none;
				}
				#nav-main a:hover, #nav-main a:active {
					color: #960000;
				}
				/* "Current page" highlighting */
				.home #nav-home, .group #nav-group, .calendar #nav-calendar, .repertoire #nav-repertoire, .recordings #nav-recordings, .media #nav-media, .alumni #nav-alumni, .contact #nav-contact 
				{background: #fff;}
					.home #nav-home a, .home #nav-home a:link, .home #nav-home a:visited, 
					.group #nav-group a, .group #nav-group a:link, .group #nav-group a:visited, 
					.calendar #nav-calendar a, .calendar #nav-calendar a:link, .calendar #nav-calendar a:visited, 
					.repertoire #nav-repertoire a, .repertoire #nav-repertoire a:link, .repertoire #nav-repertoire a:visited, 
					.recordings #nav-recordings a, .recordings #nav-recordings a:link, .recordings #nav-recordings a:visited, 
					.media #nav-media a, .media #nav-media a:link, .media #nav-media a:visited, 
					.alumni #nav-alumni a, .alumni #nav-alumni a:link, .alumni #nav-alumni a:visited, 
					.contact #nav-contact a, .contact #nav-contact a:link, .contact #nav-contact a:visited 
					{color: #960000;}
			

/* =Headings
---------------------- */
h1, h2, h3, h4, h5, h6 {
}
h2 {
	color: #800000;
	font: bold 2.5em/1 Arial,serif; /*24px*/
	margin: 0 0 0.35em 0;
	border-bottom: solid 1px #d3ba85;
	padding: 0 0 0.15em 0;
}
h3 {
	color: #000;
	font: bold 1.33em/1.2 Arial,serif; /*16px*/
	margin: 0 0 0.2em 0;
	padding: 0.2em 0;
}
h4 {
	color: #000;
	font: bold 1.167em/1.2 Arial,serif; /*14px*/
	margin: 0 0 0.2em;
	padding: 0.2em 0;
}
h5 {
	color: #987427;
	font: bold 1em/1.2 Arial,serif; /*12px*/
	margin: 0 0 0.2em;
	padding: 0.2em 0;
}
h6 {
	color: #987427;
	font: bold 1em/1.2 Arial,serif; /*12px*/
	margin: 0;
	padding: 0;
}
.bar {
	background: #f2e6c8;
	padding: 0.2em 8px;
	margin-bottom: 0.4em;
}


/* =Content
---------------------- */
#content-outer {
	background: #000 url(../images/bg/content_bg_top.gif) no-repeat 0 0;
	width: 562px;
	margin-left: 300px;
	padding: 104px 16px 36px 12px;
}
	#content {
		background: #fff;
		font-size: 1em; /*12px*/
		margin: 0;
		padding: 5px 30px 2em;
		min-height: 300px;
	}
	
	table { /* tables still need 'cellspacing="0"' in the markup */
		margin: 0 0 1em 0;
	}
					

/* =Footer
---------------------- */
#siteinfo {
	color: #e6cccc;
	font-size: 1.2em;
	margin: 0 auto;
	padding: 0 45px 8px;
	text-align: left;
	width: 830px;
}
	#siteinfo a:link, #siteinfo a:visited {
		color: #fff;
	}
	.siteinfo-legal, .siteinfo-links {
	}

/* =Uni
---------------------- */

.red {color: #800000;}
.gold {color: #987427;}

.clear {clear: left;}
.clear-both {clear: both;}
