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

<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">

    <title>Retret Komunitas 2025</title>

    <!--== Favicon ==-->
    <link rel="shortcut icon" href="assets/img/favicon.ico" type="image/x-icon">

    <!--== Google Fonts ==-->
    <link href="https://fonts.googleapis.com/css?family=Poppins:300,400,400i,500,600,700,800" rel="stylesheet">
    <link href="https://fonts.googleapis.com/css?family=Big+Shoulders+Display:300,400,500,600,700,800,900" rel="stylesheet">

    <!--== Bootstrap CSS ==-->
    <link href="assets/css/bootstrap.min.css" rel="stylesheet">
    <!--== Headroom CSS ==-->
    <link href="assets/css/headroom.css" rel="stylesheet">
    <!--== Animate CSS ==-->
    <link href="assets/css/animate.min.css" rel="stylesheet">
    <!--== Font Awesome Icon CSS ==-->
    <link href="assets/css/font-awesome.min.css" rel="stylesheet">
    <!--== LaStudio Icon CSS ==-->
    <link href="assets/css/lastudioIcons-icons.css" rel="stylesheet">
    <!--== Simple Line Icons PRO CSS ==-->
    <link href="assets/css/simple-line-icons.css" rel="stylesheet">
    <!--== Swiper CSS ==-->
    <link href="assets/css/swiper.min.css" rel="stylesheet">
    <!--== Fancybox Min CSS ==-->
    <link href="assets/css/fancybox.min.css" rel="stylesheet">
    <!--== Slicknav Min CSS ==-->
    <link href="assets/css/slicknav.css" rel="stylesheet">
    <!--== Aos Min CSS ==-->
    <link href="assets/css/aos.min.css" rel="stylesheet">


    <!--== Main Style CSS ==-->
    <link href="assets/css/style.min.css" rel="stylesheet">

    <!--[if lt IE 9]>
    <script src="//oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script>
    <script src="//oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
    <![endif]-->
</head>

