

@charset "utf-8";
/* CSS styles


  Pr. Patrice Wira
  patrice.wira@uha.fr
  A2EB - Analyse Energ�tique et Environnementale des B�timents
  Université de Haute Alsace

*//*
.progress-bar {
    background-color: #1a1a1a;
    height: 25px;
    padding: 5px;
    width: 350px;
    margin: 50px 0;
    border-radius: 5px;
    box-shadow: 0 1px 5px #000 inset, 0 1px 0 #444;
}

.progress-bar span {
    display: inline-block;
    height: 100%;
    border-radius: 3px;
    box-shadow: 0 1px 0 rgba(255, 255, 255, .5) inset;
    transition: width .4s ease-in-out;
}
.blue span {
    background-color: #34c2e3;
}

.orange span {
      background-color: #fecf23;
      background-image: linear-gradient(top, #fecf23, #fd9215);
}

.green span {
      background-color: #a5df41;
      background-image: linear-gradient(top, #a5df41, #4ca916);
}
.stripes span {
    background-size: 30px 30px;
    background-image: linear-gradient(135deg, rgba(255, 255, 255, .15) 25%, transparent 25%,
                        transparent 50%, rgba(255, 255, 255, .15) 50%, rgba(255, 255, 255, .15) 75%,
                        transparent 75%, transparent);

    animation: animate-stripes 3s linear infinite;
}

@keyframes animate-stripes {
    0% {background-position: 0 0;} 100% {background-position: 60px 0;}
}
.shine span {
    position: relative;
}

.shine span::after {
    content: '';
    opacity: 0;
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    background: #fff;
    border-radius: 3px;
    animation: animate-shine 2s ease-out infinite;
}

@keyframes animate-shine {
    0% {opacity: 0; width: 0;}
    50% {opacity: .5;}
    100% {opacity: 0; width: 95%;}
}
.glow span {
    box-shadow: 0 5px 5px rgba(255, 255, 255, .7) inset, 0 -5px 5px rgba(255, 255, 255, .7) inset;
    animation: animate-glow 1s ease-out infinite;
}

@keyframes animate-glow {
 0% { box-shadow: 0 5px 5px rgba(255, 255, 255, .7) inset, 0 -5px 5px rgba(255, 255, 255, .7) inset;}
 50% { box-shadow: 0 5px 5px rgba(255, 255, 255, .3) inset, 0 -5px 5px rgba(255, 255, 255, .3) inset;}
 100% { box-shadow: 0 5px 5px rgba(255, 255, 255, .7) inset, 0 -5px 5px rgba(255, 255, 255, .7) inset;}
 }/*
/*bubble*/
.tooltip, .arrow:after {
  background: green;
  border: 2px solid white;
}

.tooltip {

  pointer-events: none;
  opacity: 0;
  display: inline-block;
  position: absolute;
  padding: 10px 20px;
  color: white;
  border-radius: 20px;
  margin-top: 20px;
  text-align: center;
  font: bold 14px "Helvetica Neue", Sans-Serif;
  font-stretch: condensed;
  text-decoration: none;
  text-transform: uppercase;
  box-shadow: 0 0 7px black;
}
.arrow {
  width: 70px;
  height: 16px;
  overflow: hidden;
  position: absolute;
  left: 50%;
  margin-left: -35px;
  bottom: -16px;
}
.arrow:after {
  content: "";
  position: absolute;
  left: 20px;
  top: -20px;
  width: 25px;
  height: 25px;
  -webkit-box-shadow: 6px 5px 9px -9px black,
                      5px 6px 9px -9px black;
  -moz-box-shadow: 6px 5px 9px -9px black,
                   5px 6px 9px -9px black;
  box-shadow: 6px 5px 9px -9px black,
              5px 6px 9px -9px black;
  -webkit-transform: rotate(45deg);
  -moz-transform:    rotate(45deg);
  -ms-transform:     rotate(45deg);
  -o-transform:      rotate(45deg);
}
.tooltip.active {

  opacity: 1;
  margin-top: 5px;
  -webkit-transition: all 0.2s ease;
  -moz-transition:    all 0.2s ease;
  -ms-transition:     all 0.2s ease;
  -o-transition:      all 0.2s ease;
}
.tooltip.out {
  opacity: 0;
  margin-top: -20px;
}
/*boxes*/
.heure
{
  padding:6px;
}
.boxes img{
  transform: translate(50px,0);
}
.box p
{
  opacity:0;
}

