* {margin: 0; }

html, body {height: 100%;}

body {
 	background: #8F7F73;
	font:13px/1.231 arial,helvetica,clean,sans-serif;
	margin: 0;
}

img { border: none;}

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

#centerWrapper { /*wrap*/
  	min-height: 100%;
    width:975px;
    font-size: 93%;
    margin-left: auto;
    margin-right: auto;  
}

#propOpenWrapper { /*main*/
    overflow: auto;
	padding-bottom: 22px;
	width: 915px;
	margin-left: auto;
    margin-right: auto;
    color: #271D15;
}

#customHeader {
	width: 975px;
	position: relative;
	padding-bottom: 35px;
}

#customHeaderIpad {display: none;}

#iphoneAlbumArt {display: none;}

.trackView .trackTitle {
    font-family: trebuchet ms,arial,helvetica,clean,sans-serif;
    font-size: 250%;
    font-weight: bold;
    line-height: 0.97em;
    padding: 0 0.7em 0.2em 0;
}
   
.trackView #name-section {float: left;}

.trackView #name-section h3 {
    width: 385px;
    padding: 0px 0px 20px;
}


.albumInfo {padding-top: 1em;}
    
.leftMiddleColumns {
	width: 765px;
	float: left;
}

.middleColumn {
    float: right;
    width: 350px;
}

.rightColumn {
    width: 120px;
    float: right;
}

.rightColumn .title {
    font-size: 1.2em;
    font-weight: normal;
    border-top: 1px solid #dddddd;
    padding: 0.3em 0 12px;
}

#tralbumArt {
    width: 350px;
    height: 350px;
    position:relative;
}

#tralbumArt img {
    width: 350px;
    height: 350px;
}

.leftColumn {
	width: 385px;
	float: left;
}

.inline_player.desktop-view {display: block;}

.rightColumn {
	width: 120px;
	float: right;
}

#rightColumnText {padding: 0 0 5px;}

.rightColumn a {color: #652007;}

#forebearsAbout {padding: 0 0 2px 0;}

#rightColumnLinks {padding: 10px 0 10px;}

#forebearsDisco ul{
	list-style-type: none;
	margin: 0px;
	padding: 0px;
}

#forebearsDisco li{
    margin-top: 0em;
    padding-bottom: 1.5em;
}

.albumYear {color: #4B443F;}

.albumThumb {
    display: block;
    position: relative;
    width: 100px;
    height: 100px;
}
.albumTitleExtra {
    padding-top: 0.5em;
    margin-bottom: 0em;
}

#bottomcontent { 
	background: #40372F;
	position: relative;
	bottom: 0; 
	width: 975px;
	margin: 0 auto;
	margin-top: -22px;
	height: 22px;
	clear: both;
	color: white;
	font-size: 100%;
}

#bottomcontent .horizontal{
	padding: 3px 1ex;
	float: right;
}
#bottomcontentInside {}

ul.horizontal a {color: white;}

ul.horizontal {
    list-style-type: none; 
    margin: 0px;
    padding: 0px;
    white-space: nowrap;
}

ul.horizontal li {
    display: inline;
    padding-left: 1.05ex;
    padding-right: 0.5ex;
}

