.content {
    width: 75%; /* Could be anything, but 75% works here. */
    margin: auto; /* This is what center the content div itself. */
    border: 1px solid darkred;
 }
 
  p {
     text-align: center; /* This will center the text inside the paragraph tag */
     border: 1px solid darkred;
     background-color: black;
     width: 25%;
     margin: auto;
     padding-bottom: 10px;
     padding-top: 10px;
 }
 
 h1 {
  text-align: center;
}

h2 {
  text-align: center;
}

h3 {
  text-align: center;
  background-color: darkred;
}

body {
     color: white;
  font-family: Imbue;
  font-size: 110%;
  /*background-color: black;*/
  background-image: url("Images/darkconcrete.png");
  background-repeat: no-repeat;
  background-attachment: fixed;
  background-size: cover;
}

a:link, a:active, a:visited {
   text-align: center; /* This will center the text inside the paragraph tag */
    padding: 10px;
    background-color: darkred;
    color: white;
    margin: auto;
    text-decoration: none;
    display: inline-block;
}

a:hover {
  background-color: red;
}

img {
  border: 1px solid darkred;
}

.special {
  border: 0px solid darkred;
}

iframe {
  border: 1px solid darkred;
}

.footer {
  position: fixed;
  left: 0;
  bottom: 0;
  width: 100%;
  background-color: darkred;
  color: white;
  text-align: center;
  padding: 10px;
}


.header {
  text-align: center;
  background-color: darkred;
  width: 45%;
  margin: auto;
}