/* client id =1000.OSQQBY2I79IE7ZWO5VICFN0W18880W
 */
/* client secret = 0b27f9389a0ee45f75b626239b477716b8eff2ef0b */

#contactUs{
  min-height:100vh;
  /* max-width:1440px; */
  width:100%;
  margin:0 auto;
 }
 .required {
  color: red;
  font-weight: bold;
}

 #contactUs .contentBox{
    padding:0 4% 0;
    margin: 20px 0 4.875em;
    /* overflow:hidden;
    position:relative; */
}
           
  #contactUs h1{
  text-align:left;
  margin-bottom:0.875em;
  }
  #contactUs h2{
    font-weight: 600;
  }
  #contactUs  h3{
    font-weight: 500;
    margin:0.625em 0 ;
  }
  
  .contactUsContainer .content{
     max-width:90%;     
  }
    
  .contactUsContainer form {
     margin-top:1.625em;
    display: flex;
    flex-direction: column;
    gap: 0.2em;
}
    
.contactUsContainer input, select, textarea {
width: 100%;
padding: 0.9375em 1.125em;
border: 0.0625em solid #ccc;
border-radius: 0.25em;
font-family: 'Inter', sans-serif;
font-size: clamp(0.75rem, 0.679rem + 0.357vw, 1rem);
font-weight: 400;
line-height: 1.7em;
letter-spacing: 0.04em;
              }
    
.contactUsContainer  select {
width:100%;    
cursor: pointer;
}
    
.contactUsContainer  label{
margin-top:0.75em;         
color:#212121;
font-family: 'Inter', sans-serif;
font-size: clamp(0.75rem, 0.679rem + 0.357vw, 1rem);
font-weight: 400;
line-height: 1.7em;
letter-spacing: 0.04em;
            }
    
.contactUsContainer  textarea {
height: 6.25em;
resize: vertical; color:#212121;
font-family: 'Inter', sans-serif;
font-size: clamp(0.75rem, 0.679rem + 0.357vw, 1rem);
font-weight: 400;
line-height: 1.7em;
letter-spacing: 0.04em;
            }

.contactUsContainer  .contactFormSubmitionBox{
      width:100%;
      display:flex;
      justify-content:space-between;
      gap:40px;
      margin-top:15px;
}


.contactUsContainer .contactPageButtons{
      display:flex;
      justify-content:end;;
      gap:20px;
      
}
.contactUsContainer  button {
    font-family: 'Inter', sans-serif;
    font-size: clamp(0.75rem, 0.679rem + 0.357vw, 1rem);
    font-weight: 500;
    max-height: 2.1875em;
    cursor: pointer;
    width:150px !important;
    margin:0 auto;
    padding:20px 0;
    border-radius: 0.25em;
    display:flex;
    justify-content: center;
    align-items: center;
    transition:0.3s;
}
    
.contactUsContainer  .back-button{
    color:rgb(97, 97, 97);
    background:white;
    border:0.0625em solid rgb(176, 176, 176);
}
    
.contactUsContainer  .back-button:hover{border:0.0625em solid rgb(46, 46, 46);color:rgb(46, 46, 46);}
    
.contactUsContainer  .submit{color:white;background:rgb(97, 97, 97);border:0.0625em solid rgb(97, 97, 97);;}
    
.contactUsContainer  .submit:hover{background:rgb(46, 46, 46);border:0.0625em solid rgb(46, 46, 46)}
    
.contactUsContainer  .submit:disabled {
    background-color: #ccc;
    cursor: not-allowed;
    border:0.0625em solid #ccc;
}
            
@media only screen and (max-width:768px) {

    #contactUs .contentBox{padding:0 8% 0;}
    .contactUsContainer  .contactFormSubmitionBox{
          flex-direction:column;
          justify-content:center;
          gap:20px;
          margin-top:25px;
    }
    .contactUsContainer .contactPageButtons{
           
           justify-content:center;;
           flex-direction: column;
           gap:20px;
          
    }
    #outPutMessageOfContactForm{
        text-align:center;
      }
    .contactUsContainer  button {
        width:100% !important;
    }
    .contactUsContainer  .back-button{order:2;}
    .contactUsContainer  .submit{order:1;}
    .contactUsContainer .content{max-width:100%;}
}

         