body {
  font-family: Poppins, sans-serif;

  background: #f8fafc;
}

.hero {
  background: #0c4a6e;

  padding: 100px 0;

  color: white;

  position: relative;

  overflow: hidden;
}

.hero img {
  border-radius: 25px;
}

.contact-card {
  background: white;

  padding: 25px;

  border-radius: 20px;

  text-align: center;

  transition: 0.4s;

  box-shadow: 0 10px 25px rgba(0, 0, 0, 0.08);

  height: 100%;
}

.contact-card:hover {
  transform: translateY(-10px);
}

.contact-card img {
  height: 220px;

  width: 100%;

  object-fit: cover;

  border-radius: 15px;

  margin-bottom: 20px;
}

.contact-area {
  padding: 80px 0;

  background: white;
}
.form-control {
  padding: 0.8rem 0.75rem;
}
.btn {
  padding: 7px 10px;
  margin-top: 10px;
}

.info-box {
  background: #1d3557;

  color: white;

  padding: 20px;

  border-radius: 20px;

  height: 100%;
}
/* Chrome, Safari, Edge, Opera */
input[type="number"]::-webkit-inner-spin-button,
input[type="number"]::-webkit-outer-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

/* Firefox */
input[type="number"] {
  -moz-appearance: textfield;
  appearance: textfield;
}

.info-box i {
  font-size: 23px;
  margin-top: 6px;
  margin-right: 15px;
}

.form-area {
  background: #f9fafb;

  padding: 30px;

  border-radius: 20px;

  box-shadow: 0 10px 20px rgba(0, 0, 0, 0.08);
}

.map iframe {
  width: 100%;

  height: 450px;

  border: 0;
}

footer {
  background: #1d3557;

  color: white;

  padding: 25px;

  text-align: center;
}