
/* Panel for all, from different date and time */
.all-events-panel {
    width: 100%;
}
    /* All event starting at the same time */
    .all-events-panel > div {
        display: flex;
        flex-wrap: wrap;
        justify-content: center;
    }
        /* Events panel */
        .all-events-panel > div > div {
            display: flex;
            flex-wrap: wrap;
            width: 35em;
        }
            /* Event panel */
            .all-events-panel > div > div > div {
                flex-basis: 35em;
                margin-bottom: 4px;
            }
                /* Event info */
                .all-events-panel > div > div > div > div:nth-child(1) {
                    font-size: 70%;
                    color: #2d3e50;
                    padding: 0 5px;
                    text-decoration: underline;
                }
                /* Panel score */
                .all-events-panel > div > div > div > div:nth-child(2) > div > div input {
                    width: 100%;
                    line-height: 40px;
                }
                /* pnl-score-shootout */
                .all-events-panel > div > div > div > div:nth-child(2) .pnl-score-shootout {
                    display: none;
                }
    /* shootout */
    .all-events-panel .score > div > span {
        font-size: 70%;
    }


@media only screen and (min-width: calc(70em + 32px)) {
    /* Events panel */
    .all-events-panel > div > div {
        width: 70em;
    }
}

@media only screen and (min-width: calc(105em + 32px)) {
    /* Events panel */
    .all-events-panel > div > div {
        width: 105em;
    }
}

.events-container {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    white-space: nowrap;
}

.event {
    margin-bottom: 4px;
    flex-basis: 420px;
}

.date {
    color: white;
    background-color: orange;
    padding-left: 5px;
}

/* .field { */
/*     text-align: end; */
/*     color: white; */
/*     background-color: orange; */
/*     padding-right: 5px; */
/* } */

.team1 {
    text-align: right;
}

.team2 {
    text-align: left;
}

.team-name-logo-pnl1 {
    display: flex;
    align-items: center;
    flex-direction: column-reverse;
}

.team-name-logo-pnl2 {
    display: flex;
    flex-direction: column;
    align-items: center;
}

@media (min-width: 48em) {
    .team-name-logo-pnl1 {
        display: flex;
        flex-direction: row;
        justify-content: end;
    }

        .team-name-logo-pnl1 > span:first-child {
            margin-right: 3px;
        }

    .team-name-logo-pnl2 {
        display: flex;
        flex-direction: row;
        justify-content: start;
    }

        .team-name-logo-pnl2 > span:first-child {
            margin-right: 3px;
        }
}

.score, .team-name, .field, .score-edit {
    text-align: center;
}

    .score > div, .team-name > div, .date > div, .field > div, .score-edit > div {
        display: inline;
        vertical-align: middle;
    }

.score-edit {
    display: flex;
    justify-content: space-around;
}

    .score-edit > input {
        width: 45%;
    }

.field {
    font-size: smaller;
}

    .score > div, .field > div {
        color: white;
        background-color: #2d3e50;
        border-radius: 5px;
        padding: 5px;
    }

    .score:before, .team-name:before, .date:before, .field:before {
        content: '';
        display: inline-block;
        height: 100%;
        vertical-align: middle;
    }

.winner {
    font-weight: bold;
}

.flag {
    vertical-align: bottom;
}

@media only screen and (min-width: 48em) {

    .event {
        margin-bottom: 4px;
        flex-basis: 500px;
    }
}

/* @media only screen and (min-width: 80em) { */
.edit-events-container {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
}

.edit-event {
    margin-bottom: 4px;
    flex-basis: 550px;
    display: flex;
    flex-direction: column;
    flex-wrap: wrap;
    align-items: stretch;
}
/* } */

.group-members {
    list-style-type: none; /* Remove bullets */
    padding: 0; /* Remove padding */
    margin: 0; /* Remove margins */
}

.ranks-container {
    display: flex;
    justify-content: center;
    flex-direction: column;
    overflow-x: scroll;
    white-space: nowrap;
}

.flag-team-inline {
    display: flex;
    align-items: center;
}

    .flag-team-inline > .flag {
        margin-right: 5px;
    }

