@charset "utf-8";

/* Outfit -------------------------------------------------------------- */
  @import url('https://fonts.googleapis.com/css2?family=Outfit:wght@300;400&display=swap');
/* Outfit -------------------------------------------------------------- */


/*! icons ===========================================================================  */
/* uicons ----------------------------------------------------------*/
@font-face {
	font-family: "uicons-solid-rounded";
	src: url("../uicons/uicons-solid-rounded.eot#iefix") format("embedded-opentype"), url("../uicons/uicons-solid-rounded.woff2") format("woff2"), url("../uicons/uicons-solid-rounded.woff") format("woff");
}
/* uicons ----------------------------------------------------------*/
/* MediaPiV3 ----------------------------------------------------------*/
@font-face {
  font-family: 'MediaPiV3';
  src:  url('fonts/MediaPiV3/fonts/MediaPiV3.eot?v3nfqr');
  src:  url('fonts/MediaPiV3/fonts/MediaPiV3.eot?v3nfqr#iefix') format('embedded-opentype'),
    url('fonts/MediaPiV3/fonts/MediaPiV3.ttf?v3nfqr') format('truetype'),
    url('fonts/MediaPiV3/fonts/MediaPiV3.woff?v3nfqr') format('woff'),
    url('fonts/MediaPiV3/fonts/MediaPiV3.svg?v3nfqr#MediaPiV3') format('svg');
  font-weight: normal;
  font-style: normal;
  font-display: block;
}
/* @font-face {
  font-family: 'MediaPiV3';
  src:  url('fonts/MediaPiV3.eot?vrn9pf');
  src:  url('fonts/MediaPiV3.eot?vrn9pf#iefix') format('embedded-opentype'),
    url('fonts/MediaPiV3.ttf?vrn9pf') format('truetype'),
    url('fonts/MediaPiV3.woff?vrn9pf') format('woff'),
    url('fonts/MediaPiV3.svg?vrn9pf#MediaPiV3') format('svg');
  font-weight: normal;
  font-style: normal;
  font-display: block;
} */

