/* Default css file for content edited with htmlArea RTE */
/*** pour le moment on copie le root...pas top, mais sinon ca marche po dans le BE ***/
body.htmlarea-content-body{
	/***** copie ****arf ****/
	/* Neutral base */
	--ulk-font-color: #000;
	--ulk-background: #FFF;
	--ulk-background-rgb: 255, 255, 255;
	--ulk-bloc-neutre1: #EEE;
	--ulk-bloc-neutre1-rgb: 238, 238, 238;
	--ulk-bloc-neutre2: #DEDEDE;
	--ulk-bloc-neutre2-rgb: 222, 222, 222;
	--ulk-font-color-sombre: #FFF;
	--ulk-background-sombre: #161c26;
	--ulk-background-rgb-sombre: 22, 28, 38;
	--ulk-bloc-neutre1-sombre: #222831;
	--ulk-bloc-neutre1-rgb-sombre: 34, 40, 49;
	--ulk-bloc-neutre2-sombre: #393e46;
	--ulk-bloc-neutre2-rgb-sombre: rgb(57, 62, 70);
	/*** theme 2 : industrie **/
	/*
	--ulk-theme2-bloc-primary: #1F8389;
	--ulk-theme2-bloc-primary-rgb: 153, 153, 204;
	--ulk-theme2-font-primary: #3F3F5F;
	--ulk-theme2-font-color-bloc-primary: #000;
	--ulk-theme2-font-accent: #AA2E00;
	--ulk-theme2-element-deco: ;
	--ulk-theme2-bloc-primary-sombre: #3F3F5F;
	--ulk-theme2-bloc-primary-rgb-sombre: 51, 51, 102;
	--ulk-theme2-font-primary-sombre: #96A2F5;
	--ulk-theme2-font-accent-sombre: #F39200;
	--ulk-theme2-element-deco-sombre: ;
	*/
	/**** end copie ****/

	--pro-font-color: var(--ulk-font-color);
	--pro-background: var(--ulk-background);
	--pro-background-rgb: var(--ulk-background-rgb);
	--pro-bloc-neutre1: var(--ulk-bloc-neutre1);
	--pro-bloc-neutre1-rgb: var(--ulk-bloc-neutre1-rgb);
	--pro-bloc-neutre2: var(--ulk-bloc-neutre2);
	--pro-bloc-neutre2-rgb: var(--ulk-bloc-neutre2-rgb);
	--pro-font-color-sombre: var(--ulk-font-color-sombre);
	--pro-background-sombre: var(--ulk-background-sombre);
	--pro-background-rgb-sombre: var(--ulk-background-rgb-sombre);
	--pro-bloc-neutre1-sombre: var(--ulk-bloc-neutre1-sombre);
	--pro-bloc-neutre1-rgb-sombre: var(--ulk-bloc-neutre1-rgb-sombre);
	--pro-bloc-neutre2-sombre: var(--ulk-bloc-neutre2-sombre);
	--pro-bloc-neutre2-rgb-sombre: var(--ulk-bloc-neutre2-rgb-sombre);
	/* Theme 2 : Industrie */
	/*
	--pro-bloc-primary: var(--ulk-theme2-bloc-primary);
	--pro-bloc-primary-rgb: var(--ulk-theme2-bloc-primary-rgb);
	--pro-font-primary: var(--ulk-theme2-font-primary);
	--pro-font-color-bloc-primary: var(--ulk-theme2-font-color-bloc-primary);
	--pro-font-accent: var(--ulk-theme2-font-accent);
	*/
	/* --pro-element-deco: var(--ulk-theme2-element-deco); */
	/* WARNING : undefined. */
	/* --pro-element-deco: var(--ulk-deco-gre01); */
	--pro-bloc-primary-sombre: var(--ulk-theme2-bloc-primary-sombre);
	--pro-bloc-primary-rgb-sombre: var(--ulk-theme2-bloc-primary-rgb-sombre);
	--pro-font-primary-sombre: var(--ulk-theme2-font-primary-sombre);
	--pro-font-accent-sombre: var(--ulk-theme2-font-accent-sombre);
	/* --pro-element-deco-sombre: var(--ulk-theme2-element-deco-sombre);*/
	/* WARNING : undefined. */
	/* --pro-element-deco-sombre: var(--ulk-deco-gre01); */
	/* !!! - Filter for svg */
	--pro-element-deco-filter: invert(51%) sepia(52%) saturate(3752%) hue-rotate(142deg) brightness(97%) contrast(94%);

	/* Font */
	--pro-font-family-sans: var(--ulk-font-family-sans);
	--pro-font-family-serif: var(--ulk-font-family-serif);
	--pro-font-size: var(--ulk-font-size);
	/* Font Height */
	--pro-profile-title: 4.5rem;
	--pro-identity-title: 2rem;
	--pro-identity-item: 1.7rem;
	--pro-domain-item: 1.7rem;
	--pro-contact-item: 1.7rem;
	--pro-content-title: 3rem;
	--pro-content-text: 1.6rem;
	--pro-title-h2: 2.5rem;
	--pro-title-h3: 2.3rem;
	--pro-title-h4: 1.8rem;
	/* Spacing values */
	--desktop-padding: 3.8rem;
	--mobile-padding: 1.9rem;
	/* -- */
	--navbar-height: 7rem;
	--divider-width: 9rem;
	/* old = 10rem */
	--divider-height: .75rem;

}

/* Table style only applied in the BE for identifying tables */
body.htmlarea-content-body TABLE {
	width: 100%;
	border-collapse: collapse;
	border: solid 1px #8C8C8C;
}

