body {
	--progonos-global-fg : #101010 ;
	--progonos-global-bg : #FEFEFE ;

	--progonos-basic-blue : #0090C0 ;
	--progonos-middle-blue : #027fa8 ;
	--progonos-middle-blue-trans : #027fa85e ;
	--progonos-light-blue : #06C1FF ;
	--progonos-verylight-blue : #93e2fd ;
	--progonos-hover-blue : #0090C040 ;
	--progonos-semiTransparent-light-blue : #87cde15c ;
	
	--progonos-bg-blue : #e2f0f5f2 ;

	--progonos-basic-orange : orange ;
	--progonos-dark-orange : #b97e12 ;
	
	--progonos-border-gray : #BEBEBE ;
	--progonos-border-darkgray : #ADADAD ;
	--progonos-light-bgGray : #cecece85 ;
	--progonos-middle-fgGray : #525252 ;

	--progonos-shadow : 12px 12px 12px 0px rgba(0,0,0,0.79); 

	--progonos-ok-message-fg : #479f47 ;
	--progonos-err-message-fg : #e80b0b ;
	--progonos-important-message-fg : #fe0462 ;
	--progonos-err-in-table-fg : rgb(188, 6, 6) ;

	/* Arrows on boxes */
	--progonos-arrowed-box-fg : #ececec ;
	--progonos-arrowed-box-transparent : rgba(136, 183, 213, 0) ;
	--progonos-arrowed-box-border : #828181 ;

	/* Header */
	--progonos-dark-blue : #005774 ;
	--progonos-fg-on-dark-bg : white ;
	--progonos-active-menu-icon : #25e825 ; /* Option active */

	/* Fond de page */
	--progonos-page-background-fg : black ;

	/* Map */
	--progonos-tooltip-title-fg : #e12c4b;
	--progonos-map-cluster-centre : #02CFFE ;
	--progonos-map-cluster-bord : #02CFFE50 ;
	--progonos-map-cluster-fg : black ;
	--progonos-map-marker-fg : #FFB80C ;

	/* Forms, structured texts */
	--progonos-form-label : #868585 ;
	--progonos-form-label-revert : #b9b9b9 ;
	--progonos-input-border : #303030 ;
	--progonos-input-bg : #F2F2F2 ;
	--progonos-bar-fg : #EFEFEF ;
	--progonos-required-field-fg : #bd4545 ;
	--progonos-filled-required-field-fg : #479f47 ;
	--autocompleted-field-bg : #f0f0f0 ;
	--progonos-overlined-text-bg : #fffbb8 ;
	--progonos-overlined-text-fg : #303030 ;
	--progonos-undefined-data-fg : #676666 ;
	--progonos-detailed-info-fg : #223f4e ;
	--progonos-main-title-fg : #06C1FF ;

	/* Tables */
	--progonos-table-bg : #DEDEDE ;
	--progonos-table-fg : #202020 ;
	--progonos-table-caption-bg : transparent ;
	--progonos-table-caption-title-bg : #223f4e ;
	--progonos-table-caption-title-fg : #EFEFEF ;
	--progonos-table-caption-link-fg : #2e88a6 ;
	--progonos-table-even-lines-bg : #efefef7a ;
	--progonos-table-odd-lines-bg : #cdcdcd9e ;
	--progonos-table-cell-label-fg : #b3b3b3 ;
	--progonos-table-cell-link-fg : #2786a0 ;
	--progonos-table-action-icon-fg : #0090C0 ;
	--progonos-table-help-icon-fg : #26bf26 ;
	--progonos-table-symbol-icon-fg : #909090 ;

	/* Popups */
	--progonos-modal-div-bg : #313131f2;
	--progonos-modal-div-fg : white;
	--progonos-popup-bg : #E0E0E0 ;
	--progonos-popup-border : #747474 ;
	--progonos-popup-header-bg : #858585 ;
	--progonos-popup-header-fg : white ;
	--progonos-popup-intro-border: #868585 ;
	--progonos-popup-content-title : #868585 ;
	--progonos-popup-special-info : #A0A0A0 ;
	--progonos-popup-intro-fg : #202020 ;

	/* Notes d'info */
	--progonos-aside-fg : #66849f ;
	--progonos-aside-bg : #ebf3f9 ;

	/* Imported content */
	--progonos-imported-bg : #ffffffe3;

	/* Aide */
	--progonos-help-bg : #E0E0E0 ;
	--progonos-help-border : #747474 ;
	--progonos-pic-bg : #303030 ;
	--progonos-pic-caption-bg : #606060 ;
}

