html, body {
height: 100%;
margin:0;
padding:0;
background: #333333;
}
body {
	position: relative;
	font-family: 'Exo 2', sans-serif; font-style:normal;
	-webkit-text-size-adjust: 100%;
	color: #666;
	width: 1200px;
	max-width: 100%;
	margin: 0 auto;
	padding: 0 0 20 0;/*top-right-bottom-left-*/
}
#undo-redo {
	min-height: 100%;
	position: relative;
	margin-right: auto;
	width: 1200px;
	max-width: 100%;
	overflow: hidden;
	background-color: #E8E6E6;
	margin-left: auto;
}
.arrow, .arrow2, .lien_titre {
display: inline-block;
line-height: 2.5em;
text-align: center;
font-size: 1em;
width: 36px;
}
.arrow, .arrow2, .bleu {
-o-transition:.5s;
-ms-transition:.5s;
-moz-transition:.5s;
-webkit-transition:.5s;
transition:.5s;
filter : alpha(opacity=90);
opacity : 0.90;
}
.arrow:hover {
background: #00BBFF;
color: #161616;
}
.lien_titre:hover {
	color: #00BBFF;
}
.arrow2 {
font-weight: 900; 
background: #BFBFBF;
color: #FAFAFA;
}
.arrow {
background: white;
color: #161616;
}
.lien_titre {
	background: #1A1A1A;
	color: #FFFFFF;
	border-left: solid #F9F9F9 1px;
}
.arrow2:hover {
background: none;
color: #00BBFF;
}
.right {
float: right;
z-index: 2;
position: absolute;
right: 0;
bottom: 0;
height: 40px;
}
#diapo {
z-index: 3;	
}
#show {
position: fixed;
top: 0;
width: 1200px;
height: 67px;
background: #252525;
z-index: 3;
filter : alpha(opacity=80);
opacity : 0.80;
}
a {
text-decoration: none;
}
.titre {
	opacity: 0.9;
	padding: 4px 50px 0px 15px;/*top-right-bottom-left-*/
	text-align: center;
	z-index: 1;
	position: absolute;
	right: 0;
	bottom: 0;
	background-color: #404040;
	color: #ffffff;
	font-variant: all-small-caps;
	font-weight: bold;
	letter-spacing: 1px;
	font-family: 'Baloo Tammudu 2';
}

.une {
background-color: #333333;
}

/* ---------- alt text transparent ------------*/
img{
	color: rgba(0, 0, 0, 0) !important;
}

