* {
	-webkit-box-sizing: border-box;
       -moz-box-sizing: border-box;
         -o-box-sizing: border-box;
        -ms-box-sizing: border-box;
            box-sizing: border-box;
}

body {
	user-select:none;
-moz-user-select:none;
-webkit-user-select:none;
-webkit-user-drag:none;
-khtml-user-select:none;
-khtml-user-drag:none;
width:100%;
height:auto;
/*background: url(../../common/img/public/bg.jpg) no-repeat center top  #000;*/
background-size:100%;
background-attachment:fixed;
background:#000;

}

#wrapper { width:96%; height:auto; padding:20px 0; max-width:650px; margin:0 auto;}
.ttw-music-player {
	width:94%;
	height:auto;
	   margin: 0 auto;
    font-family:"Rufina","Lucida Sans Unicode", "Lucida Grande", sans-serif !Important;
	background-color: #fff;
	background-color: rgba(255,255,255,.2) ;
	padding:15px;
	border-radius: 2px;
    -moz-border-radius: 2px;
    -webkit-border-radius: 2px;
	  box-shadow: 1px 2px 4px rgba(0, 0, 0, .3) inset;
    -moz-box-shadow: 1px 2px 4px rgba(0, 0, 0, .3) inset;
    -webkit-box-shadow: 1px 2px 4px rgba(0, 0, 0, .3) inset;
	
	
}

.ttw-music-player .player {
    width: 100%;
	position:relative;
	overflow:hidden;
	
}


@media print, screen and (min-width:641px){
.ttw-music-player .player::before {
	background-image:url(../../common/img/public/sp_header.png) ;
	background-repeat:no-repeat;
	background-size:100%;
	content:'';
  position: absolute;
  top: 60%;
  right:-3%;
  width: 70%;
  height: 70%;
  -webkit-transform-origin: left center;
  -ms-transform-origin: left center;
  transform-origin: left center;
  -webkit-transform: rotate(-15deg);
  -ms-transform: rotate(-15deg);
  transform: rotate(-15deg);
  z-index: -1;
  filter: alpha(opacity=20); -moz-opacity:.2; opacity:.2;
}
}

@media print, screen and (max-width:640px){
.ttw-music-player .player::before {
	background-image:url(../../common/img/public/sp_header.png) ;
	background-repeat:no-repeat;
	background-size:100%;
	content:'';
  position: absolute;
  top: 30%;
  right:-7%;
  width: 55%;
  height: 55%;
  -webkit-transform-origin: left center;
  -ms-transform-origin: left center;
  transform-origin: left center;
  -webkit-transform: rotate(-15deg);
  -ms-transform: rotate(-15deg);
  transform: rotate(-15deg);
  z-index: -1;
  filter: alpha(opacity=20); -moz-opacity:.2; opacity:.2;
}
}

/** Album Cover **/
.ttw-music-player .album-cover {
    position: relative;
    background: #000 url(../images/album-cover-bg.jpg) no-repeat 0 0 scroll;;
    box-shadow: 0px 1px 4px rgba(0, 0, 0, .75);
    -moz-box-shadow: 0px 1px 4px rgba(0, 0, 0, .75);
    -webkit-box-shadow: 0px 1px 4px rgba(0, 0, 0, .75);
	
}
@media print, screen and (min-width:641px){
.ttw-music-player .album-cover {
	max-width:150px;
	width:25%;
	margin:0 5% 20px 0;
	float: left;
	}
}

@media print, screen and (max-width:640px){
.ttw-music-player .album-cover {
 	width:30%;
	margin:0 5% 5% 0;
	max-height:150px;
	height:auto;
}	
}

.ttw-music-player .album-cover .img {
    box-shadow: inset 0 0 1px rgba(255, 255, 255, .6);
    -moz-box-shadow: inset 0 0 1px rgba(255, 255, 255, .6);
    -webkit-box-shadow: inset 0 0 1px rgba(255, 255, 255, .6);
    background-position:center center;
    background-repeat:no-repeat;
    background-color:transparent;
}

