@import url('https://fonts.googleapis.com/css2?family=Outfit:wght@100..900&display=swap');

*{
    margin:0;
    padding:0;
    box-sizing:border-box;
}

:root{
    --primary-font-family: 'Outfit',sans-serif;
    --light-white: #f5f8fa;
    --gray: #5e6278;
    --gray-1: #e3e3e3;
}

body{
    font-family:var(--primary-font-family);
    font-size:14px;
}

.wrapper {
    padding: 0 0 100px;
    background-image: url("/img/bg.png");
    background-position:bottom center;
    background-repeat: no-repeat;
    background-size: contain;         /* cover makes visible and fills area */
    background-attachment: fixed;
    min-height: 100vh;              /* use viewport height so it's visible */
}
html, body {
    height: 100%;
}

.wrapper .logo img{
    max-width:50%;
}

.wrapper input{
    background-color:var(--light-white);
    border-color:var(--light-white);
    color:var(--gray);
}

.wrapper input:focus{
    box-shadow:none;
}

.wrapper .submit_btn{
    padding:15px;
    font-weight:500;
}

.wrapper .login_with{
    padding:15px;
    font-size:15px;
    font-weight:500;
    transition:0.3s ease-in-out;
}

.wrapper .submit_btn:focus,
.wrapper .login_with:focus{
    box-shadow:none;
}

.wrapper .login_with:hover{
    background-color:var(--gray-1);
    border-color:var(--gray-1);
}