html, body {
  height: 100%;
  width: 100%;
  padding: 0;
  margin: 0;
}



#full-screen-background-image {
  z-index: -999;
  min-height: 100%;
  min-width: 1024px;
  width: 100%;
  height: auto;
  position: fixed;
  top: 0;
  left: 0;
}

.center {
	text-align:center;}

@font-face { font-family: 'busorama';
src: url(font/busorama.ttf) format('truetype');}


.float img {
	float:left;}

.menu li {
	display:inline;
	padding-left:3%;
		}
.partenaire {
	text-align:center;
	}		
.partenaire a {
	color:#FFF;}		
.partenaire a:hover {
	color: #CCC;}	

.ltop {
	height:20px;
	width:100%;
	background-color:rgba(26,94,8,0.6);
	border-bottom:1px solid white;}
	
	
.menu {
	width:100%;
	margin:auto;
	margin-top:0px;
	background-color:rgba(255,255,255,0.9);
	border-bottom:1px solid #060;
		}
		
.menu ul {
	width:90%;
	margin:auto;}
	
		
.menu a {
	text-decoration: none;
	font-size:18px;
	font-family: 'busorama';
	color:#235706;
	transition:All 0.5897s ease-in-out;
-webkit-transition:All 0.5897s ease-in-out;
-moz-transition:All 0.5897s ease-in-out;
-o-transition:All 0.5897s ease-in-out;}
			
.menu a:hover {
	text-decoration: none;
	border-bottom:4px double #630;
	font-family: 'busorama';
	color: #630;
	transition:All 0.5897s ease-in-out;
-webkit-transition:All 0.5897s ease-in-out;
-moz-transition:All 0.5897s ease-in-out;
-o-transition:All 0.5897s ease-in-out;}
		
		
		.logo {
			width:472px;
			margin:auto;}

/* ~~ Sélecteurs d'éléments/balises ~~ */
ul, ol, dl { /* En raison des variations entre les navigateurs, il est conseillé d'attribuer une valeur de zéro aux marges intérieures et aux marges des listes. A des fins de cohérence, vous pouvez définir les valeurs désirées dans cette zone ou dans les éléments de liste (LI, DT, DD) qu'elle contient. N'oubliez pas que les paramètres que vous définissez ici se répercuteront sur la liste .nav, sauf si vous rédigez un sélecteur plus spécifique. */
	padding: 0;
	margin: 0;
}
h1, h2, h3, h4, h5, h6, p {
	margin-top: 0;	 /* la suppression de la marge supérieure résout un problème où les marges sortent de leur div conteneur. La marge inférieure restante l'éloignera de tout élément qui suit. */
	padding-right: 15px;
	padding-left: 15px; /* l'ajout de la marge intérieure aux côtés des éléments à l'intérieur des divs, et non aux divs proprement dit, évite le recours à des calculs de modèle de boîte. Une autre méthode consiste à employer une div imbriquée avec marge intérieure latérale. */
}
a img { /* ce sélecteur élimine la bordure bleue par défaut affichée dans certains navigateurs autour d'une image lorsque celle-ci est entourée d'un lien. */
	border: none;
}

/* ~~ La définition du style des liens de votre site doit respecter cet ordre, y compris le groupe de sélecteurs qui créent l'effet de survol. ~~ */

.ju {
	font-size: 2.5em
}
a:hover, a:active, a:focus { /* ce groupe de sélecteurs offrira à un navigateur au clavier la même expérience de survol que celle d'une personne employant la souris. */
	text-decoration: none;
}

/* ~~ ce conteneur entoure toutes les autres divs, en leur attribuant leur largeur sur base d'un pourcentage ~~ */
.container {
	font-family: 'codropsicons';
	font-size:20px;
	width: 100%;
	
	
	background-color:rgba(26,94,8,0.8);
	margin: 0 auto;
	border:5px solid rgba(255,255,255,0.5);/* la valeur automatique sur les côtés, associée à la largeur, permet de centrer la mise en page. Elle n'est pas nécessaire si vous fixez la largeur du conteneur à 100%. */
}

.pro {
	background-color:rgba(26,94,8,0.6);
	margin-top:25px;
	padding-bottom:10px;
	border:4px solid rgba(255,255,255,0.7)}

/* ~~aucune largeur n'est attribuée à l'en-tête. Il occupera toute la largeur de votre mise en page. Il contient un espace réservé pour une image, qui doit être remplacé par votre logo lié.~~ */
.header {
	
}

.content {
	padding: 10px 0;
	color:white;
}
.content h1 {
	text-align:center;}

.content ul, .content ol { 
	padding: 0 15px 15px 40px;
}

/* ~~ Pied de page ~~ */
.footer {
	padding: 10px 0;
	text-align:center;
	margin-top:40px;
	background-color:rgba(0,51,0,0.9)
	
}


.fltrt {  
	float: right;
	margin-left: 8px;
}
.fltlft { 
	float: left;
	margin-right: 8px;
}
.clearfloat { 
	clear:both;
	height:0;
	font-size: 1px;
	line-height: 0px;
}


@media (min-width: 200px) and (max-width: 700px) {
	 


	
.float img {
	float: inherit;
	width:200px;}
	
.logo { 
text-align:center;
max-width:80%;}

.logo img {
	width:80%;}
			
.menu a {
			font-size:2em;
		
			}
			
		
.menu li {
	
	text-align:center;
	
	display: block;
	

		}

		
}