@charset "utf-8";
/* CSS Document */
html, body{
  height: 100%;
  overflow:hidden;
}
body{
	background-color: #384352;
  overflow: hidden;

}
	
div, body{
  margin: 0;
  padding: 0; 
}

h1 {
font-family: 'Open Sans', sans-serif; 
color:#fff;
text-align: center;
font-size:1em;
}

h6 {
margin-left: 39%;
font-size:1em;
}

a {
font-family: 'Open Sans', sans-serif; 
color:#fff;
text-align: center;
font-size:1em;
text-decoration: none;
}

div.top2 {
width: 100%;
height: auto;
text-align: center; 
overflow: hidden;
z-index: 999;
margin-top: 11.5%;
background-color: #26313D;
padding:0.2rem;
}

ul {
list-style-type: none;
margin: 0;
padding: 0;
overflow: hidden;
top:0;
bottom: 0;
} 

li {
display: inline-block;
position:relative;
margin: 0;
padding: 0;
}
  
li a {
display: block;
color: white;
padding: 15px 8px 8px 8px ;
text-decoration: none;
font-family: Arial, "Gill Sans", "Gill Sans MT", "Myriad Pro", "DejaVu Sans Condensed", Helvetica, Arial, "sans-serif";
font-size: 0.8em;
}   

li a:link {
color: white;
text-decoration: none;
}

li a:visited {
color: white;
text-decoration: none;
}

li a:hover {
color: white;
text-decoration: none;
background-color: #384352;
}

li a:active {
color: white;
text-decoration: none;
background-color: #384352;
} 

::-webkit-scrollbar {
width: 0px;  
background: transparent;  
}

#balao{
text-align: center;
}

.topnav {
  overflow: hidden;
  width: 100%;
  height: 15vw;
  position: absolute;
  margin:0;
  padding: 0;
}

.imgt {
width: 100%;
height: auto;
left: 0;
top:0;
position: absolute;
}

.texto{
width: 70%;
position: absolute;
margin: auto;
top:17%;
right: 0;
left: 0;
overflow: hidden;
} 
.conteudo{
width: 100%;
position: absolute;
margin: auto;
top:28%;
right: 0;
left: 0;
text-align: center;
overflow: hidden;
} 

.imgm {
 display: inline-block;
  color: currentColor;
max-width: 20%;
  vertical-align: middle;
  position: relative; /* 1 */ 
}

.imgf {
 display: inline-block;
  color: currentColor;
  width: 10%;
  vertical-align: middle;
  position: relative; /* 1 */
  top: -0.1em;  
}

.mid {
  position: absolute;
  width: 100%;
  top: calc(80%);
  left: 50%;
  height: 100%;
  transform: translate(-50%, -50%);
  -webkit-transform: translate(-50%, -50%);
  -moz-transform: translate(-50%, -50%);
  -o-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
color: white;
text-decoration: none;
font-family: Arial, "Gill Sans", "Gill Sans MT", "Myriad Pro", "DejaVu Sans Condensed", Helvetica, Arial, "sans-serif";
font-size: 16px;
overflow: scroll;
height:inherit;
}


.footer {
  overflow: hidden;
  width: 100%;
  position: absolute;
  right: 0;
  bottom: 0;
  left: 0;
  background-color: #efefef;
  text-align: center;
  padding-top: 0.1rem;
padding-bottom: 0.1rem;
background-color: #efefef;
text-decoration: none;
font-family: Arial, "Gill Sans", "Gill Sans MT", "Myriad Pro", "DejaVu Sans Condensed", Helvetica, Arial, "sans-serif";
font-size: 0.7em;
color:#4e4f51;
}

.f1{
position: relative;
left: 44%;
margin-left: -100px;
margin-top: 0.4%;
} 
.f2{
margin-top: -0.5%;
margin-left: 1%;
float:left;
font-size: 0.7rem;
line-height: 99%;
}


.imgc {
width: 50%;
height: auto;
}

.imgf {
width: auto;
height: 5%;
float:left;
}

/*  SECTIONS  */
.section {
  clear: both;
  margin-left: 4%;
  margin-right: 2%;
  margin-top: 17%;
  position: absolute;
}
.section2{
  clear: both;
  padding: 0px;
  margin: 0px;
    margin-left: 20%;
}

/*  COLUMN SETUP  */
.col2 {
  display: block;
  float:left;
  }
/*  COLUMN SETUP  */
.col {
  display: block;
  float:left;
  margin: 1% 0 1% 4%;
}
.col:first-child { margin-left: 0; }

/*  GROUPING  */
.group:before,
.group:after { content:""; display:table; }
.group:after { clear:both;}
.group { zoom:1; /* For IE 6/7 */ }

/*  GRID OF THREE  */
.span_3_of_3 { width: 100%; }
.span_2_of_3 { width: 65%; }
.span_1_of_3 { width: 30%; }

/*  GRID OF TWO  */
.span_2_of_2 {
  width: 100%;
}
.span_1_of_2 {
  width: 49.2%;
}

/*  GO FULL WIDTH AT LESS THAN 480 PIXELS */

@media only screen and (max-width: 480px) {
  .col { 
    margin: 1% 0 1% 0%;
  }
}

@media only screen and (max-width: 480px) {
  .span_2_of_2, .span_1_of_2 { width: 100%; }
}
/*  GO FULL WIDTH BELOW 480 PIXELS */
@media only screen and (max-width: 480px) {
  .col {  margin: 1% 0 1% 0%; }
  .span_3_of_3, .span_2_of_3, .span_1_of_3 { width: 100%; }
}

/*  GO FULL WIDTH BELOW 480 PIXELS */
@media only screen and (max-width: 480px) {
  .col {  margin: 1% 0 1% 0%; }
  .span_3_of_3, .span_2_of_3, .span_1_of_3 { width: 100%; }
}

.imagem {
position:absolute; 
left:0; right:0;
margin:auto;
width: 35%;
}