body {
    padding-bottom: 40px;
    background-color: #FFFFFF;
    background-repeat: repeat-x;
    overflow-x: hidden;
    display: table;
    width: 100%;
    height: 100%;
    margin: 0;
    padding: 0;
}

html {
    height: 100%;
    margin: 0;
    padding: 0;
}

footer {

    display: table-row;
    height: 100px; /* à titre d'exemple */

    /*position: relative;*/
    /*bottom: 0;*/
    /*width: 100%;*/
    /*height: 160px;*/

    /*clear: both;*/
    /*position: relative;*/
    /*height: 200px;*/
    /*margin-top: auto;*/
    /*width: 100%; !* à titre d'exemple *!*/

    /*position: absolute;*/
    /*bottom: 0;*/
    /*width: 100%;*/
    /*!* Set the fixed height of the footer here *!*/
    /*height: 60px;*/
    /*background-color: #f5f5f5;*/
}

::placeholder {
    font: Arial;
    font-style: italic;
}

.help-block {
    color: red;
}

@font-face {
    font-family: "Sansation_Regular";
    src: url('../../static/font/Sansation_Regular.ttf');
}

@font-face {
    font-family: "Sansation_Italic";
    src: url('../../static/font/Sansation_Italic.ttf');
}

@font-face {
    font-family: "Sansation_Bold";
    src: url('../../static/font/Sansation_Bold.ttf');
}

@font-face {
    font-family: "Sansation_Bold_Italic";
    src: url('../../static/font/Sansation_Bold_Italic.ttf');
}

@font-face {
    font-family: "Sansation_Light";
    src: url('../../static/font/Sansation_Light.ttf');
}

@font-face {
    font-family: "Sansation_Light_Italic";
    src: url('../../static/font/Sansation_Light_Italic.ttf');
}


.image_full {
    display: block;
}

.image_mobile {
    display: none;
}

@media (max-width: 640px) and (min-width: 320px) {
    .image_full {
        display: none;
    }

    .image_mobile {
        display: block;
    }
}


h1 {
    font-size: 3em;
    font-family: Sansation_Bold;
}

h2 {
    font-size: 2em;
    font-family: Sansation_Regular;
}

h3 {
    font-size: 1em;
    font-family: Sansation_Regular;
}

h4 {
    color: #0080FF;
    font-Size: 18px;
    text-align: center;
}

h5 {
    font-size: 1em;
    font-family: Sansation_Bold;
}


.nav-pills .nav-item .nav-link {
    background-color: #007bff;
    color: white;
}

.nav-pills .nav-item .nav-link:not(.active) {
    background-color: white;
    color: #007bff;
}


.btn-default:hover, .open > .dropdown-toggle.btn-default {
    color: #FFFFFF;
    background-color: #007bff;
    border-color: #0484fc;
}

.btn-default {
    color: #FFFFFF;
    background-color: #007bff;
    border-color: #FFFFFF;
}

.btn-info:hover, .open > .dropdown-toggle.btn-info {
    color: #007bff !important;
    background-color: #ffffff;
    border-color: #0484fc;
}

.btn-info {
    color: #007bff;
    background-color: #ffffff;
    border-color: #007bff;
}

.btn-info.active, .btn-info:active {
    background-color: #007bff !important;
    color: #ffffff !important;
}

.btn-deconnexion {
    border-color: #8C0001;
}

.btn-deconnexion:hover, .open > .dropdown-toggle.btn-default {
    color: #ffffff;
    background-color: #007bff;
    border-color: #0484fc;
}

.btn-light {
    border-color: #ffffff;
    background-color: #ffffff;
}

.btn-light:hover, .open > .dropdown-toggle.btn-default {
    color: #0484fc;
    background-color: #ffffff;
    border-color: #ffffff;
}


/*.table-wrapper-scroll-y {*/
/*    display: block;*/
/*    width: 100%;*/
/*    overflow-y: auto;*/
/*    -ms-overflow-style: -ms-autohiding-scrollbar;*/
/*}*/

