*{
	margin: 0;
	padding: 0;
	box-sizing: border-box;
	font-family: "Open Sans";
}

.w5{
	width: 5%;
	padding: 0 2px;
}

.w7{
	width: 7%;
	padding: 0 5px;
}

.w8{
	width: 8%;
	padding: 0 5px;
}

.w10{
	width: 10%;
	padding: 0 5px;
}

.w12{
	width: 12%;
	padding: 0 5px;
}

.w14{
	width: 14%;
	padding: 0 5px;
}

.w16{
	width: 16.7%;
	padding: 0 5px;
}

.w18{
	width: 18%;
	padding: 0 5px;
}

.w20{
	width: 20%;
	padding: 0 5px;
}

.w25{
	width: 25%;
	padding: 0 5px;
}

.w33{
	width: 33%;
	padding: 0 5px;
}

.w38{
	width: 36%;
	padding: 0 5px;
}

.w40{
	width: 40%;
	padding: 0 5px;
}

.w50{
	width: 49%;
	padding: 0 5px;
}

.w55{
	width: 58%;
	padding: 0 5px;
}

.w60{
	width: 58%;
	padding: 0 5px;
}

.w64{
	width: 64%;
	padding: 0 5px;
}

.w66{
	width: 66.7%;
	padding: 0 5px;
}

.w75{
	width: 75%;
	padding: 0 5px;
}

.w88{
	width: 88%;
	padding: 0 5px;
}

.w100{
	width: 100%;
	padding: 0 5px;
}

.left{
	float: left;
}

.right{
	float: right;
}

input[type=number]{
	margin-top: 8px;
}

input[type=text],
input[type=button],
input[type=submit],
input[type=password],
textarea{
	-webkit-appearance: none;
	border-radius: 0;
}

html,body{
	height: 100%;
	background: rgb(225,225,225);
}

body{
	overflow-x: hidden;
}

.card-title{
	width: 100%;
	padding: 6px;
	color: white;
	margin: 10px 0;
	font-size: 17px;
	font-weight: lighter;
	background: #0091ea;
}

/*Gerar PDF tipo 1*/
.gerar-pdf{
	display: inline-block;
	margin-top: 10px;
}

.gerar-pdf a{
	padding: 10px 15px; 
	background-color: #28a745; 
	color: white !important;
	text-decoration: none;
	border-radius: 5px;
}

/*Gerar PDF tipo 2*/
.gerar_pdf{
	display: inline-block;
	margin-top: 10px;
}

.gerar_pdf a{
	padding: 10px 15px; 
	background-color: #28a745; 
	color: white !important;
	text-decoration: none;
	border-radius: 5px;
}

/*Página de login*/
.box-login{
	box-shadow: 10px 10px 5px rgb(200,200,200);
	max-width: 600px;
	width: 95%;
	padding: 60px 2%;
	background: white;
	position: absolute;
	left: 50%;
	top: 50%;
	transform: translate(-50%,-50%);
	-ms-transform:translate(-50%,-50%);
}

.box-login h2{
	text-align: center;
	font-size: 19px;
	text-transform: uppercase;
	font-weight: normal;
	margin:10px 0;
	color: black;
}

.box-login input[type=text],
.box-login input[type=password]
{
	width: 100%;
	height: 40px;
	border: 1px solid #ccc;
	padding-left: 8px;
	margin-top:8px;
}

.box-login input[type=submit]{
	width: 100px;
	height: 40px;
	cursor: pointer;
	margin-top: 10px;
	font-size: 14px;
	background: #00bfa5;
	color: white;
	border: 0;
}

.botao-login{
	font-weight: 500;
	padding: 8px 16px;
	font-style: italic;
}

/*Box erro do painel*/
.erro-box{
	width: 100%;
	padding: 8px 2%;
	text-align: center;
	background: #F75353;
	color: white;
	font-size: 15px;
}

/*Painel de controle*/
.clear{clear:both;}

.center{padding:0 2%;margin:0 auto;}

.loggout{
	float: right;
}

.loggout a{
	padding: 0 20px;
	position: relative;
	top: 4px;
	text-decoration: none;
	color: white;
	font-size: 16px;
}

.loggout a > span{
	font-size: 16px;
	text-decoration: none;
}

.menu-btn{
	float: left;
	cursor: pointer;
	font-size: 23px;
	color: white;
}

.menu-wraper{width:250px;}

div.menu{
	overflow-x: hidden;
	overflow-y: auto;
	height: 100%;
	padding: 10px 0;
	position: fixed;
	left: 0;
	top: 0;
	background: #455a64;
	float: left;
	width: 250px;
}

header{
	position: relative;
	left: 250px;
	padding: 10px 0;
	background: #78909c; 
	width: calc(100% - 250px);
}

.content{
	width: calc(100% - 250px);
	position: relative;
	left: 250px;
	padding: 2%;
}

.items-menu{
	margin-top: 3px;
}

.items-menu h2{
	text-align: left;
	font-weight: normal;
	font-size: 16px;
	background: #2F3D42;
	color: white;
	padding: 3px;
}

.items-menu a{
	display: block;
	padding: 2px;
	font-weight: 250;
	font-size: 14px;
	text-decoration: none;
	color: white;
	border-bottom: 1px solid #2F3D42;
}

div.box-usuario{
	padding: 3px;
	text-align: center;
}

.avatar-usuario{
	text-align: left;
	display: inline-block;
	width: 130px;
	height: 130px;
	border-radius: 50%;
	border: 3px solid #2F3D42;
}

.avatar-usuario i{
	position: relative;
	left: 50%;
	top: 50%;
	transform:translate(-50%,-50%);
	-ms-transform:translate(-50%,-50%);
	font-size: 50px;
	color: #2F3D42;
}

.imagem-usuario{
	display: inline-block;
	width: 130px;
	height: 130px;
	position: relative;
	border-radius: 50%;
	border: 3px solid #2F3D42;
}

.imagem-usuario img{
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	border-radius: 50%;
}

.nome-usuario{
	text-align: center;
	margin-top: 3px;
}

.nome-usuario p{
	color: white;
	font-size: 14px;
	font-weight: normal;
}

/*Configuração da Imagem do Cadastro de Produtos*/
.cadastrar-produtos img{
	width: 300px;
	height: 420px;
}

/*Página de serviços*/
section.servicos{
	width: 100%;
	height: 100%;
	padding: 5px 0;
	background: #f4f5ba;
	position: relative;
	overflow-x: hidden;
}

/* Estilo exclusivo para composição */
.compos-wrapper-titulo {
    margin-top: 20px;
}

.compos-wrapper-titulo table,
.compos-wrapper-lista table {
    width: 100%;
}

.compos-wrapper-titulo td {
    border-bottom: 2px solid #ccc;
    font-weight: 600;
}

.compos-wrapper-lista td {
    border-bottom: 1px solid #ccc;
}

.compos-text-left {
    text-align: left;
}

.compos-text-right {
    text-align: right;
    padding-right: 16px;
}

.compos-totalgeral {
    font-weight: bold;
    background-color: #f5f5f5;
    border-top: 2px solid #333;
}

.compos-valor-extenso {
    font-style: italic;
    color: #555;
    padding-top: 5px;
}

/*Box-Content*/
.box-content{
	margin-bottom: 40px; /* Espaço entre cada bloco de cadastro */
    padding: 5px;        /* Espaçamento interno */
    border: 1px solid #ccc; /* Borda cinza clara para separar */
    border-radius: 3px;    /* Bordas arredondadas */
    background-color: #f9f9f9; /* Fundo levemente cinza */
}

.box-content h2{
	font-weight: 300;
	font-size: 23px;
}

.box-content a{
	color: black;
}

/*Imagens Diárias do Diário de Obras*/
.box-content .imagensdiarias{
	background: #f4f5ba;
	padding: 8px;
}

.box-content .imagensdiarias .titulo2 p{
	padding: 10px;
	text-align: center;
	font-weight: 600;
}

/*CSS Imput-Flat*/
.input-flat {
  border: none !important;
  box-shadow: none !important;
  background-color: transparent;
  padding-left: 0;
  font-size: 0.9rem;
  color: #212529;
}

.input-flat:focus {
	border: none !important;
	box-shadow: none !important;
	background-color: transparent;
}

/*Box-Comando*/
.box-comando{
    max-width: 1200px;
    margin: 5px auto;
    padding: 5px;
    border: 1px solid #ccc;
    border-radius: 4px;
    background-color: #f9f9f9;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
}

.box-comando h2{
    font-size: 24px;
    margin-bottom: 20px;
    color: #333;
}

.box-comando .form-group{
    display: flex;
    flex-wrap: wrap;
    margin-bottom: 5px;
}

.box-comando #insumos-container{
    display: flex;
    flex-wrap: wrap;
}

.box-comando .form-group
	.w, .w5, .w10, .w12, .w14, .w16, .w20, .w33, .w38, .w40,{
    padding: 0 3px;
    box-sizing: border-box;
}

.box-comando{
	.w { width: auto; }
	.w5 { width: 5%; }
	.w10 { width: 10%; }
	.w12 { width: 12%; }
	.w14 { width: 14%; }
	.w16 { width: 16%; }
	.w20 { width: 20%; }
	.w33 { width: 33%; }
	.w38 { width: 38%; }
	.w40 { width: 40%; }
}

