*,
*::before,
*::after {
    box-sizing: border-box;
}

input[type="button"],
input[type="submit"] {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    border-radius: 0;
}

html {
    /* font-family: sans-serif;*/
    line-height: 1.15;
    -webkit-text-size-adjust: 100%;
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
    /*overscroll-behavior: none; */
    width: 100%;
    overflow: auto;
}

body {
    margin: 0;
    /*font-family: "ProximaNovaRegular";*/
    font-size: 1rem;
    font-weight: 400;
    line-height: 1.5;
    color: #242425;
    background-color: white;
    margin: 0;
    padding: 0;
    overflow-x: hidden;
    width: 100%;
    height: 100%;
    overflow: auto;
}


/* permet d'utiliser hide et show de jquery !!! */

.d-flex[style*="display:none"],
.d-flex[style*="display: none"] {
    display: none !important;
}

a {
    text-decoration: none;
    color: black;
}

a:hover {
    text-decoration: none;
}

select:required:invalid {
    color: gray;
}

option[value=""][disabled] {
    display: none;
}

option {
    color: black;
}

.inputfile {
    width: 0.1px;
    height: 0.1px;
    opacity: 0;
    overflow: hidden;
    position: absolute;
    z-index: -1;
}

.inputfile+label * {
    pointer-events: none;
}

#breadcrumps {
    z-index: 1;
    box-sizing: border-box;
    position: relative;
    background-color: rgba(230, 230, 230, 1);
    overflow: hidden;
    margin: 0;
    transition: margin 200ms ease;
    -o-transition: margin 200ms ease;
    -ms-transition: margin 200ms ease;
    -moz-transition: margin 200ms ease;
    -webkit-transition: margin 200ms ease;
    height: 60px;
}

#btnbcreturn {
    max-height: 38px;
    min-width: 100px;
}

#breadcrumps .breadcrumb {
    background-color: inherit;
    margin: 0;
    font-size: 1.2rem;
    max-height: 60px;
}

#breadcrumps .breadcrumb-item a {
    color: gray;
}

#breadcrumps .breadcrumb-item a:hover,
#breadcrumps .breadcrumb-item a:active {
    color: rgba(229, 21, 43, 1);
}

.breadcrumb-item.active {
    color: rgba(49, 82, 161, 1);
}

.btncollapse .fa-chevron-down {
    transition: 0.3s transform ease-in-out;
}

.btncollapse.collapsed .fa-chevron-down {
    transform: rotate(90deg);
}

.navbar-collapse.in {
    display: block !important;
}

.lienbleu {
    color: rgba(49, 82, 161, 1);
    text-decoration: none;
    font-weight: bold;
    transition: color 200ms ease;
    -o-transition: color 200ms ease;
    -ms-transition: color 200ms ease;
    -moz-transition: color 200ms ease;
    -webkit-transition: color 200ms ease;
    cursor: pointer;
}

.lienbleu:hover {
    text-decoration: none;
    color: rgba(229, 21, 43, 1);
}

.lienbleu2 {
    background-color: transparent;
    border: 1px solid rgba(49, 82, 161, 0.7);
    color: black;
    text-decoration: none;
    padding: 3px;
    border-radius: 4px;
    transition: background-color 200ms ease;
    -o-transition: background-color 200ms ease;
    -ms-transition: background-color 200ms ease;
    -moz-transition: background-color 200ms ease;
    -webkit-transition: background-color 200ms ease;
}

.lienblanc {
    background-color: transparent;
    border: 1px solid white;
    color: white;
}

.lienbleu2:hover {
    text-decoration: none;
    background-color: rgba(229, 21, 43, 1);
    color: white;
    border-color: rgba(229, 21, 43, 1);
}

.lienbleu2 span {
    margin-right: 0rem;
}

@keyframes movelinkicone {
    0% {
        margin-right: 0rem;
    }
    50% {
        margin-right: 0.2rem;
    }
    100% {
        margin-right: 0rem;
    }
}

