/*COULEURS*/
/*
Vert clair : #c3e2df
Vert foncé : #FFB300
Bleu clair : #6D6866
Bleu foncé : #95c8e6
*/
@font-face {
    font-family: Lato;
    src: url(fonts/Lato_Regular.ttf);
}

html, body{
    height:100%;
}

body{
    margin:0;
    font-family:'Lato', 'sans-serif';
	touch-action: auto !important;
}
h1{
    font-weight:normal;
    font-size:1.4em;
}
h2{
    font-weight:normal;
    font-size:1em;
    text-align: left;
}
h2.titre{
	font-size:15px;
	font-weight:bold;
}
.h2_top{
    margin:40px 0 15px;
}
.titre_bloc{
	display:inline-block;
	width:49%;
	font-size:1.2em;
}
.titre_bloc:after{
	content:'';
    width: 100px;
    height: 1px;
    clear: both;
    display: block;
	margin-top:10px;
}
.boutons_bloc{
	display:inline-block;
	width:49%;
	text-align:right;
}
a{
    color:inherit;
    text-decoration: none;
	cursor:pointer;
}
#content{
    height:100%;
}
#content:after{
    content:'';
    display:block;
    clear:both;
}
.site_container{
    max-width:1200px;
    margin:auto;
    padding: 30px 10px 30px 25px;
    box-sizing: border-box;
}

.container_bouton{
    text-align:center;
    margin:20px auto;
}
.bouton {
    border: 1px solid #FFF;
    padding: 10px 12px;
    transition: 0.2s ease;
    display: inline-block;
    margin: 10px auto;
    position: relative;
    overflow: hidden;
    z-index: 1;
    background: #FFF;
    text-transform: inherit;
    height: auto;
    line-height: inherit;
    text-transform: uppercase;
    font-size:0.9em;
    color:#FFF;
    cursor:pointer;
}
.bouton:after {
    position: absolute;
    background: #FFB300;
    height: 120%;
    width: 120%;
    top: 50%;
    left: 50%;
    transform: translateY(-50%);
    content: '';
    display: block;
    transform: translateX(-50%) translateY(-50%);
    transition: 0.2s ease;
    z-index: -1;
}
.bouton:hover {
    color: #FFB300;
    border: 1px solid #FFB300;
}
.bouton:hover:after {
    height: 0;
}
.bouton.bouton_gris{
	background:#f6f6f6;
	color:#AAA;
	border:1px solid #f6f6f6;
}
.bouton.bouton_gris:after{
	background:#f6f6f6;
	color:#AAA;
	border:1px solid #f6f6f6;
}
.loaderGif { 
	text-align: center;
	position:absolute;
	top:50%;
	left:50%;
	transform: translate(-50%, -50%);
}
.loaderGif img { 
	text-align: center;
	margin: 0 auto !important;
	width:auto !important;
	height: 60px !important;
}

.display_none{
	display:none;
}

.error{
	display:none;
	color:#f05158;
	padding:5px 10px;
	text-align:center;
}
.success{
	display:none;
	color:#4dc935;
	padding:5px 10px;
	text-align:center;
}
.notice{
	color:#5a90b4;
	padding:5px 10px;
	text-align:center;
	margin-bottom:20px;
}

.error.display_block, .success.display_block{
	display:block;
}

.margin_20{
	margin:20px auto;
}

.no_cursor{
	cursor:default !important;
}

.text_reduit{
	width:80px;
}

.underline{
	text-decoration:underline;	
}

.btn_close_app{
	color:#CCC !important;
}

.btn_internet{
	color:#CCC !important;
}
.btn_internet.active{
	color:#63ae49 !important;
}

#connexion_ok, #offline_ok{
	color:#63ae49;
	font-size:1.1em;
}
#connexion_not_ok, #offline_not_ok{
	color:#e06666;
	font-size:1.1em;
}
#connexion_ok .icon-connection, #connexion_not_ok .icon-connection{
	margin-right:15px;
}
#offline_ok .icon-mobile, #offline_not_ok .icon-mobile{
	margin-right:15px;
}

.numero_version, .data_to_sync{
	margin-top:10px;
}

.bouton_dl_excel{
	border:1px solid #282826;
	padding:5px;
	display:inline-block;
	vertical-align:middle;
}
.bouton_dl_excel:after{
	background:#282826 !important;
}
.bouton_dl_excel:hover{
	color: #282826 !important;
    border: 1px solid #282826 !important;
}
.bouton_dl_excel:hover:after{
	height:0;
}
.bouton_dl_excel img{
	vertical-align:middle;
	display:inline-block;
	height:40px;
	margin-right: 5px;
}

.bouton_importer{
	vertical-align:top;
	margin:2px auto;
    margin-left: 10px;
	height:12px;
	background: #282826;
    padding: 4px 4px;
}

.zoom_all.active, .repeat_head.active{
	color:#69b876;
}

.zone_multi .bouton{
	margin-bottom:0;
	margin-right:10px;
	
}

.ligne_repete_entete{ display:none; }
.style_table.repete_entete .ligne_repete_entete{ display:table-row; }

#reactive_sync{
	color:red;
	font-size:11px;
	line-height:0;
	margin-bottom:20px;
    cursor: pointer;
}

.ligne_verte{
	background:#84d1ad !important;
}

#user_connecte{
	display: inline-flex;
    vertical-align: top;
	padding-top:35px;
	margin-left:20px;
	font-size:0.8em;
}

[type="checkbox"]+label.roadbook_archive{
	margin-right:25px;
	font-size:0.9em;
}

/*************DIV TABLE*************/
.table{
	display:table;
	width:100%;
}
.table-cell{
	display:table-cell;
}
.inline_block{
	display:inline-block;
}