.box p:hover
{
	-moz-transform:matrix(-1,0,0,-1,0,0);
  -webkit-transform:matrix(-1,0,0,-1,0,0);
  -ms-transform:matrix(-1,0,0,-1,0,0);
  -o-transform:matrix(-1,0,0,-1,0,0);
	text-align:center;
}
.box{
	float:right;
	width:4.16%;
  max-height:240px;

}
.boxes img{
  -webkit-transform:scaleX(-1);
      -moz-transform:scaleX(-1);
      -ms-transform:scaleX(-1);
      -o-transform:scaleX(-1);
      transform:scaleX(-1);
}
.moyenne{
  -moz-transform:matrix(1,0,0,-1,0,0);
    -webkit-transform:matrix(1,0,0,-1,0,0);
    -ms-transform:matrix(1,0,0,-1,0,0);
    -o-transform:matrix(1,0,0,-1,0,0);
  max-margin-top:240px;

}
.moyennes{
  z-index: 1;
  position:absolute;
  width:730px;
  transform: translate(20px, 0);
  height:2px;
  background-color:black;
  -moz-transform:matrix(-1,0,0,-1,0,0);
    -webkit-transform:matrix(-1,0,0,-1,0,0);
    -ms-transform:matrix(-1,0,0,-1,0,0);
    -o-transform:matrix(-1,0,0,-1,0,0);
  max-margin-top:240px;
-moz-transform:translate(20px, 0px);

}

.boxes{
	background-image:linear-gradient(#090,#0C0);
	border:solid 2px #090;
	width:97%;
  float:right;

-moz-transform:matrix(1,0,0,-1,0,0);
  -webkit-transform:matrix(1,0,0,-1,0,0);
  -ms-transform:matrix(1,0,0,-1,0,0);
  -o-transform:matrix(1,0,0,-1,0,0);


}
#jour{
	text-align:right;
	font-weight:bold;

}

/*fin boxe*/

/*liste déroulant + bouton*/
#valeur1{
	background-color:#F00;
	height:100px;
	width:50px;
}


.choix_form_mesures{
	border-style: solid;
    border-width: 2px;
	border-color:#89c403;
	background-color:#89c403;
	color:#FFF;
	font-weight:bold;
	border-radius: 3px;

}
#paramform{
	font-family:arial;
	font-size:12px;
}

#datepicker{
		border-style: solid;
    border-width: 2px;
	border-color:#89c403;
	background-color:#89c403;
	color:#FFF;
	font-weight:bold;
	border-radius: 3px;
}

