:root {
    --header-background-color: #eee;
    --footer-background-color: #eee;
}

@media screen {

    body {
        font-family: "Liberation Sans", sans serif;
        background-color: #d6d6d6;
        background-image: url(images/background.png);
        background-attachment: fixed;
    }

    .document {
        background-color: white;
        width: 80%;
        margin: auto;
        min-width: 850px;
        padding: 20px;
        box-shadow: 5px 5px 3px #004966;
    }

    .document .header {
        background-color: var(--header-background-color);
        padding-bottom: 1px;
        padding-top: 1px;
        margin-bottom: 12px;
        box-shadow: 3px 3px 3px #888;
        border-radius: 6px;
        width: 94%;
        margin-left: auto;
        margin-right: auto;
        text-align: center;
    }

    .document .footer {
        background-color: var(--footer-background-color);
        padding-bottom: 1px;
        padding-top: 1px;
        margin-top: 6px;
        box-shadow: 3px 3px 3px #888;
        border-radius: 6px;
        width: 94%;
        margin-left: auto;
        margin-right: auto;
        text-align: center;
        font-size: 0.75em;
    }

    .instructions {
        background-color: #eee;
        padding: 0;
        box-shadow: 3px 3px 3px #888;
        border-radius: 6px;
        margin-left: auto;
        margin-right: auto;
    }

    .document .article {
        margin-left: 3%;
        margin-right: 3%;
    }

    .document .article .section .contents {
        float: left;
        width: 150px;
        background-color: #eee;
        box-shadow: 3px 3px 3px #888;
        border-radius: 6px;
    }

    .document .article .section .section {
        margin-left: 160px;
    }

    .document .article .section #grading-rubric {
        margin-left: 0;
    }

    .contents ul {
        list-style-type: none;
        margin: 0;
        padding: 3px;
    }

    .contents ul li {
        padding: 0;
    }

    .contents ul li p {
        margin: 0;
        padding: 3px 0 2px 0;
    }

    .contents ul li ul {
        padding-left: 10px;
    }

    .contents ul li ul li {
        padding: 0;
    }

    .contents ul li ul li p {
        margin: 0;
        padding: 3px 0 2px 0;
    }

    .contents ul li a {
        text-decoration: none;
    }

    .contents ul li a:hover {
        color: red;
        text-decoration: underline;
        font-weight: bold;
    }

    .currentWeek {
        background-color: #ccffcc;
    }
}

@media only screen and (max-width: 915px) {
    body {
        background-color: white;
        background-image: none;
        background-attachment: scroll;
    }

    .document {
        background-color: white;
        width: 100%;
        min-width: 0;
        padding: 0;
        box-shadow: none;
    }

    .document .header {
        background-color: var(--header-background-color);
        padding-bottom: 1px;
        padding-top: 1px;
        margin-bottom: 12px;
        box-shadow: 3px 3px 3px #888;
        border-radius: 6px;
        width: 94%;
        margin-left: auto;
        margin-right: auto;
        text-align: center;
    }

    .document .footer {
        background-color: var(--footer-background-color);
        padding-bottom: 1px;
        padding-top: 1px;
        margin-top: 6px;
        box-shadow: 3px 3px 3px #888;
        border-radius: 6px;
        width: 94%;
        margin-left: auto;
        margin-right: auto;
        text-align: center;
        font-size: 0.75em;
    }

    .document .article .section .contents {
        display: none;
    }

    .document .article .section .section {
        margin-left: 0;
    }
}

@media print {

    @page {
        margin: 0.5in;
    }

    body {
        margin: 0;
    }

    .document {
        width: 100%;
        margin: 0;
        padding: 0;
    }

    .document .header {
        padding: 0;
        margin: 0;
        width: 100%;
        text-align: center;
    }

    .document .footer {
        display: none;
    }

    .instructions {
        padding: 0;
        margin-left: 0;
        margin-right: 0;
    }

    .document .article {
        margin-left: 0;
        margin-right: 0;
    }

    .document .article .section .contents {
        display: none;
    }

    .document .article .section .section {
        margin-left: 0;
    }

}

