/*
Theme Name: InfOGM
Text Domain: infogm
Version: 2.3
Tested up to: 6.2
Requires at least: 4.7
Requires PHP: 5.2.4
Description: Our default theme for 2020 is designed to take full advantage of the flexibility of the block editor. Organizations and businesses have the ability to create dynamic landing pages with endless layouts using the group and column blocks. The centered content column and fine-tuned typography also makes it perfect for traditional blogs. Complete editor styles give you a good idea of what your content will look like, even before you publish. You can give your site a personal touch by changing the background colors and the accent color in the Customizer. The colors of all elements on your site are automatically calculated based on the colors you pick, ensuring a high, accessible color contrast for your visitors.
Tags: blog, one-column, custom-background, custom-colors, custom-logo, custom-menu, editor-style, featured-images, footer-widgets, full-width-template, rtl-language-support, sticky-post, theme-options, threaded-comments, translation-ready, block-patterns, block-styles, wide-blocks, accessibility-ready
Author: the WordPress team
Author URI: https://wordpress.org/
Theme URI: https://wordpress.org/themes/twentytwenty/
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html

All files, unless otherwise stated, are released under the GNU General Public
License version 2.0 (http://www.gnu.org/licenses/gpl-2.0.html)

This theme, like WordPress, is licensed under the GPL.
Use it to make something cool, have fun, and share what you've learned
with others.
*/
@import url('https://fonts.googleapis.com/css2?family=Bree+Serif&display=swap');


					
					
HTML {
  height: 100%;
  width: 100%;
  margin: 0;
  padding: 0;
font-size: 62.5%;  
}

BODY{
	position:relative;
	width: 100%;
  margin: 0;
  padding: 0;	
	font-size: 2rem;  
	color:black;
	background:#eeeeee;
	line-height:1.4;
font-family: "Montserrat", Arial, sans-serif;
	}
IMG{
max-width:100%;
height:auto;
}

*{
box-sizing: border-box;
}
/* =========================================================
             HEADER
 ========================================================= */
#site-header{
	width:100%;
	height:149px;
	background:white;
}
#site-header>div{
	max-width:1400px;
	position:relative;
	margin:0 auto;
}
.site-logo{
width: 200px;
padding: 10px 0 11px 10px;
}
.slogan{
position: absolute;
  top: 7px;
  left: 219px;
  font-size: 1.9rem;
  font-family: 'Bree Serif', serif;
  color: #009f3c;
  width: 283px;
  line-height: 1.2;
}  

.menu_tag{
text-align:center;
padding:20px 0 0 0;
}
DIV.menu_tag .tag{
position:relative;
background:transparent;
font-size:2rem;
border:0 none;
color:#009f3c;
margin:5px 2% 0px 2%;
font-weight:bold;
padding:0 0 0 30px;
}
DIV.menu_tag .tag:before{
content:"#";
color:#009f3c;
font-weight:bold;
font-size:3rem;
position:absolute;
left: 5px;
  top: -5px;
}
/* =========================================================
             MENU PRINCIPAL
 ========================================================= */
.primary-menu{
background:#009f3c;
}
.primary-menu>ul{
max-width:1400px;
margin:0 auto;
padding:0;
display: block;
text-align:center;
}
.primary-menu li{
display:inline-block;
list-style: none;
margin:0;
padding:0;
}

