<!-- Menü -->
 <nav class="navbar navbar-expand-md navbar-light bg-light sticky-top">
   <div class="container-fluid">
        <a class="navbar-brand" href="#"><img src="https://bit.ly/31TKrBI" alt=""></a>
        <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarResponsive">
            <span class="navbar-toggler-icon"></span>
        </button>
        <div class="collapse navbar-collapse" id="navbarResponsive">
            <ul class="navbar-nav ml-auto">
                <li class="nav-item">
                    <a href="#" class="nav-link active">Anasayfa</a>
                </li>
                <li class="nav-item">
                    <a href="#" class="nav-link">Hakkımızda</a>
                </li>
                <li class="nav-item">
                    <a href="#" class="nav-link">Hizmetlerimiz</a>
                </li>
                <li class="nav-item">
                    <a href="#" class="nav-link">Avukatlarımız</a>
                </li>
                <li class="nav-item">
                    <a href="#" class="nav-link">İletişim</a>
                </li>
            </ul>
        </div>
    </div>
</nav>

<!-- Slider -->
<div id="slides" class="carousel slide" data-ride="carousel">
        <ul class="carousel-indicators">
            <li data-target="#slides" data-slide-to="0" class="active"></li>
            <li data-target="#slides" data-slide-to="1"></li>
            <li data-target="#slides" data-slide-to="2"></li>
        </ul>
        <div class="carousel-inner">
            <div class="carousel-item active">
                <img src="https://bit.ly/2Z9zQko" alt="slide 1">
              <div class="carousel-caption d-none d-lg-block">
                    <h1 class="display-2">Hukuk Bürosu</h1>
                    <h3>Avukatlık - Hukuki Danışmanlık</h3>
                    <button type="button" class="btn btn-outline-light btn-lg">Bize Ulaşın</button>
                    <button type="button" class="btn btn-info btn-lg">Kurumsal</button>
                </div>
            </div>
            <div class="carousel-item">
                <img src="https://bit.ly/2Z5WI41" alt="slide 2">
            </div>
            <div class="carousel-item">
                <img src="https://bit.ly/2Cc1JiH" alt="slide 3">
            </div>
        </div>
</div>

<!--Jumbotron-->
    <div class="container-fluid">
        <div class="row jumbotron bg-info text-light">
            <div class="col-sm-9 col-xl-10">
                <p class="lead">
                    Bugün, geniş bir çerçevede hukuk hizmeti vererek, en verimli şekilde çözüme ulaşmak amacıyla çalışma
                    alanlarına göre uzmanlaşmış departmanlara ayrılarak organize olmuş bulunmaktayız. Farklı hukuk
                    alanlarında uzmanlaşmış bir danışman kadrosuna ve dünya dinamizmini yansıtan güçlü bir müvekkil
                    ağına sahibiz.
                </p>
            </div>
            <div class="col-sm-3 col-xl-2">
                <a href="#"><button type="button" class="btn btn-outline-light btn-lg">Ekibimiz</button></a>
            </div>
        </div>
</div>

<!--Hukuk Bürosu Bölümü-->
    <div class="container-fluid p-5">
        <div class="row hukukburosu text-center">
            <div class="col-12">
                <h1 class="display-4">Hukuk Bürosu</h1>
            </div>
            <hr>
            <div class="col-12">
                <p class="lead">Avukatlık meslek ahlâkına ve profesyonelliğe uygun olarak müvekkillerimize hizmet etmek
                    amacıyla var olan bir hukuk kurumuyuz. Bu çerçevede; görüşmelerimiz ve çalışmalarımız esnasında
                    edindiğimiz her türlü kişisel ve kurumsal bilgiler bizim için saklanması gereken bir sırdır.</p>
            </div>
        </div>
    </div>

    <!--Üç Sütunlu Bölüm-->
    <div class="container-fluid">
        <div class="row text-center pb-5">
            <div class="col-12 col-sm-6 col-md-4">
                <i class="fas fa-bullseye text-info"></i>
                <h4>ÇÖZÜM ODAKLILIK</h4>
                <p>Kısa sürede sonuca götürecek, daha etkin ve alternatif çözüm yolları sunuyoruz.</p>
            </div>
            <div class="col-12 col-sm-6 col-md-4">
                <i class="fas fa-handshake text-info"></i>
                <h4>GÜVEN</h4>
                <p>Müvekkillerimiz ile aramızda güven ve sadakat ilişkisine önem veriyoruz.</p>
            </div>
            <div class="col-sm-12 col-md-4">
                <i class="fas fa-balance-scale text-info"></i>
                <h4>DÜRÜSTLÜK</h4>
                <p>Hukuki süreçte, doğru bilgiyi bütün riskleriyle dürüstçe müvekkillerimizle paylaşıyoruz.</p>
            </div>
        </div>
        <hr class="my-4">
</div>

<!--Yaklaşım Bölümü-->
     <div class="container-fluid py-5">
        <div class="row p-2">
            <div class="col-lg-6 p-3">
                <h2>Yaklaşım</h2>
                <hr>
                <p>Bizim yaklaşımımız, müvekkillerimizin gerçek ihtiyaçlarını ve amaçlarını tespit etmek üzere
                    odaklanmak ve onlara sunduğumuz kaliteli ve hızlı hizmet sayesinde müvekkillerimizle olan
                    ilişkilerimizin uzun süreli ve kalıcı olmasını sağlamaktır.</p>
                <p>Ortaklarımız, müvekkillerimize hem Türkiye'de hem de dünyanın birçok ülkesinde uluslararası düzeyde
                    tatmin edici bir hizmetin sunulmasını teminen, sadece müvekkil ile olan ilişkileri üstlenmekle
                    kalmayıp aynı zamanda verilen işin de tüm sorumluluğunu üstlenerek en uygun çözümleri sunmaktadır.
                </p>
                <p>Bizi diğerlerinden ayıran temel fark ise sadece avukat bakış açısı ile değil, uluslarası ve
                    profesyonel anlayışa sahip olan işadamlarının bakış açısıyla da düşünmeyi ve ona göre hareket etmeyi
                    becerebilme kabiliyetimizdir.</p>
                <a href="#" class="btn btn-info">Detaylı Bilgi</a>
            </div>
            <div class="col-lg-6 p-3 my-auto">
                <img src="https://bit.ly/2ZSPq2U" alt="lawyer" class="img-fluid img-thumbnail rounded">
            </div>
        </div>
    </div>

External CSS

  1. https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/4.5.0/css/bootstrap.min.css
  2. https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.13.1/css/all.min.css

External JavaScript

  1. https://cdnjs.cloudflare.com/ajax/libs/fontawesome-iconpicker/3.2.0/js/fontawesome-iconpicker.min.js
  2. https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/5.0.0-alpha1/js/bootstrap.min.js