#bouton{
-moz-box-shadow:inset 0px 1px 0px 0px #a4e271;
	-webkit-box-shadow:inset 0px 1px 0px 0px #a4e271;
	box-shadow:inset 0px 1px 0px 0px #a4e271;
	background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, #89c403), color-stop(1, #77a809));
	background:-moz-linear-gradient(top, #89c403 5%, #77a809 100%);
	background:-webkit-linear-gradient(top, #89c403 5%, #77a809 100%);
	background:-o-linear-gradient(top, #89c403 5%, #77a809 100%);
	background:-ms-linear-gradient(top, #89c403 5%, #77a809 100%);
	background:linear-gradient(to bottom, #89c403 5%, #77a809 100%);
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#89c403', endColorstr='#77a809',GradientType=0);
	background-color:#89c403;
	-moz-border-radius:6px;
	-webkit-border-radius:6px;
	border-radius:6px;
	border:1px solid #74b807;
	display:inline-block;
	cursor:pointer;
	color:#ffffff;
	font-family:arial;
	font-size:15px;
	font-weight:bold;
	padding:6px 24px;
	text-decoration:none;
	text-shadow:0px 1px 0px #528009;

}
#bouton:hover {
background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, #77a809), color-stop(1, #89c403));
	background:-moz-linear-gradient(top, #77a809 5%, #89c403 100%);
	background:-webkit-linear-gradient(top, #77a809 5%, #89c403 100%);
	background:-o-linear-gradient(top, #77a809 5%, #89c403 100%);
	background:-ms-linear-gradient(top, #77a809 5%, #89c403 100%);
	background:linear-gradient(to bottom, #77a809 5%, #89c403 100%);
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#77a809', endColorstr='#89c403',GradientType=0);
	background-color:#77a809;
}

#bouton:active {
	position:relative;
	top:1px;
}

/*fin liste déroulant + bouton*/


*{ padding:0px;
   margin:0px;
}

a:link, a:visited {color: #0072ad; text-decoration:none;}
a:active, a:hover {color: #8dc500; text-decoration:underline;}
#mmenu a:active, #mmenu  a:hover {color: #000; }
body {margin: 20px 0px 0px 0px; background-image:url(images/a2eb_background.gif); background-repeat:repeat-x; text-align:center; padding:0px 20px 0px 20px;}
h1 {font-family:Arial, Helvetica, sans-serif; color:#0072ad; text-align:center;}
h2 {margin: 10px 0px 0px 0px; clear:both;}
h3 {margin:8px 0px 0px 0px; font-size:16px; line-height:20px; color:#0072ad; padding:0px 0px 5px 0px; display:block; font-family:Arial, Helvetica, sans-serif; color:#0072ad;}
p {margin: 0px;}
.blue {font-family:Arial, Helvetica, sans-serif; color:#0072ad; font-size:14px; font-weight:bold;}
.bigblue {font-family:Helvetica, sans-serif, Arial; color:#0072ad; font-size:20px; font-weight:bold;}
#principal { width:750px;
height:auto;
margin:auto; background-color:#FFF;
padding:10px;
text-align:justify;    /* for christmas   
background-image:url(images/a2eb_back_christmas.jpg);
background-repeat:no-repeat;
background-position: right 100px;
background-color:#9bcbd5;*/ 
}
#un {height:140px; width:200px; float:left;}
#deux {
	float:left;
	height:140px;
	width:550px;
}
table, td {border:1px solid #708b44;}
th {border:0px; height:28px; font-family:Arial, Helvetica, sans-serif; color:#ffffff; font-size:12px; padding-left:8px; background-color:#8dc500; text-align:center; vertical-align : middle; text-transform:uppercase; font-weight:bold;}
td {background-color:#e3e3e3; width=100%; font-family:Arial, Helvetica, sans-serif; font-size:11px; line-height:17px; color:#000000; padding:10px 15px 0px 15px;}
pre{font-family:Arial, Helvetica, sans-serif; color:#00aa00; font-size:12px; }
ul{list-style-type:disc;
}
ul, ol{padding-left:20px; }
a img{border-width:0;
}


/* start menu *****************    largeur: 133px; */

#mmenu{      color: #0072ad;
             font-size: 90%;
			 font-weight:bold;
			 padding:0px;
			 /* height:200px;   */
}
#mmenu ul { list-style-type:none;  padding: 0px; }
#mmenu ul ul {      display: none;
                    position: absolute;
					left: 133px;
					top: -1px;
					margin:0px;
					padding: 0px;
					border: 1px solid #B0B0B0;
}
#mmenu li {    list-style-type: none;
               position: relative;
			   width: 133px;
			   text-align:center;
			   /*height: 22px;*/
			   background-color: #E0E0E0;
			   padding: 2px;
			   margin: 0px;
			   float: left;
}
#mmenu li:hover {  background-color:#8dc500;    /* #9C6;   */
}
#mmenu li a {      text-decoration:none; display:block;
}
#mmenu li:hover ul.niveau2, #monmenu li li:hover ul.niveau3 {   display: block; width: 133px;
}
#mmenu li.plus {       background-position:right;
                       background-image: url(images/csv.png);
					   background-repeat: no-repeat;
					   border-bottom: 1px solid #B0B0B0;
}

.green {font-family:Arial, Helvetica, sans-serif; color:#8dc500; font-size:14px; font-style:italic; font-stretch:condensed;}
/* end menu *****************   */

.contact
{
    background-color: #5A99C8;
    color: #1E1E1E;
    height: 200px;
    width: 740px;
    box-shadow:-1px 2px #6E6B6A inset;
}

#a2eb_bottom{
	background-position:top center;
    background-image: url(images/a2eb_bottomshadow.png);
	background-repeat: no-repeat;
	border-bottom: 1px solid #B0B0B0;
	width: 100%; 
	height:100px;
	font-size:small;
}
#a2eb_b1 a { color:#52920a;}
#a2eb_b1{ color:#52920a;
          float: left; width: 33%; height:66px;

}
#a2eb_b2 a { color:#0072ae;}  
#a2eb_b2{ color:#0072ae;
          float: left; width: 33%; height:66px;
}
#a2eb_b3 a { color:#000;}
#a2eb_b3{ color:#000;
          float: left; width: 33%; height:66px;
}	
  



