/*==========================================================*/
/*															*/
/*	masterprev.css											*/
/*															*/
/*															*/
/*==========================================================*/

body {
	width: 100vw;
	height: 100vh;
}
.headerContent {
	height: 60px;
}
.headerContent > .top {
	z-index: 999992;
	position: absolute;
	height: 60px;
	width: 100%;
	background-color: #fff;
	box-shadow: 0px 0px 10px 2px rgba(20, 40, 50, 0.17525);
}
.roleMetier {
	color: #495057;
	font-weight: normal;
	font-size: 0.85714rem;
	font-style: italic;
	line-height: 1.142857rem;
}
.bannerActionSet {
	border: none;
	padding: 1.75rem 2rem;
	background-color: #fff;
	color: #142832;
	font-size: 1rem;
	line-height: 1.6rem;
	height: 5.5rem;
}

.PageSection {
	overflow-y: auto;
	background-color: #fff;
	padding: 0px;
	margin: 0px;
	position: relative;
	text-align: left;
}
.PageContent {
	padding: 0px 2rem;
	height: 100%;
}
.PageSection .PageContent {
	display: block;
}
.cssPalette {
	padding: 0px;
	overflow: hidden;
	border: none;
	height: 100%;
	text-align: left;
	background-color: #fff;
	position: absolute;
	z-index: 999991;
	width: 90px;
	box-shadow: 0px 0px 10px 2px rgba(20, 40, 50, 0.17525);
}
.cssPaletteContainer {
	overflow: hidden;
	box-shadow: none;
}
#divPaletteScrollableListe.cssPaletteContainer {
	overflow-y: auto;
	box-shadow: inset 0px 0px 5px 2px rgba(20, 40, 50, 0.1);
}
.cssPaletteContainer .Item {
	width: 350px;
	vertical-align: middle;
	cursor: pointer;
	background-color: transparent;
	padding: 0px;
	color: #142832;
	height: 3.5rem;
	display: flex;
	flex-direction: row;
	align-content: center;
	align-items: center;
}
.cssPaletteContainer .Item .Intitule {
	color: #142832;
	font-weight: bold;
	font-size: 1rem;
	line-height: 1.4em;
	vertical-align: middle;
	width: 245px;
	margin-left: 15px;
	flex-grow: 0;
	flex-shrink: 0;
	padding: 0px 1rem 0px 0px;
}
.cssPaletteContainer .Item img {
	vertical-align: middle;
	margin-top:0.5rem;
	display: inline;
	width: 50px;
	height: 50px;
	flex-grow: 0;
	flex-shrink: 0;
}
.cssPaletteContainer .Item .prev {
	font-size: 2.057rem;
	line-height: 3.5rem;
	width: 60px;
	height: 3.5rem;
	margin: 0px 15px;
	text-align: center;
	flex-grow: 0;
	flex-shrink: 0;
}

.cssPaletteContainer .Item:hover {
	background-color: #FFA000;
	color: #fff;
}
.cssPaletteContainer .Item:hover .Intitule {
	color: #fff;
	text-decoration: underline;
}

.cssPaletteContainer .SelectedItem {
	width: 350px;
	vertical-align: middle;
	cursor: pointer;
	padding: 0px;
	background-color: #FFA000;
	color: #fff;
	height: 3.5rem;
	display: flex;
	flex-direction: row;
	align-content: center;
	align-items: center;
}
.cssPaletteContainer .SelectedItem img {
	vertical-align: middle;
	margin-top:0.5rem;
	display: inline;
	width: 50px;
	height: 50px;
	flex-grow: 0;
	flex-shrink: 0;
}
.cssPaletteContainer .SelectedItem .prev {
	font-size: 2.057rem;
	line-height: 3.5rem;
	width: 60px;
	height: 3.5rem;
	margin: 0px 15px;
	text-align: center;
	flex-grow: 0;
	flex-shrink: 0;
}
.cssPaletteContainer .SelectedItem .Intitule {
	color: #fff;
	font-weight: bold;
	font-size: 1rem;
	line-height: 1.4em;
	vertical-align: middle;
	width: 245px;
	margin-left: 15px;
	flex-grow: 0;
	flex-shrink: 0;
	padding: 0px 20px 0px 0px;
}
.cssPaletteContainer .SelectedItem:hover .Intitule {
	color: #fff;
}

