:root {
    --main-color: #eb4141;
    --main-color-inactive: #eb414198;
}

.btn-outline-main {
    background-color: white;
    border: solid 2px;
    border-radius: 6px;
    color: var(--main-color);
    font-size: 1rem;
    padding: 0.25rem 0.5rem;
}

.btn-outline-main:hover {
    background-color: var(--main-color);
    color: white;
}

.btn-outline-main:disabled {
    background-color: white;
    color: var(--main-color-inactive);
}

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

.bg-main {
    background-color: var(--main-color);
}

body {
    min-height: 100vh;
    position: relative;
}

main {
    padding-bottom: 100px;
}

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

nav img {
    width: 65px;
    height: 45px;
}

nav img:hover {
    animation-name: shake;
    animation-duration: 0.4s;
}

@keyframes shake {
    33% {
        -webkit-transform: rotate(20deg);
        transform: rotate(20deg);
        -webkit-transform: rotate(20deg);
        -moz-transform: rotate(20deg);
    }

    66% {
        -webkit-transform: rotate(-15deg);
        transform: rotate(-15deg);
        -webkit-transform: rotate(-15deg);
        -moz-transform: rotate(-15deg);
    }

    100% {
        -webkit-transform: rotate(5deg);
        transform: rotate(5deg);
        -webkit-transform: rotate(5deg);
        -moz-transform: rotate(5deg);
    }
}

svg:hover {
    cursor: pointer;
}

.cursor-hover-default:hover,
.cursor-hover-default *:hover {
    cursor: default !important;
}

.error {
    color: red;
}

#loadingSpinner {
    display: inline-block;
    width: 40px;
    height: 40px;
    border: 3px solid #fff;
    border-radius: 50%;
    border-top-color: var(--main-color);
    animation: spin 1s ease-in-out infinite;
    -webkit-animation: spin 1s ease-in-out infinite;
    margin: auto;
}

@keyframes spin {
    to {
        -webkit-transform: rotate(360deg);
    }
}

@-webkit-keyframes spin {
    to {
        -webkit-transform: rotate(360deg);
    }
}

.mw-80 {
    max-width: 80%;
}

footer {
    display: inline-block;
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 48px;
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 1;
}

footer a {
    color: #575757;
    transition: color .15s ease-in-out;
    text-decoration: none;
}

footer a:hover {
    color: black;
}

@media (max-width: 994px) {
    .displayOver {
        display: none;
    }
}

@media (min-width: 995px) {
    .displayUnder {
        display: none;
    }
}

.text-transparent {
    color: transparent !important;
}

.border-transparent {
    border-color: transparent !important;
}

.fs-small {
    font-size: small;
}

.cursor-hover {
    cursor: pointer;
}