@charset "iso-8859-1";
/* CSS Document */

/*a:link {
background: #FFF;
color: #000;
}
a:visited {
background: #FFF;
color: #000;
}
a:focus {
background: #FFF;
color: #000;
}
a:hover {
background: #000;
color: #FFF;
}
a:active {
background: #FFF;
color: #000;
}*/
a, a:link {
background: transparent;
color: #000;
}
a:visited {
background: transparent;
color: #000;
}
a:focus {
background: transparent;
color: #000;
}
a:hover {
background: #000;
color: #FFF;
}
a:active {
background: transparent;
color: #000;
}
#nav a:link,
#nav a:visited,
#nav a:focus,
#nav a:hover,
#nav a:active {
background: transparent;
}
body {
background: #CCC;
color: #000;
font: normal normal 0.8125em Verdana, sans-serif;
margin: 0;
padding: 0;
}

h1 {
height: auto;
margin: 0;
padding: 0;
}
h1 a {
display: block;
height: 100px;
left: 45px;
margin: 20px 0 0 0;
overflow: visible;
padding: 0;
position: absolute;
top: 0;
width: 100px;
}
h2 {
font-size: 1.4em;
margin: 0;
padding: 0;
text-align: left;
}
h3 {
font-size: 1.2em;
margin: 1em 0;
padding: 0;
text-align: left;
}
img {border: none;}

.cache,
span.cache,
h1 span,
h2 span,
h3 span {
height: 1px;
left: 0;
overflow: hidden;
position: absolute;
top: -9999px;
width: 1px;
}

#actuGauche {
background: #FFF url(../img/com/bg-slash.gif) left top repeat;
float: left;
width: 297px;
}
#actuDroite {
background: #FFF;
float: left;
margin: 0 0 0 15px;
width: 600px;
}
#bienvenue {
width: 315px;
}
#blocDiaporama {
background: #FFF url(../img/com/bg-blocDiaporama.gif) left top no-repeat;
margin: 0;
padding: 0;
}
#blocDiaporama img {
margin: 48px 0 0 0;
}
#blocDiaporama p {
background: #FFF;
margin: 4px 0 8px 0;
}

#blocDroite {
background: none;
float: right;
margin: 0;
padding: 0;
width: 598px;
}
#blocGauche {
background: #FFF;
float: left;
width: 315px;
}
#page-partenaire #blocDroite {
background: none;
float: right;
margin: 0;
padding: 0;
width: 315px;
}
#page-partenaire #blocGauche {
background: #FFF;
float: left;
width: 598px;
}
#blocRechSimple {margin-left: 77px;}
#blocRechDroite {
float: right;
padding: 0 0 0 25px;
width: 475px;
}
#blocRechDroite label {
display: block;
}
#blocRechGauche {
border-right: 1px solid #000;
float: right;
padding: 0 0 0 85px;
width: 370px;
}
#blocZoom h2 {
background: #FFF url(../img/fr/accueil/h-zoom.gif) left top no-repeat;
height: 51px;
margin: 0;
padding: 0;
}
#blocZoom p { text-align: left;}
#btn-rechercheAv {margin: 30px 0 30px 40px;}
#btn-okRechSimple {width: 28px;}
#contenu {
background: #FFF;
border: none;
margin: 0;
padding: 0 6px;
width: 978px;
}
#page-accueil #contenu {
background: none;
margin: 123px 0 0 0;
}
#page-notice #contenu {
margin: 10px 0 0 0;
}

#diaporamaBloc {
/*border: 1px solid #000;*/
margin: 0 auto;
padding: 0;
text-align: center;
width: 500px;
}
#diaporamaBloc p {
margin: 5px;
}
a.diaporamaLink{
	display: block;
	margin: 2px 0 0;
	padding: 5px 5px 5px 18px;
	font-size: 85%;
	background-image: url(../img/com/diaporama_add.png);
	background-repeat: no-repeat;
	background-position: 2px center;
	}