.cssPalette [valkey="palette_actionbar"] {
	padding: 0px;
	white-space: nowrap;
	background-color: #fff;
	color: #142832;
	text-align: left;
	font-size: 0.9rem;
	line-height: 1.3714rem;
}
.cssPalette [valkey="palette_actionbar"] .prev {
	font-size: 1.3714rem;
	line-height: 1.3714rem;
	cursor: pointer;
}
.cssPalette [valkey="palette_actionbar"] .prev-stack {
	width: 1.28em;
	height: 1.3714rem;
}
.cssPalette [valkey="palette_actionbar"] .prev-stack-1x {
	font-size: 1rem;
	line-height: inherit;
}
.cssPalette [valkey="palette_actionbar"] a {
	color: #142832;
	background-color: #fff;
	padding: 0.666667rem 0.666667rem 0.666667rem 2.2rem;
	width: 100%;
	text-align: left;
	display: block;
	text-decoration: none;
	cursor: pointer;
}
.cssPalette [valkey="palette_actionbar"] a:hover {
	color: #fff;
	text-decoration: none;
	background-color: #FFA000;
}


	table.FonctionnaliteDetacheeActive {
		margin-right: 5px;
		margin-left: 5px;
		display: inline-block;
		top: -1px;
		position: relative;
		background-color: white;
		border-left: 1px solid rgb(120,120,120);
		border-right: 1px solid rgb(120,120,120);
		border-bottom: 1px solid rgb(120,120,120);
		border-top: 1px solid white;
		color: rgb(120,120,120);
	}

	table.FonctionnaliteDetachee {
		margin-right: 5px;
		margin-left: 5px;
		display: inline-block;
		top: -1px;
		position: relative;
		border: 1px solid rgb(120,120,120);
		background-color: white;
		color: rgb(120,120,120);
		opacity: 0.7;
	}

		table.FonctionnaliteDetachee:hover {
			opacity: 1.0;
		}

		table.FonctionnaliteDetachee span {
			margin-left: 2px;
			margin-right: 2px;
			white-space: nowrap;
			vertical-align: middle;
			font-size: 10px;
			line-height: 20px;
		}

	table.FonctionnaliteDetacheeActive span {
		margin-left: 2px;
		margin-right: 2px;
		white-space: nowrap;
		vertical-align: middle;
		font-size: 10px;
		line-height: 20px;
	}

/* La zone contenant la palette et la
 * page de contenu.*/
.contents {
	background: none transparent scroll repeat 0% 0%;
}


/* Le label contenant le rôle métier de l'utilisateur
 * connecté.*/

/* Palette des fonctionnalités
 * dépliée. */
.menuUtilisateur {
	z-index: 9999;
	position: absolute;
	display: none;
	background-color: White;
	border: 1px solid Black;
	overflow: hidden;
}
	/* Item dans le menu utilisateur */
	.menuUtilisateur .Item {
		height: 25px;
		line-height: 25px;
		background-color: White;
		cursor: pointer;
		cursor: hand;
	}

		.menuUtilisateur .Item:hover {
			background-color: #C1D2EE;
			cursor: pointer;
			cursor: hand;
		}
		/* Image de l'item dans le menu utilisateur */
		.menuUtilisateur .Item img {
			vertical-align: middle;
		}
		/* Intitulé de l'item dans le menu utilisateur */
		.menuUtilisateur .Item span {
			color: Black;
			font-weight: normal;
			font-size: 12px;
			font-family: "Work Sans", Arial, Helvetica;
			line-height: 13px;
		}
/* Le lien permettant de déconnecter
 * l'utilisateur.*/
