@charset "UTF-8";
/* CSS Document */
@font-face {
  font-family: 'Ubuntu';
  src:  url('../font/Ubuntu-L.ttf')  format('truetype');
}

* {box-sizing: border-box;}
body {background-size: cover;padding:75px 0 0 0;margin:0px 0px 40px 0px;font-family:'Ubuntu',Geneva, Arial, Helvetica, sans-serif;line-height:20px;font-size:1em;}
header {position: fixed;top:0; left: 120px;width: 100%;;border-bottom: 2px solid #663366;text-align: right; background-color: white; padding-right: 140px; right: 140px; overflow: hidden; z-index: 1;}
header h1 {font-size: 2em;}
a {color:#EC008C; text-decoration: none;}
a:hover {color:#EC008C; text-decoration: underline;}

#menu {position: fixed;top:0;left:0;width:100px;height: 100%;background-color: #444;margin: 0 10px 0 0;z-index: 2;padding-top:50px;}
#menu ol {list-style: none; padding:10px 0;margin:0; text-align: center;}
#menu a {display: block;padding: 0px 0;color:#bbb;text-decoration: none;}
#menu a:hover, #menu a.selected {color: white;}
#menu a:hover i, #menu a.selected i {color: white;}
.icon-container {
    margin: 25px 0 0 0;
    width: 100px;
    height: 100px;
    background-color: #444;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 5px;
}
.icon-container a {
    display: flex;
    align-items: center;
    text-decoration: none;
    color: inherit;
}

.icon-container i {
    display: block;
    color: #bbb;
    font-size: 2em;
    line-height: 2em;
}

/* submenu */
div.submenu {display: flex; justify-content: left; width: auto; height:20px; margin-left:110px; overflow: hidden; }
div.submenu a {padding: 0 10px; }

/* kruimelspoor */
div.kruimelspoor {display: flex; justify-content: left; width: auto; margin-left:110px; overflow: hidden; padding: 10px 0 0 0;}
div.kruimelspoor a {padding: 0 10px; font-size: 0.9em;}

/* section algemeen */
section {display: block;margin: 10px 20px 0 120px; background-color: none;}
section div {line-height:24px;}
section h1 {color:#663366; margin:15px 0 0 0;font-size:1.5em;}
section a {text-decoration:none;color:#EC008C;}
section p.quote {font-style: italic; font-size: 1.2em;}

/* PDCA */
table.pdca {margin-left: 200px; width: 600px; height: 600px; border-collapse: separate; margin-top:100px;}
table.pdca td {border: 2px solid #663366; width: 50%; height: 50%; text-align: center;}
table.cyclus td {padding: 0;}
table.pdca a, table.pdca h2, table.pdca h3 {color:white; text-decoration: none;}
table.cyclus a {display: flex; align-items: center; justify-content: center;width: 100%; height: 100%; text-align: center;}
table.pdca h2 {display: block; width: 100%; font-size: 3em;}
table.pdca div {display: block; width: 100%;}
table.cyclus tr:first-child td:first-child { border-top-left-radius: 150px; background-color: #663366;}
table.cyclus tr:first-child td:last-child { border-top-right-radius: 150px; background-color: #389d9f;}
table.cyclus tr:last-child td:last-child { border-bottom-right-radius: 150px; background-color: #e5007d;}
table.cyclus tr:last-child td:first-child { border-bottom-left-radius: 150px; background-color: #0076e0;}
table.plan tr:first-child td:first-child {border-top-left-radius: 300px;; background-color: #663366;}
table.do tr:first-child td:first-child {border-top-right-radius: 300px; background-color: #389d9f;}
table.check tr:first-child td:first-child {border-bottom-right-radius: 300px;background-color: #e5007d;}
table.act tr:first-child td:first-child {border-bottom-left-radius: 300px;background-color: #0076e0;}
table.pdca td ul {list-style: none;}
table.pdca td li {line-height: 25px;;}
footer {display: block;width: 100%; height: 30px; line-height: 30px; position: fixed;left:0; bottom:0px; background-color: #444; color: white;font-size: 0.65em;padding: 0 0 0 120px;}

table.dashboard {width: 100%;; border: 1px solid #aaa; border-collapse: collapse;}
table.dashboard th, td {width: 33%;border: 1px solid #aaa; padding: 20px;}
table.dashboard th i {font-size: 1.5em; margin-left:20px;}
table.dashboard tr.content td {height: 100%; vertical-align: top;}

table.verbeterplannen {width: 100%; border: 1px solid #aaa; border-collapse: collapse;}
table.verbeterplannen tr:first-child th {text-align: center;}
table.verbeterplannen th, table.verbeterplannen td {padding:10px; text-align: left; vertical-align:top; line-height: 30px; font-size: 1.0em; border: 1px solid #aaa;}
table.verbeterplannen td.datum {width:12.5%;}
table.verbeterplannen td.verbeterplan {width:25%;}
table.verbeterplannen td.actie {width:50%;}
table.verbeterplannen .bewerk {width:12.5%;}
td.verbeterplan a {float: right;}
table.verbeterplannen a { display: block; color: #000; text-decoration: none;}
table.verbeterplannen i {float: right; color: #000; font-size: 1.2em;}

footer a {color: white;}