@charset "utf-8";
/* CSS Document */

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
	margin: 0;
	padding: 0;
	border: 0;
	outline: 0;
	font-weight: inherit;
	font-style: inherit;
	font-size: 100%;
	font-family: inherit;
	vertical-align: baseline;
	color: #000;
}
/* remember to define focus styles! */



:focus {
outline: 0;
}


html, body {
	font-family: Arial, Helvetica, sans-serif;
	height: 100%;
	width: 100%;
	margin: 0px;
	padding: 0px;
	background-color: #FFF;
}
#general {
	background-color: #FFF;
	height: 100%;
	width: 100%;
	margin: 0px;
	font-size: 1em;
}
#colonne_gauche  {
	float: left;
	width: 16%;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 0.8em;
	position: fixed;
	height: 100%;
	padding-left: 5px;
}
#colonne_gauche .menu {
	margin-bottom: 60px;
	clear: both;
	float: left;
	height: auto;
	width: 100%;
	margin-top: 0px;
	margin-right: 0px;
	margin-left: 0px;
}
#colonne_gauche h1   {
	float: left;
	height: auto;
	width: auto;
	margin-top: 130px;
	margin-bottom: 30px;
	margin-left: 12px;
	margin-right: 5px;
}
#colonne_gauche h1 a {
	text-decoration : none;
	font-size: 1.2em;
}
	
	
	
	
.menu ul {
	list-style: none;
	padding: 0px;
	margin: 0px;
	clear: both;
	float: left;
	height: auto;
	width: 100%;
}

.menu ul li {
	display: block;
	width: 100%;
	float: left;
}

.menu ul li a{
	display: inline-block;
	width: auto;
	clear: left;
	float: left;
	padding-top: 0px;
	padding-bottom: 2px;
	margin-top: 2px;
	text-decoration: none;
	padding-left: 12px;
	padding-right: 60px;
}
.menu ul li a:hover {
	font-weight: bold;
}
.menu ul li .actif {
	padding-top: 2px;
	padding-bottom: 4px;
	font-weight: bold;
}
.menu ul li .actif:hover {
	padding-left: 12px;
}
#menu2 {
	padding-top: 30px;
	font-size: 0.8em;
	overflow: visible;
}
#menu2 ul li a {
	padding-bottom: 0px;
	margin-top: 0px;

}


#numéros {
	list-style: none;
	float: left;
	height: auto;
	width: auto;
	margin-bottom: 5px;
	padding-right: 8px;
	padding-bottom: 0px;
	padding-left: 8px;
	position: absolute;
	bottom: 0px;
}
#numéros span a, #numéros span a:hover {
	clear: both;
	float: left;
	width: 100%;
	margin-left: 6px;
	margin-bottom: 2px;
	text-decoration: none;
	background-color: transparent;
	color: #000;
	font-weight: normal;
}
#numéros span a:hover {
	font-weight: bold;

}
#jeromemichel a:hover {
	font-weight: normal !important;
	text-decoration: underline !important;
}
#jeromemichel {
	display: block;
	float: left;
	margin-top: 20px;
}
#jeromemichel a {
	font-size: 75%;
	color: #AAA !important;
}

#numéros .upper {
	text-transform: uppercase;
}
#numéros li {
	float: left;
	width: auto;
	margin-top: 4px;
}
#numéros .cache {
	display: none;
}

#numéros li a{
	margin-right: 4px;
	margin-left: 2px;
	text-decoration: none;
	float: left;
	width: auto;
	clear: none;
	padding-top: 2px;
	padding-right: 6px;
	padding-bottom: 2px;
	padding-left: 6px;
	border-radius: 0px;
}
#numéros li:first-of-type{
	margin-left: 10px;
}
#numéros a:hover {
	text-decoration: underline;
	font-weight: bold;
	color: #FFF;
	background-color: #CCC;
	border-radius: 25px;
	transition-property: border-radius, background-color ;
	transition-duration: 0.6s;


}
#numéros .actif {
	text-decoration: underline;
	font-weight: bold;
	color: #666;
	background-color: #EEE;
	border-radius: 25px;
	}



#colonne_droite   {
	float: left;
	width: 84%;
	background-color: #FFF;
	height: 100%;
	margin-top: 0px;
	margin-right: 0px;
	margin-left: 16%;
}
#colonne_droite #textes {
	padding-top: 120px;
	padding-left: 12px;
	width: 80%;
	padding-bottom: 50px;
}
#colonne_droite #textes p {
	font-size: 0.8em;
}
#colonne_droite #textes p i {
	font-weight: bold;
}
#colonne_droite #textes h3 a{
	font-size: 0.8em;
	text-decoration: none;
	margin-top: 15px;
	display: block;
	font-weight: bold;
}
#colonne_droite #textes h3 a:hover{
	text-decoration: underline;
}

