:root {
    --sbs-10: 10px;
    --sbs-20: 20px;
    --sbs-40: 40px;
    --sbs-60: 60px;
    --sbs-80: 80px;
    --sbs-100: 100px;
}

.stripe_wrapper.transparent {
    background: transparent;
}

/* Margin Top */
.sbs-mt-10 { margin-top: var(--sbs-10); }
.sbs-mt-20 { margin-top: var(--sbs-20); }
.sbs-mt-40 { margin-top: var(--sbs-40); }
.sbs-mt-60 { margin-top: var(--sbs-60); }
.sbs-mt-80 { margin-top: var(--sbs-80); }
.sbs-mt-100 { margin-top: var(--sbs-100); }

.sbs-height-10 { height: var(--sbs-10); width: 100%; }
.sbs-height-20 { height: var(--sbs-20); width: 100%; }
.sbs-height-40 { height: var(--sbs-40); width: 100%; }
.sbs-height-60 { height: var(--sbs-60); width: 100%; }
.sbs-height-80 { height: var(--sbs-80); width: 100%; }
.sbs-height-100 { height: var(--sbs-100); width: 100%; }

/* Margin Bottom */
.sbs-mb-10 { margin-bottom: var(--sbs-10); }
.sbs-mb-20 { margin-bottom: var(--sbs-20); }
.sbs-mb-40 { margin-bottom: var(--sbs-40); }
.sbs-mb-60 { margin-bottom: var(--sbs-60); }
.sbs-mb-80 { margin-bottom: var(--sbs-80); }
.sbs-mb-100 { margin-bottom: var(--sbs-100); }

/* Padding Top */
.sbs-pt-10 { padding-top: var(--sbs-10); }
.sbs-pt-20 { padding-top: var(--sbs-20); }
.sbs-pt-40 { padding-top: var(--sbs-40); }
.sbs-pt-60 { padding-top: var(--sbs-60); }
.sbs-pt-80 { padding-top: var(--sbs-80); }
.sbs-pt-100 { padding-top: var(--sbs-100); }

/* Padding Bottom */
.sbs-pb-10 { padding-bottom: var(--sbs-10); }
.sbs-pb-20 { padding-bottom: var(--sbs-20); }
.sbs-pb-40 { padding-bottom: var(--sbs-40); }
.sbs-pb-60 { padding-bottom: var(--sbs-60); }
.sbs-pb-80 { padding-bottom: var(--sbs-80); }
.sbs-pb-100 { padding-bottom: var(--sbs-100); }


.greenCoal_stripe {
    position: relative;
    top: 100px;
    z-index: 1;
}
.stripe_wrapper.light_bg.stripeAbsolute {
    width: 300px;
    position: absolute;
    top: 24px;
}
.stripe_wrapper.light_bg.stripeAbsolute .stripe_line.grey_orange {
    width: 75%;
}  
section.stripe_wrapper.light_b.h23 .stripe_line.grey_stripe {
    height: 23px;
}

@media screen and ( max-width: 1849.98px ) {

    .stripe_wrapper.light_bg.stripeAbsolute {
        width: 230px;
    }

}
@media screen and ( max-width: 1749.98px ) {

    .stripe_wrapper.light_bg.stripeAbsolute {
        width: 180px;
    }

}
 
@media screen and (max-width: 1199.98px) {

    .stripe_wrapper.light_bg.stripeAbsolute, .greenCoal_stripe {
        display: none;
    } 

}  

@media screen and (max-width: 767.98px) {

    :root {
        --sbs-10: 8px;
        --sbs-20: 15px;
        --sbs-40: 25px;
        --sbs-60: 40px;
        --sbs-80: 50px;
        --sbs-100: 70px;
    }
    
} 