Department of Geography and History<\/title>\r\n <style>\r\n * {\r\n margin: 0;\r\n padding: 0;\r\n box-sizing: border-box;\r\n }\r\n\r\n :root {\r\n --primary-color: #8B4513;\r\n --accent-color: #DAA520;\r\n --dark-text: #1a1a1a;\r\n --light-bg: #f8f9fa;\r\n --border-color: #e0e0e0;\r\n --white: #ffffff;\r\n --icon-color: #000000;\r\n }\r\n\r\n body {\r\n font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;\r\n line-height: 1.6;\r\n color: var(--dark-text);\r\n background-color: var(--light-bg);\r\n }\r\n\r\n \/* Header Section *\/\r\n .header {\r\n background-color: var(--white);\r\n padding: 40px 20px;\r\n border-bottom: 3px solid var(--primary-color);\r\n text-align: center;\r\n margin-bottom: 40px;\r\n }\r\n\r\n .header h1 {\r\n font-size: 2.5rem;\r\n color: var(--primary-color);\r\n margin-bottom: 20px;\r\n font-weight: 700;\r\n }\r\n\r\n .header p {\r\n font-size: 1rem;\r\n color: var(--dark-text);\r\n text-align: justify;\r\n max-width: 900px;\r\n margin: 0 auto;\r\n line-height: 1.8;\r\n }\r\n\r\n \/* Main Container *\/\r\n .container {\r\n display: flex;\r\n max-width: 1200px;\r\n margin: 0 auto;\r\n gap: 30px;\r\n padding: 0 20px 40px;\r\n flex-wrap: wrap;\r\n }\r\n\r\n \/* Tabs Navigation *\/\r\n .tabs-nav {\r\n flex: 0 0 250px;\r\n display: flex;\r\n flex-direction: column;\r\n gap: 10px;\r\n }\r\n\r\n .tab-button {\r\n display: flex;\r\n align-items: center;\r\n gap: 12px;\r\n padding: 15px 20px;\r\n background-color: var(--white);\r\n border: 2px solid var(--border-color);\r\n border-left: 4px solid var(--primary-color);\r\n cursor: pointer;\r\n font-size: 0.95rem;\r\n font-weight: 500;\r\n color: var(--dark-text);\r\n transition: all 0.3s ease;\r\n border-radius: 4px;\r\n }\r\n\r\n \/* Desktop hover effect - text color changes to black *\/\r\n @media (hover: hover) and (pointer: fine) {\r\n .tab-button:hover {\r\n background-color: var(--light-bg);\r\n border-left-color: var(--accent-color);\r\n transform: translateX(5px);\r\n color: #000000;\r\n }\r\n }\r\n\r\n .tab-button.active {\r\n background-color: var(--primary-color);\r\n color: var(--white);\r\n border-left-color: var(--accent-color);\r\n box-shadow: 0 4px 12px rgba(139, 69, 19, 0.2);\r\n }\r\n\r\n .tab-icon {\r\n font-size: 1.3rem;\r\n color: var(--icon-color);\r\n width: 24px;\r\n text-align: center;\r\n }\r\n\r\n .tab-button.active .tab-icon {\r\n color: var(--accent-color);\r\n }\r\n\r\n \/* Mobile Dropdown *\/\r\n .mobile-tabs-dropdown {\r\n display: none;\r\n width: 100%;\r\n padding: 12px 15px;\r\n font-size: 1rem;\r\n border: 2px solid var(--primary-color);\r\n border-radius: 4px;\r\n background-color: var(--white);\r\n color: var(--dark-text);\r\n margin-bottom: 20px;\r\n cursor: pointer;\r\n }\r\n\r\n \/* Content Area *\/\r\n .content-area {\r\n flex: 1;\r\n min-width: 300px;\r\n }\r\n\r\n .tab-content {\r\n display: none;\r\n background-color: var(--white);\r\n padding: 40px;\r\n border-radius: 8px;\r\n box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);\r\n animation: fadeIn 0.3s ease;\r\n }\r\n\r\n .tab-content.active {\r\n display: block;\r\n }\r\n\r\n @keyframes fadeIn {\r\n from {\r\n opacity: 0;\r\n transform: translateY(10px);\r\n }\r\n to {\r\n opacity: 1;\r\n transform: translateY(0);\r\n }\r\n }\r\n\r\n .tab-content h2 {\r\n color: var(--primary-color);\r\n font-size: 1.8rem;\r\n margin-bottom: 20px;\r\n border-bottom: 3px solid var(--accent-color);\r\n padding-bottom: 10px;\r\n }\r\n\r\n .tab-content p {\r\n text-align: justify;\r\n margin-bottom: 15px;\r\n line-height: 1.8;\r\n color: var(--dark-text);\r\n }\r\n\r\n .tab-content ul {\r\n margin-left: 20px;\r\n margin-bottom: 15px;\r\n }\r\n\r\n .tab-content li {\r\n margin-bottom: 10px;\r\n text-align: justify;\r\n }\r\n\r\n \/* Table Styles *\/\r\n .requirements-table {\r\n width: 100%;\r\n border-collapse: collapse;\r\n margin-top: 20px;\r\n overflow-x: auto;\r\n }\r\n\r\n .requirements-table thead {\r\n background-color: var(--primary-color);\r\n color: var(--white);\r\n }\r\n\r\n .requirements-table th {\r\n padding: 15px;\r\n text-align: left;\r\n font-weight: 600;\r\n border: 1px solid var(--border-color);\r\n }\r\n\r\n .requirements-table td {\r\n padding: 12px 15px;\r\n border: 1px solid var(--border-color);\r\n text-align: left;\r\n }\r\n\r\n .requirements-table tbody tr:nth-child(even) {\r\n background-color: #f8f2eb;\r\n }\r\n\r\n .requirements-table tbody tr:hover {\r\n background-color: #f0e6d8;\r\n }\r\n\r\n .requirements-table tbody tr:nth-child(odd) {\r\n background-color: var(--white);\r\n }\r\n\r\n .highlight {\r\n color: var(--primary-color);\r\n font-weight: 600;\r\n }\r\n\r\n .job-opportunities {\r\n display: grid;\r\n grid-template-columns: repeat(auto-fill, minmax(250px, 1fr));\r\n gap: 15px;\r\n margin: 20px 0;\r\n }\r\n\r\n .job-card {\r\n background-color: #f8f2eb;\r\n padding: 15px;\r\n border-radius: 8px;\r\n border-left: 4px solid var(--accent-color);\r\n box-shadow: 0 2px 5px rgba(0,0,0,0.1);\r\n }\r\n\r\n .job-card h3 {\r\n color: var(--primary-color);\r\n margin-bottom: 10px;\r\n }\r\n\r\n .goals-list {\r\n counter-reset: goal-counter;\r\n list-style-type: none;\r\n margin-left: 0;\r\n }\r\n\r\n .goals-list li {\r\n margin-bottom: 20px;\r\n padding-left: 40px;\r\n position: relative;\r\n }\r\n\r\n .goals-list li:before {\r\n counter-increment: goal-counter;\r\n content: counter(goal-counter);\r\n position: absolute;\r\n left: 0;\r\n top: 0;\r\n background-color: var(--primary-color);\r\n color: var(--white);\r\n width: 30px;\r\n height: 30px;\r\n border-radius: 50%;\r\n display: flex;\r\n align-items: center;\r\n justify-content: center;\r\n font-weight: bold;\r\n }\r\n\r\n \/* Enhanced Responsive Design *\/\r\n @media (max-width: 1024px) {\r\n .container {\r\n gap: 20px;\r\n }\r\n \r\n .tabs-nav {\r\n flex: 0 0 220px;\r\n }\r\n \r\n .tab-button {\r\n padding: 14px 18px;\r\n font-size: 0.9rem;\r\n }\r\n \r\n .tab-content {\r\n padding: 30px;\r\n }\r\n }\r\n\r\n @media (max-width: 768px) {\r\n .header h1 {\r\n font-size: 1.8rem;\r\n }\r\n\r\n .container {\r\n flex-direction: column;\r\n gap: 20px;\r\n }\r\n\r\n \/* Show mobile dropdown and hide regular tabs *\/\r\n .mobile-tabs-dropdown {\r\n display: block;\r\n }\r\n \r\n .tabs-nav {\r\n display: none;\r\n }\r\n\r\n .tab-content {\r\n padding: 25px;\r\n }\r\n\r\n .tab-content h2 {\r\n font-size: 1.4rem;\r\n }\r\n\r\n .requirements-table {\r\n font-size: 0.9rem;\r\n }\r\n\r\n .requirements-table th, .requirements-table td {\r\n padding: 10px;\r\n }\r\n\r\n .job-opportunities {\r\n grid-template-columns: 1fr;\r\n }\r\n }\r\n\r\n @media (max-width: 480px) {\r\n .header {\r\n padding: 25px 15px;\r\n }\r\n\r\n .header h1 {\r\n font-size: 1.5rem;\r\n }\r\n\r\n .header p {\r\n font-size: 0.9rem;\r\n }\r\n\r\n .container {\r\n padding: 0 15px 30px;\r\n }\r\n\r\n .tab-content {\r\n padding: 20px;\r\n }\r\n\r\n .tab-content h2 {\r\n font-size: 1.2rem;\r\n }\r\n\r\n .requirements-table {\r\n font-size: 0.8rem;\r\n }\r\n\r\n .requirements-table th, .requirements-table td {\r\n padding: 8px;\r\n }\r\n \r\n \/* Stack table columns on very small screens *\/\r\n @media (max-width: 360px) {\r\n .requirements-table {\r\n display: block;\r\n overflow-x: auto;\r\n white-space: nowrap;\r\n }\r\n }\r\n }\r\n\r\n \/* Touch device optimizations *\/\r\n @media (hover: none) and (pointer: coarse) {\r\n .tab-button {\r\n padding: 16px 20px;\r\n }\r\n \r\n .tab-button:active {\r\n background-color: var(--light-bg);\r\n border-left-color: var(--accent-color);\r\n }\r\n }\r\n <\/style>\r\n<\/head>\r\n<body>\r\n \r\n <div class=\"header\">\r\n <h1>Department of Geography and History<\/h1>\r\n <p>\r\n There is a critical need for well-trained teachers in geography and history to develop and promote education in these fields due to their relevance to contemporary societal issues. This program emphasizes the training of effective educators with strong foundations in geographical understanding and historical analysis, combined with pedagogical skills and critical thinking. Graduates of the program will be equipped with the academic and instructional competencies necessary to connect classroom knowledge with real-world challenges, such as environmental change, cultural heritage, civic education, and historical awareness. By fostering research and community engagement, the program aims to contribute to informed citizenship and national development.\r\n <\/p>\r\n <\/div>\r\n\r\n \r\n <div class=\"container\">\r\n \r\n <select class=\"mobile-tabs-dropdown\" id=\"mobileTabsDropdown\">\r\n <option value=\"about\">About Department<\/option>\r\n <option value=\"goals\">Goals of Department<\/option>\r\n <option value=\"structure\">Structure<\/option>\r\n <\/select>\r\n\r\n \r\n <div class=\"tabs-nav\">\r\n <button class=\"tab-button active\" data-tab=\"about\">\r\n <span class=\"tab-icon\">\u2139\ufe0f<\/span>\r\n <span>About Department<\/span>\r\n <\/button>\r\n <button class=\"tab-button\" data-tab=\"goals\">\r\n <span class=\"tab-icon\">\ud83c\udfaf<\/span>\r\n <span>Goals of Department<\/span>\r\n <\/button>\r\n <button class=\"tab-button\" data-tab=\"structure\">\r\n <span class=\"tab-icon\">\ud83c\udfd7\ufe0f<\/span>\r\n <span>Structure<\/span>\r\n <\/button>\r\n <\/div>\r\n\r\n \r\n <div class=\"content-area\">\r\n \r\n <div class=\"tab-content active\" id=\"about\">\r\n <h2>About Department<\/h2>\r\n <p>\r\n The Department of Geography and History is dedicated to advancing social science education through innovative teaching methods and practical applications. Our mission is to prepare competent educators who can effectively teach geographical and historical concepts while making complex societal issues accessible to students.\r\n <\/p>\r\n <p>\r\n Our faculty comprises experts in geography, history, and education who are committed to providing students with a comprehensive understanding of both subject matter and pedagogical approaches. We emphasize the connection between classroom knowledge and real-world challenges, including environmental change, cultural heritage, and civic education.\r\n <\/p>\r\n <p>\r\n The department maintains partnerships with educational institutions, museums, cultural organizations, and community groups, enabling our students to engage in meaningful projects that bridge theory and practice. Our research initiatives focus on improving social science education, developing new teaching methodologies, and addressing educational challenges in geography and history.\r\n <\/p>\r\n \r\n <h3>Career Opportunities<\/h3>\r\n <p>The following job opportunities are available because of the knowledge and skills gained through this program:<\/p>\r\n <div class=\"job-opportunities\">\r\n <div class=\"job-card\">\r\n <h3>Geography and\/or History Teacher<\/h3>\r\n <p>Educate students at various levels in geography and history based on subject specialization<\/p>\r\n <\/div>\r\n <div class=\"job-card\">\r\n <h3>Social Science Educator<\/h3>\r\n <p>Develop curriculum and educational materials for social science subjects<\/p>\r\n <\/div>\r\n <div class=\"job-card\">\r\n <h3>Educational Administrator<\/h3>\r\n <p>Lead educational institutions and social science programs<\/p>\r\n <\/div>\r\n <div class=\"job-card\">\r\n <h3>Researcher<\/h3>\r\n <p>Conduct studies in geographical, historical, or educational fields<\/p>\r\n <\/div>\r\n <div class=\"job-card\">\r\n <h3>Community Development Officer<\/h3>\r\n <p>Apply geographical and historical knowledge in community development<\/p>\r\n <\/div>\r\n <div class=\"job-card\">\r\n <h3>Cultural Heritage Consultant<\/h3>\r\n <p>Work with organizations to preserve and interpret cultural heritage<\/p>\r\n <\/div>\r\n <div class=\"job-card\">\r\n <h3>Civic Education Trainer<\/h3>\r\n <p>Develop and deliver civic education programs<\/p>\r\n <\/div>\r\n <\/div>\r\n <\/div>\r\n\r\n \r\n <div class=\"tab-content\" id=\"goals\">\r\n <h2>Goals of the Department<\/h2>\r\n <p>\r\n The Department of Geography and History has established the following goals to guide our educational mission and program development:\r\n <\/p>\r\n <ol class=\"goals-list\">\r\n <li>To prepare well-trained teachers for schools with deep knowledge of geography and history.<\/li>\r\n <li>To develop critical thinking and pedagogical skills among future teachers.<\/li>\r\n <li>To connect classroom learning with real-world challenges such as environmental change.<\/li>\r\n <li>To foster research in geography, history, and education that contributes to informed citizenship.<\/li>\r\n <\/ol>\r\n <\/div>\r\n\r\n \r\n <div class=\"tab-content\" id=\"structure\">\r\n <h2>Program Structure<\/h2>\r\n <p>\r\n The Geography and History Education program is structured to provide comprehensive training in both subject matter and pedagogical approaches. The curriculum includes the following components:\r\n <\/p>\r\n <table class=\"requirements-table\">\r\n <thead>\r\n <tr>\r\n <th>No<\/th>\r\n <th>Types of the Requirements<\/th>\r\n <th>Number of Courses<\/th>\r\n <th>Credit Hours<\/th>\r\n <\/tr>\r\n <\/thead>\r\n <tbody>\r\n <tr>\r\n <td>1<\/td>\r\n <td>University Requirement<\/td>\r\n <td>7<\/td>\r\n <td>21<\/td>\r\n <\/tr>\r\n <tr>\r\n <td>2<\/td>\r\n <td>Faculty Requirement<\/td>\r\n <td>12<\/td>\r\n <td>36<\/td>\r\n <\/tr>\r\n <tr>\r\n <td>3<\/td>\r\n <td>Department Requirement<\/td>\r\n <td>27<\/td>\r\n <td>81<\/td>\r\n <\/tr>\r\n <tr>\r\n <td>4<\/td>\r\n <td>Graduation Thesis<\/td>\r\n <td>1<\/td>\r\n <td>3<\/td>\r\n <\/tr>\r\n <tr>\r\n <td colspan=\"2\"><strong>Total<\/strong><\/td>\r\n <td><strong>47<\/strong><\/td>\r\n <td><strong>141<\/strong><\/td>\r\n <\/tr>\r\n <\/tbody>\r\n <\/table>\r\n <p style=\"margin-top: 20px;\">\r\n <span class=\"highlight\">Note:<\/span> The program emphasizes both theoretical knowledge and practical application, with courses designed to develop strong pedagogical skills alongside geographical and historical understanding.\r\n <\/p>\r\n <\/div>\r\n <\/div>\r\n <\/div>\r\n\r\n <script>\r\n \/\/ Tab functionality\r\n const tabButtons = document.querySelectorAll('.tab-button');\r\n const tabContents = document.querySelectorAll('.tab-content');\r\n const mobileDropdown = document.getElementById('mobileTabsDropdown');\r\n\r\n function activateTab(tabName) {\r\n \/\/ Remove active class from all buttons and contents\r\n tabButtons.forEach(btn => btn.classList.remove('active'));\r\n tabContents.forEach(content => content.classList.remove('active'));\r\n\r\n \/\/ Add active class to clicked button and corresponding content\r\n document.querySelector(`.tab-button[data-tab=\"${tabName}\"]`).classList.add('active');\r\n document.getElementById(tabName).classList.add('active');\r\n \r\n \/\/ Update mobile dropdown value\r\n if (mobileDropdown) {\r\n mobileDropdown.value = tabName;\r\n }\r\n }\r\n\r\n \/\/ Desktop tab button functionality\r\n tabButtons.forEach(button => {\r\n button.addEventListener('click', () => {\r\n const tabName = button.getAttribute('data-tab');\r\n activateTab(tabName);\r\n });\r\n });\r\n\r\n \/\/ Mobile dropdown functionality\r\n if (mobileDropdown) {\r\n mobileDropdown.addEventListener('change', () => {\r\n const tabName = mobileDropdown.value;\r\n activateTab(tabName);\r\n \r\n \/\/ Scroll to content on mobile\r\n if (window.innerWidth <= 768) {\r\n document.querySelector('.content-area').scrollIntoView({ \r\n behavior: 'smooth',\r\n block: 'start'\r\n });\r\n }\r\n });\r\n }\r\n\r\n \/\/ Keyboard navigation for desktop\r\n tabButtons.forEach((button, index) => {\r\n button.addEventListener('keydown', (e) => {\r\n let nextIndex;\r\n if (e.key === 'ArrowDown' || e.key === 'ArrowRight') {\r\n nextIndex = (index + 1) % tabButtons.length;\r\n tabButtons[nextIndex].focus();\r\n tabButtons[nextIndex].click();\r\n } else if (e.key === 'ArrowUp' || e.key === 'ArrowLeft') {\r\n nextIndex = (index - 1 + tabButtons.length) % tabButtons.length;\r\n tabButtons[nextIndex].focus();\r\n tabButtons[nextIndex].click();\r\n }\r\n });\r\n });\r\n <\/script>\r\n<\/body>\r\n<\/html>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t","protected":false},"excerpt":{"rendered":"<p>Department of Geography and History Department of Geography and History There is a critical need for well-trained teachers in geography and history to develop and promote education in these fields due to their relevance to contemporary societal issues. This program emphasizes the training of effective educators with strong foundations in geographical understanding and historical analysis, […]<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"footnotes":""},"class_list":["post-252","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/rsu.edu.so\/index.php\/wp-json\/wp\/v2\/pages\/252","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/rsu.edu.so\/index.php\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/rsu.edu.so\/index.php\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/rsu.edu.so\/index.php\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/rsu.edu.so\/index.php\/wp-json\/wp\/v2\/comments?post=252"}],"version-history":[{"count":4,"href":"https:\/\/rsu.edu.so\/index.php\/wp-json\/wp\/v2\/pages\/252\/revisions"}],"predecessor-version":[{"id":353,"href":"https:\/\/rsu.edu.so\/index.php\/wp-json\/wp\/v2\/pages\/252\/revisions\/353"}],"wp:attachment":[{"href":"https:\/\/rsu.edu.so\/index.php\/wp-json\/wp\/v2\/media?parent=252"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}

\n\t\t\t\t

\n\t\t\t\t\t\r\n\r\n\r\n \r\n \r\n Department of Geography and History<\/title>\r\n <style>\r\n * {\r\n margin: 0;\r\n padding: 0;\r\n box-sizing: border-box;\r\n }\r\n\r\n :root {\r\n --primary-color: #8B4513;\r\n --accent-color: #DAA520;\r\n --dark-text: #1a1a1a;\r\n --light-bg: #f8f9fa;\r\n --border-color: #e0e0e0;\r\n --white: #ffffff;\r\n --icon-color: #000000;\r\n }\r\n\r\n body {\r\n font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;\r\n line-height: 1.6;\r\n color: var(--dark-text);\r\n background-color: var(--light-bg);\r\n }\r\n\r\n \/* Header Section *\/\r\n .header {\r\n background-color: var(--white);\r\n padding: 40px 20px;\r\n border-bottom: 3px solid var(--primary-color);\r\n text-align: center;\r\n margin-bottom: 40px;\r\n }\r\n\r\n .header h1 {\r\n font-size: 2.5rem;\r\n color: var(--primary-color);\r\n margin-bottom: 20px;\r\n font-weight: 700;\r\n }\r\n\r\n .header p {\r\n font-size: 1rem;\r\n color: var(--dark-text);\r\n text-align: justify;\r\n max-width: 900px;\r\n margin: 0 auto;\r\n line-height: 1.8;\r\n }\r\n\r\n \/* Main Container *\/\r\n .container {\r\n display: flex;\r\n max-width: 1200px;\r\n margin: 0 auto;\r\n gap: 30px;\r\n padding: 0 20px 40px;\r\n flex-wrap: wrap;\r\n }\r\n\r\n \/* Tabs Navigation *\/\r\n .tabs-nav {\r\n flex: 0 0 250px;\r\n display: flex;\r\n flex-direction: column;\r\n gap: 10px;\r\n }\r\n\r\n .tab-button {\r\n display: flex;\r\n align-items: center;\r\n gap: 12px;\r\n padding: 15px 20px;\r\n background-color: var(--white);\r\n border: 2px solid var(--border-color);\r\n border-left: 4px solid var(--primary-color);\r\n cursor: pointer;\r\n font-size: 0.95rem;\r\n font-weight: 500;\r\n color: var(--dark-text);\r\n transition: all 0.3s ease;\r\n border-radius: 4px;\r\n }\r\n\r\n \/* Desktop hover effect - text color changes to black *\/\r\n @media (hover: hover) and (pointer: fine) {\r\n .tab-button:hover {\r\n background-color: var(--light-bg);\r\n border-left-color: var(--accent-color);\r\n transform: translateX(5px);\r\n color: #000000;\r\n }\r\n }\r\n\r\n .tab-button.active {\r\n background-color: var(--primary-color);\r\n color: var(--white);\r\n border-left-color: var(--accent-color);\r\n box-shadow: 0 4px 12px rgba(139, 69, 19, 0.2);\r\n }\r\n\r\n .tab-icon {\r\n font-size: 1.3rem;\r\n color: var(--icon-color);\r\n width: 24px;\r\n text-align: center;\r\n }\r\n\r\n .tab-button.active .tab-icon {\r\n color: var(--accent-color);\r\n }\r\n\r\n \/* Mobile Dropdown *\/\r\n .mobile-tabs-dropdown {\r\n display: none;\r\n width: 100%;\r\n padding: 12px 15px;\r\n font-size: 1rem;\r\n border: 2px solid var(--primary-color);\r\n border-radius: 4px;\r\n background-color: var(--white);\r\n color: var(--dark-text);\r\n margin-bottom: 20px;\r\n cursor: pointer;\r\n }\r\n\r\n \/* Content Area *\/\r\n .content-area {\r\n flex: 1;\r\n min-width: 300px;\r\n }\r\n\r\n .tab-content {\r\n display: none;\r\n background-color: var(--white);\r\n padding: 40px;\r\n border-radius: 8px;\r\n box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);\r\n animation: fadeIn 0.3s ease;\r\n }\r\n\r\n .tab-content.active {\r\n display: block;\r\n }\r\n\r\n @keyframes fadeIn {\r\n from {\r\n opacity: 0;\r\n transform: translateY(10px);\r\n }\r\n to {\r\n opacity: 1;\r\n transform: translateY(0);\r\n }\r\n }\r\n\r\n .tab-content h2 {\r\n color: var(--primary-color);\r\n font-size: 1.8rem;\r\n margin-bottom: 20px;\r\n border-bottom: 3px solid var(--accent-color);\r\n padding-bottom: 10px;\r\n }\r\n\r\n .tab-content p {\r\n text-align: justify;\r\n margin-bottom: 15px;\r\n line-height: 1.8;\r\n color: var(--dark-text);\r\n }\r\n\r\n .tab-content ul {\r\n margin-left: 20px;\r\n margin-bottom: 15px;\r\n }\r\n\r\n .tab-content li {\r\n margin-bottom: 10px;\r\n text-align: justify;\r\n }\r\n\r\n \/* Table Styles *\/\r\n .requirements-table {\r\n width: 100%;\r\n border-collapse: collapse;\r\n margin-top: 20px;\r\n overflow-x: auto;\r\n }\r\n\r\n .requirements-table thead {\r\n background-color: var(--primary-color);\r\n color: var(--white);\r\n }\r\n\r\n .requirements-table th {\r\n padding: 15px;\r\n text-align: left;\r\n font-weight: 600;\r\n border: 1px solid var(--border-color);\r\n }\r\n\r\n .requirements-table td {\r\n padding: 12px 15px;\r\n border: 1px solid var(--border-color);\r\n text-align: left;\r\n }\r\n\r\n .requirements-table tbody tr:nth-child(even) {\r\n background-color: #f8f2eb;\r\n }\r\n\r\n .requirements-table tbody tr:hover {\r\n background-color: #f0e6d8;\r\n }\r\n\r\n .requirements-table tbody tr:nth-child(odd) {\r\n background-color: var(--white);\r\n }\r\n\r\n .highlight {\r\n color: var(--primary-color);\r\n font-weight: 600;\r\n }\r\n\r\n .job-opportunities {\r\n display: grid;\r\n grid-template-columns: repeat(auto-fill, minmax(250px, 1fr));\r\n gap: 15px;\r\n margin: 20px 0;\r\n }\r\n\r\n .job-card {\r\n background-color: #f8f2eb;\r\n padding: 15px;\r\n border-radius: 8px;\r\n border-left: 4px solid var(--accent-color);\r\n box-shadow: 0 2px 5px rgba(0,0,0,0.1);\r\n }\r\n\r\n .job-card h3 {\r\n color: var(--primary-color);\r\n margin-bottom: 10px;\r\n }\r\n\r\n .goals-list {\r\n counter-reset: goal-counter;\r\n list-style-type: none;\r\n margin-left: 0;\r\n }\r\n\r\n .goals-list li {\r\n margin-bottom: 20px;\r\n padding-left: 40px;\r\n position: relative;\r\n }\r\n\r\n .goals-list li:before {\r\n counter-increment: goal-counter;\r\n content: counter(goal-counter);\r\n position: absolute;\r\n left: 0;\r\n top: 0;\r\n background-color: var(--primary-color);\r\n color: var(--white);\r\n width: 30px;\r\n height: 30px;\r\n border-radius: 50%;\r\n display: flex;\r\n align-items: center;\r\n justify-content: center;\r\n font-weight: bold;\r\n }\r\n\r\n \/* Enhanced Responsive Design *\/\r\n @media (max-width: 1024px) {\r\n .container {\r\n gap: 20px;\r\n }\r\n \r\n .tabs-nav {\r\n flex: 0 0 220px;\r\n }\r\n \r\n .tab-button {\r\n padding: 14px 18px;\r\n font-size: 0.9rem;\r\n }\r\n \r\n .tab-content {\r\n padding: 30px;\r\n }\r\n }\r\n\r\n @media (max-width: 768px) {\r\n .header h1 {\r\n font-size: 1.8rem;\r\n }\r\n\r\n .container {\r\n flex-direction: column;\r\n gap: 20px;\r\n }\r\n\r\n \/* Show mobile dropdown and hide regular tabs *\/\r\n .mobile-tabs-dropdown {\r\n display: block;\r\n }\r\n \r\n .tabs-nav {\r\n display: none;\r\n }\r\n\r\n .tab-content {\r\n padding: 25px;\r\n }\r\n\r\n .tab-content h2 {\r\n font-size: 1.4rem;\r\n }\r\n\r\n .requirements-table {\r\n font-size: 0.9rem;\r\n }\r\n\r\n .requirements-table th, .requirements-table td {\r\n padding: 10px;\r\n }\r\n\r\n .job-opportunities {\r\n grid-template-columns: 1fr;\r\n }\r\n }\r\n\r\n @media (max-width: 480px) {\r\n .header {\r\n padding: 25px 15px;\r\n }\r\n\r\n .header h1 {\r\n font-size: 1.5rem;\r\n }\r\n\r\n .header p {\r\n font-size: 0.9rem;\r\n }\r\n\r\n .container {\r\n padding: 0 15px 30px;\r\n }\r\n\r\n .tab-content {\r\n padding: 20px;\r\n }\r\n\r\n .tab-content h2 {\r\n font-size: 1.2rem;\r\n }\r\n\r\n .requirements-table {\r\n font-size: 0.8rem;\r\n }\r\n\r\n .requirements-table th, .requirements-table td {\r\n padding: 8px;\r\n }\r\n \r\n \/* Stack table columns on very small screens *\/\r\n @media (max-width: 360px) {\r\n .requirements-table {\r\n display: block;\r\n overflow-x: auto;\r\n white-space: nowrap;\r\n }\r\n }\r\n }\r\n\r\n \/* Touch device optimizations *\/\r\n @media (hover: none) and (pointer: coarse) {\r\n .tab-button {\r\n padding: 16px 20px;\r\n }\r\n \r\n .tab-button:active {\r\n background-color: var(--light-bg);\r\n border-left-color: var(--accent-color);\r\n }\r\n }\r\n <\/style>\r\n<\/head>\r\n<body>\r\n \r\n <div class=\"header\">\r\n <h1>Department of Geography and History<\/h1>\r\n <p>\r\n There is a critical need for well-trained teachers in geography and history to develop and promote education in these fields due to their relevance to contemporary societal issues. This program emphasizes the training of effective educators with strong foundations in geographical understanding and historical analysis, combined with pedagogical skills and critical thinking. Graduates of the program will be equipped with the academic and instructional competencies necessary to connect classroom knowledge with real-world challenges, such as environmental change, cultural heritage, civic education, and historical awareness. By fostering research and community engagement, the program aims to contribute to informed citizenship and national development.\r\n <\/p>\r\n <\/div>\r\n\r\n \r\n <div class=\"container\">\r\n \r\n <select class=\"mobile-tabs-dropdown\" id=\"mobileTabsDropdown\">\r\n <option value=\"about\">About Department<\/option>\r\n <option value=\"goals\">Goals of Department<\/option>\r\n <option value=\"structure\">Structure<\/option>\r\n <\/select>\r\n\r\n \r\n <div class=\"tabs-nav\">\r\n <button class=\"tab-button active\" data-tab=\"about\">\r\n <span class=\"tab-icon\">\u2139\ufe0f<\/span>\r\n <span>About Department<\/span>\r\n <\/button>\r\n <button class=\"tab-button\" data-tab=\"goals\">\r\n <span class=\"tab-icon\">\ud83c\udfaf<\/span>\r\n <span>Goals of Department<\/span>\r\n <\/button>\r\n <button class=\"tab-button\" data-tab=\"structure\">\r\n <span class=\"tab-icon\">\ud83c\udfd7\ufe0f<\/span>\r\n <span>Structure<\/span>\r\n <\/button>\r\n <\/div>\r\n\r\n \r\n <div class=\"content-area\">\r\n \r\n <div class=\"tab-content active\" id=\"about\">\r\n <h2>About Department<\/h2>\r\n <p>\r\n The Department of Geography and History is dedicated to advancing social science education through innovative teaching methods and practical applications. Our mission is to prepare competent educators who can effectively teach geographical and historical concepts while making complex societal issues accessible to students.\r\n <\/p>\r\n <p>\r\n Our faculty comprises experts in geography, history, and education who are committed to providing students with a comprehensive understanding of both subject matter and pedagogical approaches. We emphasize the connection between classroom knowledge and real-world challenges, including environmental change, cultural heritage, and civic education.\r\n <\/p>\r\n <p>\r\n The department maintains partnerships with educational institutions, museums, cultural organizations, and community groups, enabling our students to engage in meaningful projects that bridge theory and practice. Our research initiatives focus on improving social science education, developing new teaching methodologies, and addressing educational challenges in geography and history.\r\n <\/p>\r\n \r\n <h3>Career Opportunities<\/h3>\r\n <p>The following job opportunities are available because of the knowledge and skills gained through this program:<\/p>\r\n <div class=\"job-opportunities\">\r\n <div class=\"job-card\">\r\n <h3>Geography and\/or History Teacher<\/h3>\r\n <p>Educate students at various levels in geography and history based on subject specialization<\/p>\r\n <\/div>\r\n <div class=\"job-card\">\r\n <h3>Social Science Educator<\/h3>\r\n <p>Develop curriculum and educational materials for social science subjects<\/p>\r\n <\/div>\r\n <div class=\"job-card\">\r\n <h3>Educational Administrator<\/h3>\r\n <p>Lead educational institutions and social science programs<\/p>\r\n <\/div>\r\n <div class=\"job-card\">\r\n <h3>Researcher<\/h3>\r\n <p>Conduct studies in geographical, historical, or educational fields<\/p>\r\n <\/div>\r\n <div class=\"job-card\">\r\n <h3>Community Development Officer<\/h3>\r\n <p>Apply geographical and historical knowledge in community development<\/p>\r\n <\/div>\r\n <div class=\"job-card\">\r\n <h3>Cultural Heritage Consultant<\/h3>\r\n <p>Work with organizations to preserve and interpret cultural heritage<\/p>\r\n <\/div>\r\n <div class=\"job-card\">\r\n <h3>Civic Education Trainer<\/h3>\r\n <p>Develop and deliver civic education programs<\/p>\r\n <\/div>\r\n <\/div>\r\n <\/div>\r\n\r\n \r\n <div class=\"tab-content\" id=\"goals\">\r\n <h2>Goals of the Department<\/h2>\r\n <p>\r\n The Department of Geography and History has established the following goals to guide our educational mission and program development:\r\n <\/p>\r\n <ol class=\"goals-list\">\r\n <li>To prepare well-trained teachers for schools with deep knowledge of geography and history.<\/li>\r\n <li>To develop critical thinking and pedagogical skills among future teachers.<\/li>\r\n <li>To connect classroom learning with real-world challenges such as environmental change.<\/li>\r\n <li>To foster research in geography, history, and education that contributes to informed citizenship.<\/li>\r\n <\/ol>\r\n <\/div>\r\n\r\n \r\n <div class=\"tab-content\" id=\"structure\">\r\n <h2>Program Structure<\/h2>\r\n <p>\r\n The Geography and History Education program is structured to provide comprehensive training in both subject matter and pedagogical approaches. The curriculum includes the following components:\r\n <\/p>\r\n <table class=\"requirements-table\">\r\n <thead>\r\n <tr>\r\n <th>No<\/th>\r\n <th>Types of the Requirements<\/th>\r\n <th>Number of Courses<\/th>\r\n <th>Credit Hours<\/th>\r\n <\/tr>\r\n <\/thead>\r\n <tbody>\r\n <tr>\r\n <td>1<\/td>\r\n <td>University Requirement<\/td>\r\n <td>7<\/td>\r\n <td>21<\/td>\r\n <\/tr>\r\n <tr>\r\n <td>2<\/td>\r\n <td>Faculty Requirement<\/td>\r\n <td>12<\/td>\r\n <td>36<\/td>\r\n <\/tr>\r\n <tr>\r\n <td>3<\/td>\r\n <td>Department Requirement<\/td>\r\n <td>27<\/td>\r\n <td>81<\/td>\r\n <\/tr>\r\n <tr>\r\n <td>4<\/td>\r\n <td>Graduation Thesis<\/td>\r\n <td>1<\/td>\r\n <td>3<\/td>\r\n <\/tr>\r\n <tr>\r\n <td colspan=\"2\"><strong>Total<\/strong><\/td>\r\n <td><strong>47<\/strong><\/td>\r\n <td><strong>141<\/strong><\/td>\r\n <\/tr>\r\n <\/tbody>\r\n <\/table>\r\n <p style=\"margin-top: 20px;\">\r\n <span class=\"highlight\">Note:<\/span> The program emphasizes both theoretical knowledge and practical application, with courses designed to develop strong pedagogical skills alongside geographical and historical understanding.\r\n <\/p>\r\n <\/div>\r\n <\/div>\r\n <\/div>\r\n\r\n <script>\r\n \/\/ Tab functionality\r\n const tabButtons = document.querySelectorAll('.tab-button');\r\n const tabContents = document.querySelectorAll('.tab-content');\r\n const mobileDropdown = document.getElementById('mobileTabsDropdown');\r\n\r\n function activateTab(tabName) {\r\n \/\/ Remove active class from all buttons and contents\r\n tabButtons.forEach(btn => btn.classList.remove('active'));\r\n tabContents.forEach(content => content.classList.remove('active'));\r\n\r\n \/\/ Add active class to clicked button and corresponding content\r\n document.querySelector(`.tab-button[data-tab=\"${tabName}\"]`).classList.add('active');\r\n document.getElementById(tabName).classList.add('active');\r\n \r\n \/\/ Update mobile dropdown value\r\n if (mobileDropdown) {\r\n mobileDropdown.value = tabName;\r\n }\r\n }\r\n\r\n \/\/ Desktop tab button functionality\r\n tabButtons.forEach(button => {\r\n button.addEventListener('click', () => {\r\n const tabName = button.getAttribute('data-tab');\r\n activateTab(tabName);\r\n });\r\n });\r\n\r\n \/\/ Mobile dropdown functionality\r\n if (mobileDropdown) {\r\n mobileDropdown.addEventListener('change', () => {\r\n const tabName = mobileDropdown.value;\r\n activateTab(tabName);\r\n \r\n \/\/ Scroll to content on mobile\r\n if (window.innerWidth <= 768) {\r\n document.querySelector('.content-area').scrollIntoView({ \r\n behavior: 'smooth',\r\n block: 'start'\r\n });\r\n }\r\n });\r\n }\r\n\r\n \/\/ Keyboard navigation for desktop\r\n tabButtons.forEach((button, index) => {\r\n button.addEventListener('keydown', (e) => {\r\n let nextIndex;\r\n if (e.key === 'ArrowDown' || e.key === 'ArrowRight') {\r\n nextIndex = (index + 1) % tabButtons.length;\r\n tabButtons[nextIndex].focus();\r\n tabButtons[nextIndex].click();\r\n } else if (e.key === 'ArrowUp' || e.key === 'ArrowLeft') {\r\n nextIndex = (index - 1 + tabButtons.length) % tabButtons.length;\r\n tabButtons[nextIndex].focus();\r\n tabButtons[nextIndex].click();\r\n }\r\n });\r\n });\r\n <\/script>\r\n<\/body>\r\n<\/html>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t","protected":false},"excerpt":{"rendered":"<p>Department of Geography and History Department of Geography and History There is a critical need for well-trained teachers in geography and history to develop and promote education in these fields due to their relevance to contemporary societal issues. This program emphasizes the training of effective educators with strong foundations in geographical understanding and historical analysis, […]<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"footnotes":""},"class_list":["post-252","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/rsu.edu.so\/index.php\/wp-json\/wp\/v2\/pages\/252","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/rsu.edu.so\/index.php\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/rsu.edu.so\/index.php\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/rsu.edu.so\/index.php\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/rsu.edu.so\/index.php\/wp-json\/wp\/v2\/comments?post=252"}],"version-history":[{"count":4,"href":"https:\/\/rsu.edu.so\/index.php\/wp-json\/wp\/v2\/pages\/252\/revisions"}],"predecessor-version":[{"id":353,"href":"https:\/\/rsu.edu.so\/index.php\/wp-json\/wp\/v2\/pages\/252\/revisions\/353"}],"wp:attachment":[{"href":"https:\/\/rsu.edu.so\/index.php\/wp-json\/wp\/v2\/media?parent=252"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}