.header-date {
    color: #34495e;
    font-size: 100%;
    display: flex;
    width: 100%;
    justify-content: center;
    align-items: center;
    text-align: center;
}

    .header-date:before, .header-date:after {
        content: '';
        border-top: 1px solid;
        margin: 0 20px 0 0;
        flex: 1 0 20px;
        filter: brightness(200%);
    }

    .header-date:after {
        margin: 0 0 0 20px;
    }



.group-phase-finale {
    padding-right: 15px
}

    .group-phase-finale p {
        text-align: justify;
    }

.edit-event-info {
    font-size: 70%;
    color: #2d3e50;
    padding: 0 5px;
    text-decoration: underline;
}

.edit-event-event {
    padding: 5px 0 10px 0;
}

.bg-champions-league {
    height: 40px;
    width: 27.168px;
    display: inline-block;
    background-size: 100vw 100vh;
    background: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" width="27.168" height="40" overflow="visible" version="1.0"><path fill="#00f" d="M6.262 7.001s-.132 1.175-.574.271c-.44-.903.75-2.936.75-4.607C6.438.994 5.115 0 3.66 0S-.043 1.626 0 5.691c.442 6.82 2.504 12.968 4.498 17.887 2.16 5.33 3.44 5.466 4.718 7.227.468.646 1.852 2.575 1.852 3.885 0 1.31-1.72 1.13-2.866 1.58-1.146.453-1.411 1.988-1.411 1.988s.132.407 2.601 1.265c.939.326 2.425.497 4.19.475V7.001Zm-5.159 1.22c-.617-3.569.044-6.82 2.293-7.182 2.204.09 2.03 1.446 2.072 2.213.044.813-1.01 2.078-.882 3.75.177 2.303 1.632 3.116 1.632 3.116s.088.677-.441 1.4c-.53.723-1.5.949-1.5.949s-.02 3.19.706 6.414c1.19 5.285 2.557 8.943 2.557 8.943S3.376 21.361 1.103 8.221zm12.484-1.22v32.997c1.764.022 3.25-.149 4.19-.475 2.468-.858 2.6-1.265 2.6-1.265s-.264-1.536-1.41-1.987C17.82 35.819 16.1 36 16.1 34.69s1.383-3.24 1.852-3.885c1.278-1.761 2.557-1.897 4.717-7.227 1.995-4.919 4.057-11.066 4.498-17.887C27.212 1.626 24.963 0 23.508 0S20.73.994 20.73 2.665s1.19 3.704.75 4.607c-.441.904-.574-.27-.574-.27zm6.041 20.823s1.367-3.659 2.557-8.943c.727-3.224.706-6.414.706-6.414s-.97-.226-1.5-.949c-.528-.723-.44-1.4-.44-1.4S22.406 9.305 22.582 7c.128-1.672-.925-2.936-.882-3.749.042-.767-.132-2.123 2.073-2.213 2.249.361 2.91 3.613 2.293 7.182-2.273 13.14-6.438 19.603-6.438 19.603z"/></svg>');
}

.bg-europa-league {
    height: 40px;
    width: 17.51px;
    display: inline-block;
    background-size: 100vw 100vh;
    background: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="17.343" height="40" fill-rule="evenodd" stroke-linejoin="round" stroke-miterlimit="2" clip-rule="evenodd"><path d="M2.945 36.54 1.678 40h13.986L14.4 36.54H2.944Zm3.473-11.414c-.626-3.915-1.89-8.496-1.89-8.496 1.66 10.15-1.074 18.231-1.074 18.231h10.433C9.048 17.09 12.738 1.06 12.88.381 12.077.2 10.42.02 9.335.005c-.113 15.148 2.632 25.12 2.632 25.12H10.85C8.421 15.253 8.18 2.83 8.254 0c-1.97.014-3.532.332-3.532.332l5.014 24.795H8.628L3.658.553C1.786.998.588 1.566 0 1.856c5.341 9.733 7.524 23.271 7.524 23.271H6.42z"/><path d="M12.402 20.097c.78-9.257 4.636-17.535 4.94-18.243-1.425-.731-2.985-1.13-3.522-1.27-2.005 9.27-1.478 18.05-1.418 19.513"/></svg>');
}

