purdue.emscloudservice.com Open in urlscan Pro
2606:4700::6812:210  Public Scan

Form analysis
1 forms found in the DOM

POST ./

<form method="post" action="./" id="VirtualEmsForm" novalidate="novalidate">
  <div class="aspNetHidden">
    <input type="hidden" name="__EVENTTARGET" id="__EVENTTARGET" value="">
    <input type="hidden" name="__EVENTARGUMENT" id="__EVENTARGUMENT" value="">
    <input type="hidden" name="deaCSRFToken" id="deaCSRFToken" value="171eeafc-b71f-4258-be97-70c9d492b6a6">
    <input type="hidden" name="__VIEWSTATE" id="__VIEWSTATE"
      value="mBUvONC10BIv7OtwBzB3B1uQ8h9GD7vf5DEI5AZLU3X1PCltyyLbDJ7CwbKBU0Wls+oeUoCp72avTwYSSOFBMYJ7o8OwcuxEkp7KL8x0wLE+Tu84/R8jzbMao4r1phk+LOx+cQA6IjjuZuQQdTNc8pw19wgnSMfwkYOCqr7rjIk5y3duktdJECodJnOZ2d/CQE9EdBK64EvLM7acfGP7aZe+Upk5eFAgqukvjIyH6cjYyUxkI6cwgc0iqhlNUFul5Il0+NDcPrymfJAlbQpzR/RZEspc8AC9gDrT5pQHAUwF9YzMG91cQT/4IimI5P7G8QWqzmkK9vHPOhheqPmbyHM0DY7jQVBzXXXOjnoUJEKSPQz6aJ46TzrJ9htzC/bjBx1NsXXEqpIYaWNYOAQAbDjYBiYL0Y2iI/Fa7SYzFuc+EQox3o3S23qrJXl86xORyvoo/7Qy3VSxcyKnCeYTE5+zptWqTHj8iLD5gRDVbYhCRv5ey+fe6yCWi8CgZm7GxiqPp1571IJ/740jiKTqypGuI5Olbl6EXb8cJSHaAiwpp6wUJxL4zpmnTdZdldnOQe4QuaK6P1eTBG8YrIhDOtLh7yUv1Kbw7RRhlgB5csF0Qkmj88CeJygohSrcOdfroNDygR+9l60XkzLdEuiMB2h4bqiOBMGV70EEn5+DS+WqieXxIm1sdQGpas1siuVJriNKaXQmISDovend8tpruk1SNcKYubthPbE1d8VZr9GAwDbG2L/blC49PjuWRAPv8aYYg8bmYOcodXzvV0LfRB2ZyWby5IY/4IIs4AQNoTctryke7oCF+KxdW6QEIKS3yN6tb4KdWdWMH3612PLfUUO4FqLIhcKUK/NoGhcZlQGy/xk4FAcj5f2qlBULByyAU1KaDjnQYv00IuSrOr5060OP+sswBETt4vnqo05OPHumqYZZpJdR4+qh0l9bfV906XiXCXFHGuMzmnr3xBMp8p1yKAzzze0+Nq/iMd5Ky2Y+6fqgTNOfm1rGW0abl10uX5e0gfW2GF/zPHuItobIiMNTVF0H+wmiTpO7wKc2A4GHI7MGYzsbWgMH9WmAJ+4rnKzZAHMDssyqW6gp1e54+sCccJTA4uPcm9TU+thnZytlJSLFqke03Zcd7avKPn1x8wQAJQLzGMnJciWLXfvRk3Mu5Aqfn6SZ48cT/Sj2xsOr0BfPwLMp2Jm2MV2jOpP2l10TY/XXLjLxB0oMaCuqp3OU6gWw4yW8DayZYdg7wrmdqbiFlHRKOUFXp6mu+0D4yYMRdy/AjjjPdsEDvp+yyHiSf2YeFuvW+A0BiLYVkYSGZ4Zhw3HUKQ1zbl63bACPn8zyMpUi+ivoHsV6ZvZ0yYmUsJinofZNNecPXMJbz2gFsqdZ23B1f+w24Td/2TaDjV6Ot8hudHXbodurCeIG5ZmOlA4eUhmcEOubLV+EBI0+Tjh3/Bk1VHiyXonjGxd3PBb/+6mdI5arTq6NrvuASmXASXpywNZOW3bdui7FZz6Nfd2GYcgiGoRI4/1gKumn+X8Am7xHOiCkIz9rdmstWvoqRouiIX6aoWp7ZqwnvyT9v7jyIBT1RE7iKVGaCWannjg3pqM//GjeEtb90gByfMKoTFLlgFJ50KAGUcDaIqvOlg9oPTHDsZXOoswsKvOpzzkWNn7fslhAxwCW1YmiHH5IlYvd9OcAFQbkzvzmoK0VPb5xX4MyGO0sjO0qdgyVnC/Ldmion9Xa1kWh2K4yIFqgRfoPN6Cd71QJaETS0OJ77J12z1TWEoZ3/fBsGkDcjScXMgcy/h0oJIzHksOTP/pLaEm6cKRvY4ATSszn1Kf7N+C7Zlv2SjhrdcFkwq0uSQL82yHJeGHIeoGTTc8GG9jtc+I6y+3o7yoVEPC5M+ALaSxghwaXpY9GPjTkeub0+JsgsXJvfeM81rC/Or5uXCin34XGlWRPOk/BrvOwxO+20YapK0M9cadxSsriXPFD8UG2UYO4xVJQyvFawvaVOQzPXwiPkC6tme72ODAPdg1Dpk2miMMWCfq8DQLSbMSzlsdbQtEbGVvYS0KssNc5jpjkMLwUwhybzlm540g+6c2FR2z9QcsDDOAl0JhfAU42wS/E4GtX/YyxcIxFSLyz+FRVVNV0gduZAnrDhY365JawmG1JJuiFTp7QKHsvkJGMqtWZV1aLt4iIzHhYgBpii907SJH3TSDKLT3cC2EsDP9YG0WaeoqP/bAzzR9MSRmbbC7+J4J0YaHWU/O+jRbNC7Y9OrIfNSQiLvVAJK5W/PcntVr7WryWgHIARJY21WmqWSVweIqWMPXBjQkNIR93jtzYGim3RrXW+rdfgUVVOICzgXVON6RE9x18l3ZmElEEYuL/9V2/D+Xa3+hTmwCPc1J+0jSPC47B06v69robRQ0LDpo5N36YKftJV8i/MKptoHxCE05o00LmQd8bqSz0tjSWRAvr9BlkBsNQdXTPcRGSwfb//7KOmc/zhBfz1+CmJUbzhqXlk9zGJootY29Xg57bvp9vw9r8qZLOr1r7My2K3whseukm+pDA3CFih7m2//5McYzribg2gx9boIDZLUhMELm9Ejb8MeRqrgkbOl1Y9hdfsOxZGLDkNuyYTUnu6iVGS5kRq70af6H0qztB5a3B/CNy/ZbvFU95fAwJuDGcKQnobCMuBJXpGIkfpyzLHDxNNIue7Mr8G21TeDauZ2BJKqs0LMI7o9F6oXBkH2IwYYguKqE4OgFSh35WwiOhQ79Up9BfSpdphEC/36pRAOCIEggf5CP0Sb+AmHWqi5zQoTATBcSYEO5u7OBaHb+mjcKs+vEnOvliSMLSG/WvSCUJPu4ouMmw8xN80o8LrPMR3C+NFov6jfjVtBM7kyZOBIkOzhzWr6/cvM5A5gu6suxPAvX2CJV2E39njPJ/Lw7c1MPrTJKhiIpsnRaLfLL4ODxH1JTzQKrTwPVrouBUmaaG/fd21y045PmPJ9Y3x5RVoMXG4zGRZ4o9VBIsz5JK7PQcNhtFhn3yJ8rAGWMGYlnfom8j2GP0DbqEgR8E+JoPVAllaTzOWNyScSv0xZsZnQAoV0bTvWzJstmfvlgXiXUA6F/gXl0LiGIhhezJwJ8gGUqPKMfCgEhVOKOMgfx2QV4/yOG8yRerlXDTtevIR1vbXmMnRa1k9aq0saQTNvxbZiroqVY3z0mGUAzoVhr1WG2f9rUnnIFFM9K0o3jpqyaO/gMWksbFfTBH5m6ite308h/zxvPQXNHbtBrE2anyDn2POZrgm+tZRxvvuwN+lDYs8uzRGw+aeCYale+OJvuNO6xLnMuOyB5R3mdHhtFLG4y6Z2lzW08MvhTs+IAsmhUUfzvlX7CWkO7uzO4YSWx/QBeIomPz06zZgb3s3ULhdVCe8Zm8wyGLxvWniY80JMYMEz01YVB5bTSiJ74/xYSMnRhSiCrPRi3tFA6zRE0NCqZuw07egSglOjtsocc3Y8PbcVL1hhSnxQTbgPS2Hqsy04sZ1ExiFm8BE8k6K1fsvHkVfg1a/8za4airpPHJ6f2HnowDoIc4JZEeg78A2RHfLqoyKS7rLEgDuzXNHj1uO4y9m5CmdK0vd6dgTSI9ZFlr/AUzvS8B1dminQ1c6aj/EG6pj5LEbYwxOb/Eivr5nqGGMEp6Rq4AKplenV0o58RU7FpM8HBrrJff6ndKivWt6vcx7IC639QrjUdKCv/Q/LkUEA896Fo03ffWAoPrGh1eMsFQzu4WzzbY7rbq5h2GqamGdu6m47oqSovkivh39KHr4pPFnakTYqPlgxdiEg==">
  </div>
  <script type="text/javascript">
    //<![CDATA[
    var theForm = document.forms['VirtualEmsForm'];
    if (!theForm) {
      theForm = document.VirtualEmsForm;
    }

    function __doPostBack(eventTarget, eventArgument) {
      if (!theForm.onsubmit || (theForm.onsubmit() != false)) {
        theForm.__EVENTTARGET.value = eventTarget;
        theForm.__EVENTARGUMENT.value = eventArgument;
        theForm.submit();
      }
    }
    //]]>
  </script>
  <script src="/web/WebResource.axd?d=pynGkmcFUV13He1Qd6_TZBgPmxKGFFLzQTRznx8jqLA59fIR-R4XX3QdsFPdcfAmSMa1kuK39Ferkic4wmouMQ2&amp;t=638240343755514788" type="text/javascript"></script>
  <script type="text/javascript">
    //<![CDATA[
    vems.todaysEventsForUser = {
      "NextBookingDate": null,
      "EventData": null,
      "UserTimeZone": null,
      "UserTimeZoneAbbr": null
    };
    Dea.eventsForMonth = {
      "NextBookingDate": null,
      "EventData": null,
      "UserTimeZone": null,
      "UserTimeZoneAbbr": null
    };
    Dea.loginOverrideUrl = 'SamlAuth.aspx';
    var vems = vems || {};
    vems.userLanguage = "de-DE";
    vems.cancelReasons = [{
      "Id": 10,
      "Reason": "Space not needed",
      "RequireNotes": false
    }];
    vems.hasBrowseForSpace = 0;
    vems.enableSocialMedia = 0;
    var ems_Help = "Help",
      ems_timeSep = ":",
      ems_AM = "",
      ems_PM = "",
      ems_timeFormat = "HH:mm",
      ems_timePicker = "Time Picker",
      ems_useHelpIcon = 1,
      ems_UnhandledCallback = "Unhandled Callback.",
      ems_FailedToLoadCallbackXml = "Error loading XML document from server",
      ems_NoItemSelected = "You must select an item first",
      ems_InvalidTime = "Invalid Time",
      ems_FirstDateViolation = "Your booking date violates the first date allowed.",
      ems_LastDateViolation = "Your booking date violates the late date allowed.",
      ems_InvalidDate = "Invalid Date",
      ems_CloseTheCalendar = "Close the Calendar",
      ems_LocDetails = "Location Details",
      ems_ResourceDetails = "Resource Details",
      ems_BookingDetails = "Booking Details",
      ems_ResDetails = "Reservation Details",
      ems_cookieHash = "deaConnection",
      deaCSRFTokenField = "deaCSRFToken",
      ems_MultipleHolidaysLabel = "Multiple Holidays",
      sSelectedColor = "rgb(255,255,255)";
    vems.isAuthed = false;
    vems.is24HrFormat = true;
    vems.maxInputLength = 0;
    Dea.checkVersion("data=dkSv93%2bpBZlRCdJ%2bkAGvug%3d%3d");
    Dea.pageCallback = function(emsObject) {
      WebForm_DoCallback('__Page', '' + Dea.JSON.stringify(emsObject) + '', Dea.handleCallback, '' + emsObject.router + '', Dea.errorCallback, true)
    };
    var PathToRoot = '/web/',
      ems_PauseToLoadMsg = "Pause to load tool tip",
      ems_Loading = "Loading...",
      ems_sessionMilli = 7200000,
      ems_timeOutUrl = "Logout.aspx"; //]]>
  </script>
  <div class="aspNetHidden">
    <input type="hidden" name="__VIEWSTATEGENERATOR" id="__VIEWSTATEGENERATOR" value="DB1B4C9A">
    <input type="hidden" name="__VIEWSTATEENCRYPTED" id="__VIEWSTATEENCRYPTED" value="">
    <input type="hidden" name="__EVENTVALIDATION" id="__EVENTVALIDATION" value="1VwWBXRC4VxY+kp81t6G1Br+tCRFevD8n2Lbeac9OIVjBqrut+UWHRa27xMV7iaWP4ciIskwl4p4HKGaVL+7Uo3NghL3eWyVrGtGbnCKqOokL1GWdNeFEXy0a2ua1GR+q64v0x3VS7vgJo8qybjFVQ==">
  </div>
  <div id="showMobile" class="hidden" style="vertical-align: middle; text-align: center; position: fixed; top: 0; left: 0; right: 0; width: auto; height: 80px; background-color: #F1F1F1; z-index: 998;">
    <div class="container-fluid" style="margin: auto; vertical-align: center;">
      <div class="center-block" style="min-height: 100%; display: flex; align-items: center; vertical-align: middle; margin: auto;">
        <a id="dismissMobile" class="alert-link" style="vertical-align: middle; text-align: left; margin-right: 10px;">
                        <h3 style="color: #929292;">
                            <label for="dismiss-mobile-close" class="hide-element">Close</label>
                            <i id="dismiss-mobile-close" class="fa fa-close"></i>
                        </h3>
                    </a>
        <img src="Images/ems-app-icon.png?v=221" alt="logo" style="max-width: 50px; height: auto; display: inline-block; text-align: right; vertical-align: middle;">
        <div class="col-xs-6" style="display: inline-block; vertical-align: middle;  text-align: left;">
          <h4>EMS Mobile App</h4>
        </div>
        <a id="launchMobile" class="intent alert-link" style="display: inline-block; vertical-align: middle; text-align: left; margin: 10px;" data-scheme="emssoftware://">
                        <h3 style="color: #007AFF">Open</h3>
                    </a>
      </div>
    </div>
  </div>
  <div class="invisible-screenreader-only">
    <p id="section-loading-opened-aria-live-element" aria-live="polite"></p>
    <p id="page-loading-aria-live-element" aria-live="polite"></p>
    <p id="page-loading-aria-live-element_nav" aria-live="polite"></p>
  </div>
  <div id="page-loading-overlay" style="display: none;">
    <img class="loading-animation" src="Images/Loading.gif" alt="Loading...">
  </div>
  <h1 id="ApplicationTitle" class="ApplicationTitle hide"> Event Request System </h1>
  <header id="header" class="navbar navbar-default navbar-fixed-top">
    <div class="container-fluid">
      <div id="nav-logo-section" class="navbar-header">
        <button type="button" id="sideBar" tabindex="2" class="navbar-toggle collapsed" onfocus="CreateBorder(this,true,'navicon')" onblur="CreateBorder(this,false,'navicon')" onclick="vems.toggleSideBar();">
          <span class="sr-only"></span>
          <i class="fa fa-navicon"></i>
        </button>
        <div class="navbar-brand">
          <table>
            <tbody>
              <tr>
                <td>
                  <a class="ems-logo-link" href="./">
                            <img src="Images/logo.png?v=221" class="ems-logo" title="Logo Link to Home Page">
                        </a>
                </td>
                <td>
                  <label class="lineheader"></label>
                </td>
              </tr>
            </tbody>
          </table>
        </div>
      </div>
      <div id="page-title" class="navbar-header">
        <h1>Event Request System</h1>
        <button tabindex="1" id="invisibleBypassLink" type="button" onclick="vems.QuickNavLink(); return false;" aria-label="Skip to Main content">Skip to Main content</button>
      </div>
      <div id="user-menu-section" class="navbar-collapse" role="navigation" aria-label="header">
        <ul class="nav navbar-nav navbar-right">
          <li id="help-icon" class="help-icon dropdown">
            <a href="#" id="helpicon" class="dropdown-toggle" data-toggle="dropdown" onfocus="CreateBorder(this,true,'help')" onblur="CreateBorder(this,false,'help')" role="button" aria-haspopup="true" aria-expanded="false" aria-label="Help"><i id="helpid" class="fa fa-question-circle"></i></a>
            <ul class="dropdown-menu">
              <!-- ko foreach: helpMenuItems -->
              <li><a onkeydown="linkClicked(event)" data-bind="text: vems.decodeHtml(Text), attr: {'href': NavigateUrl}, click: $root.menuItemClicked" href="About.aspx">About</a></li>
              <li>
                <a onkeydown="linkClicked(event)" data-bind="text: vems.decodeHtml(Text), attr: {'href': NavigateUrl}, click: $root.menuItemClicked" href="https://success.emssoftware.com/Content/UserGuides/3_EMSWebAppV44.1_UG.htm?tocpath=User%20Guides%7CEMS%20Web%20App%20%7C_____0?data=Yx22vViF5q1LUofOTneSVstASKgjOioQD%2fGjb4Y4sJSh%2fh%2ft8XBzENXrDln21HSMVCE7sQRc14g%3d">User Manual</a>
              </li>
              <!-- /ko -->
              <!-- ko if: customHelpMenuItems().length > 0 -->
              <li class="divider" aria-hidden="true" role="separator"></li>
              <!-- ko foreach: customHelpMenuItems -->
              <li><a onkeydown="linkClicked(event)" data-bind="text: vems.decodeHtml(Text), attr: {'href': NavigateUrl}, click: $root.menuItemClicked" href="https://www.purdue.edu/apps/account/BoilerKey/">Login Help</a></li>
              <!-- /ko -->
              <!-- /ko -->
            </ul>
          </li>
          <li class="dropdown user-menu" id="user-menu">
            <a href="#" id="usernameid" class="dropdown-toggle" onfocus="CreateBorder(this,true,'user')" onblur="CreateBorder(this,false,'user')" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">
                                <div id="user-name" class="ellipsis-text">
                                    Welcome, Guest.
                                    
                                </div>
                            </a>
            <ul class="dropdown-menu" id="user-menu-dropdown" data-bind="visible: showGuestUserMenu || (showAuthUserMenu &amp;&amp; userMenuItems().length > 0)">
              <!-- ko if: showAuthUserMenu --><!-- /ko -->
              <!-- ko if: showGuestUserMenu && !showAuthUserMenu -->
              <li><a href="SamlAuth.aspx">Sign In</a></li>
              <!-- /ko -->
            </ul>
          </li>
        </ul>
      </div>
      <!-- /.navbar-collapse -->
    </div>
    <!-- /.container-fluid -->
    <script>
      window.addEventListener('resize', function() {
        var headerBar = $('#header');
        if (headerBar.width() >= 758) { // provides override for increased screen sizes and removes for lower screen sizes and prevents re-positioning of hamburger menu
          $('.navbar-toggle').addClass("navbar-toggle-override");
        } else {
          $('.navbar-toggle').removeClass("navbar-toggle-override");
        }
      }, true);
    </script>
  </header>
  <div id="wrapper">
    <!-- Sidebar -->
    <div id="sidebar-wrapper" role="navigation" aria-label="navigation">
      <ul class="sidebar-nav" data-bind="foreach: mainMenuItems">
        <!-- HR before the Links menu -->
        <!-- ko if: Id == 4  --><!-- /ko -->
        <!-- hide My Events on Mobile Web -->
        <!-- ko ifnot: DevExpress.devices.real().phone && Id === 9 -->
        <li id="sideNavigation" data-bind="css: { 'no-click': NavigateUrl.length == 0 }">
          <a id="sidebar-wrapper-home" data-bind="css: { 'current-page': $root.OnMenuItemPage(NavigateUrl) }, attr: {'href': NavigateUrl.length > 0 ? NavigateUrl : '#', 'title': vems.decodeHtml(Text),'role':NavigateUrl.length > 0? 'none':'presentation'}, click: $root.menuItemClicked" class="current-page" href="Default.aspx" title="Home" role="none">
                            <i class="fa fa-home" data-bind="css: IconClass"></i>
                            <span data-bind="text: vems.decodeHtml(Text)">Home</span>
                        </a>
        </li>
        <div data-bind="foreach: ChildMenus"></div>
        <!-- /ko -->
        <!-- HR before the Links menu -->
        <!-- ko if: Id == 4  --><!-- /ko -->
        <!-- hide My Events on Mobile Web -->
        <!-- ko ifnot: DevExpress.devices.real().phone && Id === 9 -->
        <li id="sideNavigation" data-bind="css: { 'no-click': NavigateUrl.length == 0 }">
          <a id="sidebar-wrapper-home" data-bind="css: { 'current-page': $root.OnMenuItemPage(NavigateUrl) }, attr: {'href': NavigateUrl.length > 0 ? NavigateUrl : '#', 'title': vems.decodeHtml(Text),'role':NavigateUrl.length > 0? 'none':'presentation'}, click: $root.menuItemClicked" href="/web/ClassicRequestForm.aspx?data=ity3Dem%2byxxGFZTQvNr975K4dCU8QwV7" title="Create A Request" role="none">
                            <i class="fa fa-calendar" data-bind="css: IconClass"></i>
                            <span data-bind="text: vems.decodeHtml(Text)">Create A Request</span>
                        </a>
        </li>
        <div data-bind="foreach: ChildMenus"></div>
        <!-- /ko -->
        <!-- HR before the Links menu -->
        <!-- ko if: Id == 4  -->
        <li>
          <hr>
        </li>
        <!-- /ko -->
        <!-- hide My Events on Mobile Web -->
        <!-- ko ifnot: DevExpress.devices.real().phone && Id === 9 -->
        <li id="sideNavigation" data-bind="css: { 'no-click': NavigateUrl.length == 0 }" class="no-click">
          <a id="sidebar-wrapper-home" data-bind="css: { 'current-page': $root.OnMenuItemPage(NavigateUrl) }, attr: {'href': NavigateUrl.length > 0 ? NavigateUrl : '#', 'title': vems.decodeHtml(Text),'role':NavigateUrl.length > 0? 'none':'presentation'}, click: $root.menuItemClicked" href="#" title="Links" role="presentation">
                            <i class="fa fa-external-link-square" data-bind="css: IconClass"></i>
                            <span data-bind="text: vems.decodeHtml(Text)">Links</span>
                        </a>
        </li>
        <div data-bind="foreach: ChildMenus">
          <li id="sideNavigationUrl" class="secondary resource-link" data-bind="css: { &quot;resource-link&quot;: $parent.Id == 4 }">
            <a data-bind="css: { 'current-page': $root.OnMenuItemPage(NavigateUrl) }, attr: {'href': NavigateUrl, 'title': vems.decodeHtml(Text)}, click: $root.menuItemClicked" href="https://www.boilerlink.purdue.edu/" title="BoilerLink">
                                <i class="fa" data-bind="css: IconClass"></i>
                                <span data-bind="text: vems.decodeHtml(Text)">BoilerLink</span>
                            </a>
          </li>
          <li id="sideNavigationUrl" class="secondary resource-link" data-bind="css: { &quot;resource-link&quot;: $parent.Id == 4 }">
            <a data-bind="css: { 'current-page': $root.OnMenuItemPage(NavigateUrl) }, attr: {'href': NavigateUrl, 'title': vems.decodeHtml(Text)}, click: $root.menuItemClicked" href="https://www.purdue.edu/campus_map/" title="Campus Map">
                                <i class="fa" data-bind="css: IconClass"></i>
                                <span data-bind="text: vems.decodeHtml(Text)">Campus Map</span>
                            </a>
          </li>
          <li id="sideNavigationUrl" class="secondary resource-link" data-bind="css: { &quot;resource-link&quot;: $parent.Id == 4 }">
            <a data-bind="css: { 'current-page': $root.OnMenuItemPage(NavigateUrl) }, attr: {'href': NavigateUrl, 'title': vems.decodeHtml(Text)}, click: $root.menuItemClicked" href="https://www.purdue.edu/hallofmusic/" title="Hall of Music">
                                <i class="fa" data-bind="css: IconClass"></i>
                                <span data-bind="text: vems.decodeHtml(Text)">Hall of Music</span>
                            </a>
          </li>
          <li id="sideNavigationUrl" class="secondary resource-link" data-bind="css: { &quot;resource-link&quot;: $parent.Id == 4 }">
            <a data-bind="css: { 'current-page': $root.OnMenuItemPage(NavigateUrl) }, attr: {'href': NavigateUrl, 'title': vems.decodeHtml(Text)}, click: $root.menuItemClicked" href="https://www.purdue.edu/parking/" title="Parking Services">
                                <i class="fa" data-bind="css: IconClass"></i>
                                <span data-bind="text: vems.decodeHtml(Text)">Parking Services</span>
                            </a>
          </li>
          <li id="sideNavigationUrl" class="secondary resource-link" data-bind="css: { &quot;resource-link&quot;: $parent.Id == 4 }">
            <a data-bind="css: { 'current-page': $root.OnMenuItemPage(NavigateUrl) }, attr: {'href': NavigateUrl, 'title': vems.decodeHtml(Text)}, click: $root.menuItemClicked" href="https://www.purdue.edu/conferences/" title="Purdue Conferences">
                                <i class="fa" data-bind="css: IconClass"></i>
                                <span data-bind="text: vems.decodeHtml(Text)">Purdue Conferences</span>
                            </a>
          </li>
          <li id="sideNavigationUrl" class="secondary resource-link" data-bind="css: { &quot;resource-link&quot;: $parent.Id == 4 }">
            <a data-bind="css: { 'current-page': $root.OnMenuItemPage(NavigateUrl) }, attr: {'href': NavigateUrl, 'title': vems.decodeHtml(Text)}, click: $root.menuItemClicked" href="https://dining.purdue.edu/Catering/index.html" title="Purdue Student Event Services">
                                <i class="fa" data-bind="css: IconClass"></i>
                                <span data-bind="text: vems.decodeHtml(Text)">Purdue Student Event Services</span>
                            </a>
          </li>
          <li id="sideNavigationUrl" class="secondary resource-link" data-bind="css: { &quot;resource-link&quot;: $parent.Id == 4 }">
            <a data-bind="css: { 'current-page': $root.OnMenuItemPage(NavigateUrl) }, attr: {'href': NavigateUrl, 'title': vems.decodeHtml(Text)}, click: $root.menuItemClicked" href="https://timetable.mypurdue.purdue.edu/Timetabling/selectPrimaryRole.do" title="Classroom Space Requests">
                                <i class="fa" data-bind="css: IconClass"></i>
                                <span data-bind="text: vems.decodeHtml(Text)">Classroom Space Requests</span>
                            </a>
          </li>
        </div>
        <!-- /ko -->
      </ul>
    </div>
    <!-- end sidebar-wrapper -->
    <div>
      <div id="page-content-wrapper" class="page-content-wrapper" role="navigation" aria-label="main">
        <div class="container-fluid main-content" id="page">
          <div id="page-title-responsive">
            <h1>Event Request System</h1>
          </div>
          <div id="Summary" class="errorSummary" style="color:Red;display:none;">
          </div>
          <p class="invisible-screenreader-only" id="random-aria-live-element" aria-live="polite"></p>
          <span style="display: none">
            <h1 id="pc_ApplicationTitle" class="ApplicationTitle"> Event Request System </h1>
          </span>
          <div id="language" role="alert" aria-live="assertive" aria-label="This Application is in English Language"></div>
          <div id="home" style="height: 100%;">
            <ul id="default-tablist" class="nav nav-tabs" role="tablist">
              <li role="presentation" id="site-home-tab" class="active"><a href="#site-home" data-first-spacelink="1" data-first-navlink="1" data-toggle="tab" role="tab">Site Home</a></li>
              <li role="presentation" id="my-home-tab"><a href="#my-home" data-toggle="tab" role="tab">My Home</a></li>
              <a id="pc_guestHelp" class="fa fa-question-circle help-text-icon" data-helptextkey="VEMSDefaultPageHelpForGuests" data-parenttype="None" data-parentid="0" href="#"></a>
            </ul>
            <!-- Tab panes -->
            <div class="tab-content">
              <div role="tabpanel" class="tab-pane fade in active" id="site-home" tabindex="0">
                <div class="default-page-help-text">
                  <div id="pc_HomeHelp" class="default-page-help-text-content">
                    <!-- Help Text configuration in EMS Desktop Client: "Default.aspx - Displays in the 'Site Home' tab on the home page for guest users" -->
                    <style>
                      #default-tablist {
                        display: none;
                      }

                      /* lp stands for landing page, namespace to avoid collision with EMS CSS selectors */
                      .lp-jumbotron {
                        background-image: url("https://www.purdue.edu/vpsl/_assets/EMS-assets/images/memorial-mall.jpg");
                        background-position: center 25%;
                        background-repeat: none;
                        background-size: cover;
                        border-radius: 0 !important;
                        box-shadow: inset 0 0 0 1000px rgba(0, 0, 0, 0.65);
                        margin-left: -15px;
                        margin-right: -15px;
                        padding-bottom: 30px;
                        padding-top: 30px;
                        text-align: center;
                      }

                      @media all and (min-width: 992px) {
                        .lp-jumbotron {
                          margin-top: -16px;
                        }
                      }

                      .lp-jumbotron h1 {
                        color: white;
                        font-weight: 600;
                        font-size: 28px;
                        margin-top: 0;
                      }

                      .lp-jumbotron__buttons {
                        display: flex;
                        flex-wrap: wrap;
                        justify-content: center;
                        margin-left: -10px;
                        margin-right: -10px;
                        margin-top: 20px;
                      }

                      .lp-jumbotron__buttons .btn {
                        margin: 6px 10px 0;
                      }

                      .lp-jumbotron__buttons .btn-primary:visited {
                        color: #000;
                      }

                      .lp-tiles {
                        display: flex;
                        flex-direction: row;
                        flex-wrap: wrap;
                        margin: 0 -15px;
                        padding: 10px 5px;
                      }

                      .lp-col--left .lp-tiles {
                        background-color: #cfb991;
                      }

                      .lp-col--right .lp-tiles {
                        background-color: #000;
                      }

                      /* Give the tiles sensible sizes at different screen sizes */
                      .lp-tile {
                        width: 100%;
                        flex-shrink: 0;
                        padding: 10px;
                      }

                      .lp-tile__inner {
                        display: flex;
                        flex-direction: column;
                        height: 100%;
                        position: relative;
                      }

                      .lp-col--left .lp-tile__inner {
                        border-bottom: 0.5rem solid #8e6f3e;
                      }

                      .lp-col--right .lp-tile__inner {
                        border-bottom: 0.5rem solid #9d9795;
                      }

                      .lp-tile__inner .fa-stack {
                        position: absolute;
                        right: -0.625rem;
                        top: -0.625rem;
                      }

                      .lp-tile__img {
                        overflow: hidden;
                        height: 0;
                        padding-top: 41.84%;
                        /* 2.39:1 aspect ratio */
                      }

                      .lp-tile__content {
                        background-color: white;
                        border-top: 1px solid #dfe1e2;
                        flex-grow: 1;
                        padding: 15px;
                      }

                      .lp-tile__heading {
                        color: inherit;
                        font-size: 16px;
                        font-weight: 600;
                        margin-top: 0;
                        padding-bottom: 0;
                      }

                      .lp-tile__links {
                        display: flex;
                        list-style-type: none;
                        margin: 0;
                        padding: 0;
                      }

                      .lp-tile__links li {
                        flex: 1;
                        font-size: 14px;
                      }

                      .lp-tile__links .fa {
                        margin-right: 5px;
                      }

                      .lp-tile__links a,
                      .lp-tile__links a:link,
                      .lp-tile__links a:visited,
                      .lp-tile__links a:focus,
                      .lp-tile__links a:hover,
                      .lp-tile__links a:active {
                        color: #000;
                      }

                      .lp-section-header {
                        text-align: center;
                      }

                      .lp-section-header h2 {
                        margin-bottom: 0.5rem;
                        margin-top: 0.75rem;
                      }

                      .lp-section-header p {
                        font-size: 14px;
                      }

                      .lp-section-sub-header h3 {
                        font-size: 1.25rem;
                        font-weight: 600;
                        margin-bottom: 1rem;
                        margin-top: 1.25rem;
                        padding-bottom: 0;
                      }

                      .lp-section-sub-header .fa {
                        margin-right: 0.325rem;
                      }

                      .lp-col--left .lp-section-sub-header h3,
                      .lp-col--left .lp-section-sub-header .fa {
                        color: #8e6f3e;
                      }

                      .lp-col--right .lp-section-sub-header h3,
                      .lp-col--right .lp-section-sub-header .fa {
                        color: #000;
                      }

                      .lp-reservable .fa-circle {
                        color: #daaa00;
                      }

                      @media all and (min-width: 400px) {
                        .lp-tile {
                          width: 50%;
                        }

                        .lp-tile__links {
                          flex-direction: column;
                        }

                        .lp-tile__links li+li {
                          margin-top: 8px;
                        }
                      }

                      @media all and (min-width: 600px) {
                        .lp-tile {
                          width: 33.33%;
                        }
                      }

                      @media all and (min-width: 768px) {
                        .lp-tile {
                          width: 50%;
                        }
                      }

                      @media all and (min-width: 900px) {
                        .lp-tile {
                          width: 33.33%;
                        }
                      }

                      @media all and (min-width: 1200px) {
                        .lp-section-sub-header h3 {
                          margin-top: 0;
                        }

                        .lp-row {
                          display: flex;
                          margin: 0 -10px;
                        }

                        .lp-col--left {
                          padding: 0 10px;
                          width: 66.66%;
                        }

                        .lp-col--right {
                          padding: 0 10px;
                          width: 33.33%;
                        }

                        /* Give the illusion of non-overlapping background colors */
                        .lp-col--left .lp-tiles {
                          box-shadow: inset -5px 0 0 0 #fff;
                        }

                        .lp-col--right .lp-tiles {
                          box-shadow: inset 5px 0 0 0 #cfb991;
                        }

                        .lp-col--left .lp-tile {
                          width: 50%;
                        }

                        .lp-col--right .lp-tile {
                          width: 100%;
                        }

                        .lp-tile__links {
                          flex-direction: row;
                        }

                        .lp-tile__links li+li {
                          margin-top: 0;
                        }
                      }

                      @media all and (min-width: 1400px) {
                        .lp-col--left {
                          width: 75%;
                        }

                        .lp-col--right {
                          width: 25%;
                        }

                        .lp-col--left .lp-tile {
                          width: 33.33%;
                        }

                        .lp-col--right .lp-tile {
                          width: 100%;
                        }
                      }

                      @media all and (min-width: 1700px) {
                        .lp-col--left {
                          width: 80%;
                        }

                        .lp-col--right {
                          width: 20%;
                        }

                        .lp-col--left .lp-tile {
                          width: 25%;
                        }

                        .lp-col--right .lp-tile {
                          width: 100%;
                        }
                      }
                    </style>
                    <div class="jumbotron lp-jumbotron">
                      <h1>Welcome to the Event and Space Request System!</h1>
                      <p class="lp-jumbotron__buttons"><a class="btn btn-primary btn-lg" href="https://purdue.emscloudservice.com/web/samlauth.aspx" tabindex="0" aria-label="Purdue Sign In">Purdue Sign In</a>
                        <a id="guestRequestButton" class="btn btn-primary btn-lg" href="/web/ClassicRequestForm.aspx?data=ity3Dem%2byxxGFZTQvNr975K4dCU8QwV7" tabindex="0" aria-label="Guest Request">Guest Request</a> </p>
                      <a role="button" tabindex="0" id="guestRequestTooltipLink" style="font-weight: 600; color: white" href="" aria-label="Help me decide">Help me decide</a>
                      <script>
                        document.addEventListener("DOMContentLoaded", function() {
                          document.getElementById("guestRequestButton").setAttribute("href", document.querySelector("#create-request-unauth > [href]").getAttribute("href"));
                          document.getElementById("guestRequestTooltipLink").addEventListener("click", function(e) {
                            e.preventDefault();
                            document.getElementById("pc_guestHelp").click();
                          });
                        });
                      </script>
                    </div>
                    <div class="lp-section-header">
                      <h2>Event Space and Food Options</h2>
                      <p aria-hidden=""><small><span class="fa-stack fa-lg lp-reservable"><i class="fa fa-circle fa-stack-2x"></i><i class="fa fa-calendar fa-stack-1x"></i></span></small>= Reservable via this website </p>
                    </div>
                    <div class="lp-row">
                      <div class="lp-col--left">
                        <div class="lp-section-sub-header">
                          <h3><span class="fa fa-square"></span>Space Options</h3>
                        </div>
                        <div class="lp-tiles">
                          <div class="lp-tile">
                            <div class="lp-tile__inner">
                              <div class="lp-tile__img" style="background-image: url(https://www.purdue.edu/vpsl/_assets/EMS-assets/images/recwell.jpg); background-repeat: no-repeat; background-position: center center; background-size: cover"></div>
                              <div class="lp-tile__content">
                                <h3 class="lp-tile__heading">RecWell Spaces</h3>
                                <ul class="lp-tile__links">
                                  <li><a href="https://www.purdue.edu/recwell/membership-reservations/rentals/index.php" target="_blank" tabindex="0" aria-label="Learn more">Learn more</a>
                                  </li>
                                  <li><a href="mailto:recwellreservations@purdue.edu" tabindex="0" aria-label="Contact">Contact</a> </li>
                                </ul>
                              </div><span class="fa-stack fa-lg lp-reservable"><i class="fa fa-circle fa-stack-2x"></i><i class="fa fa-calendar fa-stack-1x"></i></span>
                            </div>
                          </div>
                          <div class="lp-tile">
                            <div class="lp-tile__inner">
                              <div class="lp-tile__img" style="background-image: url(https://www.purdue.edu/vpsl/_assets/EMS-assets/images/krach.jpg); background-repeat: no-repeat; background-position: center center; background-size: cover"></div>
                              <div class="lp-tile__content">
                                <h3 class="lp-tile__heading">Krach Leadership Center</h3>
                                <ul class="lp-tile__links">
                                  <li><a href="https://www.purdue.edu/sao/krach/index.html" target="_blank" tabindex="0" aria-label="Learn more">Learn more</a>
                                  </li>
                                  <li><a href="mailto:krach@purdue.edu" tabindex="0" aria-label="Contact">Contact</a> </li>
                                </ul>
                              </div><span class="fa-stack fa-lg lp-reservable"><i class="fa fa-circle fa-stack-2x"></i><i class="fa fa-calendar fa-stack-1x"></i></span>
                            </div>
                          </div>
                          <div class="lp-tile">
                            <div class="lp-tile__inner">
                              <div class="lp-tile__img" style="background-image: url(https://www.purdue.edu/vpsl/_assets/EMS-assets/images/union.jpg); background-repeat: no-repeat; background-position: center center; background-size: cover"></div>
                              <div class="lp-tile__content">
                                <h3 class="lp-tile__heading">Purdue Memorial Union</h3>
                                <ul class="lp-tile__links">
                                  <li><a href="https://union.purdue.edu/event-services/venues/pmu.html" target="_blank" tabindex="0" aria-label="Learn more">Learn more</a>
                                  </li>
                                  <li><a href="mailto:events@purdue.edu" tabindex="0" aria-label="Contact">Contact</a> </li>
                                </ul>
                              </div><span class="fa-stack fa-lg lp-reservable"><i class="fa fa-circle fa-stack-2x"></i><i class="fa fa-calendar fa-stack-1x"></i></span>
                            </div>
                          </div>
                          <div class="lp-tile">
                            <div class="lp-tile__inner">
                              <div class="lp-tile__img" style="background-image: url(https://www.purdue.edu/vpsl/_assets/EMS-assets/images/stewart.jpg); background-repeat: no-repeat; background-position: center center; background-size: cover"></div>
                              <div class="lp-tile__content">
                                <h3 class="lp-tile__heading">Stewart Center</h3>
                                <ul class="lp-tile__links">
                                  <li><a href="https://union.purdue.edu/event-services/venues/stewart/stewart-space-reservations.html" target="_blank" tabindex="0" aria-label="Learn more">Learn more</a>
                                  </li>
                                  <li><a href="mailto:events@purdue.edu" tabindex="0" aria-label="Contact">Contact</a> </li>
                                </ul>
                              </div><span class="fa-stack fa-lg lp-reservable"><i class="fa fa-circle fa-stack-2x"></i><i class="fa fa-calendar fa-stack-1x"></i></span>
                            </div>
                          </div>
                          <div class="lp-tile">
                            <div class="lp-tile__inner">
                              <div class="lp-tile__img" style="background-image: url(https://www.purdue.edu/vpsl/_assets/EMS-assets/images/uch.jpg); background-repeat: no-repeat; background-position: center center; background-size: cover"></div>
                              <div class="lp-tile__content">
                                <h3 class="lp-tile__heading">Union Club Hotel</h3>
                                <ul class="lp-tile__links">
                                  <li><a href="https://www.purdueunionclubhotel.com/venues.htm" target="_blank" tabindex="0" aria-label="Learn more">Learn more</a>
                                  </li>
                                  <li><a href="https://www.purdueunionclubhotel.com/request-information.htm" target="_blank" tabindex="0" aria-label="Contact">Contact</a> </li>
                                </ul>
                              </div>
                            </div>
                          </div>
                          <div class="lp-tile">
                            <div class="lp-tile__inner">
                              <div class="lp-tile__img" style="background-image: url(https://www.purdue.edu/vpsl/_assets/EMS-assets/images/indoor-spaces.jpg); background-repeat: no-repeat; background-position: center center; background-size: cover">
                              </div>
                              <div class="lp-tile__content">
                                <h3 class="lp-tile__heading">Indoor Non-Academic Spaces</h3>
                                <ul class="lp-tile__links">
                                  <li><a href="https://union.purdue.edu/event-services/venues/campus-indoor.html" target="_blank" tabindex="0" aria-label="Learn more">Learn more</a>
                                  </li>
                                  <li><a href="mailto:events@purdue.edu" tabindex="0" aria-label="Contact">Contact</a> </li>
                                </ul>
                              </div><span class="fa-stack fa-lg lp-reservable"><i class="fa fa-circle fa-stack-2x"></i><i class="fa fa-calendar fa-stack-1x"></i></span>
                            </div>
                          </div>
                          <div class="lp-tile">
                            <div class="lp-tile__inner">
                              <div class="lp-tile__img" style="background-image: url(https://www.purdue.edu/vpsl/_assets/EMS-assets/images/outdoor-spaces.jpg); background-repeat: no-repeat; background-position: center center; background-size: cover">
                              </div>
                              <div class="lp-tile__content">
                                <h3 class="lp-tile__heading">Outdoor Spaces</h3>
                                <ul class="lp-tile__links">
                                  <li><a href="https://union.purdue.edu/event-services/venues/outdoor.html" target="_blank" tabindex="0" aria-label="Learn more">Learn more</a>
                                  </li>
                                  <li><a href="mailto:events@purdue.edu" tabindex="0" aria-label="Contact">Contact</a> </li>
                                </ul>
                              </div><span class="fa-stack fa-lg lp-reservable"><i class="fa fa-circle fa-stack-2x"></i><i class="fa fa-calendar fa-stack-1x"></i></span>
                            </div>
                          </div>
                          <div class="lp-tile">
                            <div class="lp-tile__inner">
                              <div class="lp-tile__img" style="background-image: url(https://www.purdue.edu/vpsl/_assets/EMS-assets/images/pmu-rar-bgm.jpg); background-repeat: no-repeat; background-position: center center; background-size: cover">
                              </div>
                              <div class="lp-tile__content">
                                <h3 class="lp-tile__heading">Union Rack &amp; Roll / Boiler Game Mine </h3>
                                <ul class="lp-tile__links">
                                  <li><a href="https://www.union.purdue.edu/racknroll/index.html" target="_blank" tabindex="0" aria-label="Learn more">Learn more</a>
                                  </li>
                                  <li><a href="mailto:unionrc@purdue.edu" tabindex="0" aria-label="Contact">Contact</a> </li>
                                </ul>
                              </div><span class="fa-stack fa-lg lp-reservable"><i class="fa fa-circle fa-stack-2x"></i><i class="fa fa-calendar fa-stack-1x"></i></span>
                            </div>
                          </div>
                        </div>
                      </div>
                      <div class="lp-col--right">
                        <div class="lp-section-sub-header">
                          <h3><span class="fa fa-square"></span>Food Options</h3>
                        </div>
                        <div class="lp-tiles">
                          <div class="lp-tile">
                            <div class="lp-tile__inner">
                              <div class="lp-tile__img"
                                style="background-image: url(https://www.purdue.edu/vpsl/_assets/EMS-assets/images/purdue-university-dining-and-culinary-wide.png); background-repeat: no-repeat; background-position: center center; background-size: cover">
                              </div>
                              <div class="lp-tile__content">
                                <h3 class="lp-tile__heading">Student Event Services</h3>
                                <ul class="lp-tile__links">
                                  <li><a href="https://dining.purdue.edu/Catering/index.html" target="_blank" tabindex="0" aria-label="Learn more">Learn more</a>
                                  </li>
                                  <li><a href="mailto:PDCCatering@purdue.edu" tabindex="0" aria-label="Contact">Contact</a> </li>
                                </ul>
                              </div><span class="fa-stack fa-lg lp-reservable"><i class="fa fa-circle fa-stack-2x"></i><i class="fa fa-calendar fa-stack-1x"></i></span>
                            </div>
                          </div>
                          <div class="lp-tile">
                            <div class="lp-tile__inner">
                              <div class="lp-tile__img"
                                style="background-image: url(https://www.purdue.edu/vpsl/_assets/EMS-assets/images/purdue-food-company-small.png); background-repeat: no-repeat; background-position: center center; background-size: cover"></div>
                              <div class="lp-tile__content">
                                <h3 class="lp-tile__heading">Purdue Food Company</h3>
                                <ul class="lp-tile__links">
                                  <li><a href="https://purdue.campusdish.com/Catering" target="_blank" tabindex="0" aria-label="Learn more">Learn more</a>
                                  </li>
                                  <li><a href="https://purdue.campusdish.com/ContactUs" target="_blank" tabindex="0" aria-label="Contact">Contact</a> </li>
                                </ul>
                              </div>
                            </div>
                          </div>
                        </div>
                      </div>
                    </div>
                  </div>
                </div>
              </div>
              <div role="tabpanel" class="tab-pane fade" id="my-home">
                <div id="conf-msg" style="">
                  <div data-bind="visible: false" style="display: none;">
                    <h1 class="confirm-head">Sign Up Complete</h1>
                    <div class="confirm-row">Congratulations! You have successfully signed up to use EMS! Sign in below.</div>
                  </div>
                  <div data-bind="visible: false" style="display: none;">
                    <h1 class="confirm-head">Your Password Has Been Reset</h1>
                    <div class="confirm-row">Success, you can sign in below using your new password! A confirmation email regarding the password reset has been sent to .</div>
                  </div>
                </div>
                <div class="container-fluid vems-panel" id="signin-panel" style="">
                  <div class="row">
                    <div class="col-md-6 left-subpanel" data-bind="visible: AllowSignIn" style="">
                      <h4 tabindex="0">Sign In</h4>
                      <div id="login" style="height:100%">
                        <div class="clear">
                          <div id="pc_WebText1">
                          </div>
                        </div>
                        <div class="loginDiv">
                          <div id="timeoutMsg" class="timeout-message center-block" style="display: none;">
                            <span class="fa fa-exclamation-circle timeout-icon"></span>
                            <span>Your session has expired, and you have been logged out.<br>Please log in again to continue.</span>
                          </div>
                          <div id="login-standard-div" class="center-block" style="width: 60%; display: none;">
                            <div class="form-group">
                              <label for="userID_input" class="required">User Id</label>
                              <input name="userID_input" type="text" maxlength="300" id="userID_input" class="userId form-control" required="required">
                            </div>
                            <div class="form-group">
                              <label for="password_input" class="required">Password</label>
                              <label for="pwd-hidden-ie" style="display:none;" aria-hidden="true">Password</label>
                              <input id="pwd-hidden-ie" type="password" style="display:none;" maxlength="255" aria-hidden="true" readonly="">
                              <input type="password" class="form-control" id="password_input" required="required" name="password_input" autocomplete="new-password" maxlength="255">
                              <input type="hidden" id="pwdhid" name="pwdhid">
                            </div>
                            <div class="validation-error-message" style="margin-bottom: 10px" data-bind="attr:{'aria-label':'','tabindex':('')?'0':'-1'}" aria-label="" tabindex="-1"></div>
                            <div class="form group text-left">
                              <input type="submit" name="ctl00$pc$btnLogin" value="Sign In" id="pc_btnLogin" class="btn btn-primary">
                            </div>
                          </div>
                          <div id="login-sso-div" class="center-block" style="">
                            <div class="text-center">
                              <button type="button" class="btn btn-primary" onclick="window.location = Dea.loginOverrideUrl">Sign In</button>
                            </div>
                          </div>
                        </div>
                      </div>
                    </div>
                    <div class="col-md-6" id="guest-actions" data-bind="visible: (ShowCreateAccountButton() || AllowUnauthenticatedRequest())" style="vertical-align: middle;">
                      <div>
                        <h4 tabindex="0">Welcome, Guest.</h4>
                      </div>
                      <div id="create-acct" class="text-center" style="margin-top: 1em; display: none;" data-bind="visible: ShowCreateAccountButton">
                        <a class="btn btn-success" onkeydown="handleKeypress(event)" type="button" href="AccountManagement.aspx" data-bind="html: AccountButtonText">Create An Account</a>
                      </div>
                      <div id="create-request-unauth" class="text-center" style="margin-top: 1em;" data-bind="visible: AllowUnauthenticatedRequest">
                        <a class="btn btn-success" onkeydown="handleKeypress(event)" type="button" href="/web/ClassicRequestForm.aspx?data=ity3Dem%2byxxGFZTQvNr975K4dCU8QwV7" data-bind="html: RequestRoomText">Request A Room</a>
                      </div>
                    </div>
                  </div>
                </div>
                <div id="my-home-content" style="display: none;">
                  <!-- My Reservation Templates -->
                  <div id="my-reservation-templates" class="hidden-xs">
                    <h2 tabindex="0" aria-label="My Reservation Templates. There are no templates in the list">My Reservation Templates</h2>
                    <div>
                      <div id="templates-no-results" class="no-bookings-wrap" style="">
                        <h3>You have no templates configured.</h3>
                      </div>
                      <div id="templates-grid" class="booking-grid daily col-xs-12" style="display: none;">
                        <div data-bind="template: { name: 'my-reservation-templates-template', foreach: templates }"></div>
                      </div>
                    </div>
                  </div>
                  <!-- My Reservations -->
                  <div id="my-reservations">
                    <h2 tabindex="0">My Bookings</h2>
                    <div id="my-reservations-content" class="home-my-reservations-content">
                      <div id="my-reservations-overlay" class="home-my-reservations-overlay">
                        <button id="btn-show-my-reservations" class="showMyBookingsColorContrast" onkeydown="handleRecurenceKeyPress(null, null, true, 'showMyBookingsNavigation')" data-bind="click: hideShowMyBookingsButton">Show My Bookings</button>
                      </div>
                      <ul class="nav nav-tabs" role="tablist" id="my-bookings-main-tabs">
                        <li id="my-bookings-title" role="presentation" class="active"><a href="#my-bookings" data-toggle="tab" data-bind="text: localeDate(), event:{keypress:function(data,event){handleKeypress(event) }}">22. Oktober 2023</a></li>
                        <li id="my-bookings-search-tab" role="presentation"><a href="#my-bookings-search" data-toggle="tab" data-bind="event:{keypress:function(data,event){handleKeypress(event) }}" aria-label="Search">Search</a></li>
                        <span class="time-zone-heading" tabindex="0" data-bind="text: vems.decodeHtml(userTimeZone()) + (userTimeZoneAbbr() ? ' [' + userTimeZoneAbbr() + ']' : '')"></span>
                      </ul>
                      <div class="tab-content">
                        <div role="tabpanel" class="tab-pane fade in active" id="my-bookings">
                          <div class="events-loading-overlay">
                            <img class="loading-animation" src="Images/Loading.gif" alt="Loading...">
                          </div>
                          <div class="text-center">
                            <div class="row bordered">
                              <div class="text-center">
                                <div id="sliderContainer"></div>
                              </div>
                            </div>
                            <ul id="my-bookings-tabs" class="nav nav-pills center-pills">
                              <li role="presentation" class="active" data-tabtype="day">
                                <a class="dayColorContrast" href="#my-bookings-daily" data-bind="event:{keypress:function(data,event){handleKeypress(event) }}" aria-label="Day" data-toggle="tab" role="button" title="Day">Day</a></li>
                              <li role="presentation" data-tabtype="month">
                                <a class="monthColorContrast" href="#my-bookings-monthly" data-bind="event:{keypress:function(data,event){handleKeypress(event)}}" aria-label="Month" data-toggle="tab" role="button" title="Month">Month</a></li>
                              <li role="presentation" data-tabtype="search">
                                <div class="date input-group" id="my-bookings-datepicker">
                                  <label for="hidden-date-input" style="display: none;">Date</label>
                                  <input tabindex="-1" id="hidden-date-input" type="text" maxlength="255" readonly="">
                                  <a class="input-group-addon datePickerColorContrast" role="button" title="Select A Date" aria-label="Select A Date">
                                                        <div class="dateContrast" tabindex="0">
                                                           Date&nbsp;
                                                            <i class="fa fa-angle-down"></i>
                                                        </div>
                                                    </a>
                                </div>
                              </li>
                            </ul>
                            <div class="previous-today-next pull-right">
                              <a class="hidden-sm hidden-xs" data-bind="click: previousTodayNextHandler.bind($data, -1), event: {
                                                keyup: function (data, e) { if (e.keyCode === 13 || e.keyCode === 32) { previousTodayNextHandler(-1); } } }" tabindex="0">
                                                Previous
                                            </a>
                              <a class="hidden-md hidden-lg fa fa-chevron-left" data-bind="click: previousTodayNextHandler.bind($data, -1), event: {
                                                keyup: function (data, e) { if (e.keyCode === 13 || e.keyCode === 32) { previousTodayNextHandler(-1); } } }" tabindex="0"></a>
                              <a data-bind="click: previousTodayNextHandler.bind($data, 0), event: {
                                                keyup: function (data, e) { if (e.keyCode === 13 || e.keyCode === 32) { previousTodayNextHandler(0); } } }" tabindex="0">
                                                Today
                                            </a>
                              <a class="hidden-sm hidden-xs" data-bind="click: previousTodayNextHandler.bind($data, 1), event: {
                                                keyup: function (data, e) { if (e.keyCode === 13  || e.keyCode === 32) { previousTodayNextHandler(1); } } }" tabindex="0">
                                                Next
                                            </a>
                              <a class="hidden-md hidden-lg fa fa-chevron-right" data-bind="click: previousTodayNextHandler.bind($data, 1), event: {
                                                keyup: function (data, e) { if (e.keyCode === 13  || e.keyCode === 32) { previousTodayNextHandler(1); } } }" tabindex="0"></a>
                            </div>
                          </div>
                          <div class="tab-content">
                            <div role="tabpanel" class="tab-pane fade in active" id="my-bookings-daily" style="position: relative;">
                              <!-- ko if: gettingEventsForDay() --><!-- /ko -->
                              <!-- ko if: events().length > 0 --><!-- /ko -->
                              <!-- ko if: events().length == 0 -->
                              <div id="no-bookings-wrap" class="no-bookings-wrap">
                                <h3 tabindex="0" data-bind="text: vems.decodeHtml(vems.noBookingsForDate.replace('{0}', localeDate()))">There are no bookings for 22. Oktober 2023</h3>
                                <h4 data-bind="visible: nextBookingDate() !== null, click: getEventsForDay.bind($data, nextBookingDate(), true)" style="display: none;">
                                  <a tabindex="0" data-bind="event:{keypress:function(data,event){handleKeypress(event) }}" href="#"><i class="fa fa-external-link-square"></i>Take me to the next day containing bookings.</a>
                                </h4>
                              </div>
                              <!-- /ko -->
                            </div>
                            <div role="tabpanel" class="tab-pane fade" id="my-bookings-monthly">
                              <div id="bookings-monthly-calendar" class="dx-widget dx-visibility-change-handler dx-calendar dx-calendar-view-month dx-swipeable" tabindex="0" role="listbox" aria-label="Calendar"
                                aria-activedescendant="dx-578ee532-bbcb-4e46-67c9-e757231bb272" style="width: 100%; height: 400px;"><input type="hidden" value="2023-10-22">
                                <div class="dx-calendar-body">
                                  <div class="dx-calendar-views-wrapper">
                                    <div class="dx-widget" style="transform: translate(0px, 0px);">
                                      <table>
                                        <thead>
                                          <tr>
                                            <th>Sun</th>
                                            <th>Mon</th>
                                            <th>Tue</th>
                                            <th>Wed</th>
                                            <th>Thu</th>
                                            <th>Fri</th>
                                            <th>Sat</th>
                                          </tr>
                                        </thead>
                                        <tbody>
                                          <tr>
                                            <td class="dx-calendar-cell dx-calendar-other-view dx-calendar-other-month" data-value="2023/09/24" role="option" aria-label="Sunday, September 24, 2023" style="background-color: rgb(242, 242, 234);">
                                              <div tabindex="-1" aria-hidden="true" class="calendar-cell-container calendar-cell-weekend">
                                                <div aria-hidden="true" tabindex="-1" class="calendar-cell-text">24</div>
                                                <div aria-hidden="true" booking-count="0" class="calendar-cell-gauge" style="height: 0px;"></div>
                                              </div>
                                            </td>
                                            <td class="dx-calendar-cell dx-calendar-other-view dx-calendar-other-month" data-value="2023/09/25" role="option" aria-label="Monday, September 25, 2023">
                                              <div tabindex="-1" aria-hidden="true" class="calendar-cell-container">
                                                <div aria-hidden="true" tabindex="-1" class="calendar-cell-text">25</div>
                                                <div aria-hidden="true" booking-count="0" class="calendar-cell-gauge" style="height: 0px;"></div>
                                              </div>
                                            </td>
                                            <td class="dx-calendar-cell dx-calendar-other-view dx-calendar-other-month" data-value="2023/09/26" role="option" aria-label="Tuesday, September 26, 2023">
                                              <div tabindex="-1" aria-hidden="true" class="calendar-cell-container">
                                                <div aria-hidden="true" tabindex="-1" class="calendar-cell-text">26</div>
                                                <div aria-hidden="true" booking-count="0" class="calendar-cell-gauge" style="height: 0px;"></div>
                                              </div>
                                            </td>
                                            <td class="dx-calendar-cell dx-calendar-other-view dx-calendar-other-month" data-value="2023/09/27" role="option" aria-label="Wednesday, September 27, 2023">
                                              <div tabindex="-1" aria-hidden="true" class="calendar-cell-container">
                                                <div aria-hidden="true" tabindex="-1" class="calendar-cell-text">27</div>
                                                <div aria-hidden="true" booking-count="0" class="calendar-cell-gauge" style="height: 0px;"></div>
                                              </div>
                                            </td>
                                            <td class="dx-calendar-cell dx-calendar-other-view dx-calendar-other-month" data-value="2023/09/28" role="option" aria-label="Thursday, September 28, 2023">
                                              <div tabindex="-1" aria-hidden="true" class="calendar-cell-container">
                                                <div aria-hidden="true" tabindex="-1" class="calendar-cell-text">28</div>
                                                <div aria-hidden="true" booking-count="0" class="calendar-cell-gauge" style="height: 0px;"></div>
                                              </div>
                                            </td>
                                            <td class="dx-calendar-cell dx-calendar-other-view dx-calendar-other-month" data-value="2023/09/29" role="option" aria-label="Friday, September 29, 2023">
                                              <div tabindex="-1" aria-hidden="true" class="calendar-cell-container">
                                                <div aria-hidden="true" tabindex="-1" class="calendar-cell-text">29</div>
                                                <div aria-hidden="true" booking-count="0" class="calendar-cell-gauge" style="height: 0px;"></div>
                                              </div>
                                            </td>
                                            <td class="dx-calendar-cell dx-calendar-other-view dx-calendar-other-month" data-value="2023/09/30" role="option" aria-label="Saturday, September 30, 2023" style="background-color: rgb(242, 242, 234);">
                                              <div tabindex="-1" aria-hidden="true" class="calendar-cell-container calendar-cell-weekend">
                                                <div aria-hidden="true" tabindex="-1" class="calendar-cell-text">30</div>
                                                <div aria-hidden="true" booking-count="0" class="calendar-cell-gauge" style="height: 0px;"></div>
                                              </div>
                                            </td>
                                          </tr>
                                          <tr>
                                            <td class="dx-calendar-cell" data-value="2023/10/01" role="option" aria-label="Sunday, October 1, 2023" style="background-color: rgb(242, 242, 234);">
                                              <div tabindex="-1" aria-hidden="true" class="calendar-cell-container calendar-cell-weekend">
                                                <div aria-hidden="true" tabindex="-1" class="calendar-cell-text">1</div>
                                                <div aria-hidden="true" booking-count="0" class="calendar-cell-gauge" style="height: 0px;"></div>
                                              </div>
                                            </td>
                                            <td class="dx-calendar-cell" data-value="2023/10/02" role="option" aria-label="Monday, October 2, 2023">
                                              <div tabindex="-1" aria-hidden="true" class="calendar-cell-container">
                                                <div aria-hidden="true" tabindex="-1" class="calendar-cell-text">2</div>
                                                <div aria-hidden="true" booking-count="0" class="calendar-cell-gauge" style="height: 0px;"></div>
                                              </div>
                                            </td>
                                            <td class="dx-calendar-cell" data-value="2023/10/03" role="option" aria-label="Tuesday, October 3, 2023">
                                              <div tabindex="-1" aria-hidden="true" class="calendar-cell-container">
                                                <div aria-hidden="true" tabindex="-1" class="calendar-cell-text">3</div>
                                                <div aria-hidden="true" booking-count="0" class="calendar-cell-gauge" style="height: 0px;"></div>
                                              </div>
                                            </td>
                                            <td class="dx-calendar-cell" data-value="2023/10/04" role="option" aria-label="Wednesday, October 4, 2023">
                                              <div tabindex="-1" aria-hidden="true" class="calendar-cell-container">
                                                <div aria-hidden="true" tabindex="-1" class="calendar-cell-text">4</div>
                                                <div aria-hidden="true" booking-count="0" class="calendar-cell-gauge" style="height: 0px;"></div>
                                              </div>
                                            </td>
                                            <td class="dx-calendar-cell" data-value="2023/10/05" role="option" aria-label="Thursday, October 5, 2023">
                                              <div tabindex="-1" aria-hidden="true" class="calendar-cell-container">
                                                <div aria-hidden="true" tabindex="-1" class="calendar-cell-text">5</div>
                                                <div aria-hidden="true" booking-count="0" class="calendar-cell-gauge" style="height: 0px;"></div>
                                              </div>
                                            </td>
                                            <td class="dx-calendar-cell" data-value="2023/10/06" role="option" aria-label="Friday, October 6, 2023">
                                              <div tabindex="-1" aria-hidden="true" class="calendar-cell-container">
                                                <div aria-hidden="true" tabindex="-1" class="calendar-cell-text">6</div>
                                                <div aria-hidden="true" booking-count="0" class="calendar-cell-gauge" style="height: 0px;"></div>
                                              </div>
                                            </td>
                                            <td class="dx-calendar-cell" data-value="2023/10/07" role="option" aria-label="Saturday, October 7, 2023" style="background-color: rgb(242, 242, 234);">
                                              <div tabindex="-1" aria-hidden="true" class="calendar-cell-container calendar-cell-weekend">
                                                <div aria-hidden="true" tabindex="-1" class="calendar-cell-text">7</div>
                                                <div aria-hidden="true" booking-count="0" class="calendar-cell-gauge" style="height: 0px;"></div>
                                              </div>
                                            </td>
                                          </tr>
                                          <tr>
                                            <td class="dx-calendar-cell" data-value="2023/10/08" role="option" aria-label="Sunday, October 8, 2023" style="background-color: rgb(242, 242, 234);">
                                              <div tabindex="-1" aria-hidden="true" class="calendar-cell-container calendar-cell-weekend">
                                                <div aria-hidden="true" tabindex="-1" class="calendar-cell-text">8</div>
                                                <div aria-hidden="true" booking-count="0" class="calendar-cell-gauge" style="height: 0px;"></div>
                                              </div>
                                            </td>
                                            <td class="dx-calendar-cell" data-value="2023/10/09" role="option" aria-label="Monday, October 9, 2023">
                                              <div tabindex="-1" aria-hidden="true" class="calendar-cell-container">
                                                <div aria-hidden="true" tabindex="-1" class="calendar-cell-text">9</div>
                                                <div aria-hidden="true" booking-count="0" class="calendar-cell-gauge" style="height: 0px;"></div>
                                              </div>
                                            </td>
                                            <td class="dx-calendar-cell" data-value="2023/10/10" role="option" aria-label="Tuesday, October 10, 2023">
                                              <div tabindex="-1" aria-hidden="true" class="calendar-cell-container">
                                                <div aria-hidden="true" tabindex="-1" class="calendar-cell-text">10</div>
                                                <div aria-hidden="true" booking-count="0" class="calendar-cell-gauge" style="height: 0px;"></div>
                                              </div>
                                            </td>
                                            <td class="dx-calendar-cell" data-value="2023/10/11" role="option" aria-label="Wednesday, October 11, 2023">
                                              <div tabindex="-1" aria-hidden="true" class="calendar-cell-container">
                                                <div aria-hidden="true" tabindex="-1" class="calendar-cell-text">11</div>
                                                <div aria-hidden="true" booking-count="0" class="calendar-cell-gauge" style="height: 0px;"></div>
                                              </div>
                                            </td>
                                            <td class="dx-calendar-cell" data-value="2023/10/12" role="option" aria-label="Thursday, October 12, 2023">
                                              <div tabindex="-1" aria-hidden="true" class="calendar-cell-container">
                                                <div aria-hidden="true" tabindex="-1" class="calendar-cell-text">12</div>
                                                <div aria-hidden="true" booking-count="0" class="calendar-cell-gauge" style="height: 0px;"></div>
                                              </div>
                                            </td>
                                            <td class="dx-calendar-cell" data-value="2023/10/13" role="option" aria-label="Friday, October 13, 2023">
                                              <div tabindex="-1" aria-hidden="true" class="calendar-cell-container">
                                                <div aria-hidden="true" tabindex="-1" class="calendar-cell-text">13</div>
                                                <div aria-hidden="true" booking-count="0" class="calendar-cell-gauge" style="height: 0px;"></div>
                                              </div>
                                            </td>
                                            <td class="dx-calendar-cell" data-value="2023/10/14" role="option" aria-label="Saturday, October 14, 2023" style="background-color: rgb(242, 242, 234);">
                                              <div tabindex="-1" aria-hidden="true" class="calendar-cell-container calendar-cell-weekend">
                                                <div aria-hidden="true" tabindex="-1" class="calendar-cell-text">14</div>
                                                <div aria-hidden="true" booking-count="0" class="calendar-cell-gauge" style="height: 0px;"></div>
                                              </div>
                                            </td>
                                          </tr>
                                          <tr>
                                            <td class="dx-calendar-cell" data-value="2023/10/15" role="option" aria-label="Sunday, October 15, 2023" style="background-color: rgb(242, 242, 234);">
                                              <div tabindex="-1" aria-hidden="true" class="calendar-cell-container calendar-cell-weekend">
                                                <div aria-hidden="true" tabindex="-1" class="calendar-cell-text">15</div>
                                                <div aria-hidden="true" booking-count="0" class="calendar-cell-gauge" style="height: 0px;"></div>
                                              </div>
                                            </td>
                                            <td class="dx-calendar-cell" data-value="2023/10/16" role="option" aria-label="Monday, October 16, 2023">
                                              <div tabindex="-1" aria-hidden="true" class="calendar-cell-container">
                                                <div aria-hidden="true" tabindex="-1" class="calendar-cell-text">16</div>
                                                <div aria-hidden="true" booking-count="0" class="calendar-cell-gauge" style="height: 0px;"></div>
                                              </div>
                                            </td>
                                            <td class="dx-calendar-cell" data-value="2023/10/17" role="option" aria-label="Tuesday, October 17, 2023">
                                              <div tabindex="-1" aria-hidden="true" class="calendar-cell-container">
                                                <div aria-hidden="true" tabindex="-1" class="calendar-cell-text">17</div>
                                                <div aria-hidden="true" booking-count="0" class="calendar-cell-gauge" style="height: 0px;"></div>
                                              </div>
                                            </td>
                                            <td class="dx-calendar-cell" data-value="2023/10/18" role="option" aria-label="Wednesday, October 18, 2023">
                                              <div tabindex="-1" aria-hidden="true" class="calendar-cell-container">
                                                <div aria-hidden="true" tabindex="-1" class="calendar-cell-text">18</div>
                                                <div aria-hidden="true" booking-count="0" class="calendar-cell-gauge" style="height: 0px;"></div>
                                              </div>
                                            </td>
                                            <td class="dx-calendar-cell" data-value="2023/10/19" role="option" aria-label="Thursday, October 19, 2023">
                                              <div tabindex="-1" aria-hidden="true" class="calendar-cell-container">
                                                <div aria-hidden="true" tabindex="-1" class="calendar-cell-text">19</div>
                                                <div aria-hidden="true" booking-count="0" class="calendar-cell-gauge" style="height: 0px;"></div>
                                              </div>
                                            </td>
                                            <td class="dx-calendar-cell" data-value="2023/10/20" role="option" aria-label="Friday, October 20, 2023">
                                              <div tabindex="-1" aria-hidden="true" class="calendar-cell-container">
                                                <div aria-hidden="true" tabindex="-1" class="calendar-cell-text">20</div>
                                                <div aria-hidden="true" booking-count="0" class="calendar-cell-gauge" style="height: 0px;"></div>
                                              </div>
                                            </td>
                                            <td class="dx-calendar-cell" data-value="2023/10/21" role="option" aria-label="Saturday, October 21, 2023" style="background-color: rgb(242, 242, 234);">
                                              <div tabindex="-1" aria-hidden="true" class="calendar-cell-container calendar-cell-weekend">
                                                <div aria-hidden="true" tabindex="-1" class="calendar-cell-text">21</div>
                                                <div aria-hidden="true" booking-count="0" class="calendar-cell-gauge" style="height: 0px;"></div>
                                              </div>
                                            </td>
                                          </tr>
                                          <tr>
                                            <td class="dx-calendar-cell dx-calendar-today dx-calendar-selected-date" data-value="2023/10/22" role="option" aria-label="Sunday, October 22, 2023" aria-selected="true"
                                              id="dx-578ee532-bbcb-4e46-67c9-e757231bb272" style="background-color: rgb(242, 242, 234);">
                                              <div tabindex="-1" aria-hidden="true" class="calendar-cell-container calendar-cell-weekend">
                                                <div aria-hidden="true" tabindex="-1" class="calendar-cell-text">22</div>
                                                <div aria-hidden="true" booking-count="0" class="calendar-cell-gauge" style="height: 0px;"></div>
                                              </div>
                                            </td>
                                            <td class="dx-calendar-cell" data-value="2023/10/23" role="option" aria-label="Monday, October 23, 2023">
                                              <div tabindex="-1" aria-hidden="true" class="calendar-cell-container">
                                                <div aria-hidden="true" tabindex="-1" class="calendar-cell-text">23</div>
                                                <div aria-hidden="true" booking-count="0" class="calendar-cell-gauge" style="height: 0px;"></div>
                                              </div>
                                            </td>
                                            <td class="dx-calendar-cell" data-value="2023/10/24" role="option" aria-label="Tuesday, October 24, 2023">
                                              <div tabindex="-1" aria-hidden="true" class="calendar-cell-container">
                                                <div aria-hidden="true" tabindex="-1" class="calendar-cell-text">24</div>
                                                <div aria-hidden="true" booking-count="0" class="calendar-cell-gauge" style="height: 0px;"></div>
                                              </div>
                                            </td>
                                            <td class="dx-calendar-cell" data-value="2023/10/25" role="option" aria-label="Wednesday, October 25, 2023">
                                              <div tabindex="-1" aria-hidden="true" class="calendar-cell-container">
                                                <div aria-hidden="true" tabindex="-1" class="calendar-cell-text">25</div>
                                                <div aria-hidden="true" booking-count="0" class="calendar-cell-gauge" style="height: 0px;"></div>
                                              </div>
                                            </td>
                                            <td class="dx-calendar-cell" data-value="2023/10/26" role="option" aria-label="Thursday, October 26, 2023">
                                              <div tabindex="-1" aria-hidden="true" class="calendar-cell-container">
                                                <div aria-hidden="true" tabindex="-1" class="calendar-cell-text">26</div>
                                                <div aria-hidden="true" booking-count="0" class="calendar-cell-gauge" style="height: 0px;"></div>
                                              </div>
                                            </td>
                                            <td class="dx-calendar-cell" data-value="2023/10/27" role="option" aria-label="Friday, October 27, 2023">
                                              <div tabindex="-1" aria-hidden="true" class="calendar-cell-container">
                                                <div aria-hidden="true" tabindex="-1" class="calendar-cell-text">27</div>
                                                <div aria-hidden="true" booking-count="0" class="calendar-cell-gauge" style="height: 0px;"></div>
                                              </div>
                                            </td>
                                            <td class="dx-calendar-cell" data-value="2023/10/28" role="option" aria-label="Saturday, October 28, 2023" style="background-color: rgb(242, 242, 234);">
                                              <div tabindex="-1" aria-hidden="true" class="calendar-cell-container calendar-cell-weekend">
                                                <div aria-hidden="true" tabindex="-1" class="calendar-cell-text">28</div>
                                                <div aria-hidden="true" booking-count="0" class="calendar-cell-gauge" style="height: 0px;"></div>
                                              </div>
                                            </td>
                                          </tr>
                                          <tr>
                                            <td class="dx-calendar-cell" data-value="2023/10/29" role="option" aria-label="Sunday, October 29, 2023" style="background-color: rgb(242, 242, 234);">
                                              <div tabindex="-1" aria-hidden="true" class="calendar-cell-container calendar-cell-weekend">
                                                <div aria-hidden="true" tabindex="-1" class="calendar-cell-text">29</div>
                                                <div aria-hidden="true" booking-count="0" class="calendar-cell-gauge" style="height: 0px;"></div>
                                              </div>
                                            </td>
                                            <td class="dx-calendar-cell" data-value="2023/10/30" role="option" aria-label="Monday, October 30, 2023">
                                              <div tabindex="-1" aria-hidden="true" class="calendar-cell-container">
                                                <div aria-hidden="true" tabindex="-1" class="calendar-cell-text">30</div>
                                                <div aria-hidden="true" booking-count="0" class="calendar-cell-gauge" style="height: 0px;"></div>
                                              </div>
                                            </td>
                                            <td class="dx-calendar-cell" data-value="2023/10/31" role="option" aria-label="Tuesday, October 31, 2023">
                                              <div tabindex="-1" aria-hidden="true" class="calendar-cell-container">
                                                <div aria-hidden="true" tabindex="-1" class="calendar-cell-text">31</div>
                                                <div aria-hidden="true" booking-count="0" class="calendar-cell-gauge" style="height: 0px;"></div>
                                              </div>
                                            </td>
                                            <td class="dx-calendar-cell dx-calendar-other-view dx-calendar-other-month" data-value="2023/11/01" role="option" aria-label="Wednesday, November 1, 2023">
                                              <div tabindex="-1" aria-hidden="true" class="calendar-cell-container">
                                                <div aria-hidden="true" tabindex="-1" class="calendar-cell-text">1</div>
                                                <div aria-hidden="true" booking-count="0" class="calendar-cell-gauge" style="height: 0px;"></div>
                                              </div>
                                            </td>
                                            <td class="dx-calendar-cell dx-calendar-other-view dx-calendar-other-month" data-value="2023/11/02" role="option" aria-label="Thursday, November 2, 2023">
                                              <div tabindex="-1" aria-hidden="true" class="calendar-cell-container">
                                                <div aria-hidden="true" tabindex="-1" class="calendar-cell-text">2</div>
                                                <div aria-hidden="true" booking-count="0" class="calendar-cell-gauge" style="height: 0px;"></div>
                                              </div>
                                            </td>
                                            <td class="dx-calendar-cell dx-calendar-other-view dx-calendar-other-month" data-value="2023/11/03" role="option" aria-label="Friday, November 3, 2023">
                                              <div tabindex="-1" aria-hidden="true" class="calendar-cell-container">
                                                <div aria-hidden="true" tabindex="-1" class="calendar-cell-text">3</div>
                                                <div aria-hidden="true" booking-count="0" class="calendar-cell-gauge" style="height: 0px;"></div>
                                              </div>
                                            </td>
                                            <td class="dx-calendar-cell dx-calendar-other-view dx-calendar-other-month" data-value="2023/11/04" role="option" aria-label="Saturday, November 4, 2023" style="background-color: rgb(242, 242, 234);">
                                              <div tabindex="-1" aria-hidden="true" class="calendar-cell-container calendar-cell-weekend">
                                                <div aria-hidden="true" tabindex="-1" class="calendar-cell-text">4</div>
                                                <div aria-hidden="true" booking-count="0" class="calendar-cell-gauge" style="height: 0px;"></div>
                                              </div>
                                            </td>
                                          </tr>
                                        </tbody>
                                      </table>
                                    </div>
                                    <div class="dx-widget" style="transform: translate(-100%, 0px);">
                                      <table>
                                        <thead>
                                          <tr>
                                            <th>Sun</th>
                                            <th>Mon</th>
                                            <th>Tue</th>
                                            <th>Wed</th>
                                            <th>Thu</th>
                                            <th>Fri</th>
                                            <th>Sat</th>
                                          </tr>
                                        </thead>
                                        <tbody>
                                          <tr>
                                            <td class="dx-calendar-cell dx-calendar-other-view dx-calendar-other-month" data-value="2023/08/27" role="option" aria-label="Sunday, August 27, 2023" style="background-color: rgb(242, 242, 234);">
                                              <div tabindex="-1" aria-hidden="true" class="calendar-cell-container calendar-cell-weekend">
                                                <div aria-hidden="true" tabindex="-1" class="calendar-cell-text">27</div>
                                                <div aria-hidden="true" booking-count="0" class="calendar-cell-gauge" style="height: 0px;"></div>
                                              </div>
                                            </td>
                                            <td class="dx-calendar-cell dx-calendar-other-view dx-calendar-other-month" data-value="2023/08/28" role="option" aria-label="Monday, August 28, 2023">
                                              <div tabindex="-1" aria-hidden="true" class="calendar-cell-container">
                                                <div aria-hidden="true" tabindex="-1" class="calendar-cell-text">28</div>
                                                <div aria-hidden="true" booking-count="0" class="calendar-cell-gauge" style="height: 0px;"></div>
                                              </div>
                                            </td>
                                            <td class="dx-calendar-cell dx-calendar-other-view dx-calendar-other-month" data-value="2023/08/29" role="option" aria-label="Tuesday, August 29, 2023">
                                              <div tabindex="-1" aria-hidden="true" class="calendar-cell-container">
                                                <div aria-hidden="true" tabindex="-1" class="calendar-cell-text">29</div>
                                                <div aria-hidden="true" booking-count="0" class="calendar-cell-gauge" style="height: 0px;"></div>
                                              </div>
                                            </td>
                                            <td class="dx-calendar-cell dx-calendar-other-view dx-calendar-other-month" data-value="2023/08/30" role="option" aria-label="Wednesday, August 30, 2023">
                                              <div tabindex="-1" aria-hidden="true" class="calendar-cell-container">
                                                <div aria-hidden="true" tabindex="-1" class="calendar-cell-text">30</div>
                                                <div aria-hidden="true" booking-count="0" class="calendar-cell-gauge" style="height: 0px;"></div>
                                              </div>
                                            </td>
                                            <td class="dx-calendar-cell dx-calendar-other-view dx-calendar-other-month" data-value="2023/08/31" role="option" aria-label="Thursday, August 31, 2023">
                                              <div tabindex="-1" aria-hidden="true" class="calendar-cell-container">
                                                <div aria-hidden="true" tabindex="-1" class="calendar-cell-text">31</div>
                                                <div aria-hidden="true" booking-count="0" class="calendar-cell-gauge" style="height: 0px;"></div>
                                              </div>
                                            </td>
                                            <td class="dx-calendar-cell" data-value="2023/09/01" role="option" aria-label="Friday, September 1, 2023">
                                              <div tabindex="-1" aria-hidden="true" class="calendar-cell-container">
                                                <div aria-hidden="true" tabindex="-1" class="calendar-cell-text">1</div>
                                                <div aria-hidden="true" booking-count="0" class="calendar-cell-gauge" style="height: 0px;"></div>
                                              </div>
                                            </td>
                                            <td class="dx-calendar-cell" data-value="2023/09/02" role="option" aria-label="Saturday, September 2, 2023" style="background-color: rgb(242, 242, 234);">
                                              <div tabindex="-1" aria-hidden="true" class="calendar-cell-container calendar-cell-weekend">
                                                <div aria-hidden="true" tabindex="-1" class="calendar-cell-text">2</div>
                                                <div aria-hidden="true" booking-count="0" class="calendar-cell-gauge" style="height: 0px;"></div>
                                              </div>
                                            </td>
                                          </tr>
                                          <tr>
                                            <td class="dx-calendar-cell" data-value="2023/09/03" role="option" aria-label="Sunday, September 3, 2023" style="background-color: rgb(242, 242, 234);">
                                              <div tabindex="-1" aria-hidden="true" class="calendar-cell-container calendar-cell-weekend">
                                                <div aria-hidden="true" tabindex="-1" class="calendar-cell-text">3</div>
                                                <div aria-hidden="true" booking-count="0" class="calendar-cell-gauge" style="height: 0px;"></div>
                                              </div>
                                            </td>
                                            <td class="dx-calendar-cell" data-value="2023/09/04" role="option" aria-label="Monday, September 4, 2023">
                                              <div tabindex="-1" aria-hidden="true" class="calendar-cell-container">
                                                <div aria-hidden="true" tabindex="-1" class="calendar-cell-text">4</div>
                                                <div aria-hidden="true" booking-count="0" class="calendar-cell-gauge" style="height: 0px;"></div>
                                              </div>
                                            </td>
                                            <td class="dx-calendar-cell" data-value="2023/09/05" role="option" aria-label="Tuesday, September 5, 2023">
                                              <div tabindex="-1" aria-hidden="true" class="calendar-cell-container">
                                                <div aria-hidden="true" tabindex="-1" class="calendar-cell-text">5</div>
                                                <div aria-hidden="true" booking-count="0" class="calendar-cell-gauge" style="height: 0px;"></div>
                                              </div>
                                            </td>
                                            <td class="dx-calendar-cell" data-value="2023/09/06" role="option" aria-label="Wednesday, September 6, 2023">
                                              <div tabindex="-1" aria-hidden="true" class="calendar-cell-container">
                                                <div aria-hidden="true" tabindex="-1" class="calendar-cell-text">6</div>
                                                <div aria-hidden="true" booking-count="0" class="calendar-cell-gauge" style="height: 0px;"></div>
                                              </div>
                                            </td>
                                            <td class="dx-calendar-cell" data-value="2023/09/07" role="option" aria-label="Thursday, September 7, 2023">
                                              <div tabindex="-1" aria-hidden="true" class="calendar-cell-container">
                                                <div aria-hidden="true" tabindex="-1" class="calendar-cell-text">7</div>
                                                <div aria-hidden="true" booking-count="0" class="calendar-cell-gauge" style="height: 0px;"></div>
                                              </div>
                                            </td>
                                            <td class="dx-calendar-cell" data-value="2023/09/08" role="option" aria-label="Friday, September 8, 2023">
                                              <div tabindex="-1" aria-hidden="true" class="calendar-cell-container">
                                                <div aria-hidden="true" tabindex="-1" class="calendar-cell-text">8</div>
                                                <div aria-hidden="true" booking-count="0" class="calendar-cell-gauge" style="height: 0px;"></div>
                                              </div>
                                            </td>
                                            <td class="dx-calendar-cell" data-value="2023/09/09" role="option" aria-label="Saturday, September 9, 2023" style="background-color: rgb(242, 242, 234);">
                                              <div tabindex="-1" aria-hidden="true" class="calendar-cell-container calendar-cell-weekend">
                                                <div aria-hidden="true" tabindex="-1" class="calendar-cell-text">9</div>
                                                <div aria-hidden="true" booking-count="0" class="calendar-cell-gauge" style="height: 0px;"></div>
                                              </div>
                                            </td>
                                          </tr>
                                          <tr>
                                            <td class="dx-calendar-cell" data-value="2023/09/10" role="option" aria-label="Sunday, September 10, 2023" style="background-color: rgb(242, 242, 234);">
                                              <div tabindex="-1" aria-hidden="true" class="calendar-cell-container calendar-cell-weekend">
                                                <div aria-hidden="true" tabindex="-1" class="calendar-cell-text">10</div>
                                                <div aria-hidden="true" booking-count="0" class="calendar-cell-gauge" style="height: 0px;"></div>
                                              </div>
                                            </td>
                                            <td class="dx-calendar-cell" data-value="2023/09/11" role="option" aria-label="Monday, September 11, 2023">
                                              <div tabindex="-1" aria-hidden="true" class="calendar-cell-container">
                                                <div aria-hidden="true" tabindex="-1" class="calendar-cell-text">11</div>
                                                <div aria-hidden="true" booking-count="0" class="calendar-cell-gauge" style="height: 0px;"></div>
                                              </div>
                                            </td>
                                            <td class="dx-calendar-cell" data-value="2023/09/12" role="option" aria-label="Tuesday, September 12, 2023">
                                              <div tabindex="-1" aria-hidden="true" class="calendar-cell-container">
                                                <div aria-hidden="true" tabindex="-1" class="calendar-cell-text">12</div>
                                                <div aria-hidden="true" booking-count="0" class="calendar-cell-gauge" style="height: 0px;"></div>
                                              </div>
                                            </td>
                                            <td class="dx-calendar-cell" data-value="2023/09/13" role="option" aria-label="Wednesday, September 13, 2023">
                                              <div tabindex="-1" aria-hidden="true" class="calendar-cell-container">
                                                <div aria-hidden="true" tabindex="-1" class="calendar-cell-text">13</div>
                                                <div aria-hidden="true" booking-count="0" class="calendar-cell-gauge" style="height: 0px;"></div>
                                              </div>
                                            </td>
                                            <td class="dx-calendar-cell" data-value="2023/09/14" role="option" aria-label="Thursday, September 14, 2023">
                                              <div tabindex="-1" aria-hidden="true" class="calendar-cell-container">
                                                <div aria-hidden="true" tabindex="-1" class="calendar-cell-text">14</div>
                                                <div aria-hidden="true" booking-count="0" class="calendar-cell-gauge" style="height: 0px;"></div>
                                              </div>
                                            </td>
                                            <td class="dx-calendar-cell" data-value="2023/09/15" role="option" aria-label="Friday, September 15, 2023">
                                              <div tabindex="-1" aria-hidden="true" class="calendar-cell-container">
                                                <div aria-hidden="true" tabindex="-1" class="calendar-cell-text">15</div>
                                                <div aria-hidden="true" booking-count="0" class="calendar-cell-gauge" style="height: 0px;"></div>
                                              </div>
                                            </td>
                                            <td class="dx-calendar-cell" data-value="2023/09/16" role="option" aria-label="Saturday, September 16, 2023" style="background-color: rgb(242, 242, 234);">
                                              <div tabindex="-1" aria-hidden="true" class="calendar-cell-container calendar-cell-weekend">
                                                <div aria-hidden="true" tabindex="-1" class="calendar-cell-text">16</div>
                                                <div aria-hidden="true" booking-count="0" class="calendar-cell-gauge" style="height: 0px;"></div>
                                              </div>
                                            </td>
                                          </tr>
                                          <tr>
                                            <td class="dx-calendar-cell" data-value="2023/09/17" role="option" aria-label="Sunday, September 17, 2023" style="background-color: rgb(242, 242, 234);">
                                              <div tabindex="-1" aria-hidden="true" class="calendar-cell-container calendar-cell-weekend">
                                                <div aria-hidden="true" tabindex="-1" class="calendar-cell-text">17</div>
                                                <div aria-hidden="true" booking-count="0" class="calendar-cell-gauge" style="height: 0px;"></div>
                                              </div>
                                            </td>
                                            <td class="dx-calendar-cell" data-value="2023/09/18" role="option" aria-label="Monday, September 18, 2023">
                                              <div tabindex="-1" aria-hidden="true" class="calendar-cell-container">
                                                <div aria-hidden="true" tabindex="-1" class="calendar-cell-text">18</div>
                                                <div aria-hidden="true" booking-count="0" class="calendar-cell-gauge" style="height: 0px;"></div>
                                              </div>
                                            </td>
                                            <td class="dx-calendar-cell" data-value="2023/09/19" role="option" aria-label="Tuesday, September 19, 2023">
                                              <div tabindex="-1" aria-hidden="true" class="calendar-cell-container">
                                                <div aria-hidden="true" tabindex="-1" class="calendar-cell-text">19</div>
                                                <div aria-hidden="true" booking-count="0" class="calendar-cell-gauge" style="height: 0px;"></div>
                                              </div>
                                            </td>
                                            <td class="dx-calendar-cell" data-value="2023/09/20" role="option" aria-label="Wednesday, September 20, 2023">
                                              <div tabindex="-1" aria-hidden="true" class="calendar-cell-container">
                                                <div aria-hidden="true" tabindex="-1" class="calendar-cell-text">20</div>
                                                <div aria-hidden="true" booking-count="0" class="calendar-cell-gauge" style="height: 0px;"></div>
                                              </div>
                                            </td>
                                            <td class="dx-calendar-cell" data-value="2023/09/21" role="option" aria-label="Thursday, September 21, 2023">
                                              <div tabindex="-1" aria-hidden="true" class="calendar-cell-container">
                                                <div aria-hidden="true" tabindex="-1" class="calendar-cell-text">21</div>
                                                <div aria-hidden="true" booking-count="0" class="calendar-cell-gauge" style="height: 0px;"></div>
                                              </div>
                                            </td>
                                            <td class="dx-calendar-cell" data-value="2023/09/22" role="option" aria-label="Friday, September 22, 2023">
                                              <div tabindex="-1" aria-hidden="true" class="calendar-cell-container">
                                                <div aria-hidden="true" tabindex="-1" class="calendar-cell-text">22</div>
                                                <div aria-hidden="true" booking-count="0" class="calendar-cell-gauge" style="height: 0px;"></div>
                                              </div>
                                            </td>
                                            <td class="dx-calendar-cell" data-value="2023/09/23" role="option" aria-label="Saturday, September 23, 2023" style="background-color: rgb(242, 242, 234);">
                                              <div tabindex="-1" aria-hidden="true" class="calendar-cell-container calendar-cell-weekend">
                                                <div aria-hidden="true" tabindex="-1" class="calendar-cell-text">23</div>
                                                <div aria-hidden="true" booking-count="0" class="calendar-cell-gauge" style="height: 0px;"></div>
                                              </div>
                                            </td>
                                          </tr>
                                          <tr>
                                            <td class="dx-calendar-cell" data-value="2023/09/24" role="option" aria-label="Sunday, September 24, 2023" style="background-color: rgb(242, 242, 234);">
                                              <div tabindex="-1" aria-hidden="true" class="calendar-cell-container calendar-cell-weekend">
                                                <div aria-hidden="true" tabindex="-1" class="calendar-cell-text">24</div>
                                                <div aria-hidden="true" booking-count="0" class="calendar-cell-gauge" style="height: 0px;"></div>
                                              </div>
                                            </td>
                                            <td class="dx-calendar-cell" data-value="2023/09/25" role="option" aria-label="Monday, September 25, 2023">
                                              <div tabindex="-1" aria-hidden="true" class="calendar-cell-container">
                                                <div aria-hidden="true" tabindex="-1" class="calendar-cell-text">25</div>
                                                <div aria-hidden="true" booking-count="0" class="calendar-cell-gauge" style="height: 0px;"></div>
                                              </div>
                                            </td>
                                            <td class="dx-calendar-cell" data-value="2023/09/26" role="option" aria-label="Tuesday, September 26, 2023">
                                              <div tabindex="-1" aria-hidden="true" class="calendar-cell-container">
                                                <div aria-hidden="true" tabindex="-1" class="calendar-cell-text">26</div>
                                                <div aria-hidden="true" booking-count="0" class="calendar-cell-gauge" style="height: 0px;"></div>
                                              </div>
                                            </td>
                                            <td class="dx-calendar-cell" data-value="2023/09/27" role="option" aria-label="Wednesday, September 27, 2023">
                                              <div tabindex="-1" aria-hidden="true" class="calendar-cell-container">
                                                <div aria-hidden="true" tabindex="-1" class="calendar-cell-text">27</div>
                                                <div aria-hidden="true" booking-count="0" class="calendar-cell-gauge" style="height: 0px;"></div>
                                              </div>
                                            </td>
                                            <td class="dx-calendar-cell" data-value="2023/09/28" role="option" aria-label="Thursday, September 28, 2023">
                                              <div tabindex="-1" aria-hidden="true" class="calendar-cell-container">
                                                <div aria-hidden="true" tabindex="-1" class="calendar-cell-text">28</div>
                                                <div aria-hidden="true" booking-count="0" class="calendar-cell-gauge" style="height: 0px;"></div>
                                              </div>
                                            </td>
                                            <td class="dx-calendar-cell" data-value="2023/09/29" role="option" aria-label="Friday, September 29, 2023">
                                              <div tabindex="-1" aria-hidden="true" class="calendar-cell-container">
                                                <div aria-hidden="true" tabindex="-1" class="calendar-cell-text">29</div>
                                                <div aria-hidden="true" booking-count="0" class="calendar-cell-gauge" style="height: 0px;"></div>
                                              </div>
                                            </td>
                                            <td class="dx-calendar-cell" data-value="2023/09/30" role="option" aria-label="Saturday, September 30, 2023" style="background-color: rgb(242, 242, 234);">
                                              <div tabindex="-1" aria-hidden="true" class="calendar-cell-container calendar-cell-weekend">
                                                <div aria-hidden="true" tabindex="-1" class="calendar-cell-text">30</div>
                                                <div aria-hidden="true" booking-count="0" class="calendar-cell-gauge" style="height: 0px;"></div>
                                              </div>
                                            </td>
                                          </tr>
                                          <tr>
                                            <td class="dx-calendar-cell dx-calendar-other-view dx-calendar-other-month" data-value="2023/10/01" role="option" aria-label="Sunday, October 1, 2023" style="background-color: rgb(242, 242, 234);">
                                              <div tabindex="-1" aria-hidden="true" class="calendar-cell-container calendar-cell-weekend">
                                                <div aria-hidden="true" tabindex="-1" class="calendar-cell-text">1</div>
                                                <div aria-hidden="true" booking-count="0" class="calendar-cell-gauge" style="height: 0px;"></div>
                                              </div>
                                            </td>
                                            <td class="dx-calendar-cell dx-calendar-other-view dx-calendar-other-month" data-value="2023/10/02" role="option" aria-label="Monday, October 2, 2023">
                                              <div tabindex="-1" aria-hidden="true" class="calendar-cell-container">
                                                <div aria-hidden="true" tabindex="-1" class="calendar-cell-text">2</div>
                                                <div aria-hidden="true" booking-count="0" class="calendar-cell-gauge" style="height: 0px;"></div>
                                              </div>
                                            </td>
                                            <td class="dx-calendar-cell dx-calendar-other-view dx-calendar-other-month" data-value="2023/10/03" role="option" aria-label="Tuesday, October 3, 2023">
                                              <div tabindex="-1" aria-hidden="true" class="calendar-cell-container">
                                                <div aria-hidden="true" tabindex="-1" class="calendar-cell-text">3</div>
                                                <div aria-hidden="true" booking-count="0" class="calendar-cell-gauge" style="height: 0px;"></div>
                                              </div>
                                            </td>
                                            <td class="dx-calendar-cell dx-calendar-other-view dx-calendar-other-month" data-value="2023/10/04" role="option" aria-label="Wednesday, October 4, 2023">
                                              <div tabindex="-1" aria-hidden="true" class="calendar-cell-container">
                                                <div aria-hidden="true" tabindex="-1" class="calendar-cell-text">4</div>
                                                <div aria-hidden="true" booking-count="0" class="calendar-cell-gauge" style="height: 0px;"></div>
                                              </div>
                                            </td>
                                            <td class="dx-calendar-cell dx-calendar-other-view dx-calendar-other-month" data-value="2023/10/05" role="option" aria-label="Thursday, October 5, 2023">
                                              <div tabindex="-1" aria-hidden="true" class="calendar-cell-container">
                                                <div aria-hidden="true" tabindex="-1" class="calendar-cell-text">5</div>
                                                <div aria-hidden="true" booking-count="0" class="calendar-cell-gauge" style="height: 0px;"></div>
                                              </div>
                                            </td>
                                            <td class="dx-calendar-cell dx-calendar-other-view dx-calendar-other-month" data-value="2023/10/06" role="option" aria-label="Friday, October 6, 2023">
                                              <div tabindex="-1" aria-hidden="true" class="calendar-cell-container">
                                                <div aria-hidden="true" tabindex="-1" class="calendar-cell-text">6</div>
                                                <div aria-hidden="true" booking-count="0" class="calendar-cell-gauge" style="height: 0px;"></div>
                                              </div>
                                            </td>
                                            <td class="dx-calendar-cell dx-calendar-other-view dx-calendar-other-month" data-value="2023/10/07" role="option" aria-label="Saturday, October 7, 2023" style="background-color: rgb(242, 242, 234);">
                                              <div tabindex="-1" aria-hidden="true" class="calendar-cell-container calendar-cell-weekend">
                                                <div aria-hidden="true" tabindex="-1" class="calendar-cell-text">7</div>
                                                <div aria-hidden="true" booking-count="0" class="calendar-cell-gauge" style="height: 0px;"></div>
                                              </div>
                                            </td>
                                          </tr>
                                        </tbody>
                                      </table>
                                    </div>
                                    <div class="dx-widget" style="transform: translate(100%, 0px);">
                                      <table>
                                        <thead>
                                          <tr>
                                            <th>Sun</th>
                                            <th>Mon</th>
                                            <th>Tue</th>
                                            <th>Wed</th>
                                            <th>Thu</th>
                                            <th>Fri</th>
                                            <th>Sat</th>
                                          </tr>
                                        </thead>
                                        <tbody>
                                          <tr>
                                            <td class="dx-calendar-cell dx-calendar-other-view dx-calendar-other-month" data-value="2023/10/29" role="option" aria-label="Sunday, October 29, 2023" style="background-color: rgb(242, 242, 234);">
                                              <div tabindex="-1" aria-hidden="true" class="calendar-cell-container calendar-cell-weekend">
                                                <div aria-hidden="true" tabindex="-1" class="calendar-cell-text">29</div>
                                                <div aria-hidden="true" booking-count="0" class="calendar-cell-gauge" style="height: 0px;"></div>
                                              </div>
                                            </td>
                                            <td class="dx-calendar-cell dx-calendar-other-view dx-calendar-other-month" data-value="2023/10/30" role="option" aria-label="Monday, October 30, 2023">
                                              <div tabindex="-1" aria-hidden="true" class="calendar-cell-container">
                                                <div aria-hidden="true" tabindex="-1" class="calendar-cell-text">30</div>
                                                <div aria-hidden="true" booking-count="0" class="calendar-cell-gauge" style="height: 0px;"></div>
                                              </div>
                                            </td>
                                            <td class="dx-calendar-cell dx-calendar-other-view dx-calendar-other-month" data-value="2023/10/31" role="option" aria-label="Tuesday, October 31, 2023">
                                              <div tabindex="-1" aria-hidden="true" class="calendar-cell-container">
                                                <div aria-hidden="true" tabindex="-1" class="calendar-cell-text">31</div>
                                                <div aria-hidden="true" booking-count="0" class="calendar-cell-gauge" style="height: 0px;"></div>
                                              </div>
                                            </td>
                                            <td class="dx-calendar-cell" data-value="2023/11/01" role="option" aria-label="Wednesday, November 1, 2023">
                                              <div tabindex="-1" aria-hidden="true" class="calendar-cell-container">
                                                <div aria-hidden="true" tabindex="-1" class="calendar-cell-text">1</div>
                                                <div aria-hidden="true" booking-count="0" class="calendar-cell-gauge" style="height: 0px;"></div>
                                              </div>
                                            </td>
                                            <td class="dx-calendar-cell" data-value="2023/11/02" role="option" aria-label="Thursday, November 2, 2023">
                                              <div tabindex="-1" aria-hidden="true" class="calendar-cell-container">
                                                <div aria-hidden="true" tabindex="-1" class="calendar-cell-text">2</div>
                                                <div aria-hidden="true" booking-count="0" class="calendar-cell-gauge" style="height: 0px;"></div>
                                              </div>
                                            </td>
                                            <td class="dx-calendar-cell" data-value="2023/11/03" role="option" aria-label="Friday, November 3, 2023">
                                              <div tabindex="-1" aria-hidden="true" class="calendar-cell-container">
                                                <div aria-hidden="true" tabindex="-1" class="calendar-cell-text">3</div>
                                                <div aria-hidden="true" booking-count="0" class="calendar-cell-gauge" style="height: 0px;"></div>
                                              </div>
                                            </td>
                                            <td class="dx-calendar-cell" data-value="2023/11/04" role="option" aria-label="Saturday, November 4, 2023" style="background-color: rgb(242, 242, 234);">
                                              <div tabindex="-1" aria-hidden="true" class="calendar-cell-container calendar-cell-weekend">
                                                <div aria-hidden="true" tabindex="-1" class="calendar-cell-text">4</div>
                                                <div aria-hidden="true" booking-count="0" class="calendar-cell-gauge" style="height: 0px;"></div>
                                              </div>
                                            </td>
                                          </tr>
                                          <tr>
                                            <td class="dx-calendar-cell" data-value="2023/11/05" role="option" aria-label="Sunday, November 5, 2023" style="background-color: rgb(242, 242, 234);">
                                              <div tabindex="-1" aria-hidden="true" class="calendar-cell-container calendar-cell-weekend">
                                                <div aria-hidden="true" tabindex="-1" class="calendar-cell-text">5</div>
                                                <div aria-hidden="true" booking-count="0" class="calendar-cell-gauge" style="height: 0px;"></div>
                                              </div>
                                            </td>
                                            <td class="dx-calendar-cell" data-value="2023/11/06" role="option" aria-label="Monday, November 6, 2023">
                                              <div tabindex="-1" aria-hidden="true" class="calendar-cell-container">
                                                <div aria-hidden="true" tabindex="-1" class="calendar-cell-text">6</div>
                                                <div aria-hidden="true" booking-count="0" class="calendar-cell-gauge" style="height: 0px;"></div>
                                              </div>
                                            </td>
                                            <td class="dx-calendar-cell" data-value="2023/11/07" role="option" aria-label="Tuesday, November 7, 2023">
                                              <div tabindex="-1" aria-hidden="true" class="calendar-cell-container">
                                                <div aria-hidden="true" tabindex="-1" class="calendar-cell-text">7</div>
                                                <div aria-hidden="true" booking-count="0" class="calendar-cell-gauge" style="height: 0px;"></div>
                                              </div>
                                            </td>
                                            <td class="dx-calendar-cell" data-value="2023/11/08" role="option" aria-label="Wednesday, November 8, 2023">
                                              <div tabindex="-1" aria-hidden="true" class="calendar-cell-container">
                                                <div aria-hidden="true" tabindex="-1" class="calendar-cell-text">8</div>
                                                <div aria-hidden="true" booking-count="0" class="calendar-cell-gauge" style="height: 0px;"></div>
                                              </div>
                                            </td>
                                            <td class="dx-calendar-cell" data-value="2023/11/09" role="option" aria-label="Thursday, November 9, 2023">
                                              <div tabindex="-1" aria-hidden="true" class="calendar-cell-container">
                                                <div aria-hidden="true" tabindex="-1" class="calendar-cell-text">9</div>
                                                <div aria-hidden="true" booking-count="0" class="calendar-cell-gauge" style="height: 0px;"></div>
                                              </div>
                                            </td>
                                            <td class="dx-calendar-cell" data-value="2023/11/10" role="option" aria-label="Friday, November 10, 2023">
                                              <div tabindex="-1" aria-hidden="true" class="calendar-cell-container">
                                                <div aria-hidden="true" tabindex="-1" class="calendar-cell-text">10</div>
                                                <div aria-hidden="true" booking-count="0" class="calendar-cell-gauge" style="height: 0px;"></div>
                                              </div>
                                            </td>
                                            <td class="dx-calendar-cell" data-value="2023/11/11" role="option" aria-label="Saturday, November 11, 2023" style="background-color: rgb(242, 242, 234);">
                                              <div tabindex="-1" aria-hidden="true" class="calendar-cell-container calendar-cell-weekend">
                                                <div aria-hidden="true" tabindex="-1" class="calendar-cell-text">11</div>
                                                <div aria-hidden="true" booking-count="0" class="calendar-cell-gauge" style="height: 0px;"></div>
                                              </div>
                                            </td>
                                          </tr>
                                          <tr>
                                            <td class="dx-calendar-cell" data-value="2023/11/12" role="option" aria-label="Sunday, November 12, 2023" style="background-color: rgb(242, 242, 234);">
                                              <div tabindex="-1" aria-hidden="true" class="calendar-cell-container calendar-cell-weekend">
                                                <div aria-hidden="true" tabindex="-1" class="calendar-cell-text">12</div>
                                                <div aria-hidden="true" booking-count="0" class="calendar-cell-gauge" style="height: 0px;"></div>
                                              </div>
                                            </td>
                                            <td class="dx-calendar-cell" data-value="2023/11/13" role="option" aria-label="Monday, November 13, 2023">
                                              <div tabindex="-1" aria-hidden="true" class="calendar-cell-container">
                                                <div aria-hidden="true" tabindex="-1" class="calendar-cell-text">13</div>
                                                <div aria-hidden="true" booking-count="0" class="calendar-cell-gauge" style="height: 0px;"></div>
                                              </div>
                                            </td>
                                            <td class="dx-calendar-cell" data-value="2023/11/14" role="option" aria-label="Tuesday, November 14, 2023">
                                              <div tabindex="-1" aria-hidden="true" class="calendar-cell-container">
                                                <div aria-hidden="true" tabindex="-1" class="calendar-cell-text">14</div>
                                                <div aria-hidden="true" booking-count="0" class="calendar-cell-gauge" style="height: 0px;"></div>
                                              </div>
                                            </td>
                                            <td class="dx-calendar-cell" data-value="2023/11/15" role="option" aria-label="Wednesday, November 15, 2023">
                                              <div tabindex="-1" aria-hidden="true" class="calendar-cell-container">
                                                <div aria-hidden="true" tabindex="-1" class="calendar-cell-text">15</div>
                                                <div aria-hidden="true" booking-count="0" class="calendar-cell-gauge" style="height: 0px;"></div>
                                              </div>
                                            </td>
                                            <td class="dx-calendar-cell" data-value="2023/11/16" role="option" aria-label="Thursday, November 16, 2023">
                                              <div tabindex="-1" aria-hidden="true" class="calendar-cell-container">
                                                <div aria-hidden="true" tabindex="-1" class="calendar-cell-text">16</div>
                                                <div aria-hidden="true" booking-count="0" class="calendar-cell-gauge" style="height: 0px;"></div>
                                              </div>
                                            </td>
                                            <td class="dx-calendar-cell" data-value="2023/11/17" role="option" aria-label="Friday, November 17, 2023">
                                              <div tabindex="-1" aria-hidden="true" class="calendar-cell-container">
                                                <div aria-hidden="true" tabindex="-1" class="calendar-cell-text">17</div>
                                                <div aria-hidden="true" booking-count="0" class="calendar-cell-gauge" style="height: 0px;"></div>
                                              </div>
                                            </td>
                                            <td class="dx-calendar-cell" data-value="2023/11/18" role="option" aria-label="Saturday, November 18, 2023" style="background-color: rgb(242, 242, 234);">
                                              <div tabindex="-1" aria-hidden="true" class="calendar-cell-container calendar-cell-weekend">
                                                <div aria-hidden="true" tabindex="-1" class="calendar-cell-text">18</div>
                                                <div aria-hidden="true" booking-count="0" class="calendar-cell-gauge" style="height: 0px;"></div>
                                              </div>
                                            </td>
                                          </tr>
                                          <tr>
                                            <td class="dx-calendar-cell" data-value="2023/11/19" role="option" aria-label="Sunday, November 19, 2023" style="background-color: rgb(242, 242, 234);">
                                              <div tabindex="-1" aria-hidden="true" class="calendar-cell-container calendar-cell-weekend">
                                                <div aria-hidden="true" tabindex="-1" class="calendar-cell-text">19</div>
                                                <div aria-hidden="true" booking-count="0" class="calendar-cell-gauge" style="height: 0px;"></div>
                                              </div>
                                            </td>
                                            <td class="dx-calendar-cell" data-value="2023/11/20" role="option" aria-label="Monday, November 20, 2023">
                                              <div tabindex="-1" aria-hidden="true" class="calendar-cell-container">
                                                <div aria-hidden="true" tabindex="-1" class="calendar-cell-text">20</div>
                                                <div aria-hidden="true" booking-count="0" class="calendar-cell-gauge" style="height: 0px;"></div>
                                              </div>
                                            </td>
                                            <td class="dx-calendar-cell" data-value="2023/11/21" role="option" aria-label="Tuesday, November 21, 2023">
                                              <div tabindex="-1" aria-hidden="true" class="calendar-cell-container">
                                                <div aria-hidden="true" tabindex="-1" class="calendar-cell-text">21</div>
                                                <div aria-hidden="true" booking-count="0" class="calendar-cell-gauge" style="height: 0px;"></div>
                                              </div>
                                            </td>
                                            <td class="dx-calendar-cell" data-value="2023/11/22" role="option" aria-label="Wednesday, November 22, 2023">
                                              <div tabindex="-1" aria-hidden="true" class="calendar-cell-container">
                                                <div aria-hidden="true" tabindex="-1" class="calendar-cell-text">22</div>
                                                <div aria-hidden="true" booking-count="0" class="calendar-cell-gauge" style="height: 0px;"></div>
                                              </div>
                                            </td>
                                            <td class="dx-calendar-cell" data-value="2023/11/23" role="option" aria-label="Thursday, November 23, 2023">
                                              <div tabindex="-1" aria-hidden="true" class="calendar-cell-container">
                                                <div aria-hidden="true" tabindex="-1" class="calendar-cell-text">23</div>
                                                <div aria-hidden="true" booking-count="0" class="calendar-cell-gauge" style="height: 0px;"></div>
                                              </div>
                                            </td>
                                            <td class="dx-calendar-cell" data-value="2023/11/24" role="option" aria-label="Friday, November 24, 2023">
                                              <div tabindex="-1" aria-hidden="true" class="calendar-cell-container">
                                                <div aria-hidden="true" tabindex="-1" class="calendar-cell-text">24</div>
                                                <div aria-hidden="true" booking-count="0" class="calendar-cell-gauge" style="height: 0px;"></div>
                                              </div>
                                            </td>
                                            <td class="dx-calendar-cell" data-value="2023/11/25" role="option" aria-label="Saturday, November 25, 2023" style="background-color: rgb(242, 242, 234);">
                                              <div tabindex="-1" aria-hidden="true" class="calendar-cell-container calendar-cell-weekend">
                                                <div aria-hidden="true" tabindex="-1" class="calendar-cell-text">25</div>
                                                <div aria-hidden="true" booking-count="0" class="calendar-cell-gauge" style="height: 0px;"></div>
                                              </div>
                                            </td>
                                          </tr>
                                          <tr>
                                            <td class="dx-calendar-cell" data-value="2023/11/26" role="option" aria-label="Sunday, November 26, 2023" style="background-color: rgb(242, 242, 234);">
                                              <div tabindex="-1" aria-hidden="true" class="calendar-cell-container calendar-cell-weekend">
                                                <div aria-hidden="true" tabindex="-1" class="calendar-cell-text">26</div>
                                                <div aria-hidden="true" booking-count="0" class="calendar-cell-gauge" style="height: 0px;"></div>
                                              </div>
                                            </td>
                                            <td class="dx-calendar-cell" data-value="2023/11/27" role="option" aria-label="Monday, November 27, 2023">
                                              <div tabindex="-1" aria-hidden="true" class="calendar-cell-container">
                                                <div aria-hidden="true" tabindex="-1" class="calendar-cell-text">27</div>
                                                <div aria-hidden="true" booking-count="0" class="calendar-cell-gauge" style="height: 0px;"></div>
                                              </div>
                                            </td>
                                            <td class="dx-calendar-cell" data-value="2023/11/28" role="option" aria-label="Tuesday, November 28, 2023">
                                              <div tabindex="-1" aria-hidden="true" class="calendar-cell-container">
                                                <div aria-hidden="true" tabindex="-1" class="calendar-cell-text">28</div>
                                                <div aria-hidden="true" booking-count="0" class="calendar-cell-gauge" style="height: 0px;"></div>
                                              </div>
                                            </td>
                                            <td class="dx-calendar-cell" data-value="2023/11/29" role="option" aria-label="Wednesday, November 29, 2023">
                                              <div tabindex="-1" aria-hidden="true" class="calendar-cell-container">
                                                <div aria-hidden="true" tabindex="-1" class="calendar-cell-text">29</div>
                                                <div aria-hidden="true" booking-count="0" class="calendar-cell-gauge" style="height: 0px;"></div>
                                              </div>
                                            </td>
                                            <td class="dx-calendar-cell" data-value="2023/11/30" role="option" aria-label="Thursday, November 30, 2023">
                                              <div tabindex="-1" aria-hidden="true" class="calendar-cell-container">
                                                <div aria-hidden="true" tabindex="-1" class="calendar-cell-text">30</div>
                                                <div aria-hidden="true" booking-count="0" class="calendar-cell-gauge" style="height: 0px;"></div>
                                              </div>
                                            </td>
                                            <td class="dx-calendar-cell dx-calendar-other-view dx-calendar-other-month" data-value="2023/12/01" role="option" aria-label="Friday, December 1, 2023">
                                              <div tabindex="-1" aria-hidden="true" class="calendar-cell-container">
                                                <div aria-hidden="true" tabindex="-1" class="calendar-cell-text">1</div>
                                                <div aria-hidden="true" booking-count="0" class="calendar-cell-gauge" style="height: 0px;"></div>
                                              </div>
                                            </td>
                                            <td class="dx-calendar-cell dx-calendar-other-view dx-calendar-other-month" data-value="2023/12/02" role="option" aria-label="Saturday, December 2, 2023" style="background-color: rgb(242, 242, 234);">
                                              <div tabindex="-1" aria-hidden="true" class="calendar-cell-container calendar-cell-weekend">
                                                <div aria-hidden="true" tabindex="-1" class="calendar-cell-text">2</div>
                                                <div aria-hidden="true" booking-count="0" class="calendar-cell-gauge" style="height: 0px;"></div>
                                              </div>
                                            </td>
                                          </tr>
                                          <tr>
                                            <td class="dx-calendar-cell dx-calendar-other-view dx-calendar-other-month" data-value="2023/12/03" role="option" aria-label="Sunday, December 3, 2023" style="background-color: rgb(242, 242, 234);">
                                              <div tabindex="-1" aria-hidden="true" class="calendar-cell-container calendar-cell-weekend">
                                                <div aria-hidden="true" tabindex="-1" class="calendar-cell-text">3</div>
                                                <div aria-hidden="true" booking-count="0" class="calendar-cell-gauge" style="height: 0px;"></div>
                                              </div>
                                            </td>
                                            <td class="dx-calendar-cell dx-calendar-other-view dx-calendar-other-month" data-value="2023/12/04" role="option" aria-label="Monday, December 4, 2023">
                                              <div tabindex="-1" aria-hidden="true" class="calendar-cell-container">
                                                <div aria-hidden="true" tabindex="-1" class="calendar-cell-text">4</div>
                                                <div aria-hidden="true" booking-count="0" class="calendar-cell-gauge" style="height: 0px;"></div>
                                              </div>
                                            </td>
                                            <td class="dx-calendar-cell dx-calendar-other-view dx-calendar-other-month" data-value="2023/12/05" role="option" aria-label="Tuesday, December 5, 2023">
                                              <div tabindex="-1" aria-hidden="true" class="calendar-cell-container">
                                                <div aria-hidden="true" tabindex="-1" class="calendar-cell-text">5</div>
                                                <div aria-hidden="true" booking-count="0" class="calendar-cell-gauge" style="height: 0px;"></div>
                                              </div>
                                            </td>
                                            <td class="dx-calendar-cell dx-calendar-other-view dx-calendar-other-month" data-value="2023/12/06" role="option" aria-label="Wednesday, December 6, 2023">
                                              <div tabindex="-1" aria-hidden="true" class="calendar-cell-container">
                                                <div aria-hidden="true" tabindex="-1" class="calendar-cell-text">6</div>
                                                <div aria-hidden="true" booking-count="0" class="calendar-cell-gauge" style="height: 0px;"></div>
                                              </div>
                                            </td>
                                            <td class="dx-calendar-cell dx-calendar-other-view dx-calendar-other-month" data-value="2023/12/07" role="option" aria-label="Thursday, December 7, 2023">
                                              <div tabindex="-1" aria-hidden="true" class="calendar-cell-container">
                                                <div aria-hidden="true" tabindex="-1" class="calendar-cell-text">7</div>
                                                <div aria-hidden="true" booking-count="0" class="calendar-cell-gauge" style="height: 0px;"></div>
                                              </div>
                                            </td>
                                            <td class="dx-calendar-cell dx-calendar-other-view dx-calendar-other-month" data-value="2023/12/08" role="option" aria-label="Friday, December 8, 2023">
                                              <div tabindex="-1" aria-hidden="true" class="calendar-cell-container">
                                                <div aria-hidden="true" tabindex="-1" class="calendar-cell-text">8</div>
                                                <div aria-hidden="true" booking-count="0" class="calendar-cell-gauge" style="height: 0px;"></div>
                                              </div>
                                            </td>
                                            <td class="dx-calendar-cell dx-calendar-other-view dx-calendar-other-month" data-value="2023/12/09" role="option" aria-label="Saturday, December 9, 2023" style="background-color: rgb(242, 242, 234);">
                                              <div tabindex="-1" aria-hidden="true" class="calendar-cell-container calendar-cell-weekend">
                                                <div aria-hidden="true" tabindex="-1" class="calendar-cell-text">9</div>
                                                <div aria-hidden="true" booking-count="0" class="calendar-cell-gauge" style="height: 0px;"></div>
                                              </div>
                                            </td>
                                          </tr>
                                        </tbody>
                                      </table>
                                    </div>
                                  </div>
                                </div>
                                <div class="dx-widget dx-calendar-navigator">
                                  <a class="dx-button dx-button-normal dx-button-mode-contained dx-widget dx-button-has-icon dx-calendar-navigator-previous-view dx-calendar-navigator-previous-month" role="button" aria-label="chevronleft"><div class="dx-button-content"><i class="dx-icon dx-icon-chevronleft"></i></div></a><a class="dx-calendar-caption-button dx-button dx-button-normal dx-button-mode-contained dx-widget dx-button-has-text" role="button" aria-label="October 2023"><div class="dx-button-content"><span class="dx-button-text">October 2023</span></div></a><a class="dx-button dx-button-normal dx-button-mode-contained dx-widget dx-button-has-icon dx-calendar-navigator-next-view dx-calendar-navigator-next-month" role="button" aria-label="chevronright"><div class="dx-button-content"><i class="dx-icon dx-icon-chevronright"></i></div></a>
                                </div>
                              </div>
                            </div>
                          </div>
                        </div>
                        <div role="tabpanel" class="tab-pane fade" id="my-bookings-search">
                          <!-- Simple search -->
                          <div class="form-inline simple-search">
                            <div class="form-group">
                              <label class="hide-element" for="booking-search-box">Search for bookings by name or location.</label>
                              <input type="text" class="form-control" tabindex="-1" id="booking-search-box" maxlength="255">
                            </div>
                            <button type="button" tabindex="-1" class="btn btn-default" id="booking-search-button" data-bind="click: $root.searchForBookings">Search</button>
                            <span id="booking-search-count" tabindex="0" class="result-count" style="display: none;" data-bind="text: searchRecordCountLabel">0 Results.</span>
                            <!-- ko if: searchRecordCount() == 20 && !DevExpress.devices.real().phone --><!-- /ko -->
                          </div>
                          <div class="simple-search-results">
                            <p class="inline-instructions" tabindex="0" id="booking-search-instructions">Search for bookings by name or location.</p>
                            <div id="booking-no-results" tabindex="0" class="col-md-offset-4" style="display: none;">
                              <h3 id="booking-no-results-head">Nothing was found for "".</h3>
                              <ul>
                                <li>Start with a simple search; use less text.</li>
                                <li>Remember, only booking title and location are searchable.</li>
                              </ul>
                            </div>
                            <div id="booking-search-results" class="booking-grid daily col-xs-12" style="display: none;" data-bind="component: { name: 'booking-search-component', params: $root }">
                              <div class="row" id="booking-search-header">
                                <div id="booking-search-header-title" class="col-md-4 col-sm-12 col-xs-12" data-bind="click: $root.sortSearchResults, event:{keypress:function(data,event){handleKeypress(event) }}" tabindex="0"> Title </div>
                                <div id="booking-search-header-location" class="col-md-3 hidden-xs hidden-sm" data-bind="click: $root.sortSearchResults, event:{keypress:function(data,event){handleKeypress(event) }}" tabindex="0" "="">
        Location
    </div>
    <div id=" booking-search-header-date" class="col-md-4 hidden-xs hidden-sm" data-bind="click: $root.sortSearchResults, event:{keypress:function(data,event){handleKeypress(event) }}" tabindex="0" "="">
        Date &amp; Time
        <i id=" booking-search-sort-indicator" class="fa fa-angle-up"></i>
                                </div>
                              </div>
                              <div data-bind="template: { foreach: searchResults, as: 'ev' }"></div>
                            </div>
                          </div>
                        </div>
                      </div>
                      <div data-bind="component: {name: &quot;cancel-reason-dialog&quot;, params: $root}">
                        <!-- ko if: activeBooking() --><!-- /ko -->
                      </div>
                    </div>
                  </div>
                  <!-- Infographics -->
                  <div id="my-infographics" class="hidden-xs" style="">
                    <h2 tabindex="0" id="my-infographics-header" onkeydown="handleRecurenceKeyPress(null, null, true, 'showMyBookingsHeaderNavigation')">My Infographics</h2>
                    <div class="row">
                      <div class="col-xs-12 col-md-4">
                        <div class="ig-container">
                          <div class="date-time-header" tabindex="0" aria-label="Today">Today</div>
                          <div class="ig-subhead" tabindex="0" aria-labelledby="aria-day-id">
                            <div id="aria-day-id"><span id="day-chart-count">0</span> bookings</div>
                          </div>
                          <div id="ig-today" class="booking-chart-container dx-visibility-change-handler"><svg xmlns="http://www.w3.org/2000/svg" version="1.1" fill="none" stroke="none" stroke-width="0" class="dxc dxc-chart"
                              style="line-height:normal;-ms-user-select:none;-moz-user-select:none;-webkit-user-select:none;-webkit-tap-highlight-color:rgba(0, 0, 0, 0);display:block;overflow:hidden;" width="400" height="250" direction="ltr">
                              <defs>
                                <filter id="DevExpress_1" x="-50%" y="-50%" width="200%" height="200%" transform="translate(0,0)">
                                  <feGaussianBlur in="SourceGraphic" result="gaussianBlurResult" stdDeviation="3"></feGaussianBlur>
                                  <feOffset in="gaussianBlurResult" result="offsetResult" dx="2" dy="6"></feOffset>
                                  <feFlood result="floodResult" flood-color="" flood-opacity="0.8"></feFlood>
                                  <feComposite in="floodResult" in2="offsetResult" operator="in" result="compositeResult"></feComposite>
                                  <feComposite in="SourceGraphic" in2="compositeResult" operator="over"></feComposite>
                                </filter>
                                <clipPath id="DevExpress_3">
                                  <rect x="0" y="0" width="400" height="250" transform="translate(0,0)"></rect>
                                </clipPath>
                              </defs>
                              <rect x="0" y="0" width="400" height="250" transform="translate(0,0)" fill="gray" opacity="0.0001"></rect>
                              <g class="dxc-background"></g>
                              <g class="dxc-series-group">
                                <g class="dxc-series">
                                  <g class="dxc-markers"></g>
                                </g>
                              </g>
                              <g class="dxc-labels-group">
                                <g class="dxc-labels" opacity="0.001" transform="translate(0,0)"></g>
                              </g>
                              <g class="dxc-legend" clip-path="url(#DevExpress_3)"></g>
                            </svg></div>
                        </div>
                      </div>
                      <div class="col-xs-12 col-md-4">
                        <div class="ig-container">
                          <div class="date-time-header" tabindex="0" aria-label="This Week">This Week</div>
                          <div class="ig-subhead" tabindex="0" aria-labelledby="aria-week-id">
                            <div id="aria-week-id"><span id="week-chart-count">0</span> bookings</div>
                          </div>
                          <div id="ig-week" class="booking-chart-container dx-visibility-change-handler"><svg xmlns="http://www.w3.org/2000/svg" version="1.1" fill="none" stroke="none" stroke-width="0" class="dxc dxc-chart"
                              style="line-height:normal;-ms-user-select:none;-moz-user-select:none;-webkit-user-select:none;-webkit-tap-highlight-color:rgba(0, 0, 0, 0);display:block;overflow:hidden;" width="400" height="250" direction="ltr">
                              <defs>
                                <filter id="DevExpress_5" x="-50%" y="-50%" width="200%" height="200%" transform="translate(0,0)">
                                  <feGaussianBlur in="SourceGraphic" result="gaussianBlurResult" stdDeviation="3"></feGaussianBlur>
                                  <feOffset in="gaussianBlurResult" result="offsetResult" dx="2" dy="6"></feOffset>
                                  <feFlood result="floodResult" flood-color="" flood-opacity="0.8"></feFlood>
                                  <feComposite in="floodResult" in2="offsetResult" operator="in" result="compositeResult"></feComposite>
                                  <feComposite in="SourceGraphic" in2="compositeResult" operator="over"></feComposite>
                                </filter>
                                <clipPath id="DevExpress_7">
                                  <rect x="0" y="0" width="400" height="250" transform="translate(0,0)"></rect>
                                </clipPath>
                              </defs>
                              <rect x="0" y="0" width="400" height="250" transform="translate(0,0)" fill="gray" opacity="0.0001"></rect>
                              <g class="dxc-background"></g>
                              <g class="dxc-series-group">
                                <g class="dxc-series">
                                  <g class="dxc-markers"></g>
                                </g>
                              </g>
                              <g class="dxc-labels-group">
                                <g class="dxc-labels" opacity="0.001" transform="translate(0,0)"></g>
                              </g>
                              <g class="dxc-legend" clip-path="url(#DevExpress_7)"></g>
                            </svg></div>
                        </div>
                      </div>
                      <div class="col-xs-12 col-md-4">
                        <div class="ig-container">
                          <div class="date-time-header" tabindex="0" aria-label="This Month">This Month</div>
                          <div class="ig-subhead" tabindex="0" aria-labelledby="aria-month-id">
                            <div id="aria-month-id"><span id="month-chart-count">0</span> bookings</div>
                          </div>
                          <div id="ig-month" class="booking-chart-container dx-visibility-change-handler"><svg xmlns="http://www.w3.org/2000/svg" version="1.1" fill="none" stroke="none" stroke-width="0" class="dxc dxc-chart"
                              style="line-height:normal;-ms-user-select:none;-moz-user-select:none;-webkit-user-select:none;-webkit-tap-highlight-color:rgba(0, 0, 0, 0);display:block;overflow:hidden;" width="400" height="250" direction="ltr">
                              <defs>
                                <filter id="DevExpress_9" x="-50%" y="-50%" width="200%" height="200%" transform="translate(0,0)">
                                  <feGaussianBlur in="SourceGraphic" result="gaussianBlurResult" stdDeviation="3"></feGaussianBlur>
                                  <feOffset in="gaussianBlurResult" result="offsetResult" dx="2" dy="6"></feOffset>
                                  <feFlood result="floodResult" flood-color="" flood-opacity="0.8"></feFlood>
                                  <feComposite in="floodResult" in2="offsetResult" operator="in" result="compositeResult"></feComposite>
                                  <feComposite in="SourceGraphic" in2="compositeResult" operator="over"></feComposite>
                                </filter>
                                <clipPath id="DevExpress_11">
                                  <rect x="0" y="0" width="400" height="250" transform="translate(0,0)"></rect>
                                </clipPath>
                              </defs>
                              <rect x="0" y="0" width="400" height="250" transform="translate(0,0)" fill="gray" opacity="0.0001"></rect>
                              <g class="dxc-background"></g>
                              <g class="dxc-series-group">
                                <g class="dxc-series">
                                  <g class="dxc-markers"></g>
                                </g>
                              </g>
                              <g class="dxc-labels-group">
                                <g class="dxc-labels" opacity="0.001" transform="translate(0,0)"></g>
                              </g>
                              <g class="dxc-legend" clip-path="url(#DevExpress_11)"></g>
                            </svg></div>
                        </div>
                      </div>
                    </div>
                  </div>
                </div>
              </div>
            </div>
          </div>
          <!-- about template modal -->
          <div class="modal fade" id="template-modal" tabindex="-1" role="dialog" aria-labelledby="template-modal-aria-title">
            <div class="modal-dialog" role="document">
              <div class="modal-content" id="template-modal-content" data-bind="component: { name: 'web-template-modal-component', params: $root }"></div>
            </div>
          </div>
          <!-- endnow modal -->
          <div class="modal fade" id="endnow-modal" tabindex="-1" role="dialog">
            <div class="modal-dialog" role="document" onkeydown="modelFocusTrap(event)">
              <div class="modal-content" id="endnow-modal-content">
                <div class="modal-header">
                  <button id="close-endnow-button" type="button" class="close" data-dismiss="modal" close-mark="" aria-label="Close"><span aria-hidden="true">×</span></button>
                  <h3 tabindex="0" class="modal-title" id="default-aspx-endnow-modal-title">Are you sure you want to end this booking now?</h3>
                </div>
                <div class="modal-body">
                  <p class="date"></p>
                  <p tabindex="0" class="event-name"></p>
                  <p tabindex="0" class="location"></p>
                </div>
                <div class="modal-footer">
                  <button type="button" class="btn btn-default" id="endBookingBtn">Yes, End Booking</button>
                  <button id="no-endnow-button" type="button" class="btn btn-primary" btn-cancel="" data-dismiss="modal">No, Don't End</button>
                </div>
              </div>
            </div>
          </div>
          <!-- booking details modal -->
          <div id="booking-details-comp" data-bind="component: { name: &quot;booking-details-component&quot;, params: { ScreenText: {
        TimeText: &quot;Time&quot;,
        DateText: &quot;Date&quot;,
        EventNameText: &quot;Event Name&quot;,
        LocationText: &quot;Location&quot;,
        GroupNameText: &quot;Group Name&quot;,
        NoBookingsMessage: &quot;No bookings exist for this event.&quot;,
        BookingDetailsText: &quot;Booking Details&quot;,
        EventDetailsText: &quot;Event Details&quot;,
        RelatedEventsText: &quot;Related Events&quot;,
        DownloadIcsText: &quot;Add to My Calendar&quot;,
        ShareText: &quot;Share&quot;,
        CloseText: &quot;Close&quot;,
        EditText: &quot;edit&quot;,
        FirstBookingText: &quot;First Booking&quot;,
        LastBookingText: &quot;Last Booking&quot;,
        CheckedInText: &quot;Checked In&quot;,
        CheckInText: &quot;Check In&quot;,
        CancelText: &quot;Cancel&quot;,
        EndNowText: &quot;End Now&quot;,
        EndNowConfirmText: &quot;Are you sure you want to end this booking now?&quot;,
        YesEndBookingText: &quot;Yes, End Booking&quot;,
        NoDontEndText: &quot;No, Don't End&quot;,
        CancelBookingQuestionText: &quot;Cancel Booking?&quot;,
        CancelReasonText: &quot;Cancel Reason&quot;,
        CancelNotesText: &quot;Cancel Notes&quot;,
        YesCancelText: &quot;Yes, Cancel Booking&quot;,
        NoCancelText: &quot;No, Keep Booking&quot;} } }">
            <div class="modal fade" id="booking-details-modal" tabindex="-1" role="dialog" aria-labelledby="booking-details-booking-details-modal-title">
              <div class="modal-dialog" role="document" id="booking-modal">
                <div class="modal-content">
                  <div class="modal-header">
                    <button type="button" id="closeModal" class="close" data-dismiss="modal" aria-label="Close" data-bind="click: function () { vems.bookingDetailsVM.hide(); }"><span aria-hidden="true">×</span></button>
                    <h3 tabindex="0" class="modal-title" id="booking-details-booking-details-modal-title" data-bind="text: ScreenText.BookingDetailsText">Booking Details</h3>
                  </div>
                  <div class="modal-body">
                    <ul id="booking-details-tabs" class="nav nav-tabs" role="tablist">
                      <li role="presentation" class="active">
                        <a aria-expanded="true" href="#detailsContainer" aria-controls="detailsContainer" role="tab" data-toggle="tab" data-bind="text: ScreenText.EventDetailsText,attr:{'aria-label':ScreenText.EventDetailsText}" aria-label="Event Details">Event Details</a>
                      </li>
                      <!-- ko if: !vems.bookingDetailsVM.IsMobile() -->
                      <li role="presentation">
                        <a aria-expanded="false" href="#relatedEventsContainer" aria-controls="relatedEventsContainer" role="tab" data-toggle="tab" data-bind="text: ScreenText.RelatedEventsText">Related Events</a>
                      </li>
                      <!-- /ko -->
                      <a id="VEMSBookingDetails" class="fa fa-question-circle help-text-icon" data-helptextkey="VEMSBookingDetails" aria-label="Click to open help about the booking details section" data-parenttype="None" data-parentid="0" style="display: none;" href="#"></a>
                    </ul>
                    <div class="tab-content">
                      <div tabindex="-1" id="detailsContainer" role="tabpanel" class="tab-pane fade in active">
                        <div class="modal-loading-overlay">
                          <img class="loading-animation" src="Images/Loading.gif" alt="Loading...">
                        </div>
                        <table class="table table-striped">
                          <tbody data-bind="foreach: $data.details()"></tbody>
                        </table>
                      </div>
                      <!-- ko if: !vems.bookingDetailsVM.IsMobile() -->
                      <div id="relatedEventsContainer" role="tabpanel" tabindex="-1" class="tab-pane fade">
                        <div id="booking-details-grid-container" tabindex="-1" class="table-responsive">
                          <table id="booking-details-grid" tabindex="-1" class="table table-striped table-sort">
                            <thead>
                              <tr>
                                <!-- ko if: vems.bookingDetailsVM.ShowICS() --><!-- /ko -->
                                <th data-bind="event:{'keypress':function(i,e){preventScroll(e)}}">
                                  <div id="related-Events-Container-Date" data-bind="text: ScreenText.DateText">Date</div>
                                </th>
                                <th data-bind="event:{'keypress':function(i,e){preventScroll(e)}}">
                                  <div id="related-Events-Container-Time" data-bind="text: ScreenText.TimeText">Time</div>
                                </th>
                                <!-- ko if: !vems.bookingDetailsVM.SuppressEventName() -->
                                <th data-bind="event:{'keypress':function(i,e){preventScroll(e)}}">
                                  <div id="related-Events-Container-EventName" data-bind="text: ScreenText.EventNameText">Event Name</div>
                                </th>
                                <!-- /ko -->
                                <!-- ko if: vems.bookingDetailsVM.ShowLocation() --><!-- /ko -->
                                <!-- ko if: vems.bookingDetailsVM.ShowGroupName() --><!-- /ko -->
                              </tr>
                            </thead>
                            <tbody>
                              <!-- ko foreach:vems.bookingDetailsVM.Bookings --><!-- /ko -->
                            </tbody>
                          </table>
                        </div>
                      </div>
                      <!-- /ko -->
                    </div>
                  </div>
                  <div class="modal-footer">
                    <!-- ko if: IsMobile() && (IsCheckedIn() || ShowCheckinButton() || AllowCancel() || AllowEndNow()) --><!-- /ko -->
                    <!-- ko if: ShowICS() && !IsMobile() --><!-- /ko -->
                    <div id="add-this-container" tabindex="0" class="pull-left"></div>
                    <!-- ko if: ConferenceURL().length > 0 && ConferencingSolution() --><!-- /ko -->
                    <button id="close-btn" aria-label="Close" tabindex="0" type="button" class="btn btn-primary" data-dismiss="modal" data-bind="text: ScreenText.CloseText, click: function () { vems.bookingDetailsVM.hide(); }">Close</button>
                  </div>
                </div>
              </div>
              <!-- endnow modal -->
              <div class="modal fade" id="endnow-modal-bd" tabindex="-1" role="dialog" aria-labelledby="booking-details-aspx-endnow-modal-title">
                <div class="modal-dialog" role="document">
                  <div class="modal-content" id="endnow-modal-content-bd">
                    <div class="modal-header">
                      <button tabindex="0" id="close-endnow-button" type="button" class="close" data-bind="click: closeEndNowModal" aria-label="Close"><span aria-hidden="true">×</span></button>
                      <h3 class="modal-title" id="booking-details-aspx-endnow-modal-title" data-bind="text: ScreenText.EndNowConfirmText">Are you sure you want to end this booking now?</h3>
                    </div>
                    <div class="modal-body">
                      <p class="date"></p>
                      <p class="event-name"></p>
                      <p class="location"></p>
                    </div>
                    <div class="modal-footer">
                      <button type="button" class="btn btn-default" id="endBookingBtn-bd" data-bind="text: ScreenText.YesEndBookingText">Yes, End Booking</button>
                      <button id="no-endnow-button" type="button" class="btn btn-primary" data-bind="text: ScreenText.NoDontEndText, click: closeEndNowModal">No, Don't End</button>
                    </div>
                  </div>
                </div>
              </div>
              <!-- cancel modal -->
              <div class="modal fade" id="cancel-modal-bd" tabindex="-1" role="dialog" aria-labelledby="booking-details-template-aspx-cancel-modal-title">
                <div class="modal-dialog" role="document">
                  <div class="modal-content" id="cancel-modal-content-bd">
                    <div class="modal-header">
                      <button type="button" class="close" aria-label="Close" data-bind="click: closeCancelModal"><span aria-hidden="true">×</span></button>
                      <h3 class="modal-title" id="booking-details-template-aspx-cancel-modal-title" data-bind="text: ScreenText.CancelBookingQuestionText">Cancel Booking?</h3>
                    </div>
                    <div class="modal-body">
                      <p class="date"></p>
                      <p class="event-name"></p>
                      <p class="location"></p>
                      <div class="vc-host-warning" style="display: none;">
                        <img class="vc-host-warning-icon" src="Images/diamond-alert.png" alt="Warning">
                        <span class="vc-host-warning-message">This booking is set as the VC host.<br>Cancelling this booking will also cancel all other locations on this date.</span>
                      </div>
                      <div class="cal-occ-warning" style="display: none;">
                        <img class="cal-occ-warning-icon" src="Images/diamond-alert.png" alt="Warning">
                        <span class="cal-occ-warning-message">This booking is part of a Calendar Occurrence.<br>Cancelling this location will cancel all locations with same date/time.<br>To cancel a single location, Edit the booking.</span>
                      </div>
                      <div class="reason dropdown form-group">
                        <label class="control-label" for="bd-cancel-reason" data-bind="text: ScreenText.CancelReasonText">Cancel Reason</label>
                        <select id="bd-cancel-reason" class="form-control required" data-bind="fastForEach: { data: CancelReasons }"></select>
                      </div>
                      <div class="notes form-group">
                        <label class="control-label" for="bd-cancel-notes" data-bind="text: ScreenText.CancelNotesText">Cancel Notes</label>
                        <textarea id="bd-cancel-notes" class="form-control" rows="3"></textarea>
                      </div>
                    </div>
                    <div class="modal-footer">
                      <button type="button" class="btn btn-default" id="cancel-btn-yes-bd" data-bind="text: ScreenText.YesCancelText">Yes, Cancel Booking</button>
                      <button type="button" class="btn btn-primary" id="cancel-btn-no-bd" data-bind="text: ScreenText.NoCancelText, click: closeCancelModal">No, Keep Booking</button>
                    </div>
                  </div>
                </div>
              </div>
            </div>
          </div>
          <!-- location details modal -->
          <div id="location-details-comp" data-bind="component: { name: &quot;location-details-component&quot;, params: { } }">
            <div class="modal fade" id="location-details-modal" tabindex="-1" role="dialog" aria-labelledby="location-details-template-aspx-locations-details-modal-title">
              <div class="modal-dialog" role="document" onkeydown="modelFocusTrap(event)">
                <div class="modal-content">
                  <div class="modal-header">
                    <button type="button" class="close" close-mark="" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">×</span></button>
                    <h3 tabindex="0" class="modal-title" id="location-details-template-aspx-locations-details-modal-title"><span>about</span> <span data-bind="text: vems.decodeHtml(roomDescription())"></span></h3>
                  </div>
                  <div class="modal-body">
                    <ul id="location-details-tabs" class="nav nav-tabs" role="tablist">
                      <li role="presentation" class="active location-details-tab" style="max-width: 25%;">
                        <a href="#mainContainer" aria-controls="mainContainer" role="tab" data-toggle="tab" data-bind="event:{keypress:function(data,event){handleKeypress(event) }}">Room Details</a>
                      </li>
                      <li role="presentation" class="location-details-tab" style="max-width: 20%;">
                        <a href="#setupContainer" aria-controls="setupContainer" role="tab" data-toggle="tab" data-bind="visible: setupDetails().length > 0, event:{keypress:function(data,event){handleKeypress(event) }}" style="display: none;">Setup Types</a>
                      </li>
                      <li role="presentation" class="location-details-tab" style="max-width: 20%;">
                        <a href="#featuresContainer" aria-controls="featuresContainer" role="tab" data-toggle="tab" data-bind="visible: features().length > 0, event:{keypress:function(data,event){handleKeypress(event) }}" style="display: none;">Features</a>
                      </li>
                      <li role="presentation" class="location-details-tab" style="max-width: 15%;">
                        <a href="#imagesContainer" aria-controls="imagesContainer" role="tab" data-toggle="tab" data-bind="visible: images().length > 0,  event:{keypress:function(data,event){handleKeypress(event) }}" style="display: none;">Images</a>
                      </li>
                      <li role="presentation" data-bind="visible: vems.hasBrowseForSpace === 1,event:{keypress:function(data,event){handleKeypress(event) }}" class="location-details-tab" style="max-width: 20%; display: none;">
                        <a href="#availabilityContainer" aria-controls="availabilityContainer" role="tab" data-toggle="tab" id="availability-tab">Availability</a>
                      </li>
                    </ul>
                    <div class="tab-content">
                      <div id="mainContainer" role="tabpanel" class="tab-pane active">
                        <table class="table table-striped">
                          <thead class="sr-only">
                            <tr>
                              <th>Description</th>
                              <th>Value</th>
                            </tr>
                          </thead>
                          <tbody data-bind="foreach: details"></tbody>
                        </table>
                      </div>
                      <div id="setupContainer" role="tabpanel" class="tab-pane">
                        <table class="table table-striped">
                          <thead class="sr-only">
                            <tr>
                              <th tabindex="0" aria-label="Setup Type">Setup Type</th>
                              <th tabindex="0" aria-label="Minimum Capacity">Min Capacity</th>
                              <th tabindex="0" aria-label="Maximum Capacity">Max Capacity</th>
                            </tr>
                          </thead>
                          <tbody data-bind="foreach: setupDetails"></tbody>
                        </table>
                      </div>
                      <div id="featuresContainer" role="tabpanel" class="tab-pane">
                        <table class="table table-striped">
                          <thead class="sr-only">
                            <tr>
                              <th>Description</th>
                            </tr>
                          </thead>
                          <tbody data-bind="foreach: features"></tbody>
                        </table>
                      </div>
                      <div id="imagesContainer" role="tabpanel" class="tab-pane">
                        <div class="row" data-bind="foreach: images"></div>
                      </div>
                      <div id="availabilityContainer" role="tabpanel" class="tab-pane" style="overflow-y: hidden;">
                        <div class="row" style="margin-bottom: 30px;">
                          <div class="col-sm-8 col-xs-12">
                            <div class="col-sm-3 col-xs-3">
                              <button class="btn btn-main" type="button" id="available-previous" data-bind="click: changeAvailableDate,attr:{'aria-label':moment(availableStartDate()).add(-1, 'day').format('ddd,LL')}"
                                aria-label="Sa.,21. Oktober 2023">
                                <i class="fa fa-chevron-left"></i>
                                <span aria-hidden="true" data-bind="text: moment(availableStartDate()).add(-1, 'day').format('ddd'),attr:{'aria-label':moment(availableStartDate()).add(-1, 'day').format('ddd,LL')}"
                                  aria-label="Sa.,21. Oktober 2023">Sa.</span>
                              </button>
                            </div>
                            <div class="col-sm-7 col-xs-6" id="available-presentDate" tabindex="0">
                              <span aria-hidden="true" style="font-size: 1.3em; display: block; text-align: center;" data-bind="text: moment(availableStartDate()).format('ddd, LL')">So., 22. Oktober 2023</span>
                            </div>
                            <div class="col-sm-2 col-xs-2">
                              <button class="btn btn-main" type="button" id="available-next" data-bind="click: changeAvailableDate,attr:{'aria-label':moment(availableStartDate()).add(1, 'day').format('ddd,LL')}" aria-label="Mo.,23. Oktober 2023">
                                <span aria-hidden="true" data-bind="text: moment(availableStartDate()).add(1, 'day').format('ddd'),attr:{'aria-label':moment(availableStartDate()).add(1, 'day').format('ddd,LL')}"
                                  aria-label="Mo.,23. Oktober 2023">Mo.</span>
                                <i class="fa fa-chevron-right"></i>
                              </button>
                            </div>
                          </div>
                          <div class="col-sm-4 hidden-xs">
                            <span tabindex="0" class="float-right" style="margin-right: 15px; font-size: 1.3em;" data-bind="text: timeZoneTitle(),attr:{'aria-label':timeZoneTitle()}" aria-label=""></span>
                          </div>
                        </div>
                        <div>
                          <div id="room-availability-control"></div>
                        </div>
                      </div>
                    </div>
                  </div>
                  <div class="modal-footer">
                    <button type="button" class="btn btn-default" id="location-details-view-all-btn" data-bind="click: viewAllDetailsClicked, visible: !hideViewAllDetails()">View All Building &amp; Room Details</button>
                    <button type="button" btn-cancel="" class="btn btn-primary" id="location-details-close-btn" data-dismiss="modal">Close</button>
                  </div>
                </div>
              </div>
            </div>
            <!-- building/room image modal -->
            <div class="modal fade" id="bldg-room-image-modal" tabindex="-1" role="dialog">
              <div class="modal-dialog" role="document">
                <div class="modal-content">
                  <div class="modal-body">
                    <img id="bldg-room-image-img" src="" alt="" title="">
                    <a href="#" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true"><i class="fa fa-close"></i></span></a>
                  </div>
                </div>
              </div>
            </div>
          </div>
          <!-- floor plan modal -->
          <div id="floorplan-component-modal" data-bind="component: { name: &quot;floorplans-reserve-modal&quot;, params: { 
    RoomInfo: new FloorMapRoomInfo(),
    renderType: &quot;modal&quot;,
    ScreenText: {
        RequestText: &quot;Request    &quot;,
        ReserveText: &quot;Reserve    &quot;,
        RoomDetailsText: &quot;Room Details&quot;,
        RoomCodeText: &quot;Room Code&quot;,
        RoomDescriptionText: &quot;Description    &quot;,
        RoomTypeText: &quot;Room Type&quot;,
        AvailabilityText: &quot;Availability    &quot;,
        AvailableText: &quot;Available    &quot;,
        UnavailableText: &quot;Unavailable    &quot;,
        StartTimeText: &quot;Start Time    &quot;,
        EndTimeText: &quot;End Time    &quot;,
        TitleText: &quot;Title    &quot;,
        GroupNameText: &quot;Group&quot;
} } }">
            <div class="modal fade floormap-modal" id="floormap-modal" tabindex="-1" role="dialog" aria-labelledby="floor-plans-reserve-modal-aspx-foormap-modal-title" aria-hidden="true">
              <div class="modal-dialog" role="document" onkeydown="modelFocusTrap(event)">
                <div class="modal-content" style="width: 810px;">
                  <div class="modal-header">
                    <button type="button" class="close" data-dismiss="modal" close-mark="" aria-label="Close"><span aria-hidden="true">×</span></button>
                    <h3 class="modal-title" id="floor-plans-reserve-modal-aspx-foormap-modal-title"> Floor Map </h3>
                  </div>
                  <div class="modal-body">
                    <div id="mobile-modal-map" data-bind="visible: isPhone()" style="height: 375px; max-width: 380px; display: none;"></div>
                    <div id="modal-map" data-bind="visible: !isPhone()" style="height: 600px; width: 100%"></div>
                  </div>
                  <div class="modal-footer">
                    <button type="button" class="btn btn-default" btn-cancel="" data-dismiss="modal" data-target="#floormap-modal">Close</button>
                  </div>
                </div>
              </div>
            </div>
          </div>
          <script type="text/html" id="my-reservation-templates-template">
            <!-- ko if: (DevExpress.devices.real().phone && IsMobile) || IsWebApp -->
          <div class="row" data-bind="attr: {'data-mobile': IsMobile, 'data-webapp': IsWebApp }">
            <div data-count="1" class="col-xs-6 ellipsis-text">
              <span data-bind="text: vems.decodeHtml(Text)"></span>
            </div>
            <div class="col-xs-6 table-buttons">
              <button type="button" class="btn btn-primary btn-xs" data-bind="event: { click: $root.templateClick }, attr: { 'aria-label': vems.screenText.BookNowWithTheXTemplate.replace('{0}', vems.decodeHtml(Text)) }">book now</button>
              <button type="button" class="btn btn-primary btn-xs" data-bind="attr: { 'data-navigateurl': NavigateUrl, 'data-templateid': Id, 'aria-label': vems.screenText.AboutTheXTemplate.replace('{0}', vems.decodeHtml(Text)) }" data-toggle="modal"
                data-target="#template-modal">about</button>
            </div>
          </div>
          <!-- /ko -->
          </script>
          <script type="text/html" id="my-bookings-template">
            <div class="row">
              <div data-bind="attr: { id: 'EventStart' + ev.Id}" first-focus-element class="col-md-2 col-sm-2 col-xs-7 ellipsis-text grid-lesspad-right" tabindex="0">
                <div class="row">
                  <div class="col-sm-12 col-xs-12">
                    <span data-bind="text: moment(ev.UserEventStart).format('LT') + ' - ' + moment(ev.UserEventEnd).format('LT')"></span>
                  </div>
                  <div class="hidden-sm hidden-md hidden-lg col-sm-12 col-xs-12 ellipsis-text">
                    <a href="#" data-bind="text: vems.decodeHtml(ev.EventName), click: function () { vems.bookingDetailsVM.show(Id, 0); }"></a>
                  </div>
                </div>
              </div>
              <div tabindex="0" onkeydown="javascript:if(event.keyCode === 13 || event.which === 13 || event.keyCode === 32 || event.which === 32){ $(this).children('a').trigger('click');}"
                class="col-md-3 col-sm-3 hidden-xs ellipsis-text grid-lesspad" data-bind="attr:{'aria-label': ev.EventName + 'Link'}">
                <a aria-hidden="true" tabindex="-1" href="#" data-bind="text: vems.decodeHtml(ev.EventName), click: function () { vems.bookingDetailsVM.show(Id, 0); }, attr: {title: vems.decodeHtml(ev.EventName),id: 'eventName' + ev.Id}"></a>
              </div>
              <div class="col-md-2 col-sm-2 col-xs-5 grid-lesspad" style="white-space: normal; word-break: break-word;">
                <div class="row">
                  <!-- ko if: ShowFloorMap && (ImageId > 0) -->
                  <a class="col-md-3 col-sm-3 col-xs-2" href="#" data-bind="click: vems.home.viewModels.myBookings.showMap" aria-label="Floor Map">
	                <i class="icon-ems-floorplan"></i>
	            </a>
                  <!-- /ko -->
                  <div tabindex="0" onkeydown="javascript:if(event.keyCode === 13 || event.which === 13 || event.keyCode === 32 || event.which === 32){ $(this).children('#anLocation').trigger('click');}" class="col-md-6 col-sm-6 col-xs-10"
                    data-bind="attr:{'aria-label': ev.Location + 'Link'}">
                    <a href="#" id="anLocation" tabindex="-1" aria-hidden="true" data-bind="text: vems.decodeHtml(ev.Location), click: function(data){ vems.locationDetailsVM.show(data.BuildingId, data.RoomId); }, attr:{'title': vems.decodeHtml(ev.Location)}"></a>
                  </div>
                </div>
              </div>
              <div class="col-md-1 col-sm-2 hidden-xs ellipsis-text grid-lesspad" data-bind="attr:{'aria-label': ev.EventName + ev.Location + ev.Status }" tabindex="0">
                <span aria-hidden="true" data-bind="text: vems.decodeHtml(ev.Status), attr:{'title': vems.decodeHtml(ev.Status)}"></span>
              </div>
              <div class="col-md-4 col-sm-3 hidden-xs table-buttons grid-lesspad-left">
                <!-- ko if: ev.ConferencingSolution === 'skype' && ev.IsSkypeEnabled -->
                <a class="btn btn-primary btn-xs" data-toggle="modal" data-bind="attr: { id: 'joinskype' + ev.Id, href: ev.ConferenceURL, target: '_blank','aria-label' : 'JoinSkype for the booking of' +  ev.EventName +' '+ ev.Location}, text: 'Join Skype' , event:{keypress:function(data,event){handleKeypress(event) }}"></a>
                <!-- /ko -->
                <!-- ko if: ev.ConferencingSolution === 'msteams' && ev.IsTeamsEnabled -->
                <a class="btn btn-primary btn-xs" data-toggle="modal" data-bind="attr: { id: 'joinskype' + ev.Id, href: ev.ConferenceURL, target: '_blank', 'aria-label' : 'JoinTeams for the booking of ' + ev.EventName +' '+ ev.Location }, text: 'Join Teams', event:{keypress:function(data,event){handleKeypress(event) }}"></a>
                <!-- /ko -->
                <!-- ko if: ev.ConferencingSolution === 'zoom' && ev.IsZoomEnabled -->
                <a class="btn btn-primary btn-xs" data-toggle="modal" data-bind="attr: { id: 'joinskype' + ev.Id, href: ev.ConferenceURL, target: '_blank','aria-label' :'JoinZoom for the booking of' + ev.EventName +' '+ ev.Location }, text: 'Join Zoom', event:{keypress:function(data,event){handleKeypress(event) }}"></a>
                <!-- /ko -->
                <!-- ko if: ev.ConferencingSolution === 'webex' && ev.IsWebexEnabled -->
                <a class="btn btn-primary btn-xs" data-toggle="modal" data-bind="attr: { id: 'joinskype' + ev.Id, href: ev.ConferenceURL, target: '_blank','aria-label' :'JoinWebex for the booking of' + ev.EventName +' '+ ev.Location }, text: 'Join Webex', event:{keypress:function(data,event){handleKeypress(event) }}"></a>
                <!-- /ko -->
                <button type="button" class="btn btn-primary btn-xs disabled" disabled="disabled" data-toggle="modal" data-bind="visible: ev.IsCheckedIn, attr: {'aria-label':  'Checked In' + ev.EventName +' '+ ev.Location }"> Checked In </button>
                <button type="button" class="btn btn-primary btn-xs" data-toggle="modal"
                  data-bind="visible: ev.ShowCheckinButton, click: $root.checkInToEvent.bind(ev), attr: { id: 'checkin-' + ev.Id,'aria-label': 'Check in for the booking of  ' +  ev.EventName +' '+ ev.Location }"> Check In </button>
                <button type="button" class="btn btn-primary btn-xs" data-toggle="modal"
                  data-bind="visible: ev.AllowEndNow,click: $root.endBookingNow.bind(ev), attr: { id: 'endnow-' + ev.Id,'aria-label': 'End now the booking of' + ev.EventName +' '+ ev.Location }"> End Now </button>
                <!-- ko if: ev.AllowCancel -->
                <button type="button" class="btn btn-primary btn-xs" data-toggle="modal" data-bind="click: $root.cancelBooking.bind(ev), attr: { id: 'cancel-' + ev.Id,'aria-label': 'cancel the booking of ' + ev.EventName +' '+ ev.Location }"> Cancel
                </button>
                <!-- /ko -->
              </div>
            </div>
          </script>
          <div id="CallbackStatus" style="display: none; z-index: 100" class="callbackStatus">
            <img id="LoadingImage" src="Images/Loading.gif" alt="Loading...">
            <span id="LoadingText">Loading...</span>
          </div>
        </div>
      </div>
    </div>
  </div>
  <br>
  <br>
  <footer class="footer">
    <p class="invisible-screenreader-only" id="master-footer-mouseevent" aria-live="polite"></p>
    <div id="sidebar-wrapper-footer">
      <table>
        <tbody>
          <tr>
            <td class="footer-elements">
              <a tabindex="-1" id="footerimgid" class="ems-logo-link1" href="./">
                                 <img tabindex="0" src="Images/logo.png?v=221" class="ems-footer-logo" title="Logo Link to Home Page" onkeydown="onpressenter()">
                                </a>
              <label class="line">|</label>
              <span id="lbl_Master" class="label-footer">v223.2</span>
              <label class="recurrence-label-text1" for="end-date">© Copyright 2023 Accruent All Rights Reserved</label>
              <ul data-bind="foreach: mainMenuItems " class="footer-elements-recursive">
                <!-- ko if: Id != 4 && Id!=1 && Id!=50 && Id!=2147483647--><!-- /ko -->
                <!-- ko if: Id == 1 || Id==50 --><!-- /ko -->
                <!-- ko if: Id != 4 && Id!=1 && Id!=50 && Id!=2147483647-->
                <li class="footer-menu-list-item">
                  <a class="link-footer" data-bind="attr: {'href': NavigateUrl.length > 0 ? NavigateUrl : '#', 'title': vems.decodeHtml(Text)}, event:{click: $root.menuItemClicked,mouseover:function(d,e){$root.MouseOver(Text)},mouseout:function(d,e){$root.MouseOut(d)}}" href="/web/ClassicRequestForm.aspx?data=ity3Dem%2byxxGFZTQvNr975K4dCU8QwV7" title="Create A Request">
                                            <span class="linkcolor" data-bind="text: vems.decodeHtml(Text)">Create A Request</span>
                                            <br>
                                        </a>
                </li>
                <!-- /ko -->
                <!-- ko if: Id == 1 || Id==50 --><!-- /ko -->
                <!-- ko if: Id != 4 && Id!=1 && Id!=50 && Id!=2147483647--><!-- /ko -->
                <!-- ko if: Id == 1 || Id==50 --><!-- /ko -->
              </ul>
            </td>
          </tr>
        </tbody>
      </table>
    </div>
  </footer>
  <!-- end page-content-wrapper -->
  <!-- end wrapper -->
  <script type="text/javascript">
    //<![CDATA[
    var Page_ValidationSummaries = new Array(document.getElementById("Summary"));
    //]]>
  </script>
  <script type="text/javascript">
    //<![CDATA[
    var ApplicationTitle = document.all ? document.all["ApplicationTitle"] : document.getElementById("ApplicationTitle");
    ApplicationTitle.isHelpText = "False";
    var Summary = document.all ? document.all["Summary"] : document.getElementById("Summary");
    Summary.headertext = "These errors occurred while processing your request:";
    var DefaultHelp = document.all ? document.all["DefaultHelp"] : document.getElementById("DefaultHelp");
    DefaultHelp.isHelpText = "True";
    var pc_ApplicationTitle = document.all ? document.all["pc_ApplicationTitle"] : document.getElementById("pc_ApplicationTitle");
    pc_ApplicationTitle.isHelpText = "False";
    var pc_HomeHelp = document.all ? document.all["pc_HomeHelp"] : document.getElementById("pc_HomeHelp");
    pc_HomeHelp.isHelpText = "True";
    var pc_WebText1 = document.all ? document.all["pc_WebText1"] : document.getElementById("pc_WebText1");
    pc_WebText1.isHelpText = "True";
    //]]>
  </script>
  <script type="text/javascript">
    //<![CDATA[
    var callBackFrameUrl = '/web/WebResource.axd?d=beToSAE3vdsL1QUQUxjWdUL3JX0Q6g2QraccArRMrlSS_oRRHYkHYrAlpa37IDE1gFAlUVPoM4eTRMHQQSj6sw2&t=638240343755514788';
    WebForm_InitCallback(); //]]>
  </script>