.disconnect {
	color: #ea6729;
	font-weight: normal;
	font-size: 12px;
	font-style: normal;
	font-family: "Work Sans", Arial, Helvetica;
	line-height: 13px;
	text-decoration: underline;
}

	.disconnect:visited {
		color: #ea6729;
	}

	.disconnect:hover {
		color: #FAB81C;
	}

.timeoutInfo {
	color: #ea6729;
	font-weight: normal;
	font-size: 11px;
	font-style: normal;
	font-family: "Work Sans", Arial, Helvetica;
	line-height: 12px;
	text-decoration: none;
}
/* ========================
 *		Fin Bannière
   ========================*/


/* ========================
 *		Palette des
 *		fonctionnalités
   ========================*/
/* Le conteneur de la palette des fonctionnalités (scroll). */

/* Un item de type "séparateur"*/
.Separateur {
	padding: 0px;
	text-align: center;
	vertical-align: middle;
}

	.Separateur hr {
		width: 80%;
		color: LightSteelBlue;
		height: 1px;
	}

.palette-grabBox {
	width: 15px;
	position: absolute;
	left: 73px;
	top: 0px;
	background-color: #f1f1f3;
	border-left: 1px solid #d6d7d9;
	border-right: 1px solid #d6d7d9;
	color: #808185;
	text-align: center;
	box-sizing: border-box;
	-webkit-box-sizing: border-box;
}

	.palette-grabBox:hover {
		background-color: #b5e1f6;
		border-left: 1px solid #50aadb;
		border-right: 1px solid #50aadb;
		color: #50aadb;
	}

	.palette-grabBox .palette-grabBox-arrow {
		vertical-align: middle;
		text-align: center;
	}
/* ========================
 *		Fin palette des
 *		fonctionnalités
   ========================*/

.Clickable {
	opacity: 1.0;
	cursor: pointer;
}

	.Clickable:hover {
		opacity: 0.8;
	}


div.BlocEnTeteTableau {
	padding: 5px;
	border-right: none;
	border-bottom: none;
	border-top: none;
	border-left: 10px solid #bbd4e8;
	background-color: #e9f2f7;
	color: #000000;
	display: block;
}

	div.BlocEnTeteTableau td.SousElements {
		font-size: 11px;
		color: #768F9C;
	}

div.BlocPrincipalEnTeteTableau {
	padding: 5px;
	border-right: none;
	border-bottom: none;
	border-top: none;
	border-left: 10px solid #368fd3;
	background-color: #e9f2f7;
	color: #000000;
	display: block;
}

	div.BlocPrincipalEnTeteTableau td.SousElements {
		font-size: 11px;
		color: #768F9C;
	}

div.BlocClotureEnTeteTableau {
	padding: 5px;
	border-right: none;
	border-bottom: none;
	border-top: none;
	border-left: 10px solid #dc6c6c;
	background-color: #e9f2f7;
	color: #000000;
	display: block;
}

	div.BlocClotureEnTeteTableau td.SousElements {
		font-size: 11px;
		color: #768F9C;
	}

td.RechercheCritereGauche {
	padding: 3px 0px 3px 20px;
	text-align: right;
	vertical-align: top;
	color: #768F9C;
	font-size: 12px;
	font-style: normal;
	font-family: "Work Sans", Arial, Helvetica;
	line-height: 20px;
	width: 33%;
}

td.RechercheCritereDroite {
	padding: 3px 10px 3px 10px;
	text-align: left;
	vertical-align: top;
	color: #000000;
	font-size: 13px;
	font-style: normal;
	font-family: "Work Sans", Arial, Helvetica;
	line-height: 20px;
}

/* JM Indicateur pour ATP (Déclaré,arrêt,registre...) */
.Indicatator {
	height: 20px;
	-webkit-border-radius: 4px;
	border-radius: 4px;
	-moz-box-shadow: 0px 0px 5px #000000;
	-webkit-box-shadow: 0px 0px 5px #000000;
	box-shadow: 0px 0px 5px #000000;
	background-color: #50AADB;
	margin: 4px;
}

	.Indicatator span {
		color: White;
		text-align: center;
		margin: 2px;
		float: left;
		position: relative;
		left: 20%;
	}

