.slidepanel {
  height: 100vh;
  top: 0;
  -webkit-transition: -webkit-transform 800ms cubic-bezier(0.19, 1, 0.22, 1);
  -moz-transition: -moz-transform 800ms cubic-bezier(0.19, 1, 0.22, 1);
  transition: transform 800ms cubic-bezier(0.19, 1, 0.22, 1); }
  .slidepanel.active {
    -webkit-transition: -webkit-transform 700ms cubic-bezier(0.19, 1, 0.22, 1);
    -moz-transition: -moz-transform 700ms cubic-bezier(0.19, 1, 0.22, 1);
    transition: transform 700ms cubic-bezier(0.19, 1, 0.22, 1); }
  .slidepanel .site-navigation > .label,
  .slidepanel .inner-wrapper > .label {
    line-height: normal;
    -webkit-font-smoothing: antialiased;
    -webkit-backface-visibility: hidden;
    font-family: "EuclidFlex-Light", sans-serif;
    font-weight: 400;
    text-decoration: none;
    font-size: 24px;
    line-height: 29px;
    color: #919396;
    margin-bottom: 35px; }
  .toolbar .slidepanel .site-navigation > .label {
    margin-top: 65px; }
  .slidepanel .slidepanel-label-text {
    -webkit-transition: opacity 200ms cubic-bezier(0.165, 0.84, 0.44, 1);
    -moz-transition: opacity 200ms cubic-bezier(0.165, 0.84, 0.44, 1);
    transition: opacity 200ms cubic-bezier(0.165, 0.84, 0.44, 1);
    line-height: normal;
    -webkit-font-smoothing: antialiased;
    -webkit-backface-visibility: hidden;
    font-family: "EuclidFlex-Light", sans-serif;
    font-weight: 400;
    text-decoration: none;
    font-size: 24px;
    line-height: 29px;
    position: absolute;
    z-index: 10;
    top: 50%; }
  .slidepanel.left {
    position: fixed;
    width: 60%;
    background-color: #231f20;
    z-index: 3;
    left: -60%;
    -webkit-transform: translateX(0);
    -moz-transform: translateX(0);
    -ms-transform: translateX(0);
    -o-transform: translateX(0);
    transform: translateX(0); }
    .images-loaded .slidepanel.left {
      -webkit-transform: translateX(80px);
      -moz-transform: translateX(80px);
      -ms-transform: translateX(80px);
      -o-transform: translateX(80px);
      transform: translateX(80px); }
      .images-loaded .slidepanel.left:hover:not(.active) {
        -webkit-transform: translateX(120px);
        -moz-transform: translateX(120px);
        -ms-transform: translateX(120px);
        -o-transform: translateX(120px);
        transform: translateX(120px); }
        .images-loaded .slidepanel.left:hover:not(.active) .background .layer {
          -webkit-transition-delay: 0s !important;
          -moz-transition-delay: 0s !important;
          transition-delay: 0s !important;
          opacity: 1 !important; }
    [data-active-panel='right'] .slidepanel.left {
      -webkit-transform: translateX(0);
      -moz-transform: translateX(0);
      -ms-transform: translateX(0);
      -o-transform: translateX(0);
      transform: translateX(0); }
    .slidepanel.left .background {
      bottom: 0;
      left: 0; }
    .slidepanel.left.active {
      -webkit-transform: translateX(100%);
      -moz-transform: translateX(100%);
      -ms-transform: translateX(100%);
      -o-transform: translateX(100%);
      transform: translateX(100%); }
      .slidepanel.left.active .background .layer {
        opacity: 1 !important; }
    .slidepanel.left .label {
      text-align: right;
      color: #919396;
      opacity: 0;
      margin-bottom: 0;
      -webkit-transition: opacity 500ms cubic-bezier(0.165, 0.84, 0.44, 1);
      -moz-transition: opacity 500ms cubic-bezier(0.165, 0.84, 0.44, 1);
      transition: opacity 500ms cubic-bezier(0.165, 0.84, 0.44, 1); }
      [data-active-panel='left'] .slidepanel.left .label {
        -webkit-transition: opacity 200ms cubic-bezier(0.165, 0.84, 0.44, 1) 300ms;
        -moz-transition: opacity 200ms cubic-bezier(0.165, 0.84, 0.44, 1) 300ms;
        transition: opacity 200ms cubic-bezier(0.165, 0.84, 0.44, 1) 300ms; }
    .slidepanel.left .slidepanel-label-text {
      -webkit-transform: rotate(-90deg);
      -moz-transform: rotate(-90deg);
      -ms-transform: rotate(-90deg);
      -o-transform: rotate(-90deg);
      transform: rotate(-90deg);
      right: 10px;
      color: #ffffff; }
      [data-active-panel='left'] .slidepanel.left .slidepanel-label-text {
        opacity: 0; }
    .slidepanel.left .slidepanel-content > .content {
      padding: 20px;
      padding-right: 40px; }
      @media (max-width: 550px) {
        .slidepanel.left .slidepanel-content > .content {
          padding-right: 20px; } }
      .slidepanel.left .slidepanel-content > .content .site-navigation {
        z-index: 2;
        position: relative; }
    @media (max-width: 900px) {
      .slidepanel.left {
        top: 0;
        left: 0;
        width: 100%;
        z-index: 1; }
        .images-loaded .slidepanel.left {
          -webkit-transform: translateX(0);
          -moz-transform: translateX(0);
          -ms-transform: translateX(0);
          -o-transform: translateX(0);
          transform: translateX(0); }
        .slidepanel.left.active {
          -webkit-transform: translateX(0);
          -moz-transform: translateX(0);
          -ms-transform: translateX(0);
          -o-transform: translateX(0);
          transform: translateX(0); }
        [data-active-panel='all'] .slidepanel.left {
          -webkit-transform: translateX(0);
          -moz-transform: translateX(0);
          -ms-transform: translateX(0);
          -o-transform: translateX(0);
          transform: translateX(0); } }
  .slidepanel.middle {
    position: fixed;
    z-index: 1;
    background-color: #ffffff;
    width: 100%;
    left: 0;
    opacity: 0;
    padding: 0 80px;
    box-sizing: border-box; }
    [data-active-panel='left'] .slidepanel.middle {
      -webkit-transform: translateX(10%);
      -moz-transform: translateX(10%);
      -ms-transform: translateX(10%);
      -o-transform: translateX(10%);
      transform: translateX(10%); }
    [data-active-panel='right'] .slidepanel.middle {
      -webkit-transform: translateX(-10%);
      -moz-transform: translateX(-10%);
      -ms-transform: translateX(-10%);
      -o-transform: translateX(-10%);
      transform: translateX(-10%); }
    .slidepanel.middle > .wrapper {
      position: relative;
      z-index: 2;
      pointer-events: none; }
      .search-open .slidepanel.middle > .wrapper {
        pointer-events: auto; }
    .slidepanel.middle .background {
      top: 0;
      left: 80px; }
      .slidepanel.middle .background svg * {
        fill: #f3f3f3; }
    .slidepanel.middle .slidepanel-content {
      opacity: 0.2; }
      .search-open .slidepanel.middle .slidepanel-content {
        opacity: 0.1 !important; }
      .slidepanel.middle .slidepanel-content > .content {
        background-color: #ffffff;
        width: calc(100% - 160px);
        left: 80px;
        padding: 20px 0 0;
        z-index: 1;
        box-sizing: border-box; }
        @media (max-width: 900px) {
          .slidepanel.middle .slidepanel-content > .content {
            width: 100%;
            left: 0; } }
      .toolbar .slidepanel.middle .slidepanel-content {
        height: calc(100vh - 130px);
        top: 130px; }
    @media (max-width: 900px) {
      .slidepanel.middle {
        top: 0;
        left: 0;
        width: 100%;
        padding: 0;
        -webkit-transform: translateX(100%) !important;
        -moz-transform: translateX(100%) !important;
        -ms-transform: translateX(100%) !important;
        -o-transform: translateX(100%) !important;
        transform: translateX(100%) !important; }
        .slidepanel.middle.active {
          -webkit-transform: translateX(0) !important;
          -moz-transform: translateX(0) !important;
          -ms-transform: translateX(0) !important;
          -o-transform: translateX(0) !important;
          transform: translateX(0) !important; }
        [data-active-panel='all'] .slidepanel.middle {
          -webkit-transform: translateX(33%) !important;
          -moz-transform: translateX(33%) !important;
          -ms-transform: translateX(33%) !important;
          -o-transform: translateX(33%) !important;
          transform: translateX(33%) !important; } }
  .slidepanel.right {
    position: fixed;
    right: -80%;
    width: 80%;
    background-color: #EBEBEB;
    z-index: 2;
    -webkit-transform: translateX(0);
    -moz-transform: translateX(0);
    -ms-transform: translateX(0);
    -o-transform: translateX(0);
    transform: translateX(0);
    pointer-events: none; }
    .images-loaded .slidepanel.right {
      -webkit-transform: translateX(-80px);
      -moz-transform: translateX(-80px);
      -ms-transform: translateX(-80px);
      -o-transform: translateX(-80px);
      transform: translateX(-80px); }
      .images-loaded .slidepanel.right:hover:not(.active) {
        -webkit-transform: translateX(-120px);
        -moz-transform: translateX(-120px);
        -ms-transform: translateX(-120px);
        -o-transform: translateX(-120px);
        transform: translateX(-120px); }
        .images-loaded .slidepanel.right:hover:not(.active) .slidepanel-content {
          opacity: 0.1; }
          .images-loaded .slidepanel.right:hover:not(.active) .slidepanel-content > .content {
            z-index: 2; }
    [data-active-panel='left'] .slidepanel.right {
      -webkit-transform: translateX(0);
      -moz-transform: translateX(0);
      -ms-transform: translateX(0);
      -o-transform: translateX(0);
      transform: translateX(0); }
    .slidepanel.right .trigger {
      pointer-events: auto;
      left: 0; }
    .slidepanel.right .background {
      bottom: 0;
      right: 0; }
      .slidepanel.right .background svg * {
        fill: #dfe0e2; }
    .slidepanel.right.active {
      -webkit-transform: translateX(-100%);
      -moz-transform: translateX(-100%);
      -ms-transform: translateX(-100%);
      -o-transform: translateX(-100%);
      transform: translateX(-100%);
      pointer-events: auto; }
      .slidepanel.right.active .background .layer {
        opacity: 1 !important; }
    .slidepanel.right .slidepanel-label-text {
      -webkit-transform: rotate(90deg);
      -moz-transform: rotate(90deg);
      -ms-transform: rotate(90deg);
      -o-transform: rotate(90deg);
      transform: rotate(90deg);
      left: -3px; }
      [data-active-panel='right'] .slidepanel.right .slidepanel-label-text {
        opacity: 0; }
    .slidepanel.right .slidepanel-content {
      opacity: 0; }
      .slidepanel.right .slidepanel-content > .content {
        z-index: 2; }
        .slidepanel.right .slidepanel-content > .content > .inner-wrapper {
          padding: 20px;
          z-index: 2;
          position: relative; }
          .slidepanel.right .slidepanel-content > .content > .inner-wrapper > .label {
            color: #000000;
            opacity: 0;
            -webkit-transition: opacity 200ms cubic-bezier(0.165, 0.84, 0.44, 1);
            -moz-transition: opacity 200ms cubic-bezier(0.165, 0.84, 0.44, 1);
            transition: opacity 200ms cubic-bezier(0.165, 0.84, 0.44, 1); }
            [data-active-panel='right'] .slidepanel.right .slidepanel-content > .content > .inner-wrapper > .label {
              opacity: 1; }
      .toolbar .slidepanel.right .slidepanel-content {
        height: calc(100vh - 130px);
        top: 130px; }
    .slidepanel.right .wrapper {
      margin-left: 0; }
    @media (max-width: 900px) {
      .slidepanel.right {
        position: fixed;
        top: 0;
        right: 0;
        width: 100%;
        -webkit-transform: translateX(100%);
        -moz-transform: translateX(100%);
        -ms-transform: translateX(100%);
        -o-transform: translateX(100%);
        transform: translateX(100%); }
        .slidepanel.right.active {
          -webkit-transform: translateX(0);
          -moz-transform: translateX(0);
          -ms-transform: translateX(0);
          -o-transform: translateX(0);
          transform: translateX(0); }
        [data-active-panel='all'] .slidepanel.right {
          -webkit-transform: translateX(66%) !important;
          -moz-transform: translateX(66%) !important;
          -ms-transform: translateX(66%) !important;
          -o-transform: translateX(66%) !important;
          transform: translateX(66%) !important;
          z-index: 3; }
        [data-active-panel='left'] .slidepanel.right {
          -webkit-transform: translateX(100%) !important;
          -moz-transform: translateX(100%) !important;
          -ms-transform: translateX(100%) !important;
          -o-transform: translateX(100%) !important;
          transform: translateX(100%) !important; }
        [data-active-panel='middle'] .slidepanel.right {
          -webkit-transform: translateX(100%) !important;
          -moz-transform: translateX(100%) !important;
          -ms-transform: translateX(100%) !important;
          -o-transform: translateX(100%) !important;
          transform: translateX(100%) !important; } }
  .slidepanel .slidepanel-content {
    -webkit-transition: opacity 800ms;
    -moz-transition: opacity 800ms;
    transition: opacity 800ms;
    z-index: 1;
    position: relative;
    box-sizing: border-box;
    position: absolute;
    width: 100%;
    height: calc(100vh - 65px);
    overflow: hidden;
    top: 65px;
    left: 0;
    z-index: 1; }
    .slidepanel .slidepanel-content:after {
      content: "";
      display: table;
      clear: both; }
    .slidepanel .slidepanel-content > .content {
      position: absolute;
      width: 100%;
      height: 100%;
      overflow-x: hidden;
      overflow-y: hidden;
      -webkit-overflow-scrolling: touch;
      box-sizing: border-box; }
  .slidepanel.active .slidepanel-content {
    opacity: 1 !important; }
    .slidepanel.active .slidepanel-content > .content {
      overflow-y: auto; }
      .search-open .slidepanel.active .slidepanel-content > .content {
        overflow-y: hidden; }

.trigger {
  position: absolute;
  width: 100%;
  height: 100%;
  cursor: pointer;
  z-index: 11; }
  .active .trigger {
    z-index: 0;
    cursor: auto;
    pointer-events: none !important; }

/*# sourceMappingURL=slidepanel.css.map */
