/*
The colors #453a62 and #5e5086 that appear in several places below are
chosen to match the colors used in ../P/Haskell-Logo.svg.
*/

html { scroll-behavior: smooth; }

body {
    margin:0; padding: 0;
    color: #453a62; background-color: #f9f9e8;
    font-size: 12pt;
    /*font-family: Palatino,serif;*/

}

div#widgetmain {
    float: right; margin-left: 0.5em;
}
aside.newsfeed {
    float: right; margin-left: 0.5em;
    width: 300px; min-height: 300px;
}

div.codes {
    float:left;
    font-family: monospace;
    font-size: smaller;
    line-height: 100%;
    color: #5e5086;
}

h1,h2,h3,h4 {
    font-family: sans-serif; color: #5e5086;
    text-shadow: rgba(0,0,0,0.25) 2px 2px 5px;
}

h1 { text-align: center; margin: 0; }
h1 img { border:0; float: right; max-height: 4ex; max-width: 11%; }
h2 { padding-top: 2ex; border-bottom: 2px solid #5e5086; clear: right; }
h2:target, h3:target, div.assignment:target, p.assignment:target { padding-top: 5ex; }

h2:target {
  animation-duration: 3s;
  animation-timing-function: ease-in-out;
  animation-name: highlight_header;
  -webkit-animation-duration: 3s;
  -webkit-animation-timing-function: ease-in-out;
  -webkit-animation-name: drop_header;
}

@keyframes highlight_header {
  from { background-color: #ff0; }
  to { background-color: inherit; }
}


header {
    padding: 10px;
    background: white;
    z-index: 1;
}

nav {
    position: -webkit-sticky;
    position: sticky;
    top: 0;
    background: #5e5086;
    color: white;
    opacity: 0.95;
}

nav, header.nonav {
    box-shadow: 2px 2px 15px rgba(0,0,0,0.4);
}

nav>ul {
    margin: 0;
    padding: 0.5ex 0;
    text-align: center;
}

nav>ul>li {
    display: inline; padding: 1ex;
    font-family: sans-serif;
}
nav>ul>li a {
    color: white;
    /*font-weight: bold;*/
    text-decoration: none;
}
nav>ul a:hover {
    text-decoration: underline;
}

main, footer {
    padding: 10px;
}
footer {
    color: #666;
    border-top: 3px dotted #5e5086;
}

table.schedule, table.labs {
    box-shadow: 2px 2px 15px rgba(0,0,0,0.3);
    background: #e8e8e8;
}

li>p { margin: 1ex 0; }
dd>p { margin: 0.5ex 0 2ex 0; }

table.schedule th {
    color: white; background: #5e5086;
    font-family: sans-serif;
    padding: 1ex;
}
table.schedule td {
    background: #fffff8;
    padding: 1ex;
}
table.schedule td[colspan="2"] { text-align: center; }

table.labs { caption-side: bottom; }

table.labs th {
    color: white; background: #5e5086;
    font-family: sans-serif;
    padding: 1ex;
    text-align: left;
}
table.labs td {
    background: #fffff8;
    padding: 1ex;
    /*vertical-align: baseline;*/
}
table.old tr th {
    color: #ff8;
}
table.old tr td, tr.old td, caption.old {
    color: #840;
    background: #ffd;
}

@media (pointer: coarse),(-moz-touch-enabled:1) {
  li { line-height: 140%; }
}

div.modtime { float: right; font-size: smaller; font-family: sans-serif; }

.center { text-align: center; }

ul { padding-left: 2em; }

@media all and (max-width: 639px) {
    ul { padding-left: 1.5em; }
}
@media all and (max-width: 560px) {
    ul { padding-left: 1.2em; }
}


.solution B { color: #620; }
.code B, .hs B, .hsexp B { color: #620; }
b.mod { color: #060; }
b.tcon { color: #009; }
var.var, var.varop { font-style: normal; }
var.tvar { color: #009; font-style: italic; }
b.con, b.conop { color: #909; /*#074;*/ }
span.lit { color: #808; }
.cmnt { color: #292980; }

table.studentreps, table.dropin {
    background-color: #e8e8e8;
}
table.studentreps tr td, table.dropin tr td {
    background-color: #fffff8;
    padding: 1px 1ex;
}
table.dropin th {
    padding: 1px 1ex;
    text-align: left;
    font-family: sans-serif;
    color: #5e5086;
}

code.contact, table.studentreps tr td:nth-child(3) {
    font-family: monospace;
    font-size: 80%;
    color: #444;
}