@charset "UTF-8";
@import url(https://fonts.googleapis.com/css2?family=Anton&family=Handlee&family=Open+Sans&family=Poppins&display=swap);

button,
hr,
input {
    overflow: visible;
}

progress,
sub,
sup {
    vertical-align: baseline;
}

[type="checkbox"],
[type="radio"],
legend {
    box-sizing: border-box;
    padding: 0;
}

hr,
sub,
sup {
    position: relative;
}

.arrondi:hover,
.lettrine:hover {
    transition: border 0.2s, background 0.3s 0.2s;
}

.button:hover,
.element-item .date {
    text-shadow: 0 1px rgba(255, 255, 255, 0.5);
}

.listnum li,
.rint {
    list-style-type: none;
}

.bout:hover,
.buttonDownload,
.buttonavis,
.push_button,
a,
a#cRetour {
    text-decoration: none;
}

#listbleu td.listebleu,
#listbleu tr,
#listjaune td.listejaune,
#listjaune tr,
#listorange tr,
#listrouge td.listerouge,
#listrouge tr,
.arrondi {
    vertical-align: middle;
}

.moving-text,
h1 {
    letter-spacing: 2px;
    text-transform: uppercase;
}

html {
    line-height: 1.15;
    -webkit-text-size-adjust: 100%;
    box-sizing: border-box;
    -webkit-tap-highlight-color: transparent;
}

h1 {
    font-size: 2em;
    margin: 0.67em 0;
    color: #d2b04b;
    font-weight: 700;
    text-shadow: #000 0 -1px;
}

b,
mark,
strong {
    font-weight: bolder;
}

.element-item .date,
button,
select {
    text-transform: none;
}

hr {
    box-sizing: content-box;
}

code,
kbd,
pre,
samp {
    font-family: monospace, monospace;
    font-size: 1em;
}

small,
sub,
sup {
    font-size: 75%;
}

abbr[title] {
    border-bottom: none;
    text-decoration: underline;
    text-decoration: underline dotted;
}

sub,
sup {
    line-height: 0;
}

sub {
    bottom: -0.25em;
}

img {
    border-style: none;
}

button,
input,
optgroup,
select,
textarea {
    font-family: inherit;
    font-size: 100%;
    line-height: 1.15;
    margin: 0;
}

[type="button"],
[type="reset"],
[type="submit"],
button {
    -webkit-appearance: button;
}

[type="button"]::-moz-focus-inner,
[type="reset"]::-moz-focus-inner,
[type="submit"]::-moz-focus-inner,
button::-moz-focus-inner {
    border-style: none;
    padding: 0;
}

[type="button"]:-moz-focusring,
[type="reset"]:-moz-focusring,
[type="submit"]:-moz-focusring,
button:-moz-focusring {
    outline: ButtonText dotted 1px;
}

fieldset {
    padding: 0.35em 0.75em 0.625em;
}

legend {
    color: inherit;
    display: table;
    max-width: 100%;
    white-space: normal;
}

textarea {
    overflow: auto;
}

[type="number"]::-webkit-inner-spin-button,
[type="number"]::-webkit-outer-spin-button {
    height: auto;
}

[type="search"] {
    -webkit-appearance: textfield;
    outline-offset: -2px;
}

[type="search"]::-webkit-search-decoration {
    -webkit-appearance: none;
}

::-webkit-file-upload-button {
    -webkit-appearance: button;
    font: inherit;
}

.alamain,
.typewriter,
body {
    font-family: "Open Sans", sans-serif;
}

details {
    display: block;
}

summary {
    display: list-item;
}

[hidden],
template {
    display: none;
}

*,
:root {
    --input-padding-x: 0.75rem;
    --input-padding-y: 0.75rem;
}

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

[tabindex="-1"]:focus {
    outline: 0 !important;
}

a {
    color: #112f4a;
}

a:active,
a:focus,
a:hover {
    color: #f26d3c;
    text-decoration: underline;
}

