/*================================
GENERAL SETTINGS
=================================*/
@import url("http://fonts.googleapis.com/css?family=Montserrat:400,700");
/*================================
TYPOGRAPHIC SETTINGS
=================================*/
/*================================
TINY RESET
=================================*/
* {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  -ms-box-sizing: border-box;
  -o-box-sizing: border-box;
  box-sizing: border-box; }

html, body {
  padding: 0 0 0 0;
  margin: 0 0 0 0;
  height: 100%;
  width: 100%;
  font-size: 1rem;
  line-height: 1.5rem; }

body {
  font-family: "Montserrat", sans-serif;
  color: #5a5a5a; }

/*================================
TYPOGRAPHY
=================================*/
.h1 {
  padding: 0 0 0 0;
  font-size: 3.375rem;
  line-height: 4.5rem;
  margin: 3rem 0 1.5rem 0; }

.h2 {
  padding: 0 0 0 0;
  font-size: 2.25rem;
  line-height: 3rem;
  margin: 3rem 0 1.5rem 0; }

.h3 {
  padding: 0 0 0 0;
  font-size: 1.5rem;
  line-height: 2.25rem;
  margin: 1.5rem 0 1.5rem 0; }

.h4 {
  padding: 0 0 0 0;
  font-size: 1rem;
  line-height: 1.5rem;
  margin: 1.5rem 0 1.5rem 0; }

p, ul {
  padding: 0 0 0 0;
  margin: 1.5rem 0 1.5rem 0;
  font-size: 1rem; }

a {
  text-decoration: none; }

img, iframe {
  max-width: 100%; }

img {
  width: auto;
  height: auto; }

/*================================
SIZE PRIMITIVES & BLOCKS
=================================*/
.container {
  width: 100%;
  max-width: 1020px;
  margin: 0 auto 0 auto; }
  .container:before, .container:after {
    content: " ";
    display: table; }
  .container:after {
    clear: both; }

.container--measured {
  max-width: 760px; }

.full {
  width: 100%; }

.half {
  width: 100%; }

.third {
  width: 100%; }

.quarter {
  width: 100%; }

.media-holder {
  text-align: center; }

img {
  max-width: 100%;
  width: auto;
  height: auto; }

/*================================
LAYOUT HELPERS
=================================*/
.left {
  float: left; }

.right {
  float: right; }

.align-center {
  text-align: center; }

/*================================
TEXT MODIFIERS
=================================*/
.text--white {
  color: #fff; }

.text--faded {
  color: #aaa; }

.text--small {
  font-size: .875rem; }

/*================================
BACKGROUND MODIFIERS
=================================*/
.background--orange {
  background: #F38630; }

/*================================
GIFWALL STYLES
=================================*/
.header {
  padding: 1.5rem 0; }
  .header .h1 {
    margin-top: 0;
    margin-bottom: 0;
    font-weight: 700; }
  .header .h3 {
    margin-top: 0;
    color: rgba(255, 255, 255, 0.7); }

.gifwall {
  -webkit-column-count: 5;
  -webkit-column-gap: 0;
  -moz-column-count: 4;
  -moz-column-gap: 0;
  -ms-column-count: 4;
  -ms-column-gap: 0;
  -o-column-count: 4;
  -o-column-gap: 0;
  column-count: 4;
  column-gap: 0; }

.columns--3 {
  -webkit-column-count: 3;
  -moz-column-count: 3;
  -ms-column-count: 3;
  -o-column-count: 3;
  column-count: 3; }

.columns--4 {
  -webkit-column-count: 4;
  -moz-column-count: 4;
  -ms-column-count: 4;
  -o-column-count: 4;
  column-count: 4; }

.columns--5 {
  -webkit-column-count: 5;
  -moz-column-count: 5;
  -ms-column-count: 5;
  -o-column-count: 5;
  column-count: 5; }

.columns--6 {
  -webkit-column-count: 6;
  -moz-column-count: 6;
  -ms-column-count: 6;
  -o-column-count: 6;
  column-count: 6; }

/*================================
CONTROL STYLES
=================================*/
.controls {
  position: absolute;
  top: 0;
  right: 0;
  width: 250px;
  padding: 1.5rem 0; }

.icon {
  display: inline-block;
  text-align: center;
  width: 30px;
  height: 20px;
  overflow: hidden;
  margin: 0 0 0 20px;
  cursor: pointer;
  opacity: 0.5; }
  .icon:hover {
    opacity: 1; }
  .icon.active {
    opacity: 1; }

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