:root {
    --maincolor: #0088ea;
    --maingradient: linear-gradient(37deg, #31cb4d 0%, #16cbad 70%);
    --background: #eee;
    --background2: #fff;
    --background3: #fafafa;
    --input-background: #fff;
    --input-shadow: inset 0px 0px 10px #f7f7f7, 0 0 5px #bbb;
    --input-shadow-focus: inset 0px 0px 10px #f7f7f7, 0 0 5px #529ff7;
    --shadow-color: #ddd;
    --title-color: #00c583;
    --subtitle-color: #666;
    --text-color: rgb(17 24 39 1);
    --text: 15px;
    --maintitle: 30px;
    --title: 24px;
    --subtitle: 18px;
    --label: 10px;
    --font: "Outfit", sans-serif;
    --tw-shadow:
        0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1);
    --shadow: 0 0 #0000, 0 0 #0000, 0 0 #0000, 0 0 #0000, var(--tw-shadow);
}

@media screen and (max-width: 1024px) {
    :root {
        --text: 13px !important;
        --maintitle: 20px;
        --title: 18px;
        --subtitle: 15px;
        --label: 10px;
    }
}


.backupcolors {
    --maincolor: #0088ea;
    --maingradient: linear-gradient(37deg, #31cb4d 0%, #16cbad 70%);
    --background: #eee;
    --background2: #fff;
    --background3: #fafafa;
    --input-background: #fff;
    --input-shadow: inset 0px 0px 10px #f7f7f7, 0 0 5px #bbb;
    --input-shadow-focus: inset 0px 0px 10px #f7f7f7, 0 0 5px #529ff7;
    --shadow-color: #ddd;
    --title-color: #00c583;
    --subtitle-color: #666;
    --text-color: rgb(17 24 39 1);
    --text: 15px;
    --maintitle: 30px;
    --title: 24px;
    --subtitle: 18px;
    --label: 10px;
    --font: "Outfit", sans-serif;
    --tw-shadow:
        0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1);
    --shadow: 0 0 #0000, 0 0 #0000, 0 0 #0000, 0 0 #0000, var(--tw-shadow);
}