/*.table-wrapper-scroll-x {*/
/*    display: block;*/
/*    width: 100%;*/
/*    overflow-x: auto;*/
/*    -ms-overflow-style: -ms-autohiding-scrollbar;*/
/*}*/

#mine {
    margin-top: 5px;
}

#end {
    margin-top: 5px;
}


th, td {
    padding: 0px;
    text-align: left;

}

#cadre {
    background-color: #FFFFFF;
    border: 1px solid #D1D1D1;
    padding: 5px 0px 5px 0px;
    min-height: 50%;
    height: auto;
    min-width: 98%;
    margin-left: 1%;
    margin-right: 1%;
    margin-bottom: 1%;
    margin-top: 1%;
    float: left;
    width: 50%;
    /*arrondir les coins en haut à gauche et en bas à droite*/
    -moz-border-radius: 10px;
    -webkit-border-radius: 10px;
    border-radius: 10px;

}

#cadre1 {
    background-color: #FFFFFF;
    border: 1px solid #D1D1D1;
    /*	margin-left:10px;
        margin-right:10px;
        margin-bottom:10px;
        margin-top:10px; */
    /*arrondir les coins en haut à gauche et en bas à droite */
    -moz-border-radius: 10px;
    -webkit-border-radius: 10px;
    border-radius: 10px;
}

#cadre2 {
    background-color: #FFFFFF;
    border: 1px solid #D1D1D1;
    /*	margin-left:10px;
        margin-right:10px;
        margin-bottom:10px;
        margin-top:10px; */
    /*arrondir les coins en haut à gauche et en bas à droite */
    -moz-border-radius: 10px;
    -webkit-border-radius: 10px;
    border-radius: 10px;
    /* permet aux tableau d'etre responsive*/
    display:grid !important;
    padding-right: 2% !important;
}

#cadre3 {
    background-color: #F2FBEF;
    border: 1px solid #0000FF;
    padding: 5px 0px 5px 0px;
    min-height: 300px;
    height: auto;
    min-width: 800px;
    width: 40%;
    margin-left: 10px;
    margin-right: 10px;
    margin-bottom: 10px;
    margin-top: 10px;
    float: left;
    width: 40%;
    /*arrondir les coins en haut à gauche et en bas à droite*/
    -moz-border-radius: 10px;
    -webkit-border-radius: 10px;
    border-radius: 10px;

}

#cadre4 {
    background-color: #F2FBEF;
    border: 1px solid #0000FF;
    padding: 5px 0px 5px 0px;
    min-height: 300px;
    height: auto;
    min-width: 300px;
    width: 40px;
    margin-left: 10px;
    margin-right: 10px;
    margin-bottom: 10px;
    margin-top: 10px;
    float: left;
    width: 100%;
    /*arrondir les coins en haut à gauche et en bas à droite*/
    -moz-border-radius: 10px;
    -webkit-border-radius: 10px;
    border-radius: 10px;

}

.center-div {
    margin: 0 auto;
    width: 100px;
}


.panel-default {
    background-color: #FFFFFF;
    border-color: #D1D1D1;
}


.panel-default > .panel-heading {
    color: #FFFFFF;
    font-Size: 18px;
    text-align: center;
    background-color: #FFFFFF;
    border-color: #D1D1D1;
}


.panel-default > .panel-body {
    background-color: #FFFFFF;
    border-color: #D1D1D1;
}

#tabs ul li {
    display: inline-block;
    float: left;
    height: 24px;
    /*min-width: 80px;*/
    text-align: center;
    line-height: 22px;
    padding: 0 8px 0 8px;
    margin: 1px 0px 0px 0px;
    border: 1px solid gray;
    border-top-left-radius: 6px;
    border-top-right-radius: 6px;
    background: #F0F0F0;
}