ol {padding: 15px 0px 0px 35px; margin: 0px; width: 50%; color: #4B443F;}

ol li {position: relative; margin-left: 7px; padding: 5px 0px 2px 0px; border: 0px; cursor: pointer;}

li.playing:before {content:""; background: url("small-player-graphics-playpause.png") 0px -17px no-repeat; width: 17px; height: 17px; padding: 0px 0px 0px 0px; margin: 0px 0px 0px -41px; position: absolute; top: 3px; color: #000; font-size: 1em;}

li.playing a, li.paused a, li.firstload a {font-weight: bold;}

li.notloaded:before, li.paused:before, li.firstload:before {content:""; background: url("small-player-graphics-playpause.png") 0px 0px no-repeat; width: 17px; height: 17px; padding: 0px 0px 0px 0px; margin: 0px 0px 0px -41px; position: absolute; top: 3px; color: #000; font-size: 1em;}

.audiojs audio { position: absolute; left: -1px; }         .audiojs { width: 385px; height: 49px; padding: 0px 0px 9px 0px; overflow: hidden; font-family: sans-serif; font-size: 12px; }         .audiojs .play-pause {width: 47px; height: 45px; padding: 2px; margin: 0px; float: left; overflow: hidden; }         .audiojs p { display: none; width: 47px; height: 45px; margin: 0px; cursor: pointer; }         .audiojs .play { display: block; }         .audiojs .scrubber {position: relative; float: left; width: 324px; background: none; height: 7px; margin: 22px 0px 10px 6px; border: 1px solid #E6E6E6; overflow: hidden; }         .audiojs .progress { position: absolute; top: 0px; left: 0px; height: 14px; width: 0px; background: #aaa; z-index: 1; }         .audiojs .loaded { position: absolute; top: 0px; left: 0px; height: 14px; width: 0px; background: #E6E6E6; }         .audiojs .time {position: absolute; height: 36px; line-height: 36px; margin: -9px 0px 0px 46px; padding: 0px 0px 0px 12px; color: #4B443F;}         .audiojs .time em { padding: 0px 2px 0px 0px; font-style: normal; }         .audiojs .time strong { padding: 0px 0px 0px 2px; font-weight: normal; }         .audiojs .error-message { float: left; display: none; margin: 0px 10px; height: 36px; width: 400px; overflow: hidden; line-height: 36px; white-space: nowrap; color: #fff;           text-overflow: ellipsis; -o-text-overflow: ellipsis; -icab-text-overflow: ellipsis; -khtml-text-overflow: ellipsis; -moz-text-overflow: ellipsis; -webkit-text-overflow: ellipsis; }         .audiojs .error-message a { color: #eee; text-decoration: none; padding-bottom: 1px; border-bottom: 1px solid #999; white-space: wrap; }    .audiojs .play {  }         .audiojs .loading {  }             .audiojs .prevNext {position: relative; float: left;} .audiojs .prevSong { width: 11px; height: 10px; position: relative; margin-top: -5px; float: left; padding-left: 7px;}   .audiojs .nextSong { width: 11px; height: 10px; position: relative;  padding-left: 9px; margin-top: -5px; float: left;}
.audiojs .error { }         .audiojs .pause {  }                 .playing .play, .playing .loading, .playing .error { display: none; }         .playing .pause { display: block; }                 .loading .play, .loading .pause, .loading .error { display: none; }         .loading .loading { display: block; }                 .error .time, .error .play, .error .pause, .error .scrubber, .error .loading { display: none; }         .error .error { display: block; }         .error .play-pause p { cursor: auto; }         .error .error-message { display: block; }                

/*#toTop { 
	width:100%;
        border:1px solid #515151;
        background:#f7f7f7;
        text-align:center;
        padding:0px;
        position:relative;
        bottom:0px; 
        cursor:pointer;
        display:block;
        color:#333;
        font-family:verdana;
        font-size:16px;
}*/

/* common iPad css */
@media all and (device-width: 768px) and (device-height: 1024px) {
	body {font-size:14px;}
}

/*iPad landscape*/
@media all and (device-width: 768px) and (device-height: 1024px) and (orientation:landscape) {
	.audiojs .scrubber {width: 320px;}
	.rightColumn .title {letter-spacing: -0.02em;}
	#forebearsAbout {letter-spacing: -0.03em;}
	#bottomcontent { 
	margin-top: -23px;
	height: 23px;
	}
}
	
/*iPad portrait*/
@media all and (device-width: 768px) and (device-height: 1024px) and (orientation: portrait) {

	#centerWrapper { /*wrap*/
    	width:724px;
	}

	#propOpenWrapper { /*main*/
		width: 664px;
	}

	#customHeader {
		width: 724px;
		padding-bottom: 20px;
		display: none;
	}

	#customHeaderIpad {
		width: 724px;
		position: relative;
		padding-bottom: 20px;
		display: block;
	}

	#_bc_customheader_map {display: none;}

	.trackView #name-section h3 {
    	width: 360px;
	}
    
	.leftMiddleColumns {
		width: 664px;
	}

	.middleColumn {
   		width: 275px;
	}

	.rightColumn {
		width: auto;
	    float: none;
	    clear: both; /**/
		padding-top: 10px; /**/
	}


	#tralbumArt {
	    width: 270px;
    	height: 270px;
	}

	#tralbumArt img {
    	width: 270px;
    	height: 270px;
	}

	.leftColumn {
		width: 360px;
	}

	#rightColumnText{
		position: absolute;
    	width: 274px;
    	padding: 10px 0 5px 0;
    	margin-left: 389px;
    	border-bottom: 1px dashed #dddddd;
	}

	#forebearsDisco li{
	    float:left;
    	padding-right: 20px;
	}

	#bottomcontent { 
		width: 724px;
		margin-top: -23px;
		height: 23px;
	}

	.ipad{
		width:100%;	
	}

	.audiojs {
		width: 360px;
	}

	.audiojs .scrubber {
		width: 300px;
	}

} /*end iPad portrait*/

