.mainContact {
    width: 100%;
  

    background-color: var(--black);
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    color: var(--white);


}


.mainContact .firstDiv {
    margin-top: 6em;

     width: 68rem;
    padding: 1em;
    display: flex;
    align-items: center;
   

margin-bottom: 2em;

/* border: 2px solid teal; */

}

.mainContact .firstDiv img{

 
   /* height: 24rem;
  width: 32rem; */
max-width: 33rem;

object-fit: cover;
  border-radius: var(--borderRadius);

filter: brightness(0.5);


/* border: 2px solid red; */

}

.mainContact .firstDivItems{
    max-width: 32rem;
    padding: 1em;
    display: flex;
    flex-direction: column;
/* border: 2px solid bisque; */

    
}
.mainContact .firstDivItems div:nth-child(1){
 
    font-size: var(--contactHeadline);
}

.mainContact .firstDivItems div:nth-child(2) {

   color: var(--grey);
}

.mainContact .firstDivItems div{
    padding: .5em;
    font-size: var(--contactText);
}
.mainContact input[type="text"] {
       max-width: 25rem;
        padding: .6em;
        border-bottom-right-radius: var(--borderRadius);
        border: .2em solid var(--blue);
        background-color: var(--black);
        color: var(--white);
    
    
        margin-bottom: 2em;

}

.mainContact  input[type="email"] {
     max-width: 25rem;
      padding: .6em;
    border-bottom-right-radius: var(--borderRadius);
    border: .2em solid var(--blue);
    background-color: var(--black);
    color: var(--white);

    margin-bottom: 2em;

  }

    .mainContact select {
      max-width: 25rem;
      padding: .6em;
      border-bottom-right-radius: var(--borderRadius);
      border: .2em solid var(--blue);
      background-color: var(--black);
      color: var(--white);
   
  
      margin-bottom: 2em;
    }





  .mainContact ::placeholder {
    color: var(--white);
    opacity: 1;
    /* Firefox */
}
  .mainContact ::-ms-input-placeholder{
color: var(--white);
    opacity: 1;
}


  .mainContact button{
    border: none;
    background-color: var(--blue);
    color: var(--white);
    max-width: 10rem;
    border-bottom-right-radius: var(--borderRadius);
    padding: .6em;
    font-weight: 500;
    font-size: var(--contactButton);
  }



  .mainContact .firstDivItems :nth-child(7){
margin-left: 15em;

   
  }



    .mainContact button:hover {

      background-color: var(--grey);
      color: var(--white);
      font-weight: bold;
      transition: 450ms;
      transform: scale(.98);

    }









@media (max-width:68rem){
.mainContact .firstDiv {
    margin-top: 6em;

    width: 50rem;
    padding: 1em;
    display: flex;
    align-items: center;
    justify-content: space-around;


    margin-bottom: 2em;



  }

    .mainContact .firstDiv img {
  
  
      /* height: 24rem;
    width: 32rem; */
      max-width: 25rem;
  
      border-radius: var(--borderRadius);
  
      filter: brightness(0.5);
  
      /* border: 2px solid red; */
  
    }



  .mainContact .firstDivItems {
    max-width: 25rem;
    padding: 1em;
    display: flex;
    flex-direction: column;
    /* background-color: red; */

  }

  .mainContact .firstDivItems div:nth-child(1) {

    font-size: var(--contactHeadline);
  }

  .mainContact .firstDivItems div:nth-child(2) {

    color: var(--grey);
  }

  .mainContact .firstDivItems div {
    padding: .5em;
    font-size: var(--contactText);
  }

  .mainContact input[type="text"] {
    max-width: 25rem;
    padding: .6em;
    border-bottom-right-radius: var(--borderRadius);
    border: .2em solid var(--blue);
    background-color: var(--black);
    color: var(--white);


    margin-bottom: 2em;

  }

  .mainContact input[type="email"] {
    max-width: 25rem;
    padding: .6em;
    border-bottom-right-radius: var(--borderRadius);
    border: .2em solid var(--blue);
    background-color: var(--black);
    color: var(--white);

    margin-bottom: 2em;

  }

  .mainContact ::placeholder {
    color: var(--white);
    opacity: 1;
    /* Firefox */
  }

  .mainContact ::-ms-input-placeholder {
    color: var(--white);
    opacity: 1;
  }


  .mainContact button {
    border: none;
    background-color: var(--blue);
    color: var(--white);
    max-width: 10rem;
    border-bottom-right-radius: var(--borderRadius);
    padding: .6em;
    font-weight: 500;
    font-size: var(--contactButton);
  }



  .mainContact .firstDivItems :nth-child(7) {
    margin-left: 15em;


  }




}











