﻿/* **************************** */
/*         Tout le site         */
/* **************************** */

*{
	box-sizing: border-box;
	margin:0px;
	padding:0px;
	font-family: "Segoe UI", Kalinga, Helvetica, verdana, Arial, sans-serif;
}

@media screen and (max-width: 685px) { /* petit ecran */
	html, body{
	margin:0;
	padding:0;
	}
}

@media screen and (min-width: 686px) and (max-width: 1142px) { /* moyen ecran */
	html, body{
	margin:0;
	padding:0;
	}
}

@media screen and (min-width: 1143px) { /* grand ecran */
	html, body{
	margin:0;
	padding:0;
	}
	
}	

body{
	margin:auto;
	width: 100%;
	font-family: "Segoe UI", Kalinga, Helvetica, verdana, Arial, sans-serif;
	font-size: 15px;
}

a{    /* liens de couleur orange */
	text-decoration: none;
	color: #e15204;
}

a:visited {
	text-decoration: none;
	color: #e15204;
}

a:hover {
	text-decoration: underline;
	color: #e15204;
}

a:focus, a:active {
	text-decoration: none;
	color: #e15204;
}




/* **************************** */
/*           Global            */
/* **************************** */

#module-bandeau{
	float:left;
	width: 100%;
	height: 149px;
	background: url('https://www.mer-littoral.org/images/fond-bandeau.png') center no-repeat #e2eefe;
}

@media screen and (max-width: 685px) { /* petit ecran */
	#module-menu-haut{
	float: left;
	width: 100%;
	min-height: 48px;
	background: #104498;
	border-top: 1px solid #ffffff;
	border-bottom: 1px solid #ffffff;
	box-shadow: 0px 8px 8px 0px #585858;
	}
}

@media screen and (min-width: 686px) and (max-width: 1142px) { /* moyen ecran */
	#module-menu-haut{
	float: left;
	width: 100%;
	min-height: 48px;
	background: #104498;
	border-top: 1px solid #ffffff;
	border-bottom: 1px solid #ffffff;
	box-shadow: 0px 8px 8px 0px #585858;
	}
}

@media screen and (min-width: 1143px) { /* grand ecran */
	#module-menu-haut{
	float: left;
	width: 100%;
	height: 48px;
	background: #104498;
	border-top: 1px solid #ffffff;
	border-bottom: 1px solid #ffffff;
	box-shadow: 0px 8px 8px 0px #585858;
	}
}	

#module-chemin-de-fer{
	float: left;
	width: 100%;
	overflow: hidden;
}

.module-titre{
	float: left;
	width: 100%;
	overflow: hidden;
}

.module-galerie{
	float: left;
	width: 100%;
	overflow: hidden;
}

.module-corps{
	float: left;
	width: 100%;
	overflow: hidden;
}

.module-texte{
	float: left;
	width: 100%;
	overflow: hidden;
}

#module-auteurs{
	float: left;
	width: 100%;
	overflow: hidden;
}

#module-comment-citer{
	float: left;
	width: 100%;
	overflow: hidden;
}

@media screen and (max-width: 685px) { /* petit ecran */
	.module-publicite{
	float: left;
	width: 100%;
	margin-top: 20px;
	margin-bottom : 20px;
	overflow: hidden;
	}
}

@media screen and (min-width: 686px) and (max-width: 1142px) { /* moyen ecran */
	.module-publicite{
	float: left;
	width: 100%;
	margin-top: 20px;
	margin-bottom : 20px;
	overflow: hidden;
	}
}

@media screen and (min-width: 1143px) { /* grand ecran */
	.module-publicite{
	float: left;
	width: 100%;
	margin-top: 30px;
	margin-bottom : 20px;
	overflow: hidden;
	}
}	

#module-bandeau-auteur{
	float: left;
	width: 100%;
	margin-top: 50px;
	margin-bottom: 65px;
	min-height: 132px;
	padding-top: 10px;
	background: #f1f3f7;
}

#module-pied-page-haut{
	float: left;
	width: 100%;
	min-height: 20px;
	border-top: 1px solid #000000;
	padding-top: 30px;
	padding-bottom: 30px;
	background: #104498;
}

