/* @override 
	http://artsalive.ca/css/splash/standards.css
	http://stage.artsalive.ca/css/splash/standards.css
	http://stage.artsalive.ca/css/global/navArtsAliveMaster.css
*/

/* 
Title: 		Master Styles for ArtsAlive.ca  - SPLASH PAGES
Author:		jay.west for the National Arts Centre
Contact:	creative@jaywest.com
Updated:	October 29, 2006  
*/


/* This document should contain all pure and valid css rules. 
All hacks required to compensate for IE bugs are maintained in ie.css */



@import url("/css/global/navArtsAliveMaster.css");


 

/* @group General Rules   
--------------------------------------------------------------------------------- */

* {margin:0; padding:0;} /* by default remove all the padding and margins from every page element */
#browserWarning {display: none;} /* web standards message will be hidden from modern browsers */


/* The default size for "medium" text in all modern browsers is 16px. 
We will reduce the size for the entire document to small using relative keywords:
This takes 16px down to roughly 12px, which is a bit more elegant for a relative base 
IE5/Win has a size decrepency so we will provide hack in order to get it inline.
All navigation items will continue to be specified in pixels.  */

body {
	font-size:small; /* for standards browsers */
	font-family: Verdana, Helvetica, sans-serif;
	color: #fff;
	background-color: #000;
	/*background: #000 url("/img/splash/bgSplash.jpg") top center no-repeat;*/
	background: #000 url("/img/splash/bg_intro.gif") 50% 56px repeat-x;
}


p, li {
	line-height: 125%;
	font-size: 95%;
	margin: 0 0 10px 0;
	color: #fff;
}
blockquote {
	margin: 5px 20px; 
	font: 120% Georgia, "Times New Roman", Times, serif; 
	color:#ccc; 
	line-height:120%; 
	font-style:italic;
}


body#home #nav_global h2 {
display: none;
/*background: none;*/
}
/*body#home #nav_global ul {
display: none;
background: none;
left: 80px;
}*/


/* @end */




/* @group Links   
--------------------------------------------------------------------------------- */

a.image, a.image:hover {background-color: transparent; border:none;}

/*
a.pdf {background: transparent url("/img/template/iconPDF.gif") center left no-repeat; padding-left:14px;}
a.email {background: transparent url("/img/template/iconEmail.gif") center right no-repeat; padding-right:15px;}
a.email:hover {background: #f90 url("/img/template/iconEmailHover.gif") center right no-repeat; padding-right:15px;}
*/
a.linkExternal {background: transparent url("/img/dan/css/linkExternal.gif") center right no-repeat; padding-right:15px;}
a.linkExternal:hover {background: #f90 url("/img/dan/css/linkExternalHover.gif") center right no-repeat;}

a {cursor:hand; color:#f90; padding: 0 1px;}
a:hover {text-decoration:none; color:#000; background-color:#f90; border:none;}
a img {border:none;} /* remove border for all linking graphics */

#subscribe a {border:none;} 
#subscribe a:hover {background:none;} 


/* @end */








/* @group Lists   
--------------------------------------------------------------------------------- */


ul, ol {margin-left: 0; padding-left: 0;} /* establish consistent indentation across all browsers */ 
ul, ol {margin: 0 0 10px 0;} /* space above and below */ 
li {margin: 0 0 6px 0;}

ul li {list-style: square outside; margin-left: 16px;}
ol li {margin-left: 30px;}

dl {margin: 0 0 10px 0;}
dt {margin: 15px 0 3px 0; font-weight:bold;}
dd {margin: 0 0 6px 0; font-size:90%; color:#666;}

/* @end */









/* @group Forms   
--------------------------------------------------------------------------------- */

form { width:100%; margin:0; padding:0; } 

fieldset { 
	float : left; 
	width : 90%; 
	margin : 0 1em 0 0; 
	padding : 1em; 
	border : 1px solid #999; 
	 background-color:#191919;
	display:block;
}

legend { 
	font-weight : bold; 
	color : #fff; 
	margin : 0; 
	padding : .5em; 
}
input, textarea { border: 3px double #999; margin: 0 0 10px 0;}
label { display : block; margin: 0 0 2px 0;} /* force them to a new line */

label.checkbox {margin: 0 10px 3px 0; width:auto;}
input.checkbox  {border:none; float:left; margin: 0 5px 0 0;}

#fm-submit { clear:both; padding:1em 0; }
.fm-required { border: 1px solid #900; }


/* @end */







/* @group Headings   
--------------------------------------------------------------------------------- */

/* used by the ArtsAlive  graphic */
h1 {
text-indent: -9999px; /* hide the text */
width: 474px; /* width of replacement image */
height: 128px; /* height of replacement image */
background: url("/img/splash/AA_home_logo_en.png") 0 0 no-repeat;
margin: 0;
position: absolute;
top: 40px;
left: 0;
}	

body.french h1 {
background: url("/img/splash/AA_home_logo_fr.png") top left no-repeat;
}

h1 a {
	width: 474px; /* width of replacement image */
	height: 128px; /* height of replacement image */
	display: block;
}
h1 a:hover {background: none;}



	
h2 {
	font: 190% bold "Trebuchet MS", Verdana, Arial, Helvetica, sans-serif;
	color: #f90;
	margin: 20px 0 10px 0;	
	clear:left;
}
/*body#home h2 {font-size: 140%; margin: 0 0 5px 20px;}
body#home.french h2 {font-size: 120%;}*/

h3 {
	font: 150% bold "Trebuchet MS", Verdana, Arial, Helvetica, sans-serif;
	color: #fbb948;
	margin: 20px 0 5px 0;	
	clear:left;
	letter-spacing: 0.1em;
}	


/* @end */









/* @group Page Structure   
--------------------------------------------------------------------------------- */

#pageWrap {
	width: 760px; /* fix the width */
	margin: 0 auto; /* centre the page */
	overflow: hidden; /* ensure the div stretches to contain its floats */
	height: 1%; /* holly hack - width or height is required by IE for the above rule to work */
	position:relative; 
}

#contentColumn {
	width: 520px;
	margin: 0 auto;
}

#contentBottom {
	width: 760px; /* fix the width */
}




/* HOME */

body#home #contentColumn {
	width: auto;
	clear: both;
}

#whatshot {
	float: left;
	width: 66%;
}
#resources {margin-bottom: 20px;}
#resources dd {font-size: 100%; color:#CB6501;}


#content_main {
width: 530px;
float: left;
}
#content_sub {
width: 190px;
float: right;
margin: 0 20px 0 0;
}



