body, div, h1, h2, h3, h4, h5, h6, p, ul, ol, li, dl, dt, dd, img, form, fieldset, input, textarea, blockquote {
	margin: 0; padding: 0; border: 0;
	 max-width: 1600px;
}

body {
	background-color: #FFF;margin: 0 auto;
}

/*photo  border : 1px solid red;*/

html {
  scroll-behavior: smooth;
}
/*photo  border : 1px solid red;*/

	/*==================================================
 * /*              Police d'écriture
 * ===============================================*/
@font-face {
    font-family: 'Poppins';
    src: url('Poppins-Regular.ttf');
}
@font-face {
    font-family: 'Poppins-Bold';
    src: url('Poppins-Bold.ttf');
}

 @font-face {
        font-family: 'Forte';
        src: url('g.woff') format('woff');
      }



	/*==================================================
 * /*              Baniere 
 * ===============================================*/

#nav
{
background-color:white;	
position: fixed;
width: 100%;
z-index: 10;
}
.h1
{
margin:2px auto;
margin-bottom:10px;
/*width: 1260px;*/
background-color:white;
display: flex;
justify-content: space-between;
}
	/*==================================================
 * /*              SVG
 * ===============================================*/
 .poligonne
{
	position: fixed;
    z-index: 4;
    width: 100%;
    top: 67px;
}
  .fil0 {
  fill: rgb(255 255 255);
}
/*==================================================
 * /*              Menu
 * ===============================================*/
nav#menuh a.blanc {
 color:#6c6c6c;
font-size: large;
}
/*======= block Menu hamburger=======*/
nav#menuh a.blanc {
}
/*survol de la sourie*/
nav#menuh a.blanc:hover
{
}
/*======= couleur interieur du menu (cadre)=======*/
nav#menuh
{
}
nav#menuh:target
{
background: linear-gradient(to right bottom, #fff 40%, #f9f9f9 100%);
transition: all 1s ease-out;
}
/*======= couleur des liens li=======*/
nav#menuh:target li {}
nav#menuh li {}
/*======= couleur des liens a=======*/
nav#menuh a {
}
nav#menuh:target a
{
}
nav#menuh:target a:hover
{
}
nav#menuh a:hover
{
}
/* Menu hamburger centrage à droite*/
nav#menuh{

width: 100%;
height: 61px;
overflow: hidden;
z-index: 10;
 margin-left: 150px;
margin-right: 119px;
}
nav#menuh ul {
margin: 0;
padding: 0;
list-style-type: none;
max-height: 88px;
position: relative;
font-family: Poppins, "Century Gothic", "Avant Garde", Avenir, sans-serif;
text-align: right;
}
nav#menuh li { display: inline-block; height: 61px;}


nav#menuh a {
display: inline-block;
    padding: 0 1em;
     color:#6c6c6c;
   
    letter-spacing: 0.1em;
    text-decoration: none;
    
    white-space: nowrap;
    line-height: 59px;
    height: 61px;
    font-family: Poppins, "Century Gothic", "Avant Garde", Avenir, sans-serif;
        
}

nav#menuh li a :nth-last-child(2)
{

}


nav#menuh span.factis {
padding: 0 1em;

letter-spacing: 0.1em;
text-decoration: none;

white-space: nowrap;

height: 44px;
font-family: Poppins, "Century Gothic", "Avant Garde", Avenir, sans-serif;

}
nav#menuh a.recti
{
margin-right:0px;
}

nav#menuh a:hover {  }
nav#menuh li:last-child {
    position: fixed;
    
    top: 0;
    height: 61px;
    width: 115px;
	
}
nav#menuh li:nth-last-child(2) {  display: none; }
nav#menuh:target {
height: auto;
z-index: 10;
box-shadow: 0 1px 2px rgb(19 51 61 / 50%);
position: absolute;
width: 80%;
right: 0px;