#module-pied-page-milieu{
	float: left;
	width: 100%;
	min-height: 20px;
	padding-top: 30px;
	padding-bottom: 30px;
	background: #03255e;
}

#module-pied-page-bas{
	float: left;
	width: 100%;
	min-height: 20px;
	padding-top: 30px;
	padding-bottom: 30px;
	background: #061837;
}

@media screen and (max-width: 685px) { /* petit ecran */
	.global-centre{
	position: relative;
    margin: 0 auto;
	width:100%;
	padding-left:20px;
	padding-right:20px;
	min-height: 20px;
	}
}

@media screen and (min-width: 686px) and (max-width: 1142px) { /* moyen ecran */
	.global-centre{
	position: relative;
    margin: 0 auto;
	width:100%;
	padding-left:20px;
	padding-right:20px;
	min-height: 20px;
	overflow : visible;
	}
}

@media screen and (min-width: 1143px) { /* grand ecran */
	.global-centre{
	position: relative;
    margin: 0 auto;
	width: 1128px;
	min-height: 20px;
	}
}	

/* **************************** */
/*           Bandeau            */
/* **************************** */

#global-bandeau{
}

@media screen and (max-width: 685px) { /* petit ecran */
	#bandeau{
	position: absolute;
	height: 148px;
	width: 100%;
	margin-left: 0px;
	left: 0px;
	top: 1px;
	background: url('https://www.mer-littoral.org/images/bandeau-petit.png') top left no-repeat;
	background-size: contain;
	}
}

@media screen and (min-width: 686px) and (max-width: 1142px) { /* moyen ecran */
	#bandeau{
	position: absolute;
	height: 148px;
	width: 100%;
	margin-left: 0px;
	left: 0px;
	top: 1px;
	background: url('https://www.mer-littoral.org/images/bandeau.png') top left no-repeat;
	}
}

@media screen and (min-width: 1143px) { /* grand ecran */
	#bandeau{
	position: absolute;
	height: 148px;
	width: 100%;
	margin-left: 0px;
	left: 0px;
	top: 1px;
	background: url('https://www.mer-littoral.org/images/bandeau.png') top left no-repeat;
	}
}

#bandeau img{
	height: 100%;
	width: 100%;
}

#titre-bandeau{
	position: absolute;
	height: 86px;
	width: 433px;
	margin-left: 0px;
	left: 224px;
	top: 32px;
	display:none;
}

/* **************************** */
/*          Menu haut           */
/* **************************** */

#module-menu-haut{
}

@media screen and (max-width: 685px) { /* petit ecran */
	.drapeau{
		display: block;
		clear : both;
		width: 100%;
		height: 28px;
		margin-right: 120px;
		padding-top: 4px;
		border-bottom: 1px solid #ffffff;
		list-style-type: none;
	}
}

@media screen and (min-width: 686px) and (max-width: 1142px) { /* moyen ecran */
	.drapeau{
		float:left;
		height: 30px;
		width: 35px;
		padding-top: 4px;
		list-style-type: none;
	}
}

@media screen and (min-width: 1143px) { /* grand ecran */
	.drapeau{
		float:left;
		height: 30px;
		width: 35px;
		margin-left: 12px;
		margin-right: 205px;
		padding-top: 4px;
		list-style-type: none;
	}
}	

.drapeau img{
	border: 1px solid #a8b7ce;  /* faux blanc */
}

@media screen and (max-width: 685px) { /* petit ecran */
	ul.menu-haut{
		float:left;
		width: 100%;
		margin-top: 0px;
		padding-top: 10px;
		padding-bottom: 10px;
		list-style-type: none;
	}
	
	li.menu-haut{
		display: block;
		font-size: 16px;
		border-top: 1px solid #ffffff;
	}

	li.menu-haut:nth-child(2){
		border-top: 0px;
	}
}

@media screen and (min-width: 686px) and (max-width: 1142px) { /* moyen ecran */
	ul.menu-haut{
		float:left;
		width:100%;
		margin: 0px;
		padding-top: 10px;
		text-align:center;
	}
	
	li.menu-haut{
		display: inline;
		font-size: 18px;
		margin-right: 28px; /*66px;*/
	}
	
	li.menu-haut:last-child{
		margin-right: 0px;
	}
}

