@import url("https://fonts.googleapis.com/css2?family=Manrope:wght@200..800&display=swap");
@font-face {
  font-family: Calista;
  src: url(../fonts/Calista-Regular.otf);
}
@font-face {
  font-family: Grenda;
  src: url(../fonts/grenda.otf);
}
:root {
  --main-color: #002c43;
  --second-color: #333;
  --hover-color: #23527c;
}
body {
  font-family: "Manrope", sans-serif;
  font-weight: 300;
  color: #fff;
}

section {
  margin: 6.25rem 0rem;
}
h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: Calista;
}
ul {
  list-style-type: none;
}
a {
  text-decoration: none;
}
/* ================================== Start of Header ==================================*/

header .contact-header {
  height: 50vh;
  background-image: url("../assets/images/elegance.jpg");
  background-position: center center;
  background-repeat: no-repeat;
  background-size: cover;
  width: 100%; 
  overflow: hidden;
  position: relative; 
}
section.franchiseenquiry h2 {
  color: var(--main-color);
  font-weight: 400;
  font-size: 3rem;
}
/* ================================== End of Header ==================================*/
/* ================================== Start of Section ==================================*/
section.contact-content {
  background-color: #08354c;
  padding: 6.25rem 3.125rem;
}
/* ================================== End of Header ==================================*/
/* ================================== Start of Section ==================================*/
section.touch-container h2 {
  color: #08354c;
  font-size: 2.25rem;
}
section.touch-container p {
  color: var(--second-color);
  font-weight: 400;
}
section.contact-container label {
  font-weight: 600;
  font-size: 0.875rem;
  margin-bottom: 0.125rem;
}
section.contact-container input {
  padding: 0.625rem;
}
section.contact-container input,
section.contact-container textarea {
  margin-bottom: 0.625rem;
  background-color: #fafafa;
  border-radius: 0;
}
section.contact-container input::placeholder,
section.contact-container textarea::placeholder {
  color: #c9c1c3;
  font-size: 0.8125rem;
}
section.contact-container input:focus,
section.contact-container textarea:focus {
  box-shadow: none;
  border-color: #4285f478;
  background-color: #fafafa;
}
section.contact-container .contact-submit button {
  background-color: #00314a;
  padding: 1.125rem 3.75rem;
  border: none;
}
section.contact-container .contact-details h2 {
  color: #08354c;
  font-size: 1.625rem;
  font-weight: 600;
}
section.contact-container .contact-details p {
  color: #0d1023;
  font-weight: 400;
}
section.contact-container .contact-details i {
  color: #08354c
}
/* ================================== End of Section ==================================*/
