nav
    background-color: #41B3FF
    color: white
    border-top: solid 10px #5096C8
    > a.active
        background-color: #5096C8

footer
    background-color: #FBC14C
    color: white
    padding: 2em 3em
    border-bottom: solid 10px #CB8802
    a
        color: inherit
    a.w3-button
        background-color: #CB8802

@font-face 
    font-family: Ubuntu-Regular
    src: url(/fonts/Ubuntu/Ubuntu-R.ttf)
    font-display: fallback

@font-face 
    font-family: Ubuntu-Bold
    src: url(/fonts/Ubuntu/Ubuntu-B.ttf)
    font-display: fallback

body
    font-family: Ubuntu-Regular
    font-size: 110%

h1, h2, h3, h4, h5, h6
    font-family: Ubuntu-Bold

a
    color: #5096C8
    text-decoration: none
a:hover
    color: #41B3FF

.toc 
    background: #f7f7f7
    padding: 0 2em 0em 2em
    border-left: 5px solid #41B3FF
    display: inline-block
    ol.h2
        list-style-type: upper-roman
        ol.h3
            list-style-type: decimal
            ol.h4
                list-style-type: lower-alpha
                ol.h5
                    list-style-type: circle

img.icon
    height: 1em
    margin-bottom: 0.2em

.breadcrumb
    margin-bottom: 20px
    border-top: solid 2px #EEE
    border-bottom: solid 2px #EEE
    padding: 1em 0

.breadcrumb-next
    color: lightgray
    position: relative
    display: inline-block
    ul
        display: none

.breadcrumb-next:hover
    color: gray
    ul
        display: block
        background-color: #FAFAFA
        position: absolute
        left: 0
        top: 0.2em
        width: 30em
        padding: 0.5em 1em
        li
            list-style: none


input.search_input 
    padding-top: 0.5em
    padding-bottom: 0.5em
    padding-left: 40px
    padding-right: 0.5em
    height: 3em
    width: 80%
    box-sizing: border-box
    border: 1px solid #e2e2e2
    border-radius: 0
    color: #333
    background-color: #fff
    background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAA4AAAAOCAYAAAAfSC3RAAABN0lEQVQoU5WS23HCMBBFke0CnA7SAcmvH4NcAaQCSAWQCoAKAhWEDuIOoowfv6EE0kH49yP3eixGaPwBmtFovbvn7mplMepXFEUS5lIIMaOrbdsjjtTzvL1S6k/n6VPQiON4geOjd54BnSAw1gKAExsWrISkLyQRmOV5rghIKf26rncw5/Ar+BOzqkC1FI4pgomGzAQIKwhPIPJcliXb7xZBMO0voEf7HvwOw3DlOM570zRvRVGwgyvwG6AcAiHMYX1CfIuczQVEK0cOwnXdh6HpIb5DfGlfhcPZILCG0iHLslezahAETxD8GbqK4PSqquIAxpwewBT2iYPFXmD78Kdo88UU7d6xhwlMzCArwcdJTu2OOlAvtoZEvqsPH9+OHfAHOeCYm/AVaIrYtg3fDNqV7wINePQP5CumvCOCjRYAAAAASUVORK5CYII=')
    background-repeat: no-repeat
    background-position: 15px center