﻿/* ~~ Gestion du logo du type de plateforme ~~ */
.logo_type_plateforme {
    position: fixed;
    right: 10px;
    bottom: 10px;
    margin: 0 auto;
    width: 100px;
    height: 100px;
    border-radius: 50%;
    font-weight: bold;
    color: #F1700B;
    animation: spinZ 10s linear infinite;
    text-align: center;
    background: transparent;
    font-family: 'Gotham', sans-serif;
    font-weight: 600;
    overflow: hidden;
}

    .logo_type_plateforme span {
        position: absolute;
        display: inline-block;
        left: 0;
        right: 0;
        top: 0;
        bottom: 0;
        text-transform: uppercase;
        font-size: 14px;
        transition: all .5s cubic-bezier(0,0,0,1);
    }

        .logo_type_plateforme span#external_circle {
            width: 100%;
            height: 100%;
            border-radius: 50%;
            border: 2px solid rgba(241, 112, 11,1);
        }

        .logo_type_plateforme span#internal_circle {
            width: 60%;
            height: 60%;
            border-radius: 50%;
            border: 2px solid rgba(241, 112, 11,1);
            margin: 20%;
        }

    .logo_type_plateforme.macaron_local {
        color: #E8007F;
    }

        .logo_type_plateforme.macaron_local span#external_circle {
            border-color: #E8007F;
        }

        .logo_type_plateforme.macaron_local span#internal_circle {
            border-color: #E8007F;
        }

    .logo_type_plateforme.macaron_test {
        color: #00E83C;
    }

        .logo_type_plateforme.macaron_test span#external_circle {
            border-color: #00E83C;
        }

        .logo_type_plateforme.macaron_test span#internal_circle {
            border-color: #00E83C;
        }

    .logo_type_plateforme.macaron_preprod {
        color: #FFA600;
    }

        .logo_type_plateforme.macaron_preprod span#external_circle {
            border-color: #FFA600;
        }

        .logo_type_plateforme.macaron_preprod span#internal_circle {
            border-color: #FFA600;
        }

    .logo_type_plateforme.macaron_prod {
        color: #2BB7F8;
    }

        .logo_type_plateforme.macaron_prod span#external_circle {
            border-color: #2BB7F8;
        }

        .logo_type_plateforme.macaron_prod span#internal_circle {
            border-color: #2BB7F8;
        }

@keyframes spinZ {
    0% {
        transform: rotateZ(360deg);
    }

    100% {
        transform: rotateZ(0deg);
    }
}
/* ~~ Fin gestion du logo du type de plateforme ~~ */

/* ===== Text selection CSS ===== */
::-moz-selection { /* Code for Firefox */
    color: #fff !important;
    background: #83b81a !important;
}

::selection {
    color: #fff !important;
    background: #83b81a !important;
}

/* ~~ Légende tableau Reservation ~~ */
.legende_tableau_resa {
    display: flex;
    align-items: center;
    justify-content: center;
}
.reservations_validees_legende {
    width: 15px;
    height: 10px;
    background: #fff;
    display: inline-block;
    border: 1px solid #e0e0e0;
}
.reservations_annulees_legende {
    width: 15px;
    height: 10px;
    background: rgba(255, 108, 108, .2);
    display: inline-block;
    border: 1px solid #e0e0e0;
}
/* ~~ ~~ */

/* ~~ Syncfusion ~~ */
.e-grid .reservation_annulee,
.e-grid .reservation_annulee:hover {
    background-color: rgba(255, 108, 108, .2) !important;
}
    .e-grid .reservation_annulee:hover td,
    .e-grid .reservation_annulee td.e-active,
    .e-grid .reservation_annulee:hover td.e-active {
        background-color: transparent !important;
    }
    .e-grid .reservation_annulee button.cancelResaEvent,
    .e-grid .reservation_annulee button.reSendMailResaEvent,
    .e-grid .reservation_annulee button.cancelResaAnime,
    .e-grid .reservation_annulee button.reSendMailResaAnime {
        opacity: .5 !important;
        pointer-events: none !important;
    }
table td.cell-to-alignright {
    text-align: right !important;
}

.e-grid .e-filtered::before {
    color: #83b81a !important;
}
.e-grid .e-toolbar {
    height: 60px !important;
}
    .e-grid .e-toolbar button {
        font-family: 'Roboto', sans-serif !important;
        font-weight: 500 !important;
        min-width: 199px !important;
        width: auto !important;
        background: #83b81a !important;
        color: #fff !important;
        border-radius: 5px !important;
        font-size: 1.25rem !important;
    }
        .e-grid .e-toolbar button .e-btn-icon {
            color: #fff !important;
        }
        .e-grid .e-toolbar button .e-tbar-btn-text {
            color: #fff !important;
        }
