::-webkit-scrollbar {
  width: 8px;
  height: 8px;
}

::-webkit-scrollbar-button {
  width: 0px;
  height: 0px;
}

::-webkit-scrollbar-thumb {
  background: #c0c0c0;
  border: 0px none #ffffff;
  border-radius: 12px;
}

::-webkit-scrollbar-thumb:hover {
  background: #c0c0c0;
}

::-webkit-scrollbar-thumb:active {
  background: #c0c0c0;
}

::-webkit-scrollbar-track {
  background: #ffffff;
  border: 0px none #ffffff;
  border-radius: 45px;
}

::-webkit-scrollbar-track:hover {
  background: #ffffff;
}

::-webkit-scrollbar-track:active {
  background: #ffffff;
}

::-webkit-scrollbar-corner {
  background: transparent;
}

::-webkit-input-placeholder {
  color: #b0b0b0;
}

:-moz-placeholder {
  /* Firefox 18- */
  color: #b0b0b0;
}

::-moz-placeholder {
  /* Firefox 19+ */
  color: #b0b0b0;
}

:-ms-input-placeholder {
  color: #b0b0b0;
}

.placeholder-style {
  color: #b0b0b0;
}

#loginHidden {
  width: 1px;
  height: 1px;
  overflow: hidden;
  position: absolute;
}

.placeholder {
  /*color: #b0b0b0; */
  color: #ffffff;
}

.left {
  float: left;
}

.right {
  float: right;
  margin-top: 2px;
}

.arrow {
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 6px 4px 0 4px;
  border-color: #a1a1a1 transparent transparent transparent;
}

#debug {
  position: fixed;
  top: 20px;
  left: 20px;
  padding: 10px;
  background-color: #ffffff;
  color: red;
  font-size: 20px;
  z-index: 10000;
}

body {
  overflow-x: hidden !important;
  background-color: #000000;
  font-size: 1em;
  min-width: 990px;
  height: 100%;
	font-family: Helvetica Neue, Helvetica, Arial, Tahoma, sans-serif, 微軟正黑體, 微软正黑体, 'Microsoft JhengHei', 微軟雅黑體, 微软雅黑体, 'Microsoft YaHei', 華文黑體, 华文黑体, STHeiti, 華文細黑, 华文细黑, STXihei, '儷黑 Pro', 'LiHei Pro';
}

a {
  color: #fff;
  outline: none;
}

#shadow {
  position: absolute;
  top: 0;
  left: 0;
  height: 100%;
  width: 100%;
  background-color: #000000;
  opacity: 0.6;
}

.container {
  margin: 0 auto;
  min-width: 998px;
  max-width: 1440px;
  width: 100%;
  min-height: 100%;
  position: relative;
}

.element-c {
  left: 0;
  float: left;
  z-index: 1;
  width: 100%;
  background-color: rgba(255, 255, 255, 0.7);
}

#bg .banner {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  z-index: -100;
  border: 2px solid red;
  min-width: 998px;
  text-align: center;
}

.banner.hide {
  display: none;
}

.banner.landing {
  min-height: 720px;
}

.banner img {
  max-width: 1440px;
}

.footer {
  position: absolute;
  bottom: 0;
  left: 0;
  z-index: 2;
  width: 100%;
  height: 100px;
  background-color: rgb(222, 222, 222);
}

.h_c {
  position: fixed;
  float: left;
  z-index: 997;
  width: inherit;
  height: 73px;
  min-width: 998px;
  max-width: 1440px;
  background-image: url('../images/top_background.png');
  background-repeat: repeat-x;
  background-size: auto auto;
  background-position: left top;
}

#header {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  z-index: 6;
  width: 93.4%;
  max-width: 1400px;
  min-width: 998px;
  height: 73px;
  margin: 0 auto;
}

#search {
  left: 0;
  right: 0;
  width: 260px;
  height: 30px;
  padding-top: 5px;
  float: left;
  margin-left: 40px;
}

#searchIcon {
  width: 22px;
  height: 22px;
  float: right;
  margin-top: 15px;
  cursor: pointer;
  opacity: 0.7;
}

#searchIcon:hover {
  opacity: 1;
}

._input {
  color: #ffffff;
  display: block;
  clear: both;
  width: 100%;
  height: 36px;
  padding: 0 0 0 44px;
  border: 1px solid rgba(255, 255, 255, 1);
  -webkit-border-radius: 5px;
  -moz-border-radius: 5px;
  border-radius: 5px;
  background: url('../images/icon_search.png') rgba(0, 0, 0, 0.5);
  background-repeat: no-repeat;
  background-size: auto auto;
  background-position: 12px 50%;
  /*font: 400 0.813em/1.38 Helvetica;*/
  font-family: Arial, Helvetica;
  overflow: hidden;
  font-size: 18px;
  opacity: 1;
}

._input::-webkit-input-placeholder {
  color: #a1a1a1;
}

._input:-moz-placeholder {
  /* Firefox 18- */
  color: #a1a1a1;
}

._input::-moz-placeholder {
  /* Firefox 19+ */
  color: #a1a1a1;
}

._input:-ms-input-placeholder {
  /*color: #a1a1a1;  */
}

#searchLayer {
  margin: 80px auto;
  position: fixed;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  width: 680px;
  z-index: 13001;
  display: none;
}

#searchLeftInside {
  float: left;
  width: 100%;
}

#searchBox .title {
  width: 100%;
  float: left;
  height: 28px;
}

#regionArtist {
  width: 100%;
  float: left;
}

#searchHistory {
  width: 100%;
  margin-bottom: 24px;
  float: left;
}

#searchHistory>div {
  padding: 8px 0px;
  float: left;
  width: 100%;
  font-size: 18px;
}

#searchLayer .close {
  background: url("/images/icon/close.png") no-repeat;
  background-size: cover;
  width: 32px;
  height: 32px;
  position: absolute;
  right: -48px;
  top: -48px;
  cursor: pointer;
  opacity: 0.7;
}

#searchLayer .close:hover {
  opacity: 1;
}

#searchLayer .nopredictive:hover {
  text-decoration: underline;
}

#searchHistory .history div {
  width: 622px;
  text-overflow: ellipsis;
  overflow: hidden;
  white-space: nowrap;
}

#clearSearchHistory {
  cursor: pointer;
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  border-radius: 3px;
  padding: 6px 10px;
  border: 1px solid #ffffff;
  min-width: 116px;
  text-align: center;
  color: #ffffff;
}

#clearSearchHistory:hover {
  border: 1px solid #39d1b3;
  color: #39d1b3;
}

#viewArtistsCat {
  cursor: pointer;
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  border-radius: 3px;
  padding: 6px 10px;
  color: #ffffff;
  background-color: #39d1b3;
  min-width: 116px;
  text-align: center;
}

#viewArtistsCat:hover {
  background-color: #27bb9d;
}

.searchRightArtist {
  margin: 24px 13px 24px 0px;
  float: left;
  width: 102px;
}

.searchRightArtist p {
  font-size: 14px;
  color: #ffffff;
  text-align: center;
  margin-top: 114px;
}

.artistF {
  margin-top: 10px;
}

.searchRightArtist img, .searchRightArtist .artist {
  -webkit-border-radius: 50%;
  -moz-border-radius: 50%;
  border-radius: 50%;
  position: absolute;
  width: 102px;
  height: 102px;
}

.searchRightArtist .artist:after {
  border: 1px solid rgba(255, 255, 255, 0.2);
  content: '';
  position: absolute;
  border-radius: 50%;
  top: 0px;
  bottom: 0px;
  left: 0px;
  right: 0px;
  z-index: 100;
}

.searchRightArtist:hover p {
  text-decoration: underline;
}

#dimLayer, #dimLayerAlert {
  position: fixed;
  background-color: rgba(0, 0, 0, 0.8);
  width: 100%;
  height: 100%;
  z-index: 13000;
  top: 0;
}

#dimLayerCustom #close {
  position: absolute;
  top: 7%;
  left: 90%;
  cursor: pointer;
  width: 42px;
}

#dimLayerCustom, #dimLayerCustomAlert {
  position: fixed;
  background-color: rgba(0, 0, 0, 0.8);
  width: 100%;
  height: 100%;
  z-index: 13000;
  top: 0;
}

#dimLayerCustom #close {
  position: absolute;
  top: 7%;
  left: 90%;
  cursor: pointer;
  width: 42px;
}

#frameLayer #close {
  position: absolute;
  left: 110%;
  cursor: pointer;
  width: 42px;
  z-index: 1500;
}

.upgradeframeLayer1 {
  height: 510px !important;
  background-image: -webkit-linear-gradient(-135deg, rgba(18, 149, 133, 1) 0%, rgba(5, 92, 80, 1) 32%, rgba(10, 53, 46, 1) 65%, rgba(8, 34, 29, 1) 100%);
  background-image: -moz-linear-gradient(-135deg, rgba(18, 149, 133, 1) 0%, rgba(5, 92, 80, 1) 32%, rgba(10, 53, 46, 1) 65%, rgba(8, 34, 29, 1) 100%);
  background-image: -o-linear-gradient(-135deg, rgba(18, 149, 133, 1) 0%, rgba(5, 92, 80, 1) 32%, rgba(10, 53, 46, 1) 65%, rgba(8, 34, 29, 1) 100%);
  background-image: linear-gradient(-135deg, rgba(18, 149, 133, 1) 0%, rgba(5, 92, 80, 1) 32%, rgba(10, 53, 46, 1) 65%, rgba(8, 34, 29, 1) 100%);
  background-color: black;
  position: relative;
}

.upgradeframeLayer1 .splashIn1 {}

.upgradeframeLayer1>div:last-child {
  position: absolute;
  bottom: 20px;
  left: 0;
  right: 0;
  text-align: center
}

.upgradeframeLayer1 .splashbg {
  cursor: pointer;
  width: 520px;
  height: 500px;
}

.upgradeframeLayer1 .splashbg2 {
  cursor: pointer;
  width: 520px;
  height: 410px;
}

.upgradeframeLayer1 .splashInbg {
  position: absolute;
  height: 170px;
  width: 100%;
  bottom: 0px;
  background-image: rgba(255, 255, 255, 1);
  background-image: -moz-linear-gradient(top, rgba(255, 255, 255, 0) 0%, rgba(0, 0, 0, 1) 30%, rgba(0, 0, 0, 1) 100%);
  background-image: -webkit-gradient(left top, left bottom, color-stop(0%, rgba(255, 255, 255, 0)), color-stop(30%, rgba(0, 0, 0, 1)), color-stop(100%, rgba(0, 0, 0, 1)));
  background-image: -webkit-linear-gradient(top, rgba(255, 255, 255, 0) 0%, rgba(0, 0, 0, 1) 30%, rgba(0, 0, 0, 1) 100%);
  background-image: -o-linear-gradient(top, rgba(255, 255, 255, 0) 0%, rgba(0, 0, 0, 1) 30%, rgba(0, 0, 0, 1) 100%);
  background-image: -ms-linear-gradient(top, rgba(255, 255, 255, 0) 0%, rgba(0, 0, 0, 1) 30%, rgba(0, 0, 0, 1) 100%);
  background-image: linear-gradient(to bottom, rgba(255, 255, 255, 0) 0%, rgba(0, 0, 0, 1) 30%, rgba(0, 0, 0, 1) 100%);
}
.upgradeframeLayer1.default{
	text-align:center;
	background:none;
	height:510px;
	font-weight:200;
}
.upgradeframeLayer1.default > div:first-child{
	background-color:#39D1B3;
	height:105px;
	margin-top:83px;
	position:relative;
}
.upgradeframeLayer1.default > div:first-child img{
	position:relative;
	width:229px;
	top:-83px;
}

.upgradeframeLayer1.default > div:first-child img.retention{
	position:relative;
	width:229px;
	top:-70px;
}

.upgradeframeLayer1.default .feature{
	background-color:#ffffff;
	height:322px;
	font-size:16px;
	color:#a1a1a1;
	display:flex;
	align-items:center;
	flex-direction:column;
	line-height:24px;
}
.upgradeframeLayer1.default .feature  > div:first-child{
	font-size:20px;
	padding:14px;
	color:#555555;
	line-height:28px;
	font-weight:400;
}
.upgradeframeLayer1.default .feature  > div:last-child{
	line-height:20px;
}

