/* cursor 1 */
.cursor1 {
  z-index                            : 99999;
  display                            : none;
  position                           : fixed;
  top                                : 0;
  left                               : 0;
  width                              : var(--width);
  height                             : var(--height);
  -webkit-transform                  : translate(calc(var(--x) - var(--width) / 2), calc(var(--y) - var(--height) / 2));
  transform                          : translate(calc(var(--x) - var(--width) / 2), calc(var(--y) - var(--height) / 2));
  -webkit-transition-property        : width,
                                       height,
                                       -webkit-transform;
  transition-property                : width,
                                       height,
                                       -webkit-transform;
  transition-property                : width,
                                       height,
                                       transform;
  transition-property                : width,
                                       height,
                                       transform,
                                       -webkit-transform;
  -webkit-transition-duration        : .1s;
  transition-duration                : .1s;
  -webkit-transition-timing-function : cubic-bezier(0.25, 0.25, 0.42, 1);
  transition-timing-function         : cubic-bezier(0.25, 0.25, 0.42, 1);
  pointer-events                     : none;
  border-radius                      : 100px;
}

@media
  (pointer : fine) {
  .cursor1 {
    display : block;
  }
}

.cursor1::after {
  content            : '';
  position           : absolute;
  top                : 0;
  right              : 0;
  bottom             : 0;
  left               : 0;
  opacity            : var(--scale);
  background-color   : rgba(255,255,255,.5);
  border-radius      : var(--radius);
  -webkit-transform  : scale(var(--scale));
  transform          : scale(var(--scale));
  -webkit-transition : 0.3s cubic-bezier(0.25, 0.25, 0.42, 1) opacity,
                       0.1s cubic-bezier(0.25, 0.25, 0.42, 1) border-radius,
                       0.3s cubic-bezier(0.25, 0.25, 0.42, 1) -webkit-transform;
  transition         : 0.3s cubic-bezier(0.25, 0.25, 0.42, 1) opacity,
                       0.1s cubic-bezier(0.25, 0.25, 0.42, 1) border-radius,
                       0.3s cubic-bezier(0.25, 0.25, 0.42, 1) -webkit-transform;
  transition         : 0.3s cubic-bezier(0.25, 0.25, 0.42, 1) opacity,
                       0.3s cubic-bezier(0.25, 0.25, 0.42, 1) transform,
                       0.1s cubic-bezier(0.25, 0.25, 0.42, 1) border-radius;
  transition         : 0.3s cubic-bezier(0.25, 0.25, 0.42, 1) opacity,
                       0.3s cubic-bezier(0.25, 0.25, 0.42, 1) transform,
                       0.1s cubic-bezier(0.25, 0.25, 0.42, 1) border-radius,
                       0.3s cubic-bezier(0.25, 0.25, 0.42, 1) -webkit-transform;
}


/* cursor 3 */

.cursor2 {
  z-index                            : 9999;
  display                            : none;
  position                           : fixed;
  top                                : 0;
  left                               : 0;
  width                              : var(--width);
  height                             : var(--height);
  -webkit-transform                  : translate(calc(var(--x) - var(--width) / 2), calc(var(--y) - var(--height) / 2));
  transform                          : translate(calc(var(--x) - var(--width) / 2), calc(var(--y) - var(--height) / 2));
  -webkit-transition-property        : width,
                                       height,
                                       -webkit-transform;
  transition-property                : width,
                                       height,
                                       -webkit-transform;
  transition-property                : width,
                                       height,
                                       transform;
  transition-property                : width,
                                       height,
                                       transform,
                                       -webkit-transform;
  -webkit-transition-duration        : .1s;
  transition-duration                : .1s;
  -webkit-transition-timing-function : cubic-bezier(0.25, 0.25, 0.42, 1);
  transition-timing-function         : cubic-bezier(0.25, 0.25, 0.42, 1);
  pointer-events                     : none;
}

@media
  (pointer : fine) {
  .cursor2 {
    display : block;
  }
}

.cursor2::after {
  content            : '';
  position           : absolute;
  top                : 0;
  right              : 0;
  bottom             : 0;
  left               : 0;
  opacity            : var(--scale);
  border             : 2px solid #34b288;
  border-radius      : var(--radius);
  -webkit-transform  : scale(var(--scale));
  transform          : scale(var(--scale));
  -webkit-transition : 0.3s cubic-bezier(0.25, 0.25, 0.42, 1) opacity,
                       0.1s cubic-bezier(0.25, 0.25, 0.42, 1) border-radius,
                       0.3s cubic-bezier(0.25, 0.25, 0.42, 1) -webkit-transform;
  transition         : 0.3s cubic-bezier(0.25, 0.25, 0.42, 1) opacity,
                       0.1s cubic-bezier(0.25, 0.25, 0.42, 1) border-radius,
                       0.3s cubic-bezier(0.25, 0.25, 0.42, 1) -webkit-transform;
  transition         : 0.3s cubic-bezier(0.25, 0.25, 0.42, 1) opacity,
                       0.3s cubic-bezier(0.25, 0.25, 0.42, 1) transform,
                       0.1s cubic-bezier(0.25, 0.25, 0.42, 1) border-radius;
  transition         : 0.3s cubic-bezier(0.25, 0.25, 0.42, 1) opacity,
                       0.3s cubic-bezier(0.25, 0.25, 0.42, 1) transform,
                       0.1s cubic-bezier(0.25, 0.25, 0.42, 1) border-radius,
                       0.3s cubic-bezier(0.25, 0.25, 0.42, 1) -webkit-transform;
}



body.has-cursor-type-3 {
  cursor : none;
}

.mouse-cursor {
  visibility        : hidden;
  position          : fixed;
  top               : 0;
  left              : 0;
  border-radius     : 50%;
  -webkit-transform : translateZ(0);
  transform         : translateZ(0);
  pointer-events    : none;
}

.cursor-inner {
  z-index            : 10000001;
  width              : 6px;
  height             : 6px;
  margin-top         : 2px;
  margin-left        : 2px;
  background-color   : #b19777;
  -o-transition      : width .3s ease-in-out,
                       height .3s ease-in-out,
                       margin .3s ease-in-out,
                       opacity .3s ease-in-out;
  -webkit-transition : width .3s ease-in-out,
                       height .3s ease-in-out,
                       margin .3s ease-in-out,
                       opacity .3s ease-in-out;
  transition         : width .3s ease-in-out,
                       height .3s ease-in-out,
                       margin .3s ease-in-out,
                       opacity .3s ease-in-out;
}

.cursor-inner.cursor-hover {
  width            : 80px;
  height           : 80px;
  margin-top       : -40px;
  margin-left      : -40px;
  opacity          : .3;
  background-color : #b19777;
}

.cursor-outer {
  z-index            : 10000000;
  -webkit-box-sizing : border-box;
  box-sizing         : border-box;
  width              : 40px;
  height             : 40px;
  margin-top         : -15px;
  margin-left        : -15px;
  opacity            : .5;
  border             : 1px solid #b19777;
  -o-transition      : all .08s ease-out;
  -webkit-transition : all .08s ease-out;
  transition         : all .08s ease-out;
}

.cursor-outer.cursor-hover {
  opacity : 0;
}