@font-face {
  font-family: Viva Beautiful;
  src: url("../fonts/DancingScript-VariableFont_wght.ttf");
}

@font-face {
  font-family: Verlag Compressed Book;
  src: url("../fonts//Verlag\ Compressed\ Book.otf");
}
body {
  font-family: Verlag Compressed Book !important;
  font-family: Viva Beautiful;
}

.intro {
  background: url("../../contactassets/img/w.jpg") no-repeat center center/cover;
  max-width: 100%;
  height: 80vh;
  position: relative;
  border-radius: 0 0 10% 10% / 5%;
}

.title {
  font-family: Verlag Compressed Book !important;
  font-weight: 400;
  font-size: 5.625rem;
  color: #ffffff;
  text-align: center;
  padding: 12%;
}
.responsive-map {
  overflow: hidden;
  padding-bottom: 56.25%;
  position: relative;
  height: 0;
}
.responsive-map iframe {
  left: 0;
  top: 0;
  height: 60%;
  width: 100%;
  position: absolute;
}

.wrap-contact100 {
  width: -webkit-fill-available;
  background: #fff;
  border-radius: 10px;
  overflow: hidden;
  padding: 62px 55px 65px 55px;
  box-shadow: 0 3px 20px 0px rgba(0, 0, 0, 0.1);
  -moz-box-shadow: 0 3px 20px 0px rgba(0, 0, 0, 0.1);
  -webkit-box-shadow: 0 3px 20px 0px rgba(0, 0, 0, 0.1);
  -o-box-shadow: 0 3px 20px 0px rgba(0, 0, 0, 0.1);
  -ms-box-shadow: 0 3px 20px 0px rgba(0, 0, 0, 0.1);
}

input,
textarea,
label {
  width: max-content;
  display: block;
}
:root {
  --primary-color: #010712;
  --secondary-color: #818386;
  --bg-color: #fcfdfd;
  --button-color: #3b3636;
  --h1-color: #3f444c;
}

input::placeholder,
textarea::placeholder {
  color: var(--h1-color);
}

input,
textarea {
  color: var(--primary-color) !important;
  font-weight: 500 !important;
  background: var(--bg-color) !important;
  border: none !important;
  border-bottom: 1px solid var(--secondary-color) !important;
  padding: 0.5rem 0 !important;
  margin-bottom: 1rem !important;
  outline: none !important;
}

textarea {
  resize: none;
}

.btn {
  text-transform: uppercase;
  font-weight: 300;
  background: var(--button-color);
  color: var(--bg-color);
  width: 10rem;
  height: 2.25rem;
  border: none;
  border-radius: 2px;
  outline: none;
  cursor: pointer;
  font-family: Viva Beautiful;
}

input:hover,
textarea:hover {
  opacity: 0.5;
}
.form-control:focus {
  border-color: black !important;
  box-shadow: none !important;
}
.btn:focus {
  border-color: none !important;
  box-shadow: none !important;
}
.header1 {
  font-family: Viva Beautiful;
  color: red;
  font-size: 3.5rem;
  font-weight: 600;
}

::placeholder {
  font-size: 1.2rem;

  opacity: 0.2;
}
label {
  font-size: 2rem;
}

@media (max-width: 600px) and (min-width: 375px) {
  .title {
    font-family: Verlag Compressed Book !important;
    font-weight: 400;
    font-size: 5.625rem;
    color: #ffffff;
    text-align: center;
    padding: 30% 0% 1% 1%;
  }
  .carousel-caption {
    top: 5%;
  }
  .carousel-caption h4 {
    font-size: 3rem;
  }
}

@media (max-width: 320px) {
  .title {
    font-family: Verlag Compressed Book !important;
    font-weight: 400;
    font-size: 5.625rem;
    color: #ffffff;
    text-align: center;
    padding: 34% 0% 1% 1%;
  }
  .intro {
    height: 82vh;
  }
  .carousel-caption h4 {
    font-size: 3rem;
  }
  .carousel-caption {
    top: 5%;
  }
}