@media screen and (min-width: 1143px) { /* grand ecran */
	ul.menu-haut{
		float:left;
		margin: 0px;
		padding-top: 10px;
	}
	
	li.menu-haut{
		display: inline;
		font-size: 18px;
		margin-right: 66px;
	}
}	

.menu-haut a {
	text-decoration: none;
	color: #ffffff;
}

.menu-haut a:visited {
	text-decoration: none;
	color: #ffffff;
}

.menu-haut a:hover {
	text-decoration: underline;
	color: #ffffff;
}

.menu-haut a:focus, a:active {
	text-decoration: none;
	color: #e15204;
}

/* **************************** */
/*        Chemin de fer         */
/* **************************** */

@media screen and (max-width: 685px) { /* petit ecran */
	#div-chemin-de-fer{
		float: left;
		width: 100%;
		min-height: 82px;
		margin-top: 17px;
		padding-bottom: 10px;
		border-bottom: 1px solid #4262a2;
	}
	
	ul.chemin-de-fer{
		margin-top: 40px;
		margin-left: 0px;
	}
}

@media screen and (min-width: 686px) and (max-width: 1142px) { /* moyen ecran */
	#div-chemin-de-fer{
		float: left;
		width:100%;
		height: 82px;
		margin-top: 17px;
		margin-left: 0px;
		margin-right: 20px;
		border-bottom: 1px solid #4262a2;
	}
	
	ul.chemin-de-fer{
		margin-top: 22px;
		margin-left: 6px;
	}
}

@media screen and (min-width: 1143px) { /* grand ecran */
	#div-chemin-de-fer{
		float: left;
		width: 1104px;
		height: 82px;
		margin-top: 17px;
		margin-left: 12px;
		margin-right: 12px;
		border-bottom: 1px solid #4262a2;
	}
	
	ul.chemin-de-fer{
		margin-top: 22px;
		margin-left: 6px;
	}
}	

li.chemin-de-fer{
	display: inline;
	font-size: 15px;
}

@media screen and (max-width: 685px) { /* petit ecran */
	li.chemin-de-fer:first-child{
		display:inline-block;
		display:block;
		position: absolute;
		top:15px;
		left:20px;
		width:175px;
		padding-left: 20px;
		background: url('https://www.mer-littoral.org/images/fleche-gauche.png') left center no-repeat;
	}
}

@media screen and (min-width: 686px) and (max-width: 1142px) { /* moyen ecran */
	li.chemin-de-fer:first-child{
		display:inline-block;
		width:175px;
		padding-left: 20px;
		background: url('https://www.mer-littoral.org/images/fleche-gauche.png') left center no-repeat;
	}
}

@media screen and (min-width: 1143px) { /* grand ecran */
	li.chemin-de-fer:first-child{
		display:inline-block;
		width:175px;
		padding-left: 20px;
		background: url('https://www.mer-littoral.org/images/fleche-gauche.png') left center no-repeat;
	}
}	

li.chemin-de-fer:nth-child(2){
	background: url('https://www.mer-littoral.org/images/maison.png') left 0px no-repeat;
	padding-left: 25px;
}

@media screen and (max-width: 685px) { /* petit ecran */
	li.chemin-de-fer:last-child{
		float: right;
		display:block;
		position: absolute;
		top:15px;
		right:20px;
		margin-right: 6px;
		padding-right: 20px;
		background: url('https://www.mer-littoral.org/images/fleche-droite.png') right center no-repeat;
	}
}

@media screen and (min-width: 686px) and (max-width: 1142px) { /* moyen ecran */
	li.chemin-de-fer:last-child{
		display:inline-block;
		float: right;
		margin-right: 6px;
		padding-right: 20px;
		background: url('https://www.mer-littoral.org/images/fleche-droite.png') right center no-repeat;
	}
}