@media (prefers-color-scheme: dark) { 
	body:not([mode="clair"]) {
		--progonos-global-fg : #FEFEFE ;
		--progonos-global-bg : #303030 ;
		--progonos-alternate-global-bg : #5e5e5e ;

		--progonos-basic-blue : #0090C0 ;
		--progonos-middle-blue : #027fa8 ;
		--progonos-middle-blue-trans : #027fa85e ;
		--progonos-dark-blue : #005774 ;
		--progonos-light-blue : #06C1FF ;
		--progonos-verylight-blue : #93e2fd ;
		--progonos-hover-blue : RGB(0, 94, 125) ;
		
		--progonos-bg-blue : #005774 ;

		--progonos-basic-orange : orange ;
		--progonos-dark-orange : #b97e12 ;
		
		--progonos-border-gray : #BEBEBE ;
		--progonos-border-darkgray : #747474 ;
		--progonos-light-bgGray : #cecece85 ;
		--progonos-middle-fgGray : #AEAEAE ;
		--progonos-light-fgGray : #cbcbcb ;

		--progonos-required-field-fg : #d90303 ;
		--progonos-err-in-table-fg : rgb(255, 145, 145) ;

		--progonos-undefined-data-fg : #959595 ;
		--progonos-table-cell-link-fg : #E6E6E6 ;
		--progonos-popup-header-bg : #606060 ;
		--progonos-form-label : #b9b9b9 ;
		--progonos-form-label-revert : #868585 ;
		--progonos-popup-content-title : #303030 ;
		--progonos-popup-intro-fg : #303030 ;

		--progonos-popup-bg : #aeaeae ;
		--progonos-popup-intro-border : #606060 ;

		--progonos-aside-fg : #96b4cd ;
		--progonos-aside-bg : #202f3c ;

		--progonos-table-bg : #49a4c1f2 ;
		--progonos-table-fg : #E6E6E6 ;
		--progonos-table-even-lines-bg : #0057747a ;
		--progonos-table-odd-lines-bg : #0057749e ;
		--progonos-table-action-icon-fg : #4fb4d5 ;
		--progonos-table-symbol-icon-fg : #DEDEDE ;
		--progonos-table-help-icon-fg : #81d781 ;
	}
}

body[mode="dark"] {
	--progonos-global-fg : #FEFEFE ;
	--progonos-global-bg : #303030 ;

	--progonos-basic-blue : #0090C0 ;
	--progonos-middle-blue : #027fa8 ;
	--progonos-middle-blue-trans : #027fa85e ;
	--progonos-dark-blue : #005774 ;
	--progonos-light-blue : #06C1FF ;
	--progonos-verylight-blue : #93e2fd ;
	--progonos-hover-blue : RGB(0, 94, 125) ;
	
	--progonos-bg-blue : #005774 ;

	--progonos-basic-orange : orange ;
	--progonos-dark-orange : #b97e12 ;
	
	--progonos-border-gray : #BEBEBE ;
	--progonos-border-darkgray : #747474 ;
	--progonos-light-bgGray : #cecece85 ;
	--progonos-middle-fgGray : #AEAEAE ;

	--progonos-required-field-fg : #d90303 ;
	--progonos-err-in-table-fg : rgb(255, 145, 145) ;

	--progonos-undefined-data-fg : #959595 ;
	--progonos-table-cell-link-fg : #E6E6E6 ;
	--progonos-popup-header-bg : #606060 ;
	--progonos-form-label : #b9b9b9 ;
	--progonos-form-label-revert : #868585 ;
	--progonos-popup-content-title : #303030 ;
	--progonos-popup-intro-fg : #303030 ;

	--progonos-popup-bg : #aeaeae ;
	--progonos-popup-intro-border : #606060 ;

	--progonos-aside-fg : #96b4cd ;
	--progonos-aside-bg : #202f3c ;

	--progonos-table-bg : #49a4c1f2 ;
	--progonos-table-fg : #E6E6E6 ;
	--progonos-table-even-lines-bg : #0057747a ;
	--progonos-table-odd-lines-bg : #0057749e ;
	--progonos-table-action-icon-fg : #4fb4d5 ;
	--progonos-table-symbol-icon-fg : #DEDEDE ;
	--progonos-table-help-icon-fg : #81d781 ;
}

