@import './artists-2.css';

/* SET BASE
----------------------------------------------- */
* {background: transparent; margin: 0; padding: 0; outline: none; border: 0; box-sizing: border-box;}
* {
	transition:
		background-color .12s ease,
		color .12s ease,
		border-color .12s ease,
		opacity .12s ease,
		box-shadow .12s ease !important;

	transform: none !important;
}
* {
	backface-visibility: hidden;
}
* {
	will-change: auto !important;
}
ol, ul {list-style: none;}
blockquote, q {quotes: none;}
table {border-collapse: collapse; border-spacing: 0;}
input, select {vertical-align: middle;}
article, aside, figure, figure img, hgroup, footer, header, nav, section, main {display: block;}
img {max-width: 100%;}
.clr {clear: both;}
.clearfix:after {content: ""; display: table; clear: both;}

body {font: 15px 'Montserrat', sans-serif; line-height: normal; padding: 0; margin: 0;        
	color: #333; background: url(../images/background2.png) #f9fafe29; background-attachment: fixed; min-height: 100%; width: 100%; font-weight: 400; background-blend-mode: lighten;}
a {color: #333; text-decoration: none;}
a:hover, a:focus, .track-desc:hover > *, .side-item:hover * {color: #2c348a; text-decoration: none;}
h2, h3, h4, h5 {font-weight: 400; font-size: 22px;}
h1 {font-weight: 500; font-size: 22px;}
button, textarea, select, input[type="text"], input[type="password"], input[type="button"], input[type="submit"] 
{appearance: none; -webkit-appearance: none; font-size: 16px; font-family: 'Montserrat' !important;}

.button, .btn, .pagi-load a, .up-second li a, .usp-edit a, .qq-upload-button, 
button:not(.color-btn):not([class*=fr]):not(.search-btn):not([class*=owl-]), 
html input[type="button"], input[type="reset"], input[type="submit"], .meta-fav a, .usp-btn a {
display: inline-block; text-align: center; padding: 0 20px; height: 40px; line-height: 40px;
border-radius: 10px; cursor: pointer; font-weight: 400; box-shadow: none;
background-color: #0057b7; color:#fff; font-size: 15px;}
.button:hover, .btn:hover, .up-second li a:hover, .usp-edit a:hover, .qq-upload-button:hover, 
.pagi-load a:hover, .usp-btn a:hover,
button:not(.color-btn):not([class*=fr]):not(.search-btn):not([class*=owl-]):hover, 
html input[type="button"]:hover, input[type="reset"]:hover, input[type="submit"]:hover, .meta-fav a:hover 
{background-color: linear-gradient(to bottom, #0057b7, #FFD100); color: #fff; box-shadow: 0 10px 20px 0 rgba(0,0,0,0);}
button:active, input[type="button"]:active, input[type="submit"]:active {box-shadow: inset 0 1px 4px 0 rgba(0,0,0,0.1);}

input[type="text"], input[type="password"] {height: 40px; line-height: 40px;
border-radius: 4px; border: 0; padding: 0 15px;}
select {height: 40px; border: 0; padding: 0 15px;}
textarea {padding: 15px; overflow: auto; vertical-align: top; resize: vertical;}
input[type="text"], input[type="password"], select, textarea {width: 100%; background-color: #fff; color: #000; 
box-shadow: inset 0 0 0 1px #e3e3e3, inset 1px 2px 5px rgba(0,0,0,0.1);}
select {width: auto;}
input[type="text"]:focus, input[type="password"]:focus, textarea:focus 
{box-shadow: inset 0 0 0 1px #3498db, inset 1px 2px 5px rgba(0,0,0,0.1);}
input::placeholder, textarea::placeholder {color: #000; opacity: 0.5; font-size: 14px;} 
input:focus::placeholder, textarea:focus::placeholder {color: transparent}

.img-box, .img-wide, .img-resp, .img-resp-vert, .img-fit {overflow: hidden; position: relative;}
.img-resp {padding-top: 70%;}
.img-resp-vert {padding-top: 140%;}
.img-box img, .img-resp img, .img-resp-vert img {width: 100%; min-height: 100%; display: block;}
.img-resp img, .img-resp-vert img {position: absolute; left: 0; top: 0;}
.img-wide img {width: 100%; display: block;}
.img-fit img {width: 100%; height: 100%; object-fit: cover;}
.nowrap {white-space: nowrap; overflow: hidden; text-overflow: ellipsis;}
.nowrap-side {white-space: nowrap; overflow: hidden; text-overflow: ellipsis;}
.nowrap-side-title {white-space: nowrap; overflow: hidden; text-overflow: ellipsis;}
.fx-row {display:-ms-flexbox;display:-webkit-flex;display:flex;-ms-flex-wrap:wrap;-webkit-flex-wrap:wrap;flex-wrap:wrap;
-ms-flex-pack:justify;-webkit-justify-content:space-between;justify-content:space-between;}
.fx-col {display:-ms-flexbox;display:-webkit-flex;display:flex; 
-ms-flex-direction:column;-webkit-flex-direction:column;flex-direction:column}
.fx-center {-ms-flex-pack:center;-webkit-justify-content:center;justify-content:center}
.fx-middle {-ms-flex-align:center;-webkit-align-items:center;align-items:center}
.fx-start {-webkit-justify-content:flex-start;justify-content:flex-start;}
.fx-first {-ms-flex-order: -1;-webkit-order: -1;order: -1;}
.fx-last {-ms-flex-order: 10;-webkit-order: 10;order: 10;}
.fx-1, .main-nav > li {-ms-flex-preferred-size: 0; flex-basis: 0; -webkit-box-flex: 1; -ms-flex-positive: 1; flex-grow: 1; 
	max-width: 100%; min-width: 50px;}
.fx-between {-ms-flex-pack:justify;-webkit-justify-content:space-between;justify-content:space-between;}
b, strong, .fw700 {font-weight: 600;}
.icon-left [class*="fa-"], .icon-left .icon {margin-right: 10px;}
.icon-right [class*="fa-"], .icon-right .icon {margin-left: 10px;}
.hidden, #dofullsearch {display: none;}
.anim, .btn, button, .track-desc, .track-title, .track-subtitle, .side-item, .side-item * {transition: all .3s;}
.mtitle, .sub-title h1, .form-wrap h1 {margin-bottom: 30px; font-size: 22px; font-weight: 500;}
#dle-content {width: 100%;}
.visible {display: block !important;}
.h1-main {font-weight: 600 !important; font-size: 18px !important;}
.h2-main {font-weight: 600 !important; font-size: 16px !important;}
/* BASIC GRID
----------------------------------------------- */
.wrap {min-width:320px; position: relative; padding-bottom: 60px;}
.wrap-center {max-width:1280px; margin:0 auto; position:relative; z-index:20;}
.header {padding: 30px 30px; background: #0057b7; margin-top: 30px; border-radius: 20px 20px 0px 0px;}
.wrap-main {background-color: #fff; 
	border-bottom: 1px solid #ababab36;
	border-radius: 0px 0px 20px 20px;
}
.nav {position: relative;}
.nav-side {background: #ffffff !important;}
.sharing-fdl {background: #ffffff00; position: relative; border: 1px solid #206994; color: #0082D1;}
.cols {padding: 0 15px;}
.col-main {min-height: auto; height: 100%; padding: 15px 0 0 0;}
.col-right {width: 242px; margin-left: 15px; padding: 15px 0 0 0; border-left: 1px solid #eee;}
.footer {color: #fff; padding: 20px 60px; position: relative;}
.footer-menu a {font-weight: 500; color: #00264e; border-bottom: 1px dotted #00264e; display: block; margin-right: 30px;     background: #eef6fe;
    padding: 5px 15px;}
.overlay-box {position: fixed; z-index: 998; left: 0; top: 0; width: 100%; height: 100%; 
	opacity: 0.8; background-color: #000; cursor: pointer;}
.go-top {
    position: fixed;
    bottom: 30px;
    right: 25px;
    z-index: 9999;
    display: flex !important;
    justify-content: center;
    align-items: center;
    width: 40px !important;
    height: 40px !important;
    border-radius: 50%;
    border: none;
    background: linear-gradient(135deg, #187ded, #0f5fc0);
    color: white;
    font-size: 18px;
    cursor: pointer;
    box-shadow: 0 4px 12px rgba(0,0,0,0.1);
    transition: all 0.3s ease;
    opacity: 0;
    visibility: hidden;
}
.go-top:hover {
    transform: scale(1.1) rotate(-5deg);
}
.go-top.show {
    opacity: 1;
    visibility: visible;
}


/* HEADER
----------------------------------------------- */
.logo {display: block; color: #fff !important; font-weight: 800; white-space: nowrap;
	font-size: 22px; text-transform: uppercase; padding-left: 50px; 
	background: url(../images/logo.svg) 0 center / 40px no-repeat;}
.logo div {font-size: 12px; font-weight: 400; margin-top: 3px; text-transform: none;}
.logo span:not(.logo-domain) {background-color: #2293f5; display: inline-block; 
	padding: 0 5px; margin: 0 3px; border-radius: 4px; color: #fff;}
.logo span.logo-domain {font-size: 12px; font-weight: 500;}
.search-wrap {margin: 0px 30px;}
.search-box { position: relative; margin: 5px;}
.search-box input, .search-box input:focus {padding: 0 60px 0 15px; border-radius: 4px; box-shadow: none;}
.search-box input:not(:focus)::placeholder {color: #333; opacity: 0.5; font-size: 13px;} 
.search-box button {position:absolute; right:0; top:0px; z-index:10; width: 40px; cursor: pointer; 
	background: none; color: #333; line-height: 40px; text-align: center;}
.hshare > * {width: 40px; height: 40px; border-radius: 50%; cursor: pointer; display: flex;
	margin-left: 15px; box-shadow: 0 0 0 5px rgba(255,255,255,0.2); justify-content: center; align-items: center;}
.hshare > .wbr-fb {background: #6996c7 url(../images/i-fb.svg) center center / 10px no-repeat;}
.hshare > .wbr-tlg {background: #6996c7 url(../images/i-tlg.svg) center center / 16px no-repeat;}
.hshare > .wbr-vk {background: #6996c7 url(../images/i-vk.svg) center center / 20px no-repeat;}
.main-nav > li > a {display: block; text-align: center; color: #002651; position: relative;
	padding: 15px 0 15px 0; font-size: 14px; white-space: nowrap; font-weight: 500; height: 50px; line-height: 25px;
}
.main-nav > li {background: #fdce0c; border-right: 1px solid #0058b73a; }
.main-nav > li:last-child {background: #fdce0c; border-right: none;}
.main-nav > li:hover .hidden-menu {
	visibility: visible; 
	opacity: 1; 
	transform: translateY(0px); 
	text-align: center;
}
.main-nav > li:hover > a {background-color: #ecf6ff; color: #003064; font-size: 14px; transition: 0.2s; overflow: hidden; transform: scale(1.01); }
.fdl {display: block; 
	text-align: center; 
	color: #002651; 
	position: relative;
	padding: 15px 0 15px 0; 
	font-size: 14px; 
	white-space: 	nowrap; 
	font-weight: 600;
	margin-right: 15px; 
	width: 83px; 
	border-radius: 10px; 
	color: white; 
	flex-grow: 1;
}

.fdl {background: #3cb35c; position: relative;}
.main-nav .fal, .fdl  .fal, .fdl .fas {display: block; height: 40px; font-size: 24px;
	position: absolute; left: 0; right: 0; top: 15px; text-align: center; opacity: 0.666;}
.hidden-menu {
	background-color: #fcfdff; 
	box-shadow: 0 15px 15px rgba(0,0,0,0.2); 
	z-index: 100;
	position: absolute; 
	left: 0; 
	top: 100%; 
	width: 100%; 
	column-width: 300px; 
	column-gap: 20px;
	visibility: hidden; 
	opacity: 0; 
	transform: translateY(30px); 
	padding: 30px;
	text-align: center;
}
.hidden-menu li a {
	display: block; 
	font-size: 17px; 
	font-weight: 500; 
	margin-bottom: 15px; 
	white-space: nowrap; 
	padding-right: 5px; 
	border: 1px solid #13426e;
    border-radius: 10px;
    padding: 10px; 
	transition: 0.2s;
}
.hidden-menu li a:hover {
	transform: scale(1.02);
	background-color: #0057b7;
	color: #fdce0c;
	font-weight: 600;
}

/* SECTION
----------------------------------------------- */
.sect {margin-bottom: 15px; position: relative;}
.sect-title {
    font-weight: 600;
    font-size: 18px;
    color: #13426e;
    background: linear-gradient(317deg, #ecf6ff, #d7ecff);
    line-height: 40px;
    padding: 5px 20px;
	min-height: 50px;
    border-radius: 10px 10px 0 0;
    border-bottom: 1px solid rgba(27, 136, 237, 0.3);
    box-shadow: inset 0 -2px 6px rgba(255, 255, 255, 0.6),
                0 2px 6px rgba(0, 0, 0, 0.05);
}
.site-desc {padding: 15px 60px; background-color: #ecf6ff; line-height: 1.6; font-size: 14px; border-radius: 0px 0px 20px 20px;}
.site-desc .logo {color: #000 !important; margin-right: 60px; line-height: normal;}
.site-desc a, .site-copyright span {color: #003e83; border-bottom: 1px solid #003d8369; opacity: .7;}
.site-desc a:hover {color: #001a37; opacity: 1;}
.site-copyright {padding: 5px 15px; font-size: 13px; color: #666; text-align: left;}
.sect-border {border: 1px solid #eeeeeea6;
    margin-bottom: 15px;
	border-radius: 0px 0px 10px 10px;
}
.links {display: flex; gap: 15px; display: row; }

/* TRACK ITEM
----------------------------------------------- */
.track-item {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 6px 12px;
    border-radius: 6px;
    transition: all 0.3s ease;
    cursor: pointer;
}

.track-item:nth-child(2n+1) {
    background-color: rgba(177, 177, 177, 0.06); 
}

.track-item a, 
.track-item a.track-desc {
    display: block;
    color: #13426e;
    text-decoration: none;
    font-size: 14px;
    font-weight: 500;
    transition: color 0.3s ease;
}
.track-title:not(:empty)+.track-subtitle:before{display:inline-block;}
.track-title:empty+.track-subtitle:before{display:none;}
.track-item:hover {
    background-color: rgba(27, 136, 237, 0.08);
    transform: translateY(-1px);
    box-shadow: 0 2px 8px rgba(27, 136, 237, 0.08);
}

.track-item:hover a,
.track-item:hover a.track-desc {
    color: #1b88ed;
}

.track-img {width: 40px; height: 40px; border-radius: 10px; margin-right: 15px;}

.track-play {
    cursor: pointer;
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 16px;
    width: 40px;
    height: 40px;
    color: #ffffff;
    background: linear-gradient(135deg, #1b88ed, #0057b7);
    margin: 5px;
    border-radius: 8px;
    border: 1px solid rgba(0, 88, 183, 0.2);
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.1);
    transition: all 0.3s ease;
}

.track-play:hover {
    background: linear-gradient(135deg, #0057b7, #1b88ed);
    transform: scale(1.03);
    box-shadow: 0 4px 12px rgba(27, 136, 237, 0.25);
}

.track-play:active {
    transform: scale(0.95);
    box-shadow: 0 2px 6px rgba(27, 136, 237, 0.15);
}
.track-desc {padding: 0 0px 0px 10px;}
.track-title {font-weight: 500; display: inline;}
.track-subtitle {color: #666; display: inline;}
.track-subtitle:before {content: '-'; display: inline; margin: 0 4px;}
.track-time {font-size: 11px; color: #000000; height: 20px; line-height: 20px; border-radius: 3px; width: 50px; background-color: #d1d1d1a1; min-width: 45px; max-width: 50px; text-align: center;}
.track-time i {margin: 0px 2px 0px 2px; font-size: 9px;}
.track-download-button {background-color:#44c567; height: 20px; line-height: 20px; width: 40px; border-radius: 3px; text-align: center; margin-left: 10px;}
.fa-arrow-down {color: #fff;}
.fa-angle-double-down {color: #fff;}
.track-download-button:hover {transform: scale(1.04); transition: all .3s ease; background-color: #1b88ed; color: #fdce0c !important;}
.js-item-played .fa-play:before {content: '\f04c'; color: #fdce0c;}


/* SIDEBAR
----------------------------------------------- */
.side-bt {
	font-weight: 500; 
	font-size: 17px; 
	margin-bottom: 10px; 
	background: #ecf6ff;
    height: 50px;
    line-height: 50px;
    padding: 0px 20px;
    border-radius: 10px;
    margin-left: 15px;}

.side-bt-playlist {
	font-weight: 600; 
	font-size: 17px; 
	margin-bottom: 10px; 
	background: #ecf6ff;
	height: 45px;
	line-height: 40px;
	padding: 5px 20px;
	border-radius: 10px;
	margin-left: 10px;
}
.side-item {
	display: block; 
	padding: 15px 60px 15px 75px; 
	color: #999; font-size: 13px;
	border-top: 1px solid #eee; 
	position: relative; 
	margin-right: -60px;
}

.side-items a:last-child {
	border-radius: 0px 0px 10px 10px;
}
.side-item-icons {
	display: flex;
    padding: 15px 15px 10px 10px;
    color: #999;
    font-size: 13px;
	border-top: 0 !important;
    border: 1px solid #eee;
    position: relative;
    margin-left: 15px;
}

.side-item-icons:hover {
	background-color: #f1f1f1;
}

.side-item div {font-weight: 500; color: #333; margin-bottom: 4px; font-size: 15px;}
.side-item-icons div {font-weight: 500; color: #333; margin-bottom: 4px; min-width: 40px;}
.sect-main-title {
	background-color: #eef6fe;
	padding: 10px 25px;
	border-bottom: 1px solid #5ab1ff !important;
	border: 1px solid #eee;
    border-radius: 10px 10px 0px 0px;
}
.sect-main-text {
	background-color: #fffaf2;
	border: 1px solid #eee;
	padding: 10px 15px;
	font-weight: 400;
	margin: 0 auto;
	border-radius: 0px 0px 10px 10px;
	margin-bottom: 15px;
}

.sect-content {margin-bottom: 30px; border-bottom: 1px solid #eee; height: 100%;
    min-height: 100%;}

.side-bt-text {
	padding: 20px; 
	font-weight: 400; 
	font-size: 15px; 
	margin: 0 auto; 
	background-color: #fffaf2; 
	border-radius: 10px;
	position: relative;
	margin-bottom: 15px;
}
.side-menu {
	padding: 10px;
	margin-top: -20px;
}
.side-item-icons-text {
	display: block;
}

.side-artists {
	display: flex;
	background: #64b7e117;
	height: 24px;
    margin: 10px;
    width: 110px;
    line-height: 24px;
}

.share-btn{display:inline-flex;align-items:center;justify-content:center;width:36px;height:36px;margin:0 5px 0 0;background:#fff;border:1px solid #ececec;border-radius:8px;color:#555;font-size:17px;text-decoration:none;box-shadow:0 1px 2px rgba(0,0,0,.03);transition:background-color .12s ease,color .12s ease,border-color .12s ease;}
.share-btn:hover{background:#f7f7f7;border-color:#dcdcdc;color:#111;}
.share-btn i{line-height:1;}
.share-btn:last-child{margin-right:0;}

.side-playlist a {
    display: flex;
    justify-content: flex-start;
    align-items: center;
    font-size: 13px;
    font-weight: 500;
    margin-bottom: 8px;
    padding: 8px 12px;
    width: 225px;
    text-align: left;
    color: #13426e;
    white-space: nowrap;
    background: rgba(255, 255, 255, 0.6); 
    backdrop-filter: blur(4px); 
    border: 1px solid rgba(63, 130, 194, 0.12);
    border-radius: 10px;
    transition: all 0.25s ease;
    text-decoration: none;
    cursor: pointer;
    box-shadow: 0 1px 4px rgba(0, 0, 0, 0.05);
}

.side-playlist a:hover {
    background: #1b88ed;
    color: #ffffff;
    transform: translateY(-1px);
    box-shadow: 0 3px 8px rgba(27, 136, 237, 0.2);
}



/* BOTTOM NAVIGATION
----------------------------------------------- */
.bottom-nav {margin-bottom: 10px; padding-top: 10px; border-top: 1px solid #eeeeeea6;}
.nav-load a {display: flex; align-items: center; justify-content: center; 
	padding: 0 20px; max-width: 340px; margin: 0 auto;  
	background: #1b88ed; color: #fff; line-height: 40px;
	text-align: center; height: 40px; border-radius: 4px; transition: 0.2s; font-size: 16px;}
.nav-load a:hover, .artist-a-end:hover {background: #0057b7; color: #FFD100 !important; font-weight: 500; font-size: 16px; transform: scale(1.01); transition: .3s ease-in-out;}

.nav-load > span {display: none;}
.navigation {text-align:center;}

.navigation a,
.navigation span,
.pnext a,
.pprev a,
.pprev > span,
.pnext > span {
    display: inline-flex;
    justify-content: center;
    align-items: center;
    min-width: 40px;
    height: 40px;
    margin: 6px 3px;
    padding: 0 10px;
    font-weight: 500;
    font-size: 15px;
    color: #13426e;
    background: #ffffff;
    border-radius: 8px;
    box-shadow: 0 1px 4px rgba(0, 0, 0, 0.06), 0 0 0 1px #eee;
    transition: all 0.3s ease;
    cursor: pointer;
    text-decoration: none;
}

.navigation span:not(.nav_ext),
.pagi-nav a:hover {
    background: linear-gradient(135deg, #1b88ed, #0057b7);
    color: #ffffff;
    transform: translateY(-1px);
    box-shadow: 0 3px 8px rgba(27, 136, 237, 0.2);
}

.navigation a:active,
.pnext a:active,
.pprev a:active {
    transform: scale(0.95);
    box-shadow: 0 1px 4px rgba(27, 136, 237, 0.15);
}



/* PLAYER
----------------------------------------------- */
.wplayer {width: 100%; position: fixed; left: 0; bottom: 0; z-index: 990;}
.audioplayer {max-width: 1280px; margin: 0 auto; height: 60px; padding: 10px 20px 10px 10px;
background-color: #ffffff; color: #003e83; box-shadow: 0 -15px 40px rgba(0,0,0,0.2); position: relative;}
.audioplayer audio {display: none;}
.audioplayer-bar {position: absolute; left: 0px; right: 0px; top: -10px; height: 10px; 
	background-color: #5fb4dd; overflow: hidden; cursor: pointer;}
.audioplayer-bar-loaded {position: absolute; left: 0; top: 0; height: 100%; 
	background-color: #0057b745; border-radius: 10px 10px 0 0;}
.audioplayer-bar-played {position: absolute; left: 0; top: 0; height: 100%; 
	z-index: 10; border-radius: 0; background-color: #fdce0c; border-top: 1px solid #0057b73b;}
.audioplayer-volume {position: relative; z-index: 100; margin-left: 20px; font-size: 18px;}
.audioplayer-muted .fa-volume-up:before {content: '\f6a9';}
.audioplayer-volume-button a {color: #00386d; display: block; height: 30px; line-height: 30px; text-align: center;}
.audioplayer-volume-adjust {position: absolute; left: 0; bottom: 100%; width: 30px; height: 100px; 
background-color: #333; box-shadow: 0 0 10px rgba(0,0,0,0.5); padding: 10px; display: none;}
.audioplayer-volume-adjust > div {width: 10px; height: 80px; border-radius: 0px; 
position: relative; cursor: pointer; background-color: #222; overflow: hidden;}
.audioplayer-volume-adjust > div > div {width: 100% !important; background-color: #ffeb3b; 
position: absolute; left: 0; bottom: 0; z-index: 10;}
.audioplayer-volume:hover .audioplayer-volume-adjust {display: block;}
.ap-dl {font-size: 24px; color: #003e83; margin-left: 20px;}
.ap-time {font-size: 13px; color: #000000; margin-left: 20px;}
.audioplayer-time-current:after {display: inline; }
.ap-desc {width: 300px;}
.ap-img {width: 40px; height: 40px; margin-right: 10px;}
.ap-artist {font-size: 13px; margin-top: 5px; color: #ccc;}
.ap-title {font-size: 15px; font-weight: 500;}
.ap-btns {position: absolute; left: 50%; top: 50%; transform: translate(-50%,-50%);}
.audioplayer-volume-button a:hover, .ap-dl:hover {opacity: 1; color: #197fdd;}
.audioplayer-stopped .audioplayer-playpause a {padding-left: 3px;}
.wplayer-init .audioplayer-playpause .fas:before {content: '\f04b';}
.player-hide .wplayer {bottom: -80px;}
.player-hide .audioplayer {box-shadow: 0 -15px 30px rgba(0,0,0,0); transform: scale(0.5,0.5);}
.ap-title, .ap-artist {max-width: 230px;}

.audioplayer-playpause a {
    width: 44px;
    height: 44px;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 12px;
    border-radius: 30%;
    background: linear-gradient(135deg, #fdce0c, #ffb800);
    color: #003e83;
    font-size: 18px;
    border: 1px solid rgba(27, 136, 237, 0.15);
    cursor: pointer;
    transition: all 0.3s ease;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.08);
}

.audioplayer-playpause a:hover {
    background: linear-gradient(135deg, #1b88ed, #0057b7);
    color: #ffffff;
    transform: scale(1.06);
    box-shadow: 0 6px 18px rgba(0, 87, 183, 0.3);
}

.audioplayer-playpause a:active {
    transform: scale(0.95);
    box-shadow: 0 3px 8px rgba(0, 87, 183, 0.2);
}

.ap-prev, 
.ap-next {
    cursor: pointer;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 36px;
    height: 36px;
    font-size: 14px;
    color: #003e83;
    background: linear-gradient(135deg, #ffcd00cc, #ffb800cc);
    border-radius: 30%;
    border: 1px solid rgba(27, 136, 237, 0.15);
    transition: all 0.3s ease;
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.08);
}

.ap-prev:hover, 
.ap-next:hover {
    background: linear-gradient(135deg, #1b88ed, #0057b7);
    color: #ffffff;
    transform: translateY(-2px) scale(1.05);
    box-shadow: 0 4px 12px rgba(0, 87, 183, 0.3);
}

.ap-prev:active, 
.ap-next:active {
    transform: translateY(0) scale(0.97);
    box-shadow: 0 2px 6px rgba(0, 87, 183, 0.2);
}


/* FULL
----------------------------------------------- */
.speedbar {
    font-size: 12px;
    color: #414141; 
    padding: 10px 15px;
    margin-bottom: 20px;
    border-radius: 0 0 10px 10px;
    background: #fffaf2;  
    border-bottom: 1px solid rgba(27, 136, 237, 0.15);
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 4px;
}
.speedbar .fas {
    margin-right: 6px;
    color: #1b88ed; 
}
.speedbar a {
    color: #1b88ed;
	font-weight: 500;
    text-decoration: none;
    transition: color 0.2s ease;
}
.speedbar a:hover {
    color: #0057b7;
    text-decoration: underline;
}
.speedbar span {
    color: #777; 
}

.title-song {
    position: relative;
    display: flex;
    justify-content: flex-start;
    align-items: flex-start;
    flex-direction: column;
    margin: 20px auto;
	margin-top: -10px;
}

.fsct-track-name {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: center;
    font-weight: 600;
    background: linear-gradient(314deg, #ecf6ff, #d7ecff);
    border-radius: 12px;
    padding: 14px 20px;
    font-size: 22px !important;
	color: #0057b7;
    width: 100%;
    line-height: 1.3;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.05);
}

.fsct-track-name .artist {
    font-size: 20px;
    color: #0057b7;
    margin-bottom: 4px;
}

.fsct-track-name .track {
    font-size: 24px;
    color: #13426e;
}

.fsct-track-name .fa-pencil {
    margin-left: 6px;
    font-size: 16px;
    color: #1b88ed;
    transition: transform 0.3s ease, color 0.3s ease;
    cursor: pointer;
}
.fsct-track-name .fa-pencil:hover {
    transform: rotate(-15deg);
    color: #0057b7;
}

.complaint-title {
    position: absolute;
    top: 5px;
    right: 5px;
    background: rgba(255,0,0,0.85);
    color: #fff !important;
    font-size: 13px;
    padding: 4px 8px;
    border-radius: 8px;
    display: flex;
    align-items: center;
    gap: 6px;
    cursor: pointer;
    transition: all 0.3s ease;
}
.complaint-title a { 
	color: #Fff !important;
}
.complaint-title i {
	margin: 0px 5px;
}
.complaint-title:hover {
    background: rgba(200,0,0,0.9);
    transform: translateY(-2px);
}

@media (max-width: 550px) {
    .fsct-track-name {
        padding: 10px 12px;
    }
    .fsct-track-name .artist {
        font-size: 18px;
    }
    .fsct-track-name .track {
        font-size: 20px;
    }
    .complaint-title {
        font-size: 12px;
        padding: 3px 8px;
    }
}


h1 > span {color: #222222; font-size: 15px !important;}
h1 a {margin-left: 15px;}
.fmain h1 { font-size: 22px;}
.fimg {width: 182px; height: 182px; border-radius: 10px;}
.fsc {display: flex;
	align-items: center;
    justify-content: space-around;
	border: 1px solid #eeeeee98;
    border-radius: 10px;
}
.finfo {display: flex;
    flex-grow: 1;
    flex-direction: column;
    flex-wrap: nowrap;}
.finfo li {font-size: 13px; line-height: 1.8; padding: 7px 10px 6px 140px; min-height: 27px; position: relative;}
.finfo li:nth-child(2n+1) {background-color: rgba(62,156,179,0.04);}
.finfo li > span:first-child {color: #666; display: inline-block; width: 120px; 
	position: absolute; left: 10px; top: 5px;}
.finfo li span {
	display: flex;
    justify-content: flex-end;
    padding-right: 10px;
    font-weight: 500;
}
.frate {position: absolute; z-index: 10; right: 0; top: 0px; background-color: #fff; font-size: 12px;
	padding: 0 8px; border-radius: 4px 0px 0px 4px; height: 30px; line-height: 30px;}
.frate a .fas {color: #6ab04c; margin-right: 2px;}
.frate a + a .fas {color: #eb4d4b; margin-left: 13px;}
.fbtm {
    display: flex;
    justify-content: center;
    align-items: center;
    align-content: center;
    max-width: 700px;
	margin: 15px 0;
}
.fdl span {
	position: relative;
}
.fcaption-sharing-main {font-size: 19px; line-height: 1.6; border-radius: 10px; position: relative;
	color: #060606; background-color: #ecf6ff; padding: 13px 30px 13px 30px; margin: 5px auto; text-align: center; height: auto; border: 1px solid #003e8314;} 
.sharing-text { font-size: 13px; font-weight: 600; text-align: center;}
.fcaption-sharing {font-size: 14px; line-height: 1.6; border-radius: 10px; position: relative;
	color: #060606; background-color: #ecf6ff; padding: 13px 30px 13px 30px; height: 83px; margin-bottom: 10px; min-width: 300px; text-align: center; border: 1px solid #003e8314;} 
.fcaption-sharing div {display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; text-align: center;}
.fcaption-sharing-text-box {display: inline-flex;}
.fcaption-share-item {display: flex; }
.fcaption {font-size: 12px; line-height: 1.6; border-radius: 8px; position: relative;
	 color: #060606; background: linear-gradient(317deg, #ecf6ff, #d7ecff); padding: 13px 30px 13px 95px; margin: 20px auto;} 
.fcaption div {display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden;}
.fcaption::before {content: '\f028'; font-family: 'Font Awesome 5 Pro'; font-weight: 300; 
	position: absolute; left: 30px; top: 50%; color: #0057b7; font-size: 38px; transform: translateY(-50%);}
.fplay {width: 83px; background: #187ded; cursor: pointer; color: white; flex-grow: 1;}
.fplay .fas {color: #eee; opacity: 1;}
.js-item-played .fplay .fa-play:before {content: '\f04c'; color: #fdce0c;}
.fdl:hover, .fplay:hover  {background: #0057b7; color: #FFD100 !important; transform: scale(1.01); transition: .1s ease;}
.fdl:hover .fa-play {color: #FFD100;}
.show-text {width: 40px; height: 40px; border-radius: 50%; text-align: center; font-size: 18px; 
	cursor: pointer; background-color: #0057b7; color: #fff; 
position: absolute; bottom: 30px; left: 50%; margin-left: -20px; z-index: 5;}
.ftext[style]::before {content: ''; pointer-events: none; height: 100%; position: absolute; z-index: 3;
	left: 0; right: 0; bottom: 0; background: linear-gradient(to bottom, transparent 0%, #fff 100%);}
.ftext {position: relative;}
.fab:hover {transform: scale(1.02); transition: all .3s ease}

/* FULL STORY STATIC
----------------------------------------------- */
.video-box embed, .video-box object, .video-box video, .video-box iframe, .video-box frame 
{max-width:100% !important; display:block; width:100%; height:400px;}
.mejs-container {max-width:100% !important;}
.full-text {line-height: 1.7; font-size: 15px; padding: 15px;}
.full-text img:not(.emoji) {max-width:100%; margin-top: 10px; margin-bottom: 10px;}
.full-text > img[style*="left"], .full-text > .highslide img[style*="left"] {margin:0 10px 10px 0;}
.full-text > img[style*="right"], .full-text > .highslide img[style*="right"] {margin:0 0 10px 10px;}
.full-text a {text-decoration:underline; color:#06c;}
.full-text a:hover {text-decoration:none;}
.full-text h2, .full-text h3, .full-text h4, .full-text h5 {margin:10px 0;}
.full-text p {margin-bottom:10px;}
.full-text > ul, .full-text > ol {margin:0;}
.full-text > ul li {list-style:disc; margin-left:40px;}
.full-text > ol li {list-style:decimal; margin-left:40px;}

.share-container {
    position: fixed;
    top: 30px;
    right: 25px;
    z-index: 9999;
}
.share-button {
	display: flex !important;
	justify-content: center !important;
	align-items: center !important;
    width: 40px;
    height: 40px;
    border-radius: 12px !important;
    border: none;
    background: linear-gradient(135deg, #187ded, #0f5fc0);
    color: white;
    font-size: 20px;
    cursor: pointer;
    box-shadow: 0 4px 12px rgba(0,0,0,0.1);
    transition: all 0.3s ease;
}
.share-button i {
	font-size: 20px;
}
.share-button:hover {
	transform: scale(1.01) rotate(5deg);
}
.share-icons {
    display: flex;
    flex-direction: column;
    align-items: center;
    margin-top: 10px;
    opacity: 0;
    pointer-events: none;
    transform: translateY(-10px);
    transition: all 0.3s ease;
}
.share-icons a {
    color: white;
    background: rgba(0,0,0,0.6);
    width: 40px;
    height: 40px;
    border-radius: 10px;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 5px 0;
    font-size: 18px;
    transition: all 0.3s ease;
}
.share-icons a:hover {
    background: #187ded;
    transform: scale(1.1);
}
.share-container.active .share-icons {
    opacity: 1;
    pointer-events: auto;
    transform: translateY(0);
}
.sharing-sect {
	background-color: #0057b72e;
	padding: 15px;
	text-align: center;
}
.text-share {
	font-size: 19px;
}
.fshare {
    border-radius: 15px;
    width: auto;
    padding: 0 12px;
    font-size: 12px;
    display: flex;
    align-items: center;
    position: absolute;
    color: #ffffff;
    background-color: #ef0707 !important;
    height: 25px;
    line-height: 25px;
    right: 0;
    bottom: 10px;
}
.fshare .fal {
    font-size: 18px;
    margin-right: 10px;
    vertical-align: middle;
}
.ffav {
    background-color: #03a9f4a1;
    height: 26px;
    line-height: 26px;
    text-align: center;
    border-radius: 5px 0 0 5px;
    font-size: 14px;
    padding: 0 7px;
    color: #ffffff;
    cursor: pointer;
    margin-top: 6px;
    max-width: max-content;
}
.button:not(.color-btn):not([class*=fr]):not(.search-btn):not([class*=owl-]) {
	background-color: #56a4c9;
}
.sidem {
	font-size: 16px;
	font-weight: 500;
	padding: 10px;
	text-align: left;

}
.genre-button {
	background: #e8f4ff;
	padding: 5px 15px;
	margin: 5px;

}

/* new p blocl */

.music-collections-list {
	display: flex;
	flex-wrap: wrap;
	gap: 20px;
	margin: 0 0 35px;
	padding: 0;
	list-style: none;
}

.music-collection-item {
	width: calc(50% - 10px);
	margin: 0;
	padding: 0;
	list-style: none;
}

.music-collection-link {
	display: flex;
	align-items: flex-end;
	position: relative;
	width: 100%;
	height: 190px;
	padding: 20px;
	box-sizing: border-box;
	overflow: hidden;
	border-radius: 10px;
	border: 1px solid #e4e4e4;
	text-decoration: none;
	background-size: cover;
	background-position: center center;
	transition: transform .15s ease, box-shadow .15s ease, border-color .15s ease;
}

.music-collection-link:hover {
	transform: translateY(-3px);
	box-shadow: 0 10px 25px rgba(0,0,0,.08);
	border-color: #d7d7d7;
}

.music-collection-link::after {
	content: "";
	position: absolute;
	inset: 0;
	background:linear-gradient(to top,rgba(0,0,0,.72) 0%,rgba(0,0,0,.30) 55%,rgba(0,0,0,.10) 100%);
}

.music-collection-name {
	position: relative;
	z-index: 2;
	display: block;
	font-size: 22px;
	line-height: 1.2;
	font-weight: 600;
	color: #fff;
	text-shadow: 0 2px 8px rgba(0, 0, 0, 0.5);
}

.music-collection-sublist {
	display: none;
}

/* backgrounds */
.music-collection-item:nth-child(1) .music-collection-link {
	background-image:
		url(../images/playlists/run.webp),
		linear-gradient(135deg,#ff7043,#d84315);
}

.music-collection-item:nth-child(2) .music-collection-link {
	background-image:
		url(../images/playlists/video.webp),
		linear-gradient(135deg,#5c6bc0,#283593);
}

.music-collection-item:nth-child(3) .music-collection-link {
	background-image:
		url(../images/playlists/relax.webp),
		linear-gradient(135deg,#26a69a,#00695c);
}

.music-collection-item:nth-child(4) .music-collection-link {
	background-image:
		url(../images/playlists/christmas.webp),
		linear-gradient(135deg,#43a047,#1b5e20);
}

.music-collection-item:nth-child(5) .music-collection-link {
	background-image:
		url(../images/playlists/rap.webp),
		linear-gradient(135deg,#7e57c2,#4527a0);
}

.music-collection-item:nth-child(6) .music-collection-link {
	background-image:
		url(../images/playlists/carol.webp),
		linear-gradient(135deg,#00897b,#004d40);
}

.music-collection-item:nth-child(7) .music-collection-link {
	background-image:
		url(../images/playlists/cool.webp),
		linear-gradient(135deg,#ef5350,#b71c1c);
}

.music-collection-item:nth-child(8) .music-collection-link {
	background-image:
		url(../images/playlists/newyear.webp),
		linear-gradient(135deg,#26c6da,#006064);
}

.music-collection-item:nth-child(9) .music-collection-link {
	background-image:
		url(../images/playlists/romantic.webp),
		linear-gradient(135deg,#ec407a,#ad1457);
}

.music-collection-item:nth-child(10) .music-collection-link {
	background-image:
		url(../images/playlists/remix.webp),
		linear-gradient(135deg,#ab47bc,#6a1b9a);
}

.music-collection-item:nth-child(11) .music-collection-link {
	background-image:
		url(../images/playlists/rock.webp),
		linear-gradient(135deg,#455a64,#263238);
}

.music-collection-item:nth-child(12) .music-collection-link {
	background-image:
		url(../images/playlists/electro.webp),
		linear-gradient(135deg,#26c6da,#00838f);
}

.music-collection-item:nth-child(13) .music-collection-link {
	background-image:
		url(../images/playlists/car.webp),
		linear-gradient(135deg,#ffa726,#ef6c00);
}

.music-collection-item:nth-child(14) .music-collection-link {
	background-image:
		url(../images/playlists/modern.webp),
		linear-gradient(135deg,#42a5f5,#1565c0);
}

.music-collection-item:nth-child(15) .music-collection-link {
	background-image:
		url(../images/playlists/pop.webp),
		linear-gradient(135deg,#ffca28,#f57f17);
}

.music-collection-item:nth-child(16) .music-collection-link {
	background-image:
		url(../images/playlists/soul.webp),
		linear-gradient(135deg,#8e24aa,#4a148c);
}

.music-collection-item:nth-child(17) .music-collection-link {
	background-image:
		url(../images/playlists/fun.webp),
		linear-gradient(135deg,#66bb6a,#2e7d32);
}

.music-collection-item:nth-child(18) .music-collection-link {
	background-image:
		url(../images/playlists/hits.webp),
		linear-gradient(135deg,#ef5350,#c62828);
}

.music-collection-item:nth-child(19) .music-collection-link {
	background-image:
		url(../images/playlists/popular.webp),
		linear-gradient(135deg,#5c6bc0,#283593);
}

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

	.music-collection-item {
		width: 100%;
	}

	.music-collection-link {
		height: 160px;
		padding: 16px;
	}

	.music-collection-name {
		font-size: 24px;
	}

}

/* comments */

.comm-item {
    display: flex;
    align-items: flex-start;
    gap: 15px;
    padding: 15px;
    margin-bottom: 15px;
    background: #fff;
    border-radius: 12px;
    box-shadow: 0 2px 8px rgba(0,0,0,0.05);
    transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.comm-item:hover {
    transform: translateY(-2px);
    box-shadow: 0 4px 14px rgba(0,0,0,0.08);
}

.comm-avatar {
    width: 50px;
    height: 50px;
    border-radius: 50%;
    overflow: hidden;
    flex-shrink: 0;
}

.comm-avatar img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.comm-right {
    flex: 1;
    display: flex;
    flex-direction: column;
}

.comm-one {
    font-size: 13px;
    color: #666;
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-bottom: 6px;
}

.comm-author {
    font-weight: 600;
    color: #13426e;
}

.comm-two {
    font-size: 14px;
    color: #333;
    line-height: 1.4;
    margin-bottom: 8px;
    word-wrap: break-word;
}

.comm-three {
    font-size: 13px;
    color: #555;
    display: flex;
    justify-content: space-between;
}

.comm-rate3 {
    display: inline-flex;
    align-items: center;
    gap: 6px;
}

.comm-rate3 .fa-thumbs-up {color: #28a745; cursor: pointer;}
.comm-rate3 .fa-thumbs-down {color: #dc3545; cursor: pointer;}
.comm-rate3 .fa-thumbs-up:hover {color: #1e7e34;}
.comm-rate3 .fa-thumbs-down:hover {color: #bd2130;}

.reply {
    margin-left: 15px;
    color: #1b88ed;
    cursor: pointer;
    transition: color 0.3s ease;
}
.reply:hover {
    color: #0057b7;
}

.last-comm-link {
    font-size: 14px;
    color: #1b88ed;
    font-weight: 500;
    margin-bottom: 8px;
    display: block;
    text-decoration: none;
}
.last-comm-link:hover {
    color: #0057b7;
    text-decoration: underline;
}

.add-comms {
    background: #fff;
    border-radius: 12px;
    margin: 40px 0 20px;
}

.ac-inputs {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
	padding: 0px 10px;
    margin-bottom: 15px;
}

.ac-inputs input {
    flex: 1;
    padding: 8px 12px;
    border-radius: 8px;
    font-size: 14px;
    transition: border-color 0.2s ease;
}

.ac-inputs input:focus {
    outline: none;
    border-color: #1b88ed;
}

.ac-textarea textarea, 
.ac-textarea .bb-editor {
    width: 100%;
    min-height: 100px;
	margin-top: -5px;
    padding: 10px 10px;
    font-size: 14px;
    border-radius: 8px;
    transition: border-color 0.2s ease;
}

.ac-textarea textarea:focus {
    border-color: #1b88ed;
    outline: none;
}

.ac-protect {
    margin-top: 15px;
	padding: 0px 15px;
}

.form-item {
    margin-bottom: 15px;
}

.form-item label {
    display: block;
    font-weight: 500;
    margin-bottom: 5px;
    font-size: 13px;
    color: #333;
}

.form-item input[type="text"] {
    width: 100%;
    padding: 8px 10px;
    border: 1px solid #ccc;
    border-radius: 8px;
    font-size: 14px;
    transition: border-color 0.2s ease;
}

.form-item input[type="text"]:focus {
    border-color: #1b88ed;
    outline: none;
}

.ac-submit {
    margin-top: 15px;
    text-align: right;
}

.ac-submit button {
    background: #3cb35ce1 !important;
    color: #fff;
    font-weight: 600;
    font-size: 14px;
	margin: 10px;
	width: 100%;
    padding: 10px 18px;
    display: flex !important;
    border: none;
    gap: 10px;
    border-radius: 8px;
    cursor: pointer;
    transition: all 0.1s ease;
    align-items: center;
    align-content: center;
    justify-content: center;
	max-width: stretch;
}

.ac-submit button:hover {
    background: #3cb35c !important;
    transform: translateY(-2px);
}

.c-box {
	border: 1px solid #eee;
	margin: 40px 0px 20px;
	border-radius: 12px;
}

.comms-title {
    font-size: 18px;
    font-weight: 600;
	border-bottom: 1px solid #eee;
    color: #13426e;
    background: linear-gradient(317deg, #ecf6ff, #d7ecff);
    padding: 10px 18px;
    margin: 0px 0 15px 0;
    border-radius: 12px 12px 0px 0px;
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.05);
    display: flex;
    align-items: center;
    gap: 8px;
}

.comms-title::before {
    content: "\f4ad"; 
    font-family: "Font Awesome 5 Pro";
    font-weight: 400;
    font-size: 18px;
    color: #1b88ed;
}

@media (max-width: 550px) {
    .comms-title {
        font-size: 18px;
        padding: 8px 14px;
    }
    .comms-title::before {
        font-size: 16px;
    }
}

@media (max-width: 600px) {
    .comm-item {
        flex-direction: column;
        align-items: flex-start;
    }

    .comm-avatar {
        width: 40px;
        height: 40px;
    }

    .ac-inputs {
        flex-direction: column;
    }

    .ac-submit {
        text-align: center;
    }
}

/* end comments */




.button-block {
	text-align: center;
	margin: 0 auto;
	display: flex;
	border-top: 1px solid #eeeeeea6;
}

.button-section {
    display: flex;
    justify-content: center;
    align-items: center;
    font-weight: 600;
    text-align: center;
    background: linear-gradient(135deg, #1b88ed, #0057b7);
    padding: 0 18px;
    line-height: 40px;
    margin: 12px auto;
    border-radius: 12px;
    width: 340px;
    height: 40px;
    color: #fff;
    cursor: pointer;
    box-shadow: 0 4px 12px rgba(0,0,0,0.08);
    transition: all 0.3s ease;
}

.button-section i {
	margin-left: 5px;
}

.button-section:hover {
    color: #fdce0c !important;
    background: linear-gradient(135deg, #0057b7, #003e83);
    transform: translateY(-2px) scale(1.02);
    box-shadow: 0 6px 18px rgba(0,87,183,0.3);
}

.button-section:active {
    transform: scale(0.97);
    box-shadow: 0 3px 8px rgba(0,87,183,0.2);
}

.button-section a {
    color: inherit;
    text-decoration: none;
    transition: color 0.3s ease;
}

.button-section a:hover {
    color: #fdce0c;
}


.artist-menu {
	margin: 0 auto;
	margin-left: 5px;
    display: flex;
    flex-wrap: nowrap;
    flex-direction: column;
    align-items: flex-start;
    padding: 10px;
    max-width: 227px;
    justify-content: center;
	margin-bottom: 14px;
}

.side-bt-artist {
	font-weight: 600;
    font-size: 17px;
    margin-bottom: 10px;
    background: #ecf6ff;
    height: 45px;
    line-height: 40px;
    padding: 5px 20px;
    border-radius: 10px;
    margin-left: 10px;
}

.side-bt-artist-menu {

	font-weight: 600;
    font-size: 14px;
    color: #13426e;
    background: linear-gradient(270deg, #ecf6ff, #d7ecff);
    line-height: 40px;
    padding: 5px 20px;
    border-radius: 10px 10px 0 0;
    border-bottom: 1px solid rgba(27, 136, 237, 0.3);
    box-shadow: inset 0 -2px 6px rgba(255, 255, 255, 0.6),
                0 2px 6px rgba(0, 0, 0, 0.05);
    height: 50px;
    line-height: 40px;
    padding: 5px 20px;
    border-radius: 10px 10px 0px 0px;
    border-bottom: 1px solid #b4daff;
    margin-left: 15px;
}

[data-switcher] {
	margin-bottom: 30px;
    position: relative;
}
[data-switcher-show] {
    -moz-border-radius: 3px;
    -webkit-border-radius: 3px;
    border-radius: 3px;
    display: inline-block;
    padding: 6px;
    cursor: pointer;
}
[data-switcher-show].selected {
	background: linear-gradient(135deg, #0057b7, #003e83);
	border-radius: 12px;
	color: #fff;
	box-shadow: 0 0 0.875rem 0 #29304215;
}
[data-switcher-name]:not(.selected) {
	display: none;
}

.decorated {
	border-radius: 5px;
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
	margin-bottom: 1.5em;
	display: inline-block;
}
.decorated .decorated-inner {
    padding: .7em 1.2em;
    position: relative;
}

.change-block-text {
	padding: 5px 10px;
	/* margin: 5px auto; */
	font-weight: 400;
	font-size: 13px;
}

.button-change-block {
	display: flex;
	justify-content: flex-start;
    align-items: center;
	margin: 5px auto;
	flex-wrap: wrap;
	padding: 5px 10px;
}



.button-change-cat {
    display: flex;
    justify-content: center;
    align-items: center;
    font-weight: 600;
    text-align: center;
    background: rgba(177, 177, 177, 0.15); /* прозрачный liquid glass */
    padding: 6px 14px;
    margin: 6px 10px;
    border: 1px solid rgba(0, 88, 183, 0.3);
    border-radius: 12px;
    color: #0057b7;
    font-size: 14px;
    height: 34px;
    /* max-width: 140px; */
    flex-grow: 1;
    transition: all 0.3s ease;
    cursor: pointer;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.05);
}

.button-change-cat:hover {
    background: linear-gradient(135deg, #0057b7, #003e83);
    color: #fdce0c !important;
    box-shadow: 0 6px 18px rgba(27, 136, 237, 0.3);
    transform: translateY(-2px);
	border-radius: 12px;

}

.button-change-cat:active {
    transform: translateY(0);
    box-shadow: 0 3px 8px rgba(27, 136, 237, 0.25);
	border-radius: 12px !important;
}

.pagecounter {
	display: flex;
	justify-content: space-between;
}

.pagecounter-item {
	font-size: 14px;
}

.sect-title-changer {
	font-weight: 500; 
	font-size: 16px; 
	background: #ecf6ff;
    line-height: 40px;
	padding: 5px 20px;
	border-radius: 5px;
}

.sect-title-footer {
	font-weight: 500; 
	font-size: 16px; 
	background: #eef6fe;
    line-height: 40px;
	padding: 5px 20px;
	border-radius: 10px 10px 0px 0px;
	border-bottom: 1px solid #002a4e15;
	border: 1px solid #eee;
}

.footer-text {
	padding: 20px; 
	font-weight: 400; 
	font-size: 15px; 
	margin: 0 auto; 
	background-color: #fffaf2; 
	border-radius: 0px 0px 10px 10px;
	position: relative;
	margin-bottom: 15px;
	border: 1px solid #eee;
}

.seo-info-box {
	margin: 0 auto 15px;
	padding: 20px;
	background: #fffaf2;
	border: 1px solid #eee;
	border-radius: 10px;
}

.seo-info-content {
	font-weight: 400;
	font-size: 15px;
	line-height: 1.6;
	color: #222;
}

.seo-info-content h2 {
	margin: 0 0 10px;
	padding: 5px 10px;
	font-size: 16px;
	font-weight: 600;
	line-height: 30px;
	background: #eef6fe;
	border: 1px solid #eee;
	border-bottom: 1px solid #002a4e15;
	border-radius: 10px;
}

.seo-info-content p {
	margin: 0 0 15px;
    padding-left: 10px;
}

.seo-info-content p:last-child {
	margin-bottom: 0;
}


.form-wrap {padding: 10px;}
.ignore-select {padding: 10px;}
.ignore-select:not(article .ignore-select) {
	padding: 0px !important;
}
.h2-sect {font-size: 16px; font-weight: 500;}
/* ADAPTIVE
----------------------------------------------- */

.btn-menu {display: none;}

.side-panel {
	width: 320px;
	height: 100%;
	overflow-x: hidden;
	overflow-y: auto;
	padding: 12px 0;
	z-index: 9999;
	position: fixed;
	left: -320px;
	top: 0;
	transition: left .4s ease;
	background: #f6fbff;
	box-shadow: 12px 0 35px rgba(0, 42, 78, 0.18);
}

.side-panel.active {
	left: 0;
}

.close-overlay {
	width: 100%;
	height: 100%;
	background-color: rgba(0,0,0,0.5);
	position: fixed;
	left: 0;
	top: 0;
	z-index: 9998;
	display: none;
}

.btn-close {
	cursor: pointer;
	display: block;
	left: 280px;
	top: -40px;
	position: fixed;
	z-index: 9999;
	width: 40px;
	height: 40px;
	line-height: 40px;
	text-align: center;
	font-size: 18px;
	background-color: #e84e36;
	color: #fff;
	opacity: 0;
	transition: all .4s ease;
	border-radius: 0 0 0 10px;
}

.btn-close.active {
	top: 0;
	opacity: 1;
}

body.opened-menu {
	overflow: hidden;
	width: 100%;
	height: 100%;
}

.side-panel .nav,
.side-panel .main-nav {
	display: block;
}

.side-panel .main-nav {
	margin: 0 10px 14px;
	padding: 0;
	background: #ffffff;
	border: 1px solid #e6eef6;
	border-radius: 14px;
	overflow: hidden;
	box-shadow: 0 8px 22px rgba(0, 42, 78, 0.06);
}

.side-panel .main-nav > li {
	border: 0;
	border-bottom: 1px solid #eef2f5;
	box-shadow: none;
}

.side-panel .main-nav > li:last-child {
	border-bottom: 0;
}

.side-panel .main-nav > li > a {
	display: block;
	text-align: left;
	padding: 0 15px 0 20px;
	height: 42px;
	line-height: 42px;
	background: #ffffff;
	color: #1f3342;
	font-size: 14px;
	font-weight: 500;
	text-decoration: none;
}

.side-panel .main-nav > li > a:hover {
	background: #eef8ff;
	color: #006ba6;
}

.side-panel .main-nav .fal {
	height: auto;
	font-size: 18px;
	left: 15px;
	right: auto;
	top: 50%;
	transform: translateY(-50%);
}

.side-panel .hidden-menu {
	width: auto;
	margin: 0 10px 14px;
	box-shadow: none;
	column-width: auto;
	column-gap: 0;
	border-radius: 14px;
	position: static;
	visibility: visible;
	transform: none;
	opacity: 1;
	padding: 10px;
	text-align: left;
	background: #ffffff;
	border: 1px solid #e6eef6;
}

.side-panel .hidden-menu li a {
	display: block;
	font-size: 13px;
	white-space: normal;
	margin-bottom: 6px;
	padding: 9px 10px;
	border-radius: 8px;
	color: #1f3342;
	text-decoration: none;
	background: #f8fbfe;
}

.side-panel .hidden-menu li a:last-child {
	margin-bottom: 0;
}

.side-panel .hidden-menu li a:hover {
	background: #eef8ff;
	color: #006ba6;
}


.song-find-panel {
	margin: 25px 0;
	padding: 0;
	background: #ffffff;
	border: 1px solid #eee;
	border-radius: 10px;
	box-shadow: 0 8px 24px rgba(0, 58, 117, 0.07);
	overflow: hidden;
}

.song-find-head {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 15px;
	padding: 14px 18px;
	background: linear-gradient(317deg, #ecf6ff, #d7ecff);
	border-bottom: 1px solid #d8e8f8;
}

.song-find-title {
	display: flex;
	align-items: center;
	gap: 10px;
	color: #063a6f;
	font-size: 18px;
	font-weight: 600;
}

.song-find-title i {
	color: #1d75bd;
	font-size: 16px;
}

.song-find-label {
	padding: 5px 10px;
	background: #ffffff;
	border: 1px solid #eee;
	border-radius: 20px;
	color: #497399;
	font-size: 11px;
	font-weight: 700;
}

.song-find-line {
	display: flex;
	align-items: center;
	gap: 12px;
	height: 46px;
	padding: 0 15px;
	background: #ffffff;
	border: 1px solid #dbe8f5;
	border-radius: 10px;
	color: #111;
	box-shadow: inset 0 1px 0 rgba(255,255,255,0.8);
}

.song-find-line i {
	color: #1d75bd;
	font-size: 15px;
}

.song-find-line span {
	display: block;
	min-width: 0;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
	font-size: 15px;
	font-weight: 700;
}

.song-find-items {
	display: flex;
    padding: 15px;
	background: #fbfdff;
	flex-wrap: wrap;
	gap: 10px;
	margin-top: 10px;
}

.song-find-items span {
	display: inline-flex;
	align-items: center;
	text-transform: lowercase;
	gap: 8px;
	padding: 8px 11px;
	background: #ffffff;
	border: 1px solid #dfeaf5;
	border-radius: 8px;
	color: #263747;
	font-size: 14px;
	line-height: 1.35;
	box-shadow: 0 3px 10px rgba(0, 58, 117, 0.04);
}

.song-find-items span i {
	color: #1d75bd;
	font-size: 14px;
}

@media screen and (max-width: 760px) {
	.song-find-head {
		display: block;
		padding: 13px 15px;
	}

	.song-find-label {
		display: inline-block;
		margin-top: 8px;
	}

	.song-find-main {
		padding: 15px;
	}

	.song-find-items span {
		width: 100%;
	}
}

.fa-cloud-download {
	color: #Fff;
	font-size: 18px;
}

.section-mini-text {
	margin: 0;
	color: #6a7785;
    border: 1px solid #eeeeee7e;
    border-bottom: 0;
    padding: 10px 10px;
    font-weight: 600;
	font-size: 12px;
	line-height: 1.5;
}

.section-mini-text + .speedbar {
	border-top: 1px solid #eeeeeea6;
}

.speedbar:first-child {
	border-radius: 12px;
	border: 1px solid #eeeeee6c;
	/* margin: 0px 10px 15px; */
	overflow: hidden;
}

.main-nav a i {
	margin-right: 7px;
	font-size: 13px;
	opacity: 0.8;
}

.footer-text-home {
	display: flex;
	gap: 18px;
	padding: 24px;
	background: #fff;
	border: 1px solid #e5edf5;
	border-radius: 14px;
}

.footer-text-home-icon {
	display: flex;
	align-items: flex-start;
	justify-content: center;
	min-width: 40px;
    max-width: 110px;
	font-size: 24px;
	color: #5e8fc0;
}

.footer-text-home-icon img {
    border-radius: 10px;
}

.footer-text-home-content h1 {
	margin: 0 0 10px 0;
	font-size: 21px;
	font-weight: 600;
	color: #203d5c;
}

.footer-text-home-content p {
	margin: 0;
	font-size: 15px;
	line-height: 1.7;
	color: #58697b;
}

.site-small-stats {
	display: flex;
	gap: 15px;
	margin-bottom: 20px;
}

.site-small-stats div {
	flex: 1;
	padding: 14px;
	background: #fff;
	border: 1px solid #e5edf5;
	border-radius: 12px;
	text-align: center;
}

.site-small-stats b {
	display: block;
	margin-bottom: 5px;
	font-size: 22px;
	color: #20466d;
}

.site-small-stats span {
	display: block;
	font-size: 13px;
	color: #687789;
}

.side-live-searches-title {
	display: flex;
	align-items: center;
	gap: 8px;
	margin-bottom: 12px;
	color: #23496d;
	font-size: 14px;
	font-weight: 600;
}

.side-live-searches-title i {
	color: #5e8fc0;
	font-size: 14px;
}

.side-live-searches-list {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
    padding: 5px 15px 25px;
}

.side-live-searches-list a {
	display: inline-flex;
	align-items: center;
	padding: 7px 10px;
	background: #f7fbff;
	border: 1px solid #dce7f2;
	border-radius: 20px;
	color: #405366;
	font-size: 13px;
	line-height: 1.3;
	text-decoration: none;
}

.side-live-searches-list a:hover {
	background: #eef6ff;
	border-color: #c9dced;
	color: #1f4f82;
}

.side-playlist a i {
	width: 18px;
	margin-right: 9px;
	color: #5d8fbe;
	font-size: 14px;
	text-align: center;
	flex-shrink: 0;
}

.side-playlist a:hover i {
    color: #fff !important;
}

/* static pages */

.static-page-wrap {
	background: #fff;
	border: 1px solid #ececec;
	border-radius: 12px;
	padding: 25px;
}

.static-page-head {
	padding-bottom: 18px;
	margin-bottom: 20px;
	border-bottom: 1px solid #f0f0f0;
}

.static-page-head h1 {
	font-size: 28px;
	line-height: 1.3;
	color: #222;
	margin: 0 0 8px;
	font-weight: 700;
}

.static-page-subtitle {
	font-size: 14px;
	color: #777;
}

.static-page-box p {
	font-size: 15px;
	line-height: 1.8;
	color: #333;
	margin: 0 0 18px;
}

.static-page-box h2 {
	font-size: 21px;
	color: #222;
	margin: 30px 0 18px;
	font-weight: 700;
}

.static-page-note {
	background: #fafafa;
	border: 1px solid #eeeeee;
	border-radius: 10px;
	padding: 15px;
	margin-bottom: 15px;
	font-size: 14px;
	line-height: 1.7;
	color: #444;
}

.static-page-alert {
	background: #fff8f8;
	border: 1px solid #ffdede;
	border-radius: 10px;
	padding: 15px;
	margin-top: 20px;
	font-size: 14px;
	line-height: 1.7;
	color: #444;
}

.static-page-contact {
	margin-top: 25px;
	font-size: 15px;
	font-weight: 600;
}

.static-page-contact a {
	color: #1565c0;
	text-decoration: none;
}

.static-page-contact a:hover {
	text-decoration: underline;
}

.static-page-footer {
	margin-top: 25px;
	padding-top: 18px;
	border-top: 1px solid #f0f0f0;
	font-size: 13px;
	color: #777;
	text-align: center;
}

.feedback-modern-form {
	display: flex;
	flex-direction: column;
	gap: 20px;
}

.feedback-field-row {
	display: flex;
	gap: 15px;
}

.feedback-field-row .feedback-field {
	flex: 1;
}

.feedback-field label {
	display: block;
	font-size: 14px;
	font-weight: 600;
	color: #222;
	margin: 10px 0px;
}

.feedback-field input[type="text"],
.feedback-field textarea,
.feedback-field select {
	width: 100%;
	border: 1px solid #e7e7e7;
	border-radius: 10px;
	background: #fafafa;
	padding: 14px 15px;
	font-size: 14px;
	color: #222;
	outline: none;
	height: 45px;
	transition: border-color .15s ease, background .15s ease;
	box-sizing: border-box;
}

.feedback-field textarea {
	height: 180px;
	resize: vertical;
	line-height: 1.7;
}

.feedback-field input[type="text"]:focus,
.feedback-field textarea:focus,
.feedback-field select:focus {
	border-color: #cfcfcf;
	background: #fff;
}

.feedback-question-title {
	font-size: 14px;
	color: #444;
	margin-bottom: 12px;
	line-height: 1.6;
}

.feedback-code-box {
	display: flex;
	align-items: center;
	gap: 15px;
	flex-wrap: wrap;
}

.feedback-submit {
	padding-top: 10px;
}

.feedback-submit button {
	height: 48px;
	padding: 0 24px;
	border: 0;
	border-radius: 10px;
	background: #222;
	color: #fff;
	font-size: 14px;
	font-weight: 600;
	cursor: pointer;
	transition: opacity .15s ease;
}

.feedback-submit button:hover {
	opacity: .9;
}

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

	.feedback-field-row {
		flex-direction: column;
		gap: 20px;
	}

}

/* end sp */


@media screen and (max-width: 1220px) {
    .hidemob {
        display: none;
    }

    .side-live-searches-list {
        padding-top: 15px;
    }

	.go-top {
		bottom: 75px;
		right: 15px;
	}

	.share-container {
		width: 45px !important;
		height: 45px !important;
	}
	.share-button {
		width: 45px !important;
		height: 45px !important;
		    background: linear-gradient(135deg, #187ded, #0f5fc0);


	}
	.header {
		border-radius: 0px;
	}
	.wrap {overflow: hidden;}
	.nav, .site-desc .logo {display: none;}
	.btn-menu {
        display: flex;
        align-items: center;
        justify-content: center;
        font-size: 20px;
        margin: 0 10px 0 5px;
        cursor: pointer;
        color: white;
        width: 45px;
        height: 45px;
        border-radius: 12px;
        
        background: linear-gradient(135deg, #187ded, #0f5fc0);
        box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
        transition: all 0.3s ease;
    }

    .btn-menu:hover {
        transform: scale(1.1) rotate(5deg);
        background: linear-gradient(135deg, #ffb800, #ff9500);
    }

	.footer, .site-desc, .cols {padding-left: 5px; padding-right: 5px; margin: 0px 7px;}
	.header  {padding-left: 20px; padding-right: 20px; margin: 0px auto;}
	.col-right {width: 100%; width: calc(100% + 30px); margin: 0 5px;
		border-left: 0;
	}
	.side-item {margin-left: 0; margin-right: 0; padding-right: 15px; padding-left: 46px; width: 50%;}
	.side-item::before {left: 15px;}
	.side-item:nth-child(2n) {border-left: 1px solid #eee;}
	.side-items {display: block; justify-content: flex-start; flex-wrap: wrap;}
	.side-item-icons {
		margin-right: 0px;
		margin-left: 0px;
		padding-left: 10px;
		border-right: 1px solid #eee;
		border-left: 1px solid #eee;
	}

	.side-bt-artist-menu, .visible {margin-left: 0;}
	.side-bt {padding-left: 15px; text-align: center; margin-left: 30px;}
	.side-bt-artist {padding-left: 15px; text-align: center; }
	.side-bt-artist-menu {margin-bottom: 0px;}
	.site-desc {text-align: center; margin-top: 20px;}
	.footer {display: block; text-align: center; padding-top: 60px;}
	.footer-menu {justify-content: center;}
	.footer-menu a {display: inline-block; margin: 0 10px 20px 10px;}
	.logo {-ms-flex-preferred-size: 0; flex-basis: 0; -webkit-box-flex: 1; -ms-flex-positive: 1; flex-grow: 1; 
		max-width: 100%; min-width: 50px;}
	.search-wrap {-ms-flex-order: 10;-webkit-order: 10;order: 10; margin: 0; margin-top: 15px; min-width: 100%;}
	.search-box {max-width: 100%;}
	.wplayer {bottom: 0;}
	.audioplayer, .audioplayer-bar {border-radius: 0; max-width: 100%; left: 0;}

	.video-box embed, .video-box object, .video-box video, .video-box iframe, .video-box frame {height:400px;}
	.artist-menu {
		display: flex;
  		width: auto;
  		flex-direction: column;
	}
	.nav-side {background: #fcfdff  !important;}
	.side-playlist a {
		width: 290px;
		text-align: center;
		font-size: 13px;
		font-weight: 500;
	}
}

@media screen and (max-width: 960px) {
    .footer-text-home-icon {
        display: none;
    }
}

@media screen and (min-width: 768px) {
	.ap-info {
		margin-left: 73%;
		width: 10%;
		color: black;
	}

	.ap-artist {
		color: black;
	}

	.audioplayer-time-duration::before {
		content: '/  ';
		color: black;
	}
	.audioplayer-time-current {
		margin-right: 5px;
		color: black;
	}
	.audioplayer-volume-button a {
		color: #003464;
	}
	.audioplayer-time-duration {
		color: black;
	}
	.ap-btns {
		left: 10%;
	}
	.ap-img {
		display: none;
	}
	.audioplayer-bar {
		max-width: 35%;
		top: 22px;
		height: 17px;
		left: 20%;
		border-radius: 6px;
		color: black;
	}
	.audioplayer {
		border-radius: 0;
		background-color: white;
		color: black;
		border-top: 1px solid #2195f359;
	}	
	.audioplayer-bar {
		background-color: #dadee3;
	}
	.audioplayer-bar-played {
		background-color: #00b3ff;
	}

	.audioplayer-bar-loaded {
		background-color: #cbd1d8;
	}

	.audioplayer-bar-played, .audioplayer-bar-loaded {
		border-radius: 0;
	}
}

@media screen and (max-width: 760px) {
    .site-desc {display: flex; display: flex; flex-direction: column; align-items: center; align-content: center; gap: 15px; padding-bottom: 40px;}
    .site-desc .site-copyright {text-align: center;}
    .links {gap: 30px;}
	.hshare {background: linear-gradient(to top, #3e9cb3, #48b0ca); justify-content: space-between; 
		padding: 10px 15px; margin: 0 -15px; margin-top: 15px; width: 100%; width: calc(100% + 30px); 
		-ms-flex-order: 10;-webkit-order: 10;order: 10;}
	.hshare > * {margin: 0; width: 30px; height: 30px;}
	.header {padding-top: 15px; padding-bottom: 15px;}
	.share-container {top: 15px;}
	.ap-title, .ap-artist {max-width: 100%; color: #001a37;}
	.ap-desc {position: absolute; left: 0; right: 0; bottom:115%; z-index: 5; min-width: 100%; padding: 10px; 
	background-color: #ffffff; box-shadow: 0 0 30px rgba(0,0,0,0.1); visibility: hidden;}
	.ap-mob-btn {display: block; cursor: pointer; font-size: 28px; color: #003e83;}
	.ap-time {-ms-flex-preferred-size: 0; flex-basis: 0; -webkit-box-flex: 1; -ms-flex-positive: 1; flex-grow: 1; 
		max-width: 100%; min-width: 50px; justify-content: flex-end;}
	.ap-desc.is-active {visibility: visible; border-top: 1px solid #1b87ec; border-bottom: 1px solid #1b87ec;}
	.audioplayer-volume {display: none;}
	.audioplayer-time-duration::before {
		content: '/  ';
		color: black;
	}
	.audioplayer-time-current {
		width: 32px;
		margin-right: 5px;
		color: black; }
	.ap-btns {left: 70px; transform: translate(0,-50%);}
	.fcols {display: block;}
	.fimg {margin: 0 auto 15px auto; }
	.fcaption {min-width: 100%; margin-top: 15px;}
	.fdl {margin: 0;}
	.fplay {margin-right: 15px; -ms-flex-preferred-size: 0; -webkit-box-flex: 1; -ms-flex-positive: 1; flex-grow: 1; 
		max-width: 100%; min-width: 50px;}
	.side-menu {
		padding: 20px;
		font-size: 14px;
		margin-top: -30px;
	}
	.sidem {
		font-size: 17px;
		font-weight: 400;
		padding: 10px;
		margin: 0 auto;
		text-align: center;
	}
	.side-bt-playlist {
		font-weight: 600; 
		font-size: 17px; 
		margin-bottom: 10px; 
		background: #ecf6ff;
		height: 45px;
		line-height: 40px;
		padding: 5px 20px;
		border-radius: 10px;
		margin-left: 10px;
		text-align: center;
	}
	.playlist-block {
		display: flex;
        margin: 0 auto;
        position: relative;
        margin-bottom: 40px;
        flex-direction: row;
        flex-wrap: wrap;
        align-items: center;
	}
	.playlist-count {
		line-height: 40px;
	}
	.fcaption-sharing {margin-left: 15px;}
	.button-change-cat {
		margin: 5px 7px;
	}
    .footer-text-home-icon {
        display: none;
    }
}


@media screen and (max-width: 590px) {
	.ac-inputs input {width: 100%;}
	.video-box embed, .video-box object, .video-box video, .video-box iframe, .video-box frame {height:300px;}
	.ui-dialog {width:100% !important;}
	.upop-left, .upop-right {float:none !important; width:100% !important; margin:0; padding:0 20px;}
	.upop-left {margin-bottom:10px; text-align:center;}
	.ui-dialog-buttonset button {display:block; margin:0 0 5px 0; width:100%;}
	#dofullsearch, #searchsuggestions span.seperator {display:none !important;}
	.attach .download-link {margin:0 -15px 0 0; float:none; display:block; padding:0 10px;}
	.attach-info {float:none;}

	.fcaption-sharing {margin-left: 0px; margin-top: 10px; flex-grow: 1;}
	.playlist-link {
		width: 400px;
		height: 100px;
		background-image: url(../images/bg5pl.png);
		background-size: cover;
        background-position: center;
		line-height: 0px;
	}
}

@media screen and (max-width: 510px) {
	.change-block-text {
		width: 500px;
		text-align: center;
	}
	.fsc {
		display: flex;
		flex-direction: column-reverse;
	}
	.finfo {
		width: -webkit-fill-available;
	}
	.finfo li span {
		display: flex;
    	justify-content: flex-end;
	}
    .links {gap: 15px;}
}

@media screen and (max-width: 470px) {
	.wrap-center22 {max-width:360px;}
	.ac-inputs input {width: 100%;}
	.track-item {margin-left: 0px;
        margin-right: 0px; padding: 5px;}
	.track-play { width: 40px; padding-left: 1px;}
	.fcaption {padding: 15px;}
	.fcaption::before {display: none;}
	.track-time {display: none;}
	.track-download-button {
		background-color: #44c567;
		height: 40px;
		line-height: 40px;
		width: 40px;
		border-radius: 5px;
		text-align: center;
		margin-left: 10px;
		font-size: 20px;
	}
	.video-box embed, .video-box object, .video-box video, .video-box iframe, .video-box frame {height:250px;}
	.playlist-link {
		width: 320px;
		height: 100px;
		background-image: url(../images/bg5pl.png);
		background-size: cover;
        background-position: center;
		line-height: 0px;
	}
	.playlist-text {
		font-weight: 700;
    	background: #3d3d3d73;
    	padding: 10px;
    	border-radius: 10px;
    	color: #fff;
	}
}

@media screen and (max-width: 400px) {
	.fcaption-sharing {margin: 10px auto; }
}