.e-input-group:not(.e-float-icon-left):not(.e-float-input)::before, .e-input-group:not(.e-float-icon-left):not(.e-float-input)::after, .e-input-group.e-float-icon-left:not(.e-float-input) .e-input-in-wrap::before, .e-input-group.e-float-icon-left:not(.e-float-input) .e-input-in-wrap::after, .e-input-group.e-control-wrapper:not(.e-float-icon-left):not(.e-float-input)::before, .e-input-group.e-control-wrapper:not(.e-float-icon-left):not(.e-float-input)::after, .e-input-group.e-control-wrapper.e-float-icon-left:not(.e-float-input) .e-input-in-wrap::before, .e-input-group.e-control-wrapper.e-float-icon-left:not(.e-float-input) .e-input-in-wrap::after {
    background: #83b81a !important;
}
.e-grid .e-input-group.e-search {
    font-size: 1rem !important;
}
.e-grid .e-headercell {
    background-color: #0f2b36 !important;
    color: white !important;
    padding: 1.3rem 0.75rem !important;
    font-size: 1rem !important;
    vertical-align: middle !important;
}
.e-grid .e-headercelldiv {
    text-align: center !important;
    width: 100% !important;
    padding: 0 !important;
    margin: 0 !important;
    font-size: 1rem !important;
}
.e-grid .e-rowcell {
    font-size: 1rem !important;
    padding: 1.25rem 0.75rem !important;
    vertical-align: middle !important;
    color: #0f2b36 !important;
}
.e-grid .e-gridcontent tr td:first-child {
    font-weight: bold;
}
.e-pager .e-currentitem, .e-pager .e-currentitem:hover {
    background: #83b81a !important;
    color: #fff !important;
    opacity: 1 !important;
}
.e-grid .e-parentmsgbar {
    font-size: .85rem;
}
.e-grid .e-gridheader .e-icons:not(.e-icon-hide):not(.e-check):not(.e-stop):not(.e-icon-reorderuparrow):not(.e-icon-reorderdownarrow) {
    color: #fff !important;
}
.e-btn.e-flat.e-primary:hover, .e-css.e-btn.e-flat.e-primary:hover {
    background-color: rgba(131, 184, 26,0.04) !important;
    border-color: transparent !important;
    color: #83b81a !important;
}
.e-btn.e-flat.e-primary, .e-css.e-btn.e-flat.e-primary {
    background-color: transparent;
    border-color: transparent;
    color: #83b81a !important;
}
.e-radio:checked + label::before {
    background-color: #fff;
    border-color: #83b81a !important;
}
.e-radio:checked + label::after {
    background-color: #83b81a !important;
    color: #83b81a !important;
}
.e-checkbox-wrapper .e-frame.e-check, .e-css.e-checkbox-wrapper .e-frame.e-check {
    background-color: #83b81a !important;
    border-color: transparent !important;
    color: #fff !important;
}
.e-grid th.e-headercell[aria-sort='ascending'] .e-sortfilterdiv, .e-grid th.e-headercell[aria-sort='descending'] .e-sortfilterdiv {
    color: #83b81a !important;
    float: none !important;
    position: absolute !important;
    bottom: 10px !important;
    margin: 0 !important;
    right: 25px !important;
    padding: 0 !important;
}
.e-grid th.e-headercell[aria-sort='ascending'] .e-headertext, .e-grid th.e-headercell[aria-sort='descending'] .e-headertext {
    color: #83b81a !important;
}
.e-grid .e-filtermenudiv {
    float: none !important;
    position: absolute !important;
    bottom: 10px !important;
    right: 0 !important;
    padding: 0 !important;
    margin: 0 !important;
}

/* ~~ Fin Syncfusion ~~ */

body .notifyjs-wrapper {
    z-index: 1040;
}

/* ~~ Syncfusion ~~ */
.titre_evenement_cell {
    font-weight: bold;
}
/* ~~ Fin Syncfusion ~~ */

/* Page d'erreur */
.infos_erreur div {
    background: rgba(15, 43, 54, 0.8);
    border: 1px solid rgb(15, 43, 54);
    display: inline-block;
    padding: 10px 20px;
    border-radius: 5px;
}
    .infos_erreur div h2 {
        color: rgb(255, 255, 255);
        font-family: 'rogue-serif', arial, serif;
    }
.infos_erreur div p {
    margin-bottom: 0;
}

.choixNombreInviteEvent .dropdown-menu.show {
    min-width: 100% !important;
}

.inscrit {
    margin-left: .5rem;
    font-size: 15px;
    color: #83b81a;
}

/*-- Autocomplete Chrome ;) --*/
input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:focus,
input:-webkit-autofill:active {
    -webkit-animation: autofill 0s forwards;
    animation: autofill 0s forwards;
}