#filAriane {
float: left;
width: 735px;
}
#filAriane span { margin: 0 0 0 20px;}
#footer {
background: #FFF;
border-top: 1px solid #000;
color: #000;
height: 32px;
margin: 0;
padding: 6px 6px 0 6px;
position: relative;
text-align: left;
width: 978px;
}
#footer img {
float: left;
width: 98px;
}
#footer p {
float: right;
margin: 0;
padding: 0;
}
#frise {
margin: 130px 0 0 0;
text-align: center;
}
#global {
background: #FFF;
border: 1px solid #FFF;
margin: 0 auto;
position: relative;
width: 990px;
}
#page-accueil #global {
background: #FFF url(../img/com/bg-accueil.jpg) left top no-repeat;
}
#header {
position: relative;
background: #FFF url(../img/com/header-page.jpg) left top no-repeat;
height: 160px;
margin: 0;
padding: 0;
position: relative;
}
#search {
	position: absolute;
	right: 0;
	top: 0;
	}
#headerImg1 {
background: none;
display: block;
height: 90px;
left: 364px;
position: absolute;
top: 25px;
width: 150px;
}
#headerImg2 {
background: none;
display: block;
height: 115px;
left: 560px;
position: absolute;
top: 0;
width: 300px;
}
#page-accueil #header {
background-image: none;
height: auto;
}

#header p {
margin: 0;
padding: 120px 0 0 10px;
}
#header form {
margin: 0;
padding: 117px 0 0 10px;
}
#noticeLeft {
background: #FFF;
float: left;
width: 520px;
}
#noticeLeft table {border-collapse: collapse;}
#noticeLeft td {
border-bottom: 1px solid #000;
padding: 5px;
}
#noticeLeft th {
border-bottom: 1px solid #000;
font-size: 0.9em;
padding: 5px;
text-align: left;
vertical-align: top;
width: 110px;
}
#noticeRight {
background: #FFF;
float: left;
margin: 0 0 0 10px;
text-align: center;
width: 440px;
}
#page-plansite li {
margin: 0.3em 0;
padding: 0 0 0 0.2em;
}
#page-plansite ul {
margin: 0.5em 2em;
padding: 0 0 0 0.2em;
}
/* Plan de Roubaix
---------------------------*/
#planRoubaix {
float: left;
margin: 0;
width: 762px;
}
#list-plan-roubaix {
float: left;
margin: 0;
width: 200px;
}
	#list-plan-roubaix a {
	font-size: 0.85em;
	}
	
	#list-plan-roubaix ul {
	margin: 0;
	padding: 0 0 0 15px;
	}
/* fin Plan de Roubaix
---------------------------*/
#vue_img {
/*border: 1px solid red;*/
text-align: center;
}
#zoom_cible {
bottom:0px;
position: absolute;
right:0px;
}
.zoom_cible {
height: 450px;
left: 0px;
position: relative;
width: 520px;
top: 0px;
overflow: hidden;
}
/****************************************/
#navPartenaire {
font-size: 0.8em;
list-style-type: none;
margin: 0 0 30px 0;
padding: 0;
}
#navPartenaire li a {
line-height: 1em; /* pour affichage identique sur IE7 et FF */
}
#navPartenaire li {
margin-bottom: 4px;
}
#nav-mediatheque {margin-left: 142px;}
#nav-archives {margin-left: 133px;}
#nav-observatoire {margin-left: 125px;}
#nav-piscine {margin-left: 115px;}
#nav-conservatoire {margin-left: 104px;}
/****************************************/
#rech2 {
float: left;
width: 230px;
}
#rech2 #rechercheSimple {
width: 180px;
}
#rechercheSimple { width: 217px;}

