/* Position text in the top-left corner */
.topleft {
    position: absolute;
    top: 0;
    left: 10px;
  }

  .logo {
    width: 130px; 
    height: 180px;
  }

  .bg {
    min-height: 100%;
    min-width: 1024px;

    /* Set up proportionate scaling */
    width: 100%;
    height: auto;
        
    /* Set up positioning */
    position: fixed;
    top: 0;
    left: 0;

    opacity: 0.7;
  }


  @media screen and (max-width: 1024px) { /* Specific to this particular image */
    img.bg {
      left: 50%;
      margin-left: -512px;   /* 50% */
    }
  }

  .heading {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    text-align: center;
    font-family: 'Amatic SC', cursive;
    color: white;
    text-shadow: 0 0 1px black, 0 0 1px black, 0 0 1px black, 0 0 1px black;
  }

  .title {
    font-size: 80px;
  }

  .site-name {
    font-size: 40px;
    font-weight: bold;
  }

  hr {
    margin: auto;
    width: 40%;
  }