table.dataTable thead > tr > td.sorting,
table.dataTable thead > tr > td.sorting_asc,
table.dataTable thead > tr > td.sorting_desc,
table.dataTable thead > tr > th.sorting,
table.dataTable thead > tr > th.sorting_asc,
table.dataTable thead > tr > th.sorting_desc {
    padding-right: 30px
}

table.dataTable thead .sorting,
table.dataTable thead .sorting_asc,
table.dataTable thead .sorting_asc_disabled,
table.dataTable thead .sorting_desc,
table.dataTable thead .sorting_desc_disabled {
    cursor: pointer;
    position: relative
}

table.dataTable thead .sorting:after,
table.dataTable thead .sorting:before,
table.dataTable thead .sorting_asc:after,
table.dataTable thead .sorting_asc:before,
table.dataTable thead .sorting_asc_disabled:after,
table.dataTable thead .sorting_asc_disabled:before,
table.dataTable thead .sorting_desc:after,
table.dataTable thead .sorting_desc:before,
table.dataTable thead .sorting_desc_disabled:after,
table.dataTable thead .sorting_desc_disabled:before {
    position: absolute;
    bottom: .9em;
    display: block;
    opacity: .3
}

table.dataTable thead .sorting:before,
table.dataTable thead .sorting_asc:before,
table.dataTable thead .sorting_asc_disabled:before,
table.dataTable thead .sorting_desc:before,
table.dataTable thead .sorting_desc_disabled:before {
    right: 1em;
    content: "\f0de";
    font-family: FontAwesome;
    font-size: 1rem
}

table.dataTable thead .sorting:after,
table.dataTable thead .sorting_asc:after,
table.dataTable thead .sorting_asc_disabled:after,
table.dataTable thead .sorting_desc:after,
table.dataTable thead .sorting_desc_disabled:after {
    content: "\f0dd";
    font-family: FontAwesome;
    right: 16px;
    font-size: 1rem
}

table.dataTable thead .sorting_asc:before,
table.dataTable thead .sorting_desc:after {
    opacity: 1
}

table.dataTable thead .sorting_asc_disabled:before,
table.dataTable thead .sorting_desc_disabled:after {
    opacity: 0
}

@media (max-width: 700px) {

    .responsive-table-line td:before {
        content: attr(data-title);
    }

    .responsive-table-line table,
    .responsive-table-line thead,
    .responsive-table-line tbody,
    .responsive-table-line th,
    .responsive-table-line td,
    .responsive-table-line tr {
        display: block;
    }

    .responsive-table-line thead tr {
        display: none;
    }

    .responsive-table-line td {
        position: relative;
        border: 0px solid transparent;
        padding-left: 50% !important;
        white-space: normal;
        text-align: right;
    }

    .responsive-table-line td:before {
        position: absolute;
        top: 0px;
        left: 0px;
        width: 45%;
        padding-right: 15px;
        height: 100%;
        white-space: nowrap;
        text-overflow: ellipsis !important;
        overflow: hidden !important;
        text-align: left;
        padding: 2px;
    }
}

.lien {
    text-align: center;
    color: blue;
    text-decoration: underline;
}

.catcha {
    display: none;
}

.form-button {
    text-align: center;
}

#texte {
    text-align: center;
    margin-top: 20px;
    margin-bottom: 20px;
}

#login_verif {
    margin-bottom: 10px;
}

.post {
    text-align: center;
}

.step-wrapper > ul > .step-item {
    display: inline-block;
    opacity: 0.5;
    margin: 0 0 0 15%
}

.step {
    border-radius: 20px;
    border: 2px solid #1b94ce;
    width: 37px;
    height: 37px;
    text-align: center;
    margin: 0 auto;
    color: #1b94ce;
    line-height: 33px;
    float: left
}

.step-libelle h2 {
    margin: 3px 0 0 42px
}

.step-wrapper > ul > .step-item.step-current {
    opacity: 1
}

