.custom-border {
    border-width: 1px;
    border-color: black;
    border-style: solid;
}

.custom-border-2 {
    border-width: 2px;
    border-color: black;
    border-style: solid;
}

.custom-border-3 {
    border-width: 3px;
    border-color: black;
    border-style: solid;
}

.custom-border-gold-3 {
    border-width: 3px;
    border-color: gold;
    border-style: solid;
}

.custom-border-bottom {
    border-bottom-width: 1px;
    border-bottom-color: black;
    border-bottom-style: solid;
}

.custom-border-bottom-3 {
    border-bottom-width: 3px;
    border-bottom-color: black;
    border-bottom-style: solid;
}

.field-background-changed {
    background-color: deepskyblue;
}

.field-background-changed-checkbox:checked {
    background-color: deepskyblue;
}

.field-background-mandatory {
    background-color: tomato;
}

.field-background-mandatory:checked {
    background-color: tomato;
}

.field-background-empty {
    background-color: lightgoldenrodyellow;
}
.field-background-empty-checkbox:checked {
    background-color: lightgoldenrodyellow;
}
.bc4sport-background-global {
    background: #e9e0c8;
}

.bc4sport-title-background {
    background-repeat: repeat;
    background-image: url('/images/texture_anthracite.png');
    /*background-color: #050505;*/
    /*background: linear-gradient(180deg, rgba(0,0,0,1) 0%, rgba(36,36,36,1) 50%, rgba(0,0,0,1) 100%)*/
    /*opacity: 0.95;*/
}

.bc4sport-title-background-2 {
    background-color: #ebebeb;
}

.bc4sport-title-table-background {
    /*
    background: linear-gradient(180deg, rgba(35,61,77,1) 0%, rgba(68,93,108,1) 50%, rgba(35,61,77,1) 100%)
    */
    background-image: url('/images/texture_anthracite_clair.png');
    height:2.2rem;
}

.bc4sport-image-border-value {
    border: 1px solid #6c757d;
}

.bc4sport-image-border-changed {
    border: 2px solid tomato;
}

.bc4sport-band-button {
    background-color: darkgray;
    border-top: 1px solid black;
    border-bottom: 1px solid black;
    margin-top: 10px;
    margin-bottom: 10px;
}

.bc4sport-band-button-tiny {
    background-color: darkgray;
    border-top: 1px solid black;
    border-bottom: 1px solid black;
}

.bc4sport-tuile {
    display: inline-block;
    cursor: pointer;
    margin-top: auto;
    margin-bottom: auto;
    transition: all .2s ease-in-out;
}

.bc4sport-tuile:hover {
    transform: scale(1.05);
}

.bc4sport-button-tiny {
    width: 1rem;
    height: 1rem;
    display: inline-block;
    cursor: pointer;
    margin-top: auto;
    margin-bottom: auto;
    transition: all .2s ease-in-out;
}

.bc4sport-button-tiny:hover {
    transform: scale(1.2);
}

.bc4sport-button-small {
    width: 1.5rem;
    height: 1.5rem;
    display: inline-block;
    cursor: pointer;
    margin-top: auto;
    margin-bottom: auto;
    transition: all .2s ease-in-out;
}

.bc4sport-button-small:hover {
    transform: scale(1.2);
}

.bc4sport-button-small-h {
    height: 1.5rem;
    display: inline-block;
    cursor: pointer;
    margin-top: auto;
    margin-bottom: auto;
    transition: all .2s ease-in-out;
}

.bc4sport-button-small-h:hover {
    transform: scale(1.2);
}

.bc4sport-button {
    width: 2rem;
    height: 2rem;
    display: inline-block;
    cursor: pointer;
    margin-top: auto;
    margin-bottom: auto;
    transition: all .2s ease-in-out;
}

.bc4sport-button:hover {
    transform: scale(1.2); 
}