margin-right: 0px;
}
nav#menuh:target ul { max-height: none; padding: 1px;text-align: left;}
nav#menuh:target li { display: block;}
nav#menuh:target a {
display: inline-block;
padding: 0 1em;


letter-spacing: 0.1em;
text-decoration: none;
white-space: nowrap;
height: 61px;
width: auto;

}
nav#menuh:target a:hover { }
nav#menuh:target li:not(:first-child) { margin-top: 2px; }
nav#menuh:target li:last-child { display: none; }
nav#menuh:target li:nth-last-child(2) {
display: inline-block;
position: absolute;
top: 0;
right: 0;
margin: 0;
}
@media screen and (max-width: 500px)
{
nav#menuh{
 margin-left: auto;

}
}
	/*==================================================
 * /*            Div conteneur fond texte
 * ===============================================*/


#fond_texte
{
	
	opacity: .99;
	padding-top: 20px;
    background-color: #fff;

} 


 	/*==================================================
 * /* mise en page article professeur et élèves
 
 * ===============================================*/

.texte_article {
     width: 98%;
    padding: 5px 0px 0px 0px;
    margin-bottom: 30px;
    text-align: center;
    background: #ffffff;
    font-size: 16px;
    margin: 40px auto;
  /*  -webkit-box-shadow: 0 3px 5px 0 rgba(0,1,1,.1);
    box-shadow: 0 3px 5px 0 rgb(240 240 240 / 10%);*/
    background: #FFF;
   /* background: #152f69;*/
	background:#5a5a5a;
    border-radius: 20px;
}
.menu-article a
{
 font-family: Poppins-bold, "Century Gothic", "Avant Garde", Avenir, sans-serif;
    text-decoration: none;
    color: #ffffff;
    font-weight: 700;
    /* text-align: left; */
    /* margin: 80px auto 0px; */
    font-size: 19px;
}
.menu-article 
{
  margin: 50px auto;
    padding: 0px 5px 0px 5px;
    text-align: left;
    /* text-align: center; */
    /* background-color: bisque; */
    width: 50%;
}
.articleentier p.blanc  {
	  margin: auto;
    color: #000000;
    background-color: white;
    padding: 30px 0px;

}
/* ecrit par ( page article) */
.articleentier .tutorNameNDate {
color: #6c6c6c;
    display: block;
    text-align: right;
    width: 99%;
    font-weight: 700;
    background-color: white;
}
.article_non_centré
{
    text-align: left;
    margin: auto;
    margin-top: 20px;
    color: #000000;
    background-color: white;
  padding: 3% 10% 10% 10%;
    margin-top: 50px;
}


 	/*==================================================
 * /* mise en page blog professeur et élèves
 
 * ===============================================*/
.cadre_texte_et_cadre_droitre
 { width: 100%;
    margin: 20px auto;
 display: flex;
 flex-direction:row-reverse;

}
.texte
{	
width: 100%;
 
    margin-bottom: 30px;
    background: #ffffff;
}


.vertical1 h2,.vertical2 h2
{
font-family: Poppins-bold, "Avant Garde", Avenir, sans-serif;
    color: #ffffff;
    font-size: 17px;
    padding: 0px;
    background-color: #ff5722;
	 position: relative;
  -webkit-z-index: 10;
  z-index: 10;
}
.vertical1 {
 /* background-color: #0055f9; */
    height: 284px;
    writing-mode: vertical-rl;
    /* text-orientation: upright; */
    text-align: center;
    width: 0px;
    z-index: 10;
	 position: relative;
  -webkit-z-index: 10;
  z-index: 10;
}

