/*
 * Author: Janson Lytle
 * Date: August 22 2007
 * Version: 1
 
 * Color Pallet STARLIGHT
 * #EFE6A1 - Light brown/yellow
 * #EEE5A4 - Light brown/yellow (broadway under the stars)
 * #DACD73 - Med brown/yellow
 * #CC6600 - Dark Brown used in headings
 * #330066 - Dark Purple (text)
 * #44115A - Med Purple banner
 * #000000 - Black
 * #FFFFFF - White 
 */

/*****************************/
/* SECTION 1                 */
/* General layout start here */
/*****************************/
* {margin: 0px; padding: 0px;}

/******************************************/
/* Specifies the Minimun Width and Max Widths for a Page */
/* IE uses the expression, which is any javascript you want */
/* Firefox ect, will ignore the expresssion */
/******************************************/

/* for all browsers min-width */
.width {
 width:100%; 
 min-width:800px;
 max-width:1024px;
 width:expression(document.body.clientWidth > 1024? "1024px": "auto" );
}

/* for IE browsers */
.minwidth {border-left:800px solid #EFE6A1; position:relative; float:left; z-index:1;}
.container {margin-left:-800px; position:relative; float:left; z-index:2;}

/* IE doesn't understand CSS Selectors, following negates previous two
   lines of code for NON-IE  */
div[class="minwidth"] { border-left:0; position:static; float:none; }
div[class="container"] { margin-left:0; position:static; float:none; }
/******************************************/
/* End the Minimun Page Width    */

/* Start Min-Height Page Width    */
/******************************************/
/* Specifies the Minimun Height for a Page 
   Also sets up the three column colors 
   Main1 background is the color of the center column
   Main1 background url is the color of the left column (a faux column)
   Main2 background url is the color of the Right Column (a faux column)
   The following ensures that the all columns appear the same length and grow together
*/
/******************************************/
.main1 {
 margin:0; padding:0;

 background:#EFE6A1 url("../images/leftColumn.gif") top left repeat-y;
  background:#E3d890 url("../images/bg.gif") top left repeat;
 min-height:610px;
 height:610px;
 position:relative;
 border-top:solid 1px #44115A;
  
}

div[class="main1"] { height:auto; }
/******************************************/
/* End Minimun Height for a Page */

  
#left {
 position:absolute;
 top:0;
 left:0;
 width:180px;
 margin:0;
 padding:0;
  background:#E3d890 url("../images/leftColumn.gif") top left repeat;
 
}

#middle 
{
   
     margin:0 0 0 180px;

}
.cleaner {
 clear:both;
 height:1px;
 font-size:1px;
 border:none;
 margin:0; padding:0;
 background:transparent;
}
#footer {
 text-align:center;
 background-color: #44115A;
 
   color:#FFF;
  padding: 3px 0;
  font-size: 12px;
}
#banner {
 height: 127px;
 width: 100%;
 background: #000 url("../images/starlightbanner2.gif") repeat-x;
 background-position: 350px 0 ;
 text-align:left;
 color: #000;
 position: relative;

}
#banner img 
{
    display: block;
}
#sponsors
{
   position:absolute;
   top:15px;
   right:15px;   
}
#sponsors img
{
   display:inline;   
}


#broadwayMusicals
{
   position:absolute;
   top:40px;
   left: 270px;

   width: 400px;
   color: #F0E49A;
   font-size: 16px;
   font-weight: bold;
   text-transform: uppercase;
   text-align: center;
   font-family: Arial;
   letter-spacing: 3px;
   word-spacing: 3px;
   line-height: 1;
}
#broadwayMusicals .firstLetter 
{
   font-size: 22px;
}
#broadwayMusicals .smallLetters 
{
   font-size: 11px;
}

#topNav 
{

 width: 100%;
 height: 20px;
 margin: 0px;
 padding: 5px 0;
 
 background: #44115A url("../images/topNavbg.gif") repeat-x;

}