@font-face {
font-family: "NanumGothic";
src: url("fonts/NanumGothic-Regular.ttf");
}
/* Normalizes margin, padding */
body, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, pre, form, fieldset, input, p, blockquote, th, td 
{ margin : 0; padding : 0; }

/* Normalizes font-size for headers */
h1,h2,h3,h4,h5,h6 { font-size : 100%; }

/* Removes list-style from lists */
ol,ul { list-style : none; }

/* Normalizes font-style and font-weight to normal */
address, caption, cite, code, dfn, em, strong, th, var
{ font-style : normal; font-weight : normal; }

/* Removes list-style from lists */
table { border-collapse : collapse; border-spacing : 0; }

/* Removes border from fieldset and img */
fieldset,img { border : 0; }

/* Left-aligns text in caption and th */
caption,th { text-align : left; }
/* typography */
/* typography.css */


div.nav_main p { 
font-size : 150%;
color : #88a308; 
}

div#site_info p { 
color : #fff; 
}

li > p { margin-left : 0; }

a.QPV {font : 220%/1.5 NanumGothic, sans-serif;}
a.recensement {font : 220%/1.5 NanumGothic, sans-serif;}

a:link, a:visited { 
text-decoration : none; }

a:link, a:visited { 
color : red; }

a:hover { 
color : blue; }

ul.nav_tools a {
color : #666; } 

img#logo {
float: right;
height: 90px;
}
/* create css for tabs */
/* Style the tab */
.tab {
  float: left;
  border: 1px solid #ccc;
  background-color: #f1f1f1;
  height: 30px;
}

/* Style the buttons that are used to open the tab content */
.tab button {
  display: block;
  font : 100% NanumGothic, sans-serif;
  background-color: inherit;
  color: black;
  padding: 5px;
  width: 100%;
  border: none;
  outline: none;
  text-align: left;
  cursor: pointer;
  transition: 0.3s;
}

/* Change background color of buttons on hover */
.tab button:hover {
  background-color: #ddd;
}

/* Create an active/current "tab button" class */
.tab button.active {
  background-color: #ccc;
}
/* form style */
form {
font : 100%/1.5 NanumGothic, sans-serif;
width : 100%;
background : #f1efe2;
 }
form table {
margin-left : 10px;
margin-top : 10px;
column-width: auto;
width:30%;
max-width:300px;
}
form#dotations table {
margin-left : 10px;
margin-top : 10px;
column-width: auto;
width:100%;
max-width:1300px;
}
form table td {
width: fit-content;
}

form p.bouton {
font : 100%/1.5 NanumGothic, sans-serif;
margin-left : 20px;
width : 50%;
 }
form h2  {
margin-top: 10px;
font : 150% NanumGothic, sans-serif;
color : #fff; }

input {font : 150%/1.5 NanumGothic, sans-serif;
width: fit-content;
margin : 0 ;
background : #f1efe2; color : green;}

input#normal {font : 150%/1.5 NanumGothic, sans-serif;
width: fit-content;
margin : 0 ;
background : #f1efe2; color : green;}

textarea {font : 150%/1.5 NanumGothic, sans-serif;
width: 300px;
height: 60px;}

/* for autocomplete dropdowns */
.ui-autocomplete { position: absolute; cursor: default; background:#CCC }   

/* workarounds */
html .ui-autocomplete { width:1px; } /* without this, the menu expands to 100% in IE6 */
.ui-menu {
    list-style:none;
    padding: 2px;
    margin: 0;
    display:block;
    float: left;
}
.ui-menu .ui-menu {
    margin-top: -3px;
}
.ui-menu .ui-menu-item {
    margin:0;
    padding: 0;
    zoom: 1;
    float: left;
    clear: left;
    width: 100%;
}
.ui-menu .ui-menu-item a {
    text-decoration:none;
    display:block;
    padding:.2em .4em;
    line-height:1.5;
    zoom:1;
}
.ui-menu .ui-menu-item a.ui-state-hover,
.ui-menu .ui-menu-item a.ui-state-active {
    font-weight: normal;
    margin: -1px;
}
/* Tooltip container */
.tooltip {
  position: relative;
  display: inline-block;
  float: top;
  border-bottom: 1px dotted black; /* If you want dots under the hoverable text */
}

/* Tooltip text */
.tooltiptext {
  display: block;
  visibility: visible;
  width: 200px;
  background-color: green;
  color: #fff;
  text-align: center;
  padding: 5px 5px;
  border-radius: 6px;
 
  
  /* Position the tooltip */
  position: relative;
  z-index: 1;
  bottom: -10px;
  left: 50%;
  margin-left: -100px;
}


input#error {font : 150%/1.5 NanumGothic, sans-serif;
width: fit-content;
margin : 0 ;
background : red; color : black;}

table {
border-radius: 5px;
border: 4mm ridge rgba(51, 102, 153, .6);
background : #f1efe2;
}
th {
font : 150% NanumGothic, sans-serif;
background : blue;
color : white; 
padding: 5px;
opacity: 1;
z-index: 10;
}

th#label {
font : 150% NanumGothic, sans-serif;
background : #f1efe2;
color : black; 
padding: 5px;
opacity: 1;
}

td {
font : 100% NanumGothic, sans-serif;
padding: 5px;
opacity: 1;
min-width : 7em;
width: fit-content;
max-width:800px;
z-index: 10;
}

td#total{
font : 100% NanumGothic, sans-serif;
padding: 5px;
opacity: 1;
font-weight:bold;
min-width : 7em;
width: fit-content;
max-width:800px;
z-index: 10;
}

