/***** Fonts *****/

@font-face {
   /* http://www.ndiscovered.com/ */
   font-family: "Exo";
   src: url(/assets/fonts/Exo-Regular.otf) format("opentype");
}

@font-face {
   font-family: "Exo-DemiBold";
   src: url(/assets/fonts/Exo-DemiBold.otf) format("opentype");
}

@font-face {
   font-family: "Exo-Bold";
   src: url(/assets/fonts/Exo-Bold.otf) format("opentype");
}

@font-face {
   /* http://www.exljbris.com/calluna.html */
   font-family: "Calluna";
   src: url(/assets/fonts/Calluna-Regular.otf) format("opentype");
}

@font-face {
   /* https://www.fontsquirrel.com/fonts/Aurulent-Sans-Mono */
   font-family: "Aurulent-Sans-Mono";
   src: url(/assets/fonts/AurulentSansMono-Regular.otf) format("opentype");
}


body {
   font-family:"Calluna",sans-serif;
}

pre, code {
   font-family:"Aurulent-Sans-Mono",monospace;
}

h1, h2, h3, h4 {
   font-family:"Exo",sans-serif;
}

div#header {
   font-family:"Exo-Bold",sans-serif;
   font-size:240%;
}

nav#menu li {
   font-family:"Exo-DemiBold",sans-serif;
   font-size:119%;
}

div#submenu li {
   font-family:"Exo-DemiBold",sans-serif;
}



/***** Colours *****/
/* see http://www.w3.org/TR/css3-color/#hsl-examples */

/* dark */

.nav-link {
   color:hsl(180,25%,25%) !important;
}

code, div#content a[href] {
   color:hsl(180,25%,25%);
}


/* medium to light */
div#header {
   background-image:linear-gradient(hsl(180,25%,40%), hsl(180,25%,75%));
}


/* light */

nav#menu ul, div#submenu ul, .navbar-toggler {
   background-color:hsl(180,25%,75%);
}

nav#menu li {
   border-color:hsl(180,25%,75%);
}

li.chapter-inactive {
   background-color:hsl(180,25%,75%);
}

th {
   background-color:hsl(180,25%,75%);
}


/* white */

div#header {
   color:white;
}

nav#menu li:hover, ul.submenu li:hover {
   background-color:white;
   transition:0.3s ease-in-out;
}


/* Ampel */

tr.test-passed {
   background-color:limegreen;
}

tr.test-unknown {
   background-color:gold;
}

tr.test-failed {
   background-color:darkred;
}


/* Sillyness */
img.dancing:hover {
   transform:rotate(360deg);
   transition:2s ease-in-out;
}


/***** Everything else *****/

h1 {
   text-align:center;
}

img {
   border-style:none;
}

a[href] {
   color:inherit;
   text-decoration:none;
}

table {
   border-collapse:collapse;
   margin-left:auto;
   margin-right:auto;
   margin-bottom:1em;
}

td, th {
   padding:5px;
}

table.border td, table.border th {
   border-width:1px;
   border-style:solid;
}

div#header {
   margin:0;
   text-align:center;
   padding:1rem;
}

nav#menu {
   margin:0;
   margin-bottom:1rem;
   padding-top:0;
}

.navbar-toggler {
   width:100%;
   border:none;
   border-radius:0;
   text-align:left;
}

nav#menu ul {
   width:100%;
}

nav#menu li {
   width:100%;
   border-style:solid;
   border-width:1px;
}

div#content img {
   padding:7px;
}

div#content a[href] {
   text-decoration:underline;
}

div#footer {
   clear:both;
   padding-top:0.5em;
   padding-bottom:0.5em;
}

address {
   float:right;
}