.upgradeframeLayer1.default .feature ul{
	padding:5px 8px 5px 43px;

}
.upgradeframeLayer1.default .feature li{
	text-align:left;
	padding:5px;
	position:relative;
}


.upgradeframeLayer1.default .feature li:before{
  content: "";
  width: 20px;
  height: 20px;
  left: -28px;
  position: absolute;
  background: url(/images/ico_popup_upgrade_check.png);
  background-size:cover;
	
}

.iePopup>div:last-child {
  top: 36px;
  position: absolute;
  text-align: center;
  color: #ffffff;
  width: 400px;
  left: 60px;
}

.iePopup>div:last-child .title {
  font-weight: bold;
  line-height: 29px;
  font-size: 24px;
}

.iePopup>div:last-child .desc {
  font-size: 14px;
  line-height: 19px;
  text-align: center;
  margin-top: 8px;
}

.iePopup>div:last-child .desc a {
  color: #39d1b3;
}

.iePopup>div:last-child .chrome, .iePopup>div:last-child .edge, .iePopup>div:last-child .firefox {
  width: 48px;
  height: 48px;
  margin: 24px 12px;
  float: left;
  background-size: cover;
}

.iePopup>div:last-child .chrome {
  background-image: url('/images/btn_chrome_go.png');
  margin-left: 104px;
}

.iePopup>div:last-child .edge {
  background-image: url('/images/btn_edge_go.png');
}

.iePopup>div:last-child .firefox {
  background-image: url('/images/btn_firefox_go.png');
}

.btn_popup_close {
  position: absolute;
  top: -45px;
  right: -52px;
  width: 30px;
  height: 30px;
  -webkit-filter: drop-shadow(0px 2px 4px rgba(0, 0, 0, 0.3));
  filter: drop-shadow(0px 2px 4px rgba(0, 0, 0, 0.3));
  cursor: pointer;
  opacity: 0.8;
  z-index: 100000;
}

.btn_popup_close_terminate {
  position: absolute;
  top: -45px;
  right: -52px;
  width: 30px;
  height: 30px;
  -webkit-filter: drop-shadow(0px 2px 4px rgba(0, 0, 0, 0.3));
  filter: drop-shadow(0px 2px 4px rgba(0, 0, 0, 0.3));
  cursor: pointer;
  opacity: 0.8;
  z-index: 100000;
}

.btn_popup_close:hover {
	opacity:1;
}

.btn_popup_close_terminate:hover {
	opacity:1;
}


.upgradeframeLayer1 .buttonsplashdiv {
  width: 100%;
  text-align: center;
}

.upgradeframeLayer1 .buttonsplash1 {
  padding:6px 0;
  font-size:14px;
  font-weight:200;
  line-height:20px;
  width: 296px;
  border: none;
  border-radius: 3px;
  color: white;
  background-color: rgba(57, 209, 179, 1)
}

.upgradeframeLayer1 .Line1 {
  width: 400px;
  text-align: center;
  margin: 0 auto;
}

.upgradeframeLayer1 .Line1a {
  margin: 12px auto 8px;
  width: 400px;
}

.upgradeframeLayer1 .Line2 {
  width: 400px;
  text-align: center;
  margin: 0 auto;
  padding-bottom: 8px;
}

.upgradeframeLayer1 .subline {
  vertical-align: bottom;
  /*min-height:40px;*/
  margin-top: 8px;
  width: 400px;
  line-height: 1.2em;
}

.upgradeframeLayer1 .buttonsplash2 {
  height: 28px;
  width: 296px;
  border: 1px solid white;
  border-radius: 3px;
  color: white;
  background-color: black
}

#searchBox {
  color: #ffffff;
  z-index: 998;
  float: left;
  padding: 24px 0px;
  width: 680px;
  min-height: 588px;
}

#searchBox>a>div {
  color: #ffffff;
  margin-bottom: 24px;
  text-overflow: ellipsis;
  overflow: hidden;
  white-space: nowrap;
}

#searchBox>div {
  margin-bottom: 24px;
}

#chanLang {
  float: right;
  text-align: right;
  color: #fff;
  margin: 10px 15px 0 0;
}

#user {
  float: right;
  text-align: right;
  color: #fff;
  margin: 10px 27px 0 16px;
  position: relative;
  display: none;
}

#user span {
  left: -5px;
  position: relative;
  margin-left: 15px;
}

#btnImportant {
  float: right;
  text-align: right;
  color: #fff;
  margin: 16px 27px 0 42px;
  position: relative;
  cursor: pointer;
}

#btnImportant:before {
  content: "";
  width: 16px;
  height: 16px;
  left: -24px;
  position: absolute;
  background: url(/images/notices.png);
}

#header .profile_pic {
  width: 25px;
}

#user img.down {
  position: absolute;
  top: 4px;
  width: 20px;
}

#user .profile_pic {
  width: 30px;
  -webkit-border-radius: 50%;
  -moz-border-radius: 50%;
  border-radius: 50%;
}

#user:hover .dropdown-menu {
  display: block;
}

#user .dropdown-menu {
  right: -49px;
  top: 27px;
  -webkit-border-radius: 10px;
  -moz-border-radius: 10px;
  border-radius: 10px;
  left: auto;
}

#user a {
  color: #a1a1a1;
}

#user a:hover, #user li:hover, .dropdown-menu a:hover, .dropdown-menu>li:hover {
  color: #555555;
}

#upgrade, #freeReg {
  float: right;
  color: #ffffff;
  padding: 5px 20px;
  background-color: #39D1B3;
  cursor: pointer;
  margin: 13px 0;
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  border-radius: 3px;
  font-size: 14px;
}

#upgrade:hover, #freeReg:hover {
  background-color: #27bb9d;
}

#upgradeNow {
  position: relative;
  color: #ffffff;
  padding: 10px 0px;
  background-color: #3ad0b3;
  cursor: pointer;
  -webkit-border-radius: 5px;
  -moz-border-radius: 5px;
  border-radius: 5px;
  bottom: 60px;
  left: 300px;
  width: 150px;
  text-align: center;
}

#frameLayer {
  margin: 80px auto;
  position: fixed;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  width: 520px;
  height: 90%;
  z-index: 13001;
  max-height: 614px;
}

#frameLayer.remainder {
  height: 560px;
}

#frameLayer.upgradeAlert {
  width: 480px;
  overflow: scroll;
  max-height: 600px;
}

#frameLayer.directPay {
  margin: 82px auto;
  position: absolute;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  width: 756px;
  height: 90%;
  max-height: 640px;
  z-index: 1000;
}

#frameLayer.safariTutor {
  margin: 82px auto;
  position: absolute;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  width: 680px;
  max-height: 640px;
  height: 580px;
}

#frameLayer #cslUpgradeFrame,
#frameLayer iframe {
  width: 520px;
  height: 100%;
  background-color: #ffffff;
  max-height: 640px;
  position: relative;
}

#frameLayer #loginFrame {
  width: 420px;
}

#frameLayer #safariTutor {
  width: 680px;
  height: 580px;
}

#frameLayer.directPay iframe {
  width: 756px;
  height: 700px;
  background-color: #ffffff;
}

#chanLang {
  float: right;
  text-align: right;
  color: #fff;
  margin: 10px 15px 0 0;
}

#chChi, #chEng {
  cursor: pointer;
  -webkit-border-radius: 10px;
  -moz-border-radius: 10px;
  border-radius: 10px;
}

.chChi, .chEng {
  background-color: #ffffff;
  color: #a1a1a1;
}

#top_submenu {
  float: right;
  text-align: right;
  color: #fff;
  margin-top: 7px;
}

#top_submenu.member {
  margin: 10px 0;
}

#top_submenu div {
  top: 7px;
  left: -5px;
  position: relative;
  margin-left: 26px;
}

#top_submenu span {
  cursor: pointer;
  padding: 5px 12px;
  margin: 0 4px;
}

#top_submenu #introduction:hover, #top_submenu #directPay:hover, #top_submenu #redeem:hover, #top_submenu #login:hover, #top_submenu #chChi:hover, #top_submenu #chEng:hover, #btnImportant:hover {
  text-decoration: underline;
}

#top_submenu .profile_pic {
  position: relative;
  margin-right: 12px;
}

#menu-c {
  float: left;
  z-index: 998;
  width: 18.33%;
  max-width: 264px;
  position: fixed;
}

#menu-c .logo {
  margin: 10px 39px 10px 0;
  width: 177px;
  float: right;
}

#menu {
  width: 216px;
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  border-radius: 3px;
  background-color: rgba(49, 49, 49, 0.8);
  margin: 24px 0 0 0;
  padding: 12px 0px;
  float: right;
}

#menu .button {
  height: 44px;
  padding: 0 16px;
}

#menu .button:hover, #menu .button.selected {
  background-color: rgba(0, 0, 0, 0.8);
  cursor: pointer;
}

#menu .icon {
  width: 24px;
  height: 24px;
  float: left;
  margin-top: 10px;
}

#menu .text {
  width: 154px;
  height: 44px;
  float: left;
  color: #ffffff;
  font-size: 14px;
  display: table;
  padding-left: 16px;
}

#menu .button:hover .text, #menu .button.selected .text {
  color: #39D1B3;
}

#menu .text div {
  display: table-cell;
  text-align: left;
  vertical-align: middle;
}

#menu .button.fi .text {
  height: 40px;
  border-top-right-radius: 5px;
}

#menu .button.fi .icon {
  height: 40px;
  border-top-left-radius: 5px;
}

#menu .button.li .text {
  height: 40px;
  border-bottom-right-radius: 5px;
}

#menu .button.li .icon {
  height: 40px;
  border-bottom-left-radius: 5px;
}

#bg {
  position: absolute;
  background-position: center center;
  background-repeat: no-repeat;
  background-size: cover;
  height: 100%;
  width: 100%;
}

#top {
  width: 100%;
  position: fixed;
  z-index: 500;
  top: 0;
  height: 340px;
  overflow: hidden;
  background-color: #000000;
  display: none;
}

#top.min {
  height: 240px;
}

#top .banner {
  top: 0;
  left: 0;
  width: 100%;
  z-index: -100;
  min-width: 1220px;
  text-align: center;
}

#top .banner.blur {
  -webkit-filter: blur(15px);
  -moz-filter: blur(15px);
  -o-filter: blur(15px);
  -ms-filter: blur(15px);
  filter: blur(15px);
}

#top .banner.blur>div {
  max-width: 1440px;
  margin: 0 auto;
  background-position: center center;
  background-repeat: no-repeat;
  background-size: cover;
  height: 340px;
}

#top .shadow {
  top: 0;
  left: 0;
  width: 100%;
  z-index: 10;
  min-width: 1220px;
  min-height: 400px;
  text-align: center;
  position: absolute;
  background-color: rgba(0, 0, 0, 0.1);
}

#submenu {
  width: 100%;
  position: absolute;
  bottom: 0;
  background-color: #000;
  height: 40px;
  Z-INDEX: 500;
}

#top.min #submenu {
  top: 200px;
}

#submenu:before {
  position: absolute;
  top: -20px;
  height: 20px;
  width: 100%;
  background: url(../images/profile_shadow_base.png) repeat-x;
  content: "";
}

#submenu.on {
  background-color: rgba(0, 0, 0, 0.7);
}

.submenu>div {
  margin: 0 auto;
  min-width: 998px;
  max-width: 1440px;
  width: 100%;
  position: relative;
}

#submenu .list {
  float: right;
  width: 75%;
  margin-right: 3.33%;
  min-width: 700px;
  color: #ffffff;
  position: relative;
  height: 40px;
}

#submenu.on .list {
  border-bottom: 1px solid #a1a1a1;
}

#submenu .more .arrow {
  position: relative;
  left: 5px;
  top: 11px;
}

#submenu .more.on {
  background-color: #313131;
  margin-top: 0px;
  height: 40px;
  border: none;
  position: absolute;
  padding-top: 12px;
}

#submenu .more:after {
  content: "";
  width: 0px;
  height: 0px;
  border-width: 5px 4px 0 4px;
  border-style: solid;
  border-color: #A1A1A1 transparent transparent transparent;
  top: 11px;
  position: relative;
  left: 2px;
}

#submenu .more.on:after {
  border-width: 0 4px 5px 4px;
  border-color: transparent transparent #A1A1A1 transparent;
  top: -11px;
}

#submenu .more.on:after {
  border-width: 0 4px 5px 4px;
  border-color: transparent transparent #a1a1a1 transparent;
  top: -11px;
}

