div.login--fill{
    position: absolute; display: flex; left: 0; top: 0; width: 100%; min-height: 100%; padding: 32px;
    align-items: center; justify-content: center; box-sizing: border-box;
	background-color: hsl(0,0%,97%);
}

div.login--container{
    position: relative; display: flex; width: 675px; gap: 32px; flex-direction: column;
}

.--mobile div.login--container{
    width: 305px;
}

div.login--box{
    position: relative; display: flex; width: 100%;
    border-radius: 4px; border: 1px solid rgba(0,0,0,.05); overflow: hidden;
	background-color: hsl(0,0%,100%);
}

img.login--image{
    width: 350px; object-fit:cover;
}

.--mobile img.login--image{
    display: none;
}

div.login--fields{
    position: relative; width: 100%; box-sizing: border-box; padding: 32px; overflow: hidden;
    display: flex; gap: 16px; flex-direction: column; align-items: flex-start;
}

div.login--fields form {
    display: flex; gap: 16px; flex-direction: column; align-items: flex-start;
}

div.login--headers{
    display: flex; align-items: center; width: 100%; gap: 8px;
}

img.login--icon{
    width: 48px; height: 48px; flex-shrink: 0;
}

div.login--titles{
    display: flex; flex-direction: column; width: 100%;
}

div.login--title{
    font-size: 24px; font-weight: normal;
	color: hsl(0,0%,40%);
}

div.login--website-title{
    font-size: 12px; font-weight: normal;
	color: hsl(0,0%,60%);
}