@charset "UTF-8";

* {
    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
}

.formie {
    background-color: var(--theme-dashboard-back-panel);
}

.darkformie {
    background-color: var(--theme-bg-medium);
}

.greymie {
    background-color: #EEEEE6;
}

.tippy {
    background-color: var(--theme-grey);
    color: var(--theme-black) !important;
}

.whitippy {
    background-color: var(--theme-white);
    color: var(--theme-grey);
}

.grn {
    background-color: var(--theme-color);
    color: var(--theme-white);
}

.jaspborder {
    background-color: var(--theme-white);
    color: var(--theme-color);
    border: 1px solid var(--theme-color);
}

    .jaspborder:hover {
        background-color: var(--theme-color);
        color: var(--theme-white);
    }

.linksi {
    color: var(--theme-color);
}

.compname {
    color: var(--theme-color);
    text-transform: uppercase;
}

.tabby {
    color: var(--theme-grey);
    border-top: solid 0px var(--theme-grey) !important;
    border-left: solid 0px var(--theme-grey) !important;
    border-right: solid 0px var(--theme-grey) !important;
    border-radius: 0px 0px 0px 0px;
    transition: transform 0.5s;
}

    .tabby:hover {
        background-color: var(--theme-white);
        color: var(--theme-color) !important;
        transform: translate(0px, -5px);
        border: solid 0px var(--theme-color) !important;
        border-radius: 8px;
    }

.greysis {
    color: var(--theme-grey);
}

.whitsis {
    color: var(--theme-black);
}

.blksis {
    color: var(--theme-white);
}

.uppitigrn {
    background-color: var(--theme-color);
    color: var(--theme-white);
    transition: transform 0.5s;
}

    .uppitigrn:hover {
        background-color: var(--theme-accent);
        color: var(--theme-white);
        transform: translate(0px, -5px);
    }

.uppitiwhi {
    background-color: var(--theme-accent);
    color: var(--theme-white);
    transition: transform 0.5s;
}

    .uppitiwhi:hover {
        background-color: var(--theme-color);
        color: var(--theme-white);
        transform: translate(0px, -5px);
    }

.hintitle {
    background-color: var(--theme-bg-light);
    color: var(--theme-black);
    padding: 5px 10px;
    border-radius: 5px;
}

.greytitle {
    background-color: var(--theme-bg-accent);
    color: var(--theme-black);
    padding: 5px 10px;
    border-radius: 5px;
}

.jaspgrad {
    background-image: linear-gradient(165deg, var(--grad-1), var(--theme-bg-medium), var(--theme-bg-medium) 50%, var(--grad-3), var(--theme-accent));
}

.jaspshadow {
    box-shadow: 0 1px 1px rgba(0,0,0,0.12), 0 2px 2px rgba(0,0,0,0.12), 0 4px 4px rgba(0,0,0,0.12), 0 8px 8px rgba(0,0,0,0.12), 0 16px 16px rgba(0,0,0,0.12);
}

.jaspshadow-container {
    border-radius: 15px;
}

.gradtippy {
    background-image: linear-gradient(180deg, var(--grad-1), var(--theme-accent));
    color: var(--theme-white) !important;
}

.prettycorners {
    border-radius: 8px;
}

.igrad {
    background: -webkit-linear-gradient(var(--grad-1), var(--theme-accent));
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}

.jaspit {
    font-size: 18px;
    font-weight: bold;
}

.oomf {
    text-shadow: 2px 2px var(--theme-color);
}