:root {
    --clr-1: black;
    --clr-2: #5167af;
    --clr-3: white;
    --clr-4: #F8F8F8;
}


.txt-1 {
    color: var(--clr-1);
}

.txt-2 {
    color: var(--clr-2);
}

.txt-3 {
    color: var(--clr-3);
}

.bg-1 {
    background-color: var(--clr-1);
}

.bg-2 {
    background-color: var(--clr-2);
}

.bg-3 {
    background-color: var(--clr-3);
}

.bg-4 {
    background-color: var(--clr-4);
}

.btn {
    border: 1px solid var(--clr-1);
    background-color: transparent;
    padding: 0.5rem 1rem;
    color: var(--clr-1);
    border-radius: 0;
}

.btn:hover {
    color: var(--clr-3);
    background-color: var(--clr-1);
    border: 1px solid var(--clr-1);
}

.hover-effect {
    position: relative;
}

.hover-effect:hover {
    color: var(--clr-2);
}


.section-header {
    position: relative;
    text-align: center;
    font-weight: 900;
    padding-bottom: 25px;
}
