body {
    background-color: black;
}

header {
    background-image: url("../images/base/dark_header.svg");
    background-size: cover;
}

header a:hover {
    color: #D87803;
}

.sous-menu:hover {
    background-color: #00234E;
}

.second-color {
    color: #E3A04E;
}

#menuMobile {
    background-color: #024597;
}

footer {
    background: url("../images/base/dark_footer.svg");
    background-size: cover;
}

a {
    color: white;
}

p {
    color: white;
}

h1, h2 {
    color: #D87803;
}

h3 {
    color: #D87803;
}

button {
    color: white;
    background-color: #D87803;
}

.intro {
    background-color: white;
}

.dialogue {
    background-color: #E3A04E;
}

.dialogue p {
    color: #00234E;
}

.dialogue strong {
    color:#024597;
}

@media screen and (min-width: 768px) {
    .presentation {
        background-image: url("../images/home/illu2.svg");
        background-size: 2800px 600px;
        background-position: bottom;
        background-repeat: no-repeat;
    }

    .offres {
        background-image: url("../images/home/illu12.svg");
        background-size: 2800px 550px;
        background-position: top;
        background-repeat: no-repeat;
    }
}

@media screen and (min-width: 2800px) {
    .offres, .presentation {
        background-size: 5600px 800px;
    }

    .presentation {
        height: 800px;
    }

    .offres {
        height: 1500px;
    }
}

.img-insta {
    content: url("../images/base/dark_instagram.png");
}

.img-linke {
    content: url("../images/base/dark_linkedin.png");
}

.img-ytb {
    content: url("../images/base/dark_ytb.png");
}

@media screen and (min-width: 768px) {
    h2.title-separator {
        background-color: #024597;
    }
}

@media screen and (min-width: 768px) {
    .banner-wow {
        background-image: url("../images/home/dark_wow.svg");
        background-size: 2800px 550px;
        background-position: center;
        background-repeat: no-repeat;
    }

    .banner-offre {
        background-image: url("../images/offres/vague-dark.png");
        background-size: contain;
        background-position: center;
        background-repeat: no-repeat;
    }
}

@media screen and (max-width: 768px) {
    .banner-wow {
        background-image: url("../images/home/mini-vague-dark.svg");
        background-size: cover;
        background-position: center;
    }
}

@media screen and (min-width: 2800px) {
    .banner-wow {
        background-size: 5600px 550px;
    }
}

@media screen and (min-width: 1024px) {
    .banner-offre {
        background-image: url("../images/offres/vague-dark.png");
        background-size: 1526px 800px;
        background-position: center;
        background-repeat: no-repeat;
    }
}

@media screen and (min-width: 1526px) {
    .banner-offre {
        background-image: url("../images/offres/vague-dark.png");
        background-size: 2000px 750px;
        background-position: center;
        background-repeat: no-repeat;
    }
}

@media screen and (min-width: 2000px) {
    .banner-offre {
        background-image: url("../images/offres/vague-dark.png");
        background-size: 2500px 750px;
        background-position: center;
        background-repeat: no-repeat;
    }
}

.banner-offre h3{
    color: #ffffff;
}

.cloud-offer p{
    color:#00234E;
}

.bandeau-radio {
    background-color: #024597;
}

.option label {
    color: #ffffff;
}

.devis-button {
    background-color: #D87803;
}

form {
    background-color: white;
    width: 100%;    
}

form input {
    background-color: #024597;
    border-radius: 50px;
    line-height: 40px;
    height: 40px;
}

@media screen and (min-width: 768px) {
    form {
        width: 95%;
    }
}

textarea {
    background-color: #024597;
    border-radius: 50px;
}

label {
    color: #00234E;
    font-weight: 700;
    font-size: 20px;
    padding-left: 2rem;
}

.check {
    border-color: #D87803 !important;
}

.check:checked {
    background: url("../images/home/dark-checked.png");
    background-size: contain;
}

.bubble {
    background-color: white;
}

.linear {
    background: #ffffff;
}

.offre-bouton {
    background-color: #00234E;
}

.form-login label {
    color: white;
}

#login_form_mail,
#login_form_password {
    color: #D87803;
}

.form-login input {
    border: 1px solid #D87803;
    color: #D87803;
    background-color: white;
}

strong {
    color: #D87803;
}

#mentionlegales {
    background-color: black;
}

#title-mention {
    color: #D87803;
}

.jobs p, 
.offres p,
.presentation p {
    color: #00234E;
}



.carrousel-logos {
    border-radius: 10px;
}

.carrousel-logos::-webkit-scrollbar {
    width: 12px;
}

.carrousel-logos::-webkit-scrollbar-track {
    -webkit-box-shadow: inset 0 0 6px #D87803; 
    border-radius: 10px;
}

.carrousel-logos::-webkit-scrollbar-thumb {
    border-radius: 10px;
    -webkit-box-shadow: inset 0 0 6px #D87803; 
}

.logo-kappalys {
    content: url("../images/dark-logo-kappalys.svg");
}

.job-content strong {
    color: #D87803;
}

.opinion strong {
    color: white;
}

.opinion {
    background-color: #D87803; 
}

.opinion p {
    color: white;
}

.opinion span {
    color: #024597;
}

h4.quote {
    color: #E3A04E;
}

.pastille-active {
    background-color: #E3A04E;
    color: white;
}

.pastille{
    background-color: white;
    color: #E3A04E;
}

.auth-error {
    color: white;
}

.title-securite {
    color: #024597;
}

.titre-secur h2 {
    color:#D87803;
}

.titre-secur h3 {
    color:#E3A04E;
}

.dash-img {
    content: url("../images/jobs/dash-gauche-dark.webp");
}

.dash-img-droite {
    content: url("../images/jobs/dash-droite-dark.webp");
}

#gif-asteroid {
    content: url("../images/gifs/dark-asteroid.gif");
}

#gif-meteor {
    content: url("../images/gifs/dark-meteor.gif");
}

.job-titles h1 {
    color: #D87803;
}

.job-titles h3 {
    color: #E3A04E;
}

/* Fade IN image job */
.img-job {
    animation: appear 3s ease;
    animation-fill-mode: forwards;
}

@keyframes appear {
    0% {
        opacity: 0;
    }

    100% {
        opacity: 1;
    }
}

.bg-societe {
    background-color: black;
}

.container-iso {
    background-color: #E3A04E;
}