body {
  font-family: "Benton Sans", "Helvetica Neue", helvetica, arial, sans-serif;
  margin: 0;position: relative;   height:100%;
 box-sizing:border-box;
}
#todo-list-example{
      font-family: "Benton Sans", "Helvetica Neue", helvetica, arial, sans-serif;
  margin: 0;position: relative;   display: grid;height:100%;
  grid-template-columns: auto 25%;box-sizing:border-box; line-height:25px;
    
    }

a:link, a:visited { 
  color: rgb(50,50,50);
  text-decoration: none;
  cursor: pointer;
}
div{  box-sizing:border-box;}
a:link:active, a:visited:active { 
 color: rgb(50,50,50);
}

hr{margin-bottom:17px;}
#section_description{
    box-sizing:border-box; 
  position: fixed; 
  left:25%;
  padding:35px 0 0 25%;
   height:100%; 
    }
    #image{
    width:100%;position:relative; height:100%;
    }
#titre_selection{font-size:35px;font-family: "Benton Sans", "Helvetica Neue", helvetica, arial, sans-serif;}
h1 {
  font-size:80px;
  color: rgb(50,50,50);
  position:absolute;
  margin:0;
  padding:0;
  right:350px;
  top:40px;
}
h2{
margin-bottom:18px;
font-size: 36px;
}
.logout{
  top:124px;
  right:354px;
  cursor:pointer;
  font-family: "Benton Sans", "Helvetica Neue", helvetica, arial, sans-serif;
  font-weight:bold;
  position:absolute;
  font-size:17px;
}
.svg_objet{
    opacity:.55;
    }
li{list-style-type: none;padding-bottom:4px;font-size: 17px;}
    .shadow{-webkit-box-shadow: 5px 5px 5px 0px rgba(0, 0, 0, 0.6);
-moz-box-shadow:    5px 5px 5px 0px rgba(0, 0, 0, 0.6);
box-shadow:         5px 5px 5px 0px rgba(0, 0, 0, 0.6);}
html { height: 100%; box-sizing:border-box;position:relative;}
div{box-sizing:border-box;margin:0;}
section{box-sizing:border-box;margin:0;}
.no_select{    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: -moz-none;
    -o-user-select: none;
    user-select: none;}
.input_objet[type="text"]{
position:relative;
    background: transparent;
    border:none;
    border-bottom: solid .75px rgb(120,120,120);
background-color: none !important;
box-shadow: none;
    outline: none;
    -webkit-appearance: none;
    font-family: "Benton Sans", "Helvetica Neue", helvetica, arial, sans-serif;
    font-size:16px;
    padding: 4px 0 4px 0;
    box-sizing:border-box;
}
.description_textarea{
 background: transparent;
 width:100%;
     border:none;
    border-bottom: solid .75px rgb(240,240,240);
        font-family: "Benton Sans", "Helvetica Neue", helvetica, arial, sans-serif;
position:relative;
font-size:17px;
resize: none;
top:-8px;
}
.fontion_input[type="text"]{
 background: transparent;
    border:none;
    border-bottom: solid .75px rgb(120,120,120);
background-color: none !important;
box-shadow: none;
    outline: none;
    -webkit-appearance: none;
    font-family: "Benton Sans", "Helvetica Neue", helvetica, arial, sans-serif;
    font-size:16px;
    padding: 4px 0 4px 0;
    box-sizing:border-box;

font-size:17px;
position:relative;
}
.bold_select{
font-weight:bold;
}


body {font-family: Arial, Helvetica, sans-serif;}

/* Full-width input fields */
input[type=text], input[type=password] { width: 100%; padding: 12px 20px; margin: 8px 0;display: inline-block;border: 1px solid #ccc;box-sizing: border-box;}

/* Set a style for all buttons */
button { background-color: #4CAF50;color: white; padding: 14px 20px;margin: 8px 0;border: none;cursor: pointer;width: 100%;}

button:hover {opacity: 0.8;}

/* Extra styles for the cancel button */
.cancelbtn {width: auto; padding: 10px 18px;background-color: #f44336;}

/* Center the image and position the close button */
.imgcontainer {
  text-align: center;
  margin: 24px 0 12px 0;
  position: relative;
}

img.avatar {
  width: 180px;
  height:180px;
  border-radius: 50%;
  -webkit-box-shadow: 5px 5px 5px 0px rgba(0, 0, 0, 0.6);
-moz-box-shadow:    5px 5px 5px 0px rgba(0, 0, 0, 0.6);
box-shadow:         5px 5px 5px 0px rgba(0, 0, 0, 0.6);
}

.container { padding: 7px 16px 16px 16px;  box-sizing:border-box;   margin-top:40px;
}
.container_bas {
  padding: 7px 16px 4px 16px;
    box-sizing:border-box;
    margin-bottom:15px;
    position:absolute;
    bottom:25px;
    right:0;
    left:0;
}
span.psw {
  float: right;
  padding-top: 16px;
}



/* Modal Content/Box */
.modal-content {
  position:fixed; 
  background-color: #fefefe;
  top:0;
  left:0;
  bottom:0;
  right:0;
  margin: auto auto auto auto;
  border: 1px solid #888;
  max-width: 430px; /* Could be more or less, depending on screen size */
  box-sizing:border-box;
  padding-top:10px;
  height:100%;
  height:630px;
  border-radius: 0 0 20px 20px;
    -webkit-box-shadow: 5px 5px 5px 0px rgba(0, 0, 0, 0.6);
-moz-box-shadow:    5px 5px 5px 0px rgba(0, 0, 0, 0.6);
box-shadow:         5px 5px 5px 0px rgba(0, 0, 0, 0.6);
}

/* The Close Button (x) */
.close {
  position: absolute;
  right: 25px;
  top: 0;
  color: #000;
  font-size: 35px;
  font-weight: bold;
}

.close:hover,
.close:focus {
  color: red;
  cursor: pointer;
}