/***********************************************/
/* 3col_leftNav.css                             */
/* Use with template 3col_leftNav.html          */
/***********************************************/

/***********************************************/
/* HTML tag styles                             */
/***********************************************/ 

body{ font-family: Arial,sans-serif; color: #333333; line-height: 1.166; margin: 0px; padding: 0px; }
a{ color: #006699; text-decoration: none; }
a:link{ color: #006699; text-decoration: none; }
a:visited{ color: #006699; text-decoration: none; }
a:hover{ color: #006699; text-decoration: underline; }
h1{ font: 1.2em Verdana, Arial, Helvetica, sans-serif; color: #334d55;  }
h2{ font: 1.1em Verdana, Arial, Helvetica, sans-serif; color: #006699;  }
h3{ font: 1em Verdana, Arial, Helvetica, sans-serif; color: #B0205B;  }
h4{ font: 1em Verdana, Arial, Helvetica, sans-serif; color: #333333;  }
h5{ font: 1em Verdana, Arial, Helvetica, sans-serif; color: #334d55;  }
ul{ list-style-type: square; }
ul ul{ list-style-type: disc; }
ul ul ul{ list-style-type: none; }
label{ font-family: Arial,sans-serif; font-size: 100%; font-weight: bold; color: #334d55; }

/***********************************************/
/* Layout Divs                                 */
/***********************************************/

#masthead{ padding: 10px 0px 0px 0px; width: 100%; }
#mastfoot{ padding: 10px 0px 0px 0px; width: 100%; border-top-width: 1px; border-top-style: solid; border-top-color: #B0205B;}
#navBar{ float: left; width: 175px; margin: 0px; padding: 0px; background-color: #eeeeee; border-right: 0px solid #cccccc; border-bottom: 0px solid #cccccc; }
#headlines,#cast{ float:right; border-left: 1px solid #B0205B; border-bottom: 1px solid #B0205B;  Width: 155px; margin: 0px; padding: 10px 10px 20px 10px; font-size: 80%;}
#profileimages{ float:right; border-left: 1px solid #B0205B; border-bottom: 1px solid #B0205B;  Width: 120px; margin: 0px; padding: 10px 10px 20px 10px; font-size: 80%;}
#specialfeatureimages{ float:right; border-left: 1px solid #B0205B; border-bottom: 1px solid #B0205B;  Width: 135px; margin: 0px; padding: 10px 10px 20px 10px; font-size: 90%;}
#whatsonimages{ float:right; border-left: 1px solid #B0205B; border-bottom: 1px solid #B0205B;  Width: 270px; margin: 0px; padding: 10px 10px 20px 10px; font-size: 80%;}
#content{ margin: 0 175px 0 175px; padding: 0 5px; }
#content img { margin:5px; padding: 0; float:right;}
#production_content{ margin: 0 0 0 180px; width: 75%; }
#prod_img_content{ margin: 0 175px 0 0px; padding: 0 5px; }
#profiles{ margin: 0 175px 0 175px; padding: 0 5px; }

/***********************************************/
/* Components                                  */
/***********************************************/

#siteName{ margin: 0; padding: 0 0 0 10px; }
#logo {width:49%; float:left;}
#logo a img {border:none;}
#search {width:49%; float:right;}
#clear {clear:right;}

/************* #globalNav styles **************/

#globalNav {
	color: #B0205B;
	border-bottom: 1px solid #B0205B;
	top:65px;
	position: absolute;
	left: 0px;
	padding-top: 0px;
	padding-right: 0px;
	padding-bottom: 5px;
	padding-left: 0px;
	width: 100%;
}
#globalNav div {float:right;}
#globalNav img{ display: block; }
#globalFooter {
	color: #B0205B;
	border-bottom: 1px solid #B0205B;
	top:65px;
	padding-top: 0px;
	padding-right: 0px;
	padding-bottom: 5px;
	padding-left: 10px;
}
#globalNav a, #globalFooter { font-size: 90%; padding: 5px 0px 5px 0px; }
#globalFooter { font-size: 90%; padding: 5px 0px 5px 10px; }


/*************** #pageName styles **************/

#pageName{ margin: 0px; padding: 0px 0px 0px 10px; }

/************* #breadCrumb styles *************/

#breadCrumb{
	font-size: 80%;
	color: #B0205B;
	border-bottom-width: 1px;
	border-bottom-style: solid;
	border-bottom-color: #B0205B;
	padding-top: 2px;
	padding-right: 0px;
	padding-bottom: 2px;
	padding-left: 10px;
}

/************** .feature styles ***************/

.feature{ font-size: 100%; padding: 0px 0px 10px 10px; }
.feature h3{ text-align: center; color: #B0205B; padding: 10px 0px 5px 0px; }
.feature img{ float: left; padding: 10px 10px 0px 0px; }
.production_feature{ font-size: 100%; padding: 0px 0px 10px 10px; }

/************** .story styles *****************/

.story{
	padding: 10px 0px 0px 10px;
	font-size: 80%;
	color: #000000;
}
.story p{ padding: 0px 0px 10px 0px; }

/************* #siteInfo styles ***************/

#siteInfo{ clear: both; border: 1px solid #B0205B; font-size: 75%; color: #cccccc; padding: 10px 10px 10px 10px; }
#siteInfo img{ padding: 4px 4px 4px 10px; vertical-align: middle; }

/************* #search styles ***************/

#search{
	font-size: 90%;
	padding-top: 5px;
	padding-right: 0px;
	padding-bottom: 5px;
	padding-left: 10px;
}
#search form{
	text-align: right;
}
#search label{ display: block; margin: 0px; padding: 0px; }

/*********** #navBar link styles ***********/

#navBar ul a:link, #navBar ul a:visited { display: block; color: #FFFFFF; }
#navBar ul {list-style: none; margin: 0; padding: 0;}

/* hack to fix IE/Win's broken rendering of block-level anchors in lists */
#navBar li {border-bottom: 1px solid #EEE;}

/* fix for browsers that don't need the hack */
html>body #navBar li {border-bottom: none;}


/*********** #sectionLinks styles ***********/

#sectionLinks{ margin: 0px; padding: 0px; font-size: 80%; background: #B0205B; position: relative; }
#sectionLinks h3{ padding: 10px 0px 2px 10px; color: #FFFFFF; }
#sectionLinks a { display: block; border-top: 1px solid #FFF; padding: 2px 0px 2px 10px; }
#sectionLinks a:hover{ background-color: #dddddd; }


/*********** .relatedLinks styles ***********/

.relatedLinks{ position: relative; margin: 0px; padding: 0px 0px 10px 10px; font-size: 90%; }
.relatedLinks h3{ padding: 10px 0px 2px 0px; color: #FFFFFF; }
.relatedLinks a:link, .relatedLinks a:visited { display: block; }

/************** #advert styles **************/

#advert{ padding: 30px 0px 10px; }
#advert img{ display: block; }

/************** #headlines styles **************/

#headlines p{ padding: 5px 0px 5px 0px; }
#headlines ul { list-style-type: none; margin: 5px 0px; padding: 0; }
#headlines li { margin: 10px 0 0 10px; }
#cast h2	{ margin: 0 0 10px 0;}
#cast ul	{ list-style-type: square; font-size: 90%;  margin: 0 0 0 10px; padding: 0;}
#cast li	{ }

/************** #menu styles **************/

/*dl, dt, dd, ul, li { margin: 0; padding: 0; }*/
#menu { position: absolute; /* Menu position that can be changed at will */ top: 1px; left: 3px; width: 100%; background-color: #B0205B; color: #FFFFFF; }
#menu dt { cursor: pointer; margin: 0.1em 0 0.1em 0.5em; height: 1.5em; font-weight: bold; background-color: #B0205B; }
#menuStudio { position: absolute; /* Menu position that can be changed at will */ top: 1px; left: 3px; width: 100%; background-color: #3a62a0; color: #FFFFFF; }
#menuStudio dt { cursor: pointer; margin: 0.1em 0 0.1em 0.5em; height: 1.5em; font-weight: bold; background-color: #3a62a0; }
#menu dd { border: thin none #FFFFFF; color: #FFFFFF; left: auto; clip: rect(auto,auto,auto,auto); margin-left:1em;  }
#menu li { text-align: left; background: #B0205B; }
#menuStudio li { text-align: left; background: #3a62a0; }
#menu li a, #menu dt a { color: #B0205B; text-decoration: none; display: block; border: 0 none; height: 100%; }
#menuStudio li a, #menuStudio dt a { color: #3a62a0; text-decoration: none; display: block; border: 0 none; height: 100%; }
#menu li a:hover, #menu dt a:hover { color: #B0205B; background-color: #CCC; }
#menuStudio li a:hover, #menu dt a:hover { color: #3a62a0; background-color: #CCC; }
.topmenu a{ cursor: pointer; margin: 0.1em 0 0.1em 0.5em; height: 1.5em; font-weight: bold; background-color: #B0205B; }

#productionList1, #productionList2 { width: 48%; font-size: 0.8em;}
#productionList1 ul, #productionList2 ul { list-style-type: none; margin: 0; padding: 0;}
#productionList1 li, #productionList2 li { clear: both; margin: 5px 0px;}
#productionList1 { float: left; }
#productionList2 { float: right; }
#clear {clear:both;}
.clear {clear:both;}

#photoList1, #photoList2 { width: 48%; font-size: 0.8em;}
#photoList1 ul, #photoList2 ul { list-style-type: none; margin: 0; padding: 0;}
#photoList1 li, #photoList2 li { clear: both; margin: 5px 0px;}
#photoList1 { float: left; }
#photoList2 { float: right; }

#home2 {float: left; }
#home2col2 {float: right; }
#home2, #home2col2 { width: 48% }
#home2 li, #home2col2 li { clear: both; margin: 5px 0px;}

.calendar td {text-align:center; color:#000;}
.calendar-month {background-color:#666666;}
.calendar-month td, .calendar-day td {text-align:center; color:#fff; font-weight:bold;}
.calendar-day td {color:#666666;}
.theatre-event {background-color: #b0205b;}
.theatre-event a, .theatre-event a:visited, .studio-event a, .studio-event a:visited {color:#fff;}
.theatre-event a:hover, studio-event a:hover {text-decoration:underline;}
.studio-event {background-color:#3a62a0;}

#lightbox{	position: absolute;	left: 0; width: 100%; z-index: 100; text-align: center; line-height: 0;}
#lightbox img{ width: auto; height: auto;}
#lightbox a img{ border: none; }

#outerImageContainer{ position: relative; background-color: #fff; width: 250px; height: 250px; margin: 0 auto; }
#imageContainer{ padding: 10px; }

#loading{ position: absolute; top: 40%; left: 0%; height: 25%; width: 100%; text-align: center; line-height: 0; }
#hoverNav{ position: absolute; top: 0; left: 0; height: 100%; width: 100%; z-index: 10; }
#imageContainer>#hoverNav{ left: 0;}
#hoverNav a{ outline: none;}

#prevLink, #nextLink{ width: 49%; height: 100%; background-image: url(data:image/gif;base64,AAAA); /* Trick IE into showing hover */ display: block; }
#prevLink { left: 0; float: left;}
#nextLink { right: 0; float: right;}
#prevLink:hover, #prevLink:visited:hover { background: url(../images/lightbox/prevlabel.gif) left 15% no-repeat; }
#nextLink:hover, #nextLink:visited:hover { background: url(../images/lightbox/nextlabel.gif) right 15% no-repeat; }

#imageDataContainer{ font: 10px Verdana, Helvetica, sans-serif; background-color: #fff; margin: 0 auto; line-height: 1.4em; overflow: auto; width: 100%	; }

#imageData{	padding:0 10px; color: #666; }
#imageData #imageDetails{ width: 70%; float: left; text-align: left; }	
#imageData #caption{ font-weight: bold;	}
#imageData #numberDisplay{ display: block; clear: left; padding-bottom: 1.0em;	}			
#imageData #bottomNavClose{ width: 66px; float: right;  padding-bottom: 0.7em; outline: none;}	 	

#overlay{ position: absolute; top: 0; left: 0; z-index: 90; width: 100%; height: 500px; background-color: #000; }