.box-comando label{
    display: block;
    margin-bottom: 5px;
    font-weight: bold;
}

.box-comando #insumos-container label{
    display: block;
    margin-bottom: 5px;
    font-weight: bold;
}

.box-comando #composicoes-container .composicoes input[type="text"], select{
    width: 100%;
    padding: 8px;
    border: 1px solid #ccc;
    border-radius: 4px;
    font-size: 14px;
}

.box-comando #insumos-container .insumo-row input[type="text"], select[type="insumos"], option{
    width: 100%;
}

.box-comando input[type="submit"], #add-insumo{
    background-color: #28a745;
    color: white;
    border: none;
    padding: 10px 15px;
    margin-top: 20px;
    border-radius: 4px;
    cursor: pointer;
    font-size: 16px;
}

.box-comando input[type="submit"]:hover, #add-insumo:hover{
    background-color: #218838;
}

.box-comando #insumos-container .insumo-row .form-group label{
    margin-top: 10px;
    padding: 3px;
    border: 1px solid #ddd;
    border-radius: 4px;
    background-color: #f1f1f1;
}

.box-comando #insumos-container .insumo-row .form-group input[type="text"], select[type="insumos"]{
    margin-top: 5px;
    padding: 3px;
}

/*CSS batata*/
.batata{
	width: calc(100% - 250px);
	position: relative;
	left: 250px;
	padding: 2%;
}

.box-batata{
	background: white;
	padding: 30px;
	margin-bottom: 25px;
}

.box-batata h2{
	font-weight: 300;
	font-size: 23px;
}

.box-batata a{
	color:black;
}

.box-batata form{
	margin:30px 0;
}

.box-batata form label{
	font-size: 17px;
	font-weight: 300;
	color: black;
	display: block;
}

.box-batata .form-group{
	margin: 15px 0;
}

.box-batata .form-group option{
	background: yellow;
}

.box-batata form input[type=text],
.box-batata form input[type=password],
.box-batata form input[type=number]
{
	margin-top:8px;
	font-size: 16px;
	font-weight: normal;
	color: black;
	width: 100%;
	height: 40px;
	border: 1px solid #ccc;
	padding-left: 8px;
}

.box-batata form textarea{
	margin-top:8px;
	font-size: 16px;
	font-weight: normal;
	color: black;
	width: 100%;
	height: 150px;
	border: 1px solid #ccc;
	padding: 8px;
	resize: vertical;
}

.box-batata form select{
	margin-top:8px;
	font-size: 16px;
	font-weight: normal;
	color: black;
	width: 100%;
	height: 40px;
	border: 1px solid #ccc;
	padding-left: 8px;
}

.box-batata form input[type=file]{
	margin-top:8px;
	width: 100%;
	padding: 8px;
	border: 1px solid #ccc;
}

.box-batata form input[type=submit]{
	width: auto;
	height: 40px;
	padding:3px 8px;
	cursor: pointer;
	margin-top: 10px;
	font-size: 16px;
	background: #00bfa5;
	color: white;
	border: 0;
}

/*Imagens Diárias do Diário de Obras*/
.box-content .imagensdiarias{
	background: #f4f5ba;
	padding: 8px;
}

.box-content .imagensdiarias .titulo2 p{
	padding: 10px;
	text-align: center;
	font-weight: 600;
}

/*Cabeçalho*/
.box-content .box-comentario{
	background: #edf5f1;
	border: 1px dashed #ccc;
	height: 100%;
	padding-bottom: 30px;
	margin-bottom: 50px;
}

.box-comentario {
    margin-bottom: 30px; /* Espaço de 30px entre cada cadastro */
    padding: 20px;       /* Espaço interno para o conteúdo respirar */
    background: #ffffff; /* Fundo branco (opcional, para separar visualmente) */
    border-radius: 10px; /* Bordas arredondadas (opcional) */
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1); /* Sombra leve (opcional) */
}

.box-content .box-comentario .cabecalho{
	padding: 0;
	margin: 0;
	width: 100%;
	height: 160px;
	display: flex;
	justify-content: space-between;
	font-family: "Open Sans";
}

.box-content .box-comentario .cabecalho p{
	font-family: "Open Sans";
	font-size: 14px;
	flex: 1;
}

.box-content .box-comentario .titulo3 p{
	padding: 20px 0 20px 0;
	margin: 0;
	text-align: center;
	font-weight: 400;
}

.box-content .box-comentario .diario img{
	height: 260px;
	background: #f7f3f2;
	border: 1px dashed #ccc;
}

.box-content .box-comentario .diario{
	height: 260px;
	background: #f7f3f2;
	border: 1px dashed #ccc;
	display: flex;
}

.box-content .box-comentario .diario p{
	font-family: "Open Sans";
	font-size: 15px;
	padding: 10px 10px 10px 20px;
}

.box-content .box-comentario .equipamentos{
	height: 160px;
	background: #f7f3f2;
	border: 1px dashed #ccc;
	display: flex;
}

.box-content .box-comentario .equipamentos p{
	font-family: "Open Sans";
	font-size: 15px;
	padding: 10px;
}

.box-content .box-comentario .assinaturas{
	margin-top: 70px;
	display: flex;
	text-align: center;
}

.box-content .box-comentario .assinaturas p{
	text-decoration: overline;
	display: inline-block;
	justify-content: space-between;
	justify-items: center;
	padding: 0 30px;
	flex: 1;
}

/*CSS do Diário de Obras*/
.diario-box-content {
    padding: 10px;
    background-color: #f7faf9;
    border-radius: 8px;
}

.diario-box-content h2 {
    font-size: 24px;
    margin-bottom: 20px;
    color: #333;
}

.diario-busca {
    margin-bottom: 30px;
}

.diario-busca h4 {
    font-size: 18px;
    margin-bottom: 10px;
}

.diario-busca input[type="text"] {
    padding: 8px;
    font-size: 15px;
    width: 300px;
    margin-right: 10px;
}

.diario-busca input[type="submit"] {
    padding: 8px 15px;
    font-size: 15px;
    background-color: #007bff;
    color: white;
    border: none;
    cursor: pointer;
    border-radius: 4px;
}

.diario-boxes {
    display: flex;
    flex-direction: column;
    gap: 20px;
}

.diario-box-comentario {
    border: 1px solid #ccc;
    border-radius: 6px;
    padding: 10px;
    background-color: white;
}

.diario-section {
    margin-bottom: 20px;
}

.diario-section p.titulo {
    font-size: 18px;
    font-weight: bold;
    background: #fcf5fc;
    padding: 10px;
    border-radius: 4px;
    margin-bottom: 10px;
}

.diario-form-group {
    display: flex;
    flex-wrap: nowrap;
    gap: 10px;
    margin-bottom: 15px;
}

.diario-form-group > div {
    flex-grow: 1;
}

.diario-form-group p {
    margin: 0;
    font-weight: 600;
}

.diario-form-group b {
    display: block;
    margin-top: 5px;
    color: #555;
}

/* Estilização da Imagem */
.diario-img-obra {
	width: 500px;
	height: auto;
	margin-top: 30px;
	border-radius: 10px;
	display: block;
	margin-left: auto;
	margin-right: auto;
}

/* Container da Imagem */
.diario-imagem-container {
	width: 100%;
	float: left;
	padding-top: 16px;
}

/* Botões - container */
.diario-botoes {
	display: flex;
	justify-content: center;
	gap: 40px;
	margin-top: 20px;
	padding-top: 30px;
}

/* Imagem Externa */
#titulo-imagem {
    font-size: 18px;
    margin-bottom: 10px;
    font-weight: bold;
    color: #333;
}

/* INÍCIO CSS DAS CLASSES DIÁRIO */
.diario-img-externa {
    margin-bottom: 20px;
    text-align: center;
}

.diario-img-size {
    max-width: 500px; /* limite máximo */
    width: 100%;       /* ocupa toda a largura disponível até o limite */
    height: auto;      /* mantém proporção */
    border-radius: 8px;
    box-shadow: 0 0 10px rgba(0,0,0,0.1);
}

/* Estilo base dos botões */
.diario-btn {
	padding: 10px 20px;
	border-radius: 8px;
	color: white;
	text-decoration: none;
	font-weight: bold;
	transition: 0.3s ease;
}

/* Botão Excluir */
.diario-btn.excluir {
	background-color: #e74c3c;
}

/* Botão Editar */
.diario-btn.editar {
	background-color: #3498db;
}

/* Botão Voltar */
.diario-btn.voltar {
	background-color: #be6df7;
}

/* Larguras customizadas */
.diario-w10 { flex: 0 0 10%; }
.diario-w12 { flex: 0 0 12%; }
.diario-w14 { flex: 0 0 14%; }
.diario-w16 { flex: 0 0 16%; }
.diario-w18 { flex: 0 0 18%; }
.diario-w20 { flex: 0 0 20%; }
.diario-w23 { flex: 0 0 23%; }
.diario-w24 { flex: 0 0 24%; }
.diario-w25 { flex: 0 0 25%; }
.diario-w30 { flex: 0 0 30%; }
.diario-w33 { flex: 0 0 33%; }
.diario-w36 { flex: 0 0 36%; }
.diario-w40 { flex: 0 0 40%; }
.diario-w58 { flex: 0 0 58%; }
.diario-w60 { flex: 0 0 60%; }
.diario-w66 { flex: 0 0 66%; }
.diario-w70 { flex: 0 0 70%; }
.diario-w75 { flex: 0 0 75%; }
.diario-w78 { flex: 0 0 78%; }
.diario-w80 { flex: 0 0 80%; }
.diario-w84 { flex: 0 0 84%; }
.diario-w98 { flex: 0 0 98%; }
.diario-w100 { flex: 0 0 100%; }

