:root {
    --gradient-color-1: #FFFFFF;
    --gradient-color-2: #ffd0d0;
    --gradient-color-3: #ff9b9b;
    --gradient-color-4: #FFFFFF;
}

* { box-shadow: none !important; }

html, body { background: white; display: flex; align-items: center; justify-content: center; flex-direction: column; width: 100%; min-height: 100%; font-family: 'Outfit', sans-serif; color: black; }

main { display: flex; align-items: center; justify-content: center; flex-direction: column; text-align: center; z-index: 10; }
main .logo { max-width: 100%; width: 70vw; height: auto; margin-bottom: 48px; }
main h2 { font-weight: 600; margin-bottom: 56px; }
main h4 { max-width: 800px; margin-bottom: 0; }
main h5 { margin-bottom: 48px; opacity: .5; }
main form .inp, main form .btn { font-weight: 600; font-size: 24px; line-height: 30px; text-align: center; background: transparent !important; backdrop-filter: blur(30px); border-radius: 10px; }
main form { max-width: 100%; width: 600px; display: flex; flex-direction: column; margin-bottom: 24px; }
main form .inp { color: black !important; padding: 16px 32px; border: 2px solid rgba(0, 0, 0, .5) !important; }
main form .inp:hover, main form .inp:focus { border-color: black !important; }
main form .inp::placeholder { color: black; opacity: .5; }
main form .btn { color: #c6000e !important; padding: 16px 32px; border: 2px dashed #c6000e !important; }
main form .btn:hover, main form .btn:focus { border-style: solid !important; }

footer { display: none; position: fixed; left: 0; right: 0; bottom: 0; text-align: center; }
footer small { opacity: .75; }

.container-fluid { padding: 40px 20px; }

.bg { position: fixed; top: 0; left: 0; right: 0; bottom: 0; }
.bg::after { content: ""; display: block; position: absolute; top: 0; left: 0; right: 0; bottom: 0; background-image: url(../i/noise.png); z-index: 5; opacity: .25; }

#bg-gradient { position: absolute; top: 0; left: 0; right: 0; bottom: 0; width: 100%; height: 100%; z-index: 0; filter: blur(50px); }

.swal2-popup { border-radius: 10px; padding-bottom: 40px; }
.swal2-confirm { width: 100px; background-color: #c6000e !important; margin: 14px 0 0; }

@media (min-width: 768px) {
    main .logo { max-width: 450px; }
    main h2 { font-weight: 600; margin-bottom: 96px; }
    main form { flex-direction: row; }
    main form .inp { text-align: left; }
}

@media (min-width: 992px) {
    .container-fluid { padding: 40px; }
}

@media (min-height: 800px) {
    footer { display: block; }
}