body {
	padding-top : 4em ;
	overflow-x:hidden;
	font-family:sans-serif;
	font-size:12pt;
	color : var(--progonos-global-fg) ;
	background-color : var(--progonos-global-bg) ;
}
body.noSpaceOnTop {
	padding-top : 0 !important ;
}
body.alternateBG {
	background-color : var(--progonos-alternate-global-bg) ;
}

.globalMenu {
  width: 98vw;
  margin-left: 1vw;
}

body .arrierePlan {
	position : fixed ;
	top : 0 ;
	left : 0 ;
	width : 100% ;
	z-index: 10;
}

body .arrierePlan figure {
	width: 100vw;
	filter: brightness(60%);
	filter: opacity(45%) brightness(60%);
	z-index: 1;
	position: absolute;
	top: 0;
	left: 0;
	margin: 0;
	padding: 0;
}

body .arrierePlan figCaption {
	position: absolute;
	bottom: 12px;
	right: 30px;
	font-size : 9pt ;
	color : var(--progonos-page-background-fg) !important ;
	font-weight: 900;
}

body .arrierePlan figCaption a {
	color : var(--progonos-page-background-fg) !important ;
}

body .arrierePlan img {
	width: 100vw;
}

/* ================================ Page header ================================== */

body > header {
	background-color: var(--progonos-dark-blue) ;
	padding: 1em;
	color: var(--progonos-fg-on-dark-bg);
	margin-bottom: 1em;
	position: fixed;
	top: 0;
	left: 0;
	width: 100vw;
	font-size: 14pt;
	font-family : sans-serif ;
	z-index:100 ;
}

body > header.flex {
  padding: 1em 1.5em 1em 1em;
  display: flex;
  justify-content: space-between;
  align-items: center;
}

body > header > .mainToolbar {
	float : right ;
	margin-right : 4em ;
	display : inline-flex ;
	align-items: center ;
	column-gap : 5px ;
}

body > header.flex  > .mainToolbar {
	float : none ;
	margin-right : 0 ;
}

body > header > .mainToolbar a {
	line-height: 12px;
}

body > header > .mainToolbar svg {
    height: 0.75em;
}

body > header > .mainToolbar .cartouche {
    display: flex;
    border: 0.5px solid #FFD700 !important;
    border-radius: 6px;
    padding: 0 6px;
    height: 1.4em;
    justify-content: space-evenly;
    align-items: center;
    column-gap: 0.4em;
}

#resultats {
	padding-top: 2em;
}


/* ================================ logo proGonos ================================== */

.progonosPart1, .progonosPart2 {
	font-variant: small-caps !important;
	display: inline !important;
	margin: 0 !important;
	padding: 0 !important;
	font-weight: 600;
}

.progonosPart1 {
	color: var(--progonos-basic-orange) !important;
}

.progonosPart1.clearBackground {
	color: var(--progonos-dark-orange) !important;
}

.progonosPart2 {
	color: var(--progonos-light-blue) !important;
}

.progonosPart2.clearBackground {
	color: var(--progonos-dark-blue) !important;
}

/* ================================ Attente ================================== */
#wait {
	text-align: center;
}
.modalBackground {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: var(--progonos-modal-div-bg) ;
  z-index: 9999;
}

.modalBackground .interactionArea {
  width: 60%;
  position: fixed;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  padding: 0.5em;
  max-height: 90vh;
  overflow-y: auto;
  overflow-x: hidden;
}

#wait img {
	width: 4em;
}

.modalWait {
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background-color: var(--progonos-modal-div-bg) ;
	z-index: 9999;
	text-align: center;
	color: var(--progonos-modal-div-fg);
	padding-top : 15% !important ;
}

.modalWait img {
	width : 7em !important;
}

.modalWait .message {
	margin : 20px auto ;
}

.customProgressBar {
	background-color: var(--progonos-global-bg) ;
	width: 30vw;
	margin: auto;
}

.customProgressBar .done {
	background-color: var(--progonos-ok-message-fg);
	color: var(--progonos-global-fg) ;
}

