#stacks_in_1 { background-color: rgba(255, 255, 255, 1.00); } /* Depth Base */ .depth_out h2,.depth_out p,.depth_out a{margin:0;padding:0;border: 0;line-height:1.4;} .depth_out hr:before,.depth_out hr:after,.depth_out .content_in .stacksEmptyFiller{display: none} .depth_in, header .depth_theme_limit, footer .depth_theme_limit{ max-width: 1000px; } main .depth_theme_limit{ max-width: 100%; padding: 0; } .depth_limit{ margin: 0 auto; } .nfont{ font-family: 'Open Sans', sans-serif !important; } h2.nfont, .sub_heading.nfont{ font-family: 'Montserrat', sans-serif !important; } header.depth_theme, main.depth_theme h1, main.depth_theme h2, main.depth_theme h3, main.depth_theme h4, main.depth_theme h5, main.depth_theme h6{ font-family: 'Montserrat', sans-serif !important; } .depth_in a{text-decoration: none;} .depth_in{ font-size: 15px; line-height: 1.4;} /* 2 Col Spacing */ .depth_section{ margin-bottom: 20px; } .depth_out img{max-width: 100%} .depth_out *, .depth_out *:before, .depth_out *:after { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box;} .depth_out .cf:after {content:"";display:table;clear:both;} .depth_out .exp{position:absolute;top:0;left:0;bottom:0;right:0;} @media screen and (min-width: 770px){ /* 2 Col Spacing */ .depth_row .s3_column_left .depth_section{ margin-right: 10.000000px; } .depth_row .s3_column_right .depth_section{ margin-left: 10.000000px; } /* 3 Col Spacing */ .depth_row.three_col .s3_column_left .depth_section{ margin-right: 13.320000px; } .depth_row.three_col .s3_column_center .depth_section{ margin-left: 6.660000px; margin-right: 6.660000px; } .depth_row.three_col .s3_column_right .depth_section{ margin-left: 13.320000px; } /* 4 Col Spacing (1/4) */ .depth_row .s3_column_4:first-child .depth_section{ margin-right: 15.000000px; margin-left: 0; } /* 4 Col Spacing (2/4) */ .depth_row .s3_column_4 + .s3_column_4 .depth_section{ margin-right: 10.000000px; margin-left: 5.000000px; } /* 4 Col Spacing (3/4) */ .depth_row .s3_column_4 + .s3_column_4 + .s3_column_4 .depth_section{ margin-right: 5.000000px; margin-left: 10.000000px; } /* 4 Col Spacing (4/4) */ .depth_row .s3_column_4 + .s3_column_4 + .s3_column_4 + .s3_column_4 .depth_section{ margin-left: 15.000000px; margin-right: 0; } /* Flex Equal Height/Centering */ .s3_row.depth_row, .depth_row .s3_column, .s3_row.depth_row .depth_out, .s3_row.depth_row .depth_out > div, .s3_row.depth_row .depth_wrapper, .s3_row.depth_row .content_out, .s3_row.depth_row .depth_image *{ flex: 1; display: flex !important; } .s3_row.depth_row .content_out, .s3_row.depth_row .content_in{ margin-left: auto !important; margin-right: auto !important; } .depth_ie .s3_row.depth_row, .depth_ie .depth_row .s3_column, .s3_row.depth_row .depth_ie .depth_out, .s3_row.depth_row .depth_ie .depth_out > div, .s3_row.depth_row .depth_ie .depth_wrapper, .s3_row.depth_row .depth_ie .content_out, .s3_row.depth_row .depth_ie .depth_image *{ flex: auto !important; display: block !important; } } .content_flex {position: static;} .s3_row.depth_row .content_flex { flex: 1; display: flex; justify-content: center; -webkit-justify-content: center; } /* Edit Mode */ /* Animations */ .depth_fx .depth_image, .depth_fx .depth_tint, .depth_fx .depth_gradient, .depth_fx .content_tint, .depth_fx p.sub_heading, .depth_fx .heading_out .stacks_out, .depth_fx p.main_content, .depth_fx .depth_aside, .depth_fx .heading_out h2{ opacity: 0; } .depth_fx.depth_ie .depth_image, .depth_fx.depth_ie .depth_tint, .depth_fx.depth_ie .depth_gradient, .depth_fx.depth_ie .content_tint, .depth_fx.depth_ie p.sub_heading, .depth_fx.depth_ie .heading_out .stacks_out, .depth_fx.depth_ie p.main_content, .depth_fx.depth_ie .depth_aside, .depth_fx.depth_ie .heading_out h2{ opacity: 1; } .depth_inview.slow_fadeIn.depth_fx .depth_image, .depth_inview.slow_fadeIn.depth_fx .depth_tint, .depth_inview.slow_fadeIn.depth_fx .content_tint, .depth_inview.slow_fadeIn.depth_fx .depth_gradient{ animation: nbanner_fadein .7s both; } .depth_inview.slow_fadeIn.depth_fx .heading_out{ animation: heading_border_color 1s both; } .depth_inview.slow_fadeIn.depth_fx p.super_heading, .depth_inview.slow_fadeIn.depth_fx .heading_out h2{ animation: nbanner_fadein 1s .25s both; } .depth_inview.slow_fadeIn.depth_fx p.sub_heading, .depth_inview.slow_fadeIn.depth_fx .heading_out .stacks_out{ animation: nbanner_fadein 1s .5s both; } .depth_inview.slow_fadeIn.depth_fx p.main_content, .depth_inview.slow_fadeIn.depth_fx .depth_aside{ animation: nbanner_fadein 1s .75s both; } .depth_inview.slow_fadeIn.depth_fx a.depth_button{ animation: nbanner_fadein 1s 1s backwards; } .depth_inview.slow_fadeIn.depth_fx p.sub_content{ animation: nbanner_fadein 1s 1.25s backwards; } .depth_inview.slow_fadeIn.depth_fx hr.hr_top_header{ animation: hr_top_header 1s .5s backwards; } .depth_inview.slow_fadeIn.depth_fx hr.hr_bottom_header{ animation: hr_bottom_header 1s .5s backwards; } .depth_inview.slow_fadeIn.depth_fx hr.hr_bottom_content{ animation: hr_bottom_content 1s .5s backwards; } .depth_inview.steady_fadeIn.depth_fx .depth_image, .depth_inview.steady_fadeIn.depth_fx .depth_tint, .depth_inview.steady_fadeIn.depth_fx .content_tint, .depth_inview.steady_fadeIn.depth_fx .depth_gradient{ animation: nbanner_fadein .5s both; } .depth_inview.steady_fadeIn.depth_fx .heading_out{ animation: heading_border_color .7s both; } .depth_inview.steady_fadeIn.depth_fx p.super_heading, .depth_inview.steady_fadeIn.depth_fx .heading_out h2{ animation: nbanner_fadein .7s .15s both; } .depth_inview.steady_fadeIn.depth_fx p.sub_heading, .depth_inview.steady_fadeIn.depth_fx .heading_out .stacks_out{ animation: nbanner_fadein .7s .35s both; } .depth_inview.steady_fadeIn.depth_fx p.main_content, .depth_inview.steady_fadeIn.depth_fx .depth_aside{ animation: nbanner_fadein .7s .5s both; } .depth_inview.steady_fadeIn.depth_fx a.depth_button{ animation: nbanner_fadein .7s .65s backwards; } .depth_inview.steady_fadeIn.depth_fx p.sub_content{ animation: nbanner_fadein .7s .8s backwards; } .depth_inview.steady_fadeIn.depth_fx hr.hr_top_header{ animation: hr_top_header .7s .25s backwards; } .depth_inview.steady_fadeIn.depth_fx hr.hr_bottom_header{ animation: hr_bottom_header .7s .25s backwards; } .depth_inview.steady_fadeIn.depth_fx hr.hr_bottom_content{ animation: hr_bottom_content .7s .25s backwards; } .depth_inview.fast_fadeIn.depth_fx .depth_image, .depth_inview.fast_fadeIn.depth_fx .depth_tint, .depth_inview.fast_fadeIn.depth_fx .content_tint, .depth_inview.fast_fadeIn.depth_fx .depth_gradient{ animation: nbanner_fadein .3s both; } .depth_inview.fast_fadeIn.depth_fx .heading_out{ animation: heading_border_color .4s both; } .depth_inview.fast_fadeIn.depth_fx p.super_heading, .depth_inview.fast_fadeIn.depth_fx .heading_out h2{ animation: nbanner_fadein .4s .15s both; } .depth_inview.fast_fadeIn.depth_fx p.sub_heading, .depth_inview.fast_fadeIn.depth_fx .heading_out .stacks_out{ animation: nbanner_fadein .4s .35s both; } .depth_inview.fast_fadeIn.depth_fx p.main_content, .depth_inview.fast_fadeIn.depth_fx .depth_aside{ animation: nbanner_fadein .4s .5s both; } .depth_inview.fast_fadeIn.depth_fx a.depth_button{ animation: nbanner_fadein .4s .65s backwards; } .depth_inview.fast_fadeIn.depth_fx p.sub_content{ animation: nbanner_fadein .4s .8s backwards; } .depth_inview.fast_fadeIn.depth_fx hr.hr_top_header{ animation: hr_top_header .4s .25s backwards; } .depth_inview.fast_fadeIn.depth_fx hr.hr_bottom_header{ animation: hr_bottom_header .4s .25s backwards; } .depth_inview.fast_fadeIn.depth_fx hr.hr_bottom_content{ animation: hr_bottom_content .4s .25s backwards; } @-webkit-keyframes heading_border_color { from {border-color: transparent;} to {border-color: ;}} @keyframes nbanner_fadein { from {border-color: transparent;} to {border-color: ;}} @-webkit-keyframes nbanner_fadein { from {opacity: 0;} to {opacity: 1;}} @keyframes nbanner_fadein { from {opacity: 0;} to {opacity: 1;}} @-webkit-keyframes nbanner_bg_fadein { from {background-color: transparent;} to {background-color: inherit;}} @keyframes nbanner_bg_fadein { from {background-color: transparent;} to {background-color: inherit;}} @-webkit-keyframes hr_top_header { from {width: 0; opacity: 0;} to {opacity: 1; width: %;}} @keyframes hr_top_header { from {width: 0; opacity: 0;} to {opacity: 1; width: %;}} @-webkit-keyframes hr_bottom_header { from {width: 0; opacity: 0;} to {opacity: 1; width: %;}} @keyframes hr_bottom_header { from {width: 0; opacity: 0;} to {opacity: 1; width: %;}} @-webkit-keyframes hr_bottom_content { from {width: 0; opacity: 0;} to {opacity: 1; width: %;}} @keyframes hr_bottom_content { from {width: 0; opacity: 0;} to {opacity: 1; width: %;}} #stacks_in_256 { padding: 20px; } /* 2.0.1 - improves overall performance on retina devices - fixes performance issue in safari when using the Frosted Glass effect - fixes a loading bug with the parallax effect */ #stacks_in_603.btr-bg-outer .btr-bg-inner { min-height: 100px; } #stacks_in_603.btr-bg-gradient .btr-bg-inner , #stacks_in_603.btr-bg-animated .btr-bg-inner , #stacks_in_603.btr-bg-blur .btr-bg-inner , #stacks_in_603.btr-bg-mouse .btr-bg-inner , #stacks_in_603.btr-bg-pan .btr-bg-inner , #stacks_in_603.btr-bg-parallax .btr-bg-inner , #stacks_in_603.btr-bg-transition .btr-bg-inner , #stacks_in_603.btr-bg-none .btr-bg-inner { padding: 0px 0px 0px 0px; } #stacks_in_603.btr-bg-none { background-color: rgba(255, 255, 255, 1.00); } #stacks_in_603.btr-bg-outer:after { background: rgba(255, 255, 255, 0.53); } #stacks_in_603.btr-bg-outer { background-image : url(../files/backgroundImageBlur-603.png); background-position: center center; background-size: contain; -webkit-transform:translateZ(0); } #stacks_in_603.btr-bg-outer .btr-bg-inner .btr-bg-content { position: relative; background-color : rgba(255, 255, 255, 0.00); overflow: hidden; padding: 24px 24px 24px 24px; margin: 0 auto; max-width: 960px; width: 100%; } #stacks_in_603.btr-bg-outer .btr-bg-inner .btr-bg-header, #stacks_in_603.btr-bg-outer .btr-bg-inner .btr-bg-footer { pointer-events: none; opacity: 0; } #stacks_in_603.btr-bg-animated { background-position: center center; background-size: contain; background-repeat: repeat; background-color: rgba(255, 255, 255, 1.00); will-change: background-position; } #stacks_in_603.btr-bg-animated { -webkit-animation: btr-b-tstacks_in_603 1200s linear infinite; animation: btr-b-tstacks_in_603 1200s linear infinite; } @-webkit-keyframes btr-b-tstacks_in_603 { 0%{ background-position: center 0%;} 100%{ background-position: center -10000px; } } @keyframes btr-b-tstacks_in_603 { 0%{ background-position: center 0%;} 100%{ background-position: center -10000px; } } #stacks_in_603.btr-bg-animated.btr-bg-disabled:before, #stacks_in_603.btr-bg-animated.btr-bg-disabled { -webkit-animation: none; animation: none } #stacks_in_674 h1,#stacks_in_674 h1 a,#stacks_in_674 p,#stacks_in_674 p a{ color:rgba(0, 0, 255, 1.00); -webkit-font-smoothing: antialiased; transition: color 0.2s ease-in-out; font-style:normal; text-decoration:none; text-align:center; font-weight: bold ; text-shadow: 15px 11px 13px rgba(204, 204, 204, 1.00); } #stacks_in_674 p a:hover, #stacks_in_674 h1 a:hover{ color:rgba(204, 204, 204, 1.00); } #stacks_in_675 { font-weight: bold; } #stacks_in_678 h3,#stacks_in_678 h3 a,#stacks_in_678 p,#stacks_in_678 p a{ color:rgba(15, 128, 255, 1.00); -webkit-font-smoothing: antialiased; transition: color 0.2s ease-in-out; font-style:normal; text-decoration:none; text-align:center; font-weight: bold ; text-shadow: 0 0 1px rgba(255, 255, 102, 1.00), 1px 1px 1px rgba(240, 240, 87, 1.00), 2px 2px 1px rgba(225, 225, 72, 1.00), 3px 3px 1px rgba(210, 210, 57, 1.00), 4px 4px 1px rgba(195, 195, 42, 1.00), 5px 5px 1px rgba(180, 180, 27, 1.00); padding:5px 0; } #stacks_in_678 p a:hover, #stacks_in_678 h3 a:hover{ color:rgba(204, 204, 204, 1.00); } #stacks_in_680 h1,#stacks_in_680 h1 a,#stacks_in_680 p,#stacks_in_680 p a{ color:rgba(0, 0, 255, 1.00); -webkit-font-smoothing: antialiased; transition: color 0.2s ease-in-out; font-style:normal; text-decoration:none; text-align:center; font-weight: bold ; text-shadow: 15px 11px 13px rgba(204, 204, 204, 1.00); } #stacks_in_680 p a:hover, #stacks_in_680 h1 a:hover{ color:rgba(204, 204, 204, 1.00); } #stacks_in_681 { font-size: 87%; font-weight: bold; } #stacks_in_490 { padding: 20px; } #stacks_in_175>.s3_row { margin: 0 -8px; } #stacks_in_175>.s3_row>.s3_column_left { width: 50.00%; } #stacks_in_175>.s3_row>.s3_column_right { width: 50.000000%; } #stacks_in_175>.s3_row>.s3_column { padding: 0 8px; } @media only screen and (max-width: 770px) { #stacks_in_175>.s3_row { margin: -8px 0; } #stacks_in_175>.s3_row>.s3_column { padding: 8px 0; width:100%; } } @media only screen and (max-width: 400px) { #stacks_in_175>.s3_row { margin: -8px 0; } #stacks_in_175>.s3_row>.s3_column { padding: 8px 0; width:100%; } } #stacks_in_175 { background-color: rgba(255, 255, 255, 1.00); } #stacks_in_621 { background-color: rgba(102, 204, 255, 0.10); -moz-border-radius: 10px; -webkit-border-radius: 10px; border-radius: 10px; } #stacks_in_622 { font-size: 200%; } #stacks_in_623 { padding: 20px; } #stacks_in_492 *, #stacks_in_492 *:before, #stacks_in_492 *:after { box-sizing: border-box; } #stacks_in_492 { max-width: 800px; margin: 0 auto; } #playlisterWrapperstacks_in_492 { -webkit-box-shadow: 0px 0px 5px 2px rgba(205, 205, 205, 1.00); box-shadow: 0px 0px 5px 2px rgba(205, 205, 205, 1.00); margin: 5px; border-top-left-radius: 5px; border-top-right-radius: 5px; border-bottom-right-radius: 5px; border-bottom-left-radius: 5px; } #playlisterPlaceholderstacks_in_492 { display: none !important; } #playlisterstacks_in_492 { border-radius: 0px; height: auto; position: relative; width: auto; z-index: 2; display: block; overflow: auto; padding: 15px; border-top-left-radius: 5px; border-top-right-radius: 5px; border-bottom-right-radius: 0px; border-bottom-left-radius: 0px; } /* Solid colour fill */ #playlisterstacks_in_492 { background: rgba(255, 255, 255, 1.00); } #playlisterstacks_in_492 .btn { text-decoration: none; margin-top: 5px; } #coverControlsWrapperstacks_in_492 { position: relative; height: auto; overflow: auto; margin-bottom: 5px; display: flex; flex-direction: column; width: 100%; text-align: left; } @media screen and (min-width: 600px) { #coverControlsWrapperstacks_in_492 { flex-direction: row; } } #coverControlsWrapperstacks_in_492 { min-height: 70px; } #coverstacks_in_492 { background-repeat: no-repeat; background-size: contain; background-position: center; border-top-left-radius: 5px; border-top-right-radius: 5px; border-bottom-right-radius: 5px; border-bottom-left-radius: 5px; position: relative; height: 70px; width: 70px; display: block; margin: 0 auto; } @media screen and (min-width: 600px) { #coverstacks_in_492 { justify-content: space-around; } } #playerInterfacestacks_in_492 { display: block; overflow: hidden; text-align: center; } @media screen and (min-width: 600px) { #playerInterfacestacks_in_492 { flex: 1; padding-left: 15px; display: flex; flex-direction: column; justify-content: space-around; text-align: left; } } #playlisterTopSectionstacks_in_492 { height: auto; overflow: auto; margin-top: 15px; } @media screen and (min-width: 600px) { #playlisterTopSectionstacks_in_492 { margin-top: 0px; } } #titlestacks_in_492 { color: rgba(255, 255, 255, 1.00); font-size: 24px; font-weight: bold; line-height: 1.50em; } #titlestacks_in_492:before { content: ' '; } #albumstacks_in_492 { color: rgba(205, 205, 205, 1.00); font-size: 16px; line-height: 1.50em; } #albumstacks_in_492:before { content: 'Album: '; } #artiststacks_in_492 { color: rgba(205, 205, 205, 1.00); font-size: 16px; line-height: 1.50em; } #artiststacks_in_492:before { content: 'Artist: '; } #additionalInfostacks_in_492 { color: rgba(205, 205, 205, 1.00); font-size: 16px; line-height: 1.50em; } #additionalInfostacks_in_492:before { content: ' '; } #controlsstacks_in_492 { position: relative; margin: 0px; padding: 0; color: #cdcdcd; overflow: visible; } @media screen and (min-width: 600px) { #controlsstacks_in_492 { padding-top: 10px; } } #buttonWrapperstacks_in_492 { display: table; position: relative; vertical-align: middle; text-align: center; width: 100%; } #playlisterWrapperstacks_in_492 .buttonItem { display: table-cell; text-align: center; position: relative; overflow: visible; } #playlisterWrapperstacks_in_492 .playlisterButtonStandard, #playlisterWrapperstacks_in_492 .playlisterButton { display: inline-block; width: 50px; height: 50px; text-align: center; line-height: 50px; text-align: center; font-size: 20px; background: rgba(102, 204, 255, 0.35); border-radius: 50%; transition: all 300ms ease-in-out; color: rgba(230, 230, 230, 1.00); cursor: pointer; position: relative; overflow: hidden; box-shadow: 0px 1px 4px -2px #333; text-shadow: 0px -1px #333; border: 1px solid rgba(255, 255, 255, 1.00); } #playlisterWrapperstacks_in_492 .playlisterButtonStandard i, #playlisterWrapperstacks_in_492 .playlisterButton i { color: rgba(230, 230, 230, 1.00); transition: all 300ms ease-in-out; line-height: 50px !important; } #playlisterWrapperstacks_in_492 .playlisterButtonStandard:hover, #playlisterWrapperstacks_in_492 .playlisterButtonStandard:active, #playlisterWrapperstacks_in_492 .playlisterButtonStandard:focus, #playlisterWrapperstacks_in_492 .playlisterButton:hover, #playlisterWrapperstacks_in_492 .playlisterButton:active, #playlisterWrapperstacks_in_492 .playlisterButton:focus { color: rgba(0, 0, 255, 1.00); background: rgba(102, 204, 255, 0.50); border: 1px solid rgba(255, 255, 255, 1.00); } #playlisterWrapperstacks_in_492 .playlisterButtonStandard:hover i, #playlisterWrapperstacks_in_492 .playlisterButtonStandard:active i, #playlisterWrapperstacks_in_492 .playlisterButtonStandard:focus i, #playlisterWrapperstacks_in_492 .playlisterButton:hover i, #playlisterWrapperstacks_in_492 .playlisterButton:active i, #playlisterWrapperstacks_in_492 .playlisterButton:focus i { color: rgba(0, 0, 255, 1.00); } #playlisterWrapperstacks_in_492 #playstacks_in_492 i { margin-right: -3px; } #playlisterWrapperstacks_in_492 #pausestacks_in_492 { display: none; } #playlisterWrapperstacks_in_492 .playlisterIsPlaying #playstacks_in_492 { display: none; } #playlisterWrapperstacks_in_492 .playlisterIsPlaying #pausestacks_in_492 { display: inline-block; } /* Glass effect */ #playlisterWrapperstacks_in_492 .playlisterButton:after, #playlisterWrapperstacks_in_492 .playlisterButtonStandard:after { content: ''; position: absolute; top: 0px; left: 0px; width: 100%; height: 50%; background: linear-gradient(rgba(255, 255, 255, 0.05), rgba(255, 255, 255, 0.05)); } #userOptionsBarstacks_in_492 { float: right; } #playlisterWrapperstacks_in_492 .playlisterInterfaceComponent, #playlisterWrapperstacks_in_492 .playlisterInterfaceComponentStandard { margin-bottom: 15px; margin-left: 15px; } @media screen and (min-width: 600px) { #playlisterWrapperstacks_in_492 .playlisterInterfaceComponent, #playlisterWrapperstacks_in_492 .playlisterInterfaceComponentStandard { float: left; } } #volumeControlsstacks_in_492, #volumeBtnstacks_in_492 { display: none; } @media screen and (min-width: 600px) { #volumeBtnstacks_in_492 { display: inline-block; } #volumeControlsstacks_in_492 { height: 140px; width: 70px; display: none; position: absolute; left: 50%; bottom: 100%; margin-left: -35px; overflow: visible; z-index: 90; background: rgba(25, 25, 25, 1.00); border-radius: 10px; } #volume-fullstacks_in_492 { position: absolute; left: 14px; top: 10px; width: 100%; display: block; font-size: 20px; text-align: left; } #volume-mutestacks_in_492 { position: absolute; left: 18px; top: 110px; width: 100%; display: block; text-align: left; font-size: 20px; } #volume-mutestacks_in_492 i, #volume-fullstacks_in_492 i { color: rgba(205, 205, 205, 1.00); line-height: 1; padding: 0; margin: 0; } #volumeSliderstacks_in_492 { position: absolute; top: 10px; right: 15px; display: block; height: 100%; } #volumestacks_in_492 { height: 120px; width: 10px; background: rgba(102, 102, 102, 1.00); position: relative; border-radius: 5px; } #volumestacks_in_492 .ui-slider-range { background: rgba(75, 179, 135, 1.00); border-radius: 5px; outline: none; display: block; width: 100%; position: absolute; bottom: 0; left: 0; } #volumestacks_in_492 .ui-slider-handle { cursor: pointer; position: absolute; left: 0; bottom: 0px; margin-left: -5px; margin-bottom: -10px; width: 20px; height: 20px; z-index: 2; border-radius: 10px; background: rgba(205, 205, 205, 1.00); outline: none; } } #progressBarstacks_in_492 { margin-bottom: 5px; height: auto; overflow: auto; } #trackerstacks_in_492 { display: block; position: relative; height: 10px; background: rgba(102, 102, 102, 1.00); margin-top: 5px; border-radius: 5px; overflow: hidden; } #trackerstacks_in_492 #progressstacks_in_492 { background-color: rgba(75, 179, 135, 1.00); height: 100%; display: block; width: 0px; background-image: -webkit-linear-gradient(45deg,rgba(255,255,255,.15) 25%,transparent 25%,transparent 50%,rgba(255,255,255,.15) 50%,rgba(255,255,255,.15) 75%,transparent 75%,transparent); background-image: -o-linear-gradient(45deg,rgba(255,255,255,.15) 25%,transparent 25%,transparent 50%,rgba(255,255,255,.15) 50%,rgba(255,255,255,.15) 75%,transparent 75%,transparent); background-image: linear-gradient(45deg,rgba(255,255,255,.15) 25%,transparent 25%,transparent 50%,rgba(255,255,255,.15) 50%,rgba(255,255,255,.15) 75%,transparent 75%,transparent); -webkit-background-size: 20px 20px; background-size: 20px 20px; -webkit-animation: playlister-progress-bar-stripes 2s linear infinite; -o-animation: playlister-progress-bar-stripes 2s linear infinite; animation: playlister-progress-bar-stripes 2s linear infinite; } @-webkit-keyframes playlister-progress-bar-stripes { from { background-position: 20px 0; } to { background-position: 0 0; } } @keyframes playlister-progress-bar-stripes { from { background-position: 20px 0; } to { background-position: 0 0; } } #currentstacks_in_492 { float: left; font-size: 14px; margin-top: 4px; color: rgba(205, 205, 205, 1.00); } #durationstacks_in_492 { float: right; font-size: 14px; margin-top: 4px; color: rgba(205, 205, 205, 1.00); } /* iOS can't preload audio and fetch the total duration until the track starts to play. So we make duration invisisble and make it visible on desktops or (via jQuery) when the track is clicked and playing */ #durationstacks_in_492 { visibility: hidden; } #durationstacks_in_492.showDuration { visibility: visible; } #playlisterPlayliststacks_in_492 { background-color: rgba(255, 255, 255, 1.00); list-style-type: none; margin: 0; padding: 0px; position: relative; z-index: 1; /* Start either displayed or hidden */ display: block; overflow: hidden; border-top-left-radius: 0px; border-top-right-radius: 0px; border-bottom-right-radius: 5px; border-bottom-left-radius: 5px; -webkit-column-count: 1; -moz-column-count: 1; column-count: 1; -webkit-column-gap: 0px; -moz-column-gap: 0px; column-gap: 0px; -webkit-column-rule: 0px solid #CDCDCD; -moz-column-rule: 0px solid #CDCDCD; column-rule: 0px solid #CDCDCD; /* Hide top-most item borders */ margin-top: -0px } @media screen and (min-width: 34em) { #playlisterPlayliststacks_in_492 { -webkit-column-count: 2; -moz-column-count: 2; column-count: 2; } } @media screen and (min-width: 48em) { #playlisterPlayliststacks_in_492 { -webkit-column-count: 3; -moz-column-count: 3; column-count: 3; } } @media screen and (min-width: 62em) { #playlisterPlayliststacks_in_492 { -webkit-column-count: 3; -moz-column-count: 3; column-count: 3; } } @media screen and (min-width: 75em) { #playlisterPlayliststacks_in_492 { -webkit-column-count: 3; -moz-column-count: 3; column-count: 3; } } #playlisterPlayliststacks_in_492 li { display: block; width: 100%; margin: 0; padding: 0; background: rgba(255, 255, 255, 1.00); color: rgba(153, 153, 153, 1.00); font-size: 18px; height: 45px; line-height: 45px; cursor: pointer; transition: color 300ms ease-in-out, background 300ms ease-in-out; overflow: hidden; position: relative; -webkit-column-break-inside: avoid; break-inside: avoid; transform: translateZ(0); border-top: 0px solid #CDCDCD; } #playlisterPlayliststacks_in_492 li:hover { background: rgba(234, 234, 234, 1.00); } #playlisterPlayliststacks_in_492 li.active-playlistitem, #playlisterPlayliststacks_in_492 li.active-playlistitem:hover { font-weight: normal; color: rgba(0, 0, 0, 1.00); background: rgba(102, 204, 255, 0.18); } #playlisterPlayliststacks_in_492 li { padding-left: 0; } #playlisterPlayliststacks_in_492 li .playlistItemNumber { display: inline-block; width: 35px; text-align: right; margin: 0 10px 0 0; padding: 0; } #playlisterPlayliststacks_in_492 li .playListerAdditionalInfo { display: none; } #playlisterPlayliststacks_in_492 li .playlistItemActiveIcon { display: none; } .no-audio #playlisterstacks_in_492, .no-audio #playlisterPlayliststacks_in_492 { display: none; } #playlisterNoAudiostacks_in_492 { display: none; } .no-audio #playlisterNoAudiostacks_in_492 { padding: 15px; display: none; } .no-adownload #downloadstacks_in_492 { display: none; } #playlisterWrapperstacks_in_492 #titlestacks_in_492 { display: none; } #playlisterWrapperstacks_in_492 #albumstacks_in_492 { display: none; } #playlisterWrapperstacks_in_492 #artiststacks_in_492 { display: none; } #playlisterWrapperstacks_in_492 #additionalInfostacks_in_492 { display: none; } #playlisterWrapperstacks_in_492 #downloadstacks_in_492 { display: none !important; } #playlisterWrapperstacks_in_492 #progressBarstacks_in_492 { display: none; } #playlisterWrapperstacks_in_492 #repeatstacks_in_492 { display: none; } #playlisterWrapperstacks_in_492 #volumeBtnstacks_in_492 { display: none; } #playlisterWrapperstacks_in_492 #shufflestacks_in_492 { display: none; } #playlisterWrapperstacks_in_492 #playlistTogglestacks_in_492 { display: none; } #playlisterPlaceholderstacks_in_492 { display: none; padding: 15px; margin: 15px; background: #ffffff; color: #000000; font-family: "Courier New", Courier, mono; } #playlisterPlaceholderstacks_in_492 audio { width: 100%; } #stacks_in_492 { background-color: rgba(255, 255, 255, 1.00); -moz-border-radius: 10px; -webkit-border-radius: 10px; border-radius: 10px; } #stacks_in_521 { padding: 20px; } #stacks_in_519 { background-color: rgba(102, 204, 255, 0.10); -moz-border-radius: 10px; -webkit-border-radius: 10px; border-radius: 10px; } #stacks_in_520 { font-size: 200%; } #stacks_in_613 { padding: 20px; } #stacks_in_352 { padding: 20px; } #stacks_in_523 *, #stacks_in_523 *:before, #stacks_in_523 *:after { box-sizing: border-box; } #stacks_in_523 { max-width: 800px; margin: 0 auto; } #playlisterWrapperstacks_in_523 { -webkit-box-shadow: 0px 0px 5px 2px rgba(205, 205, 205, 1.00); box-shadow: 0px 0px 5px 2px rgba(205, 205, 205, 1.00); margin: 5px; border-top-left-radius: 5px; border-top-right-radius: 5px; border-bottom-right-radius: 5px; border-bottom-left-radius: 5px; } #playlisterPlaceholderstacks_in_523 { display: none !important; } #playlisterstacks_in_523 { border-radius: 0px; height: auto; position: relative; width: auto; z-index: 2; display: block; overflow: auto; padding: 15px; border-top-left-radius: 5px; border-top-right-radius: 5px; border-bottom-right-radius: 0px; border-bottom-left-radius: 0px; } /* Solid colour fill */ #playlisterstacks_in_523 { background: rgba(255, 255, 255, 1.00); } #playlisterstacks_in_523 .btn { text-decoration: none; margin-top: 5px; } #coverControlsWrapperstacks_in_523 { position: relative; height: auto; overflow: auto; margin-bottom: 5px; display: flex; flex-direction: column; width: 100%; text-align: left; } @media screen and (min-width: 600px) { #coverControlsWrapperstacks_in_523 { flex-direction: row; } } #coverControlsWrapperstacks_in_523 { min-height: 70px; } #coverstacks_in_523 { background-repeat: no-repeat; background-size: contain; background-position: center; border-top-left-radius: 5px; border-top-right-radius: 5px; border-bottom-right-radius: 5px; border-bottom-left-radius: 5px; position: relative; height: 70px; width: 70px; display: block; margin: 0 auto; } @media screen and (min-width: 600px) { #coverstacks_in_523 { justify-content: space-around; } } #playerInterfacestacks_in_523 { display: block; overflow: hidden; text-align: center; } @media screen and (min-width: 600px) { #playerInterfacestacks_in_523 { flex: 1; padding-left: 15px; display: flex; flex-direction: column; justify-content: space-around; text-align: left; } } #playlisterTopSectionstacks_in_523 { height: auto; overflow: auto; margin-top: 15px; } @media screen and (min-width: 600px) { #playlisterTopSectionstacks_in_523 { margin-top: 0px; } } #titlestacks_in_523 { color: rgba(255, 255, 255, 1.00); font-size: 24px; font-weight: bold; line-height: 1.50em; } #titlestacks_in_523:before { content: ' '; } #albumstacks_in_523 { color: rgba(205, 205, 205, 1.00); font-size: 16px; line-height: 1.50em; } #albumstacks_in_523:before { content: 'Album: '; } #artiststacks_in_523 { color: rgba(205, 205, 205, 1.00); font-size: 16px; line-height: 1.50em; } #artiststacks_in_523:before { content: 'Artist: '; } #additionalInfostacks_in_523 { color: rgba(205, 205, 205, 1.00); font-size: 16px; line-height: 1.50em; } #additionalInfostacks_in_523:before { content: ' '; } #controlsstacks_in_523 { position: relative; margin: 0px; padding: 0; color: #cdcdcd; overflow: visible; } @media screen and (min-width: 600px) { #controlsstacks_in_523 { padding-top: 10px; } } #buttonWrapperstacks_in_523 { display: table; position: relative; vertical-align: middle; text-align: center; width: 100%; } #playlisterWrapperstacks_in_523 .buttonItem { display: table-cell; text-align: center; position: relative; overflow: visible; } #playlisterWrapperstacks_in_523 .playlisterButtonStandard, #playlisterWrapperstacks_in_523 .playlisterButton { display: inline-block; width: 50px; height: 50px; text-align: center; line-height: 50px; text-align: center; font-size: 20px; background: rgba(102, 204, 255, 0.35); border-radius: 50%; transition: all 300ms ease-in-out; color: rgba(230, 230, 230, 1.00); cursor: pointer; position: relative; overflow: hidden; box-shadow: 0px 1px 4px -2px #333; text-shadow: 0px -1px #333; border: 1px solid rgba(255, 255, 255, 1.00); } #playlisterWrapperstacks_in_523 .playlisterButtonStandard i, #playlisterWrapperstacks_in_523 .playlisterButton i { color: rgba(230, 230, 230, 1.00); transition: all 300ms ease-in-out; line-height: 50px !important; } #playlisterWrapperstacks_in_523 .playlisterButtonStandard:hover, #playlisterWrapperstacks_in_523 .playlisterButtonStandard:active, #playlisterWrapperstacks_in_523 .playlisterButtonStandard:focus, #playlisterWrapperstacks_in_523 .playlisterButton:hover, #playlisterWrapperstacks_in_523 .playlisterButton:active, #playlisterWrapperstacks_in_523 .playlisterButton:focus { color: rgba(0, 0, 255, 1.00); background: rgba(102, 204, 255, 0.50); border: 1px solid rgba(255, 255, 255, 1.00); } #playlisterWrapperstacks_in_523 .playlisterButtonStandard:hover i, #playlisterWrapperstacks_in_523 .playlisterButtonStandard:active i, #playlisterWrapperstacks_in_523 .playlisterButtonStandard:focus i, #playlisterWrapperstacks_in_523 .playlisterButton:hover i, #playlisterWrapperstacks_in_523 .playlisterButton:active i, #playlisterWrapperstacks_in_523 .playlisterButton:focus i { color: rgba(0, 0, 255, 1.00); } #playlisterWrapperstacks_in_523 #playstacks_in_523 i { margin-right: -3px; } #playlisterWrapperstacks_in_523 #pausestacks_in_523 { display: none; } #playlisterWrapperstacks_in_523 .playlisterIsPlaying #playstacks_in_523 { display: none; } #playlisterWrapperstacks_in_523 .playlisterIsPlaying #pausestacks_in_523 { display: inline-block; } /* Glass effect */ #playlisterWrapperstacks_in_523 .playlisterButton:after, #playlisterWrapperstacks_in_523 .playlisterButtonStandard:after { content: ''; position: absolute; top: 0px; left: 0px; width: 100%; height: 50%; background: linear-gradient(rgba(255, 255, 255, 0.05), rgba(255, 255, 255, 0.05)); } #userOptionsBarstacks_in_523 { float: right; } #playlisterWrapperstacks_in_523 .playlisterInterfaceComponent, #playlisterWrapperstacks_in_523 .playlisterInterfaceComponentStandard { margin-bottom: 15px; margin-left: 15px; } @media screen and (min-width: 600px) { #playlisterWrapperstacks_in_523 .playlisterInterfaceComponent, #playlisterWrapperstacks_in_523 .playlisterInterfaceComponentStandard { float: left; } } #volumeControlsstacks_in_523, #volumeBtnstacks_in_523 { display: none; } @media screen and (min-width: 600px) { #volumeBtnstacks_in_523 { display: inline-block; } #volumeControlsstacks_in_523 { height: 140px; width: 70px; display: none; position: absolute; left: 50%; bottom: 100%; margin-left: -35px; overflow: visible; z-index: 90; background: rgba(25, 25, 25, 1.00); border-radius: 10px; } #volume-fullstacks_in_523 { position: absolute; left: 14px; top: 10px; width: 100%; display: block; font-size: 20px; text-align: left; } #volume-mutestacks_in_523 { position: absolute; left: 18px; top: 110px; width: 100%; display: block; text-align: left; font-size: 20px; } #volume-mutestacks_in_523 i, #volume-fullstacks_in_523 i { color: rgba(205, 205, 205, 1.00); line-height: 1; padding: 0; margin: 0; } #volumeSliderstacks_in_523 { position: absolute; top: 10px; right: 15px; display: block; height: 100%; } #volumestacks_in_523 { height: 120px; width: 10px; background: rgba(102, 102, 102, 1.00); position: relative; border-radius: 5px; } #volumestacks_in_523 .ui-slider-range { background: rgba(75, 179, 135, 1.00); border-radius: 5px; outline: none; display: block; width: 100%; position: absolute; bottom: 0; left: 0; } #volumestacks_in_523 .ui-slider-handle { cursor: pointer; position: absolute; left: 0; bottom: 0px; margin-left: -5px; margin-bottom: -10px; width: 20px; height: 20px; z-index: 2; border-radius: 10px; background: rgba(205, 205, 205, 1.00); outline: none; } } #progressBarstacks_in_523 { margin-bottom: 5px; height: auto; overflow: auto; } #trackerstacks_in_523 { display: block; position: relative; height: 10px; background: rgba(102, 102, 102, 1.00); margin-top: 5px; border-radius: 5px; overflow: hidden; } #trackerstacks_in_523 #progressstacks_in_523 { background-color: rgba(75, 179, 135, 1.00); height: 100%; display: block; width: 0px; background-image: -webkit-linear-gradient(45deg,rgba(255,255,255,.15) 25%,transparent 25%,transparent 50%,rgba(255,255,255,.15) 50%,rgba(255,255,255,.15) 75%,transparent 75%,transparent); background-image: -o-linear-gradient(45deg,rgba(255,255,255,.15) 25%,transparent 25%,transparent 50%,rgba(255,255,255,.15) 50%,rgba(255,255,255,.15) 75%,transparent 75%,transparent); background-image: linear-gradient(45deg,rgba(255,255,255,.15) 25%,transparent 25%,transparent 50%,rgba(255,255,255,.15) 50%,rgba(255,255,255,.15) 75%,transparent 75%,transparent); -webkit-background-size: 20px 20px; background-size: 20px 20px; -webkit-animation: playlister-progress-bar-stripes 2s linear infinite; -o-animation: playlister-progress-bar-stripes 2s linear infinite; animation: playlister-progress-bar-stripes 2s linear infinite; } @-webkit-keyframes playlister-progress-bar-stripes { from { background-position: 20px 0; } to { background-position: 0 0; } } @keyframes playlister-progress-bar-stripes { from { background-position: 20px 0; } to { background-position: 0 0; } } #currentstacks_in_523 { float: left; font-size: 14px; margin-top: 4px; color: rgba(205, 205, 205, 1.00); } #durationstacks_in_523 { float: right; font-size: 14px; margin-top: 4px; color: rgba(205, 205, 205, 1.00); } /* iOS can't preload audio and fetch the total duration until the track starts to play. So we make duration invisisble and make it visible on desktops or (via jQuery) when the track is clicked and playing */ #durationstacks_in_523 { visibility: hidden; } #durationstacks_in_523.showDuration { visibility: visible; } #playlisterPlayliststacks_in_523 { background-color: rgba(255, 255, 255, 1.00); list-style-type: none; margin: 0; padding: 0px; position: relative; z-index: 1; /* Start either displayed or hidden */ display: block; overflow: hidden; border-top-left-radius: 0px; border-top-right-radius: 0px; border-bottom-right-radius: 5px; border-bottom-left-radius: 5px; -webkit-column-count: 1; -moz-column-count: 1; column-count: 1; -webkit-column-gap: 0px; -moz-column-gap: 0px; column-gap: 0px; -webkit-column-rule: 0px solid #CDCDCD; -moz-column-rule: 0px solid #CDCDCD; column-rule: 0px solid #CDCDCD; /* Hide top-most item borders */ margin-top: -0px } @media screen and (min-width: 34em) { #playlisterPlayliststacks_in_523 { -webkit-column-count: 2; -moz-column-count: 2; column-count: 2; } } @media screen and (min-width: 48em) { #playlisterPlayliststacks_in_523 { -webkit-column-count: 3; -moz-column-count: 3; column-count: 3; } } @media screen and (min-width: 62em) { #playlisterPlayliststacks_in_523 { -webkit-column-count: 3; -moz-column-count: 3; column-count: 3; } } @media screen and (min-width: 75em) { #playlisterPlayliststacks_in_523 { -webkit-column-count: 3; -moz-column-count: 3; column-count: 3; } } #playlisterPlayliststacks_in_523 li { display: block; width: 100%; margin: 0; padding: 0; background: rgba(255, 255, 255, 1.00); color: rgba(153, 153, 153, 1.00); font-size: 18px; height: 45px; line-height: 45px; cursor: pointer; transition: color 300ms ease-in-out, background 300ms ease-in-out; overflow: hidden; position: relative; -webkit-column-break-inside: avoid; break-inside: avoid; transform: translateZ(0); border-top: 0px solid #CDCDCD; } #playlisterPlayliststacks_in_523 li:hover { background: rgba(234, 234, 234, 1.00); } #playlisterPlayliststacks_in_523 li.active-playlistitem, #playlisterPlayliststacks_in_523 li.active-playlistitem:hover { font-weight: normal; color: rgba(0, 0, 0, 1.00); background: rgba(102, 204, 255, 0.18); } #playlisterPlayliststacks_in_523 li { padding-left: 0; } #playlisterPlayliststacks_in_523 li .playlistItemNumber { display: inline-block; width: 35px; text-align: right; margin: 0 10px 0 0; padding: 0; } #playlisterPlayliststacks_in_523 li .playListerAdditionalInfo { display: none; } #playlisterPlayliststacks_in_523 li .playlistItemActiveIcon { display: none; } .no-audio #playlisterstacks_in_523, .no-audio #playlisterPlayliststacks_in_523 { display: none; } #playlisterNoAudiostacks_in_523 { display: none; } .no-audio #playlisterNoAudiostacks_in_523 { padding: 15px; display: none; } .no-adownload #downloadstacks_in_523 { display: none; } #playlisterWrapperstacks_in_523 #titlestacks_in_523 { display: none; } #playlisterWrapperstacks_in_523 #albumstacks_in_523 { display: none; } #playlisterWrapperstacks_in_523 #artiststacks_in_523 { display: none; } #playlisterWrapperstacks_in_523 #additionalInfostacks_in_523 { display: none; } #playlisterWrapperstacks_in_523 #downloadstacks_in_523 { display: none !important; } #playlisterWrapperstacks_in_523 #progressBarstacks_in_523 { display: none; } #playlisterWrapperstacks_in_523 #repeatstacks_in_523 { display: none; } #playlisterWrapperstacks_in_523 #volumeBtnstacks_in_523 { display: none; } #playlisterWrapperstacks_in_523 #shufflestacks_in_523 { display: none; } #playlisterWrapperstacks_in_523 #playlistTogglestacks_in_523 { display: none; } #playlisterPlaceholderstacks_in_523 { display: none; padding: 15px; margin: 15px; background: #ffffff; color: #000000; font-family: "Courier New", Courier, mono; } #playlisterPlaceholderstacks_in_523 audio { width: 100%; } #stacks_in_523 { background-color: rgba(255, 255, 255, 1.00); -moz-border-radius: 10px; -webkit-border-radius: 10px; border-radius: 10px; } #stacks_in_625 { padding: 20px; } #stacks_in_660 { background-color: rgba(102, 204, 255, 0.10); -moz-border-radius: 10px; -webkit-border-radius: 10px; border-radius: 10px; } #stacks_in_661 { font-size: 200%; } #stacks_in_334 { padding: 20px; } #stacks_in_534 *, #stacks_in_534 *:before, #stacks_in_534 *:after { box-sizing: border-box; } #stacks_in_534 { max-width: 800px; margin: 0 auto; } #playlisterWrapperstacks_in_534 { -webkit-box-shadow: 0px 0px 5px 2px rgba(205, 205, 205, 1.00); box-shadow: 0px 0px 5px 2px rgba(205, 205, 205, 1.00); margin: 5px; border-top-left-radius: 5px; border-top-right-radius: 5px; border-bottom-right-radius: 5px; border-bottom-left-radius: 5px; } #playlisterPlaceholderstacks_in_534 { display: none !important; } #playlisterstacks_in_534 { border-radius: 0px; height: auto; position: relative; width: auto; z-index: 2; display: block; overflow: auto; padding: 15px; border-top-left-radius: 5px; border-top-right-radius: 5px; border-bottom-right-radius: 0px; border-bottom-left-radius: 0px; } /* Solid colour fill */ #playlisterstacks_in_534 { background: rgba(255, 255, 255, 1.00); } #playlisterstacks_in_534 .btn { text-decoration: none; margin-top: 5px; } #coverControlsWrapperstacks_in_534 { position: relative; height: auto; overflow: auto; margin-bottom: 5px; display: flex; flex-direction: column; width: 100%; text-align: left; } @media screen and (min-width: 600px) { #coverControlsWrapperstacks_in_534 { flex-direction: row; } } #coverControlsWrapperstacks_in_534 { min-height: 70px; } #coverstacks_in_534 { background-repeat: no-repeat; background-size: contain; background-position: center; border-top-left-radius: 5px; border-top-right-radius: 5px; border-bottom-right-radius: 5px; border-bottom-left-radius: 5px; position: relative; height: 70px; width: 70px; display: block; margin: 0 auto; } @media screen and (min-width: 600px) { #coverstacks_in_534 { justify-content: space-around; } } #playerInterfacestacks_in_534 { display: block; overflow: hidden; text-align: center; } @media screen and (min-width: 600px) { #playerInterfacestacks_in_534 { flex: 1; padding-left: 15px; display: flex; flex-direction: column; justify-content: space-around; text-align: left; } } #playlisterTopSectionstacks_in_534 { height: auto; overflow: auto; margin-top: 15px; } @media screen and (min-width: 600px) { #playlisterTopSectionstacks_in_534 { margin-top: 0px; } } #titlestacks_in_534 { color: rgba(255, 255, 255, 1.00); font-size: 24px; font-weight: bold; line-height: 1.50em; } #titlestacks_in_534:before { content: ' '; } #albumstacks_in_534 { color: rgba(205, 205, 205, 1.00); font-size: 16px; line-height: 1.50em; } #albumstacks_in_534:before { content: 'Album: '; } #artiststacks_in_534 { color: rgba(205, 205, 205, 1.00); font-size: 16px; line-height: 1.50em; } #artiststacks_in_534:before { content: 'Artist: '; } #additionalInfostacks_in_534 { color: rgba(205, 205, 205, 1.00); font-size: 16px; line-height: 1.50em; } #additionalInfostacks_in_534:before { content: ' '; } #controlsstacks_in_534 { position: relative; margin: 0px; padding: 0; color: #cdcdcd; overflow: visible; } @media screen and (min-width: 600px) { #controlsstacks_in_534 { padding-top: 10px; } } #buttonWrapperstacks_in_534 { display: table; position: relative; vertical-align: middle; text-align: center; width: 100%; } #playlisterWrapperstacks_in_534 .buttonItem { display: table-cell; text-align: center; position: relative; overflow: visible; } #playlisterWrapperstacks_in_534 .playlisterButtonStandard, #playlisterWrapperstacks_in_534 .playlisterButton { display: inline-block; width: 50px; height: 50px; text-align: center; line-height: 50px; text-align: center; font-size: 20px; background: rgba(102, 204, 255, 0.35); border-radius: 50%; transition: all 300ms ease-in-out; color: rgba(230, 230, 230, 1.00); cursor: pointer; position: relative; overflow: hidden; box-shadow: 0px 1px 4px -2px #333; text-shadow: 0px -1px #333; border: 1px solid rgba(255, 255, 255, 1.00); } #playlisterWrapperstacks_in_534 .playlisterButtonStandard i, #playlisterWrapperstacks_in_534 .playlisterButton i { color: rgba(230, 230, 230, 1.00); transition: all 300ms ease-in-out; line-height: 50px !important; } #playlisterWrapperstacks_in_534 .playlisterButtonStandard:hover, #playlisterWrapperstacks_in_534 .playlisterButtonStandard:active, #playlisterWrapperstacks_in_534 .playlisterButtonStandard:focus, #playlisterWrapperstacks_in_534 .playlisterButton:hover, #playlisterWrapperstacks_in_534 .playlisterButton:active, #playlisterWrapperstacks_in_534 .playlisterButton:focus { color: rgba(0, 0, 255, 1.00); background: rgba(102, 204, 255, 0.50); border: 1px solid rgba(255, 255, 255, 1.00); } #playlisterWrapperstacks_in_534 .playlisterButtonStandard:hover i, #playlisterWrapperstacks_in_534 .playlisterButtonStandard:active i, #playlisterWrapperstacks_in_534 .playlisterButtonStandard:focus i, #playlisterWrapperstacks_in_534 .playlisterButton:hover i, #playlisterWrapperstacks_in_534 .playlisterButton:active i, #playlisterWrapperstacks_in_534 .playlisterButton:focus i { color: rgba(0, 0, 255, 1.00); } #playlisterWrapperstacks_in_534 #playstacks_in_534 i { margin-right: -3px; } #playlisterWrapperstacks_in_534 #pausestacks_in_534 { display: none; } #playlisterWrapperstacks_in_534 .playlisterIsPlaying #playstacks_in_534 { display: none; } #playlisterWrapperstacks_in_534 .playlisterIsPlaying #pausestacks_in_534 { display: inline-block; } /* Glass effect */ #playlisterWrapperstacks_in_534 .playlisterButton:after, #playlisterWrapperstacks_in_534 .playlisterButtonStandard:after { content: ''; position: absolute; top: 0px; left: 0px; width: 100%; height: 50%; background: linear-gradient(rgba(255, 255, 255, 0.05), rgba(255, 255, 255, 0.05)); } #userOptionsBarstacks_in_534 { float: right; } #playlisterWrapperstacks_in_534 .playlisterInterfaceComponent, #playlisterWrapperstacks_in_534 .playlisterInterfaceComponentStandard { margin-bottom: 15px; margin-left: 15px; } @media screen and (min-width: 600px) { #playlisterWrapperstacks_in_534 .playlisterInterfaceComponent, #playlisterWrapperstacks_in_534 .playlisterInterfaceComponentStandard { float: left; } } #volumeControlsstacks_in_534, #volumeBtnstacks_in_534 { display: none; } @media screen and (min-width: 600px) { #volumeBtnstacks_in_534 { display: inline-block; } #volumeControlsstacks_in_534 { height: 140px; width: 70px; display: none; position: absolute; left: 50%; bottom: 100%; margin-left: -35px; overflow: visible; z-index: 90; background: rgba(25, 25, 25, 1.00); border-radius: 10px; } #volume-fullstacks_in_534 { position: absolute; left: 14px; top: 10px; width: 100%; display: block; font-size: 20px; text-align: left; } #volume-mutestacks_in_534 { position: absolute; left: 18px; top: 110px; width: 100%; display: block; text-align: left; font-size: 20px; } #volume-mutestacks_in_534 i, #volume-fullstacks_in_534 i { color: rgba(205, 205, 205, 1.00); line-height: 1; padding: 0; margin: 0; } #volumeSliderstacks_in_534 { position: absolute; top: 10px; right: 15px; display: block; height: 100%; } #volumestacks_in_534 { height: 120px; width: 10px; background: rgba(102, 102, 102, 1.00); position: relative; border-radius: 5px; } #volumestacks_in_534 .ui-slider-range { background: rgba(75, 179, 135, 1.00); border-radius: 5px; outline: none; display: block; width: 100%; position: absolute; bottom: 0; left: 0; } #volumestacks_in_534 .ui-slider-handle { cursor: pointer; position: absolute; left: 0; bottom: 0px; margin-left: -5px; margin-bottom: -10px; width: 20px; height: 20px; z-index: 2; border-radius: 10px; background: rgba(205, 205, 205, 1.00); outline: none; } } #progressBarstacks_in_534 { margin-bottom: 5px; height: auto; overflow: auto; } #trackerstacks_in_534 { display: block; position: relative; height: 10px; background: rgba(102, 102, 102, 1.00); margin-top: 5px; border-radius: 5px; overflow: hidden; } #trackerstacks_in_534 #progressstacks_in_534 { background-color: rgba(75, 179, 135, 1.00); height: 100%; display: block; width: 0px; background-image: -webkit-linear-gradient(45deg,rgba(255,255,255,.15) 25%,transparent 25%,transparent 50%,rgba(255,255,255,.15) 50%,rgba(255,255,255,.15) 75%,transparent 75%,transparent); background-image: -o-linear-gradient(45deg,rgba(255,255,255,.15) 25%,transparent 25%,transparent 50%,rgba(255,255,255,.15) 50%,rgba(255,255,255,.15) 75%,transparent 75%,transparent); background-image: linear-gradient(45deg,rgba(255,255,255,.15) 25%,transparent 25%,transparent 50%,rgba(255,255,255,.15) 50%,rgba(255,255,255,.15) 75%,transparent 75%,transparent); -webkit-background-size: 20px 20px; background-size: 20px 20px; -webkit-animation: playlister-progress-bar-stripes 2s linear infinite; -o-animation: playlister-progress-bar-stripes 2s linear infinite; animation: playlister-progress-bar-stripes 2s linear infinite; } @-webkit-keyframes playlister-progress-bar-stripes { from { background-position: 20px 0; } to { background-position: 0 0; } } @keyframes playlister-progress-bar-stripes { from { background-position: 20px 0; } to { background-position: 0 0; } } #currentstacks_in_534 { float: left; font-size: 14px; margin-top: 4px; color: rgba(205, 205, 205, 1.00); } #durationstacks_in_534 { float: right; font-size: 14px; margin-top: 4px; color: rgba(205, 205, 205, 1.00); } /* iOS can't preload audio and fetch the total duration until the track starts to play. So we make duration invisisble and make it visible on desktops or (via jQuery) when the track is clicked and playing */ #durationstacks_in_534 { visibility: hidden; } #durationstacks_in_534.showDuration { visibility: visible; } #playlisterPlayliststacks_in_534 { background-color: rgba(255, 255, 255, 1.00); list-style-type: none; margin: 0; padding: 0px; position: relative; z-index: 1; /* Start either displayed or hidden */ display: block; overflow: hidden; border-top-left-radius: 0px; border-top-right-radius: 0px; border-bottom-right-radius: 5px; border-bottom-left-radius: 5px; -webkit-column-count: 1; -moz-column-count: 1; column-count: 1; -webkit-column-gap: 0px; -moz-column-gap: 0px; column-gap: 0px; -webkit-column-rule: 0px solid #CDCDCD; -moz-column-rule: 0px solid #CDCDCD; column-rule: 0px solid #CDCDCD; /* Hide top-most item borders */ margin-top: -0px } @media screen and (min-width: 34em) { #playlisterPlayliststacks_in_534 { -webkit-column-count: 2; -moz-column-count: 2; column-count: 2; } } @media screen and (min-width: 48em) { #playlisterPlayliststacks_in_534 { -webkit-column-count: 3; -moz-column-count: 3; column-count: 3; } } @media screen and (min-width: 62em) { #playlisterPlayliststacks_in_534 { -webkit-column-count: 3; -moz-column-count: 3; column-count: 3; } } @media screen and (min-width: 75em) { #playlisterPlayliststacks_in_534 { -webkit-column-count: 3; -moz-column-count: 3; column-count: 3; } } #playlisterPlayliststacks_in_534 li { display: block; width: 100%; margin: 0; padding: 0; background: rgba(255, 255, 255, 1.00); color: rgba(153, 153, 153, 1.00); font-size: 18px; height: 45px; line-height: 45px; cursor: pointer; transition: color 300ms ease-in-out, background 300ms ease-in-out; overflow: hidden; position: relative; -webkit-column-break-inside: avoid; break-inside: avoid; transform: translateZ(0); border-top: 0px solid #CDCDCD; } #playlisterPlayliststacks_in_534 li:hover { background: rgba(234, 234, 234, 1.00); } #playlisterPlayliststacks_in_534 li.active-playlistitem, #playlisterPlayliststacks_in_534 li.active-playlistitem:hover { font-weight: normal; color: rgba(0, 0, 0, 1.00); background: rgba(102, 204, 255, 0.18); } #playlisterPlayliststacks_in_534 li { padding-left: 0; } #playlisterPlayliststacks_in_534 li .playlistItemNumber { display: inline-block; width: 35px; text-align: right; margin: 0 10px 0 0; padding: 0; } #playlisterPlayliststacks_in_534 li .playListerAdditionalInfo { display: none; } #playlisterPlayliststacks_in_534 li .playlistItemActiveIcon { display: none; } .no-audio #playlisterstacks_in_534, .no-audio #playlisterPlayliststacks_in_534 { display: none; } #playlisterNoAudiostacks_in_534 { display: none; } .no-audio #playlisterNoAudiostacks_in_534 { padding: 15px; display: none; } .no-adownload #downloadstacks_in_534 { display: none; } #playlisterWrapperstacks_in_534 #titlestacks_in_534 { display: none; } #playlisterWrapperstacks_in_534 #albumstacks_in_534 { display: none; } #playlisterWrapperstacks_in_534 #artiststacks_in_534 { display: none; } #playlisterWrapperstacks_in_534 #additionalInfostacks_in_534 { display: none; } #playlisterWrapperstacks_in_534 #downloadstacks_in_534 { display: none !important; } #playlisterWrapperstacks_in_534 #progressBarstacks_in_534 { display: none; } #playlisterWrapperstacks_in_534 #repeatstacks_in_534 { display: none; } #playlisterWrapperstacks_in_534 #volumeBtnstacks_in_534 { display: none; } #playlisterWrapperstacks_in_534 #shufflestacks_in_534 { display: none; } #playlisterWrapperstacks_in_534 #playlistTogglestacks_in_534 { display: none; } #playlisterPlaceholderstacks_in_534 { display: none; padding: 15px; margin: 15px; background: #ffffff; color: #000000; font-family: "Courier New", Courier, mono; } #playlisterPlaceholderstacks_in_534 audio { width: 100%; } #stacks_in_534 { background-color: rgba(255, 255, 255, 1.00); -moz-border-radius: 10px; -webkit-border-radius: 10px; border-radius: 10px; } #stacks_in_643 { padding: 20px; } #stacks_in_662 { background-color: rgba(102, 204, 255, 0.10); -moz-border-radius: 10px; -webkit-border-radius: 10px; border-radius: 10px; } #stacks_in_663 { font-size: 200%; } #stacks_in_627 { padding: 20px; } #stacks_in_645 { padding: 20px; } #stacks_in_647 *, #stacks_in_647 *:before, #stacks_in_647 *:after { box-sizing: border-box; } #stacks_in_647 { max-width: 800px; margin: 0 auto; } #playlisterWrapperstacks_in_647 { -webkit-box-shadow: 0px 0px 5px 2px rgba(205, 205, 205, 1.00); box-shadow: 0px 0px 5px 2px rgba(205, 205, 205, 1.00); margin: 5px; border-top-left-radius: 5px; border-top-right-radius: 5px; border-bottom-right-radius: 5px; border-bottom-left-radius: 5px; } #playlisterPlaceholderstacks_in_647 { display: none !important; } #playlisterstacks_in_647 { border-radius: 0px; height: auto; position: relative; width: auto; z-index: 2; display: block; overflow: auto; padding: 15px; border-top-left-radius: 5px; border-top-right-radius: 5px; border-bottom-right-radius: 0px; border-bottom-left-radius: 0px; } /* Solid colour fill */ #playlisterstacks_in_647 { background: rgba(255, 255, 255, 1.00); } #playlisterstacks_in_647 .btn { text-decoration: none; margin-top: 5px; } #coverControlsWrapperstacks_in_647 { position: relative; height: auto; overflow: auto; margin-bottom: 5px; display: flex; flex-direction: column; width: 100%; text-align: left; } @media screen and (min-width: 600px) { #coverControlsWrapperstacks_in_647 { flex-direction: row; } } #coverControlsWrapperstacks_in_647 { min-height: 70px; } #coverstacks_in_647 { background-repeat: no-repeat; background-size: contain; background-position: center; border-top-left-radius: 5px; border-top-right-radius: 5px; border-bottom-right-radius: 5px; border-bottom-left-radius: 5px; position: relative; height: 70px; width: 70px; display: block; margin: 0 auto; } @media screen and (min-width: 600px) { #coverstacks_in_647 { justify-content: space-around; } } #playerInterfacestacks_in_647 { display: block; overflow: hidden; text-align: center; } @media screen and (min-width: 600px) { #playerInterfacestacks_in_647 { flex: 1; padding-left: 15px; display: flex; flex-direction: column; justify-content: space-around; text-align: left; } } #playlisterTopSectionstacks_in_647 { height: auto; overflow: auto; margin-top: 15px; } @media screen and (min-width: 600px) { #playlisterTopSectionstacks_in_647 { margin-top: 0px; } } #titlestacks_in_647 { color: rgba(255, 255, 255, 1.00); font-size: 24px; font-weight: bold; line-height: 1.50em; } #titlestacks_in_647:before { content: ' '; } #albumstacks_in_647 { color: rgba(205, 205, 205, 1.00); font-size: 16px; line-height: 1.50em; } #albumstacks_in_647:before { content: 'Album: '; } #artiststacks_in_647 { color: rgba(205, 205, 205, 1.00); font-size: 16px; line-height: 1.50em; } #artiststacks_in_647:before { content: 'Artist: '; } #additionalInfostacks_in_647 { color: rgba(205, 205, 205, 1.00); font-size: 16px; line-height: 1.50em; } #additionalInfostacks_in_647:before { content: ' '; } #controlsstacks_in_647 { position: relative; margin: 0px; padding: 0; color: #cdcdcd; overflow: visible; } @media screen and (min-width: 600px) { #controlsstacks_in_647 { padding-top: 10px; } } #buttonWrapperstacks_in_647 { display: table; position: relative; vertical-align: middle; text-align: center; width: 100%; } #playlisterWrapperstacks_in_647 .buttonItem { display: table-cell; text-align: center; position: relative; overflow: visible; } #playlisterWrapperstacks_in_647 .playlisterButtonStandard, #playlisterWrapperstacks_in_647 .playlisterButton { display: inline-block; width: 50px; height: 50px; text-align: center; line-height: 50px; text-align: center; font-size: 20px; background: rgba(102, 204, 255, 0.35); border-radius: 50%; transition: all 300ms ease-in-out; color: rgba(230, 230, 230, 1.00); cursor: pointer; position: relative; overflow: hidden; box-shadow: 0px 1px 4px -2px #333; text-shadow: 0px -1px #333; border: 1px solid rgba(255, 255, 255, 1.00); } #playlisterWrapperstacks_in_647 .playlisterButtonStandard i, #playlisterWrapperstacks_in_647 .playlisterButton i { color: rgba(230, 230, 230, 1.00); transition: all 300ms ease-in-out; line-height: 50px !important; } #playlisterWrapperstacks_in_647 .playlisterButtonStandard:hover, #playlisterWrapperstacks_in_647 .playlisterButtonStandard:active, #playlisterWrapperstacks_in_647 .playlisterButtonStandard:focus, #playlisterWrapperstacks_in_647 .playlisterButton:hover, #playlisterWrapperstacks_in_647 .playlisterButton:active, #playlisterWrapperstacks_in_647 .playlisterButton:focus { color: rgba(0, 0, 255, 1.00); background: rgba(102, 204, 255, 0.50); border: 1px solid rgba(255, 255, 255, 1.00); } #playlisterWrapperstacks_in_647 .playlisterButtonStandard:hover i, #playlisterWrapperstacks_in_647 .playlisterButtonStandard:active i, #playlisterWrapperstacks_in_647 .playlisterButtonStandard:focus i, #playlisterWrapperstacks_in_647 .playlisterButton:hover i, #playlisterWrapperstacks_in_647 .playlisterButton:active i, #playlisterWrapperstacks_in_647 .playlisterButton:focus i { color: rgba(0, 0, 255, 1.00); } #playlisterWrapperstacks_in_647 #playstacks_in_647 i { margin-right: -3px; } #playlisterWrapperstacks_in_647 #pausestacks_in_647 { display: none; } #playlisterWrapperstacks_in_647 .playlisterIsPlaying #playstacks_in_647 { display: none; } #playlisterWrapperstacks_in_647 .playlisterIsPlaying #pausestacks_in_647 { display: inline-block; } /* Glass effect */ #playlisterWrapperstacks_in_647 .playlisterButton:after, #playlisterWrapperstacks_in_647 .playlisterButtonStandard:after { content: ''; position: absolute; top: 0px; left: 0px; width: 100%; height: 50%; background: linear-gradient(rgba(255, 255, 255, 0.05), rgba(255, 255, 255, 0.05)); } #userOptionsBarstacks_in_647 { float: right; } #playlisterWrapperstacks_in_647 .playlisterInterfaceComponent, #playlisterWrapperstacks_in_647 .playlisterInterfaceComponentStandard { margin-bottom: 15px; margin-left: 15px; } @media screen and (min-width: 600px) { #playlisterWrapperstacks_in_647 .playlisterInterfaceComponent, #playlisterWrapperstacks_in_647 .playlisterInterfaceComponentStandard { float: left; } } #volumeControlsstacks_in_647, #volumeBtnstacks_in_647 { display: none; } @media screen and (min-width: 600px) { #volumeBtnstacks_in_647 { display: inline-block; } #volumeControlsstacks_in_647 { height: 140px; width: 70px; display: none; position: absolute; left: 50%; bottom: 100%; margin-left: -35px; overflow: visible; z-index: 90; background: rgba(25, 25, 25, 1.00); border-radius: 10px; } #volume-fullstacks_in_647 { position: absolute; left: 14px; top: 10px; width: 100%; display: block; font-size: 20px; text-align: left; } #volume-mutestacks_in_647 { position: absolute; left: 18px; top: 110px; width: 100%; display: block; text-align: left; font-size: 20px; } #volume-mutestacks_in_647 i, #volume-fullstacks_in_647 i { color: rgba(205, 205, 205, 1.00); line-height: 1; padding: 0; margin: 0; } #volumeSliderstacks_in_647 { position: absolute; top: 10px; right: 15px; display: block; height: 100%; } #volumestacks_in_647 { height: 120px; width: 10px; background: rgba(102, 102, 102, 1.00); position: relative; border-radius: 5px; } #volumestacks_in_647 .ui-slider-range { background: rgba(75, 179, 135, 1.00); border-radius: 5px; outline: none; display: block; width: 100%; position: absolute; bottom: 0; left: 0; } #volumestacks_in_647 .ui-slider-handle { cursor: pointer; position: absolute; left: 0; bottom: 0px; margin-left: -5px; margin-bottom: -10px; width: 20px; height: 20px; z-index: 2; border-radius: 10px; background: rgba(205, 205, 205, 1.00); outline: none; } } #progressBarstacks_in_647 { margin-bottom: 5px; height: auto; overflow: auto; } #trackerstacks_in_647 { display: block; position: relative; height: 10px; background: rgba(102, 102, 102, 1.00); margin-top: 5px; border-radius: 5px; overflow: hidden; } #trackerstacks_in_647 #progressstacks_in_647 { background-color: rgba(75, 179, 135, 1.00); height: 100%; display: block; width: 0px; background-image: -webkit-linear-gradient(45deg,rgba(255,255,255,.15) 25%,transparent 25%,transparent 50%,rgba(255,255,255,.15) 50%,rgba(255,255,255,.15) 75%,transparent 75%,transparent); background-image: -o-linear-gradient(45deg,rgba(255,255,255,.15) 25%,transparent 25%,transparent 50%,rgba(255,255,255,.15) 50%,rgba(255,255,255,.15) 75%,transparent 75%,transparent); background-image: linear-gradient(45deg,rgba(255,255,255,.15) 25%,transparent 25%,transparent 50%,rgba(255,255,255,.15) 50%,rgba(255,255,255,.15) 75%,transparent 75%,transparent); -webkit-background-size: 20px 20px; background-size: 20px 20px; -webkit-animation: playlister-progress-bar-stripes 2s linear infinite; -o-animation: playlister-progress-bar-stripes 2s linear infinite; animation: playlister-progress-bar-stripes 2s linear infinite; } @-webkit-keyframes playlister-progress-bar-stripes { from { background-position: 20px 0; } to { background-position: 0 0; } } @keyframes playlister-progress-bar-stripes { from { background-position: 20px 0; } to { background-position: 0 0; } } #currentstacks_in_647 { float: left; font-size: 14px; margin-top: 4px; color: rgba(205, 205, 205, 1.00); } #durationstacks_in_647 { float: right; font-size: 14px; margin-top: 4px; color: rgba(205, 205, 205, 1.00); } /* iOS can't preload audio and fetch the total duration until the track starts to play. So we make duration invisisble and make it visible on desktops or (via jQuery) when the track is clicked and playing */ #durationstacks_in_647 { visibility: hidden; } #durationstacks_in_647.showDuration { visibility: visible; } #playlisterPlayliststacks_in_647 { background-color: rgba(255, 255, 255, 1.00); list-style-type: none; margin: 0; padding: 0px; position: relative; z-index: 1; /* Start either displayed or hidden */ display: block; overflow: hidden; border-top-left-radius: 0px; border-top-right-radius: 0px; border-bottom-right-radius: 5px; border-bottom-left-radius: 5px; -webkit-column-count: 1; -moz-column-count: 1; column-count: 1; -webkit-column-gap: 0px; -moz-column-gap: 0px; column-gap: 0px; -webkit-column-rule: 0px solid #CDCDCD; -moz-column-rule: 0px solid #CDCDCD; column-rule: 0px solid #CDCDCD; /* Hide top-most item borders */ margin-top: -0px } @media screen and (min-width: 34em) { #playlisterPlayliststacks_in_647 { -webkit-column-count: 2; -moz-column-count: 2; column-count: 2; } } @media screen and (min-width: 48em) { #playlisterPlayliststacks_in_647 { -webkit-column-count: 3; -moz-column-count: 3; column-count: 3; } } @media screen and (min-width: 62em) { #playlisterPlayliststacks_in_647 { -webkit-column-count: 3; -moz-column-count: 3; column-count: 3; } } @media screen and (min-width: 75em) { #playlisterPlayliststacks_in_647 { -webkit-column-count: 3; -moz-column-count: 3; column-count: 3; } } #playlisterPlayliststacks_in_647 li { display: block; width: 100%; margin: 0; padding: 0; background: rgba(255, 255, 255, 1.00); color: rgba(153, 153, 153, 1.00); font-size: 18px; height: 45px; line-height: 45px; cursor: pointer; transition: color 300ms ease-in-out, background 300ms ease-in-out; overflow: hidden; position: relative; -webkit-column-break-inside: avoid; break-inside: avoid; transform: translateZ(0); border-top: 0px solid #CDCDCD; } #playlisterPlayliststacks_in_647 li:hover { background: rgba(234, 234, 234, 1.00); } #playlisterPlayliststacks_in_647 li.active-playlistitem, #playlisterPlayliststacks_in_647 li.active-playlistitem:hover { font-weight: normal; color: rgba(0, 0, 0, 1.00); background: rgba(102, 204, 255, 0.18); } #playlisterPlayliststacks_in_647 li { padding-left: 0; } #playlisterPlayliststacks_in_647 li .playlistItemNumber { display: inline-block; width: 35px; text-align: right; margin: 0 10px 0 0; padding: 0; } #playlisterPlayliststacks_in_647 li .playListerAdditionalInfo { display: none; } #playlisterPlayliststacks_in_647 li .playlistItemActiveIcon { display: none; } .no-audio #playlisterstacks_in_647, .no-audio #playlisterPlayliststacks_in_647 { display: none; } #playlisterNoAudiostacks_in_647 { display: none; } .no-audio #playlisterNoAudiostacks_in_647 { padding: 15px; display: none; } .no-adownload #downloadstacks_in_647 { display: none; } #playlisterWrapperstacks_in_647 #titlestacks_in_647 { display: none; } #playlisterWrapperstacks_in_647 #albumstacks_in_647 { display: none; } #playlisterWrapperstacks_in_647 #artiststacks_in_647 { display: none; } #playlisterWrapperstacks_in_647 #additionalInfostacks_in_647 { display: none; } #playlisterWrapperstacks_in_647 #downloadstacks_in_647 { display: none !important; } #playlisterWrapperstacks_in_647 #progressBarstacks_in_647 { display: none; } #playlisterWrapperstacks_in_647 #repeatstacks_in_647 { display: none; } #playlisterWrapperstacks_in_647 #volumeBtnstacks_in_647 { display: none; } #playlisterWrapperstacks_in_647 #shufflestacks_in_647 { display: none; } #playlisterWrapperstacks_in_647 #playlistTogglestacks_in_647 { display: none; } #playlisterPlaceholderstacks_in_647 { display: none; padding: 15px; margin: 15px; background: #ffffff; color: #000000; font-family: "Courier New", Courier, mono; } #playlisterPlaceholderstacks_in_647 audio { width: 100%; } #stacks_in_647 { background-color: rgba(255, 255, 255, 1.00); -moz-border-radius: 10px; -webkit-border-radius: 10px; border-radius: 10px; } #stacks_in_658 { padding: 20px; } #stacks_in_664 { background-color: rgba(102, 204, 255, 0.10); -moz-border-radius: 10px; -webkit-border-radius: 10px; border-radius: 10px; } #stacks_in_665 { font-size: 200%; } #stacks_in_556 { padding: 20px; } #stacks_in_545 *, #stacks_in_545 *:before, #stacks_in_545 *:after { box-sizing: border-box; } #stacks_in_545 { max-width: 800px; margin: 0 auto; } #playlisterWrapperstacks_in_545 { -webkit-box-shadow: 0px 0px 5px 2px rgba(205, 205, 205, 1.00); box-shadow: 0px 0px 5px 2px rgba(205, 205, 205, 1.00); margin: 5px; border-top-left-radius: 5px; border-top-right-radius: 5px; border-bottom-right-radius: 5px; border-bottom-left-radius: 5px; } #playlisterPlaceholderstacks_in_545 { display: none !important; } #playlisterstacks_in_545 { border-radius: 0px; height: auto; position: relative; width: auto; z-index: 2; display: block; overflow: auto; padding: 15px; border-top-left-radius: 5px; border-top-right-radius: 5px; border-bottom-right-radius: 0px; border-bottom-left-radius: 0px; } /* Solid colour fill */ #playlisterstacks_in_545 { background: rgba(255, 255, 255, 1.00); } #playlisterstacks_in_545 .btn { text-decoration: none; margin-top: 5px; } #coverControlsWrapperstacks_in_545 { position: relative; height: auto; overflow: auto; margin-bottom: 5px; display: flex; flex-direction: column; width: 100%; text-align: left; } @media screen and (min-width: 600px) { #coverControlsWrapperstacks_in_545 { flex-direction: row; } } #coverControlsWrapperstacks_in_545 { min-height: 70px; } #coverstacks_in_545 { background-repeat: no-repeat; background-size: contain; background-position: center; border-top-left-radius: 5px; border-top-right-radius: 5px; border-bottom-right-radius: 5px; border-bottom-left-radius: 5px; position: relative; height: 70px; width: 70px; display: block; margin: 0 auto; } @media screen and (min-width: 600px) { #coverstacks_in_545 { justify-content: space-around; } } #playerInterfacestacks_in_545 { display: block; overflow: hidden; text-align: center; } @media screen and (min-width: 600px) { #playerInterfacestacks_in_545 { flex: 1; padding-left: 15px; display: flex; flex-direction: column; justify-content: space-around; text-align: left; } } #playlisterTopSectionstacks_in_545 { height: auto; overflow: auto; margin-top: 15px; } @media screen and (min-width: 600px) { #playlisterTopSectionstacks_in_545 { margin-top: 0px; } } #titlestacks_in_545 { color: rgba(255, 255, 255, 1.00); font-size: 24px; font-weight: bold; line-height: 1.50em; } #titlestacks_in_545:before { content: ' '; } #albumstacks_in_545 { color: rgba(205, 205, 205, 1.00); font-size: 16px; line-height: 1.50em; } #albumstacks_in_545:before { content: 'Album: '; } #artiststacks_in_545 { color: rgba(205, 205, 205, 1.00); font-size: 16px; line-height: 1.50em; } #artiststacks_in_545:before { content: 'Artist: '; } #additionalInfostacks_in_545 { color: rgba(205, 205, 205, 1.00); font-size: 16px; line-height: 1.50em; } #additionalInfostacks_in_545:before { content: ' '; } #controlsstacks_in_545 { position: relative; margin: 0px; padding: 0; color: #cdcdcd; overflow: visible; } @media screen and (min-width: 600px) { #controlsstacks_in_545 { padding-top: 10px; } } #buttonWrapperstacks_in_545 { display: table; position: relative; vertical-align: middle; text-align: center; width: 100%; } #playlisterWrapperstacks_in_545 .buttonItem { display: table-cell; text-align: center; position: relative; overflow: visible; } #playlisterWrapperstacks_in_545 .playlisterButtonStandard, #playlisterWrapperstacks_in_545 .playlisterButton { display: inline-block; width: 50px; height: 50px; text-align: center; line-height: 50px; text-align: center; font-size: 20px; background: rgba(102, 204, 255, 0.35); border-radius: 50%; transition: all 300ms ease-in-out; color: rgba(230, 230, 230, 1.00); cursor: pointer; position: relative; overflow: hidden; box-shadow: 0px 1px 4px -2px #333; text-shadow: 0px -1px #333; border: 1px solid rgba(255, 255, 255, 1.00); } #playlisterWrapperstacks_in_545 .playlisterButtonStandard i, #playlisterWrapperstacks_in_545 .playlisterButton i { color: rgba(230, 230, 230, 1.00); transition: all 300ms ease-in-out; line-height: 50px !important; } #playlisterWrapperstacks_in_545 .playlisterButtonStandard:hover, #playlisterWrapperstacks_in_545 .playlisterButtonStandard:active, #playlisterWrapperstacks_in_545 .playlisterButtonStandard:focus, #playlisterWrapperstacks_in_545 .playlisterButton:hover, #playlisterWrapperstacks_in_545 .playlisterButton:active, #playlisterWrapperstacks_in_545 .playlisterButton:focus { color: rgba(0, 0, 255, 1.00); background: rgba(102, 204, 255, 0.50); border: 1px solid rgba(255, 255, 255, 1.00); } #playlisterWrapperstacks_in_545 .playlisterButtonStandard:hover i, #playlisterWrapperstacks_in_545 .playlisterButtonStandard:active i, #playlisterWrapperstacks_in_545 .playlisterButtonStandard:focus i, #playlisterWrapperstacks_in_545 .playlisterButton:hover i, #playlisterWrapperstacks_in_545 .playlisterButton:active i, #playlisterWrapperstacks_in_545 .playlisterButton:focus i { color: rgba(0, 0, 255, 1.00); } #playlisterWrapperstacks_in_545 #playstacks_in_545 i { margin-right: -3px; } #playlisterWrapperstacks_in_545 #pausestacks_in_545 { display: none; } #playlisterWrapperstacks_in_545 .playlisterIsPlaying #playstacks_in_545 { display: none; } #playlisterWrapperstacks_in_545 .playlisterIsPlaying #pausestacks_in_545 { display: inline-block; } /* Glass effect */ #playlisterWrapperstacks_in_545 .playlisterButton:after, #playlisterWrapperstacks_in_545 .playlisterButtonStandard:after { content: ''; position: absolute; top: 0px; left: 0px; width: 100%; height: 50%; background: linear-gradient(rgba(255, 255, 255, 0.05), rgba(255, 255, 255, 0.05)); } #userOptionsBarstacks_in_545 { float: right; } #playlisterWrapperstacks_in_545 .playlisterInterfaceComponent, #playlisterWrapperstacks_in_545 .playlisterInterfaceComponentStandard { margin-bottom: 15px; margin-left: 15px; } @media screen and (min-width: 600px) { #playlisterWrapperstacks_in_545 .playlisterInterfaceComponent, #playlisterWrapperstacks_in_545 .playlisterInterfaceComponentStandard { float: left; } } #volumeControlsstacks_in_545, #volumeBtnstacks_in_545 { display: none; } @media screen and (min-width: 600px) { #volumeBtnstacks_in_545 { display: inline-block; } #volumeControlsstacks_in_545 { height: 140px; width: 70px; display: none; position: absolute; left: 50%; bottom: 100%; margin-left: -35px; overflow: visible; z-index: 90; background: rgba(25, 25, 25, 1.00); border-radius: 10px; } #volume-fullstacks_in_545 { position: absolute; left: 14px; top: 10px; width: 100%; display: block; font-size: 20px; text-align: left; } #volume-mutestacks_in_545 { position: absolute; left: 18px; top: 110px; width: 100%; display: block; text-align: left; font-size: 20px; } #volume-mutestacks_in_545 i, #volume-fullstacks_in_545 i { color: rgba(205, 205, 205, 1.00); line-height: 1; padding: 0; margin: 0; } #volumeSliderstacks_in_545 { position: absolute; top: 10px; right: 15px; display: block; height: 100%; } #volumestacks_in_545 { height: 120px; width: 10px; background: rgba(102, 102, 102, 1.00); position: relative; border-radius: 5px; } #volumestacks_in_545 .ui-slider-range { background: rgba(75, 179, 135, 1.00); border-radius: 5px; outline: none; display: block; width: 100%; position: absolute; bottom: 0; left: 0; } #volumestacks_in_545 .ui-slider-handle { cursor: pointer; position: absolute; left: 0; bottom: 0px; margin-left: -5px; margin-bottom: -10px; width: 20px; height: 20px; z-index: 2; border-radius: 10px; background: rgba(205, 205, 205, 1.00); outline: none; } } #progressBarstacks_in_545 { margin-bottom: 5px; height: auto; overflow: auto; } #trackerstacks_in_545 { display: block; position: relative; height: 10px; background: rgba(102, 102, 102, 1.00); margin-top: 5px; border-radius: 5px; overflow: hidden; } #trackerstacks_in_545 #progressstacks_in_545 { background-color: rgba(75, 179, 135, 1.00); height: 100%; display: block; width: 0px; background-image: -webkit-linear-gradient(45deg,rgba(255,255,255,.15) 25%,transparent 25%,transparent 50%,rgba(255,255,255,.15) 50%,rgba(255,255,255,.15) 75%,transparent 75%,transparent); background-image: -o-linear-gradient(45deg,rgba(255,255,255,.15) 25%,transparent 25%,transparent 50%,rgba(255,255,255,.15) 50%,rgba(255,255,255,.15) 75%,transparent 75%,transparent); background-image: linear-gradient(45deg,rgba(255,255,255,.15) 25%,transparent 25%,transparent 50%,rgba(255,255,255,.15) 50%,rgba(255,255,255,.15) 75%,transparent 75%,transparent); -webkit-background-size: 20px 20px; background-size: 20px 20px; -webkit-animation: playlister-progress-bar-stripes 2s linear infinite; -o-animation: playlister-progress-bar-stripes 2s linear infinite; animation: playlister-progress-bar-stripes 2s linear infinite; } @-webkit-keyframes playlister-progress-bar-stripes { from { background-position: 20px 0; } to { background-position: 0 0; } } @keyframes playlister-progress-bar-stripes { from { background-position: 20px 0; } to { background-position: 0 0; } } #currentstacks_in_545 { float: left; font-size: 14px; margin-top: 4px; color: rgba(205, 205, 205, 1.00); } #durationstacks_in_545 { float: right; font-size: 14px; margin-top: 4px; color: rgba(205, 205, 205, 1.00); } /* iOS can't preload audio and fetch the total duration until the track starts to play. So we make duration invisisble and make it visible on desktops or (via jQuery) when the track is clicked and playing */ #durationstacks_in_545 { visibility: hidden; } #durationstacks_in_545.showDuration { visibility: visible; } #playlisterPlayliststacks_in_545 { background-color: rgba(255, 255, 255, 1.00); list-style-type: none; margin: 0; padding: 0px; position: relative; z-index: 1; /* Start either displayed or hidden */ display: block; overflow: hidden; border-top-left-radius: 0px; border-top-right-radius: 0px; border-bottom-right-radius: 5px; border-bottom-left-radius: 5px; -webkit-column-count: 1; -moz-column-count: 1; column-count: 1; -webkit-column-gap: 0px; -moz-column-gap: 0px; column-gap: 0px; -webkit-column-rule: 0px solid #CDCDCD; -moz-column-rule: 0px solid #CDCDCD; column-rule: 0px solid #CDCDCD; /* Hide top-most item borders */ margin-top: -0px } @media screen and (min-width: 34em) { #playlisterPlayliststacks_in_545 { -webkit-column-count: 2; -moz-column-count: 2; column-count: 2; } } @media screen and (min-width: 48em) { #playlisterPlayliststacks_in_545 { -webkit-column-count: 3; -moz-column-count: 3; column-count: 3; } } @media screen and (min-width: 62em) { #playlisterPlayliststacks_in_545 { -webkit-column-count: 3; -moz-column-count: 3; column-count: 3; } } @media screen and (min-width: 75em) { #playlisterPlayliststacks_in_545 { -webkit-column-count: 3; -moz-column-count: 3; column-count: 3; } } #playlisterPlayliststacks_in_545 li { display: block; width: 100%; margin: 0; padding: 0; background: rgba(255, 255, 255, 1.00); color: rgba(153, 153, 153, 1.00); font-size: 18px; height: 45px; line-height: 45px; cursor: pointer; transition: color 300ms ease-in-out, background 300ms ease-in-out; overflow: hidden; position: relative; -webkit-column-break-inside: avoid; break-inside: avoid; transform: translateZ(0); border-top: 0px solid #CDCDCD; } #playlisterPlayliststacks_in_545 li:hover { background: rgba(234, 234, 234, 1.00); } #playlisterPlayliststacks_in_545 li.active-playlistitem, #playlisterPlayliststacks_in_545 li.active-playlistitem:hover { font-weight: normal; color: rgba(0, 0, 0, 1.00); background: rgba(102, 204, 255, 0.18); } #playlisterPlayliststacks_in_545 li { padding-left: 0; } #playlisterPlayliststacks_in_545 li .playlistItemNumber { display: inline-block; width: 35px; text-align: right; margin: 0 10px 0 0; padding: 0; } #playlisterPlayliststacks_in_545 li .playListerAdditionalInfo { display: none; } #playlisterPlayliststacks_in_545 li .playlistItemActiveIcon { display: none; } .no-audio #playlisterstacks_in_545, .no-audio #playlisterPlayliststacks_in_545 { display: none; } #playlisterNoAudiostacks_in_545 { display: none; } .no-audio #playlisterNoAudiostacks_in_545 { padding: 15px; display: none; } .no-adownload #downloadstacks_in_545 { display: none; } #playlisterWrapperstacks_in_545 #titlestacks_in_545 { display: none; } #playlisterWrapperstacks_in_545 #albumstacks_in_545 { display: none; } #playlisterWrapperstacks_in_545 #artiststacks_in_545 { display: none; } #playlisterWrapperstacks_in_545 #additionalInfostacks_in_545 { display: none; } #playlisterWrapperstacks_in_545 #downloadstacks_in_545 { display: none !important; } #playlisterWrapperstacks_in_545 #progressBarstacks_in_545 { display: none; } #playlisterWrapperstacks_in_545 #repeatstacks_in_545 { display: none; } #playlisterWrapperstacks_in_545 #volumeBtnstacks_in_545 { display: none; } #playlisterWrapperstacks_in_545 #shufflestacks_in_545 { display: none; } #playlisterWrapperstacks_in_545 #playlistTogglestacks_in_545 { display: none; } #playlisterPlaceholderstacks_in_545 { display: none; padding: 15px; margin: 15px; background: #ffffff; color: #000000; font-family: "Courier New", Courier, mono; } #playlisterPlaceholderstacks_in_545 audio { width: 100%; } #stacks_in_545 { background-color: rgba(255, 255, 255, 1.00); -moz-border-radius: 10px; -webkit-border-radius: 10px; border-radius: 10px; } #stacks_in_629 { padding: 20px; } #stacks_in_666 { background-color: rgba(102, 204, 255, 0.10); -moz-border-radius: 10px; -webkit-border-radius: 10px; border-radius: 10px; } #stacks_in_667 { font-size: 200%; } #stacks_in_404 { padding: 20px; } #stacks_in_590 *, #stacks_in_590 *:before, #stacks_in_590 *:after { box-sizing: border-box; } #stacks_in_590 { max-width: 800px; margin: 0 auto; } #playlisterWrapperstacks_in_590 { -webkit-box-shadow: 0px 0px 5px 2px rgba(205, 205, 205, 1.00); box-shadow: 0px 0px 5px 2px rgba(205, 205, 205, 1.00); margin: 5px; border-top-left-radius: 5px; border-top-right-radius: 5px; border-bottom-right-radius: 5px; border-bottom-left-radius: 5px; } #playlisterPlaceholderstacks_in_590 { display: none !important; } #playlisterstacks_in_590 { border-radius: 0px; height: auto; position: relative; width: auto; z-index: 2; display: block; overflow: auto; padding: 15px; border-top-left-radius: 5px; border-top-right-radius: 5px; border-bottom-right-radius: 0px; border-bottom-left-radius: 0px; } /* Solid colour fill */ #playlisterstacks_in_590 { background: rgba(255, 255, 255, 1.00); } #playlisterstacks_in_590 .btn { text-decoration: none; margin-top: 5px; } #coverControlsWrapperstacks_in_590 { position: relative; height: auto; overflow: auto; margin-bottom: 5px; display: flex; flex-direction: column; width: 100%; text-align: left; } @media screen and (min-width: 600px) { #coverControlsWrapperstacks_in_590 { flex-direction: row; } } #coverControlsWrapperstacks_in_590 { min-height: 70px; } #coverstacks_in_590 { background-repeat: no-repeat; background-size: contain; background-position: center; border-top-left-radius: 5px; border-top-right-radius: 5px; border-bottom-right-radius: 5px; border-bottom-left-radius: 5px; position: relative; height: 70px; width: 70px; display: block; margin: 0 auto; } @media screen and (min-width: 600px) { #coverstacks_in_590 { justify-content: space-around; } } #playerInterfacestacks_in_590 { display: block; overflow: hidden; text-align: center; } @media screen and (min-width: 600px) { #playerInterfacestacks_in_590 { flex: 1; padding-left: 15px; display: flex; flex-direction: column; justify-content: space-around; text-align: left; } } #playlisterTopSectionstacks_in_590 { height: auto; overflow: auto; margin-top: 15px; } @media screen and (min-width: 600px) { #playlisterTopSectionstacks_in_590 { margin-top: 0px; } } #titlestacks_in_590 { color: rgba(255, 255, 255, 1.00); font-size: 24px; font-weight: bold; line-height: 1.50em; } #titlestacks_in_590:before { content: ' '; } #albumstacks_in_590 { color: rgba(205, 205, 205, 1.00); font-size: 16px; line-height: 1.50em; } #albumstacks_in_590:before { content: 'Album: '; } #artiststacks_in_590 { color: rgba(205, 205, 205, 1.00); font-size: 16px; line-height: 1.50em; } #artiststacks_in_590:before { content: 'Artist: '; } #additionalInfostacks_in_590 { color: rgba(205, 205, 205, 1.00); font-size: 16px; line-height: 1.50em; } #additionalInfostacks_in_590:before { content: ' '; } #controlsstacks_in_590 { position: relative; margin: 0px; padding: 0; color: #cdcdcd; overflow: visible; } @media screen and (min-width: 600px) { #controlsstacks_in_590 { padding-top: 10px; } } #buttonWrapperstacks_in_590 { display: table; position: relative; vertical-align: middle; text-align: center; width: 100%; } #playlisterWrapperstacks_in_590 .buttonItem { display: table-cell; text-align: center; position: relative; overflow: visible; } #playlisterWrapperstacks_in_590 .playlisterButtonStandard, #playlisterWrapperstacks_in_590 .playlisterButton { display: inline-block; width: 50px; height: 50px; text-align: center; line-height: 50px; text-align: center; font-size: 20px; background: rgba(102, 204, 255, 0.35); border-radius: 50%; transition: all 300ms ease-in-out; color: rgba(230, 230, 230, 1.00); cursor: pointer; position: relative; overflow: hidden; box-shadow: 0px 1px 4px -2px #333; text-shadow: 0px -1px #333; border: 1px solid rgba(255, 255, 255, 1.00); } #playlisterWrapperstacks_in_590 .playlisterButtonStandard i, #playlisterWrapperstacks_in_590 .playlisterButton i { color: rgba(230, 230, 230, 1.00); transition: all 300ms ease-in-out; line-height: 50px !important; } #playlisterWrapperstacks_in_590 .playlisterButtonStandard:hover, #playlisterWrapperstacks_in_590 .playlisterButtonStandard:active, #playlisterWrapperstacks_in_590 .playlisterButtonStandard:focus, #playlisterWrapperstacks_in_590 .playlisterButton:hover, #playlisterWrapperstacks_in_590 .playlisterButton:active, #playlisterWrapperstacks_in_590 .playlisterButton:focus { color: rgba(0, 0, 255, 1.00); background: rgba(102, 204, 255, 0.50); border: 1px solid rgba(255, 255, 255, 1.00); } #playlisterWrapperstacks_in_590 .playlisterButtonStandard:hover i, #playlisterWrapperstacks_in_590 .playlisterButtonStandard:active i, #playlisterWrapperstacks_in_590 .playlisterButtonStandard:focus i, #playlisterWrapperstacks_in_590 .playlisterButton:hover i, #playlisterWrapperstacks_in_590 .playlisterButton:active i, #playlisterWrapperstacks_in_590 .playlisterButton:focus i { color: rgba(0, 0, 255, 1.00); } #playlisterWrapperstacks_in_590 #playstacks_in_590 i { margin-right: -3px; } #playlisterWrapperstacks_in_590 #pausestacks_in_590 { display: none; } #playlisterWrapperstacks_in_590 .playlisterIsPlaying #playstacks_in_590 { display: none; } #playlisterWrapperstacks_in_590 .playlisterIsPlaying #pausestacks_in_590 { display: inline-block; } /* Glass effect */ #playlisterWrapperstacks_in_590 .playlisterButton:after, #playlisterWrapperstacks_in_590 .playlisterButtonStandard:after { content: ''; position: absolute; top: 0px; left: 0px; width: 100%; height: 50%; background: linear-gradient(rgba(255, 255, 255, 0.05), rgba(255, 255, 255, 0.05)); } #userOptionsBarstacks_in_590 { float: right; } #playlisterWrapperstacks_in_590 .playlisterInterfaceComponent, #playlisterWrapperstacks_in_590 .playlisterInterfaceComponentStandard { margin-bottom: 15px; margin-left: 15px; } @media screen and (min-width: 600px) { #playlisterWrapperstacks_in_590 .playlisterInterfaceComponent, #playlisterWrapperstacks_in_590 .playlisterInterfaceComponentStandard { float: left; } } #volumeControlsstacks_in_590, #volumeBtnstacks_in_590 { display: none; } @media screen and (min-width: 600px) { #volumeBtnstacks_in_590 { display: inline-block; } #volumeControlsstacks_in_590 { height: 140px; width: 70px; display: none; position: absolute; left: 50%; bottom: 100%; margin-left: -35px; overflow: visible; z-index: 90; background: rgba(25, 25, 25, 1.00); border-radius: 10px; } #volume-fullstacks_in_590 { position: absolute; left: 14px; top: 10px; width: 100%; display: block; font-size: 20px; text-align: left; } #volume-mutestacks_in_590 { position: absolute; left: 18px; top: 110px; width: 100%; display: block; text-align: left; font-size: 20px; } #volume-mutestacks_in_590 i, #volume-fullstacks_in_590 i { color: rgba(205, 205, 205, 1.00); line-height: 1; padding: 0; margin: 0; } #volumeSliderstacks_in_590 { position: absolute; top: 10px; right: 15px; display: block; height: 100%; } #volumestacks_in_590 { height: 120px; width: 10px; background: rgba(102, 102, 102, 1.00); position: relative; border-radius: 5px; } #volumestacks_in_590 .ui-slider-range { background: rgba(75, 179, 135, 1.00); border-radius: 5px; outline: none; display: block; width: 100%; position: absolute; bottom: 0; left: 0; } #volumestacks_in_590 .ui-slider-handle { cursor: pointer; position: absolute; left: 0; bottom: 0px; margin-left: -5px; margin-bottom: -10px; width: 20px; height: 20px; z-index: 2; border-radius: 10px; background: rgba(205, 205, 205, 1.00); outline: none; } } #progressBarstacks_in_590 { margin-bottom: 5px; height: auto; overflow: auto; } #trackerstacks_in_590 { display: block; position: relative; height: 10px; background: rgba(102, 102, 102, 1.00); margin-top: 5px; border-radius: 5px; overflow: hidden; } #trackerstacks_in_590 #progressstacks_in_590 { background-color: rgba(75, 179, 135, 1.00); height: 100%; display: block; width: 0px; background-image: -webkit-linear-gradient(45deg,rgba(255,255,255,.15) 25%,transparent 25%,transparent 50%,rgba(255,255,255,.15) 50%,rgba(255,255,255,.15) 75%,transparent 75%,transparent); background-image: -o-linear-gradient(45deg,rgba(255,255,255,.15) 25%,transparent 25%,transparent 50%,rgba(255,255,255,.15) 50%,rgba(255,255,255,.15) 75%,transparent 75%,transparent); background-image: linear-gradient(45deg,rgba(255,255,255,.15) 25%,transparent 25%,transparent 50%,rgba(255,255,255,.15) 50%,rgba(255,255,255,.15) 75%,transparent 75%,transparent); -webkit-background-size: 20px 20px; background-size: 20px 20px; -webkit-animation: playlister-progress-bar-stripes 2s linear infinite; -o-animation: playlister-progress-bar-stripes 2s linear infinite; animation: playlister-progress-bar-stripes 2s linear infinite; } @-webkit-keyframes playlister-progress-bar-stripes { from { background-position: 20px 0; } to { background-position: 0 0; } } @keyframes playlister-progress-bar-stripes { from { background-position: 20px 0; } to { background-position: 0 0; } } #currentstacks_in_590 { float: left; font-size: 14px; margin-top: 4px; color: rgba(205, 205, 205, 1.00); } #durationstacks_in_590 { float: right; font-size: 14px; margin-top: 4px; color: rgba(205, 205, 205, 1.00); } /* iOS can't preload audio and fetch the total duration until the track starts to play. So we make duration invisisble and make it visible on desktops or (via jQuery) when the track is clicked and playing */ #durationstacks_in_590 { visibility: hidden; } #durationstacks_in_590.showDuration { visibility: visible; } #playlisterPlayliststacks_in_590 { background-color: rgba(255, 255, 255, 1.00); list-style-type: none; margin: 0; padding: 0px; position: relative; z-index: 1; /* Start either displayed or hidden */ display: block; overflow: hidden; border-top-left-radius: 0px; border-top-right-radius: 0px; border-bottom-right-radius: 5px; border-bottom-left-radius: 5px; -webkit-column-count: 1; -moz-column-count: 1; column-count: 1; -webkit-column-gap: 0px; -moz-column-gap: 0px; column-gap: 0px; -webkit-column-rule: 0px solid #CDCDCD; -moz-column-rule: 0px solid #CDCDCD; column-rule: 0px solid #CDCDCD; /* Hide top-most item borders */ margin-top: -0px } @media screen and (min-width: 34em) { #playlisterPlayliststacks_in_590 { -webkit-column-count: 2; -moz-column-count: 2; column-count: 2; } } @media screen and (min-width: 48em) { #playlisterPlayliststacks_in_590 { -webkit-column-count: 3; -moz-column-count: 3; column-count: 3; } } @media screen and (min-width: 62em) { #playlisterPlayliststacks_in_590 { -webkit-column-count: 3; -moz-column-count: 3; column-count: 3; } } @media screen and (min-width: 75em) { #playlisterPlayliststacks_in_590 { -webkit-column-count: 3; -moz-column-count: 3; column-count: 3; } } #playlisterPlayliststacks_in_590 li { display: block; width: 100%; margin: 0; padding: 0; background: rgba(255, 255, 255, 1.00); color: rgba(153, 153, 153, 1.00); font-size: 18px; height: 45px; line-height: 45px; cursor: pointer; transition: color 300ms ease-in-out, background 300ms ease-in-out; overflow: hidden; position: relative; -webkit-column-break-inside: avoid; break-inside: avoid; transform: translateZ(0); border-top: 0px solid #CDCDCD; } #playlisterPlayliststacks_in_590 li:hover { background: rgba(234, 234, 234, 1.00); } #playlisterPlayliststacks_in_590 li.active-playlistitem, #playlisterPlayliststacks_in_590 li.active-playlistitem:hover { font-weight: normal; color: rgba(0, 0, 0, 1.00); background: rgba(102, 204, 255, 0.18); } #playlisterPlayliststacks_in_590 li { padding-left: 0; } #playlisterPlayliststacks_in_590 li .playlistItemNumber { display: inline-block; width: 35px; text-align: right; margin: 0 10px 0 0; padding: 0; } #playlisterPlayliststacks_in_590 li .playListerAdditionalInfo { display: none; } #playlisterPlayliststacks_in_590 li .playlistItemActiveIcon { display: none; } .no-audio #playlisterstacks_in_590, .no-audio #playlisterPlayliststacks_in_590 { display: none; } #playlisterNoAudiostacks_in_590 { display: none; } .no-audio #playlisterNoAudiostacks_in_590 { padding: 15px; display: none; } .no-adownload #downloadstacks_in_590 { display: none; } #playlisterWrapperstacks_in_590 #titlestacks_in_590 { display: none; } #playlisterWrapperstacks_in_590 #albumstacks_in_590 { display: none; } #playlisterWrapperstacks_in_590 #artiststacks_in_590 { display: none; } #playlisterWrapperstacks_in_590 #additionalInfostacks_in_590 { display: none; } #playlisterWrapperstacks_in_590 #downloadstacks_in_590 { display: none !important; } #playlisterWrapperstacks_in_590 #progressBarstacks_in_590 { display: none; } #playlisterWrapperstacks_in_590 #repeatstacks_in_590 { display: none; } #playlisterWrapperstacks_in_590 #volumeBtnstacks_in_590 { display: none; } #playlisterWrapperstacks_in_590 #shufflestacks_in_590 { display: none; } #playlisterWrapperstacks_in_590 #playlistTogglestacks_in_590 { display: none; } #playlisterPlaceholderstacks_in_590 { display: none; padding: 15px; margin: 15px; background: #ffffff; color: #000000; font-family: "Courier New", Courier, mono; } #playlisterPlaceholderstacks_in_590 audio { width: 100%; } #stacks_in_590 { background-color: rgba(255, 255, 255, 1.00); -moz-border-radius: 10px; -webkit-border-radius: 10px; border-radius: 10px; } #stacks_in_631 { padding: 20px; } #stacks_in_668 { background-color: rgba(102, 204, 255, 0.10); -moz-border-radius: 10px; -webkit-border-radius: 10px; border-radius: 10px; } #stacks_in_669 { font-size: 200%; } #stacks_in_637 { padding: 20px; } #stacks_in_558 *, #stacks_in_558 *:before, #stacks_in_558 *:after { box-sizing: border-box; } #stacks_in_558 { max-width: 800px; margin: 0 auto; } #playlisterWrapperstacks_in_558 { -webkit-box-shadow: 0px 0px 5px 2px rgba(205, 205, 205, 1.00); box-shadow: 0px 0px 5px 2px rgba(205, 205, 205, 1.00); margin: 5px; border-top-left-radius: 5px; border-top-right-radius: 5px; border-bottom-right-radius: 5px; border-bottom-left-radius: 5px; } #playlisterPlaceholderstacks_in_558 { display: none !important; } #playlisterstacks_in_558 { border-radius: 0px; height: auto; position: relative; width: auto; z-index: 2; display: block; overflow: auto; padding: 15px; border-top-left-radius: 5px; border-top-right-radius: 5px; border-bottom-right-radius: 0px; border-bottom-left-radius: 0px; } /* Solid colour fill */ #playlisterstacks_in_558 { background: rgba(255, 255, 255, 1.00); } #playlisterstacks_in_558 .btn { text-decoration: none; margin-top: 5px; } #coverControlsWrapperstacks_in_558 { position: relative; height: auto; overflow: auto; margin-bottom: 5px; display: flex; flex-direction: column; width: 100%; text-align: left; } @media screen and (min-width: 600px) { #coverControlsWrapperstacks_in_558 { flex-direction: row; } } #coverControlsWrapperstacks_in_558 { min-height: 70px; } #coverstacks_in_558 { background-repeat: no-repeat; background-size: contain; background-position: center; border-top-left-radius: 5px; border-top-right-radius: 5px; border-bottom-right-radius: 5px; border-bottom-left-radius: 5px; position: relative; height: 70px; width: 70px; display: block; margin: 0 auto; } @media screen and (min-width: 600px) { #coverstacks_in_558 { justify-content: space-around; } } #playerInterfacestacks_in_558 { display: block; overflow: hidden; text-align: center; } @media screen and (min-width: 600px) { #playerInterfacestacks_in_558 { flex: 1; padding-left: 15px; display: flex; flex-direction: column; justify-content: space-around; text-align: left; } } #playlisterTopSectionstacks_in_558 { height: auto; overflow: auto; margin-top: 15px; } @media screen and (min-width: 600px) { #playlisterTopSectionstacks_in_558 { margin-top: 0px; } } #titlestacks_in_558 { color: rgba(255, 255, 255, 1.00); font-size: 24px; font-weight: bold; line-height: 1.50em; } #titlestacks_in_558:before { content: ' '; } #albumstacks_in_558 { color: rgba(205, 205, 205, 1.00); font-size: 16px; line-height: 1.50em; } #albumstacks_in_558:before { content: 'Album: '; } #artiststacks_in_558 { color: rgba(205, 205, 205, 1.00); font-size: 16px; line-height: 1.50em; } #artiststacks_in_558:before { content: 'Artist: '; } #additionalInfostacks_in_558 { color: rgba(205, 205, 205, 1.00); font-size: 16px; line-height: 1.50em; } #additionalInfostacks_in_558:before { content: ' '; } #controlsstacks_in_558 { position: relative; margin: 0px; padding: 0; color: #cdcdcd; overflow: visible; } @media screen and (min-width: 600px) { #controlsstacks_in_558 { padding-top: 10px; } } #buttonWrapperstacks_in_558 { display: table; position: relative; vertical-align: middle; text-align: center; width: 100%; } #playlisterWrapperstacks_in_558 .buttonItem { display: table-cell; text-align: center; position: relative; overflow: visible; } #playlisterWrapperstacks_in_558 .playlisterButtonStandard, #playlisterWrapperstacks_in_558 .playlisterButton { display: inline-block; width: 50px; height: 50px; text-align: center; line-height: 50px; text-align: center; font-size: 20px; background: rgba(102, 204, 255, 0.35); border-radius: 50%; transition: all 300ms ease-in-out; color: rgba(230, 230, 230, 1.00); cursor: pointer; position: relative; overflow: hidden; box-shadow: 0px 1px 4px -2px #333; text-shadow: 0px -1px #333; border: 1px solid rgba(255, 255, 255, 1.00); } #playlisterWrapperstacks_in_558 .playlisterButtonStandard i, #playlisterWrapperstacks_in_558 .playlisterButton i { color: rgba(230, 230, 230, 1.00); transition: all 300ms ease-in-out; line-height: 50px !important; } #playlisterWrapperstacks_in_558 .playlisterButtonStandard:hover, #playlisterWrapperstacks_in_558 .playlisterButtonStandard:active, #playlisterWrapperstacks_in_558 .playlisterButtonStandard:focus, #playlisterWrapperstacks_in_558 .playlisterButton:hover, #playlisterWrapperstacks_in_558 .playlisterButton:active, #playlisterWrapperstacks_in_558 .playlisterButton:focus { color: rgba(0, 0, 255, 1.00); background: rgba(102, 204, 255, 0.50); border: 1px solid rgba(255, 255, 255, 1.00); } #playlisterWrapperstacks_in_558 .playlisterButtonStandard:hover i, #playlisterWrapperstacks_in_558 .playlisterButtonStandard:active i, #playlisterWrapperstacks_in_558 .playlisterButtonStandard:focus i, #playlisterWrapperstacks_in_558 .playlisterButton:hover i, #playlisterWrapperstacks_in_558 .playlisterButton:active i, #playlisterWrapperstacks_in_558 .playlisterButton:focus i { color: rgba(0, 0, 255, 1.00); } #playlisterWrapperstacks_in_558 #playstacks_in_558 i { margin-right: -3px; } #playlisterWrapperstacks_in_558 #pausestacks_in_558 { display: none; } #playlisterWrapperstacks_in_558 .playlisterIsPlaying #playstacks_in_558 { display: none; } #playlisterWrapperstacks_in_558 .playlisterIsPlaying #pausestacks_in_558 { display: inline-block; } /* Glass effect */ #playlisterWrapperstacks_in_558 .playlisterButton:after, #playlisterWrapperstacks_in_558 .playlisterButtonStandard:after { content: ''; position: absolute; top: 0px; left: 0px; width: 100%; height: 50%; background: linear-gradient(rgba(255, 255, 255, 0.05), rgba(255, 255, 255, 0.05)); } #userOptionsBarstacks_in_558 { float: right; } #playlisterWrapperstacks_in_558 .playlisterInterfaceComponent, #playlisterWrapperstacks_in_558 .playlisterInterfaceComponentStandard { margin-bottom: 15px; margin-left: 15px; } @media screen and (min-width: 600px) { #playlisterWrapperstacks_in_558 .playlisterInterfaceComponent, #playlisterWrapperstacks_in_558 .playlisterInterfaceComponentStandard { float: left; } } #volumeControlsstacks_in_558, #volumeBtnstacks_in_558 { display: none; } @media screen and (min-width: 600px) { #volumeBtnstacks_in_558 { display: inline-block; } #volumeControlsstacks_in_558 { height: 140px; width: 70px; display: none; position: absolute; left: 50%; bottom: 100%; margin-left: -35px; overflow: visible; z-index: 90; background: rgba(25, 25, 25, 1.00); border-radius: 10px; } #volume-fullstacks_in_558 { position: absolute; left: 14px; top: 10px; width: 100%; display: block; font-size: 20px; text-align: left; } #volume-mutestacks_in_558 { position: absolute; left: 18px; top: 110px; width: 100%; display: block; text-align: left; font-size: 20px; } #volume-mutestacks_in_558 i, #volume-fullstacks_in_558 i { color: rgba(205, 205, 205, 1.00); line-height: 1; padding: 0; margin: 0; } #volumeSliderstacks_in_558 { position: absolute; top: 10px; right: 15px; display: block; height: 100%; } #volumestacks_in_558 { height: 120px; width: 10px; background: rgba(102, 102, 102, 1.00); position: relative; border-radius: 5px; } #volumestacks_in_558 .ui-slider-range { background: rgba(75, 179, 135, 1.00); border-radius: 5px; outline: none; display: block; width: 100%; position: absolute; bottom: 0; left: 0; } #volumestacks_in_558 .ui-slider-handle { cursor: pointer; position: absolute; left: 0; bottom: 0px; margin-left: -5px; margin-bottom: -10px; width: 20px; height: 20px; z-index: 2; border-radius: 10px; background: rgba(205, 205, 205, 1.00); outline: none; } } #progressBarstacks_in_558 { margin-bottom: 5px; height: auto; overflow: auto; } #trackerstacks_in_558 { display: block; position: relative; height: 10px; background: rgba(102, 102, 102, 1.00); margin-top: 5px; border-radius: 5px; overflow: hidden; } #trackerstacks_in_558 #progressstacks_in_558 { background-color: rgba(75, 179, 135, 1.00); height: 100%; display: block; width: 0px; background-image: -webkit-linear-gradient(45deg,rgba(255,255,255,.15) 25%,transparent 25%,transparent 50%,rgba(255,255,255,.15) 50%,rgba(255,255,255,.15) 75%,transparent 75%,transparent); background-image: -o-linear-gradient(45deg,rgba(255,255,255,.15) 25%,transparent 25%,transparent 50%,rgba(255,255,255,.15) 50%,rgba(255,255,255,.15) 75%,transparent 75%,transparent); background-image: linear-gradient(45deg,rgba(255,255,255,.15) 25%,transparent 25%,transparent 50%,rgba(255,255,255,.15) 50%,rgba(255,255,255,.15) 75%,transparent 75%,transparent); -webkit-background-size: 20px 20px; background-size: 20px 20px; -webkit-animation: playlister-progress-bar-stripes 2s linear infinite; -o-animation: playlister-progress-bar-stripes 2s linear infinite; animation: playlister-progress-bar-stripes 2s linear infinite; } @-webkit-keyframes playlister-progress-bar-stripes { from { background-position: 20px 0; } to { background-position: 0 0; } } @keyframes playlister-progress-bar-stripes { from { background-position: 20px 0; } to { background-position: 0 0; } } #currentstacks_in_558 { float: left; font-size: 14px; margin-top: 4px; color: rgba(205, 205, 205, 1.00); } #durationstacks_in_558 { float: right; font-size: 14px; margin-top: 4px; color: rgba(205, 205, 205, 1.00); } /* iOS can't preload audio and fetch the total duration until the track starts to play. So we make duration invisisble and make it visible on desktops or (via jQuery) when the track is clicked and playing */ #durationstacks_in_558 { visibility: hidden; } #durationstacks_in_558.showDuration { visibility: visible; } #playlisterPlayliststacks_in_558 { background-color: rgba(255, 255, 255, 1.00); list-style-type: none; margin: 0; padding: 0px; position: relative; z-index: 1; /* Start either displayed or hidden */ display: block; overflow: hidden; border-top-left-radius: 0px; border-top-right-radius: 0px; border-bottom-right-radius: 5px; border-bottom-left-radius: 5px; -webkit-column-count: 1; -moz-column-count: 1; column-count: 1; -webkit-column-gap: 0px; -moz-column-gap: 0px; column-gap: 0px; -webkit-column-rule: 0px solid #CDCDCD; -moz-column-rule: 0px solid #CDCDCD; column-rule: 0px solid #CDCDCD; /* Hide top-most item borders */ margin-top: -0px } @media screen and (min-width: 34em) { #playlisterPlayliststacks_in_558 { -webkit-column-count: 2; -moz-column-count: 2; column-count: 2; } } @media screen and (min-width: 48em) { #playlisterPlayliststacks_in_558 { -webkit-column-count: 3; -moz-column-count: 3; column-count: 3; } } @media screen and (min-width: 62em) { #playlisterPlayliststacks_in_558 { -webkit-column-count: 3; -moz-column-count: 3; column-count: 3; } } @media screen and (min-width: 75em) { #playlisterPlayliststacks_in_558 { -webkit-column-count: 3; -moz-column-count: 3; column-count: 3; } } #playlisterPlayliststacks_in_558 li { display: block; width: 100%; margin: 0; padding: 0; background: rgba(255, 255, 255, 1.00); color: rgba(153, 153, 153, 1.00); font-size: 18px; height: 45px; line-height: 45px; cursor: pointer; transition: color 300ms ease-in-out, background 300ms ease-in-out; overflow: hidden; position: relative; -webkit-column-break-inside: avoid; break-inside: avoid; transform: translateZ(0); border-top: 0px solid #CDCDCD; } #playlisterPlayliststacks_in_558 li:hover { background: rgba(234, 234, 234, 1.00); } #playlisterPlayliststacks_in_558 li.active-playlistitem, #playlisterPlayliststacks_in_558 li.active-playlistitem:hover { font-weight: normal; color: rgba(0, 0, 0, 1.00); background: rgba(102, 204, 255, 0.18); } #playlisterPlayliststacks_in_558 li { padding-left: 0; } #playlisterPlayliststacks_in_558 li .playlistItemNumber { display: inline-block; width: 35px; text-align: right; margin: 0 10px 0 0; padding: 0; } #playlisterPlayliststacks_in_558 li .playListerAdditionalInfo { display: none; } #playlisterPlayliststacks_in_558 li .playlistItemActiveIcon { display: none; } .no-audio #playlisterstacks_in_558, .no-audio #playlisterPlayliststacks_in_558 { display: none; } #playlisterNoAudiostacks_in_558 { display: none; } .no-audio #playlisterNoAudiostacks_in_558 { padding: 15px; display: none; } .no-adownload #downloadstacks_in_558 { display: none; } #playlisterWrapperstacks_in_558 #titlestacks_in_558 { display: none; } #playlisterWrapperstacks_in_558 #albumstacks_in_558 { display: none; } #playlisterWrapperstacks_in_558 #artiststacks_in_558 { display: none; } #playlisterWrapperstacks_in_558 #additionalInfostacks_in_558 { display: none; } #playlisterWrapperstacks_in_558 #downloadstacks_in_558 { display: none !important; } #playlisterWrapperstacks_in_558 #progressBarstacks_in_558 { display: none; } #playlisterWrapperstacks_in_558 #repeatstacks_in_558 { display: none; } #playlisterWrapperstacks_in_558 #volumeBtnstacks_in_558 { display: none; } #playlisterWrapperstacks_in_558 #shufflestacks_in_558 { display: none; } #playlisterWrapperstacks_in_558 #playlistTogglestacks_in_558 { display: none; } #playlisterPlaceholderstacks_in_558 { display: none; padding: 15px; margin: 15px; background: #ffffff; color: #000000; font-family: "Courier New", Courier, mono; } #playlisterPlaceholderstacks_in_558 audio { width: 100%; } #stacks_in_558 { background-color: rgba(255, 255, 255, 1.00); -moz-border-radius: 10px; -webkit-border-radius: 10px; border-radius: 10px; } #stacks_in_586 { padding: 20px; } #stacks_in_670 { background-color: rgba(102, 204, 255, 0.10); -moz-border-radius: 10px; -webkit-border-radius: 10px; border-radius: 10px; } #stacks_in_671 { font-size: 200%; } #stacks_in_588 { padding: 20px; } #stacks_in_573 { padding: 20px; } #stacks_in_575 *, #stacks_in_575 *:before, #stacks_in_575 *:after { box-sizing: border-box; } #stacks_in_575 { max-width: 800px; margin: 0 auto; } #playlisterWrapperstacks_in_575 { -webkit-box-shadow: 0px 0px 5px 2px rgba(205, 205, 205, 1.00); box-shadow: 0px 0px 5px 2px rgba(205, 205, 205, 1.00); margin: 5px; border-top-left-radius: 5px; border-top-right-radius: 5px; border-bottom-right-radius: 5px; border-bottom-left-radius: 5px; } #playlisterPlaceholderstacks_in_575 { display: none !important; } #playlisterstacks_in_575 { border-radius: 0px; height: auto; position: relative; width: auto; z-index: 2; display: block; overflow: auto; padding: 15px; border-top-left-radius: 5px; border-top-right-radius: 5px; border-bottom-right-radius: 0px; border-bottom-left-radius: 0px; } /* Solid colour fill */ #playlisterstacks_in_575 { background: rgba(255, 255, 255, 1.00); } #playlisterstacks_in_575 .btn { text-decoration: none; margin-top: 5px; } #coverControlsWrapperstacks_in_575 { position: relative; height: auto; overflow: auto; margin-bottom: 5px; display: flex; flex-direction: column; width: 100%; text-align: left; } @media screen and (min-width: 600px) { #coverControlsWrapperstacks_in_575 { flex-direction: row; } } #coverControlsWrapperstacks_in_575 { min-height: 70px; } #coverstacks_in_575 { background-repeat: no-repeat; background-size: contain; background-position: center; border-top-left-radius: 5px; border-top-right-radius: 5px; border-bottom-right-radius: 5px; border-bottom-left-radius: 5px; position: relative; height: 70px; width: 70px; display: block; margin: 0 auto; } @media screen and (min-width: 600px) { #coverstacks_in_575 { justify-content: space-around; } } #playerInterfacestacks_in_575 { display: block; overflow: hidden; text-align: center; } @media screen and (min-width: 600px) { #playerInterfacestacks_in_575 { flex: 1; padding-left: 15px; display: flex; flex-direction: column; justify-content: space-around; text-align: left; } } #playlisterTopSectionstacks_in_575 { height: auto; overflow: auto; margin-top: 15px; } @media screen and (min-width: 600px) { #playlisterTopSectionstacks_in_575 { margin-top: 0px; } } #titlestacks_in_575 { color: rgba(255, 255, 255, 1.00); font-size: 24px; font-weight: bold; line-height: 1.50em; } #titlestacks_in_575:before { content: ' '; } #albumstacks_in_575 { color: rgba(205, 205, 205, 1.00); font-size: 16px; line-height: 1.50em; } #albumstacks_in_575:before { content: 'Album: '; } #artiststacks_in_575 { color: rgba(205, 205, 205, 1.00); font-size: 16px; line-height: 1.50em; } #artiststacks_in_575:before { content: 'Artist: '; } #additionalInfostacks_in_575 { color: rgba(205, 205, 205, 1.00); font-size: 16px; line-height: 1.50em; } #additionalInfostacks_in_575:before { content: ' '; } #controlsstacks_in_575 { position: relative; margin: 0px; padding: 0; color: #cdcdcd; overflow: visible; } @media screen and (min-width: 600px) { #controlsstacks_in_575 { padding-top: 10px; } } #buttonWrapperstacks_in_575 { display: table; position: relative; vertical-align: middle; text-align: center; width: 100%; } #playlisterWrapperstacks_in_575 .buttonItem { display: table-cell; text-align: center; position: relative; overflow: visible; } #playlisterWrapperstacks_in_575 .playlisterButtonStandard, #playlisterWrapperstacks_in_575 .playlisterButton { display: inline-block; width: 50px; height: 50px; text-align: center; line-height: 50px; text-align: center; font-size: 20px; background: rgba(102, 204, 255, 0.35); border-radius: 50%; transition: all 300ms ease-in-out; color: rgba(230, 230, 230, 1.00); cursor: pointer; position: relative; overflow: hidden; box-shadow: 0px 1px 4px -2px #333; text-shadow: 0px -1px #333; border: 1px solid rgba(255, 255, 255, 1.00); } #playlisterWrapperstacks_in_575 .playlisterButtonStandard i, #playlisterWrapperstacks_in_575 .playlisterButton i { color: rgba(230, 230, 230, 1.00); transition: all 300ms ease-in-out; line-height: 50px !important; } #playlisterWrapperstacks_in_575 .playlisterButtonStandard:hover, #playlisterWrapperstacks_in_575 .playlisterButtonStandard:active, #playlisterWrapperstacks_in_575 .playlisterButtonStandard:focus, #playlisterWrapperstacks_in_575 .playlisterButton:hover, #playlisterWrapperstacks_in_575 .playlisterButton:active, #playlisterWrapperstacks_in_575 .playlisterButton:focus { color: rgba(0, 0, 255, 1.00); background: rgba(102, 204, 255, 0.50); border: 1px solid rgba(255, 255, 255, 1.00); } #playlisterWrapperstacks_in_575 .playlisterButtonStandard:hover i, #playlisterWrapperstacks_in_575 .playlisterButtonStandard:active i, #playlisterWrapperstacks_in_575 .playlisterButtonStandard:focus i, #playlisterWrapperstacks_in_575 .playlisterButton:hover i, #playlisterWrapperstacks_in_575 .playlisterButton:active i, #playlisterWrapperstacks_in_575 .playlisterButton:focus i { color: rgba(0, 0, 255, 1.00); } #playlisterWrapperstacks_in_575 #playstacks_in_575 i { margin-right: -3px; } #playlisterWrapperstacks_in_575 #pausestacks_in_575 { display: none; } #playlisterWrapperstacks_in_575 .playlisterIsPlaying #playstacks_in_575 { display: none; } #playlisterWrapperstacks_in_575 .playlisterIsPlaying #pausestacks_in_575 { display: inline-block; } /* Glass effect */ #playlisterWrapperstacks_in_575 .playlisterButton:after, #playlisterWrapperstacks_in_575 .playlisterButtonStandard:after { content: ''; position: absolute; top: 0px; left: 0px; width: 100%; height: 50%; background: linear-gradient(rgba(255, 255, 255, 0.05), rgba(255, 255, 255, 0.05)); } #userOptionsBarstacks_in_575 { float: right; } #playlisterWrapperstacks_in_575 .playlisterInterfaceComponent, #playlisterWrapperstacks_in_575 .playlisterInterfaceComponentStandard { margin-bottom: 15px; margin-left: 15px; } @media screen and (min-width: 600px) { #playlisterWrapperstacks_in_575 .playlisterInterfaceComponent, #playlisterWrapperstacks_in_575 .playlisterInterfaceComponentStandard { float: left; } } #volumeControlsstacks_in_575, #volumeBtnstacks_in_575 { display: none; } @media screen and (min-width: 600px) { #volumeBtnstacks_in_575 { display: inline-block; } #volumeControlsstacks_in_575 { height: 140px; width: 70px; display: none; position: absolute; left: 50%; bottom: 100%; margin-left: -35px; overflow: visible; z-index: 90; background: rgba(25, 25, 25, 1.00); border-radius: 10px; } #volume-fullstacks_in_575 { position: absolute; left: 14px; top: 10px; width: 100%; display: block; font-size: 20px; text-align: left; } #volume-mutestacks_in_575 { position: absolute; left: 18px; top: 110px; width: 100%; display: block; text-align: left; font-size: 20px; } #volume-mutestacks_in_575 i, #volume-fullstacks_in_575 i { color: rgba(205, 205, 205, 1.00); line-height: 1; padding: 0; margin: 0; } #volumeSliderstacks_in_575 { position: absolute; top: 10px; right: 15px; display: block; height: 100%; } #volumestacks_in_575 { height: 120px; width: 10px; background: rgba(102, 102, 102, 1.00); position: relative; border-radius: 5px; } #volumestacks_in_575 .ui-slider-range { background: rgba(75, 179, 135, 1.00); border-radius: 5px; outline: none; display: block; width: 100%; position: absolute; bottom: 0; left: 0; } #volumestacks_in_575 .ui-slider-handle { cursor: pointer; position: absolute; left: 0; bottom: 0px; margin-left: -5px; margin-bottom: -10px; width: 20px; height: 20px; z-index: 2; border-radius: 10px; background: rgba(205, 205, 205, 1.00); outline: none; } } #progressBarstacks_in_575 { margin-bottom: 5px; height: auto; overflow: auto; } #trackerstacks_in_575 { display: block; position: relative; height: 10px; background: rgba(102, 102, 102, 1.00); margin-top: 5px; border-radius: 5px; overflow: hidden; } #trackerstacks_in_575 #progressstacks_in_575 { background-color: rgba(75, 179, 135, 1.00); height: 100%; display: block; width: 0px; background-image: -webkit-linear-gradient(45deg,rgba(255,255,255,.15) 25%,transparent 25%,transparent 50%,rgba(255,255,255,.15) 50%,rgba(255,255,255,.15) 75%,transparent 75%,transparent); background-image: -o-linear-gradient(45deg,rgba(255,255,255,.15) 25%,transparent 25%,transparent 50%,rgba(255,255,255,.15) 50%,rgba(255,255,255,.15) 75%,transparent 75%,transparent); background-image: linear-gradient(45deg,rgba(255,255,255,.15) 25%,transparent 25%,transparent 50%,rgba(255,255,255,.15) 50%,rgba(255,255,255,.15) 75%,transparent 75%,transparent); -webkit-background-size: 20px 20px; background-size: 20px 20px; -webkit-animation: playlister-progress-bar-stripes 2s linear infinite; -o-animation: playlister-progress-bar-stripes 2s linear infinite; animation: playlister-progress-bar-stripes 2s linear infinite; } @-webkit-keyframes playlister-progress-bar-stripes { from { background-position: 20px 0; } to { background-position: 0 0; } } @keyframes playlister-progress-bar-stripes { from { background-position: 20px 0; } to { background-position: 0 0; } } #currentstacks_in_575 { float: left; font-size: 14px; margin-top: 4px; color: rgba(205, 205, 205, 1.00); } #durationstacks_in_575 { float: right; font-size: 14px; margin-top: 4px; color: rgba(205, 205, 205, 1.00); } /* iOS can't preload audio and fetch the total duration until the track starts to play. So we make duration invisisble and make it visible on desktops or (via jQuery) when the track is clicked and playing */ #durationstacks_in_575 { visibility: hidden; } #durationstacks_in_575.showDuration { visibility: visible; } #playlisterPlayliststacks_in_575 { background-color: rgba(255, 255, 255, 1.00); list-style-type: none; margin: 0; padding: 0px; position: relative; z-index: 1; /* Start either displayed or hidden */ display: block; overflow: hidden; border-top-left-radius: 0px; border-top-right-radius: 0px; border-bottom-right-radius: 5px; border-bottom-left-radius: 5px; -webkit-column-count: 1; -moz-column-count: 1; column-count: 1; -webkit-column-gap: 0px; -moz-column-gap: 0px; column-gap: 0px; -webkit-column-rule: 0px solid #CDCDCD; -moz-column-rule: 0px solid #CDCDCD; column-rule: 0px solid #CDCDCD; /* Hide top-most item borders */ margin-top: -0px } @media screen and (min-width: 34em) { #playlisterPlayliststacks_in_575 { -webkit-column-count: 2; -moz-column-count: 2; column-count: 2; } } @media screen and (min-width: 48em) { #playlisterPlayliststacks_in_575 { -webkit-column-count: 3; -moz-column-count: 3; column-count: 3; } } @media screen and (min-width: 62em) { #playlisterPlayliststacks_in_575 { -webkit-column-count: 3; -moz-column-count: 3; column-count: 3; } } @media screen and (min-width: 75em) { #playlisterPlayliststacks_in_575 { -webkit-column-count: 3; -moz-column-count: 3; column-count: 3; } } #playlisterPlayliststacks_in_575 li { display: block; width: 100%; margin: 0; padding: 0; background: rgba(255, 255, 255, 1.00); color: rgba(153, 153, 153, 1.00); font-size: 18px; height: 45px; line-height: 45px; cursor: pointer; transition: color 300ms ease-in-out, background 300ms ease-in-out; overflow: hidden; position: relative; -webkit-column-break-inside: avoid; break-inside: avoid; transform: translateZ(0); border-top: 0px solid #CDCDCD; } #playlisterPlayliststacks_in_575 li:hover { background: rgba(234, 234, 234, 1.00); } #playlisterPlayliststacks_in_575 li.active-playlistitem, #playlisterPlayliststacks_in_575 li.active-playlistitem:hover { font-weight: normal; color: rgba(0, 0, 0, 1.00); background: rgba(102, 204, 255, 0.18); } #playlisterPlayliststacks_in_575 li { padding-left: 0; } #playlisterPlayliststacks_in_575 li .playlistItemNumber { display: inline-block; width: 35px; text-align: right; margin: 0 10px 0 0; padding: 0; } #playlisterPlayliststacks_in_575 li .playListerAdditionalInfo { display: none; } #playlisterPlayliststacks_in_575 li .playlistItemActiveIcon { display: none; } .no-audio #playlisterstacks_in_575, .no-audio #playlisterPlayliststacks_in_575 { display: none; } #playlisterNoAudiostacks_in_575 { display: none; } .no-audio #playlisterNoAudiostacks_in_575 { padding: 15px; display: none; } .no-adownload #downloadstacks_in_575 { display: none; } #playlisterWrapperstacks_in_575 #titlestacks_in_575 { display: none; } #playlisterWrapperstacks_in_575 #albumstacks_in_575 { display: none; } #playlisterWrapperstacks_in_575 #artiststacks_in_575 { display: none; } #playlisterWrapperstacks_in_575 #additionalInfostacks_in_575 { display: none; } #playlisterWrapperstacks_in_575 #downloadstacks_in_575 { display: none !important; } #playlisterWrapperstacks_in_575 #progressBarstacks_in_575 { display: none; } #playlisterWrapperstacks_in_575 #repeatstacks_in_575 { display: none; } #playlisterWrapperstacks_in_575 #volumeBtnstacks_in_575 { display: none; } #playlisterWrapperstacks_in_575 #shufflestacks_in_575 { display: none; } #playlisterWrapperstacks_in_575 #playlistTogglestacks_in_575 { display: none; } #playlisterPlaceholderstacks_in_575 { display: none; padding: 15px; margin: 15px; background: #ffffff; color: #000000; font-family: "Courier New", Courier, mono; } #playlisterPlaceholderstacks_in_575 audio { width: 100%; } #stacks_in_575 { background-color: rgba(255, 255, 255, 1.00); -moz-border-radius: 10px; -webkit-border-radius: 10px; border-radius: 10px; } #stacks_in_633 { padding: 20px; } #stacks_in_478>.s3_row { margin: 0 -10px; } #stacks_in_478>.s3_row>.s3_column_left { width: 33.33%; } #stacks_in_478>.s3_row>.s3_column_center { width: 33.339996%; } #stacks_in_478>.s3_row>.s3_column_right { width: 33.33%; } #stacks_in_478>.s3_row>.s3_column { padding: 0 10px; } @media only screen and (max-width: 770px) { } @media only screen and (max-width: 400px) { #stacks_in_478>.s3_row { margin: -10px 0; } #stacks_in_478>.s3_row>.s3_column { padding: 10px 0; width:100%; } } #stacks_out_485 { width: 82%; } #stacks_out_482 { width: 48%; } #stacks_out_479 { width: 68%; }