</form>

Text Content

CLOSE

EMS MOBILE APP


OPEN






EVENT REQUEST SYSTEM


EVENT REQUEST SYSTEM

Skip to Main content
 *   
   * About
   * User Manual
     
     
   * 
     
   * Login Help
     
     
 * Welcome, Guest.
     
     
     
   * Sign In
     

   
   
   
   
   
 * Home
   
   
   
   
   
   
   
 * Create A Request
   
   
   
   

 * --------------------------------------------------------------------------------

   
   
   
 * Links
   BoilerLink Campus Map Hall of Music Parking Services Purdue Conferences
   Purdue Student Event Services Classroom Space Requests
   


EVENT REQUEST SYSTEM






EVENT REQUEST SYSTEM


 * Site Home
 * My Home
   


WELCOME TO THE EVENT AND SPACE REQUEST SYSTEM!

Purdue Sign In Guest Request

Help me decide


EVENT SPACE AND FOOD OPTIONS

= Reservable via this website


SPACE OPTIONS


RECWELL SPACES

 * Learn more
 * Contact


KRACH LEADERSHIP CENTER

 * Learn more
 * Contact


PURDUE MEMORIAL UNION

 * Learn more
 * Contact


STEWART CENTER

 * Learn more
 * Contact


UNION CLUB HOTEL

 * Learn more
 * Contact


