:root {
    --mobile-width: 1080px;
    /*#region root-font*/
    --font-title: "VT323", "Helvetica", "Arial", sans-serif;
    --font-body: "Roboto", sans-serif;
    /*#endregion root-font*/

    /*#region root-spacing*/
    --spacing-0: 0.1pc;
    --spacing-1: 0.2pc;
    --spacing-2: 0.4pc;
    --spacing-3: 0.8pc;
    --spacing-4: 1.6pc;
    --spacing-5: 3.2pc;
    --spacing-6: 6.4pc;
    /*#endregion root-spacing*/

    /*#region root-color*/
    --color-bg: #080808;
    --color-bg-alt: #1E1E1E;
    --color-bg-1: #08080808;
    --color-bg-2: #08080810;
    --color-bg-3: #08080820;
    --color-bg-4: #08080830;
    --color-bg-5: #08080840;

    --color-pg: #dddddd;
    --color-pg-alt: #cccccc;
    --color-pg-1: #dddddd08;
    --color-pg-2: #dddddd10;
    --color-pg-3: #dddddd20;
    --color-pg-4: #dddddd30;
    --color-pg-5: #dddddd40;

    --color-txt: #111111;
    --color-txt-alt: #eeeeee;
    
    --color-good: #729C34;
    --color-bad: #AA3939;

    --color-link: #003366;
    --color-link-active: #0066aa;

    --color-ac-1: #A82525;
    --color-ac-1-1: #CD181808;
    --color-ac-1-2: #CD181810;
    --color-ac-1-3: #CD181820;
    --color-ac-1-4: #CD181830;
    --color-ac-1-5: #CD181840;
    --color-ac-1-alt: #CC4545;

    --color-ac-2: #1F4A7F;
    --color-ac-2-1: #1866CC08;
    --color-ac-2-2: #1866CC10;
    --color-ac-2-3: #1866CC20;
    --color-ac-2-4: #1866CC30;
    --color-ac-2-5: #1866CC40;
    --color-ac-2-alt: #457FCC;

    --color-video-sd: #458FCC;
    --color-video-hd: #CCA545;
/*#endregion root-color*/

    /*#region root-background*/
    --bg-noise-01: url('/img/noise-01.png');

    --bg-crt-gr2-01: var(--bg-crt-gr2-h-01), var(--bg-crt-gr2-v-01);
    --bg-crt-gr2-h-01: repeating-linear-gradient(to bottom, rgba(0,0,0,0.01), transparent 2px, transparent 7px, rgba(0,0,0,0.01) 9px);
    --bg-crt-gr2-v-01: repeating-linear-gradient(to right,
        rgba(0,0,0,0.01),
        transparent 1px,
        transparent 3px,
        rgba(0,0,0,0.005) 4px,
        transparent 5px,
        transparent 7px,
        rgba(0,0,0,0.005) 8px,
        transparent 9px,
        transparent 11px,
        rgba(0,0,0,0.01) 12px);
    
    --bg-crt-gr2-05: var(--bg-crt-gr2-h-05), var(--bg-crt-gr2-v-05);
    --bg-crt-gr2-h-05: repeating-linear-gradient(to bottom, rgba(0,0,0,0.05), transparent 2px, transparent 7px, rgba(0,0,0,0.05) 9px);
    --bg-crt-gr2-v-05: repeating-linear-gradient(to right,
        rgba(0,0,0,0.05),
        transparent 1px,
        transparent 3px,
        rgba(0,0,0,0.025) 4px,
        transparent 5px,
        transparent 7px,
        rgba(0,0,0,0.025) 8px,
        transparent 9px,
        transparent 11px,
        rgba(0,0,0,0.05) 12px);
    
    --bg-crt-gr2-20: var(--bg-crt-gr2-h-20), var(--bg-crt-gr2-v-20);
    --bg-crt-gr2-h-20: repeating-linear-gradient(to bottom, rgba(0,0,0,0.20), transparent 2px, transparent 7px, rgba(0,0,0,0.20) 9px);
    --bg-crt-gr2-v-20: repeating-linear-gradient(to right,
        rgba(0,0,0,0.20),
        transparent 1px,
        transparent 3px,
        rgba(0,0,0,0.10) 4px,
        transparent 5px,
        transparent 7px,
        rgba(0,0,0,0.10) 8px,
        transparent 9px,
        transparent 11px,
        rgba(0,0,0,0.20) 12px);
    
    --bg-crt-gr2-50: var(--bg-crt-gr2-h-50), var(--bg-crt-gr2-v-50);
    --bg-crt-gr2-h-50: repeating-linear-gradient(to bottom, rgba(0,0,0,0.50), transparent 2px, transparent 7px, rgba(0,0,0,0.50) 9px);
    --bg-crt-gr2-v-50: repeating-linear-gradient(to right,
        rgba(0,0,0,0.50),
        transparent 1px,
        transparent 3px,
        rgba(0,0,0,0.25) 4px,
        transparent 5px,
        transparent 7px,
        rgba(0,0,0,0.25) 8px,
        transparent 9px,
        transparent 11px,
        rgba(0,0,0,0.50) 12px);
    
    --bg-crt-gr2-80: var(--bg-crt-gr2-h-80), var(--bg-crt-gr2-v-80);
    --bg-crt-gr2-h-80: repeating-linear-gradient(to bottom, rgba(0,0,0,0.80), transparent 2px, transparent 7px, rgba(0,0,0,0.80) 9px);
    --bg-crt-gr2-v-80: repeating-linear-gradient(to right,
        rgba(0,0,0,0.80),
        transparent 1px,
        transparent 3px,
        rgba(0,0,0,0.40) 4px,
        transparent 5px,
        transparent 7px,
        rgba(0,0,0,0.40) 8px,
        transparent 9px,
        transparent 11px,
        rgba(0,0,0,0.80) 12px);
    
    --bg-crt-gr2-95: var(--bg-crt-gr2-h-95), var(--bg-crt-gr2-v-95);
    --bg-crt-gr2-h-95: repeating-linear-gradient(to bottom, rgba(0,0,0,0.95), transparent 2px, transparent 7px, rgba(0,0,0,0.95) 9px);
    --bg-crt-gr2-v-95: repeating-linear-gradient(to right,
        rgba(0,0,0,0.95),
        transparent 1px,
        transparent 3px,
        rgba(0,0,0,0.475) 4px,
        transparent 5px,
        transparent 7px,
        rgba(0,0,0,0.475) 8px,
        transparent 9px,
        transparent 11px,
        rgba(0,0,0,0.95) 12px);


    --bg-crt-rgb2-01: repeating-linear-gradient(to right,
        rgba(0,0,0,0.01),
        rgba(255,0,0,0.01) 1px,
        rgba(255,0,0,0.01) 3px,
        rgba(0,0,0,0.01) 4px,
        rgba(0,255,0,0.01) 5px,
        rgba(0,255,0,0.01) 7px,
        rgba(0,0,0,0.01) 8px,
        rgba(0,0,255,0.01) 9px,
        rgba(0,0,255,0.01) 11px,
        rgba(0,0,0,0.01) 12px);
    --bg-crt-rgb2-05: repeating-linear-gradient(to right,
        rgba(0,0,0,0.05),
        rgba(255,0,0,0.05) 1px,
        rgba(255,0,0,0.05) 3px,
        rgba(0,0,0,0.05) 4px,
        rgba(0,255,0,0.05) 5px,
        rgba(0,255,0,0.05) 7px,
        rgba(0,0,0,0.05) 8px,
        rgba(0,0,255,0.05) 9px,
        rgba(0,0,255,0.05) 11px,
        rgba(0,0,0,0.05) 12px);
    --bg-crt-rgb2-20: repeating-linear-gradient(to right,
        rgba(0,0,0,0.20),
        rgba(255,0,0,0.20) 1px,
        rgba(255,0,0,0.20) 3px,
        rgba(0,0,0,0.20) 4px,
        rgba(0,255,0,0.20) 5px,
        rgba(0,255,0,0.20) 7px,
        rgba(0,0,0,0.20) 8px,
        rgba(0,0,255,0.20) 9px,
        rgba(0,0,255,0.20) 11px,
        rgba(0,0,0,0.20) 12px);
    --bg-crt-rgb2-50: repeating-linear-gradient(to right,
        rgba(0,0,0,0.50),
        rgba(255,0,0,0.50) 1px,
        rgba(255,0,0,0.50) 3px,
        rgba(0,0,0,0.50) 4px,
        rgba(0,255,0,0.50) 5px,
        rgba(0,255,0,0.50) 7px,
        rgba(0,0,0,0.50) 8px,
        rgba(0,0,255,0.50) 9px,
        rgba(0,0,255,0.50) 11px,
        rgba(0,0,0,0.50) 12px);
    --bg-crt-rgb2-80: repeating-linear-gradient(to right,
        rgba(0,0,0,0.80),
        rgba(255,0,0,0.80) 1px,
        rgba(255,0,0,0.80) 3px,
        rgba(0,0,0,0.80) 4px,
        rgba(0,255,0,0.80) 5px,
        rgba(0,255,0,0.80) 7px,
        rgba(0,0,0,0.80) 8px,
        rgba(0,0,255,0.80) 9px,
        rgba(0,0,255,0.80) 11px,
        rgba(0,0,0,0.80) 12px);
    --bg-crt-rgb2-95: repeating-linear-gradient(to right,
        rgba(0,0,0,0.95),
        rgba(255,0,0,0.95) 1px,
        rgba(255,0,0,0.95) 3px,
        rgba(0,0,0,0.95) 4px,
        rgba(0,255,0,0.95) 5px,
        rgba(0,255,0,0.95) 7px,
        rgba(0,0,0,0.95) 8px,
        rgba(0,0,255,0.95) 9px,
        rgba(0,0,255,0.95) 11px,
        rgba(0,0,0,0.95) 12px);
    /*#endregion root-background*/
}

