html, body {
  height: 100%; }

body {
  background-color: #fff;
  font-family: "Roboto Condensed", sans-serif;
  font-size: 20px; }

p {
  font-size: 1em; }

a {
  transition: color 0.2s ease-in-out;
  text-decoration: none; }

h1, h2 {
  margin-top: 0; }

h1 {
  font-size: 1.8em; }

h2 {
  margin-bottom: 1em; }

h3 {
  font-size: 0.9em;
  margin-bottom: 0.4em;
  margin-top: 1.2em; }

section {
  padding: 2em 1em 2em; }

.logo, .cover-photo {
  height: 100%; }

.logo {
  padding: 0;
  text-align: center; }
  .logo img {
    -ms-transform: translateY(-50%);
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
    margin: 0;
    max-width: 635px;
    padding: 0;
    position: relative;
    top: 50%;
    width: 90%; }

.cover-photo {
  background-color: #000;
  background-image: url("../img/qai-cover-photo.jpg");
  background-position: 50% 40%;
  background-repeat: no-repeat;
  background-size: cover; }

.events {
  background-color: #000;
  color: #fff; }
  .events ul {
    list-style: none;
    padding: 0; }
  .events p {
    font-size: 0.8em;
    margin-bottom: 0.5em;
    margin-top: 0.5em; }
  .events a {
    color: #777; }
  .events a:focus, .events a:hover {
    color: #fff; }

.contact .social .fa {
  font-size: 2em; }
.contact .social span {
  margin: 1em 0.4em 1em 0.1em; }
.contact a {
  color: #000;
  font-size: 0.8em; }
  .contact a:focus, .contact a:hover {
    color: #666; }

footer {
  background-color: #000;
  color: #fff;
  font-size: 0.8em;
  height: 3em;
  line-height: 3em;
  text-align: center; }

@media (max-height: 550px) and (orientation: landscape) {
  .logo img {
    max-height: 60%;
    width: auto; }

  .cover-photo {
    min-height: 400px; } }
@media (min-width: 768px) {
  section {
    padding: 4em 3em 4em; } }
@media (min-width: 1280px) {
  h1 {
    font-size: 2.2em; }

  p {
    font-size: 1.2em;
    line-height: 1.3em; }

  section {
    padding: 4em 6em 4em; }

  h2 {
    font-size: 1.8em; }

  h3 {
    font-size: 1.1em; }

  .events p {
    font-size: 1em; }

  .contact a {
    font-size: 1em; } }
@media (min-width: 1600px) {
  section {
    padding: 6em; } }

/*# sourceMappingURL=main.css.map */