INDOOR NON-ACADEMIC SPACES

 * Learn more
 * Contact


OUTDOOR SPACES

 * Learn more
 * Contact


UNION RACK & ROLL / BOILER GAME MINE

 * Learn more
 * Contact


FOOD OPTIONS


STUDENT EVENT SERVICES

 * Learn more
 * Contact


PURDUE FOOD COMPANY

 * Learn more
 * Contact


SIGN UP COMPLETE

Congratulations! You have successfully signed up to use EMS! Sign in below.


YOUR PASSWORD HAS BEEN RESET

Success, you can sign in below using your new password! A confirmation email
regarding the password reset has been sent to .

SIGN IN

Your session has expired, and you have been logged out.
Please log in again to continue.
User Id
Password Password


Sign In

WELCOME, GUEST.

Create An Account
Request A Room


MY RESERVATION TEMPLATES


YOU HAVE NO TEMPLATES CONFIGURED.




MY BOOKINGS

Show My Bookings
 * 22. Oktober 2023
 * Search
   

 * Day
 * Month
 * Date
   Date 

Previous Today Next


THERE ARE NO BOOKINGS FOR 22. OKTOBER 2023

TAKE ME TO THE NEXT DAY CONTAINING BOOKINGS.

SunMonTueWedThuFriSat
24

