/**<----------------- BASE --------------->*/


:root {
	--main-color-1: #64b5f6;
	--main-color-2: #4db6ac;
	--main-color-3: #00867d;
	--main-color-4: #ffa000;
	--main-color-5: #e91d63;
	--danger: red;
	--border-radius: 2rem;
	--main-color-6: #f2f8f8;
}

.row {
	margin: 0;
}


.pac-container {
	z-index: 1051;
}

.glyphicon {
	font-family: 'Glyphicons Halflings' !important;
}

.modal-dialog.modal-sm {
	max-width: 400px;
}

.modal-dialog {
	max-width: 860px;
}

.modal-dialog.modal-large {
	max-width: 98%;
}

.modal-confirmation {
	display: none;
}

.modal {
	overflow: auto;

}

ul.errors li {
	padding: 0.25rem 0.5rem;
	color: #fff;
}

ul.warnings li {
	margin: 5px 0;
}

h1,
h2,
h3 {
	margin: 0;
}

button.close {
	position: absolute;
	right: 0.5rem;
	top: 0.5rem;
}

.icon-bar {
	display: block;
	width: 22px;
	height: 2px;
	border-radius: 1px;
	background-color: #fff;
	margin-bottom: 4px;
}

.navbar-toggle {
	position: absolute;
	right: 1rem;
	top: 1rem;
	margin: 0;
	padding: 0;
	background-color: transparent;
	background-image: none;
	display: block;
}

.btn.navbar-toggle {
	position: static;
}

.toggle-li {
	display: none;
	position: relative;
	padding: 10px 30px;
	height: 100px;
	color: #fff;
}

h2.toggle-div {
	height: 50px;
	display: flex;
	justify-content: center;
	align-items: center;
	position: relative;
}

h4.toggle-div {
	display: flex;
	justify-content: center;
	align-items: center;
	position: relative;
	margin-bottom: 0;
}

* {
	box-sizing: border-box;
	padding: 0;
	margin: 0;
}

@font-face {
	font-family: "3ds";

	src: url('fonts/3ds.otf');
}

html,
body {
	font-family: "3ds" !important;
	padding: 0;
	margin: 0;
	width: 100%;
	font-size: 14px;
}

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

a {
	color: #000;
	text-decoration: none;
}

nav a {
	color: #fff;
}

input,
select {
	border: 1px solid #ccc;
}


img {
	width: 0.9125rem;
}

table {
	border-collapse: collapse;
}

l {
	list-style-type: none;
}


h1 {
	font-size: 2rem;
}

h2 {
	font-size: 1.5rem;
}

h3 {
	font-size: 1.25rem;
}

h4 {
	font-size: 1rem;
}

h1,
h2,
h3,
h4 {
	padding: 0.3125rem 0;
	color: var(--main-color-1);
	padding: 0.25rem 0.5rem;
	margin-bottom: 0.5em;
	text-align: center;
	font-weight: 900;
	border-radius: 0.25rem;
}

h1 .client,
h2 .client,
h3 .client,
h4 .client {
	color: #ccc;
}

h1 .date,
h2 .date,
h3 .date,
h4 .date {
	font-style: italic;
	color: #CCC;
}

h1 {
	text-transform: uppercase;
}

input[type=radio] {
	vertical-align: middle;
}

button:disabled {
	opacity: 0.5;
}

.button-group {
	display: flex;
}

.button-group .btn {
	flex-grow: 1;
}

.circuit-nom:hover {
	color: #fff;
}

a:hover {
	color: var(--main-color-2);
}

.invisible {
	display: none !important;
	visibility: visible;
}

ul.dossier-utilisateur-liste-incident {
	max-height: 300px;
	overflow-x: auto;
}

.liste-incidents-client-important {
	border-bottom: 2px solid;
	padding: 11px 5px;
}


.btn-save-vigilance {
	position: relative;
	margin-top: 10px;
	margin-left: 10px;
}

.contacts-utilisateur {
	display: grid;
	width: 100%;
	grid-template-columns: 500px 1fr;
	height: calc(100vh - 208px);
	/* background: var(--main-color-2); */
	padding: 1rem;
	border-radius: 1rem;
	column-gap: 1rem;
}

ul.liste-contact {
	background: #fff;
	vertical-align: top;
	width: 250px;
	max-height: 600px;
	overflow-y: auto;
	margin-right: 0px;
}

.liste-localisation .localisation {
	min-width: 25%;
	width: 100%;
	padding: 0;
	margin-bottom: 5px;
	border: solid 2px var(--main-color-1);
	border-radius: 0.25rem;
}

.localisation .localisation-icons {
	background: #fff;
	margin-bottom: 0px;
}

.localisation .localisation-icons i {
	margin: 3px 5px;
	color: var(--main-color-1);
}

.localisation .localisation-icons i:hover {
	color: var(--main-color-2);
	cursor: pointer;
}

.localisation .localisation-description {
	background: none;
	padding: 0.5rem;
}

.localisation.no-geo .localisation-role,
.adresse-container.no-geo .nom {
	background-color: var(--main-color-5);
}

.adresse-container.no-geo .nom {
	background: #c2185b;
	color: #fff;
}

.adresse-container.no-geo .nom::before,
.localisation.no-geo .localisation-role::before {
	content: "\f071";
	font-family: "Font Awesome 5 Free";
	margin-right: 0.5rem;
	font-weight: 900;
}

.localisation .localisation-details {
	display: grid;
	margin: 1rem;
}

.carte-utilisateur {
	width: 100%;
	height: 100%;
	/* margin-left: 5px; */
	padding: 1rem;
}

.carte-trajet {
	width: 100%;
	height: 565px;
	border-radius: 0.25rem;
}

.pos-rel {
	position: relative;
	padding: 0;
}

.titre {
	text-align: center;
}

/*<--------------- LAYOUT --------------->*/
.l-wrapper {
	position: relative;
	background: #fff;
}

.l-wrapper.popup-visible {
	opacity: .5;
}

.l-header {
	position: relative;
	z-index: 5;
	height: 75px;
	display: flex;
	justify-content: space-between;
	border-bottom: #808080 4px solid;
}

.l-header .widget {
	position: relative;
	flex-wrap: wrap;
	height: 75px;
	min-width: 150px;
	display: flex;
}




/*<--------------- MODULE --------------->*/

.header-logo {
	display: flex;
	justify-content: center;
	z-index: 6;
	align-items: center;
	flex-grow: 0.5;
}

.header-logo img {
	width: 210px;
}

.header-utilisateur {
	justify-content: space-around;
	align-items: center;
	flex: 2;
	flex-wrap: wrap;
}

.utilisateur-connecte {
	left: 50%;
	font-weight: bold;
	color: var(--main-color-1);
}

.header-apk {
	flex-grow: 1;
}

.telechargement-apk {
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translateX(-50%) translateY(-50%);
}

.header-signaler {
	flex-grow: 0.5;
}

.header-signaler .btn {
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translateX(-50%) translateY(-50%);
}


.container-fluid {
	padding: 0px;
	display: flex;
	z-index: 4;
	min-height: 500px;
	background: #78909c;
}

.main {
	padding: 0.5rem;
	background: #fff;
	height: calc(100vh - 46px);
	overflow-y: auto;
	width: 100%;
}

.main-menu {
	z-index: 100;
	background: #09867d;
	background: var(--main-color-3);
	width: 50px;
	font-size: 1rem;
	line-height: 28px;
	flex-grow: 1;
	overflow-y: hidden;
	overflow-x: hidden;
	padding: 0 0.5rem;
	/* width: 350px !important; */
}

nav.main-menu.expanded {
	overflow-y: auto;
}

.main-menu ul li.active ul {
	color: #333;
	margin-left: 0px;
	margin-top: 8px;
}


.main-menu ul>li.active {
	padding-bottom: 0;
}

.main-menu ul li ul li {
	font-size: 1rem;
}


.main-menu ul li {
	color: #fff;
	text-align: left;
	text-decoration: none;
	/* border-radius: 0.25rem; */
}


.main-menu>ul>li {
	display: block;
	padding: 0.5rem 0;
	font-size: 1.2rem;
	text-align: left;
	text-decoration: none;
	min-width: 270px;
	position: relative;
	/* border-bottom: 2px solid; */
	/* font-weight: 600; */
}

.main-menu ul>li.no-padding {
	padding: 0.625rem 0.3125rem 0 0;
}


.main-menu ul>li .roll:hover {
	color: #000;
	background: #fff;
	border-radius: 0.25rem;
}

.main-menu ul>li li:hover {
	color: #fff;
	background: var(--main-color-2);
	border-radius: 0.25rem;
}

.main-menu ul>li.active {
	border: #fff 2px solid;
	/* padding: 0; */
	color: initial;
	background: #fff;
	border-radius: 0.25rem;
}

.main-menu ul>li:hover a {
	color: #000;
}


.main-menu ul li ul li {
	display: none;
	margin-left: 0;
	width: 100%;
}

.main-menu ul li.active ul li {
	display: list-item;
}

.main-menu ul li ul li {
	margin: 0 1rem 0 0;
}

.main-menu ul li ul li a {
	margin: 0;
	color: initial;
	padding: 0.5rem;
	/* font-size: 0.8rem; */
	margin-left: 5px;
	border-radius: 0.25rem;
	display: block;
}

.main-menu ul li ul li:hover a {
	border: #fff;
	color: #fff;
}

.main-menu .unroll {
	right: 0rem;
	font-size: 0.75rem;
	justify-self: center;
	padding-right: 10px;
}

.main-menu .title{
	flex-grow: 1;
}

.main-menu .title,
.main-menu i {
	cursor: pointer;
}

/*----------------CONNEXION---------->*/

.connexion-container {
	position: absolute;
	top: 50%;
	left: 50%;
	padding: 50px;
	background: #75ce0b;
	border-radius: 10px;
	transform: translateX(-50%) translateY(-80%);
}

.logo img {
	width: 600px;
}

.connexion-identifiants {
	position: relative;
	height: 100px;
	margin-bottom: 50px;
}

.connexion-identifiants div {
	width: 70%;
	margin: auto;
	margin: 25px;
	color: #fff;
	border: none;
}

.connexion-id {
	position: absolute;
	top: 50%;
	left: 53.5%;
	transform: translateX(-50%) translateY(-100%);
}

.connexion-mdp {
	position: absolute;
	top: 100%;
	left: 50%;
	transform: translateX(-50%) translateY(-100%);
}

.connexion-identifiants input {
	padding: 10px;
	border: none;
	border-radius: 10px;
}

.mdp-oublie {
	position: absolute;
	bottom: 5px;
	left: 10px;
	color: #fff;
}

.connexion {
	position: absolute;
	right: 10px;
	bottom: 5px;
	width: 200px;
	padding: 0;
	color: #fff;
	background: var(--main-color-1);
	border: none;
	border-radius: 10px;
}

.message-erreur {
	padding: 5px;
	margin-bottom: 10px;
	background: red;
}


/*<---------------TB---------------->*/

.tb {
	display: flex;
	flex-direction: column;
}

.tb-div {
	padding: 10px;
	width: 50%;
}

.tb-div ul {
	max-height: 500px;
	overflow-y: auto;
}

.tb-div .content {
	max-height: 400px;
	overflow: auto;
}

.tb-left {
	display: inline-block;
}

.tb-changements-a-venir {
	flex-grow: 1;
}

.tb-changement span {
	color: var(--main-color-1);
}

.tb-changement {
	margin-top: 10px;
}

.tb-demandes {
	flex-grow: 1;
}

.tb-demande {
	padding: 3px 2px;
	border-bottom: 2px solid;
}

.tb-notification {
	position: relative;
}

.tb-demande span {
	color: var(--main-color-1);
}

.tb-demande:hover {
	color: var(--main-color-1);
	cursor: pointer;
}

.tb-demande img {
	vertical-align: top;
}

.tb-demande-periode {
	display: inline-block;
}

.tb-demande-content {
	max-height: 500px;
	overflow: auto;
}


.tb-incident {
	grid-column: span 4;
}

.tb-activite {
	width: 50%;
	background: #fff;
}

.tb-modification>div {
	max-height: 400px;
	overflow: auto;
}

.table-activite tr {
	border: 3px solid #fff;
}

.table-activite th {
	color: #fff;
	background: var(--main-color-1);
}

.table-activite td {
	height: 30px;
	text-align: center;
	vertical-align: middle;
	border: none;
}

.table-activite input {
	width: 120px;
}

tr.incident-majeurs {
	background: red;
}


.table-activite .dpc td {
	background: cadetblue;
}

.table-activite .fpc td {
	background: #ad4b4c;
}

.incident.incident-majeur {
	background: red;
}

.incident {
	background: #4658b9;
	margin-bottom: 5px;
	padding: 5px;
	color: #fff;
	position: relative;
}

.incident:last-child {
	margin-bottom: 0
}

/*<-------------CIRCUIT------------->*/

#tab-planning .date {
	position: relative;
	width: 25%;
	margin: 30px auto;
}

.circuit-nom {
	/* width: 50%; */
	display: inline-block;
	color: #000;
	color: var(--main-color-1);
	/* color: #fff; */
	padding: 0.5rem 1rem;
}

.circuit-nom:hover {
	/* width: 50%; */
	display: inline-block;
	color: #000;
	color: var(--main-color-1);

	/* color: #fff; */
	padding: 0.5rem 1rem;
}

.warning,
.success,
.danger {
	/* background: red; */
	/* color: #fff; */
	padding: 5px;
}

.semaine-date {
	display: flex;
	color: #fff;
	justify-content: center;
	gap: 1rem;
	align-items: center;
}

th .semaine-date {
	padding: 0;
}

.semaine-date .suivant,
.semaine-date .precedent {
	display: flex;
	align-items: center;
	justify-content: center;
	cursor: pointer;
	width: 60px;
	color: var(--main-color-2);
	border: var(--main-color-2) solid;
	border-radius: 0.25rem;
	flex-shrink: 0;
	font-size: 2rem;
}

.semaine-date .suivant:hover,
.semaine-date .precedent:hover {
	color: #fff;
	background: var(--main-color-2);
}

.semaine-date .precedent {
	margin-left: 0;
}




.flex .form-control {
	/* width: auto; */
}


.onglets {
	border-bottom: #eee 2px solid;
	margin-bottom: 1rem;
}


.onglets li {
	/* min-width: 90px; */
	padding: 0.25rem 1rem;
	color: #64b5f6;
	line-height: 1.5rem;
	/* text-align: left; */
	font-weight: 900;
	cursor: pointer;
	position: relative;
	/* background: #ffffff; */
	display: flex;
	margin-right: 0.5rem;
}

.onglets li.selected {
	opacity: 1;
	animation-duration: 0.2s;
	animation-name: slidein;
}


.onglets li:hover:after,
.onglets li.selected:after {
	content: "";
	height: 2px;
	position: absolute;
	left: 0;
	bottom: -2px;
	background: var(--main-color-1);
	width: 100%;
	animation-duration: 0.2s;
	animation-name: slidein;
}

.tabs {
	display: none;
}

.popup .tabs.active {
	display: block;
}

.tabs.active {
	display: block;
	width: 100%;
	animation-duration: 0.5s;
	animation-name: slidein;
}

@keyframes slidein {
	from {
		opacity: 0.5
	}

	to {
		opacity: 1
	}
}

.tabs-block.active {
	display: block
}

.planing.active,
.planning.active {
	display: initial;
}

.nom-circuit {
	position: absolute;
	top: 20px;
	left: 50%;
	transform: translate(-50%, 0%);
}


.nom-chauffeur {
	top: 20px;
	right: 20px;
}


.circuit-tools {
	display: flex;
	flex-wrap: wrap;
	align-items: flex-end;
	background: #fff;
}

.circuit-tools:hover {
	right: 0;
	transition: 0.5s 0.2s right;
	opacity: 1;
}

.circuit-tools .glyphicon-chevron-left {
	position: absolute;
	top: 10px;
	left: 7px;
}

.liste-client li .fa-wheelchair {
	margin-left: 5px;
}

.liste-client li.selected {
	opacity: 1;
}

.liste-client li {
	opacity: 0.5;
	cursor: pointer;
}

.filters ul.liste-client {
	display: none;
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(225px, 1fr));
	/* font-size: 0.65em; */
	margin: 0.25rem;
	transition: all 0.5s ease;
	flex-grow: 3;
	width: 100%;
}

ul.liste-client.hover {
	max-height: initial;
}

.filters ul {
	display: none;
	flex-wrap: wrap;
	max-height: inherit;
	padding: 0.5rem;
	margin: 0.25rem;
	border-radius: 0.25rem;
	font-size: 0.8em;
}

.liste-chauffeur li {
	opacity: 0.5;
	cursor: pointer;
}

.liste-chauffeur li.selected {
	opacity: 1;
	cursor: pointer;
}

.liste-etablissement li {
	opacity: 0.5;
	cursor: pointer;
}

.liste-etablissement li.selected {
	opacity: 1;
	cursor: pointer;
}

.liste-circuit li {
	opacity: 0.5;
	cursor: pointer;
}

.liste-circuit li.selected {
	opacity: 1;
	cursor: pointer;
}

ul.liste-circuit .label {
	background: var(--main-color-3);
}

ul.liste-chauffeur .label {
	background: var(--main-color-1);
}

ul.liste-etablissement .label {
	background: var(--main-color-5);
}


.liste-circuit li {
	/* padding: 0.25rem; */
}

.liste-etablissement li {
	/* padding: 0.25rem; */
}

img.carte-map {
	width: 20px;
}

img.impression-jour {
	display: inline;
	margin: auto;
}

.impression-jour {
	margin: 0px 10px;
	cursor: pointer;
}

.carte-map {
	margin: 0 10px;
	font-size: 17px;
	cursor: pointer;
}

.alerte-retard {
	margin: 0px 10px;
	cursor: pointer;
}


.carte-map:hover {
	color: var(--main-color-2);
}

.impression-jour:hover {
	color: var(--main-color-1);
}

.alerte-retard:hover {
	color: #e74c3c;
}

.planing-table {
	width: 95%;
	margin: 10px auto;
}

.planing-table tbody td {
	padding: 0.25rem;
	border: none;
	width: 25px;
}

.planing-table td.empty {
	display: none;
}

.planing-matin td {
	min-height: 300px;
	vertical-align: bottom;
}

.planing-soir td {
	min-height: 300px;
	vertical-align: top;
}


.planing-table th {
	border: none;
	border-right: 10px #fff solid;
}

.planing-samedi {
	border: 0.25rem solid #086ad1;
}

.block-horaire {
	margin-bottom: 0.25rem;
	border-radius: 0.25rem;
}

.horaire-utilisateur li {
	display: block;
	position: relative;
	background: #64b5f6;
	background: var(--main-color-1);
	padding: 0.25rem 1rem;
	font-size: 0.85rem;
	margin-bottom: 0.25rem;
	width: 100%;
}

.block-horaire .circuit {
	display: inline-block;
	height: 2rem;
	padding: 0.25rem;
	font-style: italic;
	top: 0;
	left: 0;
	overflow: hidden;
	text-overflow: ellipsis;
	flex: 1;
}

.block-horaire .horaire {
	position: relative;
	min-height: 60px;
	padding: 1rem;
	border: #4db6ac solid;
	border: var(--main-color-2) solid;
}

.block-horaire .nom {
	position: relative;
	color: #fff;
	padding: 2px;
}

.block-horaire .lieu {
	font-style: italic;
}

.block-horaire .tel li {
	display: block;
	background: #09867d;
	background: var(--main-color-3);
	padding: 0.25rem 0.5rem;
	margin: 0.25rem;
	border-radius: 0.25rem;
	font-size: 0.75rem;
	color: #fff;
}


.block-horaire .horaire.fin {
	border-color: #09867d;
	border: var(--main-color-3) solid;
}

.block-horaire .horaire.inactif {
	border: solid 1px;
	opacity: .3;
}

.block-horaire .horaire-utilisateur {
	letter-spacing: 0.02rem;
	font-weight: 900;
}

.block-horaire .horaire-heure {
	font-weight: 900;
	margin-left: 1rem;
	color: #fff;
}

.block-horaire .horaire-adresse {
	display: block;
	margin-top: 10px;
	margin-bottom: 3px;
	border: none;
}

.block-horaire .horaire-plus {
	position: absolute;
	right: 5px;
	bottom: 2px;
	width: 15px;
	cursor: pointer;
}

.horaire-modifier {
	position: absolute;
	top: 0;
	left: 0;
	width: 20px;
	cursor: pointer;
}

.block-horaire .horaire-info {
	position: relative;
	display: none;
	padding: 3px 5px;
	background: #eee;
}

.block-horaire .horaire-utilisateur {
	position: relative;
}

.horaire-fauteuil {
	font-size: 1rem;
	margin-left: 1rem;
	z-index: 1;
}

.horaire-fauteuil-bis {
	position: absolute;
	top: 4px;
	width: 22px;
	opacity: 0.5;
	right: 5px;
}

.horaire-chauffeur {
	position: absolute;
	top: 20px;
	right: 5px;
}

