/* --------------------------------------------- */

/* Author: http://codecanyon.net/user/CodingJack */

/* --------------------------------------------- */



html, body {



	width: 100%;

	height: 100%;

	

}



body {



	margin: 0;

	padding: 0;

	

	font: 13px 'Metrophobic', sans-serif;

	color: #555;



	background: #000 url(../img/audio_poster.jpg);

	

}



.wrapper {

	

	width: 100%;

	height: 100%;

	

	display: table;

	text-align: center;

	margin: 0;

	padding: 0;

	

}



.holder {

	

	display: table-cell;

	text-align: center;

	vertical-align: middle;

	margin: 0;

	padding: 0;

	

}



/* The main plugin wrapper */

.cj-music-player {

	

	display: inline-block;	

	text-align: left;

	line-height: 12px;

	

}



.cj-flash {

	

	height: 0;

	line-height: 0;

	overflow: hidden;

	

}



/* The main player wrapper */

.cj-music-container {

	

	width: 172px;

	height: 32px;

	overflow: hidden;

	white-space: nowrap;

	position: relative;

	

	-webkit-border-radius: 12px;

	-moz-border-radius: 12px;

	border-radius: 12px;

	

	border: 2px solid #FFF;

	border-bottom: 2px solid #F5F5F5;

	

	background: #FFF url(../img/graphics/music/ie_ctrl.png) repeat-x; 

	background: -moz-linear-gradient(top, #EEE 0%, #FFF 99%); 

	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #EEE), color-stop(99%, #FFF)); 

	background: -webkit-linear-gradient(top, #EEE 0%, #ffffff 99%); 

	background: -o-linear-gradient(top, #EEE 0%, #FFF 99%); 

	background: -ms-linear-gradient(top,  #EEE 0%, #FFF 99%); 

	background: linear-gradient(top, #EEE 0%, #FFF 99%); 



	-moz-box-shadow: 0px 2px 5px #333;

    -webkit-box-shadow: 0px 2px 5px #333;

    box-shadow: 0px 2px 5px #333;

	filter: progid:DXImageTransform.Microsoft.Shadow(Direction=180, Strength=3, Color="#333333");

	

}



/* The text and controls */ 

.cj-music-content {



	padding: 0 7px 0 11px;

		

}



/* The current song number and title */

.cj-music-meta {



	float: left;

	

}



/* The meta tag containers */

.cj-music-meta p {

	

	position: absolute;

	top: 10px;

	margin: 0;

	

}



/* The 1px vertical dividers */

.cj-music-meta .cj-divider {

	

	position: absolute;

	top: 0;

	display: block;

	height: 33px;

	

	border-left: 1px solid #FFF;

	border-right: 1px solid #DDD;

	

}



/* The first divider */

.cj-divider-one {

	

	left: 42px;

	

}



/* The second divider */

.cj-divider-two {

	

	left: 134px;

	

}



/* The current song text */

.cj-current-song {



	width: 112px;

	height: 28px;

	overflow: hidden;

	

}



/* The play, pause, left and right buttons */

.cj-music-controls {

	

	float: right;

	padding: 6px 2px 0 0;

	

	-webkit-user-select: none;

	-moz-user-select: none;

	-o-user-select: none;

	user-select: none;

	

}



/* Each button exists inside a span tag */

.cj-music-controls-btn {

	

	width: 18px;

	height: 18px;

	

	cursor: pointer;

	display: block;

	position: relative;

	

	-webkit-border-radius: 11px;

	-moz-border-radius: 11px;

	border-radius: 11px;

	

	border: 1px solid #D5D5D5;

	border-bottom: 1px solid #CCC;

	

	-moz-box-shadow: inset 0 0 3px #FFF;

    -webkit-box-shadow: inset 0 0 3px #FFF;

    box-shadow: inset 0 0 3px #FFF;

	

	background: #DDD url(../img/graphics/music/ie_btn.png);

	background: -moz-linear-gradient(top, #FFF 0%, #DDD 99%); 

	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #FFF), color-stop(99%, #DDD)); 

	background: -webkit-linear-gradient(top,  #FFF 0%, #DDD 99%); 

	background: -o-linear-gradient(top, #FFF 0%, #DDD 99%); 

	background: -ms-linear-gradient(top, #FFF 0%, #DDD 99%); 

	background: linear-gradient(top, #FFF 0%, #DDD 99%); 



}



.cj-music-controls .cj-music-play-icon {



	display: block;

	margin: 4px 0 0 7px;

	

	width: 0; 

	height: 0; 

	border-top: 5px solid transparent;

	border-bottom: 5px solid transparent;

	border-left: 6px solid #999;

	

}



.cj-music-controls .cj-music-pause-icon:before,

.cj-music-controls .cj-music-pause-icon:after {

	

	content: "";

	position: absolute;

	top: 5px;

	left: 6px;

	

	border: 1px solid #999;

	height: 6px;

	

}



.cj-music-controls .cj-music-pause-icon:before {



	left: 10px;

	

}



/* Hyperlinks */

.cj-music-player a {



	color: #555;

	text-decoration: none;

	outline: none;

	

}



/* Hyperlink visited */

.cj-music-player a:visited {



	color: #555;

	

}



/* Hyperlink mouse over */

.cj-music-player a:hover {



	color: #777;

	

}



@media screen and (max-width: 600px) {



	.cj-music-container {

	

		margin: -11px 0 0 10px;

		

	}

	

}