#resultat {
background: #FFF;
margin: 0 auto;
padding: 10px 0 0 0;
width: 90%;
}
label#rechercheSimpleLabel {
background: #FFF url(../img/fr/accueil/h-recherche-simple.gif) left center no-repeat;
color: red;
display: block;
float: left;
height: 30px;
text-indent: -10000px;
width: 245px;
}
/***************************************/
#h-contact {
background: #FFF url(../img/fr/h-contact.gif) left top no-repeat;
height: 51px;
margin: 0;
padding: 0;
}
#h-decouvrir {
background: #FFF url(../img/fr/h-decouvrir.gif) left top no-repeat;
height: 51px;
margin: 0;
padding: 0;
}
#h-decouvrir-collection {
background: #FFF url(../img/fr/h-decouvrir-collection.gif) left top no-repeat;
height: 51px;
margin: 0;
padding: 0;
}
#h-decouvrir-periode {
background: #FFF url(../img/fr/h-periode.gif) left top no-repeat;
height: 51px;
margin: 0;
padding: 0;
}
#h-decouvrir-plan {
background: #FFF url(../img/fr/h-decouvrir-plan-roubaix.gif) left top no-repeat;
height: 51px;
margin: 0;
padding: 0;
}
#h-decouvrir-theme {
background: #FFF url(../img/fr/h-theme.gif) left top no-repeat;
height: 51px;
margin: 0;
padding: 0;
}
#h-diaporama {
background: #FFF url(../img/fr/h-diaporama.gif) left top no-repeat;
height: 51px;
margin: 0;
padding: 0;
}
#h-faq {
background: #FFF url(../img/fr/h-faq.gif) left top no-repeat;
height: 51px;
margin: 0;
padding: 0;
}
#h-lien {
background: #FFF url(../img/fr/h-lien.gif) left top no-repeat;
height: 51px;
margin: 0;
padding: 0;
}
#h-archives {
background: #FFF url(../img/fr/h-archives.gif) left top no-repeat;
height: 51px;
margin: 0;
padding: 0;
}
#h-conservatoire {
background: #FFF url(../img/fr/h-conservatoire.gif) left top no-repeat;
height: 51px;
margin: 0;
padding: 0;
}
#h-musee {
background: #FFF url(../img/fr/h-musee.gif) left top no-repeat;
height: 51px;
margin: 0;
padding: 0;
}
#h-observatoire {
background: #FFF url(../img/fr/h-observatoire.gif) left top no-repeat;
height: 51px;
margin: 0;
padding: 0;
}
#h-mediatheque {
background: #FFF url(../img/fr/h-mediatheque.gif) left top no-repeat;
height: 51px;
margin: 0;
padding: 0;
}
#h-mention {
background: #FFF url(../img/fr/h-mention.gif) left top no-repeat;
height: 51px;
margin: 0;
padding: 0;
}
#h-plan {
background: #FFF url(../img/fr/h-plan-site.gif) left top no-repeat;
height: 51px;
margin: 0;
padding: 0;
}
#h-presentation {
background: #FFF url(../img/fr/h-presentation.gif) left top no-repeat;
height: 51px;
margin: 0;
padding: 0;
}
#h-rech-av {
background: #FFF url(../img/fr/h-recherche-avancee.gif) left top no-repeat;
height: 51px;
margin: 0;
padding: 0;
}
#h-zoom {
background: #FFF url(../img/fr/h-zoom.gif) left top no-repeat;
height: 51px;
margin: 0;
padding: 0;
}
/***************************************/
#rechercheAv {
font-family: Verdana, sans-serif;
font-size: 0.9em;
margin: 0 auto;
padding: 0;
width: 100%;
}

#rechercheAv em {color: #F00;}
#rechercheAv fieldset {
	background: #FFF;
	border-bottom: 1px solid #000;
	border-left: none;
	border-right: none;
	border-top: 1px solid #000;
	display: block;
	margin: 0 auto 10px auto;
	padding: 0.5em;
	width: 95%;
}
#rechercheAv input.champ { width: 250px;}

#rechercheAv input:focus,
#rechercheAv input:focus#cv,
#rechercheAv input:focus#nom,
#rechercheAv input:focus#telephone,
#rechercheAv input:focus#mail,
#rechercheAv select:focus#prestation,
#rechercheAv select:focus#implantation,
#rechercheAv select:focus#destinataire,
#rechercheAv textarea:focus {
background: #EBEFF2;
}

#rechercheAv input#cv,
#rechercheAv input#nom,
#rechercheAv input#prenom,
#rechercheAv input#societe,
#rechercheAv input#telephone,
#rechercheAv input#mail,
#rechercheAv input#adressel1,
#rechercheAv input#cp,
#rechercheAv input#ville,
#rechercheAv select#prestation,
#rechercheAv select#implantation,
#rechercheAv select#destinataire,
#rechercheAv input#prestation_autre {
width: 60%;
}
#rechercheAv input#cv,
#rechercheAv input#nom,
#rechercheAv input#telephone,
#rechercheAv input#mail,
#rechercheAv select#prestation,
#rechercheAv select#implantation,
#rechercheAv select#destinataire {
background: #DFD7C4;
}
#rechercheAv legend {
	background: #FFF;
	color: #000;
	font-weight: bold;
	letter-spacing: 1px;
	padding: 0 5px;
}
#rechercheAv textarea {
margin: 0.2em;
width: 60%;
}
#rechercheAv p {margin: 5px 0;}
#rechercheAv td {padding: 3px;}
#rechercheAv td.exemple {
padding: 0 0 0 3px;
vertical-align: top;
}
#rechercheAv th {
letter-spacing: 1px;
padding: 3px;
text-align: right;
}
/***************************************/
div#nav {
background: #FFF;
border: 0;
height: 269px;
margin: 0;
padding: 0;
width: 598px;
}