.diario-form-group{
	margin: 15px 0;
}

.diario-form-group option{
	background: #f2f2f0;
}

.diario-form-group select{
	margin-top:8px;
	font-size: 16px;
	font-weight: normal;
	color: black;
	width: 100%;
	height: 40px;
	border: 1px solid #ccc;
	padding-left: 8px;
}

.diario-form-group input[type=submit]{
	width: auto;
	height: 40px;
	padding: 3px 8px;
	cursor: pointer;
	margin-top: 10px;
	font-size: 16px;
	background: #00bfa5;
	color: white;
	border: 0;
}

.diario-table{
	overflow-x: auto;
}

.diario-table{
	min-width: 900px;
	border-collapse: collapse;
}

.diario-table tr:nth-of-type(1){
	font-weight: 300;
	font-size: 14px;
	text-align: left;
}

.diario-table tr, td{
	border: none;
	text-align: center;
	text-align: left;
}

.diario-table a{
	font-size: 14px;
}

.diario-table a.btn{
	font-weight: normal;
	font-size: 14px;
	text-decoration: none;
}

.dirio-input-coef {
    width: 80px;
    text-align: right;
}

/* Resultado de busca */
.diario-busca-result {
    background-color: #e7f3fe;
    padding: 10px;
    border-left: 5px solid #2196F3;
    margin-bottom: 20px;
}

.select-resultado {
    padding: 6px;
    border-radius: 5px;
    border: 1px solid #ccc;
    font-size: 14px;
    transition: background-color 0.3s ease;
}

.resultado-aprovado {
    background-color: #d4edda; /* verde claro */
}

.resultado-reprovado {
    background-color: #f8d7da; /* vermelho claro */
}

.resultado-reinspecao {
    background-color: #fff3cd; /* amarelo claro */
}

.resultado-pendente {
    background-color: #e2e3e5; /* cinza claro */
}

/*CSS do Campo código do cadastro de Insumos*/
.input-readonly {
    background-color: #f0f0f0; /* Cinza claro */
    border: 1px solid #ccc; /* Borda padrão */
    color: #555; /* Cor do texto */
    cursor: not-allowed; /* Cursor indicando que não pode ser editado */
}

/*CSS das Obras em Andamento*/
.obrasand{
	border: 1px solid #ccc;
	width: 100%;
	padding: 10px;
	margin: auto;
}

.obrasand img{
	background: black;
	width: 400px;
	height: 250px;
	float: left;
	margin-right: 20px;
}

.obrasand a{
	color: black;
	font-size: 21px;
	text-decoration: underline;
	font-weight: bold;
}

.obrasand p{
	color: black;
	margin-top: 10px;
	font-size: 19px;
	font-weight: lighter;
}

/*CSS dos Serviços*/
section.servicos h2.title{
	font-family: 'Verdana';
	font-size: 35px;
	text-align: center;
	font-weight: 900;
	padding-bottom: 20px;
	color: #000;
}

section.servicos .botao{
	background: green;
	margin-left: 2%;
	text-align: center;
	color: white;
	padding: 10px 20px;
} 

.box-servico{
	margin: 5px 0;
	padding: 10px 10px;
	text-align: center;
	overflow-x: hidden;
}

.box-servico img{
	overflow-x: hidden;
}

.box-imgk img.imgk-servico{
	width: 300px;
	height: 240px;
	display: block;
	margin: 8px auto;
	margin-top: 40px;
}

.box-servico h3{
	font-family: 'Merriweather Sans', sans-serif;
	font-weight: 300;
	font-size: 20px;
	color: #000;
}

.box-servico h4{
	font-family: 'Open Sans', sans-serif;
	font-weight: 150;
	color: #000;
	font-size: 18px;
	text-align: justify;
	margin-bottom: 10px;
}

.box-servico p{
	font-family: 'Arial';
	color: black;
	font-size: 16px;
	margin-top: 6px;
	text-align: left;
}	

/*Tabelas*/
.wraper-table{
	overflow-x: auto;
}

/**CSS Apresentação das Obras**/
.box-content .box-obraone{
	width: 100%;
    display: flex;
    justify-content: space-around;
    align-items: center;
    padding: 10px;
}

.box-content .box-obraone .box-imgw{
	display: flex;
	justify-content: center;
	align-items: center;
	flex: 1;
}

.box-content .box-obraone .box-imgw img{
	padding-top: 5px;
    padding-bottom: 20px;
    width: 320px;
    height: 240px;
    margin: auto;
}

.box-content .box-obraone .box-p{
	flex: 1;
	display: block;
	justify-content: flex-start;
	padding-left: 20%;
}

.box-content .box-obraone .box-p p{
	margin: 0;
    padding: 3px;
    font-size: 15px;
}

.box-content .box-redacao{
	padding-top: 40px;
	font-size: bold;
}

.box-content .box-redacao .texto p{
	font-size: 22px;
	margin: 0;
	padding-top: 20px;
	font-weight: bold;
	text-align: left;
}

.box-content .box-redacao .box-linhas{
	font-size: 16px;
}

.box-content .box-redacao .box-linhas:nth-of-type(2){
	text-align: justify;
}

.box-content .box-intervenientes{
	padding-top: 30px;
	font-size: bold;
}

.box-content .box-intervenientes .box-inter{
	padding-left: 200px;
}

.box-content .box-intervenientes .texto p{
	font-size: 22px;
	margin: 0;
	padding-top: 20px;
	font-weight: bold;
	text-align: left;
}

/**CSS da Página da Qualidade**/
section.container-qualidade{
	margin: 25px 0;
	padding: 0;
}

section.container-qualidade .titulo-obra{
	height: 60px;
	display: flex;
	justify-content: space-between;
	align-items: center;
	padding: 10px;
	background: #e1f7cb;
	border: 1px solid #ccc;
}

section.container-qualidade .titulo-obra .logo img{
	padding-top: 5px;
	max-width: 70%;
	height: auto;
}

section.container-qualidade .titulo-obra .texto p{
	margin: 0;
	padding: 0;
	font-size: 25px;
	font-weight: bold;
}

section.container-qualidade .cabecalho .center p{
	font-size: 28px;
	padding-top: 25px;
	font-weight: bold;
	text-align: center;
}

section.container-qualidade .cabecalho .left p{
	text-align: left;
	font-size: 15px;
	padding-bottom: 3px;
	padding-left: 8px;
}

section.container-qualidade .cabecalho .right p{
	text-align: left;
	font-size: 15px;
	padding-bottom: 5px;
	padding-left: 20px;
}

section.container-qualidade .resumo-obra .texto p{
	font-size: 22px;
	margin: 0;
	padding-top: 30px;
	font-weight: bold;
	text-align: center;
}

section.container-qualidade .resumo-obra .box-obraone{
	width: 100%;
    display: block;
    justify-content: space-around;
    align-items: center;
}

section.container-qualidade .resumo-obra .box-obraone center{
	color: black;
	text-align: left;
	font-size: 14px;
	padding-bottom: 6px;
}

section.container-qualidade .resumo-obra .box-obraone .box-imgw{
	display: flex;
	justify-content: center;
	align-items: center;
	flex: 1;
}

section.container-qualidade .resumo-obra .box-obraone .box-imgw img{
	padding-top: 5px;
    padding-bottom: 20px;
    width: 320px;
    height: 240px;
    margin: auto;
}

section.container-qualidade .resumo-obra .box-obraone .box-p{
	flex: 1;
	display: block;
	justify-content: flex-start;
}

section.container-qualidade .box-obraone .box-p p{
	margin: 0;
    padding: 3px;
    font-size: 14px;
}

/*Tabelas*/
.wraper-table{
	overflow-x: auto;
}

table{
	min-width: 900px;
	border-collapse: collapse;
	font-weight: 300;
	margin: 20px 0;
	width: 100%;
}

table tr:nth-of-type(1){
	font-weight: 300;
	font-size: 14px;
	text-align: left;
	background: #0091ea;
	color: white;
	border-bottom: 1px solid #ccc;
}

table tr, td{
	border: none;
	text-align: center;
	text-align: left;
}

table a{
	font-size: 14px;
}

table td{
	padding: 8px;
}

table a.btn{
	font-weight: normal;
	font-size: 14px;
	text-decoration: none;
	color: white;
	padding: 4px 6px;
}

/*CSS do Organograma*/
.box-content .box-organograma{
	padding-top: 30px;
	margin: 0;
	width: 100%;
	height: 100%;
}

.box-content .box-organograma .box-imgx img{
	padding-top: 50px;
	display: block;
	margin-left: auto;
    margin-right: auto;
    scale: 1.1;
}

/*CSS do Equipamentos*/
.box-content .box-equipamentos{
	padding-top: 30px;
	margin: 0;
	width: 100%;
	height: 100%;
}

