/* css Zen Garden */
/* 'Cyberpunk' by Jorge Yau - https://codenameyau.github.io */
/* css released under Creative Commons License - http://creativecommons.org/licenses/by-nc-sa/1.0/ */

/* IMPORTANT */
/* This design is not a template. You may not reproduce it elsewhere without the
   designer's written permission. However, feel free to study the CSS and use
   techniques you learn from it elsewhere. */

/* Google Fonts */
@import url(https://fonts.googleapis.com/css?family=Play);
@import url(https://fonts.googleapis.com/css?family=Quicksand:400);

/* basic elements */
html, body {
  margin: 0;
  padding: 0;
}

body {
  width: 100%;
  height: 100%;
  background: url('cyberpunk-street.jpg');
  background-attachment: fixed;
  font-family: 'Play', sans-serif;
  color: #dadada;
  letter-spacing: 2px;
  cursor: default;
}

p {
  font-family: 'Quicksand', sans-serif;
  color: #fafafa;
  line-height: 35px;
}

h1, h2, h3, h4 {
  text-transform: uppercase;
  letter-spacing: 5px;
  line-height: 40px;
}

a {
  color: #AAB3FF;
  text-decoration: none;
}

a:hover {
  color: #B3C9FF;
  text-decoration: underline;
}

.page-wrapper {
  height: 100%;
}

/* Black navbar */
.intro {
  background: rgba(0, 0, 0, 0.65);
  padding: 10px;
  vertical-align: middle;
}

.intro > header:hover {
  color: #FAFAFA;
}

.intro > header h1 {
  margin: 120px 0 30px 0;
  font-size: 50px;
  text-align: center;
}

.intro > header h2 {
  margin: 10px;
  font-size: 25px;
  text-align: center;
}

/* Summary */
.summary {
  width: 60%;
  margin: 120px auto 120px auto;
}

.summary p {
  display: inline;
  line-height: 45px;
  font-size: 22px;
}

/* Content */
section div{

}

/* Responsive */
@media(max-width: 560px) {
  .summary {width: 80%}
  .summary p {
    font-size: 20px;
  }
}