.fs-7 {
    font-size: 0.8rem;
}

.lienbleu2:hover span {
    margin-right: 0;
    -moz-animation-duration: 0.5s;
    -webkit-animation-duration: 0.5s;
    animation-duration: 0.5s;
    animation-name: movelinkicone;
}

input[type="button"],
input[type="submit"] {
    background-color: rgba(49, 82, 161, 1);
    color: white;
    transition: background-color 200ms ease;
    -o-transition: background-color 200ms ease;
    -ms-transition: background-color 200ms ease;
    -moz-transition: background-color 200ms ease;
    -webkit-transition: background-color 200ms ease;
    display: inline-block;
    font-weight: 400;
    text-align: center;
    /*vertical-align: middle;*/
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    -webkit-appearance: none !important;
    -moz-appearance: none !important;
    appearance: none !important;
    border: 1px solid transparent;
    padding: 0.375rem 0.75rem;
    line-height: 1.5;
    border-radius: 0.25rem;
    transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
}

input[type="button"]:disabled,
input[type="submit"]:disabled {
    pointer-events: none;
    color: #A6A6A6!important;
}

input[type="button"]:hover,
input[type="submit"]:hover {
    color: white;
    background-color: rgba(229, 21, 43, 1);
    border-color: rgba(229, 21, 43, 1);
}

input[type="button"]:focus,
input[type="submit"]:focus {
    outline: none;
    transform: scale(1.05);
}

.mt-6 {
    margin-top: 6rem !important;
}

.bleuscc {
    background-color: rgba(49, 82, 161, 1);
    color: white;
}

.selectifscc {
    background-color: rgb(7, 29, 80);
    color: white;
}

.blancscc {
    background-color: white;
}

.vert {
    background-color: #32cd32;
    color: white;
}

.fontbleuscc {
    color: rgba(49, 82, 161, 1);
}

.fontrougescc {
    color: rgba(229, 21, 43, 1);
}

.fontverte {
    color: #32cd32;
}

.fontjaune {
    color: #fbff2a!important;
}

.btn {
    transition: background-color 200ms ease;
    -o-transition: background-color 200ms ease;
    -ms-transition: background-color 200ms ease;
    -moz-transition: background-color 200ms ease;
    -webkit-transition: background-color 200ms ease;
}

.btn.bleuscc {
    color: white;
}

.btn.bleuscc:hover {
    color: white;
    background-color: rgba(229, 21, 43, 1);
}

.btn.bleuscc:focus {
    border: none !important;
}

.btn-outline-bleuscc {
    color: rgba(49, 82, 161, 1);
    border-color: rgba(49, 82, 161, 1);
    border-top: 1px solid rgba(49, 82, 161, 1)!important;
}

.btn-outline-bleuscc.active {
    color: rgba(229, 21, 43, 1);
    border-color: rgba(49, 82, 161, 1);
    font-weight: bold;
}

.btn-outline-bleuscc:hover {
    color: white;
    background-color: rgba(229, 21, 43, 1);
}

#btnMotDePasse {
    line-height: 1rem;
    margin-bottom: 0;
    height: 2.5rem;
}

.rougescc {
    background-color: rgba(229, 21, 43, 1);
    color: white;
}

.accordion-button {
    padding: 0.5rem 0.6rem;
}

#menu_gauche {
    display: block;
    width: 250px;
    position: fixed;
    top: 0;
    bottom: 0;
    left: 0;
    z-index: 1;
    padding: 0;
    overflow: scroll;
    background-color: rgba(49, 82, 161, 1);
    color: white;
}

.menu_principal img {
    height: 100px;
    max-height: 100px;
}

#menu_gauche .navbar-brand {
    margin-right: 0;
}

#menu_gauche .nav-item,
#menu_gauche .navbar-brand,
#menu_gauche .nav.nav-dividers {
    border-color: rgb(91, 112, 160) !important;
}