body.htmlarea-content-body TABLE TD {
	padding: 5px;
	border: solid 1px #8C8C8C;
}

body.htmlarea-content-body TABLE TH {
	padding: 5px;
	border: solid 1px #8C8C8C;
	background-color: #F3F3F3;
	color: inherit;
}

/* Align buttons */
.align-left {
	text-align: left;
}

.align-right {
	text-align: right;
}

.align-center {
	text-align: center;
}

.align-justify {
	text-align: justify;
}

/* Paragraph styles */

p sup,
p sub {
	font-size: 0.7em;
}

p.Code {
	font-family: "Courier New", Courier, monospace;
	font-size: 0.9em;
	padding: 1em;
	background: #f0f0f4;
	border: 1px #ccd solid;
}

p.Citation,
blockquote {
	padding: 10px 20px;
	margin: 0px 0px 20px;
	font-size: 2rem;
	border: none;
	border-left: 5px solid #EEE;
}

p.Majuscule {
	text-transform: uppercase;
}

p.Cadre-pourpre {
	padding: 1rem;
	border: none;
	background-color: #AE2573;
	color: #FFFFFF;
	margin-bottom: 10px;
}

.cadre-couleur-principale {
	/* background: var(--site-bloc-primary); */
	background: #1f8389;
}


.cadre-couleur-gris {
	background: #eee;
	color:#000;
}


.cadre-bouton {
	/* To customize : height + width + font-size on separate class for overwriting */
	transition: font-size .2s, background-color .2s;
	display: flex;
	justify-content: center;
	align-items: center;
	background: var(--pro-background);
	box-shadow: 0rem 0.3rem 0.6rem #00000029;
	border-radius: 1rem;
	/* width: 4.7rem;
  height: 4.7rem;
  font-size: 1.6rem; */
}


@media screen and (max-width: 576px) {
	.cadre-bouton {
		/* To customize : height + width + font-size on separate class for overwriting */
		transition: font-size .2s;
		/* width: 3.7rem;
    height: 3.7rem;
    font-size: 1.25rem; */
	}
}

.cadre-bouton:hover {
	transition: font-size .2s, background-color .2s;
	/* font-size: 2rem; */
	background-color: #1F8389;
}

@media screen and (max-width: 576px) {
	.cadre-bouton:hover {
		transition: font-size .2s;
		font-size: 1.8rem;
	}

}


p.cadre-couleur-principale,
p.cadre-couleur-gris {
	padding: 1.5rem;
}

.cadre-couleur-principale a,
.cadre-couleur-gris a {
	color: inherit;
}


p.align-left {
	text-align: left;
}

p.align-right {
	text-align: right;
}

p.align-center {
	text-align: center;
}

p.align-justify {
	text-align: justify;
}


/* Bullet styles */
ul.component-items {
	color: #186900;
	list-style-type: circle;
}

ul.action-items {
	color: #8A0020;
}

ol.component-items-ordered {
	color: #10007B;
	list-style-type: lower-roman;
}

ol.action-items-ordered {
	color: #8A0020;
	list-style-type: lower-greek;
}

/* Span styles */
span.label {
	display: inline-block;
}

span.important {
	display: inline;
	padding: 0.2em 0.6em 0.3em;
	font-size: 90%;
	font-weight: 700;
	line-height: 1;
	color: #FFF;
	text-align: center;
	white-space: normal;
	vertical-align: baseline;
	border-radius: 0.25em;
	background-color: #1F8389;
}

span.code {
	font-family: "Courier New", Courier, monospace;
	padding: 0 0.3em 0 0.3em;
	background: #f0f0f4;
	border: 1px #ccd solid;
}

/* Color span in blue only in RTE */
body.htmlarea-content-body span.read-more {
	color: blue;
}


/* Anchor styles */
a.external-link {}

a.external-link-new-window {}

a.internal-link {}

a.internal-link-new-window {}

a.download {}

a.mail {}

a.bouton {
	display: inline-block;
	padding: 6px 12px;
	margin-bottom: 0px;
	font-size: 14px;
	font-weight: 400;
	line-height: 1.42857;
	/* text-align: center; */
	white-space: normal;
	vertical-align: middle;
	cursor: pointer;
	-moz-user-select: none;
	background-image: none;
	border: 1px solid transparent;
	color: #333;
	background-color: #FFF;
	border-color: #CCC;
	border-radius: 2px;
}

a.bouton:focus,
a.bouton.focus {
	color: #333;
	background-color: #e6e6e6;
	border-color: #8c8c8c;
}

a.bouton:hover {
	color: #333;
	background-color: #e6e6e6;
	border-color: #adadad;
}

a.bouton:active,
a.bouton.active,
.open>.dropdown-togglea.bouton {
	color: #333;
	background-color: #e6e6e6;
	border-color: #adadad;
}

/* Image styles */
img.image-left {
	float: left;
	padding-right: 10px;
	padding-bottom: 10px;
}

img.image-right {
	float: right;
	padding-left: 10px;
	padding-bottom: 10px;
}

/* Table styles */
table.tables-lines {
	width: 100%;
	border-bottom: 1px solid #808080;
}

table.tables-lines thead th {
	text-align: left;
	background-color: #FFFFFF;
}

table.tables-lines th {
	border-top: 1px solid #808080;
	padding: 5px;
}

table.tables-lines td {
	border-top: 1px solid #808080;
	padding: 5px;
}

table.tables-lines th p {
	margin: 0px;
}

table.tables-lines td p {
	margin: 0px;
}

