http://sistemas.semas.pa.gov.br/cbpa/login

1<!DOCTYPE html>
2<html xmlns="http://www.w3.org/1999/xhtml" xmlns:sec="http://www.thymeleaf.org/thymeleaf-extras-springsecurity3">
3
4	<head>
5		<meta charset="UTF-8">
6
7		<link href="https://stackpath.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css" rel="stylesheet" integrity="sha384-wvfXpqpZZVQGK6TAh5PVlGOfQNHSoD2xbE+QkPxCAFlNEevoEH3Sl0sibVcOQVnN" crossorigin="anonymous">
8		<link rel="shortcut icon" type="image/ico" href="img/favicon.ico"/>
9
10		<title>CBPA</title>
11
12		<style>
13
14			body {
15				font-family: "Avenir", Helvetica, Arial, sans-serif;
16				color: #424242;
17				-webkit-font-smoothing: antialiased;
18				-moz-osx-font-smoothing: grayscale;
19				font-size: 14px;
20				background-color: #bdbdbd;
21				background-image: url("img/bg-barragem-sossego.jpg");
22				background-attachment: fixed;
23				background-size: cover;
24				background-position: center;
25			}
26
27
28			form {
29				display: flex;
30				flex-direction: column;
31				justify-content: flex-start;
32				align-items: stretch;
33				text-align: start;
34			}
35
36			a {
37				text-decoration: underline;
38				color: #42A5F5;
39				margin-left: 5px;
40				cursor: pointer;
41			}
42
43			hr {
44				display: block;
45				margin-top: 30px;
46				margin-bottom: 10px;
47				margin-left: auto;
48				margin-right: auto;
49				border-style: inset;
50				border-width: 1px;
51				border-color: #e0e0e0;
52				width: 100%;
53			}
54
55			footer {
56				position: fixed;
57				text-align: center;
58				bottom: 0;
59				color: #ffffff;
60				left: 0;
61				width: 100%;
62				height: 50px;
63			}
64
65			.espacamento-padrao {
66				margin-top: 30px;
67			}
68
69			.margin-15 {
70				margin-top: 15px;
71			}
72
73			.lg-label {
74				text-align: start;
75				margin: 10px 0px;
76			}
77
78			.flex-container {
79				display: flex;
80				flex-direction: column;
81				align-items: center;
82			}
83
84			.logo-ct {
85				height: 100px;
86				width: 300px;
87				background-image: url('img/logo-cbpa-grande.png');
88				background-size: auto 80px;
89				background-repeat: no-repeat;
90                margin-left: 25%;
91			}
92
93			.lg-container {
94				width: 450px;
95				height: 500px;
96				padding: 20px;
97				border-radius: 5px;
98				background-color: #ffffff;
99				border: 1px solid #e0e0e0;
100				display: flex;
101				flex-direction: column;
102				justify-content: flex-start;
103				align-items: stretch;
104				text-align: start;
105			}
106
107			.content-message-error {
108				height: 50px;
109			}
110
111			.campo-padrao {
112				border-radius: 5px;
113				height: 50px;
114				border: 1px solid #EDEDEE;
115				text-indent: 15px;
116			}
117
118			.campo-padrao::placeholder {
119				color: #bdbdbd;
120				opacity: 1; /* Firefox */
121			}
122
123			.campo-login {
124				font-size: 18px;
125			}
126
127			.btn {
128				text-align: center;
129				border-radius: 25px;
130				font-size: 16px;
131				padding: 10px;
132				padding-left: 15px;
133				padding-right: 15px;
134			}
135
136			.btn-login {
137				height: 50px;
138			}
139
140			.btn-padrao {
141				color:  white;
142				background-color: #42A5F5;
143				border: none;
144			}
145
146			.btn-padrao:hover {
147				 cursor: pointer;
148				 color:  #ffffff;
149				 background-color: #42A5F5;
150			 }
151
152			.error-msg {
153			    margin-top: 20px;
154			    color: #42A5F5;
155			    text-align: center;
156			}
157
158			.vertical-center {
159				min-height: 99%;  /* Fallback for browsers do NOT support vh unit */
160				min-height: 98vh; /* These two lines are counted as one <img draggable="false" class="emoji" alt="🙂" src="https://s.w.org/images/core/emoji/72x72/1f642.png">       */
161				display: flex;
162				align-items: center;
163			}
164
165            .texto-bottom-logo {
166                text-align: center;
167                color: #424242;
168                font-weight: bold;
169                margin-bottom: 15px;
170            }
171
172		</style>
173
174	</head>
175
176	<body>
177
178		<div class="flex-container">
179
180			<div class="vertical-center">
181			<div class="lg-container">
182
183				<div class="logo-ct"> </div>
184
185                <div class="texto-bottom-logo">Cadastro de Barragens do Estado do Pará</div>
186
187				<form  action="/cbpa/login" method="post">
188
189					<label class="lg-label"> CPF / CNPJ: </label>
190					<input class="campo-padrao campo-login" type="text" name="username" maxlength="18" id="cpfCnpj" placeholder="CPF ou CNPJ"/>
191
192					<label class="lg-label" > Senha: </label>
193					<input class="campo-padrao campo-login" type="password" name="password" placeholder="Digite sua senha"/>
194
195					<div class="content-message-error">
196						<div class="error-msg" style="display:none">
197							Credenciais inválidas.
198						</div>
199
200						<div class="error-msg" style="display:none">
201							Você foi deslogado por inatividade
202						</div>
203					</div>
204					<button type="submit" class="btn btn-padrao btn-login">
205						<i class="fa fa-sign-in"></i>
206						<span>Entrar</span>
207					</button>
208
209				</form>
210
211				<hr>
212
213				<div class="margin-15">
214
215					Ainda não tem uma conta?
216
217					<a href="http://sistemas.semas.pa.gov.br/entradaUnica/portalSeguranca/" target="_blank"> Criar Conta </a>
218
219					<div class="margin-15"> Não está conseguindo acessar?
220						<a href="http://sistemas.semas.pa.gov.br/entradaUnica/portalSeguranca/" target="_blank">Recuperar senha</a>
221					</div>