#submenu .more:hover:after {
  border-width: 5px 4px 0 4px;
  border-color: #ffffff transparent transparent transparent;
}

#submenu .more.on:hover:after {
  border-width: 0 4px 5px 4px;
  border-color: transparent transparent #ffffff transparent;
}

#submenu2 {
  width: 100%;
  position: FIXED;
  top: 339px;
  background-color: #000;
  height: 32px;
  z-index: 500;
}

#submenu2 .list {
  right: 0px;
  width: 75%;
  min-width: 700px;
  color: #a1a1a1;
  background-color: #313131;
  position: absolute;
  margin-right: 3.33%;
}

#submenu a, #submenu2 a {
  color: #a1a1a1;
}

#submenu .list LI {
  padding: 8px 0px;
  text-align: center;
  cursor: pointer;
  font-size: 14px;
  width: 16.66%;
  margin-top: 4px;
  display: inline-block;
  height: 36px;
  color: #a1a1a1;
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow: hidden;
}

#submenu2 LI {
  padding: 0px 1.66%;
  cursor: pointer;
  font-size: 14px;
  width: 16.692%;
  height: 60px;
  display: table;
  float: left;
}

#submenu2 LI.-r {
  padding-right: 0px;
  width: 15%;
}

#submenu2 LI>div {
  display: table-cell;
  vertical-align: middle;
}

#submenu2 li.selected {
  color: #39D1B3;
}

#submenu li:hover, #submenu2 li:hover {
  color: #ffffff;
}

#submenu .more:hover #submenuMore {
  display: block;
}

#submenuMore {
  display: none;
}

#submenu li.selected {
  margin-top: 0px;
  border-top: 4px solid #39d1b3;
  color: #39d1b3;
  height: 40px;
}

#top #info {
  width: 100%;
  color: #ffffff;
  z-index: 500;
  top: 0;
  bottom: 0;
  position: absolute;
}

#top #info.hvCover {
  z-index: 530;
}

#top #info #style1 {
  top: 0px;
  position: absolute;
  width: 96%;
  height: 300px;
}

#top #info.hvCover #style1 .cover:before {
  border: 1px solid rgba(255, 255, 255, 0.2);
  content: "";
  position: absolute;
  top: 0px;
  bottom: 0px;
  left: 0px;
  right: 0px;
}

#top #info.hvCover #style1 .cover {
  position: absolute;
  bottom: -76px;
  width: 245px;
  height: 245px;
  overflow: hidden;
}

#top #info.hvCover #style1 .cover img {
  width: 100%;
  margin-right: 20px;
}

#top #info #style1 .name {
  position: relative;
  bottom: 0px;
}

#top #info.hvCover #style1 .name {
  margin-left: 265px;
}

#top #info .artist {
  font-size: 24px;
  margin-top: 12px;
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow: hidden;
  padding-top: 2px;
}

#top #info .artist div {
  float: left;
}

#top #info .artist a {
  color: #ffffff;
  margin-right: 24px;
}

#top #info .artist a:hover {
  text-decoration: underline;
}

#top #info .artist span img, #share .title span img {
  width: 36px;
  height: 36px;
  -webkit-border-radius: 50%;
  -moz-border-radius: 50%;
  border-radius: 50%;
  margin-right: 12px;
  position: relative;
  top: -2px;
}

#top #info .artist a span img.default {
  border: 0px;
}

#top #info .artist .more-artist, .moduleBN img {
  cursor: pointer;
}

#top #info .title {
  /* white-space: nowrap; */
  text-overflow: ellipsis;
  overflow: hidden;
  width: 100%;
  font-size: 36px;
  line-height: 42px;
  display: -webkit-box;
  max-width: 100%;
  max-height: 80px;
  margin: 0 auto;
  line-height: 1.1 !important;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
}

#top #info .title .H4 {
  line-height: 30px;
}

#top #info #style1 .title {
  font-size: 36px;
  line-height: 42px;
}

#top #info #style2 {
  width: 96%;
  position: absolute;
  top: -340px;
  height: 200px;
}

#top.min #info #style2 {
  top: 0px;
}

#top #info .left {
  position: absolute;
  bottom: 32px;
  width: 100%;
}

.radio, .follow {
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  border-radius: 3px;
  width: 118px;
  text-align: center;
  cursor: pointer;
  float: left;
  font-size: 14px;
  margin: 12px 16px 0px 0px;
}

.radio {
  background-color: #39d1b3;
  padding: 6px 0px;
}

.radio:hover {
  background-color: #27bb9d;
}

.radio img {
  width: 16px;
}

.radio img, .follow span {
  margin-right: 6px;
  position: relative;
}

.follow {
  padding: 5px 0px;
  background-color: rgba(0, 0, 0, 0.3);
  border: 1px solid #ffffff;
  float: left;
}

.follow:hover {
  border: 1px solid #27bb9d;
  color: #27bb9d;
}

.follow span {
  padding: 4px 9px;
  background: url(../images/collect.png) center center;
  background-size: cover;
}

.follow:hover span {
  background: url(../images/collect_selected.png) center center;
  background-size: cover;
}

.follow.on span {
  background: url(../images/collect_selected.png) center center;
  background-size: cover;
}

/* .follow.personalchart{
	width:135px;
} */

.follow.personalchart span {
  background: none;
}

.follow.personalchart span:first-child {
  background: url(../images/add.png) center center;
  background-repeat: no-repeat;
}

.follow.personalchart.active:hover span:first-child {
  background: url(../images/add_selected.png) center center;
  background-repeat: no-repeat;
}

.follow.on {
  background-color: #ffffff;
  color: #27bb9d;
}

.follow.added {
  opacity: 0.5;
}

.follow.added:hover {
  border: 1px solid #ffffff;
  color: #ffffff;
}

.addTo {
  padding: 5px 10px;
  background-color: rgba(0, 0, 0, 0.3);
  -webkit-border-radius: 5px;
  -moz-border-radius: 5px;
  border-radius: 5px;
  font-size: 12px;
  float: left;
  margin-right: 22px;
}

#top #info .addTo, #top #info .share {
  width: 28px;
  height: 28px;
  float: left;
  cursor: pointer;
}

#top #info .share, .moduleList .share, #playingItem .share {
  background: url(../images/icon/share.png) center center no-repeat;
}

#top #info .share:hover, .moduleList .share:hover, #playingItem .share:hover {
  background: url(../images/icon/share_over.png) center center no-repeat;
}

#top #info .fb-like {
  padding: 4px 16px;
  float: left;
  overflow: hidden;
}

#top #info .right {
  position: absolute;
  right: 0;
  bottom: 36px;
}

#top #info ul {
  float: right;
  max-width: 1260px;
  width: 85.75%;
  min-width: 700px;
}

#contentArea {
  position: absolute;
  width: 100%;
  left: 0;
  font-size: 14px;
  min-width: 998px;
  min-height: 100%;
}

#contentArea .element-c {
  left: 0;
  float: left;
  z-index: 1;
  width: 100%;
  background-color: #000000;
  margin-top: 340px;
  min-height: 100%;
  padding-bottom: 100px;
  position: relative;
}

#contentArea.min .element-c {
  margin-top: 240px;
}

#contentArea.landing .element-c {
  background-color: rgba(255, 255, 255, 0.7);
  margin-top: 0px;
}

#contentArea #sliderFrame {
  height: 640px;
  float: none;
}

#contentArea #shortcut-c {
  margin: 20px auto;
  position: relative;
  z-index: 1000;
  width: 890px;
}

#contentArea #shortcut-c .btn {
  margin: 0 58px;
  float: left;
}

#contentArea .content-c {
  margin: 0 auto;
  min-width: 998px;
  max-width: 1440px;
  width: 100%;
  min-height: 100%;
  position: absolute;
  left: 0;
  right: 0;
  overflow-x: hidden;
  overflow-y: hidden;
}

#contentArea .title {
  width: 100%;
  float: right;
  margin-top: 48px;
  color: #a3a3a3;
  font-size: 20px;
}

#contentArea .title span {
  font-size: 14px;
  font-weight: 100;
  margin-left: 20px;
}

#contentArea.landing .item {
  width: 100%;
  float: left;
  border: 2px solid green;
}

#contentArea .item .top {
  margin: 0 auto;
  min-width: 998px;
  max-width: 1440px;
  width: 100%;
  position: relative;
}

#contentArea .item#i0 .top {
  height: 518px;
  width: 87.5%;
  float: right;
}

#contentArea .item .top div {
  margin-top: 145px;
  width: 87.5%;
  padding-left: 1.2%;
  float: right;
  color: #ffffff;
  line-height: 30px;
  height: 250px;
}

#contentArea .item .top .txt {
  font-size: 20px;
}

#contentArea .item .top .artist {
  font-size: 35px;
  font-weight: bold;
}

#contentArea .item .top .product {
  font-size: 20px;
  font-weight: bold;
}

#contentArea .item .top .btn {
  padding: 10px 30px;
  background-color: #39d1b3;
  -webkit-border-radius: 5px;
  -moz-border-radius: 5px;
  border-radius: 5px;
}

.element {
  top: 0;
  left: 0;
  right: 0;
  z-index: 6;
  width: 78.33%;
  min-width: 700px;
  float: right;
  position: relative;
  width: 78.33%;
  padding-right: 3.33%;
  padding-bottom: 150px;
}

#contentArea #newAlbum {
  float: right;
  width: 100%;
  min-width: 615px;
  color: #ffffff;
  padding-bottom: 25px;
}

#contentArea #newAlbum .album {
  float: left;
  width: 13.8%;
  min-width: 120px;
  margin: 25px 1.2%;
  color: #646464;
  padding-bottom: 60px;
}

#contentArea #newAlbum .album .img {
  margin-bottom: 20px;
}

.artistProfile #artistMenu {
  width: 96%;
  margin: 0 auto;
  height: 50px;
}

.artistProfile #artistMenu div {
  float: left;
  height: 10px;
  padding: 10px 40px;
  margin-top: 4px;
  text-align: center;
  color: #ffffff;
  cursor: pointer;
}

.artistProfile #artistMenu div:hover, #artistMenu div.selected {
  margin-top: 0px;
  border-top: 4px solid #39d1b3;
  color: #39d1b3;
}

.moduleGrid, .moduleText {
  width: 102%;
  margin-left: -1%;
}

#contentArea .moduleText .title {
  font-weight: normal;
  font-size: 18px;
  color: #ffffff;
  line-height: 26px;
  padding: 0 1.2%;
  margin-bottom: 48px;
}

.moduleList .l-h {
  width: 100%;
  border-bottom: 1px solid #292929;
  float: left;
  color: #c9c9c9;
  display: table;
  table-layout: fixed;
  height: 60px;
}

.moduleList .l-h>div {
  display: table-cell;
  vertical-align: middle;
  height: 30px;
}

.moduleList .l-h .all {
  float: right;
  margin-right: 10px;
  color: #a3a3a3;
}

.moduleList .l-r {
  width: 100%;
  border-bottom: 1px solid #292929;
  float: left;
  color: #ffffff;
  height: 62px;
  display: table;
  table-layout: fixed;
}

.moduleList .l-r a:hover, .moduleGrid .item a:hover {
  text-decoration: underline;
}

.moduleList .l-r>div {
  display: table-cell;
  vertical-align: middle;
  height: 62px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.moduleList .l-r:hover, .moduleList .l-r.selected {
  background-color: rgba(255, 255, 255, 0.1);
}

.l-r .cover:before {
  border: 1px solid rgba(255, 255, 255, 0.2);
  content: "";
  position: absolute;
  top: 0px;
  bottom: 0px;
  left: 0px;
  right: 0px;
}

.moduleList .l-r.playing .cover:before {
  background: url(../images/song_playing_back.png) center center no-repeat;
  background-size: cover;
  border: none;
  height: 64px;
}

.moduleList .l-r.playing .cover:after {
  content: "";
  position: absolute;
  top: 0px;
  bottom: 0px;
  left: 0px;
  right: 0px;
  background: url(../images/song_playing_front.gif) center center no-repeat;
}

.moduleList .l-r.playing .song, .moduleList .l-r.playing .artist, .moduleList .l-r.playing .album, .moduleList .l-r.playing .artist a, .moduleList .l-r.playing .album a, .moduleList .l-r.playing .song a, #player_list .l-r.playing .song span, #player_list .l-r.playing .song span a, #videoList #player_list .l-r.playing .song {
  color: #39D1B3;
}