.horaire-ville {
	top: 0px;
	bottom: 10px;
	max-width: 80%;
	overflow: hidden;
	letter-spacing: .5px;
}


.horaire-info {
	display: none;
}

td.disabled {
	position: relative;
	width: 100%;
	height: 100%;
	cursor: pointer;
}

.deverrouiller {
	position: absolute;
	top: 50%;
	z-index: 2;
	left: 50%;
	transform: translate(-50%, -50%);
	width: 100%;
	height: 100%;
	opacity: 0.9;
	background: #333;
}

.deverrouiller span {
	display: none;
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
}

.ul-etablissement {
	justify-content: space-around;
}

.li-etablissement {
	position: relative;
	width: 100%;
	padding: 0.25rem 0.5rem;
	margin-top: 0.5rem;
	background: var(--main-color-2);
	color: #fff;
	border-radius: 0.25rem;
	font-size: 0.8rem;
	animation-name: popOf;
	animation-duration: 1s;
}

.li-etablissement-supprimer {
	position: absolute;
	top: 0.25rem;
	right: 0.5rem;
	cursor: pointer;
}

.li-circuit {
	position: relative;
	width: 100%;
	padding: 0.25rem 0.5rem;
	margin-top: 0.5rem;
	background: var(--main-color-2);
	color: #fff;
	font-size: 0.8rem;
	border-radius: 0.25rem;
}

.li-circuit:first-child {
	margin-top: 0;
}

.circuit-liste li.selected {
	color: #fff;
	background: #d42123;
}

.liste li:hover {
	background: var(--main-color-1);
	color: #fff;
}

.circuit-liste label {
	line-height: 28px;
	vertical-align: top;
}

.all-circuit {
	line-height: 28px;
	vertical-align: top;
}

.circuit-periodes p {
	margin: 10px 0;
}

.circuit-valider {
	margin: 15px 0;
}

.circuit-valider .btn {
	display: block;
}

.afficher-carte-matin,
.afficher-carte-soir {
	width: 40%;
	height: 10%;
}

.trajet {
	width: 100%;
	display: grid;
	grid-template-columns: 1fr 1fr;
}

.trajet-jour {
	display: inline-block;
}

.trajet-jour .actif {
	background: var(--main-color-1);
}

.trajet-jour li {
	cursor: pointer;
}

.liste-adresse .debut {
	border-color: var(--main-color-2);
}

.liste-adresse .fin {
	border-color: var(--main-color-1);
}

.liste-adresse .invalide {
	border-color: #e91e63;
}

.liste-adresse .horaires {
	border: var(--main-color-2) 4px solid;
	margin-bottom: 3rem;
	padding: 0.5rem;
	max-height: 250px;
	overflow-x: auto;
}

.liste-adresse li.horaire {
	border-width: 3px;
	border-style: solid;
	padding: 1rem;
	position: relative;
	margin-bottom: 0.5rem;
	padding-top: 2.5rem;
	list-style-type: none;
}

.trajet-jour li {
	display: inline-block;
	margin-left: -3px;
	width: 113px;
	max-width: 182px;
	text-align: center;
	height: 76px;
	background: red;
	font-weight: bold;
	color: #fff;
	border-right: 1px solid #000;
	border-bottom: 1px solid #000;
}

.jour-periode {
	display: inline-block;
	height: 40px;
	text-align: center;
	padding: 10px 0;
	margin-left: -4px;
	width: 50%;
	border-right: 1px solid #000;
}

.jour-periode:first-child {
	margin-left: -1px;
}

.jour-date {
	background: #666;
	border-bottom: 1px solid #000;
}

.jour-periode:last-child {
	border: none;
}


ul.utilisateurs {
	padding: 5px;
	background: red;
}

.place {
	display: flex;
	align-items: center;
	justify-content: center;
	position: absolute;
	width: 5.625rem;
	padding: 0.5rem;
	text-align: center;
	background: var(--main-color-1);
	/* border: 1px solid; */
	border-radius: 0.25rem;
	font-size: 0.75rem;
}

.place-fauteuil img {
	width: 50px;
	opacity: .4;
	position: absolute;
	right: 14px;
	bottom: 15px;
}

/*<-----------------EDITION TRANSPORT--------->*/

.fermer {
	position: absolute;
	top: 0;
	right: 0;
	width: 40px;
}

.date-semaine {
	margin-top: 10px;
}

.utilisateur.list {
	width: 180px;
	margin: 20px auto 0 auto;
}

.utilisateur .recherche {
	text-align: center;
}

.rechercher {
	position: relative;
	width: 1.5rem;
	display: flex;
	height: 2rem;
	justify-content: center;
	align-items: center;
	color: #4db6ac;
	cursor: pointer;
}

input.date {
	text-align: center;
	font-style: italic;
}

.semaine {
	text-align: center;
}

.btn.jour-btn {
	height: 45px;
}

.periode.debut {
	margin-right: 1rem;
	margin-bottom: 1rem;
}

.periode {
	position: relative;
	width: 100%;
}

.periode .heure {
	width: 100%;
}

td.fin.actif {
	background: #d42123;
}

.adresse-container:not(.completed) {
	display: flex;
	padding: 1rem;
	text-align: center;
}

.adresse-container {
	vertical-align: top;
	min-height: 50px;
	width: 100%;
	border-radius: 0.25rem;
	border: solid var(--main-color-1);
	justify-content: center;
	align-items: center;
}

.table-transports .adresse-container {
	min-width: 140px;
	max-width: 400px;
}

.adresse-debut {
	position: relative;
	grid-column: 2 span;
}

.adresse-container.completed {
	border: 0;
}

td .adresse-debut.completed {
	width: 100%;
}

td .adresse-fin.completed {
	width: 100%;
}


.adresse-fin {
	position: relative;
	grid-column: 2 span;
}

.adresse-fin.completed {
	vertical-align: top;
	min-height: 50px;
	width: 100%;
}

.heure {
	top: 10px;
	right: 10px;
	bottom: 0;
	width: 60px;
	vertical-align: middle;
}

.form-adresse.adresse {
	width: 300px;
}

.adresse {
	width: 100%;
	overflow-x: hidden;
	overflow-y: auto;
	text-align: justify;
}

.jour-btn.active {
	background: var(--main-color-1);
}

.facturation {
	margin-top: 10px;
}

.type-transport input {
	vertical-align: middle;
}

.periodes {
	display: none;
}

table.impair {
	display: none;
}

/*<---------COMPTE-RENDU------->*/

.comportement-usager {
	position: relative;
	background: #fff;
	padding: 10px;
	text-align: left;
}

.comportement-usager li {
	margin-bottom: 5px;
}

.comportement-usager>ul>li>ul>li {
	display: inline-block !important;
	vertical-align: top;
	width: 45%;
}

.comportement-usager li li {
	margin-left: 15px;
}

/*<-------------RAPPORT------------>*/

.rapport-form {
	position: relative;
}

.rapport-search {
	position: absolute;
}

.rapport-circuit {
	position: relative;
}

.rapport-chauffeur {
	position: relative;
}

.etablissement-liste {
	padding: 15px;
	color: #fff;
	background: var(--main-color-1);
	transition: all linear 5s;
}

.etablissement-liste-ul {
	padding-left: 15px;
	line-height: 25px;
}

.completion {
	position: absolute;
	right: 0;
	left: 0;
	z-index: 2000;
	overflow-y: auto;
	color: #000;
	text-align: left;
	background: #fff;
	border-width: 1px 1px;
	border-style: solid;
	border-color: #ccc;
	margin-top: 5px;
	width: 500px;
	padding: 0.5rem;
}

.completion>ul {
	overflow-y: auto;
	max-height: 300px;
}

.completion li:hover>.content,
.completion li.selected {
	color: #fff;
	background: var(--main-color-1);
}

.completion li li:hover {
	color: #fff;
}

.completion li {
	padding: 0.25rem 0.25rem;
	line-height: 1.2rem;
}

.completion li ul {
	padding: 5px;
	color: #000;
	background: #fff;
	border-width: 1px 0px;
	border-style: solid;
	border-color: #ccc;
}

.completion.completion-adresse ul {
	padding: 0;
}


.completion-adresse li li {
	cursor: pointer;
	margin-bottom: 10px;
}

.completion-adresse .filtrer-adresse {
	width: 100%;
}

.completion-adresse .title {
	padding: 5px;
}

.liste-rapport {
	width: 100%;
}

.rapport-imprimer {
	width: 49%;
}

.rapport-transmettre {
	width: 49%;
}

.rapport-mensuel tbody tr {
	display: none;
}

.transport-debut {
	color: #fff;
	background: #75ce0b;
}

.transport-fin {
	color: #fff;
	background: #ad4b4c;
}

.theorique {
	color: var(--main-color-1);
}

.circuit-debut {
	color: #fff;
	background: var(--main-color-1);
}

.circuit-fin {
	color: #fff;
	background: var(--main-color-1);
}

.coupure {
	color: #fff;
	background: #212fd494;
}

.pause {
	background: #fff;
}

.nouveau-transport td {
	background: var(--main-color-1);
}

/*<-------------DEMANDE------------>*/


.demande-administration {
	margin-bottom: 20px;
}

.demande-etat {
	margin-bottom: 20px;
}

.demande-liste-date {
	position: relative;
	margin-bottom: 20px;
}

.demande-date-type {
	display: inline-block;
}

/*<-------------Planning------------>*/

.planning-etablissement {
	position: relative;
}


/*<-------------FOOTER------------>*/

.footer {
	position: relative;
	display: flex;
	flex-direction: column-reverse;
	color: #fff;
	background: #323232;
	font-size: .875rem;
}

.complement,
.adresse {
	text-align: left;
	font-size: 0.8125em;
	font-style: italic;
}

p.adresse {
	padding: 0px;
	text-align: left;
	font-style: italic;
}


.complement div {
	display: inline-block;
	vertical-align: middle;
}

.complement .description {
	position: absolute;
	top: 20px;
	width: 250px;
	padding: 5px;
	line-height: 25px;
	letter-spacing: .009em;
}

.complement .description img {
	width: 12px;
	margin-left: 10px;
}

.complement .description .ajouter {
	position: absolute;
	top: 0px;
	left: 6px;
	width: 60%;
	padding: 5px;
	font-weight: bold;
	color: #fff;
	border: none;
}

.complement .planing {
	position: absolute;
	right: 50px;
	bottom: 20px;
	display: none;
	width: 70%;
	height: 80%;
	padding: 5px 5px 5px 15px;
}


.complement .planing div {
	width: 220px;
}

.complement .planing .utilisateur {
	margin-top: 10px;
}

.complement .planing span {
	font-weight: bold;
}


.complement .planing img {
	display: block;
	width: 16px;
	margin-top: 10px;
}

.complement .planing table {
	position: absolute;
	top: 20px;
	right: 20px;
	width: 78%;
}

.complement .planing table th {

	font-weight: unset;
	letter-spacing: .3px;
	border: #323232 solid 1px;
	text-align: center;
}

.complement .planing table td {
	width: 100px;
	height: 25px;
	padding: 3px 10px;
	color: #000;
	text-align: center;
	cursor: pointer;
	background: #75ce0b;
	border: #323232 solid 2px;
	border-left: 4px solid #323232;
}

.footer-droits {
	right: 0;
	bottom: 0;
	left: 0;
	display: inline;
	text-align: center;
}

.btn {
	color: #fff;
	background: var(--main-color-1);
}

input.form-control,
select.form-control {
	font-size: 0.875rem;
	height: calc(2rem + 2px);
}

.btn {
	font-size: 0.875rem;
	height: calc(2rem + 2px);
	border-radius: 0.25rem;
}

select.form-control:not([size]):not([multiple]) {
	height: calc(2rem + 2px);
}

.page:hover {
	border: solid 1px;
	padding: calc(0.15rem - 1rem) calc(0.5rem - 1px);
}

.btn-primary:hover {
	background: #3fa6d2;
}

.btn-danger {
	background: #ad1457;
	border: none;
}

.btn-danger:focus,
btn-danger:active {
	background: #f97474;
}

.btn-success {
	background: var(--main-color-2);
}


.btn-warning {
	background: #f0ad4e;
}

.btn.instructions {
	width: 100%;
}

.flash {
	font-size: 0.75rem;
	color: #fff;
	position: fixed;
	right: 0;
	z-index: 9000;
	padding: 0.5rem;
}

.flash-message {
	transition: all 2px ease;
	padding: 0.5rem;
	margin-top: 0.5rem;
	border-radius: 0.25rem;
	box-shadow: 0 10px 20px 0 rgba(0, 0, 0, .2), 0 1px 6px 0 rgba(0, 0, 0, .2);
}

.flash-message.success {
	background: var(--main-color-2);
}

.flash-message:first-child {
	margin-top: 0
}

.warning,
table td.warning {
	background: #ec971f;
}

table tr.stop {
	border: solid #1faeec;
}

.success,
table td.success,
table th.success {
	background: var(--main-color-2);
	color: #fff;
}

.danger,
table td.danger {
	background-color: #f97474;
}

/*<----------------TABLE------------>*/

.table th input {
	width: 100%;
}

.table th input[type=checkbox] {
	width: 15px;
}

.table-form td {
	padding: 5px 0;
	border: none;
}

.profondeur {
	display: initial;
	background: #aaa;
}

.td-profondeur {
	width: 100%;
}

.profondeur td {
	width: 50px;
	border: #aaa;
}


.table .lien {
	padding: 2px 6px 2px 5px;
	font-size: 0.8125rem;
	border-radius: 0 0.25rem 0.25rem 0;
	margin: 2px;
	border-left: 3px solid var(--main-color-3);
	background: var(--main-color-6);
	color: initial;
}

.table .lien.danger {
	border-color: #e91e63;
}

.table .lien.success {
	/* background: var(--main-color-2); */
}

.table .lien.primary {
	background: var(--main-color-1);
}

.table .lien a {
	/* color: #fff; */
}

img.up {
	position: absolute;
	right: 10px;
	top: 2px;
}

img.down {
	position: absolute;
	right: 10px;
	bottom: 2px;
}

.nav-client {
	display: flex;
	justify-self: end;
}

.previous-client,
.next-client {
	border: 2px solid var(--main-color-2);
	color: var(--main-color-2);
	margin-right: 10px;
	cursor: pointer;
	border-radius: 0.25rem;
	font-size: 0.8rem;
	height: calc(2rem + 2px);
	display: flex;
	align-items: center;
	width: 250px;
}

.next-client i.fas,
.previous-client i.fas {
	margin: 0.5rem;
	font-size: 1rem;
}

.previous-client .name,
.next-client .name {
	flex-grow: 1;
	text-align: center;
	margin: 1rem 0.5rem;
	line-height: 0.7rem;
	display: block;
}

.previous-client:hover,
.next-client:hover {
	background: var(--main-color-2);
	color: #fff;
	transition: all 0.2s ease-in;
}

.navigation-circuit .btn {
	height: initial;
	display: flex;
	font-size: 1.5rem;
	justify-content: center;
	background-color: #fff;
	color: var(--main-color-1);
	border: var(--main-color-1) solid;
	align-items: center;
}

.navigation-circuit .btn a {
	color: var(--main-color-1);
}

.next-circuit:hover,
.previous-circuit:hover {
	background-color: var(--main-color-1);
	color: #fff;
}

.previous-client-row {
	position: absolute;
	left: 10px;
}

.next-client-row {
	position: absolute;
	right: 10px;
}



/*<---------------FORM------------>*/

form.flex {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
}

form.flex div {
	margin-right: 5px;
}

.form-utilisateur {
	display: flex;
}

.form-flex {
	display: flex;
}

.form-flex .form-group {
	margin-right: 0.5rem;
	margin-bottom: 0;
}

.dp-ib {
	display: inline-block;
}

.dp-block {
	display: block;
}

form input,
form select {
	background: #fff;
}

.heure-select {
	display: flex;
	justify-content: center;
}

form input[type=text].datepicker:not(.current-date) {
	width: 7rem;
	font-size: 0.875rem;
	color: var(--main-color-2);
	border: solid 1px var(--main-color-2);
	text-align: center;
}

input.heure[type=text] {
	text-align: center;
}

input.pair[type=text] {
	width: 50px;
}

.form option:hover {
	background: var(--main-color-1);
}

.tb-activite {
	width: 100%;
	order: 2;
}

.table-activite {
	margin: auto;
}

.tb-left {
	display: flex;
	flex-wrap: wrap;
	flex-grow: 1
}


.tb-changement-a-venir {
	display: inline-block;
	width: 50%;
}

.ul-circuit {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
}

.flex-outer,
.flex-inner {
	list-style-type: none;
	padding: 0;
}

.flex-outer {
	margin: 0px auto;
	padding: 1rem;
	font-size: 0.875rem;
}

.flex-outer.flex-outer-full {
	max-width: 100%;
}


.modal .flex-outer {
	max-width: 100%;
}

.tab-ponctuel .flex-outer {
	max-width: 100%;
}

.tab-periodique .flex-outer {
	max-width: 100%;
}

.flex-outer>li,
.flex-inner {
	display: flex;
	flex-wrap: wrap;
	justify-content: flex-end;
	align-items: center;
}

.flex-outer>li {
	position: relative;
}

.flex-outer>li>textarea {
	padding: 5px;
}

.flex-inner {
	padding: 0 8px;
	justify-content: space-between;
}


.flex-outer li label,
.flex-outer>li p {
	letter-spacing: .02rem;
}

.flex-outer>li>label,
.flex-outer>li p {
	flex: 1 0 100px;
	margin-right: 1rem;
	align-content: flex-start;
	margin-bottom: 0;
}

.flex-outer>li>label+*,
.flex-inner {
	flex: 1 0 80%;
}

.flex-outer>li>label+input[type=checkbox] {
	flex: initial;
}

.flex-outer>li>label+.heure {
	flex: 0 0 4rem;
}

.flex-outer>li>label+.heure+.heure {
	flex: 0 0 4rem;
	margin-left: 1rem
}

.flex-outer>li>label+.icheckbox_flat-green {
	flex: initial;
}

.flex-outer>li p {
	vertical-align: top;
}



.utilisateur-form {
	position: relative;
}

.client-fauteuil img {
	width: 80px;
}

.dropfile {
	height: 50px;
	background: #fff;
}

.dropfile.hover {
	border: 2px dotted;
}

.previous {
	cursor: pointer;
}

.next {
	cursor: pointer;
}

.previous:hover,
.next:hover {
	color: red;
}




/* The switch - the box around the slider */
.switch {
	position: relative;
	display: inline-block;
	width: 3.75rem;
	height: 1.5625rem;
	margin-bottom: 0;
}

/* Hide default HTML checkbox */
.switch input {
	display: none;
}

/* The slider */
.slider {
	position: absolute;
	cursor: pointer;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background-color: #e91d63;
	-webkit-transition: .4s;
	transition: .4s;
	border-radius: 4rem;
}

.slider:before {
	position: absolute;
	content: "";
	height: 1.1rem;
	width: 1.25rem;
	left: 0.25rem;
	bottom: 0.25rem;
	background-color: #fff;
	-webkit-transition: .4s;
	transition: .4s;
	border-radius: 4rem;
}

input:checked+.slider:before {
	background-color: #fff;
}


input:checked+.slider {
	background-color: var(--main-color-2);
}

input:focus+.slider {
	box-shadow: 0 0 1px #43494c;
}

input:checked+.slider:before {
	-webkit-transform: translateX(32px);
	-ms-transform: translateX(32px);
	transform: translateX(2rem);
}

.switch.switch-sm {
	width: 50px;
	/* height: 25px; */
}

.switch-sm .slider:before {
	height: 18px;
	width: 16px;
	left: 2px;
	bottom: 3px;
}

.switch-sm>input:checked+.slider:before {
	-webkit-transform: translateX(25px);
	-ms-transform: translateX(25px);
	transform: translateX(28px);
}


/* Rounded sliders */
.slider.round {
	border-radius: 34px;
}

.slider.round:before {
	border-radius: 50%;
}

.option {
	background: #ccc;
	border: 2px solid;
	border-bottom: 1px solid;
}

.option li {
	border-bottom: 1px solid;
	padding: 2px;
}

.option li:hover {
	background: var(--main-color-1);
	color: #fff;
	cursor: pointer;
}

.ajouter-ligne {
	cursor: pointer;
}

.disabled {
	opacity: 0.5;
}

.liste-clients {
	background: #ccc;
	border: 2px solid;
	border-bottom: 1px solid;
	width: 500px;
}

td.etat {
	width: 140px;
}

.fpec.new {
	display: table-row;
}

.rapport-liste h2 {
	position: relative;
}

.rapport-utilisateur {
	flex-wrap: wrap;
	width: 100%;
}

.rapport-liste-item {
	flex-grow: 2;
	width: 45%;
	margin: 5px 10px;
	position: relative;
}

.rapport-liste-item h2 {
	padding: 8px;
}

.liste-transports {
	overflow: auto;
	max-height: 345px;
	margin-bottom: 10px;
}

