Header { background: #3679cd url(../images/header-bg-left.png) top right repeat; padding: 0; }
.outer { background: url(../images/header-bg-right.png) top right repeat-y; padding-top: 40px; padding-bottom: 40px; }
@media only screen and (min-width: 768px) {
    header a.button {
        background-color: #3679cd
    }
}
@media only print {
    header, aside, #sidebar, #hamburger-menu { display: none }
}
header a{color: #fff}
header a:hover {color: #9ddcff}

#sidebar ul { font-weight: normal; padding-left: 0; margin-bottom: 0; margin-top: 0; padding-bottom: 8px; }
#sidebar ul ul { padding-left: 16px;  padding-bottom: 0;}
#sidebar li { list-style-type: none; padding-bottom: 0; }
#sidebar hr { height: 12px; border: 0; margin-bottom: 0; box-shadow: inset 0 12px 12px -12px rgba(0, 0, 0, 0.2); }
#sidebar h2, h3 { margin-bottom: 1px; margin-top: 3px; font-weight: bold; }

#main-content ul ul { margin-bottom: 0; }

#hamburger-menu {
    display: none;
    position: fixed;
    top: 20px;
    right: 20px;
    z-index: 1000;
    width: 30px;
    height: 30px;
}
@media (max-width: 767px) {
    #hamburger-menu {
        display: block;
    }
}

#fallBack { border: 10px solid orange; padding: 5px; }
.deprecated { background: darkorange; padding: 2px; }
header h1, header h2 {width:100%}

figure { display: inline-block; margin-left: 0; margin-top: 0; margin-right: 0.5em; }
figure image, figcaption { display: block; }
figcaption { text-align: center; background-color: #ddd; border-radius: 3px; margin-top: 0.3em; }

.hide { display: none; }
.show { display: block; }

/* border */
a img {border-style: solid; border-width: 1px; border-color: #ADD8E6; margin-right: 1em;}
#sidebar a img {border-style:none}

/* Abusing extended URLs:
 * query arguments can play the role of classes in HTML that are not available in MarkDown.
 * Be careful with the this "ends with" condition:
 * "?abc=right-hand" would also match: [src~="c=right"]
 */
img[src$="align=right"] { float: right; margin-left:1em }
img[src$="align=left"] { float: left; margin-right:1em }
img[src$="align=center"] { text-align: center }
