@font-face {
    font-family:GraublauWeb;
    src: url("GraublauWeb.otf") format("truetype");
}
@font-face {
    font-family:GraublauWeb;
    font-weight:bold;
    src: url("GraublauWebBold.otf") format("truetype");
}

body {
	background-color:#fff;
    font-family:GraublauWeb, Helvetica,Arial,sans-serif;
    font-size:13px;
}

strong {
	color: #000;
	font-weight:normal;
	}

#header, #mainContainer, #footer {
	background-color:#fff;
    width:800px;
    margin:0 auto 0 auto;
    text-align:left;
    display:block;
}

/* -------------------- Header */

#header {
    margin-top:2.5em;
    padding-bottom:0.6em;
    overflow:auto;
    text-align:right;
    border-bottom:10px solid #000;
    font-family: GraublauWeb; /*, Helvetica, Verdana;*/
    font-weight:normal;
    letter-spacing:1px;
}

#header a {
	border:0;
}

#header img {
    float:left;
    border:0;
}

#header ul {
    margin-top:32px;
    list-style:none;
}

#header ul li {
    display:inline;
    margin-left:5px;
    color:#6e6358;
    padding:3px 5px 5px 15px;
}

#header ul li a {
    color:#93877b;
    font-size:14px;
    text-decoration:none;
    
	-webkit-transition: none;
  	-moz-transition-property: none;
  	-o-transition-property: none;

}

#header ul li:hover {

    border-radius:10px 0 10px 0;
    background-color:black;
    color:white;
}

#header ul li:hover a {
    color:white;
	text-decoration:none;
}

#header ul li.active {
    border-radius:10px 0 10px 0;
    background-color:black;
    color:white;
}

#header ul li.active a {
    color:white;
}

#subnavi {
	margin:0 0 2.5em 0;
	padding:0;
	list-style:none;
}

#subnavi li {
	display:inline;
	margin:0 1em 0 0;
	padding:0.5em;
}

#subnavi li.active {
	background-color:#eee;
    border-radius:10px 0 10px 0;
}


/* -------------------- Main */

a {
	color:#a33;
	text-decoration:none;
	-webkit-transition: color;
  	-webkit-transition-duration: 150ms;
  	-webkit-transition-timing-function: ease-in-out;
  	-moz-transition-property: opacity;
  	-moz-transition-duration: 150ms;
  	-moz-transition-timing-function: ease-in-out;
  	-o-transition-property: opacity;
  	-o-transition-duration: 150ms;
}

a:hover {
	color:#c55;
}

#quote {
	background-color:white;
	color:black;
	padding:20px;
	font-family:Times;
	font-size:22px;
	color:#888;
}

#quote span {
	font-family:Helvetica,sans-serif;
	color:#222;
	font-size:13px;
}

#moodImage {
    width:264px;
    margin:0;
    padding:0;
    background-image:url('../img/fabric.png');
    float:left;
}

#moodImage img {
    margin:0;
    padding:0;
    display:block;
}

#contentContainer {
    overflow:auto;
}

#contentShadow {
    height:4px;
    background-image:url('../img/fabric.png');
    overflow:auto;
}

#content {
    width:90%;
    float:left;
    display:block;
    min-height:310px;
    overflow:auto;
    padding-top:20px;
    padding-left:40px;
    padding-bottom:20px;
    margin-left:0;
    border-bottom:3px solid #ccc;
}

#media {
	float:left;
	width:500px;
    min-height:310px;
    overflow:auto;
    padding-top:20px;
    padding-left:0px;
    display:block;
    padding-bottom:20px;
    border-bottom:3px solid #ccc;	
}

#fotos {
	float:left;
    min-height:310px;
    overflow:auto;
    padding-top:20px;
    padding-left:0px;
    display:block;
    padding-bottom:20px;
}

#headline {
    color:#93877b;
    font-family: GraublauWeb, Helvetica, sans-serif;
    font-weight:normal;
    font-size:26px;
    letter-spacing:1px;
    margin-top:0.3em;
    margin-bottom:1em;
}

p {
    font-size:14px;
    color:#888;
    line-height:23px;
    margin-bottom:0.2em;
}

h1 {
	font-size:18px;
	font-weight:normal;
	margin-bottom:1em;
}

h2 {
	font-size:14px;
	font-weight:normal;
	margin-bottom:0.4em;
	color:#000;
}

/* -------------------- Footer */

#footer {
    overflow:auto;
    padding-top:1em;
    text-align:right;
    color:#aaa;
}

#footer a {
    color:#888;
    text-decoration:none;
}

#footer a:hover {
    color:#000;
}

/* -------------------- Repertoire */

.repertoire {
	color:#888;
	margin-bottom:3em;
}

.repertoire .composer {
	font-weight:normal;
	color:#000;
	width:130px;
	padding:10px 5px;
	border-bottom: 1px dotted #ccc;
}

.repertoire .part {
	padding:5px;
	border-bottom: 1px dotted #ccc;
}


/* -------------------- Misc */

span.graublau {
	font-family:GraublauWeb, Helvetica, sans-serif;
}

td.date {
	font-family:Helvetica;
	font-size:12px;
	padding:0 0 20px 0;
	width:100px;
	color:#888;
}

td.date strong {
	color:#000;
}

td.concert {
	padding:0 0 20px 0;
	color:#888;
}

.title {
	font-family:Helvetica;
	margin:0;
	font-size:13px;
	color:#000;
	font-weight:bold;
}

td.concert .strong {
	color:#a33;
}

.month {
	background-color:#eee;
/*	border-left:1px solid black;*/
	padding:3px 0 3px 1em;
	border-bottom:1px solid #bbb;
}