Skip to content
/* Custom Catch Colors */
.bg-catch-green {
    background-color: #06923e;
}

.bg-catch-dark-green {
    background-color: #05692e;
}

.hover-bg-catch-dark-green:focus,
.hover-bg-catch-dark-green:hover {
    background-color: #05692e;
}

.hover-bg-catch-green:focus,
.hover-bg-catch-green:hover {
    background-color: #06923e;
}

.bg-catch-dark {
    background-color: #1a1a1a;
}

.catch-green {
    color: #06923e;
}

.hover-catch-green:focus,
.hover-catch-green:hover {
    color: #06923e;
}

.hover-white:focus,
.hover-white:hover {
    color: #ffffff;
}

.b--catch-green {
    border-color: #06923e;
}

/* Custom Dark Orange & Pink Theme Colors */
.bg-dark-orange {
    background-color: #b45309;
}

.bg-deep-orange {
    background-color: #c45500;
}

.hover-bg-dark-orange:focus,
.hover-bg-dark-orange:hover {
    background-color: #b45309;
}

.hover-bg-deep-orange:focus,
.hover-bg-deep-orange:hover {
    background-color: #c45500;
}

.dark-orange {
    color: #b45309;
}

.deep-orange {
    color: #c45500;
}

.hover-dark-orange:focus,
.hover-dark-orange:hover {
    color: #b45309;
}

.b--dark-orange {
    border-color: #b45309;
}

.b--deep-orange {
    border-color: #c45500;
}

/* Pink action colors */
.bg-action-pink {
    background-color: #e91e8c;
}

.bg-deep-pink {
    background-color: #c91675;
}

.hover-bg-action-pink:focus,
.hover-bg-action-pink:hover {
    background-color: #e91e8c;
}

.hover-bg-deep-pink:focus,
.hover-bg-deep-pink:hover {
    background-color: #c91675;
}

.action-pink {
    color: #e91e8c;
}

.deep-pink {
    color: #c91675;
}

.hover-action-pink:focus,
.hover-action-pink:hover {
    color: #e91e8c;
}

.b--action-pink {
    border-color: #e91e8c;
}

.b--deep-pink {
    border-color: #c91675;
}

/* Orange-tinted backgrounds for panels */
.bg-orange-10 {
    background-color: rgba(180, 83, 9, 0.1);
}

.bg-orange-20 {
    background-color: rgba(180, 83, 9, 0.2);
}

.hover-bg-orange-10:focus,
.hover-bg-orange-10:hover {
    background-color: rgba(180, 83, 9, 0.1);
}

.hover-bg-orange-20:focus,
.hover-bg-orange-20:hover {
    background-color: rgba(180, 83, 9, 0.2);
}