.liste-jour {
	display: grid;
	grid-template-columns: repeat(7, 1fr);
	background-color: white;
}

.liste-jour-impair {
	display: none;
}

.dates-periode {
	margin-bottom: 1rem;
	border-radius: 0.25rem;
	margin-left: 1rem;
}

ul.tb-details {
	margin-left: 10px;
}

ul.tb-details li {
	padding: 5px 5px;
	background: cornflowerblue;
}

.btn.incident-lu {
	position: absolute;
	right: 5px;
}

ul.liste-etablissements li .nom {
	background: #ccc;
	padding: 4px;
	margin-bottom: 6px;
}

ul.liste-etablissements {
	display: flex;
	flex-direction: column;
	overflow-x: auto;
	flex-wrap: wrap;
	max-height: 300px;
}

ul.liste-chauffeurs li {
	border-bottom: var(--main-color-1) solid 1px;
	padding: 0.5rem 0.5rem;
	margin-bottom: 0;
	color: var(--main-color-1);
	position: relative;
}

ul.liste-chauffeurs {
	display: flex;
	flex-direction: column;
	overflow-x: auto;
	max-height: 300px;
}


ul.liste-chauffeurs li span {
	position: absolute;
	right: 0px;
	width: 20px;
	text-align: center;
	cursor: pointer;
}

.vehicule {
	position: relative;
	display: none;
}

.vehicule.actif {
	display: block;
	animation-duration: 1s;
	animation-name: popOf;
}

@keyframes popOf {
	from {
		opacity: 0
	}

	to {
		opacity: 1
	}
}

.liste-jour .parite {
	display: none;
}

tr.erreur-localisation td {
	background: #d18989;
}

.btn.save-all-components {
	width: 90%;
}

.details-coord {
	display: none;
}



.dhx_cal_event .dhx_title {
	font-size: 0.5625rem;
}

.dhx_cal_event .dhx_body {
	font-size: 0.5625rem;
}

.dhx_scale_holder .dhx_cal_event .dhx_body {
	overflow: hidden;
}

.dhx_scale_holder .dhx_cal_event .dhx_body {
	line-height: normal;
}

.dhx_cal_event .dhx_body,
.dhx_cal_event.dhx_cal_select_menu .dhx_body {
	line-height: normal;
}

.details-transport {
	position: absolute;
	display: none;
	border-width: 0;
	border-color: #fff;
	border-style: solid;
	opacity: 0.65;
	z-index: 50;
	bottom: 18px;
	width: 470px;
	word-wrap: break-word;
	font-size: 0.85rem;
	line-height: 22px;
	background: #fff;
	line-height: 1.4rem;
	box-shadow: 0 10px 20px 0 rgba(0, 0, 0, .2), 0 1px 6px 0 rgba(0, 0, 0, .2);
}

.details-transport.right {
	right: 0;
}

.details-transport.left {
	left: 0;
}

.details-transport:hover {
	opacity: 1;
}

.tooltip-transport {
	padding: 1rem;
}

.dhtmlXTooltip.tooltip[role=tooltip] {
	word-wrap: break-word;
	font-size: 0.85rem;
	min-width: 380px;
	max-width: 600px;
	line-height: 1.4rem;
	padding: 0.25rem;
	background: #fff;
	border-radius: 0.25rem;
}

.tooltip-transport .transport-periodique {
	color: #666;
}

.tooltip-transport li {
	margin: 0.15rem 0;
}

.tooltip-transport .start,
.tooltip-transport .end {
	display: flex;
}

.tooltip-transport .title {
	font-weight: bold;
	text-align: center;
	margin-bottom: 10px;
	margin: 1rem;
	padding: 0.5rem;
	font-size: 1.2rem;
	/* color: #fff; */
	text-align: center;
	/* border-radius: 0.25rem; */
	/* border-bottom: solid 3px; */
}

.tooltip-transport .date {
	color: var(--main-color-1);
	margin: 1rem;
	font-size: 1rem;
	font-style: normal;
	font-weight: bold;
}

.details-transport .start,
.details-transport .end {
	display: flex;
}

.tooltip-transport .start .heure,
.tooltip-transport .end .heure {
	margin-right: 10px;
	width: initial;
}

.details-transport ul {
	overflow-y: auto;
	max-height: 600px;
	margin-bottom: 5px;
}

.details-transport li:last-child {
	margin-bottom: 0;
}


.transport-periodique {
	position: absolute;
	top: 10px;
	right: 10px;
	font-weight: bold;
	color: #fff;
}


.horaire-fauteuil.event {
	width: 15px;
}

.dhx_body {
	position: relative;
}

.dhx_body .fauteuil {
	position: absolute;
	bottom: 5px;
	right: 5px;
}

.highlighted_timespan {
	background-color: #87cefa;
	opacity: 0.5;
	filter: alpha(opacity=50);
	cursor: pointer;
	z-index: 0;
}


.details-jour {
	position: fixed;
	top: 0;
	left: 50px;
	z-index: 1100;
	background: #fff;
	padding: 5px;
	width: 500px;
	border: #000 2px solid;
}

.details-jour .flex {
	display: flex;
}

.details-jour .client {
	font-weight: bold;
	text-align: center;
}

tbody tr.pec td,
tbody tr.pec-multiple td {
	background: #2bd677;
}

tbody tr.fpec td,
tbody tr.fpec-multiple td {
	background: var(--main-color-1);
}

tbody tr.debut-travail td {
	background: darkseagreen;
}

tbody tr.fin-travail td {
	background: #AEAEAE;
}

.liste-client-complement {
	font-style: italic;
}

.liste-client-ville {
	font-weight: bold;
	text-transform: uppercase;
}

.liste-client-cp {
	font-weight: bold;
}

li.liste-contact.no-geo {
	margin-left: 0;
}

.tabs .errors {
	text-align: left;
}

.errors li {
	background: var(--main-color-4);
	color: #fff;
	margin-bottom: 0.5rem;
	padding: 0.25rem 0.5rem;
	border-radius: 0.25rem;
}

.errors {
	width: 100%;
	text-align: left;
}


.table-transports .completion .content {
	margin: 0;
}

.vehicules-circuit {
	padding: 5px;
}

.ul-dossier-utilisateur-statistiques .nb {
	font-style: italic;
	font-weight: bold;
}

.cache {
	display: none;
}

td .actions {
	display: flex;
	flex-wrap: wrap;
}

.actions .btn {
	margin-left: 5px;
}

.fichier-upload {
	flex-grow: 1;
}

.dossier-utilisateur-liste-incident li {
	margin-bottom: 5px;
	font-weight: bold;
}

.dossier-utilisateur-liste-incident .libelle {
	font-weight: initial;
}

p.info {
	text-align: center;
	vertical-align: middle;
	height: 0px;
}

.question-planning {
	padding: 11px 11px;
	background: #75CE0B;
	text-align: center;
}

tbody tr.warning td {
	background: #ffa000;
	color: #333;
}

tbody tr.success td {
	background: #26a69a;
}

tbody tr.danger td {
	background: #d50000;
}

.td-flex .flex {
	display: flex;
	flex-wrap: wrap;
	width: 100%;
}

.td-flex {
	width: 40%;
}

.commandes-jours {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-around;
}



.cr-liste tbody table td.plus {
	display: none
}

.cr-liste tbody table .fpec td.etat {
	display: none
}

.cr-liste tbody table .fpec td.detail {
	display: none
}

td.adresse {
	width: 450px;
}

.cr-tr td.etat {
	width: 180px;
}

.new-ligne-details {
	display: none;
}

.enregistrer-details {
	position: absolute;
	right: 10px;
}

pre {
	text-align: left;
}

.frise-chronologique {
	display: flex;
	width: 1150px;
	min-height: 50px;
	margin-bottom: 10px;
	align-items: center;
}

.bloc-frise {
	padding: 5px;
	min-height: 32px;
	border-right: 1px solid;
	border-top: 1px solid;
	border-bottom: 1px solid;
}

.bloc-frise.selected {
	padding: 5px;
	border-color: red;
	opacity: 0.7;
}

.bloc-frise.debut-travail {
	background: darkseagreen;
}

.bloc-frise.dpec {
	background: cadetblue;
}

.bloc-frise.fpec {
	background: #ad4b4c;
}

.bloc-frise.cp {
	background: #f8f8f8;
}


.bloc-frise.fin-travail {
	background: #ccc;
}

.info-bulle {
	position: absolute;
	background: #fff;
	padding: 5px;
	border: 2px solid;
	border-radius: 5px;

}

td.total-jour {
	min-width: 100px;
}

.rapport-mensuel td,
.rapport-mensuel th {
	min-width: 70px;
}

.comportement-usager select {
	border: 2px solid;
}

.contacts-utilisateur .flex-outer li {
	margin-bottom: 4px;
}

.contacts-utilisateur .flex-outer>li>textarea {
	padding: 5px;
}

.icon-map {
	color: #c2185b;
}

.icon-delete {
	color: #c2185b;
}

form .nouveau-contact {
	display: flex;
	align-items: center;
	justify-content: center;
	height: 25px;
	width: 25px;
	background: #9a9a9a;
}

.flex {
	display: flex;
	flex-wrap: wrap;
}

.flex-end {
	justify-content: end;
}

.gap-4 {
	gap: 1rem;
}

.sort {
	width: 25px;
}

.valider-etat-presence {
	float: right;
	margin-top: 35px;
	margin-right: 40px;
	width: 200px;
	height: 50px;
}

.tooltip {
	z-index: 2000 !important;
}

.no-result {
	background: #f0ad4e;
	padding: 5px;
	color: #fff;
	flex-grow: 1;
	border-radius: 0.25rem;
}

.liste-comportements li {
	position: relative;
	display: flex;
	background: var(--main-color-2);
	border-radius: 0.25rem;
	margin-bottom: 0.25rem;
	padding: 0.25rem 0.5rem;
	color: #fff;
	margin-right: 0.5rem;
	justify-content: space-between;
}

.liste-comportements {
	padding: 1rem 0;
	display: flex;
	flex-wrap: wrap;
	justify-content: start;
}

.remove-comportement {
	display: flex;
	align-self: center;
	margin-left: 0.5rem;
	justify-content: center;
}

ul.liste-contraintes {
	display: flex;
	/* color: #fff; */
	flex-wrap: wrap;
	margin-bottom: 0.5rem;
}

ul.liste-contraintes li {
	background: var(--main-color-6);
	position: relative;
	display: flex;
	margin: 0.25rem 0.25rem;
	border-radius: 0.25rem;
	/* border-right: 0.25rem solid red; */
}

.liste-contraintes li.administration {
	background: #fb8b00;
}

.liste-contraintes .nom {
	padding: 0.3rem 1rem;
	font-size: 0.8rem;
}

.remove-contrainte {
	display: flex;
	justify-content: center;
	align-items: center;
	width: 2rem;
	cursor: pointer;
	color: #fff;
	background: red;
	border-radius: 0 4rem 4rem 0;
}

.liste-contraintes li.chauffeur .remove-contrainte {
	background-color: var(--main-color-1);
}

.liste-contraintes li.circuit .remove-contrainte {
	background-color: var(--main-color-2);
}

.liste-contraintes li.etablissement .remove-contrainte {
	background: #ba68c7;
}

.liste-contraintes li.client .remove-contrainte {
	background: #ad1457;
}


.remove-contrainte:hover .fas.fa-times {
	background: #cf000e;
	color: #fff;
}

.contrainte-circuits input.form-control {
	border: var(--main-color-2) 4px solid;
}

.contrainte-etablissements input.form-control {
	border: #ba68c8 4px solid;
}

.contrainte-clients input.form-control {
	border: #ad1457 4px solid;
}

.contrainte-chauffeurs input.form-control {
	border: #2AABD2 4px solid;
}

.contrainte-administrations input.form-control {
	border: #fb8c00 4px solid;
}

.dhx_cal_navline .dhx_cal_date {
	/* font-size: 0.75rem; */
}

.flex-cl {
	flex-direction: column;
	display: flex;
}

.flex-cl .btn {
	margin-left: 4px;
}

.flex-cl {
	flex-direction: row;
	display: flex;
}


.etat .btn {
	width: 32%;
}

.etat-presence-transports td.etat {
	width: 30px;
	text-align: center;
}

.cr-tr td.etat .btn {
	width: 48%;
}

.cr-tr .cr-lieu .adresse {
	display: none;
}

.cr-liste .heure,
.liste-coupure .heure {
	height: 100%;
	text-align: center;
}

.cr-liste .cr-heure {
	height: 100%;
	padding: 1px;
	text-align: center;
	width: 60px;
}

.cr-liste {
	width: 100%;
}

.cr-liste td,
.cr-liste th {
	padding: 3px 4px;
	border: 1px solid #fff;
}

.cr-liste td {
	background: #f97474;
}

.cr-liste .groupe {
	display: none
}

.cr-liste .cr-kilometrage {
	width: 60px;
}

.liste-transports-cr {
	overflow: auto;
	max-height: 500px;
	margin-bottom: 15px;
}

.form-cr {
	padding: 10px;
}

.etat-presence-transports {
	overflow: auto;
	justify-content: space-between;
	flex-wrap: wrap;
	margin-bottom: 20px;
}

.form-cr .ajouter-domicile {
	width: 200px;
}

.cr-totaux input {
	width: 50px;
	margin: 0px 10px 0 5px;
}

.cr-totaux {
	margin-bottom: 15px;
}

.template {
	display: none;
}

.matin,
.soir {
	flex-grow: 1;
	overflow-y: auto;
	width: 50%;
}

.address {
	display: none;
}

.cr-ligne.removed {
	display: none;
}

.cr-ligne.fpec.canceled {
	display: none;
}

.cr-ligne.deleted {
	display: none;
}

td.cr-heure {
	width: 100px;
}

.etat-presence-transports td,
.etat-presence-transports th {
	vertical-align: middle !important;
	text-align: center;
	font-size: 0.8125rem;
	padding: 8px;
	border-bottom: 1px solid #ccc;
}

.etat-presence-transports table {
	width: 100%;
}

.cr-ligne .options,
.fpec-multiple .options,
.dpec-multiple .options {
	text-align: center;
}

td.etat {
	text-align: center;
}

td.td-heure {
	text-align: center;
}

td.td-date {
	text-align: center;
}

.transports-presence thead th {
	text-align: center;
}

.transports-presence tbody tr.filtred {
	display: table-row;
}

th .date {
	width: initial;
	margin: 0
}

.etat-presence .etat-presence-transports {
	overflow: initial;
	max-height: initial;
	justify-content: space-between;
	flex-wrap: wrap;
	animation-duration: 2.2s;
	animation-name: slidein;
	padding: 1rem;
	position: relative;
}

.etat-presence .matin,
.etat-presence .soir {
	flex-grow: 1;
	overflow-y: initial;
}

.etat-presence-circuits .btn {
	margin-bottom: 5px;
	font-size: 0.75rem;
	padding: 0.25rem;
	height: 1.75rem;
}

.bloc-chargement {
	display: flex;
	align-items: center;
	justify-content: center;
	max-height: 400px;
	min-height: 50px;
	flex-grow: 1;
	background: #ccc;
}

.chargement {
	text-align: center;
	vertical-align: middle;
	font-weight: bold;
}

.no-result .nom {
	font-weight: bold;
	color: #d42123;
}

.no-result .date {
	font-style: italic;
	color: #fff;
	border-radius: 0.25rem;
	padding: 0.25rem 1rem;
	background: var(--main-color-2);
}

.cloturer-etat-presence {
	/* flex-grow: 1; */
	display: flex;
	flex-direction: row-reverse;
}

.cloturer-rapport-presence-etablissement {
	/* width: 100%; */
	display: inline;
}

.rapport-kilometrage>table>tbody>tr>td:hover {
	background: #b9e0f1;
}

.cloturer-etat-presence-circuit {
	/* padding: 20px; */
	border-radius: 0.25rem;
	flex-grow: 1;
	margin-top: 20px;
}

.details-kilometrage-mois {
	margin: 20px auto;
	width: 100%;
	font-size: 0.75em;
}

.details-kilometrage-mois td,
.details-kilometrage-mois th {
	padding: 0.25rem 0.5rem;
}

.total-kilometrage-mois {
	background: #80d465;
	padding: 10px;
	margin: 10px 20px;
}

.action {
	padding: 5px;
	display: flex;
	flex-direction: row-reverse;
}

.action .btn {
	margin-right: 15px;
}

.action .btn:last-child {
	margin-right: 0;
}

.btn-action {
	border: none;
	background-color: var(--main-color-1);
	transition: 1s background-color ease;
}

.btn-action:hover {
	background-color: var(--main-color-2);
}

.etat .iradio_flat-red.disabled {
	background-position: -88px 0;
}

.etat .iradio_flat-green.disabled {
	background-position: -88px 0;
}

.etat .iradio_flat-orange.disabled {
	background-position: -88px 0;
}

.etat .iradio_flat-red.disabled.checked {
	background-position: -110px 0;
}

.etat .iradio_flat-green.disabled.checked {
	background-position: -110px 0;
}

.etat .iradio_flat-orange.disabled.checked {
	background-position: -110px 0;
}

.liste-jour .btn {
	width: 60px;
}

nav.onglets {
	display: flex;
	flex-direction: row;
	/* background: #fff; */
}

nav.onglets ul {
	display: flex;
	flex-direction: row;
}

.etat-presence-transports .pecs {
	display: flex;
	flex-wrap: wrap;
	min-width: 500px;
}

.etat-presence-transports li.chauffeur {
	color: #fff;
	background: var(--main-color-2);
	margin-right: 0.5rem;
	padding: 0.5rem;
	font-size: 0.75rem;
	margin-bottom: 0.5rem;
	border-radius: 0.25rem;
}

.transports-presence .date {
	width: 30px;
}

td.etat,
th.etat {
	width: 60px;
}

.rapport-liste .tr-utilisateur {
	display: none;
}

.dhx_cal_event.disabled {
	opacity: 0.7;
}

.tb-div li {
	background: #42bae2;
	margin-bottom: 5px;
	color: #fff;
	position: relative;
	transition: width 2s ease;
}

span.type {
	display: block;
	text-align: center;
	font-weight: bold;
	color: #fff;
	background: var(--main-color-1);
	padding: 2px;
}

.tb-notification .notification-lu {
	position: absolute;
	z-index: 5;
	bottom: 5px;
	width: 16px;
	right: 5px;
	height: 15px;
}

.tb-notification .content,
.tb-incident .content {
	padding: 5px;
}

.red_section {
	border: red 2px solid;
	border-width: 2px 0;
}

.dhx_scheduler_month .red_section .dhx_month_head {
	background-color: red;
	opacity: 0.25;
}

.dhx_scheduler_year .red_section .dhx_month_head {
	background-color: red;
	opacity: 0.25;
}

.dhx_scheduler_month .red_section,
.dhx_scheduler_year .red_section {
	opacity: 0.25;
}

.suspension-liste-circuit ul {
	display: flex;
	flex-wrap: wrap;
}

.suspension-liste-circuit li {
	padding: 0.5rem 0.5rem;
	margin-right: 0.5rem;
	margin-bottom: 0.5rem;
	background: #ccc;
	color: #fff;
	cursor: pointer;
	font-size: 0.75rem;
	border-radius: 0.25rem;
}

.suspension-liste-circuit li.selected {
	background: var(--main-color-2);
}

.month {
	font-size: 0.75rem;
	justify-self: center;
	height: 100%;
	padding: 0px 30px;
	width: 100%;
}

.calendrier {
	display: flex;
	flex-wrap: wrap;
	overflow: auto;
	justify-content: center;
	margin-top: 1rem;
}

.etat-presence-chauffeur-calendrier .calendrier.wrapped {
	grid-template-columns: 1fr;
}

.suspension-jour {
	position: absolute;
	left: 0;
	bottom: 0;
	background: #ccc;
	width: 15%;
}

.suspendre-semaine {
	display: inline-block;
	font-weight: bold;
	border-bottom: 1px solid #fff;
	margin: 2px;
}

.suspendre-semaine:hover {
	color: red;
	cursor: pointer;
	border-bottom: 1px solid;
}

.suspendre-mois {
	display: inline-block;
	border-bottom: 1px solid #fff;
	margin: 2px;
}

.suspendre-mois:hover {
	color: red;
	cursor: pointer;
	border-bottom: 1px solid;
}

.suspension-jour ul {
	overflow-y: auto;
	height: 350px;
	margin: 15px;
}

.suspension-jour li {
	background: #7dcc6a;
	margin-bottom: 5px;
	padding: 5px;
	color: #fff;
}

.multiple-selection {
	background: #fff;
	margin: 1rem;
	border-radius: 1rem;
}

.suspension-jour li.selected {
	background: #f97474;
}

.suspension-jour-content {
	height: calc(100vh - 335px);
	overflow-y: auto;
	font-size: 0.75rem;
}

.suspension-selection {
	flex-grow: 1;
}

.d.active {
	border: red 1px solid;
}

.d .select-day {
	position: absolute;
	bottom: 0;
	left: 0;
	display: none;
	z-index: 10;
}

