@keyframes color-transition-63b732dd {
    0% {
        color: var(--c-light-light-gray)
    }

    30% {
        color: var(--c-lime)
    }

    to {
        color: var(--c-dark-green)
    }
}

.border__wrapper[data-v-63b732dd] {
    height: 100%;
    position: relative;
    width: 100%
}

.border__wrapper .overflow__wrapper[data-v-63b732dd] {
    height: calc(100% + 1px);
    overflow: hidden;
    overflow: clip;
    position: relative;
    width: calc(100% + 1px)
}

.border-holder[data-v-63b732dd] {
    height: 30rem;
    left: 0;
    pointer-events: none;
    position: absolute;
    top: 0;
    width: 30rem
}

.background-holder[data-v-63b732dd] {
    background-color: #fff;
    display: block;
    height: calc(100% - 4px);
    left: 2px;
    position: absolute;
    top: 2px;
    width: calc(100% - 4px)
}

.slot__wrapper[data-v-63b732dd] {
    height: 100%;
    position: relative;
    width: 100%;
    z-index: 2
}

.background-gradient[data-v-63b732dd] {
    background-repeat: no-repeat;
    height: 30rem;
    left: 0;
    opacity: 0;
    position: absolute;
    top: 0;
    transition: opacity .5s;
    width: 30rem;
    z-index: 1
}

.border-bg-h[data-v-63b732dd],.border-bg-v[data-v-63b732dd] {
    height: 100%;
    position: absolute;
    width: 100%
}

.border-bg-h[data-v-63b732dd]:after,.border-bg-h[data-v-63b732dd]:before,.border-bg-v[data-v-63b732dd]:after,.border-bg-v[data-v-63b732dd]:before {
    background: #e5e5e5;
    content: "";
    position: absolute
}

.border-bg-h[data-v-63b732dd]:after,.border-bg-h[data-v-63b732dd]:before {
    height: 1px;
    width: 100%
}

.border-bg-h[data-v-63b732dd]:after {
    top: 0
}

.border-bg-h[data-v-63b732dd]:before {
    bottom: 0
}

.border-bg-v[data-v-63b732dd]:after,.border-bg-v[data-v-63b732dd]:before {
    height: 100%;
    width: 1px
}

.border-bg-v[data-v-63b732dd]:after {
    right: 0
}

.border-bg-v[data-v-63b732dd]:before {
    left: 0
}

@media (hover: hover) and (pointer:fine) {
    .border-holder[data-v-63b732dd] {
        background:radial-gradient(circle at 50% 50%,var(--c-lime),transparent 15rem)
    }

    .slot__wrapper:hover+.background-gradient[data-v-63b732dd] {
        opacity: .2
    }

    .background-gradient[data-v-63b732dd] {
        background: radial-gradient(circle at 50% 50%,rgba(171,255,2,.8),transparent 15rem) no-repeat
    }
}