{literal}
<style>
    .contact_us_from {
        color: #fff;
        background-color: #2685b8;
        width: 100%;
        padding: 15px 8px 2px 8px;
        margin-left: 0px;
        font-size: 12px;
        margin-top: 5px;
        -webkit-font-smoothing: antialiased;
        -moz-osx-font-smoothing: grayscale;
    }
    .contact_us_from .input_box:focus {
    box-shadow: 0 0 10px 0 #ffffff;
}
    .contact_us_from .ui-focus, .contact_us_from .ui-btn:focus {
        -moz-box-shadow: none !important;
        -webkit-box-shadow: none !important;
        box-shadow: none !important;
    }

    .contact_us_from p {
        margin-bottom: 8px;
        margin-top: 0;
        line-height: 24px;
        font-size: 16px;
        color: #fff;
        letter-spacing: 0;
      /*  -webkit-font-smoothing: antialiased;
        -moz-osx-font-smoothing: grayscale;*/
        text-shadow: none;
  /*      display: -webkit-box;
        display: -moz-box;
        display: -ms-flexbox;
        display: -webkit-flex;
        display: flex;*/
    }

    .contact_us_from p span {
        font-size: 16px !important;
        font-weight: inherit !important;
        float: none !important;
        width: inherit !important;
        line-height: inherit !important;
    }

    .contact_us_from .input_box {
        height: 44px;
        border-radius: 0;
        border: 1px solid #111;
        box-sizing: border-box;
        font-size: 16px;
        color: #000;
        width: 100%;
        margin-top: 0px;
        margin-bottom: 0px;
    }

    .contact_us_from .input_box.full-box {
        width: 100%;
    }

    .contact_us_from .add_comment {
        color: #0090c0;
        cursor: pointer;
        font-weight: 600;
    }

    #contactus_submit {
        background-color: #ffd02b;
        width: 100%;
        border: 2px solid;
        border-radius: 5px;
        font-weight: 600;
        margin-top: 3px;
        cursor: pointer;
        color: #000;
        padding: 10px 15px;
        line-height: normal;
        font-size:16px;
    }


    #peicedrop_check {
        margin-right: 5px;
        margin-bottom: 10px;
        display: inline-block;
        vertical-align: top;
        float: left;
    }

    .contact_num_p {
        font-weight: 600;
    }

/*    .contact_num_p strong {
   
        color: #fff !important;
        font-weight: 600;
        font-size: 15px;
    }*/

    #cu_fname, #cu_lname {
        flex: 1 0 0; /*max-width: 60px;*/
    }

    .hii_name_p span {
        padding-right: 5px; /*flex: 1 0 0;*/
    }

    #cu_fname {
        margin-right: 4px;
    }

    .contact_us_from .ccz_p span { /*flex: inherit;*/
        padding-right: 5px;
    }

    #cu_country, #cu_city, #cu_zip { /*max-width: 41px;*/
        flex: 1 0 0;
        margin-right: 4px;
    }

    #cu_zip {
        margin-right: 0px;
    }

    .reach_p span { /*flex: 1 0 0;*/
        padding-right: 5px;
    }

    #cu_phone { /*max-width: 78px;*/
        flex: 1 0 0;
    }

/*
    .email_p span {
        width: 35% !important;
        padding-right: 5px;
    }*/

    #cu_email { /*max-width: 157px;*/
        flex: 1 0 0;
    }

    .thank_p {
        text-align: center;
    }

    .btn_p {
        display: block !important;
        text-align: center;
    }

    .by_sele_p {
        display: block !important;
        color: #5f5f5f !important;
        line-height: 15px !important;
    }

    .check_p {
        display: block !important;
        font-weight: 600;
        line-height: 15px !important;
    }

    .contact_num_p {
        display: block !important;
    }

    .add_comment_block {
    }

    .intres_p {
        display: block !important;
    }

    .intres_p #interested {
        display: block;
    }

    .intres_p #interested option {
        width: 100%;
        display: block;
    }

    .intres_p .ui-select .ui-btn {
        background: #fff;
        border: 1px solid #000;
        display: block;
        color: #000 !important;
        text-shadow: inherit !important;
    }

    .intres_p .ui-select .ui-icon.ui-icon-arrow-d.ui-icon-shadow {
        width: 18px !important;
        height: 18px !important;
        display: block;
    }

    .check_p .ui-checkbox {
        float: left;
        margin-right: 5px;
    }

    .check_p .ui-checkbox #cu_peicedrop_check {
        position: relative;
        left: 0;
        top: 1px;
        height: 12px;
        width: 12px;
    }

    .contact_us_from .input_box:focus {
        border-color: #000 !important;
      /*  box-shadow: none !important;*/
    }

    .contact_us_from textarea#cu_comment:focus {
        border-color: #000 !important;
        box-shadow: none !important;
    }

    #contectus_thanks {
        background: #eee;
        display: block;
        height: auto;
        left: 0;
        outline: 0;
        top: 162.6px;
        z-index: 1002;
        width: 100%;
        padding: 0 15px 15px;
        margin: 0 auto
    }

    .tip-yellow {
        z-index: 1000;
        text-align: left;
        border: 1px solid #939393;
        padding: 7px;
        min-width: 50px;
        max-width: 530px;
        color: #fff;
        background-color: #fef9d9;
        background-image: url(images/tip-black.png); /* bgImageFrameSize>= 10 should work fine */
    }

    .tip-yellow .tip-arrow-top {
        margin-top: -7px;
        margin-left: 15px;
        top: 0;
        left: 0;
        width: 16px;
        height: 10px;
        background: url(images/tip-yellow_arrows.png) no-repeat;
    }

    .tip-yellow .tip-arrow-right {
        margin-top: -9px; /* approx. half the height to center it */
        margin-left: -4px;
        top: 50%;
        left: 100%;
        width: 10px;
        height: 20px;
        background: url(images/tip-black_arrows.png) no-repeat -16px 0;
    }

    .tip-yellow .tip-arrow-bottom {
        margin-top: -6px;
        margin-left: 15px;
        top: 100%;
        left: 0;
        width: 16px;
        height: 13px;
        background: url(images/tip-black_arrows.png) no-repeat -32px 0;
    }

    .tip-yellow .tip-arrow-left {
        margin-top: -9px; /* approx. half the height to center it */
        margin-left: -6px;
        top: 50%;
        left: 0;
        width: 10px;
        height: 20px;
        background: url(images/tip-black_arrows.png) no-repeat -48px 0;
    }

