@import url('https://fonts.googleapis.com/css2?family=Manrope&family=Rubik:wght@300&display=swap');


html, body {
    height: 100% !important;
    min-height: 100% !important;
    font-family: 'Manrope', sans-serif !important;
}

main {
    -webkit-box-flex: 1;
    -ms-flex-positive: 1;
    flex-grow: 1;
}

#app {
    height: 100% !important;
    -ms-flex-direction: column !important;
    flex-direction: column !important;
    display: -ms-flexbox !important;
    display: flex !important;
}
.bg-gradient {
    background: #6E4CC1 !important;
    background: -webkit-gradient(linear, left top, right top, from(#6E4CC1), to(#000077)) !important;
    background: linear-gradient(to right, #6E4CC1 0%, #000077 100%) !important;
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='##6E4CC1', endColorstr='##000077',GradientType=1 ) !important;
}

.navbar-top {
    font-size: 14px;
    width: 100%;
}

.elevate {
    z-index: 99999;
    margin-top: 2.3rem!important;
    width: 100%;
}
.zoom {
    transition: all .1s linear;
}
.zoom:hover {
    -ms-transform: scale(1.02); /* IE 9 */
    -webkit-transform: scale(1.02); /* Safari 3-8 */
    transform: scale(1.02);
}

input.invalid {
    border: 1px solid red;
}

.validation-message {
    color: red;
}

.display-4:focus-visible {
    outline: none;
}