/* -------------
    SOMMAIRE
------------- */

/* @AUTHOR : Nicolas BOUDOT */

/*
  1 - TITRE
  2 - CONTENU WISYWIG
        Liste
        Mise en forme - Inline
        Mise en forme - Block
        Citation
        Tableau
*/



/* -----------------
    1 - TITRE
----------------- */

/*
  Infos :
    Les pseudos-classes :not(:firts-child) permettent de cibler les Hn
    dans l'éditeur WYSIWYGquand les paragraphes se suivent.
*/

h1, h2, h3, h4, h5, h6, .like-h1, .like-h2, .like-h3, .like-h4, .like-h5, .like-h6 {
	line-height: 1;
    font-family: var(--font-primary);
}

h1, .like-h1 {
	font-size: 3.8rem;
    font-weight: 800;
    color: var(--white);
    margin-bottom: 26px;
    line-height: 1;
}

    h1:not(:first-child), .like-h1:not(:first-child) {
        margin-top: 50px;
    }

    @media (min-width: 768px) {
       h1, .like-h1 {
            font-size: 5.5rem;
        }
    }

h2, .like-h2 {
	font-size: 3.6rem;
    font-weight: 800;
    margin-bottom: 26px;
    line-height: 111%;
}

    h2:not(:first-child), .like-h2:not(:first-child) {
        margin-top: 50px;
    }

    @media (min-width: 768px) {
        h2, .like-h2 {
            font-size: 5rem;
            line-height: 124% ;
        }
    }

h3, .like-h3 {
	font-size: 2rem;
    font-weight: 500;
    margin-bottom: 30px;
}

    h3:not(:first-child), .like-h3:not(:first-child) {
        margin-top: 50px;
    }

    @media (min-width: 768px) {
        h3, .like-h3 {
            font-size: 2.2rem;
        }
    }

h4, .like-h4 {
	font-size: 2.7rem;
    font-weight: 600;
    line-height: 118%;
    font-family: var(--font-primary);
    margin-bottom: 20px;
}

h5, .like-h5 {
	font-size: 1.9rem;
    font-weight: 700;
    color: var(--grey);
    margin-top: 0;
    margin-bottom: 22px;
    line-height: 131%;
}

h6, .like-h6 {
	font-size: 1.4rem;
}



/* -------------------------
    2 - CONTENU WYSIWYG
------------------------- */

/* Paragraphe */
p {
    font-family: var(--font-secondary);
    line-height: 157%;
	margin: 0 0 14px 0;
}


/* Lien */
a {
	color: var(--grey);
}

    a:hover {
        color: var(--color-primary);
    }

    /* Lien dans l'éditeur WYSIWYG */
    /* p a {
        color: var(--color-primary);
        text-decoration: underline;
        font-weight: 500;
    } */



/* -------------------------
    2 - CONTENU WYSIWYG
        Liste
------------------------- */

/*
  Infos :
    La pseudo-classe :not([class]) est utilisée pour cibler les listes de l'éditeur WYSIWYG et moins impacter les autres listes
    (Menu Header, Menu Footer, Réassurance, Témoignages, etc).
*/

/* Liste - Non ordonné */
ul:not([class]) {
    text-align: left;
	margin: 5px 0 5px 0;
}

ul li {
    list-style: none;
}

    ul:not([class]) li {
        position: relative;
        font-family: var(--font-secondary);
        list-style: none;
        padding: 0 0 0 12px;
    }

        ul:not([class]) li::before {
            content: "";
            background-color: var(--color-primary);
            border-radius: 50%;
            width: 7px;
            height: 7px;
            display: inline-block;
            margin-right: 8px;
            position: absolute;
            left: 0;
            top: 8px;
        }


/* Liste - Ordonnée */
ol:not([class]) {
    counter-reset: numList;
    font-family: var(--font-secondary);
    text-align: left;
    margin: 5px 0 5px 0;
}

ol li {
    list-style-type: none;
}

	ol:not([class]) li::before {
		content: counter(numList) "-" ;
		counter-increment: numList;
        color: inherit;
        font-family: inherit;
		font-weight: inherit;
	}


/* Liste - Descriptions */
dl {
	margin:10px 5px;
}

dt {
    color:var(--black);
    font-size:1.1em;
    font-weight:bold;
}

dd {
    font-style:normal;
    margin:0;
    padding:0;
    text-indent:10px;
}



/* ---------------------------------
    2 - CONTENU WYSIWYG
        Mise en forme - Inline
--------------------------------- */

/* Strong */
b,
strong {
	font-weight: 700;
}

/* Italic */
em {
	font-style: italic;
}

em strong, strong em{
    font-weight: 700;
    font-style: italic;
}

/* Soulignement */
u {
	text-decoration: underline;
}

/* Barré */
strike, /* obsolète */
s {
	text-decoration: line-through;
}

/* Accronyme */
acronym, /* obsolète */
abbr {
	border-bottom: 1px dashed var(--color-secondary);
	cursor: help;
}

/* ---------------------------------
    2 - CONTENU WYSIWYG
        Mise en forme - Block
--------------------------------- */

/* Contact */
address {
	color: var(--color-secondary);
}

/* Code */
code {
	background-color: var(--color-secondary);
	color: var(--white);
	font-family: var(--font-primary);
	font-size: 1.1em;
	padding: 2px;
}

/* Préformaté */
pre {
	background-color: var(--gray-400);
	border: 1px solid var(--color-secondary);
	font-family: var(--font-primary);
	font-size: 1.1em;
	margin: 20px auto;
	overflow: auto;
	padding: 5%;
	width: 80%;
}

/* Séparateur */
hr {
	border-bottom: 2px ridge var(--gray-600);
	border: 0;
}


/* -------------------------
    2 - CONTENU WYSIWYG
        Citation
------------------------- */

/* Citation */
cite {
	color: var(--black);
	font-family: Arial, sans-serif;
	font-size: 1.1em;
	padding: 0 3px 0 3px;
}

/* Citation en incise */
q {
	color: var(--color-secondary);
	font-style: italic;
}
	q:after{
		content: " ' Source: "attr(cite)" ";
		font-size: 1em;
	}



/* -------------------------
    2 - CONTENU WYSIWYG
        Tableau
------------------------- */

table {
	border-collapse: collapse;
	border-spacing: 0;
	border: 1px solid var(--gray-400);
	margin: auto;
	width: 100%;
	margin-bottom: 15px;
}

table caption {
    color: var(--gray-400);
    font-size: 14px;
    font-weight: bold;
    margin: 5px 0;
    text-align: left;
}

th {
	color: var(--white);
	border: 1px solid var(--gray-400);
	color: var(--gray-600);
	font-size: 14px;
	font-weight: bold;
	padding: 2px;
}

td {
	border: 1px solid var(--gray-400);
	padding: 2px;
}

td img {
	padding: 3px;
}