@keyframes autofill {
    100% {
        background: transparent;
        color: inherit;
    }
}

@-webkit-keyframes autofill {
    100% {
        background: transparent;
        color: inherit;
    }
}
/*-- Fin autocomplete --*/

/* Compatibilité IE 9 et Supp */
@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {
    .effect-16 ~ label, .effect-16-white ~ label {
        top: 0px !important;
    }
}

.btn.focus, .btn:focus, .btn-dark.focus, .btn-dark:focus {
    outline: 0;
    box-shadow: 0 0 0 0.2rem rgba(0,123,255,0);
}

.ratio {
    background-position: center center;
    background-repeat: no-repeat;
    background-size: cover;
    height: 0;
    padding-bottom: 100%;
    position: relative;
    width: 100%;
}

.img-circle {
    border-radius: 50%;
}

.img-responsive {
    display: block;
    height: auto;
    max-width: 100%;
}

/* Extra small devices (portrait phones, less than 576px) */
/* No media query since this is the default in Bootstrap */
body, html, .container-content {
    height: calc(100% - 38px);
    margin: 0;
    font-family: 'Roboto', sans-serif;
}

body {
    background-image: url('../images/background.jpg');
    background-repeat: repeat-y;
    background-size: cover;
}

h1, h2, h3, h4, h5 {
    font-style: normal;
    font-weight: 500;
    color: #0f2b36;
}

td a {
    color: #83b81a !important;
}

    td a:hover {
        color: #83b81a !important;
        text-decoration: underline !important;
    }

    /* Spinners */
.chargement-vue-partielle {
    height: calc(50vh - 100px);
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}
.waiting-spinner {
    display: inline-block;
    width: 4rem;
    height: 4rem;
    vertical-align: text-bottom;
    border: .35rem solid #83b81a;
    border-right-color: transparent;
    border-radius: 50%;
    -webkit-animation: spinner-border .75s linear infinite;
    animation: spinner-border .75s linear infinite;
}

#saveDomaineInfo-spinner,
#soumettre-spinner,
#publieEvent-spinner,
#depublierEvent-spinner,
#publieAnime-spinner,
#depublierAnime-spinner,
#soumettreValidation-spinner {
    display: inline-block;
    width: 2rem;
    height: 2rem;
    vertical-align: text-bottom;
    border: .25rem solid #fff;
    border-right-color: transparent;
    border-radius: 50%;
    -webkit-animation: spinner-border .75s linear infinite;
    animation: spinner-border .75s linear infinite;
}

.saveDomaineInfo-spinner {
    display: inline-block;
    width: 5rem;
    height: 5rem;
    vertical-align: text-bottom;
    border: .45rem solid #83b81a;
    border-right-color: transparent;
    border-radius: 50%;
    -webkit-animation: spinner-border .75s linear infinite;
    animation: spinner-border .75s linear infinite;
}

    @keyframes spinner-border {
        100% {
            -webkit-transform: rotate(360deg);
            transform: rotate(360deg);
        }
    }
    /* Fin spinner */

#tuto-stripe {
    color: #83b81a !important;
}

#tuto-stripe:hover,#tuto-stripe:focus,#tuto-stripe:active {
    color: #83b81a !important;
    text-decoration: underline !important;
}

.texte-informatif {
    font-size: 1rem;
    color: #959595;
    font-family: 'Roboto', sans-serif;
}

.texte-informatif a {
    color: #83b81a;
}

.texte-informatif a:hover, .texte-informatif a:active, .texte-informatif a:focus {
    color: #83b81a;
}

.encadre-vert {
    max-width: 500px; /* Réduire la largeur max du bloc */
    margin: 0 auto; /* Centre horizontalement */
    padding: 1rem; /* Marges internes */
    /*border: 2px solid #83b81a;*/ /* Bordure verte */
    border-radius: 8px; /* Coins arrondis */
    background-color: #83b81a;
    color: #FFF!important;
}

/* ~~~~~~~~ Pagination tableau librairie MDB ~~~~~~~~ */
.page-item.active .page-link {
    z-index: 1;
    color: #fff;
    background-color: #83b81a;
    border-color: #83b81a;
}

.page-link {
    position: relative;
    display: block;
    padding: .5rem .75rem;
    margin-left: -1px;
    line-height: 1.25;
    color: #83b81a;
    background-color: #fff;
    border: 1px solid #dee2e6;
}
    .page-link:hover {
        color: #83b81a;
        text-decoration: none;
        background-color: #e9ecef;
        border-color: #dee2e6;
    }