/*    #company {
        margin-left: 17px;
        width: 73% !important;
    }*/



    span.ui-icon.ui-icon-arrow-d {
        width: 18px !important;
        height: 18px !important;
        display: block;
    }
    textarea#cu_comment{
        border-radius: 0;
        box-shadow: none;
        border: 1px solid #111;
    }
    .contact_num_p {

    text-align: center;
}
.ui-checkbox .ui-btn-corner-all{border-radius: 0;}
.privacy a:hover {
    color: #cb505a;
}
.privacy a:active,.privacy a:link, .privacy a:visited {
    color: #58c5ff;
    text-decoration: none;
}
.privacy-link.ui-link:visited{
     color: #58c5ff !important;
}
p.privacy {
    text-align: center;
    display: block;
}
.changePlaceColor1::-webkit-input-placeholder {
   color:    red;
}

.changePlaceColor2:-moz-placeholder {
   color:    red;
}
.changePlaceColor3::-moz-placeholder {
   color:    red;
}
.changePlaceColor4:-ms-input-placeholder {
   color:    red;
} 
.red_error{
  border: 1px solid #f70303 !important;
}

</style>
<script>
    $(document).ready(function () {
        // $('#demo-basic-price2').poshytip();
        $('.add_comment').click(function () {

            if ($('.add_comment_block').css('display') == 'none')
                $('.add_comment_block').fadeIn().css('display', 'block');
            //~ $('.add_comment_block').stop().css('display','table-row').hide().slideDown();
            else
                $('.add_comment_block').css('display', 'none');

        });

        $('span.ui-icon.ui-icon-arrow-d.ui-icon-shadow').removeClass('ui-icon-shadow');

        $('input[type="checkbox"]').click(function () {

            if ($("#keep_pavement").is(":checked")) {
                $(this).val('true');
            } else {
                $(this).val('false');
            }

        });
        $('#contactus_submit').click(function(e){
        e.preventDefault();
        var input_val = $("#cu_fname").val();
        var cu_lname_val = $("#cu_lname").val();
        var cu_email = $("#cu_email").val();
        var cu_zip = $("#cu_zip").val();
        if(input_val != '' && cu_lname_val != '' &&  cu_email != '' && cu_zip != '') { 
          window.location.href='https://www.pavementgroup.com/thank-you';
        } 
      });
        $('#demo-basic-price2').poshytip();
    });
</script>

<style>
    #div-email-to-friend11 {
        position: relative;
        margin: 0 auto;
    }
</style>
{/literal}

<div style="clear: both;"></div>

<div style="clear: both;"></div>

 <div class="contact_us_from">
    <input type="hidden" id="contact_us_product" value="true">
        <input type="hidden" name="pid" id="pid" value="{$product.pid}" />
        <input type="hidden" name="new_cat_hid" id="new_cat_hid" value="{$product.cid}" />
        <input type="hidden" name="raq_uid" id="raq_uid" value="{$userdata.uid}" />
        <input type="hidden" name="cu_price_prop_flag" id="cu_price_prop_flag" value="" />
        <input type="hidden" name="cu_notify_flag" id="cu_notify_flag" value="" />
 <!--    <div>
      <p class="contact_num_p"><strong>518-218-7676</strong></p>
    </div> -->
    <div>