.primary-menu li a{
display: inline-block;
  margin: 15px 0;
  padding: 0px 20px 0 14px;
  color: white;
  text-decoration: none;
  font-size: 2rem;
  font-weight: normal;
  border-right: 1px solid white;
}	
.primary-menu li:hover > .sub-menu {
  animation: apparitionSousMenu 1s forwards;
}
.sub-menu{
position:absolute;
background:#009f3c;
overflow: hidden;
max-height: 0;
padding:0;
z-index:50;
}
.sub-menu li{
display:block;
text-align:left;
list-style: none;
margin:0;
padding:0;
}
.sub-menu li A{
	display:block;
	width:100%;
margin:0;
padding:15px 20px;
border:0 none;
font-size: 1.8rem;
font-weight: normal;
}
.sub-menu li A:hover{
background:white;
color:#009f3c;
}
@keyframes apparitionSousMenu {
  0% {
    box-shadow: 0px 3px 3px 1px rgba(0,0,0,0);
    border-top: 3px solid white;
  }
  30% {
    box-shadow: 0px 3px 3px 1px rgba(0,0,0,0.3);
  }
  100% {
    max-height: 50em;
    border-top: 3px solid white;
    box-shadow: 0px 3px 3px 1px rgba(0,0,0,0.3);
  }
}
.bouton_don, .bouton_adh{
	position:absolute;
	display:block;
	background:#009f3c;
	color:white;
padding: 5px 15px;
  font-weight: bold;
top: 42px;
  right: 60px;
  border-radius: 4px;
  	cursor:pointer;
}
.bouton_adh{
	top: 42px;
  right: 280px;
}
#fenetre_don{
display:none;
	position:absolute;
	background:#009f3c;
	color:white;
padding: 5px 15px;
  font-weight: bold;
top: 75px;
  right: 20px;
  border-radius: 4px;
  width: 400px;
  max-width:100%;
  overflow:hidden;
  height: 218px;
  z-index:2000;
}
#fenetre_don A{
	color:white;
	cursor:pointer;
}
.don_mensuel,.don_unique{
display:inline-block;
	width:48%;
	text-align:center;
	margin:0 1%;
	  border-radius: 4px;
	  padding: 0 0 7px 0;
}
.bouton_actif{
	background:white;
	color:black !important;
}
#don_mensuel, #don_unique{
	position:absolute;
	background:white;
	padding:10px;
	  border-radius: 4px;
top: 37px;
width: 94%;
}
#don_unique{
left:500px;
}	
#don_mensuel A, #don_unique A{
	display:inline-block;
		background:#009f3c;
	color:white;
padding: 5px 15px;
  font-weight: bold;
  border-radius: 4px;
	width:47%;
	text-align:center;
	margin:1%;	
	padding:5px 0 10px 0;
}
#don_mensuel A:hover, #don_unique A:hover{
	background:#a8cd9a;
}
#don_mensuel input[type="text"], #don_unique input[type="text"]{
	display:inline-block;
	border:1px solid #009f3c;
	color:black;
	height:40px;
padding: 5px 15px;
font-size:2rem;
  border-radius: 4px;
	width:calc(100% - 80px);
	text-align:left;
	margin:1%;	
}
#don_mensuel input[type="button"], #don_unique input[type="button"]{
	display:inline-block;
	border:0 none;
	background:#009f3c;
	color:white;
	height:40px;
padding: 5px 15px;
  font-weight: bold;
  font-size:2rem;
  border-radius: 4px;
	width:60px;
	text-align:center;
	margin:1%;	
}
#bouton_recherche{
  position: absolute;
  right: 10px;
  width: 40px;
  top: 40px;
}
/* =========================================================
             MENU seondaire
 ========================================================= */ 
.second-menu{
position: absolute;
top: -4px;
right: 0; 
} 
.second-menu>ul{
margin:0 auto;
padding:0;
}
.second-menu li{
display:inline-block;
list-style: none;
margin:0;
padding:0;
}

.second-menu li a{
display: inline-block;
  margin: 15px 0;
  padding: 0px 20px 0 14px;
  color: #009f3c;
  text-decoration: none;
  font-size: 1.7rem;
  font-weight: normal;
  border-right: 1px solid #009f3c;
}	  
 
/* =========================================================
             MENU SMARTPHONE
 ========================================================= */ 
#bouton_menu{
	display:none;
