button {cursor:pointer;background-color:linen;border:1px solid #DBDBDB;font-family:'noto_sansextralight';padding:0.3em 0.7em;border-radius:3px;}
h2 {display:inline-block;margin-top:2.5em;}
#div_logo {height:30px;margin:25px 25px;}
.fresh {margin:25px;}
.icon_menu {font-size:1.4em;}
.onright {text-align:right;position:relative;right:0;top:0;float:right;}
.small-info {font-size:0.7em;margin-top:0.3em;} 
.demi-widget {width:43%;margin-right:4%;text-align:left;min-width:360px;}
.aparte {display:inline-block;margin-left:1em;font-size:0.8em;}
.divenliste {display:inline-block;margin-right:5em;margin-top:2em;margin-bottom:2em;}
.separator {display:block;min-width:10px;height:1px;color:transparent;}
#table_strategie {width:100%;text-align:right;font-size:0.8em;}
#table_strategie td {padding:0.3em;vertical-align:top;} 
.tiers {width:33%;}
th {border-right:1px solid black;padding:0.3em;}
input {font-style:'noto_sansextralight';padding:3px;border:2px solid #DBDBDB;background-color:#FBFBFF;margin-right:15px;border-radius:5px;}
input:focus {border:2px solid #E6E6FA;outline:none;}
input::placeholder {font-style:italic;font-family:'noto_sansextralight';}
li {list-style-type:circle;}
#memo, #documents_collaboratifs, #agenda, #partage_docs {margin-left:0.5em;border:5px dashed linen;padding:5px 10px;font-size:.8em;}
.discret {color:darkslategray;text-decoration:none;font-weight:100;cursor:pointer;}
.divenliste {vertical-align:top;}
.divenliste p {margin:0.4em 0 0 0;font-size:0.8em;}
.todo {font-size:0.8em;}
.divenliste input {margin-top:0.8em;}
.contenu_color {background-color:aliceblue;border-radius:5px;padding:4px 8px;margin:8px 0;}
.ajusteListe {padding:3px 6px;background-color:linen;cursor:pointer;border-radius:6px;}
.valideee {text-decoration:line-through;font-size:1em;}
#liste_membres, #titre_alternative {background-color:aliceblue;border-radius:10px;padding:5px 10px;font-size:0.7em;text-align:left;}
.fauxLien {cursor:pointer;text-decoration:underline;}
.cachee {display:none;}
.input_cache {width:7em;}
.img_cast {font-size:fit;width:100%;opacity:0.6;}
.ita {font-style:italic;}
#documents_collaboratifs li {
margin:10px;
}
.archive_item {background-color:aliceblue;padding:4px 8px;border-radius:5px;ont-weight:bolder;}
.so_5 {background-color:#BED2D9;}
.ob_1 {background-color:#F7F9FE;}
.so_4 {background-color:#CBDBE0;}
.so_3 {background-color:#DCE8EB;}
.so_2 {background-color:#ECF1F2;}
.so_11 {background-color:#ACCEBC;}
.so_1 {background-color:#F7F9FE;}
.ob_final {background-color:#ACCEBC;}
.tiret {border-top:1px solid black;height:1px;font-size:1px;}
.cell_sub {text-align:right;}
	.modif_strat a {text-decoration:none;margin-left:0.3em;color:firebrick;}
	form {display:inline-block;}
	.no_underline {text-decoration:none;color:inherit;}
		.grandDiv {width:95%;max-width:780px;display:inline-block;}
	#div_documents, .div_documents {display:inline-block;min-width:262px;max-width:352px;margin-left:42px;vertical-align:top;}
	#carre_telechargement {display:inline-block;vertical-align:top;width:65px;height:65px;border:1px dashed black;margin:auto;}
	#ajouter_doc {margin-top:55px;}
	#ajouter_doc input, select, img {margin-top:4px;margin-bottom:4px;margin-left:8px;}
	#lien_doc  {margin-top:15px;margin-left:10px;}
	#input_docs1 {width:95%;}
   .goal_quis {font-weight:bolder;}
   .date_agenda {padding:5px 6px 10px 14px;border-radius:6px;margin:12px 0;}
   .date_agenda input, textarea {margin:3px 6px;}
	.chiffre_date {display:inline-block;width:65px;height:65px;background-color:white;font-size:2em;margin-top:5px;padding-top:8px;padding-left:8px;border-radius:6px;background-color:rgba(255,255,255,0.6);}
	.texte_date {display:inline-block;padding-left:0px;height:65px;max-width:180px;padding-top:0px;margin-top:0;margin-left:15px;vertical-align:top;font-size:1.3em;}
	.texte_date p {margin:0;padding:0;}
	.categorie_date {font-size:0.7em;margin:0;}
	.modif_date {display:inline-block;text-align:right;vertical-align:bottom;float:right;margin-top:45px;}
	.vert {background-color:rgba(154,205,50,.4);}
	#aparte_cat_agenda {margin-left:10px;margin-bottom:8px;}
	.star {float:right;margin-bottom:0px;margin-top:-4px;height:28px;cursor:pointer;}
	#textarea_cat {width:257px;height:86px;}
	.no_margin {margin:0;}
	.input_cat_agenda {width:105px;}
	.cc_right {clear:right;height:1px;font-size:1px;}
	.pointer {cursor:pointer;}
	.sobre {color:black;text-decoration:none;font-weight:100;cursor:pointer;}
	#login {margin-top:100px;}
	#presentation {margin-top:35px;font-size:1.4em;}
	.nomarge {margin:0;}
	.infobulle {
		padding:2px 7px;
		background-color:#ECF1F2;
		border-radius:12px;
		margin-left:10px;
		margin-top:-6px;
	}
 *{
  box-sizing: border-box;
} 


/* The actual timeline (the vertical ruler) */
.timeline_tl {
  position: relative;
  max-width: 1200px;
  margin: 0 auto;
  background-color: #474e5d;
  height:420px;
  overflow:auto;
  min-width:340px;
}

/* The actual timeline (the vertical ruler) */
.timeline_tl::after {
  content: '';
  position: absolute;
  width: 6px;
  background-color: aliceblue;
  top: 0;
  bottom: 0;
  left: 50%;
  margin-left: -3px;
  height:1800px;
}

/* Container around content */
.container_tl {
  padding: 10px 40px;
  position: relative;
  background-color: inherit;
  width: 50%;
}

/* The circles on the timeline */
.container_tl::after {
  content: '';
  position: absolute;
  width: 25px;
  height: 25px;
  right: -17px;
  background-color: #66CDAA;
  border: 4px solid aliceblue;
  top: 15px;
  border-radius: 50%;
  z-index: 1;
}

/* Place the container to the left */
.left_tl {
  left: 0;
}

/* Place the container to the right */
.right_tl {
  left: 50%;
}

/* Add arrows to the left container (pointing right) */
.left_tl::before {
  content: " ";
  height: 0;
  position: absolute;
  top: 22px;
  width: 0;
  z-index: 1;
  right: 30px;
  border: medium solid white;
  border-width: 10px 0 10px 10px;
  border-color: transparent transparent transparent white;
}

/* Add arrows to the right container (pointing left) */
.right_tl::before {
  content: " ";
  height: 0;
  position: absolute;
  top: 22px;
  width: 0;
  z-index: 1;
  left: 30px;
  border: medium solid white;
  border-width: 10px 10px 10px 0;
  border-color: transparent white transparent transparent;
}

/* Fix the circle for containers on the right side */
.right_tl::after {
  left: -16px;
}

/* The actual content */
.content_tl {
  padding: 20px 30px;
  background-color: white;
  position: relative;
  border-radius: 6px;
}

/* Media queries - Responsive timeline on screens less than 600px wide */
/* @media screen and (max-width: 600px) { */
/* Place the timelime to the left */
  .timeline_tl::after {
    left: 31px;
  }

/* Full-width containers */
  .container_tl {
    width: 100%;
    padding-left: 70px;
    padding-right: 25px;
  }

/* Make sure that all arrows are pointing leftwards */
  .container_tl::before {
    left: 60px;
    border: medium solid white;
    border-width: 10px 10px 10px 0;
    border-color: transparent white transparent transparent;
  }

/* Make sure all circles are at the same spot */
  .left_tl::after, .right_tl::after {
    left: 15px;
  }

/* Make all right containers behave like the left ones */
  .right_tl {
    left: 0%;
  }
/* } */