@font-face {
	font-family: "roboto";
	src: url('roboto.regular.ttf');
  }

@font-face {
	font-family: "Manrope";
	src: url('Manrope-Light.ttf');
}

html {
	line-height: 1.15;
	-webkit-text-size-adjust: 100%;
	-webkit-tap-highlight-color: rgba(0, 0, 0, 0);
  }
body{
	width:100%;margin:auto;
	/*font-family: -apple-system,system-ui,roboto,Arial,sans-serif;*/
	
	font-family: roboto;
	font-family: "Helvetica Neue", "Segoe UI", Helvetica, Arial, sans-serif;
	/*font-family: "Manrope";*/
    -webkit-font-smoothing: antialiased;
	font-size: 1rem;   font-size: 14px;  
	line-height: normal;
	font-weight: 300; font-weight: 400;
	line-height: 1.5;
}

.panel_page{
    position:fixed;
    width:100%;
    height: 100vh;
}
.panel_page_full{
    position:fixed;
    width:100%;
    height: 100vh;
	z-index: 9999999999999999999;
}
.panel_page_head{
    position:fixed;
    width:100%;
	z-index: 999999999999999;
}
.headerGobale{
	z-index: 99999999999999999;
}
.header_settings{
	z-index: 9999999999999999999;
}
.container_header_bar{
	width: 96%;
	margin: auto;
	height:51px;
}
.panel_page_main{
    position:fixed;
	z-index: 999999;
    width:100%;
    height:100vh;
   
}
.page_main_cont{
    width:100%;
	height:100vh;
	padding-top: 60px;
	overflow-y:scroll;
}
.page_main_cont_left_nav{
  width:16%; position:fixed ; 
  height: 100%; 
  background-color: var(--left_nav);
}
.panel_partial_main_cont{
	position:fixed ;
	width:84%; 
	height:100vh;
	left: 16%; 
	overflow-y: scroll;
}
.contnav_left_menu_Items{
   display: block;
   width: 90%; 
   margin: auto; 
}
.contnav_left_menu_Items ul{
	margin-left: 0px;
	padding-left: 0px;
}

.center_v_align-items{
    text-align: center;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    -webkit-justify-content: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    -webkit-align-items: center;
    align-items: center;
}
.bottom_v_align-items{
    text-align: center;
    display: flex;
    -webkit-box-pack:end;
    -ms-flex-pack:end;
    -webkit-justify-content: center;
    justify-content: center;
    -webkit-box-align:baseline;
    -ms-flex-align:baseline;
    -webkit-align-items:center;
    align-items:flex-end;
}
.d-flex{
	display: flex;
}
.middle_disp{
	align-items: center;
}
.bottom_disp{
	align-items:flex-end;
}
.card {
    box-shadow: 0 0 0 0 rgba(90, 113, 208, 0.11), 0 4px 16px 0 rgba(167, 175, 183, 0.33);
    -webkit-box-shadow: 0 0 0 0 rgba(90, 113, 208, 0.11), 0 4px 16px 0 rgba(167, 175, 183, 0.33);
    -moz-box-shadow: 0 0 0 0 rgba(90, 113, 208, 0.11), 0 4px 16px 0 rgba(167, 175, 183, 0.33);
    -ms-box-shadow: 0 0 0 0 rgba(90, 113, 208, 0.11), 0 4px 16px 0 rgba(167, 175, 183, 0.33);
    transition: background 0.25s ease;
    -webkit-transition: background 0.25s ease;
    -moz-transition: background 0.25s ease;
    -ms-transition: background 0.25s ease;
    border: none;
    border: none;
	border-radius: 20px;
	background-clip: border-box;
    border: 1px solid #e3e3e3;
    border-radius: 20px;
}
.card .card-body {
    padding: 1.5rem 1.5rem;
}

