.contact-frame {
      background-color: var(--gr);
      padding: 2rem;
      color: var(--nv);
      display: flex;
      justify-content: space-between;

}

.contact-form {
      width: 49%;
}

.contact-form-row {
      width: 100%;
      /* width: 50%; */
      padding: 0.5rem;
      border-bottom: 1px var(--gr20) solid;
}

.contact-form-field {
      width: 100%;
      display: flex;
      justify-content: space-between;
      margin-bottom: 0.6rem;
}



.contact-form-field input,
select {
      width: 60%;
      height: 2rem;
      border-radius: 8px;
      border: 1px var(--gr20) solid;
      font-family: Iransansweb;
      color: var(--nv)
}

/* Chrome, Safari, Edge, Opera */
input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
      -webkit-appearance: none;
      margin: 0;
}

/* Firefox */
input[type=number] {
      direction: ltr;
      -moz-appearance: textfield;
}

.contact-row-title {
      color: var(--gr20);
      font-size: small;
}

.ltr {
      direction: ltr;
}

#inq-content {
      width: 60%;
      resize: vertical;
      border-radius: 8px;
}

#technical-content {
      width: 60%;
      resize: vertical;
      border-radius: 8px;
}

/* .ver {
                  flex-direction: column;
            } */
label {
      max-width: 39%;
}

h5 {
      max-width: 39%;
}

select {
      text-align: center;
}

input:focus {

      outline-color: var(--nvlight);
}

textarea:focus {

      outline-color: var(--nvlight);
}

select:focus {

      outline-color: var(--nvlight);
}

.alert {
      outline-color: var(--redAlert);
      border-color: var(--redAlert);
      background-color: var(--pinkAlert);
}

.alert-text {
      color: var(--redAlert);
}

.succeed-text {
      color: var(--greenText);
}

.star {
      color: rgb(209, 1, 1);
}

.vertical-center {
      display: flex;
      flex-direction: column;
      justify-content: center;
      align-items: center;
}

.btn-primary {
      font-family: 'Iransansweb';
      background-color: var(--bl);
      color: var(--vw);
      font-size: large;
      font-weight: bold;
      padding: 0.5rem 1.5rem;
      border: 2px var(--gr20) solid;
      border-radius: 12px;
}

.btn-primary:hover {
      background-color: var(--bldark);
      border-color: var(--gr20);
      /* color: var(--nvlight); */
      cursor: pointer;
      /* scale: 1.02; */
      transition: 400ms;
}

.btn-primary:active {
      background-color: var(--bldark);
      border-color: var(--gr20);
      /* color: var(--nvlight); */
      cursor: pointer;
      scale: 1.02;
      transition: 400ms;
}

.faq-frame {
      padding: 2rem;
      border-right: 2px solid var(--gr20);
}

.faq-question {
      font-weight: bold;
      padding-top: 1rem;
      cursor: pointer;
}

.faq-answer {
      display: none;
      cursor: pointer;
      /* height: 1.6rem; */
      /* overflow-y: hidden; */
      /* position: relative; */
      /* top: -1.6rem; */
      /* transition: 500ms; */
}

.rm {
      position: relative;
      z-index: 2;
      top: 0;
      right: 0;
      text-align: end;
      /* background: linear-gradient(180deg, rgba(247, 247, 247, 0.01) 0%, rgba(247, 247, 247, 0.01) 50% rgba(247, 247, 247, 1) 100%); */
      background: linear-gradient(90deg, #D9D9D9 0%, #D9D9D9 20%, #D9D9D944 60%, #D9D9D901 70%);
      cursor: pointer;
}

@media (max-width: 767px) {
      .h1-phone {
            font-size: xx-large;
      }

      .contact-frame {
            padding: 0.5rem;
            flex-direction: column;
            /* width: 98%; */
      }

      .contact-form {

            width: 98%;
      }

      .contact-form-row {
            width: 96%;
            padding: 0.5rem;
            border-bottom: 1px var(--gr20) solid;
      }

      .faq-frame {
            padding: 2rem;
            border-right: none;
      }
}