/* @group RESET */

/* 	css reset 
	by eric meyer http://meyerweb.com/eric/thoughts/2007/05/01/reset-reloaded/
*/

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,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
	margin: 0;
	padding: 0;
	border: 0;
	outline: 0;
	font-weight: inherit;
	font-style: inherit;
	font-size: 100%;
	font-family: inherit;
	vertical-align: baseline;
}        


:focus {
	outline: none;
}

/*ol, ul {
	list-style: none;
}*/

/* @end */

@font-face {
	font-family: 'hommeFont';
        src: url('../font/MyriadPro-Regular.otf');
        font-weight: normal;
	font-style: normal;
}

body {
	background-color: #fff;
	color: #e9e9e6;
	font: 13pt hommeFont, Verdana, Arial, sans-serif;
	margin:0;
	padding:0;
        height: 100%;
}

a {
    color: #e9e9e6;
    text-decoration: none;
}

div#homme_header_wrapper, 
div#homme_header_background {
    width: 100%;
    height: 310px;
}

div#homme_header_wrapper {
    position: absolute;
}

div#homme_header_background {
    background: url("../bilder/hommeHeaderBackground.gif") no-repeat;
    background-position: top center;
/*    background-color: #cdc0b4;*/
}

div#homme_header_center {
    background: url("../bilder/hommeLogo.png") no-repeat;
/*    background-position: bottom left;*/
    background-position: 50px 223px;
    width: 850px;
    height: 320px;
    margin: auto auto;
}

img#homme_info_button,
img#homme_facebook_button,
img#homme_myspace_button,
img#homme_twitter_button {
    position: relative;
    width: 30px;
    height: 30px;
    top: 250px;
    border: none;
    margin: 0;
    padding: 0;
    margin-left: 760px;
    cursor: pointer;
}

img#homme_facebook_button {
    margin-left: 0px;
}

img#homme_twitter_button {
    margin-left: 0px;
}

/*img#homme_myspace_button {
    background-color: #888;
    left: 50px;
}*/

div#homme_info {
    position: absolute;
    z-index: 999999;
    width: 100%;
    height: 100%;
    top: 0px;
    margin: 0px 0px;
    background: url('../bilder/infoBackgroundWhite.png') repeat;
}

div#homme_info_inner_bg {
    width: 456px;
    height: 610px;
    margin-right: auto;
    margin-left: auto;
    background: url('../bilder/infoBackground.png') repeat;
}

div#homme_info_inner_bg_top {
    width: 456px;
    height: 12px;
    margin-top: 20px;
    margin-right: auto;
    margin-left: auto;
    background: url('../bilder/infoBackgroundTop.png') no-repeat;
}

div#homme_info_inner_bg_bottom {
    width: 456px;
    height: 12px;
    margin-right: auto;
    margin-left: auto;
    background: url('../bilder/infoBackgroundBottom.png') no-repeat;
}

div#homme_info_content {
    padding-top: 20px;
    font-size: 0.85em;
    text-align: center;
}

div#homme_info_content p {
    font-size: 1.06em;
}

div#homme_album_title {
    background-image: url('../bilder/realizationForTheEar.png');
    background-position: bottom;
    background-repeat: no-repeat;
    width: 194px;
    height: 335px;
    margin: auto auto;
}

div#homme_player_content {
    margin: auto auto;
    width: 600px;
    height: 100px;
/*    background-color: #000;*/
}

img.homme_button {
    display: block;
    margin: auto auto;
    cursor: pointer;
}

img#mountains_prologue_button {
    width: 285px;
    height: 28px;
}

div#mountains_button {
    width: 150px;
    height: 28px;
}

div#ein_haufen_button {
    width: 150px;
    height: 28px;
}

div#zwei_haufen_button {
    width: 150px;
    height: 28px;
}

div#zwei_haufen_und_halb_button {
    width: 285px;
    height: 30px;
}

div#drei_haufen_button {
    width: 150px;
    height: 28px;
}

div#vier_haufen_button {
    width: 150px;
    height: 28px;
}

div#woods_button {
    width: 150px;
    height: 28px;
}

div#progressoverlay {
	position:absolute;
	top:4px;
	left:20px;
	background: url("../bilder/timeline.png") 0px 0px no-repeat;
	width:265px;
	height:23px;
	z-index:999;
}

div.jp-audio {

	/* Edit the font-size to counteract inherited font sizing.
	 * Eg. 1.25em = 1 / 0.8em
	 */

	font-size:1.25em;

	font-family:Verdana, Arial, sans-serif;
	line-height:1.6;
	color: #666;
}
div.jp-audio {
        position: absolute;
        top:0px;
        left: auto;
	width:400px;
/*        background: #777;*/
/*        visibility: hidden;*/
        opacity: 0;
        margin: auto auto;
}
div.jp-interface {
	position: relative;
        background: none;
	/* width:418px; */
	width:100%;
}
div.jp-audio div.jp-type-single div.jp-interface {
	height:40px;
	border-bottom:none;
}

