.overlay-dark.overlay-dark-result:after {
    background-color: #000000 !important;
}



.result h2 {
    text-transform: uppercase;
    /* font-size: 1.8rem; */
    /* text-align: left !important; */
}

/* .d-result {
    padding-top: 50px;
    padding-bottom: 50px;
} */


.et-aussi {
    font-size: .8em;
}





/* Quartiers */

.explication-4-quartiers {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
}

.explication-4-quartiers .quartier {
    width: 100%;
    margin-bottom: 2em;
    /* text-align: justify; */
}

@media only screen and (min-width: 768px) {

    .explication-4-quartiers .quartier {
        width: 50%;
    }

    .explication-4-quartiers .quartier-gauche {
        padding-right: 1em;
    }

    .explication-4-quartiers .quartier-droite {
        padding-left: 1em;
    }

    .explication-4-quartiers .quartier-d {
        padding-right: 1em;
        order: 1;
    }
    
    .explication-4-quartiers .quartier-i {
        padding-left: 1em;
        order: 2;
    }
    
    .explication-4-quartiers .quartier-s {
        padding-left: 1em;
        order: 4;
    }
    
    .explication-4-quartiers .quartier-c {
        padding-right: 1em;
        order: 3;
    }
}






.quartier .bg-d,
.quartier .bg-c {
    color: #ffffff;
}

.quartier .bg-d,
.quartier .bg-i,
.quartier .bg-s,
.quartier .bg-c {
    font-weight: bold;
    padding-left: .25em;
    padding-right: .25em;
}





/* 8 quartiers */
.explication-8-quartiers {
    display: flex;
    flex-wrap: wrap;

}

.explication-8-quartiers .quartier {
    width: 33.33%;
    margin-bottom: 2em;
    text-align: justify;
}

.explication-8-quartiers .quartier-dd {
    padding-right: 1em;
    order: 1;
}

.explication-8-quartiers .quartier-di {
    padding-left: 1em;
    padding-right: 1em;
    order: 2;
}

.explication-8-quartiers .quartier-ii {
    padding-left: 1em;
    order: 3;
}

.explication-8-quartiers .quartier-cd {
    padding-right: 1em;
    order: 4;
}

.explication-8-quartiers .quartier-is {
    padding-left: 1em;
    order: 6;
}

.explication-8-quartiers .quartier-cc {
    padding-right: 1em;
    order: 7;
}

.explication-8-quartiers .quartier-sc {
    padding-left: 1em;
    padding-right: 1em;
    order: 8;
}

.explication-8-quartiers .quartier-ss {
    padding-left: 1em;
    order: 9;
}

.explication-8-quartiers .quartier-img {
    padding-left: 1em;
    padding-right: 1em;
    order: 5;
}



.quartier .bg-dd,
.quartier .bg-di,
.quartier .bg-ii,
.quartier .bg-is,
.quartier .bg-ss,
.quartier .bg-sc,
.quartier .bg-cc,
.quartier .bg-cd {
    font-weight: bold;
    padding-left: .25em;
    padding-right: .25em;
}

.quartier .bg-dd,
.quartier .bg-cd,
.quartier .bg-cc,
.quartier .bg-sc {
    color: #ffffff;
}



td.disc-component {
    text-align: center;
    width: 75px;
}

td.disc-value {
    text-align: center;
}

td.disc-value .percent {
    font-size: .8em;
}

tr.lined {
    border-bottom: 1px solid #cccccc;
}


.distance {
    font-size: 36px;
    display: inline-block;
    width: 70px;
    height: 70px;
    text-align: center;
    vertical-align: middle;
    /* padding-top: 5px; */
    border-radius: 50%;
    line-height: 70px;
}

.chrono-icon {
    font-size: 48px;
    color: white;
    background: #474646;
    display: inline-block;
    width: 100px;
    height: 1°0px;
    text-align: center;
    vertical-align: middle;
    /* padding-top: 5px; */
    border-radius: 50%;
    line-height: 100px;
}




.result-pro .box-content {
    text-align: left;
}

.box-content.et-aussi {
    font-size: .8em;
}






table.emo {
    border-spacing: 5px;
    border-collapse: separate;
}

table.emo th {
    padding: 5px;
    text-align: center;
    border: 1px solid black;
}

table.emo td {
    padding: 5px;
    text-align: center;
    border: 1px dashed grey;
    color: grey;
}

.emo-col-d,
.emo-col-i,
.emo-col-s,
.emo-col-c {
    width: 150px;
}

.emo-col-d.desagreable,
.emo-col-i.desagreable,
.emo-col-s.desagreable,
.emo-col-c.desagreable {
    font-size: 0.9em;
}

.emo-col-d.actif,
.emo-col-i.actif,
.emo-col-s.actif,
.emo-col-c.actif {
    border: 1px solid black;
    color: black;
}

.emo-col-d.agreable.actif,
.emo-col-i.agreable.actif,
.emo-col-s.agreable.actif,
.emo-col-c.agreable.actif {
    font-weight: bold;
}



.emo-col-d.actif {
    background-color: #ff4136;
}

.emo-col-i.actif {
    background-color: #ffdc00;
}

.emo-col-s.actif {
    background-color: #2ecc40;
}

.emo-col-c.actif {
    background-color: #0074d9;
}

table.emo .noborder {
    border: none;
    line-height: 5px;
}


/* table.emo .agreable-title {
    font-size: 0.8em; 
    font-style: italic;
    border: none;
    border-bottom: 1px dashed grey;
} */

.motivation-title {
    font-weight: bold;
    background-color: #474646;
    color: white;
    /* text-align: center; */
    padding-left: .5em;
    padding-right: .5em;
}