.vertical2{
 /* background-color: #0055f9; */
    height: 284px;
    writing-mode: vertical-rl;
    /* text-orientation: upright; */
    text-align: center;
    width: 0px;
	z-index: 10;
    position: relative;
  -webkit-z-index: 10;
  z-index: 10;
}
 .video_index{

    display: flex;
    padding-bottom: 30px;
	margin-top:30px;
overflow-y: hidden;
}
.article
{	
width: 100%;
    min-width: 300px;
    margin-left: 50px;
    margin-right: 50px;
    background: #e7e7e71f;
    border-radius: 25px;
	 position: relative;
  -webkit-z-index: 1;
  z-index: 1;
    
}
.article p
{	
font-family: Poppins, "Century Gothic", "Avant Garde", Avenir, sans-serif;
color: black;
padding: 20px;
}
.article h3
{
font-family: Poppins-Bold, "Century Gothic", "Avant Garde", Avenir, sans-serif;
color: #6c6c6c;
font-size: 22px;
font-weight: 700;
padding: 20px;
}

/* ecrit par ( page blog eleve et profs) */
.article .tutorNameNDate {
color: #979797;
display: block;
text-align: right;
    /* font-weight: 700; */
}
.article .continuer {
 color: #979595;
}




.article_couleur
{	
width: 100%;
    
   min-width: 300px;
      margin-left: 50px;
    margin-right: 50px;
    background: #155269;
    border-radius: 25px;
	 position: relative;
  -webkit-z-index: 1;
  z-index: 1;
	
}
.article_couleur p
{	
font-family: Poppins, "Century Gothic", "Avant Garde", Avenir, sans-serif;
color: white;
padding: 20px;
}

.article_couleur h3
{
font-family: Poppins-Bold, "Century Gothic", "Avant Garde", Avenir, sans-serif;
color: white;
font-size: 22px;
font-weight: 700;
padding: 20px;
}

/* ecrit par ( page blog eleve et profs) */
.article_couleur .tutorNameNDate {
color: #a1a1a1;
display: block;
text-align: right;
font-weight: 700; 
}
.article_couleur .continuer
{
color: #a1a1a1;
}



@media screen and (max-width: 850px)
{
 
 
 .article_couleur
{	
width: 100%;
    min-width: 300px;
    margin-left: 50px;
    margin-right: 50px;
    background: #e7e7e71f;
    border-radius: 25px;
	 position: relative;
  -webkit-z-index: 1;
  z-index: 1;
    
}
.article_couleur p
{	
font-family: Poppins, "Century Gothic", "Avant Garde", Avenir, sans-serif;
color: black;
padding: 20px;
}
.article_couleur h3
{
font-family: Poppins-Bold, "Century Gothic", "Avant Garde", Avenir, sans-serif;
color: #6c6c6c;
font-size: 22px;
font-weight: 700;
padding: 20px;
}

/* ecrit par ( page blog eleve et profs) */
.article_couleur .tutorNameNDate {
color: #979797;
display: block;
text-align: right;
    /* font-weight: 700; */
}
.article_couleur .continuer {
 color: #979595;
}

} 

	/*==================================================
 * /*                   TITRE et paragraphe
 * ===============================================*/
.bleu
{    font-family: Poppins, "Century Gothic", "Avant Garde", Avenir, sans-serif;
    font-weight: 900;
   	color:#99a3bb;
font-size:19px;
    display: block;
    margin-top: 1em;
    margin-bottom: 1em;
}
h1 {
     font-family: Poppins-Bold, "Century Gothic", "Avant Garde", Avenir, sans-serif;
    color: #ffffff;
    font-size: 36px;
    font-weight: 700;
    width: 80%;
    letter-spacing: 2px;
    text-align: left;
    margin: 80px auto 0px;
    line-height: 42px;
  
}


 /*  Concerne blog professeur et élèves*/
h1.f {
     color:#5a5a5a;
}

