header{
	top:0;
	width:50%;
	background-color: #333333;
	position: fixed; /* Set the navbar to fixed position */
	display:flex;
}
label {

    max-width: 100%;
    margin-bottom: 5px;
    font-weight: bold;
	display: block;
}
.logo-circet{	
	background-image: url(logo.svg);
	width: 35px;
	height: 35px;
	background-size: cover;
	filter: invert(46%) sepia(4%) saturate(1681%) hue-rotate(166deg) brightness(86%) contrast(84%);
/*
https://codepen.io/sosuke/pen/Pjoqqp
*/
}



body{

  width:50%;
  margin:auto;
  margin-top:2%;
  font-family: 'Roboto', sans-serif;
  color:#606C76;
  font-size:15px;
  min-width:800px;

}
h2{
  font-size:20px;
  font-weight:500 ;
}
h1{
  font-size:45px;
  font-weight:500 ;
}

button {
  background-color: #86ADDB;
  border: none;
  text-align: center;
  text-decoration: none;
  font-size: 16px;
  padding: 3px 10px;
  border-top-right-radius: 3px;
  border-bottom-right-radius: 3px;
  font-family: 'Roboto', sans-serif;
}
button:hover{
  background-color: #E8E8E8;
}
.svg-icon{
  fill:white;
}
.form-control{
	margin-bottom:20px;
	min-height:25px;
}
.form-recherche{
  display:flex;
}
input{
  border: 1px solid #000000;
  border:none;
  background-color: #F8F8F8;

  font-size:15px;
  font-weight:600;
  width:35%;
  
}
input[type="text"]{
	
}
.search-bpe{
	border-top-left-radius: 3px;
	border-bottom-left-radius: 3px;
}
input[type=submit]{
	background-color: #86ADDB;
	border:none;
	color:white;
	font-weight:500;
	border-radius:3px;
	height:30px;
}
input[type=submit]:hover {
    background: #E8E8E8;
	
}
input[type=reset]{
	font-weight:500;
	border-radius:3px;
	height:30px;
}
input[type=reset]:hover {
    background: #E8E8E8;
	
}
p{
	line-height: 135%;
}
input:focus{
	outline:none;
}
a:link {
  color: #86ADDB;
  text-decoration: none;
}

/* visited link */
a:visited {
  color: #86ADDB;
}

/* mouse over link */
a:hover {
  color: hotpink;
}
.buttonAsLink{
	font-size: 15px;
	font-weight:200;
	border: 0;
    padding: 1px;
	margin:0;
    display: block;
    background: none;
    text-decoration: none;
    color: #86ADDB;

}
.buttonAsLink:hover{
	color: hotpink;
	background:none;
	cursor: pointer;
}
.buttonAsLink:active{
	border:none;
}
.formAslist{
	padding : 0;
	margin:-2px;
}
.result{
	background-color:white;
	position: absolute;
	width:340px;
	z-index:2;
	padding:2px;
	margin:0;
	color:black;
	border-radius:3px;
	box-shadow: 0px 9px 23px -2px rgba(232,232,232,1);
}
.result:hover{

}
.resultat:hover{
	background-color:#86ADDB;
	color:white;
	cursor: pointer;
}

/* selected link 
a:active {

}
*/
table{
	width:100%;
	
}
th{
	text-align:left;
	font-weight: 400;
}
.petite-image{	
	
	
	height: 20px;
	filter: invert(46%) sepia(4%) saturate(1681%) hue-rotate(166deg) brightness(86%) contrast(84%);
/*
https://codepen.io/sosuke/pen/Pjoqqp
*/
}
.petite-image:hover{	
	
	
	height: 20px;
	filter: invert(62%) sepia(72%) saturate(2365%) hue-rotate(296deg) brightness(102%) contrast(103%);


/*
https://codepen.io/sosuke/pen/Pjoqqp
*/
}

table th:first-child{
  border-radius:4px 0 0 0px;
}

table th:last-child{
  border-radius:0 4px 0px 0;
}
td{
	border-bottom: 2px dotted #F5F5F5;
  
}

.logout-btn {
	position: absolute;
	top: 10px;
	right: 10px;
	background-color: #58708d;
	color: white;
	border: none;
	padding: 10px 15px;
	text-decoration: none;
	font-size: 16px;
	border-radius: 5px;
	cursor: pointer;
}