width: 35px;
  height: 35px;
  position: absolute;
  top: 14px;
  left: 7px;
  cursor: pointer;
  background: url(/wp-content/themes/infogm/assets/images/bt_menu.png) no-repeat center center #009f3c;
  border-radius: 5px;
}	
#menu_smartphone{
	display:none;
	width:100%;
	background:#009f3c;
	position:absolute;
	top:112px;
	left:0;
	z-index:50;
	padding:0 0 50px 0;
}
 #menu_smartphone li{
	 list-style:none;
 }
  #menu_smartphone li A{
	color:white;
	border-bottom:1px solid white;
	text-decoration:none;
	display:block;
	padding:10px;
	text-transform:uppercase;
 }
  #menu_smartphone  .sub-menu {
  max-height: none;
  padding:10px 0 20px 30px;
  position:relative;
  left:0;
  top:0;
 }
  #menu_smartphone .sub-menu li A{
  max-height: none;
  padding:10px 0;
  text-transform:none;
 }
#menu_smartphone .sub-menu li A:hover{
	   color:white;
	   background:transparent;
   }
#menu_smartphone  .second-menu_smartphone li A{
	text-transform:none;
 }
 #menu_smartphone  .second-menu_smartphone{
margin:30px 0  0 0;
 }
 /* =========================================================
             FOOTER
 ========================================================= */ 
#site-footer{
background: #4b4b4b;
padding:30px 0 0 0;
color:white;
}	
woocommerce
#site-footer h4{
color:white;
margin:0 0 30px 0;
font-size: 2.5rem;
}	
#site-footer  .external{
margin:0 10px;
}	
#site-footer  .deux_colonnes{
padding:0 0 20px 0;
	max-width:1620px;
	position:relative;
	margin:0 auto;
padding: 0 30px 30px 30px;
}
.menu_pied{
background:black;
text-align:center;
padding: 1px;
}
.menu_pied ul{
margin:10px 0;
}
.menu_pied li{
display:inline-block;
}
.menu_pied a{
color: white;
  font-size: 1.7rem;
  margin: 0 20px;
}
}
 /* =========================================================
     GENERALITES
 ========================================================= */ 
#site-content{
	margin:30px auto;
	max-width:1500px;
	padding: 20px 50px;
}
.clear{
clear:both;
width: 100%;
height: 1px;
}
main{
padding: 30px 0;
max-width:1620px;
margin:0 auto;
}
.of{
overflow:hidden;
}
 .deux_colonnes {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  column-gap: 50px;
  row-gap: 30px;
  padding: 10px 0 40px 0;
} 
.trois_colonnes {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  column-gap: 50px;
  row-gap: 30px;
  padding: 10px 0 40px 0;
} 
.quatre_colonnes {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  column-gap: 50px;
  row-gap: 30px;
  padding: 10px 0;
} 
.lien_bloc, .lien_petitbloc{
display:block;
text-decoration:none;
color:black;
}	
.lien_bloc_juridique{
display:block;
text-decoration:none;
color:black;
-webkit-box-shadow: 0px 0px 8px 0px rgba(0,0,0,0.3); 
box-shadow: 0px 0px 8px 0px rgba(0,0,0,0.3);
padding:20px;
}
.breve{
border:1px solid #009f3c;
border-radius:5px;
padding:30px;
}

.tag, .tag_journal{
	display:inline-block;
background: #009f3c;
color:white;
font-size: 1.4rem;
padding: 5px 6px 5px 6px;
border-radius:3px;
margin:3px;
line-height:1;
}
.tagmoteur{
color:#009f3c;
font-weight:bold;
font-size: 1.2rem;
}

.tag_journal{
background: #da338b ;	
}
.tag_64,.tag_1196{
background: #118dba;	
}
.tag_70,.tag_1208{
background: #3f99ba;	
}
.tag_202,.tag_1771{
background: #f0a70a;	
}
.tag_376,.tag_1777{
background: #f88e11 ;	
}
.tag_199,.tag_1454{
background: #fcbe12 ;	
}
.tag_382,.tag_{
background: #af37fa ;	
}
.image-container {
  position: relative;
  width: 100%; /* La largeur du conteneur peut être ajustée selon vos besoins */
  padding-bottom: 55%; /* 4/3 en pourcentage (3 / 4 * 100) */
  margin:0 0 10px 0;
  background:#F0F0F0;
}
.image-carre {
position: relative;
  width: 70px;
  padding-bottom: 70px;
  margin: 0 10px 0 0;
  background: #F0F0F0;
  float:left;
}
.image-rectangle{
position: relative;
  width: 210px;
  padding-bottom: 140px;
  margin: 0 30px 0 0;
  background: #F0F0F0;
  float: left;
}