.archaique1 {
    background: #48d1cc;
    background: linear-gradient(90deg, #5dbbc8 0, #8cc9a7 50%, #add18e 100%);
    box-shadow: 2px 2px 15px #ccc;
    border-left-style: solid;
    border-left-width: 15px;
    border-right-style: solid;
    border-right-width: 2px;
    border-color: #2c77bc;
}

.visually-hidden,
hr {
    border: 0;
    height: 1px;
}

hr {
    width: 10%;
    margin: 30px auto;
}

hr.center-ball,
hr.center-diamond {
    background: #343a40;
}

hr.center-ball:before {
    content: "";
    width: 6px;
    height: 6px;
    background: #343a40;
    display: inline-block;
    border: 2px solid #343a40;
    position: absolute;
    top: -4px;
    left: 50%;
    margin: 0 0 0 -3px;
}

hr.center-diamond:before,
hr.center-square:before {
    content: "";
    width: 6px;
    height: 6px;
    top: -5px;
    left: 50%;
    margin: 0 0 0 -3px;
    display: inline-block;
    position: absolute;
}

hr.center-diamond:before {
    background: #343a40;
    border: 2px solid #343a40;
    transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    -webkit-transform: rotate(45deg);
}

hr.center-square,
hr.center-star {
    background: #39d1b4;
}

hr.center-square:before {
    background: #39d1b4;
    border: 2px solid #39d1b4;
}

hr.center-star:before {
    content: "★";
    color: #39d1b4;
    display: inline-block;
    position: absolute;
    top: 0;
    left: 50%;
    margin: 0 0 0 -3px;
    font-size: 15px;
    line-height: 0;
    text-shadow: 0 0 3px #d9d9d9;
}

.orange {
    color: #f26d3c;
}

.bleu {
    color: #2c77bc;
}

.vert,
body {
    color: #01534d;
}

.dore {
    color: #d2b04b;
}

mark {
    background-color: #ff0;
    color: #000;
}

body {
    scroll-behavior: smooth;
    overflow-x: hidden;
    margin: 0;
    background: linear-gradient(120deg, rgba(242, 184, 113, 0.2) 0, #ccc 100%);
    font-style: normal;
    font-size: 1rem;
    font-weight: 400;
    line-height: 1.5;
}

h1,
h2,
h3,
h4 {
    font-family: Anton, sans-serif;
}

@media screen and (max-width: 64em) {
    h1 {
        font-size: 2.5em;
    }
}

@media screen and (max-width: 50em) {
    h1 {
        font-size: 2em;
    }
}

@media screen and (max-width: 30em) {
    h1 {
        font-size: 1.5em;
    }
}

sup {
    top: -0.5em;
    font-size: smaller;
}

.zoom125 {
    font: 1.5em Anton, serif;
}

.clearfix::after {
    clear: both;
    content: "";
    display: table;
}

.container {
    max-width: 1180px;
    margin-left: auto;
    margin-right: auto;
    padding-left: 20px;
    padding-right: 20px;
    width: 100%;
}

.hide-text {
    overflow: hidden;
    padding: 0;
    text-indent: 101%;
    white-space: nowrap;
}

.visually-hidden {
    clip: rect(0 0 0 0);
    margin: -1px;
    overflow: hidden;
    padding: 0;
    position: absolute;
    width: 1px;
}

footer {
    background: rgb(85, 138, 55);
    background: linear-gradient(90deg, rgba(85, 138, 55, 0.7973564425770308) 0%, rgba(220, 220, 220, 1) 6%, rgba(255, 255, 255, 1) 94%, rgba(85, 138, 55, 1) 100%);
}

.modal-footer {
    background: rgb(1, 0, 14);
    background: radial-gradient(circle, rgba(1, 0, 14, 0.8463760504201681) 0%, rgba(0, 212, 255, 1) 50%, rgba(1, 0, 14, 1) 100%);
    color: #112f4a;
    font-weight: bolder;
    border-top: 4px double #112f4a;
}

.grid {
    border: 1px solid #333;
    background: linear-gradient(90deg, rgba(77, 95, 10, 0.4) 70%, rgba(174, 126, 62, 0.2) 100%);
}

.listnum li:before,
.modal-header {
    background: rgb(1, 0, 14);
    background: radial-gradient(circle, rgba(1, 0, 14, 0.8463760504201681) 0%, rgba(0, 212, 255, 1) 50%, rgba(1, 0, 14, 1) 100%);
}

.button-group:after,
.grid:after {
    content: "";
    display: block;
    clear: both;
}

.element-item {
    position: relative;
    float: left;
}

.element-item .symbol {
    position: absolute;
    left: 10px;
    top: 0;
    font-size: 42px;
    font-weight: 700;
    color: #fff;
}

.element-item .number {
    position: absolute;
    right: 8px;
    top: 5px;
}

.element-item .weight {
    position: absolute;
    left: 10px;
    top: 76px;
    font-size: 12px;
}

.element-item > * {
    margin: 0;
    padding: 0;
}

.buttonavis,
.buttonavispopu {
    margin-right: 2px;
    box-shadow: 8px 8px 12px #aaa;
    tranform: skew(30deg);
    float: left;
}

.mini {
    font-size: 0.65em;
}

.element-item .date {
    letter-spacing: 0;
    padding-bottom: 5px;
    padding-left: 5px;
    font-size: 14px;
    font-weight: 400;
}

.modal-header {
    border-bottom: #f26d3c;
    color: #fff;
}

.modal-header h5 {
    text-shadow: 2px 2px 2px #f8f8f8;
}

.top-bar {
    background: #45c7bd;
    background: radial-gradient(circle, rgba(69, 199, 189, 0.7651435574229692) 0, #dcdce4 35%, rgba(216, 217, 190, 0.19091386554621848) 100%);
}

.top-bar p {
    color: #343a40;
    font-weight: bolder;
}

blockquote::after,
blockquote::before {
    font-family: Georgia, serif;
    font-size: 60px;
    color: #999;
}

#avispopu,
.avis {
    position: relative;
    top: 0.5em;
    left: 1em;
}

.buttonavis {
    background: #306eb3;
    background: linear-gradient(90deg, #306eb3 0, #30acb3 52%, #306eb3 100%);
    text-shadow: 2px 2px 1px #f07900;
    font-weight: 700;
    border: thin double #556b2f;
    border-radius: 30%;
    background-clip: border-box;
}

.buttonavis:hover {
    background: linear-gradient(180deg, #306eb3 0, #30acb3 52%, #306eb3 100%);
    color: inherit;
}

.buttonavispopu {
    background: linear-gradient(to bottom, #c9de96 0, #8ab66b 44%, #398235 100%);
    height: 40px;
    line-height: 40px;
    padding: 0 15px;
    font-weight: 700;
    border: thin double #556b2f;
    border-radius: 30%;
    background-clip: border-box;
}

.arrondi,
.push_button {
    padding: 5px;
    text-align: center;
}

.buttonavispopu:hover {
    background-image: linear-gradient(to top, #c9de96 0, #8ab66b 44%, #398235 100%);
    color: inherit;
    text-decoration: none;
}

.bas {
    background: radial-gradient(black 15%, transparent 16%), radial-gradient(black 15%, transparent 16%) 8px 8px, radial-gradient(rgba(255, 255, 255, 0.1) 15%, transparent 20%) 0 1px,
    radial-gradient(rgba(255, 255, 255, 0.1) 15%, transparent 20%) 8px 9px;
    background-color: #282828;
    background-size: 16px 16px;
}

.lettrine {
    float: left;
    display: inline-block;
    color: #f2b871;
    background: linear-gradient(90deg, #39d1b4, #2c77bc);
    border: 2px ridge rgba(46, 139, 87, 0.95);
    border-radius: 5px;
    padding-right: 5px;
    padding-left: 5px;
    margin-right: 15px;
    margin-bottom: -5px;
    box-shadow: 7px 7px 25px 0 rgba(78, 96, 10, 0.5);
    text-shadow: 1px 1px 1px rgba(207, 181, 101, 0.7), 1px 2px 1px rgba(207, 181, 101, 0.6), 1px 3px 1px, 1px 4px 1px rgba(207, 181, 101, 0.5), 0 1px 1px rgba(68, 68, 68, 0.3), 0 4px 2px rgba(68, 68, 68, 0.2), 0 8px 3px rgba(68, 68, 68, 0.2),
    0 12px 4px rgba(68, 68, 68, 0.2), 0 16px 5px rgba(68, 68, 68, 0.1);
}

.push_button,
blockquote {
    display: block;
    position: relative;
}

.lettrine:hover {
    background: linear-gradient(90deg, #2c77bc, #39d1b4);
    border: 2px ridge rgba(146, 187, 113, 0.95);
}

blockquote {
    background: linear-gradient(120deg, rgba(242, 184, 113, 0.2) 0, #ccc 100%);
    padding: 15px 20px 15px 45px;
    margin: 0 0 20px;
    font-family: Handlee, cursive;
    font-size: 14px;
    line-height: 1.2;
    color: #01534d;
    -moz-box-shadow: 2px 2px 15px #ccc;
    -webkit-box-shadow: 2px 2px 15px #ccc;
    box-shadow: 2px 2px 15px #ccc;
    border-left-style: solid;
    border-left-width: 15px;
    border-right-style: solid;
    border-right-width: 2px;
    border-color: #2c77bc;
}

blockquote::before {
    content: "\201C";
    font-weight: 700;
    position: absolute;
    left: 10px;
    top: 5px;
}

blockquote::after {
    content: "\201D";
    font-weight: 700;
    float: right;
}

blockquote em {
    font-style: italic;
}

blockquote.default {
    border-left-color: #656d77;
    border-right-color: #434a53;
}

.arrondi {
    position: relative;
    border: 2px solid #4e600a;
    border-radius: 10px;
    box-shadow: 3px 2px 4px #4e600a;
    background: linear-gradient(90deg, #306eb3 0, #30acb3 52%, #306eb3 100%);
    margin: auto;
    font-family: "Titan One", cursive;
    color: #343a40;
}

.arrondi:hover {
    background: linear-gradient(180deg, #306eb3 0, #30acb3 52%, #306eb3 100%);
    border: 2px inset #4e600a;
}

.push_button {
    font-family: "Gochi Hand", cursive;
    color: #112f4a;
    margin: 0 auto;
    border-radius: 15px;
    border: 1px solid #676672;
    background: #f18700;
    -webkit-transition: 0.1s;
    -moz-transition: 0.1s;
    transition: 0.1s;
    -webkit-box-shadow: 0 9px 0 #3270b3;
    -moz-box-shadow: 0 9px 0 #3270b3;
    box-shadow: 0 9px 0 #3270b3;
}

.push_button:active {
    -webkit-box-shadow: 0 2px 0 #3270b3;
    -moz-box-shadow: 0 2px 0 #3270b3;
    box-shadow: 0 2px 0 #3270b3;
    position: relative;
    color: #fff;
    top: 7px;
}

.button {
    display: inline-block;
    padding: 5px 13px;
    margin-bottom: 10px;
    background: #eee;
    border: none;
    border-radius: 7px;
    background-image: linear-gradient(to bottom, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.2));
    color: #222;
    font-family: sans-serif;
    font-size: 12px;
    text-shadow: 0 1px #fff;
    cursor: pointer;
}

.button:hover {
    background-color: #8cf;
    color: #222;
}

.button.is-checked,
.button:active {
    background-color: #556b2f;
}

.bout,
.bout:hover {
    background: #33bb0c;
}

.button.is-checked {
    color: #fff;
    text-shadow: 0 -1px rgba(0, 0, 0, 0.8);
}

.button:active {
    box-shadow: inset 0 1px 10px rgba(0, 0, 0, 0.8);
}

.button-group .button {
    border-radius: 0;
    margin-left: 0;
    margin-right: 1px;
}

.button-group .button:first-child {
    border-radius: 0.5em 0 0 0.5em;
}

.button-group .button:last-child {
    border-radius: 0 0.5em 0.5em 0;
}

.bout {
    -webkit-appearance: none;
    -webkit-box-shadow: 2px 2px 5px 2px #000;
    border: 0;
    outline: 0;
    position: relative;
    background: linear-gradient(90deg, #33bb0c 0, rgba(80, 212, 104, 0.5578606442577031) 25%, #79d2ac 50%, #50d468 75%, #33bb0c 100%);
    box-shadow: 2px 2px 5px 2px #000;
    padding: 5px;
    color: #fff;
    border-radius: 25px;
    font-family: Raleway, sans-serif;
    font-size: 13px;
    font-weight: bolder;
    transition: 0.3s;
}

.buttonDownload,
.defileParent {
    border-radius: 25px;
    position: relative;
}

.bout:hover {
    background: linear-gradient(90deg, #79d2ac 0, rgba(80, 212, 104, 0.5578606442577031) 25%, #33bb0c 50%, #33bb0c 75%, #50d468 100%);
    animation: 3s linear infinite bruh;
    color: #0b1284;
}

@keyframes bruh {
    0%,
    100% {
        background-position: 0 0;
    }
    50% {
        background-position: 100% 0;
    }
}

.blink_me {
    color: #003b46;
    font-family: "Archivo Black", sans-serif;
    text-shadow: 1px 1px 2px #000;
    animation-name: blinker;
    animation-duration: 4s;
    animation-timing-function: linear;
    animation-iteration-count: infinite;
    text-align: center;
}

@keyframes blinker {
    0% {
        opacity: 1;
        color: #dcdcdc;
    }
    50% {
        opacity: 0.4;
        color: #fffaf0;
    }
    100% {
        opacity: 1;
        color: #fff;
    }
}

[data-title] {
    color: #fff;
    font-size: 1.5em;
}

@media (max-width: 767px) {
    .carousel-inner .carousel-item > div {
        display: none;
    }

    .carousel-inner .carousel-item > div:first-child {
        display: block;
    }
}

.carousel-inner .carousel-item-next,
.carousel-inner .carousel-item-prev,
.carousel-inner .carousel-item.active {
    display: flex;
}

@media (min-width: 768px) {
    .carousel-inner .carousel-item-end.active,
    .carousel-inner .carousel-item-next {
        transform: translateX(25%);
    }

    .carousel-inner .carousel-item-prev,
    .carousel-inner .carousel-item-start.active {
        transform: translateX(-25%);
    }
}

.carousel-inner .carousel-item-end,
.carousel-inner .carousel-item-start {
    transform: translateX(0);
}

.carousel-animation .carousel-item {
    transform: none;
}

.carousel-animation .carousel-item-left {
    animation-name: animationInRightName;
    animation-duration: 0.65s;
}

.carousel-animation .carousel-item-left.active {
    transform: translate(0, 0);
    animation-name: animationOutLeftName;
}

.carousel-animation .carousel-item-right {
    animation-name: animationInLeftName;
    animation-duration: 0.65s;
}

.carousel-animation .carousel-item-right.active {
    transform: translate(0, 0);
    animation-name: animationOutRightName;
}

.carousel-item.active h3 {
    animation: 1s forwards animate-carousel-title;
}

@keyframes animate-carousel-title {
    0% {
        transform: translate(0, -2em);
        opacity: 0;
    }
    100% {
        transform: translate(0, 0);
        opacity: 1;
    }
}

.defileParent {
    background-color: rgba(255, 255, 255, 0.2);
    display: block;
    margin: -5px auto;
    overflow: hidden;
    table-layout: fixed;
    width: 95%;
}

.defile {
    display: block;
    cursor: pointer;
    -webkit-animation: 25s linear infinite marqueelike;
    -moz-animation: 25s linear infinite marqueelike;
    -o-animation: 25s linear infinite marqueelike;
    -ms-animation: linear marqueelike 25s infinite;
    animation: 25s linear infinite marqueelike;
    margin-left: -100%;
    font-size: 0.9em;
    font-weight: 700;
    font-family: "Gochi Hand", cursive;
    color: #f26d3c;
    text-shadow: 2px 2px 7px rgba(25, 64, 16, 0.84);
    text-align: center;
    height: 25px;
}

.defile:hover,
.moving-text:hover {
    animation-play-state: paused;
}

.defile::after {
    content: attr(data-text);
    position: absolute;
    white-space: nowrap;
    padding-left: 10px;
}

@-webkit-keyframes marqueelike {
    0%,
    100% {
        margin-left: 0;
    }
    99.99% {
        margin-left: -100%;
    }
}

@-moz-keyframes marqueelike {
    0%,
    100% {
        margin-left: 0;
    }
    99.99% {
        margin-left: -100%;
    }
}

@-o-keyframes marqueelike {
    0%,
    100% {
        margin-left: 0;
    }
    99.99% {
        margin-left: -100%;
    }
}

@-ms-keyframes marqueelike {
    0%,
    100% {
        margin-left: 0;
    }
    99.99% {
        margin-left: -100%;
    }
}

@keyframes marqueelike {
    0%,
    100% {
        margin-left: 0;
    }
    99.99% {
        margin-left: -100%;
    }
}

@media only screen and (max-width: 860px) {
    .defileParent {
        display: block;
        margin: 3em auto;
        overflow: hidden;
        position: relative;
        table-layout: fixed;
        width: 100%;
    }

    .defile {
        display: block;
        -webkit-animation: 15s linear infinite marqueelike;
        -moz-animation: 15s linear infinite marqueelike;
        -o-animation: 15s linear infinite marqueelike;
        -ms-animation: linear marqueelike 15s infinite;
        animation: 15s linear infinite marqueelike;
        margin-left: -100%;
        padding: 0 5px;
        text-align: left;
        height: 25px;
    }
}

.buttonDownload {
    display: inline-block;
    padding: 10px 25px;
    background: linear-gradient(45deg, #d38312 10%, #a83279 90%);
    color: #fff;
    font-family: "Titan One", cursive;
    font-size: 0.9em;
    text-align: center;
    text-indent: 15px;
}

.buttonDownload:hover {
    color: #ff8c00;
}

.buttonDownload:after,
.buttonDownload:before {
    content: " ";
    display: block;
    position: absolute;
    left: 15px;
    top: 52%;
}

.buttonDownload:before {
    width: 10px;
    height: 2px;
    border-style: solid;
    border-width: 0 2px 2px;
}

.buttonDownload:after {
    width: 0;
    height: 0;
    margin-left: 1px;
    margin-top: -7px;
    border-style: solid;
    border-width: 4px 4px 0;
    border-color: transparent;
    border-top-color: inherit;
    animation: 2s linear infinite paused downloadArrow;
}

.buttonDownload:hover:before {
    border-color: #fff;
}

.buttonDownload:hover:after {
    border-top-color: #fff;
    animation-play-state: running;
}

@keyframes downloadArrow {
    0% {
        margin-top: -7px;
        opacity: 1;
    }
    0.001% {
        margin-top: -15px;
        opacity: 0;
    }
    50% {
        opacity: 1;
    }
    100% {
        margin-top: 0;
        opacity: 0;
    }
}

@media (min-width: 767px) {
    .navbar {
        background: #45c7bd;
        background: radial-gradient(circle, rgba(69, 199, 189, 0.7651435574229692) 0, #dcdce4 35%, rgba(216, 217, 190, 0.19091386554621848) 100%);
    }

    .nav-item .nav-link {
        text-shadow: 2px 2px 1px #f07900;
        font-weight: bolder;
        padding-inline: 10px;
    }

    .nav-item .nav-link:hover {
        background: #fff;
        background: linear-gradient(180deg, #fff 0, #30acb3 50%, #0b1284 100%);
    }

    .megamenu {
        background: repeating-linear-gradient(
                -45deg,
                transparent,
                transparent 1em,
                rgba(127, 215, 245, 0.4) 0,
                rgba(127, 215, 245, 0.1) 2em,
                transparent 0,
                transparent 1em,
                rgba(127, 215, 245, 0.3) 0,
                rgba(127, 215, 245, 0.2) 4em,
                transparent 0,
                transparent 1em,
                rgba(192, 235, 250, 0.6) 0,
                rgba(192, 235, 250, 0.2) 2em
        ),
        repeating-linear-gradient(
                45deg,
                transparent,
                transparent 1em,
                rgba(127, 215, 245, 0.4) 0,
                rgba(127, 215, 245, 0.1) 2em,
                transparent 0,
                transparent 1em,
                rgba(127, 215, 245, 0.3) 0,
                rgba(127, 215, 245, 0.2) 4em,
                transparent 0,
                transparent 1em,
                rgba(192, 235, 250, 0.4) 0,
                rgba(192, 235, 250, 0.1) 2em
        ),
        #fff;
        background-blend-mode: multiply;
    }
}

.listnum {
    padding: 20px;
    list-style-position: inside;
    display: block;
    width: 90%;
}

.backDoor,
.door {
    color: #112f4a;
    width: 200px;
    height: 300px;
    text-align: center;
}

.listnum ol {
    counter-reset: conseil;
}

.listnum li {
    counter-increment: conseil;
    margin-bottom: 10px;
    font-size: 1.75em;
}

.listnum li:before {
    content: counter(conseil);
    padding: 0 20px 6px;
    margin-right: 8px;
    vertical-align: top;
    -moz-border-radius: 60px;
    border-radius: 60px;
    border: 2px ridge #f26d3c;
    font-weight: 700;
    font-size: 0.8em;
    color: #fff;
}

.rint {
    margin-left: inherit;
}

.rint,
ol {
    counter-reset: chapter;
}

.rint h2,
ol {
    counter-reset: subchapter;
}

.rint h2::before,
ol {
    counter-increment: chapter;
    content: "Article " counter(chapter) ". ";
}

.rint h6::before,
ol {
    counter-increment: subchapter;
    content: counter(chapter) "." counter(subchapter) " ";
}

.backDoor {
    background-color: #f2b871;
    position: relative;
    margin: 50px auto 0;
}

.door {
    background-color: #f26d3c;
    border: 2px inset #0b1284;
    position: absolute;
    top: 0;
    left: 0;
    transform-origin: left;
    transition: 0.5s ease-in-out;
}

.doorOpen {
    transform: perspective(1200px) translateZ(0) translateX(0) translateY(0) rotateY(-105deg);
}

a#cRetour {
    border-radius: 6px;
    padding: 20px;
    font-size: 30px;
    text-align: center;
    color: #98fb98;
    background: rgba(116, 128, 67, 0.5);
    position: fixed;
    right: 40px;
    opacity: 1;
    z-index: 99999;
    transition: 0.2s ease-in;
    backface-visibility: hidden;
    -webkit-backface-visibility: hidden;
}

a#cRetour:before {
    content: "\25b2";
}

a#cRetour:hover {
    background: rgba(143, 188, 143, 0.7);
    transition: 0.2s ease-in;
}

#listorange td.listeorange,
#listorange thead tr {
    background-color: rgba(255, 109, 0, 0.7);
}

a#cRetour.cInvisible {
    bottom: -35px;
    opacity: 0;
    transition: 0.5s ease-in;
}

a#cRetour.cVisible {
    bottom: 20px;
    opacity: 1;
}

.rotate {
    transition: transform 0.7s ease-in-out;
}

.rotate:hover {
    transform: rotate(360deg);
}

.formfield-checkbox,
.formfield-radio,
.formfield-select,
.formfield-text,
.formfield-texteara {
    position: relative;
}

.formfield-select--container {
    position: relative;
    overflow: hidden;
    background-color: #fff;
    border: 1px solid #777;
    margin: 0 0 1.5em;
}

.formfield-select--container::after {
    content: "";
    position: absolute;
    top: 50%;
    margin-top: -3px;
    right: 0.75em;
    display: block;
    width: 0;
    height: 0;
    border-color: #444 transparent transparent;
    border-width: 6px;
    border-style: solid;
    pointer-events: none;
}

.formfield-select--container select {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    width: 110%;
    height: auto;
    border: 0;
    margin: 0;
    padding: 0.75em;
    border-radius: 0;
    overflow: hidden;
    text-overflow: ellipsis;
}

#listbleu thead tr,
#listjaune thead tr,
#listorange thead tr,
#listrouge thead tr {
    border: 3px double #c13e2e;
    font-size: 11px;
    font-weight: bolder;
    text-align: center;
}

.formfield-select--container select::-ms-expand {
    display: none;
}

table {
    font-family: Roboto, sans-serif;
}

#listorange td.listeorange {
    vertical-align: middle;
    color: #000;
}

#listorange tr {
    background-color: rgba(255, 109, 0, 0.35);
}

#listjaune thead tr {
    background-color: rgba(255, 215, 0, 0.7);
}

#listjaune td.listejaune {
    background-color: rgba(255, 215, 0, 0.7);
    color: #000;
}

#listjaune tr {
    background-color: rgba(255, 215, 0, 0.35);
}

#listrouge thead tr {
    background: rgba(255, 0, 0, 0.7);
    color: #f8f8f8;
}

#listrouge td.listerouge {
    background-color: rgba(255, 0, 0, 0.7);
    color: #f8f8f8;
}

#listrouge tr {
    background-color: rgba(255, 0, 0, 0.35);
}

#listbleu thead tr {
    background: rgba(0, 0, 255, 0.7);
    color: #f8f8f8;
}