.l-r .song, .l-r .artist, .l-r .album {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.l-r a {
  color: #ffffff;
}

.moduleList.selectMode .select, .moduleList .num {
  width: 64px;
  min-width: 40px;
  text-align: center;
  position: relative;
}

.moduleList .select {
  width: 0px;
  -webkit-transition: width 0.5s;
  transition: width 0.5s;
}

#multiSelectBox .select, .moduleList .l-r .select {
  background-image: url('/images/checkbox_off.png');
  background-position: 20px 20px;
  background-repeat: no-repeat;
}

#multiSelectBox .select.selected, .moduleList .l-r .select.selected {
  background-image: url('/images/checkbox_on.png');
  cursor: pointer;
}

.moduleList .l-r.offair .select {
  background-image: none;
}

.moduleList.chart .num img {
  width: 20px;
}

.moduleList.APL .l-r.playing .num:before {
  content: "";
  position: absolute;
  top: 0px;
  bottom: 0px;
  left: 0px;
  right: 0px;
  background: url(../images/song_playing_back.png) center center no-repeat;
}

.moduleList.APL .l-r.playing .num:after {
  content: "";
  position: absolute;
  top: 0px;
  bottom: 0px;
  left: 0px;
  right: 0px;
  background: url(../images/song_playing_front.gif) center center no-repeat;
}

.moduleList.MV .cover {
  width: 85px;
}

.moduleList .cover {
  width: 64px;
  text-align: center;
  margin-right: 1.3%;
  min-height: 30px;
  position: relative;
  cursor: pointer;
}

.moduleList .l-r .play {
  display: none;
  position: absolute;
  z-index: 1;
  top: 0;
  margin: 0 auto;
  cursor: pointer;
  vertical-align: middle;
}

.moduleList .l-r:hover .play {
  display: table-cell;
}

.moduleList .l-r .play, .moduleList .l-r.playing .cover:after {
  opacity: 0.7;
}

.moduleList .l-r .play:hover, .moduleList .l-r.playing .cover:hover:after {
  opacity: 1;
}

.moduleList .l-r.playing:hover .play {
  display: none;
}

.moduleList .song {
  /*width:17%;*/
  padding-left: 2%;
  cursor: pointer;
}

.moduleList.MV .song {
  width: 29%;
}

.moduleList.MV.AVL .song, .moduleList.APL .song {
  /*width:40%;*/
  width: 37%;
}

.moduleList.selectMode.MV.AVL .song, .moduleList.selectMode.APL .song {
  width: 37%;
}

.moduleList .artist {
  width: 15%;
  padding-left: 2%;
}

.moduleList.MV .artist {
  width: 12%;
}

.moduleList.MV.AVL .artist, .moduleList.APL .artist {
  /*width:21%;*/
  width: 18%;
}

.moduleList.selectMode.MV.AVL .artist, .moduleList.selectMode.APL .artist {
  width: 18%;
}

.moduleList.album .artist {
  width: 39%;
}

.moduleList.artist .artist {
  width: 60%;
}

.moduleList .album {
  width: 15%;
  padding-left: 2%;
}

#search-result .moduleList .album {
  width: 34%;
}

.moduleList.MV .album {
  width: 14%;
}

.moduleList .fnc1 {
  width: 128px;
  float: right;
}

.moduleList .l-r .fnc2 {
  display: none;
  width: 128px;
}

.moduleList .l-r .fnc1, .moduleList .l-r .fnc2 {
  float: right;
}

.moduleList .l-r:hover .fnc2 {
  display: table-cell;
}

.moduleList .l-r:hover .fnc1 {
  display: none;
}

.moduleList .E {
  float: left;
  width: 50%;
  height: 64px;
}

.moduleList .duration {
  float: left;
  width: 50%;
  padding-top: 25px;
  font-size: 14px;
  text-align: center;
  color: #a1a1a1;
}

.moduleList .share {
  float: right;
  width: 50%;
  cursor: pointer;
}

.moduleList .add {
  float: right;
  width: 50%;
  cursor: pointer;
}

.moduleList .E, .moduleList .share, .moduleList .add {
  text-align: center;
  width: 46px;
  height: 46px;
  margin: 9px;
}

.moduleList .E img, .moduleList .share img, .moduleList .add img {
  width: 46px;
  height: 46px;
}

#top #info .addTo, .moduleList .add, #playingItem .add {
  background: url(../images/icon/add.png) center center no-repeat;
}

#top #info .addTo:hover, .moduleList .add:hover, #playingItem .add:hover {
  background: url(../images/icon/add_over.png) center center no-repeat;
}

.moduleList .star {
  float: right;
  cursor: pointer;
  width: 64px;
  margin-right: 12px;
}

.moduleList .l-r .star {
  background: url(../images/star_off.png) center center no-repeat;
}

.moduleList .l-r .star.on {
  background: url(../images/star_on.png) center center no-repeat;
}

.moduleList .l-r .star:hover {
  background: url(../images/star_over.png) center center no-repeat;
}

.moduleList .l-r .star.on:hover {
  background: url(../images/star_on.png) center center no-repeat;
}

.moduleList .b-r {
  width: 100%;
  padding: 10px 0px;
  justify-content:space-between;
  color: #ffffff;
}

.moduleList .total {
  color: #ffffff;
  padding-left: 0.8%;
  font-size: 14px;
}

.moduleList .label {
  color: #ffffff;
  text-align: right;
  width:60%;
  line-height: 18px;
}

.moduleList .more, .moduleGrid .more, .moduleText .more, .moduleLyrics .more {
  float: right;
  color: #39d1b3;
  padding: 5px 0px;
  text-align: right;
  padding-left: 1.2%;
  cursor: pointer;
  font-size: 14px;
}

.moduleGrid .more {
  padding-right: 1.2%;
}

.moduleList .title .more a, .moduleGrid .title .more a, .moduleText .title .more a, .moduleLyrics .title .more a {
  color: #39d1b3;
  font-weight: normal;
}

#contentArea .moduleGrid .title, #contentArea .moduleList .title, #contentArea .moduleLyrics .title {
  float: left;
  color: #ffffff;
  font-size: 24px;
}

#contentArea .moduleGrid .title {
  padding-left: 1.2%;
}

.moduleGrid .item {
  float: left;
  width: 14.6675%;
  margin: 12px 1%;
  color: #cccccc;
  position: relative;
  font-size: 12px;
  line-height: 18px;
}

.moduleGrid.WEB .item {
  cursor: pointer
}

.moduleGrid.round .item {
  color: #ffffff;
}

.moduleGrid .item .name {
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow: hidden;
  font-size: 14px;
  width: 100%;
  height: 38px;
}

.moduleGrid.MV .item .name {
  float: left;
}

.moduleGrid.MV .item .pname:hover {
  cursor: pointer;
  text-decoration: underline;
}

.moduleGrid .item .descs {
  font-size: 12px;
}

.element.playlistCtr .moduleGrid .item .name {
  white-space: normal;
  overflow: hidden;
  height: 127px;
  padding: 0 8px;
}

.moduleGrid.MV .item, .moduleGrid.WEB .item {
  float: left;
  width: 23%;
  min-width: 120px;
  margin: 25px 1%;
  color: #cccccc;
  position: relative;
  font-size: 12px;
  line-height: 18px;
}

.moduleGrid .item .cover .duration {
  color: #cccccc;
  position: absolute;
  margin: auto;
  position: absolute;
  bottom: 15px;
  right: 15px;
}

.moduleGrid .item .ctr {
  text-align: center;
}

.moduleGrid .img:after {
  border: 1px solid rgba(255, 255, 255, 0.2);
  content: "";
  position: absolute;
  top: 0px;
  bottom: 0px;
  left: 0px;
  right: 0px;
}

.moduleGrid .cover {
  position: relative;
  margin-bottom: 10px;
  line-height: 0px;
}

.moduleGrid.MV .cover, .moduleGrid.WEB .cover {
  float: left;
}

.moduleGrid .item .cover .img {
  width: 100%;
}

.moduleGrid.MV .item .cover .img, .moduleGrid.WEB .item .cover .img {
  height: 100%;
  position: absolute;
  top: 0;
  overflow: hidden;
}

.moduleGrid.MV .item .cover .img img, .moduleGrid.WEB .item .cover .img img {
  margin: auto;
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0
}

.moduleGrid .item .cover .preload {
  width: 100%;
  top: 0;
  position: relative;
}

.moduleGrid.round .item .cover .img img, .moduleGrid.round .cover .img:after {
  border-radius: 50%;
}

.moduleGrid .item:hover .img {
  opacity: 0.2;
}

.moduleGrid.WEB .item:hover .img, .moduleGrid.RPF .item:hover .img {
  opacity: 1;
}

.moduleGrid .item:hover .img:after {
  border: 2px solid #ffffff;
}

#i0_recently_played_landingGrid_hot_album .item:hover .img:after{
  border: unset;
}

.moduleGrid .item:hover .preload {
  opacity: 0;
}

.cover .fnc {
  display: none;
  width: 92px;
  height: 36px;
  top: 0;
  margin: auto;
  position: absolute;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
}

.moduleGrid .name a {
  color: #cccccc;
}

.moduleGrid.round .name a {
  color: #ffffff;
}

.item:hover .fnc {
  display: block;
}

.item .fnc .play {
  width: 36px;
  float: left;
  margin-right: 20px;
  cursor: pointer;
}

.item .fnc .more {
  width: 36px;
  float: left;
  cursor: pointer;
  position: relative;
  padding: 0;
}

.item .fnc .play:hover img, .item .fnc .more:hover img {
  opacity: 1;
}

.item .fnc .play img, .item .fnc .more img {
  opacity: 0.7;
}

.item:hover .fnc .more:hover .dropdown-menu {
  display: block;
}

.moduleLyrics {
  width: 96%;
  margin: 0 auto;
}

.moduleLyrics .item {
  float: left;
  width: 49%;
  margin-right: 2%;
  color: #cccccc;
  position: relative;
  line-height: 18px;
}

.moduleLyrics .item .cover {
  float: left;
  width: 30%;
  position: relative;
}

.moduleLyrics .item .name {
  float: left;
  width: 85%;
  margin-left: 12px;
  padding-top: 5px;
}

.moduleLyrics .item .name .productTitle {
  font-size: 26px;
  color: #ffffff;
}

.dropdown-menu {
  position: absolute;
  top: 100%;
  left: -62px;
  z-index: 1000;
  display: none;
  float: left;
  width: 166px;
  padding: 5px 0;
  margin: 2px 0 0;
  font-size: 14px;
  list-style: none;
  background-color: #ffffff;
  border: 1px solid #cccccc;
  border: 1px solid rgba(0, 0, 0, 0.15);
  border-radius: 4px;
  -webkit-box-shadow: 0 6px 12px rgba(0, 0, 0, 0.175);
  box-shadow: 0 6px 12px rgba(0, 0, 0, 0.175);
  background-clip: padding-box;
  text-align: right;
}

#nickNamePopUp {
  width: 328px;
  padding: 16px;
  left: -12px;
  display: block;
  margin-top: 10px;
  border-radius: 10px;
}

#nickNamePopUp:before {
  left: 18px;
  margin-left: 0;
  top: -11px;
}

#nickNamePopUp:after {
  left: 18px;
  margin-left: 0;
  top: -10px;
}

.moduleGrid .dropdown-menu {
  left: -108px;
}

.dropdown-menu:before {
  border-bottom: 11px solid rgba(0, 0, 0, 0.2);
  border-left: 11px solid rgba(0, 0, 0, 0);
  border-right: 11px solid rgba(0, 0, 0, 0);
  content: "";
  display: inline-block;
  position: absolute;
  left: 100%;
  margin-left: -29%;
  top: -11px;
}

.dropdown-menu:after {
  border-bottom: 11px solid #FFFFFF;
  border-left: 11px solid rgba(0, 0, 0, 0);
  border-right: 11px solid rgba(0, 0, 0, 0);
  content: "";
  display: inline-block;
  position: absolute;
  left: 100%;
  margin-left: -29%;
  top: -10px;
}

.dropdown-menu>li:first-child {
  border-radius: 10px 10px 0 0;
}

.dropdown-menu>li {
  display: block;
  padding: 8px 16px;
  clear: both;
  font-weight: normal;
  line-height: 1.428571429;
  color: #a1a1a1;
  cursor: pointer;
}