@media screen and (min-width: 1143px) { /* grand ecran */
	li.chemin-de-fer:last-child{
		float: right;
		margin-right: 6px;
		padding-right: 20px;
		background: url('https://www.mer-littoral.org/images/fleche-droite.png') right center no-repeat;
	}
}	

.chemin-de-fer{     /* couleur du texte dans le chemin de fer */
	color: #e15204;
}

.texte-bleu{      /* couleur du texte de la page active dans le chemin de fer */
	color: #104498;
}

.chemin-de-fer a {
	text-decoration: none;
	list-style: none;
	color: #e15204;
}
.chemin-de-fer a:visited {
	text-decoration: none;
	color: #e15204;
}
.chemin-de-fer a:hover {
	text-decoration: underline;
	color: #e15204;
}
.chemin-de-fer a:focus{
	text-decoration: none;
	color: #e15204;
}
.chemin-de-fer a:active {
	text-decoration: none;
	color: #e15204;
}

/* **************************** */
/*             Page             */
/* **************************** */

#global-page{
}

@media screen and (max-width: 685px) { /* petit ecran */
.colonne-1128{	/* 1 colonne unique */
	float: left;
	width: 100%;/*1104px*/
	min-height: 20px;
}

.colonne-564{	/* 2 colonnes de même taille */
	float: left;
	width:100%;
	min-height: 20px;
}

.colonne-564-auteur{	/* 2 colonnes de même taille */
	float: left;
	width: 100%;
	margin-left: 12px;
	margin-right: 12px;
	margin-top: 10px;
	margin-bottom: 18px;
	min-height: 20px;
}
.colonne-752{      /* 1 colonne large à utiliser avec 1 colonne étroite */
	float: left;
	min-height: 20px;
	margin-bottom:20px;
}

.colonne-376{      /* 1 colonne étroite à utiliser avec 1 colonne large */
	float: left;
	min-height: 1px;
	padding-top: 20px;
}
.colonne-titre-auteur{	/* 1 colonne unique */
	float: left;
	width: 100%;
	margin-top:5px;
	min-height: 20px;
}

.colonne-282{	/* 4 colonnes de même taille */
	float: left;
	margin-left:12px;
	margin-right:12px;
	min-height: 20px;
}
}

@media screen and (min-width: 686px) and (max-width: 1142px) { /* moyen ecran */
.colonne-1128{	/* 1 colonne unique */
	float: left;
	width: 100%;
	min-height: 20px;
}

.colonne-564{	/* 2 colonnes de même taille */
	float: left;
	width:100%;
	height:auto;
	min-height: 20px;
}
.colonne-564-auteur{	/* 2 colonnes de même taille */
	float: left;
	width: 100%;
	margin-left: 12px;
	margin-right: 12px;
	margin-top: 10px;
	margin-bottom: 18px;
	min-height: 20px;
}
.colonne-752{      /* 1 colonne large à utiliser avec 1 colonne étroite */
	float: left;
	min-height: 20px;
}

.colonne-376{      /* 1 colonne étroite à utiliser avec 1 colonne large */
	float: left;
	min-height: 20px;
}
.colonne-titre-auteur{	/* 1 colonne unique */
	float: left;
	width: 100%;
	margin-top:5px;
	min-height: 20px;
}

.colonne-282{	/* 4 colonnes de même taille */
	float: left;
	margin-left:12px;
	margin-right:12px;
	min-height: 20px;
}
}

