* {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box; }

* {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box; }

h1 {
  font-weight: bold;
  font-size: 20px;
  letter-spacing: 1px; }

#main {
  *zoom: 1;
  max-width: 68em;
  margin-left: auto;
  margin-right: auto;
  -webkit-transition: all 1s ease-in-out;
  -moz-transition: all 1s ease-in-out;
  -o-transition: all 1s ease-in-out;
  transition: all 1s ease-in-out; }
  #main:before, #main:after {
    content: " ";
    display: table; }
  #main:after {
    clear: both; }

.group:after {
  content: "";
  display: table;
  clear: both; }

@media screen and (min-width: 250px) {
  #main {
    font-family: Helvetica, sans-serif; }

  header {
    background-color: white;
    z-index: 200;
    width: 100%;
    position: fixed;
    width: 100%;
    height: 50px;
    margin-top: 3%;
    opacity: .85; }

  h1 {
    margin-left: 8%;
    margin-top: 5%;
    position: relative;
    z-index: 100;
    display: block;
    float: left;
    margin-right: 2.35765%;
    width: 74.41059%; }
    h1:last-child {
      margin-right: 0; }

  .menu {
    position: relative;
    margin-right: 10%;
    margin-top: 5%;
    display: block;
    float: left;
    margin-right: 2.35765%;
    width: 8.3046%;
    margin-right: 0; }
    .menu:last-child {
      margin-right: 0; }

  #sidenav {
    display: none; }

  nav {
    font-size: 75%;
    position: fixed;
    width: inherit;
    padding: 5% 0 5% 0;
    top: 9.85%;
    left: 5%;
    opacity: .85;
    background-color: white;
    display: block;
    float: left;
    margin-right: 2.35765%;
    width: 100%; }
    nav:last-child {
      margin-right: 0; }
    nav p {
      padding: 1% 0 1% 0;
      margin-top: 2%;
      margin-left: 3%; }
    nav #search {
      position: fixed;
      left: 50%;
      top: 13%;
      z-index: 500; }
      nav #search img {
        display: inline;
        position: absolute;
        z-index: 0; }
      nav #search form {
        left: 25%;
        position: relative; }
      nav #search input {
        border: white;
        width: 70%; }
    nav .filters {
      display: block;
      float: left;
      margin-right: 2.35765%;
      width: 82.94039%;
      margin-left: 8.5298%; }
      nav .filters:last-child {
        margin-right: 0; }
      nav .filters ul {
        display: block;
        float: left;
        margin-right: 2.84259%;
        width: 43.43658%; }
        nav .filters ul:last-child {
          margin-right: 0; }
        nav .filters ul li {
          padding: 2% 0 1% 0; }

  #content {
    display: block;
    float: left;
    margin-right: 2.35765%;
    width: 82.94039%;
    margin-left: 8.5298%;
    margin-top: 20%; }
    #content:last-child {
      margin-right: 0; }
    #content img {
      max-width: 100%;
      padding-bottom: 3%;
      padding-top: 5%; }
    #content .caption {
      font-size: 75%;
      display: block;
      float: left;
      margin-right: 2.35765%;
      width: 82.94039%; }
      #content .caption:last-child {
        margin-right: 0; } }
@media screen and (min-width: 480px) {
  header h1 {
    margin-top: 3%; }
  header .menu {
    margin-top: 3%;
    display: block;
    float: left;
    margin-right: 2.35765%;
    width: 4.0397%; }
    header .menu:last-child {
      margin-right: 0; }

  #main {
    *zoom: 1;
    max-width: 68em;
    margin-left: auto;
    margin-right: auto; }
    #main:before, #main:after {
      content: " ";
      display: table; }
    #main:after {
      clear: both; }

  #content {
    margin-top: 15%; }
    #content li {
      display: block;
      float: left;
      margin-right: 2.35765%;
      width: 48.82117%; }
      #content li:last-child {
        margin-right: 0; }
      #content li:nth-child(2n) {
        margin-right: 0; }
      #content li:nth-child(2n+1) {
        clear: left; }

  nav #search {
    top: 17%;
    left: 43%; }
  nav .filters {
    display: block;
    float: left;
    margin-right: 2.35765%;
    width: 82.94039%;
    margin-left: 8.5298%; }
    nav .filters:last-child {
      margin-right: 0; }
    nav .filters ul {
      display: block;
      float: left;
      margin-right: 2.84259%;
      width: 33.15232%; }
      nav .filters ul:last-child {
        margin-right: 0; }
      nav .filters ul li {
        padding: 2% 0 1% 0; } }
