body {
	text-align : center;
	background-color : #A9ACB6;
 	margin-top : 0; 
	color : #000;
}

/*	Google searchbox width */

.searchBox form {
	width: 204px;
	background-color: #827c58 !important; 
	margin: -18px -12px !important;
	padding: 8px  !important;
	vertical-align: center;

}

.gsc-search-box form {
	margin: 0px  !important;
	padding: 2px  !important;
	background: #fff !important;
	border-radius: 5px;
	-webkit-border-radius: 5px;
} 

/* Sortable tables */
table.sortable thead {
    cursor: grab;
}

.w310 {
	width: 310px;
}

h2.home {
	background-color: #eeeeee;
	margin-top: 15px;
	padding-top: 0px;
	padding-left: 5px;
	width: 400px;
	background-image : url(curve_bottom_right.png);
	background-repeat : no-repeat;
	background-position : left bottom;
}	

a {
	text-decoration : none;
	font-weight : bold;
	color : #827c58;
}

h3 a {
	color: #666;
}
	  
a:hover {
	text-decoration : underline;
	font-weight : bold;
	color : #fff;
	background-color : #827c58;
}
	  
a.credits:link {
	text-decoration : none;
	color : #fff;
	font-weight : normal;
	background : #000;
}

a.credits:active {
	text-decoration : none;
	color : #fff;
	font-weight : normal;
	background : #000;
}

a.credits:hover {
	text-decoration : underline;
	color : #fff;
	font-weight : normal;
	background : #000;
}

a.credits:visited {
	text-decoration : none;
	color : #fff;
	font-weight : normal;
	background : #000;
}

 #frame {
	width : 940px;
	margin-right : auto;
	margin-left : auto;
	margin-top : 10px;
	padding : 0;
	text-align : left;
	background : #fff;
	border : 1px solid #000000;	
	font-family : Verdana, Helvetica, Arial, sans-serif;
	font-size : 0.7em;
	line-height : 1.4em;
	font-weight : normal;
	color : #666;
}

#topnavheader {
	float: right;
	background: white !important;
}

#contentleft {
	width : 200px;
	padding : 0;
	float : left;
	color : #666;
	background : #eee;
	height : 621px;
	border-bottom-right-radius: 15px;
	margin-bottom: 20px;
}

#contentleft img {
	float : left;
	margin-right : 0px;
	margin-bottom: 10px;
	margin-top: 4px;
	padding: 0px;
	border-radius: 0px 15px 15px 0px;
	-webkit-border-radius: 0px 15px 15px 0px;
}	

#contentcenter, #contentsheetmusic {
	width : 520px;
	padding : 0;
	margin-bottom: 20px;
	float : left;
	min-height : 620px;
	color : #666;
	background : #fff;
}

#contentpics {
	width : 520px;
	padding : 0;
	margin-bottom: 20px;
	float : left;
	min-height : 550px;
	color : #666;
	background : #fff;
}

	  
#contentpics img {
	float : left;
	margin-left : 10px;
	margin-right : 0px;
	border : 1px solid #dcdcdc;
	padding: 2px;
}	   

#contentsheetmusic img {
	float : left;
	margin-left : 10px;
	margin-right : 0px;
	padding: 0px;
}	   


#contenttabs {
	width : 740px;
	padding : 0;
	float : left;
	min-height : 550px;
	color : #666;
	background : #fff;
}

#upperleftsmallnav {
	float : right;
	width : 200px;
	padding : 10px;
	color : #666;
	background : #eee;
	border-bottom-left-radius: 15px;
}

#metanav {
	background-image : url(curve_top_right.png);
	background-repeat : no-repeat;
	background-position : left top;
	background-color: blue !important;
}

#upperleftsmallnav a {
	background-color : #eee;
	color : #827c58;
}

#contentcenter h3, #contentcenter p {
	margin : 0 10px 10px;
	width: 340px;
}

#contentpics h3 {
	margin : 0 10px 10px;
}

#contentcenter img {
	float : right;
	margin-left : 10px;
	margin-right : 10px;
	margin-bottom: 2px;
	border : 1px solid #999;
	padding: 2px;
}

#contentcenter table {
margin : 0 10px 10px;
}

td h3 {
	width: 140px !important;
}

/* right column */

#contentright {
	width : 200px;
	padding-left: 10px;
	padding-right: 10px;	
	padding-bottom: 10px;	
	padding-top: 4px;
	float : left;
	background : #eee;
	color: #666;
	margin-bottom: 5px;
	border-bottom-left-radius: 15px;
}

