body {
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  box-sizing: border-box;
  font-family: 'Kanit', sans-serif; }

*, *:before, *:after {
  box-sizing: inherit;
  -webkit-tap-highlight-color: transparent; }

a {
  text-decoration: none; }

ul {
  margin: 0;
  padding: 0;
  list-style-type: none; }

li {
  display: inline-block;
  margin: 0;
  padding: 0; }

:focus {
  outline: none; }

#gallery {
  background-color: #000;
  overflow: hidden;
  /**
   * Special sizing for mobile view
   */
  /**
   * Buttons
   */
  /**
   * Slides
   */ }
  @media (max-width: 1024px) {
    #gallery .prop {
      padding-top: 50%; }
    #gallery .slides-wrapper {
      position: absolute;
      width: 100%;
      overflow: hidden;
      top: 50%;
      -webkit-transform: translateY(-50%);
          -ms-transform: translateY(-50%);
              transform: translateY(-50%); } }
  #gallery .next,
  #gallery .prev {
    display: block;
    position: absolute;
    width: 60px;
    height: 60px;
    top: 50%;
    margin-top: -30px;
    background-color: #f7ca2c;
    overflow: hidden; }
    @media (max-width: 659px) {
      #gallery .next,
      #gallery .prev {
        width: 44px;
        height: 44px;
        margin-top: -22px; } }
    #gallery .next img,
    #gallery .prev img {
      width: 16px;
      height: auto;
      position: absolute;
      display: block;
      top: 50%;
      left: 50%;
      margin-top: -9px; }
      @media (max-width: 659px) {
        #gallery .next img,
        #gallery .prev img {
          width: 14px;
          height: auto;
          margin-top: -7px; } }
  #gallery .next {
    right: 0; }
    #gallery .next img {
      margin-left: -6px; }
    #gallery .next:hover img {
      -webkit-animation: galleryArrowNext 600ms cubic-bezier(0.68, 0, 0.265, 1);
              animation: galleryArrowNext 600ms cubic-bezier(0.68, 0, 0.265, 1); }
  #gallery .prev {
    left: 0;
    -webkit-transform: translateX(-100px);
        -ms-transform: translateX(-100px);
            transform: translateX(-100px); }
    #gallery .prev img {
      margin-left: -9px; }
    #gallery .prev:hover img {
      -webkit-animation: galleryArrowPrev 600ms cubic-bezier(0.68, 0, 0.265, 1);
              animation: galleryArrowPrev 600ms cubic-bezier(0.68, 0, 0.265, 1); }
  #gallery .slides {
    width: 100%;
    height: 100%;
    overflow: hidden;
    position: absolute;
    top: 0;
    left: 0; }
    #gallery .slides .scroll {
      height: 100%; }
    #gallery .slides li {
      height: 100%;
      display: block;
      float: left;
      overflow: hidden; }
    #gallery .slides .image {
      background-repeat: no-repeat;
      background-size: cover;
      background-position: center center;
      height: 100%; }

@-webkit-keyframes galleryArrowPrev {
  0% {
    -webkit-transform: translateX(0);
            transform: translateX(0); }
  5% {
    -webkit-transform: translateX(5px);
            transform: translateX(5px); }
  50% {
    -webkit-transform: translateX(-44px);
            transform: translateX(-44px); }
  50.0001% {
    -webkit-transform: translateX(44px);
            transform: translateX(44px); }
  100% {
    -webkit-transform: translateX(0);
            transform: translateX(0); } }

@keyframes galleryArrowPrev {
  0% {
    -webkit-transform: translateX(0);
            transform: translateX(0); }
  5% {
    -webkit-transform: translateX(5px);
            transform: translateX(5px); }
  50% {
    -webkit-transform: translateX(-44px);
            transform: translateX(-44px); }
  50.0001% {
    -webkit-transform: translateX(44px);
            transform: translateX(44px); }
  100% {
    -webkit-transform: translateX(0);
            transform: translateX(0); } }

@-webkit-keyframes galleryArrowNext {
  0% {
    -webkit-transform: translateX(0);
            transform: translateX(0); }
  5% {
    -webkit-transform: translateX(-5px);
            transform: translateX(-5px); }
  50% {
    -webkit-transform: translateX(44px);
            transform: translateX(44px); }
  50.0001% {
    -webkit-transform: translateX(-44px);
            transform: translateX(-44px); }
  100% {
    -webkit-transform: translateX(0);
            transform: translateX(0); } }

@keyframes galleryArrowNext {
  0% {
    -webkit-transform: translateX(0);
            transform: translateX(0); }
  5% {
    -webkit-transform: translateX(-5px);
            transform: translateX(-5px); }
  50% {
    -webkit-transform: translateX(44px);
            transform: translateX(44px); }
  50.0001% {
    -webkit-transform: translateX(-44px);
            transform: translateX(-44px); }
  100% {
    -webkit-transform: translateX(0);
            transform: translateX(0); } }
/*# sourceMappingURL=gallery.css.map */