#menu_gauche .nav-item a span {
    width: 25px;
    display: inline-block;
}

#menu_gauche .nav-item a {
    color: white;
    text-decoration: none;
    background-color: transparent;
}

#menu_gauche .nav .nav-item:hover {
    background-color: rgba(229, 21, 43, 1);
}

#menu_gauche .nav.nav-dividers {
    margin-bottom: 40px;
}

#wrapper {
    position: relative;
    z-index: 1;
    overflow-x: hidden;
    padding-top: 60px;
    transition: padding 200ms ease;
    -o-transition: padding 200ms ease;
    -ms-transition: padding 200ms ease;
    -moz-transition: padding 200ms ease;
    -webkit-transition: padding 200ms ease;
    left: 0;
    height: 100%;
    background-color: white;
    /*overscroll-behavior: none;*/
}

#bmenuprincipal,
#buser {
    color: white;
    font-size: 35px;
    line-height: 35px;
    font-weight: bold;
    padding: 5px;
    margin: 5px;
    cursor: pointer;
}

@media (hover: hover) {
    #bmenuprincipal:hover {
        background-color: rgba(229, 21, 43, 1);
    }
}

.justify-content-evenly {
    justify-content: space-evenly;
}

.menu-mobile {
    display: block;
    background-color: rgba(49, 82, 161, 1);
    color: white;
    z-index: 1;
    position: fixed;
    top: 0;
    left: 0;
    padding: 0;
    height: 60px;
    width: 100%;
    transition: top 200ms ease;
    -o-transition: top 200ms ease;
    -ms-transition: top 200ms ease;
    -moz-transition: top 200ms ease;
    -webkit-transition: top 200ms ease;
}

.menu-mobile-logo {
    position: relative;
    width: 120px;
    margin: 0 auto;
    height: 60px;
    padding: 5px;
    text-align: center;
}

.menu-mobile img {
    height: 100%;
}

.background-container {
    position: relative;
    width: 100%;
    margin-left: 0;
    margin-right: 0;
    padding-left: 0;
    padding-right: 0;
    padding-top: 10px;
    padding-bottom: 0px;
    box-sizing: border-box;
}

.entete {
    min-height: 200px;
    width: 100%;
    margin: 0;
    padding: 20px 15px 30px;
    padding-bottom: 10px;
    /*60 */
    padding-top: 10px;
    position: relative;
    box-sizing: border-box;
    background-color: white;
}

.entetedetail {
    position: relative;
    margin-left: auto;
    margin-right: auto;
    transition: width 200ms;
    -o-transition: width 200ms;
    -ms-transition: width 200ms;
    -moz-transition: width 200ms;
    -webkit-transition: width 200ms;
    max-width: 1587px;
}

.divtitre {
    margin-bottom: 20px;
}

.titrepage {
    margin-top: 70px;
    font-size: 32px;
    font-size: 2rem;
    margin-bottom: 20px;
    text-transform: uppercase;
    color: white;
}

.fondentete {
    z-index: 0;
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    width: 100%;
    height: 100%;
    background: no-repeat center/100% url(../ressources/fondentette.jpg);
}

.long-text-shadow {
    text-shadow: 1px 1px 1px rgba(24, 23, 12, 0.2), 3px 3px 3px rgba(24, 23, 12, 0.16), 5px 5px 5px rgba(24, 23, 12, 0.12), 7px 7px 7px rgba(24, 23, 12, 0.08), 9px 9px 9px rgba(24, 23, 12, 0.04), 11px 11px 11px rgba(24, 23, 12, 0.02) !important;
}

ul.menu_droite {
    list-style: none;
    margin: 0 0 20px;
    padding: 0;
    border-radius: 4px;
    overflow: hidden;
}

ul.menu_droite li {
    margin: 0;
    padding: 0;
}

ul.menu_droite li:first-child {
    background-color: #fff;
    padding: 0;
}