.playlistCtr .moduleGrid .item {
  height: 300px;
  background-color: #262626;
}

.playlistCtr .moduleGrid .item .dim {
  width: 100%;
  background: url(../images/dim.png);
  height: 41px;
  position: absolute;
  bottom: 0px;
  left: 0;
}

#player_wrapper {
  display: none;
  position: fixed;
  height: 70px;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 11000;
  -webkit-transition: .3s;
  -moz-transition: .3s;
  -ms-transition: .3s;
  transition: .3s;
  -webkit-transform: translateZ(0);
  -moz-transform: translateZ(0);
  -ms-transform: translateZ(0);
  transform: translateZ(0);
  overflow: hidden;
  background-color: #ffffff;
}

#player_bg {
  width: 110%;
  position: absolute;
  height: 120%;
  top: -10%;
  left: -5%;
  bottom: 0;
  -webkit-filter: blur(30px);
  -moz-filter: blur(30px);
  -o-filter: blur(30px);
  -ms-filter: blur(30px);
  filter: blur(30px);
  background-size: cover;
  background-position: center center;
  background-repeat: no-repeat;
  background-image: url(../images/general_default_player_blur.jpg);
}

#player_wrapper .shadow {
  width: 110%;
  position: absolute;
  height: 120%;
  top: -10%;
  left: 0;
  bottom: 0;
  background-color: rgba(0, 0, 0, 0.3);
}

#player_bg img {
  width: 110%;
  position: absolute;
  margin: -5px -5px -5px -5px;
  top: 0;
  left: 0;
  bottom: 0;
}

#player {
  width: 96%;
  min-width: 998px;
  max-width: 1440px;
  margin: 0 auto;
  position: absolute;
  color: #ffffff;
  height: 70px;
  left: 0;
  right: 0;
  bottom: 0;
  padding: 0 2%;
}

#player>#player_ext {
  width: 100%;
  height: 70px;
  position: absolute;
  top: 0;
  left: 0;
}

#player>.btn {
  float: left;
  margin-top: 15px;
  position: relative;
  cursor: pointer;
  margin-right: 1.6%;
  opacity: 0.7;
}

#player>.btn:hover {
  opacity: 1;
}

#player #lyrics {
  margin-top: 25px;
}

#player>#progressBar>.slider {
  width: 404px;
}

#player>#progressBar {
  float: right;
  margin-top: 15px;
}

#player>#progressBar>#title {
  margin-bottom: 5px;
  width: 404px;
  height: 15px;
  text-align: center;
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow: hidden;
}

#player>#mute {
  float: right;
  cursor: pointer;
  margin-right: 1.6%;
  margin-top: 28px;
}

#player>#duration {
  float: right;
  margin-top: 35px;
  margin-right: 1.6%
}

#player>#timer {
  float: right;
  margin: 35px 1.6% 0 1.6%;
}

#player>#volume {
  float: right;
  cursor: pointer;
  margin-top: 35px;
}

#player>#volume>.slider {
  width: 120px;
}

#player>#thumbnail {
  width: 50px;
  margin-top: 10px;
  float: right;
  cursor: pointer;
  position: relative;
}

#player>#prev, #player>#next, #player>#pause {
  cursor: pointer;
}

#player>#currentPlaylist {
  float: right;
}

#player_info {
  width: 96%;
  padding: 0 2%;
  min-width: 998px;
  max-width: 1440px;
  margin: 0 auto;
  position: absolute;
  color: #ffffff;
  height: 570px;
  left: 0;
  right: 0;
  bottom: 70px;
}

#player_info .left {
  float: left;
  width: 32%;
}

#player_info .left div {
  text-align: center;
  margin-bottom: 15px;
  position: relative;
}

#player_info .left .cover:after {
  position: absolute;
  content: "";
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
}

#player_info .left a {
  color: #ffffff;
}

/*#player_info .left a:hover{
	text-decoration:underline;
}*/

#player_info #player_shuffle {
  height: 30px;
  float: left;
  cursor: pointer;
  background-size: cover;
  background-position: center center;
}

#player_info #player_shuffle.off {
  background-image: url(../images/icon/shuffle.png);
}

#player_info #player_shuffle.on {
  background-image: url(../images/icon/shuffle_selected.png);
}

#player_info #player_repeat {
  height: 30px;
  float: left;
  -webkit-touch-callout: none;
  -webkit-user-select: none;
  -khtml-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  background-size: cover;
  background-position: center center;
}

#player_info #player_repeat.off {
  background-image: url(../images/icon/repeat.png);
}

#player_info #player_repeat.one {
  background-image: url(../images/icon/repeatx1_selected.png);
}

#player_info #player_repeat.loop {
  background-image: url(../images/icon/repeat_selected.png);
}

#player_info .left .btn {
  width: 324px;
  margin: 0 auto;
}

#player_info .left .btn>div {
  float: left;
  width: 27px;
  margin: 0 27px;
  cursor: pointer;
  opacity: 0.7;
}

#player_info .left .btn>div:hover {
  opacity: 1;
}

#player_info .l-h, #player_info .l-r {
  border: none;
  margin-bottom: 1px;
  background-color: rgba(70, 70, 70, 0.3);
}

#player_info .l-r .cover {
  margin-top: 9px;
}

#player_info .right {
  float: right;
  width: 62%;
}

#player_info .total {
  background-color: rgba(38, 38, 38, 0.7);
  padding: 13px 10px;
  margin: 1px auto;
  font-size: 12px;
}

#player_list, #player_info #lyric {
  height: 500px;
  overflow-y: scroll;
  background-color: rgba(0, 0, 0, 0.4);
}

#player_info #lyric {
  display: none;
  text-align: center;
  line-height: 24px;
  letter-spacing: 1px;
  width: 100%;
  margin: 0 auto;
  height: 542px;
  padding: 24px;
}

#player_list .l-r .song, #player_list .l-r .artist {
  width: 60%;
  line-height: 18px;
  font-size: 14px;
}

#player_list .l-r .song span, #player_list .l-r .song span a {
  color: #a1a1a1;
}

#player_wrapper #close, #videoplayer_wrapper #close {
  position: absolute;
  top: -58px;
  right: 42px;
  cursor: pointer;
  width: 30px;
}

#close {
  opacity: 0.7;
}

#close:hover {
  opacity: 1;
}

#share {
  width: 520px;
  height: 490px;
  z-index: 13000;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  background-color: #ffffff;
  position: fixed;
  margin: 80px auto;
}

#share .header {
  padding: 24px;
  position: absolute;
  color: #39d1b3;
  background-color: #fff;
  width: 100%;
  font-size: 24px;
}

#share .bg {
  width: 100%;
  position: absolute;
  top: 72px;
  height: 172px;
  overflow: hidden;
  background-position: center center;
  background-repeat: no-repeat;
  background-size: cover;
  -webkit-filter: blur(35px);
  -moz-filter: blur(35px);
  -o-filter: blur(35px);
  -ms-filter: blur(35px);
  filter: blur(35px);
}

#share .bg .shadow {
  top: 0;
  left: 0;
  z-index: 10;
  background-color: rgba(0, 0, 0, 0.1);
  width: 100%;
  height: 100%;
}

#share .img {
  width: 176px;
  height: 176px;
  position: absolute;
  top: 96px;
  left: 24px;
  /*border:1px rgba(0,0,0,0.15) solid;*/
  overflow: hidden;
}

#share .img:after {
  width: 176px;
  height: 176px;
  border: 1px solid rgba(255, 255, 255, 0.2);
  content: '';
  position: absolute;
  top: 0px;
  bottom: 0px;
  left: 0px;
  right: 0px;
  z-index: 100;
}

#share .title {
  width: 236px;
  position: absolute;
  top: 166px;
  left: 215px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  color: #ffffff;
  font-size: 22px;
}

#share textarea {
  width: 472px;
  height: 88px;
  position: absolute;
  top: 288px;
  left: 24px;
  padding: 10px;
  font-size: 14px;
  resize: none;
  background-color: #f7f7f7;
}

#share .btn_ctn {
  width: 472px;
  position: absolute;
  top: 370px;
  left: 24px;
  display: flex;
}

#share .icon_ctn {
  width: 245px;
  height: 32px;
  float: left;
  display: none;
}

#share .icon_ctn div.btn {
  width: 32px;
  float: left;
  margin-right: 5px;
  cursor: pointer;
}

#share .icon_ctn div.txt {
  width: auto;
  padding-top: 10px;
  color: #a3a3a3;
  float: left;
  margin-right: 5px;
  font-size: 14px;
}

#share .icon_ctn div.selected, #share .icon_ctn div:hover {
  float: left;
  margin-right: 5px;
  opacity: 1;
}

#share .submit_ctn {
  width: 244px;
  float: right;
}

#share .submit_ctn div {
  padding: 7px 25px;
  float: right;
  margin-left: 12px;
  cursor: pointer;
  border-radius: 3px;
  color: #ffffff;
  font-size: 14px;
  width: 116px;
  text-align: center;
}

#share .submit_ctn #btn_share, #addToPlaylist #create, #addToPlaylist.editCoverImage #export {
  background-color: #39d1b3;
}

#share .submit_ctn #btn_cancel, #addToPlaylist #cancel, #addToPlaylist #back, #albumArtist #cancel {
  background-color: #a1a1a1;
}

#share .submit_ctn #btn_cancel {
  margin-left: 0px;
}

#share .submit_ctn #btn_cancel:hover, #addToPlaylist #cancel:hover, #addToPlaylist #back:hover, #albumArtist #cancel:hover {
  background-color: #555555;
}

#share .submit_ctn #btn_share:hover, #addToPlaylist #create:hover, #addToPlaylist.editCoverImage #export:hover {
  background-color: #27bb9d;
}

#addToPlaylist #back:hover {
  background-color: #555555;
}

#share .link_ctn {
  width: 496px;
  position: absolute;
  top: 438px;
  left: 0px;
}

#share .link_ctn input {
  width: 326px;
  height: 30px;
  float: left;
  background-color: #f7f7f7;
}

#share #btn_copy {
  float: right;
  padding: 10px 25px;
  float: right;
  cursor: pointer;
  border-radius: 3px;
  color: #ffffff;
  background-color: #b2b2b2;
}

.slider {
  width: 300px;
  margin-top: 0px;
}

.slider>.dragger {
  background: #39d1b3;
  background: -webkit-linear-gradient(top, #39d1b3, #4abba5);
  background: -moz-linear-gradient(top, #39d1b3, #4abba5);
  background: linear-gradient(top, #39d1b3, #4abba5);
  -webkit-box-shadow: inset 0 2px 2px rgba(255, 255, 255, 0.5), 0 2px 8px rgba(0, 0, 0, 0.2);
  -moz-box-shadow: inset 0 2px 2px rgba(255, 255, 255, 0.5), 0 2px 8px rgba(0, 0, 0, 0.2);
  box-shadow: inset 0 2px 2px rgba(255, 255, 255, 0.5), 0 2px 8px rgba(0, 0, 0, 0.2);
  -webkit-border-radius: 10px;
  -moz-border-radius: 10px;
  border-radius: 10px;
  width: 16px;
  height: 16px;
}

.slider>.dragger:hover {
  background: -webkit-linear-gradient(top, #39d1b3, #39d1b3);
}

.slider>.track, .slider>.highlight-track {
  background: #ccc;
  background: -webkit-linear-gradient(top, #bbb, #ddd);
  background: -moz-linear-gradient(top, #bbb, #ddd);
  background: linear-gradient(top, #bbb, #ddd);
  -webkit-box-shadow: inset 0 2px 4px rgba(0, 0, 0, 0.1);
  -moz-box-shadow: inset 0 2px 4px rgba(0, 0, 0, 0.1);
  box-shadow: inset 0 2px 4px rgba(0, 0, 0, 0.1);
  -webkit-border-radius: 8px;
  -moz-border-radius: 8px;
  border-radius: 8px;
  height: 4px;
}

.slider>.highlight-track {
  background-color: #39d1b3;
  background: -webkit-linear-gradient(top, #39d1b3, #4abba5);
  background: -moz-linear-gradient(top, #39d1b3, #4abba5);
  background: linear-gradient(top, #39d1b3, #4abba5);
  border-color: #496805;
}

#progressBar .output, #volume .output {
  display: none;
}

#addToPlaylist, #albumArtist {
  /*width:558px;*/
  height: 604px;
  /*position:fixed;*/
  background-color: #ffffff;
}

#addToPlaylist input {
  width: 100%;
  padding: 10px;
  height: 28px;
  background-color: #f7f7f7;
  border: none;
  font-size: 14px;
}

#addToPlaylist .errorMsg {
  color: #ff0000;
  height: 24px;
  padding-top: 5px;
  /*line-height: 24px;*/
  font-size: 12px;
}

#addToPlaylist input.error, #addToPlaylist textarea.error, #addToPlaylist #cover-preview.error {
  border: 1px solid #ff0000;
}

#addToPlaylist .zoom input[type="range"] {
  padding: 0px;
  width: 160px;
  margin-top: 16px;
  -webkit-appearance: none;
  /* Hides the slider so that custom slider can be made */
  background: transparent;
  /* Otherwise white in Chrome */
}

#addToPlaylist .zoom input[type=range]::-webkit-slider-thumb {
  -webkit-appearance: none;
}

#addToPlaylist .zoom input[type=range]:focus {
  outline: none;
  /* Removes the blue border. You should probably do some kind of focus styling for accessibility reasons though. */
}

#addToPlaylist .zoom input[type=range]::-ms-track {
  width: 100%;
  cursor: pointer;
  /* Hides the slider so custom styles can be added */
  background: transparent;
  border-color: transparent;
  color: transparent;
}

#addToPlaylist .zoom input[type=range]::-webkit-slider-thumb {
  -webkit-appearance: none;
  box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.5);
  border-radius: 50%;
  height: 20px;
  width: 20px;
  background: #ffffff;
  cursor: pointer;
  margin-top: -10px;
  /* You need to specify a margin in Chrome, but in Firefox and IE it is automatic */
  /*box-shadow: 1px 1px 1px #000000, 0px 0px 1px #0d0d0d; /* Add cool effects to your sliders! */
  */
}

