/* main styles */

body{
	margin:0 0 20px 0;
	padding:0 0 20px 0;
	background:#000;
	font-family: arial,verdana,sans-serif;
	font-size:62.5%;
	line-height:1.6em;
	color:#333;
}


a{
	text-decoration:none;
	color:#5a5a01;
}
a:hover,
a:focus,
a:active{
	text-decoration:underline;
	color:#000;
}
a.mail{
	color:#990;
}
img, div {
	border:0;
	margin:0;
	padding:0;
}
h2{
	font-size:1.7em;
	line-height:1.6em;
	color:#5a5a01;
	padding:14px 24px 0 24px;
	margin:0;
}
h3{
	font-size:1.3em;
	color:#333;
	padding:0 24px 0 24px;
	margin:0;
}
p{
	font-size:1.2em;
	padding:0 24px 10px 24px;
	margin:0;
}
dl{
	padding:0 0 10px 24px;
	margin:0;
	font-size:1.2em;
}
dt{
	float:left;
	width:160px;
}

/* =====  =id ==== */
#Wrapperhome{
	position:relative;
	width:734px;
	height:453px;
	margin:5% auto 0 auto;
}
#Wrapperhome #Lang{
	position:absolute;
	right:13px;
	bottom:16px;
	width:85px;
	text-align:right;
}
#Wrapperhome #Lang a{
	font-family:georgia, serif;
	text-transform:uppercase;
	font-size:1.1em;
	color:#c5c287;
	padding:0 9px 0 0;
}
#Wrapperhome #Lang a:hover,
#Wrapperhome #Lang a:focus{
	text-decoration:underline;
}
#Pagewrapper{
	width:860px;
	margin:0 auto;
	padding:0;
}
#Page{
	width:780px;
	margin:0;
	padding:0 40px;
}
#Header{
	width:780px;
	background:#000;
	height:160px;
	position:relative;
}
.home{
	height:300px;
	overflow:hidden;
}

#Nav{
	float:left;
	width:610px;
	padding:0;
	background:url(../images/bg_nav.jpg) repeat-x bottom;
	position:relative;
}
.photo #Nav{
	width:100%;
}
#Content{
	clear:both;
	float:left;
	width:780px;
	color:#333;
	padding-top:16px;
	padding-bottom:40px;
	margin-bottom:30px;
	background:#fff;
	overflow:hidden;
}
body.bio #Content,
body.repertoire #Content,
body.press #Content,
body.agenda #Content,
body.contact #Content,
body.links #Content{	
	background:#fff;
}
body.photo #Content{
	background:#333;
}
body.bio #Content{
	padding-top:60px;
}
#Footer{
	clear:both;
	height:2em;
	background:#000;
}
body.bio #Footer,
body.repertoire #Footer,
body.press #Footer,
body.agenda #Footer,
body.contact #Footer,
body.links #Footer{	
	background:#000;
}


/* ========== styles per id ================= */
/* ----- =Header ------ */

#Header #Mainfoto{
	position:absolute;
	right:-10px;
	top:0;
	width:180px;
	height:240px;
	overflow:hidden;
	text-align:right;
}
#Header #Logo{
	padding:40px 0 0 0;
	left:-40px;
	position:relative;
}
#Header #Logo h2{
	padding:0;
	margin:0;
}

/* ---- nav list ------ */

#Nav ul{
	margin:0;
	padding:0;
	list-style:none;
}
#Nav ul li{
	float:left;
	padding:0;
	margin:0;
}
#Nav ul li a{
	color:#c5c287;
	font-size:1.3em;
	font-weight:bold;
	display:block;
	text-transform:lowercase;
	padding:0.6em 10px;
}
#Nav ul li img{
	vertical-align:top;
	padding:2px 0 0 0;
}
#Nav ul li a.first{
	padding-left:1.4em;
}

#Nav ul li a:hover,
#Nav ul li a:focus,
#Nav ul li a:active{
	color:#c5c287;
	text-decoration:none;
	background:url(../images/arrow_cur.gif) no-repeat center bottom;
}
#Nav li.lang{
	position:absolute;
	text-align:right;
	padding:0 10px 0 0;
	right:-180px;
	width:180px;
	top:80px;
	z-index:10;
}
.photo #Nav li.lang{
	width:auto;
	right:0;
	top:0;
}
#Nav li.lang a:hover,
#Nav li.lang a:focus,
#Nav li.lang a:active{
	background:none;
	text-decoration:underline;
	background:none;
	color:#333;
}
/* ------------------- #Nav active states ---------------------- */
body.bio #Bio,
body.repertoire #Repertoire,
body.press #Press,
body.agenda #Agenda,
body.photo #Photo,
body.media #Media,
body.contact #Contact,
body.links #Links,
body.ensembles #Ensembles{
	background:url(../images/arrow_cur.gif) no-repeat center bottom;
}

