<link href="/public/css/about-page-styles.css" rel="stylesheet">

<div class="bg-light">
    <div class="container py-5">
        <div class="row h-100 align-items-center py-5">
            <div class="col-lg-4 d-lg-block mb-4"><img src="/public/photo/about1.webp" class="img-fluid" alt=""></div>
            <div class="col-lg-8">
                <h1>
                    Biz Kimiz?
                </h1>
                <p class="lead mb-0">Biz mühendisler, geliştiriciler, araştırmacılar olarak her gün neredeyse
                    tamamen özgür yazılım araçlarıyla mesleğimizi yapıyor ve öğreniyoruz. İnternetin %90’ı özgür
                    yazılımlar sayesinde ayakta. Eğer bugün kullandığımız programlama dillerinin kaynak kodlarına açıp
                    bakabiliyorsak, kimseye hiçbir şey borçlu olmadan istediğimiz zaman ve istediğimiz kadar
                    kullanabiliyorsak bunu özgür yazılımlara borçluyuz. Sizlere özgür yazılımın önemini, faydalarını gösterebilmek ve bu
                    araçlarla geliştirebileceğimiz şeylerin sınırının olmadığını fark ettirebilmek amacıyla bu topluluğu
                    kurduk. Sizlere özgür yazılım bilincini kazandırdıktan sonra özgür yazılım teknolojilerini
                    kullanmayı öğretmek, sonra da sizinle beraber, özgür yazılım teknolojilerini kullanarak artık sınırın sadece hayal gücümüz olduğu
                    projeler geliştirmek istiyoruz.</p>
                <button id="signup-btn" class="btn btn-outline btn-lg mt-4" onclick="location.href='/enroll'" type="button">Üye Ol</button>
            </div>

        </div>
    </div>
</div>

<section class="bg-white py-5">
    <div class="container py-5">
        <div class="row align-items-center mb-5">
            <div class="col-lg-6 order-2 order-lg-1"><i class="fa fa-bar-chart fa-2x mb-3 text-primary"></i>
                <h2>0 Numaralı Özgürlük</h2>
                <p class="font-italic text-muted mb-4">Herhangi bir amaç için, istediğiniz şekilde yazılımı çalıştırma
                    özgürlüğü.</p>
            </div>
            <div class="col-lg-6 py-5 mx-auto order-1 order-lg-2"><img
                    src="/public/photo/about2.webp" alt="" class="img-fluid mb-4 mb-lg-0">

            </div>
        </div>
        <div class="row align-items-center">
            <div class="col-lg-6 px-5 mx-auto"><img src="/public/photo/about3.webp" alt=""
                    class="img-fluid mb-4 mb-lg-0"></div>
            <div class="col-lg-6"><i class="fa fa-leaf fa-2x mb-3 text-primary"></i>
                <h2>1 Numaralı Özgürlük</h2>
                <p class="font-italic text-muted mb-4">Her ne istiyorsanız onu yaptırmak için programın nasıl
                    çalıştığını ögrenmek ve onu değiştirme özgürlüğü. Yazılımın kaynak koduna ulaşmak, bu iş için ön
                    koşuldur.</p>
            </div>
        </div>
        <div class="row align-items-center mb-5">
            <div class="col-lg-6 order-2 order-lg-1"><i class="fa fa-bar-chart fa-2x mb-3 text-primary"></i>
                <h2>2 Numaralı Özgürlük</h2>
                <p class="font-italic text-muted mb-4">Kopyaları dağıtma özgürlüğü, böylece başkalarına da yardım
                    edebilirsiniz.</p>
            </div>
            <div class="col-lg-5 px-5 mx-auto order-1 order-lg-2"><img
                    src="/public/photo/about4.webp" alt="" class="img-fluid mb-4 mb-lg-0">
            </div>
        </div>
        <div class="row align-items-center">
            <div class="col-lg-6 px-5 mx-auto"><img src="/public/photo/about5.webp" class="img-fluid mb-4 mb-lg-0" alt=""></div>
            <div class="col-lg-6"><i class="fa fa-leaf fa-2x mb-3 text-primary"></i>
                <h2>3 Numaralı Özgürlük</h2>
                <p class="font-italic text-muted mb-4">Değiştirilmiş sürümlerinizin kopyalarını dağıtma özgürlüğü.
                    Böylece değişikliklerinizden yararlanması için tüm topluma bir şans vermiş
                    olursunuz. Kaynak koduna erişmek, bunun için bir ön koşuldur.</p>
            </div>
        </div>
    </div>
