main.CSS

/* ---------------------- ~GLOBAL ----------------------------------- */

* { padding: 0; margin: 0;}

html { *height: 100%; }

body {
	width: 100%;
	height: 100%;
	font: 0.8em 'Arial MT', sans-serif;
	line-height: 1.5em;
	padding: 0; 
	margin: 0;
}


/* ---------------------- ~COLOR SCHEMES --------------------------- */

.cHome {
	background: black url(images/homebg.gif) no-repeat bottom left;
	color: white;
}
	.cHome h1 { color: #ff6600; }
	.cHome h2 { color: #ff6600; }
	.cHome a:link { color: #ff9900; }
	.cHome a:visited { color: #cc6600; }
	.cHome a:hover { color: #ffcc00; }
	.cHome a:active { color: #ffcc00; }

.cAbout {
	background: white url(images/aboutbg.gif) no-repeat bottom left;
	color: black;
}
	.cAbout h1 { color: #660066; }
	.cAbout h2 { color: #ff3399; }
	.cAbout a:link { color: #660099; }
	.cAbout a:visited { color: #666699; }
	.cAbout a:hover { color: #6633CC; }
	.cAbout a:active { color: #6633CC; }

.cBio {
	background: white url(images/biobg.gif) no-repeat bottom left;
	color: black;
}

.cResume {
	background: black url(images/resumebg.gif) no-repeat bottom left;
	color: white;
}
	.cResume h1 { color: #660066; }
	.cResume h2 { color: #ff3399; }
	.cResume a:link { color: #660099; }
	.cResume a:visited { color: #666699; }
	.cResume a:hover { color: #6633CC; }
	.cResume a:active { color: #6633CC; }
	
.cRepertory {
	background: black url(images/repertorybg.gif) no-repeat bottom left;
	color: white;
}
	.cRepertory h1 { color: #666666; }
	.cRepertory h2 { color: #666666; }
	.cRepertory a:link { color: #ff9900; }
	.cRepertory a:visited { color: #cc6600; }
	.cRepertory a:hover { color: #ffcc00; }
	.cRepertory a:active { color: #ffcc00; }

	.cRavish {
		background: black url(images/ravishbg.gif) no-repeat bottom left;
		color: white;
	}
		.cRavish h1 { color: #4a2b2b; }
		.cRavish h2 { color: #4a2b2b; }
		.cRavish a:link { color: #CC0000; }
		.cRavish a:visited { color: #990000; }
		.cRavish a:hover { color: red; }
		.cRavish a:active { color: red; }

		.cParty {
			background: black url(images/ravishpartybg.gif) no-repeat bottom left;
			color: white;
		}
			.cParty h1 { color: red; }
			.cParty h2 { color: #4a2b2b; }
			.cParty a:link { color: #CC0000; }
			.cParty a:visited { color: #990000; }
			.cParty a:hover { color: red; }
			.cParty a:active { color: red; }
	
	.cTov {
		background: white url(images/tovbg.gif) no-repeat bottom left;
		color: black;
	}
		.cTov h1 { color: #336699; }
		.cTov a:link { color: #6666CC; }
		.cTov a:visited { color: #666699; }
		.cTov a:hover { color: #6699FF; }
		.cTov a:active { color: #6699FF; }

	.cAura {
		background: black url(images/aurabg.gif) no-repeat bottom left;
		color: white;
	}
		.cAura h1 { color: #66CC99; }

	.cTwoViews {
		background: black url(images/twoviewsbg.gif) no-repeat bottom left;
		color: white;
	}
		.cTwoViews h1 { color: #ff9933; }
		
	.cGHF {
		background: #999 url(images/ghfbg.jpg) no-repeat bottom left;
		color: white;
	}
		.cGHF h1 { color: #666666; }

.cContact {
	background: white url(images/contactbg.gif) no-repeat bottom left;
	color: black;
}
	.cContact h1 { color: #00ff33; }

.cPress {
	background: white url(images/pressbg.gif) no-repeat bottom left;
	color: black;
}
	.cPress h1 { color: #3399ff; }
	.cPress h2 { color: #6699CC; }
	
.footerHome{ background-color: #ff6600; }
.footerAbout{ background-color: #660066; }
.footerNewWork { background-color: #4a2b2b; }
.footerContact { background-color: #00ff33; }
.footerRepertory { background-color: #666666; }
.footerPress { background-color: #3399ff; }

#footer a:link { color: #CCCCCC; }
#footer a:visited { color: #666666; }
#footer a:hover { color: #FFFFFF; }
#footer a:active { color: #FFFFFF; }

/* ---------------------- ~STRUCTURE -------------------------------- */

#mainWrapper {
	width: 750px;
}

#leftWrapper {
	background: transparent;
	width: 350px;
	position: relative;
	float: left;
}

#contact {
	visibility: hidden;
	text-align: right;
	position: absolute;
	bottom: 0;
	right: 0;
}

#contentWrapper {
	width: 400px;
	float: right;
	height: 100%;
}

#content { padding: 25px 0 50px 25px; }

#footer {
	clear: both;
	position: relative;
	width: 100%;
	text-align: center;
	font-size: 0.8em;
	height: 25px;
}

/* ---------------------- ~HEADER ----------------------------------- */

#logo {
	font-size: 0;   
	width: 200px;
	float: left;
}

/* ---------------------- ~HEADINGS --------------------------------- */

h1 {
	font: bold 2.3em 'Arial MT', Arial, Verdana, sans-serif;
}

h2 {
	font: 1.7em 'Arial MT', Arial, Verdana, sans-serif;
}

h3 {
        font: 1.3em 'Arial MT', Arial, Verdana, sans-serif;
        font-weight: bold;
        margin-top: 40px;
        margin-bottom: 0;
}

/* ---------------------- ~NAVIGATION ------------------------------- */

/* div */
#nav {
	height: 90px;
	width: 550px;
	float: right;
	margin: 0;
	padding: 0;
}
	/* COLORS */
	#liAbout ul a { color: #660066; }
	#liRepertory ul a { color: #666666; }

/* main list */
#navBar {
	margin: 0;
	padding: 0 25px 0 0;
	height: 90px;
	float: right;
}
	
/* main menu set up */ 
#navBar a { text-decoration: none; }

#navBar li {
	display: block;
	float: left;
	margin: 0;
	padding: 0 5px 0 0;
}

#navBar li a {
	display: block;
}

/* submenus */
#navBar li ul, #navBar li.current ul{
	display: none;
	margin: 0;
	padding: 0;
	font-size: 1.2em;
	position: absolute;
	height: auto;
	width: 300px;   /* must be wide enough to fit all of submenu */
}

#liAbout ul { left: 200px; } 
#liRepertory ul { left: 470px; } 

#navBar li ul a, #navBar li.current ul a {
	margin: 0 7px 0 7px;
	width: auto;
	height: auto;
	padding: 0;
	display: block;
	background: transparent;
	font: 16px 'Arial MT', Arial, Verdana, sans-serif;
	font-weight: bold;
}

#navBar li.current ul { display: block; }

#navBar li:hover ul, #navBar li.over ul { display: block; }

#navBar li ul a:hover, #navBar li:hover ul a, #navBar li.over ul a { height: auto; }

/* set up images */
#navBar li span {
	position: absolute;
	left: -9384px;
}

#liHome a, #liAbout a, #liNewWork a, 
#liRepertory a, #liPress a, #liContact a {
	display: block;
	position: relative;
	background: transparent url(images/navbar.gif) no-repeat;
}

	#liHome a {
		height: 56px; width: 64px;
		background-position: 0 0;
	}
	
	#liHome.current a {
		height: 70px;
		background-position: 0 -70px;
	}

		#liHome a:hover, #liHome:hover a, #liHome.over a {
			height: 70px;
			background-position: 0 -70px;
		}

	#liAbout a {
		height: 56px; width: 65px;
		background-position: -71px 0;
	}
	
	#liAbout.current a {
		height: 70px;
		background-position: -71px -70px;
	}

		#liAbout a:hover, #liAbout:hover a, #liAbout.over a {
			height: 70px;
			background-position: -71px -70px;
		}
		
	#liNewWork a {
		height: 56px; width: 93px;
		background-position: -144px 0;
	}
	
	#liNewWork.current a {
		height: 70px;
		background-position: -144px -70px;
	}

		#liNewWork a:hover, #liNewWork:hover a, #liNewWork.over a {
			height: 70px;
			background-position: -144px -70px;
		}
		
	#liPress a {
		height: 56px; width: 61px;
		background-position: -246px 0;
	}
	
	#liPress.current a {
		height: 70px;
		background-position: -246px -70px;
	}

		#liPress a:hover, #liPress:hover a, #liPress.over a {
			height: 70px;
			background-position: -246px -70px;
		}
		
	#liRepertory a {
		height: 56px; width: 90px;
		background-position: -316px 0;
	}

	#liRepertory.current a {
		height: 70px;
		background-position: -316px -70px;
	}

		#liRepertory a:hover, #liRepertory:hover a, #liRepertory.over a {
			height: 70px;
			background-position: -316px -70px;
		}

	#liContact a {
		height: 56px; width: 77px;
		background-position: -414px 0;
	}
	
	#liContact.current a {
		height: 70px;
		background-position: -414px -70px;
	}

		#liContact a:hover, #liContact:hover a, #liContact.over a {
			height: 70px;
			background-position: -414px -70px;
		}
	
	
/* ---------------------- ~FORMS ------------------------------------ */

label {
	float: left;
	width: 95px;
	text-align: right;
	margin-right: 0.5em;
	display: block;
}

input.cForm, textarea.cForm {  
	color: black; 
	border: 1px #00ff33 solid;
}

#submit {
	float: right;
	margin-right: 25x;
}

/* ---------------------- ~MISC ------------------------------------- */

.logos {
	margin: 20px 20px 40px 0;
}

.quote {
	font-style: italic;
	padding: 0 25px 0 25px;
}

.quoteAuthor {
	text-align: right;
}

.tab { margin-left: 25px; }

.smallfont { font-size: 0.7em; }
.largefont { font-size: 1.3em; }

.floatLeft { float:left; }

.floatRight { float: right; }

.clearBoth { clear: both; }