.fs-xs {
    font-size: $font-size-xs;
}

.fs-sm {
    font-size: $font-size-sm;
}

.fs-base {
    font-size: $font-size-base;

}

.fs-md {
    font-size: $font-size-md;
}

.fs-lg {
    font-size: $font-size-lg;
}

.fs-xl {
    font-size: $font-size-xl;
}

.fs-xx {
    font-size: $font-size-xx;
}

.fw-medium {
    font-weight: 500;
}

.fw-semibold {
    font-weight: 600 !important;
}

.alert-success, .alert-warning {
    color: $icenight;
}

.text-decoration-underline-ice {
    border-bottom: 3px solid #8dc7e9!important;
    text-decoration: none!important;
}

.text-decoration-underline-ice:hover {
    border-bottom: 3px solid #000!important;
    text-decoration: none!important;
}

sup {
    top: -.8em;
}

sup, sub {
    font-size: .5em;
}

.cta-link {
    display: inline-block;
    text-transform: uppercase;
    font-weight: 700;
    position: relative;
    z-index: 1;

    &:after {
        content:'';
        position: absolute;
        background-image: url("data:image/svg+xml,%3Csvg width='8' height='16' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 256 512'%3E%3Cpath fill='%2371C5E8' d='M224.3 273l-136 136c-9.4 9.4-24.6 9.4-33.9 0l-22.6-22.6c-9.4-9.4-9.4-24.6 0-33.9l96.4-96.4-96.4-96.4c-9.4-9.4-9.4-24.6 0-33.9L54.3 103c9.4-9.4 24.6-9.4 33.9 0l136 136c9.5 9.4 9.5 24.6.1 34z'%3E%3C/path%3E%3C/svg%3E");
        width: 8px;
        height: 16px;
        bottom: 0;
        margin-bottom: 5px;
        margin-left: 6px;
    }

    &:hover {
        color: $iceblue!important;
        text-decoration: underline;
        text-decoration-thickness: 2px;
    }

    &.negative {
        color: #ffffff;
    }

    &.fs-xs {
        &:after {
            margin-bottom: 3px;
        }
    }

    &.fs-sm {
        &:after {
            margin-bottom: 4px;
        }
    }

    &.fs-md {
        &:after {
            margin-bottom: 7px;
        }
    }

    &.fs-lg {
        &:after {
            margin-bottom: 8px;
        }
    }

    &.fs-xl {
        &:after {
            margin-bottom: 10px;
        }
    }
}

.card {
    &:hover {
        .stretched-link {
            .cta-link {
                color: $iceblue!important;
                text-decoration: underline;
                text-decoration-thickness: 2px;
            }
        }
    }
}