body {
	
	/* margin: -275px 0 ; */
	
	
	padding: 0 ;
	text-align: center ;
	
	/* font: 0.8em "Trebuchet MS", helvetica, sans-serif ; */
	font:"Georgia", helvetica, sans-serif ;
	font-size: calc(12px + 0.390625vw);
	
	/* background: url(images/fond.jpg) ; */
	background: #556B2F ;
}

div#logo{
	
	position : relative; 
	
	
	
	/* top: 275px; */
	
	
	/* left:-330px; */

}


div#conteneur{
	/* width: 770px ; */
	width: 1280px ; 
	
	 margin: 0 auto ;
	
	
	text-align: left ;
	border: 2px solid #000000 ;
	background: #fff ;
	
}

@media all and (max-width: 1920px)
{
    div#conteneur
    {
        width: auto;
    }
}


h1#header{
	height: 625px ; 
	
	
	
	/* background: url(images/ours.png) no-repeat left top; */
	
	background: url(images/ours2022b.jpg) no-repeat top;
	
	 margin: 0 0 -300px 0 ; 
	
	
	/* Ajout */
	/* background-color: #556B2F; */
	background-size: contain;
}

@media all and (max-width: 1024px)
{
    h1#header
    {
     
	   background: url(images/fondvert.jpg) no-repeat top;
	   margin-bottom: auto;
		height: auto ; 
		
		
		
    }
}

h1#header a{
	width: 400px ;
	height: 70px ;
	display: block ;
	background: url(images/titre.jpg) no-repeat ;
	position: relative ;
	left: 350px ;
	top: 15px ;
	text-indent: -5000px ;
}




ul#menu{
	height: 35px ;
	margin: 0 ; 
	
	padding: 0 ;
	
	
	/* background: url(images/menu1.jpg) repeat-x 0 -25px ; */
	background: url(images/menu1b.jpg) repeat-x 0 -25px ;
	
	list-style-type: none ;
	
}


/* Pour le menu responsive */
@media all and (max-width: 1024px)
{
   ul#menu
    {
       
	/* background: url(images/menu1b.jpg) repeat 0 -25px ; */
	
	/* test */
	background: #556B2F  ;
	padding-bottom : 20px;
	
    }
}

 /* ----cible la largeur phyqique des écran de telephone plutôt que la largeur du viewport ----------- */
@media all and (max-device-width: 480px)
{
   ul#menu
    {
       
	/* background: url(images/menu1b.jpg) repeat 0 -25px ; */
	
	/* test */
	background: #556B2F  ;
	padding-bottom : 50px;
	
    }
}



/* Fin du  menu responsive */



ul#menu li{
	float: left ; 
	
	
	text-align: center ;
}
ul#menu li a{
	width: 126px ;
	line-height: 25px ;
	
	/* font-size: 1.2em ; */
	font-size: calc(15px + 0.390625vw); ;
	
	font-weight: bold ;
	letter-spacing: 2px ;
	
	/* color: #000000 ; */
	color: white ;
	
	display: block ;
	text-decoration: none ;
	border-right: 2px solid #FFFFFF ;
}
ul#menu li a:hover
{
	background: url(images/menu1.jpg) repeat-x 0 0 ;
}

div#contenu{
	padding: 0 30px 0 30px ;
	
}
div#contenu h2{
	padding-left: 50px ;
	line-height: 44px ;
	font-size: 1.8em ;
	background: url(images/mini.png) no-repeat left bottom ;
	color: #036105 ;
	border-bottom: 2px solid #036105 ;
}
div#contenu h3{
	padding-left: 50px ;
	line-height: 44px ;
	font-size: 1.8em ;
	background: url(images/mini.png) no-repeat left bottom ;
	color: #036105 ;
}
div#contenu h4{
	margin-left: 15px ;
	padding-left: 5px ;
	font-size: 1.2em ;
	color: #036105 ;
}
div#contenu h5{
	padding-left: 50px ;
	line-height: 44px ;
	font-size: 1.1em ;
	background: url(images/mini.png) no-repeat left bottom ;
	color: #036105 ;
}



div#contenu p
{
	text-align: justify ;
	text-indent: 4em ;
	line-height: 1.7em ;
	
	/* -- Ajout : -- */
	font-size: calc(12px + 0.390625vw);
}
div#contenu a
{
	color: #48590d ;
	
}

div#contenu a:hover
{
	color: #97c00e;
}

/* --- Ajout pour la taille des listes ----- */

div#contenu ul
{
	
	font-size: calc(12px + 0.390625vw);
}

/* ------------ */



a img {
	border: none;
}
p#footer
{
	margin: 0 ;
	padding-right: 10px ;
	line-height: 30px ;
	text-align: right ;
	color: #036105 ;
}

pre{
	overflow: auto ;
	background: #ff3ca4  ;
	border: 2px solid #000000 ;
	padding: 5px 0 0 5px ;
	font-size: 1.2em ;
}
pre span
{
	color: #fd93cb ;
}
pre span.comment
{
	color: #47bfdd;
}
#photo {
	float:left;
	width: 350px;
}
#photo1 {
	float:left;
	margin-right:15px ;
}
#photo2 {
	float:right;
	margin-left:15px ;
}


  /* --test code responsive pour google map : ---- */
#map{
	float:right;
	margin-left:15px ;
}


@media all and (max-width: 450px)
{
  #map{
	
	position: relative  ;
	left: 80px;
	
	}
}

 /* -- FIN test code responsive pour google map : ---- */


/* Responsive images */
img, picture, video {
  max-width: 100%;
}



#signature {
	text-align: right;
}
#ajout {
	float:right;
	
	background: #fce497  ;
	width: 220px;
	padding: 0 5px 15px 15px ;
	border-radius: 10px ;
	
	/* ----ajout : ------------ */
	margin-left: 15px ;
}

#presentation {
	width: 450px;
	
}
@media all and (max-width: 1024px)
{
  #presentation 
    {
       
	width: auto ;
	
    }
}






div#boite{
	
	
	
	background: #b4da8a ;
	
	padding: 5px 15px 5px 15px ;
	border-radius: 10px ;
	
	

}


/* css pour la pagination  */
ul
{
    border:0; 
    margin:0; 
    padding:0;
}

#pagination-digg li
{
    border:0; 
    margin:0; 
    padding:0;
    font-size: calc(12px + 0.390625vw);
    list-style:none;
    margin-right:2px;
}

#pagination-digg a
{
    border:solid 1px #000;
    margin-right:2px;
}

#pagination-digg .previous-off, #pagination-digg .next-off 
{
    border:solid 1px #DEDEDE;
    color:#888888;
    display:block;
    float:left;
    font-weight:bold;
    margin-right:2px;
    padding:3px 4px;
}

#pagination-digg .next a, #pagination-digg .previous a 
{
    font-weight:bold;
}

#pagination-digg .active
{
    background:#036105;
    color:#FFFFFF;
    font-weight:bold;
    display:block;
    float:left;
    padding:4px 6px;
}

#pagination-digg a:link, #pagination-digg a:visited 
{
    color:#036105;
    display:block;
    float:left;
    padding:3px 6px;
    text-decoration:none;
}

#pagination-digg a:hover
{
    border:solid 1px #fff;
}
/* Fin du css pour la pagination  */