/* All the same stuff for Firefox */

#addToPlaylist .zoom input[type=range]::-moz-range-thumb {
  box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.5);
  border-radius: 50%;
  height: 20px;
  width: 20px;
  background: #ffffff;
  cursor: pointer;
}

/* All the same stuff for IE */

#addToPlaylist .zoom input[type=range]::-ms-thumb {
  box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.5);
  border-radius: 50%;
  height: 20px;
  width: 20px;
  background: #ffffff;
  cursor: pointer;
}

#addToPlaylist .zoom input[type=range]::-webkit-slider-runnable-track {
  width: 160px;
  height: 2px;
  cursor: pointer;
  animate: 0.2s;
  /*box-shadow: 1px 1px 1px #000000, 0px 0px 1px #0d0d0d;*/
  background: #a1a1a1;
  /*border-radius: 1.3px;
  border: 0.2px solid #010101;*/
}

#addToPlaylist .zoom input[type=range]:focus::-webkit-slider-runnable-track {
  background: #a1a1a1;
}

#addToPlaylist .zoom input[type=range]::-moz-range-track {
  width: 160px;
  height: 2px;
  cursor: pointer;
  background: #a1a1a1;
  opacity: 0.5;
  border-radius: 1.3px;
}

#addToPlaylist .zoom input[type=range]::-ms-track {
  width: 160px;
  height: 2px;
  cursor: pointer;
  background: transparent;
  border-color: transparent;
  color: transparent;
}

#addToPlaylist .zoom input[type=range]::-ms-fill-lower {
  background: #a1a1a1;
  /*border: 0.2px solid #010101;
  border-radius: 2.6px;
  box-shadow: 1px 1px 1px #000000, 0px 0px 1px #0d0d0d;*/
}

#addToPlaylist .zoom input[type=range]:focus::-ms-fill-lower {
  background: #a1a1a1;
}

#addToPlaylist .zoom input[type=range]::-ms-fill-upper {
  background: #a1a1a1;
  /*border: 0.2px solid #010101;
  border-radius: 2.6px;
  box-shadow: 1px 1px 1px #000000, 0px 0px 1px #0d0d0d;*/
}

#addToPlaylist .zoom input[type=range]:focus::-ms-fill-upper {
  background: #a1a1a1;
}

#addToPlaylist .zoom {
  height: 38px;
  width: 230px;
  margin-left: 126px;
  float: left;
}

#addToPlaylist .zoom>div, #addToPlaylist .zoom>input {
  float: left;
  margin: 18px 5px 0px;
}

#addToPlaylist .plus {
  background-image: url('/images/icon/icon_plus.png');
}

#addToPlaylist .minus {
  background-image: url('/images/icon/icon_minus.png');
}

#addToPlaylist .plus, #addToPlaylist .minus {
  width: 20px;
  height: 20px;
  background-size: cover;
  cursor: pointer;
}

#addToPlaylist .plus:hover, #addToPlaylist .minus:hover {
  opacity: 0.7
}

#addToPlaylist textarea {
  width: 100%;
  height: 136px;
  padding: 10px;
  padding-bottom: 0px;
  background-color: #f7f7f7;
  border: none;
  font-size: 14px;
  /*margin-left: 14px;*/
}

#addToPlaylist.editCoverImage {
  position: absolute;
  z-index: 200;
  width: 100%;
}

#addToPlaylist.editCoverImage, #addToPlaylist.editCoverImage #createPlaylist {
  height: 520px;
}

#addToPlaylist, #createPlaylist {
  transition: height 2s;
  -webkit-transition: height 2s;
}

#playListSelect, #createPlaylist {
  width: 100%;
  height: 604px;
  position: absolute;
  background-color: #ffffff;
}

#playListSelect {
  padding: 0 10px;
}

#createPlaylist {
  padding: 0 24px;
}

#createPlaylist #cover-o {
  /*width:558px;*/
  height: 234px;
  width: 520px;
  margin-left: -24px;
  background-size: cover;
  background-position: top center;
  background-image: url(/images/new_playlist_cover.jpg);
  background-color: #ffffff;
  position: relative;
  /*left: -10px;*/
  overflow: hidden;
}

#addToPlaylist.editCoverImage #createPlaylist #cover-o {
  width: 520px;
  height: 388px;
  background-image: none;
  background-color: #d9d9d9;
}

#addToPlaylist.editCoverImage .cropit-image-input {
  display: none;
}

#addToPlaylist.editCoverImage #cover-preview-bg, #addToPlaylist.editCoverImage .cropit-image-preview {
  background-color: #f8f8f8;
  background-size: cover;
  /*border: 5px solid #ccc;*/
  border-radius: 3px;
  margin-top: 37px;
  margin-left: 103px;
  width: 314px;
  height: 314px;
  cursor: move;
}

.cropit-preview {
  width: 314px;
  height: 314px;
  margin: auto;
}

.cropit-preview-image {
  width: auto;
}

#addToPlaylist.popup .btn {
  width: 116px;
  text-align: center;
  cursor: pointer;
}

#addToPlaylist.popup .title {
  color: #555555;
  font-size: 20px;
  padding: 24px 0px;
}

#addToPlaylist.popup .title.red {
  color: #ff3132;
}

#addToPlaylist.popup .content {
  color: #555555;
  font-size: 16px;
}

#addToPlaylist.popup>div {
  padding: 0 24px;
  border-bottom: 0px;
  position: relative;
  width: 100%;
}

#addToPlaylist.popup .btnContainer {
  height: 40px;
}

#addToPlaylist.popup .btn {
  margin-left: 20px;
  margin-top: 0px;
}

#addToPlaylist.popup .btn.green {
  background-color: #39d1b3;
}

#addToPlaylist.popup .btn.red {
  background-color: #ff3132;
}

#addToPlaylist.popup .btn.green:hover {
  background-color: #33BA9D;
}

#addToPlaylist.popup .btn.grey {
  background-color: #a1a1a1;
}

#addToPlaylist.popup .btn.grey:hover {
  background-color: #555555;
}

#nickNamePopUp {
  text-align: left;
  position: relative;
  display: none;
}

#nickNamePopUp .close {
  width: 18px;
  height: 18px;
  position: absolute;
  top: 12px;
  right: 12px;
  background: url(../images/btn_popup_close.png) no-repeat;
  background-size: cover;
  cursor: pointer;
}

#nickNamePopUp a {
  display: block;
  width: 116px;
  text-align: center;
  cursor: pointer;
  margin-top: 16px;
  padding: 6px 0;
  background-color: #39d1b3;
  color: #ffffff;
  font-size: 14px;
  border-radius: 3px;
}

#nickNamePopUp .title {
  color: #555555;
  font-size: 18px !important;
  margin-bottom: 8px;
  width: 280px;
  font-weight: bold;
  line-height: 22px;
}

#nickNamePopUp .content {
  color: #555555;
  font-size: 12px !important;
}

#addToPlaylist.editCoverImage #cover-preview-bg:after {
  width: 308px;
  height: 308px;
  border: 3px solid rgba(255, 255, 255, 1);
  content: '';
  position: absolute;
  top: 0px;
  bottom: 0px;
  left: 0px;
  right: 0px;
  z-index: 100;
}

#addToPlaylist.editCoverImage .cropit-image-background {
  opacity: .2;
  cursor: auto;
  margin-top: 37px;
  margin-left: 103px;
}

#createPlaylist #cover-preview-bg {
  width: 520px;
  height: 240px;
  background-size: cover;
  background-position: top center;
  position: absolute;
  top: 0px;
  left: 0px;
  -webkit-filter: blur(15px);
  -moz-filter: blur(15px);
  -o-filter: blur(15px);
  -ms-filter: blur(15px);
  filter: blur(15px);
}

#addToPlaylist.editCoverImage #cover-preview-bg {
  width: 314px;
  height: 314px;
  top: 0px;
  left: 0px;
  -webkit-filter: blur(0px);
  -moz-filter: blur(0px);
  -o-filter: blur(0px);
  -ms-filter: blur(0px);
  filter: blur(0px);
}

#addToPlaylist.editCoverImage #cover-preview-bg>div {
  height: 314px;
  font-size: 16px;
  line-height: 314px;
  width: 100%;
  text-align: center;
  color: #ffffff;
  font-weight: 500;
  text-shadow: 0 2px 4px rgba(0, 0, 0, 0.65);
}

#createPlaylist #cover-preview {
  width: 186px;
  height: 186px;
  background-size: cover;
  /*background-position:top center;*/
  background-image: url(/images/new_playlist_cover_preview.jpg);
  position: relative;
  margin: auto auto;
  top: 20px;
}

#createPlaylist #cover-preview.uploadimg {
  top: 24.5px;
  background-size: cover;
}

#fileSelector {
  display: none;
}

#createPlaylist #cover-change {
  top: 7px;
  left: 336px;
}

#playListSelect {
  /*border-bottom: 2px solid #39d1b3;*/
  position: absolute;
  top: 0;
}

#playListSelect>.title, #createPlaylist>.title {
  color: #39d1b3;
  font-size: 24px;
  text-overflow: ellipsis;
  white-space: nowrap;
  overflow: hidden;
}

#playListSelect>.title {
  padding: 26px 14px;
}

#createPlaylist>.title {
  padding: 26px 0px;
}

#createPlaylist>.contents {
  position: absolute;
  left: 0px;
  width: 520px;
}

#playListSelect .listing {
  height: 528px;
  overflow-y: scroll;
  margin-left: 14px;
  margin-bottom: 3px;
}

#playListSelect .listItem {
  margin: 0px 18px 0px 0px;
  color: #000000;
  font-size: 12px;
  width: 144px;
  float: left;
  cursor: pointer;
  height: 210px;
  overflow: hidden;
  position: relative;
}

#playListSelect .listItem .name:hover {
  text-decoration: underline;
}

#playListSelect .cover, #playListSelect .over {
  height: 144px;
  overflow: hidden;
  position: absolute;
  top: 0;
}

#playListSelect .cover img, #playListSelect .over img {
  /*min-height:162px;
	min-width:162px;*/
  overflow: hidden;
}

#playListSelect .over {
  display: none;
  /*min-width:162px;
  min-height:162px;*/
}

#playListSelect .listItem:hover .over {
  display: block;
}

#playListSelect .listing {}

#playListSelect .name {
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow: hidden;
  font-size: 14px;
  color: #262626;
  line-height: 20px;
  margin-top: 156px;
}

#albumArtist .name {
  text-align: center;
}

#albumArtist .listItem .cover:before {
  position: absolute;
  border: 1px solid rgba(0, 0, 0, .2);
  border-radius: 50%;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  content: '';
}

