html, body {
    height: 100%;
}
body {
    font-family: 'Roboto',sans-serif;
    font-size: 16px;
    line-height: 1.375;
    color: #333;
    background-color: #fff;
    margin-bottom: 90px;
}
h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6 {
    font-weight: 600;
    line-height: 1.1;
    color: #712177;
}
h1 {
    font-size: 38px;
    font-weight: 400;
    margin-top: 22px;
}
main.container {
    min-width: 25rem;
}
.page-header {
    margin: 0 0 16px 0;
    border-bottom: 0;
    padding: 0;
}
.mainHeader {
    padding: 24px 0 17px;
}
/* Keep page content clear of the fixed footer. body's margin-bottom can't do this
   because body is pinned to height: 100%, so tall pages scroll under the footer. */
.mainSection {
    padding-bottom: 90px;
}
footer {
    border-top: 4px solid #56195A;
    padding-top: 17px;
    padding-bottom: 26px;
    color: #fff;
    font-size: 14px;
    position: fixed;
    bottom: 0;
    width: 100%;
    /* Set the fixed height of the footer here */
    height: 90px;
    background-color: #712177;
}
footer a {
    color: #fff;
}
footer a:active, footer a:hover, footer a:focus {
    color: #c99fcd;
}
article, aside, details, figcaption, figure, footer, header, hgroup, main, nav, section, summary {
    display: block;
}