.d:hover .select-day,
.d .select-day:checked {
	display: block;
}

.calendrier .d {
	cursor: pointer;
	position: relative;
	padding: 10px;
	min-width: 36px;
}

.d.suspended {
	background: #f97474;
}

.d.partially-suspended {
	background: orange;
}

.suspension-liste-chauffeur ul {
	display: flex;
	flex-wrap: wrap;
}

.suspension-liste-chauffeur li {
	padding: 0px 10px;
	margin-right: 10px;
	margin-bottom: 10px;
	background: #888;
	color: #fff;
}

.liste-circuits ul {
	display: flex;
	flex-wrap: wrap;
}

.liste-circuits ul.liste-chauffeur,
.liste-circuits ul.liste-client {
	flex-direction: column;
	font-size: 0.8em;
}

ul.liste-jours {
	display: flex;
	flex-wrap: wrap;
	min-height: calc(2rem + 2px);
	padding: 0.25rem;
	margin-right: 13rem;
}

ul.liste-jours .selected {
	background: var(--main-color-2);
}

ul.liste-jours li {
	background: #ccc;
	padding: 0.25rem;
	color: #fff;
	margin-right: 5px;
	font-size: 0.75rem;
	border-radius: 0.25rem;
	margin-bottom: .25rem;
	cursor: pointer;
	/* height: 1.65rem; */
	display: flex;
	line-height: 1rem;
	align-items: center;
}

.suspension-planning .calendrier {
	height: calc(100vh - 332px);
}

.calendrier {
	overflow-y: auto;
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(382px, 1fr));
	grid-gap: 1rem;
}

.btn.enregistrer-activite-semaine {
	right: 20px;
	position: absolute;
	top: 38px;
}

.completion .etat {
	color: #7dcc6a;
}

.completion li {
	position: relative;
}

.completion .etat.inactif {
	color: red;
}

.circuit-inactif {
	color: red;
}

.planing-table thead td {
	text-align: center;
}

#tab-circuits-actifs {
	height: 700px;
	overflow-x: auto;
}

#tab-circuits-inactifs {
	height: 700px;
	overflow-x: auto;
}

ul.liste-changements {
	padding: 15px;
	max-height: 300px;
	overflow-x: auto;
}

.liste-changements li {
	color: #fff;
	margin-bottom: 5px;
	padding: 5px;
}

.all-notification {
	position: absolute;
	top: 18px;
	z-index: 2;
	left: 16px;
}

.main-menu i {
	margin-right: 20px;
	margin-left: 8px;
	width: 18px;
	/* justify-self: center; */
	font-size: 1.2rem;
	padding-left: 0px;
}

.change-year {
	cursor: pointer;
	margin-bottom: 6px;
	vertical-align: middle;
}

.suspension-content {
	display: flex;
	background: var(--main-color-2);
	border-radius: 1rem;
}

.suspension-planning {
	flex-grow: 1;
	width: 50%;
	margin: 1rem;
}

.all-selected-circuit+label {
	display: none;
}

.all-selected-circuit {
	display: none;
}

.refresh-animated {
	margin-left: 5px;
}

@keyframes ld-cycle {

	0%,
	50%,
	to {
		animation-timing-function: cubic-bezier(.5, .5, .5, .5)
	}

	0% {
		-webkit-transform: rotate(0);
		transform: rotate(0)
	}

	50% {
		-webkit-transform: rotate(180deg);
		transform: rotate(180deg)
	}

	to {
		-webkit-transform: rotate(360deg);
		transform: rotate(360deg)
	}
}

.suspension-jour-content .flex .chauffeur ul {
	display: flex;
}

.suspension-jour-content .flex .chauffeur li {
	border: none;
	padding: 0.25rem;
	margin-left: 0.25rem
}

.suspension-jour-content .chauffeur table {
	margin: 5px;
	border-radius: 0.25rem;
	font-size: 0.75rem;
}

.suspension-jour-content li {
	border-radius: 0.25rem;
	padding: 0.25rem 0.5rem;
	display: flex;
	justify-content: center;
	align-items: center;
	color: #fff;
}

li.etat-chauffeur__CP {
	background: #f97474;
	padding: 4px 6px;
}

li.etat-chauffeur__P {
	background: var(--main-color-2);
}

li.etat-chauffeur__R {
	background: #ffa500;
}

li.etat-chauffeur__W {
	background: var(--main-color-1);
}

li.etat-chauffeur__AP {
	background: var(--main-color-3);
}

li.etat-chauffeur__AM {
	background: var(--main-color-3);
}


li.etat-chauffeur__CS {
	background: var(--main-color-3);
}

.etat-presence-chauffeur-resume {
	margin-top: 10px;
	position: relative;
}

.etat-presence-chauffeur-calendrier .d {
	color: #fff;
	width: calc(100%/8);
	height: 7rem;
	/* box-shadow: 13px -10px 13px 12px #eee; */
	position: relative;
	padding: 0;
	overflow: hidden;
}
.etat-presence-chauffeur-calendrier th {
	width: calc(100%/8);
}

.etat-presence-chauffeur-calendrier td {
	text-align: center;
	min-width: 36px;
	font-size: 16px;
	/* vertical-align: middle; */
}

td.etat-chauffeur:hover {
	opacity: 0.5;
	cursor: pointer;
}

td .etat-chauffeur {
	/* color: #fff; */
	/* background: transparent; */
}

td .etat-chauffeur[data-etat="3"] {
	background: var(--main-color-1)
}

td .etat-chauffeur[data-etat="5"] {
	background: orange
}

td .etat-chauffeur[data-etat="1"] {
	background-color: var(--main-color-2);
}

td .etat-chauffeur[data-etat="7"] {
	background: #f97474;
}

.side-panel {
	display: none;
	/* border: solid 2px var(--main-color-1); */
	padding: 0.5rem;
	position: relative;
	margin: 1rem;
	background: #fff;
	border-radius: 1rem;
}

.side-panel .container {
	/* width: 100%; */
	height: calc(100vh - 22rem);
	overflow: auto;
}

.side-panel .table {
	font-size: 0.75rem
}

.etat-chauffeur.selected {
	border: 2px solid red;
}

.flex .chauffeur td {
	padding: 2px 5px;
}

.etat-presence-chauffeur-calendrier {
	flex-grow: 1;
	width: 100%;
	margin: 1rem;
}

.etat-presence-chauffeur-calendrier .calendrier {
	grid-template-columns: repeat(auto-fill, minmax(40%, 1fr));
	height: calc(100vh - 350px);
}

.etat-presence-chauffeur-calendrier th {
	text-align: center;
	font-size: 1rem;
}

.etat-presence-chauffeur-calendrier .day {
	text-align: right;
	font-size: 0.625rem;
}

.next-month:hover,
.previous-month:hover {
	color: var(--main-color-1);
	cursor: pointer;
}

.page {
	padding: 0.15rem 0.5rem;
	background: #fff;
	color: var(--main-color-2);
	border: none;
	height: 1.2rem;
	line-height: 0.2rem;
	font-size: 0.75rem;
	width: 4rem;
	border: solid 1px var(--main-color-2);
	display: grid;
	align-items: center;
}

.pages .flex {
	justify-content: center;
}

.page.current-page {
	background: var(--main-color-2);
	color: #fff;
}

.typeahead,
.tt-query,
.tt-hint {
	border: 2px solid #ccc;
	outline: none;
}

.typeahead {
	background-color: #fff;
}

.typeahead:focus {
	border: 2px solid #0097cf;
}

.tt-query {
	-webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
	-moz-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
	box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
}

.tt-hint {
	color: #999;
}

.tt-menu {
	width: 422px;
	background-color: #fff;
	border: 1px solid #ccc;
	border: 1px solid rgba(0, 0, 0, 0.2);
	box-shadow: 0 5px 10px rgba(0, 0, 0, .2);
	-webkit-box-shadow: 0 5px 10px rgba(0, 0, 0, .2);
	-moz-box-shadow: 0 5px 10px rgba(0, 0, 0, .2);
}

.tt-suggestion {
	padding: 3px 20px;
	line-height: 24px;
}

.tt-suggestion:hover {
	cursor: pointer;
	color: #fff;
	background-color: #0097cf;
}

.tt-suggestion.tt-cursor {
	color: #fff;
	background-color: #0097cf;

}

.tt-suggestion p {
	margin: 0;
}

.tt-dataset {
	overflow-x: auto;
	max-height: 300px;
}

.dossier-utilisateur {
	/* display: grid; */
	/* grid-template-areas:
		"stats stats stats stats"
		"incidents incidents etablissements circuits"; */
	/* width: 100%; */
	/* grid-gap: 1rem; */
	/* margin-top: 10px; */
}

.dossier-utilisateur>div>div,
.dossier-utilisateur>div>ul {
	/* padding: 5px; */
}

.dossier-utilisateur-statistiques {
	grid-area: stats;
}

.dossier-utilisateur-statistiques-content {
	margin-top: 10px;
}

.dossier-utilisateur-position {
	grid-column-start: 4 span;
}

.client-etablissement {
	grid-area: etablissements;
}

.dossier-utilisateur-histo-incident {

	grid-area: incidents;

	flex-grow: 10;
}

.client-circuit {

	grid-area: circuits;
}

.suspension-liste-circuit ul {
	margin-top: 10px;
	max-height: 6rem;
	overflow: auto;
}

.liste-contact .flex-outer>li>label+* {
	flex: 1 0 160px;
}

.marker {
	transform: translate(-50%, calc(-100% - 10px));
	padding: 5px;
	background-color: #fff;
	box-shadow: 0 0 10px rgba(0, 0, 0, 0.3)
}

.marker::after {
	content: '';
	position: absolute;
	top: 100%;
	left: 50%;
	width: 0;
	height: 0;
	margin-left: -8px;
	border-left: 8px solid transparent;
	border-right: 8px solid transparent;
	border-top: 8px solid #fff;

}

li.chauffeur-etat {
	background: #7dcc6a;
	color: #fff;
}

li.chauffeur-kilometrage {
	background: orange;
	color: #fff;
}

li.heure-declare {
	background: var(--main-color-1);
	color: #fff;
}

li.heure-declare-auto {
	background: #cc6869;
	color: #fff;
}

.events li {
	padding: 0;
	border-radius: 0.25rem;
	margin-bottom: 0.25rem;
}

.events li:last-child {
	margin-bottom: 0;
}

.events ul {
	display: grid;
}

.etat-presence-chauffeur-content {
	display: flex;
	/* background: var(--main-color-2); */
	border-radius: 1rem;
}

.etat-presence-chauffeur-content .etat-presence-chauffeur-calendrier {
	border: solid var(--main-color-2);
	border-radius: 1rem;
	margin-right: 0rem;
	position: relative;
}

.side-panel.active {
	border: solid var(--main-color-2);
	display: block;
}

.temps-semaine {
	/* color: var(--main-color-2); */
	/* color: #fff; */
	padding: 0 0.2rem;
	font-size: 14px;
	/* border-radius: 0.25rem; */
	font-weight: 700;
	/* background: #4db6ac; */
	/* height: initial; */
	/* width: 52px; */
}

.num-semaine {
	font-weight: bold;
}

.form {
	width: 100%;
	margin: 1rem 0;
	position: relative;
}

.reponse-planning {
	display: none;
	width: 100%;
	border: red 2px solid;
	padding: 5px;
}

.reponse-planning-content .btn {
	margin-right: 10px;
}

.reponse-planning-content .btn:last-child {
	margin-right: 0;
}

.reponse-planning-content {
	text-align: center
}

.etat-presence-chauffeur-content .liste-circuits {
	max-height: calc(100vh - 309px);
	margin-bottom: 9px;
	overflow: auto;
}


.liste-circuits .table {
	margin-bottom: 0;
}

.form-footer .btn+.btn {
	margin-bottom: 0;
	margin-left: 5px;
}

.flex-inner li input[type=checkbox],
.flex-inner li input[type=radio] {
	margin-bottom: 7px;
}

.flex-inner li label,
.flex-inner li label {
	margin-bottom: 0px;
}

.flex-outer .form-footer {
	width: 100%;
}

.form-footer {
	display: flex;
	justify-content: flex-end;
	width: 80%;
	margin: auto;
}

.flex-outer+.flex-outer {
	margin-top: 20px;
}

.notifications {
	display: none;
}

.popup .tab-ponctuel .champs div {
	margin-right: 5px
}

.nouveau-transport-pointage {
	margin-bottom: 20px;
	margin-top: 20px;
}

.iradio_flat-green+label,
.iradio_flat-orange+label,
.iradio_flat-red+label {
	margin: 0px 1rem 0px 1rem;
	vertical-align: middle;
}

.form+.form {
	margin-top: 10px;
}

.etat-presence-circuits {
	display: flex;
	flex-direction: column;
	overflow: auto;
	margin: 0;
	padding: 0.5rem;
}

.etat-presence-circuits .circuit {
	background: var(--main-color-1);
	color: #fff;
	padding: 0.5rem 1rem;
	text-align: center;
	justify-content: center;
	margin-bottom: 0.5rem;
	font-size: 0.75rem;
	border-radius: 0.25rem;
}

.etat-presence-circuits .circuit.selected {
	background: var(--main-color-2);
}

.etat-presence-circuits .circuit:last-child {
	margin-bottom: 0
}

.etat-presence-rapport {
	display: grid;
	grid-template-columns: 200px 1fr;
	grid-column-gap: 1rem;
	margin-top: 1rem;
	overflow: auto;
	grid-template-rows: calc(100vh - 14rem);
}

.imprimer-rapport-presence {
	margin: 10px;
}


.planning-liste {
	height: calc(100vh - 170px);
	overflow: auto;
}

.modal-footer .btn {
	min-width: 150px;
}

.liste-transports-par-date .alert-danger {
	padding: 5px;
}

.jour .jour-lieu-nom {
	font-weight: bold;
	color: var(--main-color-1);
}

.jour.imported {
	border: lime solid 2px;
}

.jour.selected {
	border: red solid 2px;
}

.jour label {
	margin-bottom: 0;
}

*/ .liste-periode {
	overflow: auto;
	height: calc(100vh - 270px);
}

.edition-jour:hover {
	background: var(--main-color-1);
	color: #fff;
}

.supprimer-jour:hover {
	background: #d42123;
	color: #fff;
}

.edition-jour {
	padding: 5px;
}

.supprimer-jour {
	padding: 5px;
}

.jour-options {
	display: none;
	z-index: 5;
	background: #fff;
	position: absolute;
	right: 0;
	top: 0;
}

.jour:hover .jour-options {
	display: block;
}

.form-edition-jour {
	display: none;
}

select[name=type-detail] {
	width: 100%;
	margin-bottom: 10px;
}

.liste-utilisateur-modification {
	background: #fff;
}

.input.input-positioned {
	background: #fff;
}

.heure-realise {
	background: #64b5f6;
	background: var(--main-color-1);
	border-radius: 0.25rem;
	padding: 0.25rem 0.5rem;
	height: 2rem;
	margin-top: 0.25rem;
}

.etat-chauffeur {
	background: #a5a5a59c;
	color: #fff;
	padding: 1px 6px;
	/* border-radius: 0.25rem; */
	/* margin-left: 0.25rem; */
	position: absolute;
	top: 4px;
	left: 4px;
	border-radius: 0.25rem;
	font-weight: 800;
	font-size: 12px;
	display: none;
}

.heure-realisee {
	color: #1abc9c;
}

.close-tooltip {
	color: #fff;
	padding: 0.5rem;
	position: absolute;
	top: 0;
	left: 0;
	cursor: pointer;
}

.close-tooltip:hover {
	color: red;
}

.coordonnees {
	display: flex;
	justify-content: space-between;
}

.modal .flex-outer .datepicker {
	text-align: left;
}

.adresse .title {
	font-size: 0.875rem;
	font-weight: bold;
}

.liste-transport-heure {
	color: #fff;
	background: #379799;
	padding: 0.25rem 0.25rem;
	text-align: center;
	line-height: 0.8rem;
}

.contraintes-champs {
	display: flex;
	justify-content: space-around;
	margin-bottom: 15px;
}

.duration-distance {
	margin-bottom: 1rem;
	padding: 0.25rem 0.5rem;
	background: var(--main-color-4);
	color: #fff;
	border-radius: 0.25rem;
}

.waiting-time {
	margin-bottom: 1rem;
	border: 1px solid #fff;
	padding: 0.25rem 0.5rem;
	background: var(--main-color-5);
	color: #fff;
}

.table-transports .completion-adresse .nom {
	font-weight: bold;
}

.dhx_year_box {
	height: initial !important;
}

form input[disabled] {
	background: #ebebe4;
}

.circuit-tools .fas {
	position: absolute;
	left: 17px;
	top: 12px;
}

.dhx_cal_event.realise .dhx_body {
	border-left: red 2px solid;
	border-bottom: red 2px solid;
	border-right: red 2px solid;
}

.dhx_cal_event.realise .dhx_title {
	border-left: red 2px solid;
	border-top: red 2px solid;
	border-right: red 2px solid;
}

.dhx_cal_event.doublon .dhx_body {
	border-left: #000 2px solid;
	border-bottom: #000 2px solid;
	border-right: #000 2px solid;
}

.dhx_cal_event.dhx_cal_select_menu.doublon .dhx_body {
	border-left: #000 2px solid;
	border-bottom: #000 2px solid;
	border-right: none;
}

.dhx_cal_event .dhx_footer {
	background: inherit !important;
}

.dhx_cal_event.doublon .dhx_title {
	border-left: #000 2px solid;
	border-top: #000 2px solid;
	border-right: #000 2px solid;
}

.dhx_cal_event.same-periode .dhx_body {
	border-left: var(--main-color-3) 4px solid;
	border-bottom: var(--main-color-3) 4px solid;
	border-right: var(--main-color-3) 4px solid;
}

.dhx_cal_event.same-periode .dhx_title {
	border-left: var(--main-color-3) 4px solid;
	border-top: var(--main-color-3) 4px solid;
	border-right: var(--main-color-3) 4px solid;
}

.dhx_cal_event.doublon .dhx_body {
	border-left: #000 2px solid;
	border-bottom: #000 2px solid;
	border-right: #000 2px solid;
}

.dhx_cal_event.realise .dhx_title {
	background: red;
}

.dhx_cal_event.circuit-disabled .dhx_title {
	background: #fff !important;
}