/* common iPhone css */
@media only screen and (max-device-width: 640px) {
	html, body {height: auto; width: auto; overflow-x: hidden;}

body {
 	background: url(mobilebackground2Optim.png);
	font-size: 16px;
 }

a {color: #271D15;}

#centerWrapper { /*wrap*/
  	min-height: 400px;
    width:auto;
    padding-left: 10px;
    padding-right: 10px; 
}

#propOpenWrapper { /*main*/
	padding-bottom: 72px;
	width: auto;
}

#customHeader {
display: none;
}

.trackView .trackTitle {
    font-size: 200%;
}

#trackInfo {padding-top: 7px;}

#iphoneAlbumArt {
	display: inline;
	float: left;
	margin-right: 10px;
}

#iphoneAlbumArt img {
	width: 100px;
	height: 100px;
}
.trackView #name-section { float: none; padding-top: 49px;}

.trackView .trackTitle {padding-right: 0em;}

.trackView #name-section h3 {
    width: auto;
}
    
.leftMiddleColumns {
	width: auto;
	float: none;
}

.middleColumn {
    float: none;
    width: auto;
}

.rightColumn {
    width: auto;
    float: none;
}

.rightColumn .title {
    border-top: thin solid #ccc;
    padding: 1em 0 12px;
}

#tralbumArt {
    display: none;
}

#tralbumArt img {
    width: 50px;
    height: 50px;
}

.leftColumn {
	width: auto;
	float: none;
}

.rightColumn a{
    color: #271D15;
    font-weight: bold;
}

#forebearsAbout {
    display: none;
}

#rightColumnLinks {
    padding: 5px 5px 5px 5px;
    position: absolute;
	top: 0;
	right: 0;
	background: #333;
	margin-right: 3px;
	box-shadow: 0 8px 6px -6px #666;
	-webkit-box-shadow: 0 8px 6px -6px #666;
}

#rightColumnLinks a{
    color: #ffffff;
    font-weight: normal;
}

#forebearsDisco li{
    padding-bottom: 10px;
    float:left;
    padding-right: 5px;
}

.albumYear {
    color: #777;
}

#bottomcontent { 
	background: #333;
	width: auto;
	margin-top: -72px;
	height: 72px;
}

#bottomcontent .horizontal{
	padding-top: 5px;
}

ul.horizontal a{
	color: white;	
	float: right;
	padding: 0px 0px 2px 0px;
}

ul.horizontal {
    list-style-type: none; 
    margin: 0px;
    padding: 0px;
    white-space: nowrap;
}

ul.horizontal li {
    display: block;
}

ol {padding: 7px 0px 0px 45px; width: 60%; color: #777; }

ol li {
	padding: 5px 0px 5px 2px;
	margin-left: 2px;
}

li.playing:before, li.notloaded:before, li.paused:before, li.firstload:before {
	top: 5px;
	margin: 0px 0px 0px -47px;
}

.audiojs { width: auto; } 
.audiojs .scrubber {border: 1px solid #515151; opacity: 0.5; border-radius: 99999rem; }         
.audiojs .loaded { background: #515151; }         
.audiojs .time {color: #777;}     
.audiojs .prevNext {float: right; margin-right: 3%; margin-top: 22px;}  
.audiojs .prevSong { margin-top: -2px; padding-right: 9px; padding-left: 0px;}   
.audiojs .nextSong { padding-left: 0px; float: right; margin-top: -2px; }
} /*end common iPhone css*/	

/*iPhone landscape css*/
@media only screen and (max-device-width: 640px) and (orientation:landscape) {
	#trackInfoInner a {font-size: 61%;} /*fix for weird text enlargement in landscape on iPhone*/
	.albumInfo {font-size: 61%;} /*fix for weird text enlargement in landscape on iPhone*/
	audiojs .scrubber {width: 76%;}
}

/*iPhone portrait css*/	
@media only screen and (max-device-width: 640px) and (orientation:portrait) {
	.audiojs .scrubber {width: 64%;}
	.scrunched {font-size: 95%; letter-spacing: -0.08em;}
	.scrunchedmore {font-size: 85%; letter-spacing: -0.15em;}
}