.image-container img, .image-carre img, .image-enquete img , .image-rectangle img {
  position: absolute;
  width: 100%;
  height: 100%;
  object-fit: cover; /* Ajuste l'image pour remplir la zone définie */
}
.lien_bloc H3{
	font-family: 'Bree Serif', serif;
	font-size: 2.4rem;
	margin: 0 0 20px 0;
} 
.lien_bloc H3, .lien_bloc_juridique H3{
	font-family: 'Bree Serif', serif;
	font-size: 2rem;
	margin: 0;
} 
.lien_petitbloc{
	margin:0 0 15px 0;
}
.lien_petitbloc H4,.sommaire H4{
font-size: 1.6rem;
margin: 0;
color:black;
} 
.sommaire{
	margin:30px;
	padding:10px 20px 0 20px;
	border:1px solid #E0E0E0;
	border-radius:5px;
}
.sommaire H3{
margin:0 0 20px 0;
}
.sommaire H4{
margin:20px 0 0 0;
}
.descriptif{
font-size:1.6rem;
}
.descriptif p{
margin:0;
}
/* =========================================================
        HOME PAGE 
 ========================================================= */ 
.homepage{
padding: 30px 0;
max-width:1620px;
margin:0 auto;
}
.colonnes21{
  display: grid;
  grid-template-columns: 2fr 1fr;
  column-gap: 70px;
  row-gap: 15px;
}
.homepage section{
padding: 20px 40px;
}

H5.vert,.homepage H2{
	font-family: 'Bree Serif', serif;
	color:#009f3c;
	font-size: 2.5rem;
	margin: 30px 0 20px 0;
	line-height: 1.3;
}
.homepage H2{
font-size: 3.8rem;
  margin: 0 0 30px 0;
}
.homepage H5{
font-size: 3.8rem;
  margin: 0 0 30px 0;
}
.journal H3{
font-size: 2.5rem;
  margin: 20px 0 20px 0;
}
.alaune H2{
font-size: 2.5rem;
  color:black;
  margin: 0px 0 50px 0;
}
.videos H2{
	font-size: 2.5rem;
  color:black;
  margin: 0px 0 20px 0;
	border-bottom:1px solid black;
	padding:0 0 30px 0;
}
.journal{
color:white;
background:#009f3c;
padding:30px 40px !important;
}
.journal h2{
color:white;
}
.journal .illustration{
float:left;
max-width:50%;
margin:0 40px 0 0;
}
.journal .petite_couverture{
display:inline-block;
width:150px;
margin:20px 30px;
color: white;
  font-size: 1.8rem;
  min-height: 300px;
  vertical-align: middle;
}	
.couverture_droite{
float:left;
width:150px;
margin:0  40px 0 0;
}

.enquete{
background:#a8cd9a;

}
.enquete .illustration{
float:left;
max-width:50%;
margin:0 20px 0 0;
}
.enquete H2{
margin:0 0 20px  0;
}
.enquete H4{
font-size:2rem;
}
.titre_enquete{
	margin:0;
	font-weight:bold;
}
.image-enquete{
	position: relative;
  width: 140px;
  padding-bottom: 20%;
  margin: 0 30px 0 80px;
  background: #F0F0F0;
  float:left;
}
.numero_enquete{
position: absolute;
  top: 34px;
  left: -65px;
  font-size: 2.7rem;
  color: white;
  width: 40px;
  height: 40px;
  background: #009f3c;
  border-radius: 50px;
  margin: 0;
  font-weight: bold;
  padding: 1px 0 0 12px;
}
/* =========================================================
            PAGE ARBO 
 ========================================================= */ 

 