ul.menu_droite li:first-child h3 {
    padding: 16px 20px 12px;
    margin: 0;
    color: black;
    text-transform: uppercase;
    font-weight: 600;
    font-size: 18px;
}

ul.menu_droite li a {
    display: block;
    position: relative;
    width: 100%;
    background-color: rgba(229, 21, 43, 0.7);
    padding: 12px 25px;
    color: #fff;
    border-top: 1px solid rgba(255, 255, 255, 0.4);
    font-size: 16px;
    font-size: 1rem;
    line-height: 1rem;
    font-weight: 100;
    transition: background-color 200ms ease;
    -o-transition: background-color 200ms ease;
    -ms-transition: background-color 200ms ease;
    -moz-transition: background-color 200ms ease;
    -webkit-transition: background-color 200ms ease;
}

ul.menu_droite li a:hover {
    background-color: rgba(49, 82, 161, 1);
    color: white;
    text-decoration: none;
}

.contenu {
    background-color: #f8f8f8;
    min-height: 400px;
    padding-left: 15px;
    padding-right: 15px;
}

.footer {
    padding-top: 50px;
    padding-bottom: 40px;
    color: white;
    background-color: rgb(40, 77, 165);
}

.partenaires {
    background-color: rgb(23, 57, 134);
    padding-top: 30px;
    color: white;
    padding-bottom: 40px;
}

.footersite {
    background-color: rgb(40, 77, 165);
    font-size: 12px;
    color: white;
    padding-bottom: 5px;
    padding-top: 5px;
}

.tuile {
    position: relative;
    margin-top: 20px;
    transition: all 300ms;
    -o-transition: all 300ms;
    -ms-transition: all 300ms;
    -moz-transition: all 300ms;
    -webkit-transition: all 300ms;
    padding: 0;
    min-height: 50px;
    max-height: 250px;
    height: 100%;
}

.tuile a,
.tuile form {
    position: relative;
    height: 100%;
    width: calc(100%-30px);
    padding: 0;
    margin: 0 10px 0 10px;
    background-color: white;
    border-radius: 8px;
    box-shadow: 0 6px 15px -3px rgba(0, 0, 0, 0.51);
    overflow: hidden;
    transition: background-color 0.5s ease;
    -o-transition: background-color 0.5s ease;
    -ms-transition: background-color 0.5s ease;
    -moz-transition: background-color 0.5s ease;
    -webkit-transition: background-color 0.5s ease;
    color: rgba(49, 82, 161, 1);
    word-break: break-word;
}

.tuile h2,
.tuile h3 {
    font-weight: bold;
    padding: 10px;
    font-size: 1.5rem;
    line-height: 1.2;
}

.tuile .btntuile {
    font-size: 2.5rem;
    line-height: 2.5rem;
    margin-bottom: 15px;
}

.tuile a:hover,
.tuile form:hover {
    background-color: rgba(49, 82, 161, 1);
    color: white;
    text-decoration: none;
}

.tuile a:hover .btntuile,
.tuile form:hover .btntuile {
    background-color: rgba(229, 21, 43, 1);
    border-color: rgba(229, 21, 43, 1);
    animation-duration: 0.5s;
    animation-name: moverightleft;
}

@keyframes moverightleft {
    0% {
        margin-left: 0;
    }
    50% {
        margin-left: 20px;
    }
    100% {
        margin-left: 0;
    }
}

.btntuile {
    width: 4rem;
    height: 4rem;
    padding: 0;
    border-radius: 1000px !important;
    -o-border-radius: 1000px !important;
    -ms-border-radius: 1000px !important;
    -moz-border-radius: 1000px !important;
    -webkit-border-radius: 1000px !important;
    background-color: rgba(49, 82, 161, 1);
    border-color: rgba(49, 82, 161, 1);
    border-style: solid;
    color: white;
    font-weight: bold;
    margin-top: auto;
}