/* @end */








/* @group #intro   
--------------------------------------------------------------------------------- */

#intro {
/*padding: 20px 0 0 0;*/
position: relative;
height: 220px;
margin: 0 0 20px 0;
overflow: visible;
}

#intro p {
font: 12px/1.4em Verdana, Helvetica, sans-serif;	
/*color: #FBB948;*/ 
color: #777;
/*font-size: 90%;
line-height:160%;*/
position: absolute;
top: 35px;
right: 20px;
width: 186px;
}
#intro p strong {
/*color: #FF9900;*/
color: #999;
}
#intro a {
color: #999;
}
#intro a:hover {
color: #fff;
background: none;
}

body.french #intro p {
line-height:130%;
}




/* #nav_home_about */ 

#nav_home_about {
/*margin: 0 0 0 20px;*/
overflow: hidden;
white-space: nowrap;
position: absolute;
bottom: 10px;
left: 20px;
}
#nav_home_about li  { 
display: inline; /* make the list horizontal */
list-style: none; /* hide the bullets */
float: left;
margin: 0;
border-right: 1px solid #282828;
}
#nav_home_about li:last-child {border-right:0;} /* hide last pipe */
#nav_home_about a {
padding: 3px 6px; /* spacing between text and pipe */ 
margin: 0;
color: #4E4E4E;
text-decoration: none;
}
#nav_home_about a:hover {
color: #000;
}
 
	
	
	

/* @end */







/* @group #whatshot   
--------------------------------------------------------------------------------- */

#whatshot {
clear: left;
background:url(/img/splash/bgWhatsNew.gif) top left no-repeat;
position:relative;
margin: 8px 0 0 0;
width: 530px;
}
#whatshot h3 {
	display:block;
	font: 200% bold "Trebuchet MS", Verdana, Arial, Helvetica, sans-serif;
	color: #f90;
	margin: 10px 0 -10px 0;
}
#whatshot ul {width: 98%;}
#whatshot ul li {list-style: none;}

#whatshot #feed {
	position: absolute; /* positioned withing its parent, requires it parent to be positioned */
	top: 30px;
	right: 60px;
	}
#whatshot #feed a {color:#f90;}
#whatshot #feed a:hover {color:#000;}


/* @end */







/* @group #spotlight   
--------------------------------------------------------------------------------- */