/*#region root-keyframes*/
@keyframes ani-h2-flash {
    0% { opacity: 1; }
    50% { opacity: 0.95; }
}
@keyframes ani-menu-flash {
    0% { opacity: 0.950; }
    50% { opacity: 0.925; }
}
/*#endregion root-keyframes*//*#region effect-crt-strobing-small*/
.effect-crt-strobing-small {
    position: absolute;
    user-select: none;
    width: 100%;
    height: 100%;
    top: 0;
    overflow:hidden;
}
.effect-crt-strobing-small::before {
    content: "";
    position: absolute;
    width: calc(100% + 40px);
    height: calc(100% + 90px);
    transform: rotate(-2deg);
    top: -40px;
    left: -20px;
    overflow: hidden;
    background: repeating-linear-gradient(to bottom, rgba(0,0,0,0.1), rgba(0,0,0,0.05) 6px, transparent 6px, transparent 12px);
    animation: effect-crt-strobing-small 0.7s linear infinite;
}
@keyframes effect-crt-strobing-small {
    0% { background-position: right 0 top 0; }
    100% { background-position: right 0 top 12px; }
}
/*#endregion effect-crt-strobing-small*/

/*#region effect-crt-strobing-large*/
.effect-crt-strobing-large {
    position: absolute;
    user-select: none;
    width: 100%;
    height: 100%;
    top: 0;
    overflow:hidden;
}
.effect-crt-strobing-large::before {
    content: "";
    position: absolute;
    width: calc(100% + 40px);
    height: calc(100% + 96px);
    top: -24px;
    left: -20px;
    overflow: hidden;
    background: repeating-linear-gradient(to bottom, rgba(0,0,0,0.025), transparent 96px);
    animation: effect-crt-strobing-large 0.7s linear infinite;
}
@keyframes effect-crt-strobing-large {
    0% { background-position: right 0 top 0; }
    100% { background-position: right 0 top -96px; }
}
/*#endregion effect-crt-strobing-large*/

/*#region effect-noise-01*/
.effect-noise-01 {
    position: absolute;
    user-select: none;
    width: 100%;
    height: 100%;
    top: 0;
    overflow: hidden;
}
.effect-noise-01::before {
    opacity: 0.075;
    content: "";
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    overflow: hidden;
    background-image: url('/img/noise-01.png');
    background-repeat: repeat;
    background-size: 200px 200px;
}
.effect-noise-01-med {
    position: absolute;
    user-select: none;
    width: 100%;
    height: 100%;
    top: 0;
    overflow:hidden;
}
.effect-noise-01-med::before {
    opacity: 0.4;
    content: "";
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    overflow: hidden;
    background-image: url('/img/noise-01.png');
    background-repeat: repeat;
    background-size: 200px 200px;
}
/*#endregion effect-noise-1*/

* {
    
}
html {
    padding: 0;
    margin: 0;
}
body {
    padding: 0;
    margin: 0;
    background-color: var(--color-bg);
}

a {
    color: var(--color-link);
    text-decoration: none;
}
a:hover {
    color: var(--color-link-active);
}