/* ================================ Maps ================================== */
#map {
	width: 90vw;
	height: 80vh;
	margin-left:10vh ;
	margin-bottom : 5em ;
	z-index: 200;
}
.mapToolbar {
	width: 90vw;
	margin-left:10vh ;
	margin-bottom : 5px ;
	z-index: 200;
	text-align : right ;
	padding-right : 1em ;
	box-sizing: border-box;
}
.mapWarn {
  width: 90vw;
  margin-left: 5vw;
  color: #ff0078;
  text-align: right;
  padding-right: 1em;
  box-sizing: border-box;
}
.mapWarn span {
  background-color: #fefe92;
  padding: 0.2em 1em;
  border-top-left-radius: 1em;
  border-top-right-radius: 1em;
}
.mapCaption {
	color: var(--progonos-dark-blue);
	font-weight: 900;
	background-color: var(--progonos-semiTransparent-light-blue);
	text-align: right;
	padding-right: 1em;
	width: 90vw;
	margin-left: 5vw;
	box-sizing: border-box;
	margin-top: 1em;
	z-index: 90;
	position: relative;
}
.leaflet-popup-content {
	max-height: 30vh;
	overflow-y: auto;
}
.leaflet-popup-content .commune {
	color : var(--progonos-basic-blue) ;
}
.leaflet-popup-content .commune .titre {
	display: block;
	text-align: center;
	margin-bottom: 1.5em;
	color: var(--progonos-tooltip-title-fg) ;
	font-weight : 600; 
}
.leaflet-popup-content ul {
	margin-top: 0;
	margin-bottom: 0;
}
.leaflet-popup-content li {
	white-space: nowrap;
}
.leaflet-popup-content h2 {
  text-align: center;
  margin-bottom: 1em;
}
.markerCluster {
	background : radial-gradient(var(--progonos-map-cluster-centre), var(--progonos-map-cluster-bord)) !important ;
	text-align: center;
	padding-top: 0.3em;
	box-sizing: border-box;
	font-size: 14pt;
	color: var(--progonos-map-cluster-fg) !important;
	border-radius: 1em;
}

.markerIcon { /* span qui représente en texte un marker */
	display: inline-block !important;
	background-color: var(--progonos-map-cluster-centre);
	padding: 0 !important;
	border-radius: 0.6em;
	width: 1.4em;
	height: 1.4em;
	text-align: center;
	vertical-align: middle;
	margin: 0 !important;
	line-height: 1.4em;
	font-size: 80%;
	color: var(--progonos-map-cluster-fg) !important;
}

/* ========================================================================= FORMS */
form {
	display : inline-block ;
	width : 60vw ;
	border : 1px solid var(--progonos-border-gray) ;
	padding : 1em ;
	position: relative;
	margin-left: 20vw;
	margin-top: 1em;
	z-index: 20;
	background-color: var(--progonos-bg-blue);
	box-sizing: border-box;
}
form.large {
	width : 70vw ;
	margin-left: 15vw;
}
form label, .popup label {
	display : inline-block ;
	vertical-align : top ;
	/* color : var(--progonos-form-label) ; */
}
label:not(.nowrap):not(.noalign) {
	width: 8em;
	text-align: right;
	display: inline-block;
	margin-right: 0.25em;
}
label.forCheckbox {
	margin-left : 0.4em ;
	margin-right : 1em ;
	vertical-align : middle ;
}
.modeCasse label {
	border: 1px solid var(--progonos-form-label);
	padding: 0.1em 0.2em 0 0.2em;
	border-radius: 0.2em;
}
.mentionAdder {
	font-size: 70%;
	border-radius: 5px;
	border: 1px solid var(--progonos-form-label);
}

section label:not(.endOfLine) {
	display : block ;
}

.ajouts :required {
	color : var(--progonos-required-field-fg) ;
}
.ajouts :required:not(:placeholder-shown) {
	color : var(--progonos-filled-required-field-fg) ;
}

.msgError {
	color: var(--progonos-err-message-fg);
}

.fieldset {
	margin-bottom : 0.3em ;
}
.fieldset.onOneLine {
	white-space: nowrap;
}
.ajouts fieldset {
	border: none;
	padding: 0;
	margin-bottom : 0.3em ;
}
.ajouts {
	min-width : 32em ;
	padding: 0 1em 1em 1em;
	font-size: 12px;
}

.noalign {
	display : inline ;
}