222				</div>
223
224			</div>
225			</div>
226
227		</div>
228
229		<footer>
230			© 2018 - CBPA - Cadastro de Barragens do Estado do Pará
231		</footer>
232
233	

233<script type="module" src="https://static.cloudflareinsights.com/beacon.min.js/v31edd6df95cf4e85bb4c19e7a9bdbcba1788362987495" integrity="sha512-iIg7k2xntmwu6/uSb5tpc/hySgZc4eoL31yB29W6tJFo2akwjPWcEqnCEdJvGexCL0KEQwVYv5BlowfhVz26hg==" data-cf-beacon='{"version":"2024.11.0","token":"57d990442a9644958636bc07fece9de9","spa":2}' crossorigin="anonymous"></script>

233
234</body>
235
236	

236<script
237			src="https://code.jquery.com/jquery-3.3.1.min.js"
238			integrity="sha256-FgpCb/KJQlLNfOu91ta32o/NMZxltwRo8QtmkMRdAu8="
239			crossorigin="anonymous"></script>

239
240	

240<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery.mask/1.14.15/jquery.mask.js"></script>

240
241
242	

242<script>
243
244		var nonNumbers = /\D/;
245
246		$("#cpfCnpj").keydown(function(event) {
247
248			if(!(event.ctrlKey || event.altKey || event.shiftKey || event.keyCode == 8 || event.keyCode == 46)) {
249				try {
250					$("#cpfCnpj").unmask();
251				} catch (e) {
252				}
253				var tamanho = $("#cpfCnpj").val().length;
254				if ((tamanho < 11) || (tamanho === 11 && nonNumbers.test(event.key))) {
255					$("#cpfCnpj").mask("999.999.999-99");
256				} else {
257					$("#cpfCnpj").mask("99.999.999/9999-99");
258				}
259				var elem = this;
260				setTimeout(function () {
261					elem.selectionStart = elem.selectionEnd = 10000;
262				}, 0);
263				var currentValue = $(this).val();
264				$(this).val('');
265				$(this).val(currentValue);
266			}
267		});
268
269	</script>

269
270
271</html>