.dhx_cal_event.circuit-disabled .dhx_body {
	background: linear-gradient(#fff 20%, #ccc)
}

.dhx_cal_event_clear.dhx_cal_event_line_start.dhx_cal_event_line_end.same-periode {
	border-width: 6px 0px 0px 0px;
	margin-bottom: 0px;
	border-style: solid;
	border-color: var(--main-color-3);
}

.dhx_cal_event.disabled .dhx_title {
	opacity: 0.5;
}

.dhx_cal_event.disabled .dhx_body {
	opacity: 0.5;
}

.dhx_cal_event.absent .dhx_title::before {
	font-family: "Font Awesome 5 Free";
	content: "\f506  ";
	font-weight: 900;
	font-size: 12px;
	color: #fff;
}


.dhx_cal_event_line_start.circuit-disabled {
	background: linear-gradient(#fff 20%, #ccc) !important;
}

.dhx_cal_header .dhx_scale_bar a,
td .dhx_month_head a {
	text-decoration: none;
	color: inherit;
}

.disponibilite-tools {
	display: flex;
	justify-content: space-around;
	flex-wrap: wrap;
	align-items: flex-end;
	background: #fff;
	padding: 10px;
}

.disponibilite-tools .fa-wrench {
	position: absolute;
	left: 17px;
	top: 12px;
}

.disponibilite-tools:hover {
	right: 0;
	transition: 0.5s 0.2s right;
	opacity: 1;
}

.client-fauteuil {
	margin-top: 25px;
}

.export-contraintes {
	display: flex;
	justify-content: space-around;
	margin-bottom: 10px;
}

.planing-table .impression-jour {
	display: block;
	margin: auto;
	margin-bottom: 1rem;
}

.tab-ponctuel {
	position: relative;
}

.actions {
	display: flex;
	justify-content: flex-end;
}

.horaire-commentaire {
	background: var(--main-color-4);
	color: #000;
	padding: 0.5rem 1rem;
	font-size: 0.85em;
	border-radius: 4px;
	font-weight: 700;
	margin-bottom: 5px;
	display: flex;
}

.horaire-commentaire.user:before {
	content: "\f007";
	font-family: "Font Awesome 5 Free";
	margin-right: 0.5rem;
}

.tooltip-transport .id-client {
	position: absolute;
	top: 16px;
	right: 10px;
	font-style: italic;
	/* padding: 0px 7px; */
	color: var(--main-color-2);
	border-radius: 7px;
}

.tooltip-transport .id-transport {
	position: absolute;
	top: 5px;
	right: 10px;
	font-style: italic;
	/* padding: 0px 7px; */
	color: var(--main-color-4);
	border-radius: 7px;
}

.tooltip-map {
	padding: 5px 0px;
	width: 300px;
	position: relative;
	display: grid;
}

.tooltip-map .heure {
	display: grid;
	align-items: center;
	justify-items: center;
	color: #fff;
	background: var(--main-color-5);
	width: 100%;
}

.tooltip-map .liste-client {
	color: #fff;
	font-size: 0.8rem;
	display: flex;
	flex-wrap: wrap;
}

.tooltip-map .liste-client li {
	padding: .5em;
	line-height: 1rem;
	background-color: var(--main-color-1);
	margin-bottom: 0.25rem;
	margin-right: 0.25rem;
	border-radius: 0.25rem;
}

.tooltip-map .liste-client li.absent {
	background-color: var(--main-color-5);
}



.tooltip-map .lieu {
	margin-top: 0.5rem;
	font-style: italic;
}


.tooltip-map .nom-lieu {
	font-weight: bold;
	font-style: normal;

}

.tooltip-transport .heure-reelle {
	margin-right: 10px;
	color: #76e4a7;
	display: block;
	font-weight: bold;
}

.switch span {
	position: absolute;
	top: -18px;
}

.label-switch {
	position: absolute;
	bottom: 10px;
}

.label-switch+.switch {
	margin-top: 15px;
}

.circuit-tools.circuit-doublon {
	top: 90px;
	display: none;
}

.modifier-calendrier-chauffeur {
	margin-top: 25px;
}


.navigation-chauffeur {
	display: flex;
}

.current-chauffeur {
	margin: 0px 1rem 0px 1rem;
	display: block;
	width: 500px;
	text-align: center;
	font-size: 1.2em;
	font-weight: 900;
	background: var(--main-color-2);
	padding: 0 1rem 0 1rem;
	color: #fff;
	border-radius: 0.25rem;
}

.change-chauffeur {
	display: flex;
	padding: 0.25rem;
	align-items: center;
	cursor: pointer;
	color: var(--main-color-2);
	border: var(--main-color-2) solid;
	transition: 0.5s all;
	width: 50px;
	display: flex;
	justify-content: center;
	border-radius: 0.25rem;
}

.change-chauffeur:hover {
	color: #fff;
	background: transparent;
	transition: 0.5s all;
	background: var(--main-color-2);
}

.current-chauffeur.waiting::after {
	content: "Chargement";
	background: red;
	color: #fff;
	padding: 2px 10px;
	margin-left: 15px;
	line-height: 18px;
}

.all-etat-presence-chauffeur .annee-chauffeur-heures-realisees {
	margin-bottom: 0;
}

.all-etat-presence-chauffeur.tablesorter .annee-chauffeur-heures-realisees td,
.all-etat-presence-chauffeur.tablesorter .annee-chauffeur-heures-realisees th {
	padding: 0.15rem;
	font-size: 0.8rem;
	max-height: 2rem;
}

.table>thead>tr.sorting>th {
	vertical-align: middle;
	text-align: center;
	min-height: 60px;
	position: relative;
}

.sorting i.sorting-asc {
	position: absolute;
	right: 5px;
}

.sorting i.sorting-desc {
	position: absolute;
	right: 5px;
}

.sorting i.sorting-asc.selected,
.sorting i.sorting-desc.selected {
	color: #2bd677;
}


.sorting i.sorting-asc:hover,
.sorting i.sorting-desc:hover {
	cursor: pointer;
}

th.sortable .title {
	padding: 10px;
}

a.dynatable-sort-header {
	color: #333;
}

.table.all-etat-presence-chauffeur tbody td {
	vertical-align: middle;
	text-align: center;
}

.lien .ville {
	padding: 0px 5px;
	background: #aaa;
}

select.jours {
	display: none;
}

.fiche .etat {
	margin-left: 16px;
}

.fiche .etat.fa-check {
	color: #079992;
}

.fiche .etat.fa-times {
	color: red;
}

.fiche .details {
	margin-left: 10px;
	cursor: pointer;
}

.table.all-etat-presence-chauffeur tbody td {
	vertical-align: middle;
	text-align: center;
}

.lien .ville {
	padding: 0px 0.4rem;
	background: #fff;
	border-radius: 0.25rem;
	color: #666;
	white-space: nowrap;
}

select.jours {
	display: none;
}

.fiche .etat {
	margin-left: 16px;
}

.fiche .etat.fa-check {
	color: #93e279;
}

.fiche .etat.fa-times {
	color: red;
}

.fiche .details {
	margin-left: 10px;
	cursor: pointer;
	vertical-align: middle;
	color: #fff;
	position: absolute;
	right: 0.5rem;
	top: 0.5rem;
}

th .table-champ {
	display: flex;
}

td>a,
td>a:hover {
	color: #000;
}

.form .etat {
	display: flex;
	justify-content: space-around;
	border: 1px solid #ccc;
}

.form .etat>div {
	flex-grow: 1;
	padding: 15px;
	text-align: center;
}

.form .etat label {
	margin-left: 20px;
}

.dernier-kilometrage {
	font-weight: bold;
}

.dernier-date {
	font-weight: bold;
}

.modifier-heure-prevue {
	flex-grow: 1;
	margin-top: 10px;
}

.save-heure {
	flex-grow: 1;
	margin-top: 1rem;
}

.compte-rendu-utilisateurs {
	margin-top: 15px;
}

select.select-time {
	width: 80px;
	margin: 0 0.5rem;
}

.sms-chauffeur {
	padding: 6px 20px;
}

.sms-chauffeur .icheckbox_flat-green {
	margin-right: 10px;
}

ul.liste-coupure {
	display: flex;
	margin-left: 15px;
	flex-wrap: wrap;
	margin-top: 1rem;
}

ul.liste-coupure li {
	padding: 5px 10px;
	background: var(--main-color-2);
	border-radius: 0.25rem;
	color: #fff;
	width: 200px;
	position: relative;
	display: flex;
	justify-content: space-between;
}

.remove-coupure {
	display: flex;
	align-items: center;
}

#tab-etat-presence .all-selected-jour {
	display: none;
}

.vehicules-disposition {
	display: flex;
	justify-content: space-around;
	flex-wrap: wrap;
}

#place-10 {
	left: 300px;
	top: 80px;
}

#place-11 {
	left: 300px;
	top: 160px;
}

#place-12 {
	left: 200px;
	top: 40px;
}

#place-13 {
	left: 200px;
	top: 120px;
}

#place-14 {
	left: 200px;
	top: 200px;
}

#place-20 {
	left: 340px;
	top: 60px;
}

#place-21 {
	left: 340px;
	top: 120px;
}

#place-22 {
	left: 340px;
	top: 180px;
}

#place-23 {
	left: 240px;
	top: 60px;
}

#place-24 {
	left: 240px;
	top: 120px;
}

#place-25 {
	left: 240px;
	top: 180px;
}

#place-26 {
	left: 140px;
	top: 60px;
}

#place-27 {
	left: 140px;
	top: 120px;
}

#place-28 {
	left: 140px;
	top: 180px;
}

.places-5,
.places-5 img {
	width: 600px;
}

.client-header {
	display: grid;
	padding: 7px 0;
	grid-template-columns: 1fr 1fr;
}

.places-9,
.places-9 img {
	width: 600px;
}

.dernier-kilometrage-content {
	background: #f6ad3b;
	color: #fff;
	padding: 5px;
	border-radius: .25rem;
}

.client-actions {
	display: grid;
	grid-template-columns: 9fr 1fr;
	grid-template-rows: auto;
	grid-column-gap: 20px;
}

.input-search {
	width: 100%;
}

.input-search input {
	width: 100%;
}

.demande-liste-form {
	display: flex;
	flex-wrap: wrap;
}

.demande-liste-form .demande-form {
	flex-grow: 1;
}

.formulaire-demande .modified {
	border: red 1px solid !important;
}

.tb {
	display: grid;
	grid-gap: 20px;
	grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
	font-size: 0.8125rem;
}

.tb .content {
	height: 288px;
	overflow-x: auto;
	font-size: 0.75rem;
}

.tb .content.collapse {
	overflow-y: auto;
}


.tb .table {
	margin-bottom: 0;
	border-right: 0px;
	border-left: 0px;
	margin-top: 0;
}

input.responsive-recherche {
	width: 100%;
	margin-bottom: 50px;
}

input.responsive-recherche-adresse {
	width: 100%;
	margin-bottom: 50px;
}

.adresse-container .adresse {
	padding: 5px;
	color: #000;
}

.completion-adresse.liste-adresse-completion {
	position: relative;
}

.completion-adresse>ul {
	overflow-y: auto;
	max-height: 70vh;
}


.completion-adresse li li:hover .nom {
	background: var(--main-color-1);
	transition: 1s background;
}

.completion-adresse>li {
	padding: 4px 10px;
}

.completion-adresse li ul {
	color: #000;
	background: #fff;
	border-width: 1px 0px;
	border-color: #ccc;
}

.panel-vehicule {
	display: grid;
	grid-template-columns: 1fr 2fr;
	grid-gap: 10px;
}

.panel-vehicule>div>div {
	padding: 15px;
}

.auto-refresh {
	padding: 0.25rem;
	position: relative;
}

.refresh {
	position: absolute;
	right: 0.650rem;
	top: 0.4375rem;
}

.alerte-sms {
	padding: 1rem;
	z-index: 5;
}

.alerte-sms .sms-input {
	margin-right: 10px;
}

.navigation-bloc {
	justify-content: center;
	display: flex;
	margin: 1rem 0 1rem 0;
}

p.cgu-body {
	text-align: justify;
	text-indent: 4rem;
	width: 95%;
	margin: 2rem auto;
	padding: 1rem;
}

.conges {
	display: grid;
	grid-template-columns: 1fr 1fr 1fr 1fr;
	grid-column-gap: 1rem;
	margin-top: 1rem;
	margin-bottom: 1rem;
}

.conge-en-cours {
	background: var(--main-color-1);
	border-radius: 0.25rem;
}

.conge-pris {
	background: orange;
	border-radius: 0.25rem;
}

.conge-solde {
	background: #2bd677;
	border-radius: 0.25rem;
}

.conges .content {
	margin: auto;
	text-align: center;
	color: #fff;
	padding: 5px;
}

.conge-acquis {
	background: #e91e63;
	border-radius: 0.25rem;
}

.notes-chauffeur li {
	margin-bottom: 0.5rem;
	position: relative;
	background: inherit;
	border: 2px solid var(--main-color-1);
	color: #333;
	border-radius: 0.25rem;
	padding: 0.5rem;
}

.mark_as_read {
	position: absolute;
	right: 0.5rem;
	font-size: 0.8rem;
	bottom: 0.5rem;
}

.note-content {
	margin-right: 10rem;
	border-radius: 0.25rem;
	padding: 0.25rem;
}

.note-liste-chauffeur {
	max-height: 500px;
	overflow: auto;
}

th .btn-group.js-filter {
	width: 100%;
	display: flex;
}

td .btn-group .btn,
th .btn-group .btn {
	flex-grow: 1;
	font-size: 0.75rem;
	display: flex;
	align-items: center;
	height: 1.75rem;
}

.btn-group .selected {
	margin-left: 1px;
	opacity: 1;
}

.table-champ .reset {
	position: absolute;
	right: 0.5rem;
	top: 0.5rem;
}

.table-champ {
	position: relative;
}

.results-stats {
	font-size: 0.8rem;
	position: absolute;
	right: 0.5rem;
}

td.header-result {
	position: relative;
}

.block-horaire .affectation {
	display: inline-block;
	background: #64b5f6;
	background: var(--main-color-1);
	padding: 0.15rem 0.25rem;
	height: auto;
	font-style: normal;
	border-radius: 0.25rem;
	color: #fff;
	text-align: center;
	width: 40px;
	font-size: 0.75rem;
}

.navigation-date .btn {
	opacity: 1;
	color: #fff;
	padding: 1.5rem;
	display: flex;
	justify-content: center;
	align-items: center;
}

input.current-date.datepicker {
	width: initial;
	color: #fff;
}

input.current-date.datepicker:hover {
	color: #fff;
}

input.current-date.datepicker:focus {
	background: var(--main-color-1);
}

.liste-contrats .contrat {
	display: flex;
}

.contrat .card {
	flex: 2 0 150px;
}

.liste-avenants {
	flex: 8;
}

.pac-logo:after {
	display: none;
}

ul.liste-localisation {
	height: calc(100vh - 20rem);
	overflow: auto;
	/* padding: 1rem; */
	background: #fff;
}

.liste-contact-details {
	margin-top: 1.5rem;
	padding: 0.5rem;
	background: #fff;
}

.liste-utilisateur-details {
	margin-top: 1.6rem;
	background: #fff;
}

.navigation-bloc {
	justify-content: center;
	display: flex;
	margin: 1rem 0 1rem 0;
	width: 100%;
}

.bloc-trajet {
	display: grid;
	grid-column-gap: 1rem;
}

ul.liste-etablissements {
	padding: 0.25rem 0.25rem;
	max-height: 650px;
	overflow: auto;
}

ul.liste-etablissements>li {
	margin-bottom: 1rem;
}


li .details-localisation:hover {
	background: #2BD677;
}

ul.liste-etablissement .etablissement-nom {
	background: #2BD677;
	padding: 0.25rem;
}

ul.liste-etablissement .liste-client {
	font-size: 0.75rem;
	padding: 0.25rem;
}

ul.liste-etablissement .liste-client li {
	background: #00c9ff;
	margin-bottom: 0.25rem;
	padding: 0.25rem;
}

ul.liste-etablissement .liste-client li:last-child {
	margin-bottom: 0;
}

.details-localisation {
	padding: 0.25rem 0.5rem;
	margin-bottom: 0.25rem;
	background: var(--main-color-1);
	border-radius: 10px;

}

.horaires-etablissement {
	column-gap: 1rem;
}


ul.liste-etablissement .liste-client li.hover {
	background: #F97474;
}

.panel-trajet td input {
	width: 50px;
	font-size: 0.9rem;
}

canvas.circle {
	cursor: pointer;
}

canvas.circle.selected {
	border: red 2px solid;
	border-radius: 50%;
	transform: translate(-2px, -2px);
}


.horaires td {
	padding: 0.5rem;
}

.horaires th {
	padding: 0.5rem;
	text-align: center;
}

.panel-trajet {
	font-size: 0.75rem;
}

td.coupure {
	text-align: center;
	font-size: 1.2em;
}

.resume-trajet {
	display: flex;
	justify-content: space-between;
}

.liste-trajets .selected {
	background: #7b7b7b;
}

#tab-agenda tbody td {
	padding: 0;
}

.agenda-jour {
	position: relative;
}

.agenda-jour .actions {
	position: absolute;
	top: 0.5rem;
	right: 0.5rem;
	display: flex;
	justify-content: space-between;
	width: 2rem;
}

.actions .update-jour:hover {
	color: var(--main-color-1);
}

.actions .delete-jour:hover {
	color: red;
}

.agenda-jour .content {
	display: none;
	padding: 0.15rem;
	margin-top: 1.5rem;
	max-width: 260px;
	font-size: 0.75rem;
	line-height: 1rem;
}

.completion-manuel {
	position: absolute;
	right: 0;
	left: 0;
	z-index: 10;
	overflow-y: auto;
	color: #000;
	text-align: left;
	background: #fff;
	border-width: 1px 1px;
	border-style: solid;
	border-color: #ccc;
	border-radius: 5px;
	margin-top: 5px;
}

.completion-manuel>ul {
	overflow-y: auto;
	max-height: 300px;
}

.completion-manuel li:hover,
.completion-manuel li.selected {
	color: #fff;
	background: var(--main-color-1);
}

.completion-manuel li li:hover {
	color: #fff;
	background: #2bd677;
}

.completion-manuel li {
	padding: 4px 10px;
}

.completion-manuel li ul {
	padding: 5px;
	color: #000;
	background: #fff;
	border-width: 1px 0px;
	border-style: solid;
	border-color: #ccc;
}

.liste-selected-users li {
	background: var(--main-color-2);
	color: #fff;
	border-radius: 0.25rem;
}

.liste-selected-users {
	display: flex;
	margin: 1rem 0;
	flex-wrap: wrap;
	padding: 0.5rem;
	border-radius: 0.25rem;
}

.liste-selected-users li.fauteuil {
	background: var(--main-color-2);
	color: #fff;
	padding: 0.2rem 1rem;
	margin: 0.2rem;
}

.adresse-container.error {
	background: #c2185b;
}

.adresse-container.error .nom {
	background-color: #f97474;
}

.liste-trajets {
	max-height: 650px;
	overflow-x: auto;
	font-size: 1.0rem;
}

.liste-trajets td,
.liste-trajets th {
	padding: 0.25rem;
}

.completion-manuel .refresh-user {
	display: none;
}

.liste-selected-users .refresh-user {
	margin-left: 1rem;
	margin-top: 3px;
}

.agenda-jour .etablissement {
	background: var(--main-color-1);
	padding: 0.5rem;
	color: #fff;
	border-radius: 0.25rem;
	margin-bottom: 0.5rem;
}

.agenda-jour .lieu {
	background: var(--main-color-2);
	padding: 0.5rem;
	color: #fff;
	border-radius: 0.25rem;
	margin-bottom: 0.5rem;
}


.agenda-jour .circuit {
	background: #f0ad4d;
	padding: 0.5rem;
	color: #fff;
	margin-bottom: 0.5rem;
	border-radius: 0.25rem;
}

.agenda-jour .heure {
	background: #d42123;
	padding: 0.5rem;
	color: #fff;
	border-radius: 0.25rem;
}

.panel-trajet td {
	padding: 0.25rem;
	vertical-align: middle;
	text-align: center;
}

.panel-trajet .adresse-container {
	border: none;
}

.panel-trajet td {
	background: #fff;
}

.bloc-hide-points {
	margin: 0 0;
	padding: 0.6rem 0 0.4rem 0.5rem;
	border-top: none;
	border-radius: 0.25rem;
}

.liste-trajets table {
	margin-bottom: 0;
}

.total-trajet {
	font-size: 0.80rem;
}

.total-trajet table {
	margin-bottom: 0;
}

.panel-trajet table {
	margin-bottom: 0;
}

.week-user table {
	margin-bottom: 0;
}

.liste-trajets .lien {
	color: #fff;
}

.repartition {
	border: 1px solid;
	height: 40px;
	position: relative;
	width: 1130px;
}

.bloc-transport {
	height: 38px;
	background: red;
	position: absolute;
	border-width: 0 1px 0 1px;
	border-style: solid;
}

.details-transport-repartition {
	position: fixed;
	border: solid 1px;
	background: #fff;
	padding: 1rem;
	display: none;
}

tr.cali-import {
	display: none;
}

.liste-transports-cali {
	height: 79vh;
	overflow: auto;
	margin-bottom: 1rem;
	font-size: 0.8rem;
}

.liste-transports-cali tbody td.selected {
	background: #ccc;
}

.liste-transports-cali tbody tr:hover td.selected {
	background: #ccc;
}

.liste-transports-cali .cancel td {
	background: #f48fb1;
}

.liste-transports-cali .transport .lieu-debut,
.liste-transports-cali .transport .lieu-fin {
	background: #fff;
}

.table .form-control {
	height: 1.75rem;
	padding: 0.5rem 0.5rem;
	font-size: 0.75rem;
}

.table select.form-control:not([size]):not([multiple]) {
	height: 1.75rem;
	padding: 0.25rem 0.5rem;
	font-size: 0.75rem;
}

.liste-transports-cali input.form-control {
	width: 9rem;
}

ul.info-dev.list-group {
	position: fixed;
	bottom: 0;
	right: 0;
	z-index: 100;
}

.completion .ville {
	background: #fe0008;
	padding: 0.2rem;
	color: #fff;
}

.transport .last .ville {
	color: #fff;
	font-size: 0.8rem;
}

.completion .details-chauffeur {
	padding: 0.5rem;
}

.tooltip-transport .date {
	text-align: center;
}

.form-inline .form-group {
	margin-right: 0.5rem;
}

.form-inline .form-group label {
	margin-right: 0.5rem;
}

.form-inline button {
	margin: 0 0.2rem;
}

.description-localisation {
	padding: 0.5rem;
}

.clone {
	display: none;
}

.localisation-modification {
	display: none;
	margin: 1rem;
}

.btn.nouveau-localisation {
	margin-bottom: 1rem;
}

.modal-header h2 {
	display: block;
	width: 100%;
	border-radius: 0.25rem;
}

.inline-grid {
	display: inline-grid;
	grid-gap: 0.25rem;
	list-style-type: none;
}

.liste-transports-cali input.form-control.heure {
	width: 3.25rem
}

.liste-transports-cali input.form-control.heure.danger {
	background: #e91e63;
}

.form-flex .form-group label {
	margin-bottom: 0;
}

.creation-jour {
	margin-bottom: 1rem;
	border-radius: 0.25rem;
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
	grid-column-gap: 1rem;
	grid-row-gap: 0.5rem;
	flex: 1;
	margin-top: 1rem;
}

.periode .heure {
	margin-bottom: 0.25rem;
}

.liste-jour-pair,
.liste-jour-pair {
	padding: 1rem 0;
}

