:root{
    --primary: #009444;
}
body{overflow-x: hidden;font-size: 14px;font-family: "Nunito", sans-serif !important;background: url('./../img/bg-log.webp') no-repeat center;background-size: cover;}

input{box-shadow: none !important;outline: none !important;}
a, input, button, label::after{transition: all .2s;-webkit-transition: all .2s;}

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed, 
figure, figcaption, footer, header, hgroup, 
menu, nav, output, ruby, section, summary,
time, mark, audio, video {margin: 0;padding: 0;border: 0;font-size: 100%;font: inherit;vertical-align: baseline;}
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure, 
footer, header, hgroup, menu, nav, section {display: block;}
body {line-height: 1;}
ol, ul {list-style: none;}
blockquote, q {quotes: none;}
blockquote:before, blockquote:after,
q:before, q:after {content: '';content: none;}
table {border-collapse: collapse;border-spacing: 0;}

.log-page{width: 100vw;height: 100vh;display: flex;align-items: center;justify-content: center;background-color: rgba(0,0,0,.25);}
.wrapper-form{background-color: #fff;box-shadow: 0 0 10px 4px rgb(255 255 255 / 15%);padding: 30px;border-radius: 12px;width: 400px;max-width: calc(100% - 30px);}
.wrapper-form h1{font-size: 25px;margin: 0 0 25px;font-weight: bold;}
.form-group{margin-bottom: 15px;display: flex;flex-direction: column;}
.form-group label{color: #444;margin: 0 0 5px;}
.form-group input{padding: 10px;max-height: 50px;border: 1px solid #ddd;border-radius: 3px;}
.form-group input:focus, .form-group input:active{border-color: var(--primary);}
.form-group .invalid-feedback{color: red;margin-top: 5px;font-size: 12px;}

.form-check{margin-bottom: 15px;}
.form-check .form-check-input{display: none;}
.form-check .form-check-label{position: relative;padding-left: 45px;}
.form-check .form-check-label::before, .form-check .form-check-label::after{content: "";position: absolute;top: 50%;transform: translateY(-50%);}
.form-check .form-check-label::before{width: 35px;height: 18px;left: 0;border: 1px solid #ddd;border-radius: 25px;}
.form-check .form-check-label::after{left: 4px;width: 14px;height: 14px;background-color: #ddd;border-radius: 50%;}
.form-check .form-check-input:checked + .form-check-label::before{border-color: var(--primary);}
.form-check .form-check-input:checked + .form-check-label::after{left: 19px;background: var(--primary);}

.log-page button{cursor: pointer;background-color: transparent;color: var(--primary);border: 2px solid #009444;height: 40px;display: flex;align-items: center;justify-content: center;width: 180px;margin: 0 auto;font-weight: 600;text-transform: uppercase;margin-top: 35px;letter-spacing: 1px;}
.log-page button:hover{background-color: var(--primary);color: #fff;}