/*************PARAMETRES HEADER TABLEUR*************/
#param_header_tableur .select_type_champ_tableur, #param_header_tableur .select_format_tableur{
	width:145px;
	margin-left:10px;
}
/*************HEADER*************/
header{
	position:fixed;
	z-index: 2;
	width:100%;
	background:#FFF;
	top:0;
	left:0;
}
header:after{
    display:block;
    clear:both;
    content:'';
}
header>img{
	cursor: pointer;
    height:50px;
    margin:5px 10px 0;
}
#header_droite{
    float:right;
}
#header_droite>div{
    display: inline-block;
    vertical-align: middle;
}
#langues img{
    width:28px;
    margin: 16px 10px;
    display: inline-block;
    vertical-align: middle;
}
#header_droite>div#header_options span{
    color:#6D6866;
    font-size:2em;
    display:inline-block;
    vertical-align: middle;
    margin:10px;
}

.h1_top{
    background:#c3e2df;
    color:#FFF;
    padding:16px;
    margin:auto;
	box-sizing:border-box;
	position:relative;
}
.h1_top>div{
	position:absolute;
	right:5px;
	top:50%;
	transform: translateY(-50%);
}

.h1_top a{
	height: 40px;
    background: #FFF;
	display:inline-block;
	margin:0 5px;
	opacity:0.9;
	transition:0.2s ease;
	border:1px solid #FFF;
	vertical-align:top;
}
.h1_top a:hover{
	opacity:1;
}
.h1_top a#btn_export_excel{
	right: 120px;
}
.h1_top a#btn_export_pdf{
	right: 65px;
}
.h1_top a img{
	height:30px;
	margin:5px;
}
.h1_top #active_mode_offline{
	right:10px;
	font-size:1.2em;
	color:#000;
	background:#FFF;
	padding:0 7px;
	border:1px solid #FFF;
}
.h1_top #active_mode_offline span{
	vertical-align:middle;
}
.h1_top #active_mode_offline.active{
	background:#69b876;
	color:#FFF;
}

/*************EDITION ROADBOOK*************/
.float_left{
    float:left;
}
.style_form{
    max-width:980px;
    margin:auto;
}
.style_form>h1{
    text-align: center;
}
.style_form .container_group{
    text-align:center;
    display:table;
    width:100%;
    margin:25px auto;
}
#popup_ajout_import_csv .style_form .container_group{
	display:block;
}
.style_form .container_group br{
    clear:both;
}
.style_form .container_group h1{
    text-align:center;
	margin-top:0;
	position:relative;
	margin-bottom:35px;
}
.style_form .container_group h1:after{
    position: absolute;
    width: 50%;
    height: 1px;
    bottom: -15px;
    left: 50%;
    transform: translateX(-50%);
    content: '';
    display: block;
    background: #282826;
}
.style_form input[type=text], .style_form input[type=password], .style_form input[type=file], .style_form select, .style_form textarea {
    border: none;
    background: #FFF;
    box-shadow: 0 6px 10px 0 rgba(0, 0, 0, 0.1);
    padding: 8px;
    width: 60%;
    box-sizing: border-box;
    display: inline-block;
    vertical-align: middle;
}
.style_form .select_mini{
    width: 85px;
}
.style_form label{
    min-width: 160px;
    display: inline-block;
    vertical-align: middle;
    margin: 0;
}
.style_form .form_group{
    display:inline-block;
    vertical-align: middle;
    margin:15px;
    text-align: left;
	width:calc(100% - 30px);
}
.style_form .form_group input, .style_form .form_group select{
    float:right;
}
.style_form #container_image_evenement{
    float:left;
}
.clear{
    clear:both;
}
.style_form .container_group2{
    display:table;
}
.style_form .container_group2 h2{
    margin:15px;
}
.style_form .container_group2 .form_group{
    width:calc(100% / 3 - 30px);
}
.style_form .container_group2 .form_group input{
    width:80px;
}

.style_form #container_image_evenement input[type=file] {
    position: relative;
    margin: 30px auto;
    width: 100%;
    display: none;
}

.style_form #container_image_evenement input[type=file]+label {
    border: 1px solid #FFF;
    text-align: center;
    transition: 0.2s;
    cursor: pointer;
    padding: 5px 20px;
    display: inline-block;
    margin:auto;
    position: relative;
    color: #FFF;
    z-index: 1;
    transition: 0.2s ease;
    width: 180px;
    box-sizing: border-box;
    float:right;
}
.style_form #container_image_evenement input[type=file]+label:hover {
    border: 1px solid #FFB300;
}
.style_form #container_image_evenement input[type=file]+label:after {
    content: '';
    top: 50%;
    left: 50%;
    transform: translateX(-50%) translateY(-50%);
    height: 100%;
    width: 100%;
    background: #FFB300;
    display: block;
    position: absolute;
    z-index: -1;
    transition: 0.2s ease;
}
.style_form #container_image_evenement input[type=file]+label:hover:after {
    height:0;
}
.style_form #container_image_evenement input[type=file]+label:hover {
    color:#FFB300;
}
#container_image_evenement p{
    min-width: 160px;
    display: inline-block;
    vertical-align: middle;
    margin: 0;
}
.style_form .span_color, .span_color{   
    background: #FFB300;
    width: 18px;
    height: 18px;
    display: inline-block;
    border-radius: 5px;
    float: right;
	border:1px solid #CCC;
    margin: 3px auto;
	margin-right: -20px;
	cursor:pointer;
	min-width: 0;
}
.colorpicker_submit{
	cursor:pointer;
}

#table_index td{
    text-align: center;
}

