/* CSS Document */

#range-dpe {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        /* -ms-flex-direction: column;
            flex-direction: column; */
}

.dpe2021 {
    position: relative;
}

.label-conso-energie {
    font-size: 10px;
    margin-bottom: 8px;
    font-weight: 500;
    color: #7e7e7e;
}

.dpe.item-link {
    display: block;
    cursor: pointer;
    margin-top: 15px;
}

.img-tool .right .DPE_original {
    width: 339px;
}

.img-tool .left .DPE_original {
    width: 377px;
}
.conso-energie {
    margin-bottom:20px;
}
.conso-energie, .emission-gaz {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    padding: 0px;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
width : 50%;
}

.emission-gaz-xxx {
    padding: 0 40px 0 0px;
}

.conso-range .letter {
    position: relative;
    height: 100px;
    display: inline-block;
}

.conso-range .conso-num, .conso-range .conso-emission-num {
    position: absolute;
    left: 0px;
    top: 60px;
    text-align: center;
    color: #696969;
    width: 34px;
}

.conso-emission-num .note-conso {
    position: absolute;
    left: -20px;
    bottom: -15px;
}

.conso-num .note-conso {
    position: absolute;
    left: -5px;
    bottom:-15px;
}


.conso-num, .conso-emission-num {
    font-family: 'Open Sans', sans-serif;
    font-size: 14px;
    font-weight: bold;
}

.note-conso {
    font-family: 'Open Sans', sans-serif;
    font-size: 11px;
    font-weight: 500;
}

.labels-link {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
}

.indiq-letter {
    padding: 3px 0px;
    color: #fff;
    position: relative;
    width: 20px;
    text-align: center;
    display: inline-block;
}

    .indiq-letter.active {
        padding: 8px 0px;
        width: 34px;
    }

        .indiq-letter.active::after {
            background: transparent;
            border-bottom: 17.2px solid transparent;
            border-top: 17.3px solid transparent;
            content: '';
            position: absolute;
            right: 0.55rem;
            top: 31.4px;
            -webkit-transform: rotate( 90deg );
                    transform: rotate( 90deg );
        }

.conso-A {
    background: #029163;
}

    .conso-A::after {
        border-left: 17px solid #029163;
    }

.conso-B {
    background: #46a64a;
}

    .conso-B::after {
        border-left: 17px solid #46a64a;
    }

.conso-C {
    background: #6db56b;
}

    .conso-C::after {
        border-left: 17px solid #6db56b;
    }

.conso-D {
    background: #f2e314;
}

    .conso-D::after {
        border-left: 17px solid #f2e314;
    }

.conso-E {
    background: #EDAB0F;
}

    .conso-E::after {
        border-left: 17px solid #edab0f;
    }

.conso-F {
    background: #E8782F;
}

    .conso-F::after {
        border-left: 17px solid#e8782f;
    }

.conso-G {
    background: #d1201e;
}

    .conso-G::after {
        border-left: 17px solid #d1201e;
    }



.emission-A {
    background: #abdbf9;
}

    .emission-A::after {
        border-left: 17px solid #abdbf9;
    }

.emission-B {
    background: #91b4d4;
}

    .emission-B::after {
        border-left: 17px solid #91b4d4;
    }

.emission-C {
    background: #7a92b2;
}

    .emission-C::after {
        border-left: 17px solid #7a92b2;
    }

.emission-D {
    background: #626f90;
}

    .emission-D::after {
        border-left: 17px solid #626f90;
    }

.emission-E {
    background: #4e5272;
}

    .emission-E::after {
        border-left: 17px solid #4e5272;
    }

.emission-F {
    background: #393552;
}

    .emission-F::after {
        border-left: 17px solid #393552;
    }

.emission-G {
    background: #271b36;
}

 .emission-G::after {
        border-left: 17px solid #271b36;
    }

.emission::after {
    border-left: 17px solid #271b36;
}

@media (min-width: 768px) {

.label-conso-energie {
    font-size: 13px;
    margin-bottom: 8px;
    font-weight: 500;
    color: #7e7e7e;
}
}