</section>

<section class="bg-light py-5">
    <div class="container py-5">
        <div class="row mb-4">
            <div class="col-lg-5">
                <h1>Yönetim Kurulu</h1>
                <p class="font-italic text-muted">2023-2024</p>
            </div>
        </div>

        <div class="row text-center justify-content-evenly">
            <!-- Team item-->
            <div class="col-xl-3 col-sm-6 mb-5">
                <div class="bg-white rounded shadow-sm py-5 px-4"><img
                            src="/public/photo/ilker.webp" alt="" width="150"
                            class="img-fluid rounded-circle mb-3 img-thumbnail shadow-sm">
                    <h5 class="mb-0">İlker Avcı</h5><span class="small text-uppercase text-muted">Başkan</span>
                    <ul class="social mb-0 list-inline mt-3">
                        <li class="list-inline-item"><a href="https://github.com/ikolomiko" class="social-link"><i class="bi bi-github"></i></a></li>
                        <li class="list-inline-item"><a href="https://www.linkedin.com/in/ikolomiko/" class="social-link"><i class="bi bi-linkedin"></i></a></li>
                    </ul>
                </div>
            </div>
            <!-- End-->

            <!-- Team item-->
            <div class="col-xl-3 col-sm-6 mb-5">
                <div class="bg-white rounded shadow-sm py-5 px-4"><img
                            src="/public/photo/arya.webp" alt="" width="150"
                            class="img-fluid rounded-circle mb-3 img-thumbnail shadow-sm">
                    <h5 class="mb-0">Arya Zeynep Mete</h5><span class="small text-uppercase text-muted">Başkan
                        Yardımcısı</span>
                    <ul class="social mb-0 list-inline mt-3">
                        <li class="list-inline-item"><a href="https://github.com/aryazeynep" class="social-link"><i class="bi bi-github"></i></a></li>
                        <li class="list-inline-item"><a href="https://www.linkedin.com/in/arya-zeynep-mete-a1a775216" class="social-link"><i class="bi bi-linkedin"></i></a></li>
                    </ul>
                </div>
            </div>
            <!-- End-->

            <!-- Team item-->
            <div class="col-xl-3 col-sm-6 mb-5">
                <div class="bg-white rounded shadow-sm py-5 px-4"><img
                            src="/public/photo/furkan.webp" alt="" width="150"
                            class="img-fluid rounded-circle mb-3 img-thumbnail shadow-sm">
                    <h5 class="mb-0">Furkan Şimşekli</h5><span class="small text-uppercase text-muted">Başkan Yardımcısı
                        </span>
                    <ul class="social mb-0 list-inline mt-3">
                        <li class="list-inline-item"><a href="https://github.com/furkansimsekli" class="social-link"><i class="bi bi-github"></i></a></li>
                        <li class="list-inline-item"><a href="https://www.linkedin.com/in/furkansimsekli/" class="social-link"><i class="bi bi-linkedin"></i></a></li>
                    </ul>
                </div>
            </div>
            <!-- End-->

            <!-- Team item-->
            <div class="col-xl-3 col-sm-6 mb-5">
                <div class="bg-white rounded shadow-sm py-5 px-4"><img
                            src="/public/photo/denizcan.webp" alt="" width="150"
                            class="img-fluid rounded-circle mb-3 img-thumbnail shadow-sm">
                    <h5 class="mb-0">Deniz Can Aksuoğlu</h5><span class="small text-uppercase text-muted">Genel Sekreter</span>
                    <ul class="social mb-0 list-inline mt-3">
                        <li class="list-inline-item"><a href="https://github.com/LinoxGH" class="social-link"><i class="bi bi-github"></i></a></li>
                    </ul>
                </div>
            </div>
            <!-- End-->

            <!-- Team item-->
            <div class="col-xl-3 col-sm-6 mb-5">
                <div class="bg-white rounded shadow-sm py-5 px-4"><img
                        src="/public/photo/bugra.webp" alt="" width="150"
                        class="img-fluid rounded-circle mb-3 img-thumbnail shadow-sm">
                    <h5 class="mb-0">Buğra Kağan Acar</h5><span class="small text-uppercase text-muted">Eğitim ve Arge Sorumlusu</span>
                    <ul class="social mb-0 list-inline mt-3">
                        <li class="list-inline-item"><a href="https://github.com/div72" class="social-link"><i class="bi bi-github"></i></a></li>
                    </ul>
                </div>
            </div>
            <!-- End-->

            <!-- Team item-->
            <div class="col-xl-3 col-sm-6 mb-5">
                <div class="bg-white rounded shadow-sm py-5 px-4"><img
                            src="/public/photo/barkin.webp" alt="" width="150"
                            class="img-fluid rounded-circle mb-3 img-thumbnail shadow-sm">
                    <h5 class="mb-0">Barkın Karahan</h5><span class="small text-uppercase text-muted">Kurumsal İlişkiler Sorumlusu
                    </span>
                    <ul class="social mb-0 list-inline mt-3">
                        <li class="list-inline-item"><a href="https://github.com/barkinkaraha" class="social-link"><i class="bi bi-github"></i></a></li>
                        <li class="list-inline-item"><a href="https://www.instagram.com/barkin_karahan" class="social-link"><i class="bi bi-instagram"></i></a></li>
                        <li class="list-inline-item"><a href="https://www.linkedin.com/in/bark%C4%B1n-karahan-48a3181b4" class="social-link"><i class="bi bi-linkedin"></i></a></li>
                    </ul>
                </div>
            </div>
            <!-- End-->

            <!-- Team item-->
            <div class="col-xl-3 col-sm-6 mb-5">
                <div class="bg-white rounded shadow-sm py-5 px-4"><img
                        src="/public/photo/eren.webp" alt="" width="150"
                        class="img-fluid rounded-circle mb-3 img-thumbnail shadow-sm">
                    <h5 class="mb-0">Eren Soykök</h5><span class="small text-uppercase text-muted">Mali İşler
                        Sorumlusu</span>
                    <ul class="social mb-0 list-inline mt-3">
                        <li class="list-inline-item"><a href="https://github.com/rentale" class="social-link"><i class="bi bi-github"></i></a></li>
                        <li class="list-inline-item"><a href="https://www.instagram.com/erensoykok/" class="social-link"><i class="bi bi-instagram"></i></a></li>
                        <li class="list-inline-item"><a href="https://www.linkedin.com/in/mehmeterensoykok/" class="social-link"><i class="bi bi-linkedin"></i></a></li>
                    </ul>
                </div>
            </div>
            <!-- End-->

            <!-- Team item-->
            <div class="col-xl-3 col-sm-6 mb-5">
                <div class="bg-white rounded shadow-sm py-5 px-4"><img
                        src="/public/photo/eyup.webp" alt="" width="150"
                        class="img-fluid rounded-circle mb-3 img-thumbnail shadow-sm">
                    <h5 class="mb-0">Eyüp Menevşe</h5><span class="small text-uppercase text-muted">Halkla İlişkiler
                        Sorumlusu</span>
                    <ul class="social mb-0 list-inline mt-3">
                        <li class="list-inline-item"><a href="https://github.com/FeverEclipse" class="social-link"><i class="bi bi-github"></i></a></li>
                        <li class="list-inline-item"><a href="https://www.linkedin.com/in/ey%C3%BCp-menev%C5%9Fe-67b61321a/" class="social-link"><i class="bi bi-linkedin"></i></a></li>
                    </ul>
                </div>
            </div>
            <!-- End-->

            <!-- Team item-->
            <div class="col-xl-3 col-sm-6 mb-5">
                <div class="bg-white rounded shadow-sm py-5 px-4"><img
                        src="/public/photo/ahmet.webp" alt="" width="150"
                        class="img-fluid rounded-circle mb-3 img-thumbnail shadow-sm">
                    <h5 class="mb-0">Ahmet Uman</h5><span class="small text-uppercase text-muted">Organizasyon
                        Sorumlusu</span>
                    <ul class="social mb-0 list-inline mt-3">
                        <li class="list-inline-item"><a href="https://github.com/ahmetuman" class="social-link"><i class="bi bi-instagram"></i></a></li>
                        <li class="list-inline-item"><a href="https://www.linkedin.com/in/ahmet-uman" class="social-link"><i class="bi bi-linkedin"></i></a></li>
                    </ul>
                </div>
            </div>
            <!-- End-->

        </div>
    </div>
</section>