#Nav a#Home:hover{
	background:none;
}



#Taal{
	float:right;
	padding:0.6em 0;
}
#Taal a{
	color:#fff;
	font-size:0.9em;
}
#Taal a:hover{
	text-decoration:underline;
}



/* content */

.proloog{
	height:120px;
	font-style:italic;
	font-size:1em;
	color:#ccc;
	padding:60px 200px 0 0;
	background:#000;
	text-align:center;
}

.rightbox{
	float:right;
	margin:44px 18px 0 0;
	padding:0 0 0 24px;
	width:80px;
	background:url(../images/logo_pdf.gif) no-repeat left top;
}
.rightbox a{
	font-size:1.1em;
	color:#c00;
}
.rightbox a:hover{
	text-decoration:underline;
}
.rightbox img{
	vertical-align:bottom;
}
.rightbox span{
	font-size:0.9em;
}
.itemrow{
	clear:both;
}
.itemrow p{	
	width:500px;
}
.itemrow .imgbox{
	float:right;
	display:inline;
	width:120px;
	margin:0 34px 0 0;
	padding:42px 0 0 0;
	text-align:right;
}
.itemrow .imgbox img{
	border:1px solid #999;
}
ul.navpage{
	margin-bottom:0;
}
.navpage li{
	list-style:none;
	display:inline;
	padding:0 10px 0 0;
	font-size:1.2em;
	font-weight:bold;
}	
/* ==== =agenda ===== */

.agenda{
	padding-bottom:20px;
	white-space:normal;
}
.agenda h2{
	color:#5a5a01;
	font-size:1.6em;
	padding:1em 0 0 36px;
}
.agenda h3{
	padding:0 0 0 20px;
	margin:10px 0 0 36px;
	background:url(../images/agenda_item.gif) no-repeat left center;
}
.agenda h3 span{
	font-weight:normal;
	padding-left:8px;
}
.agenda p{
	padding:0 0 0 56px;
}
.agenda a{
	color:#5a5a01;
}
.agenda a:hover{
	text-decoration:underline;
}
.agenda #Nav a:hover{
	text-decoration:none;
}

.totop{
	float:right;
	display:inline;
	width:150px;
	margin:8px 16px 0 0;
	padding:0;
	text-align:right;
}
.totop a{
	color:#5a5a01;
	display:block;
	padding:0 20px 0 0;
	line-height:1.8em;
	background:url(../images/totop_arrow.gif) no-repeat right top;
}

/* ------------------- =links ---------------------- */
body.links #Content{
	padding-bottom:40px;
}
body.links #Content h2{
	font-size:1.4em;
	clear:both;
	padding:1em 0 0 40px;
	margin:0;
}
body.links #Content ul{
	width:650px;
	padding:4px 40px;
	margin:0;
	list-style:none;
	font-size:1.2em;
	line-height:2em;
}
body.links #Content li{
	clear:both;
}
body.links #Content ul a{
	color:#333;
	text-decoration:underline;
}
body.links #Content ul a:hover{
	color:#000;
}
body.links #Content span.name{
	float:left;
	width:280px;
}








/* ====== =popup ======= */

body.popup{
	background:#000;
	color:#999;
}
.popupimg{
	width:420px;
	margin:20px auto;
}
.popupimg p{
	padding:16px 0 0 0;
}
.popupimg .right{
	font-size:1.2em;
	float:right;
	padding:16px 0 0 0;
}
body.interview{
	width:680px;
	background:#fff;
	padding:24px;
	margin:0 0 16px 0;
}
body.interview h2{
	padding:14px 24px 16px 24px;
}
div.printbutton{
	float:right;
	width:100px;
	padding:20px 24px 0 0;
	text-align:right;
}
div.printbutton a{
	font-size:1.2em;
}
div.printbutton a:hover{
	text-decoration:underline;
}


