@font-face {font-display: swap; font-family: 'Nunito'; font-style: normal; font-weight: 500; src: url('Nunito/nunito-v26-latin_latin-ext-500.woff2') format('woff2');}
@font-face {font-display: swap; font-family: 'Nunito'; font-style: italic; font-weight: 500; src: url('Nunito/nunito-v26-latin_latin-ext-500italic.woff2') format('woff2');}
@font-face {font-display: swap; font-family: 'Nunito'; font-style: normal; font-weight: 700; src: url('Nunito/nunito-v26-latin_latin-ext-700.woff2') format('woff2');}
@font-face {font-display: swap; font-family: 'Nunito'; font-style: normal; font-weight: 900; src: url('Nunito/nunito-v26-latin_latin-ext-900.woff2') format('woff2');}

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;}
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {display: block;}
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;}
a {text-decoration: none;}
img {width: auto; height: auto; max-width: 100%; max-height: 100%;}
strong {font-weight: 700}

input, select, textarea, button {outline:0;}
select {box-sizing:content-box;-webkit-appearance: none;-moz-appearance: none;text-indent: 1px;text-overflow: '';}
input[type=search] {-webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box;}
input[type=checkbox],
input[type=radio] {margin: 4px 0 0; margin-top: 1px\9; line-height: normal;}
input[type=file] {display: block;}
input[type=range] {display: block; width: 100%;}
select[multiple],
select[size] {height: auto;}
input[type=file]:focus,
input[type=checkbox]:focus,
input[type=radio]:focus {outline: 5px auto -webkit-focus-ring-color; outline-offset: -2px;}
button, [type=submit] {border: none; cursor: pointer;}

.last {margin-right: 0 !important}
.clear {clear: both;}

html {width: 100%; height: 100%;}
body {font-family: 'Nunito'; font-weight: normal; font-style: normal; font-size: 16px; line-height: 1; background: #FEFEFE; color: #12878b; position: relative; width: 100%; height: 100%;}
a {color: #5E5E5E;}

code {white-space: pre;font-family: Courier New, monospace; font-weight: 700}
img {max-width: 100%; max-height: 100%; height: auto; width: auto;}


.loading,
.alerta {position: fixed; width: 100%; height: 100%; top: 0; left: 0; z-index: 500; background: rgba(18,135,139, 0.8); display: none; z-index: 999}
.loading img {position: absolute;top: 50%; left: 50%; transform: translate(-50%, -50%);}
.loading p {position: absolute;top: calc(50% + 100px); left: 50%; font-size: 22px; font-weight: 600; color: #FFF; letter-spacing: 3px; transform: translate(-50%, -50%);}

.alerta .conteudo {position: absolute;left: 50%;transform: translate(-50%, -50%);top: 50%;border-radius: 8px; min-width: 280px; max-width: 600px; background-color: #FFF; color: #12878b; font-size: 16px; font-weight: 600; border: 8px solid #12878b; padding: 25px;}
.alerta .conteudo .icone {text-align: center;}
.alerta .conteudo .icone img {width: 100px; height: 100px;}
.alerta .conteudo .mensagem {text-align: center; font-size: 22px;}
.alerta .conteudo .mensagem p {margin-top: 15px;}
.alerta .conteudo .mensagem strong {font-size: 16px; margin-bottom: 10px}
.alerta .conteudo a.ok,
.alerta .conteudo a.sim,
.alerta .conteudo a.nao {display: inline-block; color: #FFF; padding: 0 30px; line-height: 36px; font-size: 16px; letter-spacing: 1px; border-radius: 50px; transition: 0.3s all;}
.alerta .conteudo a.ok {background: #12878b; border: 2px solid #12878b}
.alerta .conteudo a.sim {background: #12878b; border: 2px solid #12878b;}
.alerta .conteudo a.nao {background: #ff2605; border: 2px solid #ff2605;}
.alerta .conteudo a.ok:hover {background: #FFF;color:#12878b}
.alerta .conteudo a.sim:hover {background: #FFF;color:#12878b}
.alerta .conteudo a.nao:hover {background: #FFF;color:#ff2605}


main {width: 655px; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%);}
img.img-login {width: 340px; float: left; margin-right: 70px;}

.header {width: 245px; font-size: 28px; font-weight: bold; letter-spacing: 2px; text-align: center;}
.header strong {display: block; margin: 5px 0 15px 0;}

form {float: right; width: 245px;}
form .row {margin-bottom: 10px}
form .row.buttons {margin-top: 10px}
form .row input[type=email],
form .row input[type=password] {border: 1px solid #1ac0c6; padding: 0 15px 0 45px; border-radius: 8px; font-size: 16px; line-height: 44px; width: calc(100% - 62px);}

form .row input[type=email] {background: url(../images/ico-login-email.svg) 15px center/18px no-repeat;;}
form .row input[type=password] {background: url(../images/ico-login-password.svg) 17px center/14px no-repeat;;}
form .row input[type=submit] {float: right; border: 2px solid #12878b; background: #12878b url(../images/ico-login-white.svg) calc(100% - 25px) center/16px no-repeat; color: #FFF; padding: 0 55px 0 25px; line-height: 36px; font-size: 16px; letter-spacing: 1px; border-radius: 8px; transition: 0.3s all;}
form .row input[type=submit]:hover {background: #FFF url(../images/ico-login.svg) calc(100% - 25px) center/16px no-repeat; color: #12878b;}


form .row.rememberMe {float: left; line-height: 36px;}


form.forms .checkbox {float: left; position: relative; cursor: pointer; z-index: 9;}
form.forms .checkbox input {display: none;}
form.forms .checkbox div {display: block; border: 1px solid #1ac0c6; border-radius: 3px; width: 14px; height: 14px; float: left; margin: 9px 0;}
form.forms .checkbox div span {display: block; background: #FFF; border-radius: 3px; width: 9px; height: 9px; margin: 3px; transition: 0.3s all;}
form.forms .checkbox div span.selected {background: #fb7756;}
form.forms .checkbox span.label  {float: left; line-height: 34px; margin-left: 5px; font-size: 14px;}

@media screen and (max-width:960px) {
aside {float: none; width: 100%}
}