ehmorris/keepsakes

%button {
  background: #fff;
  border: 0;
  box-sizing: border-box;
  color: #000;
  display: block;
  padding: 1rem;
  text-align: center;
  text-decoration: none;
}

%pseudo-incomplete-icon {
  &:before {
    background-size: .9rem;
    border: 2px solid #000;
    border-radius: 100%;
    box-sizing: border-box;
    content: '';
    display: block;
    height: 1.5rem;
    @include position(absolute, 0 0 0 1rem);
    text-align: center;
    width: 1.5rem;
  }
}

%pseudo-complete-check {
  &:before {
    background: url(check.svg) $positive-color center center no-repeat;
    background-size: .9rem;
    border: 2px solid $positive-color;
    border-radius: 100%;
    box-sizing: border-box;
    color: #fff;
    content: '';
    display: block;
    height: 1.5rem;
    @include position(absolute, 0 0 0 1rem);
    text-align: center;
    width: 1.5rem;
  }
}

@mixin content-box {
  color: #fff;
  list-style-type: none;
  margin: 0 auto;
  padding: 0;
  position: relative;
  top: 10vh;
  width: 375px;
  z-index: 2;
}

@mixin close-cursor {
  cursor: url('cursors_x.svg') 16 16, pointer;
}

@mixin right-cursor {
  cursor: url('cursors_right.svg') 8 16, pointer;
}

@mixin left-cursor {
  cursor: url('cursors_left.svg') 24 16, pointer;
}

@mixin up-cursor {
  cursor: url('cursors_up.svg') 16 8, pointer;
}

@mixin down-cursor {
  cursor: url('cursors_down.svg') 16 24, pointer;
}

@mixin o-cursor {
  cursor: url('cursors_o.svg') 16 24, pointer;
}