/* ======= =media ======== */
*html .media object.QTObject{
	display:none;
}
#Content.media{
	padding-bottom:40px;
}
#Content.media img{
	margin:17px 15px 10px 0;
	padding-left:24px;
	float:left;
}
.media h3{
	clear:both;
	padding:20px 0 10px 24px;
}	
.media h3.video{
	font-size:1.5em;
	text-transform:uppercase;
}
.media p.music a{
	color:#999;
	padding:0 0 0 16px;
	background:url(../images/icon_note.gif) no-repeat left center;
}
.media p.music a:hover{
	text-decoration:underline;
}
.media p.connection a{	
	color:#999;
}
.media p.connection a:hover{	
	color:#fff;
}
.media p span.fragment{
	float:left;
	width:22em;
	color:#ccc;
}
.media p.alternative{
	clear:left;
}
.media p.alternative a{
	color:#999;
	text-decoration:underline;
	font-style:italic;
}
.media h3.composer{
	font-size:1.2em;
	color:#ccc;
	padding:16px 0 6px 16px;
	margin:0;
}
.media object{
	display:inline;
	margin:0 0 0 16px;
}
.media ul{
	padding:0 24px;
}
.media #Content li{
	float:left;
	width:100%;
	padding:10px 0;
	list-style:none;
	font-size:1.2em;
}
.media li .composer{
	clear:both;
	float:left;
	width:160px;
}
.media div.fragm{
	float:left;
}
.media li div.fragm a{
	display:block;
}
.media div.fragm a:hover{
	text-decoration:underline;
	color:#000;
}
.media li{
	margin:0;
}	
.media span.realpl{
	color:#369;
	padding:0 8px;
}
.tv{
	float:left;
	width:100%;
	padding-top:20px;
}	

/* =contact */

.lcol{
	float:left;
	width:320px;
}
.lcol h2{
	padding-left:60px;
}
.lcol p{
	padding:0 0 0 60px;
}
.lcol p.first,
.rcol p.first{
	padding-top:16px;
}
.lcol h2,
.rcol h2{
	padding-bottom:16px;
}
.rcol{
	float:left;
	width:400px;
}
.rcol p{
	padding:0 0 0 60px;
}
.lcol a:hover,
.rcol a:hover{
	text-decoration:underline;
}

.webdesign{
	float:left;
	clear:both;
	padding:24px 0 0 24px;
	margin:0;
}

.webdesign p{
	padding:0;
	margin:0;
}
.webdesign a:hover{
	text-decoration:underline;
}

/* ==== =repertoire ====== */

.repertoire h2{
	padding:14px 24px 8px 24px;
	margin:0
}
.repertoire p{
	padding:0 24px;
	margin:0;
}
.summery{
	padding:16px 0 24px 0;
	overflow:hidden;
}
.summery p span.composer{
	color:#c00;
	float:left;
	clear:left;
	width:150px;
}
.summery p span.piece{
	float:left;
	width:550px;
}


/* ======= =press ======= */
.press #Content{
	padding-bottom:40px;
}		
.press h2{
	padding:0 32px 0 16px;
	margin:14px 0 0 24px;
	background:url(../images/agenda_item.gif) no-repeat left center;
}
.press h3{
	padding:0 24px 6px 24px;
	font-weight:normal;
}
.press h3.interview{
	padding:12px 24px 0 24px;
	font-weight:bold;
}
.press p{
	padding:0 32px 0 24px;
}
.press p a:hover{
	text-decoration:underline;
}

/* ------------------- =ensembles ---------------------- */
.ensembles #Content img{
	float:left;
	display:inline;
	margin:3px 15px 10px 24px;
}





/* ------------------- =Gallery ---------------------- */
#Gallery{
	padding:0 0 0 10px;
}
#Big{
	float:left;
	text-align:center;
	width:540px;
	color:#999;
	line-height:1.9em;
}
#Info_img{
	padding:10px 0;
}
#Info_img p{
	padding:0;
	margin:0;
}
#Info_img p a{
	color:#fff;
	text-decoration:underline;
}
#Thumbs{
	float:right;
	padding:15px 15px 0 0;
	width:200px;
}
#Thumbs ul{
	margin:0;
	padding:0;
}
#Thumbs li{
	float:left;
	display:inline;
	list-style:none;
	width:90px;
	height:90px;
	overflow:hidden;
	margin:0 10px 10px 0;
	background:#333;
}
/* ------------------- =contactform ---------------------- */
.contactform{
	width:440px;
	padding:0 0 0 24px;
	font-size:1.2em;
}
.contactform fieldset{
	border:0;
	padding:1em 0;
}
.contactform p{
	font-size:1em;
	padding:0;
	margin:1em 0;
}
.contactform ol li{
	color:#c00;
}
.contactform h2{
	font-size:1.4em;
	padding:14px 24px 4px 0;
}
.contactform input,
.contactform textarea{
	width:250px;
	border:1px solid #999;
	font-family:arial;
	font-size:1em;
}
.contactform textarea{
	overflow:hidden;
}
.contactform ul{
	margin:0;
	padding:0;
	list-style:none;
}
.contactform li{
	padding:0 0 8px 0;
}
.contactform li.controls{
	width:372px;
}
.contactform li.controls input.submit{
	width:auto;
	float:right;
}
.contactform label{
	float:left;
	width:120px;
}