
<!--================Home Banner Area =================-->
<section class="banner_area">
    <div class="banner_inner d-flex align-items-center">
        <div class="pelajaran bg-parallax" data-stellar-ratio="0.9" data-stellar-vertical-offset="0" data-background="">
        </div>
        <div class="container">
            <div class="banner_content text-center">
                <h2>Gallery</h2>
                <div class="page_link">
                    <a href="<?=base_url('welcome')?>">Beranda</a>
                    <a href="<?=base_url('welcome/gallery')?>">Gallery</a>
                </div>
            </div>
        </div>
    </div>
</section>
<!--================End Home Banner Area =================-->


<!--================Courses Area =================-->
<section class="courses_area p_120">
    <div class="container">
        <div class="main_title">
            <h2>Our Gallery</h2>
            <p>Dibawah ini merupakan Album dari beberapa kegiatan-kegiatan dari Club Del Mobile Application</p>
        </div>

<div class="container page-top">
<div class="row">


    <div class="col-lg-3 col-md-4 col-xs-6 thumb">
        <a href="https://1.bp.blogspot.com/-6lNtfL98MRQ/Xr16ecD2ZgI/AAAAAAAAAf8/zEmYoQJqE6k_EJMI1fQFWlUwHJsXi3BowCK4BGAsYHg/Optimized-IMG_20180225_160515.jpg" class="fancybox" rel="ligthbox">
            <img  src="https://1.bp.blogspot.com/-6lNtfL98MRQ/Xr16ecD2ZgI/AAAAAAAAAf8/zEmYoQJqE6k_EJMI1fQFWlUwHJsXi3BowCK4BGAsYHg/Optimized-IMG_20180225_160515.jpg" class="zoom img-fluid "  alt="">
           
        </a>
    </div>
    <div class="col-lg-3 col-md-4 col-xs-6 thumb">
        <a href="https://1.bp.blogspot.com/-LbIz9dVNekA/Xr16evMQVfI/AAAAAAAAAgA/JNnSi_mKxfU3WKPGMaXJXT2Co3bzAk_4QCK4BGAsYHg/Optimized-IMG_20180225_184808_HDR.jpg"  class="fancybox" rel="ligthbox">
            <img  src="https://1.bp.blogspot.com/-LbIz9dVNekA/Xr16evMQVfI/AAAAAAAAAgA/JNnSi_mKxfU3WKPGMaXJXT2Co3bzAk_4QCK4BGAsYHg/Optimized-IMG_20180225_184808_HDR.jpg" class="zoom img-fluid"  alt="">
        </a>
    </div>
    
    <div class="col-lg-3 col-md-4 col-xs-6 thumb">
        <a href="https://1.bp.blogspot.com/-TTJNIAVdGLc/Xr6mVQG_ucI/AAAAAAAAAtM/PEEISHbq9LknaSc-NtzbzgL7aBB9LAjKwCK4BGAsYHg/Optimized-P_20181123_203135%25283%2529.png" class="fancybox" rel="ligthbox">
            <img  src="https://1.bp.blogspot.com/-NaBdkXUiBc4/Xr56RURFjII/AAAAAAAAAow/KsFxLhsPACsBIQT0IU5_z-wghfUtuZw6gCK4BGAsYHg/s320/Optimized-P_20181123_203135%25281%2529.png" class="zoom img-fluid "  alt="">
        </a>
    </div>
    
    <div class="col-lg-3 col-md-4 col-xs-6 thumb">
        <a href="https://1.bp.blogspot.com/-UhboMNTXybQ/Xr2XvYCt73I/AAAAAAAAAjk/Nmj39pXDK-8ABMJ10GkcbQsnnrVFCJXowCK4BGAsYHg/Optimized-IMG_20181025_213823_HDR%25281%2529.jpg" class="fancybox" rel="ligthbox">
            <img  src="https://1.bp.blogspot.com/-UhboMNTXybQ/Xr2XvYCt73I/AAAAAAAAAjk/Nmj39pXDK-8ABMJ10GkcbQsnnrVFCJXowCK4BGAsYHg/Optimized-IMG_20181025_213823_HDR%25281%2529.jpg" class="zoom img-fluid "  alt="">
        </a>
    </div>
    
     <div class="col-lg-3 col-md-4 col-xs-6 thumb">
        <a href="https://1.bp.blogspot.com/-cnTnXi8Epr0/Xr7q7g-xv9I/AAAAAAAAAu0/9vp8abjrxRkjX3h1WE4XW2k5iUmGF7N8gCK4BGAsYHg/Optimized-P_20181123_203831_001%25282%2529.png" class="fancybox" rel="ligthbox">
            <img  src="https://1.bp.blogspot.com/-cnTnXi8Epr0/Xr7q7g-xv9I/AAAAAAAAAu0/9vp8abjrxRkjX3h1WE4XW2k5iUmGF7N8gCK4BGAsYHg/s320/Optimized-P_20181123_203831_001%25282%2529.png" class="zoom img-fluid "  alt="">
        </a>
    </div>
    
     <div class="col-lg-3 col-md-4 col-xs-6 thumb">
        <a href="https://1.bp.blogspot.com/-5I1dZGhmmc8/Xr7nPwxYrhI/AAAAAAAAAto/tneeInvonvYX6vuEkSBI6FwuqS_Wq0vEACK4BGAsYHg/Optimized-P_20181123_203208.png" class="fancybox" rel="ligthbox">
            <img  src="https://1.bp.blogspot.com/-5I1dZGhmmc8/Xr7nPwxYrhI/AAAAAAAAAto/tneeInvonvYX6vuEkSBI6FwuqS_Wq0vEACK4BGAsYHg/s320/Optimized-P_20181123_203208.png" class="zoom img-fluid "  alt="">
        </a>
    </div>
    
     <div class="col-lg-3 col-md-4 col-xs-6 thumb">
        <a href="https://1.bp.blogspot.com/-pChxLFDiOTE/Xr7tegw5pcI/AAAAAAAAAv0/q9on1s-0G0Aa3mIEI79IBp1LtD4JbrCEACK4BGAsYHg/Optimized-P_20181123_204600.png" class="fancybox" rel="ligthbox">
            <img  src="https://1.bp.blogspot.com/-pChxLFDiOTE/Xr7tegw5pcI/AAAAAAAAAv0/q9on1s-0G0Aa3mIEI79IBp1LtD4JbrCEACK4BGAsYHg/s320/Optimized-P_20181123_204600.png" class="zoom img-fluid "  alt="">
        </a>
    </div>
    
     <div class="col-lg-3 col-md-4 col-xs-6 thumb">
        <a href="https://1.bp.blogspot.com/-okEsdS1U-NE/Xr7teztKXLI/AAAAAAAAAv4/u-zrZJWIVXovAz_-Txbv4OlcBMFMCBzeACK4BGAsYHg/Optimized-P_20181123_204650.png" class="fancybox" rel="ligthbox">
            <img  src="https://1.bp.blogspot.com/-KXiRfNqrAMU/Xr7vts3tMuI/AAAAAAAAAw4/AW9m_e7G6Zwj_PQeHAdnpdR7vX2z8n5tQCK4BGAsYHg/s320/Optimized-P_20181123_204650.png" class="zoom img-fluid "  alt="">
        </a>
    </div>

    <div class="col-lg-3 col-md-4 col-xs-6 thumb">
        <a href="https://1.bp.blogspot.com/-TE8DeK67Evs/Xr72GuRIwlI/AAAAAAAAAy0/I6GsaPI3WikHsBPk8cvo1-71sQs4Zoj1ACK4BGAsYHg/Optimized-P_20181123_223835.png" class="fancybox" rel="ligthbox">
            <img  src="https://1.bp.blogspot.com/-TE8DeK67Evs/Xr72GuRIwlI/AAAAAAAAAy0/I6GsaPI3WikHsBPk8cvo1-71sQs4Zoj1ACK4BGAsYHg/s320/Optimized-P_20181123_223835.png" class="zoom img-fluid "  alt="">
        </a>
    </div>

    <div class="col-lg-3 col-md-4 col-xs-6 thumb">
        <a href="https://1.bp.blogspot.com/-IKoZizNnK_w/Xr74upmsczI/AAAAAAAAAzw/y1IAZH05bU4HjD7bmJmR3_pEiIKob7MwgCK4BGAsYHg/Optimized-P_20181123_223842.png" class="fancybox" rel="ligthbox">
            <img  src="https://1.bp.blogspot.com/-IKoZizNnK_w/Xr74upmsczI/AAAAAAAAAzw/y1IAZH05bU4HjD7bmJmR3_pEiIKob7MwgCK4BGAsYHg/s320/Optimized-P_20181123_223842.png" class="zoom img-fluid "  alt="">
        </a>
    </div>

    <div class="col-lg-3 col-md-4 col-xs-6 thumb">
        <a href="https://1.bp.blogspot.com/-9Wf7CS5FW7M/Xr74uwayEMI/AAAAAAAAAz0/f1pWY1JNFVMrE15KykhRWpeCy_BjN-ySACK4BGAsYHg/Optimized-P_20181123_223905.png" class="fancybox" rel="ligthbox">
            <img  src="https://1.bp.blogspot.com/-9Wf7CS5FW7M/Xr74uwayEMI/AAAAAAAAAz0/f1pWY1JNFVMrE15KykhRWpeCy_BjN-ySACK4BGAsYHg/s320/Optimized-P_20181123_223905.png" class="zoom img-fluid "  alt="">
        </a>
    </div>

    <div class="col-lg-3 col-md-4 col-xs-6 thumb">
        <a href="https://1.bp.blogspot.com/-E8tZ1kNrsRk/Xr70fjLEWaI/AAAAAAAAAyY/ViNq1wWcmpUVpe4PHErNFCRpDxBVvbL-wCK4BGAsYHg/Optimized-SAVE_20181217_060745.png" class="fancybox" rel="ligthbox">
            <img  src="https://1.bp.blogspot.com/-E8tZ1kNrsRk/Xr70fjLEWaI/AAAAAAAAAyY/ViNq1wWcmpUVpe4PHErNFCRpDxBVvbL-wCK4BGAsYHg/s320/Optimized-SAVE_20181217_060745.png" class="zoom img-fluid "  alt="">
        </a>
    </div>
    
    <div class="col-lg-3 col-md-4 col-xs-6 thumb">
        <a href="https://1.bp.blogspot.com/-ZzOdZpqgP6Y/Xr76lanmb9I/AAAAAAAAA0g/egh7bX_1QnUujSVk3E5sDHgojiyHO7Y-wCK4BGAsYHg/Optimized-SAVE_20181217_060812.png" class="fancybox" rel="ligthbox">
            <img  src="https://1.bp.blogspot.com/-ZzOdZpqgP6Y/Xr76lanmb9I/AAAAAAAAA0g/egh7bX_1QnUujSVk3E5sDHgojiyHO7Y-wCK4BGAsYHg/s320/Optimized-SAVE_20181217_060812.png" class="zoom img-fluid "  alt="">
        </a>
    </div>

    <div class="col-lg-3 col-md-4 col-xs-6 thumb">
        <a href="https://1.bp.blogspot.com/-yXzmMucw6H0/Xr76ltW0WPI/AAAAAAAAA0k/7t6iaWkg3YMytOnDEqfBrRtaKPCyHs7nQCK4BGAsYHg/Optimized-SAVE_20181217_060948.png" class="fancybox" rel="ligthbox">
            <img  src="https://1.bp.blogspot.com/-yXzmMucw6H0/Xr76ltW0WPI/AAAAAAAAA0k/7t6iaWkg3YMytOnDEqfBrRtaKPCyHs7nQCK4BGAsYHg/s320/Optimized-SAVE_20181217_060948.png" class="zoom img-fluid "  alt="">
        </a>
    </div>

    <div class="col-lg-3 col-md-4 col-xs-6 thumb">
        <a href="https://1.bp.blogspot.com/-w6W3UfoJyRE/Xr78kHva1fI/AAAAAAAAA1E/AlFN5w6x_8AJNjrurFD30qlmQhzlOSoXACK4BGAsYHg/Optimized-SAVE_20181217_060955.png" class="fancybox" rel="ligthbox">
            <img  src="https://1.bp.blogspot.com/-w6W3UfoJyRE/Xr78kHva1fI/AAAAAAAAA1E/AlFN5w6x_8AJNjrurFD30qlmQhzlOSoXACK4BGAsYHg/s320/Optimized-SAVE_20181217_060955.png" class="zoom img-fluid "  alt="">
        </a>
    </div>
    
    </div>
</div>
</section>

<link href="//maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css" rel="stylesheet" id="bootstrap-css">
<link rel="stylesheet" type="text/css" href="assets/css/gallery.css">
<script src="//maxcdn.bootstrapcdn.com/bootstrap/4.0.0/js/bootstrap.min.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<!------ Include the above in your HEAD tag ---------->

 <link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/fancybox/2.1.5/jquery.fancybox.min.css" media="screen">
<script src="//cdnjs.cloudflare.com/ajax/libs/fancybox/2.1.5/jquery.fancybox.min.js"></script>
<script>
    $(document).ready(function(){
  $(".fancybox").fancybox({
        openEffect: "none",
        closeEffect: "none"
    });
    
    $(".zoom").hover(function(){
		
		$(this).addClass('transition');
	}, function(){
        
		$(this).removeClass('transition');
	});
});
    
</script>
 