#spotlight {
/*margin: -90px 45px 0 0;*/
position: relative; /* required to position caption over image */ 
/*top: -91px;
right: 45px;*/
float:left;
margin: 0 0 20px 0;
}

/*html>body #spotlight {margin: 0 40px 0 20px;}   hide from IE */

/*#spotlight img {border: 4px;}*/
#spotlight a:hover {background:none;}

/*
#spotlight p {
	position: absolute;
	top: 133px;
	left: 10px;
	color: #fff;
}
*/

/* @end */







/* @group #nav_utility   
--------------------------------------------------------------------------------- */

/* Generic Horizontal Pipe Nav */
/* This can be used globally and restyled as needed within the cascade. */
/* Tested in - Win/IE5 Win/IE5.5 Win/IE6 Win/NN4 Win/NN6 Win/NN7 Win/Moz Mac/Safari Mac/IE5 Mac/Moz */

.navHorizPipe li {
	display: inline; /* make the list horizontal */
	list-style: none;
	float: left;
	border-left: 1px solid #fff;
	margin: 0;
	padding: 0;
}
.navHorizPipe li a  {
	padding: 0 6px 1px 6px;
	text-decoration: none;
	font-weight: normal;
	border:none;
}
.navHorizPipe li a {display: block;}
.navHorizPipe li:first-child {border-left:0;} /* hide first pipe (Mozilla, Netscape, Safari) */

* html .navHorizPipe { height: 1%; } /* Win/IE browsers only */
* html .navHorizPipe li {margin: 0 1px 0 -1px;} /* Win/IE browsers only LI's are shifted to the left using a negative margin value to hide the first pipe.*/

.navHorizPipe li a:hover {color:#000; text-decoration:none; background-color:#eee;}


/*Utility Navigation */

#navUtility {float:right; padding: 3px 15px;}
#navUtility li {border-color:#666;}
#navUtility a {color:#fff; font-size: 85%;}
#navUtility a:hover {color:#fff; text-decoration:none; background-color:#333;}


/* @end */






/* @group #home_modules   
--------------------------------------------------------------------------------- */

#home_modules {
	list-style-type: none;	/*turns off display of bullet*/
	font-size:7px; /* set small point size to fix IE5 Mac bug due to nowrap below also fix side nav wrap in DW */
	height: 91px; /* overall height of the nav object */
	width: 509px; /* overall width of the nav object */
	float:left;
	margin: 0 0 0 20px;
}
#home_modules li {
	position:relative;
	float:left; /*fix Mozilla bug not showing bg images on page load */
	list-style-type: none;	/*turns off display of bullet*/
	margin: 0;
	padding: 0;
}
#home_modules li a {
	float: left;
	padding: 91px 0 0 0;
	overflow: hidden;
	height: 0px !important; 
	height /**/:91px; /* for IE5/Win only */
	width: 509px;
	border:none; /* remove global link border */	
	/* background-position: 0 0; */ 
	background-repeat: no-repeat;
}


/* set the language specific graphics for off-state */

body.english #home_modules {background: url("/img/splash/navGlobalEn.gif");}
body.french #home_modules {background: url("/img/splash/navGlobalFr.gif");}

/* set the language specific graphics for hover-state */

body.english #home_modules a:hover {background: transparent url("/img/splash/navGlobalEn.gif");}
body.french #home_modules a:hover {background: transparent url("/img/splash/navGlobalFr.gif");}


/* create the hot spots */

body.english #nav_home_mus a, body.french #nav_home_mus a {width: 128px;}
body.english #nav_home_eth a, body.french #nav_home_eth a {width: 128px;}
body.english #nav_home_thf a, body.french #nav_home_thf a {width: 128px;}
body.english #nav_home_dan a, body.french #nav_home_dan a {width: 125px;}


/* create hovers - vertical offset the background to reveal the hover-state */
 
body.english #nav_home_mus a:hover, body.french #nav_home_mus a:hover {background-position:    0px -91px;}
body.english #nav_home_eth a:hover, body.french #nav_home_eth a:hover {background-position: -128px -91px;}
body.english #nav_home_thf a:hover, body.french #nav_home_thf a:hover {background-position: -256px -91px;}
body.english #nav_home_dan a:hover, body.french #nav_home_dan a:hover {background-position: -384px -91px;}

/* @end */





/* @group #home_musicbox   
--------------------------------------------------------------------------------- */

