body {
    background-color: #f4f5f9;
    display: flex;
    flex-direction: column;
    min-height: 100vh;
    font-family: Manrope;
}

main {
    flex: 1;
}

a {
    text-decoration: none;
}

.col-lg-3 .active span {
    color: #747ed1 !important;
    font-weight: bold;
}

.col-lg-3:not(.active) .btn-purple {
    background-color: #a1a1a1 !important;
    border-color: #a1a1a1 !important;
}

.col-lg-3 .active .btn-purple {
    background-color: #747ed1 !important;
    border-color: #747ed1 !important;
}

.card {
    border-radius: 24px;
    box-shadow: none;
}

.form-control {
    box-shadow: none !important;
    border-color: #f3f3f3;
    border-radius: 12px;
}

.alert-danger {
    background-color: #dc2626 !important;
    border-color: #dc2626 !important;
    color: #FFF !important;
}

.alert-success {
    background-color: #16a34a !important;
    border-color: #16a34a !important;
    color: #FFF !important;
}

.alert-primary {
    background-color: #2563eb !important;
    border-color: #2563eb !important;
    color: #FFF !important;
}

.alert-warning {
    background-color: #ef8407 !important;
    border-color: #ef8407 !important;
    color: #FFF !important;
}

::placeholder {
    color: #a1a1a1 !important;
}

.content {
    display: none;
}

.select2-selection--single {
    background-color: #fefefe;
    border-radius: 0.4rem;
    border-color: transparent !important;
    padding: 0.6rem 1rem;
    font-size: 16px;
    height: 48.38px !important;
    line-height: 1.7;
}

.select2-selection {
    background-color: #fefefe !important;
    border: 1px solid #ededed !important;
    border-radius: 0.4rem !important;
    padding: 0.6rem 1rem !important;
    box-shadow: 0 0 0 0rem !important;
}

.select2-search__field {
    border: none !important;
}

.select2-search__field:focus {
    box-shadow: 0 0 0 0rem !important;
}

.select2-container *:focus {
    outline: none;
}

.currency .select2-container, .timezone .select2-container {
    width: 605px !important;
}

.checkmark {
    width: 300px;
    margin: 0 auto;
    padding-top: 40px;
}

.path {
    stroke-dasharray: 300;
    stroke-dashoffset: 0;
    -webkit-animation-name: load, spin;
    -webkit-animation-duration: 3s, 3s;
    -webkit-animation-timing-function: linear;
    -webkit-animation-iteration-count: infinite;
    animation-name: load, spin;
    animation-duration: 3s, 3s;
    animation-timing-function: linear;
    animation-iteration-count: infinite;
    -webkit-transform-origin: 50% 50%;
    -moz-transform-origin: 50px 50px;
}

.path-complete {
    -webkit-animation-play-state: paused;
    animation-play-state: paused;
}

.check {
    stroke-dasharray: 110;
    stroke-dashoffset: -110;
    stroke-width: 0;
}

.cross {
    stroke-dasharray: 110;
    stroke-dashoffset: -110;
    stroke-width: 0;
}

.check-complete {
    -webkit-animation: check 1s ease-in forwards;
    animation: check 1s ease-in forwards;
    stroke-width: 15;
    stroke-dashoffset: 0;
}

.cross-complete {
    -webkit-animation: cross 1s ease-in forwards;
    animation: cross 1s ease-in forwards;
    stroke-width: 15;
    stroke-dashoffset: 0;
}

.fill {
    stroke-dasharray: 285;
    stroke-dashoffset: -257;
    -webkit-animation: spin-fill 3s cubic-bezier(0.700, 0.435, 0.120, 0.600) infinite forwards;
    animation: spin-fill 3s cubic-bezier(0.700, 0.465, 0.120, 0.600) infinite forwards;
    -webkit-transform-origin: 50% 50%;
    -moz-transform-origin: 50px 50px;
}

.fill-complete {
    -webkit-animation: fill 1s ease-out forwards;
    animation: fill 1s ease-out forwards;
}

@-webkit-keyframes load {
    0% {
        stroke-dashoffset: 300;
        -webkit-animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190);
    }
    50% {
        stroke-dashoffset: 0;
        -webkit-animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
    }
    100% {
        stroke-dashoffset: -300;
    }
}

@keyframes load {
    0% {
        stroke-dashoffset: 285;
        animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190);
    }
    50% {
        stroke-dashoffset: 0;
        animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
    }
    100% {
        stroke-dashoffset: -285;
    }
}

@-webkit-keyframes check {
    0% {
        stroke-dashoffset: -110;
    }
    100% {
        stroke-dashoffset: 0;
    }
}

@keyframes check {
    0% {
        stroke-dashoffset: -110;
    }
    100% {
        stroke-dashoffset: 0;
    }
}

@-webkit-keyframes cross {
    0% {
        stroke-dashoffset: -110;
    }
    100% {
        stroke-dashoffset: 0;
    }
}

@keyframes cross {
    0% {
        stroke-dashoffset: -110;
    }
    100% {
        stroke-dashoffset: 0;
    }
}

@-webkit-keyframes spin {
    0% {
        -webkit-transform: rotate(0deg);
    }
    100% {
        -webkit-transform: rotate(360deg);
    }
}

@keyframes spin {
    0% {
        transform: rotate(0deg);
    }
    100% {
        transform: rotate(360deg);
    }
}

@-webkit-keyframes spin-fill {
    0% {
        -webkit-transform: rotate(0deg);
    }
    100% {
        -webkit-transform: rotate(720deg);
    }
}

@keyframes spin-fill {
    0% {
        transform: rotate(0deg);
    }
    100% {
        transform: rotate(720deg);
    }
}

@-webkit-keyframes fill {
    0% {
        stroke-dashoffset: 285;
    }
    100% {
        stroke-dashoffset: 0;
    }
}

@keyframes fill {
    0% {
        stroke-dashoffset: 285;
    }
    100% {
        stroke-dashoffset: 0;
    }
}

.success {
    stroke: #009900;
    transition: stroke .6s;
}

.unsuccess {
    stroke: #FF0000;
    transition: stroke .6s;
}

.absolute-active {
    position: absolute;
    width: 25%;
    top: -13px;
    right: -40px;
    display: flow-root;
}

.absolute-active svg {
    width: 75%;
}