tr#total{
font : 110% NanumGothic, sans-serif;
padding: 5px;
opacity: 1;
font-weight:bold;
color: blue;
min-width : 7em;
width: fit-content;
max-width:800px;
z-index: 10;
}

td#dvf {
font : 100% NanumGothic, sans-serif;
color:black;
padding: 5px;
opacity: 1;
text-align:right;
min-width : 2em;
max-width:800px;
z-index: 10;
}
td#label {
font : 100% NanumGothic, sans-serif;
background : #f1efe2;
color : black; 
padding: 5px;
max-width:800px;
opacity: 1;
}

form p {
margin-left : 5px;
}
select {
font : 150%/1.5 NanumGothic, sans-serif;
width: auto;
margin : 0 ;
background : #f1efe2; color : black;
}
fieldset {position: relative;
		padding: 0 1em 1em 1em;
	}
	
legend {
		padding: 1em;
font : 150%/1.5 NanumGothic, sans-serif;
color : black;
	}
label {
font : 150%/1.5 NanumGothic, sans-serif;
		width: 15em;
		margin-left: 5px;}

div#texte-libre {
position : relative;
margin-left : 20px;
width : 92%;
 }

#chart-container {
border-radius: 5px;
border: 4mm ridge rgba(51, 102, 153, .6);
background : #f1efe2;
width:900px;
height: auto;
float: left;
} 
#chart-container-dotations {
border-radius: 5px;
border: 4mm ridge rgba(51, 102, 153, .6);
background : #f1efe2;
width:2400px;
height: auto;
float: left;
}
/* color.css */

html { 
background-color : #f1efe2; }
canvas { 
         width: 100%;
      }


div#content { 
background-color : #fff; }

div#partner { 
background-color : #fff; }

div#site_info { 
position : relative;
clear : both;
width : 100%;
height : 120px;
background : #f1efe2 url(images/site_info.png) no-repeat 0 0; 
background-color : #336699;
}


div#branding blockquote { 
position : absolute;
top : -9999px; }

div#menu{
	font-family: "NanumGothic";
	width : 98%;
	min-width : 640px;
	margin : 0 auto;
	color: var(--color-text);
	background-image: url("/images/lyon.jpg");
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}

li#menu {
margin:20px;
width:30%;
max-width:300px;
display:inline-block;
vertical-align: middle;
z-index:30;}