/* --------------------------------------------------------- navigation galerie, gauche-droite-index ------------------------------------------------------ */
.fa {
	padding: 10px 3px 10px 3px;
	font-size: 17px;
	width: 30px;
	text-align: center;
	text-decoration: none;
	margin: 0px 1px 1px 0px;
	-o-transition:.5s;
	-ms-transition:.5s;
	-moz-transition:.5s;
	-webkit-transition:.5s;
	transition:.5s;
	background: none;
	color: #FAFAFA;
}
.fa:hover {
	background-color: #2A2A2A;
	color: #00BBFF;
}
/* --------------------------------------------------------- chargement immages ------------------------------------------------------ */
 img.lazy {
        display: block;
        /* optional way, set loading as background */
        background-image:url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBzdGFuZGFsb25lPSJubyI/Pgo8IURPQ1RZUEUgc3ZnIFBVQkxJQyAiLS8vVzNDLy9EVEQgU1ZHIDEuMS8vRU4iICJodHRwOi8vd3d3LnczLm9yZy9HcmFwaGljcy9TVkcvMS4xL0RURC9zdmcxMS5kdGQiPgo8c3ZnIHdpZHRoPSI0MHB4IiBoZWlnaHQ9IjQwcHgiIHZpZXdCb3g9IjAgMCA0MCA0MCIgdmVyc2lvbj0iMS4xIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIiB4bWw6c3BhY2U9InByZXNlcnZlIiBzdHlsZT0iZmlsbC1ydWxlOmV2ZW5vZGQ7Y2xpcC1ydWxlOmV2ZW5vZGQ7c3Ryb2tlLWxpbmVqb2luOnJvdW5kO3N0cm9rZS1taXRlcmxpbWl0OjEuNDE0MjE7IiB4PSIwcHgiIHk9IjBweCI+CiAgICA8ZGVmcz4KICAgICAgICA8c3R5bGUgdHlwZT0idGV4dC9jc3MiPjwhW0NEQVRBWwogICAgICAgICAgICBALXdlYmtpdC1rZXlmcmFtZXMgc3BpbiB7CiAgICAgICAgICAgICAgZnJvbSB7CiAgICAgICAgICAgICAgICAtd2Via2l0LXRyYW5zZm9ybTogcm90YXRlKDBkZWcpCiAgICAgICAgICAgICAgfQogICAgICAgICAgICAgIHRvIHsKICAgICAgICAgICAgICAgIC13ZWJraXQtdHJhbnNmb3JtOiByb3RhdGUoLTM1OWRlZykKICAgICAgICAgICAgICB9CiAgICAgICAgICAgIH0KICAgICAgICAgICAgQGtleWZyYW1lcyBzcGluIHsKICAgICAgICAgICAgICBmcm9tIHsKICAgICAgICAgICAgICAgIHRyYW5zZm9ybTogcm90YXRlKDBkZWcpCiAgICAgICAgICAgICAgfQogICAgICAgICAgICAgIHRvIHsKICAgICAgICAgICAgICAgIHRyYW5zZm9ybTogcm90YXRlKC0zNTlkZWcpCiAgICAgICAgICAgICAgfQogICAgICAgICAgICB9CiAgICAgICAgICAgIHN2ZyB7CiAgICAgICAgICAgICAgICAtd2Via2l0LXRyYW5zZm9ybS1vcmlnaW46IDUwJSA1MCU7CiAgICAgICAgICAgICAgICAtd2Via2l0LWFuaW1hdGlvbjogc3BpbiAxLjVzIGxpbmVhciBpbmZpbml0ZTsKICAgICAgICAgICAgICAgIC13ZWJraXQtYmFja2ZhY2UtdmlzaWJpbGl0eTogaGlkZGVuOwogICAgICAgICAgICAgICAgYW5pbWF0aW9uOiBzcGluIDEuNXMgbGluZWFyIGluZmluaXRlOwogICAgICAgICAgICB9CiAgICAgICAgXV0+PC9zdHlsZT4KICAgIDwvZGVmcz4KICAgIDxnIGlkPSJvdXRlciI+CiAgICAgICAgPGc+CiAgICAgICAgICAgIDxwYXRoIGQ9Ik0yMCwwQzIyLjIwNTgsMCAyMy45OTM5LDEuNzg4MTMgMjMuOTkzOSwzLjk5MzlDMjMuOTkzOSw2LjE5OTY4IDIyLjIwNTgsNy45ODc4MSAyMCw3Ljk4NzgxQzE3Ljc5NDIsNy45ODc4MSAxNi4wMDYxLDYuMTk5NjggMTYuMDA2MSwzLjk5MzlDMTYuMDA2MSwxLjc4ODEzIDE3Ljc5NDIsMCAyMCwwWiIgc3R5bGU9ImZpbGw6YmxhY2s7Ii8+CiAgICAgICAgPC9nPgogICAgICAgIDxnPgogICAgICAgICAgICA8cGF0aCBkPSJNNS44NTc4Niw1Ljg1Nzg2QzcuNDE3NTgsNC4yOTgxNSA5Ljk0NjM4LDQuMjk4MTUgMTEuNTA2MSw1Ljg1Nzg2QzEzLjA2NTgsNy40MTc1OCAxMy4wNjU4LDkuOTQ2MzggMTEuNTA2MSwxMS41MDYxQzkuOTQ2MzgsMTMuMDY1OCA3LjQxNzU4LDEzLjA2NTggNS44NTc4NiwxMS41MDYxQzQuMjk4MTUsOS45NDYzOCA0LjI5ODE1LDcuNDE3NTggNS44NTc4Niw1Ljg1Nzg2WiIgc3R5bGU9ImZpbGw6cmdiKDIxMCwyMTAsMjEwKTsiLz4KICAgICAgICA8L2c+CiAgICAgICAgPGc+CiAgICAgICAgICAgIDxwYXRoIGQ9Ik0yMCwzMi4wMTIyQzIyLjIwNTgsMzIuMDEyMiAyMy45OTM5LDMzLjgwMDMgMjMuOTkzOSwzNi4wMDYxQzIzLjk5MzksMzguMjExOSAyMi4yMDU4LDQwIDIwLDQwQzE3Ljc5NDIsNDAgMTYuMDA2MSwzOC4yMTE5IDE2LjAwNjEsMzYuMDA2MUMxNi4wMDYxLDMzLjgwMDMgMTcuNzk0MiwzMi4wMTIyIDIwLDMyLjAxMjJaIiBzdHlsZT0iZmlsbDpyZ2IoMTMwLDEzMCwxMzApOyIvPgogICAgICAgIDwvZz4KICAgICAgICA8Zz4KICAgICAgICAgICAgPHBhdGggZD0iTTI4LjQ5MzksMjguNDkzOUMzMC4wNTM2LDI2LjkzNDIgMzIuNTgyNCwyNi45MzQyIDM0LjE0MjEsMjguNDkzOUMzNS43MDE5LDMwLjA1MzYgMzUuNzAxOSwzMi41ODI0IDM0LjE0MjEsMzQuMTQyMUMzMi41ODI0LDM1LjcwMTkgMzAuMDUzNiwzNS43MDE5IDI4LjQ5MzksMzQuMTQyMUMyNi45MzQyLDMyLjU4MjQgMjYuOTM0MiwzMC4wNTM2IDI4LjQ5MzksMjguNDkzOVoiIHN0eWxlPSJmaWxsOnJnYigxMDEsMTAxLDEwMSk7Ii8+CiAgICAgICAgPC9nPgogICAgICAgIDxnPgogICAgICAgICAgICA8cGF0aCBkPSJNMy45OTM5LDE2LjAwNjFDNi4xOTk2OCwxNi4wMDYxIDcuOTg3ODEsMTcuNzk0MiA3Ljk4NzgxLDIwQzcuOTg3ODEsMjIuMjA1OCA2LjE5OTY4LDIzLjk5MzkgMy45OTM5LDIzLjk5MzlDMS43ODgxMywyMy45OTM5IDAsMjIuMjA1OCAwLDIwQzAsMTcuNzk0MiAxLjc4ODEzLDE2LjAwNjEgMy45OTM5LDE2LjAwNjFaIiBzdHlsZT0iZmlsbDpyZ2IoMTg3LDE4NywxODcpOyIvPgogICAgICAgIDwvZz4KICAgICAgICA8Zz4KICAgICAgICAgICAgPHBhdGggZD0iTTUuODU3ODYsMjguNDkzOUM3LjQxNzU4LDI2LjkzNDIgOS45NDYzOCwyNi45MzQyIDExLjUwNjEsMjguNDkzOUMxMy4wNjU4LDMwLjA1MzYgMTMuMDY1OCwzMi41ODI0IDExLjUwNjEsMzQuMTQyMUM5Ljk0NjM4LDM1LjcwMTkgNy40MTc1OCwzNS43MDE5IDUuODU3ODYsMzQuMTQyMUM0LjI5ODE1LDMyLjU4MjQgNC4yOTgxNSwzMC4wNTM2IDUuODU3ODYsMjguNDkzOVoiIHN0eWxlPSJmaWxsOnJnYigxNjQsMTY0LDE2NCk7Ii8+CiAgICAgICAgPC9nPgogICAgICAgIDxnPgogICAgICAgICAgICA8cGF0aCBkPSJNMzYuMDA2MSwxNi4wMDYxQzM4LjIxMTksMTYuMDA2MSA0MCwxNy43OTQyIDQwLDIwQzQwLDIyLjIwNTggMzguMjExOSwyMy45OTM5IDM2LjAwNjEsMjMuOTkzOUMzMy44MDAzLDIzLjk5MzkgMzIuMDEyMiwyMi4yMDU4IDMyLjAxMjIsMjBDMzIuMDEyMiwxNy43OTQyIDMzLjgwMDMsMTYuMDA2MSAzNi4wMDYxLDE2LjAwNjFaIiBzdHlsZT0iZmlsbDpyZ2IoNzQsNzQsNzQpOyIvPgogICAgICAgIDwvZz4KICAgICAgICA8Zz4KICAgICAgICAgICAgPHBhdGggZD0iTTI4LjQ5MzksNS44NTc4NkMzMC4wNTM2LDQuMjk4MTUgMzIuNTgyNCw0LjI5ODE1IDM0LjE0MjEsNS44NTc4NkMzNS43MDE5LDcuNDE3NTggMzUuNzAxOSw5Ljk0NjM4IDM0LjE0MjEsMTEuNTA2MUMzMi41ODI0LDEzLjA2NTggMzAuMDUzNiwxMy4wNjU4IDI4LjQ5MzksMTEuNTA2MUMyNi45MzQyLDkuOTQ2MzggMjYuOTM0Miw3LjQxNzU4IDI4LjQ5MzksNS44NTc4NloiIHN0eWxlPSJmaWxsOnJnYig1MCw1MCw1MCk7Ii8+CiAgICAgICAgPC9nPgogICAgPC9nPgo8L3N2Zz4K);
        background-repeat: no-repeat;
        background-position: 50% 50%;
    }