h1 {
    user-select: none;
    font-family: var(--font-title);
    font-weight: normal;
    color: var(--color-txt-alt);
    text-shadow: var(--spacing-1) var(--spacing-1) var(--spacing-2) var(--color-bg-5);
    text-transform: uppercase;
    font-size: calc(var(--spacing-5) + var(--spacing-4));
    line-height: var(--spacing-6);
    padding: var(--spacing-1) var(--spacing-3);
    margin: var(--spacing-4) 0;
    background:
        var(--bg-crt-gr2-05),
        var(--bg-crt-rgb2-01),
        var(--color-ac-1);
    animation: ani-h2-flash 0.04s infinite;
    box-shadow: var(--spacing-1) var(--spacing-1) var(--spacing-2) var(--spacing-1) var(--color-bg-5);
}
@media (max-width: 700px) {
    h1 {
        font-size: calc(var(--spacing-4) + var(--spacing-3));
        line-height: var(--spacing-5);
    }
}
h2 {
    user-select: none;
    font-family: var(--font-title);
    font-weight: normal;
    color: var(--color-txt-alt);
    text-shadow: var(--spacing-1) var(--spacing-1) var(--spacing-2) var(--color-bg-5);
    text-transform: uppercase;
    font-size: calc(var(--spacing-4) + var(--spacing-3));
    line-height: var(--spacing-5);
    padding: var(--spacing-1) var(--spacing-3);
    margin: var(--spacing-4) 0;
    background:
        var(--bg-crt-gr2-05),
        var(--bg-crt-rgb2-01),
        var(--color-ac-2);
    animation: ani-h2-flash 0.04s infinite;
    box-shadow: var(--spacing-1) var(--spacing-1) var(--spacing-2) var(--spacing-1) var(--color-bg-5);
}
h3 {
    padding: 0;
    margin: 0;
    user-select: none;
}
h4 {
    padding: 0;
    margin: 0;
    user-select: none;
}

p {
    margin: var(--spacing-3) 0;
}
p.summary {
    margin: var(--spacing-4) var(--spacing-3);
    padding: var(--spacing-2) var(--spacing-3);
    background-color: var(--color-ac-2-5);
    box-shadow: var(--spacing-1) var(--spacing-1) var(--spacing-2) var(--spacing-1) var(--color-bg-5);
}
p.summary::before {
    content: "Summary: ";
    font-weight: bold;
}
p.information {
    margin: var(--spacing-4) var(--spacing-3);
    padding: var(--spacing-2) var(--spacing-3);
    background-color: var(--color-ac-1-5);
    box-shadow: 2px 2px 8px 4px var(--color-bg-5);
}
p.information::before {
    content: "Information: ";
    font-weight: bold;
}

ul {
    margin: var(--spacing-3) 0;
}
ol {
    margin: var(--spacing-3) 0;
}
li {
    margin: var(--spacing-3) 0;
}.ntv-main {
    font-family: var(--font-body);
    min-height: var(--vh);
    display: flex;
    flex-wrap: nowrap;
    flex-direction: column;
    overflow: hidden;
    background:
        var(--bg-crt-gr2-80),
        var(--bg-crt-rgb2-05);
}
.ntv-header {
    position: relative;
    height: 33vw;
    min-height: calc(var(--spacing-6) * 1);
    max-height: calc(var(--spacing-6) * 6);
    overflow: hidden;
    background-repeat: no-repeat;
    background-position: center center;
    background-size: auto 100%;
}

.ntv-header .ntv-logo {
    z-index: -4;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    overflow: hidden;
}
.ntv-header .ntv-logo video {
    position: absolute;
    left: 50%;
    width: auto;
    height: 100%;
    transform: translateX(-50%);
    padding: 0;
    margin: 0;
}
.ntv-menu {
}
.ntv-content {
    min-height: calc(var(--vh) - (var(--spacing-6) * 6) - var(--spacing-5) - var(--spacing-4));
    padding: var(--spacing-5) 0;
}
.ntv-page {
    width: calc(100% - var(--spacing-3));
    max-width: calc((var(--spacing-6) * 12) - var(--spacing-4));
    padding: var(--spacing-2);
    margin: 0 auto;
    background-color: var(--color-pg);
}
@media (min-width: 720px) {
    .ntv-page {
        width: calc(100% - var(--spacing-5));
        padding: var(--spacing-4);
    }
}
.ntv-ad {
    padding: 0 15vw;
}
.ntv-footer {
    min-height: var(--spacing-6);
    padding: var(--spacing-5) 0;
    background-color: #fff8;
}
::-webkit-scrollbar {
    width: var(--spacing-4);
    
}
::-webkit-scrollbar-button {
    width: var(--spacing-4);
    height: var(--spacing-4);
}

::-webkit-scrollbar-button:single-button:vertical:decrement {
    background:
        linear-gradient(to top right, transparent 0%, transparent 60%, var(--color-bg) 64%, var(--color-bg) 100%),
        linear-gradient(to top left, transparent 0%, transparent 60%, var(--color-bg) 64%, var(--color-bg) 100%),
        linear-gradient(to bottom, transparent 0%, transparent 60%, var(--color-bg) 64%, var(--color-bg) 100%),
        var(--color-pg-alt);
}
::-webkit-scrollbar-button:single-button:vertical:decrement:hover {
    background:
        linear-gradient(to top right, transparent 0%, transparent 60%, var(--color-ac-1-alt) 64%, var(--color-ac-1-alt) 100%),
        linear-gradient(to top left, transparent 0%, transparent 60%, var(--color-ac-1-alt) 64%, var(--color-ac-1-alt) 100%),
        linear-gradient(to bottom, transparent 0%, transparent 60%, var(--color-ac-1-alt) 64%, var(--color-ac-1-alt) 100%),
        var(--color-pg);
}
::-webkit-scrollbar-button:single-button:vertical:decrement:active {
    background:
        linear-gradient(to top right, transparent 0%, transparent 60%, var(--color-ac-1) 64%, var(--color-ac-1) 100%),
        linear-gradient(to top left, transparent 0%, transparent 60%, var(--color-ac-1) 64%, var(--color-ac-1) 100%),
        linear-gradient(to bottom, transparent 0%, transparent 60%, var(--color-ac-1) 64%, var(--color-ac-1) 100%),
        var(--color-pg-alt);
}


