Album Group


SOURCE CODE
<div class="photo_box box_border_padding LightBox_image_group">
    <a href="/Portals/32/Photo2.jpg" title=" People Scenery 1" data-effect="mfp-zoom-in">
        <div class="pic_box"> <img alt="" src="/portals/32/Photo6.jpg" />
            <div class="ico"> <span class="glyphicons glyph-sort"></span> </div>
            <div class="shade"></div>
        </div>
    </a>
    <a href="/Portals/32/Photo5.jpg" title=" People Scenery 2"></a>
    <a href="/Portals/32/Photo8.jpg" title=" People Scenery 3"></a>
    <div class="text_sytle_5">
        <h3><span>3</span>Sightseeing</h3>
    </div>
</div>


Single Image


SOURCE CODE
<div class="row">
    <div class="col-sm-4">
        <div class="photo_box"> 
            <a href="/Portals/32/Photo8.jpg" class="  LightBox_image" title="Single Image 1" data-effect="mfp-move-from-top">
                <div class="pic_box"> 
                	<img alt="" src="/portals/32/Photo8.jpg" />
                    <div class="ico"> <span class="glyphicons glyph-search"></span> </div>
                    <div class="shade"></div>
                </div>
            </a> 
        </div>
    </div>
    <div class="col-sm-4">
        <div class="photo_box ico_zoom">
            <div class="pic_box"> 
                <img alt="" src="/portals/32/Photo5.jpg" />
                <div class="ico"> 
                    <a href="/Portals/32/Photo5.jpg" class="LightBox_image" title="Single Image 1" data-effect="mfp-3d-unfold"><span class="glyphicons glyph-search"></span></a> 
                </div>
                <div class="shade"></div>
            </div>
        </div>
    </div>
    <div class="col-sm-4">
        <div class="photo_box ico_zoom">
            <div class="pic_box"> <
            img alt="" src="/portals/32/Photo2.jpg" />
            <div class="ico"> 
                <a href="/Portals/32/Photo2.jpg" class=" LightBox_image" title="Single Image 1" data-effect="mfp-zoom-out"><span class="glyphicons glyph-search"></span></a> 
                <a href="#"><span class="glyphicons glyph-link"></span></a> 
            </div>
            <div class="shade"></div>
            </div>
        </div>
    </div>
</div>


Image Gallery


SOURCE CODE
<div class="col-sm-3">
    <div class="photo_box">
        <a href="/Portals/32/Photo8.jpg" class="LightBox_image_gallery1" title="Image Gallery">
            <div class="pic_box"> 
                <img alt="" src="/portals/32/Photo8.jpg" /> 
                <div class="ico">
                    <span class="glyphicons glyph-picture"></span>
                </div> 
                <div class="shade"></div> 
            </div>
        </a> 
    </div>
</div>
<div class="col-sm-3">
    <div class="photo_box">
        <a href="/Portals/32/Photo2.jpg" class="LightBox_image_gallery1" title="Image Gallery">
            <div class="pic_box"> 
                <img alt="" src="/portals/32/Photo2.jpg" /> 
                <div class="ico">
                    <span class="glyphicons glyph-picture"></span>
                </div> 
                <div class="shade"></div> 
            </div>
        </a> 
    </div>
</div>
<div class="col-sm-3">
    <div class="photo_box">
        <a href="/Portals/32/Photo5.jpg" class="LightBox_image_gallery1" title="Image Gallery">
            <div class="pic_box"> 
                <img alt="" src="/portals/32/Photo5.jpg" /> 
                <div class="ico">
                    <span class="glyphicons glyph-picture"></span>
                </div> 
                <div class="shade"></div> 
            </div>
        </a> 
    </div>
</div>
<div class="col-sm-3">
    <div class="photo_box">
        <a href="/Portals/32/Photo6.jpg" class="LightBox_image_gallery1" title="Image Gallery">
            <div class="pic_box"> 
                <img alt="" src="/portals/32/Photo6.jpg" /> 
                <div class="ico">
                    <span class="glyphicons glyph-picture"></span>
                </div> 
                <div class="shade"></div> 
            </div>
        </a> 
    </div>
</div>


Videos & Maps


SOURCE CODE
<div class="row ">
    <div class="col-sm-4">
        <div class="photo_box default_show box_border_padding box_border_radius"> 
            <a href="http://www.youtube.com/watch?v=0O2aH4XLbto" class="LightBox_youtube">
                <div class="pic_box"> <img alt="" src="/portals/32/Photo2.jpg" />
                    <div class="ico ico_no_bg"> <span class="glyphicons glyph-play"></span> </div>
                    <div class="shade"></div>
                </div>
            </a> 
        </div>
    </div>
    <div class="col-sm-4">
        <div class="photo_box default_show box_border_padding box_border_radius"> 
            <a href="https://vimeo.com/45830194" class="LightBox_vimeo">
                <div class="pic_box"> <img alt="" src="/portals/32/Photo5.jpg" />
                    <div class="ico"> <span class="glyphicons glyph-play"></span> </div>
                    <div class="shade"></div>
                </div>
            </a> 
        </div>
    </div>
    <div class="col-sm-4">
        <div class="photo_box default_show box_border_padding box_border_radius"> 
            <a href="https://maps.google.com/maps?q=221B+Baker+Street,+London,+United+Kingdom&amp;hl=en&amp;t=v&amp;hnear=221B+Baker+St,+London+NW1+6XE,+United+Kingdom" class="LightBox_gmaps">
                    <div class="pic_box"> <img alt="" src="/portals/32/map_img1.jpg" />
                <div class="ico ico_no_bg"> <span class="glyphicons glyph-pin"></span> </div>
               <div class="shade"></div>
     </div>
            </a> 
        </div>
    </div>
</div>


Content Lightbox

Click Here To Pop

Click Here To Pop
SOUECE CODE
<a href="#LightBox_Content" class="LightBox_Box"> Click Here To Pop </a>
<a href="#LightBox_Content" class="LightBox_Box Button_lightbox"> Click Here To Pop </a>
<div id="LightBox_Content" class="white-popup mfp-with-anim mfp-hide">
    <h3>Click Here To Pop</h3>
 	  content text ...
</div>