<body>

    <!--wrapper start-->
    <div class="wrapper">

        <!--== Start Preloader Content ==-->
        <div class="preloader-wrap">
            <div class="preloader">
                <span class="dot"></span>
                <span class="dot dot-clone"></span>
            </div>
        </div>
        <!--== End Preloader Content ==-->

        <!--== Start Header Wrapper ==-->
        <header class="header-area header-default">
            <div class="container-fluid">
                <div class="row no-gutter align-items-center position-relative">
                    <div class="col">
                        <div class="header-logo-area">
                            <a href="/">
                                <img class="logo-main" src="assets/img/logo-light.png" alt="Logo">
                                <img class="logo" src="assets/img/logo-dark.png" alt="Logo">
                            </a>
                        </div>
                    </div>
                    <div class="col">
                        <div class="header-navigation-area">
                            <ul class="main-menu nav">
                                <li class="has-submenu"><a href="/"><span>Home</span></a>
                                </li>
                                <li class="has-submenu"><a href="/retret"><span>Bahan Retret</span></a>
                                    <ul class="submenu-nav">
                                        <li><a href="day1">Day 1</a></li>
                                        <li><a href="day2">Day 2</a></li>
                                        <li><a href="day3">Day 3</a></li>
                                        <li><a href="day4">Day 4</a></li>
                                        <li><a href="day5">Day 5</a></li>
                                        <li><a href="day6">Day 6</a></li>
                                        <li><a href="day7">Day 7</a></li>
                                        <li><a href="day8">Day 8</a></li>
                                    </ul>
                                </li>
                                <li class="has-submenu"><a href="/bahan"><span>Teks Doa</span></a>
                                    <ul class="submenu-nav">
                                        <li><a href="bahan1">Bahan Hari 1</a></li>
                                        <li><a href="bahan2">Bahan Hari 2</a></li>
                                        <li><a href="bahan3">Bahan Hari 3</a></li>
                                        <li><a href="bahan4">Bahan Hari 4</a></li>
                                        <li><a href="bahan5">Bahan Hari 5</a></li>
                                        <li><a href="bahan6">Bahan Hari 6</a></li>
                                        <li><a href="bahan7">Bahan Hari 7</a></li>
                                        <li><a href="bahan8">Bahan Hari 8</a></li>
                                    </ul>
                                </li>
                                <li class="has-submenu"><a href="/retret"><span>Lampiran</span></a>
                                    <ul class="submenu-nav">
                                        <li><a href="historis">Konteks Historis FI</a></li>
                                        <li><a href="percakapan">Percakapan Rohani</a></li>
                                        <li><a href="muda">Doa bagi Kaum Muda</a></li>
                                        <li><a href="panggilan">Doa Mohon Panggilan</a></li>
                                        <li><a href="yubileum">Doa Tahun Yubileum</a></li>
                                        <li><a href="sumber">Sumber & Dokumen Tambahan</a></li>
                                    </ul>
                                </li>

                            </ul>
                        </div>
                    </div>
                    <div class="col">
                        <div class="header-action-area">
                            <div class="btn-box">

                                <div class="aside-menu-wrap-btn">
                                    <button class="btn-aside-menu"><i class="lastudioicon-menu-1"></i></button>
                                </div>
                            </div>
                        </div>
                        <div class="header-action off-canvas-wrapper-btn-style2">
                            <button class="btn-menu" type="button"><i class="lastudioicon-menu-4-1"></i></button>
                        </div>
                    </div>
                </div>
            </div>
        </header>
        <!--== End Header Wrapper ==-->

        <main class="main-content">




            <?= $this->renderSection('content'); ?>

            <!--== Start Footer Area Wrapper ==-->
            <footer class="footer-area">
                <div>
                    <br>
                </div>

                <!--== Start Footer Bottom ==-->
                <div class="footer-bottom">
                    <div class="container">
                        <div class="row">
                            <div class="col-12">
                                <p class="copyright">© 2025 <span>JesuitIndonesia</span>.</p>
                            </div>
                        </div>
                    </div>
                </div>
                <!--== End Footer Bottom ==-->
            </footer>
            <!--== End Footer Area Wrapper ==-->

            <!--== Scroll Top Button ==-->
            <div id="scroll-to-top" class="scroll-to-top"><span class="fa fa-angle-up"></span></div>

            <!--== Start Side Menu ==-->
            <aside class="off-canvas-wrapper">
                <div class="off-canvas-inner">
                    <div class="off-canvas-overlay"></div>
                    <!-- Start Off Canvas Content Wrapper -->
                    <div class="off-canvas-content">
                        <!-- Off Canvas Header -->
                        <div class="off-canvas-header">
                            <div class="close-action">
                                <button class="btn-menu-close">menu <i class="fa fa-chevron-left"></i></button>
                            </div>
                        </div>

                        <div class="off-canvas-item">
                            <!-- Start Mobile Menu Wrapper -->
                            <div class="res-mobile-menu menu-active-one">
                                <!-- Note Content Auto Generate By Jquery From Main Menu -->
                            </div>
                            <!-- End Mobile Menu Wrapper -->
                        </div>
                    </div>
                    <!-- End Off Canvas Content Wrapper -->
                </div>
            </aside>
            <!--== End Side Menu ==-->

            <!--== Start Aside Menu ==-->
            <div class="aside-menu-wrap">
                <div class="aside-menu-inner">
                    <div class="btn-aside-menu-close"><i class="lastudioicon-e-remove"></i></div>
                    <div class="aside-menu-content">
                        <a href=""><img src="assets/img/logo-light.png" alt="Logo"></a>
                        <div class="aside-insta">
                            <div class="row">
                                <div class="col-4">
                                    <a href="#">
                                        <img src="assets/img/portfolio/01.jpg" alt="Portfolio">
                                    </a>
                                </div>
                                <div class="col-4">
                                    <a href="#">
                                        <img src="assets/img/portfolio/02.jpg" alt="Portfolio">
                                    </a>
                                </div>
                                <div class="col-4">
                                    <a href="#">
                                        <img src="assets/img/portfolio/03.jpg" alt="Portfolio">
                                    </a>
                                </div>
                                <div class="col-4">
                                    <a href="#">
                                        <img src="assets/img/portfolio/04.jpg" alt="Portfolio">
                                    </a>
                                </div>
                                <div class="col-4">
                                    <a href="#">
                                        <img src="assets/img/portfolio/05.jpg" alt="Portfolio">
                                    </a>
                                </div>
                                <div class="col-4">
                                    <a href="#">
                                        <img src="assets/img/portfolio/06.jpg" alt="Portfolio">
                                    </a>
                                </div>
                            </div>
                        </div>
                        <div class="aside-menu-bottom">
                            <div class="aside-menu-info">
                                <ul>
                                    <li><i class="lastudioicon-pin-3-1"></i> <a href=>Argopuro 24, Semarang</a></li>
                                    <li><i class="lastudioicon-email"></i> <a href="mailto:archivarist@jesuits.id">Jesuit Indonesia</a></li>
                                    <li><i class="lastudioicon-phone-1"></i> <a href="">(024) 483 15004</a></li>
                                </ul>
                            </div>
                            <div class="social-icons">
                                <a href="#"><i class="lastudioicon-b-facebook"></i></a>
                                <a href="#"><i class="lastudioicon-b-twitter"></i></a>
                                <a href="#"><i class="lastudioicon-b-pinterest-circled"></i></a>
                                <a href="#"><i class="lastudioicon-b-instagram"></i></a>
                            </div>
                            <div class="thumb">
                                <a href="#"><img src="assets/img/photos/aside-banner.jpg" alt="Banner"></a>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            <!--== End Aside Menu ==-->
    </div>

    <!--=======================Javascript============================-->

    <!--=== jQuery Modernizr Min Js ===-->
    <script src="assets/js/modernizr.js"></script>
    <!--=== jQuery Min Js ===-->
    <script src="assets/js/jquery-main.js"></script>
    <!--=== jQuery Migration Min Js ===-->
    <script src="assets/js/jquery-migrate.js"></script>
    <!--=== jQuery Popper Min Js ===-->
    <script src="assets/js/popper.min.js"></script>
    <!--=== jQuery Bootstrap Min Js ===-->
    <script src="assets/js/bootstrap.min.js"></script>
    <!--=== jQuery Appear Js ===-->
    <script src="assets/js/jquery.appear.js"></script>
    <!--=== jQuery Headroom Min Js ===-->
    <script src="assets/js/headroom.min.js"></script>
    <!--=== jQuery Some Custom Js ===-->
    <script src="assets/js/some-custom.js"></script>
    <!--=== jQuery Swiper Min Js ===-->
    <script src="assets/js/swiper.min.js"></script>
    <!--=== jQuery Fancybox Min Js ===-->
    <script src="assets/js/fancybox.min.js"></script>
    <!--=== jQuery Slick Nav Js ===-->
    <script src="assets/js/slicknav.js"></script>
    <!--=== jQuery Waypoint Js ===-->
    <script src="assets/js/waypoint.js"></script>
    <!--=== jQuery Parallax Min Js ===-->
    <script src="assets/js/parallax.min.js"></script>
    <!--=== jQuery Aos Min Js ===-->
    <script src="assets/js/aos.min.js"></script>
    <!--=== jQuery Isotope Min Js ===-->
    <script src="assets/js/isotope.pkgd.min.js"></script>
    <!--=== jQuery Vivus Min Js ===-->
    <script src="assets/js/vivus.js"></script>

    <!--=== jQuery Custom Js ===-->
    <script src="assets/js/custom.min.js"></script>




</body>

</html>