.quiet-section {
   font-family: "Libre Baskerville", serif;
    
}

.quiet-title {
  font-family: "Bodoni72", serif;
  font-weight: 400;
  /* font-size: 54px; */
  font-size: 34px;
  line-height: 56px;
  color: #ffffff;
  letter-spacing: 0%;
}

.quiet-text {
  margin-bottom: 25px;
  max-width: 320px;
  font-family: "Bellefair", serif;
  font-weight: 400;
  /* font-size: 20px; */
  font-size: 25px;
  /* line-height: 24px; */
  line-height: 34px;
}

.quiet-btn {
  border: 1px solid #ffffff !important;
  background: #da8a67 !important;
   padding: 12px 20px !important;
  border-radius: 10px !important;
 
  font-family: "Bellefair", serif !important;
  font-weight: 400 !important;
  /* font-size: 18px !important; */
  font-size: 25px !important;

  text-align: center !important;
  color: #ffffff !important;
}

.quiet-btn:hover {
  background-color: #faa580 !important;
  color: white !important;
}

/* Frame Image Container */
.frame-wrapper {
  position: relative;
  width: 100%;
  /* max-width: 450px; */
  aspect-ratio: 4 / 3;
  /* margin: 0 auto; */
  z-index: -100;
}

/* Border Frame */
.quite-image {
  width: 100%;
  height: auto;
  display: block;
  position: relative;
  z-index: 2;
}

/* Inner Image Positioned Absolutely inside Frame */
.inner-image {
  position: absolute;
  top: 6.5%;
  /* left: 6.5%; */
  width: 100%;
  height: 80%;
  z-index: 1;
  overflow: hidden;
}

.inner-image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  border-radius: 3px;
  display: block;
}

@media screen  and (max-width:900px){

  .quiet-title {

  font-size: 34px;
line-height: 42px;
  }

  .quiet-section{
    margin-top: 30px;
  }
  .quiet-btn{
    font-size: 18px !important;
  }
}

@media screen  and (max-width:992px){
  .quiet_content{
    display: flex;
    justify-content: center;
    align-items: center;
  }

  .quiet-btn{
    width: 100%;
  }

   
}

@media screen and (max-width: 414px) {
  .quiet-title{
    font-size: 35px !important;
   }
  
}
@media screen and (max-width: 395px) {
  .quiet-title{
    font-size: 30px !important;
   }
  
}
@media screen and (max-width: 327px) {
  .quiet-title{
    font-size: 25px !important;
   }
  
}

@media screen and (max-width: 284px) {
  .quiet-title {
    font-size: 20px !important;
  }
}

/* ---------------------------------whisper model ------------------- */

.whisper-modal {
  background: #8da16e !important;
  border: 1px solid #ffffff !important;
  border-radius: 24px !important;
  padding: 30px !important;

  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  box-shadow: 0 8px 32px 0 rgba(31, 38, 135, 0.2);
}

.form-control-custom {
  /* background: #8DA16E !important; */
  background-color: #aac184 !important;
  border: 0.5px solid #edf3e2 !important;
  color: #ffffff !important;
  border-radius: 10px !important;
  padding: 10px 15px !important;

  font-weight: 400 !important;
  font-size: 20px !important;
  line-height: 24px !important;
  font-family: "Bellefair", serif !important;
}

.form-control {
  color: #ffffff !important;
}

.form-control-custom::placeholder {
  color: rgba(255, 255, 255, 0.8);
}

.form-control-custom:focus {
  background: rgba(255, 255, 255, 0.25);
  color: #fff;
  box-shadow: none;
  border-color: #fff;
}

.submit-btn {
  border: 1px solid #ffffff !important;
  background: #da8a67 !important;
  /* font-size: 0.9rem !important; */
  padding: 10px 40px !important;
  border-radius: 10px !important;
  /* transition: 0.3s !important; */

  font-family: "Bellefair", serif !important;
  font-weight: 400 !important;
  font-size: 18px !important;

  text-align: center !important;
  color: #ffffff !important;
}

.submit-btn:hover {
  background-color: #faa580 !important;
  color: white !important;
}

.model_wishper {
  font-family: "Bodoni72", serif;
  font-weight: 400;
  font-size: 34px;
  text-align: center;
}

.modal-body {
  border: 1px solid #ffffff !important;
  border-radius: 20px !important;
  margin: 25px;
}

.modal.show .modal-dialog {
  display: flex;
  justify-content: center;
  align-items: center;
}

.modal-content {
  width: 694px !important;
}

.form-control-custom::placeholder {
  color: #fff !important;
}

.form-control:focus-visible {
  outline: none !important;
}

.form-control:focus,
.form-control-custom:focus {
  box-shadow: none !important;
}

.custom-close-white {
  position: absolute;
  top: 20px;
  right: 20px;
  width: 1rem !important;
  height: 1rem !important;
  background-color: transparent !important ;
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' fill='white' viewBox='0 0 16 16'%3e%3cpath d='M2.146 2.146a.5.5 0 0 1 .708 0L8 7.293l5.146-5.147a.5.5 0 0 1 .708.708L8.707 8l5.147 5.146a.5.5 0 0 1-.708.708L8 8.707l-5.146 5.147a.5.5 0 0 1-.708-.708L7.293 8 2.146 2.854a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e") !important;
  background-repeat: no-repeat !important;
  background-size: 1.5rem !important;
  border: none !important;
  opacity: 1 !important;
  z-index: 10 !important;
}

.custom-close-white:focus {
  outline: 0;
  box-shadow: none !important;
}

 
.form-select {
  --bs-form-select-bg-img: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%23ffffff' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='m2 5 6 6 6-6'/%3e%3c/svg%3e") !important;
}

/* RESPONSIVE MODAL STYLING */
@media (max-width: 768px) {
  .modal-content {
    width: 95% !important;
    padding: 20px !important;
  }
  .whisper-modal{
    padding: 20px !important;
  }

  .modal-body {
    margin: 15px !important;
    padding: 10px !important;
  }

  .model_wishper {
    font-size: 28px !important;
  }

  .form-control-custom {
    font-size: 18px !important;
    line-height: 22px !important;
    padding: 10px 12px !important;
  }

  .submit-btn {
    font-size: 16px !important;
    padding: 10px 30px !important;
  }

  .custom-close-white {
    top: 10px;
    right: 10px;
    background-size: 1rem !important;
  }
}

@media (max-width: 480px) {
  .modal-content{
    width:100% !important;
    padding: 18px !important;
  }
  .model_wishper {
    font-size: 22px !important;
  }

  .whisper-modal{
    padding: 18px !important;
  }
  .form-control-custom {
    font-size: 16px !important;
    padding: 8px 10px !important;
  }

  .submit-btn {
    font-size: 14px !important;
    padding: 8px 20px !important;
  }
}

  /* footer{
     position: fixed !important;
  bottom: 0% !important;
  width: 100% !important;
  } */