.ribbon {
    z-index: 20;
    position: absolute;
    /* 1 */
    bottom: 0;
    /* 1 */
    left: 0;
    /* 1 */
    padding: 0 2em;
    /* 2 */
    text-align: center;
    /* 3 */
    transform: translateY(100%) rotate(90deg) translateX(-70.71067811865476%) rotate(-45deg);
    /* 4 */
    transform-origin: top left;
    /* 4 */
    background-color: rgba(49, 82, 161, 1);
    color: white;
    box-shadow: 0 0 4px rgba(0, 0, 0, 0.5);
}

.tuile form:hover .ribbon {
    background-color: rgba(229, 21, 43, 1);
    color: white;
}

.ribbon.disabled,
.tuile form:hover .ribbon.disabled {
    background-color: grey;
    color: black;
}

.nav-pills .nav-link {
    border: 1px solid rgba(49, 82, 161, 1);
    padding: 3px 10px;
    margin: 2px;
    text-align: center;
}

.nav-pills .nav-link.active {
    background-color: rgba(49, 82, 161, 1);
    border-color: rgba(49, 82, 161, 1);
    color: white;
}

#onglets .nav-item {
    max-width: 135px;
}

#onglets .nav-link {
    min-height: 57px;
}

.logopartenaires img {
    height: 77px;
    max-width: 100%;
    vertical-align: middle;
    border: 0;
    margin: 5px 10px;
}

#pageconstruction {
    margin-left: auto;
    margin-right: auto;
    width: 80%;
    font-size: 25vmin;
    color: rgba(229, 21, 43, 1);
}

#canvas_france,
#carte_france {
    position: relative;
    display: block;
    padding: 1px;
    margin-left: auto;
    margin-right: auto;
    border: 1px solid #ddd;
}

#lcidepartement {
    width: 100px;
    flex-grow: 0;
}

#numdep,
#territoriale {
    position: absolute;
    top: 10px;
    left: 10px;
    background-color: rgba(229, 21, 43, 0.5);
    padding: 5px;
}

svg {
    overflow: hidden;
}

#tableclubs tr:hover {
    background-color: rgba(229, 21, 43, 0.8);
    color: white;
}

.cardbleu .card-header {
    background-color: rgba(49, 82, 161, 1);
    /*   #eef0f7;*/
    color: white;
    border-color: rgba(49, 82, 161, 1);
}

.cardbleu .card-body {
    padding: 0.5rem;
}

.cardbleu .table {
    margin-bottom: 0;
}

.cardbleu {
    border-color: rgba(49, 82, 161, 1);
}

.btn-group>.btn-group:not(:first-child)>.btn,
.btn-group>.btn:not(:first-child):not(.dropdown-toggle1) {
    border-left: 1px solid white;
}

.btn-group-vertical>.btn-group-vertical:not(:first-child)>.btn,
.btn-group-vertical>.btn:not(:first-child):not(.dropdown-toggle) {
    border-top: 1px solid white;
}

.filtre label {
    border-color: white !important;
}

.btn-check:active+.bleuscc,
.btn-check:checked+.bleuscc {
    color: #fff;
    background-color: rgba(229, 21, 43, 1);
    border-color: rgba(229, 21, 43, 1);
}

.card-header-tabs {
    background-color: rgba(49, 82, 161, 0.1);
}

.imgperf {
    color: rgba(229, 21, 43, 1);
    font-size: 20px;
}

#overlay {
    position: fixed;
    top: 0;
    left: 0;
    width: 100vw;
    height: 100vh;
    opacity: 0.8;
    background: grey;
    z-index: 5000;
}

#overlay svg {
    font-size: 15vmax;
    width: 15vmax;
    height: 15vmax;
    position: absolute;
    left: calc(50% - 7.5vmax);
    top: calc(50% - 7.5vmax);
    color: rgba(229, 21, 43, 1);
    animation-name: spin;
    animation-duration: 1000ms;
    animation-direction: alternate;
    animation-iteration-count: infinite;
    animation-timing-function: linear;
}

.P2_BCategorieSelect,
.P7_BCategorieSelect {
    width: 64px;
}

