body {
  
	
	font-family: Arial, Helvetica, sans-serif ;
    font-size: 12px;
	background-color:#000000;
	text-align:justify;
	width: 100%;
	margin:auto;
}

h1 {
    padding: 3;
    margin: 3;
    font-size:16 px;
    align-content: center;
    color: #000000;
}

h2 {
    padding: 0;
    margin: 0;
    font-size: 14px;
    align-content: left;
    color: #000000;
}

a
{
   color: #999999;
	
	font-weight:bold;
	font-style:italic;
	text-decoration:  none;
	
}

a:hover
{
	/*color: #EC4A4D;*/
 	color: #66FF33 ;
	font-weight:bold;
	text-decoration:  none; 
}


img {width: 100%;}

.actu {
    width: 80%;
    margin:auto;
    padding: 10px;
    /*background-color: #EEEEEE;
    border: thin solid #555555; */
   
}

/*.actu h2 {
   padding: 5px;
    margin: 0;
    
 }

.actu h1 {
   padding: 5;
    text-align: center;
 }
*/


.fleche_nav {
    width: 5%;
    margin: auto;
}

.vers_info
{
    border: thin solid #000000;
    border-radius: 10px;
    background-color:#009102 ;
    padding: 0 5px;
}

.vers_info a {
    color: #F4DB04;
}

.nav_picto
{
	width: 4%; 
	margin: 0 2%; 
	float: left;
}


.nav_reseau
{
	width: 2%; 
	margin: 0 1%; 
	float: right;
}



.bouton_paypal {
    display: flex;
    flex-direction: row;
    justify-content: space-around;
   width: 70%;
    max-width: 300px;
    margin: auto;
    padding: 10px;
   background-color: #888888;
    color: #FFFFFF;
    font-size: 24px;
 font-style: normal;
    overflow: hidden;
    border-radius: 4px;
    
}


main {
	width:98%;
	min-height: 800px;
	 margin: auto;  
	 overflow: hidden;
 	 background-color: #FFFFFF; 
  }

header {
	width:100%; 
	max-width: 1200px; 
	margin: auto; 
	background-color:#DDDDDD; 
	/*border-bottom: thick solid #000000;*/
	}

footer {
	width:100%; 
	max-width: 1200px; 
	margin: auto; 
	background-color:#444444; 
	border-top:thin solid #000000;
	color:#FFFFFF;
	}

nav {
    width:100%; 
    max-width: 1200px;
    margin: auto;
    color: #000000; 
    /*background-color:#AAAAAA; */
    overflow: hidden;
}

.nav-item {
  
    /*float: left;*/
    margin: 5px ;
    padding: 5px 15px;
	background-color:#EEEEEE;
	border-bottom:thin solid #000000;
	border-top:thin solid #000000;
	border-right:thin solid #000000;
	border-left: thin solid #000000;
       }





/*
.nav-item a {
    color:#DDDDDD;
}

.nav-item a:hover
{
	color: #EC4A4D;
    color: #EFC411;
	font-weight:bold;
	text-decoration:  none;
}
*/

.nav-item-actif {
   
   /* float: left; */
	color: #FF0000;
	font-weight:bold;	 
	margin:  0 ;
    padding: 5px 15px;
	background-color:#FFFFFF;
	/*border-bottom:thick solid #FFFFFF;*/
	border-top:thick solid #000000;
	border-right:thick solid #000000;
	border-left: thick solid #000000;
	
    }

/*
.nav-item-actif {
   
    float: left;
	color:#FF0000;
	margin: 5px 5px 0 5px;
    padding: 5px;
    background-color: #EEEEEE;
    border-top-left-radius: 5px;
    border-top-right-radius: 5px;
     border-top: thin solid #302F2F;
    border-left: thin solid #302F2F;
    border-right: thin solid #302F2F;
}
*/
.nav-item-bottom {
  
    float: left;
    margin:  0 5px 5px 5px;
    padding: 5px;
    background-color:#888888;
    border-bottom-left-radius: 5px;
    border-bottom-left-radius: 5px;
    border-bottom: thin solid #302F2F;
    border-left: thin solid #302F2F;
    border-right: thin solid #302F2F;
}


.nav-item-bottom-actif {
   
    float: left;
    margin: 0 5px 5px  5px;
    padding: 5px;
    background-color: #EEEEEE;
    border-bottom-left-radius: 5px;
    border-bottom-right-radius: 5px;
    border-bottom: thin solid #302F2F;
    border-left: thin solid #302F2F;
    border-right: thin solid #302F2F;
}


.nav-item-bottom a {
    color:#DDDDDD;
}

.nav-item-bottom a:hover
{
	/*color: #EC4A4D;*/
    color: #EFC411;
	font-weight:bold;
	text-decoration:  none;
}

.bouton_lien
			{
			margin: 5px;
			padding: 3px 5px;
			display: flex;
    		flex-direction:  row;
			justify-content: flex-start;
			border:thin solid #444444;
    			
			background-color: #BBBBBB;
			border-radius: 4px;
				
			}

.pied_logo {
    float: left;
    margin: auto;
    padding: 2px;
    width: 8%;
}
.pied_logo img{
    width: inherit;
}


.vignette
{
	width:20%;
    padding: 10px;
    margin: 15px;
	text-align:center;
	overflow:hidden;
	vertical-align:middle;
}

.vignette_boutique
{
	width:20%;
    padding: 10px;
    margin: 15px;
    border: thin solid #000000;
	overflow:hidden;
    background-color: aqua;
	
}


.flex_nav {
    display: flex;
    flex-direction:  row;
    align-items: left;
   
	justify-content: flex-start;
    flex-wrap: wrap;
    
    
}

.flex_cont {
    display: flex;
    flex-direction:  row;
    align-items: left;
   justify-content:   space-around; 
	
    flex-wrap: wrap;
    
    
}

#content {width:100%; height: 100%; overflow: hidden; }
#sidebar {width:100%;height: 100%  }
#sidebar h1 {font-size: 24px}
footer {width:100%;max-width: 1200px; margin: auto; }


 @media screen and (min-width: 780px) {

main {width:100%; min-height: 800px;  margin: 0 auto; }
#content {width:70%; min-height: 800px; height: 100%;  float:right; }
#sidebar {width:30%; height: 100%; min-height: 800px; float:left; }
h1 {font-size:36px;}
h2 {font-size:18px;}
body {font-size:16px;}
}

/*  Boutons de partage */

.share-container{
    display:flex;
    gap:12px;
    flex-wrap:wrap;
}

.share-btn{
    display:flex;
    align-items:center;
    justify-content:center;
    padding:12px 18px;
    border-radius:8px;
    color:white;
    text-decoration:none;
    font-weight:bold;
    transition:0.2s ease;
}

.share-btn:hover{
    transform:translateY(-2px);
    opacity:0.9;
}

.facebook{ background:#1877f2; }
.twitter{ background:#000000; }
.linkedin{ background:#0a66c2; }
.pinterest{ background:#e60023; }
.whatsapp{ background:#25d366; }