input.double-semaine+label {
	margin-left: 1rem;
}

.icheckbox_flat-green+label {
	margin-left: 0.5rem;
}

#recherche-rapide {
	width: 50%;
	position: fixed;
	top: 5vh;
	left: 25vw;
	display: none;
}

.adresse-container .nom {
	color: #fff;
	background: #4db6ac;
	background: var(--main-color-2);
	border-radius: 0.25rem;
	padding: .25rem 1rem;
	font-size: 0.8em;
	font-weight: 900;
}

form.form-creation-periodique {
	display: flex;
}

.liste-transports .table {
	margin-bottom: 0;
}

.tooltip-transport .transport-affectation {
	color: #fff;
	background: var(--main-color-1);
	padding: 0 0.25rem;
	display: inline-block;
	margin-left: 0.25rem;
	border-radius: 0.25rem;
}

.input-group.search-circuit {
	display: flex;
	justify-content: flex-end;
}

.form-group.navigation-circuit.btn-group .btn {
	border: none;
}

.circuit-header {
	display: flex;
	justify-content: flex-end;
	width: auto;
}

.navigation-circuit.btn-group {
	margin-right: 2rem;
}

.liste-transports-cali .adresse {
	font-size: 0.75rem;
}

.form-group.navigation-circuit.btn-group .btn {
	border: none;
}

.circuit-header {
	display: flex;
	justify-content: flex-end;
	width: auto;
}

.navigation-circuit.btn-group {
	margin-right: 1rem;
	margin-left: 1rem;
}

.liste-transports-cali .adresse {
	font-size: 0.75rem;
}

.liste-transports-cali li:hover .adresse {
	color: #000;
}

.details-meta {
	background: var(--main-color-1);
	display: flex;
	justify-content: space-around;
	color: #fff;
	cursor: pointer;
}

.details-meta .created_by {
	font-weight: 900;
}

.iradio_flat-red,
.iradio_flat-green,
.iradio_flat-orange {
	transform: translateX(0.25rem);
}

.horaire-header {
	display: flex;
	align-items: flex-start;
	margin-bottom: 1rem;
}

.liste-comportements .content {
	margin-right: 1.5rem;
}

.etat-presence-chauffeur-calendrier .wrapped .month {
	width: 900px;
}

.d .details {
	display: none;
	margin: auto;
	font-size: 12px;
	/* grid-gap: 0.25rem; */
	margin-top: 0px;
	font-weight: 600;
	overflow: hidden;
	/* border-top: 1px solid #bbb8b8; */
	flex-direction: column;
	background: #4db6ac33;
	border-radius: 0.5rem;
	/* min-height: 50px; */
}

.d .type {
	grid-column: 1 / span 2;
}

.d .heure-declare {
	background: var(--main-color-2);
	/* display: none; */
}

.d .km-declare {
	background: orange;
	display: none;
}

.d .km-chauffeur {
	color: var(--main-color-1);
	/* position: absolute; */
	/* position: absolute; */
	padding-bottom: 0;
	padding-right: 0;
	/* padding: 0 5px; */
}

.d .temps-chauffeur {
	color: #00756a;
	/* padding-left: 10px; */
	padding-top: 0px;
	font-size: 20px;
	font-weight: bold;
	text-align: center;
}

.day {
	color: #000;
	font-size: 0.625rem;
}

.table.liste-activite-chauffeur {
	font-size: 0.75rem;
}

.semaine-date .semaine {
	flex: 8;
	margin-right: 0.3rem;
}

.semaine-date .annee {
	flex: 2;
}

span.nb_transport {
	margin-left: 0.5rem;
	border: #fff 1px solid;
	padding: 0 0.1rem;
	background: #fff;
	color: #000;
	height: 1rem;
}

.month .table {
	margin-bottom: 0;
	height: 100%;
}

.month .month-calendar {
	margin-bottom: 0;
	height: initial;
}

.month .month-calendar th{
	font-size: 1.5rem;
}

div#tab-etat-presence .calendrier {
	max-height: 100%;
	overflow-y: auto;
}

.dhx_cal_event.diff .dhx_body {
	border: #4bff05 1px solid;
	border-top: none;
	color: #fff !important;
}

.dhx_cal_event.diff .dhx_title {
	border: #4bff05 1px solid;
	border-bottom: none;
	color: #fff !important;
}

.rapport-kilometrage td,
.rapport-kilometrage th {
	font-size: 0.80rem;
	padding: 0.25rem 0.5rem;
}

.rapport-kilometrage th.nom {
	width: 120px;
}

.liste-rapport-vehicule>tbody td {
	text-align: center;
	vertical-align: middle;
}

.liste-rapport-vehicule td td,
.liste-rapport-vehicule td th {
	font-size: 0.75rem;
	padding: 0.25rem 0.5rem;
}

.paginator {
	display: flex;
	justify-content: space-between;
	margin: 0.5rem;
}

.paginator .pages {
	display: grid;
	grid-template-columns: repeat(14, 1fr);
	column-gap: 0.5rem;
}

.incident-tb {
	display: grid;
	grid-template-columns: 120px 1fr;
	margin-bottom: 1rem;
	padding: 0.5rem;
}

.incident-title {
	grid-row: 2 span;
	border: #ff0000 2px solid;
	display: flex;
	justify-content: center;
	text-align: center;
	align-items: center;
	background-color: #f97474;
	color: #fff;
	font-size: 1.2em;
	transition: 0.5s all;
	border-radius: 0.25rem;
}

.incident-content {
	padding: 0.5rem;
}

.incident-footer {
	padding: 0.5rem;
	display: grid;
	justify-content: end;
	grid-column-gap: 1rem;
	grid-template-columns: 1fr 1fr;
}

.tb-incident .content {
	max-height: 300px;
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(350px, 1fr));
}

.incident-tb:hover {
	background: rgba(79, 84, 92, 0.15);
	border-radius: 0.25rem;
}

.btn-success:hover,
.btn-success:focus {
	background: #00796b;
}

.btn-success:not(:disabled):not(.disabled).active,
.btn-success:not(:disabled):not(.disabled):active,
.show>.btn-success.dropdown-toggle {
	background: #00796b;
}

.btn-info:hover,
.btn-info:focus {
	background: #0288d1;
}

.btn-danger:not(:disabled):not(.disabled).active,
.btn-danger:not(:disabled):not(.disabled):active,
.show>.btn-danger.dropdown-toggle {
	background: #ad1457;
}

.incident-content a {
	color: initial;
}

form a,
form a:hover {
	color: #000;
}

.calendrier-material {
	/* display: grid; */
	padding: 1rem;
	background: #FFF;
	border-radius: 1rem;
	/* flex-shrink: 0; */
	position: relative;
}

.calendrier-material .d,
.calendrier-material .table th {
	color: #000;
	border: 2px #fff solid;
	text-align: center;
}

.calendrier-material td {
	border: none;
}

.calendrier-material .d {
	text-align: center;
}

.calendrier-material .day {
	color: #000;
	font-size: 16px;
	border-radius: 0.25rem;
	align-content: flex-end;
	display: flex;
	justify-content: flex-end;
	/* position: absolute; */
	padding-right: 4px;
	padding-top: 4px;
	font-weight: 700;
	color: #81989e;
}

.calendrier-material .holiday {
	align-items: center;
	background: var(--main-color-2);
	color: #fff;
}

.calendrier-material .holiday .day {

	align-items: center;
	margin-bottom: 0.25rem;
	color: #fff;
}

.calendrier-material .public .day {
	color: #e91e63;
	font-weight: bold;
	font-size: 1rem;
	padding: 0.1rem;
}

.calendrier-material .partially-suspended .day {
	background: orange;
	color: #fff;
}

.calendrier-material .month:last-child {
	margin-right: 0;
}

.calendrier-material .table-bordered {
	border: none;
	border-collapse: separate;
}

.calendrier-chauffeur .all-selected-jour {
	display: none;
}


.etat-presence-chauffeur-calendrier .d.public .day,
.etat-presence-chauffeur-calendrier .d.public.holiday .day {
	color: #e91e63;
	font-weight: 900;
}

.navigation-chauffeur .recherche {
	text-align: center;
	margin: 0 1rem;
}

.calendrier-material .d.suspended .day {
	background: #f97474;
	color: #fff;
}

.etat-presence-kilometrage-etablissement td.suspended {
	background: #e91d63;
	color: #fff;
}

i.carte-circuit {
	margin-right: 0.5rem;
}

.details-stats {
	display: grid;
	grid-template-columns: 1fr 1fr;
	color: #fff;
	grid-column-gap: 1rem;
}

.details-total {
	font-weight: 900;
	background: var(--main-color-2);
	padding: 0.35rem;
	text-align: center;
	border-radius: 0.25rem;
}

.details-avg {
	font-weight: 900;
	background: var(--main-color-2);
	padding: 0.35rem;
	text-align: center;
	border-radius: 0.25rem;
}

.flash-message .remove-message {
	display: inline;
	top: 0;
	margin-right: 0.5rem;
}

td.user.danger {
	background: #e91e63;
}

.bloc-trajet {
	display: grid;
	grid-gap: 1rem;
}

.bloc-trajet.mode-trajet {
	grid-template-columns: 1fr 1fr;
}

.mode-trajet .panel-trajet {
	grid-row: 1/3;
}

.mode-trajet .liste-trajets {
	grid-column: 1/3;
}

.mode-trajet .total-trajet {
	grid-area: 2/2/3/3;
}

.mode-trajet .week-user {
	grid-column: 1/3;
}

.total-trajet th {
	padding: 0.5rem;
}

.bloc-heure-check {
	display: flex;
	justify-content: center;
}

.bloc-heure-check .icheckbox_flat-green {
	align-self: center;
	margin-left: 0.25rem;
}

.liste-trajets button.btn.btn-info {
	height: initial;
	padding: 0.25rem 0.5rem;
	font-size: 0.75rem;
	width: 100%;
}

.week-user th,
.week-user td {
	font-size: 0.75rem;
	padding: 0.25rem;
}

.bloc-trajet .lien {
	margin: 0.15rem;
	padding: 0.5rem;
	min-width: 1.5rem;
	text-align: center;
	line-height: 0.75rem;
	font-size: 0.85em;
}

.liste-selected-users li {
	margin: 0.5rem;
	padding: 0.5rem;
	min-width: 1.5rem;
	text-align: center;
	line-height: 0.75rem;
	font-size: 0.75rem;
}

.liste-jours {
	display: flex;
}

.user-heure {
	background: var(--main-color-1);
	display: block;
}

.liste-users .lien a {
	padding: 0.15rem 0.25rem;
}

.liste-users .lien .user-heure {
	padding: 0.15rem 0.25rem;
	border-radius: 0 0.25rem 0.25rem 0
}

.liste-etablissements .lien {
	display: flex;
}

.liste-etablissements .lien .user-heure {
	padding: 0.15rem 0.25rem;
	border-radius: 0 0.25rem 0.25rem 0
}

/* pager wrapper, div */
.pager {
	padding: 5px;
}

/* pager wrapper, in thead/tfoot */
td.pager {
	background-color: #e6eeee;
}

/* pager navigation arrows */
.pager img {
	vertical-align: middle;
	margin-right: 2px;
}

/* pager output text */
.pager .pagedisplay {
	font-size: 11px;
	padding: 0 5px 0 5px;
	width: 50px;
	text-align: center;
}

/*** loading ajax indeterminate progress indicator ***/
#tablesorterPagerLoading {
	background: rgba(255, 255, 255, 0.8) url(icons/loading.gif) center center no-repeat;
	position: absolute;
	z-index: 1000;
}

/*** css used when "updateArrows" option is true ***/
/* the pager itself gets a disabled class when the number of rows is less than the size */
.pager.disabled {
	display: none;
}

/* hide or fade out pager arrows when the first or last row is visible */
.pager img.disabled {
	opacity: 0.5;
	filter: alpha(opacity=50);
}

.cali-details-modification {
	display: none;
}

.mail-liste-etablissement {
	overflow: auto;
	height: 600px;
}

ul.liste-options {
	overflow: hidden;
	font-size: 0.75em;
	flex-direction: row;
	display: flex;
}

.liste-mails tbody tr.new {
	animation: fadein 6s;
}

@keyframes fadein {
	from {
		opacity: 0;
	}

	25% {
		opacity: 1;
		background-color: var(--main-color-2);
	}

	to {
		opacity: 1;
		background-color: initial;
	}
}

.informations-client {
	display: grid;
	grid-template-columns: 1fr 1fr;
	grid-gap: 1rem;
}

.bloc-container {
	padding: 1rem;
	background: #fcfcfc;
	border-radius: 0.25rem;
	border-left: 0.5rem solid var(--main-color-2);
	margin-bottom: 1rem;
}


.bloc-actions {
	display: flex;
	justify-content: space-around;
}

.th-actions {
	width: 2rem;
}

.table-striped tbody tr:nth-of-type(even) {
	border-bottom: var(--main-color-2) 1px solid;
	/* color: var(--main-color-2); */
}

.table-striped tbody tr:nth-of-type(odd) {
	border-bottom: var(--main-color-1) 1px solid;
	background: none;
	/* color: var(--main-color-1); */
}

.table-striped thead th,
.table-striped td {
	border-top: none;
	border-bottom: none;
}

.table-striped thead th {
	border-bottom: 0.5rem solid #fff;
}

.fas.fa-edit {
	color: var(--main-color-1);
}

.tooltip-transport .fas.fa-times {
	color: #e91d63;
}

.table .td-actions {
	/* vertical-align: middle; */
	/* width: 4rem; */
}

.bloc-actions i {
	cursor: pointer;
	padding: 0.3rem;
	width: 18px;
	display: flex;
	justify-content: center;

}

.bloc-actions i:hover {
	color: #fff;
	background: var(--main-color-2);
	border-radius: 0.25rem
}

.table-sm {
	font-size: 0.8em;
}

.user-comments {
	grid-row: 3 span;
}

.group .flex {
	display: flex;
	flex-wrap: wrap;
	flex-direction: row;
	justify-content: space-around;
	margin: 1rem;
}

.group .info {
	background: var(--blue);
	margin: 1rem;
	padding: 0.25rem 0.5rem;
	height: 100%;
	margin: 1rem;
	flex: 1 150px;
}

.group .child {
	display: flex;
	margin: 20px;
	justify-content: space-around;
}

.group {
	margin: 1rem;
	flex-grow: 1;
}

.info h4 {
	font-size: 0.75rem;
	background: inherit;
	padding: 0.5rem;
	background: transparent;
	color: #fff;
}

.group .info .nb {
	color: #ffffff;
	font-size: 2rem;
	text-align: center;
}

.child {
	display: flex;
}

.info {
	transition: 0.5s all ease-in;
}

.info .clients {
	font-size: 0.75rem;
	height: fit-content;
	max-height: 10rem;
	overflow: hidden;
	color: #fff;
}

.info .clients .table {
	margin-bottom: 0.5rem;
}

.info:hover .clients {
	height: 100%;
	max-height: initial;
	transition: 0.5s height ease-in;
}


.info .clients td {
	vertical-align: middle;
}

.btn.btn-switch {
	background-color: transparent;
	color: var(--main-color-2);
}

.btn.btn-switch {
	border: var(--main-color-2) solid 1px;
	background-color: #fff;
	border-radius: 0.25rem;
}

.btn.btn-switch input{
	display: none;
}

.btn-switch.active {
	background-color: var(--main-color-2);
	color: #fff;
}

.flex-outer>li>label+.btn-group {
	flex: initial;
}

ul.comments {
	max-height: 95px;
	height: 95px;
	min-width: 100px;
	overflow: hidden;
	font-style: italic;
	font-size: 0.8rem;
	transition: all 1s ease-in;
}

ul.comments:hover {
	max-height: max-content;
	height: 100%;
	transition: all 1s ease-in;
}

.localisation-role.nom {
	font-weight: bold;
	background: var(--main-color-1);
	padding: 0.25rem 0.5rem;
	color: #fff;
	border-radius: 0.25rem;
}

.adresse.adresse-container-localisation {
	background: none;
	padding: 0.25rem 0;
}

li.contacts ul {
	display: flex;
	flex-wrap: wrap;
}

li.contacts ul li {
	margin: 0.25rem;
}

.table tbody tr {
	animation-name: slidein;
	animation-duration: 0.2s;
}

.table tbody tr:hover {
	background:#dfeeed;
}


#volet {
	width: 250px;
	padding: 10px;
	background: #6B9A49;
	color: #fff;
}

#volet a.ouvrir,
#volet a.fermer {
	padding: 10px 25px;
	background: #555;
	color: #fff;
	text-decoration: none;
}


#volet {
	width: 700px;
	height: 400px;
	padding: 10px;
	background: #6B9A49;
	color: #fff;
}

#volet a.ouvrir,
#volet a.fermer {
	padding: 10px 20px;
	background: #555;
	color: #fff;
	text-decoration: none;
}

#volet {
	position: fixed;
	right: -650px;
	bottom: -341px;
}

#volet a.ouvrir {
	position: absolute;
	left: 0px;
	top: 0;
}

#volet a.fermer {
	position: absolute;
	left: 0px;
	top: 0;
}

#volet {
	-webkit-transition: all .5s ease-in;
	transition: all .5s ease-in;
}

#volet:target {
	right: 0px;
	bottom: 0;
}

#volet a.fermer {
	display: none;
}

#volet:target a.ouvrir {
	display: none;
}

#volet:target a.fermer {
	display: block;
}

.fermer {
	position: absolute;
	top: 0;
	right: 0;
	width: 50px;
}

.recap.flex {
	margin: 1rem 0.25rem;
}

.recap .item {
	/* border: var(--main-color-2) solid; */
	margin-right: 1rem;
	border-radius: 0.25rem;
	display: flex;
	align-items: center;
	justify-content: center;
	background: #eee;
}

.recap .item label {
	margin-bottom: 0;
	background: var(--main-color-2);
	padding: 0.15rem;
	border-radius: 0.25rem 0 0 0.25rem;
	color: #fff;
	min-width: 40px;
	display: flex;
	justify-content: center;
}

.recap .item .count {
	display: flex;
	justify-content: center;
	align-items: center;
	/* background:#fff; */
	min-width: 2rem;
	color: #666;
	/* border-radius: 1.15rem; */
	line-height: 14px;
}

.all-etat-presence-chauffeur th.mois {
	width: 300px;
}

.transport i.fas.fa-exclamation-triangle {
	color: #e91d63;
}

.remove-contrainte .fas .fa-times {
	color: #fff;
}

td.nom {
	vertical-align: middle;
	min-width: 200px;
}

input.form-control,
textarea.form-control,
select.form-control {
	border-color: var(--main-color-1);
}

.form-columns .flex-outer>li>label+*,
.flex-inner {
	flex: 1 0 100%;
	margin-top: 0.5rem;
}

.table-striped thead tr th {
	border-bottom: var(--gray-2) 2px solid;
	font-size: 1.2em;
	color: var(--gray-1);
}

.form-columns .flex-outer>li>label {
	padding: 0.25rem;
	border-radius: 0.25rem;
	width: 100%;
	margin-right: 0;
}

ul.liste-chauffeurs li:last-child {
	margin-bottom: 0;
}

ul.liste-chauffeurs li:hover {
	background: var(--main-color-1);
	color: #fff;
}

.liste-localisation .localisation:hover .localisation-description {
	border: var(--main-color-1) 1px solid;
	padding: calc(0.5rem - 1px);
}

.liste-localisation form {
	margin: 1rem 0.5rem;
}

.form-columns .flex-outer {
	padding: 1rem 0;
}

.form-right {
	display: flex;
	justify-content: flex-end;
}


.form-columns.options-modal-transport {
	height: 0;
	overflow: hidden;
	transition: height 1s;
}

.show-options {
	height: 3px;
	background: var(--main-color-1);
}

label.show-options-title {
	margin-top: 1rem;
}

.show-options-title i {
	margin-left: 0.5rem;
}

.back-to-list {
	display: flex;
	justify-content: center;
	align-items: center;
	border: var(--main-color-2) 2px solid;
	color: var(--main-color-2);
	margin-right: 1rem;
	border-radius: 0.25rem;
	width: 30px;
}

.back-to-list:hover {
	text-decoration: none;
	background-color: var(--main-color-2);
	color: #fff;
}

.adresse-container:not(.completed) {
	display: flex;
	cursor: pointer;
}

.adresse-container:not(.completed)::after {
	content: "Cliquer ici pour choisir une adresse";
	color: var(--main-color-1);
	font-size: 1rem;
}

.liste-jour .btn {
	border: 1px solid var(--main-color-1);
	border-radius: 0;
	background: #fff;
	color: var(--main-color-1);
	width: initial;
	border-left: none;
}

.liste-jour .btn.selected {
	background: var(--main-color-1);
	color: #fff;
}

.liste-jour .btn:first-child {
	border-left: 1px solid;
	border-radius: 0.25rem 0 0 0.25rem;
}

.liste-jour .btn:last-child {
	border-radius: 0 0.25rem 0.25rem 0;
}

