@charset "UTF-8";

:root {
--srp-global-cta-mobile: 142px;
--srp-global-cta-desktop: 200px;
--srp-global-column-title-width: 500px;
--srp-extendedPlayer-height: 100vh; }
@keyframes showElement {
from {
opacity: 0; }
to {
opacity: 1; } }
@keyframes hideElement {
from {
opacity: 1; }
to {
opacity: 0; } }
@media only screen and (min-width: 1026px) {
#sonaar-player:not(.sr-float) .player .store {
box-sizing: border-box; }
#sonaar-player:not(.sr-float) .player .store .track-store {
display: flex;
list-style: none;
margin: 0;
padding: 0;
height: 100%; }
#sonaar-player:not(.sr-float) .player .store .track-store li {
height: 100%;
min-width: 74px;
display: flex;
justify-content: center;
align-items: center;
border-left: 1px solid rgba(255, 255, 255, 0.1);
position: relative;
top: 0; }
#sonaar-player:not(.sr-float) .player .store .track-store li a {
height: auto;
max-height: 100%;
display: block;
font-size: 10px;
text-decoration: none;
text-transform: uppercase;
text-align: center;
overflow: hidden;
padding-left: 10px;
padding-right: 10px; }
#sonaar-player:not(.sr-float) .player .store .track-store li a:hover {
transition: 200ms;
filter: brightness(0.75); }
#sonaar-player:not(.sr-float) .player .store .track-store li a i {
pointer-events: none;
display: block;
font-size: 20px;
line-height: 1.5em; }
#sonaar-player:not(.sr-float) .player .store .track-store li .sr_store_round_bt {
border-radius: 4px;
padding: 4px 6px;
margin: 0px 10px;
display: flex;
align-items: center;
justify-content: center; }
#sonaar-player:not(.sr-float) .player .store .track-store li .sr_store_round_bt i.fas {
display: inline-block;
margin-right: 5px;
font-size: 12px; } }
@media only screen and (max-width: 426px) {
#sonaar-player .playlist .tracklist .track-store {
display: none !important; } }
@media only screen and (max-width: 540px) {
#sonaar-player .playlist button.play, #sonaar-player .player .player-row .sr_skipBackward,
#sonaar-player .player .player-row .sr_skipForward,
#sonaar-player .player .player-row .sr_speedRate,
#sonaar-player .player .player-row .shuffle {
display: none !important; } }
@media only screen and (min-width: 425px) and (max-width: 1025px) {
#sonaar-player .playlist .tracklist .track-store {
display: none !important; } }
#sonaar-player {
position: fixed;
bottom: -90px;
color: #fff;
background-color: #000;
width: 100%;
z-index: 8010; }
#sonaar-player .mejs-container {
display: none !important; }
#sonaar-player,
#sonaar-player .player {
height: 90px; }
@media only screen and (max-width: 540px) {
#sonaar-player,
#sonaar-player .player {
height: 56px; }
#sonaar-player div.player,
#sonaar-player .player div.player {
border-width: 0; } }
#sonaar-player.sr_hide {
display: none; }
#sonaar-player:not(.sr_hide):not([v-cloak]) {
display: block !important; }
@media only screen and (max-width: 1025px) {
#sonaar-player .store {
display: none; } }
#sonaar-player.enable {
transition: all 0.03s ease; }
#sonaar-player.enable .btn-player {
top: 0px !important; }
#sonaar-player.enable .btn-player .audioBar {
display: none !important; }
@media only screen and (max-width: 1025px) {
#sonaar-player.enable .store {
position: absolute;
top: 0px;
right: 0px;
transform: translateY(-100%);
width: auto !important;
min-width: 150px;
border-radius: 3px;
z-index: 10000;
display: none; }
#sonaar-player.enable .store .track-store {
font-size: 14px;
list-style: none;
margin: 0;
padding: 0; }
#sonaar-player.enable .store .track-store li {
border: none;
display: block;
padding: 7px; }
#sonaar-player.enable .store .track-store li a {
text-decoration: none;
display: block;
text-align: center;
color: inherit !important;
background-color: inherit !important; }
#sonaar-player.enable .store .track-store li a .fa {
display: inline-block;
padding-right: 10px;
font-size: 1.4em; }
#sonaar-player.enable .store .track-store li a i {
margin-right: 6px; }
#sonaar-player.enable .store .track-store li + li {
border-top: 1px solid rgba(138, 138, 138, 0.25); }
#sonaar-player.enable .store.opened {
display: block;
animation: showElement 0.25s ease-in-out both; }
#sonaar-player.enable .store:not(.opened) {
animation: hideElement 0.25s ease-in-out both; } }
#sonaar-player.show-list {
height: 100%;
z-index: 9999; }
#sonaar-player .sricon-close, #sonaar-player .close {
pointer-events: all;
right: 50px;
top: 45px;
position: absolute;
cursor: pointer; }
#sonaar-player .sricon-close.btn_playlist, #sonaar-player .close.btn_playlist {
font-size: 32px; }
#sonaar-player .sricon-close.btn_playlist:after, #sonaar-player .sricon-close.btn_playlist:before, #sonaar-player .close.btn_playlist:after, #sonaar-player .close.btn_playlist:before {
margin-left: 14px; }
@media only screen and (max-width: 860px) {
#sonaar-player .sricon-close, #sonaar-player .close {
font-size: 18px;
top: 15px;
right: 22px;
z-index: 9999; }
#sonaar-player .sricon-close.btn_playlist, #sonaar-player .close.btn_playlist {
font-size: 18px; } }
#sonaar-player .sricon-close.btn-player, #sonaar-player .close.btn-player {
font-size: 16px;
display: flex;
justify-content: center;
align-items: center;
right: 0;
top: -10px;
transform: translateY(-100%);
width: 24px;
height: 24px; }
@media only screen and (max-width: 860px) {
#sonaar-player .sricon-close.btn-player, #sonaar-player .close.btn-player {
top: -3px; } }
#sonaar-player .sricon-close.btn-player .audioBar, #sonaar-player .close.btn-player .audioBar {
display: block;
width: 16px;
height: 16px;
transform: rotate(180deg);
position: absolute;
top: 4px;
left: 4px; }
#sonaar-player .playerNowPlaying {
width: 342px;
display: flex;
align-items: center; }
#sonaar-player .playerNowPlaying .album-art {
height: calc(100% - 16px);
max-width: 125px;
transition: all 0.5s ease;
margin-left: 8px;
position: relative; }
@media only screen and (max-width: 540px) {
#sonaar-player .playerNowPlaying .album-art {
height: 100%;
margin-left: 0px;
max-width: 90px; } }
#sonaar-player .playerNowPlaying .album-art .loading-icon {
color: #fff;
position: absolute;
width: 100%;
top: 20px;
opacity: 0;
transition: opacity 0.75s ease;
z-index: 1; }
#sonaar-player .playerNowPlaying .album-art.loading-enable.loading .loading-icon {
opacity: 0.8; }
#sonaar-player .playerNowPlaying .album-art img:not(.hover) {
max-width: 100%;
max-height: 100%;
position: relative;
top: 50%;
transform: translateY(-50%); }
#sonaar-player .playerNowPlaying .album-art img.hover {
opacity: 0;
position: absolute;
top: 0;
width: 200px;
max-width: unset;
height: auto;
transition: all 0.5s ease;
transform: translate3d(0, 200px, 0);
z-index: 100; }
@media only screen and (min-width: 540px) {
#sonaar-player .playerNowPlaying .album-art:hover img.hover {
opacity: 1;
transform: translateY(-100%) translate3d(0, 0, 0); } }
#sonaar-player .playerNowPlaying.no-image .metadata {
margin-left: 10px;
margin-right: 0px;
width: inherit; }
@media only screen and (max-width: 540px) {
#sonaar-player .playerNowPlaying.no-image .metadata {
margin-right: 10px; } }
#sonaar-player .playerNowPlaying .metadata {
position: relative;
letter-spacing: 1px;
width: 245px;
height: 100%;
overflow: hidden;
white-space: nowrap;
margin: 0 0 0 20px;
line-height: 1.65em; }
#sonaar-player .playerNowPlaying .metadata .track-name,
#sonaar-player .playerNowPlaying .metadata .track-artist,
#sonaar-player .playerNowPlaying .metadata .track-album {
float: left;
clear: left; }
#sonaar-player .playerNowPlaying .metadata .track-name.scrolling,
#sonaar-player .playerNowPlaying .metadata .track-artist.scrolling,
#sonaar-player .playerNowPlaying .metadata .track-album.scrolling {
transition: transform 5s linear; }
#sonaar-player .playerNowPlaying .metadata .track-name .duplicate,
#sonaar-player .playerNowPlaying .metadata .track-artist .duplicate,
#sonaar-player .playerNowPlaying .metadata .track-album .duplicate {
padding-left: 10px; }
#sonaar-player .playerNowPlaying .metadata .metadata-inner {
position: relative;
top: 50%;
transform: translateY(-50%); }
#sonaar-player .playerNowPlaying .metadata .metadata-inner:after {
content: "";
clear: both;
display: table; }
#sonaar-player .playerNowPlaying .metadata .track-artist,
#sonaar-player .playerNowPlaying .metadata .track-album {
font-size: 0.7em;
line-height: 1em; }
@media only screen and (max-width: 860px) {
#sonaar-player .playerNowPlaying .metadata {
font-size: 14px; } }
@media only screen and (max-width: 540px) {
#sonaar-player .playerNowPlaying .metadata {
font-size: 12px;
width: calc(100% - 50px);
margin: 0 10px;
max-width: 300px; } }
@media only screen and (max-width: 860px) {
#sonaar-player .playerNowPlaying {
width: auto;
flex: 1; } }
@media only screen and (max-width: 860px) and (min-width: 541px) {
#sonaar-player .no-list .playerNowPlaying .metadata {
width: calc(100% - 215px); } }
#sonaar-player .playlist {
font-size: 18px;
box-sizing: border-box;
height: calc(100vh - 90px);
position: absolute;
width: 100%; }
#sonaar-player .playlist .scroll {
height: calc(100vh - 320px);
width: 100%;
top: 100px;
position: absolute;
display: flex;
overflow-y: hidden; }
#sonaar-player .playlist .container {
min-height: 0;
width: 100%;
max-width: 1144px;
height: auto;
align-self: center;
margin: auto;
padding: 0 20px;
background-color: transparent; }
#sonaar-player .playlist .container .boxed {
height: auto;
width: 100%; }
#sonaar-player .playlist .title {
margin-bottom: 20px;
display: block;
text-align: center;
font-size: 54px;
line-height: 1.265em; }
@media only screen and (max-width: 860px) {
#sonaar-player .playlist .title {
box-sizing: border-box;
font-size: 18px;
text-transform: uppercase;
position: fixed;
top: 0;
left: 0;
width: 100vw;
margin: 0;
padding: 20px; } }
#sonaar-player .playlist button.play {
padding: 12px 34px;
border-radius: 50px;
border: none;
font-family: Tahoma, sans-serif;
font-size: 14px;
text-transform: uppercase;
position: relative;
left: 50%;
transform: translate(-50%, 0);
margin: 0 auto 50px auto;
outline: none;
cursor: pointer; }
#sonaar-player .playlist .tracklist {
list-style-type: none;
margin: 0;
padding: 0;
display: table;
width: 100%; }
@media only screen and (max-width: 540px) {
#sonaar-player .playlist .tracklist {
display: block; } }
#sonaar-player .playlist .tracklist li {
filter: brightness(70%);
font-weight: inherit;
display: table-row;
line-height: 2.4em;
cursor: pointer; }
#sonaar-player .playlist .tracklist li.active {
filter: brightness(100%);
font-weight: 700; }
@media only screen and (max-width: 860px) {
#sonaar-player .playlist .tracklist li {
font-size: 15px; } }
@media only screen and (max-width: 540px) {
#sonaar-player .playlist .tracklist li {
display: block;
line-height: 1.265em;
margin-bottom: 1.265em;
position: relative; } }
#sonaar-player .playlist .tracklist span {
display: table-cell; }
#sonaar-player .playlist .tracklist span .content {
background-color: unset;
margin: 0; }
@media only screen and (min-width: 540px) {
#sonaar-player .playlist .tracklist span .content {
line-height: 1.3em;
display: block;
overflow: hidden;
text-overflow: ellipsis; } }
@media only screen and (max-width: 540px) {
#sonaar-player .playlist .tracklist span {
display: inline-block; } }
@media only screen and (max-width: 540px) {
#sonaar-player .playlist .tracklist .track-status {
font-size: 12px;
font-weight: 300; } }
@media only screen and (max-width: 540px) {
#sonaar-player .playlist .tracklist .srp_track_control {
position: absolute; } }
#sonaar-player .playlist .tracklist .sricon-play {
font-size: 15px;
padding-right: 7px; }
@media only screen and (max-width: 540px) {
#sonaar-player .playlist .tracklist .sricon-play {
font-size: 12px;
padding-right: 0; } }
@media only screen and (max-width: 540px) {
#sonaar-player .playlist .tracklist .track-lenght {
font-size: 12px;
font-weight: 300;
position: absolute;
right: 0px;
top: 0; } }
#sonaar-player .playlist .tracklist .track-store {
display: flex;
justify-content: start;
column-gap: 15px; }
#sonaar-player .playlist .tracklist .track-store a {
text-decoration: none;
font-size: 20px; }
@media only screen and (max-width: 540px) {
#sonaar-player .playlist .tracklist .track-title {
display: block;
width: 100%;
padding-left: 20px; } }
@media only screen and (max-width: 540px) {
#sonaar-player .playlist .tracklist .track-artist,
#sonaar-player .playlist .tracklist .track-album {
font-size: 12px;
font-weight: 300;
padding-left: 20px; } }
@media only screen and (max-width: 540px) {
#sonaar-player .playlist .tracklist .track-artist + .track-album {
padding-left: 10px; } }
#sonaar-player.audio-playing .playlist .tracklist li.active .sricon-play:before {
content: '\e81c'; }
#sonaar-player.srp_mobile .playlist {
z-index: 15555;
background: inherit;
height: 100%; }
#sonaar-player.srp_mobile .playlist .container {
align-self: normal;
margin: 0; }
#sonaar-player.srp_mobile .playlist .sricon-close.close {
position: fixed;
left: 22px;
top: 18px; }
#sonaar-player.srp_mobile .scroll {
top: 64px;
height: calc(100% - 64px); }
#sonaar-player.srp_mobile .player .control {
padding: 0; }
#sonaar-player .player {
width: 100%;
position: absolute;
left: 0;
bottom: 0;
top: auto;
border-width: 4px;
border-style: solid;
border-left: none;
border-bottom: none;
border-right: none; }
#sonaar-player .player .player-row {
display: flex;
height: 100%; }
#sonaar-player .player .player-row .sr_skipBackward,
#sonaar-player .player .player-row .sr_skipForward {
font-size: 25px; }
@media only screen and (max-width: 540px) {
#sonaar-player .player .player-row:before {
content: "";
width: 100%;
height: calc(100% - 5px);
display: block;
position: absolute;
bottom: 0;
z-index: 55; } }
@media only screen and (max-width: 540px) {
#sonaar-player .player .player-row .playerNowPlaying,
#sonaar-player .player .player-row .control,
#sonaar-player .player .player-row .sonaar-extend-button {
z-index: 60; } }
#sonaar-player .player .control--item.list:hover, #sonaar-player .player .control--item.previous:hover, #sonaar-player .player .control--item.play:hover, #sonaar-player .player .control--item.next:hover, #sonaar-player .player .control--item.shuffle:hover,
#sonaar-player .player .control--item.volume .sricon-volume:hover:before {
filter: brightness(0.75);
transition: 300ms; }
#sonaar-player .player .mobilePanel {
position: absolute;
top: 0px;
width: 100%;
transform: translateY(calc(-100% + 4px));
z-index: 50;
border-bottom: 4px solid; }
#sonaar-player .player .mobilePanel .sonaar-extend-button {
position: absolute;
top: 0;
right: 0; }
#sonaar-player .player .control {
padding: 0 15px;
margin: 0;
list-style: none;
display: flex;
justify-content: flex-start;
flex-wrap: wrap;
column-gap: 22px; }
#sonaar-player .player .control .control--item {
position: relative;
text-align: center;
height: 100%;
cursor: pointer;
opacity: 1;
display: flex;
justify-content: center;
align-items: center; }
#sonaar-player .player .control .control--item.play {
background: unset; }
@media only screen and (max-width: 860px) {
#sonaar-player .player .control {
margin-right: 20px; } }
@media only screen and (max-width: 767px) {
#sonaar-player .player .control {
margin-right: 15px; } }
@media only screen and (max-width: 540px) {
#sonaar-player .player .control {
min-width: 40px;
margin-right: 0; } }
@media only screen and (max-width: 860px) {
#sonaar-player .player .sr_progressbar_sticky {
display: none !important; } }
#sonaar-player .sr_progressbar_sticky {
width: auto;
position: relative;
display: flex;
flex: 1;
align-items: center;
margin: 0 5px; }
#sonaar-player .sr_progressbar_sticky .timing {
font-variant-numeric: tabular-nums;
width: 100%;
display: flex;
flex-direction: row;
align-items: center;
justify-content: space-between;
font-size: 11px;
line-height: 1em; }
#sonaar-player .sr_progressbar_sticky .sr-progress {
width: calc(100% - 200px);
position: absolute;
height: 90px;
left: 75px;
bottom: 0; }
#sonaar-player .sr_progressbar_sticky .sr-progress .sr-wavebar {
position: absolute;
height: 1px;
left: 0;
top: 50%; }
#sonaar-player .sr_progressbar_sticky .sr-progress .progress_totalTime {
width: 100%; }
#sonaar-player .sr_progressbar_sticky .sr-progress .progress_currentTime {
height: 3px;
top: calc(50% - 1px); }
#sonaar-player .sr_progressbar_sticky .sr-progress .skip {
width: 100%;
height: 100%;
position: absolute;
top: 0;
left: 0; }
#sonaar-player .sr_progressbar_sticky #sPlayer {
display: flex;
align-items: center;
height: 100%;
opacity: 0;
transition: all 3000ms ease;
overflow: hidden;
width: calc(100% - 100px);
max-height: calc(100% - 6px);
left: 47px; }
#sonaar-player .sr_progressbar_sticky #sPlayer.sr_hide {
opacity: 0; }
#sonaar-player .sr_progressbar_sticky #sPlayer.reveal {
opacity: 1; }
#sonaar-player .progressLoading {
background: rgba(255, 255, 255, 0.25);
width: 0%;
height: 1px;
box-shadow: 0 0 2px rgba(255, 255, 255, 0.5);
width: calc(100% - 562px);
position: absolute;
left: 552px;
top: 45px;
transition: opacity 3000ms ease; }
#sonaar-player .wave {
position: absolute;
left: 30px; }
#sonaar-player .wave wave {
transition: width 400ms;
width: 100%;
position: absolute;
overflow-x: hidden !important; }
#sonaar-player.sr-float {
bottom: -56px; }
@media only screen and (min-width: 541px) {
#sonaar-player.sr-float .player .mobilePanel {
border-width: 0;
transform: unset;
top: 3px; } }
@media only screen and (max-width: 540px) {
#sonaar-player.sr-float .player .mobilePanel {
transform: translateY(calc(-100% + 5px));
border-width: 5px; } }
#sonaar-player.sr-float .close.btn-player rect {
fill: #fff; }
#sonaar-player.sr-float .control .control--item.list.sricon-list {
font-size: 18px; }
#sonaar-player.sr-float .control .sricon-back, #sonaar-player.sr-float .control .sricon-forward, #sonaar-player.sr-float .control .sricon-play {
font-size: 17px; }
#sonaar-player .shuffle {
width: 20px; }
#sonaar-player.hide-track-lenght .playlist .tracklist .track-lenght {
display: none; }
#sonaar-player.hide-track-category .playlist .tracklist .track-album {
display: none; }
#sonaar-player .sonaar-extend-button {
height: 100%;
width: 25px;
display: flex;
justify-content: center;
align-items: center;
font-size: 16px;
line-height: 16px;
text-align: center;
margin-right: 5px;
cursor: pointer; }
@media only screen and (min-width: 1026px) {
#sonaar-player .sonaar-extend-button {
display: none; } }
#sonaar-player .sonaar-extend-button i {
position: relative;
display: block; }
#sonaar-player .mobileProgress {
width: 100%;
position: absolute;
top: -6px;
z-index: 10;
cursor: pointer; }
#sonaar-player .mobileProgress .skip {
position: absolute;
width: 100%;
height: 390%;
top: -130%;
z-index: 10; }
@media only screen and (min-width: 861px) {
#sonaar-player .mobileProgress {
display: none; } }
#sonaar-player .mobileProgressing {
height: 6px;
position: relative; }
#sonaar-player .mobileProgressing:after {
content: '';
position: absolute;
top: 0;
left: 0;
height: 100%;
width: 100%; }
#sonaar-player .progressDot {
height: 10px;
width: 10px;
border-radius: 5px;
position: absolute;
top: 50%;
left: 0;
transform: translate(-50%, -50%);
display: none; }
body:not(.continuousPlayer-enable) #sonaar-player .progressDot {
opacity: 0; }
#sonaar-player.sr-float:not(.show-list),
#sonaar-player.sr-float .player {
height: 50px; }
#sonaar-player.sr-float:not(.sr_hide):not([v-cloak]) {
display: flex !important;
left: unset; }
#sonaar-player.sr-float {
background-color: unset; }
#sonaar-player.sr-float:not(.srp_ext_opened) {
pointer-events: none; }
#sonaar-player.sr-float.sr-pos--left {
justify-content: flex-start; }
#sonaar-player.sr-float.sr-pos--center {
justify-content: center; }
#sonaar-player.sr-float.sr-pos--right {
justify-content: flex-end; }
#sonaar-player.sr-float.audio-playing .player:hover .mobileProgress {
display: block;
opacity: 1; }
@media only screen and (max-width: 861px) {
#sonaar-player.sr-float.audio-playing .player.audio-playing .mobileProgress {
display: block;
opacity: 1; } }
#sonaar-player.sr-float .player {
pointer-events: all;
margin: 20px;
left: unset;
border-radius: 10px;
width: auto;
border-width: 0px; }
#sonaar-player.sr-float .player .control .control--item {
margin: 0 1px; }
@media only screen and (min-width: 861px) {
#sonaar-player.sr-float .player.sr-show_controls_hover {
transition: 800ms width;
width: 342px; }
#sonaar-player.sr-float .player.sr-show_controls_hover:hover {
width: 100%; }
#sonaar-player.sr-float .player.sr-show_controls_hover:hover .playerNowPlaying {
width: 270px; }
#sonaar-player.sr-float .player.sr-show_controls_hover .player-row {
display: flex;
justify-content: flex-end; }
#sonaar-player.sr-float .player.sr-show_controls_hover .playerNowPlaying {
position: absolute;
width: 300px;
height: 100%;
left: 0;
transition: 800ms width;
z-index: 2; } }
@media only screen and (max-width: 861px) {
#sonaar-player.sr-float .player.sr-show_controls_hover {
width: calc(100% - 20px) !important;
transform: unset !important; } }
#sonaar-player.sr-float .player:hover .close.btn-player {
opacity: 1; }
#sonaar-player.sr-float .player .mobileProgress {
transition: 400ms;
top: unset;
bottom: -8px;
width: 100%;
left: 0px; }
#sonaar-player.sr-float .player .mobileProgressing {
height: 3px; }
#sonaar-player.sr-float .sr_progressbar_sticky {
display: none; }
#sonaar-player.sr-float .playlist {
pointer-events: all;
height: 100%; }
#sonaar-player.sr-float .album-art img:last-child {
border-radius: 10px 0px 0px 10px; }
#sonaar-player.sr-float .playerNowPlaying .metadata {
margin: 0 10px; }
#sonaar-player.sr-float .playerNowPlaying .metadata .track-album {
display: none; }
#sonaar-player.sr-float .playerNowPlaying .album-art {
margin-left: 0;
height: 100%; }
@media only screen and (min-width: 1026px) {
#sonaar-player.sr-float .sonaar-extend-button {
display: flex; } }
#sonaar-player.sr-float.enable .store {
position: absolute;
top: -1px;
right: 70px;
transform: translateY(-100%);
width: auto !important;
min-width: 150px;
border-radius: 3px;
z-index: 10000;
display: none; }
@media only screen and (max-width: 861px) {
#sonaar-player.sr-float.enable .store {
right: 10px; } }
#sonaar-player.sr-float.enable .store .track-store {
font-size: 14px;
list-style: none;
margin: 0;
padding: 0; }
#sonaar-player.sr-float.enable .store .track-store li {
border: none;
display: block;
padding: 7px; }
#sonaar-player.sr-float.enable .store .track-store li a {
text-decoration: none;
display: block;
text-align: right;
color: inherit !important;
background-color: inherit !important; }
#sonaar-player.sr-float.enable .store .track-store li a .fa {
display: inline-block;
padding-right: 10px;
font-size: 1.4em; }
#sonaar-player.sr-float.enable .store .track-store li a i {
margin-right: 6px; }
#sonaar-player.sr-float.enable .store .track-store li + li {
border-top: 1px solid rgba(138, 138, 138, 0.25); }
#sonaar-player.sr-float.enable .store.opened {
display: block;
animation: showElement 0.25s ease-in-out both; }
#sonaar-player.sr-float.enable .store:not(.opened) {
animation: hideElement 0.25s ease-in-out both; }
@media only screen and (max-width: 861px) {
#sonaar-player.sr-float .player {
width: calc(100% - 20px);
max-width: unset;
margin: 10px; }
#sonaar-player.sr-float .player .close.btn-player.enable {
opacity: 1; }
#sonaar-player.sr-float .player .mobileProgress {
opacity: 0;
bottom: 0px; } }
@media only screen and (min-width: 861px) {
#sonaar-player.sr-float .mobileProgress {
display: block;
opacity: 0; } }
@media only screen and (max-width: 540px) {
#sonaar-player.sr-float .player .control {
min-width: 42px; } }
#sonaar-player.sr-float:not(.enable) .player {
transition-delay: 350ms;
width: 100% !important;
max-width: 100%;
margin: 0px;
top: 0px !important;
left: 0px !important; }
#sonaar-player.sr-float .close.btn-player {
right: 0px;
top: 0px; }
#sonaar-player.sr-float .close.btn-player.enable {
transition: 400ms;
opacity: 0;
width: 17px;
height: 15px; }
#sonaar-player.sr-float .close.btn-player.enable:before, #sonaar-player.sr-float .close.btn-player.enable:after {
height: 7px;
top: 5px; }
#sonaar-player.sr-float .close.btn-player.enable:before {
left: 10px; }
#sonaar-player.sr-float .close.btn-player.enable:after {
left: 6px; }
#sonaar-player.sr-fullwidth .sonaar_wave_base,
#sonaar-player.sr-fullwidth .sonaar_wave_cut {
height: 40px; }
#sonaar-player.sr-mini_fullwidth:not(.show-list),
#sonaar-player.sr-mini_fullwidth .player {
height: 42px; }
#sonaar-player.sr-mini_fullwidth {
bottom: -48px; }
#sonaar-player.sr-mini_fullwidth .player {
border-width: 2px; }
#sonaar-player.sr-mini_fullwidth .player .control .control--item {
margin: 0 1px; }
#sonaar-player.sr-mini_fullwidth .mobileProgress {
top: -3px; }
#sonaar-player.sr-mini_fullwidth .mobileProgressing {
height: 3px; }
#sonaar-player.sr-mini_fullwidth .playerNowPlaying .metadata {
margin: 0 10px; }
#sonaar-player.sr-mini_fullwidth .playerNowPlaying .metadata .track-album {
display: none; }
#sonaar-player.sr-mini_fullwidth .playerNowPlaying .album-art {
margin-left: 0;
height: 100%; }
@media only screen and (min-width: 1026px) {
#sonaar-player.sr-mini_fullwidth .store .track-store li a {
font-size: 8px; }
#sonaar-player.sr-mini_fullwidth .store .track-store li a i {
font-size: 12px; } }
@media only screen and (max-width: 540px) {
#sonaar-player.sr-mini_fullwidth .player .control {
min-width: 42px; } }
#sonaar-player.sr-mini_fullwidth .close.btn-player.enable {
width: 17px;
height: 19px; }
#sonaar-player.sr-mini_fullwidth .close.btn-player.enable:before, #sonaar-player.sr-mini_fullwidth .close.btn-player.enable:after {
height: 7px;
top: 5px; }
#sonaar-player.sr-mini_fullwidth .close.btn-player.enable:before {
left: 10px; }
#sonaar-player.sr-mini_fullwidth .close.btn-player.enable:after {
left: 6px; }
#sonaar-player.sr-mini_fullwidth .sonaar_wave_base,
#sonaar-player.sr-mini_fullwidth .sonaar_wave_cut {
height: 27px; }
#sonaar-player.sr-mini_fullwidth .control .control--item.list.sricon-list {
font-size: 18px; }
#sonaar-player.sr-mini_fullwidth .control .sricon-back, #sonaar-player.sr-mini_fullwidth .control .sricon-forward, #sonaar-player.sr-mini_fullwidth .control .sricon-play {
font-size: 17px; }
#sonaar-player .sr_speedRate div {
color: #000;
background: #fff; }
.sr_skip_number {
font-size: 10px;
font-weight: 600;
line-height: 1;
position: absolute; }
.sr_skipBackward,
.sr_skipForward {
font-size: 22px;
cursor: pointer;
user-select: none;
display: flex;
align-items: center;
justify-content: center; }
.sr_speedRate {
display: flex;
align-items: center;
justify-content: center;
font-weight: 400;
font-size: 12px;
line-height: 1;
cursor: pointer; }
.sr_speedRate div {
color: #fff;
background: #000;
padding: 3px;
text-align: center;
border-radius: 3px;
user-select: none; }
#sonaar-player .sr_speedRate:not(.active) div {
opacity: 0.5; }
#sonaar-player [class*="sricon-"]::before {
margin-left: 0;
margin-right: 0; }
#sonaar-player.audio-playing .control .sricon-play:before {
content: '\e81c'; }
#sonaar-player .control .sricon-back, #sonaar-player .control .sricon-forward, #sonaar-player .control .sricon-shuffle, #sonaar-player .control .srp_repeat {
font-size: 19px; }
#sonaar-player .control .sricon-play {
font-size: 26px; }
#sonaar-player .control .control--item.list.sricon-list {
font-size: 20px; }
#sonaar-player .control .control--item.list.sricon-list::before {
width: 30px; }
#sonaar-player .sricon-volume {
font-size: 22px; }
#sonaar-player.srp_mobile > .srp_spectrum_container {
display: none !important; }
#sonaar-player .player .control .control--item.sricon-shuffle:not(.active), #sonaar-player .sricon-shuffle:not(.active) {
opacity: 0.4; }
.sricon-volume.active:before, .iron-audioplayer[data-mute="true"] .sricon-volume:before {
content: '\e826'; }
#sonaar-player div.volume {
padding: 0 20px; }
@media only screen and (max-width: 860px) {
#sonaar-player div.volume {
display: none; } }
#sonaar-player .volume,
.iron-audioplayer .volume {
display: flex;
align-items: center; }
#sonaar-player .volume .slider-container,
.iron-audioplayer .volume .slider-container {
position: absolute;
width: 30px;
height: 100px;
left: 50%;
top: 0px;
transform: translate(-50%, -100%);
background: #fff;
z-index: 200;
border: 1px solid #bbb;
box-shadow: 1px 1px 5px rgba(0, 0, 0, 0.5);
border-radius: 1px;
display: none; }
#sonaar-player .volume .slider-container .slide,
.iron-audioplayer .volume .slider-container .slide {
width: 100%;
height: 70px;
position: absolute;
top: 20px;
cursor: pointer; }
#sonaar-player .volume .slider-container .slide:before,
.iron-audioplayer .volume .slider-container .slide:before {
content: "";
position: absolute;
width: 1px;
height: 100%;
left: 50%;
top: -5px;
opacity: 0.5; }
#sonaar-player .volume .slider-container .ui-slider-range,
.iron-audioplayer .volume .slider-container .ui-slider-range {
position: absolute;
width: 2px;
height: 60%;
bottom: 0;
left: calc(50% - 1px); }
#sonaar-player .volume .slider-container .ui-slider-handle,
.iron-audioplayer .volume .slider-container .ui-slider-handle {
width: 7px;
height: 7px;
border-radius: 100%;
position: absolute;
left: calc(50% - 3px);
cursor: pointer; }
#sonaar-player .volume .slider-container .trigger,
.iron-audioplayer .volume .slider-container .trigger {
height: calc(100% - 20px);
width: 100%;
top: 10px;
position: absolute; }
#sonaar-player .volume .slider-container:before,
.iron-audioplayer .volume .slider-container:before {
width: 0;
height: 0;
border: none;
border-left: 5px solid transparent;
border-right: 5px solid transparent;
border-top: 5px solid #bbb;
content: "";
position: absolute;
bottom: -6px;
left: 50%;
transform: translate(-50%); }
#sonaar-player .volume .slider-container:after,
.iron-audioplayer .volume .slider-container:after {
width: 0;
height: 0;
border: none;
border-left: 5px solid transparent;
border-right: 5px solid transparent;
border-top: 6px solid #fff;
content: "";
position: absolute;
bottom: -5px;
left: 50%;
transform: translate(-50%); }
#sonaar-player .volume .sricon-volume,
.iron-audioplayer .volume .sricon-volume {
display: initial;
width: 22px;
max-height: calc(90% - 12px);
cursor: pointer;
position: relative;
line-height: 0; }
#sonaar-player .volume .sricon-volume:hover .slider-container,
.iron-audioplayer .volume .sricon-volume:hover .slider-container {
display: block; }
.iron-audioplayer .sr-cf-heading {
position: relative;
align-items: center;
column-gap: 10px;
display: flex;
overflow: hidden;
width: auto;
padding-bottom: 10px;
font-weight: 600;
text-transform: uppercase;
border-bottom: 1px solid #ffffff21; }
.iron-audioplayer .sr-cf-heading.srmp3-heading--hide {
display: none !important; }
.iron-audioplayer .sr-cf-heading .srp_sort.asc::after {
content: "\002B06";
font-size: 10px;
padding-left: 3px; }
.iron-audioplayer .sr-cf-heading .srp_sort.desc::after {
content: "\002B07";
font-size: 10px;
padding-left: 3px; }
.iron-audioplayer .sr-cf-heading .sr-playlist-heading-child {
pointer-events: auto;
cursor: pointer;
justify-content: left;
align-items: center;
overflow: hidden;
text-overflow: ellipsis;
text-align: left;
white-space: nowrap;
font-size: 11px;
width: 100%; }
.iron-audioplayer.srp_has_customfields.srp_tracklist_grid .srp_tracklist_waveform_enabled .tracklist-item-title {
flex: 1; }
.iron-audioplayer.srp_has_customfields .tracklist-item-title {
flex: 1; }
.iron-audioplayer.srp_has_customfields .srp_tracklist_waveform_enabled .tracklist-item-title {
flex: 0 0 250px; }
.iron-audioplayer.srp_has_customfields .srp_tracklist_waveform_enabled .audio-track {
overflow: hidden;
flex: 1 1 fit-content; }
.iron-audioplayer.srp_has_customfields .srp_tracklist_waveform_enabled .sr-playlist-cf-container {
flex: 0 1 fit-content; }
.iron-audioplayer.srp_has_customfields .sr-playlist-item {
overflow-x: hidden; }
.iron-audioplayer.srp_has_customfields .srp_audio_trigger .audio-track {
width: 10%; }
.iron-audioplayer.srp_has_customfields .sr-playlist-cf-container {
align-items: center;
font-size: 11px;
flex: 1;
display: flex;
overflow: hidden;
justify-content: space-evenly;
column-gap: 10px;
font-size: 0.8em; }
.iron-audioplayer.srp_has_customfields .sr-playlist-cf-container .sr-playlist-cf-child {
justify-content: left;
overflow: hidden;
text-overflow: ellipsis;
text-align: left;
width: 100%;
align-items: center; }
.iron-audioplayer.srp_has_customfields .sr-playlist-cf-container .sr-playlist-cf-child img {
margin-right: 5px;
max-height: 20px; }
.iron-audioplayer.srp_has_customfields .sr-playlist-cf-container .sr-playlist-cf-child i {
margin-right: 5px; }
.iron-audioplayer.srp_has_customfields .audio-track {
flex: 0 1 var(--srp-global-column-title-width); }
.iron-audioplayer.srp_has_customfields .sr-playlist-cf-container {
flex: 0 1 calc(100% - var(--srp-global-column-title-width)); }
.iron-audioplayer.srp_has_customfields:not(.srp_tracklist_grid) .sr-playlist-item:not(.srp_extended) .song-store-list-menu {
max-width: var(--srp-global-cta-desktop); }
.iron-audioplayer.srp_has_customfields .sr-playlist-item.srp_extended .song-store-list-menu {
max-width: 999px; }
.iron-audioplayer.srp_has_customfields .sr-playlist-item .store-list {
flex: 0 0 var(--srp-global-cta-desktop);
align-items: center; }
.iron-audioplayer.srp_has_customfields:not(.srp_tracklist_grid) .playlist .store-list .song-store-list-menu {
justify-content: flex-start !important;
width: var(--srp-global-cta-desktop);
overflow: hidden;
position: absolute !important;
right: 0; }
.iron-audioplayer.srp_has_customfields .srp_list:not(.srp_contentLoading) .song-store-list-menu {
transition: 0.2s ease; }
.iron-audioplayer.srp_has_customfields.playlist_has_no_ctas .store-list {
display: none; }
.iron-audioplayer.srp_has_customfields.srp_responsive .sr-playlist-item .store-list {
flex: 0 0 var(--srp-global-cta-mobile); }
.iron-audioplayer.srp_has_customfields.srp_responsive .playlist .store-list .song-store-list-menu {
width: var(--srp-global-cta-mobile); }
.iron-audioplayer.srp_has_customfields .store-list .srp_ellipsis {
font-size: 14px;
transition: 0.15s;
top: 50%;
transform: scale(1) translateY(-50%); }
.iron-audioplayer.srp_has_customfields .srp_extended .srp_ellipsis {
opacity: 0;
transform: scale(0) translateY(-50%); }
.iron-audioplayer.srp_has_customfields .srp_extendable .srp_ellipsis {
padding: 5px;
z-index: 55; }
.iron-audioplayer.srp_has_customfields .sr-playlist-item:not(.srp_extendable) .srp_ellipsis {
display: none; }
.iron-audioplayer .srp_search_main {
padding-bottom: 20px; }
.iron-audioplayer .playlist ul.srp_pagination {
height: auto !important; }
.iron-audioplayer .playlist ul .ps__rail-y {
height: 0px !important; }
.iron-audioplayer:not(.srp_has_customfields) .playlist.srp_tracklist_waveform_enabled .tracklist-item-title {
flex: 0 1 350px; }
.iron-audioplayer .ui-slider-handle,
.iron-audioplayer .ui-slider-range {
background: #000; }
.iron-audioplayer .sr_skip_number {
font-size: 8px;
line-height: 11px; }
.iron-audioplayer .sr-playlist-item[data-post-url]:not([data-post-url=""]) .sr_track_cover {
cursor: pointer; }
.iron-audioplayer[data-playertemplate="skin_boxed_tracklist"] .sr_shuffle {
display: flex; }
.iron-audioplayer[data-playertemplate="skin_boxed_tracklist"] .sr_speedRate {
font-size: 8px;
line-height: 9px;
font-weight: 600; }
.iron-audioplayer[data-playertemplate="skin_boxed_tracklist"] .sr_speedRate div {
border-width: 1.5px; }
.iron-audioplayer[data-playertemplate="skin_boxed_tracklist"] .sr_mute,
.iron-audioplayer[data-playertemplate="skin_boxed_tracklist"] .sr_unmute {
width: 18px; }
.iron-audioplayer[data-playertemplate="skin_boxed_tracklist"] .srp_wave_box.srp_progressbar_inline {
display: flex;
flex-wrap: wrap; }
.iron-audioplayer[data-playertemplate="skin_boxed_tracklist"] .srp_wave_box.srp_progressbar_inline .player {
margin-right: 15px;
flex-grow: 1;
width: unset; }
.iron-audioplayer[data-playertemplate="skin_boxed_tracklist"] .srp_wave_box.srp_progressbar_inline .player .sr_progressbar {
width: auto; }
.iron-audioplayer[data-playertemplate="skin_boxed_tracklist"] .srp_show_prevnext_bt .next, .iron-audioplayer[data-playertemplate="skin_boxed_tracklist"] .srp_show_prevnext_bt .previous {
display: block !important; }
.iron-audioplayer[data-playertemplate="skin_boxed_tracklist"] .srp_control_left .srp_progressbar_inline {
flex-direction: row-reverse; }
.iron-audioplayer.audio-playing .srp_player_boxed .sricon-play:before {
content: '\e81c'; }
.iron-audioplayer.srp_favorites_loading .srp-fav-bt {
opacity: 0.3; }
.iron-audioplayer .srp-fav-bt {
transition: opacity 0.2s; }
.sr_mute {
display: none; }
.iron-audioplayer[data-mute="true"] .sr_unmute {
display: none; }
.iron-audioplayer[data-mute="true"] .sr_mute {
display: initial; }
.sr_shuffle {
cursor: pointer; }
.iron-audioplayer:not([data-shuffle="true"]) .control .sricon-shuffle {
opacity: 0.4; }
.continuousPlayer-enable #srmp3_lyricsplaying_container {
transition: 200ms;
bottom: 90px; }
@media only screen and (max-width: 540px) {
.continuousPlayer-enable #srmp3_lyricsplaying_container {
bottom: 62px; } }
@media only screen and (max-width: 768px) {
.srp_sticky_ext_opened.continuousPlayer-enable #srmp3_lyricsplaying_container {
bottom: 0px;
z-index: 10100; }
.srp_sticky_ext_opened.continuousPlayer-enable #srmp3_lyrics_container {
z-index: 10050; } }
#srmp3_lyricsplaying_container {
cursor: pointer;
display: flex;
justify-content: center;
align-items: flex-end;
max-width: 100%;
width: 100%;
bottom: 0px;
position: fixed;
z-index: 8000; }
.srmp3_lyrics tt {
font-family: inherit; }
.srmp3_lyrics p[begin] {
margin-bottom: 1em; }
@media only screen and (max-width: 540px) {
.srmp3_lyrics p[begin] {
margin-bottom: 0.7em; } }
.srmp3_lyrics p[begin] {
transition: color 1s ease; }
.srmp3_lyrics_container {
pointer-events: none;
padding: 4px 10px;
display: flex;
justify-content: center;
text-align: center;
color: #fff;
background-color: #000;
font-style: italic;
font-size: 21px; }
.srmp3_lyrics_container:before,
.srmp3_lyrics_container:after {
content: '♪';
margin: 0px 8px; }
#srmp3_lyrics_container {
position: fixed;
color: #575757;
background-color: #000;
top: 0px;
width: 100%;
height: 100%;
padding: 100px;
text-align: left;
z-index: 7999; }
#srmp3_lyrics_container .srmp3_lyrics {
font-size: 48px;
font-weight: 700;
line-height: 1em;
height: calc(100vh - 320px);
top: 100px;
margin-top: 20px;
overflow-y: hidden; }
#srmp3_lyrics_container .srmp3_lyrics .ps__rail-y {
height: 0px !important; }
@media only screen and (max-width: 540px) {
#srmp3_lyrics_container .srmp3_lyrics {
font-size: 24px;
line-height: 1em;
height: calc(100vh - 150px); } }
#srmp3_lyrics_container .srmp3_lyrics_title {
color: #fff;
font-size: 24px; }
@media only screen and (max-width: 540px) {
#srmp3_lyrics_container .srmp3_lyrics_title {
font-size: 18px; } }
#srmp3_lyrics_container .srmp3_lyrics_album {
color: #a7a7a7;
font-size: 18px; }
@media only screen and (max-width: 540px) {
#srmp3_lyrics_container {
padding: 30px;
bottom: 50px; } }
#srmp3_lyrics_container .sricon-close-circle {
position: absolute;
top: 50px;
right: 50px;
font-size: 48px;
line-height: 1;
cursor: pointer; }
@media only screen and (max-width: 767px) {
#srmp3_lyrics_container .sricon-close-circle {
top: 25px;
right: 25px; } }
@media only screen and (max-width: 767px) {
#srmp3_lyrics_container .srmp3_lyrics_album,
#srmp3_lyrics_container .srmp3_lyrics_title {
padding-right: 25px; } }
.srp_player_boxed .srp_note {
position: absolute;
top: 10px;
left: 10px;
height: 100%;
max-height: calc(100% - 20px);
width: calc(100% - 20px);
overflow-y: auto; }
.srp_player_boxed .srp_note h1 {
width: calc(100% - 35px); }
.srp_note {
position: relative;
background: #fff;
color: #000;
width: 100%;
z-index: 25;
padding: 25px;
border-radius: 4px; }
.sr-playlist-item .srp_note {
margin-top: 10px; }
.srp_note ul {
margin: inherit !important;
padding: 15px !important;
height: initial !important;
overflow-y: visible !important;
overflow-x: visible !important; }
.srp_note ul li {
list-style: disc !important;
padding: initial !important; }
.srp_note .sr_close {
top: 20px;
right: 20px; }
.sr-playlist-item .srp_note .sr_close {
display: none; }
.srp_note_title,
.srp-modal-title {
font-size: 1.7em;
line-height: 1.2;
font-weight: inherit;
color: inherit;
margin-bottom: 1rem; }
.srp-modal-subtitle {
font-size: 1.2em;
line-height: 1.2;
font-weight: inherit;
color: inherit;
margin-bottom: 1rem; }
.srp-modal-product-desc {
margin-bottom: 1rem; }
@media only screen and (max-width: 450px) {
#sonaar-player[data-ui-items="1"] .playerNowPlaying {
width: calc(100% - 50px); }
#sonaar-player[data-ui-items="2"] .playerNowPlaying {
width: calc(100% - 100px); }
#sonaar-player[data-ui-items="3"] .playerNowPlaying {
width: calc(100% - 150px); }
#sonaar-player[data-ui-items="4"] .playerNowPlaying {
width: calc(100% - 200px); }
#sonaar-player .playerNowPlaying {
width: calc(100% - 75px); }
#sonaar-player[data-ui-items="1"] .playerNowPlaying.no-image {
width: calc(100% - 45px); }
#sonaar-player[data-ui-items="2"] .playerNowPlaying.no-image {
width: calc(100% - 75px); }
#sonaar-player[data-ui-items="3"] .playerNowPlaying.no-image, #sonaar-player[data-ui-items="4"] .playerNowPlaying.no-image {
width: calc(100% - 115px); }
#sonaar-player .playerNowPlaying.no-image {
width: 100%; }
#sonaar-player .playerNowPlaying.no-image .metadata {
width: 100%; } }
.sonaar-player-slidefade-enter-active {
transition: 800ms all ease; }
.sonaar-player-slidefade-leave-active {
transition: all 0.4s ease; }
.sonaar-player-slidefade-enter {
transform: scale(0.8);
opacity: 0; }
.sonaar-player-slidefade-leave-to {
opacity: 0; }
@media only screen and (max-width: 1025px) {
.sonaar-player-storefade-enter-active {
transition: all 0.03s ease; } }
@media only screen and (max-width: 1025px) {
.sonaar-player-storefade-leave-active {
transition: all 0.03s ease; } }
@media only screen and (max-width: 1025px) {
.sonaar-player-storefade-enter {
transform: translateY(70px); } }
@media only screen and (max-width: 1025px) {
.sonaar-player-storefade-leave-to {
transform: translateY(70px); } }
.woocommerce-page.single-product .iron-audioplayer .srp_tracklist {
margin: 0px; }
@media (max-width: 991px) {
.woocommerce-page.single-product .iron-audioplayer .playlist {
margin-top: 0px; } }
.woocommerce-LoopProduct-link .tracklist-item-time {
display: none; }
.woocommerce-LoopProduct-link .iron-audioplayer .player .wave {
margin: 0px 0px; }
.woocommerce-LoopProduct-link .iron-audioplayer .sonaar-Artwort-box {
margin-bottom: initial; }
.woocommerce ul.products li.product a .album-art img {
margin: 0px; }
.woocommerce .iron-audioplayer .playlist .audio-track {
text-align: left; }
.woocommerce ul.products li.product.srmp3-product.srmp3-product__hideimage a img.attachment-woocommerce_thumbnail, .woocommerce ul.products li.product.srmp3-product.srmp3-product__hideimage a img.woocommerce-placeholder {
display: none; }
@media only screen and (min-width: 540px) {
#pusher-wrap.sonaar-list-active {
-webkit-animation: blur 0.5s linear forwards;
-moz-animation: blur 0.5s linear forwards;
-ms-animation: blur 0.5s linear forwards;
-o-animation: blur 0.5s linear forwards;
animation: blur 0.5s linear forwards; } }
@-webkit-keyframes blur {
from {
-webkit-filter: blur(0);
filter: blur(0); }
to {
-webkit-filter: blur(20px);
filter: blur(20px); } }
@-moz-keyframes blur {
from {
-webkit-filter: blur(0);
filter: blur(0); }
to {
-moz-filter: blur(20px);
filter: blur(20px); } }
@keyframes blur {
from {
-webkit-filter: blur(0);
filter: blur(0); }
to {
-webkit-filter: blur(20px);
-moz-filter: blur(20px);
filter: blur(20px); } }
.sonaar-list-active #pusher {
overflow-y: hidden;
overflow-x: hidden;
height: 100vh; } .srp_tracklist .ps,
.srmp3_lyrics.ps {
height: 250px;
overflow: hidden !important;
overflow-anchor: none;
-ms-overflow-style: none;
touch-action: auto;
-ms-touch-action: auto; }
.srp-modal-medium-size {
max-width: 100%;
width: 800px; }
.srp-modal-variant-file {
text-transform: uppercase;
font-size: 0.8em;
font-weight: 700; }
.srp-license-preview-modal .srp_variant_terms {
margin-top: 35px;
margin-bottom: 20px;
padding-bottom: 20px;
border-bottom: 1px solid rgba(255, 255, 255, 0.08); }
.srp_variant_terms .view-license-button {
width: 100%; }
.srp-modal-share {
max-width: 100%;
width: 600px; }
.srp-modal-share .srp-share-title {
margin: 0 28px 0 0;
padding: 0;
font-size: 21px;
font-weight: 600;
white-space: nowrap;
text-overflow: ellipsis;
overflow: hidden; }
.srp-modal-share .srp-share-trackinfo-container {
display: flex;
align-items: center;
justify-content: flex-start;
column-gap: 15px;
margin: 12px 0 24px; }
.srp-modal-share .srp-share-trackinfo-container .srp-share-tracktitle {
font-size: 18px;
font-weight: 600;
overflow: hidden; }
.srp-modal-share .srp-share-trackinfo-container .srp-share-img {
display: flex;
flex-shrink: 0;
width: 72px;
height: 72px;
border-radius: 3px; }
.srp-modal-share .srp-modal-sticky-player-container {
display: flex;
column-gap: 15px;
margin-top: 10px;
margin-bottom: 10px;
align-items: center; }
.srp-modal-share .srp-modal-sticky-player-container input#stickyPlayerCheckbox, .srp-modal-share .srp-modal-sticky-player-container input#stickyPlayerTimeCheckbox {
width: 15px;
height: 15px; }
.srp-modal-share .srp-modal-sticky-player-container .srp-modal-sticky-player-label {
font-size: 13px;
font-weight: 600;
text-transform: uppercase;
letter-spacing: .8px; }
.srp-modal-share .srp-modal-sticky-player-container #stickyPlayerCurrentTime {
height: 30px;
font-size: 14px;
width: 85px;
padding: 10px; }
.srp-modal-share .srp-modal-linkurl-container .srp-modal-linkurl-label {
font-size: 13px;
font-weight: 600;
text-transform: uppercase;
letter-spacing: .8px; }
.srp-modal-share .srp-modal-linkurl-container .srp-modal-linkurl-input-container {
padding: 0 5px 0 12px;
overflow: hidden;
border: unset;
position: relative;
display: flex;
align-items: center;
width: 100%;
height: 44px;
border-radius: 5px;
background-color: #dfdfdf;
margin: 5px 0; }
.srp-modal-share .srp-modal-linkurl-container .srp-modal-linkurl-input-container i {
margin-left: 0;
margin-right: -5px;
font-size: 18px;
color: #9b9b9b; }
.srp-modal-share .srp-modal-linkurl-container .srp-modal-linkurl-input-container input {
white-space: nowrap;
text-overflow: ellipsis;
overflow: hidden;
font-size: 14px;
width: 100%;
height: 100%;
padding: 0 15px;
font-size: 13px;
font-weight: 500;
background-color: transparent;
border-radius: 5px;
box-shadow: none;
border: none; }
.srp-modal-share .srp-modal-linkurl-container .srp-modal-linkurl-input-container input:focus-visible {
outline: unset; }
.srp-modal-share .srp-modal-linkurl-container .srp-modal-linkurl-input-container button {
color: inherit;
background: transparent;
box-sizing: border-box;
position: relative;
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
cursor: pointer;
outline: none;
border: none;
-webkit-tap-highlight-color: transparent;
display: inline-block;
white-space: nowrap;
text-decoration: none;
vertical-align: baseline;
text-align: center;
margin: 0;
line-height: 36px;
padding: 0 16px;
border-radius: 4px;
overflow: visible; }
.srp-modal-share .srp-modal-socialshare-container {
display: flex;
align-items: flex-start;
flex-wrap: wrap;
margin-top: 24px;
column-gap: 25px;
row-gap: 20px; }
.srp-modal-share .srp-modal-socialshare-container a {
text-decoration: none;
color: var(--srp-global-modal-btn-bg-color);
font-size: 42px; }
.srp-modal-share .srp-modal-socialshare-container a.srp-share-mobile-more i {
font-size: 26px; }
.srp-modal-share .srp-modal-socialshare-container a.srp-share-mobile-more {
display: flex;
height: 42px;
align-items: center; }
.srp-modal-share .srp-modal-socialshare-container .sricon {
-webkit-font-smoothing: antialiased;
display: flex;
font-style: normal;
font-variant: normal;
text-rendering: auto;
line-height: 1; }
.srp-modal-share .srp-modal-socialshare-container .sricon:before {
margin-right: 0px;
margin-left: 0px; }
.srp_popup_no_image .srp-modal-product-variation-trackinfo-container {
flex-direction: column-reverse; } .srp-modal-product-variation { }
.srp-modal-product-variation .srp-modal-product-variation-trackinfo-container {
display: flex;
align-items: flex-start;
justify-content: flex-start;
column-gap: 15px;
margin: 12px 0 24px; }
.srp-modal-product-variation .srp-modal-product-variation-trackinfo-container .srp-modal-image {
display: flex;
flex-shrink: 0;
width: 72px;
height: 72px;
border-radius: 3px; }
.srp-modal-product-variation .srp-modal-title {
font-weight: 700; }
.srp-modal-product-variation .srp-modal-variant-name {
font-weight: 500; }
.srp-modal-product-variation .srp-modal-subtitle {
font-size: 11px;
text-transform: uppercase; }
.srp-modal-product-variation .srp-modal-variant-desc {
font-size: 11px;
text-transform: uppercase;
margin-top: 10px; }
.srp-modal-variation-list {
display: flex;
flex-wrap: wrap;
gap: 10px;
grid-template-columns: 1fr 1fr 1fr;
margin: 20px 0 50px; }
.srp-modal-variant-selector {
background-color: #0202022b;
border: 1px solid #fff0;
border-radius: 8px;
padding: 10px 10px;
max-width: calc(33% - 7px);
min-width: 170px;
width: 100%;
cursor: pointer; }
.srp-modal-variant-selector:hover, .srp-modal-variant-selector.srp_selected {
background-color: #02020261; }
@media only screen and (max-width: 860px) {
.srp-modal-variant-selector {
max-width: initial; } }
.srp-modal-variant-main {
display: flex;
column-gap: 12px;
row-gap: 10px;
align-items: center;
justify-content: flex-end;
flex-wrap: wrap;
padding-top: 20px; }
@media only screen and (max-width: 860px) {
.srp-modal-variant-main {
justify-content: flex-start; } }
.srp-modal-variant-main,
.srp_variant_terms {
border-top: 1px solid rgba(255, 255, 255, 0.08); }
.srp_term_title {
font-weight: bold;
margin: 10px 0; }
.srp_variant_terms_container.srp_variant_terms--column {
display: flex;
flex-wrap: wrap;
column-gap: 15px; }
.srp_variant_terms_container.srp_variant_terms--column .srp_variant_terms {
max-width: 300px;
min-width: 150px;
flex: 1; }
.srp_variant_terms_container.srp_variant_terms--column .srp_term_meta {
width: 100%; }
.srp_term_meta_list {
display: flex;
flex-wrap: wrap;
align-items: center; }
.srp_term_meta {
display: flex;
align-items: center;
width: calc(100% / 3);
height: 60px;
font-size: 0.9rem; }
.srp_term_meta:before {
font-size: 22px; }
@media only screen and (max-width: 860px) {
.srp_term_meta {
width: 50%; } }
.srp_term_meta i[class*=" fa-"] {
font-family: 'Font Awesome 5 Free';
font-style: unset; }
.srp_term_meta_label {
padding: 0 5px;
font-size: 0.8em;
text-transform: uppercase; }
.srp-modal-variant-price {
flex-grow: 1;
font-size: 1.3em;
font-weight: bold;
line-height: 1; }
.srp-modal-custom-link a {
text-decoration: unset;
font-size: 16px;
font-weight: 600;
color: var(--srp-global-modal-btn-bg-color); }
.srp-modal-custom-link a:hover {
color: var(--srp-global-modal-btn-bg-color);
filter: brightness(0.5); }
.srp-modal-custom-link i {
margin-right: 5px; }
.srp-modal-variation-details:not(.srp_selected) {
display: none; }
.srp-modal-variation-details .srp-modal-variant-price {
font-size: 1.8em; }
.srp_reg_price {
text-decoration: line-through;
opacity: 0.7; }
.srmp3_button_launcher_style-round .srmp3_sonaar_ts_shortcode.srmp3_sonaar_ts_shortcode_button {
width: 200px;
height: 200px;
border-radius: 50% !important;
display: flex !important;
align-items: center;
justify-content: center; }
.srmp3_sonaar_ts_shortcode.sricon-play::before {
vertical-align: middle;
font-size: 0.75em;
text-decoration: none;
margin: 0em 0.2em 0.22em 0em; }
.srmp3_sonaar_ts_shortcode.srmp3_sonaar_ts_shortcode_button {
background-color: #000;
border-radius: 4px;
padding: 5px 15px;
color: #fff;
text-decoration: none !important;
width: fit-content; }
.srmp3_sonaar_ts_shortcode.srmp3_sonaar_ts_shortcode_button.srmp3_sonaar_ts--block {
display: block; }
.srp_button {
color: inherit;
text-decoration: inherit;
display: inline-block;
padding: 10px 30px;
border-radius: 4px;
background-color: #0170b9; }
.srp_button:hover {
filter: brightness(0.7); }
.srp_button .fas.fa-cart-plus {
font-family: 'Font Awesome 5 Free';
font-weight: 900; }
.srp_button i {
padding-right: 10px; }
.srp_button.added:after {
font-family: WooCommerce;
content: "\e017";
margin-left: 0.53em;
vertical-align: bottom; }
#sonaar-player .tracklist .wc-forward {
font-size: 0.8em !important; }
#sonaar-player .player-row .wc-forward {
position: absolute;
color: #000 !important;
display: block;
background: #fff;
padding: 10px;
border: 1px #000 solid;
top: -42px; }
.woocommerce .iron-audioplayer .sr-playlist-item .wc-forward {
padding-top: 0px; }
.srmp3_sonaar_ts_shortcode.sricon-play.audio-playing:before {
content: '\e81c'; }
.srmp3_sonaar_ts_shortcode.audio-playing .srp_ts_content {
display: none; }
.srmp3_sonaar_ts_shortcode:not(.audio-playing) .srp_ts_content_pause {
display: none; } .srp_hidden.sr-playlist-cf-child, .srp_hidden.srp_sort {
opacity: 0;
z-index: -1;
pointer-events: none;
position: absolute; }
.srp_filter_error {
color: red;
font-family: sans-serif;
font-size: 12px;
line-height: 16px;
margin-top: 10px; }
.srp-filters-container {
display: flex;
justify-content: start;
column-gap: 12px;
width: 100%;
row-gap: 12px;
flex-wrap: wrap;
align-items: start; }
.srp-filters-container input.multiselect__input {
color: inherit;
margin: 0px;
border: none;
padding: inherit;
transition: unset; }
.srp-filters-container .srp-filters-widget {
font-size: 16px;
width: 200px; }
.srp-filters-container .multiselect {
color: inherit; }
.srp-filters-container .multiselect .multiselect__select {
height: 100%;
width: 100%;
display: flex;
justify-content: flex-end;
align-items: center;
padding: 0 15px; }
.srp-filters-container .multiselect .multiselect__select:before {
position: static;
margin-top: 0;
-webkit-transition: -webkit-transform 0.2s ease;
transition: -webkit-transform 0.2s ease;
transition: transform 0.2s ease;
transition: transform 0.2s ease, -webkit-transform 0.2s ease;
-webkit-transform: rotateZ(270deg);
transform: rotateZ(270deg); }
.srp-filters-container .multiselect.multiselect--active .multiselect__select {
-webkit-transform: unset;
transform: unset; }
.srp-filters-container .multiselect.multiselect--active .multiselect__select:before {
-webkit-transform: rotateZ(360deg);
transform: rotateZ(360deg); }
.srp-filters-container .multiselect__placeholder {
color: inherit;
margin-bottom: initial;
padding-top: initial; }
.srp-filters-container .multiselect--active {
z-index: 2; }
.srp-filters-container .srp-filters-widget .multiselect--active .multiselect__placeholder {
display: inline-block; }
.srp-filters-container .multiselect__single {
margin-bottom: 0px; }
.srp-filters-container .multiselect__single, .srp-filters-container .multiselect__multiple {
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap; }
.srp-filters-container .multiselect__input, .srp-filters-container .multiselect__single {
background: unset; }
.srp-filters-container .multiselect__tags {
display: flex;
align-items: center;
padding: 10px;
white-space: nowrap;
overflow: hidden;
color: #000;
background-color: #fff; }
.srp-filters-container .multiselect__content-wrapper {
position: absolute;
margin-top: -1px;
width: inherit;
padding: 10px;
font-size: 14px;
color: #fff;
background: #000; }
.srp-filters-container .multiselect__content-wrapper ul.multiselect__content {
color: inherit;
width: inherit; }
.srp-filters-container .multiselect__content-wrapper li.multiselect__element {
color: inherit; }
.srp-filters-container .multiselect__content-wrapper li.multiselect__element:not(:nth-last-child(3)) {
border-bottom: 1px solid #ffffff29; }
.srp-filters-container .multiselect__option {
display: flex;
min-height: initial;
padding: 12px 5px; }
.srp-filters-container .multiselect__option span {
overflow: hidden;
text-overflow: ellipsis; }
.srp-filters-container .multiselect__option, .srp-filters-container .multiselect__tags, .srp-filters-container .multiselect, .srp-filters-container .multiselect__input, .srp-filters-container .multiselect__single {
font-size: inherit;
font-family: inherit;
font-weight: inherit;
line-height: inherit; }
.srp-filters-container .multiselect__option--selected {
font-weight: inherit;
color: inherit;
background: unset; }
.srp-filters-container .multiselect__option--selected.multiselect__option--highlight {
color: inherit;
background: unset; }
.srp-filters-container .multiselect__option--selected.multiselect__option--highlight:after {
color: inherit;
background: unset; }
.srp-filters-container .multiselect__option:after {
font-size: inherit; }
.srp-filters-container .multiselect__option--selected::after {
content: "✓" !important;
margin-left: 20px;
color: inherit; }
.srp-filters-container .multiselect__option:hover {
background: #cccccc2b;
border-radius: 6px;
color: inherit; }
.srp-filters-container .multiselect__option--highlight {
background: unset;
color: inherit; }
.srp_range_wrapper {
width: 100%;
display: flex;
column-gap: 10px;
flex-wrap: wrap; }
.srp_range_wrapper .srp_range_container {
width: 200px;
flex-grow: 1;
margin-bottom: 10px;
padding: 20px;
background-color: #fff;
border-radius: 4px; }
.srp_range_wrapper .srp_range_container .srp_range_header {
margin-bottom: 10px;
display: flex;
font-size: 14px;
flex-wrap: wrap;
column-gap: 10px;
justify-content: space-between;
align-items: center; }
.srp_range_wrapper .srp_range_container .vue-slider-process {
background-color: var(--e-global-color-primary, #000);
border-radius: 15px; }
.srp_range_wrapper .srp_range_container .srp_range_buttons {
display: flex;
flex-wrap: wrap;
justify-content: center;
column-gap: 3px;
row-gap: 3px; }
.srp_range_wrapper .srp_range_container .srp_range_buttons .srp_filter_button {
font-size: 11px;
padding: 5px 10px;
color: #fff;
background-color: var(--e-global-color-primary, #000);
border: unset; }
.srp_range_wrapper .srp_range_container .srp_range_buttons .srp_filter_button:focus {
opacity: 0.8;
outline: unset; }
.srp_range_wrapper .srp_range_container .srp_range_buttons .srp_filter_button:hover {
color: #fff;
padding: 5px 10px;
background-color: var(--e-global-color-primary, #000); }
.srp_range_wrapper .vue-slider {
margin-bottom: 30px;
z-index: 1; }
.srp_range_wrapper .vue-slider-mark {
z-index: 4; }
.srp_range_wrapper .vue-slider-mark:first-child .vue-slider-mark-step, .srp_range_wrapper .vue-slider-mark:last-child .vue-slider-mark-step {
display: none; }
.srp_range_wrapper .vue-slider-mark-step {
width: 100%;
height: 100%;
border-radius: 50%;
background-color: rgba(0, 0, 0, 0.16); }
.srp_range_wrapper .vue-slider-mark-label {
font-size: 14px;
white-space: nowrap; }
.srp_range_wrapper .vue-slider-dot-handle {
cursor: pointer;
width: 100%;
height: 100%;
border-radius: 50%;
background-color: #fff;
box-sizing: border-box;
box-shadow: 0.5px 0.5px 2px 1px rgba(0, 0, 0, 0.32); }
.srp_range_wrapper .vue-slider-dot-handle-focus {
box-shadow: 0px 0px 1px 2px var(--e-global-color-primary, #00000050); }
.srp_range_wrapper .vue-slider-dot-tooltip-inner {
font-size: 14px;
white-space: nowrap;
padding: 2px 5px;
min-width: 20px;
text-align: center;
color: #fff;
border-radius: 5px;
border-color: var(--e-global-color-primary, #000);
background-color: var(--e-global-color-primary, #000);
box-sizing: content-box; }
.srp_range_wrapper .vue-slider-dot-tooltip-inner::after {
content: "";
position: absolute; }
.srp_range_wrapper .vue-slider-dot-tooltip-inner-top::after {
top: 100%;
left: 50%;
transform: translate(-50%, 0);
height: 0;
width: 0;
border-color: transparent;
border-style: solid;
border-width: 5px;
border-top-color: inherit; }
.srp_range_wrapper .vue-slider-dot-tooltip-wrapper {
opacity: 0;
transition: all 0.3s; }
.srp_range_wrapper .vue-slider-dot-tooltip-wrapper-show {
opacity: 1; }
.srp_range_wrapper .vue-slider-dot-tooltip-inner {
-webkit-transition: opacity 0.2s linear, -webkit-transform 0.4s cubic-bezier(0.25, 0.8, 0.25, 1);
transition: opacity 0.2s linear, -webkit-transform 0.4s cubic-bezier(0.25, 0.8, 0.25, 1);
transition: transform 0.4s cubic-bezier(0.25, 0.8, 0.25, 1), opacity 0.2s linear;
transition: transform 0.4s cubic-bezier(0.25, 0.8, 0.25, 1), opacity 0.2s linear, -webkit-transform 0.4s cubic-bezier(0.25, 0.8, 0.25, 1); }
.srp_range_wrapper .vue-slider-dot-tooltip-show .vue-slider-dot-tooltip-inner {
opacity: 1; }
.srp_range_wrapper .vue-slider-dot-tooltip-show .vue-slider-dot-tooltip-inner-top {
-webkit-transform: rotate(0deg);
transform: rotate(0deg); }
.srp_range_wrapper .vue-slider-dot-tooltip-inner-top {
-webkit-transform: translateY(50%) scale(0.01) rotate(0deg);
transform: translateY(50%) scale(0.01) rotate(0deg); }
.srp_range_wrapper .vue-slider-dot-tooltip-inner-top .vue-slider-dot-tooltip-text {
-webkit-transform: rotate(0deg);
transform: rotate(0deg); }
.srp_range_wrapper .vue-slider-mark-label {
font-size: 9px; }
.srp_chips {
margin-top: 8px;
margin-bottom: 8px;
flex-wrap: wrap;
justify-content: start;
display: flex;
column-gap: 3px;
row-gap: 3px; }
.srp_chips .srp_chip {
display: flex;
align-items: center;
background-color: #000;
color: #fff;
cursor: pointer;
border: 1px solid #fff;
height: fit-content;
font-size: 12px;
margin: 2px;
border-radius: 20px;
padding: 3px 8px 3px 15px;
text-transform: capitalize;
transition: all .2s ease-out,opacity .2s ease-out; }
.srp_chips .srp_chip:first-child {
margin-left: 0px; }
.srp_chips .srp_chip:hover {
background-color: #fff;
color: #000;
border-color: #000; }
.srp_chips .srp_chip .sricon-close-circle {
font-size: 18px;
margin-left: 5px; }
.srp_filter_container {  }
.srp_filter_container .srp_filter_button_label {
display: flex; }
.srp_filter_container .srp_filter_buttons_list {
margin: 0;
display: flex;
width: 100%;
flex-wrap: wrap;
justify-content: left;
column-gap: 6px;
row-gap: 6px;
margin-top: 10px;
margin-bottom: 10px;
padding: 0px; }
.srp_filter_container .srp_filter_buttons_list li {
white-space: nowrap;
list-style: none;
position: relative;
clear: both; }
.srp_filter_container .srp_filter_buttons_list li .srp_filter_button {
overflow: hidden;
text-overflow: ellipsis;
-webkit-user-select: none;
transition: all 300ms;
border: solid 1px #c5c5c5;
color: #c5c5c5;
background-color: #000;
padding: 4px 8px;
font-size: 11px;
border-radius: 4px;
cursor: pointer; }
.srp_filter_container .srp_filter_buttons_list li .srp_filter_button:hover:not(.srp_filter_button--active) {
color: #fff; }
.srp_filter_container .srp_filter_buttons_list li .srp_filter_button.srp_filter_button--active {
background-color: #fff;
color: #000; }
.srp_filter_container .list-enter-active, .srp_filter_container .list-leave-active {
transition: opacity 0.5s, transform 0.5s; }
.srp_filter_container .list-enter, .srp_filter_container .list-leave-to {
opacity: 0;
transform: translateY(-1em); }
.srp_filter_container li {
opacity: 1;
transform: translateY(0);
transition: opacity 1.5s, transform 1.5s; }
.srp_filter_container li.hidden-tag {
opacity: 0;
transform: translateY(1em); }
.srp-filter-more-link {
font-size: 14px;
font-weight: 400;
cursor: pointer;
margin-bottom: 15px; }
.srp_pagination_container {
transition: all 250ms;
font-size: 16px;
-webkit-user-select: none;
display: flex;
justify-content: center;
width: 100%;
align-items: center;
height: auto;
grid-gap: 10px;
margin-top: 20px;
margin-bottom: 15px;
color: #fff; }
.srp_pagination_container .srp_pagination_arrows {
transition: all 250ms;
font-size: 12px;
border: 2px solid rgba(255, 255, 255, 0.2);
cursor: pointer;
pointer-events: all;
-webkit-user-select: none; color: inherit;
background-color: rgba(0, 0, 0, 0);
min-width: 40px;
height: 40px;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
padding: 5px 5px;
border-radius: 999px; }
.srp_pagination_container .srp_pagination_arrows:hover {
border: 2px solid white;
color: inherit; }
.srp_pagination_container .srp_pagination {
display: flex;
justify-content: center;
grid-gap: 10px;
height: auto !important; }
.srp_pagination_container .srp_pagination .disabled {
pointer-events: none; }
.srp_pagination_container .srp_pagination .active span {
pointer-events: none;
background-color: #fff;
color: #000; }
.srp_pagination_container .srp_pagination span {
transition: all 250ms;
color: inherit;
background-color: rgba(0, 0, 0, 0);
min-width: 30px;
height: 30px;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
padding: 5px 5px;
border-radius: 999px; }
.srp_pagination_container .srp_pagination span:hover {
color: inherit; }
.srp_notfound {
display: none;
margin: 10px; }
.srp_notfound .srp_notfound--title {
font-weight: bold;
font-size: 21px; }
.srp_notfound .srp_notfound--subtitle {
font-size: 16px;
opacity: 0.6; }
[style*="visibility: hidden;"] .srp_search_main .srp_search_container, [style*="visibility: hidden;"] .srp_filter_container {
visibility: hidden !important;
opacity: 0 !important; }
.srp_search_main {
flex-wrap: wrap;
display: flex;
justify-content: space-between;
align-items: center;
column-gap: 5px; }
.srp_search_main .srp_search_container {
visibility: visible !important;
opacity: 1 !important;
color: #fff;
display: flex;
justify-content: flex-start;
align-items: center;
max-width: 100%;
min-height: 40px;
flex-grow: 1; }
.srp_search_main .srp_search_container .srp_search {
font-family: inherit;
font-size: 14px;
padding-left: 45px !important;
color: #fff;
border-radius: 4px;
background: #000;
border: none;
border-width: 1px;
outline: none;
max-width: 100%;
width: 100%;
min-height: 40px;
padding: 15px; }
.srp_search_main .srp_search_container .srp_search::placeholder {
color: inherit;
opacity: 0.5; }
.srp_search_main .srp_search_container .srp_reset_search {
position: relative;
width: 0;
right: 35px;
pointer-events: all;
cursor: pointer; }
.srp_search_main .srp_search_container .fa-search {
position: relative;
left: 20px;
width: 0;
font-size: 14px;
color: #828282; }
.srp_pagination li:not(.active) .page {
cursor: pointer; } .srp_tracklist_grid .srp_tracklist > ul {
display: grid;
grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
gap: 10px; }
.srp_tracklist_grid[data-col="6"] .srp_tracklist > ul {
grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr; }
.srp_tracklist_grid[data-col="5"] .srp_tracklist > ul {
grid-template-columns: 1fr 1fr 1fr 1fr 1fr; }
.srp_tracklist_grid[data-col="4"] .srp_tracklist > ul {
grid-template-columns: 1fr 1fr 1fr 1fr; }
.srp_tracklist_grid[data-col="3"] .srp_tracklist > ul {
grid-template-columns: 1fr 1fr 1fr; }
.srp_tracklist_grid[data-col="2"] .srp_tracklist > ul {
grid-template-columns: 1fr 1fr; }
.srp_tracklist_grid[data-col="1"] .srp_tracklist > ul {
grid-template-columns: 1fr; }
@media only screen and (max-width: 768px) {
.srp_tracklist_grid[data-col-tablet="6"] .srp_tracklist > ul {
grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr; }
.srp_tracklist_grid[data-col-tablet="5"] .srp_tracklist > ul {
grid-template-columns: 1fr 1fr 1fr 1fr 1fr; }
.srp_tracklist_grid[data-col-tablet="4"] .srp_tracklist > ul {
grid-template-columns: 1fr 1fr 1fr 1fr; }
.srp_tracklist_grid[data-col-tablet="3"] .srp_tracklist > ul {
grid-template-columns: 1fr 1fr 1fr; }
.srp_tracklist_grid[data-col-tablet="2"] .srp_tracklist > ul {
grid-template-columns: 1fr 1fr; }
.srp_tracklist_grid[data-col-tablet="1"] .srp_tracklist > ul {
grid-template-columns: 1fr; } }
@media only screen and (max-width: 767px) {
.srp_tracklist_grid[data-col-mobile="6"] .srp_tracklist > ul {
grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr; }
.srp_tracklist_grid[data-col-mobile="5"] .srp_tracklist > ul {
grid-template-columns: 1fr 1fr 1fr 1fr 1fr; }
.srp_tracklist_grid[data-col-mobile="4"] .srp_tracklist > ul {
grid-template-columns: 1fr 1fr 1fr 1fr; }
.srp_tracklist_grid[data-col-mobile="3"] .srp_tracklist > ul {
grid-template-columns: 1fr 1fr 1fr; }
.srp_tracklist_grid[data-col-mobile="2"] .srp_tracklist > ul {
grid-template-columns: 1fr 1fr; }
.srp_tracklist_grid[data-col-mobile="1"] .srp_tracklist > ul {
grid-template-columns: 1fr; } }
.srp_tracklist_grid .sr-playlist-item-flex {
flex-direction: column;
gap: 10px;
align-items: flex-start !important;
justify-content: flex-start !important; }
.srp_tracklist_grid .sr-playlist-item-flex .audio-track {
width: 100%;
flex: none; }
.srp_tracklist_grid .sr-playlist-item-flex .store-list {
width: 100%;
flex: none !important;
margin-top: auto; }
.srp_tracklist_grid .sr-playlist-item-flex .store-list .song-store-list-menu {
justify-content: inherit;
width: 100% !important; }
.srp_tracklist_grid .sr-playlist-item-flex .store-list .song-store-list-container {
width: inherit;
flex-wrap: wrap;
gap: 6px; }
.srp_tracklist_grid .sr-playlist-item-flex .store-list .sr_store_wc_round_bt {
width: 100%;
padding: 10px; }
.srp_tracklist_grid .sr-playlist-item-flex .sr-playlist-cf-container {
width: 100%;
flex: none;
justify-content: flex-start;
column-gap: 15px;
flex-wrap: wrap; }
.srp_tracklist_grid .sr-playlist-item-flex .sr-playlist-cf-child {
flex: none !important;
width: auto  !important; }
.srp_tracklist_grid .sr-playlist-item-flex .srp_noteButton {
margin-left: 15px; }
.srp_tracklist_grid .sr-playlist-item-flex .srp_noteButton i:before {
margin: 0; }
.srp_tracklist_grid .sr-playlist-item-flex .srp_noteButton .sricon-info {
margin-left: 4px; }
.srp_tracklist_grid .sr-playlist-item-flex .sricon-spinner-wrap {
width: 20px !important;
margin-top: -5px;
margin-left: 2px; }
.srp_tracklist_grid .sr_track_cover {
margin-left: -20px;
margin-top: -20px;
width: calc(100% + 40px) !important;
max-width: unset; }
.srp_tracklist_grid .sr-cf-heading {
display: none !important; }
.srp_tracklist_grid[data-playertemplate="skin_boxed_tracklist"] .srp_player_boxed + .playlist {
padding-top: 20px; }
.srp_tracklist_grid .sr-playlist-item {
overflow: hidden; }
.srp_tracklist_grid .srp_note_title {
font-size: 1.2em; }
.srp_tracklist_grid .srp_tracklist-item-date {
height: initial;
margin-left: 0;
padding-left: 0 !important; }
.srp_tracklist_grid .sr-playlist-item .srp_track_description {
margin-top: 0; }
.srp_tracklist_grid .srp_note {
padding: 5px; }
.srp_tracklist_grid .srp_list.ps .sr-playlist-item {
height: max-content; }
.srp_tracklist_play_cover:not(.srp_tracklist_grid) .sr_track_cover .srp_play {
transform: scale(0.5); }
.srp_tracklist_play_cover .sr_track_cover {
position: relative; }
.srp_tracklist_play_cover .sr_track_cover:after {
content: "";
height: 100%;
width: 100%;
display: block;
position: absolute;
top: 0;
left: 0; }
.srp_tracklist_play_cover .sr_track_cover .srp_play {
cursor: pointer;
z-index: 1; }
.srp_tracklist_play_cover .track-number {
padding-left: 0px !important; }
.srp_tracklist_play_cover .track-number .sricon-play {
display: none; }
@media only screen and (min-width: 768px) {
.srp_tracklist_play_cover.srp_tracklist_play_cover_hover .sr_track_cover:after, .srp_tracklist_play_cover.srp_tracklist_play_cover_hover .sr_track_cover .srp_play {
transition: 0.15s ease; }
.srp_tracklist_play_cover.srp_tracklist_play_cover_hover .sr-playlist-item:not(:hover):not(.current) .sr_track_cover:after, .srp_tracklist_play_cover.srp_tracklist_play_cover_hover .sr-playlist-item:not(:hover):not(.current) .sr_track_cover .srp_play {
opacity: 0; }
.srp_tracklist_play_cover.srp_tracklist_play_cover_hover .sr-playlist-item:not(:hover):not(.current) .sr_track_cover .srp_play {
transform: translateY(30%); } }
.srp_tracklist-item-date + .srp_tracklist-item-date {
display: none; }
.elementor-widget-music-player .iron-audioplayer[data-playertemplate="skin_boxed_tracklist"].srp_tracklist_grid img.sr_track_cover {
max-width: unset !important; }
.sr_tracklenght_tooltip {
opacity: 0;
transform: translateY(20px) scale(0.5);
transition: transform 0.2s ease;
z-index: 9999;
text-align: center;
width: 60px;
position: absolute;
background-color: black;
color: white;
padding: 5px;
border-radius: 2px;
font-size: 11px; }
.sr_tracklenght_tooltip_vertical {
display: none;
z-index: 9999;
position: absolute;
width: 1px;
background-color: black;
pointer-events: none; }
.iron-audioplayer {
position: relative; }
.iron-audioplayer .srp_player_boxed .srp_progressbar_inline .control {
margin-top: 0px; }
.iron-audioplayer .srp_player_boxed .player .srp_spectrum_container {
display: flex;
justify-content: flex-start; }
.iron-audioplayer .srp_spectrum_container, .iron-audioplayer .srp_spectrum {
transition: 0.3s ease;
max-height: 1000px; }
.iron-audioplayer .playlist .srp_spectrum_container, .iron-audioplayer .playlist .srp_spectrum {
max-height: 500px; }
.iron-audioplayer .srp_spectrum_container {
width: 100%;
display: flex;
justify-content: center;
pointer-events: none; }
.iron-audioplayer .srp_spectrum {
position: absolute;
z-index: 1; }
.iron-audioplayer .sr-playlist-item .srp_spectrum {
z-index: -1; }
.iron-audioplayer .song-store.add_to_cart_button.ajax_add_to_cart * {
pointer-events: none; }
.iron-audioplayer.srp_tracklist_grid .srp_soundwave_wrapper {
flex: unset;
width: 100%; }
.iron-audioplayer .srp_soundwave_wrapper {
flex: 0 1 100%;
width: 100%; }
.srp_spectrum_container.srp_hidden, .srp_hidden .srp_spectrum {
opacity: 0;
max-height: 0 !important; }
#sonaar-player .srp_spectrum_container {
position: absolute;
z-index: 10000;
pointer-events: none; }
.srp_tracklist_hide_artist .srp_trackartist {
display: none; }
.swiper-box-navigation {
max-width: 100%;
position: relative;
display: flex;
flex-direction: column; }
.swiper-box-navigation[data-v-align="top"] {
flex-direction: column-reverse; }
.swiper-box-navigation[data-v-align="center"] .srp_swiper-navigation {
position: absolute;
transform: translateY(-50%); }
.srp_swiper-nav-v-pos-center .swiper-box-navigation {
position: absolute;
width: 100%;
left: 0;
top: 50%; }
.srp_swiper-wrap {
position: relative;
padding: 0 0 15px 0;
display: flex;
flex-direction: column; }
.srp_swiper {
color: #fff;
user-select: none;
-moz-user-select: none;
-khtml-user-select: none;
-webkit-user-select: none;
-o-user-select: none;
max-width: 100%; }
.srp_swiper.swiper {
overflow: visible;
overflow-x: clip; }
.srp_swiper .swiper-pagination-bullet {
background: #0000006c;
opacity: 1; }
.srp_swiper .swiper-pagination-bullet.swiper-pagination-bullet-active {
background: #000000; }
.srp_swiper .swiper-slide {
min-width: 1px;
overflow: visible;
cursor: grab; }
.srp_swiper .swiper-slide:active {
cursor: grabbing; }
.srp_swiper .swiper-slide .store-list {
align-items: inherit;
justify-content: inherit;
text-shadow: none;
position: relative;
margin-top: 6px; }
.srp_swiper .swiper-slide .store-list .song-store-list-menu {
align-items: inherit;
justify-content: inherit; }
.srp_swiper .swiper-slide .store-list .fa-ellipsis-v {
display: none; }
.srp_swiper .swiper-slide .store-list .song-store-list-container {
display: flex;
align-items: inherit;
justify-content: inherit;
flex-wrap: wrap;
row-gap: 4px; }
.srp_swiper .srp_trackartist {
display: inline-block !important; }
.srp_swiper .srp_index {
display: none; }
.srp_swiper-control {
position: absolute;
z-index: 50; }
.srp_swiper-control .srp_play {
cursor: pointer; }
.srp_swiper-control .srp_play .sricon-play {
margin-left: 4px; }
.audio-playing .swiper-slide.srp_current .sricon-play {
margin-left: 0; }
.srp_swiper-titles {
display: flex;
flex-direction: column;
padding: 5%;
z-index: 1;
transition: opacity 0.3s ease; }
.srp_swiper-album-art {
background: no-repeat 50%;
background-size: cover;
width: 100%;
height: 380px;
position: relative;
justify-content: center;
align-items: center;
display: flex;
position: relative;
overflow: hidden; }
.srp_swiper-album-art .srp_swiper-titles {
width: 100%;
height: 100%;
display: flex;
flex-direction: column;
align-items: center;
justify-content: flex-end; }
.srp_swiper-album-art img {
width: 100%;
height: auto; }
.srp_swiper-album-art:after {
transition: 0.3s ease;
content: "";
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%; }
.srp_slider_play_cover_hover .swiper-slide .srp_swiper-control .srp_play {
opacity: 0;
scale: 1.15;
transform: translate(0, 10px);
transition: 0.15s ease; }
.srp_slider_play_cover_hover .swiper-slide:hover .srp_swiper-control .srp_play {
opacity: 1;
scale: 1;
transform: translate(0, 0); }
.srp_swiper-title {
font-size: 1.3rem;
text-align: inherit; }
.srp_swiper-track-title {
text-align: inherit; }
.srp_swiper-album-art .srp_swiper_overlay {
width: 100%;
height: 100%;
position: absolute;
top: 0;
left: 0; }
.srp_swiper-album-art .srp_swiper_overlay::before {
transition: opacity 0.2s;
content: "";
opacity: 1;
width: 100%;
height: 100%;
position: absolute; }
.srp_swiper-album-art .srp_swiper_overlay::after {
transition: opacity 0.2s;
content: "";
opacity: 0;
width: 100%;
height: 100%;
position: absolute; }
.srp_swiper-album-art:hover .srp_swiper_overlay::after {
opacity: 1; }
.srp_swiper-album-art:hover .srp_swiper_overlay::before {
opacity: 0; } .srp_slider_content_on_hover .srp_swiper-track-title, .srp_slider_content_on_hover .srp_swiper-title, .srp_slider_content_on_hover .store-list, .srp_slider_content_on_hover .srp_swiper-track-artist {
opacity: 0; }
.srp_slider_content_on_hover .swiper-slide:hover .srp_swiper-title, .srp_slider_content_on_hover .swiper-slide:hover .srp_swiper-track-title, .srp_slider_content_on_hover .swiper-slide:hover .store-list, .srp_slider_content_on_hover .swiper-slide:hover .srp_swiper-track-artist {
opacity: 1;
transform: translate(0, 0); }
.srp_slider_content_on_hover .srp_swiper-track-title {
transform: translate(0, 20px);
transition: 0.4s ease;
transition-delay: .1s; }
.srp_slider_content_on_hover .srp_swiper-track-artist {
transform: translate(0, 30px);
transition: 0.4s ease;
transition-delay: .15s; }
.srp_slider_content_on_hover .srp_swiper-title {
transform: translate(0, 30px);
transition: 0.4s ease;
transition-delay: .12s; }
.srp_slider_content_on_hover .store-list {
transform: translate(0, 40px);
transition: 0.5s ease;
transition-delay: .1s; } .srp_slider_content_on_active .swiper-slide:not(.swiper-slide-active) .srp_swiper-control, .srp_slider_content_on_active .swiper-slide:not(.swiper-slide-active) .srp_swiper-titles {
opacity: 0; }
.srp_slider_content_on_active:not(.srp_slider_content_on_hover) .srp_swiper-track-title, .srp_slider_content_on_active:not(.srp_slider_content_on_hover) .srp_swiper-title, .srp_slider_content_on_active:not(.srp_slider_content_on_hover) .srp_swiper-track-artist, .srp_slider_content_on_active:not(.srp_slider_content_on_hover) .store-list {
opacity: 0; }
.srp_slider_content_on_active:not(.srp_slider_content_on_hover) .swiper-slide-active .srp_swiper-title, .srp_slider_content_on_active:not(.srp_slider_content_on_hover) .swiper-slide-active .srp_swiper-track-title, .srp_slider_content_on_active:not(.srp_slider_content_on_hover) .swiper-slide-active .srp_swiper-track-artist, .srp_slider_content_on_active:not(.srp_slider_content_on_hover) .swiper-slide-active .store-list {
opacity: 1;
transform: translate(0, 0); }
.srp_slider_content_on_active:not(.srp_slider_content_on_hover) .srp_swiper-track-title {
transform: translate(0, 20px);
transition: 0.8s ease;
transition-delay: .1s; }
.srp_slider_content_on_active:not(.srp_slider_content_on_hover) .srp_swiper-track-artist {
transform: translate(0, 30px);
transition: 0.8s ease;
transition-delay: .12s; }
.srp_slider_content_on_active:not(.srp_slider_content_on_hover) .srp_swiper-title {
transform: translate(0, 40px);
transition: 0.8s ease;
transition-delay: .18s; }
.srp_slider_content_on_active:not(.srp_slider_content_on_hover) .store-list {
transform: translate(0, 30px);
transition: 0.8s ease;
transition-delay: .2s; }
.srp_swiper .srp_swiper-navigation {
position: absolute;
transform: translateY(-50%);
left: 0; }
.srp_swiper-navigation {
width: 100%;
top: 50%;
display: flex;
justify-content: space-between;
gap: 15px;
padding: 8px;
z-index: 100; }
.srp_swiper-navigation .srp_swiper-button-prev, .srp_swiper-navigation .srp_swiper-button-next {
position: static;
margin-top: 0;
transform: initial; }
.srp_swiper-button-prev,
.srp_swiper-button-next {
position: absolute;
top: 50%;
width: calc(var(--swiper-navigation-size) / 44 * 27);
height: var(--swiper-navigation-size);
transform: translateY(-50%);
z-index: 10;
cursor: pointer;
display: flex;
align-items: center;
justify-content: center;
color: var(--swiper-navigation-color, var(--swiper-theme-color));
font-size: 44px;
overflow: hidden;
color: #fff; }
.srp_swiper-button-prev.srp_arrow_round,
.srp_swiper-button-next.srp_arrow_round {
font-size: 24px !important;
width: calc(var(--swiper-navigation-size) + 20px);
height: calc(var(--swiper-navigation-size) + 20px);
border-radius: 65px;
border: #fff solid; }
.srp_swiper-button-prev.swiper-button-disabled,
.srp_swiper-button-next.swiper-button-disabled {
opacity: 0.35;
cursor: default; }
div.srp_swiper-button-prev:after,
div.srp_swiper-button-next:after {
font-family: swiper-icons;
text-transform: none !important;
letter-spacing: 0;
font-variant: initial;
line-height: 1;
font-size: inherit; }
.srp_swiper-button-prev,
.swiper-rtl .srp_swiper-button-next {
left: 10px;
right: auto; }
.srp_swiper-button-prev:after,
.swiper-rtl .srp_swiper-button-next:after {
content: 'prev'; }
.srp_swiper-button-next,
.swiper-rtl .srp_swiper-button-prev {
right: 10px;
left: auto; }
.srp_swiper-button-next:after,
.swiper-rtl .srp_swiper-button-prev:after {
content: 'next'; }
.srp_swiper-wrap .swiper-box-pagination {
position: relative;
height: 6px;
margin-top: 10px; }
.srp_swiper-wrap .swiper-box-pagination .swiper-horizontal > .swiper-pagination-bullets.swiper-pagination-bullets-dynamic, .srp_swiper-wrap .swiper-box-pagination .swiper-pagination-horizontal.swiper-pagination-bullets.swiper-pagination-bullets-dynamic {
bottom: 0; }
.srp_swiper-wrap .swiper-box-pagination .swiper-pagination-bullet {
opacity: 1; }
.srp_swiper-track-artist {
text-transform: capitalize; }
.srp-fav-notfound {
color: initial;
display: flex;
align-items: center;
column-gap: 10px; }
.srp-fav-notfound i {
font-size: 12px; }
.sr_store_force_dl_bt {
cursor: pointer; }
a.song-store.srp-fav-bt i, a.song-store.sr_store_force_share_bt i, a.song-store.sr_store_force_dl_bt i, a.song-store.sr_store_force_pl_bt i {
font-size: 16px; }
.srp-fav-removeall-wrapper {
display: flex;
justify-content: flex-start; }
.srp-fav-removeall-wrapper .srp-fav-removeall-bt {
transition: all 0.3s ease;
width: auto;
cursor: pointer;
padding: 5px 20px;
margin-bottom: 10px;
background-color: var(--srp-global-music_player_wc_bt_bgcolor);
color: var(--srp-global-music_player_wc_bt_color);
display: inline-block;
border-radius: 4px;
font-size: 12px; }
.srp-fav-notification {
opacity: 0;
position: fixed;
bottom: 80px;
left: 0;
right: 0;
margin: auto;
width: fit-content;
padding: 10px 50px;
background-color: var(--srp-global-modal-btn-bg-color);
color: var(--srp-global-modal-btn-txt-color);
text-align: center;
border-radius: 5px;
box-shadow: 0px 0px 7px rgba(0, 0, 0, 0.3);
z-index: 10001;
font-size: 16px; } .srp_extendedPlayer {
transition: padding 0.1s ease; }
.srp_no_artwork .srp_extendedPlayer_container .srp_extendedPlayer {
overflow-y: unset;
padding-top: var(--srp-extendedPlayer-height);
background: unset !important;
min-height: unset; }
.srp_no_artwork .srp_extendedPlayer_container .srp_ext_primary {
min-height: unset; }
.srp_extendedPlayer_scrolling_box {
height: 100%;
display: flex;
overflow-y: scroll; }
.srp_extendedPlayer_container {
width: 100%;
height: 100%;
position: fixed;
top: 0;
left: 0;
z-index: 9999;
display: flex;
flex-direction: column;
transform: translateY(100%);
opacity: 0;
transition: transform 300ms ease, opacity 150ms ease; }
#sonaar-player .srp_extendedPlayer_container .close {
border-color: #ffffff; }
#sonaar-player .srp_extendedPlayer_container .close:before, #sonaar-player .srp_extendedPlayer_container .close:after {
border-color: inherit; }
.srp_extendedPlayer_container.srp_opened {
transform: translateY(0%);
opacity: 1; }
.srp_extendedPlayer_container .srp-fav-bt {
font-size: 28px;
color: var(--srp-global-sticky_player_waveform_progress_color, #fff); }
#sonaar-player .srp_extendedPlayer_container .sr_progressbar_sticky {
flex-direction: column-reverse !important;
gap: 10px; }
#sonaar-player .srp_extendedPlayer_container .sr_progressbar_sticky .wave {
position: static;
height: 70px !important;
width: 100% !important; }
.srp_extendedPlayer_container .srp_ext_primary {
display: flex;
flex-direction: column;
justify-content: space-between;
min-height: 100%;
padding-top: 15px;
padding-bottom: 45px;
padding-left: 25px;
padding-right: 25px;
background: var(--srp-global-sticky_player_background); }
.srp_extendedPlayer_container .srp_ext_secondary {
display: flex;
flex-direction: column;
justify-content: space-between;
padding-bottom: 15px;
gap: 15px;
padding-left: 25px;
padding-right: 25px;
background: var(--srp-global-sticky_player_background); }
.srp_extendedPlayer_container .srp_ext_overlay_panel {
padding: 15px 25px; }
.srp_extendedPlayer_container .srp_extendedPlayer {
display: flex;
flex-direction: column;
justify-content: space-between;
min-height: 100%;
width: 100%;
box-sizing: border-box; }
.srp_extendedPlayer_container .srp_extendedPlayer.srp_opened_cta {
transition: filter 0.3s ease;
filter: brightness(0.5); }
.srp_extendedPlayer_container .srp_extendedPlayer .srp_ext_header {
display: flex;
justify-content: space-between;
align-items: center;
margin-bottom: 20px;
margin-top: 15px;
gap: 20px; }
.srp_extendedPlayer_container .srp_extendedPlayer .srp_collapse_btn {
font-size: 24px;
line-height: 1; }
.srp_extendedPlayer_container .srp_extendedPlayer .srp_ellipsis_btn {
font-size: 20px;
line-height: 1;
margin-right: -10px; }
.srp_extendedPlayer_container .srp_extendedPlayer .srp_ext_artwork {
display: flex;
flex-direction: column;
justify-content: center;
flex-flow: row;
overflow: hidden; }
.srp_extendedPlayer_container .srp_extendedPlayer .srp_ext_artwork img {
width: 100%;
height: 100%;
object-fit: contain; }
.srp_extendedPlayer_container .srp_extendedPlayer .srp_ext_track {
column-gap: 10px;
display: flex;
flex-direction: row;
justify-content: space-between;
align-items: center; }
.srp_extendedPlayer_container .srp_extendedPlayer .control {
display: flex;
justify-content: center;
align-items: center;
gap: 30px;
margin: 10px 0; }
.srp_extendedPlayer_container .srp_extendedPlayer .control.srp_ctrl_advanced {
gap: 15px; }
.srp_extendedPlayer_container .srp_extendedPlayer .control .sricon-play:before {
font-size: 38px; }
.srp_extendedPlayer_container .srp_extendedPlayer .srp_ext_track_info {
margin: 15px 0; }
.srp_extendedPlayer_container .srp_extendedPlayer .srp_track_title {
font-size: 18px;
line-height: 1.3; }
.srp_extendedPlayer_container .srp_extendedPlayer .sr_progressbar_sticky {
width: auto;
position: relative;
display: flex;
flex: 1;
align-items: center;
margin: 0 5px; }
.srp_extendedPlayer_container .srp_extendedPlayer .srp_ext_featured_cta {
display: flex;
justify-content: space-between;
column-gap: 5px;
min-height: 30px;
align-items: center; }
.srp_extendedPlayer_container .srp_extendedPlayer .srp_ext_featured_cta .srp_ext_cta_addtocart, .srp_extendedPlayer_container .srp_extendedPlayer .srp_ext_featured_cta .srp_ext_cta_buynow {
background-color: var(--srp-global-sticky_player_labelsandbuttons, #FFF); padding: 5px 10px;
border-radius: 6px;
color: var(--srp-global-sticky_player_background, #000); }
.srp_extendedPlayer_container .srp_extendedPlayer .srp_ext_featured_cta .srp_ext_cta_addtocart span, .srp_extendedPlayer_container .srp_extendedPlayer .srp_ext_featured_cta .srp_ext_cta_buynow span {
font-size: 14px;
font-weight: 500; }
.srp_extendedPlayer_container .srp_extendedPlayer .srp_ext_featured_cta a {
color: inherit;
background-color: unset;
display: flex;
column-gap: 12px;
align-items: center;
text-decoration: none;
font-size: 18px;
font-weight: 400; }
.srp_extendedPlayer_container .srp_extendedPlayer .srp_ext_featured_cta_left, .srp_extendedPlayer_container .srp_extendedPlayer .srp_ext_featured_cta_right {
align-items: center;
display: flex;
gap: 10px; }
.srp_extendedPlayer_container .srp_extendedPlayer .srp_ext_featured_cta_left {
font-size: 18px; }
.srp_extendedPlayer_container .srp_extendedPlayer .srp_ext_featured_cta_center {
flex: 0.9;
height: 175%; }
.srp_extendedPlayer_container .srp_extendedPlayer .srp_ext_control {
display: flex;
justify-content: space-between;
align-content: center; }
.srp_extendedPlayer_container .srp_extendedPlayer .srp_ext_control .shuffle, .srp_extendedPlayer_container .srp_extendedPlayer .srp_ext_control .srp_repeat {
font-size: 18px; }
.srp_extendedPlayer_container .srp_extendedPlayer .srp_ext_control .control--item {
display: flex;
align-items: center;
justify-content: flex-end; }
.srp_extendedPlayer_container .srp_extendedPlayer .srp_ext_control .srp_control_right {
column-gap: 8px; }
#sonaar-player .srp_extendedPlayer_container .srp_extendedPlayer .srp_ext_control .sr_speedRate {
margin: 0; }
.srp_extendedPlayer_container .srp_extendedPlayer .srp_control_right, .srp_extendedPlayer_container .srp_extendedPlayer .srp_control_left {
display: flex;
flex: 1; }
.srp_extendedPlayer_container .srp_extendedPlayer .srp_control_left {
justify-content: flex-start; }
.srp_extendedPlayer_container .srp_extendedPlayer .srp_control_right {
justify-content: flex-end; }
.srp_extendedPlayer_container .srp_extendedPlayer .play {
display: flex; }
.srp_extendedPlayer_container .srp_extendedPlayer .list {
width: 28px; }
.srp_extendedPlayer_container .srp_ext_overlay_panel_outside {
position: absolute;
height: 100%;
width: 100%; }
.srp_extendedPlayer_container .srp_ext_overlay_panel {
visibility: hidden;
position: absolute;
bottom: 0px;
padding-bottom: 70px;
height: fit-content;
width: 100%;
background: var(--srp-global-sticky_player_background);
transform: translateY(100%);
transition: 0.4s ease; }
.srp_extendedPlayer_container .srp_ext_overlay_panel.srp_opened {
visibility: visible;
transform: translateY(0%); }
.srp_extendedPlayer_container .srp_ext_overlay_panel .srp_ext_cta {
display: flex;
flex-direction: column;
row-gap: 20px;
margin-top: 20px; }
.srp_extendedPlayer_container .srp_ext_overlay_panel .srp_ext_cta .srp_ext_track_info_wrapper {
display: flex;
column-gap: 10px;
margin-bottom: 20px;
padding-bottom: 10px;
border-bottom: 1px solid #ffffff20; }
.srp_extendedPlayer_container .srp_ext_overlay_panel .srp_ext_cta .srp_ext_track_info_wrapper .srp_track_title {
display: -webkit-box;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
overflow: hidden;
width: 65vw;
font-size: 18px; }
.srp_extendedPlayer_container .srp_ext_overlay_panel .srp_ext_cta .srp_ext_track_info_wrapper .srp_artist {
font-size: 14px; }
.srp_extendedPlayer_container .srp_ext_overlay_panel .srp_ext_cta img {
max-height: 65px; }
.srp_extendedPlayer_container .srp_ext_overlay_panel .srp_ext_cta > span a {
color: inherit;
background-color: unset;
display: flex;
column-gap: 12px;
align-items: center;
text-decoration: none;
font-size: 18px;
font-weight: 400; }
.srp_extendedPlayer_container .srp_ext_overlay_panel .srp_ext_cta > span a > i {
text-align: center;
width: 30px; }
.srp_extendedPlayer_container .srp_ext_content {
display: flex;
flex-direction: column;
row-gap: 10px; }
.srp_extendedPlayer_container .srp_ext_section {
word-wrap: break-word;
font-size: 16px;
font-weight: 400;
background: var(--srp-global-sticky_player_background);
padding: 15px;
border-radius: 10px;
filter: brightness(1.2); }
.srp_extendedPlayer_container .srp_ext_section:first-child {
margin-top: -28px; }
.srp_repeat {
cursor: pointer; }
.srp_repeat[data-repeat-status="null"]:before {
opacity: 0.4; }
.srp_repeat[data-repeat-status="track"]:before {
content: '\e83c'; }
.srp_repeat:before {
content: '\e83b'; }
#sonaar-player .player .control .srp_repeat.srp_disabled {
pointer-events: none;
opacity: 0.4; }
body.srp_sticky_ext_opened {
overflow-y: hidden; }
#make-offer-btn {
float: unset;
padding: 10px 20px;
pointer-events: auto;
cursor: pointer; }
.single-product .srp-make-offer-btn-wrapper {
margin-bottom: 10px;
clear: both; }
.single-product .single_variation_wrap .srp-make-offer-btn-wrapper {
margin-top: 5px; }
body.sr_popup-open {
overflow-y: hidden; }
#sonaar-modal {
display: none;
position: fixed;
top: 0;
left: 0;
z-index: 10100;
width: 100%;
height: 100%;
overflow: hidden;
outline: 0;
transition: opacity .15s linear;    }
#sonaar-modal h1, #sonaar-modal h2, #sonaar-modal h3, #sonaar-modal h4, #sonaar-modal h5, #sonaar-modal h6 {
line-height: 1;
font-weight: 500; }
#sonaar-modal.has-bg-image {
color: #fff; }
#sonaar-modal.has-bg-image h1, #sonaar-modal.has-bg-image h2, #sonaar-modal.has-bg-image h3, #sonaar-modal.has-bg-image h4, #sonaar-modal.has-bg-image h5, #sonaar-modal.has-bg-image h6, #sonaar-modal.has-bg-image p, #sonaar-modal.has-bg-image label, #sonaar-modal.has-bg-image span, #sonaar-modal.has-bg-image a, #sonaar-modal.has-bg-image button {
color: #fff; }
#sonaar-modal.has-bg-image .sr_popup-content {
border: unset;
background-color: #000; }
#sonaar-modal.has-bg-image .sr_popup-content::before {
content: '';
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background-size: cover;
background-position: center;
background-repeat: no-repeat;
filter: blur(50px) brightness(0.7);
opacity: 1;
background-color: black; }
#sonaar-modal.has-bg-image .sr_popup-content .srp-popup-form {
width: 530px; }
#sonaar-modal .sr_popup-dialog {
transition: -webkit-transform .3s ease-out;
transition: transform .3s ease-out;
transition: transform .3s ease-out,-webkit-transform .3s ease-out;
-webkit-transform: translate(0, -50px);
transform: translate(0, -50px); }
.sr_popup-open #sonaar-modal {
overflow-x: hidden;
overflow-y: auto; }
#sonaar-modal.sr_show {
display: flex !important;
align-items: center;
min-height: 100%;
height: auto; }
#sonaar-modal.sr_show .sr_popup-dialog {
-webkit-transform: none;
transform: none; }
#sonaar-modal .sr_popup-dialog {
position: relative;
width: auto;
max-height: 100vh;
overflow-y: auto;
overflow-x: hidden;
margin: 0px auto; }
@media (min-width: 576px) {
#sonaar-modal .sr_popup-dialog {
max-width: calc(100vw - 150px);
max-height: calc(100vh - 150px);
margin: 75px auto; } }
#sonaar-modal .sr_popup-content {
position: relative;
display: -ms-flexbox;
display: flex;
-ms-flex-direction: column;
flex-direction: column;
width: 100%;
pointer-events: auto;
background-color: #fff;
background-clip: padding-box;
border: 1px solid rgba(0, 0, 0, 0.2);
border-radius: .3rem;
outline: 0;
-webkit-animation: srmp3fadein 350ms;
-moz-animation: srmp3fadein 350ms;
-ms-animation: srmp3fadein 350ms;
-o-animation: srmp3fadein 350ms;
animation: srmp3fadein 350ms; }
#sonaar-modal .sr_popup-content #srp-make-offer-error {
color: red;
font-weight: 500;
font-size: 16px; }
#sonaar-modal .sr_popup-content p {
margin-bottom: initial;
margin-top: initial; }
@media (max-width: 576px) {
#sonaar-modal .sr_popup-content {
margin-bottom: 50px; } }
#sonaar-modal .sr_popup-content .srp-popup-form--confirm h1, #sonaar-modal .sr_popup-content .srp-popup-form--confirm h2, #sonaar-modal .sr_popup-content .srp-popup-form--confirm h3, #sonaar-modal .sr_popup-content .srp-popup-form--confirm h4, #sonaar-modal .sr_popup-content .srp-popup-form--confirm h5, #sonaar-modal .sr_popup-content .srp-popup-form--confirm h6 {
font-size: 36px;
line-height: 0.9;
margin-bottom: 10px; }
#sonaar-modal .sr_popup-content .srp-popup-form--confirm .srp_button {
margin-top: 15px; }
#sonaar-modal .sr_popup-content .srp-popup-form {
width: 430px;
max-width: 100%; }
#sonaar-modal .sr_popup-content .srp-popup-form label {
font-size: 14px; }
#sonaar-modal .sr_popup-content .srp-popup-form select {
font-weight: 600; }
#sonaar-modal .sr_popup-content .srp-popup-form input, #sonaar-modal .sr_popup-content .srp-popup-form textarea, #sonaar-modal .sr_popup-content .srp-popup-form select {
outline: none;
transition: all .3s ease-in-out;
padding: 0 5px 0 12px;
overflow: hidden;
border: unset;
position: relative;
display: flex;
align-items: center;
width: 100%;
height: 44px;
border-radius: 5px;
margin: 5px 0;
background-color: var(--srp-global-modal-form-input-bg-color) !important;
color: var(--srp-global-modal-form-input-color) !important;
border: 1px solid var(--srp-global-modal-form-input-border-color); }
#sonaar-modal .sr_popup-content .srp-popup-form input:focus, #sonaar-modal .sr_popup-content .srp-popup-form input:active, #sonaar-modal .sr_popup-content .srp-popup-form textarea:focus, #sonaar-modal .sr_popup-content .srp-popup-form textarea:active, #sonaar-modal .sr_popup-content .srp-popup-form select:focus, #sonaar-modal .sr_popup-content .srp-popup-form select:active {
border-color: var(--srp-global-modal-btn-bg-color) !important; }
#sonaar-modal .sr_popup-content .srp-popup-form textarea {
padding: 10px;
min-height: 125px;
overflow: auto; }
#sonaar-modal .sr_popup-content .srp-popup-form input:-webkit-autofill,
#sonaar-modal .sr_popup-content .srp-popup-form textarea:-webkit-autofill,
#sonaar-modal .sr_popup-content .srp-popup-form select:-webkit-autofill {
-webkit-text-fill-color: var(--srp-global-modal-form-input-color) !important;
background-color: var(--srp-global-modal-form-input-bg-color) !important;
color: var(--srp-global-modal-form-input-color) !important;
transition: background-color 5000s ease-in-out 0s; }
#sonaar-modal .sr_popup-content .srp-popup-form input:-moz-autofill,
#sonaar-modal .sr_popup-content .srp-popup-form textarea:-moz-autofill,
#sonaar-modal .sr_popup-content .srp-popup-form select:-moz-autofill {
background-color: var(--srp-global-modal-form-input-bg-color) !important;
color: var(--srp-global-modal-form-input-color) !important; }
#sonaar-modal .sr_popup-content .srp-popup-form button {
border-radius: 4px;
background-color: var(--srp-global-modal-btn-bg-color);
color: var(--srp-global-modal-btn-txt-color);
margin-top: 10px;
width: 100%; }
#sonaar-modal .sr_popup-content .srp-popup-form button:hover {
filter: brightness(1.2); }
#sonaar-modal .sr_popup-content .srp-popup-heading {
display: flex;
gap: 15px;
padding-bottom: 15px;
margin-bottom: 15px;
border-bottom: solid 1px var(--srp-global-modal-form-input-border-color); }
#sonaar-modal .sr_popup-content .srp-popup-title {
font-size: 42px;
line-height: 0.9;
margin: 0 auto; }
#sonaar-modal .sr_popup-content .srp-popup-desc {
margin-top: 5px;
font-size: 14px;
opacity: 0.8; }
#sonaar-modal .sr_popup-content .srp-popup-image {
min-width: 80px;
width: 80px; }
#sonaar-modal .sr_popup-content .srp-popup-image img {
border-radius: 3px; }
#sonaar-modal .srp_popup_no_image .srp-make-offer-heading {
flex-direction: column-reverse; }
#sonaar-modal .srp-popup-form--makeoffer .srp-popup-title {
font-size: 36px; }
#sonaar-modal .srp-popup-form--makeoffer .srp-make-offer-heading {
display: flex;
align-items: flex-start;
gap: 10px;
font-size: 18px;
margin-top: 15px;
border-top: solid 1px var(--srp-global-modal-form-input-border-color);
padding-top: 15px;
margin-bottom: 20px; }
#sonaar-modal .srp-popup-form--makeoffer .srp-make-offer-heading .srp-make-offer-product-title {
font-size: 21px;
line-height: 1.2;
margin-bottom: 6px;
font-weight: 500; }
#sonaar-modal .srp-popup-form--makeoffer .srp-make-offer-heading .srp-make-offer-image {
max-width: 70px; }
#sonaar-modal .srp-popup-form--makeoffer .srp-make-offer-heading .srp-make-offer-image img {
border-radius: 4px; }
#sonaar-modal .srp-popup-form--makeoffer .srp-make-offer-description {
font-size: 14px; }
@keyframes srmp3fadein {
from {
opacity: 0;
transform: scale(0.9); }
to {
opacity: 1;
transform: scale(1); } }
@-moz-keyframes srmp3fadein {
from {
opacity: 0;
transform: scale(0.9); }
to {
opacity: 1;
transform: scale(1); } }
@-webkit-keyframes srmp3fadein {
from {
opacity: 0;
transform: scale(0.9); }
to {
opacity: 1;
transform: scale(1); } }
@-ms-keyframes srmp3fadein {
#sonaar-modal from {
opacity: 0;
transform: scale(0.9); }
#sonaar-modal to {
opacity: 1;
transform: scale(1); } }
@-o-keyframes srmp3fadein {
from {
opacity: 0;
transform: scale(0.9); }
to {
opacity: 1;
transform: scale(1); } }
#sonaar-modal .sr_popup-body {
z-index: 2;
position: relative;
-ms-flex: 1 1 auto;
flex: 1 1 auto;
padding: 2.5rem; }
.sr_popup-backdrop {
position: fixed;
top: 0;
left: 0;
z-index: 10050;
width: 100vw;
height: 100vh;
background-color: #000;
opacity: 0;
transition: opacity .15s linear;
pointer-events: none; }
.sr_popup-backdrop.sr_show {
opacity: .75;
pointer-events: initial; }
.sr-store-popup {
cursor: pointer; }
.sr_close {
background: transparent;
height: 32px;
width: 32px;
padding: 0;
position: absolute;
top: 25px;
right: 25px;
z-index: 50;
font-size: 1px;
cursor: pointer; }
.sr_close svg {
height: 100%; }