h2
{
font-family: Poppins-Bold, "Century Gothic", "Avant Garde", Avenir, sans-serif;
color: #ffffff;
font-size:26px;
font-weight: 700;
padding: 20px;
}
.article_non_centré h2
{
font-family: Poppins-Bold, "Century Gothic", "Avant Garde", Avenir, sans-serif;
color: #6c6c6c;
font-size:26px;
font-weight: 700;
padding: 40px 0px 40px 0px;
}
.noire {
font-family: Poppins-Bold, "Century Gothic", "Avant Garde", Avenir, sans-serif;
color: #6c6c6c;
font-weight: 700;
font-size:26px;
margin-top: 1em;
margin-bottom: 1em;
display: block;
}
h3
{
font-family: Poppins-Bold, "Century Gothic", "Avant Garde", Avenir, sans-serif;
color: #db2121;
font-size:18px;
padding: 22px;
padding: 20px 0 20px 0;
font-weight: 700;
}
a
 {
 font-family: Poppins, "Century Gothic", "Avant Garde", Avenir, sans-serif;	 
 text-decoration: none;
 color: #111111;
 font-weight: 500;

}

p,ul
{
font-family: Poppins, "Century Gothic", "Avant Garde", Avenir, sans-serif;
    /* color: #ffffff; */
    font-size: 16px;
    line-height: 1.7rem;
    font-weight: 400;
}


	/*==================================================
 * /*               Les lien ANCRES 
 * ===============================================*/
.anchor{
  display: block;
  height: 100px; /*same height as header*/
  margin-top: -100px; /*same height as header*/
  visibility: hidden;
}


/*==================================================
 * Effect 2
 * ===============================================*/


/*
.effect2
{
  position: relative;
}
.effect2:before, .effect2:after
{
  z-index: -1;
  position: absolute;
  content: "";
  bottom: 15px;
  left: 10px;
  width: 50%;
 height: 50px;
  max-width:300px;
  background: #777;
  box-shadow: 0 15px 10px #777;
  transform: rotate(-3deg);
}
.effect2:after
{
  transform: rotate(3deg);
  right: 10px;
  left: auto;
}
*/
.texte_grand 
{ 
font-size:18px;
}
.bloggrand {
float: left;
    color: #60c2f2;
    font-size: 6em;
    padding: 0.3em 0em 1em 0;
    /* margin-top: -20px;*/
}
.grandssa {
    float: left;
    color: #60c2f2;
    font-size: 3em;
    padding: 0.2em 0.2em 0 0em;
    /* margin-top: -20px;*/
}

.video_dim_index
{
 width:100%;
} 
.tutor
{display: inline-block;
} 


.article_couleur .tutor
{display: block;
} 
.article .tutor
{display: block;
} 
img.cadreblanc
{
 width:100%;
 height:auto;
 border-radius: 20px 20px 0px 0px;
} 
@media screen and (max-width: 606px)
 {  
img.cadreblanc
{
 width:90%;
 height:auto;
 border-radius: 20px 20px 0px 0px;
} 
.articleentier .tutorNameNDate
{
    color: #6c6c6c;
    display: block;
    text-align: right;
    width: 90%;
    font-weight: 700;
    background-color: white;
    margin: auto;
}
}
/*==================================================
 *                    FOOTER
 * ===============================================*/

footer
{
       background: #5a5a5a;
    /* box-shadow: 0 0 3px white; */
    /* background: rgba(0,0,0,0.1); */
    text-align: center;
    margin-top: 79px;
    color: white;
    font-weight: 900;
    padding: 50px;
} 
footer a
{
padding:2px;
text-decoration: none;
} 
footer p
{display: inline-block;
height:30px;
padding:2px;
text-decoration: none;
font-weight: 900;
}

/*==================================================
 *                    TABLEAU
 * ===============================================*/