.style_table{
	width:100%;
    text-align: center;
    border-collapse: collapse;
}
.style_table thead{
    background:#6D6866;
}
.style_table thead label{
    cursor:pointer;
	text-transform:uppercase;
}
.style_table thead span{
    cursor:pointer;
	font-size:0.8em;
	margin-left:3px;
}
.style_table th, .style_table td{
    font-weight:normal;
}
.style_table th{
    padding:10px;
}
.style_table td{
    text-align: left;
    font-size:0.9em;
    position:relative;
	vertical-align:top;
	padding-top:5px;
	/* overflow:hidden; */
}
.style_table tbody td>div{
	height:100%;
	width:100%;
	padding:10px 5px;
	box-sizing:border-box;
}
.style_table td .check_multi{
    display:none;
}
.style_table td .icon-eye{
    position:relative;
    transition:0.2s ease;
    display:inline-block;
}
.style_table td .icon-unlocked{
    position:absolute;
    top:50%;
    right:-25px;
    transform:translateY(-50%);
    transition:0.2s ease;
    display:none;
}
.style_table tbody tr.ligne_impair{
    background:#c3e2df;
}
.style_table tbody tr.ligne_pair{
    background:#FFB300;
}
.style_table [class^="icon-"] {
    padding:0 5px;
    cursor:pointer;
}
.style_table tbody tr{
    position:relative;
}
.style_table .span_color{ 
    background: #ffffff;
	float: none; 
	vertical-align:middle;
}
.style_table .cke_contents.cke_reset{ 
    height:150px !important;
}
.ligne_tableur.active{
	background:#82d182 !important;
}
.ligne_tableur>td .check_multi + label{
	display:inline-block;
	position:relative;
	margin-top:-4px;
	margin-left:5px;
}
.ligne_tableur>td .check_multi.active + label{
	display:inline;
}
.ligne_tableur input[type=text]{
	background:none;
	border:none;
	padding:3px;
	width:100%;
}
.ligne_tableur input[type=text].active{
	background:#FFF;
	border:1px solid #CCC;
}
.ligne_tableur_vierge input[type=text]{
	padding:3px;
	width:75%;	
}

#barre_boutons{
    background:#f4f4f4;
	margin-top:10px;
	height:53px;
}
#barre_boutons>a{
    color:#282827;
    vertical-align: middle;
    display: inline-block;
    padding:10px 30px;
    border-right:2px solid #eaeaea;
}
#barre_boutons>a:first-child{
    background:#6D6866;
    color:#FFF;
	padding:17px 30px;
}
#barre_boutons>a img{
    height:30px;
}
#barre_boutons #lock_all{
    float:right;
    margin:19px 12px;
}
#barre_boutons #texte_search, #filtre_nom_roadbook, #filtre_etat_roadbook{
	margin:7px 0 7px 7px;
    padding: 12px;
    background: rgba(40, 40, 38, 0.15);
    border: none;
    border-radius: 5px;
	outline:none;
}
#filtre_roadbook{
	border-radius: 5px;
	position:absolute;
	margin:20px;
	width:auto;
}
#barre_boutons #choix_statut{
	margin-left:20px;
}
#barre_boutons #choix_statut span{
	margin:0 7px;
	font-size:13px;
}
#barre_boutons #choix_statut select{
	margin:7px 0 7px 7px;
    padding: 12px;
    background: rgba(40, 40, 38, 0.15);
    border: none;
    border-radius: 5px;
	outline:none;
}
#barre_boutons .icon-search{
    background: rgba(40, 40, 38, 0.20);
    border: none;
    border-radius: 0 5px 5px 0;
	display: inline-block;
	vertical-align: middle;
	padding: 12px 12px 11px 12px;
    margin-left: -1px;
}
#barre_boutons .icon-cross{
	display: inline-block;
	vertical-align: middle;
	margin-left:5px;
}

/************* RESIZABLE TABLE *************/
.grip{
	width:20px;
	height:15px;
	margin-top:-3px;
	background:url('images/grip.png');
	margin-left:-5px;
	position:relative;
	z-index:88;
	cursor:e-resize;
}

.grip:hover{
	background-position-x:-20px;
}
.JCLRLastGrip .grip{
    background-position-y:-18px;
    left:-2px;
}

.dragging .grip{
	background-position-x:-40px;
}

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

.dotted{
	background-image:url('images/dotted.png');
	background-repeat:repeat-y;
}

#sample2Txt{
	float:right;	
}

/*************STYLE MENU*************/
#menu_bouton {
    height: 59px;
    width: 59px;
    z-index: 1;
    position: fixed;
    cursor: pointer;
    display: none;
    left: 0;
    top: 60px;
    text-align: center;
	z-index:0;
}
#menu_bouton:before, #menu_bouton span, #menu_bouton:after {
    content: "";
    height: 3px;
    left: 25%;
    margin-top: -3px;
    pointer-events: none;
    position: absolute;
    top: 50%;
    transition: all 0.3s ease 0s;
    -webkit-transition: all 0.3s ease 0s;
    -moz-transition: all 0.3s ease 0s;
    -ms-transition: all 0.3s ease 0s;
    -o-transition: all 0.3s ease 0s;
    width: 50%;
    background: #FFF;
}
#menu_bouton:before {
    transform: translateY(-10px);
    -webkit-transform: translateY(-10px);
    -moz-transform: translateY(-10px);
    -ms-transform: translateY(-10px);
    -o-transform: translateY(-10px);
}
#menu_bouton:after {
    transform: translateY(10px);
    -webkit-transform: translateY(10px);
    -moz-transform: translateY(10px);
    -ms-transform: translateY(10px);
    -o-transform: translateY(10px);
}
nav#menu_lateral{
    background:#FFB300;
    height:calc(100% - 60px);
    overflow:auto;
    float:left;
    width:20%;
    position:relative;
	position:fixed;
	left:0;
	bottom:0;
	z-index: 2;
}
nav#menu_lateral ul{
    margin:0;
	padding:10px 0px;
}
nav#menu_lateral>ul{
    padding:10px 0;
	height: 50%;
    overflow: auto;
}
nav#menu_lateral ul li{
    color:#FFF;
    list-style-type: none;
    z-index:0;
    text-transform: uppercase;
    margin:0;
    cursor: pointer;
    position:relative;
    transition:0.2s ease;
    overflow:hidden;
	padding-left:50px;
	padding-right:25px;
}
nav#menu_lateral ul li a{
    display:block;
    padding:10px 0;
}
nav#menu_lateral ul li:before {
    width: 0;
    height: 100%;
    position: absolute;
    content: '';
    top: 0;
    left: 0;
    background: rgba(255, 255, 255, 0.3);
    transition: 0.2s ease;
    z-index: -1;
}
nav#menu_lateral ul li:hover:before {
    width:100%;
}
nav#menu_lateral ul li:after{
    border-color: transparent transparent transparent #FFF;
    border-style: solid;
    border-width: 4px 0px 4px 5px;
    height: 0;
    width: 0;
    right: -14px;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    content: '';
    transition: 0.2s ease;
}
nav#menu_lateral ul li:hover:after{
    right:14px;
}
nav#menu_lateral ul li.active:before{
    width:100%;
}
nav#menu_lateral ul li.active:after{
    right:14px;
}
nav#menu_lateral #message_synchro{
	width:100%;
	height:auto;
    color: #FFF;
    font-size: 0.8em;
    position: absolute;
    bottom:0;
    left:0;
    padding:0;
    text-indent:0;
}
nav#menu_lateral #message_synchro li{
    text-transform: none;
    padding:10px 15px;
}
nav#menu_lateral #message_synchro span.icon-loop2{
    margin:10px;
    display:inline-block;
    vertical-align: middle;
	margin-left:0;
}
nav#menu_lateral ul li.synchronisation:before, nav#menu_lateral ul li.synchronisation:after {
    height: 0;
    content: none;
}
nav#menu_lateral ul li.synchronisation {
	cursor:default;
}

