/*ELEMENTS*/

*	{ margin: 0; padding: 0; } 

body {
color:#A2A2A2;
background-color:#000000;
font-family:  "Lucida Grande", "Lucida Sans Unicode", Arial, sans-serif; color:#a2a2a2;
font-size:62.5%; line-height:1.5em;
background-image: url(http://www.theatreworx.com/images/topback.jpg);
background-repeat:repeat-x;
}

a:link {color:#24B0E5; text-decoration:none;}
a:hover {color:#D8201B; text-decoration:underline;}
a:visited {color:#24B0E5; text-decoration:none;}
a:active {color:#24B0E5; text-decoration:none;}
a img 		{ border: none; }

h1 {
font-size: 2.2em;
}

h2 {
font-size: 1.6em;
float:left;
}

h2 a:link {color:#FFF; text-decoration:none;}
h2 a:hover {color:#A2A2A2; text-decoration:none;}
h2 a:visited {color:#FFF; text-decoration:none;}
h2 a:active {color:#FFF; text-decoration:none;}

h3 {
font-size: 1.2em;
clear:left;
}



img {
float: left;
}
/*DIV IDS*/

#wrap {
background:#242424;

}


#wrap #banner
{
font-size: 1.4 em;
color: #24B0E5;
height: 175px;
float:left;
background: url(http://www.theatreworx.com/images/theatreworx.jpg) no-repeat;
margin: 0px 0 20px 0px;
/*border-bottom: solid 1px #FFF;*/
}

#wrap #banner #navbarlist a:link {color:#24B0E5; text-decoration:none;}
#wrap #banner #navbarlist a:hover {color:#168BB8; text-decoration:underline;}
#wrap #banner #navbarlist a:visited {color:#24B0E5; text-decoration:none;}
#wrap #banner #navbarlist a:active {color:#24B0E5; text-decoration:none;}

#wrap #banner #navbarlist
{
height:30px;
float:right;
font-size:1.4em;
margin: 150px 0px 5px 0px;
}

#wrap #banner #navbarlist li
{
clear:none;
display:inline;
width: 220px;
padding:2px;
text-align:center;
color:#24B0E5;
}


#wrap #banner p
{
float:right;
}*/

#wrap #navigation
{ 	
height: 50px;
background-color:#000000;
background-color: #292929;
}
#wrap #logo
{
height:50px;
background:#282828;
border-bottom: 2px solid #FFF;
/*margin-bottom:10px;*/
float:left;
}
		
#wrap #navbar
{
height:50px;
background-color:#9966CC;
}

#wrap #header
{ 	
height: 150px;
background-color:#FF0000;
margin: 0 0 10px 10px;
float:left;
clear:left;
}

#wrap #header_alt
{ 	
height: 150px;
background-image: url(http://www.theatreworx.com/images/tw/test_head1.png);
float:left;
margin-bottom:10px;
}

#wrap #slideshow
{ 	
height: 150px;
background-color:#99FF00;
}



#wrap #main
{
padding:0;
float:left;
min-height:750px;
height:auto;

}




#wrap #main h1{

}

#wrap #main h2
{
clear:left;
float:left;
}

#wrap #main p
{
margin:10px 10px 0px 0px;
font-size: 1.2em;
line-height:16px;
}








#wrap  #main img.small
{
float:left;
clear:left;
width:150px;
height:100px;
margin: 10px 10px 0px 0px;
}

#wrap  #main img.small-sq
{
float:left;
clear:left;
width:100px;
height:100px;
margin: 10px 10px 0px 0px;
}

#wrap  #main img.large
{
float:left;
clear:left;
width:300px;
height:200px;
margin: 10px 10px 0px 0px;
}

#wrap  #main img.large-sq
{
float:left;
clear:left;
width:300px;
height:300px;
margin: 10px 10px 0px 0px;
}

#wrap  #main img.list
{
width:160px;
height:160px;
float:right;
clear:none;
border: 10px solid #000;
}
#wrap  img.spacer
{
width:1px;
height:600px;
float:left;
clear:none;
border: 0px;
margin:0;
padding:0;
}

#wrap  #main img:hover.list 
{
border: 10px solid #282828;
}


#wrap  #filmstrip
{
background:url(images/tw/buttons/gallery.jpg) no-repeat #444444;
float:left;
margin-top:10px;
}

#wrap #filmstrip img {
	width:100px;
	height: 150px;
	margin: 10px 0px 10px 60px;
	float: left;
	border: 10px solid #FFF;
	}

#wrap #filmstrip img:hover {
	border: 10px solid #282828;
	}




#wrap #main ul {
	font-size: 11px;
	color: #FFFFFF;
	text-decoration: none;
	margin: 5px 0px 5px 5px;
	float: left;
	line-height: 16px;
	clear: left;
	width: 350px;
	list-style-position: inside;
	list-style-type: disc;
}
#wrap #main ul {
	font-size: 11px;
	color: #FFFFFF;
	text-decoration: none;
	margin: 5px 0px 5px 5px;
	float: left;
	line-height: 16px;
	clear: left;
	width: 350px;
	list-style-position: inside;
	list-style-type: disc;
}

img.right
{float:right;
}
img.left
{float:left;
}

#wrap #bottombody #bottombodyleft p {
	font-size: 12px;
	color: #FFFFFF;
	text-decoration: none;
	margin: 5px 0px 5px 5px;
	float: left;
	line-height: 16px;
	clear: left;


}


#wrap #main form
{
background: transparent /*#24B0E5*/;
float:left;
padding:0px
}

#wrap #main input.center
{
width: 100px;
float:left;
clear:left;
text-align:center;

}

#wrap #main input.radio
{
width:auto;
margin:5px;
float:left;
clear:none;
}

#wrap #main  p.radio
{
margin:5px 0px 0px 0px;
float:left;
clear:left;
width:200px;
}





#wrap #main  textarea
{
width: 300px;
height: 100px;
margin: 10px 0px 0px 0px;
float:left;
clear:left;
}

#wrap #main input
{
width: 300px;
margin: 10px 0px 0px 0px;
float:left;
clear:left;


}


#wrap #main label
{
margin: 10px 0px 0px 0px;
float:left;
clear:left;
font-size:1.2em
}

#wrap #main  #fadeshow1
{
height:400px;
margin:0px 0 25px 0;
float:left;
background:#FFF;
border: 10px solid #282828;
}

/*#wrap #main #fadeshow1 img
{
height:400px;
width:700px;
margin:10px 0 0 0;

}*/

/*
	Variable Grid System.
	Learn more ~ http://www.spry-soft.com/grids/
	Based on 960 Grid System - http://960.gs/

	Licensed under GPL and MIT.
*/


/* Containers
----------------------------------------------------------------------------------------------------*/
.container_12 {
	margin-left: auto;
	margin-right: auto;
	width: 961px;
background:#000066;
}

/* Grid >> Global
----------------------------------------------------------------------------------------------------*/

.grid_1,
.grid_2,
.grid_3,
.grid_4,
.grid_5,
.grid_6,
.grid_7,
.grid_8,
.grid_9,
.grid_10,
.grid_11,
.grid_12 {
	display:inline;
	float: left;
	position: relative;
	margin-left: 10px;
	margin-right: 10px;
}

/* Grid >> Children (Alpha ~ First, Omega ~ Last)
----------------------------------------------------------------------------------------------------*/

.alpha {
	margin-left: 0;
}

.omega {
	margin-right: 0;
}

/* Grid >> 12 Columns
----------------------------------------------------------------------------------------------------*/

.container_12 .grid_1 {
	width:60px;
}

.container_12 .grid_2 {
	width:140px;
}

.container_12 .grid_3 {
	width:220px;
}

.container_12 .grid_4 {
	width:300px;
}

.container_12 .grid_5 {
	width:380px;
}

.container_12 .grid_6 {
	width:460px;
}

.container_12 .grid_7 {
	width:540px;
}

.container_12 .grid_8 {
	width:620px;
}

.container_12 .grid_9 {
	width:700px;
}

.container_12 .grid_9_border {
	width:680px;
}

.container_12 .grid_10 {
	width:780px;
}

.container_12 .grid_11 {
	width:860px;
}

.container_12 .grid_12 {
	width:940px;
}



/* Prefix Extra Space >> 12 Columns
----------------------------------------------------------------------------------------------------*/

.container_12 .prefix_1 {
	padding-left:80px;
}

.container_12 .prefix_2 {
	padding-left:160px;
}

.container_12 .prefix_3 {
	padding-left:240px;
}

.container_12 .prefix_4 {
	padding-left:320px;
}

.container_12 .prefix_5 {
	padding-left:400px;
}

.container_12 .prefix_6 {
	padding-left:480px;
}

.container_12 .prefix_7 {
	padding-left:560px;
}

.container_12 .prefix_8 {
	padding-left:640px;
}

.container_12 .prefix_9 {
	padding-left:720px;
}

.container_12 .prefix_10 {
	padding-left:800px;
}

.container_12 .prefix_11 {
	padding-left:880px;
}



/* Suffix Extra Space >> 12 Columns
----------------------------------------------------------------------------------------------------*/

.container_12 .suffix_1 {
	padding-right:80px;
}

.container_12 .suffix_2 {
	padding-right:160px;
}

.container_12 .suffix_3 {
	padding-right:240px;
}

.container_12 .suffix_4 {
	padding-right:320px;
}

.container_12 .suffix_5 {
	padding-right:400px;
}

.container_12 .suffix_6 {
	padding-right:480px;
}

.container_12 .suffix_7 {
	padding-right:560px;
}

.container_12 .suffix_8 {
	padding-right:640px;
}

.container_12 .suffix_9 {
	padding-right:720px;
}

.container_12 .suffix_10 {
	padding-right:800px;
}

.container_12 .suffix_11 {
	padding-right:880px;
}



/* Push Space >> 12 Columns
----------------------------------------------------------------------------------------------------*/

.container_12 .push_1 {
	left:80px;
}

.container_12 .push_2 {
	left:160px;
}

.container_12 .push_3 {
	left:240px;
}

.container_12 .push_4 {
	left:320px;
}

.container_12 .push_5 {
	left:400px;
}

.container_12 .push_6 {
	left:480px;
}

.container_12 .push_7 {
	left:560px;
}

.container_12 .push_8 {
	left:640px;
}

.container_12 .push_9 {
	left:720px;
}

.container_12 .push_10 {
	left:800px;
}

.container_12 .push_11 {
	left:880px;
}



/* Pull Space >> 12 Columns
----------------------------------------------------------------------------------------------------*/

.container_12 .pull_1 {
	left:-80px;
}

.container_12 .pull_2 {
	left:-160px;
}

.container_12 .pull_3 {
	left:-240px;
}

.container_12 .pull_4 {
	left:-320px;
}

.container_12 .pull_5 {
	left:-400px;
}

.container_12 .pull_6 {
	left:-480px;
}

.container_12 .pull_7 {
	left:-560px;
}

.container_12 .pull_8 {
	left:-640px;
}

.container_12 .pull_9 {
	left:-720px;
}

.container_12 .pull_10 {
	left:-800px;
}

.container_12 .pull_11 {
	left:-880px;
}




/* Clear Floated Elements
----------------------------------------------------------------------------------------------------*/

/* http://sonspring.com/journal/clearing-floats */

.clear {
	clear: both;
	display: block;
	overflow: hidden;
	visibility: hidden;
	width: 0;
	height: 0;
}

/* http://perishablepress.com/press/2008/02/05/lessons-learned-concerning-the-clearfix-css-hack */

.clearfix:after {
	clear: both;
	content: ' ';
	display: block;
	font-size: 0;
	line-height: 0;
	visibility: hidden;
	width: 0;
	height: 0;
}

.clearfix {
	display: inline-block;
}

* html .clearfix {
	height: 1%;
}

.clearfix {
	display: block;
}


#wrap #footer_outer
{
width:100%;
background:#014133;
margin:0;
/*z-index:-2000;*/
position:relative;
}	
	
#wrap #footer
{
background:#333333;
height:250px;
margin-top:10px;
color:#FFF;
padding-top:10px;
font-size:1.2em;
}

#wrap #footer h2
{
margin:5px 5px 5px 10px;
}

#wrap #footer p
{
margin:5px 5px 5px 10px;
}
    
    #twitter
    {width:220px;
    height:400px;
    background:#282828;
float:left;
    }
#sidebar
{
padding-top:10px;
}