.note {
	float: right;
	max-width: 10svw;
	background-color: var(--progonos-middle-blue-trans);
	padding: 0.5em;
	color : var(--progonos-global-fg) ;
    font-size: 12px;
    line-height: 120%;
}

.apresDebutLigne {
  margin-left: 11em !important;
  max-width: 70%;
}

input.year {
	width : 6em ;
}

.smallText {
  font-size: 80%;
  color : var(--progonos-middle-fgGray) ;
}
body > header > .smallText {
  color: #DEDEDE;
}
td > .smallText {
	/* line-height: normal; */
	color : var(--progonos-light-fgGray) ;
	letter-spacing: 1.2px;
	word-spacing: 0.8px;
	font-weight : 200;
}
.popup li .smallText {
	color: inherit;
}

.details {
	font-size: 80%;
	margin-left : 1em ;
}
span.details {
	margin-left : 0 !important ;
}

div.details {
	margin-left : 0 !important ;
}

div.details::first-letter {
	text-transform: uppercase ;
}

select option:checked::before {
    content : '✓ ' ;
}
.kmAutour {
	width: 5em;
}

input.avecMargeGauche {
	margin-left : 10.2em ;
}
input#nom.notaire, input#nom.deces, input#nom.defense {
  text-transform: uppercase;
}

.cartouche {
  display: inline-block;
  border: 0.5px solid white;
  border-radius: 6px;
  padding: 0 6px;
}

.cartouche .actionIcon.active {
	color : var(--progonos-active-menu-icon) !important
}

.cartouche.modeDisplay .actionIcon.active {
	color : #FFD700 !important;
}


.ui-autocomplete {
	background-color: var(--autocompleted-field-bg) !important;
	z-index: 2500;
	max-height: 30vh;
	overflow: auto;
	max-width: 30vw;
}
.ui-autocomplete li {
	cursor : pointer ;
}
.ui-helper-hidden-accessible {
	display: none;
}

.error {
	color: var(--progonos-err-message-fg);
}
.error:not(.noSize) {
	letter-spacing: 2px;
	font-size: 1rem;
	padding-left: 9.5em;

}
.sourceError {
	color: var(--progonos-err-in-table-fg) !important ;
}

.required {
	color : var(--progonos-required-field-fg) ;
}

.hidden {
	display : none ;
}
.invisible {
	display : none !important ;
}

.shadowed {
	-webkit-box-shadow: var(--progonos-shadow) ;
	box-shadow: var(--progonos-shadow) ;
}

/* ================================== Misc ======================================= */
a {
	color: var(--progonos-table-caption-link-fg);
}

/* ================================== Result tables ======================================= */
table {
	border-collapse: collapse;
	margin-top : 1em ;
	margin-left: auto;
	margin-right: auto;
	background-color: var(--progonos-table-bg);
	color: var(--progonos-table-fg);
	z-index: 20;
	position: relative;
	min-width: 30em;
}

table caption {
	color: var(--progonos-dark-blue);
	font-weight: 900;
	background-color: var(--progonos-table-caption-bg) ;
	text-align: right ;
}

table caption span {
	background-color: var(--progonos-table-caption-title-bg);
	color: var(--progonos-table-caption-title-fg);
	padding: 0.5em 1em 1em 1em;
	position: relative;
	top: -0.3em;
	border: 1px solid var(--progonos-basic-blue);
	border-top-left-radius: 6px;
	border-top-right-radius: 6px;
}
.topCaption, .bottomCaption {
	font-weight: 900;
	text-align: right;
	padding-right: 1em;
	caption-side: top;
	border: none;
}
table tbody > tr:nth-child(2n) {
	background-color: var(--progonos-table-even-lines-bg);
}
table tbody tr:nth-child(2n+1) {
	background-color: var(--progonos-table-odd-lines-bg);
}
table tbody > tr:hover {
	background-color : var(--progonos-hover-blue) ;
}
th {
	white-space: nowrap;
	background-color : var(--progonos-table-caption-title-bg) ;
	color : var(--progonos-table-caption-title-fg) ;
	padding: 0.5em;
	font-variant: small-caps;
}
th input {
	width : 5em ;
}
td, th {
	border : 1px solid var(--progonos-basic-blue) ;
	padding-left : 0.5em ;
	padding-right : 0.5em ;
	vertical-align: top ;
}
td {
	padding : 0.5em ;
}
td.nowrap {
	white-space : nowrap ;
}
tbody td {
	font-weight: 400;
	font-size: 16px;
	line-height: 140%;
	letter-spacing: 1px;
}
#resultats:not([mode="noBridage"]) td.comments div.comments {
	max-height: 4em;
	overflow: hidden auto;
	max-width: 40vw;
}
#resultats:not([mode="noBridage"]) .iconBrider, #resultats[mode="noBridage"] .iconDebrider {
	display:none
}