.statsEvenementsDomaine input:focus, .statsEvenementsDomaine select:focus, div.dataTables_wrapper div.dataTables_filter input:focus, div.dataTables_wrapper div.dataTables_length select:focus, div.dataTables_wrapper div.dataTables_length input:focus {
    border-color: #83b81a !important;
    background-color: #fff !important;
}

/* ~~~~~~~~ Surcharge de la lib OverlayScrollbar ~~~~~~~~ */
.os-theme-dark > .os-scrollbar > .os-scrollbar-track > .os-scrollbar-handle {
    background: rgba(131,184,26, 0.4) !important;
}

.components h5 {
    font-style: normal;
    font-weight: 500;
    color: #83b81a;
}

.components a {
    font-style: normal;
    font-weight: 300;
    color: #0f2b36;
}

.row {
    margin-left: 0;
    margin-right: 0;
}

/* ~~~~~~~~ Modal d'ajout/accès à un événement/animation ~~~~~~~~ */
#select-element .card {
    cursor: pointer;
}
/* ~~~~~~~~ */

/* ~~~~~~~~ Metadatas ~~~~~~~~ */
.mtd-pages-statiques {
    height: calc(100vh - 44px);
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    padding: 0 50px;
    text-align: center;
}

.btn-maj-metadatas {
    min-width: auto !important;
    width: 100% !important;
}
/* ~~~~~~~~ */

/* ~~~~~~~~ Bouton de retour vers le haut ~~~~~~~~ */

.cRetour {
    border-radius: 20px;
    /*border: 1px solid rgba(0,0,0, 0);*/
    padding: 10px 14px;
    font-size: 15px;
    text-align: center;
    color: #83b81a;
    /*background: rgba(255, 255, 255, 0.2);*/
    z-index: 99999;
    transition: all ease-in 0.2s;
    position: fixed;
    cursor: pointer;
    bottom: 1em;
    right: 20px;
    display: none;
    width: 80px;
}

    .cRetour:before {
        /*content: "\25b2";*/
        content: url("../images/BacktoTop.svg");
        width: 80px;
        height: 80px;
    }

/*.cRetour:hover {
        background: rgba(255, 255, 255, 1);
        border: 1px solid #83b81a;
        color: #83b81a;
        transition: all ease-in 0.2s;
    }*/

/* ~~~~~~~~ */

/* ~~~~~~~~ Bootstrap Switch ~~~~~~~~ */
.bootstrap-switch .bootstrap-switch-handle-off.bootstrap-switch-primary, .bootstrap-switch .bootstrap-switch-handle-on.bootstrap-switch-primary {
    color: #fff;
    background: #83b81a !important;
}

/* ~~~~~~~~ */

/* ~~~~~~~~ Navbar  ~~~~~~~~*/
.navbar {
    z-index: 989;
}

    .navbar .text-nowrap a {
        color: #ffffff !important;
        font-style: normal;
        font-weight: 300;
        font-size: 1.125rem;
    }

    .navbar .dropdown-menu a,
    .choix-structure-liaison .dropdown-menu a{
        color: #0f2b36 !important;
        font-style: normal;
        font-weight: 300;
        font-size: 1.125rem !important;
    }

        .navbar .dropdown-menu a:hover, .navbar .dropdown-menu a:active, .navbar .dropdown-menu a:focus,
        .choix-structure-liaison .dropdown-menu a:hover, .choix-structure-liaison .dropdown-menu a:active, .choix-structure-liaison .dropdown-menu a:focus {
            color: #fff !important;
            background-color: #83b81a;
        }
            .navbar .dropdown-menu a:hover .inscrit, .navbar .dropdown-menu a:active .inscrit, .navbar .dropdown-menu a:focus .inscrit, .navbar .dropdown-menu .active .inscrit,
            .choix-structure-liaison .dropdown-menu a:hover .inscrit, .choix-structure-liaison .dropdown-menu a:active .inscrit, .choix-structure-liaison .dropdown-menu a:focus .inscrit, .choix-structure-liaison .dropdown-menu .active .inscrit {
                color: #fff !important;
            }

    .navbar .dropdown-menu .active,
    .choix-structure-liaison .dropdown-menu .active {
        color: #fff !important;
        background-color: #83b81a;
    }

.select-structure .filter-option-inner-inner,
.choix-structure-liaison .filter-option-inner-inner{
    color: #0f2b36 !important;
    font-style: normal;
    font-weight: 300;
    font-size: 1.125rem !important;
}

.select-structure .dropdown-toggle{
    background-color: transparent;
    color: #0f2b36;
    border: #fff;
}

.choix-structure-liaison .dropdown-toggle {
    background-color: transparent;
    color: #0f2b36;
    border: 1px solid #0f2b36;
}

.select-structure .dropdown,
.choix-structure-liaison .dropdown {
    border-radius: 0;
}
/* ~~~~~~~~ */