ul.tel {
	display: flex;
	flex-wrap: wrap;
	margin-top: 5px;
}

.heure-prevue,
.heure-realisee {
	background: #4db6ac;
	background: var(--main-color-2);
	border-radius: 0.25rem;
	padding: 0.25rem 0.5rem;
}

.modal-header {
	border-bottom: none;
}

.form-inline.etat-presence-chauffeur-form {
	text-align: center;
	justify-content: center;
}

li .default {
	display: inline-block;
	background: var(--main-color-2);
	padding: 0.25rem 0.5rem;
	border-radius: 0.25rem;
	color: #fff;
	margin-top: 0.25rem;
}

li.default {
	display: flex;
}

.dhx_cal_navline .dhx_cal_tab {
	border-width: 0;
	border-radius: 0.25rem;
	color: var(--main-color-2)
}

.dhx_cal_navline .dhx_cal_tab.active {
	background: var(--main-color-2);
	color: #fff;
}


.dhx_year_box .dhx_year_grid .dhx_year_body table tbody .dhx_before .dhx_month_head.dhx_year_event,
.dhx_year_box .dhx_year_grid .dhx_year_body table tbody td .dhx_month_head.dhx_year_event {
	background: var(--main-color-2);
}

.dhx_year_box .dhx_year_month {
	color: var(--main-color-2);
}

.dhx_cal_today_button {
	color: var(--main-color-2);
}

.dhx_cal_prev_button {
	background: none;
	display: flex;
	justify-content: center;
}

.dhx_cal_prev_button::after {
	content: "\f053";
	font-weight: 900;
	font-family: "Font Awesome 5 Free";
	color: var(--main-color-2);
}

.dhx_cal_next_button {
	background: none;
	display: flex;
	justify-content: center;
}

.dhx_cal_next_button::after {
	content: "\f054";
	font-weight: 900;
	color: var(--main-color-2);
	font-family: "Font Awesome 5 Free";
}

.circuit-nom {
	font-size: 1.5rem;
	text-align: center;
	margin: 0 1rem;
}

.navigation-circuit {
	display: flex;
	justify-content: space-around;
	margin: 1rem 1rem;
}

form.search-circuit {
	margin-left: 1rem;
}

.alert {
	padding: 1rem 1rem;
}

ul.trajet-liste-clients {
	margin: 1rem 0;
}

ul.trajet-liste-clients li {
	background: var(--main-color-1);
	padding: 0.25rem;
	margin-bottom: 0.5em;
	font-size: 0.8em;
	border-radius: 0.25rem;
}

ul.trajet-liste-clients li.absent {
	background: var(--main-color-5);
}

ul.trajet-liste-clients li.chauffeur {
	background: var(--main-color-4);
}

a.btn.btn-action:hover {
	color: #fff;
}

td.cr-heure .heure-prevue {
	color: #fff;
	width: 100px;
}

.cr-heure .heure-realisee {
	background: var(--main-color-1);
	margin-top: 0.5rem;
	color: #fff;
}

.remove-coupure:hover {
	color: #e91d63;
	cursor: pointer;
}

.cloturer-etat-presence-circuit .retour,
.cloturer-etat-presence-circuit .aller {
	background: var(--main-color-1);
	padding: 0.5rem;
	color: #fff;
	border-radius: 0.25rem;
}

.cloturer-etat-presence-circuit .aller {
	background: var(--main-color-2)
}

.alert .date {
	font-weight: 900;
}

.alert .nom {
	font-weight: 900;
}

.completion .content {
	padding: 0.25rem 0.25rem;
}

.completion .statut {
	background: #dc3545;
	color: #fff;
	padding: 0.25rem;
	margin-top: 0.25rem;
	border-radius: 0.25rem;
	display: inline-block;
}

.tb-controle .content {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(201px, 1fr));
	grid-gap: 0.5rem;
	padding: 0.5rem;
}

.tb-controle .controle-technique {
	border-radius: 0.25rem;
	display: grid;
	background: var(--main-color-2);
	grid-template-columns: 1fr 1fr;
	border: solid var(--main-color-2);
}

.tb-controle .controle-technique a {
	color: #fff;
}

.tb-controle {
	grid-column: span 2;
}

.content .km {
	padding: 0.5rem 1rem;
	background: var(--main-color-1);
	color: #fff;
	text-align: center;
}

.content .alertes {
	border-radius: 0.25rem;
	color: inherit;
	padding: 0.25rem;
	text-align: center;
	background: #fff;
	display: flex;
	justify-content: center;
	align-items: center;
	flex-direction: row;
	flex-wrap: wrap;
}

.content .immatriculation {
	padding: 0.25rem;
	display: flex;
	align-items: center;
	justify-content: center;
	color: #fff;
	text-align: center;
	flex-wrap: wrap;
	flex-direction: column;
}

.tb-revision {
	grid-column: span 2;
}

.tb-revision .content {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(201px, 1fr));
	grid-gap: 0.5rem;
	padding: 0.5rem;
}


.tb-revision .revision {
	border-radius: 0.25rem;
	display: grid;
	background: var(--main-color-4);
	grid-template-columns: 1fr 1fr;
	border: solid var(--main-color-4);
}

.tb-location {
	grid-column: span 2;
}

.tb-location .content {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(201px, 1fr));
	grid-gap: 0.5rem;
	padding: 0.5rem;
}

.tb-location .location {
	border-radius: 0.25rem;
	display: grid;
	background: #f97474;
	grid-template-columns: 1fr 1fr;
	border: solid red;
}

.tb-pneumatiques {
	grid-column: span 2;
}

.tb-pneumatiques .content {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(201px, 1fr));
	grid-gap: 0.5rem;
	padding: 0.5rem;
}

.tb-pneumatiques .pneumatique {
	border-radius: 0.25rem;
	display: grid;
	background: violet;
	grid-template-columns: 1fr 1fr;
	border: solid violet;
}

.tb-incident-techniques {
	grid-column: span 2;
}

.tb-incident-techniques .content {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(136px, 1fr));
	grid-gap: 0.5rem;
	padding: 0.5rem;
}

.tb-incident-techniques .incident-technique {
	border-radius: 0.25rem;
	display: grid;
	background: var(--main-color-1);
	grid-template-columns: 1fr;
	border: solid var(--main-color-1);
}


.incident-technique .chauffeur {
	padding: 1rem 0.5rem;
}

.incident-technique .alertes {
	font-size: 0.8rem;
	font-weight: 900;
	margin: 1rem 0.5rem;
}

.tb-circuits-sans-chauffeur {
	grid-column: span 2;
}

.tb-circuits-sans-chauffeur .content {
	/* display: grid; */
	row-gap: 0.5rem;
}

.tb-circuits-sans-chauffeur .circuit-sans-chauffeur {
	border-radius: 0.25rem;
	display: grid;
	background: #ff5722;
	grid-template-columns: 1fr 1fr 1fr 1fr;
	border: solid #ff5722;
	margin-bottom: 0.5rem;
}


.circuits-sans-chauffeur .chauffeur {
	padding: 1rem 0.5rem;
}

.circuits-sans-chauffeur .alertes {
	font-size: 0.8rem;
	font-weight: 900;
	margin: 1rem 0.5rem;
}

.content .nb {
	padding: 0.25rem;
	display: flex;
	align-items: center;
	justify-content: center;
	color: #fff;
	text-align: center;
	font-weight: 900;
	background: #fe0008;
	border-radius: 0.25rem;
}

.tb-chauffeurs-indisponibles {
	grid-column: span 2;
}

.tb-chauffeurs-indisponibles .content {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(136px, 1fr));
	grid-gap: 0.5rem;
	padding: 0.5rem;
}

.tb-chauffeurs-indisponibles .circuit-sans-chauffeur {
	border-radius: 0.25rem;
	display: grid;
	background: #80deea;
	grid-template-columns: 1fr 1fr 1fr;
	border: solid #80deea;
}

.alertes a {
	color: #000;
}

.permission-lists {
	display: grid;
	grid-gap: 1rem;
}

.permission-etablissements {
	padding: 1rem;
	border-radius: 0.25rem;
	min-height: 250px;
}

.permission-circuits {
	padding: 1rem;
	border-radius: 0.25rem;
	min-height: 380px;
}

.selection-list-js ul {
	padding: 0.5rem 0;
}

.selection-list-js li {
	padding: 0.25rem 1rem;
	font-size: 0.8rem;
	margin-bottom: 0.25rem;
	display: flex;
	align-items: center;
	justify-content: space-between;
	color: var(--main-color-1);
	border-bottom: 1px solid var(--main-color-1);
}

.selection-list-js li i {
	display: flex;
	justify-content: space-between;
	align-items: center;
	border-radius: 0.25rem;
	color: var(--main-color-1);
}

.selection-list-js .list-1 li {
	background-color: var(--main-color-2);
}

.bloc-actions a {
	color: inherit;
}

.grid-permission {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 1rem;
}

.liste-actions {
	grid-row: span 2;
}

.capsule {
	display: flex;
	border-radius: 0.25rem;
	background: var(--main-color-6);
	margin: 0.25rem;
	align-items: center;
	align-self: start;
}

.capsule .label {
	border-radius: 0.25rem 0 0 0.25rem;
	color: #fff;
	padding: 0.25rem 1rem;
	align-self: stretch;
	display: flex;
	align-items: center;
	font-size: 0.875rem;
	font-weight: 600;
}

.capsule .content {
	padding: 0.25rem 1rem;
}

.filters .capsule .content {
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.capsule.etablissement .label {
	background: #e91e63;
}

.capsule.chauffeur .label {
	background: var(--main-color-1);
}

.capsule.circuit .label {
	background: var(--main-color-2);
}

#details-transport .etat-details {
	display: flex;
	justify-content: center;
}

#details-transport .etat-details input:checked+label {
	/* flex-grow: 1; */
	background: var(--main-color-2);
	padding: 0.5rem 1rem;
	margin: 1rem;
	border-radius: 0.25rem;
	color: #fff;
	text-align: center;
}

#details-transport .etat-details label {
	/* flex-grow: 1; */
	/* display: flex; */
	background: var(--main-color-1);
	padding: 0.5rem 0.25rem;
	margin-left: 1rem;
	border-radius: 0.25rem;
	color: #fff;
	text-align: center;
}

.tooltip-transport .main-info {
	display: flex;
	flex-wrap: wrap;
	margin-bottom: 1rem;
}

.tooltip-transport .main-info .circuit {
	background: var(--main-color-2);
	padding: 0.25rem 0.5rem;
	border-radius: 0.25rem;
	color: #fff;
	margin-right: 0.25rem;
	font-size: 0.75rem;
}

.tooltip-transport .main-info .chauffeur {
	background: var(--main-color-1);
	padding: 0.25rem 0.5rem;
	border-radius: 0.25rem;
	color: #fff;
	font-size: 0.75rem;
}

.liste-transport-km.success {
	display: block;
}

form.details-form {
	display: grid;
}

.details-form .champs {
	justify-self: start;
	margin: 0;
	width: 100%;
}

.flex-outer>li>label+.heure-select {
	flex: initial;
}

.alerte-sms ul li {
	border-left: var(--main-color-2) 0.5rem solid;
	padding: 0.25rem 1rem;
	margin-bottom: 0.5rem;
	background: #eee;
	border-radius: 0.25rem;
}

.alerte-sms ul li.selected {}

.alerte-sms ul li.selected:before {
	content: "\f00c";
	font-weight: 900;
	font-family: "Font Awesome 5 Free";
	color: var(--main-color-2);
	margin-right: 1rem;
}

.semaine-date .flex {
	display: flex;
	flex-wrap: nowrap;
	gap: 1rem;
}

.semaine-date .semaine {
	margin-right: 0;
}

.active .roll {
	display: flex;
	align-items: center;
	background: #09867d;
	background: var(--main-color-3);
	color: #fff;
}

input.form-control[type=file] {
	padding: .1rem .25rem;
}

.completion li.liste-chauffeurs {
	padding: calc(0.25rem - 1px);
	margin-bottom: 0.25rem;
	border: solid 1px var(--main-color-1);
}

.transport .last {
	margin-top: 0.5rem;
}

.all-etat-presence-chauffeur td.value {
	max-width: 2rem;
	min-width: 3.5rem;
}

td.mois {
	min-width: 7rem;
}

.table-centered td {
	text-align: center;
}

.nouveau-transport-etat-presence {
	position: absolute;
	top: 1rem;
	right: 1rem;
}

nav.horizontal {
	background: #09867d;
	background: var(--main-color-3);
}

nav.horizontal ul {
	display: flex;
	justify-content: flex-end;
}

nav.horizontal li {
	margin-left: 1rem;
	color: #fff;
	display: flex;
	align-items: center;
	padding: 1rem;
	height: 2rem;
}

.contraintes-champs .btn {
	display: grid;
	justify-content: center;
	background-color: #fff;
	color: var(--main-color-2);
	height: 2rem;
	align-items: center;
	grid-template-columns: 1fr 30px;
}

.contraintes-champs .btn:hover {
	background-color: var(--main-color-2);
	color: #fff;
}

ul.liste-transmis {
	display: flex;
	grid-column: span 2;
	justify-content: flex-end;
}

li.transmis {
	margin: 0.25rem;
	background: var(--main-color-2);
	display: flex;
	justify-content: space-around;
	padding: 0.25rem 1rem;
	color: #fff;
	line-height: 1.2rem;
	align-items: center;
	border-radius: 0.25rem;
}

.transmis .nom {
	margin-right: 1rem;
}

.tb-semaine {
	grid-column: 12 span;
}

.tb-semaine .circuits .kilometrage {
	display: grid;
	grid-template-columns: 1fr 1fr;
	padding: 0.25rem;
	font-style: italic;
	text-align: center;
}

.tb-semaine .circuits .nom {
	display: grid;
	padding: 0.25rem;
	background: var(--main-color-2);
	font-weight: 900;
	color: #fff;
}

.tb-semaine .circuits {
	background: var(--main-color-1);
	margin-bottom: 0.5rem;
}

.tb-semaine .content {
	max-height: initial;
}

.liste-adresse-geoloc .localisation {
	padding: 1rem;
	border: solid 1px var(--main-color-1);
	margin-bottom: 0.25rem;
}

ul.liste-poi {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 0.5rem;
	max-height: 400px;
	overflow-y: auto;
}

ul.liste-poi li {
	padding: 0.5rem;
	min-height: 1rem;
	display: grid;
	border: var(--main-color-1) 2px solid;
	border-radius: 0.25rem;
	font-size: 0.8rem;
}

ul.liste-poi li .localisation-footer {
	justify-self: end;
	margin: 0.5rem;
}

ul.liste-poi .localisation-body div {
	min-height: 1rem;
}

.localisation-title {
	font-size: 0.8rem;
	font-weight: 900;
	padding: 0.25rem 0.5rem;
	background: var(--main-color-1);
	margin-bottom: 0.5rem;
	border-radius: 0.25rem;
	color: #fff;
}

.liste-poi .localisation-body .localisation-ville {
	font-weight: 900;
	padding: 0.25rem 0.5rem;
	background: var(--main-color-5);
	border-radius: 0.25rem;
	min-height: 1rem;
	color: #fff;
}

.localisation-cp {
	font-weight: 900;
}

.localisation-adresse,
.localisation-cplt {
	font-style: italic;
	min-height: 1rem;
}

ul.liste-fav {
    display: flex;
    flex-direction: column;
    gap: 1rem;
    max-height: 600px;
    overflow: auto;
}

.liste-fav .localisation {
	padding: 0.5rem;
	background: var(--main-color-6);
	border-radius: 8px;
	cursor: pointer;
}

.liste-fav .localisation:hover,
.liste-poi .localisation:hover {
	background: var(--main-color-3);
	color: #fff;
	border-radius: 0.25rem;
}

.localisation-type {
	display: inline-block;
	background: var(--main-color-3);
	padding: 0.25rem 0.5rem;
	color: #fff;
	border-radius: 0.25rem;
	margin-bottom: 0.25rem;
	font-size: 0.75em;
}

.localisation-poi li {
	padding: 0.25rem;
	color: #fff;
	background: var(--main-color-4);
	border-radius: 0.25rem;
	font-size: 0.75em;
}

.localisation-poi {
	display: flex;
	margin-bottom: 0.25rem;
	margin-left: 0.25rem;
}

.localisation-tags {
	display: flex;
	line-height: 1rem;
}

.planing-table .impression-jour-ch {
	display: block;
	margin: auto;
	margin-bottom: 1rem;
}

.list-localisations {
	height: 780px;
	overflow: auto;
	margin-bottom: 1rem;
}

ul.list-pois {
	display: flex;
	margin-top: 1rem;
}

ul.list-pois .item-poi {
	border: solid 1px;
	border-radius: 0.25rem;
	margin: 0 1rem;
	width: 25%;
}

ul.list-contacts {
	display: flex;
	margin-top: 1rem;
}

ul.list-contacts .item-contact {
	border: solid 1px;
	border-radius: 0.25rem;
	margin: 0 1rem;
	width: 25%;
}

.add-btn.add-item .btn {
	height: 100%;
	width: 200px;
	border: 3px solid var(--main-color-1);
	background: #fff;
}

.add-btn.add-item .btn i {
	font-size: 6em;
	color: var(--main-color-1);
}

.tooltip-maps-leg {
	padding: 1rem;
	background: #fff;
	position: absolute;
	border-radius: 1rem;
	z-index: 1000000;
	display: grid;
	grid-template-columns: 1fr 1fr 1fr;
	font-size: 0.85rem;
	box-shadow: -8px 5px 20px #6d6d6d;
}

.tooltip-maps-leg .liste-client {
	color: #fff;
	flex-wrap: wrap;
}

.tooltip-maps-leg .liste-client li {
	background: var(--main-color-1);
	padding: 0.25rem;
	margin-bottom: 0.5em;
	font-size: 0.8em;
	border-radius: 0.25rem;
}

.tooltip-maps-leg .liste-client li.absent {
	background-color: var(--main-color-5);
}

.planning-du-jour td.pec {
	background: #64b5f6;
}

.planning-du-jour td.fpec {
	background: #4db6ac;
}


.planning-du-jour .adresse {
	font-size: 0.9rem;
	font-style: italic;
}

.planning-du-jour i.pec {
	font-size: 1.2rem;
}

.planning-du-jour i.fpec {
	font-size: 1.2rem;
}

.planning-du-jour.table td,
.planning-du-jour.table th {
	padding: 5px;
	font-size: 12px;
	height: 20px;
	padding: 5px;
	border-top: 0;
}

.planning-du-jour .transport {
	border-top: 1px solid #000;
}

.planning-du-jour td.heure {
	width: 200px;
	font-size: 0.875rem;
}

.planning-du-jour img {
	width: 15px;
}

.planning-du-jour th {
	font-size: 12px;
}

.planning-du-jour th.rotate {
	padding: 1px;
	vertical-align: bottom;
	max-width: 80px;
	font-size: 9px;
}

.planning-du-jour .incident-du-jour {
	margin-top: 20px;
}

.planning-du-jour .incident-du-jour td {
	font-size: 12px;
}

.planning-du-jour .sens {
	font-size: 1rem;
	margin-bottom: 0.5rem;
}

.planning-du-jour .header label {
	font-size: 1rem;
	font-weight: 900;
}

.planning-du-jour .header {
	width: 100%;
}

.planning-du-jour .header td {
	width: 20%;
	vertical-align: top;
}

.plannings {
	display: grid;
	grid-template-columns: 500px 1fr;
	column-gap: 1em;
}

.planning-du-jour.non-exist {
	opacity: 0.3;
}

.liste-fav .localisation.etablissement .localisation-title {
	background: var(--main-color-4);
}

.parts li {
	background: var(--main-color-2);
	padding: 0.5rem 0.5rem;
	color: #fff;
	border-radius: 0.25rem;
	margin: 0.5rem;
}

ul.parts {
	display: flex;
}

.parts li i {
	margin-left: 0.5rem;
}

.jours {
	display: grid;
	grid-template-columns: repeat(7, 1fr);
	column-gap: 1rem;
	margin-bottom: 1rem;
	grid-column: 2 span;
}

.jours .jour {
	border-radius: 0.25rem;
	padding: 0.5rem;
	display: grid;
	gap: 0.5rem;
	align-self: end;
}

.jours .jour.selected .date {
	text-align: center;
	border-radius: 0.25rem;
	padding: 0.5rem;
	background: #027b70b3;
	color: #fff
}

.jours .jour .date {
	text-align: center;
	border-radius: 0.25rem;
	padding: 0.5rem;
	background: #60a2d6;
	color: #fff;
	align-self: start;
}


.jours .jour.active {
	background: #64b5f673;
	text-align: center;
	color: #fff;
}

.jours .active.selected {
	background: var(--main-color-2);
}


li.path.hide {
	display: none;
}

.color-selection {
	display: grid;
	grid-auto-flow: column;
	grid-column: 4 span;
	gap: 0.25rem;
}

.color-selection .color {
	justify-self: stretch;
	display: grid;
}

