/* v1.2 in layout.css */ /* * There is a little dynamic sizing. This allows the scruber to shrink horizontally * */ .tpControls .tpRow * { flex-shrink: 0; } .tpControls .tpRow { --control-size: 102px; } /* * Setting display flex because it defaults to block and the scrubber contents will be stacked * vertically. The Flex-shrink was added to indicate that we want the Scrubber-Track to shrink * Everything else is set to shrink 0. This is because images are not dynamic in this release * because we don't want them to grow larger than the space allowed and smaller than readable. */ .tpControls .tpRow .tpScrubber .tpScrubberTrack, .tpControls .tpRow .tpScrubber { display: flex; flex-shrink: 1; } .tpControls .tpRow .tpScrubber .tpTimeInfo { flex-shrink: 0; } .tpPlayer { /* Default Skin colors */ /* Background color gives us a little darker background in contrast with the Row Color */ --background-color: rgb(0, 0, 0, .5); --row-color: rgb(0, 0, 0, .8); --play-overlay-color: ; --control-frame-color: rgb(150, 150, 150); --control-background-color: var(--row-color); --control-hover-color: rgba(61, 66, 111, 1); --scrub-track-color: rgb(127, 128, 160, .8); --play-progress-color: #0a091c; --expander-color: rgb(26, 29, 49); --expander-hover-color: rgb(36, 40, 66); --expander-selected-color: rgb(36, 40, 66); --tooltip-text-only-width: 80px; } .tpPlayerView { font-family: "NBCSN_FrankRegular", "Source Sans Pro", Helvetica, sans-serif; border-radius: 4px; background-color: #000; background-color: var(--row-color); --play-background-size: 43px; --control-row-button-size: 43px; --control-color: #7f80a0; --control-selected-color: rgba(255, 255, 255, 0.6); --media-margin-left: 0; --media-margin-right: 0; --play-overlay-icon: url('data:image/png;base64,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'); --play-overlay-medium-icon: url('data:image/png;base64,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'); --play-overlay-small-icon: url('data:image/png;base64,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'); --play-icon: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAFYAAABWCAMAAABiiJHFAAAABGdBTUEAALGPC/xhBQAAAAFzUkdCAK7OHOkAAABRUExURUdwTP3HIvzII/zHIv3NJ/3JJP3KJP/MJ/3LJf3II+24IfzLJf3RKfu+HPzEIPzII/zFIf3TK/zOJ/vBHhYVJ5x+JTgvJsOcJFlJJYxxJHReJcbHULgAAAALdFJOUwCQyLnqptYqUHH6PErxxgAABNJJREFUWMOtmeuaoyAMhqv1gFURpc7M7v1f6CLnQALtdNNp59/7xI/kI+DtVo2RTc19GLpl6bqh7Sc23j6NkfXdbmJRH/1f4fvpE/R030MsOg71p7/DL8ljv2NQ9T2uUL939inUYk2yIVr2H6CHpgLuMbwhxbTD8MlC5HzM83z0r6Y6ZMzdJgtS1VTF7dhvUt0dFAo7H4Z6RVOn9hh01yWA5WqipvDYplSr65EUAaDOcze+IeuV635cn2S1LkkDc1OfksBjl+Xq6xVKEOe6KawK9jp1x6nx428aXOKmCuygDSIoyNVA1S+hb4sxL12PpAqAriEEym12StiFljUCi020OZUR0LSyYGFFuV7fprpcwAYWorR8GZhsN5Eu251MdlloCRxUaKoQvKtKsC9uIyAVSDXYBIcydFgRuM1gwVs2LgKT7BUjXQWgDQgf2ABXkQ2Yt2Syi/as/Sh5VqKAcNlyzgiL9Z61UP4KJBCAKvgdTTZAi7mC59+csFyFV3dC/BUuVeavMyzXIIGKHjUDKys07dRfYRVEuXIuuW0wzAZguWL+Gq/WBrhTqgHu2vNMuEtUWBoq5JWsvEObjbatWNfH19dJKhAkkCZV6VTAFIi55/P5/PkmS2Czjy+MsFIFi+yA3LYu7PP595EpIOJkDVLnK5vQuEvsWWCxDPaplUhS9VypNTC5Sjk4aRfQBnC5LFaBv0EZBKirLIeVTlpjg2YeSP3VYy8lcB/wRWCCq0Zb9JCBz6+6tiKsUiLrWLtYAarXbIQ+iPhrjL2UCL0VSSB5RF2bqxCWnVgs0wgQ65SITMs9fwD3N2bm18JMmGKfz1OEypIu1wBdVZ8xanbxTZtjlRLC+2smgeIq7FLzVwRrEg6VBaGrbFW2NX9FsV/xakkJsetgs02OMMBfUeyPzzXlrlJjd8xeYzPEsD8PJas3l0SDdW1NtsX59cRWjEf+mkJXs2SV+TXD/pEuVZ6marH9bcy6IJ1fz+z5g6w8k1VHo7ClY8H1PZGK5cL2AOd5ruuqdrPCSGj89YTPH7YtXNcr1PbQHfTRKBFBP3+kAMCuEVcZ450cNa1jn/HzbxE3oYZkH9d+XptfLfYPGDLS1bpa1mOvHX0kR00bp3/+LZhLRo2SXfX80VXm12/t3WHKQJoAUlc93PWV+VWckb8Gz+LoYl1hDhCsNr9GWwzhrzDs+aErza8i7Iac9FcItgNuU5pf3aS5lfwVxOCOeoX5VfhTDC/4K4jJn/Xo+XXzqZb8NY5HOJnS8ysYikl/RZNVYz41v+YjvKSbK0nWqpvPr9uWuADlr3iyqiUwBUR86Izn14IEAzxLd8g5NoxZyfxKQrXTgru6vAyyEwztrz6yC8c+vh+Ax7hsfqV0TSXQBx5YBO7mAZ1fsRKI2hZcqxBnQ0qCtVIF/gZkxk5G2l9lOsCiVOJidEKOcSZVIUv+Si2XvwTx/hrdD5jW4rXKWu/03WWD3Q/kPYCB78WrZpss6Fkpq12wVm7ImUj9Vdb8tbBa8c2wzZUaChHo45VL916IGFr3gfa1dw+soyYitLmml99nNLw+urgKGN96+2I3rkrBtuztd0V1Xdv3X0Ep8DSU/PXR/PpV3NgMuK6Pnt0+ipE1bQdKoP3slSGEs0kFYy++3/wH8NVYJvhZJN4AAAAASUVORK5CYII='); --pause-icon: url('data:image/svg+xml;charset=utf-8;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiPz4NCjxzdmcgd2lkdGg9IjMycHgiIGhlaWdodD0iMzJweCIgdmlld0JveD0iMCAwIDMyIDMyIiB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiPg0KICAgIDwhLS0gR2VuZXJhdG9yOiBTa2V0Y2ggNDkuMiAoNTExNjApIC0gaHR0cDovL3d3dy5ib2hlbWlhbmNvZGluZy5jb20vc2tldGNoIC0tPg0KICAgIDx0aXRsZT5QbGF5ZXIvQnV0dG9uL0ljb24vUGF1c2U8L3RpdGxlPg0KICAgIDxkZXNjPkNyZWF0ZWQgd2l0aCBTa2V0Y2guPC9kZXNjPg0KICAgIDxkZWZzPjwvZGVmcz4NCiAgICA8ZyBpZD0iUGxheWVyL0J1dHRvbi9JY29uL1BhdXNlIiBzdHJva2U9Im5vbmUiIHN0cm9rZS13aWR0aD0iMSIgZmlsbD0ibm9uZSIgZmlsbC1ydWxlPSJldmVub2RkIj4NCiAgICAgICAgPHBhdGggZD0iTTksNyBMMTMsNyBMMTMsMjUgTDksMjUgTDksNyBaIE0xOSw3IEwyMyw3IEwyMywyNSBMMTksMjUgTDE5LDcgWiIgaWQ9IkNvbWJpbmVkLVNoYXBlIiBmaWxsPSIjRkZGRkZGIj48L3BhdGg+DQogICAgPC9nPg0KPC9zdmc+'); --jumpback-icon: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABcAAAAXCAYAAADgKtSgAAAAAXNSR0IArs4c6QAAAjVJREFUSA2llU1IFVEUx+eV3wtdKKZI9pRAXUibMCQFFQIRaVF7N4EQLcKdLtSNqxIXQriMENuJoCYoQQgughQ34sqPAsnCRMNvRJ+/M9wzXObNvC70hx/n3PP1Zu67M+N5DkqlUndgGp46lLuXMLAdfoPopXun592KK2ZQDgyTn4NSU5cdV+8cZ2glLEOUDgiuwhuodh6qhTQ9hiP4l64o+AhF2utkabgP4asfJ9YPU3AJqk2cB06DtYgGf9+x12ZK8IeyroAJExfzE8q019nSpCfmRbiJXA+oFnFiD0m4N1jTVAQ5QcByiI+BqtNK/b/L1ALYN9MXnCfSkITX0oBtg3eGPnsIsbegKpRcxv2hsoSaSXguxagZzmAavoCtJWvhn/9gOINqId8q8BKJxB/Wr6xYMX4CWuA22PphLZLi+8MZ2oC/Dmv4eZKI0QbxU5DaT9T6t29q7QfpUGJ65WLliqrhCcRpnsQAdzSO3YW7VmGN5W+Jn2UCK1jZS9mWDpiBKA0R/MsVf8fKVW+Cqss4v7A7GvQtDZMgOoZ7msSXd/kzWWPzoRt6IWnVtLJWDWo8sGSaNIv9BrlBMoNDXTnsgugEol8BJIalwugr1t7TtJ8g/xC2QaVbk1Yrt50Fn7USewjycNSBf/SwufAI3sMFqEbTJ4YiVGbDiHZYVl6x8rnTN6Sm5AfsZyE0MWJJgzzqsyAfhCidE/wA9RHtfkjOdkbRXEVBI4gtBTlm27DIed/DxuoG1H167vok7OEAAAAASUVORK5CYII='); --jumpforward-icon: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABcAAAAXCAYAAADgKtSgAAAAAXNSR0IArs4c6QAAAjBJREFUSA2Vlc1LlFEUh321/Ng0i8pRYnQagnIRbgwXFZaLCkGE/oBZRRCziHa5SFy08mMhUpsWEkOuEkESKVuJUCDoyllpKkHDROIYpUXk9JzhnuE2XN+584OHc+75mvt+3ampqUKFQmEA5iBaRZtfKUMfgCgHtyt11VYqKMvXm3UzdoEfGIOTZTV+SxoTMAJrsAcurRBs85tIFcURmIa/UEnfKbjqNZzCTti0Jv7Bn4UnkLbi4squL/gObqH4i3QZvcKe02Z8faBH+P73m+JaWALVIx2qlsQ9kDfljsa8LA39oHruaiJZDxFXLjRG0zszeRfbFFpcTVJ2YwaLGbF7WcfhocSwvfDMMGjXufwTJpiwksvqM+QM/gz8hAm4DoewCPsQKv1C41bVjvpBEHzDT+kaexoCuAF18J/YTBNc0qAOz2sAG/bANsgfQAbmGXQKWxR+I846ZPCvSFCHf5KF0UV1HPYtsSGuKI3NQsyquYV/HuTKinP1nn8mkAM5SpPwAlx6SnCfnW1jZdeboOozjlzZqgaLloZhUN3UJIEo3JU1Vu7pfXgMcaumnfUPEL3WeMkSlE//QLIoC62lZIhDXQPIGaO65iwnm9QK7BZ0OQtNkHwMPoJqNKxeLn1SK7G/YQq6oUEasXXQAaOQB9V7HH2Gx/8GRSmQwbbkJJRDS47gco0T8P9HovgyvIRf4JL8kbyB0sMv3668k6Gi+SwFPZAAOdu/whZ84H0Xe6z+AX3SfFEkncasAAAAAElFTkSuQmCC'); --cc-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' width='21' height='21' viewBox='0 0 21 21'%3E%3Cdefs%3E%3Cpath id='rk0cvburca' d='M17 0c1.657 0 3 1.343 3 3v14c0 1.657-1.343 3-3 3H3c-1.657 0-3-1.343-3-3V3c0-1.657 1.343-3 3-3h14zM5.452 5C3.245 5 1.5 7.012 1.5 10.232c0 3.244 1.588 5.268 4.206 5.268 2.097 0 3.564-1.561 3.794-4.134H6.99l-.02.167c-.123.88-.513 1.528-1.3 1.528-1.322 0-1.564-1.317-1.564-2.72 0-1.926.546-2.902 1.455-2.902.824 0 1.333.598 1.418 1.634h2.46l-.023-.244C9.145 6.416 7.798 5 5.452 5zm9.006 0c-2.21 0-3.958 2.012-3.958 5.232 0 3.244 1.59 5.268 4.212 5.268 2.1 0 3.557-1.561 3.788-4.134H16l-.021.167c-.126.88-.527 1.528-1.315 1.528-1.323 0-1.554-1.317-1.554-2.72 0-1.926.546-2.902 1.457-2.902.813 0 1.335.598 1.408 1.634h2.476l-.023-.244C18.156 6.416 16.808 5 14.458 5z'/%3E%3C/defs%3E%3Cg fill='none' fill-rule='evenodd'%3E%3Cg%3E%3Cg%3E%3Cg transform='translate(-1158 -648) translate(0 607) translate(1158.422 41.031)'%3E%3Cmask id='nhmfqpi3pb' fill='%23fff'%3E%3Cuse xlink:href='%23rk0cvburca'/%3E%3C/mask%3E%3Cuse fill='%23FFF' xlink:href='%23rk0cvburca'/%3E%3Cg fill='%23FFF' fill-rule='nonzero' mask='url(%23nhmfqpi3pb)'%3E%3Cpath d='M0 0H20V20H0z'/%3E%3C/g%3E%3C/g%3E%3C/g%3E%3C/g%3E%3C/g%3E%3C/svg%3E%0A"); --volume-icon: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABcAAAAWCAYAAAArdgcFAAAAAXNSR0IArs4c6QAAAapJREFUOBGtk88rRFEUx997KL9KKWEjJNayMiVFZDGbKdnbSNnaW8hCmn9AslCKLPkH/EgpNQtlZScpNkrTMOH5nOu8yXvzNPc9c+oz59473/M9d9474ziW4ft+I2zBqWWJnQzDHjgDiRe7KgsVZhl4EFeN+phjtgLlwDXOnLMGmIcWi7s6jghhD+IidHMEg/AG95CrasBhJ8jPn4AZKMBfETIXM4RDcAyfsFBpwGYMimAbxhxxB+RhVht4rA/gHQZMAxZrkCQC826KbrRwUxu0sX+C7cB8QwW2KfRYKFrVwnFtsM7eaDwOfNMl/Uee0kfIqkWBLI+sScy/9DBVcl1XLvcK7WpQ1Oz9++bccBKzYbhU0xFyWRDzkh4mSpg2g7zIEziHIzVYJF+YX4RgFEpgG8G09FNwBzKOrWJMXgaJaW1kDns5mIMs5CAYMZZVEZoWNXVRLcEH/IxhxT2yQCDzeghxETJHIP/uKxXukOVR1w6EMsNym98RNe/iy33I1HaMKCiagmcIImQekSff4toH1+peX3O5DsYyertwm/x6lhWY270wS7/Usm/HubOfJPHcagAAAABJRU5ErkJggg=='); --muted-icon: url('data:image/svg+xml;charset=utf-8;base64,PHN2ZyBpZD0iTGF5ZXJfMSIgZGF0YS1uYW1lPSJMYXllciAxIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIiB2aWV3Qm94PSIwIDAgMjMuMzcgMjIuOTEiPg0KICA8ZGVmcz4NCiAgICA8c3R5bGU+DQogICAgICAuY2xzLTEsIC5jbHMtMiwgLmNscy02LCAuY2xzLTcgew0KICAgICAgICBmaWxsOiBub25lOw0KICAgICAgfQ0KDQogICAgICAuY2xzLTEgew0KICAgICAgICBjbGlwLXJ1bGU6IGV2ZW5vZGQ7DQogICAgICB9DQoNCiAgICAgIC5jbHMtMiB7DQogICAgICAgIGZpbGwtcnVsZTogZXZlbm9kZDsNCiAgICAgIH0NCg0KICAgICAgLmNscy0zIHsNCiAgICAgICAgY2xpcC1wYXRoOiB1cmwoI2NsaXAtcGF0aCk7DQogICAgICB9DQoNCiAgICAgIC5jbHMtNCB7DQogICAgICAgIGNsaXAtcGF0aDogdXJsKCNjbGlwLXBhdGgtMik7DQogICAgICB9DQoNCiAgICAgIC5jbHMtNSB7DQogICAgICAgIGZpbGw6ICNmZmY7DQogICAgICB9DQoNCiAgICAgIC5jbHMtNiwgLmNscy03IHsNCiAgICAgICAgc3Ryb2tlOiAjZmZmOw0KICAgICAgICBzdHJva2UtbWl0ZXJsaW1pdDogMTA7DQogICAgICB9DQoNCiAgICAgIC5jbHMtNiB7DQogICAgICAgIHN0cm9rZS13aWR0aDogNC45MXB4Ow0KICAgICAgfQ0KDQogICAgICAuY2xzLTcgew0KICAgICAgICBzdHJva2UtbGluZWNhcDogc3F1YXJlOw0KICAgICAgICBzdHJva2Utd2lkdGg6IDJweDsNCiAgICAgIH0NCiAgICA8L3N0eWxlPg0KICAgIDxjbGlwUGF0aCBpZD0iY2xpcC1wYXRoIiB0cmFuc2Zvcm09InRyYW5zbGF0ZSgtMjUuMDUgLTI0LjU1KSI+DQogICAgICA8cGF0aCBjbGFzcz0iY2xzLTEiIGQ9Ik0yOC43MywzMiwyNy41LDMzLjIzSDMybC4zNi0uMzYsNS01TDM2LjUsMjd2MS4yM2gxVjI3SDM2LjI3VjQ1SDM3LjVWNDMuNzdoLTFWNDVsLjg3LS44Ny01LTVMMzIsMzguNzdIMjcuNUwyOC43Myw0MFptLTIuNDYsMHY5LjIzSDMxLjVsLS44Ny0uMzYsNSw1LC4zNi4zNmgyLjc0VjI1Ljc3SDM2bC0uMzYuMzYtNSw1LC44Ny0uMzZIMjYuMjdaTTYuMjcsNS43N0g1OC43M1Y2Ni4yM0g2LjI3WiIvPg0KICAgIDwvY2xpcFBhdGg+DQogICAgPGNsaXBQYXRoIGlkPSJjbGlwLXBhdGgtMiIgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoLTI1LjA1IC0yNC41NSkiPg0KICAgICAgPHBvbHlnb24gY2xhc3M9ImNscy0xIiBwb2ludHM9IjI3LjUgMzIgMjcuNSA0MCAzMS41IDQwIDM2LjUgNDUgMzcuNSA0NSAzNy41IDI3IDM2LjUgMjcgMzEuNSAzMiAyNy41IDMyIi8+DQogICAgPC9jbGlwUGF0aD4NCiAgPC9kZWZzPg0KICA8dGl0bGU+bXV0ZWQ8L3RpdGxlPg0KICA8ZyBjbGFzcz0iY2xzLTMiPg0KICAgIDxnIGNsYXNzPSJjbHMtNCI+DQogICAgICA8cG9seWdvbiBjbGFzcz0iY2xzLTUiIHBvaW50cz0iMi40NiA3LjQ2IDIuNDYgMTUuNDYgNi40NiAxNS40NiAxMS40NiAyMC40NSAxMi40NiAyMC40NSAxMi40NiAyLjQ2IDExLjQ2IDIuNDYgNi40NiA3LjQ2IDIuNDYgNy40NiIvPg0KICAgIDwvZz4NCiAgPC9nPg0KICA8ZyBjbGFzcz0iY2xzLTQiPg0KICAgIDxwb2x5Z29uIGNsYXNzPSJjbHMtNiIgcG9pbnRzPSIyLjQ2IDcuNDYgMi40NiAxNS40NiA2LjQ2IDE1LjQ2IDExLjQ2IDIwLjQ1IDEyLjQ2IDIwLjQ1IDEyLjQ2IDIuNDYgMTEuNDYgMi40NiA2LjQ2IDcuNDYgMi40NiA3LjQ2Ii8+DQogIDwvZz4NCiAgPGxpbmUgY2xhc3M9ImNscy03IiB4MT0iMTYuOTUiIHkxPSI4Ljk1IiB4Mj0iMjEuOTUiIHkyPSIxMy45NSIvPg0KICA8bGluZSBjbGFzcz0iY2xzLTciIHgxPSIyMS45NSIgeTE9IjguOTUiIHgyPSIxNi45NSIgeTI9IjEzLjk1Ii8+DQo8L3N2Zz4='); --fullscreen-icon: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAB4AAAAeCAYAAAA7MK6iAAAAAXNSR0IArs4c6QAABBtJREFUSA3tV02IHEUUfq/XmclOz2JyCHhQD4IoiIrgIR5UCCRxBc3BIEEliHgIihIkOQhKVgQJGjEeRAQXVFRUFBOi8QdiAmIQRJA9yOakRsSTMTjVPV092/X83ozVf9u9i+DBQwp6qt73vvde/b6qYTOyD0hGR5gpJCLBVy4TGT9LM9y9t9/nX8vKeltENkWR/YCYb4GO//kqNBFKOZBneGjsecTbVNE2CBzw4UG/d6BBlUMmTp4QRy/mQEuDmbMAI51t0VdgEf65AjQIAa3PUTPMzAybyI7Q2LDKD9M3AdEPyiMKlvr9ziJ66lbxagCW7j52sgVwAMOrMbXba5SJuEZgNhQEO+dmO181Ga6HRVF6kxP3BXibm7gYVEsRGbBzJ7BZdrYwWuHRaHyrEzkFQmNQNawEZuK3sSPPeI9Ygh6m6yNj0j0eW6+OouTOzOlI5dKCyz8GTK8Ucj0wy5+DfncbNtyXnqQbgVjeGMbJ4x5rq4ex3S3ER2GTb1jsi+8GYfc2bM7fynY6YgyqKCDGYb93F0b+oUfhiMnRy5j2gx6r11jTvSz0Drgdr8NBPhX2u1vh8w9glTgaeMkTdfdqG8QUI9+NkS8WOiKs24Ixyf4ypm3s5PuxkV5F0GLpmI+FYW8evoxymCWPA7/nKI7lCqzh4WGUPloxVDaKie0LQ5OI/3D8vp9qil9gx71ea8hvwtclBWPa0r2C7yVr7bV1XaNsjH0Szpw6xXQ/XSdhmh/2geH4CIJquvxvSpIk1yDAzW3ejLXX47uhTX8RvzgD/68ZiON0Cx4MyyZKfjfJeFu9d7rbofsJ3y/GjO+o6xtlPXO4TW5PErmqiaCBcIZNfk4j+22dN4zsxyV9qjm7zlEZyery4Wi8FTE7QRSniytZdnolS5e1A2WDOLb3UOY+AVHfY76c9Q1fIwXmmDrVnK252+u1Hlp7nZP0LGXZySi2xwO8EHapQg2yTO7WthYYPuSE3gfenSKT36+R9B8ryZNmONs9iGR8zOOwCTR3a8bzGI9lHnhfZcTcoW+u4jZhN2lPHm0kr4M4kxsynxiEvR1I+n95zNfALC6VXajf8pjWQvIccv3zU4zzOCrXEzljvZ4VJ0+VbzE8EN7DSPfA8XjqZPUvdCvo6INRNL4g5PK7G74ODKNkI5L3OYw0L7U3F19AwI25VhtMr+FZ+wgcr/vQ83bo/ALms3Z3V30X9+fEqhoUb+lDc+GGvf8mqLqZC3sLHNA+2JXGWPVdC+z7rBc3fU4uOI1zuX00kisLzdotY+SyyVl3M8tY5Hfb2LWpbqah52M8decHs52TzYwpirv4RrzPzvjduxa3dcRlIzjqUOmolXXVdnFkqvhqSQO3ToenY8Qp/nQc9XJr3aFPsUaTN1YrBwr4++xvYl1FyJ5/sxEAAAAASUVORK5CYII='); --minimizescreen-icon: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACgAAAAoCAYAAACM/rhtAAAAAXNSR0IArs4c6QAABAJJREFUWAntmFuITVEYx+cwLsnkTmYmiWhcEkYhhQd5cAl5GkriRUTyRCmpUXJ5IA8iucSLPMh4cEvGNG5TLklIKJcxMczF3Zg5ft+e+U7rrL3WPmfOMbzMV/+91vp///Wtb699W3vlxOPxInATNIJToE/OfzLG7g72gXrwCMzI4SDJmXaPxuB/nSNj9gIXzUSoV0uCMnO2PYUY5ksS3zJwDuwHAyN0MmgpOA/Wgy4uLXxfUAlCJgmeDLGtxCuKIjsg3AJLX25rtI3uqKXdoD4t8Q8BDyydNm9IgnngmjJW+Z72ZA0mJe2DlkaaeaZG6/AfLO0l9UmJbzh4Zmm0KfdgfqCn0hOUqccqG2jP1MDUj1t+aTrvWfgvlrbCiDMG3xvLr807VAaoVpPMhfRd7m/45ouQMusEiTEF2LMLFdhVjs4rIoPHwIFAFj40QZWArBKk/2zgejCh42dBj6SZczUQlYraYc1wrsuS7iWWe/q7I65QJ0CuKx8nh3gTaAHpWLoJ+mLJ6yrmTCSKpNMq8NsX1eCzSXB7VA6hKWXQcXSYBOSl+huUgcWgI6ySoM8ZcwVlHDyJxWJV3oEQrgPpXlakCctmBhNB2ip7zASTrjuCWpzJ7x9T7a/nc+bvbDfxvsP1tPkUbZnJ/sSrF539bRRne62ZDo2eTnUePhWdyMNOcCs9W1L1tvw7ONuvFqfNTOLtJF6DBki6xEJyWUZTTARdpR1h3fA9Jpj/pkZAvLEUxUAeuCjTh+R+lKjT1zkDnTPQOQMdOQO8s0aBK6AOyKIyCrKuuwvkHec0fCNAOZAVeVQs8cmvxW0w1RlMSJy3QHvtNR3sL1IwBnxFe4OhfwcSH4mkLwmOH0ROveQOhk86/M3FggQu5Av1Vir2mV8WMgOTBYPLfLxLq9wjKtXasBessnDcBuRfWKe5H/UxoCPsBUFr2gIH32Lq25m9xGomclAueQGQH+hUlumCtZrA4yOT8DnpOBK8BOlYpglK7I/A/+S6EqTDBCBPU7qWTYIyxmcwx5VLiEM4HXwCLrsAecbhSDdB2eo74ugv1A+wJJSQSSCYC+z9FKjATnOUDcZsdxZk92JvEDF8kF/clWZOiTqOpeBnuE/AHOYYvJIos0pQByTO1iBy+CB/lRtVF5QQq4HvB32XKUZ3DNg2yNRoHZHcW6ZdV5+UOKJ+c1t/6BGtMCNY9S1mwLagmy1NLe2kL5L2ga+ytIfUpyX+5UA2ply2Tc7CtRkkm0RrNIhZwvcGsgAQk4/8ItNv1vFNA/o2eEi90PRrHX4hcG0qNUmCNcC0XzRKtLOvRDMUdPf5lUfTFRRo21eimQXkhE1rlgTXAt3uEME8X5CO5hm7GOiMU43v/gNVCzpXd30YpAAAAABJRU5ErkJggg=='); --keyboardControls-icon: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 28 28'%3e%3cstyle%3e.st0%7bdisplay:none%7d.st1%7bdisplay:inline%7d.st2%7bfill:white%7d%3c/style%3e%3cg class='st0'%3e%3cpath d='M0 0h28v28H0z'/%3e%3c/g%3e%3cg class='st0'%3e%3cg class='st1'%3e%3cpath class='st2' d='M8.7 17.95h10.14v1.78H8.7zM5.91 17.95h1.78v1.78H5.91zM19.84 17.95h1.78v1.78h-1.78z'/%3e%3cg%3e%3cpath class='st2' d='M5.91 15.17h3.12v1.78H5.91zM18.5 15.17h3.12v1.78H18.5zM10.03 15.17h1.78v1.78h-1.78zM12.82 15.17h1.78v1.78h-1.78zM15.61 15.17h1.78v1.78h-1.78z'/%3e%3c/g%3e%3cg%3e%3cpath class='st2' d='M5.91 12.38h1.78v1.78H5.91zM17.05 12.38h1.78v1.78h-1.78zM14.27 12.38h1.78v1.78h-1.78zM11.48 12.38h1.78v1.78h-1.78zM8.7 12.38h1.78v1.78H8.7zM19.84 12.38h1.78v1.78h-1.78z'/%3e%3c/g%3e%3cpath class='st2' d='M22.58 10.38h-8.29c.06-.51.24-1.2.65-1.55.43-.37 1.06-.43 1.71-.5.67-.07 1.36-.14 1.91-.55 1.09-.81 1.09-2.25 1.09-2.87V4.9c0-.22-.17-.39-.39-.39s-.39.17-.39.39v.02c0 .54 0 1.67-.77 2.24-.37.28-.93.34-1.52.4-.71.07-1.52.16-2.14.68-.68.58-.88 1.58-.93 2.14H5.2c-.89 0-1.62.72-1.62 1.62v8.13c0 .89.72 1.62 1.62 1.62h17.38c.89 0 1.62-.72 1.62-1.62V12c0-.89-.73-1.62-1.62-1.62zm.84 9.75c0 .46-.37.84-.84.84H5.2c-.46 0-.84-.37-.84-.84V12c0-.46.37-.84.84-.84h17.38c.46 0 .84.37.84.84v8.13z'/%3e%3c/g%3e%3c/g%3e%3cpath class='st2' d='M7 10h1v1H7zM9 10h1v1H9zM11 10h1v1h-1zM13 10h1v1h-1zM7 13h3v1H7zM7 16h3v1H7zM11 13h1v1h-1zM13 13h1v1h-1zM15 13h1v1h-1zM17 13h3v1h-3zM17 16h3v1h-3zM15 10h1v1h-1zM17 10h1v1h-1zM19 10h1v1h-1zM11 16h5v1h-5z'/%3e%3cpath d='M22.5 18c0 .83-.6 1.5-1.35 1.5H5.85c-.74 0-1.35-.67-1.35-1.5V9c0-.82.61-1.5 1.35-1.5h15.3c.75 0 1.35.68 1.35 1.5v9z' fill='none' stroke='white' stroke-miterlimit='10'/%3e%3c/svg%3e"); --checkmark-icon: url("data:image/svg+xml;charset=utf-8;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4KPCEtLSBHZW5lcmF0b3I6IEFkb2JlIElsbHVzdHJhdG9yIDIzLjAuMiwgU1ZHIEV4cG9ydCBQbHVnLUluIC4gU1ZHIFZlcnNpb246IDYuMDAgQnVpbGQgMCkgIC0tPgo8c3ZnIHZlcnNpb249IjEuMSIgaWQ9IkxheWVyXzEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHg9IjBweCIgeT0iMHB4IgoJIHZpZXdCb3g9IjAgMCAyOCAyOCIgc3R5bGU9ImVuYWJsZS1iYWNrZ3JvdW5kOm5ldyAwIDAgMjggMjg7IiB4bWw6c3BhY2U9InByZXNlcnZlIj4KPHN0eWxlIHR5cGU9InRleHQvY3NzIj4KCS5zdDB7ZmlsbDojQTdBOUIzO30KPC9zdHlsZT4KPGc+Cgk8cG9seWdvbiBjbGFzcz0ic3QwIiBwb2ludHM9IjEzLDE4Ljc3IDguMTIsMTMuODggOS44OCwxMi4xMiAxMywxNS4yMyAxOS44NSw4LjM5IDIxLjYxLDEwLjE1IAkiLz4KPC9nPgo8L3N2Zz4="); --buffering-indicator: url('data:image/png;base64,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'); } .tpPlayerView .tpAdCountdown, .tpPlayerView .tpAdvertisementTap { font-family: "NBCSN_FrankRegular", Calibri, "Lucida Sans Unicode", "Lucida Grande", sans-serif; font-size: 14px; color: #CCC; background: var(--background-color); text-indent: 5px; text-shadow: 1px 1px 1px #383838; height: 22px; line-height: 22px; margin: 12px; border-radius: 3px; } .tpPlayerView .tpAdvertisementTap { margin: 0 12px 4px; padding: 3px 6px; } .tpBufferingIndicator { __animation: spin linear 1s infinite; width: 40px; height: 40px; background-size: contain; margin: auto; background-image: var(--buffering-indicator); background-repeat: no-repeat; position: absolute; top: 50%; left: 50%; margin-top: -20px; margin-left: -20px; } @keyframes spin { 0% { -webkit-transform: rotate(0deg); /* Chrome, Opera 15+, Safari 3.1+ */ -ms-transform: rotate(0deg); /* IE 9 */ transform: rotate(0deg); /* Firefox 16+, IE 10+, Opera */ } 100% { -webkit-transform: rotate(360deg); /* Chrome, Opera 15+, Safari 3.1+ */ -ms-transform: rotate(360deg); /* IE 9 */ transform: rotate(360deg); /* Firefox 16+, IE 10+, Opera */ } } @keyframes scaleUp { 0% { -webkit-transform: perspective(100px) translateZ(0px); -ms-transform: perspective(100px) translateZ(0px); transform: perspective(100px) translateZ(0px); } 100% { -webkit-transform: perspective(100px) translateZ(25px); -ms-transform: perspective(100px) translateZ(25px); transform: perspective(100px) translateZ(25px); } } @keyframes scaleDown { 0% { -webkit-transform: perspective(100px) translateZ(25px); -ms-transform: perspective(100px) translateZ(25px); transform: perspective(100px) translateZ(25px); } 100% { -webkit-transform: perspective(100px) translateZ(0px); -ms-transform: perspective(100px) translateZ(0px); transform: perspective(100px) translateZ(0px); } } .tpStandby .tpPlayOverlay { transform: perspective(100px) translateZ(0px); animation: scaleDown 0.3s cubic-bezier(0, 0, 0, 1); background-image: url('data:image/svg+xml;charset=utf-8;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiPz4NCjxzdmcgd2lkdGg9IjMycHgiIGhlaWdodD0iMzJweCIgdmlld0JveD0iMCAwIDMyIDMyIiB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiPg0KICAgIDwhLS0gR2VuZXJhdG9yOiBTa2V0Y2ggNDkuMiAoNTExNjApIC0gaHR0cDovL3d3dy5ib2hlbWlhbmNvZGluZy5jb20vc2tldGNoIC0tPg0KICAgIDx0aXRsZT5QbGF5ZXIvQnV0dG9uL0ljb24vUGxheTwvdGl0bGU+DQogICAgPGRlc2M+Q3JlYXRlZCB3aXRoIFNrZXRjaC48L2Rlc2M+DQogICAgPGRlZnM+DQogICAgICAgIDxwb2x5Z29uIGlkPSJwYXRoLTEiIHBvaW50cz0iOSA3IDkgMjUgMjQuNzUgMTYiPjwvcG9seWdvbj4NCiAgICA8L2RlZnM+DQogICAgPGcgaWQ9IlBsYXllci9CdXR0b24vSWNvbi9QbGF5IiBzdHJva2U9Im5vbmUiIHN0cm9rZS13aWR0aD0iMSIgZmlsbD0ibm9uZSIgZmlsbC1ydWxlPSJldmVub2RkIj4NCiAgICAgICAgPGcgaWQ9IkNvbWJpbmVkLVNoYXBlIj4NCiAgICAgICAgICAgIDx1c2UgZmlsbD0iI0ZGRkZGRiIgZmlsbC1ydWxlPSJldmVub2RkIiB4bGluazpocmVmPSIjcGF0aC0xIj48L3VzZT4NCiAgICAgICAgICAgIDxwYXRoIHN0cm9rZT0iI0ZGRkZGRiIgc3Ryb2tlLXdpZHRoPSIyLjE5ODcxNzk1IiBkPSJNMTAuMDk5MzU5LDguODk0MzkzMDQgTDEwLjA5OTM1OSwyMy4xMDU2MDcgTDIyLjUzNDE3MTEsMTYgTDEwLjA5OTM1OSw4Ljg5NDM5MzA0IFoiPjwvcGF0aD4NCiAgICAgICAgPC9nPg0KICAgIDwvZz4NCjwvc3ZnPg=='); background-image: var(--play-overlay-icon); background-color: rgba(61, 66, 111, 0.7); background-color: var(--play-overlay-color); background-size: 100%; width: 85px !important; height: 85px !important; margin-top: 15px !important; margin-left: 15px !important; border-radius: 3px; } .tpRow:not(.splitControlRack) .tpPopup.tpLeft { margin-right: 10px !important; margin-left: 20px !important; width: 20px; } .tpRow:not(.splitControlRack) .tpJumpsAndPlay { margin-right: 20px !important; } .tpRow:not(.splitControlRack) .tpCCAndFulscreen, .tpRow:not(.splitControlRack) .tpCCAndFullscreen { margin-right: 20px !important; margin-left: 10px !important; width: 110px; } /* * Here I am using media queries to dynamically size some components. * I set the default values above. Now I am choosing a smaller value * if necessary. Note that I am doing them in reverse order of the * Screen Width. */ .tpPlayer { --tpMuteSize: 20px; --tpJumpBackWidth: 24px; --cc-icon-size: 20px; --tpFullScreenMargin: auto 0 auto 0; --fullscreen-icon-size: 20px; --tpRowHeaderFontSize: 20px; --tpRowHeaderPadding: 14px 28px 10px 10px; --tpRowFontSize: 18px; } .splitControlRack .embedLink { display: none !important; } @media screen and (max-width: 960px) { .tpStandby .tpPlayOverlay { background-image: var(--play-overlay-medium-icon); width: 85px !important; } /*.tpControls .tpRow { --control-size: 50px; --play-background-size: 40px; --control-row-button-size: 44px; }*/ .tpPlayer { --tpMuteSize: 20px; } } @media screen and (max-width: 625px) { .tpControls .tpRow { --control-size: 50px; --play-background-size: 40px; --control-row-button-size: 44px; } .splitControlRack .tpPopup.tpLeft { margin-right: 10px !important; margin-left: 20px !important; width: 65px; } .splitControlRack .tpJumpsAndPlay { margin: auto !important; } .tpRow:not(.splitControlRack) .tpJumpsAndPlay { margin-right: 10px !important; } .splitControlRack .tpCCAndFulscreen, .splitControlRack .tpCCAndFullscreen { margin-right: 20px !important; margin-left: 10px !important; width: 65px; } #player .tpSubtitles { font-size: .8em; } .tpPlayer { --tpMuteSize: 20px; --tpJumpBackWidth: 23px; --cc-icon-size: 17px; } } @media screen and (max-width: 500px) { .tpStandby .tpPlayOverlay { background-image: var(--play-overlay-medium-icon); width: 60px !important; height: 60px !important; } .tpControls .tpRow { --control-size: 40px; --play-background-size: 35px; --control-row-button-size: 39px; } .splitControlRack .tpPopup.tpLeft { margin-right: 10px !important; margin-left: 20px !important; width: 65px; } .tpRow:not(.splitControlRack) .tpPopup.tpLeft { margin-right: 10px !important; margin-left: 20px !important; width: 30px; } .splitControlRack .tpJumpsAndPlay { margin: auto !important; } .tpRow:not(.splitControlRack) .tpJumpsAndPlay { margin: 0 0 0 0 !important; margin-right: 0 !important; margin-left: 0 !important; } .splitControlRack .tpCCAndFulscreen, .splitControlRack .tpCCAndFullscreen { margin-right: 20px !important; margin-left: 10px !important; width: 65px; } .tpRow:not(.splitControlRack) .tpCCAndFulscreen, .tpRow:not(.splitControlRack) .tpCCAndFullscreen { margin-right: 20px !important; margin-left: 10px !important; width: 60px; } #player .tpSubtitles { font-size: .6em; } .tpPlayer { --tpMuteSize: 20px; --tpJumpBackWidth: 23px; --cc-icon-size: 16px; --cc-fullscreen-size: 16px; --fullscreen-icon-size: 15px; --tpRowHeaderFontSize: 13px; --tpRowHeaderPadding: 1px 28px 1px 10px; --tpRowFontSize: 12px !important; --tpFullScreenMargin: auto 0px auto 0px !important; } } @media screen and (max-width: 375px) { .tpStandby .tpPlayOverlay { background-image: var(--play-overlay-small-icon); width: 40px !important; height: 40px !important; } .tpControls .tpRow { --control-size: 35px; --play-background-size: 25px; --control-row-button-size: 26px; } .splitControlRack .tpPopup.tpLeft { margin-right: 10px !important; margin-left: 20px !important; width: 65px; } .splitControlRack .tpJumpsAndPlay { margin: auto !important; } .splitControlRack .tpCCAndFulscreen, .splitControlRack .tpCCAndFullscreen { margin-right: 20px !important; margin-left: 10px !important; width: 65px; } #player .tpSubtitles { font-size: .5em; } .tpPlayer { --tpMuteSize: 15px; --tpJumpBackWidth: 23px; --cc-icon-size: 15px; --fullscreen-icon-size: 15px; --tpRowHeaderFontSize: 13px; --tpRowFontSize: 12px; } } .tpStandby .tpPlayOverlay:hover { transform: perspective(100px) translateZ(25px); animation: scaleUp 0.3s cubic-bezier(0, 0, 0, 1); } .tpControls button, .tpScrubber, .tpVolumeTrack, .tpVolumeThumb, .tpVolumeKnob, .tpVolumeLevel { cursor: pointer; } .tpPlayerView .tpControls .tpScrubber { pointer-events: auto; margin-left: 7px !important; margin-right: 7px !important; } .tpPlayerView .tpControls .tpRow~.tpRow .tpScrubber { pointer-events: auto; margin-left: 7px; } .tpPlayerView .tpControls .tpRow>*, .tpPlayerView .tpControls .tpPopup.tpLeft:first-child { margin-right: 60px; } .tpScrubber .tpScrubberTrack { background: var(--scrub-track-color); height: 3px; border-radius: 1.5px; left: unset; right: unset; top: unset; bottom: unset; width: 100%; position: relative; margin: auto 17px; } .tpScrubber .tpScrubberChapters .tpScrubberChapterMarker { background: white; width: 3px; height: 9px; border: 2px solid rgba(0, 0, 0, 0.9); } .tpScrubber .tpScrubberThumb { visibility: visible; /* to do, shouldn't have to do this */ width: auto; height: 20px; line-height: 20px; top: -24px; margin-right: 100px; } .tpRow .tpTimeInfo { margin: auto; padding-top: 2px; width: 40px; } .tpScrubber .tpScrubberProgress { text-align: right; border-radius: 1.5px; height: 4px; background-image: linear-gradient(91deg, #fdbe0f 2%, #fdbe0f) !important } .tpScrubber .tpScrubberPlayhead { background-color: #fdbe0f; width: 17px; height: 17px; display: flex; align-items: center; border-radius: 50%; border: solid 4.3px var(--white); background: white; opacity: 0; } .tpScrubber .tpScrubberPlayheadDot { background-color: #fdbe0f; width: 50%; height: 50%; border-radius: 50%; margin: 4px; border: solid 4.3px var(--white); background-image: linear-gradient(136deg, #fdbe0f 1%, #fdbe0f 100%); opacity: 0; } .tpScrubber:hover .tpScrubberPlayheadDot, .tpScrubber:active .tpScrubberPlayheadDot, .tpScrubber:hover .tpScrubberPlayhead, .tpScrubber:active .tpScrubberPlayhead { opacity: 1; } .tpMute { pointer-events: auto; } .tpControls button:hover>div, .tpControls button>div:hover { pointer-events: auto; opacity: 0.8; } .tpControls button>div { position: absolute; pointer-events: none; bottom: 0px; margin-bottom: 100%; opacity: 0; } .tpPopup>div.tpAudioTextTrackMenu { /* keep the menu open for a bit for a wide menu */ transition-delay: 0.3s; } .tpPopup.tpFocus>div.tpAudioTextTrackMenu { transition-delay: 0s; } .tpVerticalVolumeSlider { transition: 0.10s linear; width: var(--tpMuteSize); height: 80px; padding-bottom: 10px; left: 0; right: 0; margin: 0; } .tpVolumeTrack { pointer-events: auto; background: rgba(255, 255, 255, 0.25); background: var(--scrub-track-color); border-radius: 1.5px; } .tpRight.tpPopout>div.tpVolumeSlider { left: 100%; } .tpVolumeSlider .tpVolumeTrack { margin-bottom: auto; margin: auto 12px; height: 3px; } .tpVerticalVolumeSlider .tpVolumeTrack { margin: 12px auto; width: 3px; } .tpVolumeLevel, .tpVolumeThumb { margin: 0px; background: #fdbe0f !important; background: var(--play-progress-color); text-align: right; border-radius: 1.5px; } .tpVolumeSlider .tpVolumeThumb, .tpVerticalVolumeSlider .tpVolumeThumb { width: 10px; height: 10px; border-radius: 7px; background: rgba(255, 255, 255, 1.0); background: var(--play-progress-color); visibility: visible; opacity: 0; transition: opacity 100ms linear; } .tpVerticalVolumeSlider:hover .tpVolumeThumb, .tpVerticalVolumeSlider:active .tpVolumeThumb, .tpVolumeSlider:hover .tpVolumeThumb, .tpVolumeSlider:active .tpVolumeThumb { opacity: 0.8; } .tpVerticalVolumeSlider::before { display: none !important; } .tpMenu div { background: rgba(0, 0, 0, 0.6); text-align: left; } .tpControls { line-height: 38px; color: rgba(255, 255, 255, 0.6); color: var(--control-color); font-family: "NBCSN_FrankRegular", "Open Sans", sans-serif; } .tpControls a { color: rgba(255, 255, 255, 0.6); color: var(--control-color); } .tpBottomFloatRegion::before { content: ''; pointer-events: none; display: block; position: absolute; bottom: 0; left: 0; right: 0; } /* IE pseudo element isn't styled according to its parent */ .tpMouseHover:not(.tpIdle) .tpBottomFloatRegion::before, .tpHasTabFocus:not(.tpIdle) .tpBottomFloatRegion::before, .tpPlayerView .tpBottomFloatRegion.tpDisableFadeOut::before { opacity: 0.8; } .tpControls .tpSelected { background: rgb(36, 40, 66); background: var(--expander-hover-color); } .tpControls .tpSelected, .tpControls .tpSelected a, .tpControls .tpSelected div { color: rgba(255, 255, 255, 0.6); color: var(--control-selected-color); } .tpControls .tpRow { font-size: var(--tpRowFontSize); line-height: var(--tpRowFontSize); background-color: var(--row-color); width: auto; } .tpControls .tpBottomFloatRegion .tpRow { font-size: var(--tpRowFontSize); line-height: var(--tpRowFontSize); background: var(--row-color); margin-left: 0; margin-right: 0; width: auto; } .tpControls .tpRow hr { flex-shrink: 1; } .tpControls .tpBottomFloatRegion .tpRow:first-child { border-top-left-radius: 4px; border-top-right-radius: 4px; } .tpControls .tpBottomFloatRegion .tpRow:last-child { border-bottom-left-radius: 4px; border-bottom-right-radius: 4px; } /* * Only to this in wide screen. This is when you have * one tpRow and we are setting both ends */ .tpControls .tpPopup.tpLeft:first-child { margin-left: 34px; background-color: transparent; } .tpControls .tpRow>*:last-child { margin-right: 34px; } .tpControls .tpRow~.tpRow>*:last-child { margin-right: 25px; margin-left: auto; } .tpControls .tpRow~.tpRow .tpPopup.tpRight { margin: auto 0px; } /* Left and right Margin of Second Split Row*/ .tpControls .tpRow~.tpRow .tpPopup.tpLeft:first-child { margin-left: 25px; background-color: transparent; } .tpControls .tpRow~.tpRow .tpRow>*:last-child { margin-right: 25px; } .tpControls .tpRow .tpPopup, .tpControls .tpRow .tpPopout { margin: auto; } .tpControls .tpRow .tpPopup button, .tpControls .tpRow .tpPopout button { margin: 0; } .tpControls .tpRow button { color: white; background-color: rgba(61, 66, 111, 1); background-color: transparent; width: var(--control-row-button-size); height: var(--control-row-button-size); outline: none; border-radius: 2px; padding: 0; margin: auto; opacity: 0.8; } .tpControls .tpRow button:hover { opacity: 0.8; } .tpControls .tpRow button::before { content: ''; display: block; position: absolute; top: 0; left: 0; bottom: 0; right: 0; background-repeat: no-repeat; background-position: 4px center; background-color: transparent; background-size: 20px 20px; } .tpControls button { background-color: rgba(61, 66, 111, 1); background-color: transparent; } .tpControls button:hover { color: rgba(61, 66, 111, 1); color: var(--control-hover-color); } .tpControls button:active { color: rgba(61, 66, 111, 1); color: var(--control-hover-color); } .tpControls button.tpPlayPause::before { background-image: url('data:image/svg+xml;charset=utf-8;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiPz4NCjxzdmcgd2lkdGg9IjMycHgiIGhlaWdodD0iMzJweCIgdmlld0JveD0iMCAwIDMyIDMyIiB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiPg0KICAgIDwhLS0gR2VuZXJhdG9yOiBTa2V0Y2ggNDkuMiAoNTExNjApIC0gaHR0cDovL3d3dy5ib2hlbWlhbmNvZGluZy5jb20vc2tldGNoIC0tPg0KICAgIDx0aXRsZT5QbGF5ZXIvQnV0dG9uL0ljb24vUGxheTwvdGl0bGU+DQogICAgPGRlc2M+Q3JlYXRlZCB3aXRoIFNrZXRjaC48L2Rlc2M+DQogICAgPGRlZnM+DQogICAgICAgIDxwb2x5Z29uIGlkPSJwYXRoLTEiIHBvaW50cz0iOSA3IDkgMjUgMjQuNzUgMTYiPjwvcG9seWdvbj4NCiAgICA8L2RlZnM+DQogICAgPGcgaWQ9IlBsYXllci9CdXR0b24vSWNvbi9QbGF5IiBzdHJva2U9Im5vbmUiIHN0cm9rZS13aWR0aD0iMSIgZmlsbD0ibm9uZSIgZmlsbC1ydWxlPSJldmVub2RkIj4NCiAgICAgICAgPGcgaWQ9IkNvbWJpbmVkLVNoYXBlIj4NCiAgICAgICAgICAgIDx1c2UgZmlsbD0iI0ZGRkZGRiIgZmlsbC1ydWxlPSJldmVub2RkIiB4bGluazpocmVmPSIjcGF0aC0xIj48L3VzZT4NCiAgICAgICAgICAgIDxwYXRoIHN0cm9rZT0iI0ZGRkZGRiIgc3Ryb2tlLXdpZHRoPSIyLjE5ODcxNzk1IiBkPSJNMTAuMDk5MzU5LDguODk0MzkzMDQgTDEwLjA5OTM1OSwyMy4xMDU2MDcgTDIyLjUzNDE3MTEsMTYgTDEwLjA5OTM1OSw4Ljg5NDM5MzA0IFoiPjwvcGF0aD4NCiAgICAgICAgPC9nPg0KICAgIDwvZz4NCjwvc3ZnPg=='); background-image: var(--play-icon); background-size: var(--play-background-size); background-position: center; } .tpControls .tpRow~.tpRow button.tpJumpBack, .tpControls .tpRow~.tpRow button.tpJumpForward, .tpControls .tpRow~.tpRow button.tpPlayPause { margin: auto 5px; } .tpPlaying .tpControls button.tpPlayPause::before, .tpSeeking:not(.tpPaused) .tpControls button.tpPlayPause::before { background-image: url('data:image/svg+xml;charset=utf-8;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiPz4NCjxzdmcgd2lkdGg9IjMycHgiIGhlaWdodD0iMzJweCIgdmlld0JveD0iMCAwIDMyIDMyIiB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiPg0KICAgIDwhLS0gR2VuZXJhdG9yOiBTa2V0Y2ggNDkuMiAoNTExNjApIC0gaHR0cDovL3d3dy5ib2hlbWlhbmNvZGluZy5jb20vc2tldGNoIC0tPg0KICAgIDx0aXRsZT5QbGF5ZXIvQnV0dG9uL0ljb24vUGF1c2U8L3RpdGxlPg0KICAgIDxkZXNjPkNyZWF0ZWQgd2l0aCBTa2V0Y2guPC9kZXNjPg0KICAgIDxkZWZzPjwvZGVmcz4NCiAgICA8ZyBpZD0iUGxheWVyL0J1dHRvbi9JY29uL1BhdXNlIiBzdHJva2U9Im5vbmUiIHN0cm9rZS13aWR0aD0iMSIgZmlsbD0ibm9uZSIgZmlsbC1ydWxlPSJldmVub2RkIj4NCiAgICAgICAgPHBhdGggZD0iTTksNyBMMTMsNyBMMTMsMjUgTDksMjUgTDksNyBaIE0xOSw3IEwyMyw3IEwyMywyNSBMMTksMjUgTDE5LDcgWiIgaWQ9IkNvbWJpbmVkLVNoYXBlIiBmaWxsPSIjRkZGRkZGIj48L3BhdGg+DQogICAgPC9nPg0KPC9zdmc+'); background-image: var(--pause-icon); background-size: var(--play-background-size); background-position: center; } .tpControls button.tpJumpBack, .tpControls button.tpJumpForward { width: var(--tpJumpBackWidth); height: var(--tpJumpBackWidth); } .tpControls button.tpJumpBack { margin-right: 15px; } .tpControls button.tpJumpForward { margin-left: 15px; } .tpControls button.tpJumpBack::before { margin: auto; background-image: url('data:image/svg+xml;charset=utf-8;base64,PHN2ZyBpZD0iTGF5ZXJfMSIgZGF0YS1uYW1lPSJMYXllciAxIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIiB2aWV3Qm94PSIwIDAgMjQgMjkiPg0KICA8ZGVmcz4NCiAgICA8c3R5bGU+DQogICAgICAuY2xzLTEsIC5jbHMtMyB7DQogICAgICAgIGZpbGw6IG5vbmU7DQogICAgICB9DQoNCiAgICAgIC5jbHMtMSB7DQogICAgICAgIGNsaXAtcnVsZTogZXZlbm9kZDsNCiAgICAgIH0NCg0KICAgICAgLmNscy0yIHsNCiAgICAgICAgY2xpcC1wYXRoOiB1cmwoI2NsaXAtcGF0aCk7DQogICAgICB9DQoNCiAgICAgIC5jbHMtMyB7DQogICAgICAgIHN0cm9rZTogI2ZmZjsNCiAgICAgICAgc3Ryb2tlLW1pdGVybGltaXQ6IDEwOw0KICAgICAgICBzdHJva2Utd2lkdGg6IDRweDsNCiAgICAgIH0NCg0KICAgICAgLmNscy00IHsNCiAgICAgICAgY2xpcC1wYXRoOiB1cmwoI2NsaXAtcGF0aC0yKTsNCiAgICAgIH0NCg0KICAgICAgLmNscy01IHsNCiAgICAgICAgZmlsbDogI2ZmZjsNCiAgICAgIH0NCg0KICAgICAgLmNscy02IHsNCiAgICAgICAgY2xpcC1wYXRoOiB1cmwoI2NsaXAtcGF0aC0zKTsNCiAgICAgIH0NCiAgICA8L3N0eWxlPg0KICAgIDxjbGlwUGF0aCBpZD0iY2xpcC1wYXRoIiB0cmFuc2Zvcm09InRyYW5zbGF0ZSgtMjQgLTIxKSI+DQogICAgICA8cGF0aCBjbGFzcz0iY2xzLTEiIGQ9Ik0zNiwyOEExMCwxMCwwLDEsMSwyNiwzOCIvPg0KICAgIDwvY2xpcFBhdGg+DQogICAgPGNsaXBQYXRoIGlkPSJjbGlwLXBhdGgtMiIgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoLTI0IC0yMSkiPg0KICAgICAgPHBvbHlnb24gY2xhc3M9ImNscy0xIiBwb2ludHM9IjM2IDI2IDM2IDMyIDMxIDI5IDM2IDI2Ii8+DQogICAgPC9jbGlwUGF0aD4NCiAgICA8Y2xpcFBhdGggaWQ9ImNsaXAtcGF0aC0zIiB0cmFuc2Zvcm09InRyYW5zbGF0ZSgtMjQgLTIxKSI+DQogICAgICA8cGF0aCBjbGFzcz0iY2xzLTEiIGQ9Ik0zOS41LDM4YzAtMS4zOS0uMzgtMi4wOC0xLTIuMDgtLjkzLDAtMSwxLjQ5LTEsMi4wOCwwLDEuMzkuMzgsMi4wOSwxLDIuMDlDMzkuNDMsNDAuMDgsMzkuNSwzOC41OCwzOS41LDM4Wm0uMzQtMy4wOGEyLjY2LDIuNjYsMCwwLDEsLjg2LDEuMkE1LjM1LDUuMzUsMCwwLDEsNDEsMzhhNS4zLDUuMywwLDAsMS0uMywxLjg4LDIuNjYsMi42NiwwLDAsMS0uODYsMS4yLDIuMzUsMi4zNSwwLDAsMS0yLjY4LDAsMi42NiwyLjY2LDAsMCwxLS44Ni0xLjJBNS4zLDUuMywwLDAsMSwzNiwzOGE1LjM1LDUuMzUsMCwwLDEsLjMtMS44OSwyLjY2LDIuNjYsMCwwLDEsLjg2LTEuMiwyLjM5LDIuMzksMCwwLDEsMi42OCwwWk0zMy41LDM0LjdIMzR2Ni42SDMyLjVWMzYuMmgtMVYzNC43WiIvPg0KICAgIDwvY2xpcFBhdGg+DQogIDwvZGVmcz4NCiAgPHRpdGxlPmp1bXBiYWNrPC90aXRsZT4NCiAgPGcgY2xhc3M9ImNscy0yIj4NCiAgICA8cGF0aCBjbGFzcz0iY2xzLTMiIGQ9Ik0zNiwyOEExMCwxMCwwLDEsMSwyNiwzOCIgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoLTI0IC0yMSkiLz4NCiAgPC9nPg0KICA8ZyBjbGFzcz0iY2xzLTQiPg0KICAgIDxyZWN0IGNsYXNzPSJjbHMtNSIgeD0iMiIgd2lkdGg9IjE1IiBoZWlnaHQ9IjE2Ii8+DQogIDwvZz4NCiAgPGcgY2xhc3M9ImNscy02Ij4NCiAgICA8cmVjdCBjbGFzcz0iY2xzLTUiIHg9IjIuNSIgeT0iOC41IiB3aWR0aD0iMTkuNSIgaGVpZ2h0PSIxNyIvPg0KICA8L2c+DQo8L3N2Zz4='); background-image: var(--jumpback-icon); background-size: 23px; background-position: center; } .tpControls button.tpJumpForward::before { margin: auto; background-image: url(data:image/svg+xml;charset=utf-8;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz48c3ZnIHZlcnNpb249IjEuMSIgaWQ9IkxheWVyXzEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHg9IjBweCIgeT0iMHB4IiB2aWV3Qm94PSIwIDAgMjQgMjkiIHN0eWxlPSJlbmFibGUtYmFja2dyb3VuZDpuZXcgMCAwIDI0IDI5OyIgeG1sOnNwYWNlPSJwcmVzZXJ2ZSI+PHN0eWxlIHR5cGU9InRleHQvY3NzIj4uc3Qwe2NsaXAtcGF0aDp1cmwoI1NWR0lEXzJfKTt9LnN0MXtmaWxsOm5vbmU7c3Ryb2tlOiNGRkZGRkY7c3Ryb2tlLXdpZHRoOjQ7c3Ryb2tlLW1pdGVybGltaXQ6MTA7fS5zdDJ7Y2xpcC1wYXRoOnVybCgjU1ZHSURfNF8pO30uc3Qze2ZpbGw6I0ZGRkZGRjt9LnN0NHtjbGlwLXBhdGg6dXJsKCNTVkdJRF82Xyk7fTwvc3R5bGU+PHRpdGxlPmp1bXBiYWNrPC90aXRsZT48Zz48Zz48ZGVmcz48cGF0aCBpZD0iU1ZHSURfMV8iIGQ9Ik0yMiwxN2MwLDUuNS00LjUsMTAtMTAsMTBTMiwyMi41LDIsMTdTNi41LDcsMTIsNyIvPjwvZGVmcz48Y2xpcFBhdGggaWQ9IlNWR0lEXzJfIj48dXNlIHhsaW5rOmhyZWY9IiNTVkdJRF8xXyIgIHN0eWxlPSJvdmVyZmxvdzp2aXNpYmxlOyIvPjwvY2xpcFBhdGg+PGcgY2xhc3M9InN0MCI+PHBhdGggY2xhc3M9InN0MSIgZD0iTTIyLDE3YzAsNS41LTQuNSwxMC0xMCwxMFMyLDIyLjUsMiwxN1M2LjUsNywxMiw3Ii8+PC9nPjwvZz48L2c+PGc+PGc+PGRlZnM+PHBvbHlnb24gaWQ9IlNWR0lEXzNfIiBwb2ludHM9IjE3LDggMTIsMTEgMTIsNSAiLz48L2RlZnM+PGNsaXBQYXRoIGlkPSJTVkdJRF80XyI+PHVzZSB4bGluazpocmVmPSIjU1ZHSURfM18iICBzdHlsZT0ib3ZlcmZsb3c6dmlzaWJsZTsiLz48L2NsaXBQYXRoPjxnIGNsYXNzPSJzdDIiPjxyZWN0IHg9IjciIGNsYXNzPSJzdDMiIHdpZHRoPSIxNSIgaGVpZ2h0PSIxNiIvPjwvZz48L2c+PC9nPjxnPjxnPjxkZWZzPjxwYXRoIGlkPSJTVkdJRF81XyIgZD0iTTE1LjUsMTdjMC0xLjQtMC40LTIuMS0xLTIuMWMtMC45LDAtMSwxLjUtMSwyLjFjMCwxLjQsMC40LDIuMSwxLDIuMUMxNS40LDE5LjEsMTUuNSwxNy42LDE1LjUsMTd6IE0xNS44LDEzLjljMC40LDAuMywwLjcsMC43LDAuOSwxLjJjMC4yLDAuNiwwLjMsMS4yLDAuMywxLjljMCwwLjYtMC4xLDEuMy0wLjMsMS45Yy0wLjIsMC41LTAuNSwwLjktMC45LDEuMmMtMC44LDAuNi0xLjksMC42LTIuNywwYy0wLjQtMC4zLTAuNy0wLjctMC45LTEuMkMxMi4xLDE4LjMsMTIsMTcuNiwxMiwxN3MwLjEtMS4zLDAuMy0xLjljMC4yLTAuNSwwLjUtMC45LDAuOS0xLjJDMTQsMTMuNCwxNSwxMy40LDE1LjgsMTMuOUwxNS44LDEzLjl6IE05LjUsMTMuN0gxMHY2LjZIOC41di01LjFoLTF2LTEuNUM3LjUsMTMuNyw5LjUsMTMuNyw5LjUsMTMuN3oiLz48L2RlZnM+PGNsaXBQYXRoIGlkPSJTVkdJRF82XyI+PHVzZSB4bGluazpocmVmPSIjU1ZHSURfNV8iICBzdHlsZT0ib3ZlcmZsb3c6dmlzaWJsZTsiLz48L2NsaXBQYXRoPjxnIGNsYXNzPSJzdDQiPjxyZWN0IHg9IjIuNSIgeT0iOC41IiBjbGFzcz0ic3QzIiB3aWR0aD0iMTkuNSIgaGVpZ2h0PSIxNyIvPjwvZz48L2c+PC9nPjwvc3ZnPg==); background-image: var(--jumpforward-icon); background-size: 23px; background-position: center; } .tpControls button.tpLanguageSettings::before { margin: auto; background-image: url('data:image/svg+xml;charset=utf-8;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4KPCEtLSBHZW5lcmF0b3I6IEFkb2JlIElsbHVzdHJhdG9yIDIzLjAuMSwgU1ZHIEV4cG9ydCBQbHVnLUluIC4gU1ZHIFZlcnNpb246IDYuMDAgQnVpbGQgMCkgIC0tPgo8c3ZnIHZlcnNpb249IjEuMSIgaWQ9IkxheWVyXzEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHg9IjBweCIgeT0iMHB4IgoJIHZpZXdCb3g9IjAgMCAyOCAyOCIgc3R5bGU9ImVuYWJsZS1iYWNrZ3JvdW5kOm5ldyAwIDAgMjggMjg7IiB4bWw6c3BhY2U9InByZXNlcnZlIj4KPHN0eWxlIHR5cGU9InRleHQvY3NzIj4KCS5zdDB7ZGlzcGxheTpub25lO30KCS5zdDF7ZGlzcGxheTppbmxpbmU7fQoJLnN0MntmaWxsOiNGRkZGRkY7fQo8L3N0eWxlPgo8ZyBjbGFzcz0ic3QwIj4KCTxnIGNsYXNzPSJzdDEiPgoJCTxyZWN0IHdpZHRoPSIyOCIgaGVpZ2h0PSIyOCIvPgoJPC9nPgo8L2c+CjxnIGNsYXNzPSJzdDAiPgoJPGcgY2xhc3M9InN0MSI+CgkJPGc+CgkJCTxnPgoJCQkJPGc+CgkJCQkJPHJlY3QgeD0iOC43IiB5PSIxNy45NSIgY2xhc3M9InN0MiIgd2lkdGg9IjEwLjE0IiBoZWlnaHQ9IjEuNzgiLz4KCQkJCTwvZz4KCQkJCTxnPgoJCQkJCTxyZWN0IHg9IjUuOTEiIHk9IjE3Ljk1IiBjbGFzcz0ic3QyIiB3aWR0aD0iMS43OCIgaGVpZ2h0PSIxLjc4Ii8+CgkJCQk8L2c+CgkJCQk8Zz4KCQkJCQk8cmVjdCB4PSIxOS44NCIgeT0iMTcuOTUiIGNsYXNzPSJzdDIiIHdpZHRoPSIxLjc4IiBoZWlnaHQ9IjEuNzgiLz4KCQkJCTwvZz4KCQkJPC9nPgoJCQk8Zz4KCQkJCTxnPgoJCQkJCTxyZWN0IHg9IjUuOTEiIHk9IjE1LjE3IiBjbGFzcz0ic3QyIiB3aWR0aD0iMy4xMiIgaGVpZ2h0PSIxLjc4Ii8+CgkJCQk8L2c+CgkJCQk8Zz4KCQkJCQk8cmVjdCB4PSIxOC41IiB5PSIxNS4xNyIgY2xhc3M9InN0MiIgd2lkdGg9IjMuMTIiIGhlaWdodD0iMS43OCIvPgoJCQkJPC9nPgoJCQkJPGc+CgkJCQkJPHJlY3QgeD0iMTAuMDMiIHk9IjE1LjE3IiBjbGFzcz0ic3QyIiB3aWR0aD0iMS43OCIgaGVpZ2h0PSIxLjc4Ii8+CgkJCQk8L2c+CgkJCQk8Zz4KCQkJCQk8cmVjdCB4PSIxMi44MiIgeT0iMTUuMTciIGNsYXNzPSJzdDIiIHdpZHRoPSIxLjc4IiBoZWlnaHQ9IjEuNzgiLz4KCQkJCTwvZz4KCQkJCTxnPgoJCQkJCTxyZWN0IHg9IjE1LjYxIiB5PSIxNS4xNyIgY2xhc3M9InN0MiIgd2lkdGg9IjEuNzgiIGhlaWdodD0iMS43OCIvPgoJCQkJPC9nPgoJCQk8L2c+CgkJCTxnPgoJCQkJPGc+CgkJCQkJPHJlY3QgeD0iNS45MSIgeT0iMTIuMzgiIGNsYXNzPSJzdDIiIHdpZHRoPSIxLjc4IiBoZWlnaHQ9IjEuNzgiLz4KCQkJCTwvZz4KCQkJCTxnPgoJCQkJCTxyZWN0IHg9IjE3LjA1IiB5PSIxMi4zOCIgY2xhc3M9InN0MiIgd2lkdGg9IjEuNzgiIGhlaWdodD0iMS43OCIvPgoJCQkJPC9nPgoJCQkJPGc+CgkJCQkJPHJlY3QgeD0iMTQuMjciIHk9IjEyLjM4IiBjbGFzcz0ic3QyIiB3aWR0aD0iMS43OCIgaGVpZ2h0PSIxLjc4Ii8+CgkJCQk8L2c+CgkJCQk8Zz4KCQkJCQk8cmVjdCB4PSIxMS40OCIgeT0iMTIuMzgiIGNsYXNzPSJzdDIiIHdpZHRoPSIxLjc4IiBoZWlnaHQ9IjEuNzgiLz4KCQkJCTwvZz4KCQkJCTxnPgoJCQkJCTxyZWN0IHg9IjguNyIgeT0iMTIuMzgiIGNsYXNzPSJzdDIiIHdpZHRoPSIxLjc4IiBoZWlnaHQ9IjEuNzgiLz4KCQkJCTwvZz4KCQkJCTxnPgoJCQkJCTxyZWN0IHg9IjE5Ljg0IiB5PSIxMi4zOCIgY2xhc3M9InN0MiIgd2lkdGg9IjEuNzgiIGhlaWdodD0iMS43OCIvPgoJCQkJPC9nPgoJCQk8L2c+CgkJPC9nPgoJCTxwYXRoIGNsYXNzPSJzdDIiIGQ9Ik0yMi41OCwxMC4zOGgtOC4yOWMwLjA2LTAuNTEsMC4yNC0xLjIsMC42NS0xLjU1YzAuNDMtMC4zNywxLjA2LTAuNDMsMS43MS0wLjUKCQkJYzAuNjctMC4wNywxLjM2LTAuMTQsMS45MS0wLjU1YzEuMDktMC44MSwxLjA5LTIuMjUsMS4wOS0yLjg3VjQuOWMwLTAuMjItMC4xNy0wLjM5LTAuMzktMC4zOXMtMC4zOSwwLjE3LTAuMzksMC4zOXYwLjAyCgkJCWMwLDAuNTQsMCwxLjY3LTAuNzcsMi4yNGMtMC4zNywwLjI4LTAuOTMsMC4zNC0xLjUyLDAuNGMtMC43MSwwLjA3LTEuNTIsMC4xNi0yLjE0LDAuNjhjLTAuNjgsMC41OC0wLjg4LDEuNTgtMC45MywyLjE0SDUuMgoJCQljLTAuODksMC0xLjYyLDAuNzItMS42MiwxLjYydjguMTNjMCwwLjg5LDAuNzIsMS42MiwxLjYyLDEuNjJoMTcuMzhjMC44OSwwLDEuNjItMC43MiwxLjYyLTEuNjJWMTIKCQkJQzI0LjIsMTEuMTEsMjMuNDcsMTAuMzgsMjIuNTgsMTAuMzh6IE0yMy40MiwyMC4xM2MwLDAuNDYtMC4zNywwLjg0LTAuODQsMC44NEg1LjJjLTAuNDYsMC0wLjg0LTAuMzctMC44NC0wLjg0VjEyCgkJCWMwLTAuNDYsMC4zNy0wLjg0LDAuODQtMC44NGgxNy4zOGMwLjQ2LDAsMC44NCwwLjM3LDAuODQsMC44NEMyMy40MiwxMiwyMy40MiwyMC4xMywyMy40MiwyMC4xM3oiLz4KCTwvZz4KPC9nPgo8cGF0aCBjbGFzcz0ic3QyIiBkPSJNNiw3djExaDkuOTZMMTksMjEuOThWMThoM1Y3SDZ6IE03LDEwaDR2Mkg3VjEweiBNMTYsMTZIN3YtMmg5VjE2eiBNMjEsMTZoLTMuMDF2LTJIMjFWMTZ6IE0yMSwxMmgtOHYtMmg4VjEyegoJIi8+Cjwvc3ZnPgo='); background-image: var(--cc-icon); background-size: var(--cc-icon-size); background-position: center; } .tpControls button.tpMute { width: var(--tpMuteSize); height: var(--tpMuteSize); } .tpControls button.tpMute::before { margin: auto; background-image: url('data:image/svg+xml;charset=utf-8;base64,PHN2ZyBpZD0iTGF5ZXJfMSIgZGF0YS1uYW1lPSJMYXllciAxIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIiB2aWV3Qm94PSIwIDAgMjQuNDUgMjIuOTEiPg0KICA8ZGVmcz4NCiAgICA8c3R5bGU+DQogICAgICAuY2xzLTEsIC5jbHMtMiwgLmNscy02LCAuY2xzLTcgew0KICAgICAgICBmaWxsOiBub25lOw0KICAgICAgfQ0KDQogICAgICAuY2xzLTEgew0KICAgICAgICBjbGlwLXJ1bGU6IGV2ZW5vZGQ7DQogICAgICB9DQoNCiAgICAgIC5jbHMtMiB7DQogICAgICAgIGZpbGwtcnVsZTogZXZlbm9kZDsNCiAgICAgIH0NCg0KICAgICAgLmNscy0zIHsNCiAgICAgICAgY2xpcC1wYXRoOiB1cmwoI2NsaXAtcGF0aCk7DQogICAgICB9DQoNCiAgICAgIC5jbHMtNCB7DQogICAgICAgIGNsaXAtcGF0aDogdXJsKCNjbGlwLXBhdGgtMik7DQogICAgICB9DQoNCiAgICAgIC5jbHMtNSB7DQogICAgICAgIGZpbGw6ICNmZmY7DQogICAgICB9DQoNCiAgICAgIC5jbHMtNiwgLmNscy03IHsNCiAgICAgICAgc3Ryb2tlOiAjZmZmOw0KICAgICAgICBzdHJva2UtbWl0ZXJsaW1pdDogMTA7DQogICAgICB9DQoNCiAgICAgIC5jbHMtNiB7DQogICAgICAgIHN0cm9rZS13aWR0aDogNC45MXB4Ow0KICAgICAgfQ0KDQogICAgICAuY2xzLTcgew0KICAgICAgICBzdHJva2Utd2lkdGg6IDJweDsNCiAgICAgIH0NCiAgICA8L3N0eWxlPg0KICAgIDxjbGlwUGF0aCBpZD0iY2xpcC1wYXRoIiB0cmFuc2Zvcm09InRyYW5zbGF0ZSgtMjguNTUgLTI0LjU1KSI+DQogICAgICA8cGF0aCBjbGFzcz0iY2xzLTEiIGQ9Ik0zMi4yMywzMiwzMSwzMy4yM2g0LjUxbC4zNi0uMzYsNS01TDQwLDI3djEuMjNoMVYyN0gzOS43N1Y0NUg0MVY0My43N0g0MFY0NWwuODctLjg3LTUtNS0uMzYtLjM2SDMxTDMyLjIzLDQwWm0tMi40NiwwdjkuMjNIMzVsLS44Ny0uMzYsNSw1LC4zNi4zNmgyLjc0VjI1Ljc3SDM5LjQ5bC0uMzYuMzYtNSw1LC44Ny0uMzZIMjkuNzdaTTkuNzcsNS43N0g2Mi4yM1Y2Ni4yM0g5Ljc3WiIvPg0KICAgIDwvY2xpcFBhdGg+DQogICAgPGNsaXBQYXRoIGlkPSJjbGlwLXBhdGgtMiIgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoLTI4LjU1IC0yNC41NSkiPg0KICAgICAgPHBvbHlnb24gY2xhc3M9ImNscy0xIiBwb2ludHM9IjMxIDMyIDMxIDQwIDM1IDQwIDQwIDQ1IDQxIDQ1IDQxIDI3IDQwIDI3IDM1IDMyIDMxIDMyIi8+DQogICAgPC9jbGlwUGF0aD4NCiAgPC9kZWZzPg0KICA8dGl0bGU+dm9sdW1lPC90aXRsZT4NCiAgPGcgY2xhc3M9ImNscy0zIj4NCiAgICA8ZyBjbGFzcz0iY2xzLTQiPg0KICAgICAgPHBvbHlnb24gY2xhc3M9ImNscy01IiBwb2ludHM9IjIuNDYgNy40NiAyLjQ2IDE1LjQ2IDYuNDYgMTUuNDYgMTEuNDYgMjAuNDUgMTIuNDYgMjAuNDUgMTIuNDYgMi40NiAxMS40NiAyLjQ2IDYuNDYgNy40NiAyLjQ2IDcuNDYiLz4NCiAgICA8L2c+DQogIDwvZz4NCiAgPGcgY2xhc3M9ImNscy00Ij4NCiAgICA8cG9seWdvbiBjbGFzcz0iY2xzLTYiIHBvaW50cz0iMi40NiA3LjQ2IDIuNDYgMTUuNDYgNi40NiAxNS40NiAxMS40NiAyMC40NSAxMi40NiAyMC40NSAxMi40NiAyLjQ2IDExLjQ2IDIuNDYgNi40NiA3LjQ2IDIuNDYgNy40NiIvPg0KICA8L2c+DQogIDxwYXRoIGNsYXNzPSJjbHMtNyIgZD0iTTQ1LDQxYTcsNywwLDAsMCwwLTkuOSIgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoLTI4LjU1IC0yNC41NSkiLz4NCiAgPHBhdGggY2xhc3M9ImNscy03IiBkPSJNNDguNDksMjcuNTFhMTIsMTIsMCwwLDEsMCwxNyIgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoLTI4LjU1IC0yNC41NSkiLz4NCjwvc3ZnPg=='); background-image: var(--volume-icon); background-size: var(--tpMuteSize); background-position: center; } .tpMuted .tpControls button.tpMute::before { margin: auto; background-image: url('data:image/svg+xml;charset=utf-8;base64,PHN2ZyBpZD0iTGF5ZXJfMSIgZGF0YS1uYW1lPSJMYXllciAxIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIiB2aWV3Qm94PSIwIDAgMjMuMzcgMjIuOTEiPg0KICA8ZGVmcz4NCiAgICA8c3R5bGU+DQogICAgICAuY2xzLTEsIC5jbHMtMiwgLmNscy02LCAuY2xzLTcgew0KICAgICAgICBmaWxsOiBub25lOw0KICAgICAgfQ0KDQogICAgICAuY2xzLTEgew0KICAgICAgICBjbGlwLXJ1bGU6IGV2ZW5vZGQ7DQogICAgICB9DQoNCiAgICAgIC5jbHMtMiB7DQogICAgICAgIGZpbGwtcnVsZTogZXZlbm9kZDsNCiAgICAgIH0NCg0KICAgICAgLmNscy0zIHsNCiAgICAgICAgY2xpcC1wYXRoOiB1cmwoI2NsaXAtcGF0aCk7DQogICAgICB9DQoNCiAgICAgIC5jbHMtNCB7DQogICAgICAgIGNsaXAtcGF0aDogdXJsKCNjbGlwLXBhdGgtMik7DQogICAgICB9DQoNCiAgICAgIC5jbHMtNSB7DQogICAgICAgIGZpbGw6ICNmZmY7DQogICAgICB9DQoNCiAgICAgIC5jbHMtNiwgLmNscy03IHsNCiAgICAgICAgc3Ryb2tlOiAjZmZmOw0KICAgICAgICBzdHJva2UtbWl0ZXJsaW1pdDogMTA7DQogICAgICB9DQoNCiAgICAgIC5jbHMtNiB7DQogICAgICAgIHN0cm9rZS13aWR0aDogNC45MXB4Ow0KICAgICAgfQ0KDQogICAgICAuY2xzLTcgew0KICAgICAgICBzdHJva2UtbGluZWNhcDogc3F1YXJlOw0KICAgICAgICBzdHJva2Utd2lkdGg6IDJweDsNCiAgICAgIH0NCiAgICA8L3N0eWxlPg0KICAgIDxjbGlwUGF0aCBpZD0iY2xpcC1wYXRoIiB0cmFuc2Zvcm09InRyYW5zbGF0ZSgtMjUuMDUgLTI0LjU1KSI+DQogICAgICA8cGF0aCBjbGFzcz0iY2xzLTEiIGQ9Ik0yOC43MywzMiwyNy41LDMzLjIzSDMybC4zNi0uMzYsNS01TDM2LjUsMjd2MS4yM2gxVjI3SDM2LjI3VjQ1SDM3LjVWNDMuNzdoLTFWNDVsLjg3LS44Ny01LTVMMzIsMzguNzdIMjcuNUwyOC43Myw0MFptLTIuNDYsMHY5LjIzSDMxLjVsLS44Ny0uMzYsNSw1LC4zNi4zNmgyLjc0VjI1Ljc3SDM2bC0uMzYuMzYtNSw1LC44Ny0uMzZIMjYuMjdaTTYuMjcsNS43N0g1OC43M1Y2Ni4yM0g2LjI3WiIvPg0KICAgIDwvY2xpcFBhdGg+DQogICAgPGNsaXBQYXRoIGlkPSJjbGlwLXBhdGgtMiIgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoLTI1LjA1IC0yNC41NSkiPg0KICAgICAgPHBvbHlnb24gY2xhc3M9ImNscy0xIiBwb2ludHM9IjI3LjUgMzIgMjcuNSA0MCAzMS41IDQwIDM2LjUgNDUgMzcuNSA0NSAzNy41IDI3IDM2LjUgMjcgMzEuNSAzMiAyNy41IDMyIi8+DQogICAgPC9jbGlwUGF0aD4NCiAgPC9kZWZzPg0KICA8dGl0bGU+bXV0ZWQ8L3RpdGxlPg0KICA8ZyBjbGFzcz0iY2xzLTMiPg0KICAgIDxnIGNsYXNzPSJjbHMtNCI+DQogICAgICA8cG9seWdvbiBjbGFzcz0iY2xzLTUiIHBvaW50cz0iMi40NiA3LjQ2IDIuNDYgMTUuNDYgNi40NiAxNS40NiAxMS40NiAyMC40NSAxMi40NiAyMC40NSAxMi40NiAyLjQ2IDExLjQ2IDIuNDYgNi40NiA3LjQ2IDIuNDYgNy40NiIvPg0KICAgIDwvZz4NCiAgPC9nPg0KICA8ZyBjbGFzcz0iY2xzLTQiPg0KICAgIDxwb2x5Z29uIGNsYXNzPSJjbHMtNiIgcG9pbnRzPSIyLjQ2IDcuNDYgMi40NiAxNS40NiA2LjQ2IDE1LjQ2IDExLjQ2IDIwLjQ1IDEyLjQ2IDIwLjQ1IDEyLjQ2IDIuNDYgMTEuNDYgMi40NiA2LjQ2IDcuNDYgMi40NiA3LjQ2Ii8+DQogIDwvZz4NCiAgPGxpbmUgY2xhc3M9ImNscy03IiB4MT0iMTYuOTUiIHkxPSI4Ljk1IiB4Mj0iMjEuOTUiIHkyPSIxMy45NSIvPg0KICA8bGluZSBjbGFzcz0iY2xzLTciIHgxPSIyMS45NSIgeTE9IjguOTUiIHgyPSIxNi45NSIgeTI9IjEzLjk1Ii8+DQo8L3N2Zz4='); background-image: var(--muted-icon); background-size: var(--tpMuteSize); background-position: center; } .tpControls button.tpFullscreen { width: var(--fullscreen-icon-size); margin: var(--tpFullScreenMargin); } .tpControls button.tpFullscreen::before { margin: auto; margin: var(--tpFullScreenMargin); background-image: url('data:image/svg+xml;charset=utf-8;base64,PHN2ZyBpZD0iTGF5ZXJfMSIgZGF0YS1uYW1lPSJMYXllciAxIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIiB2aWV3Qm94PSIwIDAgMjIgMjIiPg0KICA8ZGVmcz4NCiAgICA8c3R5bGU+DQogICAgICAuY2xzLTEsIC5jbHMtMyB7DQogICAgICAgIGZpbGw6IG5vbmU7DQogICAgICB9DQoNCiAgICAgIC5jbHMtMSB7DQogICAgICAgIGNsaXAtcnVsZTogZXZlbm9kZDsNCiAgICAgIH0NCg0KICAgICAgLmNscy0yIHsNCiAgICAgICAgY2xpcC1wYXRoOiB1cmwoI2NsaXAtcGF0aCk7DQogICAgICB9DQoNCiAgICAgIC5jbHMtMyB7DQogICAgICAgIHN0cm9rZTogI2ZmZjsNCiAgICAgICAgc3Ryb2tlLW1pdGVybGltaXQ6IDEwOw0KICAgICAgICBzdHJva2Utd2lkdGg6IDRweDsNCiAgICAgIH0NCiAgICA8L3N0eWxlPg0KICAgIDxjbGlwUGF0aCBpZD0iY2xpcC1wYXRoIiB0cmFuc2Zvcm09InRyYW5zbGF0ZSgtMjUgLTI1KSI+DQogICAgICA8cGF0aCBjbGFzcz0iY2xzLTEiIGQ9Ik0zMyw0NUgyN1YzOWgydjRoNFpNMjcsMzNWMjdoNnYySDI5djRabTE4LDZ2NkgzOVY0M2g0VjM5Wk0zOSwyN2g2djZINDNWMjlIMzlaIi8+DQogICAgPC9jbGlwUGF0aD4NCiAgPC9kZWZzPg0KICA8dGl0bGU+ZnVsbHNjcmVlbjwvdGl0bGU+DQogIDxnIGNsYXNzPSJjbHMtMiI+DQogICAgPHBhdGggY2xhc3M9ImNscy0zIiBkPSJNMzMsNDVIMjdWMzloMnY0aDRaTTI3LDMzVjI3aDZ2MkgyOXY0Wm0xOCw2djZIMzlWNDNoNFYzOVpNMzksMjdoNnY2SDQzVjI5SDM5WiIgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoLTI1IC0yNSkiLz4NCiAgPC9nPg0KPC9zdmc+'); background-image: var(--fullscreen-icon); background-size: var(--fullscreen-icon-size); background-position: center; background-repeat: no-repeat; } .tpPlayerView.tpFullscreenView .tpControls button.tpFullscreen::before { margin: auto; margin: var(--tpFullScreenMargin); background-image: var(--minimizescreen-icon); background-size: var(--fullscreen-icon-size); background-position: center; background-repeat: no-repeat; } .tpControls button.tpKeyboardControls::before { background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 28 28'%3e%3cstyle%3e.st0%7bdisplay:none%7d.st1%7bdisplay:inline%7d.st2%7bfill:white%7d%3c/style%3e%3cg class='st0'%3e%3cpath d='M0 0h28v28H0z'/%3e%3c/g%3e%3cg class='st0'%3e%3cg class='st1'%3e%3cpath class='st2' d='M8.7 17.95h10.14v1.78H8.7zM5.91 17.95h1.78v1.78H5.91zM19.84 17.95h1.78v1.78h-1.78z'/%3e%3cg%3e%3cpath class='st2' d='M5.91 15.17h3.12v1.78H5.91zM18.5 15.17h3.12v1.78H18.5zM10.03 15.17h1.78v1.78h-1.78zM12.82 15.17h1.78v1.78h-1.78zM15.61 15.17h1.78v1.78h-1.78z'/%3e%3c/g%3e%3cg%3e%3cpath class='st2' d='M5.91 12.38h1.78v1.78H5.91zM17.05 12.38h1.78v1.78h-1.78zM14.27 12.38h1.78v1.78h-1.78zM11.48 12.38h1.78v1.78h-1.78zM8.7 12.38h1.78v1.78H8.7zM19.84 12.38h1.78v1.78h-1.78z'/%3e%3c/g%3e%3cpath class='st2' d='M22.58 10.38h-8.29c.06-.51.24-1.2.65-1.55.43-.37 1.06-.43 1.71-.5.67-.07 1.36-.14 1.91-.55 1.09-.81 1.09-2.25 1.09-2.87V4.9c0-.22-.17-.39-.39-.39s-.39.17-.39.39v.02c0 .54 0 1.67-.77 2.24-.37.28-.93.34-1.52.4-.71.07-1.52.16-2.14.68-.68.58-.88 1.58-.93 2.14H5.2c-.89 0-1.62.72-1.62 1.62v8.13c0 .89.72 1.62 1.62 1.62h17.38c.89 0 1.62-.72 1.62-1.62V12c0-.89-.73-1.62-1.62-1.62zm.84 9.75c0 .46-.37.84-.84.84H5.2c-.46 0-.84-.37-.84-.84V12c0-.46.37-.84.84-.84h17.38c.46 0 .84.37.84.84v8.13z'/%3e%3c/g%3e%3c/g%3e%3cpath class='st2' d='M7 10h1v1H7zM9 10h1v1H9zM11 10h1v1h-1zM13 10h1v1h-1zM7 13h3v1H7zM7 16h3v1H7zM11 13h1v1h-1zM13 13h1v1h-1zM15 13h1v1h-1zM17 13h3v1h-3zM17 16h3v1h-3zM15 10h1v1h-1zM17 10h1v1h-1zM19 10h1v1h-1zM11 16h5v1h-5z'/%3e%3cpath d='M22.5 18c0 .83-.6 1.5-1.35 1.5H5.85c-.74 0-1.35-.67-1.35-1.5V9c0-.82.61-1.5 1.35-1.5h15.3c.75 0 1.35.68 1.35 1.5v9z' fill='none' stroke='white' stroke-miterlimit='10'/%3e%3c/svg%3e"); background-image: var(--keyboardControls-icon); background-position: 0; background-size: 28px 28px; } .tpControls .tpPopup>div { background: rgb(26, 29, 49); background: var(--row-color); } .tpControls .tpPopup div li { height: 28px; line-height: 28px; text-indent: 32px; padding: 1px; } .tpControls .tpPopup div li a, .tpControls .tpPopup div li div { display: block; width: 100%; height: 100%; font-size: var(--tpRowFontSize); text-decoration: none; margin-right: 28px; } .tpControls .tpPopup div li:hover { background: rgb(36, 40, 66); background: var(--expander-hover-color); } .tpControls .tpPopup div li.tpSelected::before { content: '\2713'; position: absolute; width: 30px; text-indent: 0px; text-align: center; left: 2px; font-size: 18px; } .tpControls .tpRow hr { border: 0; width: 100%; } .tpAdvertisementPlayback .tpJumpBack, .tpAdvertisementPlayback .tpJumpForward { display: none; } .tpRow { position: relative; transition: bottom 0.25s linear !important; bottom: 0px; } /* size of second tpRow when displayed on a mobile device*/ .tpRow~.tpRow { height: --control-size; } /* ie and edge rendering off by less than a pixel */ /* selector to target ie10+ and edge */ _:-ms-lang(x), .tpRow~.tpRow { margin-top: -0.45px; } .tpPlayerView .tpBottomFloatRegion { top: 1000px; opacity: 0; display: block; visibility: visible; transition: opacity 0.25s linear; } .tpPlayerView.tpMouseHover:not(.tpIdle) .tpBottomFloatRegion, .tpPlayerView.tpHasTabFocus:not(.tpIdle) .tpBottomFloatRegion, .tpPlayerView .tpBottomFloatRegion.tpDisableFadeOut, .tpPlayerView.tpKeepControlsVisible .tpBottomFloatRegion, .tpPlayerView.tpKeepControlsVisible.tpIdle .tpBottomFloatRegion { opacity: 0.8; } .tpPlayerView.tpMouseHover:not(.tpIdle) .tpBottomFloatRegion .tpRow, .tpPlayerView.tpHasTabFocus:not(.tpIdle) .tpBottomFloatRegion .tpRow { top: auto; } .tpIdle .tpBottomFloatRegion .tpRow { top: auto; } .tpPlayerView.tpMouseHover:not(.tpIdle) .tpSubtitles, .tpPlayerView.tpHasTabFocus:not(.tpIdle) .tpSubtitles { margin-top: 0; margin-top: var(--overlay-margin-top); margin-left: 1em; margin-left: var(--overlay-margin-left); margin-bottom: 86px; margin-bottom: var(--overlay-margin-bottom); margin-right: 1em; margin-right: var(--overlay-margin-right); } .tpAutoplayUnmute { background-color: var(--background-color); } .tpPlayerView .tpSubtitles { margin-top: 0; margin-top: var(--media-margin-top); margin-left: 0; margin-left: var(--media-margin-left); margin-bottom: 0; margin-bottom: var(--media-margin-bottom); margin-right: 0; margin-right: var(--media-margin-right); } .tpKeyboardControlsCard-sections::-webkit-scrollbar { width: 10px; height: 10px; } .tpKeyboardControlsCard-sections::-webkit-scrollbar-track { background: #232323; border-radius: 5px; } .tpKeyboardControlsCard-sections::-webkit-scrollbar-thumb { background: #444; border-radius: 5px; } .tpKeyboardControlsCard-sections::-webkit-scrollbar-thumb:hover { background: #666; } .tpAudioTextTrackMenu::-webkit-scrollbar, .tpAudioTrackMenu::-webkit-scrollbar, .tpTextTrackMenu::-webkit-scrollbar { width: 10px; height: 10px; } .tpAudioTextTrackMenu::-webkit-scrollbar-track, .tpAudioTrackMenu::-webkit-scrollbar-track, .tpTextTrackMenu::-webkit-scrollbar-track { background: #0e1219; border-radius: 5px; } .tpAudioTextTrackMenu::-webkit-scrollbar-thumb, .tpAudioTrackMenu::-webkit-scrollbar-thumb, .tpTextTrackMenu::-webkit-scrollbar-thumb { background: #313851; border-radius: 5px; } .tpAudioTextTrackMenu::-webkit-scrollbar-thumb:hover, .tpAudioTrackMenu::-webkit-scrollbar-thumb:hover, .tpTextTrackMenu::-webkit-scrollbar-thumb:hover { background: #455070; } .tpKeyboardControlsCard-sections::-webkit-scrollbar-corner, .tpAudioTextTrackMenu::-webkit-scrollbar-corner, .tpAudioTrackMenu::-webkit-scrollbar-corner, .tpTextTrackMenu::-webkit-scrollbar-corner { background: transparent; } .tpAudioTextTrackMenu header { padding: var(--tpRowHeaderPadding); font-size: var(--tpRowHeaderFontSize); } .tpAudioTextTrackMenu .tpMenuLeft { min-width: 180px; border-right: 1px solid #0f131c; } .tpAudioTextTrackMenu .tpMenuRight { min-width: 180px; border-left: 1px solid #252f42; } .tpAudioTextTrackMenu .tpTextTrackMenu { border-bottom: 1px solid #0f131c; } .tpControls .tpRow div.tpTTRSettings { height: 36px; line-height: 36px; padding-left: 32px; border-top: 1px solid #252f42; background: rgb(26, 29, 49); background: var(--expander-color); color: #55dfff; font-size: 14px; border-radius: 0; text-align: left; cursor: pointer; } .tpControls .tpRow div.tpTTRSettings:hover { background: rgba(61, 66, 111, 1); background: var(--expander-hover-color); } .tpScrubberTooltip { position: absolute; bottom: 26px; border: 2px solid black; background: black; } .tpScrubberTooltipImage { float: left; } .tpScrubberTooltipImage img { display: block; float: left; } .tpScrubberTooltipText { position: absolute; bottom: 2px; line-height: 1.65; text-align: center; width: 100%; min-width: 80px; } .tpScrubberTooltip.tpShowTimeOnly .tpScrubberTooltipImage { display: none; } .tpScrubberTooltip.tpShowTimeOnly .tpScrubberTooltipText { position: static; } .tpScrubberTooltipPointer { display: none; } /* Will not work while chrome devtools is open */ /* if you add to tpBottomFloatRegion any element other than button or div, you might need to add css rule for it */ /* No need to add tpVolume elements since they are in a popup element which we do not fade */ .tpPlayerView.tpIdle .tpVideo, .tpPlayerView.tpIdle .tpVideoClick, .tpPlayerView.tpIdle .tpSubtitles, .tpPlayerView.tpIdle .tpStandby, .tpPlayerView.tpIdle .tpControls .tpBottomFloatRegion:not(.tpDisableFadeOut) div, .tpPlayerView.tpIdle .tpControls .tpBottomFloatRegion:not(.tpDisableFadeOut) button, .tpPlayerView.tpIdle .tpBottomFloatRegion .tpScrubber, .tpPlayerView.tpIdle .tpStandby .tpPlayOverlay { cursor: none; } .tpVideoClick>a { width: 100%; height: 100%; display: block; text-indent: 100%; overflow: hidden; white-space: nowrap; } .tpPlayerView.tpIdle.tpKeepControlsVisible .tpControls .tpBottomFloatRegion:not(.tpDisableFadeOut) div, .tpPlayerView.tpIdle.tpKeepControlsVisible .tpControls .tpBottomFloatRegion:not(.tpDisableFadeOut) button { cursor: pointer; } .tpBottom.tpSplit { position: relative; } .tpJumpsAndPlay { display: flex; } .tpBottom.tpSplit .tpJumpsAndPlay { position: absolute; left: 50%; transform: translate(-50%, 0); align-items: center; } .tpRow.tpBottomRow div:nth-child(3) { display: none; } .tpCCAndFulscreen { display: flex; } .tpBottomRow { display: flex; align-items: center; } /* For touch devices only */ /* @media (-moz-touch-enabled: 1), (any-pointer: coarse) { .tpControls .tpRow button { width: 40px; height: 40px; } .tpControls button.tpPlayPause::before { background-size: 28px 28px; background-position: center; } .tpControls button.tpMute::before { background-size: 24px 24px; background-position: center; } .tpMuted .tpControls button.tpMute::before { background-size: 24px 24px; background-position: center; } .tpControls button.tpFullscreen::before { background-size: 28px 28px; background-position: center; } .tpControls button.tpJumpBack::before { background-size: 27px 27px; background-position: center; } .tpControls button.tpJumpForward::before { background-size: 27px 27px; background-position: center; } .tpControls .tpBottomFloatRegion .tpRow, .tpControls .tpBottomFloatRegion .tpRow .tpScrubber { height: 44px; } .tpControls .tpBottomFloatRegion .tpRow:last-child, .tpControls .tpBottomFloatRegion .tpRow:last-child .tpScrubber { height: 50px; } .tpControls .tpRow .tpPopup, .tpControls .tpRow .tpPopout { } .tpControls .tpBottomRegion .tpRow, .tpControls .tpBottomRegion .tpRow .tpScrubber { line-height: 50px; } .tpControls .tpPopup div li { height: 28px; line-height: 28px; text-indent: 32px; padding: 1px; } } */ .tpAudioTextTrackMenu { display: flex; } .tpAudioTextTrackMenu.tpFlexColumn { flex-direction: column; } .tpAudioTextTrackMenu.tpFlexColumn header { margin-top: 8px; margin-bottom: 10px; font-size: var(--tpRowHeaderFontSize); } .tpAudioTextTrackMenu.tpFlexColumn .tpMenuLeft { border-bottom: 1px solid #0f131c; border-right: none; } .tpAudioTextTrackMenu.tpFlexColumn .tpMenuRight { border-top: 1px solid #252f42; border-left: none; } .tpAudioTextTrackMenu.tpFlexColumn header { margin-right: 12px; } /* on IE11 the cursor would flicker when we had a transition so we disable the transition */ @media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) { .tpSubtitles { transition: margin-bottom 0s linear; } } /* target iPhone only */ @supports (-webkit-overflow-scrolling: touch) { @media (max-device-width: 736px) { .tpPlayerView.tpWarmed .tpFullscreen { visibility: hidden; } } } @font-face { font-family: NBCSN_FrankRegular; src: url(https://mpxplayerdev.nbcsports.com/main/player/sites/nbcsports/fonts/NBCSN_Frank-Regular.ttf); }