.big-title {
    background: #fafafa;
    border-top: 1px solid #eaeaea;
    margin-left: 20%;
    color: #1b94ce;
    font-family: "BrandonGrotesque-Medium";
    font-size: 2em;
}

.funkyradio.form-group {
    margin-left: 25%;
}


.funkyradio .texte {
    width: 140px;
    color: gray;
    font-weight: bold;

}

.funkyradio div {
    clear: both;
    overflow: hidden;
    display: inline-block;
    vertical-align: middle;
}

.funkyradio label {
    padding-right: 10px;
    border-radius: 3px;
    border: 1px solid #D1D3D4;
    font-weight: normal;
}

.funkyradio input[type="radio"]:empty,
.funkyradio input[type="checkbox"]:empty {
    visibility: hidden;
}

.funkyradio input[type="radio"]:empty ~ label,
.funkyradio input[type="checkbox"]:empty ~ label {
    position: relative;
    line-height: 2.5em;
    text-indent: 3.25em;
    cursor: pointer;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

.funkyradio input[type="radio"]:empty ~ label:before,
.funkyradio input[type="checkbox"]:empty ~ label:before {
    position: absolute;
    display: block;
    top: 0;
    bottom: 0;
    left: 0;
    content: '';
    width: 2.5em;
    background: #D1D3D4;
    border-radius: 3px 0 0 3px;
}

.funkyradio input[type="radio"]:hover:not(:checked) ~ label,
.funkyradio input[type="checkbox"]:hover:not(:checked) ~ label {
    color: #888;
}

.funkyradio input[type="radio"]:hover:not(:checked) ~ label:before,
.funkyradio input[type="checkbox"]:hover:not(:checked) ~ label:before {
    content: '\2714';
    text-indent: .9em;
    color: #C2C2C2;
}

.funkyradio input[type="radio"]:checked ~ label,
.funkyradio input[type="checkbox"]:checked ~ label {
    color: #777;
}

.funkyradio input[type="radio"]:checked ~ label:before,
.funkyradio input[type="checkbox"]:checked ~ label:before {
    content: '\2714';
    text-indent: .9em;
    color: #333;
    background-color: #ccc;
}

.funkyradio input[type="radio"]:focus ~ label:before,
.funkyradio input[type="checkbox"]:focus ~ label:before {
    box-shadow: 0 0 0 3px #999;
}

.funkyradio-default input[type="radio"]:checked ~ label:before,
.funkyradio-default input[type="checkbox"]:checked ~ label:before {
    color: #333;
    background-color: #ccc;
}

.funkyradio-primary input[type="radio"]:checked ~ label:before,
.funkyradio-primary input[type="checkbox"]:checked ~ label:before {
    color: #fff;
    background-color: #337ab7;
}

.funkyradio-success input[type="radio"]:checked ~ label:before,
.funkyradio-success input[type="checkbox"]:checked ~ label:before {
    color: #fff;
    background-color: #BDC537;
}

.funkyradio-danger input[type="radio"]:checked ~ label:before,
.funkyradio-danger input[type="checkbox"]:checked ~ label:before {
    color: #fff;
    background-color: #d9534f;
}

.funkyradio-warning input[type="radio"]:checked ~ label:before,
.funkyradio-warning input[type="checkbox"]:checked ~ label:before {
    color: #fff;
    background-color: #f0ad4e;
}

.funkyradio-info input[type="radio"]:checked ~ label:before,
.funkyradio-info input[type="checkbox"]:checked ~ label:before {
    color: #fff;
    background-color: #5bc0de;
}

/* Chrome, Safari, Edge, Opera */
input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
}

/* Firefox */
input[type=number] {
    -moz-appearance: textfield;
}

.row {
    margin-right: 0;
}

.btn.btn-secondary:active,
.btn.btn-secondary.active {
    color: white !important;
    background-color: red !important;
    border-color: red !important;
}

.btn.btn-primary {
    background-color: #0080FF;
    color: white;
}