th.actions {
	border : none ;
}
td.nomDept {
  min-width: 8em;
}
td.nomCommune {
  min-width: 14em;
}
td.nomLieu {
  min-width: 10em;
}
td label {
	color: var(--progonos-table-cell-label-fg) ;
	font-size : 80%;
	vertical-align : top ;
}
td > span:not(.codeInsee):not(.noSize) {
	display: inline-block;
	max-width: calc(100% - 8em);
}
td > span.copiable {
	cursor : copy ;
}
td > span.clickable {
	cursor : pointer ;
}
td ul {
	margin-top: 0;
	margin-bottom: 0;
	display: inline-block;
	list-style-type : "· " ;
}
td a {
	color: var(--progonos-table-cell-link-fg);
}
td i {
	font-size : 80% ;
}
td img {
	max-width: 30vw;
	max-height : 30vh ;
}
td .nomVariante {
	font-weight : bolder ;
}
td.actions {
	text-align : center ;
	white-space: nowrap;
}
td h3 {
	padding: 0;
	margin: 0;
	text-align: center;
	font-size: 1rem;
}
td h4 {
	text-align: center;
	margin: 0;
	font-size: 0.8rem;
	font-style: italic;
}
td .complement {
  margin-top: 0.5em;
  border-top: 0.3px solid var(--progonos-middle-fgGray);
}

td .pseudo {
  font-size: 80%;
  color: var(--progonos-middle-fgGray);
  font-weight: 600;
}

table .actionIcon:not(.orangeIcon), .maskGuidance .actionIcon:not(.orangeIcon) {
	color: var(--progonos-table-action-icon-fg) !important ;
}

table .symbolIcon {
	color: var(--progonos-table-symbol-icon-fg) !important ;
}
table .helpIcon {
	color: var(--progonos-table-help-icon-fg) !important ;
}

.surligne {
	background-color: var(--progonos-overlined-text-bg);
	padding : 0 0.3em ;
	color:var(--progonos-overlined-text-fg) ;
}

.unknown {
  color: var(--progonos-undefined-data-fg);
}

span.nom {
  font-weight: 900;
  font-variant: small-caps;
}

td .prenom.truncated {
	cursor: help;
}

#resultats .info {
	background-color: var(--progonos-detailed-info-fg);
	text-align: center;
	margin: 0 5em;
	width: calc(100% - 10em);
	padding: 0.5em 0;
	margin-bottom: 2em;
	border-radius: 1.2em;
}

/* ================================== Developer ======================================= */

.requete {
	position : fixed ;
	bottom : 0 ;
	left : 0 ;
	padding : 0.4em 1em ;
	border-top : 1px solid #EFEFEF ;
	background-color : #303030 ;
	width : 100% ;
	z-index: 100;
	display: none;
}

/* ================================== Help pages ======================================= */

body.help img {
	max-width : 50vw ;
	max-height : 50vh ;
}

body.help img.small {
  max-width: 20vw;
  max-height: 20vh;
}

body.help img.big {
	max-width : 90vw ;
	max-height : 90vh ;
}

body.help a, body.help h2, body.help strong {
	color : var(--progonos-main-title-fg) ;
}

body.help h3 {
	margin-left : 3em ;
}

body.help p {
	margin-left : 5em ;
}

body.help ul {
	margin-left : 5em ;
}

body.help br {
	margin : 0.5em 0 ;
}

body.help .imgWithComment { /* Une image avec un texte complémentaire à droite */
	display: flex;
	column-gap: 2em;
	justify-content: flex-start;
	align-items: center;
	padding-left: 5em;
}

body.help .imgWithComment span { /* Le texte complémentaire */
	font-size: 90%;
	color: var(--progonos-basic-blue);
	position: relative;
	background: transparent;
	border: 2px solid transparent;
	padding-left: 1em;
	margin-left: 2em;
}

