<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="utf-8">
  <meta content="width=device-width, initial-scale=1.0" name="viewport">
  <title>Xcessible - Search</title>
  <meta content="" name="descriptison">
  <meta content="" name="keywords">
  <!-- Favicons -->
  <link href="assets/img/favicon.png" rel="icon">
  <!-- Google Fonts -->
  <!-- Vendor CSS Files -->
  <link href="assets/vendor/bootstrap/css/bootstrap.min.css" rel="stylesheet">
  <link href="assets/vendor/icofont/icofont.min.css" rel="stylesheet">
  <link href="assets/vendor/owl.carousel/css/owl.carousel.min.css" rel="stylesheet">
  <link href="assets/vendor/aos/aos.css" rel="stylesheet">

  <!-- Template Main CSS File -->
  <link href="assets/css/fonts.css" rel="stylesheet">
  <link href="assets/css/style.css" rel="stylesheet">
  <link href="assets/css/stars.css" rel="stylesheet">
  <link href="assets/css/search.css" rel="stylesheet">
  <link rel="stylesheet" href="assets/css/bootstrap-multiselect.min.css" type="text/css"/>


  
</head>

<body style="overflow: hidden;">
  <header id="header" style="overflow: hidden;">
    <div class="d-flex flex-column" style="height: 100%;margin-top: 50%;">
        <nav class="nav-menu" style="height: 100%;margin-left: -15px;">
        </nav>
    </div>
  </header>

  <main id="main">
    <section id="first_section" class="skills" style="background: linear-gradient(0deg, rgba(16,22,31,0.2) 0%, rgba(255,255,255,1) 100%);">
      <div class="container">
        <div class="section-title">
          <h2>JOB SEARCH SECTION</h2>
          <p style="font-weight: 100;font-size: 1.2rem;line-height: 2.3rem;letter-spacing: .05rem;">
            Find jobs that can suit you the best, using specific <b>search keywords</b>.
          </p>
        </div>
        
        <div class="row skills-content">
          <form action="" method="POST" class="log-in" autocomplete="off" onsubmit="return false;"> 
            <div style="display: flex; flex-direction: row; width: 100%;">
              <div class="floating-label">
                <input placeholder="Search" type="text" name="search" id="search-input" autocomplete="off" required minlength=5>
                <label for="search">Search:</label>
                <div class="icon">
                  <?xml version="1.0" encoding="UTF-8" standalone="no"?>
                  <svg
                     enable-background="new 0 0 24 24"
                     version="1.1"
                     viewBox="0 0 24 24"
                     xml:space="preserve"
                     id="svg12"
                     sodipodi:docname="1.svg"
                     inkscape:version="1.1 (c68e22c387, 2021-05-23)"
                     xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
                     xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
                     xmlns:xlink="http://www.w3.org/1999/xlink"
                     xmlns="http://www.w3.org/2000/svg"
                     xmlns:svg="http://www.w3.org/2000/svg"><defs
                     id="defs16"><linearGradient
                       id="linearGradient2905"
                       inkscape:swatch="solid"><stop
                         style="stop-color:#ffffff;stop-opacity:1;"
                         offset="0"
                         id="stop2903" /></linearGradient><linearGradient
                       id="linearGradient2459"
                       inkscape:swatch="solid"><stop
                         style="stop-color:#000000;stop-opacity:1;"
                         offset="0"
                         id="stop2457" /></linearGradient><linearGradient
                       id="linearGradient1023"
                       inkscape:swatch="solid"><stop
                         style="stop-color:#000000;stop-opacity:1;"
                         offset="0"
                         id="stop1021" /></linearGradient><linearGradient
                       id="linearGradient993"
                       inkscape:swatch="solid"><stop
                         style="stop-color:#000000;stop-opacity:1;"
                         offset="0"
                         id="stop991" /></linearGradient><linearGradient
                       inkscape:collect="always"
                       xlink:href="#linearGradient2459"
                       id="linearGradient995"
                       x1="13.100917"
                       y1="6.8256884"
                       x2="22.899082"
                       y2="6.8256884"
                       gradientUnits="userSpaceOnUse"
                       gradientTransform="matrix(1.3931803,0,0,1.3931803,-8.4796002,-1.9873323)" /><linearGradient
                       inkscape:collect="always"
                       xlink:href="#linearGradient2459"
                       id="linearGradient995-8"
                       x1="13.100917"
                       y1="6.8256884"
                       x2="22.899082"
                       y2="6.8256884"
                       gradientUnits="userSpaceOnUse"
                       gradientTransform="matrix(1.3721326,0,0,1.3721326,-8.1066431,-1.9574913)" /></defs><sodipodi:namedview
                     id="namedview14"
                     pagecolor="#ffffff"
                     bordercolor="#999999"
                     borderopacity="1"
                     inkscape:pageshadow="0"
                     inkscape:pageopacity="0"
                     inkscape:pagecheckerboard="0"
                     showgrid="false"
                     inkscape:zoom="9.0833333"
                     inkscape:cx="3.0825688"
                     inkscape:cy="18"
                     inkscape:window-width="1920"
                     inkscape:window-height="1057"
                     inkscape:window-x="-8"
                     inkscape:window-y="-8"
                     inkscape:window-maximized="1"
                     inkscape:current-layer="svg12" />
                                    <style
                     type="text/css"
                     id="style2">
                                      .st0{fill:none;}
                                      .st1{fill:#010101;}
                                    </style>
                                        
                                        
                                        
                                        
                                    <g
                     id="g5939"
                     transform="matrix(0.68962388,0,0,0.68962388,3.6832301,3.6831731)"><rect
                       class="st0"
                       width="24"
                       height="24"
                       id="rect4"
                       x="0"
                       y="0" /><path
                       id="path855"
                       style="font-variation-settings:normal;vector-effect:none;fill:#ff0000;fill-opacity:0;fill-rule:evenodd;stroke:url(#linearGradient995);stroke-width:1.39318;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;-inkscape-stroke:none;stop-color:#000000"
                       d="M 16.596827,0.69659008 A 6.825305,6.825305 0 0 0 9.7724566,7.5229004 6.825305,6.825305 0 0 0 10.430064,10.432665 l -9.44509978,9.641024 3.12314838,3.061073 9.3675064,-9.55955 a 6.825305,6.825305 0 0 0 3.121208,0.772057 6.825305,6.825305 0 0 0 6.82631,-6.8243686 6.825305,6.825305 0 0 0 -6.82631,-6.82631032 z" /><circle
                       style="font-variation-settings:normal;vector-effect:none;fill:#ff0000;fill-opacity:0;fill-rule:evenodd;stroke:url(#linearGradient995-8);stroke-width:1.37213;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;-inkscape-stroke:none;stop-color:#000000"
                       id="path855-5"
                       cx="16.591743"
                       cy="7.408257"
                       r="6.7221904" /></g></svg>     
                </div>
              </div>
              <select class="location-select" multiple="multiple">
                <% locations.forEach(function(location){ %>
                    <option value="<%= location %>"><%= location %></option>
                <% }); %>
              </select>
              <select class="disability-select" multiple="multiple">
                <% RejectedDisabilities.forEach(function(disability){ %>
                    <option value="<%= disability %>"><%= disability %></option>
                <% }); %>
              </select>
            </div>
            <button type="submit">SEARCH</button>
          </form>
        </div>
      </div>
    </section>
    
    <section id="second_section" class="portfolio " style="background: linear-gradient(0deg, rgba(16,22,31,0.4) 0%, rgba(16,22,31,0.2) 100%);">
      <div class="container">
        <div class="section-title">
          <h2>SEARCH RESULTS SECTION</h2>
          <p style="font-weight: 100;font-size: 1.2rem;line-height: 2.3rem;letter-spacing: .05rem;">
            These are the jobs that we think are most relative to your keywords.
          </p>
        </div>
        
        <div class="row skills-content">
        

          <div class="container">
            <div class="row">
                    <div class="col-12">
                        <div class="card card-margin">
                            <div class="card-body">
                                <div class="row search-body">
                                    <div class="col-lg-12">
                                        <div class="search-result">

                                        </div>
                                    </div>
                                </div>
                                <!-- <nav class="d-flex justify-content-center">
                                    <ul class="pagination pagination-base pagination-boxed pagination-square mb-0">
                                        <li class="page-item">
                                            <a class="page-link no-border" href="#">
                                                <span aria-hidden="true">«</span>
                                                <span class="sr-only">Previous</span>
                                            </a>
                                        </li>
                                        <li class="page-item active"><a class="page-link no-border" href="#">1</a></li>
                                        <li class="page-item"><a class="page-link no-border" href="#">2</a></li>
                                        <li class="page-item"><a class="page-link no-border" href="#">3</a></li>
                                        <li class="page-item"><a class="page-link no-border" href="#">4</a></li>
                                        <li class="page-item">
                                            <a class="page-link no-border" href="#">
                                                <span aria-hidden="true">»</span>
                                                <span class="sr-only">Next</span>
                                            </a>
                                        </li>
                                    </ul>
                                </nav> -->
                            </div>
                        </div>
                    </div>
                </div>
            </div>



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

    
  </main>
  <i id="sound-button" style="z-index: 9999999;position: fixed;cursor: pointer;left: 20px;bottom: 20px;color: white;mix-blend-mode: difference;font-size: 35px;" class="icofont-mic-mute"></i>
  <div class="back-to-top" style="display: none;width: 200px;" id="back-to-top">
    <a href="#" style="vertical-align: middle;margin-top: 4px;color: inherit;display: inline-block;">SEARCH AGAIN</a>
  </div>
  <div style="z-index: 9999999; cursor: pointer; left: unset; right: 25px; top: 25px; mix-blend-mode: difference; margin-left: 100px;" class="back-to-top">
    <a href="/" style="vertical-align: middle; margin-top: 4px; color: inherit; display: inline-block; opacity: 1;">HOME</a>
  </div>
  <div style="z-index: 9999999;cursor: pointer;left: -9px;position: fixed;top: 25px;margin-left: 100px;" class="">
    <a href="/" style="vertical-align: middle; margin-top: 4px; display: inline-block; opacity: 1;">
      <img src="assets/img/bruh.png" style="width: 122px;z-index: 93123323;">
    </a>
  </div>
  
  <!-- Vendor JS Files -->
  <script src="assets/vendor/jquery/jquery.min.js"></script>
  <script src="assets/vendor/jquery.easing/jquery.easing.min.js"></script>
  <script src="assets/vendor/waypoints/jquery.waypoints.min.js"></script>
  <script src="assets/vendor/isotope-layout/isotope.pkgd.min.js"></script>
  <script src="assets/vendor/owl.carousel/js/owl.carousel.min.js"></script>
  <script src="assets/vendor/typed.js/typed.min.js"></script>
  <script src="assets/vendor/aos/aos.js"></script>
  <script src="assets/vendor/loadingoverlay.min.js"></script>
  <script type="text/javascript" src="assets/vendor/popper.min.js"></script>
  <script type="text/javascript" src="assets/vendor/bootstrap.min.js"></script>
  <script type="text/javascript" src="assets/vendor/bootstrap-multiselect.min.js"></script>
  <script src="assets/vendor/artyom.window.min.js"></script>
  <script src="assets/js/voice_commands.js"></script>
  

  <!-- Template Main JS File -->
  <script src="assets/js/search.js"></script>
</body>

</html>