#addToPlaylist .btn, #albumArtist #cancel {
  float: right;
  margin-top: 20px;
  cursor: pointer;
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  border-radius: 3px;
  color: #ffffff;
  font-size: 14px;
  height: 28px;
  line-height: 28px;
  min-width: 116px;
  padding: 0 10px;
  text-align: center;
}

#addToPlaylist.editCoverImage #export {
  position: absolute;
  bottom: 14px;
  right: 9px;
  width: 94px;
}

#albumArtist .listItem img {
  border-radius: 50%;
}

#createPlaylist #create {
  color: #ffffff;
  background-color: #3ad0b3;
  cursor: pointer;
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  border-radius: 3px;
}

#videoplayer_wrapper {
  display: block;
  position: fixed;
  height: 0px;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 12000;
  -webkit-transition: .3s;
  -moz-transition: .3s;
  -ms-transition: .3s;
  transition: .3s;
  -webkit-transform: translateZ(0);
  -moz-transform: translateZ(0);
  -ms-transform: translateZ(0);
  transform: translateZ(0);
  overflow: hidden;
  background-color: #000000;
  overflow: hidden;
}

#videoplayer {
  width: 100%;
  min-width: 998px;
  max-width: 1440px;
  margin: auto;
  position: absolute;
  color: #ffffff;
  height: 540px;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
}

#videoplayer .left {
  float: left;
  width: 672px;
  padding-top: 25px;
  position: relative;
  text-align: center;
  margin: 0 1.6% 0 3.3%
}

#videoplayer .left #MOOVVideoPlayer {
  width: 672px;
  height: 397px;
  margin: 63px auto;
}

#videoplayer .left .name {
  margin-bottom: 20px;
  line-height: 30px;
  text-align: left;
  width: 500px;
  float: left;
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow: hidden;
}

#videoplayer .left .fnc {
  margin-bottom: 20px;
  line-height: 30px;
  text-align: left;
  width: 170px;
  float: right;
}

#videoplayer .left .fnc div {
  margin: 10px;
  float: right;
  cursor: pointer;
  width: 46px;
  height: 46px;
}

#videoplayer .left .title {
  width: 672px;
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow: hidden;
  font-size: 24px;
}

#videoplayer .left .artist {
  width: 672px;
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow: hidden;
  font-size: 16px;
}

#videoList {
  width: auto;
  color: #ffffff;
  margin-right: 3.3%;
  padding-top: 25px;
}

#videoList .song {
  width: 70%;
  color: #ffffff;
}

#videoList .cover {
  min-width: 50px;
  width: 85px;
}

#videoList .l-r.playing .cover:before {
  background: url(../images/video_playing_back.png) center center no-repeat;
}

#videoList .l-r.playing .cover:after {
  background: url(../images/video_playing_front.gif) center center no-repeat;
}

#videoList .moduleList {
  width: auto;
  height: 332px;
}

#videoList .total {
  padding: 13px 10px;
  width: auto;
  margin: 1px auto;
  overflow: hidden;
  background-color: rgba(38, 38, 38, 0.7);
  font-size: 12px;
}

#videoList #currentProfile {
  width: auto;
  padding: 8px;
  /*margin-top:85px;*/
  background-color: #313131;
  overflow: hidden;
}

#player_info #currentProfile {
  width: 100%;
  padding: 8px 0px;
  background-color: rgba(38, 38, 38, 0.7);
}

#videoList #currentProfile .cover {
  width: 64px;
  float: left;
  background-color: #313131;
  overflow: hidden;
}

#player_info #currentProfile .cover {
  width: 72px;
  height: 64px;
  padding-left: 8px;
  float: left;
  overflow: hidden;
}

#videoList #currentProfile .name, #player_info #currentProfile .name {
  padding-left: 12px;
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow: hidden;
  padding-top: 5px;
  height: 64px;
  line-height: 23px;
}

#videoList #currentProfile .name .nowPlaying, #player_info #currentProfile .name .nowPlaying {
  font-size: 12px;
  color: #7e7e7e;
}

#videoList #currentProfile .name .title, #player_info #currentProfile .name .title {
  font-size: 24px;
  color: #fff;
}

#videoList #currentProfile .name .title a:hover, #player_info #currentProfile .name .title a:hover {
  text-decoration: underline;
}

#loading {
  background: rgb(0, 0, 0) url(../images/loading.gif) no-repeat center center;
  height: 100%;
  width: 100%;
  position: fixed;
  z-index: 150000;
  opacity: 0.7;
}

#lazyload {
  background: url(../images/lazyload.gif) no-repeat center center;
  height: 24px;
  width: 96%;
  position: absolute;
  z-index: 150000;
  bottom: -36px;
}

.sortingbar option {
  color: #000;
}

.sortingbar select {
  color: #fff;
}

.msgWithTitle {
  width: 520px;
  height: 200px;
  padding: 24px;
  background-color: #ffffff;
  position: fixed;
  margin: 80px auto;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  z-index: 13001;
}

.msgWithTitle .msg {
  padding: 24px 0;
}

.msgWithTitle a {
  color: initial;
}

#msgSuspend {
  width: 472px;
  height: 204px;
  padding: 24px;
  background-color: #ffffff;
  position: fixed;
  margin: auto auto;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  z-index: 13001;
}

#msgSuspend .icon {
  text-align: center;
  margin-bottom: 24px;
}

#msgSuspend .icon img {
  width: 89px;
}

#msgSuspend .msg {
  height: 128px;
}

#msgSuspend .button, .msgWithTitle .button {
  width: 116px;
  padding: 8px 0px;
  float: right;
  color: #ffffff;
  text-align: center;
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  border-radius: 3px;
  cursor: pointer;
}

#msgSuspend #setting, .msgWithTitle .button {
  background-color: #39d1b3;
}

#msgSuspend #setting:hover, .msgWithTitle .button:hover {
  background-color: #27bb9d;
}

.msgWithTitle .button {
  bottom: 24px;
  right: 24px;
  position: absolute;
}

#msgSuspend #later {
  background-color: #a1a1a1;
  margin-right: 12px;
}

#errorMsg {
  margin-top: 288px;
  text-align: center;
}

#errorMsg>div {
  margin: 0px auto 36px auto;
}

#errorMsg .btn {
  color: #ffffff;
  padding: 5px 20px;
  background-color: #39D1B3;
  cursor: pointer;
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  border-radius: 3px;
  font-size: 14px;
  width: 200px;
}

#popupBlock {
  height: 208px;
  width: 558px;
  position: absolute;
  z-index: 160000;
  margin: auto auto;
  background-color: #ffffff;
  left: 0;
  top: 0;
  right: 0;
  bottom: 0;
  text-align: center;
}

#popupBlock>div {
  margin-top: 36px;
}

#popupBlock a {
  text-decoration: underline;
}

@font-face {
  font-family: 'si';
  src: url('/css/fonts/socicon.eot');
  src: url('/css/fonts/socicon.eot?#iefix') format('embedded-opentype'), url('/css/fonts/socicon.woff') format('woff'), url('/css/fonts/socicon.ttf') format('truetype'), url('/css/fonts/socicon.svg#icomoonregular') format('svg');
  font-weight: normal;
  font-style: normal;
}

@media screen and (-webkit-min-device-pixel-ratio:0) {
  @font-face {
    font-family: si;
    src: url(/css/fonts/socicon.svg) format(svg);
  }
}

#facebookLoginBtn {
  background-color: #3b5998;
  color: #ffffff;
  border: none;
  width: 270px;
  height: 44px;
  cursor: pointer;
}

.soc-facebook {
  font-family: si !important;
  font-style: normal;
  font-weight: 400;
  font-size: 24px;
  width: 24px;
  height: 24px;
  color: #FFFFFF;
  background-color: #3e5b98;
}

.soc-facebook:before {
  content: 'b';
}

@media screen and (min-width:1440px) {
  #player #lyrics {
    margin-left: 5.9%;
    margin-right: 3.4%;
  }
  #player #prev {
    margin-right: 3.5%;
  }
  #player #pause {
    margin-right: 3.7%;
  }
 /* .moduleList .album {
    width: 29%;
  }
  .moduleList.PL .album {
    width: 32%;
  }
  .moduleList.MV.PL .album {
    width: 26%;
  }
  #search-result .moduleList .album {
    width: 42%;
  }
  .moduleList.MV.AVL .artist, .moduleList.APL .artist {
    width: 30%;
  }*/
}

@media screen and (max-height:675px) {
  #player_wrapper #close, #videoplayer_wrapper #close {
    top: 0px;
  }
}

#undo {
  float: right;
  width: 20%;
  text-align: right;
  color: #39d1b3;
  cursor: pointer;
  line-height: 40px;
  font-size: 14px;
  font-weight: 900;
}

#toastMsg {
  float: left;
  width: 70%;
  text-align: left;
  font-size: 14px;
  line-height: 20px;
  margin: 10px 0px;
}

#msgDelete, #msgAddTo {
  color: #a1a1a1;
  font-size: 14px;
}

#msgAddPlaylist {
  line-height: 40px;
}

#msgAddPlaylist .showImg {
  width: 40px;
  height: 40px;
  overflow: hidden;
  float: left;
}

#msgAddPlaylist .playlistImg {
  width: 40px;
  margin-right: 12px;
  float: left;
}

#msgAddPlaylist .msgContent {
  float: right;
  width: 404px;
  margin: 13px 0px;
  line-height: 14px;
}

#audioHLSPlayer {
  top: -1000px;
  position: absolute;
}

#therapeutic {
  box-shadow: 0px -15px 30px 1px rgba(0, 0, 0, 0.4);
}

.therapeutic #bg {
  WIDTH: 130% !important;
  height: 100% !important;
  position: absolute;
  top: 0;
  background-size: cover;
}

.therapeutic #bg .before, .therapeutic #bg .after {
  position: absolute;
  background-size: 100% 100%;
  width: 100%;
  height: 100%;
  animation: bgmove 50s infinite linear;
}

.therapeutic #bg .before {
  right: 100%;
}

.therapeutic #bg .after {
  left: -2px;
}

@keyframes bgmove {
  from {
    transform: translateX( 100%);
  }
  to {
    transform: translateX(0%);
  }
}

#landing #bg #goingMerry {
  position: absolute;
  bottom: 200px;
  width: 400px;
  right: 40%;
}

#landing #bg #luffy {
  position: absolute;
  bottom: 460px;
  width: 150px;
  right: 51.8%;
}

.therapeutic .view {
  width: 100%;
}

.therapeutic .element:first-child, .therapeutic .view:first-child {
  height: 100%;
  min-height: 860px;
}

.therapeutic #intro, .therapeutic #MTtop {
  color: #ffffff;
}

.therapeutic #intro>div {
  text-align: center;
  display: none;
}

.therapeutic #intro #title {
  margin-top: 181px;
  font-size: 36px;
  text-shadow: 2px 2px 8px rgba(0, 0, 0, 0);
}

.therapeutic #intro img {
  width: 120px;
  margin: 52px 0 56px 0;
}

.therapeutic #intro #desc {
  font-size: 18px;
  line-height: 26px;
  width: 75%;
  margin: 0 auto 36px auto;
  text-shadow: 2px 2px 8px rgba(0, 0, 0, 0);
}

.therapeutic #intro #gotit {
  font-size: 18px;
  width: 280px;
  padding: 13px 0;
  margin: 0 auto;
  border-radius: 2px;
  cursor: pointer;
  opacity: 0;
  display: block;
  text-shadow: 2px 2px 8px rgba(0, 0, 0, 0);
}

.therapeutic #MTtop {
  margin: 0 auto;
  left: 0;
  right: 0;
  color: #ffffff;
  text-shadow: 2px 2px 8px rgba(0, 0, 0, 0);
  min-height: 900px !important;
}

.therapeutic #MTtop audio {
  position: absolute;
  z-index: -1000;
}

.therapeutic #MTtop>div {
  text-align: center;
}

.therapeutic #MTtop>.content>div {
  display: none;
}

.therapeutic #MTtop #title {
  margin: 96px auto 17px auto;
  font-size: 36px;
  text-shadow: 2px 2px 8px rgba(0, 0, 0, 0);
}

.therapeutic #MTtop #schedule {
  margin: 0 auto;
  height: 170px;
  color: #ffffff;
}