body.help .imgWithComment span:after, body.help .imgWithComment span:before {
	right: 100%;
	top: 50%;
	border: solid transparent;
	content: "";
	height: 0;
	width: 0;
	position: absolute;
	pointer-events: none;
}

body.help .imgWithComment span:after {
	border-color: transparent;
	border-right-color: var(--progonos-global-bg);
	border-width: 24px;
	margin-top: -24px;
}
body.help .imgWithComment span:before {
	border-color: rgba(0, 0, 0, 0);
	border-right-color: var(--progonos-light-blue);
	border-width: 27px;
	margin-top: -27px;
}

/* ================================== Help popups ======================================= */

.helpPopup {
	max-width: 15em;
	white-space: break-spaces !important ;
	font-size: 12pt !important ;
	min-width: 3em;
}

.arrow_box {
	position: absolute;
	background: #828181;
	border: 4px solid var(--progonos-light-blue);
	z-index : 10000 ;
	padding : 0.5em ;
	color : var(--progonos-arrowed-box-fg) ;
	border-radius : 0.5em ;
	text-align : center ;
	font-family: sans-serif,Noto;
	font-size : 8pt ;
	transform : translate(-80%, 0) ;
	white-space : nowrap ;
}

.arrowBox.important {
	color : var(--progonos-important-message-fg) ;
}

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

.arrow_box:after {
	border-color: var(--progonos-arrowed-box-transparent);
	border-bottom-color: var(--progonos-arrowed-box-border);
	border-width: 4px;
	margin-left: -4px;
}
.arrow_box:before {
	border-color: var(--progonos-arrowed-box-transparent);
	border-bottom-color: var(--progonos-light-blue);
	border-width: 12px;
	margin-left: -12px;
}

.finPopups {
	width: 100%;
	word-wrap: anywhere;
	color: var(--progonos-important-message-fg);
	white-space: normal;
}

.popupAvailable {
	border : 2px solid var(--progonos-important-message-fg) !important;
}

/* ================================== Interactive popups ======================================= */

.popup {
	position: fixed;
	top: 50vh;
	left: 50vw;
	transform: translate(-50%,-50%);
	background-color: var(--progonos-popup-bg);
	border: 2px solid var(--progonos-popup-border);
	z-index: 1000;
}

.popup header, #help header {
	width : 100% ;
	background-color : var(--progonos-popup-header-bg) ;
	color : var(--progonos-popup-header-fg) ;
	text-align : center ;
	font-variant : small-caps;
	padding: 0.5em 1em ;
	box-sizing: border-box;
}

.noCaps {
	font-variant: initial !important;
}
.noWrap {
	white-space : nowrap ;
}

.popup header .closeIcon {
	margin-top : 0.1em ;
}

.popup .content {
	padding: 0.5em 1em 1em 1em ;
	max-height: 70vh;
	overflow: hidden auto;
	color: var(--progonos-popup-intro-fg);
}

.popup .listeRegistres li:not(:first-child) {
  margin-top: 0.5em;
}

.popup p.info {
	/* font-weight: 200; */
	line-height: 140%;
	font-size: 14px;
	word-spacing: 3px;
	letter-spacing: 2px;
	text-align: justify;
	color : var(--progonos-popup-intro-fg) ;
	border-top: 1px solid var(--progonos-popup-intro-border);
	padding-top: 0.5em;
	border-bottom: 1px solid var(--progonos-popup-intro-border);
}

.popup p.info.reduced {
	height: 1.1em;
	text-overflow: ellipsis;
	overflow: hidden;
}

.popup p.info.reduced .iconBrider, .popup p.info:not(.reduced) .iconDebrider {
	display: none;
}

.popup h2, .popup h3, .popup .content label {
	color: var(--progonos-popup-content-title);
}

.popup h2 {
	margin-top: 0;
}

.popup .content .lieu {
	margin-bottom : 1em ;
	color : var(--progonos-popup-special-info) ;
}

.popup input:not(.noalign), .popup select {
  margin-bottom: 0.3em;
}
label input {
  margin-bottom: 0 !important;
}
select.precision {
  width: 2.5em;
  text-align: center;
}

.popup input:not([type="file"]), .popup select, .popup textarea {
	border : 1px solid var(--progonos-input-border) ;
	background-color: var(--progonos-input-bg);
}

.popup select {
	padding-left: 0;
	margin-left: 0;
}