.ttw-music-player .album-cover img {border:1px solid #000;}

.ttw-music-player .album-cover .highlight {
    background: transparent url(../js/images/album-cover-highlight.png) no-repeat 0 0 scroll;
    opacity: 1;

}

.ttw-music-player .album-cover:hover .highlight {
    opacity: 1;
}

.ttw-music-player .album-cover,
.ttw-music-player .album-cover .img,
.ttw-music-player .album-cover .highlight {
    display: block;
     height:auto;
   

}
.ttw-music-player .album-cover img,
.ttw-music-player .album-cover .img,
.ttw-music-player .album-cover .highlight {
    position: absolute;
    top: 0;
    left: 0;
		
}

@media print, screen and (min-width:641px){
.ttw-music-player .album-cover,
.ttw-music-player .album-cover .img,
.ttw-music-player .album-cover .highlight {
	 width: 125px;
	min-height:109px;
	max-height:120px;
	}
	
.ttw-music-player .album-cover img,
.ttw-music-player .album-cover .img,
.ttw-music-player .album-cover .highlight {
     width:125px;
	 height:auto;
	 min-height:109px;
}

}

@media print, screen and (max-width:640px){
.ttw-music-player .album-cover,
.ttw-music-player .album-cover .img,
.ttw-music-player .album-cover .highlight {
 	width:125px;
	height:auto;
	min-height:109px;
	max-height:120px;
	}	
	
	
.ttw-music-player .album-cover img,
.ttw-music-player .album-cover .img,
.ttw-music-player .album-cover .highlight {
     width:100%;
	 height:auto;
	min-height:109px;
	max-height:120px;
	
}
}



/** Track Info **/
.ttw-music-player .track-info { }

@media print, screen and (min-width:641px){
.ttw-music-player .track-info {	width:58%;	float: left; font-size: 12px;}
}

@media print, screen and (max-width:640px){
.ttw-music-player .track-info {width:100% !important;  font-size: 10px !important; }

}



.ttw-music-player .track-info p {
    margin: 0 0 0px 0;
}

.ttw-music-player .player .title {
    color: #f20;
    font-weight: bold;
	position:relative;
	padding-left:15px;
}

@media print, screen and (min-width:641px){
.ttw-music-player .player .title { font-size: 14px;}
.ttw-music-player .player .title:after {
position: absolute;
	top: 7px;
	left: 5px;
	display: block;
	content: '';
	width: 0px;
	height: 0px;
	margin-top: -4px;
	border-left: 6px solid #f20;
	border-right: 6px solid transparent;
	border-bottom: 6px solid transparent;
	border-top: 6px solid transparent;	
	
}
.ttw-music-player .artist-outer {color: #fff; font-style: italic; font-size:11px;}

}

@media print, screen and (max-width:640px){
.ttw-music-player .player .title { font-size: 12px;}
.ttw-music-player .player .title:after {
position: absolute;
	top: 7px;
	left: 5px;
	display: block;
	content: '';
	width: 0px;
	height: 0px;
	margin-top: -4px;
	border-left: 6px solid #f20;
	border-right: 6px solid transparent;
	border-bottom: 6px solid transparent;
	border-top: 6px solid transparent;	
	
}
.ttw-music-player .artist-outer {color: #fff; font-style: italic; font-size:10px;}

}


.ttw-music-player .artist { color: #fff; margin-left: 4px;}
.ttw-music-player .rating {width: 75px;  height: 16px; display:none;}

.ttw-music-player .rating-star {
    width: 15px;
    height: 16px;
    display: block;
    float: left;
    background: transparent url(../images/rating-off.png) no-repeat center center scroll;
    cursor: pointer;
	display:none;
}

.ttw-music-player .rating-star:hover,
.ttw-music-player .rating-star.on,
.ttw-music-player .rating-star.hover {background: transparent url(../images/rating-on.png) no-repeat center center scroll;}


/** Player **/
.ttw-music-player .player-controls {
    border-radius: 3px;
    -moz-border-radius: 3px;
    -webkit-border-radius: 3px;
    background:url(../js/images/player-bg.png) repeat 0 0 scroll;
	background:#d20101;
	background:rgba(210,1,1,.6);
    margin-top: 10px;
	 box-shadow: inset -1px 0px 20px rgba(0, 0, 0, .2);
    -moz-box-shadow: inset -1px 0px 20px rgba(0, 0, 0, .2);
    -webkit-box-shadow: inset -1px 0px 20px rgba(0, 0, 0, .2);
}

.ttw-music-player .player-controls .main { margin: 9px 9px;}

@media print, screen and (min-width:641px){
.ttw-music-player .player-controls { width: 70%; height: 30px; float: left;}
.ttw-music-player .player-controls .main { width: 80px; height: 12px; float: left;}
.ttw-music-player .previous, .ttw-music-player .next { margin: 1px 0;}
.ttw-music-player .play, .ttw-music-player .pause { margin: 0px 8px;}
.ttw-music-player .previous, .ttw-music-player .next { height: 10px;   width: 15px;}
}

@media print, screen and (max-width:640px){
.ttw-music-player .player-controls {width: 100% !important; height: 30px; position:relative;}
.ttw-music-player .player-controls .main {width: 50% !important; height: 30px;}
.ttw-music-player .previous, .ttw-music-player .next { margin: 1px 0;}
.ttw-music-player .play, .ttw-music-player .pause { margin: 0px 30px 0px;}
.ttw-music-player .previous, .ttw-music-player .next { height: 10px;  width: 15px;}
}


.ttw-music-player .player-controls div {
    float: left;
    cursor: pointer;
}



.ttw-music-player .play, .ttw-music-player .pause { width: 8px; height: 12px;}

.ttw-music-player .previous {background: transparent url(../js/images/player-previous.png) no-repeat center center scroll;}

.ttw-music-player .next {background: transparent url(../js/images/player-next.png) no-repeat center center scroll;}
.ttw-music-player .play {background: transparent url(../js/images/player-play.png) no-repeat center center scroll;}
.ttw-music-player .pause {background: transparent url(../js/images/player-pause.png) no-repeat center center scroll;}


.ttw-music-player .progress-wrapper { background: transparent url(../js/images/player-progress.png) repeat-x 0 0 scroll;}

.ttw-music-player .progress { cursor: pointer;}


@media print, screen and (min-width:641px){
.ttw-music-player .progress-wrapper {
    height: 9px;
    width: 70%;
    float: left;
    margin: 11px 5px 10px 0;
}

.ttw-music-player .progress {
    height: 9px;
    width: 100%;
}
.ttw-music-player .tracklist {margin-top:10px;}
}

@media print, screen and (max-width:640px){
.ttw-music-player .progress-wrapper {
	position:absolute !important;
	top:38%  !important;
	right:10px  !important;
    height: 9px;
    width: 55%  !important;
}

.ttw-music-player .progress {
    height: 9px;
    width: 100%;
}

.ttw-music-player .tracklist li {font-size:12px !important;}
}


.ttw-music-player .elapsed {
    height: 6px;
    border-radius: 3px;
    -moz-border-radius: 3px;
    -webkit-border-radius: 3px;
    margin: 1px;
    width: 60%;
    background: transparent url(../js/images/player-elapsed.png) repeat-x 0 0 scroll;
}

.ttw-music-player .unused-controls {display: none !important;}

/** Description **/
.ttw-music-player .description {
    clear: both;
    margin: 30px 0 0 0;
    font-size: 12px;
    color: #fff;
    text-shadow: 0 1px 1px rgba(0, 0, 0, .6);
}

.ttw-music-player .description.showing{
    margin:30px 0;
}

/** Track List **/
.ttw-music-player .tracklist {
	   padding: 10px;
   
    border-radius: 4px;
    -moz-border-radius: 4px;
    -webkit-border-radius: 4px;
    background: url(../js/images/tracklist-bg.png) repeat 0 0 scroll;
	background: rgba(0,0,0,.6);
    color: #fff;
    font-size: 12px;
	/*height:50px;*/
	overflow:hidden;
	 box-shadow:  inset 2px 2px 4px rgba(0, 0, 0, .6) ;
    -moz-box-shadow:  inset 2px 2px 4px rgba(0, 0, 0, .6) ;
    -webkit-box-shadow:  inset 2px 2px 4px rgba(55, 55, 55, .2), -2px -2px 8px rgba(255, 255, 255, .3) inset;
}

.ttw-music-player .tracklist ol {
    margin: 0;
    padding: 0;
    overflow:hidden; 
	}

.ttw-music-player .tracklist li {
    background: transparent url(../js/images/tracklist-item-bg.png) repeat-x bottom left scroll;
    padding: 5px 0 5px 0;
    position: relative;
	border-bottom:1px solid #333;
	-webkit-transition: all 300ms linear;
    -moz-transition: all 300ms linear;
    -o-transition: all 300ms linear;
    -ms-transition: all 300ms linear;
    transition: all 300ms linear;
	list-style-type:none ;
		
	
}

.ttw-music-player .tracklist li:hover {color: #d20101; padding-left:15px;}

.ttw-music-player li:last-child{background: none;}

.ttw-music-player .show-more-button li:last-child{
    background: transparent url(../js/images/tracklist-item-bg.png) repeat-x bottom left scroll;
}



.ttw-music-player .tracklist .title {
    width: 85%;
    display: inline-block;
    padding: 0 0 0 10px;
    cursor: pointer;
}

.ttw-music-player li:nth-child(1n + 10) .title{
    padding-left:7px;
}

.ttw-music-player li.playing {
    color:#d20101 !important;
	padding-left:15px;
	position:relative;
	
}

.ttw-music-player li:after {
	position: absolute;
	top: 13px;
	left: 30px;
	display: block;
	content: '';
	width: 0px;
	height: 0px;
	margin-top: -4px;
	border-left: 5px solid #d20101;
	border-right: 5px solid transparent;
	border-bottom: 5px solid transparent;
	border-top: 5px solid transparent;
	filter: alpha(opacity=0); -moz-opacity:0; opacity:0;
	-webkit-transition: all 300ms linear;
    -moz-transition: all 300ms linear;
    -o-transition: all 300ms linear;
    -ms-transition: all 300ms linear;
    transition: all 300ms linear;
	z-index:2;
	
}

.ttw-music-player li:hover:after {
	filter: alpha(opacity=100); -moz-opacity:1; opacity:1;
	left: 10px;
	
}


.ttw-music-player li.playing:after {
	filter: alpha(opacity=100); -moz-opacity:1; opacity:1;
	left: 10px;
	
}



.ttw-music-player .tracklist .rating {
    margin-left: 10px;
    width: 30px;
   display:none;
    position: absolute;
    right: 72px;
    top: 12.5px;
}

.ttw-music-player .rating-bar {
	display:none;
    height: 10px;
    width: 3px;
    display: block;
    float: left;
    cursor: pointer;
    background: transparent url(../js/images/rating-bar.png) no-repeat 0 0 scroll;
}

.ttw-music-player .rating-bar.on,
.ttw-music-player .rating-bar:hover,
.ttw-music-player .rating-bar.hover {
    background: transparent url(../js/images/rating-bar-on.png) no-repeat 0 0 scroll;
}

.ttw-music-player .buy {
	display:none;
    width: 62px;
    height: 16px;
    display: inline-block;
    position: absolute;
    top: 9px;
    right: 0;
    border-radius: 8px;
    -moz-border-radius: 8px;
    -webkit-border-radius: 8px;
    background: transparent url(../js/images/buy-bg.png) repeat 0 0 scroll;
    margin: 0 0 0 10px;
    font-size: 10px;
    text-align: center;
    line-height: 16px;
    text-shadow: none;
    color: #fff;
    text-decoration: none;
}

.ttw-music-player .buy:hover {color: #eee;}
.ttw-music-player .buy.not-active{ display:none;}

.ttw-music-player .more {
	display:block;
    font-style: italic;
    font-size: 11px;
    padding: 5px 0;
    cursor: pointer;
    border-radius: 6px;
    -moz-border-radius: 6px;
    -webkit-border-radius: 6px;
	text-align:center;
	width:20%;
	margin:0 auto !important;
}

.ttw-music-player .more:hover {
    color: #f20;
   
}

.ttw-music-player .show-more-button .more{ display:block;}


/** Transitions **/
.ttw-music-player .more,
.ttw-music-player .album-cover .highlight,
.ttw-music-player .tracklist li,
.ttw-music-player .buy {
    -webkit-transition: all 0.5s ease;
    -moz-transition: all 0.5s ease;
    -o-transition: all 0.5s ease;
    transition: all 0.5s ease;
}

/* http://perishablepress.com/press/2009/12/06/new-clearfix-hack */
.ttw-music-player .player:after {
    clear: both;
    content: ' ';
    display: block;
    font-size: 0;
    line-height: 0;
    visibility: hidden;
    width: 0;
    height: 0;
}

.description {display:none;}

