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

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

html, body{
	margin:0;
	padding:0;
}

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

/*@media screen and (max-width: 1128px) {
body{
	margin:auto;
    width: 1128px;
}
}*/

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;
}

#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;*/
	display: none;
}

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

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

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

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

/*#module-carte-moyen-petit-ecran{
	display: none;
}

#module-carte-grand-ecran{
	float: left;
	width: 100%;
	overflow: hidden;
}*/

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

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

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

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

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

.module-publicite{
	float: left;
	width: 100%;
	margin-top: 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;*/
	display: none;
}

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

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

.global-centre{
	position: relative;
    margin: 0 auto;
	width: 1128px;
	min-height: 20px;
	/*background: #00ff00;*/
}

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

#global-bandeau{
}

#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           */
/* **************************** */

#global-menu-haut{
}

.drapeau{
	float:left;
	height: 30px;
	width: 35px;
	margin-left: 12px;
	margin-right: 205px;
	padding-top: 4px;
}

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

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         */
/* **************************** */

#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;
}

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;
}

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{
}

.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; /*409px;*/
	/*background: #0000ff;*/
}

.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; /*336px;*/
	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      */
/* **************************** */

.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          */
/* **************************** */

#global-bandeau-auteur{
}

.img-auteur{
	float: left;
	width: 70px;
	height: 70px;
}

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

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

#module-pied-page-haut{
}

#module-pied-page-milieu{
}

#module-pied-page-bas{
}

.colonne-pied-page{
	column-count: 4;
	margin-left: 12px;
	margin-right: 12px;
}

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;
}

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;
}

p{
	font-size: 15px;
	text-align: justify;
	color: #3b3b3b;
}

.texte-blanc-centre{
	font-size: 15px;
	text-align: center;
	color: #ffffff;
}

.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;
}

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

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

.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;
}


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

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

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

.liens-orange a:focus, a:active {
	text-decoration: none;
	color: #e15204;
}*/

/* ****************************** */
/*      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          */
/* ****************************** */
/*a:visited {
	text-decoration: none;
	color: #e15204;
}*/
/*
#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;
}

.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 Carte         */
/* *************************** */

/*#onglets{
	margin-top:20px;
}

#onglets ul{
	width: 538px;
	float: left;
	font-size: 15px;
	text-align: justify;
	color: #3b3b3b;
    -list-style-type: none;
    border-bottom: 1px solid #104498;
	margin:0px;
	padding:0px;
}

#onglets ul li{
    display: inline;
    float: right;
    height: 24px;
    min-width:180px;
    text-align:center;
    padding:0;
    margin: 1px 0px 0px 0px;
	border: 1px solid #104498;
}

#onglets ul li.selected{
    border-bottom: 1px solid #fff;
    background-color: #fff;
}


#onglets ul li a{
    float: left;
    color: #666;
    text-decoration: none;
    padding: 4px;
    text-align:center;
    background-color:#eee;
    min-width:180px;
    border-bottom: 1px solid gray;
}

#onglets ul li a.selected{
    color: #000;
	color: #104498;
    background-color: #fff;
    border-bottom: 1px solid #fff;
}

#onglets ul li a:hover{
    color: #000;
	color: #e15204;
    text-decoration: none;
    background-color: #fff;
}

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

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

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

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

.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;
	padding-top: -2px;
	margin-top:30px;
	background: #104498;
	background: #f1f3f7;
}

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

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

.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;
}