<div class="container">

      <div class="row row-contact-2">

        <div class="col-xl-6 offset-3 col-lg-6 offset-2 col-md-8 offset-2 mx-auto">

          <!--Body-->

          <form class="card-body z-depth-2" action="mail.php" method="POST" novalidate>

            <h2 class="h2-responsive text-center text-white bg-primary py-3 z-depth-2">

              <i class="fa fa-pencil-alt fa-xs pr-1">

              </i>

              Kontaktni obrazec

            </h2>

            <fieldset>

              <!-- Material input name -->

              <div class="md-form md-bg mb-5">

                <i class="fa fa-user prefix my-fa-user-icon">

                </i>

                <input name="name" type="text" class="form-control validate" id="orangeForm-name" required>

                <label data-error="Napaka!" data-success="Pravilno">Ime in priimek

                  <span class="text-danger pl-1">*

                  </span>

                </label>

              </div>

              <!-- Material input email -->

              <div class="md-form md-bg mb-5">

                <i class="fa fa-envelope prefix my-fa-envelope-icon">

                </i>

                <input name="email" type="email" class="form-control validate" id="orangeForm-email" required>

                <label data-error="Napaka!" data-success="Pravilno">Email

                  <span class="text-danger pl-1">*

                  </span>

                </label>

              </div>

              <!-- Material input phone -->

              <div class="md-form md-bg mb-5">

                <i class="fas fa-phone fa-rotate-90 prefix my-fa-phone-icon">

                </i>

                <input name="phone" type="tel" class="form-control validate" id="orangeForm-phone" required>

                <label data-error="Napaka!" data-success="Pravilno">Tel. št.

                  <span class="text-danger pl-1">*

                  </span>

                </label>

              </div>

              <!-- Material textarea message -->

              <div class="md-form md-bg mb-5">

                <i class="fas fa-edit prefix my-fa-edit-icon"></i>

                <textarea name="message" id="orangeForm-mesage" class="md-textarea form-control" rows="3"

                  required></textarea>

                <label data-error="Napaka!" data-success="Pravilno">Sporočilo

                  <span class="text-danger pl-1">*

                  </span>

                </label>

              </div>

              <p class="grey-text text-right">

                <span class="text-danger pr-1">*

                </span>=Zahtevano

              </p>

              <!-- Material unchecked -->

              <div class="form-check my-3">

                <input type="checkbox" class="form-check-input" id="materialUnchecked" required>

                <label class="form-check-label" for="materialUnchecked">Strinjam se s splošnimi pogoji poslovanja centra

                  Holos in politiko varovanja osebnih podatkov!

                </label>

              </div>

            </fieldset>

            <div class="g-recaptcha mt-4" data-sitekey="6LesYV8UAAAAAFemD2towAKqCciQfNSTwsq9wcvY">

            </div>

            <button class="btn btn-primary mt-5 mb-4 my-btn-2" type="submit" onclick="validateForm()">Pošlji

            </button>

          </form>

        </div>

      </div>

    </div>

textarea {

    background-color: transparent !important;

}

input{

    background-color: transparent !important;

}

​