.arborescence section>div{
	display:block;
	border:1px solid #009f3c;
padding: 15px;
  margin: 0 0 30px 0;
  font-size: 1.5rem;
  border-radius: 5px;
 }
 .arborescence .vignette{
width:200px;
margin:0 20px 0 0;
float:left;
 }
 .arbo1{
	display:block;
	font-size:2.6rem;
	font-family: 'Bree Serif', serif;	 
	margin:0 0 20px 0;
 } 
 .arbo2{
	display:block;
	font-size:1.9rem;
	color:black;
 }
 




.page-numbers{
	display:inline-block;
	border:1px solid #009f3c;
	margin:3px;
	padding:1px 5px;
}
 /* =========================================================
            PAGE ARTICLE 
 ========================================================= */  
article{
background:white;
padding: 30px 14%;
}  
.arborescence article{
padding: 30px 11%;
}  
section{
background:white;
padding: 30px 40px;
}
.transparente{
	background:transparent;
}
.aligne_gauche{
float:left;
width:70%;
padding:30px;
}
aside.colonne_droite{
float:right;
padding:0 20px 0 40px ;
width:30%;
}


H1{
	font-family: 'Bree Serif', serif;
	font-size: 4rem;
	margin: 0 0 20px 0;
	line-height: 1.3;
}

.les_auteurs, .partage{
font-size: 1.6rem;
  color: #999;
  margin: 0 0 5px 0;
}
.les_dates{
font-size: 1.6rem;
  color: #999;
  margin: 0;
}
 .partage{
text-align: right;
 }
.partage IMG{
	vertical-align: middle;
	margin: 0 5px;
}

H3{
	font-family: 'Bree Serif', serif;
	color:#009f3c;
	font-size: 2.7rem;
	margin: 25px 0 20px 0;
	line-height: 1.3;
}

.chapo{
font-weight:bold;
}
A{
color:#009f3c;
text-decoration:none;
}
table{
font-size: 1.7rem;
margin:15px 0;
}
table tr:nth-child(even){
	background:#f9f9f9;
}
table td {
	border-top:1px solid #ddd;
	padding:6px;
	vertical-align: middle;
}

.liste_cat{
	border:0 none !important;
	border-top:1px solid #ddd !important;
	padding:15px 0 !important;
}

.notes{
	font-size:1.6rem !important;
	color:#A0A0A0;
	border:0 none !important;
}
.spip_note_ref{
	position:relative;
		font-size:1.4rem;
		top:-10px;
}
.spip_documents_left {
	margin:0 30px 0 0;
}
.nav-sommaire{
	padding:0 30px 30px 30px;
	border:1px solid #009f3c;
}
.nav-sommaire li{
list-style:none;
}
.nav-sommaire li ul li{
list-style:circle;
}
.nav-sommaire a{
display:block;
margin:5px 0 5px 5px;
}
figure{
text-align: center;
margin:40px 0;
}
figcaption{
font-size:1.6rem;
color:#A0A0A0;
font-weight: normal;
}
figcaption A{
font-size:1.6rem;
color:#A0A0A0;
font-weight: normal;
text-decoration:underline;
}
figcaption p{
margin:0 0 5px 0;
}
dd, dt{
max-width:100% !important;
margin:0;
}
.iframe_video{
width:100%;padding-bottom:56%;overflow:hidden;position:relative;z-index:5;
}
.iframe_video iframe{
	width:100% !important;height:100% !important;position:absolute;left:0;
}

.bloc_rdv,.bloc_rdv h3{
	color:black;
	font-size:3rem;
	margin: 0 0 15px 0;
}

.case-date{
position:relative;
background:#009f3c;
text-align:center;
color:white;
font-size:2rem;
font-weight:bold;
padding:20px;
width:210px;
float:left;
height:140px;
margin:0;
}
.case-date.fin{
margin:0 30px 0 0;
}
.case-date.fin:after{
	content:">";
	font-size:5rem;
	color:white;
position:absolute;
top: 30px;
  left: -14px;
}	
.date_jour{
font-size:4rem;
margin:0;
line-height:1;
}
.case-texte{
overflow:hidden;
}