.icon-loop2{
	transition:0.2s;
}

#popup_refresh_maj{
	display:none;
	position:fixed;
	width:80%;
	z-index:5;
	text-align:center;
	background:#ee3443;
	color:#fff;
	padding:10px;
	font-size:0.9em;
	cursor:pointer;
}
				
#popup_ajout_bloc_piece_jointe .loader{
	height:100px;
}

@-webkit-keyframes rotating {
	from {
		-webkit-transform: rotate(0deg);
		-o-transform: rotate(0deg);
		transform: rotate(0deg);
	}
	to {
		-webkit-transform: rotate(360deg);
		-o-transform: rotate(360deg);
		transform: rotate(360deg);
	}
}
@keyframes rotating {
	from {
		-ms-transform: rotate(0deg);
		-moz-transform: rotate(0deg);
		-webkit-transform: rotate(0deg);
		-o-transform: rotate(0deg);
		transform: rotate(0deg);
	}
	to {
		-ms-transform: rotate(360deg);
		-moz-transform: rotate(360deg);
		-webkit-transform: rotate(360deg);
		-o-transform: rotate(360deg);
		transform: rotate(360deg);
	}
}

/*
.icon-loop2:hover, #message_synchro li:hover .icon-loop2{
	-webkit-animation: rotating 2s ease infinite;
	-moz-animation: rotating 2s ease infinite;
	-ms-animation: rotating 2s ease infinite;
	-o-animation: rotating 2s ease infinite;
	animation: rotating 2s ease infinite;
}
*/

nav#menu_lateral #message_synchro li{
    text-align:center;
}

nav#menu_lateral img{
	width:auto;
	height:auto;
	max-height:100px;
	margin:10px auto 0;
	display:block;
    width: auto;
    max-height: 100px;
    max-width: 100%;	
}

#setting_menu{
	margin-left:20px;
}

.sort_onglet, .sort_bloc{
	display:table;
	border-bottom:1px solid #CCC;
	padding:5px 10px;
	width:100%;
	background:#FFF;
	box-sizing: border-box;
}
.sort_onglet>div, .sort_bloc>div{
	display:table-cell;
	padding:5px 10px;
    text-transform: uppercase;
}
.sort_onglet>div:first-child, .sort_onglet>div:last-child, .sort_bloc>div:first-child{
	width:80px;
}
.sort_onglet span[class^='icon-'], .sort_bloc span[class^='icon-']{
	margin:0 8px;
}
.sortable-placeholder{height:50px;}

/*************SYNCHRONISATION*************/
#popup_synchronisation #message_conflit{
    color:#f43d3d;
    text-align: center;
	margin-bottom:10px;
}
#popup_synchronisation #message_conflit p{
    margin-bottom:5px;
}
#popup_synchronisation #message_conflit span{
    font-style:italic;
}
#popup_synchronisation .input_synchro{
    text-align: left;
	padding:10px;
}
#popup_synchronisation .input_synchro>div{
    margin:15px auto;
}
#popup_synchronisation .input_synchro label input{
    margin:5px;
}
#popup_synchronisation .input_synchro label{
    max-width:calc(100% - 25px);
    vertical-align: top;
    cursor:pointer;
}
#popup_synchronisation .input_synchro span{
    display:block;
    margin-left:20px;
    font-style:italic;
    cursor:pointer;
}
#popup_synchronisation .input_synchro p{
    margin:0;
	text-align:center;
}

#contenu_conflit .input_synchro:nth-child(odd){
    
}
#contenu_conflit .input_synchro:nth-child(even){
    background:#efedee;
}
/********STYLE SELECT2********/
nav#menu_lateral .select2-container--default .select2-selection--single{
    background:#FFB300;
}
nav#menu_lateral .select2-container{
    width:100% !important;
    color:#FFF;
}
nav#menu_lateral .select2-container .select2-selection--single .select2-selection__rendered{
    border:none;
    border-bottom:1px solid #FFF;
}
nav#menu_lateral .select2-container--default .select2-selection--single .select2-selection__rendered{
    color:#FFF;
    font-size: 1.2em;
    padding: 15px 20px;
}
nav#menu_lateral .select2-container--default .select2-selection--single .select2-selection__arrow b{
    border-color:#FFF transparent transparent transparent;
}
nav#menu_lateral .select2-container--default.select2-container--open .select2-selection--single .select2-selection__arrow b{
    border-color: transparent transparent #FFF transparent;
    border-width: 0 4px 5px 4px;
}

/*************CONTENU RIGHT*************/
#contenu_right{
    float:left;
	width:80%;
	margin-top:60px;
	margin-left:20%;
	min-height:calc(100% - 60px);
}


/*************STYLE POUR LES BOUTONS FIXED*************/
#contenu_right>.h1_top{
	position: fixed;
    right: 0;
	top:60px;
    width: 80%;
	z-index: 2;
}
#contenu_right{
	padding-top:60px;
	min-height: calc(100% - 120px);
}

#barre_boutons{
	position: fixed;
    right: 0;
	top:119px;
    width: calc(80% - 1px);
	z-index: 2;
	margin-top:0;
}
#container_roadbook.site_container{
	padding-top:53px;
	height: calc(100vh - 120px);
    overflow: auto;
	max-width:none;
}
.style_table{
	width:auto;
}

