   <!-- Breadcrumb Area Start Here -->
   <section class="breadcrumbs-area" style="background-image: url('../assets/img/bg-page.jpg');">
    <div class="container">
        <div class="breadcrumbs-content">
            <h1>الألبومات</h1>
            <ul>
                <li>
                    <a href="index.php">الرئيسية</a> -</li>
                <li>الألبومات</li>
            </ul>
        </div>
    </div>
</section>
<!-- Breadcrumb Area End Here -->
<!-- Gallery Page Area Start Here -->
<section class="bg-body section-space-less4">
    <div class="container">

        <div class="topic-border color-cinnabar mb-30">
            <div class="topic-box-lg color-cinnabar"> ألبوم الصور</div>
            <div class="more-info-link">
                <a href="">المزيد
                    <i class="fa fa-angle-right" aria-hidden="true"></i>
                </a>
            </div>
        </div>
        <div class="row tab-space2 masonry-items">
         
            <div class="col-md-4 col-sm-6 col-12 masonry-item">
                <div class="gallery-layout-2 popup-icon-hover">
                    <div class="img-overlay-70 event-img">
                        <a class="" href="detail-album.php">
                            <img src="../assets/img/news/news3.jpg" alt="news" class="width-100 img-fluid">
                        </a>
                        <a href="detail-album.php" class="ne-zoom img-popup-icon-layout2" title="Title Here">
                                <i class="fa fa-camera-retro" aria-hidden="true"></i>
                            </a>
                    </div>
                 
                    <div class="mask-content-xs">
                        <h2 class="title-medium-light size-lg">
                            <a href="detail-album.php">اسم الألبوم</a>
                        </h2>
                    </div>
                </div>
            </div>
            <div class="col-md-4 col-sm-6 col-12 masonry-item">
                <div class="gallery-layout-2 popup-icon-hover">
                    <div class="img-overlay-70 event-img">
                        <a class="" href="detail-album.php">
                            <img src="../assets/img/news/news2.jpg" alt="news" class="width-100 img-fluid">
                        </a>
                        <a href="detail-album.php" class="ne-zoom img-popup-icon-layout2" title="Title Here">
                                <i class="fa fa-camera-retro" aria-hidden="true"></i>
                            </a>
                    </div>
                 
                    <div class="mask-content-xs">
                        <h2 class="title-medium-light size-lg">
                            <a href="detail-album.php">اسم الألبوم</a>
                        </h2>
                    </div>
                </div>
            </div>
            <div class="col-md-4 col-sm-6 col-12 masonry-item">
                <div class="gallery-layout-2 popup-icon-hover">
                    <div class="img-overlay-70 event-img">
                        <a class="" href="detail-album.php">
                            <img src="../assets/img/news/news3.jpg" alt="news" class="width-100 img-fluid">
                        </a>
                        <a href="detail-album.php" class="ne-zoom img-popup-icon-layout2" title="Title Here">
                                <i class="fa fa-camera-retro" aria-hidden="true"></i>
                            </a>
                    </div>
                 
                    <div class="mask-content-xs">
                        <h2 class="title-medium-light size-lg">
                            <a href="detail-album.php">اسم الألبوم</a>
                        </h2>
                    </div>
                </div>
            </div>
            <div class="col-md-4 col-sm-6 col-12 masonry-item">
                <div class="gallery-layout-2 popup-icon-hover">
                    <div class="img-overlay-70 event-img">
                        <a class="" href="detail-album.php">
                            <img src="../assets/img/news/news4.jpg" alt="news" class="width-100 img-fluid">
                        </a>
                        <a href="detail-album.php" class="ne-zoom img-popup-icon-layout2" title="Title Here">
                                <i class="fa fa-camera-retro" aria-hidden="true"></i>
                            </a>
                    </div>
                 
                    <div class="mask-content-xs">
                        <h2 class="title-medium-light size-lg">
                            <a href="detail-album.php">اسم الألبوم</a>
                        </h2>
                    </div>
                </div>
            </div>
            <div class="col-md-4 col-sm-6 col-12 masonry-item">
                <div class="gallery-layout-2 popup-icon-hover">
                    <div class="img-overlay-70 event-img">
                        <a class="" href="detail-album.php">
                            <img src="../assets/img/news/news5.jpg" alt="news" class="width-100 img-fluid">
                        </a>
                        <a href="detail-album.php" class="ne-zoom img-popup-icon-layout2" title="Title Here">
                                <i class="fa fa-camera-retro" aria-hidden="true"></i>
                            </a>
                    </div>
                 
                    <div class="mask-content-xs">
                        <h2 class="title-medium-light size-lg">
                            <a href="detail-album.php">اسم الألبوم</a>
                        </h2>
                    </div>
                </div>
            </div>
            <div class="col-md-4 col-sm-6 col-12 masonry-item">
                <div class="gallery-layout-2 popup-icon-hover">
                    <div class="img-overlay-70 event-img">
                        <a class="" href="detail-album.php">
                            <img src="../assets/img/news/news6.jpg" alt="news" class="width-100 img-fluid">
                        </a>
                        <a href="detail-album.php" class="ne-zoom img-popup-icon-layout2" title="Title Here">
                            <i class="fa fa-camera-retro" aria-hidden="true"></i>
                        </a>
                    </div>
                 
                    <div class="mask-content-xs">
                        <h2 class="title-medium-light size-lg">
                            <a href="detail-album.php">اسم الألبوم</a>
                        </h2>
                    </div>
                </div>
            </div>
        </div>


        <br><br>

        <div class="topic-border color-cinnabar mb-30">
                <div class="topic-box-lg color-cinnabar">ألبوم الفيديوهات</div>
                <div class="more-info-link">
                    <a href="">More
                        <i class="fa fa-angle-right" aria-hidden="true"></i>
                    </a>
                </div>
            </div>
        <div class="row tab-space2 videos">
            <div class="col-lg-4 col-md-12 mb-4">
                <div class="img-overlay-70">
                    <div class="mask-content-sm">
                        <h3 class="title-medium-light">
                            <a href="">عنوان الفيديو</a>
                        </h3>
                    </div>
                    <div class="text-center">
                        <a class="play-btn popup-youtube" href="https://www.youtube.com/watch?v=AMjMFbhyhwY">
                            <img src="../assets/img/banner/play.png" alt="play" class="img-fluid">
                        </a>
                    </div>
                    <img src="../assets/img/news/news1.jpg" alt="news" class="img-video img-fluid width-100">
                </div>
            </div>
            <div class="col-lg-4 col-md-12 mb-4">
                <div class="img-overlay-70">
                    <div class="mask-content-sm">
                        <h3 class="title-medium-light">
                                <a href="">عنوان الفيديو</a>
                            </h3>
                    </div>
                    <div class="text-center">
                        <a class="play-btn popup-youtube" href="https://www.youtube.com/watch?v=AMjMFbhyhwY">
                            <img src="../assets/img/banner/play.png" alt="play" class="img-fluid">
                        </a>
                    </div>
                    <img src="../assets/img/news/news2.jpg" alt="news" class="img-video img-fluid width-100">
                </div>
            </div>
            <div class="col-lg-4 col-md-12 mb-4">
                <div class="img-overlay-70">
                    <div class="mask-content-sm">
                        <h3 class="title-medium-light">
                                <a href="">عنوان الفيديو</a>
                            </h3>
                    </div>
                    <div class="text-center">
                        <a class="play-btn popup-youtube" href="https://www.youtube.com/watch?v=AMjMFbhyhwY">
                            <img src="../assets/img/banner/play.png" alt="play" class="img-fluid">
                        </a>
                    </div>
                    <img src="../assets/img/news/news6.jpg" alt="news" class="img-video img-fluid width-100">
                </div>
            </div>
            <div class="col-lg-4 col-md-12 mb-4">
                    <div class="img-overlay-70">
                        <div class="mask-content-sm">
                            <h3 class="title-medium-light">
                                <a href="">عنوان الفيديو</a>
                            </h3>
                        </div>
                        <div class="text-center">
                            <a class="play-btn popup-youtube" href="https://www.youtube.com/watch?v=AMjMFbhyhwY">
                                <img src="../assets/img/banner/play.png" alt="play" class="img-fluid">
                            </a>
                        </div>
                        <img src="../assets/img/news/news3.jpg" alt="news" class="img-video img-fluid width-100">
                    </div>
                </div>
                <div class="col-lg-4 col-md-12 mb-4">
                    <div class="img-overlay-70">
                        <div class="mask-content-sm">
                            <h3 class="title-medium-light">
                                    <a href="">عنوان الفيديو</a>
                                </h3>
                        </div>
                        <div class="text-center">
                            <a class="play-btn popup-youtube" href="https://www.youtube.com/watch?v=AMjMFbhyhwY">
                                <img src="../assets/img/banner/play.png" alt="play" class="img-fluid">
                            </a>
                        </div>
                        <img src="../assets/img/news/news4.jpg" alt="news" class="img-video img-fluid width-100">
                    </div>
                </div>
                <div class="col-lg-4 col-md-12 mb-4">
                    <div class="img-overlay-70">
                        <div class="mask-content-sm">
                            <h3 class="title-medium-light">
                                    <a href="">عنوان الفيديو</a>
                                </h3>
                        </div>
                        <div class="text-center">
                            <a class="play-btn popup-youtube" href="https://www.youtube.com/watch?v=AMjMFbhyhwY">
                                <img src="../assets/img/banner/play.png" alt="play" class="img-fluid">
                            </a>
                        </div>
                        <img src="../assets/img/news/news5.jpg" alt="news" class="img-video img-fluid width-100">
                    </div>
                </div>
        </div>
    </div>
</section>
<!-- Gallery Page Area End Here -->