.therapeutic #MTtop #schedule .title {
  width: 100%;
  font-size: 24px;
  margin: 19px auto;
  color: #ffffff;
  text-shadow: 2px 2px 8px rgba(0, 0, 0, 0);
}

.therapeutic #MTtop #status {
  width: 684px;
  height: 32px;
  margin: 0 auto;
  color: #ffffff;
}

.therapeutic #MTtop #status .check {
  width: 36px;
  height: 36px;
  float: left;
  background-color: rgba(0, 0, 0, 0.2);
  border-radius: 50%;
  position: relative;
  box-shadow: 0 0 0 2px #ffffff inset;
  margin: 0 30px;
}

.therapeutic #MTtop #status .check.on {
  box-shadow: 0 0 0 2px #39d1b3 inset;
  background-image: url(/images/musictherapy/img_tm_check.png);
}

.therapeutic #MTtop #status .check:first-child:before {
  display: none;
}

.therapeutic #MTtop #status .check:before {
  content: "";
  width: 61px;
  height: 4px;
  position: absolute;
  background-color: #ffffff;
  top: 15px;
  left: -60px;
  z-index: -1;
}

.therapeutic #MTtop #status .check.on:before {
  background-color: #39d1b3;
}

.therapeutic #MTtop #status .link {
  width: 59px;
  height: 4px;
  float: left;
  margin: 16px 0 0 -2px;
  background-color: #ffffff;
}

.therapeutic #MTtop #status .link.active {
  background-color: #39d1b3;
}

.therapeutic #MTtop #date {
  margin: 0 auto;
  color: #ffffff;
  width: 684px;
}

.therapeutic #MTtop #date>span {
  float: left;
  display: block;
  text-align: center;
  color: #ffffff;
  width: 96px;
  padding-top: 7px;
  font-size: 18px;
}

.therapeutic #MTtop #category {
  margin: 0 auto;
  overflow: hidden;
  left: 0;
  right: 0;
  width: 81.5%;
}

.therapeutic #MTtop #category .scroll {
  position: relative;
  width: auto;
  width: 125.5%;
}

.therapeutic #MTtop #category .row {
  width: 100%;
  height: 265px;
}

.therapeutic #MTtop #category #row1 {
  margin-left: 16.69%;
}

.therapeutic #MTtop #category .el {
  float: left;
  width: 24.55%;
  margin: 0 4.33%;
}

.therapeutic #MTtop #category .el img {
  margin: 0 auto;
  width: 62.2%;
  max-width: 160px;
  border-radius: 50%;
  transition: all 0.5s linear;
}

.therapeutic #MTtop #category .el:hover img {
  background-color: rgba(255, 255, 255, 0.2);
}

.therapeutic #MTtop #category .el span {
  display: block;
  margin-top: 13px;
  text-align: center;
  height: 60px;
  font-size: 24px;
}

.therapeutic .title {
  text-align: center;
}

.therapeutic .textinfo .img {
  text-align: center;
}

.therapeutic .textinfo .img img {
  width: auto;
}

.therapeutic .textinfo .title {
  font-size: 28px !important;
  color: #555555 !important;
  font-weight: bold;
  margin-bottom: 24px;
  margin-top: 17px !important;
}

.therapeutic .textinfo .btn {
  font-size: 18px;
  color: #ffffff;
  width: 280px;
  border-radius: 2px;
  padding: 13px 0;
  margin: 0 auto;
  position: absolute;
  width: 280px;
  bottom: 0px;
  left: 0;
  right: 0;
  text-align: center;
}

.therapeutic .textinfo .desc {
  font-size: 18px;
  line-height: 26px;
  color: #555555;
  margin-bottom: 40px;
}

.therapeutic .artistpager .module-bg {
  background-image: linear-gradient(rgba(252, 180, 173, 1) 0%, rgba(251, 196, 208, 1) 100%);
  height: 228px;
}

.therapeutic .artistpager .title, .therapeutic .gridpager .title {
  margin-top: 23px !important;
}

.therapeutic .artistpager .title span, .therapeutic .gridpager .title span {
  font-size: 24px !important;
  color: #ffffff !important;
  font-weight: bold !important;
  margin-bottom: 24px;
  margin-top: 0px !important;
  position: relative;
}

.therapeutic .artistpager .title span:before, .therapeutic .gridpager .title span:before {
  content: "";
  width: calc(100% - 20px);
  height: 100%;
  margin: 0 auto;
  border-bottom: 2px solid #ffffff;
  position: absolute;
  top: 10px;
  left: 0;
  right: 0;
}

.therapeutic .artistpager .artist_list, .therapeutic .gridpager .grid_list {
  width: 78%;
  overflow: hidden;
  margin: 0 auto;
  min-width: 577px;
  margin-bottom: 30px;
}

.therapeutic .gridpager .artist_list {
  width: 78%;
}

.therapeutic .gridpager .grid_list {
  height: 250px;
  width: 85%;
}

.therapeutic .gridpager .moduleGrid {
  width: 110% !important;
  left: -4% !important;
}

.therapeutic .artistpager .artist_list .moduleGrid, .therapeutic .gridpager .moduleGrid {
  top: 31px;
  width: 120%;
  margin-left: auto;
  margin-right: auto;
  height: 120px;
  left: -9%;
}

.therapeutic .artistpager .moduleGrid .item {
  padding: 0 !important;
}

.therapeutic .cover:hover {
  background-color: initial !important;
}

.therapeutic .artistpager .artist_list .cover, .therapeutic .artistpager .artist_list img {
  width: 88px;
  height: 88px;
  border-radius: 50%;
  margin: 16px auto;
  opacity: 0.5;
  transition: all 0.5s linear;
  cursor: pointer;
}

.therapeutic .artistpager .artist_list .cover, .therapeutic .artistpager .artist_list .slick-center .cover img {
  width: 120px;
  height: 120px;
  margin: 0px auto;
  opacity: 1;
}

.therapeutic .artistpager .slick-track {
  position: relative;
}

.therapeutic .artistpager .artist_desc .moduleGrid {
  min-width: initial;
}

#landing.therapeutic .artistpager {
  padding-bottom: 0px;
}

.therapeutic .artistpager .artist_desc .slick-slider {
  margin-bottom: 0px;
}

.therapeutic .artistpager .artist_desc, .therapeutic .artist_desc .slick-track {
  height: 544px;
}

.therapeutic .artistpager .artist_desc .item {
  transform: scale(0.9);
  transition: all 0.5s linear;
  top: 2.5%;
  opacity: 0.5;
}

.therapeutic .artistpager .artist_desc .item.slick-center {
  transform: scale(1);
  opacity: 1;
  top: 0%;
}

.therapeutic .artistpager .artist_desc img {
  width: 544px;
  height: 544px;
  cursor: pointer;
  margin: 0px auto;
}

.therapeutic .artistpager .artist_desc .card {
  width: 656px;
  height: 218px;
  border-top: 3px solid #39d1b3;
  margin: 0px auto;
  position: absolute;
  top: 308px;
  left: 0;
  right: 0;
  background-color: #ffffff;
  padding: 10px 16px;
  box-shadow: 0px 1px 8px 0px rgba(50, 50, 50, 0.75);
}

.therapeutic .artistpager .artist_desc .card .name {
  text-align: center;
  font-size: 24px;
  color: #555555;
  line-height: normal;
  height: auto;
}

.therapeutic .artistpager .artist_desc .card .title {
  text-align: center;
  font-size: 18px !important;
  margin-top: 4px !important;
  margin-bottom: 8px !important;
  color: #555555 !important;
}

.therapeutic .artistpager .artist_desc .card .desc {
  text-align: left;
  font-size: 18px;
  color: #a1a1a1;
  line-height: 24px;
}

.therapeutic .artistpager .artist_desc .card .btn {
  text-align: center;
  font-size: 18px;
  color: #ffffff;
  width: 280px;
  border-radius: 2px;
  padding: 13px 0;
  margin: 0px auto;
  position: absolute;
  bottom: 16px;
  left: 0;
  right: 0;
}

.artistpager .moduleGrid .img:after {
  display: none;
}

.artistpager .moduleGrid .item:hover .cover {
  background: none !important;
}

.artistpager .moduleGrid .item:hover .img, .therapeutic .moduleGrid .item:hover .img2 {
  opacity: 1 !important;
}

.therapeutic .gridpager .module-bg {
  background-image: linear-gradient(#5ac9d4 0%, #f9dfbe 100%);
  height: 100%;
}

.therapeutic .gridpager .moduleGrid {
  top: 31px;
  margin-left: auto;
  margin-right: auto;
  margin-bottom: 0;
}

.therapeutic .gridpager .moduleGrid .item {
  transform: scale(0.8);
  transition: all 0.1s linear;
  text-align: center;
  opacity: 0.8;
  padding: 0 !important;
}

.therapeutic .gridpager .moduleGrid .slick-center {
  transform: scale(0.95);
  opacity: 1;
}

.therapeutic .gridpager .moduleGrid .item:hover {
  transform: scale(0.95);
  opacity: 1;
}

.therapeutic .gridpager .moduleGrid .item:hover .img {
  opacity: 1 !important;
}

.therapeutic .gridpager .moduleGrid .item:hover .img:after {
  border: none !important;
}

.therapeutic .view>div:last-child {
  margin-bottom: 30px;
}

#MTtop #arrowLeft, #MTtop #arrowRight {
  display: none;
  top: 500px;
}

#landing.therapeutic #arrowLeft, #landing.therapeutic #arrowRight {
  width: 30px;
  height: 48px;
  position: absolute;
  cursor: pointer;
  opacity: 0.5;
  transition: all 0.5s linear
}

#landing.therapeutic #arrowLeft:hover, #landing.therapeutic #arrowRight:hover, #landing.therapeutic #arrowBottom:hover {
  opacity: 1 !important;
}

#landing.therapeutic #arrowLeft {
  background: url(/images/btn_general_arrow_white_left.png);
}

#landing.therapeutic #arrowRight {
  background: url(/images/btn_general_arrow_white_right.png);
  right: 20px;
}

#landing.therapeutic #arrowBottom {
  bottom: 41px;
  left: 50%;
  position: absolute;
  cursor: pointer;
  width: 44px;
  height: 28px;
  background-size: 100%;
  background-repeat: no-repeat;
  background: url(/images/btn_general_arrow_white_down.png);
  opacity: 0.5;
}

.therapeutic .btn {
  transition: all 0.5s linear;
  background-color: #39d1b3;
}

.therapeutic .btn:hover {
  background-color: #27bb9d;
}

#landing.therapeutic .element.gridpager {
  padding-top: 0px;
}

.gridpager #arrowLeft, .gridpager #arrowRight {
  top: 180px;
}

#lyric {
  font-size: 14px;
}

#lyric .contents span {
  display: block;
  transition: all 0.25s linear;
}

#lyric .contents span.selected {
  background-color: rgba(0, 0, 0, 0.5);
  font-size: 18px;
  color: #39d1b3;
  padding: 5px 0;
}

#msgImportant {
  line-height: 18px;
  height: 300px;
}

#msgImportant.eng {
  line-height: 18px;
  height: 350px;
}

#multiSelectBox {
  width: 100%;
  position: fixed;
  z-index: 999999;
  bottom: 56px;
  left: 0px;
  right: 0px;
}

#multiSelectBox>div {
  width: 640px;
  height: 60px;
  background-color: rgba(255, 255, 255, .9);
  border-radius: 3px;
  box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.5);
  margin: 0 auto;
}

#multiSelectBox .select, #multiSelectBox span {
  float: left;
  line-height: 60px;
}

#multiSelectBox>div>span {
  width: 197px;
  color: #555555;
}

#multiSelectBox span.left, #multiSelectBox .addToPlaylist {
  cursor: pointer;
}

#multiSelectBox .num {
  width: auto;
  margin: 0px 5px;
}

#multiSelectBox .addToPlaylist {
  width: auto;
  font-weight: 900;
  color: #39d1b3;
  cursor: pointer;
  width: 121px;
  text-align: right;
}

#multiSelectBox .close {
  float: right;
  width: 60px;
  height: 60px;
  background-image: url('/images/icon/btn_close.png');
  background-repeat: no-repeat;
  background-position: 19px 19px;
  background-size: 22px;
  cursor: pointer;
}

#multiSelectBox .close:hover {
  background-image: url('/images/icon/btn_close_over.png');
}

#multiSelectBox .select {
  width: 47px;
  height: 60px;
  background-position: 20px 18px;
}