.popup textarea, input[type="email"] {
	width: 30em;
}
.popup textarea {
	height: 6em;
}

.popup .choiceBar, .buttonsBar {
	display : flex ;
	justify-content : space-around;
	column-gap: 12px ;
	align-items: center;
}

.popup .cote {
	background-color: #a4a4e3;
	font-weight: 900;
	padding: 0 0.25em;
	cursor:pointer;
}

.popup .cote.checked {
	background-color: #9cd690;
}

.popup li:not(:first-child) {
	margin-top : 0.5em ;
}

.buttonsBar {
	width : 60% ;
	margin-left : 20% ;
	background-color : var(--progonos-middle-blue) ;
	border-radius : 0.7em ;
	padding : 0.5em 0 ;
	margin-top : 1em ;
	clear: both;
}

section .buttonsBar {
	color: var(--progonos-bar-fg);
	text-align : center ;
	font-size: 16px;
}

.popup .addActe, .popup .addVariante, .popup .addDetail {
	display : none ;
}

.popup #annee {
	width: 6.5em;
	margin-right: 0.5em;
}

.popup select#mois {
	width: 7em;
	margin-right: 0.5em;
}

.popup select#jour {
	width: 4em;
}

.popup #titreActe, .popup #cote, .popup #variante, .longInput {
	width: 30em;
}

input.annee {
	width: 6em;
}

.errInput {
	color : var(--progonos-err-message-fg) ;
	padding-left: 8.5em;
	line-height: 140%;
}

.popup .messageProgonos {
	font-size: 80%;
	line-height: 140%;
}

.ui-draggable-handle {
	cursor : move ;
}

/* ================================== Chosen library ======================================= */

.chosen-container {
  max-width: 35em;
}

.chosen-single {
	background: none !important;
	/* background-color: #b9b9b9 !important; */
	background-color: var(--progonos-input-bg) !important;
	border: none !important;
	box-shadow: none !important;
	line-height: 1.2em !important;
	height: 1.2em !important;
	border-radius: 0 !important;
}

/* ================================== Global menu ======================================= */

iframe {
	position: fixed;
	top: 3em;
	left: 0;
	width: 99.9vw;
	height: calc(99.9vh - 4em);
	z-index: 300;
	background-color: var(--progonos-imported-bg) ;
}

iframe header {
	display:none ;
}

/* ================================== Help ======================================= */

#help {
	position: absolute;
	max-width: 300px;
	z-index: 1100;
	background-color: var(--progonos-help-bg);
	border: 2px solid var(--progonos-help-border);
	font-size: 15px;
	text-align: justify;
}

#help #content {
	padding: 1em;
	max-height: 180px;
	overflow: auto;
}

.imageAgrandie {
	background-color: var(--progonos-pic-bg);
	position: fixed;
	top: 0;
	left: 0;
	width: 99.9vw;
	z-index: 2000;
}

.imageAgrandie header {
	background-color: var(--progonos-pic-caption-bg );
	display: flex;
	height: 3em;
	justify-content: space-evenly;
	align-items: center;
}

.imageAgrandie header .actions {
	border: 1px solid var(--progonos-basic-blue);
	padding: 0.2em 0.5em;
	border-radius: 0.5em;
}
.imageAgrandie section {
	text-align : center ;
	max-width : 99.9vw ;
	max-height : calc(99.9vh - 3em) ;
	overflow : auto ;
	padding-bottom : 3em ;
}


.imageAgrandie section div {
	height: 3em;
}

.mayBeMasked {
  color: #ffbf00 !important;
}

#messages span.mayBeMasked {
	display : inline !important ;
	margin : 0 !important ;
}

/* .maskGuidance {
	background-color: #29809A;
	color: #e6e6e6;
	padding: 0.5em 1em;
	border: 1px solid white;
} */

.maskGuidance {
	background-color: #29809A;
	color: #e6e6e6;
	padding: 0.5em 1em;
	border: 5px solid #febe00;
	text-align: center;
	position: fixed;
	top: 6em;
	z-index: 1000;
	left: 50vw;
	transform: translate(-50%, 0);
	width: 60vw;
}

.blinking {
	animation: blinker 1s linear infinite;
}

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

body:not(.forAdmin) .iconForAdmin {
	display : none !important ;
}

.autresNoms {
	margin-left: 0.5em;
	font-size: 80%;
}