@extends('frontend.layouts.app')
 <meta name="description" content="Quality construction demands everlasting strength" />
 <meta name="author" content="Quality construction demands everlasting strength" />
 <meta name="keywords" content="Quality construction demands everlasting strength" />
 @section('metades')

 @endsection
 @section('title')
 <title>Grace</title>
 @endsection
 @section('css')
 <style>
 </style>
 @endsection
 @section('content')
 <!-- Hero_section_start -->
 <section>
     <div class="Banner_section">

         <div class="row">
             <div class="col-lg-6">
                 <div class="founder_text">
                     <h2>FOUNDRY <span>CASTING</span></h2>
                 </div>
             </div>
             <div class="col-lg-6">
                 <div class="yellow_bg">
                     <div class="remov_bg_text text">
                         <h2>MANU FACT URING</h2>
                     </div>
                 </div>
             </div>
         </div>
     </div>
 </section>
 <!-- shaping_Your_World -->
 <section class="bg_color_blue">
     <div class="shaping">
         <div class="container">
             <div class="row">
                 <div class="col-lg-6">
                     <div class="shaping_text same">
                         <h2>SHAPING YOUR WORLD</h2>
                         <h1>WIDTH STRENGTH</h1>
                         <P>Quality construction demands everlasting strength.<br> We at Grace are committed to delivering the strength<br> your project needs. Established in the year 1992, the<br> manufacturing and supply of M.S Structural Rolling<br> Products have now evolved into an integrated steel<br> product portfolio brand meeting the highest international<br> standards.
                         </P>
                         <div class="know_more_btn">
                             <a href="#">KNOW MORE</a>
                         </div>
                     </div>
                 </div>
                 <div class="col-lg-6">
                     <div class="border_up_img same">
                         <div class="borde">
                         </div>
                         <img src="frontend/asset/Img/chain.png" alt="" class="fluid">
                     </div>
                 </div>
             </div>
         </div>
     </div>
 </section>
 <!-- What_we_do_section_start -->
 <section id="What_we_do_section">
     <div class="portfolio_heading">
         <h2>PRODUCT</h2>
         <h2 class="port">PORTFOLIO</h2>
     </div>
     <div class="what_we_do">
         <div class="container">
             <div class="heading_we_do">
                 <h2>WHAT WE DO</h2>
             </div>
             <div class="row">
                 <div class="col-lg-3">
                     <div class="product_details">
                         <img src="frontend/asset/Img/product.png" alt="">
                         <div class="know_more">
                             <h6>FOUNDRY CASTINGS</h6>
                             <a href="{{url('/productfoundry')}}">READ MORE</a>
                         </div>
                     </div>
                 </div>
                 <div class="col-lg-3">
                     <div class="product_details">
                         <img src="frontend/asset/Img/product_2.png" alt="">
                         <div class="know_more">
                             <h6>ROLLS DIVISION</h6>
                             <a href="{{url('rollsdivision')}}">READ MORE</a>
                         </div>
                     </div>
                 </div>
                 <div class="col-lg-3">
                     <div class="product_details">
                         <img src="frontend/asset/Img/product_3.png" alt="">
                         <div class="know_more">
                             <h6>STRUCTURAL STEEL</h6>
                             <a href="">READ MORE</a>
                         </div>
                     </div>
                 </div>
                 <div class="col-lg-3">
                     <div class="product_details">
                         <img src="frontend/asset/Img/product_4.png" alt="">
                         <div class="know_more">
                             <h6>BILLET</h6>
                             <a href="{{url('/billets')}}">READ MORE</a>
                         </div>
                     </div>
                 </div>
             </div>

             <div class="product_details_bottom_text">
                 <h2>OUR GALLERY</h2>
             </div>
         </div>
     </div>
 </section>
 <!-- What_we_do_section_End -->
 <!-- Gallery_carusel -->
 <section id="olw_up">
     <div class="owl-carousel parent-container">
         <div class="test-popup-link image_link'">
             <a href="frontend/asset/Img/product_3.jpg"><img src="frontend/asset/Img/product_3.jpg" alt=""></a>
         </div>
         <div class="test-popup-link image_link'">
             <a href="frontend/asset/Img/product_4.jpg"><img src="frontend/asset/Img/product_4.jpg" alt=""></a>
         </div>
         <div class="test-popup-link image_link'">
             <a href="frontend/asset/Img/product_2.jpg"><img src="frontend/asset/Img/product_2.jpg" alt=""></a>
         </div>
         <div class="test-popup-link image_link'">
             <a href="frontend/asset/Img/product_5.jpg"><img src="frontend/asset/Img/product_5.jpg" alt=""></a>
         </div>
         <div class="test-popup-link image_link'">
             <a href="frontend/asset/Img/product_6.jpg"><img src="frontend/asset/Img/product_6.jpg" alt=""></a>
         </div>
         <div class="test-popup-link image_link'">
             <a href="frontend/asset/Img/product_1.jpg"><img src="frontend/asset/Img/product_1.jpg" alt=""></a>
         </div>
         <div class="test-popup-link image_link'">
             <a href="frontend/asset/Img/product_3.jpg"><img src="frontend/asset/Img/product_3.jpg" alt=""></a>
         </div>
         <div class="test-popup-link image_link'">
             <a href="frontend/asset/Img/product_4.jpg"><img src="frontend/asset/Img/product_4.jpg" alt=""></a>
         </div>
         <div class="test-popup-link image_link'">
             <a href="frontend/asset/Img/product_2.jpg"><img src="frontend/asset/Img/product_2.jpg" alt=""></a>
         </div>
         <div class="test-popup-link image_link'">
             <a href="frontend/asset/Img/product_5.jpg"><img src="frontend/asset/Img/product_5.jpg" alt=""></a>
         </div>
         <div class="test-popup-link image_link'">
             <a href="frontend/asset/Img/product_6.jpg"><img src="frontend/asset/Img/product_6.jpg" alt=""></a>
         </div>
         <div class="test-popup-link image_link'">
             <a href="frontend/asset/Img/product_7.jpg"><img src="frontend/asset/Img/product_7.jpg" alt=""></a>
         </div>

        
     </div>
 </section>
 <!-- video_section start-->
 <section>
     <div class="video_section">
         <video autoplay="" loop="" muted>
             <source type="video/mp4" src="frontend/asset/Img/constraction.mp4">
         </video>
     </div>
 </section>
 <!-- video_section End-->
 <!-- our_mangment_section -->
 <section id="our_mangment">
     <div class="mangenment">
         <div class="container">
             <div class="row">
                 <div class="col-lg-12 swper">
                     <div class="swiper">
                         <!-- Additional required wrapper -->
                         <div class="swiper-wrapper swiper_item">
                             <!-- Slides -->
                             <div class="swiper-slide">
                                 <h6>SAGAR P.RAWAL</h6>
                                 <p>Their work is of outstanding quality, they are clearly experts in their field, there is incredible peace of mind knowing that you're in the hands of professionals there is incredible peace of mind knowing that you're
                                     in the hands of professionals.
                                 </p>
                             </div>
                             <div class="swiper-slide">
                                 <h6>SAGAR P.RAWAL</h6>
                                 <p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Hic similique eos saepe animi consequuntur voluptatem libero! Perferendis iusto saepe nisi magni eaque error culpa veritatis? Voluptatem non aliquam fugit explicabo
                                     tenetur reprehenderit, iste reiciendis placeat quo deserunt, expedita illum nam! In nihil error temporibus debitis, hic laborum. Error, aut voluptatem nam natus,
                                 </p>
                             </div>
                             <div class="swiper-slide">
                                 <h6>SAGAR P.RAWAL</h6>
                                 <p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Hic similique eos saepe animi consequuntur voluptatem libero! Perferendis iusto saepe nisi magni eaque error culpa veritatis? Voluptatem non aliquam fugit explicabo
                                     tenetur reprehenderit, iste reiciendis placeat quo deserunt, expedita illum nam! In nihil error temporibus debitis, hic laborum. Error, aut voluptatem nam natus,
                                 </p>
                             </div>
                         </div>
                         <!-- If we need pagination -->
                         <div class="swiper-pagination pagination_box">
                         </div>
                         <!-- If we need scrollbar -->
                         <!-- <div class="swiper-scrollbar"></div> -->
                     </div>
                 </div>
             </div>
         </div>
     </div>
     <div class="container">
         <div class="row">
             <div class="our_box">
                 <h2><span>OUR</span> MANAGEMENT</h2>
             </div>
             <div class="col-md-4 col-sm-4">
                 <div class="our_text">
                     <h2>MOHIT<br>MARDIA</h2>
                     <P>Managing Director</P>
                 </div>
             </div>
             <div class="col-md-4 col-sm-4">
                 <div class="our_text">
                     <h2>HITESH<br>SHAH</h2>
                     <P>Wholetime Director</P>
                 </div>
             </div>
             <div class="col-md-4 col-sm-4">
                 <div class="our_text">
                     <h2>VIDYUT<br>KAPADIYA</h2>
                     <P>Director</P>
                 </div>
             </div>
         </div>
     </div>
 </section>
 <!-- our_mangment_section -->
 <!-- Get_in_touch_section_start -->
 <section id="get_in_touch">
     <div class="get_touch">
         <div class="container">
             <div class="row">
                 <div class="col-lg-6">
                     <div class="heading_get_touch">
                         <h2><span>GET IN</span>TOUCH</h2>
                     </div>
                     <div class="contact_section">
                          
                         <form action="{{ route('contactUsSave') }}" method="post" class="place">
						 @csrf
						 @if(Session::has('message'))
						   <p class="alert alert-info">{{ Session::get('message') }}</p>
						@endif
                             <input type="text" name="name" id="name" required class="form-control" placeholder="FULL NAME" aria-label="Username" aria-describedby="basic-addon1">
							 <span id="nameErr" style="color:red"></span>
                             <input type="email" id="email" required name="email_address" class="form-control" placeholder="EMAIL ADDRESS" aria-label="Username" aria-describedby="basic-addon1">
                             <input type="tel" class="form-control" required id="mobile" name="mobile_number" placeholder="PHONE NUMBER" aria-label="Username" aria-describedby="basic-addon1">
                             <textarea class="form-control" required placeholder="YOUR MESSAGE" id="message" name="message" rows="3"></textarea>
                         
                         <div class="submit_now">
                             <button type="SUBMIT NOW" id="submitBtn" name="submit">SUBMIT NOW</button>
							 
                         </div>
						 </form>
                     </div>
                 </div>
                 <div class="col-lg-6">
                     <div class="heading_get_touch">
                         <h2><span>OUR</span>CLIENTS</h2>
                         <div class="our_clients">
                             <!-- <div class="row">
                                    <div class="col-lg-4">
                                        <div class="client">
                                            <a href="#"><img src="asset/Img/logo_1.png" alt=""></a>
                                        </div>
                                    </div>
                                    <div class="col-lg-4">
                                        <div class="client">
                                            <a href="#"><img src="asset/Img/logo_2.jpg" alt=""></a>
                                        </div>
                                    </div>
                                    <div class="col-lg-4">
                                        <div class="client">
                                            <a href="#"><img src="asset/Img/log_3.jpg" alt=""></a>
                                        </div>
                                    </div>
                                    <div class="col-lg-4">
                                        <div class="client">
                                            <a href="#"><img src="asset/Img/logo_1.png" alt=""></a>
                                        </div>
                                    </div>
                                    <div class="col-lg-4">
                                        <div class="client">
                                            <a href="#"><img src="asset/Img/logo-ashishinfracon.png" alt=""></a>
                                        </div>
                                    </div>
                                    <div class="col-lg-4">
                                        <div class="client">
                                            <a href="#"><img src="asset/Img/lpgo_5.png" alt=""></a>
                                        </div>
                                    </div>
                                    <div class="col-lg-4">
                                        <div class="client">
                                            <a href="#"><img src="asset/Img/logo_6.jpg" alt=""></a>
                                        </div>
                                    </div>
                                    <div class="col-lg-4">
                                        <div class="client">
                                            <a href="#"><img src="asset/Img/logo_7.png" alt=""></a>
                                        </div>
                                    </div>
                                    <div class="col-lg-4">
                                        <div class="client">
                                            <a href="#"><img src="asset/Img/logo_8.png" alt=""></a>
                                        </div>
                                    </div>
                                    <div class="col-lg-4">
                                        <div class="client">
                                            <a href="#"><img src="asset/Img/logo_9.png" alt=""></a>
                                        </div>
                                    </div>
                                    <div class="col-lg-4">
                                        <div class="client">
                                            <a href="#"><img src="asset/Img/logo_10.png" alt=""></a>
                                        </div>
                                    </div>
                                    <div class="col-lg-4">
                                        <div class="client">
                                            <a href="#"><img src="asset/Img/logo_11.jpg" alt=""></a>
                                        </div>
                                    </div>
                                    <div class="col-lg-12">
                                        <div class="see_all">
                                            <button type="submit">SEE ALL</button>
                                        </div>
                                    </div>
                                </div> -->
                             <img src="frontend/asset/Img/home_client.jpg" alt="">
                             <div class="see_all">
                                 <button type="submit">SEE ALL</button>
                             </div>
                         </div>
                     </div>
                 </div>
             </div>
         </div>
     </div>
 </section>
 <!-- Get_in_touch_section_End-->
 <!-- our_news_event_start -->
  <section id="Our_event">
     <div class="event_div">
         <div class="container">
             <div class="event_heading">
                 <h2><span>OUR</span><br>NEWS & EVENTS</h2>
             </div>
             <div class="row">
                    <div class="col-lg-4">
                        <div class="event_img">
                            <img src="asset/Img/2.jpg" alt="">
                            <div class="text_card_event">
                                <h6>Materials and Manufacturing Education</h6>
                                <p>Lorem, ipsum dolor sit amet consectetur adipisicing elit. Distinctio omnis illum sint ut quisquam rem ducimus laboriosam expedita numquam reprehenderit.</p>
                            </div>
                            <div class="text_card_event_botom">
                                <p>24.05.22 / BU ADMIN</p>
                            </div>
                        </div>
                    </div>
                    <div class="col-lg-4">
                        <div class="event_img">
                            <img src="asset/Img/product_1.jpg" alt="">
                            <div class="text_card_event">
                                <h6>Multitasking materials in future constraction</h6>
                                <p>Lorem, ipsum dolor sit amet consectetur adipisicing elit. Distinctio omnis illum sint ut quisquam rem ducimus laboriosam expedita numquam reprehenderit.</p>
                            </div>
                            <div class="text_card_event_botom">
                                <p>22.05.22 / BU ADMIN</p>
                            </div>
                        </div>
                    </div>
                    <div class="col-lg-4">
                        <div class="event_img">
                            <img src="asset/Img/product_8.jpg" alt="">
                            <div class="text_card_event">
                                <h6>Design and Materials As a Driver of innovation</h6>
                                <p>Lorem, ipsum dolor sit amet consectetur adipisicing elit. Distinctio omnis illum sint ut quisquam rem ducimus laboriosam expedita numquam reprehenderit.</p>
                            </div>
                            <div class="text_card_event_botom">
                                <p>12.05.22 / BU ADMIN</p>
                            </div>
                        </div>
                    </div> 
             <div id="carouselExampleControlsNoTouching" class="carousel slide" data-bs-touch="false" data-bs-interval="false">
                 <div class="carousel-inner">
                     <div class="carousel-item active">
                         <div class="row">
                             <div class="col-lg-4 col-md-4 col-sm-4">
                                 <div class="event_img ">
                                     <a href="javascript:void(0)" data-bs-toggle="modal" data-bs-target="#exampleModal">
                                         <img src="frontend/asset/Img/2.jpg" alt="">
                                         <div class="text_card_event">
                                             <h6>Materials and Manufacturing Education</h6>
                                             <p>Lorem, ipsum dolor sit amet consectetur adipisicing elit. Distinctio omnis illum sint ut quisquam rem ducimus laboriosam expedita numquam reprehenderit.
                                             </p>
                                         </div>
                                         <div class="text_card_event_botom">
                                             <p>24.05.22 / BU ADMIN</p>
                                         </div>
                                     </a>
                                 </div>
                             </div>
                             <div class="col-lg-4 col-md-4 col-sm-4">
                                 <div class="event_img">
                                     <a href="javascript:void(0)" data-bs-toggle="modal" data-bs-target="#exampleModal_2">
                                         <img src="frontend/asset/Img/product_1.jpg" alt="">
                                         <div class="text_card_event">
                                             <h6>Multitasking materials in future constraction</h6>
                                             <p>Lorem, ipsum dolor sit amet consectetur adipisicing elit. Distinctio omnis illum sint ut quisquam rem ducimus laboriosam expedita numquam reprehenderit.
                                             </p>
                                         </div>
                                         <div class="text_card_event_botom">
                                             <p>22.05.22 / BU ADMIN</p>
                                         </div>
                                     </a>
                                 </div>
                             </div>
                             <div class="col-lg-4 col-md-4 col-sm-4">
                                 <div class="event_img">
                                     <a href="javascript:void(0)" data-bs-toggle="modal" data-bs-target="#exampleModal_3">
                                         <img src="frontend/asset/Img/product_8.jpg" alt="">
                                         <div class="text_card_event">
                                             <h6>Design and Materials As a Driver of innovation</h6>
                                             <p>Lorem, ipsum dolor sit amet consectetur adipisicing elit. Distinctio omnis illum sint ut quisquam rem ducimus laboriosam expedita numquam reprehenderit.
                                             </p>
                                         </div>
                                         <div class="text_card_event_botom">
                                             <p>12.05.22 / BU ADMIN</p>
                                         </div>
                                     </a>
                                 </div>
                             </div>
                         </div>
                     </div>
                     <div class="carousel-item">
                         <div class="row">
                             <div class="col-lg-4 col-md-4 col-sm-4">
                                 <div class="event_img">
                                     <img src="frontend/asset/Img/2.jpg" alt="">
                                     <div class="text_card_event">
                                         <h6>Materials and Manufacturing Education</h6>
                                         <p>Lorem, ipsum dolor sit amet consectetur adipisicing elit. Distinctio omnis illum sint ut quisquam rem ducimus laboriosam expedita numquam reprehenderit.
                                         </p>
                                     </div>
                                     <div class="text_card_event_botom">
                                         <p>24.05.22 / BU ADMIN</p>
                                     </div>
                                 </div>
                             </div>
                             <div class="col-lg-4 col-md-4 col-sm-4">
                                 <div class="event_img">
                                     <img src="frontend/asset/Img/product_1.jpg" alt="">
                                     <div class="text_card_event">
                                         <h6>Multitasking materials in future constraction</h6>
                                         <p>Lorem, ipsum dolor sit amet consectetur adipisicing elit. Distinctio omnis illum sint ut quisquam rem ducimus laboriosam expedita numquam reprehenderit.
                                         </p>
                                     </div>
                                     <div class="text_card_event_botom">
                                         <p>22.05.22 / BU ADMIN</p>
                                     </div>
                                 </div>
                             </div>
                             <div class="col-lg-4 col-md-4 col-sm-4">
                                 <div class="event_img">
                                     <img src="frontend/asset/Img/product_8.jpg" alt="">
                                     <div class="text_card_event">
                                         <h6>Design and Materials As a Driver of innovation</h6>
                                         <p>Lorem, ipsum dolor sit amet consectetur adipisicing elit. Distinctio omnis illum sint ut quisquam rem ducimus laboriosam expedita numquam reprehenderit.
                                         </p>
                                     </div>
                                     <div class="text_card_event_botom">
                                         <p>12.05.22 / BU ADMIN</p>
                                     </div>
                                 </div>
                             </div>
                         </div>
                     </div>
                     <div class="carousel-item">
                         <div class="row">
                             <div class="col-lg-4 col-md-4 col-sm-4">
                                 <div class="event_img">
                                     <img src="frontend/asset/Img/2.jpg" alt="">
                                     <div class="text_card_event">
                                         <h6>Materials and Manufacturing Education</h6>
                                         <p>Lorem, ipsum dolor sit amet consectetur adipisicing elit. Distinctio omnis illum sint ut quisquam rem ducimus laboriosam expedita numquam reprehenderit.
                                         </p>
                                     </div>
                                     <div class="text_card_event_botom">
                                         <p>24.05.22 / BU ADMIN</p>
                                     </div>
                                 </div>
                             </div>
                             <div class="col-lg-4 col-md-4 col-sm-4">
                                 <div class="event_img">
                                     <img src="frontend/asset/Img/product_1.jpg" alt="">
                                     <div class="text_card_event">
                                         <h6>Multitasking materials in future constraction</h6>
                                         <p>Lorem, ipsum dolor sit amet consectetur adipisicing elit. Distinctio omnis illum sint ut quisquam rem ducimus laboriosam expedita numquam reprehenderit.
                                         </p>
                                     </div>
                                     <div class="text_card_event_botom">
                                         <p>22.05.22 / BU ADMIN</p>
                                     </div>
                                 </div>
                             </div>
                             <div class="col-lg-4 col-md-4 col-sm-4">
                                 <div class="event_img">
                                     <img src="frontend/asset/Img/product_8.jpg" alt="">
                                     <div class="text_card_event">
                                         <h6>Design and Materials As a Driver of innovation</h6>
                                         <p>Lorem, ipsum dolor sit amet consectetur adipisicing elit. Distinctio omnis illum sint ut quisquam rem ducimus laboriosam expedita numquam reprehenderit.
                                         </p>
                                     </div>
                                     <div class="text_card_event_botom">
                                         <p>12.05.22 / BU ADMIN</p>
                                     </div>
                                 </div>
                             </div>
                         </div>
                     </div>
                 </div>
                 <button class="carousel-control-prev prev_box" type="button" data-bs-target="#carouselExampleControlsNoTouching" data-bs-slide="prev">
                     <span class="carousel-control-prev-icon" aria-hidden="true"></span>
                     <span class="visually-hidden">Previous</span>
                 </button>
                 <button class="carousel-control-next next_box" type="button" data-bs-target="#carouselExampleControlsNoTouching" data-bs-slide="next">
                     <span class="carousel-control-next-icon" aria-hidden="true"></span>
                     <span class="visually-hidden">Next</span>
                 </button>
             </div>
             <!-- </div> -->



         </div>
     </div>
 </section>

 <!-- ----------------------------------modal_cotent_start 1 ---------------------------------->
 <div class="modal fade" id="exampleModal" tabindex="-1" aria-labelledby="exampleModalLabel" aria-hidden="true">
     <div class="modal-dialog">
         <div class="modal-content">
             <div class="modal-header">
                 <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
             </div>
             <div class="modal-body">
             <img src="frontend/asset/Img/2.jpg" alt="">
             </div>
           
         </div>
     </div>
 </div>
                                                   <!-- modal_Number_2 -->

 <div class="modal fade" id="exampleModal_2" tabindex="-1" aria-labelledby="exampleModalLabel" aria-hidden="true">
     <div class="modal-dialog">
         <div class="modal-content">
             <div class="modal-header">
                 <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
             </div>
             <div class="modal-body">
             <img src="frontend/asset/Img/product_1.jpg" alt="">
             </div>
           
         </div>
     </div>
 </div>
                                                   <!-- modal_Number_3 -->
 <div class="modal fade" id="exampleModal_3" tabindex="-1" aria-labelledby="exampleModalLabel" aria-hidden="true">
     <div class="modal-dialog">
         <div class="modal-content">
             <div class="modal-header">
                 <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
             </div>
             <div class="modal-body">
             <img src="frontend/asset/Img/product_8.jpg" alt="">
             </div>
           
         </div>
     </div>
 </div>
 <!----------------------------------------------- modal_cotent_End -------------------------------------------------->
 <!-- our_news_event_End -->
 <!-- news_latter -->
 <section id="news_latter">
     <div class="container">
         <div class="row">
             <div class="col-lg-6 col-sm-6">
                 <div class="newsletter">
                     <h4>NEWSLETTER</h4>
                     <h2>SUBSCRIBE</h2>
                 </div>
             </div>
             
			 
			 <div class="col-lg-6 col-sm-6">
                 <div class="newsletter_1">
					<form action="{{route('newsletter')}}"  method="post">
						@csrf
						 <input type="email" class="form-control" placeholder="{{__('EMAIL ADDRESS')}}" aria-label="" aria-describedby="basic-addon1" required="required" pattern="^\w+([\.-]?\w+)*@\w+([\.-]?\w+)*(\.\w{2,3})+$" />
						 <div class="send_btn">
							 <button type="submit" name="submit"><i class="fa fa-envelope" aria-hidden="true"></i></button>
						 </div>
						 @if(Session::has('message2'))
							<p class="alert alert-info" style="color:#0C0; font-size:14px;">{{ Session::get('message2') }}</p> 
						@endif
					</form>
                 </div>
             </div>
         </div>
     </div>
 </section>
 @endsection
 @section('js')
 @endsection
 @push('scripts')
 @endpush
 <script>