/*************HOME*************/
.indicateur{
	position:relative;
    display:inline-block;
	vertical-align: top;
    width: calc(100% / 3 - 43px);
    margin:20px;
    text-align:center;
    color:#FFF;
    box-sizing: border-box;
}
.indicateur span{
    display: block;
    font-size: 3em;
    margin-bottom: 10px;
}
.indicateur p{
    transition:0.2s ease;
	padding:0 5px;
}
.indicateur a{
    position:relative;
    display:block;
    padding: 60px 0px;
    z-index: 0;
}
.indicateur a:after{
    display:block;
    width:100%;
    height:100%;
    background:#FFF;
    position:absolute;
    content:'';
    top:0;
    left:50%;
    transform:translateX(-50%);
    width:0;
    height:100%;
    transition:0.2s ease;
    z-index:-1;
}
.indicateur a:hover:after{
    width:100%;
}
.indicateur a:hover p{
    color:#2a2a2a;
}
.indicateur span[class^='icon-']{
    font-size: 0.9em;
    padding: 10px;
	position:absolute;
	top:0;
	left:0;
	display:none;
}
.indicateur span.icon-pencil{
	left:0;
}
.indicateur span.icon-cross{
	left:30px;
}
.indicateur:hover span[class^='icon-']{
    color:#2a2a2a;
	display:block;
}

/*************CONTACTS*************/
.table_contacts{
    position:relative;
    margin-bottom:60px;
}
.table_contacts:after{
    position:absolute;
    width:20%;
    height:1px;
    bottom:-30px;
    left:50%;
    transform:translateX(-50%);
    content:'';
    display:block;
    background:#6D6866;
}
.table_contacts .h2_top span{
    margin-left:10px;
}
.table_contacts thead th{
    position:relative;
	overflow:hidden;
}
.table_contacts thead th .icon-unlocked{
    position:absolute;
    top:50%;
    right:0;
    transform:translateY(-50%);
    font-size:0.9em;
    display:none;
}


/*************POP-UP****************/
.overlay {
    background: rgba(0,0,0,0.5);
    width: 100%;
    height: 100%;
    position: fixed;
    z-index: 9;
    display: none;
    top: 0;
    left: 0;
}
.overlay>div {
    background: #FFFFFF;
    padding: 30px 70px;
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translateX(-50%) translateY(-50%);
    width: 58%;
    max-height: 85%;
    overflow-y: auto;
	box-sizing: border-box;
}
.overlay #btn_close {
    position: absolute;
    top: 20px;
    right: 20px;
    cursor: pointer;
    margin: 0;
    height: 20px;
    width: 20px;
    line-height: 20px;
    text-align: center;
}
.colorpicker{
    z-index:10;
}


/*************CONNEXION****************/
.container_connexion{
	/*background:url('images/fond_connexion.jpg') center center no-repeat;
	background-size:cover;*/
	background:#f6f6f6;
	position:relative;
	z-index:0
}
.container_connexion:after{
	content:'';
	background:rgba(255, 255, 255, 0.9);
	display:block;
	height:100%;
	width:100%;
	position:absolute;
	top:0;
	left:0;
	z-index:-1
}
#encart_connexion{
    max-width: 600px;
    margin: auto;
	position:absolute;
	top:50%;
	left:50%;
	transform:translate(-50%, -50%);
    padding: 20px;
    text-align: center;
    background: rgb(109, 104, 102);
    box-sizing: border-box;
	color:#FFF;
}
#encart_connexion .form_group{
    width:calc(100% - 30px);
    text-align: center;
}
#encart_connexion h1{
    margin-top:0;
}
#encart_connexion .bouton{
    margin:20px auto 0;
}
#encart_connexion label{
    text-align:left;
}


/*************LISTE ROADBOOKS****************/
#liste_roadbooks{
    display:table;
    width:100%;
	padding-top:60px;
	height:100%;
	/*background:url('images/fond_liste_roadbooks.jpg') center center no-repeat;
	background-size:cover;*/
	background:#f6f6f6;
	z-index: 0;
	position:relative;
}
#liste_roadbooks:after{
	content: '';
    background: rgba(255, 255, 255, 0.9);
    display: block;
    height: 100%;
    width: 100%;
    position: absolute;
    top: 0;
    left: 0;
    z-index: -1;
}
#liste_roadbooks h2{
	text-align: center;
    margin-top: 0;
    position: relative;
    margin-bottom: 35px;
	margin-top:28px;
	font-weight: normal;
    font-size: 1.4em;
}
#liste_roadbooks h2:after{
	position: absolute;
    width: 50%;
    height: 1px;
    bottom: -15px;
    left: 50%;
    transform: translateX(-50%);
    content: '';
    display: block;
    background: #282826;
}
#liste_roadbooks .bloc_roadbook:nth-child(odd){
    background:rgba(255, 179, 0, 0.6);
    border: 1px solid #ffb300;
}
#liste_roadbooks .bloc_roadbook:nth-child(even){
    background:rgba(151, 147, 146, 0.6);
    border: 1px solid #979392;
}
.bloc_roadbook {
    display: inline-block;
	vertical-align: top;
    width: calc(100% / 5 - 30px);
    margin: 15px;
    text-align: center;
    color: #FFF;
    box-sizing: border-box;
    position: relative;
    cursor:pointer;
}
.bloc_roadbook.display_none {
    display: none;
}
.bloc_roadbook a{
    display:block;
    padding: 30px 0px;
    position:relative;
    z-index: 0;
}
.bloc_roadbook a:after{
    display:block;
    width:100%;
    height:100%;
    background:#FFF;
    position:absolute;
    content:'';
    left:50%;
    top:0;
    transform:translateX(-50%);
    width:0;
    height:100%;
    transition:0.2s ease;
    z-index:-1;
}
.bloc_roadbook a:hover:after{
    width:100%;
}
.bloc_roadbook p{
    transition:0.2s ease;
	margin:10px 0;
}
.bloc_roadbook .actions_roadbook span{
    color:#2a2a2a;
}
.bloc_roadbook a:hover p{
    color:#2a2a2a;
}
.bloc_roadbook .actions_roadbook{
    position:absolute;
    top:5px;
    right:5px;
}
.bloc_roadbook .actions_roadbook span{
    margin:5px;
    display:inline-block;
    vertical-align: middle;
}
.bloc_roadbook .nom_roadbook{
    display: block;
    font-size: 1.1em;
    font-weight: bold;
	height:55px;
}
.bloc_roadbook .client_roadbook, .bloc_roadbook .date_roadbook, .bloc_roadbook .type_roadbook{
    display:block;
	height:20px;
}
.bloc_roadbook .date_roadbook{
    font-weight:bold;
}

