/*online*/

.col-a {width:660px}
#on-line {position:relative;  color: #263238;}
.dark #on-line {color:#fff}
#on-line {margin-left: 93px;}
#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 10px 0 #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;}
.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}

.online-carousel img.block {width:100%; height:auto}
.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; cursor:default; }

#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;}

.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}

#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 {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; width:40px; height:23px; vertical-align:middle}

#on-line-select.dropdown li .image img {display:block; width:30px; height:auto; margin:0 5px 0 0; vertical-align:initial}
#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:15px; height:10px; cursor:pointer; background:url(/u/icon/137/select.svg); background-position:18px -80px}
#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; 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 {color:#1B3E7A; text-decoration:underline}
#on-line-data .event a:hover {color:#102447}

#on-line-data .event a.webz-bg {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: #263238;}

#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:#FCE8E8}

#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}