API tools faq
paste
Advertisement
kunbata

form

kunbata
Mar 1st, 2023 (edited)
744
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
HTML 8.05 KB | Source Code | 0 0
raw download clone embed print report
  1. <!DOCTYPE html>
  2. <html lang="en" dir="ltr">
  3.   <!-- START head -->
  4.   <head>
  5.     <!-- Site meta charset -->
  6.     <meta charset="UTF-8" />
  7.  
  8.     <!-- title -->
  9.     <title>Karama Lodge Online Booking</title>
  10.  
  11.     <!-- meta description -->
  12.     <meta
  13.      name="description"
  14.      content="Karama Lodge is an Eco-friendly Lodge located in Arusha, Tanzania; at the foot of the impressive Mt. Meru."
  15.    />
  16.  
  17.     <!-- meta keywords -->
  18.     <meta name="keywords" content="Tented Lodge, Lodge, Inn, Good Food" />
  19.  
  20.     <!-- meta viewport -->
  21.     <meta
  22.      name="viewport"
  23.      content="width=device-width, initial-scale=1, maximum-scale=1"
  24.    />
  25.  
  26.     <!-- favicon -->
  27.     <link rel="icon" href="favicon.ico" type="image/x-icon" />
  28.     <link rel="shortcut icon" href="favicon.ico" type="image/x-icon" />
  29.  
  30.     <!-- bootstrap 3 stylesheets -->
  31.     <!-- Latest compiled and minified CSS -->
  32. <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@3.4.1/dist/css/bootstrap.min.css" integrity="sha384-HSMxcRTRxnN+Bdg0JdbxYKrThecOKuH5zCYotlSAcp1+c8xmyTe9GYg1l9a69psu" crossorigin="anonymous">
  33.     <!-- template stylesheet -->
  34.     <link rel="stylesheet" type="text/css" href="css/styles.css" media="all" />
  35.  
  36.     <link
  37.      rel="stylesheet"
  38.      href="css/flexslider.css"
  39.      type="text/css"
  40.      media="screen"
  41.    />
  42.     <!-- SLIDER REVOLUTION 4.x CSS SETTINGS -->
  43.     <link
  44.      rel="stylesheet"
  45.      type="text/css"
  46.      href="js/rs-plugin/css/settings.css"
  47.      media="all"
  48.    />
  49.     <!-- responsive stylesheet -->
  50.     <link
  51.      rel="stylesheet"
  52.      type="text/css"
  53.      href="css/responsive.css"
  54.      media="all"
  55.    />
  56.     <!-- Load Fonts via Google Fonts API -->
  57.     <link
  58.      rel="stylesheet"
  59.      type="text/css"
  60.      href="http://fonts.googleapis.com/css?family=Karla:400,700,400italic,700italic"
  61.    />
  62.     <!-- color scheme -->
  63.     <link
  64.      rel="stylesheet"
  65.      type="text/css"
  66.      href="css/colors/color1.css"
  67.      title="color1"
  68.    />
  69.     <link
  70.      href="https://cdn.jsdelivr.net/npm/select2@4.1.0-rc.0/dist/css/select2.min.css"
  71.      rel="stylesheet"
  72.    />
  73.   </head>
  74.  
  75.   <body>
  76.     <!-- START .main-contents -->
  77.     <div class="main-contents" style="background: green">
  78.       <div class="container" id="home-page">
  79.         <!-- START .tour-plan -->
  80.         <form class="plan-tour" action="mail.php" method="post">
  81.           <div class="plan-banner">
  82.             <span>PLAN YOUR</span>
  83.             <h4>STAY <span>AT</span><span> KARAMA </span></h4>
  84.           </div>
  85.           <div class="top-fields">
  86.             <div class="input-field col-md-6">
  87.               <input
  88.                type="text"
  89.                name="name"
  90.                placeholder="Enter your full name"
  91.              />
  92.             </div>
  93.             <div class="input-field col-md-6">
  94.               <input type="email" name="email" placeholder="Enter your email" />
  95.             </div>
  96.           </div>
  97.           <div class="top-fields">
  98.             <div class="input-field col-md-12 schedule">
  99.               <input
  100.                type="text"
  101.                class="date-picker"
  102.                name="fromWhen"
  103.                placeholder="1. Arrival Date"
  104.                data-date="11-12-2012"
  105.                data-date-format="dd-mm-yyyy"
  106.              />
  107.               <i class="calendar-icon"></i>
  108.               <input
  109.                type="text"
  110.                class="date-picker"
  111.                name="tillWhen"
  112.                placeholder="2. Departure Date"
  113.                data-date="12-12-2012"
  114.                data-date-format="dd-mm-yyyy"
  115.              />
  116.             </div>
  117.           </div>
  118.           <div class="top-fields">
  119.             <div class="input-field select col-md-3">
  120.               <label>3. Adults</label>
  121.               <select id="adults" name="adults">
  122.                 <option value="1">1</option>
  123.                 <option value="2">2</option>
  124.                 <option value="3">3</option>
  125.                 <option value="4">4</option>
  126.                 <option value="5">5</option>
  127.                 <option value="6">6</option>
  128.                 <option value="7">7</option>
  129.               </select>
  130.             </div>
  131.             <div class="input-field select col-md-3">
  132.               <label>4. Kids</label>
  133.               <select id="kids" name="kids">
  134.                 <option value="0">0</option>
  135.                 <option value="1">1</option>
  136.                 <option value="2">2</option>
  137.                 <option value="3">3</option>
  138.                 <option value="4">4</option>
  139.                 <option value="5">5</option>
  140.                 <option value="6">6</option>
  141.                 <option value="7">7</option>
  142.               </select>
  143.             </div>
  144.  
  145.             <div class="input-field col-md-6">
  146.               <label
  147.                style="cursor: pointer"
  148.                title="You can select multiple destinations"
  149.                >5. Where to go*</label
  150.              >
  151.               <select
  152.                id="whereToGo"
  153.                class="whereToGo-multiple"
  154.                name="whereToGo[]"
  155.                style="height: 3rem; width: 100%"
  156.                multiple="multiple"
  157.              >
  158.                 <option value="Ngorongoro">Ngorongoro</option>
  159.                 <option value="Serengeti" selected>Serengeti</option>
  160.                 <option value="Manyara">Manyara</option>
  161.                 <option value="Arusha National Park">
  162.                   Arusha National Park
  163.                 </option>
  164.                 <option value="Zanzibar">Zanzibar</option>
  165.                 <option value="Mt kilimanjaro">Mt kilimanjaro</option>
  166.                 <option value="Mt Meru">Mt Meru</option>
  167.               </select>
  168.             </div>
  169.             <div class="input-field col-md-6">
  170.               <label
  171.                style="cursor: pointer"
  172.                title="You can select multiple activities"
  173.                >6. What to do*</label
  174.              >
  175.               <select
  176.                id="whatToDo"
  177.                class="whatToDo-multiple"
  178.                name="whatToDo[]"
  179.                multiple="multiple"
  180.                style="height: 3rem; width: 100%"
  181.              >
  182.                 <option value="Wildlife & Game drives">
  183.                   Wildlife & Game drives
  184.                </option>
  185.                <option value="Bird watching">Bird watching</option>
  186.                <option value="Camping">Camping</option>
  187.                <option value="Mountain climbing">Mountain climbing</option>
  188.                <option value="Historical/Educational">
  189.                  Historical/Educational
  190.                </option>
  191.                <option value="Walking Safaris">Walking Safaris</option>
  192.                <option value="Beach">Beach</option>
  193.                <option value="Cultural">Cultural</option>
  194.                <option value="Honeymoon">Honeymoon</option>
  195.                <option value="Ballon Safaris">Ballon Safaris</option>
  196.              </select>
  197.            </div>
  198.          </div>
  199.          <div class="bottom-fields">
  200.            <div class="input-field col-md-4">
  201.              <label>7. Including</label>
  202.              <label
  203.                ><input
  204.                  class="input-cb"
  205.                  type="checkbox"
  206.                  name="inc_flight"
  207.                  value="1"
  208.                />
  209.                Flight</label
  210.              >
  211.              <label
  212.                ><input
  213.                  class="input-cb"
  214.                  type="checkbox"
  215.                  name="inc_car"
  216.                  value="1"
  217.                />
  218.                Transport</label
  219.              >
  220.            </div>
  221.            <button class="btn btn-primary marb20" type="submit">
  222.              BOOK NOW
  223.            </button>
  224.          </div>
  225.        </form>
  226.      </div>
  227.    </div>
  228. <script src="https://cdn.jsdelivr.net/npm/bootstrap@3.4.1/dist/js/bootstrap.min.js" integrity="sha384-aJ21OjlMXNL5UyIl/XNwTMqvzeRMZH2w8c5cRVpzpU8Y5bApTppSuUkhZXN0VxHd" crossorigin="anonymous"></script>
  229.    <!-- END .tour-plan -->
  230.  </body>
  231. </html>
  232.  
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement
Public Pastes
Advertisement
We use cookies for various purposes including analytics. By continuing to use Pastebin, you agree to our use of cookies as described in the Cookies Policy.  OK, I Understand
Not a member of Pastebin yet?
Sign Up, it unlocks many cool features!