::-webkit-scrollbar-button:single-button:vertical:increment {
    background:
        linear-gradient(to bottom right, transparent 0%, transparent 60%, var(--color-bg) 64%, var(--color-bg) 100%),
        linear-gradient(to bottom left, transparent 0%, transparent 60%, var(--color-bg) 64%, var(--color-bg) 100%),
        linear-gradient(to top, transparent 0%, transparent 60%, var(--color-bg) 64%, var(--color-bg) 100%),
        var(--color-pg-alt);
}
::-webkit-scrollbar-button:single-button:vertical:increment:hover {
    background:
        linear-gradient(to bottom right, transparent 0%, transparent 60%, var(--color-ac-1-alt) 64%, var(--color-ac-1-alt) 100%),
        linear-gradient(to bottom left, transparent 0%, transparent 60%, var(--color-ac-1-alt) 64%, var(--color-ac-1-alt) 100%),
        linear-gradient(to top, transparent 0%, transparent 60%, var(--color-ac-1-alt) 64%, var(--color-ac-1-alt) 100%),
        var(--color-pg);
}
::-webkit-scrollbar-button:single-button:vertical:increment:active {
    background:
        linear-gradient(to bottom right, transparent 0%, transparent 60%, var(--color-ac-1) 64%, var(--color-ac-1) 100%),
        linear-gradient(to bottom left, transparent 0%, transparent 60%, var(--color-ac-1) 64%, var(--color-ac-1) 100%),
        linear-gradient(to top, transparent 0%, transparent 60%, var(--color-ac-1) 64%, var(--color-ac-1) 100%),
        var(--color-pg-alt);
}

::-webkit-scrollbar-thumb {
    background:
        var(--color-pg-3);
}
::-webkit-scrollbar-thumb:hover {
    background: 
        var(--color-pg-4);
}
::-webkit-scrollbar-thumb:active {
    background:
        var(--color-ac-1);
}
::-webkit-scrollbar-track {
    background:
        repeating-linear-gradient(to bottom, transparent, var(--color-pg-1) 5px, transparent 10px),
        var(--color-bg);
}.ntv-footer h3 {
    font-family: var(--font-title);
    text-decoration: underline;
    font-size: 32px;
}
.ntv-footer .contact {
    position: relative;
    text-align: center;
}
.ntv-footer .contact > ul {
    list-style: none;
    margin: 0;
    padding: 0;
}
.ntv-footer .contact > ul > li {
    position: relative;
    display: inline-block;
    height: 75px;
    margin: 5px 15px 5px 95px;
    padding: 0;
    font-size: 24px;
    line-height: 75px;
}
.ntv-footer .contact ul li a {
    position: relative;
    z-index: 100;
    color: var(--color-txt);
    cursor: pointer;
}

.ntv-footer .contact ul li a:hover {
    color: var(--color-ac-1);
}

.ntv-footer .contact ul li::before {
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center center;
    position: absolute;
    content: "";
    left: -80px;
    display: block;
    width: 75px;
    height: 75px;
}
.ntv-footer .contact li.email::before {
    background-image: url('/img/ext/email-150.png');
}
.ntv-footer .contact li.twitter::before {
    background-image: url('/img/ext/twitter-150.png');
}
.ico {
    cursor: pointer;
    display: inline-block;
    text-decoration: none;
    margin-left: 5px;
    line-height: 100%;
    color: var(--color-link);
}
.act-ico:hover {
    color: var(--color-link-active);
}
.ico-int::before {
    content: '🡆';
    font-weight: normal;
}
.ico-ext:before {
    content: '⤯';
    font-weight: normal;
}
.lang {
    display: inline-block;
    width: 20px;
    height: 100%;
    line-height: 100%;
    margin-left: 5px;
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center center;
}
.lang-pl {
    background-image: url('/img/lan/pl.png');
}



.link-ntv {
    position: relative;
    margin-left: 30px;
}

.link-ntv::before {
    content: "";
    display: inline-block;
    top: calc(50% - 12.5px);
    position: absolute;
    left: -30px;
    width: 25px;
    height: 25px;
    background-image: url('/img/ntv-25-25.png');
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center center;
}.chart {
    margin: 10px 0;
    font-family: Arial;
    filter: drop-shadow(2px 4px 6px rgb(0 0 0 / 0.2));
}
.chart text {
    user-select: none;
}


/* AXIS */
.chart .axis-title {
    text-anchor: middle;
    font-size: 16px;
    font-weight: bold;
    color: var(--color-txt);
    user-select: none;
}
.chart .axis text {
    text-anchor: end;
    font-size: 10px;
    color: var(--color-txt);
    user-select: none;
}


/* LEGEND */
.legend {
    fill: transparent;
    position: relative;
}
.legend text {
    stroke: none;
    fill: var(--color-txt);
    text-anchor: start middle;
    font-size: 10px;
    alignment-baseline: middle;
}


/* DATA GROUP [g] */
/*   > DATA BAR [rect] */
/*   > DATA LABEL [text] */
/*   > DATA LINE [path] */
.data-group {
    transition: transform 0.2s ease-in-out, filter 0.1s ease-in-out;
}
.data-group.hover:hover {
    filter: drop-shadow(3px 5px 4px var(--color-bg-alt));
    transform: translate(-2px, -4px);
}
.data-group .data-bar + .data-label {
    font-size: 14px;
    opacity: 0;
    transition: opacity 0.2s ease-in-out;
}
.data-group:hover .data-bar + .data-label {
    opacity: 1;
}
.data-group .data-line {
    stroke-width: 0.5;
}
.data-group .data-line.bold {
    stroke-width: 2;
}



.data-chord {
    stroke-width: 0.5;
    stroke: #fff;
    fill: var(--color-ac-1-alt);
}
.data-chord.hover:hover {
    stroke-width: 0.5;
    stroke: #000;
    fill: var(--color-ac-1);
}
.data-chord-node {
    stroke-width: 0.5;
}
.chord-label-group .chord-label {
    font-size: 10px;
    color: var(--color-txt);
    user-select: none;
}





/* SCROLLABLE CHART AREAS */
.chart-area-scroll {
    transition: transform 1s;
}
.scroll {
    opacity: 0.2;
    transition: opacity 0.2s;
}
.scroll:hover {
    cursor: pointer;
    filter: drop-shadow(3px 5px 4px var(--color-bg-alt));
    opacity: 0.4;
}.form {
    margin: 9px 0;
}
.form > div {
    margin: 12px 0;
}
.form > .form-field {
    border-bottom: 2px solid var(--color-ac-1);
    display: flex;
}
.form > .form-field > div {
    width: 50%;
    
}
.form > .form-field > div:nth-child(1) {
    color: var(--color-txt-alt);
    background-color: var(--color-ac-1);
}
.form > .form-field > div:nth-child(2) {
    text-align: center;
}
.form > .form-field > div > span {
    display: block;
    padding: 9px 12px;
}


.form .form-submit {
    display: flex;
    flex-direction: row-reverse;
}


