/* Définition des polices personnalisées */

@font-face
{
    font-family: 'museo300';
    src: url('museo300-regular-webfont.woff2') format('woff2'),
         url('museo300-regular-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}

@font-face
{
    font-family: 'museo500';
    src: url('museo500-regular-webfont.woff2') format('woff2'),
         url('museo500-regular-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}

@font-face
{
    font-family: 'museo700';
    src: url('museo700-regular-webfont.woff2') format('woff2'),
         url('museo700-regular-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}


/* Eléments principaux de la page */

*
{
	padding: 0;  /* On enlève tous les paddings inutiles */
	margin: 0;   /* On enlève toutes les marges inutiles */
	-moz-box-sizing: border-box;
	box-sizing: border-box;
 }


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

body
{
	width: 100%;
	background-color: #fff;
	padding: 0;
	margin: 0;
}

header
{
	width: 100%;
	display: flex;
	flex-direction: column;
}

#top_ligne
{
	width: 100%;
	border-bottom: 1px #b4b4b4 solid;
}

	#infos_top
	{
		max-width: 950px;
		margin: auto; /* Permet de centrer le bloc */
		display: flex;
		flex-direction: row;
		justify-content: flex-end;
		align-items: flex-end;
		flex-wrap: wrap;
	}
	
		#tel_mail
		{
			display: flex;
			flex-direction: row;
			justify-content: flex-end;
			align-items: flex-end;
			flex-wrap: wrap;
		}
		
		#reseaux_sociaux_jaipeurdeschiens
		{
			display: flex;
			flex-direction: row;
			justify-content: flex-end;
			align-items: flex-end;
			flex-wrap: wrap;
		}

#contenu-entete
{
	background-color: #fff;
}

#entete_site
{
	max-width: 950px;
	margin: auto; /* Permet de centrer le bloc */
	padding: 10px;
	display: flex;
	flex-direction: row;
	cursor: pointer;
}

#entete_image
{
	width: 250px;
	height: 250px;
	margin: 0 20px 0 0;
	padding: 0;
}

#entete_titre
{
	max-width: 910px;
	display: flex;
	flex-direction: column;
	flex-wrap: wrap;
	justify-content: center;
}

#ligne_nav
{	
	width: 100%;
	background-color: #89cdcf;
	margin-bottom: 10px;
}

nav
{
	max-width: 950px;
	margin: auto; /* Permet de centrer le bloc */
	padding: 0 10px 0 0;
	display: flex;
	flex-direction: row;
	justify-content: flex-start;
	align-items: center;
	border-left: 2px #fff solid;
}

section
{
	max-width: 950px;
	margin: auto; /* Permet de centrer le bloc */
	padding: 10px;
	display: flex;
	flex-direction: row;
}

#bloc_gauche_home
{
	width: 100%;
	padding: 0;
	margin: 0 25px 0 0;
	display: flex;
	flex-direction: column;
}

	#centrage_bouton
	{
		width: 100%;
		padding: 0;
		margin: 0;
		display: flex;
		flex-direction: row;
		justify-content: center;
	}
	
	#image_logofede
	{
		width: 100%;
		padding: 0;
		margin: 40px 0 10px 0;
	}

#bloc_news
{
	width: 100%;
	padding: 0;
	margin: 0 25px 0 0;
	display: flex;
	flex-direction: column;
}

#bloc_page_complete
{
	width: 100%;
	padding: 0;
	margin: 0;
	display: flex;
	flex-direction: column;
}

	#admin_photoblog
	{
		width: 50%;
		padding: 0;
		margin: 0 auto 0 auto;
		display: flex;
		flex-direction: column;
	}
	
	#image_gauche
	{
		width: 100%;
		padding: 0;
		margin: 5px 0 0 0;
	}
	
	#image_contact
	{
		width: 100%;
		padding: 0;
		margin: 5px 0 0 0;
	}

aside
{
	min-width: 255px;
	max-width: 255px;
	padding: 10px 0 10px 0;
	margin: 0;
	background-color: #b4b4b4;
}

					#bloc_actualites
					{
						width: 100%;
						margin: 0 0 15px 0;
						padding: 0;
						border: 1px #333 solid;
						display: flex;
						flex-direction: column;
						flex-shrink: 0;
					}
					
					#bloc_actualites:hover
					{
						background-color: #efefef;
						border: 1px #89cdcf solid;
					}
					
					#bloc_actualites:hover h3
					{
						color: #89cdcf;
					}
					
						#actu_top
						{
							width: 100%;
							margin: 0;
							padding: 0;
							display: flex;
							flex-direction: row;
							flex-shrink: 0;
						}
						
							#photo_news
							{
								width: 25%;
								margin: 0;
								padding: 0;
							}
						
							#texte_news
							{
								width: 75%;
								height: auto;
								margin: 0;
								padding: 15px;
								display: flex;
								flex-direction: column;
							}
						
						#actu_bottom
						{
							width: 100%;
							margin: 0;
							padding: 0;
							display: flex;
							flex-direction: row;
							justify-content: flex-end;
							flex-shrink: 0;
						}	
						
							#bouton_suite_news
							{
								width: 150px;
								margin: 0;
								flex-shrink: 0;
							}

#jaipeurdeschiens_news
{
	width: 255px;
	display: flex;
	flex-direction: column;
	flex-shrink: 0;
	margin: 0 0 10px 0;
	padding: 0;
}

#resume_news
{
	width: 255px;
	display: flex;
	flex-direction: column;
	flex-shrink: 0;
}

#reseaux_sociaux_big
{
	margin: 0 10px 0 10px;
	display: flex;
	flex-direction: row;
	justify-content: center;
}

#suite_news
{
	margin: 0 10px 10px 10px;
	display: flex;
	justify-content: center;
}

#ligne_pied
{	
	width: 100%;
	padding: 10px;
	border-top: 1px #b4b4b4 solid;
}

footer
{
	max-width: 950px;
	margin: auto; /* Permet de centrer le bloc */
}


/* Les écritures */

h1
{
	font-family: museo700;
	font-size: 48px;
	font-weight: normal;
	text-align: left;
	color: #e75012;
	line-height: 46px;
}

h2
{
	font-family: museo700;
	font-size: 42px;
	font-weight: normal;
	text-align: left;
	color: #d4d700;
	line-height: 44px;
	margin: 0;
}

header h3
{
	font-family: museo700;
	font-size: 24px;
	font-weight: normal;
	text-align: left;
	color: #333;
	line-height: 40px;
	margin-top: 10px;
}

section h3
{
	font-family: museo700;
	font-size: 26px;
	font-weight: normal;
	text-align: left;
	color: #d4d700;
	line-height: 30px;
	margin: 30px 0 0 0;
}

#bloc_news h3
{
	font-family: museo700;
	font-size: 24px;
	font-weight: normal;
	text-align: left;
	color: #d4d700;
	line-height: 25px;
	margin: 10px 0 0 0;
}

h4
{
	font-family: museo700;
	font-size: 24px;
	font-weight: normal;
	text-align: center;
	color: #fff;
}

#bloc_gauche_home h4
{
	font-family: museo700;
	font-size: 20px;
	font-weight: normal;
	text-align: left;
	color: #656565;
	line-height: 30px;
	margin: 30px 0 0 0;
}

aside h4
{
	font-family: museo700;
	font-size: 24px;
	font-weight: normal;
	text-align: center;
	margin: 0 0 10px 0;
	color: #333;
}

h5
{
	font-family: Arial, sans-serif;
	font-size: 14px;
	font-weight: bold;
	text-align: left;
	color: #e75012;
	margin-bottom: 0;
	padding: 0 10px 0 10px;
}

p
{
	font-family: Arial, sans-serif;
	font-size: 14px;
	font-weight: normal;
	letter-spacing: 1px;
	line-height: 23px;
	color: #000;
	text-align: justify;
	margin-top: 20px;
}

#image_logofede p
{
	font-family: Arial, sans-serif;
	font-size: 12px;
	font-weight: normal;
	letter-spacing: 1px;
	line-height: 20px;
	color: #000;
	text-align: left;
	margin: 15px 0 0 0;
}

.legende
{
	font-family: Arial, sans-serif;
	font-size: 11px;
	font-weight: normal;
	letter-spacing: 1px;
	line-height: 18px;
	color: #333;
	text-align: left;
	margin: 0 0 15px 0;
}

#bloc_skype p
{
	font-family: Arial, sans-serif;
	font-size: 14px;
	font-weight: normal;
	letter-spacing: 1px;
	line-height: 21px;
	color: #000;
	text-align: justify;
	margin-top: 15px;
}

aside p
{
	font-family: Arial, sans-serif;
	font-size: 12px;
	font-weight: normal;
	letter-spacing: 0;
	line-height: 19px;
	color: #000;
	text-align: justify;
	margin: 0 0 10px 0;
	padding: 5px 10px 0 10px;
}

footer p
{
	font-family: Arial, sans-serif;
	font-size: 12px;
	font-weight: normal;
	letter-spacing: 0;
	line-height: 19px;
	color: #666666;
	text-align: center;
	margin: 10px 0 0 0;
}

.surlignage
{
	font-weight: bold;
	color: #ff0000;
}

#titre_article p
{
	font-family: museo700;
	font-size: 24px;
	font-weight: normal;
	text-align: left;
	color: #d4d700;
	line-height: 25px;
	margin: 10px 0 0 0;
}

strong
{
	font-weight: bold;
}

i
{
	font-style: italic;
}


/* Les listes */

#infos_top ul
{
	list-style-type: none;
	padding: 0;
	margin: 6px 0 6px 0;
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
}

#infos_top li
{
	list-style-type: none;
	font-family: Arial, sans-serif;
	font-size: 12px;
	margin: 0 15px 0 0;
	padding: 0;
	display: flex;
	flex-direction: row;
	align-items: center;
}

#share_likes ul
{
	list-style-type: none;
	padding: 0;
	margin: 6px 0 6px 0;
	display: flex;
	flex-direction: row;
	justify-content: flex-start;
	align-items: flex-start;
	flex-wrap: wrap;
}

#share_likes li
{
	list-style-type: none;
	margin: 0 10px 0 0;
	padding: 0;
	display: flex;
	flex-direction: row;
}

#bloc_gauche_home ul
{
	list-style-type: none;
	padding: 0;
	margin: 5px 0 0 40px;
	display: flex;
	flex-direction: column;
}

#bloc_gauche_home li
{
	list-style-image: url('images/puce-verte-liste.png');
	font-family: Arial, sans-serif;
	font-size: 14px;
	font-weight: normal;
	letter-spacing: 0;
	line-height: 21px;
	color: #000;
	text-align: justify;
	margin: 0 12px 5px 12px;
	padding: 0;
}

aside ul
{
	width: 235px
	list-style-type: none;
	padding: 0;
	margin: 10px;
	display: flex;
	flex-direction: column;
}

aside li
{
	list-style-image: url('images/puce-antrhacite.png');
	font-family: Arial, sans-serif;
	font-size: 12px;
	font-weight: normal;
	letter-spacing: 0;
	line-height: 19px;
	color: #000;
	text-align: justify;
	margin: 0 12px 15px 12px;
	padding: 0;
}

#liste-articles li, #archives li
{
	list-style-type: none;
	list-style-image: none;
	font-family: Arial, sans-serif;
	font-size: 12px;
	font-weight: normal;
	letter-spacing: 0;
	line-height: 19px;
	color: #000;
	text-align: justify;
	margin: 0 2px 6px 2px;
	padding: 0;
}


/* Les liens */

#bloc_gauche_home a:link, #bloc_gauche_home a:visited
{
	color: #000;
	text-decoration: underline;
}

#bloc_gauche_home a:active, #bloc_gauche_home a:hover
{
	color: #000;
	text-decoration: none;
}

footer a:link, footer a:visited
{
	color: #666;
	text-decoration: underline;
}

footer a:active, footer a:hover
{
	color: #666;
	text-decoration: none;
}

aside a:link, aside a:visited
{
	color: #000;
	text-decoration: underline;
	font-weight: bold;
}

aside a:active, aside a:hover
{
	color: #000;
	text-decoration: none;
	font-weight: bold;
}

#suite_news a:link, #suite_news a:visited
{
	color: #fff;
	background-color: #333;
	text-decoration: none;
	transition: 0.2s;
}

#suite_news a:active, #suite_news a:hover
{
	color: #333;
	background-color: #fff;
	text-decoration: none;
}

.bouton_suite
{
	font-family: Arial, sans-serif;
	font-size: 12px;
	font-weight: bold;
	padding: 5px;
	border-radius: 0;
	border: 1px solid #b4b4b4;
}

.bouton_suite_news
{
	font-family: Arial, sans-serif;
	font-size: 12px;
	font-weight: bold;
	background-color: #333;
	color: #fff;
	border: 0;
	border-radius: 0;
	line-height: 20px;
	letter-spacing: 1px;
	text-align: center;
	margin: 0;
	padding: 4px 10px 0 10px;
	cursor: pointer;
}

.bouton_suite_news:link, .bouton_suite_news:visited
{
	color: #fff;
	background-color: #333;
	text-decoration: none;
	transition: 0.2s;
}

.bouton_suite_news:active, .bouton_suite_news:hover
{
	color: #333;
	background-color: #b4b4b4;
	text-decoration: none;
}

#liens_maj_sup
{
	display: flex;
	flex-direction: row;
	justify-content: flex-start;
}

#lien_supprimer
{
	margin: 5px 0 0 0;
	text-align: center;
}

.lien_supprimer
{
	font-family: Arial, sans-serif;
	font-size: 13px;
	font-weight: bold;
	text-align: center;
	padding: 5px 10px 5px 10px;
	margin: 20px 0 20px 0;
	height: 46px;
	width: 160px;
	background: #b92a25;
	color: #fff;
	border: 1px #fff solid;
	text-decoration: none;
	-moz-box-shadow: 2px 2px 7px 0px #656565;
	-webkit-box-shadow: 2px 2px 7px 0px #656565;
	-o-box-shadow: 2px 2px 7px 0px #656565;
	box-shadow: 2px 2px 7px 0px #656565;
}

#lien_supprimer a:link, #lien_supprimer a:visited
{
	padding: 5px 10px 5px 10px;
	margin: auto;
	height: 46px;
	width: 160px;
	transition: 0.2s;
	background: #b92a25;
	color: #fff;
	text-decoration: none;
}

#lien_supprimer a:active, #lien_supprimer a:hover
{
	padding: 5px 10px 5px 10px;
	margin: auto;
	height: 46px;
	width: 160px;
	background: #fff;
	color: #b92a25;
	text-decoration: none;
	border: 1px #b92a25 solid;
}

#lien_maj
{
	margin: 5px 20px 0 0;
	text-align: center;
}

.lien_maj
{
	font-family: Arial, sans-serif;
	font-size: 13px;
	font-weight: bold;
	text-align: center;
	padding: 5px 10px 5px 10px;
	margin: 20px 0 20px 0;
	height: 46px;
	width: 160px;
	background: #2e3136;
	color: #fff;
	border: 1px #fff solid;
	text-decoration: none;
	-moz-box-shadow: 2px 2px 7px 0px #656565;
	-webkit-box-shadow: 2px 2px 7px 0px #656565;
	-o-box-shadow: 2px 2px 7px 0px #656565;
	box-shadow: 2px 2px 7px 0px #656565;
}

#lien_maj a:link, #lien_maj a:visited
{
	padding: 5px 10px 5px 10px;
	margin: auto;
	height: 46px;
	width: 160px;
	transition: 0.2s;
	background: #2e3136;
	color: #fff;
	text-decoration: none;
}

#lien_maj a:active, #lien_maj a:hover
{
	padding: 5px 10px 5px 10px;
	margin: auto;
	height: 46px;
	width: 160px;
	background: #fff;
	color: #2e3136;
	text-decoration: none;
	border: 1px #2e3136 solid;
}

#lien_admin a:link, #lien_admin a:visited, h1 a:link, h1 a:visited, h4 a:link, h4 a:visited, #liste_pedigrees_crees a:link, #liste_pedigrees_crees a:visited
{
	color: #2e3136;
	text-decoration: underline;
}

#lien_admin a:active, #lien_admin a:hover, h1 a:active, h1 a:hover, h4 a:active, h4 a:hover, #liste_pedigrees_crees a:active, #liste_pedigrees_crees a:hover
{
	color: #2e3136;
	text-decoration: none;
}

#lien_admin a:link, #lien_admin a:visited, h1 a:link, h1 a:visited, h4 a:link, h4 a:visited, #liste_pedigrees_crees a:link, #liste_pedigrees_crees a:visited
{
	color: #2e3136;
	text-decoration: underline;
}

#lien_admin a:active, #lien_admin a:hover, h1 a:active, h1 a:hover, h4 a:active, h4 a:hover, #liste_pedigrees_crees a:active, #liste_pedigrees_crees a:hover
{
	color: #2e3136;
	text-decoration: none;
}

#liste-articles a:link, #archives a:link, #liste-articles a:visited, #archives a:visited
{
	color: #2e3136;
	text-decoration: underline;
}

#liste-articles a:active, #archives a:active, #liste-articles a:hover, #archives a:hover
{
	color: #2e3136;
	text-decoration: none;
}

#infos_top a:link, #infos_top a:visited
{
	color: #000;
	text-decoration: underline;
}

#infos_top a:active, #infos_top a:hover
{
	color: #000;
	text-decoration: none;
}

#bloc_gauche_home  li a:link, #bloc_gauche_home  li a:visited
{
	color: #000;
	text-decoration: underline;
}

#bloc_gauche_home  li a:active, #bloc_gauche_home  li a:hover
{
	color: #000;
	text-decoration: none;
}

			#bouton_calendrier
			{
				width: 170px;
				height: 36px;
				padding: 2px 0 0 0;
				border: 1px solid #baceb2;
				margin: 0;
				background-color: #89cdcf;
				display: flex;
				flex-direction: row;
				justify-content: center;
				align-items: center;
				font-family: museo700;
				font-size: 24px;
				font-weight: normal;
				text-decoration: none;
				letter-spacing: 1px;
				text-align: center;
				color: #fff;
				cursor: pointer;
			}

			#bouton_calendrier:hover
			{
				background-color: #fff;
				border: 1px solid #baceb2;
				color: #3ea995;
			}

/* Les images */

section img
{
	max-width: 100%;
	flex-shrink: 0;
	padding: 0;
	margin: 15px 0 5px 0;
	clear: both;
}

aside img
{
	max-width: 100%;
	flex-shrink: 0;
	padding: 0;
	margin: 10px 0 10px 0;
	clear: both;
	border-left: 1px #b4b4b4 solid;
	border-right: 1px #b4b4b4 solid;
}

#reseaux_sociaux_big img
{
	width: 50px;
	height: auto;
	padding: 0;
	margin: 10px 20px 10px 10px;
	border: 0;
	opacity: 1.0;
    filter: alpha(opacity=100); /* For IE8 and earlier */
}

#reseaux_sociaux_big img:hover
{
	width: 50px;
	height: auto;
	padding: 0;
	margin: 10px 20px 10px 10px;
	border: 0;
	opacity: 0.7;
    filter: alpha(opacity=70); /* For IE8 and earlier */
	transition: 0.2s;
}

#bloc_skype img
{
	width: 100px;
	height: 45px;
	flex-shrink: 0;
	padding: 0;
	margin: 15px 15px 0 0;
	float: left;
	clear: none;
}

#image_logofede img
{
	width: 130px;
	height: auto;
	float: left;
	padding: 0 30px 0 0;
	margin: 0;
	flex-shrink: 0;
}

#admin_photoblog img
{
	width: 100%;
	flex-shrink: 0;
	padding: 0;
	margin: 15px 0 15px 0;
	clear: both;
}

#image_gauche img
{
	width: 50%;
	height: auto;
	float: left;
	padding: 0 15px 0 0;
	margin: 20px 0 7px 0;
	flex-shrink: 0;
}

#image_contact img
{
	width: 180px;
	height: auto;
	float: left;
	padding: 0 15px 0 0;
	margin: 20px 0 7px 0;
	flex-shrink: 0;
}


/* Formulaire */

#formulaire_login
{
	max-width: 350px;
	margin: auto;
	padding: 0 15px 10px 15px;
}

#formulaire_news
{
	width: 100%;
	padding: 10px 10px 10px 10px;
	margin: 10px 0 0 0;
	background-color: #89cdcf;
}

#formulaire_login p
{
	text-align: right;
}

.champtexte
{
	height: 30px;
	width: 100%;
	padding : 5px;
	border-radius: 3px;
	border: 1px solid #252729;
	margin: 0 0 10px 0;
}

#search .champtexte_search
{
	height: 30px;
	width: 75%;
	padding: 5px;
	border-radius: 3px;
	border: 1px solid #333;
	margin: 0 0 10px 0;
}

.champ_annee
{
	height: 30px;
	width: 50px;
	padding : 5px;
	border-radius: 3px;
	border: 1px solid #252729;
	margin: 0 0 10px 0;
}

.champtexte_bigger
{
	height: 30px;
	width: 300px;
	padding: 5px;
	border-radius: 3px;
	border: 1px solid #252729;
	margin: 0 0 10px 0;
}

.zone_texte
{
	width: 100%;
	padding: 5px;
	border-radius: 3px;
	border: 1px solid #252729;
	margin: 0 0 10px 0;
}

.liste_deroulante
{
	width: 300px;
	padding: 5px;
	border-radius: 3px;
	border: 1px solid #252729;
	margin: 0 0 10px 0;
}

.liste_deroulante_petite
{
	width: 120px;
	padding: 5px;
	border-radius: 3px;
	border: 1px solid #252729;
	margin: 0 0 10px 0;
}

input[type="submit"], #search input[type="submit"]
{
	cursor: pointer;
}

.bouton_envoyer
{
	height: 30px;
	width: 200px;
	padding: 5px;
	border-radius: 3px;
	border: 1px solid #333;
	margin: 10px 0 10px 0;
	background-color: #333;
	color: #fff;
	font-family: Arial, sans-serif;
	font-size: 14px;
	font-weight: bold;
}

.bouton_envoyer_search
{
	height: 30px;
	width: 22%;
	padding: 5px;
	border-radius: 3px;
	border: 1px solid #333;
	margin: 0 0 10px 0;
	background-color: #333;
	color: #fff;
	font-family: Arial, sans-serif;
	font-size: 14px;
	font-weight: bold;
}

.bouton_envoyer:link, .bouton_envoyer:visited, .bouton_envoyer_search:link, .bouton_envoyer_search:visited
{
	background-color: #333;
	color: #fff;
}

.bouton_envoyer:active, .bouton_envoyer:hover, .bouton_envoyer_search:active, .bouton_envoyer_search:hover
{
	background-color: #fff;
	color: #252729;
}


/* TABLEAUX */

table
{
    width: 100%;
	border-collapse: collapse;
	margin: 0 0 30px 0;
	padding: 0;
}

th
{
    border: 1px solid #ccc;
	background-color: #000;
	font-family: museo700;
	font-size: 14px;
	font-weight: 300;
	letter-spacing: 1px;
	color: #fff;
	text-align: left;
	padding: 5px 10px 5px 10px;
}

#table_articles tbody td
{
	border: 1px #ccc solid;
	font-family: Arial, sans-serif;
	font-size: 14px;
	font-weight: normal;
	color: #000;
	text-align: left;
	padding: 5px 10px 5px 10px;
	margin: 0;
	height: 40px;
}

#table_articles tbody tr
{
	cursor: pointer;
}

#table_articles tbody tr:hover, #table_articles tbody tr:focus
{
	background-color: #89cdcf; /* turquoise */
}


/* Lignes séparatrices invisible */

hr
{
    clear: both;
	width: 100%;
    margin: 10px 0 20px 0;
    padding: 0;
    border: 0;
}

.invisible2
{
	clear: both;
	width: 100%;
	margin: 0 0 80px 0;
	padding: 0;
	border: 0;
}

.invisible3
{
	clear: both;
	width: 100%;
	margin: 0 0 40px 0;
	padding: 0;
	border: 0;
}

.dessous_image
{
	clear: both;
}

.sous_article
{
	clear: both;
	width: 100%;
	margin: 15px 0 25px 0;
	border: 0;
	border-bottom: 1px dashed #c2b190;
}

.invisible
{
	clear: both;
	width: 100%;
	margin: 0 0 20px 0;
	border: 0;
	border-bottom: 0 ;
}


/* Navigation menu responsive */

@-ms-viewport {
	width: device-width;
}

@viewport {
	width: device-width;
}

ul.topnav
{
	list-style-type: none;
	margin: 0;
	padding: 0;
	overflow: hidden;
	background-color: #89cdcf;
}

ul.topnav li
{
	float: left;
}

ul.topnav li a
{
	display: inline-block;
	color: #fff;
	text-align: center;
	padding: 8px 19px;
	text-decoration: none;
	transition: 0.2s;
	font-family: museo500;
	font-size: 20px;
	font-weight: normal;
	letter-spacing : 0;
	border-right: 2px #fff solid;
}

ul.topnav li a:hover
{
	background-color: #fff;
	color: #89cdcf;
}

ul.topnav li.icon
{
	display: none;
}

@media screen and (max-width:700px) {
  ul.topnav li:not(:first-child) {display: none;}
  ul.topnav li.icon {
    float: right;
    display: inline-block;
  }
}

@media screen and (max-width:700px) {
  ul.topnav.responsive {position: relative;}
  ul.topnav.responsive li.icon {
    position: absolute;
    right: 0;
    top: 0;
  }
  ul.topnav.responsive li {
    float: none;
    display: inline;
  }
  ul.topnav.responsive li a {
    display: block;
    text-align: left;
  }
}


/* Media queries */

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

	#entete_site
	{
		width: 100%;
		margin: auto; /* Permet de centrer le bloc */
		padding: 10px;
		display: flex;
		flex-direction: column;
	}
	
	section
	{
		width: 100%;
		margin: auto; /* Permet de centrer le bloc */
		padding: 10px;
		display: flex;
		flex-direction: column;
	}

	#bloc_gauche_home
	{
		width: 100%;
		padding: 0;
		margin: 0;
		display: flex;
		flex-direction: column;
	}

	aside
	{
		width: 100%;
		max-width: 100%;
		padding: 10px;
		margin: 20px 0 0 0;
		background-color: #b4b4b4;
		display: flex;
		flex-direction: column;
		flex-shrink: 0;
	}
	
	#jaipeurdeschiens_news
	{
		width: 100%;
		display: flex;
		flex-direction: column;
		flex-shrink: 0;
		margin: 0 0 10px 0;
		padding: 0;
	}
	
	#resume_news
	{
		width: 100%;
		display: flex;
		flex-direction: column;
		flex-shrink: 0;
	}
	
	#bloc_skype
	{
		width: 100%;
		flex-shrink: 0;
	}
	
	#ligne_pied
	{	
		width: 100%;
		padding: 0 10px 10px 10px;
		border-top: 1px #b4b4b4 solid;
	}
	
	#admin_photoblog
	{
		width: 100%;
		padding: 0;
		margin: 0;
		display: flex;
		flex-direction: column;
	}

	footer
	{
		max-width: 100%;
		margin: auto; /* Permet de centrer le bloc */
	}
	
	h1
	{
		font-family: museo700;
		font-size: 42px;
		font-weight: normal;
		text-align: left;
		color: #e75012;
		line-height: 46px;
	}

	h2
	{
		font-family: museo700;
		font-size: 38px;
		font-weight: normal;
		text-align: left;
		color: #d4d700;
		line-height: 40px;
		margin: 0;
	}

	header h3
	{
		font-family: museo700;
		font-size: 20px;
		font-weight: normal;
		text-align: left;
		color: #333;
		line-height: 40px;
		margin-top: 10px;
	}

	section h3
	{
		font-family: museo700;
		font-size: 24px;
		font-weight: normal;
		text-align: left;
		color: #d4d700;
		line-height: 30px;
		margin: 30px 0 0 0;
	}

}


@media screen and (max-width:600px) {
	
	#image_gauche img
	{
		width: 100%;
		height: auto;
		padding: 0;
		margin: 0 0 15px 0;
		flex-shrink: 0;
	}

}


@media screen and (max-width:500px) {

	#infos_top
	{
		width: 100%;
		display: flex;
		flex-direction: row;
		justify-content: center;
		align-items: flex-end;
		flex-wrap: wrap;
	}

}

@media screen and (max-width:300px) {

	#image_contact img
	{
		width: 130px;
		height: auto;
		float: left;
		padding: 0 15px 0 0;
		margin: 20px 0 7px 0;
		flex-shrink: 0;
	}
}