:root{
	--progressbar_coloralert:var(--colorBGP_jaune);
}


.genSuivi{
	font-weight: bolder;
}

.headerSuivi{
	text-align: center;
	display:table;
	width: 100%;
	background-color: var(--color_middleground);
	border-bottom: 2px solid;
	border-bottom-color: var(--color_enlightground);
}

.headerSuiviDetail{
	display:table-cell;
	vertical-align: middle;
	text-align: center;
	color: var(--colorBGP_bleu);
}

.headerSuiviDetail_Message{
	display:table-cell;
	vertical-align: middle;
	text-align: center;
	color: var(--color_text);
	background-color: var(--progressbar_coloroverdue);
	animation: messageflash 2s linear infinite;
}


@keyframes messageflash {
	0%{color:var(--color_text)}
	50%{color:var(--color_text)}
	52%{color:var(--progressbar_coloroverdue)}
	62%{color:var(--progressbar_coloroverdue)}
	64%{color:var(--color_text)}	
}

.footerSuivi{
	display: table;
	position: absolute;
	background-color: var(--color_middleground);
	border: 1px solid;
	border-color: var(--color_enlightground);
}
.footerSuiviDetail{
	display:table-cell;
	vertical-align: middle;
	color: var(--color_text);
	font-weight: bolder;
	text-align: center;
}
.footerSuivi_ecoule{
	color:var(--progressbar_colorfront);
}
.footerSuivi_retard{
	color:var(--progressbar_coloroverdue);
}
.footerSuivi_avance{
	color:var(--progressbar_colorend);
}
.footerSuivi_restant{
	color:var(--colorBGP_jaune);
}
.footerSuivi_libelle{
	font-size:smaller;
	font-weight: normal;
}
.footerSuivi_temps{
	font-size:larger;
}



.logoSuivi{
	position: fixed;
}
.logoEvtDetail{
	position: fixed;
}

.onStageSuivi{
	display:table;
	width: 100%;
}
.onStageSuiviCol{
	display:table-cell;
	
}
.onStageLib{
	font-weight: bolder;
	color: var(--progressbar_colorend);
}
.libCenter{
	text-align: center;
}

.onNextSuivi{
	display:table;
	width: 100%;
}
.onNextSuiviCol{
	display:table-cell;
	vertical-align: top;
	
}
.onNextLib{
	color: var(--colorBGP_bleu);
}
.english{
	font-variant:small-caps;
	font-style: italic;
	font-weight: normal;
}

.logoNoEvt{
	margin: auto;
	display: flex;
	animation: vague 10s linear infinite;
}

.decompte_positif{
	color: var(--progressbar_colorend);
}
.decompte_null{
	color: var(--progressbar_colorend);
}
.decompte_negatif{
	color: var(--progressbar_coloroverdue);
}

.barre_avct{
	display: block;
}
.barre_ecoule{
	float: left;
	color:var(--progressbar_colorfront);
}
.barre_retard{
	float: left;
	color:var(--progressbar_coloroverdue);
	text-align: center;
}
.barre_avance{
	float: left;
	color:var(--progressbar_colorend);
	text-align: center;
}
.barre_restant{
	float: right;
	color:var(--colorBGP_jaune);
	text-align: right;
}

.tableau_box{
	display: table;
}
.tableau_detail{
	display: table-cell;
	vertical-align: baseline;
}
.evt_finished{
	color:var(--color_text);
	padding-left: 200px;
	
}
.time_attente{
	color:var(--colorBGP_jaune);
}
.tab_imminent{
	animation: colorflash 2s linear infinite;
	
}
.clockSuivi{
	position: fixed;
}

.refreshSuivi{
	position: fixed;
	font-weight: lighter;
	color: var(--color_enlightground);
	text-align: center;
}

.refreshSuiviBordure{
	position: fixed;
	border: solid 2px;
	border-radius: 50%;
	border-color: var(--color_middleground) var(--color_middleground) var(--colorBGP_jaune);
	animation: spin 5s linear infinite;
	padding: 10px;
}

@keyframes messageflash {
	0%{color:var(--color_text)}
	50%{color:var(--color_text)}
	52%{color:var(--progressbar_coloroverdue)}
	62%{color:var(--progressbar_coloroverdue)}
	64%{color:var(--color_text)}	
}

@keyframes colorflash {
	0%{color:var(--colorBGP_jaune)}
	40%{color:var(--colorBGP_jaune)}
	45%{color:var(--progressbar_colorfront)}
	95%{color:var(--progressbar_colorfront)}
	100%{color:var(--colorBGP_jaune)}	
}

@keyframes spin {
	100%{transform:rotate(360deg)}
}

@keyframes vague {
	0% {transform:rotate(0deg) scale(1.1)}
	25%{ transform:rotate(5deg) scale(1) }
	50%{ transform:rotate(0deg) scale(1.1) }
	75%{ transform:rotate(-5deg) scale(1.2) }
	100%{transform:rotate(0deg) scale(1.1) }
}