.CSSTableGenerator {
margin-top:20px;
padding:0px;
text-align: center;

}
.CSSTableGenerator table{
    border-collapse: collapse;
    border-spacing: 0;
	width:100%;
	height:100%;
	
	margin-right:10px;
	box-shadow: 2px 2px 4px #888888;
		-moz-border-radius-bottomleft:14px;
	-webkit-border-bottom-left-radius:14px;
	border-bottom-left-radius:14px;
	
	-moz-border-radius-bottomright:14px;
	-webkit-border-bottom-right-radius:14px;
	border-bottom-right-radius:14px;
	
	-moz-border-radius-topright:14px;
	-webkit-border-top-right-radius:14px;
	border-top-right-radius:14px;
	
	-moz-border-radius-topleft:14px;
	-webkit-border-top-left-radius:14px;
	border-top-left-radius:14px;
	
}
.CSSTableGenerator td{
	vertical-align:middle;
	
	background-color:#ffffff;

	border:1px solid #000000;
	border-width:0px 1px 1px 0px;
	
	padding:7px;
	font-size:13px;
	font-family: "Century Gothic", "Avant Garde", Avenir, sans-serif;
	font-weight:normal;
	color:#000000;
}

.CSSTableGenerator tr:last-child td:last-child {
	-moz-border-radius-bottomright:14px;
	-webkit-border-bottom-right-radius:14px;
	border-bottom-right-radius:14px;
}
.CSSTableGenerator table tr:first-child td:first-child {
	-moz-border-radius-topleft:14px;
	-webkit-border-top-left-radius:14px;
	border-top-left-radius:14px;
}
.CSSTableGenerator table tr:first-child td:last-child {
	-moz-border-radius-topright:14px;
	-webkit-border-top-right-radius:14px;
	border-top-right-radius:14px;
}.CSSTableGenerator tr:last-child td:first-child{
	-moz-border-radius-bottomleft:14px;
	-webkit-border-bottom-left-radius:14px;
	border-bottom-left-radius:14px;
}.CSSTableGenerator tr:hover td{
	background-color:#ffaaaa;
		

}

.CSSTableGenerator tr:last-child td{
	border-width:0px 1px 0px 0px;
}.CSSTableGenerator tr td:last-child{
	border-width:0px 0px 1px 0px;
}.CSSTableGenerator tr:last-child td:last-child{
	border-width:0px 0px 0px 0px;
}


