/* Center the form container on the page */
/* body {
  display: flex;
  justify-content: center;
  align-items: center;
  height: 80vh;
  margin: 0;
  background: #f7f7f7; 
} */


/* Adjust the form container styling */

.content-container img {
  display: flex;
  align-items: center;
  /* justify-content: center; */
  gap: 20px;
  margin: 20px;
  width:20%;
  height:auto;
  margin-bottom: 40px;
 /* border:  1px solid #ddd; */
 border-radius: 8px;
}
.content-container video{
  width:20%;
   height:20%;
   /* justify-items: right; */
   margin-left: 75%;
   margin-right: 10px;
   margin-top: -10%;
   margin-bottom: 90px;
   /* border: 1px solid #ddd; */
   /* border-radius: 8px; */
}
.content-container  video::-internal-media-controls {
  display: none;
}
.content-container  video::-webkit-media-controls {
  display: none;
}

.form-container {
  background: #fff;
  padding: 20px;
  border-radius: 10px;
  box-shadow: 0 4px 6px rgba(36, 27, 27, 0.1); 
  border: solid rgb(248, 247, 247) ;
  max-width: 400px;
  margin-left: 37%;
  margin-bottom: 50px;
  width: 90%; /* Responsive width for smaller screens */
}

/* Center align the header */
h1 {
  color: #000000;
  font-size: 1.5rem;
  text-align: center;
  margin-bottom: 15px;
  font-family:'Courier New', Courier, monospace;
  text-decoration: underline rgb(57, 163, 89);

}
/* .h1 :hover {
text-decoration: #000000;
transition: cubic-bezier(0.075, 0.82, 0.165, 1);
} */

.input-group {
  margin-bottom: 15px;
}

label {
  display: block;
  margin-bottom: 5px;
  font-weight: bold;
}

input,
textarea,
button {
  width: 100%;
  padding: 10px;
  margin-top: 5px;
  border: 1px solid #ccc;
  border-radius: 5px;
}

button {
  background-color:  rgb(57, 163, 89);  
  color: #fff;
  font-weight: bold;
  border: none;
  border-radius: 50px;
  cursor: pointer;
  transition: background-color 0.3s ease;
}
.arrow {
  transition: transform 0.3s ease;
}


button:hover {
  background-color: rgb(57, 163, 89);
}

/* Style the star rating */
/* .stars span {
  font-size: 1.5rem;
  font-family: 'Lucida Sans', Geneva, Verdana, sans-serif;
  cursor: pointer;
  color: #eaec6e;
  transition: color 0.3s ease;
} */
.stars {
  display: flex;
  justify-content: center;
  gap: 5px; /* Space between stars */
}

.stars span {
  font-size: 2rem;
  cursor: pointer;
  color: #ccc; /* Default gray for unselected stars */
  transition: color 0.3s ease;
}

.stars span.active {
  color: #dfb742; /* Gold color for selected stars */
}


/* faq */

#faq {
  margin: 20px;
  padding: 15px;
  /* background: #f9f9f9; */
  background: #f3f9f1;
  border-radius: 8px;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
}

#faq h2 {
  text-align: center;
  font-size: 1.8rem;
  color: #000000;
  margin-bottom: 20px;
}

.faq-item {
  margin-bottom: 10px;
}

.faq-question {
  background-color:rgb(57, 163, 89);
  color: rgb(0, 0, 0);
  font-size: 1rem;
  padding: 10px;
  width: 50%;
  margin-left: 20%;
  text-align: left;
  border: none;
  border-radius: 5px;
  cursor: pointer;
  transition: background-color 0.3s ease;
}

.faq-question:hover {
  background-color: #4ccf92;
}

.faq-answer {
  display: none;
  padding: 10px;
  background-color: #f1f1f1;
  border-radius: 5px;
  margin-top: 5px;
  width: 50%;
  margin-left: 20%;
}

.faq-answer p {
  margin: 0;
}


@media (max-width: 700px) {
  .form-container {
    background: #fff;
    padding: 20px;
    border-radius: 10px;
    box-shadow: 0 4px 6px rgba(36, 27, 27, 0.1); 
    border: solid rgb(248, 247, 247) ;
    max-width: 300px;
    margin-left: 30%;
    margin-bottom: 50px;
    width: 90%; /* Responsive width for smaller screens */
  }
}
@media (max-width: 400px) {
  .form-container {
    background: #fff;
    padding: 20px;
    border-radius: 10px;
    box-shadow: 0 4px 6px rgba(36, 27, 27, 0.1); 
    border: solid rgb(248, 247, 247) ;
    max-width: 200px;
    margin-left: 19%;
    margin-bottom: 50px;
    width: 90%; /* Responsive width for smaller screens */
  }

  .stars span {
    font-size: 0.7rem;
    cursor: pointer;
    color: #ccc; /* Default gray for unselected stars */
    transition: color 0.3s ease;
  }
}