.bc4sport-button-border {
    width: 2rem;
    height: 2rem;
    display: inline-block;
    cursor: pointer;
    margin-top: auto;
    margin-bottom: auto;
    transition: all .2s ease-in-out;
    border: 1px solid black;
}

.bc4sport-button-border:hover {
    transform: scale(1.2);
}

.bc4sport-button-circle {
    width: 2rem;
    height: 2rem;
    display: inline-block;
    cursor: pointer;
    margin-top: auto;
    margin-bottom: auto;
    transition: all .2s ease-in-out;
    border-radius: 50%;
}

.bc4sport-button-circle:hover {
    transform: scale(1.2);
}

.bc4sport-button-circle-border {
    width: 2rem;
    height: 2rem;
    display: inline-block;
    cursor: pointer;
    margin-top: auto;
    margin-bottom: auto;
    transition: all .2s ease-in-out;
    border-radius: 50%;
    border: 1px solid black;
}

.bc4sport-button-circle-border:hover {
    transform: scale(1.2);
}

.bc4sport-button-circle-border-small {
    width: 1.5rem;
    height: 1.5rem;
    display: inline-block;
    cursor: pointer;
    margin-top: auto;
    margin-bottom: auto;
    transition: all .2s ease-in-out;
    border-radius: 50%;
    border: 1px solid black;
}

.bc4sport-button-circle-border-small:hover {
    transform: scale(1.2);
}

.bc4sport-button-large {
    width: 3rem;
    height: 3rem;
    display: inline-block;
    cursor: pointer;
    margin-top: auto;
    margin-bottom: auto;
    transition: all .2s ease-in-out;
}

.bc4sport-button-large:hover {
    transform: scale(1.2); 
}

.bc4sport-image-tiny {
    width: 1rem;
    height: 1rem;
    display: inline-block;
    margin-top: auto;
    margin-bottom: auto;
}

.bc4sport-image-micro {
    width: 0.75rem;
    height: 0.75rem;
    display: inline-block;
    margin-top: auto;
    margin-bottom: auto;
}

.bc4sport-image-background {
    background-size: cover; /* Couvre toute la zone visible */
    background-position: center; /* Centre l'image */
    background-repeat: no-repeat; /* Évite la répétition */
    background-attachment: fixed; /* Fixe l'image lors du scroll */
}

.bc4sport-texture-metal-gris-clair {
    background-repeat: repeat;
    background-image: url('/images/texture_metal_gris_clair.png')
}

.bc4sport-texture-metal-gris-fonce {
    background-repeat: repeat;
    background-image: url('/images/texture_metal_gris_fonce.png')
}

.bc4sport-image-alarm {
    animation: image-alarm 2s linear infinite;
}

@keyframes image-alarm {
    25% {
        opacity: 0.5;
    }

    50% {
        opacity: 0;
    }

    75% {
        opacity: 0.5;
    }
}

.bc4sport-rotate-colors {
    -webkit-animation: filter-animation 1s infinite;
    animation: rotate-color-animation 3s infinite;
}

@-webkit-keyframes rotate-color-animation {
    0% {
        -webkit-filter: hue-rotate(0deg);
    }

    50% {
        -webkit-filter: hue-rotate(5deg);
    }

    100% {
        -webkit-filter: hue-rotate(0deg);
    }
}

@keyframes rotate-color-animation {
    0% {
        filter: hue-rotate(0deg);
    }

    10% {
        filter: hue-rotate(-10deg);
    }

    20% {
        filter: hue-rotate(-20deg);
    }

    30% {
        filter: hue-rotate(-30deg);
    }

    40% {
        filter: hue-rotate(-40deg);
    }

    50% {
        filter: hue-rotate(-50deg);
    }

    60% {
        filter: hue-rotate(-40deg);
    }

    70% {
        filter: hue-rotate(-30deg);
    }

    80% {
        filter: hue-rotate(-20deg);
    }

    90% {
        filter: hue-rotate(-10deg);
    }

    100% {
        filter: hue-rotate(0deg);
    }
}