25

26

27

28

29

30

1

2

3

4

5

6

7

8

9

10

11

12

13

14

15

16

17

18

19

20

21

22

23

24

25

26

27

28

29

30

31

1

2

3

4


SunMonTueWedThuFriSat
27

28

29

30

31

1

2

3

4

5

6

7

8

9

10

11

12

13

14

15

16

17

18

19

20

21

22

23

24

25

26

27

28

29

30

1

2

3

4

5

6

7


SunMonTueWedThuFriSat
29

30

31

1

2

3

4

5

6

7

8

9

10

11

12

13

14

15

16

17

18

19

20

21

22

23

24

25

26

27

28

29

30

1

2

3

4

5

6

7

8

9


October 2023

Search for bookings by name or location.
Search 0 Results.

Search for bookings by name or location.


NOTHING WAS FOUND FOR "".

 * Start with a simple search; use less text.
 * Remember, only booking title and location are searchable.

Title
Location
Date & Time




MY INFOGRAPHICS

Today
0 bookings

This Week
0 bookings

This Month
0 bookings


×


ARE YOU SURE YOU WANT TO END THIS BOOKING NOW?



Yes, End Booking No, Don't End
×


BOOKING DETAILS

 * Event Details
   
 * Related Events
   
   

Date
Time
Event Name


