*, 
*:after, 
*:before {
    box-sizing: border-box;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    margin: 0;
    padding: 0;
}
html {width: 100%; height: 100%;}
body {
    height: 100%;
    width: 100%;
    background-color: #222;
    font-family: -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Oxygen-Sans, Ubuntu, Cantarell, Helvetica Neue, sans-serif;
    background-size: auto 100%, cover;
    background-position-x: center;
    background-attachment: fixed, fixed;
    background-repeat: repeat-y, no-repeat;
    background-position: 50%, 50%;
}

.pozadi1 {background-image: linear-gradient(to right, #222 0%, #222 10%, transparent 50%, #222 90%, #222 100%), url('/.images/img00001.jpg');}
.pozadi2 {background-image: linear-gradient(to right, #222 0%, #222 10%, transparent 50%, #222 90%, #222 100%), url('/.images/2.jpg')}
.pozadi3 {background-image: linear-gradient(to right, #222 0%, #222 10%, transparent 50%, #222 90%, #222 100%), url('/.images/3.jpg')}
.pozadi4 {background-image: linear-gradient(to right, #222 0%, #222 10%, transparent 50%, #222 90%, #222 100%), url('/.images/4.jpg')}
.pozadi5 {background-image: linear-gradient(to right, #222 0%, #222 10%, transparent 50%, #222 90%, #222 100%), url('/.images/5.jpg')}
.pozadi6 {background-image: linear-gradient(to right, #222 0%, #222 10%, transparent 50%, #222 90%, #222 100%), url('/.images/6.jpg')}
.content {width: 80%; min-width: 1280px; margin: 0 auto; padding: 0 20px}
h1 {font-size: 4em; color: #FFF; text-align: center; text-shadow: 1px 0 2px #FFF, 0 1px 2px #FFF, -1px 0 2px #FFF, 0 -1px 2px #FFF, 1px 2px 10px #FF0000; position: absolute; bottom: 125px; left: 0; right: 0}
h2 {text-align: center; font-size: 45px; text-decoration: none; padding: 0 0 15px 0}
a {color: #FFF; text-decoration: none}
.header {width: 100%; height: 300px; position: relative}
.neoficialni_web {position: absolute; right: 0; top: 10px; color: #FFF; font-size: 25px; }
ul {position: absolute; bottom: 15px}
li {display: inline-block; list-style-type: none; margin: 0 15px}
li a {font-size: 25px; font-weight: bold; background-image: linear-gradient(to top, #FFF 5px, transparent 5px, #FFF 5px, transparent 100%); border-radius: 3px; padding: 5px 10px; text-shadow: 1px 0 1px #000, 0 1px 1px #000, -1px 0 1px #000, 0 -1px 1px #000, 1px 1px 10px #000}
li a:hover, .aktivni {background-image: linear-gradient(to top, #999 5px, #999 5px, transparent 100%); text-decoration: underline}
.obsah {background: #000; background: rgba(0, 0, 0, 0.6); width: calc(100%-60px); box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19); color: #FFF; padding: 20px 30px; border-radius: 10px; margin-bottom: 30px}
.center {text-align: center}
.display-ib {display: inline-block}

@media screen and (max-width: 1024px) {
    .content {min-width: 100%; padding: 0}
    h1 {font-size: 30px}
    h2 {font-size: 1.5rem}
    .neoficialni_web {position: absolute; right: 0; top: 10px; font-size: 20px; }
    .obsah {padding: 10px 5px; border-radius: 0; margin-bottom: 0}
    li a {font-size: 15px}
}
.uvod .hlavni {width: 70%; display: inline-block}
.uvod .sideBar {width: 30%; display: inline-block}
.uvod h3 {text-align: center}
.uvod h4 {text-align: center; padding-top: 15px}
.uvod .poradi {width: 15%}
.uvod .druzstvo {width: 70%}
.uvod .body {width: 15%}
@media screen and (max-width: 1024px) {
    .uvod .hlavni {width: 100%; display: block}
    .uvod .sideBar {width: 100%; display: block}
}



#souteze {width: 80%; margin: 0 auto}
#souteze div {border-bottom: 1px solid #333; display: inline-flex; align-items: center; height: 28px; vertical-align: bottom; justify-content: center; text-align: center}
#souteze div.datum, #souteze div.mapa, #souteze div.vysledky, #souteze div.zacatek {width: 10%}
#souteze div.nazev {width: 50%; justify-content: flex-start}
@media screen and (max-width: 1024px) {
    #souteze {width: 100%; font-size: 0.7rem}
}

.copyright {text-align: center; width: 100%; padding-top: 20px}

#vysledky img {padding-top: 1px; padding-right: 2px}
#vysledky .vyberKategorie {width: 300px; background: #444; border-radius: 20px; margin: 10px auto}
#vysledky .vyberKategorie a {width: 150px; text-align: center; display: inline-block; padding: 10px 0; font-weight: bold}
#vysledky .vyberKategorie a.zeny {background: #ff66cc; border-radius: 20px}
#vysledky .vyberKategorie a.muzi {background: #0099ff; border-radius: 20px}
#vyberRoku {text-align: center; width: 100%; padding: 10px}
#vyberRoku select, #vyberRoku option {color: #000}
#vysledky #vyberRoku a {margin: 3px 5px; font-weight: bold}
#vysledky #vyberRoku #aktivniRok {text-decoration: underline}
#vysledky .select {color: #FFF; background-color: #222}
#vysledky .select option {color: #FFF; background-color: #222}
#vysledky td a:hover {text-shadow: none; color: #FFF}
#vysledky .hover:hover {background-color: #444}
#vysledky td {width: auto; height: auto}
#vysledky .cas {width: 6%; height: auto}
#vysledky .poradi, #vysledky .casBody {width: 6%; font-size: 25px}
#vysledky .cas a {color: #FFF; text-decoration: none}
#vysledky table {width: 100%; text-align: center; border: 1px solid #555}
#vysledky .td-souteze {padding-bottom: 10px}
@media screen and (max-width: 1024px) {
    #vysledky .poradi, #vysledky .casBody {font-size: 12px}
    #vysledky table {font-size: 9px; width: 380px}
    #vysledky .cas {width: 25px}
    #vysledky .td-souteze img {width: 16px}
    #vysledky .td-souteze {text-align: center; padding-left: 5px}

}

#vysledky #aktualizovat_cas {margin: 0px 20px}
#vysledky #aktualizovat_cas label {display: block; padding: 5px 0px 2px 5px}
#vysledky #aktualizovat_cas input {color: #000; display: block}
#vysledky #aktualizovat_cas span {color: #666; display: block; padding: 5px 5px; font-style: italic}
#vysledky #aktualizovat_cas #tlacitko {padding: 3px 3px; font-weight: bold; margin-left: 20px}



.pravidla iframe {width: 793px; height: 1122px}
@media screen and (max-width: 1024px) {
    .pravidla iframe {width: 100%; height: 1000px}
}

.navstevni_kniha .prispevek {background-color: rgba(50,50,50,0.7); border-radius: 5px; margin: 5px; text-align: left; padding: 10px; text-align: justify}
.navstevni_kniha .prispevek h4 {display: inline-block; padding-right: 3px}
.navstevni_kniha .prispevek .info {display: inline-block}
.navstevni_kniha .prispevek .info i {padding-right: 5px}
.navstevni_kniha .prispevek .info a {padding-left: 5px}
.navstevni_kniha .prispevek .reakce {display: inline-block; width: 80%; margin: 5px 10%; text-align: justify; background-color: rgba(70,70,70,0.7); border-radius: 5px; padding: 10px}

.navstevni_kniha .formular {background-color: rgba(50,50,50,0.7); border-radius: 5px; padding: 10px; width: 50%; margin: 0 auto}
.navstevni_kniha .formular i {margin-right: 5px}
.navstevni_kniha .formular input, .navstevni_kniha .formular textarea {display: block; width: 90%; margin: 5px 5%; background-color: rgba(70,70,70,0.7); border: 1px solid rgba(30,30,30,0.7); padding: 10px; color: #FFF; border-radius: 5px}
.navstevni_kniha .formular img {margin-right: 3px}
.navstevni_kniha .formular input[type='submit'],.navstevni_kniha .formular input[type='reset'] {width: 44.5%; display: inline-block; margin: 0}
.navstevni_kniha .formular input[type='submit']:hover,.navstevni_kniha .formular input[type='reset']:hover {background-color: rgba(90,90,90,0.8)}
.navstevni_kniha .formular textarea {height: 80px; font-family: -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Oxygen-Sans, Ubuntu, Cantarell, Helvetica Neue, sans-serif;}
.navstevni_kniha .strankovani {padding: 5px}

@media screen and (max-width: 1024px) {
    .navstevni_kniha .formular {width: 100%}
}