.audio_player { -moz-user-select: -moz-none; -khtml-user-select: none; -webkit-user-select: none; -ms-user-select: none; user-select: none; -webkit-tap-highlight-color: transparent; padding: 0 0 0; border-radius: 16px; min-width: 600px; min-height: 280px; height: 100%; width: 850px; max-height: 280px; max-width: 95%; font-family: Roboto, Arial, sans-serif; font-weight: 100; color: #ced4d7; background: #2B2B2B; background: -moz-linear-gradient(top, #2B2B2B 0%, #1F1F1F 100%); background: -webkit-linear-gradient(top, #2B2B2B 0%, #1F1F1F 100%); background: linear-gradient(to bottom, #2B2B2B 0%, #1F1F1F 100%); filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#2B2B2B', endColorstr='#1F1F1F', GradientType=0); overflow: hidden; margin: auto; } .audio_player .audio_player_elem { display: none; } .audio_player .audio_mobile_top_cont { display: none; } .audio_player .audio_image { width: 71px; height: 71px; background-image: url("../images/player/thumb.svg"); background-size: 71px 71px; display: inline-block; border-radius: 7px; } .audio_player .audio_image.audio-player-proportional-image { background-size: cover; resize: both; background-repeat: no-repeat; background-position: center; } .audio_player .audio_top_line_cont { width: calc(100% - 71px - 20px); display: inline-flex; vertical-align: top; margin-left: 20px; height: 71px; align-items: flex-start; flex-direction: column; justify-content: center; overflow: hidden; gap: 3px; } .audio_player .audio_top_line_cont .audio_hide_song_list { display: none; } .audio_player .audio_top_line_cont .audio_track_name, .audio_player .audio_top_line_cont .audio_track_artist { font-size: 18px; height: 21px; line-height: 21px; display: inline-block; } .audio_player .audio_top_line_cont .audio_track_name { color: white; overflow: hidden; position: relative; } .audio_player .audio_top_line_cont .audio_track_name span { white-space: nowrap; display: inline-block; position: relative; /*animation: move 3s linear infinite alternate;*/ min-width: 100%; } .audio_player .audio_top_line_cont .audio_track_artist { font-size: 14px; text-overflow: ellipsis; word-break: keep-all; white-space: nowrap; overflow: hidden; display: none; text-align: center; color: white; opacity: 0.5; } .audio_player .audio_top_line_cont .audio_song_list_btn, .audio_player .audio_top_line_cont .audio_analyser_btn, .audio_player .audio_top_line_cont .audio_share_btn { display: inline-block; background-size: auto; width: 20px; height: 20px; background-repeat: no-repeat; } .audio_player .audio_top_line_cont .audio_share_btn { background-image: url(../images/player/share.svg); cursor: pointer; display: none; opacity: 0.7; } .audio_player .audio_left_cont { display: inline-block; padding: 20px 15px 20px; max-height: 280px; width: calc(100% - 285px); } .audio_player .audio_right_cont { display: inline-block; float: right; height: 100%; max-height: 280px; width: 285px; background: #333333; overflow-y: hidden; overflow-x: hidden; } .audio_player .audio_right_cont .audio_right_top_line_cont { padding: 0 16px; display: flex; width: 100%; margin-left: 0; height: 40px; border-bottom: 2px solid #292929; align-items: center; } .audio_player .audio_right_cont .audio_right_top_line_cont .audio_info { margin-left: auto; } .audio_player .audio_right_cont .audio_right_top_line_cont .audio_info div { background-size: auto; background-position: left center; min-width: 25px; display: inline-block; height: 25px; font-size: 10px; line-height: 25px; color: #777777; padding-left: 20px; margin-right: 10px; } .audio_player .audio_right_cont .audio_right_top_line_cont .audio_info div.audio_info_views { padding-left: 15px; } .audio_player .audio_right_cont .audio_right_top_line_cont .audio_info div.audio_info_comments { padding-left: 18px; } .audio_player .audio_right_cont .audio_right_top_line_cont .audio_info div:not(.audio_likes_btn):hover { cursor: auto !important; } .audio_player .audio_right_cont .audio_right_top_line_cont .audio_share_btn { display: inline-block; background-size: auto; width: 25px; height: 25px; background-repeat: no-repeat; background-position: center; background-image: url(../images/player/share.svg); } .audio_player .audio_right_cont .audio_spectrum { width: calc(100% - 34px); height: calc(240px - 34px); position: relative; margin: 17px; } .audio_player .audio_right_cont .audio_spectrum .bars { width: 4px; max-height: 100%; position: absolute; overflow-y: visible !important; bottom: 0; background: #57a9fc; /* Old browsers */ background: -moz-linear-gradient(top, #95c6f7 0%, #57a9fc 50%, #1389FE 100%); /* FF3.6-15 */ background: -webkit-linear-gradient(top, #95c6f7 0%, #57a9fc 50%, #1389FE 100%); /* Chrome10-25,Safari5.1-6 */ background: linear-gradient(to bottom, #95c6f7 0%, #57a9fc 50%, #1389FE 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */ filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#95c6f7', endColorstr='#1389FE', GradientType=0); /* IE6-9 */ } .audio_player .audio_right_cont .audio_spectrum .bars:nth-child(1) { left: 0px; } .audio_player .audio_right_cont .audio_spectrum .bars:nth-child(2) { left: 5px; } .audio_player .audio_right_cont .audio_spectrum .bars:nth-child(3) { left: 10px; } .audio_player .audio_right_cont .audio_spectrum .bars:nth-child(4) { left: 15px; } .audio_player .audio_right_cont .audio_spectrum .bars:nth-child(5) { left: 20px; } .audio_player .audio_right_cont .audio_spectrum .bars:nth-child(6) { left: 25px; } .audio_player .audio_right_cont .audio_spectrum .bars:nth-child(7) { left: 30px; } .audio_player .audio_right_cont .audio_spectrum .bars:nth-child(8) { left: 35px; } .audio_player .audio_right_cont .audio_spectrum .bars:nth-child(9) { left: 40px; } .audio_player .audio_right_cont .audio_spectrum .bars:nth-child(10) { left: 45px; } .audio_player .audio_right_cont .audio_spectrum .bars:nth-child(11) { left: 50px; } .audio_player .audio_right_cont .audio_spectrum .bars:nth-child(12) { left: 55px; } .audio_player .audio_right_cont .audio_spectrum .bars:nth-child(13) { left: 60px; } .audio_player .audio_right_cont .audio_spectrum .bars:nth-child(14) { left: 65px; } .audio_player .audio_right_cont .audio_spectrum .bars:nth-child(15) { left: 70px; } .audio_player .audio_right_cont .audio_spectrum .bars:nth-child(16) { left: 75px; } .audio_player .audio_right_cont .audio_spectrum .bars:nth-child(17) { left: 80px; } .audio_player .audio_right_cont .audio_spectrum .bars:nth-child(18) { left: 85px; } .audio_player .audio_right_cont .audio_spectrum .bars:nth-child(19) { left: 90px; } .audio_player .audio_right_cont .audio_spectrum .bars:nth-child(20) { left: 95px; } .audio_player .audio_right_cont .audio_spectrum .bars:nth-child(21) { left: 100px; } .audio_player .audio_right_cont .audio_spectrum .bars:nth-child(22) { left: 105px; } .audio_player .audio_right_cont .audio_spectrum .bars:nth-child(23) { left: 110px; } .audio_player .audio_right_cont .audio_spectrum .bars:nth-child(24) { left: 115px; } .audio_player .audio_right_cont .audio_spectrum .bars:nth-child(25) { left: 120px; } .audio_player .audio_right_cont .audio_spectrum .bars:nth-child(26) { left: 125px; } .audio_player .audio_right_cont .audio_spectrum .bars:nth-child(27) { left: 130px; } .audio_player .audio_right_cont .audio_spectrum .bars:nth-child(28) { left: 135px; } .audio_player .audio_right_cont .audio_spectrum .bars:nth-child(29) { left: 140px; } .audio_player .audio_right_cont .audio_spectrum .bars:nth-child(30) { left: 145px; } .audio_player .audio_right_cont .audio_spectrum .bars:nth-child(31) { left: 150px; } .audio_player .audio_right_cont .audio_spectrum .bars:nth-child(32) { left: 155px; } .audio_player .audio_right_cont .audio_spectrum .bars:nth-child(33) { left: 160px; } .audio_player .audio_right_cont .audio_spectrum .bars:nth-child(34) { left: 165px; } .audio_player .audio_right_cont .audio_spectrum .bars:nth-child(35) { left: 170px; } .audio_player .audio_right_cont .audio_spectrum .bars:nth-child(36) { left: 175px; } .audio_player .audio_right_cont .audio_spectrum .bars:nth-child(37) { left: 180px; } .audio_player .audio_right_cont .audio_spectrum .bars:nth-child(38) { left: 185px; } .audio_player .audio_right_cont .audio_spectrum .bars:nth-child(39) { left: 190px; } .audio_player .audio_right_cont .audio_spectrum .bars:nth-child(40) { left: 195px; } .audio_player .audio_right_cont .audio_spectrum .bars:nth-child(41) { left: 200px; } .audio_player .audio_right_cont .audio_spectrum .bars:nth-child(42) { left: 205px; } .audio_player .audio_right_cont .audio_spectrum .bars:nth-child(43) { left: 210px; } .audio_player .audio_right_cont .audio_spectrum .bars:nth-child(44) { left: 215px; } .audio_player .audio_right_cont .audio_spectrum .bars:nth-child(45) { left: 220px; } .audio_player .audio_right_cont .audio_spectrum .bars:nth-child(46) { left: 225px; } .audio_player .audio_right_cont .audio_spectrum .bars:nth-child(47) { left: 230px; } .audio_player .audio_right_cont .audio_spectrum .bars:nth-child(48) { left: 235px; } .audio_player .audio_right_cont .audio_spectrum .bars:nth-child(49) { left: 240px; } .audio_player .audio_right_cont .audio_spectrum .bars:nth-child(50) { left: 245px; } .audio_player .audio_right_cont .audio_spectrum .bars .bar-top { position: absolute; height: 2px; width: 4px; left: 0; top: -2px; background: #95c6f7; } .audio_player .audio_right_cont .audio_song_list { overflow-y: scroll; max-height: 240px; min-height: 240px; } .audio_player .audio_right_cont .audio_song_list::-webkit-scrollbar-button { display: none; } .audio_player .audio_right_cont .audio_song_list::-webkit-scrollbar-thumb { background-color: rgba(255, 255, 255, 0.25); border-radius: 2px; } .audio_player .audio_right_cont .audio_song_list::-webkit-scrollbar-thumb:hover { background-color: rgba(255, 255, 255, 0.5); } .audio_player .audio_right_cont .audio_song_list::-webkit-scrollbar-track { background-color: transparent; } .audio_player .audio_right_cont .audio_song_list::-webkit-scrollbar-track:hover { background-color: transparent; } .audio_player .audio_right_cont .audio_song_list::-webkit-scrollbar { width: 3px; } .audio_player .audio_right_cont .audio_song_list .audio_track { min-height: 36px; max-height: 36px; display: flex; color: rgba(255, 255, 255, 0.24); } .audio_player .audio_right_cont .audio_song_list .audio_track .audio_track_index, .audio_player .audio_right_cont .audio_song_list .audio_track .audio_track_length { line-height: 36px; text-align: center; } .audio_player .audio_right_cont .audio_song_list .audio_track .audio_track_index { float: left; min-height: 36px; min-width: 36px; display: inline-block; } .audio_player .audio_right_cont .audio_song_list .audio_track .audio_track_middle { display: inline-flex; flex-wrap: wrap; flex: 1; flex-direction: column; justify-content: center; gap: 2px; max-width: calc(100% - 36px - 70px); height: 36px; } .audio_player .audio_right_cont .audio_song_list .audio_track .audio_track_middle div { display: block; max-width: 100%; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .audio_player .audio_right_cont .audio_song_list .audio_track .audio_track_middle .audio_track_name { color: #FFFFFF8C; } .audio_player .audio_right_cont .audio_song_list .audio_track .audio_track_length { display: inline-block; min-width: 70px; padding-right: 10px; text-align: right; } .audio_player .audio_right_cont .audio_song_list .audio_track.audio_active_track { background: #292929; } .audio_player .audio_right_cont .audio_song_list .audio_track.audio_active_track .audio_track_name { color: white; } .audio_player .audio_right_cont .audio_song_list .audio_track:hover { cursor: pointer; } .audio_player .audio_list_analyser { display: inline-block; } .audio_player .audio_list_analyser .audio_song_list_btn, .audio_player .audio_list_analyser .audio_analyser_btn { display: inline-block; background-size: auto; width: 25px; height: 25px; background-repeat: no-repeat; background-position: center; } .audio_player .audio_main_playback_controls { text-align: center; margin-top: 5px; } .audio_player .audio_main_playback_controls div { display: inline-block; cursor: pointer; margin: 0 16px; background-position: center; background-repeat: no-repeat; } .audio_player .audio_main_playback_controls .audio_rewind_btn, .audio_player .audio_main_playback_controls .audio_fast_forward_btn { background-size: contain; width: 18px; height: 20px; } .audio_player .audio_main_playback_controls .audio_rewind_btn { margin-left: 0; } .audio_player .audio_main_playback_controls .audio_fast_forward_btn { margin-right: 0; } .audio_player .audio_main_playback_controls .audio_prev_track_btn, .audio_player .audio_main_playback_controls .audio_next_track_btn { background-size: contain; width: 20px; height: 17px; } .audio_player .audio_main_playback_controls .audio_play_pause_btn { height: 69px; width: 69px; background-size: contain; -webkit-transition: transform 0.5s ease; transition: transform 0.5s ease; } .audio_player .audio_main_playback_controls .audio_play_pause_btn:active { -webkit-transform: scale(1.1); transform: scale(1.1); } .audio_player .audio_top_cont { margin-top: 5px; } .audio_player .audio_top_cont .audio_progress { display: block; font-size: 15px; width: 100%; } .audio_player .audio_top_cont .audio_progress .audio_progress_bar { margin: 0; width: 100%; border: none; cursor: pointer; display: block; border-radius: 14px; height: 6px; margin-top: 23px; margin-bottom: 5px; transition: unset; } .audio_player .audio_top_cont .audio_progress .audio_track_length, .audio_player .audio_top_cont .audio_progress .audio_time_elapsed { display: inline-block; width: 50%; line-height: 19px; font-size: 16px; color: #777777; } .audio_player .audio_top_cont .audio_progress .audio_track_length { text-align: right; } .audio_player .audio_bottom_cont { margin-top: 20px; display: flex; align-items: center; } .audio_player .audio_bottom_cont .audio_volume_cont { display: inline-block; width: 100px; position: relative; float: right; } .audio_player .audio_bottom_cont .audio_volume_cont:before { content: ""; background-image: url("../images/player/volume_max.svg?v=2"); background-size: auto; background-repeat: no-repeat; position: absolute; background-position: center left; height: 20px; width: 20px; position: absolute; top: 50%; transform: translateY(-50%); } .audio_player .audio_bottom_cont .audio_volume_cont.audio_volume_mute:before { background-image: url("../images/player/volume_mute.svg?v=2"); } .audio_player .audio_bottom_cont .audio_volume_cont.audio_volume_low:before { background-image: url("../images/player/volume_low.svg?v=2"); } .audio_player .audio_bottom_cont .audio_volume_cont.audio_volume_max:before { background-image: url("../images/player/volume_max.svg?v=2"); } .audio_player .audio_bottom_cont .audio_volume_cont.audio_volume_up:before { background-image: url("../images/player/volume_up.svg?v=2"); } .audio_player .audio_bottom_cont .audio_volume_cont.audio_volume_down:before { background-image: url("../images/player/volume_down.svg?v=2"); } .audio_player .audio_bottom_cont .audio_volume_cont .audio_volume_bar { cursor: pointer; width: calc(100% - 30px); margin-left: 30px; height: 4px; border: none; border-radius: 10px; } .audio_player .audio_bottom_cont .audio_loop_order_controls { display: inline-flex; margin-right: auto; height: 30px; align-items: center; } .audio_player .audio_bottom_cont .audio_loop_order_controls .audio_loop_order_control { background-size: auto; height: 21px; width: 21px; display: inline-block; background-position: center; } .audio_player .audio_bottom_cont .audio_loop_order_controls .audio_loop_order_control:not(:last-child) { margin-right: 15px; } .audio_player .audio_bottom_cont .audio_loop_order_controls .audio_loop_order_control:hover { cursor: pointer; } .audio_player .audio_bottom_cont .audio_loop_order_controls .audio_loop_order_control.audio_auto_btn { margin-right: 10px; } .audio_player .audio_bottom_cont .audio_loop_order_controls .audio_playback_control { display: inline-block; position: relative; width: 35px; margin-right: 5px !important; text-align: center; } .audio_player .audio_bottom_cont .audio_loop_order_controls .audio_playback_control .audio_playback_control_list { display: none; position: absolute; bottom: 18px; margin-bottom: 5px; background-color: #2B2B2B; font-size: 10px; width: 100%; max-height: 100px; overflow: auto; border-radius: 5px; } .audio_player .audio_bottom_cont .audio_loop_order_controls .audio_playback_control .audio_playback_control_list::-webkit-scrollbar-button { display: none; } .audio_player .audio_bottom_cont .audio_loop_order_controls .audio_playback_control .audio_playback_control_list::-webkit-scrollbar-thumb { background-color: rgba(255, 255, 255, 0.25); border-radius: 2px; } .audio_player .audio_bottom_cont .audio_loop_order_controls .audio_playback_control .audio_playback_control_list::-webkit-scrollbar-thumb:hover { background-color: rgba(255, 255, 255, 0.5); } .audio_player .audio_bottom_cont .audio_loop_order_controls .audio_playback_control .audio_playback_control_list::-webkit-scrollbar-track { background-color: transparent; } .audio_player .audio_bottom_cont .audio_loop_order_controls .audio_playback_control .audio_playback_control_list::-webkit-scrollbar-track:hover { background-color: transparent; } .audio_player .audio_bottom_cont .audio_loop_order_controls .audio_playback_control .audio_playback_control_list::-webkit-scrollbar { width: 3px; } .audio_player .audio_bottom_cont .audio_loop_order_controls .audio_playback_control .audio_playback_control_list li { text-align: center; color: #818181; line-height: 22px; font-size: 12px; border-radius: 3px; } .audio_player .audio_bottom_cont .audio_loop_order_controls .audio_playback_control .audio_playback_control_list li:hover { color: white; } .audio_player .audio_bottom_cont .audio_loop_order_controls .audio_playback_control .audio_playback_control_list li.current { background-color: white; color: #2B2B2B; } .audio_player .audio_bottom_cont .audio_loop_order_controls .audio_playback_control:hover .audio_playback_control_list { display: block; } .audio_player .audio_bottom_cont .audio_loop_order_controls .audio_playback_control .audio_playback_rate_value { font-size: 20px; line-height: 21px; color: #818181; } .audio_player .audio_bottom_cont .audio_list_analyser { display: none; } .audio_player .audio_bottom_cont input[type=range], .audio_player .audio_top_cont input[type=range] { display: none !important; } .audio_player .audio_play_btn { background-image: url("/images/player/play.svg?v=4"); background-repeat: no-repeat; } .audio_player .audio_play_btn:hover { cursor: pointer; } .audio_player .audio_pause_btn { background-image: url("/images/player/pause.svg?v=4"); background-repeat: no-repeat; } .audio_player .audio_pause_btn:hover { cursor: pointer; } .audio_player .audio_next_track_btn { background-image: url("/images/player/next_track.svg?v=4"); background-repeat: no-repeat; } .audio_player .audio_next_track_btn.audio_active_btn { background-image: url("../images/player/active/next_track.svg?v=4"); } .audio_player .audio_next_track_btn:hover { cursor: pointer; } .audio_player .audio_fast_forward_btn { background-image: url("/images/player/fast_forward.svg?v=4"); background-repeat: no-repeat; } .audio_player .audio_fast_forward_btn:hover { cursor: pointer; } .audio_player .audio_rewind_btn { background-image: url("/images/player/rewind.svg?v=4"); background-repeat: no-repeat; } .audio_player .audio_rewind_btn:hover { cursor: pointer; } .audio_player .audio_prev_track_btn { background-image: url("/images/player/prev_track.svg?v=4"); background-repeat: no-repeat; } .audio_player .audio_prev_track_btn.audio_active_btn { background-image: url("../images/player/active/prev_track.svg?v=4"); } .audio_player .audio_prev_track_btn:hover { cursor: pointer; } .audio_player .audio_next_track_btn { background-image: url("/images/player/next_track.svg?v=4"); background-repeat: no-repeat; } .audio_player .audio_next_track_btn.audio_active_btn { background-image: url("../images/player/active/next_track.svg?v=4"); } .audio_player .audio_next_track_btn:hover { cursor: pointer; } .audio_player .audio_download_btn { background-image: url("/images/player/download.svg?v=4"); background-repeat: no-repeat; } .audio_player .audio_download_btn:hover { cursor: pointer; } .audio_player .audio_song_list_btn { background-image: url("/images/player/song_list.svg?v=4"); background-repeat: no-repeat; } .audio_player .audio_song_list_btn.audio_active_btn { background-image: url("../images/player/active/song_list.svg?v=4"); } .audio_player .audio_song_list_btn:hover { cursor: pointer; } .audio_player .audio_analyser_btn { background-image: url("/images/player/analyser.svg?v=4"); background-repeat: no-repeat; } .audio_player .audio_analyser_btn.audio_active_btn { background-image: url("../images/player/active/analyser.svg?v=4"); } .audio_player .audio_analyser_btn:hover { cursor: pointer; } .audio_player .audio_shuffle_btn { background-image: url("/images/player/shuffle.svg?v=4"); background-repeat: no-repeat; } .audio_player .audio_shuffle_btn.audio_active_btn { background-image: url("../images/player/active/shuffle.svg?v=4"); } .audio_player .audio_shuffle_btn:hover { cursor: pointer; } .audio_player .audio_repeat_btn { background-image: url("/images/player/repeat.svg?v=4"); background-repeat: no-repeat; } .audio_player .audio_repeat_btn.audio_active_btn { background-image: url("../images/player/active/repeat.svg?v=4"); } .audio_player .audio_repeat_btn:hover { cursor: pointer; } .audio_player .audio_likes_btn { background-image: url("/images/player/likes.svg?v=4"); background-repeat: no-repeat; } .audio_player .audio_likes_btn.audio_active_btn { background-image: url("../images/player/active/likes.svg?v=4"); } .audio_player .audio_likes_btn:hover { cursor: pointer; } .audio_player .audio_comments_btn { background-image: url("/images/player/comments.svg?v=4"); background-repeat: no-repeat; } .audio_player .audio_comments_btn:hover { cursor: pointer; } .audio_player .audio_views_btn { background-image: url("/images/player/views.svg?v=4"); background-repeat: no-repeat; } .audio_player .audio_views_btn:hover { cursor: pointer; } .audio_player .audio_auto_btn { background-image: url("/images/player/auto.svg?v=4"); background-repeat: no-repeat; } .audio_player .audio_auto_btn.audio_active_btn { background-image: url("../images/player/active/auto.svg?v=4"); } .audio_player .audio_auto_btn:hover { cursor: pointer; } .audio_player .audio_hide_song_list_btn { background-image: url("/images/player/hide_song_list.svg?v=4"); background-repeat: no-repeat; } .audio_player .audio_hide_song_list_btn:hover { cursor: pointer; } .audio_player.audio_mobile { max-height: 100%; max-width: 100%; min-width: 200px; min-height: 100%; border-radius: 0; } .audio_player.audio_mobile .audio_right_cont { display: none; } .audio_player.audio_mobile .audio_left_cont { width: 100%; height: 100%; padding: 10px 20px; max-height: unset; display: flex; flex-direction: column; justify-content: center; display: relative; } .audio_player.audio_mobile .audio_left_cont .audio_mobile_top_cont { font-family: Roboto, Arial, sans-serif; display: block; text-align: center; } .audio_player.audio_mobile .audio_left_cont .audio_mobile_top_cont .audio_mobile_playlist_intro { font-size: 16px; color: white; margin-bottom: 8px; } .audio_player.audio_mobile .audio_left_cont .audio_mobile_top_cont .audio_mobile_playlist_title { font-size: 20px; margin-bottom: 18px; overflow: hidden; text-overflow: ellipsis; } .audio_player.audio_mobile .audio_left_cont .audio_share_btn { display: inline-block; background-size: auto; width: 25px; height: 25px; background-repeat: no-repeat; background-position: center; background-image: url(../images/player/share.svg); position: absolute; top: 10px; right: 15px; } .audio_player.audio_mobile .audio_left_cont .audio_image { background-repeat: no-repeat; background-size: cover; background-position: center; max-width: 165px; max-height: 165px; width: 100%; height: 100%; display: block; margin: 0 auto; } .audio_player.audio_mobile .audio_left_cont .audio_top_cont .audio_progress { width: 100%; display: inline-block; } .audio_player.audio_mobile .audio_left_cont .audio_top_cont .audio_progress .audio_time_elapsed { float: unset; } .audio_player.audio_mobile .audio_left_cont .audio_top_cont .audio_progress .audio_track_length, .audio_player.audio_mobile .audio_left_cont .audio_top_cont .audio_progress .audio_time_elapsed { float: unset; display: inline-block; width: 50%; font-size: 14px; } .audio_player.audio_mobile .audio_left_cont .audio_top_cont .audio_progress .audio_progress_bar { display: block; width: 100%; height: 42px; margin: 0; border-top: 28px solid transparent; border-bottom: 10px solid transparent; background: #575757; background-repeat: no-repeat !important; border-radius: 0; border: unset; height: 6px; margin-top: 26px; margin-bottom: 10px; border-radius: 5px; } .audio_player.audio_mobile .audio_left_cont .audio_top_cont .audio_progress .audio_progress_bar::-webkit-slider-thumb { -webkit-appearance: none; background: transparent; box-shadow: none; } .audio_player.audio_mobile .audio_left_cont .audio_bottom_cont .audio_info { display: none; } .audio_player.audio_mobile .audio_left_cont .audio_bottom_cont .audio_volume_cont .audio_download_btn, .audio_player.audio_mobile .audio_left_cont .audio_bottom_cont .audio_loop_order_controls .audio_download_btn { display: none !important; } .audio_player.audio_mobile .audio_left_cont .audio_bottom_cont .audio_loop_order_controls .audio_playback_control:hover .audio_playback_control_list { display: none; } .audio_player.audio_mobile .audio_left_cont .audio_bottom_cont .audio_loop_order_controls .audio_playback_control.open .audio_playback_control_list { display: block !important; width: calc(100% + 10px); right: -5px; } .audio_player.audio_mobile .audio_left_cont .audio_bottom_cont .audio_loop_order_controls .audio_playback_control.open .audio_playback_control_list li { line-height: 24px; font-size: 13px; } .audio_player.audio_mobile .audio_left_cont .audio_bottom_cont .audio_volume_cont { margin-left: 0; height: 30px; width: 30px; margin-right: 10px; } .audio_player.audio_mobile .audio_left_cont .audio_bottom_cont .audio_volume_cont:before { width: 30px; height: 30px; background-position: 7px center; } .audio_player.audio_mobile .audio_left_cont .audio_bottom_cont .audio_volume_cont:hover { cursor: pointer; } .audio_player.audio_mobile .audio_left_cont .audio_bottom_cont .audio_volume_cont .audio_volume_bar { display: none; } .audio_player.audio_mobile .audio_left_cont .audio_bottom_cont .audio_volume_cont.audio_volume_bottom { z-index: 99; padding-top: 15px; border-radius: 5px; position: relative; } .audio_player.audio_mobile .audio_left_cont .audio_bottom_cont .audio_volume_cont.audio_volume_bottom:before { width: 100px; height: 30px; background-color: #2c2c2cb3; position: absolute; bottom: 0; top: unset; left: 0; transform: unset; border-radius: 5px; } .audio_player.audio_mobile .audio_left_cont .audio_bottom_cont .audio_volume_cont.audio_volume_bottom .audio_volume_bar { display: block; top: calc(50% - 4px); width: 55px; margin: 2px; left: 0; margin-left: 40px; position: absolute; height: 4px; background: no-repeat; } .audio_player.audio_mobile .audio_left_cont .audio_bottom_cont .audio_volume_cont.audio_volume_bottom .audio_volume_bar::-webkit-slider-thumb { -webkit-appearance: none; background: transparent; box-shadow: none; } .audio_player.audio_mobile .audio_left_cont .audio_bottom_cont .audio_list_analyser { display: inline-block; } .audio_player.audio_mobile .audio_left_cont .audio_bottom_cont .audio_list_analyser .audio_download_btn { background-size: auto; height: 21px; width: 21px; display: inline-block; background-position: center; margin-right: 10px; } .audio_player.audio_mobile .audio_left_cont .audio_bottom_cont .audio_list_analyser .audio_song_list_btn { background-size: 18px auto; } .audio_player.audio_mobile .audio_left_cont .audio_top_line_cont { display: block; width: 100%; margin-left: 0; height: unset; } .audio_player.audio_mobile .audio_left_cont .audio_top_line_cont .audio_track_name { margin-top: 30px; max-width: 100%; width: 100%; text-align: center; } .audio_player.audio_mobile .audio_right_cont .audio_song_list .audio_track { max-height: 46px; } .audio_player.audio_mobile.audio_fullscreen_song_list { display: flex; flex-direction: column-reverse; padding-bottom: 0; } .audio_player.audio_mobile.audio_fullscreen_song_list .audio_mobile_playlist_title { width: 100%; font-size: 14px; margin: 24px 0; text-align: center; text-overflow: ellipsis; word-break: keep-all; white-space: nowrap; overflow: hidden; max-height: 14px; flex: 3; } .audio_player.audio_mobile.audio_fullscreen_song_list .audio_left_cont { height: 63px; overflow: hidden; flex-direction: row; padding: 7px 16px 10px; } .audio_player.audio_mobile.audio_fullscreen_song_list .audio_left_cont .audio_image { width: 46px; height: 46px; min-width: 46px; min-height: 46px; display: inline-block; margin: unset; } .audio_player.audio_mobile.audio_fullscreen_song_list .audio_left_cont .audio_top_line_cont { max-height: 72px; width: calc(100% - 46px - 38px); margin: 0; display: inline-flex; align-items: flex-start; padding-left: 10px; } .audio_player.audio_mobile.audio_fullscreen_song_list .audio_left_cont .audio_top_line_cont .audio_main_playback_controls { max-width: 80px; } .audio_player.audio_mobile.audio_fullscreen_song_list .audio_left_cont .audio_top_line_cont .audio_track_name, .audio_player.audio_mobile.audio_fullscreen_song_list .audio_left_cont .audio_top_line_cont .audio_track_artist { font-size: 13px; margin-top: 0; height: 14px; line-height: 14px; } .audio_player.audio_mobile.audio_fullscreen_song_list .audio_left_cont .audio_top_line_cont .audio_track_name span, .audio_player.audio_mobile.audio_fullscreen_song_list .audio_left_cont .audio_top_line_cont .audio_track_artist span { height: 14px; line-height: 14px; } .audio_player.audio_mobile.audio_fullscreen_song_list .audio_left_cont .audio_top_line_cont .audio_track_artist { text-align: left; display: none; } .audio_player.audio_mobile.audio_fullscreen_song_list .audio_left_cont .audio_top_line_cont .audio_track_name { text-align: left; padding-right: 6px; } .audio_player.audio_mobile.audio_fullscreen_song_list .audio_left_cont .audio_top_line_cont .audio_play_pause_btn { height: 36px; width: 36px; background-size: 36px 36px; } .audio_player.audio_mobile.audio_fullscreen_song_list .audio_left_cont .audio_top_line_cont .audio_main_playback_controls { margin-top: 0; } .audio_player.audio_mobile.audio_fullscreen_song_list .audio_left_cont .audio_top_line_cont .audio_main_playback_controls div:not(.audio_play_pause_btn) { display: none; } .audio_player.audio_mobile.audio_fullscreen_song_list .audio_left_cont .audio_top_line_cont .audio_main_playback_controls .audio_play_pause_btn { margin: 0; } .audio_player.audio_mobile.audio_fullscreen_song_list .audio_left_cont .audio_main_playback_controls { margin-top: 0; display: flex; align-items: center; } .audio_player.audio_mobile.audio_fullscreen_song_list .audio_left_cont .audio_main_playback_controls .audio_prev_track_btn, .audio_player.audio_mobile.audio_fullscreen_song_list .audio_left_cont .audio_main_playback_controls .audio_next_track_btn, .audio_player.audio_mobile.audio_fullscreen_song_list .audio_left_cont .audio_main_playback_controls .audio_rewind_btn, .audio_player.audio_mobile.audio_fullscreen_song_list .audio_left_cont .audio_main_playback_controls .audio_fast_forward_btn { display: none; } .audio_player.audio_mobile.audio_fullscreen_song_list .audio_left_cont .audio_main_playback_controls .audio_play_pause_btn { height: 38px; width: 38px; background-size: contain; margin: 0; } .audio_player.audio_mobile.audio_fullscreen_song_list .audio_left_cont .audio_main_playback_controls .audio_play_btn { background-image: url("/images/player/play-ena3.svg"); background-repeat: no-repeat; } .audio_player.audio_mobile.audio_fullscreen_song_list .audio_left_cont .audio_main_playback_controls .audio_pause_btn { background-image: url("/images/player/pause-ena2.svg"); background-repeat: no-repeat; } .audio_player.audio_mobile.audio_fullscreen_song_list .audio_left_cont .audio_top_cont { position: absolute; bottom: 0; left: 0; right: 0; } .audio_player.audio_mobile.audio_fullscreen_song_list .audio_left_cont .audio_top_cont .audio_progress .audio_track_length, .audio_player.audio_mobile.audio_fullscreen_song_list .audio_left_cont .audio_top_cont .audio_progress .audio_time_elapsed { display: none; } .audio_player.audio_mobile.audio_fullscreen_song_list .audio_left_cont .audio_top_cont .audio_progress .audio_progress_bar { border-radius: 0; margin: 0; height: 4px; } .audio_player.audio_mobile.audio_fullscreen_song_list .audio_right_cont { display: block; width: 100%; overflow: hidden; flex: 1; width: 100%; height: calc(100% - 63px); max-height: unset; } .audio_player.audio_mobile.audio_fullscreen_song_list .audio_right_cont .audio_hide_song_list_btn { display: block; background-size: auto; background-repeat: no-repeat; width: 20px; height: 15px; background-position: left center; } .audio_player.audio_mobile.audio_fullscreen_song_list .audio_right_cont .audio_analyser_btn { display: none; } .audio_player.audio_mobile.audio_fullscreen_song_list .audio_right_cont .audio_hide_song_list_btn, .audio_player.audio_mobile.audio_fullscreen_song_list .audio_right_cont .audio_main_playback_controls { max-width: 80px; } .audio_player.audio_mobile.audio_fullscreen_song_list .audio_right_cont .audio_song_list { min-height: unset; max-height: calc(100% - 40px); } .audio_player.audio_mobile.audio_fullscreen_song_list .audio_right_cont .audio_song_list .audio_track { padding: 0 16px; } .audio_player.audio_mobile.audio_fullscreen_song_list .audio_right_cont .audio_song_list .audio_track .audio_track_index { text-align: left; min-width: 20px; } .audio_player.audio_mobile.audio_fullscreen_song_list .audio_right_cont div.audio_info_comments { margin-right: 0; } .audio_player.audio_mobile.audio_fullscreen_song_list .audio_mobile_top_cont { display: none; } .audio_player.is-player-for-one-file .audio_main_playback_controls .audio_prev_track_btn, .audio_player.is-player-for-one-file .audio_main_playback_controls .audio_next_track_btn { cursor: default; opacity: 0.5; } #gallery2__header__left #audio_song_list_btn { display: inline-block; background-repeat: no-repeat; background-image: url("../images/player/song_list_white.svg"); margin-right: 6px !important; } #gallery2__header__left #audio_song_list_btn.audio_active_btn { background-image: url("../images/player/active/song_list.svg"); } @media screen and (min--moz-device-pixel-ratio: 0) { .audio_song_list { margin-right: -17px !important; overflow-y: scroll; overflow-x: hidden; } } @keyframes move { 0% { transform: translateX(0%); left: 0%; } 100% { transform: translateX(-100%); left: 100%; } }