:root {
    /* Primary Theme Colors */
    --primary-color: #092455;
    --secondary-color: #9a0100;
    --accent-color: #f4b400;
    --background-color: #f7f9fc;
    --text-color: #2d3748;
    --highlight-color: #094f47;
}

/* Example usage */
body {
    background-color: var(--background-color);
    color: var(--text-color);
    font-family: "Poppins", sans-serif;
}

@font-face {
    font-family: "Roboto";
    src: url("../css/fonts/Roboto-Regular.ttf") format("truetype");
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: "Poppins";
    src: url("../css/fonts/Poppins-Regular.ttf") format("truetype");
    font-weight: 400;
    font-style: normal;
}

@font-face {
    font-family: "Poppins";
    src: url("../css/fonts/Poppins-Medium.ttf") format("truetype");
    font-weight: 500;
    font-style: normal;
}

@font-face {
    font-family: "Poppins";
    src: url("../css/fonts/Poppins-Bold.ttf") format("truetype");
    font-weight: 700;
    font-style: normal;
}

.times-roman {
    font-family: "Times New Roman", Times, serif;
}

.tomkin {
    font-family: "Tomkin", Times, serif;
}

@keyframes scrollUp {
    0% {
        transform: translateY(100%);
    }

    100% {
        transform: translateY(-100%);
    }
}

[x-cloak] {
    display: none !important;
}