#contentrightnew {
	width : 220px;
	padding : 0px;
	float : left;
	background : #eee;
	color: #666;
	margin-bottom: 5px;
	border-bottom-left-radius: 15px;
}

#contentright a {
	background-color : #eee;
	color : #827c58;
}

#contentright a.selected {
	background-color : #eee;
	color : #000;
}

#contentright a.selectedsmall {
	background-color : #eee;
	color : #000;
	font-size: 9px;
}

#contentrighttabs {
	width : 90px;
	padding : 10px;
	float : left;
	color: #666;
	background : #eee;
	border-bottom-left-radius: 15px;
}

#contentright img {
	border : 1px solid #dcdcdc;
}

#contentheader {
	background : #666;
	color: #fff;
	padding : 0;
	background-image : url(backcale.gif);
}

#contentfooter {
	color : #999;
	margin : 0px;
	border-top: 2px solid #8e845f;
	background: #000;
	border-bottom: 2px solid #8e845f;
	text-align: center;
}	

#contentfooter p {
	padding-top: 5px;
	margin-bottom: 5px;
}

p, h1, h2, h4, h5, pre {
	margin : 0 10px 10px;
}

/* headings formatting */

h1, h2, h4, h5 {
font-family: 'Open Sans', sans-serif;
}

h1 {
	font-size : 1.4em;
	padding-top : 14px;
	font-weight: 700;
}

h2 {
	font-size : 1.2em;
	padding-top : 10px;
	width: 340px;
}

h3 {
	font-size : 1em;
	padding-top : 2px;
	margin-bottom : 0;
}

h4 {
	font-size : 1.0em;
	padding-top : 2px;
	margin-bottom : 0px;
}

h5 {
	font-size : 1.0em;
	padding-top : 2px;
	font-style: italic;
	font-weight: 400;
}

pre {
	font-size : 1.3em;
	color : #000;
	background-color : #eeeeee;
	padding: 5px;
	border: 1px solid #999;
	margin-top: 10px;
}

/* blockquote formatting */

blockquote {
 	background-color: #eee;
	padding-left: 50px;
	color: #666;
	border: #dcdcdc 1px solid;
	padding: 3px;
	margin-left: 20px;
	margin-right: 0px;
	width: 310px !important;
	border-radius: 5px 0px;
	-webkit-border-radius: 5px;
	
}		
	
blockquote a {
	color: #827c58 !important;
	background-color: #eee;
}

blockquote a:hover {
	color: black;
	background-color: #eee;
}

.right {
	text-align: right;
}

/* form stuff */ 


#contentright form {
	background: #827c58 !important;
	color: #fff;
	border: 1px solid #fff; 
	padding-bottom: 7px;
	border-radius: 5px;
	background: #fff;
}

#contenttabs form {
	background: #827c58;
	color: #fff;
	border: 1px solid #fff;
	padding-bottom: 7px;
}

#contentright form a {
	background: transparent;
	color: #fff;
	font-weight: normal;
}

#contenttabs form a {
	background: transparent;
	color: #fff;
	font-weight: normal;
}

#contentright form a:hover {
	background: #fff;
	color: #827c58;
	font-weight: normal;
}

#contenttabs form a:hover {
	background: #fff;
	color: #827c58;;
	font-weight: normal;
}

/* contact jotform formatting */

.form-sub-label {
	font-family; Verdana, Helvetica, Arial, sans-serif;
}

/* form formatting */

form {
	border-radius: 5px;
	-webkit-border-radius: 5px;
}

table#form {
	background-color: #dcdcdc;
	border: 1px solid #666;
	padding: 5px;
	border-radius: 5px;
}

#form td {
	padding: 3px;
}

label {
	 cursor: pointer; 
}
 
.rightform {
	text-align: right;
	width: 80px;
	font-weight: bold;
}

select {
	font-size : 1em;
}

input, textarea {
	border-radius: 3px;
	-webkit-border-radius: 3px;		
}

.input {
	font-family : "Courier New", Courier, monospace;
	font-weight : normal;
	font-size : 1.1em;
	line-height : 1.2em;
	border : 1px solid #827c58;
	padding: 2px;
	border-radius: 5px;
	-webkit-border-radius: 5px;			
}