$(document).ready(function() {
    $("#nameErr").hide();
    err_name = true;
    $("#mobileErr").hide();
    err_mobile = true;
    $("#emailErr").hide();
    err_email = true;
    $("#companyErr").hide();
    err_company = true;
    $("#messageErr").hide();
    err_message = true;

    $("#name").keyup(function() {
        name_check_fun();
    });

    $("#email").keyup(function() {
        email_check_fun();
    });

    $("#mobile").keyup(function() {
        mobile_check_fun();
    });
    $("#company").keyup(function() {
        company_check_fun();
    });

    $("#message").keyup(function() {
        message_check_fun();
    });

    function name_check_fun() {
        let k = $("#name").val();
        let val = k.trim();
        if (val.length == "") {
            $("#nameErr").show();
            $("#nameErr").html("Name is required");
            err_name = false;
            return false;
        } else {
            err_name = true;
            $("#nameErr").html("");
            $("#nameErr").hide();
        }
    }


    function mobile_check_fun() {
        const regex = /^(\+\d{1,3}[- ]?)?\d{10}$/
        let k = $("#mobile").val();
        let val = k.trim();
        if (val.length == "") {
            $("#mobileErr").show();
            $("#mobileErr").html("Mobile No is required");
            err_mobile = false;
            return false;
        } else if (!regex.test(val)) {
            $("#mobileErr").show();
            $("#mobileErr").html("Mobile No must be a valid number");
            err_mobile = false;
            return false;
        } else {
            err_mobile = true;
            $("#mobileErr").html("");
            $("#mobileErr").hide();

        }
    }

    function email_check_fun() {
        const regex = /^[^\s@]+@[^\s@]+\.[^\s@]{2,}$/i;
        let k = $("#email").val();
        let val = k.trim();
        if (val.length == "") {
            $("#emailErr").show();
            $("#emailErr").html("Email is required");
            err_email = false;
            return false;
        } else if (!regex.test(val)) {
            $("#emailErr").show();
            $("#emailErr").html("Email must be a valid email");
            err_email = false;
            return false;
        } else {
            err_email = true;
            $("#emailErr").html("");
            $("#emailErr").hide();
        }
    }

    function message_check_fun() {
        let k = $("#message").val();
        let val = k.trim();
        if (val.length == "") {
            $("#messageErr").show();
            $("#messageErr").html("Message is required");
            err_message = false;
            return false;
        } else {
            err_message = true;
            $("#messageErr").html("");
            $("#messageErr").hide();

        }
    }

    function company_check_fun() {
        let k = $("#company").val();
        let val = k.trim();
        if (val.length == "") {
            $("#companyErr").show();
            $("#companyErr").html("Company is required");
            err_company = false;
            return false;
        } else {
            err_company = true;
            $("#companyErr").html("");
            $("#companyErr").hide();

        }
    }

    $("#submitBtn").click(function() {
        err_name = true;
        err_email = true;
        err_mobile = true;
        err_message = true;
        err_company = true;
        name_check_fun();
        mobile_check_fun();
        email_check_fun();
        message_check_fun();
        company_check_fun();

        if ((err_name == true) && (err_email == true) && (err_mobile == true) && (err_message ==
                true) && (err_company == true)) {
            return true;
        } else {
            return false;

        }

    });


});
</script>