body {
  padding: 0;
  margin: 0;
  background-color: #4f5362;
  font-family: 'Open Sans', sans-serif;
  color: #333; }

p {
  font-size: 12px; }

h4 {
  font-size: 14px;
  margin-top: 0; }

#header {
    /** No text selection. This makes navigation cleaner for fast
	clicks. **/
  -webkit-touch-callout: none;
  -webkit-user-select: none;
  -khtml-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  color: white;
  padding: 40px;
  font-family: 'Open Sans', sans-serif;
  width: 100%;
  max-width: 850px;
  margin-left: auto;
  margin-right: auto; }
  #header > #header-title {
    font-size: 60px;
    font-family: 'Bad Script', cursive;
    float: left;
    margin-right: 75px; }
    #header > #header-title > a {
      color: white;
      text-decoration: none; }
  #header > #header-navbar > ul > li {
    color: #838492;
    display: inline-block;
    list-style: none;
    margin-left: 25px;
    margin-right: 25px;
    margin-top: 45px; }
    #header > #header-navbar > ul > li > a {
      color: white;
      text-decoration: none; }

#content {
  min-height: 100%;
  margin: 0 auto;
  padding-bottom: 50px; }
  #content.base {
    max-width: 850px; }
  #content.home {
    padding-bottom: 10px; }

#footer {
  position: fixed;
  bottom: 0;
  width: 100%;
  height: 20%;
  max-height: 250px;
  min-height: 140px;
  background: -webkit-linear-gradient(#838492, #c5c5d1);
  background: -o-linear-gradient(#838492, #c5c5d1);
  background: -moz-linear-gradient(#838492, #c5c5d1);
  background: linear-gradient(#838492, #c5c5d1); }
  #footer > #footer-inner {
    max-width: 850px;
    margin: 0 auto; }
    #footer > #footer-inner > #footer-bench {
      position: absolute;
      top: 60%;
      margin-top: -75px; }
      #footer > #footer-inner > #footer-bench > img {
        width: 400px;
        opacity: 0.8; }

#bio img {
  float: left;
  width: 300px;
  margin: 0 40px 30px 0; }
#bio p {
  margin-top: 0;
  text-align: justify; }
#bio em {
  font-size: 16px;
  color: #4f5362; }

.well {
  background-color: #ededed;
  padding: 40px;
  -webkit-box-shadow: 0px 5px 20px #333;
  -moz-box-shadow: 0px 5px 20px #333;
  box-shadow: 0px 5px 20px #333;
  margin: 20px 0; }

#slider {
  overflow: hidden;
  background: #ededed;
  padding: 5px;
  -webkit-box-shadow: 0px 5px 20px #333;
  -moz-box-shadow: 0px 5px 20px #333;
  box-shadow: 0px 5px 20px #333; }
  #slider > #slider-inner {
    white-space: nowrap; }
    #slider > #slider-inner > img {
      padding: 5px; }

#gallery {
  text-align: justify; }
  #gallery .to-sort {
    display: none; }
  #gallery .column {
    float: left;
    width: 25%;
    min-width: 210px; }
  #gallery .image-wrapper {
    cursor: pointer;
    text-align: center;
    position: relative; }
    #gallery .image-wrapper:hover .image-label {
      opacity: 1; }
    #gallery .image-wrapper .image-label {
      opacity: 0;
      font-size: 10px;
      line-height: 20px;
      text-align: left;
      padding: 0 5px;
      background: rgba(0, 0, 0, 0.75);
      color: #ededed;
      position: absolute;
      bottom: 5px;
      left: 6px;
      right: 6px;
      height: 20px;
      text-overflow: ellipsis;
      overflow: hidden;
      white-space: nowrap; }
      #gallery .image-wrapper .image-label span.pull-right {
        float: right;
        color: #4f5362;
        font-weight: bold;
        font-size: 16px; }
  #gallery img {
    margin: 5px; }
  #gallery:after {
    content: '';
    display: inline-block;
    width: 100%;
    height: 0; }

#gallery-lightbox .lightbox .lightbox-inner {
  margin: auto; }
#gallery-lightbox .lightbox .lightbox-label {
  text-align: left;
  float: left;
  width: 70%;
  margin-top: 20px; }
  #gallery-lightbox .lightbox .lightbox-label .lightbox-name {
    font-size: 16px;
    font-weight: bold;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis; }
  #gallery-lightbox .lightbox .lightbox-label .lightbox-description {
    font-size: 14px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis; }
#gallery-lightbox .lightbox .lightbox-available {
  float: right;
  margin-top: 20px;
  color: #4f5362;
  font-weight: bold;
  font-size: 16px; }

.lightbox {
    /** No text selection. This makes navigation cleaner for fast
	clicks. **/
  -webkit-touch-callout: none;
  -webkit-user-select: none;
  -khtml-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  /** Position and style */
  position: fixed;
  z-index: 999;
  width: 100%;
  height: 100%;
  text-align: center;
  top: 0;
  left: 0;
  background: rgba(0, 0, 0, 0.8);
  color: #ededed; }
  .lightbox .navigation {
    position: fixed;
    z-index: 1000;
    width: 100px;
    height: 100px;
    cursor: pointer;
    padding: 50px; }
  .lightbox .navigation.navigation-prev {
    top: 50%;
    left: 50px;
    margin-top: -100px;
    background: url(../img/left.png) no-repeat center; }
  .lightbox .navigation.navigation-next {
    top: 50%;
    right: 50px;
    margin-top: -100px;
    background: url(../img/right.png) no-repeat center; }

.lightbox:target {
  /** Remove default browser outline */
  outline: none;
  /** Unhide lightbox **/
  display: block; }

#contact {
  font-size: 14px; }
  #contact:after {
    content: '';
    height: 0;
    display: block;
    clear: both; }
  #contact .left {
    float: left;
    width: 40%;
    margin: 2%; }
  #contact .right {
    float: right;
    width: 40%;
    margin: 2%; }
  #contact .full {
    clear: both;
    width: 96%;
    margin: 0 2%; }
  #contact .pull-right {
    text-align: right; }
  #contact label {
    display: block;
    margin-top: 15px; }
  #contact input, #contact textarea {
    width: 100%;
    background: none;
    border: 1px solid #4f5362;
    padding: 2px;
    font-size: 16px; }
  #contact textarea {
    width: 98%;
    height: 145px;
    font-family: 'Open Sans', sans-serif; }
  #contact input[type="submit"] {
    width: 100px;
    background: #c5c5d1;
    color: #333; }
  #contact .errorlist {
    color: red;
    font-style: italic;
    font-size: 12px;
    list-style: none;
    padding: 0;
    margin: 0; }

/* Media queries for responsiveness start here. */
@media screen and (max-height: 860px) {
  #header {
    padding: 0 40px 10px 40px; }

  #gallery {
    margin-top: 30px; } }
@media screen and (max-height: 650px) {
  #slider img {
    height: 200px; } }
@media screen and (max-height: 520px) {
  #footer {
    display: none; }

  #content {
    margin-bottom: 0 !important;
    padding-bottom: 10px; } }
@media screen and (max-width: 1000px) {
  .lightbox .navigation.navigation-prev {
    left: 0; }
  .lightbox .navigation.navigation-next {
    right: 0; } }