@media screen and (min-width: 1143px) { /* grand ecran */
.colonne-1128{	/* 1 colonne unique */
	float: left;
	width: 1104px;
	margin-left: 12px;
	margin-right: 12px;
	min-height: 20px;
}

.colonne-1128-sm{
	float: left;
	width: 1128px;
	min-height: 10px; 
	margin: 0px;
	padding: 0px;
}

.colonne-564{	/* 2 colonnes de même taille */
	float: left;
	width: 540px;
	margin-left: 12px;
	margin-right: 12px;
	min-height: 20px;
}
.colonne-564-auteur{	/* 2 colonnes de même taille */
	float: left;
	width: 540px;
	margin-left: 12px;
	margin-right: 12px;
	margin-top: 10px;
	margin-bottom: 18px;
	min-height: 20px;
}
.colonne-752{      /* 1 colonne large à utiliser avec 1 colonne étroite */
	float: left;
	width: 728px;
	margin-left: 12px;
	margin-right: 12px;
	min-height: 20px;
}

.colonne-376{      /* 1 colonne étroite à utiliser avec 1 colonne large */
	float: left;
	width: 352px;
	margin-left:12px;
	margin-right:12px;
	padding-left:16px;
	min-height: 20px;
}
.colonne-titre-auteur{	/* 1 colonne unique */
	float: left;
	width: 1104px;
	margin-left:12px;
	margin-right:12px;
	margin-top:5px;
	min-height: 20px;
}

.colonne-282{	/* 4 colonnes de même taille */
	float: left;
	width: 258px;
	margin-left:12px;
	margin-right:12px;
	min-height: 20px;
}
}	

/* **************************** */
/*      Photos de la fiche      */
/* **************************** */

@media screen and (max-width: 685px) { /* petit ecran */
	.div-img-540x389{     /* conteneur de la photo + légende principal */
	float: left;
	width: 100%;
}

.div-img-540x389 img{     /* photo principale */
	float: left;
	width: 100%;
	height: auto;
}

.div-img-258x185-gauche{
	float: left;
	width: 49%;
	height: auto;
}

.div-img-258x185-droite{
	float: left;
	margin-left: 2%;
	width: 49%;
	height: auto;
}

.div-img-258x185-gauche img, .div-img-258x185-droite img{
	float: left;
	width: 100%;
	height: auto;
}

.div-img-vide-258x185{
	float: left;
	width: 100%;
	height: auto;
	background: #f1f3f7;
}
}

@media screen and (min-width: 686px) and (max-width: 1142px) { /* moyen ecran */
	.div-img-540x389{     /* conteneur de la photo + légende principal */
	float: left;
	width: 100%;
}

.div-img-540x389 img{     /* photo principale */
	float: left;
	width: 100%;
	height: auto;
}

.div-img-258x185-gauche{
	float: left;
	width: 49%;
	height: auto; /* */
}

.div-img-258x185-droite{
	float: left;
	margin-left: 2%;
	width: 49%;
	height: auto; /* */
}

.div-img-258x185-gauche img, .div-img-258x185-droite img{
	float: left;
	width: 100%;
	height: auto;
}

.div-img-vide-258x185{
	float: left;
	width: 100%;
	height: auto;
	background: #f1f3f7;
}
}

@media screen and (min-width: 1143px) { /* grand ecran */
	.div-img-540x389{     /* conteneur de la photo + légende principal */
	float: left;
	width: 540px;
	height: 409px;
}

.div-img-540x389 img{     /* photo principale */
	float: left;
	width: 540px;
	height: 389px;
}

.div-img-258x185-gauche{
	float: left;
	width: 258px;
	height: 203px;
}

.div-img-258x185-droite{
	float: left;
	margin-left: 24px;
	width: 258px;
	height: 205px;
}

.div-img-258x185-gauche img, .div-img-258x185-droite img{
	float: left;
	width: 258px;
	height: 185px;
}
.div-img-vide-258x185{
	float: left;
	width: 258px;
	height: 185px;
	background: #f1f3f7;
}
}

/* **************************** */
/*      Bandeau auteur          */
/* **************************** */

#module-bandeau-auteur{
}

@media screen and (max-width: 685px) { /* petit ecran */
	.img-auteur{
	float: left;
	width: 10%;
	height: auto;
}

.presentation-auteur{
	float: left;
	width: 446px;
	width: 88%;
	min-height: 70px;
	padding-left: 2%;
}
}

@media screen and (min-width: 686px) and (max-width: 1142px) { /* moyen ecran */
	.img-auteur{
	float: left;
	width: 70px;
	width: 10%;
	height: auto;
}

.presentation-auteur{
	float: left;
	width: 446px;
	width: 88%;
	min-height: 70px;
	padding-left: 2%;
}
}