.form input[type=text] ,.form input[type=password] {
    display: block;
    width: calc(100% - 24px);
    height: 100%;
    padding: 0 12px;
    margin: 0;
    border: none;
    outline: none;
    font-size: 22px;
    background-color: #fff4;
}
.form input[type=checkbox] {
    filter: hue-rotate(145deg) brightness(88%) saturate(61%);
    width: 25px;
    height: 25px;
    margin: 0 12px;
    border: none;
    outline: none;
    font-size: 22px;
    background-color: #fff4;

    display: table-cell;
    vertical-align: middle;
}
.form button {
    display: block;
    border: none;
    outline: none;
    color: var(--color-txt-alt);
    background-color: var(--color-ac-1);
    font-size: 22px;
    padding: 9px 12px;
}.ntv-menu {
    position: relative;
    overflow: hidden;
    display: flex;
    flex-wrap: nowrap;
    justify-content: center;
    gap: var(--spacing-2);
}
.ntv-menu .menu-bg {
    z-index: -2;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    overflow: hidden;
    background-color: var(--color-pg);
}
.ntv-menu .menu-bg video {
    position: absolute;
    left: 50%;
    width: auto;
    height: 100%;
    transform: translateX(-50%);
    padding: 0;
    margin: 0;
}
.ntv-menu .menu-item {
    width: calc(var(--spacing-3) * 13);
    position: relative;
    display: inline-block;
    padding: 0;
    margin: 0;
    height: var(--spacing-5);
}

.ntv-menu .menu-item.menu-home::before { background-image: url('/img/hdr/2/menu/home-4.gif'); }
.ntv-menu .menu-item.menu-stings::before { background-image: url('/img/hdr/2/menu/stings-4.gif'); }
.ntv-menu .menu-item.menu-teams::before { background-image: url('/img/hdr/2/menu/teams-4.gif'); }
.ntv-menu .menu-item.menu-stats::before { background-image: url('/img/hdr/2/menu/stats-4.gif'); }
.ntv-menu .menu-item.menu-home:not(.current-page)::before { background-image: url('/img/hdr/2/menu/home-3.gif'); }
.ntv-menu .menu-item.menu-stings:not(.current-page)::before { background-image: url('/img/hdr/2/menu/stings-3.gif'); }
.ntv-menu .menu-item.menu-teams:not(.current-page)::before { background-image: url('/img/hdr/2/menu/teams-3.gif'); }
.ntv-menu .menu-item.menu-stats:not(.current-page)::before { background-image: url('/img/hdr/2/menu/stats-3.gif'); }
.ntv-menu .menu-item.menu-home:hover::before { background-image: url('/img/hdr/2/menu/home-5.gif'); }
.ntv-menu .menu-item.menu-stings:hover::before { background-image: url('/img/hdr/2/menu/stings-5.gif'); }
.ntv-menu .menu-item.menu-teams:hover::before { background-image: url('/img/hdr/2/menu/teams-5.gif'); }
.ntv-menu .menu-item.menu-stats:hover::before { background-image: url('/img/hdr/2/menu/stats-5.gif'); }

.ntv-menu .menu-item.menu-home::after { display: none; background-image: url('/img/hdr/2/menu/home-3.gif'), url('/img/hdr/2/menu/home-4.gif'), url('/img/hdr/2/menu/home-5.gif'); }
.ntv-menu .menu-item.menu-stings::after { display: none; background-image: url('/img/hdr/2/menu/stings-3.gif'), url('/img/hdr/2/menu/stings-4.gif'), url('/img/hdr/2/menu/stings-5.gif'); }
.ntv-menu .menu-item.menu-teams::after { display: none; background-image: url('/img/hdr/2/menu/teams-3.gif'), url('/img/hdr/2/menu/teams-4.gif'), url('/img/hdr/2/menu/teams-5.gif'); }
.ntv-menu .menu-item.menu-stats::after { display: none; background-image: url('/img/hdr/2/menu/stats-3.gif'), url('/img/hdr/2/menu/stats-4.gif'), url('/img/hdr/2/menu/stats-5.gif'); }


.ntv-menu .menu-item::before {
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center center;
    z-index: -1;
    position: absolute;
    content: "";
    display: block;
    width: 100%;
    height: 100%;
}
.ntv-menu .menu-item a {
    z-index: 1000;
    position: relative;
    cursor: pointer;
    display: block;
    width: 100%;
    height: 100%;
    text-decoration: none;
}.split {
    display: flex;
    flex-wrap: nowrap;
    gap: var(--spacing-4);
}
.split > div {
    width: 50%;
}
@media (max-width: 1080px) {
    .split {
        flex-wrap: wrap;
    }
    .split > div {
        width: 100% !important;
    }
}




.flex {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: flex-start;
    align-items: flex-start;
    align-content: flex-start;
}.round {
    border-radius: 100%;;
}


/* POST LIST */
.post-list-simple {
    margin: var(--spacing-3) 0;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: flex-start;
    align-content: space-between;
    gap: var(--spacing-3);
}
.post-list-simple .post {
    display: flex;
    flex-wrap: wrap;
    width: 100%;
    justify-content: space-between;
    align-items: stretch;
    align-content: space-between;
    border: 2px solid var(--color-ac-1);
}
.post-list-simple .post > div {
    padding: 10px 20px;
}
.post-list-simple .post .date-short-text {
    width: 80px;
    color: var(--color-txt-alt);
    background-color: var(--color-ac-1);
}
.post-list-simple .post .post-text {
    width: calc(100% - 160px);
}


/* IMAGE GRID */
.image-grid {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: flex-start;
    align-items: flex-start;
    align-content: flex-start;
}
.grid-thumb {
    width: 350px;
    margin-bottom: 20px;
}
.grid-thumb a {
    text-decoration: none;
    color: var(--color-txt);
}
.grid-thumb .thumb {
    position: relative;
    width: 350px;
    height: 350px;
    background-size: contain;
    background-repeat: no-repeat;
    background-position: bottom center;
    filter: saturate(1);
    transition: transform 0.2s ease-in-out, filter 0.1s ease-in-out;
}
.grid-thumb .thumb:hover {
    filter: saturate(1.4) drop-shadow(4px 8px 8px var(--color-bg-alt));
    transform: scale(102%);
}
.grid-thumb .title {
    font-family: var(--font-title);
    font-size: 24px;
    padding: 5px 0;
    text-align: center;
    background-color: var(--color-ac-1);
    color: var(--color-txt-alt);
    margin-top: 20px;
}
.grid-thumb .desc {
    padding: 5px 0;
    text-align: center;
    background-color: var(--color-pg);
    border: 2px solid var(--color-ac-1);
    margin-bottom: 20px;
}


/* bullet lists */
ul.bullet-list {
    list-style: none;
    padding: 5px;
    margin: 0;
}
ul.bullet-list li {
    padding: 2px;
}
ul.bullet-list li::before {
    content: "◆";
    height: 100%;
    line-height: 100%;;
    color: var(--color-ac-1);
    margin: 0 10px;
}