/* ~~~~~~~~ Modal custom ~~~~~~~~ */

.fa-arrow-left {
    color: #83b81a;
    font-size: 2.5rem !important;
}

.modal-title {
    color: #0f2b36;
    font-size: 30px;
    padding-top: 29px;
}

.modal-body {
    padding-top: 45px;
}

    .modal-body p {
        color: #0f2b36;
        font-family: 'Roboto', sans-serif;
        /*font-size: 1.125rem;*/
        font-size: 18px;
        line-height: normal;
    }

    .modal-body ul {
        color: #0f2b36;
        font-family: 'Roboto', sans-serif;
        /*font-size: 1.125rem;*/
        font-size: 18px;
        line-height: normal;
    }

.modal-content {
    min-height: 570px;
    height: auto;
}

.sendMailSuccess-content {
    min-height: 400px;
    height: auto;
}

.modal-header {
    border-bottom: none;
}

.modal-footer {
    border-top: none;
    padding: 0 35px 35px;
}

.modal-button {
    font-family: 'Roboto', sans-serif;
    font-weight: 500;
    min-width: 199px;
    width: auto;
    height: 55px;
    background: #83b81a;
    color: #fff;
    border-radius: 5px;
    font-size: 1rem;
}

/* ~~~~~~~~ */

/* ~~~~~~~~ Header ~~~~~~~~ */

.titre-section-bo {
    margin: 44px 0 55px 40px;
    padding-top: 15px;
}

.titre-section-bo-accueil {
    margin: 44px 0 40px 40px;
    padding-top: 15px;
}

