.grey { color: #2c3437; }
.grey-tint-80 { color: #414b4d; }
.grey-tint-60 { color: #676d6f; }
.grey-tint-40 { color: #5b6667; }
.grey-tint-20 { color: #8c9498; }

.green { color: #46722b; }
.green-tint-80 { color: #588c38; }
.green-tint-60 { color: #83c05e; }
.green-tint-40 { color: #6ba845; }
.green-tint-20 { color: #99db70; }

.pink-tint-80 { color: #c0415b; }
.pink-tint-60 { color: #e25f7d; }
.pink-tint-40 { color: #cd4e6a; }
.pink-tint-20 { color: #e7879d; }

/* Pink base  */
.pink { color: #ae3951; }
.bg-pink { background-color: #ae3951; }
.b--pink { border-color: #ae3951; }
.hover-pink:hover, .hover-pink:focus { color: #ae3951; }
.hover-bg-pink:hover, .hover-bg-pink:focus { background-color: #ae3951; }

/* Pink tint 60 */
.pink-t60 { color: #e25f7d; }
.bg-pink-t60 { background-color: #e25f7d; }
.b--pink-t60 { border-color: #e25f7d; }
.hover-pink-t60:hover, .hover-pink-t60:focus { color: #e25f7d; }
.hover-bg-pink-t60:hover, .hover-bg-pink-t60:focus { background-color: #e25f7d; }

.hoc-black { color: #2c3437; }
.bg-hoc-black { background-color: #2c3437; }
.b--hoc-black { border-color: #2c3437; }
.hover-hoc-black:hover, .hover-hoc-black:focus { color: #2c3437; }
.hover-bg-hoc-black:hover, .hover-bg-hoc-black:focus { background-color: #2c3437; }

.bg-translucent-pink {
  background-color: rgba(226, 96, 126, 0.05)
}

.bg-translucent-pink-05 {
    background-color: rgba(226, 96, 126, 0.5)
}