@media screen and (min-width: 760px) {
  #main header h1 {
    margin-top: 1%; }
  #main header .menu {
    display: none; }
  #main #content {
    display: block;
    float: left;
    margin-right: 2.35765%;
    width: 70.14568%;
    position: relative;
    margin-top: 10%; }
    #main #content:last-child {
      margin-right: 0; }
  #main nav {
    display: none; }
  #main #sidenav {
    display: block;
    float: left;
    margin-right: 2.35765%;
    width: 23.23176%;
    margin-right: 0;
    position: fixed;
    top: 6%;
    left: 80%;
    z-index: 1000; }
    #main #sidenav:last-child {
      margin-right: 0; }
    #main #sidenav #sidesearch {
      margin-top: 4%; }
      #main #sidenav #sidesearch img {
        display: block;
        float: left;
        margin-right: 2.35765%;
        width: 9.58407%; }
        #main #sidenav #sidesearch img:last-child {
          margin-right: 0; }
    #main #sidenav #options {
      margin-top: 18%;
      margin-left: 10%;
      font-size: 75%; }
      #main #sidenav #options p {
        padding: 2% 0 2% 0; }
      #main #sidenav #options .sidefilters ul {
        padding: 4% 0 4% 0; }
        #main #sidenav #options .sidefilters ul li {
          padding: 1% 0 1% 0; }
    #main #sidenav #numbers {
      font-size: 75%;
      display: block;
      float: left;
      margin-right: 2.35765%;
      width: 23.23176%;
      margin-right: 0;
      position: fixed;
      top: 90%;
      margin-left: 2.13245%; }
      #main #sidenav #numbers:last-child {
        margin-right: 0; }
      #main #sidenav #numbers li {
        padding: 0 2% 0 2%;
        display: inline; } }
@media screen and (min-width: 1024px) {
  #main {
    display: block;
    float: left;
    margin-right: 2.35765%;
    width: 100%; }
    #main:last-child {
      margin-right: 0; }

  header {
    left: 5%; }
    header h1 {
      display: block;
      float: left;
      margin-right: 2.35765%;
      width: 23.23176%;
      margin-left: 0%; }
      header h1:last-child {
        margin-right: 0; }

  #content {
    margin-bottom: 5%;
    display: block;
    float: left;
    margin-right: 2.35765%;
    width: 100%;
    margin-left: 12.79471%; }
    #content:last-child {
      margin-right: 0; }
    #content li {
      display: block;
      float: left;
      margin-right: 2.35765%;
      width: 91.4702%;
      margin-top: 0%;
      padding-top: 0; }
      #content li:last-child {
        margin-right: 0; }
      #content li img {
        padding-top: 2%; }

  #sidenav {
    left: 70%; }
    #sidenav #sidesearch img {
      display: block;
      float: left;
      margin-right: 2.35765%;
      width: 14.70196%; }
      #sidenav #sidesearch img:last-child {
        margin-right: 0; }
    #sidenav #numbers {
      font-size: 75%;
      display: block;
      float: left;
      margin-right: 2.35765%;
      width: 23.23176%;
      margin-right: 0;
      position: fixed;
      top: 90%;
      margin-left: 2.13245%; }
      #sidenav #numbers:last-child {
        margin-right: 0; }
      #sidenav #numbers li {
        padding: 0 2% 0 2%;
        display: inline; } }