#home_musicbox {
margin: 20px 0 0 20px;
float: left;
}
#home_timeline {
margin: 20px 0 0 0;
float: left;
}

#home_musicbox a {
text-indent: -9999px; /* hide the text */
width: 253px; /* width of replacement image */
height: 90px; /* height of replacement image */
height: 0px !important;
background: url("/img/splash/musicbox_en.png") 0 0 no-repeat;
padding: 90px 0px 0 0;
margin-right: 3px;
float: left;
}	

#home_timeline a {
text-indent: -9999px; /* hide the text */
width: 253px; /* width of replacement image */
height: 90px; /* height of replacement image */
height: 0px !important;
background: url("/img/splash/timeline_en.png") 0 0 no-repeat;
padding: 90px 0 0 0;
float: left;
}

/* set the language specific graphics for off-state */
body.english #home_musicbox a	{background: url("/img/splash/musicbox_en.png");}
body.english #home_timeline a	{background: url("/img/splash/timeline_en.png");}

body.french #home_musicbox a	{background: url("/img/splash/musicbox_fr.png");}
body.french #home_timeline a	{background: url("/img/splash/timeline_fr.png");}

/* set the language specific graphics for hover-state */
/*body.english #home_musicbox a:hover	{background: transparent url("/img/splash/timeline_en.png");}
body.french #home_musicbox a:hover	{background: transparent url("/img/splash/timeline_fr.png");}*/ 

/*create hovers - vertical offset the background to reveal the hover-state*/ 
body.english #home_musicbox a:hover	{background-position: 0px -90px;}
body.english #home_timeline a:hover		{background-position: 0px -90px;}

body.french #home_musicbox a:hover		{background-position: 0px -90px;}
body.french #home_timeline a:hover		{background-position: 0px -90px;}

/* @end */











/* @group #home_collections   
--------------------------------------------------------------------------------- */

#home_collections {
list-style-type: none;	/*turns off display of bullet*/
width: 190px; /* overall width of the nav object */
float:left;
margin: 0 0 20px 0;
}
#home_collections li {
position:relative;
float:left; /*fix Mozilla bug not showing bg images on page load */
list-style-type: none;	/*turns off display of bullet*/
margin: 0;
padding: 0;
}
#home_collections li a {
text-indent: -9999px; /* hide the text */
width: 190px; /* width of replacement image */
height: 110px; /* height of replacement image */
height: 0px !important;
background: url("/img/splash/timeline_en.png") 0 0 no-repeat;
padding: 110px 0 0 0;
float: left;
}

/* set the language specific graphics for off-state */
body.english #home_sets a		{background: url("/img/splash/sets_en.png");		height: 91px; padding: 91px 0 0 0;}
body.english #home_costumes a	{background: url("/img/splash/costumes_en.png");	height: 110px;}
body.english #home_posters a	{background: url("/img/splash/posters_en.png");		height: 110px;}

body.french #home_sets a		{background: url("/img/splash/sets_fr.png");		height: 91px; padding: 91px 0 0 0;}
body.french #home_costumes a	{background: url("/img/splash/costumes_fr.png");	height: 110px;}
body.french #home_posters a		{background: url("/img/splash/posters_fr.png");		height: 110px;}


/*create hovers - vertical offset the background to reveal the hover-state*/ 
body.english #home_sets a:hover, body.french #home_sets a:hover			{background-position: 0px -91px;}
body.english #home_costumes a:hover, body.french #home_costumes a:hover	{background-position: 0px -110px;}
body.english #home_posters a:hover, body.french #home_posters a:hover		{background-position: 0px -110px;}

/* @end */









/* @group #footer 
--------------------------------------------------------------------------------- */

#global_footer {
	font: 10px verdana, geneva, arial, sans-serif;
	color: #666;
	padding: 10px 0;
	border-top: 1px solid #c00;
	clear: both;
	margin: 10px 0;
	height: 500px;
	overflow: visible;
}

#footer {
	font: 10px verdana, geneva, arial, sans-serif;
	color: #666;
	padding: 10px 0;
	border-top: 1px solid #c00;
	clear: both;
	margin: 10px 0;
	height: 500px;
	overflow: visible;
}
#footerLogos {
	text-align: center;
	background: url(/img/footer_divider.png) no-repeat;
	background-position: center;
	padding-top: 120px;
}
#footerLogos img {
	padding: 0 10px;
}	


#footer p {margin: 15px 0; color: #666; text-align: center;}



#footer a:hover {background:none;}

/* @end */