/* 
Title: 		Master Styles for ArtsAlive.ca  - FRENCH THEATRE HOME
Author:		jay.west for the National Arts Centre
Contact:	creative@jaywest.com
Updated:	October 26, 2006 
*/



/* Layout Adjustments
--------------------------------------------------------------------------------- */

#contentFrame {background-color:#000;}

#contentFrame #sideBar {
  	width: 245px; 	/* for ie5*/
  	w\idth: 245px; 	/* ie6 and others */
}

#contentFrame #contentColumn {
	margin-left:0;
	padding-left: 10px;
	overflow: hidden; /* ensure the div stretches to contain its floats */
	width: 482px; /* width or height is required by IE for the above rule to work */
	background: url("/img/thf/css/bgContentHome.gif") bottom right repeat-y;
	padding-bottom: 10px;
}
html>body #contentFrame #contentColumn {width: 485px;} /* hide from IE */

#contentBottom {background: #DCAE01 url("/img/thf/home/bgIntroBottom.gif") top left no-repeat;width: 740px; margin-left: 20px; padding-top: 25px;}
#bottomInner {background: #000 url("/img/thf/home/bgBlackFade.gif") bottom left repeat-x; width: 700px;}

#visitorNav		{background-image: url("/img/thf/css/bgVisitorsNavHome.gif");}
#contentFrame	{background-image: url("/img/thf/home/bgSideBarHome.jpg");}
#footer			{background: none; padding-top: 10px;}

/*#contentColumn .photoRight {margin-bottom: 0;}*/


/* Side Bar
--------------------------------------------------------------------------------- */

#sideBar p {
	font: 10px verdana, geneva, arial, sans-serif;
	color: #fff;
	margin: 220px 30px 0 20px;
	line-height: 16px;
}



/* Intro Text
--------------------------------------------------------------------------------- */

body.english #contentColumn h2 {  /* image replacement */
	height: 47px;
	width: 244px;
	background: url("/img/thf/home/tWelcomeEn.gif") top left no-repeat;
	display: block;
	text-indent: -5000px;
	margin: 36px 0 10px 0;
}
body.french #contentColumn h2 {  /* image replacement */
	height: 47px;
	width: 244px;
	background: url("/img/thf/home/tWelcomeFr.gif") top left no-repeat;
	display: block;
	text-indent: -5000px;
	margin: 36px 0 10px 0;
}

#intro {margin: 20px 0 0 0; color:#575821; line-height: 18px;}






/* Intro Photo
--------------------------------------------------------------------------------- */

#contentColumn .photoRight {
	background-color: #fff;
	float: right; 
	margin: 5px 0 15px 10px;
	padding: 10px;
}
#contentColumn .photoRight img {border:none;}

.photoRight .credit {
	font-size: 9px;
	text-align:right;
	color: #999;
	margin-top: 5px;
}
.photoRight .caption {
	font-size: 11px;
	color: #666;
	margin-top: 5px;
	/*margin-right: -20px;*/
	display:block;
}	

.photoRight:hover span {display:none;}



/* What's Hot
--------------------------------------------------------------------------------- */

#whatshot {padding: 10px 0 20px 20px; position:relative;}
/*#whatshot a {color: #000; text-decoration:none; padding: 0;}
#whatshot a:hover {color: #000; background-color:#ffde99;}
*/

body.english #whatshot h3 {  /* image replacement */
	height: 23px;
	width: 165px;
	background: url("/img/thf/home/tWhatsHotEn.gif") top left no-repeat;
	display: block;
	text-indent: -5000px;
	margin: 10px 0 0 210px;
}
body.french #whatshot h3 {  /* image replacement */
	height: 29px;
	width: 245px;
	background: url("/img/thf/home/tWhatsHotFr.gif") top left no-repeat;
	display: block;
	text-indent: -5000px;
	margin: 10px 0 0 210px;
}

#whatshot ul {
	float: right; /* opposing float with spotlight */
	margin-top: 10px;
}
#whatshot ul {width: 70%;}
/*#whatshot li img {border-color: #000;}
#whatshot a:hover img {border-color: #fff;}*/


/* over-ride global colors because they are the same color as the background */
#whatshot a {color: #000;}
#whatshot li.module3 img {border-color:#a38526;}
#whatshot li.module3:hover {background-color: #a38526;}
#whatshot li.module3:hover a {color: #fff;}
#whatshot li.module3:hover img {border-color: #fff;}



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



/* Spotlight
--------------------------------------------------------------------------------- */

#spotlight {
	float: left; /* opposing float with what's hot */
	margin-top: -20px;
	position:relative; /* required to position caption over image */ 
}
#spotlight img {border-color: #a38526;}	
/*#spotlight p {
	position: absolute;
	top: 133px;
	left: 10px;
	color: #fff;
	}
*/


/* Tease
--------------------------------------------------------------------------------- */

#tease {float:right;}
#tease h4 {color:#cd5806; margin: 10px 0 10px 0; letter-spacing:0.2em;}
#tease #colLeft, #tease #colRight {background-color:#26241c;}
#tease dt a {color: #e6c64b;}
#tease dt a:hover {background-color: #e6c64b; color:#000;}
#tease dd {color: #a38526;}



/* Resources 
--------------------------------------------------------------------------------- */

#resources {float:left; margin-top: 30px;}




/* Subscribe 
--------------------------------------------------------------------------------- */

#subscribe {float: left; padding: 0 10px;}