@charset "UTF-8";
@import url(http://fonts.googleapis.com/css?family=Roboto+Condensed:300,700,400);
/*******************************/
/* -------- CSS RESET -------- */
/*******************************/
/* -------- GLOBAL -------- */
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,
img,
ins,
kbd,
q,
s,
samp,
small,
strike,
strong,
sub,
sup,
tt,
var,
b,
u,
i,
center,
dl,
dt,
dd,
ol,
ul,
li,
fieldset,
form,
label,
legend,
table,
caption,
tbody,
tfoot,
thead,
tr,
th,
td,
article,
aside,
canvas,
details,
embed,
figure,
figcaption,
header,
footer,
menu,
nav,
output,
ruby,
section,
summary,
time,
mark,
audio,
video {
  margin: 0;
  padding: 0;
  border: 0;
}
body {
  line-height: 1;
}
table {
  border-collapse: collapse;
  border-spacing: 0;
  margin: 0 50px;
}
table thead {
  background-color: #ece8e6;
  border-bottom: 1px #cccccc solid;
  border-top: 1px #cccccc solid;
}
table th {
  padding: 10px 5px;
  line-height: 22px;
  text-align: justify;
}
table th:first-child {
  border-left: 1px #cccccc solid;
}
table th:last-child {
  border-right: 1px #cccccc solid;
}
table td {
  padding: 10px 5px;
  line-height: 22px;
  text-align: justify;
  border-left: 1px #cccccc solid;
  border-right: 1px #cccccc solid;
  border-bottom: 1px #cccccc solid;
}
fieldset,
img,
input,
textarea {
  border: 0;
}
address,
caption,
cite,
code,
dfn,
em,
strong,
th,
var {
  font-style: normal;
  font-weight: normal;
}
ol,
ul,
li {
  list-style: none;
}
caption,
th {
  text-align: left;
}
h1,
h2,
h3,
h4,
h5,
h6 {
  font-size: 100%;
  font-weight: normal;
}
abbr,
acronym {
  border: 0;
  font-variant: normal;
}
input,
textarea,
select {
  font-family: inherit;
  font-weight: inherit;
  font-size: 100%;
  margin: 0;
  padding: 0;
}
legend {
  color: #000;
}
a,
img,
input,
textarea,
select {
  outline: none;
}
textarea {
  overflow: auto;
}
input[type=submit],
input[type=checkbox] {
  cursor: pointer;
}
input[type=submit] {
  background: 0;
}
article,
aside,
details,
figcaption,
figure,
footer,
header,
menu,
nav,
section {
  display: block;
}
/* -------- MOBILE -------- */
html,
body,
form,
fieldset,
p,
div,
h1,
h2,
h3,
h4,
h5,
h6 {
  -webkit-text-size-adjust: none;
}
a,
input {
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}
input[type=text],
input[type=tel],
input[type=submit] {
  -webkit-appearance: none;
  -webkit-border-radius: 0px;
  border-radius: 0;
}
/***************************/
/* -------- FONTS -------- */
/***************************/
/****************************/
/* -------- MIXINS -------- */
/****************************/
/* Cubic */
/* Circ */
/* Expo */
/* Quad */
/* Quart */
/* Quint */
/* Sine */
/* Back */
/*******************************/
/* -------- VARIABLES -------- */
/*******************************/
/* -------- TAILLES -------- */
/* -------- COULEURS -------- */
/***********************************/
/* -------- MISE EN FORME -------- */
/***********************************/
/* -------- GLOBAL -------- */
*,
*:before,
*:after {
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}
::-moz-selection {
  background-color: #005cae;
  color: #ffffff;
}
::selection {
  background-color: #005cae;
  color: #ffffff;
}
body {
  position: absolute;
  width: 100%;
  min-width: 980px;
  height: 100%;
  min-height: 600px;
  font-size: 14px;
  line-height: 1.3em;
  font-family: 'Roboto Condensed', Arial, sans-serif;
  -webkit-font-smoothing: subpixel-antialiased;
  /*-webkit-font-smoothing:antialiased;*/
  color: #666666;
  background-color: #ffffff;
}
a {
  text-decoration: none;
  -webkit-transition-duration: 0.3s;
  -webkit-transition-timing-function: cubic-bezier(0.25, 0.46, 0.45, 0.94);
  -moz-transition-duration: 0.3s;
  -moz-transition-timing-function: cubic-bezier(0.25, 0.46, 0.45, 0.94);
  transition-duration: 0.3s;
  transition-timing-function: cubic-bezier(0.25, 0.46, 0.45, 0.94);
}
button {
  padding: 0;
  border: 0;
  background: none;
  -webkit-transition-duration: 0.3s;
  -webkit-transition-timing-function: cubic-bezier(0.25, 0.46, 0.45, 0.94);
  -moz-transition-duration: 0.3s;
  -moz-transition-timing-function: cubic-bezier(0.25, 0.46, 0.45, 0.94);
  transition-duration: 0.3s;
  transition-timing-function: cubic-bezier(0.25, 0.46, 0.45, 0.94);
}
button::-moz-focus-inner {
  border: 0;
}
/*.centrer { width:@largContenu; margin:uto;  }*/
.hidden {
  display: none;
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
  filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0);
  opacity: 0;
}
.light {
  font-weight: 300;
}
.bold {
  font-weight: bold;
}
.georgia {
  font-family: 'Georgia', serif;
  font-style: italic;
}
.clear {
  clear: both;
}
/*///////////////////////////////
---------------------------------
--------------LOADER-------------
---------------------------------
///////////////////////////////*/
#loader-wrapper {
  top: 0px;
  text-align: center;
  vertical-align: middle;
  margin: 0px auto;
  width: 100%;
  height: 100%;
  position: fixed;
  opacity: 1;
  z-index: 10;
  background-color: #ffffff;
  bottom: 0;
  left: 0;
  right: 0;
}
#halobleuhaut {
  height: 442px;
  width: 489px;
  position: absolute;
  top: 50%;
  margin-top: -250px;
  left: 50%;
  margin-left: -248px;
  background: -moz-radial-gradient(center, ellipse cover, rgba(192, 206, 211, 0.65) 20%, rgba(192, 206, 211, 0) 57%);
  /* FF3.6+ */
  background: -webkit-gradient(radial, center center, 0px, center center, 100%, color-stop(20%, rgba(192, 206, 211, 0.65)), color-stop(57%, rgba(192, 206, 211, 0)));
  /* Chrome,Safari4+ */
  background: -webkit-radial-gradient(center, ellipse cover, rgba(192, 206, 211, 0.65) 20%, rgba(192, 206, 211, 0) 57%);
  /* Chrome10+,Safari5.1+ */
  background: -o-radial-gradient(center, ellipse cover, rgba(192, 206, 211, 0.65) 20%, rgba(192, 206, 211, 0) 57%);
  /* Opera 12+ */
  background: -ms-radial-gradient(center, ellipse cover, rgba(192, 206, 211, 0.65) 20%, rgba(192, 206, 211, 0) 57%);
  /* IE10+ */
  background: radial-gradient(ellipse at center, rgba(192, 206, 211, 0.65) 20%, rgba(192, 206, 211, 0) 57%);
  /* W3C */
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#a6c0ced3', endColorstr='#00c0ced3', GradientType=1);
  /* IE6-9 fallback on horizontal gradient */
}
#halobleubas {
  height: 200px;
  width: 309px;
  position: absolute;
  top: 50%;
  left: 50%;
  margin-left: -154.5px;
  background: -moz-radial-gradient(center, ellipse cover, rgba(177, 208, 239, 0.65) 20%, rgba(192, 206, 211, 0) 57%);
  /* FF3.6+ */
  background: -webkit-gradient(radial, center center, 0px, center center, 100%, color-stop(20%, rgba(177, 208, 239, 0.65)), color-stop(57%, rgba(192, 206, 211, 0)));
  /* Chrome,Safari4+ */
  background: -webkit-radial-gradient(center, ellipse cover, rgba(177, 208, 239, 0.65) 20%, rgba(192, 206, 211, 0) 57%);
  /* Chrome10+,Safari5.1+ */
  background: -o-radial-gradient(center, ellipse cover, rgba(177, 208, 239, 0.65) 20%, rgba(192, 206, 211, 0) 57%);
  /* Opera 12+ */
  background: -ms-radial-gradient(center, ellipse cover, rgba(177, 208, 239, 0.65) 20%, rgba(192, 206, 211, 0) 57%);
  /* IE10+ */
  background: radial-gradient(ellipse at center, rgba(177, 208, 239, 0.65) 20%, rgba(192, 206, 211, 0) 57%);
  /* W3C */
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#a6b1d0ef', endColorstr='#00c0ced3', GradientType=1);
  /* IE6-9 fallback on horizontal gradient */
}
#haloblanc {
  position: absolute;
  z-index: 22;
  left: 50%;
  width: 137px;
  height: 105px;
  top: 50%;
  margin-top: -83.7px;
}
#montagne {
  position: absolute;
  z-index: 23;
  top: 50%;
  left: 50%;
  margin-left: -199px;
}
#counter {
  position: absolute;
  z-index: 21;
  top: 50%;
  left: 50%;
  margin-left: -248px;
  height: 442px;
  width: 489px;
  margin-top: -250px;
}
#counter #status {
  font-family: "Roboto Condensed", Arial, sans-serif;
  font-weight: 300;
  color: #FFF;
  font-size: 10em;
  position: relative;
  top: 50%;
}
#drip {
  position: absolute;
  top: 55%;
  left: 50%;
  display: block;
  width: 200px;
  height: 18px;
  background: #A0BBD3;
  border-radius: 50%;
  -o-transform: translate(-50%, 400%);
  -webkit-transform: translate(-50%, 400%);
  transform: translate(-50%, 400%);
  z-index: 25;
  opacity: 0.7;
}
#drip:before,
#drip:after {
  content: '';
  position: absolute;
  top: 50%;
  left: 50%;
  width: 100%;
  height: 100%;
  background: #A0BBD3;
  border-radius: 50%;
  opacity: 0.5;
  -o-transform: translate(-50%, -50%) scale(1);
  -webkit-transform: translate(-50%, -50%) scale(1);
  transform: translate(-50%, -50%) scale(1);
  -o-animation: ripple 1s infinite ease-in;
  -webkit-animation: ripple 1s infinite ease-in;
  animation: ripple 1s infinite ease-in;
}
#drip:after {
  width: 15px;
  height: 15px;
  border-radius: 0 50% 50%;
  -o-transform: translate(-50%, -1000%) rotate(45deg);
  -webkit-transform: translate(-50%, -1000%) rotate(45deg);
  transform: translate(-50%, -1000%) rotate(45deg);
  -o-animation: drip 1s infinite ease-in;
  -webkit-animation: drip 1s infinite ease-in;
  animation: drip 1s infinite ease-in;
}
@keyframes ripple {
  0% {
    -o-transform: translate(-50%, -50%) scale(1);
    -webkit-transform: translate(-50%, -50%) scale(1);
    transform: translate(-50%, -50%) scale(1);
    opacity: 0.5;
  }
  100% {
    -o-transform: translate(-50%, -50%) scale(2);
    -webkit-transform: translate(-50%, -50%) scale(2);
    transform: translate(-50%, -50%) scale(2);
    opacity: 0;
  }
}
@keyframes drip {
  0% {
    -o-transform: translate(-50%, -1000%) rotate(45deg);
    -webkit-transform: translate(-50%, -1000%) rotate(45deg);
    transform: translate(-50%, -1000%) rotate(45deg);
    opacity: 0;
  }
  50% {
    -o-transform: translate(-50%, -1000%) rotate(45deg);
    -webkit-transform: translate(-50%, -1000%) rotate(45deg);
    transform: translate(-50%, -1000%) rotate(45deg);
    opacity: 1;
  }
  100% {
    -o-transform: translate(-50%, 0) rotate(45deg);
    -webkit-transform: translate(-50%, 0) rotate(45deg);
    transform: translate(-50%, 0) rotate(45deg);
  }
}
/* -------- HEADER -------- */
/* -------- NAV -------- */
#menu {
  position: fixed;
  top: 0;
  bottom: 0;
  left: 0;
  /* left:-240px; */
  width: 240px;
  background: url(../img/menu-bg.png) center bottom no-repeat #ffffff;
  text-align: center;
  border-right: 1px solid #dddddd;
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
  filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0);
  opacity: 0;
  -webkit-transform-origin: 0px 120px;
  -moz-transform-origin: 0px 120px;
  -o-transform-origin: 0px 120px;
  -ms-transform-origin: 0px 120px;
  transform-origin: 0px 120px;
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
  -webkit-transform: perspective(400px) rotateY(180deg);
  -moz-transform: perspective(400px) rotateY(180deg);
  -ms-transform: perspective(400px) rotateY(180deg);
  transform: perspective(400px) rotateY(180deg);
  z-index: 10;
}
.background {
  position: fixed;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  background: #000000;
  display: none;
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
  filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0);
  opacity: 0;
}
#menu-background {
  z-index: 9;
}
#menu-logo {
  display: block;
  width: 113px;
  margin: 40px auto;
}
.level-1 {
  position: relative;
}
.level-1 > li > a {
  cursor: default;
}
.level-2,
.level-3,
.level-4 {
  position: absolute;
  left: 240px;
  top: 0;
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
  filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0);
  opacity: 0;
  -webkit-transform-origin: 0px 120px;
  -moz-transform-origin: 0px 120px;
  -ms-transform-origin: 0px 120px;
  transform-origin: 0px 120px;
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
  -webkit-transform: perspective(400px) rotateY(180deg);
  -moz-transform: perspective(400px) rotateY(180deg);
  -ms-transform: perspective(400px) rotateY(180deg);
  transform: perspective(400px) rotateY(180deg);
  -webkit-transition-delay: 0.2s;
  -moz-transition-delay: 0.2s;
  -ms-transition-delay: 0.2s;
  transition-delay: 0.2s;
  -webkit-transition-duration: 0.3s;
  -webkit-transition-timing-function: cubic-bezier(0.25, 0.46, 0.45, 0.94);
  -moz-transition-duration: 0.3s;
  -moz-transition-timing-function: cubic-bezier(0.25, 0.46, 0.45, 0.94);
  transition-duration: 0.3s;
  transition-timing-function: cubic-bezier(0.25, 0.46, 0.45, 0.94);
  background: #ece8e6;
}
.menu-level-bg {
  position: fixed;
  top: -240px;
  width: 240px;
  border-right: 1px solid #dddddd;
  background: #ece8e6;
}
.menu-item {
  /*position:relative;*/
  width: 240px;
  z-index: 10;
}
.menu-item:first-child > a {
  border-top: 1px solid #dddddd;
}
.menu-item:hover > .menu-level {
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
  filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=100);
  opacity: 1;
  -webkit-transform: rotateY(0deg);
  -moz-transform: rotateY(0deg);
  -ms-transform: rotateY(0deg);
  transform: rotateY(0deg);
}
.menu-item:hover > a {
  background: #ffffff;
}
.menu-item .menu-item-bg {
  position: absolute;
  width: 100%;
  height: 100%;
  top: -80px;
  left: 0;
  background: #05a0d0;
  z-index: -1;
}
.menu-item a {
  position: relative;
  display: block;
  width: 240px;
  height: 80px;
  padding: 0 40px 0 20px;
  line-height: 20px;
  color: #5887ad;
  text-align: left;
  font-weight: bold;
  text-transform: uppercase;
  border-bottom: 1px solid #dddddd;
  overflow: hidden;
  z-index: 12;
}
.menu-item a .menu-text {
  display: table-cell;
  vertical-align: middle;
  height: 80px;
}
.menu-item a:after {
  position: absolute;
  content: '';
  width: 40px;
  height: 40px;
  top: 30px;
  right: 15px;
  /*right:-40px;*/
  background: url(../img/drops.png) 0 0 no-repeat;
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
  filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0);
  opacity: 0;
  -webkit-transition-duration: 0.3s;
  -webkit-transition-timing-function: cubic-bezier(0.25, 0.46, 0.45, 0.94);
  -moz-transition-duration: 0.3s;
  -moz-transition-timing-function: cubic-bezier(0.25, 0.46, 0.45, 0.94);
  transition-duration: 0.3s;
  transition-timing-function: cubic-bezier(0.25, 0.46, 0.45, 0.94);
}
.menu-item a:hover {
  color: #ffffff;
}
.menu-item a:hover:after {
  top: 20px;
  right: 5px;
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
  filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=100);
  opacity: 1;
}
#menu-btn {
  position: fixed;
  top: 25px;
  left: 25px;
  height: 27px;
  line-height: 22px;
  padding-left: 46px;
  background: url(../img/menu-icon.png) 0 0 no-repeat;
  font-size: 16px;
  color: #ffffff;
  text-transform: uppercase;
  cursor: pointer;
  z-index: 6;
  text-shadow: 1px 1px 1px rgba(145, 145, 145, 0.9);
}
/*///////////////////////////////
---------------------------------
--------LANDSCAPE-LAYOUT---------
---------------------------------
///////////////////////////////*/
/*-------------------------
    MISE EN FORME DES PAGES PROTECTION & PROTECTION NATURE
------------------------------*/
#protection h1 {
  position: relative;
  z-index: 9;
}
#protection-nature .landscape-title {
  position: relative;
  z-index: 9;
}
#protection-apieme .landscape-title {
  position: relative;
  z-index: 9;
}
#landscape-protection {
  width: 120%;
  height: 100%;
  left: 50%;
  top: -22px;
  position: absolute;
  background: url(../img/panoramic/protection.jpg) no-repeat center center;
  background-size: cover;
  -webkit-transform: translate(-50%, 0%);
  -moz-transform: translate(-50%, 0%);
  -ms-transform: translate(-50%, 0%);
  -o-transform: translate(-50%, 0%);
}
#landscape-protectionnature {
  width: 120%;
  height: 100%;
  left: 50%;
  top: -22px;
  position: absolute;
  background: url(../img/panoramic/protection-nature.jpg) no-repeat center center;
  background-size: cover;
  -webkit-transform: translate(-50%, 0%);
  -moz-transform: translate(-50%, 0%);
  -ms-transform: translate(-50%, 0%);
  -o-transform: translate(-50%, 0%);
}
#landscapehome {
  width: 120%;
  height: 100%;
  position: absolute;
  left: 50%;
  background: url(../img/panoramic/home.jpg) no-repeat center center;
  background-size: cover;
  -webkit-transform: translate(-50%, 0%);
  -moz-transform: translate(-50%, 0%);
  -ms-transform: translate(-50%, 0%);
  -o-transform: translate(-50%, 0%);
}
/* -------- CONTENU -------- */
#landscape-container {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: #9eceda;
  overflow: hidden;
}
#logo {
  position: absolute;
  top: 10px;
  left: 50%;
  margin-left: -56px;
  width: 113px;
  height: 152px;
  background: url(../img/apieme-logo.png) 0 0 no-repeat;
  z-index: 7;
  cursor: pointer;
  -webkit-transition: all 0.2s ease-in-out;
  -moz-transition: all 0.2s ease-in-out;
}
#logo:hover {
  -webkit-transform: scale(0.95);
  -moz-transform: scale(0.95);
}
.landscape {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
}
.landscape h1 {
  position: relative;
  top: 25px;
  left: 125px;
  padding-left: 15px;
  font-size: 16px;
  line-height: 22px;
  color: #ffffff;
  text-transform: uppercase;
  border-left: 1px solid #ffffff;
  z-index: 3;
  text-shadow: 1px 1px 1px rgba(145, 145, 145, 0.87);
}
.landscape-img {
  position: absolute;
  bottom: 0;
  z-index: 0;
}
.bordered-title {
  position: relative;
  padding: 25px 0;
  text-align: center;
  color: #005cae;
  font-weight: bold;
  font-size: 24px;
  line-height: 30px;
  text-transform: uppercase;
}
.bordered-title h2 {
  position: relative;
}
.bordered-title span {
  position: relative;
  display: block;
  font-weight: 300;
}
.bordered-title .drops {
  position: absolute;
  top: -10px;
  right: -45px;
  width: 40px;
  height: 40px;
  background: url(../img/drops.png) 0 0 no-repeat;
}
.bordered-title .line {
  position: absolute;
  width: 100%;
  height: 1px;
  margin-left: 0;
  /* 200px */
  background: #ffffff;
}
.bordered-title .line.top {
  top: 0;
}
.bordered-title .line.bottom {
  bottom: 0;
}
.bordered-title .circle {
  position: absolute;
  width: 16px;
  height: 9px;
  top: -8px;
  left: 50%;
  margin-left: -8px;
  border: 1px solid #ffffff;
  border-radius: 8px 8px 0 0;
  background: transparent;
}
.gradient-title {
  position: absolute;
  width: 100%;
  height: 108px;
  margin-top: -24px;
  background: linear-gradient(to right, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.4) 15%, rgba(255, 255, 255, 0.7) 50%, rgba(255, 255, 255, 0.4) 85%, rgba(255, 255, 255, 0) 100%);
  /* W3C */
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#00ffffff', endColorstr='#00ffffff', GradientType=1);
  /* IE6-9 */
}
/* Landscape */
.landscape-parts {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: 5;
}
.landscape-part {
  position: absolute;
  width: 100%;
  height: 100%;
  display: none;
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
  filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0);
  opacity: 0;
}
.landscape-part.current {
  display: block;
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
  filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=100);
  opacity: 1;
}
.landscape-part.current .landscape-link {
  display: block;
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
  filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=100);
  opacity: 1;
}
.landscape-title {
  width: 500px;
  top: 32%;
  left: 50%;
  margin-left: -250px;
}
.landscape-link {
  position: absolute;
  width: 300px;
  height: 117px;
  overflow: hidden;
  display: none;
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
  filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0);
  opacity: 0;
}
/* 1. Protection & amélioration de l'environnement */
/*Protégée par la nature*/
#connaitre-ressource {
  bottom: 40%;
  left: 15%;
}
#eau-naturelle {
  bottom: 70%;
  left: 22%;
}
#origine-aquifere {
  bottom: 35%;
  left: 65%;
}
#circulation-mineralisation {
  bottom: 69%;
  left: 62%;
}
/*Protégée par l'APIEME*/
#demarche-evian {
  bottom: 40%;
  left: 16%;
}
#temoignages {
  bottom: 23%;
  left: 64%;
}
#actions-majeures {
  bottom: 9%;
  left: 41%;
}
#quid-apieme {
  bottom: 24%;
  left: 24%;
}
/* 2. la préservation durable des zones humides */
/* Pourquoi les protéger ? */
#nature-histoire {
  bottom: 20%;
  left: 6%;
}
#filtration-eau {
  bottom: 32%;
  left: 25%;
}
#milieux-riches {
  bottom: 13%;
  left: 50%;
}
#origine-glaciaire {
  bottom: 34%;
  left: 67%;
}
/* Quelles actions conduit l'APIEME ? */
#evian-ramsar {
  bottom: 20%;
  left: 10%;
}
#gestion-conservatoire {
  bottom: 30%;
  left: 29%;
}
#amenagement-territoire {
  bottom: 13%;
  left: 50%;
}
#surveillance-milieux {
  bottom: 34%;
  left: 69%;
}
/* A la découverte des zones humides */
#vegetation-variee {
  bottom: 40%;
  left: 10%;
}
#milieux-ouverts {
  bottom: 15%;
  left: 25%;
}
#habitants-saisons {
  bottom: 37%;
  left: 40%;
}
#refuge-especes-rares {
  bottom: 22%;
  left: 60%;
}
#hiver-zone-humide {
  bottom: 44%;
  left: 72%;
}
/*3. Une implication active des agriculteurs */
/* Une agriculture de montagne sous signes de qualité */
#decouverte-ferme-impluvium {
  bottom: 32%;
  left: 12%;
}
#production-fromagere {
  bottom: 44%;
  left: 63%;
}
#prairies-fonctionnement-agricole {
  bottom: 9%;
  left: 57%;
}
/* Les fondements d'une coopération durable */
#origines-collaboration {
  bottom: 35%;
  left: 60%;
}
#agriculteur-principal-gestionnaire {
  bottom: 30%;
  left: 28%;
}
/* Les actions clés de maîtrise des risques */
#batiments-performants {
  bottom: 20%;
  left: 12%;
}
#fertilisation-raisonnee {
  bottom: 15%;
  left: 65%;
}
#soutien-filiere-lait {
  bottom: 30%;
  left: 40%;
}
/* Une projet de territoire : Terragr'Eau Méthanisation */
#methanisation {
  bottom: 15%;
  left: 19%;
}
#projet-terragreau-methanisation {
  bottom: 25%;
  left: 45%;
}
#projet-recommande {
  bottom: 50%;
  left: 70%;
}
#fond-danone {
  bottom: 45%;
  left: 10%;
}
/* 4. L'aménagement raisonné des villages */
/* Un cadre de vie traditionnel */
#villages-apieme {
  bottom: 62%;
  left: 5%;
}
#habitat-traditionnel {
  bottom: 28%;
  left: 18%;
}
#developpement-bati {
  bottom: 33%;
  left: 59%;
}
/* Concilier activités humaines et protection de l'eau */
#maitrise-eaux {
  bottom: 20%;
  left: 12%;
}
#stockage-fioul {
  bottom: 30%;
  left: 38%;
}
#deneigement-environnement {
  bottom: 25%;
  left: 64%;
}
#zero-pesticide {
  bottom: 11%;
  left: 29%;
}
/* Des gestes nature à multiplier */
#produits-terroir {
  bottom: 67%;
  left: 6%;
}
#collecte-dechets {
  bottom: 26%;
  left: 23%;
}
#jardiner-responsable {
  bottom: 30%;
  left: 59%;
}
#encourager-terroir {
  bottom: 60%;
  left: 69%;
}
/* 5. Connaissance et protection de la biodiversité */
/* Quelle démarche pour l'évaluer ? */
#bioindicateurs-sante {
  bottom: 44%;
  left: 5%;
}
#corridors-ecologiques {
  bottom: 27%;
  left: 27%;
}
#lien-biodiversite-protection {
  bottom: 22%;
  left: 47%;
}
#habitats-naturels {
  bottom: 35%;
  left: 71%;
}
/* Des richesses naturelles à préserver */
#biodiversite-forets {
  bottom: 64%;
  left: 7%;
}
#biodiversite-prairies {
  bottom: 25%;
  left: 19%;
}
#diagnostic-resultats {
  bottom: 35%;
  left: 50%;
}
#biodiversite-villages {
  bottom: 16%;
  left: 69%;
}
/* Les moyens de conservation adaptés */
#exploitation-conservation {
  bottom: 37%;
  left: 16%;
}
#pastoralisme-traditionnel {
  bottom: 19%;
  left: 35%;
}
#resultats-zones-humides {
  bottom: 30%;
  left: 60%;
}
#sensibilisation-habitants {
  bottom: 10%;
  left: 20%;
}
/* La sensibilisation des habitants */
#quizz-patrimoine {
  bottom: 25%;
  left: 15%;
}
#sentiers-biodiversite {
  bottom: 12%;
  left: 37%;
}
#programme-decouverte {
  bottom: 28%;
  left: 57%;
}
.landscape-link-text-cont {
  position: absolute;
  width: 300px;
  height: 110px;
  top: 117px;
  z-index: 9;
}
.landscape-link-text {
  position: relative;
  display: table-cell;
  vertical-align: middle;
  width: 300px;
  height: 110px;
  padding: 0 20px;
  font-family: 'Georgia', serif;
  font-style: italic;
  font-size: 18px;
  line-height: 26px;
  text-align: center;
  background: #ffffff;
  color: #005cae;
}
.landscape-link-text span {
  display: block;
  font-size: 24px;
}
.landscape-link-text:after {
  position: absolute;
  content: '';
  width: 8px;
  height: 1px;
  bottom: 12px;
  left: 50%;
  margin-left: -4px;
  background: #005cae;
}
.landscape-pin {
  position: absolute;
  top: 50px;
  z-index: 8;
}
.cube {
  width: 50px;
  height: 50px;
  -webkit-transform-style: preserve-3d;
  -moz-transform-style: preserve-3d;
  -ms-transform-style: preserve-3d;
  transform-style: preserve-3d;
  -webkit-transition-duration: 0.3s;
  -webkit-transition-timing-function: cubic-bezier(0.25, 0.46, 0.45, 0.94);
  -moz-transition-duration: 0.3s;
  -moz-transition-timing-function: cubic-bezier(0.25, 0.46, 0.45, 0.94);
  transition-duration: 0.3s;
  transition-timing-function: cubic-bezier(0.25, 0.46, 0.45, 0.94);
}
.cube span {
  position: absolute;
  width: 50px;
  height: 50px;
}
.cube .top {
  -webkit-transform: rotateX(-270deg) translateY(-25px);
  -webkit-transform-origin: top right;
  -moz-transform: rotateX(-270deg) translateY(-25px);
  -moz-transform-origin: top right;
  -ms-transform: rotateX(-270deg) translateY(-25px);
  -ms-transform-origin: top right;
  transform: rotateX(-270deg) translateY(-25px);
  transform-origin: top center;
}
.cube .left {
  -webkit-transform: rotateY(270deg) translateX(-25px);
  -webkit-transform-origin: center left;
  -moz-transform: rotateY(270deg) translateX(-25px);
  -moz-transform-origin: center left;
  -ms-transform: rotateY(270deg) translateX(-25px);
  -ms-transform-origin: center left;
  transform: rotateY(270deg) translateX(-25px);
  transform-origin: center left;
}
.cube .right {
  -webkit-transform: rotateY(-270deg) translateX(25px);
  -webkit-transform-origin: top right;
  -moz-transform: rotateY(-270deg) translateX(25px);
  -moz-transform-origin: top right;
  -ms-transform: rotateY(-270deg) translateX(25px);
  -ms-transform-origin: top right;
  transform: rotateY(-270deg) translateX(25px);
  transform-origin: top right;
}
.cube .front {
  -webkit-transform: translateZ(25px);
  -moz-transform: translateZ(25px);
  -ms-transform: translateZ(25px);
  transform: translateZ(25px);
}
.landscape-nav {
  position: absolute;
  display: block;
  top: 50%;
  width: 50px;
  height: 50px;
  margin-top: -25px;
  line-height: 50px;
  cursor: pointer;
  z-index: 5;
}
.landscape-nav.prev {
  left: 0;
}
.landscape-nav.prev span {
  background: url(../img/arrow-prev.png) center center no-repeat #ffffff;
}
.landscape-nav.prev:hover .cube {
  -webkit-transform: rotateY(-90deg);
  -moz-transform: rotateY(-90deg);
  -ms-transform: rotateY(-90deg);
  transform: rotateY(-90deg);
}
.landscape-nav.next {
  right: 0;
}
.landscape-nav.next span {
  background: url(../img/arrow-next.png) center center no-repeat #ffffff;
}
.landscape-nav.next:hover .cube {
  -webkit-transform: rotateY(90deg);
  -moz-transform: rotateY(90deg);
  -ms-transform: rotateY(90deg);
  transform: rotateY(90deg);
}
.pin {
  position: relative;
  width: 62px;
  height: 68px;
  left: 50%;
  margin-left: -31px;
  background: url(../img/pin.png) 0 0 no-repeat;
}
.pin .plus {
  position: relative;
  width: 20px;
  height: 20px;
  top: 21px;
  left: 21px;
  background: url(../img/plus.png) 0 0 no-repeat;
}
/*///////////////////////////////////////
-----------------------------------------
----------TEXT-CONTAINER-GENERAL---------
-----------------------------------------
///////////////////////////////////////*/
/*-- GENERAL/A TRIER --*/
.content-list {
  width: 87%;
  display: block;
  margin: 0px auto;
  padding: 0px 38px 10px 0px;
}
.content-list li {
  width: 90%;
  line-height: 1.5em;
}
.content-list span {
  font-family: "Georgia", serif;
  font-style: italic;
  margin-bottom: 13px;
  display: block;
}
.content-img-solo-floatleft {
  float: left;
  width: 60% !important;
}
.content-list-floatright {
  width: 39%;
  float: right;
  padding: 0px 51px 0px 0px;
  margin: 80px 4px;
}
.content-video {
  text-align: center;
  display: block;
  padding: 54px 0 0 0;
  margin-left: -1px;
  position: relative;
}
.content-video .playeryoutube {
  width: 100%;
  height: 500px;
  display: block;
  position: relative;
}
.content-video h5 {
  font-family: "Georgia", serif;
  font-style: italic;
  height: 39px;
  line-height: 2.6em;
  width: 100%;
  background: #5887AD;
  color: #FFFFFF;
}
.content-link {
  margin: 28px 0;
  text-align: center;
}
.content-link a {
  position: relative;
  display: block;
  width: 42%;
  text-align: center;
  line-height: 2em;
  border: 2px solid #5887AD;
  background: none repeat scroll 0% 0% transparent;
  padding: 9px 0px;
  transition: all 0.5s ease 0s;
  margin: 9px auto;
  color: #666;
}
.content-link a:hover {
  background: #5887AD;
  color: #FFFFFF;
}
#video-container {
  display: none;
  position: absolute;
  z-index: 99;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.7);
}
#video-container img {
  position: relative;
  margin: -250px 0px 0px -350px;
  left: 50%;
  top: 0%;
  opacity: 0;
}
#content-list-pdf {
  margin: 89px auto;
  display: block;
  width: 85%;
  border: 1px dashed #666;
  padding: 20px 6px;
  position: relative;
}
#content-list-pdf p {
  width: 100%;
}
#content-list-pdf ul {
  margin-top: 25px;
}
#content-list-pdf ul li {
  list-style: none outside none;
  display: inline-block;
  margin: 0px 41px;
}
#content-list-pdf ul li a {
  margin: 7px;
}
#content-list-pdf ul li span {
  margin: 3px -3px 0px -24px;
  display: block;
}
#content-list-pdf ul li img {
  height: 30px;
  width: 30px;
  -o-transition: .5s;
  -ms-transition: .5s;
  -moz-transition: .5s;
  -webkit-transition: .5s;
  transition: .5s;
}
#content-list-pdf ul li img:hover {
  margin-bottom: -4px;
}
sup {
  font-size: 10px;
  line-height: 18px;
}
.content-legende {
  background: none repeat scroll 0% 0% rgba(236, 232, 230, 0) !important;
  margin: 0 auto;
  width: 599px !important;
  border: 1px dashed #5887AD;
}
.content-legende p {
  padding: 12px 21px;
  line-height: 22px;
}
.content-legende span {
  background: none;
  color: #666;
  font-style: italic;
  font-size: 0.8em;
  height: 22px;
}
#content-phases-list {
  margin-top: 15px;
}
#content-phases-list h5 {
  width: 100%;
  background: none repeat scroll 0% 0% #5887AD;
  color: #FFF;
}
#content-phases-list p {
  width: 80%;
  text-align: center;
  margin: 27px auto;
}
#content-phases-list ol {
  width: 80%;
  margin: 0px auto;
  list-style-position: outside;
}
#content-phases-list ol li {
  margin: 12px 0px;
  line-height: 1.5em;
}
#content-fromage-list ul {
  width: 90%;
  margin: 15px auto;
  line-height: 2em;
  display: block;
}
#content-outils-connaissance h5 {
  width: 100%;
}
#content-outils-connaissance ul li {
  width: 90%;
  display: block;
  margin: 30px auto;
  line-height: 3em;
  padding: 10px;
}
#content-outils-connaissance ul li p {
  width: 100%;
}
#content-background {
  z-index: 5;
}
.plus-button {
  height: 40px;
  display: block;
  position: relative;
  width: 60%;
}
.plus-button img {
  margin-left: 120px;
  margin-top: 17px;
}
.plus-button p {
  padding: 0px !important;
  text-align: center;
  background: none repeat scroll 0% 0% transparent !important;
  margin-top: -32px;
}
.content-pdf {
  width: 90%;
  display: block;
  position: relative;
  text-align: center;
  margin: 135px auto 75px;
}
.content-pdf a {
  position: absolute;
  left: 50%;
  margin: -37px 0 0 -15px;
}
.content-pdf a img {
  height: 30px;
  -o-transition: .5s;
  -ms-transition: .5s;
  -moz-transition: .5s;
  -webkit-transition: .5s;
  transition: .5s;
}
.content-pdf a img:hover {
  margin: 0 0 -24px 0;
}
/* CONTENT TEXT */
#content-container {
  position: fixed;
  top: 0;
  right: -900px;
  bottom: 0;
  width: 900px;
  background: #ffffff;
  z-index: 7;
  /*display:none;*/
}
#content-container ul {
  display: inline-block;
  position: relative;
}
#content-container ul li {
  list-style: disc outside none;
  margin: 10px 41px;
  text-align: justify;
}
#content-container ol {
  display: inline-block;
  position: relative;
}
#content-container ol li {
  list-style: decimal outside none;
  margin: 10px 41px;
  text-align: justify;
}
#content-container h5 {
  display: block;
  clear: both;
  position: relative;
  height: 50px;
  line-height: 3.5em;
  text-indent: 3.5em;
  font-style: italic;
  font-family: "Georgia", serif;
}
.content-breadcrumb {
  position: relative;
  height: 51px;
  line-height: 51px;
  padding-left: 50px;
  font-family: 'Georgia', serif;
  font-style: italic;
  font-size: 14px;
  color: #7b7b7b;
  background: #ffffff;
  border-bottom: 1px dashed #7b7b7b;
  z-index: 13;
}
.content-breadcrumb h3,
.content-breadcrumb h4 {
  display: inline-block;
}
.content-breadcrumb:before {
  position: absolute;
  content: '→';
  top: 0;
  left: 0;
  width: 50px;
  height: 50px;
  text-align: center;
  color: #05a0d0;
  font-family: Arial;
}
.content-close {
  position: absolute;
  top: 0;
  right: 0;
  width: 50px;
  height: 50px;
  background: #ece8e6;
  z-index: 14;
}
.content-close span {
  display: block;
  background: url(../img/close.png) 0 0 no-repeat;
}
.content-close:hover .cube {
  -webkit-transform: rotateX(-90deg);
  -moz-transform: rotateX(-90deg);
  -ms-transform: rotateX(-90deg);
  transform: rotateX(-90deg);
}
.content-title {
  position: relative;
  display: table;
  margin: auto;
  padding: 50px;
  font-family: 'Georgia', serif;
  font-style: italic;
  font-size: 24px;
  line-height: 30px;
  text-align: center;
  color: #7b7b7b;
  margin-bottom: 220px;
}
.content-title:after {
  position: absolute;
  content: '';
  width: 8px;
  height: 1px;
  bottom: 30px;
  left: 50%;
  margin-left: -4px;
  background: #05a0d0;
}
.content-title span {
  position: relative;
  display: block;
  font-size: 30px;
  color: #05a0d0;
}
.content-title span:after {
  position: absolute;
  content: '';
  right: -70px;
  bottom: -5px;
  width: 58px;
  height: 58px;
  background: url(../img/drops-blue.png) 0 0 no-repeat;
}
.content-imgs {
  position: absolute;
  height: 230px;
  top: 130px;
  background: none repeat scroll 0% 0% #FFF;
  z-index: 12;
}
.content-imgs-open {
  position: absolute;
  top: 0;
  right: 18px;
  width: 26px;
  height: 36px;
  background: #ece8e6;
  cursor: pointer;
  z-index: 12;
  display: none;
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
  filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0);
  opacity: 0;
}
.content-imgs-open:hover {
  background: #dddddd;
}
.content-imgs-open:before {
  position: absolute;
  content: '';
  width: 18px;
  height: 10px;
  top: 13px;
  left: 4px;
  background: url(../img/eye-mini.png) 0 0 no-repeat;
}
.content-imgs-nav {
  position: absolute;
  display: block;
  top: 0;
  color: #5887ad;
  text-align: center;
  font-family: Arial;
  font-size: 18px;
  line-height: 50px;
  background: #ffffff;
  cursor: pointer;
  outline: 0;
}
.content-imgs-nav span {
  top: 0;
  left: 0;
}
.content-imgs-nav.prev {
  right: 50px;
}
.content-imgs-nav.prev:hover .cube {
  -webkit-transform: rotateY(-90deg);
  -moz-transform: rotateY(-90deg);
  -ms-transform: rotateY(-90deg);
  transform: rotateY(-90deg);
}
.content-imgs-nav.next {
  right: 0;
}
.content-imgs-nav.next:hover .cube {
  -webkit-transform: rotateY(90deg);
  -moz-transform: rotateY(90deg);
  -ms-transform: rotateY(90deg);
  transform: rotateY(90deg);
}
.content-imgs-list {
  position: relative;
  top: 50px;
  width: 882px;
  height: 180px;
  overflow: hidden;
}
.content-imgs-cont {
  width: 1200px;
}
.content-img {
  position: relative;
  display: block;
  float: left;
  width: 294px;
  height: 100%;
  overflow: hidden;
  cursor: pointer;
}
.content-img img {
  position: relative;
  top: 0;
  left: 0;
  z-index: 9;
}
.content-img h4 {
  position: absolute;
  width: 100%;
  height: 35px;
  top: 145px;
  padding-left: 10px;
  font-family: 'Georgia', serif;
  font-style: italic;
  color: #ffffff;
  line-height: 35px;
  background: #5887ad;
  z-index: 10;
  opacity: 0;
}
.content-img .eye {
  position: absolute;
  width: 82px;
  height: 45px;
  top: 53px;
  left: 106px;
  background: url(../img/eye.png) 0 0 no-repeat;
  display: none;
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
  filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0);
  opacity: 0;
  z-index: 11;
}
.lightbox-title {
  display: block;
  background: none repeat scroll 0px 0px #5887AD;
  position: absolute;
  padding: 16px;
  color: #FFF;
  bottom: 0px;
  width: 90%;
  left: 5%;
}
.lightbox img {
  width: 70%;
  display: block;
  margin: 0px auto;
}
.lightbox h5 {
  width: 70%;
  display: block;
  margin: 0px auto;
  background: #5887AD;
  line-height: 19px;
  padding: 15px;
  color: #FFF;
  font-style: italic;
  font-family: "Georgia", serif;
}
#content-text {
  width: 900px;
  outline: none;
  padding: 0 18px 50px 0px;
  height: 750px;
}
#content-text p {
  width: 856px;
  background: #ece8e6;
  padding: 10px 50px;
  line-height: 22px;
  text-align: justify;
}
#content-text-header {
  margin-top: 29px;
  background: none repeat scroll 0% 0% #ECE8E6;
}
#content-text-header p {
  padding: 50px;
}
#content-text-header h5 {
  width: 70%;
  display: block;
  position: relative;
  height: 50px;
  line-height: 3.5em;
  font-style: italic;
  font-family: "Georgia", serif;
}
#content-text-header ul {
  width: 80%;
  position: relative;
  margin: 0px auto;
  display: block;
  padding: 0 0 50px 0;
}
.content-text-paragraph {
  padding: 15px 0px !important;
  line-height: 1.4em;
}
.content-text-paragraph p {
  background: none !important;
}
.content-text-paragraph ul {
  width: 100%;
}
.content-img-solo {
  margin: 14px auto;
  text-align: center;
  width: 100%;
  position: relative;
  height: 100%;
}
.content-img-solo img {
  height: 500px;
  display: block;
  margin: 0 auto;
}
.content-img-solo span {
  height: 39px;
  background: none repeat scroll 0% 0% #5887AD;
  color: #FFF;
  margin: 0 auto;
  display: block;
}
.content-img-solo h5 {
  font-family: "Georgia", Arial, serif;
  font-style: italic;
  text-indent: 0 !important;
  line-height: 2.5em !important;
  color: #FFFFFF;
  position: absolute;
  margin-top: -37px;
  width: 100% !important;
}
/*--- 1.LA PRESERVATION DURABLE DES ZONES HUMIDES ---*/
/*-- 1.1 POURQUOI LES PROTEGER ? --*/
/*- 1.1.1 -*/
/*- 1.1.2 -*/
/*- 1.1.3 -*/
/*- 1.1.4 -*/
#slideshow #slideshowWindow {
  width: 80%;
  height: 491px;
  margin: 5px auto;
  padding: 0px;
  position: relative;
  overflow: hidden;
}
#slideshow #slideshowWindow .slide {
  margin: 0px;
  padding: 0px;
  float: left;
  position: relative;
  height: 491px;
  width: 719px;
}
.nav {
  display: block;
  position: absolute;
  cursor: pointer;
}
#leftNav {
  width: 53px;
  background: #5887AD;
  height: 491px;
  left: 37px;
  top: 358px;
}
#leftNav img {
  height: 31px;
  width: 30px;
  position: relative;
  top: 50%;
  right: 50%;
  margin: -15.5px 0px 0px 35px;
}
#rightNav {
  width: 53px;
  background: #5887AD;
  height: 491px;
  right: 55px;
  top: 358px;
}
#rightNav img {
  height: 31px;
  width: 30px;
  position: relative;
  top: 50%;
  left: 50%;
  margin: -15.5px 0px 0px -15px;
}
/*-- 1.2 QUELLES ACTIONS CONDUIT L'APIEME ? --*/
/*- 1.2.1 -*/
/*- 1.2.2 -*/
#evian-ramsar h5 {
  background: #5887AD;
  width: 882px;
  color: #FFFFFF;
}
#evian-ramsar .content-list {
  position: relative;
}
#evian-ramsar .content-list p {
  width: 100%;
  background: none repeat scroll 0% 0% transparent;
  padding: 0px;
  margin: 0px 0px 20px;
}
#evian-ramsar .panel-in {
  position: absolute;
  width: 170px;
  height: 60px;
  left: 378px;
  margin-top: 20px;
  color: #5887AD;
}
#evian-ramsar .panel-in img {
  position: absolute;
  margin: -6px 0px 0px -40px;
}
#methanisation-content h5 {
  background: #5887AD;
  width: 882px;
  color: #FFFFFF;
}
#methanisation-content .content-list {
  position: relative;
}
#methanisation-content .content-list p {
  width: 100%;
  background: none repeat scroll 0% 0% transparent;
  padding: 0px;
  margin: 0px 0px 20px;
}
#methanisation-content .panel-in {
  position: absolute;
  width: 170px;
  height: 60px;
  left: 50%;
  margin-top: 20px;
  color: #5887AD;
  margin-left: -30px;
}
#methanisation-content .panel-in img {
  position: absolute;
  margin: -6px 0px 0px -40px;
}
/*- 1.2.3 -*/
/*- 1.2.4 -*/
/*-- 1.3 A LA DECOUVERTE DES ZONES HUMIDES --*/
/*- 1.3.1 -*/
/*- 1.3.2 -*/
/*- 1.3.3 -*/
/*- 1.3.4 -*/
/*- 1.3.5 -*/
/*--- 2.UNE IMPLICATION ACTIVE DES AGRICULTEURS ---*/
/*-- 2.1 UNE AGRICULTURE DE MONTAGNE SOUS LE SIGNE DE LA QUALITE --*/
/*- 2.1.1 -*/
#gallery-container {
  position: relative;
  left: 50%;
  margin-left: -320px;
}
#gallery-container .gallery-top {
  width: 640px;
  height: 440px;
  position: relative;
}
#gallery-container .gallery-top img {
  position: absolute;
}
#gallery-container .gallery-bottom {
  margin: 20px 13px;
}
#gallery-container .gallery-bottom img {
  margin: 0 12px 0 0;
}
#gallery-container .ete img {
  width: 300px;
  height: 200px;
  display: block;
  float: left;
}
#gallery-container .hiver img {
  width: 300px;
  height: 200px;
  display: block;
}
/*- 2.1.2 -*/
/*- 2.1.3 -*/
#labels-content h5 {
  margin: 30px 0 0 0;
  width: 100%;
  background: none repeat scroll 0% 0% #5887AD;
  color: #FFF;
}
#labels-content .label-txt-container {
  margin: 20px auto;
  width: 80%;
}
#labels-content .label-txt-container p {
  width: 100%;
  background: none repeat scroll 0% 0% transparent;
}
#labels-content img {
  float: left;
  height: 170px;
  width: 170px;
  margin: 20px 30px;
}
#labels-content #aoc h5,
#labels-content #aop h5,
#labels-content #igp h5 {
  margin: 30px 0px 0px;
  width: 100%;
  color: #666;
  background: none;
}
#labels-content #aoc span,
#labels-content #aop span,
#labels-content #igp span {
  height: 1px;
  background: #000000;
  width: 30%;
  display: block;
}
#labels-content #aoc p ul,
#labels-content #aop p ul,
#labels-content #igp p ul {
  float: right;
}
/*-- 2.2 LES FONDEMENTS D'UNE COOPERATION DURABLE --*/
/*- 2.2.1 -*/
/*- 2.2.2 -*/
/*-- 2.3 LES ACTIONS DE MAÎTRISE DES RISQUES --*/
/*- 2.3.1 -*/
#batiments-performants h5 {
  background: #5887AD;
  width: 882px;
  color: #FFFFFF;
}
#batiments-performants .content-list {
  position: relative;
}
#batiments-performants .content-list p {
  width: 100%;
  background: none repeat scroll 0% 0% transparent;
  padding: 0px;
  margin: 0px 0px 20px;
}
#batiments-performants .content-batiments-performants h5 {
  margin: 20px 0 0 0;
  width: 882px;
  color: #666;
  background: none;
}
#batiments-performants .content-batiments-performants span {
  height: 1px;
  background: none repeat scroll 0% 0% #666;
  width: 23%;
  display: block;
  margin: -6px 0px 30px;
}
#batiments-performants .content-batiments-performants p {
  float: right;
  width: 60%;
  padding: 87px 55px;
}
#batiments-performants .content-batiments-performants .batiments-performants-pic {
  float: left;
  width: 40%;
}
#batiments-performants .content-batiments-performants .batiments-performants-pic img {
  width: 356px;
}
#batiments-performants .content-batiments-performants .batiments-performants-pic span {
  float: left;
  margin: -4px 0px 0px;
  padding: 7px 0px;
  background: none repeat scroll 0% 0% #5887AD;
  width: 100%;
  text-align: center;
  color: #FFF;
  height: 38px;
}
#batiments-performants .content-batiments-performants-right {
  margin-top: 40px;
}
#batiments-performants .content-batiments-performants-right p {
  float: left;
  width: 60%;
  padding: 68px 55px;
}
#batiments-performants .content-batiments-performants-right .batiments-performants-pic {
  float: right;
  width: 40%;
}
#batiments-performants .content-batiments-performants-right .batiments-performants-pic img {
  width: 360px;
}
#batiments-performants .content-batiments-performants-right .batiments-performants-pic span {
  float: left;
  margin: -10px 0px 0px;
  padding: 7px 0px;
  background: none repeat scroll 0% 0% #5887AD;
  width: 100%;
  text-align: center;
  color: #FFF;
  height: 38px;
  z-index: 4;
  position: relative;
}
#batiments-performants .content-pdf {
  width: 90%;
  display: block;
  position: relative;
  text-align: center;
  margin: 95px auto 75px auto;
}
#batiments-performants .content-pdf a {
  position: absolute;
  left: 50%;
  margin: -37px 0 0 -15px;
}
#batiments-performants .content-pdf a img {
  height: 30px;
  -o-transition: .5s;
  -ms-transition: .5s;
  -moz-transition: .5s;
  -webkit-transition: .5s;
  transition: .5s;
}
#batiments-performants .content-pdf a img:hover {
  margin: 0 0 -24px 0;
}
/*- 2.3.2 -*/
#fertilisation-raisonnee h5 {
  background: #5887AD;
  width: 882px;
  color: #FFFFFF;
}
#fertilisation-raisonnee .content-list p {
  width: 100%;
  background: none repeat scroll 0% 0% transparent;
  padding: 0px;
  margin: 0px 0px 20px;
}
#fertilisation-raisonnee .content-pdf {
  width: 90%;
  display: block;
  position: relative;
  text-align: center;
  margin: 95px auto 75px auto;
}
#fertilisation-raisonnee .content-pdf a {
  position: absolute;
  left: 50%;
  margin: -37px 0 0 -15px;
}
#fertilisation-raisonnee .content-pdf a img {
  height: 30px;
  -o-transition: .5s;
  -ms-transition: .5s;
  -moz-transition: .5s;
  -webkit-transition: .5s;
  transition: .5s;
}
#fertilisation-raisonnee .content-pdf a img:hover {
  margin: 0 0 -24px 0;
}
.content-panel {
  height: 306px;
  width: 882px;
}
.content-panel h5 {
  margin: 42px 0px 0px;
  width: 882px;
  color: #666;
  background: none;
}
.content-panel span {
  height: 1px;
  background: none repeat scroll 0% 0% #666;
  width: 23%;
  display: block;
  margin: -6px 0px 30px;
}
.content-panel p {
  width: 60% !important;
  float: right;
  height: 318px;
  padding: 77px 40px !important;
  left: 0;
  position: relative;
}
.content-panel p img {
  position: relative;
  float: left;
  margin: -4px 8px 0px 0px;
  height: 31px;
}
.content-panel p a {
  margin-top: 16px;
  display: block;
  margin-left: 0px;
  position: relative;
  width: 71%;
  color: #5887AD;
}
.content-panel .content-panel-pic {
  float: left;
  width: 40%;
}
.content-panel .content-panel-pic img {
  width: 365px;
}
.content-panel .content-panel-pic span {
  float: left;
  margin: -4px 0px 0px;
  padding: 7px 0px;
  background: none repeat scroll 0% 0% #5887AD;
  width: 100%;
  text-align: center;
  color: #FFF;
  height: 38px;
}
.content-panel .content-panel-pic-legend-big {
  display: block;
  padding: 10px 20px;
  height: 75px;
  color: #FFF;
  width: 364px;
  text-align: center;
  float: left;
  margin: -5px 0px 0px -10px;
  background: none repeat scroll 0% 0% #5887AD;
}
.content-panel-right {
  margin-top: 40px;
  height: 293px;
}
.content-panel-right p {
  float: left;
  width: 60%;
  padding: 107px 55px;
}
.content-panel-right p img {
  margin: -4px 8px 0px 0px;
  position: relative;
}
.content-panel-right p a {
  margin-top: 43px;
  display: block;
  margin-left: 0px;
  position: relative;
  width: 71%;
  color: #5887AD;
}
.content-panel-right .content-panel-pic {
  float: right;
  width: 40%;
}
.content-panel-right .content-panel-pic img {
  width: 365px;
  margin: 0px 0px 0px -12px;
}
.content-panel-right .content-panel-pic span {
  float: left;
  margin: -10px 0px 0px -12px;
  padding: 8px 0px;
  background: none repeat scroll 0% 0% #5887AD;
  width: 101%;
  text-align: center;
  color: #FFF;
  height: 37px;
  z-index: 3;
  position: relative;
}
.content-panel-right .content-panel-pic-legend-big {
  display: block;
  padding: 10px 20px;
  height: 75px;
  color: #FFF;
  width: 360px;
  margin: -5px 0px 0px -7px;
  background: none repeat scroll 0% 0% #5887AD;
}
.panel {
  display: none;
  background: none repeat scroll 0px 0px #ECE8E6;
  padding: 50px 0;
  width: 60%;
  margin: 0px auto;
  /*color: #666;
  z-index: 2;
  top: -50%;
  height: 500px;
  position: relative;
  width: 750px;*/
}
.panel .panel-text h4 {
  position: relative;
  padding: 22px 0px 22px 52px;
  font-family: Georgia, serif;
  font-style: italic;
  font-size: 24px;
  line-height: 30px;
  color: #7B7B7B;
}
.panel .panel-text span {
  position: relative;
  width: 30%;
  height: 1px;
  background: #7B7B7B;
  display: block;
}
.panel .panel-text p {
  background: none repeat scroll 0% 0% transparent;
  padding: 0px 0 0 53px;
  left: 0px;
  width: 90%;
  display: block;
  position: relative;
  margin: 15px 0;
  line-height: 22px;
}
.panel .panel-text a {
  position: relative;
  bottom: -208px;
  left: 60px;
  color: #000;
}
.panel .panel-text a img {
  position: relative;
  top: 10px;
  left: -9px;
}
/*- 2.3.3 -*/
/*-- 2.4 UN PROJET DE TERRITOIRE TERRAGREAU METHANISATION --*/
/*- 2.4.1 -*/
/*- 2.4.2 -*/
/*--- 3.AMENAGEMENT RAISONNE DES VILLAGES ---*/
/*-- 3.1 UN CADRE DE VIE TRADITIONNEL --*/
/*- 3.1.1 -*/
/*- 3.1.2 -*/
/*- 3.1.3 -*/
/*-- 3.2 CONCILIER ACTIVITES HUMAINES ET PROTECTION DE L'EAU --*/
/*- 3.2.1 -*/
/*- 3.2.2 -*/
/*- 3.2.3 -*/
/*-- 3.3 DES GESTES NATURE A MULTIPLIER --*/
/*- 3.3.1 -*/
/*- 3.3.2 -*/
/*- 3.3.3 -*/
/*--- 4. CONNAISSANCE ET PROTECTION DE LA BIODIVERSITE ---*/
/*-- 4.1 QUELLE DEMARCHE POUR L'EVALUER ? --*/
/*- 4.1.1 -*/
/*- 4.1.2 -*/
/*- 4.1.3 -*/
/*- 4.1.4 -*/
/*-- 4.2 DES RICHESSES NATURELLES A PRESERVER --*/
/*- 4.2.1 -*/
/*- 4.2.2 -*/
/*- 4.2.3 -*/
/*- 4.2.4 -*/
/*-- 4.3 LES MOYENS DE CONSERVATION ADAPTES --*/
/*- 4.3.1 -*/
/*- 4.3.2 -*/
/*- 4.3.3 -*/
/*-- 4.4 LA SENSIBILISATION DES HABITANTS --*/
/*- 4.4.1 -*/
/*- 4.4.2 -*/
/*- 4.4.3 -*/
/*--- 5. PROTEGEE PAR LA NATURE ---*/
/*- 5.1 -*/
/*- 5.2 -*/
/*- 5.3 -*/
/*- 5.4 -*/
/*--- 6. PROTEGEE PAR L'APIEME ---*/
/*- 6.1 -*/
.content-video-small {
  margin: -1px 0px;
}
.content-video-small h5 {
  color: #FFFFFF;
  text-align: center;
  width: 100%;
  background: #5887AD;
}
.content-video-small span {
  width: 0px;
  height: 0px;
  border-left: 20px solid transparent;
  border-right: 20px solid transparent;
  border-top: 20px solid #5887AD;
  display: block;
  right: 172px;
  position: absolute;
}
.content-video-small p {
  float: right;
  width: 35% !important;
  padding: 109px 50px !important;
}
.content-video-small .playeryoutube {
  float: left;
  width: 65%;
  height: 350px;
}
.content-video-small-right {
  margin: -1px 0px;
}
.content-video-small-right h5 {
  color: #FFFFFF;
  text-align: center;
  width: 100%;
  background: #5887AD;
}
.content-video-small-right span {
  width: 0px;
  height: 0px;
  border-left: 20px solid transparent;
  border-right: 20px solid transparent;
  border-top: 20px solid #5887AD;
  display: block;
  left: 172px;
  position: absolute;
}
.content-video-small-right p {
  float: left;
  width: 35% !important;
  padding: 120px 50px !important;
}
.content-video-small-right .playeryoutube {
  float: right;
  width: 65%;
  height: 350px;
}
/*- 6.2 -*/
#content-temoignages-list {
  position: relative;
  width: 900px;
  height: 680px;
}
#content-temoignages-list img {
  width: 100%;
}
#content-temoignages-list .column-1 {
  position: absolute;
  left: 100px;
  margin: 0px auto;
  width: 40%;
  height: 678px;
}
#content-temoignages-list .column-2 {
  position: absolute;
  right: 101px;
  margin: 0px auto;
  width: 40%;
  height: 678px;
}
#content-temoignages-list .small {
  width: 150px;
  height: 150px;
  background: transparent;
  overflow: hidden;
}
#content-temoignages-list .large-landscape {
  width: 320px;
  height: 150px;
  background-color: transparent;
  overflow: hidden;
}
#content-temoignages-list .large-landscape img {
  width: 100%;
  top: -16%;
  position: relative;
}
#content-temoignages-list ul a {
  -o-transition: .5s;
  -ms-transition: .5s;
  -moz-transition: .5s;
  -webkit-transition: .5s;
  transition: .5s;
}
#content-temoignages-list ul a:hover {
  opacity: 0.5;
}
#content-temoignages-list ul li {
  margin: 8px;
  list-style: none outside none;
  display: inline-block;
}
/*- 6.3 -*/
/*- 6.4 -*/
/************************************/
/* -------- LIGHTBOX TEXT -------- */
/**********************************/
.panel {
  display: none;
  background: none repeat scroll 0px 0px #ECE8E6;
  padding: 50px 0;
  width: 60%;
  margin: 0px auto;
  /*color: #666;
  z-index: 2;
  top: -50%;
  height: 500px;
  position: relative;
  width: 750px;*/
}
.panel .panel-text h4 {
  position: relative;
  padding: 22px 0px 22px 52px;
  font-family: Georgia, serif;
  font-style: italic;
  font-size: 24px;
  line-height: 30px;
  color: #7B7B7B;
}
.panel .panel-text span {
  position: relative;
  width: 30%;
  height: 1px;
  background: #7B7B7B;
  display: block;
}
.panel .panel-text p {
  background: none repeat scroll 0% 0% transparent;
  padding: 0px 0 0 53px;
  left: 0px;
  width: 90%;
  display: block;
  position: relative;
  margin: 15px 0;
  line-height: 22px;
}
.panel .panel-text a {
  position: relative;
  bottom: -208px;
  left: 60px;
  color: #000;
}
.panel .panel-text a img {
  position: relative;
  top: 10px;
  left: -9px;
}
/*****************************/
/* -------- FOOTER -------- */
/***************************/
footer {
  position: fixed;
  right: 0;
  bottom: 0;
  left: 0;
  height: 39px;
  padding-top: 10px;
  line-height: 26px;
  text-transform: uppercase;
  color: #ffffff;
  text-align: right;
  background: url(../img/footer-bg.png) 0 0 repeat-x;
  z-index: 5;
}
footer a {
  color: #FFF;
  position: absolute;
}
footer a:nth-child(2) {
  right: 20px;
}
footer .mentions-legales {
  font-weight: 700;
  color: #FFF;
  right: 80px;
  font-weight: bold;
}
footer .mentions-legales:hover {
  color: #dddddd;
}
.filet {
  height: 1px;
  background: #000000;
  width: 30%;
  display: block;
}
.filet-small {
  height: 1px;
  background: #000000;
  width: 15%;
  display: block;
}
/**************************/
/* -------- HOME -------- */
/**************************/
.home-nav {
  position: absolute;
  width: 400px;
  height: 100%;
  /*padding:0 50px; */
  z-index: 6;
}
#home-nav-protection {
  left: 30%;
  -webkit-transform: translate(-50%, 0);
  -moz-transform: translate(-50%, 0);
  -ms-transform: translate(-50%, 0);
  -o-transform: translate(-50%, 0);
}
#home-nav-protection .home-nav-text-cont {
  bottom: 30%;
}
#home-nav-accompagnement {
  left: 70%;
  -webkit-transform: translate(-50%, 0);
  -moz-transform: translate(-50%, 0);
  -ms-transform: translate(-50%, 0);
  -o-transform: translate(-50%, 0);
}
#home-nav-accompagnement .home-nav-text-cont {
  bottom: 25% !important;
}
@media (max-height: 800px) {
  #home-nav-accompagnement .home-nav-text-cont {
    bottom: 10% !important;
  }
}
.home-nav-text-cont {
  position: absolute;
  cursor: default;
  z-index: 8;
}
.text-cont-closed {
  cursor: pointer;
}
.text-cont-closed:hover h2 {
  color: #05a0d0;
}
.home-nav-text {
  position: relative;
  overflow: hidden;
}
.home-nav-title {
  width: 300px;
  left: 50px;
  margin: 8px 0 20px;
}
.home-nav-title h2 {
  -webkit-transition-duration: 0.3s;
  -webkit-transition-timing-function: cubic-bezier(0.25, 0.46, 0.45, 0.94);
  -moz-transition-duration: 0.3s;
  -moz-transition-timing-function: cubic-bezier(0.25, 0.46, 0.45, 0.94);
  transition-duration: 0.3s;
  transition-timing-function: cubic-bezier(0.25, 0.46, 0.45, 0.94);
}
.home-nav-bg {
  position: relative;
  width: 400px;
  height: 100%;
  width: 0;
  margin-left: 200px;
  /*top:0; right:0; bottom:0; left:0; */
  background: #030E2B;
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=80)";
  filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=80);
  opacity: 0.2;
  z-index: 7;
}
.home-nav-links {
  /*display:none;*/
  height: 0;
}
.home-nav-link {
  position: relative;
  height: 48px;
  top: 9px;
}
.home-nav-link a {
  position: relative;
  display: block;
  width: 400px;
  height: 48px;
  line-height: 20px;
  color: #5887ad;
  text-align: center;
  font-weight: bold;
  text-transform: uppercase;
  overflow: hidden;
  z-index: 9;
  margin: 28px 0px;
}
.home-nav-link a .home-nav-link-text {
  display: table-cell;
  vertical-align: middle;
  width: 400px;
  height: 48px;
  padding: 0 50px;
}
.home-nav-link a:hover {
  color: #05a0d0;
}
.home-nav-link-bg {
  position: absolute;
  width: 100%;
  height: 100%;
  top: -50px;
  left: 0;
  background: #ffffff;
  z-index: -1;
  opacity: 0.7;
}
.home-nav-link-img {
  height: 65px;
  width: 65px;
  position: absolute;
  margin: -9px 0 -9px 31px;
  z-index: 10;
}
.home-nav-link-img img {
  border: 3px solid #FFF;
  border-radius: 65px;
}
.home-nav-pin {
  left: 50%;
  margin-left: -31px;
  z-index: 9;
}
.home-nav-pin .plus {
  position: relative;
  width: 20px;
  height: 20px;
  top: 21px;
  left: 21px;
  background: url(../img/plus.png) 0 0 no-repeat;
}
/*********************************/
/* -------- JSCROLLPANE -------- */
/*********************************/
.jspContainer {
  overflow: hidden;
  position: relative;
  padding: 10px 0px;
  margin: 0 0 20px 0;
}
.jspPane {
  position: absolute;
  top: -411px;
}
.jspVerticalBar {
  position: absolute;
  height: 50%;
  /*top:10px;*/
  /*top:10px; bottom:10px;*/
  /*top: 5px; */
  right: 24px;
  width: 6px;
}
.jspHorizontalBar {
  position: absolute;
  bottom: 0px;
  left: 0px;
  width: 100%;
  height: 16px;
  background: none repeat scroll 0% 0% #F00;
  display: none;
}
.jspVerticalBar *,
.jspHorizontalBar * {
  margin: 0;
  padding: 0;
}
.jspCap {
  display: none;
}
.jspHorizontalBar .jspCap {
  float: left;
}
.jspTrack {
  background: #ffffff;
  position: relative;
}
.jspDrag {
  background: #5887ad;
  position: relative;
  top: 0;
  left: 0;
  cursor: pointer;
  z-index: 2;
}
.jspHorizontalBar .jspTrack,
.jspHorizontalBar .jspDrag {
  float: left;
  height: 100%;
}
.jspArrow {
  background: #50506d;
  text-indent: -20000px;
  display: block;
  cursor: pointer;
}
.jspArrow.jspDisabled {
  cursor: default;
  background: #80808d;
}
.jspVerticalBar .jspArrow {
  height: 16px;
}
.jspHorizontalBar .jspArrow {
  width: 16px;
  float: left;
  height: 100%;
}
.jspVerticalBar .jspArrow:focus {
  outline: none;
}
.jspCorner {
  background: #eeeef4;
  float: left;
  height: 100%;
}
/* Yuk! CSS Hack for IE6 3 pixel bug :( */
* html .jspCorner {
  margin: 0 -3px 0 0;
}
/**************************************/
/* -------- MENTIONS LÉGALES -------- */
/**************************************/
#mentionsLegales {
  position: relative;
  width: 960px;
  margin: auto;
  padding: 50px 0;
  overflow: auto;
}
#mentionsLegales .logo {
  width: 100%;
  margin-bottom: 50px;
  text-align: center;
}
#mentionsLegales h1 {
  color: #ff0099;
  font: normal 24px/22px Arial;
}
#mentionsLegales h2 {
  margin: 20px 0 5px 0;
  color: #ff0099;
  font: normal 16px/14px Arial;
}
#mentionsLegales a {
  color: #ff0099;
}
#mentionsLegales a:hover {
  color: #cccccc;
}
/***************************/
/* -------- NO JS -------- */
/***************************/
#noJS {
  position: fixed;
  left: 0;
  top: 20px;
  width: 100%;
  padding: 10px 0;
  text-align: center;
  background-color: #000000;
  z-index: 88;
}
#noJS .titreAlt {
  margin-bottom: 10px;
  color: #ff0099;
}
#noJS p {
  color: #ffffff;
}
#noJS a {
  color: #ff0099;
  text-decoration: underline;
}
#noJS a:hover {
  color: #cccccc;
}
/*********************************/
/* -------- OLD BROWSER -------- */
/*********************************/
#oldBrowser {
  position: fixed;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  z-index: 88;
  text-align: center;
  display: none;
}
#oldBrowser .conteneur {
  position: absolute;
  left: 50%;
  top: 50%;
  width: 960px;
  height: 250px;
  padding: 95px 0;
  margin: -220px 0 0 -480px;
  background-color: #ffffff;
}
#oldBrowser .titreAlt {
  margin-bottom: 10px;
  color: #ff0099;
}
#oldBrowser p {
  color: #000000;
}
#oldBrowser .navigateurs {
  position: relative;
  width: 960px;
  height: 145px;
  margin-top: 30px;
}
#oldBrowser .navigateurs a {
  position: absolute;
  top: 0;
  display: block;
  float: left;
  text-align: center;
  color: #3a6774;
}
#oldBrowser .navigateurs a.chrome {
  left: 94px;
  width: 80px;
  background: url(../img/logos/navs/nav_chrome.png) center 0 no-repeat;
}
#oldBrowser .navigateurs a.firefox {
  left: 268px;
  width: 78px;
  background: url(../img/logos/navs/nav_firefox.png) center 0 no-repeat;
}
#oldBrowser .navigateurs a.safari {
  left: 440px;
  width: 74px;
  background: url(../img/logos/navs/nav_safari.png) center 0 no-repeat;
}
#oldBrowser .navigateurs a.opera {
  left: 608px;
  width: 74px;
  background: url(../img/logos/navs/nav_opera.png) center 0 no-repeat;
}
#oldBrowser .navigateurs a.ie {
  left: 776px;
  width: 87px;
  background: url(../img/logos/navs/nav_internet_explorer.png) center 0 no-repeat;
}
#oldBrowser .navigateurs a .sousTitreAlt {
  color: #ff0099;
  margin-top: 90px;
}
#oldBrowser .navigateurs a p {
  color: #000000;
  display: none;
}
#oldBrowser .navigateurs a:hover p {
  display: block;
  margin-top: 3px;
}
.deinegement-saisons {
  position: relative;
  height: 334px;
  width: 100%;
  overflow: hidden;
  margin: 14px 0;
}
.deinegement-saisons:hover #deinegement-saison-hiver {
  opacity: 0;
}
.deinegement-saison {
  position: absolute;
  height: 334px;
  left: 0;
  top: 0;
  opacity: 1;
  -webkit-transition-duration: opacity 0.6s ease-out;
  -webkit-transition-timing-function: ease-out;
  -moz-transition-duration: opacity 0.6s ease-out;
  -moz-transition-timing-function: ease-out;
  transition-duration: opacity 0.6s ease-out;
  transition-timing-function: ease-out;
  -webkit-transition: opacity 0.6s ease-out;
  -moz-transition: opacity 0.6s ease-out;
  -ms-transition: opacity 0.6s ease-out;
  -o-transition: opacity 0.6s ease-out;
}
.content-logos {
  width: 100%;
  height: 250px;
  font-size: 0;
  white-space: nowrap;
  margin-top: 20px;
}
.content-logo {
  width: 20%;
  height: 180px;
  margin: 0 2.5%;
  display: inline-block;
  vertical-align: top;
  -webkit-transition-duration: all 0.3s ease-out;
  -webkit-transition-timing-function: ease-out;
  -moz-transition-duration: all 0.3s ease-out;
  -moz-transition-timing-function: ease-out;
  transition-duration: all 0.3s ease-out;
  transition-timing-function: ease-out;
  -webkit-transition: all 0.3s ease-out;
  -moz-transition: all 0.3s ease-out;
  -ms-transition: all 0.3s ease-out;
  -o-transition: all 0.3s ease-out;
  border: 3px solid transparent;
}
.content-logo:hover {
  border: 3px solid #cccccc;
}