Close
×


ARE YOU SURE YOU WANT TO END THIS BOOKING NOW?



Yes, End Booking No, Don't End
×


CANCEL BOOKING?

This booking is set as the VC host.
Cancelling this booking will also cancel all other locations on this date.
This booking is part of a Calendar Occurrence.
Cancelling this location will cancel all locations with same date/time.
To cancel a single location, Edit the booking.
Cancel Reason
Cancel Notes
Yes, Cancel Booking No, Keep Booking
×


ABOUT

 * Room Details
 * Setup Types
 * Features
 * Images
 * Availability

Description Value

Setup Type Min Capacity Max Capacity

Description


Sa.
So., 22. Oktober 2023
Mo.


View All Building & Room Details Close

×


FLOOR MAP


Close
Loading...



| v223.2 © Copyright 2023 Accruent All Rights Reserved
   
   
   
   
   
 * Create A Request
   
   
   
   
   
   
   
   

×


TERMS OF USE


Print Close
×


ACT AS

You are currently acting as . Switch back to .
You are currently signed in as .
Find by name

OK Cancel
×

CONFIRMATION


×


HELP

Language
Edit Web Text
OK Save Changes Cancel
×


BROWSER SUPPORT


We've noticed that you're using an older web browser. For the best experience,
upgrade to the latest version of one of the browsers listed on the system
requirements page.

