.body-container {
    padding:var(--tablet-padding);
}
.header {
    background-image:url('../../images/header-background-medium.png');  
    border-bottom:10px solid #000;
}
img {
    max-width: none;
}
a.icon,
.topnav a {
    display: none;
}

.topnav {
    padding:10px var(--tablet-padding);
    border-bottom:1px solid #CCC;
    box-shadow: 0px 2px 5px 0px rgba(3,3,3,.2);
}

.topnav a {
    display: inline-block;
    padding: 6px 4px;
    color: var(--red);
    font-size:13px;
}
.topnav a:last-child {
    float:right;
    background-color: var(--red);
    color:#FFF;
}
.topnav a:not(last-child) {
  margin-right:5px;
}

.topnav a:last-child:hover {
    background-color: var(--gray-dark);
}
.hero {
    padding:var(--tablet-padding);
    background-repeat: no-repeat;
    background-position:bottom right;
    background-image:url('../../images/mobile-hero-background.jpg');
    max-height: 183px;
    box-shadow: 0px 2px 5px 0px rgba(3,3,3,.2);
}
.hero h1 {
    font-size:30px;
    margin-bottom:20px;
}
.hero p {
    margin-right:30%;
}
#intro {
    margin: calc(-1 * var(--tablet-padding));
    margin-bottom:0;
    padding: var(--tablet-padding);
}
section {
    margin-top:var(--tablet-padding);
}


/* Footer */
.row.footer-uoc {
    padding:50px;
}
.row.footer-uoc > div {
    width:auto;
    padding-right:25px;
    padding-bottom:0px;
}
.footer-uoc > .uoc-logo, .doe-logo {
    margin-bottom:0;
}
.uoc-menu > ul > li {
    display:block;
    text-align: left;
    line-height:1.1em;
}