.textLoader{ color: white; }
a{  text-decoration:none;color: #448eef; }
a:hover{ color: #00d2ff;}
li{ list-style: none}
img{width:100/9; color:#38618e; max-width:100%; height:auto;}
video{width:100%; height:auto;}
p{ font-size:16px;line-height:16px;}
.inputText:focus ,.input:focus, input:focus{outline: none;}
.select:focus,select:focus{outline: none;}

.msgErr{ color:rgb(152,12,19)}
.offPC{display: none}
.cont{width:100%;margin:auto;}

.msgErrConnexion{
	background:rgb(152,12,19);
	position:fixed;
	display:none;
	bottom:100px;
	left:30%;width:40%;
	color:rgb(220,220,220);
	z-index:999999999999999;
	padding:2px;border-radius:5px;
}
.msgErrConnexion .bi-cloud-slash{
	color:white;
	
}
.fixed_container{
	position:fixed;
	width: 100%;
	top:0px;left:0px;
	height:100vh;
	z-index:999999999999999; 
}
.float_window{
	position: fixed; 
	z-index:99999999999999999; 
	top:0px; height:100vh;
    width:100%; 
}

.row {
	display: -ms-flexbox;
	display: flex;
	-ms-flex-wrap: wrap;
	flex-wrap: wrap;
	width:100%;
	-ms-flex: 0 0 100%;
	flex: 0 0 100%;
	max-width:100%;
  }
.row-1 ,.row-1S{width:98%;margin:auto; }
.row-2, .row-2S{width:96%;margin:auto; }
.row-3, .row-3S{width:90%;margin:auto; }
.row-1{width:94%;margin:auto; }
.row-4 , .row-4S{width:84%;margin:auto;}
.row-5{width:75%;margin:auto;}
.row-6{width:66%;margin:auto;}
.row-7{width:50%;margin:auto;}
.row-8{width:42%;margin:auto;}
.row-9{width:33%;margin:auto;}
.row-10{width:25%;margin:auto;}

/***/
.col-xl-auto {
	position: relative;
	width: 100%;
	padding-right: 15px;
	padding-left: 15px;
  }
  
  .col {
	-ms-flex-preferred-size: 0;
	flex-basis: 0;
	-ms-flex-positive: 1;
	flex-grow: 1;
	max-width: 100%;
  }
  
  .col-auto {
	-ms-flex: 0 0 auto;
	flex: 0 0 auto;
	width: auto;
	max-width: 100%;
  }
  
  .col-1, .col-1s,.col-2,.col-2s,.col-3, .col-3s,.col-4, .col-4s,.col-5,.col-6,.col-7,.col-7s,.col-8,.col-9,.col-10,.col-11,.col-12,.col-4s,.col-5s,.col-6s ,.col-7s,
 .col-8s,.col-9s,.col-10s,.col-11s
  {
	  	display: inline-block;
	  	/*padding-right: 15px;*/
 		/*padding-left: 15px;*/
	}
  .col-1 ,.col-1s{
	-ms-flex: 0 0 8.333333%;
	flex: 0 0 8.333333%;
	max-width: 8.333333%;
  }
  
  .col-2 ,.col-2s{
	-ms-flex: 0 0 16.666667%;
	flex: 0 0 16.666667%;
	max-width: 16.666667%;
  }
  
  .col-3 ,.col-3s{
	-ms-flex: 0 0 25%;
	flex: 0 0 25%;
	max-width: 25%;
  }
  
  .col-4 ,.col-4s{
	-ms-flex: 0 0 33.333333%;
	flex: 0 0 33.333333%;
	max-width: 33.333333%;
  }
  
  .col-5 ,.col-5s {
	-ms-flex: 0 0 41.666667%;
	flex: 0 0 41.666667%;
	max-width: 41.666667%;
  }
  
  .col-6 ,.col-6s ,.col-6RM{
	-ms-flex: 0 0 50%;
	flex: 0 0 50%;
    width: 50%;
  }
  
  .col-7 ,.col-7s{
	-ms-flex: 0 0 58.333333%;
	flex: 0 0 58.333333%;
	max-width: 58.333333%;
  }
  
  .col-8 ,.col-8s{
	-ms-flex: 0 0 66.666667%;
	flex: 0 0 66.666667%;
	max-width: 66.666667%;
  }
  
  .col-9 ,.col-9s{
	-ms-flex: 0 0 75%;
	flex: 0 0 75%;
	max-width: 75%;
  }
  
  .col-10 ,.col-10s{
	-ms-flex: 0 0 83.333333%;
	flex: 0 0 83.333333%;
	max-width: 83.333333%;
  }
  
  .col-11, .col-11s {
	-ms-flex: 0 0 91.666667%;
	flex: 0 0 91.666667%;
	max-width: 91.666667%;
  }
  .col-12 {
	-ms-flex: 0 0 100%;
	flex: 0 0 100%;
	max-width: 100%;
  }


  .col-1-6-3 {
	-ms-flex: 0 0 8.333333%;
	flex: 0 0 8.333333%;
	max-width: 8.333333%;
	display: inline-block;
  }
  
 
  .col-2-2, .col-2-3-2  {
	-ms-flex: 0 0 16.666667%;
	flex: 0 0 16.666667%;
	max-width: 16.666667%;
	display: inline-block;
  }
  .col-3-2-1 ,.col-3-2 {
	-ms-flex: 0 0 25%;
	flex: 0 0 25%;
	max-width: 25%;
	display: inline-block;
  }

  .col-8s{}
  .me-0{margin-right:0!important}.me-1{margin-right:0.25rem!important}.me-2{margin-right:0.5rem!important}.me-3{margin-right:1rem!important}.me-4{margin-right:1.5rem!important}.me-5{margin-right:3rem!important}.me-6{margin-right:12px!important}.me-7{margin-right:30px!important}.me-8{margin-right:10px!important}.me-9{margin-right:20px!important}.me-auto{margin-right:auto!important}

.modalBox, .contextMenu{
	width:100%;
	position:fixed;
	height:100vh;z-index:99999999999999;  
	background:rgba(120,120,120,0.6);
    display:none;  top: 0px;
}
.modalBox  .boxContainer{
	width:30%; margin:auto; 
	position:absolute; top:100px; left:35%;
	background:white;
	border-radius:15px;
}
.modalBox .head_dialogBox{
  background:rgb(220,220,220);
  border-radius:15px 15px 0px 0px;
  padding:5px; padding-left:15px;
  font-weight:500;
}

.modalBox .bottomStyleDisplay{
	bottom:0px; 
	margin:auto; 
	box-shadow: rgba(121,121,121,.35) 1px 5px 10px;
	border-radius:25px 25px 0px 0px;
	
}

.dialogBox{ 
   width:30%; 
   line-height: 16px;
   padding:0px; 
   padding-bottom:0px;
   text-align: center;
   box-shadow: rgba(121,121,121,.35) 1px 5px 10px;
   border-radius: 8px;
   
    opacity: 1;
    -webkit-transition-duration: 400ms;
    transition-duration: 400ms;
    -webkit-transform: translate3d(0, 0, 0) scale(1);
    transform: translate3d(0, 0, 0) scale(1);
}
.dialogBox_medium { 
	width:60%; 
}
.dialogBox_large{ 
	width:80%; 
}
.dialogBox  .dialogBox_cont_icon{
	padding: 8px;
}
.dialogBox  .dialogBox_cont_text{
	padding: 8px;
}

.dialogBox  .dialogBox_main{
	padding: 8px; line-height:20px; max-height: 80vh;
}
.dialogBox  .dialogBox_titre{
	color:black; font-weight: 600;
	padding-top:12px; padding-bottom: 13px;
}
.dialogBox .dlgb_description{
   width:90%; margin:auto; line-height:16px;
}
.dialogBox_footer, .dialogBox_footer_dbtn{
	border-radius: 0px 0px 8px 8px;
	text-align: center;
	border-top:solid 0px rgb(220,220,220);
	margin-top: 8px;
	min-height: 58px;
	padding-top: 10px;
	background: rgb(50,54,57);
}
.dialogBox button{
	min-width:30% ; border-radius: 8px;
	min-height: 30px;
	margin:auto; 
	background: transparent;
	border:solid 0px var(--primary);
	color:var(--primary);
	/*box-shadow: rgba(121,121,121,.35) 1px 5px 10px;*/
	/*
	box-shadow: 0 3px 4px 0 rgba(0, 0, 0, 0.14), 0 1px 8px 0 rgba(0, 0, 0, 0.12), 0 3px 3px -2px rgba(0, 0, 0, 0.4);
	*/
}
 .dialogBox .dlg_btn_primary{
	margin:auto; margin-right: 5%;
	background: var(--primary);
	color: black;
}

.dialogBox_footer_dbtn button{
	float:left; margin-left:5%;
	min-height: 30px;
}
.dialogBox_footer_dbtn .dlg_btn_primary{
	float:right; margin-right:5% ;
}
.dialogBox .inputBox{
	display:flex;
	align-items: center;
	background: white;
	margin-top:15px ;
	border-radius:5px;
	padding-top:5px ; padding-bottom: 5px;
	padding-left: 5px;
}
.dialogBox input{
	flex-grow: 1;
	box-sizing: border-box;
    height: 30px;
    margin: 0;
    padding: 0 5px; padding-top: 5px; padding-bottom: 5px;
    border-radius: 5px;
	border: none;
    max-width: 90%;
    font-size: 16px;
    font-family: inherit;
    box-shadow: 0 0 0 rgba(0, 0, 0, 0);
    -webkit-appearance: none;
    -moz-appearance: none;
    -ms-appearance: none;
	appearance: none;
	
}
.animateFrameDlg{
    position:fixed ;
	bottom: 0px; 
	width:100%; 
	height: 100vh;
	z-index:999999999999999;
	display: none;
	background: rgba(10,10,10,0.6);
	text-align: center;
    -webkit-box-pack:end;
    -ms-flex-pack:end;
    -webkit-justify-content: center;
    justify-content: center;
    -webkit-box-align:baseline;
    -ms-flex-align:baseline;
    -webkit-align-items:center;
    align-items:flex-end;
}
.animateFrameDlg .cont_animateFrameDlg{
	width:100%; 
	
}

.btn_fill{
	width: 100%;
}

.btn{
	height: 50px;
	font-size:16px ;min-width:40%;
}
.tags ul li {
    display: inline-block;
}
.tags ul a {
    color: #38618e;
    font-size: 14px;
    padding: 6px 14px;
    margin: 0 6px 8px 0;
    border: 1px solid rgba(27, 47, 69, 0.15);
    display: inline-block;
    border-radius: 50px;
    transition: 0.3s;
}
@media screen and (min-width:749px)and (max-width:900px){
	.row-1, .row-2, .row-3,.row-4,.row-5, .row-6, .row-7, .row-8, .row-9, .row-10, .row-11,.row-12{width:100%; }
	.col-1,.col-2,.col-3,.col-4, .col-5,.col-6,.col-7,.col-8,.col-9,.col-10,.col-11,.col-12{
		max-width:100%;width:100%;
		flex: 0 0 100%;
		max-width: 100%;
		/*padding-right: 10px;
		padding-left: 10px; */
	 }
	.col-1-6-3 {
		-ms-flex: 0 0 16.666667%;
		flex: 0 0 16.666667%;
		max-width: 16.666667%;
		display: inline-block;
	  }

	.col-2-3-2 {
		-ms-flex: 0 0 33.333333%;
		flex: 0 0 33.333333%;
		max-width: 33.333333%;
	  }

	.col-3-2-1, .col-3-2 {
		-ms-flex: 0 0 50%;
		flex: 0 0 50%;
		max-width: 50%;
	}
	.panel_page_head{
		position:fixed;
		width:100%;
		z-index: 99999999999;
		padding-top:20px;
	}
}


@media screen and (max-width:748px) {
	.panel_page_head{
		position:fixed;
		width:100%;
		z-index: 99999999999;
		padding-top:39px;
	}
	.container_header_bar{
		width: 100%;
		margin: auto;
		height:50px;
	}
	.page_main_cont{
		
		padding-top:90px;
		overflow-y:scroll;
	}
	.page_main_cont_left_nav{
		width:100%;
		display: none;
	}
	.panel_partial_main_cont{
		width:100%; 
		left: 0px;
	}

	.row-1, .row-2, .row-3,.row-4,.row-5, .row-6, .row-7, .row-8, .row-9, .row-10, .row-11,.row-12{width:100%; }
	.col-1, .col-2 , .col-3 , .col-4 ,.col-5 , .col-6 , .col-7, .col-8, .col-9, .col-10, .col-11, .col-12
	,.col-6RM{
		width:100%; max-width:100%;
		flex: 0 0 100%;
		max-width: 100%;
		/*padding-right: 10px;
		padding-left: 10px;*/
	 }

	 .col-1-6-3 {
		-ms-flex: 0 0 25%;
	     flex: 0 0 25%;
	     max-width: 25%;
	  }
	
	.col-2-3-2{
		-ms-flex: 0 0 50%;
		flex: 0 0 50%;
		max-width: 50%;
    }

	 .col-3-2-1{
		-ms-flex: 0 0 100%;
		flex: 0 0 100%;
		max-width: 100%;
    }
  	.col-3-2{
		-ms-flex: 0 0 50%;
		flex: 0 0 50%;
		max-width: 50%;
	}
	

	.modalBox  .boxContainer{
		width:92%; margin:auto; 
		left:4%;
		border-radius:15px;
	}


	.dialogBox{ 
		width:90%; 
		border-radius:7px;
	}
	.dialogBox_medium ,.dialogBox_large{ 
		width:94%; 
	}
	.dialogBox button{
		font-size: 16px;
		min-width:40% ; 
		height:45px;
		border-radius: 8px;
		background: transparent;
		border:solid 0px var(--primary);
		color:var(--primary);
		/*box-shadow: rgba(121,121,121,.35) 1px 5px 10px;*/
		/**/
		box-shadow: 0 3px 4px 0 rgba(0, 0, 0, 0.14), 0 1px 8px 0 rgba(0, 0, 0, 0.12), 0 3px 3px -2px rgba(0, 0, 0, 0.4);
	    
	}
      /**/
	 .msgErrConnexion{
		display:none;
		bottom:50px;
		left:0%;left: 1%;
		width:96%;
		padding:2px;border-radius:2px;
		font-size: 16px;
		padding-top: 8px;
		padding-bottom: 8px;
	}
	/*Menu contextuel*/
	.contextMenu{
		position: fixed; height:100vh;width:100%;
		top:0px;
		z-index:99999999999999999999999;

	}
	.contextMenu .cont_contex_menu{
		position: fixed;
		bottom:0px;
		width:60%;
		right:0px;
		font-size: 24px;
	}
	.contextMenu .cont_contex_menu i{
		margin-right: 6px;
	}
	.contextMenu .cont_contex_menu li{
		padding-top: 8px; padding-bottom: 8px;
	}

	.btn{
		font-size:16px ;min-width:40%; min-height: 30px;
	}
 }
	

