/** TYPO **
------------------------------------------------------------
------------------------------------------------------------*/
a {
    color: #d23467;
}

a:hover {
    color: #5b5c5f;
    text-decoration: none !important;
}

/** TYPO COLOR **
------------------------------------------------------------
------------------------------------------------------------*/
.color--white,
.color--white p,
.color--white h1,
.color--white h2,
.color--white h3,
.color--white h4,
.color--white h5,
.color--white h6,
.color--white a {
    color: #ffffff;
}

.color--dark,
.color--dark p,
.color--dark h1,
.color--dark h2,
.color--dark h3,
.color--dark h4,
.color--dark h5,
.color--dark h6,
.color--dark a {
    color: #5b5c5f;
}

.color--bleu,
.color--bleu p,
.color--bleu h1,
.color--bleu h2,
.color--bleu h3,
.color--bleu h4,
.color--bleu h5,
.color--bleu h6,
.color--bleu a {
    color: #015ca7;
}

.color--turquoise,
.color--turquoise p,
.color--turquoise h1,
.color--turquoise h2,
.color--turquoise h3,
.color--turquoise h4,
.color--turquoise h5,
.color--turquoise h6,
.color--turquoise a {
    color: #00afec;
}

.color--rose,
.color--rose p,
.color--rose h1,
.color--rose h2,
.color--rose h3,
.color--rose h4,
.color--rose h5,
.color--rose h6,
.color--rose a {
    color: #d23467;
}

.color--gris-fonce,
.color--gris-fonce p,
.color--gris-fonce h1,
.color--gris-fonce h2,
.color--gris-fonce h3,
.color--gris-fonce h4,
.color--gris-fonce h5,
.color--gris-fonce h6,
.color--gris-fonce a {
    color: #58595c;
}

.color--gris-moyen,
.color--gris-moyen p,
.color--gris-moyen h1,
.color--gris-moyen h2,
.color--gris-moyen h3,
.color--gris-moyen h4,
.color--gris-moyen h5,
.color--gris-moyen h6,
.color--gris-moyen a {
    color: #ececec;
}

.color--gris-pale,
.color--gris-pale p,
.color--gris-pale h1,
.color--gris-pale h2,
.color--gris-pale h3,
.color--gris-pale h4,
.color--gris-pale h5,
.color--gris-pale h6,
.color--gris-pale a {
    color: #F0F0F0;
}



/** TYPO SIZE **
------------------------------------------------------------
------------------------------------------------------------*/
h1,
.h1, .hache1 {
}
h2,
.h2, .hache2 {
    margin: 30px 0;
    color: #015ca7;
    font-size: 38px;
    font-weight: 300;
    letter-spacing: 0;
    text-transform: none;
}
h3,
.h3, .hache3 {
    color: #015ca7;
    font-size: 32px;
    font-weight: 300;
    letter-spacing: 0px;
    text-transform: none;
}
h4,
.h4, .hache4 {
}
h5,
.h5, .hache5 {
}
h6,
.h6, .hache6 {
}

/** TYPO SIZE **
------------------------------------------------------------
------------------------------------------------------------*/
.typo--xxs {
    font-size: 10px;
    line-height: 13px;
}
.typo--xs {
    font-size: 12px;
    line-height: 14px;
}
.typo--sm {
    font-size: 14px;
}
.typo--md {
    font-size: 16px;
}
.typo--lg {
    font-size: 18px;
}
.typo--xl {
    font-size: 22px;
}
.typo--xxl {
    font-size: 30px;
}
.typo--xxxl {
    font-size: 40px;
}

/** TYPO GRAISSE **
------------------------------------------------------------
------------------------------------------------------------*/
.typo--thin {
    font-weight: 300;
}
.typo--regular {
    font-weight: 400;
}
.typo--bold {
    font-weight: 700;
}
.typo--extrabold {
    font-weight: 900;
}
.typo--uppercase {
    text-transform: uppercase;
}
.typo--lowercase {
     text-transform: lowercase;
}
.typo--capitalize {
    text-transform: capitalize;
}
.typo--letterspacing {
    letter-spacing: 1.2px;
}

/** TYPO CURSIVE **
------------------------------------------------------------
------------------------------------------------------------*/
.typo--cursive {
    font-family: 'Roboto Condensed', sans-serif;
}


/** TYPO THE CONTENT **
------------------------------------------------------------
------------------------------------------------------------*/
.the-content a {
    text-decoration: underline;
}
.the-content p {
    margin: 0 0 30px;
}

.the-content h1 {
    font-size: 30px;
}

.the-content h2 {}

.the-content h3 {}

.the-content h4 {
}

.the-content h5 {
}

.the-content h6 {
}

.the-content ul {
    list-style: none;
    margin: 0 0 30px 0;
    padding: 0;
}
.the-content ul li {
    margin: 0 0 10px 15px;
    position: relative;
    font-weight: 400;
    font-size: 16px;
}

.the-content ul li::before {
    position: absolute;
    display: block;
    content: '\f054';
    font-size: 10px;
    color: #5b5c5f;
    font-family: "Font Awesome 5 Pro";
    top: 1px;
    left: -15px;
}

.the-content blockquote {
    position: relative;
    font-style: italic;
    font-size: 16px;
    line-height: 24px;
    color: #5b5c5f;
    display: block;
    padding-left: 25px;
}
.the-content blockquote::before {
    content: '';
    display: block;
    position: absolute;
    left: 0;
    top: 0;
    background: #5b5c5f; /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    width: 1px;
    height: 100%;
}


/** TYPO RESPONSIVE **
------------------------------------------------------------
------------------------------------------------------------*/
@media (min-width: 576px) {
}

@media (min-width: 768px) {
    h1,
    .h1 {
    }
    h2,
    .h2 {
    }
    h3,
    .h3 {
    }
    h4,
    .h4 {
    }
    .h5 {
    }
    .the-content h1 {
    }

    .the-content h2 {
    }

    .the-content h3 {
    }

    .typo--md {
        font-size: 18px;
    }
    .typo--lg {
        font-size: 20px;
    }
    .typo--xl {
        font-size: 26px;
    }
    .typo--xxl {
        font-size: 40px;
    }
    .typo--xxxl {
        font-size: 52px;
    }

    .the-content blockquote {
        font-size: 18px;
        line-height: 28px;
    }
}

@media (min-width: 992px) {

}

@media (min-width: 1200px) {
}

@media (min-width: 1260px) {
}