/* Partie Image */
.bgimg {
    position: relative;
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    background-image: url("../images/stock-photo/fond-automne01.jpg");
    background-attachment: fixed;
    /*height: 100%;*/
    height: 100vh;
}

    .bgimg:before {
        content: '';
        position: absolute;
        top: 0;
        right: 0;
        bottom: 0;
        left: 0;
        background-image: linear-gradient(to bottom right,#000,#000);
        opacity: .3;
    }

.bgimg-confirm {
    position: relative;
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    background-image: url("../images/stock-photo/077_ETIENNE RAMOUSSE_INTER BEAUJOLAIS_BIENVENUE EN BEAUJONOMIE_2018_opt.jpg");
    background-attachment: fixed;
    /*height: 100%;*/
    height: 100vh;
}

    .bgimg:before {
        content: '';
        position: absolute;
        top: 0;
        right: 0;
        bottom: 0;
        left: 0;
        background-image: linear-gradient(to bottom right,#000,#000);
        opacity: .3;
    }

.logo-beaujonomie {
    position: absolute;
    top: 50%;
    right: 0;
    bottom: 0;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 288px;
}

.resetImage, .resetImageAdded {
    top: 0;
    right: 0;
    background: #83b81a;
    border: none;
    color: #0f2b36;
    height: 30px;
    width: 30px;
}

    .resetImage:hover, .resetImage:focus, .resetImage:active,
    .resetImageAdded:hover, .resetImageAdded:focus, .resetImageAdded:active {
        top: 0;
        right: 0;
        cursor: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABEAAAARCAYAAAA7bUf6AAAACXBIWXMAAAsSAAALEgHS3X78AAAAvklEQVQ4EaWUzQ3DIAyF3SqXTsMEYRRODNFTDjl1BzgxCuoebNEeXb1WRBXF1BKWELLf8xfy45yYmay1GxFRznknZXz3LEicc1f6CCpQ23Ougvf+AqFeQYoKgP+w4HbWdd1CCA9mZuzIUW+X5DuMkkGjk8Yo1buQXoMx5j4CdCEtqJTCI4AIwcIJKgA78p5PhEyfZPqZSG9Bqv9Apr+TkUEDUgNGoKXOUIzxmVK6/Zti6JhcInpPMWL+f5Lz/gIksF+vFKdGrQAAAABJRU5ErkJggg==), auto;
        background: #0f2b36;
        border: none;
        color: #83b81a;
        height: 30px;
        width: 30px;
    }

/* Partie texte */
.box {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    width: 160px;
    height: 86px;
    overflow: hidden;
}

.informations {
    position: absolute;
    bottom: 95px;
    width: 100%;
    left: 0;
    right: 0;
    text-align: center;
}

    .informations p {
        font-family: 'Roboto', sans-serif;
        font-size: 0.875rem;
        font-weight: 500;
        margin-bottom: 1.625rem;
    }

        .informations p .fa-calendar {
            font-size: 2rem;
            color: #83b81a;
        }

        .informations p span {
            vertical-align: middle;
        }

    .informations h2 {
        margin-bottom: 1rem;
    }

    .informations p, .informations h2 {
        color: #fff;
    }

.header-button {
    font-family: 'Roboto', sans-serif;
    border: 1px solid #83b81a;
    background: rgba(131, 184, 26, .3);
    color: #fff;
    /*height: 34px;*/
    min-width: 171px;
    width: auto;
    border-radius: 5px;
    cursor: pointer;
}

.scroll-text {
    text-align: center;
    margin-top: 28px;
    color: #fff;
    font-size: 0.6875rem;
    font-family: sans-serif;
    text-transform: uppercase;
}

.line {
    width: 2px;
    height: 25px;
    background: #fff;
}

.animated {
    animation-duration: 2.5s;
    animation-fill-mode: both;
    animation-iteration-count: infinite;
}

@keyframes bounce {
    0%, 20%, 50%, 80%, 100% {
        transform: translateY(0);
    }

    40% {
        transform: translateY(-15px);
    }

    60% {
        transform: translateY(-10px);
    }
}

.bounce {
    animation-name: bounce;
}

/* ~~~~~~~~~~~~~~~~ */

/* ~~~~~~~~ Formulaire ~~~~~~~~ */

.bloc {
    /*min-height: 484px;*/
    height: auto;
    -moz-box-shadow: 0px 3px 5px 0px #EBEBEB;
    -webkit-box-shadow: 0px 3px 5px 0px #EBEBEB;
    -o-box-shadow: 0px 3px 5px 0px #EBEBEB;
    box-shadow: 0px 3px 5px 0px #EBEBEB;
    filter: progid:DXImageTransform.Microsoft.Shadow(color=#EBEBEB, Direction=180, Strength=5);
    padding-bottom: 72px;
}

.bloc-blanc {
    background: #fff;
}

.bloc-bleu {
    background: #0f2b36;
    margin: 0.875rem 0;
}

.container-form {
    text-align: center;
}

.error {
    font-family: 'Roboto', sans-serif;
    color: #E82C0C;
}

.fa-question-circle {
    color: #83b81a;
    cursor: help;
}

.submit-part {
    margin: 71px 0;
}

.general-button {
    font-family: 'Roboto', sans-serif;
    font-weight: 500;
    min-width: 199px;
    width: auto;
    height: 60px;
    background: #83b81a;
    color: #fff;
    border-radius: 5px;
    font-size: 1.25rem;
}

#formulaire-inscription {
    margin-top: 87px;
    margin-bottom: 87px;
}

.titre {
    text-decoration: underline;
    color: #0f2b36;
}

.bloc .titre {
    padding-left: 0;
}

.facultatif {
    font-family: 'Roboto', sans-serif;
    color: #959595;
    font-style: italic;
}

input[type='number'] {
    -moz-appearance: textfield;
}

input[type=number]::-webkit-inner-spin-button,
input[type=number]::-webkit-outer-spin-button {
    -webkit-appearance: none;
    margin: 0;
}

/* Informations générales */
@-moz-keyframes rotation {
    100% {
        -moz-transform: rotate(360deg);
    }
}

@-webkit-keyframes rotation {
    100% {
        -webkit-transform: rotate(360deg);
    }
}

@keyframes rotation {
    100% {
        -webkit-transform: rotate(360deg);
        transform: rotate(360deg);
    }
}

/* Porteur du projet */
/* Information événement */
.repas-group button {
    font-family: 'Roboto', sans-serif;
    font-weight: 500;
    border: 1px solid #0f2b36;
    background-color: #fff;
    height: 36px;
}

    .repas-group button:hover, .repas-group button:focus, .repas-group button:active {
        font-family: 'Roboto', sans-serif;
        font-weight: 500;
        border: 1px solid #0f2b36;
        background-color: #fff;
    }

.repas-group .filter-option-inner-inner {
    color: #959595;
    font-style: italic;
}

.repas-group .dropdown-menu {
    border: 1px solid #0f2b36;
    background-color: #fff;
}

    .repas-group .dropdown-menu .disabled {
        color: #959595;
        font-family: 'Roboto', sans-serif;
        font-weight: 300;
        font-style: italic;
    }

        .repas-group .dropdown-menu .disabled a:hover {
            background-color: #fff;
            color: #959595;
            cursor: default;
        }

    .repas-group .dropdown-menu a {
        font-family: 'Roboto', sans-serif;
        font-weight: 500;
        color: #0f2b36;
    }

        .repas-group .dropdown-menu a:active, .repas-group .dropdown-menu a:hover, .repas-group .dropdown-menu a:focus {
            font-family: 'Roboto', sans-serif;
            font-weight: 500;
            background-color: #83b81a;
            color: #fff;
        }

    .repas-group .dropdown-menu .selected {
        font-family: 'Roboto', sans-serif;
        font-weight: 500;
        color: #83b81a;
    }

/* Inputs */
#searchDataNoInter {
    position: absolute;
    right: 0;
    bottom: 2px;
    color: #fff;
    background: #83b81a;
}