.refresh_roadbook_autorise{
	display:block;
	float:right;
	margin-right:20px;
}
.refresh_roadbook_autorise span{
	background:#d4d1d1;
	padding:15px;
	margin:20px auto;
	display:inline-block;
}
.refresh_roadbook_autorise span:before{
	padding-right:10px;
}

.refresh_data{
	display:none;
	text-align:center;
}
.refresh_data div{
	padding:10px;
	margin:15px auto 20px;
	display:inline-block;
	cursor:pointer;
}
.refresh_data span:first-child:before{
	padding-right:10px;
}

/************* POP UP AJOUT BLOC ****************/
.style_form .form_group.type_bloc{
	padding:10px;
	width:100%;
	margin:10px auto;
	background:#efefef;
	font-weight:normal;
	font-size:12px;
	cursor:pointer;
	box-sizing: border-box;
}
.style_form .form_group.type_bloc span{
	width:100%;
	text-align:center;
	display:block;
	font-weight:bold;
	margin:5px auto;
	font-size:14px;
}
.input_color{
	visibility: hidden;
}
/************* PARAM TABLEUR ****************/
.div_param_header_tableur, .div_param_math_tableur{
	width:100%;
	border-bottom:1px solid #EEE; 
	padding:5px;
	padding-left:15px;
	text-align:center;
	box-sizing: border-box;
	
}
.div_param_header_tableur:nth-child(odd){
	background:#FFF;
}
.div_param_header_tableur:nth-child(even){
	background:#EEE;
}
.style_form .div_param_header_tableur input{
	width:120px;
	text-align:left;
	margin:5px 10px;
}
.style_form .div_param_header_tableur select{
	margin:5px 10px;
}
.div_param_math_tableur{
	margin:0px;
	padding:5px 0;
	width:auto;
}
.modele_existant{
	max-height: 250px;
    overflow: auto;
}
.choix_modele_tableur{
	display:inline-block;
	width:42%;
	font-size:0.9em;
	color:#FFF;
	background:#292827;
	margin:5px;
	padding:5px 10px;
	cursor:pointer;
}
.choix_modele_tableur .icon-cross{
	font-size:0.6em;
	margin-left:5px;
	vertical-align:bottom;
	cursor:pointer;
}
.choix_modele_tableur label{
	min-width:120px;
	line-height:20px;
	width:91%;
}

.math_cellule, .math_operateur{
	border:1px solid #444;
	background:#FFF;
	padding:5px;
	margin:5px;
	cursor:pointer;
	font-size:0.7em;
}
.math_operateur{
	padding:5px 10px;
	font-size:0.9em;
	line-height:10px;
}
.math_cellule.disabled{
	background:#EEE;
	cursor:default;
}
.trad_fonction_math{
	font-size:0.9em;
	padding:0 5px;
}
.style_table thead .icon_largeur{
	display:none;
	position:absolute;
	top:50%;
	left:0;
    transform: translateY(-55%);
}
.style_table thead .icon_largeur [class^="icon-"]{
	font-size:0.5em;
	vertical-align: middle;
	margin:0;
}
.style_table thead .icon_largeur .icon-minus{
	margin-left:10px;
}
.style_table thead th:hover .icon_largeur{
	display:inline-block;
}

.expression_similaire{
	position:absolute;
	padding:5px;
	background:rgba(255,255,255,0.8);
	font-size:12px;
	text-align:center;
}

/************* VUE VERTICALE ****************/
#contenu_vue_verticale .style_table{
	width:100%;
}
#contenu_vue_verticale .style_table td{
	padding:5px 10px;
	vertical-align:middle;
}

/************* PARAM FILTRES ****************/
.tabs_filtre{
	display:table;
	width:50%;
	margin:0 auto;
}
.tabs_filtre.display_none{
	display:none;
}
.tabs_filtre a{
	display:table-cell;
	width:33%;
}
.tabs_filtre a.active{
	border-bottom:1px solid #000;
	padding:5px 0;
}
.titre_filtre{
	text-decoration:underline;
}

#tabs_filtres_contenu_tri,#tabs_filtres_contenu_filtre, #tabs_filtres_vue_tri,#tabs_filtres_vue_filtre{
	margin:20px 0;
}

.tabs_filtres_contenu{
	min-height:300px;
}
.tabs_filtres_contenu .table{
	padding:10px 0;
}
.tabs_filtres_contenu .table.ligne_verte{
	padding:5px 0;
}
.tabs_filtres_contenu .table-cell{
	text-align:center;
}
.tabs_filtres_contenu .table-cell select{
	width:100%;
}
.tabs_filtres_contenu .table-cell input{
	width:90%;
}
.tabs_filtres_contenu .table-cell:nth-child(odd){
	width:15%;
}
.tabs_filtres_contenu .table-cell:nth-child(even){
	width:30%;
}
#tabs_filtres_contenu_filtre.tabs_filtres_contenu .table-cell:nth-child(odd), #tabs_filtres_vue_filtre.tabs_filtres_contenu .table-cell:nth-child(odd){
	width:12%;
}
#tabs_filtres_contenu_filtre.tabs_filtres_contenu .table-cell:nth-child(even), #tabs_filtres_vue_filtre.tabs_filtres_contenu .table-cell:nth-child(even){
	width:25%;
}
.tabs_filtres_contenu .table:nth-child(odd){
	background:#FFF;
}
.tabs_filtres_contenu .table:nth-child(even){
	background:#EEE;
}

