*, html { margin:0; padding:0; }
body { background: #edf0f4 url(../images/body-bg.png) repeat-x; font-family: Arial, Helvetica, sans-serif; font-size: 12px; padding-top: 2px; }
sup { line-height: 8px; color: #ff0000; margin-left: 3px; } 

#wrapper { width: 985px; margin: 0 auto; padding-bottom: 10px; position: relative; height: 1450px;  }

/* header */
#header ul li.last { border:0; }
#header { background: url(../images/logo.png) no-repeat 6px 0; width: 985px; height: 45px; }
#header h1 { text-indent: -10000px; overflow: hidden; }
#header ul { float: right; list-style: none; padding-top: 13px; }
#header ul li { float: left; border-right: 1px solid #000; padding: 0 3px; }
#header ul li a { color: #005c9c; text-decoration: none; }

#topMenu { background: #ff6d06; height: 25px; -moz-border-radius: 4px; -webkit-border-radius: 4px; }
#topMenu ul { list-style: none; color: #fff; font-weight: bold; padding-top: 6px; }
#topMenu ul#parametres li { float: left; border-right: 1px solid #fff; padding: 0 8px; }
#topMenu ul#parametres li.last { border:0; }
#topMenu ul#parametres li a { color: #fff; text-decoration: none; }
#topMenu ul#comptes { position: relative; left: 180px; bottom: 8px; }
#topMenu ul#comptes li select { width: 240px; font-size: 11px; }
#topMenu ul#comptes li span#ttip { cursor: pointer; }
#topMenu ul#comptes li div.tooltip { position: absolute; top: 0; left: 0; z-index: 3; display: none; background: #e6f2fa; border: 1px solid #0077cc; color: #005c9c; padding: 10px; padding-right: 5px; font-size: 11px; width: 400px; }

#contentWrapper { padding: 10px 0; }

#contentLeft { position: absolute; left:0; padding-bottom: 10px; width: 215px; }
#contentLeft div { margin-bottom: 10px; background: #fff; border: 1px solid #c4c4c4; padding: 10px; -moz-border-radius: 4px; -webkit-border-radius: 4px; }
#contentLeft div div { padding:0; margin:0; border: 0; }

#contentLeft div h3 { font-size: 12px; }

#contentLeft ul { list-style: none; font-size: 13px; font-weight: bold; }
#contentLeft ul li { border-bottom: 1px solid #c4c4c4; height: 19px; padding-left: 24px; width: 170px; padding-top: 4px; }
#contentLeft ul li#tabledebord { background: #696969 url(../images/icon_tableau-de-bord.png) no-repeat 5px center; color: #fff; }
#contentLeft ul li#alertes { background: url(../images/icon_alertes.png) no-repeat 4px center; }
#contentLeft ul li#visiteurs { background: url(../images/icon_visiteurs.png) no-repeat 4px center; }
#contentLeft ul li#trafic { background: url(../images/icon_trafic.png) no-repeat 2px center; }
#contentLeft ul li#contenu { background: url(../images/icon_contenu.png) no-repeat 4px center; }
#contentLeft ul li#objectifs { background: url(../images/icon_objectifs.png) no-repeat 4px center; }

#contentLeft div.sub { -moz-border-radius: 0; -webkit-border-radius: 0; }
#contentLeft div.sub p { font-size: 11px; padding: 0 10px 8px 8px; font-weight: bold; }
#contentLeft div.sub ul li { font-size: 11px; font-weight: normal; border: 0; }
#contentLeft div.sub ul li#rapports { background: url(../images/icon_rapports.png) no-repeat 4px center; }
#contentLeft div.sub ul li#segments { background: url(../images/icon_segments.png) no-repeat 4px center; }
#contentLeft div.sub ul li#alertesgray { background: url(../images/icon_alertes-gray.png) no-repeat 4px center; }
#contentLeft div.sub ul li#email { background: url(../images/icon_email.png) no-repeat 4px center; }

#contentLeft #credits p, #contentLeft #googleanalytics p { font-weight: normal; }
#contentLeft #credits a#influenza { display: block; outline: none; background: url(../images/logo-influenza.png) no-repeat; text-indent: -10000px; height: 38px; width: 180px; padding-bottom: 8px; }
#contentLeft #googleanalytics a#ganalytics { display: block; outline: none; background: url(../images/google-analytics-logo.png) no-repeat; text-indent: -10000px; height: 41px; width: 180px; padding-bottom: 8px; }


#contentLeft #ressources ul { padding-top: 10px; } 
#contentLeft #ressources ul li { height: 24px; padding-top: 12px; padding-left: 42px; margin: 4px 0; }
#contentLeft #ressources ul li a { font-weight: bold; text-decoration: none; color: #000; }
#contentLeft #ressources ul li.facebook { background: url(../images/icon-fbook.png) no-repeat left center; } 
#contentLeft #ressources ul li.twitter { background: url(../images/icon-twit.png) no-repeat left center; }
#contentLeft #ressources ul li.facebook a:hover { color: #3a5795; }
#contentLeft #ressources ul li.twitter a:hover { color: #2ea8d1; } 

#contentLeft div#rapportsPersonnalises { padding: 10px; background: #fff url(../images/icon_rapports.png) no-repeat 10px 10px; padding-left: 24px; }
#contentLeft div#rapportsPersonnalises span { }

#contentLeft span { font-size: 13px; font-weight: bold; }

/* RIGHT */
#contentRight { padding: 10px; position: absolute; right: 0; width: 740px; background: #fff; -moz-border-radius: 4px; -webkit-border-radius: 4px;
border: 1px solid #c4c4c4; }

/* Top menu right */
#contentRight #contentRightTopMenu { background: #e4e4e4; height: 25px; margin-bottom: 15px; padding: 7px 0 0 10px; }
#contentRight #contentRightTopMenu div { float: right; font-size: 11px; line-height: 11px; color: #666666; padding-right: 10px; }
#contentRight #contentRightTopMenu div span { float: left; display: block; padding-right: 4px; padding-top: 4px; }
#contentRight #contentRightTopMenu a img { border: 0; }

/* Titre et date */
#contentRight #date { height: 70px; }
#contentRight #date h2 { font-size: 19px; float: left; }
#contentRight #date span#dateGraphic { background: url(../images/bg-date-graphic.png) no-repeat; width: 234px; height: 27px; position: absolute; right:10px; font-size: 18px; padding-left: 6px; padding-top: 5px;}

/* Graph stress */
#contentRight #stressGraph { clear: both; position: relative; height: 220px; }
#contentRight #stressGraph #topMenuGraphs { width: 740px; border-bottom: 1px solid #aaaaaa; height: 30px; background: url(../images/button-visites.png) no-repeat 6px 12px; position: absolute; z-index: 200; }
#contentRight #stressGraph #topMenuGraphs div { padding-top: 10px; float: right; background: url(../images/button-graphiquepar.png) no-repeat right center; height: 21px; }
#contentRight #stressGraph #topMenuGraphs div span { margin-right:80px; display: block; color: #aaaaaa; }
#contentRight #niveauStressGraph { position: absolute; top: -35px; }

/* Graph visites */
#contentRight #visitesGraph { padding: 20px 0; }
#contentRight #visitesGraph dl { padding: 20px 0; }
#contentRight #visitesGraph h3, #contentRight #consommations h3 { background: #666666; color: #fff; font-size: 15px; padding: 3px; padding-left: 6px;
-moz-border-radius: 2px; -webkit-border-radius: 2px; }
#contentRight #visitesGraph dl { width: 358px; float: left; position: relative; left: 4px; }
#contentRight #visitesGraph dl dt { position: absolute; left:0; height: 40px; }
#contentRight #visitesGraph dl dd { padding-left: 90px; height: 40px; font-size: 14px; font-weight: bold; color: #005c9c; margin: 4px 0; line-height: 18px; }
#contentRight #visitesGraph dl dd strong { color: #000; font-size: 17px; }

/* Divs floating */
#contentRight #otherData div, #contentRight #consommations div { float: left; width: 358px; margin-bottom: 19px; }
#contentRight #otherData div.first, #contentRight #consommations div.first { margin-right: 19px; }
#contentRight #otherData div h3 {background: #666666; color: #fff; width: 351px; font-size: 15px; padding: 3px; padding-left: 6px;
-moz-border-radius-topleft: 4px; -webkit-border-radius-top-left: 4px; -moz-border-radius-topright: 4px; -webkit-border-radius-top-right: 4px; }
#contentRight #otherData div div { border: 1px solid #dddddd; border-top:0; border-bottom:0; margin:0; height: 164px; }
#contentRight #otherData div#vueEmsembleAmis div { padding-top: 30px; height: 134px; }
#contentRight #otherData div#vueEmsembleAmis div p { padding-top: 10px; padding-left: 4px; }