@media screen and (min-width: 1143px) { /* grand ecran */
	.img-auteur{
	float: left;
	width: 70px;
	height: 70px;
}

.presentation-auteur{
	float: left;
	width: 446px;
	min-height: 70px;
	padding-left: 24px;
}
}	

/* **************************** */
/*        Pied de page          */
/* **************************** */

@media screen and (max-width: 685px) { /* petit ecran */
	#module-pied-page-milieu .colonne-282{	/* 4 colonnes de même taille */
	float: left;
	margin-left:12px;
	margin-right:12px;
	min-height: 20px;
}

#module-pied-page-milieu .colonne-282:nth-child(1){
	width: 40%;
}

#module-pied-page-milieu .colonne-282:nth-child(2){
	width: 45%;
}

#module-pied-page-milieu .colonne-282:nth-child(3){
	width: 40%;
}

#module-pied-page-milieu .colonne-282:nth-child(4){
	width: 45%;
}
.colonne-pied-page{
	column-count: 2;
	margin-left: 12px;
	margin-right: 12px;
}
}

@media screen and (min-width: 686px) and (max-width: 1142px) { /* moyen ecran */
	#module-pied-page-milieu .colonne-282{	/* 4 colonnes de même taille */
	float: left;
	margin-left:12px;
	margin-right:12px;
	min-height: 20px;
}

#module-pied-page-milieu .colonne-282:nth-child(1){
	width: 50%;
}

#module-pied-page-milieu .colonne-282:nth-child(2){
	width: 35%;
}

#module-pied-page-milieu .colonne-282:nth-child(3){
	width: 50%;
}

#module-pied-page-milieu .colonne-282:nth-child(4){
	width: 35%;
}
.colonne-pied-page{
	column-count: 3;
	margin-left: 12px;
	margin-right: 12px;
}
}

@media screen and (min-width: 1143px) { /* grand ecran */
	.colonne-pied-page{
	column-count: 4;
	margin-left: 12px;
	margin-right: 12px;
}
}	

#module-pied-page-haut{
}

#module-pied-page-milieu{
}

#module-pied-page-bas{
}

ul.menu-pied-page{
	list-style: none;
}

li.menu-pied-page{
	font-size: 15px;
	background: url('https://www.mer-littoral.org/images/puce-bleu.png') left 7px no-repeat;
	padding-left: 25px;	
}

li.menu-pied-page a:link{
	text-decoration: none;
	color: #ffffff;
}


 li.menu-pied-page a:visited{
	text-decoration: none;
	color: #ffffff;
}

li.menu-pied-page a:hover{
	text-decoration: underline;
	color: #ffffff;
}


li.menu-pied-page a:active{
	text-decoration: underline;
	color: #ffffff;
}

/* **************************** */
/*            Textes            */
/* **************************** */

.titre{
	float: left;
	width: 100%;
	min-height: 90px;
	padding-top: 20px;
	/*background: #00aa00;*/
}

.texte{
	float: left;
	width: 982px;
}

h1, h2{
	float: left;
	font-size: 22px;
	font-weight: 600;
	color:#104498;
	margin-top:5px;
	clear: both;
}

h1{
	font-size: 26px;
}

@media screen and (max-width: 685px) { /* petit ecran */
	h2{
	margin-bottom: 20px;
}
}

@media screen and (min-width: 686px) and (max-width: 1142px) { /* moyen ecran */
	h2{
	margin-bottom: 20px;
}
}

@media screen and (min-width: 1143px) { /* grand ecran */
	h2{
	padding-bottom: 20px;
}
}	

h3, h4{
	font-size: 20px; /*18*/
	font-weight: 600;
	color:#104498;
	margin-top:40px;
	margin-bottom:20px;
	clear: both;
}

.h3-auteur{
	font-size: 16px;
	color:#104498;
	margin-top:0px;
	margin-bottom:10px;
	clear: both;
}

@media screen and (max-width: 685px) { /* petit ecran */
p{
	font-size: 16px;
	text-align: justify;
	color: #3b3b3b;
	margin-bottom:10px;
}

.texte-blanc-centre{
	font-size: 16px;
	text-align: center;
	color: #ffffff;
	margin-bottom:10px;
}
.legende{
	float: left;
	font-size: 12px;
	color: #375797;
	padding-bottom:20px;
}

.copy-map{
	float: left;
	font-size: 12px;
	color: #375797;
}
}