/* --------------------------------------------------------- footer social ------------------------------------------------------ */
#social-footer {
	border-top: dotted black 1px;
	height: 60px; /* hauteur du parent */
	line-height: 60px; /* hauteur de ligne (identique) */
	white-space: nowrap; /* interdiction de passer à la ligne */
	position: absolute;
	bottom: 0;
	left: 0;
	width: 100%;
	background-color: #F3F3F3;
	padding: 10px 0px 0px 0px;/*top-right-bottom-left*/
	margin: 10px 0px 0px 0px;/*top-right-bottom-left*/
}
.ello-button {
	width: 10em;
}
.container {
	height: 30px;
	display: flex;
	align-items: center;
	justify-content: center;
	padding-top: 10px;
}
#social-footer H7 {
padding: 0px 0px 0px 20px;/*top-right-bottom-left-*/
	font-size: 0.8em;
	font-variant: small-caps;
	font-stretch: semi-condensed;
	float: left;
	line-height: 400%;
	border: red;
	position: absolute;
	}
.topof{
  position: relative;
  float: right;
  right: 1em;
  top: -1.2em;
  /* push it up into the element before it. This is a trick for bottom-right */
  right: 1em;
  z-index: 200;
  opacity: 0.5;
	line-height: 2.5em;
text-align: center;
font-size: 1em;
width: 36px;
  }
/* --------------------------------------------------------- logo DO haut de page ------------------------------------------------------ */
.fade {
	z-index: 50;
	cursor: pointer;
	position: fixed;
	width: 105px;
	height: 67px;
	background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAGkAAABDCAYAAACftStqAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAM1JREFUeNrs1rsNgzAUQFETIbnNKBkBCg+USTIQBYzAKGmp8mmipKCIQMagcwoaZOuJKyyHAAAAAAAAsJlq0epuur2el0yzXkOK42q7dVNf9Hxf6oXr34GaTJHOK+/XFD7fx8lhUj6RREIkkTjKFbzPeLubl2K1y/n8SY47REIkkRBJJERCJJEQCZFEQiSRfAKREEkkREIkkRCJH/WOZm1DisNfK1JsZ99102Pz+fxJjjtEQiSRKO12N2ac9b7yfkPh8wEAAAAAAJTgKcAAJrUYadx1o94AAAAASUVORK5CYII=');
	background-repeat: no-repeat;
	opacity: 0;
	transition: opacity .25s ease-in-out;
	-moz-transition: opacity .25s ease-in-out;
	-webkit-transition: opacity .25s ease-in-out;
}
.fade:hover {
 opacity: 0.8;
 }
/* --------------------------------------------------------- highlight #00BBFF body id ------------------------------------------------------ */