#contentRight #otherData div#deplacements div { background: url(../images/graphic_piechart.png) no-repeat 30px center; padding-top: 44px; height: 145px; }
#contentRight #otherData div#deplacements div ul { padding-left: 180px; list-style: none; }

#contentRight #otherData div#syntheseGeo div { background: url(../images/graphic-synthesegeo.png) no-repeat; }
#contentRight #otherData div#syntheseGeo div ul { position: relative; width: 358px; height: 164px; list-style: none; }
#contentRight #otherData div#syntheseGeo div li { position: absolute; background: url(../images/icon-dots-provenance.png) no-repeat; width: 10px; height: 10px; margin:0; padding: 0; }
#contentRight #otherData div#syntheseGeo div li a { height: 10px; width: 10px; text-indent: -3000px; overflow: hidden; display: block; }
#contentRight #otherData div#syntheseGeo div li#one { left: 210px; top: 120px; }
#contentRight #otherData div#syntheseGeo div li#two { left: 223px; top: 104px; }
#contentRight #otherData div#syntheseGeo div li#three { left: 230px; top: 129px; }
#contentRight #otherData div#syntheseGeo div li#four { left: 264px; top: 94px; }
#contentRight #otherData div#syntheseGeo div li#five { left: 245px; top: 104px; }
#contentRight #otherData div#syntheseGeo div li#six { left: 195px; top: 127px; }
#contentRight #otherData div#syntheseGeo div li#seven { left: 225px; top: 67px; }
#contentRight #otherData div#syntheseGeo div ul li div.tooltip { position: absolute; top: 0; left: 0; z-index: 10; display: none;
 padding: 10px; padding-right: 5px; font-size: 11px; width: 100px; height: 100px; }