button#menu_item{ display: inline; background : #f1efe2; color : green; font: 300% "NanumGothic";
width: 300px;
height:300px;
text-align: center;
border-radius: 5px;
border: 4mm ridge rgba(51, 102, 153, .6);
z-index:20;
}
button#save{ display: inline; background : #f1efe2; color : green; font: 300% "NanumGothic";
width: 500px;
height:150px;
text-align: center;
border-radius: 5px;
border: 4mm ridge rgba(51, 102, 153, .6);
z-index:20;
}
button#abandon{ display: inline; background : #f1efe2; color : red; font: 300% "NanumGothic";
width: 500px;
height:150px;
text-align: center;
border-radius: 5px;
border: 4mm ridge rgba(51, 102, 153, .6);
z-index:20;
}
button#exporter{ display: inline; background : #f1efe2; color : green; font: 250% "NanumGothic";
width: 300px;
height:100px;
text-align: center;
border-radius: 5px;
border: 4mm ridge rgba(51, 102, 153, .6);
z-index:20;
}
div.contenu-neuf {
float : left;
width:100%;
padding: 1em 0;
-moz-column-count : 2;
}


ul.nav_features {
/* position : absolute; */
padding-top : 50px;
margin-left : 50px;
width : 100%;
height : 50px; }

ul.nav_features li {
display : inline;  }

ul.pk { list-style: none;
font-size : 100%;	}

ul.body { list-style: none;
font-size : 100%;	}


ul.nav_tools {
/* position : absolute; */
top : 3px;
left : 150px;
margin : 0;
width : 580px; }

ul.nav_tools li {
display : inline; }

ul.nav_tools li a {
margin-right : 10px;
padding-right : 10px;
 }

li { 
position : relative; 
width : 68%; 
padding-bottom : .5em; }

li#display { 
width : 68%; 
padding-bottom : .5em; }

li.body {
margin-left : 20px;
}

li.pk {
margin-top : 0;
margin-left : 2px;
margin-right : 2px;
margin-bottom : 2px;
width: 98%;
}

li.pksites {
margin-left : 2px;
margin-right : 2px;
margin-bottom : 2px;
width: 98%;
}

li.pkborder {
margin-top : 0;
margin-left : 2px;
margin-right : 2px;
margin-bottom : 2px;
width: 98%;
border-style : double;
border-width: 3px;}


li.nav_signup, li.nav_search, li.nav_more {
/* position : absolute; */
display : block;
height : 50px; 
width : 140px; }


li.nav_tab {
/* display : absolute; */
display : block;
height : 50px; 
width : 140px; 
padding: 20px 20px 20px 0;
font : 200% NanumGothic, sans-serif; 
}

li.nav_tab1 {
/* display : absolute; */
display : block;
height : 50px; 
width : 140px; 
padding: 20px 20px 20px 0;
font : 200% NanumGothic, sans-serif; 
}
li.nav_logout a, li.nav_rss a {
margin-right : 0;
padding-right : 0; }

li.nav_tab2 {
/* display : absolute; */
display : block;
height : 50px; 
width : 140px; 
padding: 20px 20px 20px 0;
font : 200% NanumGothic, sans-serif; 
margin-left : 1000px;
}



li.nav_rss {
/* position : absolute;*/
right : 0;
width : 120px;
height : 25px; }

li.nav_rss a { 
display : block;
width : 120px; 
height : 25px; }

div.nav_main p { 
position : absolute;
top : 45px;
left : 35px;
margin : 0; }

div.nav_main h2 { 
position : absolute;
top : -9999px; }

.dropdown {
  float: left;
  overflow: hidden;
}

.dropdown .dropbtn {
  font-size: 16px;  
  border: none;
  outline: none;
  color: #f90;
  padding: -20px 20px 20px 0;
  background-color: inherit;
  font : 100% NanumGothic, sans-serif; 
  margin: 0;
  z-index: 1000;
}

.navbar a:hover, .dropdown:hover .dropbtn {
  background-color: green;
}

.dropdown-content {
  display: none;
  position: absolute;
  background-color: white;
  min-width: 160px;
  box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
  z-index: 1000;
  border-bottom: 1px;
}

.dropdown-content a {
  float: none;
  color: #f90;
  padding: 2px 20px 20px 0;
  text-decoration: none;
  display: block;
  text-align: left;
  z-index: 1000;
  border-bottom: 1px;
}

.dropdown-content a:hover {
  background-color: green;
}

.dropdown:hover .dropdown-content {
  display: block;
}
div#site_info h5 { 
position : absolute;
right : 10px; 
bottom : 0;
width : 100%; 
height : 70px; 
}