.box-content .box-equipamentos .box-imgy img{
	padding-top: 50px;
	display: block;
	margin-left: auto;
    margin-right: auto;
    scale: 1.1;
}

/*CSS Ficha de Verificação de Serviços*/
.container-fichas {
  background: #fff;
  padding: 5px;
  border-radius: 6px;
  max-width: 1200px;
  margin: auto;
  box-shadow: 0 0 10px rgba(0,0,0,0.1);
}

.container-fichas h1 {
  text-align: center;
  margin-bottom: 30px;
}

.container-fichas form fieldset {
  border: 1px solid #ccc;
  margin-bottom: 20px;
  padding: 15px;
  border-radius: 8px;
}

.container-fichas form label {
  display: block;
  margin-bottom: 10px;
}

.container-fichas input[type="text"],
.container-fichas input[type="date"],
.container-fichas textarea,
.container-fichas select {
  width: 100%;
  padding: 8px;
  margin-top: 5px;
  box-sizing: border-box;
  border: 1px solid #aaa;
  border-radius: 4px;
}

.container-fichas table {
  width: 100%;
  border-collapse: collapse;
  margin-top: 15px;
}

.container-fichas table, th, td {
  border: 1px solid #ccc;
}

.container-fichas th, td {
  padding: 10px;
  text-align: left;
}

.container-fichas button {
  background-color: #4CAF50;
  color: white;
  padding: 12px 20px;
  border: none;
  border-radius: 6px;
  cursor: pointer;
  font-size: 16px;
}

.container-fichas button:hover {
  background-color: #45a049;
}

/*CSS do Campo código do cadastro de Insumos*/
.input-readonly {
    background-color: #f0f0f0; /* Cinza claro */
    border: 1px solid #ccc; /* Borda padrão */
    color: #555; /* Cor do texto */
    cursor: not-allowed; /* Cursor indicando que não pode ser editado */
}

/*CSS Tabelas transparentes*/
.tabela-problemas {
    width: 100%;
    border-collapse: collapse;
    font-family: Arial, sans-serif;
    background-color: #fff;           /* força fundo branco da tabela */
    color: #000;                      /* força texto preto */
}

.tabela-problemas th,
.tabela-problemas td {
    background-color: #fff !important; /* zera fundo das células */
    color: #000 !important;            /* texto sempre preto */
    padding: 8px;
    vertical-align: top;
    font-weight: normal;
}

.tabela-problemas th {
    font-weight: bold;
    text-align: left;
}

.tabela-problemas textarea {
    width: 100%;
    height: 60px;
    resize: vertical;
    background-color: #fff !important;
    color: #000 !important;
    font-family: inherit;
    font-size: 14px;
    padding: 4px;
    box-sizing: border-box;
}

/* 🔷 Estilo exclusivo para FVS 🔷 */
.fvs-box {
    background-color: white;
    border: 2px solid #ccc;
    border-radius: 8px;
    padding: 20px;
    margin-bottom: 40px;
    box-shadow: 0 2px 8px rgba(0,0,0,0.1);
}

.fvs-title {
    font-weight: 700;
    text-align: center;
    font-size: 22px;
    margin-bottom: 20px;
    color: #333;
}

.fvs-table {
    width: 100%;
    border-collapse: collapse;
    margin-top: 10px;
}

.fvs-table th,
.fvs-table td {
    border: 1px solid #ccc;
    padding: 8px 12px;
    text-align: left;
    font-size: 14px;
}

.fvs-table th {
    background-color: #f2f2f2;
    color: #333;
}

.fvs-header-table {
    margin-bottom: 10px;
}

.fvs-header-table td {
    padding: 6px 10px;
    font-size: 14px;
}

.fvs-header-table td b {
    color: #222;
}

.fvs-item-row:hover {
    background-color: #f9f9f9;
}

.clicavel {
    cursor: pointer;
    color: blue;
}

.clicavel:hover {
    text-decoration: underline;
}

.box-content {
    border: 1px solid #ccc;
    padding: 10px;
    margin-bottom: 15px;
    border-radius: 8px;
    background-color: #f9f9f9;
}

.fvs-table {
    width: 100%;
    border-collapse: collapse;
}

.fvs-table th, .fvs-table td {
    border: 1px solid #ccc;
    padding: 5px;
}

.fvs-title {
    text-align: center;
    margin-bottom: 10px;
}

.fvs-header-table td {
    border: none;
}

/*Box-Comando*/
.box-curio{
	width: 100%;
	position: relative;
}

.box-curio{
	background: white;
	padding: 30px;
	margin-bottom: 25px;
}

.box-curio h2{
	font-weight: 300;
	font-size: 23px;
}

.box-curio a{
	color: black;
	font-weight: normal;
}

.box-curio .light-font td,a{
    font-weight: 300;
}

.box-curio table{
	width: 100%;
	margin-bottom: 5px;
}

.box-curio table tr:nth-of-type(1){
	background: #474b4f;
}

.box-curio table tr,td,a:nth-of-type(1){
	font-size: 16px;
	padding: 5px 5px;
}

.box-curio .custom-table{
	width: 100%;
	margin: 0;
}

.box-curio .custom-table td{
	background: white;
	text-align: left;
	.w10 { width: 10%; }
	.w12 { width: 12%; }
	.w16 { width: 16%; }
	.w50 { width: 50%; }
}

a.btn{
	font-weight: normal;
	font-size: 13px;
	color: white;
	text-decoration: none;
	padding: 4px 6px;
}

