/*  ******************************************  

********  THEME NAME: "Sunset"
********  Description: Simply a picture I took from the beach below Point Bonita over the cliff on the ocean side of Sausalito. Looking to the left you could see the golden gate bridge. As the sun set every evening, we would walk out on the cliff edge or down to the beach.  

********  
********  Author: David VanThournout
********  Author URI: http://www.oneskygate.net/
********  
********  The CSS, XHTML and design unless otherwize stated is released under Creative Commons              license  Attribution 3.0  United States:http://creativecommons.org/licenses/by/3.0/us/
********  
********  You can tweak this css all you like. It would be great if you would publish under a    

           creative commons license.

********  There are probably more handles in the xhtml than I need. But that's better            

          than not having enough!
***********************************************

*/


html {   
	padding:0px;  
	margin:0px;
	}

body {	
	background: url('images/oneskyback26.jpg') no-repeat top center fixed;
	background-attachment: fixed;
	background-color: #000000;
	font-family: Verdana, Arial, Sans-Serif, Courier New;
  	font-size: 72.5%;   
	color:#000000;    
	text-align:left;	
	margin:0;	
	padding:0;
}

#skip a, #skip a:hover, #skip a:visited 
{ 
	position:absolute; 
	left:0px; 
	top:-500px; 
	width:1px; 
	height:1px; 
	overflow:hidden;
} 

#skip a:active 
{ 
	position:static; 
	width:auto; 
	height:auto; 
}

p {
	color: #9C9C9C;
	margin:0.5em 1.0em 1.0em 1.0em;
		}

p.c1 { 	
	font-size: 0.9em;       
	color:#9C9C9C; 	
	padding-right: 2.0em;	
	text-align: right;}

p.c2 { 		
	font-size: 1.1em;        
	color:#9C9C9C; 	
	margin-left: 0.5em;        
	text-align: right;	
	}

p.c5 { 
	font-size: 1.1em;
    color:#9C9C9C;
	padding-right: 0px;
	text-align: right;
	}

p.right { 
	font-size: 1.1em;
    color:#9C9C9C; 
	text-align: left;
	}
	
	/*  *************   p.c3, p.c4, .comment and p.note are all for either commenting in nice boxes
or for coding examples  *************  */ 

p.c3 {
	font-family: Courier New, Courier, Monospace;
	color: red;
	font-size: 1.3em;
	margin: 0em 2.5em 0em 0em;
	display: block;
	
}

p.c4 {
	font-family: Courier New, Courier, Monospace;
	color: red;
	font-size: 1.3em;
	margin: 0em 0em 0em 3em;
	display: block;
}

.comment {
	width:32em;
	height: auto;
	margin: 1em 0em 1em 1.5em;
	padding: 0.5em 0.5em 0.5em 0.5em;
	background-color: #F5F0DD;
	border: 1px solid #000000;
}

p.note {
	font-family: Courier New, Courier, Monospace;
	font-size: 1.1em;
	background-color: #F5F0DD;
	line-height: 1em;
	margin: 1em 0em 1em 1em;
}

em {
	color: green;
	font-size: 1.1em;
	padding-right: 0.4em;
	line-height: 1em;
}

em.code  {
	color: black;
	font-size: 1.0em;
	line-height: 1em;
}

span.blk {
	font-family: Courier New, Courier, Monospace;
	color: black;
	font-size: 1.0em;
	margin-left: 0.5em;
	
}

/*  *********** end of comment styling  **********  */

h1 {
	font-size:1.25em;
	color: #9C9C9C;
	text-align: right;
	margin: 0em 6.0em 0em 0em;
	text-align: left;

	}

h2 {
	font-size:1.1em;
	padding-left:5px;
	padding-top:5px;
	color: #9C9C9C;
	background-color: transparent;	
		}

h3 {

	font-size:0.9em;
	padding: 0.2em 0.2em 0.2em 0.2em;
	margin: 1.0em 0.5em 1.0em 3.0em;
	text-transform:none;
	color: #9C9C9C;
	background-color: #650505;
	text-align: right;
}

