estilo.css

/*estilos css*/

/*estilo alternativo mobile*/
#invisible{
	display:none;
}
#pagina_home{

	display:none;
}
#pagina_home_option{
	display:block;
}
/*estilo alternativo mobile*/

/*menu lateral*/

#version p{
color:rgb(252, 250, 200);
	left:93%;
}

.menu {
	position: fixed;
	background-color: #4682B4;
	width: 15.9%;
	height: 91.7%;
	margin-left: auto;
	margin-right: auto;
	background-image: linear-gradient(320deg, #4682B4, white, #4682B4)
}

.menu #select {
	background-color: #778899;
	box-shadow: none;
	text-align: center;
	color: black;

}

.menu span {
	font-size: 150%;
	background-color: black;
	opacity: 0.5;
	width: 150%;
	padding-left: 33%;
	padding-right: 34%;
	box-shadow: 2px 5px 5px grey;

}

/*opções do menu*/
.opções ul {
	list-style: none;
	font-weight: bold;
	padding-left: 1%;

}

.opções {
	width: 100%;
	margin-left: auto;
	text-align: left;



}

.opções ul li {

	border-bottom: 1px solid black;
	padding-top: 6%;
	padding-bottom: 6%;
	box-shadow: 2px 5px 5px grey;
}

/*opções dos links do menu lateral*/

.opções ul li a {
	text-decoration: none;
	color: #2F4F4F;
	font-weight: bold;
	font-size: 95%;
}

.opções ul li a:hover {
	text-decoration: none;
	color: #2F4F4F;
	font-weight: bold;
	font-size: 100%;
}

.opções ul li a:visited {
	text-decoration: none;
	color: #2F4F4F;
	font-weight: bold;
}

.opções ul li a:active {
	text-decoration: none;
	color: #2F4F4F;
	font-weight: bold;
}

/*fim das opções dos links do menu lateral*/

.opções ul li:hover {
	background-color: #4682B4;
	border-bottom: 1px solid white;
	padding-top: 6%;
	padding-bottom: 6%;
	box-shadow: 2px 5px 5px white;
	text-align: center;
}

/*fim das opções do menu*/

/*cabeçalho*/
.barsup {
	position: fixed;
	background: linear-gradient(-0.2turn, grey, #191970, #48D1CC, #7B68EE);
	opacity: 0.6;
	width: 84%;
	height: 11.7%;
	left: 16%;

}

.barsup h1 {
	position: fixed;
	color: white;
	font-size: 200%;
	left: 30%;
	top: -2%;

}

.barsup span {
	font-size: 200%;

}

/*rodape*/
.rodape {
	position: fixed;
	background-color: blue;
	top: 92%;
	width: 100%;
	height: 10%;
	background: linear-gradient(-0.2turn, grey, #191970, #48D1CC, #7B68EE);

}

.rodape p {
	position: fixed;
	color: white;
	font-size: 67%;
	top: 96.4%;
	left: 44.3%;

}

/*informações*/
.info {
	position: fixed;
	background-color: white;
	left: 78%;
	width: 22%;
	top: 12%;
	height: 79.7%;

}

.info #salve {
	position: fixed;
	background-image: linear-gradient(#B0C4DE, grey);
	color: white;
	left: 78%;
	width: 22%;

}

.info ul {
	list-style: none;
	color: black;
	font-weight: bold;
	padding-left: 1%;
}

.info ul li {
	text-align: left;
	border-bottom: 1px solid white;
	padding-top: 6%;
	padding-bottom: 6%;
	box-shadow: 2px 5px 5px grey;

}

.info ul li:hover {
	background-color: grey;
	color: white;
	text-align: left;
	border-bottom: 1px solid white;
	padding-top: 6%;
	padding-bottom: 6%;


}

/*area de trabalho*/

.desktop {
	position: fixed;
	background: url("res/transito.jpg") no-repeat;
	background-size: 100%;
	opacity: 0.85;
	background-color: #FAEBD7;
	width: 61.9%;
	top: 12%;
	left: 16%;
	height: 79.7%;
	text-align: center;


}

.bar_desk {
	position: fixed;
	background: linear-gradient(-0.1turn, #FF4500, #191970, #48D1CC, #FF4500);
	color: white;
	width: 61.9%;
	height: 9%;
	top: 11.8%;
	left: 16%;
	opacity: 0.8;


}

.news {

	position: fixed;
	background-color: black;
	color: white;
	width: 61.9%;
	height: 40%;
	top: 21%;
	left: 16%;
	opacity: 0.8;


}

.warn {
	position: fixed;
	background-color: black;
	color: white;
	width: 61.9%;
	height: 30.6%;
	top: 61.1%;
	left: 16%;
	opacity: 0.8;
}

/*fim dos estilos da area de trabalho*/

/*estilos da telinha de loguin*/
#sugest_loguin {
	position: fixed;
	text-align: center;
	left:75%;
	bottom: 90%;
	padding:5px;
	background-color: black;
	opacity:0.6;
	color: rgb(208, 249, 245);
	font-size: 80%;
	font-weight:bold;
	border:1px solid black;
	border-radius:10px;
}

#sugest_logout{
	position: fixed;
	text-align: center;
	left:90%;
	bottom: 90%;
	padding:5px;
	background-color: black;
	opacity:0.6;
	color: rgb(208, 249, 245);
	font-size: 80%;
	font-weight:bold;
	border:1px solid black;
	border-radius:10px;

}
#sugest_logout:hover{
	background-color: aliceblue;
	color:black;
}

