@import url(./navbar.css);
@import url(./homeMain.css);
@import url(./countDown.css);
@import url(./footer.css);

:root {
    --color-white: #ffffff;
    --color-dark: #111111;
    --color-primary: rgba(255, 136, 0, 1);
    --color-secondary: rgba(255, 220, 5, 1);

    --font-base: 16px;
    --font-lg: 20px;
    --font-xl: 30px;
    --font-sm: 14px;

    --space-xs: 4px;
    --space-sm: 8px;
    --space-md: 16px;
    --space-lg: 32px;

    --background: radial-gradient(circle, var(--color-white) 0%, var(--color-secondary) 20%, var(--color-primary) 100%);
}

@media screen and (max-width:600px) {
    :root {
        --font-lg: 18px;
        --font-xl: 28px;
    }
}

@media screen and (max-width:425px) {
    :root {
        --font-lg: 18px;
        --font-xl: 26px;
    }
}

html,
body {
    width: 100vw;
    overflow-x: hidden;
}

body {
    background: var(--color-primary);
    overflow-y: scroll;
    font-family: Arial, Helvetica, sans-serif;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

* {
    box-sizing: border-box;
    padding: 0;
    margin: 0;
}

a {
    color: inherit;
    text-decoration: none;
}
.page {
    width: 100dvw;
    background: var(--background);
  }