/*
Title:    Master screen styles for LavaStudio.ca
Author:   David VanDusen - david@figureandsound.com
Updated:  19 April 2006
*/

/* Global Reset */
* { font-size: 100%; margin: 0; padding: 0; }
/* Hide Accessibility Elements */
hr { display: none; }

body
{
	background: #0E0E0E;
	font-family: Verdana, 'Myriad Web', Syntax, sans-serif;
	font-size: 75%;
	line-height: 150%;
	padding: 0 15px 15px;
	text-align: center;
}

#content img
{
	border: 1px solid #0E0E0E;
	margin: 0.33em 1em 1em;
}


/* Page Structure, Colours, and Backgrounds
-----------------------------------------------------*/
#container
{
	background: #0E0E0E url("../images/styles/red_curtain.gif") repeat-y;
	color: #fee;
	margin: 0 auto;
	position: relative;
	text-align: left;
	width: 750px;
}
#header
{
	background: url("../images/styles/header.jpg") no-repeat;
	height: 227px;
	left: 0px;
	position: absolute;
	top: 0;
	width: 750px;
	z-index: 4;
}
#spirals
{
	background: url("http://lavastudio.ca/images/styles/spirals.jpg") no-repeat;
	display: block;
	height: 263px;
	left: -23px;
	position: absolute;
	top: 575px;
	width: 268px;
	z-index: 99;
}
#nav
{
	left: 357px;
	position: absolute;
	top: 0;
	z-index: 5;
}
#content
{
	height: 550px;
	margin: 0 35px 0 275px;
	min-height: 550px;
	padding: 227px 20px 0 30px;
	position: relative;
	z-index: 3;
}
html>body #content { height: auto; }

#footer
{
	background: url("http://lavastudio.ca/images/styles/red_curtain_bottom.jpg") repeat-x;
	clear: both;
	color: #aaa;
	padding: 142px 0 0;
	position: relative;
	z-index: 3;
}
#footer #author_info,
#footer #copyright
{
	background: #0E0E0E;
	padding: 0 40px 0 0;
	text-align: right;
}
* html #footer div { height: 0.1%; }

#lavastudio_link
{
	background: url("../images/styles/lava.gif") no-repeat;
	display: block;
	height: 40px;
	left: 100px;
	position: absolute;
	top: 130px;
	width: 79px;
}
#lavastudio_link span { visibility: hidden; }


/* Navigation
-----------------------------------------------------*/

#nav ul
{
	height: 95px;
}
#nav li
{
	float: left;
	list-style: none;
}
#nav li a
{
	background-image: none;
	background-repeat: no-repeat;

	display: block;
	float: left;
	height: 95px;
	overflow: hidden;
}
#nav li a span { display: none; }
#nav li#home_link a { background-position: 0 0; width: 60px; }
#nav li#artists_link a { background-position: -60px 0; width: 50px; }
#nav li#gallery_link a { background-position: -110px 0; width: 65px; }
#nav li#performances_link a { background-position: -175px 0; width: 85px; }
body.home #nav li#home_link a, #nav li#home_link a:hover,
body.artists #nav li#artists_link a, #nav li#artists_link a:hover,
body.gallery #nav li#gallery_link a, #nav li#gallery_link a:hover,
body.performances #nav li#performances_link a, #nav li#performances_link a:hover
{ background-image: url("../images/styles/menu_hover.jpg"); }


/* Typography
-----------------------------------------------------*/

a, a:link, a:active, a:visited
{
	color: #faa;
	text-decoration: none;
}
a:hover { color: #f66; }

h1, h2, h3, h4, th
{ font-family: Georgia, 'Minion Web', Palatino, 'Book Antiqua', Utopia, 'Times New Roman', serif; }
h1
{
	left: 0;
	position: absolute;
	bottom: 95px;
	width: 100%;
}
h1 #title { display: none; }
h1 #subtitle
{
	display: block;
	font-size: 2.5em;
	font-weight: 400;
	line-height: 125%;
	margin: 0 35px 0 275px;
	padding: 0px 20px 0 30px;
	text-align: center;
}

h2
{
	border-bottom: 1px solid #a88;
	clear: both;
	font-size: 1.65em;
	font-weight: 400;
	line-height: 125%;
	margin: 1em 0 0.33em;
	padding: 0 0 0.33em;
	text-align: center;
}
h3
{
	clear: both;
	font-size: 1.35em;
	font-weight: 800;
	line-height: 125%;
	margin: 2em 0 0.33em;
}

big { font-size: 1.25em; font-weight: 800; }
small { font-size: 0.75em; }

#content p, #content ul, #content ol, #content dl
{
	margin: 1em 0;
}
#content p .first-letter
{
	display: block;
	float: left;
	font-size: 4.5em;
	font-family: Georgia, "Minion Web", Palatino, "Book Antiqua", Utopia, "Times New Roman", serif;
	font-weight: 400;
	line-height: 1em;
	padding: 0 0.2ex 0 0;
}
#content p.feature a
{
	border: solid #a88;
	border-width: 1px 0;
	display: block;
	font: 800 1.25em/150% Georgia, 'Book Antiqua', 'Times new Roman', times, serif;
	margin: 1em 100px;
	padding: 15px;
	text-align: center;
}

#content p.date
{
	color: #a88;
	font-size: 0.9em;
	font-style: italic;
	margin: 0 0 0.5em;
	text-align: left;
}
#content .stb
{
	background: url("../images/styles/tilde.gif") 50% 0 no-repeat;
	margin-top: 1em;
	padding-top: 14px;
}
#content dt { margin: 1em 0 0; }
#content dd { font-size: 0.9em; }

#footer
{
	font-size: 0.75em;
}
#footer a { color: #820; }
#footer a:hover { color: #a40; }

.clear_both { clear: both; display: block; }
.centered { text-align: center; }



/* SOA Icons
-----------------------------------------------------*/
#soa_icon
{
	display: block;
	position: absolute;
	z-index: 3;
}
body.home #soa_icon
{
	background: url("../images/styles/group_1.jpg") no-repeat;
	height: 339px;
	left: 18px;
	top: 160px;
	width: 208px;
}
body.artists #soa_icon
{
	background: url("../images/styles/group_3.jpg") no-repeat;
	height: 383px;
	left: 18px;
	top: 123px;
	width: 256px;
}
body.gallery #soa_icon
{
	background: url("../images/styles/group_2.jpg") no-repeat;
	height: 334px;
	left: 0px;
	top: 163px;
	width: 293px;
}
body.performances #soa_icon
{
	background: url("../images/styles/group_4.jpg") no-repeat;
	height: 385px;
	left: 0px;
	top: 131px;
	width: 282px;
}