body {
			font-family: 'Roboto Condensed', sans-serif;
			text-align : center;
			margin:0;
			#padding:0;
			#height:100%;
	}
	
	.ics_png {
	
			width:200px;
			
	}
	
	.usn_png {
	
			width:100px;
			
	}
	
	.usn_60_png {
	
			width:60px;
			
	}
	
	.usn_30_png {
	
			width:30px;
			
	}
	
	.cloudp_30_png {
		
			width:30px;
			
	}
	
	.cloudp_50_png {
		
			width:50px;
			
	}
	
	.net_png {
	
			width:30px;
			
	}
	
	#slider {
		position: relative;
		width: 80%;
		margin: auto;
		display: flex;
		align-items: center;
	}
	
	#precedent,
	#pause,
	#suivant {
		cursor: pointer;
		transition: opacity 0.3s ease;
		opacity: 0.2;
		position: absolute;
		font-size: 14px;
		font-weight : bold;
		color: rgba(220, 220, 220, 0.8);
		background-color: rgba(0, 0, 0, 0.5);
		padding: 10px;
		border-radius:5px;
	}

	#precedent {
		left: 0;
	}

	#suivant {
		right: 0;
	}

	#slider:hover #precedent,
	#slider:hover #pause,
	#slider:hover #suivant {
		opacity: 1;
	}
	
	.user_png {
	
			width: 40px;
			height: 40px;
	}
	
	.trans_png {
	
			width: 40px;
			height: 40px;
			padding-top: 50px;
			padding-bottom: 20px;
	}
	
	.admin_png {
	
			width: 40px;
			height: 40px;
			padding-top: 50px;
			padding-bottom: 20px;
	}
	
	.groups_png {
	
			width: 100px;
			height: 70px;
			padding-top: 50px;
			/*padding-bottom: 20px;*/
	}
	
	
	.aria_png {
	
			width: 40px;
			height: 40px;
			padding-top: 50px;
			padding-bottom: 20px;
	}
	
	.python_flask {
			
			width: 140px;
	}
	
	hr {
	
			color : #F2F2F2;
			width: 0%;
	}
	#main {
   
			#min-height:100%;
			#position:relative;
	}

	#footer {
			
			position:relative;
			#bottom:0;
			width:100%;
			height:200px;
			font-size: 14px;
	}
	
	.colr {
	
			width: 50%;
			text-align: right;
			margin:auto;
			
			padding-top:20px;
			padding-bottom:20px;
			
			padding-left:50px;
			padding-right:50px;
	}
	
	.coll {
	
			width: 50%;
			text-align: left;
			margin:auto;
			
			padding-top:20px;
			padding-bottom:20px;
			
			padding-left:50px;
			padding-right:50px;
	}
	
	.colc {
	
			width: 50%;
			text-align: center;
			margin:auto;
			
			padding-top:20px;
			padding-bottom:20px;
			
			padding-left:50px;
			padding-right:50px;
	}
	
	.colc_33 {
	
			width: 33%;
			text-align: center;
			margin:auto;
			
			padding-top:20px;
			padding-bottom:20px;
			
			padding-left:50px;
			padding-right:50px;
	}
	
	.col {
	
			width: 50%;
			text-align: center;
			margin:auto;
			
			padding-top:20px;
			padding-bottom:20px;
			
			padding-left:50px;
			padding-right:50px;
			
	}
	
	.col2 {
	
			#width: 100%;
			text-align: center;
			margin:auto;
			
	}
	
	.tableborder {

		width: 100%;
		border: dashed 1px;
		border-color: #A2A2A2;
		border-collapse: collapse;
		
	}
	
	.vertical-line {
  
		border: 1px solid #A2A2A2;
		display: inline-block;
		margin: 0 20px;
		height: 40px;
		margin-top: 10px;
  
	}
	
	.tableborder th, .tableborder td {
		
		border: dashed 1px;
		border-color: #A2A2A2;
		text-align: center;
	}
	
	.cont_50_nb {
			
			
			width: 50%;
			margin: auto;
			
			padding-top:50px;
			padding-bottom:50px;
	}
	
	input[type=file]::file-selector-button {
	
		border: 1px solid;
		border-color: #A2A2A2;
		border-radius: 5px;
		font-size: 12px;
		background-color:white;
		transition-duration: 0.4s;
		font-family: 'Roboto Condensed', sans-serif !important;
		padding: 5px 15px 5px 15px;/*Agrandit le menu et espace la bordure du texte*/
		font-weight: bold;
	}
	
	input[type=file]::file-selector-button:hover {
	
		color: white;
		/*background-color: orange;*/
		/*border-bottom: 2px solid black;*/
		text-decoration: none;
		font-weight: bold;
		color: #0080FF;
			border-color: #0080FF;
			cursor: pointer;
			color: #0080FF;
	}
	
	.ib {
	
		padding: 5px 15px 5px 15px;/*Agrandit le menu et espace la bordure du texte*/
		border: 1px solid;
		border-color: #A2A2A2;
		border-radius: 5px;
		font-size: 12px;
		background-color:white;
		font-weight: bold;
		transition-duration: 0.4s;
	}
	
	.ib:hover {
	
	color: white;
		/*background-color: orange;*/
		/*border-bottom: 2px solid black;*/
		text-decoration: none;
		font-weight: bold;
		color: #0080FF;
			border-color: #0080FF;
			cursor: pointer;
	
	}
	
	.cont2 {
			
			width: 400px;
			margin: auto;
			padding-top:50px;
			padding-bottom:50px;
			
			border: solid 1px;
			border-color: #CFCFCF;
			border-radius: 30px;
			
			padding-left:20px;
			padding-right:20px;
			
			#box-shadow: 0 4px 10px 3px rgb(0 0 0 / 10%);
			
			overflow:auto;
			position: absolute;
			top:0;
			bottom: 0;
			left: 0;
			right: 0;
	
		height:445px;
	}
	
	.cont2_ {
			
			width: 50%;
			margin: auto;
			padding-top:20px;
			padding-bottom:20px;
			
			border: solid 1px;
			border-color: #CFCFCF;
			border-radius: 15px;
			
			padding-left:20px;
			padding-right:20px;
			
			box-shadow: 0 4px 10px 3px rgb(0 0 0 / 10%);
			
			overflow:auto;
	}
	
	.cont5_ {
			
			width: 80%;
			margin: auto;
			padding-top:20px;
			padding-bottom:20px;
			
			border: solid 1px;
			border-color: #CFCFCF;
			border-radius: 15px;
			
			padding-left:20px;
			padding-right:20px;
			
			box-shadow: 0 4px 10px 3px rgb(0 0 0 / 10%);
			
			overflow:auto;
	}
	
	.cont5__ {
			
			width: 80%;
			margin: auto;
			padding-top:20px;
			padding-bottom:20px;
			
			border: solid 1px;
			border-color: #CFCFCF;
			border-radius: 15px;
			
			box-shadow: 0 4px 10px 3px rgb(0 0 0 / 10%);
			
			overflow:auto;
	}
	
	ul.myUL {
  
	display: inline-block;
	width: 90%;
	text-align: left;
	color:#08298A;

	}
	
	.cont6 {
			
			width: 100%;
			margin: auto;
			padding-top:50px;
			padding-bottom:50px;
			
			border: dashed 1px;
			border-color: #CFCFCF;
			border-radius: 30px;
			
			padding-left:20px;
			padding-right:20px;
			
			box-shadow: 0 4px 10px 3px rgb(0 0 0 / 10%);
			
			overflow:auto;
	}
	
	.cont6_ {
			
			width: 100%;
			margin: auto;
			padding-top:50px;
			padding-bottom:50px;
			
			border: solid 1px;
			border-color: #CFCFCF;
			border-radius: 30px;
			
			box-shadow: 0 4px 10px 3px rgb(0 0 0 / 10%);
			
			overflow:auto;
	}
	
	.cont6_l {
			
			width: 100%;
			margin: auto;
			padding-top:50px;
			padding-bottom:50px;
			
			border: solid 1px;
			border-color: #CFCFCF;
			border-radius: 30px;
			
			box-shadow: 0 4px 10px 3px rgb(0 0 0 / 10%);
			
			overflow:auto;
	}
	
	.cont6_r {
			
			width: 100%;
			margin: auto;
			padding-top:50px;
			padding-bottom:50px;
			
			border: solid 1px;
			border-color: #CFCFCF;
			border-radius: 30px;
			
			box-shadow: 0 4px 10px 3px rgb(0 0 0 / 10%);
			
			overflow:auto;
	}
	
	.cont5 {
			
			width: 80%;
			margin: auto;
			padding-top:50px;
			padding-bottom:50px;
			
			border: dashed 1px;
			border-color: #A2A2A2;
			border-radius: 30px;
			
			padding-left:20px;
			padding-right:20px;
			
			box-shadow: 0 4px 10px 3px rgb(0 0 0 / 10%);
			
			overflow:auto;
	}

	.cont_p {
		
		width: 95%;
		margin: auto;
		margin-top: 20px;
		padding-top:5px;
		padding-bottom:20px;
		
		border: solid 1px;
		border-color: #ccc;
		border-radius: 10px;
		
		padding-left:20px;
		padding-right:20px;
		
		# box-shadow: 0 4px 10px 3px rgb(0 0 0 / 10%);
		
		overflow:auto;
	}
	
	.cont_p_nw {
		
		margin: auto;
		margin-top: 20px;
		padding-top:10px;
		padding-bottom:20px;
		
		border: solid 1px;
		border-color: #ccc;
		border-radius: 10px;
		
		padding-left:20px;
		padding-right:20px;
		
		# box-shadow: 0 4px 10px 3px rgb(0 0 0 / 10%);
		
		overflow:auto;
	}
	
	.cont_p_l {
		
		width: 100%;
		margin: auto;
		margin-top: 20px;
		padding-top:5px;
		padding-bottom:20px;
		
		border: solid 1px;
		border-color: #ccc;
		border-radius: 10px;
		
		margin-left:10px;
		#padding-right:20px;
		
		# box-shadow: 0 4px 10px 3px rgb(0 0 0 / 10%);
		
		overflow:auto;
	}
	
	.cont3 {
			
			width: 60%;
			margin: auto;
			padding-top:50px;
			padding-bottom:50px;
			
			border: dashed 1px;
			border-color: #A2A2A2;
			border-radius: 30px;
			
			padding-left:20px;
			padding-right:20px;
			
			overflow: auto;
			
			box-shadow: 0 4px 10px 3px rgb(0 0 0 / 10%);
	}
	
	.cont3 {
			
			width: 60%;
			margin: auto;
			padding-top:50px;
			padding-bottom:50px;
			
			border: dashed 1px;
			border-color: #A2A2A2;
			border-radius: 30px;
			
			padding-left:20px;
			padding-right:20px;
			
			overflow: auto;
			
			box-shadow: 0 4px 10px 3px rgb(0 0 0 / 10%);
			
	}
	
	.cont_slide {
			
			width: 100%;
			margin: auto;
			padding-top:50px;
			padding-bottom:50px;
			
			border: dashed 1px;
			border-color: #A2A2A2;
			border-radius: 10px;
			
			padding-left:20px;
			padding-right:20px;
			
			overflow: auto;
			
			box-shadow: 0 4px 10px 3px rgb(0 0 0 / 10%);
			
	}
	
	.cont3_bgc {
			
			width: 60%;
			margin: auto;
			padding-top:50px;
			padding-bottom:50px;
			
			border: dashed 1px;
			border-color: #A2A2A2;
			border-radius: 30px;
			
			padding-left:20px;
			padding-right:20px;
			
			overflow: auto;
			
			box-shadow: 0 4px 10px 3px rgb(0 0 0 / 10%);
			
			#background-image: url('/images/fc_bg.png');
	}
	
	
	.cont {
			
			width: 50%;
			margin: auto;
			
			padding-top:50px;
			padding-bottom:50px;
			
			#box-shadow: 0 5px 5px 0 rgba(0,0,0,0.3);
			
	}
	
	.cont_trans {
			
			margin: auto;
			
			padding-top:50px;
			padding-bottom:50px;
			
			#box-shadow: 0 5px 5px 0 rgba(0,0,0,0.3);
			
	}
	
	.cont_my {
			
			width: 50%;
			margin: auto;
			
			#box-shadow: 0 5px 5px 0 rgba(0,0,0,0.3);
			
	}
	
	.cont4 {
			
			width: 25%;
			margin: auto;
			padding-top:50px;
			padding-bottom:50px;
			
			border: dashed 1px;
			border-color: #A2A2A2;
			border-radius: 30px;
			
			box-shadow: 0 4px 10px 3px rgb(0 0 0 / 10%);
	}
	
	
	.cont_info {
			
			width: 75%;
			margin: auto;
			
			border: dashed 1px;
			border-color: #A2A2A2;
			border-radius: 20px;
			
			padding-top:20px;
			padding-bottom:20px;
			
			padding-left:20px;
			padding-right:20px;
			
			font-size : 16px !important;
			
			color : #58ACFA;
			
			/*background-color: #FBF5EF;*/
			
			/*box-shadow: 0 4px 10px 3px rgb(0 0 0 / 10%);*/
	}
	
	.cont_info_100 {
			
			margin: auto;
			
			border: dashed 1px;
			border-color: #A2A2A2;
			border-radius: 20px;
			
			padding-top:20px;
			padding-bottom:20px;
			
			padding-left:20px;
			padding-right:20px;
			
			font-size : 16px !important;
			
			color : #58ACFA;
			
			/*background-color: #FBF5EF;*/
			
			/*box-shadow: 0 4px 10px 3px rgb(0 0 0 / 10%);*/
	}
	
		.cont_info_50 {
			
			width: 50%;
			margin: auto;
			
			border: dashed 1px;
			border-color: #A2A2A2;
			border-radius: 20px;
			
			padding-top:20px;
			padding-bottom:20px;
			
			padding-left:20px;
			padding-right:20px;
			
			font-size : 16px !important;
			
			color : #58ACFA;
			
			/*background-color: #FBF5EF;*/
			
			/*box-shadow: 0 4px 10px 3px rgb(0 0 0 / 10%);*/
	}
	
	.redClass {
	
		background-color: #CD5C5C !important;
		color:white;
		font-weight: bold;
		border-radius: 30px;
		padding-left:15px;
		padding-right:15px;
		padding-top: 2px;
		padding-bottom:2px;
		width:fit-content;
		margin:auto;
		margin-top:10px;
		margin-bottom:10px;
	}
	
	.greenClass {
	
		background-color: #009933 !important;
		color:white;
		font-weight: bold;
		border-radius: 30px;
		padding-left:15px;
		padding-right:15px;
		padding-top: 2px;
		padding-bottom:2px;
		width:fit-content;
		margin:auto;
		margin-top:10px;
		margin-bottom:10px;
	}
	
	
	.velvetClass {
	
		background-color: #8b84a4 !important;
		color:white;
		font-weight: bold;
		border-radius: 30px;
		padding-left:15px;
		padding-right:15px;
		padding-top: 2px;
		padding-bottom:2px;
		width:fit-content;
		margin:auto;
		margin-top:10px;
		margin-bottom:10px;
	}
	
	.blueClass {
	
		background-color: #61678F !important;
		color:white;
		font-weight: bold;
		border-radius: 30px;
		padding-left:15px;
		padding-right:15px;
		padding-top: 2px;
		padding-bottom:2px;
		width:fit-content;
		margin:auto;
		margin-top:10px;
		margin-bottom:10px;
	}
	
	.b {
	
		padding: 10px 20px;/*Agrandit le menu et espace la bordure du texte*/
		border: 1px solid;
		border-color: #A2A2A2;
		border-radius: 5px;
		/*font-size: 14px;*/
		background-color:white;
		font-weight: bold;
		transition-duration: 0.4s;
		font-family: 'Roboto Condensed', sans-serif !important;
		font-size: 13px !important;
	}
	
	.b:hover {
	
	color: white;
		/*background-color: orange;*/
		/*border-bottom: 2px solid black;*/
		text-decoration: none;
		font-weight: bold;
		color: #0080FF;
			border-color: #0080FF;
			cursor: pointer;
	
	}
	
	.button {
	
			width:300px;
			height:150px;
			
			font-family: 'Roboto Condensed', sans-serif;
			font-size: 17px;
			font-weight: bold;
			
			border: solid 0.5px;
			border-color: #ddd;
			border-radius: 20px;
			
			#border-radius: 2px;
			
			background-color: white;
			cursor: pointer;
			
			box-shadow: 0 4px 10px 3px rgb(0 0 0 / 10%);
			
			transition-duration: 0.4s;
			
			#box-shadow: 0 1px 1px 0 rgba(0,0,0,0.3);
			
			#background-image:url('orw/images/bg.png');
			
			position: relative;
	}
	
	.button_dash {
	
			width:300px;
			height:125px;
			
			font-family: 'Roboto Condensed', sans-serif;
			font-size: 15px;
			#font-weight: bold;
			
			border: dashed 0.5px;
			border-color: #A2A2A2;
			border-radius: 20px;
			
			#border-radius: 2px;
			
			background-color: white;
			cursor: pointer;
			
			box-shadow: 0 4px 10px 3px rgb(0 0 0 / 10%);
			
			transition-duration: 0.4s;
			
			#box-shadow: 0 1px 1px 0 rgba(0,0,0,0.3);
			
			#background-image:url('orw/images/bg.png');
			
			position: relative;
	}
	
	hr {
	
			color : #F2F2F2;
			width: 8%;
	}
	
	.button_ts {
	
			width:300px;
			height:150px;
			
			font-family: 'Roboto Condensed', sans-serif;
			font-size: 17px;
			font-weight: bold;
			
			border: dashed 0.5px;
			border-color: #A2A2A2;
			border-radius: 20px;
			
			#border-radius: 2px;
			
			background-color: white;
			cursor: pointer;
			
			box-shadow: 0 4px 10px 3px rgb(0 0 0 / 10%);
			
			transition-duration: 0.4s;
			
			#box-shadow: 0 1px 1px 0 rgba(0,0,0,0.3);
			
			#background-image:url('orw/images/bg.png');
			position: relative;
	}
	
	.button:hover {
			
			background-color: ffe7d2;
			border-color: ffb395;
	}
	
	.button_ts:hover {
			
			color: #0080FF;
			border-color: #0080FF;
	}
			
	.logged {
	
			font-size: 14px;
			
	}
	
	.title_m {
	
			font-size: 24px;
			font-weight: bold;
			text-align: center;
			padding-bottom: 20px;
			
	}
	
	.divb {
	
			padding-top:20px;
			padding-bottom:20px;
			text-align: center;
	}
	
	.divb_r {
	
			padding-top:20px;
			padding-bottom:20px;
	}
	
	.divb_border {
	
			padding-top:20px;
			padding-bottom:20px;
			/*border: dashed 0.5px;
			border-color: #A2A2A2;
			border-radius: 20px;
			width: auto;
			overflow-x: hidden;
			display:inline-block;
			padding-left:20px;
			padding-right:20px;*/
	}
	
	.display.dataTable  {
		
			font-size: 14px;	
	}
	
	.loading_details, .loading_status {
		
			color : red;
			font-size: 16px;
			font-weight: bold;
			text-align: center;
	}
	
	.status {
	
			font-size: 26px;
			font-weight: bold;
			#color: #28539e;
			
			color: #3b4049;
	}
	
	.status2 {
	
			font-size: 22px;
			font-weight: bold;
			#color: #28539e;
			
			color: #3b4049;
	}
	
	.status_legend {
	
			font-size: 16px;
			font-weight: bold;
			#color: #28539e;
			
			color: grey;
	}
	
	.dt-button {
	
		border-radius: 5px !important;
				#border: dashed 1px !important;
			border-color: #A2A2A2 !important;
			background: white !important;
	}
	
	.dt-buttons {
  
		font-family: 'Roboto Condensed', sans-serif;
		font-size : 14px !important;
		padding-left: 10px;
	}
	
	 .ribbon {
  width: 80px;
  font-size: 12px;
  padding: 4px;
  position: absolute;
  right: -25px;
  top: -12px;
  text-align: center;
  border-radius: 25px;
  transform: rotate(20deg);
  background-color: #C00000;
  color: white;
  font-weight: bold;
	 }
	 
	 .iframe {
		 
		 border: dashed 0.5px;
			border-color: #A2A2A2;
			border-radius: 20px;
	 }
	 
		
	 
  .ribbon_new {
  width: 80px;
  font-size: 12px;
  padding: 4px;
  position: absolute;
  right: -25px;
  top: -12px;
  text-align: center;
  border-radius: 25px;
  transform: rotate(20deg);
  background-color: #1E90FF;
  color: white;
  font-weight: bold;
}	
	.more-button {
  background: none!important;
  border: none;
  padding: 0!important;
  /*optional*/
  font-family: arial, sans-serif;
  /*input has OS specific font-family*/
  color: #069;
  text-decoration: underline;
  cursor: pointer;
}

	.dataTables_filter {
  
		font-family: 'Roboto Condensed', sans-serif;
		font-size : 14px;
	}
	
	.dataTables_info {
  
		font-family: 'Roboto Condensed', sans-serif;
		font-size : 14px;
	}
	
	.dataTables_paginate {
  
		font-family: 'Roboto Condensed', sans-serif;
		font-size : 14px;
	}
	
	.stripe.dataTable  {
    font-size: 14px;	
	}
	
	.loading {
	
		color : red;
		font-weight: bold;
	}
	
	.divFrame {
		
		width: 100%;
	}

.tooltip {
  position: relative;
  display: inline-block;
  font-size : 35px !important;
  color : blue;
}

	.info {
		
		padding-left:20px;
		color:#08298A;
	
		text-align:left;
		
		font-weight:bold;
	}

.tooltip .tooltiptext {
  visibility: hidden;
  width: 300px;
  background-color: blue;
  color: #fff;
  text-align: center;
  border-radius: 6px;
  /*padding: 10px;*/

  /* Position the tooltip */
  position: absolute;
  z-index: 1;
  
   font-size : 16px !important;
}

.tooltip:hover .tooltiptext {
  visibility: visible;
}