html {
   width: 100%;
   height: 100%;
   overflow: hidden;
   background-color: white;
   font-size: 0.9em;
 }

 body, app-holder {
   width: 100%;
   height: 100%;
   margin: 0;
 }

 .hide {
   /* Class we use all over the app to hide things */
   display: none !important;
 }

 div {
   /* display utility */
   box-sizing: border-box;
 }

 a {
   /* display utility */
   text-decoration: none;
 }

 .container-blocs {
   /* Bloc holder */
   box-sizing: border-box;
   width: 100%;
   height: auto;
   display: flex;
   flex-direction: row;
   flex-wrap: wrap;
   justify-content: space-around;
 }

 .holder-specify {
   /* Bloc item */
   max-width: 100%;
   height: auto;
   width: auto;
   border: thin solid lightgrey;
   box-shadow: 1px 2px 3px 0 #DBDBDB;
   display: flex;
   flex-grow: 1;
   margin: 0.4em;
 }

 .main-container {
   position: relative;
   -webkit-box-flex: 1;
   -ms-flex-positive: 1;
   flex-grow: 1;
   height: calc(100% - 3em);
 }

 .internal-screen {
   height: 100%;
   padding: 0.5em;
   font-size: 0.9em;
   overflow: auto;
   display: -webkit-box;
   display: -ms-flexbox;
   display: flex;
   width: 100%;
   border: 0 !important;
   -webkit-box-orient: vertical;
   -moz-box-orient: vertical;
   -ms-box-orient: vertical;
   -webkit-box-direction: normal;
   -moz-box-direction: normal;
   -ms-box-direction: normal;
   -ms-flex-direction: column;
   flex-direction: column;
 }

 .ngx-datatable {
   max-width: 99%;
 }

 .eliot-version {
   position: fixed;
   display: flex;
   height: 2em;
   width: auto;
   bottom: 0;
   color: white;
   padding: 0.5em;
   z-index: 500000;
   font-weight: $boldiness;
   align-items: center;
   flex-direction: row;
   font-family: monospace;
   background-color: #444444;
   border-top-right-radius: 1em;
 }

 div, span, p {
   font-family: segoeui;
 }

 @media screen and (max-width: 1440px) {
   html {
     font-size: 0.8em;
   }
 }

 .tooltip {
   background-color: #444444 !important;
 }

 .tooltip div {
   font-family: segoeui;
 }