body#accueil a#accueil, body#travaux a#travaux, body#ur a#ur, body#form a#form, body#infos a#infos, body#gif a#gif   {
color:#00BBFF;
}
/* --------------------------------------------------------- highlight #00BBFF body id ------------------------------------------------------ */
.undoredo, .DO {
overflow:hidden;
float:left;
width: 100%;
margin: 0px 0px 0px 0px;/*top-right-bottom-left-*/
}
.DO {
	padding-bottom: 70px;
}
* {
margin: 0;
padding: 0;
}
.wrap {
overflow: hidden;
}
.couv, .vignette, .portrait, .big, .affiche, .diapo, .home-gal, .une, .square, .square2 {
overflow: hidden;
float: left;
position: relative;
}		
.inner, .couvInner, .couvv {
position: absolute;
overflow: hidden;
}
.inner {
background-color: #CDCCCC;
}
.couvInner, .couvv {
background-color: #333333;
}
.couv img, .vignette img, .portrait img, .big img, .affiche img, .home-gal img, .une img, .diapo img, .square img, .square2 img{
position: relative;
width: 100%;
height: 100%;
}	
@media all and (max-width : 1200px) {
.ssk-group {
text-align: right;
padding: 17px 16px 20px 0px;/*top-right-bottom-left-*/
position: fixed;
top: 65px;
right: 0px;
z-index: 3;
opacity : 0.90;
display: none;
}
	#topofff {
text-align: right;
padding: 17px 10px 20px 0px;/*top-right-bottom-left-*/
position: fixed;
bottom: 0px;
right: 0px;
z-index: 3;
opacity : 0.90;
display: none;
}
}
@media all and (min-width : 1200px) {
.ssk-group {
text-align: right;
padding: 17px 16px 20px 0px;/*top-right-bottom-left-*/
position: fixed;
top: 65px;
z-index: 3;
opacity : 0.90;
display: none;
margin-left: auto;
margin-right: auto;
width: 1180px;
max-width: 100%;
	}
	#topofff {
text-align: right;
padding: 17px 10px 20px 0px;/*top-right-bottom-left-*/
position: fixed;
bottom: 0px;
z-index: 3;
opacity : 0.90;
display: none;
margin-left: auto;
margin-right: auto;
width: 1180px;
max-width: 100%;
		display: none;
}
}
@media all and (min-width : 481px) {
.propos {
width:50%;
}
.couv {
width: 50%;
padding-bottom: 35%;  
} 
}
@media all and (max-width : 481px) {	
.bleu{
width:84%;
}
.propos {
width:100%;
}
.couv {
width: 100%;
padding-bottom: 68%;   
} 
}  
@media only screen and (max-width : 480px) {
.diapo {
width: 100%;
padding-bottom: 117%;
}  
.big {
width: 100%;
padding-bottom: 68%;   
} 
.affiche {
width: 100%;
padding-bottom: 140%;   
}  
.inner {
left: 5px;
right: 5px;
top: 5px;
bottom: 5px;    
}
.vignette {
width: 100%;
padding-bottom: 68%;
}
.home-gal {
width: 50%;
padding-bottom:34.6%;
}
.couvInner {
left: 0px;
right: 0px;
top: 0px;
bottom: 0px;
}
.wrap {
margin: 5px 5px 5px 5px;
}
}
@media only screen and (max-width : 1200px) and (min-width : 1px) {
.square {
width: 100%;
padding-bottom: 100%;
} 
}
	.square2 {
		width: 100%;
		padding-bottom: 100%;
	}
@media only screen and (max-width : 5000px) and (min-width : 1201px) {
.square {
width: 50%;
padding-bottom: 50%;
} 
}
@media only screen and (max-width : 650px) and (min-width : 481px) {
.propos {
width:99.5%;
}   
.big {
width: 100%;
padding-bottom: 68%;
}  
.affiche {
width: 100%;
padding-bottom: 140%;
}   
.inner {
left: 5px;
right: 5px;
top: 5px;
bottom: 5px;    
}
.vignette {
width: 100%;
padding-bottom: 68%;
} 
.home-gal {
width: 50%;
padding-bottom:34%;
}      
.couvInner {
left: 0px;
right: 0px;
top: 0px;
bottom: 0px;
}  
.wrap {
margin: 5px;/*top-right-bottom-left-*/
}
.info {
width: 100%;
padding-bottom: 30%;
}	
}
@media only screen and (max-width : 5000px) and (min-width : 651px) {
.portrait {
width: 50%;
padding-bottom: 70.5%;
}
}
@media only screen and (max-width : 760px) and (min-width : 481px) {
.diapo {
width: 100%;
padding-bottom: 56%;
}  
}  
@media only screen and (max-width : 5000px) and (min-width : 761px) {
.diapo {
width: 100%;
padding-bottom: 55.5%;
}  
}
@media only screen and (max-width : 650px) and (min-width : 1px) {
.portrait {
width: 100%;
padding-bottom: 142%;
}
}
@media only screen and (max-width : 1050px) and (min-width : 651px) {
.propos {
width:48.7%;
}   
.big {
width: 100%;
padding-bottom: 68%;
} 
.affiche {
width: 50%;
padding-bottom: 70.3%;
}   
.inner {
left: 5px;
right: 5px;
top: 5px;
bottom: 5px;    
}
.vignette {
width: 50%;
padding-bottom: 33.5%;
}  
.home-gal {
width: 33.33%;
padding-bottom: 22.4%;
}      
.couvInner {
left: 0px;
right: 0px;
top: 0px;
bottom: 0px;
} 
.wrap {
margin: 5px;/*top-right-bottom-left-*/
}
.info {
width: 50%;
padding-bottom: 33.5%;
}
.info p {
font-size:1.1em;
line-height: 1.1em;
display:block;
padding: 10px 10px 15px 10px;/*top-right-bottom-left-*/			
}
.info H1 {
font-weight:bold;
font-size: 1.8em;
margin: 0px;/*top-right-bottom-left-*/
padding: 10px 10px 15px 10px;/*top-right-bottom-left-*/
}    
}
@media only screen and (max-width : 1600px) and (min-width : 1051px) {
.big {
width: 100%;
padding-bottom: 68%;
} 
.affiche {
width: 50%;
padding-bottom: 70.3%;
}   
.inner {
left: 5px;
right: 5px;
top: 5px;
bottom: 5px;    
}
.vignette {
width: 33.33%;
padding-bottom: 22.5%;
} 
.home-gal {
width: 25%;
padding-bottom: 17%;
}      
.couvInner {
left: 0px;
right: 0px;
top: 0px;
bottom: 0px;
}   
.wrap {
margin: 5px;/*top-right-bottom-left-*/
}
}
.une {
    width: auto; 
    position: relative;
    margin: 0 auto;
}







