<section class="title">
<p>
Back to article: <a href="http://bnson.blogspot.com/">http://bnson.blogspot.com/</a>
</p>
</section>
<section>
<h2>Lightbox Simple images</h2>
<div>
<a class="example-image-link" data-lightbox="image-1" href="https://2.bp.blogspot.com/-5WlULTiVfD0/VcN4ay2vSKI/AAAAAAAAR2Y/NpXvw-SKJM8/s0/beautiful-girl-004.jpg"><img src="https://2.bp.blogspot.com/-5WlULTiVfD0/VcN4ay2vSKI/AAAAAAAAR2Y/NpXvw-SKJM8/s320/beautiful-girl-004.jpg" /></a>
</div>
<div>
<a class="example-image-link" data-lightbox="image-2" href="https://1.bp.blogspot.com/-fjwxWaY7fFk/VcN4b78-4xI/AAAAAAAAR2o/cKqe28EZvpk/s0/beautiful-girl-006.jpg"><img src="https://1.bp.blogspot.com/-fjwxWaY7fFk/VcN4b78-4xI/AAAAAAAAR2o/cKqe28EZvpk/s320/beautiful-girl-006.jpg" /></a>
</div>
<div>
<a class="example-image-link" data-lightbox="image-3" href="https://4.bp.blogspot.com/-gtVvGXWtTNs/VcN4cfLafhI/AAAAAAAAR2w/sOQCvS_W6XE/s0/beautiful-girl-007.jpg"><img src="https://4.bp.blogspot.com/-gtVvGXWtTNs/VcN4cfLafhI/AAAAAAAAR2w/sOQCvS_W6XE/s320/beautiful-girl-007.jpg" /></a>
</div>
<p class="clear"></p>
</section>
<section>
<h2>Lightbox Simple images with title</h2>
<div>
<a class="example-image-link" data-lightbox="image-4" data-title="LightBox Image Title 001." href="https://4.bp.blogspot.com/-mgwp3MJ3o60/VcN4ZmvTSvI/AAAAAAAAR20/L3oBfOBvob8/s0/beautiful-girl-001.jpg"><img src="https://4.bp.blogspot.com/-mgwp3MJ3o60/VcN4ZmvTSvI/AAAAAAAAR20/L3oBfOBvob8/s320/beautiful-girl-001.jpg" /></a>
</div>
<div>
<a class="example-image-link" data-lightbox="image-5" data-title="LightBox Image Title 002." href="https://2.bp.blogspot.com/-epPLb2Oq4Fo/VcN4Z5bD-OI/AAAAAAAAR2M/iCBl4wvDJO4/s0/beautiful-girl-002.jpg"><img src="https://2.bp.blogspot.com/-epPLb2Oq4Fo/VcN4Z5bD-OI/AAAAAAAAR2M/iCBl4wvDJO4/s320/beautiful-girl-002.jpg" /></a>
</div>
<div>
<a class="example-image-link" data-lightbox="image-6" data-title="LightBox Image Title 003." href="https://1.bp.blogspot.com/-rN2i5h5wv_E/VcN4Zzuu8GI/AAAAAAAAR2Q/D2FAmcyIvpI/s0/beautiful-girl-003.jpg"><img src="https://1.bp.blogspot.com/-rN2i5h5wv_E/VcN4Zzuu8GI/AAAAAAAAR2Q/D2FAmcyIvpI/s320/beautiful-girl-003.jpg" /></a>
</div>
<p class="clear"></p>
</section>
<section>
<h2>Lightbox with group of related images</h2>
<div>
<a class="example-image-link" data-lightbox="image-group" href="https://2.bp.blogspot.com/-YOYUAwq6pME/VcN4mV7OvaI/AAAAAAAAR48/k1RlPBQR9pQ/s0/beautiful-girl-024.jpg"><img src="https://2.bp.blogspot.com/-YOYUAwq6pME/VcN4mV7OvaI/AAAAAAAAR48/k1RlPBQR9pQ/s320/beautiful-girl-024.jpg" /></a>
</div>
<div>
<a class="example-image-link" data-lightbox="image-group" href="https://1.bp.blogspot.com/-MU5TiEooLi4/VcN4bGFymzI/AAAAAAAAR2g/a3fHhKkWFM0/s0/beautiful-girl-005.jpg"><img src="https://1.bp.blogspot.com/-MU5TiEooLi4/VcN4bGFymzI/AAAAAAAAR2g/a3fHhKkWFM0/s320/beautiful-girl-005.jpg" /></a>
</div>
<div>
<a class="example-image-link" data-lightbox="image-group" href="https://2.bp.blogspot.com/-VzCovKgQ4hk/VcN4m-ea6jI/AAAAAAAAR5A/A_tuKWFJ9Zs/s0/beautiful-girl-025.jpg"><img src="https://2.bp.blogspot.com/-VzCovKgQ4hk/VcN4m-ea6jI/AAAAAAAAR5A/A_tuKWFJ9Zs/s320/beautiful-girl-025.jpg" /></a>
</div>
<div>
<a class="example-image-link" data-lightbox="image-group" href="https://1.bp.blogspot.com/-1q2SKbBpcls/VcN4opJ3VNI/AAAAAAAAR5I/ZXrQoTORvyk/s0/beautiful-girl-026.jpg"><img src="https://1.bp.blogspot.com/-1q2SKbBpcls/VcN4opJ3VNI/AAAAAAAAR5I/ZXrQoTORvyk/s320/beautiful-girl-026.jpg" /></a>
</div>
<div>
<a class="example-image-link" data-lightbox="image-group" href="https://3.bp.blogspot.com/-JzP9L_PZmzo/VcN4dCtMQdI/AAAAAAAAR24/AMyE51_-GrI/s0/beautiful-girl-008.jpg"><img src="https://3.bp.blogspot.com/-JzP9L_PZmzo/VcN4dCtMQdI/AAAAAAAAR24/AMyE51_-GrI/s320/beautiful-girl-008.jpg" /></a>
</div>
<div>
<a class="example-image-link" data-lightbox="image-group" href="https://4.bp.blogspot.com/-yR53TXsY_ls/VcN4dlEgYDI/AAAAAAAAR3Q/9bpsStL1VFo/s0/beautiful-girl-009.jpg"><img src="https://4.bp.blogspot.com/-yR53TXsY_ls/VcN4dlEgYDI/AAAAAAAAR3Q/9bpsStL1VFo/s320/beautiful-girl-009.jpg" /></a>
</div>
<div>
<a class="example-image-link" data-lightbox="image-group" href="https://3.bp.blogspot.com/-juuRJzA92oo/VcN4eIdeCrI/AAAAAAAAR3M/MA7tUuCGiUs/s0/beautiful-girl-010.jpg"><img src="https://3.bp.blogspot.com/-juuRJzA92oo/VcN4eIdeCrI/AAAAAAAAR3M/MA7tUuCGiUs/s320/beautiful-girl-010.jpg" /></a>
</div>
<div>
<a class="example-image-link" data-lightbox="image-group" href="https://3.bp.blogspot.com/-dxGFlKLKdNQ/VcN4eVPAe8I/AAAAAAAAR3I/Wh1VY7E_5g4/s0/beautiful-girl-011.jpg"><img src="https://3.bp.blogspot.com/-dxGFlKLKdNQ/VcN4eVPAe8I/AAAAAAAAR3I/Wh1VY7E_5g4/s320/beautiful-girl-011.jpg" /></a>
</div>
<div>
<a class="example-image-link" data-lightbox="image-group" href="https://2.bp.blogspot.com/-NCmsMwe_oCE/VcN4fl9avCI/AAAAAAAAR3c/tN4ARKf4CFg/s0/beautiful-girl-012.jpg"><img src="https://2.bp.blogspot.com/-NCmsMwe_oCE/VcN4fl9avCI/AAAAAAAAR3c/tN4ARKf4CFg/s320/beautiful-girl-012.jpg" /></a>
</div>
<div>
<a class="example-image-link" data-lightbox="image-group" href="https://4.bp.blogspot.com/-_Qc2OpTQ92Q/VcN4fwBd_XI/AAAAAAAAR3g/eHX0TFWSN2I/s0/beautiful-girl-014.jpg"><img src="https://4.bp.blogspot.com/-_Qc2OpTQ92Q/VcN4fwBd_XI/AAAAAAAAR3g/eHX0TFWSN2I/s320/beautiful-girl-014.jpg" /></a>
</div>
<div>
<a class="example-image-link" data-lightbox="image-group" href="https://4.bp.blogspot.com/-iqDQbRnb8Ao/VcN4guLbgGI/AAAAAAAAR3w/g9DhiXVkZgQ/s0/beautiful-girl-016.jpg"><img src="https://4.bp.blogspot.com/-iqDQbRnb8Ao/VcN4guLbgGI/AAAAAAAAR3w/g9DhiXVkZgQ/s320/beautiful-girl-016.jpg" /></a>
</div>
<div>
<a class="example-image-link" data-lightbox="image-group" href="https://3.bp.blogspot.com/-JcLBCnKSaK4/VcN4h5Na5tI/AAAAAAAAR38/LgA1WPfEIxY/s0/beautiful-girl-017.jpg"><img src="https://3.bp.blogspot.com/-JcLBCnKSaK4/VcN4h5Na5tI/AAAAAAAAR38/LgA1WPfEIxY/s320/beautiful-girl-017.jpg" /></a>
</div>
<div>
<a class="example-image-link" data-lightbox="image-group" href="https://3.bp.blogspot.com/-kRhoh7S6QaQ/VcN4iEAp68I/AAAAAAAAR4A/2Uo_zhlDufg/s0/beautiful-girl-018.jpg"><img src="https://3.bp.blogspot.com/-kRhoh7S6QaQ/VcN4iEAp68I/AAAAAAAAR4A/2Uo_zhlDufg/s320/beautiful-girl-018.jpg" /></a>
</div>
<div>
<a class="example-image-link" data-lightbox="image-group" href="https://3.bp.blogspot.com/-tq2w3QeKsLk/VcN4jHtaENI/AAAAAAAAR4Q/fUxMpdUW5Tg/s0/beautiful-girl-019.jpg"><img src="https://3.bp.blogspot.com/-tq2w3QeKsLk/VcN4jHtaENI/AAAAAAAAR4Q/fUxMpdUW5Tg/s320/beautiful-girl-019.jpg" /></a>
</div>
<div>
<a class="example-image-link" data-lightbox="image-group" href="https://3.bp.blogspot.com/-a0TbcLI3ROE/VcN4jVJSC9I/AAAAAAAAR4U/8qvccQ7cGH0/s0/beautiful-girl-020.jpg"><img src="https://3.bp.blogspot.com/-a0TbcLI3ROE/VcN4jVJSC9I/AAAAAAAAR4U/8qvccQ7cGH0/s320/beautiful-girl-020.jpg" /></a>
</div>
<div>
<a class="example-image-link" data-lightbox="image-group" href="https://2.bp.blogspot.com/-ADCtpVzCFho/VcN4kMUqfjI/AAAAAAAAR4c/QOeINE70fh4/s0/beautiful-girl-021.jpg"><img src="https://2.bp.blogspot.com/-ADCtpVzCFho/VcN4kMUqfjI/AAAAAAAAR4c/QOeINE70fh4/s320/beautiful-girl-021.jpg" /></a>
</div>
<div>
<a class="example-image-link" data-lightbox="image-group" href="https://2.bp.blogspot.com/-8WtLw5R4TdU/VcN4ktqWE1I/AAAAAAAAR4s/NKDocF0zsOw/s0/beautiful-girl-022.jpg"><img src="https://2.bp.blogspot.com/-8WtLw5R4TdU/VcN4ktqWE1I/AAAAAAAAR4s/NKDocF0zsOw/s320/beautiful-girl-022.jpg" /></a>
</div>
<div>
<a class="example-image-link" data-lightbox="image-group" href="https://4.bp.blogspot.com/-UMZdBOMi9rY/VcN4lAgfKxI/AAAAAAAAR4w/xGBW-kL82T4/s0/beautiful-girl-023.jpg"><img src="https://4.bp.blogspot.com/-UMZdBOMi9rY/VcN4lAgfKxI/AAAAAAAAR4w/xGBW-kL82T4/s320/beautiful-girl-023.jpg" /></a>
</div>
</section>
<section class="title">
<p>
Back to article: <a href="http://bnson.blogspot.com/">http://bnson.blogspot.com/</a>
</p>
</section>
<script type='text/javascript' src="http://lokeshdhakar.com/projects/lightbox2/js/lightbox-plus-jquery.min.js"></script>
body {
background: url(http://4.bp.blogspot.com/-ZQvP1TNY5cQ/VehS0ZBl39I/AAAAAAAASUM/52Wzi_Q5KIU/s1600/blurry-blue-light.jpg);
background-size: cover;
padding: 30px;
margin: 0px;
padding: 0px;
}
h2 {
text-align: center;
text-transform: uppercase;
color: #fff;
font-weight: bold;
font-size: 20px;
border-bottom: 1px solid #fff;
}
a {
color: #fff;
font-weight: normal;
}
a:hover {
color: #fff;
font-weight: bold;
}
a:visible {
color: #fff;
}
section {
background: #eee;
width: 100%;
max-width: 960px;
min-width: 320px;
margin: 25px auto;
padding: 20px;
overflow: hidden;
background-color: rgba(255, 255, 255, 0.3);
-webkit-box-shadow: 0px 0px 29px -7px rgba(0, 0, 0, 0.65);
-moz-box-shadow: 0px 0px 29px -7px rgba(0, 0, 0, 0.65);
box-shadow: 0px 0px 29px -7px rgba(0, 0, 0, 0.65);
text-align: center;
}
section img {
max-width: 100%;
max-height: 100%
}
.title {
text-align: center;
text-transform: uppercase;
color: #fff;
font-weight: bold;
font-size: 24px;
}
section div {
float: left;
width: 280px;
height: 160px;
padding: 10px;
margin: 10px;
border: 0px;
background: #fff;
display: inline-block;
}
.clear {
clear: both;
}