body, html{
padding: 0;
margin: 0;
}
.button{
display: inline-block;
background: green;
color: white;
padding: 8px 16px;
border-radius: 5px;
cursor: pointer;
}
.button:hover{
background: #00c500;
}
main{
/* background-image: url('../img/sign-in-bg.jpg');*/
/*height: 100vh;*/
/*height: calc(100vh - 121px);*/
height: 100vh;
width: 100%;
position: relative;
display: flex;
justify-content: center;
align-items: center;
}
main section{
width: 80%;
max-width: 366px;
background: #000000b0;
padding: 32px;
box-sizing: border-box;
}
.row{
display: flex;
position: relative;
flex-wrap: wrap;
}
#g-recaptcha-error{
background: white;
width: 100%;
}
.row a{
color: white;
}
.row input{
width: 100%;
height: 34px;
box-sizing: border-box;
padding: 0 8px;
}
.row input:not(.plain){
padding: 0 8px 0 32px;
}
.row:nth-of-type(n+2){
margin-top: 12px;
}
.row i{
font-size: 22px;
position: absolute;
cursor: pointer;
user-select: none;
-moz-user-select: -moz-none;
-khtml-user-select: none;
-webkit-user-select: none;
-ms-user-select: none;
}
.row i.ileft{
top: 6px;
left: 7px;
}
.row i.iright{
top: 6px;
right: 7px;
}
#form-sign-in{
/*display: none;*/
width: 100%;
}
form h1{
font-size: 18px;
margin-bottom: 8px;
color: white;
}
#bg{
position: absolute;
width: 100%;
top: 0;
left: 0;
z-index: -1;
object-fit: cover;
object-view-box: inherit;
height: 100%;
object-position: left;
}
#sign-in{
border-radius: 0;
}
.fright{
justify-content: flex-end;
}
#signin-loader{
text-align: center;
}
/*.loader-1 {
width: 48px;
height: 48px;
border: 3px solid #FFF;
border-radius: 50%;
display: inline-block;
position: relative;
box-sizing: border-box;
animation: rotation 1s linear infinite;
}
.loader-1::after {
content: '';
box-sizing: border-box;
position: absolute;
left: 50%;
top: 50%;
transform: translate(-50%, -50%);
width: 56px;
height: 56px;
border-radius: 50%;
border: 3px solid;
border-color: #FF3D00 transparent;
}
@-webkit-keyframes rotation {
0% {
transform: rotate(0deg);
}
100% {
transform: rotate(360deg);
}
}
@keyframes rotation {
0% {
transform: rotate(0deg);
}
100% {
transform: rotate(360deg);
}
}
@media only screen and (max-width: 800px) {
body main{
height: calc(100vh - 50px);
}
}*/
.g-recaptcha {
transform-origin: left top;
-webkit-transform-origin: left top;
}
.row a{
font-size: 14px;
}
@media only screen and (max-width: 800px) {
main{
/*height: calc(100vh - 109px);*/
}
}