@media screen, print {

    body {
        color: black;
        font-family: "Liberation Sans", Arial, sans-serif;
        font-size: 100%;
    }

    .document .article .section .section:first-child {
        margin-left: 0;
    }

    .document .article .section .section .section {
        margin-left: 0;
        padding-left: 0;
    }

    img {
        max-width: 100%;
        height: auto;
    }

    #courseInfo {
        border: 0;
        padding: 0;
        border-spacing: 4px;
        margin-left: 3%;
    }

    #courseInfo td, #courseInfo th {
        border: 0;
        padding-top: 0;
        padding-bottom: 0;
    }

    #courseSchedule {
        border-collapse: collapse;
    }

    #courseSchedule thead {
        border-bottom: 2px solid black;
    }

    .indent {
        margin-left: 3%;
    }

    .smaller {
        font-size: 80%;
    }

    li ul, li ol, li p, li pre, li .code, li .src, li dl, dd p, dd dl {
        margin-left: 0;
        /* margin-bottom: 0; */
        page-break-inside: avoid;
    }

    dd {
        margin-top: 0.25%;
        margin-bottom: 1%;
    }

    ol.choices {
        list-style-type: none;
        counter-reset: answer;
    }

    ol.choices li {
        counter-increment: answer;
    }

    ol.choices li:before {
        content: counter(answer, lower-alpha) ") ";
    }

    a:link {
        color: #00f;
        text-decoration: none;
    }

    a:visited {
        color: #00f;
        text-decoration: none;
    }

    a:hover {
        color:red;
        text-decoration:underline;
    }

    a:active {
        color: #00f;
        text-decoration: none;
    }

    img {
        margin-right: 3%;
        margin-left: 3%;
    }

    a img {
        border: none;
        margin-left: 0%;
        margin-right: 0%;
    }

    h1 {
        font-size: 1.3em;
        color: black;
        text-align: center;
        font-weight: bold;
    }

    .section h1 {
        text-align: left;
    }

    h1 strong {
        background-color: red;
        color: white;
    }

    .rev {
        margin-top: -.5%;
        text-align: center;
        font-size: 1.0em;
        font-weight: normal;
    }

    h2 {
        font-size: 1.17em;
        color: #000;
        text-decoration: underline;
        page-break-before: auto;
        page-break-after: avoid;
    }

    h2 blink {
        color: red;
    }

    h3 {
        font-size: 1.07em;
        color: #000;
        page-break-before: auto;
        page-break-after:avoid;
        margin-left: 1%;
        margin-right: 1%;
    }

    h4 {
        font-size: 1.0em;
        color: #000;
        page-break-before: avoid;
        margin-left: 2%;
        margin-right: 2%;
    }

    h5 {
        font-size: 0.9em;
        color: #000;
        page-break-before: avoid;
        margin-left: 3%;
        margin-right: 3%;
    }

    pre, tt, code, .literal {
        font-family: "Liberation Mono", monospace;
    }

    p, ol, ul, dl {
        margin-left: 3%;
        margin-right: 3%;
    }

    blockquote {
        margin-left: 6%;
        margin-right: 6%;
    }

    .rtindent {
        text-align: right;
        margin-left: 3%;
        margin-right: 3%;
    }

    td hr {
        width: 100%;
        height: 1px;
    }

    span.nav {
        text-align: center;
        border: black solid 1px;
        padding: 1em;
    }

    span.nav a {
        background-color: yellow;
        text-decoration: none;
        color: blue;
        border: black solid 2px;
        padding: 1em;
    }

    span.nav a:hover {
        background-color: red;
        text-decoration: underline;
        color: white;
        border: black dashed 2px;
        padding: 1em;
    }

    span.nav span.none {
        background-color: yellow;
        text-decoration: none;
        color: blue;
        border: black solid 2px;
        padding: 1em;
    }

    table {
        margin-left: 0;
        margin-right: 0;
    }

    table.field-list,
    th.field-name,
    td.field-body {
        border: 0;
    }

    table, th, td {
        border: 1px solid black;
    }

    th, td {
        padding: 5px;
    }

    th p, td p {
        margin: 0;
    }

    table.indent {
        margin-left: 3%;
        margin-right: 3%;
    }

    .stripped tr:nth-child(even) {
        background-color: #f2f2f2;
    }

    /* Source highlight styles */

    .cbracket {
        color: #000000;
        font-style: normal;
        font-variant: normal;
        font-weight: normal;
        /* font-size: medium; */
        font-family: "Liberation Mono", monospace;
        line-height: 1.0;
        text-decoration: none;
    }

    .classname {
        color: #708090;
        font-style: normal;
        font-variant: normal;
        font-weight: normal;
        /* font-size: medium; */
        font-family: "Liberation Mono", monospace;
        line-height: 1.0;
        text-decoration: none;
    }

    .comment {
        color: #20b2aa;
        font-style: normal;
        font-variant: normal;
        font-weight: normal;
        /* font-size: medium; */
        font-family: "Liberation Mono", monospace;
        line-height: 1.0;
        text-decoration: none;
    }

    .function {
        color: #000000;
        font-style: normal;
        font-variant: normal;
        font-weight: bold;
        /* font-size: medium; */
        font-family: "Liberation Mono", monospace;
        line-height: 1.0;
        text-decoration: none;
    }

    .keyword {
        color: #0000cd;
        font-style: normal;
        font-variant: normal;
        font-weight: bold;
        /* font-size: medium; */
        font-family: "Liberation Mono", monospace;
        line-height: 1.0;
        text-decoration: none;
    }

    .normal {
        color: #000000;
        font-style: normal;
        font-variant: normal;
        font-weight: normal;
        /* font-size: medium; */
        font-family: "Liberation Mono", monospace;
        line-height: 1.0;
        text-decoration: none;
    }

    .number {
        color: #993399;
        font-style: normal;
        font-variant: normal;
        font-weight: normal;
        /* font-size: medium; */
        font-family: "Liberation Mono", monospace;
        line-height: 1.0;
        text-decoration: none;
    }

    .preproc {
        color: #000080;
        font-style: normal;
        font-variant: normal;
        font-weight: normal;
        /* font-size: medium; */
        font-family: "Liberation Mono", monospace;
        line-height: 1.0;
        text-decoration: none;
    }

    .specialchar {
        color: #9a1900;
        font-style: normal;
        font-variant: normal;
        font-weight: normal;
        /* font-size: medium; */
        font-family: "Liberation Mono", monospace;
        line-height: 1.0;
        text-decoration: none;
    }

    .string {
        color: #009900;
        font-style: normal;
        font-variant: normal;
        font-weight: normal;
        /* font-size: medium; */
        font-family: "Liberation Mono", monospace;
        line-height: 1.0;
        text-decoration: none;
    }

    .symbol {
        color: #990000;
        font-style: normal;
        font-variant: normal;
        font-weight: normal;
        /* font-size: medium; */
        font-family: "Liberation Mono", monospace;
        line-height: 1.0;
        text-decoration: none;
    }

    .todo {
        color: #20b2aa;
        font-style: normal;
        font-variant: normal;
        font-weight: normal;
        /* font-size: medium; */
        font-family: "Liberation Mono", monospace;
        line-height: 1.0;
        text-decoration: none;
    }

    .type {
        color: #708090;
        font-style: normal;
        font-variant: normal;
        font-weight: normal;
        /* font-size: medium; */
        font-family: "Liberation Mono", monospace;
        line-height: 1.0;
        text-decoration: none;
    }

    .usertype {
        color: #708090;
        font-style: normal;
        font-variant: normal;
        font-weight: normal;
        /* font-size: medium; */
        font-family: "Liberation Mono", monospace;
        line-height: 1.0;
        text-decoration: none;
    }

    .url {
        color: #0000ff;
        font-style: normal;
        font-variant: normal;
        font-weight: normal;
        /* font-size: medium; */
        font-family: "Liberation Mono", monospace;
        line-height: 1.0;
        text-decoration: underline;
    }

    pre.code, pre.src {
        /* background-color: #F5F5F5; */
        padding: 0.5em;
        line-height: 1.1;
    }

    pre.output {
        background-color: #CFCFCF;
        padding: 0.5em;
        line-height: 1.1;
    }

    div.slide .code {
        page-break-after: avoid;
    }

    pre.pseudocode {
        background-color: #ffffcc;
        padding: 0.5em;
        line-height: 1.1;
    }

    .contract {
        font-family: "FreeSerif", times, serif;
        background-color: #eae9f6;
        padding: 0.5em;
        line-height: 1.1;
    }

    pre.cpp.contract {
        font-family: "Liberation Mono", monospace;
        background-color: #fff;
        padding: 0.5em;
        line-height: 1.1;
    }

    li.answer {
        font-family: "Liberation Serif", times, serif;
        border: 1px solid #CCCCCC;
        background-color: #F5F5F5;
        margin: 1% 2% 1% 0;
        padding: 0.5em 0.5em 0.5em 0.5em;
    }

    .answer {
        font-family: "Liberation Serif", times, serif;
        border: 1px solid #CCCCCC;
        background-color: #F5F5F5;
        margin: 1% 2% 1% 0;
        padding: 0.5em;
    }

    .highlight {
        background-color: #ffff00;
    }

    span.key {
        background-color: yellow;
        color: red;
        font-weight: bold;
        font-variant: small-caps;
        border: 1px solid black;
        padding-left: 1em;
        padding-right: 1em;
    }

    span.menu {
        color: black;
        border: 1px solid black;
        padding-left: 1em;
        padding-right: 1em;
    }

    .image-caption {
        font-family: "Liberation Sans", sans-serif;
        font-variant: small-caps;
    }

    a.toc {
        font-size: 75%;
        color: #00f;
        padding: 0.5em;
        border: 1px solid #00f;
        text-decoration: none;
    }

    a:hover.toc {
        color: red;
        border: 1px solid red;
        text-decoration: underline;
    }

    blockquote code {
        font-family: "Liberation Mono", monospace;
        text-decoration: none;
    }

    object {
        border: 1px solid black;
        margin-left: 3%;
    }

    p#instructions {
        margin-left: 0;
        padding: 6px
    }

    #csharpTable {
        margin-left: 6%;
        border-collapse: collapse;
    }

    #csharpTable th {
        text-align: left;
        border-top: 2px solid black;
        border-right-style: none;
        border-bottom: 1px solid black;
        border-left-style: none;
    }

    #csharpTable td#bottom {
        border-bottom: 1px solid black;
    }

    div.contents p.topic-title {
        color: #000;
        text-decoration: underline;
        clear: both;
        font-weight: bold;
        margin-top: 3px;
        margin-bottom: 3px;
        margin-left: 3px;
        margin-right: 3px;
    }

    div.contents ul {
        margin-left: 0;
    }

    div.group {
        margin: 1em;
        border: medium outset;
        padding: 5px;
    }

    div.group p.admonition-title {
        margin-left:0.5em;
        font-weight: bold;
        font-family: "Liberation Sans", sans-serif;
    }

    div.group ul {
        margin-left:0;
    }

    table.docutils caption {
        font-size: 1.17em;
        font-weight: bold;
        font-family: "Liberation Sans", sans-serif;
        text-align: left;
    }

    table.rubric td:first-child {
        text-align: left;
    }

    table.rubric td {
        text-align: center;
    }

    /* Pygments styling */

    /* Comment, Comment.Multiline */
    pre.code .c, pre.code .cm {
        color: #20b2aa;
        font-style: normal;
        font-variant: normal;
        font-weight: normal;
        font-size: medium;
        font-family: "Liberation Mono", monospace;
        line-height: 1.0;
        text-decoration: none;
    }

    /* Error */
    pre.code .err { border: 1px solid #ff0000; }

    /* Keyword */
    pre.code .k {
        color: #0000cd;
        font-style: normal;
        font-variant: normal;
        font-weight: bold;
        font-size: medium;
        font-family: "Liberation Mono", monospace;
        line-height: 1.0;
        text-decoration: none;
    }

    /* Operator */
    pre.code .o {
        color: #000000;
        font-style: normal;
        font-variant: normal;
        font-weight: normal;
        font-size: medium;
        font-family: "Liberation Mono", monospace;
        line-height: 1.0;
        text-decoration: none;
    }

    pre.code .ln {
        border-style: solid;
        border-color: #000;
        border-right-width: thin;
        border-top-width: 0;
        border-bottom-width: 0;
        border-left-width: 0;
        padding-right: 0.5em;
    }

    .black {
        color: black;
    }
    .gray {
        color: gray;
    }
    .silver {
        color: silver;
    }
    .white {
        color: white;
    }
    .maroon {
        color: maroon;
    }
    .red {
        color: red;
    }
    .magenta {
        color: magenta;
    }
    .fuchsia {
        color: fuchsia;
    }
    .pink {
        color: pink;
    }
    .orange {
        color: orange;
    }
    .yellow {
        color: yellow;
    }
    .lime {
        color: lime;
    }
    .green {
        color: green;
    }
    .olive {
        color: olive;
    }
    .teal {
        color: teal;
    }
    .cyan {
        color: cyan;
    }
    .aqua {
        color: aqua;
    }
    .blue {
        color: blue;
    }
    .navy {
        color: navy;
    }
    .purple {
        color: purple;
    }

    .huge {
        font-size: x-large;
    }
    .big {
        font-size: large;
    }
    .small {
        font-size: small;
    }
    .tiny {
        font-size: x-small;
    }

    table.table-center td {
        text-align: center;
    }
}