@keyframes spin {
    from {
        transform: scale(1);
    }
    to {
        transform: scale(1.5);
    }
}

#imgoverlay {
    height: 200px;
    top: 50%;
    left: 50%;
    position: fixed;
    margin-left: -200px;
    margin-top: -100px;
}

.menumove form {
    border: 5px dashed blue;
}

.menughost form {
    border: 5px dashed rgba(229, 21, 43, 1);
}

.menudrag form {
    border: 5px dashed green;
}


/************** css ancienne version *******************************/

h1 {
    text-align: left;
    margin: 0px;
    padding: 0px;
    color: rgba(49, 82, 161, 1);
    font-size: 1.7em;
}

h2 {
    font-size: 1.5rem;
    padding: 5px;
}

h3 {
    font-size: 1.2rem;
}

h4 {
    font-size: 1rem;
}

td {
    padding-right: 5px;
    padding-left: 5px;
    padding-top: 1px;
    padding-bottom: 1px;
    border-top-style: none;
    border-right-style: none;
    border-bottom-style: none;
    border-left-style: none;
}

.center {
    text-align: center;
}

.centerline {
    text-align: center;
    display: flex;
    flex-direction: column;
    align-items: center;
}

.Tableau {
    background-color: #eef2f7 !important;
    border: 1 !important;
    border-top-width: 0px !important;
    border-right-width: 0px !important;
    border-bottom-width: 0px !important;
    border-left-width: 0px !important;
    font-size: 0.9rem !important;
}

.general input {
    padding: 1px 6px;
}

.Ligne_de_titre {
    background-color: #d0dcea !important;
    color: #014d87 !important;
    padding-top: 7px !important;
    padding-bottom: 7px !important;
    padding-right: 10px !important;
    padding-left: 10px !important;
}

.Ligne_de_tableau {
    padding: 10px !important;
}

.Ligne_de_detail {
    font-size: 10px;
    font-style: italic;
    background-color: rgba(49, 82, 161, 1);
    color: white;
}

.fonce {
    background-color: #dae3ee;
}

.selectionne {
    color: rgba(229, 21, 43, 1);
    font-weight: bolder;
    text-decoration: none;
}


/**** InfoBulle ********************************************************/

span.info {
    position: relative;
    cursor: pointer;
    /* pour faire fonctionner :hover sur le tactile iOS */
}

span.bulle {
    cursor: pointer;
    /* pour faire fonctionner :hover sur le tactile iOS */
    display: none;
    position: absolute;
    margin-top: 5px;
    right: -15px;
    z-index: 99;
    background: #ffffff;
    /*-webkit-border-radius: 10px;
	-moz-border-radius: 10px;
	border-radius: 10px;*/
    padding: 10px;
    white-space: nowrap;
    text-align: left;
    border: solid 1px #333;
}

/* fleche */

span.bulle:after {
    content: "";
    text-align: right;
    position: absolute;
    top: -10px;
    right: 50px;
    width: 0;
    height: 0;
    border-bottom: 10px solid #fff;
    border-left: 10px solid transparent;
    border-right: 10px solid transparent;
}

/* zone invisible autour de la fleche pour ne pas perdre le focus de la souris entre le lien et la bulle */

span.bulle:before {
    content: "";
    position: absolute;
    top: -20px;
    left: 0px;
    width: 100%;
    height: 20px;
    /*background: red;*/
}

/* affichage de la bulle */

span.info:hover span.bulle,
span.bulle:hover {
    display: block;
}

/***********************  Barre de remplissage concours ********************************/

.dropdownvs {
    height: auto;
    max-height: 200px;
    overflow-x: hidden;
}

.barreVide {
    width: 50px;
    height: 15px;
    padding: 1px;
    border-radius: 7px;
    text-align: left;
    display: inline-block;
}

.barreRouge {
    position: absolute;
    border-radius: 7px;
    width: 50px;
    height: 15px;
    /*background-color: #FD321C;*/
    background-color: #ff9218;
}

