/* ============================ Couleurs ============================== */
:root {
  --cgd-blue: #0490C0;
  --cgd-blue-transparent: #0490C099 ;
}

body {
	padding : 8em 1em 5em 1em ;
	overflow-x:hidden;
	overflow-y:auto;
}

body > header {
	position : absolute ;
	position : fixed ;
	top : 0 ;
	left : 0 ;
	width : 99.9vw ;
	background-color : white ;
	padding : 0.4em ;
	z-index : 99999;
	border-bottom : 2px solid var(--cgd-blue);
	-webkit-box-shadow: 0px 12px 9px 0px rgba(165,184,199,1);
	-moz-box-shadow: 0px 12px 9px 0px rgba(165,184,199,1);
	box-shadow: 0px 12px 9px 0px rgba(165,184,199,1);
}

header .version {
	position : absolute ;
	bottom : 0.3em ;
	left : 0.3em ;
	color : var(--cgd-blue);
	font-size : 80% ;
}

header #logoCGD {
	float : left ;
}

header #logoGBK {
	float : right ;
	margin-right : 2em;
}

header h1 {
	margin-bottom : 0;
	margin-top : 0.5em;
	margin-left : 7.5em;
	color : var(--cgd-blue);
}

header .logo img {
	height : 4em ;
	margin-left : 1em ;
}

nav {
	clear : both;
	width : 100% ;
	text-align : center ;
}

nav ul {
	margin : 0 ;
}

nav ul li {
	display : inline-block ;
	padding : 0.5em 1em 0.5em 1em ;
	border : 1px solid var(--cgd-blue);
	color : var(--cgd-blue);
	margin-right : 1em ;
	border-radius : 0.5em;
	cursor : pointer;
}

nav ul li:hover{
	background-color : var(--cgd-blue);
	color : white ;
}

nav ul li > a {
    color: inherit;
    text-decoration: none;
}

#infos {
	margin-left : 3em ;
	text-align : justify ;
	width : calc(100vw - 9em) ;
}

fieldset {
	border : 1px solid var(--cgd-blue);
	border-bottom-width : 3px;
	border-left-width : 3px;
	border-radius : 1em;
	margin-top: 2em;
	margin-bottom: 2em;
	padding : 1em 0 1em 0 ;
}

legend {
	color : var(--cgd-blue);
	font-weight : 900 ;
	padding : 0 0.5em 0 0.5em ;
	margin-left : 2em ;
}

legend .reverse {
	padding: 0 0.5em 0 0.5em;
	text-transform: uppercase;
	font-style: oblique;
	color: #d48900;
}

label {
	width : 12em ;
	display : inline-block ;
	text-align : right ;
}

.lastname {
	text-transform: uppercase;
}

.btnChoix, .btnSubmit {
	background-color : var(--cgd-blue);
	color : white ;
	font-weight : 900 ;
	border : none ;
	padding : 0.3em 0.8em 0.3em 0.8em ;
	position : relative ;
	border-radius : 0.4em ;
	cursor : pointer;
}

.btnChoix:hover, .btnSubmit:hover {
	background-color : var(--cgd-blue-transparent);
}


.btnBar {
	margin-top : 1em ;
	width : 100% ;
	text-align : center ;
}

.guidage {
	font-size:90%;
}

#choixLieu {
	position: absolute;
	position: fixed;
    top: 0;
    left: 0;
	width: 99.9vw;
	height: 99.9vh;
    z-index: 999999;
    background-color: white;
    border: 2px solid var(--cgd-blue);
    display: none;
    -webkit-box-shadow: -14px 11px 8px -5px rgba(92,92,92,1);
    -moz-box-shadow: -14px 11px 8px -5px rgba(92,92,92,1);
    box-shadow: -14px 11px 8px -5px rgba(92,92,92,1);
}

.closeButton {
	float : right ;
	width : 1em;
    cursor : pointer;
    position: relative;
    top: 0.5em;
    right : 0.5em;
    border: 0px solid transparent;
    padding: 0;
    background-color: transparent;
    transition: all .2s ease-in-out;
}

.closeButton:hover {
    transform: scale(1.5);
	z-index : 999999 ;
}

#listeLieux {
	max-height : calc(100% - 18em);
	overflow-y : auto ;
	overflow-x : hidden ;
}

#titre {
	font-size : 140%;
	font-weight : bold ;
	width : 80vw;
	text-align : center ;
	position : relative ;
	left : 50%;
	transform: translate(-50%);
	color : #0490C0 ;
}

.bilanReleves {
	display : inline-block ;
	position : relative ;
	left : 50%;
	transform: translate(-50%);
	border : 1px solid darkgrey ;
	padding : 0.4em;
}

.filtre {
	position : absolute ;
	width : 100%;
	padding : 0.5em 1em 0.5em 1em ;
	box-sizing: border-box;
	background-color : #0490C0 ;
	color : white ;
	text-align : center ;
	bottom : 0 ;
	left : 0 ;
}

.filtre a.initiale {
	color : white ;
	text-decoration : none;
	border : 1px solid white ;
	width : 1.2em ;
	text-align : center ;
	display : inline-block ;
	border-radius : 0.2em;
	margin-right : 0.5em;
}