h4 {
	font-size:0.8em;
	padding-top:10px;
	padding-left:10px;
	color: #9C9C9C;
	background-color: transparent;	}

h5 {
	font-size:0.8em;
	color: #9C9C9C;
	}




a.c1:visited { 	
	text-decoration: none; 	
	color: #E3560E;	}

a.c1:hover, a.c1:active { 	
	text-decoration: none; 	
	color: #F5E701;
	}

a.c1:hover, a.c1:active { 	
	text-decoration: none; 	
	color: #000000;
	background: url('images/greenbuttonback.jpg') repeat-x top center;
	}

a.c2 { 
	color: #E3560E;
	font-size: .6em;
	background-color:transparent;
	text-decoration: none; }

a.c2:visited { 	
	text-decoration: none; 	
	color: #E3560E;	}

a.c2:hover, a.c2:active { 	
	text-decoration: none; 	
	color: #000000;
	background: url('images/greenbuttonback.jpg') repeat-x top center;
	}

a.c3 { 
	color: #E3560E;
	font-size: .7em;
	background-color:transparent;
	text-decoration: none; }

a.c3:visited { 	
	text-decoration: none; 	
	color: #E3560E;	
		}

a.c3:hover, a.c3:active { 	
	text-decoration: none; 	
	color: #000000;
	background: url('images/greenbuttonback.jpg') repeat-x top center;
	} 

pre { 
	font-size: 11px;
	background-color:transparent;
	font-family: Courier, Monaco, Monospace;
	}


a.right { 
	color: #E3560E;
	font-size: 1.1em;
	padding: 0px 0px 0px 0px;
	background-color:transparent;
	text-decoration: none;

}
a.right:visited { 
	text-decoration: none; 
	color: #E3560E;

	}
a.right:hover, a.right:active { 
	background: url('images/sunsetbutton.jpg') repeat-x top center;
	text-decoration: underline;
	color: #000000;
	background-color: #F4F2DA;
	}

a.b2 { 
	color: #000000;
	font-size: 1.0em;
        font-family: Courier new;
	padding: 0em 0em 0em 3.0em;
	text-decoration: none; 
	display: block;
	width: 10em;
	border: 1px solid #000000;
	background-color: white;

}
a.b2:visited { 
	text-decoration: none; 
	color: #000000;
	}
	
a.b2:hover, a.b2:active { 
	background-color:#000000;
	text-decoration: none;
	color: #FFFFFF;
	border: 1px solid #000000;
	}


span {
	font-size: 1.0em;
}

span.right{
	font-size: 1.0em;
	padding-right: 0em;

}


#navigation, #navigation ul { /* all lists */
		padding: 0;
		margin: 0;
		list-style: none;
		float : left;
		width : 11em;
	}
	
	#navigation li { /* all list items */
		position : relative;
		float : left;
		line-height : 1.45em;
		margin-bottom : -1px;
		width: 11em;
	}
	
	#navigation li ul { /* second-level lists */
		position : absolute;
		left: -999em;
		margin-left : 11.05em;
		margin-top : -1.35em;
	}
	
	#navigation li ul ul { /* third-and-above-level lists */
		left: -999em;
	}
	
	#navigation li a {
		width: 11em;
		w\idth : 10em;
		display : block;
		color : black;
		font-weight : bold;
		text-decoration : none;
		background-color : #FBFCB0;
		border : 1px solid #742401;
		padding : 0 0.5em;
	}
	
	#navigation li a:hover {
		color : white;
		background-color : #742401;
	}
	
	#navigation li:hover ul ul, #navigation li:hover ul ul ul, #navigation li.sfhover ul ul, #navigation li.sfhover ul ul ul {
		left: -999em;
	}
	
	#navigation li:hover ul, #navigation li li:hover ul, #navigation li li li:hover ul, #navigation li.sfhover ul, #navigation li li.sfhover ul, #navigation li li li.sfhover ul { /* lists nested under hovered list items */
		left: auto;
	}
	
	

#navigation li:hover, #navigation li.hover {
    position: static;
}