.barreVerte {
    position: absolute;
    border-radius: 7px;
    width: 50px;
    height: 15px;
    background-color: #50b332;
}

.barreGrise {
    position: absolute;
    border-radius: 7px;
    width: 50px;
    height: 15px;
    background-color: #c8c8c8;
    visibility: hidden;
}

.barreTexte {
    position: absolute;
    width: 50px;
    height: 15px;
    z-index: 10;
    text-align: center;
    font-size: 11px;
    font-weight: bold;
    color: #ffffff;
}


/**** FIN InfoBulle ********************************************************/

.iconer {
    background: #ed001e;
    position: relative;
    display: block;
    width: 80px;
    height: 50px;
    line-height: 50px;
    text-align: center;
    /*border-radius: 50%;*/
    color: white;
    font-size: 18px;
    font-weight: normal;
    transition: 0.5s;
}

.iconer:hover {
    transform: scale(1.2, 1.2);
    transition: 0.5s;
    box-shadow: 0px 0px 10px black;
}

.iconev {
    background: #44a901;
    position: relative;
    display: block;
    width: 80px;
    height: 50px;
    line-height: 50px;
    text-align: center;
    /*border-radius: 50%;*/
    color: white;
    font-size: 18px;
    font-weight: normal;
    transition: 0.5s;
}

.iconev:hover {
    transform: scale(1.2, 1.2);
    transition: 0.5s;
    box-shadow: 0px 0px 10px black;
}

.iconeo {
    background: #ffcc00;
    position: relative;
    display: block;
    width: 80px;
    height: 50px;
    line-height: 50px;
    text-align: center;
    /*border-radius: 50%;*/
    color: white;
    font-size: 18px;
    font-weight: normal;
    transition: 0.5s;
}

.iconeo:hover {
    transform: scale(1.2, 1.2);
    transition: 0.5s;
    box-shadow: 0px 0px 10px black;
}

#tablecalendrier {
    border-collapse: separate;
    border-spacing: 0 5px;
}

#tablecalendrier td,
#tablecalendrier th {
    padding: 0.2rem;
}

#bcalendriertoutvalider input {
    font-size: 0.8rem;
}

.dropdown-menu .dropdown-item:hover {
    background-color: rgba(229, 21, 43, 1);
    color: white;
    transition: 0.2s;
}


/************************ media query *********************************/

@media (min-width: 576px) {}


/* Medium devices (tablets, 768px and up)*/

@media (min-width: 768px) {}


/* Large devices (desktops, 992px and up)*/

@media (min-width: 992px) {
    #menu_gauche {
        width: 250px;
        position: fixed;
        top: 0;
        bottom: 0;
        left: 0;
        z-index: 1000;
        display: block;
        overflow: hidden;
        background-color: rgba(49, 82, 161, 1);
        color: white;
    }
    #wrapper {
        padding-top: 0 !important;
        padding-left: 250px;
        width: 100%;
        transition: padding 200ms ease;
        -o-transition: padding 200ms ease;
        -ms-transition: padding 200ms ease;
        -moz-transition: padding 200ms ease;
        -webkit-transition: padding 200ms ease;
        z-index: 1;
    }
    .entete {
        padding-top: 50px;
        color: black;
    }
}


/* Extra large devices (large desktops, 1200px and up)*/

@media (min-width: 1200px) {
    .tuile {
        min-height: 175px;
    }
}

@media (min-width: 1400px) {}