.form-control {
    tab-index: -1;
}

    .form-control:focus {
        background-color: transparent !important;
        outline: 0 !important;
        box-shadow: none !important;
        border-color: transparent !important;
        color: #83b81a !important;
    }

:focus {
    outline: none;
}

.input-effect {
    margin: 40px 0 0 0;
    position: relative;
}

    .input-effect .effect-16, .choixRepas-label {
        font: 15px/32px "Roboto", Arial, sans-serif;
        color: #0f2b36;
        width: 100%;
        box-sizing: border-box;
        letter-spacing: 1px;
        border-radius: 0;
    }

    .input-effect .effect-16-white {
        font: 15px/32px "Roboto", Arial, sans-serif;
        color: #fff;
        width: 100%;
        box-sizing: border-box;
        letter-spacing: 1px;
        border-radius: 0;
    }

.effect-16 {
    border: 0;
    padding: 4px 0;
    border-bottom: 1px solid #0f2b36;
    background-color: transparent;
}

.effect-16-white {
    border: 0;
    padding: 4px 0;
    border-bottom: 1px solid #fff;
    background-color: transparent;
}

    .effect-16 ~ .focus-border, .effect-16-white ~ .focus-border {
        position: absolute;
        bottom: 0;
        left: 0;
        width: 0;
        height: 2px;
        background-color: #83b81a;
        transition: 0.4s;
    }

    .effect-16:focus ~ .focus-border,
    .has-content.effect-16 ~ .focus-border, .effect-16-white:focus ~ .focus-border,
    .has-content.effect-16-white ~ .focus-border {
        width: 100%;
        transition: 0.4s;
    }

.effect-16 ~ label {
    font-family: 'Roboto', sans-serif;
    position: absolute;
    left: 0;
    width: auto;
    top: 9px;
    color: #0f2b36;
    transition: 0.3s;
    z-index: 1;
    letter-spacing: 0.5px;
}

.effect-16-white ~ label {
    font-family: 'Roboto', sans-serif;
    position: absolute;
    left: 0;
    width: auto;
    top: 9px;
    color: #fff !important;
    transition: 0.3s;
    z-index: 1;
    letter-spacing: 0.5px;
}

.effect-16:focus ~ label, .has-content.effect-16 ~ label {
    top: -16px !important;
    font-size: 14px;
    color: #83b81a !important;
    transition: 0.3s;
}

.effect-16-white:focus ~ label, .has-content.effect-16-white ~ label {
    top: -16px !important;
    font-size: 14px;
    color: #83b81a !important;
    transition: 0.3s;
}

/* ~~~~~~~~~~~~~~~~ */

/* ~~~~~~~~ Domaine ~~~~~~~~ */

/* ~~~~~~~~~~~~~~~~ */

/* ~~~~~~~~ Tableau récapitulatif évenements ~~~~~~~~ */

.dtStatsTable {
    width: 100% !important;
}

.table-event .thead-dark th {
    background-color: #0f2b36 !important;
    border-color: #0f2b36 !important;
}

.table-event td, .table-event td {
    color: #0f2b36 !important;
}

.dtStatsTable.table-event .thead-dark th {
    font-size: .85rem;
    border-color: #fff !important;
    border-bottom-width: 1px !important;
}

.dtStatsTable.table-event td, .dtStatsTable .table-event td {
    font-size: .85rem;
}

.dtStatsTable.dataTable thead .sorting:before, .dtStatsTable.dataTable thead .sorting_asc:before, .dtStatsTable.dataTable thead .sorting_desc:before, .dtStatsTable.dataTable thead .sorting_asc_disabled:before, .dtStatsTable.dataTable thead .sorting_desc_disabled:before {
    right: 16px;
    font-family: FontAwesome, sans-serif;
    font-size: 1rem;
    font-weight: 900;
    content: "\f0de";
}

.dtStatsTable.dataTable thead .sorting:after, .dtStatsTable.dataTable thead .sorting_asc:after, .dtStatsTable.dataTable thead .sorting_desc:after, .dtStatsTable.dataTable thead .sorting_asc_disabled:after, .dtStatsTable.dataTable thead .sorting_desc_disabled:after {
    right: 16px;
    font-family: FontAwesome, sans-serif;
    font-size: 1rem;
    font-weight: 900;
    content: "\f0dd";
}

.even-column {
    background-color: rgba(0,0,0,.075);
}
/* ~~~~~~~~~~~~~~~~ */

