/* CSS Document */
body {
    margin: 0px;}
/* pozadi */
body.hraccolor {
    background-color:#037a76;}
body.guardcolor {
    background-color: #ed1b76;}

body.main {
    background: url("obrazky/pozadi.jpg")
        no-repeat center center fixed;
    background-size: cover;
}

@media (max-device-width: 768px) {
    body.main {
        background: #ed1b76;}
}

footer {
    background-color: rgb(97, 97, 97);
    min-height: 50px;
    padding: 5px 0px 30px 0px;}
header {
    background-color: lightgray;
    padding: 0.5px;}

@media (max-device-width: 768px) {
    header {
        background-color: white;
        border: 4px, solid, black}
}

/* text */
h1.main {
    color: rgb(196, 4, 4);
    text-align: center;
    font-size: 400%;
    font-weight: bolder;}

@media (max-device-width: 768px) {
    h1.main {
    color: black;
    font-size: 350%;}
}

h1.pages {
    color: black;
    text-align: center;
    font-size: 250%;
    font-weight: 600;}
p { 
    color: black;
    text-align: center;
    line-height: 35px;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 200%;
    font-weight: 300;}
p.pravidla, p.zadost, a.pravidla {
    color: black;
    text-align: center;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 100%;
    font-weight: 300;}
h2.pravidla, h2.zadost {
    text-decoration: underline;}
p.tabulka {
    color: #037a76;
    text-align: center;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 200%;
    font-weight: 900;}
p.footer {
    color: black;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 100%;
    font-weight: bold;}
a.black {
    font-size: 200%;
    text-decoration: none;
    color: #000000;
    font-family: Arial, Helvetica, sans-serif;
    font-weight: bolder;}
a.white {
    color: white;
    text-decoration: none;
    font-size: 200%;
    font-family: Arial, Helvetica, sans-serif;
    font-weight: bolder;}
a.history {
    color: white;
    text-decoration: none;
    font-family: Arial, Helvetica, sans-serif;
    font-weight: bolder;}
h2.dotaz {
    color: black;
    text-decoration: none;
    font-family: Arial, Helvetica, sans-serif;
    font-weight: bolder;}

/* tabukla center*/
table.center {
    margin:auto;
    border-spacing: 0px;}

/* tabulka pravidla*/
table.ram {
    margin:auto;
    text-align: center;
    background: white;
    border: 4px, solid, gray;
    border-spacing: 10px;}
/* masle obrazek */
td.masle {
    vertical-align: bottom;
    border-width: 5px;
    border-style: none none solid none;
    border-color: black;}

/* rp download button */
td.RPmain {
    border-style: solid solid none solid;
    border-color:darkgrey;
    background-color:#037a76;
    border-width: 5px;
    text-align: center;}

/* "vote" buttons */
td.hanba {
    border-radius: 30px 30px 0px 0px;
    border-style: solid solid none solid;
    border-color: darkgrey;
    border-width: 5px;
    background-color:red;
    text-align: center;}
td.history {
    border-radius: 30px 30px 0px 0px;
    border-style: solid solid none solid;
    border-color: darkgrey;
    border-width: 5px;
    background-color:blue;
    text-align: center;}

/* "vote" buttons hover */
td.hanba:hover {
    border-radius: 30px 30px 0px 0px;
    border-style: solid solid none solid;
    border-color: darkgrey;
    border-width: 5px;
    background-image:linear-gradient(red, yellow);
    text-align: center;}
td.history:hover {
    border-radius: 30px 30px 0px 0px;
    border-style: solid solid none solid;
    border-color: darkgrey;
    border-width: 5px;
    background-image: linear-gradient(blue, yellow);
    text-align: center;}

/* pravidla button */
td.pravidla {
    border-style: solid;
    border-color: darkgrey;
    border-width: 5px 2.5px 0px 5px;
    background-color:#037a76;
    text-align: center;}
td.ukazka {
    border-style: solid;
    border-color: darkgrey;
    border-width: 5px 5px 0px 2.5px;
    background-color:#037a76;
    text-align: center;}
td.tym {
    height: 70px;
    border-style: solid;
    border-color:darkgrey;
    background-color:gray;
    border-width: 5px;
    text-align: center;}

/* buttons */
/* back button */
table.back {
    margin:auto;}
td.back {
    border-style: solid;
    border-color:black;
    border-radius: 5px;
    border-width: 5px;
    background-color:darkgrey;
    text-align: center;}

/* download button */
table.download {
    margin:auto;}
td.download {
    width: 25%;
    height: 15%;
    border-style: outset;
    border-color:rgb(124, 18, 18);
    border-radius: 15px;
    border-width: 5px;
    background-color:rgb(193, 8, 8);
    text-align: center;}
/* buttons end */

/* history page */
table.history {
    margin:auto;}
td.historypage {
    width: 50px;
    height: 50px;
    border-style: outset;
    border-color:#249f9c;
    border-radius: 10px;
    border-width: 5px;
    background-color:#037a76;
    text-align: center;}
td.historypageclear {
    width: 50px;
    height: 50px;
    text-align: center;}

/*event pages */
/* event tabulky */
table.event {
    margin:auto;
    border-style: solid;
    border-color:gray;
    border-radius: 10px;
    border-width: 5px;
    background-color:darkgrey}
td.rozpis1 {
    border-style: solid;
    border-color:gray;
    border-radius: 5px 0px 0px 5px;
    border-width: 5px 0px 5px 5px;
    background-color:whitesmoke;
    text-align: center;}
td.rozpis2 {
    border-style: solid;
    padding-left: 0px;
    border-color:gray;
    border-radius: 0px 5px 5px 0px;
    border-width: 5px 5px 5px 0px;
    background-color:whitesmoke;
    text-align: center;}
td.tabulka {
    border-style: solid;
    border-color:darkgrey;
    border-radius: 6px;
    border-width: 3px;
    background-color:whitesmoke;
    text-align: center;}

/* hraci nicky */
td.hracnickblank {
    border-style: solid;
    padding-right: 0px;
    border-color:black;
    border-radius: 5px 0px 0px 5px;
    border-width: 5px 0px 5px 5px;
    background-color:black;
    text-align: center;}
td.hracnick {
    border-style: solid;
    padding-right: 0px;
    border-color:black;
    border-radius: 5px 0px 0px 5px;
    border-width: 5px 0px 5px 5px;
    background-color:darkgrey;
    text-align: center;}
td.hraccislo {
    border-style: solid;
    padding-left: 0px;
    border-color:black;
    border-radius: 0px 5px 5px 0px;
    border-width: 5px 5px 5px 0px;
    background-color:black;
    text-align: center;}
td.hraccisloeliminovan {
    border-style: solid;
    padding-left: 0px;
    border-color:black;
    border-radius: 0px 5px 5px 0px;
    border-width: 5px 5px 5px 0px;
    background-color:rgb(200, 2, 2);
    text-align: center;}
td.hraccislowin {
    border-style: solid;
    padding-left: 0px;
    border-color:black;
    border-radius: 0px 5px 5px 0px;
    border-width: 5px 5px 5px 0px;
    background-color:rgb(36, 215, 0);
    text-align: center;}

/*team*/
@media (max-device-width: 768px) {
    .cleny_team {
        width: 40%;
    }
}
.cleny_team {
    border: 2px solid black;
    background-color: #f44786;
    min-width: fit-content;
    min-height: fit-content;
    text-align: center;
    align-items: center;
}
.blank {
    width: 200px;
}
.soucastny {
    text-align: center;
}
.byvaly {
    text-align: center;
    margin-top: 20px;
}
.footer {
    margin-top: 10px;
}
@media (min-device-width: 768px) {
    .grid_team {
        display: grid;
        grid-column-gap: 3px;
        grid-row-gap: 3px;
        width: 70%;
        height: 70%;
        justify-content: center;
        justify-self: center;

        grid-template-areas: 
        "header header header header header header"
        "soucastny soucastny soucastny soucastny soucastny soucastny"
        "_128 _128 jaso jaso siby siby"
        "marek marek kure kure s1ky s1ky"
        "blank1 canzzie canzzie deny deny blank2"
        "byvaly byvaly byvaly byvaly byvaly byvaly"
        "lucky lucky natt natt lozes lozes"
        "footer footer footer footer footer footer";
    }
}
/*
starý grid (nevím co mi jeblo že jsem ho dělal takhle xd)
.header {grid-area: 1/1/2/4;}
.soucastny {grid-area: 2/1/3/4;}

._128 {grid-area: 3/1/4/2; border: 2px solid black; background-color: #f44786;text-align: center;align-items: center;}
.jaso {grid-area: 3/2/4/3; border: 2px solid black; background-color: #f44786;text-align: center;align-items: center;}
.siby {grid-area: 3/3/4/4; border: 2px solid black; background-color: #f44786;text-align: center;align-items: center;}
.marek {grid-area: 4/1/5/2; border: 2px solid black; background-color: #f44786;text-align: center;align-items: center;}
.kure {grid-area: 4/2/5/3; border: 2px solid black; background-color: #f44786;text-align: center;align-items: center;}
.s1ky {grid-area: 4/3/5/4; border: 2px solid black; background-color: #f44786;text-align: center;align-items: center;}
.blank1 {grid-area: 5/1/6/2;}
.canzee {grid-area: 5/2/6/3; border: 2px solid black; background-color: #f44786;text-align: center;align-items: center;}
.blank2 {grid-area: 5/3/6/4;}

.lucky {grid-area: 7/1/8/2; border: 2px solid black; background-color: #f44786;text-align: center;align-items: center;}
.natt {grid-area: 7/2/8/3; border: 2px solid black; background-color: #f44786;text-align: center;align-items: center;}
.lozes {grid-area: 7/3/8/4; border: 2px solid black; background-color: #f44786;text-align: center;align-items: center;}


starý team table nahrazeno grid
table.team {
    width: 50%;
    margin:auto;
    border-style: solid;
    border-color:black;
    background-color:grey;
    border-width: 5px}
td.team {
    border-width: 5px;  
    border-style: solid;
    border-color:black;
    background-color:#f44786;
    text-align: center;}
*/

/* hanba */
table.hanba {
    margin:auto;
    border-width: 6px; 
    border-radius: 5px; 
    border-style: solid;
    border-color:black;
    background-color:gray;
    text-align: center;}
td.hanba1 {
    background-color: #037a76;
    border-color: #249f9c;
    border-width: 8px;
    border-radius: 5px 0px 0px 5px;
    border-style: solid none solid solid;}
td.hanba2 {
    background-color: #037a76;
    border-color: #249f9c;
    border-width:8px;
    border-radius: 0px 5px 5px 0px;
    border-style: solid solid solid none;}
td.hanba3 {
    border-color:seagreen;
    border-width: 7px;
    border-radius: 5px 0px 0px 5px;
    border-style: solid none solid solid;}
td.hanba4 {
    border-color: seagreen;
    border-width:7px;
    border-radius: 0px 5px 5px 0px;
    border-style: solid solid solid none;}


/* next event timer */
table.next_event {
    row-gap: 0%;
    width: 40%;
    margin:auto;
    border-spacing: 0px;}
td.next_event_text {
    height: 40px;
    border-width: 4px;
    border-style: solid;
    border-color:black;
    background-color: lightgray;
    text-align: center;}
td.next_event_time {
    line-height: 5px;
    width: 70px;
    height: 70px;
    border-width: 4px;
    border-style: none solid solid solid;
    border-color:black;
    background-color: lightgray;
    color: white;
    text-align: center;}

@media (max-device-width: 768px) {
    td.next_event_time {
        border-color:black;
        background-color: white;
        color: black;}}

@media (max-device-width: 768px) {
    td.next_event_text {
    border-width: 0px,4px,4px,4px;
    border-style: solid;
    background-color: white;}}