/*
STYLES FOR PROGRAM.PHP
*/



#leftcolumncontainer{float:left;width:455px;padding:20px 0 0 20px;}
#leftcolumn{-moz-border-radius:5px;padding:10px;background: url(http://www.exploratorium.edu/40th/images/scrim.png);}
#player1{text-align:center;margin:0 auto;}
#rightcolumncontainer{float:right;margin:20px 20px 0 0;width:460px;}
.sitename{font-size:24px;}
.title{font-size:20px;}/*Project title, if custom graphic is not used*/
.addinfo{font-size:80%;}/*optional smaller font size*/
.thumb{margin-right:5px;}
#rsslinks{margin:0 auto;text-align:center;width:50%; background-color:#111;-moz-border-radius:10px;padding:.5em;}

#projectinfo{-moz-border-radius:5px;padding:10px;background: url(http://www.exploratorium.edu/40th/images/scrim.png);}
.stream{font-size:80%;} /*download MP3 link*/
#projectinfo p{padding-left:.5em;}
#mp3playerandlink{width:435px;position:relative;}/*set this to the width of the container element so the download link always appears at the far right bottom of the image*/
#mp3link{float:right;}
#mp3player{float:left;}
.clearfloat{clear:both;}
.rule{background-image:url(http://www.exploratorium.edu/40th/images/divider.jpg);height:1px;}
/*
STYLES FOR TABS 
*/
.tabbertab table tbody tr{border-bottom:1px dotted #999;}

.tabberlive .tabbertabhide {
 display:none;
}

/*--------------------------------------------------
  .tabber = before the tabber interface is set up
  .tabberlive = after the tabber interface is set up
  --------------------------------------------------*/
.tabber {
}
.tabberlive {
 margin-top:1em;

}

/*--------------------------------------------------
  ul.tabbernav = the tab navigation list
  li.tabberactive = the active tab
  --------------------------------------------------*/
ul.tabbernav
{
 margin:0;
 padding: 3px 0;
 /*border-bottom: 1px solid #778;*/
 font:14pt Futura, Verdana, sans-serif;
 
 
}

ul.tabbernav li
{
 list-style: none;
 margin: 0;
 display: inline;

}

ul.tabbernav li a
{
 padding: 3px 0.5em;
 margin-right: 3px;
 border:1px solid#222;
-moz-border-radius-topright: 8px;
 -moz-border-radius-topleft: 8px;
/*background-image:url(http://www.exploratorium.edu/40th/images/scrim2.png);*/
 text-decoration: none;
 font-variant:small-caps;
 background-color:#111;

}

ul.tabbernav li a:link { color: #F60; border:1px solid#222;-moz-border-radius-topright: 8px;
 -moz-border-radius-topleft: 8px;background-image:url(http://www.exploratorium.edu/40th/images/scrim2.png);font-variant:small-caps;font-size:18px; }
ul.tabbernav li a:visited { color: #ff6600; border:1px solid#222;-moz-border-radius-topright: 8px;
 -moz-border-radius-topleft: 8px;background-image:url(http://www.exploratorium.edu/40th/images/scrim2.png);font-variant:small-caps;font-size:18px; }

ul.tabbernav li a:hover
{

 border:1px solid#222;-moz-border-radius-topright: 10px;
 -moz-border-radius-topleft: 10px;font-variant:small-caps;font-size:18px;
}

ul.tabbernav li.tabberactive a
{
 color: #FFF;
 background-color:#111;
 /*background-image:url(http://www.exploratorium.edu/40th/images/scrim.png);*/
}

ul.tabbernav li.tabberactive a:hover
{
/* color: #000;*/
 /*background: white;*/
 /*border-bottom: 1px solid white;*/
}

/*--------------------------------------------------
  .tabbertab = the tab content
  Add style only after the tabber interface is set up (.tabberlive)
  --------------------------------------------------*/
.tabberlive .tabbertab {
 padding:5px;
 border:1px solid #222;
 -moz-border-radius-topright: 10px;
 -moz-border-radius-bottomright: 10px;
 -moz-border-radius-bottomleft: 10px;

 background-image:url(http://www.exploratorium.edu/40th/images/scrim.png);


 /* If you don't want the tab size changing whenever a tab is changed
    you can set a fixed height */

 /* height:200px; */

 /* If you set a fix height set overflow to auto and you will get a
    scrollbar when necessary */

 /* overflow:auto; */
}

/* If desired, hide the heading since a heading is provided by the tab */
.tabberlive .tabbertab h2 {
 display:none;
}
.tabberlive .tabbertab h3 {
 display:none;
}

/* Example of using an ID to set different styles for the tabs on the page */
.tabberlive#tab1 {
}
.tabberlive#tab2 {
}
.tabberlive#tab2 .tabbertab {
 height:200px;
 overflow:auto;
}
.tabbertab p{color:#fff;}




/*
GENERAL 40th SITE STYLES
*/

body  {
	font: 11pt Futura, Verdana, Arial, Helvetica, sans-serif;
	font-weight:lighter;
	margin: 0; 
	padding: 0;
	text-align: center;
	color: #FFFFFF;
	background: #000000;
	background-image: url(http://www.exploratorium.edu/40th/images/background-05.jpg)!important;
	background-repeat: no-repeat;
	margin-top: 0px;
}
.bodytext{text-align:center;}
h2{color:#FFF;}

h1{font-size:larger;
	
	}
	
	#footer{background-color:#000;}
#footer td{font-size:90%;}

.twoColFixLtHdr #container { 
	width: 980px; 
	margin: 0 auto; 
	text-align: left; 
	
} 


.twoColFixLtHdr #header h1 {
	margin: 0;
	padding: 10px 0; 
}
.twoColFixLtHdr #sidebar1 {
	float: left; 
	width: 350px; 
	/*background: url(../images/scrim.png);*/
	padding: 1px 20px 1px 20px;
}
.twoColFixLtHdr .shaded {
	
	background: url(http://www.exploratorium.edu/40th/images/scrim.png);
	/*background-color:#000;*/
	
}
 #main{background-image: url(http://www.exploratorium.edu/40th/images/scrim.png);}

.twoColFixLtHdr #mainContent {
	background: url(http://www.exploratorium.edu/40th/images/scrim.png);
	margin: 0 0 0 300px;
	padding: 0 20px;
} 

.twoColFixLtHdr #mainContentpodcasts {
	background: url(http://www.exploratorium.edu/40th/images/scrim.png);
	position:relative;
	/*min-height:900px;*/

} 
.twoColFixLtHdr #mainContentcredits {
	background: url(http://www.exploratorium.edu/40th/images/scrim.png);
	position:relative;
	text-align:left;
	
	padding:1em;

} 


.twoColFixLtHdr #header { 
    position:relative;
	background: url(http://www.exploratorium.edu/40th/images/40th-header.png);
	height: 190px;
	
} 

.twoColFixLtHdr #navbar { 
  position:absolute;
  right:10px;
  top:155px;
	
}
.twoColFixLtHdr #footer { 
	padding: 0 10px 0 20px;
	
} 
.twoColFixLtHdr #footer p {
	margin: 0; 
	padding: 10px 0; 
}
.fltrt { 
	float: right;
	margin-left: 8px;
}
.fltlft { 
	float: left;
	margin-right: 8px;
}
.clearfloat {
	clear:both;
    height:0;
    font-size: 1px;
    line-height: 0px;
}
a:link {
	color: #F60;
	text-decoration: none;
}
a:visited {
	text-decoration: none;
	color: #F60;
}
a:hover {
	text-decoration: underline;
	color: #F60;
}
a:active {
	text-decoration: none;
	color: #FF6A00;
}
.orange {
	color: #FF8000;
}
#mainContentcredits .orange p{color:#000;}

.smwhite {
	color: #FFFFFF;
	font-size: 10px;
}
.twoColFixLtHdr #container #sidebar1 p em strong {
	color: #FF8000;
}
.twoColFixLtHdr #container #sidebar1 div h4 {
	color: #FF8000;
}
.twoColFixLtHdr #container #sidebar1 div h4 {
	color: #963;
}
.twoColFixLtHdr #container #sidebar1 em strong {
	color: #FF8000;
}
.twelve {
	font-family: Futura, Verdana, Arial, sans;
	font-size: 16px;
	font-style: normal;
	line-height: normal;
	font-weight: normal;
	font-variant: normal;
	text-transform: none;
}


.fourteen {
	font-family: Futura, Verdana, Arial, sans;
	font-size: 16px;
	font-style: normal;
	line-height: normal;
	font-weight: bold;
	font-variant: normal;
	text-transform: none;
	color: #FF8000;
}


.orange {background-color:#bd4716;border:1px solid #fff;text-color:#FFF;}


/*STYLES FOR CAKE PAGE*/

#instructions{float:right; width:340;min-height:480px;}
#cake{float:left;width:640px;height:480px;}
#cakeinstructionscontainer{position:relative;}


#commentbox li
{list-style-position: outside;
list-style-image: url(../images/talk.png); }
.rss-date{color:#999;font-size:smaller;}
.rss-date2{color:#999;font-size:smaller;}

.caps{font-variant:small-caps;}