templates/contact/index.html.twig line 1

Open in your IDE?
  1. <!DOCTYPE html>
  2. <html>
  4. {% include ('includes/head.html.twig') %}
  5. <body>
  6. <!-- Page Loader
  7. ========================================================= -->
  8. <div class="loader-container" id="page-loader"> 
  9.   <div class="loading-wrapper loading-wrapper-hide">
  10.       <div class="loader-animation" id="loader-animation">
  11.           <svg class="svg-loader" width=100 height=100>
  12.           <circle cx=50 cy=50 r=25 />
  13.         </svg>
  14.       </div>    
  15.     <!-- Edit With Your Name -->
  16.     <div class="loader-name" id="loader-name">
  17.       <img src="/img/loader-logo.png" alt="">
  18.     </div>
  19.     <!-- /Edit With Your Name -->
  20.     <!-- Edit With Your Job -->
  21.     <p class="loader-job" id="loader-job">June 4-8 2016 @ New York City</p>
  22.     <!-- /Edit With Your Job -->
  23.   </div>   
  24. </div>
  25. <!-- /End of Page loader
  26. ========================================================= -->
  28. <!-- Header
  29. ================================================== -->
  31. {% include ('includes/header.html.twig') %}
  33. <!-- /Header
  34. ================================================== -->
  36. <style type="text/css">
  37.     .main-intro:before {
  38.         content: '';
  39.     display: block;
  40.     width: 100%;
  41.     height: 100%;
  42.     background: none;
  43.     position: absolute;
  44.     top: 0;
  45.     left: 0;
  46.     
  47. }
  48. .main-intro:before{
  49.     background: rgba(31, 81, 139, 0.2) !important;
  50. }
  51. </style>
  52. <div class="page-wrapper" >
  53.     
  54.     <div id="body-content" style="background:white;background: url(../img/section-bg-right-bottom.png) no-repeat bottom right #fafafa;">
  55.         <div class="owl-carousel main-carousel" id="main-carousel" >
  57.             <!-- slide -->
  58.             <div class="main-intro" style="background-image: url('/astp-image/contact.png');" >
  60.                 <div class="container" style="height:500px">    
  61.                     <div class="intro-content-wrapper viewport">
  62.                         <!-- INTRO CONTENT -->
  63.                         <!-- Adjust the margin-top in style atribute according to content to keep always centered vertically-->
  64.                         <div class="intro-content intro-content-slide1">
  65.                             <!-- row -->
  66.                             <div class="row">
  67.                                 <!-- col -->
  68.                                 <div class="col-md-10 col-md-offset-1">
  69.                                     <!--<img src="img/globe.png" alt="">-->
  70.                                     <h2 class="intro-title1">Contact</h2>
  71.                                     <!-- Buttons -->
  72.                                     <div class="ic-buttons">
  73.                                         
  74.                                     </div>
  75.                                     <!-- /Buttons -->
  76.                                 </div>
  77.                                 <!-- /col -->
  78.                             </div>
  79.                             <!-- /row -->                        
  80.                                                             
  81.                         </div>    
  82.                         <!-- /INTRO CONTENT -->                    
  83.                     </div>                            
  84.                 </div>
  85.             </div>
  86. </div>
  88.         <!-- SECTION: Intro
  89.         ================================================== -->
  90.                 
  91.         <!-- /SECTION: Intro
  92.         ================================================== -->
  94.         <!-- SECTION: Event Infos
  95.         ================================================== -->
  96.                 
  97.         <!-- SECTION: /Event Infos
  98.         ================================================== -->    
  101.         <!-- SECTION: Event Description
  102.         ================================================== -->
  103.     
  104.         <!-- /SECTION: Event Description
  105.         ================================================== -->
  107.         <!-- SECTION: Event Schedule
  108.         ================================================== -->
  109.     <div class="col-lg-12" style="height:70px;">
  110.       
  111.     </div>
  112.     
  113.             <div class="container">
  114.             <legend>Contact</legend>
  115.                   <div class="row">
  116.                         <div class="col-lg-6">
  117.                             <label>Nom</label>
  118.                             <input type="text" class="form-control" placeholder="Nom">
  119.                         </div>
  120.                         <div class="col-lg-6">
  121.                             <label>Prenom</label>
  122.                             <input type="text" class="form-control" placeholder="Prenom">
  123.                         </div>
  124.                         <div class="col-lg-6">
  125.                             <label>E-mail</label>
  126.                             <input type="text" class="form-control" placeholder="E-mail">
  127.                         </div>
  128.                         <div class="col-lg-6">
  129.                             <label>Téléphone</label>
  130.                             <input type="text" class="form-control" placeholder="Téléphone">
  131.                         </div>
  132.                         <div class="col-lg-12">
  133.                         <label>Sujet</label>
  134.                         <input type="text" class="form-control" placeholder="Sujet">
  135.                         </div>
  136.                         <div class="col-lg-12">
  137.                         <label>Message</label>
  138.                         <textarea class="form-control" placeholder="Message" style="height:250px"></textarea>
  139.                         <br>
  140.                         <button class='btn btn-success'>Envoyer</button>
  141.                         </div>
  142.                         
  143.                 </div>
  144.                   
  145.             </div>
  146.     <div class="container-fluid" style="margin-top:3%">
  147.             <div class="row">
  148.                 <div class="map" id="map">            
  149.                     <iframe src="https://www.google.com/maps/embed?pb=!1m14!1m8!1m3!1d819.7115960284929!2d10.7053973!3d34.7342663!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x13002b5720a1aec1%3A0xdeff6a18bfdfacd9!2z2KfZhNmF2K_Ysdiz2Kkg2KfZhNi52YTZitinINmE2LnZhNmI2YUg2YjYqtmC2YbZitin2Kog2KfZhNi12K3YqSDYqNi12YHYp9mC2LM!5e0!3m2!1sar!2stn!4v1658327762199!5m2!1sar!2stn" width="600" height="450" style="border:0;" allowfullscreen="" loading="lazy" referrerpolicy="no-referrer-when-downgrade"></iframe>
  150.                 </div>
  151.             </div>            
  152.         </div>
  154. <!---- test 1---->
  158.     
  161.         <!-- SECTION: Register
  162.         ================================================== -->
  163.         
  164.         <!-- /SECTION: Register
  165.         ================================================== -->
  167.         <!-- SECTION: Location
  168.         ================================================== -->
  169.     
  170.         <!-- /SECTION: Location
  171.         ================================================== -->
  172.     </div>
  173. </div>
  176. <!-- Contact Form - Ajax Messages
  177. ========================================================= -->
  179. <!-- Footer
  180. ================================================== -->
  181. {% include ('includes/footer.html.twig') %}
  183. </body>
  184. </html>