<p> </p> <p><span id="caret"> </span></p> <table width="100%"> <tbody> <tr> <td align="CENTER"> <div class="shine"> <style><!-- width: 332px; height: 335px; } .image { width: 100%; height: 100%; } .shine div { position: relative; } .shine div::before { position: absolute; top: 0; left: -75%; z-index: 2; display: block; content: ''; width: 50%; height: 100%; background: -webkit-linear-gradient(left, rgba(10,10,0,.1) 0%, rgba(10,10,0,.3) 100%); background: linear-gradient(to right, rgba(10,10,0,.1) 0%, rgba(10,10,0,.3) 100%); -webkit-transform: skewX(-25deg); transform: skewX(-25deg); } .shine div:hover::before { -webkit-animation: shine .75s; animation: shine .75s; } @-webkit-keyframes shine { 100% { left: 125%; } @keyframes shine { 100% { left: 125%; } > --></style> <div class="image"><img style="text-align: center; padding: 15px; display: block; margin-left: auto; margin-right: auto;" src="http://ekladata.com/VPL6MBTFcJTW4CFTa2n_sOruucE.png" alt=" BUNS " /></div> <div class="image"> </div> </div> <p> </p> <p> </p> <p> </p> </td> </tr> </tbody> </table>

<p> </p> <p><span id="caret"> </span></p> <table width="100%"> <tbody> <tr> <td align="CENTER"> <div class="sepia"> <style><!-- width: 332px; height: 335px; } .image { width: 100%; height: 100%; } .sepia div img { -webkit-filter: sepia(100%); filter: sepia(100%); -webkit-transition: .3s ease-in-out; transition: .3s ease-in-out; } .sepia div:hover img { -webkit-filter: sepia(0); filter: sepia(0); } > --></style> <div class="image"><img style="text-align: center; padding: 15px; display: block; margin-left: auto; margin-right: auto;" src="http://ekladata.com/VPL6MBTFcJTW4CFTa2n_sOruucE.png" alt=" BUNS " /></div> <div class="image"> </div> </div> <p> </p> <p> </p> <p> </p> </td> </tr> </tbody> </table>

<p> </p> <p><span id="caret"> </span></p> <table width="100%"> <tbody> <tr> <td align="CENTER"> <div class="grayscale"> <style><!-- width: 332px; height: 335px; } .image { width: 100%; height: 100%; } .grayscale div img { -webkit-filter: grayscale(100%); filter: grayscale(100%); -webkit-transition: .3s ease-in-out; transition: .3s ease-in-out; } .grayscale div:hover img { -webkit-filter: grayscale(0); filter: grayscale(0); } > --></style> <div class="image"><img style="text-align: center; padding: 15px; display: block; margin-left: auto; margin-right: auto;" src="http://ekladata.com/VPL6MBTFcJTW4CFTa2n_sOruucE.png" alt=" BUNS " /></div> <div class="image"> </div> </div> <p> </p> <p> </p> <p> </p> </td> </tr> </tbody> </table>