[class^="icon_MPV3_"], [class*=" icon_MPV3_"] {
  /* use !important to prevent issues with browser extensions that change fonts */
  font-family: 'MediaPiV3' !important;
  /* speak: never; */
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;

  /* Better Font Rendering =========== */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.icon_MPV3_euro_plain:before {
  content: "\e901";
  position: relative;
  top: 0.15em;
}
.icon_MPV3_LSF:before {
  content: "\e900";
}
/* MediaPiV3 ----------------------------------------------------------*/


/*! icons ===========================================================================  */

/*! Font à remplacer par des fonts héberger ====================================================  */

@import url("https://use.typekit.net/qhe3bfy.css");
/*

//Area Normal
font-family: "area-normal", sans-serif;
font-weight: 700;
font-style: normal;

//Area Italic
font-family: "area-normal", sans-serif;
font-weight: 400;
font-style: italic;

//Area SemiBold = gras pour normal + normal pour gras
font-family: "area-normal", sans-serif;
font-weight: 600;
font-style: normal;

//Area Bold = gras pour normal + normal pour gras
font-family: "area-normal", sans-serif;
font-weight: 800;
font-style: normal;
*/

@font-face {
	src: url('fonts/Archer/archerboldpro-webfont.woff2') format('woff2'), url('fonts/Archer/archerboldpro-webfont.woff') format('woff');
	font-family: 'archerbold';
	font-weight: normal;
	font-style: normal;
}

@font-face {
	font-family: 'Brandon_Grotesque';
	src: local('Brandon Grotesque Black'), local('Brandon-Grotesque-Black'), url('fonts/Brandon_Grotesque/BrandonGrotesque-Black.woff2') format('woff2'), url('fonts/Brandon_Grotesque/BrandonGrotesque-Black.woff') format('woff'), url('fonts/Brandon_Grotesque/BrandonGrotesque-Black.ttf') format('truetype');
	font-weight: 900;
	font-style: normal;
}

/*! Font à remplacer par des fonts héberger ====================================================  */

/*! Generated by Font Squirrel (https://www.fontsquirrel.com) on April 18, 2023 */




/* Poppins -------------------------------------------------------------- */
/* https://fonts.google.com/specimen/Poppins */
@font-face {
    font-family: 'poppins_mediumregular';
    src: url('fonts/Poppins/poppins-medium-webfont.woff2') format('woff2'),
         url('fonts/Poppins/poppins-medium-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'poppins_mediumitalic';
    src: url('fonts/Poppins/poppins-mediumitalic-webfont.woff2') format('woff2'),
         url('fonts/Poppins/poppins-mediumitalic-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}
/* Poppins -------------------------------------------------------------- */

/* Zilla Slab -------------------------------------------------------------- */

/* https://fonts.google.com/specimen/Zilla+Slab */


@font-face {
    font-family: 'zilla_slab_semibold';
    src: url('fonts/Zillaslab/zillaslab-semibold-webfont.woff2') format('woff2'),
         url('fonts/Zillaslab/zillaslab-semibold-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;

}

@font-face {
    font-family: 'zilla_slab_semisemibold_italic';
    src: url('fonts/Zillaslab/zillaslab-semibolditalic-webfont.woff2') format('woff2'),
         url('fonts/Zillaslab/zillaslab-semibolditalic-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;

}

@font-face {
    font-family: 'zilla_slabbold';
    src: url('fonts/Zillaslab/zillaslab-bold-webfont.woff2') format('woff2'),
         url('fonts/Zillaslab/zillaslab-bold-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;

}

@font-face {
    font-family: 'zilla_slabbold_italic';
    src: url('fonts/Zillaslab/zillaslab-bolditalic-webfont.woff2') format('woff2'),
         url('fonts/Zillaslab/zillaslab-bolditalic-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;

}

@font-face {
    font-family: 'zilla_slabitalic';
    src: url('fonts/Zillaslab/zillaslab-italic-webfont.woff2') format('woff2'),
         url('fonts/Zillaslab/zillaslab-italic-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;

}


/* Zilla Slab -------------------------------------------------------------- */

/* OpenSans -------------------------------------------------------------- */

@font-face {
	font-family: 'Open Sans';
	src: url('fonts/OpenSans/opensans-variablefont_wdthwght-webfont.woff2') format('woff2'), url('fonts/OpenSans/opensans-variablefont_wdthwght-webfont.woff') format('woff');
	font-weight: normal;
	font-style: normal;
}

@font-face {
	font-family: 'Open Sans italic';
	src: url('fonts/OpenSans/opensans-italic-variablefont_wdthwght-webfont.woff2') format('woff2'), url('fonts/OpenSans/opensans-italic-variablefont_wdthwght-webfont.woff') format('woff');
	font-weight: normal;
	font-style: italic;
}

/* OpenSans -------------------------------------------------------------- */

@font-face {
	font-family: 'arvoregular';
	src: url('fonts/Arvo/arvo-regular-webfont.woff2') format('woff2'), url('fonts/Arvo/arvo-regular-webfont.woff') format('woff');
	font-weight: normal;
	font-style: normal;
}

@font-face {
	font-family: 'arvoitalic';
	src: url('fonts/Arvo/arvo-italic-webfont.woff2') format('woff2'), url('fonts/Arvo/arvo-italic-webfont.woff') format('woff');
	font-weight: normal;
	font-style: italic;
}

@font-face {
	font-family: 'arvobold';
	src: url('fonts/Arvo/arvo-bold-webfont.woff2') format('woff2'), url('fonts/Arvo/arvo-bold-webfont.woff') format('woff');
	font-weight: bold;
	font-style: normal;
}

@font-face {
	font-family: 'arvobold_italic';
	src: url('fonts/Arvo/arvo-bolditalic-webfont.woff2') format('woff2'), url('fonts/Arvo/arvo-bolditalic-webfont.woff') format('woff');
	font-weight: bold;
	font-style: italic;
}

/* :root  */

:root {
	/* 	--logo_background: url(https://media-pi.fr/wp-content/uploads/2020/04/logo-mediapi-300.png); */
	--logo_background: url(
	../img/Logo_Media_Pi_512_fd_transparent_txtGris.png);
	--transition_very_slowslow: all 1.2s ease;
	--transition_slow: all .8s ease;
	--transition_medium: all .6s ease;
	--transition_quick: all .4s ease;
	--mobile-breakpoint: 450px;
	--tablet-breakpoint: 900px;
	--padding_bt: 0.3em 0.9em;
	--header_height: 3em;
	--footer_height: 3em;
	--basic_fade: all .8s ease-in-out;
	--quick_fade: all .4s ease-in-out;
	--border_radius: 0.2rem;
	/* Jess BOROY __________________________*/
	--turquoise_clair: #00BCB2;
	--turquoise: #1ca19a;
	--turquoise_sombre: #137873;
	--gris_clair: #ededed;
	--gris_moyen: #707070;
	--beige_clair: #f9f3e512;
	--noir_antracite: #303030;
	--violet: #A82E6B;
	--rose: #de2554;
	--jaune_clair: #FEF783;
	--jaune: #FECC2B;
	--orange: #ED9911;
	/* Jess BOROY __________________________*/
	
	--ok_text: #137656;
	--ok_background: #3d8740;
}

.bright_mode {
	--main_color: #3e958f;
	--main_color_bright: #3bbbb2;
	--main_color_dark: #006762;
	--theme_color_soft_black: #343434;
	--theme_color_light_gray: #E5E5E5;
	--text_color: #303030;
	--text_color_bright: #888888;
	--background_color: #ffffff;
	--background_jaune_agorapi: #F9F3E5;
	--background_color_header: #f5f5f5b8;
	--background_color_content: #e5e5e5;
	--background_color_transparent: #e2e1e1eb;
	--background_video: #b9b5b1;
	--form_bg_color: #e1e1e1;
	--background_gradient: linear-gradient(-312deg, #c0c0c0 35%, #ffffff 67%);
	--modal_overlay: hsl(176deg 52% 32% / 72%);
	--error_text: #c6243e;
	--error_background: #c6243e;
	--ok_text: #137656;
	--ok_background: #3d8740;
	--box_shadow: #00000040 0 1em 1em;
	--text_shadow: 0 0.1em 0.3em #000000b0;
}

.dark_mode {
	--main_color: #3e958f;
	--main_color_bright: #3bbbb2;
	--main_color_dark: #006762;
	--theme_color_soft_black: #343434;
	--theme_color_light_gray: #4c4c4c;
	--text_color: #dddddd;
	--text_color_bright: #888888;
	--background_color: #262626;
	--background_jaune_agorapi: #936b0b24;
	--background_color_header: #303030d9;
	--background_color_content: #3a3a3a;
	--background_color_transparent: #2e2e2eeb;
	--background_video: #0c0c0c;
	--form_bg_color: #444444;
	--background_gradient: linear-gradient(-60deg, #4d4e4e -5%, hsl(0deg 0% 0%) 170%);
	--modal_overlay: hsl(176deg 44% 17% / 87%);
	--error_text: #ff5d77;
	--error_background: #c6243e;
	--ok_text: #137656;
	--ok_background: #3d8740;
	--box_shadow: #00000059 0 1em 1em;
	--text_shadow: 0 0.1em 0.3em #000000b0;
	color: var(--text_color);
}

.usher {
	--main_color: #3e958f;
	--main_color_bright: #3bbbb2;
	--main_color_dark: #006762;
	--theme_color_soft_black: #343434;
	--theme_color_light_gray: #4c4c4c;
	--text_color: white;
	--text_color_bright: yellow;
	--background_color: hsl(0deg 0% 0%);
	--background_color_header: #000000e0;
	--background_color_content: #3a3a3a;
	--background_color_transparent: #121212eb;
	--background_video: #0c0c0c;
	--form_bg_color: #000000;
	--background_gradient: linear-gradient(-60deg, #1c1c1c -5%, hsl(0deg 0% 0%) 170%);
	--modal_overlay: hsl(176deg 44% 17% / 87%);
	--error_text: #ff5d77;
	--error_background: #c6243e;
	--ok_text: #137656;
	--ok_background: #3d8740;
	--box_shadow: #00000059 0 1em 1em;
	--text_shadow: 0 0.1em 0.3em #000000b0;
}
/* couleurs ========================================================  */
.txt_turquoise {
    color: var(--turquoise);
}
.txt_rose {
    color: var(--rose);
}
.txt_violet {
    color: var(--violet);
}
.txt_jaune {
    color: var(--jaune);
}
.txt_orange {
    color: var(--orange);
}
/* couleurs ========================================================  */
/* element_base ====================================================  */

.toCopy {
	cursor: alias;
	font-style: italic;
	position:relative;
	padding-right: 2em;
	display: inline-block;
	width: auto;
	border-radius: 0.2em;
	background-color: #80808026;
}

.toCopy.copied {
    outline: #35dd96 1px solid;
}

.toCopy:after {
	margin: 1;
	content: '\e92c';
	font-family: 'icomoon';
	font-size: 0.7em;
	margin: 0 0.8em 0 0.4em;
	position: absolute;
	top: 0;
	right: 0em;
}
.copied_feedback
{
	position: absolute;
	top: 0;
	right: 0em;
	background-color:var(--ok_background);
	padding: .2em .4em;
	border-radius:.2em;
	z-index:2;
	color:white;
}
.green_light {
    background-color: green;
    display: inline-block;
    height: 1em;
    width: 1em;
    border-radius: 100%;
    position: relative;
    box-shadow: #142a14 0 0 0.4em, #68fb68 0 0 0.6em, #11dbac 0 0 1.4em;
    background-image: linear-gradient(45deg, #45c165, #00ffd0);
}

.green_light::before {
    content: '';
    display: inline-block;
    height: .4em;
    width: .4em;
    /* position: absolute; */
    top: 0;
    left: 0;
    background-color: #ffffff54;
    vertical-align: top;
}
span.forbidden {
    color: var(--error_text);
    font-weight: bold;
}
.bt {
	cursor: pointer;
	font-weight: 800;
	display: inline-block;
	border-width: 3px;
	border-style: solid;
	border-color: var(--gris_moyen);
	border-color: var(--text_color);
	padding: .4em 1em;
	/* background-color: var(--gris_moyen); */
	color: white;
	/* color: var(--text_color); */
	/* text-transform: uppercase; */
	transition: var(--transition_medium);
	border-radius: var(--border_radius);
	font-family: 'Outfit','poppins_mediumregular', sans-serif !important;
	-webkit-font-smoothing: unset;
	font-weight: 100;
	background-color: var(--turquoise);
	border-color: var(--turquoise);
	margin: 0 .4em;
}

.bt.ok_bt {
    background-color: green !important;
    color: white !important;
}

.bt.save_bt.ok_bt::after {
    content: '✓';
    display: inline-block;
    margin-left: .4em;
}

.bt.error_bt {
    background-color: var(_red) !important;
    color: white !important;
}
.bt.inline_bt {
    padding: 0em .4em;
}

.bt.OK {
    background-color: var(--ok_background) !important;
    border-color: var(--ok_background);
    color: white !important;
}

.bt.waiting,.bt.loading {
    background-image: url(../icons/loading_simple.gif);
    padding-left: 2.7em;
    background-position: left .4em center;
    background-size: 1.8em;
    background-image: url(../icons/loading_infinite.gif);
    background-image: url(../icons/loader_ping_white.gif);
    background-color: gray !important;
    border-color: gray !important;
    cursor: progress !important;
    opacity: 0.4;
    pointer-events: none;
}

.bt_delete.bt {
    background-color: var(--error_background);
    border-color: red;
}

.bt.error {border-color: var(--error_text) !important;background-color: var(--error_background);color: white;}
/* FORM BT ==================================*/
.bt.edit_bt::before {
    content: "\e906";
    font-family: 'icomoon' !important;
    margin-left: 0;
}

/* .edit_bt {} */

/* close_bt --------------------------- */
.close_bt {
    display:inline-block;
    height: auto;
    width: auto;
    /* background-color: red; */
    transition: var(--transition_medium);
    cursor: pointer;
}

.close_bt:hover {
    transform: rotate(-180deg);
}

.close_bt::before {
   content:'\f323';
   font-family: 'uicons-solid-rounded' !important;
   font-size:2rem;
   line-height:1em;
   display:inline-block;
   margin: 0;
   display: block;
}
/* close_bt --------------------------- */
.bt_save.bt::before,.save_bt.bt::before {
    content: '\e962';
    font-family: 'icomoon' !important;
    vertical-align: baseline;
}
.bt_save.bt.OK {
    background-color: var(--ok_background);
    color: white;
}
.bt_save.bt.OK::before {
    content: '\ea10';
    font-family: 'icomoon' !important;
}
.bt_delete.bt::before {
    content: '\e9ac';
    font-family: 'icomoon' !important;
    vertical-align: baseline;
}
/* FORM BT ==================================*/
.bt.bt_tout_voir 
{
    background-color: transparent;
    /* border: none; */
    /* padding: .4em 0; */
    color: var(--text_color);
    text-wrap: nowrap;
    vertical-align: middle;
    font-size: 1em;
}

.bt.bt_tout_voir:after 
{
    margin-left: .4em;
    font-weight: normal;
    vertical-align: middle;
}

.bt:hover {
    text-decoration: none;
    border-color: var(--gris_moyen);
    background-color: transparent;
    border-color: var(--turquoise);
    color: white;
    color: var(--turquoise);
    background-color: var(--background_color);
}

.bt:after,
.bt:before,
.bt_flech:after,
.bt_flech:before {
	font-family: uicons-solid-rounded !important;
}

/* .bt:hover {} */

.jaune 
{
    color: var(--jaune);
}

.turquoise
{
    color: var(--turquoise);
}

.violet
{
    color: var(--violet);
}

.duree
{
    position: relative;
	display:inline;
	float:left;
	bottom: calc(-100% + 1.9em);
	padding:2px 4px 3px 3px;
    left:3px;
	background-color: var(--noir_antracite);
	color:white;
}

.bt_fleche {
	cursor: pointer;
	display: inline-block;
	border-width: 3px;
	border-style: solid;
	border-color: var(--gris_moyen);
	padding: 0;
	background-color: var(--gris_moyen);
	color: #1CA19A;
	transition: var(--transition_medium);
	width: 1em;
	height: 1em;
	border-radius: 100%;
	font-size: 4em;
	line-height: 0em;
	text-align: center;
	position: relative;
}

.bt_fleche:before 
{
	content: '\f12f';
	font-family: 'uicons-solid-rounded' !important;
	display: inline-block;
	width: 100%;
	vertical-align: middle;
	position: absolute;
	top: 50%;
	left: 45.5%;
	transform: translate(-50%, -50%);
	top: 4.3em;
	z-index: 10 !important;
}

.bt_fleche.left:before {
	transform: translate(-50%, -50%) rotate(180deg);
}

/* .bt_fleche:hover {} */

.bt_outline {
	background-color: transparent;
	color: currentColor;
	border: 2px solid var(--turquoise);
	padding: 0.2em 0.7em;
	border-radius: var(--border_radius);
	display: inline-block;
	cursor: pointer;
	transition: var(--transition_medium);
}

.bt_outline:hover {
    background-color: var(--turquoise);
    color: white;
}

/* .dark_mode .bt_outline {
	background-color: transparent;
	color: #FFFFFF;
	border-color: #FFF;
} */

/* element_base ====================================================  */

/* TYPO ====================================================================*/
*
{
	font-family: 'Open Sans', sans-serif;
}
html
{
	font-size:16px;
	line-height:26px;
}
.logo_MPI {
	font-family: 'Brandon_Grotesque', sans-serif !important;
	font-weight: normal;
	font-style: normal;
	text-transform: uppercase;
}
.logo_MPI  .turquoise {
    color: var(--turquoise);
    font-weight: bold;
}

.logo_MPI span {
	font-family: 'Brandon_Grotesque', sans-serif;
	font-weight: 900;
	font-style: normal;
	/* 	text-transform: uppercase; */
}

* {
	font-family: 'Open Sans', sans-serif;
	line-height: 1.625em;
	font-family: 'Outfit','poppins_mediumregular', sans-serif;
}

h1, .titre_1,
h2, .titre_2,
h3 {

	font-family: 'zilla_slab_semibold', serif;

	margin: 0.6em 0px;
/* 	font-family: 'archerbold'; */
	font-weight: normal;
	font-style: normal;
}

h1
{
	font-size:45px;
	font-size:2.1875rem;
}

h2
{
	font-size:24px;
	font-size:1.75rem;
	line-height: 1.1em;
}

h3
{
	font-size:24px;
	font-size: 1.45rem;
	text-transform:uppercase;
	margin: 0;
}
.sous_categorie_1
{
	font-family: 'Outfit','poppins_mediumregular', sans-serif, sans-serif;
	font-size:24px;
	text-transform:uppercase;
}
.sous_categorie_2
{
	font-family: 'Outfit','poppins_mediumregular', sans-serif, sans-serif;
	font-size:14px;
	text-transform:uppercase;
}

.menu_1 {
	/* //Area SemiBold = gras pour normal + normal pour gras */
	font-family: "area-normal", sans-serif;
	font-weight: 600;
	font-style: normal;
	font-size: 1.125em;
}

.menu_2 {
	/* //Area SemiBold = gras pour normal + normal pour gras */
	font-family: "area-normal", sans-serif;
	font-weight: 600;
	font-style: normal;
	font-size: 0.875em;
}
.titre_section {
	font-family: 'zilla_slab_semibold';
	font-size: 28px;
	font-size: 1.75em;
}

.sous_categorie_1 {
	font-size: 18px;
	font-size: 1.125em;
	font-weight: bold;
}

.sous_categorie_2 {
	font-size: 14px;
	font-size: 0.875em;
	font-weight: bold;
}
blockquote {
  background-color: transparent;
  font-family: 'zilla_slab_semibold', serif;
  font-style: italic;
  quotes: "\201C" "\201D";
  /* quote-mark: "\201C";
  quote-mark-after: "\201D"; */
  font-size: 1.2em;
  line-height: 1.5;
  color: var(--turquoise);
  /* display: block; */
  /* margin: auto; */
  width: 100%;
  text-align: center;
  margin: 1em auto;
  font-size: 1.4em;
}

blockquote::before {
    content: '« ';
	    /* content: '„ '; */
}

blockquote::after {
    content: ' »';
	    /* content: ' “'; */
}
.bt_1 {
	font-size: 26px;
	font-size: 1.625em;
	font-weight: 800;
	text-transform: uppercase;
}

.bt_2 {
	font-size: 19px;
	font-size: 1.1875em;
	font-weight: 800;
	text-transform: uppercase;
}

.bt_3 {
	font-size: 14px;
	font-size: 0.875em;
	font-weight: 800;
	text-transform: uppercase;
}

.etiquette_1 {
	font-size: 14px;
	font-size: 0.875em;
	font-weight: 800;
}

.etiquette_2 {
	font-size: 14px;
	font-size: 0.875em;
	font-weight: 800;
}

.menu_1 {
	font-size: 18px;
	font-size: 1.125em;
	font-weight: 600;
}

.menu_1
{
	font-family: 'Outfit', sans-serif;
	font-size:18px;
}
			
.menu_2 {
	font-size: 14px;
	font-size: 0.875em;
	font-weight: 600;
}

.chapo
{
	font-family: 'Open Sans', sans-serif;
	font-size:20px;
	font-size: 1.25rem ;
	line-height:30px;
	line-height:1.875em;
}
/* TYPO ====================================================================*/

/* BOUTONS =========================================================================*/

/* Jess BOROY __________________________/
	--turquoise_clair: #00BCB2;
	--turquoise: #1ca19a;
	--turquoise_sombre: #137873;
	--gris_clair: #ededed;
	--gris_moyen: #707070;
	--beige_clair: #F9F3E5;
	--noir_antracite: #303030;
	--violet: #A82E6B;
	--rose: #de2554;
	--jaune_clair: #FEF783;
	--jaune: #FECC2B;
	--orange: #ED9911;
	/* Jess BOROY __________________________*/


.bt_rose {
	background-color: var(--rose);
	border-color: var(--rose);
}

.bt_noir {
	background-color: var(--noir_antracite);
	border-color: var(--noir_antracite);
}

.dark_mode .bt_noir {
	background-color: var(--text_color);
	/* border-color: var(--text_color); */
}

.bt_turquoise {
	background-color: var(--turquoise);
	border-color: var(--turquoise);
}
.bt_outline.bt_turquoise:hover
{
	background-color: var(--turquoise) ;
	background-color:var(--turquoise);
	color:white;
}

.bt_outline.bt_turquoise {
	border-color: var(--turquoise);
	color: var(--text_color);
}

.bt_gris {
	background-color: var(--gris_moyen);
	border-color: var(--gris_moyen);
}

.bt_outline.bt_gris {
	border-color: var(--gris_moyen);
	color: var(--gris_moyen);
}

.bt_violet {
	background-color: var(--violet);
	border-color: var(--violet);
}

.bt_outline.bt_violet {
	border-color: var(--violet);
	color: var(--text_color);
}

.bt_jaune {
	background-color: var(--jaune);
	border-color: var(--jaune);
}

.bt_outline.bt_jaune {
	border-color: var(--jaune);
	color: var(--text_color);
}
.bt.bt_voir 
{
    border: var(--turquoise) 3px solid;
    background-color: transparent;
    padding: 0.18em 1em;
    color: inherit;
}
.fleche_turquoise_sombre {
	background-color: var(--turquoise_sombre);
	border-color: var(--turquoise_sombre);
}

.fleche_turquoise_sombre:hover {
	background-color: var(--turquoise);
	border-color: var(--turquoise);
}
.fleche_turquoise_clair {
	background-color: var(--turquoise);
	border-color: var(--turquoise);
}

.fleche_rose {
	background-color: var(--rose);
	border-color: var(--rose);
}

.fleche_noir {
	background-color: var(--noir_antracite);
	border-color: var(--noir_antracite);
}

.fleche_jaune {
	background-color: var(--jaune);
	border-color: var(--jaune);
}

.fleche_rose:hover,
.fleche_jaune:hover,
.fleche_orange
{
	background-color: var(--orange);
	border-color: var(--orange);
}

.scrollUp {
	background-color: #FFF;
	color: var(--turquoise) !important;
	display: inline-block;
	font-size: 3em;
	height: 1em;
	width: 1em;
	border-radius: 100%;
	position: relative;
	cursor: pointer;
	transition: var(--transition_medium);
	z-index: 10;
}

.scrollUp:before {
	content: "\f16b";
	top: 0.1em;
	position: absolute;
	left: 0.15em;
	font-size: .8em;
	padding: 0;
	margin: 0;
}


.bt_abo:before,
.bt_abonnement:before,
.bt_connexion:before,
.bt_inscription:before,
.bt_commentaire:before,
.bt_comment:before,
.bt_agenda:after,
.bt_equipe:after,
.bt_voir_violet:before,
.bt_voir:before,
.bt_voir_rose:before,
.bt_voir_violet:before,
.bt_voir_jaune:before,
.bt_voir_turquoise:before, 
.bt_tout_voir_rose:after,
.bt_tout_voir_violet:after,
.bt_tout_voir_turquoise:after,
.bt_tout_voir_jaune:after {
	font-family: uicons-solid-rounded !important;
	vertical-align: middle;
	margin: 0 0.7em;
	position: relative;
	font-size: 0.9em;
	top: -0.1em;
	display: inline-block;
	font-weight: normal !important;
}

.bt_abo:before,
.bt_abonnement:before {
	content: "\f53f";
}
.bt_abo,
.bt_abonnement {
	background-color:var(--rose);
	border-color:var(--rose);
	color: white !important;
}
.bt_abo:hover,
.bt_abonnement:hover {
	background-color:var(--noir_antracite);
	border-color:var(--noir_antracite);
	color:white;
}

.bt_connexion:before {
	content: "\f6bc";
}
.bt_connexion {
	background-color: var(--turquoise);
	border-color: var(--turquoise);
	color:white;
}
.bt_connexion:hover {
	background-color:var(--noir_antracite);
	border-color:var(--noir_antracite);
	color:white;
}

.bt_inscription:before {
	content: "\f388";
}
.bt_inscription {
	background-color:var(--turquoise);
	border-color:var(--turquoise);
	color:white;
}
.bt_inscription:hover {
	background-color:var(--noir_antracite);
	border-color:var(--noir_antracite);
	color:white;
}
.header .bt_mon_compte.user_avatar {background-color: var(--turquoise);border-color: var(--turquoise);width: 4em;height: 4em;border-radius: 100%;padding: 0;line-height: unset;position: relative;top: -0.5em;}

.bt_mon_compte:hover {
    background-color: var(--gris_moyen);
    border-color: var(--gris_moyen);
}
.bt_comment:before,
.bt_commentaire:before {
	content: "\f1be";
	transform: scaleX(-1);
}
.bt_comment:hover,
.bt_commentaire:hover
{
	background-color:var(--noir_antracite);
	border-color:var(--noir_antracite);
	color:white;
}
.bt_agenda:after,
.bt_equipe:after
{
	content: "\f144";
}
.bt_equipe
{
	background-color: var(--background_color) ;
	border-color:var(--turquoise);
	color: var(--text_color) ;
}
.bt_agenda
{
	background-color: var(--background_color) ;
	border-color:var(--rose);
	color: var(--text_color) ;
}
.bt_agenda:hover
{
	background-color: var(--rose) ;
	background-color:var(--rose);
	color:white;
}

.bt_equipe:hover
{
	background-color: var(--turquoise) ;
	background-color:var(--turquoise);
	color:white;
}


.bt_voir:before,
.bt_voir_rose:before,
.bt_voir_violet:before,
.bt_voir_jaune:before,
.bt_voir_turquoise:before 
{
	content: "\f53f";
}

.bt_voir_rose 
{
	background-color:var(--background_color);
	border-color:var(--rose);
	color:var(--text_color);
}
.bt_voir_rose:hover
{
	background-color:var(--rose);
	border-color: var(--rose);
	color:white;
}
.bt_voir_violet 
{
	background-color:var(--background_color);
	border-color:var(--violet);
	color:var(--text_color);
}
.bt_voir_violet:hover
{
	background-color:var(--violet);
	color:white;
	
}
.bt_voir_jaune 
{
	background-color:var(--background_color);
	border-color:var(--jaune);
	color:var(--text_color);
}
.bt_voir_jaune:hover
{
	background-color:var(--jaune);
	color:white;
}

.bt_voir_turquoise 
{
	/* background-color:var(--background_color); */
	border-color:var(--turquoise);
	/* color:var(--text_color); */
	background-color: transparent;
}
.bt_voir_turquoise:hover
{
	background-color:var(--turquoise);
	color:white;
	border-color: var(--turquoise);
}

.bt_tout_voir:after,
.bt_tout_voir_violet:after,
.bt_tout_voir_turquoise:after,
.bt_tout_voir_rose:after,
.bt_tout_voir_jaune:after
{
	content: "\f144";
	font-family: 'uicons-solid-rounded';
	margin-left: .4em;
	position: relative;
	vertical-align: middle;
}
.bt_tout_voir_rose
{
	border-color:var(--rose);
	background-color:var(--background_color);
	color:var(--text_color);
}
.bt_tout_voir_violet
{
	border-color:var(--violet);
	background-color:var(--background_color);
	color:var(--text_color);
}
.bt_tout_voir_turquoise
{
    position:relative;
	border-color:var(--turquoise);
	background-color:var(--background_color);
	color:var(--text_color);
    top:-0.65em;
    vertical-align: middle;
    font-size: 1.2em;
}

.bt_tout_voir_turquoise::after {
    margin-right: 0;
}
.bt_tout_voir_jaune
{
	border-color:var(--jaune);
	background-color:var(--background_color);
	color:var(--text_color);
}
.bt_tout_voir_rose:hover
{
	border-color:var(--rose);
	background-color:var(--rose);
	color:white;
}
.bt_tout_voir_violet:hover
{
	border-color:var(--violet);
	background-color:var(--violet);
	color:white;
}
.bt_tout_voir_turquoise:hover
{
	border-color:var(--turquoise);
	background-color:var(--turquoise);
	color:white;
}
.bt_tout_voir_jaune:hover
{
	border-color:var(--jaune);
	background-color:var(--jaune);
	color:var(--text_color);
}

/* BOUTONS =========================================================================*/
/* ICONS =========================================================================*/
.lsf_translate:before {
    content: '\e900';
    font-family: 'MediaPiV3';
}
.duree.fi-sr-time-forward::before {
    margin-right: .4em ;
    display: inline-block;
}
.fi-sr-star:before {
    color: var(--jaune);
}
/* ICONS =========================================================================*/

/* icones Rubriques =========================================================================*/
.icone_rubrique.fi-sr-users-alt {
    color: var(--turquoise);
}
.fi-sr-circle-small::before {
    color: var(--jaune) !important;
    font-size: 1.3em;
}

a.AgoraPi.fi-sr-comments:before, 
a.Agorapi.fi-sr-comments:before, 
a.Agenda.fi-sr-calendar-day:before 
{
    color: var(--rose) !important;
}

.search_bt.icon-search:before {
    /* color: var(--turquoise) !important; */
    float:right;
}
/* icones Rubriques =========================================================================*/