.CSSTableGenerator tr:first-child td{
		background:-o-linear-gradient(bottom, #ff5656 5%, #7f0000 100%);	background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #ff5656), color-stop(1, #7f0000) );
	background:-moz-linear-gradient( center top, #ff5656 5%, #7f0000 100% );
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr="#ff5656", endColorstr="#7f0000");	background: -o-linear-gradient(top,#ff5656,7f0000);

	background-color:#ff5656;
	border:0px solid #000000;
	text-align:center;
	border-width:0px 0px 1px 1px;
	font-size:15px;
	font-family: "Century Gothic", "Avant Garde", Avenir, sans-serif;
	font-weight:bold;
	color:#ffffff;
}
.CSSTableGenerator tr:first-child:hover td{
	background:-o-linear-gradient(bottom, #ff5656 5%, #7f0000 100%);	background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #ff5656), color-stop(1, #7f0000) );
	background:-moz-linear-gradient( center top, #ff5656 5%, #7f0000 100% );
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr="#ff5656", endColorstr="#7f0000");	background: -o-linear-gradient(top,#ff5656,7f0000);

	background-color:#ff5656;
}

.CSSTableGenerator tr:first-child td:first-child{
	border-width:0px 0px 1px 0px;
}
@media screen and (max-width: 650px)
{
.CSSTableGenerator td, .CSSTableGenerator tr:first-child td {
    padding: 3px;
    font-size: 75%;
}
}
.CSSTableGenerator tr:first-child td:first-child{
	border-width:0px 0px 1px 0px;
}
@media screen and (max-width: 526px)
{
.CSSTableGenerator td, .CSSTableGenerator tr:first-child td {
    padding: 3px;
    font-size: 60%;
}
}

	/*==================================================
 * /*               Auteur des photos
 * ===============================================*/


.img_tutor {
    height: 60px;
    width: 60px;
    border-radius: 50%;
   /* border: 3px solid #fff;*/
    position: relative;
    top: -30px;
   float: right;
}









	/*==================================================
 * /* mise en page des pages article
 
 * ===============================================*/
 .article_non_centré p {
  margin-top: 1em;
  margin-bottom: 1em;
}
 
/* lien précendent ou suivant en bas des articles */
 .conteneur_gauchedroite
{
display: flex;
justify-content: center;
align-items: center;
text-align: center;
}
 .conteneur
{
display: flex;
justify-content: flex-end;
align-items: center;
padding: 50px 5px 5px 5px;
}
/* triangle en bas des articles */
 .triangle_droite {
 width: 8px;
height: 0;
border-style: solid;
border-width: 18.5px 0 18.5px 58px;
border-color: transparent transparent transparent #007bff;
}
 .triangle_gauche {
width: 8px;
height: 0;
border-style: solid;
border-width: 18.5px 58px 18.5px 0;
border-color: transparent #007bff transparent transparent;
}
 .ins
{
padding-right: 15px;
}

.articleentier ol {list-style: none; counter-reset: li;
}
.articleentier li {counter-increment: li}

.articleentier ol li::before {
content: counter(li); 
color: #62c3f2;
display: inline-block; 
width: 1em; 
margin-right: 0.5em;  margin-left: -1.5em;
text-align: right; 
direction: rtl;
font-size: 21px;
	}

.article_non_centré li::before{
    content: "•";
    color: #ffa43d;
    display: inline-block;
    width: 1em;
     /* margin-left: -1em; */
	
}
.article_non_centré ul{
  list-style: none;
}


.retrait
{
	
	display: inline-block;
}
.bonasavoir {
 color: #ff5722;
    font-family: Poppins, "Century Gothic", "Avant Garde", Avenir, sans-serif;
    font-weight: 900;
}



.bonasavoir_sans_retrait {
	font-family: Poppins, "Century Gothic", "Avant Garde", Avenir, sans-serif;
    color: #ff7800;
    display: inline-block;
    padding-top: 8px;
}

.bugchrome
{
word-wrap: break-word;
}





.reseaux_sociaux {
    margin-bottom: 50px;
    /* padding: 3px; */
    /* height: 24px; */
    text-align: center;
}


svg#Layer_1
{
width: 80px;
}













/*==================================================
 * Formulaire contact
 * ===============================================*/



img .avatar{
float:left;
 }
/* formulaire candidature */
#photo[id="photo"] {
position: relative;
top: 20px;
text-align: center;
}
#validation
{
width: 1300px;
border-radius: 5px;
padding: 11px;
box-shadow: 3px 3px 5px black;
}
#validation  fieldset {
 padding:0px;
 }
.sectionadmin
{
display: inline-block;
vertical-align: top;
width: 595px;
border-radius: 5px;
padding: 19px;
background-color: #FFF;
margin : auto;
margin-top : 0px;
box-shadow: 3px 3px 5px #ded9d7;
}
.mailpost{
color:white;
background-color:#ffb460;
padding-left :20PX;
border-radius : 10px;
margin-left:10px;
margin-right:10px;
font-family: Poppins, "Avant Garde", Avenir, sans-serif;
font-size:12px;
}
.rouge{
color:#DF3F3F;
font-size:18px;
}
.erreur{
color:white;
background-color:#ffb460;
padding-left :20PX;
border-radius : 10px;
margin-left:10px;
margin-right:10px;
font-family: Poppins, "Avant Garde", Avenir, sans-serif;
font-size:12px;
}
.erreur_eleve{
color:white;
background-color:#ffb460;
padding-left :20PX;
border-radius : 10px;
font-family: Poppins, "Avant Garde", Avenir, sans-serif;
font-size:12px;
}
 #ok{
background:#D6EFA1;
color:#4F7307;
padding : 5px;
margin:10px;
border-radius : 25px;
-webkit-border-radius : 25px;
-moz-border-radius : 25px;
text-align : center;
font-family: Poppins, "Avant Garde", Avenir, sans-serif;
}
#erreur{
background:#ffb460;font-size:12px;
color:white;
padding : 5px;
margin:5px;
border-radius : 25px;
-webkit-border-radius :25px;
-moz-border-radius : 25px;
text-align : center;
font-family: Poppins, "Avant Garde", Avenir, sans-serif;
}
.erreurbleu{
background:#ffb460;
color:white;
border : 1px solid #C1D779;
padding : 5px;
margin:5px;
border-radius : 5px;
-webkit-border-radius : 5px;
-moz-border-radius : 5px;
text-align : center;
}
.erreurradio{
color:white;font-size:12px;border-radius : 10px;
background-color:#ffb460;
font-family: Poppins, "Avant Garde", Avenir, sans-serif;
}
form {
text-align: center;
 }