/* .bg-conference-league { */
/*     height: 40px; */
/*     width: 17.343px; */
/*     display: inline-block; */
/*     background-size: 100vw 100vh; */
/*     background: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="17.343" height="40" fill-rule="evenodd" stroke-linejoin="round" stroke-miterlimit="2" clip-rule="evenodd"><path d="M2.945 36.54 1.678 40h13.986L14.4 36.54H2.944Zm3.473-11.414c-.626-3.915-1.89-8.496-1.89-8.496 1.66 10.15-1.074 18.231-1.074 18.231h10.433C9.048 17.09 12.738 1.06 12.88.381 12.077.2 10.42.02 9.335.005c-.113 15.148 2.632 25.12 2.632 25.12H10.85C8.421 15.253 8.18 2.83 8.254 0c-1.97.014-3.532.332-3.532.332l5.014 24.795H8.628L3.658.553C1.786.998.588 1.566 0 1.856c5.341 9.733 7.524 23.271 7.524 23.271H6.42z"/><path d="M12.402 20.097c.78-9.257 4.636-17.535 4.94-18.243-1.425-.731-2.985-1.13-3.522-1.27-2.005 9.27-1.478 18.05-1.418 19.513"/></svg>'); */
/* } */

.bg-conference-league {
    height: 40px;
    width: 17.343px;
    background-size: cover;
    background: url('/images/ConferenceLeague.svg');
}

.icon-league {
    vertical-align: sub;
    height: 32px;
}

td, th {
    text-align: center;
}

.team-link:link {
    text-decoration: none;
    color: inherit;
}

.team-link:visited {
    text-decoration: none;
    color: inherit;
}

.team-link:hover {
    text-decoration: none;
    color: inherit;
}

.team-link:active {
    text-decoration: none;
    color: inherit;
}

.custom-menu-wrapper {
    z-index: 2;
}

/* menu Icon */
.menu-icone-container {
    cursor: pointer;
    vertical-align: middle;
    margin-left: 16px;
}

.bar1, .bar2, .bar3 {
    width: 30px;
    height: 3px;
    background-color: white;
    margin: 5px 0;
    transition: 0.4s;
}

.menu-icone-change .bar1 {
    transform: translate(0, 8px) rotate(-45deg);
}

.menu-icone-change .bar2 {
    opacity: 0;
}

.menu-icone-change .bar3 {
    transform: translate(0, -8px) rotate(45deg);
}

.rank-tables-panel {
    display: flex;
    flex-wrap: wrap;
    gap: 20px;
    justify-content: space-around;
}

    .rank-tables-panel > div {
        width: 25em;
    }

        .rank-tables-panel > div > table {
            width: 100%;
        }

            .rank-tables-panel > div > table tr > td:nth-child(1) {
                width: 8em;
                text-align: right;
                padding-left: 2px;
            }

            .rank-tables-panel > div > table tr > td:nth-child(2) {
                text-align: left;
                padding-right: 2px;
            }

            .rank-tables-panel > div > table .flag {
                vertical-align: middle;
            }

            .rank-tables-panel > div > table td {
                border-bottom: none;
            }

            .rank-tables-panel > div > table tr.separator {
                border-top: 1px solid #cbcbcb;
            }


/* Inserting this collapsed row between two flex items will make 
 * the flex item that comes after it break to a new row */
.flex-break {
    flex-basis: 100%;
    height: 0;
}


.all-teams-panel {
    display: flex;
    flex-wrap: wrap;
    gap: 20px;
    justify-content: center;
}

    .all-teams-panel > div {
        width: 17em;
    }

        .all-teams-panel > div > a > span:nth-child(2) {
            display: inline-block;
            vertical-align: text-bottom;
        }

.sponsors-list {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-around;
    align-items: center;
}

    .sponsors-list > span {
        margin: 15px;
    }

.team-picture-container {
    display: flex;
    justify-content: center;
}

    .team-picture-container > img {
        max-width: 100%;
        max-height: 50vh;
        border: 10px solid #2d3e50;
    }

.field-layout-picture-container {
    display: flex;
    justify-content: center;
}

    .field-layout-picture-container > img {
        max-width: 100%;
        max-height: 100%;
    }

.contact-pnl {
    color: #777;
    padding: 5px;
    margin-top: 3em;
    font-size: 90%;
}