.formulario {
   
  max-width: 500px;
  margin: auto;
  background: white;
  overflow: hidden;
  padding: 20px;

}

:focus{outline: none;}

.label { 

  float: left; 
  width: 100%; 
  margin-bottom: 25px; 
  position: relative;
}

.req { 

  font: 15px/24px "Lato", Arial, sans-serif; 
  color: #333; 
  width: 100%; 
  box-sizing: border-box; 
  letter-spacing: 1px;
  border: 1px solid #ccc; 
  padding: 7px 14px 9px; 
  transition: 0.4s;
}

.alert {
  padding: 20px;
  background-color: #f44336;
  color: white;
}

.closebtn {
  margin-left: 15px;
  color: white;
  font-weight: bold;
  float: right;
  font-size: 22px;
  line-height: 20px;
  cursor: pointer;
  transition: 0.3s;
}

.closebtn:hover {
  color: black;
}

.input-bordas{
  
  font: 15px/24px "Lato", Arial, sans-serif; 
  color: #333; 
  width: 100%; 
  box-sizing: border-box; 
  letter-spacing: 1px;
  border: 1px solid #ccc; 
  padding: 7px 14px 9px; 
  transition: 0.4s;

}

.textarea { resize:none!important; }

.input-bordas ~ .focus-border:before,
.input-bordas ~ .focus-border:after{content: ""; position: absolute; top: 0; right: 0; width: 0; height: 2px; background-color: #000000; transition: 0.2s; transition-delay: 0.2s;}
.input-bordas ~ .focus-border:after{top: auto; bottom: 0; right: auto; left: 0; transition-delay: 0.6s;}
.input-bordas ~ .focus-border i:before,
.input-bordas ~ .focus-border i:after{content: ""; position: absolute; top: 0; left: 0; width: 2px; height: 0; background-color: #000000; transition: 0.2s;}
.input-bordas ~ .focus-border i:after{left: auto; right: 0; top: auto; bottom: 0; transition-delay: 0.4s;}
.input-bordas:focus ~ .focus-border:before,
.input-bordas:focus ~ .focus-border:after{width: 100%; transition: 0.2s; transition-delay: 0.6s;}
.input-bordas:focus ~ .focus-border:after{transition-delay: 0.2s;}
.input-bordas:focus ~ .focus-border i:before,
.input-bordas:focus ~ .focus-border i:after{height: 100%; transition: 0.2s;}
.input-bordas:focus ~ .focus-border i:after{transition-delay: 0.4s;}


.button-form { 

  background-color: rgb(0, 0, 0);
  padding: 0.5em 1.3em;
  color: #fff;
  font-size: 1.2em;
  border: none;
  cursor: pointer;

}
.borda-inversa {

  display: inline-block;
  vertical-align: middle;
  -webkit-transform: translateZ(0);
  transform: translateZ(0);
  box-shadow: 0 0 1px rgba(0, 0, 0, 0);
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
  -moz-osx-font-smoothing: grayscale;
  -webkit-transition-duration: 0.5s;
  transition-duration: 0.5s;
  -webkit-transition-property: background;
  transition-property: background;
  box-shadow: inset 0 0 0 2px rgb(0, 0, 0), 0 0 1px rgba(0, 0, 0, 0);

}
.borda-inversa:hover, .borda-inversa:focus, .borda-inversa:active {
  
  background: none;
  color:rgb(0, 0, 0); 

}
/*Anti-span*/
.naoexibir { display:none; }
/*Formulario*/

/* Responsivo*/

/*480PX BREAKPOINT*/
/*480 dividido por 16 = 30em*/
@media (min-width:30em){

.boxBannerTopo { padding:1em 0; }

}

/*600PX BREAKPOINT*/
/*600 dividido por 16 = 37,5em*/
@media (min-width:37em){


} 

/*768PX BREAKPOINT*/
/*768 dividido por 16 = 48em*/
@media (min-width:48em){


} 

/*960PX BREAKPOINT*/
/*960 dividido por 16 = 60em*/
@media (min-width:60em){

 .section-seu-codigo          { padding:20px 0px; }
 .section-seu-codigo .content { width:80%; padding:1em 0; margin:0 10%; }

  .box-download { width:62%; float:left; }
  .box-anun     { width:33%; float:right; margin-top:60px; }

}

/*1280PX BREAKPOINT*/
/*1280 dividido por 16 = 80em*/
@media (min-width:80em){
 
}

/*1366PX BREAKPOINT*/
/*1366 dividido por 16 = 85,375em*/
@media (min-width:85em){

 .content  { width:80%; margin:0 10%; }

}
/*1600PX BREAKPOINT*/
/*1600 dividido por 16 = 100em*/
@media (min-width:100em){

}
/*Fecha o Responsivo*/