a.btn.edit{background: #F4B03E;}
a.btn.delete{background: #E05C4E;}
a.btn.order{background: #0091ea;}

/*Paginacao*/
.paginacao{
	margin:20px 0;
	text-align: center;
}

.paginacao a{
	font-size: 14px;
	margin: 0 8px;
	display: inline-block;
	padding: 3px 4px;
	border: 1px solid #ccc;
	text-decoration: none;
	color: #666;
}

.paginacao a.page-selected{
	background: rgb(220,220,220);
}

/*Box Metricas*/
.box-metricas{
	margin-top: 16px;
	padding: 0 15px;
}

.box-metrica-single{
	float: left;
	position: relative;
	width: 33.3%;
	background: #F4B03E;
	border: 5px solid white;
}

.box-metricas .box-metrica-single:nth-of-type(2){
	background: #E05C4E;
}

.box-metricas .box-metrica-single:nth-of-type(3){
	background: #0091ea;
}

.box-metrica-wraper{
	padding: 10px 20px;
	text-align: left;
	color: white;
}

.box-metrica-wraper h2{
	font-size: 28px;
}

.box-metrica-wraper p{
	padding: 10px 0;
	font-size: 26px;
}

/*Tabela Responsiva*/
.table-responsive{
	margin: 20px auto;
	font-weight: 300;
}

.table-responsive .row:nth-of-type(1){
	font-weight: normal;
	background: #00bfa5;
	padding: 10px;
	color: white;
}

.table-responsive .row{
	color: #777;
	padding: 8px;
	border-bottom: 1px solid #ccc;
}

.col{
	float: left;
	width: 50%;
}

/*Formulários de contato do box-content*/
.box-content form{
	margin: 30px 0;
}

.box-content form label{
	font-size: 17px;
	font-weight: 300;
	color: black;
	display: block;
}

.box-content .form-group{
	margin: 15px 0;
}

.box-content form input[type=text],
.box-content form input[type=password],
.box-content form input[type=number]
{
	margin-top:8px;
	font-size: 16px;
	font-weight: normal;
	color: black;
	width: 100%;
	height: 40px;
	border: 1px solid #ccc;
	padding-left: 8px;
}

.box-content form textarea{
	margin-top: 8px;
	font-size: 16px;
	font-weight: normal;
	color: black;
	width: 100%;
	height: 150px;
	border: 1px solid #ccc;
	padding: 8px;
	resize: vertical;
}

.box-content form select{
	margin-top: 8px;
	font-size: 16px;
	font-weight: normal;
	color: black;
	width: 100%;
	height: 40px;
	border: 1px solid #ccc;
	padding-left: 8px;
}

.box-content form input[type=file]{
	margin-top: 8px;
	width: 100%;
	padding: 8px;
	border: 1px solid #ccc;
}

.box-content form input[type=submit]{
	width: auto;
	height: 40px;
	padding: 6px 10px;
	cursor: pointer;
	margin-top: 10px;
	font-size: 16px;
	background: #00bfa5;
	color: white;
	border: 0;
	border-radius: 8px;
}

/*Box de alerta!*/
.box-alert{
	width: 100%;
	padding: 8px 0;
	text-align: center;
	margin-bottom: 8px;
}

.box-alert a{
	color: white;
	font-weight: bold;
}

.sucesso{
	background: #a5d6a7;
	color: white;
}

.erro{
	background: #F75353;
	color: white;
}

.atencao{
	background: #f4a742;
	color: white;
}

.alerta {
    padding: 10px 20px;
    margin: 15px 0;
    border-radius: 4px;
    font-weight: bold;
}

.alerta.sucesso {
	padding: 10px 20px;
	margin: 15px 0;
    background-color: #d4edda;
    color: #155724;
}

.alerta.erro {
    background-color: #f8d7da;
    color: #721c24;
}

/*Menu selecionado*/
.menu-active{
	background: #1721d4;
}

.menu-active::before{
	/*
		Adicionar Seta para qd estiver selecionado.
	*/
}

.form-group-login label{
	font-size: 13px;
	padding-right: 6px;
	font-weight: 300;
	color: black;
}

form .form-group-login:nth-of-type(2){
	position: relative;
	top: 10px;
}

.boxes{
	display: flex;
	flex-wrap: wrap;
}

.box-single-wraper{
	width: 33.3%;
	padding: 20px;
}

.box-obraone{
	width: 100%;
	padding: 20px;
}

.box-obraone p{
	padding: 0;
}

.box-single{
	overflow-x: auto;
	width: 100%;
	height: 100%;
	border: 1px solid #ccc;
}

.box-imgs img{
	width: 100%;
}

.box-imgs img.img-square{
	width: 200px;
	height: 200px;
	display: block;
	margin: 8px auto;
}

.box-imgs{
	text-align: center;
}

.box-imgo{
	text-align: center;
	width: 300px;
	height: 200px;
}

.box-imgs h1{
	color: #ccc;
	font-size: 70px;
	margin: 10px 0;
}

.box-imgd img{
	width: 100%;
}

.box-imgd img.img-diario{
	max-width: 330px;
	height: 280px;
	display: block;
	margin-top: 20px;
}

.box-imgd{
	text-align: left;
}

.box-imgd h1{
	color: #ccc;
	font-size: 70px;
	margin: 10px 0;
}

.box-descricao_servico p{
	color: black;
	font-size: 20px;
	margin-top: 20px;
}

.topo-box{
	text-align: center;
	color: #ccc;
	padding: 8px 0;
	border-bottom: 1px solid #ccc;
}

.topo-box img{
	display: block;
	max-width: 150px;
	margin: 0 auto;
}

.topo-box h2{
	font-size: 36px;
}

.body-box{
	padding: 10px;
}

.body-box p{
	color: #646464;
	font-size: 15px;
	margin-bottom: 8px;
}

.group-btn{margin-top: 15px;}

.group-btn a{
	display: inline-block;
	text-decoration: none;
	color: white;
	padding: 3px 8px;
}

.busca{
	margin: 10px 0;
	width: 100%;
	padding: 8px 10px;
}

.busca form{
	margin: 0;
}

.busca h4{
	font-weight: lighter;
	font-size: 23px;
	color: #646464;
}

.busca-result{
	color: #646464;
	border-top: 3px solid #ccc;
}

.busca-result p{
	font-size: 16px;
}

.row1{
	float: left;
	width: 30%;
	padding: 8px 10px;
}

.row1 img{
	width: 100%;
}

.row2{
	float: left;
	width: 70%;
	padding: 8px 10px;
}

.row2 p{
	padding: 8px 0;
	color: #646464;
	border-bottom: 1px solid #ccc;
}

.box-content h1{
	font-size: 22px;
}

.box-content h2{
	font-size: 18px;
}

@media screen and (max-width: 1024px){
	.box-single-wraper{
		width: 100%;
		min-height: 0;
	}

	.box-metrica-single{
		width: 100%;
	}

	.form-group {
	    flex-direction: column;
	    width: 100%;
	}

	/* Grupos de formulários */
	.form-group {
	  display: flex;
	  flex-wrap: wrap;
	  gap: 15px;
	  margin-bottom: 20px;
	  width: 100%;
	}

	/* Estilo geral */
	.box-content {
	  padding: 20px;
	  background-color: #fff;
	  max-width: 1200px;
	  margin: auto;
	}

	form input[type="text"],
	form input[type="number"],
	form input[type="date"],
	form select,
	form textarea {
	  width: 100%;
	  padding: 8px;
	  font-size: 16px;
	  margin-top: 5px;
	  border: 1px solid #ccc;
	  border-radius: 4px;
	}

	.w14 { flex: 0 0 100%; }
	.w16 { flex: 0 0 100%; }
	.w20 { flex: 0 0 100%; }
	.w25 { flex: 0 0 100%; }
	.w33 { flex: 0 0 100%; }
	.w50 { flex: 0 0 100%; }
	.w70 { flex: 0 0 100%; }
	.w75 { flex: 0 0 100%; }
	.w80 { flex: 0 0 100%; }
	.w84 { flex: 0 0 100%; }
	.w100 { flex: 0 0 100%; }

	.w14, .w16, .w20, .w25, .w33, .w50, .w70, .w75, .w80, .w84, .w100 {
	    flex: 0 0 100%;
	}

	form input[type="text"],
	form input[type="number"],
	form input[type="date"],
	form select,
	form textarea {
	font-size: 18px;
	width: 100%;
	}

	/* Botão de submit */
	input[type="submit"] {
	  background-color: #1e88e5;
	  color: #fff;
	  padding: 10px 25px;
	  font-size: 18px;
	  border: none;
	  border-radius: 5px;
	  cursor: pointer;
	  width: 100%;
	}

	input[type="submit"]:hover {
	  background-color: #0d47a1;
	  width: 100%;
	}

	/* Alerta */
	.alerta.sucesso {
	  background-color: #d4edda;
	  padding: 10px;
	  margin-top: 20px;
	  border-left: 5px solid #28a745;
	  color: #155724;
	}

	/* Título */
	h2 {
	  font-size: 24px;
	  margin-bottom: 20px;
	}

	/* --- Imagem da Obra --- */
	.diario-img-obra {
	  max-width: 100%;
	  height: auto;
	  margin-top: 10px;
	  border: 1px solid #ccc;
	}

	.diario-box-comentario {
	  padding: 20px;
	  background-color: #f9f9f9;
	}

	.diario-section {
	  margin-bottom: 20px;
	}

	.diario-titulo {
	  font-size: 20px;
	  font-weight: 600;
	  background-color: #e6ebe8;
	  padding: 10px;
	  margin-bottom: 10px;
	}

	/* --- Grid flexível --- */
	.diario-form-group {
	  display: flex;
	  flex-wrap: wrap;
	  gap: 15px;
	  margin-bottom: 16px;
	}

	/* --- Texto e elementos --- */
	.diario-form-group p {
	  margin: 0 0 4px;
	  font-weight: 500;
	}

	.diario-form-group div {
	  font-size: 14px;
	}

	/* --- Imagem da Obra --- */
	.diario-img-obra {
	  max-width: 100%;
	  height: auto;
	  margin-top: 10px;
	  border: 1px solid #ccc;
	}

	/* --- Botões --- */
	.diario-botoes {
	  margin-top: 20px;
	  display: flex;
	  flex-wrap: wrap;
	  gap: 10px;
	}

	.diario-btn {
	  padding: 8px 16px;
	  border-radius: 4px;
	  color: white;
	  text-decoration: none;
	  display: inline-block;
	}

	.diario-btn.editar {
	  background-color: #28a745;
	}

	.diario-btn.excluir {
	  background-color: #dc3545;
	}

	.gerar-pdf a {
	  background-color: #007bff;
	  color: white;
	  padding: 6px 12px;
	  border-radius: 4px;
	  text-decoration: none;
	  display: inline-block;
	  margin-top: 8px;
	}

	.diario-form-group {
	  flex-direction: column;
	}

	.gerar-pdf {
	margin-left: 0;
	}

	.box-content h1{
		font-size: 18px;
	}

	.box-content h2{
		font-size: 16px;
	}

	section.container-qualidade{
		margin: 0;
		padding: 0;
	}

	section.container-qualidade .titulo-obra{
		width: 100%;
		height: 40px;
		display: block;
		padding: 3px;
		background: #e1f7cb;
		border: 1px solid #ccc;
	}

	section.container-qualidade .titulo-obra .logo img{
		padding-top: 0;
		max-width: 100%;
		height: auto;
	}

	section.container-qualidade .titulo-obra .texto p{
		margin: 0;
		text-align: right;
		max-width: 100%;
		font-size: 12px;
		font-weight: bold;
	}

	section.container-qualidade .cabecalho .center p{
		font-size: 15px;
		padding-top: 35px;
		font-weight: bold;
		text-align: center;
	}

	section.container-qualidade .cabecalho .left p{
		text-align: left;
		font-size: 13px;
		padding-bottom: 3px;
		padding-left: 5px;
	}

	section.container-qualidade .cabecalho .right p{
		text-align: left;
		font-size: 13px;
		padding-bottom: 3px;
		padding-left: 5px;
	}

	section.container-qualidade .resumo-obra .texto p{
		font-size: 15px;
		margin: 0;
		padding-top: 14px;
		font-weight: bold;
		text-align: center;
	}

	section.container-qualidade .resumo-obra .box-obraone{
		width: 100%;
	    display: block;
	    justify-content: space-around;
	    align-items: center;
	}

	section.container-qualidade .resumo-obra .box-obraone center{
		color: black;
		text-align: left;
		font-size: 13px;
		padding-bottom: 4px;
	}

	section.container-qualidade .resumo-obra .box-obraone .box-imgw{
		display: flex;
		justify-content: center;
		align-items: center;
		flex: 1;
	}

	section.container-qualidade .resumo-obra .box-obraone .box-imgw img{
		padding-top: 5px;
	    padding-bottom: 20px;
	    width: 320px;
	    height: 240px;
	    margin: auto;
	}

	section.container-qualidade .resumo-obra .box-obraone .box-p{
		flex: 1;
		display: block;
		justify-content: flex-start;
	}

	section.container-qualidade .box-obraone .box-p p{
		margin: 0;
	    padding: 0;
	    font-size: 13px;
	}

	.box-content .box-obraone{
		width: 100%;
	    display: flex;
	    justify-content: space-around;
	    align-items: center;
	    padding: 0;
	}

	.box-content .box-obraone .box-imgw{
		display: flex;
		justify-content: center;
		align-items: center;
		flex: 1;
	}

	.box-content .box-obraone .box-imgw img{
		padding-top: 5px;
	    padding-bottom: 10px;
	    width: 320px;
	    height: 240px;
	    margin: auto;
	}

	.box-content .box-obraone .box-p{
		flex: 1;
		display: block;
		justify-content: flex-start;
		padding-left: 0;
	}

	.box-content .box-obraone .box-p p{
		margin: 0;
	    padding: 3px;
	    font-size: 13px;
	}

	.box-content .box-redacao{
		padding-top: 14px;
		font-size: bold;
	}

	.box-content .box-redacao .texto p{
		font-size: 13px;
		margin: 0;
		padding-top: 10px;
		font-weight: bold;
		text-align: left;
	}

	.box-content .box-redacao .box-linhas{
		font-size: 13px;
	}

	.box-content .box-redacao .box-linhas:nth-of-type(2){
		text-align: justify;
	}

	.box-content .box-intervenientes{
		padding-top: 5px;
		font-size: bold;
	}

	.box-content .box-intervenientes .box-inter{
		padding-left: 0;
	}

	.box-content .box-intervenientes .texto p{
		font-size: 13px;
		margin: 0;
		padding-top: 10px;
		font-weight: bold;
		text-align: left;
	}

	.box-content .box-organograma{
		padding-top: 10px;
		margin: 0;
		width: 100%;
		height: 100%;
		border: none;
	}

	.box-content .box-organograma .box-imgx img{
		width: auto;
        zoom: 1; 
        max-width: 90%;
        display: inline-block;
        align-items: center;
	}

	/*CSS do Equipamentos*/
	.box-content .box-equipamentos{
		padding-top: 30px;
		margin: 0;
		width: 100%;
		height: 100%;
	}

	.box-content .box-equipamentos .box-imgy img{
		padding-top: 10px;
		display: block;
		margin-left: auto;
	    margin-right: auto;
	    scale: 1;
	}

	.box-single-wraper{
		width: 100%;
		min-height: 0;
	}

	.box-metrica-single{
		width: 100%;
	}

	.form-group {
	    flex-direction: column;
	    width: 100%;
	}

	/* Grupos de formulários */
	.form-group {
	  display: flex;
	  flex-wrap: wrap;
	  gap: 15px;
	  margin-bottom: 20px;
	  width: 100%;
	}

	/* Estilo geral */
	.box-content {
	  padding: 20px;
	  background-color: #fff;
	  max-width: 1200px;
	  margin: auto;
	}

	form input[type="text"],
	form input[type="number"],
	form input[type="date"],
	form select,
	form textarea {
	  width: 100%;
	  padding: 8px;
	  font-size: 16px;
	  margin-top: 5px;
	  border: 1px solid #ccc;
	  border-radius: 4px;
	}

	.w14 { flex: 0 0 100%; }
	.w16 { flex: 0 0 100%; }
	.w20 { flex: 0 0 100%; }
	.w25 { flex: 0 0 100%; }
	.w33 { flex: 0 0 100%; }
	.w50 { flex: 0 0 100%; }
	.w70 { flex: 0 0 100%; }
	.w75 { flex: 0 0 100%; }
	.w80 { flex: 0 0 100%; }
	.w84 { flex: 0 0 100%; }
	.w100 { flex: 0 0 100%; }

	.w14, .w16, .w20, .w25, .w33, .w50, .w70, .w75, .w80, .w84, .w100 {
	    flex: 0 0 100%;
	}

	form input[type="text"],
	form input[type="number"],
	form input[type="date"],
	form select,
	form textarea {
	font-size: 18px;
	width: 100%;
	}

	/* Botão de submit */
	input[type="submit"] {
	  background-color: #1e88e5;
	  color: #fff;
	  padding: 10px 25px;
	  font-size: 18px;
	  border: none;
	  border-radius: 5px;
	  cursor: pointer;
	  width: 100%;
	}

	input[type="submit"]:hover {
	  background-color: #0d47a1;
	  width: 100%;
	}

	/* Alerta */
	.alerta.sucesso {
	  background-color: #d4edda;
	  padding: 10px;
	  margin-top: 20px;
	  border-left: 5px solid #28a745;
	  color: #155724;
	}

	/* --- Imagem da Obra --- */
	.diario-img-obra {
	  max-width: 100%;
	  height: auto;
	  margin-top: 10px;
	  border: 1px solid #ccc;
	}

	.diario-box-comentario {
	  padding: 20px;
	  background-color: #f9f9f9;
	}

	.diario-section {
	  margin-bottom: 20px;
	}

	.diario-titulo {
	  font-size: 20px;
	  font-weight: 600;
	  background-color: #e6ebe8;
	  padding: 10px;
	  margin-bottom: 10px;
	}

	/* --- Grid flexível --- */
	.diario-form-group {
	  display: flex;
	  flex-wrap: wrap;
	  gap: 15px;
	  margin-bottom: 16px;
	}

	/* --- Texto e elementos --- */
	.diario-form-group p {
	  margin: 0 0 4px;
	  font-weight: 500;
	}

	.diario-form-group div {
	  font-size: 14px;
	}

	/* --- Imagem da Obra --- */
	.diario-img-obra {
	  max-width: 100%;
	  height: auto;
	  margin-top: 10px;
	  border: 1px solid #ccc;
	}

	/* --- Botões --- */
	.diario-botoes {
	  margin-top: 20px;
	  display: flex;
	  flex-wrap: wrap;
	  gap: 10px;
	}

	.diario-btn {
	  padding: 8px 16px;
	  border-radius: 4px;
	  color: white;
	  text-decoration: none;
	  display: inline-block;
	}

	.diario-btn.editar {
	  background-color: #28a745;
	}

	.diario-btn.excluir {
	  background-color: #dc3545;
	}

	.gerar-pdf a {
	  background-color: #007bff;
	  color: white;
	  padding: 6px 12px;
	  border-radius: 4px;
	  text-decoration: none;
	  display: inline-block;
	  margin-top: 8px;
	}

	.diario-form-group {
	  flex-direction: column;
	}

	.gerar-pdf {
	margin-left: 0;
	}

	.box-content h1{
		font-size: 24px;
	}

	.box-content h2{
		font-size: 22px;
	}

	.fvs-table {
        width: auto;
        zoom: 0.65; 
        max-width: 100%;
        display: inline-block;
    }

    .fvs-table.fvs-header-table {
        width: auto;
        zoom: 1; 
        max-width: 100%;
        display: inline-block;
    }

    .fvs-table.fvs-header-table-obra {
    	width: auto;
        zoom: 0.6; 
        max-width: 100%;
        display: inline-block;
    }

    .imagem-fvs img {
        display: block;
        margin: 0 auto;
        max-width: 100%;
        border: 1px solid #ccc !important;
        padding: 5px !important;
    }
    
    .imagem-fvs > p {
        text-align: center;
    }
}

@media screen and (max-width: 768px){
	.row1,.row2{
		width: 100%;
	}

	.content{
		width: 100%;
		left: 0;
	}

	.batata{
		width: 100%;
		left: 0;
	}

	header{
		left: 0;
		width: 100%;
	}

	.form-group {
	    flex-direction: column;
	    width: 100%;
	}

	/* Grupos de formulários */
	.form-group {
	  display: flex;
	  flex-wrap: wrap;
	  gap: 15px;
	  margin-bottom: 20px;
	  width: 100%;
	}

	/* Estilo geral */
	.box-content {
	  padding: 20px;
	  background-color: #fff;
	  max-width: 1200px;
	  margin: auto;
	  width: 100%;
	}

	form input[type="text"],
	form input[type="number"],
	form input[type="date"],
	form select,
	form textarea {
	  width: 100%;
	  padding: 8px;
	  font-size: 16px;
	  margin-top: 5px;
	  border: 1px solid #ccc;
	  border-radius: 4px;
	}

	.w14 { flex: 0 0 100%; }
	.w16 { flex: 0 0 100%; }
	.w20 { flex: 0 0 100%; }
	.w25 { flex: 0 0 100%; }
	.w33 { flex: 0 0 100%; }
	.w50 { flex: 0 0 100%; }
	.w70 { flex: 0 0 100%; }
	.w75 { flex: 0 0 100%; }
	.w80 { flex: 0 0 100%; }
	.w84 { flex: 0 0 100%; }
	.w100 { flex: 0 0 100%; }

	.w14, .w16, .w20, .w25, .w33, .w50, .w70, .w75, .w80, .w84, .w100 {
	    flex: 0 0 100%;
	}

	form input[type="text"],
	form input[type="number"],
	form input[type="date"],
	form select,
	form textarea {
	font-size: 18px;
	width: 100%;
	}

	/* Botão de submit */
	input[type="submit"] {
	  background-color: #1e88e5;
	  color: #fff;
	  padding: 10px 25px;
	  font-size: 18px;
	  border: none;
	  border-radius: 5px;
	  cursor: pointer;
	  width: 100%;
	}

	input[type="submit"]:hover {
	  background-color: #0d47a1;
	  width: 100%;
	}

	/* Alerta */
	.alerta.sucesso {
	  background-color: #d4edda;
	  padding: 10px;
	  margin-top: 20px;
	  border-left: 5px solid #28a745;
	  color: #155724;
	}

	/* --- Imagem da Obra --- */
	.diario-img-obra {
	  max-width: 100%;
	  height: auto;
	  margin-top: 10px;
	  border: 1px solid #ccc;
	}

	.diario-box-comentario {
	  padding: 20px;
	  background-color: #f9f9f9;
	}

	.diario-section {
	  margin-bottom: 20px;
	}

	.diario-titulo {
	  font-size: 20px;
	  font-weight: 600;
	  background-color: #e6ebe8;
	  padding: 10px;
	  margin-bottom: 10px;
	}

	/* --- Grid flexível --- */
	.diario-form-group {
	  display: flex;
	  flex-wrap: wrap;
	  gap: 15px;
	  margin-bottom: 16px;
	}

	/* --- Texto e elementos --- */
	.diario-form-group p {
	  margin: 0 0 4px;
	  font-weight: 500;
	}

	.diario-form-group div {
	  font-size: 14px;
	}

	/* --- Imagem da Obra --- */
	.diario-img-obra {
	  max-width: 100%;
	  height: auto;
	  margin-top: 10px;
	  border: 1px solid #ccc;
	}

	/* --- Botões --- */
	.diario-botoes {
	  margin-top: 20px;
	  display: flex;
	  flex-wrap: wrap;
	  gap: 10px;
	}

	.diario-btn {
	  padding: 8px 16px;
	  border-radius: 4px;
	  color: white;
	  text-decoration: none;
	  display: inline-block;
	}

	.diario-btn.editar {
	  background-color: #28a745;
	}

	.diario-btn.excluir {
	  background-color: #dc3545;
	}

	.gerar-pdf a {
	  background-color: #007bff;
	  color: white;
	  padding: 6px 12px;
	  border-radius: 4px;
	  text-decoration: none;
	  display: inline-block;
	  margin-top: 8px;
	}

	.diario-form-group {
	  flex-direction: column;
	}

	.gerar-pdf {
	  margin-left: 0;
	}

	.box-content h1{
		font-size: 22px;
	}

	.box-content h2{
		font-size: 20px;
	}

	.fvs-table {
        width: auto;
        zoom: 0.40; 
        max-width: 100%;
        display: inline-block;
    }

    .fvs-table.fvs-header-table {
        width: auto;
        zoom: 0.73; 
        max-width: 100%;
        display: inline-block;
    }

    .fvs-table.fvs-header-table-obra {
    	width: auto;
        zoom: 0.40; 
        max-width: 100%;
        display: inline-block;
    }

    .imagem-fvs img {
        display: block;
        margin: 0 auto;
        max-width: 100%;
        border: 1px solid #ccc !important;
        padding: 5px !important;
    }
    
    .imagem-fvs > p {
        text-align: center;
    }
}

@media screen and (max-width: 500px){
	.box-imgs,
	.box-single{
		width: 100% !important;
	}

	.w50{
		width: 100%;
	}

	.box-single-metrica{
		width: 100%;
		padding-top: 40%;
	}

	.form-group {
	    flex-direction: column;
	    width: 100%;
	}

	/* Grupos de formulários */
	.form-group {
	  display: flex;
	  flex-wrap: wrap;
	  gap: 15px;
	  margin-bottom: 20px;
	  width: 100%;
	}

	/* Estilo geral */
	.box-content {
	  padding: 20px;
	  background-color: #fff;
	  max-width: 1200px;
	  margin: auto;
	  width: 100%;
	}

	form input[type="text"],
	form input[type="number"],
	form input[type="date"],
	form select,
	form textarea {
	  width: 100%;
	  padding: 8px;
	  font-size: 16px;
	  margin-top: 5px;
	  border: 1px solid #ccc;
	  border-radius: 4px;
	}

	.w14 { flex: 0 0 100%; }
	.w16 { flex: 0 0 100%; }
	.w20 { flex: 0 0 100%; }
	.w25 { flex: 0 0 100%; }
	.w33 { flex: 0 0 100%; }
	.w50 { flex: 0 0 100%; }
	.w70 { flex: 0 0 100%; }
	.w75 { flex: 0 0 100%; }
	.w80 { flex: 0 0 100%; }
	.w84 { flex: 0 0 100%; }
	.w100 { flex: 0 0 100%; }

	.w14, .w16, .w20, .w25, .w33, .w50, .w70, .w75, .w80, .w84, .w100 {
	    flex: 0 0 100%;
	}

	form input[type="text"],
	form input[type="number"],
	form input[type="date"],
	form select,
	form textarea {
	font-size: 18px;
	width: 100%;
	}

	/* Botão de submit */
	input[type="submit"] {
	  background-color: #1e88e5;
	  color: #fff;
	  padding: 10px 25px;
	  font-size: 18px;
	  border: none;
	  border-radius: 5px;
	  cursor: pointer;
	  width: 100%;
	}

	input[type="submit"]:hover {
	  background-color: #0d47a1;
	  width: 100%;
	}

	/* Alerta */
	.alerta.sucesso {
	  background-color: #d4edda;
	  padding: 10px;
	  margin-top: 20px;
	  border-left: 5px solid #28a745;
	  color: #155724;
	}

	/* --- Imagem da Obra --- */
	.diario-img-obra {
	  max-width: 100%;
	  height: auto;
	  margin-top: 10px;
	  border: 1px solid #ccc;
	}

	.diario-box-comentario {
	  padding: 20px;
	  background-color: #f9f9f9;
	}

	.diario-section {
	  margin-bottom: 20px;
	}

	.diario-titulo {
	  font-size: 20px;
	  font-weight: 600;
	  background-color: #e6ebe8;
	  padding: 10px;
	  margin-bottom: 10px;
	}

	/* --- Grid flexível --- */
	.diario-form-group {
	  display: flex;
	  flex-wrap: wrap;
	  gap: 15px;
	  margin-bottom: 16px;
	}

	/* --- Texto e elementos --- */
	.diario-form-group p {
	  margin: 0 0 4px;
	  font-weight: 500;
	}

	.diario-form-group div {
	  font-size: 14px;
	}

	/* --- Imagem da Obra --- */
	.diario-img-obra {
	  max-width: 100%;
	  height: auto;
	  margin-top: 10px;
	  border: 1px solid #ccc;
	}

	/* --- Botões --- */
	.diario-botoes {
	  margin-top: 20px;
	  display: flex;
	  flex-wrap: wrap;
	  gap: 10px;
	}

	.diario-btn {
	  padding: 8px 16px;
	  border-radius: 4px;
	  color: white;
	  text-decoration: none;
	  display: inline-block;
	}

	.diario-btn.editar {
	  background-color: #28a745;
	}

	.diario-btn.excluir {
	  background-color: #dc3545;
	}

	.gerar-pdf a {
	  background-color: #007bff;
	  color: white;
	  padding: 6px 12px;
	  border-radius: 4px;
	  text-decoration: none;
	  display: inline-block;
	  margin-top: 8px;
	}

	.diario-form-group {
	  flex-direction: column;
	}

	.gerar-pdf {
	margin-left: 0;
	}

	.box-content h1{
		font-size: 20px;
	}

	.box-content h2{
		font-size: 18px;
	}

	.fvs-table {
        width: auto;
        zoom: 0.40; 
        max-width: 100%;
        display: inline-block;
    }

    .fvs-table.fvs-header-table {
        width: auto;
        zoom: 0.73; 
        max-width: 100%;
        display: inline-block;
    }

    .fvs-table.fvs-header-table-obra {
    	width: auto;
        zoom: 0.40; 
        max-width: 100%;
        display: inline-block;
    }

    .imagem-fvs img {
        display: block;
        margin: 0 auto;
        max-width: 100%;
        border: 1px solid #ccc !important;
        padding: 5px !important;
    }
    
    .imagem-fvs > p {
        text-align: center;
    }
}

@media screen and (max-width: 400px){
	.box-content{
		padding: 8px 2%;
	}

	.box-batata{
		padding: 8px 2%;
	}

	.box-metrica-wraper h2{
	font-size: 24px;
	}

	.box-metrica-wraper p{
	padding: 10px 0;
	font-size: 22px;
	}

	.menu-wraper{
		width: 200px;
	}

	.form-group {
	    flex-direction: column;
	    width: 100%;
	}

	/* Grupos de formulários */
	.form-group {
	  display: flex;
	  flex-wrap: wrap;
	  gap: 15px;
	  margin-bottom: 20px;
	  width: 100%;
	}

	/* Estilo geral */
	.box-content {
	  padding: 20px;
	  background-color: #fff;
	  max-width: 1200px;
	  margin: auto;
	  width: 100%;
	}

	form input[type="text"],
	form input[type="number"],
	form input[type="date"],
	form select,
	form textarea {
	  width: 100%;
	  padding: 8px;
	  font-size: 16px;
	  margin-top: 5px;
	  border: 1px solid #ccc;
	  border-radius: 4px;
	}

	.w14 { flex: 0 0 100%; }
	.w16 { flex: 0 0 100%; }
	.w20 { flex: 0 0 100%; }
	.w25 { flex: 0 0 100%; }
	.w33 { flex: 0 0 100%; }
	.w50 { flex: 0 0 100%; }
	.w70 { flex: 0 0 100%; }
	.w75 { flex: 0 0 100%; }
	.w80 { flex: 0 0 100%; }
	.w84 { flex: 0 0 100%; }
	.w100 { flex: 0 0 100%; }

	.w14, .w16, .w20, .w25, .w33, .w50, .w70, .w75, .w80, .w84, .w100 {
	    flex: 0 0 100%;
	}

	form input[type="text"],
	form input[type="number"],
	form input[type="date"],
	form select,
	form textarea {
	font-size: 18px;
	width: 100%;
	}

	/* Botão de submit */
	input[type="submit"] {
	  background-color: #1e88e5;
	  color: #fff;
	  padding: 10px 25px;
	  font-size: 18px;
	  border: none;
	  border-radius: 5px;
	  cursor: pointer;
	  width: 100%;
	}

	input[type="submit"]:hover {
	  background-color: #0d47a1;
	  width: 100%;
	}

	/* Alerta */
	.alerta.sucesso {
	  background-color: #d4edda;
	  padding: 10px;
	  margin-top: 20px;
	  border-left: 5px solid #28a745;
	  color: #155724;
	}

	/* --- Imagem da Obra --- */
	.diario-img-obra {
	  max-width: 100%;
	  height: auto;
	  margin-top: 10px;
	  border: 1px solid #ccc;
	}

	.diario-box-comentario {
	  padding: 20px;
	  background-color: #f9f9f9;
	}

	.diario-section {
	  margin-bottom: 20px;
	}

	.diario-titulo {
	  font-size: 20px;
	  font-weight: 600;
	  background-color: #e6ebe8;
	  padding: 10px;
	  margin-bottom: 10px;
	}

	/* --- Grid flexível --- */
	.diario-form-group {
	  display: flex;
	  flex-wrap: wrap;
	  gap: 15px;
	  margin-bottom: 16px;
	}

	/* --- Texto e elementos --- */
	.diario-form-group p {
	  margin: 0 0 4px;
	  font-weight: 500;
	}

	.diario-form-group div {
	  font-size: 14px;
	}

	/* --- Imagem da Obra --- */
	.diario-img-obra {
	  max-width: 100%;
	  height: auto;
	  margin-top: 10px;
	  border: 1px solid #ccc;
	}

	/* --- Botões --- */
	.diario-botoes {
	  margin-top: 20px;
	  display: flex;
	  flex-wrap: wrap;
	  gap: 10px;
	}

	.diario-btn {
	  padding: 8px 16px;
	  border-radius: 4px;
	  color: white;
	  text-decoration: none;
	  display: inline-block;
	}

	.diario-btn.editar {
	  background-color: #28a745;
	}

	.diario-btn.excluir {
	  background-color: #dc3545;
	}

	.gerar-pdf a {
	  background-color: #007bff;
	  color: white;
	  padding: 6px 12px;
	  border-radius: 4px;
	  text-decoration: none;
	  display: inline-block;
	  margin-top: 8px;
	}

	.diario-form-group {
	  flex-direction: column;
	}

	.gerar-pdf {
	margin-left: 0;
	}

	.box-content h1{
		font-size: 18px;
	}

	.box-content h2{
		font-size: 16px;
	}

	.fvs-table {
        width: auto;
        zoom: 0.40; 
        max-width: 100%;
        display: inline-block;
    }

    .fvs-table.fvs-header-table {
        width: auto;
        zoom: 0.73; 
        max-width: 100%;
        display: inline-block;
    }

    .fvs-table.fvs-header-table-obra {
    	width: auto;
        zoom: 0.40; 
        max-width: 100%;
        display: inline-block;
    }

    .imagem-fvs img {
        display: block;
        margin: 0 auto;
        max-width: 100%;
        border: 1px solid #ccc !important;
        padding: 5px !important;
    }
    
    .imagem-fvs > p {
        text-align: center;
    }
}

@media screen and (max-width: 380px){
	.box-content{
		padding: 8px 2%;
	}

	.box-batata{
		padding: 8px 2%;
	}

	.box-metrica-wraper h2{
	font-size: 24px;
	}

	.box-metrica-wraper p{
	padding: 10px 0;
	font-size: 22px;
	}

	.menu-wraper{
		width: 200px;
	}

	.form-group {
	    flex-direction: column;
	    width: 100%;
	}

	/* Grupos de formulários */
	.form-group {
	  display: flex;
	  flex-wrap: wrap;
	  gap: 15px;
	  margin-bottom: 20px;
	  width: 100%;
	}

	/* Estilo geral */
	.box-content {
	  padding: 20px;
	  background-color: #fff;
	  max-width: 1200px;
	  margin: auto;
	  width: 100%;
	}

	form input[type="text"],
	form input[type="number"],
	form input[type="date"],
	form select,
	form textarea {
	  width: 100%;
	  padding: 8px;
	  font-size: 16px;
	  margin-top: 5px;
	  border: 1px solid #ccc;
	  border-radius: 4px;
	}

	.w14 { flex: 0 0 100%; }
	.w16 { flex: 0 0 100%; }
	.w20 { flex: 0 0 100%; }
	.w25 { flex: 0 0 100%; }
	.w33 { flex: 0 0 100%; }
	.w50 { flex: 0 0 100%; }
	.w70 { flex: 0 0 100%; }
	.w75 { flex: 0 0 100%; }
	.w80 { flex: 0 0 100%; }
	.w84 { flex: 0 0 100%; }
	.w100 { flex: 0 0 100%; }

	.w14, .w16, .w20, .w25, .w33, .w50, .w70, .w75, .w80, .w84, .w100 {
	    flex: 0 0 100%;
	}

	form input[type="text"],
	form input[type="number"],
	form input[type="date"],
	form select,
	form textarea {
	font-size: 18px;
	width: 100%;
	}

	/* Botão de submit */
	input[type="submit"] {
	  background-color: #1e88e5;
	  color: #fff;
	  padding: 10px 25px;
	  font-size: 18px;
	  border: none;
	  border-radius: 5px;
	  cursor: pointer;
	  width: 100%;
	}

	input[type="submit"]:hover {
	  background-color: #0d47a1;
	  width: 100%;
	}

	/* Alerta */
	.alerta.sucesso {
	  background-color: #d4edda;
	  padding: 10px;
	  margin-top: 20px;
	  border-left: 5px solid #28a745;
	  color: #155724;
	}

	/* --- Imagem da Obra --- */
	.diario-img-obra {
	  max-width: 100%;
	  height: auto;
	  margin-top: 10px;
	  border: 1px solid #ccc;
	}

	.diario-box-comentario {
	  padding: 20px;
	  background-color: #f9f9f9;
	}

	.diario-section {
	  margin-bottom: 20px;
	}

	.diario-titulo {
	  font-size: 20px;
	  font-weight: 600;
	  background-color: #e6ebe8;
	  padding: 10px;
	  margin-bottom: 10px;
	}

	/* --- Grid flexível --- */
	.diario-form-group {
	  display: flex;
	  flex-wrap: wrap;
	  gap: 15px;
	  margin-bottom: 16px;
	}

	/* --- Texto e elementos --- */
	.diario-form-group p {
	  margin: 0 0 4px;
	  font-weight: 500;
	}

	.diario-form-group div {
	  font-size: 14px;
	}

	/* --- Imagem da Obra --- */
	.diario-img-obra {
	  max-width: 100%;
	  height: auto;
	  margin-top: 10px;
	  border: 1px solid #ccc;
	}

	/* --- Botões --- */
	.diario-botoes {
	  margin-top: 20px;
	  display: flex;
	  flex-wrap: wrap;
	  gap: 10px;
	}

	.diario-btn {
	  padding: 8px 16px;
	  border-radius: 4px;
	  color: white;
	  text-decoration: none;
	  display: inline-block;
	}

	.diario-btn.editar {
	  background-color: #28a745;
	}

	.diario-btn.excluir {
	  background-color: #dc3545;
	}

	.gerar-pdf a {
	  background-color: #007bff;
	  color: white;
	  padding: 6px 12px;
	  border-radius: 4px;
	  text-decoration: none;
	  display: inline-block;
	  margin-top: 8px;
	}

	.diario-form-group {
	  flex-direction: column;
	}

	.gerar-pdf {
	margin-left: 0;
	}

	.box-content h1{
		font-size: 16px;
	}

	.box-content h2{
		font-size: 14px;
	}

	
	.fvs-table {
        width: auto;
        zoom: 0.40; 
        max-width: 100%;
        display: inline-block;
    }

    .fvs-table.fvs-header-table {
        width: auto;
        zoom: 0.73; 
        max-width: 100%;
        display: inline-block;
    }

    .fvs-table.fvs-header-table-obra {
    	width: auto;
        zoom: 0.40; 
        max-width: 100%;
        display: inline-block;
    }

    .imagem-fvs img {
        display: block;
        margin: 0 auto;
        max-width: 100%;
        border: 1px solid #ccc !important;
        padding: 5px !important;
    }
    
    .imagem-fvs > p {
        text-align: center;
    }
}