
body::-webkit-scrollbar,
div::-webkit-scrollbar,
p::-webkit-scrollbar,
textarea::-webkit-scrollbar,
section::-webkit-scrollbar,
ul::-webkit-scrollbar,
iframe::-webkit-scrollbar {
    width: 4px;
    height: 12px;
    -webkit-border-radius: 12px;
}

body::-webkit-scrollbar {
    width: 8px;
}
body::-webkit-scrollbar-track,
div::-webkit-scrollbar-track,
p::-webkit-scrollbar-track,
textarea::-webkit-scrollbar-track,
section::-webkit-scrollbar-track,
ul::-webkit-scrollbar-track {
    background: #F5F5F5;
}

body::-webkit-scrollbar-thumb,
div::-webkit-scrollbar-thumb,
p::-webkit-scrollbar-thumb,
textarea::-webkit-scrollbar-thumb,
section::-webkit-scrollbar-thumb,
ul::-webkit-scrollbar-thumb {
    background: #6B747A;
    -webkit-border-radius: 12px;
}

 html {
    line-height: 1.15;
    -ms-text-size-adjust: 100%;
    -webkit-text-size-adjust: 100%
}

  body {margin: 0;}
  main {display: block;}

  h1 {font-size: 2em;margin: 0.67em 0;}

  hr {
    box-sizing: content-box;
    height: 0;
    overflow: visible;
  }
  pre {font-family: monospace, monospace;font-size: 1em;}


  a {background-color: transparent;}
  abbr[title] {
    border-bottom: none;
    text-decoration: underline;
    text-decoration: underline dotted;
  }

  b, strong {font-weight: bolder;}
  code,kbd,samp {font-family: monospace, monospace;font-size: 1em;}
  small {font-size: 80%;}
  sub,sup {font-size: 75%;line-height: 0;position: relative;vertical-align: baseline;}
  sub {bottom: -0.25em;}
  sup {top: -0.5em;}
  img {border-style: none;}


  button,
  input,
  optgroup,
  select,
  textarea {
    font-family: inherit;
    /* 1 */
    font-size: 100%;
    /* 1 */
    line-height: 1.15;
    /* 1 */
    margin: 0;
    /* 2 */
  }


  button,
  input {
    overflow: visible;
  }


  button,
  select {
    text-transform: none;
  }


  button,
  [type="button"],
  [type="reset"],
  [type="submit"] {
    -webkit-appearance: button;
  }


  button::-moz-focus-inner,
  [type="button"]::-moz-focus-inner,
  [type="reset"]::-moz-focus-inner,
  [type="submit"]::-moz-focus-inner {
    border-style: none;
    padding: 0;
  }


  button:-moz-focusring,
  [type="button"]:-moz-focusring,
  [type="reset"]:-moz-focusring,
  [type="submit"]:-moz-focusring {
    outline: 1px dotted ButtonText;
  }

  fieldset {
    padding: 0.35em 0.75em 0.625em;
  }


  legend {
    box-sizing: border-box;
    /* 1 */
    color: inherit;
    /* 2 */
    display: table;
    /* 1 */
    max-width: 100%;
    /* 1 */
    padding: 0;
    /* 3 */
    white-space: normal;
    /* 1 */
  }


  progress {
    vertical-align: baseline;
  }


  textarea {
    overflow: auto;
  }


  [type="checkbox"],
  [type="radio"] {
    box-sizing: border-box;
    padding: 0;
  }


  [type="number"]::-webkit-inner-spin-button,
  [type="number"]::-webkit-outer-spin-button {
    height: auto;
  }


  [type="search"] {
    -webkit-appearance: textfield;
    outline-offset: -2px;
  }

  [type="search"]::-webkit-search-decoration {
    -webkit-appearance: none;
  }


  ::-webkit-file-upload-button {
    -webkit-appearance: button;
    font: inherit;
  }

  details {
    display: block;
  }


  summary {
    display: list-item;
  }

  template {
    display: none;
  }


  [hidden] {
    display: none;
  }

  *,
  *::after,
  *::before {
    box-sizing: border-box;
  }

  html {
    height: 100%;
    color: #000;
    font: 16px/1.5 "Roboto", sans-serif;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    -webkit-tap-highlight-color: transparent;
  }

  h1,
  h2,
  h3 {
    font-family: "Montserrat", sans-serif;
  }

  h1 {
    font-size: 120px;
    font-weight: 700;
  }

  h2 {
    font-size: 48px;
  }

  h3 {
    font-weight: 700;
    font-size: 24px;
  }

  strong {
    font-weight: 700;
  }

  a {
    color: inherit;
    text-decoration: none;
  }

  .u-hiddenVisually {
    border: 0 !important;
    clip: rect(1px, 1px, 1px, 1px) !important;
    height: 1px !important;
    overflow: hidden !important;
    padding: 0 !important;
    position: absolute !important;
    width: 1px !important;
  }

  .Link {
    display: inline-block;
    position: relative;
    font-weight: 700;
    cursor: pointer;
   

  }

  .Link::after {
    content: '';
    display: block;
    position: absolute;
    left: 0;
    bottom: 0.1em;
    height: 0.08em;
    width: 100%;
    background-color: #000;
    transform: scale3d(1, 1, 1);
    transform-origin: 0% 50%;
    transition: transform 0.8s cubic-bezier(0.165, 0.84, 0.44, 1);
  }

  .Link:hover::after {
    transform: scale3d(0, 1, 1);
    transform-origin: 100% 50%;
  }
  .WorkItem  .Link--small{ 
    max-width: calc(100% - 80px);
    white-space: nowrap;text-overflow: ellipsis;overflow: hidden;
  }
  .Link--small::after {
    height: 1px;
    transition: transform 0.6s cubic-bezier(0.165, 0.84, 0.44, 1);
    transform: scale3d(0, 1, 1);
    transform-origin: 100% 50%;
  }

  .Link--small:hover::after {
    transform: scale3d(1, 1, 1);
    transform-origin: 0% 50%;
  }

  .WorkItem {
    margin: 0; display: flex;
  }

  .WorkItem-detail {
    font-size: 14px;
    font-weight: 300;
    color: #A9A9A9; padding-left: 10px;
  }

  .App-content {
    max-width: 1440px;
    padding-left: 20px;
    padding-right: 20px;
    margin-left: auto;
    margin-right: auto;
  }

  /* Easings
 ========================================================================== */
  .Home {
    padding-top: 75px;
    visibility: hidden;
    opacity: 0;
  }

  .Home-body {
    margin-top: 165px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
  }

  .Home-wrapWork {
    margin-right: 210px;
    width: 360px;
  }
  .Home-wrapContact {
    width: calc(100% - 570px);
    position: relative;
  }
  .Home-wrapContact  .icp{ position: absolute; bottom:0;right:0;}
  @media (max-width: 900px) {
    .App-content {
      padding-left: 32px;
      padding-right: 32px;
    }
    .Home-body {
      display: block;
      margin-top: 120px;
    }

    .Home-wrapWork {
      margin-right: 0;
      width: 100% ;
    }

    .Home-wrapContact {
      margin-top: 50px; 
      width: 100%;
      padding-bottom: 100px;
    }
    .Home-wrapContact  .icp{ position:static;padding-top: 50px; display: block;}
  }

  @media (max-width: 420px) {
    .Home {
      padding-top: 56px;
      padding-bottom: 86px;
    }

    .Home-body {
      margin-top: 100px;
    }
  }

  /* Easings
 ========================================================================== */
  .Hero-wrapCanvas {
    -webkit-transform: translateX(-12px);
    transform: translateX(-12px);
    width: 440px;
    height: 160px;
  }

  .Hero-subtitle {
    margin-top: 30px;
    margin-bottom: 0;
    font-weight: 400;
  }

  .Hero-subtitle span {
    display: block;
  }

  /* Animations
 ========================================================================== */
  .Hero-subtitle span {
    opacity: 0;
  }

  .Hero-subtitle span:first-child {
    -webkit-transform: translate3d(0, 100px, 0);
    transform: translate3d(0, 100px, 0);
  }

  .Hero-subtitle span:last-child {
    -webkit-transform: translate3d(0, 100px, 0);
    transform: translate3d(0, 100px, 0);
  }

  .Hero.is-visible .Hero-subtitle span {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
    -webkit-transition: opacity 0.8s cubic-bezier(0.165, 0.84, 0.44, 1), -webkit-transform 0.8s cubic-bezier(0.165, 0.84, 0.44, 1);
    transition: opacity 0.8s cubic-bezier(0.165, 0.84, 0.44, 1), -webkit-transform 0.8s cubic-bezier(0.165, 0.84, 0.44, 1);
    transition: transform 0.8s cubic-bezier(0.165, 0.84, 0.44, 1), opacity 0.8s cubic-bezier(0.165, 0.84, 0.44, 1);
    transition: transform 0.8s cubic-bezier(0.165, 0.84, 0.44, 1), opacity 0.8s cubic-bezier(0.165, 0.84, 0.44, 1), -webkit-transform 0.8s cubic-bezier(0.165, 0.84, 0.44, 1);
  }

  .Hero.is-visible .Hero-subtitle span:last-child {
    -webkit-transition-delay: 0.1s;
    transition-delay: 0.1s;
  }

  /* Responsive
 ========================================================================== */
  @media (max-width: 900px) {
    .Hero-subtitle {
      font-size: 36px;
    }

    .Hero-wrapCanvas {
      width: 400px;
      height: 115px;
      -webkit-transform: translateX(-16px);
      transform: translateX(-16px);
    }
  }

  @media (max-width: 420px) {
    .Hero-wrapCanvas {
      width: 290px;
      height: 90px;
      -webkit-transform: translateX(-18px);
      transform: translateX(-18px);
    }

    .Hero-subtitle {
      font-size: 27px;
    }
  }

  .WebGL {
    display: block;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
  }

  /* Easings
 ========================================================================== */
  .Work {
    font-family: "Roboto", sans-serif;
  }

  .Work-title {
    margin-top: 0;
    margin-bottom: 25px;
  }

  .Work-wrapItem:not(:last-child) {
    margin-bottom: 12px;
  }

  /* Animations
 ========================================================================== */
  .Work-title,
  .Work-wrapItem {
    opacity: 0;
  }

  .Work-title {
    -webkit-transform: translate3d(0, 40px, 0);
    transform: translate3d(0, 40px, 0);
  }

  .Work-wrapItem {
    -webkit-transform: translate3d(0, 50px, 0);
    transform: translate3d(0, 50px, 0);
  }

  .Work.is-visible .Work-title,
  .Work.is-visible .Work-wrapItem {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
    -webkit-transition: opacity 0.8s cubic-bezier(0.165, 0.84, 0.44, 1), -webkit-transform 0.8s cubic-bezier(0.165, 0.84, 0.44, 1);
    transition: opacity 0.8s cubic-bezier(0.165, 0.84, 0.44, 1), -webkit-transform 0.8s cubic-bezier(0.165, 0.84, 0.44, 1);
    transition: transform 0.8s cubic-bezier(0.165, 0.84, 0.44, 1), opacity 0.8s cubic-bezier(0.165, 0.84, 0.44, 1);
    transition: transform 0.8s cubic-bezier(0.165, 0.84, 0.44, 1), opacity 0.8s cubic-bezier(0.165, 0.84, 0.44, 1), -webkit-transform 0.8s cubic-bezier(0.165, 0.84, 0.44, 1);
  }

  .Work.is-visible .Work-wrapItem:nth-child(1) {
    -webkit-transition-delay: 0.1s;
    transition-delay: 0.1s;
  }

  .Work.is-visible .Work-wrapItem:nth-child(2) {
    -webkit-transition-delay: 0.2s;
    transition-delay: 0.2s;
  }

  .Work.is-visible .Work-wrapItem:nth-child(3) {
    -webkit-transition-delay: 0.3s;
    transition-delay: 0.3s;
  }

  .Work.is-visible .Work-wrapItem:nth-child(4) {
    -webkit-transition-delay: 0.4s;
    transition-delay: 0.4s;
  }

  /* Easings
 ========================================================================== */
  .Contact-title {
    margin-top: 0;
    margin-bottom: 25px;
  }

  .Contact-content {
    display: block;
  }

  .Contact-mail {
    cursor: pointer;
    position: relative;
  }

  .Contact-mailTooltip {
    pointer-events: none;
    position: absolute;
    bottom: -26px;
    left: 0;
    width: 100%;
    text-align: center;
    font-size: 14px;
    font-weight: 400;
  }

  /* Animations
 ========================================================================== */
  .Contact-title,
  .Contact-body {
    opacity: 0;
  }

  .Contact-title {
    -webkit-transform: translate3d(0, 40px, 0);
    transform: translate3d(0, 40px, 0);
  }

  .Contact-body {
    -webkit-transform: translate3d(0, 50px, 0);
    transform: translate3d(0, 50px, 0);
  }

  .Contact.is-visible .Contact-title,
  .Contact.is-visible .Contact-body {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
    -webkit-transition: opacity 0.8s cubic-bezier(0.165, 0.84, 0.44, 1), -webkit-transform 0.8s cubic-bezier(0.165, 0.84, 0.44, 1);
    transition: opacity 0.8s cubic-bezier(0.165, 0.84, 0.44, 1), -webkit-transform 0.8s cubic-bezier(0.165, 0.84, 0.44, 1);
    transition: transform 0.8s cubic-bezier(0.165, 0.84, 0.44, 1), opacity 0.8s cubic-bezier(0.165, 0.84, 0.44, 1);
    transition: transform 0.8s cubic-bezier(0.165, 0.84, 0.44, 1), opacity 0.8s cubic-bezier(0.165, 0.84, 0.44, 1), -webkit-transform 0.8s cubic-bezier(0.165, 0.84, 0.44, 1);
  }

  .Contact.is-visible .Contact-body {
    -webkit-transition-delay: 0.1s;
    transition-delay: 0.1s;
  }


  .dg ul{list-style:none;margin:0;padding:0;width:100%;clear:both}.dg.ac{position:fixed;top:0;left:0;right:0;height:0;z-index:0}.dg:not(.ac) .main{overflow:hidden}.dg.main{-webkit-transition:opacity .1s linear;-o-transition:opacity .1s linear;-moz-transition:opacity .1s linear;transition:opacity .1s linear}.dg.main.taller-than-window{overflow-y:auto}.dg.main.taller-than-window .close-button{opacity:1;margin-top:-1px;border-top:1px solid #2c2c2c}.dg.main ul.closed .close-button{opacity:1 !important}.dg.main:hover .close-button,.dg.main .close-button.drag{opacity:1}.dg.main .close-button{-webkit-transition:opacity .1s linear;-o-transition:opacity .1s linear;-moz-transition:opacity .1s linear;transition:opacity .1s linear;border:0;line-height:19px;height:20px;cursor:pointer;text-align:center;background-color:#000}.dg.main .close-button.close-top{position:relative}.dg.main .close-button.close-bottom{position:absolute}.dg.main .close-button:hover{background-color:#111}.dg.a{float:right;margin-right:15px;overflow-y:visible}.dg.a.has-save>ul.close-top{margin-top:0}.dg.a.has-save>ul.close-bottom{margin-top:27px}.dg.a.has-save>ul.closed{margin-top:0}.dg.a .save-row{top:0;z-index:1002}.dg.a .save-row.close-top{position:relative}.dg.a .save-row.close-bottom{position:fixed}.dg li{-webkit-transition:height .1s ease-out;-o-transition:height .1s ease-out;-moz-transition:height .1s ease-out;transition:height .1s ease-out;-webkit-transition:overflow .1s linear;-o-transition:overflow .1s linear;-moz-transition:overflow .1s linear;transition:overflow .1s linear}.dg li:not(.folder){cursor:auto;height:27px;line-height:27px;padding:0 4px 0 5px}.dg li.folder{padding:0;border-left:4px solid rgba(0,0,0,0)}.dg li.title{cursor:pointer;margin-left:-4px}.dg .closed li:not(.title),.dg .closed ul li,.dg .closed ul li>*{height:0;overflow:hidden;border:0}.dg .cr{clear:both;padding-left:3px;height:27px;overflow:hidden}.dg .property-name{cursor:default;float:left;clear:left;width:40%;overflow:hidden;text-overflow:ellipsis}.dg .c{float:left;width:60%;position:relative}.dg .c input[type=text]{border:0;margin-top:4px;padding:3px;width:100%;float:right}.dg .has-slider input[type=text]{width:30%;margin-left:0}.dg .slider{float:left;width:66%;margin-left:-5px;margin-right:0;height:19px;margin-top:4px}.dg .slider-fg{height:100%}.dg .c input[type=checkbox]{margin-top:7px}.dg .c select{margin-top:5px}.dg .cr.function,.dg .cr.function .property-name,.dg .cr.function *,.dg .cr.boolean,.dg .cr.boolean *{cursor:pointer}.dg .cr.color{overflow:visible}.dg .selector{display:none;position:absolute;margin-left:-9px;margin-top:23px;z-index:10}.dg .c:hover .selector,.dg .selector.drag{display:block}.dg li.save-row{padding:0}.dg li.save-row .button{display:inline-block;padding:0px 6px}.dg.dialogue{background-color:#222;width:460px;padding:15px;font-size:13px;line-height:15px}#dg-new-constructor{padding:10px;color:#222;font-family:Monaco, monospace;font-size:10px;border:0;resize:none;box-shadow:inset 1px 1px 1px #888;word-wrap:break-word;margin:12px 0;display:block;width:440px;overflow-y:scroll;height:100px;position:relative}#dg-local-explain{display:none;font-size:11px;line-height:17px;border-radius:3px;background-color:#333;padding:8px;margin-top:10px}#dg-local-explain code{font-size:10px}#dat-gui-save-locally{display:none}.dg{color:#eee;font:11px 'Lucida Grande', sans-serif;text-shadow:0 -1px 0 #111}.dg.main::-webkit-scrollbar{width:5px;background:#1a1a1a}.dg.main::-webkit-scrollbar-corner{height:0;display:none}.dg.main::-webkit-scrollbar-thumb{border-radius:5px;background:#676767}.dg li:not(.folder){background:#1a1a1a;border-bottom:1px solid #2c2c2c}.dg li.save-row{line-height:25px;background:#dad5cb;border:0}.dg li.save-row select{margin-left:5px;width:108px}.dg li.save-row .button{margin-left:5px;margin-top:1px;border-radius:2px;font-size:9px;line-height:7px;padding:4px 4px 5px 4px;background:#c5bdad;color:#fff;text-shadow:0 1px 0 #b0a58f;box-shadow:0 -1px 0 #b0a58f;cursor:pointer}.dg li.save-row .button.gears{background:#c5bdad url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAsAAAANCAYAAAB/9ZQ7AAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAQJJREFUeNpiYKAU/P//PwGIC/ApCABiBSAW+I8AClAcgKxQ4T9hoMAEUrxx2QSGN6+egDX+/vWT4e7N82AMYoPAx/evwWoYoSYbACX2s7KxCxzcsezDh3evFoDEBYTEEqycggWAzA9AuUSQQgeYPa9fPv6/YWm/Acx5IPb7ty/fw+QZblw67vDs8R0YHyQhgObx+yAJkBqmG5dPPDh1aPOGR/eugW0G4vlIoTIfyFcA+QekhhHJhPdQxbiAIguMBTQZrPD7108M6roWYDFQiIAAv6Aow/1bFwXgis+f2LUAynwoIaNcz8XNx3Dl7MEJUDGQpx9gtQ8YCueB+D26OECAAQDadt7e46D42QAAAABJRU5ErkJggg==) 2px 1px no-repeat;height:7px;width:8px}.dg li.save-row .button:hover{background-color:#bab19e;box-shadow:0 -1px 0 #b0a58f}.dg li.folder{border-bottom:0}.dg li.title{padding-left:16px;background:#000 url(data:image/gif;base64,R0lGODlhBQAFAJEAAP////Pz8////////yH5BAEAAAIALAAAAAAFAAUAAAIIlI+hKgFxoCgAOw==) 6px 10px no-repeat;cursor:pointer;border-bottom:1px solid rgba(255,255,255,0.2)}.dg .closed li.title{background-image:url(data:image/gif;base64,R0lGODlhBQAFAJEAAP////Pz8////////yH5BAEAAAIALAAAAAAFAAUAAAIIlGIWqMCbWAEAOw==)}.dg .cr.boolean{border-left:3px solid #806787}.dg .cr.color{border-left:3px solid}.dg .cr.function{border-left:3px solid #e61d5f}.dg .cr.number{border-left:3px solid #2FA1D6}.dg .cr.number input[type=text]{color:#2FA1D6}.dg .cr.string{border-left:3px solid #1ed36f}.dg .cr.string input[type=text]{color:#1ed36f}.dg .cr.function:hover,.dg .cr.boolean:hover{background:#111}.dg .c input[type=text]{background:#303030;outline:none}.dg .c input[type=text]:hover{background:#3c3c3c}.dg .c input[type=text]:focus{background:#494949;color:#fff}.dg .c .slider{background:#303030;cursor:ew-resize}.dg .c .slider-fg{background:#2FA1D6;max-width:100%}.dg .c .slider:hover{background:#3c3c3c}.dg .c .slider:hover .slider-fg{background:#44abda}
  /*# sourceMappingURL=app.2277fefc.css.map*/