@import url(http://fonts.googleapis.com/css?family=Open+Sans:400,300,600);

/**
 * Reset ==============================================================
 * Based on http://meyerweb.com/eric/tools/css/reset
 */

html,
body,
div,
span,
applet,
object,
iframe,
h1,
h2,
h3,
h4,
h5,
h6,
p,
blockquote,
pre,
a,
abbr,
acronym,
address,
big,
cite,
code,
del,
dfn,
em,
font,
img,
ins,
kbd,
q,
s,
samp,
small,
strike,
strong,
sub,
sup,
tt,
var,
b,
u,
i,
center,
dl,
dt,
dd,
ol,
ul,
li,
fieldset,
form,
input,
select,
textarea,
label,
legend,
table,
caption,
tbody,
tfoot,
thead,
tr,
th,
td {
  margin:0px;
  padding:0px;
  border:0px;
  outline:0px;
  background:transparent;
  }

ol,
ul,
ul,
ul li { list-style:none; }

blockquote,
q { quotes:none; }

blockquote:before,
blockquote:after,
q:before,
q:after {
  content:'';
  content:none;
  }

/* remember to define focus styles! */
:focus { outline:0px; }

/* remember to highlight inserts somehow! */
ins { text-decoration:none; }
del { text-decoration:line-through; }

/* tables still need 'cellspacing="0"' in the markup */
table {
  border-collapse:collapse;
  border-spacing:0px;
  }



body {
	margin: 0;
	padding: 0;
	font-family: 'Open Sans', sans-serif; font-weight: 300;
	font-size: 11px;
	/*line-height: 18px;*/
	background-color: #FFFFFF;
}

#wrapper {
	width:960px; 
	padding: 10px; 
	background:#FFFFFF; 
	margin: 0px auto; 
	}
	
* html #wrapper { /*realisiert das Auslaufen des wrapper-HG auch im IE 6.0 */
	height: 100%;
	}

#head {
	width:940px; 
	padding: 10px 0 30px 0;
	text-align:center;
	}

.headline{
text-align: center;
font-size: 11px;
font-weight: 300;
color: #E20026;
margin-top: 10px;
}

h1 {
	font-size: 18px;
	letter-spacing: 0.1em;
	font-weight: 400;
	color: #E20026;
	margin: 10px 0 10px 0;
}

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

a:link, 
a:visited, 
a:active {
	text-decoration:none; 
	color:#262626; 
	font-weight: 400;
	}
												
a:hover {
	text-decoration:underline;
	}


.demo-wrap ul {
	width: 820px;
	height: 750px;
	overflow: hidden;
	}

.demo-wrap li {
	list-style: none;
	margin: 0;
	height: 750px;
}


.demo-wrap .left {
	width: 500px;
	float: left;
}

.demo-wrap .right {
	width: 280px;
	/*padding-left: 30px;*/
	float: right;
}

.demo-wrap .right .album {
	margin-top: 20px;
	font-size: 13px; font-weight:600;
	color: #222;
	text-align: left;
	}
	
.demo-wrap .right .album2 {
	margin-top: 6px;
	font-size: 13px; font-weight:600;
	color: #222;
	text-align: left;
	}
	
.demo-wrap .right .album3 {
	margin-top: 30px;
	font-size: 13px; font-weight:600;
	color: #222;
	text-align: left;
	}

.demo-wrap .right .band {
	font-size: 12px;
	color: #838383;
	text-align: left;
	/*padding-right: 10%;*/
}


.demo-wrap .multiple li {
	/*width: 190px;*/
}

.demo-wrap .bx-wrapper {
	margin: 0 auto; 
}

.demo-wrap .bx-prev {
	position: absolute;
	top: 300px;
	left: -115px;
	width: 64px;
	height: 128px;
	text-indent: -999999px;
	background: url(../images/arrow_left.png) no-repeat;
}

.demo-wrap .bx-next {
	position: absolute;
	top: 300px;
	right: -40px;
	width: 64px;
	height: 128px;
	text-indent: -999999px;
	background: url(../images/arrow_right.png) no-repeat;
}

.demo-wrap .bx-next:hover,
.demo-wrap .bx-prev:hover {
	background-position: 0 0;
}



#footertext {
	clear: both;
	padding: 50px 390px 30px 70px;
	font-size: 13px; line-height:1.6em;
	color: #222;
	text-align: left;
	font-weight: 400;
		
}

#footer {
	clear: both;
	padding: 50px 390px 30px 70px;
	font-size: 13px; line-height:1.6em;
	color: #222;
	text-align: left;
		
}

#footer a:link, a:visited, a:active {
	text-decoration:underline; 
	color:#262626; 
	font-weight: 300;
	}
												
#footer a:hover {
	color: #E20026;
	}