206 lines
2.8 KiB
CSS
206 lines
2.8 KiB
CSS
.hs-login {
|
|
display: flex;
|
|
flex-direction: row;
|
|
justify-content: space-between;
|
|
align-items: center;
|
|
padding: 32px 64px;
|
|
position: absolute;
|
|
background: #fcfcfc;
|
|
}
|
|
|
|
.logo {
|
|
width: 190px;
|
|
height: 51.54px;
|
|
}
|
|
|
|
.fs-login {
|
|
display: flex;
|
|
flex-direction: column;
|
|
align-items: flex-start;
|
|
/* width: 100%; */
|
|
}
|
|
|
|
.fs-label {
|
|
display: flex;
|
|
width: 100%;
|
|
}
|
|
|
|
.container-login {
|
|
background-image: url("../../../assets/img/Background.png");
|
|
background-size: cover;
|
|
height: 100vh;
|
|
}
|
|
|
|
.cs-login {
|
|
display: flex;
|
|
flex-direction: column;
|
|
justify-content: center;
|
|
align-items: center;
|
|
padding: 60px 40px;
|
|
width: 100%;
|
|
max-width: 500px;
|
|
background: #fcfcfc;
|
|
border-radius: 5px;
|
|
}
|
|
|
|
/* Textos */
|
|
.ls-saudacao,
|
|
.ls-plataforma {
|
|
font-family: "Fira Sans", sans-serif;
|
|
text-align: center;
|
|
margin-bottom: 16px;
|
|
}
|
|
|
|
.ls-saudacao {
|
|
font-weight: 400;
|
|
font-size: 40px;
|
|
color: #ef7d00;
|
|
}
|
|
|
|
.ls-plataforma {
|
|
font-weight: 700;
|
|
font-size: 40px;
|
|
color: #2d2e83;
|
|
}
|
|
|
|
.ls-subtitle {
|
|
font-family: "Open Sans", sans-serif;
|
|
font-weight: 700;
|
|
font-size: 20px;
|
|
color: #ef7d00;
|
|
margin-bottom: 10px;
|
|
}
|
|
|
|
.ls-text {
|
|
position: static;
|
|
width: 87px;
|
|
height: 19px;
|
|
left: 0px;
|
|
top: 37px;
|
|
|
|
font-family: "Open Sans";
|
|
font-style: normal;
|
|
font-weight: 700;
|
|
font-size: 14px;
|
|
line-height: 19px;
|
|
/* identical to box height */
|
|
|
|
color: #848484;
|
|
|
|
/* Inside auto layout */
|
|
|
|
flex: none;
|
|
order: 1;
|
|
flex-grow: 0;
|
|
margin: 10px 0px;
|
|
}
|
|
|
|
.is-text {
|
|
/* Auto layout */
|
|
|
|
display: flex;
|
|
flex-direction: row;
|
|
align-items: flex-start;
|
|
padding: 0px;
|
|
align-items: center;
|
|
|
|
position: static;
|
|
width: 408px;
|
|
height: 48px;
|
|
left: 0px;
|
|
top: 66px;
|
|
|
|
/* Inside auto layout */
|
|
|
|
flex: none;
|
|
order: 2;
|
|
align-self: stretch;
|
|
flex-grow: 0;
|
|
margin: 10px 0px;
|
|
}
|
|
|
|
|
|
.bs-default {
|
|
display: flex;
|
|
justify-content: center;
|
|
align-items: center;
|
|
color: white;
|
|
width: 100%;
|
|
height: 48px;
|
|
background: #2d2e83;
|
|
border-radius: 5px;
|
|
margin-top: 16px;
|
|
}
|
|
|
|
.ls-forgot-password {
|
|
text-align: center;
|
|
margin-top: 16px;
|
|
}
|
|
|
|
.ls-link-forgot-password {
|
|
text-decoration: underline;
|
|
color: #2d2e83;
|
|
}
|
|
|
|
/* Responsividade */
|
|
|
|
/* Smartphones */
|
|
@media (max-width: 575.98px) {
|
|
.cs-login {
|
|
padding: 40px 20px;
|
|
max-width: 300px;
|
|
}
|
|
|
|
.ls-saudacao {
|
|
font-size: 24px;
|
|
}
|
|
|
|
.ls-plataforma {
|
|
font-size: 20px;
|
|
}
|
|
|
|
.bs-default {
|
|
height: 56px;
|
|
}
|
|
|
|
.is-text {
|
|
width: 300px;
|
|
height: 40px;
|
|
}
|
|
|
|
.ls-forgot-password {
|
|
font-size: 12px;
|
|
}
|
|
|
|
.ls-link-forgot-password {
|
|
font-size: 12px;
|
|
}
|
|
|
|
}
|
|
|
|
/* Tablets */
|
|
@media (max-width: 991.98px) {
|
|
.cs-login {
|
|
max-width: 400px;
|
|
}
|
|
|
|
.ls-saudacao {
|
|
font-size: 28px;
|
|
}
|
|
|
|
.ls-plataforma {
|
|
font-size: 24px;
|
|
}
|
|
|
|
.is-text {
|
|
width: 250px;
|
|
height: 40px;
|
|
}
|
|
}
|
|
|
|
/* Desktops */
|
|
@media (min-width: 992px) {
|
|
.cs-login {
|
|
max-width: 500px;
|
|
}
|
|
} |