#sugest_loguin:hover{
	background-color: aliceblue;
	color:black;
}
.loguin_routine {

	display: none;
}

.protection {
	position: fixed;
	background-color: black;
	opacity: 0.3;
	width: 100%;
	height: 100%;
}



.loguin {
	position: fixed;
	color: blue;
	text-align: center;
	border: solid 2px blue;
	background-color: #E0FFFF;
	padding:0.01px;
	left: 40.1%;
	top: 35%;
	border-radius: 3px;
	width:180px;
	
	
}

#loguin_title {
	position:static;
	color: black;
	top:29.25%;
	width:13.3%;
	left:40.2%;
	padding-bottom:0.7%;
	padding-top:0.7%;
	border-radius: 1%;
	font-weight: bold;
}



#loguin_words {
	position: static;
	left: 40.2%;
	width: 13.6%;
	font-weight: bold;
}



#loguin_rec {
	position: static;
	left: 43.1%;
	width: 13.6%;
	bottom: 42%;
	font-size: 55%;
	font-weight: bold;
}




#ex input {
	position:absolute;
	font-weight: bold;
	top:1%;
	left:1%;
	color:red;
	background-color: rgba(248, 239, 240, 0.0);
	border:none;
	border-radius: 5px;
	font-family:system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif, Helvetica, sans-serif;
	font-size:100%;
}






#bt_log input{
	position:absolute;
	top:80%;
	left:40%;
}

/*fim dos estilos da telinha de loguin*/

/*estilo do formulario do controle de estoque*/

.formulario1 {
	position: fixed;
	background-color: black;
	padding-bottom: 15%;
	border: 1px solid black;
	color: black;
	display: block;
	width: 61%;
	left: 16.5%;
	top: 19%;
	height: 38%;
	border-radius: 5px;
	opacity: 0.9;
}

.formulario1 label {
	position: fixed;
	left: 17%;
	font-size: 150%;
	font-weight: bold;
	background: linear-gradient(-0.2turn, grey, #191970, #48D1CC, #7B68EE);
	padding-top: 0.8%;
	color: white;
	width: 60%;
	text-align: center;
}

.formulario1 #label1 {
	top: 22%;
}

.formulario1 #label2 {
	top: 34.4%;
}


.formulario1 #label3 {
	top: 46.8%;
}

.formulario1 #eqpms {
	position: fixed;
	width: 60%;
	left: 17%;
	padding: 0.7%;
	top: 28.2%;
}

.formulario1 #serial {
	position: fixed;
	width: 58.4%;
	left: 17%;
	padding: 0.7%;
	top: 40.6%;
}

.formulario1 #data {
	position: fixed;
	width: 58.4%;
	left: 17%;
	padding: 0.7%;
	top: 53%;
}

.buttons {
	position: fixed;
	bottom: 20%;
}

.buttons #entrada {
	background-image: linear-gradient(black, grey, black);
	color: white;
	position: fixed;
	padding: 0.5%;
	left: 39.3%;
}

.buttons #saida {
	background-image: linear-gradient(black, grey, black);
	color: white;
	position: fixed;
	padding: 0.5%;
	left: 48.3%;
}

/*fim do estilo do formulario do controle de estoque*/

/*estilos da tela de estoque*/
#estoque {
	text-align: left;
	overflow-y: scroll;
	position: fixed;
	background-color: white;
	left: 20%;
	top: 23%;
	height: 60%;
	width: 53%;
	display: none;
}


#tabela_estoque {
	border: 1px solid black;
	position: absolute;
}

#tabela_estoque tr {
	/*border:1px solid black;*/
	padding-left: auto;
}

#tabela_estoque td {
	border: 1px solid black;
	font-weight: bold;
	font-size: 80%;
	width: 10%;
}

#tabela_estoque th {
	background-color: #B0C4DE;
	color: black;
	border: 1px solid black;
	font-size: 80%;
}


#conteudo_estoque{
	display:none;
}


#conteudo_saida{
	display:none;
}


#conteudo_saida input{
	position:fixed;
	right:26.8%;
	top:84%;
	padding-left:24.9%;
	padding-right:24.8%;
}



#conteudo_entrada{
	display:none;
}



#totais{
	display:none;
}
/*fim dos estilos da tela de estoque*/



/*Estilo para a pagina de insert bank */
#insert_bank{
	position:fixed;
	border:1px solid black;
	left:25%;
	bottom:50%;
	width: 50%;
	padding-left:auto;
	padding-right:1%;
	padding-bottom:1%;
	padding-top: 1%;	
}


#insert_bank #text_input{
	width: 80%;
	left:10%;
	font-size: 150%;
}


#insert_bank label{
	position:fixed;
	font-size: 110%;
	left:27%;
	bottom: 59%;
}



#Insert_in_bank{
	font-size: 100%;
}



#voltar{
	position:fixed;
	bottom: 40%;
	left:48%;
}

/*fim dos estilos p-ara a pagina de insert bank*/


/*body*/
body {

	background-color: #ffffff;
	text-align: center;
	position: fixed;
	margin: auto;

}