html {
    font-size: 14px;
}
body {
    --bs-font-sans-serif: 'Quicksand', sans-serif;
    --bs-body-font-family: var(--bs-font-sans-serif);
    --bs-font-monospace: 'VT323', monospace;
}


@media (min-width: 768px) {
  html {
    font-size: 16px;
  }
}

.btn:focus, .btn:active:focus, .btn-link.nav-link:focus, .form-control:focus, .form-check-input:focus {
  box-shadow: 0 0 0 0.1rem white, 0 0 0 0.25rem #258cfb;
}

html {
    position: relative;
    min-height: 100%;
}

body {
  margin-bottom: 60px;
}


.player-wrapper {
/*    height: 510px;
*/    overflow-y: scroll;
    overflow-x: auto;
    background-color: #fbf9ef;
    padding: 10px
}
.selected-player-wrapper {
/*    height: 510px;
*/    overflow-y: scroll;
    overflow-x: auto;
    background-color: #f5efd6;
    padding: 10px
}

.selection-image {
    width: 16px;
    height: 16px;
}

.current-club-table {
    height: 510px;
    overflow-y: scroll;
    overflow-x: auto;
    background-color: #96D4AF;
    padding: 10px
}

.current-club-standings-table {
    height: 510px;
    overflow-y: scroll;
    overflow-x: auto;
    background-color: #dde5b6;
    padding: 10px
}

#latest-news {
    background-color: #c2c5aa;
    padding: 20px;
}

/*-- Checkbox -*/
.form-control {
    font-family: system-ui, sans-serif;
/*    font-size: 2rem;
    font-weight: bold;
    line-height: 1.1;
*/    display: grid;
    grid-template-columns: 1em auto;
    gap: 0.5em;
}

    .form-control + .form-control {
        margin-top: 1em;
    }

.form-control--disabled {
    color: var(--form-control-disabled);
    cursor: not-allowed;
}

input[type="checkbox"] {
    /* Add if not using autoprefixer */
    -webkit-appearance: none;
    /* Remove most all native input styles */
    appearance: none;
    /* For iOS < 15 */
    background-color: var(--form-background);
    /* Not removed via appearance */
    margin: 0;
    font: inherit;
    color: currentColor;
    width: 1.15em;
    height: 1.15em;
    border: 0.15em solid currentColor;
    border-radius: 0.15em;
    transform: translateY(-0.075em);
    display: grid;
    place-content: center;
}

    input[type="checkbox"]::before {
        content: "";
        width: 0.65em;
        height: 0.65em;
        clip-path: polygon(14% 44%, 0 65%, 50% 100%, 100% 16%, 80% 0%, 43% 62%);
        transform: scale(0);
        transform-origin: bottom left;
        transition: 120ms transform ease-in-out;
        box-shadow: inset 1em 1em var(--form-control-color);
        /* Windows High Contrast Mode */
        background-color: CanvasText;
    }

    input[type="checkbox"]:checked::before {
        transform: scale(1);
    }

    input[type="checkbox"]:focus {
        outline: max(2px, 0.15em) solid currentColor;
        outline-offset: max(2px, 0.15em);
    }

    input[type="checkbox"]:disabled {
        --form-control-color: var(--form-control-disabled);
        color: var(--form-control-disabled);
        cursor: not-allowed;
    }

.intro {
    background-image: url('/images/ball.jpg');
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
    padding: 40px;
    color: #000;
}
.hero h1
{
    font-size: 3em;
    font-weight: 700;
}
    .hero h2 {
        font-size: 2em;
        font-weight: 600;
    }

.container
{
    background-color: #fff;
    border-top: transparent 2px #fff;
    padding-top: 10px;
}
.container-special
{
    background-color: transparent;
}

.container-fluid-nom
{
    padding: 0px !important;
}

.summary
{
    padding: 10px;
}
.howitworks {
    background-image: url('/images/bg1.jpg');
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
    padding: 40px;
}

.form-group
{
    margin-bottom: 10px;
}


.goodstatus
{
    float: right;
    background-color: lightgreen;
    color: #000;
    padding: 10px;
    font-weight: bold;
}
.badstatus {
    float: right;
    background-color: red;
    color: #fff;
    padding: 10px;
    font-weight: bold;
}
.nostatus {
    display:none;
}
.error-msg
{
    width: 100%;
    padding: 10px;
    background-color: red;
    color: #fff;
    margin-bottom: 20px;
}

.explain {
    background: rgba(0, 0, 0, 0.6);
    color: #fff;
    padding: 40px;
    margin: 40px 0 40px 0;
}
.thanks
{
    background-color: lightgreen;
    color: #000;
    padding: 20px;
    text-align: center;
    width: 100%;
}

.emphasis
{
    font-weight: bold;
    font-size: 1.1em;
}

.promo-right {
    border: solid 1px #c0c0c0;
    padding: 20px;
}
.promo-right a {
    color: #000;
}
.position-table {
    font-size: 12px !important;
}


.transfer-button
{
    background-image: url(/images/transfer.gif);
    background-repeat: no-repeat;
    height: 26px;
    width: 26px;
    border:none;
    background-color: transparent;
    vertical-align: bottom;
}

.table>:not(caption)>*>*
{
    padding: .4rem .4rem !important;
}


.last-processed
{
    font-size: 0.7em;
}


.position-table a
{
    color: #000;
}


.match-summary
{
    background-color: #f0f0f0 !important;
}


.signup {
    width: 100%;
    background-color: cadetblue;
    font-size: 1.4em;
    padding: 10px;
    text-align: center;
    color: #fff;
}
.signup a
{
    text-decoration: none;
}

.field-validation-error
{
    color: red;
}



.no-edit-allowed
{
    width: 100%;
    padding: 20px;
    text-align: center;
    font-size: 1.6em;
    font-weight: bold;
    background-color: #FFCCCB;
}


.message {
    width: 100%;
    padding: 20px;
    text-align: center;
    font-size: 1.6em;
    font-weight: bold;
    background-color: #DFF2BF;
    color: #4F8A10;
}