html, body {
    height: 100%;
    text-align: left;
}
body {
    background: none repeat scroll 0 0 #fff;
    color: #4e4e4e;
    font-family: Verdana,Arial,'Trebuchet MS',Helvetica,sans-serif;
    font-size: 100.01%;
    text-align: left;
    margin: 0; padding: 0;	
}

@font-face {
    font-family: oldpress; font-style: normal; font-weight: normal;	
    src: url(/font/oldpress.ttf) format("truetype");
} 

#header {float:right; padding: 0 5%; }
	.head-content { float: left;}
	.head-logo { float: left; width: 80px;}

.frame { margin: 0 auto; max-width: 1000px;}
.inner {  }

#content { float: left;
	margin: 0 5px;
	padding: 0 5%; 
	border-radius: 20px;
	border: 3px solid #eee;
}

#footer {
	clear: both;
	color: #666;
	font-family: 'Cousine',arial,serif;
	font-size: 0.8em;
	padding-top: 20px; padding-left: 5%;
	height: 40px;
}
.footcontent { margin: 0 5px; padding: 30px 0 0; }
.footer a { color: #3f3f3f; }
.footer a:hover { color: #cf3c3c; }

h1, h2, h3 { color: #aaa; font-weight: 400; margin-bottom: 1%; }
h1 a, h2 a, h3 a { color: #bbb; }
h1 a:hover { color: #aaa; }
h2, .title { font-family: oldpress; font-size: 2.5em; color:#9c0c26; }
h3 { letter-spacing: 0.15em; }
.head-content h1 { font-size: 2.5em; text-align: right; }

small {font-size: 0.8em; line-height: 1.3em; }
a { color: #000077; text-decoration: none; }
a:hover { color: #c00; }

ul { list-style: none; padding:0; }
li a::before {
	font-family:FontAwesome;
	content:"\f0da";
	padding-right: 10px;
}
li { line-height: 1.6em; }

.websites ul {
	font-size: 1.1em;
	list-style: none;
	max-width: 240px;
	padding: 0;
}
.websites li {
	font-family: Verdana,Arial,'Trebuchet MS',Helvetica,sans-serif;
	background: url("https://house-of-chicago.de/data/load/img/stripe_ef_60.png") repeat-x scroll center top #EFEFEF;
	border: 1px solid #ccc;
	border-radius: 5px;
	margin-bottom: 10px; padding: 4px 10px;
}
.websites li a::before {
	font-family:FontAwesome;
	content:"\f101";
	font-size: 1.2em;
	padding: 0 10px;
}
.websites li:hover { background: #f6f6f6; }
.websites li a { }


p { line-height: 2em; }

div.hr {
    clear: both;
    border-bottom:1px dashed #bbb;
    margin:10px 0; padding-top:10px;
}
div.hr hr {display: none;}

img { border: medium none; }

.reihe { float: left; width: 100%; }

.spalte2 { 
	float: left; 
	width: 45%;
	margin-right: 5%; padding-top: 0;
}


div.reihe div.spalte:last-child { margin-right: 0%; }

.Musik-Buchstabe {}
.Musik-Buchstabe a {
	background:linear-gradient(#fff 70%, #f5f5f5);
 	font-family:monospace, monospace;
 	font-size:1.5em;
 	padding:4px 8px;
 	margin:2px;
 	line-height:2em;
 	border-radius:4px;
 	box-shadow:1px 3px 3px #eee;
 	border:1px solid #ccc!important
}
.Musik-Buchstabe a:hover {
	background:linear-gradient(#f5f5f5, #fff 70%);
 	box-shadow:none
}

@media only screen and (min-width: 320px) and (max-width: 759px) {
	.frame { max-width: 100%; }
	#header { }
		.head-content { float: left; font-size: 0.8em; }
		.head-logo img { width: 75px; height: 75px; }
	.spalte2 { 
		float: none;
		margin-bottom: 20px;
		width: 100%;
	}
	li { line-height: 2.0em; }
}