.cs_blocs{
	padding:0 20px 10px 20px;
	border:1px solid #009f3c;
}
.featured-media{
margin: 10px 0 40px 0;
}
.featured-media-inner img{
max-height: 550px;
  width: auto;
}



 /* note de base de page */
span.cmf_has_footnote a.cmf_footnote_link, .cmf_has_footnote_custom a.cmf_simple_footnote_link{
	color:#009f3c;
}
.cmf_footnotes_wrapper table.cmf_footnotes_table .cmf_footnote_row .cmf_footnote_link_anchor a, #cmfSimpleFootnoteDefinitionBox .cmfSimpleFootnoteDefinitionItem .cmfSimpleFootnoteDefinitionItemId {
  font-size: ;
  color: #009f3c;
}
#cmfSimpleFootnoteDefinitionBox .cmfSimpleFootnoteDefinitionItem .cmfSimpleFootnoteDefinitionItemContent {
  width: 90%;
  font-size: 1.6rem;
  color: #A0A0A0;
}
a.pgfw-single-pdf-download-button{
	display:none !important;
}
 /* =========================================================
            BOUTIQUE
 ========================================================= */  
.woocommerce-message{
	 display:none;
 }
.nb_produits{
position:absolute;
top: 43px;
  right: 231px;
background:url(/wp-content/themes/infogm/assets/images/panier.png) no-repeat center center;
width: 37px;
  height: 37px;
  background-size: cover;
  border-radius: 4px;
}
.woocommerce-checkout .border_html, #cclw_payment_section #place_order, #cclw_order_details_table .cclw_order_review_table .cclwminus, #cclw_order_details_table .cclw_order_review_table button.cclwplus {
  background:#009f3c;
  color:white;
}
.woocommerce-checkout .woocommerce a {
  color: #009f3c;
}
.woocommerce-info {
  border-top-color: #009f3c;
}

.woocommerce-notice--success{
	  color: #009f3c;
font-size: 2.8rem;
  margin: 30px 0 50px 0;
  border: 1px solid #009f3c;
  padding: 5px 20px;	  
}


.woocommerce ul.products li.product, .woocommerce-page ul.products li.product {
  float: left;
  margin: 0 2.7% 1.9em 0;
    margin-left: 0px;
  padding: 0;
  position: relative;
  width: 22.05%;
  margin-left: 0;
  border: 1px solid #F0F0F0;
  padding: 10px;
}
mark{
	background:transparent;
}

.woocommerce ul.products li.product .button{

}
.woocommerce ul.products li.product .woocommerce-loop-category__title, .woocommerce ul.products li.product .woocommerce-loop-product__title, .woocommerce ul.products li.product h3 {
  padding: .5em 0;
  margin: 0;
  font-size: 0.8em;
}
.woocommerce:where(body:not(.woocommerce-uses-block-theme)) ul.products li.product .price {
  color: black;
}
.woocommerce:where(body:not(.woocommerce-uses-block-theme)) div.product p.price, .woocommerce:where(body:not(.woocommerce-uses-block-theme)) div.product span.price {
  color: #009f3c;
font-size: 4rem;
font-weight:bold;
}
.woocommerce .quantity .qty {
  width: 3.631em;
  text-align: center;
  height: 45px;
  font-size: 2rem;
}

// les boutons de la boutique
.woocommerce button, .single_add_to_cart_button {
  background-color: #009f3c;
  color: #fff;
  -webkit-font-smoothing: antialiased;
}
.product_meta .posted_in A{
		display:inline-block;
background: #009f3c;
color:white;
font-size: 1.4rem;
padding: 5px 6px 5px 6px;
border-radius:3px;
margin:3px;
line-height:1;
}
 /* =========================================================
            FORMULAIRE, BOUTON, etc...
 ========================================================= */  
.bouton, .bouton_blanc, .wp-block-button__link{
	display:inline-block;
	background:#009f3c;
	color:white;
padding: 5px 15px;
  font-weight: bold;
  margin: 5px 10px;	
}
.bouton, .bouton_blanc{
	background:white;
	color:#009f3c;
}