<!--       <p class="contact_num_p"><strong>CONTACT ME ABOUT THIS ITEM <br>
See why a thousand customers from
30 countries rely on PavementGroup</strong></p> -->
    </div>
    <p class="fisrt_name">
      <span>First Name</span>
      <input class="input_box" id="cu_fname" type="text" autocomplete="on" required>
    </p>
    <p class="last_name">
      <span>Last Name</span>
      <input class="input_box" type="text" id="cu_lname" autocomplete="on" required>
    </p>
   <!--  <div class="radio">
        <p>What’s the best way to contact you?</p>
        <div class="radio_btn">
        <label for="by_email">
          <input type="radio" name="contact_type" id="by_email" value="Email" required="required"> Email
        </label>
        <label for="by_phone">
          <input type="radio" name="contact_type" id="by_phone" value="Phone" required="required"> Phone
        </label>
        </div>
    </div> -->
    <p class="email_p">
      <span>Email</span>
      <input class="input_box" id="cu_email" type="text" >
    </p>
      <p class="reach_p">
      <span>Phone</span> 
      <input class="input_box" id="cu_phone" autocomplete="on" type="text">
    </p>
     <p class="test_class">
      <span>ZIP/Postal Code</span><input class="input_box" autocomplete="on" id="cu_zip" type="text" >
    </p>
<!--     <p class="ccz_p">
      <span>City</span>
      <input class="input_box" type="text" id="cu_city" >
    </p>
 -->    <p>
       <span>How can we help you?</span>
       <textarea id="cu_comment"  style="width:100%;" autocomplete="on" rows="3"></textarea>
    </p>
<!--     <p>
        <select id="interested"  style="width:100%">
                <option value="1">I’m interested</option>
                <option value="2">What’s your best price</option>
                <option value="3">I’d like to make an offer</option>
        </select>
    </p> --> 
        <p class="check_p">
        <!-- <input type="checkbox" name="cu_peicedrop_check" id="cu_peicedrop_check" value="">&nbsp;Email me price drops & new listings for my search -->
 <!--        <label for="cu_peicedrop_check" class="email-check">
                <input type="checkbox" name="cu_peicedrop_check" id="cu_peicedrop_check" value="false">&nbsp;Yes, keep me in the know about PavementGroup.
              </label> -->
            </p>

           <label for="keep_pavement">
     <input type="checkbox" name="keep_pavement" id="keep_pavement" value="false">&nbsp;Yes, keep me in the know about PavementGroup.
    </label>

                 
                <!--  <p class="company">
      <span>Company (Optional) </span> 
      <input class="input_box" type="text" autocomplete="on" id="company" >
    </p> -->

    <p class="btn_p">
      <input type="button" name="contactus_submit" id="contactus_submit" value="CONTACT ME">
    </p>
    <p class="privacy"> Your <a href="security-privacy" class="privacy-link">&nbsp;Privacy&nbsp;</a> matters to us.</p>

         <!--    <p class="cep_title"><strong>{if $product.product_id}{$product.product_id|htmlspecialchars}, {/if} {if $product.manufacturer_name}{$product.manufacturer_name|htmlspecialchars}, {/if} {if $product.model}{$product.model}{/if}</strong></p> -->

        <!--     <p class="ccz_p"><span>I'm in</span><input class="input_box" id="cu_country" type="text" value="USA"><span>Zip</span><input class="input_box" id="cu_zip" type="text" placeholder=" zip"></p> -->

           

            
         <!--    <p class="thank_p"><span style="font-weight:600 !important; margin-right: 5px;">Thank You!</span> <a class="add_comment"><u>(Add comments)</u></a></p>
           <p class="add_comment_block" style="display:none;"> -->

                
            <!-- </p>

            <p class="btn_p"><input type="button" name="contactus_submit" id="contactus_submit" value="Submit"></p>
            <p class="check_p"><input type="checkbox" name="cu_peicedrop_check" id="cu_peicedrop_check" value="">&nbsp;Email me price drops & new listings for my search
           
            </p>
            <p class="by_sele_p">By selecting Submit, I agree to the <a href="security-privacy" style="color: #0090c0;">Privacy Policy</a> & <a href="terms-and-conditions" style="color: #0090c0;"> Terms of Use</a> </p> -->

        </div>
        <div style="display:none;"><a href="popup_20.html" data-mfp-src="#test-popup" class="contactus-success"></a>
		</div>
  <div  class="invisible" style="text-align: center">
<div id="div-email-to-friend11" class="div-email-to-friend fieldset clearfix gap-bottom {class file=$smarty.template editable=true}" style="margin-bottom: 0px;">

<p style="color:green; font-weight:bold; text-align: center; font-family: Arial, Helvetica, sans-serif !important;font-size: 12px !important;padding-bottom:15px;     margin: 25px 0 15px;
    padding: 0;">
          Thank you for contacting us!<br>We will reply shortly


         </p>

</div>
&nbsp;
</div>