/* --------------------------------------------------------- règle d'affichage Une ------------------------------------------------------ */
/*format 1200 x 1600 px*/
/*@media only screen and (max-width : 1920px) and (min-width : 1px) {
.une {
width: 100%;
padding-bottom: 133.3%;
}/*
/*format 1200 x 867 px*/
/*
@media only screen and (max-width : 1920px) and (min-width : 1px) {
.une {
width: 100%;
padding-bottom: 72.5%;
}*/
/*format 1200 x 1267 px*/
@media only screen and (max-width : 5000px) and (min-width : 1px) {
.une {
width: 100%;
padding-bottom: 105.3%;
}
/* ----------------------------------------------------------------------------------------------------------------------------------------- */
	@media only screen and (max-width : 650px) {
		.propos h7 {
		background-position: top;
			margin: 10px 20px 0px 20px;
			padding: 20px 20px 10px 20px;
		}
	}
	@media only screen and (min-width : 650px) {
		.propos h7 {
			background-position: bottom;
			margin: 10px 10px 10px 10px;
			padding: 10px 20px 25px 20px;
		}
	}
@media only screen and (max-width : 5000px) and (min-width : 1601px) {
.big {
width: 100%;
padding-bottom: 68%;
}
.affiche {
width: 50%;
padding-bottom: 70.3%;
}
.inner {
left: 5px;
right: 5px;
top: 5px;
bottom: 5px;
}
.vignette {
width: 33.33%;
padding-bottom: 22.5%;
}
.home-gal {
width: 25%;
padding-bottom: 17%;
}
.couvInner {
left: 0px;
right: 0px;
top: 0px;
bottom: 0px;
}
.wrap {
margin: 5px;/*top-right-bottom-left-*/
}
}
/* --------------------------------------------------------- mediaqueries fin ------------------------------------------------------ */
/* ------------------------------------------------------- pagination Travaux ------------------------------------------------------ */
.pagination {
float:left;
font:12px Arial, Helvetica, sans-serif;
margin:5px 10px 5px 3px;/*top-right-bottom-left-*/
text-align:left;
color:#000;
background-color:none;
padding: 0px;
width: 97%;
} 
.pagination a {
display:inline-block;
padding: 12px 12px 12px 12px;/*top-right-bottom-left-*/
text-decoration: none;
color: #999;
line-height: 100%;
margin: 3px;
} 
.pagination a:hover {
background-color: #F2F2F2;
border:none;
color:#00BBFF;
border-radius: 2px;
text-decoration:none;
}
.pagination span.inactive {
border:none;
color: #CCC;
margin:2px;
padding: 12px;
}
.pagination span.active {
border-radius: 2px;
padding: 3px 12px;	
color: #00BBFF;
padding: 12px 12px 12px 12px;/*top-right-bottom-left-*/
}
/* ------------------------------------------------------- fin pagination Travaux ------------------------------------------------------ */
/* ---------------------------------------------- menu select par type galerie Travaux ---------------------------------------------- */
.nav {
position: relative;
margin: 0px 0px 0px 5px;/*top-right-bottom-left-*/
	font-size: small;
}
.nav ul {
margin: 0;
padding: 0;
}
.nav li {
margin: 10px 0px 10px 0;
padding: 0;
list-style: none;
display: inline-block;
}
.nav a {
padding: 3px 12px;
text-decoration: none;
color: #999;
line-height: 100%;
}
.nav a:hover {
color: #000;
}
.nav .current a {
background: #00BBFF;
color: #fff;
border-radius: 2px;
}
.nav.left ul {
text-align: left;
}
@media screen and (max-width: 600px) {
.nav {
z-index:100;
position: relative;
min-height: 40px;
margin: 0px 3px 0px 0px;/*top-right-bottom-left-*/
}	
.nav ul {
width: 100%;
padding: 5px 0;
position: absolute;
top: 0;
left: 0;
border: solid 1px #aaa;
background: #fff url(img/icon-menu.png) no-repeat 10px 11px;
border-radius: 2px;
box-shadow: 0 1px 2px rgba(0,0,0,.3);
}
.nav li {
display: none; /* hide all <li> items */
margin: 0;
}
.nav .current {
display: block; /* show only current <li> item */
}
.nav a {
display: block;
padding: 5px 5px 5px 32px;
text-align: left;
}
.nav .current a {
background: none;
color: #666;	
}
/* on nav hover */
.nav ul:hover {
background-image: none;
}
.nav ul:hover li {
display: block;
margin: 0 0 5px;
}
.nav ul:hover .current {
background: url(img/icon-check.png) no-repeat 10px 7px;
}
/* right nav */
.nav.right ul {
left: auto;
right: 0;
}	
.nav.left ul {
left: 0;
right: auto;
	z-index: 100;
}
/* center nav */
.nav.center ul {
left: 50%;
margin-left: -90px;
}	
}
/* ---------------------------------------------- fin menu select par type galerie Travaux ---------------------------------------------- */
.propos, .large {
display:block;
float: left;
overflow:hidden;
}
	.propos {
		margin: 0px 0px 20px 0px;/*top-right-bottom-left-*/
	}
	.large {
	background-image: url("img/fil90.gif");
	background-repeat:repeat-x;
	background-position:top;
		width: 100%;
		margin: 0px;
	}
.propos p {
	background-image: url("img/fil90.gif");
	background-repeat:repeat-x;
	background-position:top;
	font-weight: lighter;
	color: #C2C2C2;
	margin: 0px 20px 20px 20px;/*top-right-bottom-left-*/
	padding: 20px 0px 0px 0px;
	text-align: justify;
	font-size: 1em;
	line-height: 21px;
	-webkit-hyphens: auto;
	-webkit-hyphenate-limit-before: 3;
	-webkit-hyphenate-limit-after: 3;
	-webkit-hyphenate-limit-chars: 6 3 3;
	-webkit-hyphenate-limit-lines: 2;
	-webkit-hyphenate-limit-last: always;
	-webkit-hyphenate-limit-zone: 8%;
	-moz-hyphens: auto;
	-moz-hyphenate-limit-chars: 6 3 3;
	-moz-hyphenate-limit-lines: 2;
	-moz-hyphenate-limit-last: always;
	-moz-hyphenate-limit-zone: 8%;
	-ms-hyphens: auto;
	-ms-hyphenate-limit-chars: 6 3 3;
	-ms-hyphenate-limit-lines: 2;
	-ms-hyphenate-limit-last: always;
	-ms-hyphenate-limit-zone: 8%;
	hyphens: auto;
	hyphenate-limit-chars: 6 3 3;
	hyphenate-limit-lines: 2;
	hyphenate-limit-last: always;
	hyphenate-limit-zone: 8%;
}
.propos ul {
margin: 0px 20px 20px 20px;/*top-right-bottom-left-*/
	background-image: url("img/fil90.gif");
	background-repeat:repeat-x;
	background-position:top;
	padding-top: 20px;
}
.propos li {
list-style-type:none;
background-image: url(img/puce.png);
background-repeat: no-repeat;
background-position: 0 0.65em;
padding-left: 15px;
line-height: 21px;
}
.propos h1, .large h1 {
margin: 10px 0px 0px 0px;
padding: 10px 20px 25px 20px;
display:block;
font-size:26px;
width:auto;
font-variant:small-caps;
font-weight: normal;
word-spacing: 1pt;
letter-spacing: 0.5pt;
}
.blue {
	color:#00BBFF;
}
	.noir {
		color:#2A2A2A;
	}
	.propos h7 {
		display:block;
		color: #4E4E4E;
		font-size:12px;
		width:auto;
		font-weight:lighter;
		word-spacing: 1pt;
		letter-spacing: 0.5pt;
		text-align: right;
		background-image: url("img/fil90.gif");
		background-repeat:repeat-x;
	}
hr {
clear:both;
height: 1px;
border: 0;
background-image: url("img/fil80.gif");
background-repeat:repeat-x;
margin: 0px 0px 0px 0px;/*top-right-bottom-left-*/
}
.bleu{
text-align: center;
margin: 0px 0px 10px 20px;
padding: 10px 10px 10px 10px;
display:block;
	float: left;
cursor:pointer;
-moz-box-shadow:inset 0px 1px 0px 0px #00BBFF;
-webkit-box-shadow:inset 0px 1px 0px 0px #00BBFF;
box-shadow:inset 0px 1px 0px 0px #00BBFF;
background-color:#00BBFF;
-webkit-border-radius:2px;
-moz-border-radius:2px;
border-radius:2px;
border:1px solid #00BBFF;
color:#252525;
font-family:Arial;
font-size:14px;
font-weight:normal;  -o-transition:.5s;
}
.liens:hover, .bleu:hover, .lien-text:hover {
color: #FAFAFA;
}
	.lien-text {
		font-size: 1em;
		line-height: 21px;
		word-break: break-word;
		-webkit-hyphens: auto;
		-moz-hyphens: auto;
		-ms-hyphens: auto;
		-o-hyphens: auto;
		hyphens: auto;
		color: #00BBFF;
	}

.liens, .liens-index, .liens-prec, .liens-suiv, .liens-prec-off, .pdf-iphone, .pdf-tablet, .pdf-defaut {
margin: 5px 5px 5px 5px;/*top-right-bottom-left-*/
padding: 10px 0px 10px 25px;/*top-right-bottom-left-*/
cursor:pointer;
background-color:#00BBFF;
color:#F9F9F9;
font-family:Arial;
font-size:12px;
width:auto;
font-weight:normal;
}
.liens-suiv, .liens-suiv-off {
margin: 5px 5px 5px 5px;/*top-right-bottom-left-*/
padding: 10px 25px 10px 0px;/*top-right-bottom-left-*/
}
.liens-index {
background:url("img/index.gif") no-repeat;
background-position: center left;
}
.liens-prec {
background:url("img/prec.gif") no-repeat;
background-position: center left;
}
.liens-suiv {
background:url("img/suiv.gif") no-repeat;
background-position: center right;
}
.liens-suiv-off {
background:url("img/suiv-off.gif") no-repeat;
cursor:default;
width:36px;
	height: 34px;
	display: inline-block;
}
.liens-prec-off {
background:url("img/prec-off.gif") no-repeat;
cursor:default;
display: inline-block;
	float: left;
	width:36px;
	height: 34px;

}
.liens-index:hover,.liens-prec:hover,.liens-suiv:hover, .pdf-iphone:hover, .pdf-tablet:hover, .pdf-defaut:hover  {
color: #259cc7;
}
/*  ------------------------------------- Responsive Menu Header --------------------------------------   */
.menu {
	font-weight: bold;
	letter-spacing: 1px;
	font-family: 'Baloo Tammudu 2';
font-variant: small-caps;
padding: 0em;
min-height: 67px;
line-height: 2.1em;
}
.menu ul {
transition: max-height 0.15s linear;
margin: 15px 10px 10px 10px;/*top-right-bottom-left-*/
padding: 0;
text-align: right;	
}
.menu li {
transition: visibility .25s linear;
display: inline-block;
padding: 4px 12px 1px 1px;/*top-right-bottom-left-*/
}
@media (max-width: 650px) {
.menu ul {
max-height: 0;
overflow: hidden;
margin: 69px 0px 0px 0px;/*top-right-bottom-left-*/	
}
.menu li {
visibility: hidden;
display: block;
margin-bottom:1px;
padding: 12px 15px 8px 15px;/*top-right-bottom-left-*/
border: none;
background-color: #FAFAFA;
font-variant: small-caps;
font-size: 16px;	
}	
.menu .navbar-handle {
display: block;
}
#navbar-checkbox:checked + .menu ul {
max-height: 500px;
}
#navbar-checkbox:checked + .menu li {
visibility: visible;
}
}
.navbar-checkbox {
display: none;
}
.navbar-handle {
display: none;
cursor: pointer;
position: fixed;
font-size: 45px;
padding: 5px 7px 4px 4px;/*top-right-bottom-left-*/
height: 0;
width: 1.66666667em;
}
.navbar-handle:before,
.navbar-handle:after {
position: absolute;
left: 0;
right: 0;
content: 'menu';
}
.navbar-handle:before {
}
.navbar-handle:after {
}
.menu {
background-attachment:scroll;
background-repeat: no-repeat;
background-color: none;
/*position: fixed;*/
z-index:20;
float:left;
width: 1200px;
margin-bottom: 1px;
max-width: 100%;
height: 67px;
	cursor: pointer;
	top: 0;
}
.menu {
background-attachment:scroll;
background-repeat: no-repeat;
background-color: none;
position:fixed;
z-index:20;
float:left;
width: 1200px;
margin-bottom: 1px;
max-width: 100%;
height: 67px;
	cursor: pointer;
	background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAABLAAAABDCAYAAACMaPxrAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAqBJREFUeNrs3cFpG0EYgFErqAWxx7TgDmxVknQSp4K0YFcSpQO34OOwl3Sg7CFHrQRRsD/BezCXHUb8WnT6YNBmHuN4BwAAAABRn7wCAAAAAMoELAAAAADSBCwAAAAA0gQsAAAAANIELAAAAADSBCwAAAAA0gQsAAAAANIELAAAAADSBCwAAAAA0gQsAAAAANIELAAAAADSBCwAAAAA0gQsAAAAANIELAAAAADStleePyzr1zvN+u0/f97zst7C8wEAAACw2MxjHK84/303TU/vMeiVc56yX2Y/hOcDAAAA4M4VQgAAAADiBCwAAAAA0gQsAAAAANIELAAAAADSBCwAAAAA0rY3NOt+5fn9sn6s7D0v62Vl7zUwHwAAAAAX3EzA2k3T4dTzeYxzx97WzkXmAwAAAOACVwgBAAAASBOwAAAAAEgTsAAAAABIE7AAAAAASBOwAAAAAEgTsAAAAABIE7AAAAAASBOwAAAAAEgTsAAAAABIE7AAAAAASBOwAAAAAEgTsAAAAABIE7AAAAAASBOwAAAAAEgTsAAAAABIE7AAAAAASBOwAAAAAEgTsAAAAABIE7AAAAAASBOwAAAAAEjb3sqg8xiPK1v3Z459PnPudTdNvz94PgAAAAAu2N7QrD//4czXv+uU/bIOHzwfAAAAABe4QggAAABAmoAFAAAAQJqABQAAAECagAUAAABAmoAFAAAAQNq1/0L4MI/xdKPf/csy+6OfAAAAAEDbZh7j6DUAAAAAUOUKIQAAAABpAhYAAAAAaQIWAAAAAGkCFgAAAABpAhYAAAAAaQIWAAAAAGkCFgAAAABpAhYAAAAAaQIWAAAAAGkCFgAAAABpAhYAAAAAaQIWAAAAAGkCFgAAAABpAhYAAAAAaX8EGABwUjzJDccoIQAAAABJRU5ErkJggg==');
}
.menu .navbar-handle {
position: absolute;
font-size: 1.2em;
top: 0.7em;
right: 12px;
z-index: 10;
}
.menu a {
background: none;
color: #242424;
-o-transition:.5s;
-ms-transition:.5s;
-moz-transition:.5s;
-webkit-transition:.5s;
transition:.5s;
}
/* on nav hover */
.menu a:hover {
color: #00BBFF;
}