.field {
  padding:0px;
margin-top:-4px;
 border:1px solid #DF3F3F;
 border-radius:18px
 }
fieldset {
  padding:20px;
 border:1px solid #DF3F3F;
 border-radius:18px
 }
 /*inline block petit
.fieldsetdeux
 {
margin-top:200px;
 }*/
  /*inline block petit*/
@media screen and (max-width: 900px)
{
 .fieldsetdeux
 {
margin-top:10px;
 }
} 
 legend {     
padding: 20px;
   color: #ffffff;
    font-family: Poppins-bold, "Avant Garde", Avenir, sans-serif;
    font-weight: bold;
 }
label
{
   font-family: Poppins, "Avant Garde", Avenir, sans-serif;
    display: block;
    /* width: auto; */
    /* float: left; */
    padding: 3px;    
	color: white;
}
input, textarea, select, option {
 background-color:#FFF3F3;font-family: Poppins, "Avant Garde", Avenir, sans-serif;
 }
input, textarea, select {
 padding:3px;
 border:1px solid #F5C5C5;
 border-radius:5px;
 width:300px;
 }
select {
 margin-top:10px;
 }
input[type=radio] {
 background-color:transparent;
 border:none;
 width:10px;
 }
input[type=submit], input[type=reset] {
    width: 150px;
    font-family: Poppins, "Avant Garde", Avenir, sans-serif;
    /* margin-left: 5px; */
    margin: 17px;
    /* box-shadow: 1px 1px 1px #D83F3D; */
    cursor: pointer;
 }
.gauchereseau a
{
color:RED;
}
 /*inline block petit*/
@media screen and (max-width: 1050px)
{
select 
{
 width: 90%;
 }
label{

 }
input{
 width: 90%;
 }
textarea{
 width: 90%;
 }
input[type=radio] {
 width:50px;
 }
}

.g-recaptcha{
   margin: auto;
width: 304px;
}
 	/*==================================================Blok cliquable css=======*/
  .article {
	position:relative;
	/*margin-bottom: 50px;*/
	z-index: 1;
}
  .article a:before {
    bottom: 0;
    content: "";
    left: 0;
    position: absolute;
    right: -0%;
    top: -0%;
    z-index: 1;
	background-color:rgba(0,0,0,0);
}
  .article_couleur {
	position:relative;
	/*margin-bottom: 50px;*/
	z-index: 1;
}
  .article_couleur a:before {
    bottom: 0;
    content: "";
    left: 0;
    position: absolute;
    right: -0%;
    top: -0%;
    z-index: 1;
	background-color:rgba(0,0,0,0);
}

 .lesaviezvous {
	position:relative;
	margin-bottom: 50px;
	z-index: 1;
}
  .lesaviezvous a:before {
    bottom: 0;
    content: "";
    left: 0;
    position: absolute;
    right: -0%;
    top: -0%;
    z-index: 1;
	background-color:rgba(0,0,0,0);
}