.input:focus {
	font-family : "Courier New", Courier, monospace;
	font-weight : normal;
	font-size : 1.1em;
	line-height : 1.2em;
	border : 1px solid #666;
	padding: 2px;
	background-color: #eeeeee;
}

.inputsearch {
	font-family : "Courier New", Courier, monospace;
	font-weight : normal;
	font-size : 1.1em;
	line-height : 1.2em;
	border : 1px solid #eeeeee;
	padding: 2px;
	color: #999; 
	background-image: url(search-fade.png);
	background-position: top left;
	background-repeat: repeat-x;
}

.inputsearch:focus {
	font-family : "Courier New", Courier, monospace;
	font-weight : normal;
	font-size : 1.1em;
	line-height : 1.2em;
	border : 1px solid #eeeeee;
	padding: 2px;
	color: #000;
}

select:focus {
	background-color: #eeeeee;
}

input.send {
	color : #beb996;
	font-weight : bold;
	background : #000;
	border : 1px solid #827c58;
	text-align : center;
	font-size : 0.9em;
	line-height : 1.2em;
	padding: 2px;
	width : 66px;
}

input.sendsearch {
	color : #f4f4f4;
	font-weight : bold;
	background : #fff;
	border : 1px solid #eeeeee;
	text-align : center;
	font-size : 0.9em;
	line-height : 1.2em;
	padding: 2px;
	width : 66px;
	margin-left: 1px;
	border-radius: 5px;
	-webkit-border-radius: 5px;			
}

/* list stuff */

ul {
	margin-left: 1em;
	padding: 4px;
}

#contentcenter ul li {
	padding: 0px 0px 0px 12px;
	background: url(list.gif) no-repeat;
	list-style-type: none;
} 

#contentcenter li li {
	padding: 0px 0px 0px 12px;
	background: url(list.gif) no-repeat;
	list-style-type: none;
	margin-left: 0px;
} 

#contentpics ul li {
	padding: 0px 0px 2px 12px;
	background: url(list.gif) no-repeat;
	list-style-type: none;
}

#contenttabs ul li {
	padding: 0px 0px 2px 12px;
	background: url(list.gif) no-repeat;
	list-style-type: none;
} 

/* for the subnav stuff */


.subnav {
	margin-top : 20px;
	border-top : 1px solid #eee;
	padding-top : 2px;
	border-bottom : 1px solid #eee;
	padding-bottom : 2px;
	margin-left: 10px;
	margin-right: 10px;	
	margin-bottom: 0px;
}

.subnav2 {
	border-top : 1px solid #eee;
	padding-top : 2px;
	margin-top: 2px;
}

.subnavtop {
	border-bottom : 1px solid #eee;
	padding-bottom : 2px;
	margin-bottom: 2px;
}


.subnav strong {
	color : #000;
	background-color : #fff;
}

.selected {
	font-weight : bold;
	color : #000;
}

a.selectedname {
	font-weight : bold;
	color : #666;
}

a.selectedname:hover {
	font-weight : bold;
	color : #666;
	background-color : #fff;
	text-decoration: none;	
}


a.selected:link {
	color : #000;
	text-decoration : none;
	background-color : #fff;
	font-size : 11px;
}
a.selected:active {
	color : #f4f4f4;
	text-decoration : none;
	background-color : #fff;
	font-weight : bold;
	font-size : 11px;
}

a.selected:hover {
	text-decoration : underline;
	border-width : 2px;
	color : #fff;
	background-color : #827c58;
	font-size : 11px;
}
a.selected:visited {
	color : #000;
	background-color : #fff;
	text-decoration : none;
	font-weight : bold;
	font-size : 11px;
}

/* for the interviews section */

.question {
	font-style: italic;
}

.greyblockright {
	float: right;
	border: 1px solid #8e845f;
	padding: 5px;
	margin-right: 10px;
	margin-left: 10px;
	background: #beb996;
	color: #00000e;
	width: 110px;
	line-height : 1.4em;
	display: inline;	
}

.setlist {
	float: right;
	padding: 3px 5px 3px 5px;
	margin-right: 10px;
	margin-left: 10px;
	background: #beb996;
	color: #00000e;
	width: 134px;
	line-height : 1.4em;
	display: inline;	
	font-size: 0.9em;
}

.greyblockright a {
	background: #beb996; 
	color: #000;
}


/* submenu stuff */