#tooltip { position: absolute; z-index: 888888; text-align: center; padding: 10px; background: #e6f2fa; border: 1px solid #0077cc;  }
#tooltip h3, #tooltip div { margin: 0; font-size: 12px; color: #005c9c; font-weight: bold; }

#contentRight #otherData div#keywords div { height: 189px; }

#contentRight #otherData div div ul li { font-size: 11px; padding: 0 0 0 12px; margin: 4px 0; }
#contentRight #otherData div div ul li strong { font-size: 12px; }
#contentRight #otherData div div ul li.voiture { background: url(../images/bullet-voiture.png) no-repeat 0 3px; }
#contentRight #otherData div div ul li.transportencommun { background: url(../images/bullet-tec.png) no-repeat  0 3px; }
#contentRight #otherData div div ul li.co-voiturage { background: url(../images/bullet-covoiturage.png) no-repeat  0 3px; }
#contentRight #otherData div span.bottomSpan, #contentRight #consommations span.bottomSpan { width: 350px; clear: both; display: block; background: #e5e5e5; height: 22px; font-size: 11px; padding: 8px 0 0 8px; border: 1px solid #bbbbbb; }
#contentRight #otherData div strong.big { font-size: 21px; }
#contentRight #otherData div span a, #contentRight #consommations span a { color: #005ca9; font-weight: bold; text-decoration: none; }

/* Consommations */
#contentRight #consommations { clear: both; }
#contentRight #consommations div.first { padding-left: 2px; }
#contentRight #otherData table.dataTable tr th, #contentRight #consommations div table.dataTable tr th { background: #e5e5e5; padding: 6px; font-size: 11px; border-bottom: 1px solid #bbbbbb; } 
#contentRight #otherData table.dataTable tr td, #contentRight #consommations div table.dataTable tr td { padding: 6px; font-size: 11px;
border-bottom: 1px solid #bbbbbb; }
#contentRight #otherData table.dataTable tr td strong, #contentRight #consommations div table.dataTable tr td strong { font-weight: normal; color: #005c9c; }
#contentRight #otherData table.dataTable tr.alt td, #contentRight #consommations div table.dataTable tr.alt td { background: #f9f9f9; }
#contentRight #otherData table.dataTable tr.last td, #contentRight #consommations div table.dataTable tr.last td { border-bottom: 1px solid #fff; }