/* BASE */

html,
body {
  font-size: 100%;
  line-height: 1.6789;
  font-family: 'Exo 2', 'Helvetica Neue', Helvetica, Arial, sans-serif;
  color: #333;
  background: #f1f1f1;
  margin: 0;
  padding: 0;
}
footer {
  margin-top: 3em;
  background: #ddd;
  padding: 3em 0 1em;
}
p {
  margin-top: 0;
  margin-bottom: 0;
  padding-bottom: 1em;
}
h1 {
  margin-top: 0;
  padding-top: .67em;
}
dfn {
  white-space: nowrap;
  font-style: normal;
  font-family: monospace;
  background: #B8D1E8;
  color: #000;
  padding: .1em .5em .2em;
  border-radius: .4em;
  text-shadow: 0px 1px 0px #ccc;
}
a {
  color: #36b;
}
.mini {
  font-size: 60%;
  color: #999;
}
ul {
  background: #F0C76E;
  list-style: none outside none;
  padding: 1em;
}
li {
  display: block;
  width: auto;

        user-select: none; /* CSS3 (little to no support) */
    -ms-user-select: none; /* IE 10+ */
   -moz-user-select: none; /* Gecko (Firefox) */
-webkit-user-select: none; /* Webkit (Safari, Chrome) */

}
li:hover {
  cursor: pointer;
  background: #fff;
}
li.is-active {
  background: #aef1ff;
}
li.is-active:hover {
  background: #caf1ff;
}

/* LAYOUT */

.container {
  margin: 0 auto;
  width: 100%;
}
.example,
.is-centered {
  text-align: center;
}

/* ENHANCED SIZES */

@media screen and (min-width: 20.000em) {
  /*320px*/

  body {
    font-size: 100%;
  }
  .container {
    width: 90%;
  }
}
@media screen and (max-width: 37.438em) {
  /*599px*/

  .container {
    text-align: center;
  }
}
@media screen and (min-width: 37.500em) {
  /*600px*/

  body {
    font-size: 112.5%;
    line-height: 1.6789;
  }
  .container {
    width: 70.5%;
    text-align: left;
  }
}
@media screen and (min-width: 50.000em) {
  /*800px*/

  body {
    font-size: 125.0%;
    line-height: 1.56789;
  }
  .container {
    width: 58.5%;
  }
}
@media screen and (min-width: 64.375em) {
  /*1030px*/

  body {
    font-size: 147.5%;
    line-height: 1.456789;
  }
  .container {
    width: 51.7%;
  }
}
@media screen and (min-width: 75.000em) and (min-height: 31.250em) {
  /*1200px X 500px*/

  body {
    font-size: 170%;
    line-height: 1.3456789;
  }
  .container {
    width: 47%;
  }
}