.bc4sport-image-small {
    width: 1.5rem;
    height: 1.5rem;
    display: inline-block;
    margin-top: auto;
    margin-bottom: auto;
}

.bc4sport-image-small-h {
    height: 1.5rem;
    display: inline-block;
    margin-top: auto;
    margin-bottom: auto;
}

.bc4sport-image {
    width: 2rem;
    height: 2rem;
    display: inline-block;
    margin-top: auto;
    margin-bottom: auto;
}

.bc4sport-image-large {
    width: 3rem;
    height: 3rem;
    display: inline-block;
    margin-top: auto;
    margin-bottom: auto;
}

.bc4sport-image-circle-border {
    width: 2rem;
    height: 2rem;
    display: inline-block;
    margin-top: auto;
    margin-bottom: auto;
    border-radius: 50%;
    border: 1px solid black;
}

.bc4sport-button-disabled-large {
    width: 3.625rem;
    height: 3.625rem;
    padding: 0.625rem;
    margin: 1.25rem;
    margin-top: 0.625rem;
    margin-bottom: 0.625rem;
    display: inline-block;
    border: 2px solid black;
    border-radius: 3px;
}

.bc4sport-button-disabled-large:hover {
    border-color: darkslategrey;
    border-width: 3px;
}

.bc4sport-chart-background {
    background-color: antiquewhite;
    opacity: 0.95;
}

.bc4sport-center-login {
    max-width: 500px; /* Taille maximale */
    width: 100%; /* Occupe 100% de la taille jusqu'à max-width */
    border-radius: 0.25rem; /* Coins arrondis */
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    justify-content: center;
    align-items: center;
}

div.bc4sport-menu-background {
    /*background: linear-gradient(180deg, rgba(224,224,224,1) 0%, rgba(240,240,240,1) 50%, rgba(224,224,224,1) 100%)*/
    background-repeat: repeat;
    background-image: url('/images/texture_menu.png');
}

div.bc4sport-window-header {
    background-repeat: repeat;
    background-image: url('/images/texture_anthracite.png');
    color:gold;
    /*background-image: url('/images/texture_window_header_cuivre.png');*/
    /*background: linear-gradient(180deg, rgba(222,184,135,1) 0%, rgba(245,204,150,1) 50%, rgba(222,184,135,1) 100%)*/
}

.bc4sport-window-title {
    color: gold;
    font-weight: bold;
}

div.bc4sport-window-background {
    background-repeat: repeat;
    background-image: url('/images/texture_window_background_1.png');
    /*background: radial-gradient(circle, rgba(202,201,201,1) 0%, rgba(217,216,216,1) 50%, rgba(202,201,201,1) 100%)*/
}

