.clearfix {
  clear: both;
  border: 1px solid #EDEDED;
  margin: 10px;
  padding: 15px;
  font-size: 0.80em;
  min-height: 130px;
  background-color: #F0F0F0;
    -webkit-transition-property: background-color; /* Safari */
  -webkit-transition-duration: 0.3s; /* Safari */
  transition-property: background-color;
  transition-duration: 0.3s;
  /*background-color: #EBF5FF;*/
  box-shadow: 2px 2px 5px #C3D4E2;
}

.clearfix:hover {
  -webkit-transition-property: background-color; /* Safari */
  -webkit-transition-duration: 0.3s; /* Safari */
  transition-property: background-color;
  transition-duration: 0.3s;
  background-color: #FFFFFF;

}
.clearfix:after {
   content: " "; /* Older browser do not support empty content */
   visibility: hidden;
   display: block;
   height: 0;
   clear: both;
   font-size:0.80em;
}

.text_accueil {
  clear: both;
  margin: 10px;
  padding: 15px;
  font-size: 0.80em;
  min-height: 130px;
  background: #e4e9f1; /* Old browsers */
background: -moz-linear-gradient(top,  #e4e9f1 0%, #ffffff 60%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#e4e9f1), color-stop40%,#ffffff)); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top,  #e4e9f1 0%,#ffffff 60%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top,  #e4e9f1 0%,#ffffff 60%); /* Opera 11.10+ */
background: -ms-linear-gradient(top,  #e4e9f1 0%,#ffffff 60%); /* IE10+ */
background: linear-gradient(to bottom,  #e4e9f1 0%,#ffffff 60%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#e4e9f1', endColorstr='#ffffff',GradientType=0 ); /* IE6-9 */
}

.logo_accueil{
    text-align:center;
    box-shadow: 1px 1px 5px #C3D4E2;
    border-radius: 10px;
    border: 1px solid #EDEDED;
    margin-top: -12px;
    padding: 5px 10px;
}

.logo_accueil:hover {
  -webkit-transition-property: background-color; /* Safari */
  -webkit-transition-duration: 0.3s; /* Safari */
  transition-property: background-color;
  transition-duration: 0.3s;
  background-color: #FFFFFF;

}
.logo_accueil:after {
   content: " "; /* Older browser do not support empty content */
   visibility: hidden;
   display: block;
   height: 0;
   clear: both;
   font-size:0.80em;
}

h1,h2,h3{
color:#425E86;
}

h2{
    background-color: #8DA9C3; /*#105aa1;*/
    color:#FFFFFF;
    margin-top: 0px;
    margin-bottom: 0px;
    font-size: 1.3em;
    padding: 0.35em 0.7em;
    text-shadow:1px 1px 1px #464646;
    border-radius: 5px 5px 0px 0px;
}

html, body {
  border-top:4px solid #105aa1 ;
  font-size:1.1em;
	background-color:#FFFFFF;
	margin: auto;
	color:#000; 
	font-family:Arial, Helvetica, sans-serif;
/*_background-image:url('/img/frise.png');*/
background-repeat:repeat-x;
margin:0  ;
}

.info-sigore_col a:hover, .info-carto_col a:hover{
  color: #F89607;
  text-decoration: none;
}

.info-carto ul li:hover,.info-sigore ul li:hover{
  opacity: 0.7;
}
.titre a:hover{
  text-decoration: none;
}
.vignette{
  position: relative;
  vertical-align: text-top;
  display: inline-block;
  width :24%;
}
.vignette_atals{
  background-color:#608797;
}
.vignette_mon_env{
  background-color:#7089C0;
}
.cadre_vignette{
  padding:2%;
  margin:2%;
  border-bottom-right-radius: 20px;
  font-size: 1.2em;
  box-shadow: 7px 7px 7px #C3C3C3;
}
.cadre_vignette:hover{
  transition: all 0.5s;
  -moz-transition: all 0.5s;
  -webkit-transition: all 0.5s;
  -o-transition: all 0.5s;
  background-color:#8FAA28 !important;
}
.vignette_atals:hover{
    transition: all 0.5s;
  -moz-transition: all 0.5s;
  -webkit-transition: all 0.5s;
  -o-transition: all 0.5s;
  background-color:#507382 !important;
}
.vignette_mon_env:hover{
    transition: all 0.5s;
  -moz-transition: all 0.5s;
  -webkit-transition: all 0.5s;
  -o-transition: all 0.5s;
  background-color:#5F75A5 !important;
}
.zoomoutil {
  height: 100%;
  margin-bottom: 1.65em;
  margin-left: 3%;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}
.outil_big_img {
  width: 100%;
  height: 100%;
  overflow: hidden;
  padding: 2px;
}
.vignette div  a{
  color: white;
  text-decoration: none;
  font-size: 1.5vw;
}
.outil_big_img > a img {
  width: 100%;
  height: 100%;
  transition: all 1s;
  -moz-transition: all 1s;
  -webkit-transition: all 1s;
  -o-transition: all 1s;
}
 
.zoomoutil:hover > .outil_big_img > a img {
  transform: scale(1.065);
  -ms-transform: scale(1.065);
  -webkit-transform: scale(1.065);
  -o-transform: scale(1.05);
  -moz-transform: scale(1.065);
}
.vignette span a{
 color:#718821;
 }
span.atlas_carto a{
  color:#608797;
}
span.mon_env a{
  color:#7089C0;
}

.entete ul li:hover{
  background-color: rgb(250,250,255);
  -webkit-transition-property: background-color; /* Safari */
  -webkit-transition-duration: 0.3s; /* Safari */
  transition-property: background-color;
  transition-duration: 0.4s;
}
ul li a:hover{
  text-decoration: none;
  /*color: #F89607;AV*/
  opacity: 0.7;
  background-color: rgb(250,250,255);
}
div a:hover{
  text-decoration: none;
}
.page{
    margin: 0px 10px 150px 0px;
    padding-left: 4%;
    padding-right: 4%;
}

.entete img{
vertical-align:middle;
}


span abbr{
cursor:help;
border-bottom:1px dotted #000000;
}

.entete{
font-family: "Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", Tahoma, Verdana, Arial, sans-serif;
font-weight:bold;
color:#0e5c9e;
font-size:1.2em;
text-shadow:1px 1px 1px #FFFFFF;
/* Sylvain : ancienne couleur : #A7B3CE */CCD3E3 
background: #CCD3E3; /* Old browsers */
background: -moz-linear-gradient(top,  #CCD3E3 0%, #ffffff 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#CCD3E3), color-stop(100%,#ffffff)); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top,  #CCD3E3 0%,#ffffff 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top,  #CCD3E3 0%,#ffffff 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(top,  #CCD3E3 0%,#ffffff 100%); /* IE10+ */
background: linear-gradient(to bottom,  #CCD3E3 0%,#ffffff 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#CCD3E3', endColorstr='#ffffff',GradientType=0 ); /* IE6-9 */


_background-image:url('/img/header.jpg');
_background-position:center top;
_background-repeat:no-repeat;
/*height:130px;*/
}

.titre {
    font-size: 1em;
}

a {
  /*color:#F89607;*/
  color:#4D779B;
  text-decoration:none;
}
a:hover{text-decoration:underline;}

a > img{border: 0;}

.info-sigore,.info-carto,.liste { 
_box-shadow: 8px 8px 6px #9FB6E2;
    box-shadow:2px 2px 5px #C3D4E2;
    background-color:#FAFAFA;
_border:1px solid #9999A5; 
_padding:3px;
    padding-bottom: 1px;
}

.info-sigore_col{
display:inline-table;  
width: 60%;
vertical-align: top;
padding-right:3%;
}

.info-carto_col {
display:inline-table;  
vertical-align: top;
width: 31%;
}

.colonne1,.colonne2{
display:inline-table;  
width:49%;
}

#zone-recherche {
  position: relative;
  width: 100%;
  text-align: center;
  margin: 1em 0em;
}

.intro_transparent{
  position: relative;
  vertical-align: text-top;
  display: inline-block; zoom: 1; *display: inline;
  width: 40%;
  margin:5px 10px 5px 0px;
  text-align: left;
  padding: 40px 0px;
}
.nuage  {
  position: relative;
  vertical-align: text-top;
  display: inline-block; zoom: 1; *display: inline;
  font-size:0.8em;
  margin:5px 0px 5px 0px;
  width:45%;
  padding: 15px;
  box-shadow:1px 1px 10px #E0E0E0  ;
  border-radius: 10px;
  margin-bottom: 15px;
}
.nb_couches {
  color:#EC6D33;
  font-weight:bold;
}

span input[type="text"] {
  border: solid 1px #dcdcdc;
  transition: box-shadow 0.3s, border 0.3s;
  padding:1%;
  margin-top:15px;
}
span input[type="text"]:focus,
span input[type="text"]:hover,
span input[type="text"].focus {
  border: solid 1px #707070;
  box-shadow:inset 0 0 1px 1px #dcdcdc;
}
span input::-webkit-input-placeholder {
color: #00008b !important;
font-weight: bold;
}
 
input:-moz-placeholder { /* Firefox 18- */
color: #00008b !important;  
font-weight: bold;
}
 
input::-moz-placeholder {  /* Firefox 19+ */
color: #00008b !important;  
font-weight: bold;
}
 
input:-ms-input-placeholder {  
color: #00008b !important;  
font-weight: bold;
}
.zone_recherche{
  position: relative;
  vertical-align: text-top;
  display: inline-block; zoom: 1; *display: inline;
  width: 40%;
  margin:5px 10px 5px 0px;
  text-align: right;
  padding: 40px 0px;
}
.zone_recherche img{
  margin-right:5px;
  height: 90px;
  border: 5px solid white;
}
.source{
  font-size: 1em;
  color: #818181;
}

.source a:hover{
  background-color: rgb(230,230,230);
  color: #818181!important;
  text-decoration: none;
  text-shadow: 1px 1px 0px #FFFFFF;
}

.image_supprimer_input{
background-image:url("/img/loupe_blanc.png");
background-color:#105aa1;
background-position: center;
background-repeat: no-repeat;
width:22px;
height:22px;
border: 0px;
margin: 0px;
cursor: pointer;
vertical-align: bottom;
border-radius: 2px;
vertical-align: middle;
}

.image_supprimer_input:hover {
    background-color: #5d9fde;
}

.intro{
 width:50%;
  margin:5px auto 5px auto;
  box-shadow:3px 3px 10px #C3D4E2;
background-color:#F7F7F7;
  _border:1px solid #9999A5; 
padding:3px;
}
/* partie info-WMS et help */
.intro_2{
 width:80%;
  margin:0px auto 0px auto;
  box-shadow:3px 3px 10px #C3D4E2;
background-color:#F7F7F7;
  _border:1px solid #9999A5; 
  text-align: center;

}
.urlwms{
 width:65%;
  margin:0px auto 0px auto;
  box-shadow:3px 3px 10px #C3D4E2;
background-color:#F7F7F7;
  _border:1px solid #9999A5; 
  font-size:1.3em;
}

.contenu{
 width:60%;
 margin:0px auto 0px auto;
}
.contenu_centre{
 width:50%;
 margin:0px auto 0px auto;
}

.legende_help{
 font-size: 13px;
 font-weight: bold;
}


.img_help {
float:left;
padding-top:10px;
padding-right:10px;
padding-left:10px;
padding-bottom:10px;
margin:10px;
box-shadow:1px 1px 10px #C3D4E2;
text-align : center;
}

.img_help img{
box-shadow:2px 2px 10px #C3D4E2;

}

.img_couche {
    float:left;
    text-align : left;
}

.img_couche img{
    box-shadow: 1px 1px 2px #C3D4E2;
}

.img_visualiser {
    float:right;
    font-weight: bold;
    background-color: D2D2D2;
    color:#F89607;
    margin-left: 1em;
}
.img_visualiser:hover {
  text-decoration: none;
  opacity: 0.7;
}

.img_visualiser img{
  opacity: 0.7;
    padding-right:4px;
    vertical-align: middle;

}

.nuage a:hover {
  background-color: rgb(230,230,230);
  text-decoration: none;
  text-shadow: 1px 1px 0px #FFFFFF;
}

.legende_visualiser {
    vertical-align: middle;
}

.titre {
    color: #105aa1;
    font-weight: bold;
    margin-bottom: 0.15em;
}

.entete h1 {
    color: #105aa1;
    font-weight: bold;
    margin-bottom: 0.15em;
    font-size: 1em;
}

.titre img {
    vertical-align: middle;
}

/* http://www.colorzilla.com/gradient-editor/#abaad2+0,ffffff+100;Custom
http://www.colorzilla.com/gradient-editor/#A7B3CE+0,ffffff+100;Custom

*/

.liste a{
  color: #F89607;
}

.liste_nb_couche{
  float: right;
  padding: 20px;
  margin: 40px;
  box-shadow: 1px 1px 10px #C3D4E2;
  text-align: center;
z-index:50;
}
.liste_nb_couche ul {
  
  text-align: left;
}

.entete ul{
list-style: none outside none;
margin:0px;
}

.sous_titre{
font-size:0.7em;
font-style:italic;
}

.entete li {
float:left;
margin-left:12px;
padding: 2px;
line-height: 23px;
}
.entete ul li:first-child {
margin-left:0px;
}
/*
.entete ul li:nth-child(2) {
border: 1px solid #EDEDED;
margin-top: -15px;
padding: 2px;
box-shadow: 1px 1px 5px #C3D4E2;
border-radius: 10px;
}*/


.img_padding{
  padding:3px;
}
.logo{
  float: right;
}
.portail{
  /* margin-top:-11px;
  float: right; */
  position: absolute;
  right: 30px;
  top: 0px;
}
.portail_link {
  margin-left:4px;
  padding-left: 6px;
  padding-right: 6px;
  padding-bottom: 2px;
  /*border-bottom-right-radius: 10px;
  border-bottom-left-radius: 10px;*/
  background: #105aa1; 
  position: relative;
}

.portail_link a{
  color: #FFF !important;
  font-size: 0.6em;
  font-family: arial,tahoma,helvetica,sans-serif;
  text-shadow: 0px 0px 0px #FFFFFF !important;
}
.footer_degrade{
  background: #ffffff; /* Old browsers */
  background: -moz-linear-gradient(top,  rgba(150, 150, 150, 0) 0%, rgba(150, 150, 150, 1) 100%); /* FF3.6+ */
  background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(150, 150, 150, 0)), color-stop(100%,rgba(150, 150, 150, 1))); /* Chrome,Safari4+ */
  background: -webkit-linear-gradient(top,  rgba(150, 150, 150, 0) 0%,rgba(150, 150, 150, 1) 100%); /* Chrome10+,Safari5.1+ */
  background: -o-linear-gradient(top,  rgba(150, 150, 150, 0) 0%,rgba(150, 150, 150, 1) 100%); /* Opera 11.10+ */
  background: -ms-linear-gradient(top,  rgba(150, 150, 150, 0) 0%,rgba(150, 150, 150, 1) 100%); /* IE10+ */
  background: linear-gradient(to bottom,  rgba(150, 150, 150, 0) 0%,rgba(150, 150, 150, 1) 100%); /* W3C */
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='rgba(150, 150, 150, 0)', endColorstr='rgba(150, 150, 150, 1)',GradientType=0 ); /* IE6-9 */
  height:5px;
  margin-top:-5px;
  position: fixed;
  width: 100%;
}
.pied_page{
  text-align:  center;
  background: #A7B3CE; /* Old browsers */
  background: -moz-linear-gradient(top,  #ffffff 0%, #D6D6D6 100%); /* FF3.6+ */
  background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#ffffff), color-stop(100%,#D6D6D6)); /* Chrome,Safari4+ */
  background: -webkit-linear-gradient(top,  #ffffff 0%,#D6D6D6 100%); /* Chrome10+,Safari5.1+ */
  background: -o-linear-gradient(top,  #ffffff 0%,#D6D6D6 100%); /* Opera 11.10+ */
  background: -ms-linear-gradient(top,  #ffffff 0%,#D6D6D6 100%); /* IE10+ */
  background: linear-gradient(to bottom,  #ffffff 0%,#D6D6D6 100%); /* W3C */
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#D6D6D6',GradientType=0 ); /* IE6-9 */
  height: 81px;
  bottom: 0;
  position: fixed;
  width: 100%;
  box-shadow: 0px -2px 5px rgba(0,0,0,0.1);
  padding: 0.5em 1em;
}


.pied_page img {
    vertical-align: middle;
}
.pied_page a {
    vertical-align: middle;
}

.colonne_pied{
  vertical-align: middle;
  display: inline-block; zoom: 1; *display: inline;
  text-decoration: none;
}

.colonne_pied ul li{
  list-style: none outside none;
  list-style-type:none;
  float: left;
}
.colonne_pied ul li ul{
  display: none;
  float:none;
}
.colonne_pied ul li:hover ul {
 display:block;
 }
 .colonne_pied ul li ul li{
  display: list-item;
}

.colonne_pied_outils {
    position: relative;
    height: 100%;
    display: inline-block; zoom: 1; *display: inline;
}

.colonne_pied_outils > a {
    position: relative;
    height: 100%;
    font-size: 0.7em;
    color: #818181;
}

.colonne_pied_outils:hover > a > img {
    background: #FFFFFF;
    box-shadow: 0px -1px 2px #CCCCCC;
}

.colonne_pied_outils > a + div {
    display: none;
    position: absolute;
    bottom: 80px;
    text-align: left;
    background: #FFFFFF;
    padding: 1em;
    box-shadow: 0px -2px 3px #CCCCCC;
    width: 225px;
}

.colonne_pied_outils > a + div > a {
    display: block;
    font-size: 0.9em;
    font-weight: bold;
}

.colonne_pied_outils > a > img{
    position: relative;
    max-height: 90%;
    padding: 5% 2.5%;
    width: auto;
    vertical-align: middle;
}

.colonne_pied_outils > a:hover + div, .colonne_pied_outils > a + div:hover {
    display: block;
}

.txt_pied{
  display: inline-block; zoom: 1; *display: inline;
  font-size: 0.7em;
  color: #818181;
  margin-left:15px;
  text-align: left;
  vertical-align: middle;
}
.separateur{
  display: inline-block; zoom: 1; *display: inline;
  height:95%;
  width: 1px;
  opacity: 0.2;
  vertical-align: middle;
  margin: 0px 10px;
  background-color: #000000;
  box-shadow: 1px 1px 1px 1px rgba(255, 255, 255, 0.5);
}

.description{
  font-size: 0.9em;
color: #818181;
text-align: center;
font-weight: bold;
}
.metadata_layers{
  padding-top:8px;
}
@media screen and (max-width: 1120px) {
    .sous_titre{
      font-size: 0.4em
    }
    .titre{
      font-size: 0.5em
    }
    .entete li span{
      display: none;
    }
    .zone_recherche img{
    margin-right:2px;
    height: 40px;
    }
    .zone_recherche input{
    font-size: 0.5em;
    }
    .metadata_layers{
    font-size: 0.8em;
    }
}
@media screen and (max-width: 740px) {
    .sous_titre{
      display: none;
    }
    .titre{
      display: none;
    }
    .entete li span{
      display: none;
    }
    .portail_link a{
    font-size: 0px;
    }
    .vignette span{
    font-size: 0.75em;
    }
    .zone_recherche input{
    font-size: 0.3em;
    }
    .metadata_layers{
    display: none;
    }
    .image_supprimer_input{width: 22px;height: 22px;}
}