<?php include("header.php"); ?>


<style>

.jumbotron {
    color: white;
    background-image: url("../img/bg-contact-scaled1.jpg");
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    height: 700px !important;
    margin-top: -80px !important;
}

.jumbotron {
    padding-top: 15%;
    padding-bottom: 30%;
}

.jumbotron h1 {
    font-family: 'Lato', sans-serif;
}

.jumbotron p {
    font-family: 'Lato', sans-serif;
}

.hero-img {
    background-image: url("../img/bg-contact-scaled1.jpg") !important;
}

</style>


  <!-- HERO START -->

  <div class="jumbotron jumbotron-fluid hero-img">
       <div class="container">

       <h1 class="text-second">Turn more leads into sales.</h1> 
        <h1 lass="text-first">Request Pricing.</h1>
        <h1 class="text-second" style="font-weight: 300; font-size: 36px; color: #0c1d2d !important"><a href="Tel: +1 (561) 716-3703">+1 (561) 716-3703</a>
      </div>
      </div>

  <!-- HERO START -->


<div class="container" style="padding: 50px 0 100px 0px">
<div class="row">
<div class="col-md-12">

<h1 lass="text-first">Contact Us</h1>

<form action="mailto: [email protected]" method="POST" enctype="multipart/form-data" name="Monetized Marketing Group">
<div class="row">

<div class="col-md-6 col-sm-6">

<div class="form-group">
<label for="exampleInputEmail1">First Name</label>
    <input type="text" class="form-control form-field" name="" id="firstname" aria-describedby="firstname" placeholder="Enter First Name">
  </div>
  </div>

  <div class="col-md-6 col-sm-6">

  <div class="form-group">
  <label for="exampleInputEmail1">Last Name</label>
    <input type="text" class="form-control form-field" name="lastname" id="lastname" aria-describedby="lastname" placeholder="Enter Last Name">
  </div>
  </div>
  </div>


<div class="row">

<div class="col-md-6 col-sm-6">
  <div class="form-group">
    <label for="exampleInputEmail1">Email Address</label>
    <input type="email" class="form-control form-field" name="email" id="email" aria-describedby="email" placeholder="Enter Email Address">
  </div>
  </div>

  <div class="col-md-6 col-sm-6">
  <div class="form-group">
    <label for="exampleInputEmail1">Phone Number</label>
    <input type="phone" class="form-control form-field" name="phone" id="phone" aria-describedby="phone" placeholder="Enter Phone Number" maxlength="10" minlength="10">
  </div>
  </div>

  <div class="col-md-12 col-sm-12">

  <div class="form-group">
    <label for="exampleFormControlTextarea1 form-field">Enter Your Message</label>
    <textarea class="form-control" name="messages" id="messages" rows="3"></textarea>
  </div>
  <button type="submit" class="button">Submit</button>

  </div>

</form>
</div>
</div>
</div>
</div>

<script>
        var form = $("#contact");
        form.validate({
            errorPlacement: function errorPlacement(error, element) {
                element.before(error);
            },
            rules: {
                firstname: {
                    required: true

                },
                lastname: {
                    required: true
                },
           
             
                phone: {
                    required: true,
                },
                email: {
                    required: true
                },
           
    
            },

            messages: {
                phone: {
                    required: "Please enter a valid phone number"
                },
          

            },

        });
</script>

<?php include("footer.php"); ?>