.filtre a.initiale:hover {
	background-color : white ;
	color : #0490C0 ;
}

.filtre span.initialeInactive {
	color : darkgrey ;
	background-color : lightgrey ;
	border : 1px solid darkgrey ;
	width : 1.2em ;
	text-align : center ;
	display : inline-block ;
	border-radius : 0.2em;
	margin-right : 0.5em;
}

.filtre .note {
	font-size : 90%;
	font-style : italic;
}

.listeCommunes {
	border-collapse: collapse;
    width: calc(99% - 0.5vw);
    margin-left: 0.5vw;
    font-size: 90%;
}

.listeCommunes th {
	border : 1px solid black ;
	vertical-align : middle ;
	text-align : center ;
}

.invisible {
	display : none ;
}

.listeCommunes th.initiale {
	background-color : #0490C0 ;
	color : white ;
	font-size : 120% ;
	font-weight : 900 ;
}

.listeCommunes tr.ligneCommune {
	cursor : pointer ;
}

.listeCommunes tr.ligneCommune:hover td {
	background-color : #0490C0AA;
	color : white ;
}

.listeCommunes tr.ligneCommune:hover input {
	color : white ;
}

.listeCommunes td {
	border : 1px solid black ;
	padding : 0.2em 0 0.2em 0 ;
}

.listeCommunes td form {
	margin:0;
}

.listeCommunes td input[type="submit"] {
	margin:0;
	padding-right : 0;
	font-family: "Times New Roman", Times, serif;
	font-size: 100%;
	border : none ;
	background-color : transparent;
	cursor:pointer;
}

.listeCommunes td.numCommune {
	text-align : right ;
	padding-right : 0.5em;
	width : 5%;
}

.listeCommunes td.nomCommune {
	text-align : left ;
	padding-left : 0.5em;
	width : 70%;
}

.listeCommunes td.periode, .listeCommunes td.nbReleves {
	text-align : center ;
	width : 12.5%;
}

.guidageListe {
	display : none ;
	position : fixed ;
	top : 2em ;
	/* transform: translate(0, -50%); */
	right : 2em ;
	border : 2px solid var(--cgd-blue) ;
	color : var(--cgd-blue) ;
	background-color : #EFEFEF;
	padding : 0.5em ;
	width : 20vw ;
	border-radius : 1em;
}

.guidageListe:after, .guidageListe:before {
	bottom: 100%;
	left: 50%;
	border: solid transparent;
	content: " ";
	height: 0;
	width: 0;
	position: absolute;
	pointer-events: none;
}

.guidageListe:after {
	border-color: rgba(239, 239, 239, 0);
	border-bottom-color: #EFEFEF;
	border-width: 30px;
	margin-left: -30px;
}
.guidageListe:before {
	border-color: rgba(0, 144, 192, 0);
	border-bottom-color: #0090C0;
	border-width: 33px;
	margin-left: -33px;
}

.cgdSearchResult {
	position : fixed ;
	top : 0 ;
	left : 0 ;
	width : 99.9vw ;
	min-height:99.9vh;
	z-index:999999;
	background-color:white ;
}

.twoColumns {
	columns:2 ;
	margin-top : 1em ;
}

.nonBreakableColumn {
	break-inside: avoid;
}

.nonBreakableColumn:NOT(:first-child) {
	border-left : 1px solid var(--cgd-blue);
}

.columnsTitle {
	text-align : center ;
	font-weight: 900 ;
}

input[version].actif {
    background-color: yellow;
}

input[version] {
    border: none;
    background-color: white;
    margin-right: 0.6em;
    border-radius: 0.3em;
}

input[version].actif {
	background-color : yellow;
}

table {
	border-collapse : collapse ;
}

td, th {
	padding : 0 0.5em ;
}

.annonceAssoce {
	position: fixed;
	top: 50vh;
	right: 1em;
	display: inline-block;
	z-index: 999999;
	background-color: lightgray;
	width: 500px;
	max-height: 230px;
	padding: 0 0.5em 0.5em 0.5em;
	border-radius: 0.5em;
	-webkit-box-shadow: -9px -10px 9px 4px #7F7F7F; 
	box-shadow: -9px -10px 9px 4px #7F7F7F;
	transform : translate(0, -50%) ;
}

.annonceAssoce iFrame {
	background-color : #FAFAFA ;
}

.externalLink {
	color : grey ;
	float : right ;
	margin-right : 1.5em ;
	text-decoration: none;
}

.smallText {
	color : grey ;
	float : left ;
	margin-right : 1.5em ;
	text-decoration: none;
	font-size : 80% ;
	padding-top: 0.1em;
}

.annonceAssoce header {
	height : 1em ;
	font-variant: small-caps;
	color : #5d5d5d ;
}

.blinking {
	animation: blinker 1s linear infinite;
	color: #ff04a9;
	position: fixed;
	z-index: 999999999;
	top: 0.3em;
	left: 0em;
	width: 98vw;
	text-align: center;
	margin-left : 3vw;
}

@keyframes blinker {
	50% {
		opacity: 0;
	}
}