div#nav ul#menu {
background: transparent url(../img/fr/accueil/nav-decouvrir.gif) top left no-repeat;
height: 269px;
margin: 0;
padding: 0;
position: relative;
width: 598px;
}

div#nav ul#menu li {
list-style: none;
margin: 0;
padding: 0;
position: absolute;
}
	
ul#menu li, ul#menu a {
display: block;
height: 67px;
}
ul#menu li#nav-theme, ul#menu #nav-theme a {
height: 68px;
}
div#nav ul#menu li a {
text-decoration: none;
text-indent: -9999px;
}
#nav-theme		{left: 0; top: 0; width: 598px;}
#nav-collection		{left: 67px; top: 68px; width: 531px;}
#nav-periode 		{left: 134px; top: 135px; width: 464px;}
#nav-plan 		{left: 201px; top: 202px; width: 397px;}

#nav-theme a:hover 		{background: transparent url(../img/fr/accueil/nav-decouvrir.gif) 0 -269px no-repeat;}
#nav-collection a:hover 		{background: transparent url(../img/fr/accueil/nav-decouvrir.gif) -67px -337px no-repeat;}
#nav-periode a:hover 		{background: transparent url(../img/fr/accueil/nav-decouvrir.gif) -134px -404px no-repeat;}
#nav-plan a:hover 		{background: transparent url(../img/fr/accueil/nav-decouvrir.gif) -201px -471px no-repeat;}

/********    Les Classes    ************/
/***************************************/
.blocCollection {
background: #FFF;
border: 1px solid #000;
float: left;
height: 110px;
margin: 5px;
padding: 3px;
width: 290px;
}
.blocCollection h3 { font-size: 0.9em; margin: 2px; }
.blocCollection p  { font-size: 0.8em; margin: 2px; }

.blocTheme {
background: #FFF;
float: left;
margin: 20px 0 20px 12px;
padding: 0 0 0 5px;
width: 18%;
}
.blocTheme li li {
margin: 4px 0;
}
.blocTheme ul, .blocTheme li {
list-style-type: none;
margin: 0;
padding: 0;
}
.blocLien {
background: #FFF;
margin: 0px 20px 0px 50px;
padding: 0px 5px;
width: 80%;
}
.blocLien li li {
margin: 4px 0;
}
.blocLien ul, .blocLien li {
list-style-type: none;
margin: 0;
padding: 0;
}
.bold {font-weight: bold;}
.btnForm {
background: #D9C1B3;
border: 1px solid #BF9A83;
color: #1F180C;
cursor: pointer;
}
.center {text-align: center;}
.centerBlock {margin: 0 auto;}
.imgFloatLeft {
float: left;
margin: 0 10px 0 0;
}
.imgFloatRight {
float: right;
margin: 0 10px 10px 0;
}
.obligatoire {
color: #C68E0F;
}
.resultatBloc {
background: #FFF;
float: left;
margin: 0 5px;
padding: 0 5px;
text-align: center;
width: 155px;
}
.petit { font-size: 0.7em;}
.separateur {
clear: both;
visibility: hidden;
}
/********** Formulaire de Contact **********/
/*******************************************/
#pageContact {
background: #FFF;
float: left;
margin: 15px 0 0 15px;
width: 700px;
}
#formContact,
#formNumerisation {
font-family: Arial, Helvetica, sans-serif;
font-size: 0.9em;
margin: 0 auto;
padding: 0;
width: 90%;
}
#formContact em,
#formNumerisation em {color: #F00;}
#formContact fieldset, #formNumerisation fieldset {
	background: #FFF;
	border-left: none;
	border-right: none;
	display: block;
	margin: 0 auto 10px auto;
	padding: 0.5em;
	width: 95%;
}