@media screen and (min-width: 686px) and (max-width: 1142px) { /* moyen ecran */
p{
	font-size: 15px;
	text-align: justify;
	color: #3b3b3b;
	margin-bottom:10px;
}

.texte-blanc-centre{
	font-size: 15px;
	text-align: center;
	color: #ffffff;
	margin-bottom:10px;
}
.legende{
	float: left;
	font-size: 12px;
	color: #375797;
	padding-bottom:20px;
}

.copy-map{
	float: left;
	font-size: 14px;
	color: #375797;
}
}

@media screen and (min-width: 1143px) { /* grand ecran */
p{
	font-size: 15px;
	text-align: justify;
	color: #3b3b3b;
	margin-bottom:10px;
}

.texte-blanc-centre{
	font-size: 15px;
	text-align: center;
	color: #ffffff;
	margin-bottom:10px;
}
.legende{
	float: left;
	font-size: 12px;
	color: #375797;
}

.copy-map{
	float: left;
	font-size: 11px;
	color: #375797;
}
}
.texte-blanc-centre a{
	text-decoration: none;
	color: #ffffff;
}

.texte-blanc-centre a:visited {
	text-decoration: none;
	color: #ffffff;
}

.texte-blanc-centre a:focus, a:active {
	text-decoration: none;
	color: #ffffff;
}

.texte-blanc-centre a:hover {
	text-decoration: underline;
	color: #ffffff;
}

.colonne-376 p{     /* texte de la colonne de droite : glossaire, bibliographie, site internet */
	color: #104498;
	margin-bottom: 20px;
}

.titre-info-bulle{
	clear: both;
	margin-bottom: 6px;
	font-size: 15px;
	text-align: justify;
	color: #3b3b3b;
}

.info-bulle{
	clear: both;
	font-size: 12px;
	font-weight: normal;
	text-align: justify;
	color: #3b3b3b;
}

/* ****************************** */
/*      Colonne de droite         */
/* ****************************** */

#glossaire{
	/*font-style: italic;
	background: url('../images/loupe-glossaire.png') left no-repeat;
	padding-left: 50px;
	padding-top: 10px;
	height: 31px;
	margin-top: 0px;*/
}

#bibliographie{
	/*font-style: italic;
	background: url('../images/livre-bibliographie.png') left no-repeat;
	padding-left: 60px;
	padding-top: 10px;
	height: 31px;
	margin-top:40px;*/
}

/* ****************************** */
/*          Module carte          */
/* ****************************** */

/*#div-map{
	position:relative;
}

#map{
	float: left;
	width: 728px;
	height: 387px;
	margin-top: 30px;
	margin-left: 0px;
	margin-bottom: 0px;
	overflow: hidden;
	border: 1px solid #220000;
}

#titre-map{
	position:absolute;
	Top: 5px;
	width: 718px;
	height: 20px;
	margin-top: 30px;
	z-index:1000;
}

#titre-map p{
	text-align: right;
	color: #ffffff;
}*/

/*#div-copy-map{
	float: left;
	width: 728px;
	margin-top: 0px;
	margin-left: 0px;
	margin-bottom: 30px;
	overflow: hidden;
}*/

.div-carte{
	float: left;
	width: 100%;
	height: 389px;
	margin: 0px;
	margin-top:40px;
	overflow: hidden;
	border: 1px solid #220000;
	border:0px;
}

#iframe-carte{
    border:1px solid #104498;
    border-top: none;
    width:100%;
	height:387px;
    padding:0;
    margin:0;
    left:0;
    top:0;	
	overflow:hidden;
}

#div-copy-carte{
	float: left;
	width: 100%;
	margin-top: 0px;
	margin-left: 0px;
	overflow: hidden;
}

.legende-carte-haut{
	float: left;
	width: 148px;
	height: 260px;
	margin-top: 30px;
	margin-left: 0px;
	margin-bottom: 0px;
	padding: 20px;
	overflow: hidden;
	background: #f1f3f7;
}