@media (max-width:50rem) {
  .mainContact .firstDiv {
    margin-top: 6em;

    width: 40rem;
    padding: 1em;
    display: flex;
    flex-wrap: wrap;
 
    justify-content: space-around;


    margin-bottom: 2em;


  }

  .mainContact .firstDiv img {

max-width: 30rem;

margin-right: 3rem;



  }

  .mainContact .firstDivItems {
    max-width: 30rem;
    padding: .5em;
    display: flex;
    flex-direction: column;
    align-self: center;
    /* background-color: red; */

  }

  .mainContact .firstDivItems div:nth-child(1) {

    font-size: var(--contactHeadline);
  }

  .mainContact .firstDivItems div:nth-child(2) {

    color: var(--grey);
  }

  .mainContact .firstDivItems div {
    padding: .5em;
    font-size: var(--contactText);
  }

  .mainContact input[type="text"] {
    max-width: 25rem;
    padding: .6em;
    border-bottom-right-radius: var(--borderRadius);
    border: .2em solid var(--blue);
    background-color: var(--black);
    color: var(--white);


    margin-bottom: 2em;

  }

  .mainContact input[type="email"] {
    max-width: 25rem;
    padding: .6em;
    border-bottom-right-radius: var(--borderRadius);
    border: .2em solid var(--blue);
    background-color: var(--black);
    color: var(--white);

    margin-bottom: 2em;

  }

        .mainContact select {
          max-width: 25rem;
          padding: .6em;
          border-bottom-right-radius: var(--borderRadius);
          border: .2em solid var(--blue);
          background-color: var(--black);
          color: var(--white);
    
    
          margin-bottom: 2em;
        }

  .mainContact ::placeholder {
    color: var(--white);
    opacity: 1;
    /* Firefox */
  }

  .mainContact ::-ms-input-placeholder {
    color: var(--white);
    opacity: 1;
  }


  .mainContact button {
    border: none;
    background-color: var(--blue);
    color: var(--white);
    max-width: 10rem;
    border-bottom-right-radius: var(--borderRadius);
    padding: .6em;
    font-weight: 500;
    font-size: var(--contactButton);
  }



  .mainContact .firstDivItems :nth-child(7) {
    margin-left: 15em;


  }




}









@media (max-width:40rem) {
  .mainContact .firstDiv {
    margin-top: 6em;

    width: 95%;
    padding: .5em;
    display: flex;
 
    justify-content: space-around;


    margin-bottom: 1em;


  }


.mainContact .firstDiv img {

  max-width: 100%;

  margin-right: 0rem;



}



  .mainContact .firstDivItems {
    max-width: 100%;
    padding: 1em;
    display: flex;
    flex-direction: column;
    /* background-color: red; */

  }

  .mainContact .firstDivItems div:nth-child(1) {

    font-size: var(--contactHeadline);
  }

  .mainContact .firstDivItems div:nth-child(2) {

    color: var(--grey);
  }

  .mainContact .firstDivItems div {
    padding: .5em;
    font-size: var(--contactText);
  }

  .mainContact input[type="text"] {
    max-width: 25rem;
    padding: .6em;
    border-bottom-right-radius: var(--borderRadius);
    border: .2em solid var(--blue);
    background-color: var(--black);
    color: var(--white);


    margin-bottom: 2em;

  }

  .mainContact input[type="email"] {
    max-width: 25rem;
    padding: .6em;
    border-bottom-right-radius: var(--borderRadius);
    border: .2em solid var(--blue);
    background-color: var(--black);
    color: var(--white);

    margin-bottom: 2em;

  }

  .mainContact ::placeholder {
    color: var(--white);
    opacity: 1;
    /* Firefox */
  }

  .mainContact ::-ms-input-placeholder {
    color: var(--white);
    opacity: 1;
  }


  .mainContact button {
    border: none;
    background-color: var(--blue);
    color: var(--white);
    max-width: 8rem;
    border-bottom-right-radius: var(--borderRadius);
    padding: .6em;
    font-weight: 500;
    font-size: var(--contactButton);
  }



  .mainContact .firstDivItems :nth-child(7) {
    margin-left: 0em;


  }




}









@media (max-width:25rem) {
  .mainContact .firstDiv {
    margin-top: 6em;

    width: 95%;
    padding: .5em;
    display: flex;

    justify-content: space-around;


    margin-bottom: 1em;


  }


        .mainContact .firstDiv img {
    

    
          align-self: center;
    
    
    
        }



  .mainContact .firstDivItems {
    max-width: 100%;
    padding: 1em;
    display: flex;
    flex-direction: column;


  }

  .mainContact .firstDivItems div:nth-child(1) {

    font-size: var(--contactHeadline);
  }

  .mainContact .firstDivItems div:nth-child(2) {

    color: var(--grey);
  }

  .mainContact .firstDivItems div {
    padding: .5em;
    font-size: var(--contactText);
  }

  .mainContact input[type="text"] {
    max-width: 100%;
    padding: .5em;
    border-bottom-right-radius: var(--borderRadius);
    border: .2em solid var(--blue);
    background-color: var(--black);
    color: var(--white);


    margin-bottom: 2em;

  }

  .mainContact input[type="email"] {
    max-width: 100%;
    padding: .5em;
    border-bottom-right-radius: var(--borderRadius);
    border: .2em solid var(--blue);
    background-color: var(--black);
    color: var(--white);

    margin-bottom: 2em;

  }

        .mainContact select {
          max-width: 25rem;
          padding: .5em;
          border-bottom-right-radius: var(--borderRadius);
          border: .2em solid var(--blue);
          background-color: var(--black);
          color: var(--white);
    
    
          margin-bottom: 2em;
        }

  .mainContact ::placeholder {
    color: var(--white);
    opacity: 1;
    /* Firefox */
  }

  .mainContact ::-ms-input-placeholder {
    color: var(--white);
    opacity: 1;
  }


  .mainContact button {
    border: none;
    background-color: var(--blue);
    color: var(--white);
    max-width: 8rem;
    border-bottom-right-radius: var(--borderRadius);
    padding: .6em;
    font-weight: 500;
    font-size: var(--contactButton);
  }



  .mainContact .firstDivItems :nth-child(7) {
    margin-left: 0em;


  }




}