/*
Stefan Hardt
*/


html {

}

body {
	background-color: #000;
	color: #FFF;
	font-family: Arial Black, Arial;
	font-size: 16px;
	margin: 15px 0 0 20px;
	width: 940px;
}

p {
	font-family: Arial;
}


/*SIDEBAR*/
#sidebar {
	margin: 0;
	padding: 40px 0 0 15px;
	width: 240px;
	float: left;
}

#sbTitle {
	color: #FF9933;
	font-size: 36px;
	line-height: 32px;
}

#hardt {
	font-size: 41px;
}

.sbMenu {
	margin-top: 100px;
	font-size: 23px;
}

#sbMenuEnglish {
	margin-top: 30px;
	font-size: 18px;
}


/*CONTENT*/
#index {
	margin: 0 0 0 255px;
	padding: 40px 0 40px 0;
}

#content {
	margin: 0 0 0 255px;
	padding: 40px 0 40px 0;
}

.works {
	height: 92px;
	margin: 0 0 25px 0;
	background-color: #333;
}

.emptyWorks {
	height: 92px;
	margin: 0 0 25px 0;
}

.wTitle {
	margin: 32px 24px 0 24px;
	float: left;
}

.wImage {
	float: left;
}


/*MUSIK*/
#musik {
	margin: 0 0 0 255px;
	padding: 40px 0 0 120px;
}

#mTitle {
	width: 400px;
	margin: 30px 0 15px 0;
	letter-spacing: 1px;
}

.mSong {
	font-family: Arial;
	font-weight: bold;
	font-size: 12px;
	height: 14px;
	margin: 0 0 4px 0;
	width: 293px;
}

.mSongAdd {
	font-family: Arial;
	font-weight: bold;
	font-size: 12px;
	margin: 25px 0 4px 0;
}

.mSubSong {
	font-size: 10px;
}

.mCredits1 {
	font-family: Arial;
	font-size: 11px;
	margin: 15px 0 0 0;
}

.mCredits2 {
	font-size: 11px;
	margin: 10px 0 0 0;
}


/*HÖRSPIELE*/
.hsImage {
	float: right;
}

#hs {
	margin: 0 0 0 255px;
	padding: 40px 0 0 120px;
}

.hsText {
	width: 400px;
	margin: 0 0 10px 0px;
	letter-spacing: 1px;
	font-size: 15px;
}

.hsTextjust {
	width: 400px;
	margin: 0 0 10px 0px;
	text-align: justify;
	letter-spacing: 1px;
	font-size: 15px;
}

.hsText2 {
	width: 400px;
	margin: 0 0 16px 0px;
	padding: 1px 0 0 0;
	text-align: justify;
	letter-spacing: 1px;
	font-size: 15px;
	clear: left;
}

.creditsTable {
	padding: 10px 0 0 0;
	width: 400px;
}

/*hörbeispiel*/
#hshb {
	margin: 0 0 15px 0;
	padding: 50px 0 0 0;
}

#hshbTitle {
	font-size: 16px;
	width: 200px;
	color: #09F;
	float: left;
}


/*TEXTE*/
#textAuszug {
	font-size: 16px;
	margin: 15px 0 50px 0;
	color: #09F;
}

#textAuszugMore {
	font-size: 16px;
	margin: 30px 0 50px 0;
	color: #09F;
}

#moreLinkText {
	font-size: 16px;
	margin: 0 0 25px 0;
	padding: 50px 0 0 0;
}

.textText {
	width: 400px;
	margin: 0 0 10px 0px;
	letter-spacing: 1px;
	font-size: 15px;
	text-align: justify;
}

.textText2 {
	width: 400px;
	margin: 0 0 16px 0px;
	padding: 136px 0 0 0;
	text-align: justify;
	letter-spacing: 1px;
	font-size: 15px;
}

#auszugTitle {
	color: #F00;
	margin: 15px 0 0 0;
	font-size: 18px;
	text-align: left;
}

#auszugTitleSub {
	font-size: 11px;
	font-weight: normal;
	margin: 0 0 30px 0;
}


/*RADIO*/
#radio {
	margin: 0 0 64px 255px;
	padding: 40px 0 0 120px;
}

.rTitle {
	width: 400px;
	margin: 30px 0 15px 0;
	letter-spacing: 1px;
}

.rText {
	width: 400px;
	margin: 40px 0 10px 0px;
	text-align: justify;
	letter-spacing: 1px;
	font-size: 15px;
}

