.contact-section{
  display: flex;
  gap: 40px;
  flex-direction: row-reverse;

  text-align: right;

  padding: 40px;
}

.contact-information-box{
  height: 100%;
  width: 38%;
}

.contact-information-box h1{
  font-size: 30px;

  margin-bottom: 10px;
}

.contact-information-box h3{
  font-size: 25px;
  margin-bottom: 40px;
}

.contact-information-box p{
  color: var(--main--text--gray--color);
}

.text1,
.text2,
.contact-means-information-box div{
  font-size: 14px;
}

.text1{
  margin-bottom: 20px;
}

.text2{
  margin-bottom: 40px;
}

.contact-means-information-box div{
  margin-bottom: 22px;

  margin-right: 40px;

  /* for svgs */
  position: relative;
}

.contact-means-information-box svg{
  stroke: var(--main--gray--color);
  position: absolute;

  top: -5px;
  right: -40px;
}

.contact-means-information-box a:link,
.contact-means-information-box a:active
{
  color: var(--main--text--color) !important;
  margin-right: 5px;

  text-decoration: none;
}

.contact-means-information-box a:hover,
.contact-means-information-box a:visited{
  color: var(--selected--main--color);
}



.form-box{
  width: 73%;
  height: 100%;

  border: 1px solid var(--main--gray--color);

  color: var(--main--text--gray--color);

  box-shadow: -5px 5px 0px var(--main--gray--color);
}

.customer-form p,
.customer-form button{
  margin: 20px;
}

.form-head-text{
  font-size: 14px;
}

.customer-info-box{
  padding: 20px;

  border-bottom: 1.5px dotted var(--main--gray--color);

  /* background-color: var(--main--body--color); */

  background-image: linear-gradient(
    45deg,
    var(--main--body--color),
    var(--main--body--color--shade),
    var(--main--body--color)
  );
}

.customer-info-box1,
.customer-info-box2{
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  gap: 8px;


}

.customer-info-box1 input,
.customer-info-box1 select,
.big-text{
  text-align: right;
  font-family: inherit;

  padding: 10px;
  background-color: var(--input--color);
  color: var(--main--text--gray--color);

  border: none;
  border-bottom: 1px solid var(--nav-color-1);
}

/* disables arrows in the number input type */
input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

.customer-info-box2 div{
  position: relative;
}

.customer-info-box2 input{
  width: 24px;
  height: 24px;

  position: absolute;

  right: 120px;
}

.big-text{
  font-size: 14px;
}

.btn-submit{
  margin: 30px 45px !important;
}