.input_vert{
	height: 30px;
	padding:0 15px;
  font-size: 1.8rem;
  width: 100px;
  background: #009f3c;
  border: 0 none;
  border-radius: 5px;
  color: white;
}


/* max-width pour  résolutions en dessous de 900px*/
@media screen and (max-width: 900px) {
	main {
	padding: 4px 0;
	}
	#site-header {
	  height: 110px;
	}
	.second-menu, .primary-menu{
	display:none;
	}	
	#bouton_menu{	
	display:block;
	}
	.site-logo {
	  width: 200px;
	  padding: 0 0 11px 50px;
	}	
	.slogan {
	  top: 43px;
	  left: 53px;
	  font-size: 1.8rem;
	  width: auto;
	  padding: 0 10px 0 0;
	}
	.bouton_don {
	  top: 10px;
	  right: 60px;
	}
	.bouton_adh{
	top: 10px;
  right: 280px;
}
	#bouton_recherche{
	  top: 10px;
	}	
	.nb_produits {
	  top: 11px;
	  right: 228px;
	}
	.colonnes21 {
	  grid-template-columns: 1fr;
	}	
	.homepage .deux_colonnes {
	  grid-template-columns: 1fr;
	}
	.quatre_colonnes, .trois_colonnes {
	  grid-template-columns: repeat(2, 1fr);
	}
	.homepage section {
	  padding: 10px 30px;
	}
	#fenetre_don {
	  top: 45px;
	  right: 10px;
	}
	article {
	padding: 20px 4%;
	}
	section {
	  padding: 10px 4%;
	}
	.aligne_gauche {
	  float: none;
	  width: 100%;
	  padding: 0;
	}
	aside.colonne_droite {
	  float: none;
	  width: 100%;
	  padding: 0 4%;
	}
	.case-texte{
	width:100%;
	}
}


@media screen and (max-width: 700px) {
	.deux_colonnes, .trois_colonnes {
	  grid-template-columns: 1fr;
	}
}
@media screen and (max-width: 600px) {
  .slogan {
    top: 43px;
    left: 10px;
    font-size: 1.7rem;
    width: 243px;
    padding:
0 10px 0 0;
  }
    .bouton_adh {
    top: 60px;
    right: 60px;
  }
}
/* max-width pour  résolutions en dessous de 500px*/
@media screen and (max-width: 500px) {
	.homepage section {
	  padding: 10px 20px;
	}	
	H1 {
	  font-family: 'Bree Serif', serif;
	  font-size: 3rem;
	  margin: 0 0 20px 0;
	  line-height: 1.1;
	}
	.quatre_colonnes {
	  grid-template-columns: 1fr;
	  row-gap: 10px;
	}
	.journal .petite_couverture {
	  margin: 10px 15px;
	}
	.image-enquete {
	  width: 130px;
	  margin: 0 10px 0 0;
	}
	.numero_enquete {
	  position: absolute;
	top: -13px;
    left: -10px;
	  z-index:10;
	}
	.journal .illustration ,.enquete .illustration {
	  float: none;
	  max-width: 100%;
	  margin: 0 0 20px 0;
	}
	.journal {
	  padding: 30px 20px !important;
	}
	.deux_colonnes H4{
		margin:10px 0;
	}
	.case-date{
  padding: 10px;
  width: 140px;
	}
	.bloc_rdv .image-rectangle{
		width: 140px;
	}
}
/* max-width pour  résolutions en dessous de 420px*/
@media screen and (max-width: 470px) {
	.bouton_don span{
		display:none;
	}
  .nb_produits {
    top: 18px;
    right: 112px;
	width: 28px;
  height: 28px;
  }
  .bouton_don {
    top: 18px;
    right: 51px;
  }
	  .bouton_adh {
    top: 69px;
    right: 12px;
    font-size: 1.3rem;
  }
  #bouton_recherche {
  width: 33px;
  top: 13px;
}
}