body {
	font-family:sans-serif;
	padding:0;
	margin:0;
	text-align:center;
	background:#333;
}
#wrapper {background:#333 url(bg2.jpg) top right no-repeat fixed;overflow:auto;margin:0 auto;padding:20px;text-align:left;min-width:900px;max-width:1105px}
#mixDetails {float:right;width:47%;background:white;background:rgba(255,255,255, 0.7);border-radius:8px;-webkit-border-radius:8px;-moz-border-radius:8px;padding:10px;}
#about {background:#333;background:rgba(51,51,51, 0.7);border-radius:8px;-webkit-border-radius:8px;-moz-border-radius:8px;padding:10px;overflow:auto;}
#about img {border:8px solid gray;border-radius:8px;-webkit-border-radius:8px;-moz-border-radius:8px;display:block;float:left;margin:0 10px 0 0;}
#about p {color:white;text-shadow:1px 1px 1px black;}
#about a {color:white;}
#about a:hover {color:orange;text-shadow:1px 1px 1px #a26727;}
#player {float:left;width:47%;background:white;background:rgba(255,255,255, 0.75);border-radius:8px;-webkit-border-radius:8px;-moz-border-radius:8px;padding:10px;}
#preamble {background:#fff;background:rgba(233,233,233,0.8);padding:1em;text-shadow: 1px 1px 1px #000, -1px -1px 1px #ccc;border-radius:8px;-webkit-border-radius:8px;-moz-border-radius:8px;margin:10px 0;font-size:1.2em;}
#mm {background:#000;background:rgba(0,0,0,0.8);padding:1em;text-shadow: 1px 1px 1px #000, -1px -1px 1px #ccc;border-radius:8px;-webkit-border-radius:8px;-moz-border-radius:8px;margin:10px 0;font-size:1.2em;overflow:auto;}
#mm h2, #mm p {text-shadow: none;color:#fff;font-size:1.3em;}
#mm h2 {position:relative;padding:30px 10px;height:77px;width:282px;float:right;margin:0 0 10px 10px;}
#mm h2, #mm h2 b {display:block;}
#mm h2 b {background:url(/images/mm.png);height:137px;width:302px;top:0;left:0;position:absolute;}
#mm a span {text-decoration:underline;color:yellow;}
#mm a:hover span, #mm a:focus span {color:red;}
#preamble p {margin:4px 0;}
#about p {margin:0 0 10px 0;}
#otherlinks {background:#333;margin:10px 0;border-radius:8px;-webkit-border-radius:8px;-moz-border-radius:8px;color:#fff;padding:10px;}
#otherlinks h3 {background:none;margin:0;padding:0}
#otherlinks a {color:#fff;}
#otherlinks a:hover {color:yellow;}
h1 {margin:0;color:#fff;letter-spacing:0.2em;background:#333;background:rgba(51,51,51,0.6);padding:20px;text-shadow: 1px 1px 1px #000, -1px -1px 1px #ccc;border-radius:8px;-webkit-border-radius:8px;-moz-border-radius:8px;}
h2 {margin:0;color:#049;letter-spacing:1px;line-height:1.4;}
h3 {margin:0;clear:both;width:auto;background:white;border-radius:6px;-webkit-border-radius:6px;-moz-border-radius:6px;padding:4px;}
h3 a {display:block;padding:4px;}
#buttons {overflow:auto;margin-top:10px;background:white;border-radius:6px;-webkit-border-radius:6px;-moz-border-radius:6px;padding:4px;}
#buttons a {display:block;padding:15px 5px;background:white;text-decoration:none;float:left;margin:0 10px 10px 0;height:80px;border:1px solid gray;border-radius:6px;-webkit-border-radius:6px;-moz-border-radius:6px;}
#buttons a img {border:none;margin:5px;display:block;}
.hidden {display:none}
pre {font-family:sans-serif;font-size:11px;padding:8px;border-radius:8px;-webkit-border-radius:8px;-moz-border-radius:8px;background-color: #fefefe;}
.mixTitle {font-weight:bold;margin:10px 0 5px 0;display:block;}
h3 a, #older a.toggler {text-decoration:none;font-size:small;}
ul {margin:0;padding:0;list-style-type:none;}
p {text-shadow: 1px 1px 1px silver, -1px -1px 1px #efefef;}
#newest>li {background:#ccf;padding:8px;margin-bottom:6px;border-radius:8px;-webkit-border-radius:8px;-moz-border-radius:8px;}
#newest li li {float:left;}
#newest li li a {display:block;color:white;background:blue;padding:3px;width:10em;border-radius:5px;-webkit-border-radius:5px;-moz-border-radius:5px;-o-border-radius:5px;text-decoration:none;text-align:center;font-size:0.7em;margin:0 5px 7px 0;}
a {color:blue;}
#newest li li a:hover,#newest li li a:focus {background:black;}
ul.showBullets {list-style-type:circle;margin:0 0 0 10px;}
#newest ul.showBullets li {float:none;}
#newest b {white-space:nowrap;}
#older {border-radius:5px;-webkit-border-radius:5px;-moz-border-radius:5px;-o-border-radius:5px;background:rgba(255,255,255,0.4);padding:10px;}
#older li {background:rgba(255,255,255,0.6);border:1px solid gray;border-radius:6px;-webkit-border-radius:6px;-moz-border-radius:6px;padding:5px;margin:4px 0;}
#older li a {text-decoration:none;}
#newest p {font-size:14px;margin:10px 0;}
#newest span a {text-decoration:none;color:#049;}
#newest img {border:5px solid white;float:right;margin:0 0 8px 8px;
	box-shadow:4px 4px 7px #BFBFBF;
	-moz-box-shadow:4px 4px 7px #BFBFBF;
	-o-box-shadow:4px 4px 7px #BFBFBF;
	-webkit-box-shadow:4px 4px 7px #BFBFBF;
	transform: scale(0.85) rotate(2deg) translate(0px, 0px) skew(0deg, 0deg);
	-moz-transform: scale(0.85) rotate(2deg) translate(0px, 0px) skew(0deg, 0deg);
	-o-transform: scale(0.85) rotate(2deg) translate(0px, 0px) skew(0deg, 0deg);
	-webkit-transform: scale(0.85) rotate(2deg) translate(0px, 0px) skew(0deg, 0deg);
	}
#newest li:hover img {
	transform: scale(1) rotate(0deg) translate(0px, 0px) skew(0deg, 0deg);
	-moz-transform: scale(1) rotate(0deg) translate(0px, 0px) skew(0deg, 0deg);
	-o-transform: scale(1) rotate(0deg) translate(0px, 0px) skew(0deg, 0deg);
	-webkit-transform: scale(1) rotate(0deg) translate(0px, 0px) skew(0deg, 0deg);
	}
#mm {}
.txtDownload {padding:5px;background:#0000FF;margin-bottom:10px}
.txtDownload a {color:#fff;}
#newest li ul li a {display:block;height:2.2em;}
#newest li a span b {font-weight:normal;display:block;font-style:italic;}
/* @group Player styles */
#jplayer_info {font-size:0.7em;}
#player_container {
	position: relative;
	background-color:#eee;
	width:auto;
	height:80px;
	border:1px solid #009be3;
	border-radius:8px;-webkit-border-radius:8px;-moz-border-radius:8px;
}
#player_container  ul#player_controls {
	list-style-type:none;
	padding:0;
	margin: 0;
}
#player_container  ul#player_controls li {
	overflow:hidden;
	text-indent:-9999px;
}
#player_play,
#player_pause {
	display: block;
	position: absolute;
	left:48px;
	top:20px;
	width:40px;
	height:40px;
	cursor: pointer;
}
#player_play {
	background: url("images/spirites.jpg") 0 0 no-repeat;
}
#player_play.jqjp_hover {
	background: url("images/spirites.jpg") -41px 0 no-repeat;
}
#player_pause {
	background: url("images/spirites.jpg") 0 -42px no-repeat;
}
#player_pause.jqjp_hover {
	background: url("images/spirites.jpg") -41px -42px no-repeat;
}