.inAppPopupBack {
	position: absolute;
	z-index: 99998;
	background-repeat: repeat;
}

.inAppPopup {
	display: block;
	position: absolute;
	z-index: 99999;
	overflow: hidden;
	border: 1px solid #bec6c9;
	text-align: left;
	background-color: White;
	border-radius: 4px;
	/* ombre */
	-moz-box-shadow: 4px 4px 5px #aaa;
	-webkit-box-shadow: 4px 4px 5px #aaa;
}

.inAppPopupContent {
	overflow: scroll;
	border-top: 1px solid #bec6c9;
}

.TitrePopup {
	padding-left: 8px;
	color: #6d6e70;
	font-weight: normal;
	font-size: 12px;
	font-style: normal;
	font-family: "Work Sans", Arial, Helvetica;
	line-height: 30px;
	text-align: left;
	vertical-align: middle;
	/* Débradé de fond */
	background: #b9e5fe; /* Old browsers */
	background: -moz-linear-gradient(top, #b9e5fe 0%, #dcf0f9 100%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#b9e5fe), color-stop(100%,#dcf0f9)); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top, #b9e5fe 0%,#dcf0f9 100%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top, #b9e5fe 0%,#dcf0f9 100%); /* Opera11.10+ */
	background: -ms-linear-gradient(top, #b9e5fe 0%,#dcf0f9 100%); /* IE10+ */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#b9e5fe', endColorstr='#dcf0f9',GradientType=0 ); /* IE6-9 */
	background: linear-gradient(top, #b9e5fe 0%,#dcf0f9 100%); /* W3C */
}

.titreInAppPopup {
	padding-left: 10px;
}

.PopupCloseButton {
	cursor: pointer;
	cursor: hand;
	vertical-align: middle;
}

.FormulaireSaisie {
}

	.FormulaireSaisie td.FormulaireGauche {
		padding: 3px 0px 3px 20px;
		text-align: right;
		vertical-align: top;
		color: #768F9C;
		font-size: 12px;
		font-style: normal;
		font-family: "Work Sans", Arial, Helvetica;
		line-height: 20px;
		width: 33%;
	}

	.FormulaireSaisie td.FormulaireDroite {
		padding: 3px 10px 3px 10px;
		text-align: left;
		vertical-align: top;
		color: #000000;
		font-size: 13px;
		font-style: normal;
		font-family: "Work Sans", Arial, Helvetica;
		line-height: 20px;
	}

	.FormulaireSaisie td.FormulaireSousTitre {
		padding: 10px 0px 1px 20px;
		text-align: right;
		vertical-align: top;
		color: #768F9C;
		font-size: 13px;
		font-style: normal;
		font-weight: bold;
		font-family: "Work Sans", Arial, Helvetica;
		line-height: 22px;
		width: 33%;
	}

.FormulaireConsultation {
}

	.FormulaireConsultation td.FormulaireGauche {
		padding: 3px 0px 3px 20px;
		text-align: right;
		vertical-align: top;
		color: #768F9C;
		font-size: 12px;
		font-style: normal;
		font-family: "Work Sans", Arial, Helvetica;
		line-height: 20px;
		width: 33%;
	}

	.FormulaireConsultation td.FormulaireDroite {
		padding: 3px 10px 3px 10px;
		text-align: left;
		vertical-align: top;
		color: #000000;
		font-size: 13px;
		font-style: normal;
		font-family: "Work Sans", Arial, Helvetica;
		line-height: 20px;
	}

	.FormulaireConsultation td.FormulaireSousTitre {
		padding: 10px 0px 1px 20px;
		text-align: right;
		vertical-align: top;
		color: #768F9C;
		font-size: 13px;
		font-style: normal;
		font-weight: bold;
		font-family: "Work Sans", Arial, Helvetica;
		line-height: 22px;
		width: 33%;
	}

/*======================================================*/
/*      Graphique de type histogramme vertical          */
/*======================================================*/
.GraphHisto-Vertical {
	position: relative;
	width: 240px;
	height: 300px;
	margin: 1.1em 20px 3.5em;
	padding: 0;
	background: whitesmoke;
	border: 2px solid gray;
	list-style: none;
	font: 9px Helvetica, Geneva, sans-serif;
	text-align: left;
}

	.GraphHisto-Vertical ul {
		margin: 0;
		padding: 0;
		list-style: none;
	}

	.GraphHisto-Vertical li {
		position: absolute;
		bottom: 0;
		width: 30px;
		z-index: 2;
		margin: 0;
		padding: 0;
		text-align: center;
		list-style: none;
	}

		.GraphHisto-Vertical li.qtr {
			height: 298px;
			padding-top: 2px;
			border-right: 1px dotted #C4C4C4;
			color: LightSteelBlue;
			font-weight: bold;
		}

			.GraphHisto-Vertical li.qtr p {
				text-align: center;
			}

		.GraphHisto-Vertical li.bar {
			left: 5px;
			background-color: steelblue;
			back\ground-image: URL(img/histogramme_Vertical_bar_bg.png);
			background-repeat: repeat-y;
			background-position: left;
			border-color: #EDC #BA9 #000 #EDC;
			width: 20px;
			border: 1px solid;
			border-bottom: none;
			color: white;
			font-weight: bold;
		}

			.GraphHisto-Vertical li.bar p {
				margin: 5px 0 0;
				padding: 0;
			}

	.GraphHisto-Vertical .ticks {
		width: 240px;
		height: 300px;
		z-index: 1;
	}

		.GraphHisto-Vertical .ticks .tick {
			position: relative;
			border-bottom: 1px solid navy;
			width: 240px;
		}

			.GraphHisto-Vertical .ticks .tick p {
				position: absolute;
				left: 100%;
				bottom: -0.67em;
				margin: 0 0 0 0.5em;
				font-style: italic;
			}


/*======================================================*/
/*      Graphique de type histogramme horizontal        */
/*======================================================*/
.GraphHisto-Horizontal {
	position: relative;
	width: 300px;
	height: 190px;
	margin: 1.1em 20px 3.5em;
	padding: 0;
	background: whitesmoke;
	border: 2px solid gray;
	list-style: none;
	font: 9px Helvetica, Geneva, sans-serif;
	text-align: left;
	left: 200px;
}

	.GraphHisto-Horizontal ul {
		margin: 0;
		padding: 0;
		list-style: none;
	}

	.GraphHisto-Horizontal li {
		position: absolute;
		bottom: 0;
		height: 25px;
		z-index: 2;
		margin: 0;
		padding: 0;
		text-align: center;
		list-style: none;
	}

		.GraphHisto-Horizontal li.qtr {
			width: 298px;
			padding-right: 2px;
			border-bottom: 1px dotted #C4C4C4;
			color: LightSteelBlue;
			font-weight: bold;
			text-align: left;
			left: -200px;
		}

			.GraphHisto-Horizontal li.qtr p {
				padding-top: 5px;
				color: Navy;
				width: 200px;
				position: absolute;
			}

			.GraphHisto-Horizontal li.qtr ul {
				left: 200px;
				position: relative;
			}

		.GraphHisto-Horizontal li.bar {
			top: 5px;
			left: 0px;
			background-color: steelblue;
			back /ground-image:URL(img/histogramme_Horizontal_bar_bg.png);
			background-repeat: repeat-x;
			background-position: top;
			border-color: #EDC #BA9 #000 #EDC;
			height: 15px;
			border: 1px solid;
			border-left: none;
			color: white;
			font-weight: bold;
		}

			.GraphHisto-Horizontal li.bar p {
				margin: 2px 5px 0 0;
				padding: 0;
				text-align: right;
				color: White;
				width: auto;
				position: relative;
			}

	.GraphHisto-Horizontal .ticks {
		height: 190px;
		width: 300px;
		z-index: 1;
	}

		.GraphHisto-Horizontal .ticks .tick {
			position: absolute;
			border-left: 1px solid navy;
			height: 190px;
		}

			.GraphHisto-Horizontal .ticks .tick p {
				position: absolute;
				top: 100%;
				left: -0.67em;
				margin: 0.5em 0 0 0;
				font-style: italic;
			}

.NormalTextBox {
	height: 20px;
	font-size: 13px;
	line-height: 15px;
	font-style: normal;
	font-weight: normal;
	font-family: "Work Sans", Arial, Helvetica;
	color: #000000;
	border-left: 1px solid #cdcdcd;
	border-bottom: 1px solid #ccccce;
	border-right: 1px solid #bcbdc2;
	border-top: 2px solid #99989d;
	background-color: #ffffff;
}

.LabelTitre {
	color: #3181be;
	font-weight: normal;
	font-size: 14px;
	font-style: normal;
	font-family: "Work Sans", Arial, Helvetica;
	line-height: 16px;
}

/* Temporaire : en attendant d'avoir le readonly sur ces composants */
.FormulaireConsultation input {
	border: 0;
}

.FormulaireConsultation table {
	border: 0;
}

.FormulaireConsultation select {
	border: 0;
}

.val-bullet {
	width: 6px;
	height: 6px;
	margin: 7px;
	overflow: hidden;
	border: 1px solid rgb(200, 200, 200);
	-moz-border-radius: 10px;
	border-radius: 10px;
	webkit-border-radius: 10px;
	background-color: rgb(220, 220, 220);
}
/*
Classe Css a utiliser pour couper une chaine de caractere et qui ajoute "..." a la fin de la chaine
*/
.val-Ellipsis {
	overflow: hidden;
	white-space: normal;
	display: -webkit-box !important;
	-o-text-overflow: ellipsis;
	text-overflow: ellipsis;
	width: 100%;
	max-width: 100%;
	-webkit-line-clamp: 1;
	-webkit-box-orient: vertical;
}

.val-Flex {
	display: -ms-inline-flexbox; /*IE 10 */
	display: -webkit-inline-flex; /*FF 2 */
	display: inline-flex;
}

.val-Italic {
	font-style: italic;
}

.top .valPanel-encartHorizontal {
	background-color: transparent;
	margin: 0px;
}
.top .valPanel-encartHorizontal-icon {
	padding: 0px;
	height: 60px;
	width: 60px;
}
.top .valPanel-encartHorizontal-icon .prev {
	line-height: 60px;
	font-size: 1.6rem;
	margin: 0px;
}
.top .valPanel-encartHorizontal-content {
	background-color: transparent;
	padding: 0.25rem 1rem;
    padding-bottom: 0px;
}
.valPanel-encartHorizontal-content > div:first-child {
    height: 56.5px;
    overflow: hidden;
}

.top .Clickable.valPanel-encartHorizontal,
.top .Clickable.valPanel-encartHorizontal:hover {
	opacity: 1;
}
.top .Clickable .valPanel-encartHorizontal-content,
.top .Clickable .valPanel-encartHorizontal-content .prev {
	color: #6900C3;
	text-decoration: none;
	font-weight: bold;
	font-size: 1.1rem;
}
.top .Clickable:hover .valPanel-encartHorizontal-content,
.top .Clickable:hover .valPanel-encartHorizontal-content  {
	color: #400076;
	text-decoration: underline;
}
.top .Clickable .valPanel-encartHorizontal-content .prev,
.top .Clickable:hover .valPanel-encartHorizontal-content .prev,
.top .Clickable .valPanel-encartHorizontal-content .prev:before,
.top .Clickable:hover .valPanel-encartHorizontal-content .prev:before {
	text-decoration: none;
}

#tdActionsGlobalesAsync > a {
	margin: 0px 2rem 0px 0px;
}
#tdActionsGlobalesAsync > a:not([valcontrolkey="ValLinkButton"]) > .prev {
	margin: 0px;
}