/*  ------------------------------------- Responsive slideShow --------------------------------------   */
.rslides {
position: relative;
list-style: none;
overflow: hidden;
width: 100%;
padding: 0;
margin: 0;
}
.rslides li {
-webkit-backface-visibility: hidden;
position: absolute;
display: none;
width: 100%;
left: 0;
top: 0;
}
.rslides li:first-child {
position: relative;
display: block;
float: left;
}
.rslides img {
display: block;
height: auto;
float: left;
width: 100%;
border: 0;
}
#wrapper {
overflow: hidden;
background-color: #252525;
margin-top: 0;
width: 100%;
max-height: 800px;
}
.rslides {
margin: 0 auto;
}
.rslides_container {
position: relative;  
float: left;
width: 100%;
}
.centered-btns_nav {
z-index: 3;
position: absolute;
-webkit-tap-highlight-color: rgba(0,0,0,0);
top: 62%;
left: 0;
opacity: 0.9;
text-indent: -9999px;
overflow: hidden;
text-decoration: none;
height: 36px;
width: 36px;
background: transparent url("img/themes.gif") no-repeat left top;
margin-top: -45px;
}
.centered-btns_nav:active {
opacity: 1.0;
}
.centered-btns_nav.next {
left: auto;
background-position: right top;
right: 0;
}
.centered-btns_nav:focus {
outline: none;
}
.centered-btns_tabs {
margin-top: 10px;
text-align: center;
}
.centered-btns_tabs li {
display: inline;
float: none;
_float: left;
*float: left;
margin-right: 5px;
}
.centered-btns_tabs a {
text-indent: -9999px;
overflow: hidden;
-webkit-border-radius: 15px;
-moz-border-radius: 15px;
border-radius: 15px;
background: #ccc;
background: rgba(0,0,0, .2);
display: inline-block;
_display: block;
*display: block;
-webkit-box-shadow: inset 0 0 2px 0 rgba(0,0,0,.3);
-moz-box-shadow: inset 0 0 2px 0 rgba(0,0,0,.3);
box-shadow: inset 0 0 2px 0 rgba(0,0,0,.3);
width: 9px;
height: 9px;
}
.centered-btns_here a {
background: #222;
background: rgba(0,0,0, .8);
}
/* ---------------------------------------------- Pinit Pinterest CSS bouton ---------------------------------------------- */
.pinterest-anchor {
margin-left:10px;
margin-top:10px;
position:absolute;
z-index:1;
width:40px;
height:40px;
-webkit-filter: drop-shadow(2px 2px 2px #505050);
filter: drop-shadow(2px 2px 2px #505050);
opacity: .8; 
}
.pinterest-hidden {
display:none;
}
.pinterest-anchor:hover {
display:block !important;
}
.pinterest-logo {
background: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACgAAAAoCAYAAACM/rhtAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyNpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuNi1jMTQwIDc5LjE2MDQ1MSwgMjAxNy8wNS8wNi0wMTowODoyMSAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENDIChNYWNpbnRvc2gpIiB4bXBNTTpJbnN0YW5jZUlEPSJ4bXAuaWlkOjg5ODk0QzdERjNCQjExRTc5MEE4RTdBNzU3MTk4QjgyIiB4bXBNTTpEb2N1bWVudElEPSJ4bXAuZGlkOjg5ODk0QzdFRjNCQjExRTc5MEE4RTdBNzU3MTk4QjgyIj4gPHhtcE1NOkRlcml2ZWRGcm9tIHN0UmVmOmluc3RhbmNlSUQ9InhtcC5paWQ6ODk4OTRDN0JGM0JCMTFFNzkwQThFN0E3NTcxOThCODIiIHN0UmVmOmRvY3VtZW50SUQ9InhtcC5kaWQ6ODk4OTRDN0NGM0JCMTFFNzkwQThFN0E3NTcxOThCODIiLz4gPC9yZGY6RGVzY3JpcHRpb24+IDwvcmRmOlJERj4gPC94OnhtcG1ldGE+IDw/eHBhY2tldCBlbmQ9InIiPz5Mtzm+AAANrklEQVR42qRYC3Bc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");
no-repeat: center center;
background-size: 40px 40px;
height: 100%;
width: 100%;
}
```
The animating part, showing and hiding the logo on hovering the picture, is handled in JavaScript, using jQuery notation.
```
$("img[data-pin='pinIt']").each(function() {
    $(this).hover(function() {
        $(this).prev().css("display", "block")
    }, function() {
        $(this).prev().css("display", "none")
    });
});
/* ---------------------------------------------- Pinit Pinterest CSS bouton ---------------------------------------------- */
/* ---------------------------------------------- gif gallerie ---------------------------------------------- */
canvas {
padding: 0;
margin: 0;
}
.animgif_wrapper {
position: relative;
display: inline-block;
max-width: 100% !important;
min-height: 100px;
}
.animgif_wrapper img, .animgif_wrapper canvas {
max-width: 100% !important;
float: left;
height: auto !important;
}
.animgif_wrapper.off:before {
cursor: pointer;
content: "";
display: block;
position: absolute;
z-index: 1;
top: 0px;
left: 0px;
bottom: 0px;
right: 0px;
background-color: none;
background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACQAAAAkCAYAAADhAJiYAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAVFJREFUeNrMmO0NgjAQhivpAC5gghvoBq7gBjKBOIEygTiBjMAGsoFsQBMXcAO9mtY0pCBCe703uSZt+PHkPnpHZ8zU9bGCdQ/2BLuwZCEYsmYtoAbW2DgpwA4A9sQCilr7uLXfgTUAegrloVfPtzJ8CXirogKkVSkwgRGyIdqoMJ7B5hSAtFIFloYOmU21qsaKCpBWqcAEFSCtDCwfc39Fnqr3qPJrRwVISlbgFaBuYJvQIbOp+ITyR3759BCztKH7rzaE6aF2G5LVWFIBMtuQBKtDhKyrDd3NagwN9I0NNSBGDSihAiSTeg1JXegDHgiks+yxgfTfTOfliAk0qHVwpDzJhg5v3HN4DmbChgQaPaC5Bpo8wroCcjbkcwd5IhM2d+XiKUC5gnH6EMFHlrG3X+l/gFAeG/jAPOm97n2OH8Jy3S+xYGwe2rLAT3pvAQYAH0F1k8cZMPIAAAAASUVORK5CYII=");
background-repeat: no-repeat;
background-size: 7% 10%;
background-position: 50% 50%;
}
.fadeIn {
-webkit-box-shadow: 0px 0px 5px #333;
-moz-box-shadow: 0px 0px 5px #333;
-ms-box-shadow: 0px 0px 5px #333;
-o-box-shadow: 0px 0px 5px #333;
box-shadow: 0px 0px 5px #333;
opacity:0;
-webkit-animation:fadeIn ease-in 1;
-moz-animation:fadeIn ease-in 1;
-o-animation:fadeIn ease-in 1;
animation:fadeIn ease-in 1;
-webkit-animation-fill-mode:forwards;
-moz-animation-fill-mode:forwards;
-o-animation-fill-mode:forwards;
animation-fill-mode:forwards;
}
.fadeIn-1s {
-webkit-animation-duration:1s;
-moz-animation-duration:1s;
-o-animation-duration:1s;
animation-duration:1s;
}
	.fadeIn-2s {
-webkit-animation-duration:2s;
-moz-animation-duration:2s;
-o-animation-duration:2s;
animation-duration:2s.
}
.fadeIn-3s {
-webkit-animation-duration:3s;
-moz-animation-duration:3s;
-o-animation-duration:3s;
animation-duration:3s;
}
.fadeIn-5s {
-webkit-animation-duration:5s;
-moz-animation-duration:5s;
-o-animation-duration:5s;
animation-duration:5s;
}
/* Animation Delay - Time for image to be delayed
---------------------------------------------------- */
.fadeIn-Delay-1s {
-webkit-animation-delay:1s;
-moz-animation-delay:1s;
-o-animation-delay:1s;
animation-delay:1s;
}
	.fadeIn-Delay-2s {
-webkit-animation-delay:2s;
-moz-animation-delay:2s;
-o-animation-delay:2s;
animation-delay:2s;
}
.fadeIn-Delay-3s {
-webkit-animation-delay:3s;
-moz-animation-delay:3s;
-o-animation-delay:3s;
animation-delay:3s;
}
.fadeIn-Delay-5s {
-webkit-animation-delay:5s;
-moz-animation-delay:5s;
-o-animation-delay:5s;
animation-delay:5s;
}
/* Key Frames
---------------------------------------------------- */
@-webkit-keyframes fadeIn { from { opacity:0; } to { opacity:1; } }
@-moz-keyframes fadeIn { from { opacity:0; } to { opacity:1; } }
@-o-keyframes fadeIn { from { opacity:0; } to { opacity:1; } }
@keyframes fadeIn { from { opacity:0; } to { opacity:1; } }
@keyframes fadeIn { from { opacity:0; } to { opacity:1; } }