
/* ? ==================== FROM ==================== */
.form--contato .form-label {color: #888;}
.contato .contato-icon {background: var(--primary-color); padding: 1rem; height: 70px; width: 70px; color: #fff; font-size: 1.75rem; border-radius: 1rem;}
@media screen and (min-width: 992px) {
  .form--contato .form-control, .form--contato .form-select {border-radius: 16px; border: 1px solid #D1D1D1; background-color:  #FAFAFA;}
  .contato .form-container {background-color: #FAFAFA;}
  .contato-info-container {background: #434242; color: #fff;}
  .contato a:not(.btn) {color:#fff; transition: .3s;}
  .contato a:not(.btn):hover {color:var(--primary-color);}
  .contato .btn-social {color: #fff; border: 1px solid #fff}
  .contato .btn-social:hover {background: var(--primary-color);}
}

@media screen and (max-width: 576px) {
  .contato .form-container {background-color: #fff; border: 1px solid #000;}
  .form--contato .form-control, .form--contato .form-select {border-radius: 16px; border: 1px solid rgba(255, 255, 255, 0.05); background: rgba(0, 0, 0, 0.16);}
  .contato .contato-icon {font-size: 1.25rem; height: 60px; width: 60px; border-radius: 100%;}
  .contato .btn-social {color: var(--primary-color); border: 1px solid var(--primary-color)}
  .contato .btn-social:hover {background:#fff;}
  .contato .social {justify-content: center;}
}
/* ? ================== FIM FROM ================== */

.contato-map {width: 100%;min-height: 400px;}