.detail_filtre{
	font-size:0.8em;
}

/************* PARAM TEXTE LIBRE ****************/
#bloc_texte{
	width:100%;
	height:60%;
	display:block;
	margin:10px auto;
}

/************* PARAM PIECE JOINTE ****************/
.conteneur_pj img{
	display:block;
	margin:0 auto;
	max-height:300px;
}

#preview_pj{
	margin:0 auto;
	max-height:200px;
	display:none;
}

/************* EXPORT ****************/
#export_orientation, #status_to_export{
	margin:15px 0;
}
#export_orientation select, #status_to_export select{
	float:left;
}

.style_form .form_group.export_marge{
	margin:5px 15px;
}
.style_form .form_group.export_marge label{
	min-width:90px;
}
.style_form .form_group.export_marge input{
	float:none;
	width:60px;
	margin-right:10px;
}

#onglet_to_export{
	max-height:200px;
	overflow:auto;
	margin:15px 0;
}
#onglet_to_export div{
	margin:10px 0;
}
#onglet_to_export label{
	text-transform:uppercase;
	font-size:0.9em;
}

/************* CONFIDENTIALITE ****************/
.icon_confidential{
	display:none;
}
#active_confidential, #active_mode_client, #active_setting_onglet, #active_view_as, #active_duplique_onglet{
	float:right;
	margin:12px 10px;
	border:2px solid #282829;
	border-radius:5px;
	padding:5px 8px;
	padding-right:3px;
	cursor:pointer;
	text-align:center;
}
#active_setting_onglet, #active_view_as, #active_duplique_onglet{
	padding:5px;
}
#active_confidential.active, #active_mode_client.active{
	background:#69b876;
}
.bloc_statut{
	display:inline-block;
	margin:5px;
	padding:8px 15px;
	text-align:center;
	border:1px solid #282826;
	background:#282826;
	color:#ffffff;
	cursor:pointer;
	font-size:0.9em;
	min-width:120px;
}
.bloc_statut .icon-unlocked{
	display:inline-block;
}
.bloc_statut .icon-lock{
	display:none;
}
.bloc_statut.active .icon-unlocked{
	display:none;
}
.bloc_statut.active .icon-lock{
	display:inline-block;
}
.bloc_statut.active{
	background:#efedee;
	color:#282826;
}
.bloc_statut span{
	margin-left:15px;
}

/*********** TIMELINE ***********/
#barre_timeline{
	clear:both;
}
#barre_timeline:after{
	clear:both;
	content:'';
	display:block;
}
.btn_timeline{
	padding:5px;
	margin-right:5px;
	margin-top:12px;
	cursor:pointer;
	background:#FFF;
	display:inline-block;
	vertical-align: middle;
}

#popup_ajout_bloc_texte>div{
	width:60%;
}

.option_timeline{
	float:right;
	margin:5px 0;
	font-size:0.9em;
}

/********* NOTE *********/
#note_roadbook{
	padding:15px;
	width:95%;
	min-height:200px;
	box-sizing: border-box;
	background:#efedee;
	margin:0 auto;
	display:block;
	margin-top:10px;
}

/********* IMPORT CSV *********/
#container_import_csv, #container_import_tableur_csv{
	height:100%;
	max-height:500px;
	overflow:auto;
	position:relative;
}
#container_import_csv.vide, #container_import_tableur_csv.vide{
	background:#CCC;
	padding:10px;
}

.param_import_csv{
	text-align:left;
	margin:10px auto 20px;
}

#valide_import_csv, #valide_import_tableur_csv{ display:none; }
#valide_import_csv.active, #valide_import_tableur_csv.active{ display:inline-block; }

/********* IMPORT MATRICE *********/
#container_matrices_dispo{
	height:100%;
	max-height:500px;
	overflow:auto;
	padding:10px;
	text-align:left;
	position:relative;
	min-height:130px;
}
#container_matrices_dispo>div{
	margin:10px auto;
}
#container_matrices_dispo>div.loaderGif{
	margin-top:30px;
}

#valide_import_matrice{ display:none; }
#valide_import_matrice.active{ display:inline-block; }

/********* TALBEUR VUE *********/
.vue_colonne_ligne{
	margin:10px;
}
.vue_colonne_ligne input[type=checkbox]{
	margin:10px;
}

.nom_bloc_dependant{
	font-size:0.9em;
}

/********** STYLE INPUT CHECKBOX **********/
[type="checkbox"]:not(:checked), [type="checkbox"]:checked {
    position: absolute;
    left: -9999px;
    opacity: 0;
}
input[type="checkbox"], input[type="radio"] {
    box-sizing: border-box;
    padding: 0;
}
[type="checkbox"]+label {
    position: relative;
    padding-left: 30px;
	margin-right:10px;
    cursor: pointer;
    display: inline-block;
	vertical-align: middle;
    -webkit-user-select: none;
    -moz-user-select: none;
    -khtml-user-select: none;
    -ms-user-select: none;
}
[type="checkbox"]+label:before, [type="checkbox"]:not(.filled-in)+label:after {
    content: '';
    position: absolute;
    top: 50%;
    left: 0;
	transform:translateY(-50%);
    width: 14px;
    height: 14px;
    z-index: 0;
    border: 2px solid #333333;
    border-radius: 1px;
    transition: .2s;
}
[type="checkbox"]:not(.filled-in)+label:after {
    border: 0;
    -webkit-transform: scale(0);
    transform: scale(0);
}
[type="checkbox"]:checked+label:before {
    width: 8px;
    height: 18px;
    border-top: 1px solid transparent !important;
    border-left: 1px solid transparent !important;
    border-right: 1px solid #25a24e !important;
    border-bottom: 1px solid #25a24e !important;
    -webkit-transform: rotate(40deg);
    transform: rotate(40deg);
    /* -webkit-backface-visibility: hidden; */
    /* backface-visibility: hidden; */
    -webkit-transform-origin: 100% 100%;
    transform-origin: 100% 100%;
	top:-3px;
	left:0;
}
.style_table [type="checkbox"]+label:before, .style_table [type="checkbox"]:not(.filled-in)+label:after {
	width:10px;
	height:10px;
	border-width:1px;
}
.style_table [type="checkbox"]+label{
	padding-left:20px;
}
.style_table [type="checkbox"]:checked+label:before{
	width: 6px;
    height: 12px;
    top: 50%;
    margin-top: -8px;
}