Note: If you are using Internet Explorer, please also make sure that
Compatibility View is disabled.


Close
×


INCLUDE SKYPE


Help


WELCOME!

Be sure to log out once you are finished. If you are experiencing difficulty
using this site, please click here or select the Help icon for more information.








 


By clicking “Accept All Cookies”, you agree to the storing of cookies on your
device to enhance site navigation and analyze site usage.

Accept All Cookies
Cookies Settings



PRIVACY PREFERENCE CENTER

When you visit any website, it may store or retrieve information on your
browser, mostly in the form of cookies. This information might be about you,
your preferences or your device and is mostly used to make the site work as you
expect it to. The information does not usually directly identify you, but it can
give you a more personalized web experience. Because we respect your right to
privacy, you can choose not to allow some types of cookies. Click on the
different category headings to find out more and change our default settings.
However, blocking some types of cookies may impact your experience of the site
and the services we are able to offer.
More information
Allow All


MANAGE CONSENT PREFERENCES

STRICTLY NECESSARY COOKIES

Always Active

These cookies are necessary for the website to function and cannot be switched
off in our systems. They are usually only set in response to actions made by you
which amount to a request for services, such as setting your privacy
preferences, logging in or filling in forms. You can set your browser to block
or alert you about these cookies, but some parts of the site will not then work.
These cookies do not store any personally identifiable information.

