* {
    box-sizing: border-box;
  }


.cat {
  width: 100%;
  display: grid;
  place-items: center;
  margin-top:5%;
  padding:0;
  display:flex;
  flex-wrap: wrap;
}

.form-wrapper{
    margin-left:4%;
    width:45%;
    display:flex;
    flex-wrap: wrap;
}
  
  .contact-form {
    display: flex;
    flex-direction: column;
    width:100%;
    display:flex;
  flex-wrap: wrap;
  }
  
  .contact-form-input {
    width:100%;
    height: 2.2rem;
    padding: 0.5rem;
    margin: 1rem 0;
    border: .1fr solid rgba(0, 0, 0, .5,);
    font-size: .8rem;
    font-weight: 500;
    color: #6c757d;
    letter-spacing: 0.1rem;
    outline: none;
  }
  
  .contact-form-input:focus {
    color: black;
  }
  
  .contact-form-input::placeholder {
    color: #929292;
  }
  
  .contact-form-textarea {
    height: 20rem;
    resize: none;
    display:flex;
    flex-wrap: wrap;
    color: black;
  }
  
  .form-submit-btn {
    width: 90px;
    height: 3rem;
    background-color: #fff;
    border: 1px solid black;
    font-size: 1rem;
    color: #929292;
    cursor: pointer;
    display:flex;
    flex-wrap: wrap;
    margin-bottom:10%;
    justify-content:center;
  }

  .contact_div{
    width:35%; 
    margin-right:5%; 
    margin-bottom:9%; 
    margin-left:4%;
  }

  @media screen and (max-width:600px){
    .form-wrapper{
        width:100%;
    }
    .contact_div{
        margin-top:10%;
        width:100%;
    }
    
}

@media screen and (min-width:501px){
  .footer{
      padding-left:34%;
      width:100%;
      margin-top:10%
  }
}