{"id":7,"date":"2025-05-01T05:46:59","date_gmt":"2025-05-01T05:46:59","guid":{"rendered":"https:\/\/ghanaplanetarium.com\/?page_id=7"},"modified":"2026-04-17T20:32:14","modified_gmt":"2026-04-17T20:32:14","slug":"home","status":"publish","type":"page","link":"https:\/\/ghanaplanetarium.com\/","title":{"rendered":"Home"},"content":{"rendered":"<p>[et_pb_section fb_built=&#8221;1&#8243; fullwidth=&#8221;on&#8221; _builder_version=&#8221;4.18.0&#8243; _module_preset=&#8221;default&#8221; global_colors_info=&#8221;{}&#8221;][et_pb_fullwidth_code _builder_version=&#8221;4.18.0&#8243; _module_preset=&#8221;default&#8221; hover_enabled=&#8221;0&#8243; global_colors_info=&#8221;{}&#8221; sticky_enabled=&#8221;0&#8243;]<div id=\"unimap\" class=\"opening hide-UI view-2D zoom-large data-close controls-close\" style=\"height: 100vh; background-color: #08090a;\">\n    <style>\n      #edu-panel {\n        --edu-text: rgba(255, 255, 255, 0.6);\n        --edu-text-strong: #fff;\n        --edu-text-title: rgba(255, 255, 255, 0.8);\n        --edu-text-muted: rgba(255, 255, 255, 0.5);\n        --edu-scroll-thumb: rgba(255, 255, 255, 0.35);\n        --edu-border: rgba(255, 255, 255, 0.2);\n        position: absolute;\n        top: 80px;\n        left: max(12px, env(safe-area-inset-left, 0px));\n        right: auto;\n        width: min(400px, calc(100vw - 24px));\n        max-height: calc(100vh - 100px);\n        z-index: 40;\n        background: transparent;\n        color: var(--edu-text);\n        border: 1px solid var(--edu-border);\n        border-radius: 16px;\n        padding: 0;\n        box-shadow: none;\n        font-family: \"Open Sans\", system-ui, -apple-system, Segoe UI, sans-serif;\n        -webkit-tap-highlight-color: transparent;\n        backdrop-filter: none;\n        -webkit-backdrop-filter: none;\n      }\n      .edu-panel-header {\n        display: flex;\n        align-items: center;\n        gap: 10px;\n        padding: 14px 14px 12px;\n        border-bottom: 1px solid var(--edu-border);\n      }\n      .edu-panel-header h2 {\n        flex: 1;\n        margin: 0;\n        font-size: 1.2rem;\n        font-weight: 700;\n        letter-spacing: 0.02em;\n        color: var(--edu-text-title);\n        line-height: 1.25;\n      }\n      .edu-panel-toggle {\n        flex-shrink: 0;\n        width: 44px;\n        height: 44px;\n        border: 2px solid var(--edu-scroll-thumb);\n        border-radius: 12px;\n        background: transparent;\n        color: var(--edu-text-strong);\n        cursor: pointer;\n        display: none;\n        align-items: center;\n        justify-content: center;\n        font-size: 14px;\n        line-height: 1;\n        touch-action: manipulation;\n        transition: opacity 0.15s ease, border-color 0.15s ease, color 0.15s ease;\n        opacity: 0.85;\n      }\n      .edu-panel-toggle:hover {\n        opacity: 1;\n        color: var(--edu-text-strong);\n      }\n      .edu-panel-toggle:focus-visible {\n        outline: 2px solid var(--edu-scroll-thumb);\n        outline-offset: 2px;\n      }\n      .edu-panel-body {\n        padding: 12px 14px 16px;\n        padding-bottom: max(16px, env(safe-area-inset-bottom, 0px));\n        max-height: calc(100vh - 200px);\n        overflow-y: auto;\n        -webkit-overflow-scrolling: touch;\n        scrollbar-width: thin;\n        scrollbar-color: var(--edu-scroll-thumb) transparent;\n      }\n      .edu-panel-body::-webkit-scrollbar {\n        width: 8px;\n      }\n      .edu-panel-body::-webkit-scrollbar-track {\n        background: transparent;\n        border: 1px solid var(--edu-border);\n        border-radius: 8px;\n      }\n      .edu-panel-body::-webkit-scrollbar-thumb {\n        background: var(--edu-scroll-thumb);\n        border-radius: 8px;\n        border: 2px solid rgba(0, 0, 0, 0.25);\n      }\n      .edu-panel-body::-webkit-scrollbar-thumb:hover {\n        background: var(--edu-scroll-thumb);\n      }\n      #edu-panel h3 {\n        color: var(--edu-text-strong);\n        margin: 0 0 10px;\n        font-size: 1.05rem;\n        font-weight: 600;\n      }\n      #edu-panel strong {\n        color: var(--edu-text-strong);\n        font-weight: 600;\n      }\n      #edu-panel p,\n      #edu-panel li {\n        font-size: 15px;\n        line-height: 1.55;\n        margin: 0.35em 0;\n        color: var(--edu-text);\n      }\n      #edu-panel ul {\n        padding-left: 1.15em;\n        margin: 0.5em 0;\n      }\n      .edu-tabs {\n        display: grid;\n        grid-template-columns: repeat(3, 1fr);\n        gap: 8px;\n        margin-bottom: 12px;\n      }\n      .edu-tab-btn {\n        border: 2px solid var(--edu-border);\n        background: transparent;\n        color: var(--edu-text);\n        border-radius: 10px;\n        cursor: pointer;\n        padding: 10px 8px;\n        font-size: 14px;\n        font-weight: 600;\n        min-height: 44px;\n        touch-action: manipulation;\n        transition: opacity 0.15s ease, border-color 0.15s ease, color 0.15s ease;\n        opacity: 0.9;\n      }\n      .edu-tab-btn:hover {\n        opacity: 1;\n        color: var(--edu-text-strong);\n      }\n      .edu-tab-btn.active {\n        opacity: 1;\n        color: var(--edu-text-strong);\n        background: transparent;\n        border-color: var(--edu-scroll-thumb);\n      }\n      .edu-tab-btn:focus-visible {\n        outline: 2px solid var(--edu-scroll-thumb);\n        outline-offset: 2px;\n      }\n      .edu-tab-panel {\n        display: none;\n        padding: 12px;\n        border: 1px solid var(--edu-border);\n        border-radius: 12px;\n        margin-bottom: 10px;\n        background: transparent;\n      }\n      .edu-tab-panel.active { display: block; }\n      .edu-note { color: var(--edu-text-muted); }\n      .edu-lab {\n        margin-top: 4px;\n        padding-top: 12px;\n        border-top: 1px solid var(--edu-border);\n      }\n      .edu-lab label {\n        display: block;\n        margin-bottom: 12px;\n        font-size: 14px;\n        font-weight: 600;\n        color: var(--edu-text);\n      }\n      .edu-lab input[type=\"range\"] {\n        -webkit-appearance: none;\n        appearance: none;\n        width: 100%;\n        height: 22px;\n        margin-top: 8px;\n        touch-action: manipulation;\n        background: transparent;\n        border: none;\n        box-sizing: border-box;\n      }\n      .edu-lab input[type=\"range\"]::-webkit-slider-runnable-track {\n        height: 6px;\n        background: transparent;\n        border: 1px solid var(--edu-border);\n        border-radius: 999px;\n      }\n      .edu-lab input[type=\"range\"]::-webkit-slider-thumb {\n        -webkit-appearance: none;\n        appearance: none;\n        width: 18px;\n        height: 18px;\n        margin-top: -6px;\n        border-radius: 50%;\n        background: var(--edu-scroll-thumb);\n        border: 2px solid var(--edu-border);\n        box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.2);\n        cursor: pointer;\n        box-sizing: border-box;\n      }\n      .edu-lab input[type=\"range\"]::-moz-range-track {\n        height: 6px;\n        background: transparent;\n        border: 1px solid var(--edu-border);\n        border-radius: 999px;\n      }\n      .edu-lab input[type=\"range\"]::-moz-range-thumb {\n        width: 18px;\n        height: 18px;\n        border-radius: 50%;\n        background: var(--edu-scroll-thumb);\n        border: 2px solid var(--edu-border);\n        box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.2);\n        cursor: pointer;\n        box-sizing: border-box;\n      }\n      .edu-lab input[type=\"range\"]:focus-visible {\n        outline: 2px solid var(--edu-scroll-thumb);\n        outline-offset: 4px;\n        border-radius: 6px;\n      }\n      .edu-quiz-options { display: grid; gap: 10px; margin-top: 10px; }\n      .edu-quiz-option {\n        text-align: left;\n        background: transparent;\n        color: var(--edu-text);\n        border: 2px solid var(--edu-border);\n        border-radius: 12px;\n        padding: 12px 14px;\n        cursor: pointer;\n        font-size: 15px;\n        min-height: 48px;\n        touch-action: manipulation;\n      }\n      .edu-quiz-option:hover {\n        color: var(--edu-text-strong);\n        border-color: var(--edu-text-strong);\n      }\n      .edu-quiz-option:focus-visible {\n        outline: 2px solid var(--edu-scroll-thumb);\n        outline-offset: 2px;\n      }\n      .edu-sr-only {\n        position: absolute;\n        width: 1px;\n        height: 1px;\n        padding: 0;\n        margin: -1px;\n        overflow: hidden;\n        clip: rect(0, 0, 0, 0);\n        white-space: nowrap;\n        border: 0;\n      }\n\n      #unimap #controls,\n      #unimap #data {\n        transition: none !important;\n      }\n\n      .edu-panel-toggle {\n        line-height: 0;\n      }\n      .edu-panel-toggle .edu-panel-toggle-icon {\n        display: inline-flex;\n        align-items: center;\n        justify-content: center;\n        line-height: 1;\n      }\n\n      #unimap #controls label:has(span) {\n        display: flex;\n        align-items: center;\n        flex-wrap: nowrap;\n        gap: 14px;\n      }\n      #unimap #controls label:has(span) span {\n        margin-left: 1rem;\n        padding-top: 0;\n        flex: 1;\n      }\n      #unimap #controls label.set-view,\n      #unimap #controls label.set-zoom {\n        display: flex;\n        align-items: center;\n        min-height: 44px;\n      }\n      #unimap #controls label.set-view:before,\n      #unimap #controls label.set-zoom:before {\n        margin-top: 0;\n        top: 50%;\n        transform: translateY(-50%);\n      }\n      #unimap #controls input[type=\"checkbox\"]:before {\n        margin-top: 0;\n        top: 50%;\n        transform: translateY(-50%);\n      }\n      #unimap #controls input[type=\"checkbox\"]:after {\n        top: 50% !important;\n        margin-top: 0 !important;\n        transform: translateY(-50%);\n      }\n      #unimap #controls input[type=\"radio\"]:before {\n        top: 50%;\n        transform: translateY(-50%);\n        margin-top: 0;\n      }\n      #unimap #controls input[type=\"radio\"]:checked:after {\n        top: 50%;\n        transform: translateY(-50%);\n        margin-top: 0;\n      }\n\n      @media (max-width: 980px) {\n        #edu-panel {\n          position: fixed;\n          top: auto;\n          bottom: 0;\n          left: 0;\n          right: 0;\n          width: 100%;\n          max-width: none;\n          max-height: none;\n          margin: 0;\n          padding-bottom: env(safe-area-inset-bottom, 0px);\n          border-radius: 16px 16px 0 0;\n          z-index: 98;\n        }\n        .edu-panel-toggle { display: inline-flex; }\n        #edu-panel:not(.is-expanded) .edu-panel-body {\n          display: none;\n        }\n        #edu-panel.is-expanded .edu-panel-body {\n          display: block;\n          max-height: min(58vh, 480px);\n        }\n        #unimap #controls {\n          z-index: 100;\n          max-width: min(100vw - 20px, 300px);\n          padding: 16px 16px max(16px, env(safe-area-inset-bottom, 0px)) 16px;\n          box-sizing: border-box;\n        }\n        #unimap #controls label {\n          position: relative;\n          min-height: 48px;\n          margin-bottom: 28px;\n          padding: 6px 4px 6px 0;\n          box-sizing: border-box;\n          touch-action: manipulation;\n        }\n        #unimap #controls label span {\n          font-size: 16px;\n          line-height: 1.3;\n        }\n        #unimap.controls-close #controls {\n          opacity: 0;\n          pointer-events: none;\n          visibility: hidden;\n        }\n        #unimap.controls-open #controls {\n          opacity: 1;\n          pointer-events: auto;\n          visibility: visible;\n        }\n      }\n      @media (min-width: 981px) {\n        .edu-panel-body {\n          max-height: calc(100vh - 190px);\n        }\n        #edu-panel .edu-panel-toggle {\n          display: none;\n        }\n      }\n      @media (prefers-reduced-motion: reduce) {\n        .edu-tab-btn,\n        .edu-quiz-option,\n        .edu-panel-toggle {\n          transition: none;\n        }\n      }\n    <\/style>\n    <div id=\"navbar\">\n        <a id=\"toggle-data\" href=\"#\"><i class=\"icon-data\"><\/i>Data<\/a>\n        <h1>GHANA PLANETARIUM<br \/><br \/><span>Contact: 054 090 6817 via Whatsapp preferably.<\/span><\/h1>\n        <a id=\"toggle-controls\" href=\"#\"><i class=\"icon-controls\"><\/i>Controls<\/a>\n    <\/div>\n    <div id=\"data\">\n        <a class=\"sun\" title=\"sun\" href=\"#\">Sun<\/a>\n        <a class=\"mercury\" title=\"mercury\" href=\"#\">Mercury<\/a>\n        <a class=\"venus\" title=\"venus\" href=\"#\">Venus<\/a>\n        <a class=\"earth active\" title=\"earth\" href=\"#\">Earth<\/a>\n        <a class=\"mars\" title=\"mars\" href=\"#\">Mars<\/a>\n        <a class=\"jupiter\" title=\"jupiter\" href=\"#\">Jupiter<\/a>\n        <a class=\"saturn\" title=\"saturn\" href=\"#\">Saturn<\/a>\n        <a class=\"uranus\" title=\"uranus\" href=\"#\">Uranus<\/a>\n        <a class=\"neptune\" title=\"neptune\" href=\"#\">Neptune<\/a>\n    <\/div>\n    <div id=\"controls\">\n        <label class=\"set-view\">\n            <input type=\"checkbox\">\n        <\/label>\n        <label class=\"set-zoom\">\n            <input type=\"checkbox\">\n        <\/label>\n        <label>\n            <input type=\"radio\" class=\"set-speed\" name=\"scale\" checked>\n            <span>Speed<\/span>\n        <\/label>\n        <label>\n            <input type=\"radio\" class=\"set-size\" name=\"scale\">\n            <span>Size<\/span>\n        <\/label>\n        <label>\n            <input type=\"radio\" class=\"set-distance\" name=\"scale\">\n            <span>Distance<\/span>\n        <\/label>\n    <\/div>\n    <div id=\"universe\" class=\"scale-stretched\">\n        <div id=\"galaxy\">\n            <div id=\"solar-system\" class=\"earth\">\n                <div id=\"mercury\" class=\"orbit\">\n                    <div class=\"pos\">\n                        <div class=\"planet\">\n                            <dl class=\"infos\">\n                                <dt>Mercury<\/dt>\n                                <dd><span><\/span><\/dd>\n                            <\/dl>\n                        <\/div>\n                    <\/div>\n                <\/div>\n                <div id=\"venus\" class=\"orbit\">\n                    <div class=\"pos\">\n                        <div class=\"planet\">\n                            <dl class=\"infos\">\n                                <dt>Venus<\/dt>\n                                <dd><span><\/span><\/dd>\n                            <\/dl>\n                        <\/div>\n                    <\/div>\n                <\/div>\n                <div id=\"earth\" class=\"orbit\">\n                    <div class=\"pos\">\n                        <div class=\"orbit\">\n                            <div class=\"pos\">\n                                <div class=\"moon\"><\/div>\n                            <\/div>\n                        <\/div>\n                        <div class=\"planet\">\n                            <dl class=\"infos\">\n                                <dt>Earth<\/dt>\n                                <dd><span><\/span><\/dd>\n                            <\/dl>\n                        <\/div>\n                    <\/div>\n                <\/div>\n                <div id=\"mars\" class=\"orbit\">\n                    <div class=\"pos\">\n                        <div class=\"planet\">\n                            <dl class=\"infos\">\n                                <dt>Mars<\/dt>\n                                <dd><span><\/span><\/dd>\n                            <\/dl>\n                        <\/div>\n                    <\/div>\n                <\/div>\n                <div id=\"jupiter\" class=\"orbit\">\n                    <div class=\"pos\">\n                        <div class=\"planet\">\n                            <dl class=\"infos\">\n                                <dt>Jupiter<\/dt>\n                                <dd><span><\/span><\/dd>\n                            <\/dl>\n                        <\/div>\n                    <\/div>\n                <\/div>\n                <div id=\"saturn\" class=\"orbit\">\n                    <div class=\"pos\">\n                        <div class=\"planet\">\n                            <div class=\"ring\"><\/div>\n                            <dl class=\"infos\">\n                                <dt>Saturn<\/dt>\n                                <dd><span><\/span><\/dd>\n                            <\/dl>\n                        <\/div>\n                    <\/div>\n                <\/div>\n                <div id=\"uranus\" class=\"orbit\">\n                    <div class=\"pos\">\n                        <div class=\"planet\">\n                            <dl class=\"infos\">\n                                <dt>Uranus<\/dt>\n                                <dd><span><\/span><\/dd>\n                            <\/dl>\n                        <\/div>\n                    <\/div>\n                <\/div>\n                <div id=\"neptune\" class=\"orbit\">\n                    <div class=\"pos\">\n                        <div class=\"planet\">\n                            <dl class=\"infos\">\n                                <dt>Neptune<\/dt>\n                                <dd><span><\/span><\/dd>\n                            <\/dl>\n                        <\/div>\n                    <\/div>\n                <\/div>\n                <div id=\"sun\">\n                    <dl class=\"infos\">\n                        <dt>Sun<\/dt>\n                        <dd><span><\/span><\/dd>\n                    <\/dl>\n                <\/div>\n            <\/div>\n        <\/div>\n    <\/div>\n    <aside id=\"edu-panel\" aria-label=\"Solar system education panel\">\n      <header class=\"edu-panel-header\">\n        <button type=\"button\" id=\"edu-panel-toggle\" class=\"edu-panel-toggle\" aria-expanded=\"false\" aria-controls=\"edu-panel-body\">\n          <span class=\"edu-panel-toggle-icon\" aria-hidden=\"true\">&#9660;<\/span>\n          <span class=\"edu-sr-only\">Toggle Solar System Academy panel<\/span>\n        <\/button>\n        <h2>Solar System Academy<\/h2>\n      <\/header>\n      <div id=\"edu-panel-body\" class=\"edu-panel-body\">\n        <div class=\"edu-tabs\">\n          <button type=\"button\" class=\"edu-tab-btn active\" data-tab=\"overview\">Overview<\/button>\n          <button type=\"button\" class=\"edu-tab-btn\" data-tab=\"moons\">Moons<\/button>\n          <button type=\"button\" class=\"edu-tab-btn\" data-tab=\"seasons\">Seasons<\/button>\n          <button type=\"button\" class=\"edu-tab-btn\" data-tab=\"eclipses\">Eclipses<\/button>\n          <button type=\"button\" class=\"edu-tab-btn\" data-tab=\"orbit\">Orbit<\/button>\n          <button type=\"button\" class=\"edu-tab-btn\" data-tab=\"quiz\">Quiz<\/button>\n        <\/div>\n\n        <section class=\"edu-tab-panel active\" data-tab-panel=\"overview\">\n          <div id=\"edu-overview-content\"><\/div>\n        <\/section>\n        <section class=\"edu-tab-panel\" data-tab-panel=\"moons\">\n          <div id=\"edu-moons-content\"><\/div>\n        <\/section>\n        <section class=\"edu-tab-panel\" data-tab-panel=\"seasons\">\n          <div id=\"edu-seasons-content\"><\/div>\n        <\/section>\n        <section class=\"edu-tab-panel\" data-tab-panel=\"eclipses\">\n          <div id=\"edu-eclipses-content\"><\/div>\n        <\/section>\n        <section class=\"edu-tab-panel\" data-tab-panel=\"orbit\">\n          <div id=\"edu-orbit-content\"><\/div>\n        <\/section>\n        <section class=\"edu-tab-panel\" data-tab-panel=\"quiz\">\n          <div id=\"edu-quiz-content\"><\/div>\n        <\/section>\n\n        <div class=\"edu-lab\">\n          <h3>Simulation Timeline and Orbit Lab<\/h3>\n          <label>Day of year\n            <input id=\"edu-day-slider\" type=\"range\" min=\"1\" max=\"365\" value=\"172\">\n          <\/label>\n          <label>Tilt adjustment (deg)\n            <input id=\"edu-tilt-slider\" type=\"range\" min=\"-30\" max=\"30\" value=\"0\">\n          <\/label>\n          <label>Eccentricity adjustment\n            <input id=\"edu-ecc-slider\" type=\"range\" min=\"-0.2\" max=\"0.2\" step=\"0.01\" value=\"0\">\n          <\/label>\n          <label>Inclination adjustment (deg)\n            <input id=\"edu-inc-slider\" type=\"range\" min=\"-10\" max=\"10\" step=\"0.1\" value=\"0\">\n          <\/label>\n          <div id=\"edu-sim-status\"><\/div>\n        <\/div>\n      <\/div>\n    <\/aside>[\/et_pb_fullwidth_code][\/et_pb_section]<\/p>\n","protected":false},"excerpt":{"rendered":"<div id=\"unimap\" class=\"opening hide-UI view-2D zoom-large data-close controls-close\" style=\"height: 100vh; background-color: #08090a;\">\n    <style>\n      #edu-panel {\n        --edu-text: rgba(255, 255, 255, 0.6);\n        --edu-text-strong: #fff;\n        --edu-text-title: rgba(255, 255, 255, 0.8);\n        --edu-text-muted: rgba(255, 255, 255, 0.5);\n        --edu-scroll-thumb: rgba(255, 255, 255, 0.35);\n        --edu-border: rgba(255, 255, 255, 0.2);\n        position: absolute;\n        top: 80px;\n        left: max(12px, env(safe-area-inset-left, 0px));\n        right: auto;\n        width: min(400px, calc(100vw - 24px));\n        max-height: calc(100vh - 100px);\n        z-index: 40;\n        background: transparent;\n        color: var(--edu-text);\n        border: 1px solid var(--edu-border);\n        border-radius: 16px;\n        padding: 0;\n        box-shadow: none;\n        font-family: \"Open Sans\", system-ui, -apple-system, Segoe UI, sans-serif;\n        -webkit-tap-highlight-color: transparent;\n        backdrop-filter: none;\n        -webkit-backdrop-filter: none;\n      }\n      .edu-panel-header {\n        display: flex;\n        align-items: center;\n        gap: 10px;\n        padding: 14px 14px 12px;\n        border-bottom: 1px solid var(--edu-border);\n      }\n      .edu-panel-header h2 {\n        flex: 1;\n        margin: 0;\n        font-size: 1.2rem;\n        font-weight: 700;\n        letter-spacing: 0.02em;\n        color: var(--edu-text-title);\n        line-height: 1.25;\n      }\n      .edu-panel-toggle {\n        flex-shrink: 0;\n        width: 44px;\n        height: 44px;\n        border: 2px solid var(--edu-scroll-thumb);\n        border-radius: 12px;\n        background: transparent;\n        color: var(--edu-text-strong);\n        cursor: pointer;\n        display: none;\n        align-items: center;\n        justify-content: center;\n        font-size: 14px;\n        line-height: 1;\n        touch-action: manipulation;\n        transition: opacity 0.15s ease, border-color 0.15s ease, color 0.15s ease;\n        opacity: 0.85;\n      }\n      .edu-panel-toggle:hover {\n        opacity: 1;\n        color: var(--edu-text-strong);\n      }\n      .edu-panel-toggle:focus-visible {\n        outline: 2px solid var(--edu-scroll-thumb);\n        outline-offset: 2px;\n      }\n      .edu-panel-body {\n        padding: 12px 14px 16px;\n        padding-bottom: max(16px, env(safe-area-inset-bottom, 0px));\n        max-height: calc(100vh - 200px);\n        overflow-y: auto;\n        -webkit-overflow-scrolling: touch;\n        scrollbar-width: thin;\n        scrollbar-color: var(--edu-scroll-thumb) transparent;\n      }\n      .edu-panel-body::-webkit-scrollbar {\n        width: 8px;\n      }\n      .edu-panel-body::-webkit-scrollbar-track {\n        background: transparent;\n        border: 1px solid var(--edu-border);\n        border-radius: 8px;\n      }\n      .edu-panel-body::-webkit-scrollbar-thumb {\n        background: var(--edu-scroll-thumb);\n        border-radius: 8px;\n        border: 2px solid rgba(0, 0, 0, 0.25);\n      }\n      .edu-panel-body::-webkit-scrollbar-thumb:hover {\n        background: var(--edu-scroll-thumb);\n      }\n      #edu-panel h3 {\n        color: var(--edu-text-strong);\n        margin: 0 0 10px;\n        font-size: 1.05rem;\n        font-weight: 600;\n      }\n      #edu-panel strong {\n        color: var(--edu-text-strong);\n        font-weight: 600;\n      }\n      #edu-panel p,\n      #edu-panel li {\n        font-size: 15px;\n        line-height: 1.55;\n        margin: 0.35em 0;\n        color: var(--edu-text);\n      }\n      #edu-panel ul {\n        padding-left: 1.15em;\n        margin: 0.5em 0;\n      }\n      .edu-tabs {\n        display: grid;\n        grid-template-columns: repeat(3, 1fr);\n        gap: 8px;\n        margin-bottom: 12px;\n      }\n      .edu-tab-btn {\n        border: 2px solid var(--edu-border);\n        background: transparent;\n        color: var(--edu-text);\n        border-radius: 10px;\n        cursor: pointer;\n        padding: 10px 8px;\n        font-size: 14px;\n        font-weight: 600;\n        min-height: 44px;\n        touch-action: manipulation;\n        transition: opacity 0.15s ease, border-color 0.15s ease, color 0.15s ease;\n        opacity: 0.9;\n      }\n      .edu-tab-btn:hover {\n        opacity: 1;\n        color: var(--edu-text-strong);\n      }\n      .edu-tab-btn.active {\n        opacity: 1;\n        color: var(--edu-text-strong);\n        background: transparent;\n        border-color: var(--edu-scroll-thumb);\n      }\n      .edu-tab-btn:focus-visible {\n        outline: 2px solid var(--edu-scroll-thumb);\n        outline-offset: 2px;\n      }\n      .edu-tab-panel {\n        display: none;\n        padding: 12px;\n        border: 1px solid var(--edu-border);\n        border-radius: 12px;\n        margin-bottom: 10px;\n        background: transparent;\n      }\n      .edu-tab-panel.active { display: block; }\n      .edu-note { color: var(--edu-text-muted); }\n      .edu-lab {\n        margin-top: 4px;\n        padding-top: 12px;\n        border-top: 1px solid var(--edu-border);\n      }\n      .edu-lab label {\n        display: block;\n        margin-bottom: 12px;\n        font-size: 14px;\n        font-weight: 600;\n        color: var(--edu-text);\n      }\n      .edu-lab input[type=\"range\"] {\n        -webkit-appearance: none;\n        appearance: none;\n        width: 100%;\n        height: 22px;\n        margin-top: 8px;\n        touch-action: manipulation;\n        background: transparent;\n        border: none;\n        box-sizing: border-box;\n      }\n      .edu-lab input[type=\"range\"]::-webkit-slider-runnable-track {\n        height: 6px;\n        background: transparent;\n        border: 1px solid var(--edu-border);\n        border-radius: 999px;\n      }\n      .edu-lab input[type=\"range\"]::-webkit-slider-thumb {\n        -webkit-appearance: none;\n        appearance: none;\n        width: 18px;\n        height: 18px;\n        margin-top: -6px;\n        border-radius: 50%;\n        background: var(--edu-scroll-thumb);\n        border: 2px solid var(--edu-border);\n        box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.2);\n        cursor: pointer;\n        box-sizing: border-box;\n      }\n      .edu-lab input[type=\"range\"]::-moz-range-track {\n        height: 6px;\n        background: transparent;\n        border: 1px solid var(--edu-border);\n        border-radius: 999px;\n      }\n      .edu-lab input[type=\"range\"]::-moz-range-thumb {\n        width: 18px;\n        height: 18px;\n        border-radius: 50%;\n        background: var(--edu-scroll-thumb);\n        border: 2px solid var(--edu-border);\n        box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.2);\n        cursor: pointer;\n        box-sizing: border-box;\n      }\n      .edu-lab input[type=\"range\"]:focus-visible {\n        outline: 2px solid var(--edu-scroll-thumb);\n        outline-offset: 4px;\n        border-radius: 6px;\n      }\n      .edu-quiz-options { display: grid; gap: 10px; margin-top: 10px; }\n      .edu-quiz-option {\n        text-align: left;\n        background: transparent;\n        color: var(--edu-text);\n        border: 2px solid var(--edu-border);\n        border-radius: 12px;\n        padding: 12px 14px;\n        cursor: pointer;\n        font-size: 15px;\n        min-height: 48px;\n        touch-action: manipulation;\n      }\n      .edu-quiz-option:hover {\n        color: var(--edu-text-strong);\n        border-color: var(--edu-text-strong);\n      }\n      .edu-quiz-option:focus-visible {\n        outline: 2px solid var(--edu-scroll-thumb);\n        outline-offset: 2px;\n      }\n      .edu-sr-only {\n        position: absolute;\n        width: 1px;\n        height: 1px;\n        padding: 0;\n        margin: -1px;\n        overflow: hidden;\n        clip: rect(0, 0, 0, 0);\n        white-space: nowrap;\n        border: 0;\n      }\n\n      #unimap #controls,\n      #unimap #data {\n        transition: none !important;\n      }\n\n      .edu-panel-toggle {\n        line-height: 0;\n      }\n      .edu-panel-toggle .edu-panel-toggle-icon {\n        display: inline-flex;\n        align-items: center;\n        justify-content: center;\n        line-height: 1;\n      }\n\n      #unimap #controls label:has(span) {\n        display: flex;\n        align-items: center;\n        flex-wrap: nowrap;\n        gap: 14px;\n      }\n      #unimap #controls label:has(span) span {\n        margin-left: 1rem;\n        padding-top: 0;\n        flex: 1;\n      }\n      #unimap #controls label.set-view,\n      #unimap #controls label.set-zoom {\n        display: flex;\n        align-items: center;\n        min-height: 44px;\n      }\n      #unimap #controls label.set-view:before,\n      #unimap #controls label.set-zoom:before {\n        margin-top: 0;\n        top: 50%;\n        transform: translateY(-50%);\n      }\n      #unimap #controls input[type=\"checkbox\"]:before {\n        margin-top: 0;\n        top: 50%;\n        transform: translateY(-50%);\n      }\n      #unimap #controls input[type=\"checkbox\"]:after {\n        top: 50% !important;\n        margin-top: 0 !important;\n        transform: translateY(-50%);\n      }\n      #unimap #controls input[type=\"radio\"]:before {\n        top: 50%;\n        transform: translateY(-50%);\n        margin-top: 0;\n      }\n      #unimap #controls input[type=\"radio\"]:checked:after {\n        top: 50%;\n        transform: translateY(-50%);\n        margin-top: 0;\n      }\n\n      @media (max-width: 980px) {\n        #edu-panel {\n          position: fixed;\n          top: auto;\n          bottom: 0;\n          left: 0;\n          right: 0;\n          width: 100%;\n          max-width: none;\n          max-height: none;\n          margin: 0;\n          padding-bottom: env(safe-area-inset-bottom, 0px);\n          border-radius: 16px 16px 0 0;\n          z-index: 98;\n        }\n        .edu-panel-toggle { display: inline-flex; }\n        #edu-panel:not(.is-expanded) .edu-panel-body {\n          display: none;\n        }\n        #edu-panel.is-expanded .edu-panel-body {\n          display: block;\n          max-height: min(58vh, 480px);\n        }\n        #unimap #controls {\n          z-index: 100;\n          max-width: min(100vw - 20px, 300px);\n          padding: 16px 16px max(16px, env(safe-area-inset-bottom, 0px)) 16px;\n          box-sizing: border-box;\n        }\n        #unimap #controls label {\n          position: relative;\n          min-height: 48px;\n          margin-bottom: 28px;\n          padding: 6px 4px 6px 0;\n          box-sizing: border-box;\n          touch-action: manipulation;\n        }\n        #unimap #controls label span {\n          font-size: 16px;\n          line-height: 1.3;\n        }\n        #unimap.controls-close #controls {\n          opacity: 0;\n          pointer-events: none;\n          visibility: hidden;\n        }\n        #unimap.controls-open #controls {\n          opacity: 1;\n          pointer-events: auto;\n          visibility: visible;\n        }\n      }\n      @media (min-width: 981px) {\n        .edu-panel-body {\n          max-height: calc(100vh - 190px);\n        }\n        #edu-panel .edu-panel-toggle {\n          display: none;\n        }\n      }\n      @media (prefers-reduced-motion: reduce) {\n        .edu-tab-btn,\n        .edu-quiz-option,\n        .edu-panel-toggle {\n          transition: none;\n        }\n      }\n    <\/style>\n    <div id=\"navbar\">\n        <a id=\"toggle-data\" href=\"#\"><i class=\"icon-data\"><\/i>Data<\/a>\n        <h1>GHANA PLANETARIUM<br \/><br \/><span>Contact: 054 090 6817 via Whatsapp preferably.<\/span><\/h1>\n        <a id=\"toggle-controls\" href=\"#\"><i class=\"icon-controls\"><\/i>Controls<\/a>\n    <\/div>\n    <div id=\"data\">\n        <a class=\"sun\" title=\"sun\" href=\"#\">Sun<\/a>\n        <a class=\"mercury\" title=\"mercury\" href=\"#\">Mercury<\/a>\n        <a class=\"venus\" title=\"venus\" href=\"#\">Venus<\/a>\n        <a class=\"earth active\" title=\"earth\" href=\"#\">Earth<\/a>\n        <a class=\"mars\" title=\"mars\" href=\"#\">Mars<\/a>\n        <a class=\"jupiter\" title=\"jupiter\" href=\"#\">Jupiter<\/a>\n        <a class=\"saturn\" title=\"saturn\" href=\"#\">Saturn<\/a>\n        <a class=\"uranus\" title=\"uranus\" href=\"#\">Uranus<\/a>\n        <a class=\"neptune\" title=\"neptune\" href=\"#\">Neptune<\/a>\n    <\/div>\n    <div id=\"controls\">\n        <label class=\"set-view\">\n            <input type=\"checkbox\">\n        <\/label>\n        <label class=\"set-zoom\">\n            <input type=\"checkbox\">\n        <\/label>\n        <label>\n            <input type=\"radio\" class=\"set-speed\" name=\"scale\" checked>\n            <span>Speed<\/span>\n        <\/label>\n        <label>\n            <input type=\"radio\" class=\"set-size\" name=\"scale\">\n            <span>Size<\/span>\n        <\/label>\n        <label>\n            <input type=\"radio\" class=\"set-distance\" name=\"scale\">\n            <span>Distance<\/span>\n        <\/label>\n    <\/div>\n    <div id=\"universe\" class=\"scale-stretched\">\n        <div id=\"galaxy\">\n            <div id=\"solar-system\" class=\"earth\">\n                <div id=\"mercury\" class=\"orbit\">\n                    <div class=\"pos\">\n                        <div class=\"planet\">\n                            <dl class=\"infos\">\n                                <dt>Mercury<\/dt>\n                                <dd><span><\/span><\/dd>\n                            <\/dl>\n                        <\/div>\n                    <\/div>\n                <\/div>\n                <div id=\"venus\" class=\"orbit\">\n                    <div class=\"pos\">\n                        <div class=\"planet\">\n                            <dl class=\"infos\">\n                                <dt>Venus<\/dt>\n                                <dd><span><\/span><\/dd>\n                            <\/dl>\n                        <\/div>\n                    <\/div>\n                <\/div>\n                <div id=\"earth\" class=\"orbit\">\n                    <div class=\"pos\">\n                        <div class=\"orbit\">\n                            <div class=\"pos\">\n                                <div class=\"moon\"><\/div>\n                            <\/div>\n                        <\/div>\n                        <div class=\"planet\">\n                            <dl class=\"infos\">\n                                <dt>Earth<\/dt>\n                                <dd><span><\/span><\/dd>\n                            <\/dl>\n                        <\/div>\n                    <\/div>\n                <\/div>\n                <div id=\"mars\" class=\"orbit\">\n                    <div class=\"pos\">\n                        <div class=\"planet\">\n                            <dl class=\"infos\">\n                                <dt>Mars<\/dt>\n                                <dd><span><\/span><\/dd>\n                            <\/dl>\n                        <\/div>\n                    <\/div>\n                <\/div>\n                <div id=\"jupiter\" class=\"orbit\">\n                    <div class=\"pos\">\n                        <div class=\"planet\">\n                            <dl class=\"infos\">\n                                <dt>Jupiter<\/dt>\n                                <dd><span><\/span><\/dd>\n                            <\/dl>\n                        <\/div>\n                    <\/div>\n                <\/div>\n                <div id=\"saturn\" class=\"orbit\">\n                    <div class=\"pos\">\n                        <div class=\"planet\">\n                            <div class=\"ring\"><\/div>\n                            <dl class=\"infos\">\n                                <dt>Saturn<\/dt>\n                                <dd><span><\/span><\/dd>\n                            <\/dl>\n                        <\/div>\n                    <\/div>\n                <\/div>\n                <div id=\"uranus\" class=\"orbit\">\n                    <div class=\"pos\">\n                        <div class=\"planet\">\n                            <dl class=\"infos\">\n                                <dt>Uranus<\/dt>\n                                <dd><span><\/span><\/dd>\n                            <\/dl>\n                        <\/div>\n                    <\/div>\n                <\/div>\n                <div id=\"neptune\" class=\"orbit\">\n                    <div class=\"pos\">\n                        <div class=\"planet\">\n                            <dl class=\"infos\">\n                                <dt>Neptune<\/dt>\n                                <dd><span><\/span><\/dd>\n                            <\/dl>\n                        <\/div>\n                    <\/div>\n                <\/div>\n                <div id=\"sun\">\n                    <dl class=\"infos\">\n                        <dt>Sun<\/dt>\n                        <dd><span><\/span><\/dd>\n                    <\/dl>\n                <\/div>\n            <\/div>\n        <\/div>\n    <\/div>\n    <aside id=\"edu-panel\" aria-label=\"Solar system education panel\">\n      <header class=\"edu-panel-header\">\n        <button type=\"button\" id=\"edu-panel-toggle\" class=\"edu-panel-toggle\" aria-expanded=\"false\" aria-controls=\"edu-panel-body\">\n          <span class=\"edu-panel-toggle-icon\" aria-hidden=\"true\">&#9660;<\/span>\n          <span class=\"edu-sr-only\">Toggle Solar System Academy panel<\/span>\n        <\/button>\n        <h2>Solar System Academy<\/h2>\n      <\/header>\n      <div id=\"edu-panel-body\" class=\"edu-panel-body\">\n        <div class=\"edu-tabs\">\n          <button type=\"button\" class=\"edu-tab-btn active\" data-tab=\"overview\">Overview<\/button>\n          <button type=\"button\" class=\"edu-tab-btn\" data-tab=\"moons\">Moons<\/button>\n          <button type=\"button\" class=\"edu-tab-btn\" data-tab=\"seasons\">Seasons<\/button>\n          <button type=\"button\" class=\"edu-tab-btn\" data-tab=\"eclipses\">Eclipses<\/button>\n          <button type=\"button\" class=\"edu-tab-btn\" data-tab=\"orbit\">Orbit<\/button>\n          <button type=\"button\" class=\"edu-tab-btn\" data-tab=\"quiz\">Quiz<\/button>\n        <\/div>\n\n        <section class=\"edu-tab-panel active\" data-tab-panel=\"overview\">\n          <div id=\"edu-overview-content\"><\/div>\n        <\/section>\n        <section class=\"edu-tab-panel\" data-tab-panel=\"moons\">\n          <div id=\"edu-moons-content\"><\/div>\n        <\/section>\n        <section class=\"edu-tab-panel\" data-tab-panel=\"seasons\">\n          <div id=\"edu-seasons-content\"><\/div>\n        <\/section>\n        <section class=\"edu-tab-panel\" data-tab-panel=\"eclipses\">\n          <div id=\"edu-eclipses-content\"><\/div>\n        <\/section>\n        <section class=\"edu-tab-panel\" data-tab-panel=\"orbit\">\n          <div id=\"edu-orbit-content\"><\/div>\n        <\/section>\n        <section class=\"edu-tab-panel\" data-tab-panel=\"quiz\">\n          <div id=\"edu-quiz-content\"><\/div>\n        <\/section>\n\n        <div class=\"edu-lab\">\n          <h3>Simulation Timeline and Orbit Lab<\/h3>\n          <label>Day of year\n            <input id=\"edu-day-slider\" type=\"range\" min=\"1\" max=\"365\" value=\"172\">\n          <\/label>\n          <label>Tilt adjustment (deg)\n            <input id=\"edu-tilt-slider\" type=\"range\" min=\"-30\" max=\"30\" value=\"0\">\n          <\/label>\n          <label>Eccentricity adjustment\n            <input id=\"edu-ecc-slider\" type=\"range\" min=\"-0.2\" max=\"0.2\" step=\"0.01\" value=\"0\">\n          <\/label>\n          <label>Inclination adjustment (deg)\n            <input id=\"edu-inc-slider\" type=\"range\" min=\"-10\" max=\"10\" step=\"0.1\" value=\"0\">\n          <\/label>\n          <div id=\"edu-sim-status\"><\/div>\n        <\/div>\n      <\/div>\n    <\/aside>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"_et_pb_use_builder":"on","_et_pb_old_content":"<!-- wp:divi\/placeholder \/-->","_et_gb_content_width":"","footnotes":""},"class_list":["post-7","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/ghanaplanetarium.com\/index.php?rest_route=\/wp\/v2\/pages\/7","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/ghanaplanetarium.com\/index.php?rest_route=\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/ghanaplanetarium.com\/index.php?rest_route=\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/ghanaplanetarium.com\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/ghanaplanetarium.com\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=7"}],"version-history":[{"count":20,"href":"https:\/\/ghanaplanetarium.com\/index.php?rest_route=\/wp\/v2\/pages\/7\/revisions"}],"predecessor-version":[{"id":70,"href":"https:\/\/ghanaplanetarium.com\/index.php?rest_route=\/wp\/v2\/pages\/7\/revisions\/70"}],"wp:attachment":[{"href":"https:\/\/ghanaplanetarium.com\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=7"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}