


body {
  font-family: 'Source Sans Pro', Helvetica, Arial, sans-serif;
  color: #444;
  background: #FFFFFF; 
}

body > header,
body > section,
body > footer {
  display: block;
  width: 100%;
  clear: both;
  float: left;
}

.wrap {  
  padding: 0 15px 0 15px;
}
.grid .whole {
  padding:10px;
}


h1, h2, h3 {
  font-family: "Source Sans Pro", Helvetica, Arial, sans-serif;
  font-weight:600;
  letter-spacing: -.03em;
}

h1 {
  font-size: 4em;
  margin: 0;
}

h2 {
  font-size: 2em;
  margin: 0.4em 0;
}

h3 {
  font-size: 1.5em;
  margin: 0.5em 0;
}

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


p {
  font-weight:300;
  font-size: 1.3em;
  line-height: 1.6em;
  margin: 10px 0;
}

.small {
  font-weight:300;
  font-size: 1em;
  line-height: 1.4em;
}

footer p {
  margin: 0;
  font-size: 1em;
}

img {
  max-width:100%; 
}

iframe {
  max-width:100%; 
}

header {
  padding-top:30px;
}

header img {
  max-width: 300px;
}

footer img {
  float:right;
}

section {
  padding-bottom: 20px;
}

footer {
  padding: 20px 0;
  margin-bottom: 50px;
}

.divider {
  border-bottom: 1px solid #ccc;
  margin-bottom: 20px;
}

.video {
  position: relative;
  padding-bottom: 56.25%; /*6.29%;*/
  /*padding-top: 30px; /* IE6 workaround*/
  height: 0;
  overflow: hidden;
}

.video iframe,
.video object,
.video embed {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

code {
  font-size: 12px;
  line-height: 1em;
}

.codeblock {
  padding: 0 20px;
}

.button {
  text-align: center;
  margin: 17px 0;
}


.button a {
  border-radius: 5px;
  background: #efefef;
  padding: 10px 16px;
  display: inline-block;
  line-height: 1.3em;
}

.button a:hover {
  background: #ddd;
}

header .button a{
  font-weight:600;
}

header .button a:hover{
  background: #D00;
  color: #FFF;
}

@media screen and (max-width: 640px) {
  .wrap {
    padding: 0;
  }
  h1 {
    font-size: 2.5em;
  }
  h2 {
    font-size: 2em;
    text-align: center;
  }
  h3 {
    font-size: 1.3em;
  }
  p {
    font-size: 1.2em;
    line-height: 1.4em;
  }
  .small {
    font-size: 1em;
    line-height: 1.4em;
  }
  header img {
    max-width: 250px;
  }
  footer img {
    float:center;
    padding-top:20px;
  }

}