@media (max-width: 575.98px) {
    #breadcrumps {
        max-height: 50px;
    }
    #breadcrumps .breadcrumb {
        background-color: inherit;
        margin: 0;
        font-size: 0.9rem;
        max-height: 50px;
    }
    .btn {
        font-size: 0.8rem;
    }
    .footer {
        padding-top: 20px!important;
        padding-bottom: 20px;
    }
    .tuile h2,
    .tuile h3 {
        font-weight: bold;
        padding: 10px;
        font-size: 1.2rem;
        line-height: 1.1;
    }
    .contenu {
        padding-left: 3px;
        padding-right: 3px;
    }
    body {
        font-size: 0.9rem;
    }
    #onglets .nav-link {
        padding: 2px 2px;
        font-size: 0.7rem !important;
        max-width: 90px;
        line-height: 1;
    }
    #onglets .nav-link {
        min-height: 35px !important;
    }
    .Tableau {
        font-size: 2.3vw !important;
    }
    .iconer,
    .iconeo,
    .iconev {
        width: 40px;
        height: 40px;
        line-height: 40px;
        font-size: 12px;
    }
    td {
        padding: 1px;
    }
    .Ligne_de_titre {
        padding: 1px;
    }
}


/* Small devices (landscape phones, less than 768px) */

@media (max-width: 767.98px) {
    .footer {
        padding-top: 60px;
    }
}


/* Medium devices (tablets, less than 992px) */

@media (max-width: 991.98px) {
    #menu_gauche {
        display: none;
    }
    #breadcrumps {
        position: fixed;
        left: 0;
        top: 60px;
        margin: 0;
        display: block;
        height: 60px;
        width: 100%;
    }
    .general {
        font-size: 12px;
    }
    span.bulle {
        right: -20px;
    }
    /* fleche */
    span.bulle:after {
        right: 10px;
    }
}


/* Large devices (desktops, less than 1200px) */

@media (max-width: 1199.98px) {}


/* X-Large devices (large desktops, less than 1400px)*/

@media (max-width: 1399.98px) {}

.option {
    color: #999;
}

#Table_edition_concours .option td {
    color: #333;
    font-style: italic;
    vertical-align: middle;
}


/* Page saisie des baremes de prix (CTR, CNEAC)*/

.table_bareme_prix {
    width: 100%;
    text-align: center;
}

.table_bareme_prix .categorie {
    width: 100px;
}

.table_bareme_prix .libelle {
    width: 100%;
}

.table_bareme_prix .montant {
    width: 80px;
}


/* Page saisie des r�sultat attelage*/

.saisieResultats th {
    text-align: center;
}

.saisieResultats input {
    font-size: 26px;
    margin: 2px;
}

.saisieResultats div {
    display: flex;
}

.saisieResultats div div {
    display: inline-flex;
    align-items: center;
}

.table_general {
    border: 1px solid rgba(49, 82, 161, 1);
    width: 100%;
    text-align: center;
}

.table_general th,
.table_general td {
    border-left: 1px solid rgba(49, 82, 161, 1);
}

.table_general th {
    border-bottom: 1px solid rgba(49, 82, 161, 1);
    border-top: 1px solid rgba(49, 82, 161, 1);
}

.table_sans_bordure {
    border: 0px;
    width: 100%;
    text-align: center;
}

.table_sans_bordure .left {
    text-align: left;
}

.table_sans_bordure .right {
    text-align: right;
}

.table_centree {
    border: 1px solid rgba(49, 82, 161, 1);
    margin: auto;
}

.alarm {
    color: red;
}
.salmon {
    color: lightsalmon;
}

.alarm ul {
    text-align: left;
}

.success {
    color: green;
}

.warning {
    color: orange;
}

/*Pages performances : mise en �vidence qualificatifs (passage niveau sup, selection gpf, ...*/

.tuilequalif {
    color: white;
    height: 25px;
    width: 40px;
    border-radius: 5px;
    line-height: 25px;
    text-align: center;
}


/*Pages performances : crit�res ok pour qualificatifs (passage niveau sup, selection gpf, ...)*/

.tuilequalifoui {
    background-color: #33cc00;
}


/*Pages performances : crit�res ko pour qualificatifs (passage niveau sup, selection gpf, ...)*/

.tuilequalifnon {
    background-color: #ff3333;
}

input:invalid {
  border: 2px dashed red;
}

input:valid {
  border: 1px solid black;
}