html, body {
    text-align: center;
    background-color: #FFFFFF;
    height:100%;
    padding:0;
    margin:0;
    color: #000000;
    font-size: 100%;
    font-family: "Open Sans", "Helvetica Neue", HelveticaNeue, Helvetica, Arial, sans-serif;
}
page {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 100%;
  max-width: 1000px;
  flex-direction: column;
  margin: 0 auto;
}
section.content {
    width:100%;
}
header {
    align-self: flex-start;
}  
footer {
    align-self: flex-end;
}
h1 img {
    width: 100%;
}
.subtitle {
    margin: 0;
    padding: 0;
    list-style: none;
    max-width:90%;
    margin: 0 auto;
}
.subtitle h2 {
    margin:0;
    clear:none;
    display: inline;
    text-transform: uppercase;
    font-size: 1.5em;
}
.subtitle li {
    display: inline-block;
}
.subtitle li:after { 
    content: ' - ';
}
.subtitle li:last-child::after { 
    content: ' ';
}
.social {
    font-size: 2em;
    padding: 0;
    list-style: none;
    max-width:90%;
    margin: 0 auto;
    margin-top:20px;    
}
.social li {
    display: inline-block;
    padding:20px 5px;
}
.social li a {
    color: #000000;
}
.social i, 
.social i:focus, 
.social i:active {
    font-weight: normal;
}
.social i:hover {
    color:#000000;
}

@media only screen and (max-width: 600px) {
    .social {
        font-size: 3em;
    }  
    .subtitle h2 {
        font-size: 1em;
    }  
}