.submenu {
	float: right;
	margin-right : 10px;
	padding: 3px 5px 3px 5px;
	background: #beb996;
	color: #00000e;
	line-height : 1.4em;
	width: 136px;
	border: 1px solid #dcdcdc;
	border-radius: 5px;
}


.submenu h3 {
	margin: 0px 0px 5px !important;
	padding: 0px 3px;
	width: 130px !important; 
	border: 1px solid #dcdcdc;
	border-radius: 5px;
	-webkit-border-radius: 5px;	
	background: #666;	
	color: #f4f4f4;
}

.submenu img {
	float: left !important;
	border: 0px !important;
	padding: 0px  !important;
	margin: 0px !important;
}

.submenu h4 {
	margin-left: 0px;
	width: 80px;
}

.submenu ul {
	list-style: none;
	margin: 10px 0 0 0;
	padding: 0;
	list-style: none;
	width: 113px !important; /* you need the important thingy for IE */
}

.threecolumns ul {
	list-style: none;
	margin: 0;
	padding-left: 0px;
	width: 155px !important; /* you need the important thingy for IE */
}

.submenu li {
	display: block;
	padding: 0px;
	background: #beb996 !important;
	color: #00000e;
	line-height : 1.4em;
	background: url(list.gif) no-repeat !important;	
	width: 113px;	
}

.submenu li a:hover {
	background: #beb996; 
	color: #fff !important;
	background: url(list.gif) no-repeat;	
}

.submenu li a:visited {
	background: #beb996; 
	color: #00000e !important;
}

.submenu a {
	background: #beb996 !important;
	color: #00000e !important;
}

.submenu a:hover {
	background: #beb996 !important;
	color: #fff !important;
}

/* table stuff */

tr {
	vertical-align: top;
}

th {
	background-color: #eeeeee;
	padding-left: 2px;
	color: #666;
}

/* homepage only */

#contentcenter .line  {
padding-bottom : 2px;
border-bottom : 1px solid #eee;
width: 400px;
}

#contentcenter .intro  {
width: 400px;
}

contentcenter p {
width : 340px;
}

#contentcenterhome {
width : 360px;
}

#contentcenterhome p {
width : 360px;
}

#contenttabs p {
width : 340px;
}

#contentcenter ul {
width : 300px;
}


#contentcenter blockquote {
width : 290px;
}

#contentcenter table p {
width : 210px;
}

#contentcenter table ul {
width : 190px;
}

blockquote a:link {
background: #eeeeee;
}

blockquote a:visited {
background: #eeeeee;
}

.byline {
font-size: smaller;
}

.picleftmargin {
	margin-right: 10px !important;
}

/* twitter */ 

#wanted, .rightcolumnbox  {
	background: white;
	padding: 2px;
	border: 1px solid #dcdcdc;
	border-radius: 5px;
}

.rightcolumntext {
	padding-top: 4px;
	padding-left: 4px;
	padding-right: 4px;
}

.rightcolumnthanks {
	padding-top: 4px;
	padding-left: 4px;
	padding-right: 4px;
	font-size: smaller;
}		
	
#wanted  h3, .rightcolumnbox  h3 {
	margin-top: 0px;
	padding-top: 0px;
	padding-left: 5px;
	margin-bottom: 0px;
	margin-left: 2px;
	margin-right: 2px;	
/* 	background: #827c58; */
	background: #666;
	color: #f4f4f4;
	border-radius: 2px;
	-webkit-border-radius: 2px;	
}


#wanted a, .rightcolumnbox a {
	background: transparent !important;
}

#wanted ul, .rightcolumnbox ul {
	margin-top: 0px;
	margin-bottom: 0px;
	margin-left: 0px;
}


#wanted li, .rightcolumnbox li {
	padding: 0px 0px 0px 12px;
	background: url(list.gif) no-repeat;
	list-style-type: none;
	margin-top: 0px;
} 

blockquote ul {
	margin-top: 0px;
	margin-bottom: 0px;
	margin-left: 0px;
}

blockquote li {
	padding: 0px 0px 0px 12px;
	background: url(list.gif) no-repeat;
	list-style-type: none;
	margin-top: 0px;
} 

/*lightbox stuff goes here */

#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(https://werksman.home.xs4all.nl/cale/css/prevlabel.gif) left 15% no-repeat;
}
#nextLink:hover, #nextLink:visited:hover { background: url(https://werksman.home.xs4all.nl/cale/css/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: #c0c0c0;}