/* LINK LIST */
.link-list {
    list-style: none;
    padding: 0;
    margin: 0;
}
.link-list .offline {
    color: var(--color-bad);
    text-decoration: line-through;
}
.link-list .offline:hover::after {
    content: "Offline";
    display: inline-block;
    height: 100%;
    margin-left: 20px;
    padding: 0 20px;
    color: var(--color-txt-alt);
    background-color: var(--color-ac-1);
}
.link-list li {
    position: relative;
    margin-left: 60px;
    height: 50px;
    line-height: 50px;
}
.link-list-amazon:before {
    position: absolute;
    top: 5px;
    left: -55px;
    content: "";
    display: block;
    width: 40px;
    height: 40px;
    background-image: url('/img/ext/amazon-150.png');
    background-size: contain;
}
.link-list-email:before {
    position: absolute;
    top: 5px;
    left: -55px;
    content: "";
    display: block;
    width: 40px;
    height: 40px;
    background-image: url('/img/ext/email-150.png');
    background-size: contain;
}
.link-list-facebook:before {
    position: absolute;
    top: 5px;
    left: -55px;
    content: "";
    display: block;
    width: 40px;
    height: 40px;
    background-image: url('/img/ext/facebook-150.png');
    background-size: contain;
}
.link-list-google-docs:before {
    position: absolute;
    top: 5px;
    left: -55px;
    content: "";
    display: block;
    width: 40px;
    height: 40px;
    background-image: url('/img/ext/google-docs-150.png');
    background-size: contain;
}
.link-list-google-drive:before {
    position: absolute;
    top: 5px;
    left: -55px;
    content: "";
    display: block;
    width: 40px;
    height: 40px;
    background-image: url('/img/ext/google-drive-150.png');
    background-size: contain;
}
.link-list-google-play:before {
    position: absolute;
    top: 5px;
    left: -55px;
    content: "";
    display: block;
    width: 40px;
    height: 40px;
    background-image: url('/img/ext/google-play-150.png');
    background-size: contain;
}
.link-list-instagram:before {
    position: absolute;
    top: 5px;
    left: -55px;
    content: "";
    display: block;
    width: 40px;
    height: 40px;
    background-image: url('/img/ext/instagram-150.png');
    background-size: contain;
}
.link-list-linkedin:before {
    position: absolute;
    top: 5px;
    left: -55px;
    content: "";
    display: block;
    width: 40px;
    height: 40px;
    background-image: url('/img/ext/linkedin-150.png');
    background-size: contain;
}
.link-list-periscope:before {
    position: absolute;
    top: 5px;
    left: -55px;
    content: "";
    display: block;
    width: 40px;
    height: 40px;
    background-image: url('/img/ext/periscope-150.png');
    background-size: contain;
}
.link-list-rss:before {
    position: absolute;
    top: 5px;
    left: -55px;
    content: "";
    display: block;
    width: 40px;
    height: 40px;
    background-image: url('/img/ext/rss-150.png');
    background-size: contain;
}
.link-list-tiktok:before {
    position: absolute;
    top: 5px;
    left: -55px;
    content: "";
    display: block;
    width: 40px;
    height: 40px;
    background-image: url('/img/ext/tiktok-150.png');
    background-size: contain;
}
.link-list-twitter:before {
    position: absolute;
    top: 5px;
    left: -55px;
    content: "";
    display: block;
    width: 40px;
    height: 40px;
    background-image: url('/img/ext/twitter-150.png');
    background-size: contain;
}
.link-list-website:before {
    position: absolute;
    top: 5px;
    left: -55px;
    content: "";
    display: block;
    width: 40px;
    height: 40px;
    background-image: url('/img/ext/website-150.png');
    background-size: contain;
}
.link-list-youtube:before {
    position: absolute;
    top: 5px;
    left: -55px;
    content: "";
    display: block;
    width: 40px;
    height: 40px;
    background-image: url('/img/ext/youtube-150.png');
    background-size: contain;
}
.sting-group {
    width: 100%;
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    gap: var(--spacing-2);
}
.sting-group-title {
    width: 100%;
    padding: var(--spacing-1) var(--spacing-3);
    margin: var(--spacing-2) 0;
    color: var(--color-txt-alt);
    background-color: var(--color-ac-1);
    font-family: var(--font-title);
    font-size: var(--spacing-4);
    line-height: var(--spacing-4);
    letter-spacing: var(--spacing-0);
}
.sting-group-description {
    margin: 0 0 0 var(--spacing-4);
    padding: var(--spacing-2);
}
.sting-list {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    gap: var(--spacing-3);
    width: 100%;
}