.rTextjust {
	width: 400px;
	margin: 0 0 10px 0px;
	text-align: justify;
	letter-spacing: 1px;
	font-size: 15px;
}

.rText2 {
	width: 400px;
	margin: 0 0 16px 0px;
	padding: 1px 0 0 0;
	text-align: justify;
	letter-spacing: 1px;
	font-size: 15px;
	clear: left;
}

.smallCenterTexts {
	width: 400px;
	padding: 4px 0 20px 0;
	font-size: 11px;
	text-align: center;
	color: #8DCDFD;
	clear: left;
}

.rSmallCenterTexts {
	width: 400px;
	padding: 4px 0 4px 0;
	font-size: 11px;
	text-align: center;
	color: #8DCDFD;
}


/*BIO*/
#bioText {
	width: 400px;
	margin: 30px 0 50px 0px;
	text-align: justify;
	letter-spacing: 1px;
	font-size: 15px;
}


#site {
	margin: 0 0 0 255px;
	padding: 40px 0 0 120px;
}

.siteTitle {
	margin: 0 0 15px 0;
	font-size: 18px;
	text-align: left;
}

/*TERMINE*/
#termineText {
	width: 400px;
	margin: 40px 0 50px 0px;
	text-align: left;
	letter-spacing: 1px;
	font-size: 15px;
}

/*KONTAKT*/
#siteKontakt {
	margin: 0 0 0 175px;
	padding: 100px 0 0 20px;
}

.siteKontakt {
	margin: 0 0 0 175px;
	padding: 100px 0 0 120px;
}

.siteKontakt2 {
	margin: 0 0 100px 175px;
	padding: 40px 0 0 120px;
}

.kontaktText {
	width: 400px;
	letter-spacing: 1px;
	font-size: 15px;
}

#kontaktPreis {
	font-family: Arial;
	font-size: 15px;
	letter-spacing: 1px;
	width: 400px;
}

.kcd {
	width: 70px;
	float: left;
}

.kp {
	width: 330px;
}

.engkcd {
	width: 90px;
	float: left;
}

.engkp {
	width: 360px;
}

.newsText {
	width: 400px;
	margin: 0 0 0 120px;
	text-align: justify;
	letter-spacing: 1px;
	font-size: 15px;
}

/*LINKS*/
#linksText {
	width: 400px;
	margin: 40px 0 50px 0px;
	text-align: justify;
	letter-spacing: 1px;
	font-size: 15px;
}

/*M&HS-MORE*/
#moreText {
	width: 400px;
	margin: 40px 0 50px 0px;
	text-align: justify;
	letter-spacing: 1px;
	font-size: 15px;
}


/*MORE*/
.subLink {
	font-size: 16px;
	margin: 18px 0 18px 0;
}

#moreLink {
	font-size: 16px;
	margin: 18px 0 50px 0;
}

#mMoreTitle {
	margin: 15px 0 15px 0;
	font-size: 18px;
	text-align: left;
}

#mMoreTitleS {
	margin: 15px 0 16px 0;
	font-size: 17px;
	text-align: left;
}

#more {
	width: 400px;
	margin: 0 0 50px 255px;
	padding: 40px 0 0 120px;
	text-align: justify;
	letter-spacing: 1px;
	font-size: 15px;
}

.grey {
	color: #666;
}
.red {
	color: #F00;
}
.cyan {
	color: #8DCDFD;
}
.cyanBig {
	color: #8DCDFD;
	font-size: 18px;
}
.big {
	font-size: 18px;
}
.small {
	font-size: 11px;
}
.smalljust {
	font-size: 11px;
	text-align: justify;
}

.leftTable {
	width: 200px;
	float: left;
	font-family: Arial;
	font-weight: bold;
	text-align: left;
	font-size: 15px;
	letter-spacing: 1px;
}


.rightTable {
	width: 200px;
	float: left;
	font-family: Arial;
	text-align: left;
	font-size: 15px;
	letter-spacing: 1px;
	margin-bottom: 10px;
}


.leftTable2 {
	width: 220px;
	float: left;
	font-family: Arial;
	font-weight: bold;
	text-align: left;
	font-size: 15px;
	letter-spacing: 1px;
}


.rightTable2 {
	width: 180px;
	float: left;
	font-family: Arial;
	text-align: left;
	font-size: 15px;
	letter-spacing: 1px;
	margin-bottom: 10px;
}

.smallCenter {
	width: 400px;
	padding: 30px 0 0 0;
	font-size: 11px;
	text-align: center;
	color: #8DCDFD;
	clear: left;
}