#ctrl_prev {
	position: absolute;
	left:20px;
	top:26px;
	background: url("images/spirites.jpg") 0 -112px no-repeat;
	width:28px;
	height:28px;
	cursor: pointer;
}

#ctrl_prev:hover {
	background: url("images/spirites.jpg") -29px -112px no-repeat;
}

#ctrl_prev.disabled {
	background: url("images/spirites.jpg") -58px -112px no-repeat;
	cursor:default;
}

#ctrl_next {
	position: absolute;
	left:88px;
	top:26px;
	background: url("images/spirites.jpg") 0 -141px no-repeat;
	width:28px;
	height:28px;
	cursor: pointer;
}

#ctrl_next:hover {
	background: url("images/spirites.jpg") -29px -141px no-repeat;
}

#ctrl_next.disabled {
	background: url("images/spirites.jpg") -58px -141px no-repeat;
	cursor:default;
}


#player_stop {
	position: absolute;
	left:126px;
	top:26px;
	background: url("images/spirites.jpg") 0 -83px no-repeat;
	width:28px;
	height:28px;
	cursor: pointer;
}
#player_stop.jqjp_hover {
	background: url("images/spirites.jpg") -29px -83px no-repeat;
}
#player_progress {
	position: absolute;
	left:40%;
	top:32px;
	background-color: #eee;
	width:122px;
	height:15px;
}
#player_progress_load_bar {
	background: url("images/bar_load.gif")  top left repeat-x;
	width:0px;
	height:15px;
	cursor: pointer;
}
#player_progress_load_bar.jqjp_buffer {
	background: url("images/bar_buffer.gif")  top left repeat-x;
}
#player_progress_play_bar {
	background: url("images/bar_play.gif") top left repeat-x ;
	width:0px;
	height:15px;
}
#player_volume_min {
	position: absolute;
	right:90px;
	top:32px;
	background: url("images/spirites.jpg") 0 -170px no-repeat;
	width:18px;
	height:15px;
	cursor: pointer;
}

