/*online*/
html { --tgl-linkcolor: #1b3e7a }
html.dark { --tgl-linkcolor: #cfdcf1 }

/*.col-a { width: 660px; margin-left:0 }*/
#on-line { position: relative; color: #263238; }
.dark #on-line { color: #fff }
#on-line { margin-left: 75px; }
#wrapper #on-line { margin: 0 }

/*prepisy stylu v layout.css. nemelo by se toto nastavit rovnou tam?*/
.ico-r a span { background: no-repeat }
.ico-r a:hover span { background-color: transparent }
.ico-r .ico-min span { background-image: url(/u/icon/124/arrow-up.svg) }
.ico-r .ico-max span { background-image: url(/u/icon/124/arrow-down.svg) }

#wrapper .person-foto { border-width: 1px }

.online-top { padding: 1rem; background: linear-gradient(#EFF3F9 0, transparent 200px) }
.dark .online-top { background: linear-gradient(#546E7A 0, transparent 200px) }
#main .online-top { margin: -20px -15px 0; padding: 2rem 108px 2.5rem; /*text-shadow: 0 0 1px  #000000; */}
#wrapper .online-top { margin-top: -1em }

.online-top-box { margin: 0 0 1em }

.online-top-box h1 { margin: 0 0 0; font-size: 225%; line-height: 1.2; font-weight: 700; /*color:#263238*/ }
#wrapper .online-top-box h1 { font-size: 174% }
.online-top-box p, .online-top-box li { /*color:#263238*/ }

.online-top-box .date { font-size: 100% }

.online-top-box .state { display: block; margin: .1em .4em 0 0; text-transform: uppercase; font-size: 87.5%; font-weight: 600; color: #e41f1f }
.online-top-box .state:before { content: ''; display: inline-block; width: 1.2rem; height: 1.2rem; margin-right: .25rem; vertical-align: bottom; background: url('/u/icon/e11/live.svg') no-repeat; }


.online-carousel { position: relative; height: 265px; box-sizing: border-box; color: #fff; }
.online-carousel { padding: 1.5rem; /*border-radius: 6px;*/ }
#wrapper .online-carousel { height: auto; padding: 0; /*border-radius:0;*/ }

.online-carousel .mainphoto { position: absolute; left: 0; top: 0; width: 100%; height: 100%; overflow: hidden; border-radius: 6px; }
.online-carousel .mainphoto:after { content: ""; position: absolute; left: 0; top: 0; width: 100%; height: 100%; opacity: .8; background: #102447 }
#wrapper .online-carousel > .mainphoto { display: none }

/*nevyhovuje prilis nizkym obrazkum*/
.online-carousel img.block {width:100%; height:auto}
/*zatim nenasazene reseni
    .online-carousel img.block { width: auto; min-width: 100%; height: auto; min-height: 100%; max-width: 120%; max-height: 120%; }
*/
.online-carousel a, .online-carousel a:hover { color: #FFF }
.online-carousel .online-carousel-in { position: relative; }
#main .online-carousel .online-carousel-in { display: flex; padding-bottom: 1rem; }
#main .oc-item { margin-right: .25rem }

.online-carousel .oc-head { position: relative; padding: 0 .5rem; z-index: 1; text-decoration: none; line-height: 2rem; font-size: 87.5%; color: #FFF; border: solid 1px #fff; border-radius: 3px; cursor: pointer }
#wrapper .online-carousel .oc-head { padding: 0; font-weight: 700; font-size: 1rem }
.online-carousel .oc-head:hover { background: rgba(255,255,255,.2) }

.online-carousel .oc-content { display: none; position: absolute; top: 100%; left: 0; width: 100%; overflow: auto; }

.online-carousel.prep-1 .oc-1 .oc-head,
.online-carousel.prep-2 .oc-2 .oc-head,
.online-carousel.prep-3 .oc-3 .oc-head,
.online-carousel.prep-4 .oc-4 .oc-head,
.online-carousel.prep-5 .oc-5 .oc-head,
.online-carousel.prep-6 .oc-6 .oc-head,
.online-carousel.prep-1 .oc-1 .oc-head:hover,
.online-carousel.prep-2 .oc-2 .oc-head:hover,
.online-carousel.prep-3 .oc-3 .oc-head:hover,
.online-carousel.prep-4 .oc-4 .oc-head:hover,
.online-carousel.prep-5 .oc-5 .oc-head:hover,
.online-carousel.prep-6 .oc-6 .oc-head:hover { background: #fff; color: #102447; font-weight: 700; }

#main .online-carousel.prep-1 .oc-1 .oc-content,
#main .online-carousel.prep-2 .oc-2 .oc-content,
#main .online-carousel.prep-3 .oc-3 .oc-content,
#main .online-carousel.prep-4 .oc-4 .oc-content,
#main .online-carousel.prep-5 .oc-5 .oc-content,
#main .online-carousel.prep-6 .oc-6 .oc-content { display: block; overflow: visible }
/*overflow:visible kvuli zalozce primeho prenosu*/

#wrapper .oc-content { display: block; max-height: 0; transition: max-height 500ms; }
#wrapper .online-carousel.prep-1 .oc-1 .oc-content,
#wrapper .online-carousel.prep-2 .oc-2 .oc-content,
#wrapper .online-carousel.prep-3 .oc-3 .oc-content,
#wrapper .online-carousel.prep-4 .oc-4 .oc-content,
#wrapper .online-carousel.prep-5 .oc-5 .oc-content,
#wrapper .online-carousel.prep-6 .oc-6 .oc-content { max-height: 200vh; }
/*statistiky jsou dlouhe...*/

#wrapper .oc-item { display: block; position: relative; margin-bottom: .25rem; padding: 0.25rem .75rem; overflow: hidden; border-radius: 3px; background: #1b3e7a; box-shadow: 0 4px 8px 0 rgba(0,0,0,0.12); }
#wrapper .online-carousel .oc-head { position: relative; display: block; color: #fff; border: none; background: none; }
#wrapper .online-carousel .oc-head:after { content: ""; position: absolute; right: 0; top: .5rem; width: 1rem; height: 1rem; background: url(/u/icon/cdf/arrow-down.svg) no-repeat center; background-size: contain }

/*oc-item-block - nezaviratelny item*/
#wrapper .oc-item-block { border-radius: 6px; box-shadow: none }
#wrapper .oc-item-block .oc-head { display: none }

#wrapper .online-carousel.prep-1 .oc-1,
#wrapper .online-carousel.prep-2 .oc-2,
#wrapper .online-carousel.prep-3 .oc-3,
#wrapper .online-carousel.prep-4 .oc-4,
#wrapper .online-carousel.prep-5 .oc-5,
#wrapper .online-carousel.prep-6 .oc-6 { box-shadow: none; background: #102447; }

#wrapper .online-carousel.prep-1 #online-carousel-a1:after,
#wrapper .online-carousel.prep-2 #online-carousel-a2:after,
#wrapper .online-carousel.prep-3 #online-carousel-a3:after,
#wrapper .online-carousel.prep-4 #online-carousel-a4:after,
#wrapper .online-carousel.prep-5 #online-carousel-a5:after { transform: rotate(180deg) }

#wrapper .online-carousel .oc-content { position: relative; top: 0 }


.online-carousel .short-message li { flex: 1 1 0px; position: relative; padding-left: 15px; overflow: hidden; line-height: 1.6; margin: 0 0 0 1.5rem; font-size: 87.5%; }
.online-carousel .short-message li:before { content: ''; /*float:left;*/ position: absolute; left: 0px; top: 1px; width: 12px; height: 12px; margin: .2em .5em 0 0; border-radius: 3px; background: #cfdcf1 url(/u/icon/124/arrow3-right.svg) no-repeat center center; background-size: 8px }
.online-carousel .short-message li > *:first-child { display: block /*display:table-cell*/ }

#main .online-carousel .short-message { display: flex }
#main .online-carousel .short-message li { max-height: 11em; text-shadow: 0 0 10px #000000; }
#main .online-carousel .short-message li:first-child { margin: 0 }

#wrapper .online-carousel .short-message li { margin: 0 0 .5rem; }

.online-carousel .kolotoc { margin-top: -3.2rem; padding-top: 3.2rem }
.online-carousel-box .kolotoc { padding: 0 70px }
.online-carousel .kolotoc .kolotoc-nav { position: absolute; right: 0; top: 0; }
.online-carousel .kolotoc .kolotoc-nav a { width: 2rem; height: 2rem; border-radius: 0 3px 3px 0; background: #678AC6 url(/u/icon/fff/arrow2-right.svg) no-repeat center center; background-size: 1rem; }
.online-carousel .kolotoc a.ico-prev { transform: rotate(180deg) }

#main .online-carousel .kolotoc .box-in { overflow: hidden; width: 790px; margin: 0 auto }

.online-carousel .kolotoc li { float: left; list-style: none; }
.online-carousel .kolotoc .art-link { color: #FFF }
.online-carousel .kolotoc h3 { text-transform: none; font-weight: 600; font-size: 87.5%; line-height: 1.33; }
.online-carousel .kolotoc .art-img { position: relative; }
.online-carousel .kolotoc .art-img u { position: relative; display: block; width: 100%; height: 100%; margin: 0; padding: 0; cursor: pointer; overflow: hidden; background: transparent no-repeat 50% 0; background-size: cover; }

#wrapper .online-carousel .btn { margin-bottom: 1rem; color: #fff; font-weight: bold; border-radius: 3px; border: solid 1px #678ac6; background: #1b3e7a; }
#wrapper .online-carousel .kolotoc.expanded .btn { display: none; }

.online-carousel .kolotoc-clanky .art-link { display: flex; margin-bottom: 1rem; }
#wrapper .kolotoc-clanky .art-link { margin-bottom: 0.75rem; padding: 0; }
.online-carousel .kolotoc-clanky .art-img { flex: 0 0 auto; width: 96px; height: 72px; margin-right: 0.5rem; }
#wrapper .online-carousel .kolotoc-clanky .art-img { width: 72px; height: 56px; }

#main .kolotoc-clanky li { width: 244px; margin-right: 1rem }

#wrapper .kolotoc-clanky li { float: none; max-width: 360px; margin: auto }
#wrapper .kolotoc-clanky:not(.expanded) li:nth-child(n+3) { display: none }

.kolotoc-clanky .btn-more { max-width: 360px; margin: 0 auto 1rem; padding: .5rem; text-align: center; font-size: .825rem; cursor: pointer; border: solid 1px #678AC6; background: #1B3E7A; border-radius: 3px; }
#main .kolotoc-clanky .btn-more, .kolotoc-clanky.expanded .btn-more { display: none }

#main .kolotoc-videa li { width: 178px; margin-right: 1rem }
#wrapper .kolotoc-videa ul { display: flex; flex-wrap: wrap }
#wrapper .kolotoc-videa li { width: 48%; margin: 0 1% }

.kolotoc-videa .art-img { width: 100%; height: 0; padding-bottom: 56%; margin-bottom: 0.25rem; }
.online-carousel .kolotoc-videa .art-img u { position: absolute; left: 0; top: 0; width: 100%; height: 100% }
.online-carousel .mark-video span { width: 1em; height: 1em; bottom: 0.2em; right: 0.2em; font-size: 1.25rem; }


.arts-gallery ul { overflow: hidden; }
.arts-gallery li { float: left; width: 149px; list-style: none }
.online-carousel .arts-gallery li:first-child { width: 300px }
#wrapper .arts-gallery li { width: 33% }
#wrapper .arts-gallery li:first-child { width: 100%; }

.arts-gallery a { position: relative; display: block; box-sizing: border-box; margin: 0 1px 1px 0; }
.arts-gallery img { display: block; width: 100%; height: auto }
.arts-gallery a:hover:after { opacity: 1 }
.arts-gallery .more-gal { position: absolute; left: 0; top: 0; right: 0; bottom: 0; padding: 0 15px; display: flex; flex-direction: column; justify-content: center; text-align: center; font-size: .8rem; line-height: 1.2; background-color: rgb(103 138 198 / 80%); }
.arts-gallery .more-gal:hover { background-color: rgb(103 138 198 / 100%); }
.arts-gallery .more-gal b { display: block; font-weight: normal; font-size: 1.75rem }



#stream-prep { display: flex; flex-direction: row-reverse; align-items: flex-start; margin: 0 -1.5rem 0px; }
#wrapper #stream-prep { margin: 0; flex-direction: column-reverse }

.arts-stream h3 { display: none }
.arts-stream ul { margin: 0rem 1rem 0 0 }
.arts-stream li { position: relative; list-style: none; margin-bottom: 0.5rem; color: rgba(255,255,255,.7); min-width: 6rem; padding-left: 0.8rem; box-sizing: border-box; font-weight: 700; font-size: 87.5%; border-bottom: solid 2px rgba(255,255,255,0.2); cursor: pointer; }
#wrapper .arts-stream ul { margin: 0.5rem 0.5rem .5rem; }
#wrapper .arts-stream li { display: inline-block; min-width: 0; margin-right: .5rem; padding: 0; /* border-color:transparent*/ }


#stream-prep.prep-1 #stream-prep-a1, #stream-prep.prep-2 #stream-prep-a2, #stream-prep.prep-3 #stream-prep-a3, #stream-prep.prep-4 #stream-prep-a4, #stream-prep.prep-5 #stream-prep-a5, #stream-prep.prep-6 #stream-prep-a6, #stream-prep.prep-7 #stream-prep-a7, #stream-prep.prep-8 #stream-prep-a8, #stream-prep.prep-9 #stream-prep-a9, #stream-prep.prep-10 #stream-prep-a10 { color: #fff; cursor: auto; border-color: #fff; }
/*
#main .arts-stream li:before {content:""; position:absolute; left:0; top:6px; width:6px; height:6px;border-radius:100%;}
.arts-stream li:hover:before, #stream-prep.prep-1 #stream-prep-a1:before, #stream-prep.prep-2 #stream-prep-a2:before, #stream-prep.prep-3 #stream-prep-a3:before, #stream-prep.prep-4 #stream-prep-a4:before, #stream-prep.prep-5 #stream-prep-a5:before, #stream-prep.prep-6 #stream-prep-a6:before, #stream-prep.prep-7 #stream-prep-a7:before, #stream-prep.prep-8 #stream-prep-a8:before, #stream-prep.prep-9 #stream-prep-a9:before, #stream-prep.prep-10 #stream-prep-a10:before {
     background: #fff; }

*/
.arts-stream .video { display: none; width: 376px; margin: calc(-4.5rem - 2px) 0 0px; }
/*-2px ramecek navigacnich buttonu*/
#wrapper .arts-stream .video { width: 100%; margin: 0 0 0.5rem; }

.arts-stream .video.video-x { display: block }
#stream-prep.prep-1 .video-1, #stream-prep.prep-2 .video-2, #stream-prep.prep-3 .video-3, #stream-prep.prep-4 .video-4, #stream-prep.prep-5 .video-5, #stream-prep.prep-6 .video-6, #stream-prep.prep-7 .video-7, #stream-prep.prep-8 .video-8, #stream-prep.prep-9 .video-9, #stream-prep.prep-10 .video-10 { display: block; }
.arts-stream videoplayer + small { color: #aaa }
#main .arts-stream videoplayer + small { padding: 0 }
.arts-stream videoplayer.dummy:before { font-size: .5rem }


/* on-line */
/*#on-line-header {text-align:center; margin:0 0 1.3em}
#on-line-header, #on-line-header-top {zoom:1}
#on-line-header h1 {width:1000px; font-size:150%; font-weight:700; padding-left:0; padding-right:0}*/
/* float kvuli logum sportovnich on-linu */
/*#on-line-header h1 .team {float:left; width:40%; height:60px; line-height:60px; text-transform:uppercase; overflow:hidden; zoom:1}
#on-line-header h1 .tar {text-align:right}
#on-line-header h1 .tal {text-align:left}
#on-line-header h1 .score {float:left; width:20%; line-height:60px; text-align:center; font-size:112.5%}
#on-line-header .big {font-size:100%}
#on-line-header p {clear:both; margin-bottom:24px}*/

/*online col-b*/
.b-box { position: relative }
.b-box .show-box { position: absolute; top: 0; right: 0; z-index: 1 }
.b-box .show-box, .show-box a.ico-min, .show-box a.ico-max, .show-box-hid .box-in { display: none }
.q-js .b-box .show-box, .show-box-vis .box-in { display: block }
.show-box-vis a.ico-min, .show-box-hid a.ico-max { display: inline-block }
.b-box .three-foto { width: 100%; overflow: hidden; margin: 0 0 0.5em }
.b-box .three-foto img { float: left; margin: 0 21px 0 0 }
.b-box .three-foto a { float: left; width: 150% }


/*.blbox - modry box s kulatymi rohy a moznosti vysunuteho nadpisu; mohl by se dat nekam jako obecna struktura*/
.blbox { margin: .75rem 0 1.5rem; padding: 1.5rem; border-radius: 6px; font-size: .875rem; color: #263238; background: #EFF3F9 }
.blbox-head { display: table; margin: -2.25rem -.5rem .75rem; padding: 0.1875rem 0.5rem; text-transform: uppercase; font-size: .875rem; line-height: 1.286; font-weight: 800; border-radius: 3px; color: #fff; background: #1B3E7A; }
/*.blbox .blbox-head {margin:0 0 2rem -1rem}*/
.blbox-head a { display: block; margin: -0.1875rem -0.5rem; padding: 0.1875rem 0.5rem; color: #fff; text-decoration: none; cursor: pointer }
.blbox-head a:hover { text-decoration: underline }
.blbox-head:before { content: "" }

.blbox h2, .blbox-subtit { text-transform: uppercase; font-size: 1.25rem; letter-spacing: 2px; color: #263238 }
.blbox h2 { margin-bottom: 1rem; }
.blbox-subtit, .blbox-subtit a { font-family: Inter, sans-serif; color: #263238; font-size: 1.125rem }

/*prihlaseni a diskuse*/
.on-line-add-moot .inp { width: 100%; margin-bottom: 0.25rem; padding: 0.5rem; font-size: .875rem; border: none; border-radius: 3px; border: solid 1px #CFDCF1; box-shadow: inset 0 1px 4px rgb(0 0 0 / 20%); }
.on-line-add-moot .inp:focus { border-color: #1B3E7A }
.on-line-add-moot .inp::placeholder { color: #546e7a }

.on-line-add-moot.brief .moot-in { margin-bottom: .5rem; border-bottom: solid 1px #cfd8dc; }
#wrapper .on-line-add-moot.brief .moot-in { border-color: #546E7A }

.on-line-add-moot .moot-login, .on-line-add-moot .moot-editor { margin: 0 0 1em; }
.on-line-add-moot .bt { width: 100%; padding: .75rem; font-size: .875rem; font-weight: 600; border: none; border-radius: 3px; }
.blbox .on-line-add-moot .bt { color: #fff; background: #1B3E7A; }
#wrapper .online-carousel .on-line-add-moot .bt { color: #fff; background: #678AC6 }

/*pouze prihlaseni*/
.fl-inp { position: relative; margin: 0 0 .5rem; }
.fl-inp label { position: absolute; left: .75rem; top: .5rem; width: 100%; font-size: .75rem; color: #546e7a; font-weight: 600; }
.fl-inp input ~ label { float: none; width: auto }
.fl-inp .inp { padding-top: 1.5rem }

/*pouze diskuse*/
.moot-editor .inp { /*margin-bottom: 0.25rem; */ }

.blbox .show-box, #wrapper .online-carousel .show-box { display: none }


.on-line-add-moot .moot-login li { clear: both; display: inline; margin-right: 1em; line-height: 26px; font-size: 12px }
.on-line-add-moot .moot-login a { font-weight: 700; }
.on-line-add-moot .moot-in p { clear: both; margin: 0 0 0.5em; font-size: .8125rem; }
.on-line-add-moot .moot-in p + p { padding-top: .5rem; border-top: solid 1px #fff }
#wrapper .online-carousel .on-line-add-moot .moot-in p { border-color: #000 }

.q-js .on-line-add-moot.brief .hidden { display: none; }
.q-js .on-line-add-moot.briefly .hidden { display: none; }

.on-line-add-moot .ico-down { display: none; font-size: .85rem; }
.q-js .on-line-add-moot.brief .ico-down { display: block }
.on-line-add-moot .ico-down:after { content: ""; display: inline-block; width: .75rem; height: .75rem; margin-left: 0.3rem; background: url(/u/icon/124/arrow-down.svg) no-repeat center; background-size: contain; }
#wrapper .online-carousel .on-line-add-moot .ico-down:after { background-image: url(/u/icon/fff/arrow-down.svg) }

#on-line-diskuse-data { overflow: hidden; clear: both }
#on-line-diskuse-data p.highlight { color: #6E3C3C }
#on-line-diskuse-data p i { visibility: hidden; position: absolute; top: -5000px; left: -5000px }
#on-line-diskuse-data small { display: block; font-size: 10px; color: #546E7A; }
#on-line-diskuse-data b { display: block }
.blbox #on-line-diskuse-data b { color: #102447 }
#wrapper .online-carousel #on-line-diskuse-data b { color: #CFDCF1 }

.mujpas-prihlasen .moot-login, .q-prihlasen .moot-login, .moot-editor { display: none }
.mujpas-prihlasen .moot-editor, .q-prihlasen .moot-editor, .moot-login { display: block }


#on-line-art { margin: 0 0 22px }
#on-line-art.tit-img { font-size: 100% }
#on-line-art ul { list-style: none }
#on-line-art .box-in { margin: 0 0 0 10px }
#on-line-art .fl, #on-line-art .fr { width: 300px }
#on-line-art img, #on-line-art .mark-video { float: left; margin: 0 10px 0 0 }
#on-line-art .mark-video img { float: none; margin: 0 }
#on-line-art a { font-size: 87.5%; font-weight: 700; text-decoration: none }

.refresh-box, .refresh-box:first-child { position: relative; z-index: 12; margin: 0 0 .5rem; float: right; }

@media (max-width:600px), (min-width:1600px) {
    #wrapper .refresh-box { margin: 0 1rem .5rem; }
}

.refresh-box .webz-bg { position: static; display: inline-block; min-width: 0; width: auto; height: auto; padding: 0rem 0.6rem; color: #fff; font-weight: 800; text-transform: uppercase; border: none; line-height: 40px; border-radius: 3px; background: #678AC6 }
.refresh-box .webz-bg:hover { text-decoration: none; background: #1b3e7a }


.but-refresh { width: 20px; height: 20px; vertical-align: text-bottom; margin-right: 0.25rem; background: url(/o/spo/dc/refresh.svg) no-repeat center; background-size: contain }


.auto .but-refresh, .auto:hover .but-refresh { animation: ckw 2s linear infinite }

#wrapper .but-refresh { margin-right: 0 }
#wrapper .refresh-box .webz-bg span { display: none }


@keyframes ckw {
    0% { transform: rotate(360deg) }
    100% { transform: rotate(0deg) }
}

/*do layout.css - tam uz to je, jeste do m */
#on-line-data a.webz-bg, .on-line-data a.webz-bg { width: auto; height: 2.2em; line-height: 1.7; font-size: .75rem; color: #102447; box-sizing: border-box; border-radius: 3px; border-color: #CFDCF1; background: #CFDCF1; }


#on-line .but-sound { width: 36px; height: 36px; margin: 5px; background: url(/o/online/ico-sound.png) no-repeat center }
#on-line .sound-off .but-sound { background-position: 0 -256px }
#on-line .sound-off:hover .but-sound { background-position: -32px -256px }
#on-line .on-line-time { position: absolute; top: 22px; right: 10px; z-index: 2; width: 20em; white-space: normal; text-align: right; margin: 0; font-size: 68.75% }

#on-line-select { margin: 0 0 .5rem; font-size: .875rem }
#on-line-select:after { content: ""; display: block; clear: both; }

#wrapper #on-line-select { margin: 0 1rem .5rem; }

#on-line-select #sound-switch { position: relative; float: right; width: 32px; height: 32px; margin: -6px 0 0; left: -5px; overflow: hidden }
#on-line-select #sound-switch span { position: absolute; top: 0; left: 0; z-index: 1; display: block; width: 100%; height: 100%; background: url('/o/zpr/online/sound-switch.gif') no-repeat; cursor: pointer }
#on-line-select #sound-switch.sound-off span { background-position: 100% 100% }

#on-line-select ul { width: 550px; padding-left: 1em }
#on-line-select li { float: left; display: block; padding-right: 1em; white-space: nowrap }
#on-line-select li a { display: inline-block }
#on-line-select li img { width: auto; height: 1.3em; margin: .3em 0 0; vertical-align: top }

/*pro stare onliny s Online.setColors*/
#on-line.legend1 #on-line-select.inline .legend1, #on-line.legend2 #on-line-select.inline .legend2, #on-line.legend3 #on-line-select.inline .legend3,
#on-line.legend4 #on-line-select.inline .legend4, #on-line.legend5 #on-line-select.inline .legend5, #on-line.legend6 #on-line-select.inline .legend6,
#on-line.legend7 #on-line-select.inline .legend7, #on-line.legend8 #on-line-select.inline .legend8, #on-line.vse #on-line-select.inline .vse,
/*pro novejsi onliny*/
#on-line-select.inline .act a { color: #B9151C; text-decoration: none }


#on-line-select h4 { float: none; margin-bottom: 10px; padding-right: 1em; font-weight: 700; font-size: 100% }

#on-line-select.inline { padding-top: 0.75rem; }
div#on-line-select.inline li { margin: 0rem 0 0.5rem; }

#on-line-select.inline h4 { float: left; margin-top: -3px }
#on-line-select li img { margin-right: 3px }

#on-line-select li a:hover { text-decoration: underline }
#on-line-select.inline li .image { float: left; margin-top: -3px }
#on-line-select.dropdown li .image { /*display:table-cell;*/ display: inline-block; width: 40px; height: 23px; overflow: hidden; vertical-align: middle }

#on-line-select.dropdown li .image img, #on-line-select.dropdown li .image u { display: block; width: 30px; height: auto; margin: 0 5px 0 0; vertical-align: initial }
#on-line-select.dropdown li .image u { height: 23px }
#on-line-select.dropdown li .img-act { display: none }
#on-line-select.dropdown li span { /*display:table-cell; vertical-align:middle; height:100%*/ }
#on-line-select.dropdown li a.vse span, #on-line-select.dropdown li a.o-c3 span { padding-left: 40px }


#on-line-select.dropdown li a.vse:before,
#on-line-select.dropdown li a.o-c3:before { content: ''; position: absolute; left: 0px; top: 50%; width: 1rem; height: 1rem; margin: -0.5rem 0 0 0.5rem; background: url(/u/icon/68c/categories.svg) no-repeat; background-size: cover }
#on-line-select.dropdown li a.o-c3:before { background-image: url(/o/zpr/online/ico-filter-alert.png) }

#on-line-select.dropdown .act a { display: table; color: #fff; text-decoration: none; background: #024a92 }
#on-line-select.dropdown .act a .img-neact { display: none }
#on-line-select.dropdown .act a .img-act { display: block }

#on-line-select.dropdown { position: relative; height: 2.5rem; z-index: 10 }
#on-line-select.dropdown ul { position: relative; display: inline-block; float: none; width: auto; padding: .25rem 0; vertical-align: top; overflow: hidden; border-radius: 3px; background: #fff; border: solid 1px #cfdcf1; box-shadow: inset 0 1px 4px rgb(0 0 0 / 20%); }

#on-line-select.dropdown ul:after { content: ''; position: absolute; top: 14px; right: 10px; display: block; width: 10px; height: 10px; cursor: pointer; background: url(/u/icon/137/select.svg) no-repeat; }
#on-line-select.dropdown li { float: none; /*width:220px;*/ width: 200px; min-height: 0; margin: 0 }
#on-line-select.dropdown li a { position: relative; /*display:table;*/ display: flex; width: 100%; height: 30px; margin: 0; padding: 3px 30px 3px 5px; box-sizing: border-box; text-decoration: none; color: #102447; background: #fff }
#on-line-select.dropdown .closed li a { display: none }

#on-line-select.dropdown .act a, #on-line-select.dropdown .closed .act a { display: table; color: #102447; background: #fff }
#on-line-select.dropdown a:hover { text-decoration: none }
#on-line-select.dropdown ul li a:hover { text-decoration: underline; background: #ECEFF1 }

#on-line-data { margin: 0 0 1em }

/*nedavat overflow:hidden !!!! - */
#on-line-data .o-c1, #on-line-data .o-c2, #on-line-data .o-c3, #on-line-data .c1, #on-line-data .c2, #on-line-data .c3 { clear: both }


#on-line-data .time { float: left; width: 54px; min-height: 1px; padding: 0 0 .25rem; line-height: 1.2; text-align: center; font-size: 87.5%; font-weight: 800; font-feature-settings: normal; border-radius: 2px }
/*font-size 87.5% textu zpravy*/
#wrapper #on-line-data .time { padding: 0 0 .5rem; }


#on-line-data .time a { display: block; cursor: pointer; margin: 0 2px; padding-bottom: 2px }

#on-line-data .time-in { padding: 4px 0px; color: #263238; background: #EFF3F9; border-radius: 2px; }
#on-line-data .o-c3 .time-in { color: #FFF; background: #1B3E7A }

#on-line-data .time .date { font-size: 10px }

#on-line-data .time { position: relative; }
.time .time-date { display: none; position: absolute; right: 100%; top: 0; text-align: right; margin-right: -2px; padding: 4px 4px; white-space: nowrap; color: #263238; background: #EFF3F9; border-radius: 2px; }

.time:hover .time-date { display: block }

#on-line-data .event { display: block; line-height: 1.6; border: 0; padding: 0rem 0 0 .75rem; overflow: hidden; _overflow: visible }
#wrapper #on-line-data .event { clear: both; padding: 0; }

#on-line-data.with-images .event { position: relative; width: 519px; padding-left: 27px; min-height: 15px; _height: 15px }
#on-line-data.with-images .event img { position: absolute; top: 6px; left: 6px; z-index: 1 }
#on-line-copy { margin: 0 0 1em 10px; padding: 10px 0 0; background: url('/u/n3/art_dots.gif') repeat-x; font-size: 68.75% }
#on-line-data .event + .relative { margin-top: -10px; padding: 0 10px 10px; font-size: 87.5% }
#on-line-data .event a, .dark #on-line-data .event a:hover { color: var(--tgl-linkcolor); text-decoration: underline }
#on-line-data .event a:hover { color: #102447 }

#on-line-data .event a.webz-bg, #wrapper #on-line-data .event a.webz-bg { color: #1B3E7A; text-decoration: none }
#on-line-data .event a.webz-bg:hover { color: #fff }

#on-line-data .o-c0 { padding: 1em 0 }
#on-line-data .o-c0 .item { margin-top: 2rem; font-family: "Fira Sans"; font-size: 1.375rem; line-height: 1.2; letter-spacing: 2px; font-weight: 700 }


#on-line-data .o-c0 hr { display: block; height: 0; margin: .5em 0; border: 1px solid #678ac6 }
/*doplnky*/
#on-line-data .equip { margin: 0 }
#on-line-data .equ-img img { vertical-align: middle }
#on-line-data .equ-info { padding: 10px; font-size: 87.5%; border-top: 2px solid #FFF }

.online-box, .online-table, .online-fotogalerie { padding: 10px 10px 5px }
.col-b .online-box, .col-b .online-table { width: 280px }
.online-box .title, .online-table .title, .online-fotogalerie .title, .online-field h2.list-tit2 { float: left; margin-bottom: 0.5rem; line-height: 1.2; font-size: 1.25rem; letter-spacing: 2px; font-weight: 700; text-transform: uppercase; color: #263238 }
.online-box .show-box, .online-table .show-box, .online-fotogalerie .show-box { /*width:50%*/ }
.online-box .ico-r, .online-table .ico-r, .online-fotogalerie .ico-r { float: right; margin: 0 0 5px; font-size: .875rem; font-weight: bold }

.online-box .ico-r a, .online-table .ico-r a { margin-left: 10px; line-height: 1.2; }

.online-box .ico-r span, .online-table .ico-r span { width: .5rem; height: .5rem; background-position: center; }

.online-box ul { list-style: none }
.online-box p { margin: 0 0 .5em; font-size: 87.5% }


#wrapper .online-table, #wrapper .online-fotogalerie { padding: 0 }

/*prepis table .c1 a table .c2 z layout.css*/
.online-table table.c1, .online-table table .c1 { background: transparent }
.online-table table.c2, .online-table table .c2 { background: #EFF3F9 }


.online-table table { width: 100%; margin: 0 0 5px; border-collapse: collapse; font-size: 87.5% }



.online-table .col1 { width: 5% }
.online-table th, .online-table td { padding: 0.75rem 5px; }
#wrapper .online-table th, #wrapper .online-table td { padding: 0.5rem 5px; }
.online-table th { font-size: 11px; background: #EFF3F9; }
.online-table th:first-child { border-radius: 6px 0 0 6px }
.online-table th:last-child { border-radius: 0 6px 6px 0 }

.online-table td { background: #fff; border-bottom: 1px solid rgba(128,128,128,.1) }

/*funguje pouze pokud nadrazeny element nema overflow:hidden*/
#main .online-table table { position: relative }
#main .online-table th { position: sticky; top: 48px; }

/*#wrapper #on-line-add-results-content { margin-right: -1rem; overflow-x: scroll;}
#wrapper #on-line-add-results-content td:nth-child(2), #wrapper #on-line-add-results-content th:nth-child(2) {position: sticky; z-index: 1; left: 0;}
*/

#wrapper #on-line-add-results-content { margin-right: -1rem; overflow-x: scroll; max-height: 65vh }
#wrapper #on-line-add-results-content td:nth-child(2), #wrapper #on-line-add-results-content th:nth-child(2) { position: sticky; z-index: 1; left: 0; }
#wrapper #on-line-add-results-content th { position: sticky; top: 0px; }
#wrapper #on-line-add-results-content th:nth-child(2) { z-index: 2; }

/*sirky tabulky*/
.online-table .col-order { width: 1% }
.online-table .col-result { width: 10% }

.online-fotogalerie .box-in { overflow: hidden; width: 100% }
.online-fotogalerie .box-img { width: 110% }
.online-fotogalerie .box-img img { float: left; margin: 0 23px 5px 0; vertical-align: middle }
.online-fotogalerie .more { margin: 0 0 5px; font-size: 87.5% }

#on-line-video .video-wmv { padding-left: 10px }
#on-line-video #on-line-text a { display: block; margin: 0 0 22px; padding: 20px 20px 20px 200px; line-height: 45px; font-size: 131.25%; font-weight: 700; background: #ECEFF1 }
#on-line-video #on-line-text img { float: left; margin-right: 10px }

#on-line-wrapper .ico-r { margin-bottom: 12px }
#on-line-add-top-content.box-in { padding-bottom: 10px }

#on-line-add-results { }
#main #on-line-add-results { width: 620px; margin-left: -95px; }



#on-line-add-results table { width: 100%; margin-bottom: 5px; border-collapse: collapse; /*font-size:68.75%*/ }


#on-line-add-results .b th, #on-line-add-results .b td { background: #EFF6F1 }
#on-line-add-results .col1 { width: 9% }
#on-line-add-results .col3, #on-line-add-results .col4, #on-line-add-results .col5 { width: 18% }
#on-line-add-results-content .ico-r { margin: 0 0 5px }
#on-line-add-results-content .ico-r a, .q-js .choice #on-line-add-results-content .ico-r a.ico-pack { display: none }
.q-js #on-line-add-results-content .ico-r a.ico-pack, .q-js .choice #on-line-add-results-content .ico-r a.ico-unpack { display: block }
.q-js #on-line-add-results.choice .hidden { display: none }

.q-js .brief .box-in .hidden { display: none }
.q-js .brief .box-in .ico-down, .q-js .box-in .ico-top { display: inline-block }
.q-js .brief .box-in .ico-top, .q-js .box-in .ico-down,
.q-js .briefly .box-in .ico-top, .q-js .briefly .box-in .ico-down { display: none }

.flink { width: 100%; margin: 0 }
.flink a.left { float: left; font-weight: 700 }
.flink a.right { font-weight: 700 }

/*proc je to tady, kdyz on-line-in-art je v clanku?*/
/* misto tohoto prepisovani rozmeru by se mel spis zacilit velky online a jen tomu nastavit velke rozmery */
#on-line-in-art #on-line-data, #on-line-in-art #on-line-top { width: auto }
#on-line-in-art #on-line-data .event { width: 484px }
#on-line-in-art #on-line-data .time { border-right: 0 }

.tooltip-text:target { border: 1px dotted red }
.tooltip-simple { left: 50%; bottom: 50%; line-height: 22px; padding: 0 .5em; border: 1px solid #09F; color: #000; background: #FAFAFA; white-space: nowrap; font-size: 11px; cursor: default }

#on-line-add-twitter .tweet { margin-bottom: 3px; background: #f8f8f8; padding: 3px 5px }
#on-line-add-twitter .tweet span { color: #b7b7b7; margin-left: 3px }



/* ze sportovnich online - a proc je to tedy tady? */
.on-line-rivals { display: table; table-layout: fixed; width: 100%; line-height: 1.3; border: 1px solid #FFF; border-width: 1px 0; color: #000; }
.on-line-rivals .half { display: table-cell; width: 50%; padding: 1.5rem 1.5rem 1.5rem; vertical-align: top; border-radius: 6px; background-color: #EFF3F9; }
.on-line-rivals .half + .half { border-left: 1px solid #FFF }

.on-line-rivals h3 { display: flex; align-items: flex-end; min-height: 80px; margin: 0 0 1em; font-weight: 700; font-size: 112.5%; font-family: 'Inter', sans-serif; }
.on-line-rivals p { margin: 0 0 .5em; font-size: 87.5% }
.on-line-rivals .person-foto { float: right; width: 80px; height: 80px; }

#wrapper .on-line-rivals { padding: .5rem }
#wrapper .on-line-rivals h3 { min-height: 48px; font-size: 87.5% }
#wrapper .on-line-rivals p { font-size: 75% }
#wrapper .on-line-rivals .person-foto { width: 48px; height: 48px }


/* kde se pouziva?*/
.online-social { position: relative; margin: 0; z-index: 5 }
.online-social ul { list-style: none; position: absolute; width: 30px; right: 0; top: 0 }
.online-social li { position: relative; float: left; line-height: 21px; margin: 0 10px 10px 0 }

.online-social .logo-facebook, .online-social .logo-twitter, .online-social .logo-gplus, .online-social .logo-google, .online-social .logo-link, .online-social .logo-print { width: 30px; height: 30px; background: url(/o/zpr/online/social.png) }
.online-social .logo-facebook:hover, .online-social .logo-twitter:hover, .online-social .logo-gplus:hover, .online-social .logo-google:hover, .online-social .logo-link:hover, .online-social .logo-print:hover { background-image: url(/o/zpr/online/social-hover.png) }
.online-social .logo-facebook { background-position: 0 0 }
.online-social .logo-twitter { background-position: 0 -40px }
.online-social .logo-gplus, .online-social .logo-google { background-position: 0 -80px }
.online-social .logo-link { background-position: 0 -120px }
.online-social .logo-print { background-position: 0 -160px }


/* sdileni pripsevku */
.contribution-add { display: none; position: absolute; right: 1rem; bottom: 1.5rem; line-height: 25px; border-collapse: collapse; color: #FFF; background: none }
.contribution-add a, .contribution-add a:hover { display: block; margin: 0 0 0 20px; padding: 0; color: #FFF; /*background-color:#024a92*/ }
.contribution-add a:hover { }
.contribution-add .ico-close { direction: rtl; text-align: right; font-size: small }
.contribution-add .ico-close:before { height: 16px }

#on-line-data .o-c3 .contribution-add { display: block }

#on-line .ico-facebook:before, #on-line .ico-twitter:before,
#on-line .ico-link:before, #on-line .ico-print:before { content: ""; display: block; width: 16px; height: 16px; border-radius: 100%; }
#on-line .ico-facebook:before { background: url(/u/icon/org/social-facebook.svg); }
#on-line .ico-twitter:before { background: url(/u/icon/org/social-twitter.svg); }


#on-line-commentary { margin: 0 10px 1em }
#on-line-commentary h2, #on-line-commentary .list-tit2 { margin-left: 0 }
#on-line-commentary p { margin: 0 0 .5em; font-size: 93.75% }
#on-line-commentary .list-tit2 span, #on-line-commentary .list-tit2 a { text-transform: none; font-size: 13px; font-weight: normal; color: #333 }

#on-line-top { clear: both; margin: 0 1rem; padding: 1.5rem 0; font-weight: bold; line-height: 1.25; font-size: 1.125rem; }



#on-line-data .time + a[class*="legend"], #on-line-data .time + span[class*="legend"] { float: left; text-align: center; }
#main #on-line-data .time + a[class*="legend"], #main #on-line-data .time + span[class*="legend"] { clear: left; width: 54px; }
#wrapper #on-line-data .time + a[class*="legend"], #wrapper #on-line-data .time + span[class*="legend"] { margin: 0 0.5em; }



#on-line-data a[class*="legend"] img.legend { /*width: 20px;height: auto;*/ width: auto; height: 25px; float: none; }

#on-line-data .event a[class*="legend"] { float: left; margin-right: 0.5rem; margin-top: -3px; }
#on-line-data .event a.legend-right { float: right; margin: 5px 5px 5px 1rem }
/*5px kvuli stinu*/
#on-line-data .legend + .event, #on-line-data a[class*="legend"] + .event { min-height: 2rem }


#on-line-data a.webz-bg span:before, .on-line-data a.webz-bg span:before { display: none }

#on-line-data .event .header { overflow: hidden }
#on-line-data .event .header h4 { float: left; margin-right: 0.5rem; padding: 2px 0.5em; text-transform: uppercase; text-align: center; font-size: .875rem; font-weight: 600; color: #fff; border-radius: 2px; background-color: #1B3E7A; }


#on-line-data .anchor { position: relative; top: -4em }

#on-line-data > .o-c0, #on-line-data > .o-c1, #on-line-data > .o-c2, #on-line-data > .o-c3 { position: relative; padding: 1.5rem 1rem; color: inherit; }
#wrapper #on-line-data > .o-c0, #wrapper #on-line-data > .o-c1, #wrapper #on-line-data > .o-c2, #wrapper #on-line-data > .o-c3 { padding: 1rem 1rem; }
.dark #on-line-data .o-c3 { color:var(--txt-neutral90)}
.dark #on-line-data .o-c3 a { color:var(--txt-pri60) }

#on-line-data .o-c1:after, #on-line-data .o-c2:after { content: ""; position: absolute; left: 1rem; bottom: 0; width: calc(100% - 2rem); border-top: solid 1px #CFDCF1; }
#on-line-data .o-c3 { top: -1px; border: none; background: var(--tgl-sec05) }

#main #on-line-data .o-c3 { border-radius: 6px; }

#on-line-data .o-c3 + .o-c3 { margin-top: 2rem }

/*#on-line-data .event span {display:block}*/ /*nelze, v tenise jsou spany bez obsahu a delaji tam mezeru*/
#on-line-data .o-c3 .event, #wrapper #on-line-data .o-c3 .event { padding-bottom: 43px }

.o-comment-box { position: static }
.o-comment-box:before { display: none }
.o-comment-box a { position: static }
.o-comment-box .box-in { padding: 0 }
.o-comment-box .box-in:hover { background: none }
.o-comment-box p { font-style: normal; font-size: 122%; font-weight: 700; margin-bottom: 10px }
.o-comment-box h3 { bottom: 0; left: 210px; font-size: 122%; font-weight: 700 }
.o-comment-box h3 { position: static; float: right; font-size: 122%; font-weight: 700 }
.o-comment-box h3 small { font-size: 81.25%; font-weight: 400 }
.o-comment-box img { float: left; margin-top: 5px; width: 140px; height: auto; margin-right: 20px }

.o-glosa { line-height: 1.4 }
.o-glosa h3 { font-size: 114%; font-weight: 700; margin-bottom: 5px }
.o-glosa p { margin: 0.2rem 0; font-size: 114% }

.o-gal { position: static }
.o-gal a.webz-bg:after { display: none }
.o-gal p { margin: 2px 0; font-size: 84%; line-height: 1.33 }

.o-ank .header { padding: 0; background: none }
.o-vid .header { padding: 0; background: none }
.o-sta .header { padding: 0; background: none }
.o-ank .header h3, .o-sta .header h3 { font-size: 129% }
.o-host .img-ilu { position: absolute; left: 0; top: 65px }
.o-host h3 { font-size: 129%; font-weight: 700 }
.o-host p { margin-bottom: 5px }
.o-host a.webz-bg { margin-top: 5px }