Cookies Details‎

PERFORMANCE COOKIES

Performance Cookies

These cookies allow us to count visits and traffic sources so we can measure and
improve the performance of our site. They help us to know which pages are the
most and least popular and see how visitors move around the site. All
information these cookies collect is aggregated and therefore anonymous. If you
do not allow these cookies we will not know when you have visited our site, and
will not be able to monitor its performance.

Cookies Details‎

FUNCTIONAL COOKIES

Functional Cookies

These cookies enable the website to provide enhanced functionality and
personalisation. They may be set by us or by third party providers whose
services we have added to our pages. If you do not allow these cookies then some
or all of these services may not function properly.

Cookies Details‎

TARGETING COOKIES

Targeting Cookies

These cookies may be set through our site by our advertising partners. They may
be used by those companies to build a profile of your interests and show you
relevant adverts on other sites. They do not store directly personal
information, but are based on uniquely identifying your browser and internet
device. If you do not allow these cookies, you will experience less targeted
advertising.

Cookies Details‎
Back Button


PERFORMANCE COOKIES



Search Icon
Filter Icon

Clear
checkbox label label
Apply Cancel
Consent Leg.Interest
checkbox label label
checkbox label label
checkbox label label

 * 
   
   View Cookies
   
    * Name
      cookie name

Confirm My Choices

2