.color-selection .color.selected {
	opacity: 1;
}

.jours .jour:hover {
	cursor: pointer;
	color: #fff;
	background: #4db6acad;
}

ul.list-circuits {
	max-height: 85vh;
	overflow-y: scroll;
	padding: 0 1rem;
	display: grid;
}

ul.paths {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 1rem;
	margin-top: 1rem;
	/* background: red; */
}

.paths .path {
	padding: 0.5rem;
	font-size: 0.7em;
	border-radius: 0.25rem;
	align-self: start;
	transition: all 0.5s;
	border-width: 0.5rem;
	border-color: #fff;
	background: #fff;
	border-style: solid;
	/* border: solid 0.5rem #b6dbf8; */
}

.paths .path.visible {
	border-color: #b6dbf8;
}

.horaires .horaire {
	display: grid;
	margin-bottom: 0.5rem;
	background: #fff;
	padding: 0.5rem;
	border-radius: 0.25rem;
}

.paths .path .detail:hover {
	color: #64b5f6;
	background: #99c6ea;
}

.path .horaires {
	border-radius: 0.25rem;
	margin-top: 0.5rem;
	font-size: 1.2em;
}

.circuits .circuit {
	padding: 0.5rem 1rem;
	border-bottom: solid 2px #ccc;
}

.circuit .title {
	justify-self: start;
	color: #000;
}

.path ul.chauffeurs li,
.tooltip-map ul.chauffeurs li,
.tooltip-maps-leg ul.chauffeurs li {
	background: var(--main-color-2);
	padding: 0.25rem;
	border-radius: 0.25rem;
	color: #fff;
	display: grid;
	align-items: center;
}

.path ul.chauffeurs,
.tooltip-map ul.chauffeurs,
.tooltip-maps-leg ul.chauffeurs {
	display: grid;
	text-align: center;
}

.path ul.circuits li,
.tooltip-map ul.circuits li,
.tooltip-maps-leg ul.circuits li {
	background: #fff;
	border: 1px solid var(--main-color-1);
	padding: 0.25rem;
	border-radius: 0.25rem;
	color: var(--main-color-1);
	font-weight: 900;
}

.path ul.circuits,
.tooltip-map ul.circuits,
.tooltip-maps-leg ul.circuits {
	display: grid;
	text-align: center;
}

.trajet-liste-clients .edit {
	color: #fff;
	justify-self: center;
	align-self: center;
}

.trajet-liste-clients li {
	display: grid;
	grid-template-columns: 1fr 10px;
}

.paths .empty {
	background: #ffffff;
	border-color: #ec407a;
}

.paths .empty.visible {
	background: #ec407a;
}

.route tr.empty {
	background: #dc326d38;
}

input.duration {
	width: 50px;
	text-align: center;
}

.path .header {
	display: grid;
	grid-template-columns: 1fr 1fr 1fr 1fr;
	gap: 0.5rem;
}

.routes .route {
	margin-top: 1rem;
}

.list-circuits .circuit .header {
	display: grid;
}

.header .visible-route {
	justify-self: end;
	margin-right: 1rem;
}

.list-circuits .circuit {
	display: grid;
	grid-template-columns: 1fr 1fr;
	margin-bottom: 1rem;
}

.header .visible-route {
	justify-self: end;
	margin-right: 1rem;
}

.list-circuits .circuit {
	padding: 1rem;
	margin: 1rem;
	border-radius: 0.25rem;
	background: var(--main-color-6);
}

.circuit .options {
	justify-self: end;
	display: grid;
	grid-auto-columns: 1fr;
	grid-auto-flow: column;
	gap: 1rem;
	align-items: center;
}

.options i.active {
	opacity: 1;
}

.options i {
	opacity: 0.5;
}

.circuit .onglets {
	grid-column: 2 span;
}

.circuit .details {
	grid-column: 2 span;
	padding: 0 1rem 1rem 1rem;
}

.route td.data {
	text-align: center;
	vertical-align: middle;
	font-size: 1.1em;
	width: 50px;
}

.route .resume {
	display: grid;
	grid-template-columns: 1fr 1fr 1fr;
	margin-bottom: 1rem;
	gap: 0.5rem;
}

.transports .transport.hide {
	display: none;
}

.transports {
	display: grid;
	grid-template-columns: 1fr 1fr 1fr 1fr;
	gap: 0.25rem;
	margin-top: 1rem;
}

.group-transports {
	background: #b7dcf9;
	padding: 0.5rem;
	border-radius: 0.25rem
}

.group-transports .title {
	text-align: center;
	margin-bottom: 0.5rem;
}


.transports .transport {
	display: grid;
	grid-template-columns: 1fr 1fr;
	text-align: center;
	column-gap: .25rem;
}

.transports .transport .start,
.transports .transport .end {
	padding: 0.25rem;
	font-size: 0.75em;
	border-radius: 0.25rem;
	color: #fff;
	background: #60a2d6;
	text-align: center;
}

.transports .transport .end {
	background: #4db6ac;
}

.tooltip-maps-leg .vehicle {
	grid-column: 3;
	grid-row: 1/5;
}

.tooltip-maps-leg .date {
	grid-column: 2 span;
}

.path .computed {
	grid-column: 1;
}

.path .date {
	grid-column: 1;
	grid-row: 1;
}

.circuit .edition {
	border-radius: 0.25rem;
	grid-column: 2 span;
	background: #fff;
}

.circuit .generate {
	background: #f3e7e7;
	border-radius: 0.25rem;
	grid-column: 2 span;
	padding: 1rem;

}

.circuit .replace {
	background: #f3e7e7;
	border-radius: 0.25rem;
	grid-column: 2 span;
	padding: 1rem;
	margin: 1rem 0;
}

.circuit .validation i {
	font-size: 1.5em;
}

.circuit .validation {
	display: grid;
}

.path .duration {
	font-size: 1.2em;
	background: #60a2d6;
	justify-items: center;
	display: grid;
	align-items: center;
	border-radius: 0.25rem;
	color: #fff;
}

.path .distance {
	font-size: 1.2em;
	background: #379799;
	justify-items: center;
	display: grid;
	align-items: center;
	border-radius: 0.25rem;
	color: #fff;
}

.path .amplitude {
	font-size: 1.8em;
	background: #50c39c;
	justify-items: center;
	display: grid;
	align-items: center;
	border-radius: 0.25rem;
	color: #fff;
	grid-row: 1 / 2 span;
	grid-column: 1 / 2 span;
}

.path .date {
	font-size: 1.2em;
	background: #e91d63;
	justify-items: center;
	display: grid;
	align-items: center;
	border-radius: 0.25rem;
	grid-column: 2 span;
	color: #fff;
}

.color.selected::after {
	content: "\f00c";
	align-self: center;
	justify-self: center;
	font-family: "Font Awesome 5 Free";
	font-weight: 900;
	color: #fff;
}

.path .detail {
	grid-column: 4 span;
	padding: 0.7rem;
}

.path:not(.visible) .horaire {
	background: #b7dcf9;
}

.group-transports ul {
	display: grid;
	row-gap: 0.25rem;
}

.resume .resume-element {
	padding: 0.5rem;
	border-radius: 0.25rem;
}

.resume .resume-element.danger {
	grid-column: 3 span;
}

.resume .resume-element.info {
	background: #b6dbf859;
}

li.resume-element.coupures {
	grid-column: 1 / 3 span;
	grid-row: 4 / 2 span;
	background: #7c84e429;
}

.resume .resume-element label {
	font-weight: 900;
}

.resume .resume-element .value {
	font-style: italic;
}

.coupures li {
	background: #fff;
	padding: 0.5rem;
	border-radius: 0.25rem;
	display: grid;
	/* color: #fff; */
	border-left: 0.5rem solid;
}

.coupures ul {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
	gap: 0.5rem;
}

.coupures label {
	display: grid;
	justify-items: center;
	font-size: 1.2em;
	color: #7c84e4;
}

li.path:hover {
	border-color: #ccc;
}

ul.list {
	margin: 1rem;
	display: grid;
	gap: 1rem;
}

ul.list .list-item {
	padding: 0.5rem;
	background: #3e4272;
	border-radius: 0.25rem;
	color: #fff;
}

.coupures ul ul {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(60px, 1fr));
	gap: 0.5rem;
	grid-column: 4 span;
}

.coupures .retard {
	grid-column: 5 span;
	grid-row: 2;
	border-color: #ffa000;
}

.coupures ul ul li {
	border-color: #76b0e4;
}

.contraintes-champs .btn i {
	justify-self: end;
}

ul.info-supp {
	display: grid;
	grid-template-columns: 1fr 1fr;
}

.navigation {
	display: flex;
	justify-self: end;
}

.navigation .previous,
.navigation .next {
	border: 2px solid var(--main-color-2);
	color: var(--main-color-2);
	margin-right: 10px;
	cursor: pointer;
	border-radius: 0.25rem;
	font-size: 0.8rem;
	height: calc(2rem + 2px);
	display: flex;
	align-items: center;
	width: 250px;
}

.navigation .next i.fas,
.navigation .previous i.fas {
	margin: 0.5rem;
	font-size: 1rem;
}

.navigation .previous .name,
.navigation .next .name {
	flex-grow: 1;
	text-align: center;
	margin: 1rem 0.5rem;
	line-height: 0.7rem;
	display: block;
}

.navigation .previous:hover,
.navigation .next:hover {
	background: var(--main-color-2);
	color: #fff;
	transition: all 0.2s ease-in;
}

.header {
	display: flex;
	flex-direction: row-reverse;
}

.nav li .roll {
	display: flex;
	grid-template-columns: 40px 1fr 20px;
	align-items: center;
}

.circuit .title a {
	color: inherit;
}

.list-circuits .circuit:first-child {
	margin-top: 0;
}

.etat-presence-chauffeur-calendrier .d.holiday {
	background: #4a34a59c;
}

.etat-presence-chauffeur-calendrier .d.selected {
	background: #00867d33;
}

.transports-circuit {
	display: flex;
	/* flex-wrap: wrap; */
	justify-content: space-around;
	flex-direction: column;
	/* align-items: start; */
}

.transports-circuit .adresse-container {
	max-width: 150px;

	background: var(--main-color-6);

}

.transports-circuit .etape {
	width: 150px;
	background: var(--main-color-6);
	padding: 0.5rem;
	margin: 0.25rem;
	border-radius: 0.25rem;
}

.etape.etape-up {
	border-top: solid 5px var(--main-color-2);
}

.etape.etape-down {
	border-top: solid 5px var(--main-color-5);
}

.etape .etape-clients {
	font-size: 0.8em;
	display: flex;
	flex-direction: column;
}

.etape .etape-clients li {
	padding: 0.25rem;
	margin-bottom: 0.25rem;
	border-radius: 0.25rem;
	background: #ddd;
}

.etape .etape-date {
	text-align: center;
}











/* ---------------------------------------------------

Project : CSS Checkbox Switch
Author : Partha Kar (https://www.facebook.com/partha.creativemind)
Version : 1.0
Release Dtae : 15 November, 2017

---------------------------------------------------- */


.checkbox.checbox-switch {
	padding-left: 0;
}

.checkbox.checbox-switch label,
.checkbox-inline.checbox-switch {
	display: inline-block;
	position: relative;
	padding-left: 0;
}

.checkbox.checbox-switch label input,
.checkbox-inline.checbox-switch input {
	display: none;
}

.checkbox.checbox-switch label span,
.checkbox-inline.checbox-switch span {
	width: 70px;
	border-radius: 20px;
	height: 2.3rem;
	border: 1px solid #dbdbdb;
	background-color: rgb(255, 255, 255);
	border-color: rgb(223, 223, 223);
	box-shadow: rgb(223, 223, 223) 0px 0px 0px 0px inset;
	transition: all 0.3s;
	display: inline-block;
	vertical-align: middle;
	margin-right: 5px;
}

.checkbox.checbox-switch label span:before,
.checkbox-inline.checbox-switch span:before {
	display: inline-block;
	width: 2rem;
	height: 2rem;
	border-radius: 50%;
	background: rgb(255, 255, 255);
	content: " ";
	top: 1px;
	position: relative;
	left: 2px;
	transition: all 0.3s ease;
	box-shadow: 0 1px 4px rgba(0, 0, 0, 0.4);
}

.checkbox.checbox-switch label>input:checked+span:before,
.checkbox-inline.checbox-switch>input:checked+span:before {
	left: 39px;
}


/* Switch Default */
.checkbox.checbox-switch label>input:checked+span,
.checkbox-inline.checbox-switch>input:checked+span {
	background-color: rgb(180, 182, 183);
	border-color: rgb(180, 182, 183);
	box-shadow: rgb(180, 182, 183) 0px 0px 0px 8px inset;
	/* transition: border 0.4s ease 0s, box-shadow 0.4s ease 0s, background-color 1.2s ease 0s; */
}

.checkbox.checbox-switch label>input:checked:disabled+span,
.checkbox-inline.checbox-switch>input:checked:disabled+span {
	background-color: rgb(220, 220, 220);
	border-color: rgb(220, 220, 220);
	box-shadow: rgb(220, 220, 220) 0px 0px 0px 8px inset;
	transition: border 0.4s ease 0s, box-shadow 0.4s ease 0s, background-color 1.2s ease 0s;
}

.checkbox.checbox-switch label>input:disabled+span,
.checkbox-inline.checbox-switch>input:disabled+span {
	background-color: rgb(232, 235, 238);
	border-color: rgb(255, 255, 255);
}

.checkbox.checbox-switch label>input:disabled+span:before,
.checkbox-inline.checbox-switch>input:disabled+span:before {
	background-color: rgb(248, 249, 250);
	border-color: rgb(243, 243, 243);
	box-shadow: 0 1px 4px rgba(0, 0, 0, 0.1);
}

/* Switch Light */
.checkbox.checbox-switch.switch-light label>input:checked+span,
.checkbox-inline.checbox-switch.switch-light>input:checked+span {
	background-color: rgb(248, 249, 250);
	border-color: rgb(248, 249, 250);
	box-shadow: rgb(248, 249, 250) 0px 0px 0px 8px inset;
	transition: border 0.4s ease 0s, box-shadow 0.4s ease 0s, background-color 1.2s ease 0s;
}

/* Switch Dark */
.checkbox.checbox-switch.switch-dark label>input:checked+span,
.checkbox-inline.checbox-switch.switch-dark>input:checked+span {
	background-color: rgb(52, 58, 64);
	border-color: rgb(52, 58, 64);
	box-shadow: rgb(52, 58, 64) 0px 0px 0px 8px inset;
	transition: border 0.4s ease 0s, box-shadow 0.4s ease 0s, background-color 1.2s ease 0s;
}

.checkbox.checbox-switch.switch-dark label>input:checked:disabled+span,
.checkbox-inline.checbox-switch.switch-dark>input:checked:disabled+span {
	background-color: rgb(100, 102, 104);
	border-color: rgb(100, 102, 104);
	box-shadow: rgb(100, 102, 104) 0px 0px 0px 8px inset;
	transition: border 0.4s ease 0s, box-shadow 0.4s ease 0s, background-color 1.2s ease 0s;
}

/* Switch Success */
.checkbox.checbox-switch.switch-success label>input:checked+span,
.checkbox-inline.checbox-switch.switch-success>input:checked+span {
	background-color: var(--main-color-2);
	border-color: var(--main-color-2);
	box-shadow: var(--main-color-2) 0px 0px 0px 8px inset;
	/* transition: border 0.4s ease 0s, box-shadow 0.4s ease 0s, background-color 1.2s ease 0s; */
}

.checkbox.checbox-switch.switch-success label>input:checked:disabled+span,
.checkbox-inline.checbox-switch.switch-success>input:checked:disabled+span {
	background-color: rgb(153, 217, 168);
	border-color: rgb(153, 217, 168);
	box-shadow: rgb(153, 217, 168) 0px 0px 0px 8px inset;
}

/* Switch Danger */
.checkbox.checbox-switch.switch-danger label>input:checked+span,
.checkbox-inline.checbox-switch.switch-danger>input:checked+span {
	background-color: rgb(200, 35, 51);
	border-color: rgb(200, 35, 51);
	box-shadow: rgb(200, 35, 51) 0px 0px 0px 8px inset;
	transition: border 0.4s ease 0s, box-shadow 0.4s ease 0s, background-color 1.2s ease 0s;
}

.checkbox.checbox-switch.switch-danger label>input:checked:disabled+span,
.checkbox-inline.checbox-switch.switch-danger>input:checked:disabled+span {
	background-color: rgb(216, 119, 129);
	border-color: rgb(216, 119, 129);
	box-shadow: rgb(216, 119, 129) 0px 0px 0px 8px inset;
	transition: border 0.4s ease 0s, box-shadow 0.4s ease 0s, background-color 1.2s ease 0s;
}

/* Switch Primary */
.checkbox.checbox-switch.switch-primary label>input:checked+span,
.checkbox-inline.checbox-switch.switch-primary>input:checked+span {
	background-color: rgb(0, 105, 217);
	border-color: rgb(0, 105, 217);
	box-shadow: rgb(0, 105, 217) 0px 0px 0px 8px inset;
	transition: border 0.4s ease 0s, box-shadow 0.4s ease 0s, background-color 1.2s ease 0s;
}

.checkbox.checbox-switch.switch-primary label>input:checked:disabled+span,
.checkbox-inline.checbox-switch.switch-primary>input:checked:disabled+span {
	background-color: rgb(109, 163, 221);
	border-color: rgb(109, 163, 221);
	box-shadow: rgb(109, 163, 221) 0px 0px 0px 8px inset;
	transition: border 0.4s ease 0s, box-shadow 0.4s ease 0s, background-color 1.2s ease 0s;
}

/* Switch Info */
.checkbox.checbox-switch.switch-info label>input:checked+span,
.checkbox-inline.checbox-switch.switch-info>input:checked+span {
	background-color: rgb(23, 162, 184);
	border-color: rgb(23, 162, 184);
	box-shadow: rgb(23, 162, 184) 0px 0px 0px 8px inset;
	transition: border 0.4s ease 0s, box-shadow 0.4s ease 0s, background-color 1.2s ease 0s;
}

.checkbox.checbox-switch.switch-info label>input:checked:disabled+span,
.checkbox-inline.checbox-switch.switch-info>input:checked:disabled+span {
	background-color: rgb(102, 192, 206);
	border-color: rgb(102, 192, 206);
	box-shadow: rgb(102, 192, 206) 0px 0px 0px 8px inset;
	transition: border 0.4s ease 0s, box-shadow 0.4s ease 0s, background-color 1.2s ease 0s;
}

/* Switch Warning */
.checkbox.checbox-switch.switch-warning label>input:checked+span,
.checkbox-inline.checbox-switch.switch-warning>input:checked+span {
	background-color: rgb(255, 193, 7);
	border-color: rgb(255, 193, 7);
	box-shadow: rgb(255, 193, 7) 0px 0px 0px 8px inset;
	transition: border 0.4s ease 0s, box-shadow 0.4s ease 0s, background-color 1.2s ease 0s;
}

.checkbox.checbox-switch.switch-warning label>input:checked:disabled+span,
.checkbox-inline.checbox-switch.switch-warning>input:checked:disabled+span {
	background-color: rgb(226, 195, 102);
	border-color: rgb(226, 195, 102);
	box-shadow: rgb(226, 195, 102) 0px 0px 0px 8px inset;
	transition: border 0.4s ease 0s, box-shadow 0.4s ease 0s, background-color 1.2s ease 0s;
}


.js-liste.list-circuits {
	display: grid;
	grid-template-columns: 1fr 1fr 1fr 1fr;
	gap: 25px;
}

.filters {
	max-height: 195px;
	overflow: auto;
	display: flex;
	flex-wrap: wrap;
}

ul.liste-chauffeur {
	/* flex-grow: 1; */
}

ul.liste-etablissement {
	/* flex-grow: 1; */
}

ul.liste-circuit {
	flex-grow: 1;
}

.jour {
	display: flex;
	flex-wrap: wrap;
	border-bottom: solid;
}

.jour:last-child {
	display: flex;
	flex-wrap: wrap;
	border-bottom: none;
}

.form-group.form-check {
	padding-left: 0;
}

.time-with-unit {
	display: flex;
	align-items: center;
	gap: 1rem;
}

.trajets .time{
	font-size: 1rem;
}

.daily-resume{
	max-width: 1200px;
	margin: auto;
}

.daily-resume td{
	border-width: 2px;
	text-align: center;
}

.all-selected-jour{
	position: absolute;
	right: 10px;
	top: 10px;
}

td.calendrier-semaine {
	min-width: 15px;
	width: 13px;
	vertical-align: middle;
	font-size: 14px;
	background: #64b5f62b;
	border-radius: 15px;
	margin: 15px;
}

.type.etat-chauffeur[data-etat] {
    display: block;
}

.rapport-kilometrage-routes thead, .rapport-kilometrage thead {
    position: sticky;
    top: -10px;
	background-color: white;
}

#scheduler_all .carte-map{
	display: none;
}