#formContact label,
#formNumerisation label {
	color: #000;
	float: left;	/*** Tres important, ne pas suprimer ! ***/
	font-weight: bold;
	line-height: 1.8;
	margin: 0;
	padding: 0 0.5em 0 0;
	text-align: right;	/*** ... et ils sont alignes a droite... ***/
	width: 30%;	/*** Les intitules prennent n% de la largeur totale du formulaire... ***/
}
#formContact label.radio,
#formNumerisation label.radio {
float: left;
width: auto;
}

#formContact input:focus,
#formContact input:focus#nom,
#formContact input:focus#prenom,
#formContact input:focus#mail,
#formContact textarea:focus,
#formNumerisation input:focus,
#formNumerisation input:focus#nom,
#formNumerisation input:focus#prenom,
#formNumerisation input:focus#mail,
#formNumerisation textarea:focus {
background: #FFF;
}

#formContact input#nom,
#formContact input#prenom,
#formContact input#societe,
#formContact input#telephone,
#formContact input#mail,
#formContact input#adressel1,
#formContact input#cp,
#formContact input#ville,
#formContact input#titre,
#formContact input#cote,
#formContact input#pagination,
#formContact input#date_publication,
#formNumerisation input#nom,
#formNumerisation input#prenom,
#formNumerisation input#societe,
#formNumerisation input#telephone,
#formNumerisation input#mail,
#formNumerisation input#adressel1,
#formNumerisation input#cp,
#formNumerisation input#ville,
#formNumerisation input#titre,
#formNumerisation input#cote,
#formNumerisation input#pagination,
#formNumerisation input#date_publication {
width: 60%;
}
#formContact legend,
#formNumerisation legend {
	background: #FFF;
	color: #000;
	font-weight: bold;
	letter-spacing: 2px;
	padding: 0 5px;
	text-transform: uppercase;
}
#formContact textarea,
#formNumerisation textarea {
margin: 0.2em;
width: 60%;
}
#formContact p,
#formNumerisation p {margin: 5px 0;}
/******** Slideshow et zoom ************/
/***************************************/
.slideshow-captions {
	position: relative;
	margin: 0 auto;
	background: #000;
	color: #FFF;
	font: normal 12px/22px Arial, sans-serif;
	overflow: hidden;
	text-indent: 10px;
	width: 303px;
}

#slideshowController {
	position: relative;
	margin-top: 5px;
	text-align: center;
	}
	#slideshowController a {
		margin: 0 5px;
		background: none;
		text-decoration: none;
		}
		#slideshowController #goToSlideshowController {
			margin: 0 0 0 5px;
			padding-left: 15px;
			border-right: 1px solid black;
			}
		#slideshowController #goToSlideshow {
			margin: -10px 0 0 0;
			padding: 0;
			width: 30px;
			height: 18px;
			border: 1px solid black;
			vertical-align: middle;
			}
		#slideshowController #goToSlideshowButton {
			height: 20px;
			line-height: 20px;
			color: black;
			}
/******** Retour formulaire ************/
/***************************************/
#msgRetourForm {
margin: 15% 5%;
}
#msgRetourForm p {
margin: 0 0 10px 0;
padding: 0;
}
/******** Mentions legales  ************/
/***************************************/
#mention {
list-style-type: none;
margin: 0;
padding: 0;
}
#mention li { margin: 0.5em 0;}
/* Expo en ligne
-------------------------------*/
#resultatExpo {
padding-left: 20px; 
}
#h-expo {
background: #FFF url(../img/fr/h-expo.gif) left top no-repeat;
height: 51px;
margin: 0;
padding: 0;
}
.resultatExpo {
float: left;
margin: 0 15px 10px 0;
width: 220px;
}
	.resultatExpo td {
	font-size: 11px;
	text-align: left;
	}
	.resultatExpo th {
	height: 214px;
	text-align: center;
	vertical-align: middle;
	}
	.expoTitre {
	font-weight: bold;
	text-align: center;
	text-transform: uppercase;
	}
/*---------------------------------------
--------------------- Fin Expo en ligne*/
#blocActu {
margin: 0;
padding: 0;
}
#blocActu h2 {
background: #FFF url(../img/fr/accueil/h-actu.gif) left top no-repeat;
height: 51px;
margin: 0;
padding: 0;
}
#blocActu p {
background: #FFF;
text-align: left;
}
#blocExpo h2 {
background: #FFF url(../img/fr/accueil/h-expo.gif) left top no-repeat;
height: 51px;
margin: 0;
padding: 0;
}
#blocExpo p { text-align: center;}