/* ~~~~~~~ Accueil */
.module-choix-edition button.dropdown-toggle {
    font-family: 'Roboto', sans-serif;
    font-weight: 400;
    border: 1px solid #0f2b36;
    background-color: #fff;
    height: 36px;
}

.module-choix-edition .filter-option-inner-inner {
    color: #959595;
    font-style: italic;
}

.module-choix-edition .dropdown-menu {
    border: 1px solid #0f2b36;
    background-color: #fff;
}

.module-choix-edition .dropdown-menu a {
    font-family: 'Roboto', sans-serif;
    font-weight: 500;
    color: #0f2b36;
}

    .module-choix-edition .dropdown-menu a:active, .module-choix-edition .dropdown-menu a:hover, .module-choix-edition .dropdown-menu a:focus {
        font-family: 'Roboto', sans-serif;
        font-weight: 500;
        background-color: #83b81a;
        color: #fff;
    }

    .module-choix-edition .dropdown-menu .selected {
        font-family: 'Roboto', sans-serif;
        font-weight: 500;
        color: #fff;
        background-color: #83b81a;
    }

footer {
    font-family: 'Roboto', sans-serif;
    color: #0f2b36;
    font-weight: 500;
}

/* ~~~~~~~~~~ Réservation */
.choix-typeReservation-ul {
    border-bottom: 1px solid #83b81a !important;
}

.choix-typeReservation-ul .nav-link {
    opacity: .5;
}

    .choix-typeReservation-ul .nav-link.active {
        /*color: #83b81a !important;
        border-color: #83b81a #83b81a #ffffff !important;
        background-color: transparent !important;
        opacity: 1;*/
        color: #fff !important;
        border-color: #83b81a #83b81a #83b81a !important;
        background-color: #83b81a !important;
        opacity: 1;
    }

    .choix-typeReservation-ul .nav-link:hover {
        color: #fff !important;
        border-color: #83b81a #83b81a #83b81a !important;
        background-color: rgba(131,184,26,.4) !important;
        opacity: 1;
    }

.allEventsReserved .fa-exclamation-triangle, .allAnimationsReserved .fa-exclamation-triangle {
    font-size: 20px;
    color: #83b81a;
}

/* ~~~~~~~~ Ajout/Modification d'un événement ~~~~~~~~ */
.save-modifications-event, .save-modifications-animation {
    position: fixed;
    bottom: 0;
    left: 50%;
    transform: translateX(-50%);
    z-index: 999;
    width: 100%;
    background: #0f2b36;
    padding: 0 0 10px 0;
}
/*.save-modifications-event {
    padding: 0 0 10px 0;
}*/



#saveDomaineInfo {
    box-shadow: 0 0 0 rgba(131, 184, 26, 0.8);
    animation: pulse 2s infinite;
}

    #saveDomaineInfo:hover {
        -webkit-animation: none;
        -moz-animation: none;
        -ms-animation: none;
        animation: none;
    }

@-webkit-keyframes pulse {
    0% {
        -webkit-box-shadow: 0 0 0 0 rgba(131, 184, 26, 0.8);
    }

    70% {
        -webkit-box-shadow: 0 0 0 10px rgba(131, 184, 26, 0);
    }

    100% {
        -webkit-box-shadow: 0 0 0 0 rgba(131, 184, 26, 0);
    }
}

@keyframes pulse {
    0% {
        -moz-box-shadow: 0 0 0 0 rgba(131, 184, 26, 0.8);
        box-shadow: 0 0 0 0 rgba(131, 184, 26, 0.8);
    }

    70% {
        -moz-box-shadow: 0 0 0 10px rgba(131, 184, 26, 0);
        box-shadow: 0 0 0 10px rgba(131, 184, 26, 0);
    }

    100% {
        -moz-box-shadow: 0 0 0 0 rgba(131, 184, 26, 0);
        box-shadow: 0 0 0 0 rgba(131, 184, 26, 0);
    }
}

/* Small devices (landscape phones, 576px and up) */
@media (min-width: 576px) {
}

/* Medium devices (tablets, 768px and up) */
@media (min-width: 768px) {

    /* ~~~~~~~~ Formulaire ~~~~~~~~ */

    .bloc .titre {
        padding-left: 2rem;
    }

    .container-form {
        text-align: initial;
    }

    #formulaire-inscription {
        margin-top: 87px;
        margin-bottom: 87px;
        margin-left: 90px;
    }

    .titre {
        text-decoration: underline;
        color: #0f2b36;
    }

    /* ~~~~~~~~~~~~~~~~ */
}

/* Large devices (desktops, 992px and up) */
@media (min-width: 992px) {

    .btn-maj-metadatas {
        min-width: 199px !important;
        width: auto !important;
    }
}

/* Extra large devices (large desktops, 1200px and up) */
@media (min-width: 1200px) {
}