.style_table label.select_all{
	margin-left:10px;
}

.table_import th{
	min-width:200px;
}

.ligne_totaux td{
	padding:10px;
	text-align:center;
	font-weight:bold;
}

.texte_enrichi_tronque{
	height:51px;
	overflow:hidden;
	display: inline-block;
    width: calc(100% - 30px);
}

/***** AUTRES *****/
.overlay > div .loaderGif{
	position:relative;
	transform:none;
	top:0;
	left:0;
}

#container_deplace_bloc_onglet .sort_bloc>div:first-child{
	width:50px;
}
#container_deplace_bloc_onglet .sort_bloc{
	text-align:left;
}

#container_duplique_onglet .sort_bloc label{
	min-width:50px;
}
#container_duplique_onglet .sort_bloc>div:first-child{
	width:50px;
}
#container_duplique_onglet .sort_bloc{
	text-align:left;
}

.table_log{
	width:100%;
}
.table_log tr:nth-child(odd){
	background:#EFEFEF;
}
.table_log td{
	padding:5px;
}

/********* RESPONSIVE *********/
@media only screen and (max-width: 1350px) {
	
	.bloc_roadbook{
		width: calc(100% / 4 - 30px);
	}
}
@media only screen and (max-width: 1200px) {
	
	#contenu_right>.h1_top{
		width: 100%;
	}
	#barre_boutons{
		width:100%;
	}	
	#menu_bouton{
		display:block;
		z-index: 3;
	}
	nav#menu_lateral{
		width:300px;
		left:-100%;
		transition:0.2s ease;
		z-index: 4;
		float:none;
		top:60px;
		height:auto;
		min-height: calc(100vh - 60px);
	}
	nav#menu_lateral.active{
		left:0;
	}
	#contenu_right{
		width:100%;
		margin-left:0;
		min-height:0;
		overflow-x: auto;
	}
	.h1_top{
		padding-left:60px;
		position:fixed;
		z-index: 2;
		width:100%;
	}
	.site_container{
		padding-top:70px;
	}	
	
	.bloc_roadbook{
		width: calc(100% / 3 - 30px);
	}
}
@media only screen and (max-width: 1180px) {
	#popup_ajout_bloc_texte>div{
		width:96%;
	}
	.overlay>div{
		top:10px;
		transform:none;
		left:10px;
		width:calc(100vw - 20px);
	}
	nav#menu_lateral #message_synchro{
		position:static;
	}
}
@media only screen and (max-width: 940px) {
	#encart_connexion label{
		margin:5px auto;
		text-align: center;
	}
	#encart_connexion.style_form .form_group input{
		float:none;
		margin:5px auto;
	}
}
@media only screen and (max-width: 850px) {
	.bloc_roadbook{
		width: calc(100% / 2 - 40px);
	}
	.indicateur{
		width: calc(100% / 2 - 50px);
	}
}
@media only screen and (max-width: 700px) {
	.style_form .form_group{
		text-align: left;
	}
	.style_form label{
		display:block;
		margin-left: 45px;
	}
	.style_form .form_group input, .style_form .form_group select{
		float: none;
    	margin: 10px auto;
		margin-left: 45px;
	}
	.style_form .form_group{
		position:relative;
	}
	.style_form .span_color, .span_color{
		display:block;
	}
	.input_color{
		display:none !important;
	}
	
	#filtre_roadbook, .refresh_roadbook_autorise{
		position:relative;
		display:block;
		float:none;
		text-align:center;
		margin:5px;
	}
	.refresh_roadbook_autorise span{ margin:5px; }
}
@media only screen and (max-width: 600px) {
	
	#active_confidential{
		float:none;
		display:inline-block;
		vertical-align: middle;
	}
	#active_confidential, #active_mode_client, #active_setting_onglet, #active_duplique_onglet{
		float:none;
		display:inline-block;
		vertical-align: middle;
	}
	.h1_top #active_mode_offline{
		padding-top:5px;
		height:35px;
	}
	.h1_top #active_mode_offline span{
		font-size:1.4em;
	}
	#barre_boutons>a:first-child{
		display:block;
		text-align: center;
	}
	#barre_boutons{
		text-align: center;
		height:auto;
		top:155px;
	}
	.option_timeline{
		float:none;
		text-align: center;
	}
	.option_timeline [type="checkbox"]+label{
		margin:10px auto;
	}
	.select2-container{
		width:100% !important;
	}
	.div_bouton_timeline{
		display:block !important;
		margin:10px auto;
	}
	
	#container_roadbook.site_container{
		padding-top: 200px;
	}
	
	.bloc_roadbook, .indicateur{
		width: calc(100% - 40px);
	}
	.bloc_roadbook a{
		padding:30px 0px;
	}
	.h1_top{
		padding-top: 60px;
    	padding-left: 16px;
	}
	.site_container{
		padding-top:103px;
	}
	.style_form input[type=text], .style_form input[type=password], .style_form select, .style_form textarea{
		width: calc(100% - 45px);
	}
	.overlay>div{
		padding:10px;
		width: calc(100vw - 40px);
	}
	html, body, #content{
		height:auto;
	}
	.h1_top>a{
		top:10px;
		transform:none;
	}
	#encart_connexion{
		width:96%;
		max-width:none;
		position:static;
		transform:none;
		margin-top:73px;
	}
	#encart_connexion.style_form .form_group input{
		width:90%;
	}
	h1{
		font-size:1em;
	}
	
	.colorpicker{
		left:0 !important;
	}
}
@media only screen and (max-width: 500px) {
	.style_form .container_group{
		display:block;
	}
	#header_droite>div#header_options span{
		font-size:1em;
	}
	#langues img{
		width: 15px;
    	margin: 23px 10px;
	}
	header>a>img{
		height: 40px;
    	margin: 10px auto;
	}
}