div.bc4sport-window-background-2 {
    background: radial-gradient(circle, rgba(202,201,201,1) 0%, rgba(245,243,243,1) 50%, rgba(202,201,201,1) 100%);
}
div.bc4sport-window-background-3 {
    background: linear-gradient(180deg, rgba(249,249,249,1) 0%, rgba(243,243,243,1) 100%);
}
div.bc4sport-window-background-4 {
    background-repeat: repeat;
    background-image: url('/images/texture_window_background_2.png');
    /*background: radial-gradient(circle, rgba(202,201,201,1) 0%, rgba(217,216,216,1) 50%, rgba(202,201,201,1) 100%)*/
}
div.bc4sport-filter-background {
    background-repeat: repeat;
    background-image: url('/images/texture_filtre_sable.png')
    /*background: linear-gradient(180deg, rgba(222,210,176,1) 0%, rgba(240,209,120,1) 50%, rgba(222,210,176,1) 100%)*/
}
label.bc4sport-background-grey {
    background: linear-gradient(180deg, rgba(192,192,192,1) 0%, rgba(168,168,168,1) 100%)
}
label.bc4sport-background-green {
    background: linear-gradient(180deg, rgba(153,237,181,1) 0%, rgba(131,232,165,1) 100%)
}
label.bc4sport-background-orange {
    background: linear-gradient(180deg, rgba(237,210,153,1) 0%, rgba(232,189,131,1) 100%)
}
label.bc4sport-background-red {
    background: linear-gradient(180deg, rgba(237,153,153,1) 0%, rgba(232,131,131,1) 100%)
}
label.bc4sport-background-gold {
    background: linear-gradient(180deg, #b8860b, #ffd700, #fff8dc, #ffd700, #b8860b);
}
label.bc4sport-background-silver {
    background: linear-gradient(180deg, #b8b8b8, #e0e0e0, #ffffff, #e0e0e0, #b8b8b8);
}
label.bc4sport-background-bronze {
    background: linear-gradient(180deg, #4e2a04, #b87333, #e0b97e, #b87333, #4e2a04);
}

label.bc4sport-textcolor-red {
    color: rgba(237,153,153,1)
}
label.bc4sport-textcolor-green {
    color: rgba(131,232,165,1)
}
label.bc4sport-textcolor-blue {
    color: rgba(40,100,255,1)
}
label.bc4sport-textcolor-grey {
    color: rgba(150,150,150,1)
}
label.bc4sport-textcolor-orange {
    color: #febb04
}
.bc4sport-background-red {
    background: linear-gradient(180deg, rgba(237,153,153,1) 0%, rgba(232,131,131,1) 100%)
}
.bc4sport-background-green {
    background: linear-gradient(180deg, rgba(153,237,181,1) 0%, rgba(131,232,165,1) 100%)
}
.bc4sport-background-orange {
    background: linear-gradient(180deg, rgba(237,210,153,1) 0%, rgba(232,189,131,1) 100%)
}

/* Grid */
div.bc4sport-grid-row-header {
    display: flex;
    flex-wrap: wrap;
    /*background: linear-gradient(180deg, rgba(208,208,208,1) 0%, rgba(227,227,227,1) 50%, rgba(208,208,208,1) 100%);*/
    background-repeat: repeat;
    background-image: url('/images/texture_row_header_gris.png');
    color: yellow;
    border-top: 1px solid black;
    border-bottom: 1px solid black;
    font-weight: bold;
    overflow-y: scroll;
    scrollbar-base-color: #C0C0C0;
}

div.bc4sport-grid-row-header-black {
    display: flex;
    flex-wrap: wrap;
    /*background: linear-gradient(180deg, rgba(208,208,208,1) 0%, rgba(227,227,227,1) 50%, rgba(208,208,208,1) 100%);*/
    background-repeat: repeat;
    background-image: url('/images/texture_row_header_gris.png');
    color: black;
    border-top: 1px solid black;
    border-bottom: 1px solid black;
    font-weight: bold;
    overflow-y: scroll;
    scrollbar-base-color: #C0C0C0;
}

div.bc4sport-grid-row {
    display: flex;
    flex-wrap: wrap;
    border-bottom: 1px solid gray;
}

div.bc4sport-grid-row-total {
    display: flex;
    flex-wrap: wrap;
    border-bottom: 1px solid gray;
    background-color: black;
    color: yellow;
}

div.bc4sport-grid-row-total-formulaire {
    display: flex;
    flex-wrap: wrap;
    border-top: 1px solid gray;
    /*background-color: black;*/
    color: black;
}

div.bc4sport-grid-row:nth-child(even) {
    background-repeat: repeat;
    background-image: url('/images/texture_row_even_bleu.png');
    /*background-color: #a1c6ea;*/
}

div.bc4sport-grid-row:nth-child(odd) {
    background-repeat: repeat;
    background-image: url('/images/texture_row_odd_bleu.png');
    /*background-color: #b8d1f3;*/
}

div.bc4sport-grid-row:hover {
    background-repeat: repeat;
    background-image: url('/images/texture_row_select_jaune.png');
    /*background-color: #ede999;*/
}

div.bc4sport-grid-row-disabled {
    display: flex;
    flex-wrap: wrap;
    border-bottom: 1px solid gray;
    text-decoration: line-through;
}

div.bc4sport-grid-row-disabled:nth-child(even) {
    background: #aaa;
}

div.bc4sport-grid-row-disabled:nth-child(odd) {
    background: #aaa;
}

div.bc4sport-grid-row-disabled:hover {
    background-color: gold;
}

div.bc4sport-grid-row-changed {
    display: flex;
    flex-wrap: wrap;
    border-bottom: 1px solid gray;
    text-decoration: line-through;
}

div.bc4sport-grid-row-changed:nth-child(even) {
    background: burlywood;
}

div.bc4sport-grid-row-changed:nth-child(odd) {
    background: burlywood;
}

div.bc4sport-grid-row-changed:hover {
    background-color: gold;
}

.form-control::placeholder {
    color: rgba(208,208,208,1) !important;
}
input::placeholder {
    color: rgba(208,208,208,1); 
    font-style: italic;
}

/* Fin grid */

.initial-header-days {
    align-items: center;
    display: inline-flex;
    justify-content: center;
    /* Colors */
    background-color: #9b00ce;
    color: gold;
    height: 2rem;
    width: 2rem;
}

.initial-avatar-circle {
    /* Center the content */
    align-items: center;
    display: inline-flex;
    justify-content: center;
    /* Colors */
    background-color: #9b00ce;
    color: gold;
    /* Rounded border */
    border-radius: 50%;
    height: 1.5rem;
    width: 1.5rem;
    font-size:small;
    border: black 1px solid;
}

.initial-avatar-ellipse-1 {
    /* Center the content */
    align-items: center;
    display: inline-flex;
    justify-content: center;
    /* Colors */
    background-color: #9b00ce;
    color: gold;
    /* Rounded border */
    border-radius: 50%;
    height: 1.5rem;
    width: 2rem;
    font-size: small;
    border: black 1px solid;
}

.initial-avatar-ellipse-2 {
    /* Center the content */
    align-items: center;
    display: inline-flex;
    justify-content: center;
    /* Colors */
    background-color: #9b00ce;
    color: gold;
    /* Rounded border */
    border-radius: 50%;
    height: 1.5rem;
    width: 2rem;
    font-size: small;
    border: black 1px solid;
}

.initial-avatar-ellipse-3 {
    /* Center the content */
    align-items: center;
    display: inline-flex;
    justify-content: center;
    /* Colors */
    background-color: #9b00ce;
    color: gold;
    /* Rounded border */
    border-radius: 50%;
    height: 1.5rem;
    width: 2rem;
    font-size: small;
    border: black 1px solid;
}

.initial-avatar-ellipse-4 {
    /* Center the content */
    align-items: center;
    display: inline-flex;
    justify-content: center;
    /* Colors */
    background-color: #9b00ce;
    color: gold;
    /* Rounded border */
    border-radius: 50%;
    height: 1.5rem;
    width: 3rem;
    font-size: small;
    border: black 1px solid;
}

.initial-avatar-ellipse-5 {
    /* Center the content */
    align-items: center;
    display: inline-flex;
    justify-content: center;
    /* Colors */
    background-color: #9b00ce;
    color: gold;
    /* Rounded border */
    border-radius: 50%;
    height: 1.5rem;
    width: 4rem;
    font-size: small;
    border: black 1px solid;
}

.initial-avatar-ellipse-6 {
    /* Center the content */
    align-items: center;
    display: inline-flex;
    justify-content: center;
    /* Colors */
    background-color: #9b00ce;
    color: gold;
    /* Rounded border */
    border-radius: 50%;
    height: 1.5rem;
    width: 4rem;
    font-size: small;
    border: black 1px solid;
}

.initial-avatar-none-3 {
    /* Center the content */
    align-items: center;
    display: inline-flex;
    justify-content: center;
    /* Colors */
    background-color: #9b00ce;
    height: 3rem;
    width: 3rem;
}

.initial-avatar-circle-tiny {
    /* Center the content */
    align-items: center;
    display: inline-flex;
    justify-content: center;
    /* Colors */
    background-color: #9b00ce;
    color: gold;
    /* Rounded border */
    border-radius: 50%;
    height: 1.7rem;
    width: 1.7rem;
    border: black 1px solid;
}

.initial-avatar-circle-2 {
    /* Center the content */
    align-items: center;
    display: inline-flex;
    justify-content: center;
    /* Colors */
    background-color: #9b00ce;
    color: gold;
    /* Rounded border */
    border-radius: 50%;
    height: 2rem;
    width: 2rem;
    border: black 1px solid;
}

.initial-avatar-circle-3 {
    /* Center the content */
    align-items: center;
    display: inline-flex;
    justify-content: center;
    /* Colors */
    background-color: #9b00ce;
    color: gold;
    /* Rounded border */
    border-radius: 50%;
    height: 3rem;
    width: 3rem;
    border: black 1px solid;
}

.initial-avatar-circle-4 {
    /* Center the content */
    align-items: center;
    display: inline-flex;
    justify-content: center;
    /* Colors */
    background-color: #9b00ce;
    color: gold;
    /* Rounded border */
    border-radius: 50%;
    height: 4rem;
    width: 4rem;
    border: black 1px solid;
}

.initial-avatar-square {
    /* Center the content */
    align-items: center;
    display: inline-flex;
    justify-content: center;
    /* Colors */
    background-color: #9b00ce;
    color: gold;
    /* Rounded border */
    height: 1.5rem;
    width: 1.5rem;
    font-size: small;
    border: black 1px solid;
}

.initial-avatar-square-button {
    /* Center the content */
    align-items: center;
    display: inline-flex;
    justify-content: center;
    /* Colors */
    background-color: #9b00ce;
    color: gold;
    /* Rounded border */
    height: 2rem;
    width: 2rem;
    border: black 1px solid;
}

.initial-avatar-square-button:hover {
    border-color: gold;
    border-width: 3px;
}

.initial-avatar-square-2 {
    /* Center the content */
    align-items: center;
    display: inline-flex;
    justify-content: center;
    /* Colors */
    background-color: #9b00ce;
    color: gold;
    /* Rounded border */
    height: 2rem;
    width: 2rem;
    border: black 1px solid;
}

.initial-avatar-square-3 {
    /* Center the content */
    align-items: center;
    display: inline-flex;
    justify-content: center;
    /* Colors */
    background-color: #9b00ce;
    color: gold;
    /* Rounded border */
    height: 3rem;
    width: 3rem;
    border: black 1px solid;
}
/*
.initial-avatar-square-3:hover {
    border-color: gold;
    border-width: 3px;
}
*/
.initial-avatar-square-4 {
    /* Center the content */
    align-items: center;
    display: inline-flex;
    justify-content: center;
    /* Colors */
    background-color: #9b00ce;
    color: gold;
    /* Rounded border */
    height: 4rem;
    width: 4rem;
    border: black 1px solid;
}

.link-style {
    background: none !important;
    border: none;
    padding: 0 !important;
    /*optional*/
    font-family: arial, sans-serif;
    /*input has OS specific font-family*/
    color: #069;
    text-decoration: underline;
    cursor: pointer;
}



/*crop*/
   .container {
      max-width: 960px;
      margin: 20px auto;
    }

    img {
      max-width: 100%;
    }

    .row,
    .preview {
      overflow: hidden;
    }

    .col {
      float: left;
    }

    .col-6 {
      width: 50%;
    }

    .col-3 {
      width: 25%;
    }