:root {
    --main-bg-color: #003476;
    --bg-color-light: #f0f3f4;
    --border-radius-main: 16px;
    --border-radius-small: 8px;
    --border-radius-large: 24px;
    --text-color-main: #003476;
    --text-color-light: #f0f3f4;
}

/*-----------colors---------*/

body{
    background: var(--bg-color-light);
}
.bg-main-color{
    background-color: var(--main-bg-color) !important;
}

.border-main-color{
    border-color: var(--main-bg-color) !important;
}

.bg-gradient-1 {
    background: rgb(34,129,195);
    background: linear-gradient(90deg, rgba(34,129,195,0.5) 0%, rgba(255,210,48,0.5) 100%);
}

.bg-gradient-2 {
    background: rgb(17, 125, 180);
    background: linear-gradient(90deg, rgba(17, 125, 180,1) 0%, rgba(0,52,118,1) 50%, rgba(17, 125, 180,1) 100%);
}

.bg-gradient-3 {
    background: rgb(255,255,255);
    background: linear-gradient(90deg, rgba(255,255,255,0.5) 0%, rgba(148,195,255,1) 100%);
}
.bg-gradient-3-rev {
    background: rgb(255,255,255);
    background: linear-gradient(270deg, rgba(255,255,255,0.5) 0%, rgba(148,195,255,1) 100%);
}

.text-color-main{
    color: var(--text-color-main) !important;
}
.text-color-light{
    color: var(--text-color-light) !important;
}

.btn-outline-main {
    color: var(--text-color-main) !important;
    border-color: var(--main-bg-color) !important;
}
.btn-outline-main:hover {
    background-color: var(--main-bg-color) !important;
    color: var(--text-color-light) !important;
}

.card-hover-bg:hover {
    background-color: var(--bg-color-light);
    scale: 1.01;
    transition-duration: 0.3s;
    transition-timing-function: linear;
}

a.light {
    text-decoration-line: none;
}

/*-----------sizes-----------*/
.font-size-2 {
    font-size: 2rem;
}

/*-----------spacers---------*/
.spacer-sm{
    padding-bottom: 1%;
}

.spacer-md{
    padding-bottom: 5%;
}

.spacer-lg{
    padding-bottom: 10%;
}

/*-----------borders---------*/

.border-radius-main {
    border-radius: var(--border-radius-main) !important;
}
.border-radius-small {
    border-radius: var(--border-radius-small) !important;
}
.border-radius-large {
    border-radius: var(--border-radius-large) !important;
}