#box {

	width:67.0em;
	height: auto;
	margin: 0px auto;
	padding-left:0px;
	padding-top:0px;
	text-align:left;
	background-color:transparent;

}

#header {
	width:68.0em;
	height: 0px;
	margin-right: 0px;
	padding-top: 0px;
	padding-right:0px;
	float:left;
	background-color:transparent;

}

#header h1 {
	font-size: 1.1em;
	text-transform:uppercase;
	text-align: right;
	color: #564b47;
	background-color:transparent;
	padding:0.3em 0em;
	margin:0em;
	}

#subheader {
	width:68em;
	height: 23px;
	padding-left:0px;
	float:left;

}

.printhead  {
	width: 29.5em;
	display: none;

}

#menu {
	position: fixed;
	margin-top: 0em;
	top: 5%;
	width: 12em;
	left: 1em;
	background-color:transparent;

}

#content {
	width: 38.5em;
	height: auto;
	margin: 0em 0em 5.0em 2.0em;
	padding-top: 0.6em;
	padding-bottom: 3.0em;
	padding-left: 0em;
	float:right;
	background-color:transparent;


}

#content ul {
	margin: 0px;
	padding: 0px;
	margin-top: 40px;
	margin-left: 100px;
	}
#content li {
	background: url('images/sunli.jpg') no-repeat top right;
	line-height: 1.0em; 
	list-style-type: none;
	display: block; 
	padding-top: 0px;
	padding-left: 0px; 
	padding-bottom: 0px;
	margin-left: 0px;
	
	}



#logo {
	background: url('images/sunsetlogo.jpg') no-repeat top right;
	width:300px;
	height: 90px;
	padding-left:96px;
	padding-bottom:30px;

}

#footer {
	width:40.0em;
	height: 9.0em;
	margin-right: 1em;
	margin-top: 6.0em;
	float: right;
	background-color:transparent;

}

/* ********** Image and form handling ***********  */

.searchbox {
	width: 40em;
	margin: 2.0em -30em 2.0em 1.0em;

}

#searchresults {
	width: 48em;
	height: auto;
	margin: 0em -30em 0em 0em;

}

.musicplayer  {
	width: 26.5em;
	padding: 0.4em 0em 0em 0em;
	float: left;

}

.formfloat  {
	float: left;
	width: 8.0em;
	margin-left: 4.0em;
	padding-top: 3.0em;

}

.floatstudio {
	float: right;
	width: 12.0em;
	padding-right: 5.0em;
	padding-top: 3.0em;
	margin-right: 3em;
}

.floatmusic {

	clear: left;
	width: 12.0em;
	padding-right: 0em;
	padding-top: 0.4em;
	display: none;

}

.floatnav
{
	float: left;
	width: 10.0em;
	padding-right: 0em;
	padding-top: 3.0em;
}

.floatfooter
{
	float: right;
	width: 85px;
	padding-left: 5px;
}

.floatright
{
	float: right;
	width: 365px;
	padding-left: 5px;
}

.floatleft
{
	float: right;
	width: 365px;
	margin-left: 5px;
}


.floatindex
{
	float:left;
	width:270px;
	padding-left:30px;
}



#formbox {
	background-color:transparent;
	width:310px;
	height: 250px;
	margin-right: 20px;
	margin-bottom: 60px;
	padding-top: 0px;
	padding-right: 0px;
	float:left;



}

/* **************** the extra div contains comments specific to each style sheet each only visible when that particular style sheet is loaded  *******************   */

#extradiv1  {
	position:absolute;
	left:510px;
	top:2px;
	width: 30em;
	}

#zskin {
	width: 10em;
	display: none;
}

#yskin {
	width: 10em;
	display: none;
}

#xskin {
	width: 20em;
	display: none;
}

#wskin {
	width: 20em;
	display: none;
}

#vskin {
	width: 10em;
	display: none;
}

#uskin {
	width: 20em;
	display: none;
}

#tskin {
	width: 40em;


}

#sskin {
	width: 10em;
	display: none;
}

#water {
	width: 10em;
	display: none;
}

#space {
	width: 10em;
	display: none;
}

#printing {
	width: 10em;
	display: none;
}