.smallCenter2 {
	width: 400px;
	padding: 30px 0 0 0;
	font-size: 11px;
	text-align: center;
	color: #8DCDFD;
}

.title {
	font-size: 18px;
	font-weight: bold;
}


/*HYPERLINKS*/
a {
	color: #FFF;
	text-decoration: none;
}

a:link {
	color: #FFF;
}

a:visited {
	color: #FFF;
}

a:link:focus {
	color: #999;
}

a:link:hover,
a:visited:hover {
	color: #F00;
}

a:link:active,
a:visited:active {
}

.small a:link, .small a:visited, .sbLink1 a:link, .sbLink1 a:visited, #moreLink a:link, #moreLink a:visited, #moreLinkText a:link, #moreLinkText a:visited, #textAuszug a:link, #textAuszug a:visited, #textAuszugMore a:link, #textAuszugMore a:visited, #auszugTitle a:link, #auszugTitle a:visited, .kontaktText a:link, .kontaktText a:visited, #linksText a:link, #linksText a:visited, .subLink a:link, .subLink a:visited, #more a:link, #more a:visited {
	color: #09F;
}

.small a:link:hover, .small a:visited:hover, .sbLink1 a:link:hover, .sbLink1 a:visited:hover, #moreLink a:link:hover, #moreLink a:visited:hover, #moreLinkText a:link:hover, #moreLinkText a:visited:hover, #textAuszug a:link:hover, #textAuszug a:visited:hover, #textAuszugMore a:link:hover, #textAuszugMore a:visited:hover, #auszugTitle a:link:hover, #auszugTitle a:visited:hover, .kontaktText a:link:hover, .kontaktText a:visited:hover, #linksText a:link:hover, #linksText a:visited:hover, .subLink a:link:hover, .subLink a:visited:hover, #more a:link:hover, #more a:visited:hover {
	color: #F00;
}

.sbLink2 a:link, .sbLink2 a:visited, #sbMenuEnglish a:link, #sbMenuEnglish a:visited {
	color: #999;
}

.sbLink2 a:link:hover, .sbLink2 a:visited:hover, #sbMenuEnglish a:link:hover, #sbMenuEnglish a:visited:hover {
	color: #F00;
}

#sbTitle a:link, #sbTitle a:visited {
	color: #F93;
}

#sbTitle a:link:hover, #sbTitle a:visited:hover {
	color: #F00;
}

.active a:link, .active a:visited {
	color: #F00;
}

.active a:link:hover, .active a:visited:hover {
	color: #999;
}

a img{
	border: none;
}
a:link img {
}
a:visited img {
}
a:link:active img,
a:visited:active img {
}


/*mp3*/
.mSongMP3 {
	font-family: Arial;
	font-weight: bold;
	font-size: 12px;
	height: 12px;
	float: left;
	display: block;
}

.mSongHolder {
	margin: 0;
	display: inline-block;
	width: 100%;
}

.mp3 {
}


.hsmp3num {
	font-size: 16px;
	color: #09F;
	width: 30px;
	float: left;
}

.hsmp3Holder {
	height: 23px;
	width: 400px;
	margin: 0 0 4px 200px;
}

.hsmp3 {
	padding: 5px 0 0 0;
}


.rmp3Holder {
	height: 23px;
	width: 400px;
	margin: 0 0 4px 0;
}

.amplitude-play-pause {
    width: 32px;
    height: 32px;
    cursor: pointer;
    float: left;
}

.amplitude-play-pause.amplitude-paused {
    background: url("https://521dimensions.com/img/open-source/amplitudejs/examples/single-song/play.svg");
	background-size: cover;
}

.amplitude-play-pause.amplitude-playing {
    background: url("https://521dimensions.com/img/open-source/amplitudejs/examples/single-song/pause.svg");
    background-size: cover;
}

.amplitude-play-pause .amplitude-paused {
    background: url("https://521dimensions.com/img/open-source/amplitudejs/examples/single-song/play.svg");
	background-size: cover;
}

.amplitude-play-pause .amplitude-playing {
    background: url("https://521dimensions.com/img/open-source/amplitudejs/examples/single-song/pause.svg");
    background-size: cover;
}

.amplitude-paused {
    background: url("https://521dimensions.com/img/open-source/amplitudejs/examples/single-song/play.svg");
	background-size: cover;
}

.amplitude-playing {
    background: url("https://521dimensions.com/img/open-source/amplitudejs/examples/single-song/pause.svg");
    background-size: cover;
}
