/*---------- Configurações Iniciais ----------*/
@charset "UTF-8";

html {
	background: url("../images/background.webp") no-repeat; 
	background-size: 720px 606px;
	background-position: center 6em;
  	box-shadow: inset 0 0 0 2000px rgba(255, 255, 255, .4);
}

label {
  	font-weight: 700;
}

section {
	display: flex;
	flex-direction: row;
	justify-content: center;
}

h1 {
	color: #000;
}




/*---------- Header ----------*/
.FotoLogo {
	margin-bottom: .7em;
	margin-top: .7em;
	margin-left: 3em;
}





/*---------- Section ----------*/
/*------- frm -------*/
.divLogin {
	display: flex;
	flex-direction: column;
	width: 60%;
	align-items: flex-start;
}

.divForm {
  	display: flex;
 	flex-direction: row;
	justify-content: center;
}

.divLabel {
	margin-right: .3em;
}

.divInfo {
	margin-bottom: 1em;
}

.lastInfo {
	margin-bottom: 0;
}

.divLabel {
	margin-top: .3em;
	margin-bottom: 1.4em;
}

#tSenha {
	text-transform: initial;
}


/*------- botões -------*/
.link-a {
	color: #0EB372;
	text-decoration: none;
}

#B1_especial {
	margin-bottom: .7em;
	width: 150px !important;
}

.botoesForm {
	flex-direction: column;
	align-items: center;
}



/*---------- tutoriais ----------*/
/*------ figures ------*/
.divFotoLegendas {
	width: 35%;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	margin-top: 2em;
}

.divFotoLegenda1 {
	margin-top: .5em;
}

.divFotoLegenda2, .divFotoLegenda3 {
  	margin-top: 1em;
}

#GB1{
  	margin-bottom: 13em;
}

#pFotoLegenda1 {
	margin-left: .1em;
}

#pFotoLegenda2 {
	margin-left: .9em;
}

#pFotoLegenda3 {
	margin-left: -.2em;
}






/*---------- Responsividade ----------*/
@media (max-width: 1050px) {
	html {
		background: url("../images/background.webp") no-repeat; 
		background-size: 100% 500px;
		background-position: center 7em;
		box-shadow: inset 0 0 0 2000px rgba(255, 255, 255, .4);
	}

	h1 {
		margin-top: 1em;
	}

	.divLabel {
  		margin-right: 0;
	}

	.GB1 {
  		margin-bottom: 14em;
	}
}

@media (max-width: 600px) {
	.inputs {
		width: 200px;
	}

	section {
		flex-direction: column-reverse;
		align-items: center;
	}

	.divLogin {
		width: 100%;
		align-items: center;
	}

	.divFotoLegendas {
		width: 100%;
		margin-top: 1em;
	}

	#GB1{
  		margin-bottom: 1em;
	}
}