@import "tables-fullscreen-plain.css";


body, html {
    height: 100%;
    font-size: 1.0em;
    white-space: nowrap;
}

div {
    /*border: 1px solid black;*/
    border: 0 solid black;
    margin: 2px;
    padding: 4px;
    min-width: 98%;
}

#countdown {
    margin: 0;
    padding: 0;
}

h2 {
    font-size: 1.2em;
    font-weight: bold;
}

h3 {
    font-size: 1.1em;
}

#main {
    display: flex;
    height: 100%;
    margin: 0;
}

#title {
    /*background-color: rgba(218,173,128, .60);*/
    /*border-radius: 15px;*/

    position: absolute;
    text-align: center;
    font-size: 3.5em;

    text-shadow:5px 5px 10px #daad80;

    font-weight: bold;

    /*left: 100px;*/
    left: 35px;
    top: 35px;
}

#qrCode {
    position: absolute;
    left: 14%;
    top: 85.5%;

    border-radius: 0;
}

#qrCode img {
    max-width: 74px;
}

div#logo {
    position: absolute;
    left: 725px;
    /*left: 890px;*/
    top: 5px;
}

#bambiniPause {
    position: absolute;
    text-align: center;
    left: 50%;
    transform: translate(-50%,5%);
    top: 155px;
    z-index: 99;

    max-width: 90%;
    max-height: 90%;

    background-color: rgba(218,173,128, .90);
    border-radius: 15px;

    font-size: 1.2em;
    font-weight: bold;
}

#bambiniPause div.roundedBorders {
    border-radius:12%;
    overflow:hidden;
}

#bambiniPause img {
    max-width: 1200px;
    max-height: 500px
}

#bambiniPause p {
    font-size: 0.8em;
    font-weight: normal;
}

#logo img {
    width: 340px;
    max-width: 340px;
}

#partnerLogo {
    position: absolute;
    left: 1200px;
    top: 40px;

    background-color: rgba(255, 255, 255, .60);
    border-radius: 5px;
}

#partnerLogo img {
    width: 120px;
    max-width: 120px;

    max-height: 120px;
}

#copy {
    position: fixed;
    bottom: 0;
    right: 75px;

    font-size: 0.9em;
    font-weight: normal;
}

.hidden {
    display: none;
    visibility: hidden;
}

#welcome {
    background-color: rgba(218,173,128, .60);
    border-radius: 15px;

    position: absolute;
    text-align: center;
    font-size: 2.5em;
    font-weight: bold;
    left: 45px;
    top: 177px;
}

#currentMatch {
    position: absolute;
    background-color: rgba(218,173,128, .60);
    border-radius: 15px;

    max-width: 600px;

    display: flex;
    align-items: center;
    justify-content: center;

    text-align: center;

    left: 45px;
    top: 147px;

    /*
    height: 100%;
    width: 800px;
     */

    font-weight: bold;
}
#currentMatch .matchTeam {
    font-size: 0.9em;
}

#nextMatches {
    position: absolute;
    background-color: rgba(218,173,128, .60);
    border-radius: 15px;

    text-align: left;

    left: 45px;
    top: 355px;

    font-size: 1.1em;
    /*line-height: 1.1em;*/
}

#nextMatches div {
    padding: 1px;
}

#currentTime {
    position: absolute;
    background-color: rgba(218,173,128, .60);
    border-radius: 12px;
    text-align: center;
    left: 25%;
    top: 86%;
}

#currentTime div {
    padding: 0px;
}

.currentTime {
    font-size: 2.5em;
    line-height: 0.8em;
    font-weight: bold;
}

.timeInfo {
    font-size: 1.5em;

    font-weight: normal;
}

p.nextMatchHeadline {
    text-decoration: underline black;
}

.winnerBox {
    text-align: center;
    font-size: 2.2em;
    line-height: 1.0em;
}

.finalBox {
    font-size: 2.5em;
}

p.nextMatch {
    padding-left: 10px;
}

#score {
    top: -20px;
    font-size: 2.5em;
    font-weight: bold;
    letter-spacing: 0.2em;

    padding: 20px;
}

#table {
    position: absolute;
    white-space: nowrap;
    top: 250px;
    left: 725px;
}

#currentMatch img {
    height: 80px;
    max-height: 80px;
    margin-bottom: 10px;
}

.bold {
    font-weight: bold;
}