div.jp-interface ul.jp-controls {
	list-style-type:none;
	padding:0;
	margin: 0;
}
div.jp-interface ul.jp-controls li {
	/* position: absolute; */
	display:inline;
}
div.jp-interface ul.jp-controls a {
	position: absolute;
	overflow:hidden;
	text-indent:-9999px;
}
a.jp-play,
a.jp-pause {
	width:40px;
	height:40px;
	z-index:1;
}
div.jp-audio div.jp-type-single a.jp-play,
div.jp-audio div.jp-type-single a.jp-pause {
	top:3px;
	left:290px;
}

a.jp-play {
	background: url("../bilder/playButton.png") 0 0 no-repeat;
        width: 23px;
        height: 22px;
}
a.jp-play:hover {
	background: url("../bilder/playButton.png") 0 0 no-repeat;
        width: 23px;
        height: 22px;
}

a.jp-pause {
	background: url("../bilder/pauseButton.png") 0 0 no-repeat;
        width: 23px;
        height: 22px;
}
a.jp-pause:hover {
	background: url("../bilder/pauseButton.png") 0 0 no-repeat;
        width: 23px;
        height: 22px;
}
div.jp-audio div.jp-type-single a.jp-stop {
	top:0px;
	left:265px;
}
a.jp-stop {
	background: url("../bilder/homme_player_controls.jpg") 0 -83px no-repeat;
	width:28px;
	height:28px;
	z-index:1;
}
a.jp-stop:hover {
	background: url("../bilder/homme_player_controls.jpg") -29px -83px no-repeat;
}
div.jp-progress {
	position: absolute;
	overflow:hidden;
}
div.jp-audio div.jp-type-single div.jp-progress {
	top:12px;
	left:25px;
	width:255px;
	height:7px;
}
div.jp-video div.jp-progress {
	top:0px;
	left:0px;
	width:100%;
	height:7px;
}
div.jp-seek-bar {
/*	background: url("../bilder/homme_player_controls.jpg") 0 -202px repeat-x;*/
	width:0px;
	/* height:15px; */
	height:100%;
	cursor: pointer;
	z-index:-2;
        background: #ccc;
}
div.jp-play-bar {
/*	background: url("../bilder/homme_player_controls.jpg") 0 -218px repeat-x ;*/
	width:0px;
	/* height:15px; */
	height:100%;
	z-index:-2;
        background: #444;
}

/* The seeking class is added/removed inside jPlayer */
div.jp-seeking-bg {
/*	background: url("../bilder/pbar-ani.gif");*/
}

a.jp-mute,
a.jp-unmute {
	width:18px;
	height:15px;
}
div.jp-audio div.jp-type-single a.jp-mute,
div.jp-audio div.jp-type-single a.jp-unmute {
	top:7px;
	left:320px;
}
a.jp-mute {
	background: url("../bilder/homme_player_controls.jpg") 0 -186px no-repeat;
}
a.jp-mute:hover {
	background: url("../bilder/homme_player_controls.jpg") -19px -170px no-repeat;
}
a.jp-unmute {
	background: url("../bilder/homme_player_controls.jpg") 0 -170px no-repeat;
	display: none;
}
a.jp-unmute:hover {
	background: url("../bilder/homme_player_controls.jpg") -19px -186px no-repeat;
}
div.jp-volume-bar {
	position: absolute;
	overflow:hidden;
	background: url("../bilder/homme_player_controls.jpg") 0 -250px repeat-x;
	width:70px;
	height:5px;
	cursor: pointer;
}
div.jp-audio div.jp-type-single div.jp-volume-bar {
	top:12px;
	left:345px;
}
div.jp-volume-bar-value {
	background: url("../bilder/homme_player_controls.jpg") 0 -256px repeat-x;
	width:0px;
	height:5px;
}
div.jp-current-time,
div.jp-duration {
	position: absolute;
	font-size:.3em;
	font-style: oblique;
}
div.jp-duration {
	text-align: right;
}
div.jp-audio div.jp-type-single div.jp-current-time,
div.jp-audio div.jp-type-single div.jp-duration {
	top:25px;
	left:25px;
	width:255px;
}

div.jp-type-single div.jp-playlist li {
	padding:5px 0 5px 20px;
	font-weight:bold;
}

div.jp-jplayer {
	width:0px;
	height:0px;
}
div.jp-jplayer {
	background-color: transparent;
}