body {
  font-family: 'Source Serif Pro';
  font-size: 16pt;
  background-image: url("/images/header.jpg");
  background-size: 100vw auto;
  background-repeat: no-repeat; }
  @media screen and (max-width: 500px) {
    body {
      background-size: auto 200px; } }
  body a {
    text-decoration: none;
    color: #00547F;
    font-family: 'Source Sans Pro';
    font-size: 15pt; }
  body a:hover {
    color: #0088D0; }

#header {
  width: 100vw;
  height: 20vw;
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: center; }
  #header #logo {
    height: 15vw;
    margin-left: 10vw; }
  @media screen and (max-width: 500px) {
    #header {
      height: 200px;
      justify-content: center; }
      #header #logo {
        height: auto;
        width: 80vw;
        margin-left: 0px; } }

#content {
  padding: 1vw;
  margin-top: 2vw;
  margin-left: 10vw;
  margin-right: 10vw; }
  #content .mainheading {
    font-family: 'Source Sans Pro';
    font-size: 30pt;
    margin-top: 10px;
    margin-bottom: 10px; }
  #content .imagebox {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center; }
    #content .imagebox a img {
      margin: 1vw;
      width: 15vw; }
      @media screen and (max-width: 500px) {
        #content .imagebox a img {
          width: 60vw; } }
    #content .imagebox a:only-child img {
      width: 60vw; }
  #content .contentfooter {
    font-family: 'Source Sans Pro';
    font-size: 12pt; }
  #content h1 {
    font-family: 'Source Sans Pro';
    font-size: 25pt;
    margin-top: 10px;
    margin-bottom: 10px; }
  #content h2 {
    font-family: 'Source Sans Pro';
    font-size: 20pt;
    margin-top: 5px;
    margin-bottom: 5px; }
  #content h3 {
    font-family: 'Source Sans Pro';
    font-size: 16pt;
    margin-top: 5px;
    margin-bottom: 5px; }
  #content .contentbox {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: flex-start; }
    #content .contentbox .podlove-subscribe-button-iframe {
      margin: 2vw; }

#footer {
  margin-top: 5vw;
  margin-left: 10vw;
  margin-right: 10vw;
  padding: 1vw;
  border-top: 2px #000000 solid;
  border-bottom: 2px #000000 solid;
  font-family: 'Source Sans Pro';
  font-size: 13pt; }

/*
 * Tweaks to lightbox
 */
.lightboxOverlay {
  opacity: 0.9; }

.lb-data {
  color: #ffffff; }
  .lb-data .lb-caption {
    font-family: 'Source Sans Pro';
    font-size: 15pt;
    font-weight: normal; }

/*
 * Tweaks to shariff
 */
.shariff a:hover {
  color: #ffffff; }

/*
 * Normal mode
 */
#navigation {
  margin-left: 10vw;
  margin-right: 10vw;
  font-family: 'Source Code Pro';
  background-color: #000000;
  /* first level */
  /* second level */ }
  #navigation a {
    display: block;
    margin-left: 10px;
    margin-right: 10px;
    min-width: 12vw;
    color: #ffffff;
    text-decoration: none; }
  #navigation ul {
    padding: 0px;
    margin: 0px;
    list-style: none; }
  #navigation li {
    position: relative;
    min-width: 10vw; }
  #navigation li:hover {
    background-color: #FFC88C; }
    #navigation li:hover > a {
      color: #000000; }
  #navigation > a {
    display: none; }
  #navigation > ul {
    display: flex;
    flex-direction: row;
    justify-content: left; }
    #navigation > ul > li {
      border-right: 2px #ffffff solid;
      text-align: center; }
      #navigation > ul > li > a {
        margin-top: 5px;
        margin-bottom: 5px; }
  #navigation li ul {
    display: none;
    position: absolute;
    top: 100%;
    width: 100%; }
    #navigation li ul li {
      border-top: 1px #ffffff solid;
      background-color: #492700; }
  #navigation li:hover ul {
    display: block; }

/*
 * Responsive Mode
 */
@media only screen and (max-width: 500px) {
  #navigation:not(:target) > a:first-of-type,
  #navigation:target > a:last-of-type {
    display: block; }
  #navigation:target > ul {
    display: block; }
  #navigation {
    /* first level */
    /* second level */ }
    #navigation > ul {
      display: none; }
    #navigation > ul > li {
      text-align: left;
      border-left: none;
      border-right: none;
      border-top: 1px #ffffff solid; }
    #navigation li ul {
      position: static; } }