#listbleu td.listebleu {
    background-color: rgba(0, 0, 255, 0.7);
    color: #f8f8f8;
}

#listbleu tr {
    background-color: rgba(0, 0, 255, 0.35);
}

.tooltip {
    position: absolute;
    z-index: 1020;
    display: block;
    visibility: visible;
    padding: 5px;
    font-size: 13px;
    opacity: 0;
}

.tooltip.in {
    opacity: 0.8;
}

.tooltip-inner {
    padding: 3px 8px;
    color: #314a5b;
    text-align: center;
    font-weight: 900;
    background: -webkit-gradient(linear, left top, left 25, from(#fff), color-stop(4%, #a2bbcc), to(#fff));
    background: -moz-linear-gradient(top, #fff, #a2bbcc 1px, #fff 25px);
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 15px;
    border: 1px solid #314a5b;
}

.tooltip-arrow {
    position: absolute;
    width: 0;
    height: 0;
}

.borderanime {
    position: relative;
    display: grid;
    place-items: center;
    overflow: hidden;
    border-radius: 10px;
}

.borderanime::before {
    content: "";
    position: absolute;
    animation: 5s linear infinite animate;
}

.borderanime::after {
    content: "";
    position: absolute;
    inset: 5px;
    border-radius: 5px;
}

@keyframes animate {
    0% {
        transform: rotate(0);
    }
    100% {
        transform: rotate(360deg);
    }
}

.card-text {
    font-size: 12px;
}

.card-title {
    color: #556b2f;
    font-size: 18px;
    font-weight: bolder;
}

.fondreflexe,
.fondsmassage {
    background: linear-gradient(to bottom, rgba(255, 255, 0, 0.5), rgba(0, 0, 255, 0.5));
    background-position: center;
}

.fondsoin {
    background: linear-gradient(to bottom, rgba(255, 255, 0, 0.5), rgba(0, 0, 255, 0.5));
}

.borderanime:hover {
    box-shadow: 0 5px 35px 0 rgba(0, 0, 0, 0.1);
}

.borderanime:hover::before,
div:hover::after {
    display: block;
    content: "";
    position: absolute;
    background: #fda8cf;
    border-radius: 75px;
    z-index: -1;
    animation: 1s infinite clockwise;
}

.borderanime:hover:after {
    background: #f3ce5e;
    animation: 2s infinite counterclockwise;
}

@keyframes clockwise {
    0%,
    100% {
        top: -5px;
        left: 0;
    }
    12% {
        top: -2px;
        left: 2px;
    }
    25% {
        top: 0;
        left: 5px;
    }
    37% {
        top: 2px;
        left: 2px;
    }
    50% {
        top: 5px;
        left: 0;
    }
    62% {
        top: 2px;
        left: -2px;
    }
    75% {
        top: 0;
        left: -5px;
    }
    87% {
        top: -2px;
        left: -2px;
    }
}

@keyframes counterclockwise {
    0%,
    100% {
        top: -5px;
        right: 0;
    }
    12% {
        top: -2px;
        right: 2px;
    }
    25% {
        top: 0;
        right: 5px;
    }
    37% {
        top: 2px;
        right: 2px;
    }
    50% {
        top: 5px;
        right: 0;
    }
    62% {
        top: 2px;
        right: -2px;
    }
    75% {
        top: 0;
        right: -5px;
    }
    87% {
        top: -2px;
        right: -2px;
    }
}

.moving-text {
    font-family: Anton, sans-serif;
    color: #d2b04b;
    font-weight: 700;
    text-shadow: #000 0 -1px;
    background: radial-gradient(ellipse at top, #fff, transparent), radial-gradient(ellipse at bottom, #4d9f0c, transparent);
}

.zoom110,
.zoom125 {
    font-weight: bolder;
    color: #0b1284;
    text-shadow: 1px 2px #288ce3, 2px 4px #288ce3, 3px 6px #288ce3, 4px 8px #288ce3, 5px 10px #288ce3, 6px 12px #288ce3, 7px 14px #288ce3, 8px 16px #288ce3, 9px 18px #288ce3, 10px 20px #288ce3;
}

@keyframes marquee {
    0% {
        transform: translateX(100%);
    }
    100% {
        transform: translateX(-100%);
    }
}

@media (prefers-reduced-motion: no-preference) {
    .moving-text {
        animation: 25s linear infinite marquee;
    }
}

.zoom125 {
    font-size: 125%;
}

.zoom110 {
    font-size: 110%;
}