@import url("https://fonts.googleapis.com/css2?family=Nunito:wght@400;600;700&display=swap");

/*---------------------------------------
  CUSTOM PROPERTIES ( VARIABLES )             
-----------------------------------------*/
:root {
    --primary: #4723D9;
    --dark-blue: #363f5f;
    --white-color: #ffffff;
    --primary-color: #754dd3;
    --secondary-color: #1e0f80;
    --section-bg-color: #f0f8ff;
    --custom-btn-bg-color: #7761f4;
    --custom-btn-bg-hover-color: #E76F51;
    --dark-color: #000000;
    --p-color: #717275;
    --link-hover-color: #E76F51;

    --body-font-family: 'Unbounded', sans-serif;
    --body-font: 'Nunito', sans-serif;

    --h1-font-size: 42px;
    --h2-font-size: 36px;
    --h3-font-size: 28px;
    --h4-font-size: 24px;
    --h5-font-size: 22px;
    --h6-font-size: 20px;
    --p-font-size: 16px;
    --menu-font-size: 14px;
    --btn-font-size: 14px;
    --copyright-font-size: 14px;

    --border-radius-large: 100px;
    --border-radius-medium: 20px;
    --border-radius-small: 10px;

    --font-weight-light: 300;
    --font-weight-normal: 400;
    --font-weight-semibold: 600;
    --font-weight-bold: 700;

    --normal-font-size: 1rem;
}

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

body {
    position: relative;
    font-family: var(--body-font);
    font-size: var(--normal-font-size);
    transition: .5s;
    height: 89.3vh !important;
    width: 100% !important;
}

main {
    height: 100% !important;
    width: 100% !important;
}

button,
a {
    cursor: pointer;
    text-decoration: none;
}

table thead {
    background-color: var(--primary) !important;

    th {
        color: var(--white-color) !important;
    }
}