.elementor-15895 .elementor-element.elementor-element-227fdd2{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;}.elementor-widget-text-editor{color:var( --e-global-color-text );}.elementor-widget-text-editor.elementor-drop-cap-view-stacked .elementor-drop-cap{background-color:var( --e-global-color-primary );}.elementor-widget-text-editor.elementor-drop-cap-view-framed .elementor-drop-cap, .elementor-widget-text-editor.elementor-drop-cap-view-default .elementor-drop-cap{color:var( --e-global-color-primary );border-color:var( --e-global-color-primary );}/* Start custom CSS for container, class: .elementor-element-227fdd2 */!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <style>
    /* Navigation bar */
    nav {
      background: #003366;
      padding: 10px;
    }
    nav ul {
      list-style: none;
      margin: 0;
      padding: 0;
      display: flex;
    }
    nav ul li {
      position: relative;
      margin-right: 20px;
    }
    nav ul li a {
      color: white;
      text-decoration: none;
      font-weight: bold;
      padding: 8px 12px;
      display: block;
    }
    nav ul li:hover > a {
      background: #0055aa;
      border-radius: 6px;
    }

    /* Dropdown menu */
    .submenu {
      display: none;
      position: absolute;
      top: 40px;
      left: 0;
      background: #f9f9f9;
      border: 1px solid #ddd;
      min-width: 280px;
      z-index: 1000;
    }
    .submenu li {
      margin: 0;
    }
    .submenu a {
      color: #333;
      font-weight: normal;
      padding: 10px;
    }

    /* Hover descriptions */
    .submenu li span {
      display: none;
      font-size: 0.9em;
      color: #555;
      padding: 5px 10px;
      background: #f0f0f0;
      border-left: 3px solid #0055aa;
    }
    .submenu li:hover span {
      display: block;
    }

    nav ul li:hover .submenu {
      display: block;
    }
  </style>
</head>
<body>
  <nav>
    <ul>
      <li>
        <a href="#">Programs ▾</a>
        <ul class="submenu">
          <li>
            <a href="#">Community Education Program</a>
            <span>We provide Maya students with Chromebooks, literacy programs, and cultural workshops to improve learning and pride in heritage.</span>
          </li>
          <li>
            <a href="#">Heritage Awareness Workshops</a>
            <span>Workshops bring communities together to celebrate traditions and strengthen cultural identity.</span>
          </li>
          <li>
            <a href="#">Social Media Hangout</a>
            <span>Monthly online talks with scholars and communities to share knowledge about archaeology and Maya culture.</span>
          </li>
          <li>
            <a href="#">Journal of Maya Heritage</a>
            <span>An open-access publication highlighting research and cultural insights from the Maya world.</span>
          </li>
          <li>
            <a href="#">Bio-Expeditions</a>
            <span>Immersive cultural and ecological trips led by archaeologists, biologists, and local Maya guides.</span>
          </li>
          <li>
            <a href="#">Virtual Museum</a>
            <span>A 3D digital museum showcasing Maya sites like Chichén Itzá and Palenque for global audiences.</span>
          </li>
          <li>
            <a href="#">Student Exchange</a>
            <span>Programs connecting students from the U.S. and Mexico for cultural and academic learning.</span>
          </li>
          <li>
            <a href="#">Mesoamerican Polytechnic Institute</a>
            <span>A new institute training Maya youth in permaculture, sustainable farming, and technical trades.</span>
          </li>
        </ul>
      </li>
    </ul>
  </nav>
</body>
</html>/* End custom CSS */
/* Start custom CSS for page-settings */!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <style>
    /* Navigation bar */
    nav {
      background: #003366;
      padding: 10px;
    }
    nav ul {
      list-style: none;
      margin: 0;
      padding: 0;
      display: flex;
    }
    nav ul li {
      position: relative;
      margin-right: 20px;
    }
    nav ul li a {
      color: white;
      text-decoration: none;
      font-weight: bold;
      padding: 8px 12px;
      display: block;
    }
    nav ul li:hover > a {
      background: #0055aa;
      border-radius: 6px;
    }

    /* Dropdown menu */
    .submenu {
      display: none;
      position: absolute;
      top: 40px;
      left: 0;
      background: #f9f9f9;
      border: 1px solid #ddd;
      min-width: 280px;
      z-index: 1000;
    }
    .submenu li {
      margin: 0;
    }
    .submenu a {
      color: #333;
      font-weight: normal;
      padding: 10px;
    }

    /* Hover descriptions */
    .submenu li span {
      display: none;
      font-size: 0.9em;
      color: #555;
      padding: 5px 10px;
      background: #f0f0f0;
      border-left: 3px solid #0055aa;
    }
    .submenu li:hover span {
      display: block;
    }

    nav ul li:hover .submenu {
      display: block;
    }
  </style>
</head>
<body>
  <nav>
    <ul>
      <li>
        <a href="#">Programs ▾</a>
        <ul class="submenu">
          <li>
            <a href="#">Community Education Program</a>
            <span>We provide Maya students with Chromebooks, literacy programs, and cultural workshops to improve learning and pride in heritage.</span>
          </li>
          <li>
            <a href="#">Heritage Awareness Workshops</a>
            <span>Workshops bring communities together to celebrate traditions and strengthen cultural identity.</span>
          </li>
          <li>
            <a href="#">Social Media Hangout</a>
            <span>Monthly online talks with scholars and communities to share knowledge about archaeology and Maya culture.</span>
          </li>
          <li>
            <a href="#">Journal of Maya Heritage</a>
            <span>An open-access publication highlighting research and cultural insights from the Maya world.</span>
          </li>
          <li>
            <a href="#">Bio-Expeditions</a>
            <span>Immersive cultural and ecological trips led by archaeologists, biologists, and local Maya guides.</span>
          </li>
          <li>
            <a href="#">Virtual Museum</a>
            <span>A 3D digital museum showcasing Maya sites like Chichén Itzá and Palenque for global audiences.</span>
          </li>
          <li>
            <a href="#">Student Exchange</a>
            <span>Programs connecting students from the U.S. and Mexico for cultural and academic learning.</span>
          </li>
          <li>
            <a href="#">Mesoamerican Polytechnic Institute</a>
            <span>A new institute training Maya youth in permaculture, sustainable farming, and technical trades.</span>
          </li>
        </ul>
      </li>
    </ul>
  </nav>
</body>
</html>/* End custom CSS */