/* RESET */
* {
   font-family: Arial, Helvetica, sans-serif;
   margin: 0px;
   padding: 0px;
   box-sizing: border-box;
}

a:link,
a:visited {
   text-decoration: none;
   color: #386FA4;
}

a:hover,
a:active {
   text-decoration: underline;
}
/* FIM REST */


/* CONFIGURACOES GERAIS */
h1,
h3,
h4 {
   text-align: center;
   margin: 15px 0px;
}

h1 {
   color: #386FA4;
}

h3 {
   color: black;
}

h4 {
   color: grey;
   font-weight: normal;
}

input,
select {
   height: 40px;
   background: white;
}

input[type=text],
input[type=email],
input[type=password],
input[type=number],
textarea,
select {
   width: 250px;
   border: 1px solid lightgrey;
   border-radius: 2px;
   padding: 0px 3px;
}

input[type=submit],
input[type=button] {
   cursor: pointer;
   min-width: 100px;
   font-size: 14pt;
   color: white;
   border: none;
   border-radius: 2px;
   margin: 0px 5px;
   margin-top: 15px;
   padding: 0px 5px;
}

input[type=submit]:hover,
input[type=button]:hover,
input[type=submit]:hover,
input[type=button]:visited {
   opacity: 0.5;
}

textarea {
   height: 120px;
}

.botaoSalvar {
   background: #28A745;
}

.botaoEntrar {
   background: #4285f4;
}

.botaoAtualizar {
   background: #4285f4;
}

.botaoEnviar {
   background: #0254A5;
}

.botaoCancelar {
   background: #FFC107;
}

.botaoTexto[type=button] {
   cursor: pointer;
   height: 30px;
   color: grey;
   font-size: 10pt;
   margin: 0px 20px;
   padding: 5px;
   background: #F8F9FA;
   border: 1px solid transparent;
   border-radius: 3px;
}

.botaoTexto[type=button]:hover {
   border: 1px solid lightgrey;
   opacity: 1;
}
/* FIM CONFIGURACOES GERAIS */


/* BODY */
body {
   display: grid;
   grid-template-areas: "header" "section" "footer";
   grid-template-rows: 120px 8fr 1fr;
   grid-template-columns: 1fr;
   grid-gap: 0px;
   height: 100vh;
}
/* FIM BODY */


/* HEADER */
header {
   grid-area: header;

   display: flex;
   flex-direction: row;
   justify-content: center;
   align-items: center;

   height: 120px;
   color: white;
   background: #386FA4;
   box-shadow: 0px 0px 5px 1px rgba(0, 0, 0, 0.5);
   -webkit-box-shadow: 0px 0px 5px 1px rgba(0, 0, 0, 0.5);
   -moz-box-shadow: 0px 0px 5px 1px rgba(0, 0, 0, 0.5);
   padding: 5px;
}

header > div {
   display: flex;
   flex-direction: column;
   justify-content: center;
   align-items: center;
   font-size: 3vw;
   font-weight: bold;
   /* border: 1px solid tomato; */
}

header > #div_SAP_container {
   font-size: 3vw;
   font-weight: bold;
}

header > #div_SAP {
   color: #D3D3D3;
   font-size: 6vw;
   border-top: 4px solid #D3D3D3;
   border-bottom: 4px solid #D3D3D3;
   margin-right: 20px;
}

header > #div_SAP_container > #div_SAP_texto > span {
   font-size: 2.5vw;
}

header > #div_CMI {
   font-size: 2.5vw;
}
/* FIM HEADER */


/* SECTION */
section {
   grid-area: section;

   display: flex;
   justify-content: center;
   align-items: center;

   font-size: 12pt;
   color: grey;
   padding: 10px;
}

   section > div {
      display: flex;
      flex-direction: column;
      flex-basis: 100%;
      justify-content: center;
      align-items: center;
      /* border: 1px solid red; */
   }

   section > #divTextosExplicativos > img {
      width: 40px;
      height: 40px;
   }
/* FIM SECTION */


/* FOOTER */
footer {
   grid-area: footer;
   min-height: 50px;
   background: white;
   display: flex;
   justify-content: center;
   align-items: center;
}

footer div {
   display: flex;
   justify-content: center;
   align-items: center;

   color: #386FA4;
   border-top: 1px solid #386FA4;
   font-size: 8pt;
   text-align: center;
}
/* FIM FOOTER */


/* FORM VERTICAL */
.formVertical {
   display: flex;
   flex-direction: column;
   justify-content: center;
   align-items: center;
}

.formVertical>div {
   display: flex;
   justify-content: center;
   align-items: center;
   margin-top: 3px;
}

.formVertical img {
   width: 30px;
   height: 30px;
   margin-right: 3px;
}
/* FIMFORM VERTICAL */