/*==================================================
 * le saviez-vous
 * ===============================================*/
     blockquote:before {
              content: 'i';
    width: 44px;
    height: 44px;
    display: flex;
    justify-content: center;
    align-items: center;
    background-color: #ff5722;
    border-radius: 50px 50px 20px 50px;
    border: 4px solid #fff;
    position: absolute;
    margin: -40px 0 0 -87px;
    font-family: 'Roboto', sans-serif;
    font-weight: 700;
    font-style: italic;
    font-size: 22px;
    color: #fff;
   /* padding: 8px 15px;*/
        }
        .blok_lesaviezvous {
            margin: 30px auto;
        }
        blockquote {
            font-size: 16px;
            line-height: 1.5rem;
            position: relative;
            font-weight: 500;
            border: 2px solid rgba(94,94,94,.1);
            border-radius: 20px;
            padding: 15px 30px 15px 60px;
            margin-top: 35px;
            color: rgba(17,17,17,0.8);
        }
   /*==================================================
 * flèche vers la droite pour indiquer qu'il y a d'autre article
 * ===============================================*/    

 
 
.scroll-arrow svg path {
 
fill: #ff5722;
}

.scroll-arrow {
    position: sticky;
    right: 30px;
    font-size: 4rem;
    z-index: 1000;
    opacity: 0.8;
   background-color: #e7e7e700;
    border-radius: 25px;
    display: inline-flex;
    align-items: center;
    justify-content: center;  
}



	  /*==================================================
	/* illustration ou images des articles du blog droite et gauche
 * ===============================================*/ 	

   .image-right,
    .image-left {
      display: flex;
      flex-direction: row;
      justify-content: space-between;
      align-items: flex-start;
	  margin-top: 40px;
	  margin-bottom: 40px;
    }

    .image-left {
      flex-direction: row-reverse;
    }

    .image-right img,
    .image-left img {
      width: 40%;
    }

    .image-right p,
    .image-left p {
      width: 55%;
    }

    @media (max-width: 768px) {
      .image-right,
      .image-left {
        flex-direction: column;
        align-items: center;
      }

      .image-right img,
      .image-left img,
      .image-right p,
      .image-left p {
        width: 100%;
      }
    }
	
	
	
	
	  /*==================================================
	/* Lien en bas des article de blog 
 * ===============================================*/ 	
 .article_non_centré .plus  li::before{
  content: none;
    color: inherit;
    display: none;
    width: auto;
	
}
 
  .plus {
      font-family: Poppins, "Century Gothic", "Avant Garde", Avenir, sans-serif;
      background-color: #f4f4f4; 
      padding: 10px; 
      border-radius: 5px; 
      display: flex; /* Affiche les éléments horizontalement */
      flex-wrap: wrap; /* Permet aux éléments de passer à la ligne suivante s'ils dépassent la largeur */
      justify-content: space-between; /* Espacement uniforme entre les éléments */
  }

  .plus ul {
      list-style-type: none; 
      padding: 0; 
      margin: 0; 
      display: flex; /* Affiche les éléments horizontalement */
      flex-wrap: wrap; /* Permet aux éléments de passer à la ligne suivante s'ils dépassent la largeur */
      width: 100%; /* Utilise toute la largeur disponible */
  }

  .plus li {
      margin: 5px; /* Espacement autour de chaque élément */
      flex: 1; /* Distribue l'espace disponible entre les éléments */
  }

  .plus a {
      text-decoration: none; 
      color: #333; 
      padding: 5px 10px; 
      border: 1px solid #ddd; 
      border-radius: 5px; 
      transition: background-color 0.3s ease; 
      display: block; /* Permet de cliquer sur toute la zone du lien */
      text-align: center; /* Centre le texte */
  }

  .plus a:hover {
      background-color: #ddd; 
  }