#player_volume_max {
	position: absolute;
	right:10px;
	top:32px;
	background: url("images/spirites.jpg") 0 -186px no-repeat;
	width:18px;
	height:15px;
	cursor: pointer;
}

#player_volume_min.jqjp_hover {
	background: url("images/spirites.jpg") -19px -170px no-repeat;
}

#player_volume_max.jqjp_hover {
	background: url("images/spirites.jpg") -19px -186px no-repeat;
}

#player_volume_bar {
	position: absolute;
	right:40px;
	top:37px;
	background: url("images/volume_bar.gif") repeat-x top left;
	width:46px;
	height:5px;
	cursor: pointer;
}
#player_volume_bar_value {
	background: url("images/volume_bar_value.gif") repeat-x top left;
	width:0px;
	height:5px;
}

#play_time,
#total_time {
	position: absolute;
	left:40%;
	top:49px;
	width:122px;
	font-size:.8em;
	font-style:oblique;
}

#total_time {
	text-align: right;
}

#playlist_list {
	width:auto;
	
}

#playlist_list ul{
	list-style-type:none;
	padding:10px 20px 20px 20px;
	margin:10px 0;
	background-color:#ccc;
	border:1px solid #009be3;
	width:auto;
	font-size:.9em;border-radius:8px;-webkit-border-radius:8px;-moz-border-radius:8px;
}

#playlist_list li{
	padding:4px 0 4px 20px;
	border-bottom:1px solid #eee;
	cursor: pointer;
}

#playlist_list li.playlist_current{
	color:#0d88c1;
	list-style-type:square;
	list-style-position:inside;
	padding-left:6px;
	cursor: default;
}

#playlist_list li.playlist_hover {
	color:#0d88c1;
}
/* @end */

@media screen and (max-device-width: 480px)

{
	.notForMobile, #newMixDetails {display:none;}
	h1 {font-size:4em;}
	h2 {font-size:1.5em;}
	#preamble {font-size:2em;}
	#player, #mixDetails {font-size:3em;float:none;width:auto;}
	#player p, #mixDetails p {font-size:1em;}
	#newest a.oggLink {display:none;}
	#newest a.mp3Link {font-size:1.5em;}
	#newest h3 {width:auto;}
	#newest h3 a.toggler {font-size:40px;}
	pre {font-size:30px;}
	#older li a {font-size:35px;font-weight:bold;}
}