div#site_info h5 a { 
display : block;
font : 150%/1.5 NanumGothic, sans-serif;
width : 600px; 
height : 70px; 
text-indent : 30px; }

div#site_info p { 
position : absolute;
left : 10px; 
top : 10px;
margin : 0; }

div#site_info h5 + p { 
text-indent : 10px; } 

/* layout.css */

html 	{ 
background-color : #faf9f5; 
  zoom: 67%;}

body { 
font : 78%/1.5 NanumGothic, sans-serif;
width : 98%;
min-width : 640px;
margin : 0 auto;
}

div#banner1 { 
font : 78%/1.5 NanumGothic, sans-serif;
width : 100%;
min-width : 640px;
margin : 0 auto;
padding-top : 340px;
background : url(images/body.jpg) no-repeat 50% 0;
color : #f1efe2; 
}

div#banner2 { 
font : 78%/1.5 NanumGothic, sans-serif;
width : 100%;
min-width : 640px;
margin : 0 auto;
padding-top : 114px;
background : url(images/body.jpg) no-repeat 50% 0;
color : #f1efe2; 
}

div#branding {
position : relative;
z-index : 10;
height : 120px;
background : transparent url(images/branding.png) no-repeat 0 0; 
}

div.nav_main { 
/* position : relative;*/
z-index : 1;
width : 100%;
height : 90px;
background : #f1efe2 url(images/nav_main.png) repeat 0 0; 
}


div#content_top { 
width : 100%;
margin-left:0;
padding-bottom : 1em;
}

div#partner {
width:5%;
margin-left:95%;
padding-bottom : 1em;
}
div#map {
height: 1px;
width : 100%;
}
div#info-box{
background-color: white;
border: 3px solid black;
font : 150%/1.5 NanumGothic, sans-serif;
margin : 20px;
width : 30%;
float : right;}

p#legend {
font : 100% NanumGothic, sans-serif; 
margin-left : 5%;
height:20px;
width:500px;
}

div#content_main {
margin-top : 0;
margin-left : 0px;
overflow: hidden;
width : 100%;
clear:both}

div#DVF {
margin-top : 0px;
height : 900px;
width : 98%;
overflow-y: auto;
float : left;
}

div#dotations {
font : 100% NanumGothic, sans-serif; 
margin-top : 0px;
height : 1600px;
width : 98%;
overflow-y: auto;
float : left;
}

div#balances {
font : 100% NanumGothic, sans-serif; 
margin-top : 0px;
height : 1600px;
width : 98%;
overflow-y: auto;
float : left;
}
/* div#balances h2 table#log tbody tr td:hover {
position: absolute;
top: -5px;
  left: 105%;
content: "Cliquer pour séléctionner ce compte partout";
z-index:5;
}*/
div#CM {
font : 100% NanumGothic, sans-serif; 
margin-top : 0px;
height : 800px;
width : 58%;
overflow-y: auto;
float : left;
}

div#EPCI {
font : 100% NanumGothic, sans-serif; 
margin-top : 0px;
margin-left :10px;
margin-bottom : 10px;
height : 600px;
width : 40%;
overflow-y: auto;
float : left;}

div#EPCI-titre {
margin-top : 0px;
margin-left :10px;
margin-bottom : 10px;
width : 40%;
float : left;}

div#CD {
font : 100% NanumGothic, sans-serif; 
margin-top : 0px;
width : 33%;
height : 1000px;
overflow-y: auto;
float : left;
}

div#CR {
font : 100% NanumGothic, sans-serif; 
margin-top : 0px;
margin-left :10px;
margin-bottom : 10px;
width : 60%;
height : 700px;
overflow-y: auto;
float : left;
}
div#UE {
font : 150% NanumGothic, sans-serif; 
margin-top : 0px;
margin-left :10px;
margin-bottom : 10px;
width : 60%;
height : 1000px;
overflow-y: auto;
float : left;
border-radius: 5px;
border: 4mm ridge rgba(51, 102, 153, .6);
background : #f1efe2;
}
div#risques {
font : 150% NanumGothic, sans-serif; 
margin :10px;
overflow-y: auto;
}


div#risques th {
padding:5px;
min-width: 2em;
border-bottom-style: groove;}

td#zero {
padding:5px;
min-width: 1em;
text-align:right;
z-index: 1;}

