.layer-drawer.layui-layer {
    border-radius: 0 !important;
    overflow: auto;
  }
  
  .layer-drawer.layui-layer.position-absolute {
    position: absolute !important;
  }
  
  .layer-drawer-anim,
  .layer-drawer-anim.layui-anim {
    -webkit-animation-duration: .3s;
    animation-duration: .3s;
    -webkit-animation-timing-function: cubic-bezier(0.7, 0.3, 0.1, 1);
    animation-timing-function: cubic-bezier(0.7, 0.3, 0.1, 1);
  }
  
  /* right to left */
  @keyframes layer-rl {
    from {
      -webkit-transform: translate3d(100%, 0, 0);
      -ms-transform: translate3d(100%, 0, 0);
      transform: translate3d(100%, 0, 0);
      opacity: 1;
  
    }
  
    to {
      -webkit-transform: translate3d(0, 0, 0);
      -ms-transform: translate3d(0, 0, 0);
      transform: translate3d(0, 0, 0);
      opacity: 1;
    }
  }
  
  @-webkit-keyframes layer-rl {
    from {
      -webkit-transform: translate3d(100%, 0, 0);
      -ms-transform: translate3d(100%, 0, 0);
      transform: translate3d(100%, 0, 0);
      opacity: 1;
  
    }
  
    to {
      -webkit-transform: translate3d(0, 0, 0);
      -ms-transform: translate3d(0, 0, 0);
      transform: translate3d(0, 0, 0);
      opacity: 1;
    }
  }
  
  .layer-anim-rl {
    -webkit-animation-name: layer-rl;
    animation-name: layer-rl;
  }
  
  /* right to left close */
  @keyframes layer-rl-close {
    from {
      -webkit-transform: translate3d(0, 0, 0);
      -ms-transform: translate3d(0, 0, 0);
      transform: translate3d(0, 0, 0);
    }
  
    to {
      -webkit-transform: translate3d(100%, 0, 0);
      -ms-transform: translate3d(100%, 0, 0);
      transform: translate3d(100%, 0, 0);
    }
  }
  
  @-webkit-keyframes layer-rl-close {
    from {
      -webkit-transform: translate3d(0, 0, 0);
      -ms-transform: translate3d(0, 0, 0);
      transform: translate3d(0, 0, 0);
  
    }
  
    to {
      -webkit-transform: translate3d(100%, 0, 0);
      -ms-transform: translate3d(100%, 0, 0);
      transform: translate3d(100%, 0, 0);
    }
  }
  
  .layer-anim-rl-close,
  .layer-anim-rl.layer-anim-close {
    -webkit-animation-name: layer-rl-close;
    animation-name: layer-rl-close;
  }
  
  /* left to right */
  @-webkit-keyframes layer-lr {
    from {
      -webkit-transform: translate3d(0, 0, 0);
      -ms-transform: translate3d(0, 0, 0);
      transform: translate3d(0, 0, 0);
      opacity: 1
    }
  
    to {
      -webkit-transform: translate3d(-100%, 0, 0);
      -ms-transform: translate3d(-100%, 0, 0);
      transform: translate3d(-100%, 0, 0);
      opacity: 1
    }
  }
  
  @keyframes layer-lr {
    from {
      -webkit-transform: translate3d(-100%, 0, 0);
      -ms-transform: translate3d(-100%, 0, 0);
      transform: translate3d(-100%, 0, 0);
      opacity: 1
    }
  
    to {
      -webkit-transform: translate3d(0, 0, 0);
      -ms-transform: translate3d(0, 0, 0);
      transform: translate3d(0, 0, 0);
      opacity: 1
    }
  }
  
  .layer-anim-lr {
    -webkit-animation-name: layer-lr;
    animation-name: layer-lr
  }
  
  /* left to right close */
  @-webkit-keyframes layer-lr-close {
    from {
      -webkit-transform: translate3d(0, 0, 0);
      -ms-transform: translate3d(0, 0, 0);
      transform: translate3d(0, 0, 0);
    }
  
    to {
      -webkit-transform: translate3d(-100%, 0, 0);
      -ms-transform: translate3d(-100%, 0, 0);
      transform: translate3d(-100%, 0, 0);
    }
  }
  
  @keyframes layer-lr-close {
    from {
      -webkit-transform: translate3d(0, 0, 0);
      -ms-transform: translate3d(0, 0, 0);
      transform: translate3d(0, 0, 0);
    }
  
    to {
      -webkit-transform: translate3d(-100%, 0, 0);
      -ms-transform: translate3d(-100%, 0, 0);
      transform: translate3d(-100%, 0, 0);
    }
  }
  
  .layer-anim-lr-close,
  .layer-anim-lr.layer-anim-close {
    -webkit-animation-name: layer-lr-close;
    animation-name: layer-lr-close
  }
  
  /* top to bottom */
  @-webkit-keyframes layer-tb {
    from {
      -webkit-transform: translate3d(0, -100%, 0);
      -ms-transform: translate3d(0, -100%, 0);
      transform: translate3d(0, -100%, 0);
      opacity: 1;
      animation-timing-function: cubic-bezier(0.7, 0.3, 0.1, 1);
    }
  
    to {
      -webkit-transform: translate3d(0, 0, 0);
      -ms-transform: translate3d(0, 0, 0);
      transform: translate3d(0, 0, 0);
      opacity: 1;
      animation-timing-function: cubic-bezier(0.7, 0.3, 0.1, 1);
    }
  }
  
  @keyframes layer-tb {
    from {
      -webkit-transform: translate3d(0, -100%, 0);
      -ms-transform: translate3d(0, -100%, 0);
      transform: translate3d(0, -100%, 0);
      opacity: 1;
      animation-timing-function: cubic-bezier(0.7, 0.3, 0.1, 1);
    }
  
    to {
      -webkit-transform: translate3d(0, 0, 0);
      -ms-transform: translate3d(0, 0, 0);
      transform: translate3d(0, 0, 0);
      opacity: 1;
      animation-timing-function: cubic-bezier(0.7, 0.3, 0.1, 1);
    }
  }
  
  .layer-anim-tb {
    -webkit-animation-name: layer-tb;
    animation-name: layer-tb
  }
  
  /* top to bottom close */
  @-webkit-keyframes layer-tb-close {
    from {
      -webkit-transform: translate3d(0, 0, 0);
      -ms-transform: translate3d(0, 0, 0);
      transform: translate3d(0, 0, 0);
    }
  
    to {
      -webkit-transform: translate3d(0, -100%, 0);
      -ms-transform: translate3d(0, -100%, 0);
      transform: translate3d(0, -100%, 0);
    }
  }
  
  @keyframes layer-tb-close {
    from {
      -webkit-transform: translate3d(0, 0, 0);
      -ms-transform: translate3d(0, 0, 0);
      transform: translate3d(0, 0, 0);
    }
  
    to {
      -webkit-transform: translate3d(0, -100%, 0);
      -ms-transform: translate3d(0, -100%, 0);
      transform: translate3d(0, -100%, 0);
    }
  }
  
  .layer-anim-tb-close,
  .layer-anim-tb.layer-anim-close {
    -webkit-animation-name: layer-tb-close;
    animation-name: layer-tb-close
  }
  
  /* bottom to top */
  @-webkit-keyframes layer-bt {
    from {
      -webkit-transform: translate3d(0, 100%, 0);
      -ms-transform: translate3d(0, 100%, 0);
      transform: translate3d(0, 100%, 0);
      opacity: 1
    }
  
    to {
      -webkit-transform: translate3d(0, 0, 0);
      -ms-transform: translate3d(0, 0, 0);
      transform: translate3d(0, 0, 0);
      opacity: 1
    }
  }
  
  @keyframes layer-bt {
    from {
      -webkit-transform: translate3d(0, 100%, 0);
      -ms-transform: translate3d(0, 100%, 0);
      transform: translate3d(0, 100%, 0);
      opacity: 1
    }
  
    to {
      -webkit-transform: translate3d(0, 0, 0);
      -ms-transform: translate3d(0, 0, 0);
      transform: translate3d(0, 0, 0);
      opacity: 1
    }
  }
  
  .layer-anim-bt {
    -webkit-animation-name: layer-bt;
    animation-name: layer-bt
  }
  
  /* bottom to top close */
  @-webkit-keyframes layer-bt-close {
    from {
      -webkit-transform: translate3d(0, 0, 0);
      -ms-transform: translate3d(0, 0, 0);
      transform: translate3d(0, 0, 0);
    }
  
    to {
      -webkit-transform: translate3d(0, 100%, 0);
      -ms-transform: translate3d(0, 100%, 0);
      transform: translate3d(0, 100%, 0);
    }
  }
  
  @keyframes layer-bt-close {
    from {
      -webkit-transform: translate3d(0, 0, 0);
      -ms-transform: translate3d(0, 0, 0);
      transform: translate3d(0, 0, 0);
  
    }
  
    to {
      -webkit-transform: translate3d(0, 100%, 0);
      -ms-transform: translate3d(0, 100%, 0);
      transform: translate3d(0, 100%, 0);
  
    }
  }
  
  .layer-anim-bt-close,
  .layer-anim-bt.layer-anim-close {
    -webkit-animation-name: layer-bt-close;
    animation-name: layer-bt-close
  }