body {
	background-color: #ffffff;
	color: #333;
    font-family: RobotoDraft, Roboto, Arial, Helvetica, sans-serif;
    -webkit-font-smoothing: antialiased;
    font-size: 14px;
	padding: 0px;
	margin-bottom: 50px;
}

h1 {
	font-size:26px;
	font-weight: bold; 
	background-color: #1565C0;
	color: #FFFFFF;
	padding: 10px 5px 10px 10px;
	margin: 0px 0px 20px 0px;
}

h2 {
	font-size:20px;
	font-weight: bold; 
	color: #1565C0;
	margin: 30px 0px 10px 0px;
}

h3 {
	font-size:16px;
	font-weight: bold; 
	color: #2196F3;
	margin: 15px 0px 5px 0px;
}

@media screen and (min-width:600px) {
	span.index {
		float: left;
		width: 46%;
		min-width: 270px;
		height: 180px;
		border: 1px solid #333;
		margin: 0px 10px 20px 10px;
	}
}

h2.index {
	width: 100%-20px;
	margin: 0px;
	padding: 2px 10px 2px 10px;
	color: #FFF;
}
.lvl1 {
	background-color: #90CAF9;
}
.lvl2 {
	background-color: #1976D2;
}
.lvl3 {
	background-color: #0A3577;
}
.lvl4 {
	background-color: #D84315;
}

p.index {
    margin: 10px 0px 10px 5px;
    width: 99%;
}

a.index {
    text-decoration: none;
}

table {
	border-collapse: collapse;
    border-spacing: 2px;
    margin: 10px;
    width: 90%;
}

table tr td {
	padding:4px;
	border: 0px;
	vertical-align: top;
}

img {
    margin: 5px 0px 5px 0px;
    max-width: 110%;
}
img:hover {
  -webkit-filter: none;
   filter: none;
}

p {
    margin: 5px 0px 10px 5px;
    width: 85%;
}

a {
  color: inherit;
}        
a:hover {
  color: inherit;
  -webkit-filter: invert(100%);
   filter: invert(100%);
}    

a.button {
  color:#FFF;
  background-color:#0D47A1;
  font-size:16px;
  font-weight: bold; 
  text-align:center;
  padding:5px 15px 5px 15px;
  border-radius: 5px;
  text-decoration: none;
  -webkit-filter: none;
  filter: none;
}

a.button:hover {
  color:#0D47A1;
  background-color:#BBDEFB;
  -webkit-filter: none;
  filter: none;
}

a#home {
  float:right;
  padding:0px 1px 0px 22px;
  width:50px;
  color:#FFF;
}
a#home:before {
    float: left;
    color: #FFF;
    content: 'home';
    font: normal normal normal 38px/1 'Material Icons';
    font-feature-settings: 'liga';
    -moz-font-feature-settings: 'liga';
    -moz-osx-font-smoothing: grayscale;
    -webkit-font-feature-settings: 'liga';
    -webkit-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
	text-decoration: none;
}

.picto
{
  height: 16px;
  width: 16px;
  background:url('./status.jpg');
} 
.picto#i1 { background-position: -16px -0px; } 
.picto#i2 { background-position: -32px -0px; } 
.picto#i3 { background-position: -48px -0px; } 
.picto#i4 { background-position: -64px -0px; } 
.picto#i5 { background-position: -80px -0px; } 
.picto#i6 { background-position: -96px -0px; } 
.picto#i7 { background-position: -224px -0px; } 
.picto#i8 { background-position: -256px -0px; } 
.picto#q1 { background-position: -112px -0px; } 
.picto#q2 { background-position: -128px -0px; } 
.picto#q3 { background-position: -144px -0px; } 
.picto#q4 { background-position: -160px -0px; } 
.picto#s1 { background-position: -416px -0px; } 
.picto#s2 { background-position: -432px -0px; } 
.picto#s3 { background-position: -464px -0px; } 
.picto#s4 { background-position: -400px -0px; } 
.picto#s5 { background-position: -448px -0px; } 
.picto#p1 { background-position: -272px -0px; } 
.picto#p2 { background-position: -288px -0px; } 
.picto#p3 { background-position: -304px -0px; } 

.note {
    color: #fff;
    display: block;
    margin: 10px;
	font-weight: 500; 
    padding: 10px 10px 10px 60px;
    text-rendering: optimizeLegibility;
}
.note::before {
	color: #fff;
    float: left;
    font: normal normal normal 30px/1 'Material Icons';
    font-feature-settings: 'liga';
    -moz-font-feature-settings: 'liga';
    -moz-osx-font-smoothing: grayscale;
    -webkit-font-feature-settings: 'liga';
    -webkit-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
    margin-left: -48px;
}
.info {
    background: #2196f3;
}
.info::before {
    content: 'info';
}
.warning {
    background: #f44336;
}
.warning::before {
    content: 'warning';
}
.settings {
    background: #FF8F00;
}
.settings::before {
    content: 'settings';
}