div#risques td {
padding:5px;
min-width: 2em;
border-bottom-style: groove;}
td#zero {
padding:5px;
min-width: 1em;
z-index: -2;}

td#label {
padding:5px;
width: 20em;
overflow-y: auto;
border-bottom-style: groove;
}

div#risques tr:nth-child(even) {background-color: blue;color:white;}
div#risques h3 tr:nth-child(even) {background-color: blue;color:white;}
div#risques h2 tr:nth-child(even) {background-color: blue;color:white;}

div#risques li { 
position : relative; 
width : 100%; 
overflow-y: scroll;
height: 30px;
padding-bottom : .5em; }

thead  { position: sticky; top: 0; z-index: 0; }
colgroup {position: sticky;background-color:#cce6ff;}

div#CR-titre {
margin-top : 0px;
margin-left :10px;
margin-bottom : 10px;
width : 60%;
float : left;
}
div#deputes {
margin-top : 0px;
margin-left :10px;
width : 20%;
height : 300px;
overflow-y: auto;
float : left;}

div#senateurs {
margin-top : 0px;
width : 40%;
height : 300px;
overflow-y: auto;
float : left;}

div#content_right {
margin-top : 0px;
width : 68%;
float : left;}

div#content_right_column {
font : 150%/1.5 NanumGothic, sans-serif;
margin : 20px;
width : 30%;
float : right;}

div#framed{
border-radius: 5px;
border: 4mm ridge rgba(51, 102, 153, .6);
background : #f1efe2;}

img#framed {
border-radius: 5px;
border: 4mm ridge rgba(51, 102, 153, .6);
background : #f1efe2;}

li.tabs {
font : 14pt NanumGothic;
padding: 0;
background-color: blue;
color:white;
}

tr.upright {
height:200px;
width: 500px;
align-items: top;
padding: 15px 15px;
margin: 15px 15px;
}
th.upright {
float: left;
font : 150% NanumGothic;
/*margin: 5px 5px 5px 5px; 
padding : 5px 5px;
transform-origin: 0 0;*/
transform: rotate(90deg);
line-height: 20px;
width: 46px;
height:46px;
color: black;
background : #faf9f5;
}
td#stats {margin: 2px 2px 2px 2px; padding : 2px 2px; background : #f1efe2; color : black; font: 100% "NanumGothic";
text-align: center; width: 60px;
}
tr.tooltip {height: 100px;}
h2#stats {
font : 150% NanumGothic, sans-serif; 
letter-spacing : -1px; 
color : black; }
div#footer {
margin-top : 30px;
margin-left : 0; 
width : 100%;}
/* styles for markers created in javascript google_markers.js */
div.leaflet-popup-content-wrapper{height:200px;padding:5px;}
div#marker1{
width: 96%; padding:5px;overflow-wrap: normal;float: left;color: #FFF;background: #ed1e79;line-height: 25px;border-radius:5px 5px 0px 0px;font-size:18px;font-weight:bold;
}
div#marker2{
clear:both;height:0px;"><div style="float:left;width:90%;padding:5px 10px;border:1px solid #ccc;border-top:none;border-radius:0px 0px 5px 5px;
}
div#marker3{
float:left;color:#666;font-size:18px;font-weight:bold;margin:5px 0px;
}
div#marker4{
font-size:18px;font-weight:bold;
padding: 5px;
}
div#marker5{
style="clear:both;height:0px;"
}
h1 {
padding-top : .25em;
font : 48pt NanumGothic, sans-serif; 
text-transform : lowercase;
letter-spacing : .15em;
color : #710000; }

h2 {
font : 18pt NanumGothic, sans-serif; 
letter-spacing : -1px; 
color : #369; }

ul + h2 {
margin-top : .5em; 
padding-top : .5em; 
border-top : 1px solid #666; }

h3#photos {
margin-left : 520px;
width:100%;
font : bold 100% NanumGothic, sans-serif; 
color : #369; }

h3#legend {
font : 120% NanumGothic, sans-serif; 
margin-left : 1%;
height:20px;
width:67%;
}

li#photos {
min-height : 510px;
}


li#photos p { 
font-weight : normal;
position : relative; 
width : 95%; 
padding-bottom : .5em; 
margin-left : 510px;
}
li#photos strong{font-weight: bold;
	color: #006633;}