#colonne_droite #textes span{
	font-size: 0.8em;
	padding-left: 10px;

}


#colonne_droite #news {
	float: left;
	padding-top: 155px;
	padding-right: 0px;
	padding-bottom: 0px;
	padding-left: 12px;
	font-size: 0.8em;
	margin-top: 0px;
	margin-right: 0px;
	margin-bottom: 30px;
	margin-left: 0px;
}
#colonne_droite #news span {
	font-size: 0.9em;
	margin-top: 30px;
	clear: both;
	float: left;
	margin-bottom: 8px;
}
#colonne_droite #news h2 {
	font-size: 1em;
	clear: both;
	float: left;
	padding-left: 40px;
	font-weight: bold;
}
#colonne_droite #news img {
	clear: left;
	float: left;
	margin-top: 40px;
	margin-bottom: 30px;
	}
#colonne_droite #travaux {
	height: auto;
	float: left;
	padding-left: 10px;
	padding-top: 52px;
	margin-bottom: 60px;
	margin-right: 50px;
}
#travaux h2 {
	clear: right;
	float: left;
	padding-top: 40px;
	padding-bottom: 15px;
	width: 100%;
	font-size: 0.8em;
	border-bottom-width: 1px;
	border-bottom-style: solid;
	border-bottom-color: #666;
	margin-bottom: 20px;
}
#travaux h2 i {
	font-weight: bold;
}



#travaux .vignettelarge {
	float: left;
	width: auto;
	background-color: #FFF;
	padding: 10px;
	margin: 5px;
	height: auto;
	opacity: 1;
	clear: none;
}
#travaux .carree {
	height: auto;
}


#travaux .vignettelarge:hover {
	background-color: #FFF;
	opacity: 0.9;

}

#travaux .vignettelarge img {
	clear: both;
	float: left;
	width: 170px;
	height: auto;
	padding-bottom: 13px;
	background-color: transparent;

	margin-bottom: 6px;
}
#travaux .carree img{
	width: 110px;
	height: auto;

}


#travaux .vignettelarge span {
	background-color: #FFF;
	height: auto;
	display: none;

}

#travaux .vignettelarge p {
	height: auto;
	width: 170px;
	font-size: 0.7em;
	text-decoration: none;
	float: left;
	clear: both;
	background-color: transparent;
	color: #333;
	padding: 1px;
}
#travaux .vignettelarge .legende {
	font-weight: bold;
}

#travaux .vignettelarge .legende2 {

}

#travaux .vignettelarge .legende3 {

}

#travaux #video2 {
	float: left;
	width: auto;
	background-color: #FFF;
	padding: 10px;
	margin: 5px;
	height: 220px;
	opacity: 1;
	clear: none;
}
#travaux .texte_exp, .texte01 {
	float: right;
	background-color: #FFF;
	height: auto;
	width: 350px;
	padding-top: 12px;
	clear: right;
	padding-left: 15px;
}
#travaux .texte_exp p, .texte01 p {
	font-size: 0.7em;
	text-align: justify;
}




#colonne_video   {
	float: right;
	width: 100%;
	background-color: #FFF;
	height: 100%;
	margin: 0px;
}
.myvideo {
	width: auto;
	max-width: 100%;
	height:100%;
	max-height: 100%;
	background-color: #FFF;
	margin-bottom: 0px;
	margin-right: 0px;
	float: right;
}

#colonne_video span  {
	float: right;
	clear: both;
	margin-bottom: 10px;
	padding-right: 10px;
}

#expos, #colonne_contact {
	float: left;
	height: auto;
	width: auto;
	padding-top: 30px;
	padding-bottom: 70px;
	margin-top: 0px;
	margin-right: 0px;
	margin-bottom: 0px;
	margin-left: 12px;
}

#expos h2 {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 14px;
	font-weight: bold;
	display: block;
	clear: both;
	float: left;
	height: auto;
	width: auto;
	margin-top: 40px;
	margin-right: 0px;
	margin-bottom: 10px;
	margin-left: 0px;
}
#expos p {
	clear: both;
	float: left;
	padding-left: 0px;
	font-size: 12px;
	margin-top: 2px;
}
#colonne_contact p {
	clear: both;
	float: left;
	padding-left: 0px;
	font-size: 12px;
	margin-top: 0px;
}
#colonne_contact p:first-child {
	clear: both;
	float: left;
	padding-left: 0px;
	font-size: 12px;
	margin-top: 70px;
}
#colonne_contact p a {
	text-decoration: none;
}
#colonne_contact p a:hover {
	text-decoration: underline;
}

#colonne_contact p a b {
	font-weight: bold;
}

#expos p a {
	text-decoration: none;
}
#expos p i {
	display: block;
	margin-left: 0px;
	margin-top: 20px;
	margin-bottom: 4px;
}