.sting {
    position: relative;
    width: 100%;
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    align-items: stretch;
    justify-content: space-between;
    background: linear-gradient(90deg, var(--color-ac-1-5), transparent);
}
.sting .editors-choice {
    filter: drop-shadow(0 0 4px #222);
    z-index: 10;
    position: absolute;
    top: calc( 0pc - var(--spacing-3) );
    left: calc( 0pc - var(--spacing-3) );
    width: var(--spacing-4);
    height: var(--spacing-4);
    background-image: url('/img/star.gif');
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center center;
}
.sting > .title {
    order: 1;
    color: var(--color-txt-alt);
    background-color: var(--color-ac-1);
    width: var(--spacing-4);
    padding: 0 var(--spacing-1);
    line-height: var(--spacing-4);
    font-size: calc( var(--spacing-4) );
    font-family: var(--font-title);
    letter-spacing: var(--spacing-0);
    writing-mode:vertical-rl;
    text-align: center;
    overflow: hidden;
}
.team-list {
    order: 2;
    width: calc( 100% - var(--spacing-4) );
    padding: var(--spacing-2);
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    gap: var(--spacing-3);
}

.team {
    position: relative;
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    align-items: center;
    justify-content: space-between;
    gap: var(--spacing-2);
    width: 100%;
}
.team > .logo {
    width: var(--spacing-6);
    height: var(--spacing-6);
    border-radius: 100%;
    order: 30;
    flex-shrink: 0;
    flex-grow: 0;
    transition: transform 0.1s ease-in-out, filter 0.05s ease-in-out;
}
.team > .logo:hover {
    filter: drop-shadow(1px 2px 2px var(--color-bg-alt));
    transform: scale(102%);
}
.team > .logo a {
    display: block;
    width: 100%;
    height: 100%;
    border-radius: 100%;
    cursor: pointer;
}
.video-list {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    gap: var(--spacing-2);
    width: 100%;
}
.video {
    position: relative;
    width: calc(50% - var(--spacing-1));
    height: var(--spacing-6);
    overflow: hidden;
    background: linear-gradient(90deg, var(--color-pg), var(--color-pg-5));
    box-shadow: var(--spacing-0) var(--spacing-0) var(--spacing-1) var(--spacing-0) var(--color-bg-2);
}
.split .video {
    width: 100%;
}
@media (max-width: 1080px) {
    .video {
        width: 100%;
    }
}
/* THUMB */
.video .thumb {
    position: absolute;
    top: 0;
    left: 0;
    width: var(--spacing-6);
    height: var(--spacing-6);
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center center;
}
.video .thumb a {
    display: block;
    width: 100%;
    height: 100%;
    cursor: pointer;
}

.video .summary-top {
    position: absolute;
    top: 0;
    left: calc(var(--spacing-6) + var(--spacing-2));
    width: calc(100% - (var(--spacing-6) + var(--spacing-2)));
    height: calc(var(--spacing-2) * 6);
    line-height: calc(var(--spacing-3) + var(--spacing-2));
    font-size: calc(var(--spacing-3) + var(--spacing-1));
    font-family: var(--font-body);
    overflow: hidden;
}
.video .summary-top .fb-posted-time {
    font-weight: bold;
    background-color: var(--color-ac-2-3);
    padding: 0 var(--spacing-1);
}
.video .summary-top .region {
    width: var(--spacing-4);
    height: var(--spacing-3);
}


.video .media {
    position: absolute;
    top: calc(var(--spacing-2) * 6);
    left: calc(var(--spacing-6) + var(--spacing-2));
    width: calc(100% - (var(--spacing-2) * 10) - var(--spacing-6));
    height: calc(var(--spacing-2) * 7);
}

.video .media .media-source {
    position: absolute;
    top: calc(var(--spacing-2) * 2);
    left: 0;
    width: var(--spacing-6);
    height: calc(var(--spacing-2) * 5);
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center center;
}
.video .media .media-source::before {
    display: block;
    position: absolute;
    top: calc(0px - (var(--spacing-2) * 2));
    content: "Media Source";
    width: 100%;
    height: calc(var(--spacing-2) * 2);
    text-decoration: underline;
    font-style: italic;
    text-align: center;
    line-height: calc(var(--spacing-2) * 2);
    font-size: calc(var(--spacing-2) + var(--spacing-1));
}
.video .media .media-source a {
    display: block;
    width: 100%;
    height: 100%;
    border-radius: var(--spacing-4);
    cursor: pointer;
}
.video .media .media-source.media-source-facebook.online {
    background-image: url('/img/watch/facebook-watch-540-150.png');
}
.video .media .media-source.media-source-facebook.offline {
    background-image: url('/img/watch/facebook-removed-540-150.png');
}

.video .media .media-mirror {
    position: absolute;
    top: calc(var(--spacing-2) * 2);
    left: calc(var(--spacing-6) + var(--spacing-2));
    width: var(--spacing-5);
    height: calc(var(--spacing-2) * 5);
    font-size: var(--spacing-3);
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    gap: var(--spacing-0) var(--spacing-1);
    padding: var(--spacing-1) 0;

}

.video .media .media-mirror > div {
    width: calc(50% - var(--spacing-0));
    height: var(--spacing-3);
    line-height: var(--spacing-3);
    font-size: calc( var(--spacing-1) * 3 );
}
.video .media .media-mirror > div:nth-child(1n+5) {
    display: none;
}
.video .media .media-mirror > div > a {
    display: block;
    width: 100%;
    height: 100%;
    text-decoration: none;
    text-align: center;
    color: var(--color-txt-alt);
    background-color: var(--color-ac-1);
    border-radius: var(--spacing-1);
}
.video .media .media-mirror > div > a:hover {
    color: var(--color-txt-alt);
    background-color: var(--color-ac-2);
}
.video .media .media-mirror > div > a:active {
    color: var(--color-txt);
    background-color: var(--color-ac-2-5);
}
.video .media .media-mirror::before {
    display: block;
    position: absolute;
    top: calc(0px - (var(--spacing-2) * 2));
    content: "Mirrors";
    width: 100%;
    height: calc(var(--spacing-2) * 2);
    text-decoration: underline;
    font-style: italic;
    text-align: center;
    line-height: calc(var(--spacing-2) * 2);
    font-size: calc(var(--spacing-2) + var(--spacing-1));
}

.video .media .media-download {
    display: none;
    position: absolute;
    top: calc(var(--spacing-2) * 2);
    left: calc(var(--spacing-6) + var(--spacing-5) + var(--spacing-2) + var(--spacing-2));
    width: var(--spacing-5);
    height: calc(var(--spacing-2) * 5);
    font-size: var(--spacing-3);
    text-align: center;
}
.video .media .media-download::before {
    display: block;
    position: absolute;
    top: calc(0px - (var(--spacing-2) * 2));
    content: "Download";
    width: 100%;
    height: calc(var(--spacing-2) * 2);
    text-decoration: underline;
    font-style: italic;
    text-align: center;
    line-height: calc(var(--spacing-2) * 2);
    font-size: calc(var(--spacing-2) + var(--spacing-1));
}


.video .quality {
    user-select: none;
    position: absolute;
    top: calc(var(--spacing-2) * 6);
    right: var(--spacing-2);
    width: calc(var(--spacing-2) * 7);
    height: calc(var(--spacing-2) * 6);
    text-align: center;
}
@media (max-width: 440px) {
    .video .quality {
        display: none;
    }
}
.video > .quality .quality-class.quality-hd {
    color: var(--color-txt-alt);
    background-color: #CFAB38;
}
.video > .quality .quality-class.quality-sd {
    color: var(--color-txt-alt);
    background-color: #A9AAAE;
}
.video > .quality .quality-class {
    width: calc(var(--spacing-2) * 6);
    margin: 0 auto;
    height: calc(var(--spacing-2) * 4);
    line-height: calc(var(--spacing-2) * 4);;
    font-size: calc(var(--spacing-2) * 3);;
    font-weight: bolder;
}
.video .quality .quality-label {
    color: var(--color-txt-alt);
    background-color: var(--color-bg);
    width: 100%;
    height: var(--spacing-3);
    line-height: var(--spacing-3);
    font-size: calc(var(--spacing-3) - var(--spacing-0));
}

.video > .links {
    display: none;
    position: absolute;
    top: 4px;
    left: 290px;
    width: calc(100% - 290px);
    height: 36px;
    font-size: 10px;
}
.video > .links ul {
    list-style: none;
    padding: 0;
    margin: 0;
}
.video > .links li {
    height: 12px;
    line-height: 12px;
    overflow: hidden;
}

.video > .summary-bottom {
    position: absolute;
    top: calc(var(--spacing-2) * 13);
    left: calc(var(--spacing-6) + var(--spacing-2));
    width: calc(100% - var(--spacing-6));
    height: calc(var(--spacing-2) * 3);
    line-height: calc(var(--spacing-3) + var(--spacing-2));
    font-size: var(--spacing-3);
    font-family: var(--font-body);
    font-style: italic;
    overflow: hidden;
}
/*#endregion */

.view-more {
    display: block;
    width: 100%;
    text-align: center;
    text-decoration: none;
    font-weight: bold;
    font-size: 24px;
    padding: 5px;
    margin: 5px 0;
}


/* no longer used */.pagination {
    font-family: var(--font-body);
    user-select: none;
    padding: var(--spacing-3);
    vertical-align: top;
    display: flex;
    justify-content: center;
    margin: var(--spacing-5) auto var(--spacing-3) auto;
}
.pagination .page {
    line-height: var(--spacing-5);
    font-size: var(--spacing-4);
    text-align: center;
    margin: 0;
    display: inline-block;
}
.pagination .page-button {
    background-color: var(--color-pg-alt);
}
.pagination .page-current {
    padding: 0 var(--spacing-4);
    background-color: var(--color-ac-1);
    color: var(--color-pg);
    font-weight: bold;
}

.pagination .page-button:not(.page-current):hover {
    background-color: var(--color-ac-1-alt);
}

.pagination .page-filler {
    padding: 0 var(--spacing-3);
    background-color: var(--color-pg-alt);
}
.pagination a {
    color: var(--color-txt);
    text-decoration: none;
    font-weight: bold;
    display: inline-block;
    padding: 0 var(--spacing-4);
    text-align: center;
    height: 100%;
}

.results-per-page {
    user-select: none;
    padding: var(--spacing-2);
    vertical-align: top;
    display: flex;
    justify-content: center;
    margin: var(--spacing-3) auto;
    font-size: var(--spacing-3);
}.cookie-consent {
    z-index: 999999;
    left: 0;
    position: fixed;
    bottom: 0;
    width: 100%;
    background-color: var(--color-ac-1);
    color: var(--color-txt-alt);
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: var(--spacing-3);
}
@media (max-width: 600px) {
    .cookie-consent {
        flex-direction: column;
    }
}
.cookie-consent > div {
    padding: var(--spacing-3);
}
.cookie-consent > .title {
    padding: var(--spacing-3);
    font-family: var(--font-title);
    line-height: var(--spacing-5);
    font-size: var(--spacing-5);
}
.cookie-consent > .content {
    width: calc(100% - var(--spacing-5) - var(--spacing-5));
    padding: var(--spacing-3);
    font-family: var(--font-body);
}
.cookie-consent > .content p {
    padding: 0 var(--spacing-1);
}
.cookie-consent > .cookie-accept {
    padding: var(--spacing-3);
    justify-self: flex-end;
}
.cookie-consent > .cookie-accept input[type="button"] {
    border: none;
    outline: none;
    padding: var(--spacing-2) var(--spacing-5);
    font-family: var(--font-title);
    color: var(--color-txt-alt);
    line-height: var(--spacing-5);
    font-size: var(--spacing-5);
    background-color: #fff4;
    cursor: pointer;
}
.cookie-consent > .cookie-accept input[type="button"]:hover {
    background-color: #fff6;
}
.video .summary-top .region {
    display: inline-block;
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center center;
}
.region.region-gb {
    background-image: url('/img/lan/gb.png');
}
.region.region-us {
    background-image: url('/img/lan/us.png');
}
.region.region-pl {
    background-image: url('/img/lan/pl.png');
}.controls {
    overflow: hidden;
    padding: 10px;
    margin: var(--spacing-3) 0;
    background-color: var(--color-ac-2);
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content:flex-end;
    align-items: flex-start;
    gap: 10px;
}
.controls .label {
    float: left;
    height: 30px;
}

.controls .control {
    float: right;
    top: 0;
    padding: 0 2px 0 5px;
    height: 30px;
    overflow: hidden;
    color: var(--color-txt-alt);
    background-color: var(--color-pg-5);
    font-family: var(--font-body);
    border: 1px solid var(--color-pg-5)
}

.control > div {
    user-select: none;
    height: 30px;
    font-size: 12px;
    display: flex;
    justify-content: center;
}
.control > div > div {
    height: 26px;
    padding: 4px 2px;
    line-height: 22px;
    display: inline-block;
}
.control input[type=radio] {
    display: none;
}
.control input[type=radio] + label {
    cursor: pointer;
    height: 22px;
    padding: 0 5px;
    margin: 0;
    display: inline-block;
    color: var(--color-txt-alt);
    background-color: var(--color-ac-2);
    border: 1px outset var(--color-ac-2);
}
.control input[type=radio]:checked + label {
    cursor: inherit;
    background-color: var(--color-bg-5);
    border: 1px inset var(--color-ac-2);
}
.control select {
    cursor: pointer;
    height: 22px;
    padding: 0 5px;
    margin: 4px 2px;
    display: inline-block;
    background-color: var(--color-bg-5);
    color: var(--color-txt-alt);
    outline: none;
    border: 1px inset var(--color-ac-2);
}
.control select:focus {
    background-color: var(--color-ac-2);
    border: 1px outset var(--color-ac-2);
}
.control select option  {
    background-color: var(--color-ac-2);
    color: var(--color-txt-alt);
    user-select: none;
}
.control select option:disabled  {
    color: var(--color-txt-alt);
}

.control select option::selection  {
    background-color: var(--color-ac-1);
    color: var(--color-pg);
}
.control .region {
    display: inline-block;
    line-height: 22px;
    width: 20px;
    height: 14px;
    margin: 4px 0;
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center center;
}.thumb {
    position: relative;
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center center; 
}
.thumb-400 {
    width: 400px;
    height: 400px;
    margin: 0 auto;
}

.thumb.noise::before {
    position: absolute;
    content: "";
    width: 100%;
    height: 100%;
    background-image: var(--bg-noise-01);
    opacity: 0.2;
}
.thumb.noise.round::before {
    border-radius: 100%;
}


.thumb.strobe::before {
    position: absolute;
    content: "";
    width: 100%;
    height: 100%;
    background: repeating-linear-gradient(to bottom, rgba(0,0,0,0.1), rgba(0,0,0,0.05) 6px, transparent 6px, transparent 12px);
    animation: effect-crt-strobing-small 0.7s linear infinite;
    opacity: 1;
}
.thumb.strobe.round::before {
    border-radius: 100%;
}