li#photos img { position : absolute; }

li#photos img { top : 5px; left : -510px; }

p#photos button{ display: inline; background : #369; color : #fff; font: 90% "NanumGothic";
text-align: center;
}
ul#photobutton {margin-left : 520px;
min-width : 30px;
width: 100%} 
ul#photobutton li{ display: inline; margin: 5px 5px 5px 5px;  background : #369; color : #fff; font: 90% "NanumGothic";
text-align: center;
}
ul#photobutton input{background : #369; color : #fff;}
h3 + p {
font-size : 92%;
text-align : justify;
}
h3.property {
margin-left : 5px;
font : bold 110% NanumGothic, sans-serif; 
color : #369; }


li.property {
min-height : 130px;
}


li.property p { 
font-weight : normal;
position : relative; 
width : 95%; 
padding-bottom : .5em; 
margin-left : 130px;
}
li.property strong{font-weight: bold;
	color: #006633;}

li.property img { position : absolute; }

li.property img { top : 5px; left : -120px; }


p.property.button{ display: inline; background : #369; color : #fff; font: 90% "NanumGothic";
text-align: center;
}
ul.button {margin-left : 125px;
min-width : 30px;
width: 100%} 
ul.button li{ display: inline; margin: 5px 5px 5px 5px;  background : #f1efe2; color : black; font: 100% "NanumGothic";
text-align: center;
}
ul.button input{background : #f1efe2; color : black;}
h3 + p {
font-size : 92%;
text-align : justify;
}
h3 th{margin: 2px 2px 2px 2px; padding : 2px 2px; background : #f1efe2; color : black; font: 24pt "NanumGothic";
text-align: center; font-weight: bold;
}

h3 td{margin: 2px 2px 2px 2px; padding : 2px 2px; background : #f1efe2; color : black; font: 24pt "NanumGothic";
text-align: center;
width: fit-content;
min-width:1em;
}
h3 td#warning{margin: 2px 2px 2px 2px; padding : 2px 2px; background : #f1efe2; color : red; font: 24pt "NanumGothic";
text-align: center;
width: fit-content;
}
tr#log th:nth-child(2n+5) {background-color: red;color:white;}

th#log {margin: 5px 0 5px 5px; padding : 5px 5px; background : #f1efe2; color : black; font: 110% "NanumGothic";
text-align: left;
}
h3 thead { position: sticky; top: 0; z-index: 1000;}
td#log {margin: 5px 0 5px 5px; padding : 5px 5px; background : #f1efe2; color : black; font: 110% "NanumGothic";
text-align: left;
}
h2 td#left{margin: 2px 2px 2px 2px; padding : 2px 2px; background : #f1efe2; color : black; font: 100% "NanumGothic";
text-align: left;
width: fit-content;
z-index: -2;
}
h2 td#right{margin: 2px 2px 2px 2px; padding : 2px 2px; background : #f1efe2; color : black; font: 100% "NanumGothic";
text-align: right;
width: fit-content;
z-index: -2;
}
h2 td#centre{margin: 2px 2px 2px 2px; padding : 2px 2px; background : #f1efe2; color : black; font: 100% "NanumGothic";
text-align: center;
width: fit-content;
z-index: -2;
}
div#content > h2, div#content > p {
margin-right : 320px; } 

div#branding, div.nav_main, div#site_info {
width : 100%; }

.autocomplete-items {
  position: absolute;
  border: 1px solid #d4d4d4;
  border-bottom: none;
  border-top: none;
  z-index: 99;
  /*position the autocomplete items to be the same width as the container:*/
  top: 100%;
  left: 0;
  right: 0;
background : #f1efe2; color : black; font: 100% "NanumGothic"

}
.autocomplete-items div {
  padding: 10px;
  cursor: pointer;
  border-bottom: 1px solid #d4d4d4;
background : #f1efe2; color : black; font: 100% "NanumGothic"
}
.autocomplete-items div:hover {
  /*when hovering an item:*/
  background-color: #e9e9e9;
}
.autocomplete-active {
  /*when navigating through the items using the arrow keys:*/
  background-color: DodgerBlue !important;
  color: #ffffff;
}