.legende-carte-bas{
	float: left;
	width: 148px;
	height: 49px;
	margin: 0px;
	padding: 20px;
	overflow: hidden;
	background: #f1f3f7;
}


/* ****************************** */
/*         Module Galeries        */
/* ****************************** */

@media screen and (max-width: 685px) { /* petit ecran */
	div.div-img-258x185 {
	position: relative;
	float:left; 
  	width: 100%;
}

div.div-img-258x185 > div {
	position: relative;
	float:left;
  	width: 100%;
	padding-bottom: 72%; 
}

.div-img-258x185 img{
	position: absolute;
	top: 0px; bottom: 0px; left: 0px; right: 0px;
	width:100%;
	height: 100%;
}

.legende-galerie{
	float:left;
	height:60px;
}

.colonne-376{
	width: 100%; 
	margin-bottom:20px;
}

.colonne-376 select{
	float:left;
	width: 100%;
	height:40px;
	font-size: 14px;
	font-weight: bold;
	color: #104498;
	padding-left: 0px;
	background: #f1f3f7;
}
}

@media screen and (min-width: 686px) and (max-width: 1142px) { /* moyen ecran */
	div.div-img-258x185 {
	position: relative;
	float:left;
  	width: 50%;
}

div.div-img-258x185:nth-child(2n+1){
	padding-left:10px;
}

div.div-img-258x185:nth-child(2n){
	padding-right:10px;
}

div.div-img-258x185 > div {
	position: relative;
	float:left;
  	width: 100%;
	padding-bottom: 72%; 
}

.div-img-258x185 img{
	position: absolute;
	top: 0px; bottom: 0px; left: 0px; right: 0px;
	width:100%;
	height: 100%;
}

.legende-galerie{
	float:left;
	height:60px;
}

.colonne-376{
	border: 1px solid #fff;
	width: 100%; 
	margin-bottom:20px;
}

.colonne-376 select{
	float:left;
	width: 100%;
	height:40px;
	font-size: 16px;
	font-weight: bold;
	color: #104498;
	padding-left: 0px;
	background: #f1f3f7;
}
}

@media screen and (min-width: 1143px) { /* grand ecran */
	.div-img-258x185{
	float: left;
	margin-left: 12px;
	margin-right: 12px;
	width: 258px;
	height: 240px;
}

.div-img-258x185 img{
	float: left;
	width: 258px;
	height: 185px;
	background: #f1f3f7;
}

.legende-galerie{
	float: left;
	font-size: 14px;
}

.colonne-376 select{
	float:right;
	width: 330px;
	height:40px;
	font-size: 16px;
	font-weight: bold;
	color: #104498;
	padding-left:15px;
	margin-top:30px;
	background: #104498;
	background: #f1f3f7;
}
}	

/* ****************************** */
/*        Module publicité        */
/* ****************************** */

@media screen and (max-width: 685px) { /* petit ecran */
	.pub-336x280{
	float: left;
	margin-top: 40px;
	margin-bottom: 35px;
	width: 100%;
	height: 280px;
	display:none;
}

.pub-728x90{
	float: left;
	clear: both;
	margin-top: 20px;
	margin-bottom: 20px;
	margin-left: 12px;
	width: 100%;
	/*display:none;*/
}
}

@media screen and (min-width: 686px) and (max-width: 1142px) { /* moyen ecran */
	.pub-336x280{
	float: left;
	margin-top: 40px;
	margin-bottom: 35px;
	width: 100%;
	height: auto;
}

.pub-728x90{
	float: left;
	clear: both;
	margin-top: 40px;
	margin-bottom: 35px;
	margin-left: 12px;
	width: 100%;
}
}

@media screen and (min-width: 1143px) { /* grand ecran */
	.pub-336x280{
	float: left;
	margin-top: 40px;
	margin-bottom: 35px;
	width: 336px;
	height: 280px;
}

.pub-728x90{
	float: left;
	clear: both;
	margin-top: 40px;
	margin-bottom: 35px;
	margin-left: 12px;
	width: 728px;
	height: 90px;
}
}	

