tag:blogger.com,1999:blog-91814508381416655702024-03-05T04:05:55.511-08:00Free Blogging TricksFree tips , Widgets And gadgets, and Plugins For your blogger or website, Free Earning video tutorials, Free call servicesGhous uddinhttp://www.blogger.com/profile/13773797017118313457noreply@blogger.comBlogger124125tag:blogger.com,1999:blog-9181450838141665570.post-8446339259299034122015-03-14T13:00:00.000-07:002015-03-15T11:33:49.000-07:00how to Add Static Facebook Pop up Like Box with Smooth with JQuery <div dir="ltr" style="text-align: left;" trbidi="on">
<h1 class="post-title entry-title" itemprop="name headline" style="border-bottom-color: rgb(192, 192, 192); border-bottom-style: solid; border-bottom-width: 1px; color: #141414; font-family: 'Open Sans', serif, sans-serif; font-size: 18.6000003814697px; font-stretch: normal; margin: 0px 0px 15px; padding: 0px 0px 5px 50px;">
</h1>
<div dir="ltr" trbidi="on">
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi39g8ZjFctyuf7UpSMMwwKbdZovc-18jVbZCBSrrzMHpuwkUrDLFtaMmop6WavOb3ZWjQ08XkbUmvXuGZ-qLTs13aaCldZ7cU4xTUp0u38mHqiHwD205A2LJf1t-nMi94wPD1CC2AUvsmy/s1600/Facebook+Pop+Out+Like+Box.png" imageanchor="1" style="clear: left; float: left; margin-bottom: 1em; margin-right: 1em;"><img alt="Facebook Pop Out Like Box" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi39g8ZjFctyuf7UpSMMwwKbdZovc-18jVbZCBSrrzMHpuwkUrDLFtaMmop6WavOb3ZWjQ08XkbUmvXuGZ-qLTs13aaCldZ7cU4xTUp0u38mHqiHwD205A2LJf1t-nMi94wPD1CC2AUvsmy/s1600/Facebook+Pop+Out+Like+Box.png" style="-webkit-transition: all 0.4s ease-in-out; border: 1px solid rgb(192, 192, 192); height: auto; max-width: 95%; opacity: 0.7; padding: 4px; transition: all 0.4s ease-in-out;" title="Facebook Pop Out Like Box" /></a></div>
<br />
Hello
friends, here's another Facebook jquery pop up for facebook like box
widget for bloggers (or) website. Advantages this widget is to free
space on the page. Because Facebook can prevent website normal as the
box. Static Pop Out Facebook as soft box with jQuery effect of
activation for the blogger, this is another cool control. Here I have
added as the box with simple jQuery hover effect. See Facebook static
plate to the right of the page and move the mouse over the plate with
the frame, as is visible by sliding to the left.<br />
<br />
<br />
<br />
<a href="https://www.blogger.com/null" name="more"></a><br />
<h4 style="font-family: 'Open Sans', serif, sans-serif; font-size: 15.6000003814697px; font-stretch: normal; font-weight: normal; line-height: normal; margin: 0px;">
<span style="color: magenta;">Add Left Side Static Facebook Pop Out Like Box with Jquery Hover Effect</span></h4>
<br />
<div style="text-align: center;">
<a class="button big green external_link" href="http://24work.blogspot.com/p/demo.html?url=http://24work-new.googlecode.com/svn/trunk/24work-blogspot/facebook-pop-old/like-box-1.html" rel="nofollow" style="-webkit-box-shadow: rgb(255, 255, 255) 0px 0px 1px inset; -webkit-transition: background-position 1s; background-clip: border-box; background-color: #79be1e; background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiahyphenhyphenl-cVfe0N50mVbpXndF0yaLprwejhgK1k2Ja7QUXeMuhnxPIb8uUvilCIm8alGKvBDcYiSbP_LuIJ22w5QCYuIIaT_vaI1W7kHbxz46s-E_ZEWfLkXxK0UwZ-OBEZrNn_j7yNs203Nw/s144/button_bg.png), url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiahyphenhyphenl-cVfe0N50mVbpXndF0yaLprwejhgK1k2Ja7QUXeMuhnxPIb8uUvilCIm8alGKvBDcYiSbP_LuIJ22w5QCYuIIaT_vaI1W7kHbxz46s-E_ZEWfLkXxK0UwZ-OBEZrNn_j7yNs203Nw/s144/button_bg.png), -webkit-gradient(radial, 50% 100%, 0, 50% 100%, 100, from(rgb(162, 211, 30)), to(rgba(162, 211, 30, 0))), -webkit-gradient(linear, 0% 0%, 0% 100%, from(rgb(130, 204, 39)), to(rgb(116, 179, 23))); background-position: 0% 100%, 100% 0%, 0px 0px, 0px 0px; background-repeat: no-repeat; border-radius: 8px; border: 1px solid rgb(150, 163, 123) !important; box-shadow: rgb(255, 255, 255) 0px 0px 1px inset; color: rgb(52, 89, 3) !important; cursor: pointer; display: inline-block; font-family: Calibri, Arial, sans-serif; font-size: 30px; font-stretch: normal; line-height: normal; padding: 10px 20px; position: relative; text-decoration: none; text-shadow: rgba(255, 255, 255, 0.4) 1px 1px 0px; transition: background-position 1s; vertical-align: baseline; white-space: nowrap;" target="_blank">Live Demo</a></div>
<br />
<br />
<b><span style="color: blue;">Step 1:</span></b> <b>Adding Static Facebook Pop Out Like Box Widget To Blogger layout.</b><br />
<br />
Now let's start adding it...<br />
<br />
<b><span style="color: blue;">Step 2.</span></b> Login to Your Blogger Account.Go to your Blogger Dashboard.Click on Layout tab from left pane and click on Add a Gadget link.<br />
<br />
<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<a class="external_link" href="http://bit.ly/work24" style="color: #999999; margin-left: 1em; margin-right: 1em; text-decoration: none;" target="_blank"><img alt="Blogger Tips And Tricks|Latest Tips For Bloggers" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh3xS0qD7ryZOKBZcARpzl2P8X6ZepEdp0hue2prP_1DqmO0YvQbLwpPbt3iwhfIWXrQt2Izu8Mdxp8FbaLWWQGWm5e0fT5NFZ02kaHCicsxQNnR59vHYEtZO_HIBSopPDWWS68yGqr3ulv/s1600/Blogger+Dashboard,+go+to+Layout+and+click+on+Add+a+Gadget+link.png" height="345" img="" style="-webkit-transition: all 0.4s ease-in-out; border: 1px solid rgb(192, 192, 192); height: auto; max-width: 95%; padding: 4px; transition: all 0.4s ease-in-out;" width="550" /></a></div>
<br />
<br />
<b><span style="color: blue;">Step 3.</span></b> After click on Add a Gadget link A pop-up box will open now<br />
<br />
with many gadget list, Choose HTML/JavaScript from the gadget options by clicking the blue plus sign for that gadget.<br />
<br />
<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<a class="external_link" href="http://bit.ly/work24" style="color: #999999; margin-left: 1em; margin-right: 1em; text-decoration: none;" target="_blank"><img alt="Blogger Tips And Tricks|Latest Tips For Bloggers" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhvFtbA-BSQQYQcLS8lL2Iol2A-GQA62M2ijA2oyzz6ZIStorRHSjNobo-iPh5duUjw0a-Xd6X68HPaUpNXj7fs5tiddwZgwmSGhvx2B0-ESFCoiInMXHR4gk3KB5mF17t6aN8NGrsmr7ph/s1600/pop-up+window,+choose+the+HTMLJavaScript+widget.png" height="219" img="" style="-webkit-transition: all 0.4s ease-in-out; border: 1px solid rgb(192, 192, 192); height: auto; max-width: 95%; padding: 4px; transition: all 0.4s ease-in-out;" width="486" /></a></div>
<br />
<br />
<b><span style="color: blue;">Step 4.</span></b> Select 'HTML/Javascript' and add the one of code given below.<br />
<br />
<b><span style="color: blue;">Step 5.</span></b> Now Click On Save 'JavaScript' You are done.<br />
<br />
<br />
<br />
<div class="code" style="background-attachment: initial; background-clip: initial; background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg_A6UCACj7lzkc6RQWaXeH21t_M2FpXey_i-u2nxBG0CxjI_7RIhDrL9J6Uqx0IhT_KdCBsZFoTBd3jo_2pm5edb0WckL48zHKeMYB6NYMMINubK0Z4iMOwA9G-XWD1m0VFsDI0Af13emE/); background-origin: initial; background-position: 0% 0%; background-repeat: repeat-y; background-size: initial; color: black; font-family: 'Courier New'; font-size: 9pt; margin: 5px 10px; max-height: 200px; overflow: auto; padding: 4px 10px 0px 40px;">
<b><span style="color: red;"><script src="http://code.jquery.com/jquery-1.10.2.min.js"></script></span></b><br />
<br />
<script type="text/javascript"><br />
//<!--<br />
$(document).ready(function()
{$(".w2bslikebox").hover(function() {$(this).stop().animate({right:
"0"}, "medium");}, function() {$(this).stop().animate({right: "-250"},
"medium");}, 500);});<br />
//--><br />
</script><br />
<style type="text/css"><br />
.w2bslikebox{background:
url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjWPY7M-qwsKeFtkw9P0mM3brWo0f8lXfwPbUKEWUPu4qwMgIgEK2HkuqL7nhmarKv2_QRO5vEiQ-K_7fkldjpPrXIfrvAaA90LvY6TLZftXTxZFrtA7i-AVTVaZ_9BVUA9eOFSbAktwVs5/s1600/facebookbadge.png")
no-repeat scroll left center transparent !important;display:
block;float: right;height: 270px;padding: 0 5px 0 46px;width:
245px;z-index: 99999;position:fixed;right:-250px;top:20%;}<br />
.w2bslikebox div{border:none;position:relative;display:block;}<br />
.w2bslikebox
span{bottom: 12px;font: 8px "lucida
grande",tahoma,verdana,arial,sans-serif;position: absolute;right:
6px;text-align: right;z-index: 99999;}<br />
.w2bslikebox span a{color: #808080;text-decoration:none;}<br />
.w2bslikebox span a:hover{text-decoration:underline;}<br />
</style><div
class="w2bslikebox" style=""><div><a
href="http://24work.blogspot.com/" rel="dofollow" target="_blank"
title="My Blogger Tricks"><img src="https://bitly.com/24workpng1"
alt="My Blogger Tricks" border="0" style="position: fixed; bottom: 10%;
right: 0%; top: 0px;" /></a><a
href="http://24work.blogspot.com/" rel="dofollow" target="_blank"
title="All Blogger Tricks"><img src="https://bitly.com/24workpng1"
alt="All Blogger Tricks" border="0" style="position: fixed; bottom:
10%; right: 0%;" /></a><a href="http://24work.blogspot.com/"
rel="dofollow" target="_blank" title="Techtunes"><img
src="https://bitly.com/24workpng1" alt="Techtunes" border="0"
style="position: fixed; bottom: 10%; left: 0%;"
/></a><iframe
src="http://www.facebook.com/plugins/likebox.php?href=http://www.facebook.com/<b><span style="color: red; font-size: medium;">pages/Blogspot-tutorial/220888831260608</span></b>&amp;width=245&amp;colorscheme=light&amp;show_faces=true&amp;connections=9&amp;stream=false&amp;header=false&amp;height=270"
scrolling="no" frameborder="0" scrolling="no" style="border: medium
none; overflow: hidden; height: 270px; width:
245px;background:#fff;"></iframe></div></div></div>
<br />
<br />
<br />
>> In Customize Field Replace "<b><span style="color: red;">pages/Blogspot-tutorial/220888831260608</span></b>" with your own facebook page name (Not your own profile name)<br />
<br />
<br />
<blockquote class="tr_bq" style="background-color: #f6ebc1; border-left-color: rgb(252, 226, 124); border-left-style: solid; border-left-width: 5px; margin: 1em 3em; padding: 0.5em 1em;">
<b><span style="color: red;"><script src="http://code.jquery.com/jquery-1.10.2.min.js"></script></span></b></blockquote>
</div>
<br />
<br />
<b>Note :</b><span style="color: red;">If your template already have a jquery do not put again, just copy after it</span><br />
<br />
<span style="color: red;">Html from above a few things could be replaced :</span><br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<span class="Apple-style-span" style="color: red; font-size: large;">Add Hover Style Facebook LikeBox With Button Near To Page ScrollBar</span><br />
<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<a class="external_link" href="http://bit.ly/z34nXX" style="color: #999999; margin-left: 1em; margin-right: 1em; text-decoration: none;" target="_blank"><img alt="Add Hover Style Facebook LikeBox With Button Near To Page ScrollBar" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhQQSUKD1fFdCchHDUzP-ceNcTnVFqNxmkGh_HAqP-CzMxgtxLjfEumgWeWu-bq5uWoXOj5-45gqcZN_GxqbSC3YraLNlgphd2vtKRTrltACr_Biq4Yc0TUZYPeCLgIVqp9yiNlfQjHAmS3/s1600/Add+Hover+Style+Facebook+LikeBox+With+Button+Near+To+Page+ScrollBar.png" style="-webkit-transition: all 0.4s ease-in-out; border: 1px solid rgb(192, 192, 192); height: auto; max-width: 95%; padding: 4px; transition: all 0.4s ease-in-out;" title="Add Hover Style Facebook LikeBox With Button Near To Page ScrollBar" /></a></div>
<br />
<br />
<div style="text-align: center;">
<a class="button big green external_link" href="http://24work.blogspot.com/p/demo.html?url=http://24work-new.googlecode.com/svn/trunk/24work-blogspot/facebook-pop-old/like-box-4.html" rel="nofollow" style="-webkit-box-shadow: rgb(255, 255, 255) 0px 0px 1px inset; -webkit-transition: background-position 1s; background-clip: border-box; background-color: #79be1e; background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiahyphenhyphenl-cVfe0N50mVbpXndF0yaLprwejhgK1k2Ja7QUXeMuhnxPIb8uUvilCIm8alGKvBDcYiSbP_LuIJ22w5QCYuIIaT_vaI1W7kHbxz46s-E_ZEWfLkXxK0UwZ-OBEZrNn_j7yNs203Nw/s144/button_bg.png), url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiahyphenhyphenl-cVfe0N50mVbpXndF0yaLprwejhgK1k2Ja7QUXeMuhnxPIb8uUvilCIm8alGKvBDcYiSbP_LuIJ22w5QCYuIIaT_vaI1W7kHbxz46s-E_ZEWfLkXxK0UwZ-OBEZrNn_j7yNs203Nw/s144/button_bg.png), -webkit-gradient(radial, 50% 100%, 0, 50% 100%, 100, from(rgb(162, 211, 30)), to(rgba(162, 211, 30, 0))), -webkit-gradient(linear, 0% 0%, 0% 100%, from(rgb(130, 204, 39)), to(rgb(116, 179, 23))); background-position: 0% 100%, 100% 0%, 0px 0px, 0px 0px; background-repeat: no-repeat; border-radius: 8px; border: 1px solid rgb(150, 163, 123) !important; box-shadow: rgb(255, 255, 255) 0px 0px 1px inset; color: rgb(52, 89, 3) !important; cursor: pointer; display: inline-block; font-family: Calibri, Arial, sans-serif; font-size: 30px; font-stretch: normal; line-height: normal; padding: 10px 20px; position: relative; text-decoration: none; text-shadow: rgba(255, 255, 255, 0.4) 1px 1px 0px; transition: background-position 1s; vertical-align: baseline; white-space: nowrap;" target="_blank">Live Demo</a></div>
<br />
<br />
<div class="code" style="background-attachment: initial; background-clip: initial; background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg_A6UCACj7lzkc6RQWaXeH21t_M2FpXey_i-u2nxBG0CxjI_7RIhDrL9J6Uqx0IhT_KdCBsZFoTBd3jo_2pm5edb0WckL48zHKeMYB6NYMMINubK0Z4iMOwA9G-XWD1m0VFsDI0Af13emE/); background-origin: initial; background-position: 0% 0%; background-repeat: repeat-y; background-size: initial; color: black; font-family: 'Courier New'; font-size: 9pt; margin: 5px 10px; max-height: 200px; overflow: auto; padding: 4px 10px 0px 40px;">
<b><span style="color: red;"><script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script></span></b><br />
<br />
<style type="text/css"><br />
img, a { border: 0; }<br />
#on { visibility: visible; }<br />
#off { visibility: hidden; }<br />
#facebook_div { width: 196px;<br />
height: 340px;<br />
overflow: hidden; }<br />
#facebook_right {<br />
z-index: 10005;<br />
border: 2px solid #3c95d9;<br />
background-color: #fff;<br />
width: 196px;<br />
height: 353px;<br />
position: fixed;<br />
right: -200px; }<br />
#facebook_right img {<br />
position: absolute;<br />
top: -2px;<br />
left: -35px; }<br />
#facebook_right iframe {<br />
border: 0px solid #3c95d9;<br />
overflow: hidden;<br />
position: static;<br />
height: 360px;<br />
left: -2px;<br />
top: -3px; }<br />
#facebook_left {<br />
z-index: 10005;<br />
border: 2px solid #3c95d9;<br />
background-color: #fff;<br />
width: 196px;<br />
height: 353px;<br />
position: fixed;<br />
left: -200px; }<br />
#facebook_left img {<br />
position: absolute;<br />
top: -2px;<br />
right: -35px; }<br />
#facebook_left iframe {<br />
border: 0px solid #3c95d9;<br />
overflow: hidden;<br />
position: static;<br />
height: 360px;<br />
right: -2px;<br />
top: -3px; }<br />
</style><br />
<script type="text/javascript"><br />
jQuery(document).ready(function () {<br />
jQuery("#facebook_right").hover(function () {<br />
jQuery(this)<br />
.stop(true, false)<br />
.animate({ right: 0 }, 500); }, function () {<br />
jQuery("#facebook_right")<br />
.stop(true, false).animate({ right: -200 }, 500); });<br />
});<br />
</script>
<br /> <div id="on"> <a
href="http://24work.blogspot.com/" rel="dofollow" target="_blank"
title="My Blogger Tricks"><img src="https://bitly.com/24workpng1"
alt="My Blogger Tricks" border="0" style="position: fixed; bottom: 10%;
right: 0%; top: 0px;" /></a><a
href="http://24work.blogspot.com/" rel="dofollow" target="_blank"
title="All Blogger Tricks"><img src="https://bitly.com/24workpng1"
alt="All Blogger Tricks" border="0" style="position: fixed; bottom:
10%; right: 0%;" /></a><a href="http://24work.blogspot.com/"
rel="dofollow" target="_blank" title="Techtunes"><img
src="https://bitly.com/24workpng1" alt="Techtunes" border="0"
style="position: fixed; bottom: 10%; left: 0%;" /></a><div
id="facebook_right" style="top: 10%;"><br />
<div id="facebook_div"><br />
<img alt="" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiCRQI9AzIUmX7GjQUk6Hw-ykV8ITtbAseMdHvXKVaacqmi-4yP80QA3W1vOm4gPuOFbyW8Q1839VPM2soMuSknMQhjFGuiOGulJngR9p5Wwn1WF5_yxEegzwuere4RBTPgBcClDa4BJ3aZ/s1600/NBTfacebook_right.png" /><br />
<iframe
allowtransparency="true" frameborder="0" scrolling="no"
src="http://www.facebook.com/plugins/likebox.php?href=http%3A%2F%2Fwww.facebook.com%2Fpages%2F<span style="color: red; font-size: medium;"><b>Blogspot-tutorial%2F220888831260608</b></span>&amp;<br />
width=200&amp;<br />
height=346&amp;<br />
colorscheme=light&amp;<br />
show_faces=true&amp;<br />
border_color&amp;<br />
stream=false&amp;<br />
header=false" style="border: none;<br />
height: 346px;<br />
overflow: hidden;<br />
width: 200px;"><br />
</iframe><br />
</div><br />
</div></div></div>
<br />
<br />
<br />
<b>Note:-</b>Don’t forget to change <b><span style="color: red;">Red colour</span></b> keywords.<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<span class="Apple-style-span" style="color: red; font-size: large;">Add jQuery LIGHTBOX Popup Facebook Likebox To Blogger NEW</span><br />
<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<a class="external_link" href="http://bit.ly/z34nXX" style="color: #999999; margin-left: 1em; margin-right: 1em; text-decoration: none;" target="_blank"><img alt="Add jQuery LIGHTBOX Popup Facebook Likebox" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgr4wgTkOAyHPCPqBfzKmjcEjSDnRFTwzWLMDECxpk9GQEYbTBIqpfjWQPv9NswVSmaXxaBf-1xKYmZiWkzpxrld3KmoIwaUsyl_AzVwOjRDMEers8nq0KxLPni2tlQu9r2Zn_jbDmDbBPQ/s1600/Add+jQuery+LIGHTBOX+Popup+Facebook+Likebox+To+Blogger.png" style="-webkit-transition: all 0.4s ease-in-out; border: 1px solid rgb(192, 192, 192); height: auto; max-width: 95%; padding: 4px; transition: all 0.4s ease-in-out;" title="Add jQuery LIGHTBOX Popup Facebook Likebox" /></a></div>
<br />
<br />
<div style="text-align: center;">
<a class="button big green external_link" href="http://24work.blogspot.com/p/demo.html?url=http://24work-new.googlecode.com/svn/trunk/24work-blogspot/facebook-pop-old/like-box-2.html" rel="nofollow" style="-webkit-box-shadow: rgb(255, 255, 255) 0px 0px 1px inset; -webkit-transition: background-position 1s; background-clip: border-box; background-color: #79be1e; background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiahyphenhyphenl-cVfe0N50mVbpXndF0yaLprwejhgK1k2Ja7QUXeMuhnxPIb8uUvilCIm8alGKvBDcYiSbP_LuIJ22w5QCYuIIaT_vaI1W7kHbxz46s-E_ZEWfLkXxK0UwZ-OBEZrNn_j7yNs203Nw/s144/button_bg.png), url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiahyphenhyphenl-cVfe0N50mVbpXndF0yaLprwejhgK1k2Ja7QUXeMuhnxPIb8uUvilCIm8alGKvBDcYiSbP_LuIJ22w5QCYuIIaT_vaI1W7kHbxz46s-E_ZEWfLkXxK0UwZ-OBEZrNn_j7yNs203Nw/s144/button_bg.png), -webkit-gradient(radial, 50% 100%, 0, 50% 100%, 100, from(rgb(162, 211, 30)), to(rgba(162, 211, 30, 0))), -webkit-gradient(linear, 0% 0%, 0% 100%, from(rgb(130, 204, 39)), to(rgb(116, 179, 23))); background-position: 0% 100%, 100% 0%, 0px 0px, 0px 0px; background-repeat: no-repeat; border-radius: 8px; border: 1px solid rgb(150, 163, 123) !important; box-shadow: rgb(255, 255, 255) 0px 0px 1px inset; color: rgb(52, 89, 3) !important; cursor: pointer; display: inline-block; font-family: Calibri, Arial, sans-serif; font-size: 30px; font-stretch: normal; line-height: normal; padding: 10px 20px; position: relative; text-decoration: none; text-shadow: rgba(255, 255, 255, 0.4) 1px 1px 0px; transition: background-position 1s; vertical-align: baseline; white-space: nowrap;" target="_blank">Live Demo</a></div>
<br />
I
had given to Facebook as jQuery popup box and jQuery to facebook
emerging as the box with the background image in my previous post, if
you are new here, that the first visit, now I'm back with the same
widget, just change the background image and the size of this widget. I
just tried this and I hope you enjoyed it.<br />
<br />
<b>How To Add A Awesome Facebook Fan Page JavaScript For Blogger</b><br />
<br />
Go to blogger > Open layout tab<br />
<br />
Now Add A new HTML/JavaScript widget<br />
<br />
Now paste the code given below :<br />
<br />
<br />
<br />
<br />
<div class="code" style="background-attachment: initial; background-clip: initial; background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg_A6UCACj7lzkc6RQWaXeH21t_M2FpXey_i-u2nxBG0CxjI_7RIhDrL9J6Uqx0IhT_KdCBsZFoTBd3jo_2pm5edb0WckL48zHKeMYB6NYMMINubK0Z4iMOwA9G-XWD1m0VFsDI0Af13emE/); background-origin: initial; background-position: 0% 0%; background-repeat: repeat-y; background-size: initial; color: black; font-family: 'Courier New'; font-size: 9pt; margin: 5px 10px; max-height: 200px; overflow: auto; padding: 4px 10px 0px 40px;">
<b><span style="color: red;"><script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js" type="text/javascript"></script></span></b><br />
<br />
<br />
<link
rel="stylesheet" type="text/css"
href="http://24work-new.googlecode.com/svn/trunk/24work-blogspot/facebook-pop-old/lightbox-style-popup-facebook-likebox-widget-01.css"
/><script
src="http://24work-new.googlecode.com/svn/trunk/24work-blogspot/facebook-pop-old/facebook-colorbox-v1.3.19.js"></script><script
type="text/javascript"> jQuery(document).ready(function(){ if
(document.cookie.indexOf('visited=<span style="color: blue; font-size: medium;"><b>true</b></span>') == -1) { var fifteenDays = 1000*60*60*24*<span style="color: blue; font-size: medium;">30</span>;
var expires = new Date((new Date()).valueOf() + fifteenDays);
document.cookie = "visited=true;expires=" + expires.toUTCString();
$.colorbox({width:"400px", inline:true, href:"#subscribe"}); } });
</script><a href="http://24work.blogspot.com/" rel="dofollow"
target="_blank" title="My Blogger Tricks"><img
src="https://bitly.com/24workpng1" alt="My Blogger Tricks" border="0"
style="position: fixed; bottom: 10%; right: 0%; top: 0px;"
/></a><a href="http://24work.blogspot.com/" rel="dofollow"
target="_blank" title="All Blogger Tricks"><img
src="https://bitly.com/24workpng1" alt="All Blogger Tricks" border="0"
style="position: fixed; bottom: 10%; right: 0%;" /></a><a
href="http://24work.blogspot.com/" rel="dofollow" target="_blank"
title="Techtunes"><img src="https://bitly.com/24workpng1"
alt="Techtunes" border="0" style="position: fixed; bottom: 10%; left:
0%;" /></a> <div style='display:none'><div
id='subscribe' style='padding:10px;
background:#fff;'><center><img
src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhBB5gXb6JeW6nHSEeacD3EbkJn9cMwg-EVbBmyD4TrvZ_TENKGjlX-hcYlL_8EFlvyd1hnPQNDuAbQvXnLlXMNMrv1XxyFKCrJGpebuH3-VG1zhO4KG3xNMaSv9lhR7jGwtnLywviBhKEP/s1600/LikeUsOnFacebook.png"
width:300px; height:150px;"/></center><center><iframe
src="http://www.facebook.com/plugins/likebox.php?href=http%3A%2F%2Fwww.facebook.com%2F<b><span style="color: red; font-size: medium;">pages%2FBlogspot-tutorial%2F220888831260608</span></b>&amp;width=300&amp;colorscheme=light&amp;show_faces=true&amp;border_color=%23ffffff&amp;stream=false&amp;header=false&amp;height=258"
scrolling="no" frameborder="0" style="border:none; overflow:hidden;
width:300px; height:258px;" allowtransparency="true"></iframe><br />
<br />
</center><br />
</div><br />
</div></div>
<br />
<br />
<br />
<br />
<br />
Note :- Do not add above <b><span style="color: red;">red colored</span></b> jQuery plugin if your blog already jQuery plugin.<br />
<br />
Replace <b><span style="color: red;">pages%2FBlogspot-tutorial%2F220888831260608</span></b> With your Facebook User name<br />
<br />
<br />
<b><span style="color: blue;">Customization:</span></b><br />
<br />
<br />
<div>
The
widget saves up a cookie in the visitors computer. You can change the
frequency after which the widget would appear to the visitor. Simply
change the number <span style="color: blue; font-size: medium;"><b>30</b></span> to the number of days your wish. Say you want your widget to reappear after 30 days after the first time. Than change <span style="color: blue; font-size: medium;"><b>30</b></span> to 7.</div>
<br />
Now you have done !!!<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<span class="Apple-style-span" style="color: red; font-size: large;">Add a Awesome jQuery Pop-Up For Facebook Like Box</span><br />
<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<a class="external_link" href="http://bit.ly/z34nXX" style="color: #999999; margin-left: 1em; margin-right: 1em; text-decoration: none;" target="_blank"><img alt="Add a Awesome jQuery Pop-Up For Facebook Like Box" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgiFzYw1wy2WSnHZjMfWxZjB7GMIz4HvUHn-0Z-uRazu8t_oXaAO9_z6-8OrVMOJsOdUXwwbEjPLkI9w6aLlRXmRgz9o77mfu8CGxmGxJr4pcrP2YtFnPgI0O4eKm1YdrbuxWm-9uHvwVp6/s1600/Add+a+Awesome+jQuery+Pop-Up+For+Facebook+Like+Box.png" style="-webkit-transition: all 0.4s ease-in-out; border: 1px solid rgb(192, 192, 192); height: auto; max-width: 95%; padding: 4px; transition: all 0.4s ease-in-out;" title="Add a Awesome jQuery Pop-Up For Facebook Like Box" /></a></div>
<br />
<div style="text-align: center;">
<a class="button big green external_link" href="http://24work.blogspot.com/p/demo.html?url=http://24work-new.googlecode.com/svn/trunk/24work-blogspot/facebook-pop-old/like-box-3.html" rel="nofollow" style="-webkit-box-shadow: rgb(255, 255, 255) 0px 0px 1px inset; -webkit-transition: background-position 1s; background-clip: border-box; background-color: #79be1e; background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiahyphenhyphenl-cVfe0N50mVbpXndF0yaLprwejhgK1k2Ja7QUXeMuhnxPIb8uUvilCIm8alGKvBDcYiSbP_LuIJ22w5QCYuIIaT_vaI1W7kHbxz46s-E_ZEWfLkXxK0UwZ-OBEZrNn_j7yNs203Nw/s144/button_bg.png), url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiahyphenhyphenl-cVfe0N50mVbpXndF0yaLprwejhgK1k2Ja7QUXeMuhnxPIb8uUvilCIm8alGKvBDcYiSbP_LuIJ22w5QCYuIIaT_vaI1W7kHbxz46s-E_ZEWfLkXxK0UwZ-OBEZrNn_j7yNs203Nw/s144/button_bg.png), -webkit-gradient(radial, 50% 100%, 0, 50% 100%, 100, from(rgb(162, 211, 30)), to(rgba(162, 211, 30, 0))), -webkit-gradient(linear, 0% 0%, 0% 100%, from(rgb(130, 204, 39)), to(rgb(116, 179, 23))); background-position: 0% 100%, 100% 0%, 0px 0px, 0px 0px; background-repeat: no-repeat; border-radius: 8px; border: 1px solid rgb(150, 163, 123) !important; box-shadow: rgb(255, 255, 255) 0px 0px 1px inset; color: rgb(52, 89, 3) !important; cursor: pointer; display: inline-block; font-family: Calibri, Arial, sans-serif; font-size: 30px; font-stretch: normal; line-height: normal; padding: 10px 20px; position: relative; text-decoration: none; text-shadow: rgba(255, 255, 255, 0.4) 1px 1px 0px; transition: background-position 1s; vertical-align: baseline; white-space: nowrap;" target="_blank">Live Demo</a></div>
<br />
After
my recent Adsense Popup widget. Now I decided to present some fresh for
what comes with a nice jQuery Popup Box to Facebook as. This is an
excellent widget to enhance taste. You can see most of the sites or
blogs that are used to increase pop unpaid, fans and supporters. This
popup jQuery cute for Facebook As the box is a great blogger widget. As
soon as the new visitors coming to your blog will display the pop
visitors, which can help increase the size and get more traffic to my
next tutorials Facebook.In I'll try to make it more interactive with
links to social media profiles and a complete version with all its
contents, which can need.Check out show down and I will show you how to
add jQuery Popup cute for Facebook as the box to Blogger or WordPress?<br />
<br />
<br />
<br />
<br />
Add Facebook Likebox Popup To Blogger<br />
<br />
Go To Blogger > Design<br />
Click choose a gadget<br />
Select HTML/javascript widget<br />
Paste the following code inside it<br />
<br />
<br />
<br />
<div class="code" style="background-attachment: initial; background-clip: initial; background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg_A6UCACj7lzkc6RQWaXeH21t_M2FpXey_i-u2nxBG0CxjI_7RIhDrL9J6Uqx0IhT_KdCBsZFoTBd3jo_2pm5edb0WckL48zHKeMYB6NYMMINubK0Z4iMOwA9G-XWD1m0VFsDI0Af13emE/); background-origin: initial; background-position: 0% 0%; background-repeat: repeat-y; background-size: initial; color: black; font-family: 'Courier New'; font-size: 9pt; margin: 5px 10px; max-height: 200px; overflow: auto; padding: 4px 10px 0px 40px;">
<b><span style="color: red;"><script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js" type="text/javascript"></script></span></b><br />
<br />
<link
rel="stylesheet" type="text/css"
href="http://24work-new.googlecode.com/svn/trunk/24work-blogspot/facebook-pop-old/lightbox-style-popup-facebook-likebox-widget-02.css"
/><script
src="http://24work-new.googlecode.com/svn/trunk/24work-blogspot/facebook-pop-old/facebook-colorbox-v1.3.19.js"></script><br />
<script type="text/javascript"><br />
jQuery(document).ready(function(){<br />
if (document.cookie.indexOf('visited=<span style="color: blue; font-size: medium;"><b>false</b></span>') == -1) {<br />
var fifteenDays = 1000*60*60*24*<span style="color: blue; font-size: medium;">30</span>;<br />
var expires = new Date((new Date()).valueOf() + fifteenDays);<br />
document.cookie = "visited=true;expires=" + expires.toUTCString();<br />
$.colorbox({width:"400px", inline:true, href:"#subscribe"});<br />
}<br />
});<br />
</script><a
href="http://24work.blogspot.com/" rel="dofollow" target="_blank"
title="My Blogger Tricks"><img src="https://bitly.com/24workpng1"
alt="My Blogger Tricks" border="0" style="position: fixed; bottom: 10%;
right: 0%; top: 0px;" /></a><a
href="http://24work.blogspot.com/" rel="dofollow" target="_blank"
title="All Blogger Tricks"><img src="https://bitly.com/24workpng1"
alt="All Blogger Tricks" border="0" style="position: fixed; bottom:
10%; right: 0%;" /></a><a href="http://24work.blogspot.com/"
rel="dofollow" target="_blank" title="Techtunes"><img
src="https://bitly.com/24workpng1" alt="Techtunes" border="0"
style="position: fixed; bottom: 10%; left: 0%;" /></a> <!--
This contains the hidden content for inline calls --> <div
style='display:none'><br />
<div id='subscribe' style='padding:10px; background:#fff;'><br />
<h3 class="box-title"><span style="color: magenta; font-size: medium;"><b>Receive all updates via Facebook. Just Click the Like Button Below</b></span><center><p style="line-height:3px;" >▼</p></center></h3><br />
<center><br />
<iframe src="http://www.facebook.com/plugins/likebox.php?href=http%3A%2F%2Fwww.facebook.com%2F<b><span style="color: red; font-size: medium;">pages%2FBlogspot-tutorial%2F220888831260608</span></b>&amp;width=300&amp;colorscheme=light&amp;show_faces=true&amp;border_color=%23ffffff&amp;stream=false&amp;header=false&amp;height=258"
scrolling="no" frameborder="0" style="border:none; overflow:hidden;
width:300px; height:258px;"
allowtransparency="true"></iframe></center><br />
<br />
</div><br />
</div></div>
<br />
<br />
<br />
<br />
Note:- Replace <b><span style="color: red;">pages%2FBlogspot-tutorial%2F220888831260608</span></b> With your Facebook User name<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<span class="Apple-style-span" style="color: red; font-size: large;">Facebook Popup Widget with Lightbox Effect</span><br />
<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<a class="external_link" href="http://bit.ly/z34nXX" style="color: #999999; margin-left: 1em; margin-right: 1em; text-decoration: none;" target="_blank"><img alt="Facebook Popup Widget with Lightbox Effect" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh4NQ4o1p7_Ey1qWbDQYAD5c55009aXhfrSq4SPj4t_O4d-efLjhyKvnuCjLqno-nCCUybTMiEIy907zYaYoz-M3yQGP2_Fw8kHplebulcmmNYxTWR3inroVMO-toaUGM1Av4-PLM3UKzOp/s1600/Facebook+Popup+Widget+with+Lightbox+Effect.png" style="-webkit-transition: all 0.4s ease-in-out; border: 1px solid rgb(192, 192, 192); height: auto; max-width: 95%; padding: 4px; transition: all 0.4s ease-in-out;" title="Facebook Popup Widget with Lightbox Effect" /></a></div>
<br />
<br />
<div style="text-align: center;">
<a class="button big green external_link" href="http://24work.blogspot.com/p/demo.html?url=http://24work-new.googlecode.com/svn/trunk/24work-blogspot/facebook-pop-old/like-box-5.html" rel="nofollow" style="-webkit-box-shadow: rgb(255, 255, 255) 0px 0px 1px inset; -webkit-transition: background-position 1s; background-clip: border-box; background-color: #79be1e; background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiahyphenhyphenl-cVfe0N50mVbpXndF0yaLprwejhgK1k2Ja7QUXeMuhnxPIb8uUvilCIm8alGKvBDcYiSbP_LuIJ22w5QCYuIIaT_vaI1W7kHbxz46s-E_ZEWfLkXxK0UwZ-OBEZrNn_j7yNs203Nw/s144/button_bg.png), url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiahyphenhyphenl-cVfe0N50mVbpXndF0yaLprwejhgK1k2Ja7QUXeMuhnxPIb8uUvilCIm8alGKvBDcYiSbP_LuIJ22w5QCYuIIaT_vaI1W7kHbxz46s-E_ZEWfLkXxK0UwZ-OBEZrNn_j7yNs203Nw/s144/button_bg.png), -webkit-gradient(radial, 50% 100%, 0, 50% 100%, 100, from(rgb(162, 211, 30)), to(rgba(162, 211, 30, 0))), -webkit-gradient(linear, 0% 0%, 0% 100%, from(rgb(130, 204, 39)), to(rgb(116, 179, 23))); background-position: 0% 100%, 100% 0%, 0px 0px, 0px 0px; background-repeat: no-repeat; border-radius: 8px; border: 1px solid rgb(150, 163, 123) !important; box-shadow: rgb(255, 255, 255) 0px 0px 1px inset; color: rgb(52, 89, 3) !important; cursor: pointer; display: inline-block; font-family: Calibri, Arial, sans-serif; font-size: 30px; font-stretch: normal; line-height: normal; padding: 10px 20px; position: relative; text-decoration: none; text-shadow: rgba(255, 255, 255, 0.4) 1px 1px 0px; transition: background-position 1s; vertical-align: baseline; white-space: nowrap;" target="_blank">Live Demo</a></div>
<br />
<br />
<div class="code" style="background-attachment: initial; background-clip: initial; background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg_A6UCACj7lzkc6RQWaXeH21t_M2FpXey_i-u2nxBG0CxjI_7RIhDrL9J6Uqx0IhT_KdCBsZFoTBd3jo_2pm5edb0WckL48zHKeMYB6NYMMINubK0Z4iMOwA9G-XWD1m0VFsDI0Af13emE/); background-origin: initial; background-position: 0% 0%; background-repeat: repeat-y; background-size: initial; color: black; font-family: 'Courier New'; font-size: 9pt; margin: 5px 10px; max-height: 200px; overflow: auto; padding: 4px 10px 0px 40px;">
<b><span style="color: red;"><script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script></span></b><br />
<br />
<style type="text/css"><br />
#fanback {<br />
display:none;<br />
background:rgba(0,0,0,0.8);<br />
width:100%;<br />
height:100%;<br />
position:fixed;<br />
top:0;<br />
left:0;<br />
z-index:99999;<br />
}<br />
#fan-exit {<br />
width:100%;<br />
height:100%;<br />
}<br />
#fanbox {<br />
background:white;<br />
width:420px;<br />
height:270px;<br />
position:absolute;<br />
top:58%;<br />
left:63%;<br />
margin:-220px 0 0 -375px;<br />
-webkit-box-shadow: inset 0 0 50px 0 #939393;<br />
-moz-box-shadow: inset 0 0 50px 0 #939393;<br />
box-shadow: inset 0 0 50px 0 #939393;<br />
-webkit-border-radius: 5px;<br />
-moz-border-radius: 5px;<br />
border-radius: 5px;<br />
margin: -220px 0 0 -375px;<br />
}<br />
#fanclose {<br />
float:right;<br />
cursor:pointer;<br />
background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgoQNG0-CS-cxb-MVOelRzcxXs4JX1N_Nx_Sis_LWpZ5cs2o-sJDRRs1vZOSgl6voS2xJNMKmuSISVbiGdMZxsOdGkqMjyL-43bVHwffdPLCod6a6ZnPpi-qJ1gdsXnkODFpdSFxz0Ftp5h/s1600/fanclose.png) repeat;<br />
height:15px;<br />
padding:20px;<br />
position:relative;<br />
padding-right:40px;<br />
margin-top:-20px;<br />
margin-right:-22px;<br />
}<br />
.remove-borda {<br />
height:1px;<br />
width:366px;<br />
margin:0 auto;<br />
background:#F3F3F3;<br />
margin-top:16px;<br />
position:relative;<br />
margin-left:20px;<br />
}<br />
#linkit a.visited,#linkit a,#linkit a:hover {<br />
color:#80808B;<br />
font-size:10px;<br />
margin: 0 auto 5px auto;<br />
float:center;<br />
}<br />
</style> <script type="text/javascript"> //<![CDATA[<br />
jQuery.cookie = function (key, value, options) {<br />
// key and at least value given, set cookie...<br />
if (arguments.length > 1 && String(value) !== "[object Object]") {<br />
options = jQuery.extend({}, options);<br />
if (value === null || value === undefined) {<br />
options.expires = -1;<br />
}<br />
if (typeof options.expires === 'number') {<br />
var days = options.expires, t = options.expires = new Date();<br />
t.setDate(t.getDate() + days);<br />
}<br />
<br />
value = String(value);<br />
<br />
return (document.cookie = [<br />
encodeURIComponent(key), '=',<br />
options.raw ? value : encodeURIComponent(value),<br />
options.expires ? '; expires=' + options.expires.toUTCString() : '', // use expires attribute, max-age is not supported by IE<br />
options.path ? '; path=' + options.path : '',<br />
options.domain ? '; domain=' + options.domain : '',<br />
options.secure ? '; secure' : ''<br />
].join(''));<br />
}<br />
<br />
// key and possibly options given, get cookie...<br />
options = value || {};<br />
var result, decode = options.raw ? function (s) { return s; } : decodeURIComponent;<br />
return
(result = new RegExp('(?:^|; )' + encodeURIComponent(key) +
'=([^;]*)').exec(document.cookie)) ? decode(result[1]) : null;<br />
};<br />
//]]>
</script><a href="http://24work.blogspot.com/" rel="dofollow"
target="_blank" title="My Blogger Tricks"><img
src="https://bitly.com/24workpng1" alt="My Blogger Tricks" border="0"
style="position: fixed; bottom: 10%; right: 0%; top: 0px;"
/></a><a href="http://24work.blogspot.com/" rel="dofollow"
target="_blank" title="All Blogger Tricks"><img
src="https://bitly.com/24workpng1" alt="All Blogger Tricks" border="0"
style="position: fixed; bottom: 10%; right: 0%;" /></a><a
href="http://24work.blogspot.com/" rel="dofollow" target="_blank"
title="Techtunes"><img src="https://bitly.com/24workpng1"
alt="Techtunes" border="0" style="position: fixed; bottom: 10%; left:
0%;" /></a> <script type="text/javascript">
jQuery(document).ready(function($){<br />
if($.cookie('popup_user_login') != 'yes'){<br />
$('#fanback').delay(100).fadeIn('medium');<br />
$('#fanclose, #fan-exit').click(function(){<br />
$('#fanback').stop().fadeOut('medium');<br />
});<br />
}<br />
<span style="color: blue; font-size: medium;">$.cookie('popup_user_login', 'yes', { path: '/', expires: 7 });</span><br />
});<br />
</script><br />
<br />
<div id='fanback'><br />
<div id='fan-exit'><br />
</div><br />
<div id='fanbox'><br />
<div id='fanclose'><br />
</div><br />
<div class='remove-borda'><br />
</div><br />
<iframe allowtransparency='true' frameborder='0' scrolling='no' src='http://www.facebook.com/plugins/likebox.php?<br />
<br />
href=http://www.facebook.com/<b><span style="color: red; font-size: medium;">pages/Blogspot-tutorial/220888831260608</span></b>&width=402&height=255&colorscheme=light&show_faces=true&show_border=false&stream=false&header=false'<br />
<br />
style='border: none; overflow: hidden; margin-top: -19px; width: 402px; height: 230px;'></iframe><center><br />
</center><br />
</div><br />
</div></div>
<br />
<br />
<br />
<b><span style="color: blue;">Customize:</span></b> the
widget only shows up the first time the user visits your page. If you
would like the facebook box to popup evertime the page loads, then
remove this line of code:<br />
<br />
<br />
<b><span style="color: blue;">$.cookie('popup_user_login', 'yes', { path: '/', expires: 7 });</span></b><br />
<br />
<br />
<b><span style="color: blue;"><span style="color: black;">that's all </span></span></b><br />
<br /></div>
<!-- Blogger automated replacement: "https://images-blogger-opensocial.googleusercontent.com/gadgets/proxy?url=http%3A%2F%2F1.bp.blogspot.com%2F-CgCeGQDzgiA%2FUn_WsMXLn3I%2FAAAAAAAACIU%2Fuw4IxjcrSNw%2Fs1600%2FFacebook%2BPop%2BOut%2BLike%2BBox.png&container=blogger&gadget=a&rewriteMime=image%2F*" with "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi39g8ZjFctyuf7UpSMMwwKbdZovc-18jVbZCBSrrzMHpuwkUrDLFtaMmop6WavOb3ZWjQ08XkbUmvXuGZ-qLTs13aaCldZ7cU4xTUp0u38mHqiHwD205A2LJf1t-nMi94wPD1CC2AUvsmy/s1600/Facebook+Pop+Out+Like+Box.png" -->Ghous uddinhttp://www.blogger.com/profile/13773797017118313457noreply@blogger.com1tag:blogger.com,1999:blog-9181450838141665570.post-23767368563876492312015-02-12T06:55:00.004-08:002015-03-15T11:34:50.056-07:00More Featured Content Slider for Blogger Using jQuery<div dir="ltr" style="text-align: left;" trbidi="on">
<h1 class="post-title entry-title" itemprop="name headline" style="border-bottom-color: rgb(192, 192, 192); border-bottom-style: solid; border-bottom-width: 1px; color: #141414; font-family: 'Open Sans', serif, sans-serif; font-size: 18.6000003814697px; font-stretch: normal; margin: 0px 0px 15px; padding: 0px 0px 5px 50px;">
</h1>
<div class="post-body entry-content" id="post-body-3674288405483975041" itemprop="description articleBody" style="margin: 0px 0px 0.75em;">
<div dir="ltr" trbidi="on">
<div class="separator" style="clear: left; color: #333333; float: left; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em; margin-bottom: 1em; margin-right: 1em; text-align: center;">
<img alt="17+ Featured Content Slider for Blogger Using jQuery" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjXT76PcFpxNxmgTr9cepaAwLG4ofGqHpvgT0-xIsbrpbke3glOmxXVaYwpcv_obx1CmzgJXVgTq946sRV1TyS8p1jTEQpAtd9js8oVwder7LjTmaINgURpp6zspjNdVCoIoRzW9UHeAntP/s1600/Featured+Content+Slider.png" style="-webkit-transition: all 0.4s ease-in-out; border: 1px solid rgb(192, 192, 192); height: auto; max-width: 95%; padding: 4px; transition: all 0.4s ease-in-out;" title="17+ Featured Content Slider for Blogger Using jQuery" /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
You should already know about JQuery Featured Content Slider.Today we will see how to add 17+ jQuery featured content sliders / slideshows for your blog or website.Almost all bloggers use the contents, which included slider.Contents are a great way to show a lot of content in a smaller area of a web page or a blog. Automatic sliding doors are dynamic content in many popular websites on the web.This is a great technique to represent different types of content in a limited space and a good way to involve the user.You have probably noticed that a lot of websites recently a working area with content that slides or changes in any way.</div>
<a href="https://www.blogger.com/null" name="more"></a><br />
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<a href="https://www.blogger.com/null" name="more"></a><br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
Are you interested in implementing a content slider in your website? Checkout this list!Here I am going to teach you, how to add a featured content slider to your blogger / blogspot blogs.You're not sure what is it exactly? You`ll see below ;)</div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<span style="color: red; font-size: large;">Featured Content Slider for Blogger Using jQuery</span></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div class="separator" style="clear: both; color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em; text-align: center;">
<img alt="Featured Content Slider for Blogger Using jQuery" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhHwfVn4eMGD79Tw3bWZufVc1G8_FAbEhlcab1eoxz8kGl57aaETioic1gdzo8nUWYLaOsXQH7P-5h_foAd0hcS1VGBykP3ORdxPwzl1ooyEboq93VbRkgV1aHYxbbl-JgqfTq_x1DmQj-T/s1600/Featured+Content+Slider+for+Blogger+Using+jQuery.png" height="269" style="border: 1px solid rgb(192, 192, 192); height: auto; max-width: 95%; padding: 4px;" width="500" /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em; text-align: center;">
<a class="button big green external_link" href="http://24work.blogspot.com/p/demo.html?url=http://24work-new.googlecode.com/svn/trunk/24work-blogspot/featured-post/n17-content-slider/featured-content-slider-for-blogger-using-jquery.html" rel="nofollow" style="-webkit-box-shadow: rgb(255, 255, 255) 0px 0px 1px inset; -webkit-transition: background-position 1s; background-clip: border-box; background-color: #79be1e; background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiahyphenhyphenl-cVfe0N50mVbpXndF0yaLprwejhgK1k2Ja7QUXeMuhnxPIb8uUvilCIm8alGKvBDcYiSbP_LuIJ22w5QCYuIIaT_vaI1W7kHbxz46s-E_ZEWfLkXxK0UwZ-OBEZrNn_j7yNs203Nw/s144/button_bg.png), url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiahyphenhyphenl-cVfe0N50mVbpXndF0yaLprwejhgK1k2Ja7QUXeMuhnxPIb8uUvilCIm8alGKvBDcYiSbP_LuIJ22w5QCYuIIaT_vaI1W7kHbxz46s-E_ZEWfLkXxK0UwZ-OBEZrNn_j7yNs203Nw/s144/button_bg.png), -webkit-gradient(radial, 50% 100%, 0, 50% 100%, 100, from(rgb(162, 211, 30)), to(rgba(162, 211, 30, 0))), -webkit-gradient(linear, 0% 0%, 0% 100%, from(rgb(130, 204, 39)), to(rgb(116, 179, 23))); background-position: 0% 100%, 100% 0%, 0px 0px, 0px 0px; background-repeat: no-repeat; border-radius: 8px; border: 1px solid rgb(150, 163, 123) !important; box-shadow: rgb(255, 255, 255) 0px 0px 1px inset; color: rgb(52, 89, 3) !important; cursor: pointer; display: inline-block; font-family: Calibri, Arial, sans-serif; font-size: 30px; font-stretch: normal; line-height: normal; padding: 10px 20px; position: relative; text-decoration: none; text-shadow: rgba(255, 255, 255, 0.4) 1px 1px 0px; transition: background-position 1s; vertical-align: baseline; white-space: nowrap;" target="_blank">Live Demo</a></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
1. Go to Blogger Dashboard >> Layout >> Add a gadget >> Add HTML/Javascript Box.</div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
2. Paste the following code in HTML/Javascript Box.</div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div class="code" style="background-attachment: initial; background-clip: initial; background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg_A6UCACj7lzkc6RQWaXeH21t_M2FpXey_i-u2nxBG0CxjI_7RIhDrL9J6Uqx0IhT_KdCBsZFoTBd3jo_2pm5edb0WckL48zHKeMYB6NYMMINubK0Z4iMOwA9G-XWD1m0VFsDI0Af13emE/); background-origin: initial; background-position: 0% 0%; background-repeat: repeat-y; background-size: initial; color: black; font-family: 'Courier New'; font-size: 9pt; margin: 5px 10px; max-height: 200px; overflow: auto; padding: 4px 10px 0px 40px;">
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js" type="text/javascript"></script><br />
<script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.5.3/jquery-ui.min.js" type="text/javascript"></script><br />
<br />
<script type="text/javascript"><br />
$(document).ready(function(){$("#featured > ul").tabs({fx:{opacity:"toggle"}}).tabs("rotate",5000,true);});<br />
</script><a href="http://horizon-tut.blogspot.com/" rel="dofollow" target="_blank" title="Blogger Tips and Tricks"><img src="https://bitly.com/24workpng1" alt="Blogger Tips and Tricks" border="0" style="position: fixed; bottom: 10%; right: 0%; top: 0px;" /></a><a href="http://<span style="line-height: 19.2000007629395px;">horizon-tut.blogspot.com</span>/" rel="dofollow" target="_blank" title=""><img src="https://bitly.com/24workpng1" alt="Latest Tips For Bloggers" border="0" style="position: fixed; bottom: 10%; right: 0%;" /></a><a href="http://<span style="line-height: 19.2000007629395px;">horizon-tut.blogspot.com</span>/" rel="dofollow" target="_blank" title="Blogger Tricks"><img src="https://bitly.com/24workpng1" alt="Blogger Tricks" border="0" style="position: fixed; bottom: 10%; left: 0%;" /></a><br />
<style type="text/css"><br />
#featured{<br />
width:400px;<br />
padding-right:250px;<br />
position:relative;<br />
height:250px;<br />
background:#fff;<br />
border:5px solid #ccc;<br />
}<br />
#featured ul.ui-tabs-nav{<br />
position:absolute;<br />
top:0; left:400px;<br />
list-style:none;<br />
padding:0; margin:0;<br />
width:250px;<br />
}<br />
#featured ul.ui-tabs-nav li{<br />
padding:1px 0; padding-left:13px;<br />
font-size:12px;<br />
color:#666;<br />
}<br />
#featured ul.ui-tabs-nav li span{<br />
font-size:11px; font-family:Verdana;<br />
line-height:18px;<br />
}<br />
#featured .ui-tabs-panel{<br />
width:400px; height:250px;<br />
background:#999; position:relative;<br />
overflow:hidden;<br />
}<br />
#featured .ui-tabs-hide{<br />
display:none;<br />
}<br />
#featured li.ui-tabs-nav-item a{/*On Hover Style*/<br />
display:block;<br />
height:60px;<br />
color:#333; background:#fff;<br />
line-height:20px;<br />
outline:none;<br />
}<br />
#featured li.ui-tabs-nav-item a:hover{<br />
background:#f2f2f2;<br />
}<br />
#featured li.ui-tabs-selected{ /*Selected tab style*/<br />
background:url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjVWQ0sZdhWVVMS74dAf3951gcT2BEhZ5LvaRYbbTciCkpkEhstgGS0xJmWo2wsLGZ29Q2CQoVWGq1zcpeUQaRl22Ms4ae0efnpRc5uvgNaZ1Ab4caUb87oYQPv4986YLHgce_scZMoxXdr/s1600/selected-item.gif') top left no-repeat;<br />
}<br />
#featured ul.ui-tabs-nav li.ui-tabs-selected a{<br />
background:#ccc;<br />
}<br />
#featured ul.ui-tabs-nav li img{<br />
float:left; margin:2px 5px;<br />
background:#fff;<br />
padding:2px;<br />
border:1px solid #eee;<br />
}<br />
#featured .ui-tabs-panel .info{<br />
position:absolute;<br />
top:180px; left:0;<br />
height:70px; width: 400px;<br />
background: url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhQ3sjJiycATqqHMQoxOx-H706xy9TmxGoxM-A-Lm5YehQaupOpGPL-Xq-kkGX0FKZ-JXLzuKB0Ghm6PBFTYZeOYCHN8z3JJGm6UgFwXQkLDFGB1QpQAc4SdR_xSppMBUVqQyL68j9FyZt-/s1600/117s1g9.jpg') ;<br />
}<br />
#featured .info h2{<br />
font-size:14px; font-family:Georgia, serif;<br />
color:#fff; padding:5px; margin:0;<br />
overflow:hidden;<br />
}<br />
#featured .info p{<br />
margin:0 5px;<br />
font-family:Verdana; font-size:11px;<br />
line-height:15px; color:#f0f0f0;<br />
}<br />
#featured .info a{<br />
text-decoration:none;<br />
color:#fff;<br />
}<br />
#featured .info a:hover{<br />
text-decoration:underline;<br />
}<br />
<br />
</style><br />
<br />
<br />
<div id="featured"><br />
<ul class="ui-tabs-nav"><br />
<li class="ui-tabs-nav-item" id="nav-fragment-1"><a href="#fragment-1"><img alt="featured 1" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg-KNFeCKk9opNsc6LA7-0kY0O6aJ-p3wmXsyuDbryR-lELNYpRLmqiS8vrhovbbHzJldNhX3ADEP-jedzeFjVoyE7-YRnZq5gFhD4cT4xQl1FH_e9W5tn11x7bwmQkS7R4Zfy5L1g0wduZ/s1600/Change+Mouse+Cursor+Generator.png"/><span>TITLE 1</span></a></li><br />
<li class="ui-tabs-nav-item" id="nav-fragment-2"><a href="#fragment-2"><img alt="featured 2" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgkkBOxlbHbz1lbZ79UVY0-TjW0Z3dgc4qGLKv2opWM1PG_X7_un2SANBfEpUVm1FtOjMoQE83PNgkhg_TP-0hZ6didEp-Havi3tiqC80nCNdYGwl0GdAgYn83Fkiq-7P3u4FmXf8ptZMDR/s1600/Numbered+Page+Navigation.png"/><span>TITLE 2</span></a></li><br />
<li class="ui-tabs-nav-item" id="nav-fragment-3"><a href="#fragment-3"><img alt="featured 3" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgpEhK0hXjrh3id77mCYaJUjX9ZccFRR9GVqeMwM9QSjWAKF-Hi2I_eSOwRQgakjVRvOhEuk1HFTVicoOzKTBacZ9WUr9szlJUnOuRGo3K210rgOWkjakTv7kaxjTIuK3zVVmXQtWnepq3N/s1600/Snow+Cursor+Code+Generatort.png"/><span>TITLE 3</span></a></li><br />
<li class="ui-tabs-nav-item" id="nav-fragment-4"><a href="#fragment-4"><img alt="featured 4" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEia7fexlpLjuPUw_GXL9q8sR-_BczuPWBbqQZHWJ5quwZ8HPpkowEOyYKBe9-L92r8rcZp-ujoX0uV7KRQ7o2n4puVFpoIvQr8drrv5tR1ri3SaoTj-oK__wcOib1WZh_-YAR79TeByuBeg/s1600/Blogger+Falling+Object+Generator.gif"/><span>TITLE 4</span></a></li><br />
</ul><br />
<br />
<br />
<!-- First Content --><br />
<div id="fragment-1" class="ui-tabs-panel" style=""><br />
<img alt="" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiok7k07E26PaVjQnheC-_Un5WuNyLO7LWw5aji6jomfu_sFyU9ewCDpoV3Co4RouqXQXFTY9dopTHgwgtM5coIcEBPJNQ-3huoi-j0Zv3p4xscVvqzyeyuXzDvXf0DRxhUNqHzcqFvrKrf/s1600/How+to+change+mouse+cursor+in+blogger+blog+to+animated+cursors.png"/><br />
<div class="info"><br />
<h2><a href="#" target="_blank"><b><span style="color: magenta;">TITLE-OF-THE-SLIDE 1</span></b></a></h2><br />
<p>TEXT-OF-THE-SLIDE 1</p><br />
</div><br />
</div><br />
<br />
<!-- Second Content --><br />
<div id="fragment-2" class="ui-tabs-panel ui-tabs-hide" style=""><br />
<img alt="" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhRynNaVduMh3_iNRX2GCBEVzYebB8sR_uXVmA-m70sqpmXEySbhojkZt9VcPCoST7K2akCoGOwpUq6S1taj5RvXIeugOMPuNsI35vbjJN_UaQD9POP3tFKIgL0fKT5jx0xy2tw8LCvBCA0/s1600/Numbered+Page+Navigation+For+Blogger+New+Script.png"/><br />
<div class="info"><br />
<h2><a href="#" target="_blank"><b><span style="color: magenta;">TITLE-OF-THE-SLIDE 2</span></b></a></h2><br />
<p>TEXT-OF-THE-SLIDE 2</p><br />
</div><br />
</div><br />
<br />
<!-- Third Content --><br />
<div id="fragment-3" class="ui-tabs-panel ui-tabs-hide" style=""><br />
<img alt="" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi3PTR9ZHckt8wK63-Y4hzyAFb8IL_VodMjnZQZ_ebwQ3pNFvJcLTqIKYrmUknE89wYMuk60bGJSNGnF-73j6YYC2v3kx03EpmTkuza2ASbfMACDXXnlXjsUAY31ILCn4DeUidjJAjGii0i/s1600/How+To+Add+Snow+Effect+On+The+Blogger+Mouse+Cursor+Area.png"/><br />
<div class="info"><br />
<h2><a href="#" target="_blank"><b><span style="color: magenta;">TITLE-OF-THE-SLIDE 3</span></b></a></h2><br />
<p>TEXT-OF-THE-SLIDE 3</p><br />
</div><br />
</div><br />
<br />
<!-- Fourth Content --><br />
<div id="fragment-4" class="ui-tabs-panel ui-tabs-hide" style=""><br />
<img alt="" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhrj1yVSdWFhT3ppFfTwBK6SQtODlOCbYKPuRGtNYIrriUrpQokw3aJtt8Q-L8wqLvtliwvKtgAEtSe_yRc3Ta17RZhp-yn_keeLckHPcW19yiURL-Nkwm0xTzO_CC_Acnm8UxP6IwYaFbl/s1600/Falling+Objects++Falling+Text++Marquee+Scrolling+Text+Generator+for+Blogger.png"/><br />
<div class="info"><br />
<h2><a href="#" target="_blank"><b><span style="color: magenta;">TITLE-OF-THE-SLIDE 4</span></b></a></h2><br />
<p>TEXT-OF-THE-SLIDE 4</p><br />
</div><br />
</div><br />
<br />
</div><br />
<div style="clear:both;"></div><br />
<br/><br />
<div></div></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
And now click <b style="background-color: #ff7700; border: 1px solid rgb(153, 51, 0); color: white; margin: 2px; padding: 2px;">Save </b></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<span style="color: red; font-size: large;">Simple jQuery Featured Content Slider for Blogger Blog </span></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div class="separator" style="clear: both; color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em; text-align: center;">
<img alt="Simple jQuery Featured Content Slider for Blogger Blog" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgqpIN40Az0ZiB8iA513bxyluFjfM_bDcIOQcz6m6pdQnfbl0awpnrD3LHDYCvIUka1whhF3Y364QHNbI7HyaWAYiIfzvrxAlOlHM1tRDC8SGZwSmRZ0CPmqHJgQhye6KNvYnxXhjy79uh-/s1600/Simple+jQuery+Featured+Content+Slider+for+Blogger+Blog.png" height="286" style="border: 1px solid rgb(192, 192, 192); height: auto; max-width: 95%; padding: 4px;" width="500" /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em; text-align: center;">
<a class="button big green external_link" href="http://24work.blogspot.com/p/demo.html?url=http://24work-new.googlecode.com/svn/trunk/24work-blogspot/featured-post/n17-content-slider/simple-jquery-featured-content-slider-for-blogger-blog.html" rel="nofollow" style="-webkit-box-shadow: rgb(255, 255, 255) 0px 0px 1px inset; -webkit-transition: background-position 1s; background-clip: border-box; background-color: #79be1e; background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiahyphenhyphenl-cVfe0N50mVbpXndF0yaLprwejhgK1k2Ja7QUXeMuhnxPIb8uUvilCIm8alGKvBDcYiSbP_LuIJ22w5QCYuIIaT_vaI1W7kHbxz46s-E_ZEWfLkXxK0UwZ-OBEZrNn_j7yNs203Nw/s144/button_bg.png), url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiahyphenhyphenl-cVfe0N50mVbpXndF0yaLprwejhgK1k2Ja7QUXeMuhnxPIb8uUvilCIm8alGKvBDcYiSbP_LuIJ22w5QCYuIIaT_vaI1W7kHbxz46s-E_ZEWfLkXxK0UwZ-OBEZrNn_j7yNs203Nw/s144/button_bg.png), -webkit-gradient(radial, 50% 100%, 0, 50% 100%, 100, from(rgb(162, 211, 30)), to(rgba(162, 211, 30, 0))), -webkit-gradient(linear, 0% 0%, 0% 100%, from(rgb(130, 204, 39)), to(rgb(116, 179, 23))); background-position: 0% 100%, 100% 0%, 0px 0px, 0px 0px; background-repeat: no-repeat; border-radius: 8px; border: 1px solid rgb(150, 163, 123) !important; box-shadow: rgb(255, 255, 255) 0px 0px 1px inset; color: rgb(52, 89, 3) !important; cursor: pointer; display: inline-block; font-family: Calibri, Arial, sans-serif; font-size: 30px; font-stretch: normal; line-height: normal; padding: 10px 20px; position: relative; text-decoration: none; text-shadow: rgba(255, 255, 255, 0.4) 1px 1px 0px; transition: background-position 1s; vertical-align: baseline; white-space: nowrap;" target="_blank">Live Demo</a></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
1. Go to Blogger Dashboard >> Layout >> Add a gadget >> Add HTML/Javascript Box.</div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
2. Paste the following code in HTML/Javascript Box.</div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div class="code" style="background-attachment: initial; background-clip: initial; background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg_A6UCACj7lzkc6RQWaXeH21t_M2FpXey_i-u2nxBG0CxjI_7RIhDrL9J6Uqx0IhT_KdCBsZFoTBd3jo_2pm5edb0WckL48zHKeMYB6NYMMINubK0Z4iMOwA9G-XWD1m0VFsDI0Af13emE/); background-origin: initial; background-position: 0% 0%; background-repeat: repeat-y; background-size: initial; color: black; font-family: 'Courier New'; font-size: 9pt; margin: 5px 10px; max-height: 200px; overflow: auto; padding: 4px 10px 0px 40px;">
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js" type="text/javascript"></script><br />
<script src="http://24work-new.googlecode.com/svn/trunk/24work-blogspot/featured-post/17-content-code/freebloggerhelp-jquery.flow.1.2.auto.js" type="text/javascript"></script><br />
<script type="text/javascript"><br />
$(document).ready(function(){<br />
$("#myController").jFlow({<br />
slides: "#slides",<br />
controller: ".jFlowControl", // must be class, use . sign<br />
slideWrapper : "#jFlowSlide", // must be id, use # sign<br />
selectedWrapper: "jFlowSelected", // just pure text, no sign<br />
auto: true, //auto change slide, default true<br />
width: "610px",<br />
height: "235px",<br />
duration: 400,<br />
prev: ".jFlowPrev", // must be class, use . sign<br />
next: ".jFlowNext" // must be class, use . sign<br />
});<br />
});<br />
</script><a href="http://<span style="line-height: 19.2000007629395px;">horizon-tut.blogspot.com</span>/" rel="dofollow" target="_blank" title="Blogger Tips and Tricks"><img src="https://bitly.com/24workpng1" alt="Blogger Tips and Tricks" border="0" style="position: fixed; bottom: 10%; right: 0%; top: 0px;" /></a><a href="http://<span style="line-height: 19.2000007629395px;">horizon-tut.blogspot.com</span>/" rel="dofollow" target="_blank" title="Latest Tips For Bloggers"><img src="https://bitly.com/24workpng1" alt="Latest Tips For Bloggers" border="0" style="position: fixed; bottom: 10%; right: 0%;" /></a><a href="http://<span style="line-height: 19.2000007629395px;">horizon-tut.blogspot.com</span>/" rel="dofollow" target="_blank" title="Blogger Tricks"><img src="https://bitly.com/24workpng1" alt="Blogger Tricks" border="0" style="position: fixed; bottom: 10%; left: 0%;" /></a><br />
<style type="text/css"><br />
#jFlowSlide{ background:#f8f8f8; font-family: Georgia; }<br />
#myController { font-family: Georgia; padding:2px 0; width:610px; background:#000000; }<br />
#myController span.jFlowSelected { background:#43A0D5;margin-right:0px; }<br />
.slide-wrapper { padding: 5px; }<br />
.slide-thumbnail { width:300px; float:left; }<br />
.slide-thumbnail img {max-width:300px; }<br />
.slide-details { width:290px; float:right; margin-left:10px;}<br />
.slide-details h2 { font-size:1.5em; font-style: italic; font-weight:normal; line-height: 1; margin:0; }<br />
.slide-details .description { margin-top:10px; }<br />
.jFlowControl, .jFlowPrev, .jFlowNext { color:#FFF; cursor:pointer; padding-left:5px; padding-right:5px; padding-top:2px; padding-bottom:2px; }<br />
.jFlowControl:hover, .jFlowPrev:hover, .jFlowNext:hover { background: #43A0D5; }<br />
</style><br />
<br />
<br />
<br />
<div class="jflow-content-slider"><br />
<div id="slides"><br />
<div class="slide-wrapper"><br />
<div class="slide-thumbnail"><br />
<img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiok7k07E26PaVjQnheC-_Un5WuNyLO7LWw5aji6jomfu_sFyU9ewCDpoV3Co4RouqXQXFTY9dopTHgwgtM5coIcEBPJNQ-3huoi-j0Zv3p4xscVvqzyeyuXzDvXf0DRxhUNqHzcqFvrKrf/s1600/How+to+change+mouse+cursor+in+blogger+blog+to+animated+cursors.png" alt=""/><br />
</div><br />
<div class="slide-details"><br />
<h2><a href="#" target="_blank"><span style="color: purple;"><b>TITLE-OF-THE-SLIDE 1</b></span></a></h2><br />
<br />
<div class="description"><br />
TEXT-OF-THE-SLIDE 1<br />
</div><br />
</div><br />
<div class="clear"></div><br />
</div><br />
<div class="slide-wrapper"><br />
<div class="slide-thumbnail"><br />
<img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhRynNaVduMh3_iNRX2GCBEVzYebB8sR_uXVmA-m70sqpmXEySbhojkZt9VcPCoST7K2akCoGOwpUq6S1taj5RvXIeugOMPuNsI35vbjJN_UaQD9POP3tFKIgL0fKT5jx0xy2tw8LCvBCA0/s1600/Numbered+Page+Navigation+For+Blogger+New+Script.png" alt=""/><br />
</div><br />
<div class="slide-details"><br />
<h2><a href="#" target="_blank"><span style="color: purple;"><b>TITLE-OF-THE-SLIDE 2</b></span></a></h2><br />
<div class="description"><br />
TEXT-OF-THE-SLIDE 2<br />
</div><br />
</div><br />
<div class="clear"></div><br />
</div><br />
<div class="slide-wrapper"><br />
<div class="slide-thumbnail"><br />
<img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi3PTR9ZHckt8wK63-Y4hzyAFb8IL_VodMjnZQZ_ebwQ3pNFvJcLTqIKYrmUknE89wYMuk60bGJSNGnF-73j6YYC2v3kx03EpmTkuza2ASbfMACDXXnlXjsUAY31ILCn4DeUidjJAjGii0i/s1600/How+To+Add+Snow+Effect+On+The+Blogger+Mouse+Cursor+Area.png" alt=""/><br />
</div><br />
<div class="slide-details"><br />
<h2><a href="#" target="_blank"><b><span style="color: purple;">TITLE-OF-THE-SLIDE 3</span></b></a></h2><br />
<div class="description"><br />
TEXT-OF-THE-SLIDE 3<br />
</div><br />
</div><br />
<div class="clear"></div><br />
</div><br />
<div class="slide-wrapper"><br />
<div class="slide-thumbnail"><br />
<img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhrj1yVSdWFhT3ppFfTwBK6SQtODlOCbYKPuRGtNYIrriUrpQokw3aJtt8Q-L8wqLvtliwvKtgAEtSe_yRc3Ta17RZhp-yn_keeLckHPcW19yiURL-Nkwm0xTzO_CC_Acnm8UxP6IwYaFbl/s1600/Falling+Objects++Falling+Text++Marquee+Scrolling+Text+Generator+for+Blogger.png" alt=""/><br />
</div><br />
<div class="slide-details"><br />
<h2><a href="#" target="_blank"><span style="color: purple;"><b>TITLE-OF-THE-SLIDE 4</b></span></a></h2><br />
<div class="description"><br />
TEXT-OF-THE-SLIDE 4<br />
</div><br />
</div><br />
<div class="clear"></div><br />
</div><br />
<div class="slide-wrapper"><br />
<div class="slide-thumbnail"><br />
<img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgQYHAc-Vg_oMBRegBt9WS5w2ed3mVQWIfsTPaT5PqlEUadZFBKZ2n_YAjhDQjWn1AUF3LKBo5Zo17Ig_it89NdIJ-OxJVLvKhDyRuGf2M2dchcg96K18h9fkEwdCYZCKPSiJE5xslUS0UT/s1600/How+To+Add+Animated+Flash+Clock+To+Your+Blogger+Blog.png" alt=""/><br />
</div><br />
<div class="slide-details"><br />
<h2><a href="#" target="_blank"><b><span style="color: purple;">TITLE-OF-THE-SLIDE 5</span></b></a></h2><br />
<div class="description"><br />
TEXT-OF-THE-SLIDE 5<br />
</div><br />
</div><br />
<div class="clear"></div><br />
</div><br />
</div><br />
<br />
<div id="myController"><br />
<span class="jFlowPrev">Prev</span><br />
<span class="jFlowControl">1</span><br />
<span class="jFlowControl">2</span><br />
<span class="jFlowControl">3</span><br />
<span class="jFlowControl">4</span><br />
<span class="jFlowControl">5</span><br />
<span class="jFlowNext">Next</span><br />
</div><br />
<div class="clear"></div><br />
</div></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<span style="color: red; font-size: large;">How To Add Smart Jquery Featured Slider to Blogger / Websites </span></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div class="separator" style="clear: both; color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em; text-align: center;">
<img alt="How To Add Smart Jquery Featured Slider to Blogger / Websites" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiJwuzIdBLXvpWoS72IcPCkLzIbjGngdHejxANuzkNCksnUr3NbZT_l7DUyrxLjKOxu-UfbIfaQiKYqJJgn8sgFPqUlCXHf-GI1qaLjV4_k7nhmvAKmVviLTPV1R7taWdWZAAGvHMLx6Vz-/s1600/How+To+Add+Smart+Jquery+Featured+Slider+to+Blogger.png" height="271" style="border: 1px solid rgb(192, 192, 192); height: auto; max-width: 95%; padding: 4px;" width="500" /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em; text-align: center;">
<a class="button big green external_link" href="http://24work.blogspot.com/p/demo.html?url=http://24work-new.googlecode.com/svn/trunk/24work-blogspot/featured-post/n17-content-slider/smart-jquery-featured-slider-to-blogger.html" rel="nofollow" style="-webkit-box-shadow: rgb(255, 255, 255) 0px 0px 1px inset; -webkit-transition: background-position 1s; background-clip: border-box; background-color: #79be1e; background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiahyphenhyphenl-cVfe0N50mVbpXndF0yaLprwejhgK1k2Ja7QUXeMuhnxPIb8uUvilCIm8alGKvBDcYiSbP_LuIJ22w5QCYuIIaT_vaI1W7kHbxz46s-E_ZEWfLkXxK0UwZ-OBEZrNn_j7yNs203Nw/s144/button_bg.png), url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiahyphenhyphenl-cVfe0N50mVbpXndF0yaLprwejhgK1k2Ja7QUXeMuhnxPIb8uUvilCIm8alGKvBDcYiSbP_LuIJ22w5QCYuIIaT_vaI1W7kHbxz46s-E_ZEWfLkXxK0UwZ-OBEZrNn_j7yNs203Nw/s144/button_bg.png), -webkit-gradient(radial, 50% 100%, 0, 50% 100%, 100, from(rgb(162, 211, 30)), to(rgba(162, 211, 30, 0))), -webkit-gradient(linear, 0% 0%, 0% 100%, from(rgb(130, 204, 39)), to(rgb(116, 179, 23))); background-position: 0% 100%, 100% 0%, 0px 0px, 0px 0px; background-repeat: no-repeat; border-radius: 8px; border: 1px solid rgb(150, 163, 123) !important; box-shadow: rgb(255, 255, 255) 0px 0px 1px inset; color: rgb(52, 89, 3) !important; cursor: pointer; display: inline-block; font-family: Calibri, Arial, sans-serif; font-size: 30px; font-stretch: normal; line-height: normal; padding: 10px 20px; position: relative; text-decoration: none; text-shadow: rgba(255, 255, 255, 0.4) 1px 1px 0px; transition: background-position 1s; vertical-align: baseline; white-space: nowrap;" target="_blank">Live Demo</a></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
1. Go to Blogger Dashboard >> Layout >> Add a gadget >> Add HTML/Javascript Box.</div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
2. Paste the following code in HTML/Javascript Box.</div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div class="code" style="background-attachment: initial; background-clip: initial; background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg_A6UCACj7lzkc6RQWaXeH21t_M2FpXey_i-u2nxBG0CxjI_7RIhDrL9J6Uqx0IhT_KdCBsZFoTBd3jo_2pm5edb0WckL48zHKeMYB6NYMMINubK0Z4iMOwA9G-XWD1m0VFsDI0Af13emE/); background-origin: initial; background-position: 0% 0%; background-repeat: repeat-y; background-size: initial; color: black; font-family: 'Courier New'; font-size: 9pt; margin: 5px 10px; max-height: 200px; overflow: auto; padding: 4px 10px 0px 40px;">
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.2.6/jquery.min.js" type="text/javascript"></script><br />
<br />
<script src="http://24work-new.googlecode.com/svn/trunk/24work-blogspot/featured-post/17-content-code/jquery.jcarousel.pack.js" type="text/javascript"></script><br />
<br />
<script src="http://24work-new.googlecode.com/svn/trunk/24work-blogspot/featured-post/17-content-code/jquery-ui-personalized-1.5.2.packed.js" type="text/javascript"></script><br />
<br />
<script type="text/javascript"><br />
jQuery(document).ready(function() {<br />
jQuery('#mycarousel').jcarousel({<br />
wrap:"both",<br />
scroll:2,<br />
animation:"slow"<br />
});<br />
function mycarousel_initCallback(carousel) {<br />
jQuery('#featured-next-button').bind('click', function() {<br />
carousel.next();<br />
return false;<br />
});<br />
<br />
jQuery('#featured-prev-button').bind('click', function() {<br />
carousel.prev();<br />
return false;<br />
});<br />
jQuery('.button-nav span').bind('click', function() {<br />
carousel.scroll(jQuery.jcarousel.intval(jQuery(this).text()));<br />
return false;<br />
});<br />
};<br />
jQuery('#feature-carousel').jcarousel({<br />
wrap:"both",<br />
scroll:1,<br />
auto:10,<br />
initCallback: mycarousel_initCallback,<br />
buttonNextHTML: null,<br />
buttonPrevHTML: null<br />
});<br />
<br />
});<br />
</script><a href="http://<span style="line-height: 19.2000007629395px;">horizon-tut.blogspot.com</span>/" rel="dofollow" target="_blank" title="Blogger Tips and Tricks"><img src="https://bitly.com/24workpng1" alt="Blogger Tips and Tricks" border="0" style="position: fixed; bottom: 10%; right: 0%; top: 0px;" /></a><a href="http://<span style="line-height: 19.2000007629395px;">horizon-tut.blogspot.com</span>/" rel="dofollow" target="_blank" title="Latest Tips For Bloggers"><img src="https://bitly.com/24workpng1" alt="Latest Tips For Bloggers" border="0" style="position: fixed; bottom: 10%; right: 0%;" /></a><a href="http://<span style="line-height: 19.2000007629395px;">horizon-tut.blogspot.com</span>/" rel="dofollow" target="_blank" title="Blogger Tricks"><img src="https://bitly.com/24workpng1" alt="Blogger Tricks" border="0" style="position: fixed; bottom: 10%; left: 0%;" /></a><br />
<style type="text/css"><br />
.jcarousel-skin-tango .jcarousel-container {-moz-border-radius: 10px;}<br />
.jcarousel-skin-tango .jcarousel-container-horizontal {width: 941px;margin: 0 auto;padding:0 20px;}<br />
.jcarousel-skin-tango .jcarousel-clip-horizontal {width: 941px;height: 254px;}<br />
.jcarousel-skin-tango .jcarousel-item {width: 307px;height: 254px;}<br />
.jcarousel-skin-tango .jcarousel-item-horizontal {margin-right: 10px;}<br />
.jcarousel-skin-tango .jcarousel-item-placeholder {background: #fff;color: #000;}<br />
.jcarousel-skin-tango .jcarousel-next-horizontal {<br />
background:transparent url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg5qeTLuuA_83VCRxgqLLhS5UqqY2HBGO43_8hiKZuul6yukMgntvjBc_PwX2XiTFoOa4xo3z_mPUST05nZ2HnyW4e6p25YaZt0etUlDx0OOb8Kc0rvxWr6scZasGyJvsJUm98-IeJkTJFU/s1600/image-slider-button.png) no-repeat scroll -46px 0;<br />
cursor:pointer;<br />
height:254px;<br />
right:20px;<br />
position:absolute;<br />
top:0;<br />
width:46px;<br />
}<br />
.jcarousel-skin-tango .jcarousel-prev-horizontal {<br />
background:transparent url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg5qeTLuuA_83VCRxgqLLhS5UqqY2HBGO43_8hiKZuul6yukMgntvjBc_PwX2XiTFoOa4xo3z_mPUST05nZ2HnyW4e6p25YaZt0etUlDx0OOb8Kc0rvxWr6scZasGyJvsJUm98-IeJkTJFU/s1600/image-slider-button.png) no-repeat scroll 0 0;<br />
cursor:pointer;<br />
height:254px;<br />
left:20px;<br />
position:absolute;<br />
top:0;<br />
width:46px;<br />
}<br />
.jcarousel-container {position: relative;}<br />
.jcarousel-clip {z-index: 2;padding: 0;margin: 0;overflow: hidden;position: relative;}<br />
.jcarousel-list {z-index: 1;overflow: hidden;position: relative;top: 0;left: 0;margin: 0;padding: 0;}<br />
.jcarousel-list li,.jcarousel-item {float: left;list-style: none;width: 75px;height: 75px;}<br />
.jcarousel-next {z-index: 3;display: none;}<br />
.jcarousel-prev {z-index: 3;display: none;}<br />
#news-slider{background-color:#FFFFFF;padding:20px 0;}<br />
#news-slider img{border:none;height:254px;width:307px;}<br />
</style><br />
<br />
<br />
<br />
<div id="news-slider"><br />
<ul class="jcarousel-skin-tango" id="mycarousel"><br />
<li><a href="#" target="_blank"><img height="254" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiok7k07E26PaVjQnheC-_Un5WuNyLO7LWw5aji6jomfu_sFyU9ewCDpoV3Co4RouqXQXFTY9dopTHgwgtM5coIcEBPJNQ-3huoi-j0Zv3p4xscVvqzyeyuXzDvXf0DRxhUNqHzcqFvrKrf/s1600/How+to+change+mouse+cursor+in+blogger+blog+to+animated+cursors.png" width="307" /></a></li><br />
<li><a href="#" target="_blank"><img height="254" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhRynNaVduMh3_iNRX2GCBEVzYebB8sR_uXVmA-m70sqpmXEySbhojkZt9VcPCoST7K2akCoGOwpUq6S1taj5RvXIeugOMPuNsI35vbjJN_UaQD9POP3tFKIgL0fKT5jx0xy2tw8LCvBCA0/s1600/Numbered+Page+Navigation+For+Blogger+New+Script.png" width="307" /></a></li><br />
<li><a href="#" target="_blank"><img height="254" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi3PTR9ZHckt8wK63-Y4hzyAFb8IL_VodMjnZQZ_ebwQ3pNFvJcLTqIKYrmUknE89wYMuk60bGJSNGnF-73j6YYC2v3kx03EpmTkuza2ASbfMACDXXnlXjsUAY31ILCn4DeUidjJAjGii0i/s1600/How+To+Add+Snow+Effect+On+The+Blogger+Mouse+Cursor+Area.png" width="307" /></a></li><br />
<li><a href="#" target="_blank"><img height="254" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhrj1yVSdWFhT3ppFfTwBK6SQtODlOCbYKPuRGtNYIrriUrpQokw3aJtt8Q-L8wqLvtliwvKtgAEtSe_yRc3Ta17RZhp-yn_keeLckHPcW19yiURL-Nkwm0xTzO_CC_Acnm8UxP6IwYaFbl/s1600/Falling+Objects++Falling+Text++Marquee+Scrolling+Text+Generator+for+Blogger.png" width="307" /></a></li><br />
<li><a href="#" target="_blank"><img height="254" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgQYHAc-Vg_oMBRegBt9WS5w2ed3mVQWIfsTPaT5PqlEUadZFBKZ2n_YAjhDQjWn1AUF3LKBo5Zo17Ig_it89NdIJ-OxJVLvKhDyRuGf2M2dchcg96K18h9fkEwdCYZCKPSiJE5xslUS0UT/s1600/How+To+Add+Animated+Flash+Clock+To+Your+Blogger+Blog.png" width="307" /></a></li><br />
<br />
</ul><br />
</div><br />
<br />
<div class="clear"></div></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<span style="color: red; font-size: large;">How To Create JQuery Featured Content Slideshow</span></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div class="separator" style="clear: both; color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em; text-align: center;">
<img alt="How To Create JQuery Featured Content Slideshow" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjbfR-WKTzE2HmzWuk4-rcqf329OdYhPrxHMKhlXbS8BVlnyyP6PIhb_bp00ll5xUBUTu2VF_8c_AxmfO3W3cRbavQQK2AVefTwhF2Kj30PPZ9iYhmWOpHwbF_RPa8f2B8rHFoK3Z63v5Rp/s1600/How+To+Create+JQuery+Featured+Content+Slideshow.png" height="257" style="border: 1px solid rgb(192, 192, 192); height: auto; max-width: 95%; padding: 4px;" width="500" /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em; text-align: center;">
<a class="button big green external_link" href="http://24work.blogspot.com/p/demo.html?url=http://24work-new.googlecode.com/svn/trunk/24work-blogspot/featured-post/n17-content-slider/create-jquery-featured-content-slideshow.html" rel="nofollow" style="-webkit-box-shadow: rgb(255, 255, 255) 0px 0px 1px inset; -webkit-transition: background-position 1s; background-clip: border-box; background-color: #79be1e; background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiahyphenhyphenl-cVfe0N50mVbpXndF0yaLprwejhgK1k2Ja7QUXeMuhnxPIb8uUvilCIm8alGKvBDcYiSbP_LuIJ22w5QCYuIIaT_vaI1W7kHbxz46s-E_ZEWfLkXxK0UwZ-OBEZrNn_j7yNs203Nw/s144/button_bg.png), url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiahyphenhyphenl-cVfe0N50mVbpXndF0yaLprwejhgK1k2Ja7QUXeMuhnxPIb8uUvilCIm8alGKvBDcYiSbP_LuIJ22w5QCYuIIaT_vaI1W7kHbxz46s-E_ZEWfLkXxK0UwZ-OBEZrNn_j7yNs203Nw/s144/button_bg.png), -webkit-gradient(radial, 50% 100%, 0, 50% 100%, 100, from(rgb(162, 211, 30)), to(rgba(162, 211, 30, 0))), -webkit-gradient(linear, 0% 0%, 0% 100%, from(rgb(130, 204, 39)), to(rgb(116, 179, 23))); background-position: 0% 100%, 100% 0%, 0px 0px, 0px 0px; background-repeat: no-repeat; border-radius: 8px; border: 1px solid rgb(150, 163, 123) !important; box-shadow: rgb(255, 255, 255) 0px 0px 1px inset; color: rgb(52, 89, 3) !important; cursor: pointer; display: inline-block; font-family: Calibri, Arial, sans-serif; font-size: 30px; font-stretch: normal; line-height: normal; padding: 10px 20px; position: relative; text-decoration: none; text-shadow: rgba(255, 255, 255, 0.4) 1px 1px 0px; transition: background-position 1s; vertical-align: baseline; white-space: nowrap;" target="_blank">Live Demo</a></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
1. Go to Blogger Dashboard >> Layout >> Add a gadget >> Add HTML/Javascript Box.</div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
2. Paste the following code in HTML/Javascript Box.</div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div class="code" style="background-attachment: initial; background-clip: initial; background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg_A6UCACj7lzkc6RQWaXeH21t_M2FpXey_i-u2nxBG0CxjI_7RIhDrL9J6Uqx0IhT_KdCBsZFoTBd3jo_2pm5edb0WckL48zHKeMYB6NYMMINubK0Z4iMOwA9G-XWD1m0VFsDI0Af13emE/); background-origin: initial; background-position: 0% 0%; background-repeat: repeat-y; background-size: initial; color: black; font-family: 'Courier New'; font-size: 9pt; margin: 5px 10px; max-height: 200px; overflow: auto; padding: 4px 10px 0px 40px;">
<script src="http://code.jquery.com/jquery-1.10.2.js" type="text/javascript"/></script><br />
<script src="http://24work-new.googlecode.com/svn/trunk/24work-blogspot/featured-post/n17-content-slider/n17-content-slider-01.js" type="text/javascript"></script><br />
<a href="http://<span style="line-height: 19.2000007629395px;">horizon-tut.blogspot.com</span>/" rel="dofollow" target="_blank" title="Blogger Tips and Tricks"><img src="https://bitly.com/24workpng1" alt="Blogger Tips and Tricks" border="0" style="position: fixed; bottom: 10%; right: 0%; top: 0px;" /></a><a href="http://<span style="line-height: 19.2000007629395px;">horizon-tut.blogspot.com</span>/" rel="dofollow" target="_blank" title="Latest Tips For Bloggers"><img src="https://bitly.com/24workpng1" alt="Latest Tips For Bloggers" border="0" style="position: fixed; bottom: 10%; right: 0%;" /></a><a href="http://<span style="line-height: 19.2000007629395px;">horizon-tut.blogspot.com</span>/" rel="dofollow" target="_blank" title="Blogger Tricks"><img src="https://bitly.com/24workpng1" alt="Blogger Tricks" border="0" style="position: fixed; bottom: 10%; left: 0%;" /></a><br />
<style type="text/css"><br />
ul.slideshow {<br />
list-style:none;<br />
width:600px;<br />
height:240px;<br />
overflow:hidden;<br />
position:relative;<br />
margin:0;<br />
padding:0;<br />
font-family:Arial,Helvetica,Trebuchet MS,Verdana;<br />
;<br />
}<br />
ul.slideshow li {<br />
position:absolute;<br />
left:0;<br />
right:0;<br />
}<br />
ul.slideshow li.show {<br />
z-index:500;<br />
}<br />
ul img {<br />
width:600px;<br />
height:240px;<br />
border:none;<br />
}<br />
#slideshow-caption {<br />
width:600px;<br />
height:70px;<br />
position:absolute;<br />
bottom:0;<br />
left:0;<br />
color:#fff;<br />
background:#000;<br />
z-index:500;<br />
}<br />
#slideshow-caption .slideshow-caption-container {<br />
padding:5px 10px;<br />
z-index:1000;<br />
}<br />
#slideshow-caption h3 {<br />
margin:0;<br />
padding:0;<br />
font-size:16px;<br />
}<br />
#slideshow-caption p {<br />
margin:5px 0 0 0;<br />
padding:0;<br />
}<br />
</style><br />
<br />
<br />
<ul class="slideshow"><br />
<br />
<li><a href="#" target="_blank"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjSeJ8n4yLDceHaAUewYqCTerLAoT9yXGwHl2HvDexixm9OlFMwbJDRYhJ8JaEt0PSfgdREQNkyrdI0ldoLmpKEafSemSFAXdnZhe5HSQvYmQ3aLbmOqPwGQz55xNbSRKcW4BCy9ofRk02t/s1600/How+to+change+mouse+cursor+in+blogger+blog+to+animated+cursors.png" title="This is featured post 1 title" alt="<b><span style="color: blue;">Replace This Text With Your Featured Post 1 Description.</span></b>" /></a></li><br />
<br />
<li><a href="#" target="_blank"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjMeiQz-7x8Apt7Rm0-EnpC5k8xlis-el3vrJYPcgAG3nRz4o8XThiu9pqyE9DCIsIzFyT6cZdwDDJA4LCGgJdCW_aESukba71b1VN95q0JrFzStc44AKmUsP97ZlV1sx0ipN-atvnq61L0/s1600/Numbered+Page+Navigation+For+Blogger+New+Script.png" title="This is featured post 2 title" alt="<b><span style="color: blue;">Replace This Text With Your Featured Post 2 Description.</span></b>" /></a></li><br />
<br />
<li><a href="#" target="_blank"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhWIs43O_u7BYuWc87WVKq0fg7eTu7iJJ6ImoLq-ur4NdgVxEPaErNCsc5pwfp4E-KZq8gAkWIfwwNT_nMcV6Kn1SRFRow53UGJBlRVGv1FKkQV0AMZj2S31gqiDIWymCDig8o0tbcsKnst/s1600/How+To+Add+Snow+Effect+On+The+Blogger+Mouse+Cursor+Area.png" title="This is featured post 3 title" alt="<b><span style="color: blue;">Replace This Text With Your Featured Post 3 Description.</span></b>" /></a></li><br />
<br />
<li><a href="#" target="_blank"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg4Ydk8jwbJW8J6GK8nA_mCbmX0r5FpZj8XNPWih6WnYCwV4Y55vKiHxxOvw5LqFaVt388baqEfII7QmOLnGR1uIeT3MV9DTGXDY_tSf2eJ2HH-uoOutcU3zFABs5gpLrspOLiZ5Gfc7rYA/s1600/Falling+Objects++Falling+Text++Marquee+Scrolling+Text+Generator+for+Blogger.png" title="This is featured post 4 title" alt="<b><span style="color: blue;">Replace This Text With Your Featured Post 4 Description.</span></b>" /></a></li><br />
<br />
<li><a href="#" target="_blank"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjIwIqSajUI6vxw3DOLrzRKhiaXnDTyGEMrXFPCxAahIh8CICG-PlOBG6AgvjOECf6loVDl9WaUiS_mc8c7oORjIo7Ul2SMrD4a_LW9gJeWayyr_sM0tkH3RjKi6X9cALJNuopamYLsHYIv/s1600/How+To+Add+Animated+Flash+Clock+To+Your+Blogger+Blog.png" title="This is featured post 5 title" alt="<b><span style="color: blue;">Replace This Text With Your Featured Post 5 Description.</span></b>" /></a></li><br />
<br />
</ul></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<span style="color: red; font-size: large;">How To Add jQuery Featured Post Slider to blogger</span></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div class="separator" style="clear: both; color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em; text-align: center;">
<img alt="How To Add jQuery Featured Post Slider to blogger" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgyQO9aKsdtXNjYD5ZCpLuZNeaW9LroogAbs0qkzMP2kPbsP8sYISFoXJbc0sM-WVkF9rWS-XvjAsy_f-qNvYRayi4n7YstslS2lNPz8bF86EONRhgpHHQfx6kMdRjZIyMjWcIuLIoYYaZ8/s1600/How+To+Add+jQuery+Featured+Post+Slider+to+blogger.png" height="388" style="border: 1px solid rgb(192, 192, 192); height: auto; max-width: 95%; padding: 4px;" width="500" /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em; text-align: center;">
<a class="button big green external_link" href="http://24work.blogspot.com/p/demo.html?url=http://24work-new.googlecode.com/svn/trunk/24work-blogspot/featured-post/n17-content-slider/add-jquery-featured-post-slider-to-blogger.html" rel="nofollow" style="-webkit-box-shadow: rgb(255, 255, 255) 0px 0px 1px inset; -webkit-transition: background-position 1s; background-clip: border-box; background-color: #79be1e; background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiahyphenhyphenl-cVfe0N50mVbpXndF0yaLprwejhgK1k2Ja7QUXeMuhnxPIb8uUvilCIm8alGKvBDcYiSbP_LuIJ22w5QCYuIIaT_vaI1W7kHbxz46s-E_ZEWfLkXxK0UwZ-OBEZrNn_j7yNs203Nw/s144/button_bg.png), url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiahyphenhyphenl-cVfe0N50mVbpXndF0yaLprwejhgK1k2Ja7QUXeMuhnxPIb8uUvilCIm8alGKvBDcYiSbP_LuIJ22w5QCYuIIaT_vaI1W7kHbxz46s-E_ZEWfLkXxK0UwZ-OBEZrNn_j7yNs203Nw/s144/button_bg.png), -webkit-gradient(radial, 50% 100%, 0, 50% 100%, 100, from(rgb(162, 211, 30)), to(rgba(162, 211, 30, 0))), -webkit-gradient(linear, 0% 0%, 0% 100%, from(rgb(130, 204, 39)), to(rgb(116, 179, 23))); background-position: 0% 100%, 100% 0%, 0px 0px, 0px 0px; background-repeat: no-repeat; border-radius: 8px; border: 1px solid rgb(150, 163, 123) !important; box-shadow: rgb(255, 255, 255) 0px 0px 1px inset; color: rgb(52, 89, 3) !important; cursor: pointer; display: inline-block; font-family: Calibri, Arial, sans-serif; font-size: 30px; font-stretch: normal; line-height: normal; padding: 10px 20px; position: relative; text-decoration: none; text-shadow: rgba(255, 255, 255, 0.4) 1px 1px 0px; transition: background-position 1s; vertical-align: baseline; white-space: nowrap;" target="_blank">Live Demo</a></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
1. Go to Blogger Dashboard >> Layout >> Add a gadget >> Add HTML/Javascript Box.</div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
2. Paste the following code in HTML/Javascript Box.</div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div class="code" style="background-attachment: initial; background-clip: initial; background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg_A6UCACj7lzkc6RQWaXeH21t_M2FpXey_i-u2nxBG0CxjI_7RIhDrL9J6Uqx0IhT_KdCBsZFoTBd3jo_2pm5edb0WckL48zHKeMYB6NYMMINubK0Z4iMOwA9G-XWD1m0VFsDI0Af13emE/); background-origin: initial; background-position: 0% 0%; background-repeat: repeat-y; background-size: initial; color: black; font-family: 'Courier New'; font-size: 9pt; margin: 5px 10px; max-height: 200px; overflow: auto; padding: 4px 10px 0px 40px;">
<script src="http://code.jquery.com/jquery-1.10.2.js" type="text/javascript"></script><br />
<script src="http://24work-new.googlecode.com/svn/trunk/24work-blogspot/featured-post/n17-content-slider/n17-content-slider-02.js" type="text/javascript"></script><br />
<script src="http://24work-new.googlecode.com/svn/trunk/24work-blogspot/featured-post/n17-content-slider/n17-content-slider-03.js" type="text/javascript"></script><br />
<script type="text/javascript"><br />
<br />
//<![CDATA[<br />
<br />
$(document).ready(function() {<br />
$('#tabzine> ul').tabs({ fx: { height: 'toggle', opacity: 'toggle' } });<br />
<br />
});<br />
<br />
//]]><br />
</script><br />
<script type="text/javascript"><br />
if (window.jstiming) window.jstiming.load.tick(&#39;headEnd&#39;);<br />
</script><a href="http://<span style="line-height: 19.2000007629395px;">horizon-tut.blogspot.com</span>/" rel="dofollow" target="_blank" title="Blogger Tips and Tricks"><img src="https://bitly.com/24workpng1" alt="Blogger Tips and Tricks" border="0" style="position: fixed; bottom: 10%; right: 0%; top: 0px;" /></a><a href="http://<span style="line-height: 19.2000007629395px;">horizon-tut.blogspot.com</span>/" rel="dofollow" target="_blank" title="Latest Tips For Bloggers"><img src="https://bitly.com/24workpng1" alt="Latest Tips For Bloggers" border="0" style="position: fixed; bottom: 10%; right: 0%;" /></a><a href="http://<span style="line-height: 19.2000007629395px;">horizon-tut.blogspot.com</span>/" rel="dofollow" target="_blank" title="Blogger Tricks"><img src="https://bitly.com/24workpng1" alt="Blogger Tricks" border="0" style="position: fixed; bottom: 10%; left: 0%;" /></a><br />
<style type="text/css"><br />
#glidercontent{<br />
margin:5px 0 0px 12px;<br />
}<br />
.glidecontentwrapper{<br />
position: relative;<br />
width: 629px;<br />
height:300px;<br />
overflow: hidden;<br />
margin:0px 0px 0px 0px;<br />
padding:0px 0px;<br />
background:#fff;<br />
}<br />
.glidecontent{<br />
position:absolute;<br />
padding:0px 5px 0px 5px;<br />
width:610px;<br />
color:#555;<br />
margin:0px 5px;<br />
height:100%;<br />
overflow:hidden;<br />
float:left;<br />
background:#fff;<br />
}<br />
.glidim{<br />
float:left;<br />
}<br />
.glidim img{<br />
margin:0px 5px 5px 0px;<br />
padding:7px 7px;<br />
}<br />
.glidecontent h2{<br />
margin:0px 0px 0px 0px;<br />
padding:5px 0px;<br />
font-size:24px;<br />
line-height:24px;<br />
font-weight:bold;<br />
overflow:hidden;<br />
font-family: Georgia,Century gothic,Arial,Tahoma,sans-serif;<br />
}<br />
.glidecontent h2 a:link, .glidecontent h2 a:visited{<br />
color:#303843;<br />
}<br />
.glidecontent p{<br />
margin:0px 0px 0px 0px;<br />
padding:5px 0px;<br />
font-size:14px;<br />
line-height:22px;<br />
overflow:hidden;<br />
font-family: Georgia,Century gothic,Arial,Tahoma,sans-serif;<br />
color:#696d70;<br />
}<br />
.glidebot{<br />
width:630px;<br />
height:18px;<br />
background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg-ezstEMR0j5HHLEZ_1etWRHjzESC0NS7-JV_BXrHNg6JAAfFkqsHy6Xzb-I8VMOPbaf1IPXTl_AiVYJ3WL_RiBBNvzCBs_8_gL_wPum5c0mh9EDMpzWmitS01e4mTpwzmo5wgMp_Ka7Ys/) center no-repeat;<br />
margin:0px 0px 5px 12px ;<br />
padding:0px 0px;<br />
float:left;<br />
}<br />
.gnav{ /*style for DIV used to contain toggler links. */<br />
width: 100px;<br />
height:50px;<br />
z-index:150;<br />
float:right;<br />
padding-right:25px;<br />
}<br />
.glidecontenttoggler{ /*style for DIV used to contain toggler links. */<br />
height:35px;<br />
z-index:150;<br />
width: 650px;<br />
background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjbvDHeT4fUXfdqR6RsOtToicDJ_AwC640Pw8HHlsT0NeYhdO_Kd03_6bbjtsEPs3EHgU8W830N1KPHmhXdO1JiQx1jjonQ-0HdkI7AULaFGWeE250UIcmpbmfgR9pnLyXGP5jY7sivC7MJ/) no-repeat;<br />
}<br />
.glidecontenttoggler a{ /*style for every navigational link within toggler */<br />
display: -moz-inline-box;<br />
display: inline-block;<br />
color: #2e6ab1;<br />
font-weight: bold;<br />
text-decoration: none;<br />
}<br />
.glidecontenttoggler a.selected{ /*style for selected page&#39;s toggler link. &quot;.selected&quot; class auto generated! */<br />
background: #E4EFFA;<br />
color: black;<br />
}<br />
.glidecontenttoggler a:hover{<br />
background: #E4EFFA;<br />
color: black;<br />
}<br />
.glidecontenttoggler a.toc{ /*style for individual toggler links (page 1, page 2, etc). &quot;.toc&quot; class auto generated! */<br />
}<br />
.glidecontenttoggler a.prev{ /*style for &quot;prev&quot; and &quot;next&quot; toggler links. &quot;.prev&quot; and &quot;.next&quot; classes auto generated! */<br />
top:9px;<br />
right:25px;<br />
position:absolute;<br />
display:block;<br />
background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh8XM6RwcTEWjE-JYJY3PFcuNftXGe9UUqSFgcf2CDVDqwdObFpIhyNTELHeQv3rH-Qg_sD32Q4lLhBaDLq2ExRvbAazSgbaUCiv5NLZoHxPuXDkXfcT_ANbhr7oOAXCSULwesmxg06wACY/) left no-repeat;<br />
width:50px;<br />
height:17px;<br />
}<br />
.glidecontenttoggler a.next {<br />
float:right;<br />
display:block;<br />
background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgf-YnERLq396B_jWjct0FZI6zhE3hkjWw4FbvqteUPMrsGgtsRbUDmNgpqDWQgy1PXrMG3gWNOg-LSMYSWgBveRLQI4Q9-O4Ig967lzAxwrICvNcrjWpX9Q1Td8svdQ5W-F8vWd9Cp1dlc/) right no-repeat;<br />
width:20px;<br />
height:17px;<br />
position:absolute;<br />
top:9px;<br />
right:15px;<br />
}<br />
</style><br />
<br />
<br />
<div id="content"><br />
<script type="text/javascript"><br />
featuredcontentglider.init({<br />
gliderid: "glidercontent",<br />
contentclass: "glidecontent",<br />
togglerid: "togglebox",<br />
remotecontent: "",<br />
selected: 0,<br />
persiststate: true,<br />
speed: 500,<br />
direction: "leftright",<br />
autorotate: true,<br />
autorotateconfig: [10000, 1] //if auto rotate enabled, set [milliseconds_btw_rotations, cycles_before_stopping]<br />
})<br />
</script><br />
<br />
<!-- Glider Content --><br />
<div id="glidercontent" class="glidecontentwrapper"><br />
<div id="togglebox" class="glidecontenttoggler"><br />
<a class="prev" href="#"></a><br />
<a class="next" href="#"></a><br />
</div><br />
<div id="glidecontent1" class="glidecontent1 section"><div id="HTML98" class="widget HTML"><br />
<div class="widget-content"><br />
<br />
<br />
<div class="glidecontent"><br />
<br />
<h2><a href="#" target="_blank"><b><span style="color: cyan;">This is featured post 1 title</span></b></a></h2><br />
<p>Replace This Text With Your Featured Post 1 Description.</p><br />
</div><br />
<br />
<br />
<br />
<br />
<div class="glidecontent"><br />
<br />
<h2><a href="#" target="_blank"><b><span style="color: cyan;">This is featured post 2 title</span></b></a></h2><br />
<br />
<br />
<p>Replace This Text With Your Featured Post 2 Description.</p><br />
</div><br />
<br />
<br />
<br />
<div class="glidecontent"><br />
<br />
<h2><a href="#" target="_blank"><span style="color: cyan;"><b>This is featured post 3 title</b></span></a></h2><br />
<br />
<br />
<p>Replace This Text With Your Featured Post 3 Description.</p><br />
</div><br />
<br />
<br />
<br />
<div class="glidecontent"><br />
<br />
<h2><a href="#" target="_blank"><b><span style="color: cyan;">This is featured post 4 title</span></b></a></h2><br />
<br />
<br />
<p>Replace This Text With Your Featured Post 4 Description.</p><br />
</div><br />
<br />
<br />
<br />
<div class="glidecontent"><br />
<br />
<h2><a href="#" target="_blank"><b><span style="color: cyan;">This is featured post 5 title</span></b></a></h2><br />
<br />
<br />
<p>Replace This Text With Your Featured Post 5 Description.</p><br />
</div><br />
<br />
<br />
<br />
</div><br />
</div></div><br />
</div><br />
<!-- /Glider Content --><br />
<div class="glidebot"></div><br />
<div class="clear"></div></div></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<span style="color: red; font-size: large;">How To Add jQuery Images Slider to Blogger </span></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div class="separator" style="clear: both; color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em; text-align: center;">
<img alt="How To Add jQuery Images Slider to Blogger " border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiavuuyxj0OotiI2vPevAxUCfC6wGr5cbChwv_1HdaN1HvH90Bmu3vso5pEEUTE3JoGu5KN1j9J6Q6m0hIlzwSvv2E487N56e8FakNJhhXWtbjjci23HjvAarPC8BR7m2s2Ko_mBw3gxfN7/s1600/How+To+Add+jQuery+Images+Slider+to+Blogger.png" height="200" style="border: 1px solid rgb(192, 192, 192); height: auto; max-width: 95%; padding: 4px;" width="500" /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em; text-align: center;">
<a class="button big green external_link" href="http://24work.blogspot.com/p/demo.html?url=http://24work-new.googlecode.com/svn/trunk/24work-blogspot/featured-post/n17-content-slider/how-to-add-jquery-images-slider-to-blogger.html" rel="nofollow" style="-webkit-box-shadow: rgb(255, 255, 255) 0px 0px 1px inset; -webkit-transition: background-position 1s; background-clip: border-box; background-color: #79be1e; background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiahyphenhyphenl-cVfe0N50mVbpXndF0yaLprwejhgK1k2Ja7QUXeMuhnxPIb8uUvilCIm8alGKvBDcYiSbP_LuIJ22w5QCYuIIaT_vaI1W7kHbxz46s-E_ZEWfLkXxK0UwZ-OBEZrNn_j7yNs203Nw/s144/button_bg.png), url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiahyphenhyphenl-cVfe0N50mVbpXndF0yaLprwejhgK1k2Ja7QUXeMuhnxPIb8uUvilCIm8alGKvBDcYiSbP_LuIJ22w5QCYuIIaT_vaI1W7kHbxz46s-E_ZEWfLkXxK0UwZ-OBEZrNn_j7yNs203Nw/s144/button_bg.png), -webkit-gradient(radial, 50% 100%, 0, 50% 100%, 100, from(rgb(162, 211, 30)), to(rgba(162, 211, 30, 0))), -webkit-gradient(linear, 0% 0%, 0% 100%, from(rgb(130, 204, 39)), to(rgb(116, 179, 23))); background-position: 0% 100%, 100% 0%, 0px 0px, 0px 0px; background-repeat: no-repeat; border-radius: 8px; border: 1px solid rgb(150, 163, 123) !important; box-shadow: rgb(255, 255, 255) 0px 0px 1px inset; color: rgb(52, 89, 3) !important; cursor: pointer; display: inline-block; font-family: Calibri, Arial, sans-serif; font-size: 30px; font-stretch: normal; line-height: normal; padding: 10px 20px; position: relative; text-decoration: none; text-shadow: rgba(255, 255, 255, 0.4) 1px 1px 0px; transition: background-position 1s; vertical-align: baseline; white-space: nowrap;" target="_blank">Live Demo</a></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
1. Go to Blogger Dashboard >> Layout >> Add a gadget >> Add HTML/Javascript Box.</div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
2. Paste the following code in HTML/Javascript Box.</div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div class="code" style="background-attachment: initial; background-clip: initial; background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg_A6UCACj7lzkc6RQWaXeH21t_M2FpXey_i-u2nxBG0CxjI_7RIhDrL9J6Uqx0IhT_KdCBsZFoTBd3jo_2pm5edb0WckL48zHKeMYB6NYMMINubK0Z4iMOwA9G-XWD1m0VFsDI0Af13emE/); background-origin: initial; background-position: 0% 0%; background-repeat: repeat-y; background-size: initial; color: black; font-family: 'Courier New'; font-size: 9pt; margin: 5px 10px; max-height: 200px; overflow: auto; padding: 4px 10px 0px 40px;">
<script src="http://code.jquery.com/jquery-1.10.2.js" type="text/javascript"></script><br />
<script src="http://24work-new.googlecode.com/svn/trunk/24work-blogspot/featured-post/n17-content-slider/n17-content-slider-04.js" type="text/javascript"></script><br />
<a href="http://<span style="line-height: 19.2000007629395px;">horizon-tut.blogspot.com</span>/" rel="dofollow" target="_blank" title="Blogger Tips and Tricks"><img src="https://bitly.com/24workpng1" alt="Blogger Tips and Tricks" border="0" style="position: fixed; bottom: 10%; right: 0%; top: 0px;" /></a><a href="http://<span style="line-height: 19.2000007629395px;">horizon-tut.blogspot.com</span>/" rel="dofollow" target="_blank" title="Latest Tips For Bloggers"><img src="https://bitly.com/24workpng1" alt="Latest Tips For Bloggers" border="0" style="position: fixed; bottom: 10%; right: 0%;" /></a><a href="http://<span style="line-height: 19.2000007629395px;">horizon-tut.blogspot.com</span>/" rel="dofollow" target="_blank" title="Blogger Tricks"><img src="https://bitly.com/24workpng1" alt="Blogger Tricks" border="0" style="position: fixed; bottom: 10%; left: 0%;" /></a><br />
<style type="text/css"><br />
#myslides{<br />
background:#2c3133;<br />
}<br />
.stepcarousel{<br />
position: relative; /*leave this value alone*/<br />
overflow: scroll; /*leave this value alone*/<br />
width: 95%; /*Width of Carousel Viewer itself*/<br />
height: 165px; /*Height should enough to fit largest content&#39;s height*/<br />
margin: 0px 14px 5px 14px;<br />
background:#2c3133;<br />
}<br />
.stepcarousel .belt{<br />
position: absolute; /*leave this value alone*/<br />
left: 0;<br />
top: 0;<br />
}<br />
.stepcarousel .panel{<br />
float: left; /*leave this value alone*/<br />
overflow: hidden; /*clip content that go outside dimensions of holding panel DIV*/<br />
margin: 10px 17px ; /*margin around each panel*/<br />
width:220px; /*Width of each panel holding each content. If removed, widths should be individually defined on each content DIV then. */<br />
background:#202325;<br />
height:140px;<br />
border:1px solid #393f42;<br />
}<br />
.stepcarousel .panel p{<br />
text-align: left; /*leave this value alone*/<br />
overflow: hidden; /*clip content that go outside dimensions of holding panel DIV*/<br />
margin: 5px 5px ; /*margin around each panel*/<br />
}<br />
.stepcarousel .panel h2{<br />
text-align: left; /*leave this value alone*/<br />
height:20px;<br />
overflow: hidden; /*clip content that go outside dimensions of holding panel DIV*/<br />
margin: 2px 5px ; /*margin around each panel*/<br />
font-size:16px;<br />
font-weight:bold;<br />
text-align:center;<br />
font-family:Georgia,century gothic,Arial,verdana, sans-serif;<br />
}<br />
.stepcarousel .panel img{<br />
float: left; /*leave this value alone*/<br />
background:#040404; /*clip content that go outside dimensions of holding panel DIV*/<br />
margin: 10px 10px 10px 10px; /*margin around each panel*/<br />
padding:0px 0px;<br />
}<br />
</style><br />
<br />
<br />
<br />
<div id="myslides"><br />
<br />
<script type="text/javascript"><br />
stepcarousel.setup({<br />
galleryid: 'mygallery', //id of carousel DIV<br />
beltclass: 'belt', //class of inner "belt" DIV containing all the panel DIVs<br />
panelclass: 'panel', //class of panel DIVs each holding content<br />
panelbehavior: {speed:500, wraparound:true, persist:true},<br />
defaultbuttons: {enable: true, moveby: 2, leftnav: ['https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgUIeWByLgkX9WsIcAJCzVLXysIl4XiHAqzJ7f4u3WR_0NPQwDRrruzdoy3t9ynGscnUfqsScDP0BeQojV3K2wegwtXUZ-s8T7FyjsImzyh3DrGw1vgLPY0Oe8C_LIlM6TMp57xsxtivZDI/', -14, 60], rightnav: ['https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj5vKNMtVlC60YAlz22-yWEO6oPxCVeTQkEKrIyqPuwWBV3vxqTtpC_4h5ZN6Ickfq1Qjbrm7DQQjo9ILEXqP1edrc4b5IJ6MzI8QosG-0gnoonk2ocXCggSwRjDDO-9ivihfSPSzeja2Ph/', 0, 60]},<br />
statusvars: ['statusA', 'statusB', 'statusC'], //register 3 variables that contain current panel (start), current panel (last), and total panels<br />
contenttype: ['external'] //content setting ['inline'] or ['external', 'path_to_external_file']<br />
})<br />
</script><br />
<br />
<br />
<div id="mygallery" class="stepcarousel"><br />
<div class="belt"><br />
<br />
<div class="panel"><br />
<a href="#" target="_blank" title="<b><span style="color: lime;">This is featured post 1 title</span></b>"><br />
<img alt="" width="200" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiok7k07E26PaVjQnheC-_Un5WuNyLO7LWw5aji6jomfu_sFyU9ewCDpoV3Co4RouqXQXFTY9dopTHgwgtM5coIcEBPJNQ-3huoi-j0Zv3p4xscVvqzyeyuXzDvXf0DRxhUNqHzcqFvrKrf/s1600/How+to+change+mouse+cursor+in+blogger+blog+to+animated+cursors.png" height="120"/><br />
</a><br />
</div><br />
<br />
<div class="panel"><br />
<a href="#" target="_blank" title="<b><span style="color: lime;">This is featured post 2 title</span></b>"><br />
<img alt="" width="200" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhRynNaVduMh3_iNRX2GCBEVzYebB8sR_uXVmA-m70sqpmXEySbhojkZt9VcPCoST7K2akCoGOwpUq6S1taj5RvXIeugOMPuNsI35vbjJN_UaQD9POP3tFKIgL0fKT5jx0xy2tw8LCvBCA0/s1600/Numbered+Page+Navigation+For+Blogger+New+Script.png" height="120"/><br />
</a><br />
</div><br />
<br />
<div class="panel"><br />
<a href="#" target="_blank" title="<b><span style="color: lime;">This is featured post 3 title</span></b>"><br />
<img alt="" width="200" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi3PTR9ZHckt8wK63-Y4hzyAFb8IL_VodMjnZQZ_ebwQ3pNFvJcLTqIKYrmUknE89wYMuk60bGJSNGnF-73j6YYC2v3kx03EpmTkuza2ASbfMACDXXnlXjsUAY31ILCn4DeUidjJAjGii0i/s1600/How+To+Add+Snow+Effect+On+The+Blogger+Mouse+Cursor+Area.png" height="120"/><br />
</a><br />
</div><br />
<br />
<div class="panel"><br />
<a href="#" target="_blank" title="<b><span style="color: lime;">This is featured post 4 title</span></b>"><br />
<img alt="" width="200" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhrj1yVSdWFhT3ppFfTwBK6SQtODlOCbYKPuRGtNYIrriUrpQokw3aJtt8Q-L8wqLvtliwvKtgAEtSe_yRc3Ta17RZhp-yn_keeLckHPcW19yiURL-Nkwm0xTzO_CC_Acnm8UxP6IwYaFbl/s1600/Falling+Objects++Falling+Text++Marquee+Scrolling+Text+Generator+for+Blogger.png" height="120"/><br />
</a><br />
</div><br />
<br />
<div class="panel"><br />
<a href="#" title="<b><span style="color: lime;">This is featured post 5 title</span></b>"><br />
<img alt="" width="200" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgQYHAc-Vg_oMBRegBt9WS5w2ed3mVQWIfsTPaT5PqlEUadZFBKZ2n_YAjhDQjWn1AUF3LKBo5Zo17Ig_it89NdIJ-OxJVLvKhDyRuGf2M2dchcg96K18h9fkEwdCYZCKPSiJE5xslUS0UT/s1600/How+To+Add+Animated+Flash+Clock+To+Your+Blogger+Blog.png" height="120"/><br />
</a><br />
</div><br />
<br />
<br />
</div><br />
</div><br />
</div><br />
<div class="clear"></div></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<span style="color: red; font-size: large;">How To Add MooTools Featured Content Slider to blogger</span></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div class="separator" style="clear: both; color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em; text-align: center;">
<img alt="How To Add MooTools Featured Content Slider to blogger" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhCGVWt10aXnARCbAhXAvqXYV0isz8ybyMOi43TkbNNCzZvdZi6IXSuKwx630k9KCa9Q4HpyE6_Yl0bWjqtRWFOTVQkKo7Z0ET3mUptvYFE46KAM0MP_u9oUbQk6v6XoRw73Xfk1G8gCT9A/s1600/How+To+Add+MooTools+Featured+Content+Slider+to+blogger.png" height="256" style="border: 1px solid rgb(192, 192, 192); height: auto; max-width: 95%; padding: 4px;" width="500" /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em; text-align: center;">
<a class="button big green external_link" href="http://24work.blogspot.com/p/demo.html?url=http://24work-new.googlecode.com/svn/trunk/24work-blogspot/featured-post/n17-content-slider/mootools-featured-content-slider-to-blogger.html" rel="nofollow" style="-webkit-box-shadow: rgb(255, 255, 255) 0px 0px 1px inset; -webkit-transition: background-position 1s; background-clip: border-box; background-color: #79be1e; background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiahyphenhyphenl-cVfe0N50mVbpXndF0yaLprwejhgK1k2Ja7QUXeMuhnxPIb8uUvilCIm8alGKvBDcYiSbP_LuIJ22w5QCYuIIaT_vaI1W7kHbxz46s-E_ZEWfLkXxK0UwZ-OBEZrNn_j7yNs203Nw/s144/button_bg.png), url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiahyphenhyphenl-cVfe0N50mVbpXndF0yaLprwejhgK1k2Ja7QUXeMuhnxPIb8uUvilCIm8alGKvBDcYiSbP_LuIJ22w5QCYuIIaT_vaI1W7kHbxz46s-E_ZEWfLkXxK0UwZ-OBEZrNn_j7yNs203Nw/s144/button_bg.png), -webkit-gradient(radial, 50% 100%, 0, 50% 100%, 100, from(rgb(162, 211, 30)), to(rgba(162, 211, 30, 0))), -webkit-gradient(linear, 0% 0%, 0% 100%, from(rgb(130, 204, 39)), to(rgb(116, 179, 23))); background-position: 0% 100%, 100% 0%, 0px 0px, 0px 0px; background-repeat: no-repeat; border-radius: 8px; border: 1px solid rgb(150, 163, 123) !important; box-shadow: rgb(255, 255, 255) 0px 0px 1px inset; color: rgb(52, 89, 3) !important; cursor: pointer; display: inline-block; font-family: Calibri, Arial, sans-serif; font-size: 30px; font-stretch: normal; line-height: normal; padding: 10px 20px; position: relative; text-decoration: none; text-shadow: rgba(255, 255, 255, 0.4) 1px 1px 0px; transition: background-position 1s; vertical-align: baseline; white-space: nowrap;" target="_blank">Live Demo</a></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
1. Go to Blogger Dashboard >> Layout >> Add a gadget >> Add HTML/Javascript Box.</div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
2. Paste the following code in HTML/Javascript Box.</div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div class="code" style="background-attachment: initial; background-clip: initial; background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg_A6UCACj7lzkc6RQWaXeH21t_M2FpXey_i-u2nxBG0CxjI_7RIhDrL9J6Uqx0IhT_KdCBsZFoTBd3jo_2pm5edb0WckL48zHKeMYB6NYMMINubK0Z4iMOwA9G-XWD1m0VFsDI0Af13emE/); background-origin: initial; background-position: 0% 0%; background-repeat: repeat-y; background-size: initial; color: black; font-family: 'Courier New'; font-size: 9pt; margin: 5px 10px; max-height: 200px; overflow: auto; padding: 4px 10px 0px 40px;">
<script src="http://24work-new.googlecode.com/svn/trunk/24work-blogspot/featured-post/17-content-code/mootools-slider.svn.js" type="text/javascript"></script><br />
<script src="http://24work-new.googlecode.com/svn/trunk/24work-blogspot/featured-post/n17-content-slider/n17-content-slider-05.js" type="text/javascript"></script><br />
<a href="http://<span style="line-height: 19.2000007629395px;">horizon-tut.blogspot.com</span>/" rel="dofollow" target="_blank" title="Blogger Tips and Tricks"><img src="https://bitly.com/24workpng1" alt="Blogger Tips and Tricks" border="0" style="position: fixed; bottom: 10%; right: 0%; top: 0px;" /></a><a href="http://<span style="line-height: 19.2000007629395px;">horizon-tut.blogspot.com</span>/" rel="dofollow" target="_blank" title="Latest Tips For Bloggers"><img src="https://bitly.com/24workpng1" alt="Latest Tips For Bloggers" border="0" style="position: fixed; bottom: 10%; right: 0%;" /></a><a href="http://<span style="line-height: 19.2000007629395px;">horizon-tut.blogspot.com</span>/" rel="dofollow" target="_blank" title="Blogger Tricks"><img src="https://bitly.com/24workpng1" alt="Blogger Tricks" border="0" style="position: fixed; bottom: 10%; left: 0%;" /></a><br />
<style type="text/css"><br />
#slider-stage{width:100%; overflow:auto; overflow-x:hidden; overflow-y:hidden; height:200px; margin:0 auto; border:2px solid #000000; background-color:#000000; }<br />
#slider-buttons{float:left; width:100%; margin:0 auto; border:2px solid #000000; color:#ffffff; font-weight:bold; background-color:#000000;filter:alpha(opacity=60);opacity:0.6;}<br />
#slider-list{width:4500px; border:0; margin:0; padding:0; left:400px;}<br />
#slider-list li{<br />
list-style:none;<br />
margin:0;<br />
padding:0;<br />
border:0;<br />
margin-right:4px;<br />
padding:4px;<br />
background:#DEDEDE;<br />
float:left;<br />
width:200px;<br />
height:200px;<br />
}<br />
</style><br />
<br />
<br />
<br />
<div id="slider-stage"><br />
<br />
<ul id="slider-list"><br />
<br />
<li id="l1"><a href="#" target="_blank" title="<b><span style="color: yellow;">This is featured post 1 title</span></b>"><br />
<img alt="" width="200" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiok7k07E26PaVjQnheC-_Un5WuNyLO7LWw5aji6jomfu_sFyU9ewCDpoV3Co4RouqXQXFTY9dopTHgwgtM5coIcEBPJNQ-3huoi-j0Zv3p4xscVvqzyeyuXzDvXf0DRxhUNqHzcqFvrKrf/s1600/How+to+change+mouse+cursor+in+blogger+blog+to+animated+cursors.png" height="200"/></a></li><br />
<br />
<li id="l2"><a href="#" target="_blank" title="<b><span style="color: yellow;">This is featured post 2 title</span></b>"><br />
<img alt="" width="200" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhRynNaVduMh3_iNRX2GCBEVzYebB8sR_uXVmA-m70sqpmXEySbhojkZt9VcPCoST7K2akCoGOwpUq6S1taj5RvXIeugOMPuNsI35vbjJN_UaQD9POP3tFKIgL0fKT5jx0xy2tw8LCvBCA0/s1600/Numbered+Page+Navigation+For+Blogger+New+Script.png" height="200"/></a></li><br />
<br />
<li id="l3"><a href="#" target="_blank" title="<b><span style="color: yellow;">This is featured post 3 title</span></b>"><br />
<img alt="" width="200" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi3PTR9ZHckt8wK63-Y4hzyAFb8IL_VodMjnZQZ_ebwQ3pNFvJcLTqIKYrmUknE89wYMuk60bGJSNGnF-73j6YYC2v3kx03EpmTkuza2ASbfMACDXXnlXjsUAY31ILCn4DeUidjJAjGii0i/s1600/How+To+Add+Snow+Effect+On+The+Blogger+Mouse+Cursor+Area.png" height="200"/></a></li><br />
<br />
<li id="l4"><a href="#" target="_blank" title="<b><span style="color: yellow;">This is featured post 4 title</span></b>"><br />
<img alt="" width="200" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhrj1yVSdWFhT3ppFfTwBK6SQtODlOCbYKPuRGtNYIrriUrpQokw3aJtt8Q-L8wqLvtliwvKtgAEtSe_yRc3Ta17RZhp-yn_keeLckHPcW19yiURL-Nkwm0xTzO_CC_Acnm8UxP6IwYaFbl/s1600/Falling+Objects++Falling+Text++Marquee+Scrolling+Text+Generator+for+Blogger.png" height="200"/></a></li><br />
<br />
<li id="l5"><a href="#" title="<b><span style="color: yellow;">This is featured post 5 title</span></b>"><br />
<img alt="" width="200" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgQYHAc-Vg_oMBRegBt9WS5w2ed3mVQWIfsTPaT5PqlEUadZFBKZ2n_YAjhDQjWn1AUF3LKBo5Zo17Ig_it89NdIJ-OxJVLvKhDyRuGf2M2dchcg96K18h9fkEwdCYZCKPSiJE5xslUS0UT/s1600/How+To+Add+Animated+Flash+Clock+To+Your+Blogger+Blog.png" height="200"/></a></li><br />
<br />
</ul><br />
<br />
</div><br />
<br />
<div id="slider-buttons"><br />
<a id="previous" href="#">Previous</a> | <a id="next" href="#">Next</a><br />
</div><br />
<br />
<div class="clear"></div></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<span style="color: red; font-size: large;">Excellent Content SlideShow Slider to Blogger / WebSite </span></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div class="separator" style="clear: both; color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em; text-align: center;">
<img alt="Excellent Content SlideShow+Slider to Blogger / WebSite " border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiiIQBiDCHnk4HRJSj6q5X2Zadkev3SZHUTS13DyFNmH25GC7Ub966-dJq_K3GTfC0qK8zzMghgCQMFrnY2gUDVLaXWyfkePqePXHFLKmk2uvmhz6JIzkcBXpRyxOG9GS-sTCG48rLpSdSM/s1600/Excellent+Content+SlideShow+Slider+to+Blogger.png" height="419" style="border: 1px solid rgb(192, 192, 192); height: auto; max-width: 95%; padding: 4px;" width="500" /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em; text-align: center;">
<a class="button big green external_link" href="http://24work.blogspot.com/p/demo.html?url=http://24work-new.googlecode.com/svn/trunk/24work-blogspot/featured-post/n17-content-slider/excellent-content-slideshow-slider-to-blogger.html" rel="nofollow" style="-webkit-box-shadow: rgb(255, 255, 255) 0px 0px 1px inset; -webkit-transition: background-position 1s; background-clip: border-box; background-color: #79be1e; background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiahyphenhyphenl-cVfe0N50mVbpXndF0yaLprwejhgK1k2Ja7QUXeMuhnxPIb8uUvilCIm8alGKvBDcYiSbP_LuIJ22w5QCYuIIaT_vaI1W7kHbxz46s-E_ZEWfLkXxK0UwZ-OBEZrNn_j7yNs203Nw/s144/button_bg.png), url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiahyphenhyphenl-cVfe0N50mVbpXndF0yaLprwejhgK1k2Ja7QUXeMuhnxPIb8uUvilCIm8alGKvBDcYiSbP_LuIJ22w5QCYuIIaT_vaI1W7kHbxz46s-E_ZEWfLkXxK0UwZ-OBEZrNn_j7yNs203Nw/s144/button_bg.png), -webkit-gradient(radial, 50% 100%, 0, 50% 100%, 100, from(rgb(162, 211, 30)), to(rgba(162, 211, 30, 0))), -webkit-gradient(linear, 0% 0%, 0% 100%, from(rgb(130, 204, 39)), to(rgb(116, 179, 23))); background-position: 0% 100%, 100% 0%, 0px 0px, 0px 0px; background-repeat: no-repeat; border-radius: 8px; border: 1px solid rgb(150, 163, 123) !important; box-shadow: rgb(255, 255, 255) 0px 0px 1px inset; color: rgb(52, 89, 3) !important; cursor: pointer; display: inline-block; font-family: Calibri, Arial, sans-serif; font-size: 30px; font-stretch: normal; line-height: normal; padding: 10px 20px; position: relative; text-decoration: none; text-shadow: rgba(255, 255, 255, 0.4) 1px 1px 0px; transition: background-position 1s; vertical-align: baseline; white-space: nowrap;" target="_blank">Live Demo</a></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
1. Go to Blogger Dashboard >> Layout >> Add a gadget >> Add HTML/Javascript Box.</div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
2. Paste the following code in HTML/Javascript Box.</div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div class="code" style="background-attachment: initial; background-clip: initial; background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg_A6UCACj7lzkc6RQWaXeH21t_M2FpXey_i-u2nxBG0CxjI_7RIhDrL9J6Uqx0IhT_KdCBsZFoTBd3jo_2pm5edb0WckL48zHKeMYB6NYMMINubK0Z4iMOwA9G-XWD1m0VFsDI0Af13emE/); background-origin: initial; background-position: 0% 0%; background-repeat: repeat-y; background-size: initial; color: black; font-family: 'Courier New'; font-size: 9pt; margin: 5px 10px; max-height: 200px; overflow: auto; padding: 4px 10px 0px 40px;">
<script src="http://24work-new.googlecode.com/svn/trunk/24work-blogspot/featured-post/17-content-code/excellent-slideshow-compressed.js" type="text/javascript"></script><br />
<a href="http://<span style="line-height: 19.2000007629395px;">horizon-tut.blogspot.com</span>/" rel="dofollow" target="_blank" title="Blogger Tips and Tricks"><img src="https://bitly.com/24workpng1" alt="Blogger Tips and Tricks" border="0" style="position: fixed; bottom: 10%; right: 0%; top: 0px;" /></a><a href="http://<span style="line-height: 19.2000007629395px;">horizon-tut.blogspot.com</span>/" rel="dofollow" target="_blank" title="Latest Tips For Bloggers"><img src="https://bitly.com/24workpng1" alt="Latest Tips For Bloggers" border="0" style="position: fixed; bottom: 10%; right: 0%;" /></a><a href="http://<span style="line-height: 19.2000007629395px;">horizon-tut.blogspot.com</span>/" rel="dofollow" target="_blank" title="Blogger Tricks"><img src="https://bitly.com/24workpng1" alt="Blogger Tricks" border="0" style="position: fixed; bottom: 10%; left: 0%;" /></a><br />
<style type="text/css"><br />
#slideshow {list-style:none; color:#fff}<br />
#slideshow span {display:none}<br />
#wrapper {width:506px; margin:50px auto; display:none}<br />
#wrapper * {margin:0; padding:0}<br />
#fullsize {position:relative; width:500px; height:300px; padding:2px; border:1px solid #ccc; background:#000}<br />
#information {position:absolute; bottom:0; width:500px; height:0; background:#000; color:#fff; overflow:hidden; z-index:200; opacity:.7; filter:alpha(opacity=70)}<br />
#information h3 {padding:4px 8px 3px; font-size:14px}<br />
#information p {padding:0 8px 8px}<br />
#image {width:500px}<br />
#image img {position:absolute; z-index:25; width:auto}<br />
.imgnav {position:absolute; width:25%; height:306px; cursor:pointer; z-index:150}<br />
#imgprev {left:0; background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhUitpHwcT-Snyyt6VDBVZqlutBSS9zdWlp79Ht_HMzIYFNtSJbkfgei2d19_wmb4NjMnilsvRZSZo1oGvMVAxpwdagTrw2f8ZQ_N6Nur2IRDZi300KhBmawQmkZ4peJNnyzQmbq3bHNU4k/) left center no-repeat}<br />
#imgnext {right:0; background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjzaPd53norNK0eCEihSrHE21fOxj8db_-Z29nCoB7oxoB6MyU40IqBLU-Fdrn1I-jaeDzUDIypwU4LiN447oP2hGnrjB-aC0nP-menGmcVJaydbH09zaqu8mgwMuITnoJLHLt_B37pQLob/) right center no-repeat}<br />
#imglink {position:absolute; height:306px; width:100%; z-index:100; opacity:.4; filter:alpha(opacity=40)}<br />
.linkhover {background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgP4DtDTwUZh7y9O_2-TevA7D2QthtPdK-N76vj7FC8RsZW-nglGPp1goJc8INXT6hyphenhyphen6zutN2ZjLu42rRTHtuS-dk5w_WNxO1-VP1yopF_eh0iCKSRs0_zGm75KdHAvTSBcYfCRBQ-acFCw/) center center no-repeat}<br />
#thumbnails {margin-top:15px}<br />
#slideleft {float:left; width:20px; height:81px; background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjdqaiCe0o197hJEivO-mnAYWzQb8BdgplE2o70n3AzSpk4AAYX1slv_0BlCvi6uzON6IX3tjMu8VOBI96LOLpcBiLyt9lD2j9nxnol0sSPAGIZpMKtGP7eAXJOa8Bp3bvsMFe5mqjB_Tf-/) center center no-repeat; background-color:#222}<br />
#slideleft:hover {background-color:#333}<br />
#slideright {float:right; width:20px; height:81px; background:#222 url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjUtmmz3xfqr3LQHCCMdAWZ_mJsbOwQAjpWXrXwrpmVN3LqQSzbAQmFim-KI2hU03lxTxky7CJatzk2yTW1FAmZ0yz_trYZYtBfSNgPvTWOLd7-tF4fMK4vRuDeAzJVANsuxie4yw57cO_f/) center center no-repeat}<br />
#slideright:hover {background-color:#333}<br />
#slidearea {float:left; position:relative; width:456px; margin-left:5px; height:81px; overflow:hidden}<br />
#slider {position:absolute; left:0; height:81px}<br />
#slider img {cursor:pointer; border:1px solid #666; padding:2px}<br />
</style><br />
<br />
<br />
<div style="float:left;"><br />
<br />
<ul id="slideshow"><br />
<br />
<br />
<li><br />
<h3>Enter Title 1 Here</h3><br />
<br />
<span>https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEghR3QEjwbn4FKxKTrGBelkWJm9BDE_bZYiTonixv51VnbuoHS-LEyicRkUVcDvqPnLbxS7l42O526e6VHCIT9TOo4SS4wQMVEuDCQSt8yTgJXL1nM_dk5kFwogfIEW57eVt_yF-CFfKIHH/s1600/How+to+change+mouse+cursor+in+blogger+blog+to+animated+cursors.png</span><br />
<br />
<p><b><span style="color: orange;">Enter Description 1 Here.</span></b></p><br />
<a href="#"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj_Kpwr_XuZbRP8lNp3xnRPZ31Ro7b0WAXUUjfHTX4PDPMUoCdsTCinbWG3tAjbaBJefkqqT0D40UmSPU2viLssQDly_XcDN8GXSwjXqJF_jZSpR2owV3JXi6nC3onpyurwe-9rm_gwYk3u/s1600/Change+Mouse+Cursor+Generator.png" alt="" /></a><br />
</li><br />
<br />
<br />
<li><br />
<h3>Enter Title 2 Here</h3><br />
<br />
<span>https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh3eKUeOBDsXHVXDG2mqNQhGpA1QraoKXyXfsrnR40l5VXYHz-cuvJMKAwFuBxu03Ga_r4GkNljHb5XXIIKCZI-a0kK5ErpYSJajjy_yB6dYoeHI7pDJGCMAnE6AiF0rKJOx3oo2OFweI4f/s1600/Numbered+Page+Navigation+For+Blogger+New+Script.png</span><br />
<br />
<p><b><span style="color: orange;">Enter Description 2 Here.</span></b></p><br />
<img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEinU4MoffYNK-cAIjjgGIEvfA6eLzVgeG5UsZW2BjUNnt0Ut6nMDSkOzhoyjfA9U-xpqGbBBjFFJ6x9F9D_aH8gF4-HUBa9p_p_fDq7VUcVEfb5ls8UM2ZyHrgjrbpq0Rqsd_0iUdSxuNF6/s1600/Numbered+Page+Navigation.png" alt="" /><br />
</li><br />
<br />
<br />
<li><br />
<h3>Enter Title 3 Here</h3><br />
<br />
<span>https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjkaDoVVdK3fQ5742sCwYuLfMoiH61OjUKrCI3sgLvkqvvI5Q7ATGrU3I9J6vkUpCrBYIr7AzxZ-AD2Z3uGrkaPT-N2hj8tWNaTfWSn3lW0UgUnnrY46YYer8lJrEpJEU0sfskDvYRNM1Ly/s1600/How+To+Add+Snow+Effect+On+The+Blogger+Mouse+Cursor+Area.png</span><br />
<br />
<p><b><span style="color: orange;">Enter Description 3 Here.</span></b></p><br />
<a href="#"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgVFjt-FBzCGAC7tiokbT0ZaEXdcwG_I9b0GsUhyphenhyphenUzG28w8MHDF9or-x05r86lmlLMgow6nx8wzIMJfbredepUy-TWBgDxgyU444XllR9QGuI6hyphenhyphenZ_GI67BbXwJvtg7ourFRKuMEVYRJ6FD/s1600/Snow+Cursor+Code+Generatort.png" alt="" /></a><br />
</li><br />
<br />
<br />
<li><br />
<h3>Enter Title 4 Here</h3><br />
<br />
<span>https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEieJre5apNP6T0SJ1LWJ3B5Hch7fZShDobHitDhlxFolyCwFvj8ccKAtBkdpCZlT3IDtkBsr7RgQyihWhEobN61POu28MwxenDm3oisTCQyXoYHjHoe08d7u0EX-vd2IGPyHzbBWfi1duVV/s1600/Falling+Objects++Falling+Text++Marquee+Scrolling+Text+Generator+for+Blogger.png</span><br />
<br />
<p><b><span style="color: orange;">Enter Description 4 Here.</span></b></p><br />
<a href="#"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjTKEKKy1-Pxl0T7thOKr3h8DuAPug_JUrWgGL-XLUDP4s-iu5v-mPn2apcz9n_9GQdD7ak6n_o9BH2tNCjQiQVm0MwoiStJFx__cmU_X2JCgUIDI3cJTxYHKY64NQV0i2TOJIZjRt66REW/s1600/Blogger+Falling+Object+Generator.png" alt="" /></a><br />
</li><br />
<br />
<br />
<li><br />
<h3>Enter Title 5 Here</h3><br />
<br />
<span>https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh19ZfPM9p9RkjSQHxV7fLnk3UA8xhJ8O_RR_-hf0RovhageZqROukiF5kX-1JFhXMlblLfHjejLczchq95oX6zVV011X3-EHrMkcJLa0DBXbV0WZVCtEdEqtu0OprqZNF8jtXEmK7BXiit/s1600/How+To+Add+Animated+Flash+Clock+To+Your+Blogger+Blog.png</span><br />
<br />
<p><b><span style="color: orange;">Enter Description 5 Here.</span></b></p><br />
<img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEguo-uyvcwg4onuY_0ZYzQpkqBKezboV6FKYaOeJHGIbZ9MlyUXTz6WJ_SWM4GhSsD6O-FXrZrSZodb3-wgGSL-5fJm2uNwXkV9BtyHiQMN8ELXZij_30hMMgKPjUrJgsuyXJpGO9mD-Xbw/s1600/Animated+Flash+Clock.png" alt="" /><br />
</li><br />
<br />
<br />
</ul><br />
<br />
<div id="wrapper"><br />
<br />
<div id="fullsize"><br />
<br />
<div id="imgprev" class="imgnav" title="Previous Image"></div><br />
<br />
<div id="imglink"></div><br />
<br />
<div id="imgnext" class="imgnav" title="Next Image"></div><br />
<br />
<div id="image"></div><br />
<br />
<div id="information"><br />
<h3></h3><br />
<p></p><br />
</div><br />
</div><br />
<br />
<div id="thumbnails"><br />
<br />
<div id="slideleft" title="Slide Left"></div><br />
<br />
<div id="slidearea"><br />
<br />
<div id="slider"></div><br />
<br />
</div><br />
<br />
<div id="slideright" title="Slide Right"></div><br />
<br />
</div><br />
<br />
</div><br />
<br />
</div><br />
<br />
<br />
<script type='text/javascript'><br />
$('slideshow').style.display='none';<br />
$('wrapper').style.display='block';<br />
var slideshow=new TINY.slideshow("slideshow");<br />
window.onload=function(){<br />
slideshow.auto=true;<br />
slideshow.speed=5;<br />
slideshow.link="linkhover";<br />
slideshow.info="information";<br />
slideshow.thumbs="slider";<br />
slideshow.left="slideleft";<br />
slideshow.right="slideright";<br />
slideshow.scrollSpeed=4;<br />
slideshow.spacing=5;<br />
slideshow.active="#fff";<br />
slideshow.init("slideshow","image","imgprev","imgnext","imglink");<br />
}<br />
</script></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<span style="color: red; font-size: large;">Featured Images Slideshow Slider to Blogger / Websites</span></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div class="separator" style="clear: both; color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em; text-align: center;">
<img alt="Featured Images Slideshow Slider to Blogger / Websites" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgCoeZ6WuyzFnJfQXIwblzibGJjbZRGyE5NisHJNhQwqvhqImoEVCnjnpuFZN8BvOKoF981dUL7LRbBKXOBBMQxM12ONvg5Dln0Sy4hoMX2OhBsp7RXejsKn0LinAMONt0HW04QCRao4sgg/s1600/Featured+Images+Slideshow+Slider+to+Blogger.png" height="427" style="border: 1px solid rgb(192, 192, 192); height: auto; max-width: 95%; padding: 4px;" width="500" /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em; text-align: center;">
<a class="button big green external_link" href="http://24work.blogspot.com/p/demo.html?url=http://24work-new.googlecode.com/svn/trunk/24work-blogspot/featured-post/n17-content-slider/featured-images-slideshow-slider-to-blogger.html" rel="nofollow" style="-webkit-box-shadow: rgb(255, 255, 255) 0px 0px 1px inset; -webkit-transition: background-position 1s; background-clip: border-box; background-color: #79be1e; background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiahyphenhyphenl-cVfe0N50mVbpXndF0yaLprwejhgK1k2Ja7QUXeMuhnxPIb8uUvilCIm8alGKvBDcYiSbP_LuIJ22w5QCYuIIaT_vaI1W7kHbxz46s-E_ZEWfLkXxK0UwZ-OBEZrNn_j7yNs203Nw/s144/button_bg.png), url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiahyphenhyphenl-cVfe0N50mVbpXndF0yaLprwejhgK1k2Ja7QUXeMuhnxPIb8uUvilCIm8alGKvBDcYiSbP_LuIJ22w5QCYuIIaT_vaI1W7kHbxz46s-E_ZEWfLkXxK0UwZ-OBEZrNn_j7yNs203Nw/s144/button_bg.png), -webkit-gradient(radial, 50% 100%, 0, 50% 100%, 100, from(rgb(162, 211, 30)), to(rgba(162, 211, 30, 0))), -webkit-gradient(linear, 0% 0%, 0% 100%, from(rgb(130, 204, 39)), to(rgb(116, 179, 23))); background-position: 0% 100%, 100% 0%, 0px 0px, 0px 0px; background-repeat: no-repeat; border-radius: 8px; border: 1px solid rgb(150, 163, 123) !important; box-shadow: rgb(255, 255, 255) 0px 0px 1px inset; color: rgb(52, 89, 3) !important; cursor: pointer; display: inline-block; font-family: Calibri, Arial, sans-serif; font-size: 30px; font-stretch: normal; line-height: normal; padding: 10px 20px; position: relative; text-decoration: none; text-shadow: rgba(255, 255, 255, 0.4) 1px 1px 0px; transition: background-position 1s; vertical-align: baseline; white-space: nowrap;" target="_blank">Live Demo</a></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
1. Go to Blogger Dashboard >> Layout >> Add a gadget >> Add HTML/Javascript Box.</div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
2. Paste the following code in HTML/Javascript Box.</div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div class="code" style="background-attachment: initial; background-clip: initial; background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg_A6UCACj7lzkc6RQWaXeH21t_M2FpXey_i-u2nxBG0CxjI_7RIhDrL9J6Uqx0IhT_KdCBsZFoTBd3jo_2pm5edb0WckL48zHKeMYB6NYMMINubK0Z4iMOwA9G-XWD1m0VFsDI0Af13emE/); background-origin: initial; background-position: 0% 0%; background-repeat: repeat-y; background-size: initial; color: black; font-family: 'Courier New'; font-size: 9pt; margin: 5px 10px; max-height: 200px; overflow: auto; padding: 4px 10px 0px 40px;">
<script src="http://24work-new.googlecode.com/svn/trunk/24work-blogspot/featured-post/n17-content-slider/n17-content-slider-06.js" type="text/javascript"></script><br />
<a href="http://<span style="line-height: 19.2000007629395px;">horizon-tut.blogspot.com</span>/" rel="dofollow" target="_blank" title="Blogger Tips and Tricks"><img src="https://bitly.com/24workpng1" alt="Blogger Tips and Tricks" border="0" style="position: fixed; bottom: 10%; right: 0%; top: 0px;" /></a><a href="http://<span style="line-height: 19.2000007629395px;">horizon-tut.blogspot.com</span>/" rel="dofollow" target="_blank" title="Latest Tips For Bloggers"><img src="https://bitly.com/24workpng1" alt="Latest Tips For Bloggers" border="0" style="position: fixed; bottom: 10%; right: 0%;" /></a><a href="http://<span style="line-height: 19.2000007629395px;">horizon-tut.blogspot.com</span>/" rel="dofollow" target="_blank" title="Blogger Tricks"><img src="https://bitly.com/24workpng1" alt="Blogger Tricks" border="0" style="position: fixed; bottom: 10%; left: 0%;" /></a><br />
<style type="text/css"><br />
#slider4{<br />
border: 2px solid #181818;<br />
background: #ffffff;<br />
margin-left: 9px;<br />
}<br />
#paginate-slider4{<br />
border-color: #181818;<br />
margin-left: 9px;<br />
margin-top: 4px;<br />
}<br />
#paginate-slider4 a img{<br />
width: 80px;<br />
height: 60px;<br />
border: 2px solid #181818;<br />
margin-top: 5px;<br />
}<br />
#paginate-slider4 a img:hover, #paginate-slider4 a.selected img{<br />
border: 2px solid #ffc04e;<br />
}<br />
.sliderwrapper{<br />
position: relative; /*leave as is*/<br />
overflow: hidden; /*leave as is*/<br />
border: 10px solid navy;<br />
width: 500px; /*width of featured content slider*/<br />
height: 325px;<br />
}<br />
.sliderwrapper .contentdiv{<br />
visibility: hidden; /*leave as is*/<br />
position: absolute; /*leave as is*/<br />
left: 0; /*leave as is*/<br />
top: 0; /*leave as is*/<br />
padding: 5px;<br />
background: white;<br />
width: 500px; /*width of content DIVs within slider. Total width should equal slider&#39;s inner width */<br />
height: 100%;<br />
filter:progid:DXImageTransform.Microsoft.alpha(opacity=100);<br />
-moz-opacity: 1;<br />
opacity: 1;<br />
}<br />
.pagination{<br />
width: 500px; /*Width of pagination DIV. Total width should equal slider&#39;s outer width */<br />
text-align: right;<br />
background-color: #ffffff;<br />
padding: 0px 5px;<br />
}<br />
.pagination a{<br />
padding: 0 5px;<br />
text-decoration: none;<br />
color: #181818;<br />
background: #ffffff;<br />
}<br />
.pagination a:hover, .pagination a.selected{<br />
color: #181818;<br />
background-color: #ffffff;<br />
}<br />
</style><br />
<br />
<br />
<div style="float:left;"><br />
<br />
<div id="slider4" class="sliderwrapper"><br />
<br />
<div style="background: url('<span style="color: purple;">https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEghR3QEjwbn4FKxKTrGBelkWJm9BDE_bZYiTonixv51VnbuoHS-LEyicRkUVcDvqPnLbxS7l42O526e6VHCIT9TOo4SS4wQMVEuDCQSt8yTgJXL1nM_dk5kFwogfIEW57eVt_yF-CFfKIHH/s1600/How+to+change+mouse+cursor+in+blogger+blog+to+animated+cursors.png</span>') center left no-repeat" class="contentdiv"><br />
</div><br />
<br />
<div style="background: url('<span style="color: purple;">https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh3eKUeOBDsXHVXDG2mqNQhGpA1QraoKXyXfsrnR40l5VXYHz-cuvJMKAwFuBxu03Ga_r4GkNljHb5XXIIKCZI-a0kK5ErpYSJajjy_yB6dYoeHI7pDJGCMAnE6AiF0rKJOx3oo2OFweI4f/s1600/Numbered+Page+Navigation+For+Blogger+New+Script.png</span>') center left no-repeat" class="contentdiv"><br />
</div><br />
<br />
<div style="background: url('<span style="color: purple;">https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjkaDoVVdK3fQ5742sCwYuLfMoiH61OjUKrCI3sgLvkqvvI5Q7ATGrU3I9J6vkUpCrBYIr7AzxZ-AD2Z3uGrkaPT-N2hj8tWNaTfWSn3lW0UgUnnrY46YYer8lJrEpJEU0sfskDvYRNM1Ly/s1600/How+To+Add+Snow+Effect+On+The+Blogger+Mouse+Cursor+Area.png</span>') center left no-repeat" class="contentdiv"><br />
</div><br />
<br />
<div style="background: url('<span style="color: purple;">https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEieJre5apNP6T0SJ1LWJ3B5Hch7fZShDobHitDhlxFolyCwFvj8ccKAtBkdpCZlT3IDtkBsr7RgQyihWhEobN61POu28MwxenDm3oisTCQyXoYHjHoe08d7u0EX-vd2IGPyHzbBWfi1duVV/s1600/Falling+Objects++Falling+Text++Marquee+Scrolling+Text+Generator+for+Blogger.png</span>') center left no-repeat" class="contentdiv"><br />
</div><br />
<br />
<div style="background: url('<span style="color: purple;">https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh19ZfPM9p9RkjSQHxV7fLnk3UA8xhJ8O_RR_-hf0RovhageZqROukiF5kX-1JFhXMlblLfHjejLczchq95oX6zVV011X3-EHrMkcJLa0DBXbV0WZVCtEdEqtu0OprqZNF8jtXEmK7BXiit/s1600/How+To+Add+Animated+Flash+Clock+To+Your+Blogger+Blog.png</span>') center left no-repeat" class="contentdiv"><br />
</div><br />
<br />
</div><br />
<br />
<div id="paginate-slider4"><br />
<br />
<a href="#" target="_blank" class="toc"><img alt="Image1" src="<span style="color: magenta;">https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj_Kpwr_XuZbRP8lNp3xnRPZ31Ro7b0WAXUUjfHTX4PDPMUoCdsTCinbWG3tAjbaBJefkqqT0D40UmSPU2viLssQDly_XcDN8GXSwjXqJF_jZSpR2owV3JXi6nC3onpyurwe-9rm_gwYk3u/s1600/Change+Mouse+Cursor+Generator.png</span>"/></a><br />
<br />
<a href="#" target="_blank" class="toc"><img alt="Image2" src="<span style="color: magenta;">https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEinU4MoffYNK-cAIjjgGIEvfA6eLzVgeG5UsZW2BjUNnt0Ut6nMDSkOzhoyjfA9U-xpqGbBBjFFJ6x9F9D_aH8gF4-HUBa9p_p_fDq7VUcVEfb5ls8UM2ZyHrgjrbpq0Rqsd_0iUdSxuNF6/s1600/Numbered+Page+Navigation.png</span>"/></a><br />
<br />
<a href="#" target="_blank" class="toc"><img alt="Image3" src="<span style="color: magenta;">https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgVFjt-FBzCGAC7tiokbT0ZaEXdcwG_I9b0GsUhyphenhyphenUzG28w8MHDF9or-x05r86lmlLMgow6nx8wzIMJfbredepUy-TWBgDxgyU444XllR9QGuI6hyphenhyphenZ_GI67BbXwJvtg7ourFRKuMEVYRJ6FD/s1600/Snow+Cursor+Code+Generatort.png</span>"/></a><br />
<br />
<a href="#" target="_blank" class="toc"><img alt="Image4" src="<span style="color: magenta;">https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjTKEKKy1-Pxl0T7thOKr3h8DuAPug_JUrWgGL-XLUDP4s-iu5v-mPn2apcz9n_9GQdD7ak6n_o9BH2tNCjQiQVm0MwoiStJFx__cmU_X2JCgUIDI3cJTxYHKY64NQV0i2TOJIZjRt66REW/s1600/Blogger+Falling+Object+Generator.png</span>"/></a><br />
<br />
<a href="#" target="_blank" class="toc"><img alt="Image5" src="<span style="color: magenta;">https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEguo-uyvcwg4onuY_0ZYzQpkqBKezboV6FKYaOeJHGIbZ9MlyUXTz6WJ_SWM4GhSsD6O-FXrZrSZodb3-wgGSL-5fJm2uNwXkV9BtyHiQMN8ELXZij_30hMMgKPjUrJgsuyXJpGO9mD-Xbw/s1600/Animated+Flash+Clock.png</span>"/></a><br />
<br />
</div><br />
<br />
<script type="text/javascript"><br />
featuredcontentslider.init({<br />
id: "slider4", //id of main slider DIV<br />
contentsource: ["inline", ""], //Valid values: ["inline", ""] or ["ajax", "path_to_file"]<br />
toc: "markup", //Valid values: "#increment", "markup", ["label1", "label2", etc]<br />
nextprev: ["", "Next"], //labels for "prev" and "next" links. Set to "" to hide.<br />
revealtype: "mouseover", //Behavior of pagination links to reveal the slides: "click" or "mouseover"<br />
enablefade: [true, 0.1], //[true/false, fadedegree]<br />
autorotate: [true, 5000], //[true/false, pausetime]<br />
onChange: function(previndex, curindex){ //event handler fired whenever script changes slide<br />
//previndex holds index of last slide viewed b4 current (1=1st slide, 2nd=2nd etc)<br />
//curindex holds index of currently shown slide (1=1st slide, 2nd=2nd etc)<br />
}<br />
})<br />
</script><br />
<br />
</div><br />
<br />
<div class="clear"></div></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<span style="color: red; font-size: large;">Smooth Jquery Featured Post Slideshow For Blogger </span></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div class="separator" style="clear: both; color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em; text-align: center;">
<img alt="Smooth Jquery Featured Post Slideshow For Blogger" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjpNOv4ugpag7GLFYv4BsYz1q-rHb_bKq98d_qgrxmvc3gBFCI5RX5k6aN_1Ecm_2nWyhYAIt6swof1IwHAj4bIzpOp3H42DZ7eybJBREFj1rlOhKVdWW0Xj_Y6rY9ZR8lJgb23ET2nOfTp/s1600/Smooth+Jquery+Featured+Post+Slideshow+For+Blogger.png" height="216" style="border: 1px solid rgb(192, 192, 192); height: auto; max-width: 95%; padding: 4px;" width="500" /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em; text-align: center;">
<a class="button big green external_link" href="http://24work.blogspot.com/p/demo.html?url=http://24work-new.googlecode.com/svn/trunk/24work-blogspot/featured-post/n17-content-slider/smooth-jquery-featured-post-slideshow-for-blogger.html" rel="nofollow" style="-webkit-box-shadow: rgb(255, 255, 255) 0px 0px 1px inset; -webkit-transition: background-position 1s; background-clip: border-box; background-color: #79be1e; background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiahyphenhyphenl-cVfe0N50mVbpXndF0yaLprwejhgK1k2Ja7QUXeMuhnxPIb8uUvilCIm8alGKvBDcYiSbP_LuIJ22w5QCYuIIaT_vaI1W7kHbxz46s-E_ZEWfLkXxK0UwZ-OBEZrNn_j7yNs203Nw/s144/button_bg.png), url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiahyphenhyphenl-cVfe0N50mVbpXndF0yaLprwejhgK1k2Ja7QUXeMuhnxPIb8uUvilCIm8alGKvBDcYiSbP_LuIJ22w5QCYuIIaT_vaI1W7kHbxz46s-E_ZEWfLkXxK0UwZ-OBEZrNn_j7yNs203Nw/s144/button_bg.png), -webkit-gradient(radial, 50% 100%, 0, 50% 100%, 100, from(rgb(162, 211, 30)), to(rgba(162, 211, 30, 0))), -webkit-gradient(linear, 0% 0%, 0% 100%, from(rgb(130, 204, 39)), to(rgb(116, 179, 23))); background-position: 0% 100%, 100% 0%, 0px 0px, 0px 0px; background-repeat: no-repeat; border-radius: 8px; border: 1px solid rgb(150, 163, 123) !important; box-shadow: rgb(255, 255, 255) 0px 0px 1px inset; color: rgb(52, 89, 3) !important; cursor: pointer; display: inline-block; font-family: Calibri, Arial, sans-serif; font-size: 30px; font-stretch: normal; line-height: normal; padding: 10px 20px; position: relative; text-decoration: none; text-shadow: rgba(255, 255, 255, 0.4) 1px 1px 0px; transition: background-position 1s; vertical-align: baseline; white-space: nowrap;" target="_blank">Live Demo</a></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
1. Go to Blogger Dashboard >> Layout >> Add a gadget >> Add HTML/Javascript Box.</div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
2. Paste the following code in HTML/Javascript Box.</div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div class="code" style="background-attachment: initial; background-clip: initial; background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg_A6UCACj7lzkc6RQWaXeH21t_M2FpXey_i-u2nxBG0CxjI_7RIhDrL9J6Uqx0IhT_KdCBsZFoTBd3jo_2pm5edb0WckL48zHKeMYB6NYMMINubK0Z4iMOwA9G-XWD1m0VFsDI0Af13emE/); background-origin: initial; background-position: 0% 0%; background-repeat: repeat-y; background-size: initial; color: black; font-family: 'Courier New'; font-size: 9pt; margin: 5px 10px; max-height: 200px; overflow: auto; padding: 4px 10px 0px 40px;">
<script src="http://code.jquery.com/jquery-1.10.2.js" type="text/javascript"/></script><br />
<script type="text/javascript"><br />
$(document).ready(function() {<br />
$('#s3slider').s3Slider({<br />
timeOut: 4000<br />
});<br />
});<br />
</script><br />
<script src="http://24work-new.googlecode.com/svn/trunk/24work-blogspot/featured-post/n17-content-slider/n17-content-slider-07.js" type="text/javascript"></script><br />
<a href="http://<span style="line-height: 19.2000007629395px;">horizon-tut.blogspot.com</span>/" rel="dofollow" target="_blank" title="Blogger Tips and Tricks"><img src="https://bitly.com/24workpng1" alt="Blogger Tips and Tricks" border="0" style="position: fixed; bottom: 10%; right: 0%; top: 0px;" /></a><a href="http://<span style="line-height: 19.2000007629395px;">horizon-tut.blogspot.com</span>/" rel="dofollow" target="_blank" title="Latest Tips For Bloggers"><img src="https://bitly.com/24workpng1" alt="Latest Tips For Bloggers" border="0" style="position: fixed; bottom: 10%; right: 0%;" /></a><a href="http://<span style="line-height: 19.2000007629395px;">horizon-tut.blogspot.com</span>/" rel="dofollow" target="_blank" title="Blogger Tricks"><img src="https://bitly.com/24workpng1" alt="Blogger Tricks" border="0" style="position: fixed; bottom: 10%; left: 0%;" /></a><br />
<style type="text/css"><br />
#s3slider {<br />
background:#000000;<br />
border:1px solid #818e8f;<br />
width: 550px;<br />
height: 200px;<br />
position: relative;<br />
overflow: hidden;<br />
}<br />
#s3sliderContent {<br />
width: 550px;<br />
position: absolute;<br />
top:-14px;<br />
padding: 0px;<br />
margin-left: 0;<br />
}<br />
.s3sliderImage {<br />
float: left;<br />
position: relative;<br />
display: none;<br />
}<br />
.s3sliderImage span {<br />
position: absolute;<br />
left: 0;<br />
font: 20px Trebuchet MS, sans-serif;<br />
padding: 10px 0px;<br />
width: 550px;<br />
background-color: #000;<br />
filter: alpha(opacity=80);<br />
-moz-opacity: 0.8;<br />
-khtml-opacity: 0.8;<br />
opacity: 0.8;<br />
color: #fff;<br />
display: none;<br />
bottom: 0;<br />
text-align:center;<br />
}<br />
.clear {<br />
clear: both;<br />
}<br />
</style><br />
<br />
<br />
<br />
<div id="s3slider"><br />
<ul id="s3sliderContent"><br />
<br />
<li class="s3sliderImage"><a href="#" target="_blank"><img style="width:550px;height:200px;" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjSeJ8n4yLDceHaAUewYqCTerLAoT9yXGwHl2HvDexixm9OlFMwbJDRYhJ8JaEt0PSfgdREQNkyrdI0ldoLmpKEafSemSFAXdnZhe5HSQvYmQ3aLbmOqPwGQz55xNbSRKcW4BCy9ofRk02t/s1600/How+to+change+mouse+cursor+in+blogger+blog+to+animated+cursors.png" /><span><b><span style="color: blue;">Title-of-Post-1</span></b></span></a></li><br />
<br />
<li class="s3sliderImage"><a href="#" target="_blank"><img style="width:550px;height:200px;" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjMeiQz-7x8Apt7Rm0-EnpC5k8xlis-el3vrJYPcgAG3nRz4o8XThiu9pqyE9DCIsIzFyT6cZdwDDJA4LCGgJdCW_aESukba71b1VN95q0JrFzStc44AKmUsP97ZlV1sx0ipN-atvnq61L0/s1600/Numbered+Page+Navigation+For+Blogger+New+Script.png" /><span><b><span style="color: blue;">Title-of-Post-2</span></b></span></a></li><br />
<br />
<li class="s3sliderImage"><a href="#" target="_blank"><img style="width:550px;height:200px;" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhWIs43O_u7BYuWc87WVKq0fg7eTu7iJJ6ImoLq-ur4NdgVxEPaErNCsc5pwfp4E-KZq8gAkWIfwwNT_nMcV6Kn1SRFRow53UGJBlRVGv1FKkQV0AMZj2S31gqiDIWymCDig8o0tbcsKnst/s1600/How+To+Add+Snow+Effect+On+The+Blogger+Mouse+Cursor+Area.png" /><span><b><span style="color: blue;">Title-of-Post-3</span></b></span></a></li><br />
<br />
<li class="s3sliderImage"><a href="#" target="_blank"><img style="width:550px;height:200px;" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg4Ydk8jwbJW8J6GK8nA_mCbmX0r5FpZj8XNPWih6WnYCwV4Y55vKiHxxOvw5LqFaVt388baqEfII7QmOLnGR1uIeT3MV9DTGXDY_tSf2eJ2HH-uoOutcU3zFABs5gpLrspOLiZ5Gfc7rYA/s1600/Falling+Objects++Falling+Text++Marquee+Scrolling+Text+Generator+for+Blogger.png" /><span><b><span style="color: blue;">Title-of-Post-4</span></b></span></a></li><br />
<br />
<li class="s3sliderImage"><a href="#" target="_blank"><img style="width:550px;height:200px;" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjIwIqSajUI6vxw3DOLrzRKhiaXnDTyGEMrXFPCxAahIh8CICG-PlOBG6AgvjOECf6loVDl9WaUiS_mc8c7oORjIo7Ul2SMrD4a_LW9gJeWayyr_sM0tkH3RjKi6X9cALJNuopamYLsHYIv/s1600/How+To+Add+Animated+Flash+Clock+To+Your+Blogger+Blog.png" /><span><b><span style="color: blue;">Title-of-Post-5</span></b></span></a></li><br />
<br />
<li class="s3sliderImage"></li><br />
</ul><br />
</div><br />
<br />
<div class="clear"></div><br />
</div></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<span style="color: red; font-size: large;">How To Add Featured Post Content Slider to Blogger</span></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div class="separator" style="clear: both; color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em; text-align: center;">
<img alt="How To Add Featured Post Content Slider to Blogger" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjIhDb7rOA4TZ2cRV55oez5P_Y-l7V1nm0S8ttWc-ajM5agLikJ9vmDKfbH9ar_F4pQm-_jVngkmcZZVWfiD3lw_JavpUqeSfzR5FtJ3wv7gNvTQohBA_AvobqMCK7GtMd08g6yihP6X7qt/s1600/How+To+Add+Featured+Post+Content+Slider+to+Blogger.png" height="246" style="border: 1px solid rgb(192, 192, 192); height: auto; max-width: 95%; padding: 4px;" width="500" /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em; text-align: center;">
<a class="button big green external_link" href="http://24work.blogspot.com/p/demo.html?url=http://24work-new.googlecode.com/svn/trunk/24work-blogspot/featured-post/n17-content-slider/featured-post-content-slider-to-blogger.html" rel="nofollow" style="-webkit-box-shadow: rgb(255, 255, 255) 0px 0px 1px inset; -webkit-transition: background-position 1s; background-clip: border-box; background-color: #79be1e; background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiahyphenhyphenl-cVfe0N50mVbpXndF0yaLprwejhgK1k2Ja7QUXeMuhnxPIb8uUvilCIm8alGKvBDcYiSbP_LuIJ22w5QCYuIIaT_vaI1W7kHbxz46s-E_ZEWfLkXxK0UwZ-OBEZrNn_j7yNs203Nw/s144/button_bg.png), url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiahyphenhyphenl-cVfe0N50mVbpXndF0yaLprwejhgK1k2Ja7QUXeMuhnxPIb8uUvilCIm8alGKvBDcYiSbP_LuIJ22w5QCYuIIaT_vaI1W7kHbxz46s-E_ZEWfLkXxK0UwZ-OBEZrNn_j7yNs203Nw/s144/button_bg.png), -webkit-gradient(radial, 50% 100%, 0, 50% 100%, 100, from(rgb(162, 211, 30)), to(rgba(162, 211, 30, 0))), -webkit-gradient(linear, 0% 0%, 0% 100%, from(rgb(130, 204, 39)), to(rgb(116, 179, 23))); background-position: 0% 100%, 100% 0%, 0px 0px, 0px 0px; background-repeat: no-repeat; border-radius: 8px; border: 1px solid rgb(150, 163, 123) !important; box-shadow: rgb(255, 255, 255) 0px 0px 1px inset; color: rgb(52, 89, 3) !important; cursor: pointer; display: inline-block; font-family: Calibri, Arial, sans-serif; font-size: 30px; font-stretch: normal; line-height: normal; padding: 10px 20px; position: relative; text-decoration: none; text-shadow: rgba(255, 255, 255, 0.4) 1px 1px 0px; transition: background-position 1s; vertical-align: baseline; white-space: nowrap;" target="_blank">Live Demo</a></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
1. Go to Blogger Dashboard >> Layout >> Add a gadget >> Add HTML/Javascript Box.</div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
2. Paste the following code in HTML/Javascript Box.</div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div class="code" style="background-attachment: initial; background-clip: initial; background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg_A6UCACj7lzkc6RQWaXeH21t_M2FpXey_i-u2nxBG0CxjI_7RIhDrL9J6Uqx0IhT_KdCBsZFoTBd3jo_2pm5edb0WckL48zHKeMYB6NYMMINubK0Z4iMOwA9G-XWD1m0VFsDI0Af13emE/); background-origin: initial; background-position: 0% 0%; background-repeat: repeat-y; background-size: initial; color: black; font-family: 'Courier New'; font-size: 9pt; margin: 5px 10px; max-height: 200px; overflow: auto; padding: 4px 10px 0px 40px;">
<script src="http://code.jquery.com/jquery-1.10.2.js" type="text/javascript"/></script><br />
<script type="text/javascript"><br />
//<![CDATA[<br />
<br />
jQuery(document).ready(function() {<br />
Cufon.replace('.blogname h2', { fontFamily: 'MankSans-Medium' });<br />
Cufon.replace('.sidetitl,.blogname h1', { fontFamily: 'ChunkFive' });<br />
<br />
});<br />
<br />
//]]><br />
</script><br />
<script src="http://24work-new.googlecode.com/svn/trunk/24work-blogspot/featured-post/n17-content-slider/n17-content-slider-08.js" type="text/javascript"></script><br />
<script src="http://24work-new.googlecode.com/svn/trunk/24work-blogspot/featured-post/n17-content-slider/n17-content-slider-09.js" type="text/javascript"></script><br />
<script src="http://24work-new.googlecode.com/svn/trunk/24work-blogspot/featured-post/n17-content-slider/n17-content-slider-010.js" type="text/javascript"></script><br />
<a href="http://<span style="line-height: 19.2000007629395px;">horizon-tut.blogspot.com</span>/" rel="dofollow" target="_blank" title="Blogger Tips and Tricks"><img src="https://bitly.com/24workpng1" alt="Blogger Tips and Tricks" border="0" style="position: fixed; bottom: 10%; right: 0%; top: 0px;" /></a><a href="http://<span style="line-height: 19.2000007629395px;">horizon-tut.blogspot.com</span>/" rel="dofollow" target="_blank" title="Latest Tips For Bloggers"><img src="https://bitly.com/24workpng1" alt="Latest Tips For Bloggers" border="0" style="position: fixed; bottom: 10%; right: 0%;" /></a><a href="http://<span style="line-height: 19.2000007629395px;">horizon-tut.blogspot.com</span>/" rel="dofollow" target="_blank" title="Blogger Tricks"><img src="https://bitly.com/24workpng1" alt="Blogger Tricks" border="0" style="position: fixed; bottom: 10%; left: 0%;" /></a><br />
<style type="text/css"><br />
#slidearea{<br />
height: 230px;<br />
overflow: hidden;<br />
position: relative;<br />
width:680px;<br />
background:#242424;<br />
}<br />
#gallerycover{<br />
overflow: hidden;<br />
margin:0px 0px;<br />
}<br />
<br />
.mygallery{<br />
overflow: hidden;<br />
position:relative;<br />
}<br />
<br />
.mytext img{<br />
position:absolute;<br />
left:10px;<br />
top:10px;<br />
padding:5px;<br />
background:#515252;<br />
border:1px solid #5e5e5e;<br />
}<br />
<br />
.mytext{<br />
position:relative;<br />
margin:0px 0px;<br />
height:200px;<br />
width:680px;<br />
float:left;<br />
display:inline;<br />
line-height:20px;<br />
color:#c4c4c4;<br />
font-family: Tahoma,Georgia,century gothic,Verdana, sans-serif;<br />
}<br />
<br />
.mytext ul li{<br />
height:200px;<br />
<br />
}<br />
<br />
.mytext a:link, .mytext a:visited {<br />
color:#fff;<br />
}<br />
<br />
.mytext h2 {<br />
font: 18px Georgia,century gothic,Verdana, sans-serif;<br />
margin:15px 0px 5px 310px;<br />
font-weight:normal;<br />
width:350px;<br />
height:24px;<br />
overflow:hidden;<br />
}<br />
<br />
.mytext p {<br />
width:350px;<br />
margin:0px 0px 5px 310px;<br />
color:#6f6f6f;<br />
}<br />
<br />
.mytext h2 a:link, .mytext h2 a:visited {<br />
color:#fff;<br />
}<br />
.slnav{<br />
padding:3px 0px;<br />
background:#000;<br />
<br />
}<br />
.prev{<br />
float:left;<br />
width:24px;<br />
height:24px;<br />
z-index:200;<br />
margin-left:5px;<br />
background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj-IIww0BA4jeU2whNG981JSAVY9j5UDDn3nByFLVL9IVJnqwOmIYU7QSXfNqkE5Q-LSOdBbmyC31OT4xn82Bh6TffmAFlBA7_Cs3TjfbGj9Cu3LC9Z58aEktxByTAjM6BwYGzb2QOiQS33/);<br />
}<br />
<br />
.next{<br />
float:right;<br />
width:24px;<br />
height:24px;<br />
z-index:200;<br />
background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj-mZGBOeHsQrCAHwcT7d1BcdqXbKiS-cIlaZ00lYDfp3m4NbsgMVYSLMWCNtZ3RHXKLg2uSE_s-YyzS-MQRIFrULTwvtkZwAtQaHOj_TYmfbKLQFihUTG6gbIN2yJfDYJsDwsrOYgO-cFP/);<br />
display:block;<br />
}<br />
<br />
</style><br />
<br />
<br />
<script type="text/javascript"><br />
var $jx = jQuery.noConflict();<br />
$jx(function() {<br />
$jx(".mygallery").jCarouselLite({<br />
btnNext: ".next",<br />
btnPrev: ".prev",<br />
visible: 1,<br />
easing: "backout",<br />
speed: 1000<br />
});<br />
<br />
});<br />
</script><br />
<br />
<div id="slidearea"><br />
<br />
<div id="gallerycover"><br />
<div class="mygallery"><br />
<ul><br />
<br />
<li><br />
<div class="mytext"><br />
<h2><a href="#" target="_blank">Title-of-Post-1</a></h2><br />
<p><span style="color: cyan;">Slide 1 Description [...]</span></p><br />
<br />
<img alt="" width="270" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiok7k07E26PaVjQnheC-_Un5WuNyLO7LWw5aji6jomfu_sFyU9ewCDpoV3Co4RouqXQXFTY9dopTHgwgtM5coIcEBPJNQ-3huoi-j0Zv3p4xscVvqzyeyuXzDvXf0DRxhUNqHzcqFvrKrf/s1600/How+to+change+mouse+cursor+in+blogger+blog+to+animated+cursors.png" height="170"/><br />
</div><br />
</li><br />
<br />
<br />
<li><br />
<div class="mytext"><br />
<h2><a href="#" target="_blank">Title-of-Post-2</a></h2><br />
<br />
<p><b><span style="color: cyan;">Slide 2 Description [...]</span></b></p><br />
<br />
<img alt="" width="270" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhRynNaVduMh3_iNRX2GCBEVzYebB8sR_uXVmA-m70sqpmXEySbhojkZt9VcPCoST7K2akCoGOwpUq6S1taj5RvXIeugOMPuNsI35vbjJN_UaQD9POP3tFKIgL0fKT5jx0xy2tw8LCvBCA0/s1600/Numbered+Page+Navigation+For+Blogger+New+Script.png" height="170"/><br />
</div><br />
</li><br />
<br />
<br />
<li><br />
<div class="mytext"><br />
<h2><a href="#" target="_blank">Title-of-Post-3</a></h2><br />
<br />
<p><b><span style="color: cyan;">Slide 3 Description [...]</span></b></p><br />
<br />
<img alt="" width="270" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi3PTR9ZHckt8wK63-Y4hzyAFb8IL_VodMjnZQZ_ebwQ3pNFvJcLTqIKYrmUknE89wYMuk60bGJSNGnF-73j6YYC2v3kx03EpmTkuza2ASbfMACDXXnlXjsUAY31ILCn4DeUidjJAjGii0i/s1600/How+To+Add+Snow+Effect+On+The+Blogger+Mouse+Cursor+Area.png" height="170"/><br />
</div><br />
</li><br />
<br />
<br />
<li><br />
<div class="mytext"><br />
<h2><a href="#" target="_blank">Title-of-Post-4</a></h2><br />
<p><b><span style="color: cyan;">Slide 4 Description [...]</span></b></p><br />
<br />
<img alt="" width="270" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhrj1yVSdWFhT3ppFfTwBK6SQtODlOCbYKPuRGtNYIrriUrpQokw3aJtt8Q-L8wqLvtliwvKtgAEtSe_yRc3Ta17RZhp-yn_keeLckHPcW19yiURL-Nkwm0xTzO_CC_Acnm8UxP6IwYaFbl/s1600/Falling+Objects++Falling+Text++Marquee+Scrolling+Text+Generator+for+Blogger.png" height="170"/><br />
</div><br />
</li><br />
<br />
<br />
<li><br />
<div class="mytext"><br />
<h2><a href="#" target="_blank">Title-of-Post-5</a></h2><br />
<p><b><span style="color: cyan;">Slide 5 Description [...]</span></b></p><br />
<br />
<img alt="" width="270" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgQYHAc-Vg_oMBRegBt9WS5w2ed3mVQWIfsTPaT5PqlEUadZFBKZ2n_YAjhDQjWn1AUF3LKBo5Zo17Ig_it89NdIJ-OxJVLvKhDyRuGf2M2dchcg96K18h9fkEwdCYZCKPSiJE5xslUS0UT/s1600/How+To+Add+Animated+Flash+Clock+To+Your+Blogger+Blog.png" height="170"/><br />
</div><br />
</li><br />
<br />
</ul><br />
<br />
<div class="clear"></div><br />
<br />
</div><br />
</div><br />
<br />
<div class="slnav"><br />
<a href="#" class="prev"></a><br />
<a href="#" class="next"></a><br />
<div class="clear"></div><br />
</div><br />
<br />
</div><br />
<br />
<div class="clear"></div></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<span style="color: red; font-size: large;">How To Add Mootools Recent Post Slider to blogger</span></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div class="separator" style="clear: both; color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em; text-align: center;">
<img alt="How To Add Mootools Recent Post Slider to blogger" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjvB381LVOVCzEz3TSKhygLsdVESW547bnJzv6MAKF74yR7igr1_09rWzb9fnLLmVoRcdgq9csUdEB745zynY6XXWQHDydwkP_zVR9MvIzxu2up4GMgMi4vYTCxnzdS0B_8XXQtKprXFvzS/s1600/How+To+Add+Mootools+Recent+Post+Slider+to+blogger.png" height="240" style="border: 1px solid rgb(192, 192, 192); height: auto; max-width: 95%; padding: 4px;" width="500" /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em; text-align: center;">
<a class="button big green external_link" href="http://24work.blogspot.com/p/demo.html?url=http://24work-new.googlecode.com/svn/trunk/24work-blogspot/featured-post/n17-content-slider/mootools-recent-post-slider-to-blogger.html" rel="nofollow" style="-webkit-box-shadow: rgb(255, 255, 255) 0px 0px 1px inset; -webkit-transition: background-position 1s; background-clip: border-box; background-color: #79be1e; background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiahyphenhyphenl-cVfe0N50mVbpXndF0yaLprwejhgK1k2Ja7QUXeMuhnxPIb8uUvilCIm8alGKvBDcYiSbP_LuIJ22w5QCYuIIaT_vaI1W7kHbxz46s-E_ZEWfLkXxK0UwZ-OBEZrNn_j7yNs203Nw/s144/button_bg.png), url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiahyphenhyphenl-cVfe0N50mVbpXndF0yaLprwejhgK1k2Ja7QUXeMuhnxPIb8uUvilCIm8alGKvBDcYiSbP_LuIJ22w5QCYuIIaT_vaI1W7kHbxz46s-E_ZEWfLkXxK0UwZ-OBEZrNn_j7yNs203Nw/s144/button_bg.png), -webkit-gradient(radial, 50% 100%, 0, 50% 100%, 100, from(rgb(162, 211, 30)), to(rgba(162, 211, 30, 0))), -webkit-gradient(linear, 0% 0%, 0% 100%, from(rgb(130, 204, 39)), to(rgb(116, 179, 23))); background-position: 0% 100%, 100% 0%, 0px 0px, 0px 0px; background-repeat: no-repeat; border-radius: 8px; border: 1px solid rgb(150, 163, 123) !important; box-shadow: rgb(255, 255, 255) 0px 0px 1px inset; color: rgb(52, 89, 3) !important; cursor: pointer; display: inline-block; font-family: Calibri, Arial, sans-serif; font-size: 30px; font-stretch: normal; line-height: normal; padding: 10px 20px; position: relative; text-decoration: none; text-shadow: rgba(255, 255, 255, 0.4) 1px 1px 0px; transition: background-position 1s; vertical-align: baseline; white-space: nowrap;" target="_blank">Live Demo</a></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
1. Go to Blogger Dashboard >> Layout >> Add a gadget >> Add HTML/Javascript Box.</div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
2. Paste the following code in HTML/Javascript Box.</div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div class="code" style="background-attachment: initial; background-clip: initial; background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg_A6UCACj7lzkc6RQWaXeH21t_M2FpXey_i-u2nxBG0CxjI_7RIhDrL9J6Uqx0IhT_KdCBsZFoTBd3jo_2pm5edb0WckL48zHKeMYB6NYMMINubK0Z4iMOwA9G-XWD1m0VFsDI0Af13emE/); background-origin: initial; background-position: 0% 0%; background-repeat: repeat-y; background-size: initial; color: black; font-family: 'Courier New'; font-size: 9pt; margin: 5px 10px; max-height: 200px; overflow: auto; padding: 4px 10px 0px 40px;">
<script type="text/javascript"> var thumbnail_mode = "no-float" ; summary_noimg = 430; summary_img = 340; img_thumb_height = 100; img_thumb_width = 180;<br />
</script><br />
<script src="http://24work-new.googlecode.com/svn/trunk/24work-blogspot/featured-post/n17-content-slider/n17-content-slider-011.js" type="text/javascript"></script><br />
<script src="http://24work-new.googlecode.com/svn/trunk/24work-blogspot/featured-post/n17-content-slider/n17-content-slider-012.js" type="text/javascript"></script><br />
<script src="http://24work-new.googlecode.com/svn/trunk/24work-blogspot/featured-post/n17-content-slider/n17-content-slider-013.js" type="text/javascript"></script><br />
<a href="http://<span style="line-height: 19.2000007629395px;">horizon-tut.blogspot.com</span>/" rel="dofollow" target="_blank" title="Blogger Tips and Tricks"><img src="https://bitly.com/24workpng1" alt="Blogger Tips and Tricks" border="0" style="position: fixed; bottom: 10%; right: 0%; top: 0px;" /></a><a href="http://<span style="line-height: 19.2000007629395px;">horizon-tut.blogspot.com</span>/" rel="dofollow" target="_blank" title="Latest Tips For Bloggers"><img src="https://bitly.com/24workpng1" alt="Latest Tips For Bloggers" border="0" style="position: fixed; bottom: 10%; right: 0%;" /></a><a href="http://<span style="line-height: 19.2000007629395px;">horizon-tut.blogspot.com </span>/" rel="dofollow" target="_blank" title="Blogger Tricks"><img src="https://bitly.com/24workpng1" alt="Blogger Tricks" border="0" style="position: fixed; bottom: 10%; left: 0%;" /></a><br />
<style type="text/css"><br />
div#featabout { width: 635px; border-bottom: 1px solid; }<br />
div#featabout-wrapper { margin: 0 auto; padding: 22px 0; width: 635px; height: 235px; }<br />
<br />
div#featabout div.featured { float: left; width: 640px; }<br />
div#featabout div.featured div.top { height: 15px; }<br />
div#featabout div.featured div.mid { padding: 0 15px; }<br />
div#featabout div.featured div.mid div#featured { border: 1px solid; }<br />
div#featabout div.featured div.bot { height: 15px; }<br />
<br />
div#featabout div.about { float: right; width: 328px; }<br />
div#featabout div.about div.top { height: 15px; }<br />
div#featabout div.about div.mid { padding: 0 15px; height: 224px; }<br />
div#featabout div.about div.bot { height: 15px; }<br />
<br />
div#featabout div.ab-box h2 { display: block; margin: 0; padding: 0 0 8px 0; font-size: 12px;<br />
font-family: Georgia, 'Times New Roman', serif;<br />
text-transform: uppercase;<br />
}<br />
div#featabout div.ab-box div.interior { padding: 8px 0; }<br />
div#featabout div.ab-box div.interior p { display: block; margin: 0; padding: 0; }<br />
div#featabout div.ab-box-author div.interior { padding: 8px 0 16px 0; min-height: 60px; }<br />
div#featabout div.ab-box-author div.interior img { padding: 3px; border: 1px solid; float: left; margin: 0 5px 0 0; }<br />
div#featabout div.ab-box-burner div.interior { padding: 8px 0 8px 65px; }<br />
div#featabout div.ab-box-burner div.interior p { display: block; margin: 0; padding: 0; line-height: 28px; }<br />
div#featabout div.ab-box-burner div.interior span { display: block; height: 21px; margin: 0 0 0 0; padding: 6px 0 0 0; }<br />
div#featabout div.ab-box-burner div.interior span input { width: 191px; padding: 0 5px; border: 0; }<br />
div#featabout {<br />
background: #ffffff url('') repeat-x scroll left top;<br />
border-bottom: none;<br />
}<br />
div#featabout div.featured { background: transparent url('') repeat-y scroll left top; }<br />
div#featabout div.featured div.top { background: transparent url('') no-repeat scroll left top; }<br />
div#featabout div.featured div.mid div#featured { border-color: #000; }<br />
div#featabout div.featured div.bot { background: transparent url('') no-repeat scroll left bottom; }<br />
div#featured h2 {<br />
font-family: Georgia, 'Times New Roman', sans-serif; font-size: 24px;<br />
line-height: 30px; font-weight: normal;<br />
}<br />
div#featured p {<br />
font-family: Arial, Helvetica, sans-serif; font-size: 13px;<br />
}<br />
<br />
div#featabout div.about { color: #999; background: transparent url('') repeat-y scroll left top; }<br />
div#featabout div.about div.top { background: transparent url('') no-repeat scroll left top; }<br />
div#featabout div.about div.bot { background: transparent url('') no-repeat scroll left bottom; }<br />
<br />
div#featabout div.ab-box h2 { color: #e1e1c7; background: transparent url('') repeat-x scroll left bottom; }<br />
div#featabout div.ab-box-burner div.interior { color: #999; background: transparent url('') no-repeat scroll 0px 8px; }<br />
div#featabout div.ab-box-burner div.interior span { background: transparent url('') left top no-repeat; }<br />
div#featabout div.ab-box-burner div.interior span input { background: transparent none; color: #666; }<br />
<br />
#flickrGallery<br />
{<br />
width: 500px;<br />
height: 334px;<br />
}<br />
#myGallery img.thumbnail, #myGallerySet img.thumbnail<br />
{<br />
display: none;<br />
}<br />
.jdGallery<br />
{<br />
overflow: hidden;<br />
position: relative;<br />
}<br />
.jdGallery img<br />
{<br />
border: 0;<br />
margin: 0;<br />
}<br />
.jdGallery .slideElement<br />
{<br />
width: 100%;<br />
height: 100%;<br />
background-color: #000;<br />
background-repeat: no-repeat;<br />
background-position: center center;<br />
background-image: url('');<br />
}<br />
.jdGallery .loadingElement<br />
{<br />
width: 100%;<br />
height: 100%;<br />
position: absolute;<br />
left: 0;<br />
top: 0;<br />
background-color: #000;<br />
background-repeat: no-repeat;<br />
background-position: center center;<br />
background-image: url('');<br />
}<br />
* html .jdGallery .slideInfoZone<br />
{<br />
bottom: -1px;<br />
}<br />
.jdGallery .slideInfoZone h2<br />
{<br />
padding: 0;<br />
font-size: 14px;<br />
margin: 0;<br />
margin: 2px 5px;<br />
font-weight: bold;<br />
color: #FFFFFF;<br />
bacground: transparent;<br />
}<br />
.jdGallery .slideInfoZone ul {<br />
list-style:none;<br />
margin:0 0 0;<br />
padding:0 0 0;<br />
color: #FFFFFF;<br />
}<br />
.jdGallery .slideInfoZone li {<br />
list-style:none;<br />
margin:0 0 0;<br />
padding:0 0 0;<br />
color: #FFFFFF;<br />
}<br />
.jdGallery .slideInfoZone p<br />
{<br />
padding: 0;<br />
font-size: 11px;<br />
margin: 2px 5px;<br />
color: #FFFFFF;<br />
}<br />
.jdGallery div.carouselContainer<br />
{<br />
position: absolute;<br />
height: 135px;<br />
width: 100%;<br />
z-index: 10;<br />
margin: 0px;<br />
left: 0;<br />
top: 0;<br />
}<br />
.jdGallery a.carouselBtn<br />
{<br />
position: absolute;<br />
bottom: 0;<br />
right: 30px;<br />
height: 20px;<br />
/*width: 100px; background: url('') no-repeat;*/<br />
text-align: center;<br />
padding: 0 10px;<br />
font-size: 13px;<br />
background: #000;<br />
color: #fff;<br />
cursor: pointer;<br />
}<br />
.jdGallery .carousel<br />
{<br />
position: absolute;<br />
width: 100%;<br />
margin: 0px;<br />
left: 0;<br />
top: 0;<br />
height: 115px;<br />
background: #000;<br />
color: #fff;<br />
text-indent: 0;<br />
overflow: hidden;<br />
}<br />
.jdExtCarousel<br />
{<br />
overflow: hidden;<br />
position: relative;<br />
}<br />
.jdGallery .carousel .carouselWrapper, .jdExtCarousel .carouselWrapper<br />
{<br />
position: absolute;<br />
width: 100%;<br />
height: 78px;<br />
top: 10px;<br />
left: 0;<br />
overflow: hidden;<br />
}<br />
.jdGallery .carousel .carouselInner, .jdExtCarousel .carouselInner<br />
{<br />
position: relative;<br />
}<br />
.jdGallery .carousel .carouselInner .thumbnail, .jdExtCarousel .carouselInner .thumbnail<br />
{<br />
cursor: pointer;<br />
background: #000;<br />
background-position: center center;<br />
float: left;<br />
border: solid 1px #fff;<br />
}<br />
.jdGallery .wall .thumbnail, .jdExtCarousel .wall .thumbnail<br />
{<br />
margin-bottom: 10px;<br />
}<br />
.jdGallery .carousel .label, .jdExtCarousel .label<br />
{<br />
font-size: 13px;<br />
position: absolute;<br />
bottom: 5px;<br />
left: 10px;<br />
padding: 0;<br />
margin: 0;<br />
}<br />
.jdGallery .carousel .wallButton, .jdExtCarousel .wallButton<br />
{<br />
font-size: 10px;<br />
position: absolute;<br />
bottom: 5px;<br />
right: 10px;<br />
padding: 1px 2px;<br />
margin: 0;<br />
background: #222;<br />
border: 1px solid #888;<br />
cursor: pointer;<br />
}<br />
.jdGallery .carousel .label .number, .jdExtCarousel .label .number<br />
{<br />
color: #b5b5b5;<br />
}<br />
.jdGallery a, .jdGallery a:hover<br />
{<br />
font-size: 100%;<br />
text-decoration: none;<br />
color: #fff;<br />
}<br />
.jdGallery a.right, .jdGallery a.left<br />
{<br />
position: absolute;<br />
height: 99%;<br />
width: 25%;<br />
cursor: pointer;<br />
z-index:10;<br />
filter:alpha(opacity=20);<br />
-moz-opacity:0.2;<br />
-khtml-opacity: 0.2;<br />
opacity: 0.2;<br />
}<br />
* html .jdGallery a.right, * html .jdGallery a.left<br />
{<br />
filter:alpha(opacity=50);<br />
}<br />
.jdGallery a.right:hover, .jdGallery a.left:hover<br />
{<br />
filter:alpha(opacity=80);<br />
-moz-opacity:0.8;<br />
-khtml-opacity: 0.8;<br />
opacity: 0.8;<br />
}<br />
.jdGallery a.left<br />
{<br />
left: 0;<br />
top: 0;<br />
background: url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhSoM3vzoj5Cs3FO01lLM1dkMTRWJAdWUFyrQiWQlZ8Nrae2QD0FodEA1XHm7kcP-fJYtSobj7NJfhrJuaPSPjCu1Z1exSw8NCQKf3HaVhvXBda0SeWpjOeoBeF6h3_F40RNf_it0SSIuoD/s1600/fleche1.png') no-repeat center left;<br />
}<br />
* html .jdGallery a.left { background: url('') no-repeat center left; }<br />
.jdGallery a.right<br />
{<br />
right: 0;<br />
top: 0;<br />
background: url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiAV4lVTWMwsZ1_ZdZYSfRjgyEfuAjez8jE1uBgG0KUSpCtnRaQvMR5plm9xvi2MY4pr8xLQ0xHnhrhBDOCsn9s3LijUADbmoOQY0HjVoxMv7yXKCt8jDC4JuuojiyBWZg4FpmFmJsQgGKt/s1600/fleche2.png') no-repeat center right;<br />
}<br />
* html .jdGallery a.right { background: url('') no-repeat center right; }<br />
.jdGallery a.open<br />
{<br />
left: 0;<br />
top: 0;<br />
width: 100%;<br />
height: 100%;<br />
}<br />
.withArrows a.open<br />
{<br />
position: absolute;<br />
top: 0;<br />
left: 25%;<br />
height: 99%;<br />
width: 50%;<br />
cursor: pointer;<br />
z-index: 10;<br />
background: none;<br />
-moz-opacity:0.8;<br />
-khtml-opacity: 0.8;<br />
opacity: 0.8;<br />
}<br />
.withArrows a.open:hover { background: url('') no-repeat center center; }<br />
* html .withArrows a.open:hover { background: url('') no-repeat center center;<br />
filter:alpha(opacity=80); }<br />
/* Gallery Sets */<br />
.jdGallery a.gallerySelectorBtn<br />
{<br />
z-index: 15;<br />
position: absolute;<br />
top: 0;<br />
left: 30px;<br />
height: 20px;<br />
/*width: 100px; background: url('') no-repeat;*/<br />
text-align: center;<br />
padding: 0 10px;<br />
font-size: 13px;<br />
background: #000;<br />
color: #fff;<br />
cursor: pointer;<br />
opacity: .4;<br />
-moz-opacity: .4;<br />
-khtml-opacity: 0.4;<br />
filter:alpha(opacity=40);<br />
}<br />
.jdGallery .gallerySelector<br />
{<br />
z-index: 20;<br />
width: 100%;<br />
height: 100%;<br />
position: absolute;<br />
top: 0;<br />
left: 0;<br />
background: #000;<br />
}<br />
.jdGallery .gallerySelector h2<br />
{<br />
margin: 0;<br />
padding: 10px 20px 10px 20px;<br />
font-size: 20px;<br />
line-height: 30px;<br />
color: #fff;<br />
}<br />
.jdGallery .gallerySelector .gallerySelectorWrapper<br />
{<br />
overflow: hidden;<br />
}<br />
.jdGallery .gallerySelector .gallerySelectorInner div.galleryButton<br />
{<br />
margin-left: 10px;<br />
margin-top: 10px;<br />
border: 1px solid #888;<br />
padding: 5px;<br />
height: 40px;<br />
color: #fff;<br />
cursor: pointer;<br />
float: left;<br />
}<br />
.jdGallery .gallerySelector .gallerySelectorInner div.hover<br />
{<br />
background: #000;<br />
}<br />
.jdGallery .gallerySelector .gallerySelectorInner div.galleryButton div.preview<br />
{<br />
background: #000;<br />
background-position: center center;<br />
float: left;<br />
border: none;<br />
width: 40px;<br />
height: 40px;<br />
margin-right: 5px;<br />
}<br />
.jdGallery .gallerySelector .gallerySelectorInner div.galleryButton h3<br />
{<br />
margin: 0;<br />
padding: 0;<br />
font-size: 12px;<br />
font-weight: normal;<br />
}<br />
.jdGallery .gallerySelector .gallerySelectorInner div.galleryButton p.info<br />
{<br />
margin: 0;<br />
padding: 0;<br />
font-size: 12px;<br />
font-weight: normal;<br />
color: #aaa;<br />
}<br />
.extra div.box { width: 310px; padding: 0px; margin:0;}<br />
.extra div.box-popular { float: left; }<br />
.extra div.box-recent { float: right; }<br />
<br />
</style><br />
<br />
<br />
<br />
<div id="featabout"><br />
<div id="featabout-wrapper"><br />
<div class="featured"><br />
<div class="top"></div><br />
<div class="mid"><br />
<div id="featured"><br />
<style><br />
#myGallery, #myGallerySet, #flickrGallery {<br />
width: 606px;<br />
height: 220px;<br />
z-index:5;<br />
border: 1px solid #000;<br />
overflow:hidden;<br />
}<br />
<br />
.jdGallery .slideInfoZone<br />
{<br />
position: absolute;<br />
z-index: 10;<br />
width: 100%;<br />
margin: 0px;<br />
left: 0;<br />
bottom: 0;<br />
height: 80px;<br />
background: #000;<br />
color: #fff;<br />
text-indent: 0;<br />
overflow: hidden;<br />
}<br />
</style><br />
<script type="text/javascript"><br />
function startGallery() {<br />
var myGallery = new gallery($('myGallery'), {<br />
timed: true<br />
});<br />
}<br />
window.addEvent('domready',startGallery);<br />
</script><br />
<div id="myGallery"><br />
<br />
<div class="imageElement"><br />
<h2><a href="#" target="_blank"><b><span style="color: lime;">Title-of-Post-1</span></b></a></h2><br />
<p>Slide 1 Description [...]</p><br />
<a class="open" href="TITLE-OF-THE-SLIDE 1" target="_blank" title="How to change mouse cursor in blogger blog to animated cursors"></a><br />
<img class="full" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhtoeqKKdPF0zK-7jYNei-7krHCzUqFQgC4sDINF9dh7LcLHqmwB4s3BRTo4mHcVIyeoyd_0jFFvURUh_5lWvT5gDw_77e4CyF3qt6eTSWf-SofVdX2h1azOb7XD_I0WBop9IMkOJi-lCgi/s1600/How+to+change+mouse+cursor+in+blogger+blog+to+animated+cursors.png"/><br />
<img class="thumbnail" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi12kMdCxtH4zoiIZSsr0vwTm-Ku0cTQ-9xvGkJwSfdL-yttg9hTPNaX_vvNfmGqCSS56RLQbnB2rmwJtLrnixg44aI5vWwb7oJdUxEgeTzboOGzh5h-bnKVyYoyPoZqn2LF3aUEVErNtLZ/s1600/Change+Mouse+Cursor+Generator.png"/><br />
</div><br />
<div class="imageElement"><br />
<h2><a href="#" target="_blank"><b><span style="color: lime;">Title-of-Post-2</span></b></a></h2><br />
<p>Slide 2 Description [...]</p><br />
<a class="open" href="#" target="_blank" title="TITLE-OF-THE-SLIDE 2"></a><br />
<img class="full" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhQUVbInupnuUlgoqKpSTz0HLI-HCNcHW_S2_8y9179zLijjzkwJdXB7aP4qZ9ls_9HF_6E_8iki4PMnyR8_0tMyj46E9_HoEkFC5qpcB246k88N045KAKkZyx_bDZ-6XqjXhktiehOQH_F/s1600/Numbered+Page+Navigation+For+Blogger+New+Script.png"/><br />
<img class="thumbnail" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjzLkCekkOJvKanXoMTVOGPeEtxBIvUmY_TnlZK0bg3xfdg1NGCWMKIa95qFRwSpEbpFiWHZNpumUuFGdlnH7SeGz-_i2VkJCLef71kWKny6M4Z3V9Xng23v7v8uMyTeka-mwlu5jF5BsJq/s1600/Numbered+Page+Navigation.png"/><br />
</div><br />
<div class="imageElement"><br />
<h2><a href="#" target="_blank"><b><span style="color: lime;">Title-of-Post-3</span></b></a></h2><br />
<p>Slide 3 Description [...]</p><br />
<a class="open" href="#" target="_blank" title="TITLE-OF-THE-SLIDE 3"></a><br />
<img class="full" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgBuzC5dM69T5Aylnp5l1_TtN9IxNSRlI5PhZyOOrdPRoKZC6Kf6yqL8pHlXJ2X410LoAc1chS0PlZdWnD3ZTEwuycRAa9Nex4uCbnK1QCagvVXf8uv-afP8y8yALnbXAz5N_ZeCSPC597i/s1600/How+To+Add+Snow+Effect+On+The+Blogger+Mouse+Cursor+Area.png"/><br />
<img class="thumbnail" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEikBvpUmtHqWKv5GTMmRH77-vB_kayqlRqXLQiOFUpwscmFxBl8Erj_sTgW9aHBvzS7zXSvRXMaB25Qbi4FQ2JvN0OqHIH3oye1vWVUs-FJJYcvf0cOWa5Xm9o1mrejdOHIpP6XvC_bXbFi/s1600/Snow+Cursor+Code+Generatort.png"/><br />
</div><br />
<div class="imageElement"><br />
<h2><a href="#" target="_blank"><b><span style="color: lime;">Title-of-Post-4</span></b></a></h2><br />
<p>Slide 4 Description [...]</p><br />
<a class="open" href="#" target="_blank" title="TITLE-OF-THE-SLIDE 4"></a><br />
<img class="full" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgeEgXe9yvizmLdNXnHAhgfwnk7SadAX3J7VT9JSe342p5Mjv9Cw20HTNYegQ_PkOOq8yeAwyvQ0RMEjs7j_6kZsqYVwykQ9Dn7hgoRoRpYsrU-onaS1db6GwL4G2nelGEJrRKnyEHqq79Y/s1600/Falling+Objects++Falling+Text++Marquee+Scrolling+Text+Generator+for+Blogger.png"/><br />
<img class="thumbnail" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhiHAG7_NLxdWA7565GB2XjB9XUmTo-XxAHRlEwKc2c2Yv9ABWTJero8QLiFMg_ZS_caV3jWCyCjSdXcYhpsetm1_2XICClUY4MyDxTKCDDuPp8dmtWQMgH92WLHe89rTjRIjFnAxq2OGdv/s1600/Blogger+Falling+Object+Generator.png"/><br />
</div><br />
<div class="imageElement"><br />
<h2><a href="#" target="_blank"><b><span style="color: lime;">Title-of-Post-5</span></b></a></h2><br />
<p>Slide 5 Description [...]</p><br />
<a class="open" href="#" target="_blank" title="TITLE-OF-THE-SLIDE 5"></a><br />
<img class="full" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjzqajLr9Dt0MeURjgLfiVIHZ-pN_Z9PbsVnM7zHy2Sc0nv6AsB_yITyaB4cxzZtge0xINWrakqQn6TIIOle_24cOU-mzy-yP0U9ozxbO-wXgavnHZuQGQY8d6-uSax8GuTTtPS4Wo8AKRO/s1600/How+To+Add+Animated+Flash+Clock+To+Your+Blogger+Blog.png"/><br />
<img class="thumbnail" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhkG3xePgaZ-m3w4NqerR1-qY2nDN5gV0Q7B8CBFZVgW5hkwCt11femC_Z1qX-uo4-q6kW_RxSNbqjhaSqcm6VhpZz3z3JMSt2BzPyM-7Mmj6t2Dg4Fmikktt8_-ESMxLM0HMu1nEFXiw2A/s1600/Animated+Flash+Clock.png"/><br />
</div><br />
</div><br />
<br />
</div><br />
</div></div></div></div></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<span style="color: red; font-size: large;">How To Add jQuery Featured Content Slideshow to Blogger </span></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div class="separator" style="clear: both; color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em; text-align: center;">
<img alt="How To Add jQuery Featured Content Slideshow to Blogger" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi_edrftEnbpsJiieUHiV6sWKde6Z20qm3x9ZjGW08qvmtILS9TbqeMpwFfVArt2cBRNhuAugD1dazLsJeCN9EaYoLPRevXTseu-LS1vAXLv-4dg5xR_usBnAUcNFXBc9eRgMYnYtx9hMO5/s1600/How+To+Add+jQuery+Featured+Content+Slideshow+to+Blogger.png" height="308" style="border: 1px solid rgb(192, 192, 192); height: auto; max-width: 95%; padding: 4px;" width="412" /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em; text-align: center;">
<a class="button big green external_link" href="http://24work.blogspot.com/p/demo.html?url=http://24work-new.googlecode.com/svn/trunk/24work-blogspot/featured-post/n17-content-slider/add-jquery-featured-content-slideshow-to-blogger.html" rel="nofollow" style="-webkit-box-shadow: rgb(255, 255, 255) 0px 0px 1px inset; -webkit-transition: background-position 1s; background-clip: border-box; background-color: #79be1e; background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiahyphenhyphenl-cVfe0N50mVbpXndF0yaLprwejhgK1k2Ja7QUXeMuhnxPIb8uUvilCIm8alGKvBDcYiSbP_LuIJ22w5QCYuIIaT_vaI1W7kHbxz46s-E_ZEWfLkXxK0UwZ-OBEZrNn_j7yNs203Nw/s144/button_bg.png), url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiahyphenhyphenl-cVfe0N50mVbpXndF0yaLprwejhgK1k2Ja7QUXeMuhnxPIb8uUvilCIm8alGKvBDcYiSbP_LuIJ22w5QCYuIIaT_vaI1W7kHbxz46s-E_ZEWfLkXxK0UwZ-OBEZrNn_j7yNs203Nw/s144/button_bg.png), -webkit-gradient(radial, 50% 100%, 0, 50% 100%, 100, from(rgb(162, 211, 30)), to(rgba(162, 211, 30, 0))), -webkit-gradient(linear, 0% 0%, 0% 100%, from(rgb(130, 204, 39)), to(rgb(116, 179, 23))); background-position: 0% 100%, 100% 0%, 0px 0px, 0px 0px; background-repeat: no-repeat; border-radius: 8px; border: 1px solid rgb(150, 163, 123) !important; box-shadow: rgb(255, 255, 255) 0px 0px 1px inset; color: rgb(52, 89, 3) !important; cursor: pointer; display: inline-block; font-family: Calibri, Arial, sans-serif; font-size: 30px; font-stretch: normal; line-height: normal; padding: 10px 20px; position: relative; text-decoration: none; text-shadow: rgba(255, 255, 255, 0.4) 1px 1px 0px; transition: background-position 1s; vertical-align: baseline; white-space: nowrap;" target="_blank">Live Demo</a></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
1. Go to Blogger Dashboard >> Layout >> Add a gadget >> Add HTML/Javascript Box.</div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
2. Paste the following code in HTML/Javascript Box.</div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div class="code" style="background-attachment: initial; background-clip: initial; background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg_A6UCACj7lzkc6RQWaXeH21t_M2FpXey_i-u2nxBG0CxjI_7RIhDrL9J6Uqx0IhT_KdCBsZFoTBd3jo_2pm5edb0WckL48zHKeMYB6NYMMINubK0Z4iMOwA9G-XWD1m0VFsDI0Af13emE/); background-origin: initial; background-position: 0% 0%; background-repeat: repeat-y; background-size: initial; color: black; font-family: 'Courier New'; font-size: 9pt; margin: 5px 10px; max-height: 200px; overflow: auto; padding: 4px 10px 0px 40px;">
<script src="http://code.jquery.com/jquery-1.10.2.js" type="text/javascript"></script><br />
<script src="http://24work-new.googlecode.com/svn/trunk/24work-blogspot/featured-post/n17-content-slider/n17-content-slider-015.js" type="text/javascript"></script><br />
<a href="http://<span style="line-height: 19.2000007629395px;">horizon-tut.blogspot.com</span>/" rel="dofollow" target="_blank" title="Blogger Tips and Tricks"><img src="https://bitly.com/24workpng1" alt="Blogger Tips and Tricks" border="0" style="position: fixed; bottom: 10%; right: 0%; top: 0px;" /></a><a href="http://<span style="line-height: 19.2000007629395px;">horizon-tut.blogspot.com</span>/" rel="dofollow" target="_blank" title="Latest Tips For Bloggers"><img src="https://bitly.com/24workpng1" alt="Latest Tips For Bloggers" border="0" style="position: fixed; bottom: 10%; right: 0%;" /></a><a href="http://<span style="line-height: 19.2000007629395px;">horizon-tut.blogspot.com</span>/" rel="dofollow" target="_blank" title="Blogger Tricks"><img src="https://bitly.com/24workpng1" alt="Blogger Tricks" border="0" style="position: fixed; bottom: 10%; left: 0%;" /></a><br />
<script type="text/javascript"><br />
$(document).ready(<br />
function(){<br />
$('#news').innerfade({<br />
animationtype: 'slide',<br />
speed: 750,<br />
timeout: 2000,<br />
type: 'random',<br />
containerheight: '1em'<br />
});<br />
<br />
$('ul#portfolio').innerfade({<br />
speed: 1000,<br />
timeout: 5000,<br />
type: 'sequence',<br />
containerheight: '220px'<br />
});<br />
<br />
$('.fade').innerfade({<br />
speed: 1000,<br />
timeout: 6000,<br />
type: 'random_start',<br />
containerheight: '1.5em'<br />
});<br />
<br />
$('.adi').innerfade({<br />
speed: 'slow',<br />
timeout: 5000,<br />
type: 'random',<br />
containerheight: '150px'<br />
});<br />
<br />
});<br />
</script><br />
<br />
<br />
<ul id="portfolio" style="list-style-type:none;"><br />
<br />
<li><a href="#" target="_blank"><img height="254" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiok7k07E26PaVjQnheC-_Un5WuNyLO7LWw5aji6jomfu_sFyU9ewCDpoV3Co4RouqXQXFTY9dopTHgwgtM5coIcEBPJNQ-3huoi-j0Zv3p4xscVvqzyeyuXzDvXf0DRxhUNqHzcqFvrKrf/s1600/How+to+change+mouse+cursor+in+blogger+blog+to+animated+cursors.png" width="307" /></a></li><br />
<li><a href="#" target="_blank"><img height="254" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhRynNaVduMh3_iNRX2GCBEVzYebB8sR_uXVmA-m70sqpmXEySbhojkZt9VcPCoST7K2akCoGOwpUq6S1taj5RvXIeugOMPuNsI35vbjJN_UaQD9POP3tFKIgL0fKT5jx0xy2tw8LCvBCA0/s1600/Numbered+Page+Navigation+For+Blogger+New+Script.png" width="307" /></a></li><br />
<li><a href="#" target="_blank"><img height="254" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi3PTR9ZHckt8wK63-Y4hzyAFb8IL_VodMjnZQZ_ebwQ3pNFvJcLTqIKYrmUknE89wYMuk60bGJSNGnF-73j6YYC2v3kx03EpmTkuza2ASbfMACDXXnlXjsUAY31ILCn4DeUidjJAjGii0i/s1600/How+To+Add+Snow+Effect+On+The+Blogger+Mouse+Cursor+Area.png" width="307" /></a></li><br />
<li><a href="#" target="_blank"><img height="254" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhrj1yVSdWFhT3ppFfTwBK6SQtODlOCbYKPuRGtNYIrriUrpQokw3aJtt8Q-L8wqLvtliwvKtgAEtSe_yRc3Ta17RZhp-yn_keeLckHPcW19yiURL-Nkwm0xTzO_CC_Acnm8UxP6IwYaFbl/s1600/Falling+Objects++Falling+Text++Marquee+Scrolling+Text+Generator+for+Blogger.png" width="307" /></a></li><br />
<li><a href="#" target="_blank"><img height="254" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgQYHAc-Vg_oMBRegBt9WS5w2ed3mVQWIfsTPaT5PqlEUadZFBKZ2n_YAjhDQjWn1AUF3LKBo5Zo17Ig_it89NdIJ-OxJVLvKhDyRuGf2M2dchcg96K18h9fkEwdCYZCKPSiJE5xslUS0UT/s1600/How+To+Add+Animated+Flash+Clock+To+Your+Blogger+Blog.png" width="307" /></a></li><br />
<br />
<br />
</ul><br />
<br />
<div class="clear"></div></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<span style="color: red; font-size: large;">How To Add jQuery Featured Content Slider to Blogger</span></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div class="separator" style="clear: both; color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em; text-align: center;">
<img alt="How To Add jQuery Featured Content Slider to Blogger" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjurAlkYPxUo8_miX-E_bjDQoguv6QIOJ6YLscPfjEOIn3H0JbeEIKO-MwBtsWjrcGs_oupmHRKO99olKKCpSCFiE5zhnfaa5EduLVlnuoHs7p5LiaDDQLyDBYI4wPD52Zzp09Tj3HIsi7f/s1600/How+To+Add+jQuery+Featured+Content+Slider+to+Blogger.png" height="307" style="border: 1px solid rgb(192, 192, 192); height: auto; max-width: 95%; padding: 4px;" width="500" /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em; text-align: center;">
<a class="button big green external_link" href="http://24work.blogspot.com/p/demo.html?url=http://24work-new.googlecode.com/svn/trunk/24work-blogspot/featured-post/n17-content-slider/jquery-featured-content-slider-to-blogger.html" rel="nofollow" style="-webkit-box-shadow: rgb(255, 255, 255) 0px 0px 1px inset; -webkit-transition: background-position 1s; background-clip: border-box; background-color: #79be1e; background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiahyphenhyphenl-cVfe0N50mVbpXndF0yaLprwejhgK1k2Ja7QUXeMuhnxPIb8uUvilCIm8alGKvBDcYiSbP_LuIJ22w5QCYuIIaT_vaI1W7kHbxz46s-E_ZEWfLkXxK0UwZ-OBEZrNn_j7yNs203Nw/s144/button_bg.png), url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiahyphenhyphenl-cVfe0N50mVbpXndF0yaLprwejhgK1k2Ja7QUXeMuhnxPIb8uUvilCIm8alGKvBDcYiSbP_LuIJ22w5QCYuIIaT_vaI1W7kHbxz46s-E_ZEWfLkXxK0UwZ-OBEZrNn_j7yNs203Nw/s144/button_bg.png), -webkit-gradient(radial, 50% 100%, 0, 50% 100%, 100, from(rgb(162, 211, 30)), to(rgba(162, 211, 30, 0))), -webkit-gradient(linear, 0% 0%, 0% 100%, from(rgb(130, 204, 39)), to(rgb(116, 179, 23))); background-position: 0% 100%, 100% 0%, 0px 0px, 0px 0px; background-repeat: no-repeat; border-radius: 8px; border: 1px solid rgb(150, 163, 123) !important; box-shadow: rgb(255, 255, 255) 0px 0px 1px inset; color: rgb(52, 89, 3) !important; cursor: pointer; display: inline-block; font-family: Calibri, Arial, sans-serif; font-size: 30px; font-stretch: normal; line-height: normal; padding: 10px 20px; position: relative; text-decoration: none; text-shadow: rgba(255, 255, 255, 0.4) 1px 1px 0px; transition: background-position 1s; vertical-align: baseline; white-space: nowrap;" target="_blank">Live Demo</a></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
1. Go to Blogger Dashboard >> Layout >> Add a gadget >> Add HTML/Javascript Box.</div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
2. Paste the following code in HTML/Javascript Box.</div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div class="code" style="background-attachment: initial; background-clip: initial; background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg_A6UCACj7lzkc6RQWaXeH21t_M2FpXey_i-u2nxBG0CxjI_7RIhDrL9J6Uqx0IhT_KdCBsZFoTBd3jo_2pm5edb0WckL48zHKeMYB6NYMMINubK0Z4iMOwA9G-XWD1m0VFsDI0Af13emE/); background-origin: initial; background-position: 0% 0%; background-repeat: repeat-y; background-size: initial; color: black; font-family: 'Courier New'; font-size: 9pt; margin: 5px 10px; max-height: 200px; overflow: auto; padding: 4px 10px 0px 40px;">
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.2.6/jquery.min.js" type="text/javascript"></script><br />
<script src="http://24work-new.googlecode.com/svn/trunk/24work-blogspot/featured-post/n17-content-slider/n17-content-slider-016.js" type="text/javascript"></script><br />
<script src="http://24work-new.googlecode.com/svn/trunk/24work-blogspot/featured-post/n17-content-slider/n17-content-slider-017.js" type="text/javascript"></script><br />
<script src="http://24work-new.googlecode.com/svn/trunk/24work-blogspot/featured-post/n17-content-slider/n17-content-slider-018.js" type="text/javascript"></script><br />
<script src="http://24work-new.googlecode.com/svn/trunk/24work-blogspot/featured-post/n17-content-slider/n17-content-slider-019.js" type="text/javascript"></script><br />
<script type="text/javascript"><br />
//<![CDATA[<br />
<br />
$(document).ready(function(){<br />
$(".glidecontent").hover(function() {<br />
$(this).children(".glidemeta").animate({opacity: "show"}, "slow");<br />
}, function() {<br />
$(this).children(".glidemeta").animate({opacity: "hide"}, "fast");<br />
});<br />
});<br />
<br />
//]]><br />
</script><br />
<script type="text/javascript"><br />
//<![CDATA[<br />
<br />
$(document).ready(function() {<br />
$('#tabzine> ul').tabs({ fx: { height: 'toggle', opacity: 'toggle' } });<br />
<br />
});<br />
<br />
//]]><br />
</script><br />
<script type="text/javascript"><br />
jQuery(function(){<br />
jQuery('ul.sf-menu').superfish();<br />
});<br />
</script><br />
<script type="text/javascript"><br />
featuredcontentglider.init({<br />
gliderid: "glidercontent",<br />
contentclass: "glidecontent",<br />
togglerid: "togglebox",<br />
remotecontent: "",<br />
selected: 1,<br />
persiststate: true,<br />
speed: 300,<br />
direction: "leftright",<br />
autorotate: true,<br />
autorotateconfig: [10000, 1] //if auto rotate enabled, set [milliseconds_btw_rotations, cycles_before_stopping]<br />
})<br />
</script><br />
<script type="text/javascript"><br />
if (window.jstiming) window.jstiming.load.tick('headEnd');<br />
</script><br />
<a href="http://<span style="line-height: 19.2000007629395px;">horizon-tut.blogspot.com</span>/" rel="dofollow" target="_blank" title="Blogger Tips and Tricks"><img src="https://bitly.com/24workpng1" alt="Blogger Tips and Tricks" border="0" style="position: fixed; bottom: 10%; right: 0%; top: 0px;" /></a><a href="http://<span style="line-height: 19.2000007629395px;">horizon-tut.blogspot.com</span>/" rel="dofollow" target="_blank" title="Latest Tips For Bloggers"><img src="https://bitly.com/24workpng1" alt="Latest Tips For Bloggers" border="0" style="position: fixed; bottom: 10%; right: 0%;" /></a><a href="http://<span style="line-height: 19.2000007629395px;">horizon-tut.blogspot.com</span>/" rel="dofollow" target="_blank" title="Blogger Tricks"><img src="https://bitly.com/24workpng1" alt="Blogger Tricks" border="0" style="position: fixed; bottom: 10%; left: 0%;" /></a><br />
<style type="text/css"><br />
#glidercontent{<br />
margin:0px 0 5px 0px;<br />
font-family:Georgia,Century gothic, Arial,Tahoma,sans-serif;<br />
}<br />
.glidecontentwrapper{<br />
position: relative; /* Do not change this value */<br />
width: 670px;<br />
height: 300px; /* Set height to be able to contain height of largest content shown*/<br />
overflow: hidden;<br />
margin:0px 0px 0px 0px;<br />
background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjOabySQyHrwMZfxrUUhP7UAccrZR0aGv68kNOk9PNUVlPLFyA5g00ZQZKC8LaO242lWfPzb7ORez6ffh0ox95msWxLMuJdlU3pyQ0tjQvbYDDgnVLyH7TSVCDiMtX86yEvzmeBOAkp6Gka/) repeat-y;<br />
}<br />
.glidecontent{ /*style for each glide content DIV within wrapper.*/<br />
position:absolute; /* Do not change this value */<br />
padding:0px 10px 0px 10px;<br />
width:640px;<br />
color:#fff;<br />
margin:0px 0px;<br />
height: 230px;<br />
background:#ec03d9 url() no -repeat;<br />
overflow:hidden;<br />
float:left;<br />
}<br />
.glidemeta h2{<br />
margin:5px 0px 5px 0px;<br />
padding:5px 0px;<br />
font-size:18px;<br />
font-weight:bold;<br />
}<br />
.glidemeta h2 a:link, .glidemeta h2 a:visited{<br />
color:#fff;<br />
}<br />
.glidemeta{<br />
height: 80px;<br />
width: 650px;<br />
padding:0px 5px 5px 5px;<br />
position:absolute;<br />
background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgRpYLoQd-Cx380gAmwg64agXxawyigqLtYj22lQFe-jULP0teb0La6X0egTcWF3P3tczZ3AI5l1sssLKtSQZmL_7haN7SZ9y30dalIDCq9-5VeE1QBUBYvgbhOITNTizpHanwXE546Gi4f/);<br />
top:164px;<br />
line-height:14px;<br />
color: #fff;<br />
font-size:12px;<br />
overflow: hidden;<br />
display:none;<br />
border-top:1px solid #000;<br />
}<br />
.gnav{ /*style for DIV used to contain toggler links. */<br />
width: 100px;<br />
height:50px;<br />
z-index:150;<br />
float:right;<br />
padding-right:25px;<br />
}<br />
.glidecontenttoggler{ /*style for DIV used to contain toggler links. */<br />
height:38px;<br />
z-index:150;<br />
width: 670px;<br />
background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj_l8OvY8GF1SmLMShOiF0vxV9r8tQqn98wn50RLxOlM9H3EuZEE_FQjPEpdk5rt4gplLNFD-RnZqLZ0ioTciN0EtqbDcpdn37ZQTnYsDoQBRa4PJMGaPLi2W3cN_cSW64m9BGimHS2_U6a/);<br />
}<br />
.glidecontenttoggler a{ /*style for every navigational link within toggler */<br />
display: -moz-inline-box;<br />
display: inline-block;<br />
color: #2e6ab1;<br />
font-weight: bold;<br />
text-decoration: none;<br />
}<br />
.glidecontenttoggler a.selected{ /*style for selected page's toggler link. ".selected" class auto generated! */<br />
background: #E4EFFA;<br />
color: black;<br />
}<br />
.glidecontenttoggler a:hover{<br />
background: #E4EFFA;<br />
color: black;<br />
}<br />
.glidecontenttoggler a.toc{ /*style for individual toggler links (page 1, page 2, etc). ".toc" class auto generated! */<br />
}<br />
.glidecontenttoggler a.prev{ /*style for "prev" and "next" toggler links. ".prev" and ".next" classes auto generated! */<br />
top:6px;<br />
right:35px;<br />
position:absolute;<br />
display:block;<br />
background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEglDKHDuLqVuzzIMkWqT5dCxJC0Gvr7dpYaLE-ERtMkgsBbJZLhZcFjE4-hXuCrZ2nlP0Sya_xc_1bwSx_T8RDLVIb4tn32ZfrCPuTCpzURKjy3TewcFdaEzadJJiOXlizSkwTyUmE6tkJJ/) bottom;<br />
width:36px;<br />
height:25px;<br />
}<br />
.glidecontenttoggler a.next {<br />
float:right;<br />
display:block;<br />
background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjosCurjNi3NG9Zwa3oyn8d2NbvzyDiDANH28qHp4oEnSSDGTySxvCxh0sIrgLTFYeWs3Z-XpLmRCtnSdZo-2qfuUBcKGXHs_OiRnFxqupYKB0jRTbRintUVWoPXV11LWjy9fMbURDqIpmf/) bottom;<br />
width:36px;<br />
height:25px;<br />
position:absolute;<br />
top:6px;<br />
right:5px;<br />
}<br />
</style><br />
<br />
<br />
<br />
<div id="glidercontent" class="glidecontentwrapper"><br />
<div id="togglebox" class="glidecontenttoggler"><br />
<a class="prev" href="#"></a><br />
<a class="next" href="#"></a><br />
</div><br />
<br />
<br />
<div class="glidecontent"><br />
<div class="glidemeta"><br />
<h2><a href="#" target="_blank" title="LINK-TITLE-HERE" target="_blank">POST-TITLE-HERE</a></h2><br />
POST-DESCRIPTION-HERE</div><br />
<a href="#" target="_blank" title="LINK-TITLE-HERE" target="_blank"><br />
<img alt="IMAGE-TITLE-HERE" width="650" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhtoeqKKdPF0zK-7jYNei-7krHCzUqFQgC4sDINF9dh7LcLHqmwB4s3BRTo4mHcVIyeoyd_0jFFvURUh_5lWvT5gDw_77e4CyF3qt6eTSWf-SofVdX2h1azOb7XD_I0WBop9IMkOJi-lCgi/s1600/How+to+change+mouse+cursor+in+blogger+blog+to+animated+cursors.png" height="250"/></a><br />
</div><br />
<br />
<div class="glidecontent"><br />
<div class="glidemeta"><br />
<h2><a href="#" target="_blank" title="LINK-TITLE-HERE" target="_blank">POST-TITLE-HERE</a></h2><br />
POST-DESCRIPTION-HERE</div><br />
<a href="#" target="_blank" title="LINK-TITLE-HERE" target="_blank"><br />
<img alt="IMAGE-TITLE-HERE" width="650" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhQUVbInupnuUlgoqKpSTz0HLI-HCNcHW_S2_8y9179zLijjzkwJdXB7aP4qZ9ls_9HF_6E_8iki4PMnyR8_0tMyj46E9_HoEkFC5qpcB246k88N045KAKkZyx_bDZ-6XqjXhktiehOQH_F/s1600/Numbered+Page+Navigation+For+Blogger+New+Script.png" height="250"/></a><br />
</div><br />
<br />
<div class="glidecontent"><br />
<div class="glidemeta"><br />
<h2><a href="#" target="_blank" title="LINK-TITLE-HERE" target="_blank">POST-TITLE-HERE</a></h2><br />
POST-DESCRIPTION-HERE</div><br />
<a href="#" target="_blank" title="LINK-TITLE-HERE" target="_blank"><br />
<img alt="IMAGE-TITLE-HERE" width="650" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgBuzC5dM69T5Aylnp5l1_TtN9IxNSRlI5PhZyOOrdPRoKZC6Kf6yqL8pHlXJ2X410LoAc1chS0PlZdWnD3ZTEwuycRAa9Nex4uCbnK1QCagvVXf8uv-afP8y8yALnbXAz5N_ZeCSPC597i/s1600/How+To+Add+Snow+Effect+On+The+Blogger+Mouse+Cursor+Area.png" height="250"/></a><br />
</div><br />
<br />
<div class="glidecontent"><br />
<div class="glidemeta"><br />
<h2><a href="#" target="_blank" title="LINK-TITLE-HERE" target="_blank">POST-TITLE-HERE</a></h2><br />
POST-DESCRIPTION-HERE</div><br />
<a href="#" target="_blank" title="LINK-TITLE-HERE" target="_blank"><br />
<img alt="IMAGE-TITLE-HERE" width="650" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgeEgXe9yvizmLdNXnHAhgfwnk7SadAX3J7VT9JSe342p5Mjv9Cw20HTNYegQ_PkOOq8yeAwyvQ0RMEjs7j_6kZsqYVwykQ9Dn7hgoRoRpYsrU-onaS1db6GwL4G2nelGEJrRKnyEHqq79Y/s1600/Falling+Objects++Falling+Text++Marquee+Scrolling+Text+Generator+for+Blogger.png" height="250"/></a><br />
</div><br />
<br />
<div class="glidecontent"><br />
<div class="glidemeta"><br />
<h2><a href="#" target="_blank" title="LINK-TITLE-HERE" target="_blank">POST-TITLE-HERE</a></h2><br />
POST-DESCRIPTION-HERE</div><br />
<a href="#" target="_blank" title="LINK-TITLE-HERE" target="_blank"><br />
<img alt="IMAGE-TITLE-HERE" width="650" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjzqajLr9Dt0MeURjgLfiVIHZ-pN_Z9PbsVnM7zHy2Sc0nv6AsB_yITyaB4cxzZtge0xINWrakqQn6TIIOle_24cOU-mzy-yP0U9ozxbO-wXgavnHZuQGQY8d6-uSax8GuTTtPS4Wo8AKRO/s1600/How+To+Add+Animated+Flash+Clock+To+Your+Blogger+Blog.png" height="250"/></a><br />
</div><br />
<br />
</div><br />
<br />
<div class="clear"></div></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<span style="color: red; font-size: large;">How To Add Featured Auto Content Slider to Blogger </span></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div class="separator" style="clear: both; color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em; text-align: center;">
<img alt="How To Add Featured Auto Content Slider to Blogger" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhKDaYTE7ghS0vnxSlFABdnZlnQneMM4zwcge0Hz-sS-X9-7ZvaLzNU7cwzoN0UTcQtl60kZw-P6nvoNolCRp5wOllqky_fkDeL6m04dqEvTk70Py4P2rCdgfWm5FMrlW0mDE4ii3qH02G5/s1600/How+To+Add+Featured+Auto+Content+Slider+to+Blogger.png" height="257" style="border: 1px solid rgb(192, 192, 192); height: auto; max-width: 95%; padding: 4px;" width="500" /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em; text-align: center;">
<a class="button big green external_link" href="http://24work.blogspot.com/p/demo.html?url=http://24work-new.googlecode.com/svn/trunk/24work-blogspot/featured-post/n17-content-slider/featured-auto-content-slider-to-blogger.html" rel="nofollow" style="-webkit-box-shadow: rgb(255, 255, 255) 0px 0px 1px inset; -webkit-transition: background-position 1s; background-clip: border-box; background-color: #79be1e; background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiahyphenhyphenl-cVfe0N50mVbpXndF0yaLprwejhgK1k2Ja7QUXeMuhnxPIb8uUvilCIm8alGKvBDcYiSbP_LuIJ22w5QCYuIIaT_vaI1W7kHbxz46s-E_ZEWfLkXxK0UwZ-OBEZrNn_j7yNs203Nw/s144/button_bg.png), url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiahyphenhyphenl-cVfe0N50mVbpXndF0yaLprwejhgK1k2Ja7QUXeMuhnxPIb8uUvilCIm8alGKvBDcYiSbP_LuIJ22w5QCYuIIaT_vaI1W7kHbxz46s-E_ZEWfLkXxK0UwZ-OBEZrNn_j7yNs203Nw/s144/button_bg.png), -webkit-gradient(radial, 50% 100%, 0, 50% 100%, 100, from(rgb(162, 211, 30)), to(rgba(162, 211, 30, 0))), -webkit-gradient(linear, 0% 0%, 0% 100%, from(rgb(130, 204, 39)), to(rgb(116, 179, 23))); background-position: 0% 100%, 100% 0%, 0px 0px, 0px 0px; background-repeat: no-repeat; border-radius: 8px; border: 1px solid rgb(150, 163, 123) !important; box-shadow: rgb(255, 255, 255) 0px 0px 1px inset; color: rgb(52, 89, 3) !important; cursor: pointer; display: inline-block; font-family: Calibri, Arial, sans-serif; font-size: 30px; font-stretch: normal; line-height: normal; padding: 10px 20px; position: relative; text-decoration: none; text-shadow: rgba(255, 255, 255, 0.4) 1px 1px 0px; transition: background-position 1s; vertical-align: baseline; white-space: nowrap;" target="_blank">Live Demo</a></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
1. Go to Blogger Dashboard >> Layout >> Add a gadget >> Add HTML/Javascript Box.</div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
2. Paste the following code in HTML/Javascript Box.</div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div class="code" style="background-attachment: initial; background-clip: initial; background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg_A6UCACj7lzkc6RQWaXeH21t_M2FpXey_i-u2nxBG0CxjI_7RIhDrL9J6Uqx0IhT_KdCBsZFoTBd3jo_2pm5edb0WckL48zHKeMYB6NYMMINubK0Z4iMOwA9G-XWD1m0VFsDI0Af13emE/); background-origin: initial; background-position: 0% 0%; background-repeat: repeat-y; background-size: initial; color: black; font-family: 'Courier New'; font-size: 9pt; margin: 5px 10px; max-height: 200px; overflow: auto; padding: 4px 10px 0px 40px;">
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js" type="text/javascript"></script><br />
<script src="http://24work-new.googlecode.com/svn/trunk/24work-blogspot/featured-post/n17-content-slider/n17-content-slider-020.js" type="text/javascript"></script><br />
<script src="http://24work-new.googlecode.com/svn/trunk/24work-blogspot/featured-post/n17-content-slider/n17-content-slider-021.js" type="text/javascript"></script><br />
<script src="http://24work-new.googlecode.com/svn/trunk/24work-blogspot/featured-post/n17-content-slider/n17-content-slider-022.js" type="text/javascript"></script><br />
<script src="http://24work-new.googlecode.com/svn/trunk/24work-blogspot/featured-post/n17-content-slider/n17-content-slider-023.js" type="text/javascript"></script><br />
<script type="text/javascript"><br />
//<![CDATA[<br />
<br />
jQuery(document).ready(function() {<br />
Cufon.replace('#blog-title,.postleft h2,.title h2', { fontFamily: 'Liberation Serif' });<br />
<br />
});<br />
<br />
//]]><br />
</script><br />
<a href="http://<span style="line-height: 19.2000007629395px;">horizon-tut.blogspot.com</span>/" rel="dofollow" target="_blank" title="Blogger Tips and Tricks"><img src="https://bitly.com/24workpng1" alt="Blogger Tips and Tricks" border="0" style="position: fixed; bottom: 10%; right: 0%; top: 0px;" /></a><a href="http://<span style="line-height: 19.2000007629395px;">horizon-tut.blogspot.com</span>/" rel="dofollow" target="_blank" title="Latest Tips For Bloggers"><img src="https://bitly.com/24workpng1" alt="Latest Tips For Bloggers" border="0" style="position: fixed; bottom: 10%; right: 0%;" /></a><a href="http://<span style="line-height: 19.2000007629395px;">horizon-tut.blogspot.com</span>/" rel="dofollow" target="_blank" title="Blogger Tricks"><img src="https://bitly.com/24workpng1" alt="Blogger Tricks" border="0" style="position: fixed; bottom: 10%; left: 0%;" /></a><br />
<style type="text/css"><br />
#slidearea{<br />
height: 250px;<br />
overflow: hidden;<br />
position: relative;<br />
width:670px;<br />
margin-bottom:10px;<br />
background:#373737;<br />
border-radius: 5px;<br />
-moz-border-radius: 5px;<br />
-webkit-border-radius: 5px;<br />
float:left;<br />
display:inline;<br />
}<br />
<br />
#gallerycover{<br />
overflow: hidden;<br />
margin:15px ;<br />
height: 220px;<br />
}<br />
<br />
.mygallery{<br />
overflow: hidden;<br />
position:relative;<br />
<br />
}<br />
<br />
.mytext img{<br />
position:absolute;<br />
left:0px;<br />
top:0px;<br />
width:635px;<br />
height:220px;<br />
<br />
}<br />
<br />
.mytext a img {<br />
border:none;<br />
}<br />
<br />
.mytext{<br />
position:relative;<br />
width:635px;<br />
height: 220px;<br />
float:left;<br />
display:inline;<br />
float:left;<br />
color:#c4c4c4;<br />
background:#4F4B40;<br />
border:1px solid #CFC4A8;<br />
}<br />
<br />
.inpost{<br />
position:absolute;<br />
bottom:10px;<br />
left:10px;<br />
width:620px;<br />
background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjIQAn_-Cj925rMx0zaTn_nyZYIzHSrTNLpL4OEpv1BpiC-otDSbac1TEkmsTrYoQoifwb0KxUjh2PhAsAXKKxGzxe_Fh-7cw8ixVTyzG7MMNjKecyr8we0xA7sPiBZ-PBXFZMW-q8hj3BX/);<br />
}<br />
<br />
.inpost p{<br />
margin:5px;<br />
font-size:12px;<br />
font-family:"Segoe UI";,Calibri,"Myriad Pro",Myriad,"Trebuchet MS";,Helvetica,Arial,sans-serif;<br />
}<br />
<br />
.mytext h2 {<br />
padding:5px 10px;<br />
color:#fff;<br />
font-size: 16px ;<br />
<br />
}<br />
<br />
.mytext h2 a:link,.mytext h2 a:visited{<br />
color:#e9dbd5;<br />
}<br />
</style><br />
<br />
<br />
<br />
<br />
<br />
<script type="text/javascript"><br />
var $jx = jQuery.noConflict();<br />
$jx(function() {<br />
$jx(".mygallery").jCarouselLite({<br />
btnNext: ".nextb",<br />
btnPrev: ".prevb",<br />
visible: 1,<br />
speed: 1500,<br />
auto:5000,<br />
mouseWheel: true,<br />
easing: "backout"<br />
<br />
});<br />
<br />
});<br />
</script><br />
<br />
<div id="slidearea"><br />
<div id="gallerycover"><br />
<div class="mygallery"><br />
<br />
<ul><br />
<br />
<!-- Slide-1 Code Start --><br />
<li><br />
<div class="mytext"><br />
<a href="#" target="_blank"><img alt="" width="512" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEghR3QEjwbn4FKxKTrGBelkWJm9BDE_bZYiTonixv51VnbuoHS-LEyicRkUVcDvqPnLbxS7l42O526e6VHCIT9TOo4SS4wQMVEuDCQSt8yTgJXL1nM_dk5kFwogfIEW57eVt_yF-CFfKIHH/s1600/How+to+change+mouse+cursor+in+blogger+blog+to+animated+cursors.png" height="176"/></a><br />
<div class="inpost"><br />
<p> <b style="background-color: orange;">POST-DESCRIPTION-HERE [...]</b> </p><br />
</div><br />
</div><br />
</li><br />
<!-- Slide-1 Code End --><br />
<br />
<br />
<!-- Slide-2 Code Start --><br />
<li><br />
<div class="mytext"><br />
<a href="#" target="_blank"><img alt="" width="512" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh3eKUeOBDsXHVXDG2mqNQhGpA1QraoKXyXfsrnR40l5VXYHz-cuvJMKAwFuBxu03Ga_r4GkNljHb5XXIIKCZI-a0kK5ErpYSJajjy_yB6dYoeHI7pDJGCMAnE6AiF0rKJOx3oo2OFweI4f/s1600/Numbered+Page+Navigation+For+Blogger+New+Script.png" height="176"/></a><br />
<div class="inpost"><br />
<p><b style="background-color: orange;">POST-DESCRIPTION-HERE [...] </b></p><br />
</div><br />
</div><br />
</li><br />
<!-- Slide-2 Code End --><br />
<br />
<br />
<!-- Slide-3 Code Start --><br />
<li><br />
<div class="mytext"><br />
<a href="#" target="_blank"><img alt="" width="512" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjkaDoVVdK3fQ5742sCwYuLfMoiH61OjUKrCI3sgLvkqvvI5Q7ATGrU3I9J6vkUpCrBYIr7AzxZ-AD2Z3uGrkaPT-N2hj8tWNaTfWSn3lW0UgUnnrY46YYer8lJrEpJEU0sfskDvYRNM1Ly/s1600/How+To+Add+Snow+Effect+On+The+Blogger+Mouse+Cursor+Area.png" height="176"/></a><br />
<div class="inpost"><br />
<p><b style="background-color: orange;">POST-DESCRIPTION-HERE [...]</b> </p><br />
</div><br />
</div><br />
</li><br />
<!-- Slide-3 Code End --><br />
<br />
<br />
<!-- Slide-4 Code Start --><br />
<li><br />
<div class="mytext"><br />
<a href="#" target="_blank"><img alt="" width="512" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEieJre5apNP6T0SJ1LWJ3B5Hch7fZShDobHitDhlxFolyCwFvj8ccKAtBkdpCZlT3IDtkBsr7RgQyihWhEobN61POu28MwxenDm3oisTCQyXoYHjHoe08d7u0EX-vd2IGPyHzbBWfi1duVV/s1600/Falling+Objects++Falling+Text++Marquee+Scrolling+Text+Generator+for+Blogger.png" height="176"/></a><br />
<div class="inpost"><br />
<p><b style="background-color: orange;">POST-DESCRIPTION-HERE [...] </b></p><br />
</div><br />
</div><br />
</li><br />
<!-- Slide-4 Code End --><br />
<br />
<br />
<!-- Slide-5 Code Start --><br />
<li><br />
<div class="mytext"><br />
<a href="#" target="_blank"><img alt="" width="512" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh19ZfPM9p9RkjSQHxV7fLnk3UA8xhJ8O_RR_-hf0RovhageZqROukiF5kX-1JFhXMlblLfHjejLczchq95oX6zVV011X3-EHrMkcJLa0DBXbV0WZVCtEdEqtu0OprqZNF8jtXEmK7BXiit/s1600/How+To+Add+Animated+Flash+Clock+To+Your+Blogger+Blog.png" height="176"/></a><br />
<div class="inpost"><br />
<p><b style="background-color: orange;">POST-DESCRIPTION-HERE [...] </b></p><br />
</div><br />
</div><br />
</li><br />
<!-- Slide-5 Code End --><br />
<br />
<br />
<br />
</ul><br />
<br />
<div class="clear"></div><br />
<br />
</div><br />
</div><br />
</div><br />
<div class="clear"></div></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<span style="color: red; font-size: large;">Add Beautiful jQuery Auto Playing Featured Content Image Slider to Blogger</span></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div class="separator" style="clear: both; color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em; text-align: center;">
<img alt="Add Beautiful jQuery Auto Playing Featured Content Image Slider to Blogger" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjlEEGSkxS97of0awQT1gwmYr76n0SK8MZTEpzswUH0HgqYf-lutU-mhcoim_KIJ6opmpbG5Rgf4MCaL79ZtCFaOTANy8dwOSfkqiAt4V4XsnrIT7MGOe9H4t2AkbYXXWyFZvljvOa8On0L/s1600/Add+Beautiful+jQuery+Auto+Playing+Featured+Content+Image+Slider+to+Blogger.jpg" height="288" style="border: 1px solid rgb(192, 192, 192); height: auto; max-width: 95%; padding: 4px;" width="500" /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em; text-align: center;">
<a class="button big green external_link" href="http://24work.blogspot.com/p/demo.html?url=http://24work-new.googlecode.com/svn/trunk/24work-blogspot/featured-post/n17-content-slider/beautiful-jquery-auto-playing-featured-content-image-slider.html" rel="nofollow" style="-webkit-box-shadow: rgb(255, 255, 255) 0px 0px 1px inset; -webkit-transition: background-position 1s; background-clip: border-box; background-color: #79be1e; background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiahyphenhyphenl-cVfe0N50mVbpXndF0yaLprwejhgK1k2Ja7QUXeMuhnxPIb8uUvilCIm8alGKvBDcYiSbP_LuIJ22w5QCYuIIaT_vaI1W7kHbxz46s-E_ZEWfLkXxK0UwZ-OBEZrNn_j7yNs203Nw/s144/button_bg.png), url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiahyphenhyphenl-cVfe0N50mVbpXndF0yaLprwejhgK1k2Ja7QUXeMuhnxPIb8uUvilCIm8alGKvBDcYiSbP_LuIJ22w5QCYuIIaT_vaI1W7kHbxz46s-E_ZEWfLkXxK0UwZ-OBEZrNn_j7yNs203Nw/s144/button_bg.png), -webkit-gradient(radial, 50% 100%, 0, 50% 100%, 100, from(rgb(162, 211, 30)), to(rgba(162, 211, 30, 0))), -webkit-gradient(linear, 0% 0%, 0% 100%, from(rgb(130, 204, 39)), to(rgb(116, 179, 23))); background-position: 0% 100%, 100% 0%, 0px 0px, 0px 0px; background-repeat: no-repeat; border-radius: 8px; border: 1px solid rgb(150, 163, 123) !important; box-shadow: rgb(255, 255, 255) 0px 0px 1px inset; color: rgb(52, 89, 3) !important; cursor: pointer; display: inline-block; font-family: Calibri, Arial, sans-serif; font-size: 30px; font-stretch: normal; line-height: normal; padding: 10px 20px; position: relative; text-decoration: none; text-shadow: rgba(255, 255, 255, 0.4) 1px 1px 0px; transition: background-position 1s; vertical-align: baseline; white-space: nowrap;" target="_blank">Live Demo</a></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
1. Go to Blogger Dashboard >> Layout >> Add a gadget >> Add HTML/Javascript Box.</div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
2. Paste the following code in HTML/Javascript Box.</div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div class="code" style="background-attachment: initial; background-clip: initial; background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg_A6UCACj7lzkc6RQWaXeH21t_M2FpXey_i-u2nxBG0CxjI_7RIhDrL9J6Uqx0IhT_KdCBsZFoTBd3jo_2pm5edb0WckL48zHKeMYB6NYMMINubK0Z4iMOwA9G-XWD1m0VFsDI0Af13emE/); background-origin: initial; background-position: 0% 0%; background-repeat: repeat-y; background-size: initial; color: black; font-family: 'Courier New'; font-size: 9pt; margin: 5px 10px; max-height: 200px; overflow: auto; padding: 4px 10px 0px 40px;">
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.2.6/jquery.min.js" type="text/javascript"></script><br />
<script src="http://24work-new.googlecode.com/svn/trunk/24work-blogspot/featured-post/17-content-code/yourjavascript-56841175202.js" type="text/javascript"></script><br />
<a href="http://<span style="line-height: 19.2000007629395px;">horizon-tut.blogspot.com</span>/" rel="dofollow" target="_blank" title="Blogger Tips and Tricks"><img src="https://bitly.com/24workpng1" alt="Blogger Tips and Tricks" border="0" style="position: fixed; bottom: 10%; right: 0%; top: 0px;" /></a><a href="http://<span style="line-height: 19.2000007629395px;">horizon-tut.blogspot.com</span>/" rel="dofollow" target="_blank" title="Latest Tips For Bloggers"><img src="https://bitly.com/24workpng1" alt="Latest Tips For Bloggers" border="0" style="position: fixed; bottom: 10%; right: 0%;" /></a><a href="http://<span style="line-height: 19.2000007629395px;">horizon-tut.blogspot.comv</span>/" rel="dofollow" target="_blank" title="Blogger Tricks"><img src="https://bitly.com/24workpng1" alt="Blogger Tricks" border="0" style="position: fixed; bottom: 10%; left: 0%;" /></a><br />
<style type="text/css"><br />
<br />
<br />
*{<br />
<br />
margin:0;<br />
<br />
padding:0;<br />
<br />
}<br />
<br />
html{<br />
<br />
height:100%;<br />
<br />
}<br />
<br />
<br />
<br />
<br />
<br />
a img{<br />
<br />
border:0;<br />
<br />
}<br />
<br />
div.wrap{<br />
<br />
width:540px;<br />
<br />
margin:0 auto;<br />
<br />
text-align:left;<br />
<br />
}<br />
<br />
div#top div#nav{<br />
<br />
float:left;<br />
<br />
clear:both;<br />
<br />
width:540px;<br />
<br />
height:52px;<br />
<br />
margin:22px 0 0;<br />
<br />
background:url url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgnIS002XwDsZFdLD_ivmYIbqT614buOMDlV0x5VC43xz8UfJr2flBRKzV7I0LkC_ZTcvyRRK7gtS1Tp2TwqqmBWwQma4zj2rQ29DNseOVks7FryiTPQWEoEmm4OHdmuKMPE-8Xpnz4_ksz/s1600/navbgq.png) 0 0 no-repeat;<br />
<br />
}<br />
<br />
div#top div#nav ul{<br />
<br />
float:left;<br />
<br />
width:700px;<br />
<br />
height:52px;<br />
<br />
list-style-type:none;<br />
<br />
}<br />
<br />
div#nav ul li{<br />
<br />
float:left;<br />
<br />
height:52px;<br />
<br />
}<br />
<br />
div#nav ul li a{<br />
<br />
border:0;<br />
<br />
height:52px;<br />
<br />
display:block;<br />
<br />
line-height:52px;<br />
<br />
text-indent:-9999px;<br />
<br />
}<br />
<br />
div#header{<br />
<br />
margin:-1px 0 0;<br />
<br />
}<br />
<br />
div#video-header{<br />
<br />
height:683px;<br />
<br />
margin:-1px 0 0;<br />
<br />
}<br />
<br />
<br />
<br />
div#header div#slide-holder{<br />
<br />
z-index:40;<br />
<br />
width:540px;<br />
<br />
height:299px;<br />
<br />
position:absolute;<br />
<br />
}<br />
<br />
div#header div#slide-holder div#slide-runner{<br />
<br />
top:9px;<br />
<br />
left:9px;<br />
<br />
width:540px;<br />
<br />
height:278px;<br />
<br />
overflow:hidden;<br />
<br />
position:absolute;<br />
<br />
}<br />
<br />
div#header div#slide-holder img{<br />
<br />
margin:0;<br />
<br />
display:none;<br />
<br />
position:absolute;<br />
<br />
}<br />
<br />
div#header div#slide-holder div#slide-controls{<br />
<br />
left:0;<br />
<br />
bottom:228px;<br />
<br />
width:540px;<br />
<br />
height:46px;<br />
<br />
display:none;<br />
<br />
position:absolute;<br />
<br />
background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjwAJzT6ofRfyh9WApij3sNF4RFHHjiIHrKqNKOL4f0hVjyGyNuUyxTWjsvT2p_d-FYKni5KASTPXqgW5vV-MWtwBEXZEirEFtPAYIV0T3KGPIndF83osOb37DIxPtqNj5zpBRbsGIpTsnV/s1600/slidebg.png) 0 0;<br />
<br />
}<br />
<br />
div#header div#slide-holder div#slide-controls p.text{<br />
<br />
float:left;<br />
<br />
color:#fff;<br />
<br />
display:inline;<br />
<br />
font-size:10px;<br />
<br />
line-height:16px;<br />
<br />
margin:15px 0 0 20px;<br />
<br />
text-transform:uppercase;<br />
<br />
}<br />
<br />
div#header div#slide-holder div#slide-controls p#slide-nav{<br />
<br />
float:right;<br />
<br />
height:24px;<br />
<br />
display:inline;<br />
<br />
margin:11px 15px 0 0;<br />
<br />
}<br />
<br />
div#header div#slide-holder div#slide-controls p#slide-nav a{<br />
<br />
float:left;<br />
<br />
width:24px;<br />
<br />
height:24px;<br />
<br />
display:inline;<br />
<br />
font-size:11px;<br />
<br />
margin:0 5px 0 0;<br />
<br />
line-height:24px;<br />
<br />
font-weight:bold;<br />
<br />
text-align:center;<br />
<br />
text-decoration:none;<br />
<br />
background-position:0 0;<br />
<br />
background-repeat:no-repeat;<br />
<br />
color:#fff;<br />
<br />
}<br />
<br />
div#header div#slide-holder div#slide-controls p#slide-nav a.on{<br />
<br />
background-position:0 -24px;<br />
<br />
}<br />
<br />
div#header div#slide-holder div#slide-controls p#slide-nav a{background-image:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjEYrwcnBo152LEhsol2Vwrzv7xmCBhk5TONyGeHxAZloW_VsuuZom1pyyutsPcZkWRzd7k5pYNv4chJB88zo-_IOadFZGTHAHqNmJ0_2n1MNEuNLRbt9o__ehEnoXalCBfe675f0Rtm3I0/s1600/sildenav.png);}<br />
<br />
div#nav ul li a{background:url(images/nav.png) no-repeat;}<br />
<br />
<br />
</style><br />
<br />
<br />
<br />
<div style="float:left;"><br />
<br />
<div id="header"><div class="wrap"><br />
<div id="slide-holder"><br />
<div id="slide-runner"><br />
<br />
<a href="#"><img id="slide-img-1" src="http://img338.imageshack.us/img338/9756/naturephotoc.png" class="slide" alt="" /></a><br />
<br />
<a href="#"><img id="slide-img-2" src="http://img145.imageshack.us/img145/7564/naturephoto2.png" class="slide" alt="" /></a><br />
<br />
<a href="#"><img id="slide-img-3" src="http://img31.imageshack.us/img31/5550/naturephoto3.png" class="slide" alt="Your image title here" /></a><br />
<br />
<a href="Your Post Link Here"><img id="slide-img-4" src="http://img34.imageshack.us/img34/2006/naturephoto4.png" class="slide" alt="" /></a><br />
<br />
<a href="#"><img id="slide-img-5" src="http://img130.imageshack.us/img130/4637/naturephoto5.png" class="slide" alt="" /></a><br />
<br />
<a href="#"><img id="slide-img-6" src="http://img820.imageshack.us/img820/3824/naturephoto6.png" class="slide" alt="" /></a><br />
<br />
<br />
<br />
<br />
<div id="slide-controls"><br />
<p id="slide-client" class="text"><strong>post: </strong><span></span></p><br />
<p id="slide-desc" class="text"></p><br />
<p id="slide-nav"></p><br />
</div><br />
</div><br />
<br />
<!--content featured gallery here --><br />
</div><br />
<script type="text/javascript"><br />
if(!window.slider) var slider={};slider.data=[{"id":"slide-img-1","client":"nature beauty","desc":"nature beauty photography"},{"id":"slide-img-2","client":"nature beauty","desc":"add your description here"},{"id":"slide-img-3","client":"nature beauty","desc":"add your description here"},{"id":"slide-img-4","client":"nature beauty","desc":"add your description here"},{"id":"slide-img-5","client":"nature beauty","desc":"add your description here"},{"id":"slide-img-6","client":"nature beauty","desc":"add your description here"},{"id":"slide-img-7","client":"nature beauty","desc":"add your description here"}];<br />
</script></div></div></div></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<span style="color: red; font-size: large;">Adding jQuery Posts Slider To Blogger Blog</span></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div class="separator" style="clear: both; color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em; text-align: center;">
<img alt="Adding jQuery Posts Slider To Blogger Blog" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgsb0P9kZcyoOmg-Srq8yenx2w85hJ_fSgbCcMdCGEwiB_RaujItr0EA2WVyn0M7GtxrOun3TTN26M5DB0OVC2ULrdYDJ_w_voP8fXRkwe2X24Bv15jXF2FTbeQy0mSvxYmVxOuVNqUzDn_/s1600/Adding+jQuery+Posts+Slider+To+Blogger+Blog.png" height="262" style="border: 1px solid rgb(192, 192, 192); height: auto; max-width: 95%; padding: 4px;" width="500" /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em; text-align: center;">
<a class="button big green external_link" href="http://24work.blogspot.com/p/demo.html?url=http://24work-new.googlecode.com/svn/trunk/24work-blogspot/featured-post/n17-content-slider/adding-jquery-posts-slider-to-blogger-blog.html" rel="nofollow" style="-webkit-box-shadow: rgb(255, 255, 255) 0px 0px 1px inset; -webkit-transition: background-position 1s; background-clip: border-box; background-color: #79be1e; background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiahyphenhyphenl-cVfe0N50mVbpXndF0yaLprwejhgK1k2Ja7QUXeMuhnxPIb8uUvilCIm8alGKvBDcYiSbP_LuIJ22w5QCYuIIaT_vaI1W7kHbxz46s-E_ZEWfLkXxK0UwZ-OBEZrNn_j7yNs203Nw/s144/button_bg.png), url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiahyphenhyphenl-cVfe0N50mVbpXndF0yaLprwejhgK1k2Ja7QUXeMuhnxPIb8uUvilCIm8alGKvBDcYiSbP_LuIJ22w5QCYuIIaT_vaI1W7kHbxz46s-E_ZEWfLkXxK0UwZ-OBEZrNn_j7yNs203Nw/s144/button_bg.png), -webkit-gradient(radial, 50% 100%, 0, 50% 100%, 100, from(rgb(162, 211, 30)), to(rgba(162, 211, 30, 0))), -webkit-gradient(linear, 0% 0%, 0% 100%, from(rgb(130, 204, 39)), to(rgb(116, 179, 23))); background-position: 0% 100%, 100% 0%, 0px 0px, 0px 0px; background-repeat: no-repeat; border-radius: 8px; border: 1px solid rgb(150, 163, 123) !important; box-shadow: rgb(255, 255, 255) 0px 0px 1px inset; color: rgb(52, 89, 3) !important; cursor: pointer; display: inline-block; font-family: Calibri, Arial, sans-serif; font-size: 30px; font-stretch: normal; line-height: normal; padding: 10px 20px; position: relative; text-decoration: none; text-shadow: rgba(255, 255, 255, 0.4) 1px 1px 0px; transition: background-position 1s; vertical-align: baseline; white-space: nowrap;" target="_blank">Live Demo</a></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
1. Go to Blogger Dashboard >> Layout >> Add a gadget >> Add HTML/Javascript Box.</div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
2. Paste the following code in HTML/Javascript Box.</div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div class="code" style="background-attachment: initial; background-clip: initial; background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg_A6UCACj7lzkc6RQWaXeH21t_M2FpXey_i-u2nxBG0CxjI_7RIhDrL9J6Uqx0IhT_KdCBsZFoTBd3jo_2pm5edb0WckL48zHKeMYB6NYMMINubK0Z4iMOwA9G-XWD1m0VFsDI0Af13emE/); background-origin: initial; background-position: 0% 0%; background-repeat: repeat-y; background-size: initial; color: black; font-family: 'Courier New'; font-size: 9pt; margin: 5px 10px; max-height: 200px; overflow: auto; padding: 4px 10px 0px 40px;">
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.2.6/jquery.min.js" type="text/javascript"></script><br />
<script src="http://24work-new.googlecode.com/svn/trunk/24work-blogspot/featured-post/17-content-code/zinmag-primus-slider-01.js" type="text/javascript"></script><br />
<a href="http://<span style="line-height: 19.2000007629395px;">horizon-tut.blogspot.com</span>/" rel="dofollow" target="_blank" title="Blogger Tips and Tricks"><img src="https://bitly.com/24workpng1" alt="Blogger Tips and Tricks" border="0" style="position: fixed; bottom: 10%; right: 0%; top: 0px;" /></a><a href="http://<span style="line-height: 19.2000007629395px;">horizon-tut.blogspot.com</span>/" rel="dofollow" target="_blank" title="Latest Tips For Bloggers"><img src="https://bitly.com/24workpng1" alt="Latest Tips For Bloggers" border="0" style="position: fixed; bottom: 10%; right: 0%;" /></a><a href="http://<span style="line-height: 19.2000007629395px;">horizon-tut.blogspot.com</span>/" rel="dofollow" target="_blank" title="Blogger Tricks"><img src="https://bitly.com/24workpng1" alt="Blogger Tricks" border="0" style="position: fixed; bottom: 10%; left: 0%;" /></a><br />
<style type="text/css"><br />
<br />
#slider {<br />
background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhJF7Deb_J6lJhmNXE4vteROeYlCJ-sz3zJgLwNaDnc8Pc4Z8rbiVEWKJf0_EHP3DXY6Pqj5SEgirq2rOSKNK4apdlA7BEY6-z7E7fvfwsoIaqrkXYDRmWWMC_Yxreov1rh8ySk-Dch-0in/s1600/Adding+A+jQuery+Posts+Slider+To+Blogger+Blog.png);<br />
height: 254px;<br />
width: 983px;<br />
overflow: hidden;<br />
position: relative;<br />
margin: 5px 0;<br />
}<br />
#mover {<br />
width: auto;<br />
position:absolute;<br />
overflow:hidden;<br />
}<br />
.slide {<br />
padding: 20px 0px;<br />
width: 1000px;<br />
float: left;<br />
position: relative;<br />
height:200px;<br />
}<br />
.slide h2 {<br />
font-family:georgia, Helvetica, Sans-Serif;<br />
font-size: 24px;<br />
position: absolute;<br />
top: 20px;<br />
left: 1px;<br />
color: #ac0000;<br />
padding:0px 0px 0px 30px;<br />
margin:0px 0px;<br />
width:500px;<br />
overflow:hidden;<br />
}<br />
.slide h2 a:link, .slide h2 a:visited {<br />
color:#fff;<br />
background-color: transparent;<br />
}<br />
.slide h2 a:hover {<br />
color: #ddd;<br />
background-color: transparent;<br />
}<br />
.slide p {<br />
color: #999;<br />
position: absolute;<br />
top: 100px;<br />
left: 1px;<br />
font-size: 12px;<br />
font-family:georgia, Helvetica, Sans-Serif;<br />
line-height: 20px;<br />
width: 500px;<br />
padding:0px 0px 0px 30px;<br />
margin:0px 0px;<br />
}<br />
.slide img {<br />
position: absolute;<br />
top: 20px;<br />
left: 577px;<br />
background:#fff;<br />
padding:10px 10px;<br />
}<br />
#slider-stopper {<br />
position: absolute;<br />
font-family: Georgia, Helvetica, Sans-Serif;<br />
top: 113px;<br />
right: 55px;<br />
color: #AC0000;<br />
padding: 3px 8px;<br />
font-size: 14px;<br />
text-transform: uppercase;<br />
z-index: 1000;<br />
}<br />
</style><br />
<br />
<br />
<!-- Slider --><br />
<div id="slider"><br />
<div id="mover"><br />
<div class="slide"><br />
<h2><a href="#" target="_blank">LINK-TITLE-HERE</a></h2><br />
<br />
<p>POST-DESCRIPTION-HERE [...] </p><br />
<img alt="" width="200" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiok7k07E26PaVjQnheC-_Un5WuNyLO7LWw5aji6jomfu_sFyU9ewCDpoV3Co4RouqXQXFTY9dopTHgwgtM5coIcEBPJNQ-3huoi-j0Zv3p4xscVvqzyeyuXzDvXf0DRxhUNqHzcqFvrKrf/s1600/How+to+change+mouse+cursor+in+blogger+blog+to+animated+cursors.png" height="160"/><br />
</div><br />
<div class="slide"><br />
<h2><a href="#" target="_blank">LINK-TITLE-HERE</a></h2><br />
<p>POST-DESCRIPTION-HERE [...] </p><br />
<img alt="" width="200" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhRynNaVduMh3_iNRX2GCBEVzYebB8sR_uXVmA-m70sqpmXEySbhojkZt9VcPCoST7K2akCoGOwpUq6S1taj5RvXIeugOMPuNsI35vbjJN_UaQD9POP3tFKIgL0fKT5jx0xy2tw8LCvBCA0/s1600/Numbered+Page+Navigation+For+Blogger+New+Script.png" height="160"/><br />
</div><br />
<div class="slide"><br />
<h2><a href="#" target="_blank">LINK-TITLE-HERE</a></h2><br />
<p>POST-DESCRIPTION-HERE [...] </p><br />
<img alt="" width="200" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi3PTR9ZHckt8wK63-Y4hzyAFb8IL_VodMjnZQZ_ebwQ3pNFvJcLTqIKYrmUknE89wYMuk60bGJSNGnF-73j6YYC2v3kx03EpmTkuza2ASbfMACDXXnlXjsUAY31ILCn4DeUidjJAjGii0i/s1600/How+To+Add+Snow+Effect+On+The+Blogger+Mouse+Cursor+Area.png" height="160"/><br />
</div><br />
<div class="slide"><br />
<h2><a href="#" target="_blank">LINK-TITLE-HERE</a></h2><br />
<p>POST-DESCRIPTION-HERE [...]</p><br />
<img alt="" width="200" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhrj1yVSdWFhT3ppFfTwBK6SQtODlOCbYKPuRGtNYIrriUrpQokw3aJtt8Q-L8wqLvtliwvKtgAEtSe_yRc3Ta17RZhp-yn_keeLckHPcW19yiURL-Nkwm0xTzO_CC_Acnm8UxP6IwYaFbl/s1600/Falling+Objects++Falling+Text++Marquee+Scrolling+Text+Generator+for+Blogger.png" height="160"/><br />
</div><br />
<div class="slide"><br />
<h2><a href="#" target="_blank">LINK-TITLE-HERE</a></h2><br />
<p>POST-DESCRIPTION-HERE [...]</p><br />
<img alt="" width="200" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgQYHAc-Vg_oMBRegBt9WS5w2ed3mVQWIfsTPaT5PqlEUadZFBKZ2n_YAjhDQjWn1AUF3LKBo5Zo17Ig_it89NdIJ-OxJVLvKhDyRuGf2M2dchcg96K18h9fkEwdCYZCKPSiJE5xslUS0UT/s1600/How+To+Add+Animated+Flash+Clock+To+Your+Blogger+Blog.png" height="160"/><br />
</div><br />
</div><br />
<!-- /Mover --><br />
</div><br />
<!-- /Slider --></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<span style="color: red; font-size: large;">Simplest jQuery Featured Content Slider in Blogger / Blogspot Blog</span></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div class="separator" style="clear: both; color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em; text-align: center;">
<img alt="Simplest jQuery Featured Content Slider in Blogger / Blogspot Blog" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjLP9aEuyLmz-R-O1hHLi4l7LUtZ2pR-CHeKdMmdFyKZ-0qCQcEy8mpMuXT4IjtTXXNoLgH1kyFxXvJSEtjoTknGXjz5E6ir16yt3PAxl_lk14F1M-2_tFwHFhoOAIibLjlQWpmpwpHH24L/s1600/Simple+jQuery+Featured+Content+Slider+for+Blogger+Blog+2.png" height="275" style="border: 1px solid rgb(192, 192, 192); height: auto; max-width: 95%; padding: 4px;" width="500" /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em; text-align: center;">
<a class="button big green external_link" href="http://24work.blogspot.com/p/demo.html?url=http://24work-new.googlecode.com/svn/trunk/24work-blogspot/featured-post/n17-content-slider/simplest-jquery-featured-content-slider-in-blogger.html" rel="nofollow" style="-webkit-box-shadow: rgb(255, 255, 255) 0px 0px 1px inset; -webkit-transition: background-position 1s; background-clip: border-box; background-color: #79be1e; background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiahyphenhyphenl-cVfe0N50mVbpXndF0yaLprwejhgK1k2Ja7QUXeMuhnxPIb8uUvilCIm8alGKvBDcYiSbP_LuIJ22w5QCYuIIaT_vaI1W7kHbxz46s-E_ZEWfLkXxK0UwZ-OBEZrNn_j7yNs203Nw/s144/button_bg.png), url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiahyphenhyphenl-cVfe0N50mVbpXndF0yaLprwejhgK1k2Ja7QUXeMuhnxPIb8uUvilCIm8alGKvBDcYiSbP_LuIJ22w5QCYuIIaT_vaI1W7kHbxz46s-E_ZEWfLkXxK0UwZ-OBEZrNn_j7yNs203Nw/s144/button_bg.png), -webkit-gradient(radial, 50% 100%, 0, 50% 100%, 100, from(rgb(162, 211, 30)), to(rgba(162, 211, 30, 0))), -webkit-gradient(linear, 0% 0%, 0% 100%, from(rgb(130, 204, 39)), to(rgb(116, 179, 23))); background-position: 0% 100%, 100% 0%, 0px 0px, 0px 0px; background-repeat: no-repeat; border-radius: 8px; border: 1px solid rgb(150, 163, 123) !important; box-shadow: rgb(255, 255, 255) 0px 0px 1px inset; color: rgb(52, 89, 3) !important; cursor: pointer; display: inline-block; font-family: Calibri, Arial, sans-serif; font-size: 30px; font-stretch: normal; line-height: normal; padding: 10px 20px; position: relative; text-decoration: none; text-shadow: rgba(255, 255, 255, 0.4) 1px 1px 0px; transition: background-position 1s; vertical-align: baseline; white-space: nowrap;" target="_blank">Live Demo</a></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
1. Go to Blogger Dashboard >> Layout >> Add a gadget >> Add HTML/Javascript Box.</div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
2. Paste the following code in HTML/Javascript Box.</div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div class="code" style="background-attachment: initial; background-clip: initial; background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg_A6UCACj7lzkc6RQWaXeH21t_M2FpXey_i-u2nxBG0CxjI_7RIhDrL9J6Uqx0IhT_KdCBsZFoTBd3jo_2pm5edb0WckL48zHKeMYB6NYMMINubK0Z4iMOwA9G-XWD1m0VFsDI0Af13emE/); background-origin: initial; background-position: 0% 0%; background-repeat: repeat-y; background-size: initial; color: black; font-family: 'Courier New'; font-size: 9pt; margin: 5px 10px; max-height: 200px; overflow: auto; padding: 4px 10px 0px 40px;">
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js" type="text/javascript"></script><br />
<script src="http://24work-new.googlecode.com/svn/trunk/24work-blogspot/featured-post/17-content-code/freebloggerhelp-jquery.flow.1.2.auto.js" type="text/javascript"></script><br />
<script type="text/javascript"><br />
$(document).ready(function(){<br />
$("#myController").jFlow({<br />
slides: "#slides",<br />
controller: ".jFlowControl", // must be class, use . sign<br />
slideWrapper : "#jFlowSlide", // must be id, use # sign<br />
selectedWrapper: "jFlowSelected", // just pure text, no sign<br />
auto: true, //auto change slide, default true<br />
width: "610px",<br />
height: "235px",<br />
duration: 400,<br />
prev: ".jFlowPrev", // must be class, use . sign<br />
next: ".jFlowNext" // must be class, use . sign<br />
});<br />
});<br />
</script><a href="http://<span style="line-height: 19.2000007629395px;">horizon-tut.blogspot.com</span>/" rel="dofollow" target="_blank" title="Blogger Tips and Tricks"><img src="https://bitly.com/24workpng1" alt="Blogger Tips and Tricks" border="0" style="position: fixed; bottom: 10%; right: 0%; top: 0px;" /></a><a href="http://<span style="line-height: 19.2000007629395px;">horizon-tut.blogspot.com</span>/" rel="dofollow" target="_blank" title="Latest Tips For Bloggers"><img src="https://bitly.com/24workpng1" alt="Latest Tips For Bloggers" border="0" style="position: fixed; bottom: 10%; right: 0%;" /></a><a href="http://<span style="line-height: 19.2000007629395px;">horizon-tut.blogspot.com</span>/" rel="dofollow" target="_blank" title="Blogger Tricks"><img src="https://bitly.com/24workpng1" alt="Blogger Tricks" border="0" style="position: fixed; bottom: 10%; left: 0%;" /></a><br />
<style type="text/css"><br />
#jFlowSlide{ background:#DBF3FD; font-family: Georgia; }<br />
#myController { font-family: Georgia; padding:2px 0; width:610px; background:#3AB7FF; }<br />
#myController span.jFlowSelected { background:#43A0D5;margin-right:0px; }<br />
.slide-wrapper { padding: 5px; }<br />
.slide-thumbnail { width:300px; float:left; }<br />
.slide-thumbnail img {max-width:300px; }<br />
.slide-details { width:290px; float:right; margin-left:10px;}<br />
.slide-details h2 { font-size:1.5em; font-style: italic; font-weight:normal; line-height: 1; margin:0; }<br />
.slide-details .description { margin-top:10px; }<br />
.jFlowControl, .jFlowPrev, .jFlowNext { color:#FFF; cursor:pointer; padding-left:5px; padding-right:5px; padding-top:2px; padding-bottom:2px; }<br />
.jFlowControl:hover, .jFlowPrev:hover, .jFlowNext:hover { background: #43A0D5; }<br />
</style><br />
<br />
<br />
<br />
<div class="jflow-content-slider"><br />
<div id="slides"><br />
<div class="slide-wrapper"><br />
<div class="slide-thumbnail"><br />
<img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiok7k07E26PaVjQnheC-_Un5WuNyLO7LWw5aji6jomfu_sFyU9ewCDpoV3Co4RouqXQXFTY9dopTHgwgtM5coIcEBPJNQ-3huoi-j0Zv3p4xscVvqzyeyuXzDvXf0DRxhUNqHzcqFvrKrf/s1600/How+to+change+mouse+cursor+in+blogger+blog+to+animated+cursors.png" alt=""/><br />
</div><br />
<div class="slide-details"><br />
<h2><a href="#" target="_blank">TITLE-OF-THE-SLIDE 1</a></h2><br />
<br />
<div class="description"><br />
TEXT-OF-THE-SLIDE 1<br />
</div><br />
</div><br />
<div class="clear"></div><br />
</div><br />
<div class="slide-wrapper"><br />
<div class="slide-thumbnail"><br />
<img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhRynNaVduMh3_iNRX2GCBEVzYebB8sR_uXVmA-m70sqpmXEySbhojkZt9VcPCoST7K2akCoGOwpUq6S1taj5RvXIeugOMPuNsI35vbjJN_UaQD9POP3tFKIgL0fKT5jx0xy2tw8LCvBCA0/s1600/Numbered+Page+Navigation+For+Blogger+New+Script.png" alt=""/><br />
</div><br />
<div class="slide-details"><br />
<h2><a href="#" target="_blank">TITLE-OF-THE-SLIDE 2</a></h2><br />
<div class="description"><br />
TEXT-OF-THE-SLIDE 2<br />
</div><br />
</div><br />
<div class="clear"></div><br />
</div><br />
<div class="slide-wrapper"><br />
<div class="slide-thumbnail"><br />
<img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi3PTR9ZHckt8wK63-Y4hzyAFb8IL_VodMjnZQZ_ebwQ3pNFvJcLTqIKYrmUknE89wYMuk60bGJSNGnF-73j6YYC2v3kx03EpmTkuza2ASbfMACDXXnlXjsUAY31ILCn4DeUidjJAjGii0i/s1600/How+To+Add+Snow+Effect+On+The+Blogger+Mouse+Cursor+Area.png" alt=""/><br />
</div><br />
<div class="slide-details"><br />
<h2><a href="#" target="_blank">TITLE-OF-THE-SLIDE 3</a></h2><br />
<div class="description"><br />
TEXT-OF-THE-SLIDE 3<br />
</div><br />
</div><br />
<div class="clear"></div><br />
</div><br />
<div class="slide-wrapper"><br />
<div class="slide-thumbnail"><br />
<img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhrj1yVSdWFhT3ppFfTwBK6SQtODlOCbYKPuRGtNYIrriUrpQokw3aJtt8Q-L8wqLvtliwvKtgAEtSe_yRc3Ta17RZhp-yn_keeLckHPcW19yiURL-Nkwm0xTzO_CC_Acnm8UxP6IwYaFbl/s1600/Falling+Objects++Falling+Text++Marquee+Scrolling+Text+Generator+for+Blogger.png" alt=""/><br />
</div><br />
<div class="slide-details"><br />
<h2><a href="#" target="_blank">TITLE-OF-THE-SLIDE 4</a></h2><br />
<div class="description"><br />
TEXT-OF-THE-SLIDE 4<br />
</div><br />
</div><br />
<div class="clear"></div><br />
</div><br />
<div class="slide-wrapper"><br />
<div class="slide-thumbnail"><br />
<img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgQYHAc-Vg_oMBRegBt9WS5w2ed3mVQWIfsTPaT5PqlEUadZFBKZ2n_YAjhDQjWn1AUF3LKBo5Zo17Ig_it89NdIJ-OxJVLvKhDyRuGf2M2dchcg96K18h9fkEwdCYZCKPSiJE5xslUS0UT/s1600/How+To+Add+Animated+Flash+Clock+To+Your+Blogger+Blog.png" alt=""/><br />
</div><br />
<div class="slide-details"><br />
<h2><a href="#" target="_blank">TITLE-OF-THE-SLIDE 5</a></h2><br />
<div class="description"><br />
TEXT-OF-THE-SLIDE 5<br />
</div><br />
</div><br />
<div class="clear"></div><br />
</div><br />
</div><br />
<br />
<div id="myController"><br />
<span class="jFlowPrev">Prev</span><br />
<span class="jFlowControl">1</span><br />
<span class="jFlowControl">2</span><br />
<span class="jFlowControl">3</span><br />
<span class="jFlowControl">4</span><br />
<span class="jFlowControl">5</span><br />
<span class="jFlowNext">Next</span><br />
</div><br />
<div class="clear"></div><br />
</div></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<span style="color: red; font-size: large;">Moving jquery image slider for featured content in Blogger</span></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div class="separator" style="clear: both; color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em; text-align: center;">
<img alt="Moving jquery image slider for featured content in Blogger" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjkzEw_Dlc5P9u8T17UAmR6Ic-WzixOjjBe7BRERlLYDkSweIj4qmJy89uGixsPx_daDC04KBClnvBa6qR0Ypy1Y_6oSTr_HkJY6npWFiJxLSReQI36IQMREpaNxjsXbgGqApj-AFxaL1oO/s1600/Moving+jquery+image+slider+for+featured+content+in+Blogger.png" height="215" style="border: 1px solid rgb(192, 192, 192); height: auto; max-width: 95%; padding: 4px;" width="500" /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em; text-align: center;">
<a class="button big green external_link" href="http://24work.blogspot.com/p/demo.html?url=http://24work-new.googlecode.com/svn/trunk/24work-blogspot/featured-post/n17-content-slider/moving-jquery-image-slider-for-featured-content-in-blogger.html" rel="nofollow" style="-webkit-box-shadow: rgb(255, 255, 255) 0px 0px 1px inset; -webkit-transition: background-position 1s; background-clip: border-box; background-color: #79be1e; background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiahyphenhyphenl-cVfe0N50mVbpXndF0yaLprwejhgK1k2Ja7QUXeMuhnxPIb8uUvilCIm8alGKvBDcYiSbP_LuIJ22w5QCYuIIaT_vaI1W7kHbxz46s-E_ZEWfLkXxK0UwZ-OBEZrNn_j7yNs203Nw/s144/button_bg.png), url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiahyphenhyphenl-cVfe0N50mVbpXndF0yaLprwejhgK1k2Ja7QUXeMuhnxPIb8uUvilCIm8alGKvBDcYiSbP_LuIJ22w5QCYuIIaT_vaI1W7kHbxz46s-E_ZEWfLkXxK0UwZ-OBEZrNn_j7yNs203Nw/s144/button_bg.png), -webkit-gradient(radial, 50% 100%, 0, 50% 100%, 100, from(rgb(162, 211, 30)), to(rgba(162, 211, 30, 0))), -webkit-gradient(linear, 0% 0%, 0% 100%, from(rgb(130, 204, 39)), to(rgb(116, 179, 23))); background-position: 0% 100%, 100% 0%, 0px 0px, 0px 0px; background-repeat: no-repeat; border-radius: 8px; border: 1px solid rgb(150, 163, 123) !important; box-shadow: rgb(255, 255, 255) 0px 0px 1px inset; color: rgb(52, 89, 3) !important; cursor: pointer; display: inline-block; font-family: Calibri, Arial, sans-serif; font-size: 30px; font-stretch: normal; line-height: normal; padding: 10px 20px; position: relative; text-decoration: none; text-shadow: rgba(255, 255, 255, 0.4) 1px 1px 0px; transition: background-position 1s; vertical-align: baseline; white-space: nowrap;" target="_blank">Live Demo</a></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
1. Go to Blogger Dashboard >> Layout >> Add a gadget >> Add HTML/Javascript Box.</div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
2. Paste the following code in HTML/Javascript Box.</div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div class="code" style="background-attachment: initial; background-clip: initial; background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg_A6UCACj7lzkc6RQWaXeH21t_M2FpXey_i-u2nxBG0CxjI_7RIhDrL9J6Uqx0IhT_KdCBsZFoTBd3jo_2pm5edb0WckL48zHKeMYB6NYMMINubK0Z4iMOwA9G-XWD1m0VFsDI0Af13emE/); background-origin: initial; background-position: 0% 0%; background-repeat: repeat-y; background-size: initial; color: black; font-family: 'Courier New'; font-size: 9pt; margin: 5px 10px; max-height: 200px; overflow: auto; padding: 4px 10px 0px 40px;">
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js" type="text/javascript"></script><br />
<script src="http://24work-new.googlecode.com/svn/trunk/24work-blogspot/featured-post/17-content-code/30111191622-slider.js" type="text/javascript"></script><br />
<script type="text/javascript"><br />
stepcarousel.setup({<br />
galleryid: 'mygallery', //id of carousel DIV<br />
beltclass: 'belt', //class of inner "belt" DIV containing all the panel DIVs<br />
panelclass: 'panel', //class of panel DIVs each holding content<br />
autostep: {enable:true, moveby:1, pause:3000},<br />
panelbehavior: {speed:500, wraparound:true, persist:true},<br />
defaultbuttons: {enable: true, moveby: 3, leftnav: ['https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi3UHjLxI5zz6FJhYBYGvefOczCD6jI6KCP1pPZv3LFfiMWUHE1H9cqke4F_0jKJ2vDPiIihblW0D_HVvqvAulQ4u6W2nT-qfF20EhDxh1ZWcXOJb8sPzfG7Fl9Pp6Evuh0htspBYjsmOo/s400/left.jpg', -48, 0], rightnav: ['https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg-XuJjXD2imP4crhfP6w1zQDuhwphmNRkqhXJrj7KtNzd41PvTfBpHEr_FmW9Nj-oPRhcmn7W4zj5sDUnnBStp34JwzmcDunt5Um0wndDeUhPnottRjRkstnW7v7EupzritOo2Y_M1Ri8/s400/right.jpg', 0, 0]},<br />
statusvars: ['statusA', 'statusB', 'statusC'], //register 3 variables that contain current panel (start), current panel (last), and total panels<br />
contenttype: ['external'] //content setting ['inline'] or ['external', 'path_to_external_file']<br />
})<br />
</script><br />
<a href="http://<span style="line-height: 19.2000007629395px;">horizon-tut.blogspot.com</span>/" rel="dofollow" target="_blank" title="Blogger Tips and Tricks"><img src="https://bitly.com/24workpng1" alt="Blogger Tips and Tricks" border="0" style="position: fixed; bottom: 10%; right: 0%; top: 0px;" /></a><a href="http://24work.blogspot.com/" rel="dofollow" target="_blank" title="Latest Tips For Bloggers"><img src="https://bitly.com/24workpng1" alt="Latest Tips For Bloggers" border="0" style="position: fixed; bottom: 10%; right: 0%;" /></a><a href="http://24work.blogspot.com/" rel="dofollow" target="_blank" title="Blogger Tricks"><img src="https://bitly.com/24workpng1" alt="Blogger Tricks" border="0" style="position: fixed; bottom: 10%; left: 0%;" /></a><br />
<style type="text/css"><br />
#myslides{<br />
background:#000 url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgo4BDmz4SbDZQ5XbUa4BnQphk8zfX4klbu2FxzfwXCTdCxMIo9C_IpyNfMcNBisSphsna3_Y4x_cL2jcdxgpYxXHxsTygGcOwvt1nhrfYhP9irfMhzFKsfff8cLgTqCsYkzCP7ZwdfPA/s1600/mslid.jpg) repeat-x;<br />
width: 650px;<br />
height:165px;<br />
margin-bottom:5px;<br />
}<br />
.stepcarousel{<br />
position: relative; /*leave this value alone*/<br />
overflow: scroll; /*leave this value alone*/<br />
width: 554px; /*Width of Carousel Viewer itself*/<br />
height: 160px; /*Height should enough to fit largest content's height*/<br />
margin: 0px 48px 5px 48px;<br />
}<br />
.stepcarousel .belt{<br />
position: absolute; /*leave this value alone*/<br />
left: 0;<br />
top: 0;<br />
}<br />
.stepcarousel .panel{<br />
float: left; /*leave this value alone*/<br />
overflow: hidden; /*clip content that go outside dimensions of holding panel DIV*/<br />
margin: 20px 10px ; /*margin around each panel*/<br />
width:170px; /*Width of each panel holding each content. If removed, widths should be individually defined on each content DIV then. */<br />
background:#0e1829;<br />
height:120px;<br />
border:1px solid #1d2c44;<br />
}<br />
.stepcarousel .panel p{<br />
text-align: left; /*leave this value alone*/<br />
overflow: hidden; /*clip content that go outside dimensions of holding panel DIV*/<br />
margin: 5px 5px ; /*margin around each panel*/<br />
}<br />
.stepcarousel .panel h2{<br />
text-align: left; /*leave this value alone*/<br />
height:20px;<br />
overflow: hidden; /*clip content that go outside dimensions of holding panel DIV*/<br />
margin: 2px 5px ; /*margin around each panel*/<br />
font-size:16px;<br />
font-weight:bold;<br />
text-align:center;<br />
font-family:Georgia,century gothic,Arial,verdana, sans-serif;<br />
}<br />
.stepcarousel .panel img{<br />
float: left; /*leave this value alone*/<br />
background:#0E1829; /*clip content that go outside dimensions of holding panel DIV*/<br />
margin: 5px 5px 5px 5px; /*margin around each panel*/<br />
padding:0px 0px;<br />
}<br />
</style><br />
<br />
<br />
<br />
<div id="myslides"><br />
<div id="mygallery" class="stepcarousel"><br />
<div class="belt"><br />
<br />
<!-- 1st Template --><br />
<div class="panel"><br />
<a href="#" target="blank" title="TITLE-OF-THE-SLIDE"> <img width="160" alt="" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiok7k07E26PaVjQnheC-_Un5WuNyLO7LWw5aji6jomfu_sFyU9ewCDpoV3Co4RouqXQXFTY9dopTHgwgtM5coIcEBPJNQ-3huoi-j0Zv3p4xscVvqzyeyuXzDvXf0DRxhUNqHzcqFvrKrf/s1600/How+to+change+mouse+cursor+in+blogger+blog+to+animated+cursors.png" height="110"/> </a><br />
</div><br />
<!-- end code of 1st --><br />
<br />
<!-- 2nd Template --><br />
<div class="panel"><br />
<a href="#" target="blank" title="TITLE-OF-THE-SLIDE"> <img width="160" alt="" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhRynNaVduMh3_iNRX2GCBEVzYebB8sR_uXVmA-m70sqpmXEySbhojkZt9VcPCoST7K2akCoGOwpUq6S1taj5RvXIeugOMPuNsI35vbjJN_UaQD9POP3tFKIgL0fKT5jx0xy2tw8LCvBCA0/s1600/Numbered+Page+Navigation+For+Blogger+New+Script.png" height="110"/> </a><br />
</div><br />
<!-- end code of 2nd --><br />
<br />
<!-- 3rd Template --><br />
<div class="panel"><br />
<a href="#" target="blank" title="TITLE-OF-THE-SLIDE"> <img width="160" alt="" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi3PTR9ZHckt8wK63-Y4hzyAFb8IL_VodMjnZQZ_ebwQ3pNFvJcLTqIKYrmUknE89wYMuk60bGJSNGnF-73j6YYC2v3kx03EpmTkuza2ASbfMACDXXnlXjsUAY31ILCn4DeUidjJAjGii0i/s1600/How+To+Add+Snow+Effect+On+The+Blogger+Mouse+Cursor+Area.png" height="110"/> </a><br />
</div><br />
<!-- end code of 3rd --><br />
<br />
<!-- 4th Template --><br />
<div class="panel"><br />
<a href="#" target="blank" title="TITLE-OF-THE-SLIDE"> <img width="160" alt="" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhrj1yVSdWFhT3ppFfTwBK6SQtODlOCbYKPuRGtNYIrriUrpQokw3aJtt8Q-L8wqLvtliwvKtgAEtSe_yRc3Ta17RZhp-yn_keeLckHPcW19yiURL-Nkwm0xTzO_CC_Acnm8UxP6IwYaFbl/s1600/Falling+Objects++Falling+Text++Marquee+Scrolling+Text+Generator+for+Blogger.png" height="110"/> </a><br />
</div><br />
<!-- end code of 4th --><br />
<br />
<br />
<!-- 5th Template --><br />
<div class="panel"><br />
<a href="#" target="blank" title="TITLE-OF-THE-SLIDE"> <img width="160" alt="" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgQYHAc-Vg_oMBRegBt9WS5w2ed3mVQWIfsTPaT5PqlEUadZFBKZ2n_YAjhDQjWn1AUF3LKBo5Zo17Ig_it89NdIJ-OxJVLvKhDyRuGf2M2dchcg96K18h9fkEwdCYZCKPSiJE5xslUS0UT/s1600/How+To+Add+Animated+Flash+Clock+To+Your+Blogger+Blog.png" height="110"/> </a><br />
</div><br />
<!-- end code of 6th --><br />
<br />
<br />
<br />
</div></div></div></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<span style="color: red; font-size: large;">Make A Simple Featured Content SlideShow Using JQuery</span></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div class="separator" style="clear: both; color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em; text-align: center;">
<img alt="Make A Simple Featured Content SlideShow Using JQuery" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjCdLhyphenhyphenC_D_IIueppUmQe33xg-ajQG0uTtDP0OxZf20UyUx6p_cNAQ1danLqxzREKWeTFMFy9sqswh_sTiK-Kh7NujJkTw-1mNhnK4-G_8HMiy5iLPEhogt65w84T-BesKGvjp9IotAYPiX/s1600/Make+A+Simple+Featured+Content+SlideShow+Using+JQuery.png" height="266" style="border: 1px solid rgb(192, 192, 192); height: auto; max-width: 95%; padding: 4px;" width="500" /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em; text-align: center;">
<a class="button big green external_link" href="http://24work.blogspot.com/p/demo.html?url=http://24work-new.googlecode.com/svn/trunk/24work-blogspot/featured-post/n17-content-slider/make-a-simple-featured-content-slideshow-using-jquery.html" rel="nofollow" style="-webkit-box-shadow: rgb(255, 255, 255) 0px 0px 1px inset; -webkit-transition: background-position 1s; background-clip: border-box; background-color: #79be1e; background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiahyphenhyphenl-cVfe0N50mVbpXndF0yaLprwejhgK1k2Ja7QUXeMuhnxPIb8uUvilCIm8alGKvBDcYiSbP_LuIJ22w5QCYuIIaT_vaI1W7kHbxz46s-E_ZEWfLkXxK0UwZ-OBEZrNn_j7yNs203Nw/s144/button_bg.png), url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiahyphenhyphenl-cVfe0N50mVbpXndF0yaLprwejhgK1k2Ja7QUXeMuhnxPIb8uUvilCIm8alGKvBDcYiSbP_LuIJ22w5QCYuIIaT_vaI1W7kHbxz46s-E_ZEWfLkXxK0UwZ-OBEZrNn_j7yNs203Nw/s144/button_bg.png), -webkit-gradient(radial, 50% 100%, 0, 50% 100%, 100, from(rgb(162, 211, 30)), to(rgba(162, 211, 30, 0))), -webkit-gradient(linear, 0% 0%, 0% 100%, from(rgb(130, 204, 39)), to(rgb(116, 179, 23))); background-position: 0% 100%, 100% 0%, 0px 0px, 0px 0px; background-repeat: no-repeat; border-radius: 8px; border: 1px solid rgb(150, 163, 123) !important; box-shadow: rgb(255, 255, 255) 0px 0px 1px inset; color: rgb(52, 89, 3) !important; cursor: pointer; display: inline-block; font-family: Calibri, Arial, sans-serif; font-size: 30px; font-stretch: normal; line-height: normal; padding: 10px 20px; position: relative; text-decoration: none; text-shadow: rgba(255, 255, 255, 0.4) 1px 1px 0px; transition: background-position 1s; vertical-align: baseline; white-space: nowrap;" target="_blank">Live Demo</a></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
1. Go to Blogger Dashboard >> Layout >> Add a gadget >> Add HTML/Javascript Box.</div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
2. Paste the following code in HTML/Javascript Box.</div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div class="code" style="background-attachment: initial; background-clip: initial; background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg_A6UCACj7lzkc6RQWaXeH21t_M2FpXey_i-u2nxBG0CxjI_7RIhDrL9J6Uqx0IhT_KdCBsZFoTBd3jo_2pm5edb0WckL48zHKeMYB6NYMMINubK0Z4iMOwA9G-XWD1m0VFsDI0Af13emE/); background-origin: initial; background-position: 0% 0%; background-repeat: repeat-y; background-size: initial; color: black; font-family: 'Courier New'; font-size: 9pt; margin: 5px 10px; max-height: 200px; overflow: auto; padding: 4px 10px 0px 40px;">
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js" type="text/javascript"></script><br />
<script src="http://24work-new.googlecode.com/svn/trunk/24work-blogspot/featured-post/n17-content-slider/n17-content-slider-024.js" type="text/javascript"></script><br />
<a href="http://24work.blogspot.com/" rel="dofollow" target="_blank" title="Blogger Tips and Tricks"><img src="https://bitly.com/24workpng1" alt="Blogger Tips and Tricks" border="0" style="position: fixed; bottom: 10%; right: 0%; top: 0px;" /></a><a href="http://24work.blogspot.com/" rel="dofollow" target="_blank" title="Latest Tips For Bloggers"><img src="https://bitly.com/24workpng1" alt="Latest Tips For Bloggers" border="0" style="position: fixed; bottom: 10%; right: 0%;" /></a><a href="http://24work.blogspot.com/" rel="dofollow" target="_blank" title="Blogger Tricks"><img src="https://bitly.com/24workpng1" alt="Blogger Tricks" border="0" style="position: fixed; bottom: 10%; left: 0%;" /></a><br />
<style type="text/css"><br />
#myslides{<br />
background:#000 url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgo4BDmz4SbDZQ5XbUa4BnQphk8zfX4klbu2FxzfwXCTdCxMIo9C_IpyNfMcNBisSphsna3_Y4x_cL2jcdxgpYxXHxsTygGcOwvt1nhrfYhP9irfMhzFKsfff8cLgTqCsYkzCP7ZwdfPA/s1600/mslid.jpg) repeat-x;<br />
width: 650px;<br />
height:165px;<br />
margin-bottom:5px;<br />
}<br />
.stepcarousel{<br />
position: relative; /*leave this value alone*/<br />
overflow: scroll; /*leave this value alone*/<br />
width: 554px; /*Width of Carousel Viewer itself*/<br />
height: 160px; /*Height should enough to fit largest content's height*/<br />
margin: 0px 48px 5px 48px;<br />
}<br />
.stepcarousel .belt{<br />
position: absolute; /*leave this value alone*/<br />
left: 0;<br />
top: 0;<br />
}#contentSlide {<br />
background : #ddd; -moz-border-radius-topleft:5px;<br />
-moz-border-radius-topright:5px;<br />
-moz-border-radius-bottomleft:5px;<br />
-moz-border-radius-bottomright:5px;<br />
-webkit-border-top-left-radius:5px;<br />
-webkit-border-top-right-radius:5px;<br />
-webkit-border-bottom-left-radius:5px;<br />
-webkit-border-bottom-right-radius:5px;<br />
height : 228px; margin-bottom: 10px;<br />
padding : 10px 0px 10px;<br />
}<br />
#slideshow {<br />
margin : 0 auto;<br />
width : 953px;<br />
height : 230px;<br />
background : #eeeeee none repeat scroll 0 0;<br />
position : relative;<br />
}<br />
#slideshow #slidesContainer {<br />
margin : 0 auto;<br />
width : 845px;<br />
height : 228px;<br />
overflow : auto;<br />
position : relative;<br />
}<br />
#slideshow #slidesContainer .slide {<br />
margin : 0 auto;<br />
width : 845px;<br />
height : 228px;<br />
}<br />
.control {<br />
display : block;<br />
width : 39px;<br />
height : 228px;<br />
text-indent : -10000px;<br />
position : absolute;<br />
cursor : pointer;<br />
}<br />
#leftControl {<br />
top : 0;<br />
left : 0;<br />
width : 55px;<br />
background : transparent url(http://lh6.ggpht.com/_9b1traaMESE/Sms_Pg_IsqI/AAAAAAAAAXU/tTxdiIsFY4g/previous%20gray.jpg)no-repeat scroll 0 0;<br />
}<br />
#rightControl {<br />
top : 0;<br />
right : 0;<br />
background : transparent url(http://lh6.ggpht.com/_9b1traaMESE/Sms-s5qb9iI/AAAAAAAAAXQ/edpXAZIaxCI/next%20gray.jpg) no-repeat scroll 0 0;<br />
width : 55px;<br />
}<br />
.slide h2, .slide p {<br />
margin : 15px;<br />
}<br />
.slide h2 {<br />
font : italic 24px Georgia, "Times New Roman", Times, serif;<br />
color : #212421;<br />
letter-spacing : -1px;<br />
}<br />
.slide img {<br />
float : right;<br />
margin : 0 15px;<br />
padding : 1px;<br />
}<br />
</style><br />
<br />
<br />
<br />
<!-- Slideshow HTML --><br />
<div id="contentSlide"><div id="slideshow"><br />
<div id="slidesContainer"><br />
<div class="slide"><br />
<h2><a href="#" target="_blank">TITLE-OF-THE-SLIDE 1</a></h2><br />
<br />
<p>TEXT-OF-THE-SLIDE 1</p><br />
<img alt="" width="215" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiok7k07E26PaVjQnheC-_Un5WuNyLO7LWw5aji6jomfu_sFyU9ewCDpoV3Co4RouqXQXFTY9dopTHgwgtM5coIcEBPJNQ-3huoi-j0Zv3p4xscVvqzyeyuXzDvXf0DRxhUNqHzcqFvrKrf/s1600/How+to+change+mouse+cursor+in+blogger+blog+to+animated+cursors.png" height="115"/><br />
</div><br />
<div class="slide"><br />
<h2><a href="#" target="_blank">TITLE-OF-THE-SLIDE 2</a></h2><br />
<p>TEXT-OF-THE-SLIDE 2</p><br />
<img alt="" width="215" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhRynNaVduMh3_iNRX2GCBEVzYebB8sR_uXVmA-m70sqpmXEySbhojkZt9VcPCoST7K2akCoGOwpUq6S1taj5RvXIeugOMPuNsI35vbjJN_UaQD9POP3tFKIgL0fKT5jx0xy2tw8LCvBCA0/s1600/Numbered+Page+Navigation+For+Blogger+New+Script.png" height="115"/><br />
</div><br />
<div class="slide"><br />
<h2><a href="#" target="_blank">TITLE-OF-THE-SLIDE 3</a></h2><br />
<p>TEXT-OF-THE-SLIDE 3</p><br />
<img alt="" width="215" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi3PTR9ZHckt8wK63-Y4hzyAFb8IL_VodMjnZQZ_ebwQ3pNFvJcLTqIKYrmUknE89wYMuk60bGJSNGnF-73j6YYC2v3kx03EpmTkuza2ASbfMACDXXnlXjsUAY31ILCn4DeUidjJAjGii0i/s1600/How+To+Add+Snow+Effect+On+The+Blogger+Mouse+Cursor+Area.png" height="115"/><br />
</div><br />
<div class="slide"><br />
<h2><a href="#" target="_blank">TITLE-OF-THE-SLIDE 4</a></h2><br />
<p>TEXT-OF-THE-SLIDE 4</p><br />
<img alt="" width="215" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhrj1yVSdWFhT3ppFfTwBK6SQtODlOCbYKPuRGtNYIrriUrpQokw3aJtt8Q-L8wqLvtliwvKtgAEtSe_yRc3Ta17RZhp-yn_keeLckHPcW19yiURL-Nkwm0xTzO_CC_Acnm8UxP6IwYaFbl/s1600/Falling+Objects++Falling+Text++Marquee+Scrolling+Text+Generator+for+Blogger.png" height="115"/><br />
</div><br />
<div class="slide"><br />
<h2><a href="#" target="_blank">TITLE-OF-THE-SLIDE 5</a></h2><br />
<p>TEXT-OF-THE-SLIDE 5</p><br />
<img alt="" width="215" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgQYHAc-Vg_oMBRegBt9WS5w2ed3mVQWIfsTPaT5PqlEUadZFBKZ2n_YAjhDQjWn1AUF3LKBo5Zo17Ig_it89NdIJ-OxJVLvKhDyRuGf2M2dchcg96K18h9fkEwdCYZCKPSiJE5xslUS0UT/s1600/How+To+Add+Animated+Flash+Clock+To+Your+Blogger+Blog.png" height="115"/><br />
</div><br />
</div><br />
<br />
</div></div><br />
<!-- Slideshow HTML --><br />
<div class="clear"/></div></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<span style="color: red; font-size: large;">Awesome Automatic Content Slider for Blogger using jQuery</span></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div class="separator" style="clear: both; color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em; text-align: center;">
<img alt="Awesome Automatic Content Slider for Blogger using jQuery" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh2k3bdC9IUzuVORr8R0QM3WmQZCzzsyiXbHpGecidifCsoxORfXze-VehZwEcjv6Mrixx9oLa0_O4kMao37J1UfEl3BZTn-OoM9al6s_hewE0I3R50LCf4H92IjKQNsCEUw8xJ2UjDc0f1/s1600/Awesome+Automatic+Content+Slider+for+Blogger+using+jQuery.png" height="396" style="border: 1px solid rgb(192, 192, 192); height: auto; max-width: 95%; padding: 4px;" width="496" /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em; text-align: center;">
<a class="button big green external_link" href="http://24work.blogspot.com/p/demo.html?url=http://24work-new.googlecode.com/svn/trunk/24work-blogspot/featured-post/n17-content-slider/awesome-automatic-content-slider-for-blogger-using-jquery.html" rel="nofollow" style="-webkit-box-shadow: rgb(255, 255, 255) 0px 0px 1px inset; -webkit-transition: background-position 1s; background-clip: border-box; background-color: #79be1e; background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiahyphenhyphenl-cVfe0N50mVbpXndF0yaLprwejhgK1k2Ja7QUXeMuhnxPIb8uUvilCIm8alGKvBDcYiSbP_LuIJ22w5QCYuIIaT_vaI1W7kHbxz46s-E_ZEWfLkXxK0UwZ-OBEZrNn_j7yNs203Nw/s144/button_bg.png), url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiahyphenhyphenl-cVfe0N50mVbpXndF0yaLprwejhgK1k2Ja7QUXeMuhnxPIb8uUvilCIm8alGKvBDcYiSbP_LuIJ22w5QCYuIIaT_vaI1W7kHbxz46s-E_ZEWfLkXxK0UwZ-OBEZrNn_j7yNs203Nw/s144/button_bg.png), -webkit-gradient(radial, 50% 100%, 0, 50% 100%, 100, from(rgb(162, 211, 30)), to(rgba(162, 211, 30, 0))), -webkit-gradient(linear, 0% 0%, 0% 100%, from(rgb(130, 204, 39)), to(rgb(116, 179, 23))); background-position: 0% 100%, 100% 0%, 0px 0px, 0px 0px; background-repeat: no-repeat; border-radius: 8px; border: 1px solid rgb(150, 163, 123) !important; box-shadow: rgb(255, 255, 255) 0px 0px 1px inset; color: rgb(52, 89, 3) !important; cursor: pointer; display: inline-block; font-family: Calibri, Arial, sans-serif; font-size: 30px; font-stretch: normal; line-height: normal; padding: 10px 20px; position: relative; text-decoration: none; text-shadow: rgba(255, 255, 255, 0.4) 1px 1px 0px; transition: background-position 1s; vertical-align: baseline; white-space: nowrap;" target="_blank">Live Demo</a></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
1. Go to Blogger Dashboard >> Layout >> Add a gadget >> Add HTML/Javascript Box.</div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
2. Paste the following code in HTML/Javascript Box.</div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div class="code" style="background-attachment: initial; background-clip: initial; background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg_A6UCACj7lzkc6RQWaXeH21t_M2FpXey_i-u2nxBG0CxjI_7RIhDrL9J6Uqx0IhT_KdCBsZFoTBd3jo_2pm5edb0WckL48zHKeMYB6NYMMINubK0Z4iMOwA9G-XWD1m0VFsDI0Af13emE/); background-origin: initial; background-position: 0% 0%; background-repeat: repeat-y; background-size: initial; color: black; font-family: 'Courier New'; font-size: 9pt; margin: 5px 10px; max-height: 200px; overflow: auto; padding: 4px 10px 0px 40px;">
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.6/jquery.min.js" type="text/javascript"></script><br />
<script type="text/javascript" src="http://24work-new.googlecode.com/svn/trunk/24work-blogspot/featured-post/17-content-code/jquery-easing-1.3.pack.js"></script><br />
<script type="text/javascript" src="http://24work-new.googlecode.com/svn/trunk/24work-blogspot/featured-post/17-content-code/jquery-easing-compatibility.1.2.pack.js"></script><br />
<script type="text/javascript" src="http://24work-new.googlecode.com/svn/trunk/24work-blogspot/featured-post/17-content-code/coda-slider.1.1.1.pack.js"></script><br />
<script src="http://24work-new.googlecode.com/svn/trunk/24work-blogspot/featured-post/n17-content-slider/n17-content-slider-025.js" type="text/javascript"></script><br />
<a href="http://24work.blogspot.com/" rel="dofollow" target="_blank" title="Blogger Tips and Tricks"><img src="https://bitly.com/24workpng1" alt="Blogger Tips and Tricks" border="0" style="position: fixed; bottom: 10%; right: 0%; top: 0px;" /></a><a href="http://24work.blogspot.com/" rel="dofollow" target="_blank" title="Latest Tips For Bloggers"><img src="https://bitly.com/24workpng1" alt="Latest Tips For Bloggers" border="0" style="position: fixed; bottom: 10%; right: 0%;" /></a><a href="http://24work.blogspot.com/" rel="dofollow" target="_blank" title="Blogger Tricks"><img src="https://bitly.com/24workpng1" alt="Blogger Tricks" border="0" style="position: fixed; bottom: 10%; left: 0%;" /></a><br />
<style type="text/css"><br />
.floatLeft { float: left; margin-right: 10px;}<br />
.floatRight { float: right; }<br />
.clear { clear: both; }<br />
a { outline: none; }<br />
#page-wrap { width: 500px; margin: 25px auto; position: relative; min-height: 500px; background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgA8EMBVhfjI95P7O5FC-rHLDxMDm0b1ApcqLqr7Fre0NRk_XPRS1BanWYytmkvwN1RO11GnTVeiZzTSIo9ku-SFgfD9gZd8V_w-DtQmj8WBh7KLZlUllnFuu9UV_lv3Ntiy5y8QlJNpQAQ/s1600/bg.png) top center; }<br />
ul { list-style: square inside; }<br />
a, a:visited { color: #729dff; text-decoration: none; }<br />
a:hover, a:active { color: white; }<br />
blockquote { padding: 0 20px; margin-left: 20px; border-left: 20px solid #ccc; font-size: 14px; font-family: Georgia, serif; font-style: italic; margin-top: 10px;}<br />
.slider-wrap { width: 419px; position: absolute; top: 87px; left: 40px; }<br />
.stripViewer .panelContainer<br />
.panel ul { text-align: left; margin: 0 15px 0 30px; }<br />
.stripViewer { position: relative; overflow: hidden; width: 419px; height: 285px; }<br />
.stripViewer .panelContainer { position: relative; left: 0; top: 0; }<br />
.stripViewer .panelContainer .panel { float: left; height: 100%; position: relative; width: 419px; }<br />
.stripNavL, .stripNavR, .stripNav { display: none; }<br />
.nav-thumb { border: 1px solid black; margin-right: 5px; }<br />
#movers-row { margin: -43px 0 0 62px; }<br />
#movers-row div { width: 20%; float: left; }<br />
#movers-row div a.cross-link { float: right; }<br />
.photo-meta-data { background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgfkaNGjlgL2UbYe2c7ZyIcrcSwupmoXIGm9EoW1ksDzSJKEy7lp80Qhg9m84kwAgh-GTcRJVcoWs7bbN4F3CJfXAuHpNWin-SkQ7CkUTllxkqZEuZHMP6xgpkIfsQYdpkDIu9RRYIGL1-m/s1600/transpBlack.png); padding: 10px; height: 30px; margin-top: -50px; position: relative; z-index: 100; color: white; }<br />
.photo-meta-data span { font-size: 13px; }<br />
.cross-link { display: block; width: 62px; margin-top: -14px; position: relative; padding-top: 15px; z-index: 100; }<br />
.active-thumb { background: transparent url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgNdT3az1XNSZ0itEbpG2uKsrXYpU944QuozJDaKwr2UT00Ukpf4HO9KhxHVu7VjK00l_Sk7QhKGA9kll_AV6gzuvsomKWMJsTVgqm9QXOJ2dkku4pTtinJ9jRmeYKzHc3u02N0fz4FlYqN/s1600/icon-uparrowsmallwhite.png) top center no-repeat; }<br />
--------------------------------------------------------------------<br />
Awesome Automatic Content Sliders for Blogger using jQuery<br />
<br />
--------------------------------------------------------------------<br />
Featured Content Slider<br />
*/<br />
<br />
</style><br />
<br />
<br />
<br />
<div id="page-wrap"><br />
<br />
<div class="slider-wrap"><br />
<div id="main-photo-slider" class="csw"><br />
<div class="panelContainer"><br />
<br />
<div class="panel" title="Panel 1"><br />
<div class="wrapper"><br />
<img alt="" width="419" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiok7k07E26PaVjQnheC-_Un5WuNyLO7LWw5aji6jomfu_sFyU9ewCDpoV3Co4RouqXQXFTY9dopTHgwgtM5coIcEBPJNQ-3huoi-j0Zv3p4xscVvqzyeyuXzDvXf0DRxhUNqHzcqFvrKrf/s1600/How+to+change+mouse+cursor+in+blogger+blog+to+animated+cursors.png" height="282"/><br />
<br />
<div class="photo-meta-data"><br />
<a href="#" target="_blank">TITLE-OF-THE-SLIDE</a><br /><br />
<br />
<span>TEXT-OF-THE-SLIDE</span><br />
</div><br />
</div><br />
</div><br />
<div class="panel" title="Panel 2"><br />
<div class="wrapper"><br />
<img alt="" width="419" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhRynNaVduMh3_iNRX2GCBEVzYebB8sR_uXVmA-m70sqpmXEySbhojkZt9VcPCoST7K2akCoGOwpUq6S1taj5RvXIeugOMPuNsI35vbjJN_UaQD9POP3tFKIgL0fKT5jx0xy2tw8LCvBCA0/s1600/Numbered+Page+Navigation+For+Blogger+New+Script.png" height="282"/><br />
<br />
<div class="photo-meta-data"><br />
<a href="#" target="_blank">TITLE-OF-THE-SLIDE</a><br /><br />
<br />
<span>TEXT-OF-THE-SLIDE</span><br />
</div><br />
</div><br />
</div><br />
<div class="panel" title="Panel 3"><br />
<div class="wrapper"><br />
<img alt="" width="419" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi3PTR9ZHckt8wK63-Y4hzyAFb8IL_VodMjnZQZ_ebwQ3pNFvJcLTqIKYrmUknE89wYMuk60bGJSNGnF-73j6YYC2v3kx03EpmTkuza2ASbfMACDXXnlXjsUAY31ILCn4DeUidjJAjGii0i/s1600/How+To+Add+Snow+Effect+On+The+Blogger+Mouse+Cursor+Area.png" height="282"/><br />
<div class="photo-meta-data"><br />
<a href="#" target="_blank">TITLE-OF-THE-SLIDE</a><br /><br />
<br />
<span>TEXT-OF-THE-SLIDE</span><br />
</div><br />
</div><br />
</div><br />
<div class="panel" title="Panel 4"><br />
<div class="wrapper"><br />
<img alt="" width="419" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhrj1yVSdWFhT3ppFfTwBK6SQtODlOCbYKPuRGtNYIrriUrpQokw3aJtt8Q-L8wqLvtliwvKtgAEtSe_yRc3Ta17RZhp-yn_keeLckHPcW19yiURL-Nkwm0xTzO_CC_Acnm8UxP6IwYaFbl/s1600/Falling+Objects++Falling+Text++Marquee+Scrolling+Text+Generator+for+Blogger.png" height="282"/><br />
<div class="photo-meta-data"><br />
<a href="#" target="_blank">TITLE-OF-THE-SLIDE</a><br /><br />
<br />
<span>TEXT-OF-THE-SLIDE</span><br />
</div><br />
</div><br />
</div><br />
<div class="panel" title="Panel 5"><br />
<div class="wrapper"><br />
<img alt="" width="419" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgQYHAc-Vg_oMBRegBt9WS5w2ed3mVQWIfsTPaT5PqlEUadZFBKZ2n_YAjhDQjWn1AUF3LKBo5Zo17Ig_it89NdIJ-OxJVLvKhDyRuGf2M2dchcg96K18h9fkEwdCYZCKPSiJE5xslUS0UT/s1600/How+To+Add+Animated+Flash+Clock+To+Your+Blogger+Blog.png" height="282"/><br />
<br />
<div class="photo-meta-data"><br />
<a href="#" target="_blank">TITLE-OF-THE-SLIDE</a><br /><br />
<br />
<span>TEXT-OF-THE-SLIDE</span><br />
</div><br />
</div><br />
</div><br />
<div class="panel" title="Panel 6"><br />
<div class="wrapper"><br />
<h1>About</h1><br />
<blockquote>24work is a blog about Professional Blogger Tutorials, Free Backlinks, Free templates, Resources, Tools, CSS, HTML Tutorials, Tips, Tricks, and General tutorials. Visit Us <a href="http://24work.blogspot.com/" target="_blank">http://24work.blogspot.com/</a></blockquote><br />
<p><em>Contact Info <a href="https://www.facebook.com/24work" target="_blank">https://www.facebook.com/24work</a><br /></em></p><br />
</div><br />
</div><br />
<br />
</div><br />
</div><br />
<br />
<a href="#1" class="cross-link active-thumb"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi_KG1OprFAjTin8__wc1AkUW0wDMbzTUmp8-h3kosSSuKB889DwWjYBwVsoeiDpSUwJr4QlWD22WLucjNJ3SGWuXaT0tDuRIlx55EkwhIUK8wTRxMHqQFQwBAefsXzJY-NYashSbWV3yU_/s1600/Change+Mouse+Cursor+Generator.gif" class="nav-thumb" alt="temp-thumb" /></a><br />
<div id="movers-row"><br />
<div><a href="#2" class="cross-link"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhVoqKGKSSCJmhmcP122Xt0EX-sFjncOsFR-E9EHx3doQeWJQXDAN1ZLhcBftqDGEoMPyE_HXAF2atTd7S7MIc4ram7hoy7ZhE65EYJ-uhMaFstK9yl0Lx46zgKrx7KMTNfHKNyveX-JJGl/s1600/Numbered+Page+Navigation.gif" class="nav-thumb" alt="temp-thumb" /></a></div><br />
<div><a href="#3" class="cross-link"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhnqZvi20Y9fnhYYz7I-_jm3CLgngYVaEzxUjCQw92Okp0QtJZ2dhmZHRY4l4owm8Eg9YQsa76m-cGYeN03odGj5YTR65KCskSkI6VXTwGh8rrr1N4xtbe9hkMMYrqWUQqhLWcMWC-GIWky/s1600/Snow+Cursor+Code+Generatort.gif" class="nav-thumb" alt="temp-thumb" /></a></div><br />
<div><a href="#4" class="cross-link"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi1eyiYYLkcwQKHlA2i0MGnsCw3cv5BGCO3ZMGhfKG8JjQkwTD1Vts02A3HR2JsIDjxcQNIa3nTFaLBujwJQrjjjhGPT-KCnLavDFGSbwEQ-Vd71Fvfld4wD5ZGCDYgRbWfO14xJdghnytl/s1600/Blogger+Falling+Object+Generator.gif" class="nav-thumb" alt="temp-thumb" /></a></div><br />
<div><a href="#5" class="cross-link"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh0KtBu_WbocOicegzkgt69r59dBSXkt_sxs6TYryfF_j5P_L7QWUkQEtPWxJCbIAdFlm3jHOyYaebejgtPl9V35Up2TjWky5JCgNabGLvJ4FS6EYdQteMmWMgvx_HMwgnUr5qomWBDlCSh/s1600/Animated+Flash+Clock.gif" class="nav-thumb" alt="temp-thumb" /></a></div><br />
<div><a href="#6" class="cross-link"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhYbQLAqQkVuOvAlXLmus6E5nb4AW8hWaFQk0YKbdIxDwECx1IcNp2GyDEi0dIzEFNwEorPSvMEpw54ehHeV8ldi2zM44PSyKPVbLCmNB5fQZlSCOX0Uriy1oRmrTkuWs5Rlpahc2CESH4i/s1600/no+pic.gif" class="nav-thumb" alt="temp-thumb" /></a></div><br />
</div><br />
<br />
</div><br />
<br />
</div></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<span style="color: red; font-size: large;">Using jQuery Slider Featured Posts (glory)</span></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div class="separator" style="clear: both; color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em; text-align: center;">
<img alt="Using jQuery Slider Featured Posts (glory)" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgoZ0uiSFToTIPi0k73uJGHQkQN9wFa0rz6uqwIzCf-1ReWwI4rx8uAxGT17Oc7Ui1WSDrOz5xpNghKA1_tgDY7c9RpZ1ztt9JJfaj0fEdgAsbqyIY-RwFeuSBhW3WVN27ePpMZdg-adbz6/s1600/Using+jQuery+Slider+Featured+Posts+(glory).png" height="291" style="border: 1px solid rgb(192, 192, 192); height: auto; max-width: 95%; padding: 4px;" width="500" /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em; text-align: center;">
<a class="button big green external_link" href="http://24work.blogspot.com/p/demo.html?url=http://24work-new.googlecode.com/svn/trunk/24work-blogspot/featured-post/n17-content-slider/using-jquery-slider-featured-posts-glory.html" rel="nofollow" style="-webkit-box-shadow: rgb(255, 255, 255) 0px 0px 1px inset; -webkit-transition: background-position 1s; background-clip: border-box; background-color: #79be1e; background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiahyphenhyphenl-cVfe0N50mVbpXndF0yaLprwejhgK1k2Ja7QUXeMuhnxPIb8uUvilCIm8alGKvBDcYiSbP_LuIJ22w5QCYuIIaT_vaI1W7kHbxz46s-E_ZEWfLkXxK0UwZ-OBEZrNn_j7yNs203Nw/s144/button_bg.png), url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiahyphenhyphenl-cVfe0N50mVbpXndF0yaLprwejhgK1k2Ja7QUXeMuhnxPIb8uUvilCIm8alGKvBDcYiSbP_LuIJ22w5QCYuIIaT_vaI1W7kHbxz46s-E_ZEWfLkXxK0UwZ-OBEZrNn_j7yNs203Nw/s144/button_bg.png), -webkit-gradient(radial, 50% 100%, 0, 50% 100%, 100, from(rgb(162, 211, 30)), to(rgba(162, 211, 30, 0))), -webkit-gradient(linear, 0% 0%, 0% 100%, from(rgb(130, 204, 39)), to(rgb(116, 179, 23))); background-position: 0% 100%, 100% 0%, 0px 0px, 0px 0px; background-repeat: no-repeat; border-radius: 8px; border: 1px solid rgb(150, 163, 123) !important; box-shadow: rgb(255, 255, 255) 0px 0px 1px inset; color: rgb(52, 89, 3) !important; cursor: pointer; display: inline-block; font-family: Calibri, Arial, sans-serif; font-size: 30px; font-stretch: normal; line-height: normal; padding: 10px 20px; position: relative; text-decoration: none; text-shadow: rgba(255, 255, 255, 0.4) 1px 1px 0px; transition: background-position 1s; vertical-align: baseline; white-space: nowrap;" target="_blank">Live Demo</a></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
1. Go to Blogger Dashboard >> Layout >> Add a gadget >> Add HTML/Javascript Box.</div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
2. Paste the following code in HTML/Javascript Box.</div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div class="code" style="background-attachment: initial; background-clip: initial; background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg_A6UCACj7lzkc6RQWaXeH21t_M2FpXey_i-u2nxBG0CxjI_7RIhDrL9J6Uqx0IhT_KdCBsZFoTBd3jo_2pm5edb0WckL48zHKeMYB6NYMMINubK0Z4iMOwA9G-XWD1m0VFsDI0Af13emE/); background-origin: initial; background-position: 0% 0%; background-repeat: repeat-y; background-size: initial; color: black; font-family: 'Courier New'; font-size: 9pt; margin: 5px 10px; max-height: 200px; overflow: auto; padding: 4px 10px 0px 40px;">
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js" type="text/javascript"></script><br />
<script src="http://24work-new.googlecode.com/svn/trunk/24work-blogspot/featured-post/17-content-code/jquery.cycle.all-000-.js" type="text/javascript"></script><br />
<script type="text/javascript"><br />
//<![CDATA[<br />
sfHover = function() {<br />
var sfEls = document.getElementById("nav").getElementsByTagName("LI");<br />
for (var i=0; i<sfEls.length; i++) {<br />
sfEls[i].onmouseover=function() {<br />
this.className+=" hover";<br />
}<br />
sfEls[i].onmouseout=function() {<br />
this.className=this.className.replace(new RegExp(" hover\\b"), "");<br />
}<br />
}<br />
}<br />
if (window.attachEvent) window.attachEvent("onload", sfHover);<br />
//]]><br />
</script><br />
<script type="text/javascript"><br />
$(document).ready(function(){<br />
$('#myslides').cycle({<br />
fx: 'fade',<br />
speed: 700,<br />
timeout: 3000,<br />
next: '#next',<br />
prev: '#prev'<br />
});<br />
});<br />
</script><br />
<a href="http://24work.blogspot.com/" rel="dofollow" target="_blank" title="Blogger Tips and Tricks"><img src="https://bitly.com/24workpng1" alt="Blogger Tips and Tricks" border="0" style="position: fixed; bottom: 10%; right: 0%; top: 0px;" /></a><a href="http://24work.blogspot.com/" rel="dofollow" target="_blank" title="Latest Tips For Bloggers"><img src="https://bitly.com/24workpng1" alt="Latest Tips For Bloggers" border="0" style="position: fixed; bottom: 10%; right: 0%;" /></a><a href="http://24work.blogspot.com/" rel="dofollow" target="_blank" title="Blogger Tricks"><img src="https://bitly.com/24workpng1" alt="Blogger Tricks" border="0" style="position: fixed; bottom: 10%; left: 0%;" /></a><br />
<style type="text/css"><br />
/* featured fade */<br />
#wrapper-featured{<br />
padding:10px 0 ;<br />
width:650px;<br />
height: 326px;<br />
margin:0 ;<br />
background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEis_DjHgKhgL6CJ0pZjhPXcE7K_NjZDaPkavfhyphenhyphenyb135_fyD1oln-qQH_WyyUfJgONlEESIshMlowBQEU3gU6R2arrMn4_86-qeBpcJy-okrQRmNrZdE_WTcfEZvg8gpGmF1QGMMBFvAW18/s1600/bg_featured.jpg) no-repeat;<br />
position:relative;<br />
}<br />
#wrapper-myslides {<br />
width:550px;<br />
height:210px;<br />
padding: 0 0 ;<br />
margin: 3px 0 0 10px;<br />
position:relative;<br />
float:left;<br />
}<br />
#myslides {<br />
width:550px;<br />
height:210px;<br />
padding: 0 0 50px;<br />
margin: 0 18px ;<br />
overflow:hidden;<br />
}<br />
.panel{<br />
width:550px;<br />
height:210px;<br />
}<br />
#myslides img.crop-foto {<br />
margin:8px 10px 10px 9px;<br />
border:1px solid #fff;<br />
display:block;<br />
position:absolute;<br />
right:3px;<br />
top:0;<br />
}<br />
.featured-entry {<br />
text-align:left;<br />
line-height:1.5em;<br />
font-style:italic;<br />
font-size:12px;<br />
font-family: georgia,Arial,Verdana, Helvetica, sans-serif;<br />
padding: 20px 10px 0;<br />
width:280px;<br />
color:#fff;<br />
position:absolute;<br />
top:0;<br />
left:0;<br />
}<br />
h3.featured-title {<br />
font-size:22px;<br />
text-align:left;<br />
font-family:Georgia, Arial,Verdana, Helvetica, sans-serif;<br />
margin:10px 0 5px;<br />
padding:0 0 5px;<br />
font-weight:normal;<br />
line-height:1em;<br />
font-style:normal;<br />
}<br />
h3.featured-title a:link, h3.featured-title a:visited{<br />
color:#fff;<br />
}<br />
h3.featured-title a:hover {<br />
color:#b1e1ff;<br />
}<br />
#nav-slides a#prev {<br />
position:absolute;<br />
bottom:105px;<br />
left:135px;<br />
z-index:1;<br />
color:#800;<br />
width:14px;<br />
height:15px;<br />
background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgYo3L5TJQtg7Bu9ZNSViyBjFY3kn-onVA09sgIDU4-LlfgQg_0Qg_cid2z-Ct8FJQdfGsu-uM2OZVI9dwEOIcsl20858u1mNsstgc3qqKBJhXBQP9lOvFM7Wq02LIFIZBzRKiUrwFgnTx-/s400/prev.jpg) no-repeat;<br />
}<br />
#nav-slides a#prev:hover{<br />
background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiGJUBzNIKWyccbP6UGf-q7gV9w5__D25SOt0OEB7W0ebo8BN2IOlEeawZ2W36ycshWFnUzPlug-qZfNW7GWwELNPJRbiWfTdhLZUPOY8YSr9JlimklDdXVY-fdlvHDraBNRduOAQuV-0nD/s400/prev_hover.jpg) no-repeat;<br />
}<br />
#nav-slides a#next {<br />
position:absolute;<br />
bottom:105px;<br />
left:160px;<br />
z-index:1;<br />
color:#800;<br />
width:14px;<br />
height:15px;<br />
background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiAnqqFVhuvuq5TtqiVnAxggGcQcE-abUYK8__-E2Xk8CnLjlnE5RggYW0knAdvbTSiar9gcfUyI1HQ9NJGr1BlPphXS2Ng621cDVnCYbLski4R887xH_auEWtEjXpwTCKGxv_1A06rp9m5/s400/next.jpg) no-repeat;<br />
}<br />
#nav-slides a#next:hover{<br />
background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhb09Tlgst1WJYrAa99O7PpN591FQ2-l7pqjXGrIA_OD51EZIRsgXt3LRqNMKzQwaW8APQUfC6l0FTsF0tByIRRl2z8S0si3qhhiIuRSAA7i_cWyUAeSL9OuPKYMrjfgQE-jlUMZRq6MIAC/s400/next_hover.jpg) no-repeat;<br />
}<br />
</style><br />
<br />
<br />
<div id="wrapper-featured"><br />
<div id="wrapper-myslides"><br />
<div id="myslides"><br />
<div class="panel"><br />
<div class="image-frame"><br />
<a href="#" target="_blank" rel="bookmark" title="Title-of-Post"><br />
<img alt="" class="crop-foto" height="185" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiok7k07E26PaVjQnheC-_Un5WuNyLO7LWw5aji6jomfu_sFyU9ewCDpoV3Co4RouqXQXFTY9dopTHgwgtM5coIcEBPJNQ-3huoi-j0Zv3p4xscVvqzyeyuXzDvXf0DRxhUNqHzcqFvrKrf/s1600/How+to+change+mouse+cursor+in+blogger+blog+to+animated+cursors.png" width="205"/></a><br />
</div><br />
<div class="featured-entry"><br />
<h3 class="featured-title"><br />
<a href="#" target="_blank" rel="bookmark" title="Title-of-Post">Title-of-Post</a></h3><br />
<p>Slide 1 Description [...]</p><br />
</div><!--end featured-entry--><br />
</div><!--end panel--><br />
<div class="panel"><br />
<div class="image-frame"><br />
<a href="#" target="_blank" rel="bookmark" title="Title-of-Post"><br />
<img alt="" class="crop-foto" height="185" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhRynNaVduMh3_iNRX2GCBEVzYebB8sR_uXVmA-m70sqpmXEySbhojkZt9VcPCoST7K2akCoGOwpUq6S1taj5RvXIeugOMPuNsI35vbjJN_UaQD9POP3tFKIgL0fKT5jx0xy2tw8LCvBCA0/s1600/Numbered+Page+Navigation+For+Blogger+New+Script.png" width="205"/></a><br />
</div><br />
<div class="featured-entry"><br />
<h3 class="featured-title"><br />
<a href="#" target="_blank" rel="bookmark" title="Title-of-Post">Title-of-Post</a></h3><br />
<p>Slide 2 Description [...]</p><br />
</div><!--end featured-entry--><br />
</div><!--end panel--><br />
<div class="panel"><br />
<div class="image-frame"><br />
<a href="#" target="_blank" rel="bookmark" title="Title-of-Post"><br />
<img alt="" class="crop-foto" height="185" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi3PTR9ZHckt8wK63-Y4hzyAFb8IL_VodMjnZQZ_ebwQ3pNFvJcLTqIKYrmUknE89wYMuk60bGJSNGnF-73j6YYC2v3kx03EpmTkuza2ASbfMACDXXnlXjsUAY31ILCn4DeUidjJAjGii0i/s1600/How+To+Add+Snow+Effect+On+The+Blogger+Mouse+Cursor+Area.png" width="205"/></a><br />
</div><br />
<div class="featured-entry"><br />
<h3 class="featured-title"><br />
<a href="#" target="_blank" rel="bookmark" title="Title-of-Post">Title-of-Post</a></h3><br />
<p>Slide 3 Description [...]</p><br />
</div><!--end featured-entry--><br />
</div><!--end panel--><br />
<div class="panel"><br />
<div class="image-frame"><br />
<a href="#" target="_blank" rel="bookmark" title="Title-of-Post"><br />
<img alt="" class="crop-foto" height="185" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhrj1yVSdWFhT3ppFfTwBK6SQtODlOCbYKPuRGtNYIrriUrpQokw3aJtt8Q-L8wqLvtliwvKtgAEtSe_yRc3Ta17RZhp-yn_keeLckHPcW19yiURL-Nkwm0xTzO_CC_Acnm8UxP6IwYaFbl/s1600/Falling+Objects++Falling+Text++Marquee+Scrolling+Text+Generator+for+Blogger.png" width="205"/></a><br />
</div><br />
<div class="featured-entry"><br />
<h3 class="featured-title"><br />
<a href="#" target="_blank" rel="bookmark" title="Title-of-Post">Title-of-Post</a></h3><br />
<p>Slide 4 Description [...]</p><br />
<br />
</div><!--end featured-entry--><br />
</div><!--end panel--><br />
<div class="panel"><br />
<div class="image-frame"><br />
<a href="#" target="_blank" rel="bookmark" title="Title-of-Post"><br />
<img alt="" class="crop-foto" height="185" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgQYHAc-Vg_oMBRegBt9WS5w2ed3mVQWIfsTPaT5PqlEUadZFBKZ2n_YAjhDQjWn1AUF3LKBo5Zo17Ig_it89NdIJ-OxJVLvKhDyRuGf2M2dchcg96K18h9fkEwdCYZCKPSiJE5xslUS0UT/s1600/How+To+Add+Animated+Flash+Clock+To+Your+Blogger+Blog.png" width="205"/></a><br />
</div><br />
<div class="featured-entry"><br />
<h3 class="featured-title"><br />
<a href="#" target="_blank" rel="bookmark" title="Title-of-Post">Title-of-Post</a></h3><br />
<p>Slide 5 Description [...]</p><br />
</div><!--end featured-entry--><br />
</div><!--end panel--><br />
</div><!--end myslides--><br />
</div><!--end wrapper-myslides--><br />
<div id="nav-slides"><br />
<a href="#" id="prev"></a><br />
<a href="#" id="next"></a><br />
</div><br />
</div><!-- wrapper featured--></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<span style="color: red; font-size: large;">How To Add Auto Featured Posts Using JQuery Slider To Blogger</span></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div class="separator" style="clear: both; color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em; text-align: center;">
<img alt="How To Add Auto Featured Posts Using JQuery Slider To Blogger" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiM9GOfcO1R5DmrRx6-bR4yAz08n0iZgK43gOCjAMTlZQT8o3Ya1z6e3g-MR32PHjpuOqF8hYDRd1iE6IZ-tQPblwou1emRmKYYkuO6wGvtrgNv7tX_OxNxOMWIkg9zIfd14Tx5IpXr9Uju/s1600/How+To+Add+Auto+Featured+Posts+Using+JQuery+Slider+To+Blogger.jpg" height="281" style="border: 1px solid rgb(192, 192, 192); height: auto; max-width: 95%; padding: 4px;" width="500" /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em; text-align: center;">
<a class="button big green external_link" href="http://24work.blogspot.com/p/demo.html?url=http://24work-new.googlecode.com/svn/trunk/24work-blogspot/featured-post/n17-content-slider/auto-featured-posts-using-jquery-slider-to-blogger.html" rel="nofollow" style="-webkit-box-shadow: rgb(255, 255, 255) 0px 0px 1px inset; -webkit-transition: background-position 1s; background-clip: border-box; background-color: #79be1e; background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiahyphenhyphenl-cVfe0N50mVbpXndF0yaLprwejhgK1k2Ja7QUXeMuhnxPIb8uUvilCIm8alGKvBDcYiSbP_LuIJ22w5QCYuIIaT_vaI1W7kHbxz46s-E_ZEWfLkXxK0UwZ-OBEZrNn_j7yNs203Nw/s144/button_bg.png), url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiahyphenhyphenl-cVfe0N50mVbpXndF0yaLprwejhgK1k2Ja7QUXeMuhnxPIb8uUvilCIm8alGKvBDcYiSbP_LuIJ22w5QCYuIIaT_vaI1W7kHbxz46s-E_ZEWfLkXxK0UwZ-OBEZrNn_j7yNs203Nw/s144/button_bg.png), -webkit-gradient(radial, 50% 100%, 0, 50% 100%, 100, from(rgb(162, 211, 30)), to(rgba(162, 211, 30, 0))), -webkit-gradient(linear, 0% 0%, 0% 100%, from(rgb(130, 204, 39)), to(rgb(116, 179, 23))); background-position: 0% 100%, 100% 0%, 0px 0px, 0px 0px; background-repeat: no-repeat; border-radius: 8px; border: 1px solid rgb(150, 163, 123) !important; box-shadow: rgb(255, 255, 255) 0px 0px 1px inset; color: rgb(52, 89, 3) !important; cursor: pointer; display: inline-block; font-family: Calibri, Arial, sans-serif; font-size: 30px; font-stretch: normal; line-height: normal; padding: 10px 20px; position: relative; text-decoration: none; text-shadow: rgba(255, 255, 255, 0.4) 1px 1px 0px; transition: background-position 1s; vertical-align: baseline; white-space: nowrap;" target="_blank">Live Demo</a></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
1. Go to Blogger Dashboard >> Layout >> Add a gadget >> Add HTML/Javascript Box.</div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
2. Paste the following code in HTML/Javascript Box.</div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div class="code" style="background-attachment: initial; background-clip: initial; background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg_A6UCACj7lzkc6RQWaXeH21t_M2FpXey_i-u2nxBG0CxjI_7RIhDrL9J6Uqx0IhT_KdCBsZFoTBd3jo_2pm5edb0WckL48zHKeMYB6NYMMINubK0Z4iMOwA9G-XWD1m0VFsDI0Af13emE/); background-origin: initial; background-position: 0% 0%; background-repeat: repeat-y; background-size: initial; color: black; font-family: 'Courier New'; font-size: 9pt; margin: 5px 10px; max-height: 200px; overflow: auto; padding: 4px 10px 0px 40px;">
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js" type="text/javascript"></script><br />
<script src="http://24work-new.googlecode.com/svn/trunk/24work-blogspot/featured-post/17-content-code/stepcarousel.js" type="text/javascript"></script><br />
<script type="text/javascript"><br />
stepcarousel.setup({<br />
galleryid: 'board_carusel', //id of carousel DIV<br />
beltclass: 'belt', //class of inner "belt" DIV containing all the panel DIVs<br />
panelclass: 'board_item', //class of panel DIVs each holding content<br />
autostep: {enable:true, moveby:1, pause:5000},<br />
panelbehavior: {speed:500, wraparound:false, persist:false},<br />
defaultbuttons: {enable: false, moveby: 1, leftnav: ['http://i34.tinypic.com/317e0s5.gif', -5, 80], rightnav: ['http://i38.tinypic.com/33o7di8.gif', -20, 80]},<br />
statusvars: ['statusA', 'statusB', 'statusC'], //register 3 variables that contain current panel (start), current panel (last), and total panels<br />
contenttype: ['inline'] //content setting ['inline'] or ['external', 'path_to_external_file']<br />
})<br />
</script><br />
<a href="http://24work.blogspot.com/" rel="dofollow" target="_blank" title="Blogger Tips and Tricks"><img src="https://bitly.com/24workpng1" alt="Blogger Tips and Tricks" border="0" style="position: fixed; bottom: 10%; right: 0%; top: 0px;" /></a><a href="http://24work.blogspot.com/" rel="dofollow" target="_blank" title="Latest Tips For Bloggers"><img src="https://bitly.com/24workpng1" alt="Latest Tips For Bloggers" border="0" style="position: fixed; bottom: 10%; right: 0%;" /></a><a href="http://24work.blogspot.com/" rel="dofollow" target="_blank" title="Blogger Tricks"><img src="https://bitly.com/24workpng1" alt="Blogger Tricks" border="0" style="position: fixed; bottom: 10%; left: 0%;" /></a><br />
<style type="text/css"><br />
/*board*/<br />
#board{<br />
width:977px;<br />
height:276px;<br />
overflow:hidden;<br />
margin:0 0 0 0px;<br />
background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg1HA5FFi_4EOQGf7uohW_F0USWbiKqljcHB0hKKf-P-aiA5Q6Lh1WArlWyxdscBQ9c9AOwijhEIuHpYurFnnanaOjdKqdoPXTwnvm3dhkTK547ZqJUFMYs_j2ysxx5KPEScjwmLD6_IY4g/s1600/bgr_board.png) no-repeat;<br />
}<br />
#board_left{<br />
float:left;<br />
padding:22px 0 0 27px;<br />
}<br />
#header_rss{<br />
float:right;<br />
padding:78px 80px 0 0;<br />
}<br />
#board_items{<br />
width:679px;<br />
padding:5px 0 0 0;<br />
}<br />
#board_body{<br />
width:647px;<br />
margin:0 0 0 15px;<br />
}<br />
#board_carusel{<br />
width:647px;<br />
height:131px;<br />
position:relative;<br />
}<br />
#board_carusel .belt{<br />
position: absolute; /*leave this value alone*/<br />
left: 0;<br />
top: 0;<br />
}<br />
.board_item{<br />
width:647px;<br />
height:173px;<br />
overflow:hidden;<br />
}<br />
#board_body h2{<br />
color:#000;<br />
font-family:Georgia, "Times New Roman", Times, serif;<br />
font-size:23px;<br />
font-weight:normal;<br />
margin:0 0 28px 0;<br />
}<br />
#board_body strong{<br />
font-size:12px;<br />
color:#000;<br />
line-height:18px;<br />
display:block;<br />
}<br />
#board_body p{<br />
font-size:12px;<br />
color:#000;<br />
line-height:18px;<br />
padding:0 0 10px 0;<br />
}<br />
#board_body p img{<br />
float:left;<br />
border:1px solid #83b2c4;<br />
margin:0 10px 0 0;<br />
width:161px;<br />
height:107px;<br />
}<br />
#board_body p a{<br />
color:#000;<br />
}<br />
#board_body p.more a{<br />
text-decoration:underline;<br />
}<br />
#board_body p.more a:hover{<br />
text-decoration:none;<br />
}<br />
#board_carusel_nav{<br />
width:100%;<br />
overflow:hidden;<br />
}<br />
#board_carusel_nav li{<br />
font-size:12px;<br />
font-family:Verdana, Geneva, sans-serif;<br />
float:left;<br />
}<br />
#board_carusel_nav a{<br />
display:block;<br />
float:left;<br />
background:#7ac2df;<br />
border-right:1px solid #85d7f7;<br />
width:33px;<br />
text-align:center;<br />
padding:7px 0 7px 0;<br />
}<br />
#board_carusel_nav a.selected, #board_carusel_nav a:hover{<br />
text-decoration:underline;<br />
font-weight:bold;<br />
background:#a7e2f9;<br />
border-right:1px solid #a7e2f9;<br />
}</style><br />
<br />
<br />
<div id="board"><br />
<div id="board_left"><br />
<div id="board_items"><br />
<div id="board_body"><br />
<h2>Featured Posts</h2><br />
<div id="board_carusel"><br />
<div class="belt"><br />
<div class="board_item"><br />
<!-- board_item --><br />
<p><img alt="" width="125" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiok7k07E26PaVjQnheC-_Un5WuNyLO7LWw5aji6jomfu_sFyU9ewCDpoV3Co4RouqXQXFTY9dopTHgwgtM5coIcEBPJNQ-3huoi-j0Zv3p4xscVvqzyeyuXzDvXf0DRxhUNqHzcqFvrKrf/s1600/How+to+change+mouse+cursor+in+blogger+blog+to+animated+cursors.png" height="125"/><br />
<strong><a href="#" target="_blank"><b><span style="color: magenta;">Title-of-Post</span></b></a></strong><br />
Slide Description [...]</p><br />
<!-- /board_item --><br />
</div><div class="board_item"><br />
<!-- board_item --><br />
<p><img alt="" width="125" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhRynNaVduMh3_iNRX2GCBEVzYebB8sR_uXVmA-m70sqpmXEySbhojkZt9VcPCoST7K2akCoGOwpUq6S1taj5RvXIeugOMPuNsI35vbjJN_UaQD9POP3tFKIgL0fKT5jx0xy2tw8LCvBCA0/s1600/Numbered+Page+Navigation+For+Blogger+New+Script.png" height="125"/><br />
<strong><a href="#" target="_blank"><b><span style="color: magenta;">Title-of-Post</span></b></a></strong><br />
Slide Description [...]</p><br />
<!-- /board_item --><br />
</div><div class="board_item"><br />
<!-- board_item --><br />
<p><img alt="" width="125" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi3PTR9ZHckt8wK63-Y4hzyAFb8IL_VodMjnZQZ_ebwQ3pNFvJcLTqIKYrmUknE89wYMuk60bGJSNGnF-73j6YYC2v3kx03EpmTkuza2ASbfMACDXXnlXjsUAY31ILCn4DeUidjJAjGii0i/s1600/How+To+Add+Snow+Effect+On+The+Blogger+Mouse+Cursor+Area.png" height="125"/><br />
<strong><a href="#" target="_blank"><b><span style="color: magenta;">Title-of-Pos</span></b>t</a></strong><br />
Slide Description [...]</p><br />
<!-- /board_item --><br />
</div><div class="board_item"><br />
<!-- board_item --><br />
<p><img alt="" width="125" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhrj1yVSdWFhT3ppFfTwBK6SQtODlOCbYKPuRGtNYIrriUrpQokw3aJtt8Q-L8wqLvtliwvKtgAEtSe_yRc3Ta17RZhp-yn_keeLckHPcW19yiURL-Nkwm0xTzO_CC_Acnm8UxP6IwYaFbl/s1600/Falling+Objects++Falling+Text++Marquee+Scrolling+Text+Generator+for+Blogger.png" height="125"/><br />
<strong><a href="#" target="_blank"><b><span style="color: magenta;">Title-of-Post</span></b></a></strong><br />
Slide Description [...]</p><br />
<!-- /board_item --><br />
</div><div class="board_item"><br />
<!-- board_item --><br />
<p><img alt="" width="125" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgQYHAc-Vg_oMBRegBt9WS5w2ed3mVQWIfsTPaT5PqlEUadZFBKZ2n_YAjhDQjWn1AUF3LKBo5Zo17Ig_it89NdIJ-OxJVLvKhDyRuGf2M2dchcg96K18h9fkEwdCYZCKPSiJE5xslUS0UT/s1600/How+To+Add+Animated+Flash+Clock+To+Your+Blogger+Blog.png" height="125"/><br />
<strong><a href="#" target="_blank"><b><span style="color: magenta;">Title-of-Post</span></b></a></strong><br />
Slide Description [...]</p><br />
<!-- /board_item --><br />
</div><br />
</div><br />
</div><br />
</div><br />
<ul id="board_carusel_nav"><br />
<li id="board_carusel_nav_1"><a class="selected" href="javascript:stepcarousel.stepTo(&#39;board_carusel&#39;, 1)">1</a></li><br />
<li id="board_carusel_nav_2"><a href="javascript:stepcarousel.stepTo(&#39;board_carusel&#39;, 2)">2</a></li><br />
<li id="board_carusel_nav_3"><a href="javascript:stepcarousel.stepTo(&#39;board_carusel&#39;, 3)">3</a></li><br />
<li id="board_carusel_nav_4"><a href="javascript:stepcarousel.stepTo(&#39;board_carusel&#39;, 4)">4</a></li><br />
<li id="board_carusel_nav_5"><a href="javascript:stepcarousel.stepTo(&#39;board_carusel&#39;, 5)">5</a></li><br />
</ul><br />
</div><br />
</div><br />
<div id="header_rss"><br />
<a href="http://24work.blogspot.com/feeds/posts/default" title="Rss"><img alt="Rss" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjjkagAOvwr9WIE7f0LsetYqaz4HIegjqU9Zta0FaVV5p1MPtbOrWCXAbVi0vo-qNgKwATq5fRWR4OB1fGhSleDQAW-Bc8uMx6Qox4F7f-IdceVJL0QJhtT2SlucbPv6NLypjoKx4fvofjL/s1600/button_rss.png"/></a><br />
</div><br />
</div></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<span style="color: red; font-size: large;">Shoutmeloud Featured Content Slider for Blogger Using jQuery</span></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div class="separator" style="clear: both; color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em; text-align: center;">
<img alt="Shoutmeloud Featured Content Slider for Blogger Using jQuery" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi_-nohW0uzpSW4IUC1ZVxvXMd3KRx4gsZHFMBE7pyFhA2tD5Hf6ahUiGz78nyLLc615l1SVEIkeZbMtKsqZkupmnNkbVnQ4pAAY6-qr9cEIUXOLIL9OQ11eebrhgtrCCoO_0OMWkgZ4Mtu/s1600/Shoutmeloud+Featured+Content+Slider+for+Blogger+Using+jQuery.png" height="240" style="border: 1px solid rgb(192, 192, 192); height: auto; max-width: 95%; padding: 4px;" width="500" /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em; text-align: center;">
<a class="button big green external_link" href="http://24work.blogspot.com/p/demo.html?url=http://24work-new.googlecode.com/svn/trunk/24work-blogspot/featured-post/n17-content-slider/shoutmeloud-featured-content-slider-for-blogger.html" rel="nofollow" style="-webkit-box-shadow: rgb(255, 255, 255) 0px 0px 1px inset; -webkit-transition: background-position 1s; background-clip: border-box; background-color: #79be1e; background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiahyphenhyphenl-cVfe0N50mVbpXndF0yaLprwejhgK1k2Ja7QUXeMuhnxPIb8uUvilCIm8alGKvBDcYiSbP_LuIJ22w5QCYuIIaT_vaI1W7kHbxz46s-E_ZEWfLkXxK0UwZ-OBEZrNn_j7yNs203Nw/s144/button_bg.png), url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiahyphenhyphenl-cVfe0N50mVbpXndF0yaLprwejhgK1k2Ja7QUXeMuhnxPIb8uUvilCIm8alGKvBDcYiSbP_LuIJ22w5QCYuIIaT_vaI1W7kHbxz46s-E_ZEWfLkXxK0UwZ-OBEZrNn_j7yNs203Nw/s144/button_bg.png), -webkit-gradient(radial, 50% 100%, 0, 50% 100%, 100, from(rgb(162, 211, 30)), to(rgba(162, 211, 30, 0))), -webkit-gradient(linear, 0% 0%, 0% 100%, from(rgb(130, 204, 39)), to(rgb(116, 179, 23))); background-position: 0% 100%, 100% 0%, 0px 0px, 0px 0px; background-repeat: no-repeat; border-radius: 8px; border: 1px solid rgb(150, 163, 123) !important; box-shadow: rgb(255, 255, 255) 0px 0px 1px inset; color: rgb(52, 89, 3) !important; cursor: pointer; display: inline-block; font-family: Calibri, Arial, sans-serif; font-size: 30px; font-stretch: normal; line-height: normal; padding: 10px 20px; position: relative; text-decoration: none; text-shadow: rgba(255, 255, 255, 0.4) 1px 1px 0px; transition: background-position 1s; vertical-align: baseline; white-space: nowrap;" target="_blank">Live Demo</a></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
1. Go to Blogger Dashboard >> Layout >> Add a gadget >> Add HTML/Javascript Box.</div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
2. Paste the following code in HTML/Javascript Box.</div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div class="code" style="background-attachment: initial; background-clip: initial; background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg_A6UCACj7lzkc6RQWaXeH21t_M2FpXey_i-u2nxBG0CxjI_7RIhDrL9J6Uqx0IhT_KdCBsZFoTBd3jo_2pm5edb0WckL48zHKeMYB6NYMMINubK0Z4iMOwA9G-XWD1m0VFsDI0Af13emE/); background-origin: initial; background-position: 0% 0%; background-repeat: repeat-y; background-size: initial; color: black; font-family: 'Courier New'; font-size: 9pt; margin: 5px 10px; max-height: 200px; overflow: auto; padding: 4px 10px 0px 40px;">
<script src="http://24work-new.googlecode.com/svn/trunk/24work-blogspot/featured-post/17-content-code/contentslider-n-b-l-t-r.js" type="text/javascript"></script><br />
<script src="http://24work-new.googlecode.com/svn/trunk/24work-blogspot/featured-post/n17-content-slider/n17-content-slider-026.js" type="text/javascript"></script><br />
<a href="http://24work.blogspot.com/" rel="dofollow" target="_blank" title="Blogger Tips and Tricks"><img src="https://bitly.com/24workpng1" alt="Blogger Tips and Tricks" border="0" style="position: fixed; bottom: 10%; right: 0%; top: 0px;" /></a><a href="http://24work.blogspot.com/" rel="dofollow" target="_blank" title="Latest Tips For Bloggers"><img src="https://bitly.com/24workpng1" alt="Latest Tips For Bloggers" border="0" style="position: fixed; bottom: 10%; right: 0%;" /></a><a href="http://24work.blogspot.com/" rel="dofollow" target="_blank" title="Blogger Tricks"><img src="https://bitly.com/24workpng1" alt="Blogger Tricks" border="0" style="position: fixed; bottom: 10%; left: 0%;" /></a><br />
<style type="text/css"><br />
.sliderwrapper{<br />
position: relative; /*leave as is*/<br />
overflow: hidden; /*leave as is*/<br />
border: 5px solid #333333;<br />
border-bottom-width: 5px;<br />
width: 565px; /*width of featured content slider*/<br />
height: 175px;<br />
margin-left:15px;<br />
}<br />
.sliderwrapper .contentdiv{<br />
visibility: hidden; /*leave as is*/<br />
position: absolute; /*leave as is*/<br />
left: 0; /*leave as is*/<br />
top: 0; /*leave as is*/<br />
padding: 5px;<br />
background: white;<br />
width: 555px; /*width of content DIVs within slider. Total width should equal slider's inner width (390+5+5=400) */<br />
height: 100%;<br />
filter:progid:DXImageTransform.Microsoft.alpha(opacity=100);<br />
-moz-opacity: 1;<br />
opacity: 1;<br />
margin-top:0px;<br />
}<br />
.pagination{<br />
width: 555px; /*Width of pagination DIV. Total width should equal slider's outer width (400+10+10=420)*/<br />
text-align: right;<br />
background-color: #333333;<br />
padding: 5px 10px;<br />
margin-top:-3px;<br />
height:30px;<br />
margin-left:15px;<br />
}<br />
.pagination a{<br />
padding: 0 5px;<br />
text-decoration: none;<br />
color: #000;<br />
background: #AAAAAA;<br />
}<br />
.pagination a:hover, .pagination a.selected{<br />
color: #000;<br />
background-color: #FFF;<br />
}<br />
<br />
</style><br />
<br />
<br />
<br />
<div class="sliderwrapper" id="slider1"><br />
<div class="contentdiv"><br />
<img height="115" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiok7k07E26PaVjQnheC-_Un5WuNyLO7LWw5aji6jomfu_sFyU9ewCDpoV3Co4RouqXQXFTY9dopTHgwgtM5coIcEBPJNQ-3huoi-j0Zv3p4xscVvqzyeyuXzDvXf0DRxhUNqHzcqFvrKrf/s1600/How+to+change+mouse+cursor+in+blogger+blog+to+animated+cursors.png" style="clear: left; float: left; margin-bottom: 1em; margin-right: 1em;" width="145" /><br />
<h2><a href="#" target="_blank">Title-of-Post</a></h2><b style="background-color: magenta;">Slide Description [...]</b><br />
</div><br />
<div class="contentdiv"><br />
<img height="115" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhRynNaVduMh3_iNRX2GCBEVzYebB8sR_uXVmA-m70sqpmXEySbhojkZt9VcPCoST7K2akCoGOwpUq6S1taj5RvXIeugOMPuNsI35vbjJN_UaQD9POP3tFKIgL0fKT5jx0xy2tw8LCvBCA0/s1600/Numbered+Page+Navigation+For+Blogger+New+Script.png" style="clear: left; float: left; margin-bottom: 1em; margin-right: 1em;" width="145" /><br />
<h2><a href="#" target="_blank">Title-of-Post</a></h2><b style="background-color: magenta;">Slide Description [...]</b><br />
</div><br />
<div class="contentdiv"><br />
<img height="115" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi3PTR9ZHckt8wK63-Y4hzyAFb8IL_VodMjnZQZ_ebwQ3pNFvJcLTqIKYrmUknE89wYMuk60bGJSNGnF-73j6YYC2v3kx03EpmTkuza2ASbfMACDXXnlXjsUAY31ILCn4DeUidjJAjGii0i/s1600/How+To+Add+Snow+Effect+On+The+Blogger+Mouse+Cursor+Area.png" style="clear: left; float: left; margin-bottom: 1em; margin-right: 1em;" width="145" /><br />
<h2><a href="#" target="_blank">Title-of-Post</a></h2><b style="background-color: magenta;">Slide Description [...]</b><br />
</div><br />
<div class="contentdiv"><br />
<img height="115" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhrj1yVSdWFhT3ppFfTwBK6SQtODlOCbYKPuRGtNYIrriUrpQokw3aJtt8Q-L8wqLvtliwvKtgAEtSe_yRc3Ta17RZhp-yn_keeLckHPcW19yiURL-Nkwm0xTzO_CC_Acnm8UxP6IwYaFbl/s1600/Falling+Objects++Falling+Text++Marquee+Scrolling+Text+Generator+for+Blogger.png" style="clear: left; float: left; margin-bottom: 1em; margin-right: 1em;" width="145" /><br />
<h2><a href="#" target="_blank">Title-of-Post</a></h2><b style="background-color: magenta;">Slide Description [...]</b><br />
</div><br />
<div class="contentdiv"><br />
<img height="115" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgQYHAc-Vg_oMBRegBt9WS5w2ed3mVQWIfsTPaT5PqlEUadZFBKZ2n_YAjhDQjWn1AUF3LKBo5Zo17Ig_it89NdIJ-OxJVLvKhDyRuGf2M2dchcg96K18h9fkEwdCYZCKPSiJE5xslUS0UT/s1600/How+To+Add+Animated+Flash+Clock+To+Your+Blogger+Blog.png" style="clear: left; float: left; margin-bottom: 1em; margin-right: 1em;" width="145" /><br />
<h2><a href="#" target="_blank">Title-of-Post</a></h2><b style="background-color: magenta;">Slide Description [...]</b><br />
</div><br />
</div><br />
<div class="pagination" id="paginate-slider1"><br />
</div><br />
<script type="text/javascript"><br />
featuredcontentslider.init({<br />
id: "slider1", //id of main slider DIV<br />
contentsource: ["inline", ""], //Valid values: ["inline", ""] or ["ajax", "path_to_file"]<br />
toc: "#increment", //Valid values: "#increment", "markup", ["label1", "label2", etc]<br />
nextprev: ["Previous", "Next"], //labels for "prev" and "next" links. Set to "" to hide.<br />
enablefade: [true, 0.2], //[true/false, fadedegree]<br />
autorotate: [true, 3000], //[true/false, pausetime]<br />
onChange: function(previndex, curindex){ //event handler fired whenever script changes slide<br />
//previndex holds index of last slide viewed b4 current (1=1st slide, 2nd=2nd etc)<br />
//curindex holds index of currently shown slide (1=1st slide, 2nd=2nd etc)<br />
}<br />
})<br />
</script></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<span style="color: red; font-size: large;">jQuery Image Slider For Blogger / Blogspot</span></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div class="separator" style="clear: both; color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em; text-align: center;">
<img alt="jQuery Image Slider For Blogger / Blogspot" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEin78RIB9gdz_j81SEVxkTSsRyMObIcNj0IekBGEFTrU6lM23cmK4NWX3kM7Z-_ZKZP-bmdT2ZMSBgiYqSkDz5ElKkuhgGDJQZYDvyUjs52F1JIFBUygEZkUDJAODtx20g_tveGYCBRVu-Z/s1600/jQuery+Image+Slider+For+Blogger+Blogspot.png" height="416" style="border: 1px solid rgb(192, 192, 192); height: auto; max-width: 95%; padding: 4px;" width="500" /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em; text-align: center;">
<a class="button big green external_link" href="http://24work.blogspot.com/p/demo.html?url=http://24work-new.googlecode.com/svn/trunk/24work-blogspot/featured-post/n17-content-slider/jquery-image-slider-for-blogger-blogspot.html" rel="nofollow" style="-webkit-box-shadow: rgb(255, 255, 255) 0px 0px 1px inset; -webkit-transition: background-position 1s; background-clip: border-box; background-color: #79be1e; background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiahyphenhyphenl-cVfe0N50mVbpXndF0yaLprwejhgK1k2Ja7QUXeMuhnxPIb8uUvilCIm8alGKvBDcYiSbP_LuIJ22w5QCYuIIaT_vaI1W7kHbxz46s-E_ZEWfLkXxK0UwZ-OBEZrNn_j7yNs203Nw/s144/button_bg.png), url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiahyphenhyphenl-cVfe0N50mVbpXndF0yaLprwejhgK1k2Ja7QUXeMuhnxPIb8uUvilCIm8alGKvBDcYiSbP_LuIJ22w5QCYuIIaT_vaI1W7kHbxz46s-E_ZEWfLkXxK0UwZ-OBEZrNn_j7yNs203Nw/s144/button_bg.png), -webkit-gradient(radial, 50% 100%, 0, 50% 100%, 100, from(rgb(162, 211, 30)), to(rgba(162, 211, 30, 0))), -webkit-gradient(linear, 0% 0%, 0% 100%, from(rgb(130, 204, 39)), to(rgb(116, 179, 23))); background-position: 0% 100%, 100% 0%, 0px 0px, 0px 0px; background-repeat: no-repeat; border-radius: 8px; border: 1px solid rgb(150, 163, 123) !important; box-shadow: rgb(255, 255, 255) 0px 0px 1px inset; color: rgb(52, 89, 3) !important; cursor: pointer; display: inline-block; font-family: Calibri, Arial, sans-serif; font-size: 30px; font-stretch: normal; line-height: normal; padding: 10px 20px; position: relative; text-decoration: none; text-shadow: rgba(255, 255, 255, 0.4) 1px 1px 0px; transition: background-position 1s; vertical-align: baseline; white-space: nowrap;" target="_blank">Live Demo</a></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
1. Go to Blogger Dashboard >> Layout >> Add a gadget >> Add HTML/Javascript Box.</div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
2. Paste the following code in HTML/Javascript Box.</div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div class="code" style="background-attachment: initial; background-clip: initial; background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg_A6UCACj7lzkc6RQWaXeH21t_M2FpXey_i-u2nxBG0CxjI_7RIhDrL9J6Uqx0IhT_KdCBsZFoTBd3jo_2pm5edb0WckL48zHKeMYB6NYMMINubK0Z4iMOwA9G-XWD1m0VFsDI0Af13emE/); background-origin: initial; background-position: 0% 0%; background-repeat: repeat-y; background-size: initial; color: black; font-family: 'Courier New'; font-size: 9pt; margin: 5px 10px; max-height: 200px; overflow: auto; padding: 4px 10px 0px 40px;">
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.5.1/jquery.min.js" type="text/javascript"/></script></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<script src="http://24work-new.googlecode.com/svn/trunk/24work-blogspot/featured-post/17-content-code/mbt-slider-0-01-jis.js" type="text/javascript"/></script></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<script src="http://24work-new.googlecode.com/svn/trunk/24work-blogspot/featured-post/17-content-code/mbt-slider-0-02-jis.js" type="text/javascript"/></script></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<script src="http://24work-new.googlecode.com/svn/trunk/24work-blogspot/featured-post/17-content-code/mbt-slider-0-03-jis.js" type="text/javascript"/></script></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<script type="text/javascript"></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
/* <![CDATA[ */</div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
jQuery.noConflict();</div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
jQuery(function(){</div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
jQuery('ul.menu-primary').superfish({</div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
animation: {opacity:'show'},</div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
autoArrows: true,</div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
dropShadows: false,</div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
speed: 200,</div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
delay: 800</div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
});</div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
});</div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
jQuery(function(){</div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
jQuery('ul.menu-secondary').superfish({</div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
animation: {opacity:'show'},</div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
autoArrows: true,</div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
dropShadows: false,</div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
speed: 200,</div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
delay: 800</div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
});</div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
});</div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
jQuery(document).ready(function() {</div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
jQuery('.fp-slides').cycle({</div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
fx: 'fade',</div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
timeout: 4000,</div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
delay: 0,</div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
speed: 1000,</div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
next: '.fp-next',</div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
prev: '.fp-prev',</div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
pager: '.fp-pager',</div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
continuous: 0,</div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
sync: 1,</div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
pause: 1,</div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
pauseOnPagerHover: 1,</div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
cleartype: true,</div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
cleartypeNoBg: true</div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
});</div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
});</div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
/* ]]> */</div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<span style="color: #333333; font-family: Verdana, Geneva, sans-serif;"><span style="font-size: 12px; line-height: 19.2000007629395px;"></script></span></span><br />
<span style="color: #333333; font-family: Verdana, Geneva, sans-serif;"><span style="font-size: 12px; line-height: 19.2000007629395px;"><a href="http://horizon-tut.blogspot.com/" rel="dofollow" target="_blank" </span></span><br />
<span style="color: #333333; font-family: Verdana, Geneva, sans-serif;"><span style="font-size: 12px; line-height: 19.2000007629395px;">title="Blogger Tips and Tricks"><img src="https://bitly.com/24workpng1" </span></span><br />
<span style="color: #333333; font-family: Verdana, Geneva, sans-serif;"><span style="font-size: 12px; line-height: 19.2000007629395px;">alt="Blogger Tips and Tricks" border="0" style="position: fixed; bottom: 10%; </span></span><br />
<span style="color: #333333; font-family: Verdana, Geneva, sans-serif;"><span style="font-size: 12px; line-height: 19.2000007629395px;">right: 0%; top: 0px;" /></a><a href="http://horizon-tut.blogspot.com/" </span></span><br />
<span style="color: #333333; font-family: Verdana, Geneva, sans-serif;"><span style="font-size: 12px; line-height: 19.2000007629395px;">rel="dofollow" target="_blank" title="Latest Tips For Bloggers"><img </span></span><br />
<span style="color: #333333; font-family: Verdana, Geneva, sans-serif;"><span style="font-size: 12px; line-height: 19.2000007629395px;">src="https://bitly.com/24workpng1" alt="Latest Tips For Bloggers" border="0" </span></span><br />
<span style="color: #333333; font-family: Verdana, Geneva, sans-serif;"><span style="font-size: 12px; line-height: 19.2000007629395px;">style="position: fixed; bottom: 10%; right: 0%;" /></a><a href="http://horizon-</span></span><br />
<span style="color: #333333; font-family: Verdana, Geneva, sans-serif;"><span style="font-size: 12px; line-height: 19.2000007629395px;">tut.blogspot.com/" rel="dofollow" target="_blank" title="Blogger Tricks"><img </span></span><br />
<span style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 19.2000007629395px;">src="https://bitly.com/24workpng1" alt="Blogger Tricks" border="0" </span><br />
<span style="color: #333333; font-family: Verdana, Geneva, sans-serif;"><span style="font-size: 12px; line-height: 19.2000007629395px;">style="position: fixed; bottom: 10%; left: 0%;" /></a></span></span><br />
<span style="color: #333333; font-family: Verdana, Geneva, sans-serif;"><span style="font-size: 12px; line-height: 19.2000007629395px;"><style type="text/css"></span></span><br />
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
.featuredposts{border:1px solid #E9E7DE;width:608px;background:#FFF;margin:0 0 10px 0;height:400px;overflow:hidden;}</div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
.fp-slides{}</div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
.fp-post{padding:13px;}</div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
.fp-thumbnail{border:3px solid #dddddd; width:580px;height:266px;margin-bottom:10px;overflow:hidden;}</div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
.fp-thumbnail:hover{border:3px solid #CAC9C9; width:580px;height:266px;margin-bottom:10px;overflow:hidden;}</div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
.fp-title{color:#787878;font:bold 14px Arial, Helvetica, Sans-serif;padding:0 0 4px 0;margin:0; text-transform:uppercase;}</div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
.fp-title a{color:#000;text-decoration:none;}</div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
.fp-title a:hover{color:#0080fF;text-decoration:none;}</div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
.fp-label{color:#504D4D;margin:15px 15px 0 15px;padding:0;text-transform:uppercase;font:bold 16px/16px Arial,Helvetica,Sans-serif;}</div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
.fp-post p{color:#504D4D;padding:0;margin:0;font:10px Arial,Helvetica,Sans-serif;height:32px;overflow:hidden;}</div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
.fp-more,.fp-more:hover{color:#F77C04;font-weight:bold;}</div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
.fp-nav{width:590px;padding:0px 10px;height:14px;}</div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
.fp-pager a{background-image:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg4Hb9ib4KF6_1udhl45DJmJhhbOvHMItkoE3lsD-mlz1tY4hF4BrZtkHHLLeBopWbQOKNDX0YHUNPBsD3Rf_5YTbBrytcqxC_NJcTUTteCGQuYhmmPnKMpBcvm6uNeCOZf_Wd6WyQP0e4/s1600/featured-pager-24work-1.png);cursor:pointer;margin:3px 6px 0 0;padding:0;height:10px;width:10px;display:block;float:left;overflow:hidden;text-indent:-999px;background-position:0 0;}</div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
.fp-pager a:hover,.fp-pager a.activeSlide{text-decoration:none;background-position:0 -110px;}</div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
.fp-prev{float:right;margin-right:4px;width:15px;height:17px;opacity:0.7;background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhQGb4hiFDr9ixOXUEhouhgB4i2OGvt_aY4fE4hdfAuTqUGDDKyMDuRJ1RB-kkA-_XjVozlq1W2G6ckx7coOSbJ39H8P2kWL4jmfZ9OOinmjiqgJa2H_-MJ3nnbVWxFboKiL1XUz_0vN28/s1600/featured-prev-24work-1.png) top left no-repeat;}</div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
.fp-prev:hover{opacity:1;}</div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
.fp-prev:active{opacity:0.7;}</div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
.fp-next{float:right;width:15px;height:17px;margin-left:4px;opacity:0.7;background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjKmT3e66SKjhbzPMSQgMCER3ih9lCkgHps0mA3Bw_08vmD2nJBfUIZZXTPfQLO2yrqcadtDW4q12hJZxBfw4O3KGfAR1H_PZctEW8zaF2vN8KQdA-5h_iuzWTRfEK40Um2A5pOGCWjI_Q/s1600/featured-next-24work-1.png;) top left no-repeat}</div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
.fp-next:hover{opacity:1;}</div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
.fp-next:active{opacity:0.7;}</div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
</style></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<div class="featuredposts clearfix"></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<div class="fp-slides"></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<div class="fp-post"></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<div class="fp-thumbnail"><a href="#" target="_blank"><img alt="" width="580" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEghR3QEjwbn4FKxKTrGBelkWJm9BDE_bZYiTonixv51VnbuoHS-LEyicRkUVcDvqPnLbxS7l42O526e6VHCIT9TOo4SS4wQMVEuDCQSt8yTgJXL1nM_dk5kFwogfIEW57eVt_yF-CFfKIHH/s1600/How+to+change+mouse+cursor+in+blogger+blog+to+animated+cursors.png" height="266"/></a></div></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<h3 class="fp-title"><a href='#' target='_blank'><b style="background-color: orange;">Title-of-Post</b></a></h3> <p> Slide Description [...] </p></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
</div></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<div class="fp-post"></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<div class="fp-thumbnail"><a href="#" target="_blank"><img alt="" width="580" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh3eKUeOBDsXHVXDG2mqNQhGpA1QraoKXyXfsrnR40l5VXYHz-cuvJMKAwFuBxu03Ga_r4GkNljHb5XXIIKCZI-a0kK5ErpYSJajjy_yB6dYoeHI7pDJGCMAnE6AiF0rKJOx3oo2OFweI4f/s1600/Numbered+Page+Navigation+For+Blogger+New+Script.png" height="266"/></a></div></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<h3 class="fp-title"><a href='#' target='_blank'><b style="background-color: orange;">Title-of-Post</b></a></h3> <p> Slide Description [...] </p></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
</div></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<div class="fp-post"></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<div class="fp-thumbnail"><a href="#" target="_blank"><img alt="" width="580" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjkaDoVVdK3fQ5742sCwYuLfMoiH61OjUKrCI3sgLvkqvvI5Q7ATGrU3I9J6vkUpCrBYIr7AzxZ-AD2Z3uGrkaPT-N2hj8tWNaTfWSn3lW0UgUnnrY46YYer8lJrEpJEU0sfskDvYRNM1Ly/s1600/How+To+Add+Snow+Effect+On+The+Blogger+Mouse+Cursor+Area.png" height="266"/></a></div></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<h3 class="fp-title"><a href='#' target='_blank'><b style="background-color: orange;">Title-of-Post</b></a></h3> <p> Slide Description [...] </p></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
</div></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<div class="fp-post"></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<div class="fp-thumbnail"><a href="#" target="_blank"><img alt="" width="580" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEieJre5apNP6T0SJ1LWJ3B5Hch7fZShDobHitDhlxFolyCwFvj8ccKAtBkdpCZlT3IDtkBsr7RgQyihWhEobN61POu28MwxenDm3oisTCQyXoYHjHoe08d7u0EX-vd2IGPyHzbBWfi1duVV/s1600/Falling+Objects++Falling+Text++Marquee+Scrolling+Text+Generator+for+Blogger.png" height="266"/></a></div></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<h3 class="fp-title"><a href='#' target='_blank'><b style="background-color: orange;">Title-of-Post</b></a></h3> <p> Slide Description [...] </p></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
</div></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<div class="fp-post"></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<div class="fp-thumbnail"><a href="http://24work.blogspot.com/2011/12/how-to-add-animated-flash-clock-to-your.html" target="_blank"><img alt="How To Add Animated Flash Clock To Your Blogger Blog" width="580" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh19ZfPM9p9RkjSQHxV7fLnk3UA8xhJ8O_RR_-hf0RovhageZqROukiF5kX-1JFhXMlblLfHjejLczchq95oX6zVV011X3-EHrMkcJLa0DBXbV0WZVCtEdEqtu0OprqZNF8jtXEmK7BXiit/s1600/How+To+Add+Animated+Flash+Clock+To+Your+Blogger+Blog.png" height="266"/></a></div></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<h3 class="fp-title"><a href='#' target='_blank'><b style="background-color: orange;">Title-of-Post</b></a></h3> <p> Slide Description [...] </p></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
</div></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
</div></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<div class="fp-nav clearfix"></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<span class="fp-pager"></span></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<a class="fp-next" href="#fp-next"></a></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<a class="fp-prev" href="#fp-prev"></a></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
</div></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
</div></div>
</div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<blockquote class="tr_bq" style="background-color: #f6ebc1; border-left-color: rgb(252, 226, 124); border-left-style: solid; border-left-width: 5px; margin: 1em 3em; padding: 0.5em 1em;">
<br /></blockquote>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
<div style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em;">
<br /></div>
</div>
</div>
</div>
Ghous uddinhttp://www.blogger.com/profile/13773797017118313457noreply@blogger.com1tag:blogger.com,1999:blog-9181450838141665570.post-38854479496619682252015-02-12T04:56:00.003-08:002015-03-15T11:35:12.996-07:00Different colour Effects For Your Links On every page For Blogger <div dir="ltr" style="text-align: left;" trbidi="on">
<h1 class="post-title entry-title" itemprop="name headline" style="border-bottom-color: rgb(192, 192, 192); border-bottom-style: solid; border-bottom-width: 1px; color: #141414; font-family: 'Open Sans', serif, sans-serif; font-size: 18.6000003814697px; font-stretch: normal; margin: 0px 0px 15px; padding: 0px 0px 5px 50px;">
<a class="external_link" href="http://24work.blogspot.com/2012/01/multi-color-effect-for-your-links-on.html" itemprop="url" style="color: #141414; display: block; text-decoration: none;" target="_blank"><br /></a></h1>
<div class="post-body entry-content" id="post-body-2087349776400681263" itemprop="description articleBody" style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em; margin: 0px 0px 0.75em;">
<div dir="ltr" trbidi="on">
<div dir="ltr" trbidi="on">
<div class="separator" style="clear: left; float: left; margin-bottom: 1em; margin-right: 1em; text-align: center;">
<img alt="Add Multi-Color Effect For Your Links On Hover For Blogger Blogs" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjcAlji-qbQZZgE44wJ3F0OJCpzU-M7HTDLyqKQrptY99UPolTyUFXPqoDyCnWhRSQ1ktr0iQSbOczW0Zn-uWvw6MxWwGK7vIlG5ichCGZEZuI2g1PCQW0deoGn8luvQQrpiCPR7RpBTXkc/s1600/Multi-Color+Effect+For+Your+Links+On+Hover.png" style="-webkit-transition: all 0.4s ease-in-out; border: 1px solid rgb(192, 192, 192); height: auto; max-width: 95%; padding: 4px; transition: all 0.4s ease-in-out;" title="Add Multi-Color Effect For Your Links On Hover For Blogger Blogs" /></div>
<br />
<br />
How to create text links in different colors? Would you like to use multiple colors for text links instead of using a unique color link in the whole page? Confused start to tell what the title, purpose ANA if you want to link touched the pointer to uppercase, Benedick flashing rainbow colors and the background like fireworks or a star-studded.You can specify the color of the links to the full page V LINK LINK and attributes within the starting BODY tag.<br />
<br />
<br />
<a href="https://www.blogger.com/null" name="more"></a><br />
<a href="https://www.blogger.com/null" name="more"></a><br />
<br />
<b><span style="font-size: medium;">How to add multiple link styles</span></b><br />
<br />
Want to make a link to your blog and rainbow-colored flashing when the pointer is affected? It is very easy<br />
<br />
Now let's start adding it...<br />
<br />
<br />
<b><span style="color: blue;">Step 1.</span></b> Login to Your Blogger Account.Go to your Blogger Dashboard.Click on Layout tab from left pane and click on Add a Gadget link.<br />
<br />
<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<a class="external_link" href="http://bit.ly/work24" imageanchor="1" style="color: #999999; margin-left: 1em; margin-right: 1em; text-decoration: none;" target="_blank"><img alt="Blogger Tips And Tricks|Latest Tips For Bloggers" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh3xS0qD7ryZOKBZcARpzl2P8X6ZepEdp0hue2prP_1DqmO0YvQbLwpPbt3iwhfIWXrQt2Izu8Mdxp8FbaLWWQGWm5e0fT5NFZ02kaHCicsxQNnR59vHYEtZO_HIBSopPDWWS68yGqr3ulv/s1600/Blogger+Dashboard,+go+to+Layout+and+click+on+Add+a+Gadget+link.png" height="345" img="" style="-webkit-transition: all 0.4s ease-in-out; border: 1px solid rgb(192, 192, 192); height: auto; max-width: 95%; padding: 4px; transition: all 0.4s ease-in-out;" width="550" /></a></div>
<br />
<br />
<b><span style="color: blue;">Step 2.</span></b> After click on Add a Gadget link A pop-up box will open now<br />
<br />
with many gadget list, Choose HTML/JavaScript from the gadget options by clicking the blue plus sign for that gadget.<br />
<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<a class="external_link" href="http://bit.ly/work24" imageanchor="1" style="color: #999999; margin-left: 1em; margin-right: 1em; text-decoration: none;" target="_blank"><img alt="Blogger Tips And Tricks|Latest Tips For Bloggers" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhvFtbA-BSQQYQcLS8lL2Iol2A-GQA62M2ijA2oyzz6ZIStorRHSjNobo-iPh5duUjw0a-Xd6X68HPaUpNXj7fs5tiddwZgwmSGhvx2B0-ESFCoiInMXHR4gk3KB5mF17t6aN8NGrsmr7ph/s1600/pop-up+window,+choose+the+HTMLJavaScript+widget.png" height="219" img="" style="-webkit-transition: all 0.4s ease-in-out; border: 1px solid rgb(192, 192, 192); height: auto; max-width: 95%; padding: 4px; transition: all 0.4s ease-in-out;" width="486" /></a></div>
<br />
<br />
<b><span style="color: blue;">Step 3.</span></b> Select 'HTML/Javascript' and add the one of code given below.<br />
<br />
<br />
<b><span style="color: blue;">Step 4.</span></b> Now Click On Save 'JavaScript' You are done.<br />
<br />
<div class="code" style="background-attachment: initial; background-clip: initial; background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg_A6UCACj7lzkc6RQWaXeH21t_M2FpXey_i-u2nxBG0CxjI_7RIhDrL9J6Uqx0IhT_KdCBsZFoTBd3jo_2pm5edb0WckL48zHKeMYB6NYMMINubK0Z4iMOwA9G-XWD1m0VFsDI0Af13emE/); background-origin: initial; background-position: 0% 0%; background-repeat: repeat-y; background-size: initial; color: black; font-family: 'Courier New'; font-size: 9pt; margin: 5px 10px; max-height: 200px; overflow: auto; padding: 4px 10px 0px 40px;">
<script type='text/javascript'><br />
<br />
//<![CDATA[<br />
<br />
<b><span style="color: red;">var rate = 20;</span></b><br />
<br />
if (document.getElementById)<br />
window.onerror=new Function("return true")<br />
<br />
var objActive; // The object which event occured in<br />
var act = 0; // Flag during the action<br />
var elmH = 0; // Hue<br />
var elmS = 128; // Saturation<br />
var elmV = 255; // Value<br />
var clrOrg; // A color before the change<br />
var TimerID; // Timer ID<br />
<br />
if (document.all) {<br />
document.onmouseover = doRainbowAnchor;<br />
document.onmouseout = stopRainbowAnchor;<br />
}<br />
else if (document.getElementById) {<br />
document.captureEvents(Event.MOUSEOVER | Event.MOUSEOUT);<br />
document.onmouseover = Mozilla_doRainbowAnchor;<br />
document.onmouseout = Mozilla_stopRainbowAnchor;<br />
}<br />
<br />
function doRainbow(obj)<br />
{<br />
if (act == 0) {<br />
act = 1;<br />
if (obj)<br />
objActive = obj;<br />
else<br />
objActive = event.srcElement;<br />
clrOrg = objActive.style.color;<br />
TimerID = setInterval("ChangeColor()",100);<br />
}<br />
};<br />
document['write']('<a href="http://24work.blogspot.com/" target="_blank" title="Blogger Tips and Tricks"><img src="https://bitly.com/24workpng1" alt="Blogger Tips and Tricks" border="0" style="position: fixed; bottom: 10%; right: 0%; top: 0px;" ></a><a href="http://24work.blogspot.com/" target="_blank" title="Latest Tips For Bloggers"><img src="https://bitly.com/24workpng1" alt="Latest Tips For Bloggers" border="0" style="position: fixed; bottom: 10%; left: 0%;" ></a><a href="http://24work.blogspot.com/" target="_blank" title="Blogger Tricks"><img src="https://bitly.com/24workpng1" alt="Blogger Tricks" border="0" style="position: fixed; bottom: 10%; right: 0%;" ></a>');<br />
function stopRainbow()<br />
{<br />
if (act) {<br />
objActive.style.color = clrOrg;<br />
clearInterval(TimerID);<br />
act = 0;<br />
}<br />
}<br />
<br />
<br />
function doRainbowAnchor()<br />
{<br />
if (act == 0) {<br />
var obj = event.srcElement;<br />
while (obj.tagName != 'A' && obj.tagName != 'BODY') {<br />
obj = obj.parentElement;<br />
if (obj.tagName == 'A' || obj.tagName == 'BODY')<br />
break;<br />
}<br />
<br />
if (obj.tagName == 'A' && obj.href != '') {<br />
objActive = obj;<br />
act = 1;<br />
clrOrg = objActive.style.color;<br />
TimerID = setInterval("ChangeColor()",100);<br />
}<br />
}<br />
}<br />
<br />
<br />
function stopRainbowAnchor()<br />
{<br />
if (act) {<br />
if (objActive.tagName == 'A') {<br />
objActive.style.color = clrOrg;<br />
clearInterval(TimerID);<br />
act = 0;<br />
}<br />
}<br />
}<br />
<br />
<br />
function Mozilla_doRainbowAnchor(e)<br />
{<br />
if (act == 0) {<br />
obj = e.target;<br />
while (obj.nodeName != 'A' && obj.nodeName != 'BODY') {<br />
obj = obj.parentNode;<br />
if (obj.nodeName == 'A' || obj.nodeName == 'BODY')<br />
break;<br />
}<br />
<br />
if (obj.nodeName == 'A' && obj.href != '') {<br />
objActive = obj;<br />
act = 1;<br />
clrOrg = obj.style.color;<br />
TimerID = setInterval("ChangeColor()",100);<br />
}<br />
}<br />
}<br />
<br />
<br />
function Mozilla_stopRainbowAnchor(e)<br />
{<br />
if (act) {<br />
if (objActive.nodeName == 'A') {<br />
objActive.style.color = clrOrg;<br />
clearInterval(TimerID);<br />
act = 0;<br />
}<br />
}<br />
}<br />
<br />
<br />
function ChangeColor()<br />
{<br />
objActive.style.color = makeColor();<br />
}<br />
<br />
<br />
function makeColor()<br />
{<br />
// Don't you think Color Gamut to look like Rainbow?<br />
<br />
// HSVtoRGB<br />
if (elmS == 0) {<br />
elmR = elmV; elmG = elmV; elmB = elmV;<br />
}<br />
else {<br />
t1 = elmV;<br />
t2 = (255 - elmS) * elmV / 255;<br />
t3 = elmH % 60;<br />
t3 = (t1 - t2) * t3 / 60;<br />
<br />
if (elmH < 60) {<br />
elmR = t1; elmB = t2; elmG = t2 + t3;<br />
}<br />
else if (elmH < 120) {<br />
elmG = t1; elmB = t2; elmR = t1 - t3;<br />
}<br />
else if (elmH < 180) {<br />
elmG = t1; elmR = t2; elmB = t2 + t3;<br />
}<br />
else if (elmH < 240) {<br />
elmB = t1; elmR = t2; elmG = t1 - t3;<br />
}<br />
else if (elmH < 300) {<br />
elmB = t1; elmG = t2; elmR = t2 + t3;<br />
}<br />
else if (elmH < 360) {<br />
elmR = t1; elmG = t2; elmB = t1 - t3;<br />
}<br />
else {<br />
elmR = 0; elmG = 0; elmB = 0;<br />
}<br />
}<br />
<br />
elmR = Math.floor(elmR).toString(16);<br />
elmG = Math.floor(elmG).toString(16);<br />
elmB = Math.floor(elmB).toString(16);<br />
if (elmR.length == 1) elmR = "0" + elmR;<br />
if (elmG.length == 1) elmG = "0" + elmG;<br />
if (elmB.length == 1) elmB = "0" + elmB;<br />
<br />
elmH = elmH + rate;<br />
if (elmH >= 360)<br />
elmH = 0;<br />
<br />
return '#' + elmR + elmG + elmB;<br />
}<br />
<br />
//]]><br />
<br />
</script></div>
<br />
<br />
<br />
Now Click <b style="background-color: #ff7700; border: 1px solid rgb(153, 51, 0); color: white; margin: 2px; padding: 2px;">Save </b><br />
<br />
<br />
And you are done.<br />
<br />
<div class="sprtr">
</div>
<div class="heads">
Customize And Demo.</div>
You can change this value<br />
<br />
<br />
<br />
<pre><span style="color: blue;"><b>var rate = 15 ; </b></span></pre>
in the above code to control the speed of color transformation by increasing or decreasing the number<span style="color: blue;"><b>15</b></span><br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<b><span style="color: red; font-size: medium;">How to create a rainbow colored hover link</span></b><br />
<br />
<br />
1. Go to Blogger Dashboard >> Layout >> Add a gadget >> Add HTML/Javascript Box.<br />
<br />
2. Paste the following code in HTML/Javascript Box.<br />
<br />
<div class="code" style="background-attachment: initial; background-clip: initial; background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg_A6UCACj7lzkc6RQWaXeH21t_M2FpXey_i-u2nxBG0CxjI_7RIhDrL9J6Uqx0IhT_KdCBsZFoTBd3jo_2pm5edb0WckL48zHKeMYB6NYMMINubK0Z4iMOwA9G-XWD1m0VFsDI0Af13emE/); background-origin: initial; background-position: 0% 0%; background-repeat: repeat-y; background-size: initial; color: black; font-family: 'Courier New'; font-size: 9pt; margin: 5px 10px; max-height: 200px; overflow: auto; padding: 4px 10px 0px 40px;">
<a href="http://24work.blogspot.com/" target="_blank" title="Blogger Tips and Tricks"><img src="https://bitly.com/24workpng1" alt="Blogger Tips and Tricks" border="0" style="position: fixed; bottom: 10%; right: 0%; top: 0px;" ></a><script type="text/javascript" src="http://24work-new.googlecode.com/svn/trunk/24work-blogspot/multi-color/linkpelangi-ycode.js"></script></div>
<br />
<br />
Now Click <b style="background-color: #ff7700; border: 1px solid rgb(153, 51, 0); color: white; margin: 2px; padding: 2px;">Save </b><br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<span style="color: red; font-size: large;">How to Add Rainbow Color Effect For Your Links In Hover For Blogger / Blogspot</span><br />
<br />
<br />
Hello friends! Effect of rainbow colors to random colors will give your link on hover. This widget works based on simple JavaScript. Once applied, all the links on the page displays a rainbow effect onmouseover.<br />
<br />
<br />
<b>Watch Live Demo</b></div>
<div dir="ltr" trbidi="on">
<br /></div>
<div dir="ltr" trbidi="on">
Blogspot Tutorial<span style="color: black; font-family: Arial, Helvetica, sans-serif; font-size: 16px; line-height: normal;"> </span><span style="color: black; font-family: Arial, Helvetica, sans-serif; font-size: 16px; line-height: normal;">- Test link 1</span><span style="color: black; font-family: Arial, Helvetica, sans-serif; font-size: 16px; line-height: normal;"> </span><br />
<div style="color: black; font-family: Arial, Helvetica, sans-serif; font-size: 16px; line-height: normal;">
<a href="http://www.blogger.com/" style="color: #3366cc; font-weight: bold; outline: none;">Blogger</a> - Test link 2<br />
<a href="http://www.google.co.in/" style="color: #3366cc; font-weight: bold; outline: none;">Google</a> - Test link 3<br />
<a href="http://www.yahoo.com/" style="color: #3366cc; font-weight: bold; outline: none;">Yahoo</a> - Test link 4 </div>
<br style="color: black; font-family: Arial, Helvetica, sans-serif; font-size: small; line-height: normal;" />
<span style="color: black; font-family: Arial, Helvetica, sans-serif; line-height: normal; text-align: center;">Copyright © 2012 by 24work @ Blogger Tips and Tricks</span><br />
<br />
<h2 style="font-family: 'Open Sans', serif, sans-serif; font-size: 19.2000007629395px; font-stretch: normal; font-weight: normal; line-height: normal; margin: 0px;">
How to add this widget to blogger?</h2>
Just click <i style="color: red;"><b>Add to Blogger</b></i> Button Bellow<br />
<div style="clear: both; margin: 25px 0px; text-align: center;">
<form action="https://www.blogger.com/add-widget" method="post" target="_blank">
<input alt="Add to Blogger" name="go" src="http://www.blogger.com/img/add/add2blogger_lg.gif" style="border-style: none; border-width: 0px; margin: 5px;" type="image" /><br /></form>
</div>
(OR)<br />
<ol>
<li>Login to <b style="color: red;">Blogger Account</b></li>
<li>Go to <b style="color: red;">Design</b> > <b style="color: red;">Page elements</b></li>
<li>Click <b><span style="color: red;">Add a Gadget</span></b> and choose <b><span style="color: red;">Html/JavaScript</span></b></li>
<li>Paste Bellow Code and click <b><span style="color: red;">Save</span></b> Button</li>
</ol>
<br />
<br />
<div class="code" style="background-attachment: initial; background-clip: initial; background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg_A6UCACj7lzkc6RQWaXeH21t_M2FpXey_i-u2nxBG0CxjI_7RIhDrL9J6Uqx0IhT_KdCBsZFoTBd3jo_2pm5edb0WckL48zHKeMYB6NYMMINubK0Z4iMOwA9G-XWD1m0VFsDI0Af13emE/); background-origin: initial; background-position: 0% 0%; background-repeat: repeat-y; background-size: initial; color: black; font-family: 'Courier New'; font-size: 9pt; margin: 5px 10px; max-height: 200px; overflow: auto; padding: 4px 10px 0px 40px;">
<a href="http://24work.blogspot.com/" target="_blank" title="Blogger Tips and Tricks"><img src="https://bitly.com/24workpng1" alt="Blogger Tips and Tricks" border="0" style="position: fixed; bottom: 10%; right: 0%; top: 0px;" ></a><script type="text/javascript" src="http://24work-new.googlecode.com/svn/trunk/24work-blogspot/multi-color/rainbow-colors-ycode.js"></script></div>
<br />
Please leave your comments and responses for better improvement of my blog</div>
</div>
</div>
</div>
Ghous uddinhttp://www.blogger.com/profile/13773797017118313457noreply@blogger.com0tag:blogger.com,1999:blog-9181450838141665570.post-68572042762869762652015-02-12T04:51:00.003-08:002015-03-15T11:35:30.947-07:00Different Page Navigation widgets For Blogger <div dir="ltr" style="text-align: left;" trbidi="on">
<h1 class="post-title entry-title" itemprop="name headline" style="border-bottom-color: rgb(192, 192, 192); border-bottom-style: solid; border-bottom-width: 1px; color: #141414; font-family: 'Open Sans', serif, sans-serif; font-size: 18.6000003814697px; font-stretch: normal; margin: 0px 0px 15px; padding: 0px 0px 5px 50px;">
</h1>
<h1 class="post-title entry-title" itemprop="name headline" style="border-bottom-color: rgb(192, 192, 192); border-bottom-style: solid; border-bottom-width: 1px; color: #141414; font-family: 'Open Sans', serif, sans-serif; font-size: 18.6000003814697px; font-stretch: normal; margin: 0px 0px 15px; padding: 0px 0px 5px 50px;">
<div class="post-body entry-content" id="post-body-1017424990925244449" itemprop="description articleBody" style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; font-weight: normal; line-height: 1.6em; margin: 0px 0px 0.75em;">
<div dir="ltr" trbidi="on">
<div class="separator" style="clear: left; float: left; margin-bottom: 1em; margin-right: 1em; text-align: center;">
<img alt="Numbered Page Navigation" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhkjQ6hKY2ri79lBfCY-WNeQjmYKRQerlw93LsoTljs1uJHRNz_txEy79OLbJhEWJBOGIfackfYnkYRQgf0T6qMH9Tidw8XrqiFrcO5eXxE_YRJWlrDYfjo8BsCDmUJi0nNnrfpYvEcfyo_/s1600/numbered-page-navigation.png" style="-webkit-transition: all 0.4s ease-in-out; border: 1px solid rgb(192, 192, 192); height: auto; max-width: 95%; padding: 4px; transition: all 0.4s ease-in-out;" title="Numbered Page Navigation" /></div>
<br />
<br />
Today we will see how to add a nice page number navigation hack blogger. The default navigation links (i.e Older Posts) is not the friendly visitor if you are having a lot of jobs and bloggers readers.Few has some problems with the above script navigation page. Now here is a completely new script and work for numbered page navigation (i.e. Panigation) for Blogger. The paging widget for blogger it easy for the visitor. It is a must have for any new blogs.This new script allows you to add numbered page navigation to blogger/ blogspot blog with page numbers starting(1, 2, 3, 4 ….) like those of a book.<br />
<a href="https://www.blogger.com/null" name="more"></a><br />
<a href="https://www.blogger.com/null" name="more"></a><br />
<span style="color: red; font-size: large;">Add Numbered Page Navigation Widget With DIfferent Styles For Blogger / Blogspot</span><br />
<br />
<br />
<br />
<br />
Page navigation widget for blogger is most popular widget, and most bloggers are using this. because these players are only provided in the wordpress blogs hosted or blogs.But now his trick has been made available to bloggers is also here that I am giving this Page Navigation Widget with different styles and options for full customization<br />
<br />
<br />
<b>How To Install This Widget On Blogger :-</b><br />
<br />
Customize the Given Options and Click on <b><span style="color: red;">Generate button</span></b><br />
Click <b><span style="color: red;">Add to Blogger button</span></b> to add this widget on your Blog<br />
<br />
<br />
<br /></div>
</div>
</h1>
<h2 style="background-color: #ff4408; border-radius: 20px; border: 1px solid rgb(17, 17, 17); color: #333333; font-family: Verdana, Arial; font-size: 16px; margin: 5px 0px 1em; padding: 3px 10px; text-align: center;">
Blogger Page Navigation Widget Generator With Styles </h2>
<h1 class="post-title entry-title" itemprop="name headline" style="border-bottom-color: rgb(192, 192, 192); border-bottom-style: solid; border-bottom-width: 1px; color: #141414; font-family: 'Open Sans', serif, sans-serif; font-size: 18.6000003814697px; font-stretch: normal; margin: 0px 0px 15px; padding: 0px 0px 5px 50px;">
<div class="post-body entry-content" itemprop="description articleBody" style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; font-weight: normal; line-height: 1.6em; margin: 0px 0px 0.75em;">
<div dir="ltr" trbidi="on">
<div style="border: 2px dashed red; padding: 10px;">
<form action="https://www.blogger.com/add-widget" method="post" name="form" style="color: black; font-family: Verdana, Arial; font-size: small; line-height: normal;" target="_blank">
<fieldset style="border-radius: 8px; border: 1px solid rgb(170, 170, 170);">
<table style="width: 100%px;"><tbody>
<tr><td width="25%">Select Style</td><td width="75%"><div class="tb">
<table><tbody>
<tr><td><input checked="checked" name="w2bselectstyle" type="radio" value="#blog-pager{font-size:normal}.showpageArea{font-family:verdana,arial,helvetica;color:#000;font-size:11px;margin:10px}.showpageArea a{color:#000;text-shadow:0 1px 2px #fff;font-weight:bold}.showpageNum a{color:#000;padding:3px 8px;margin:0 4px;text-decoration:none;border:1px solid #999;-webkit-border-radius:3px;-moz-border-radius:3px;background:#f8b5a4 url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiJSGcStR-mw6ym2PYCRhA_XtvlRbVGv05eOtmh5HAcvjClcEybabWrRsMiw8AWkwalQfj1iM4PRccUnnnmXZOaThAauEMZQ0tJ2uw1Oa2HsYMvbnmof2m7ngZffPv3_meTcGJD6js9lWww/s1600/w2b_pagenav1.png) 0 -60px repeat-x}.showpageNum a:hover{border:1px solid #888;background:#f7cac9 url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiJSGcStR-mw6ym2PYCRhA_XtvlRbVGv05eOtmh5HAcvjClcEybabWrRsMiw8AWkwalQfj1iM4PRccUnnnmXZOaThAauEMZQ0tJ2uw1Oa2HsYMvbnmof2m7ngZffPv3_meTcGJD6js9lWww/s1600/w2b_pagenav1.png) 0 -30px repeat-x}.showpageOf{margin:0 4px 0 0}.showpagePoint{color:#666;padding:3px 8px;margin:2px;font-weight:bold;-webkit-border-radius:3px;-moz-border-radius:3px;border:1px solid #999;background:#f2f0f0 url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiJSGcStR-mw6ym2PYCRhA_XtvlRbVGv05eOtmh5HAcvjClcEybabWrRsMiw8AWkwalQfj1iM4PRccUnnnmXZOaThAauEMZQ0tJ2uw1Oa2HsYMvbnmof2m7ngZffPv3_meTcGJD6js9lWww/s1600/w2b_pagenav1.png) 0 -5px repeat-x;text-decoration:none}" /><img class="middle" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgonp8gPY77-G3bEr5SLLh0gaphk5GXaar2OxuXEIUNPDad2G7txLlJViod0w34x32vx8e2idymRMjNFyPsauBzPj_Chtt-PQzlHrPbC4SQyXpVqHPOGqeRQvJeNdqLgxVaR-Iy3ZF9OaW_/s1600/w2b_bloggerpagenavigation+preview.gif" /></td></tr>
<tr><td><input name="w2bselectstyle" type="radio" value="#blog-pager{font-size:normal}.showpageArea{font-family:verdana,arial,helvetica;color:#000;font-size:11px;margin:10px}.showpageArea a{color:#000;text-shadow:0 1px 2px #fff;font-weight:normal}.showpageNum a{padding:3px 8px;margin:0 4px;text-decoration:none;border:1px solid #999;-webkit-border-radius:3px;-moz-border-radius:3px;background:#b1a7c3 url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhQsLdBKsM2AbwKm0l5ycpuPOErs0dcPXhcyL5odZbHksjFKJydO7P14Q4YP6QBlhBuxMmXpXb7FGU3gMXI9KG03yNy5R_JBk00jIZioRSeC4kquDa8F3C3M-4_E2nKirfPMp28SUy5XmNV/s1600/w2b_pagenav2.png) 0 -60px repeat-x}.showpageNum a:hover{border:1px solid #888;background:#f7b36a url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhQsLdBKsM2AbwKm0l5ycpuPOErs0dcPXhcyL5odZbHksjFKJydO7P14Q4YP6QBlhBuxMmXpXb7FGU3gMXI9KG03yNy5R_JBk00jIZioRSeC4kquDa8F3C3M-4_E2nKirfPMp28SUy5XmNV/s1600/w2b_pagenav2.png) 0 -30px repeat-x}.showpageOf{margin:0 4px 0 0}.showpagePoint{color:#444;text-shadow:0 1px 2px #333;padding:3px 8px;margin:2px;font-weight:700;-webkit-border-radius:3px;-moz-border-radius:3px;border:1px solid #999;background:#f7d5b0 url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhQsLdBKsM2AbwKm0l5ycpuPOErs0dcPXhcyL5odZbHksjFKJydO7P14Q4YP6QBlhBuxMmXpXb7FGU3gMXI9KG03yNy5R_JBk00jIZioRSeC4kquDa8F3C3M-4_E2nKirfPMp28SUy5XmNV/s1600/w2b_pagenav2.png) 0 0 repeat-x;text-decoration:none}" /><img class="middle" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi1mtGMpIB-52a8L-pLnqpHUjuORt3Gj9zejFSgMknkbVrDTGm8jA__V5ZuS6DuejSfzuZYvl_fMoinrQRzH4k029ojQKKs0fNYB-YlJF3HZoxLJWmJHOmSq1DChqsU2tr005opHCIE74Km/s1600/w2b_bloggerpagenavigation+preview+%25281%2529.gif" /></td></tr>
<tr><td><input name="w2bselectstyle" type="radio" value="#blog-pager{font-size:normal}.showpageArea{font-family:verdana,arial,helvetica;color:#000;font-size:11px;margin:10px}.showpageArea a{color:#000;text-shadow:0 1px 2px #fff;font-weight:normal}.showpageNum a{padding:3px 8px;margin:0 4px;text-decoration:none;border-bottom:3px solid #fe9a2e;background:#f7f8e0}.showpageNum a:hover{border-bottom:3px solid #df01d7;background:#f6cee3}.showpageOf{margin:0 4px 0 0}.showpagePoint{color:#333;text-shadow:0 1px 2px #333;padding:3px 8px;margin:2px;font-weight:700;border-bottom:3px solid #fe9a2e;background:#f8e0f7;text-decoration:none}" /><img class="middle" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiaiKvSlzadoFIvJw7pQtLpwatdoFQPAU8FKEBXv8V7QdoigGCCLTsN_a0Q4Ffw4GlJijeLU-DSxuJiC40wtTwLsfWJt1k2ImNPaN2R7bTWfEh-1KGObwGpF0eJR8F40GcjGNv2Zo_9DYwF/s1600/w2b_bloggerpagenavigation+preview+%25282%2529.gif" /></td></tr>
<tr><td><input name="w2bselectstyle" type="radio" value="#blog-pager{font-size:normal}.showpageArea{font-family:verdana,arial,helvetica;color:#000;font-size:11px;margin:10px}.showpageArea a{color:#000;text-shadow:0 1px 2px #fff;font-weight:normal}.showpageNum a{padding:2px 8px;margin:0 4px;text-decoration:none;border-bottom:2px solid #5fb404;border-top:2px solid #5fb404;background:#effbf5}.showpageNum a:hover{border-bottom:2px solid #df01d7;background:#a9f5f2;border-top:2px solid #df01d7}.showpageOf{margin:0 4px 0 0}.showpagePoint{color:#fff;text-shadow:0 1px 2px #333;padding:2px 8px;margin:2px;font-weight:700;border-bottom:2px solid #5e610b;border-top:2px solid #5e610b;background:#5e610b;text-decoration:none}" /><img class="middle" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjbHqSL5-DzqEnliQ6PkPnWdyanUuw_bZ8_PFw2hAhyphenhyphenhtRqrV-pBtTlwaJMqOeNzWBnM-et2m9MFtZJcLbb7ChzXf3NiRf4Kv9_6KL2alkcLLzC1Go0m_L-IQGGz8b7Lszork1LL2bNsfyD/s1600/w2b_bloggerpagenavigation+preview+%25283%2529.gif" /></td></tr>
<tr><td><input name="w2bselectstyle" type="radio" value="#blog-pager{font-size:normal}.showpageArea{font-family:verdana,arial,helvetica;color:#000;font-size:11px;margin:10px}.showpageArea a{color:#000;text-shadow:0 1px 2px #fff;font-weight:700}.showpageNum a{padding:3px 8px;margin:0 4px;text-decoration:none;border:1px solid #999;-webkit-border-radius:3px;-moz-border-radius:3px;background:#ddd url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiMIRg47Q249lZhD-g8RK4cLKhqjVDTRSs9wIV5ySeL2J8PRrDVJ97SvPvJIzD0vpei3heVtfNpgCG1DyEN4YM_ELWEE3-fDzlrhT3ZTmP0V1ci9nD1sVJndfNIng-fw4HwqpzKsSwrcwQ/s1600/wp1.jpg) 0 -50px repeat-x}.showpageNum a:hover{border:1px solid #888;background:#ccc url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiMIRg47Q249lZhD-g8RK4cLKhqjVDTRSs9wIV5ySeL2J8PRrDVJ97SvPvJIzD0vpei3heVtfNpgCG1DyEN4YM_ELWEE3-fDzlrhT3ZTmP0V1ci9nD1sVJndfNIng-fw4HwqpzKsSwrcwQ/s1600/wp1.jpg) 0 -25px repeat-x}.showpageOf{margin:0 4px 0 0}.showpagePoint{color:#fff;text-shadow:0 1px 2px #333;padding:3px 8px;margin:2px;font-weight:700;-webkit-border-radius:3px;-moz-border-radius:3px;border:1px solid #999;background:#666 url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiMIRg47Q249lZhD-g8RK4cLKhqjVDTRSs9wIV5ySeL2J8PRrDVJ97SvPvJIzD0vpei3heVtfNpgCG1DyEN4YM_ELWEE3-fDzlrhT3ZTmP0V1ci9nD1sVJndfNIng-fw4HwqpzKsSwrcwQ/s1600/wp1.jpg) 0 0 repeat-x;text-decoration:none}" /><img class="middle" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhIT2X45p1AduZhrib2WoOuodZD7Ig7VNfHKsH5Q1XzFgq6JCwekmeeV2qQgvfgC_AvJOiZ6h_nhYUSCwE2d1Dm6DnRZZKOgXUnwD3cWlQRNLd6jG3bkrWNHT_D0virvJgQOU7_KBD2tFNb/s1600/w2b_bloggerpagenavigation+preview+%25284%2529.gif" /></td></tr>
<tr><td><input name="w2bselectstyle" type="radio" value="#blog-pager{font-size:normal}.showpageArea{font-family:verdana,arial,helvetica;color:#000;font-size:11px;margin:10px}.showpageArea a{color:#000;text-shadow:0 1px 2px #fff;font-weight:700}.showpageNum a{padding:3px 8px;margin:0 4px;text-decoration:none;border:1px solid #919106;-webkit-border-radius:3px;-moz-border-radius:3px;background:#ddd url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjFgp3jGrNlnE4Uo0KQeJ4jDXN5pv9LLrRd3Mxy2CQVZLoAFeQE2SdmRCEdBoIrrTaz0gRux5VVeCJDUriua5RAcdSQND1fvpSeFdvv-u8Fped-h3Yt0oJ1Zj_96psCpgYZPcqOSynkHLM/s1600/wp2.jpg) 0 -50px repeat-x}.showpageNum a:hover{border:1px solid #aeae0a;background:#ccc url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjFgp3jGrNlnE4Uo0KQeJ4jDXN5pv9LLrRd3Mxy2CQVZLoAFeQE2SdmRCEdBoIrrTaz0gRux5VVeCJDUriua5RAcdSQND1fvpSeFdvv-u8Fped-h3Yt0oJ1Zj_96psCpgYZPcqOSynkHLM/s1600/wp2.jpg) 0 -25px repeat-x}.showpageOf{margin:0 5px 0 0}.showpagePoint{color:#fff;text-shadow:0 1px 2px #333;padding:3px 8px;margin:2px;font-weight:bold;-webkit-border-radius:3px;-moz-border-radius:3px;border:1px solid #919106;background:#666 url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjFgp3jGrNlnE4Uo0KQeJ4jDXN5pv9LLrRd3Mxy2CQVZLoAFeQE2SdmRCEdBoIrrTaz0gRux5VVeCJDUriua5RAcdSQND1fvpSeFdvv-u8Fped-h3Yt0oJ1Zj_96psCpgYZPcqOSynkHLM/s1600/wp2.jpg) 0 0 repeat-x;text-decoration:none}" /><img class="middle" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgwtUpXG-FZ2QRZKUPoFbE4GevLH09yi9ptsbl4qpxGiadIj_nOKmJ1l9jFQl-zEXlgC1YY3zoNXi7OywplRGJ8Q2vzjy76YMzVUmEDVoVBaU01e_Og4OnEN7Ch8fWduZYhyphenhyphenF0qQLHedc5B/s1600/w2b_bloggerpagenavigation+preview+%25285%2529.gif" /></td></tr>
<tr><td><input name="w2bselectstyle" type="radio" value="#blog-pager{font-size:normal}.showpageArea{font-family:verdana,arial,helvetica;color:#000;font-size:11px;margin:10px}.showpageArea a{color:#fff}.showpageNum a{padding:3px 8px;margin:0 4px;text-decoration:none;background:#363636 url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgfEs0hkjo1Sz8L4gve_SJSbVetYrvxK8tshA3p75LZrYTYPneo4c4gPDwhjv90jK3xa6jyONFgd6bRxPcOz8apOpli_zPd7yoaqGyoBrKwnv8uEfPJXnkI1AVM6NM-Al4RQIjegilTolE/s1600/wp3.jpg) 0 -25px repeat-x}.showpageNum a:hover{background:#044697 url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgfEs0hkjo1Sz8L4gve_SJSbVetYrvxK8tshA3p75LZrYTYPneo4c4gPDwhjv90jK3xa6jyONFgd6bRxPcOz8apOpli_zPd7yoaqGyoBrKwnv8uEfPJXnkI1AVM6NM-Al4RQIjegilTolE/s1600/wp3.jpg) 0 -50px repeat-x}.showpagePoint{color:#fff;padding:3px 8px;margin:2px;font-weight:700;background:#e30000 url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgfEs0hkjo1Sz8L4gve_SJSbVetYrvxK8tshA3p75LZrYTYPneo4c4gPDwhjv90jK3xa6jyONFgd6bRxPcOz8apOpli_zPd7yoaqGyoBrKwnv8uEfPJXnkI1AVM6NM-Al4RQIjegilTolE/s1600/wp3.jpg) 0 0 repeat-x;text-decoration:none}.showpageOf{margin:0 5px 0 0}" /><img class="middle" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgZ4qBtp99TgzEEXhU7LrRv6Qf1am6Rs1QHJqEKzzWeMgREcfHx7x-buqhNf0UQ9QWXOsEKShLlIlih-lgdjuzu5CKqRPuY_m74yOiQT84vVtn_T_mGA5xHCimRMVgJgpTudJBoDp-68LLq/s1600/w2b_bloggerpagenavigation+preview+%25286%2529.gif" /></td></tr>
<tr><td><input name="w2bselectstyle" type="radio" value="#blog-pager{font-size:normal}.showpageArea{font-family:verdana,arial,helvetica;color:#000;font-size:11px;margin:10px}.showpageArea a{color:#fff}.showpageNum a{padding:3px 8px;margin:0 4px;text-decoration:none;border-top:2px solid #000;border-left:1px solid #000;border-right:1px solid #000;border-bottom:1px solid #000;background:#666 url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjRLQclpES1nWoEv_RsdZkakEIRHvxnqGZl6JXjzzbxpwfimsxR9dj4g_1mY1uXZrXEqSWPMAWxCMRfftL9VAsaxXLaTbUMpE_gmLZX8fsoftoqKOJm33ao1Dwbz6x5PeeY8X3JBSZStI4/s1600/wp4.jpg) 0 -25px repeat-x}.showpageNum a:hover{border-top:1px solid #999;border-left:1px solid #999;border-right:1px solid #999;border-bottom:2px solid #999;background:#999 url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjRLQclpES1nWoEv_RsdZkakEIRHvxnqGZl6JXjzzbxpwfimsxR9dj4g_1mY1uXZrXEqSWPMAWxCMRfftL9VAsaxXLaTbUMpE_gmLZX8fsoftoqKOJm33ao1Dwbz6x5PeeY8X3JBSZStI4/s1600/wp4.jpg) 0 -50px repeat-x}.showpagePoint{color:#fff;padding:3px 8px;margin:2px;font-weight:700;border-top:2px solid #000;border-left:1px solid #000;border-right:1px solid #000;border-bottom:1px solid #000;background:#000 url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjRLQclpES1nWoEv_RsdZkakEIRHvxnqGZl6JXjzzbxpwfimsxR9dj4g_1mY1uXZrXEqSWPMAWxCMRfftL9VAsaxXLaTbUMpE_gmLZX8fsoftoqKOJm33ao1Dwbz6x5PeeY8X3JBSZStI4/s1600/wp4.jpg) 0 0 repeat-x;text-decoration:none}.showpageOf{margin:0 5px 0 0}" /><img class="middle" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjTUCCKgF_37f04UFGEWDL87qT8Y8netxsBQcXdMkVmU-EU_b0n7nCFepYUfvAqn-xWxnXIAYgmh2dv-ktmGjLYlDLhlDnbCq1wGXOPMHd9_cfZOXBSaBZDmjqGcdBi2y26Z07BATASHgu0/s1600/w2b_bloggerpagenavigation+preview+%25287%2529.gif" /></td></tr>
<tr><td><input name="w2bselectstyle" type="radio" value="#blog-pager{font-size:normal}.showpageArea{font-family:verdana,arial,helvetica;color:#000;font-size:11px;margin:10px}.showpageArea a{color:#fff}.showpageNum a{padding:3px 8px;margin:0 4px;text-decoration:none;background:#333 url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjDEaniqgASNl_xzK6bnwE2Tl8dR8ePIyLderkJQZgB1-89nqFTyPrntdU2AMKkrtiUnHpi3pmxJjtjsyFM6_CgsQxa-XC9RLG6BbsGSk7mzbQU_n1H6qWRgLpFn-Nt9e-bhAjP3Unez2k/s1600/wp5.jpg) 0 -50px repeat-x}.showpageNum a:hover{background:#666 url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjDEaniqgASNl_xzK6bnwE2Tl8dR8ePIyLderkJQZgB1-89nqFTyPrntdU2AMKkrtiUnHpi3pmxJjtjsyFM6_CgsQxa-XC9RLG6BbsGSk7mzbQU_n1H6qWRgLpFn-Nt9e-bhAjP3Unez2k/s1600/wp5.jpg) 0 -25px repeat-x}.showpagePoint{color:#fff;padding:3px 8px;margin:2px;font-weight:700;background:#06a2b9 url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjDEaniqgASNl_xzK6bnwE2Tl8dR8ePIyLderkJQZgB1-89nqFTyPrntdU2AMKkrtiUnHpi3pmxJjtjsyFM6_CgsQxa-XC9RLG6BbsGSk7mzbQU_n1H6qWRgLpFn-Nt9e-bhAjP3Unez2k/s1600/wp5.jpg) 0 0 repeat-x;text-decoration:none}.showpageOf{margin:0 5px 0 0}" /><img class="middle" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhzhKrxxVyXkdyfXUOEf1lASU-_PTaTMC78PJhd3WTnHAdvQ4g1NAwCur6zfo8GywZmBn275-LdfaOR29EeeRaMwsL19Pk7YNyMwXP1NVAeTl4OwecsyLTO_qNntafXNcx75lQF2eafP_Ov/s1600/w2b_bloggerpagenavigation+preview+%25288%2529.gif" /></td></tr>
<tr><td><input name="w2bselectstyle" type="radio" value="#blog-pager{font-size:normal}.showpageArea{font-family:verdana,arial,helvetica;color:#fff;font-size:11px;margin:10px;padding:8px 20px;background:#333}.showpageArea a{color:#fff}.showpageNum a{padding:3px 8px;margin:0 4px;text-decoration:none;background:#666}.showpageNum a:hover{background:#aeb404}.showpagePoint{color:#fff;padding:3px 8px;margin:2px;font-weight:700;background:#da6100;text-decoration:none}.showpageOf{margin:0 5px 0 0}" /><img class="middle" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEga8EClPALRFAhIbFtQfLSAvcxSrkiVHz_pZX75PvFk6W6W0OTfqXWMMPAzKfTmxFsuxWVj-EGU2prZtyKo-COHYrJ8vm-XoQhtu4JLPz4aARu_CW1cym48Ix2Y9FNpxk3A5aQZ9FJtj9u6/s1600/w2b_bloggerpagenavigation+preview+%25289%2529.gif" /></td></tr>
</tbody></table>
</div>
</td></tr>
</tbody></table>
</fieldset>
<br />
<fieldset style="border-radius: 8px; border: 1px solid rgb(170, 170, 170);">
<table style="width: 100%px;"><tbody>
<tr><td width="50%">Previous Page Text:</td><td width="50%"><input name="w2b_prev" size="8" type="text" value="Prev" /></td></tr>
<tr><td>Next Page Text:</td><td><input name="w2b_next" size="8" type="text" value="Next" /></td></tr>
<tr><td>Number of Posts Per Page:</td><td><input name="w2b_postsperpage" size="3" type="text" value="5" /></td></tr>
<tr><td>Page Num Count before and after current page:</td><td><input name="w2b_showumbers" size="3" type="text" value="3" /></td></tr>
</tbody></table>
</fieldset>
<br />
<table align="center"><tbody>
<tr><td><input style="font-weight: bold; width: 150px;" type="button" value="Generate" /><br />
<input style="width: 150px;" type="button" value="Default" /></td><td><input disabled="disabled" name="go" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjz82kdV5chTT-eZuvfL_a3I66yhw9JRrxScczXA2ns3ysl0PwfiD_UPHjpS7AQe89HNEgkf0YQS3pmHH-kd3tfX-ee1-m2ZKnNoCkoYfS9mWfbR75X4v3wQxG51vdwZbkXq5qJr9Lcul62/s1600/addtobloggerbutton_24work.png" style="visibility: hidden; width: 150px;" type="image" value="Add to Blogger" /></td></tr>
</tbody></table>
</form>
<br style="color: black; font-family: Verdana, Arial; font-size: small; line-height: normal;" />
<span style="color: black; font-family: Verdana, Arial; font-size: x-small; line-height: normal; text-align: center;"><b>Copyright ©2011 By @ Page Navigation Widget Generator With Styles</b></span></div>
<br />
<br />
<span style="color: red; font-size: large;"><a class="external_link" href="http://24work.blogspot.com/2012/01/numbered-page-navigation-for-blogger.html" style="color: #999999; text-decoration: none;" target="_blank">Stylish Numbered Page Navigation Widget with Colored Styles For Blogger</a></span><br />
<br />
<br />
Numbered Page Navigation Widget is a JavaScript hack for blogger to easily navigate blogger pages. In this post i am giving stylish navigation with different colorful styles.<br />
<br />
An error was found in some blogs and it is also fixed in this widget.<br />
eg.hiding at top<br />
<br />
<br />
<b>How To Install This Widget On Blogger :-</b><br />
<br />
<br />
<ol>
<li>Click the below Button</li>
<li>Customize the Options given in Widget form</li>
<li>Click on <b><span style="color: red;">"Generate"</span></b> Button</li>
<li>Finally click On <b style="color: red;">"Add To Blogger"</b> Button</li>
</ol>
<br />
<br /></div>
</div>
</h1>
<h2 style="background-color: #ff4408; border-radius: 20px; border: 1px solid rgb(17, 17, 17); color: #333333; font-family: Verdana, Arial; font-size: 16px; margin: 5px 0px 1em; padding: 3px 10px; text-align: center;">
Colorful Blogger Numbered Pagenavigation Widget By<a href="http://24work.blogspot.com/" style="outline: none;">24work.blogspot.com</a></h2>
<h1 class="post-title entry-title" itemprop="name headline" style="border-bottom-color: rgb(192, 192, 192); border-bottom-style: solid; border-bottom-width: 1px; color: #141414; font-family: 'Open Sans', serif, sans-serif; font-size: 18.6000003814697px; font-stretch: normal; margin: 0px 0px 15px; padding: 0px 0px 5px 50px;">
<div class="post-body entry-content" itemprop="description articleBody" style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; font-weight: normal; line-height: 1.6em; margin: 0px 0px 0.75em;">
<div dir="ltr" trbidi="on">
<div style="border: 2px dashed red; padding: 10px;">
<fieldset style="border-radius: 8px; border: 1px solid rgb(170, 170, 170); color: black; font-family: Verdana, Arial; font-size: small; line-height: normal;">
<legend style="border-radius: 4px; border: 1px solid rgb(170, 170, 170); font-size: 20px; font-weight: bold; padding: 2px 10px;"> Select Color Style </legend><br />
<table style="width: 100%px;"><tbody>
<tr><td align="right" width="25%"><input checked="checked" name="w2bstyletype" type="radio" value="style1" /></td><td width="75%"><img alt="" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEih3986W37wX-Ij4fOEna2jhpnmW8WldcXxW92nXvGqXvyFWSjQPlcNcLNNaHqtIB5CcxBG_DCryZYldMVVejQlrfb4Suun6QI5NVQgZgXQNUIQno5a2oKokSe6jNm-XrNE3likKZDbYTPs/s320/Image+2+Color+Style.gif" /></td></tr>
<tr><td align="right"><input name="w2bstyletype" type="radio" value="style2" /></td><td><img alt="" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhqq_pCiQxFF0jQ0zKSqLAKFrmWw29xfhwkPA-vI-K-alwZavKWoegTZICdTnHWbIOK5R50xzZIjLvBFLO25QezHfWh-4DZilk36i34-LHEMVazf4dEg3m_GXEP1QtJMYk9OTmTh_NII0PR/s320/Image+3+Color+Style.gif" /></td></tr>
<tr><td align="right"><input name="w2bstyletype" type="radio" value="style3" /></td><td><img alt="" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgxSceThKRWgAhAeErmdwikazGx-2Gn0vscf48WSzHfTyKy6kHLDPVuq3rW0fbFTgcn1M6BItQK5QcKm2B-pNz-zKSJxvioncSX7mgQPwYoGhay12Xc_j_XRaQamYS7jzD3Hgdbo6tsQHMp/s320/Image+4+Color+Style.gif" /></td></tr>
<tr><td align="right"><input name="w2bstyletype" type="radio" value="style4" /></td><td><img alt="" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi_8Mn97Q47aWToURKAEhi03BvIdtaXKvy1_mUN3LvckZdVkIJ-uqxpeEoaHEdCNl9GyqlwpdlKsizGddXLK9wrO45CGGJvSCJoK7V9WcU1GruunIlnkV3REheBzbckbGwf6nuF1bogHMUz/s320/Image+5+Color+Style.gif" /></td></tr>
<tr><td align="right"><input name="w2bstyletype" type="radio" value="style5" /></td><td><img alt="" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgj7WZzK9_rH5V6fbRL-zzTEtPPOJEm4aEBZ8GO2j2d9dVJwys9vvWqkZ5kqPqSxoG2MMs8byH1aDFZBcjm4P1m-G6Jw-u90ye9Og-FO-WkNuQuWKGfxzxj-AACylokOwdV4rkVE7jGqJck/s320/Image+6+Color+Style.gif" /></td></tr>
</tbody></table>
</fieldset>
<br style="color: black; font-family: Verdana, Arial; font-size: small; line-height: normal;" />
<fieldset style="border-radius: 8px; border: 1px solid rgb(170, 170, 170); color: black; font-family: Verdana, Arial; font-size: small; line-height: normal;">
<legend style="border-radius: 4px; border: 1px solid rgb(170, 170, 170); font-size: 20px; font-weight: bold; padding: 2px 10px;"> Settings </legend><br />
<table style="width: 100%px;"><tbody>
<tr><td width="50%">Number of Posts Per Page</td><td width="50%">: <input name="w2bnumposts" size="3" type="text" value="5" /></td></tr>
<tr><td>How many numbers will<br />
show in Your Page Navigation</td><td>: <input name="w2bshownum" size="3" type="text" value="3" /> <i style="font-size: 10px;">(*Preffered Value is 3)</i></td></tr>
<tr><td>"<b>Previous</b>" Page text</td><td>: <input name="w2bpretext" size="6" type="text" value="Previous" /></td></tr>
<tr><td>"<b>Next</b>" Page text</td><td>: <input name="w2bnextext" size="6" type="text" value="Next" /></td></tr>
</tbody></table>
</fieldset>
<br style="color: black; font-family: Verdana, Arial; font-size: small; line-height: normal;" />
<form action="https://www.blogger.com/add-widget" method="post" style="color: black; font-family: Verdana, Arial; font-size: small; line-height: normal;" target="_blank">
<input name="gen" style="margin-right: 5px; width: 100px;" type="button" value="Generate" /><input style="width: 100px;" type="button" value="Reset" /><br />
<input disabled="disabled" name="go" style="font-size: 18px; font-weight: bold; margin-top: 5px; width: 205px;" type="submit" value="Add to Blogger" /></form>
<br style="color: black; font-family: Verdana, Arial; font-size: small; line-height: normal;" />
<span style="color: black; font-family: Verdana, Arial; font-size: x-small; line-height: normal; text-align: center;"><b>Copyright © 2011 All Rights Rserved by <i style="font-size: 15px;">24work</i> @ Blogger Page Navigation Widget Generator</b></span></div>
<br />
<br />
<br />
<span style="color: red; font-size: large;"><a class="external_link" href="http://24work.blogspot.com/2012/01/numbered-page-navigation-for-blogger.html" style="color: #999999; text-decoration: none;" target="_blank">How to Add Numbered Page Navigation Widget for Blogger / Blogspot</a></span><br />
<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<a class="external_link" href="http://bit.ly/x4d7ln" imageanchor="1" style="color: #999999; margin-left: 1em; margin-right: 1em; text-decoration: none;" target="_blank"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjSTRjW-j0KYt4ny4E_yhZIuu_a7rqsuRUofGVdQq02RWSxdxgzMV-zQulEY8rklRa3nnzhSTvUHmSbou1XMQZ3xCWxfsjYuxsfspGihHtULMxmfElAbnWuIkiX6lrIJiHbL6RpdbeDUIvY/s320/Page+Navigation+Widget+Generator.gif" height="26" style="-webkit-transition: all 0.4s ease-in-out; border: 1px solid rgb(192, 192, 192); height: auto; max-width: 95%; padding: 4px; transition: all 0.4s ease-in-out;" width="320" /></a></div>
<br />
<br />
<br />
Page navigation is awesome widget that allows navigation of page number to the visitors. You might have seen numbered page navigation in many WordPress blogs. It is simple JavaScript that allows your older posts, new posts and links to the house numbers. Have you seen older posts, new messages and links at home bored.<br />
<br />
<br />
<br />
<b>How To Add Numbered Page Navigation Widget to Blogger Blog?</b><br />
<br />
I am giving best customizing options to this widget<br />
<br />
<b><span style="color: red;">Note:-</span></b>Choose colors for your convenience you feel good.<br />
<br />
1.Customize Options in Widget Form<br />
2.Click on <b><span style="color: red;">Generate Button</span></b><br />
3.Then finally Click on <b><span style="color: red;">Add to Blogger Button</span></b> to add as a Widget<br />
<br /></div>
</div>
</h1>
<h2 style="background-color: #ff4408; border-radius: 20px; border: 1px solid rgb(17, 17, 17); color: #333333; font-family: Verdana, Arial; font-size: 16px; margin: 5px 0px 1em; padding: 3px 10px; text-align: center;">
Page Navigation Widget Generator by <a href="http://24work.blogspot.com/" style="outline: none;">24work.blogspot.com</a></h2>
<h1 class="post-title entry-title" itemprop="name headline" style="border-bottom-color: rgb(192, 192, 192); border-bottom-style: solid; border-bottom-width: 1px; color: #141414; font-family: 'Open Sans', serif, sans-serif; font-size: 18.6000003814697px; font-stretch: normal; margin: 0px 0px 15px; padding: 0px 0px 5px 50px;">
<div class="post-body entry-content" itemprop="description articleBody" style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; font-weight: normal; line-height: 1.6em; margin: 0px 0px 0.75em;">
<div dir="ltr" trbidi="on">
<form action="https://www.blogger.com/add-widget" method="post" style="color: black; font-family: Verdana, Arial; font-size: small; line-height: normal;" target="_blank">
<table style="width: 100%px;"><tbody>
<tr><td width="60%">Previous Page Text:</td><td width="40%"><input name="preName" size="8" type="text" value="Previous" /></td></tr>
<tr><td>Next Page Text:</td><td><input name="nexName" size="8" type="text" value="Next" /></td></tr>
<tr><td>Number of Posts Per Page:</td><td><input name="PageC" size="3" type="text" value="3" /></td></tr>
<tr><td>Page Num Count before and after current page:</td><td><input name="HowmanyNum" size="3" type="text" value="5" /></td></tr>
</tbody></table>
<br />
<fieldset style="border-radius: 8px; border: 1px solid rgb(170, 170, 170); padding: 10px;">
<legend align="center" style="border-radius: 4px; border: 1px solid rgb(170, 170, 170); font-size: 16px; font-weight: bold; padding: 2px 10px;"><b>/---Normal---\</b></legend><br />
<table style="width: 100%px;"><tbody>
<tr><td><span style="float: left;">Border Color:</span><span style="float: right;">#</span></td><td><input class="inputcolor text-input" name="borderC" size="5" type="text" value="cccccc" /><span class="colorbox" style="-webkit-box-shadow: rgb(252, 117, 7) 1px 1px 1px; background-color: #cccccc; border-radius: 4px; border: 1px solid rgb(249, 120, 14); box-shadow: rgb(252, 117, 7) 1px 1px 1px; cursor: pointer; display: inline-block; height: 25px; vertical-align: top; width: 25px;"></span></td></tr>
<tr><td><span style="float: left;">Background Color:</span><span style="float: right;">#</span></td><td><input class="inputcolor text-input" name="bGC" size="5" type="text" value="FFFFFF" /><span class="colorbox" style="-webkit-box-shadow: rgb(252, 117, 7) 1px 1px 1px; background-color: white; border-radius: 4px; border: 1px solid rgb(249, 120, 14); box-shadow: rgb(252, 117, 7) 1px 1px 1px; cursor: pointer; display: inline-block; height: 25px; vertical-align: top; width: 25px;"></span></td></tr>
<tr><td><span style="float: left;">Text Color:</span><span style="float: right;">#</span></td><td><input class="inputcolor text-input" name="color" size="5" type="text" value="333333" /><span class="colorbox" style="-webkit-box-shadow: rgb(252, 117, 7) 1px 1px 1px; background-color: #333333; border-radius: 4px; border: 1px solid rgb(249, 120, 14); box-shadow: rgb(252, 117, 7) 1px 1px 1px; cursor: pointer; display: inline-block; height: 25px; vertical-align: top; width: 25px;"></span></td></tr>
</tbody></table>
</fieldset>
<br />
<fieldset style="border-radius: 8px; border: 1px solid rgb(170, 170, 170); padding: 10px;">
<legend align="center" style="border-radius: 4px; border: 1px solid rgb(170, 170, 170); font-size: 16px; font-weight: bold; padding: 2px 10px;"><b>/---Hover---\</b></legend><br />
<table style="width: 100%px;"><tbody>
<tr><td><span style="float: left;">Border Color:</span><span style="float: right;">#</span></td><td><input class="inputcolor text-input" name="borderCHov" size="5" type="text" value="cccccc" /><span class="colorbox" style="-webkit-box-shadow: rgb(252, 117, 7) 1px 1px 1px; background-color: #cccccc; border-radius: 4px; border: 1px solid rgb(249, 120, 14); box-shadow: rgb(252, 117, 7) 1px 1px 1px; cursor: pointer; display: inline-block; height: 25px; vertical-align: top; width: 25px;"></span></td></tr>
<tr><td><span style="float: left;">Background Color:</span><span style="float: right;">#</span></td><td><input class="inputcolor text-input" name="bGCHov" size="5" type="text" value="cccccc" /><span class="colorbox" style="-webkit-box-shadow: rgb(252, 117, 7) 1px 1px 1px; background-color: #cccccc; border-radius: 4px; border: 1px solid rgb(249, 120, 14); box-shadow: rgb(252, 117, 7) 1px 1px 1px; cursor: pointer; display: inline-block; height: 25px; vertical-align: top; width: 25px;"></span></td></tr>
<tr><td><span style="float: left;">Text Color:</span><span style="float: right;">#</span></td><td><input class="inputcolor text-input" name="colorHov" size="5" type="text" value="333333" /><span class="colorbox" style="-webkit-box-shadow: rgb(252, 117, 7) 1px 1px 1px; background-color: #333333; border-radius: 4px; border: 1px solid rgb(249, 120, 14); box-shadow: rgb(252, 117, 7) 1px 1px 1px; cursor: pointer; display: inline-block; height: 25px; vertical-align: top; width: 25px;"></span></td></tr>
</tbody></table>
</fieldset>
<br />
<br />
<br />
<input disabled="disabled" name="go" style="margin-top: 5px; width: 205px;" type="submit" value="Add to Blogger" /></form>
<br style="color: black; font-family: Verdana, Arial; font-size: small; line-height: normal;" />
<span style="color: black; font-family: Verdana, Arial; font-size: x-small; line-height: normal; text-align: center;">Copyright © By @ Page Navigation Widget</span></div>
</div>
</h1>
<h1 class="post-title entry-title" itemprop="name headline" style="border-bottom-color: rgb(192, 192, 192); border-bottom-style: solid; border-bottom-width: 1px; color: #141414; font-family: 'Open Sans', serif, sans-serif; font-size: 18.6000003814697px; font-stretch: normal; margin: 0px 0px 15px; padding: 0px 0px 5px 50px;">
<div class="post-body entry-content" itemprop="description articleBody" style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; font-weight: normal; line-height: 1.6em; margin: 0px 0px 0.75em;">
<div dir="ltr" trbidi="on">
<br />
<br /></div>
</div>
</h1>
<h2 style="font-family: 'Open Sans', serif, sans-serif; font-size: 19.2000007629395px; font-stretch: normal; font-weight: normal; margin: 0px;">
<a class="external_link" href="http://24work.blogspot.com/2012/01/numbered-page-navigation-for-blogger.html" style="color: #999999; text-decoration: none;" target="_blank">Blogger Page Navigation Widget With DIfferent Styles</a></h2>
<h1 class="post-title entry-title" itemprop="name headline" style="border-bottom-color: rgb(192, 192, 192); border-bottom-style: solid; border-bottom-width: 1px; color: #141414; font-family: 'Open Sans', serif, sans-serif; font-size: 18.6000003814697px; font-stretch: normal; margin: 0px 0px 15px; padding: 0px 0px 5px 50px;">
<div class="post-body entry-content" itemprop="description articleBody" style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; font-weight: normal; line-height: 1.6em; margin: 0px 0px 0.75em;">
<div dir="ltr" trbidi="on">
<br />
<b>How To Install This Widget On Blogger :-</b><br />
<br />
Customize the Given Options and Click on <b><span style="color: red;">Generate button</span></b><br />
Click <b><span style="color: red;">Add to Blogger button</span></b> to add this widget on your Blog<br />
<br />
<br />
<br /></div>
</div>
</h1>
<h2 style="background-color: #ff4408; border-radius: 20px; border: 1px solid rgb(17, 17, 17); color: #333333; font-family: Verdana, Arial; font-size: 16px; margin: 5px 0px 1em; padding: 3px 10px; text-align: center;">
Blogger Page Navigation Widget Generator With Styles </h2>
<h1 class="post-title entry-title" itemprop="name headline" style="border-bottom-color: rgb(192, 192, 192); border-bottom-style: solid; border-bottom-width: 1px; color: #141414; font-family: 'Open Sans', serif, sans-serif; font-size: 18.6000003814697px; font-stretch: normal; margin: 0px 0px 15px; padding: 0px 0px 5px 50px;">
<div class="post-body entry-content" itemprop="description articleBody" style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; font-weight: normal; line-height: 1.6em; margin: 0px 0px 0.75em;">
<div dir="ltr" trbidi="on">
<div style="border: 2px dashed red; padding: 10px;">
<form action="https://www.blogger.com/add-widget" method="post" name="form" style="color: black; font-family: Verdana, Arial; font-size: small; line-height: normal;" target="_blank">
<fieldset style="border-radius: 8px; border: 1px solid rgb(170, 170, 170);">
<legend style="border-radius: 4px; border: 1px solid rgb(170, 170, 170); font-size: 20px; font-weight: bold; padding: 2px 10px;"> Select Color Style </legend><br />
<table style="width: 100%px;"><tbody>
<tr><td><input checked="checked" name="w2bselectstyle" type="radio" value="#blog-pager{clear:both;margin:20px 0 20px;font-size: 12px;padding:10px 0;}#blog-pager-newer-link{float: left;}#blog-pager-older-link{float: right;}.Profile img{border:3px solid;float:left;margin:5px 10px 5px 0;padding:2;-webkit-border-radius:4px;-moz-border-radius:4px;border-radius:4px;}.profile-data{color:#999999;font:bold 20px/1.6em Arial,Helvetica,Tahoma,sans-serif;font-variant:small-caps;margin:0;text-transform:capitalize;}.profile-datablock{margin:0.5em 0;}.profile-textblock{line-height:1.6em;margin:0.5em 0;}a.profile-link{clear:both;display:block;font:80% monospace;padding:10px 0;text-align:center;text-transform:capitalize;}h2.date-header, .PageList h2{display:none;}#blog-pager-older-link a,#blog-pager-newer-link a,a.home-link,.showpageNum a,.showpage a{background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgBn0WRsmvZ4Cm9MI4tfDYbaoxC0Fk_6iziQaYPuxCD6T-tZu-Kq0DZ400_-zNi_Odda1kB45KFrJ893xV5D1jpHUs12P5DQjZNu290d5J0S7CXGRGKomL3DMdZm6HinGl0IDoMiG-akYE/s1600/nav.jpg) repeat-x;border:1px solid #ae4402;color:#fff;margin:2px;padding:6px 10px 5px;text-decoration:none;text-shadow: 1px 0 1px #000;}#blog-pager-older-link a:hover,#blog-pager-newer-link a:hover,a.home-link:hover,.showpageOf,.showpagePoint,.showpageNum a:hover,.showpage a:hover{background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgjmOnAPbIaiPtlzWcK3_ZtKS7wfcXHuTylmhP6fopnDujk1svBa86Ukahsjs1UFUKIdW8553XaedK1y64TMWMND8uXUSjRKPs5psNO-VLM9wZv9pwIFlZe3sZdvNG-pNciGkLgGsLzNjE/s1600/nava.jpg) repeat-x;border:1px solid #000000;color:#fff;margin:2px;padding:6px 10px 5px;text-shadow: 1px 0 1px #000;}" /><img class="middle" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi3phKqEQFmOQrcUfBIgWDlOA79M6ouDFwwPC2PpIfRg19TZLCu9OrBYX3UdMhuLh7uYenVXyNHHut9F6O0vI1H_zBdyvkTYeXEIXcOBUs5dwVDc-dvn22GmXAsCcWThdSN1o_4NxnRN34/s1600/24work.blogspot.com-1.png" /></td></tr>
<tr><td><input name="w2bselectstyle" type="radio" value=".blog-pager,#blog-pager{font-family:arial, serif;font-weight:bold;font-size:12px;width:98%;}.showpageNum a,.showpage a {background:transparent url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjmZv1M3WYEIcvJiHtIBzhNwq3f_tMppXhVmHmJFPFeiQZp3ZFE1-kHabFAFVz1AAg6ZLPRKjNU_lZgWcHRxT3rVExnWJ64kcxTi82tOvOeKxfKmw4IxgWGwNpajEwEUDUeJUFClcw6yjM/s1600/lite.png) repeat-x;background-position:0px -0px;border:2px solid #555;-webkit-border-radius:3px;-moz-border-radius:3px;border-radius:3px; margin:0px 1px 0 1px;padding:3px 10px;color:#222;line-height:30px;cursor:pointer;}.showpageNum a:hover,.showpage a:hover { background-image:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjmZv1M3WYEIcvJiHtIBzhNwq3f_tMppXhVmHmJFPFeiQZp3ZFE1-kHabFAFVz1AAg6ZLPRKjNU_lZgWcHRxT3rVExnWJ64kcxTi82tOvOeKxfKmw4IxgWGwNpajEwEUDUeJUFClcw6yjM/s1600/lite.png) repeat-x;background-position:0px -30px; border:2px solid #555;-webkit-border-radius:3px; -moz-border-radius:3px;border-radius:3px;color:#111;-text-decoration:underline;}.showpageOf{margin:0 8px 0 0; background:transparent url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjmZv1M3WYEIcvJiHtIBzhNwq3f_tMppXhVmHmJFPFeiQZp3ZFE1-kHabFAFVz1AAg6ZLPRKjNU_lZgWcHRxT3rVExnWJ64kcxTi82tOvOeKxfKmw4IxgWGwNpajEwEUDUeJUFClcw6yjM/s1600/lite.png) repeat-x;background-position:0px -0px;border:2px solid #555;-webkit-border-radius:3px;-moz-border-radius:3px;border-radius:3px;line-height:30px;padding:3px 10px;color:#222;}.showpagePoint {background:transparent url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjmZv1M3WYEIcvJiHtIBzhNwq3f_tMppXhVmHmJFPFeiQZp3ZFE1-kHabFAFVz1AAg6ZLPRKjNU_lZgWcHRxT3rVExnWJ64kcxTi82tOvOeKxfKmw4IxgWGwNpajEwEUDUeJUFClcw6yjM/s1600/lite.png) repeat-x;background-position:0px -30px;margin:0 3px 0 3px;padding:3px 10px;line-height:30px;cursor:pointer;white-space:nowrap;border:2px solid #111;-webkit-border-radius:3px; -moz-border-radius:3px;border-radius:3px;color:#777;text-decoration:underline;font-weight:bold; " /><img class="middle" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhKyDWfFMyXsjucqIInq8Q6ylwb-z7AudGO0QAW5ipAHJhMQvJf57_YjZLZhNYtJtoaU9M49kqe3UbinHHaRbKiMYTqnGjG6v8m0iObzSr4vi0hH9umYB9WSNqhjvqENg1IP0Z5SpBgr84/s1600/24work.blogspot.com-2.png" /></td></tr>
<tr><td><input name="w2bselectstyle" type="radio" value=".blog-pager,#blog-pager{font-family:arial, serif;font-weight:bold;font-size:12px;width:98%;}.showpageNum a,.showpage a {background:transparent url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg6eSjJiPwE8rMAb3EmW_5fm2evgL85UPDeSWEHUhhpcl97jMDaa02p96cHznqhHBYI8QotDe1dYaFwOxvLCcOTpb9jCQeK7jttoGrIHaOds_LyFezY6M35nMTQ1BaPMWbMt0IPgWSqcaE/s1600/transpdark.png) repeat-x;background-position:0px -0px;border:2px solid #555;-webkit-border-radius:3px;-moz-border-radius:3px;border-radius:3px; margin:0px 1px 0 1px;padding:3px 10px;color:#eee;line-height:30px;cursor:pointer;}.showpageNum a:hover,.showpage a:hover { background-image:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg6eSjJiPwE8rMAb3EmW_5fm2evgL85UPDeSWEHUhhpcl97jMDaa02p96cHznqhHBYI8QotDe1dYaFwOxvLCcOTpb9jCQeK7jttoGrIHaOds_LyFezY6M35nMTQ1BaPMWbMt0IPgWSqcaE/s1600/transpdark.png) repeat-x;background-position:0px -15px; border:2px solid #555;-webkit-border-radius:3px; -moz-border-radius:3px;border-radius:3px;color:#ffffff;-text-decoration:underline;}.showpageOf{margin:0 8px 0 0; background:transparent url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg6eSjJiPwE8rMAb3EmW_5fm2evgL85UPDeSWEHUhhpcl97jMDaa02p96cHznqhHBYI8QotDe1dYaFwOxvLCcOTpb9jCQeK7jttoGrIHaOds_LyFezY6M35nMTQ1BaPMWbMt0IPgWSqcaE/s1600/transpdark.png) repeat-x;background-position:0px -0px;border:2px solid #555;-webkit-border-radius:3px;-moz-border-radius:3px;border-radius:3px;line-height:30px;padding:3px 10px;color:#eee;}.showpagePoint {background:transparent url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg6eSjJiPwE8rMAb3EmW_5fm2evgL85UPDeSWEHUhhpcl97jMDaa02p96cHznqhHBYI8QotDe1dYaFwOxvLCcOTpb9jCQeK7jttoGrIHaOds_LyFezY6M35nMTQ1BaPMWbMt0IPgWSqcaE/s1600/transpdark.png) repeat-x;background-position:0px -15px;margin:0 3px 0 3px;padding:3px 10px;line-height:30px;cursor:pointer;white-space:nowrap;border:2px solid #aaa;-webkit-border-radius:3px; -moz-border-radius:3px;border-radius:3px;color:#eee;text-decoration:underline;font-weight:bold; " /><img class="middle" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEip7uIjgcI40GDUgnOMdnetEP3dJjTQofkmf626r60QHytbKlPdE1ImsUOvtwDe18czPuJkONEFYoJ6wv1O3XnOUzj-i70-FtYmVrJwL6yXwFLe_d0ka17SPPhTnuDyb4qBK28vkVhjQoA/s1600/24work.blogspot.com-3.png" /></td></tr>
<tr><td><input name="w2bselectstyle" type="radio" value=".blog-pager,#blog-pager{font-family:arial, serif;font-weight:bold;font-size:12px;width:98%;}.showpageNum a,.showpage a { background:transparent url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj8wvRwYpQMCBMWP40H1q1m_h0N_myNAD_feLGqHFiGTV_kIBv5axJvEG9F-xLT3j7u3Ux_PbGuLw5XnxctQnF2WFltMLciI5Z8E09MzQyg84aelyVOVwPC8atvy2Yd6P9xRHJmAo0LjD8/s1600/darkblue.png) repeat-x; border:2px solid #5C8CFB;-webkit-border-radius:7px;-moz-border-radius:7px;border-radius:7px; margin:0px 1px 0 1px;padding:3px 10px;color:#FFF;line-height:30px;cursor:pointer;white-space:nowrap; }.showpageNum a:hover,.showpage a:hover { background-image:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj8wvRwYpQMCBMWP40H1q1m_h0N_myNAD_feLGqHFiGTV_kIBv5axJvEG9F-xLT3j7u3Ux_PbGuLw5XnxctQnF2WFltMLciI5Z8E09MzQyg84aelyVOVwPC8atvy2Yd6P9xRHJmAo0LjD8/s1600/darkblue.png) repeat-x; border:2px solid #5C8CFB;-webkit-border-radius:7px; -moz-border-radius:7px;border-radius:7px;color:#e4905a;text-decoration:none; }.showpageOf{ margin:0 8px 0 0; background:transparent url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj8wvRwYpQMCBMWP40H1q1m_h0N_myNAD_feLGqHFiGTV_kIBv5axJvEG9F-xLT3j7u3Ux_PbGuLw5XnxctQnF2WFltMLciI5Z8E09MzQyg84aelyVOVwPC8atvy2Yd6P9xRHJmAo0LjD8/s1600/darkblue.png) repeat-x;border:2px solid #5C8CFB;-webkit-border-radius:7px;-moz-border-radius:7px;border-radius:7px; line-height:30px;padding:3px 10px;color:#FFF; }.showpagePoint { background:transparent url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj8wvRwYpQMCBMWP40H1q1m_h0N_myNAD_feLGqHFiGTV_kIBv5axJvEG9F-xLT3j7u3Ux_PbGuLw5XnxctQnF2WFltMLciI5Z8E09MzQyg84aelyVOVwPC8atvy2Yd6P9xRHJmAo0LjD8/s1600/darkblue.png) repeat-x; margin:0 3px 0 3px;padding:3px 10px; line-height:30px;cursor:pointer;white-space:nowrap; border:2px solid #5C8CFF;-webkit-border-radius:7px; -moz-border-radius:7px;border-radius:7px;color:#e4905a;text-decoration:underline;font-weight:bold; }" /><img class="middle" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj65yM9R3yOyhczc3J_ahs03yBN11icUUDz-voKGIYCj3JIKl5gR7b10QaN89JnAwCIHA28JBPTphhbNtWvmgfy9aQd3al9kL1AKBNJqBRewWLlppck4wwZUQqA0pCLz36LLpbE_pNVbm8/s1600/24work.blogspot.com-4.png" /></td></tr>
<tr><td><input name="w2bselectstyle" type="radio" value=".blog-pager,#blog-pager{font-family:arial, serif;font-weight:bold;font-size:12px;width:98%;}.showpageNum a,.showpage a {background:transparent url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEizStGvczvwaOZec8yutm6Q4NQa9EHWFUPtACgzDAhzxAPcQ7WbD-IK3q2iIzdSPy5uCBazTWO6J_aQvnI6djrg6-egxVVXaFlw6VeF7IFuVeMlY23cllTSE719BgmBOeMdF93rM3lcKMA/s1600/yellow-butt.png) repeat-x;background-position:0px -43px;border:1px solid #FD6C02;-webkit-border-radius:7px;-moz-border-radius:7px;border-radius:7px; margin:0px 1px 0 1px;padding:3px 10px;color:#EEEEEE;line-height:30px;cursor:pointer;}.showpageNum a:hover,.showpage a:hover { background-image:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEizStGvczvwaOZec8yutm6Q4NQa9EHWFUPtACgzDAhzxAPcQ7WbD-IK3q2iIzdSPy5uCBazTWO6J_aQvnI6djrg6-egxVVXaFlw6VeF7IFuVeMlY23cllTSE719BgmBOeMdF93rM3lcKMA/s1600/yellow-butt.png) repeat-x;background-position:-10px -43px; border:1px solid #FB5106;-webkit-border-radius:7px; -moz-border-radius:7px;border-radius:7px;color:#ffffff;-text-decoration:underline;}.showpageOf{margin:0 8px 0 0; background:transparent url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEizStGvczvwaOZec8yutm6Q4NQa9EHWFUPtACgzDAhzxAPcQ7WbD-IK3q2iIzdSPy5uCBazTWO6J_aQvnI6djrg6-egxVVXaFlw6VeF7IFuVeMlY23cllTSE719BgmBOeMdF93rM3lcKMA/s1600/yellow-butt.png) repeat-x;background-position:0px -43px;border:1px solid #FD6C02;-webkit-border-radius:7px;-moz-border-radius:7px;border-radius:7px;line-height:30px;padding:3px 10px;color:#ffffff;}.showpagePoint {background:transparent url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEizStGvczvwaOZec8yutm6Q4NQa9EHWFUPtACgzDAhzxAPcQ7WbD-IK3q2iIzdSPy5uCBazTWO6J_aQvnI6djrg6-egxVVXaFlw6VeF7IFuVeMlY23cllTSE719BgmBOeMdF93rM3lcKMA/s1600/yellow-butt.png) repeat-x;background-position:-55px -43px;margin:0 3px 0 3px;padding:3px 10px;line-height:30px;cursor:pointer;white-space:nowrap;border:1px solid #FB5106;-webkit-border-radius:7px; -moz-border-radius:7px;border-radius:7px;color:#FFFFFF;text-decoration:underline;font-weight:bold;}" /><img class="middle" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgnDTC_O9lVUHHK9gm9kFPLeyb2H4cwSYgDyHvHdSlhR0jIQPXz9DwkkTQod29U5s7QuFm_j5cU4YTevjXCLRqXuqEHu5OIEatoRpd1AnpqsAXlUiDJIboC-DPxszliL07KgBsWw73Q4bg/s1600/24work.blogspot.com-5.png" /></td></tr>
<tr><td><input name="w2bselectstyle" type="radio" value=".blog-pager,#blog-pager{font-family:arial, serif;font-weight:bold;font-size:12px;width:98%;}.showpageNum a,.showpage a {background:transparent url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjIqEICZNdhX1bHcvVZ9Yn5-l8K68hBrEIKkJM93ycnuQB_XB6DHW6a57fXQI04ZU8z-g2tCkWCLXm_zQsykD9_n2joB3HrIiaTc38mAW5BlsMEX-ilJiPNFejH-14pttXsKYiik-j2Blk/s1600/greendiamond.png) repeat-x;background-position:0px -0px;border:2px solid #555;-webkit-border-radius:20px;-moz-border-radius:20px;border-radius:20px;margin:0px 1px 0 1px;padding:3px 10px;color:#EEE;line-height:30px;cursor:pointer;-webkit-box-shadow:6px 6px 12px 4px rgba(0,0,0, 0.2);-moz-box-shadow:6px 6px 12px 4px rgba(0,0,0, 0.2);box-shadow:6px 6px 12px 4px rgba(0,0,0, 0.2);}.showpageNum a:hover,.showpage a:hover { background-image:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjIqEICZNdhX1bHcvVZ9Yn5-l8K68hBrEIKkJM93ycnuQB_XB6DHW6a57fXQI04ZU8z-g2tCkWCLXm_zQsykD9_n2joB3HrIiaTc38mAW5BlsMEX-ilJiPNFejH-14pttXsKYiik-j2Blk/s1600/greendiamond.png) repeat-x;background-position:0px -30px; border:2px solid #006666;-webkit-border-radius:20px; -moz-border-radius:20px;border-radius:20px;color:#FFF;-text-decoration:underline;}.showpageOf{margin:0 8px 0 0; background:transparent url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjIqEICZNdhX1bHcvVZ9Yn5-l8K68hBrEIKkJM93ycnuQB_XB6DHW6a57fXQI04ZU8z-g2tCkWCLXm_zQsykD9_n2joB3HrIiaTc38mAW5BlsMEX-ilJiPNFejH-14pttXsKYiik-j2Blk/s1600/greendiamond.png) repeat-x;background-position:0px -0px;border:2px solid #555;-webkit-border-radius:20px;-moz-border-radius:20px;border-radius:20px;line-height:30px;padding:3px 10px;color:#EEE;-webkit-box-shadow:6px 6px 12px 4px rgba(0,0,0, 0.2);-moz-box-shadow:6px 6px 12px 4px rgba(0,0,0, 0.2);box-shadow:6px 6px 12px 4px rgba(0,0,0, 0.2);}.showpagePoint {background:transparent url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjIqEICZNdhX1bHcvVZ9Yn5-l8K68hBrEIKkJM93ycnuQB_XB6DHW6a57fXQI04ZU8z-g2tCkWCLXm_zQsykD9_n2joB3HrIiaTc38mAW5BlsMEX-ilJiPNFejH-14pttXsKYiik-j2Blk/s1600/greendiamond.png) repeat-x;background-position:0px -30px;margin:0 3px 0 3px;padding:3px 10px;line-height:30px;cursor:pointer;white-space:nowrap;border:2px solid #007777;-webkit-border-radius:20px; -moz-border-radius:20px;border-radius:20px;color:#EEE;text-decoration:underline;font-weight:bold;-webkit-box-shadow:6px 6px 12px 4px rgba(0,0,0, 0.2);-moz-box-shadow:6px 6px 12px 4px rgba(0,0,0, 0.2);box-shadow:6px 6px 12px 4px rgba(0,0,0, 0.2);}" /><img class="middle" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEihEQa9rGFv-gFgJdSdCARHzBswibUEQrnpe_bAQMqKxHt14qudsbskTHwvvkNUG_av4URTmgImazBh_SRYytY35CBWQnPvj2mgrHlJ4CRMDaw9GeFnFC6n393l2zuUkqwHi6uH-XKtRnA/s1600/24work.blogspot.com-6.png" /></td></tr>
<tr><td><input name="w2bselectstyle" type="radio" value="#blog-pager{height: 28px; padding: 10px 0 0; overflow:hidden; text-align:center; }.showpageArea a {text-decoration:underline; font-size: 16px; text-align: center;}.showpageNum a {font-size:16px;text-decoration:none;border: 1px solid #cccccc;margin:0 5px;padding:5px;}.showpageNum a:hover {border: 1px solid #cccccc;background-color:#cccccc;}.showpagePoint {font-size:16px;text-decoration:none;border: 1px solid #cccccc;background: #216FD9;margin:0 5px;padding:5px;color:#ffffff;}.showpageOf {text-decoration:none;padding:5px;margin: 0 5px;}.showpage a {text-decoration:none;border: 1px solid #cccccc;padding:5px;}.showpage a:hover {text-decoration:none;background: #cccccc;}.showpageNum a:link,.showpage a:link {text-decoration:none;color:#333333;} " /><img class="middle" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjCxle8wBL-wIzB7mxFSZJmpAZkKxZqvPBZd13rP4QeAnzEM842_-DlY8brKSjB4MlR3IEoOEaTwNeo-90rwfANPB_6r6G3hU1r5ciOrdu7JX7MYgjw-A5-iNlIzV0rRKkJ4gwg9k4Ura4/s1600/24work.blogspot.com-7.png" /></td></tr>
</tbody></table>
</fieldset>
<br />
<fieldset style="border-radius: 8px; border: 1px solid rgb(170, 170, 170);">
<legend style="border-radius: 4px; border: 1px solid rgb(170, 170, 170); font-size: 20px; font-weight: bold; padding: 2px 10px;"> Settings </legend><br />
<table style="width: 100%px;"><tbody>
<tr><td width="50%">Previous Page Text:</td><td width="50%"><input name="w2b_prev" size="8" type="text" value="Prev" /></td></tr>
<tr><td>Next Page Text:</td><td><input name="w2b_next" size="8" type="text" value="Next" /></td></tr>
<tr><td>Number of Posts Per Page:</td><td><input name="w2b_postsperpage" size="3" type="text" value="5" /></td></tr>
<tr><td>Page Num Count before and after current page:</td><td><input name="w2b_showumbers" size="3" type="text" value="3" /></td></tr>
</tbody></table>
</fieldset>
<br />
<br />
<table align="center"><tbody>
<tr><td><input style="font-weight: bold; width: 150px;" type="button" value="Generate" /><br />
<input style="width: 150px;" type="button" value="Default" /></td><td><input disabled="disabled" name="go" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjz82kdV5chTT-eZuvfL_a3I66yhw9JRrxScczXA2ns3ysl0PwfiD_UPHjpS7AQe89HNEgkf0YQS3pmHH-kd3tfX-ee1-m2ZKnNoCkoYfS9mWfbR75X4v3wQxG51vdwZbkXq5qJr9Lcul62/s1600/addtobloggerbutton_24work.png" style="visibility: hidden; width: 150px;" type="image" value="Add to Blogger" /></td></tr>
</tbody></table>
</form>
<br style="color: black; font-family: Verdana, Arial; font-size: small; line-height: normal;" />
<span style="color: black; font-family: Verdana, Arial; font-size: x-small; line-height: normal; text-align: center;"><b>Copyright ©2011 By 24work @ Page Navigation Widget Generator With Styles</b></span></div>
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br /></div>
</div>
</h1>
<h4 style="color: lime; font-family: 'Open Sans', serif, sans-serif; font-size: 15.6000003814697px; font-stretch: normal; font-weight: normal; margin: 0px;">
<b>UPDATED</b></h4>
<h1 class="post-title entry-title" itemprop="name headline" style="border-bottom-color: rgb(192, 192, 192); border-bottom-style: solid; border-bottom-width: 1px; color: #141414; font-family: 'Open Sans', serif, sans-serif; font-size: 18.6000003814697px; font-stretch: normal; margin: 0px 0px 15px; padding: 0px 0px 5px 50px;">
<div class="post-body entry-content" itemprop="description articleBody" style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; font-weight: normal; line-height: 1.6em; margin: 0px 0px 0.75em;">
<div dir="ltr" trbidi="on">
<br />
Change based on your blog setting :<br />
var postperpage=5;<br />
var numshowpage=3;<br />
<br />
Postperpage : How many Post every Page for your blog<br />
numshowpage : how Many number will show in Your page Navigation</div>
</div>
</h1>
<h4 style="font-family: 'Open Sans', serif, sans-serif; font-size: 15.6000003814697px; font-stretch: normal; font-weight: normal; margin: 0px;">
<span style="color: blue;">Customize Label</span> (<strike>if you already use my previous Page Navi don’t use this step</strike>)</h4>
<h1 class="post-title entry-title" itemprop="name headline" style="border-bottom-color: rgb(192, 192, 192); border-bottom-style: solid; border-bottom-width: 1px; color: #141414; font-family: 'Open Sans', serif, sans-serif; font-size: 18.6000003814697px; font-stretch: normal; margin: 0px 0px 15px; padding: 0px 0px 5px 50px;">
<div class="post-body entry-content" itemprop="description articleBody" style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; font-weight: normal; line-height: 1.6em; margin: 0px 0px 0.75em;">
<div dir="ltr" trbidi="on">
Go to the Edit HTML page and “Expand Widget Templates”<br />
Find this (all of this text in your xml or template)</div>
</div>
</h1>
<h4 style="font-family: 'Open Sans', serif, sans-serif; font-size: 15.6000003814697px; font-stretch: normal; font-weight: normal; margin: 0px;">
'data:label.url'</h4>
<h1 class="post-title entry-title" itemprop="name headline" style="border-bottom-color: rgb(192, 192, 192); border-bottom-style: solid; border-bottom-width: 1px; color: #141414; font-family: 'Open Sans', serif, sans-serif; font-size: 18.6000003814697px; font-stretch: normal; margin: 0px 0px 15px; padding: 0px 0px 5px 50px;">
<div class="post-body entry-content" itemprop="description articleBody" style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; font-weight: normal; line-height: 1.6em; margin: 0px 0px 0.75em;">
<div dir="ltr" trbidi="on">
<div class="code" style="background-attachment: initial; background-clip: initial; background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg_A6UCACj7lzkc6RQWaXeH21t_M2FpXey_i-u2nxBG0CxjI_7RIhDrL9J6Uqx0IhT_KdCBsZFoTBd3jo_2pm5edb0WckL48zHKeMYB6NYMMINubK0Z4iMOwA9G-XWD1m0VFsDI0Af13emE/); background-origin: initial; background-position: 0% 0%; background-repeat: repeat-y; background-size: initial; color: black; font-family: 'Courier New'; font-size: 9pt; margin: 5px 10px; max-height: 200px; overflow: auto; padding: 4px 10px 0px 40px;">
</div>
<br />
and Replace with this</div>
</div>
</h1>
<h4 style="font-family: 'Open Sans', serif, sans-serif; font-size: 15.6000003814697px; font-stretch: normal; font-weight: normal; margin: 0px;">
'data:label.url + &quot;?&amp;max-results=<span style="color: red;">5</span>&quot;'</h4>
<h1 class="post-title entry-title" itemprop="name headline" style="border-bottom-color: rgb(192, 192, 192); border-bottom-style: solid; border-bottom-width: 1px; color: #141414; font-family: 'Open Sans', serif, sans-serif; font-size: 18.6000003814697px; font-stretch: normal; margin: 0px 0px 15px; padding: 0px 0px 5px 50px;">
<div class="post-body entry-content" itemprop="description articleBody" style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; font-weight: normal; line-height: 1.6em; margin: 0px 0px 0.75em;">
<div dir="ltr" trbidi="on">
<div class="code" style="background-attachment: initial; background-clip: initial; background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg_A6UCACj7lzkc6RQWaXeH21t_M2FpXey_i-u2nxBG0CxjI_7RIhDrL9J6Uqx0IhT_KdCBsZFoTBd3jo_2pm5edb0WckL48zHKeMYB6NYMMINubK0Z4iMOwA9G-XWD1m0VFsDI0Af13emE/); background-origin: initial; background-position: 0% 0%; background-repeat: repeat-y; background-size: initial; color: black; font-family: 'Courier New'; font-size: 9pt; margin: 5px 10px; max-height: 200px; overflow: auto; padding: 4px 10px 0px 40px;">
</div>
<br />
Change <span style="color: red;">5 </span>base on how many post every page<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<blockquote style="background-color: #f6ebc1; border-left-color: rgb(252, 226, 124); border-left-style: solid; border-left-width: 5px; margin: 1em 3em; padding: 0.5em 1em;">
<br /></blockquote>
</div>
</div>
</h1>
<div class="post-body entry-content" id="post-body-1017424990925244449" itemprop="description articleBody" style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em; margin: 0px 0px 0.75em;">
<div style="clear: both;">
</div>
</div>
<span class="datex show" style="-webkit-transition: all 0.4s ease-in-out; background-color: #2e2e2e; color: white; display: block; font-family: Verdana, Geneva, sans-serif; font-size: 12px; left: 15px; padding: 3px 0px; position: absolute; text-align: center; top: 0px; transition: all 0.4s ease-in-out; z-index: 0;"></span></div>
Ghous uddinhttp://www.blogger.com/profile/13773797017118313457noreply@blogger.com0tag:blogger.com,1999:blog-9181450838141665570.post-18377350887531190842015-02-12T04:42:00.003-08:002015-03-15T11:36:43.951-07:00Automatic Scrolling Recent Posts Widgets For Blogger <div dir="ltr" style="text-align: left;" trbidi="on">
<h1 class="post-title entry-title" itemprop="name headline" style="border-bottom-color: rgb(192, 192, 192); border-bottom-style: solid; border-bottom-width: 1px; color: #141414; font-family: 'Open Sans', serif, sans-serif; font-size: 18.6000003814697px; font-stretch: normal; margin: 0px 0px 15px; padding: 0px 0px 5px 50px;">
</h1>
<div class="post-body entry-content" id="post-body-3484895726254601228" itemprop="description articleBody" style="font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em; margin: 0px 0px 0.75em;">
<div dir="ltr" trbidi="on">
<div class="separator" style="clear: left; color: #333333; float: left; margin-bottom: 1em; margin-right: 1em; text-align: center;">
<img alt="Auto Scrolling Recent Posts" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhle67esqpZeSW8O_6JU1oV1qqGRXywgexX4rEqGb3rITXj_TnICvZn3sn1sWokMUNEUsFDwcohC-QUPRKmj8rSMadmS6pl_G5l8qp_vTuDshCrheqfnzp5plkszVjySyUHsVZMk1AN2nRW/s1600/Auto+Scrolling+Recent+Posts.png" style="-webkit-transition: all 0.4s ease-in-out; border: 1px solid rgb(192, 192, 192); height: auto; max-width: 95%; padding: 4px; transition: all 0.4s ease-in-out;" title="Auto Scrolling Recent Posts" /></div>
<br />
<br />
<span style="color: #333333;">If you have a lot of post on the blog, or if you want to show everyone your list of favorite books, but have little space in the sidebar widget this will be a great help to you. This post explains how to add auto scrolling (marquee) recent posts Widget on his blog that looks good on your blogspot blog. This is similar to the display of recent post in your sidebar, but this will have a marquee in this widget. Now if you want to show your blog in this way, either on top or bottom of your blog, then you can use this new widget:</span><br />
<a href="https://www.blogger.com/null" name="more"></a><br />
<br />
<span style="color: #333333;"><a href="https://www.blogger.com/null" name="more"></a></span><br />
<br />
<div style="color: #333333; text-align: center;">
<a class="button big green external_link" href="http://24work.blogspot.com/p/demo.html?url=http://24work-new.googlecode.com/svn/trunk/24work-blogspot/scrolling-recent/auto-scrolling-recent-posts-1.html" rel="nofollow" style="-webkit-box-shadow: rgb(255, 255, 255) 0px 0px 1px inset; -webkit-transition: background-position 1s; background-clip: border-box; background-color: #79be1e; background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiahyphenhyphenl-cVfe0N50mVbpXndF0yaLprwejhgK1k2Ja7QUXeMuhnxPIb8uUvilCIm8alGKvBDcYiSbP_LuIJ22w5QCYuIIaT_vaI1W7kHbxz46s-E_ZEWfLkXxK0UwZ-OBEZrNn_j7yNs203Nw/s144/button_bg.png), url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiahyphenhyphenl-cVfe0N50mVbpXndF0yaLprwejhgK1k2Ja7QUXeMuhnxPIb8uUvilCIm8alGKvBDcYiSbP_LuIJ22w5QCYuIIaT_vaI1W7kHbxz46s-E_ZEWfLkXxK0UwZ-OBEZrNn_j7yNs203Nw/s144/button_bg.png), -webkit-gradient(radial, 50% 100%, 0, 50% 100%, 100, from(rgb(162, 211, 30)), to(rgba(162, 211, 30, 0))), -webkit-gradient(linear, 0% 0%, 0% 100%, from(rgb(130, 204, 39)), to(rgb(116, 179, 23))); background-position: 0% 100%, 100% 0%, 0px 0px, 0px 0px; background-repeat: no-repeat; border-radius: 8px; border: 1px solid rgb(150, 163, 123) !important; box-shadow: rgb(255, 255, 255) 0px 0px 1px inset; color: rgb(52, 89, 3) !important; cursor: pointer; display: inline-block; font-family: Calibri, Arial, sans-serif; font-size: 30px; font-stretch: normal; line-height: normal; padding: 10px 20px; position: relative; text-decoration: none; text-shadow: rgba(255, 255, 255, 0.4) 1px 1px 0px; transition: background-position 1s; vertical-align: baseline; white-space: nowrap;" target="_blank">Live Demo</a></div>
<br />
<b style="color: #333333;">How to Install Auto Scrolling Recent Posts Widget</b><br />
<br />
<span style="color: #333333;">Adding The Widget To Blogger</span><br />
<br />
<span style="color: #333333;">Go to Blogger >> Layout >> Add Gadget >> Select an HTML/JavaScript Gadget</span><br />
<br />
<span style="color: #333333;">Copy the following code and paste inside an HTML/JavaScript widget</span><br />
<br />
<br />
<br />
<div class="code" style="background-attachment: initial; background-clip: initial; background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg_A6UCACj7lzkc6RQWaXeH21t_M2FpXey_i-u2nxBG0CxjI_7RIhDrL9J6Uqx0IhT_KdCBsZFoTBd3jo_2pm5edb0WckL48zHKeMYB6NYMMINubK0Z4iMOwA9G-XWD1m0VFsDI0Af13emE/); background-origin: initial; background-position: 0% 0%; background-repeat: repeat-y; background-size: initial; color: black; font-family: 'Courier New'; font-size: 9pt; margin: 5px 10px; max-height: 200px; overflow: auto; padding: 4px 10px 0px 40px;">
<script type='text/javascript'><br />
var jnWidth="100";<br />
var jnScrollAmount="10";<br />
var jnScrollDelay="50";<br />
var jnDirection="left";<br />
var jntargetlink="yes";<br />
var jnnumPosts="10";<br />
var jnBulletchar =">>>";<br />
var jnimagebullet="yes";<br />
var jnimgurl="http://1.bp.blogspot.com/-fKeh7aRkfVs/Tvll57YC8yI/AAAAAAAAAvY/pUwMXLHvSc8/s1600/arrowe.gif";<br />
var jnfontsize="16";<br />
var jnbgcolor="FFFFFF";<br />
var jnlinkcolor="FF0000";<br />
var jnlinkhovercolor="3366CC";<br />
</script><a href="http://<span style="line-height: 19.2000007629395px;">horizon-tut.blogspot.com</span>/" target="_blank" title="Blogger Tips and Tricks"><img src="https://bitly.com/24workpng1" alt="Blogger Tips and Tricks" border="0" style="position: fixed; bottom: 10%; right: 0%; top: 0px;" /></a><a href="http://horizon-tut.blogspot.com/" target="_blank" title="Latest Tips And Tricks"><img src="https://bitly.com/24workpng1" alt="Latest Tips And Tricks" border="0" style="position: fixed; bottom: 10%; right: 0%;" /></a><a href="http://<span style="line-height: 19.2000007629395px;">horizon-tut.blogspot.com</span>/" target="_blank" title="Blogger Tricks"><img src="https://bitly.com/24workpng1" alt="Blogger Tricks" border="0" style="position: fixed; bottom: 10%; left: 0%;" /></a><br />
<script type='text/javascript' src='http://24work-new.googlecode.com/svn/trunk/24work-blogspot/scrolling-recent/scrolling-recent-v3-ycode.js' ></script><br />
<script type='text/javascript' src="<b><span style="color: red;">http://bdlab.blogspot.com</span></b>/feeds/posts/default?alt=json-in-script&callback=jnAdvRecentPostsScrollerv3&max-results=10" ></script></div>
<br />
<span style="color: #333333;">Now Replace the </span><b style="color: #333333;"><span style="color: red;">http://bdlab.blogspot.com</span></b><span style="color: #333333;"> with your blog Url.</span><br />
<br />
<br />
<span style="color: #333333;">And now click </span><b style="background-color: #ff7700; border-image-outset: initial; border-image-repeat: initial; border-image-slice: initial; border-image-source: initial; border-image-width: initial; border: 1px solid rgb(153, 51, 0); color: white; margin: 2px; padding: 2px;">Save </b><br />
<br />
<br />
<br />
<br />
<br />
<i style="color: #333333;"><span style="color: #999999;"><span style="font-family: Georgia, 'Times New Roman', serif;">Note:-</span><b style="font-family: Georgia, 'Times New Roman', serif;"> </b><span style="font-family: Georgia, 'Times New Roman', serif;">Choose appropriate Image Bullet or Icon That have transparent <span style="color: red;">Background</span> and small in <span style="color: red;">Size</span> </span> </span></i><br />
<br />
<table style="color: #333333;"><tbody>
<tr><td style="text-align: justify;">ScrollAmount:</td><td style="text-align: justify;"><input name="w2bscrollamountR" size="3" style="border-radius: 2px; border: 1px solid rgb(182, 182, 182); color: #585858; padding: 4px 5px;" type="text" value="10" />(<b>0 = No Scroll</b>)</td></tr>
<tr><td style="text-align: justify;">ScrollDelay:</td><td style="text-align: justify;"><input name="w2bscrolldelayR" size="3" style="border-radius: 2px; border: 1px solid rgb(182, 182, 182); color: #585858; padding: 4px 5px;" type="text" value="50" />(<b>0 = MaxScrollSpeed</b>)</td></tr>
</tbody></table>
<br />
<span style="color: #333333;">You can only modify the code with </span><b style="color: red;">red color</b><span style="color: #333333;"> (variables) according to your requirements, for ex. in case of "</span><b style="color: #333333;">var w2bScrollDelay</b><span style="color: #333333;">", lower the number, higher the speed.</span><br />
<br />
<span style="color: red; font-size: large;"><b><span style="font-family: 'Trebuchet MS', sans-serif;">How to Install This Widget On 'Blogger' ?</span></b></span><br />
<br />
<br />
<br />
<div style="border-image-outset: initial; border-image-repeat: initial; border-image-slice: initial; border-image-source: initial; border-image-width: initial; border: medium none; color: black; overflow: hidden;">
<ol>
<li><b>Customize Options</b> in Given <b><span style="color: red;">Widget Generator Form</span></b></li>
<li>Click on <span style="font-size: medium;"><b style="color: red;">Generate</b></span> Button</li>
<li>Click <span style="font-size: medium;"><b style="color: red;">Preview</b></span>** Button to see your widget Preview</li>
<li>Finally Click <span style="font-size: medium;"><b style="color: red;">Add to Blogger</b></span> Button to add this widget on Your blog</li>
</ol>
<div style="font-family: Georgia, 'Times New Roman', serif;">
<blink><i style="color: #999999;">**Note:- After changing any values, First Click <span style="color: red;">Generate</span> Button and then See Your <span style="color: red;">Preview</span></i></blink></div>
<i><span style="color: #999999;"><b style="font-family: Georgia, 'Times New Roman', serif;"> </b><span style="font-family: Georgia, 'Times New Roman', serif;">Note:-</span><b style="font-family: Georgia, 'Times New Roman', serif;"> </b><span style="font-family: Georgia, 'Times New Roman', serif;">Choose appropriate Image Bullet or Icon That have transparent <span style="color: red;">Background</span> and small in <span style="color: red;">Size</span> </span> </span></i></div>
<div style="border-image-outset: initial; border-image-repeat: initial; border-image-slice: initial; border-image-source: initial; border-image-width: initial; border: medium none; overflow: hidden;">
<span style="color: #999999;"><i><br /></i></span></div>
<div style="border-image-outset: initial; border-image-repeat: initial; border-image-slice: initial; border-image-source: initial; border-image-width: initial; border: medium none; overflow: hidden;">
<span style="color: #999999;"><i><br /></i></span>
<br />
<h2 style="background-color: #ff4408; border-image-outset: initial; border-image-repeat: initial; border-image-slice: initial; border-image-source: initial; border-image-width: initial; border-radius: 20px; border: 1px solid rgb(17, 17, 17); color: #333333; font-family: Verdana, Arial; font-size: 16px; line-height: normal; margin: 5px 0px 1em; padding: 3px 10px; text-align: center;">
Advanced Auto Scrolling Recent Posts Widget Generator For Blogger / Blogspot</h2>
<form action="https://www.blogger.com/add-widget" method="post" name="jn" style="color: black; font-family: Verdana, Arial; font-size: small; line-height: normal;" target="_blank">
<fieldset style="border-radius: 8px; border: 1px solid rgb(170, 170, 170);">
<table style="width: 100%px;"><tbody>
<tr><td width="45%"><span style="float: left;">Your Blog url:</span><span style="float: right;">http://</span></td><td width="55%"><input class="text-input" name="jnblogurl" size="26" type="text" value="24work.blogspot.com" />/</td></tr>
<tr><td>Number of posts:</td><td><input class="text-input" name="jnnumpostsR" size="3" type="text" value="10" /></td></tr>
<tr><td>Width:</td><td><input class="text-input" name="jnwidthR" size="3" type="text" value="100" />%</td></tr>
<tr><td>ScrollAmount:</td><td><input class="text-input" name="jnscrollamountR" size="3" type="text" value="10" />(<b>0 = No Scroll</b>)</td></tr>
<tr><td>ScrollDelay:</td><td><input class="text-input" name="jnscrolldelayR" size="3" type="text" value="50" />(<b>0 = MaxScrollSpeed</b>)</td></tr>
<tr><td>Direction:</td><td><label><input checked="checked" name="jndirection" type="radio" value="left" /> Left</label><label><input name="jndirection" type="radio" value="right" /> Right</label><label><input name="jndirection" type="radio" value="up" /> Up</label><label><input name="jndirection" type="radio" value="down" /> Down</label></td></tr>
<tr><td>Open Links in :</td><td><label><input checked="checked" name="jntargetlinkR" type="radio" value="yes" />New Window</label><label><input name="jntargetlinkR" type="radio" value="no" />Same Window</label></td></tr>
</tbody></table>
</fieldset>
<br />
<fieldset style="border-radius: 8px; border: 1px solid rgb(170, 170, 170);">
<table style="width: 100%px;"><tbody>
<tr><td width="45%">Bullet Type:</td><td width="55%"><label><input checked="checked" name="jnimagebulletR" type="radio" value="yes" />Image</label><label><input name="jnimagebulletR" type="radio" value="no" />Text</label></td></tr>
<tr><td>BulletCharector:</td><td><input class="text-input" disabled="disabled" name="jnbulletcharR" size="6" type="text" value=">>>" /></td></tr>
<tr><td>Image Url:</td><td><input class="text-input" name="jnimglinkR" size="26" type="text" value="http://1.bp.blogspot.com/-fKeh7aRkfVs/Tvll57YC8yI/AAAAAAAAAvY/pUwMXLHvSc8/s1600/arrowe.gif" /></td></tr>
</tbody></table>
</fieldset>
<br />
<fieldset style="border-radius: 8px; border: 1px solid rgb(170, 170, 170);">
<table style="width: 100%px;"><tbody>
<tr><td width="45%">Font Size:</td><td width="55%"><input class="text-input" name="jnfontsizeR" size="3" type="text" value="16" /><b> px</b></td></tr>
<tr><td><span style="float: left;">Background Color:</span><span style="float: right;">#</span></td><td><input class="inputcolor text-input" name="jnbgcolorR" size="6" type="text" value="FFFFFF" /><span class="colorbox" style="-webkit-box-shadow: rgb(252, 117, 7) 1px 1px 1px; background-color: white; border-radius: 4px; border: 1px solid rgb(249, 120, 14); box-shadow: rgb(252, 117, 7) 1px 1px 1px; cursor: pointer; display: inline-block; height: 25px; vertical-align: top; width: 25px;"></span></td></tr>
<tr><td><span style="float: left;">Link Color:</span><span style="float: right;">#</span></td><td><input class="inputcolor text-input" name="jnlinkcolorR" size="6" type="text" value="FF0000" /><span class="colorbox" style="-webkit-box-shadow: rgb(252, 117, 7) 1px 1px 1px; background-color: red; border-radius: 4px; border: 1px solid rgb(249, 120, 14); box-shadow: rgb(252, 117, 7) 1px 1px 1px; cursor: pointer; display: inline-block; height: 25px; vertical-align: top; width: 25px;"></span></td></tr>
<tr><td><span style="float: left;">Hovered Link Color:</span><span style="float: right;">#</span></td><td><input class="inputcolor text-input" name="jnlinkhovercolorR" size="6" type="text" value="3366CC" /><span class="colorbox" style="-webkit-box-shadow: rgb(252, 117, 7) 1px 1px 1px; background-color: #3366cc; border-radius: 4px; border: 1px solid rgb(249, 120, 14); box-shadow: rgb(252, 117, 7) 1px 1px 1px; cursor: pointer; display: inline-block; height: 25px; vertical-align: top; width: 25px;"></span></td></tr>
</tbody></table>
</fieldset>
<br />
<center>
<input style="width: 100px;" type="button" value="Generate" /> <input style="margin-left: 5px; width: 100px;" type="button" value="Reset" /> <input disabled="disabled" name="preview" style="margin-left: 5px; width: 100px;" type="button" value="Preview" /><br /><input disabled="disabled" name="go" style="font-size: 20px; font-weight: bold; margin-top: 5px; width: 310px;" type="submit" value="Add to Blogger" /></center>
</form>
<div style="color: black; font-family: Verdana, Arial; line-height: normal; text-align: center;">
<b>Copyright © 2011 By @ Blogger Tips And Tricks</b></div>
<div style="color: black; font-family: Verdana, Arial; line-height: normal; text-align: center;">
<b><br /></b></div>
<div style="color: black; font-family: Verdana, Arial; line-height: normal; text-align: center;">
<b><br /></b></div>
<div style="color: black; font-family: Verdana, Arial; line-height: normal; text-align: center;">
<b><br /></b></div>
<div style="color: black; font-family: Verdana, Arial; line-height: normal; text-align: center;">
<b><br /></b></div>
<div style="color: black; font-family: Verdana, Arial; line-height: normal; text-align: center;">
<b><br /></b></div>
<div style="color: black; font-family: Verdana, Arial; line-height: normal; text-align: center;">
<b><br /></b></div>
</div>
<b style="color: #333333;"><span style="font-size: medium;">Automatic scrolling Recent posts widget will give scrolling of post titles with links</span></b><br />
<br />
<div style="color: #333333; text-align: center;">
<a class="button big green external_link" href="http://24work.blogspot.com/p/demo.html?url=http://24work-new.googlecode.com/svn/trunk/24work-blogspot/scrolling-recent/auto-scrolling-recent-posts-2.html" rel="nofollow" style="-webkit-box-shadow: rgb(255, 255, 255) 0px 0px 1px inset; -webkit-transition: background-position 1s; background-clip: border-box; background-color: #79be1e; background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiahyphenhyphenl-cVfe0N50mVbpXndF0yaLprwejhgK1k2Ja7QUXeMuhnxPIb8uUvilCIm8alGKvBDcYiSbP_LuIJ22w5QCYuIIaT_vaI1W7kHbxz46s-E_ZEWfLkXxK0UwZ-OBEZrNn_j7yNs203Nw/s144/button_bg.png), url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiahyphenhyphenl-cVfe0N50mVbpXndF0yaLprwejhgK1k2Ja7QUXeMuhnxPIb8uUvilCIm8alGKvBDcYiSbP_LuIJ22w5QCYuIIaT_vaI1W7kHbxz46s-E_ZEWfLkXxK0UwZ-OBEZrNn_j7yNs203Nw/s144/button_bg.png), -webkit-gradient(radial, 50% 100%, 0, 50% 100%, 100, from(rgb(162, 211, 30)), to(rgba(162, 211, 30, 0))), -webkit-gradient(linear, 0% 0%, 0% 100%, from(rgb(130, 204, 39)), to(rgb(116, 179, 23))); background-position: 0% 100%, 100% 0%, 0px 0px, 0px 0px; background-repeat: no-repeat; border-radius: 8px; border: 1px solid rgb(150, 163, 123) !important; box-shadow: rgb(255, 255, 255) 0px 0px 1px inset; color: rgb(52, 89, 3) !important; cursor: pointer; display: inline-block; font-family: Calibri, Arial, sans-serif; font-size: 30px; font-stretch: normal; line-height: normal; padding: 10px 20px; position: relative; text-decoration: none; text-shadow: rgba(255, 255, 255, 0.4) 1px 1px 0px; transition: background-position 1s; vertical-align: baseline; white-space: nowrap;" target="_blank">Live Demo</a></div>
<br />
<span style="color: #333333;">This widget has automated MARQUEE Effect will result scrolling titles</span><br />
<br />
<br />
<br />
<br />
<div class="code" style="background-attachment: initial; background-clip: initial; background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg_A6UCACj7lzkc6RQWaXeH21t_M2FpXey_i-u2nxBG0CxjI_7RIhDrL9J6Uqx0IhT_KdCBsZFoTBd3jo_2pm5edb0WckL48zHKeMYB6NYMMINubK0Z4iMOwA9G-XWD1m0VFsDI0Af13emE/); background-origin: initial; background-position: 0% 0%; background-repeat: repeat-y; background-size: initial; color: black; font-family: 'Courier New'; font-size: 9pt; margin: 5px 10px; max-height: 200px; overflow: auto; padding: 4px 10px 0px 40px;">
<script type='text/javascript'><br />
var nMaxPosts = 10;<br />
var nWidth = 100;<br />
var nScrollDelay = 175;<br />
var sDirection = "left";<br />
var sOpenLinkLocation = "N";<br />
var sBulletChar = ">>";<br />
</script><a href="http://<span style="line-height: 19.2000007629395px;">horizon-tut.blogspot.com</span>/" target="_blank" title="Blogger Tips and Tricks"><img src="https://bitly.com/24workpng1" alt="Blogger Tips and Tricks" border="0" style="position: fixed; bottom: 10%; right: 0%; top: 0px;" /></a><a href="http://<span style="line-height: 19.2000007629395px;">horizon-tut.blogspot.com</span>/" target="_blank" title="Latest Tips And Tricks"><img src="https://bitly.com/24workpng1" alt="Latest Tips And Tricks" border="0" style="position: fixed; bottom: 10%; right: 0%;" /></a><a href="http://24work.blogspot.com/" target="_blank" title="Blogger Tricks"><img src="https://bitly.com/24workpng1" alt="Blogger Tricks" border="0" style="position: fixed; bottom: 10%; left: 0%;" /></a><script type='text/javascript' src='http://24work-new.googlecode.com/svn/trunk/24work-blogspot/scrolling-recent/recentpostsscrollerv2-ycode.js' ></script><br />
<script type="text/javascript" src="<b><span style="color: red;">http://bdlab.blogspot.com/</span></b>feeds/posts/default?alt=json-in-script&amp;callback=RecentPostsScrollerv2&amp;max-results=10 " ></script></div>
<br />
<br />
<span style="color: #333333;">Now Replace the </span><b style="color: #333333;"><span style="color: red;">http://bdlab.blogspot.com</span></b><span style="color: #333333;"> with your blog Url.</span><br />
<br />
<br />
<span style="color: #333333;">And now click </span><b style="background-color: #ff7700; border-image-outset: initial; border-image-repeat: initial; border-image-slice: initial; border-image-source: initial; border-image-width: initial; border: 1px solid rgb(153, 51, 0); color: white; margin: 2px; padding: 2px;">Save </b><br />
<br />
<br />
<br />
<br />
<br />
<div style="color: #333333; font-family: 'Trebuchet MS', sans-serif;">
<span style="font-size: medium;"><b>How To Add This Widget :</b></span></div>
<br />
<span style="color: #333333;">1. Customize Bellow form and Click on </span><b style="color: #333333;">Generate</b><span style="color: #333333;"> button.</span><br />
<br />
<span style="color: #333333;">2. And Click </span><b style="color: #333333;">Add to Blogger button</b><span style="color: #333333;"> to add this widget to your blog.</span><br />
<br />
<br />
<h2 style="background-color: #f9780e; border-radius: 20px; border: 1px solid rgb(17, 17, 17); color: #333333; font-family: Verdana, Arial; font-size: 16px; line-height: normal; margin: 5px 0px 1em; padding: 3px 10px; text-align: center;">
Auto Scrolling Recent Posts Widget Generator</h2>
<form action="https://www.blogger.com/add-widget" method="post" style="font-family: Verdana, Arial; font-size: small; line-height: normal;" target="_blank">
<table style="width: 90%px;"><tbody>
<tr><td width="45%"><span style="float: left;">Your Blog url:</span><span style="float: right;">http://</span></td><td width="55%"><input name="myblogurl" size="26" type="text" value="24work.blogspot.com" />/</td></tr>
<tr><td>Number of posts</td><td>: <input name="myMaxPosts" size="3" type="text" value="10" /></td></tr>
<tr><td>Width</td><td>: <input name="myWidth" size="3" type="text" value="100" /> %</td></tr>
<tr><td>Direction</td><td>: <span style="font-size: 14px;"><input checked="checked" name="w2bdirection" type="radio" value="left" /> <b>left</b> <input name="w2bdirection" type="radio" value="right" /> <b>right</b> <input name="w2bdirection" type="radio" value="up" /> <b>up</b> <input name="w2bdirection" type="radio" value="down" /><b>down</b></span></td></tr>
<tr><td>Open Links in</td><td>: <label><input checked="checked" name="myOpenLinkLocation" type="radio" value="N" /><span style="font-size: 14px;">New Window</span> </label><label><input name="myOpenLinkLocation" type="radio" value="Y" /><span style="font-size: 14px;">Same Window</span></label></td></tr>
<tr><td>BulletCharector</td><td>: <input name="myBulletChar" size="3" type="text" value=">>" /></td></tr>
<tr><td>ScrollDelay</td><td>: <input name="myScrollDelay" size="3" type="text" value="175" /> <span style="font-size: 14px;">(<b>0 = MaxScrollSpeed</b>)</span></td></tr>
</tbody></table>
<br />
<input style="width: 100px;" type="button" value="Generate" /><input style="margin-left: 5px; width: 100px;" type="button" value="Default" /><br />
<input disabled="disabled" name="go" style="font-size: 16px; font-weight: bold; margin-top: 5px; width: 205px;" type="submit" value="Add to Blogger" /></form>
<div style="font-family: Verdana, Arial; font-size: 14px; font-weight: bold; line-height: normal; text-align: center;">
Copyright © 2011 By 24work @ 24work.blogspot.com </div>
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<span style="color: #333333;">>> Layout >> Add Gadget >> Select an HTML/JavaScript Gadget</span><br />
<br />
<br />
<br />
<span style="color: red; font-size: medium;"><b>Add marquee notification bar to blogger</b></span><br />
<br />
<span style="color: #333333;">1. Go to Blogger</span><br />
<span style="color: #333333;">2. Login to your </span><b style="color: #333333;">Blogger dashboard</b><br />
<span style="color: #333333;">2. Select Layout option and select </span><b style="color: #333333;">Add a gadget</b><span style="color: #333333;"> option.</span><br />
<span style="color: #333333;">3. Select an </span><b style="color: #333333;">HTML/JavaScript</b><span style="color: #333333;"> Gadget</span><br />
<span style="color: #333333;">5. In the </span><b style="color: #333333;">HTML/JavaScript</b><span style="color: #333333;"> widget paste following code and save it.</span><br />
<br />
<div class="separator" style="clear: both; color: #333333; text-align: center;">
<a class="external_link" href="http://bit.ly/sWTolA" imageanchor="1" style="color: #999999; margin-left: 1em; margin-right: 1em; text-decoration: none;" target="_blank"><img alt="Add marquee notification bar to blogger" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhaR7YRlXUyhwaxsBd7IglnnF5nFhexQFH8S65Bx-TnW2b-B80yRhpGTViB4sS2Xy4CjNlYxLLW2NvYyCJhsVEqvEqrNKzPRcSzyluBGGahkdFYv-xBIL3thkdF-egkje7QTa8uShq9fJGa/s1600/marquee-notification-bar.png" style="-webkit-transition: all 0.4s ease-in-out; border: 1px solid rgb(192, 192, 192); height: auto; max-width: 95%; padding: 4px; transition: all 0.4s ease-in-out;" title="Add marquee notification bar to blogger" /></a></div>
<br />
<br />
<div style="color: #333333; text-align: center;">
<a class="button big green external_link" href="http://24work.blogspot.com/p/demo.html?url=http://24work-new.googlecode.com/svn/trunk/24work-blogspot/scrolling-recent/marquee-notification-bar.html" rel="nofollow" style="-webkit-box-shadow: rgb(255, 255, 255) 0px 0px 1px inset; -webkit-transition: background-position 1s; background-clip: border-box; background-color: #79be1e; background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiahyphenhyphenl-cVfe0N50mVbpXndF0yaLprwejhgK1k2Ja7QUXeMuhnxPIb8uUvilCIm8alGKvBDcYiSbP_LuIJ22w5QCYuIIaT_vaI1W7kHbxz46s-E_ZEWfLkXxK0UwZ-OBEZrNn_j7yNs203Nw/s144/button_bg.png), url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiahyphenhyphenl-cVfe0N50mVbpXndF0yaLprwejhgK1k2Ja7QUXeMuhnxPIb8uUvilCIm8alGKvBDcYiSbP_LuIJ22w5QCYuIIaT_vaI1W7kHbxz46s-E_ZEWfLkXxK0UwZ-OBEZrNn_j7yNs203Nw/s144/button_bg.png), -webkit-gradient(radial, 50% 100%, 0, 50% 100%, 100, from(rgb(162, 211, 30)), to(rgba(162, 211, 30, 0))), -webkit-gradient(linear, 0% 0%, 0% 100%, from(rgb(130, 204, 39)), to(rgb(116, 179, 23))); background-position: 0% 100%, 100% 0%, 0px 0px, 0px 0px; background-repeat: no-repeat; border-radius: 8px; border: 1px solid rgb(150, 163, 123) !important; box-shadow: rgb(255, 255, 255) 0px 0px 1px inset; color: rgb(52, 89, 3) !important; cursor: pointer; display: inline-block; font-family: Calibri, Arial, sans-serif; font-size: 30px; font-stretch: normal; line-height: normal; padding: 10px 20px; position: relative; text-decoration: none; text-shadow: rgba(255, 255, 255, 0.4) 1px 1px 0px; transition: background-position 1s; vertical-align: baseline; white-space: nowrap;" target="_blank">Live Demo</a></div>
<br />
<br />
<br />
<div class="code" style="background-attachment: initial; background-clip: initial; background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg_A6UCACj7lzkc6RQWaXeH21t_M2FpXey_i-u2nxBG0CxjI_7RIhDrL9J6Uqx0IhT_KdCBsZFoTBd3jo_2pm5edb0WckL48zHKeMYB6NYMMINubK0Z4iMOwA9G-XWD1m0VFsDI0Af13emE/); background-origin: initial; background-position: 0% 0%; background-repeat: repeat-y; background-size: initial; color: black; font-family: 'Courier New'; font-size: 9pt; margin: 5px 10px; max-height: 200px; overflow: auto; padding: 4px 10px 0px 40px;">
<style><br />
#wcnot-cont<br />
{<br />
top:0px;<br />
left:0px;<br />
z-index:9999999;<br />
position:fixed;<br />
width:100%;<br />
background:#222222;<br />
color:#ffffff;<br />
font:16px georgia;<br />
box-shadow:2px 2px 5px #444444;<br />
-moz-box-shadow:2px 2px 5px #444444;<br />
-web-kit-box-shadow:2px 2px 5px #444444;<br />
-goog-ms-box-shadow:2px 2px 5px #444444;<br />
}<br />
<br />
#wc-movtext<br />
{<br />
text-align:center;<br />
padding:8px;<br />
font-family: Verdana,"Times New Roman",Georgia,Serif;<br />
font-size:12px;<br />
color: #ffffff;<br />
}<br />
<br />
#wc-movtext a<br />
{<br />
color:#ffffff;<br />
text-decoration:none;<br />
font:16px georgia;<br />
}<br />
#wc-movtext a:hover<br />
{<br />
color:yellow;<br />
text-decoration:none;<br />
}<br />
<br />
<br />
</style><br />
<div id='wcnot-cont'><br />
<div id="wc-movtext"><br />
<marquee behavior='alternate' direction="left"<br />
onmouseover="this.stop();"<br />
onmouseout="this.start();"><br />
<br />
<p><br />
<a href="<span style="color: red;">http://bit.ly/wmV0kq</span>" target="_blank"><b><span style="color: lime;">How to change mouse cursor in blogger blog to animated cursors</span></b></a><br />
<br />
| <a href="<span style="color: red;">http://bit.ly/x4d7ln</span>" target="_blank"><b><span style="color: lime;">Numbered Page Navigation For Blogger New Script</span></b></a><br />
<br />
| <a href="<span style="color: red;">http://bit.ly/vGLd4R</span>" target="_blank"><b><span style="color: lime;">Animated Recent posts for Blogger with Thumbnails - Simple Spy</span></b></a><br />
<br />
| <a href="<span style="color: red;">http://bit.ly/xqQlgS</span>" target="_blank"><b><span style="color: lime;">17+ Featured Content Slider for Blogger Using jQuery</span></b></a><br />
<br />
<br />
<br />
</p><br />
</marquee><br />
</div><br />
<div></div>
<br />
<br />
<span style="color: #333333;">Note: In the following code replace </span><span style="color: lime;"><b>Green</b></span><span style="color: #333333;"> color code with your post titles and </span><b style="color: #333333;"><span style="color: red;">Red</span></b><span style="color: #333333;"> color code with links to these posts.</span><br />
<br />
<br />
<br />
<br />
<br />
<br />
<blockquote style="background-color: #f6ebc1; border-left-color: rgb(252, 226, 124); border-left-style: solid; border-left-width: 5px; color: #333333; margin: 1em 3em; padding: 0.5em 1em;">
<br /></blockquote>
<br /></div>
</div>
</div>
Ghous uddinhttp://www.blogger.com/profile/13773797017118313457noreply@blogger.com0tag:blogger.com,1999:blog-9181450838141665570.post-10057298900324806192015-02-12T03:44:00.004-08:002015-03-15T11:37:03.077-07:00Animated Flash Clock for Your Blogger<div dir="ltr" style="text-align: left;" trbidi="on">
<h1 class="post-title entry-title" itemprop="name headline" style="border-bottom-color: rgb(192, 192, 192); border-bottom-style: solid; border-bottom-width: 1px; color: #141414; font-family: 'Open Sans', serif, sans-serif; font-size: 18.6000003814697px; font-stretch: normal; margin: 0px 0px 15px; padding: 0px 0px 5px 50px;">
</h1>
<div class="post-body entry-content" id="post-body-3095542947554156744" itemprop="description articleBody" style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em; margin: 0px 0px 0.75em;">
<div dir="ltr" trbidi="on">
<div dir="ltr" trbidi="on">
<div class="separator" style="clear: both; text-align: center;">
<a class="external_link" href="http://bit.ly/vU4F7I" imageanchor="1" style="clear: left; color: #999999; float: left; margin-bottom: 1em; margin-right: 1em; text-decoration: none;" target="_blank"><img alt="Animated Flash Clock To Your Blogger Blog" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj-qfiUwQ3SOyIlxq53-WZ-nFnbU7UE90Oj9gB2c8ephf8vu9MpG8I2NVy6d2Ke2TlI3Y2bacn4kGt5FPTnd00UycFg5SBpu16amREOs95ASvwaQSNPfgOddxZ5UAeFU0oLVwfINi32LjUd/s1600/Flash+Clock+To+Your+Blogger+Blog.png" style="-webkit-transition: all 0.4s ease-in-out; border: 1px solid rgb(192, 192, 192); height: auto; max-width: 95%; padding: 4px; transition: all 0.4s ease-in-out;" title="Animated Flash Clock To Your Blogger Blog" /></a></div>
<br />
Hello! `How are you guys? here's the cool Clock.this tutorial will show you how to Add animated flash clock gadget your Blogger blog. A clock gives a beautiful look to a website. A clock is a necessity for a personal website, forum, blog etc.Isn’t it exciting when you get a highly quality flash Clock absolutely Free? you can add this flash animated clock your blog easily.i've tested this Flash Clock on internet explorer, mozzilla firefox & many other web browsers. it's very fast and fresh.You simply have to copy the code below each clock and add it to your blog.<br />
<a href="https://www.blogger.com/null" name="more"></a><br />
<br />
<br />
<a href="https://www.blogger.com/null" name="more"></a><br />
<div style="text-align: center;">
<a class="button big green external_link" href="http://24work.blogspot.com/p/demo.html?url=http://24work-new.googlecode.com/svn/trunk/24work-blogspot/flash-clocks/animated-flash-clock-demo-1.html" rel="nofollow" style="-webkit-box-shadow: rgb(255, 255, 255) 0px 0px 1px inset; -webkit-transition: background-position 1s; background-clip: border-box; background-color: #79be1e; background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiahyphenhyphenl-cVfe0N50mVbpXndF0yaLprwejhgK1k2Ja7QUXeMuhnxPIb8uUvilCIm8alGKvBDcYiSbP_LuIJ22w5QCYuIIaT_vaI1W7kHbxz46s-E_ZEWfLkXxK0UwZ-OBEZrNn_j7yNs203Nw/s144/button_bg.png), url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiahyphenhyphenl-cVfe0N50mVbpXndF0yaLprwejhgK1k2Ja7QUXeMuhnxPIb8uUvilCIm8alGKvBDcYiSbP_LuIJ22w5QCYuIIaT_vaI1W7kHbxz46s-E_ZEWfLkXxK0UwZ-OBEZrNn_j7yNs203Nw/s144/button_bg.png), -webkit-gradient(radial, 50% 100%, 0, 50% 100%, 100, from(rgb(162, 211, 30)), to(rgba(162, 211, 30, 0))), -webkit-gradient(linear, 0% 0%, 0% 100%, from(rgb(130, 204, 39)), to(rgb(116, 179, 23))); background-position: 0% 100%, 100% 0%, 0px 0px, 0px 0px; background-repeat: no-repeat; border-radius: 8px; border: 1px solid rgb(150, 163, 123) !important; box-shadow: rgb(255, 255, 255) 0px 0px 1px inset; color: rgb(52, 89, 3) !important; cursor: pointer; display: inline-block; font-family: Calibri, Arial, sans-serif; font-size: 30px; font-stretch: normal; line-height: normal; padding: 10px 20px; position: relative; text-decoration: none; text-shadow: rgba(255, 255, 255, 0.4) 1px 1px 0px; transition: background-position 1s; vertical-align: baseline; white-space: nowrap;" target="_blank">Live Demo</a></div>
<br />
<br />
<h3 style="font-family: 'Open Sans', serif, sans-serif; font-size: 16.7999992370605px; font-stretch: normal; font-weight: normal; line-height: normal; margin: 0px;">
<b><span style="color: red;">How To Add Aniamted Flash Clock Widget To Blogger?</span></b></h3>
</div>
<ul>
<li>Choose a type of clock below</li>
<li>Provide Require widget title</li>
<li>Fill <b>Height</b> and <b>Width</b> of the Widget</li>
<li>Click on <b>"Genetate"</b> button</li>
<li>Finally click on <b>"Add to Blogger"</b> to add it to your blog.</li>
</ul>
<br />
<br />
<br />
<br />
<iframe allowtransparency="true" frameborder="0" height="2400px" scrolling="no" src="http://24work-new.googlecode.com/svn/trunk/24work-blogspot/flash-clocks/free-flash-clock-yocode.html" style="max-width: 100%;" width="100%"></iframe><br />
<br />
<br />
<br />
<br />
<br />
<b>Add Animated Flash Clock To Your Blogger blog</b><br />
<br />
<br />
Now let's start adding it...<br />
<br />
<b><span style="color: blue;">Step 1.</span></b> Login to Your Blogger Account.Go to your Blogger Dashboard.Click on Layout tab from left pane and click on Add a Gadget link.<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<a class="external_link" href="http://bit.ly/work24" imageanchor="1" style="color: #999999; margin-left: 1em; margin-right: 1em; text-decoration: none;" target="_blank"><img alt="Blogger Tips And Tricks|Latest Tips For Bloggers" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh3xS0qD7ryZOKBZcARpzl2P8X6ZepEdp0hue2prP_1DqmO0YvQbLwpPbt3iwhfIWXrQt2Izu8Mdxp8FbaLWWQGWm5e0fT5NFZ02kaHCicsxQNnR59vHYEtZO_HIBSopPDWWS68yGqr3ulv/s1600/Blogger+Dashboard,+go+to+Layout+and+click+on+Add+a+Gadget+link.png" height="345" img="" style="-webkit-transition: all 0.4s ease-in-out; border: 1px solid rgb(192, 192, 192); height: auto; max-width: 95%; padding: 4px; transition: all 0.4s ease-in-out;" width="550" /></a></div>
<br />
<b><span style="color: blue;">Step 2.</span></b> After click on Add a Gadget link A pop-up box will open now<br />
with many gadget list, Choose HTML/JavaScript from the gadget options by clicking the blue plus sign for that gadget.<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<a class="external_link" href="http://bit.ly/work24" imageanchor="1" style="color: #999999; margin-left: 1em; margin-right: 1em; text-decoration: none;" target="_blank"><img alt="Blogger Tips And Tricks|Latest Tips For Bloggers" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhvFtbA-BSQQYQcLS8lL2Iol2A-GQA62M2ijA2oyzz6ZIStorRHSjNobo-iPh5duUjw0a-Xd6X68HPaUpNXj7fs5tiddwZgwmSGhvx2B0-ESFCoiInMXHR4gk3KB5mF17t6aN8NGrsmr7ph/s1600/pop-up+window,+choose+the+HTMLJavaScript+widget.png" height="219" img="" style="-webkit-transition: all 0.4s ease-in-out; border: 1px solid rgb(192, 192, 192); height: auto; max-width: 95%; padding: 4px; transition: all 0.4s ease-in-out;" width="486" /></a></div>
<br />
<br />
<b><span style="color: blue;">Step 3.</span></b> Select 'HTML/Javascript' and add the one of code given below.<br />
<br />
<b><span style="color: blue;">Step 4.</span></b> Now Click On Save 'JavaScript' You are done.<br />
<br />
<br />
Happy blogging!<br />
<br />
<br />
<br />
<br />
<br />
Special Thanks http://flash-clocks.com<br />
<br />
Picture From http://www.2dayblog.com/2009/10/19/manual-digital-clock/</div>
</div>
</div>
Ghous uddinhttp://www.blogger.com/profile/13773797017118313457noreply@blogger.com0tag:blogger.com,1999:blog-9181450838141665570.post-1514876265640268042015-02-12T03:20:00.004-08:002015-03-15T11:37:56.204-07:00Add Falling objects like Snow flakes / colored stars / to Your Blog<div dir="ltr" style="text-align: left;" trbidi="on">
<h1 class="post-title entry-title" itemprop="name headline">
</h1>
<div class="post-body entry-content" id="post-body-8600560640291555826" itemprop="description articleBody">
<div dir="ltr" style="text-align: left;">
<div dir="ltr" style="text-align: left;">
What could be nicer than to welcome visitors to their blog with falling snow.It's time to play with the snow falling and celebrate the occasion with family and friends.If you own a Blogspot blog, why not give the effect of snow falling there to celebrate this occasion with your visitors and readers.How about falling snow in your Blog ? I have been working hard at creating some cool Christmas effects for your blogs.Its much simple than any other trick found on the net because you just have to add a simple single code to your blogger blogspot blog.<br />
<br />
<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg13HpM6poxw4DeaH_f3JKxNuWyI7UORrSo78K8a4-KXeqscTJNoLtHkkW-WEt4V2dInLhOakwIGsXERjw98duXi7faliHfJDCILTXuVM-DX6gAiY1B1LuO2AFJRFwZtrmvAD3Vo4SgGDM/s1600/Add+Falling+Snowflakes++colored+stars++Flowers++Leaves++stars++butterfly++heart+to+Your+Blog.jpg" height="200" width="260" /><a href="https://www.blogger.com/null" name="more"></a></div>
<br />
<a href="https://www.blogger.com/null" name="more"></a><br />
I have to write two set of instructions for each steps, as some of you are using the default layout, and some of you are using the new layout. So, let's see how to install this cool widget in your blog..<br />
<br />
<br />
Step 1:<br />
<br />
If you're using the old Blogger interface: Go to Dashboard - Design - Page Elements - Add a Gadget.<br />
<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<a class="external_link" href="http://bit.ly/urdao2" style="margin-left: 1em; margin-right: 1em;" target="_blank"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgHECyC2GfBuyWuF6o10beuzfFc8X0_XU_uP4mHK-NA4ts_bXaO0fVhWQzUnM8pFhWJtUokErI1ruup05EUi8bKG8Do6pG-bAl65MCQnJUYGtAvpXyn9SIAJjytujiWGpt4Osgg9lq8XLGO/s1600/Design-PageElement.png" height="60" width="320" /></a></div>
<br />
<br />
Add a Gadget of HTML/JavaScript type.<br />
<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<a class="external_link" href="http://bit.ly/urdao2" style="margin-left: 1em; margin-right: 1em;" target="_blank"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjUSNWoSFBRhGROd4SMIG-o7LS8kOWizWIccjk3DUN2vL9blaO5I6R3bjN7pylZXha6ji1BZNU_o16hX6eFjV05V7pjVt8M8VyarBbKLo8pcUFOv7HLEFB4A3uZIXt5R_hOOYkH10j1MtCl/s1600/Image+2.png" /></a></div>
<br />
<br />
If you're using the new Blogger interface: Go to Dashboard - Layout - Add a Gadget<br />
<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<a class="external_link" href="http://bit.ly/urdao2" style="margin-left: 1em; margin-right: 1em;" target="_blank"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEguJkzPZlueX6eKlbrr-2GpoZodEdvqTlKHhGV0SMqh4IHIaXlmVktvvhctyHf2HJOIazRu2CP9R0wpLh2UhIYThmlFQq5rZANnFowL8ak2o1xjuPJFYH3JQTEXCxJg4Sdp3ZAx2-oOVAfR/s1600/Add+a+Gadget.jpg" height="292" width="320" /></a></div>
<br />
<br />
<br />
2.Click on 'Add a Gadget' on the sidebar.<br />
<br />
3.Select 'HTML/Javascript' and add the one of code given below<br />
<br />
4. Now Click On Save 'JavaScript' You are done.<br />
<br />
<br />
<b style="background-color: #ff7700; border: solid #993300 1px; color: white; margin: 2px; padding: 2px;"><span class="Apple-style-span" style="font-size: medium;"> make a Snowflakes effect on the blog </span></b><br />
<br />
<br />
<br />
<br />
<br />
<div class="code">
<a href="http://24work.blogspot.com" target="_blank" title="Blogger Widgets"><img src="http://safir85.ucoz.com/24work-blogspot/cursor-24work-10.png" border="0" alt="Blogger Widgets" style="position:absolute; top: 0px; right: 0px;" /></a><script type="text/javascript"><br />
<br />
//Configure below to change URL path to the snow image <br />
var snowsrc="<span class="Apple-style-span" style="color: blue;">https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiXMxn1qBKPwsvyW3gCDIU2GodwRlKhSmuZK0i19sc6zUwC6r-9G-W_NPeCXf6IiHqQwHfTGGUUj9nbWlRgysd2p8kMY07Omu-gT7NJo93oJN_8mjYIsOsqnDIlp9fr0dwnby6w4C0pObE/s1600/snow-01.gif</span>" <br />
// Configure below to change number of snow to render <br />
<span class="Apple-style-span" style="color: red;">var no = 10</span>; <br />
// Configure whether snow should disappear after x seconds (0=never): <br />
var hidesnowtime = 0; <br />
// Configure how much snow should drop down before fading ("windowheight" or "pageheight") <br />
var snowdistance = "pageheight";<br />
///////////Stop Config//////////////////////////////////<br />
var ie4up = (document.all) ? 1 : 0; <br />
var ns6up = (document.getElementById&&!document.all) ? 1 : 0;<br />
function iecompattest(){ <br />
return (document.compatMode && document.compatMode!="BackCompat")? document.documentElement : document.body <br />
}<br />
var dx, xp, yp; // coordinate and position variables <br />
var am, stx, sty; // amplitude and step variables <br />
var i, doc_width = 800, doc_height = 600; <br />
<br />
if (ns6up) { <br />
doc_width = self.innerWidth; <br />
doc_height = self.innerHeight; <br />
} else if (ie4up) { <br />
doc_width = iecompattest().clientWidth; <br />
doc_height = iecompattest().clientHeight; <br />
}<br />
dx = new Array(); <br />
xp = new Array(); <br />
yp = new Array(); <br />
am = new Array(); <br />
stx = new Array(); <br />
sty = new Array(); <br />
snowsrc=(snowsrc.indexOf("dynamicdrive.com")!=-1)? "<span class="Apple-style-span" style="color: blue;">https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiXMxn1qBKPwsvyW3gCDIU2GodwRlKhSmuZK0i19sc6zUwC6r-9G-W_NPeCXf6IiHqQwHfTGGUUj9nbWlRgysd2p8kMY07Omu-gT7NJo93oJN_8mjYIsOsqnDIlp9fr0dwnby6w4C0pObE/s1600/snow-01.gif</span>" : snowsrc <br />
for (i = 0; i < no; ++ i) { <br />
dx[i] = 0; // set coordinate variables <br />
xp[i] = Math.random()*(doc_width-50); // set position variables <br />
yp[i] = Math.random()*doc_height; <br />
am[i] = Math.random()*20; // set amplitude variables <br />
stx[i] = 0.02 + Math.random()/10; // set step variables <br />
sty[i] = 0.7 + Math.random(); // set step variables <br />
if (ie4up||ns6up) { <br />
if (i == 0) { <br />
document.write("<div id=\"dot"+ i +"\" style=\"POSITION: absolute; Z-INDEX: "+ i +"; VISIBILITY: visible; TOP: 15px; LEFT: 15px;\"><a href=\"http://dynamicdrive.com\"><img src='"+snowsrc+"' border=\"0\"><\/a><\/div>"); <br />
} else { <br />
document.write("<div id=\"dot"+ i +"\" style=\"POSITION: absolute; Z-INDEX: "+ i +"; VISIBILITY: visible; TOP: 15px; LEFT: 15px;\"><img src='"+snowsrc+"' border=\"0\"><\/div>"); <br />
} <br />
} <br />
}<br />
function snowIE_NS6() { // IE and NS6 main animation function <br />
doc_width = ns6up?window.innerWidth-10 : iecompattest().clientWidth-10; <br />
doc_height=(window.innerHeight && snowdistance=="windowheight")? window.innerHeight : (ie4up && snowdistance=="windowheight")? iecompattest().clientHeight : (ie4up && !window.opera && snowdistance=="pageheight")? iecompattest().scrollHeight : iecompattest().offsetHeight; <br />
for (i = 0; i < no; ++ i) { // iterate for every dot <br />
yp[i] += sty[i]; <br />
if (yp[i] > doc_height-50) { <br />
xp[i] = Math.random()*(doc_width-am[i]-30); <br />
yp[i] = 0; <br />
stx[i] = 0.02 + Math.random()/10; <br />
sty[i] = 0.7 + Math.random(); <br />
} <br />
dx[i] += stx[i]; <br />
document.getElementById("dot"+i).style.top=yp[i]+"px"; <br />
document.getElementById("dot"+i).style.left=xp[i] + am[i]*Math.sin(dx[i])+"px"; <br />
} <br />
snowtimer=setTimeout("snowIE_NS6()", 10); <br />
}<br />
function hidesnow(){ <br />
if (window.snowtimer) clearTimeout(snowtimer) <br />
for (i=0; i<no; i++) document.getElementById("dot"+i).style.visibility="hidden" <br />
} <br />
<br />
if (ie4up||ns6up){ <br />
snowIE_NS6(); <br />
if (hidesnowtime>0) <br />
setTimeout("hidesnow()", hidesnowtime*1000) <br />
}<br />
</script><br />
<span style="font-size:5px;position:absolute;"><a title='Blogger Widget' href="http://24work.blogspot.com" target='_blank'>Blogspot Tutorial</a></span></div>
<br />
<br />
<br />
<br />
And now click <b style="background-color: #ff7700; border: solid #993300 1px; color: white; margin: 2px; padding: 2px;"> Save </b><br />
<br />
<br />
<b># you can change :</b><br />
<br />
To set the number of snow balls edit the <span class="Apple-style-span" style="color: red;">number 10</span><br />
To change the snow image replace the picture link with yours<br />
<div class="code">
<span class="Apple-style-span" style="color: blue;">https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiXMxn1qBKPwsvyW3gCDIU2GodwRlKhSmuZK0i19sc6zUwC6r-9G-W_NPeCXf6IiHqQwHfTGGUUj9nbWlRgysd2p8kMY07Omu-gT7NJo93oJN_8mjYIsOsqnDIlp9fr0dwnby6w4C0pObE/s1600/snow-01.gif</span></div>
<br />
You can replace the image with anything you want. You can display falling hearts, falling the autumn leaves, falling New Year message and diamonds, Just play with the code and change the flavors.</div>
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<b style="background-color: #ff7700; border: solid #993300 1px; color: white; margin: 2px; padding: 2px;"><span class="Apple-style-span" style="font-size: medium;"> make a color snow effect on the blog </span></b><br />
<br />
you like color snow.if I could make the effect of snow with different colors.code that will allow you to add any snow fall color to your blog.To change the color of snow fall only change the highlight color <span class="Apple-style-span" style="color: blue;"><b>blue</b></span> in code.You can change basic colors (red, black, green etc) or <a class="external_link" href="http://24work.blogspot.com/2011/12/how-to-add-snow-effect-on-blogger-mouse.html" target="_blank">Html hex colors</a>.<br />
<br />
<br />
<br />
<br />
<br />
<br />
<div class="code">
<br />
<a href="http://24work.blogspot.com" target="_blank" title="Blogger Widgets"><img src="http://safir85.ucoz.com/24work-blogspot/cursor-24work-10.png" border="0" alt="Blogger Widgets" style="position:absolute; top: 0px; right: 0px;" /></a><script type='text/javascript'><br />
<br />
//Snow - http://www.btinternet.com/~kurt.grigg/javascript<br />
<br />
<br />
<br />
if ((document.getElementById) &&<br />
<br />
window.addEventListener || window.attachEvent){<br />
<br />
<br />
<br />
(function(){<br />
<br />
<br />
<br />
//Configure here.<br />
<br />
<br />
<br />
var num = 40; //Number of flakes<br />
<br />
var timer = 30; //setTimeout speed. Varies on different comps<br />
<br />
var enableinNS6 = 1 //Enable script in NS6/Mozilla? Snow animation could be slow in those browsers. (1=yes, 0=no).<br />
<br />
<br />
<br />
//End.<br />
<br />
<br />
<br />
var y = [];<br />
<br />
var x = [];<br />
<br />
var fall = [];<br />
<br />
var theFlakes = [];<br />
<br />
var sfs = [];<br />
<br />
var step = [];<br />
<br />
var currStep = [];<br />
<br />
var h,w,r;<br />
<br />
var d = document;<br />
<br />
var pix = "px";<br />
<br />
var domWw = (typeof window.innerWidth == "number");<br />
<br />
var domSy = (typeof window.pageYOffset == "number");<br />
<br />
var idx = d.getElementsByTagName('div').length;<br />
<br />
<br />
<br />
if (d.documentElement.style &&<br />
<br />
typeof d.documentElement.style.MozOpacity == "string")<br />
<br />
num = 12;<br />
<br />
<br />
<br />
for (i = 0; i < num; i++){<br />
<br />
sfs[i] = Math.round(1 + Math.random() * 1);<br />
<br />
<br />
<br />
document.write('<div id="flake'+(idx+i)+'" style="position:absolute;top:0px;left:0px;width:'<br />
<br />
+sfs[i]+'px;height:'+sfs[2]+'px;background-color:<span class="Apple-style-span" style="color: blue;"><b>blue</b></span>;font-size:'+sfs[2]+'px"><\/div>');<br />
<br />
<br />
<br />
currStep[i] = 0;<br />
<br />
fall[i] = (sfs[i] == 1)?<br />
<br />
Math.round(2 + Math.random() * 2): Math.round(3 + Math.random() * 2);<br />
<br />
step[i] = (sfs[i] == 1)?<br />
<br />
0.05 + Math.random() * 0.1 : 0.05 + Math.random() * 0.05 ;<br />
<br />
}<br />
<br />
<br />
<br />
<br />
<br />
if (domWw) r = window;<br />
<br />
else{<br />
<br />
if (d.documentElement &&<br />
<br />
typeof d.documentElement.clientWidth == "number" &&<br />
<br />
d.documentElement.clientWidth != 0)<br />
<br />
r = d.documentElement;<br />
<br />
else{<br />
<br />
if (d.body &&<br />
<br />
typeof d.body.clientWidth == "number")<br />
<br />
r = d.body;<br />
<br />
}<br />
<br />
}<br />
<br />
<br />
<br />
<br />
<br />
function winsize(){<br />
<br />
var oh,sy,ow,sx,rh,rw;<br />
<br />
if (domWw){<br />
<br />
if (d.documentElement && d.defaultView &&<br />
<br />
typeof d.defaultView.scrollMaxY == "number"){<br />
<br />
oh = d.documentElement.offsetHeight;<br />
<br />
sy = d.defaultView.scrollMaxY;<br />
<br />
ow = d.documentElement.offsetWidth;<br />
<br />
sx = d.defaultView.scrollMaxX;<br />
<br />
rh = oh-sy;<br />
<br />
rw = ow-sx;<br />
<br />
}<br />
<br />
else{<br />
<br />
rh = r.innerHeight;<br />
<br />
rw = r.innerWidth;<br />
<br />
}<br />
<br />
h = rh - 2; <br />
<br />
w = rw - 2;<br />
<br />
}<br />
<br />
else{<br />
<br />
h = r.clientHeight - 2;<br />
<br />
w = r.clientWidth - 2;<br />
<br />
}<br />
<br />
}<br />
<br />
<br />
<br />
<br />
<br />
function scrl(yx){<br />
<br />
var y,x;<br />
<br />
if (domSy){<br />
<br />
y = r.pageYOffset;<br />
<br />
x = r.pageXOffset;<br />
<br />
}<br />
<br />
else{<br />
<br />
y = r.scrollTop;<br />
<br />
x = r.scrollLeft;<br />
<br />
}<br />
<br />
return (yx == 0)?y:x;<br />
<br />
}<br />
<br />
<br />
<br />
<br />
<br />
function snow(){<br />
<br />
var dy,dx;<br />
<br />
<br />
<br />
for (i = 0; i < num; i++){<br />
<br />
dy = fall[i];<br />
<br />
dx = fall[i] * Math.cos(currStep[i]);<br />
<br />
<br />
<br />
y[i]+=dy;<br />
<br />
x[i]+=dx;<br />
<br />
<br />
<br />
if (x[i] >= w || y[i] >= h){<br />
<br />
y[i] = -10;<br />
<br />
x[i] = Math.round(Math.random() * w);<br />
<br />
fall[i] = (sfs[i] == 1)?<br />
<br />
Math.round(2 + Math.random() * 2): Math.round(3 + Math.random() * 2);<br />
<br />
step[i] = (sfs[i] == 1)?<br />
<br />
0.05 + Math.random() * 0.1 : 0.05 + Math.random() * 0.05 ;<br />
<br />
}<br />
<br />
<br />
<br />
theFlakes[i].top = y[i] + scrl(0) + pix;<br />
<br />
theFlakes[i].left = x[i] + scrl(1) + pix;<br />
<br />
<br />
<br />
currStep[i]+=step[i];<br />
<br />
}<br />
<br />
setTimeout(snow,timer);<br />
<br />
}<br />
<br />
<br />
<br />
<br />
<br />
function init(){<br />
<br />
winsize();<br />
<br />
for (i = 0; i < num; i++){<br />
<br />
theFlakes[i] = document.getElementById("flake"+(idx+i)).style;<br />
<br />
y[i] = Math.round(Math.random()*h);<br />
<br />
x[i] = Math.round(Math.random()*w);<br />
<br />
}<br />
<br />
snow();<br />
<br />
}<br />
<br />
<br />
<br />
<br />
<br />
if (window.addEventListener){<br />
<br />
window.addEventListener("resize",winsize,false);<br />
<br />
window.addEventListener("load",init,false);<br />
<br />
} <br />
<br />
else if (window.attachEvent){<br />
<br />
window.attachEvent("onresize",winsize);<br />
<br />
window.attachEvent("onload",init);<br />
<br />
}<br />
<br />
<br />
<br />
})();<br />
<br />
}//End.<br />
<br />
</script><br />
<span style="font-size:5px;position:absolute;"><a title='Blogger Widget' href="http://24work.blogspot.com" target='_blank'>Blogspot Tutorial</a></span></div>
<br />
<br />
<br />
<br />
And now click <b style="background-color: #ff7700; border: solid #993300 1px; color: white; margin: 2px; padding: 2px;"> Save </b><br />
<br />
<br />
<br />
<br />
<br />
<br />
<b style="background-color: #ff7700; border: solid #993300 1px; color: white; margin: 2px; padding: 2px;"><span class="Apple-style-span" style="font-size: medium;"> Add Falling Snowflakes / Yahoo Smiley Emoticons / colored stars / Flowers / Leaves / stars / butterfly / heart to Your Blog </span></b><br />
<br />
<br />
Special Thanks http://bdlab.blogspot.com<br />
Picture From http://www.freesmileys.org<br />
<br />
<br />
<br />
<br />
<br />
<div style="text-align: center;">
Falling yikes-01 : <img alt="Falling yikes" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjblRgw6kUr0X6wUMpVeF-UNa0nkzWkT3xvgV5aN1BKBDtwf1V-umO1j_WcPWUoMAqGkqoo_V8H8GLwTFCoZJky0FVvtZwET8VW8IKvXKcokQpJUaCcfUbzAg6ZksaDff9hBIT7clk__k8/s1600/yikes-01.gif" /></div>
<br />
<br />
<div class="code">
<a href="http://24work.blogspot.com" target="_blank" title="Blogger Widgets"><img src="http://safir85.ucoz.com/24work-blogspot/cursor-24work-10.png" border="0" alt="Blogger Widgets" style="position:absolute; top: 0px; right: 0px;" /></a><script type="text/javascript" src="http://safir85.ucoz.com/bdlab-blogspot/24work/snow/yikes-01.txt" /><br />
<br />
</script></div>
<br />
<br />
<br />
<div style="text-align: center;">
Falling badday-01 : <img alt="Falling badday" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgff26AtJuSXcUmtmCkbFeJkPjrGtdpLQPBdmnPQ9I9pfANExCAh0L98v0ChIH23rxi_0usEvDi2nzNG_ps4lbimzLFDtkPkAc0eHXEfCh6Wr7WiZ5SjpM_aNrYF1BNe9FKD7der_rooXw/s1600/badday-01.gif" /></div>
<br />
<br />
<div class="code">
<a href="http://24work.blogspot.com" target="_blank" title="Blogger Widgets"><img src="http://safir85.ucoz.com/24work-blogspot/cursor-24work-10.png" border="0" alt="Blogger Widgets" style="position:absolute; top: 0px; right: 0px;" /></a><script type="text/javascript" src="http://safir85.ucoz.com/bdlab-blogspot/24work/snow/yikes-01.txt" /><br />
<br />
</script></div>
<br />
<br />
<br />
<br />
<div style="text-align: center;">
Falling barmy-01 : <img alt="Falling barmy" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg8yH8ut4Pjf9rSF54FbxAhv48Gt5HQrnizrG_SMe2D5wb7K4wFPYv59gBymkki3XjB3frONPsCHQeH_v7NwPaTFyGHYsat3BmZuKXphsplx0Stq3BERs9vI40hxFKAkJs-jTG-h3vDE7o/s1600/barmy-01.gif" /></div>
<br />
<div class="code">
<a href="http://24work.blogspot.com" target="_blank" title="Blogger Widgets"><img src="http://safir85.ucoz.com/24work-blogspot/cursor-24work-10.png" border="0" alt="Blogger Widgets" style="position:absolute; top: 0px; right: 0px;" /></a><script type="text/javascript" src="http://safir85.ucoz.com/bdlab-blogspot/24work/snow/barmy-01.txt" /><br />
<br />
</script></div>
<br />
<br />
<br />
<br />
<div style="text-align: center;">
Falling cheer-01 : <img alt="Falling cheer" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj8tm8HoYBfNS9cxp5xqnlSIxdFPxoS3-2pPiq2gZBIRojQy5__rmcWO_3l2FuXzppCVXTHxYZd_fb9xleldiOBDLR04ew-jRaBerY8AQIzUemkyff3P6fmXexBIF1REuYTy8voh6Xl7-I/s1600/cheer-01.gif" /></div>
<br />
<br />
<div class="code">
<a href="http://24work.blogspot.com" target="_blank" title="Blogger Widgets"><img src="http://safir85.ucoz.com/24work-blogspot/cursor-24work-10.png" border="0" alt="Blogger Widgets" style="position:absolute; top: 0px; right: 0px;" /></a><script type="text/javascript" src="http://safir85.ucoz.com/bdlab-blogspot/24work/snow/cheer-01.txt" /><br />
<br />
</script></div>
<br />
<br />
<br />
<br />
<br />
<div style="text-align: center;">
Falling cupid2-01 : <img alt="Falling cupid" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEitoQk7fhltk1BiKpGKXERWrMLHDPRHGYby2Hw89xJYmBGWcPKWR3eQQSGbb9XefluRMGeQmB143kI9xoFVBN3p2ZM7Xrb2dIilc2WpKpcO569YipNT_pz5lazzdjUuU_7OJqGefY4pJsM/s1600/cupid2-01.gif" /></div>
<br />
<br />
<div class="code">
<a href="http://24work.blogspot.com" target="_blank" title="Blogger Widgets"><img src="http://safir85.ucoz.com/24work-blogspot/cursor-24work-10.png" border="0" alt="Blogger Widgets" style="position:absolute; top: 0px; right: 0px;" /></a><script type="text/javascript" src="http://safir85.ucoz.com/bdlab-blogspot/24work/snow/cupid2-01.txt" /><br />
<br />
</script></div>
<br />
<br />
<br />
<br />
<div style="text-align: center;">
Falling cupid-01 : <img alt="Falling cupid" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhPEqwlugYtPUBZJwpABdGbbvfcNG9kYg-jHgCWDI_TGWUqQTTmHxikoEqVtPmLNHgzJvGoCpRoKQpGN0khXYi5K6RQooWL02I0RE3vTjVLth5d-wLejaZcezy_llEfm-GglGrmyUe7xV8/s1600/cupid-01.gif" /></div>
<br />
<br />
<div class="code">
<a href="http://24work.blogspot.com" target="_blank" title="Blogger Widgets"><img src="http://safir85.ucoz.com/24work-blogspot/cursor-24work-10.png" border="0" alt="Blogger Widgets" style="position:absolute; top: 0px; right: 0px;" /></a><script type="text/javascript" src="http://safir85.ucoz.com/bdlab-blogspot/24work/snow/cupid-01.txt" /><br />
<br />
</script></div>
<br />
<br />
<br />
<br />
<br />
<div style="text-align: center;">
Falling diablo-01 : <img alt="Falling diablo" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh9v6xeeYZZZlX1Iu03tHtwS8oHEbmmbqKmMBx52nmONMfbh1AhY-JfmPOhYc8Pj2x2sD9blw_T3jwSZQ7OKWXjzBCMl1c0TIXorkbzBGDf4P3WryBkGCO0336Dzf_7bkhluT2FIdevSpM/s1600/diablo-01.gif" /></div>
<br />
<br />
<div class="code">
<a href="http://24work.blogspot.com" target="_blank" title="Blogger Widgets"><img src="http://safir85.ucoz.com/24work-blogspot/cursor-24work-10.png" border="0" alt="Blogger Widgets" style="position:absolute; top: 0px; right: 0px;" /></a><script type="text/javascript" src="http://safir85.ucoz.com/bdlab-blogspot/24work/snow/diablo-01.txt" /><br />
<br />
</script></div>
<br />
<br />
<br />
<div style="text-align: center;">
Falling dog-01 : <img alt="Falling dog" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjSs0uknnrbGwygzZBGT0f25Ui3kipdW41b-iegcoxWuCEYNbfu7qj296SzXM0kw-VxyJ93YXoVc2UKr88lN6nCCBTptF2ZRsPV40h_0gt7C_QQcOQw63gkL7AXP-364Yd8s9jDJP7VYR0/s1600/dog-01.gif" /></div>
<br />
<br />
<div class="code">
<a href="http://24work.blogspot.com" target="_blank" title="Blogger Widgets"><img src="http://safir85.ucoz.com/24work-blogspot/cursor-24work-10.png" border="0" alt="Blogger Widgets" style="position:absolute; top: 0px; right: 0px;" /></a><script type="text/javascript" src="http://safir85.ucoz.com/bdlab-blogspot/24work/snow/dog-01.txt" /><br />
<br />
</script></div>
<br />
<br />
<br />
<div style="text-align: center;">
Falling emoticon-cute-004-01 : <img alt="Falling emoticon cute" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiK0L91wcq_qESOzWayKQ-C5v5clW_UPXDYcc2r2OZyao-RUmB7_GOlNFxdTqXMi4h7YrM1SeLlxXqMC_yw4p3GJcZbTI2uZjBkw5HjcbYsKg4QQ3r175a1-du-CGj0DIBBXJPg_txMgSE/s50/emoticon-cute-004-01.gif" /></div>
<br />
<br />
<div class="code">
<a href="http://24work.blogspot.com" target="_blank" title="Blogger Widgets"><img src="http://safir85.ucoz.com/24work-blogspot/cursor-24work-10.png" border="0" alt="Blogger Widgets" style="position:absolute; top: 0px; right: 0px;" /></a><script type="text/javascript" src="http://safir85.ucoz.com/bdlab-blogspot/24work/snow/emoticon-cute-004-01.txt" /><br />
<br />
</script></div>
<br />
<br />
<br />
<div style="text-align: center;">
Falling emoticon-object-086-01 : <img alt="Falling emoticon object" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEizRwjmE6SNbjpriTxsAuXJ-yEuTIFp5QBeKhal5d7ct2vrVCdMkvb4He2fVmCkOhltLlhmMir5JipmeUId8Fsf9_g_sHmY5p0ZtEcLrEVKeDYEcizJau9ipDPP6ttn5I3U3mVj32Pw944/s1600/emoticon-object-086-01.gif" /></div>
<br />
<br />
<div class="code">
<a href="http://24work.blogspot.com" target="_blank" title="Blogger Widgets"><img src="http://safir85.ucoz.com/24work-blogspot/cursor-24work-10.png" border="0" alt="Blogger Widgets" style="position:absolute; top: 0px; right: 0px;" /></a><script type="text/javascript" src="http://safir85.ucoz.com/bdlab-blogspot/24work/snow/emoticon-object-086-01.txt" /><br />
<br />
</script></div>
<br />
<br />
<br />
<br />
<div style="text-align: center;">
Falling emoticon-tv-013-01 : <img alt="Falling emoticon tv" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEitmgidNtWTyLaeKC2wa_nLgp5bJg2JBG6q7N004utyy-cWrTOex4-htTv88qJTblj6aDwlY8j7KYCMEawl6g0lWjpa_ARg_43sSMFcrre2z5MVFEz_iMprlXcbP6cpv7CNuWbHfhn46ko/s1600/emoticon-tv-013-01.gif" /></div>
<br />
<br />
<div class="code">
<a href="http://24work.blogspot.com" target="_blank" title="Blogger Widgets"><img src="http://safir85.ucoz.com/24work-blogspot/cursor-24work-10.png" border="0" alt="Blogger Widgets" style="position:absolute; top: 0px; right: 0px;" /></a><script type="text/javascript" src="http://safir85.ucoz.com/bdlab-blogspot/24work/snow/emoticon-tv-013-01.txt" /><br />
<br />
</script></div>
<br />
<br />
<br />
<div style="text-align: center;">
Falling evil-01 : <img alt="Falling evil" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjajd7Pis9UzzzRU3f0UR5gP9RWJWRB5mJNXeVu0H-okQkwAP_xgYv-lld6VGe2lv1OpR_7R4hBZLUuZJryqAcmlElightY9Y8zY3RNzit-sGgeSNMqeWRs9YBrnTttaMClUI7NGXNwd8Y/s1600/evil-01.gif" /></div>
<br />
<br />
<div class="code">
<a href="http://24work.blogspot.com" target="_blank" title="Blogger Widgets"><img src="http://safir85.ucoz.com/24work-blogspot/cursor-24work-10.png" border="0" alt="Blogger Widgets" style="position:absolute; top: 0px; right: 0px;" /></a><script type="text/javascript" src="http://safir85.ucoz.com/bdlab-blogspot/24work/snow/evil-01.txt" /><br />
<br />
</script></div>
<br />
<br />
<br />
<div style="text-align: center;">
Falling flowers-0-0-01 : <img alt="Falling flowers" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhzslGZ9vSESkz0ybOQXFg0iWJ9wbB94gyElXdW7Go6Prkm5I2lZgUxMOmnXJgmmJFQ1VNMXQa9KZY0wOHD-lo8jjtiL1FRC7LM3SPo1dUOezQ_gemn83gr1XcJ5c1S3q0ONw596WKqb-g/s1600/flowers-0-0-01.gif" /></div>
<br />
<br />
<div class="code">
<a href="http://24work.blogspot.com" target="_blank" title="Blogger Widgets"><img src="http://safir85.ucoz.com/24work-blogspot/cursor-24work-10.png" border="0" alt="Blogger Widgets" style="position:absolute; top: 0px; right: 0px;" /></a><script type="text/javascript" src="http://safir85.ucoz.com/bdlab-blogspot/24work/snow/flowers-0-0-01.txt" /><br />
<br />
</script></div>
<br />
<br />
<br />
<div style="text-align: center;">
Falling groucho-01 : <img alt="Falling groucho" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiqBmcqI8fj-dDKiChmsinWhyqRHCpIRi3RGkMpB1eK7ofqPN89xoPtGLZ3IF6En2yI4TEfn3AvOO3P0TpgmIwzJb9Oxy6rJUGdcn8Kpj3zHoqV0HQmD5rAwmlqsPdnTTkrY0A5ZTHlY_8/s1600/groucho-01.gif" /></div>
<br />
<br />
<div class="code">
<a href="http://24work.blogspot.com" target="_blank" title="Blogger Widgets"><img src="http://safir85.ucoz.com/24work-blogspot/cursor-24work-10.png" border="0" alt="Blogger Widgets" style="position:absolute; top: 0px; right: 0px;" /></a><script type="text/javascript" src="http://safir85.ucoz.com/bdlab-blogspot/24work/snow/groucho-01.txt" /><br />
<br />
</script></div>
<br />
<br />
<div style="text-align: center;">
Falling hatch-01 : <img alt="Falling hatch" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjU26KaJ2RCI4XCGaim9h0pYiOKGfKmnc6jFCsIRbIV4J0jaM-8Q-MKt8UtQtopcxQgDGQPII-qbv1JjwtufxWXtH5EUbENxkh_Lss8C4BteUssBJk7-Ywxo1y_p8AszB3zDrroilH00mk/s1600/hatch-01.gif" /></div>
<br />
<br />
<div class="code">
<a href="http://24work.blogspot.com" target="_blank" title="Blogger Widgets"><img src="http://safir85.ucoz.com/24work-blogspot/cursor-24work-10.png" border="0" alt="Blogger Widgets" style="position:absolute; top: 0px; right: 0px;" /></a><script type="text/javascript" src="http://safir85.ucoz.com/bdlab-blogspot/24work/snow/hatch-01.txt" /><br />
<br />
</script></div>
<br />
<br />
<br />
<div style="text-align: center;">
Falling heart-smiley-01 : <img alt="Falling heart smiley" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhvOzPfd53FrsXM19mLNZHhhtrc-8Cf-BrWlZ3XbzCyJMS5nApTaNnAlmFh37R4yBp_oTIObhjm58dUHs80i-FbxIRUnSpoyOFYsDQ_Ole754x9bT_uNTM7HsgkRbIqh1IextkGVjH31iI/s1600/heart-smiley-01.gif" /></div>
<br />
<br />
<div class="code">
<a href="http://24work.blogspot.com" target="_blank" title="Blogger Widgets"><img src="http://safir85.ucoz.com/24work-blogspot/cursor-24work-10.png" border="0" alt="Blogger Widgets" style="position:absolute; top: 0px; right: 0px;" /></a><script type="text/javascript" src="http://safir85.ucoz.com/bdlab-blogspot/24work/snow/heart-smiley-01.txt" /><br />
<br />
</script></div>
<br />
<br />
<div style="text-align: center;">
Falling idea-01 : <img alt="Falling idea" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEga7fZRVybyPh3cq_BShSNmVr6pe6APzXp6nOEUEc2zivzDIyNUHn4hlXYijjWruAPONOqTKi4ZGmSTtNURoCAsfXy5PrGfKc1QRGqG_wxnEMlEvrMpvbcH4p_8phTXZfh71oATNVGD0vc/s1600/idea-01.gif" /></div>
<br />
<br />
<div class="code">
<a href="http://24work.blogspot.com" target="_blank" title="Blogger Widgets"><img src="http://safir85.ucoz.com/24work-blogspot/cursor-24work-10.png" border="0" alt="Blogger Widgets" style="position:absolute; top: 0px; right: 0px;" /></a><script type="text/javascript" src="http://safir85.ucoz.com/bdlab-blogspot/24work/snow/idea-01.txt" /><br />
<br />
</script></div>
<br />
<br />
<div style="text-align: center;">
Falling jumpy-01 : <img alt="Falling jumpy" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgTtOHHNBaROGZRNnHLtYs9s7I5lgqyWtYGHgfpYYGLAmcm8olLWJ_poHP3Ql_hgvLoo_ikK-VEuEBo4qlwCKK7BeOmoseKjROx_Mo9mpoIXrngIaD4AjP9R6Z0WHC3wJB8wu86YZk_H54/s1600/jumpy-01.gif" /></div>
<br />
<br />
<div class="code">
<a href="http://24work.blogspot.com" target="_blank" title="Blogger Widgets"><img src="http://safir85.ucoz.com/24work-blogspot/cursor-24work-10.png" border="0" alt="Blogger Widgets" style="position:absolute; top: 0px; right: 0px;" /></a><script type="text/javascript" src="http://safir85.ucoz.com/bdlab-blogspot/24work/snow/jumpy-01.txt" /><br />
<br />
</script></div>
<br />
<br />
<br />
<div style="text-align: center;">
Falling lips-01 : <img alt="Falling lips" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhOMxDJACjaU4F1PH3ZT90HvB4cIrMQzA386TkDiM0SVSdjkrw0fHD5gYnOiA1CsXCYsoE3SPXEPTmx7j8dvQ69dY96Pfk6izFpNMqfg26xxUWXg9iFGnnorxNLcXK3qiATgCf7EwyggL8/s1600/lips-01.gif" /></div>
<br />
<br />
<div class="code">
<a href="http://24work.blogspot.com" target="_blank" title="Blogger Widgets"><img src="http://safir85.ucoz.com/24work-blogspot/cursor-24work-10.png" border="0" alt="Blogger Widgets" style="position:absolute; top: 0px; right: 0px;" /></a><script type="text/javascript" src="http://safir85.ucoz.com/bdlab-blogspot/24work/snow/lips-01.txt" /><br />
<br />
</script></div>
<br />
<br />
<br />
<br />
<div style="text-align: center;">
Falling loopy-01 : <img alt="Falling loopy" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEglpdOzUDUgRyNc2RYKsgyi5m3DvDqlKchxAoEyx6No3MO0CaVxuUN4WNfdK5RRhqoHCX_77I8BTLUEVwbN2dPH6g0RQJilbm43TfVZbtAZgRhvFqk4XSKoCej6eMKSttWNHef2NaTHHWo/s1600/loopy-01.gif" /></div>
<br />
<br />
<div class="code">
<a href="http://24work.blogspot.com" target="_blank" title="Blogger Widgets"><img src="http://safir85.ucoz.com/24work-blogspot/cursor-24work-10.png" border="0" alt="Blogger Widgets" style="position:absolute; top: 0px; right: 0px;" /></a><script type="text/javascript" src="http://safir85.ucoz.com/bdlab-blogspot/24work/snow/loopy-01.txt" /><br />
<br />
</script></div>
<br />
<br />
<br />
<br />
<div style="text-align: center;">
Falling old-01 : <img alt="Falling old" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjKNLuK-90LTMc98BYrVC9BbbVzZ0cE_3dTqOx5Hv16pOPQi__Npu5wjGvj7GwpWjFOLNIyPQv9dlmg_f8RgSlS5IU_5fOErFFGI0sT-mlrmii7XJjdsUR7YIU_xKyTGTu5abx-KxsdHQ0/s1600/old-01.gif" /></div>
<br />
<br />
<div class="code">
<a href="http://24work.blogspot.com" target="_blank" title="Blogger Widgets"><img src="http://safir85.ucoz.com/24work-blogspot/cursor-24work-10.png" border="0" alt="Blogger Widgets" style="position:absolute; top: 0px; right: 0px;" /></a><script type="text/javascript" src="http://safir85.ucoz.com/bdlab-blogspot/24work/snow/old-01.txt" /><br />
<br />
</script></div>
<br />
<br />
<div style="text-align: center;">
Falling rose-01 : <img alt="Falling rose" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEinjwDOk1Ixj0sPik9WsDHHBatAWSgi5d1cU_lVvpgWLqmDUkZiRxCUSn4CMewpK0gxXstxShxippqvidPkB4PJS11eCWJAlIuN11yJPFMb_KjqTCH0TKBqNPHEN0GgfoQFv4O3q0uBnBM/s1600/rose-01.gif" /></div>
<br />
<br />
<div class="code">
<a href="http://24work.blogspot.com" target="_blank" title="Blogger Widgets"><img src="http://safir85.ucoz.com/24work-blogspot/cursor-24work-10.png" border="0" alt="Blogger Widgets" style="position:absolute; top: 0px; right: 0px;" /></a><script type="text/javascript" src="http://safir85.ucoz.com/bdlab-blogspot/24work/snow/rose-01.txt" /><br />
<br />
</script></div>
<br />
<br />
<div style="text-align: center;">
Falling santa-0-0-01 : <img alt="Falling santa" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgnZJuX_ysyNlq_Z3T_H6idhIp_WgDSmVYhidnfr6AeNn7yj7yue63EwRTu9V_SINqMtSkGMHPn_6L_Xqu7uSXL5xl5b4i0E4ozqveIGrYZbMmgfNGS84VODkMwt_wLHSkQdRBbHOcXGHc/s1600/santa-0-0-01.gif" /></div>
<br />
<br />
<div class="code">
<a href="http://24work.blogspot.com" target="_blank" title="Blogger Widgets"><img src="http://safir85.ucoz.com/24work-blogspot/cursor-24work-10.png" border="0" alt="Blogger Widgets" style="position:absolute; top: 0px; right: 0px;" /></a><script type="text/javascript" src="http://safir85.ucoz.com/bdlab-blogspot/24work/snow/santa-0-0-01.txt" /><br />
<br />
</script></div>
<br />
<br />
<div style="text-align: center;">
Falling smiley-alien006-01 : <img alt="Falling smiley ali" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgzHaFyulOHKFTyblXBV5KmA6rtdyehdyQw2JQ0ZES_i9vAprQ4eyuBOavU6kWo94INLoirj3cOu7tFaKgdzuJc5CpfjWBUhrv8dQJYqK_sOePZk-K8nBUU0My1RG4tIfTQgEH20WF1hHY/s1600/smiley-alien006-01.gif" /></div>
<br />
<br />
<div class="code">
<a href="http://24work.blogspot.com" target="_blank" title="Blogger Widgets"><img src="http://safir85.ucoz.com/24work-blogspot/cursor-24work-10.png" border="0" alt="Blogger Widgets" style="position:absolute; top: 0px; right: 0px;" /></a><script type="text/javascript" src="http://safir85.ucoz.com/bdlab-blogspot/24work/snow/smiley-alien006-01.txt" /><br />
<br />
</script></div>
<br />
<br />
<br />
<div style="text-align: center;">
Falling smiley-alien010-01 : <img alt="Falling smiley alien" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiDs4CYQaoCLDyhbQH8kWZGByi3sLC1ROp3Rm_O1SodlZkn2Jcf_EYYC6eN9lOvUblzIckEn3xfU3AeyPikfVZ5MoeB7om3QgC5nNZJAQ7RgunZJWOzNujOjpRg9khadm0gKMSUhGKEUmU/s1600/smiley-alien010-01.gif" /></div>
<br />
<br />
<div class="code">
<a href="http://24work.blogspot.com" target="_blank" title="Blogger Widgets"><img src="http://safir85.ucoz.com/24work-blogspot/cursor-24work-10.png" border="0" alt="Blogger Widgets" style="position:absolute; top: 0px; right: 0px;" /></a><script type="text/javascript" src="http://safir85.ucoz.com/bdlab-blogspot/24work/snow/smiley-alien010-01.txt" /><br />
<br />
</script></div>
<br />
<br />
<br />
<div style="text-align: center;">
Falling smiley-angelic005-01 : <img alt="Falling smiley angelic" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEixkZwQ0v1T4INK1b7ok32xui9RzQs-qIkGs7Rp5a29RDvbQLdZmLOJld_oLXQYf7uxKOjjd3WgPhTWXXn8qLN1v5ZC9QD1tCvBeeyWr5UQIIBHS0O3SmDa2mNWnVLFKeTb-QVcIa31M8Y/s1600/smiley-angelic005-01.gif" /></div>
<br />
<br />
<div class="code">
<a href="http://24work.blogspot.com" target="_blank" title="Blogger Widgets"><img src="http://safir85.ucoz.com/24work-blogspot/cursor-24work-10.png" border="0" alt="Blogger Widgets" style="position:absolute; top: 0px; right: 0px;" /></a><script type="text/javascript" src="http://safir85.ucoz.com/bdlab-blogspot/24work/snow/smiley-angelic005-01.txt" /><br />
<br />
</script></div>
<br />
<br />
<div style="text-align: center;">
Falling smiley-angry030-01 : <img alt="Falling smiley angry" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgXQR50d1SfTDDioeeANvk647T0wh-WUem6eZIOuiYYnkkME076jes54ZYNahpTpM0tqaj6UDwDm8gg1tS4-sgrU7mal_hXqu0jdOMzdISdKPMujMbbgZjcAUtHSu7Uk5ORI_yuYp2V100/s1600/smiley-angry030-01.gif" /></div>
<br />
<br />
<div class="code">
<a href="http://24work.blogspot.com" target="_blank" title="Blogger Widgets"><img src="http://safir85.ucoz.com/24work-blogspot/cursor-24work-10.png" border="0" alt="Blogger Widgets" style="position:absolute; top: 0px; right: 0px;" /></a><script type="text/javascript" src="http://safir85.ucoz.com/bdlab-blogspot/24work/snow/smiley-angry030-01.txt" /><br />
<br />
</script></div>
<br />
<br />
<div style="text-align: center;">
Falling smiley-bounce002-01 : <img alt="Falling smiley bounce" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjk4_aTc47CQamIMSw4S5rULqK8IFR31whEEk91nDWl46K4Ge78ou4YeRjxJk73WEZat63k-am_kkLNvpkPauAUkmNvXPHeshXYap5jrD0OS7KPRzOZe4TLN0pnmVsr5rxazhzYhNJB_xU/s1600/smiley-bounce002-01.gif" /></div>
<br />
<br />
<div class="code">
<a href="http://24work.blogspot.com" target="_blank" title="Blogger Widgets"><img src="http://safir85.ucoz.com/24work-blogspot/cursor-24work-10.png" border="0" alt="Blogger Widgets" style="position:absolute; top: 0px; right: 0px;" /></a><script type="text/javascript" src="http://safir85.ucoz.com/bdlab-blogspot/24work/snow/smiley-bounce002-01.txt" /><br />
<br />
</script></div>
<br />
<br />
<div style="text-align: center;">
Falling smiley-bounce008-01 : <img alt="Falling smiley bounce" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjU0FrrsfAEXW22sXS5swNg2ERkDBemaNyI_4XMyc6smOuRsf5JdV7xM9a2h3S6aPd-Gaoy9pSOuXeAzcTUgCEmPG9PIizr-MKmfuYomV4t2whneWcGIwAn9kE-9bBNqPdr7yUAs4EBdsw/s1600/smiley-bounce008-01.gif" /></div>
<br />
<br />
<div class="code">
<a href="http://24work.blogspot.com" target="_blank" title="Blogger Widgets"><img src="http://safir85.ucoz.com/24work-blogspot/cursor-24work-10.png" border="0" alt="Blogger Widgets" style="position:absolute; top: 0px; right: 0px;" /></a><script type="text/javascript" src="http://safir85.ucoz.com/bdlab-blogspot/24work/snow/smiley-bounce008-01.txt" /><br />
<br />
</script></div>
<br />
<br />
<br />
<div style="text-align: center;">
Falling smiley-char018-01 : <img alt="Falling smiley char" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjr1Y5qBQ7oo_PMQkc4efsdSOTUxP3JK99D9TtZ7QqmmTMJXstZPIYL1HUWFnVFCxGUZoQ65L3nyI5Lu3o361pY0OmFz6k8Mz22PV7EZX28Y5dX8K9_atI9zAAjRTx2QTr9QMsZmijv2Pw/s1600/smiley-char018-01.gif" /></div>
<br />
<br />
<div class="code">
<a href="http://24work.blogspot.com" target="_blank" title="Blogger Widgets"><img src="http://safir85.ucoz.com/24work-blogspot/cursor-24work-10.png" border="0" alt="Blogger Widgets" style="position:absolute; top: 0px; right: 0px;" /></a><script type="text/javascript" src="http://safir85.ucoz.com/bdlab-blogspot/24work/snow/smiley-char018-01.txt" /><br />
<br />
</script></div>
<br />
<br />
<br />
<div style="text-align: center;">
Falling smiley-char023-01 : <img alt="Falling smiley char" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgWGNYYlMyBcyCh1yGi6o_upuz4PjWmfICLFXqnN5Oc0IwQ0CrYBoNjvkPGaobYLih28-kpoqpF0Kq6LrzIcviDo5FtyErviBJIhHdi4WZGY83r1yOOqZoop6H38VZsCaHJaVXCkWB2JK0/s1600/smiley-char023-01.gif" /></div>
<br />
<br />
<div class="code">
<a href="http://24work.blogspot.com" target="_blank" title="Blogger Widgets"><img src="http://safir85.ucoz.com/24work-blogspot/cursor-24work-10.png" border="0" alt="Blogger Widgets" style="position:absolute; top: 0px; right: 0px;" /></a><script type="text/javascript" src="http://safir85.ucoz.com/bdlab-blogspot/24work/snow/smiley-char023-01.txt" /><br />
<br />
</script></div>
<br />
<br />
<br />
<div style="text-align: center;">
Falling smiley-char026-01 : <img alt="Falling smiley char" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgIm3VjeMjzIbMW_AGeFr9h4FK7Ffi2pLvqAj2SEW1LtBgzfPIs_AX-44U35_bHhfDWBlLO98T7_yVEfiRG1xsxaRMzK-rLH9VAiSxHDXMJ-SN1prXSQU_hOCjAtO5-f7uVsyV60Ib_vu8/s1600/smiley-char026-01.gif" /></div>
<br />
<br />
<div class="code">
<a href="http://24work.blogspot.com" target="_blank" title="Blogger Widgets"><img src="http://safir85.ucoz.com/24work-blogspot/cursor-24work-10.png" border="0" alt="Blogger Widgets" style="position:absolute; top: 0px; right: 0px;" /></a><script type="text/javascript" src="http://safir85.ucoz.com/bdlab-blogspot/24work/snow/smiley-char026-01.txt" /><br />
<br />
</script></div>
<br />
<br />
<br />
<div style="text-align: center;">
Falling smiley-char055-01 : <img alt="Falling smiley char" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhjtW0hGycI4GpCowfYrpwKP8ahX-pNFmS7Qya2cZnSoYU1V-p2Ia-bCCledcZc-rPGeQBJXwRAN7MQaUPhxOuHt_21kURfRdFf-6Qf7K5514zupNnKIttuE_2oX2BnaoFkmhyphenhyphenr7iN34Do/s1600/smiley-char055-01.gif" /></div>
<br />
<br />
<div class="code">
<a href="http://24work.blogspot.com" target="_blank" title="Blogger Widgets"><img src="http://safir85.ucoz.com/24work-blogspot/cursor-24work-10.png" border="0" alt="Blogger Widgets" style="position:absolute; top: 0px; right: 0px;" /></a><script type="text/javascript" src="http://safir85.ucoz.com/bdlab-blogspot/24work/snow/smiley-char055-01.txt" /><br />
<br />
</script></div>
<br />
<br />
<div style="text-align: center;">
Falling smiley-char056-01 : <img alt="Falling smiley char" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiXUUH7Mz-4Rzt2P9U2jo1kUdHopeyynRZI0TQTes8P1nbNwrZXpt_6MQ5H4aAOaNI0hjXOOKaUscF85tjpLaHoKlMya1Y5GFLKbyiVxxFCTNvA77O4JmGMjg3wgwBgir84kbFO61q2w_s/s1600/smiley-char056-01.gif" /></div>
<br />
<br />
<div class="code">
<a href="http://24work.blogspot.com" target="_blank" title="Blogger Widgets"><img src="http://safir85.ucoz.com/24work-blogspot/cursor-24work-10.png" border="0" alt="Blogger Widgets" style="position:absolute; top: 0px; right: 0px;" /></a><script type="text/javascript" src="http://safir85.ucoz.com/bdlab-blogspot/24work/snow/smiley-char056-01.txt" /><br />
<br />
</script></div>
<br />
<br />
<div style="text-align: center;">
Falling smiley-char078-01 : <img alt="Falling smiley char" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjz77ooRtsWNgCzdbmAYt0rVXda8bFKeKF0pIELKkHUpkfi8ghI3aXQQ4gcl9jMJSLM1fqQLyu_-Wo9Cyit-d8AGr0BstUqrwTMmhpqsmjdcILAGemWEE7f_qLY-75J0b-i8P2eplUzirY/s1600/smiley-char078-01.gif" /></div>
<br />
<br />
<div class="code">
<a href="http://24work.blogspot.com" target="_blank" title="Blogger Widgets"><img src="http://safir85.ucoz.com/24work-blogspot/cursor-24work-10.png" border="0" alt="Blogger Widgets" style="position:absolute; top: 0px; right: 0px;" /></a><script type="text/javascript" src="http://safir85.ucoz.com/bdlab-blogspot/24work/snow/smiley-char078-01.txt" /><br />
<br />
</script></div>
<br />
<br />
<br />
<div style="text-align: center;">
Falling smiley-char102-01 : <img alt="Falling smiley char" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi3kiyto9JUza-9MQaBA9HMjj3-T_mfz_8OpF4jY1Gsp3uaTaVOZuovYE-rIwYeJjg_PfrBIYA8P4NPdNmseH9JPhRBpU24uhRrD_CYaFCQFBLS_TZkyah4oYDBH6Cqs7zfLXHiAUplheI/s1600/smiley-char102-01.gif" /></div>
<br />
<br />
<div class="code">
<a href="http://24work.blogspot.com" target="_blank" title="Blogger Widgets"><img src="http://safir85.ucoz.com/24work-blogspot/cursor-24work-10.png" border="0" alt="Blogger Widgets" style="position:absolute; top: 0px; right: 0px;" /></a><script type="text/javascript" src="http://safir85.ucoz.com/bdlab-blogspot/24work/snow/smiley-char102-01.txt" /><br />
<br />
</script></div>
<br />
<br />
<div style="text-align: center;">
Falling smiley-char103-01 : <img alt="Falling smiley char" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiWdOu_0RP6i_AZEWq2dyv9jX7J0PQT_PxZO5PSmz72JTD8v60DumYfoWOQvbrewRd-iC8hCf8cNY86bNRG-jnu5Fd49hkWdBMC8UpPeNtMPP_s4aFUB3gmjzqWco6TehaouVK8L2Er2-A/s1600/smiley-char103-01.gif" /></div>
<br />
<br />
<div class="code">
<a href="http://24work.blogspot.com" target="_blank" title="Blogger Widgets"><img src="http://safir85.ucoz.com/24work-blogspot/cursor-24work-10.png" border="0" alt="Blogger Widgets" style="position:absolute; top: 0px; right: 0px;" /></a><script type="text/javascript" src="http://safir85.ucoz.com/bdlab-blogspot/24work/snow/smiley-char103-01.txt" /><br />
<br />
</script></div>
<br />
<br />
<br />
<div style="text-align: center;">
Falling smiley-char124-01 : <img alt="Falling smiley char" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhfFPh3sTWaLk8UOqcvDX5q_YUNHrOfrhqVERgIY62lneTm4SN4TaZjK68CVeHs1zEfkqZAPL3FAwgQWWetPCT2CDaCik8nlFaFKQ4zNLieAwH_FRhxANqwZXKaTiO9qoY1UIrYY6ShlZM/s1600/smiley-char124-01.gif" /></div>
<br />
<br />
<div class="code">
<a href="http://24work.blogspot.com" target="_blank" title="Blogger Widgets"><img src="http://safir85.ucoz.com/24work-blogspot/cursor-24work-10.png" border="0" alt="Blogger Widgets" style="position:absolute; top: 0px; right: 0px;" /></a><script type="text/javascript" src="http://safir85.ucoz.com/bdlab-blogspot/24work/snow/smiley-char124-01.txt" /><br />
<br />
</script></div>
<br />
<br />
<div style="text-align: center;">
Falling smiley-char128-01 : <img alt="Falling smiley char" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgmq868CMoNLS8C9Ei7QOq7JqnF29ycYdTupNGwZALOlFZyHRv5DRzwS3YZ9fpsoUEWeQbonf97UVzEmtjUdEPh716uh10lwakEMehgiPvUrshyphenhyphenFaoDGF2B5Px4W0LhmUvhhGM_1VOGxIg/s1600/smiley-char128-01.gif" /></div>
<br />
<br />
<div class="code">
<a href="http://24work.blogspot.com" target="_blank" title="Blogger Widgets"><img src="http://safir85.ucoz.com/24work-blogspot/cursor-24work-10.png" border="0" alt="Blogger Widgets" style="position:absolute; top: 0px; right: 0px;" /></a><script type="text/javascript" src="http://safir85.ucoz.com/bdlab-blogspot/24work/snow/smiley-char128-01.txt" /><br />
<br />
</script></div>
<br />
<br />
<br />
<div style="text-align: center;">
Falling smiley-char136-01 : <img alt="Falling smiley char" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiZ239CiKk-Y9K3E_M8_LRg9zgPZpGeJl4PzmJEB9RmqseC6ctGnz7JS6V5hyqWJotxUura8evyDfmp_pkpLBtGsNR9ItLVktpMb4OJ7dk0eWf0fnJ84xS_ZbhvAjg6ZQsZ8TmV8GtloCk/s1600/smiley-char136-01.gif" /></div>
<br />
<br />
<div class="code">
<a href="http://24work.blogspot.com" target="_blank" title="Blogger Widgets"><img src="http://safir85.ucoz.com/24work-blogspot/cursor-24work-10.png" border="0" alt="Blogger Widgets" style="position:absolute; top: 0px; right: 0px;" /></a><script type="text/javascript" src="http://safir85.ucoz.com/bdlab-blogspot/24work/snow/smiley-char136-01.txt" /><br />
<br />
</script></div>
<br />
<br />
<br />
<div style="text-align: center;">
Falling smiley-cool05-01 : <img alt="Falling smiley char" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEic-gad-8QE2KRZNDXx4o5rVqyOUUMORjXQ_gSS-AfXSkDhKy5Cu9iSzJ1PWLlYXj802-QvC1Q10GZPbdLoPkhFdpCQSom4ZGY-qhWa3ubqvD5qYzwBtQMnhcah-GxcQU1_zD7bI_eD-9M/s1600/smiley-cool05-01.gif" /></div>
<br />
<br />
<div class="code">
<a href="http://24work.blogspot.com" target="_blank" title="Blogger Widgets"><img src="http://safir85.ucoz.com/24work-blogspot/cursor-24work-10.png" border="0" alt="Blogger Widgets" style="position:absolute; top: 0px; right: 0px;" /></a><script type="text/javascript" src="http://safir85.ucoz.com/bdlab-blogspot/24work/snow/smiley-cool05-01.txt" /><br />
<br />
</script></div>
<br />
<br />
<br />
<div style="text-align: center;">
Falling smiley-dance009-01 : <img alt="Falling smiley dance" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiE5FE6UldiDO5VN4oHt3ckc4EL8oAcMfdCpVV1VpWjLs9AHSeMcr6RBY9_5pyulFBIVzshDF96nouB5S9lB4tNLXyU17dNfzbFZj5qBBfbDGKqIyh7fW0B9b4Wk39C5uqxE1oSurn7nWE/s1600/smiley-dance009-01.gif" /></div>
<br />
<br />
<div class="code">
<a href="http://24work.blogspot.com" target="_blank" title="Blogger Widgets"><img src="http://safir85.ucoz.com/24work-blogspot/cursor-24work-10.png" border="0" alt="Blogger Widgets" style="position:absolute; top: 0px; right: 0px;" /></a><script type="text/javascript" src="http://safir85.ucoz.com/bdlab-blogspot/24work/snow/smiley-dance009-01.txt" /><br />
<br />
</script></div>
<br />
<br />
<br />
<div style="text-align: center;">
Falling smiley-excited001-01 : <img alt="Falling smiley excited" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgTaQGecOue4alfObHd7ZCgE63A7m6E85ICjZHgG4ugf2EQOWUCb5GM_IGaedbdQ0eOE4SE8T2VkNmE0ARzvoTNDPrxJWFUSy-e9hQJSVSqc1A1z0MG9-3zhzWt8Ecs7Xp-zU5U8tQiuzI/s1600/smiley-excited001-01.gif" /></div>
<br />
<br />
<div class="code">
<a href="http://24work.blogspot.com" target="_blank" title="Blogger Widgets"><img src="http://safir85.ucoz.com/24work-blogspot/cursor-24work-10.png" border="0" alt="Blogger Widgets" style="position:absolute; top: 0px; right: 0px;" /></a><script type="text/javascript" src="http://safir85.ucoz.com/bdlab-blogspot/24work/snow/smiley-excited001-01.txt" /><br />
<br />
</script></div>
<br />
<br />
<br />
<div style="text-align: center;">
Falling smiley-greet008-01 : <img alt="Falling smiley greet" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhoNmvxdXOszB03-dIGUWXke7BgGGcKLT0Cpj48Am4zzx9Fr1xm_ggH9qU3U2oKMMbMKcZIR1ldBCf1WUKhvJux5dfkzv-4GK9YagMeBa_P_u4AuFOvs42R4CnWZd0dlfYB28NilJnyFW8/s1600/smiley-greet008-01.gif" /></div>
<br />
<br />
<div class="code">
<a href="http://24work.blogspot.com" target="_blank" title="Blogger Widgets"><img src="http://safir85.ucoz.com/24work-blogspot/cursor-24work-10.png" border="0" alt="Blogger Widgets" style="position:absolute; top: 0px; right: 0px;" /></a><script type="text/javascript" src="http://safir85.ucoz.com/bdlab-blogspot/24work/snow/smiley-greet008-01.txt" /><br />
<br />
</script></div>
<br />
<br />
<br />
<div style="text-align: center;">
Falling smiley-greet010-01 : <img alt="Falling smiley greet" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiKxRoD6-mvAow6_xz3DSWmNlZO6n5IjI2eqUAXNCo58tlpmdWyw096Lnn5dMarxdmAnKRYY1Si6MycfYETJOosMwjxzU4paqfMfS63BsiOXMBRJcBw7PspRTZwsl-5_pebdxgtFjAcZCY/s1600/smiley-greet010-01.gif" /></div>
<br />
<br />
<div class="code">
<a href="http://24work.blogspot.com" target="_blank" title="Blogger Widgets"><img src="http://safir85.ucoz.com/24work-blogspot/cursor-24work-10.png" border="0" alt="Blogger Widgets" style="position:absolute; top: 0px; right: 0px;" /></a><script type="text/javascript" src="http://safir85.ucoz.com/bdlab-blogspot/24work/snow/smiley-greet010-01.txt" /><br />
<br />
</script></div>
<br />
<br />
<br />
<div style="text-align: center;">
Falling smiley-happy005-01 : <img alt="Falling smiley happy" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjWr_NxYhfe6d6ljfq5lgKhOOO8csRDDu7v_Xgk5FVQckEkZrNsXm31GKHdiMzQ-OYX9iPyjgmSeRBguFi2Vq9TEp7X7iirTa06_ixlYbXiXKGDIzYOao5bs8o8_M6_QZTUkYDstcVUtAQ/s1600/smiley-happy005-01.gif" /></div>
<br />
<br />
<div class="code">
<a href="http://24work.blogspot.com" target="_blank" title="Blogger Widgets"><img src="http://safir85.ucoz.com/24work-blogspot/cursor-24work-10.png" border="0" alt="Blogger Widgets" style="position:absolute; top: 0px; right: 0px;" /></a><script type="text/javascript" src="http://safir85.ucoz.com/bdlab-blogspot/24work/snow/smiley-happy005-01.txt" /><br />
<br />
</script></div>
<br />
<br />
<br />
<div style="text-align: center;">
Falling smiley-happy032-01 : <img alt="Falling smiley happy" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgz5GhVZwnlClX4VUIWEmd9WSuVQGbDAk8fjwrUCX2L6wZM641PgpjgrmNa_tJTKFgcanqNF8bQKvvGUezs_V7GuvRrgM-COz07Z4iE94RS9ojkFwweUsdcS0QUke5bIfm-ht2yHKV7mjo/s40/smiley-happy032-01.gif" /></div>
<br />
<br />
<div class="code">
<a href="http://24work.blogspot.com" target="_blank" title="Blogger Widgets"><img src="http://safir85.ucoz.com/24work-blogspot/cursor-24work-10.png" border="0" alt="Blogger Widgets" style="position:absolute; top: 0px; right: 0px;" /></a><script type="text/javascript" src="http://safir85.ucoz.com/bdlab-blogspot/24work/snow/smiley-happy032-01.txt" /><br />
<br />
</script></div>
<br />
<br />
<div style="text-align: center;">
Falling smiley-love009-01 : <img alt="Falling smiley love" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhMA6Ls3i7CBqpRZ4-TcM6P86oVl4ydh7OWCt-1v3Rc-LCFAlmVadyKj3yPPFqBYKBTOBdKotQSTMd13M0XuC0URk2dw-j3vrRmw016PREXnCZANmxzf3yQXI9ixkme6vGWomSVv98iT2s/s1600/smiley-love009-01.gif" /></div>
<br />
<br />
<div class="code">
<a href="http://24work.blogspot.com" target="_blank" title="Blogger Widgets"><img src="http://safir85.ucoz.com/24work-blogspot/cursor-24work-10.png" border="0" alt="Blogger Widgets" style="position:absolute; top: 0px; right: 0px;" /></a><script type="text/javascript" src="http://safir85.ucoz.com/bdlab-blogspot/24work/snow/smiley-love009-01.txt" /><br />
<br />
</script></div>
<br />
<br />
<br />
<div style="text-align: center;">
Falling smiley-rpg023-01 : <img alt="Falling smiley rpg" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh5Bmg-wUZx_f1JhXIpJbrbr_UhsXqu9j5TE8_oKjTnVMfeAHJlMlvvlQ0DxdeEK_avWdDZgX-MjZhR9SKf235YzCs6XWIFvSZywSgPTmxwJpR5F8gCd879eCARtMKb0yGbN1vIE7lg7Rs/s1600/smiley-rpg023-01.gif" /></div>
<br />
<br />
<div class="code">
<a href="http://24work.blogspot.com" target="_blank" title="Blogger Widgets"><img src="http://safir85.ucoz.com/24work-blogspot/cursor-24work-10.png" border="0" alt="Blogger Widgets" style="position:absolute; top: 0px; right: 0px;" /></a><script type="text/javascript" src="http://safir85.ucoz.com/bdlab-blogspot/24work/snow/smiley-rpg023-01.txt" /><br />
<br />
</script></div>
<br />
<br />
<br />
<br />
<div style="text-align: center;">
Falling smiley-rpg031-01 : <img alt="Falling smiley rpg" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjb0ky7v-BoLMHdgVom1GBBeLTsXK2PebhTNAx6upiKimB1PZQ4cESn6r9UjWM3vqowU5gitlnBojAOoA0EYA3kZi0oQUiHjndt4Dl49WVeuoFBUFFGUhvqM41N-hU-zY7eQgYIxWqsIUY/s1600/smiley-rpg031-01.gif" /></div>
<br />
<br />
<div class="code">
<a href="http://24work.blogspot.com" target="_blank" title="Blogger Widgets"><img src="http://safir85.ucoz.com/24work-blogspot/cursor-24work-10.png" border="0" alt="Blogger Widgets" style="position:absolute; top: 0px; right: 0px;" /></a><script type="text/javascript" src="http://safir85.ucoz.com/bdlab-blogspot/24work/snow/smiley-rpg031-01.txt" /><br />
<br />
</script></div>
<br />
<br />
<br />
<div style="text-align: center;">
Falling smiley-sleep004-01 : <img alt="Falling smiley sleep" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgSWPq3kVKXWXIMUeSjV8uPaY82dMIieE5VONc8oFn_Iyr1AH4cjrygfwRs5G4Z_zFCpnaJhIzxLNoYLDhc4WSrAJjL1YIm1LgdaP4AEYRbr4PSFQjyckq6Qfu_vM6TH04BVnrDl8dkzU8/s1600/smiley-sleep004-01.gif" /></div>
<br />
<br />
<div class="code">
<a href="http://24work.blogspot.com" target="_blank" title="Blogger Widgets"><img src="http://safir85.ucoz.com/24work-blogspot/cursor-24work-10.png" border="0" alt="Blogger Widgets" style="position:absolute; top: 0px; right: 0px;" /></a><script type="text/javascript" src="http://safir85.ucoz.com/bdlab-blogspot/24work/snow/smiley-sleep004-01.txt" /><br />
<br />
</script></div>
<br />
<br />
<div style="text-align: center;">
Falling smiley-stargate021-01 : <img alt="Falling smiley stargate" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjtK6DxzvHxIwiMFcm3QDqT9zeeX4i9grS1TbrR-xKXLptqpTu8TuGM3emdd_G-3PRK1S44hcS_11okIhludsWyGTZRaYx1W7orVQov1u0TVnN40D4htoobQpCvcdbMC3edrpyL7P-O3hI/s1600/smiley-stargate021-01.gif" /></div>
<br />
<br />
<div class="code">
<a href="http://24work.blogspot.com" target="_blank" title="Blogger Widgets"><img src="http://safir85.ucoz.com/24work-blogspot/cursor-24work-10.png" border="0" alt="Blogger Widgets" style="position:absolute; top: 0px; right: 0px;" /></a><script type="text/javascript" src="http://safir85.ucoz.com/bdlab-blogspot/24work/snow/smiley-stargate021-01.txt" /><br />
<br />
</script></div>
<br />
<br />
<div style="text-align: center;">
Falling smiley-sw022-01 : <img alt="Falling smiley sw" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj3JgjIpdfRN1jciKTpXDptwW87-0s9SHyyQNueNgQv7BEweHbxLEkEVEq8vsgldhYQjM7X0PyFdbUKXgyi87QTXLy68aZXmhQFkCCPljEkb7u_aFdWdORFbbfxRuh_NfKayadZyCNT7gY/s1600/smiley-sw022-01.gif" /></div>
<br />
<br />
<div class="code">
<a href="http://24work.blogspot.com" target="_blank" title="Blogger Widgets"><img src="http://safir85.ucoz.com/24work-blogspot/cursor-24work-10.png" border="0" alt="Blogger Widgets" style="position:absolute; top: 0px; right: 0px;" /></a><script type="text/javascript" src="http://safir85.ucoz.com/bdlab-blogspot/24work/snow/smiley-sw022-01.txt" /><br />
<br />
</script></div>
<br />
<br />
<br />
<div style="text-align: center;">
Falling smiley-think007-01 : <img alt="Falling smiley think" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgmBrQn1iMYVAFlmO5hltM8V_ut1s3O4U8uBStJ_sXbevpmcsEc1MPMe8BWNPT7YLJSDyEB4C6n9YMQzNyUtNvqCmCyHtmSRk8eKc7DiofjS3GWyxVXXVivk1B7O0nUtGh2cYoOuxqfDak/s1600/smiley-think007-01.gif" /></div>
<br />
<br />
<div class="code">
<a href="http://24work.blogspot.com" target="_blank" title="Blogger Widgets"><img src="http://safir85.ucoz.com/24work-blogspot/cursor-24work-10.png" border="0" alt="Blogger Widgets" style="position:absolute; top: 0px; right: 0px;" /></a><script type="text/javascript" src="http://safir85.ucoz.com/bdlab-blogspot/24work/snow/smiley-think007-01.txt" /><br />
<br />
</script></div>
<br />
<br />
<br />
<div style="text-align: center;">
Falling smiley-transport019-01 : <img alt="Falling smiley transport" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj7BJz94N9_DY1vA10O5dbHssEo-R3SUmKq4tOm1mg9wVVVT_pCKf9FjgvL3Sn6U6tBUYH5CxHCPFhFehbgO886FyjzUmI99K_sCwtQUBS0TXyOZkNuiIUtrugan4_PFblWgotwJohk8Ew/s1600/smiley-transport019-01.gif" /></div>
<br />
<br />
<div class="code">
<a href="http://24work.blogspot.com" target="_blank" title="Blogger Widgets"><img src="http://safir85.ucoz.com/24work-blogspot/cursor-24work-10.png" border="0" alt="Blogger Widgets" style="position:absolute; top: 0px; right: 0px;" /></a><script type="text/javascript" src="http://safir85.ucoz.com/bdlab-blogspot/24work/snow/smiley-transport019-01.txt" /><br />
<br />
</script></div>
<br />
<br />
<br />
<div style="text-align: center;">
Falling smiley-transport026-01 : <img alt="Falling smiley transport" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiPPK3pimUNPWRadYCY1raoErmxxhj19hzzYF8l2wftIdTO-EyhL8UUQpn-OdHjr4_TrTp-CY2XB_K8FcWuDJAgDYYYTKTVBehd2Mk7w-tAaK1MkReKHqXIafL4L9VbU9yJODIXV-_RV-k/s1600/smiley-transport026-01.gif" /></div>
<br />
<br />
<div class="code">
<a href="http://24work.blogspot.com" target="_blank" title="Blogger Widgets"><img src="http://safir85.ucoz.com/24work-blogspot/cursor-24work-10.png" border="0" alt="Blogger Widgets" style="position:absolute; top: 0px; right: 0px;" /></a><script type="text/javascript" src="http://safir85.ucoz.com/bdlab-blogspot/24work/snow/smiley-transport026-01.txt" /><br />
<br />
</script></div>
<br />
<br />
<div style="text-align: center;">
Falling smiley-transport027-01 : <img alt="Falling smiley transport" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiWZYjHw-SqxQrkA9WsgO-692PW4WHt7XI9a8-7fF9VZ_WaesrWOluVpjc9-3mbumdbPe-Ykw2E6W3IB7vO7uRw0VGvvYnoZPpmZ8s3FdPlzsgJAQChr3c8jikji6ohxiXLbHnC5XGYA6I/s1600/smiley-transport027-01.gif" /></div>
<br />
<br />
<div class="code">
<a href="http://24work.blogspot.com" target="_blank" title="Blogger Widgets"><img src="http://safir85.ucoz.com/24work-blogspot/cursor-24work-10.png" border="0" alt="Blogger Widgets" style="position:absolute; top: 0px; right: 0px;" /></a><script type="text/javascript" src="http://safir85.ucoz.com/bdlab-blogspot/24work/snow/smiley-transport027-01.txt" /><br />
<br />
</script></div>
<br />
<br />
<br />
<div style="text-align: center;">
Falling tantrum-01 : <img alt="Falling tantrum" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiAO5v3IzCFizYlzD04YNyKcGgMGhvQO5Yr2Tjsvd0s2aR-QjtCs_HiI0NxkmeSfqw3EIvUwCeFFyEEyqHLrOb4eH8WLBtUqlcHgF7RgqI1cFAp6fV9LcXLAbNZfmKVyvuaRk68g3bzlqc/s1600/tantrum-01.gif" /></div>
<br />
<br />
<div class="code">
<a href="http://24work.blogspot.com" target="_blank" title="Blogger Widgets"><img src="http://safir85.ucoz.com/24work-blogspot/cursor-24work-10.png" border="0" alt="Blogger Widgets" style="position:absolute; top: 0px; right: 0px;" /></a><script type="text/javascript" src="http://safir85.ucoz.com/bdlab-blogspot/24work/snow/tantrum-01.txt" /><br />
<br />
</script></div>
<br />
<br />
<div style="text-align: center;">
Falling wootrock-01 : <img alt="Falling wootrock" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiwVhJymB2-qiVQKdP2bN0optcW08l2nt33YwlcqkNJlxP0yLJUE_auvcov7b4B_8HkWpWNS1k3kafoTZNBdYfOZ0iNvOrGNxfC5OJAVFXgB_40HNhh3saR3toayUpVHfdUTU1FvFwPu-E/s1600/wootrock-01.gif" /></div>
<br />
<br />
<div class="code">
<a href="http://24work.blogspot.com" target="_blank" title="Blogger Widgets"><img src="http://safir85.ucoz.com/24work-blogspot/cursor-24work-10.png" border="0" alt="Blogger Widgets" style="position:absolute; top: 0px; right: 0px;" /></a><script type="text/javascript" src="http://safir85.ucoz.com/bdlab-blogspot/24work/snow/wootrock-01.txt" /><br />
<br />
</script></div>
<br />
<br />
<br />
<div style="text-align: center;">
Falling Colored Stars : <img alt="Falling Colored Stars" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj7BjopAU19ix2TEa5O0z-q5JlCxa1fzBmYmDiV2yq9zIBfYgsVWoVa7dd8z0J3cr4SNqJTJC_IrqvI-Rh3QHzBU2J-LQXzbulzQ9KMSSoVBkd_w2blyjadXhbXAhrpHLP-eSiBi3fbPLxO/s1600/ColoredStars.gif" /></div>
<br />
<br />
<div class="code">
<a href="http://24work.blogspot.com" target="_blank" title="Blogger Widgets"><img src="http://safir85.ucoz.com/24work-blogspot/cursor-24work-10.png" border="0" alt="Blogger Widgets" style="position:absolute; top: 0px; right: 0px;" /></a><script type="text/javascript" src="http://safir85.ucoz.com/bdlab-blogspot/24work/snow/ColoredStars.txt" /><br />
<br />
</script></div>
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<div style="text-align: center;">
Falling fire Stars : <img alt="Falling fire Stars" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgKXWXdvpnZtk5pVISUlaz8tTkf-F3qJi8Q_QMkxH_eh7II-F8TDkqq2b2UXLB5wVkIM2SOUnpcBbP6OyDwbw4dM8YpbsV_gIfRERc7Akzz2i4rIz5FB-AyZeWRcO7kdqZlRFeNTERXPJWM/s1600/fire-star.gif" /></div>
<br />
<br />
<div class="code">
<a href="http://24work.blogspot.com" target="_blank" title="Blogger Widgets"><img src="http://safir85.ucoz.com/24work-blogspot/cursor-24work-10.png" border="0" alt="Blogger Widgets" style="position:absolute; top: 0px; right: 0px;" /></a><script type="text/javascript" src="http://safir85.ucoz.com/bdlab-blogspot/24work/snow/fireStars.txt" /><br />
<br />
</script></div>
<br />
<br />
<br />
<br />
<br />
<div style="text-align: center;">
Falling Stars : <img alt="Falling Stars" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjJE71dcb9gVoKmohgHW9QTj83eHKej0f5E0yQAIcOW3PkleN5F-jyfNp-MHofSkHJ9o0HTY_egr3wVSot3zoSoLMfqeupefv62QMjMHLlebef7RaEFJ7i8hhEPLjfmF_qgGHKSwwHojU4I/s1600/bdlab-star.gif" /></div>
<br />
<br />
<div class="code">
<a href="http://24work.blogspot.com" target="_blank" title="Blogger Widgets"><img src="http://safir85.ucoz.com/24work-blogspot/cursor-24work-10.png" border="0" alt="Blogger Widgets" style="position:absolute; top: 0px; right: 0px;" /></a><script type="text/javascript" src="http://safir85.ucoz.com/bdlab-blogspot/24work/snow/Stars.txt" /><br />
<br />
</script></div>
<br />
<br />
<br />
<br />
<br />
<br />
<div style="text-align: center;">
Falling Snow flakes 1 : <img alt="Falling Snow flakes" border="0" src="http://i50.tinypic.com/cueu1.jpg" /></div>
<br />
<br />
<div class="code">
<a href="http://24work.blogspot.com" target="_blank" title="Blogger Widgets"><img src="http://safir85.ucoz.com/24work-blogspot/cursor-24work-10.png" border="0" alt="Blogger Widgets" style="position:absolute; top: 0px; right: 0px;" /></a><script type="text/javascript" src="http://safir85.ucoz.com/bdlab-blogspot/24work/snow/Snow_flakes1.txt" /><br />
<br />
</script></div>
<br />
<br />
<br />
<br />
<br />
<div style="text-align: center;">
Falling Snow flakes 2 : <img alt="Falling Snow flakes" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgnx3yWUbj_9_794xogSrH_Gq6saOpP52XxNdn6gbrAs1iFDzs1_wR7HnnUQL4UYU8TyZfmRrn-dkQ8bYEDWXBCqbZGngQCXjQFSwY4YLuf1vsSs-gG40x5IEfEkFvQDcOXdd_tzDcEQJZA/s1600/snowflakes2.gif" /></div>
<br />
<br />
<div class="code">
<a href="http://24work.blogspot.com" target="_blank" title="Blogger Widgets"><img src="http://safir85.ucoz.com/24work-blogspot/cursor-24work-10.png" border="0" alt="Blogger Widgets" style="position:absolute; top: 0px; right: 0px;" /></a><script type="text/javascript" src="http://safir85.ucoz.com/bdlab-blogspot/24work/snow/Snow_flakes2.txt" /><br />
<br />
</script></div>
<br />
<br />
<br />
<br />
<br />
<div style="text-align: center;">
Falling Snow flakes 3 : <img alt="Falling Snow flakes" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjgfKXGIIDuwSWTAwAGAeTO4H7dc9jw85cmWXeLAumdX8huqOx-u79QGaS3eTfor40afcyAdIdCbTw2cOu0wlSbOJDnVwNq8hnaW7WwHTRqqRXoMnTni-ahrqqNBOJUheovV09_-2oxiLca/s1600/snowflakes3.gif" /></div>
<br />
<br />
<div class="code">
<a href="http://24work.blogspot.com" target="_blank" title="Blogger Widgets"><img src="http://safir85.ucoz.com/24work-blogspot/cursor-24work-10.png" border="0" alt="Blogger Widgets" style="position:absolute; top: 0px; right: 0px;" /></a><script type="text/javascript" src="http://safir85.ucoz.com/bdlab-blogspot/24work/snow/Snow_flakes3.txt" /><br />
<br />
</script></div>
<br />
<br />
<br />
<br />
<br />
<div style="text-align: center;">
Falling Snow flakes 4 : <img alt="Falling Snow flakes" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgsEnUKU4fZJ4cHwN__WtYSBDOzCy0TJPBMDvCp7RulkZ-m0TksDsh6SOJfXp5XAiR0YsLF-rjAT9YgDLMZsZQJFlzL5XNWPOPIQRDIiPhatUbDiLoGgCfo4wYKybxwfncKucwCaJsGofkw/s1600/snowflakes4.gif" /></div>
<br />
<br />
<div class="code">
<a href="http://24work.blogspot.com" target="_blank" title="Blogger Widgets"><img src="http://safir85.ucoz.com/24work-blogspot/cursor-24work-10.png" border="0" alt="Blogger Widgets" style="position:absolute; top: 0px; right: 0px;" /></a><script type="text/javascript" src="http://safir85.ucoz.com/bdlab-blogspot/24work/snow/Snow_flakes4.txt" /><br />
<br />
</script></div>
<br />
<br />
<br />
<br />
<br />
<br />
<div style="text-align: center;">
Falling Snow flakes 5 : <img alt="Falling Snow flakes" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhvMctG0mBw_6YRfurnwGZFdjW5vAnFHa0BOE3pvQNXAQ5W2Lbweb5nGSbsQDPFNxQqcja3qOLFkF7ec3exbX13xxiNfyE8d0hoUKO35AE4iSircgXxqMxtgZzameXKFqMEETQ_LvnbXlWq/s1600/snowflakes5.gif" /></div>
<br />
<br />
<div class="code">
<a href="http://24work.blogspot.com" target="_blank" title="Blogger Widgets"><img src="http://safir85.ucoz.com/24work-blogspot/cursor-24work-10.png" border="0" alt="Blogger Widgets" style="position:absolute; top: 0px; right: 0px;" /></a><script type="text/javascript" src="http://safir85.ucoz.com/bdlab-blogspot/24work/snow/Snow_flakes5.txt" /><br />
<br />
</script></div>
<br />
<br />
<br />
<br />
<br />
<div style="text-align: center;">
Falling Snow flakes 6 : <img alt="Falling Snow flakes" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjVZNgSRrjnO9sBwTjoS9O_UH7aDxjTsXTCjl5cph3hOxFb2j0wsEjJ2tCnR8f6QJCLyQ1KmdjwIU4dXVO-9DWN4NIQIseDtsZYUlBzMcCl8t42uOVsCIst_k5gyspeYTEo7Ac3cGCeP9bt/s1600/snowflakes6.gif" /></div>
<br />
<br />
<div class="code">
<a href="http://24work.blogspot.com" target="_blank" title="Blogger Widgets"><img src="http://safir85.ucoz.com/24work-blogspot/cursor-24work-10.png" border="0" alt="Blogger Widgets" style="position:absolute; top: 0px; right: 0px;" /></a><script type="text/javascript" src="http://safir85.ucoz.com/bdlab-blogspot/24work/snow/Snow_flakes6.txt" /><br />
<br />
</script></div>
<br />
<br />
<br />
<br />
<br />
<div style="text-align: center;">
Falling Leaves : <img alt="Falling Leaves" border="0" src="http://i47.tinypic.com/2zs0f44.jpg" /></div>
<br />
<br />
<div class="code">
<a href="http://24work.blogspot.com" target="_blank" title="Blogger Widgets"><img src="http://safir85.ucoz.com/24work-blogspot/cursor-24work-10.png" border="0" alt="Blogger Widgets" style="position:absolute; top: 0px; right: 0px;" /></a><script type="text/javascript" src="http://safir85.ucoz.com/bdlab-blogspot/24work/snow/Falling_Leaves.txt" /><br />
<br />
</script></div>
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<div style="text-align: center;">
Falling Green Leaf : <img alt="Falling Green Leaf" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi1wGCGQ56niPWzyfEgg7_Wy4Qku8-aMTXrBlYTOb7dvyp-as1-4uU88mFc3_r_1mDvJkKIC3YN77kXNzW541cvsb3uNNzah-QrC91tC1T_kFoiYWqw7z_PSd-2fpN9mtHHJ8iQPvfDMPMh/s1600/leaves1.gif" /></div>
<br />
<br />
<div class="code">
<a href="http://24work.blogspot.com" target="_blank" title="Blogger Widgets"><img src="http://safir85.ucoz.com/24work-blogspot/cursor-24work-10.png" border="0" alt="Blogger Widgets" style="position:absolute; top: 0px; right: 0px;" /></a><script type="text/javascript" src="http://safir85.ucoz.com/bdlab-blogspot/24work/snow/Green_Leaf.txt" /><br />
<br />
</script></div>
<br />
<br />
<br />
<br />
<br />
<div style="text-align: center;">
Falling Yellow Leaf : <img alt="Falling Yellow Leaf" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjN3jlyNjbjZeg6nrJmro6TJ5azLsULPTf7hiFzcQd8QZ_pVaMyynlmFfBcREi7gyzdtP7gDDyJnoytqrEouL6ynZ2VQIyCPOcm8aK5SQk0dJcUwtKIayqa7sYJYDPuGrMf-mCp-9aNNkqL/s1600/leaves2.gif" /></div>
<br />
<br />
<div class="code">
<a href="http://24work.blogspot.com" target="_blank" title="Blogger Widgets"><img src="http://safir85.ucoz.com/24work-blogspot/cursor-24work-10.png" border="0" alt="Blogger Widgets" style="position:absolute; top: 0px; right: 0px;" /></a><script type="text/javascript" src="http://safir85.ucoz.com/bdlab-blogspot/24work/snow/Yellow_Leaf.txt" /><br />
<br />
</script></div>
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<div style="text-align: center;">
Falling Greenish : <img alt="Falling Greenish" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjznhgoby-nAxrFfywQyX_yRpI8CvY4lk0b7R_QPycjwZzmHP2ldWHFqTG7WNXjnTf7OCSXb5_Q8ocmy6JbEO1zZmKmwiH6hB3eRNBL0qFnbNx7eVlBXJqSqsKf6CK4exwItTKbZUsbb_1S/s1600/leaves3.gif" /></div>
<br />
<br />
<div class="code">
<a href="http://24work.blogspot.com" target="_blank" title="Blogger Widgets"><img src="http://safir85.ucoz.com/24work-blogspot/cursor-24work-10.png" border="0" alt="Blogger Widgets" style="position:absolute; top: 0px; right: 0px;" /></a><script type="text/javascript" src="http://safir85.ucoz.com/bdlab-blogspot/24work/snow/Greenish.txt" /><br />
<br />
</script></div>
<br />
<br />
<br />
<br />
<br />
<div style="text-align: center;">
Falling Tree Leaf : <img alt="Falling Tree Leaf" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiG7fhUoFS8-kf5C_Ycypi5v2RDwaEYbTdhUUZsT0kJED_JAOU19TRejyCNJw9aXF8kwXKK79a-WyP7Ts50wR_68uHSip3_3v40cPrJQcbXV5RESw509X9Ov0Z2877oiwOGI2gSOyr0kwoE/s1600/leaves5.gif" /></div>
<br />
<br />
<div class="code">
<a href="http://24work.blogspot.com" target="_blank" title="Blogger Widgets"><img src="http://safir85.ucoz.com/24work-blogspot/cursor-24work-10.png" border="0" alt="Blogger Widgets" style="position:absolute; top: 0px; right: 0px;" /></a><script type="text/javascript" src="http://safir85.ucoz.com/bdlab-blogspot/24work/snow/Tree_Leaf.txt" /><br />
<br />
</script></div>
<br />
<br />
<br />
<br />
<br />
<div style="text-align: center;">
Falling Heart 1 : <img alt="Falling Heart" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiVj3BQ-mb8-IvXuKOQd_Lw66Q7WUgw5axTVtoE_uxQS4MqExXOtOeE2VotnpKfEliMGwKRx02y6dRQCwkruBwPhydCLYlO-1NldzQCJ8b3UeNtFO5ZXgqxT2jiDgkLP6-22SqpCsKTMLXY/s1600/Falling+red+heart.gif" /></div>
<br />
<br />
<div class="code">
<a href="http://24work.blogspot.com" target="_blank" title="Blogger Widgets"><img src="http://safir85.ucoz.com/24work-blogspot/cursor-24work-10.png" border="0" alt="Blogger Widgets" style="position:absolute; top: 0px; right: 0px;" /></a><script type="text/javascript" src="http://safir85.ucoz.com/bdlab-blogspot/24work/snow/Heart_1.txt" /><br />
<br />
</script></div>
<br />
<br />
<br />
<br />
<br />
<div style="text-align: center;">
Falling Heart 2 : <img alt="Falling Heart" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEggHNaAOsErQ3GszkfQaX8Dm3h8pyAItryMGeg9MhO6PnovqbgjwSCjrkHwb82WsqLfUXUpzmn5u269XcayldtAPIf0iXjnboLar22uWNwXvw3bFvCYgdiFwVHlHrcF_yXAROeEv8g1jVsU/s1600/valentinesday2.gif" /></div>
<br />
<br />
<div class="code">
<a href="http://24work.blogspot.com" target="_blank" title="Blogger Widgets"><img src="http://safir85.ucoz.com/24work-blogspot/cursor-24work-10.png" border="0" alt="Blogger Widgets" style="position:absolute; top: 0px; right: 0px;" /></a><script type="text/javascript" src="http://safir85.ucoz.com/bdlab-blogspot/24work/snow/Heart_2.txt" /><br />
<br />
</script></div>
<br />
<br />
<br />
<br />
<br />
<div style="text-align: center;">
Falling Heart 3 : <img alt="Falling Heart" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiQ3K7_nNULO3t5jL7lpFh7T2rmTkNM5UyC2rbrr1qvTslqzPO3U9Rj6954nNRM1-2fY0B-DZPSKp9jyMOGdZlo_Hpc8_hyphenhyphen8ZO5iphFrSKD5NY7o7Chyphenhyphenc8q-B3Pj95NWoL1vW8bIyr8njni/s1600/valentinesday3.gif" /></div>
<br />
<br />
<div class="code">
<a href="http://24work.blogspot.com" target="_blank" title="Blogger Widgets"><img src="http://safir85.ucoz.com/24work-blogspot/cursor-24work-10.png" border="0" alt="Blogger Widgets" style="position:absolute; top: 0px; right: 0px;" /></a><script type="text/javascript" src="http://safir85.ucoz.com/bdlab-blogspot/24work/snow/Heart_3.txt" /><br />
<br />
</script></div>
<br />
<br />
<br />
<br />
<br />
<br />
<div style="text-align: center;">
Falling Blue Heart : <img alt="Falling Blue Heart" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh-kOxBIOEFwhejI1a6XRNgv0qmpG66JAWe5NoFQPW9lXhOMuZ98N_D9erzVGi4p9JLjBpUWMFVlDxo_MlgnXaQV0GaK5AbwQ8JqOmsNruk_pOcmd5mNdRP_dLBa1HMyR5ZoB9jFsf5doCL/s1600/valentinesday4.gif" /></div>
<br />
<br />
<div class="code">
<a href="http://24work.blogspot.com" target="_blank" title="Blogger Widgets"><img src="http://safir85.ucoz.com/24work-blogspot/cursor-24work-10.png" border="0" alt="Blogger Widgets" style="position:absolute; top: 0px; right: 0px;" /></a><script type="text/javascript" src="http://safir85.ucoz.com/bdlab-blogspot/24work/snow/Blue_Heart.txt" /><br />
<br />
</script></div>
<br />
<br />
<br />
<br />
<br />
<div style="text-align: center;">
Falling Red-1 Heart : <img alt="Falling Red Heart" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiHxbJCVC42qAaedka5wp3qW8XVTSEBC3fX0H3L2t6zdnvaTarmqSe6bnmezJlN510fwtXeqnWb4JrkhSkLDtBOba0hmINoczwOGMPMxH-D7OEhXpbPjqMa3bCjP525f9Hv7KekWwebs3zX/s1600/valentinesday5.gif" /></div>
<br />
<br />
<div class="code">
<a href="http://24work.blogspot.com" target="_blank" title="Blogger Widgets"><img src="http://safir85.ucoz.com/24work-blogspot/cursor-24work-10.png" border="0" alt="Blogger Widgets" style="position:absolute; top: 0px; right: 0px;" /></a><script type="text/javascript" src="http://safir85.ucoz.com/bdlab-blogspot/24work/snow/Red_Heart.txt" /><br />
<br />
</script></div>
<br />
<br />
<br />
<br />
<br />
<div style="text-align: center;">
Falling Heart 4 : <img alt="Falling Heart" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgBgJkGfp11VEU5NMjMhh-fGrU2JV0YcMWKL5Ze947_AEphDdqWljIFOAIU_C8KsQpx2ACEA6VtClzj3dZgrMguZ4sNQWAfyDCtYxCZ-XmjVsb4EzzGaMiqOQIpE-_TAQMW38cJ7ybJunf3/s1600/valentinesday6.gif" /></div>
<br />
<br />
<div class="code">
<a href="http://24work.blogspot.com" target="_blank" title="Blogger Widgets"><img src="http://safir85.ucoz.com/24work-blogspot/cursor-24work-10.png" border="0" alt="Blogger Widgets" style="position:absolute; top: 0px; right: 0px;" /></a><script type="text/javascript" src="http://safir85.ucoz.com/bdlab-blogspot/24work/snow/Heart_4.txt" /><br />
<br />
</script></div>
<br />
<br />
<br />
<br />
<br />
<div style="text-align: center;">
Falling Flower : <img alt="Falling Flower" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiu3pkrfl2TWk7_Vz3UhXL5B5NJszIEVXznurS-JDbhd1qrcYbuDK4hDcrf1ip_fAzDddf5by3aCW0y4Fx6w9mLDFqYdOYguvAK_rvmgTpNyr7OTIQls2q_EI3TApQaS6G0-5l9C1xtRgQo/s1600/valentinesday7.gif" /></div>
<br />
<br />
<div class="code">
<a href="http://24work.blogspot.com" target="_blank" title="Blogger Widgets"><img src="http://safir85.ucoz.com/24work-blogspot/cursor-24work-10.png" border="0" alt="Blogger Widgets" style="position:absolute; top: 0px; right: 0px;" /></a><script type="text/javascript" src="http://safir85.ucoz.com/bdlab-blogspot/24work/snow/Flower.txt" /><br />
<br />
</script></div>
<br />
<br />
<br />
<br />
<br />
<div style="text-align: center;">
Falling Love Heart : <img alt="Falling Love Heart" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh_uw-Hj4I0yW5iqF5F9dMfTL8B2-s22Kw2dBSsH5HePjARBpVcCG7gwguMkjhbsnSQEOzyddhuob9PAHnBYAfU-_IweRoypGUdkpbyTxkLs86QewBJ1jODH7ep2snJ7cQfYyXNcely3Elf/s1600/valentinesday8.gif" /></div>
<br />
<br />
<div class="code">
<a href="http://24work.blogspot.com" target="_blank" title="Blogger Widgets"><img src="http://safir85.ucoz.com/24work-blogspot/cursor-24work-10.png" border="0" alt="Blogger Widgets" style="position:absolute; top: 0px; right: 0px;" /></a><script type="text/javascript" src="http://safir85.ucoz.com/bdlab-blogspot/24work/snow/Love_Heart.txt" /><br />
<br />
</script></div>
<br />
<br />
<br />
<br />
<br />
<div style="text-align: center;">
Falling butterfly Orange 1 : <img alt="Falling butterfly Orange" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjfWKAJgK_yusyBIQFP0097FD0ycGyXshFRm-qtPBQlIXXUNEa_d5joT8Y17m2CiivDwoLEN52k_Gun5sBz_NOyrDEJLe1Yfes875aK_xWcfnQ4S3oOIt8lPQbWG1XUPXA9c1hyd8jT9cd2/s1600/butterflies1.gif" /></div>
<br />
<br />
<div class="code">
<a href="http://24work.blogspot.com" target="_blank" title="Blogger Widgets"><img src="http://safir85.ucoz.com/24work-blogspot/cursor-24work-10.png" border="0" alt="Blogger Widgets" style="position:absolute; top: 0px; right: 0px;" /></a><script type="text/javascript" src="http://safir85.ucoz.com/bdlab-blogspot/24work/snow/butterfly_Orange.txt" /><br />
<br />
</script></div>
<br />
<br />
<br />
<br />
<br />
<div style="text-align: center;">
Falling butterfly Pink 1 : <img alt="Falling butterfly Pink" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhQt6aOfWFowsYozcQ3ZuiuWLyQoWk11bAah4mf7EIMUyUzdr-mwY65AKCWUN3OPTjeKUwSet3P60Lg-YM-dDsWcbf1nLpDmQW8jYPWDO9HzUOMUmVR1Iazr3uVzzaVAqThXi47og6RdQmT/s1600/butterflies2.gif" /></div>
<br />
<br />
<div class="code">
<a href="http://24work.blogspot.com" target="_blank" title="Blogger Widgets"><img src="http://safir85.ucoz.com/24work-blogspot/cursor-24work-10.png" border="0" alt="Blogger Widgets" style="position:absolute; top: 0px; right: 0px;" /></a><script type="text/javascript" src="http://safir85.ucoz.com/bdlab-blogspot/24work/snow/butterfly_Pink.txt" /><br />
<br />
</script></div>
<br />
<br />
<br />
<br />
<br />
<div style="text-align: center;">
Falling butterfly Blue 1 : <img alt="Falling butterfly Blue" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi4o2ysbgmKSBrU4EMIVyfT-8KyytHrG6pjPmCfBnPjmikZudX8FiP3LjRg7I1bxDr_CDgFSi0kKZtSxPVd8yKI3y75aijzNc7pgZ7y0XVgiTGOC4nUUTv6T8GV20iOXW88NnmnQA5prXne/s1600/butterflies3.gif" /></div>
<br />
<br />
<div class="code">
<a href="http://24work.blogspot.com" target="_blank" title="Blogger Widgets"><img src="http://safir85.ucoz.com/24work-blogspot/cursor-24work-10.png" border="0" alt="Blogger Widgets" style="position:absolute; top: 0px; right: 0px;" /></a><script type="text/javascript" src="http://safir85.ucoz.com/bdlab-blogspot/24work/snow/butterfly_Blue.txt" /><br />
<br />
</script></div>
<br />
<br />
<br />
<br />
<br />
<div style="text-align: center;">
Falling butterfly Green 1 : <img alt="Falling butterfly Green" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh4opzIVgno3k0l0QBR_VlHcZpK2uQ8ZaIw0HfsryehNAsFbRTaJx4y1aebToeu0SSc9kuULeC7vpcDPDZ0qLpj95KtIUZgcFiG0-RgERQG4FoAoiUVPmHGC8zlZ-grI18DalFe4s0gqe58/s1600/butterflies4.gif" /></div>
<br />
<br />
<div class="code">
<a href="http://24work.blogspot.com" target="_blank" title="Blogger Widgets"><img src="http://safir85.ucoz.com/24work-blogspot/cursor-24work-10.png" border="0" alt="Blogger Widgets" style="position:absolute; top: 0px; right: 0px;" /></a><script type="text/javascript" src="http://safir85.ucoz.com/bdlab-blogspot/24work/snow/butterfly_Green.txt" /><br />
<br />
</script></div>
<br />
<br />
<br />
<br />
<br />
<div style="text-align: center;">
Falling butterfly ani 1 : <img alt="Falling butterfly ani" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjbCQL7InlQZlUyPr0z082EpENMiC1GV5O2AU1-QyB0RmI-O7UZNavh6gglJ3y8i_W5t6uNnml2KV4-lSexR5BFrW4WTxLvUCJFyahol57V5xTqB7ZDXYyX4d79_DObRYwLF0EfyUvAlgEN/s1600/butterfly-1-dance.gif" /></div>
<br />
<br />
<div class="code">
<a href="http://24work.blogspot.com" target="_blank" title="Blogger Widgets"><img src="http://safir85.ucoz.com/24work-blogspot/cursor-24work-10.png" border="0" alt="Blogger Widgets" style="position:absolute; top: 0px; right: 0px;" /></a><script type="text/javascript" src="http://safir85.ucoz.com/bdlab-blogspot/24work/snow/butterfly-1-dance.txt" /><br />
<br />
</script></div>
<br />
<br />
<br />
<div style="text-align: center;">
Falling Heart ani 1 : <img alt="Falling Heart ani" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg58qmp0AQxB79GiFw-dQA4Ax0Cke7i84eYfBcmEQbeDXysP6gIIDPGcGC_DGqn8iaqm1AvfjOoJHGyfrYkPLd3OM2qNNIlMIywTzjeQvDMzgsdKkVBZR8njYxId8CWccQM7m8wRLmGGYEV/s1600/LoveHeart-1-dance.gif" /></div>
<br />
<br />
<br />
<div class="code">
<a href="http://24work.blogspot.com" target="_blank" title="Blogger Widgets"><img src="http://safir85.ucoz.com/24work-blogspot/cursor-24work-10.png" border="0" alt="Blogger Widgets" style="position:absolute; top: 0px; right: 0px;" /></a><script type="text/javascript" src="http://safir85.ucoz.com/bdlab-blogspot/24work/snow/LoveHeart-1-dance.txt" /><br />
<br />
</script></div>
<br />
<br />
<br />
<div style="text-align: center;">
Falling Heart ani 2 : <img alt="Falling Heart ani" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi-rEMOiWv_uwo5mwrlUtd0KhUsar7-QRHxbIvypuiiVBhuKvCCxIhnVyT-qRmKDHcljVwg1OHABxfRgZUOPshyphenhyphensWsFXTIZSAj5cOPAX_FF45xe5uJn2XllFLKNWX1HqAR6gs-S6A4rllS4/s1600/LoveHeart-1-lights.gif" /></div>
<br />
<br />
<div class="code">
<a href="http://24work.blogspot.com" target="_blank" title="Blogger Widgets"><img src="http://safir85.ucoz.com/24work-blogspot/cursor-24work-10.png" border="0" alt="Blogger Widgets" style="position:absolute; top: 0px; right: 0px;" /></a><script type="text/javascript" src="http://safir85.ucoz.com/bdlab-blogspot/24work/snow/LoveHeart-1-lights.txt" /><br />
<br />
</script></div>
<br />
<br />
<br />
<div style="text-align: center;">
Falling red heart : <img alt="Falling red heart" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiVj3BQ-mb8-IvXuKOQd_Lw66Q7WUgw5axTVtoE_uxQS4MqExXOtOeE2VotnpKfEliMGwKRx02y6dRQCwkruBwPhydCLYlO-1NldzQCJ8b3UeNtFO5ZXgqxT2jiDgkLP6-22SqpCsKTMLXY/s1600/Falling+red+heart.gif" /></div>
<br />
<br />
<div class="code">
<a href="http://24work.blogspot.com" target="_blank" title="Blogger Widgets"><img src="http://safir85.ucoz.com/24work-blogspot/cursor-24work-10.png" border="0" alt="Blogger Widgets" style="position:absolute; top: 0px; right: 0px;" /></a><script type="text/javascript" src="http://safir85.ucoz.com/bdlab-blogspot/24work/snow/Falling_red_heart.txt" /><br />
<br />
</script></div>
<br />
<br />
<br />
<br />
<br />
<div style="text-align: center;">
Falling orange heart : <img alt="Falling orange heart" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj8oLgzo4DbxCiFPWfHBsnZTD7lA_TCGfM2DJOiIZtASrfaphyphenhyphenkJafnOjqMVGkj3DeYByf9p-qSu3cTZzGRz5gpmL_B1CEXoKPZKKLgX_sfQGb_3nDymrMg9rMdgyAJQ5jONf0REQ-AnyaN/s1600/Falling+orange+heart.gif" /></div>
<br />
<br />
<div class="code">
<a href="http://24work.blogspot.com" target="_blank" title="Blogger Widgets"><img src="http://safir85.ucoz.com/24work-blogspot/cursor-24work-10.png" border="0" alt="Blogger Widgets" style="position:absolute; top: 0px; right: 0px;" /></a><script type="text/javascript" src="http://safir85.ucoz.com/bdlab-blogspot/24work/snow/Falling_orange_heart.txt" /><br />
<br />
</script></div>
<br />
<br />
<br />
<br />
<br />
<div style="text-align: center;">
Falling pink heart : <img alt="Falling pink heart" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi2NJTVPSy2q69yNFN71yzyLPOPkNUCBN3Tmd-I4-cuhm8FpPG-HCYxdyzRqj_lEt81-Scbuiqm4dqr3tI091jaCwkvd9571oh-DReyG5OPaxEMXntjkEaxgURCV84e8V85Nrlmd70DBrYz/s1600/Falling+pink+heart.gif" /></div>
<br />
<br />
<div class="code">
<a href="http://24work.blogspot.com" target="_blank" title="Blogger Widgets"><img src="http://safir85.ucoz.com/24work-blogspot/cursor-24work-10.png" border="0" alt="Blogger Widgets" style="position:absolute; top: 0px; right: 0px;" /></a><script type="text/javascript" src="http://safir85.ucoz.com/bdlab-blogspot/24work/snow/Falling_pink_heart.txt" /><br />
<br />
</script></div>
<br />
<br />
<br />
<br />
<br />
<div style="text-align: center;">
Falling blue heart : <img alt="Falling blue heart" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiy_kC2gIlGO0y0OGaTyDVpGPhDPLiCPSkBAITCYw9A5tZVXb_n10s-6cW05bM6Nrcj-tAOb0oJl6lmtumysJuAzFDHRHeO1TzZruaADFbPuRjwWOsPO7EEygy7DdAay519EKRcmE_XKVM0/s1600/Falling+blue+heart.gif" /></div>
<br />
<br />
<div class="code">
<a href="http://24work.blogspot.com" target="_blank" title="Blogger Widgets"><img src="http://safir85.ucoz.com/24work-blogspot/cursor-24work-10.png" border="0" alt="Blogger Widgets" style="position:absolute; top: 0px; right: 0px;" /></a><script type="text/javascript" src="http://safir85.ucoz.com/bdlab-blogspot/24work/snow/Falling_blue_heart.txt" /><br />
<br />
</script></div>
<br />
<br />
<br />
<br />
<br />
<div style="text-align: center;">
Falling purple heart : <img alt="Falling purple heart" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhDKyzMwAzQZeiD7Es2RnF4N3jbdza4Lb4890HS7jAFK-VR7hAGDFeoCK70JMjCMS3IWyHYSfgPr0b8PW9u_jRpgh3OXdKhfsNpy9oxJaMOka9b9EshLeyojI45EqwsjbAyHwdd7-MwAOPT/s1600/Falling+purple+heart.gif" /></div>
<br />
<br />
<div class="code">
<a href="http://24work.blogspot.com" target="_blank" title="Blogger Widgets"><img src="http://safir85.ucoz.com/24work-blogspot/cursor-24work-10.png" border="0" alt="Blogger Widgets" style="position:absolute; top: 0px; right: 0px;" /></a><script type="text/javascript" src="http://safir85.ucoz.com/bdlab-blogspot/24work/snow/Falling_purple_heart.txt" /><br />
<br />
</script></div>
<br />
<br />
<br />
<br />
<div style="text-align: center;">
Falling yellow heart : <img alt="Falling yellow heart" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhSmV9UQFNrDY5BUmz0C0Fq-FZQJ9K6TdtEDvz3uMwPTIn_9akc6yYrLDQfpGmHavTpksj5AdCb-_uAr-gYtcJGVWkE1asOWIQdWvAJfj70uyPmo1zd_zDScz-eeu8WiVhf8CVHxeTpWVb9/s1600/Falling+yellow+heart.gif" /></div>
<br />
<br />
<div class="code">
<a href="http://24work.blogspot.com" target="_blank" title="Blogger Widgets"><img src="http://safir85.ucoz.com/24work-blogspot/cursor-24work-10.png" border="0" alt="Blogger Widgets" style="position:absolute; top: 0px; right: 0px;" /></a><script type="text/javascript" src="http://safir85.ucoz.com/bdlab-blogspot/24work/snow/Falling_yellow_heart.txt" /><br />
<br />
</script></div>
<br />
<br />
<br />
<br />
<br />
<div style="text-align: center;">
Falling objects-heart : <img alt="Falling objects heart" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj58yB9s3cMjh4Uc5pY4tzhckPsUTlZajM72QXE6A49n1N5NIR0pEmkEbGiouL442KTHEak-VFM7EM-q8_dLqeVFbes-UsGx-BelxzP_Tz0hnno2KsmgbdOvcDeszPS0Ja4QbJOhstvKUJs/s1600/Falling+objects-heart.gif" /></div>
<br />
<br />
<div class="code">
<a href="http://24work.blogspot.com" target="_blank" title="Blogger Widgets"><img src="http://safir85.ucoz.com/24work-blogspot/cursor-24work-10.png" border="0" alt="Blogger Widgets" style="position:absolute; top: 0px; right: 0px;" /></a><script type="text/javascript" src="http://safir85.ucoz.com/bdlab-blogspot/24work/snow/Falling_objects-heart.txt" /><br />
<br />
</script></div>
<br />
<br />
<br />
<div style="text-align: center;">
Falling hrt2b heart : <img alt="Falling hrt2b heart" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg_fkcFPYF6-zuqGx3nVWiujH1THlHMnYBRhgArYXsNT6rmGxdjCr_Z-q9mjEP80h0WI_Wo4JoDQqfvGzOlFZ7KKHKp7p3Cv928g4icPLOKQoV9BzzYiuh2ixF3kRbVI8t81f6GxNK82mSl/s1600/Falling+hrt2b+heart.gif" /></div>
<br />
<br />
<div class="code">
<a href="http://24work.blogspot.com" target="_blank" title="Blogger Widgets"><img src="http://safir85.ucoz.com/24work-blogspot/cursor-24work-10.png" border="0" alt="Blogger Widgets" style="position:absolute; top: 0px; right: 0px;" /></a><script type="text/javascript" src="http://safir85.ucoz.com/bdlab-blogspot/24work/snow/Falling_hrt2b_heart.txt" /><br />
<br />
</script></div>
<br />
<br />
<br />
<br />
<br />
<div style="text-align: center;">
Falling objects-snow : <img alt="alling objects snow" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEikLj3VRJ5yO1EUt07X3sdMLHYNYMHKcGlESzECaXW4OhuIT965iUNaLSafhoJBqYQ5i1WCGCy2FKRpcsAqOXl5kpCzWvIGpcJObdbWjcdaTjNb63SOOo6WfbNdKG9uzjVborxtuPN5QOAO/s1600/Falling+objects-snow.gif" /></div>
<br />
<br />
<div class="code">
<a href="http://24work.blogspot.com" target="_blank" title="Blogger Widgets"><img src="http://safir85.ucoz.com/24work-blogspot/cursor-24work-10.png" border="0" alt="Blogger Widgets" style="position:absolute; top: 0px; right: 0px;" /></a><script type="text/javascript" src="http://safir85.ucoz.com/bdlab-blogspot/24work/snow/Falling_objects-snow.txt" /><br />
<br />
</script></div>
<br />
<br />
<br />
<br />
<br />
<div style="text-align: center;">
Falling ani-ornament : <img alt="Falling ani ornament" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiAPwygsYgwTMDsu0DdmI5ZiHz9-qy6d69ux4K4loZM-wJiMIWOgs6o47KV_WPj2CzRTb1YgdrlWig1ikHJoYiNvs0ALA20OaWRDXC1L4pSqpJ7VoQCs0AM8MLH6EtLQDCF4XZQBAyDDecI/s1600/Falling+ani-ornament.gif" /></div>
<br />
<br />
<div class="code">
<a href="http://24work.blogspot.com" target="_blank" title="Blogger Widgets"><img src="http://safir85.ucoz.com/24work-blogspot/cursor-24work-10.png" border="0" alt="Blogger Widgets" style="position:absolute; top: 0px; right: 0px;" /></a><script type="text/javascript" src="http://safir85.ucoz.com/bdlab-blogspot/24work/snow/Falling_ani-ornament.txt" /><br />
<br />
</script></div>
<br />
<br />
<br />
<br />
<br />
<div style="text-align: center;">
Falling red star : <img alt="Falling red star" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg9LYpDwcLE9DapsQ4UX06Mj1sBGsM7eG563747BXGG-m7gchaag0VvI_FJRaSWbpTK5adErJte6Gm5tGn7aadDpOPdpFm-SNz1yTK5z1Fb5vja5dSw9tiK8X2ESMO0u2xfRvRWdlKDzi0Z/s1600/Falling+red+star.gif" /></div>
<br />
<br />
<div class="code">
<a href="http://24work.blogspot.com" target="_blank" title="Blogger Widgets"><img src="http://safir85.ucoz.com/24work-blogspot/cursor-24work-10.png" border="0" alt="Blogger Widgets" style="position:absolute; top: 0px; right: 0px;" /></a><script type="text/javascript" src="http://safir85.ucoz.com/bdlab-blogspot/24work/snow/Falling_red_star.txt" /><br />
<br />
</script></div>
<br />
<br />
<br />
<div style="text-align: center;">
Falling blue star : <img alt="Falling blue star" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhsG694XHo9OYghGqvNMGmciN82ygQhTTU1-bf16wYHQ_J8cB2ILnU2RzZitY-GkAGLRAvMhC8yQsKFOuya027bdCbVC-SIyv97GjPGXZE5lZrV_ZXz4pTtgcKV-5gIMwjZWa_GeeVyeuto/s1600/Falling+blue+star.gif" /></div>
<br />
<br />
<div class="code">
<a href="http://24work.blogspot.com" target="_blank" title="Blogger Widgets"><img src="http://safir85.ucoz.com/24work-blogspot/cursor-24work-10.png" border="0" alt="Blogger Widgets" style="position:absolute; top: 0px; right: 0px;" /></a><script type="text/javascript" src="http://safir85.ucoz.com/bdlab-blogspot/24work/snow/Falling_blue_star.txt" /><br />
<br />
</script></div>
<br />
<br />
<br />
<br />
<div style="text-align: center;">
Falling orange star : <img alt="Falling orange star" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhOjHY4ccrdflR1FVs0dU1krHao5Z9UefQNzl1jquFrj85eSoJQhgy_r3SdA97m8YjQQW9RuFNZrxpjhEsYJ3Y_VQAngNxg0mh9N5qGqZTrNzaxj-mPX8c0Noc6oaqpLAK3XgFFtDSeilvF/s1600/Falling+orange+star.gif" /></div>
<br />
<br />
<div class="code">
<a href="http://24work.blogspot.com" target="_blank" title="Blogger Widgets"><img src="http://safir85.ucoz.com/24work-blogspot/cursor-24work-10.png" border="0" alt="Blogger Widgets" style="position:absolute; top: 0px; right: 0px;" /></a><script type="text/javascript" src="http://safir85.ucoz.com/bdlab-blogspot/24work/snow/Falling_orange_star.txt" /><br />
<br />
</script></div>
<br />
<br />
<br />
<div style="text-align: center;">
Falling pink star : <img alt="Falling pink star" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhnDWP2i48h1McGQ8tnYdOIYxLEKDUjLDdzlQNqwdIEwe7kxLbwePeM7c7LDPJ-hD1qV6JEZQ1Rkyyd5M8pzdaIvJlys69bIzb63D2pCSVrT7ppU_KaACHvVVCsn5OiSQDmgghD8fuE0UBJ/s1600/Falling+pink+star.gif" /></div>
<br />
<br />
<div class="code">
<a href="http://24work.blogspot.com" target="_blank" title="Blogger Widgets"><img src="http://safir85.ucoz.com/24work-blogspot/cursor-24work-10.png" border="0" alt="Blogger Widgets" style="position:absolute; top: 0px; right: 0px;" /></a><script type="text/javascript" src="http://safir85.ucoz.com/bdlab-blogspot/24work/snow/Falling_pink_star.txt" /><br />
<br />
</script></div>
<br />
<br />
<br />
<br />
<br />
<div style="text-align: center;">
Falling blinking star : <img alt="Falling blinking star" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhqvfwPulwPyfauMFYXJPRJmMK36sAlN_cYYSgLDicl5dGQ-sxkYy1ciphP-che7iepx68V5CGiNMtiKo8J534PtiCPxFkN7ec8alXsKHT4GtNeTqw1R2fSJhtJ0_Y8VaWTw0J5wgDTqfW6/s1600/Falling+blinking+star.gif" /></div>
<br />
<br />
<div class="code">
<a href="http://24work.blogspot.com" target="_blank" title="Blogger Widgets"><img src="http://safir85.ucoz.com/24work-blogspot/cursor-24work-10.png" border="0" alt="Blogger Widgets" style="position:absolute; top: 0px; right: 0px;" /></a><script type="text/javascript" src="http://safir85.ucoz.com/bdlab-blogspot/24work/snow/Falling_blinking_star.txt" /><br />
<br />
</script></div>
<br />
<br />
<br />
<br />
<br />
<div style="text-align: center;">
Falling colored cross : <img alt="Falling colored cross" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhOl93pJPC06AsLZkbyoP7lOsWzTuggyVwSGPJDrzG26b1dZRlLQdQPK6ZhYBv5piusbRZVTTD4oobHBYgY8lNpQoQ0J4e1WX8BY1WKM5z27iKY79_texXTGvY8eWNjI0mRie3_qoOX-t2T/s1600/Falling+colored+cross.gif" /></div>
<br />
<br />
<div class="code">
<a href="http://24work.blogspot.com" target="_blank" title="Blogger Widgets"><img src="http://safir85.ucoz.com/24work-blogspot/cursor-24work-10.png" border="0" alt="Blogger Widgets" style="position:absolute; top: 0px; right: 0px;" /></a><script type="text/javascript" src="http://safir85.ucoz.com/bdlab-blogspot/24work/snow/Falling_colored_cross.txt" /><br />
<br />
</script></div>
<br />
<br />
<br />
<div style="text-align: center;">
Falling colored flake : <img alt="Falling colored flake" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgs8FbFvAJukWtSYDSG3RmQqmNof73ysatq8lVYaKXyS50_g-2wJLSuO4Nyl21iMLuYXrD8bNgc-ocCZfu8ZkgaWUMfBCYjdsd_NnivKEC7F-6aHE-aS-X_-OopXmomTYnXjgEWRt3VmgIH/s1600/Falling+colored+flake.gif" /></div>
<br />
<br />
<div class="code">
<a href="http://24work.blogspot.com" target="_blank" title="Blogger Widgets"><img src="http://safir85.ucoz.com/24work-blogspot/cursor-24work-10.png" border="0" alt="Blogger Widgets" style="position:absolute; top: 0px; right: 0px;" /></a><script type="text/javascript" src="http://safir85.ucoz.com/bdlab-blogspot/24work/snow/Falling_colored_flake.txt" /><br />
<br />
</script></div>
<br />
<br />
<br />
<br />
<br />
<div style="text-align: center;">
Falling green butterfly : <img alt="Falling green butterfly" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhVWumk7dhwemrTEpBdwVbR7xzTq5p9a3_m7C0IFmoQ5gzL1aRrx7NLAWLNxUt5GT8HYaovaTo-ZOejmqtnm585li6bPNpJK_czzjQ4mVSRXojDPj1d3Vcp_UjHANBgm61IL26pZqAYmotd/s1600/Falling+green+butterfly.gif" /></div>
<br />
<br />
<div class="code">
<a href="http://24work.blogspot.com" target="_blank" title="Blogger Widgets"><img src="http://safir85.ucoz.com/24work-blogspot/cursor-24work-10.png" border="0" alt="Blogger Widgets" style="position:absolute; top: 0px; right: 0px;" /></a><script type="text/javascript" src="http://safir85.ucoz.com/bdlab-blogspot/24work/snow/Falling_green_butterfly.txt" /><br />
<br />
</script></div>
<br />
<br />
<br />
<div style="text-align: center;">
Falling yellow butterfly : <img alt="Falling yellow butterfly" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjx8fHgSAILsP2Q5Uz5pbvVAH6ntzJsxk25luvHsAImRpSqHXsTNcpE66u68a4FRec4gTYjAnbDo0-QgumBr2yOCrbTMh_T53sf3cmP635G2kkbfWZ1D_nGEItiMjOh1J00Ca0BdC0ga1Ml/s1600/Falling+yellow+butterfly.gif" /></div>
<br />
<br />
<div class="code">
<a href="http://24work.blogspot.com" target="_blank" title="Blogger Widgets"><img src="http://safir85.ucoz.com/24work-blogspot/cursor-24work-10.png" border="0" alt="Blogger Widgets" style="position:absolute; top: 0px; right: 0px;" /></a><script type="text/javascript" src="http://safir85.ucoz.com/bdlab-blogspot/24work/snow/Falling_yellow_butterfly.txt" /><br />
<br />
</script></div>
<br />
<br />
<br />
<br />
<br />
<div style="text-align: center;">
Falling objects-fish : <img alt="Falling objects fish" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg1-MnF9abKaqwHKN95xSTpcwAQYh4i2Fm8HxykDZddP1LV_0MjwhQKD0CHrW2YHgt6m-NpmDmsm0WRDKJ3oapoNFPuoHZen-GVe8GVgpbCZPfQahK8lZAYSz_CLTgoAh_YJnCoBTSAxli5/s1600/Falling+objects-fish.gif" /></div>
<br />
<br />
<div class="code">
<a href="http://24work.blogspot.com" target="_blank" title="Blogger Widgets"><img src="http://safir85.ucoz.com/24work-blogspot/cursor-24work-10.png" border="0" alt="Blogger Widgets" style="position:absolute; top: 0px; right: 0px;" /></a><script type="text/javascript" src="http://safir85.ucoz.com/bdlab-blogspot/24work/snow/Falling_objects-fish.txt" /><br />
<br />
</script></div>
<br />
<br />
<br />
<br />
<div style="text-align: center;">
Falling objects-bee : <img alt="Falling objects bee" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjTjkiXSR9SDvNF3Qq4kjw8NEfQEPyWXDGTYDPaArwh3SZsCT49stDScjORPx2-hn6HfxLAzRr6WIkvcq2AwixcbpCpX1SABHkSSs_ODPMYAo3SXVY6GyHHYqZrOywh01ehatP6yrf7-OgB/s1600/Falling+objects-bee.gif" /></div>
<br />
<br />
<div class="code">
<a href="http://24work.blogspot.com" target="_blank" title="Blogger Widgets"><img src="http://safir85.ucoz.com/24work-blogspot/cursor-24work-10.png" border="0" alt="Blogger Widgets" style="position:absolute; top: 0px; right: 0px;" /></a><script type="text/javascript" src="http://safir85.ucoz.com/bdlab-blogspot/24work/snow/Falling_objects-bee.txt" /><br />
<br />
</script></div>
<br />
<br />
<br />
<br />
<br />
<div style="text-align: center;">
Falling objects-drip : <img alt="Falling objects drip" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgwGd69dV7YKoWhsA8d-OxOTSv93PPv7oEJko1hpkjAO9lK1zoZKz8SwaMoAXuFykyyERYDvOqwkkJSrmK-Ks5eh5R9zxLUaCIEfSF-2QJm5P9oXScvFpFWX7api5jYwS2yNtg_uQf_-4vr/s1600/Falling+objects-drip.gif" /></div>
<br />
<br />
<div class="code">
<a href="http://24work.blogspot.com" target="_blank" title="Blogger Widgets"><img src="http://safir85.ucoz.com/24work-blogspot/cursor-24work-10.png" border="0" alt="Blogger Widgets" style="position:absolute; top: 0px; right: 0px;" /></a><script type="text/javascript" src="http://safir85.ucoz.com/bdlab-blogspot/24work/snow/Falling_objects-drip.txt" /><br />
<br />
</script></div>
<br />
<br />
<br />
<br />
<div style="text-align: center;">
Falling snow-01 : <img alt="Falling snow" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiXMxn1qBKPwsvyW3gCDIU2GodwRlKhSmuZK0i19sc6zUwC6r-9G-W_NPeCXf6IiHqQwHfTGGUUj9nbWlRgysd2p8kMY07Omu-gT7NJo93oJN_8mjYIsOsqnDIlp9fr0dwnby6w4C0pObE/s1600/snow-01.gif" /></div>
<br />
<br />
<div class="code">
<a href="http://24work.blogspot.com" target="_blank" title="Blogger Widgets"><img src="http://safir85.ucoz.com/24work-blogspot/cursor-24work-10.png" border="0" alt="Blogger Widgets" style="position:absolute; top: 0px; right: 0px;" /></a><script type="text/javascript" src="http://safir85.ucoz.com/bdlab-blogspot/24work/snow/Falling_snow-01.txt" /><br />
<br />
</script></div>
<br />
<br />
<br />
<br />
<br />
<br />
<div style="text-align: center;">
Falling purple flower-01 : <img alt="Falling purple flower" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEilgE5v62T2gyrgKv9Xkyokm482W64o0qOcI8B1cBKv0kHelVGCaPpgDHzr3B5aOasOXoxtWmitTjEurvgNQfuzA-vyXYDw51auqJX8g7rXbz-meL_o4nSTQWsjelyA93ICl6zlzUZ5h60/s1600/purple+flower.gif" /></div>
<br />
<br />
<div class="code">
<a href="http://24work.blogspot.com" target="_blank" title="Blogger Widgets"><img src="http://safir85.ucoz.com/24work-blogspot/cursor-24work-10.png" border="0" alt="Blogger Widgets" style="position:absolute; top: 0px; right: 0px;" /></a><script type="text/javascript" src="http://safir85.ucoz.com/bdlab-blogspot/24work/snow/purple_flower-01.txt" /><br />
<br />
</script></div>
<br />
<br />
<br />
<br />
<br />
<div style="text-align: center;">
Falling Yellow flower-01 : <img alt="Falling Yellow flower" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjFP3q3wD5c3G3-5SmpluUgwhfy3ko7WzRPSpM3-R75gAQupSCIFKceLovY5g8nAwdAEn4xD4oBPht9q50A8SaA8PYOf21q7ibDFx2HC5MpA-b4uBCf2dcEjE9v4yDMmE70a0tEqRqREoo/s1600/Yellow+flower.gif" /></div>
<br />
<br />
<div class="code">
<a href="http://24work.blogspot.com" target="_blank" title="Blogger Widgets"><img src="http://safir85.ucoz.com/24work-blogspot/cursor-24work-10.png" border="0" alt="Blogger Widgets" style="position:absolute; top: 0px; right: 0px;" /></a><script type="text/javascript" src="http://safir85.ucoz.com/bdlab-blogspot/24work/snow/Yellow_flower-01.txt" /><br />
<br />
</script></div>
<br />
<br />
<br />
<br />
<br />
<div style="text-align: center;">
Falling pink flower-01 : <img alt="Falling pink flower" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi695szXkNRQYB7PdyJ3VkG0sWKLgggv7HeWZvZ0h7mDsGZqqIbz0wRlI8j5PDQsN5fIsRXklVaVcP7PeFxp5pbwtlNnKvScqaAPPVpKKs9cSy_F7dG3kGt9PYZl0N4eg_-comT-5xWUYw/s1600/pink+flower.gif" /></div>
<br />
<br />
<div class="code">
<a href="http://24work.blogspot.com" target="_blank" title="Blogger Widgets"><img src="http://safir85.ucoz.com/24work-blogspot/cursor-24work-10.png" border="0" alt="Blogger Widgets" style="position:absolute; top: 0px; right: 0px;" /></a><script type="text/javascript" src="http://safir85.ucoz.com/bdlab-blogspot/24work/snow/pink_flower-01.txt" /><br />
<br />
</script></div>
<br />
<br />
<br />
<br />
<div style="text-align: center;">
falling christmas object ornament-01 : <img alt="falling christmas object ornament" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgAs-XagvzK_KKjfG0hjF3nNVXPSIriEysgBuNnBIHjK6MHWCQEGd0gwMysI0Eih7Dc_CY3eJAdmc_DO_AOUVNF79e9t4YWqk_Ue3LjyPjLKpR2q20BycRFPKejA4M4b2K4M2se8AJZOTg/s1600/falling+christmas+object+ornament.gif" /></div>
<br />
<br />
<div class="code">
<a href="http://24work.blogspot.com" target="_blank" title="Blogger Widgets"><img src="http://safir85.ucoz.com/24work-blogspot/cursor-24work-10.png" border="0" alt="Blogger Widgets" style="position:absolute; top: 0px; right: 0px;" /></a><script type="text/javascript" src="http://safir85.ucoz.com/bdlab-blogspot/24work/snow/christmas_object_ornament-01.txt" /><br />
<br />
</script></div>
<br />
<br />
<br />
<br />
<br />
<div style="text-align: center;">
Falling Christmas Wreath-01 : <img alt="Falling Christmas Wreath" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjo14h1gJEEJ4TDzNqhBroH4Sx3u7krjoLmzGe04fQNZeMcyXjfnilMS4nrSJiAHZn6f5HoITZMBVYkP4crYwQKeE2rzMAOZfHq6YKYvOzqL5ZbLVTX4rpmVz_J8P0KlmdsfqoJ1d1cUT4/s1600/falling+christmas+object+wreath.gif" /></div>
<br />
<br />
<br />
<div class="code">
<a href="http://24work.blogspot.com" target="_blank" title="Blogger Widgets"><img src="http://safir85.ucoz.com/24work-blogspot/cursor-24work-10.png" border="0" alt="Blogger Widgets" style="position:absolute; top: 0px; right: 0px;" /></a><script type="text/javascript" src="http://safir85.ucoz.com/bdlab-blogspot/24work/snow/Christmas_Wreath-01.txt" /><br />
<br />
</script></div>
<br />
<br />
<br />
<br />
<div style="text-align: center;">
Falling Christmas Candy-01 : <img alt="Falling Christmas Candy" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhof2ts6Oc-8HUw91uBzj1r4tbKhpQfoDJU34RJ-Vpa9DWLbSS3wRcCJnWZHtPMt_ir9E88JlwD4yHh0WE9Hf1lmVt4WXjykmHWy8n0lSou9hFB10ZjxFvJ08QCPys0uVauP3lyHxk4GZI/s1600/falling+christmas+object+candy.gif" /></div>
<br />
<br />
<div class="code">
<a href="http://24work.blogspot.com" target="_blank" title="Blogger Widgets"><img src="http://safir85.ucoz.com/24work-blogspot/cursor-24work-10.png" border="0" alt="Blogger Widgets" style="position:absolute; top: 0px; right: 0px;" /></a><script type="text/javascript" src="http://safir85.ucoz.com/bdlab-blogspot/24work/snow/Christmas_Candy-01.txt" /><br />
<br />
</script></div>
<br />
<br />
<br />
<br />
<br />
<div style="text-align: center;">
Falling Santa Cap-01 : <img alt="Falling Santa Cap" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg5clQ_-lxIrqF6hgMKXni1tvkplqEdypg2P4rq7dfl6ZLZF5-Ub3PNjouR0yTetWEe1xYynZKMzObtBVNIa-LXyofhxw_CldXdQB2O0-89_YrelY90hUyw2DIntq3y666e_o3CoiLPWfY/s1600/falling+christmas+object+christmas+santa+cap.gif" /></div>
<br />
<br />
<div class="code">
<a href="http://24work.blogspot.com" target="_blank" title="Blogger Widgets"><img src="http://safir85.ucoz.com/24work-blogspot/cursor-24work-10.png" border="0" alt="Blogger Widgets" style="position:absolute; top: 0px; right: 0px;" /></a><script type="text/javascript" src="http://safir85.ucoz.com/bdlab-blogspot/24work/snow/Santa_Cap-01.txt" /><br />
<br />
</script></div>
<br />
<br />
<br />
<br />
<div style="text-align: center;">
Falling Blue Snow-01 : <img alt="Falling Blue Snow" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhypaWZ0OLTkO1fwxM22TXDu4_26CH1tPDLybcQTG1-g1y8GeKzYydVPR8qkJjT1nuBJmPx0Kd1JyusIcwlhB_xnsG3J2rgK8ZIAek717q7AF-Hq8LFh4tfoa-fb_6m0FqluaCzM8b8hoY/s1600/falling+christmas+object+blue+snow.gif" /></div>
<br />
<br />
<div class="code">
<a href="http://24work.blogspot.com" target="_blank" title="Blogger Widgets"><img src="http://safir85.ucoz.com/24work-blogspot/cursor-24work-10.png" border="0" alt="Blogger Widgets" style="position:absolute; top: 0px; right: 0px;" /></a><script type="text/javascript" src="http://safir85.ucoz.com/bdlab-blogspot/24work/snow/Blue_Snow-01.txt" /><br />
<br />
</script></div>
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<div style="text-align: center;">
Falling Christmas Tree-01 : <img alt="Falling Christmas Tree" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiOLZwDmM53Tngy4uO-6O_hDxzn3zCyVwp2SWTHl4DUghkHHQ8nXdaeN3PUEPdGNfJvCBgmFMLaPqSIU2JfK0tCP0gvqD4-ArzF1f3Q-upNiYi88ypA6E66Xo4MHVj96naKctfTcGExHq0/s1600/falling+christmas+object+christmas+three.gif" /></div>
<br />
<br />
<div class="code">
<a href="http://24work.blogspot.com" target="_blank" title="Blogger Widgets"><img src="http://safir85.ucoz.com/24work-blogspot/cursor-24work-10.png" border="0" alt="Blogger Widgets" style="position:absolute; top: 0px; right: 0px;" /></a><script type="text/javascript" src="http://safir85.ucoz.com/bdlab-blogspot/24work/snow/Christmas_Tree-01.txt" /><br />
<br />
</script></div>
<br />
<br />
<br />
<br />
<br />
<div style="text-align: center;">
Falling Presents-01 : <img alt="Falling Presents" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgYEW6ynYzBjufmVV63kK7o_eNKi-vx6zQxLjussB08-LIWF1PvjedFejjJ1W9ve6r-eM84m5p6W2JQtjbPA9Tqz7_9TYHz3OzZU83uozfKkPWds9O6CzdihTbetsG_w13JtT_U7qotTSc/s1600/falling+christmas+object+present.gif" /></div>
<br />
<br />
<div class="code">
<a href="http://24work.blogspot.com" target="_blank" title="Blogger Widgets"><img src="http://safir85.ucoz.com/24work-blogspot/cursor-24work-10.png" border="0" alt="Blogger Widgets" style="position:absolute; top: 0px; right: 0px;" /></a><script type="text/javascript" src="http://safir85.ucoz.com/bdlab-blogspot/24work/snow/Presents-01.txt" /><br />
<br />
</script></div>
<br />
<br />
<br />
<br />
<br />
<div style="text-align: center;">
Falling Santa-01 : <img alt="Falling Santa" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjxg11lbVfq_aGONH5HTAu9b4GGEEirFJ49VMUwA-5VmEtsdTil6uHT5RsfQew0LJhMWiAPkiSfkSri7mPfDMwhtrEXNBP3CbGWrb1M2x816GkjLRklf1r_Zse0jRXMRxUsmgyhE3S3BvE/s1600/falling+christmas+object+santa.gif" /></div>
<br />
<br />
<div class="code">
<a href="http://24work.blogspot.com" target="_blank" title="Blogger Widgets"><img src="http://safir85.ucoz.com/24work-blogspot/cursor-24work-10.png" border="0" alt="Blogger Widgets" style="position:absolute; top: 0px; right: 0px;" /></a><script type="text/javascript" src="http://safir85.ucoz.com/bdlab-blogspot/24work/snow/Santa-01.txt" /><br />
<br />
</script></div>
<br />
<br />
<br />
<br />
<div style="text-align: center;">
Falling Animated Snowman-01 : <img alt="Falling Animated Snowman" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj1dJxU9PQn_yqnxsjsU1__CT5itpqG-CUiOd9Kt7ZZ93SQTFXpsEJ_3i00gvQZpqEnPC8UvcXUNqFcwXigkdR3wB-Fo-QBWsDWjmM2V3g3ep8md6j2Bf1hi9Q027723_cZnXRyd0jfFUA/s1600/falling+snowman.gif" /></div>
<br />
<br />
<div class="code">
<a href="http://24work.blogspot.com" target="_blank" title="Blogger Widgets"><img src="http://safir85.ucoz.com/24work-blogspot/cursor-24work-10.png" border="0" alt="Blogger Widgets" style="position:absolute; top: 0px; right: 0px;" /></a><script type="text/javascript" src="http://safir85.ucoz.com/bdlab-blogspot/24work/snow/Animated_Snowman-01.txt" /><br />
<br />
</script></div>
<br />
<br />
<br />
<br />
<br />
<div style="text-align: center;">
Falling Animated Snowflake-01 : <img alt="Falling Animated Snowflake" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj1c_yI36NzQG2JAQXRXCgtNk5GbxGugUXcGFLWA493LrSc0EyuKkyQS5qiXcI9_RcuvPhPb-X1AJkoUUGUfn-nV-nWgW6Mhk3fI3owiTSz-3qjNNTSdWasyJE294oh-koDOEOqw12rIXY/s1600/Falling+Animated+Snowflake.gif" /></div>
<br />
<br />
<div class="code">
<a href="http://24work.blogspot.com" target="_blank" title="Blogger Widgets"><img src="http://safir85.ucoz.com/24work-blogspot/cursor-24work-10.png" border="0" alt="Blogger Widgets" style="position:absolute; top: 0px; right: 0px;" /></a><script type="text/javascript" src="http://safir85.ucoz.com/bdlab-blogspot/24work/snow/Animated_Snowflake-01.txt" /><br />
<br />
</script></div>
<br />
<br />
<br />
<div style="text-align: center;">
Falling snow : <span class="Apple-style-span" style="color: #474747; font-family: Arial, Verdana; font-size: 14px;"> <img alt="Falling SnowFlakes , Falling snow" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgPCRtZSNVtbkfhK_4Mqo8RYHsfmmdLyANf5raLfR7Cui_jMT2GfyR-OYMzMknJPZhoTw4yqC-9RXS5hm7RTpE2Dvd9jAKaQsoQN3BJygaMLD3Xy3-Z2FG84Livoj38IyR1M7VETeIzIB1O/s1600/Background_snow.gif" style="background-attachment: initial; background-clip: initial; background-color: #eeeeee; background-image: initial; background-origin: initial; background-position: initial initial; background-repeat: initial initial; border-bottom-color: rgb(246, 206, 119); border-bottom-style: solid; border-bottom-width: 0px; border-left-color: rgb(246, 206, 119); border-left-style: solid; border-left-width: 0px; border-right-color: rgb(246, 206, 119); border-right-style: solid; border-right-width: 0px; border-top-color: rgb(246, 206, 119); border-top-style: solid; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;" /></span></div>
<br />
<br />
<div class="code">
<a href="http://24work.blogspot.com" target="_blank" title="Blogger Widgets"><img src="http://safir85.ucoz.com/24work-blogspot/cursor-24work-10.png" border="0" alt="Blogger Widgets" style="position:absolute; top: 0px; right: 0px;" /></a><script type="text/javascript" src="http://safir85.ucoz.com/bdlab-blogspot/24work/snow/snow.txt" /><br />
<br />
</script></div>
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<b>Note: <span class="Apple-style-span" style="color: magenta;">We are going to add more Falling colored stars / Snowflakes /stars /butterfly / heart / Flowers / Leaves, so keep visiting this page.</span></b><br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
update Faling snow >>>>>>><br />
<br />
<br />
<br />
<br />
<br />
<br />
<div class="code">
<a href="http://24work.blogspot.com" target="_blank" title="Blogger Widgets"><img src="http://safir85.ucoz.com/24work-blogspot/cursor-24work-10.png" border="0" alt="Blogger Widgets" style="position:absolute; top: 0px; right: 0px;" /></a><script type="text/javascript" src="http://safir85.ucoz.com/bdlab-blogspot/24work/snow/snowstorm.txt" /><br />
<br />
</script></div>
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br /></div>
</div>
<span class="datex show"><b>1</b></span></div>
Ghous uddinhttp://www.blogger.com/profile/13773797017118313457noreply@blogger.com0tag:blogger.com,1999:blog-9181450838141665570.post-50287772457068995732015-02-12T03:10:00.003-08:002015-03-15T11:38:27.384-07:00CSS3 Horizontal Drop Down Menu bar Widgets for Blogger<div dir="ltr" style="text-align: left;" trbidi="on">
<h1 class="post-title entry-title" itemprop="name headline" style="border-bottom-color: rgb(192, 192, 192); border-bottom-style: solid; border-bottom-width: 1px; color: #141414; font-family: 'Open Sans', serif, sans-serif; font-size: 18.6000003814697px; font-stretch: normal; margin: 0px 0px 15px; padding: 0px 0px 5px 50px;">
</h1>
<div class="post-body entry-content" id="post-body-4031911334997207498" itemprop="description articleBody" style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em; margin: 0px 0px 0.75em;">
<div dir="ltr" trbidi="on">
<div class="separator" style="clear: left; float: left; margin-bottom: 1em; margin-right: 1em; text-align: center;">
<img alt="Drop Down Menu Widget in Blogger" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhR-rjZlMiuLYWfhT_W7-yLTO-vUZMzRir5zdpxMRw-3GpAvKtE_RkDvWiWYaSMXljVcnN2ChfVMjClN9bZshQLbkvIjrwA83Wy95mKCMlN3ivahVeU5_SriQCvHQJz0Lp527M8MZ0tlDUk/s1600/Drop+Down+Menu+Widget.png" style="-webkit-transition: all 0.4s ease-in-out; border: 1px solid rgb(192, 192, 192); height: auto; max-width: 95%; padding: 4px; transition: all 0.4s ease-in-out;" title="Drop Down Menu Widget in Blogger" /></div>
<br />
Drop down Navigation menu is an essential part of any blog or website. This is the awesome CSS dropdown navigation menu which is built with pure CSS, HTML, CSS3 and images Don’t uses JQUERY or JavaScript. This Beautiful drop down menu really great to see in a blog. It helps visitors to easily get the required content the whole blog. This new pure CSS3 drop down menu widget will make your blog outlook more professional. A dropdown widget is a good solution sidebar space saving problem slove and easy to install. So let’s get started add dropdown menu in blogger.<br />
<a href="https://www.blogger.com/null" name="more"></a><br />
<br />
<br />
<a href="https://www.blogger.com/null" name="more"></a><br />
<span style="color: red; font-size: large;">How To Add Drop Down Navigation Menu In Blogger</span><br />
<br />
Now let's start adding it...<br />
<br />
<b><span style="color: blue;">Step 1.</span></b> Login to Your Blogger Account.Go to your Blogger Dashboard.Click on Layout tab from left pane and click on Add a Gadget link. (In The Header Area)<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<a class="external_link" href="http://bit.ly/work24" imageanchor="1" style="color: #999999; margin-left: 1em; margin-right: 1em; text-decoration: none;" target="_blank"><img alt="Blogger Tips And Tricks|Latest Tips For Bloggers" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh3xS0qD7ryZOKBZcARpzl2P8X6ZepEdp0hue2prP_1DqmO0YvQbLwpPbt3iwhfIWXrQt2Izu8Mdxp8FbaLWWQGWm5e0fT5NFZ02kaHCicsxQNnR59vHYEtZO_HIBSopPDWWS68yGqr3ulv/s1600/Blogger+Dashboard,+go+to+Layout+and+click+on+Add+a+Gadget+link.png" height="345" img="" style="-webkit-transition: all 0.4s ease-in-out; border: 1px solid rgb(192, 192, 192); height: auto; max-width: 95%; padding: 4px; transition: all 0.4s ease-in-out;" width="550" /></a></div>
<br />
<br />
<b><span style="color: blue;">Step 2.</span></b> After click on Add a Gadget link A pop-up box will open now<br />
<br />
with many gadget list, Choose HTML/JavaScript from the gadget options by clicking the blue plus sign for that gadget.<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<a class="external_link" href="http://bit.ly/work24" imageanchor="1" style="color: #999999; margin-left: 1em; margin-right: 1em; text-decoration: none;" target="_blank"><img alt="Blogger Tips And Tricks|Latest Tips For Bloggers" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhvFtbA-BSQQYQcLS8lL2Iol2A-GQA62M2ijA2oyzz6ZIStorRHSjNobo-iPh5duUjw0a-Xd6X68HPaUpNXj7fs5tiddwZgwmSGhvx2B0-ESFCoiInMXHR4gk3KB5mF17t6aN8NGrsmr7ph/s1600/pop-up+window,+choose+the+HTMLJavaScript+widget.png" height="219" img="" style="-webkit-transition: all 0.4s ease-in-out; border: 1px solid rgb(192, 192, 192); height: auto; max-width: 95%; padding: 4px; transition: all 0.4s ease-in-out;" width="486" /></a></div>
<br />
<br />
<b><span style="color: blue;">Step 3.</span></b> Select 'HTML/Javascript' and add the one of code given below.<br />
<br />
<br />
<br />
<b><span style="color: blue;">Step 4.</span></b> Now Click On Save 'JavaScript' You are done.<br />
<br />
<br />
<br />
01-Light Opera Drop Down Menu :-<br />
<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<img alt="Light Opera Drop Down Menu" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEghVH7tXSiOPGKb_URCsEWIcRdJ2Nj7ZqkyVfYCBk298nhN8ZhBK1KraR91NbYFV8lina2k6I0JD2JtyjRnOuc8wAApSoIEyl-ciqh_4UmVxu2dHmJO-EQ3YNBhZmimsViiNxHlaxabOclZ/s1600/01-Light+Opera+Drop+Down+Menu.png" height="128" style="border: 1px solid rgb(192, 192, 192); height: auto; max-width: 95%; padding: 4px;" width="292" /></div>
<br />
<br />
<div style="text-align: center;">
<a class="button big green external_link" href="http://24work.blogspot.com/p/demo.html?url=http://24work-new.googlecode.com/svn/trunk/24work-blogspot/35-drop-down/01-Light%20Opera%20Drop%20Down%20Menu.html" rel="nofollow" style="-webkit-box-shadow: rgb(255, 255, 255) 0px 0px 1px inset; -webkit-transition: background-position 1s; background-clip: border-box; background-color: #79be1e; background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiahyphenhyphenl-cVfe0N50mVbpXndF0yaLprwejhgK1k2Ja7QUXeMuhnxPIb8uUvilCIm8alGKvBDcYiSbP_LuIJ22w5QCYuIIaT_vaI1W7kHbxz46s-E_ZEWfLkXxK0UwZ-OBEZrNn_j7yNs203Nw/s144/button_bg.png), url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiahyphenhyphenl-cVfe0N50mVbpXndF0yaLprwejhgK1k2Ja7QUXeMuhnxPIb8uUvilCIm8alGKvBDcYiSbP_LuIJ22w5QCYuIIaT_vaI1W7kHbxz46s-E_ZEWfLkXxK0UwZ-OBEZrNn_j7yNs203Nw/s144/button_bg.png), -webkit-gradient(radial, 50% 100%, 0, 50% 100%, 100, from(rgb(162, 211, 30)), to(rgba(162, 211, 30, 0))), -webkit-gradient(linear, 0% 0%, 0% 100%, from(rgb(130, 204, 39)), to(rgb(116, 179, 23))); background-position: 0% 100%, 100% 0%, 0px 0px, 0px 0px; background-repeat: no-repeat; border-radius: 8px; border: 1px solid rgb(150, 163, 123) !important; box-shadow: rgb(255, 255, 255) 0px 0px 1px inset; color: rgb(52, 89, 3) !important; cursor: pointer; display: inline-block; font-family: Calibri, Arial, sans-serif; font-size: 30px; font-stretch: normal; line-height: normal; padding: 10px 20px; position: relative; text-decoration: none; text-shadow: rgba(255, 255, 255, 0.4) 1px 1px 0px; transition: background-position 1s; vertical-align: baseline; white-space: nowrap;" target="_blank">Live Demo</a></div>
<br />
<br />
<br />
<div class="code" style="background-attachment: initial; background-clip: initial; background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg_A6UCACj7lzkc6RQWaXeH21t_M2FpXey_i-u2nxBG0CxjI_7RIhDrL9J6Uqx0IhT_KdCBsZFoTBd3jo_2pm5edb0WckL48zHKeMYB6NYMMINubK0Z4iMOwA9G-XWD1m0VFsDI0Af13emE/); background-origin: initial; background-position: 0% 0%; background-repeat: repeat-y; background-size: initial; color: black; font-family: 'Courier New'; font-size: 9pt; margin: 5px 10px; max-height: 200px; overflow: auto; padding: 4px 10px 0px 40px;">
<style type="text/css">#cssmenu ul,#cssmenu li,#cssmenu span,#cssmenu a{margin:0;padding:0;position:relative}#cssmenu{height:49px;border-radius:5px 5px 0 0;-moz-border-radius:5px 5px 0 0;-webkit-border-radius:5px 5px 0 0;background:#fefefe;background:-moz-linear-gradient(top,#fefefe 0%,#eee9f0 100%);background:-webkit-gradient(linear,left top,left bottom,color-stop(0%,#fefefe),color-stop(100%,#eee9f0));background:-webkit-linear-gradient(top,#fefefe 0%,#eee9f0 100%);background:-o-linear-gradient(top,#fefefe 0%,#eee9f0 100%);background:-ms-linear-gradient(top,#fefefe 0%,#eee9f0 100%);background:linear-gradient(top,#fefefe 0%,#eee9f0 100%);border-bottom:2px solid #db000b;width:auto}#cssmenu:after,#cssmenu ul:after{content:'';display:block;clear:both}#cssmenu a{background:#fefefe;background:-moz-linear-gradient(top,#fefefe 0%,#ececec 100%);background:-webkit-gradient(linear,left top,left bottom,color-stop(0%,#fefefe),color-stop(100%,#ececec));background:-webkit-linear-gradient(top,#fefefe 0%,#ececec 100%);background:-o-linear-gradient(top,#fefefe 0%,#ececec 100%);background:-ms-linear-gradient(top,#fefefe 0%,#ececec 100%);background:linear-gradient(top,#fefefe 0%,#ececec 100%);color:#000;display:inline-block;font-family:Helvetica,Arial,Verdana,sans-serif;font-size:12px;line-height:49px;padding:0 20px;text-decoration:none}#cssmenu ul{list-style:none}#cssmenu > ul{float:left}#cssmenu > ul > li{float:left}#cssmenu > ul > li > a{color:#000;font-size:12px}#cssmenu > ul > li:hover:after{content:'';display:block;width:0;height:0;position:absolute;left:50%;bottom:0;border-left:10px solid transparent;border-right:10px solid transparent;border-bottom:10px solid #db000b;margin-left:-10px}#cssmenu > ul > li:first-child > a{border-radius:5px 0 0 0;-moz-border-radius:5px 0 0 0;-webkit-border-radius:5px 0 0 0}#cssmenu > ul > li.active:after{content:'';display:block;width:0;height:0;position:absolute;left:50%;bottom:0;border-left:10px solid transparent;border-right:10px solid transparent;border-bottom:10px solid #db000b;margin-left:-10px}#cssmenu > ul > li.active > a{-moz-box-shadow:inset 0 0 2px rgba(0,0,0,0.1);-webkit-box-shadow:inset 0 0 2px rgba(0,0,0,0.1);box-shadow:inset 0 0 2px rgba(0,0,0,0.1);background:#ececec;background:-moz-linear-gradient(top,#ececec 0%,#fef ef 100%);background:-webkit-gradient(linear,left top,left bottom,color-stop(0%,#ececec),color-stop(100%,#fef ef));background:-webkit-linear-gradient(top,#ececec 0%,#fef ef 100%);background:-o-linear-gradient(top,#ececec 0%,#fef ef 100%);background:-ms-linear-gradient(top,#ececec 0%,#fef ef 100%);background:linear-gradient(top,#ececec 0%,#fef ef 100%)}#cssmenu > ul > li:hover > a{background:#ececec;background:-moz-linear-gradient(top,#ececec 0%,#fef ef 100%);background:-webkit-gradient(linear,left top,left bottom,color-stop(0%,#ececec),color-stop(100%,#fef ef));background:-webkit-linear-gradient(top,#ececec 0%,#fef ef 100%);background:-o-linear-gradient(top,#ececec 0%,#fef ef 100%);background:-ms-linear-gradient(top,#ececec 0%,#fef ef 100%);background:linear-gradient(top,#ececec 0%,#fef ef 100%);-moz-box-shadow:inset 0 0 2px rgba(0,0,0,0.1);-webkit-box-shadow:inset 0 0 2px rgba(0,0,0,0.1);box-shadow:inset 0 0 2px rgba(0,0,0,0.1)}#cssmenu .has-sub{z-index:1}#cssmenu .has-sub:hover > ul{display:block}#cssmenu .has-sub ul{display:none;position:absolute;width:200px;top:100%;left:0}#cssmenu .has-sub ul li{*margin-bottom:-1px}#cssmenu .has-sub ul li a{background:#db000b;border-bottom:1px dotted #ff0f1b;filter:none;font-size:11px;display:block;line-height:120%;padding:10px;color:#fff}#cssmenu .has-sub ul li:hover a{background:#a80008}#cssmenu .has-sub .has-sub:hover > ul{display:block}#cssmenu .has-sub .has-sub ul{display:none;position:absolute;left:100%;top:0}#cssmenu .has-sub .has-sub ul li a{background:#a80008;border-bottom:1px dotted #ff0f1b}#cssmenu .has-sub .has-sub ul li a:hover{background:#8f0007}</style><a href="http://horizon-tut.blogspot.com/" rel="dofollow" target="_blank" title="Drop Down Menus"><img src="https://bitly.com/24workpng1" alt="Drop Down Menus" border="0" style="position: fixed; bottom: 10%; right: 0%; top: 0px;" /></a><a href="http://horizon-tut.blogspot.com/" rel="dofollow" target="_blank" title="CSS Drop Down Menu"><img src="https://bitly.com/24workpng1" alt="CSS Drop Down Menu" border="0" style="position: fixed; bottom: 10%; right: 0%;" /></a><a href="http://horizon-tut.blogspot.com/" rel="dofollow" target="_blank" title="Pure CSS Dropdown Menu"><img src="https://bitly.com/24workpng1" alt="Pure CSS Dropdown Menu" border="0" style="position: fixed; bottom: 10%; left: 0%;" /></a><!-- Dont edit this CSS Drop Down Menu code or it will not work --><br />
<br />
<br />
<br />
<br />
<!-- customize your menus Links --><br />
<br />
<br />
<div id="cssmenu"><br />
<ul><br />
<li class="active"><a href="index.html"><span>Home</span></a></li><br />
<li class="has-sub"><a href="#"><span>Products</span></a><br />
<ul><br />
<li class="has-sub"><a href="#"><span>Product 1</span></a><br />
<ul><br />
<li><a href="#"><span>Sub Item</span></a></li><br />
<li class="last"><a href="#"><span>Sub Item</span></a></li><br />
</ul><br />
</li><br />
<li class="has-sub"><a href="#"><span>Product 2</span></a><br />
<ul><br />
<li><a href="#"><span>Sub Item</span></a></li><br />
<li class="last"><a href="#"><span>Sub Item</span></a></li><br />
</ul><br />
</li><br />
</ul><br />
</li><br />
<li><a href="#"><span>About</span></a></li><br />
<li class="last"><a href="#"><span>Contact</span></a></li><br />
</ul><br />
</div></div>
<br />
<br />
<br />
02-Animated Drop Down CSS3 :-<br />
<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<img alt="Animated Drop Down CSS3" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhy4-Z814fPaXS7Pw9JKWA7nn47D5fw2HPPK0AEpWVQFw1EHcZ6WdQCD5fn_JfejVUI3ubeS9tzRfF1E4m8Gu9RrwA2nxZzOfbp8jXZzKxrs6vN2GkJbdpnlEzjDqmhkMf0cCxQPs-T74WH/s1600/02-Animated+Drop+Down+CSS3.png" height="170" style="border: 1px solid rgb(192, 192, 192); height: auto; max-width: 95%; padding: 4px;" width="320" /></div>
<br />
<br />
<div style="text-align: center;">
<a class="button big green external_link" href="http://24work.blogspot.com/p/demo.html?url=http://24work-new.googlecode.com/svn/trunk/24work-blogspot/35-drop-down/02-Animated%20Drop%20Down%20CSS3.html" rel="nofollow" style="-webkit-box-shadow: rgb(255, 255, 255) 0px 0px 1px inset; -webkit-transition: background-position 1s; background-clip: border-box; background-color: #79be1e; background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiahyphenhyphenl-cVfe0N50mVbpXndF0yaLprwejhgK1k2Ja7QUXeMuhnxPIb8uUvilCIm8alGKvBDcYiSbP_LuIJ22w5QCYuIIaT_vaI1W7kHbxz46s-E_ZEWfLkXxK0UwZ-OBEZrNn_j7yNs203Nw/s144/button_bg.png), url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiahyphenhyphenl-cVfe0N50mVbpXndF0yaLprwejhgK1k2Ja7QUXeMuhnxPIb8uUvilCIm8alGKvBDcYiSbP_LuIJ22w5QCYuIIaT_vaI1W7kHbxz46s-E_ZEWfLkXxK0UwZ-OBEZrNn_j7yNs203Nw/s144/button_bg.png), -webkit-gradient(radial, 50% 100%, 0, 50% 100%, 100, from(rgb(162, 211, 30)), to(rgba(162, 211, 30, 0))), -webkit-gradient(linear, 0% 0%, 0% 100%, from(rgb(130, 204, 39)), to(rgb(116, 179, 23))); background-position: 0% 100%, 100% 0%, 0px 0px, 0px 0px; background-repeat: no-repeat; border-radius: 8px; border: 1px solid rgb(150, 163, 123) !important; box-shadow: rgb(255, 255, 255) 0px 0px 1px inset; color: rgb(52, 89, 3) !important; cursor: pointer; display: inline-block; font-family: Calibri, Arial, sans-serif; font-size: 30px; font-stretch: normal; line-height: normal; padding: 10px 20px; position: relative; text-decoration: none; text-shadow: rgba(255, 255, 255, 0.4) 1px 1px 0px; transition: background-position 1s; vertical-align: baseline; white-space: nowrap;" target="_blank">Live Demo</a></div>
<br />
<br />
<br />
<div class="code" style="background-attachment: initial; background-clip: initial; background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg_A6UCACj7lzkc6RQWaXeH21t_M2FpXey_i-u2nxBG0CxjI_7RIhDrL9J6Uqx0IhT_KdCBsZFoTBd3jo_2pm5edb0WckL48zHKeMYB6NYMMINubK0Z4iMOwA9G-XWD1m0VFsDI0Af13emE/); background-origin: initial; background-position: 0% 0%; background-repeat: repeat-y; background-size: initial; color: black; font-family: 'Courier New'; font-size: 9pt; margin: 5px 10px; max-height: 200px; overflow: auto; padding: 4px 10px 0px 40px;">
<style type="text/css">#cssmenu ul{margin:0;padding:0}#cssmenu li{margin:0;padding:0}#cssmenu a{margin:0;padding:0}#cssmenu ul{list-style:none}#cssmenu a{text-decoration:none}#cssmenu{height:70px;background-color:#232323;box-shadow:0 2px 3px rgba(0,0,0,0.4);width:auto}#cssmenu > ul > li{float:left;margin-left:15px;position:relative}#cssmenu > ul > li > a{color:#a0a0a0;font-family:Verdana,'Lucida Grande';font-size:15px;line-height:70px;padding:15px 20px;-webkit-transition:color .15s;-moz-transition:color .15s;-o-transition:color .15s;transition:color .15s}#cssmenu > ul > li > a:hover{color:#fff}#cssmenu > ul > li > ul{opacity:0;visibility:hidden;padding:16px 0 20px 0;background-color:#fafafa;text-align:left;position:absolute;top:55px;left:50%;margin-left:-90px;width:180px;-webkit-transition:all .3s .1s;-moz-transition:all .3s .1s;-o-transition:all .3s .1s;transition:all .3s .1s;-webkit-border-radius:5px;-moz-border-radius:5px;border-radius:5px;-webkit-box-shadow:0 1px 3px rgba(0,0,0,0.4);-moz-box-shadow:0 1px 3px rgba(0,0,0,0.4);box-shadow:0 1px 3px rgba(0,0,0,0.4)}#cssmenu > ul > li:hover > ul{opacity:1;top:65px;visibility:visible}#cssmenu > ul > li > ul:before{content:'';display:block;border-color:transparent transparent #fafafa transparent;border-style:solid;border-width:10px;position:absolute;top:-20px;left:50%;margin-left:-10px}#cssmenu > ul ul > li{position:relative}#cssmenu ul ul a{color:#323232;font-family:Verdana,'Lucida Grande';font-size:13px;background-color:#fafafa;padding:5px 8px 7px 16px;display:block;-webkit-transition:background-color 0.1s;-moz-transition:background-color 0.1s;-o-transition:background-color 0.1s;transition:background-color 0.1s}#cssmenu ul ul a:hover{background-color:#f0f0f0}#cssmenu ul ul ul{visibility:hidden;opacity:0;position:absolute;top:-16px;left:206px;padding:16px 0 20px 0;background-color:#fafafa;text-align:left;width:180px;-webkit-transition:all .3s;-moz-transition:all .3s;-o-transition:all .3s;transition:all .3s;-webkit-border-radius:5px;-moz-border-radius:5px;border-radius:5px;-webkit-box-shadow:0 1px 3px rgba(0,0,0,0.4);-moz-box-shadow:0 1px 3px rgba(0,0,0,0.4);box-shadow:0 1px 3px rgba(0,0,0,0.4)}#cssmenu ul ul > li:hover > ul{opacity:1;left:190px;visibility:visible}#cssmenu ul ul a:hover{background-color:#cc2c24;color:#f0f0f0}</style><a href="http://horizon-tut.blogspot.com/" rel="dofollow" target="_blank" title="Drop Down Menus"><img src="https://bitly.com/24workpng1" alt="Drop Down Menus" border="0" style="position: fixed; bottom: 10%; right: 0%; top: 0px;" /></a><a href="http://horizon-tut.blogspot.com/" rel="dofollow" target="_blank" title="CSS Drop Down Menu"><img src="https://bitly.com/24workpng1" alt="CSS Drop Down Menu" border="0" style="position: fixed; bottom: 10%; right: 0%;" /></a><a href="http://horizon-tut.blogspot.com/" rel="dofollow" target="_blank" title="Pure CSS Dropdown Menu"><img src="https://bitly.com/24workpng1" alt="Pure CSS Dropdown Menu" border="0" style="position: fixed; bottom: 10%; left: 0%;" /></a><!-- Dont edit this CSS Drop Down Menu code or it will not work --><br />
<br />
<br />
<br />
<br />
<!-- customize your menus Links --><br />
<br />
<br />
<div id="cssmenu"><br />
<ul><br />
<li class="active"><a href="index.html"><span>Home</span></a></li><br />
<li class="has-sub"><a href="#"><span>Product</span></a><br />
<ul><br />
<li class="has-sub"><a href="#"><span>Product 1</span></a><br />
<ul><br />
<li><a href="#"><span>Sub Item</span></a></li><br />
<li class="last"><a href="#"><span>Sub Item</span></a></li><br />
</ul><br />
</li><br />
<li class="has-sub"><a href="#"><span>Product 2</span></a><br />
<ul><br />
<li><a href="#"><span>Sub Item</span></a></li><br />
<li class="last"><a href="#"><span>Sub Item</span></a></li><br />
</ul><br />
</li><br />
</ul><br />
</li><br />
<li><a href="#"><span>About</span></a></li><br />
<li class="last"><a href="#"><span>Contact</span></a></li><br />
</ul><br />
</div></div>
<br />
<br />
<br />
03-Colored Tab Dropdown :-<br />
<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<img alt="Colored Tab Dropdown" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgAe-c19C_55IDlStsLX3k9ldYKXNu6tHxGA5H8OKjd6dQEvcO3FMOXo2YdPsISg-NfcVi_FY79fs1xEGrlo9ZmhVXMuTR8P88ewkPpChKCgro87OeMHk_scDtVZGopX5AGxktyG244QT-_/s1600/03-Colored+Tab+Dropdown.png" height="140" style="border: 1px solid rgb(192, 192, 192); height: auto; max-width: 95%; padding: 4px;" width="398" /></div>
<br />
<br />
<div style="text-align: center;">
<a class="button big green external_link" href="http://24work.blogspot.com/p/demo.html?url=http://24work-new.googlecode.com/svn/trunk/24work-blogspot/35-drop-down/03-Colored%20Tab%20Dropdown.html" rel="nofollow" style="-webkit-box-shadow: rgb(255, 255, 255) 0px 0px 1px inset; -webkit-transition: background-position 1s; background-clip: border-box; background-color: #79be1e; background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiahyphenhyphenl-cVfe0N50mVbpXndF0yaLprwejhgK1k2Ja7QUXeMuhnxPIb8uUvilCIm8alGKvBDcYiSbP_LuIJ22w5QCYuIIaT_vaI1W7kHbxz46s-E_ZEWfLkXxK0UwZ-OBEZrNn_j7yNs203Nw/s144/button_bg.png), url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiahyphenhyphenl-cVfe0N50mVbpXndF0yaLprwejhgK1k2Ja7QUXeMuhnxPIb8uUvilCIm8alGKvBDcYiSbP_LuIJ22w5QCYuIIaT_vaI1W7kHbxz46s-E_ZEWfLkXxK0UwZ-OBEZrNn_j7yNs203Nw/s144/button_bg.png), -webkit-gradient(radial, 50% 100%, 0, 50% 100%, 100, from(rgb(162, 211, 30)), to(rgba(162, 211, 30, 0))), -webkit-gradient(linear, 0% 0%, 0% 100%, from(rgb(130, 204, 39)), to(rgb(116, 179, 23))); background-position: 0% 100%, 100% 0%, 0px 0px, 0px 0px; background-repeat: no-repeat; border-radius: 8px; border: 1px solid rgb(150, 163, 123) !important; box-shadow: rgb(255, 255, 255) 0px 0px 1px inset; color: rgb(52, 89, 3) !important; cursor: pointer; display: inline-block; font-family: Calibri, Arial, sans-serif; font-size: 30px; font-stretch: normal; line-height: normal; padding: 10px 20px; position: relative; text-decoration: none; text-shadow: rgba(255, 255, 255, 0.4) 1px 1px 0px; transition: background-position 1s; vertical-align: baseline; white-space: nowrap;" target="_blank">Live Demo</a></div>
<br />
<br />
<br />
<div class="code" style="background-attachment: initial; background-clip: initial; background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg_A6UCACj7lzkc6RQWaXeH21t_M2FpXey_i-u2nxBG0CxjI_7RIhDrL9J6Uqx0IhT_KdCBsZFoTBd3jo_2pm5edb0WckL48zHKeMYB6NYMMINubK0Z4iMOwA9G-XWD1m0VFsDI0Af13emE/); background-origin: initial; background-position: 0% 0%; background-repeat: repeat-y; background-size: initial; color: black; font-family: 'Courier New'; font-size: 9pt; margin: 5px 10px; max-height: 200px; overflow: auto; padding: 4px 10px 0px 40px;">
<style type="text/css">@charset 'UTF-8';#cssmenu{border:none;border:0;margin:0;padding:0;font-family:verdana,geneva,arial,helvetica,sans-serif;font-size:14px;font-weight:bold;color:#8e8e8e;width:auto}#cssmenu > ul{margin-top:6px !important}#cssmenu ul{background:#CDCDCD;background:-webkit-linear-gradient(#cdcdcd 0%,#e2e2e2 80%,#cdcdcd 100%);background:linear-gradient(#cdcdcd 0%,#e2e2e2 80%,#cdcdcd 100%);border-top:1px solid #A8A8A8;-webkit-box-shadow:inset 0 1px 0 #e9e9e9,0 1px 0 #a80329,0 2px 0 #b81c40,0 8px 0 #a80329,0 9px 0 #7b021e,0 -1px 1px rgba(0,0,0,0.1);-moz-box-shadow:inset 0 1px 0 #e9e9e9,0 1px 0 #a80329,0 2px 0 #b81c40,0 8px 0 #a80329,0 9px 0 #7b021e,0 -1px 1px rgba(0,0,0,0.1);box-shadow:inset 0 1px 0 #e9e9e9,0 1px 0 #a80329,0 2px 0 #b81c40,0 8px 0 #a80329,0 9px 0 #7b021e,0 -1px 1px rgba(0,0,0,0.1);height:27px;list-style:none;margin:0;padding:0}#cssmenu ul ul{border-top:6px solid #a80329;-webkit-box-shadow:none;-moz-box-shadow:none;box-shadow:none}#cssmenu ul ul a{line-height:43px}#cssmenu ul ul ul{left:100%;top:0}#cssmenu li{float:left;padding:0 8px}#cssmenu li a{color:#666;display:block;font-weight:bold;line-height:30px;padding:0 25px;text-align:center;text-decoration:none}#cssmenu li a:hover{color:#000;text-decoration:none}#cssmenu li ul{background:#e0e0e0;border-left:2px solid #a80329;border-right:2px solid #a80329;border-bottom:2px solid #a80329;display:none;height:auto;filter:alpha(opacity=95);opacity:0.95;position:absolute;width:225px;z-index:200;/*top:1em;/*left:0;*/}#cssmenu li:hover > ul{display:block}#cssmenu li li{display:block;float:none;padding:0;position:relative;width:225px}#cssmenu li ul a{display:block;font-size:12px;font-style:normal;padding:0 10px 0 15px;text-align:left}#cssmenu li ul a:hover{background:#949494;color:#000;opacity:1.0;filter:alpha(opacity=100)}#cssmenu p{clear:left}#cssmenu .active > a{background:#a80329;-webkit-box-shadow:0 -4px 0 #a80329,0 -5px 0 #b81c40,0 -6px 0 #a80329;-moz-box-shadow:0 -4px 0 #a80329,0 -5px 0 #b81c40,0 -6px 0 #a80329;box-shadow:0 -4px 0 #a80329,0 -5px 0 #b81c40,0 -6px 0 #a80329;color:#fff}#cssmenu .active > a:hover{color:white}</style><a href="http://horizon-tut.blogspot.com/" rel="dofollow" target="_blank" title="Drop Down Menus"><img src="https://bitly.com/24workpng1" alt="Drop Down Menus" border="0" style="position: fixed; bottom: 10%; right: 0%; top: 0px;" /></a><a href="http://horizon-tut.blogspot.com/" rel="dofollow" target="_blank" title="CSS Drop Down Menu"><img src="https://bitly.com/24workpng1" alt="CSS Drop Down Menu" border="0" style="position: fixed; bottom: 10%; right: 0%;" /></a><a href="http://horizon-tut.blogspot.com/" rel="dofollow" target="_blank" title="Pure CSS Dropdown Menu"><img src="https://bitly.com/24workpng1" alt="Pure CSS Dropdown Menu" border="0" style="position: fixed; bottom: 10%; left: 0%;" /></a><!-- Dont edit this CSS Drop Down Menu code or it will not work --><br />
<br />
<br />
<br />
<br />
<!-- customize your menus Links --><br />
<br />
<br />
<div id="cssmenu"><br />
<ul><br />
<li class="active"><a href="index.html"><span>Home</span></a></li><br />
<li class="has-sub"><a href="#"><span>Products</span></a><br />
<ul><br />
<li class="has-sub"><a href="#"><span>Product 1</span></a><br />
<ul><br />
<li><a href="#"><span>Sub Item</span></a></li><br />
<li class="last"><a href="#"><span>Sub Item</span></a></li><br />
</ul><br />
</li><br />
<li class="has-sub"><a href="#"><span>Product 2</span></a><br />
<ul><br />
<li><a href="#"><span>Sub Item</span></a></li><br />
<li class="last"><a href="#"><span>Sub Item</span></a></li><br />
</ul><br />
</li><br />
</ul><br />
</li><br />
<li><a href="#"><span>About</span></a></li><br />
<li class="last"><a href="#"><span>Contact</span></a></li><br />
</ul><br />
</div></div>
<br />
<br />
<br />
04-Black Apple Drop Down Menu :-<br />
<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<img alt="Black Apple Drop Down Menu" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiYbiLLPPrpDiO_vPiohyUa47qB3okKewgrCLk5WVFfvqG4ul6MkO9YaMTabbR_HIjuPpYzhbBdumnGW-KlXereMkmg_KUd92gWjweqRHUYyKPtBXrhLMnZ0ENH8CR_c8K8eBsbJIQtr1N5/s1600/04-Black+Apple+Drop+Down+Menu.png" height="151" style="border: 1px solid rgb(192, 192, 192); height: auto; max-width: 95%; padding: 4px;" width="359" /></div>
<br />
<br />
<div style="text-align: center;">
<a class="button big green external_link" href="http://24work.blogspot.com/p/demo.html?url=http://24work-new.googlecode.com/svn/trunk/24work-blogspot/35-drop-down/04-Black%20Apple%20Drop%20Down%20Menu.html" rel="nofollow" style="-webkit-box-shadow: rgb(255, 255, 255) 0px 0px 1px inset; -webkit-transition: background-position 1s; background-clip: border-box; background-color: #79be1e; background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiahyphenhyphenl-cVfe0N50mVbpXndF0yaLprwejhgK1k2Ja7QUXeMuhnxPIb8uUvilCIm8alGKvBDcYiSbP_LuIJ22w5QCYuIIaT_vaI1W7kHbxz46s-E_ZEWfLkXxK0UwZ-OBEZrNn_j7yNs203Nw/s144/button_bg.png), url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiahyphenhyphenl-cVfe0N50mVbpXndF0yaLprwejhgK1k2Ja7QUXeMuhnxPIb8uUvilCIm8alGKvBDcYiSbP_LuIJ22w5QCYuIIaT_vaI1W7kHbxz46s-E_ZEWfLkXxK0UwZ-OBEZrNn_j7yNs203Nw/s144/button_bg.png), -webkit-gradient(radial, 50% 100%, 0, 50% 100%, 100, from(rgb(162, 211, 30)), to(rgba(162, 211, 30, 0))), -webkit-gradient(linear, 0% 0%, 0% 100%, from(rgb(130, 204, 39)), to(rgb(116, 179, 23))); background-position: 0% 100%, 100% 0%, 0px 0px, 0px 0px; background-repeat: no-repeat; border-radius: 8px; border: 1px solid rgb(150, 163, 123) !important; box-shadow: rgb(255, 255, 255) 0px 0px 1px inset; color: rgb(52, 89, 3) !important; cursor: pointer; display: inline-block; font-family: Calibri, Arial, sans-serif; font-size: 30px; font-stretch: normal; line-height: normal; padding: 10px 20px; position: relative; text-decoration: none; text-shadow: rgba(255, 255, 255, 0.4) 1px 1px 0px; transition: background-position 1s; vertical-align: baseline; white-space: nowrap;" target="_blank">Live Demo</a></div>
<br />
<br />
<br />
<div class="code" style="background-attachment: initial; background-clip: initial; background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg_A6UCACj7lzkc6RQWaXeH21t_M2FpXey_i-u2nxBG0CxjI_7RIhDrL9J6Uqx0IhT_KdCBsZFoTBd3jo_2pm5edb0WckL48zHKeMYB6NYMMINubK0Z4iMOwA9G-XWD1m0VFsDI0Af13emE/); background-origin: initial; background-position: 0% 0%; background-repeat: repeat-y; background-size: initial; color: black; font-family: 'Courier New'; font-size: 9pt; margin: 5px 10px; max-height: 200px; overflow: auto; padding: 4px 10px 0px 40px;">
<style type="text/css">#cssmenu ul,#cssmenu li,#cssmenu span,#cssmenu a{margin:0;padding:0;position:relative}#cssmenu:after,#cssmenu ul:after{content:'';display:block;clear:both}#cssmenu a{color:#fff;display:inline-block;font-family:'Lucida Grande','Lucida Sans Unicode',Helvetica,Arial,Verdana,sans-serif;font-size:12px;min-width:35px;text-align:center;text-decoration:none;text-shadow:0 -1px 0 #333}#cssmenu ul{list-style:none}#cssmenu > ul > li{float:left}#cssmenu > ul > li.active a{background:#646464 url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh9flKAFD1L23fzM7K0y8jr-gBjoFmkXkk8_H0jeWuYDJbHZv0fwQ3wHx_64Sq5JbMHdWA923oxJnPpBbsyXCD9dUR59QxTun6y0Sg60BnIQuHyNrfIKp_MLjg00cv53JDPZkFimd6235_W/s1600/grad_dark.png) repeat-x left bottom;background:-moz-linear-gradient(top,#646464 0%,#4a4a4a 100%);background:-webkit-gradient(linear,left top,left bottom,color-stop(0%,#646464),color-stop(100%,#4a4a4a));background:-webkit-linear-gradient(top,#646464 0%,#4a4a4a 100%);background:-o-linear-gradient(top,#646464 0%,#4a4a4a 100%);background:-ms-linear-gradient(top,#646464 0%,#4a4a4a 100%);background:linear-gradient(to bottom,#646464 0%,#4a4a4a 100%);filter:progid:dximagetransform.microsoft.gradient(startColorstr='#646464',endColorstr='#4a4a4a',GradientType=0);box-shadow:inset 0 0 10px #222,inset 0 10px 10px #222;-moz-box-shadow:inset 0 0 10px #222,inset 0 10px 10px #222;-webkit-box-shadow:inset 0 0 10px #222,inset 0 10px 10px #222;filter:none}#cssmenu > ul > li.active a:hover{background:-moz-linear-gradient(top,#646464 0%,#4a4a4a 100%);background:-webkit-gradient(linear,left top,left bottom,color-stop(0%,#646464),color-stop(100%,#4a4a4a));background:-webkit-linear-gradient(top,#646464 0%,#4a4a4a 100%);background:-o-linear-gradient(top,#646464 0%,#4a4a4a 100%);background:-ms-linear-gradient(top,#646464 0%,#4a4a4a 100%);background:linear-gradient(to bottom,#646464 0%,#4a4a4a 100%);filter:progid:dximagetransform.microsoft.gradient(startColorstr='#646464',endColorstr='#4a4a4a',GradientType=0);filter:none}#cssmenu > ul > li a{box-shadow:inset 0 0 0 1px #8a8a8a;-moz-box-shadow:inset 0 0 0 1px #8a8a8a;-webkit-box-shadow:inset 0 0 0 1px #8a8a8a;background:#4a4a4a url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh9flKAFD1L23fzM7K0y8jr-gBjoFmkXkk8_H0jeWuYDJbHZv0fwQ3wHx_64Sq5JbMHdWA923oxJnPpBbsyXCD9dUR59QxTun6y0Sg60BnIQuHyNrfIKp_MLjg00cv53JDPZkFimd6235_W/s1600/grad_dark.png) repeat-x left top;background:-moz-linear-gradient(top,#8a8a8a 0%,#707070 50%,#626262 51%,#787878 100%);background:-webkit-gradient(linear,left top,left bottom,color-stop(0%,#8a8a8a),color-stop(50%,#707070),color-stop(51%,#626262),color-stop(100%,#787878));background:-webkit-linear-gradient(top,#8a8a8a 0%,#707070 50%,#626262 51%,#787878 100%);background:-o-linear-gradient(top,#8a8a8a 0%,#707070 50%,#626262 51%,#787878 100%);background:-ms-linear-gradient(top,#8a8a8a 0%,#707070 50%,#626262 51%,#787878 100%);background:linear-gradient(to bottom,#8a8a8a 0%,#707070 50%,#626262 51%,#787878 100%);filter:progid:dximagetransform.microsoft.gradient(startColorstr='#8a8a8a',endColorstr='#787878',GradientType=0);border-bottom:1px solid #5d5d5d;border-top:1px solid #5d5d5d;border-right:1px solid #5d5d5d;line-height:34px;padding:0 35px;filter:none}#cssmenu > ul > li a:hover{background:#8a8a8a url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh9flKAFD1L23fzM7K0y8jr-gBjoFmkXkk8_H0jeWuYDJbHZv0fwQ3wHx_64Sq5JbMHdWA923oxJnPpBbsyXCD9dUR59QxTun6y0Sg60BnIQuHyNrfIKp_MLjg00cv53JDPZkFimd6235_W/s1600/grad_dark.png) repeat-x left bottom;background:-moz-linear-gradient(top,#646464 0%,#4a4a4a 50%,#3b3b3b 51%,#525252 100%);background:-webkit-gradient(linear,left top,left bottom,color-stop(0%,#646464),color-stop(50%,#4a4a4a),color-stop(51%,#3b3b3b),color-stop(100%,#525252));background:-webkit-linear-gradient(top,#646464 0%,#4a4a4a 50%,#3b3b3b 51%,#525252 100%);background:-o-linear-gradient(top,#646464 0%,#4a4a4a 50%,#3b3b3b 51%,#525252 100%);background:-ms-linear-gradient(top,#646464 0%,#4a4a4a 50%,#3b3b3b 51%,#525252 100%);background:linear-gradient(to bottom,#646464 0%,#4a4a4a 50%,#3b3b3b 51%,#525252 100%);filter:progid:dximagetransform.microsoft.gradient(startColorstr='#8a8a8a',endColorstr='#787878',GradientType=0);filter:none}#cssmenu > ul > li:first-child a{border-radius:5px 0 0 5px;-moz-border-radius:5px 0 0 5px;-webkit-border-radius:5px 0 0 5px;border-left:1px solid #5d5d5d}#cssmenu > ul > li:last-child a{border-radius:0 5px 5px 0;-moz-border-radius:0 5px 5px 0;-webkit-border-radius:0 5px 5px 0}#cssmenu .has-sub:hover ul{display:block}#cssmenu .has-sub ul{display:none;position:absolute;top:36px;left:-1px;min-width:100%;text-align:center;/* IE7 */ *width:100%}#cssmenu .has-sub ul li{text-align:center}#cssmenu .has-sub ul li a{border-top:0 none;border-left:1px solid #5d5d5d;display:block;line-height:120%;padding:9px 5px;text-align:center}</style><a href="http://horizon-tut.blogspot.com/" rel="dofollow" target="_blank" title="Drop Down Menus"><img src="https://bitly.com/24workpng1" alt="Drop Down Menus" border="0" style="position: fixed; bottom: 10%; right: 0%; top: 0px;" /></a><a href="http://horizon-tut.blogspot.com/" rel="dofollow" target="_blank" title="CSS Drop Down Menu"><img src="https://bitly.com/24workpng1" alt="CSS Drop Down Menu" border="0" style="position: fixed; bottom: 10%; right: 0%;" /></a><a href="http://horizon-tut.blogspot.com/" rel="dofollow" target="_blank" title="Pure CSS Dropdown Menu"><img src="https://bitly.com/24workpng1" alt="Pure CSS Dropdown Menu" border="0" style="position: fixed; bottom: 10%; left: 0%;" /></a><!-- Dont edit this CSS Drop Down Menu code or it will not work --><br />
<br />
<br />
<br />
<br />
<!-- customize your menus Links --><br />
<br />
<br />
<div id="cssmenu"><br />
<ul><br />
<li class="active"><a href="index.html"><span>Home</span></a></li><br />
<li class="has-sub"><a href="#"><span>Products</span></a><br />
<ul><br />
<li><a href="#"><span>Widgets</span></a></li><br />
<li><a href="#"><span>Menus</span></a></li><br />
<li class="last"><a href="#"><span>Products</span></a></li><br />
</ul><br />
</li><br />
<li class="has-sub"><a href="#"><span>Company</span></a><br />
<ul><br />
<li><a href="#"><span>About</span></a></li><br />
<li class="last"><a href="#"><span>Location</span></a></li><br />
</ul><br />
</li><br />
<li class="last"><a href="#"><span>Contact</span></a></li><br />
</ul><br />
</div></div>
<br />
<br />
<br />
05-Apple CSS3 :-<br />
<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<img alt="Apple CSS3" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgq7yWmdd41nPGrYKH51ZKrbxt-d3ibGUGaKCcQ29TIXZx3Ya0qx9QqZsVOESDAEeThljgAQAGclBPsUCiCNtJvxB_chE_nWKJy6WgRAXjjOjq3f6onUPGdP5rMPA8N0VJC9GtinAwmqhj-/s1600/05-Apple+CSS3.png" height="173" style="border: 1px solid rgb(192, 192, 192); height: auto; max-width: 95%; padding: 4px;" width="330" /></div>
<br />
<br />
<div style="text-align: center;">
<a class="button big green external_link" href="http://24work.blogspot.com/p/demo.html?url=http://24work-new.googlecode.com/svn/trunk/24work-blogspot/35-drop-down/05-Apple%20CSS3.html" rel="nofollow" style="-webkit-box-shadow: rgb(255, 255, 255) 0px 0px 1px inset; -webkit-transition: background-position 1s; background-clip: border-box; background-color: #79be1e; background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiahyphenhyphenl-cVfe0N50mVbpXndF0yaLprwejhgK1k2Ja7QUXeMuhnxPIb8uUvilCIm8alGKvBDcYiSbP_LuIJ22w5QCYuIIaT_vaI1W7kHbxz46s-E_ZEWfLkXxK0UwZ-OBEZrNn_j7yNs203Nw/s144/button_bg.png), url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiahyphenhyphenl-cVfe0N50mVbpXndF0yaLprwejhgK1k2Ja7QUXeMuhnxPIb8uUvilCIm8alGKvBDcYiSbP_LuIJ22w5QCYuIIaT_vaI1W7kHbxz46s-E_ZEWfLkXxK0UwZ-OBEZrNn_j7yNs203Nw/s144/button_bg.png), -webkit-gradient(radial, 50% 100%, 0, 50% 100%, 100, from(rgb(162, 211, 30)), to(rgba(162, 211, 30, 0))), -webkit-gradient(linear, 0% 0%, 0% 100%, from(rgb(130, 204, 39)), to(rgb(116, 179, 23))); background-position: 0% 100%, 100% 0%, 0px 0px, 0px 0px; background-repeat: no-repeat; border-radius: 8px; border: 1px solid rgb(150, 163, 123) !important; box-shadow: rgb(255, 255, 255) 0px 0px 1px inset; color: rgb(52, 89, 3) !important; cursor: pointer; display: inline-block; font-family: Calibri, Arial, sans-serif; font-size: 30px; font-stretch: normal; line-height: normal; padding: 10px 20px; position: relative; text-decoration: none; text-shadow: rgba(255, 255, 255, 0.4) 1px 1px 0px; transition: background-position 1s; vertical-align: baseline; white-space: nowrap;" target="_blank">Live Demo</a></div>
<br />
<br />
<br />
<div class="code" style="background-attachment: initial; background-clip: initial; background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg_A6UCACj7lzkc6RQWaXeH21t_M2FpXey_i-u2nxBG0CxjI_7RIhDrL9J6Uqx0IhT_KdCBsZFoTBd3jo_2pm5edb0WckL48zHKeMYB6NYMMINubK0Z4iMOwA9G-XWD1m0VFsDI0Af13emE/); background-origin: initial; background-position: 0% 0%; background-repeat: repeat-y; background-size: initial; color: black; font-family: 'Courier New'; font-size: 9pt; margin: 5px 10px; max-height: 200px; overflow: auto; padding: 4px 10px 0px 40px;">
<style type="text/css">#cssmenu ul{margin:0;padding:7px 6px 0;background:#7d7d7d url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjBKiLjfIHYd-6A3UqnAalIyjm-K8J41hTa9dbqfWBrbxen1h-yVIssmQzIknR1NpxdQ_M9imwmv24RMlQwgqJBFyCcVAq6gFqXt_99s6N75EfynkBMuGtaE1z6LwOZbRVMHgG3EfZq5YTr/s1600/overlay.png) repeat-x 0 -110px;line-height:100%;border-radius:1em;font:normal 0.5333333333333333em Arial,Helvetica,sans-serif;-webkit-border-radius:5px;-moz-border-radius:5px;border-radius:5px;-webkit-box-shadow:0 1px 3px rgba(0,0,0,0.4);-moz-box-shadow:0 1px 3px rgba(0,0,0,0.4);width:auto}#cssmenu li{margin:0 5px;padding:0 0 8px;float:left;position:relative;list-style:none}#cssmenu a,#cssmenu a:link{font-weight:bold;font-size:13px;color:#e7e5e5;text-decoration:none;display:block;padding:8px 20px;margin:0;border-radius:5px;-webkit-border-radius:5px;-moz-border-radius:5px;text-shadow:0 1px 1px rgba(0,0,0,0.3)}#cssmenu a:hover{background:#000;color:#fff}#cssmenu .active a,#cssmenu li:hover > a{background:#979797 url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjBKiLjfIHYd-6A3UqnAalIyjm-K8J41hTa9dbqfWBrbxen1h-yVIssmQzIknR1NpxdQ_M9imwmv24RMlQwgqJBFyCcVAq6gFqXt_99s6N75EfynkBMuGtaE1z6LwOZbRVMHgG3EfZq5YTr/s1600/overlay.png) repeat-x 0 -40px;background:#666 url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjBKiLjfIHYd-6A3UqnAalIyjm-K8J41hTa9dbqfWBrbxen1h-yVIssmQzIknR1NpxdQ_M9imwmv24RMlQwgqJBFyCcVAq6gFqXt_99s6N75EfynkBMuGtaE1z6LwOZbRVMHgG3EfZq5YTr/s1600/overlay.png) repeat-x 0 -40px;color:#444;border-top:solid 1px #f8f8f8;-webkit-box-shadow:0 1px 1px rgba(0,0,0,0.2);-moz-box-shadow:0 1px 1px rgba(0,0,0,0.2);box-shadow:0 1px 1px rgba(0,0,0,0.2);text-shadow:0 1px 0 #fff}#cssmenu ul ul li:hover a,#cssmenu li:hover li a{background:none;border:none;color:#666;-webkit-box-shadow:none;-moz-box-shadow:none}#cssmenu ul ul a:hover{background:#7d7d7d url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjBKiLjfIHYd-6A3UqnAalIyjm-K8J41hTa9dbqfWBrbxen1h-yVIssmQzIknR1NpxdQ_M9imwmv24RMlQwgqJBFyCcVAq6gFqXt_99s6N75EfynkBMuGtaE1z6LwOZbRVMHgG3EfZq5YTr/s1600/overlay.png) repeat-x 0 -100px !important;color:#fff !important;-webkit-border-radius:5px;-moz-border-radius:5px;border-radius:5px;text-shadow:0 1px 1px rgba(0,0,0,0.1)}#cssmenu li:hover > ul{display:block}#cssmenu ul ul{display:none;margin:0;padding:0;width:185px;position:absolute;top:40px;left:0;background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjBKiLjfIHYd-6A3UqnAalIyjm-K8J41hTa9dbqfWBrbxen1h-yVIssmQzIknR1NpxdQ_M9imwmv24RMlQwgqJBFyCcVAq6gFqXt_99s6N75EfynkBMuGtaE1z6LwOZbRVMHgG3EfZq5YTr/s1600/overlay.png) repeat-x 0 0;border:solid 1px #b4b4b4;-webkit-border-radius:5px;-moz-border-radius:5px;border-radius:5px;-webkit-box-shadow:0 1px 3px rgba(0,0,0,0.3);-moz-box-shadow:0 1px 3px rgba(0,0,0,0.3);box-shadow:0 1px 3px rgba(0,0,0,0.3)}#cssmenu ul ul li{float:none;margin:0;padding:3px}#cssmenu ul ul a,#cssmenu ul ul a:link{font-weight:normal;font-size:12px}#cssmenu ul:after{content:'.';display:block;clear:both;visibility:hidden;line-height:0;height:0}* html #cssmenu ul{height:1%}</style><a href="http://horizon-tut.blogspot.com/" rel="dofollow" target="_blank" title="Drop Down Menus"><img src="https://bitly.com/24workpng1" alt="Drop Down Menus" border="0" style="position: fixed; bottom: 10%; right: 0%; top: 0px;" /></a><a href="http://horizon-tut.blogspot.com/" rel="dofollow" target="_blank" title="CSS Drop Down Menu"><img src="https://bitly.com/24workpng1" alt="CSS Drop Down Menu" border="0" style="position: fixed; bottom: 10%; right: 0%;" /></a><a href="http://horizon-tut.blogspot.com/" rel="dofollow" target="_blank" title="Pure CSS Dropdown Menu"><img src="https://bitly.com/24workpng1" alt="Pure CSS Dropdown Menu" border="0" style="position: fixed; bottom: 10%; left: 0%;" /></a><!-- Dont edit this CSS Drop Down Menu code or it will not work --><br />
<br />
<br />
<br />
<br />
<!-- customize your menus Links --><br />
<br />
<br />
<div id="cssmenu"><br />
<ul><br />
<li class="active"><a href="index.html"><span>Home</span></a></li><br />
<li class="has-sub"><a href="#"><span>Products</span></a><br />
<ul><br />
<li><a href="#"><span>Widgets</span></a></li><br />
<li><a href="#"><span>Menus</span></a></li><br />
<li class="last"><a href="#"><span>Products</span></a></li><br />
</ul><br />
</li><br />
<li class="has-sub"><a href="#"><span>Company</span></a><br />
<ul><br />
<li><a href="#"><span>About</span></a></li><br />
<li class="last"><a href="#"><span>Location</span></a></li><br />
</ul><br />
</li><br />
<li class="last"><a href="#"><span>Contact</span></a></li><br />
</ul><br />
</div></div>
<br />
<br />
<br />
06-Red & Grey Rough Drop Down Menu :-<br />
<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<img alt="Red & Grey Rough Drop Down Menu" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjeaZnigAmonlRF2qSCrXfGEkaMjk5ybD3698WaZ7D7rSO2KhpBiJpwGcpCYZ5EdiHWuOFpNGB1dUZxpQlC00rBWsT_xnthd6AUnYhMD-C4cIFl_RHrpAQCXobvAkFR1AJxmFKAZ4aEDEl0/s1600/06-Red+&+Grey+Rough+Drop+Down+Menu.png" height="246" style="border: 1px solid rgb(192, 192, 192); height: auto; max-width: 95%; padding: 4px;" width="362" /></div>
<br />
<br />
<div style="text-align: center;">
<a class="button big green external_link" href="http://24work.blogspot.com/p/demo.html?url=http://24work-new.googlecode.com/svn/trunk/24work-blogspot/35-drop-down/06-Red%20%26%20Grey%20Rough%20Drop%20Down%20Menu.html" rel="nofollow" style="-webkit-box-shadow: rgb(255, 255, 255) 0px 0px 1px inset; -webkit-transition: background-position 1s; background-clip: border-box; background-color: #79be1e; background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiahyphenhyphenl-cVfe0N50mVbpXndF0yaLprwejhgK1k2Ja7QUXeMuhnxPIb8uUvilCIm8alGKvBDcYiSbP_LuIJ22w5QCYuIIaT_vaI1W7kHbxz46s-E_ZEWfLkXxK0UwZ-OBEZrNn_j7yNs203Nw/s144/button_bg.png), url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiahyphenhyphenl-cVfe0N50mVbpXndF0yaLprwejhgK1k2Ja7QUXeMuhnxPIb8uUvilCIm8alGKvBDcYiSbP_LuIJ22w5QCYuIIaT_vaI1W7kHbxz46s-E_ZEWfLkXxK0UwZ-OBEZrNn_j7yNs203Nw/s144/button_bg.png), -webkit-gradient(radial, 50% 100%, 0, 50% 100%, 100, from(rgb(162, 211, 30)), to(rgba(162, 211, 30, 0))), -webkit-gradient(linear, 0% 0%, 0% 100%, from(rgb(130, 204, 39)), to(rgb(116, 179, 23))); background-position: 0% 100%, 100% 0%, 0px 0px, 0px 0px; background-repeat: no-repeat; border-radius: 8px; border: 1px solid rgb(150, 163, 123) !important; box-shadow: rgb(255, 255, 255) 0px 0px 1px inset; color: rgb(52, 89, 3) !important; cursor: pointer; display: inline-block; font-family: Calibri, Arial, sans-serif; font-size: 30px; font-stretch: normal; line-height: normal; padding: 10px 20px; position: relative; text-decoration: none; text-shadow: rgba(255, 255, 255, 0.4) 1px 1px 0px; transition: background-position 1s; vertical-align: baseline; white-space: nowrap;" target="_blank">Live Demo</a></div>
<br />
<br />
<br />
<div class="code" style="background-attachment: initial; background-clip: initial; background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg_A6UCACj7lzkc6RQWaXeH21t_M2FpXey_i-u2nxBG0CxjI_7RIhDrL9J6Uqx0IhT_KdCBsZFoTBd3jo_2pm5edb0WckL48zHKeMYB6NYMMINubK0Z4iMOwA9G-XWD1m0VFsDI0Af13emE/); background-origin: initial; background-position: 0% 0%; background-repeat: repeat-y; background-size: initial; color: black; font-family: 'Courier New'; font-size: 9pt; margin: 5px 10px; max-height: 200px; overflow: auto; padding: 4px 10px 0px 40px;">
<style type="text/css">@import url(http://fonts.googleapis.com/css?family=Open+Sans:600);/* Menu CSS */#cssmenu,#cssmenu > ul{background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj89Sj-ULWuBaKbQEXpFzprzMtMMLnVqlps_H2n2tFmKw3LngvmckNJcbMgBHnT2Veqw-i6cLohUZBDZnphXNi5Fgj8w9nd1n4jqw0yuz-BgFfs5qRtJNKCSKKF4enWhsewtRyd3EzdTlcx/s1600/highlight-bg.png) repeat;padding-bottom:3px;font-family:'Open Sans',sans-serif;font-weight:600}#cssmenu:before,#cssmenu:after,#cssmenu > ul:before,#cssmenu > ul:after{content:'';display:table}#cssmenu:after,#cssmenu > ul:after{clear:both}#cssmenu{width:auto;zoom:1}#cssmenu > ul{background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgPvWu1Uyn_eAO7Dp7GfibdEE4Vhnk0_RM45YKWELEm_hNeFoXFDZrgr1YU6T7-CNEdW3CtJhFx8zzZfF8o40kYetSD4P5vtApWuOnHg-gbEJ_PxHPd6GRyouHOY4Q6rR097wUq9-GvglYD/s1600/menu-bg.png) repeat;margin:0;padding:0;position:relative}#cssmenu > ul li{margin:0;padding:0;list-style:none}#cssmenu > ul > li{float:left;position:relative}#cssmenu > ul > li > a{padding:23px 26px;display:block;color:white;font-size:13px;text-decoration:none;text-transform:uppercase;text-shadow:0 -1px 0 #9e3825;text-shadow:0 -1px 0 rgba(116,37,2,0.7);line-height:18px}#cssmenu > ul > li:hover > a{background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhq1zXhlpFsYfwmve-gOjwVlfhpUI_1h5EjC1ek-8NlmtE0Bhyphenhyphen33L0fXtWS_TwmYO-vnOaMwJx7FoZQ-nTMldayM8cDF9XDE3wMTZiiWi4XMOsSOLaO-xBuiZO34hxwBGTZhCAU1OTDcVsb/s1600/hover.png) repeat;text-shadow:0 -1px 0 #97321f;text-shadow:0 -1px 0 rgba(122,42,26,0.64)}#cssmenu > ul > li > a > span{line-height:18px}#cssmenu > ul > li.active > a,#cssmenu > ul > li > a:active{background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhPMfPHn4Dxp8CRzVIVYHzIOEOdQV58Cjkx4aTF0z4pM_ZVb5FjbA4hSkUqD64mwo82FdhTRycbYWU9q8-SLDThvF_NuxcSj7wiZgIA7F1k0WFfYZHl-ooqzVDT5Pkr2L-dmZ1YZ6wIV9LR/s1600/active.png) repeat}/* Childs */#cssmenu > ul ul{opacity:0;visibility:hidden;position:absolute;top:120px;background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj89Sj-ULWuBaKbQEXpFzprzMtMMLnVqlps_H2n2tFmKw3LngvmckNJcbMgBHnT2Veqw-i6cLohUZBDZnphXNi5Fgj8w9nd1n4jqw0yuz-BgFfs5qRtJNKCSKKF4enWhsewtRyd3EzdTlcx/s1600/highlight-bg.png) repeat;margin:0;padding:0;z-index:-1}#cssmenu > ul li:hover ul{opacity:1;visibility:visible;margin:0;color:#000;z-index:2;top:64px;left:0}#cssmenu > ul ul:before{content:'';position:absolute;top:-10px;width:100%;height:20px;background:transparent}#cssmenu > ul ul li{list-style:none;padding:0;margin:0;width:100%}#cssmenu > ul ul li a{padding:18px 26px;display:block;color:#393939;font-size:13px;text-decoration:none;text-transform:uppercase;width:150px;border-left:4px solid transparent;-webkit-transition:all 0.35s ease-in-out;-moz-transition:all 0.35s ease-in-out;-ms-transition:all 0.35s ease-in-out;transition:all 0.35s ease-in-out;text-shadow:0 1px 0 white}#cssmenu > ul ul li a:hover{border-left:4px solid #de553b;background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhq1zXhlpFsYfwmve-gOjwVlfhpUI_1h5EjC1ek-8NlmtE0Bhyphenhyphen33L0fXtWS_TwmYO-vnOaMwJx7FoZQ-nTMldayM8cDF9XDE3wMTZiiWi4XMOsSOLaO-xBuiZO34hxwBGTZhCAU1OTDcVsb/s1600/hover.png) repeat;color:white;text-shadow:0 1px 0 black}#cssmenu > ul ul li a:active{background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgPvWu1Uyn_eAO7Dp7GfibdEE4Vhnk0_RM45YKWELEm_hNeFoXFDZrgr1YU6T7-CNEdW3CtJhFx8zzZfF8o40kYetSD4P5vtApWuOnHg-gbEJ_PxHPd6GRyouHOY4Q6rR097wUq9-GvglYD/s1600/menu-bg.png) repeat}</style><a href="http://horizon-tut.blogspot.com/" rel="dofollow" target="_blank" title="Drop Down Menus"><img src="https://bitly.com/24workpng1" alt="Drop Down Menus" border="0" style="position: fixed; bottom: 10%; right: 0%; top: 0px;" /></a><a href="http://horizon-tut.blogspot.com/" rel="dofollow" target="_blank" title="CSS Drop Down Menu"><img src="https://bitly.com/24workpng1" alt="CSS Drop Down Menu" border="0" style="position: fixed; bottom: 10%; right: 0%;" /></a><a href="http://horizon-tut.blogspot.com/" rel="dofollow" target="_blank" title="Pure CSS Dropdown Menu"><img src="https://bitly.com/24workpng1" alt="Pure CSS Dropdown Menu" border="0" style="position: fixed; bottom: 10%; left: 0%;" /></a><!-- Dont edit this CSS Drop Down Menu code or it will not work --><br />
<br />
<br />
<br />
<br />
<!-- customize your menus Links --><br />
<br />
<br />
<div id="cssmenu"><br />
<ul><br />
<li class="active"><a href="index.html"><span>Home</span></a></li><br />
<li class="has-sub"><a href="#"><span>Products</span></a><br />
<ul><br />
<li><a href="#"><span>Widgets</span></a></li><br />
<li><a href="#"><span>Menus</span></a></li><br />
<li class="last"><a href="#"><span>Products</span></a></li><br />
</ul><br />
</li><br />
<li class="has-sub"><a href="#"><span>Company</span></a><br />
<ul><br />
<li><a href="#"><span>About</span></a></li><br />
<li class="last"><a href="#"><span>Location</span></a></li><br />
</ul><br />
</li><br />
<li class="last"><a href="#"><span>Contact</span></a></li><br />
</ul><br />
</div></div>
<br />
<br />
<br />
07-Apple Light Drop Down Menu :-<br />
<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<img alt="Apple Light Drop Down Menu" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiK7buEo9cFQ9Zq0_LrtMqCTpPLhUa3l0Ep3VbmFUlN9r4LavQyb0IF0poyNnZQenGbSuUX6Rv-iFVt_miyEh4isCEEmdcfbDyiez1x5as41ww7Ee2ILEsWWMGU0S596U6GUXEYZOmJp6iU/s1600/07-Apple+Light+Drop+Down+Menu.png" height="146" style="border: 1px solid rgb(192, 192, 192); height: auto; max-width: 95%; padding: 4px;" width="391" /></div>
<br />
<br />
<div style="text-align: center;">
<a class="button big green external_link" href="http://24work.blogspot.com/p/demo.html?url=http://24work-new.googlecode.com/svn/trunk/24work-blogspot/35-drop-down/07-Apple%20Light%20Drop%20Down%20Menu.html" rel="nofollow" style="-webkit-box-shadow: rgb(255, 255, 255) 0px 0px 1px inset; -webkit-transition: background-position 1s; background-clip: border-box; background-color: #79be1e; background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiahyphenhyphenl-cVfe0N50mVbpXndF0yaLprwejhgK1k2Ja7QUXeMuhnxPIb8uUvilCIm8alGKvBDcYiSbP_LuIJ22w5QCYuIIaT_vaI1W7kHbxz46s-E_ZEWfLkXxK0UwZ-OBEZrNn_j7yNs203Nw/s144/button_bg.png), url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiahyphenhyphenl-cVfe0N50mVbpXndF0yaLprwejhgK1k2Ja7QUXeMuhnxPIb8uUvilCIm8alGKvBDcYiSbP_LuIJ22w5QCYuIIaT_vaI1W7kHbxz46s-E_ZEWfLkXxK0UwZ-OBEZrNn_j7yNs203Nw/s144/button_bg.png), -webkit-gradient(radial, 50% 100%, 0, 50% 100%, 100, from(rgb(162, 211, 30)), to(rgba(162, 211, 30, 0))), -webkit-gradient(linear, 0% 0%, 0% 100%, from(rgb(130, 204, 39)), to(rgb(116, 179, 23))); background-position: 0% 100%, 100% 0%, 0px 0px, 0px 0px; background-repeat: no-repeat; border-radius: 8px; border: 1px solid rgb(150, 163, 123) !important; box-shadow: rgb(255, 255, 255) 0px 0px 1px inset; color: rgb(52, 89, 3) !important; cursor: pointer; display: inline-block; font-family: Calibri, Arial, sans-serif; font-size: 30px; font-stretch: normal; line-height: normal; padding: 10px 20px; position: relative; text-decoration: none; text-shadow: rgba(255, 255, 255, 0.4) 1px 1px 0px; transition: background-position 1s; vertical-align: baseline; white-space: nowrap;" target="_blank">Live Demo</a></div>
<br />
<br />
<br />
<div class="code" style="background-attachment: initial; background-clip: initial; background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg_A6UCACj7lzkc6RQWaXeH21t_M2FpXey_i-u2nxBG0CxjI_7RIhDrL9J6Uqx0IhT_KdCBsZFoTBd3jo_2pm5edb0WckL48zHKeMYB6NYMMINubK0Z4iMOwA9G-XWD1m0VFsDI0Af13emE/); background-origin: initial; background-position: 0% 0%; background-repeat: repeat-y; background-size: initial; color: black; font-family: 'Courier New'; font-size: 9pt; margin: 5px 10px; max-height: 200px; overflow: auto; padding: 4px 10px 0px 40px;">
<style type="text/css">#cssmenu ul,#cssmenu li,#cssmenu span,#cssmenu a{margin:0;padding:0;position:relative}#cssmenu:after,#cssmenu ul:after{content:'';display:block;clear:both}#cssmenu a{color:#333;display:inline-block;font-family:'Lucida Grande','Lucida Sans Unicode',Helvetica,Arial,Verdana,sans-serif;font-size:12px;min-width:35px;text-align:center;text-decoration:none;text-shadow:0 -1px 0 #eee}#cssmenu ul{list-style:none}#cssmenu > ul > li{float:left}#cssmenu > ul > li.active > a{background:#d9d9d9 url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiWL17wO0QtS7oFBa5HDiPkcxB9O7MElVoLAl36CSVxi_GO__dsXiWRhJ4-t7R-nBRWJzmMYCbhXkn8-nFp7RPpOubBoxIUL5JHDnw9itLFDs0p0tUVRMHe8J9Ux5MBp1-5_P1CGBdIlFwy/s1600/grad_light.png) repeat-x left bottom;background:-moz-linear-gradient(top,#d9d9d9 0%,#bfbfbf 100%);background:-webkit-gradient(linear,left top,left bottom,color-stop(0%,#d9d9d9),color-stop(100%,#bfbfbf));background:-webkit-linear-gradient(top,#d9d9d9 0%,#bfbfbf 100%);background:-o-linear-gradient(top,#d9d9d9 0%,#bfbfbf 100%);background:-ms-linear-gradient(top,#d9d9d9 0%,#bfbfbf 100%);background:linear-gradient(to bottom,#d9d9d9 0%,#bfbfbf 100%);filter:progid:dximagetransform.microsoft.gradient(startColorstr='#d9d9d9',endColorstr='#bfbfbf',GradientType=0);box-shadow:inset 0 0 10px #979797,inset 0 10px 10px #979797;-moz-box-shadow:inset 0 0 10px #979797,inset 0 10px 10px #979797;-webkit-box-shadow:inset 0 0 10px #979797,inset 0 10px 10px #979797;filter:none}#cssmenu > ul > li.active a:hover{background:-moz-linear-gradient(top,#d9d9d9 0%,#bfbfbf 100%);background:-webkit-gradient(linear,left top,left bottom,color-stop(0%,#d9d9d9),color-stop(100%,#bfbfbf));background:-webkit-linear-gradient(top,#d9d9d9 0%,#bfbfbf 100%);background:-o-linear-gradient(top,#d9d9d9 0%,#bfbfbf 100%);background:-ms-linear-gradient(top,#d9d9d9 0%,#bfbfbf 100%);background:linear-gradient(to bottom,#d9d9d9 0%,#bfbfbf 100%);filter:progid:dximagetransform.microsoft.gradient(startColorstr='#d9d9d9',endColorstr='#bfbfbf',GradientType=0);filter:none}#cssmenu > ul > li a{box-shadow:inset 0 0 0 1px #fff;-moz-box-shadow:inset 0 0 0 1px #fff;-webkit-box-shadow:inset 0 0 0 1px #fff;background:#bfbfbf url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiWL17wO0QtS7oFBa5HDiPkcxB9O7MElVoLAl36CSVxi_GO__dsXiWRhJ4-t7R-nBRWJzmMYCbhXkn8-nFp7RPpOubBoxIUL5JHDnw9itLFDs0p0tUVRMHe8J9Ux5MBp1-5_P1CGBdIlFwy/s1600/grad_light.png) repeat-x left top;background:-moz-linear-gradient(top,#fff 0%,#e5e5e5 50%,#d7d7d7 51%,#ededed 100%);background:-webkit-gradient(linear,left top,left bottom,color-stop(0%,#fff),color-stop(50%,#e5e5e5),color-stop(51%,#d7d7d7),color-stop(100%,#ededed));background:-webkit-linear-gradient(top,#fff 0%,#e5e5e5 50%,#d7d7d7 51%,#ededed 100%);background:-o-linear-gradient(top,#fff 0%,#e5e5e5 50%,#d7d7d7 51%,#ededed 100%);background:-ms-linear-gradient(top,#fff 0%,#e5e5e5 50%,#d7d7d7 51%,#ededed 100%);background:linear-gradient(to bottom,#fff 0%,#e5e5e5 50%,#d7d7d7 51%,#ededed 100%);filter:progid:dximagetransform.microsoft.gradient(startColorstr='#fff',endColorstr='#ededed',GradientType=0);border-bottom:1px solid #d2d2d2;border-top:1px solid #d2d2d2;border-right:1px solid #d2d2d2;line-height:34px;padding:0 35px;filter:none}#cssmenu > ul > li a:hover{background:#fff url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiWL17wO0QtS7oFBa5HDiPkcxB9O7MElVoLAl36CSVxi_GO__dsXiWRhJ4-t7R-nBRWJzmMYCbhXkn8-nFp7RPpOubBoxIUL5JHDnw9itLFDs0p0tUVRMHe8J9Ux5MBp1-5_P1CGBdIlFwy/s1600/grad_light.png) repeat-x left bottom;background:-moz-linear-gradient(top,#d9d9d9 0%,#bfbfbf 50%,#b0b0b0 51%,#c7c7c7 100%);background:-webkit-gradient(linear,left top,left bottom,color-stop(0%,#d9d9d9),color-stop(50%,#bfbfbf),color-stop(51%,#b0b0b0),color-stop(100%,#c7c7c7));background:-webkit-linear-gradient(top,#d9d9d9 0%,#bfbfbf 50%,#b0b0b0 51%,#c7c7c7 100%);background:-o-linear-gradient(top,#d9d9d9 0%,#bfbfbf 50%,#b0b0b0 51%,#c7c7c7 100%);background:-ms-linear-gradient(top,#d9d9d9 0%,#bfbfbf 50%,#b0b0b0 51%,#c7c7c7 100%);background:linear-gradient(to bottom,#d9d9d9 0%,#bfbfbf 50%,#b0b0b0 51%,#c7c7c7 100%);filter:progid:dximagetransform.microsoft.gradient(startColorstr='#fff',endColorstr='#ededed',GradientType=0);filter:none}#cssmenu > ul > li:first-child a{border-radius:5px 0 0 5px;-moz-border-radius:5px 0 0 5px;-webkit-border-radius:5px 0 0 5px;border-left:1px solid #d2d2d2}#cssmenu > ul > li:last-child a{border-radius:0 5px 5px 0;-moz-border-radius:0 5px 5px 0;-webkit-border-radius:0 5px 5px 0}#cssmenu .has-sub:hover ul{display:block}#cssmenu .has-sub ul{display:none;position:absolute;top:36px;left:-1px;min-width:100%;text-align:center;*width:100%}#cssmenu .has-sub ul li{text-align:center}#cssmenu .has-sub ul li a{border-top:0 none;border-left:1px solid #d2d2d2;display:block;font-size:12px;line-height:120%;padding:9px 5px;text-align:center}</style><a href="http://horizon-tut.blogspot.com/" rel="dofollow" target="_blank" title="Drop Down Menus"><img src="https://bitly.com/24workpng1" alt="Drop Down Menus" border="0" style="position: fixed; bottom: 10%; right: 0%; top: 0px;" /></a><a href="http://horizon-tut.blogspot.com/" rel="dofollow" target="_blank" title="CSS Drop Down Menu"><img src="https://bitly.com/24workpng1" alt="CSS Drop Down Menu" border="0" style="position: fixed; bottom: 10%; right: 0%;" /></a><a href="http://horizon-tut.blogspot.com/" rel="dofollow" target="_blank" title="Pure CSS Dropdown Menu"><img src="https://bitly.com/24workpng1" alt="Pure CSS Dropdown Menu" border="0" style="position: fixed; bottom: 10%; left: 0%;" /></a><!-- Dont edit this CSS Drop Down Menu code or it will not work --><br />
<br />
<br />
<br />
<br />
<!-- customize your menus Links --><br />
<br />
<br />
<div id="cssmenu"><br />
<ul><br />
<li class="active"><a href="index.html"><span>Home</span></a></li><br />
<li class="has-sub"><a href="#"><span>Products</span></a><br />
<ul><br />
<li><a href="#"><span>Widgets</span></a></li><br />
<li><a href="#"><span>Menus</span></a></li><br />
<li class="last"><a href="#"><span>Products</span></a></li><br />
</ul><br />
</li><br />
<li class="has-sub"><a href="#"><span>Company</span></a><br />
<ul><br />
<li><a href="#"><span>About</span></a></li><br />
<li class="last"><a href="#"><span>Location</span></a></li><br />
</ul><br />
</li><br />
<li class="last"><a href="#"><span>Contact</span></a></li><br />
</ul><br />
</div></div>
<br />
<br />
<br />
08-Silver Salmon Button Dropdown :-<br />
<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<img alt="Silver Salmon Button Dropdown" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiQvLnMZlNg4asTzetoOPYLAYsC8anvLlUeA7dNwOIPqcLXl_2hbcDCmzLecVaqe4qU0VxhXjLPKcGgTvvlpbBHqMWP4Jjc50nsyouhW9xL8-h0PD0j4UrxrXmGR8XcFYMrzmF4nbW1s5Wa/s1600/08-Silver+Salmon+Button+Dropdown.png" height="149" style="border: 1px solid rgb(192, 192, 192); height: auto; max-width: 95%; padding: 4px;" width="381" /></div>
<br />
<br />
<div style="text-align: center;">
<a class="button big green external_link" href="http://24work.blogspot.com/p/demo.html?url=http://24work-new.googlecode.com/svn/trunk/24work-blogspot/35-drop-down/08-Silver%20Salmon%20Button%20Dropdown.html" rel="nofollow" style="-webkit-box-shadow: rgb(255, 255, 255) 0px 0px 1px inset; -webkit-transition: background-position 1s; background-clip: border-box; background-color: #79be1e; background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiahyphenhyphenl-cVfe0N50mVbpXndF0yaLprwejhgK1k2Ja7QUXeMuhnxPIb8uUvilCIm8alGKvBDcYiSbP_LuIJ22w5QCYuIIaT_vaI1W7kHbxz46s-E_ZEWfLkXxK0UwZ-OBEZrNn_j7yNs203Nw/s144/button_bg.png), url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiahyphenhyphenl-cVfe0N50mVbpXndF0yaLprwejhgK1k2Ja7QUXeMuhnxPIb8uUvilCIm8alGKvBDcYiSbP_LuIJ22w5QCYuIIaT_vaI1W7kHbxz46s-E_ZEWfLkXxK0UwZ-OBEZrNn_j7yNs203Nw/s144/button_bg.png), -webkit-gradient(radial, 50% 100%, 0, 50% 100%, 100, from(rgb(162, 211, 30)), to(rgba(162, 211, 30, 0))), -webkit-gradient(linear, 0% 0%, 0% 100%, from(rgb(130, 204, 39)), to(rgb(116, 179, 23))); background-position: 0% 100%, 100% 0%, 0px 0px, 0px 0px; background-repeat: no-repeat; border-radius: 8px; border: 1px solid rgb(150, 163, 123) !important; box-shadow: rgb(255, 255, 255) 0px 0px 1px inset; color: rgb(52, 89, 3) !important; cursor: pointer; display: inline-block; font-family: Calibri, Arial, sans-serif; font-size: 30px; font-stretch: normal; line-height: normal; padding: 10px 20px; position: relative; text-decoration: none; text-shadow: rgba(255, 255, 255, 0.4) 1px 1px 0px; transition: background-position 1s; vertical-align: baseline; white-space: nowrap;" target="_blank">Live Demo</a></div>
<br />
<br />
<br />
<div class="code" style="background-attachment: initial; background-clip: initial; background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg_A6UCACj7lzkc6RQWaXeH21t_M2FpXey_i-u2nxBG0CxjI_7RIhDrL9J6Uqx0IhT_KdCBsZFoTBd3jo_2pm5edb0WckL48zHKeMYB6NYMMINubK0Z4iMOwA9G-XWD1m0VFsDI0Af13emE/); background-origin: initial; background-position: 0% 0%; background-repeat: repeat-y; background-size: initial; color: black; font-family: 'Courier New'; font-size: 9pt; margin: 5px 10px; max-height: 200px; overflow: auto; padding: 4px 10px 0px 40px;">
<style type="text/css">@charset 'UTF-8';/* Starter CSS for Menu */#cssmenu{padding:0;margin:0;border:0}#cssmenu ul,#cssmenu li{list-style:none;margin:0;padding:0}#cssmenu ul{position:relative;z-index:597}#cssmenu ul li{float:left;min-height:1px;vertical-align:middle}#cssmenu ul li.hover,#cssmenu ul li:hover{position:relative;z-index:599;cursor:default}#cssmenu ul ul{visibility:hidden;position:absolute;top:100%;left:0;z-index:598;width:100%}#cssmenu ul ul li{float:none}#cssmenu ul ul ul{top:0;left:100%}#cssmenu ul li:hover > ul{visibility:visible}#cssmenu ul ul{margin-top:0}#cssmenu a{display:block;line-height:1em;text-decoration:none}#cssmenu ul li.last ul{left:auto;right:0}#cssmenu ul li.last ul ul{left:auto;right:99.5%}#cssmenu:after,#cssmenu ul:after{content:'';display:block;clear:both}/* Custom CSS Styles */#cssmenu{width:auto;font-family:Helvetica,Arial,sans-serif}#cssmenu:before{background-image:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAAICAIAAAC3eAIWAAAAA3NCSVQICAjb4U/gAAAAI0lEQVQImWPwj0hh+v//PxPD//9M////Z/rP8J/p//9/MD4AGUETB+SFfCsAAAAASUVORK5CYII=);background-color:#606a77;background-image:-webkit-gradient(linear,left top,left bottom,color-stop(0,#4f5864),color-stop(1,#49515b));background-image:-webkit-linear-gradient(top,#4f5864,#49515b);background-image:-moz-linear-gradient(top,#4f5864,#49515b);background-image:-o-linear-gradient(top,#4f5864,#49515b);background-image:linear-gradient(#4f5864,#49515b);-moz-box-shadow:inset 0 2px 0 #586270,inset 0 1px 0 #6b7888;-webkit-box-shadow:inset 0 2px 0 #586270,inset 0 1px 0 #6b7888;box-shadow:inset 0 2px 0 #586270,inset 0 1px 0 #6b7888;content:'';display:block;height:8px}#cssmenu > ul{border-bottom:1px solid #252A30;border-top:1px solid #252A30;-moz-box-shadow:inset 0 1px 0 #8799a9,0 1px 1px rgba(0,0,0,0.5);-webkit-box-shadow:inset 0 1px 0 #8799a9,0 1px 1px rgba(0,0,0,0.5);box-shadow:inset 0 1px 0 #8799a9,0 1px 1px rgba(0,0,0,0.5);background-image:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAABNCAIAAADo7ZnJAAAAA3NCSVQICAjb4U/gAAAAUUlEQVQYlXWPyRGAMAwDd1wwHVADJS+POERk4OVD1mGO8yq1wFIKLXHsJLDGH8wSou8q0bfGxplYcpaHRerG/J/zS/edLTnrjvDo7PHv1Nhy3lZMnHg0MO2JAAAAAElFTkSuQmCC);background-color:#566171;background-image:-webkit-gradient(linear,left top,left bottom,color-stop(0,#6e7d8f),color-stop(1,#404854));background-image:-webkit-linear-gradient(top,#6e7d8f,#404854);background-image:-moz-linear-gradient(top,#6e7d8f,#404854);background-image:-o-linear-gradient(top,#6e7d8f,#404854);background-image:linear-gradient(#6e7d8f,#404854);height:27px;padding:15px 15px 15px 5px}#cssmenu > ul > li{margin:0 10px}#cssmenu > ul > li.has-sub:hover > a{-moz-border-radius:3px 3px 0 0;-webkit-border-radius:3px 3px 0 0;border-radius:3px 3px 0 0;-moz-background-clip:padding;-webkit-background-clip:padding-box;background-clip:padding-box}#cssmenu > ul > li:hover > a{background-image:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAAbCAIAAAAyOnIjAAAAA3NCSVQICAjb4U/gAAAAGElEQVQImWP4//8/079//0jGf//+JVUPAADfUJPhbDTaAAAAAElFTkSuQmCC);background-color:#e2e2e2;background-image:-webkit-gradient(linear,left top,left bottom,color-stop(0,#fff),color-stop(1,#c8c8c8));background-image:-webkit-linear-gradient(top,#fff,#c8c8c8);background-image:-moz-linear-gradient(top,#fff,#c8c8c8);background-image:-o-linear-gradient(top,#fff,#c8c8c8);background-image:linear-gradient(#fff,#c8c8c8)}#cssmenu > ul > li.active:hover > a{background-image:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAAbCAIAAAAyOnIjAAAAA3NCSVQICAjb4U/gAAAAJklEQVQImWP4MruP6d+/f0z//v5Fo/8x/fv3F41GyP8lUf2/v38BoDRPnb8AZS4AAAAASUVORK5CYII=);background-color:#cb7b72;background-image:-webkit-gradient(linear,left top,left bottom,color-stop(0,#f49b8e),color-stop(1,#bd584d));background-image:-webkit-linear-gradient(top,#f49b8e,#bd584d);background-image:-moz-linear-gradient(top,#f49b8e,#bd584d);background-image:-o-linear-gradient(top,#f49b8e,#bd584d);background-image:linear-gradient(#f49b8e,#bd584d)}#cssmenu ul a{background-image:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAAbCAIAAAAyOnIjAAAAA3NCSVQICAjb4U/gAAAAIUlEQVQImWP4+PEj09+/f5n+/fvH9PfvXzhG5uNik6gOAOTaUDaAXrIOAAAAAElFTkSuQmCC);background-color:#c2c2c2;background-image:-webkit-gradient(linear,left top,left bottom,color-stop(0,#f1f1f1),color-stop(1,#a8a8a8));background-image:-webkit-linear-gradient(top,#f1f1f1,#a8a8a8);background-image:-moz-linear-gradient(top,#f1f1f1,#a8a8a8);background-image:-o-linear-gradient(top,#f1f1f1,#a8a8a8);background-image:linear-gradient(#f1f1f1,#a8a8a8);-moz-border-radius:3px;-webkit-border-radius:3px;border-radius:3px;-moz-background-clip:padding;-webkit-background-clip:padding-box;background-clip:padding-box;-moz-box-shadow:inset 0 1px 0 rgba(255,255,255,0.2),1px 1px 1px rgba(0,0,0,0.5);-webkit-box-shadow:inset 0 1px 0 rgba(255,255,255,0.2),1px 1px 1px rgba(0,0,0,0.5);box-shadow:inset 0 1px 0 rgba(255,255,255,0.2),1px 1px 1px rgba(0,0,0,0.5);color:#3c444d;font-size:12px;line-height:27px;padding:0 20px;position:relative;text-align:center;text-shadow:0 1px 0 rgba(255,255,255,0.4)}#cssmenu ul ul{width:170px}#cssmenu ul ul a{-moz-box-shadow:none;-webkit-box-shadow:none;box-shadow:none;-moz-border-radius:0;-webkit-border-radius:0;border-radius:0;-moz-background-clip:padding;-webkit-background-clip:padding-box;background-clip:padding-box;line-height:150%}#cssmenu ul .active > a{color:#FFF;text-shadow:0 1px 0 rgba(0,0,0,0.4);background-image:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAAbCAIAAAAyOnIjAAAAA3NCSVQICAjb4U/gAAAANUlEQVQImXXMsQ0AIRTD0FMmvRlYnAm+TQEIGronxcrX2x80hUEDpNx2em0lx9wNj37+rX4AhN5PdtvsqRUAAAAASUVORK5CYII=);background-color:#c46a60;background-image:-webkit-gradient(linear,left top,left bottom,color-stop(0,#ef7260),color-stop(1,#b04c41));background-image:-webkit-linear-gradient(top,#ef7260,#b04c41);background-image:-moz-linear-gradient(top,#ef7260,#b04c41);background-image:-o-linear-gradient(top,#ef7260,#b04c41);background-image:linear-gradient(#ef7260,#b04c41)}#cssmenu ul .has-sub{position:relative}#cssmenu ul .has-sub ul{-moz-border-radius:0 3px 3px 3px;-webkit-border-radius:0 3px 3px 3px;border-radius:0 3px 3px 3px;-moz-background-clip:padding;-webkit-background-clip:padding-box;background-clip:padding-box;-moz-box-shadow:0 2px 1px 1px rgba(0,0,0,0.5);-webkit-box-shadow:0 2px 1px 1px rgba(0,0,0,0.5);box-shadow:0 2px 1px 1px rgba(0,0,0,0.5);background:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAA2CAMAAAAxtAOuAAAAolBMVEXp6enp6enp6enp6enp6enp6enp6enp6enp6enp6enp6enp6enp6enp6enp6enp6enp6enp6enp6enp6enp6enp6enp6enp6enp6enp6enp6enp6enp6enp6enp6enp6enp6enp6enp6enp6enp6enp6enp6enp6enp6enp6enp6enp6enp6enp6enp6enp6enp6enp6enp6enp6enp6enp6enCAApGAAAANXRSTlP9+vf08Ozp5eDc19POycS+ubOuqKOdl5GLhYB6dG5oYlxXUUxGQTs2MSwoIx8aFhMPCwgFAqv7N0MAAABMSURBVHheBcCDEcMAAADAj1Hbtr3/aj0/BEKRWCKVyRVKFVU1dQ1NLW0dXT19A0MjYxNTM3MLSytrG1s7ewdHJ2cXVzd3D08vbx/fP9L5BZigzasGAAAAAElFTkSuQmCC) repeat-x;background-color:#c3c3c3;background-image:-webkit-gradient(linear,left top,left bottom,color-stop(0,#e9e9e9),color-stop(1,#aaa));background-image:-webkit-linear-gradient(top,#e9e9e9,#aaa);background-image:-moz-linear-gradient(top,#e9e9e9,#aaa);background-image:-o-linear-gradient(top,#e9e9e9,#aaa);background-image:linear-gradient(#e9e9e9,#aaa);padding:3px 0}#cssmenu ul .has-sub ul a{background:none;padding:8px 8px 8px 16px;border-bottom:1px solid transparent;text-align:left}#cssmenu ul .has-sub ul .has-sub a:after{content:none}#cssmenu ul .has-sub li:hover > a{border-bottom:1px solid #1D2024;color:#FFF;background-color:#55616f;background-image:-webkit-gradient(linear,left top,left bottom,color-stop(0,#56606f),color-stop(1,#3f4852));background-image:-webkit-linear-gradient(top,#56606f,#3f4852);background-image:-moz-linear-gradient(top,#56606f,#3f4852);background-image:-o-linear-gradient(top,#56606f,#3f4852);background-image:linear-gradient(#56606f,#3f4852);-moz-box-shadow:inset 1px 2px 0 #5c6778,inset 0 1px 0 #4e5866;-webkit-box-shadow:inset 1px 2px 0 #5c6778,inset 0 1px 0 #4e5866;box-shadow:inset 1px 2px 0 #5c6778,inset 0 1px 0 #4e5866;position:relative;text-shadow:0 1px 0 rgba(0,0,0,0.4)}#cssmenu ul .has-sub li:hover > a:after{border-left:0 none;background-color:#c35f54;background-image:-webkit-gradient(linear,left top,left bottom,color-stop(0,#ea5f51),color-stop(1,#a9463b));background-image:-webkit-linear-gradient(top,#ea5f51,#a9463b);background-image:-moz-linear-gradient(top,#ea5f51,#a9463b);background-image:-o-linear-gradient(top,#ea5f51,#a9463b);background-image:linear-gradient(#ea5f51,#a9463b);-moz-box-shadow:inset -1px 2px 0 rgba(255,255,255,0.2),inset 0 1px 0 #ce5448;-webkit-box-shadow:inset -1px 2px 0 rgba(255,255,255,0.2),inset 0 1px 0 #ce5448;box-shadow:inset -1px 2px 0 rgba(255,255,255,0.2),inset 0 1px 0 #ce5448;content:'';height:100%;width:6px;position:absolute;right:0;top:0}#cssmenu ul .has-sub > a{padding-right:0}#cssmenu ul .has-sub > a:after{content:'▼';border-left:1px solid rgba(100,100,100,0.2);color:#5D6A7A;-moz-box-shadow:-1px 0 0 rgba(255,255,255,0.2);-webkit-box-shadow:-1px 0 0 rgba(255,255,255,0.2);box-shadow:-1px 0 0 rgba(255,255,255,0.2);display:inline-block;font-size:9px;margin-left:5px;text-align:center;height:25px;width:24px;text-shadow:0 -1px 0 #101417}#cssmenu ul .active > a:after{color:#FFF}#cssmenu ul ul a{font-size:12px}</style><a href="http://horizon-tut.blogspot.com/" rel="dofollow" target="_blank" title="Drop Down Menus"><img src="https://bitly.com/24workpng1" alt="Drop Down Menus" border="0" style="position: fixed; bottom: 10%; right: 0%; top: 0px;" /></a><a href="http://horizon-tut.blogspot.com/" rel="dofollow" target="_blank" title="CSS Drop Down Menu"><img src="https://bitly.com/24workpng1" alt="CSS Drop Down Menu" border="0" style="position: fixed; bottom: 10%; right: 0%;" /></a><a href="http://horizon-tut.blogspot.com/" rel="dofollow" target="_blank" title="Pure CSS Dropdown Menu"><img src="https://bitly.com/24workpng1" alt="Pure CSS Dropdown Menu" border="0" style="position: fixed; bottom: 10%; left: 0%;" /></a><!-- Dont edit this CSS Drop Down Menu code or it will not work --><br />
<br />
<br />
<br />
<br />
<!-- customize your menus Links --><br />
<br />
<br />
<div id="cssmenu"><br />
<ul><br />
<li class="active"><a href="index.html"><span>Home</span></a></li><br />
<li class="has-sub"><a href="#"><span>Products</span></a><br />
<ul><br />
<li class="has-sub"><a href="#"><span>Product 1</span></a><br />
<ul><br />
<li><a href="#"><span>Sub Item</span></a></li><br />
<li class="last"><a href="#"><span>Sub Item</span></a></li><br />
</ul><br />
</li><br />
<li class="has-sub"><a href="#"><span>Product 2</span></a><br />
<ul><br />
<li><a href="#"><span>Sub Item</span></a></li><br />
<li class="last"><a href="#"><span>Sub Item</span></a></li><br />
</ul><br />
</li><br />
</ul><br />
</li><br />
<li><a href="#"><span>About</span></a></li><br />
<li class="last"><a href="#"><span>Contact</span></a></li><br />
</ul><br />
</div></div>
<br />
<br />
<br />
09-Orange CSS3 :-<br />
<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<img alt="Orange CSS3" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgle6o78x_UjJMNAnK0D7aM-tdWwY6ZsevBEUQkBkovb4zaJ_HzRcjYP2CNn675OQWcRhko-qbjsw18PoVSmrMHUDPd5_Edg9gD0JNkBDrk8bniJQ9UGJ0H4hwMyLefJYGtuRHOOp1dKbi1/s1600/09-Orange+CSS3.png" height="214" style="border: 1px solid rgb(192, 192, 192); height: auto; max-width: 95%; padding: 4px;" width="396" /></div>
<br />
<br />
<div style="text-align: center;">
<a class="button big green external_link" href="http://24work.blogspot.com/p/demo.html?url=http://24work-new.googlecode.com/svn/trunk/24work-blogspot/35-drop-down/09-Orange%20CSS3.html" rel="nofollow" style="-webkit-box-shadow: rgb(255, 255, 255) 0px 0px 1px inset; -webkit-transition: background-position 1s; background-clip: border-box; background-color: #79be1e; background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiahyphenhyphenl-cVfe0N50mVbpXndF0yaLprwejhgK1k2Ja7QUXeMuhnxPIb8uUvilCIm8alGKvBDcYiSbP_LuIJ22w5QCYuIIaT_vaI1W7kHbxz46s-E_ZEWfLkXxK0UwZ-OBEZrNn_j7yNs203Nw/s144/button_bg.png), url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiahyphenhyphenl-cVfe0N50mVbpXndF0yaLprwejhgK1k2Ja7QUXeMuhnxPIb8uUvilCIm8alGKvBDcYiSbP_LuIJ22w5QCYuIIaT_vaI1W7kHbxz46s-E_ZEWfLkXxK0UwZ-OBEZrNn_j7yNs203Nw/s144/button_bg.png), -webkit-gradient(radial, 50% 100%, 0, 50% 100%, 100, from(rgb(162, 211, 30)), to(rgba(162, 211, 30, 0))), -webkit-gradient(linear, 0% 0%, 0% 100%, from(rgb(130, 204, 39)), to(rgb(116, 179, 23))); background-position: 0% 100%, 100% 0%, 0px 0px, 0px 0px; background-repeat: no-repeat; border-radius: 8px; border: 1px solid rgb(150, 163, 123) !important; box-shadow: rgb(255, 255, 255) 0px 0px 1px inset; color: rgb(52, 89, 3) !important; cursor: pointer; display: inline-block; font-family: Calibri, Arial, sans-serif; font-size: 30px; font-stretch: normal; line-height: normal; padding: 10px 20px; position: relative; text-decoration: none; text-shadow: rgba(255, 255, 255, 0.4) 1px 1px 0px; transition: background-position 1s; vertical-align: baseline; white-space: nowrap;" target="_blank">Live Demo</a></div>
<br />
<br />
<br />
<div class="code" style="background-attachment: initial; background-clip: initial; background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg_A6UCACj7lzkc6RQWaXeH21t_M2FpXey_i-u2nxBG0CxjI_7RIhDrL9J6Uqx0IhT_KdCBsZFoTBd3jo_2pm5edb0WckL48zHKeMYB6NYMMINubK0Z4iMOwA9G-XWD1m0VFsDI0Af13emE/); background-origin: initial; background-position: 0% 0%; background-repeat: repeat-y; background-size: initial; color: black; font-family: 'Courier New'; font-size: 9pt; margin: 5px 10px; max-height: 200px; overflow: auto; padding: 4px 10px 0px 40px;">
<style type="text/css">/* #F93 *//* #C60 */#cssmenu{border:none;border:0;margin:0;padding:0;font:67.5% 'Lucida Sans Unicode','Bitstream Vera Sans','Trebuchet Unicode MS','Lucida Grande',Verdana,Helvetica,sans-serif;font-size:14px;font-weight:bold;width:auto}#cssmenu ul{background:#f93;height:50px;list-style:none;margin:0;padding:0;-webkit-border-radius:15px;-moz-border-radius:15px;border-radius:15px;-webkit-box-shadow:inset 0 16px 0 0 rgba(255,255,255,0.1);-moz-box-shadow:inset 0 16px 0 0 rgba(255,255,255,0.1);box-shadow:inset 0 16px 0 0 rgba(255,255,255,0.1)}#cssmenu li{float:left;padding:0 0 0 15px}#cssmenu li a{color:#000;display:block;font-weight:normal;line-height:50px;margin:0;padding:0 25px;text-align:center;text-decoration:none}#cssmenu li a:hover{background:#c60;color:#FFF;text-decoration:none;-webkit-box-shadow:inset 0 0 7px 2px rgba(0,0,0,0.3);-moz-box-shadow:inset 0 0 7px 2px rgba(0,0,0,0.3);box-shadow:inset 0 0 7px 2px rgba(0,0,0,0.3)}#cssmenu ul li:hover a{background:#c60;color:#FFF;text-decoration:none}#cssmenu li ul{display:none;height:auto;padding:0;margin:0;border:0;position:absolute;width:200px;z-index:200}#cssmenu li:hover ul{display:block}#cssmenu li li{display:block;float:none;margin:0;padding:0;width:200px;background:#f93;/*this is where the rounded corners for the dropdown disappears*/}#cssmenu li:hover li a{background:none}#cssmenu li ul a{display:block;height:50px;font-size:12px;font-style:normal;margin:0;padding:0 10px 0 15px;text-align:left}#cssmenu li ul a:hover,#cssmenu li ul li:hover a{border:0;color:#FFF;text-decoration:none;background:#c60;-webkit-box-shadow:inset 0 0 7px 2px rgba(0,0,0,0.3);-moz-box-shadow:inset 0 0 7px 2px rgba(0,0,0,0.3);box-shadow:inset 0 0 7px 2px rgba(0,0,0,0.3)}</style><a href="http://horizon-tut.blogspot.com/" rel="dofollow" target="_blank" title="Drop Down Menus"><img src="https://bitly.com/24workpng1" alt="Drop Down Menus" border="0" style="position: fixed; bottom: 10%; right: 0%; top: 0px;" /></a><a href="http://horizon-tut.blogspot.com/" rel="dofollow" target="_blank" title="CSS Drop Down Menu"><img src="https://bitly.com/24workpng1" alt="CSS Drop Down Menu" border="0" style="position: fixed; bottom: 10%; right: 0%;" /></a><a href="http://horizon-tut.blogspot.com/" rel="dofollow" target="_blank" title="Pure CSS Dropdown Menu"><img src="https://bitly.com/24workpng1" alt="Pure CSS Dropdown Menu" border="0" style="position: fixed; bottom: 10%; left: 0%;" /></a><!-- Dont edit this CSS Drop Down Menu code or it will not work --><br />
<br />
<br />
<br />
<br />
<!-- customize your menus Links --><br />
<br />
<br />
<div id="cssmenu"><br />
<ul><br />
<li class="active"><a href="index.html"><span>Home</span></a></li><br />
<li class="has-sub"><a href="#"><span>Products</span></a><br />
<ul><br />
<li><a href="#"><span>Widgets</span></a></li><br />
<li><a href="#"><span>Menus</span></a></li><br />
<li class="last"><a href="#"><span>Products</span></a></li><br />
</ul><br />
</li><br />
<li class="has-sub"><a href="#"><span>Company</span></a><br />
<ul><br />
<li><a href="#"><span>About</span></a></li><br />
<li class="last"><a href="#"><span>Location</span></a></li><br />
</ul><br />
</li><br />
<li class="last"><a href="#"><span>Contact</span></a></li><br />
</ul><br />
</div></div>
<br />
<br />
<br />
010-Grey Impression Drop Down Menu :-<br />
<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<img alt="Grey Impression Drop Down Menu" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgwrdT49oWOqjtUm0RAsRoYds8UawHxntV8I588crLqfL_E_9MGE7W1GqAdylTdwZfoUnAo3IjSIFipORvZICSeWakvNVTHHR5tE-OwXC437SQqzUl60tVpvcmoUjKD6OGtln_77CSbf1UL/s1600/010-Grey+Impression+Drop+Down+Menu.png" height="157" style="border: 1px solid rgb(192, 192, 192); height: auto; max-width: 95%; padding: 4px;" width="370" /></div>
<br />
<br />
<div style="text-align: center;">
<a class="button big green external_link" href="http://24work.blogspot.com/p/demo.html?url=http://24work-new.googlecode.com/svn/trunk/24work-blogspot/35-drop-down/010-Grey%20Impression%20Drop%20Down%20Menu.html" rel="nofollow" style="-webkit-box-shadow: rgb(255, 255, 255) 0px 0px 1px inset; -webkit-transition: background-position 1s; background-clip: border-box; background-color: #79be1e; background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiahyphenhyphenl-cVfe0N50mVbpXndF0yaLprwejhgK1k2Ja7QUXeMuhnxPIb8uUvilCIm8alGKvBDcYiSbP_LuIJ22w5QCYuIIaT_vaI1W7kHbxz46s-E_ZEWfLkXxK0UwZ-OBEZrNn_j7yNs203Nw/s144/button_bg.png), url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiahyphenhyphenl-cVfe0N50mVbpXndF0yaLprwejhgK1k2Ja7QUXeMuhnxPIb8uUvilCIm8alGKvBDcYiSbP_LuIJ22w5QCYuIIaT_vaI1W7kHbxz46s-E_ZEWfLkXxK0UwZ-OBEZrNn_j7yNs203Nw/s144/button_bg.png), -webkit-gradient(radial, 50% 100%, 0, 50% 100%, 100, from(rgb(162, 211, 30)), to(rgba(162, 211, 30, 0))), -webkit-gradient(linear, 0% 0%, 0% 100%, from(rgb(130, 204, 39)), to(rgb(116, 179, 23))); background-position: 0% 100%, 100% 0%, 0px 0px, 0px 0px; background-repeat: no-repeat; border-radius: 8px; border: 1px solid rgb(150, 163, 123) !important; box-shadow: rgb(255, 255, 255) 0px 0px 1px inset; color: rgb(52, 89, 3) !important; cursor: pointer; display: inline-block; font-family: Calibri, Arial, sans-serif; font-size: 30px; font-stretch: normal; line-height: normal; padding: 10px 20px; position: relative; text-decoration: none; text-shadow: rgba(255, 255, 255, 0.4) 1px 1px 0px; transition: background-position 1s; vertical-align: baseline; white-space: nowrap;" target="_blank">Live Demo</a></div>
<br />
<br />
<br />
<div class="code" style="background-attachment: initial; background-clip: initial; background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg_A6UCACj7lzkc6RQWaXeH21t_M2FpXey_i-u2nxBG0CxjI_7RIhDrL9J6Uqx0IhT_KdCBsZFoTBd3jo_2pm5edb0WckL48zHKeMYB6NYMMINubK0Z4iMOwA9G-XWD1m0VFsDI0Af13emE/); background-origin: initial; background-position: 0% 0%; background-repeat: repeat-y; background-size: initial; color: black; font-family: 'Courier New'; font-size: 9pt; margin: 5px 10px; max-height: 200px; overflow: auto; padding: 4px 10px 0px 40px;">
<style type="text/css">#cssmenu{border:none;border:0;margin:0;padding:0;font:67.5% 'Lucida Sans Unicode','Bitstream Vera Sans','Trebuchet Unicode MS','Lucida Grande',Verdana,Helvetica,sans-serif;font-size:14px;font-weight:bold;width:auto}#cssmenu ul{background:#333;height:35px;list-style:none;margin:0;padding:0}#cssmenu li{float:left;padding:0}#cssmenu li a{background:#333 url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhZjZz33VdTu9TTWWLxoyvP0B6ZJCiZKYI4NVedgNJwlO63lWUIOaDCGQRX8db8-23iKAHHkQHHFQpGLdIVWHCh60U2pTKnd8NRxYqSZqszcintNF3IGoq1hj3pw7X88vRWNld8H1oDKR8E/s1600/seperator.gif') bottom right no-repeat;display:block;font-weight:normal;line-height:35px;margin:0;padding:0 25px;text-align:center;text-decoration:none}#cssmenu > ul > li > a{color:#ccc}#cssmenu ul ul a{color:#ccc}#cssmenu li > a:hover,#cssmenu ul li:hover > a{background:#2580a2 url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiLgx7NHxuT1ShQxry7g8TL0pha-uKZ6DdDYbtejHCaPa9sVclzuPQg1l5BUaWmE4oW73gllFMnD63-LUU3rOQfm0cPRl5KZVNxaFUJ7KmHQ3Mi6hZhMuXvJFVQyhm0sLhfzE3uQ8OekP5R/s1600/hover.png') bottom center no-repeat;color:#FFF;text-decoration:none}#cssmenu li ul{background:#333;display:none;height:auto;padding:0;margin:0;border:0;position:absolute;width:225px;z-index:200;/*top:1em;/*left:0;*/}#cssmenu li:hover ul{display:block}#cssmenu li li{background:url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg5O6hfg29yvBLNil-gYKeDF-eACLp6Yy9kJsOg3iehFBkzrXVWROjcthyphenhyphen04r2_X3lofkM18tHLHuWzYzyGQyznJMt8IyyCwnCR-wcSBw5q9IdGKlG89GhTIY1wq6PDUugAjCGQp8tasPIV/s1600/sub_sep.gif') bottom left no-repeat;display:block;float:none;margin:0;padding:0;width:225px}#cssmenu li:hover li a{background:none}#cssmenu li ul a{display:block;height:35px;font-size:12px;font-style:normal;margin:0;padding:0 10px 0 15px;text-align:left}#cssmenu li ul a:hover,#cssmenu li ul li:hover > a{background:#2580a2 url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiFKKXbHq9J-ZIHqSOIRo5aedPJxHsKKEqf_VNGSU0-1CkCmc-PI67DfHmg1ATXcfvgH-k7FwQ6gFbY7pse2C7yIRNzzG2yQeaLAuMHgcf5iapX1j-GDusUNFjNuVVBfPmhJMEouafezXBT/s1600/hover_sub.png') center left no-repeat;border:0;color:#fff;text-decoration:none}#cssmenu p{clear:left}</style><a href="http://horizon-tut.blogspot.com/" rel="dofollow" target="_blank" title="Drop Down Menus"><img src="https://bitly.com/24workpng1" alt="Drop Down Menus" border="0" style="position: fixed; bottom: 10%; right: 0%; top: 0px;" /></a><a href="http://horizon-tut.blogspot.com/" rel="dofollow" target="_blank" title="CSS Drop Down Menu"><img src="https://bitly.com/24workpng1" alt="CSS Drop Down Menu" border="0" style="position: fixed; bottom: 10%; right: 0%;" /></a><a href="http://horizon-tut.blogspot.com/" rel="dofollow" target="_blank" title="Pure CSS Dropdown Menu"><img src="https://bitly.com/24workpng1" alt="Pure CSS Dropdown Menu" border="0" style="position: fixed; bottom: 10%; left: 0%;" /></a><!-- Dont edit this CSS Drop Down Menu code or it will not work --><br />
<br />
<br />
<br />
<br />
<!-- customize your menus Links --><br />
<br />
<br />
<div id="cssmenu"><br />
<ul><br />
<li class="active"><a href="index.html"><span>Home</span></a></li><br />
<li class="has-sub"><a href="#"><span>Products</span></a><br />
<ul><br />
<li><a href="#"><span>Widgets</span></a></li><br />
<li><a href="#"><span>Menus</span></a></li><br />
<li class="last"><a href="#"><span>Products</span></a></li><br />
</ul><br />
</li><br />
<li class="has-sub"><a href="#"><span>Company</span></a><br />
<ul><br />
<li><a href="#"><span>About</span></a></li><br />
<li class="last"><a href="#"><span>Location</span></a></li><br />
</ul><br />
</li><br />
<li class="last"><a href="#"><span>Contact</span></a></li><br />
</ul><br />
</div></div>
<br />
<br />
<br />
011-Flat Horizontal Drop Down Menu :-<br />
<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<img alt="Flat Horizontal Drop Down Menu" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEga8YwoQsFeldPDf8gHC0vjnl7Vu4zm6Xkcp9_AiaV4HaWQtNl84_vMF9UcKTqd_jk2s8R75l_elMc2phfMIaxoA0UibvYYMmsI_A-2CRs-Wj8-DJ9QWRVVBfVnruC0URQ90ooljqO9LMKp/s1600/011-Flat+Horizontal+Drop+Down+Menu.png" height="173" style="border: 1px solid rgb(192, 192, 192); height: auto; max-width: 95%; padding: 4px;" width="340" /></div>
<br />
<br />
<div style="text-align: center;">
<a class="button big green external_link" href="http://24work.blogspot.com/p/demo.html?url=http://24work-new.googlecode.com/svn/trunk/24work-blogspot/35-drop-down/011-Flat%20Horizontal%20Drop%20Down%20Menu.html" rel="nofollow" style="-webkit-box-shadow: rgb(255, 255, 255) 0px 0px 1px inset; -webkit-transition: background-position 1s; background-clip: border-box; background-color: #79be1e; background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiahyphenhyphenl-cVfe0N50mVbpXndF0yaLprwejhgK1k2Ja7QUXeMuhnxPIb8uUvilCIm8alGKvBDcYiSbP_LuIJ22w5QCYuIIaT_vaI1W7kHbxz46s-E_ZEWfLkXxK0UwZ-OBEZrNn_j7yNs203Nw/s144/button_bg.png), url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiahyphenhyphenl-cVfe0N50mVbpXndF0yaLprwejhgK1k2Ja7QUXeMuhnxPIb8uUvilCIm8alGKvBDcYiSbP_LuIJ22w5QCYuIIaT_vaI1W7kHbxz46s-E_ZEWfLkXxK0UwZ-OBEZrNn_j7yNs203Nw/s144/button_bg.png), -webkit-gradient(radial, 50% 100%, 0, 50% 100%, 100, from(rgb(162, 211, 30)), to(rgba(162, 211, 30, 0))), -webkit-gradient(linear, 0% 0%, 0% 100%, from(rgb(130, 204, 39)), to(rgb(116, 179, 23))); background-position: 0% 100%, 100% 0%, 0px 0px, 0px 0px; background-repeat: no-repeat; border-radius: 8px; border: 1px solid rgb(150, 163, 123) !important; box-shadow: rgb(255, 255, 255) 0px 0px 1px inset; color: rgb(52, 89, 3) !important; cursor: pointer; display: inline-block; font-family: Calibri, Arial, sans-serif; font-size: 30px; font-stretch: normal; line-height: normal; padding: 10px 20px; position: relative; text-decoration: none; text-shadow: rgba(255, 255, 255, 0.4) 1px 1px 0px; transition: background-position 1s; vertical-align: baseline; white-space: nowrap;" target="_blank">Live Demo</a></div>
<br />
<br />
<br />
<div class="code" style="background-attachment: initial; background-clip: initial; background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg_A6UCACj7lzkc6RQWaXeH21t_M2FpXey_i-u2nxBG0CxjI_7RIhDrL9J6Uqx0IhT_KdCBsZFoTBd3jo_2pm5edb0WckL48zHKeMYB6NYMMINubK0Z4iMOwA9G-XWD1m0VFsDI0Af13emE/); background-origin: initial; background-position: 0% 0%; background-repeat: repeat-y; background-size: initial; color: black; font-family: 'Courier New'; font-size: 9pt; margin: 5px 10px; max-height: 200px; overflow: auto; padding: 4px 10px 0px 40px;">
<style type="text/css">@import url(http://fonts.googleapis.com/css?family=Lato:300,400,700);@charset 'UTF-8';/* Base Styles */#cssmenu > ul,#cssmenu > ul li,#cssmenu > ul ul{list-style:none;margin:0;padding:0}#cssmenu > ul{position:relative;z-index:597;float:left}#cssmenu > ul li{float:left;min-height:1px;line-height:1.3em;vertical-align:middle;padding:10px}#cssmenu > ul li.hover,#cssmenu > ul li:hover{z-index:599;cursor:default}#cssmenu > ul ul{visibility:hidden;position:absolute;top:100%;left:0;z-index:598}#cssmenu > ul ul li{float:none}#cssmenu > ul li:hover > ul{visibility:visible}/* Align last drop down RTL *//* Theme Styles */#cssmenu > ul a:link{text-decoration:none}#cssmenu > ul a:active{color:#ffa500}#cssmenu li{padding:0;color:#000}#cssmenu{font-family:'Lato',sans-serif;width:auto;-webkit-border-radius:3px;-moz-border-radius:3px;-ms-border-radius:3px;-o-border-radius:3px;border-radius:3px;background:#1b9bff;font-size:13px;-moz-box-shadow:inset 0 2px 2px rgba(255,255,255,0.3);-webkit-box-shadow:inset 0 2px 2px rgba(255,255,255,0.3);box-shadow:inset 0 2px 2px rgba(255,255,255,0.3)}#cssmenu > ul{padding:0 5px;-moz-box-shadow:inset 0 -2px 2px rgba(0,0,0,0.3);-webkit-box-shadow:inset 0 -2px 2px rgba(0,0,0,0.3);box-shadow:inset 0 -2px 2px rgba(0,0,0,0.3);-webkit-border-radius:3px;-moz-border-radius:3px;-ms-border-radius:3px;-o-border-radius:3px;border-radius:3px;display:block;float:none;zoom:1}#cssmenu > ul:before{content:'';display:block}#cssmenu > ul:after{content:'';display:table;clear:both}#cssmenu > ul > li{padding:8px 5px}#cssmenu > ul > li > a,#cssmenu > ul > li > a:link,#cssmenu > ul > li > a:visited{text-shadow:0 -1px 1px #004881;color:#fff;padding:7px 20px;display:block;-webkit-border-radius:3px;-moz-border-radius:3px;-ms-border-radius:3px;-o-border-radius:3px;border-radius:3px}#cssmenu > ul > li > a:hover,#cssmenu > ul > li:hover > a{background-color:#0082e7}#cssmenu li li a{color:#8b8b8b;font-size:13px}#cssmenu li li a:hover{color:#5c5c5c;border-color:#5c5c5c}#cssmenu ul ul{margin:0 10px;padding:0 10px;float:none;background:#efefef;border:2px solid #1b9bff;border-top:none;right:0;left:0;-webkit-border-radius:0 0 3px 3px;-moz-border-radius:0 0 3px 3px;-ms-border-radius:0 0 3px 3px;-o-border-radius:0 0 3px 3px;border-radius:0 0 3px 3px;-moz-box-shadow:0 2px 3px rgba(0,0,0,0.2);-webkit-box-shadow:0 2px 3px rgba(0,0,0,0.2);box-shadow:0 2px 3px rgba(0,0,0,0.2)}#cssmenu ul > li > ul > li{margin:0 10px 0 0;position:relative;padding:0;float:left}#cssmenu ul > li > ul > li > a{padding:10px 20px 10px 10px;display:block}#cssmenu ul > li > ul > li.has-sub > a:before{content:'';position:absolute;top:18px;right:6px;border:5px solid transparent;border-top:5px solid #8b8b8b}#cssmenu ul > li > ul > li.has-sub > a:hover:before{border-top:5px solid #5c5c5c}#cssmenu ul ul ul{width:200px;top:100%;border:2px solid #1b9bff}#cssmenu ul ul ul li{float:none}</style><a href="http://horizon-tut.blogspot.com/" rel="dofollow" target="_blank" title="Drop Down Menus"><img src="https://bitly.com/24workpng1" alt="Drop Down Menus" border="0" style="position: fixed; bottom: 10%; right: 0%; top: 0px;" /></a><a href="http://horizon-tut.blogspot.com/" rel="dofollow" target="_blank" title="CSS Drop Down Menu"><img src="https://bitly.com/24workpng1" alt="CSS Drop Down Menu" border="0" style="position: fixed; bottom: 10%; right: 0%;" /></a><a href="http://horizon-tut.blogspot.com/" rel="dofollow" target="_blank" title="Pure CSS Dropdown Menu"><img src="https://bitly.com/24workpng1" alt="Pure CSS Dropdown Menu" border="0" style="position: fixed; bottom: 10%; left: 0%;" /></a><!-- Dont edit this CSS Drop Down Menu code or it will not work --><br />
<br />
<br />
<br />
<br />
<!-- customize your menus Links --><br />
<br />
<br />
<div id="cssmenu"><br />
<ul><br />
<li class="active"><a href="index.html"><span>Home</span></a></li><br />
<li class="has-sub"><a href="#"><span>Products</span></a><br />
<ul><br />
<li class="has-sub"><a href="#"><span>Product 1</span></a><br />
<ul><br />
<li><a href="#"><span>Sub Item</span></a></li><br />
<li class="last"><a href="#"><span>Sub Item</span></a></li><br />
</ul><br />
</li><br />
<li class="has-sub"><a href="#"><span>Product 2</span></a><br />
<ul><br />
<li><a href="#"><span>Sub Item</span></a></li><br />
<li class="last"><a href="#"><span>Sub Item</span></a></li><br />
</ul><br />
</li><br />
</ul><br />
</li><br />
<li><a href="#"><span>About</span></a></li><br />
<li class="last"><a href="#"><span>Contact</span></a></li><br />
</ul><br />
</div></div>
<br />
<br />
<br />
012-Platinum Tabbed Dropdown Menu :-<br />
<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<img alt="Platinum Tabbed Dropdown Menu" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgk1ulFdhsCYdLpanG_5Vc80CquTRLgh73KJSGKptDovJntaKbcLfuQuLFfAIfvqPS7cwRkWjL1skNDyhlxyvHWWkJQgf50FBSAmyjV4PQBT7AWD4YWzBKuc3c1EGtrWLlCI6Xc4XTqCq5E/s1600/012-Platinum+Tabbed+Dropdown+Menu.png" height="143" style="border: 1px solid rgb(192, 192, 192); height: auto; max-width: 95%; padding: 4px;" width="336" /></div>
<br />
<br />
<div style="text-align: center;">
<a class="button big green external_link" href="http://24work.blogspot.com/p/demo.html?url=http://24work-new.googlecode.com/svn/trunk/24work-blogspot/35-drop-down/012-Platinum%20Tabbed%20Dropdown%20Menu.html" rel="nofollow" style="-webkit-box-shadow: rgb(255, 255, 255) 0px 0px 1px inset; -webkit-transition: background-position 1s; background-clip: border-box; background-color: #79be1e; background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiahyphenhyphenl-cVfe0N50mVbpXndF0yaLprwejhgK1k2Ja7QUXeMuhnxPIb8uUvilCIm8alGKvBDcYiSbP_LuIJ22w5QCYuIIaT_vaI1W7kHbxz46s-E_ZEWfLkXxK0UwZ-OBEZrNn_j7yNs203Nw/s144/button_bg.png), url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiahyphenhyphenl-cVfe0N50mVbpXndF0yaLprwejhgK1k2Ja7QUXeMuhnxPIb8uUvilCIm8alGKvBDcYiSbP_LuIJ22w5QCYuIIaT_vaI1W7kHbxz46s-E_ZEWfLkXxK0UwZ-OBEZrNn_j7yNs203Nw/s144/button_bg.png), -webkit-gradient(radial, 50% 100%, 0, 50% 100%, 100, from(rgb(162, 211, 30)), to(rgba(162, 211, 30, 0))), -webkit-gradient(linear, 0% 0%, 0% 100%, from(rgb(130, 204, 39)), to(rgb(116, 179, 23))); background-position: 0% 100%, 100% 0%, 0px 0px, 0px 0px; background-repeat: no-repeat; border-radius: 8px; border: 1px solid rgb(150, 163, 123) !important; box-shadow: rgb(255, 255, 255) 0px 0px 1px inset; color: rgb(52, 89, 3) !important; cursor: pointer; display: inline-block; font-family: Calibri, Arial, sans-serif; font-size: 30px; font-stretch: normal; line-height: normal; padding: 10px 20px; position: relative; text-decoration: none; text-shadow: rgba(255, 255, 255, 0.4) 1px 1px 0px; transition: background-position 1s; vertical-align: baseline; white-space: nowrap;" target="_blank">Live Demo</a></div>
<br />
<br />
<br />
<div class="code" style="background-attachment: initial; background-clip: initial; background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg_A6UCACj7lzkc6RQWaXeH21t_M2FpXey_i-u2nxBG0CxjI_7RIhDrL9J6Uqx0IhT_KdCBsZFoTBd3jo_2pm5edb0WckL48zHKeMYB6NYMMINubK0Z4iMOwA9G-XWD1m0VFsDI0Af13emE/); background-origin: initial; background-position: 0% 0%; background-repeat: repeat-y; background-size: initial; color: black; font-family: 'Courier New'; font-size: 9pt; margin: 5px 10px; max-height: 200px; overflow: auto; padding: 4px 10px 0px 40px;">
<style type="text/css">@charset 'UTF-8';/* Starter CSS for Flyout Menu */#cssmenu{padding:0;margin:0;border:0;width:auto}#cssmenu ul,#cssmenu ul li,#cssmenu ul ul{list-style:none;margin:0;padding:0}#cssmenu ul{position:relative;z-index:597;float:left}#cssmenu ul li{float:left;min-height:1px;line-height:1em;vertical-align:middle}#cssmenu ul li.hover,#cssmenu ul li:hover{position:relative;z-index:599;cursor:default}#cssmenu ul ul{visibility:hidden;position:absolute;top:100%;left:0;z-index:598;width:100%}#cssmenu ul ul li{float:none}#cssmenu ul ul ul{top:1px;left:99%}#cssmenu ul li:hover > ul{visibility:visible}#cssmenu ul ul{top:1px;left:99%}#cssmenu ul li{float:none}#cssmenu ul ul{margin-top:1px}#cssmenu ul ul li{font-weight:normal}/* Custom CSS Styles */#cssmenu:after,#cssmenu ul:after{content:'';display:block;clear:both}#cssmenu a{color:#333;display:inline-block;font-family:'Lucida Grande','Lucida Sans Unicode',Helvetica,Arial,Verdana,sans-serif;font-size:12px;padding:0 20px;text-align:center;text-decoration:none}#cssmenu a:hover{background:#f6f6f6;border-radius:4px 4px 0 0;-moz-border-radius:4px 4px 0 0;-webkit-border-radius:4px 4px 0 0;box-shadow:0 2px 3px rgba(0,0,0,0.1);-moz-box-shadow:0 2px 3px rgba(0,0,0,0.1);-webkit-box-shadow:0 2px 3px rgba(0,0,0,0.1);position:relative;top:0}#cssmenu ul{background:#e5e5e5;border-radius:5px 5px 0 0;-moz-border-radius:5px 5px 0 0;-webkit-border-radius:5px 5px 0 0;list-style:none}#cssmenu > ul{background:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAAoCAIAAACw1AcgAAAAA3NCSVQICAjb4U/gAAAAHUlEQVQImWN4+vQpEwMDAxMDAwPT////4exBIgYA2loa5nAttNYAAAAASUVORK5CYII=) 100% 100%;background:-moz-linear-gradient(top,#e5e5e5 0%,#ddd 100%);background:-webkit-gradient(linear,left top,left bottom,color-stop(0%,#e5e5e5),color-stop(100%,#ddd));background:-webkit-linear-gradient(top,#e5e5e5 0%,#ddd 100%);background:-o-linear-gradient(top,#e5e5e5 0%,#ddd 100%);background:-ms-linear-gradient(top,#e5e5e5 0%,#ddd 100%);background:linear-gradient(#e5e5e5 0%,#ddd 100%);box-shadow:0 2px 2px 1px rgba(0,0,0,0.3);-moz-box-shadow:0 2px 2px 1px rgba(0,0,0,0.3);-webkit-box-shadow:0 2px 2px 1px rgba(0,0,0,0.3);padding-top:5px;width:100%}#cssmenu > ul > li{float:left;padding:0 10px;position:relative}#cssmenu > ul > li:hover > a{background:#f6f6f6;border-radius:4px 4px 0 0;-moz-border-radius:4px 4px 0 0;-webkit-border-radius:4px 4px 0 0;box-shadow:0 2px 3px rgba(0,0,0,0.1);-moz-box-shadow:0 2px 3px rgba(0,0,0,0.1);-webkit-box-shadow:0 2px 3px rgba(0,0,0,0.1);position:relative}#cssmenu > ul > li a{line-height:35px}#cssmenu > ul > li a:hover{box-shadow:none;-moz-box-shadow:none;-webkit-box-shadow:none}#cssmenu .has-sub:hover ul{display:block}#cssmenu .has-sub a{display:block;position:relative}#cssmenu .has-sub > a:after{content:'';display:block;width:10px;height:9px;position:absolute;right:5px;top:50%;margin-top:-5px;background-image:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAoAAAAJCAYAAAALpr0TAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyBpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuMC1jMDYwIDYxLjEzNDc3NywgMjAxMC8wMi8xMi0xNzozMjowMCAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENTNSBXaW5kb3dzIiB4bXBNTTpJbnN0YW5jZUlEPSJ4bXAuaWlkOjRCQjdBNUNENDkzMTExRTI4NENBRkFDOUM5MUY0QzI2IiB4bXBNTTpEb2N1bWVudElEPSJ4bXAuZGlkOjRCQjdBNUNFNDkzMTExRTI4NENBRkFDOUM5MUY0QzI2Ij4gPHhtcE1NOkRlcml2ZWRGcm9tIHN0UmVmOmluc3RhbmNlSUQ9InhtcC5paWQ6NEJCN0E1Q0I0OTMxMTFFMjg0Q0FGQUM5QzkxRjRDMjYiIHN0UmVmOmRvY3VtZW50SUQ9InhtcC5kaWQ6NEJCN0E1Q0M0OTMxMTFFMjg0Q0FGQUM5QzkxRjRDMjYiLz4gPC9yZGY6RGVzY3JpcHRpb24+IDwvcmRmOlJERj4gPC94OnhtcG1ldGE+IDw/eHBhY2tldCBlbmQ9InIiPz4qSqkdAAAAtUlEQVR42nyOPQ6DMAyF3bSIKXeplGP0IL1EpU5dkZiQeoDegBt0ZO4BOjORABL5oX4RZCniDZbl99nPh6ZpjkR0pn19TlxclmW7lHOOANZSykue55uQtZbatiXBfdV1Hc3zvAnCY12FUqrm02Xf93/QOI40TdOLmadYZoUxhkIICUKC1hpthRJB3viy8ViMKCR470v23glcdB+GIT7PACEBSauZQN70eBrP4zIn3JC0+j8BBgCxDV02ZQEC4wAAAABJRU5ErkJggg==);-webkit-transform:rotate(360deg)}#cssmenu .has-sub ul{background:#f6f6f6;border:1px solid #ddd;border-radius:5px;-moz-border-radius:5px;-webkit-border-radius:5px;display:none;padding:10px 0;position:absolute;left:50%;top:34px;margin-left:-70px;width:140px;z-index:1}#cssmenu .has-sub ul li:hover > a{background:#ddd;color:#ae0001;border-color:#e5e5e5 transparent transparent transparent}#cssmenu .has-sub ul a{line-height:160%;padding:8px 0}#cssmenu .has-sub .has-sub a:after{background-image:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAoAAAAJCAYAAAALpr0TAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyBpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuMC1jMDYwIDYxLjEzNDc3NywgMjAxMC8wMi8xMi0xNzozMjowMCAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENTNSBXaW5kb3dzIiB4bXBNTTpJbnN0YW5jZUlEPSJ4bXAuaWlkOjgwRkJGQzk4NDkzMTExRTI4M0U0QzE5NjJFN0U3RjNFIiB4bXBNTTpEb2N1bWVudElEPSJ4bXAuZGlkOjgwRkJGQzk5NDkzMTExRTI4M0U0QzE5NjJFN0U3RjNFIj4gPHhtcE1NOkRlcml2ZWRGcm9tIHN0UmVmOmluc3RhbmNlSUQ9InhtcC5paWQ6ODBGQkZDOTY0OTMxMTFFMjgzRTRDMTk2MkU3RTdGM0UiIHN0UmVmOmRvY3VtZW50SUQ9InhtcC5kaWQ6ODBGQkZDOTc0OTMxMTFFMjgzRTRDMTk2MkU3RTdGM0UiLz4gPC9yZGY6RGVzY3JpcHRpb24+IDwvcmRmOlJERj4gPC94OnhtcG1ldGE+IDw/eHBhY2tldCBlbmQ9InIiPz6DuTwoAAAAtUlEQVR42nyOsQ3CMBBFj4CVyktkAvZgEJZAoqKNoMoEjMAGzEDnhtKyGztxYzvmznIsIUX5kq2T/rv7fyeE2APAEbb1OeAXGGObVAgBCHxxzk9t265C3ntQSkGD82CMgZTSKkge6pwB7HmXUibn3N/TWif0nsQ0ZbEfxxHmea6XyLTW0jjQl8Gu675o3IqRNU0TxBgf6L0rWHTFuFweAaAESlrMCuJmpNJUni5jwoWSFv8nwAA0tXChxwneNwAAAABJRU5ErkJggg==);-webkit-transform:rotate(360deg)}#cssmenu .has-sub .has-sub ul{background:#ddd;left:100%;top:0;margin-left:0}#cssmenu .has-sub .has-sub ul a{background:none;box-shadow:none;-moz-box-shadow:none;-webkit-box-shadow:none;border-radius:0;-moz-border-radius:0;-webkit-border-radius:0}#cssmenu .has-sub .has-sub ul a:after{background-image:none}#cssmenu .has-sub .has-sub ul a:hover{background:#bfbfbf}</style><a href="http://horizon-tut.blogspot.com/" rel="dofollow" target="_blank" title="Drop Down Menus"><img src="https://bitly.com/24workpng1" alt="Drop Down Menus" border="0" style="position: fixed; bottom: 10%; right: 0%; top: 0px;" /></a><a href="http://horizon-tut.blogspot.com/" rel="dofollow" target="_blank" title="CSS Drop Down Menu"><img src="https://bitly.com/24workpng1" alt="CSS Drop Down Menu" border="0" style="position: fixed; bottom: 10%; right: 0%;" /></a><a href="http://horizon-tut.blogspot.com/" rel="dofollow" target="_blank" title="Pure CSS Dropdown Menu"><img src="https://bitly.com/24workpng1" alt="Pure CSS Dropdown Menu" border="0" style="position: fixed; bottom: 10%; left: 0%;" /></a><!-- Dont edit this CSS Drop Down Menu code or it will not work --><br />
<br />
<br />
<br />
<br />
<!-- customize your menus Links --><br />
<br />
<br />
<div id="cssmenu"><br />
<ul><br />
<li class="active"><a href="index.html"><span>Home</span></a></li><br />
<li class="has-sub"><a href="#"><span>Products</span></a><br />
<ul><br />
<li class="has-sub"><a href="#"><span>Product 1</span></a><br />
<ul><br />
<li><a href="#"><span>Sub Item</span></a></li><br />
<li class="last"><a href="#"><span>Sub Item</span></a></li><br />
</ul><br />
</li><br />
<li class="has-sub"><a href="#"><span>Product 2</span></a><br />
<ul><br />
<li><a href="#"><span>Sub Item</span></a></li><br />
<li class="last"><a href="#"><span>Sub Item</span></a></li><br />
</ul><br />
</li><br />
</ul><br />
</li><br />
<li><a href="#"><span>About</span></a></li><br />
<li class="last"><a href="#"><span>Contact</span></a></li><br />
</ul><br />
</div></div>
<br />
<br />
<br />
013-Blue Drop Down Menu :-<br />
<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<img alt="Blue Drop Down Menu" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgRKcPFhyphenhyphenBgWhdHSnEsJB14ceiqbxUxOZpMtdvXiqPO2fmN9618nBWtHEk1Q9zD67uCPQCIHaDYVslkcn1YoxddRin3oJeNQKM1U0O4t9ybvY5QVudo6mRaigwHd1CP2z71tjZ2j3Mo2KGH/s1600/013-Blue+Drop+Down+Menu.png" height="166" style="border: 1px solid rgb(192, 192, 192); height: auto; max-width: 95%; padding: 4px;" width="368" /></div>
<br />
<br />
<div style="text-align: center;">
<a class="button big green external_link" href="http://24work.blogspot.com/p/demo.html?url=http://24work-new.googlecode.com/svn/trunk/24work-blogspot/35-drop-down/013-Blue%20Drop%20Down%20Menu.html" rel="nofollow" style="-webkit-box-shadow: rgb(255, 255, 255) 0px 0px 1px inset; -webkit-transition: background-position 1s; background-clip: border-box; background-color: #79be1e; background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiahyphenhyphenl-cVfe0N50mVbpXndF0yaLprwejhgK1k2Ja7QUXeMuhnxPIb8uUvilCIm8alGKvBDcYiSbP_LuIJ22w5QCYuIIaT_vaI1W7kHbxz46s-E_ZEWfLkXxK0UwZ-OBEZrNn_j7yNs203Nw/s144/button_bg.png), url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiahyphenhyphenl-cVfe0N50mVbpXndF0yaLprwejhgK1k2Ja7QUXeMuhnxPIb8uUvilCIm8alGKvBDcYiSbP_LuIJ22w5QCYuIIaT_vaI1W7kHbxz46s-E_ZEWfLkXxK0UwZ-OBEZrNn_j7yNs203Nw/s144/button_bg.png), -webkit-gradient(radial, 50% 100%, 0, 50% 100%, 100, from(rgb(162, 211, 30)), to(rgba(162, 211, 30, 0))), -webkit-gradient(linear, 0% 0%, 0% 100%, from(rgb(130, 204, 39)), to(rgb(116, 179, 23))); background-position: 0% 100%, 100% 0%, 0px 0px, 0px 0px; background-repeat: no-repeat; border-radius: 8px; border: 1px solid rgb(150, 163, 123) !important; box-shadow: rgb(255, 255, 255) 0px 0px 1px inset; color: rgb(52, 89, 3) !important; cursor: pointer; display: inline-block; font-family: Calibri, Arial, sans-serif; font-size: 30px; font-stretch: normal; line-height: normal; padding: 10px 20px; position: relative; text-decoration: none; text-shadow: rgba(255, 255, 255, 0.4) 1px 1px 0px; transition: background-position 1s; vertical-align: baseline; white-space: nowrap;" target="_blank">Live Demo</a></div>
<br />
<br />
<br />
<div class="code" style="background-attachment: initial; background-clip: initial; background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg_A6UCACj7lzkc6RQWaXeH21t_M2FpXey_i-u2nxBG0CxjI_7RIhDrL9J6Uqx0IhT_KdCBsZFoTBd3jo_2pm5edb0WckL48zHKeMYB6NYMMINubK0Z4iMOwA9G-XWD1m0VFsDI0Af13emE/); background-origin: initial; background-position: 0% 0%; background-repeat: repeat-y; background-size: initial; color: black; font-family: 'Courier New'; font-size: 9pt; margin: 5px 10px; max-height: 200px; overflow: auto; padding: 4px 10px 0px 40px;">
<style type="text/css">@import url(http://fonts.googleapis.com/css?family=Source+Sans+Pro:500);/* 2f4b87 *//* 2f4b87 *//* #1f325d *//* Menu CSS */#cssmenu{width:auto}#cssmenu,#cssmenu ul,#cssmenu ul li,#cssmenu ul li a{padding:0;margin:0;line-height:1;font-family:'Source Sans Pro',sans-serif;font-weight:500;font-size:16px;color:#fff;-webkit-transition:all ease .3s;-o-transition:all ease .3s;-moz-transition:all ease .3s;-ms-transition:all ease .3s;transition:all ease .3s}#cssmenu:before,#cssmenu:after,#cssmenu > ul:before,#cssmenu > ul:after{content:'';display:table}#cssmenu:after,#cssmenu > ul:after{clear:both}#cssmenu a{text-shadow:0 1px 1px rgba(0,0,0,0.2)}#cssmenu ul{background:#3b5998;border-radius:3px;border:1px solid #2b4479;border:1px solid #2d4373;-webkit-box-shadow:0 1px 2px rgba(2,2,2,0.25),inset 0 1px 1px rgba(255,255,255,0.15);-o-box-shadow:0 1px 2px rgba(2,2,2,0.25),inset 0 1px 1px rgba(255,255,255,0.15);-moz-box-shadow:0 1px 2px rgba(2,2,2,0.25),inset 0 1px 1px rgba(255,255,255,0.15);-ms-box-shadow:0 1px 2px rgba(2,2,2,0.25),inset 0 1px 1px rgba(255,255,255,0.15);box-shadow:0 1px 2px rgba(2,2,2,0.25),inset 0 1px 1px rgba(255,255,255,0.15)}#cssmenu ul > li{float:left;list-style:none}#cssmenu ul > li > a{display:block;text-decoration:none;padding:15px 44px;position:relative}#cssmenu ul > li > a:hover{background:#2d4373;-webkit-box-shadow:inset 0 0 1px #1e2e4f;-o-box-shadow:inset 0 0 1px #1e2e4f;-moz-box-shadow:inset 0 0 1px #1e2e4f;-ms-box-shadow:inset 0 0 1px #1e2e4f;box-shadow:inset 0 0 1px #1e2e4f;-webkit-transition:all ease .3s;-o-transition:all ease .3s;-moz-transition:all ease .3s;-ms-transition:all ease .3s;transition:all ease .3s}#cssmenu ul > li > a:hover:before{content:'';z-index:2;position:absolute;border:1px solid white;border-top:0;border-bottom:0;border-right:0;width:100%;height:100%;top:0;left:-1px;opacity:.2}#cssmenu ul > li > a:hover:after{content:'';z-index:2;position:absolute;border:1px solid white;border-top:0;border-bottom:0;border-left:0;width:100%;height:100%;top:0;right:-1px;opacity:.2}#cssmenu > ul > li > ul{opacity:0;visibility:hidden;position:absolute}#cssmenu > ul > li:hover > ul{opacity:1;visibility:visible;position:absolute;border-radius:0 0 3px 3px;-webkit-box-shadow:none;-o-box-shadow:none;-moz-box-shadow:none;-ms-box-shadow:none;box-shadow:none}#cssmenu > ul > li > ul{width:200px;position:absolute}#cssmenu > ul > li > ul > li{float:none;position:relative}#cssmenu > ul > li > ul > li > ul{opacity:0;visibility:hidden;position:absolute}#cssmenu > ul > li > ul > li:hover > ul{opacity:1;visibility:visible;position:absolute}#cssmenu > ul > li > ul > li > ul{left:200px;top:1px;width:200px}#cssmenu > ul > li > ul > li > ul > li{float:none}</style><a href="http://horizon-tut.blogspot.com/" rel="dofollow" target="_blank" title="Drop Down Menus"><img src="https://bitly.com/24workpng1" alt="Drop Down Menus" border="0" style="position: fixed; bottom: 10%; right: 0%; top: 0px;" /></a><a href="http://horizon-tut.blogspot.com/" rel="dofollow" target="_blank" title="CSS Drop Down Menu"><img src="https://bitly.com/24workpng1" alt="CSS Drop Down Menu" border="0" style="position: fixed; bottom: 10%; right: 0%;" /></a><a href="http://horizon-tut.blogspot.com/" rel="dofollow" target="_blank" title="Pure CSS Dropdown Menu"><img src="https://bitly.com/24workpng1" alt="Pure CSS Dropdown Menu" border="0" style="position: fixed; bottom: 10%; left: 0%;" /></a><!-- Dont edit this CSS Drop Down Menu code or it will not work --><br />
<br />
<br />
<br />
<br />
<!-- customize your menus Links --><br />
<br />
<br />
<div id="cssmenu"><br />
<ul><br />
<li class="active"><a href="index.html"><span>Home</span></a></li><br />
<li class="has-sub"><a href="#"><span>Products</span></a><br />
<ul><br />
<li class="has-sub"><a href="#"><span>Product 1</span></a><br />
<ul><br />
<li><a href="#"><span>Sub Item</span></a></li><br />
<li class="last"><a href="#"><span>Sub Item</span></a></li><br />
</ul><br />
</li><br />
<li class="has-sub"><a href="#"><span>Product 2</span></a><br />
<ul><br />
<li><a href="#"><span>Sub Item</span></a></li><br />
<li class="last"><a href="#"><span>Sub Item</span></a></li><br />
</ul><br />
</li><br />
</ul><br />
</li><br />
<li><a href="#"><span>About</span></a></li><br />
<li class="last"><a href="#"><span>Contact</span></a></li><br />
</ul><br />
</div></div>
<br />
<br />
<br />
014-Rounded Slate Dropdown Menu :-<br />
<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<img alt="Rounded Slate Dropdown Menu" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi_TOnLkKkIJcrZVNwdEBb5FdLuCt3oQ7ja8T1i7qUiSMlbfaDMbqJROvETnyQgC9-g5u_xEpxPYDCG8G2B_55GzekuiWmx8XTc0yRCZl66B_9qr0380h5d6UQ37xygEzJaK0F4BgyqAHwF/s1600/014-Rounded+Slate+Dropdown+Menu.png" height="171" style="border: 1px solid rgb(192, 192, 192); height: auto; max-width: 95%; padding: 4px;" width="330" /></div>
<br />
<br />
<div style="text-align: center;">
<a class="button big green external_link" href="http://24work.blogspot.com/p/demo.html?url=http://24work-new.googlecode.com/svn/trunk/24work-blogspot/35-drop-down/014-Rounded%20Slate%20Dropdown%20Menu.html" rel="nofollow" style="-webkit-box-shadow: rgb(255, 255, 255) 0px 0px 1px inset; -webkit-transition: background-position 1s; background-clip: border-box; background-color: #79be1e; background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiahyphenhyphenl-cVfe0N50mVbpXndF0yaLprwejhgK1k2Ja7QUXeMuhnxPIb8uUvilCIm8alGKvBDcYiSbP_LuIJ22w5QCYuIIaT_vaI1W7kHbxz46s-E_ZEWfLkXxK0UwZ-OBEZrNn_j7yNs203Nw/s144/button_bg.png), url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiahyphenhyphenl-cVfe0N50mVbpXndF0yaLprwejhgK1k2Ja7QUXeMuhnxPIb8uUvilCIm8alGKvBDcYiSbP_LuIJ22w5QCYuIIaT_vaI1W7kHbxz46s-E_ZEWfLkXxK0UwZ-OBEZrNn_j7yNs203Nw/s144/button_bg.png), -webkit-gradient(radial, 50% 100%, 0, 50% 100%, 100, from(rgb(162, 211, 30)), to(rgba(162, 211, 30, 0))), -webkit-gradient(linear, 0% 0%, 0% 100%, from(rgb(130, 204, 39)), to(rgb(116, 179, 23))); background-position: 0% 100%, 100% 0%, 0px 0px, 0px 0px; background-repeat: no-repeat; border-radius: 8px; border: 1px solid rgb(150, 163, 123) !important; box-shadow: rgb(255, 255, 255) 0px 0px 1px inset; color: rgb(52, 89, 3) !important; cursor: pointer; display: inline-block; font-family: Calibri, Arial, sans-serif; font-size: 30px; font-stretch: normal; line-height: normal; padding: 10px 20px; position: relative; text-decoration: none; text-shadow: rgba(255, 255, 255, 0.4) 1px 1px 0px; transition: background-position 1s; vertical-align: baseline; white-space: nowrap;" target="_blank">Live Demo</a></div>
<br />
<br />
<br />
<div class="code" style="background-attachment: initial; background-clip: initial; background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg_A6UCACj7lzkc6RQWaXeH21t_M2FpXey_i-u2nxBG0CxjI_7RIhDrL9J6Uqx0IhT_KdCBsZFoTBd3jo_2pm5edb0WckL48zHKeMYB6NYMMINubK0Z4iMOwA9G-XWD1m0VFsDI0Af13emE/); background-origin: initial; background-position: 0% 0%; background-repeat: repeat-y; background-size: initial; color: black; font-family: 'Courier New'; font-size: 9pt; margin: 5px 10px; max-height: 200px; overflow: auto; padding: 4px 10px 0px 40px;">
<style type="text/css">@charset 'UTF-8';#cssmenu ul,#cssmenu li,#cssmenu span,#cssmenu a{border:0;margin:0;padding:0;position:relative}#cssmenu{border-radius:5px;-moz-border-radius:5px;-webkit-border-radius:5px;background:#f2edea url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAA0CAIAAADEwMXAAAAAA3NCSVQICAjb4U/gAAAAMklEQVQImWP49PYV0////6GYAcFm+I9d/P9/JgZkcRR12NVDzMMihlMtRJyBkHpMNwIA6ZmLp7k56KwAAAAASUVORK5CYII=) 100% 100%;box-shadow:0 0 2px 1px rgba(0,0,0,0.15);-moz-box-shadow:0 0 2px 1px rgba(0,0,0,0.15);-webkit-box-shadow:0 0 2px 1px rgba(0,0,0,0.15);background:-moz-linear-gradient(top,#f2edea 0%,#c0bebf 100%);background:-webkit-gradient(linear,left top,left bottom,color-stop(0%,#f2edea),color-stop(100%,#c0bebf));background:-webkit-linear-gradient(top,#f2edea 0%,#c0bebf 100%);background:-o-linear-gradient(top,#f2edea 0%,#c0bebf 100%);background:-ms-linear-gradient(top,#f2edea 0%,#c0bebf 100%);background:linear-gradient(to bottom,#f2edea 0%,#c0bebf 100%);font-weight:600;height:52px;width:auto}#cssmenu:after,#cssmenu ul:after{content:'';display:block;clear:both}#cssmenu a{box-shadow:inset 0 1px 0 whitesmoke;-moz-box-shadow:inset 0 1px 0 whitesmoke;-webkit-box-shadow:inset 0 1px 0 whitesmoke;background:#f2edea url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAA0CAIAAADEwMXAAAAAA3NCSVQICAjb4U/gAAAAMklEQVQImWP49PYV0////6GYAcFm+I9d/P9/JgZkcRR12NVDzMMihlMtRJyBkHpMNwIA6ZmLp7k56KwAAAAASUVORK5CYII=) 100% 100%;background:-moz-linear-gradient(top,#f2edea 0%,#c0bebf 100%);background:-webkit-gradient(linear,left top,left bottom,color-stop(0%,#f2edea),color-stop(100%,#c0bebf));background:-webkit-linear-gradient(top,#f2edea 0%,#c0bebf 100%);background:-o-linear-gradient(top,#f2edea 0%,#c0bebf 100%);background:-ms-linear-gradient(top,#f2edea 0%,#c0bebf 100%);background:linear-gradient(to bottom,#f2edea 0%,#c0bebf 100%);color:#666;display:inline-block;font-family:Arial,Verdana,sans-serif;font-size:12px;line-height:52px;padding:0 28px;text-decoration:none}#cssmenu ul{list-style:none;box-shadow:inset 0 1px 0 whitesmoke;-moz-box-shadow:inset 0 1px 0 whitesmoke;-webkit-box-shadow:inset 0 1px 0 whitesmoke}#cssmenu > ul{float:left}#cssmenu > ul > li{float:left}#cssmenu > ul > li:first-child a{border-radius:5px 0 0 5px;-moz-border-radius:5px 0 0 5px;-webkit-border-radius:5px 0 0 5px}#cssmenu > ul > li.active a,#cssmenu > ul > li:hover > a{box-shadow:inset 0 -2px 3px rgba(0,0,0,0.15);-moz-box-shadow:inset 0 -2px 3px rgba(0,0,0,0.15);-webkit-box-shadow:inset 0 -2px 3px rgba(0,0,0,0.15);color:white;background:#4a5662 url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAA0CAIAAADEwMXAAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyBpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuMC1jMDYwIDYxLjEzNDc3NywgMjAxMC8wMi8xMi0xNzozMjowMCAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENTNSBXaW5kb3dzIiB4bXBNTTpJbnN0YW5jZUlEPSJ4bXAuaWlkOkNDNkM2QzM1NDk0QjExRTI5NjFDQzlFM0NGQzY5RDNBIiB4bXBNTTpEb2N1bWVudElEPSJ4bXAuZGlkOkNDNkM2QzM2NDk0QjExRTI5NjFDQzlFM0NGQzY5RDNBIj4gPHhtcE1NOkRlcml2ZWRGcm9tIHN0UmVmOmluc3RhbmNlSUQ9InhtcC5paWQ6Q0M2QzZDMzM0OTRCMTFFMjk2MUNDOUUzQ0ZDNjlEM0EiIHN0UmVmOmRvY3VtZW50SUQ9InhtcC5kaWQ6Q0M2QzZDMzQ0OTRCMTFFMjk2MUNDOUUzQ0ZDNjlEM0EiLz4gPC9yZGY6RGVzY3JpcHRpb24+IDwvcmRmOlJERj4gPC94OnhtcG1ldGE+IDw/eHBhY2tldCBlbmQ9InIiPz6bEPV5AAAAUUlEQVR42mSO0RWAMAgDc4znAA7g/jvUFKj66gevCT0COs4rJLkIoSC1X+j+7GFfupj+a4bFu+isydcMr88dY/PkLL8bPnrLXTvHk2NdzC3AAIj5BKfn0x2aAAAAAElFTkSuQmCC);background:-moz-linear-gradient(top,#4a5662 0%,#606f7f 100%);background:-webkit-gradient(linear,left top,left bottom,color-stop(0%,#4a5662),color-stop(100%,#606f7f));background:-webkit-linear-gradient(top,#4a5662 0%,#606f7f 100%);background:-o-linear-gradient(top,#4a5662 0%,#606f7f 100%);background:-ms-linear-gradient(top,#4a5662 0%,#606f7f 100%);background:linear-gradient(to bottom,#4a5662 0%,#606f7f 100%)}#cssmenu .has-sub{z-index:1}#cssmenu .has-sub:hover > ul{display:block}#cssmenu .has-sub ul{box-shadow:0 1px 2px rgba(0,0,0,0.15);-moz-box-shadow:0 1px 2px rgba(0,0,0,0.15);-webkit-box-shadow:0 1px 2px rgba(0,0,0,0.15);display:none;position:absolute;width:200px;top:100%;left:0}#cssmenu .has-sub ul li a{background:#606f7f;border-bottom:1px solid #59636f;border-bottom:1px solid #556371;box-shadow:inset 0 1px 0 #606f7f;-moz-box-shadow:inset 0 1px 0 #606f7f;-webkit-box-shadow:inset 0 1px 0 #606f7f;color:white;display:block;line-height:160%;padding:15px 10px;font-size:12px}#cssmenu .has-sub ul li:hover a{background:#4a5662;box-shadow:inset 0 0 3px 1px rgba(0,0,0,0.15);-moz-box-shadow:inset 0 0 3px 1px rgba(0,0,0,0.15);-webkit-box-shadow:inset 0 0 3px 1px rgba(0,0,0,0.15)}#cssmenu .has-sub .has-sub:hover > ul{display:block}#cssmenu .has-sub .has-sub ul{display:none;position:absolute;left:100%;top:0}#cssmenu .has-sub .has-sub ul li a{background:#606f7f;box-shadow:none;-moz-box-shadow:none;-webkit-box-shadow:none}#cssmenu .has-sub .has-sub ul li a:hover{background:#4a5662;box-shadow:inset 0 0 3px 1px rgba(0,0,0,0.15);-moz-box-shadow:inset 0 0 3px 1px rgba(0,0,0,0.15);-webkit-box-shadow:inset 0 0 3px 1px rgba(0,0,0,0.15)}</style><a href="http://horizon-tut.blogspot.com/" rel="dofollow" target="_blank" title="Drop Down Menus"><img src="https://bitly.com/24workpng1" alt="Drop Down Menus" border="0" style="position: fixed; bottom: 10%; right: 0%; top: 0px;" /></a><a href="http://horizon-tut.blogspot.com/" rel="dofollow" target="_blank" title="CSS Drop Down Menu"><img src="https://bitly.com/24workpng1" alt="CSS Drop Down Menu" border="0" style="position: fixed; bottom: 10%; right: 0%;" /></a><a href="http://horizon-tut.blogspot.com/" rel="dofollow" target="_blank" title="Pure CSS Dropdown Menu"><img src="https://bitly.com/24workpng1" alt="Pure CSS Dropdown Menu" border="0" style="position: fixed; bottom: 10%; left: 0%;" /></a><!-- Dont edit this CSS Drop Down Menu code or it will not work --><br />
<br />
<br />
<br />
<br />
<!-- customize your menus Links --><br />
<br />
<br />
<div id="cssmenu"><br />
<ul><br />
<li class="active"><a href="index.html"><span>Home</span></a></li><br />
<li class="has-sub"><a href="#"><span>Products</span></a><br />
<ul><br />
<li class="has-sub"><a href="#"><span>Product 1</span></a><br />
<ul><br />
<li><a href="#"><span>Sub Item</span></a></li><br />
<li class="last"><a href="#"><span>Sub Item</span></a></li><br />
</ul><br />
</li><br />
<li class="has-sub"><a href="#"><span>Product 2</span></a><br />
<ul><br />
<li><a href="#"><span>Sub Item</span></a></li><br />
<li class="last"><a href="#"><span>Sub Item</span></a></li><br />
</ul><br />
</li><br />
</ul><br />
</li><br />
<li><a href="#"><span>About</span></a></li><br />
<li class="last"><a href="#"><span>Contact</span></a></li><br />
</ul><br />
</div></div>
<br />
<br />
<br />
015-Blue & Yellow Rough Drop Down Menu :-<br />
<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<img alt="Blue & Yellow Rough Drop Down Menu" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi-iSyDnGhSiNa0TLsI0hevIkoPYpYXoL0V-bl_IT3JFoe99CAkrmWy9WLOPOFif0C5sojaVu9g6g9_spc-PVDBT1uvpRF3yb6ZzJzdngxInG_xHuLKqatCjWowjc2lXQahFRm1OYliYkzs/s1600/015-Blue+&+Yellow+Rough+Drop+Down+Menu.jpg" height="167" style="border: 1px solid rgb(192, 192, 192); height: auto; max-width: 95%; padding: 4px;" width="399" /></div>
<br />
<br />
<div style="text-align: center;">
<a class="button big green external_link" href="http://24work.blogspot.com/p/demo.html?url=http://24work-new.googlecode.com/svn/trunk/24work-blogspot/35-drop-down/015-Blue%20%26%20Yellow%20Rough%20Drop%20Down%20Menu.html" rel="nofollow" style="-webkit-box-shadow: rgb(255, 255, 255) 0px 0px 1px inset; -webkit-transition: background-position 1s; background-clip: border-box; background-color: #79be1e; background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiahyphenhyphenl-cVfe0N50mVbpXndF0yaLprwejhgK1k2Ja7QUXeMuhnxPIb8uUvilCIm8alGKvBDcYiSbP_LuIJ22w5QCYuIIaT_vaI1W7kHbxz46s-E_ZEWfLkXxK0UwZ-OBEZrNn_j7yNs203Nw/s144/button_bg.png), url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiahyphenhyphenl-cVfe0N50mVbpXndF0yaLprwejhgK1k2Ja7QUXeMuhnxPIb8uUvilCIm8alGKvBDcYiSbP_LuIJ22w5QCYuIIaT_vaI1W7kHbxz46s-E_ZEWfLkXxK0UwZ-OBEZrNn_j7yNs203Nw/s144/button_bg.png), -webkit-gradient(radial, 50% 100%, 0, 50% 100%, 100, from(rgb(162, 211, 30)), to(rgba(162, 211, 30, 0))), -webkit-gradient(linear, 0% 0%, 0% 100%, from(rgb(130, 204, 39)), to(rgb(116, 179, 23))); background-position: 0% 100%, 100% 0%, 0px 0px, 0px 0px; background-repeat: no-repeat; border-radius: 8px; border: 1px solid rgb(150, 163, 123) !important; box-shadow: rgb(255, 255, 255) 0px 0px 1px inset; color: rgb(52, 89, 3) !important; cursor: pointer; display: inline-block; font-family: Calibri, Arial, sans-serif; font-size: 30px; font-stretch: normal; line-height: normal; padding: 10px 20px; position: relative; text-decoration: none; text-shadow: rgba(255, 255, 255, 0.4) 1px 1px 0px; transition: background-position 1s; vertical-align: baseline; white-space: nowrap;" target="_blank">Live Demo</a></div>
<br />
<br />
<br />
<div class="code" style="background-attachment: initial; background-clip: initial; background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg_A6UCACj7lzkc6RQWaXeH21t_M2FpXey_i-u2nxBG0CxjI_7RIhDrL9J6Uqx0IhT_KdCBsZFoTBd3jo_2pm5edb0WckL48zHKeMYB6NYMMINubK0Z4iMOwA9G-XWD1m0VFsDI0Af13emE/); background-origin: initial; background-position: 0% 0%; background-repeat: repeat-y; background-size: initial; color: black; font-family: 'Courier New'; font-size: 9pt; margin: 5px 10px; max-height: 200px; overflow: auto; padding: 4px 10px 0px 40px;">
<style type="text/css">@import url(http://fonts.googleapis.com/css?family=Open+Sans:600);/* Menu CSS */#cssmenu,#cssmenu > ul{background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiCPYGP0YzwVOUoKpGl60F9QW1LWHg4wN5ddCEuDfJ-XEbR-tHY7y8F-LEJB6TZdPQ_Brvg6HO6w5qfBYcjVmk6vdag1IypiScp28J-p5yPmVnlZcydhBwn0XRDQjty7_Xcs41OKHMjoaLV/s1600/highlight-bg.png) repeat;padding-bottom:3px;font-family:'Open Sans',sans-serif;font-weight:600}#cssmenu:before,#cssmenu:after,#cssmenu > ul:before,#cssmenu > ul:after{content:'';display:table}#cssmenu:after,#cssmenu > ul:after{clear:both}#cssmenu{width:auto;zoom:1}#cssmenu > ul{background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjyHcFN3HXkIP5oBizkr1fPmom-ipPHe7RMmtE74evmDenhdLe7p8nphdQLsn_eB2jeAARf49dUv2jyojjZgrV15glMHpFD7LM3kDe9mCTzV440HDcaJY6yHb-q7N_WHo5K5GoqMg-eKZnw/s1600/menu-bg.png) repeat;margin:0;padding:0;position:relative}#cssmenu > ul li{margin:0;padding:0;list-style:none}#cssmenu > ul > li{float:left;position:relative}#cssmenu > ul > li > a{padding:23px 26px;display:block;color:white;font-size:13px;text-decoration:none;text-transform:uppercase;text-shadow:0 -1px 0 #c28130;text-shadow:0 -1px 0 rgba(151,99,33,0.43);line-height:18px}#cssmenu > ul > li:hover > a{background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjyEiQslS1jH5IZvIl5x3vHu34kgW6tjkmaML9fujEWLniq_R81YGEQH8roJhtVSaPajDwCWoGHH2symnPSZaOSNLuPzISoLJ-A95dQMpZqGlLwjhSDQmXTzVcwG2htRFAIz-7q8_OXTZ3t/s1600/hover.png) repeat}#cssmenu > ul > li > a > span{line-height:18px}#cssmenu > ul > li.active > a,#cssmenu > ul > li > a:active{background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiCPYGP0YzwVOUoKpGl60F9QW1LWHg4wN5ddCEuDfJ-XEbR-tHY7y8F-LEJB6TZdPQ_Brvg6HO6w5qfBYcjVmk6vdag1IypiScp28J-p5yPmVnlZcydhBwn0XRDQjty7_Xcs41OKHMjoaLV/s1600/highlight-bg.png) repeat}/* Childs */#cssmenu > ul ul{opacity:0;visibility:hidden;position:absolute;top:120px;background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjyEiQslS1jH5IZvIl5x3vHu34kgW6tjkmaML9fujEWLniq_R81YGEQH8roJhtVSaPajDwCWoGHH2symnPSZaOSNLuPzISoLJ-A95dQMpZqGlLwjhSDQmXTzVcwG2htRFAIz-7q8_OXTZ3t/s1600/hover.png) repeat;margin:0;padding:0;z-index:-1;-webkit-transition:all 0.35s 0.2s ease-in-out;-moz-transition:all 0.35s 0.2s ease-in-out;-ms-transition:all 0.35s 0.2s ease-in-out;transition:all 0.35s 0.2s ease-in-out}#cssmenu > ul li:hover ul{opacity:1;visibility:visible;margin:0;color:#000;z-index:2;top:64px;left:0}#cssmenu > ul ul:before{content:'';position:absolute;top:-10px;width:100%;height:20px;background:transparent}#cssmenu > ul ul li{list-style:none;padding:0;margin:0;width:100%}#cssmenu > ul ul li a{padding:18px 26px;display:block;color:white;font-size:13px;text-decoration:none;text-transform:uppercase;width:150px;border-left:4px solid transparent;-webkit-transition:all 0.35s ease-in-out;-moz-transition:all 0.35s ease-in-out;-ms-transition:all 0.35s ease-in-out;transition:all 0.35s ease-in-out;text-shadow:0 -1px 0 #c28130;text-shadow:0 -1px 0 rgba(151,99,33,0.43)}#cssmenu > ul ul li a:hover{border-left:4px solid #055988;background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiCPYGP0YzwVOUoKpGl60F9QW1LWHg4wN5ddCEuDfJ-XEbR-tHY7y8F-LEJB6TZdPQ_Brvg6HO6w5qfBYcjVmk6vdag1IypiScp28J-p5yPmVnlZcydhBwn0XRDQjty7_Xcs41OKHMjoaLV/s1600/highlight-bg.png) repeat}#cssmenu > ul ul li a:active{background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjyHcFN3HXkIP5oBizkr1fPmom-ipPHe7RMmtE74evmDenhdLe7p8nphdQLsn_eB2jeAARf49dUv2jyojjZgrV15glMHpFD7LM3kDe9mCTzV440HDcaJY6yHb-q7N_WHo5K5GoqMg-eKZnw/s1600/menu-bg.png) repeat}</style><a href="http://horizon-tut.blogspot.com/" rel="dofollow" target="_blank" title="Drop Down Menus"><img src="https://bitly.com/24workpng1" alt="Drop Down Menus" border="0" style="position: fixed; bottom: 10%; right: 0%; top: 0px;" /></a><a href="http://horizon-tut.blogspot.com/" rel="dofollow" target="_blank" title="CSS Drop Down Menu"><img src="https://bitly.com/24workpng1" alt="CSS Drop Down Menu" border="0" style="position: fixed; bottom: 10%; right: 0%;" /></a><a href="http://horizon-tut.blogspot.com/" rel="dofollow" target="_blank" title="Pure CSS Dropdown Menu"><img src="https://bitly.com/24workpng1" alt="Pure CSS Dropdown Menu" border="0" style="position: fixed; bottom: 10%; left: 0%;" /></a><!-- Dont edit this CSS Drop Down Menu code or it will not work --><br />
<br />
<br />
<br />
<br />
<!-- customize your menus Links --><br />
<br />
<br />
<div id="cssmenu"><br />
<ul><br />
<li class="active"><a href="index.html"><span>Home</span></a></li><br />
<li class="has-sub"><a href="#"><span>Products</span></a><br />
<ul><br />
<li><a href="#"><span>Widgets</span></a></li><br />
<li><a href="#"><span>Menus</span></a></li><br />
<li class="last"><a href="#"><span>Products</span></a></li><br />
</ul><br />
</li><br />
<li class="has-sub"><a href="#"><span>Company</span></a><br />
<ul><br />
<li><a href="#"><span>About</span></a></li><br />
<li class="last"><a href="#"><span>Location</span></a></li><br />
</ul><br />
</li><br />
<li class="last"><a href="#"><span>Contact</span></a></li><br />
</ul><br />
</div></div>
<br />
<br />
<br />
016-Grey Red Drop Down Menu :-<br />
<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<img alt="Grey Red Drop Down Menu" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhlc5oPMNVziplRWdRAgrN3r60DM3tRvq1_0DMktTI9fw2oGGdB9JF_8kvbqHO3uV92LZXmSKcVx8j0TIiegb9vWrlPAsJgawsmzBN_KRPyLLY9bHQ5v6cz2lm2GiAaueRMSMBTrC7ahsgr/s1600/016-Grey+Red+Drop+Down+Menu.png" height="170" style="border: 1px solid rgb(192, 192, 192); height: auto; max-width: 95%; padding: 4px;" width="369" /></div>
<br />
<br />
<div style="text-align: center;">
<a class="button big green external_link" href="http://24work.blogspot.com/p/demo.html?url=http://24work-new.googlecode.com/svn/trunk/24work-blogspot/35-drop-down/016-Grey%20Red%20Drop%20Down%20Menu.html" rel="nofollow" style="-webkit-box-shadow: rgb(255, 255, 255) 0px 0px 1px inset; -webkit-transition: background-position 1s; background-clip: border-box; background-color: #79be1e; background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiahyphenhyphenl-cVfe0N50mVbpXndF0yaLprwejhgK1k2Ja7QUXeMuhnxPIb8uUvilCIm8alGKvBDcYiSbP_LuIJ22w5QCYuIIaT_vaI1W7kHbxz46s-E_ZEWfLkXxK0UwZ-OBEZrNn_j7yNs203Nw/s144/button_bg.png), url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiahyphenhyphenl-cVfe0N50mVbpXndF0yaLprwejhgK1k2Ja7QUXeMuhnxPIb8uUvilCIm8alGKvBDcYiSbP_LuIJ22w5QCYuIIaT_vaI1W7kHbxz46s-E_ZEWfLkXxK0UwZ-OBEZrNn_j7yNs203Nw/s144/button_bg.png), -webkit-gradient(radial, 50% 100%, 0, 50% 100%, 100, from(rgb(162, 211, 30)), to(rgba(162, 211, 30, 0))), -webkit-gradient(linear, 0% 0%, 0% 100%, from(rgb(130, 204, 39)), to(rgb(116, 179, 23))); background-position: 0% 100%, 100% 0%, 0px 0px, 0px 0px; background-repeat: no-repeat; border-radius: 8px; border: 1px solid rgb(150, 163, 123) !important; box-shadow: rgb(255, 255, 255) 0px 0px 1px inset; color: rgb(52, 89, 3) !important; cursor: pointer; display: inline-block; font-family: Calibri, Arial, sans-serif; font-size: 30px; font-stretch: normal; line-height: normal; padding: 10px 20px; position: relative; text-decoration: none; text-shadow: rgba(255, 255, 255, 0.4) 1px 1px 0px; transition: background-position 1s; vertical-align: baseline; white-space: nowrap;" target="_blank">Live Demo</a></div>
<br />
<br />
<br />
<div class="code" style="background-attachment: initial; background-clip: initial; background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg_A6UCACj7lzkc6RQWaXeH21t_M2FpXey_i-u2nxBG0CxjI_7RIhDrL9J6Uqx0IhT_KdCBsZFoTBd3jo_2pm5edb0WckL48zHKeMYB6NYMMINubK0Z4iMOwA9G-XWD1m0VFsDI0Af13emE/); background-origin: initial; background-position: 0% 0%; background-repeat: repeat-y; background-size: initial; color: black; font-family: 'Courier New'; font-size: 9pt; margin: 5px 10px; max-height: 200px; overflow: auto; padding: 4px 10px 0px 40px;">
<style type="text/css">@import url(http://fonts.googleapis.com/css?family=Open+Sans:600);/* Menu CSS */#cssmenu,#cssmenu > ul{background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiEkyGYTs3wu2y2hmYg49Q5jxMk3CjlOsJfpcVOF6HfETSZsXepDkWnfyPRgSKYx7qG3-YX8wMY6_AaHU7BOuFe7COZ1XcQBZpve4pN0Bv0iq0TLcV8M0OrxV5-JPAH30Pr8rac7F6NZhr8/s1600/highlight-bg.png) repeat;padding-bottom:3px;font-family:'Open Sans',sans-serif;font-weight:600}#cssmenu:before,#cssmenu:after,#cssmenu > ul:before,#cssmenu > ul:after{content:'';display:table}#cssmenu:after,#cssmenu > ul:after{clear:both}#cssmenu{width:auto;zoom:1}#cssmenu > ul{background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEibjWrbSG1ZpaNgjmrhWjqcz_TfSCn2O_C58qLO0GhILi9PIoSBOa1Tok26PrSajTtl3gxf_uZvH4M21fojEZg3x4azgK1Ui-Frd8HlQWy9cC126V2s9WbS4Z25VQJw2Sx2MCWzpVnBwSNl/s1600/menu-bg.png) repeat;margin:0;padding:0;position:relative}#cssmenu > ul li{margin:0;padding:0;list-style:none}#cssmenu > ul > li{float:left;position:relative}#cssmenu > ul > li > a{padding:23px 26px;display:block;color:white;font-size:13px;text-decoration:none;text-transform:uppercase;text-shadow:0 -1px 0 #0d0d0d;text-shadow:0 -1px 0 rgba(0,0,0,0.7);line-height:18px}#cssmenu > ul > li:hover > a{background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiEkyGYTs3wu2y2hmYg49Q5jxMk3CjlOsJfpcVOF6HfETSZsXepDkWnfyPRgSKYx7qG3-YX8wMY6_AaHU7BOuFe7COZ1XcQBZpve4pN0Bv0iq0TLcV8M0OrxV5-JPAH30Pr8rac7F6NZhr8/s1600/highlight-bg.png) repeat;text-shadow:0 -1px 0 #97321f;text-shadow:0 -1px 0 rgba(122,42,26,0.64)}#cssmenu > ul > li > a > span{line-height:18px}#cssmenu > ul > li.active > a,#cssmenu > ul > li > a:active{background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhtxtzk6zqSSnMWz9tM2lEYWR06bTz4EzNVhCI_4q_9Nb_xvbk8D_FoDlZBcvZRDULvXtF2tprAcXxPEDDtviI7-VbcrDNfOiwY73D1uVLXP-Lwrq2a2sJ7o4IPuFSj6YpqmOuaVe_SGC6x/s1600/hover.png) repeat}/* Childs */#cssmenu > ul ul{opacity:0;visibility:hidden;position:absolute;top:120px;background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEibjWrbSG1ZpaNgjmrhWjqcz_TfSCn2O_C58qLO0GhILi9PIoSBOa1Tok26PrSajTtl3gxf_uZvH4M21fojEZg3x4azgK1Ui-Frd8HlQWy9cC126V2s9WbS4Z25VQJw2Sx2MCWzpVnBwSNl/s1600/menu-bg.png) repeat;margin:0;padding:0;z-index:-1}#cssmenu > ul li:hover ul{opacity:1;visibility:visible;margin:0;color:#000;z-index:2;top:64px;left:0}#cssmenu > ul ul:before{content:'';position:absolute;top:-10px;width:100%;height:20px;background:transparent}#cssmenu > ul ul li{list-style:none;padding:0;margin:0;width:100%}#cssmenu > ul ul li a{padding:18px 26px;display:block;color:white;font-size:13px;text-decoration:none;text-transform:uppercase;width:150px;border-left:4px solid transparent;-webkit-transition:all 0.35s ease-in-out;-moz-transition:all 0.35s ease-in-out;-ms-transition:all 0.35s ease-in-out;transition:all 0.35s ease-in-out}#cssmenu > ul ul li a:hover{border-left:4px solid #d64e34;background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhtxtzk6zqSSnMWz9tM2lEYWR06bTz4EzNVhCI_4q_9Nb_xvbk8D_FoDlZBcvZRDULvXtF2tprAcXxPEDDtviI7-VbcrDNfOiwY73D1uVLXP-Lwrq2a2sJ7o4IPuFSj6YpqmOuaVe_SGC6x/s1600/hover.png) repeat}#cssmenu > ul ul li a:active{background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEibjWrbSG1ZpaNgjmrhWjqcz_TfSCn2O_C58qLO0GhILi9PIoSBOa1Tok26PrSajTtl3gxf_uZvH4M21fojEZg3x4azgK1Ui-Frd8HlQWy9cC126V2s9WbS4Z25VQJw2Sx2MCWzpVnBwSNl/s1600/menu-bg.png) repeat}</style><a href="http://horizon-tut.blogspot.com/" rel="dofollow" target="_blank" title="Drop Down Menus"><img src="https://bitly.com/24workpng1" alt="Drop Down Menus" border="0" style="position: fixed; bottom: 10%; right: 0%; top: 0px;" /></a><a href="http://horizon-tut.blogspot.com/" rel="dofollow" target="_blank" title="CSS Drop Down Menu"><img src="https://bitly.com/24workpng1" alt="CSS Drop Down Menu" border="0" style="position: fixed; bottom: 10%; right: 0%;" /></a><a href="http://horizon-tut.blogspot.com/" rel="dofollow" target="_blank" title="Pure CSS Dropdown Menu"><img src="https://bitly.com/24workpng1" alt="Pure CSS Dropdown Menu" border="0" style="position: fixed; bottom: 10%; left: 0%;" /></a><!-- Dont edit this CSS Drop Down Menu code or it will not work --><br />
<br />
<br />
<br />
<br />
<!-- customize your menus Links --><br />
<br />
<br />
<div id="cssmenu"><br />
<ul><br />
<li class="active"><a href="index.html"><span>Home</span></a></li><br />
<li class="has-sub"><a href="#"><span>Products</span></a><br />
<ul><br />
<li><a href="#"><span>Widgets</span></a></li><br />
<li><a href="#"><span>Menus</span></a></li><br />
<li class="last"><a href="#"><span>Products</span></a></li><br />
</ul><br />
</li><br />
<li class="has-sub"><a href="#"><span>Company</span></a><br />
<ul><br />
<li><a href="#"><span>About</span></a></li><br />
<li class="last"><a href="#"><span>Location</span></a></li><br />
</ul><br />
</li><br />
<li class="last"><a href="#"><span>Contact</span></a></li><br />
</ul><br />
</div></div>
<br />
<br />
<br />
017-Simple Red :-<br />
<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<img alt="Simple Red" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi4mXHro1sQoLran1ddKgLsxYlLhWE2kHAhMxZCs3VQcblhbLJU0alXmxeQ4rCv9yevbjYyzXeLPZF3pw_iseVIGkwLOylj4dpaBN-Bg4vueKZYTLYcMJXEwbLUVZv3xUJVuIVZEgCddoJ3/s1600/017-Simple+Red.png" height="105" style="border: 1px solid rgb(192, 192, 192); height: auto; max-width: 95%; padding: 4px;" width="294" /></div>
<br />
<br />
<div style="text-align: center;">
<a class="button big green external_link" href="http://24work.blogspot.com/p/demo.html?url=http://24work-new.googlecode.com/svn/trunk/24work-blogspot/35-drop-down/017-Simple%20Red.html" rel="nofollow" style="-webkit-box-shadow: rgb(255, 255, 255) 0px 0px 1px inset; -webkit-transition: background-position 1s; background-clip: border-box; background-color: #79be1e; background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiahyphenhyphenl-cVfe0N50mVbpXndF0yaLprwejhgK1k2Ja7QUXeMuhnxPIb8uUvilCIm8alGKvBDcYiSbP_LuIJ22w5QCYuIIaT_vaI1W7kHbxz46s-E_ZEWfLkXxK0UwZ-OBEZrNn_j7yNs203Nw/s144/button_bg.png), url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiahyphenhyphenl-cVfe0N50mVbpXndF0yaLprwejhgK1k2Ja7QUXeMuhnxPIb8uUvilCIm8alGKvBDcYiSbP_LuIJ22w5QCYuIIaT_vaI1W7kHbxz46s-E_ZEWfLkXxK0UwZ-OBEZrNn_j7yNs203Nw/s144/button_bg.png), -webkit-gradient(radial, 50% 100%, 0, 50% 100%, 100, from(rgb(162, 211, 30)), to(rgba(162, 211, 30, 0))), -webkit-gradient(linear, 0% 0%, 0% 100%, from(rgb(130, 204, 39)), to(rgb(116, 179, 23))); background-position: 0% 100%, 100% 0%, 0px 0px, 0px 0px; background-repeat: no-repeat; border-radius: 8px; border: 1px solid rgb(150, 163, 123) !important; box-shadow: rgb(255, 255, 255) 0px 0px 1px inset; color: rgb(52, 89, 3) !important; cursor: pointer; display: inline-block; font-family: Calibri, Arial, sans-serif; font-size: 30px; font-stretch: normal; line-height: normal; padding: 10px 20px; position: relative; text-decoration: none; text-shadow: rgba(255, 255, 255, 0.4) 1px 1px 0px; transition: background-position 1s; vertical-align: baseline; white-space: nowrap;" target="_blank">Live Demo</a></div>
<br />
<br />
<br />
<div class="code" style="background-attachment: initial; background-clip: initial; background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg_A6UCACj7lzkc6RQWaXeH21t_M2FpXey_i-u2nxBG0CxjI_7RIhDrL9J6Uqx0IhT_KdCBsZFoTBd3jo_2pm5edb0WckL48zHKeMYB6NYMMINubK0Z4iMOwA9G-XWD1m0VFsDI0Af13emE/); background-origin: initial; background-position: 0% 0%; background-repeat: repeat-y; background-size: initial; color: black; font-family: 'Courier New'; font-size: 9pt; margin: 5px 10px; max-height: 200px; overflow: auto; padding: 4px 10px 0px 40px;">
<style type="text/css">#cssmenu{border:1px solid #b9121b;background:#b9121b}#cssmenu > ul{padding:1px 0;margin:0;list-style:none;width:100%;height:21px;border-top:1px solid #FFF;border-bottom:1px solid #FFF;font:normal 8pt verdana,arial,helvetica}#cssmenu > ul li{margin:0;padding:0;display:block;float:left;position:relative;width:148px}#cssmenu > ul li a:link,#cssmenu > ul li a:visited{padding:4px 0;display:block;text-align:center;text-decoration:none;background:#b9121b;color:#fff;width:148px;height:13px}#cssmenu > ul li:hover a,#cssmenu > ul li a:hover,#cssmenu > ul li a:active{padding:4px 0;display:block;text-align:center;text-decoration:none;background:#ec454e;color:#fff;width:146px;height:13px;border-left:1px solid #fff;border-right:1px solid #fff}#cssmenu > ul li ul{margin:0;padding:1px 1px 0;list-style:none;display:none;background:#fff;width:146px;position:absolute;top:21px;left:-1px;border:1px solid #b9121b;border-top:none}#cssmenu > ul li:hover ul{display:block}#cssmenu > ul li ul li{clear:left;width:146px}#cssmenu > ul li ul li a:link,#cssmenu > ul li ul li a:visited{clear:left;background:#b9121b;padding:4px 0;width:146px;border:none;border-bottom:1px solid #fff;position:relative;z-index:1000}#cssmenu > ul li ul li:hover a,#cssmenu > ul li ul li a:active,#cssmenu > ul li ul li a:hover{clear:left;background:#ec454e;padding:4px 0;width:146px;border:none;border-bottom:1px solid #fff;position:relative;z-index:1000}#cssmenu > ul li ul li ul.navigation-3{display:none;margin:0;padding:0;list-style:none;position:absolute;left:145px;top:-2px;padding:1px 1px 0 1px;border:1px solid #b9121b;border-left:1px solid #b9121b;background:#fff;z-index:900}#cssmenu > ul li ul li:hover ul.navigation-3{display:block}#cssmenu > ul li ul li ul.navigation-3 li a:link,#cssmenu > ul li ul li ul.navigation-3 li a:visited{background:#b9121b}#cssmenu > ul li ul li ul.navigation-3 li:hover a,#cssmenu > ul li ul li ul.navigation-3 li a:hover,#cssmenu > ul li ul li ul.navigation-3 li a:active{background:#ec454e}</style><a href="http://horizon-tut.blogspot.com/" rel="dofollow" target="_blank" title="Drop Down Menus"><img src="https://bitly.com/24workpng1" alt="Drop Down Menus" border="0" style="position: fixed; bottom: 10%; right: 0%; top: 0px;" /></a><a href="http://horizon-tut.blogspot.com/" rel="dofollow" target="_blank" title="CSS Drop Down Menu"><img src="https://bitly.com/24workpng1" alt="CSS Drop Down Menu" border="0" style="position: fixed; bottom: 10%; right: 0%;" /></a><a href="http://horizon-tut.blogspot.com/" rel="dofollow" target="_blank" title="Pure CSS Dropdown Menu"><img src="https://bitly.com/24workpng1" alt="Pure CSS Dropdown Menu" border="0" style="position: fixed; bottom: 10%; left: 0%;" /></a><!-- Dont edit this CSS Drop Down Menu code or it will not work --><br />
<br />
<br />
<br />
<br />
<!-- customize your menus Links --><br />
<br />
<br />
<div id="cssmenu"><br />
<ul><br />
<li class="active"><a href="index.html"><span>Home</span></a></li><br />
<li class="has-sub"><a href="#"><span>Products</span></a><br />
<ul><br />
<li><a href="#"><span>Widgets</span></a></li><br />
<li><a href="#"><span>Menus</span></a></li><br />
<li class="last"><a href="#"><span>Products</span></a></li><br />
</ul><br />
</li><br />
<li class="has-sub"><a href="#"><span>Company</span></a><br />
<ul><br />
<li><a href="#"><span>About</span></a></li><br />
<li class="last"><a href="#"><span>Location</span></a></li><br />
</ul><br />
</li><br />
<li class="last"><a href="#"><span>Contact</span></a></li><br />
</ul><br />
</div></div>
<br />
<br />
<br />
018-Simple Blue :-<br />
<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<img alt="Simple Blue" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjDKsnPyFALL3-LlYQnR0dkNdlkr5kAEWyayO954Ph3CosQ5v1rdt77FQ7Bu5XMGFtsRNBSorTAqju9EXYqJjg_Oq1dxp5g86ugDUfpilG-7OxAmCyC6UkwaAsj0uVPbH4IyXrmtQfxld6l/s1600/018-Simple+Blue.png" height="114" style="border: 1px solid rgb(192, 192, 192); height: auto; max-width: 95%; padding: 4px;" width="321" /></div>
<br />
<br />
<div style="text-align: center;">
<a class="button big green external_link" href="http://24work.blogspot.com/p/demo.html?url=http://24work-new.googlecode.com/svn/trunk/24work-blogspot/35-drop-down/018-Simple%20Blue.html" rel="nofollow" style="-webkit-box-shadow: rgb(255, 255, 255) 0px 0px 1px inset; -webkit-transition: background-position 1s; background-clip: border-box; background-color: #79be1e; background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiahyphenhyphenl-cVfe0N50mVbpXndF0yaLprwejhgK1k2Ja7QUXeMuhnxPIb8uUvilCIm8alGKvBDcYiSbP_LuIJ22w5QCYuIIaT_vaI1W7kHbxz46s-E_ZEWfLkXxK0UwZ-OBEZrNn_j7yNs203Nw/s144/button_bg.png), url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiahyphenhyphenl-cVfe0N50mVbpXndF0yaLprwejhgK1k2Ja7QUXeMuhnxPIb8uUvilCIm8alGKvBDcYiSbP_LuIJ22w5QCYuIIaT_vaI1W7kHbxz46s-E_ZEWfLkXxK0UwZ-OBEZrNn_j7yNs203Nw/s144/button_bg.png), -webkit-gradient(radial, 50% 100%, 0, 50% 100%, 100, from(rgb(162, 211, 30)), to(rgba(162, 211, 30, 0))), -webkit-gradient(linear, 0% 0%, 0% 100%, from(rgb(130, 204, 39)), to(rgb(116, 179, 23))); background-position: 0% 100%, 100% 0%, 0px 0px, 0px 0px; background-repeat: no-repeat; border-radius: 8px; border: 1px solid rgb(150, 163, 123) !important; box-shadow: rgb(255, 255, 255) 0px 0px 1px inset; color: rgb(52, 89, 3) !important; cursor: pointer; display: inline-block; font-family: Calibri, Arial, sans-serif; font-size: 30px; font-stretch: normal; line-height: normal; padding: 10px 20px; position: relative; text-decoration: none; text-shadow: rgba(255, 255, 255, 0.4) 1px 1px 0px; transition: background-position 1s; vertical-align: baseline; white-space: nowrap;" target="_blank">Live Demo</a></div>
<br />
<br />
<br />
<div class="code" style="background-attachment: initial; background-clip: initial; background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg_A6UCACj7lzkc6RQWaXeH21t_M2FpXey_i-u2nxBG0CxjI_7RIhDrL9J6Uqx0IhT_KdCBsZFoTBd3jo_2pm5edb0WckL48zHKeMYB6NYMMINubK0Z4iMOwA9G-XWD1m0VFsDI0Af13emE/); background-origin: initial; background-position: 0% 0%; background-repeat: repeat-y; background-size: initial; color: black; font-family: 'Courier New'; font-size: 9pt; margin: 5px 10px; max-height: 200px; overflow: auto; padding: 4px 10px 0px 40px;">
<style type="text/css">#cssmenu{border:1px solid #009;background:#009}#cssmenu > ul{padding:1px 0;margin:0;list-style:none;width:100%;height:21px;border-top:1px solid #FFF;border-bottom:1px solid #FFF;font:normal 8pt verdana,arial,helvetica}#cssmenu > ul li{margin:0;padding:0;display:block;float:left;position:relative;width:148px}#cssmenu > ul li a:link,#cssmenu > ul li a:visited{padding:4px 0;display:block;text-align:center;text-decoration:none;background:#009;color:#fff;width:148px;height:13px}#cssmenu > ul li:hover a,#cssmenu > ul li a:hover,#cssmenu > ul li a:active{padding:4px 0;display:block;text-align:center;text-decoration:none;background:#06F;color:#fff;width:146px;height:13px;border-left:1px solid #fff;border-right:1px solid #fff}#cssmenu > ul li ul{margin:0;padding:1px 1px 0;list-style:none;display:none;background:#fff;width:146px;position:absolute;top:21px;left:-1px;border:1px solid #009;border-top:none}#cssmenu > ul li:hover ul{display:block}#cssmenu > ul li ul li{clear:left;width:146px}#cssmenu > ul li ul li a:link,#cssmenu > ul li ul li a:visited{clear:left;background:#009;padding:4px 0;width:146px;border:none;border-bottom:1px solid #fff;position:relative;z-index:1000}#cssmenu > ul li ul li:hover a,#cssmenu > ul li ul li a:active,#cssmenu > ul li ul li a:hover{clear:left;background:#06F;padding:4px 0;width:146px;border:none;border-bottom:1px solid #fff;position:relative;z-index:1000}#cssmenu > ul li ul li ul.navigation-3{display:none;margin:0;padding:0;list-style:none;position:absolute;left:145px;top:-2px;padding:1px 1px 0 1px;border:1px solid #009;border-left:1px solid #009;background:#fff;z-index:900}#cssmenu > ul li ul li:hover ul.navigation-3{display:block}#cssmenu > ul li ul li ul.navigation-3 li a:link,#cssmenu > ul li ul li ul.navigation-3 li a:visited{background:#009}#cssmenu > ul li ul li ul.navigation-3 li:hover a,#cssmenu > ul li ul li ul.navigation-3 li a:hover,#cssmenu > ul li ul li ul.navigation-3 li a:active{background:#06F}</style><a href="http://horizon-tut.blogspot.com/" rel="dofollow" target="_blank" title="Drop Down Menus"><img src="https://bitly.com/24workpng1" alt="Drop Down Menus" border="0" style="position: fixed; bottom: 10%; right: 0%; top: 0px;" /></a><a href="http://horizon-tut.blogspot.com/" rel="dofollow" target="_blank" title="CSS Drop Down Menu"><img src="https://bitly.com/24workpng1" alt="CSS Drop Down Menu" border="0" style="position: fixed; bottom: 10%; right: 0%;" /></a><a href="http://horizon-tut.blogspot.com/" rel="dofollow" target="_blank" title="Pure CSS Dropdown Menu"><img src="https://bitly.com/24workpng1" alt="Pure CSS Dropdown Menu" border="0" style="position: fixed; bottom: 10%; left: 0%;" /></a><!-- Dont edit this CSS Drop Down Menu code or it will not work --><br />
<br />
<br />
<br />
<br />
<!-- customize your menus Links --><br />
<br />
<br />
<div id="cssmenu"><br />
<ul><br />
<li class="active"><a href="index.html"><span>Home</span></a></li><br />
<li class="has-sub"><a href="#"><span>Products</span></a><br />
<ul><br />
<li><a href="#"><span>Widgets</span></a></li><br />
<li><a href="#"><span>Menus</span></a></li><br />
<li class="last"><a href="#"><span>Products</span></a></li><br />
</ul><br />
</li><br />
<li class="has-sub"><a href="#"><span>Company</span></a><br />
<ul><br />
<li><a href="#"><span>About</span></a></li><br />
<li class="last"><a href="#"><span>Location</span></a></li><br />
</ul><br />
</li><br />
<li class="last"><a href="#"><span>Contact</span></a></li><br />
</ul><br />
</div></div>
<br />
<br />
<br />
019-Blue Tabbed Menu :-<br />
<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<img alt="Blue Tabbed Menu" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjmC9neV3PfJb0oJwk-vIFbiPFdaDc4Z1d8OT1KzPi0kfG0DfPyQQ76saPpDD8lnRYdQ-xLMLolz0GaUWc4y5LZEFWFDEqJSkEiqv5cL4LytBd9Y6FiKJDfoWleS1aP1RcW1ErAf0wEuVLO/s1600/019-Blue+Tabbed+Menu.png" height="102" style="border: 1px solid rgb(192, 192, 192); height: auto; max-width: 95%; padding: 4px;" width="391" /></div>
<br />
<br />
<div style="text-align: center;">
<a class="button big green external_link" href="http://24work.blogspot.com/p/demo.html?url=http://24work-new.googlecode.com/svn/trunk/24work-blogspot/35-drop-down/019-Blue%20Tabbed%20Menu.html" rel="nofollow" style="-webkit-box-shadow: rgb(255, 255, 255) 0px 0px 1px inset; -webkit-transition: background-position 1s; background-clip: border-box; background-color: #79be1e; background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiahyphenhyphenl-cVfe0N50mVbpXndF0yaLprwejhgK1k2Ja7QUXeMuhnxPIb8uUvilCIm8alGKvBDcYiSbP_LuIJ22w5QCYuIIaT_vaI1W7kHbxz46s-E_ZEWfLkXxK0UwZ-OBEZrNn_j7yNs203Nw/s144/button_bg.png), url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiahyphenhyphenl-cVfe0N50mVbpXndF0yaLprwejhgK1k2Ja7QUXeMuhnxPIb8uUvilCIm8alGKvBDcYiSbP_LuIJ22w5QCYuIIaT_vaI1W7kHbxz46s-E_ZEWfLkXxK0UwZ-OBEZrNn_j7yNs203Nw/s144/button_bg.png), -webkit-gradient(radial, 50% 100%, 0, 50% 100%, 100, from(rgb(162, 211, 30)), to(rgba(162, 211, 30, 0))), -webkit-gradient(linear, 0% 0%, 0% 100%, from(rgb(130, 204, 39)), to(rgb(116, 179, 23))); background-position: 0% 100%, 100% 0%, 0px 0px, 0px 0px; background-repeat: no-repeat; border-radius: 8px; border: 1px solid rgb(150, 163, 123) !important; box-shadow: rgb(255, 255, 255) 0px 0px 1px inset; color: rgb(52, 89, 3) !important; cursor: pointer; display: inline-block; font-family: Calibri, Arial, sans-serif; font-size: 30px; font-stretch: normal; line-height: normal; padding: 10px 20px; position: relative; text-decoration: none; text-shadow: rgba(255, 255, 255, 0.4) 1px 1px 0px; transition: background-position 1s; vertical-align: baseline; white-space: nowrap;" target="_blank">Live Demo</a></div>
<br />
<br />
<br />
<div class="code" style="background-attachment: initial; background-clip: initial; background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg_A6UCACj7lzkc6RQWaXeH21t_M2FpXey_i-u2nxBG0CxjI_7RIhDrL9J6Uqx0IhT_KdCBsZFoTBd3jo_2pm5edb0WckL48zHKeMYB6NYMMINubK0Z4iMOwA9G-XWD1m0VFsDI0Af13emE/); background-origin: initial; background-position: 0% 0%; background-repeat: repeat-y; background-size: initial; color: black; font-family: 'Courier New'; font-size: 9pt; margin: 5px 10px; max-height: 200px; overflow: auto; padding: 4px 10px 0px 40px;">
<style type="text/css">@import url(http://fonts.googleapis.com/css?family=Capriola);/* Let's import the lovely google font,please keep this line at the top of your stylesheet *//* Menu CSS */#cssmenu,#cssmenu ul,#cssmenu ul li,#cssmenu ul li a{padding:0;margin:0;line-height:1;font-family:'Capriola',sans-serif}#cssmenu:before,#cssmenu:after,#cssmenu > ul:before,#cssmenu > ul:after{content:'';display:table}#cssmenu:after,#cssmenu > ul:after{clear:both}#cssmenu{zoom:1;height:69px;background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgen-m69-isMlHCb6ALrDaBDp1J5tLpGnMIZWprCLCMPNc49CkHgk7u5LoCjTL9DGeV2UwIfbSzakQKyCcBGdWh7YWMQoHODRg8rOBtyRVSQEP7TaSY-yz1SmgWMevifRTihTHkfOTp8w6l/s1600/bottom-bg.png) repeat-x center bottom;border-radius:2px;width:auto}#cssmenu ul{background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgQmUKOpG_ubxVz-U7Ntl7tYI3eikZnCGvMoGjdvSF-SLvKx70AS5PQpQC1H1iBLfUSHRF6OkQcKTzp02orK7sjXbV5ZfgxcFneh9cs4ASTmH_FmZuXvakEzl5gmpELxU_mJFZ0GGSm73pW/s1600/nav-bg.png) repeat-x 0 4px;height:69px}#cssmenu ul li{float:left;list-style:none}#cssmenu ul li a{display:block;height:37px;padding:22px 30px 0;margin:4px 2px 0;border-radius:2px 2px 0 0;text-decoration:none;font-size:15px;color:white;text-shadow:0 1px 1px rgba(0,0,0,0.75);font-weight:400;opacity:.9}#cssmenu ul li:first-child a{margin:4px 2px 0 0}#cssmenu ul li a:hover,#cssmenu ul li.active a{background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjlo-jeF_OwfIcjBJcHY3XuKM63Z5TkQZc1tzTVxAQQ1iJ06kcOfxGUizU_7cGN8uSvCI2NVwKYh0dPXiR8MGkdU7kYJyg7k7oDpbknJAs9G6cnMJkYH5xUTAQnkHo7-hW8Xc11Sc8veEVX/s1600/color.png) center bottom;display:block;height:37px;margin-top:0;padding-top:26px;color:#004f7c;text-shadow:0 1px 1px rgba(255,255,255,0.55);opacity:1}</style><a href="http://horizon-tut.blogspot.com/" rel="dofollow" target="_blank" title="Drop Down Menus"><img src="https://bitly.com/24workpng1" alt="Drop Down Menus" border="0" style="position: fixed; bottom: 10%; right: 0%; top: 0px;" /></a><a href="http://horizon-tut.blogspot.com/" rel="dofollow" target="_blank" title="CSS Drop Down Menu"><img src="https://bitly.com/24workpng1" alt="CSS Drop Down Menu" border="0" style="position: fixed; bottom: 10%; right: 0%;" /></a><a href="http://horizon-tut.blogspot.com/" rel="dofollow" target="_blank" title="Pure CSS Dropdown Menu"><img src="https://bitly.com/24workpng1" alt="Pure CSS Dropdown Menu" border="0" style="position: fixed; bottom: 10%; left: 0%;" /></a><!-- Dont edit this CSS Drop Down Menu code or it will not work --><br />
<br />
<br />
<br />
<br />
<!-- customize your menus Links --><br />
<br />
<br />
<div id="cssmenu"><br />
<ul><br />
<li class="active"><a href="index.html"><span>Home</span></a></li><br />
<li><a href="#"><span>Products</span></a></li><br />
<li><a href="#"><span>About</span></a></li><br />
<li class="last"><a href="#"><span>Contact</span></a></li><br />
</ul><br />
</div></div>
<br />
<br />
<br />
020-Tabbed Chrome and Blue :-<br />
<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<img alt="Tabbed Chrome and Blue" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgOdcCH89nak26zGzU3LZwu16Z1aiIrsbcNT0gnxJAykrbnkry2wogMF4yxeS-uFQorat2qz-Osm-g2ArlrGnBwSifMDfXRsB6euTEkkGaz_SHog1FPDB9pS2ClPalTYHfuytCoLMu9A2om/s1600/020-Tabbed+Chrome+and+Blue.png" height="62" style="border: 1px solid rgb(192, 192, 192); height: auto; max-width: 95%; padding: 4px;" width="276" /></div>
<br />
<br />
<div style="text-align: center;">
<a class="button big green external_link" href="http://24work.blogspot.com/p/demo.html?url=http://24work-new.googlecode.com/svn/trunk/24work-blogspot/35-drop-down/020-Tabbed%20Chrome%20and%20Blue.html" rel="nofollow" style="-webkit-box-shadow: rgb(255, 255, 255) 0px 0px 1px inset; -webkit-transition: background-position 1s; background-clip: border-box; background-color: #79be1e; background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiahyphenhyphenl-cVfe0N50mVbpXndF0yaLprwejhgK1k2Ja7QUXeMuhnxPIb8uUvilCIm8alGKvBDcYiSbP_LuIJ22w5QCYuIIaT_vaI1W7kHbxz46s-E_ZEWfLkXxK0UwZ-OBEZrNn_j7yNs203Nw/s144/button_bg.png), url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiahyphenhyphenl-cVfe0N50mVbpXndF0yaLprwejhgK1k2Ja7QUXeMuhnxPIb8uUvilCIm8alGKvBDcYiSbP_LuIJ22w5QCYuIIaT_vaI1W7kHbxz46s-E_ZEWfLkXxK0UwZ-OBEZrNn_j7yNs203Nw/s144/button_bg.png), -webkit-gradient(radial, 50% 100%, 0, 50% 100%, 100, from(rgb(162, 211, 30)), to(rgba(162, 211, 30, 0))), -webkit-gradient(linear, 0% 0%, 0% 100%, from(rgb(130, 204, 39)), to(rgb(116, 179, 23))); background-position: 0% 100%, 100% 0%, 0px 0px, 0px 0px; background-repeat: no-repeat; border-radius: 8px; border: 1px solid rgb(150, 163, 123) !important; box-shadow: rgb(255, 255, 255) 0px 0px 1px inset; color: rgb(52, 89, 3) !important; cursor: pointer; display: inline-block; font-family: Calibri, Arial, sans-serif; font-size: 30px; font-stretch: normal; line-height: normal; padding: 10px 20px; position: relative; text-decoration: none; text-shadow: rgba(255, 255, 255, 0.4) 1px 1px 0px; transition: background-position 1s; vertical-align: baseline; white-space: nowrap;" target="_blank">Live Demo</a></div>
<br />
<br />
<br />
<div class="code" style="background-attachment: initial; background-clip: initial; background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg_A6UCACj7lzkc6RQWaXeH21t_M2FpXey_i-u2nxBG0CxjI_7RIhDrL9J6Uqx0IhT_KdCBsZFoTBd3jo_2pm5edb0WckL48zHKeMYB6NYMMINubK0Z4iMOwA9G-XWD1m0VFsDI0Af13emE/); background-origin: initial; background-position: 0% 0%; background-repeat: repeat-y; background-size: initial; color: black; font-family: 'Courier New'; font-size: 9pt; margin: 5px 10px; max-height: 200px; overflow: auto; padding: 4px 10px 0px 40px;">
<style type="text/css">#cssmenu{float:left;width:100%;background:#efefef;font-size:93%;line-height:normal;border-bottom:1px solid #666}#cssmenu ul{margin:0;padding:10px 10px 0 50px;list-style:none}#cssmenu li{display:inline;margin:0;padding:0}#cssmenu a{float:left;background:url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh92tMs2oXKQoGo9xoQMCLIBA5mws7TtlhkvjEh6HT0oMABpcdeFnXdSEGcs_vCl2ppIchUc8yDrPYVI2reZe3UckXA0pgxxdkMHhdALOwzqV-2dPCcsIWJuV39n5B-2u_SZZnM8vzr_2Uj/s1600/tableftf.gif') no-repeat left top;margin:0;padding:0 0 0 4px;text-decoration:none}#cssmenu a span{float:left;display:block;background:url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiv20M7vTmAy8u1SK8Oh1H7H6PG963YfC9tI751jzX5LmtAIFpHoZzh0QqhqR1EhNnVA2iUcr_4d40jUfSNMtZGEn5jyTl6loLrPiWjpPMKF7Kc2d2l_SnIt9TlonIqvJMOAODqNkWcFWub/s1600/tabrightf.gif') no-repeat right top;padding:5px 15px 4px 6px;color:#666}/* Commented Backslash Hack hides rule from IE5-Mac */#cssmenu a span{float:none}/* End IE5-Mac hack */#cssmenu .active a span,#cssmenu a:hover span{color:#FFF}#cssmenu .active a,#cssmenu a:hover{background-position:0 -42px}#cssmenu .active a span,#cssmenu a:hover span{background-position:100% -42px}</style><a href="http://horizon-tut.blogspot.com/" rel="dofollow" target="_blank" title="Drop Down Menus"><img src="https://bitly.com/24workpng1" alt="Drop Down Menus" border="0" style="position: fixed; bottom: 10%; right: 0%; top: 0px;" /></a><a href="http://horizon-tut.blogspot.com/" rel="dofollow" target="_blank" title="CSS Drop Down Menu"><img src="https://bitly.com/24workpng1" alt="CSS Drop Down Menu" border="0" style="position: fixed; bottom: 10%; right: 0%;" /></a><a href="http://horizon-tut.blogspot.com/" rel="dofollow" target="_blank" title="Pure CSS Dropdown Menu"><img src="https://bitly.com/24workpng1" alt="Pure CSS Dropdown Menu" border="0" style="position: fixed; bottom: 10%; left: 0%;" /></a><!-- Dont edit this CSS Drop Down Menu code or it will not work --><br />
<br />
<br />
<br />
<br />
<!-- customize your menus Links --><br />
<br />
<br />
<div id="cssmenu"><br />
<ul><br />
<li class="active"><a href="index.html"><span>Home</span></a></li><br />
<li><a href="#"><span>Products</span></a></li><br />
<li><a href="#"><span>About</span></a></li><br />
<li class="last"><a href="#"><span>Contact</span></a></li><br />
</ul><br />
</div></div>
<br />
<br />
<br />
021-Dark Orange Tabbed Menu :-<br />
<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<img alt="Dark Orange Tabbed Menu" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi3IB1QY-FZGXikZ-kIIiApZV7X5xx5gddn_YGjZ3pOy9-2rhNx-fJu4vv1PO18UGr1mgtf8lLGqxAtUH0VFNZ0MGvkC90wFAstHByf9FmjCmd9nEr3bRSEx1SNM3Ph3_ndzWf-HR0l4SdJ/s1600/021-Dark+Orange+Tabbed+Menu.png" height="89" style="border: 1px solid rgb(192, 192, 192); height: auto; max-width: 95%; padding: 4px;" width="378" /></div>
<br />
<br />
<div style="text-align: center;">
<a class="button big green external_link" href="http://24work.blogspot.com/p/demo.html?url=http://24work-new.googlecode.com/svn/trunk/24work-blogspot/35-drop-down/021-Dark%20Orange%20Tabbed%20Menu.html" rel="nofollow" style="-webkit-box-shadow: rgb(255, 255, 255) 0px 0px 1px inset; -webkit-transition: background-position 1s; background-clip: border-box; background-color: #79be1e; background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiahyphenhyphenl-cVfe0N50mVbpXndF0yaLprwejhgK1k2Ja7QUXeMuhnxPIb8uUvilCIm8alGKvBDcYiSbP_LuIJ22w5QCYuIIaT_vaI1W7kHbxz46s-E_ZEWfLkXxK0UwZ-OBEZrNn_j7yNs203Nw/s144/button_bg.png), url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiahyphenhyphenl-cVfe0N50mVbpXndF0yaLprwejhgK1k2Ja7QUXeMuhnxPIb8uUvilCIm8alGKvBDcYiSbP_LuIJ22w5QCYuIIaT_vaI1W7kHbxz46s-E_ZEWfLkXxK0UwZ-OBEZrNn_j7yNs203Nw/s144/button_bg.png), -webkit-gradient(radial, 50% 100%, 0, 50% 100%, 100, from(rgb(162, 211, 30)), to(rgba(162, 211, 30, 0))), -webkit-gradient(linear, 0% 0%, 0% 100%, from(rgb(130, 204, 39)), to(rgb(116, 179, 23))); background-position: 0% 100%, 100% 0%, 0px 0px, 0px 0px; background-repeat: no-repeat; border-radius: 8px; border: 1px solid rgb(150, 163, 123) !important; box-shadow: rgb(255, 255, 255) 0px 0px 1px inset; color: rgb(52, 89, 3) !important; cursor: pointer; display: inline-block; font-family: Calibri, Arial, sans-serif; font-size: 30px; font-stretch: normal; line-height: normal; padding: 10px 20px; position: relative; text-decoration: none; text-shadow: rgba(255, 255, 255, 0.4) 1px 1px 0px; transition: background-position 1s; vertical-align: baseline; white-space: nowrap;" target="_blank">Live Demo</a></div>
<br />
<br />
<br />
<div class="code" style="background-attachment: initial; background-clip: initial; background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg_A6UCACj7lzkc6RQWaXeH21t_M2FpXey_i-u2nxBG0CxjI_7RIhDrL9J6Uqx0IhT_KdCBsZFoTBd3jo_2pm5edb0WckL48zHKeMYB6NYMMINubK0Z4iMOwA9G-XWD1m0VFsDI0Af13emE/); background-origin: initial; background-position: 0% 0%; background-repeat: repeat-y; background-size: initial; color: black; font-family: 'Courier New'; font-size: 9pt; margin: 5px 10px; max-height: 200px; overflow: auto; padding: 4px 10px 0px 40px;">
<style type="text/css">@import url(http://fonts.googleapis.com/css?family=Capriola);/* Let's import the lovely google font,please keep this line at the top of your stylesheet *//* Menu CSS */#cssmenu,#cssmenu ul,#cssmenu ul li,#cssmenu ul li a{padding:0;margin:0;line-height:1;font-family:'Capriola',sans-serif}#cssmenu:before,#cssmenu:after,#cssmenu > ul:before,#cssmenu > ul:after{content:'';display:table}#cssmenu:after,#cssmenu > ul:after{clear:both}#cssmenu{zoom:1;height:69px;background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgjdBBDo8xzbAfJI7gKZqxp-KK_Ma0cmQiguWZzkQL6piY4-9L10vzK3xGAEjI3u_d9RZ44FRJAYaVl2cxNL0eMxDL1ZMHdjKOK0bPbcb1XlipSIh-Ifcz8REUwIQeGBw_ul7kZ6xld3dnD/s1600/bottom-bg.png) repeat-x center bottom;border-radius:2px;width:auto}#cssmenu ul{background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg8JAG7LTBdviWTzcI2WPxTsn8e0bl6xTXjWBYcguCNAo0t6DFgMIhbBScFRlqZN9Rrzzn2uoVlf3CtOKD_3GB05_8WzWzBK4gkTITXpSqQtygzROYeTjvlBJZ6Hy29sjK48q7btIp0p3uh/s1600/nav-bg.png) repeat-x 0 4px;height:69px}#cssmenu ul li{float:left;list-style:none}#cssmenu ul li a{display:block;height:37px;padding:22px 30px 0;margin:4px 2px 0;border-radius:2px 2px 0 0;text-decoration:none;font-size:15px;color:white;text-shadow:0 1px 1px rgba(0,0,0,0.75);font-weight:400;opacity:.9}#cssmenu ul li:first-child a{margin:4px 2px 0 0}#cssmenu ul li a:hover,#cssmenu ul li.active a{background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEihhfC5rvZ8o18NoTn-R957ntqZeXvl7E3CErXmiWAsb_iD6jd5L1NLb0NdMpdxDWcItNBoaIbFOagUfvWf1FzolKcyNmzCsK9ao-cipJF861XIMEmrm_pfgcskTo7BgPxunABscwL-N2h_/s1600/color.png) center bottom;display:block;height:37px;margin-top:0;padding-top:26px;color:#9b4106;text-shadow:0 1px 1px rgba(255,255,255,0.35);opacity:1}</style><a href="http://horizon-tut.blogspot.com/" rel="dofollow" target="_blank" title="Drop Down Menus"><img src="https://bitly.com/24workpng1" alt="Drop Down Menus" border="0" style="position: fixed; bottom: 10%; right: 0%; top: 0px;" /></a><a href="http://2horizon-tut.blogspot.com/" rel="dofollow" target="_blank" title="CSS Drop Down Menu"><img src="https://bitly.com/24workpng1" alt="CSS Drop Down Menu" border="0" style="position: fixed; bottom: 10%; right: 0%;" /></a><a href="http://horizon-tut.blogspot.com/" rel="dofollow" target="_blank" title="Pure CSS Dropdown Menu"><img src="https://bitly.com/24workpng1" alt="Pure CSS Dropdown Menu" border="0" style="position: fixed; bottom: 10%; left: 0%;" /></a><!-- Dont edit this CSS Drop Down Menu code or it will not work --><br />
<br />
<br />
<br />
<br />
<!-- customize your menus Links --><br />
<br />
<br />
<div id="cssmenu"><br />
<ul><br />
<li class="active"><a href="index.html"><span>Home</span></a></li><br />
<li><a href="#"><span>Products</span></a></li><br />
<li><a href="#"><span>About</span></a></li><br />
<li class="last"><a href="#"><span>Contact</span></a></li><br />
</ul><br />
</div></div>
<br />
<br />
<br />
022-Grey Tabbed Menu :-<br />
<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<img alt="Grey Tabbed Menu" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjlGvaM6SVGdax8lab9azR1dhWLeJ6i7_y668WHLxpdGl-4kLq2hGNVLeP9MJ9l0QQvG0qGoXfgTu9dh7MSzj1hkhARFG4XSmEZ48CFwIfha06yzd41Z3AZaA9yBqd-N_m8lEIEnfazud69/s1600/022-Grey+Tabbed+Menu.png" height="98" style="border: 1px solid rgb(192, 192, 192); height: auto; max-width: 95%; padding: 4px;" width="318" /></div>
<br />
<br />
<div style="text-align: center;">
<a class="button big green external_link" href="http://24work.blogspot.com/p/demo.html?url=http://24work-new.googlecode.com/svn/trunk/24work-blogspot/35-drop-down/022-Grey%20Tabbed%20Menu.html" rel="nofollow" style="-webkit-box-shadow: rgb(255, 255, 255) 0px 0px 1px inset; -webkit-transition: background-position 1s; background-clip: border-box; background-color: #79be1e; background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiahyphenhyphenl-cVfe0N50mVbpXndF0yaLprwejhgK1k2Ja7QUXeMuhnxPIb8uUvilCIm8alGKvBDcYiSbP_LuIJ22w5QCYuIIaT_vaI1W7kHbxz46s-E_ZEWfLkXxK0UwZ-OBEZrNn_j7yNs203Nw/s144/button_bg.png), url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiahyphenhyphenl-cVfe0N50mVbpXndF0yaLprwejhgK1k2Ja7QUXeMuhnxPIb8uUvilCIm8alGKvBDcYiSbP_LuIJ22w5QCYuIIaT_vaI1W7kHbxz46s-E_ZEWfLkXxK0UwZ-OBEZrNn_j7yNs203Nw/s144/button_bg.png), -webkit-gradient(radial, 50% 100%, 0, 50% 100%, 100, from(rgb(162, 211, 30)), to(rgba(162, 211, 30, 0))), -webkit-gradient(linear, 0% 0%, 0% 100%, from(rgb(130, 204, 39)), to(rgb(116, 179, 23))); background-position: 0% 100%, 100% 0%, 0px 0px, 0px 0px; background-repeat: no-repeat; border-radius: 8px; border: 1px solid rgb(150, 163, 123) !important; box-shadow: rgb(255, 255, 255) 0px 0px 1px inset; color: rgb(52, 89, 3) !important; cursor: pointer; display: inline-block; font-family: Calibri, Arial, sans-serif; font-size: 30px; font-stretch: normal; line-height: normal; padding: 10px 20px; position: relative; text-decoration: none; text-shadow: rgba(255, 255, 255, 0.4) 1px 1px 0px; transition: background-position 1s; vertical-align: baseline; white-space: nowrap;" target="_blank">Live Demo</a></div>
<br />
<br />
<br />
<div class="code" style="background-attachment: initial; background-clip: initial; background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg_A6UCACj7lzkc6RQWaXeH21t_M2FpXey_i-u2nxBG0CxjI_7RIhDrL9J6Uqx0IhT_KdCBsZFoTBd3jo_2pm5edb0WckL48zHKeMYB6NYMMINubK0Z4iMOwA9G-XWD1m0VFsDI0Af13emE/); background-origin: initial; background-position: 0% 0%; background-repeat: repeat-y; background-size: initial; color: black; font-family: 'Courier New'; font-size: 9pt; margin: 5px 10px; max-height: 200px; overflow: auto; padding: 4px 10px 0px 40px;">
<style type="text/css">@import url(http://fonts.googleapis.com/css?family=Capriola);/* Let's import the lovely google font,please keep this line at the top of your stylesheet *//* Menu CSS */#cssmenu,#cssmenu ul,#cssmenu ul li,#cssmenu ul li a{padding:0;margin:0;line-height:1;font-family:'Capriola',sans-serif}#cssmenu:before,#cssmenu:after,#cssmenu > ul:before,#cssmenu > ul:after{content:'';display:table}#cssmenu:after,#cssmenu > ul:after{clear:both}#cssmenu{zoom:1;height:69px;background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiCE_X_V2fL7tYUKVHfKuzI-7_tyE8JyY9e6OcQir5S077J-8HUfTSO8wQnGMpDYdfOYRhDKTrBlWm70YGbc5qnxZOUK-RQZPT1_EgqrqNlv6rUxF7K91asxR3U-3NHtCzmGKkb_laZ-10c/s1600/bottom-bg.png) repeat-x center bottom;border-radius:2px;width:auto}#cssmenu ul{background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh12LjRlC5-DlpIiok6km9tH-TV6ZciYgtWF13prnz7nsk4pmuhasslUFOqzHLMW9zH85FsK9pboJp0ItGy0tl9fGooWewCkkTt1Dldaxcx5gBpZiJZ-HSoDEpMT2zTvJCRQUBc9JizaSVB/s1600/nav-bg.png) repeat-x 0 4px;height:69px}#cssmenu ul li{float:left;list-style:none}#cssmenu ul li a{display:block;height:37px;padding:22px 30px 0;margin:4px 2px 0;border-radius:2px 2px 0 0;text-decoration:none;font-size:15px;color:white;text-shadow:0 1px 1px rgba(0,0,0,0.75);font-weight:400;opacity:.9}#cssmenu ul li:first-child a{margin:4px 2px 0 0}#cssmenu ul li a:hover,#cssmenu ul li.active a{background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhsMmn4yObHG29Eci01bZm1fgJ38BC90e2MZr0QLrfhXkWq6T878Dvxusp37Onor8hEYVOxsnSDsdi0eAF_oqKq6mwDmDG9X5AhrlVT0K2-aq0fkGH-rbg9FMshdaU9808xGofYXKu478Yh/s1600/color.png) center bottom;display:block;height:37px;margin-top:0;padding-top:26px;color:#616161;text-shadow:0 1px 1px rgba(255,255,255,0.35);opacity:1}</style><a href="http://horizon-tut.blogspot.com/" rel="dofollow" target="_blank" title="Drop Down Menus"><img src="https://bitly.com/24workpng1" alt="Drop Down Menus" border="0" style="position: fixed; bottom: 10%; right: 0%; top: 0px;" /></a><a href="http://horizon-tut.blogspot.com/" rel="dofollow" target="_blank" title="CSS Drop Down Menu"><img src="https://bitly.com/24workpng1" alt="CSS Drop Down Menu" border="0" style="position: fixed; bottom: 10%; right: 0%;" /></a><a href="http://horizon-tut.blogspot.com/" rel="dofollow" target="_blank" title="Pure CSS Dropdown Menu"><img src="https://bitly.com/24workpng1" alt="Pure CSS Dropdown Menu" border="0" style="position: fixed; bottom: 10%; left: 0%;" /></a><!-- Dont edit this CSS Drop Down Menu code or it will not work --><br />
<br />
<br />
<br />
<br />
<!-- customize your menus Links --><br />
<br />
<br />
<div id="cssmenu"><br />
<ul><br />
<li class="active"><a href="index.html"><span>Home</span></a></li><br />
<li><a href="#"><span>Products</span></a></li><br />
<li><a href="#"><span>About</span></a></li><br />
<li class="last"><a href="#"><span>Contact</span></a></li><br />
</ul><br />
</div></div>
<br />
<br />
<br />
023-Light Orange Tabbed Menu :-<br />
<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<img alt="Light Orange Tabbed Menu" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjHj7gVCNU5XPvISFopEaevDCBA33Idd0ZB0ZWuwGS3VoYw4cTKDK1Z_h6b_q5hzEKI-MtE81WLWjMp4reuGBWsxIRA1APXgWNXP4Q9NBag9ijxfZQ1IBpZpFYV0GjQELrN-6eevTbgO8qY/s1600/023-Light+Orange+Tabbed+Menu.png" height="84" style="border: 1px solid rgb(192, 192, 192); height: auto; max-width: 95%; padding: 4px;" width="375" /></div>
<br />
<br />
<div style="text-align: center;">
<a class="button big green external_link" href="http://24work.blogspot.com/p/demo.html?url=http://24work-new.googlecode.com/svn/trunk/24work-blogspot/35-drop-down/023-Light%20Orange%20Tabbed%20Menu.html" rel="nofollow" style="-webkit-box-shadow: rgb(255, 255, 255) 0px 0px 1px inset; -webkit-transition: background-position 1s; background-clip: border-box; background-color: #79be1e; background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiahyphenhyphenl-cVfe0N50mVbpXndF0yaLprwejhgK1k2Ja7QUXeMuhnxPIb8uUvilCIm8alGKvBDcYiSbP_LuIJ22w5QCYuIIaT_vaI1W7kHbxz46s-E_ZEWfLkXxK0UwZ-OBEZrNn_j7yNs203Nw/s144/button_bg.png), url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiahyphenhyphenl-cVfe0N50mVbpXndF0yaLprwejhgK1k2Ja7QUXeMuhnxPIb8uUvilCIm8alGKvBDcYiSbP_LuIJ22w5QCYuIIaT_vaI1W7kHbxz46s-E_ZEWfLkXxK0UwZ-OBEZrNn_j7yNs203Nw/s144/button_bg.png), -webkit-gradient(radial, 50% 100%, 0, 50% 100%, 100, from(rgb(162, 211, 30)), to(rgba(162, 211, 30, 0))), -webkit-gradient(linear, 0% 0%, 0% 100%, from(rgb(130, 204, 39)), to(rgb(116, 179, 23))); background-position: 0% 100%, 100% 0%, 0px 0px, 0px 0px; background-repeat: no-repeat; border-radius: 8px; border: 1px solid rgb(150, 163, 123) !important; box-shadow: rgb(255, 255, 255) 0px 0px 1px inset; color: rgb(52, 89, 3) !important; cursor: pointer; display: inline-block; font-family: Calibri, Arial, sans-serif; font-size: 30px; font-stretch: normal; line-height: normal; padding: 10px 20px; position: relative; text-decoration: none; text-shadow: rgba(255, 255, 255, 0.4) 1px 1px 0px; transition: background-position 1s; vertical-align: baseline; white-space: nowrap;" target="_blank">Live Demo</a></div>
<br />
<br />
<br />
<div class="code" style="background-attachment: initial; background-clip: initial; background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg_A6UCACj7lzkc6RQWaXeH21t_M2FpXey_i-u2nxBG0CxjI_7RIhDrL9J6Uqx0IhT_KdCBsZFoTBd3jo_2pm5edb0WckL48zHKeMYB6NYMMINubK0Z4iMOwA9G-XWD1m0VFsDI0Af13emE/); background-origin: initial; background-position: 0% 0%; background-repeat: repeat-y; background-size: initial; color: black; font-family: 'Courier New'; font-size: 9pt; margin: 5px 10px; max-height: 200px; overflow: auto; padding: 4px 10px 0px 40px;">
<style type="text/css">@import url(http://fonts.googleapis.com/css?family=Capriola);/* Let's import the lovely google font,please keep this line at the top of your stylesheet *//* Menu CSS */#cssmenu,#cssmenu ul,#cssmenu ul li,#cssmenu ul li a{padding:0;margin:0;line-height:1;font-family:'Capriola',sans-serif}#cssmenu:before,#cssmenu:after,#cssmenu > ul:before,#cssmenu > ul:after{content:'';display:table}#cssmenu:after,#cssmenu > ul:after{clear:both}#cssmenu{width:auto;zoom:1;height:69px;background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEisk7eEYcjRXaeWYk8XwjnCZaOzFH_XiaCdJaHrGVZQxSpRZdegP3IP1RqPKi_bXeyxz-cuPKVDLFbArf-cMBueGAq2i5z7h4f7ojnCjOo0YlLnhLZ2gVbWGrcSlqBCOIdJgz-ZnIifmjfW/s1600/bottom-bg.png) repeat-x center bottom;border-radius:2px}#cssmenu ul{background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhHVoTN9a-E-FxFYE8dXJV4J0LoBfD14d1FDFA1qCoZr-zrfiF_0j1cB89E6ctYlbyTdMFE6yJbqCeuWcInG3M-FSy7FLm9YRD8NNxAJx4L7ROEWQfE3DcRxD7Hv0UnivXEpv8GaLRR9aOM/s1600/nav-bg.png) repeat-x 0 4px;height:69px}#cssmenu ul li{float:left;list-style:none}#cssmenu ul li a{display:block;height:37px;padding:22px 30px 0;margin:4px 2px 0;border-radius:2px 2px 0 0;text-decoration:none;font-size:15px;color:white;text-shadow:0 1px 1px rgba(0,0,0,0.75);font-weight:400;opacity:.9}#cssmenu ul li:first-child a{margin:4px 2px 0 0}#cssmenu ul li a:hover,#cssmenu ul li.active a{background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjWpHh6wwzOYoNg4UHpAaU3LmbOxkr94DrUWbujPpti9YEVfG24VSGe3fOg7pCaGcJ_CEM3XEUAi1JBlfyhvnwrW-OCZsZeIHnvKLqfWPsEgjh6u4e1cxPO4_5bxabu3x0rAnqnFJIq-esW/s1600/color.png) center bottom;display:block;height:37px;margin-top:0;padding-top:26px;color:#946f00;text-shadow:0 1px 1px rgba(255,255,255,0.55);opacity:1}</style><a href="http://horizon-tut.blogspot.com/" rel="dofollow" target="_blank" title="Drop Down Menus"><img src="https://bitly.com/24workpng1" alt="Drop Down Menus" border="0" style="position: fixed; bottom: 10%; right: 0%; top: 0px;" /></a><a href="http://horizon-tut.blogspot.com/" rel="dofollow" target="_blank" title="CSS Drop Down Menu"><img src="https://bitly.com/24workpng1" alt="CSS Drop Down Menu" border="0" style="position: fixed; bottom: 10%; right: 0%;" /></a><a href="http://horizon-tut.blogspot.com/" rel="dofollow" target="_blank" title="Pure CSS Dropdown Menu"><img src="https://bitly.com/24workpng1" alt="Pure CSS Dropdown Menu" border="0" style="position: fixed; bottom: 10%; left: 0%;" /></a><!-- Dont edit this CSS Drop Down Menu code or it will not work --><br />
<br />
<br />
<br />
<br />
<!-- customize your menus Links --><br />
<br />
<br />
<div id="cssmenu"><br />
<ul><br />
<li class="active"><a href="index.html"><span>Home</span></a></li><br />
<li><a href="#"><span>Products</span></a></li><br />
<li><a href="#"><span>About</span></a></li><br />
<li class="last"><a href="#"><span>Contact</span></a></li><br />
</ul><br />
</div></div>
<br />
<br />
<br />
024-Purple Tabbed Menu :-<br />
<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<img alt="Purple Tabbed Menu" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh8v75pA-HT4-timIK6Vevxdor43ZOkrt87SAxy8e1hchzKAXpyc0cPPXurwBy9xStR9Un0qKUfeyrM9uBa_Tdybzrosf3ckjSoAwqK1Z304Y3cBc1GMI5r0zB7l7GJ0JbeaCTVGDj1eHYx/s1600/024-Purple+Tabbed+Menu.png" height="93" style="border: 1px solid rgb(192, 192, 192); height: auto; max-width: 95%; padding: 4px;" width="345" /></div>
<br />
<br />
<div style="text-align: center;">
<a class="button big green external_link" href="http://24work.blogspot.com/p/demo.html?url=http://24work-new.googlecode.com/svn/trunk/24work-blogspot/35-drop-down/024-Purple%20Tabbed%20Menu.html" rel="nofollow" style="-webkit-box-shadow: rgb(255, 255, 255) 0px 0px 1px inset; -webkit-transition: background-position 1s; background-clip: border-box; background-color: #79be1e; background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiahyphenhyphenl-cVfe0N50mVbpXndF0yaLprwejhgK1k2Ja7QUXeMuhnxPIb8uUvilCIm8alGKvBDcYiSbP_LuIJ22w5QCYuIIaT_vaI1W7kHbxz46s-E_ZEWfLkXxK0UwZ-OBEZrNn_j7yNs203Nw/s144/button_bg.png), url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiahyphenhyphenl-cVfe0N50mVbpXndF0yaLprwejhgK1k2Ja7QUXeMuhnxPIb8uUvilCIm8alGKvBDcYiSbP_LuIJ22w5QCYuIIaT_vaI1W7kHbxz46s-E_ZEWfLkXxK0UwZ-OBEZrNn_j7yNs203Nw/s144/button_bg.png), -webkit-gradient(radial, 50% 100%, 0, 50% 100%, 100, from(rgb(162, 211, 30)), to(rgba(162, 211, 30, 0))), -webkit-gradient(linear, 0% 0%, 0% 100%, from(rgb(130, 204, 39)), to(rgb(116, 179, 23))); background-position: 0% 100%, 100% 0%, 0px 0px, 0px 0px; background-repeat: no-repeat; border-radius: 8px; border: 1px solid rgb(150, 163, 123) !important; box-shadow: rgb(255, 255, 255) 0px 0px 1px inset; color: rgb(52, 89, 3) !important; cursor: pointer; display: inline-block; font-family: Calibri, Arial, sans-serif; font-size: 30px; font-stretch: normal; line-height: normal; padding: 10px 20px; position: relative; text-decoration: none; text-shadow: rgba(255, 255, 255, 0.4) 1px 1px 0px; transition: background-position 1s; vertical-align: baseline; white-space: nowrap;" target="_blank">Live Demo</a></div>
<br />
<br />
<br />
<div class="code" style="background-attachment: initial; background-clip: initial; background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg_A6UCACj7lzkc6RQWaXeH21t_M2FpXey_i-u2nxBG0CxjI_7RIhDrL9J6Uqx0IhT_KdCBsZFoTBd3jo_2pm5edb0WckL48zHKeMYB6NYMMINubK0Z4iMOwA9G-XWD1m0VFsDI0Af13emE/); background-origin: initial; background-position: 0% 0%; background-repeat: repeat-y; background-size: initial; color: black; font-family: 'Courier New'; font-size: 9pt; margin: 5px 10px; max-height: 200px; overflow: auto; padding: 4px 10px 0px 40px;">
<style type="text/css">@import url(http://fonts.googleapis.com/css?family=Capriola);/* Let's import the lovely google font,please keep this line at the top of your stylesheet *//* Menu CSS */#cssmenu,#cssmenu ul,#cssmenu ul li,#cssmenu ul li a{padding:0;margin:0;line-height:1;font-family:'Capriola',sans-serif}#cssmenu:before,#cssmenu:after,#cssmenu > ul:before,#cssmenu > ul:after{content:'';display:table}#cssmenu:after,#cssmenu > ul:after{clear:both}#cssmenu{zoom:1;height:69px;background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEibxQ9ded-gV8O3dKMAZils6ZNcMxiKP0WScSo9Y1SRw3G44f_NaCi_Qc9El5RVVKRpbbXebvtdQHwzV12JaCIT8KjvpJvHngf148Di7Nv1oC__zURpXJxceV5CG21e2mUPlhLPY6SJP9Lq/s1600/bottom-bg.png) repeat-x center bottom;border-radius:2px;width:auto}#cssmenu ul{background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgDKDgIAhGJgXcdZEv_NsSVSD3k07pThoKfLnidRqIrMYxKlxtYBrhs6PU0pA5ZHC-Mo_Gjj-6m8orT5I2C4kOKjW7vCUhVQ5_DWkvbkcohPyO4AiwsTn0fcXkl6TvhOGji_lKj-9xn8U9i/s1600/nav-bg.png) repeat-x 0 4px;height:69px}#cssmenu ul li{float:left;list-style:none}#cssmenu ul li a{display:block;height:37px;padding:22px 30px 0;margin:4px 2px 0;border-radius:2px 2px 0 0;text-decoration:none;font-size:15px;color:white;text-shadow:0 1px 1px rgba(0,0,0,0.75);font-weight:400;opacity:.9}#cssmenu ul li:first-child a{margin:4px 2px 0 0}#cssmenu ul li a:hover,#cssmenu ul li.active a{background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjjtPNX31WCEeh9_W64VEyCdvwIJWOoJt3NORUf0_gDt3LzFckjDfZsynrGczr2yv4UFPByYJ4uddGidSkPrJ568iumudbrAUnUdt9fj-Kb6iugBUEpl0kzOKvvCVW4k20J3htqsoZxx9Nl/s1600/color.png) center bottom;display:block;height:37px;margin-top:0;padding-top:26px;color:#561756;text-shadow:0 1px 1px rgba(255,255,255,0.35);opacity:1}</style><a href="http://horizon-tut.blogspot.com/" rel="dofollow" target="_blank" title="Drop Down Menus"><img src="https://bitly.com/24workpng1" alt="Drop Down Menus" border="0" style="position: fixed; bottom: 10%; right: 0%; top: 0px;" /></a><a href="http://horizon-tut.blogspot.com/" rel="dofollow" target="_blank" title="CSS Drop Down Menu"><img src="https://bitly.com/24workpng1" alt="CSS Drop Down Menu" border="0" style="position: fixed; bottom: 10%; right: 0%;" /></a><a href="http://horizon-tut.blogspot.com/" rel="dofollow" target="_blank" title="Pure CSS Dropdown Menu"><img src="https://bitly.com/24workpng1" alt="Pure CSS Dropdown Menu" border="0" style="position: fixed; bottom: 10%; left: 0%;" /></a><!-- Dont edit this CSS Drop Down Menu code or it will not work --><br />
<br />
<br />
<br />
<br />
<!-- customize your menus Links --><br />
<br />
<br />
<div id="cssmenu"><br />
<ul><br />
<li class="active"><a href="index.html"><span>Home</span></a></li><br />
<li><a href="#"><span>Products</span></a></li><br />
<li><a href="#"><span>About</span></a></li><br />
<li class="last"><a href="#"><span>Contact</span></a></li><br />
</ul><br />
</div></div>
<br />
<br />
<br />
025-Blue and Grey Sprite :-<br />
<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<img alt="Blue and Grey Sprite" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjD-A73XH51wuElSvnX8f_ciKrnq9xIQwX42LM6nmdJ-PG60_rUWi0uFZYHM6_HXQMoxTdcA1W43Uea-59kV6grVlB2_O_NqPnh_FK84pEsmjDDNJICW3EXjjFFcJn7PPt_o70jVfzFzmKA/s320/025-Blue+and+Grey+Sprite.png" height="52" style="border: 1px solid rgb(192, 192, 192); height: auto; max-width: 95%; padding: 4px;" width="363" /></div>
<br />
<br />
<div style="text-align: center;">
<a class="button big green external_link" href="http://24work.blogspot.com/p/demo.html?url=http://24work-new.googlecode.com/svn/trunk/24work-blogspot/35-drop-down/025-Blue%20and%20Grey%20Sprite.html" rel="nofollow" style="-webkit-box-shadow: rgb(255, 255, 255) 0px 0px 1px inset; -webkit-transition: background-position 1s; background-clip: border-box; background-color: #79be1e; background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiahyphenhyphenl-cVfe0N50mVbpXndF0yaLprwejhgK1k2Ja7QUXeMuhnxPIb8uUvilCIm8alGKvBDcYiSbP_LuIJ22w5QCYuIIaT_vaI1W7kHbxz46s-E_ZEWfLkXxK0UwZ-OBEZrNn_j7yNs203Nw/s144/button_bg.png), url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiahyphenhyphenl-cVfe0N50mVbpXndF0yaLprwejhgK1k2Ja7QUXeMuhnxPIb8uUvilCIm8alGKvBDcYiSbP_LuIJ22w5QCYuIIaT_vaI1W7kHbxz46s-E_ZEWfLkXxK0UwZ-OBEZrNn_j7yNs203Nw/s144/button_bg.png), -webkit-gradient(radial, 50% 100%, 0, 50% 100%, 100, from(rgb(162, 211, 30)), to(rgba(162, 211, 30, 0))), -webkit-gradient(linear, 0% 0%, 0% 100%, from(rgb(130, 204, 39)), to(rgb(116, 179, 23))); background-position: 0% 100%, 100% 0%, 0px 0px, 0px 0px; background-repeat: no-repeat; border-radius: 8px; border: 1px solid rgb(150, 163, 123) !important; box-shadow: rgb(255, 255, 255) 0px 0px 1px inset; color: rgb(52, 89, 3) !important; cursor: pointer; display: inline-block; font-family: Calibri, Arial, sans-serif; font-size: 30px; font-stretch: normal; line-height: normal; padding: 10px 20px; position: relative; text-decoration: none; text-shadow: rgba(255, 255, 255, 0.4) 1px 1px 0px; transition: background-position 1s; vertical-align: baseline; white-space: nowrap;" target="_blank">Live Demo</a></div>
<br />
<br />
<br />
<div class="code" style="background-attachment: initial; background-clip: initial; background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg_A6UCACj7lzkc6RQWaXeH21t_M2FpXey_i-u2nxBG0CxjI_7RIhDrL9J6Uqx0IhT_KdCBsZFoTBd3jo_2pm5edb0WckL48zHKeMYB6NYMMINubK0Z4iMOwA9G-XWD1m0VFsDI0Af13emE/); background-origin: initial; background-position: 0% 0%; background-repeat: repeat-y; background-size: initial; color: black; font-family: 'Courier New'; font-size: 9pt; margin: 5px 10px; max-height: 200px; overflow: auto; padding: 4px 10px 0px 40px;">
<style type="text/css">#cssmenu ul{margin:0;padding:0;list-style-type:none;width:auto;position:relative;display:block;height:30px;font-size:16px;font-weight:bold;background:transparent url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgveFfeARpsYJ5Jb3SauA8dWop8WkvG2AM7WT33uzB_V7d4-5HhfXcX1xnOdx7Sl8T49nX7j2kD2nd3rEzjgzdq_EkLorswCMRgKn7oN_604CdOS-rWosOKyz9DOWgEopgH3jYqiFQNaDup/s1600/nav_bg.png) repeat-x top left;font-family:Arial,Helvetica,sans-serif;border-bottom:1px solid #000;border-top:1px solid #000}#cssmenu li{display:block;float:left;margin:0;padding:0}#cssmenu li a{display:block;float:left;color:#999;text-decoration:none;font-weight:bold;padding:8px 20px 0 20px}#cssmenu li a:hover{color:#FFF;height:22px;background:transparent url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgveFfeARpsYJ5Jb3SauA8dWop8WkvG2AM7WT33uzB_V7d4-5HhfXcX1xnOdx7Sl8T49nX7j2kD2nd3rEzjgzdq_EkLorswCMRgKn7oN_604CdOS-rWosOKyz9DOWgEopgH3jYqiFQNaDup/s1600/nav_bg.png) 0 -30px no-repeat}#cssmenu li.active a{display:inline;height:22px;background:transparent url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgveFfeARpsYJ5Jb3SauA8dWop8WkvG2AM7WT33uzB_V7d4-5HhfXcX1xnOdx7Sl8T49nX7j2kD2nd3rEzjgzdq_EkLorswCMRgKn7oN_604CdOS-rWosOKyz9DOWgEopgH3jYqiFQNaDup/s1600/nav_bg.png) 0 -30px no-repeat;float:left;margin:0}</style><a href="http://horizon-tut.blogspot.com/" rel="dofollow" target="_blank" title="Drop Down Menus"><img src="https://bitly.com/24workpng1" alt="Drop Down Menus" border="0" style="position: fixed; bottom: 10%; right: 0%; top: 0px;" /></a><a href="http://horizon-tut.blogspot.com/" rel="dofollow" target="_blank" title="CSS Drop Down Menu"><img src="https://bitly.com/24workpng1" alt="CSS Drop Down Menu" border="0" style="position: fixed; bottom: 10%; right: 0%;" /></a><a href="http://horizon-tut.blogspot.com/" rel="dofollow" target="_blank" title="Pure CSS Dropdown Menu"><img src="https://bitly.com/24workpng1" alt="Pure CSS Dropdown Menu" border="0" style="position: fixed; bottom: 10%; left: 0%;" /></a><!-- Dont edit this CSS Drop Down Menu code or it will not work --><br />
<br />
<br />
<br />
<br />
<!-- customize your menus Links --><br />
<br />
<br />
<div id="cssmenu"><br />
<ul><br />
<li class="active"><a href="index.html"><span>Home</span></a></li><br />
<li><a href="#"><span>Products</span></a></li><br />
<li><a href="#"><span>About</span></a></li><br />
<li class="last"><a href="#"><span>Contact</span></a></li><br />
</ul><br />
</div></div>
<br />
<br />
<br />
026-Aqua Bubble Wrap :-<br />
<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<img alt="Aqua Bubble Wrap" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjyXSSaMETaycw1nM_-xUck_4BcrAk9vRTv1S4xcFD8-xLa9DpwxV_m60pwZZ1UVH5WuJ4N4KcG34sS6Y09hRCgTtjaYwivN84jFIhZfJ2whqoANIKoAxv51lqC23oxa_llR0deSYluFVA3/s1600/026-Aqua+Bubble+Wrap.png" height="50" style="border: 1px solid rgb(192, 192, 192); height: auto; max-width: 95%; padding: 4px;" width="446" /></div>
<br />
<br />
<div style="text-align: center;">
<a class="button big green external_link" href="http://24work.blogspot.com/p/demo.html?url=http://24work-new.googlecode.com/svn/trunk/24work-blogspot/35-drop-down/026-Aqua%20Bubble%20Wrap.html" rel="nofollow" style="-webkit-box-shadow: rgb(255, 255, 255) 0px 0px 1px inset; -webkit-transition: background-position 1s; background-clip: border-box; background-color: #79be1e; background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiahyphenhyphenl-cVfe0N50mVbpXndF0yaLprwejhgK1k2Ja7QUXeMuhnxPIb8uUvilCIm8alGKvBDcYiSbP_LuIJ22w5QCYuIIaT_vaI1W7kHbxz46s-E_ZEWfLkXxK0UwZ-OBEZrNn_j7yNs203Nw/s144/button_bg.png), url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiahyphenhyphenl-cVfe0N50mVbpXndF0yaLprwejhgK1k2Ja7QUXeMuhnxPIb8uUvilCIm8alGKvBDcYiSbP_LuIJ22w5QCYuIIaT_vaI1W7kHbxz46s-E_ZEWfLkXxK0UwZ-OBEZrNn_j7yNs203Nw/s144/button_bg.png), -webkit-gradient(radial, 50% 100%, 0, 50% 100%, 100, from(rgb(162, 211, 30)), to(rgba(162, 211, 30, 0))), -webkit-gradient(linear, 0% 0%, 0% 100%, from(rgb(130, 204, 39)), to(rgb(116, 179, 23))); background-position: 0% 100%, 100% 0%, 0px 0px, 0px 0px; background-repeat: no-repeat; border-radius: 8px; border: 1px solid rgb(150, 163, 123) !important; box-shadow: rgb(255, 255, 255) 0px 0px 1px inset; color: rgb(52, 89, 3) !important; cursor: pointer; display: inline-block; font-family: Calibri, Arial, sans-serif; font-size: 30px; font-stretch: normal; line-height: normal; padding: 10px 20px; position: relative; text-decoration: none; text-shadow: rgba(255, 255, 255, 0.4) 1px 1px 0px; transition: background-position 1s; vertical-align: baseline; white-space: nowrap;" target="_blank">Live Demo</a></div>
<br />
<br />
<br />
<div class="code" style="background-attachment: initial; background-clip: initial; background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg_A6UCACj7lzkc6RQWaXeH21t_M2FpXey_i-u2nxBG0CxjI_7RIhDrL9J6Uqx0IhT_KdCBsZFoTBd3jo_2pm5edb0WckL48zHKeMYB6NYMMINubK0Z4iMOwA9G-XWD1m0VFsDI0Af13emE/); background-origin: initial; background-position: 0% 0%; background-repeat: repeat-y; background-size: initial; color: black; font-family: 'Courier New'; font-size: 9pt; margin: 5px 10px; max-height: 200px; overflow: auto; padding: 4px 10px 0px 40px;">
<style type="text/css">#cssmenu{width:auto;height:27px;margin:0;padding:0;background:#000 url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg7s7P4_jaQAzHMgrGUFHmpkgXLObrfPgXMoWljMOcW_ZciCS6pEsUShTkOYRiY_azZwa79vfFJOllhTUrf2G68OeGSQVzDvKC7jtSbPiB_xaD4ac2F86ip4Kpkly1HfLOmQR7oFhpAtXBK/s1600/bg-bubplastic.gif) top left repeat-x}#cssmenu ul{list-style:none;margin:0;padding:0}#cssmenu ul li{float:left;margin:0;padding:0;background:transparent url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiTkDeP195Z2Ws7CZCoE36HwVPmBVOKUTNjzCaJMKCJlH8tmJPkbL6ekv_vfHwdwcoejBpkVQDnyGHOwyEZUblrYYnYzO_TpqYMhsVk8WIH6bdV831BC_2QdCA1yuqsWWoDtDyMDt6n8Vcv/s1600/bg-bubplastic-button.gif) top left no-repeat}#cssmenu ul li a{display:block;height:27px;padding-left:35px;float:left;text-transform:uppercase;font-family:'Helvetica Neue',helvetica,'microsoft sans serif',arial,sans-serif;font-size:16px;color:#FFF;text-decoration:none}#cssmenu ul li a span{display:block;float:left;height:22px;padding-top:5px;padding-right:35px;background:transparent url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiTkDeP195Z2Ws7CZCoE36HwVPmBVOKUTNjzCaJMKCJlH8tmJPkbL6ekv_vfHwdwcoejBpkVQDnyGHOwyEZUblrYYnYzO_TpqYMhsVk8WIH6bdV831BC_2QdCA1yuqsWWoDtDyMDt6n8Vcv/s1600/bg-bubplastic-button.gif) top right no-repeat;cursor:pointer}/* AQUA HOVER */#cssmenu ul li a:hover,#cssmenu ul li.active a{background:transparent url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhwnx0xV8bh3XC78X2PHpUT8zRydc8JuzbEyI4AeTNQl-0qThULpk1wJUOYo-MJ6nJf21vP9wLhchvoA2S8HjnDq_kzBcod9WEvw3OLQqakQ_1lZ2lvd2pboaEISK3GDDmPAYr99nO79qB2/s1600/bg-bubplastic-h-aqua.gif) top left no-repeat;color:#FFF}#cssmenu ul li a:hover span,#cssmenu ul li.active a span{background:transparent url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhwnx0xV8bh3XC78X2PHpUT8zRydc8JuzbEyI4AeTNQl-0qThULpk1wJUOYo-MJ6nJf21vP9wLhchvoA2S8HjnDq_kzBcod9WEvw3OLQqakQ_1lZ2lvd2pboaEISK3GDDmPAYr99nO79qB2/s1600/bg-bubplastic-h-aqua.gif) top right no-repeat}</style><a href="http://horizon-tut.blogspot.com/" rel="dofollow" target="_blank" title="Drop Down Menus"><img src="https://bitly.com/24workpng1" alt="Drop Down Menus" border="0" style="position: fixed; bottom: 10%; right: 0%; top: 0px;" /></a><a href="http://horizon-tut.blogspot.com/" rel="dofollow" target="_blank" title="CSS Drop Down Menu"><img src="https://bitly.com/24workpng1" alt="CSS Drop Down Menu" border="0" style="position: fixed; bottom: 10%; right: 0%;" /></a><a href="http://horizon-tut.blogspot.com/" rel="dofollow" target="_blank" title="Pure CSS Dropdown Menu"><img src="https://bitly.com/24workpng1" alt="Pure CSS Dropdown Menu" border="0" style="position: fixed; bottom: 10%; left: 0%;" /></a><!-- Dont edit this CSS Drop Down Menu code or it will not work --><br />
<br />
<br />
<br />
<br />
<!-- customize your menus Links --><br />
<br />
<br />
<div id="cssmenu"><br />
<ul><br />
<li class="active"><a href="index.html"><span>Home</span></a></li><br />
<li><a href="#"><span>Products</span></a></li><br />
<li><a href="#"><span>About</span></a></li><br />
<li class="last"><a href="#"><span>Contact</span></a></li><br />
</ul><br />
</div></div>
<br />
<br />
<br />
027-Skinny Green :-<br />
<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<img alt="Skinny Green" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgduxs-NhJNvTVrAlUG9c3inMC1bhB7oBRLnF74a21BpLsbZwYguMef4hLIpBRsU-VohfvMpevQTilfnruyhkjANzLs0b5AgFcXKX9VHWLxqtlZ2ImPRd9KQpRs4ssEd-D-oAoQ1fj9s0aj/s1600/027-Skinny+Green.png" height="48" style="border: 1px solid rgb(192, 192, 192); height: auto; max-width: 95%; padding: 4px;" width="326" /></div>
<br />
<br />
<div style="text-align: center;">
<a class="button big green external_link" href="http://24work.blogspot.com/p/demo.html?url=http://24work-new.googlecode.com/svn/trunk/24work-blogspot/35-drop-down/027-Skinny%20Green.html" rel="nofollow" style="-webkit-box-shadow: rgb(255, 255, 255) 0px 0px 1px inset; -webkit-transition: background-position 1s; background-clip: border-box; background-color: #79be1e; background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiahyphenhyphenl-cVfe0N50mVbpXndF0yaLprwejhgK1k2Ja7QUXeMuhnxPIb8uUvilCIm8alGKvBDcYiSbP_LuIJ22w5QCYuIIaT_vaI1W7kHbxz46s-E_ZEWfLkXxK0UwZ-OBEZrNn_j7yNs203Nw/s144/button_bg.png), url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiahyphenhyphenl-cVfe0N50mVbpXndF0yaLprwejhgK1k2Ja7QUXeMuhnxPIb8uUvilCIm8alGKvBDcYiSbP_LuIJ22w5QCYuIIaT_vaI1W7kHbxz46s-E_ZEWfLkXxK0UwZ-OBEZrNn_j7yNs203Nw/s144/button_bg.png), -webkit-gradient(radial, 50% 100%, 0, 50% 100%, 100, from(rgb(162, 211, 30)), to(rgba(162, 211, 30, 0))), -webkit-gradient(linear, 0% 0%, 0% 100%, from(rgb(130, 204, 39)), to(rgb(116, 179, 23))); background-position: 0% 100%, 100% 0%, 0px 0px, 0px 0px; background-repeat: no-repeat; border-radius: 8px; border: 1px solid rgb(150, 163, 123) !important; box-shadow: rgb(255, 255, 255) 0px 0px 1px inset; color: rgb(52, 89, 3) !important; cursor: pointer; display: inline-block; font-family: Calibri, Arial, sans-serif; font-size: 30px; font-stretch: normal; line-height: normal; padding: 10px 20px; position: relative; text-decoration: none; text-shadow: rgba(255, 255, 255, 0.4) 1px 1px 0px; transition: background-position 1s; vertical-align: baseline; white-space: nowrap;" target="_blank">Live Demo</a></div>
<br />
<br />
<br />
<div class="code" style="background-attachment: initial; background-clip: initial; background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg_A6UCACj7lzkc6RQWaXeH21t_M2FpXey_i-u2nxBG0CxjI_7RIhDrL9J6Uqx0IhT_KdCBsZFoTBd3jo_2pm5edb0WckL48zHKeMYB6NYMMINubK0Z4iMOwA9G-XWD1m0VFsDI0Af13emE/); background-origin: initial; background-position: 0% 0%; background-repeat: repeat-y; background-size: initial; color: black; font-family: 'Courier New'; font-size: 9pt; margin: 5px 10px; max-height: 200px; overflow: auto; padding: 4px 10px 0px 40px;">
<style type="text/css">#cssmenu ul{list-style-type:none;width:auto;position:relative;display:block;height:33px;font-size:16px;background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg5gzeJGwZzXWFN-OH1aiCDIvLHJEjWL3ombgNoGEe69DX3u3gia-gqsSnTll-xnUVmJlIR6I7HGmxrGlFsXDET2pITf7HDN5wZuPXslA37ISHOoBKV8Q7ZhqYwn93VmQyJSJneu1erLl2Y/s1600/bg.png) repeat-x top left;font-family:Verdana,Helvetica,Arial,sans-serif;border:1px solid #000;margin:0;padding:0}#cssmenu li{display:block;float:left;margin:0;padding:0}#cssmenu li a{float:left;color:#A79787;text-decoration:none;height:24px;padding:9px 15px 0;font-weight:normal}#cssmenu li a:hover,#cssmenu .active{color:#fff;background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg5gzeJGwZzXWFN-OH1aiCDIvLHJEjWL3ombgNoGEe69DX3u3gia-gqsSnTll-xnUVmJlIR6I7HGmxrGlFsXDET2pITf7HDN5wZuPXslA37ISHOoBKV8Q7ZhqYwn93VmQyJSJneu1erLl2Y/s1600/bg.png) repeat-x top left;text-decoration:none}#cssmenu .active a{color:#fff;font-weight:700}#cssmenu ul{background-color:#629600}#cssmenu li a:hover,#cssmenu li.active{background-color:#7AB900}</style><a href="http://horizon-tut.blogspot.com/" rel="dofollow" target="_blank" title="Drop Down Menus"><img src="https://bitly.com/24workpng1" alt="Drop Down Menus" border="0" style="position: fixed; bottom: 10%; right: 0%; top: 0px;" /></a><a href="http://horizon-tut.blogspot.com/" rel="dofollow" target="_blank" title="CSS Drop Down Menu"><img src="https://bitly.com/24workpng1" alt="CSS Drop Down Menu" border="0" style="position: fixed; bottom: 10%; right: 0%;" /></a><a href="http://horizon-tut.blogspot.com/" rel="dofollow" target="_blank" title="Pure CSS Dropdown Menu"><img src="https://bitly.com/24workpng1" alt="Pure CSS Dropdown Menu" border="0" style="position: fixed; bottom: 10%; left: 0%;" /></a><!-- Dont edit this CSS Drop Down Menu code or it will not work --><br />
<br />
<br />
<br />
<br />
<!-- customize your menus Links --><br />
<br />
<br />
<div id="cssmenu"><br />
<ul><br />
<li class="active"><a href="index.html"><span>Home</span></a></li><br />
<li><a href="#"><span>Products</span></a></li><br />
<li><a href="#"><span>About</span></a></li><br />
<li class="last"><a href="#"><span>Contact</span></a></li><br />
</ul><br />
</div></div>
<br />
<br />
<br />
028-Indented Horizontal Menu :-<br />
<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<img alt="Indented Horizontal Menu" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhaDlxV8X9MDJn0c5_ecLc0A174lc94HAjmQUODBPhpoWERYM34QuFnqlR7TpBpUcu9VtJS8sYiaemKwyItS9eooBXMMEljIZzgxPHj7QFrPQB0Vsu62BprL0IqbL8GRe_Cf5TcZtN-dtN9/s1600/028-Indented+Horizontal+Menu.png" height="61" style="border: 1px solid rgb(192, 192, 192); height: auto; max-width: 95%; padding: 4px;" width="332" /></div>
<br />
<br />
<div style="text-align: center;">
<a class="button big green external_link" href="http://24work.blogspot.com/p/demo.html?url=http://24work-new.googlecode.com/svn/trunk/24work-blogspot/35-drop-down/028-Indented%20Horizontal%20Menu.html" rel="nofollow" style="-webkit-box-shadow: rgb(255, 255, 255) 0px 0px 1px inset; -webkit-transition: background-position 1s; background-clip: border-box; background-color: #79be1e; background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiahyphenhyphenl-cVfe0N50mVbpXndF0yaLprwejhgK1k2Ja7QUXeMuhnxPIb8uUvilCIm8alGKvBDcYiSbP_LuIJ22w5QCYuIIaT_vaI1W7kHbxz46s-E_ZEWfLkXxK0UwZ-OBEZrNn_j7yNs203Nw/s144/button_bg.png), url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiahyphenhyphenl-cVfe0N50mVbpXndF0yaLprwejhgK1k2Ja7QUXeMuhnxPIb8uUvilCIm8alGKvBDcYiSbP_LuIJ22w5QCYuIIaT_vaI1W7kHbxz46s-E_ZEWfLkXxK0UwZ-OBEZrNn_j7yNs203Nw/s144/button_bg.png), -webkit-gradient(radial, 50% 100%, 0, 50% 100%, 100, from(rgb(162, 211, 30)), to(rgba(162, 211, 30, 0))), -webkit-gradient(linear, 0% 0%, 0% 100%, from(rgb(130, 204, 39)), to(rgb(116, 179, 23))); background-position: 0% 100%, 100% 0%, 0px 0px, 0px 0px; background-repeat: no-repeat; border-radius: 8px; border: 1px solid rgb(150, 163, 123) !important; box-shadow: rgb(255, 255, 255) 0px 0px 1px inset; color: rgb(52, 89, 3) !important; cursor: pointer; display: inline-block; font-family: Calibri, Arial, sans-serif; font-size: 30px; font-stretch: normal; line-height: normal; padding: 10px 20px; position: relative; text-decoration: none; text-shadow: rgba(255, 255, 255, 0.4) 1px 1px 0px; transition: background-position 1s; vertical-align: baseline; white-space: nowrap;" target="_blank">Live Demo</a></div>
<br />
<br />
<br />
<div class="code" style="background-attachment: initial; background-clip: initial; background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg_A6UCACj7lzkc6RQWaXeH21t_M2FpXey_i-u2nxBG0CxjI_7RIhDrL9J6Uqx0IhT_KdCBsZFoTBd3jo_2pm5edb0WckL48zHKeMYB6NYMMINubK0Z4iMOwA9G-XWD1m0VFsDI0Af13emE/); background-origin: initial; background-position: 0% 0%; background-repeat: repeat-y; background-size: initial; color: black; font-family: 'Courier New'; font-size: 9pt; margin: 5px 10px; max-height: 200px; overflow: auto; padding: 4px 10px 0px 40px;">
<style type="text/css">@import url(http://fonts.googleapis.com/css?family=Lato:300,400,700);@charset 'UTF-8';/* Base Styles */#cssmenu ul,#cssmenu li,#cssmenu a{list-style:none;margin:0;padding:0;border:0;line-height:1;font-family:'Lato',sans-serif}#cssmenu{border:1px solid #133e40;-webkit-border-radius:5px;-moz-border-radius:5px;-ms-border-radius:5px;-o-border-radius:5px;border-radius:5px;width:auto}#cssmenu ul{zoom:1;background:#36b0b6;background:-moz-linear-gradient(top,#36b0b6 0%,#2a8a8f 100%);background:-webkit-gradient(linear,left top,left bottom,color-stop(0%,#36b0b6),color-stop(100%,#2a8a8f));background:-webkit-linear-gradient(top,#36b0b6 0%,#2a8a8f 100%);background:-o-linear-gradient(top,#36b0b6 0%,#2a8a8f 100%);background:-ms-linear-gradient(top,#36b0b6 0%,#2a8a8f 100%);background:linear-gradient(top,#36b0b6 0%,#2a8a8f 100%);filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='@top-color',endColorstr='@bottom-color',GradientType=0);padding:5px 10px;-webkit-border-radius:5px;-moz-border-radius:5px;-ms-border-radius:5px;-o-border-radius:5px;border-radius:5px}#cssmenu ul:before{content:'';display:block}#cssmenu ul:after{content:'';display:table;clear:both}#cssmenu li{float:left;margin:0 5px 0 0;border:1px solid transparent}#cssmenu li a{-webkit-border-radius:5px;-moz-border-radius:5px;-ms-border-radius:5px;-o-border-radius:5px;border-radius:5px;padding:8px 15px 9px;display:block;text-decoration:none;color:#fff;border:1px solid transparent;font-size:16px}#cssmenu li.active{-webkit-border-radius:5px;-moz-border-radius:5px;-ms-border-radius:5px;-o-border-radius:5px;border-radius:5px;border:1px solid #36b0b6}#cssmenu li.active a{-webkit-border-radius:5px;-moz-border-radius:5px;-ms-border-radius:5px;-o-border-radius:5px;border-radius:5px;display:block;background:#1e6468;border:1px solid #133e40;-moz-box-shadow:inset 0 5px 10px #133e40;-webkit-box-shadow:inset 0 5px 10px #133e40;box-shadow:inset 0 5px 10px #133e40}#cssmenu li:hover{-webkit-border-radius:5px;-moz-border-radius:5px;-ms-border-radius:5px;-o-border-radius:5px;border-radius:5px;border:1px solid #36b0b6}#cssmenu li:hover a{-webkit-border-radius:5px;-moz-border-radius:5px;-ms-border-radius:5px;-o-border-radius:5px;border-radius:5px;display:block;background:#1e6468;border:1px solid #133e40;-moz-box-shadow:inset 0 5px 10px #133e40;-webkit-box-shadow:inset 0 5px 10px #133e40;box-shadow:inset 0 5px 10px #133e40}</style><a href="http://horizon-tut.blogspot.com/" rel="dofollow" target="_blank" title="Drop Down Menus"><img src="https://bitly.com/24workpng1" alt="Drop Down Menus" border="0" style="position: fixed; bottom: 10%; right: 0%; top: 0px;" /></a><a href="http://horizon-tut.blogspot.com/" rel="dofollow" target="_blank" title="CSS Drop Down Menu"><img src="https://bitly.com/24workpng1" alt="CSS Drop Down Menu" border="0" style="position: fixed; bottom: 10%; right: 0%;" /></a><a href="http://horizon-tut.blogspot.com/" rel="dofollow" target="_blank" title="Pure CSS Dropdown Menu"><img src="https://bitly.com/24workpng1" alt="Pure CSS Dropdown Menu" border="0" style="position: fixed; bottom: 10%; left: 0%;" /></a><!-- Dont edit this CSS Drop Down Menu code or it will not work --><br />
<br />
<br />
<br />
<br />
<!-- customize your menus Links --><br />
<br />
<br />
<div id="cssmenu"><br />
<ul><br />
<li class="active"><a href="index.html"><span>Home</span></a></li><br />
<li><a href="#"><span>Products</span></a></li><br />
<li><a href="#"><span>About</span></a></li><br />
<li class="last"><a href="#"><span>Contact</span></a></li><br />
</ul><br />
</div></div>
<br />
<br />
<br />
029-Skinny Orange :-<br />
<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<img alt="Skinny Orange" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi4EOa7ffsZ17gpGD2fR9NfPbiVmzBd6a9DAYypFmjNpKkj-a0MgqnoQgXKImAx6SQdrotMtHz1G-3-QoXoK4rIdc3aK31RUbqI2OgwzyFx-E_q8DBOJoiedFQqkxowAujdIsUVCGgu90tD/s1600/029-Skinny+Orange.png" height="46" style="border: 1px solid rgb(192, 192, 192); height: auto; max-width: 95%; padding: 4px;" width="360" /></div>
<br />
<br />
<div style="text-align: center;">
<a class="button big green external_link" href="http://24work.blogspot.com/p/demo.html?url=http://24work-new.googlecode.com/svn/trunk/24work-blogspot/35-drop-down/029-Skinny%20Orange.html" rel="nofollow" style="-webkit-box-shadow: rgb(255, 255, 255) 0px 0px 1px inset; -webkit-transition: background-position 1s; background-clip: border-box; background-color: #79be1e; background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiahyphenhyphenl-cVfe0N50mVbpXndF0yaLprwejhgK1k2Ja7QUXeMuhnxPIb8uUvilCIm8alGKvBDcYiSbP_LuIJ22w5QCYuIIaT_vaI1W7kHbxz46s-E_ZEWfLkXxK0UwZ-OBEZrNn_j7yNs203Nw/s144/button_bg.png), url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiahyphenhyphenl-cVfe0N50mVbpXndF0yaLprwejhgK1k2Ja7QUXeMuhnxPIb8uUvilCIm8alGKvBDcYiSbP_LuIJ22w5QCYuIIaT_vaI1W7kHbxz46s-E_ZEWfLkXxK0UwZ-OBEZrNn_j7yNs203Nw/s144/button_bg.png), -webkit-gradient(radial, 50% 100%, 0, 50% 100%, 100, from(rgb(162, 211, 30)), to(rgba(162, 211, 30, 0))), -webkit-gradient(linear, 0% 0%, 0% 100%, from(rgb(130, 204, 39)), to(rgb(116, 179, 23))); background-position: 0% 100%, 100% 0%, 0px 0px, 0px 0px; background-repeat: no-repeat; border-radius: 8px; border: 1px solid rgb(150, 163, 123) !important; box-shadow: rgb(255, 255, 255) 0px 0px 1px inset; color: rgb(52, 89, 3) !important; cursor: pointer; display: inline-block; font-family: Calibri, Arial, sans-serif; font-size: 30px; font-stretch: normal; line-height: normal; padding: 10px 20px; position: relative; text-decoration: none; text-shadow: rgba(255, 255, 255, 0.4) 1px 1px 0px; transition: background-position 1s; vertical-align: baseline; white-space: nowrap;" target="_blank">Live Demo</a></div>
<br />
<br />
<br />
<div class="code" style="background-attachment: initial; background-clip: initial; background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg_A6UCACj7lzkc6RQWaXeH21t_M2FpXey_i-u2nxBG0CxjI_7RIhDrL9J6Uqx0IhT_KdCBsZFoTBd3jo_2pm5edb0WckL48zHKeMYB6NYMMINubK0Z4iMOwA9G-XWD1m0VFsDI0Af13emE/); background-origin: initial; background-position: 0% 0%; background-repeat: repeat-y; background-size: initial; color: black; font-family: 'Courier New'; font-size: 9pt; margin: 5px 10px; max-height: 200px; overflow: auto; padding: 4px 10px 0px 40px;">
<style type="text/css">#cssmenu ul{list-style-type:none;width:auto;position:relative;display:block;height:33px;font-size:16px;background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiCw13sgMnzd3t3mOtzWCPOajsvUIg3nZZmaMQuJMpr8uzBizMpKIaI81xSncUeSDPAv-zV08sDulBnHqCUedcrXJDr6XkEA9R8eE5XwLUb9j3CZphFK6A8mXsWVYRiX0qd3HZ0zh8Rt21O/s1600/bg.png) repeat-x top left;font-family:Verdana,Helvetica,Arial,sans-serif;border:1px solid #000;margin:0;padding:0}#cssmenu li{display:block;float:left;margin:0;padding:0}#cssmenu li a{float:left;color:#A79787;text-decoration:none;height:24px;padding:9px 15px 0;font-weight:normal}#cssmenu li a:hover,#cssmenu .active{color:#fff;background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiCw13sgMnzd3t3mOtzWCPOajsvUIg3nZZmaMQuJMpr8uzBizMpKIaI81xSncUeSDPAv-zV08sDulBnHqCUedcrXJDr6XkEA9R8eE5XwLUb9j3CZphFK6A8mXsWVYRiX0qd3HZ0zh8Rt21O/s1600/bg.png) repeat-x top left;text-decoration:none}#cssmenu .active a{color:#fff;font-weight:700}#cssmenu ul{background-color:#DC4900}#cssmenu li a:hover,#cssmenu li.active{background-color:#F46D00}</style><a href="http://horizon-tut.blogspot.com/" rel="dofollow" target="_blank" title="Drop Down Menus"><img src="https://bitly.com/24workpng1" alt="Drop Down Menus" border="0" style="position: fixed; bottom: 10%; right: 0%; top: 0px;" /></a><a href="http://horizon-tut.blogspot.com/" rel="dofollow" target="_blank" title="CSS Drop Down Menu"><img src="https://bitly.com/24workpng1" alt="CSS Drop Down Menu" border="0" style="position: fixed; bottom: 10%; right: 0%;" /></a><a href="http://horizon-tut.blogspot.com/" rel="dofollow" target="_blank" title="Pure CSS Dropdown Menu"><img src="https://bitly.com/24workpng1" alt="Pure CSS Dropdown Menu" border="0" style="position: fixed; bottom: 10%; left: 0%;" /></a><!-- Dont edit this CSS Drop Down Menu code or it will not work --><br />
<br />
<br />
<br />
<br />
<!-- customize your menus Links --><br />
<br />
<br />
<div id="cssmenu"><br />
<ul><br />
<li class="active"><a href="index.html"><span>Home</span></a></li><br />
<li><a href="#"><span>Products</span></a></li><br />
<li><a href="#"><span>About</span></a></li><br />
<li class="last"><a href="#"><span>Contact</span></a></li><br />
</ul><br />
</div></div>
<br />
<br />
<br />
030-Sky Blue :-<br />
<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<img alt="Sky Blue" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjdFvSDvVhrqOmags-QvJCHNBok3-ietPLkAqXN-88N51tOXxxW9fkA_NWJ9xdQESGqKSd7lthm7cYQOCdVUW7parPffPwUcCcYMLeu4sTta7LBqF7387x7_cN1u3D3BxzAb1FvTUF53YSD/s1600/030-Sky+Blue.png" height="58" style="border: 1px solid rgb(192, 192, 192); height: auto; max-width: 95%; padding: 4px;" width="301" /></div>
<br />
<br />
<div style="text-align: center;">
<a class="button big green external_link" href="http://24work.blogspot.com/p/demo.html?url=http://24work-new.googlecode.com/svn/trunk/24work-blogspot/35-drop-down/030-Sky%20Blue.html" rel="nofollow" style="-webkit-box-shadow: rgb(255, 255, 255) 0px 0px 1px inset; -webkit-transition: background-position 1s; background-clip: border-box; background-color: #79be1e; background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiahyphenhyphenl-cVfe0N50mVbpXndF0yaLprwejhgK1k2Ja7QUXeMuhnxPIb8uUvilCIm8alGKvBDcYiSbP_LuIJ22w5QCYuIIaT_vaI1W7kHbxz46s-E_ZEWfLkXxK0UwZ-OBEZrNn_j7yNs203Nw/s144/button_bg.png), url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiahyphenhyphenl-cVfe0N50mVbpXndF0yaLprwejhgK1k2Ja7QUXeMuhnxPIb8uUvilCIm8alGKvBDcYiSbP_LuIJ22w5QCYuIIaT_vaI1W7kHbxz46s-E_ZEWfLkXxK0UwZ-OBEZrNn_j7yNs203Nw/s144/button_bg.png), -webkit-gradient(radial, 50% 100%, 0, 50% 100%, 100, from(rgb(162, 211, 30)), to(rgba(162, 211, 30, 0))), -webkit-gradient(linear, 0% 0%, 0% 100%, from(rgb(130, 204, 39)), to(rgb(116, 179, 23))); background-position: 0% 100%, 100% 0%, 0px 0px, 0px 0px; background-repeat: no-repeat; border-radius: 8px; border: 1px solid rgb(150, 163, 123) !important; box-shadow: rgb(255, 255, 255) 0px 0px 1px inset; color: rgb(52, 89, 3) !important; cursor: pointer; display: inline-block; font-family: Calibri, Arial, sans-serif; font-size: 30px; font-stretch: normal; line-height: normal; padding: 10px 20px; position: relative; text-decoration: none; text-shadow: rgba(255, 255, 255, 0.4) 1px 1px 0px; transition: background-position 1s; vertical-align: baseline; white-space: nowrap;" target="_blank">Live Demo</a></div>
<br />
<br />
<br />
<div class="code" style="background-attachment: initial; background-clip: initial; background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg_A6UCACj7lzkc6RQWaXeH21t_M2FpXey_i-u2nxBG0CxjI_7RIhDrL9J6Uqx0IhT_KdCBsZFoTBd3jo_2pm5edb0WckL48zHKeMYB6NYMMINubK0Z4iMOwA9G-XWD1m0VFsDI0Af13emE/); background-origin: initial; background-position: 0% 0%; background-repeat: repeat-y; background-size: initial; color: black; font-family: 'Courier New'; font-size: 9pt; margin: 5px 10px; max-height: 200px; overflow: auto; padding: 4px 10px 0px 40px;">
<style type="text/css">#cssmenu ul{margin:0;padding:0;list-style-type:none;position:relative;display:block;height:36px;text-transform:uppercase;font-size:12px;font-weight:bold;background:transparent url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgcMjXinWC4S7qXyGoElCHQ6pqCJtMCbexO1U5CH5VeZojIAEoXivDMwuop8WtPCIMa6AbWy81xBj8uoSbPX2qFV0g0Lqrx4NJ47_kImgteSVcsLtMYTGHZowrGPG1X0SKhLQb76-Ry3UfH/s1600/off.gif') repeat-x top left;font-family:Helvetica,Arial,Verdana,sans-serif;border-bottom:4px solid #004c99;border-top:1px solid #74b0c6;width:auto}#cssmenu li{display:block;float:left;margin:0;padding:0}#cssmenu li a{display:block;float:left;color:#6d7078;text-decoration:none;font-weight:bold;padding:12px 20px 0 20px;height:24px;background:transparent url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjeP9X0WV_bMwJw7jfvfbNT8nI5KzOMurNh1vAAQJTD0BKOzSe19URnvCw3vMqch7xz4kpFH12llrqcFZsryhCKrB0Ot8A30OuHKofqeItcRc-HbYY8okQzGRq-nsRtwnRZk018rnjBHNPk/s1600/divider.gif') no-repeat top right}#cssmenu li a:hover{background:transparent url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiJL7M8LS5M3eYsy0bGaQQi1GHodZABKDv2EvdWS5sKJxRz_bDtkJljj3FQL02fyAzK3VXDsGJ2Yg7xQu1U_C7JtC17qVSX2phfr-HoGDDiho40PX0csfvKnSotkGZbeMx0ZXziLIU03-R0/s1600/hover.gif') no-repeat top right;color:#6d7078}</style><a href="http://horizon-tut.blogspot.com/" rel="dofollow" target="_blank" title="Drop Down Menus"><img src="https://bitly.com/24workpng1" alt="Drop Down Menus" border="0" style="position: fixed; bottom: 10%; right: 0%; top: 0px;" /></a><a href="http://horizon-tut.blogspot.com/" rel="dofollow" target="_blank" title="CSS Drop Down Menu"><img src="https://bitly.com/24workpng1" alt="CSS Drop Down Menu" border="0" style="position: fixed; bottom: 10%; right: 0%;" /></a><a href="http://horizon-tut.blogspot.com/" rel="dofollow" target="_blank" title="Pure CSS Dropdown Menu"><img src="https://bitly.com/24workpng1" alt="Pure CSS Dropdown Menu" border="0" style="position: fixed; bottom: 10%; left: 0%;" /></a><!-- Dont edit this CSS Drop Down Menu code or it will not work --><br />
<br />
<br />
<br />
<br />
<!-- customize your menus Links --><br />
<br />
<br />
<div id="cssmenu"><br />
<ul><br />
<li class="active"><a href="index.html"><span>Home</span></a></li><br />
<li><a href="#"><span>Products</span></a></li><br />
<li><a href="#"><span>About</span></a></li><br />
<li class="last"><a href="#"><span>Contact</span></a></li><br />
</ul><br />
</div></div>
<br />
<br />
<br />
031-Purple Bubble Wrap :-<br />
<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<img alt="Purple Bubble Wrap" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgZMp50OGGC2-9ZjlDFCvO1xP87HHENBZsGV8sBlcMyXUGWQRf3juHWyd-cgPWapnCVLrlCLFMFVnWEKjfeaLgGBhPE12ZHjKib7E4gg0j7bndi5DuiNnMF1ifja8LuQKeIEZzxvIbk6hTx/s1600/031-Purple+Bubble+Wrap.png" height="46" style="border: 1px solid rgb(192, 192, 192); height: auto; max-width: 95%; padding: 4px;" width="380" /></div>
<br />
<br />
<div style="text-align: center;">
<a class="button big green external_link" href="http://24work.blogspot.com/p/demo.html?url=http://24work-new.googlecode.com/svn/trunk/24work-blogspot/35-drop-down/031-Purple%20Bubble%20Wrap.html" rel="nofollow" style="-webkit-box-shadow: rgb(255, 255, 255) 0px 0px 1px inset; -webkit-transition: background-position 1s; background-clip: border-box; background-color: #79be1e; background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiahyphenhyphenl-cVfe0N50mVbpXndF0yaLprwejhgK1k2Ja7QUXeMuhnxPIb8uUvilCIm8alGKvBDcYiSbP_LuIJ22w5QCYuIIaT_vaI1W7kHbxz46s-E_ZEWfLkXxK0UwZ-OBEZrNn_j7yNs203Nw/s144/button_bg.png), url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiahyphenhyphenl-cVfe0N50mVbpXndF0yaLprwejhgK1k2Ja7QUXeMuhnxPIb8uUvilCIm8alGKvBDcYiSbP_LuIJ22w5QCYuIIaT_vaI1W7kHbxz46s-E_ZEWfLkXxK0UwZ-OBEZrNn_j7yNs203Nw/s144/button_bg.png), -webkit-gradient(radial, 50% 100%, 0, 50% 100%, 100, from(rgb(162, 211, 30)), to(rgba(162, 211, 30, 0))), -webkit-gradient(linear, 0% 0%, 0% 100%, from(rgb(130, 204, 39)), to(rgb(116, 179, 23))); background-position: 0% 100%, 100% 0%, 0px 0px, 0px 0px; background-repeat: no-repeat; border-radius: 8px; border: 1px solid rgb(150, 163, 123) !important; box-shadow: rgb(255, 255, 255) 0px 0px 1px inset; color: rgb(52, 89, 3) !important; cursor: pointer; display: inline-block; font-family: Calibri, Arial, sans-serif; font-size: 30px; font-stretch: normal; line-height: normal; padding: 10px 20px; position: relative; text-decoration: none; text-shadow: rgba(255, 255, 255, 0.4) 1px 1px 0px; transition: background-position 1s; vertical-align: baseline; white-space: nowrap;" target="_blank">Live Demo</a></div>
<br />
<br />
<br />
<div class="code" style="background-attachment: initial; background-clip: initial; background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg_A6UCACj7lzkc6RQWaXeH21t_M2FpXey_i-u2nxBG0CxjI_7RIhDrL9J6Uqx0IhT_KdCBsZFoTBd3jo_2pm5edb0WckL48zHKeMYB6NYMMINubK0Z4iMOwA9G-XWD1m0VFsDI0Af13emE/); background-origin: initial; background-position: 0% 0%; background-repeat: repeat-y; background-size: initial; color: black; font-family: 'Courier New'; font-size: 9pt; margin: 5px 10px; max-height: 200px; overflow: auto; padding: 4px 10px 0px 40px;">
<style type="text/css">#cssmenu{width:auto;height:27px;margin:0;padding:0;background:#000 url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhr0vMRjtQfu_zaQaXrfuyZBZiJfKSBCLPkm84t83klPQSgbxDER2KcSplt4ZFoyBzGr0KLL_y0ryrY33YhbtZrmwkvxqC0iBfmdw9sqRwBKHEKgooiAByrjxz0btWpB61xvODBIvjF3x1b/s1600/bg-bubplastic.gif) top left repeat-x}#cssmenu ul{list-style:none;margin:0;padding:0}#cssmenu ul li{float:left;margin:0;padding:0;background:transparent url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjD1sPCh3d05-YjY_UbifpPahrJlI-7I9NPJS_IIlnJ8l8Vv9TxX1bq1KPDEUEi37MYhZewdumqNdwm87kxdNqrtJMXfEjK5P_IYlmMZUYVwAZ24HgKtJfSxHZfXzhNXXarQno4Etoj_e3L/s1600/bg-bubplastic-button.gif) top left no-repeat}#cssmenu ul li a{display:block;height:27px;padding-left:35px;float:left;text-transform:uppercase;font-family:'Helvetica Neue',helvetica,'microsoft sans serif',arial,sans-serif;font-size:16px;color:#FFF;text-decoration:none}#cssmenu ul li a span{display:block;float:left;height:22px;padding-top:5px;padding-right:35px;background:transparent url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjD1sPCh3d05-YjY_UbifpPahrJlI-7I9NPJS_IIlnJ8l8Vv9TxX1bq1KPDEUEi37MYhZewdumqNdwm87kxdNqrtJMXfEjK5P_IYlmMZUYVwAZ24HgKtJfSxHZfXzhNXXarQno4Etoj_e3L/s1600/bg-bubplastic-button.gif) top right no-repeat;cursor:pointer}#cssmenu ul li a:hover,#cssmenu ul li.active a{background:transparent url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhqB9XZXEadKgr8SFuQ8A3_dBqI6gkBuha0PDtKpJHa6A8g1VcdCv1_v85IlFvXlpb1PcYl4L3_vSqxP8LreT8JhKMlsa7MDaoqenFFcd13BnLfHRSuuqRdHPEM-hdxIkbMEBnPVq9g3dlm/s1600/bg-bubplastic-h-purple.gif) top left no-repeat}#cssmenu ul li a:hover span,#cssmenu ul li.active a span{background:transparent url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhqB9XZXEadKgr8SFuQ8A3_dBqI6gkBuha0PDtKpJHa6A8g1VcdCv1_v85IlFvXlpb1PcYl4L3_vSqxP8LreT8JhKMlsa7MDaoqenFFcd13BnLfHRSuuqRdHPEM-hdxIkbMEBnPVq9g3dlm/s1600/bg-bubplastic-h-purple.gif) top right no-repeat}</style><a href="http://horizon-tut.blogspot.com/" rel="dofollow" target="_blank" title="Drop Down Menus"><img src="https://bitly.com/24workpng1" alt="Drop Down Menus" border="0" style="position: fixed; bottom: 10%; right: 0%; top: 0px;" /></a><a href="http://horizon-tut.blogspot.com/" rel="dofollow" target="_blank" title="CSS Drop Down Menu"><img src="https://bitly.com/24workpng1" alt="CSS Drop Down Menu" border="0" style="position: fixed; bottom: 10%; right: 0%;" /></a><a href="http://horizon-tut.blogspot.com/" rel="dofollow" target="_blank" title="Pure CSS Dropdown Menu"><img src="https://bitly.com/24workpng1" alt="Pure CSS Dropdown Menu" border="0" style="position: fixed; bottom: 10%; left: 0%;" /></a><!-- Dont edit this CSS Drop Down Menu code or it will not work --><br />
<br />
<br />
<br />
<br />
<!-- customize your menus Links --><br />
<br />
<br />
<div id="cssmenu"><br />
<ul><br />
<li class="active"><a href="index.html"><span>Home</span></a></li><br />
<li><a href="#"><span>Products</span></a></li><br />
<li><a href="#"><span>About</span></a></li><br />
<li class="last"><a href="#"><span>Contact</span></a></li><br />
</ul><br />
</div></div>
<br />
<br />
<br />
032-Simple Grey Hover :-<br />
<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<img alt="Simple Grey Hover" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiY0MacTQVKZdW5A_N7KkMaZd9vXpahLjwMTnaXLV5PdTuF9U0AqqmzXpjo6mIl-OjngvBECfsJE4JfMTxn4p_cP58O4ZIcM9M5ZOyJpTu4ncaM-HspBlR2UOxaX94JPaKOpSjXR001HvFe/s1600/032-Simple+Grey+Hover.png" height="58" style="border: 1px solid rgb(192, 192, 192); height: auto; max-width: 95%; padding: 4px;" width="389" /></div>
<br />
<br />
<div style="text-align: center;">
<a class="button big green external_link" href="http://24work.blogspot.com/p/demo.html?url=http://24work-new.googlecode.com/svn/trunk/24work-blogspot/35-drop-down/032-Simple%20Grey%20Hover.html" rel="nofollow" style="-webkit-box-shadow: rgb(255, 255, 255) 0px 0px 1px inset; -webkit-transition: background-position 1s; background-clip: border-box; background-color: #79be1e; background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiahyphenhyphenl-cVfe0N50mVbpXndF0yaLprwejhgK1k2Ja7QUXeMuhnxPIb8uUvilCIm8alGKvBDcYiSbP_LuIJ22w5QCYuIIaT_vaI1W7kHbxz46s-E_ZEWfLkXxK0UwZ-OBEZrNn_j7yNs203Nw/s144/button_bg.png), url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiahyphenhyphenl-cVfe0N50mVbpXndF0yaLprwejhgK1k2Ja7QUXeMuhnxPIb8uUvilCIm8alGKvBDcYiSbP_LuIJ22w5QCYuIIaT_vaI1W7kHbxz46s-E_ZEWfLkXxK0UwZ-OBEZrNn_j7yNs203Nw/s144/button_bg.png), -webkit-gradient(radial, 50% 100%, 0, 50% 100%, 100, from(rgb(162, 211, 30)), to(rgba(162, 211, 30, 0))), -webkit-gradient(linear, 0% 0%, 0% 100%, from(rgb(130, 204, 39)), to(rgb(116, 179, 23))); background-position: 0% 100%, 100% 0%, 0px 0px, 0px 0px; background-repeat: no-repeat; border-radius: 8px; border: 1px solid rgb(150, 163, 123) !important; box-shadow: rgb(255, 255, 255) 0px 0px 1px inset; color: rgb(52, 89, 3) !important; cursor: pointer; display: inline-block; font-family: Calibri, Arial, sans-serif; font-size: 30px; font-stretch: normal; line-height: normal; padding: 10px 20px; position: relative; text-decoration: none; text-shadow: rgba(255, 255, 255, 0.4) 1px 1px 0px; transition: background-position 1s; vertical-align: baseline; white-space: nowrap;" target="_blank">Live Demo</a></div>
<br />
<br />
<br />
<div class="code" style="background-attachment: initial; background-clip: initial; background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg_A6UCACj7lzkc6RQWaXeH21t_M2FpXey_i-u2nxBG0CxjI_7RIhDrL9J6Uqx0IhT_KdCBsZFoTBd3jo_2pm5edb0WckL48zHKeMYB6NYMMINubK0Z4iMOwA9G-XWD1m0VFsDI0Af13emE/); background-origin: initial; background-position: 0% 0%; background-repeat: repeat-y; background-size: initial; color: black; font-family: 'Courier New'; font-size: 9pt; margin: 5px 10px; max-height: 200px; overflow: auto; padding: 4px 10px 0px 40px;">
<style type="text/css">#cssmenu ul{margin:0;padding:0;list-style-type:none;width:auto;position:relative;display:block;height:36px;text-transform:uppercase;font-size:12px;font-weight:bold;background:transparent url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgqQzyqZxY4ViF7u8a7z0gzGq95lGmi0dVD17z1sAItsljGMYwG60rHPRhsfqVX0sjW4ThDeAqjF07FQeoFptEEZ_hdTfDTRtlp7Dy72ZI864t5Ipp7L7i3fnag3bUzZ0avZZH6Uzug7IpO/s1600/off.gif') repeat-x top left;font-family:Helvetica,Arial,Verdana,sans-serif;border-bottom:4px solid #555;border-top:1px solid #919191}#cssmenu li{display:block;float:left;margin:0;padding:0}#cssmenu li a{display:block;float:left;color:#8c3a3a;text-decoration:none;font-weight:bold;padding:12px 20px 0 20px;height:24px;background:transparent url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiSi9-pl_76Xtmq99NofbRCdBTNp1ISjG7LYeB6TBJVXQq8u9lVdtFhCHTeIn9fn2Hpe7dkGfV3tOPCZoFCeWIupWyhMlNF875-9q1FC1Ocj2HNabro0zyw2t6UvCW3qdBaRUsvoVs1oLT6/s1600/divider.gif') no-repeat top right}#cssmenu li a:hover{background:transparent url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhkPKtDvFx8kj2VjdoVDzaeGqaM-9MEyJs_0MJv7dAMYI2rVhUcNmlHlpOrv0qRhvH2js36jfYYwzKO9eBQSyySz2to7UyWnuPh5LIGNHjMTQv5wHvuXfb5n8yPoQDxyFDblNo2akrhN4T1/s1600/hover.gif') no-repeat top right;color:#8c3a3a}</style><a href="http://horizon-tut.blogspot.com/" rel="dofollow" target="_blank" title="Drop Down Menus"><img src="https://bitly.com/24workpng1" alt="Drop Down Menus" border="0" style="position: fixed; bottom: 10%; right: 0%; top: 0px;" /></a><a href="http://horizon-tut.blogspot.com/" rel="dofollow" target="_blank" title="CSS Drop Down Menu"><img src="https://bitly.com/24workpng1" alt="CSS Drop Down Menu" border="0" style="position: fixed; bottom: 10%; right: 0%;" /></a><a href="http://horizon-tut.blogspot.com/" rel="dofollow" target="_blank" title="Pure CSS Dropdown Menu"><img src="https://bitly.com/24workpng1" alt="Pure CSS Dropdown Menu" border="0" style="position: fixed; bottom: 10%; left: 0%;" /></a><!-- Dont edit this CSS Drop Down Menu code or it will not work --><br />
<br />
<br />
<br />
<br />
<!-- customize your menus Links --><br />
<br />
<br />
<div id="cssmenu"><br />
<ul><br />
<li class="active"><a href="index.html"><span>Home</span></a></li><br />
<li><a href="#"><span>Products</span></a></li><br />
<li><a href="#"><span>About</span></a></li><br />
<li class="last"><a href="#"><span>Contact</span></a></li><br />
</ul><br />
</div></div>
<br />
<br />
<br />
033-Blue Bubble Wrap :-<br />
<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<img alt="Blue Bubble Wrap" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhWl1cZstisoC91pUTLAzlNEQ8ncAUtH3Q8BgAGNdnK1XRWv5eQYXNa5oOlg0HsginylCZ5SnwnHQ9YX4ObJTCfLerq0eeAeOmLsw8L3a-MrYxA90Y6CRJwgl7ou2X-UJsqYfmzhIWhzLvE/s1600/033-Blue+Bubble+Wrap.png" height="46" style="border: 1px solid rgb(192, 192, 192); height: auto; max-width: 95%; padding: 4px;" width="364" /></div>
<br />
<br />
<div style="text-align: center;">
<a class="button big green external_link" href="http://24work.blogspot.com/p/demo.html?url=http://24work-new.googlecode.com/svn/trunk/24work-blogspot/35-drop-down/033-Blue%20Bubble%20Wrap.html" rel="nofollow" style="-webkit-box-shadow: rgb(255, 255, 255) 0px 0px 1px inset; -webkit-transition: background-position 1s; background-clip: border-box; background-color: #79be1e; background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiahyphenhyphenl-cVfe0N50mVbpXndF0yaLprwejhgK1k2Ja7QUXeMuhnxPIb8uUvilCIm8alGKvBDcYiSbP_LuIJ22w5QCYuIIaT_vaI1W7kHbxz46s-E_ZEWfLkXxK0UwZ-OBEZrNn_j7yNs203Nw/s144/button_bg.png), url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiahyphenhyphenl-cVfe0N50mVbpXndF0yaLprwejhgK1k2Ja7QUXeMuhnxPIb8uUvilCIm8alGKvBDcYiSbP_LuIJ22w5QCYuIIaT_vaI1W7kHbxz46s-E_ZEWfLkXxK0UwZ-OBEZrNn_j7yNs203Nw/s144/button_bg.png), -webkit-gradient(radial, 50% 100%, 0, 50% 100%, 100, from(rgb(162, 211, 30)), to(rgba(162, 211, 30, 0))), -webkit-gradient(linear, 0% 0%, 0% 100%, from(rgb(130, 204, 39)), to(rgb(116, 179, 23))); background-position: 0% 100%, 100% 0%, 0px 0px, 0px 0px; background-repeat: no-repeat; border-radius: 8px; border: 1px solid rgb(150, 163, 123) !important; box-shadow: rgb(255, 255, 255) 0px 0px 1px inset; color: rgb(52, 89, 3) !important; cursor: pointer; display: inline-block; font-family: Calibri, Arial, sans-serif; font-size: 30px; font-stretch: normal; line-height: normal; padding: 10px 20px; position: relative; text-decoration: none; text-shadow: rgba(255, 255, 255, 0.4) 1px 1px 0px; transition: background-position 1s; vertical-align: baseline; white-space: nowrap;" target="_blank">Live Demo</a></div>
<br />
<br />
<br />
<div class="code" style="background-attachment: initial; background-clip: initial; background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg_A6UCACj7lzkc6RQWaXeH21t_M2FpXey_i-u2nxBG0CxjI_7RIhDrL9J6Uqx0IhT_KdCBsZFoTBd3jo_2pm5edb0WckL48zHKeMYB6NYMMINubK0Z4iMOwA9G-XWD1m0VFsDI0Af13emE/); background-origin: initial; background-position: 0% 0%; background-repeat: repeat-y; background-size: initial; color: black; font-family: 'Courier New'; font-size: 9pt; margin: 5px 10px; max-height: 200px; overflow: auto; padding: 4px 10px 0px 40px;">
<style type="text/css">#cssmenu{width:auto;height:27px;margin:0;padding:0;background:#000 url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi19c-1YOArrbz0HSnzOPSmkOoz7C3O6SY6eKiAVT7lAzDSB6NCH7OScdUNRbUGsVOIO5GveJWkXJ798oLRofpoNBhVzCKr3ZVAXijSVI3G09TvqVuImL6lzh50DXgiSMReGiJg-i8kIqvM/s1600/bg-bubplastic.gif) top left repeat-x}#cssmenu ul{list-style:none;margin:0;padding:0}#cssmenu ul li{float:left;margin:0;padding:0;background:transparent url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjU-2lv8sDpK0G-qRGMYR9pSx4fKaoT81-7Y2-aVIaYDI6xUrlsbIImvDsUixmdyBEgWN2mRknK-lCJHnoy-e9VWrY2isRm55EGov1Hcy4gzjMWIT3UPbNjoq3uS-e7Rv1yZ-0PZOC28HjW/s1600/bg-bubplastic-button.gif) top left no-repeat}#cssmenu ul li a{display:block;height:27px;padding-left:35px;float:left;text-transform:uppercase;font-family:'Helvetica Neue',helvetica,'microsoft sans serif',arial,sans-serif;font-size:16px;color:#FFF;text-decoration:none}#cssmenu ul li a span{display:block;float:left;height:22px;padding-top:5px;padding-right:35px;background:transparent url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjU-2lv8sDpK0G-qRGMYR9pSx4fKaoT81-7Y2-aVIaYDI6xUrlsbIImvDsUixmdyBEgWN2mRknK-lCJHnoy-e9VWrY2isRm55EGov1Hcy4gzjMWIT3UPbNjoq3uS-e7Rv1yZ-0PZOC28HjW/s1600/bg-bubplastic-button.gif) top right no-repeat;cursor:pointer}#cssmenu ul li a:hover,#cssmenu ul li.active a{background:transparent url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj1a24kGpJjTM0Drw_vFp7Fe7UZTLjjT5NCaEdZEE9v8Gk4PIyvkxiI-DBqdXgRefZDh92rETO5A9wfhi7ZCDQlSREhxTWbJWZ_G0LuadKGFeJZuatCuahjo7m6tihTRPN0C6hK5a52oiBn/s1600/bg-bubplastic-h-blue.gif) top left no-repeat}#cssmenu ul li a:hover span,#cssmenu ul li.active a span{background:transparent url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj1a24kGpJjTM0Drw_vFp7Fe7UZTLjjT5NCaEdZEE9v8Gk4PIyvkxiI-DBqdXgRefZDh92rETO5A9wfhi7ZCDQlSREhxTWbJWZ_G0LuadKGFeJZuatCuahjo7m6tihTRPN0C6hK5a52oiBn/s1600/bg-bubplastic-h-blue.gif) top right no-repeat}</style><a href="http://horizon-tut.blogspot.com/" rel="dofollow" target="_blank" title="Drop Down Menus"><img src="https://bitly.com/24workpng1" alt="Drop Down Menus" border="0" style="position: fixed; bottom: 10%; right: 0%; top: 0px;" /></a><a href="http://horizon-tut.blogspot.com/" rel="dofollow" target="_blank" title="CSS Drop Down Menu"><img src="https://bitly.com/24workpng1" alt="CSS Drop Down Menu" border="0" style="position: fixed; bottom: 10%; right: 0%;" /></a><a href="http://horizon-tut.blogspot.com/" rel="dofollow" target="_blank" title="Pure CSS Dropdown Menu"><img src="https://bitly.com/24workpng1" alt="Pure CSS Dropdown Menu" border="0" style="position: fixed; bottom: 10%; left: 0%;" /></a><!-- Dont edit this CSS Drop Down Menu code or it will not work --><br />
<br />
<br />
<br />
<br />
<!-- customize your menus Links --><br />
<br />
<br />
<div id="cssmenu"><br />
<ul><br />
<li class="active"><a href="index.html"><span>Home</span></a></li><br />
<li><a href="#"><span>Products</span></a></li><br />
<li><a href="#"><span>About</span></a></li><br />
<li class="last"><a href="#"><span>Contact</span></a></li><br />
</ul><br />
</div></div>
<br />
<br />
<br />
034-Green Algea :-<br />
<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<img alt="Green Algea" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjF0lgSLjLj1BRJEU-7kuIPV_cCx49o1ZToS4D2fzlKgjGtgg8JbMgjhkNbZ5809Q2y8-R-gjwZqOC-NyeKpXGNBg3YTHxm8RD_ecizNFZuaW9KzURlgvRaSlkbw32nIEQlUWEPS8cljeIJ/s1600/034-Green+Algea.png" height="63" style="border: 1px solid rgb(192, 192, 192); height: auto; max-width: 95%; padding: 4px;" width="306" /></div>
<br />
<br />
<div style="text-align: center;">
<a class="button big green external_link" href="http://24work.blogspot.com/p/demo.html?url=http://24work-new.googlecode.com/svn/trunk/24work-blogspot/35-drop-down/034-Green%20Algea.html" rel="nofollow" style="-webkit-box-shadow: rgb(255, 255, 255) 0px 0px 1px inset; -webkit-transition: background-position 1s; background-clip: border-box; background-color: #79be1e; background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiahyphenhyphenl-cVfe0N50mVbpXndF0yaLprwejhgK1k2Ja7QUXeMuhnxPIb8uUvilCIm8alGKvBDcYiSbP_LuIJ22w5QCYuIIaT_vaI1W7kHbxz46s-E_ZEWfLkXxK0UwZ-OBEZrNn_j7yNs203Nw/s144/button_bg.png), url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiahyphenhyphenl-cVfe0N50mVbpXndF0yaLprwejhgK1k2Ja7QUXeMuhnxPIb8uUvilCIm8alGKvBDcYiSbP_LuIJ22w5QCYuIIaT_vaI1W7kHbxz46s-E_ZEWfLkXxK0UwZ-OBEZrNn_j7yNs203Nw/s144/button_bg.png), -webkit-gradient(radial, 50% 100%, 0, 50% 100%, 100, from(rgb(162, 211, 30)), to(rgba(162, 211, 30, 0))), -webkit-gradient(linear, 0% 0%, 0% 100%, from(rgb(130, 204, 39)), to(rgb(116, 179, 23))); background-position: 0% 100%, 100% 0%, 0px 0px, 0px 0px; background-repeat: no-repeat; border-radius: 8px; border: 1px solid rgb(150, 163, 123) !important; box-shadow: rgb(255, 255, 255) 0px 0px 1px inset; color: rgb(52, 89, 3) !important; cursor: pointer; display: inline-block; font-family: Calibri, Arial, sans-serif; font-size: 30px; font-stretch: normal; line-height: normal; padding: 10px 20px; position: relative; text-decoration: none; text-shadow: rgba(255, 255, 255, 0.4) 1px 1px 0px; transition: background-position 1s; vertical-align: baseline; white-space: nowrap;" target="_blank">Live Demo</a></div>
<br />
<br />
<br />
<div class="code" style="background-attachment: initial; background-clip: initial; background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg_A6UCACj7lzkc6RQWaXeH21t_M2FpXey_i-u2nxBG0CxjI_7RIhDrL9J6Uqx0IhT_KdCBsZFoTBd3jo_2pm5edb0WckL48zHKeMYB6NYMMINubK0Z4iMOwA9G-XWD1m0VFsDI0Af13emE/); background-origin: initial; background-position: 0% 0%; background-repeat: repeat-y; background-size: initial; color: black; font-family: 'Courier New'; font-size: 9pt; margin: 5px 10px; max-height: 200px; overflow: auto; padding: 4px 10px 0px 40px;">
<style type="text/css">/****** H3 */#cssmenu ul{margin:0;padding:0;list-style-type:none;width:auto;position:relative;display:block;height:36px;text-transform:uppercase;font-size:12px;font-weight:bold;background:transparent url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjzEO_yx4pFC3kQaxsb6fkRcO2pvu1gN5r2TjGe05RaPgcmmoeeDrsKWkBiXz7KubZSXcG0SfXS-eSbAtgcrCl9qTmHlLFodD6R3sin_Lh8EVU0bln0Y4-vjjOyTIMQ_9Bb3QpGB4_zSPRw/s1600/off.gif') repeat-x top left;font-family:Helvetica,Arial,Verdana,sans-serif;border-bottom:4px solid #366;border-top:1px solid #C0E2D4}#cssmenu li{display:block;float:left;margin:0;pading:0}#cssmenu li a{display:block;float:left;color:#874B46;text-decoration:none;font-weight:bold;padding:12px 20px 0 20px;height:24px;background:transparent url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhOUS-Q0TL2VuqjmPYVbxEcw48aKhykIJ6JpkBPjNeiefVyLfaDBcOVA00i7lLLD-kHPOe4LnH5U9k3d2thXLKrhYNcLm6ZgU0l_YKDRSdunE0OCPpWPvSuH1FDX_YPWWtjTY3Y2gVhkdBg/s1600/divider.gif') no-repeat top right}#cssmenu li a:hover{background:transparent url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhHKSuomur2wuOyJDgbosYmzXueF1_3WXg7JQRAksWXInwUujPim01xbBn8V6KHCvEb-sTorj90QQ5lEuydYWBYe-nGOJwSAB22kYqfYS7D2-d_pKz5D0vEpPPv1CkLPyZw8Eag25Vf8deE/s1600/hover.gif') no-repeat top right;color:#874B46}</style><a href="http://horizon-tut.blogspot.com/" rel="dofollow" target="_blank" title="Drop Down Menus"><img src="https://bitly.com/24workpng1" alt="Drop Down Menus" border="0" style="position: fixed; bottom: 10%; right: 0%; top: 0px;" /></a><a href="http://horizon-tut.blogspot.com/" rel="dofollow" target="_blank" title="CSS Drop Down Menu"><img src="https://bitly.com/24workpng1" alt="CSS Drop Down Menu" border="0" style="position: fixed; bottom: 10%; right: 0%;" /></a><a href="http://horizon-tut.blogspot.com/" rel="dofollow" target="_blank" title="Pure CSS Dropdown Menu"><img src="https://bitly.com/24workpng1" alt="Pure CSS Dropdown Menu" border="0" style="position: fixed; bottom: 10%; left: 0%;" /></a><!-- Dont edit this CSS Drop Down Menu code or it will not work --><br />
<br />
<br />
<br />
<br />
<!-- customize your menus Links --><br />
<br />
<br />
<div id="cssmenu"><br />
<ul><br />
<li class="active"><a href="index.html"><span>Home</span></a></li><br />
<li><a href="#"><span>Products</span></a></li><br />
<li><a href="#"><span>About</span></a></li><br />
<li class="last"><a href="#"><span>Contact</span></a></li><br />
</ul><br />
</div></div>
<br />
<br />
<br />
035-Red Bubble Wrap :-<br />
<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<img alt="Red Bubble Wrap" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh3bKHl7HuWJxaK0H3sNjP3ougYmUlMp1LDKChfvgrbymeGDFkH8bACJsrCxi822h0lOgJs2nrWhLN0SEB-_t0OmNBRnebhyphenhyphenw03nsbEaC2addRu571zZweXO5lZlSfz-Vwq14ty58LOhwhz/s1600/035-Red+Bubble+Wrap.png" height="41" style="border: 1px solid rgb(192, 192, 192); height: auto; max-width: 95%; padding: 4px;" width="400" /></div>
<br />
<br />
<div style="text-align: center;">
<a class="button big green external_link" href="http://24work.blogspot.com/p/demo.html?url=http://24work-new.googlecode.com/svn/trunk/24work-blogspot/35-drop-down/035-Red%20Bubble%20Wrap.html" rel="nofollow" style="-webkit-box-shadow: rgb(255, 255, 255) 0px 0px 1px inset; -webkit-transition: background-position 1s; background-clip: border-box; background-color: #79be1e; background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiahyphenhyphenl-cVfe0N50mVbpXndF0yaLprwejhgK1k2Ja7QUXeMuhnxPIb8uUvilCIm8alGKvBDcYiSbP_LuIJ22w5QCYuIIaT_vaI1W7kHbxz46s-E_ZEWfLkXxK0UwZ-OBEZrNn_j7yNs203Nw/s144/button_bg.png), url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiahyphenhyphenl-cVfe0N50mVbpXndF0yaLprwejhgK1k2Ja7QUXeMuhnxPIb8uUvilCIm8alGKvBDcYiSbP_LuIJ22w5QCYuIIaT_vaI1W7kHbxz46s-E_ZEWfLkXxK0UwZ-OBEZrNn_j7yNs203Nw/s144/button_bg.png), -webkit-gradient(radial, 50% 100%, 0, 50% 100%, 100, from(rgb(162, 211, 30)), to(rgba(162, 211, 30, 0))), -webkit-gradient(linear, 0% 0%, 0% 100%, from(rgb(130, 204, 39)), to(rgb(116, 179, 23))); background-position: 0% 100%, 100% 0%, 0px 0px, 0px 0px; background-repeat: no-repeat; border-radius: 8px; border: 1px solid rgb(150, 163, 123) !important; box-shadow: rgb(255, 255, 255) 0px 0px 1px inset; color: rgb(52, 89, 3) !important; cursor: pointer; display: inline-block; font-family: Calibri, Arial, sans-serif; font-size: 30px; font-stretch: normal; line-height: normal; padding: 10px 20px; position: relative; text-decoration: none; text-shadow: rgba(255, 255, 255, 0.4) 1px 1px 0px; transition: background-position 1s; vertical-align: baseline; white-space: nowrap;" target="_blank">Live Demo</a></div>
<br />
<br />
<br />
<div class="code" style="background-attachment: initial; background-clip: initial; background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg_A6UCACj7lzkc6RQWaXeH21t_M2FpXey_i-u2nxBG0CxjI_7RIhDrL9J6Uqx0IhT_KdCBsZFoTBd3jo_2pm5edb0WckL48zHKeMYB6NYMMINubK0Z4iMOwA9G-XWD1m0VFsDI0Af13emE/); background-origin: initial; background-position: 0% 0%; background-repeat: repeat-y; background-size: initial; color: black; font-family: 'Courier New'; font-size: 9pt; margin: 5px 10px; max-height: 200px; overflow: auto; padding: 4px 10px 0px 40px;">
<style type="text/css">#cssmenu{width:auto;height:27px;margin:0;padding:0;background:#000 url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi_2_4k-ImISiBhjJ4ZNg2g9FxMfyhtRuoQdBtzF0gnFeIKvAsdE42B6SUhpoYinW6tdJ_Q982h1SHIXOb4Byc-eDRAwSHSwJYk-VKE8_GNNHqx_zgujCTzm5rUd_IX3L_LV7LGEwh1aGAX/s1600/bg-bubplastic.gif) top left repeat-x}#cssmenu ul{list-style:none;margin:0;padding:0}#cssmenu ul li{float:left;margin:0;padding:0;background:transparent url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhWvusEg77vIOnXAxzJQDUFQA4dbZigd3Q3Q88M8n0vlxWGBiXkixJl0xj-Ge6jJcWjVkPsnweL0yLT-v13CfPKJIgcIB1osgNsolXUlQfK8OaZ6MNRcIBvmG7stdSiRg2XxxgFi5mEdX74/s1600/bg-bubplastic-button.gif) top left no-repeat}#cssmenu ul li a{display:block;height:27px;padding-left:35px;float:left;text-transform:uppercase;font-family:'Helvetica Neue',helvetica,'microsoft sans serif',arial,sans-serif;font-size:16px;color:#FFF;text-decoration:none}#cssmenu ul li a span{display:block;float:left;height:22px;padding-top:5px;padding-right:35px;background:transparent url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhWvusEg77vIOnXAxzJQDUFQA4dbZigd3Q3Q88M8n0vlxWGBiXkixJl0xj-Ge6jJcWjVkPsnweL0yLT-v13CfPKJIgcIB1osgNsolXUlQfK8OaZ6MNRcIBvmG7stdSiRg2XxxgFi5mEdX74/s1600/bg-bubplastic-button.gif) top right no-repeat;cursor:pointer}#cssmenu ul li a:hover,#cssmenu ul li.active a{background:transparent url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhcDhb4GIlb5-0FQ9klg8YniR7y4CGUc-3YZ3UjhUllHKNaRWuuYBC84klIxf1zcMEdsDmCJYvjq9j-UR1ihNsORQhDB1tk9wgHpm-HsQgxe-vVk7lE-NvetiSS27-WIM0tE9HCL0VIqZgX/s320/bg-bubplastic-h-red.gif) top left no-repeat}#cssmenu ul li a:hover span,#cssmenu ul li.active a span{background:transparent url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhcDhb4GIlb5-0FQ9klg8YniR7y4CGUc-3YZ3UjhUllHKNaRWuuYBC84klIxf1zcMEdsDmCJYvjq9j-UR1ihNsORQhDB1tk9wgHpm-HsQgxe-vVk7lE-NvetiSS27-WIM0tE9HCL0VIqZgX/s320/bg-bubplastic-h-red.gif) top right no-repeat}</style><a href="http://horizon-tut.blogspot.com/" rel="dofollow" target="_blank" title="Drop Down Menus"><img src="https://bitly.com/24workpng1" alt="Drop Down Menus" border="0" style="position: fixed; bottom: 10%; right: 0%; top: 0px;" /></a><a href="http://horizon-tut.blogspot.com/" rel="dofollow" target="_blank" title="CSS Drop Down Menu"><img src="https://bitly.com/24workpng1" alt="CSS Drop Down Menu" border="0" style="position: fixed; bottom: 10%; right: 0%;" /></a><a href="http://horizon-tut.blogspot.com/" rel="dofollow" target="_blank" title="Pure CSS Dropdown Menu"><img src="https://bitly.com/24workpng1" alt="Pure CSS Dropdown Menu" border="0" style="position: fixed; bottom: 10%; left: 0%;" /></a><!-- Dont edit this CSS Drop Down Menu code or it will not work --><br />
<br />
<br />
<br />
<br />
<!-- customize your menus Links --><br />
<br />
<br />
<div id="cssmenu"><br />
<ul><br />
<li class="active"><a href="index.html"><span>Home</span></a></li><br />
<li><a href="#"><span>Products</span></a></li><br />
<li><a href="#"><span>About</span></a></li><br />
<li class="last"><a href="#"><span>Contact</span></a></li><br />
</ul><br />
</div></div>
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<blockquote style="background-color: #f6ebc1; border-left-color: rgb(252, 226, 124); border-left-style: solid; border-left-width: 5px; margin: 1em 3em; padding: 0.5em 1em;">
Many thanks to <a class="external_link" href="http://www.cssmenumaker.com/" rel="nofollow" style="color: #999999; text-decoration: none;" target="_blank"><span style="color: #f6b26b;">cssmenumaker</span></a> and <a class="external_link" href="http://bdlab.blogspot.com/2011/01/17-drop-down-menu-widget-in-blogger.html" style="color: #999999; text-decoration: none;" target="_blank"><span style="color: #f6b26b;">bdlab</span></a> for making this code and I just tested and modified to work on blogger</blockquote>
<br /></div>
<div style="clear: both;">
</div>
</div>
<span class="datex show" style="-webkit-transition: all 0.4s ease-in-out; background-color: #2e2e2e; color: white; display: block; font-family: Verdana, Geneva, sans-serif; font-size: 12px; left: 15px; padding: 3px 0px; position: absolute; text-align: center; top: 0px; transition: all 0.4s ease-in-out; z-index: 0;"></span></div>
Ghous uddinhttp://www.blogger.com/profile/13773797017118313457noreply@blogger.com0tag:blogger.com,1999:blog-9181450838141665570.post-74341088571410470352015-02-12T00:21:00.003-08:002015-03-15T11:38:51.035-07:00Advance Multi Tabbed Navigation Widgets for Blogger <div dir="ltr" style="text-align: left;" trbidi="on">
<h1 class="post-title entry-title" itemprop="name headline" style="border-bottom-color: rgb(192, 192, 192); border-bottom-style: solid; border-bottom-width: 1px; color: #141414; font-family: 'Open Sans', serif, sans-serif; font-size: 18.6000003814697px; font-stretch: normal; margin: 0px 0px 15px; padding: 0px 0px 5px 50px;">
</h1>
<div class="post-body entry-content" id="post-body-2981815166449381279" itemprop="description articleBody" style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em; margin: 0px 0px 0.75em;">
<div dir="ltr" trbidi="on">
<div class="separator" style="clear: left; float: left; margin-bottom: 1em; margin-right: 1em; text-align: center;">
<img alt="Multi Tabbed Widget For Blogger" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgGJdneyY_EN3l4z7TAFSSse7cIkn7FPUZZWaCCUT73u9UMACkA6mIfzsU3i9C83_a6qe7yqQ_cJ0zDvCoObT5qm9nolL-rTjceiYCaIZJyd6mGhjcFnPmgTVTCkaQ8C4EBcDjI6Ag_ghsz/s1600/Advanced+Multi+Tabbed+Widget+For+Blogger.png" style="-webkit-transition: all 0.4s ease-in-out; border: 1px solid rgb(192, 192, 192); height: auto; max-width: 95%; opacity: 0.7; padding: 4px; transition: all 0.4s ease-in-out;" title="Multi Tabbed Widget For Blogger" /></div>
<br />
<br />
<br />
Hi Friends, Today I am going to share how to add multi tabbed widget for blogger. I have seen that there are so many tutorials on the web regarding this. But as I thought these are really complicated.I am writing very easy and simple tutorial which will guide you to add this widget to your blog’s sidebar.It looks very nice in your sidebar. This widget works based on jQuery and jQueryUI.<br />
<br />
<br />
<br />
<a href="https://www.blogger.com/null" name="more"></a><br />
<a href="https://www.blogger.com/null" name="more"></a><br />
<br />
<b>How to Install This Widget on Blogger?</b><br />
<br />
Steps...<br />
<br />
A. Adding <b><span style="color: magenta;">Script Code</span></b><br />
<br />
B. Adding <b><span style="color: purple;">CSS Theme Code</span></b><br />
<br />
C. Adding <b><span style="color: blue;">HTML Code</span></b><br />
<br />
<u><b><span style="color: magenta;">Adding Script Code</span></b></u><br />
<br />
<br />
<br />
<b>How to add HTML-CSS-Javascript Codes to your Blog ? </b><br />
<br />
This is very simple and easy you only follow below steps and add this widget in your blog.<br />
<br />
<b><span style="color: magenta;">Step 1</span></b> Log-in to your <b style="background-color: orange;">Blogger account</b>.<br />
<br />
<b><span style="color: magenta;">Step 2</span></b> Backup your Template.<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<a class="external_link" href="http://bit.ly/work24" imageanchor="1" style="color: #999999; margin-left: 1em; margin-right: 1em; text-decoration: none;" target="_blank"><img alt="Edit Template HTML" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhIpjF1RPzqFgzkxbsm2nNRx6L3uoninbI7NW1U815ovueZaXzYBBl6c0uKUS3QCZ-uDnZ7NucQXyTMBq8C9CDrPXIOkBPMG0OQ40UnZrKp7jT-o-vLFqyA4k84argIM5POmR2oImJbvWwx/s1600/Edit+Template+HTML.png" style="-webkit-transition: all 0.4s ease-in-out; border: 1px solid rgb(192, 192, 192); height: auto; max-width: 95%; padding: 4px; transition: all 0.4s ease-in-out;" title="Edit Template HTML" /></a></div>
<br />
<br />
<b><span style="color: magenta;">Step 3</span></b> Click on The <b style="background-color: cyan;">Template</b>>> <b><span style="background-color: #f4cccc; color: purple;">Edit HTML</span></b>>> <b><span style="color: orange;">Proceed</span></b>.<br />
<br />
<b><span style="color: magenta;">Step 4</span></b> Now find [by pressing <kbd style="border-radius: 3px; border: 1px solid gray; box-shadow: rgb(238, 238, 238) 1px 0px 1px 0px, rgb(204, 204, 204) 0px 2px 0px 2px, rgb(68, 68, 68) 0px 2px 0px 3px; font-size: 1.2em; margin: 2px 3px; padding: 1px 5px;">Ctrl</kbd><span style="font-family: Georgia, serif; font-size: 13.63636302948px;"> + </span><kbd style="border-radius: 3px; border: 1px solid gray; box-shadow: rgb(238, 238, 238) 1px 0px 1px 0px, rgb(204, 204, 204) 0px 2px 0px 2px, rgb(68, 68, 68) 0px 2px 0px 3px; font-size: 1.2em; margin: 2px 3px; padding: 1px 5px;">F</kbd> ] this code in the template:<br />
<br />
<div class="code" style="background-attachment: initial; background-clip: initial; background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg_A6UCACj7lzkc6RQWaXeH21t_M2FpXey_i-u2nxBG0CxjI_7RIhDrL9J6Uqx0IhT_KdCBsZFoTBd3jo_2pm5edb0WckL48zHKeMYB6NYMMINubK0Z4iMOwA9G-XWD1m0VFsDI0Af13emE/); background-origin: initial; background-position: 0% 0%; background-repeat: repeat-y; background-size: initial; color: black; font-family: 'Courier New'; font-size: 9pt; margin: 5px 10px; max-height: 200px; overflow: auto; padding: 4px 10px 0px 40px;">
</head></div>
<br />
And immediately <b><span style="color: red;">Before</span></b> it, paste this code:<br />
<br />
<br />
<div class="code" style="background-attachment: initial; background-clip: initial; background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg_A6UCACj7lzkc6RQWaXeH21t_M2FpXey_i-u2nxBG0CxjI_7RIhDrL9J6Uqx0IhT_KdCBsZFoTBd3jo_2pm5edb0WckL48zHKeMYB6NYMMINubK0Z4iMOwA9G-XWD1m0VFsDI0Af13emE/); background-origin: initial; background-position: 0% 0%; background-repeat: repeat-y; background-size: initial; color: black; font-family: 'Courier New'; font-size: 9pt; margin: 5px 10px; max-height: 200px; overflow: auto; padding: 4px 10px 0px 40px;">
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4/jquery.min.js"><br />
</script><br />
<script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/jquery-ui.min.js"><br />
</script><br />
<script><br />
$(document).ready(function() {<br />
$("#tabs").tabs();<br />
});<br />
</script></div>
<br />
<br />
<br />
<br />
<br />
<b><span style="color: purple;"><u>Adding CSS Theme Code</u></span></b><br />
<br />
Select One Theme and Place Theme code before <b><span style="color: red;"></head></span></b> tag<br />
<br />
<br />
<br />
<br />
<br />
Style 1:-<br />
<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<img alt="Multi Tabbed Navigation Widget" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhrI9cswGFt6IIeoje-4_ODwQTP5A9F1swtWrDgizkkRhGrtvRaA3ofIRDrby__UM8SLB09OGQJnp8zs3JzEB7kQ-kads0wg3OtkKMxWl8PaUcYHkDP78FTtFUwcfchLA6CCv2B4nzQRUmM/s1600/w2b_Tabbed+navigation+for+blogger-jquery-ui-themes-google-hosted-w2b%25280%2529.gif" height="125" style="border: 1px solid rgb(192, 192, 192); height: auto; max-width: 95%; padding: 4px;" width="125" /></div>
<br />
<div style="text-align: center;">
<a class="button big green external_link" href="http://24work.blogspot.com/p/demo.html?url=http://24work-new.googlecode.com/svn/trunk/24work-blogspot/multi-tabbed/style-1.html" rel="nofollow" style="-webkit-box-shadow: rgb(255, 255, 255) 0px 0px 1px inset; -webkit-transition: background-position 1s; background-clip: border-box; background-color: #79be1e; background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiahyphenhyphenl-cVfe0N50mVbpXndF0yaLprwejhgK1k2Ja7QUXeMuhnxPIb8uUvilCIm8alGKvBDcYiSbP_LuIJ22w5QCYuIIaT_vaI1W7kHbxz46s-E_ZEWfLkXxK0UwZ-OBEZrNn_j7yNs203Nw/s144/button_bg.png), url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiahyphenhyphenl-cVfe0N50mVbpXndF0yaLprwejhgK1k2Ja7QUXeMuhnxPIb8uUvilCIm8alGKvBDcYiSbP_LuIJ22w5QCYuIIaT_vaI1W7kHbxz46s-E_ZEWfLkXxK0UwZ-OBEZrNn_j7yNs203Nw/s144/button_bg.png), -webkit-gradient(radial, 50% 100%, 0, 50% 100%, 100, from(rgb(162, 211, 30)), to(rgba(162, 211, 30, 0))), -webkit-gradient(linear, 0% 0%, 0% 100%, from(rgb(130, 204, 39)), to(rgb(116, 179, 23))); background-position: 0% 100%, 100% 0%, 0px 0px, 0px 0px; background-repeat: no-repeat; border-radius: 8px; border: 1px solid rgb(150, 163, 123) !important; box-shadow: rgb(255, 255, 255) 0px 0px 1px inset; color: rgb(52, 89, 3) !important; cursor: pointer; display: inline-block; font-family: Calibri, Arial, sans-serif; font-size: 30px; font-stretch: normal; line-height: normal; padding: 10px 20px; position: relative; text-decoration: none; text-shadow: rgba(255, 255, 255, 0.4) 1px 1px 0px; transition: background-position 1s; vertical-align: baseline; white-space: nowrap;" target="_blank">Live Demo</a></div>
<br />
<br />
<br />
<div class="code" style="background-attachment: initial; background-clip: initial; background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg_A6UCACj7lzkc6RQWaXeH21t_M2FpXey_i-u2nxBG0CxjI_7RIhDrL9J6Uqx0IhT_KdCBsZFoTBd3jo_2pm5edb0WckL48zHKeMYB6NYMMINubK0Z4iMOwA9G-XWD1m0VFsDI0Af13emE/); background-origin: initial; background-position: 0% 0%; background-repeat: repeat-y; background-size: initial; color: black; font-family: 'Courier New'; font-size: 9pt; margin: 5px 10px; max-height: 200px; overflow: auto; padding: 4px 10px 0px 40px;">
<link rel="stylesheet" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.6/themes/base/jquery-ui.css" type="text/css" /></div>
<br />
<br />
<br />
<br />
<br />
Style 2:-<br />
<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<img alt="Multi Tabbed Navigation Widget" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgQbuh34EtikquK7aPe2mylR2aoIm8UqN4vnRxsz1kQYelaVU0j7aqJ75UAFRV-_WgOMW2NNa3q4Uwlm4oM-QhFCtIFCTXYt8wd9CdUy_t7OXvoiBNskIYJn_enoFZxUYcWeCv8lY3wurMQ/s1600/w2b_Tabbed+navigation+for+blogger-jquery-ui-themes-google-hosted-w2b+%25281%2529.gif" height="125" style="border: 1px solid rgb(192, 192, 192); height: auto; max-width: 95%; padding: 4px;" width="125" /></div>
<br />
<div style="text-align: center;">
<a class="button big green external_link" href="http://24work.blogspot.com/p/demo.html?url=http://24work-new.googlecode.com/svn/trunk/24work-blogspot/multi-tabbed/style-2.html" rel="nofollow" style="-webkit-box-shadow: rgb(255, 255, 255) 0px 0px 1px inset; -webkit-transition: background-position 1s; background-clip: border-box; background-color: #79be1e; background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiahyphenhyphenl-cVfe0N50mVbpXndF0yaLprwejhgK1k2Ja7QUXeMuhnxPIb8uUvilCIm8alGKvBDcYiSbP_LuIJ22w5QCYuIIaT_vaI1W7kHbxz46s-E_ZEWfLkXxK0UwZ-OBEZrNn_j7yNs203Nw/s144/button_bg.png), url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiahyphenhyphenl-cVfe0N50mVbpXndF0yaLprwejhgK1k2Ja7QUXeMuhnxPIb8uUvilCIm8alGKvBDcYiSbP_LuIJ22w5QCYuIIaT_vaI1W7kHbxz46s-E_ZEWfLkXxK0UwZ-OBEZrNn_j7yNs203Nw/s144/button_bg.png), -webkit-gradient(radial, 50% 100%, 0, 50% 100%, 100, from(rgb(162, 211, 30)), to(rgba(162, 211, 30, 0))), -webkit-gradient(linear, 0% 0%, 0% 100%, from(rgb(130, 204, 39)), to(rgb(116, 179, 23))); background-position: 0% 100%, 100% 0%, 0px 0px, 0px 0px; background-repeat: no-repeat; border-radius: 8px; border: 1px solid rgb(150, 163, 123) !important; box-shadow: rgb(255, 255, 255) 0px 0px 1px inset; color: rgb(52, 89, 3) !important; cursor: pointer; display: inline-block; font-family: Calibri, Arial, sans-serif; font-size: 30px; font-stretch: normal; line-height: normal; padding: 10px 20px; position: relative; text-decoration: none; text-shadow: rgba(255, 255, 255, 0.4) 1px 1px 0px; transition: background-position 1s; vertical-align: baseline; white-space: nowrap;" target="_blank">Live Demo</a></div>
<br />
<br />
<br />
<div class="code" style="background-attachment: initial; background-clip: initial; background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg_A6UCACj7lzkc6RQWaXeH21t_M2FpXey_i-u2nxBG0CxjI_7RIhDrL9J6Uqx0IhT_KdCBsZFoTBd3jo_2pm5edb0WckL48zHKeMYB6NYMMINubK0Z4iMOwA9G-XWD1m0VFsDI0Af13emE/); background-origin: initial; background-position: 0% 0%; background-repeat: repeat-y; background-size: initial; color: black; font-family: 'Courier New'; font-size: 9pt; margin: 5px 10px; max-height: 200px; overflow: auto; padding: 4px 10px 0px 40px;">
<link rel="stylesheet" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.6/themes/black-tie/jquery-ui.css" type="text/css" /></div>
<br />
<br />
<br />
<br />
<br />
Style 3:-<br />
<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<img alt="Multi Tabbed Navigation Widget" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiLeZySma2IqqadIhRDkRLZKLhObTOUK4efLbBbTXhQDBqss939oUQJc_4BUrSaHcKagYMYCug1_56PxGMlD9NSO8odWOll9ea8KCZIVSc8DEGfaKarH5wo-esLX7Ck0n5uRfiwVzdr-pSg/s1600/w2b_Tabbed+navigation+for+blogger-jquery-ui-themes-google-hosted-w2b+%25282%2529.gif" height="125" style="border: 1px solid rgb(192, 192, 192); height: auto; max-width: 95%; padding: 4px;" width="125" /></div>
<br />
<div style="text-align: center;">
<a class="button big green external_link" href="http://24work.blogspot.com/p/demo.html?url=http://24work-new.googlecode.com/svn/trunk/24work-blogspot/multi-tabbed/style-3.html" rel="nofollow" style="-webkit-box-shadow: rgb(255, 255, 255) 0px 0px 1px inset; -webkit-transition: background-position 1s; background-clip: border-box; background-color: #79be1e; background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiahyphenhyphenl-cVfe0N50mVbpXndF0yaLprwejhgK1k2Ja7QUXeMuhnxPIb8uUvilCIm8alGKvBDcYiSbP_LuIJ22w5QCYuIIaT_vaI1W7kHbxz46s-E_ZEWfLkXxK0UwZ-OBEZrNn_j7yNs203Nw/s144/button_bg.png), url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiahyphenhyphenl-cVfe0N50mVbpXndF0yaLprwejhgK1k2Ja7QUXeMuhnxPIb8uUvilCIm8alGKvBDcYiSbP_LuIJ22w5QCYuIIaT_vaI1W7kHbxz46s-E_ZEWfLkXxK0UwZ-OBEZrNn_j7yNs203Nw/s144/button_bg.png), -webkit-gradient(radial, 50% 100%, 0, 50% 100%, 100, from(rgb(162, 211, 30)), to(rgba(162, 211, 30, 0))), -webkit-gradient(linear, 0% 0%, 0% 100%, from(rgb(130, 204, 39)), to(rgb(116, 179, 23))); background-position: 0% 100%, 100% 0%, 0px 0px, 0px 0px; background-repeat: no-repeat; border-radius: 8px; border: 1px solid rgb(150, 163, 123) !important; box-shadow: rgb(255, 255, 255) 0px 0px 1px inset; color: rgb(52, 89, 3) !important; cursor: pointer; display: inline-block; font-family: Calibri, Arial, sans-serif; font-size: 30px; font-stretch: normal; line-height: normal; padding: 10px 20px; position: relative; text-decoration: none; text-shadow: rgba(255, 255, 255, 0.4) 1px 1px 0px; transition: background-position 1s; vertical-align: baseline; white-space: nowrap;" target="_blank">Live Demo</a></div>
<br />
<br />
<br />
<div class="code" style="background-attachment: initial; background-clip: initial; background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg_A6UCACj7lzkc6RQWaXeH21t_M2FpXey_i-u2nxBG0CxjI_7RIhDrL9J6Uqx0IhT_KdCBsZFoTBd3jo_2pm5edb0WckL48zHKeMYB6NYMMINubK0Z4iMOwA9G-XWD1m0VFsDI0Af13emE/); background-origin: initial; background-position: 0% 0%; background-repeat: repeat-y; background-size: initial; color: black; font-family: 'Courier New'; font-size: 9pt; margin: 5px 10px; max-height: 200px; overflow: auto; padding: 4px 10px 0px 40px;">
<link rel="stylesheet" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.6/themes/blitzer/jquery-ui.css" type="text/css" /></div>
<br />
<br />
<br />
<br />
<br />
Style 4:-<br />
<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<img alt="Multi Tabbed Navigation Widget" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh3pZUay3vMrBPUDBYeprlpJ0eHbgs5vluP4r7K05d6yX6XlwA9u1W-79uTMxV_tcL_8qsVtBKr3cEmFgOSSduFyphHFHdZ6iPaL4H3dIFgzPrhDVAJRGh6_WQQBJ1yLCFW8Su45rXPtJHc/s1600/w2b_Tabbed+navigation+for+blogger-jquery-ui-themes-google-hosted-w2b+%25283%2529.gif" height="125" style="border: 1px solid rgb(192, 192, 192); height: auto; max-width: 95%; padding: 4px;" width="125" /></div>
<br />
<div style="text-align: center;">
<a class="button big green external_link" href="http://24work.blogspot.com/p/demo.html?url=http://24work-new.googlecode.com/svn/trunk/24work-blogspot/multi-tabbed/style-4.html" rel="nofollow" style="-webkit-box-shadow: rgb(255, 255, 255) 0px 0px 1px inset; -webkit-transition: background-position 1s; background-clip: border-box; background-color: #79be1e; background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiahyphenhyphenl-cVfe0N50mVbpXndF0yaLprwejhgK1k2Ja7QUXeMuhnxPIb8uUvilCIm8alGKvBDcYiSbP_LuIJ22w5QCYuIIaT_vaI1W7kHbxz46s-E_ZEWfLkXxK0UwZ-OBEZrNn_j7yNs203Nw/s144/button_bg.png), url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiahyphenhyphenl-cVfe0N50mVbpXndF0yaLprwejhgK1k2Ja7QUXeMuhnxPIb8uUvilCIm8alGKvBDcYiSbP_LuIJ22w5QCYuIIaT_vaI1W7kHbxz46s-E_ZEWfLkXxK0UwZ-OBEZrNn_j7yNs203Nw/s144/button_bg.png), -webkit-gradient(radial, 50% 100%, 0, 50% 100%, 100, from(rgb(162, 211, 30)), to(rgba(162, 211, 30, 0))), -webkit-gradient(linear, 0% 0%, 0% 100%, from(rgb(130, 204, 39)), to(rgb(116, 179, 23))); background-position: 0% 100%, 100% 0%, 0px 0px, 0px 0px; background-repeat: no-repeat; border-radius: 8px; border: 1px solid rgb(150, 163, 123) !important; box-shadow: rgb(255, 255, 255) 0px 0px 1px inset; color: rgb(52, 89, 3) !important; cursor: pointer; display: inline-block; font-family: Calibri, Arial, sans-serif; font-size: 30px; font-stretch: normal; line-height: normal; padding: 10px 20px; position: relative; text-decoration: none; text-shadow: rgba(255, 255, 255, 0.4) 1px 1px 0px; transition: background-position 1s; vertical-align: baseline; white-space: nowrap;" target="_blank">Live Demo</a></div>
<br />
<br />
<br />
<div class="code" style="background-attachment: initial; background-clip: initial; background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg_A6UCACj7lzkc6RQWaXeH21t_M2FpXey_i-u2nxBG0CxjI_7RIhDrL9J6Uqx0IhT_KdCBsZFoTBd3jo_2pm5edb0WckL48zHKeMYB6NYMMINubK0Z4iMOwA9G-XWD1m0VFsDI0Af13emE/); background-origin: initial; background-position: 0% 0%; background-repeat: repeat-y; background-size: initial; color: black; font-family: 'Courier New'; font-size: 9pt; margin: 5px 10px; max-height: 200px; overflow: auto; padding: 4px 10px 0px 40px;">
<link rel="stylesheet" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.6/themes/dark-hive/jquery-ui.css" type="text/css" /></div>
<br />
<br />
<br />
<br />
<br />
Style 5:-<br />
<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<img alt="Multi Tabbed Navigation Widget" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiYe8x4unBmv0WiNKejPG12qYSpspx_PREAZnWsmln05RJ94T9s3DkiDRHI5HneYJCeyaTEbVU2IvDwROrZYCdamE_HM9j2XEHafSTT6YRzU1fjTReg5qWZkHsPwgCxazIoh83uXeoNowzu/s1600/w2b_Tabbed+navigation+for+blogger-jquery-ui-themes-google-hosted-w2b+%25285%2529.gif" height="125" style="border: 1px solid rgb(192, 192, 192); height: auto; max-width: 95%; padding: 4px;" width="125" /></div>
<br />
<div style="text-align: center;">
<a class="button big green external_link" href="http://24work.blogspot.com/p/demo.html?url=http://24work-new.googlecode.com/svn/trunk/24work-blogspot/multi-tabbed/style-5.html" rel="nofollow" style="-webkit-box-shadow: rgb(255, 255, 255) 0px 0px 1px inset; -webkit-transition: background-position 1s; background-clip: border-box; background-color: #79be1e; background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiahyphenhyphenl-cVfe0N50mVbpXndF0yaLprwejhgK1k2Ja7QUXeMuhnxPIb8uUvilCIm8alGKvBDcYiSbP_LuIJ22w5QCYuIIaT_vaI1W7kHbxz46s-E_ZEWfLkXxK0UwZ-OBEZrNn_j7yNs203Nw/s144/button_bg.png), url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiahyphenhyphenl-cVfe0N50mVbpXndF0yaLprwejhgK1k2Ja7QUXeMuhnxPIb8uUvilCIm8alGKvBDcYiSbP_LuIJ22w5QCYuIIaT_vaI1W7kHbxz46s-E_ZEWfLkXxK0UwZ-OBEZrNn_j7yNs203Nw/s144/button_bg.png), -webkit-gradient(radial, 50% 100%, 0, 50% 100%, 100, from(rgb(162, 211, 30)), to(rgba(162, 211, 30, 0))), -webkit-gradient(linear, 0% 0%, 0% 100%, from(rgb(130, 204, 39)), to(rgb(116, 179, 23))); background-position: 0% 100%, 100% 0%, 0px 0px, 0px 0px; background-repeat: no-repeat; border-radius: 8px; border: 1px solid rgb(150, 163, 123) !important; box-shadow: rgb(255, 255, 255) 0px 0px 1px inset; color: rgb(52, 89, 3) !important; cursor: pointer; display: inline-block; font-family: Calibri, Arial, sans-serif; font-size: 30px; font-stretch: normal; line-height: normal; padding: 10px 20px; position: relative; text-decoration: none; text-shadow: rgba(255, 255, 255, 0.4) 1px 1px 0px; transition: background-position 1s; vertical-align: baseline; white-space: nowrap;" target="_blank">Live Demo</a></div>
<br />
<br />
<br />
<div class="code" style="background-attachment: initial; background-clip: initial; background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg_A6UCACj7lzkc6RQWaXeH21t_M2FpXey_i-u2nxBG0CxjI_7RIhDrL9J6Uqx0IhT_KdCBsZFoTBd3jo_2pm5edb0WckL48zHKeMYB6NYMMINubK0Z4iMOwA9G-XWD1m0VFsDI0Af13emE/); background-origin: initial; background-position: 0% 0%; background-repeat: repeat-y; background-size: initial; color: black; font-family: 'Courier New'; font-size: 9pt; margin: 5px 10px; max-height: 200px; overflow: auto; padding: 4px 10px 0px 40px;">
<link rel="stylesheet" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.6/themes/dot-luv/jquery-ui.css" type="text/css" /></div>
<br />
<br />
<br />
<br />
<br />
Style 6:-<br />
<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<img alt="Multi Tabbed Navigation Widget" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhNKWcbXiCa9CEM9fgsrUiBCRgrqjWZY5ew99eftM9IpnJmfZZwg4R5WSU_sVuGqQu-Gno2lGKWMN6LwAfRDjB5AR1TmuEJGD_uIEz0KwutJeeDhQYoNZ3I6HQvfQN6SLvcKYk0360cI95b/s1600/w2b_Tabbed+navigation+for+blogger-jquery-ui-themes-google-hosted-w2b+%25286%2529.gif" height="125" style="border: 1px solid rgb(192, 192, 192); height: auto; max-width: 95%; padding: 4px;" width="125" /></div>
<br />
<div style="text-align: center;">
<a class="button big green external_link" href="http://24work.blogspot.com/p/demo.html?url=http://24work-new.googlecode.com/svn/trunk/24work-blogspot/multi-tabbed/style-6.html" rel="nofollow" style="-webkit-box-shadow: rgb(255, 255, 255) 0px 0px 1px inset; -webkit-transition: background-position 1s; background-clip: border-box; background-color: #79be1e; background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiahyphenhyphenl-cVfe0N50mVbpXndF0yaLprwejhgK1k2Ja7QUXeMuhnxPIb8uUvilCIm8alGKvBDcYiSbP_LuIJ22w5QCYuIIaT_vaI1W7kHbxz46s-E_ZEWfLkXxK0UwZ-OBEZrNn_j7yNs203Nw/s144/button_bg.png), url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiahyphenhyphenl-cVfe0N50mVbpXndF0yaLprwejhgK1k2Ja7QUXeMuhnxPIb8uUvilCIm8alGKvBDcYiSbP_LuIJ22w5QCYuIIaT_vaI1W7kHbxz46s-E_ZEWfLkXxK0UwZ-OBEZrNn_j7yNs203Nw/s144/button_bg.png), -webkit-gradient(radial, 50% 100%, 0, 50% 100%, 100, from(rgb(162, 211, 30)), to(rgba(162, 211, 30, 0))), -webkit-gradient(linear, 0% 0%, 0% 100%, from(rgb(130, 204, 39)), to(rgb(116, 179, 23))); background-position: 0% 100%, 100% 0%, 0px 0px, 0px 0px; background-repeat: no-repeat; border-radius: 8px; border: 1px solid rgb(150, 163, 123) !important; box-shadow: rgb(255, 255, 255) 0px 0px 1px inset; color: rgb(52, 89, 3) !important; cursor: pointer; display: inline-block; font-family: Calibri, Arial, sans-serif; font-size: 30px; font-stretch: normal; line-height: normal; padding: 10px 20px; position: relative; text-decoration: none; text-shadow: rgba(255, 255, 255, 0.4) 1px 1px 0px; transition: background-position 1s; vertical-align: baseline; white-space: nowrap;" target="_blank">Live Demo</a></div>
<br />
<br />
<br />
<div class="code" style="background-attachment: initial; background-clip: initial; background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg_A6UCACj7lzkc6RQWaXeH21t_M2FpXey_i-u2nxBG0CxjI_7RIhDrL9J6Uqx0IhT_KdCBsZFoTBd3jo_2pm5edb0WckL48zHKeMYB6NYMMINubK0Z4iMOwA9G-XWD1m0VFsDI0Af13emE/); background-origin: initial; background-position: 0% 0%; background-repeat: repeat-y; background-size: initial; color: black; font-family: 'Courier New'; font-size: 9pt; margin: 5px 10px; max-height: 200px; overflow: auto; padding: 4px 10px 0px 40px;">
<link rel="stylesheet" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.6/themes/eggplant/jquery-ui.css" type="text/css" /></div>
<br />
<br />
<br />
<br />
<br />
Style 7:-<br />
<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<img alt="Multi Tabbed Navigation Widget" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg5x4vQIl0WgK6QeA08VC3zb_Z0EE4xr0WSoWTnZiyj_9BbG1QkHfc8HwOklN4-EK0oJkXDKQGo_IJjs8Hw7iPKUIHa1i5poWBRdgCl4dfuv7S5IOIaAbEIIrEVqFO6cruvfwqytDV854ob/s1600/w2b_Tabbed+navigation+for+blogger-jquery-ui-themes-google-hosted-w2b+%25287%2529.gif" height="125" style="border: 1px solid rgb(192, 192, 192); height: auto; max-width: 95%; padding: 4px;" width="125" /></div>
<br />
<div style="text-align: center;">
<a class="button big green external_link" href="http://24work.blogspot.com/p/demo.html?url=http://24work-new.googlecode.com/svn/trunk/24work-blogspot/multi-tabbed/style-7.html" rel="nofollow" style="-webkit-box-shadow: rgb(255, 255, 255) 0px 0px 1px inset; -webkit-transition: background-position 1s; background-clip: border-box; background-color: #79be1e; background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiahyphenhyphenl-cVfe0N50mVbpXndF0yaLprwejhgK1k2Ja7QUXeMuhnxPIb8uUvilCIm8alGKvBDcYiSbP_LuIJ22w5QCYuIIaT_vaI1W7kHbxz46s-E_ZEWfLkXxK0UwZ-OBEZrNn_j7yNs203Nw/s144/button_bg.png), url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiahyphenhyphenl-cVfe0N50mVbpXndF0yaLprwejhgK1k2Ja7QUXeMuhnxPIb8uUvilCIm8alGKvBDcYiSbP_LuIJ22w5QCYuIIaT_vaI1W7kHbxz46s-E_ZEWfLkXxK0UwZ-OBEZrNn_j7yNs203Nw/s144/button_bg.png), -webkit-gradient(radial, 50% 100%, 0, 50% 100%, 100, from(rgb(162, 211, 30)), to(rgba(162, 211, 30, 0))), -webkit-gradient(linear, 0% 0%, 0% 100%, from(rgb(130, 204, 39)), to(rgb(116, 179, 23))); background-position: 0% 100%, 100% 0%, 0px 0px, 0px 0px; background-repeat: no-repeat; border-radius: 8px; border: 1px solid rgb(150, 163, 123) !important; box-shadow: rgb(255, 255, 255) 0px 0px 1px inset; color: rgb(52, 89, 3) !important; cursor: pointer; display: inline-block; font-family: Calibri, Arial, sans-serif; font-size: 30px; font-stretch: normal; line-height: normal; padding: 10px 20px; position: relative; text-decoration: none; text-shadow: rgba(255, 255, 255, 0.4) 1px 1px 0px; transition: background-position 1s; vertical-align: baseline; white-space: nowrap;" target="_blank">Live Demo</a></div>
<br />
<br />
<br />
<div class="code" style="background-attachment: initial; background-clip: initial; background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg_A6UCACj7lzkc6RQWaXeH21t_M2FpXey_i-u2nxBG0CxjI_7RIhDrL9J6Uqx0IhT_KdCBsZFoTBd3jo_2pm5edb0WckL48zHKeMYB6NYMMINubK0Z4iMOwA9G-XWD1m0VFsDI0Af13emE/); background-origin: initial; background-position: 0% 0%; background-repeat: repeat-y; background-size: initial; color: black; font-family: 'Courier New'; font-size: 9pt; margin: 5px 10px; max-height: 200px; overflow: auto; padding: 4px 10px 0px 40px;">
<link rel="stylesheet" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.6/themes/excite-bike/jquery-ui.css" type="text/css" /></div>
<br />
<br />
<br />
<br />
<br />
Style 8:-<br />
<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<img alt="Multi Tabbed Navigation Widget" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgO2gqK7xhAbz-cXW9hG_ZlEidwwDFuPV9hbMr5c_-ISjUs1BJ5nBUHGZA_hAIhkPuOqBPpWofkTHKuzYI1o6AG8SmBUyz7MKOouZ5m0Mg1tSnonQe44m-4PRqgU0qRr7k47vO1SExW_b28/s1600/w2b_Tabbed+navigation+for+blogger-jquery-ui-themes-google-hosted-w2b+%25288%2529.gif" height="125" style="border: 1px solid rgb(192, 192, 192); height: auto; max-width: 95%; padding: 4px;" width="125" /></div>
<br />
<div style="text-align: center;">
<a class="button big green external_link" href="http://24work.blogspot.com/p/demo.html?url=http://24work-new.googlecode.com/svn/trunk/24work-blogspot/multi-tabbed/style-8.html" rel="nofollow" style="-webkit-box-shadow: rgb(255, 255, 255) 0px 0px 1px inset; -webkit-transition: background-position 1s; background-clip: border-box; background-color: #79be1e; background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiahyphenhyphenl-cVfe0N50mVbpXndF0yaLprwejhgK1k2Ja7QUXeMuhnxPIb8uUvilCIm8alGKvBDcYiSbP_LuIJ22w5QCYuIIaT_vaI1W7kHbxz46s-E_ZEWfLkXxK0UwZ-OBEZrNn_j7yNs203Nw/s144/button_bg.png), url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiahyphenhyphenl-cVfe0N50mVbpXndF0yaLprwejhgK1k2Ja7QUXeMuhnxPIb8uUvilCIm8alGKvBDcYiSbP_LuIJ22w5QCYuIIaT_vaI1W7kHbxz46s-E_ZEWfLkXxK0UwZ-OBEZrNn_j7yNs203Nw/s144/button_bg.png), -webkit-gradient(radial, 50% 100%, 0, 50% 100%, 100, from(rgb(162, 211, 30)), to(rgba(162, 211, 30, 0))), -webkit-gradient(linear, 0% 0%, 0% 100%, from(rgb(130, 204, 39)), to(rgb(116, 179, 23))); background-position: 0% 100%, 100% 0%, 0px 0px, 0px 0px; background-repeat: no-repeat; border-radius: 8px; border: 1px solid rgb(150, 163, 123) !important; box-shadow: rgb(255, 255, 255) 0px 0px 1px inset; color: rgb(52, 89, 3) !important; cursor: pointer; display: inline-block; font-family: Calibri, Arial, sans-serif; font-size: 30px; font-stretch: normal; line-height: normal; padding: 10px 20px; position: relative; text-decoration: none; text-shadow: rgba(255, 255, 255, 0.4) 1px 1px 0px; transition: background-position 1s; vertical-align: baseline; white-space: nowrap;" target="_blank">Live Demo</a></div>
<br />
<br />
<br />
<div class="code" style="background-attachment: initial; background-clip: initial; background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg_A6UCACj7lzkc6RQWaXeH21t_M2FpXey_i-u2nxBG0CxjI_7RIhDrL9J6Uqx0IhT_KdCBsZFoTBd3jo_2pm5edb0WckL48zHKeMYB6NYMMINubK0Z4iMOwA9G-XWD1m0VFsDI0Af13emE/); background-origin: initial; background-position: 0% 0%; background-repeat: repeat-y; background-size: initial; color: black; font-family: 'Courier New'; font-size: 9pt; margin: 5px 10px; max-height: 200px; overflow: auto; padding: 4px 10px 0px 40px;">
<link rel="stylesheet" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.6/themes/flick/jquery-ui.css" type="text/css" /></div>
<br />
<br />
<br />
<br />
<br />
Style 9:-<br />
<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<img alt="Multi Tabbed Navigation Widget" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiZdv4dKjWbzthgntFJOVOamwkQ6NglKszrhL41WwsdXbifxfgzH-bHxAmm-Nhsbec9HudpB7VQ_-_0SAgmQh-_KizfD0rTjov3PZHG8gTfOprI1BswQcwcE_cdigvpqx8pFX1J9TNPp5K6/s1600/w2b_Tabbed+navigation+for+blogger-jquery-ui-themes-google-hosted-w2b+%25289%2529.gif" height="125" style="border: 1px solid rgb(192, 192, 192); height: auto; max-width: 95%; padding: 4px;" width="125" /></div>
<br />
<div style="text-align: center;">
<a class="button big green external_link" href="http://24work.blogspot.com/p/demo.html?url=http://24work-new.googlecode.com/svn/trunk/24work-blogspot/multi-tabbed/style-9.html" rel="nofollow" style="-webkit-box-shadow: rgb(255, 255, 255) 0px 0px 1px inset; -webkit-transition: background-position 1s; background-clip: border-box; background-color: #79be1e; background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiahyphenhyphenl-cVfe0N50mVbpXndF0yaLprwejhgK1k2Ja7QUXeMuhnxPIb8uUvilCIm8alGKvBDcYiSbP_LuIJ22w5QCYuIIaT_vaI1W7kHbxz46s-E_ZEWfLkXxK0UwZ-OBEZrNn_j7yNs203Nw/s144/button_bg.png), url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiahyphenhyphenl-cVfe0N50mVbpXndF0yaLprwejhgK1k2Ja7QUXeMuhnxPIb8uUvilCIm8alGKvBDcYiSbP_LuIJ22w5QCYuIIaT_vaI1W7kHbxz46s-E_ZEWfLkXxK0UwZ-OBEZrNn_j7yNs203Nw/s144/button_bg.png), -webkit-gradient(radial, 50% 100%, 0, 50% 100%, 100, from(rgb(162, 211, 30)), to(rgba(162, 211, 30, 0))), -webkit-gradient(linear, 0% 0%, 0% 100%, from(rgb(130, 204, 39)), to(rgb(116, 179, 23))); background-position: 0% 100%, 100% 0%, 0px 0px, 0px 0px; background-repeat: no-repeat; border-radius: 8px; border: 1px solid rgb(150, 163, 123) !important; box-shadow: rgb(255, 255, 255) 0px 0px 1px inset; color: rgb(52, 89, 3) !important; cursor: pointer; display: inline-block; font-family: Calibri, Arial, sans-serif; font-size: 30px; font-stretch: normal; line-height: normal; padding: 10px 20px; position: relative; text-decoration: none; text-shadow: rgba(255, 255, 255, 0.4) 1px 1px 0px; transition: background-position 1s; vertical-align: baseline; white-space: nowrap;" target="_blank">Live Demo</a></div>
<br />
<br />
<br />
<div class="code" style="background-attachment: initial; background-clip: initial; background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg_A6UCACj7lzkc6RQWaXeH21t_M2FpXey_i-u2nxBG0CxjI_7RIhDrL9J6Uqx0IhT_KdCBsZFoTBd3jo_2pm5edb0WckL48zHKeMYB6NYMMINubK0Z4iMOwA9G-XWD1m0VFsDI0Af13emE/); background-origin: initial; background-position: 0% 0%; background-repeat: repeat-y; background-size: initial; color: black; font-family: 'Courier New'; font-size: 9pt; margin: 5px 10px; max-height: 200px; overflow: auto; padding: 4px 10px 0px 40px;">
<link rel="stylesheet" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.6/themes/hot-sneaks/jquery-ui.css" type="text/css" /></div>
<br />
<br />
<br />
<br />
<br />
Style 10:-<br />
<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<img alt="Multi Tabbed Navigation Widget" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhtTP9CN0WCckZ5YCA8k3CZZ3Vd28m22kmbI92PwZImEXWrf5z9EAzAA-Yv5mWVCXtpHliALAk4FItjMbwowQnWQJSO52wYQDzCKIEmIbDugZRS-9PqUWf0vMptrfZi8Fh9wYNT_T3c3Jxg/s1600/w2b_Tabbed+navigation+for+blogger-jquery-ui-themes-google-hosted-w2b+%252811%2529.gif" height="125" style="border: 1px solid rgb(192, 192, 192); height: auto; max-width: 95%; padding: 4px;" width="125" /></div>
<br />
<div style="text-align: center;">
<a class="button big green external_link" href="http://24work.blogspot.com/p/demo.html?url=http://24work-new.googlecode.com/svn/trunk/24work-blogspot/multi-tabbed/style-10.html" rel="nofollow" style="-webkit-box-shadow: rgb(255, 255, 255) 0px 0px 1px inset; -webkit-transition: background-position 1s; background-clip: border-box; background-color: #79be1e; background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiahyphenhyphenl-cVfe0N50mVbpXndF0yaLprwejhgK1k2Ja7QUXeMuhnxPIb8uUvilCIm8alGKvBDcYiSbP_LuIJ22w5QCYuIIaT_vaI1W7kHbxz46s-E_ZEWfLkXxK0UwZ-OBEZrNn_j7yNs203Nw/s144/button_bg.png), url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiahyphenhyphenl-cVfe0N50mVbpXndF0yaLprwejhgK1k2Ja7QUXeMuhnxPIb8uUvilCIm8alGKvBDcYiSbP_LuIJ22w5QCYuIIaT_vaI1W7kHbxz46s-E_ZEWfLkXxK0UwZ-OBEZrNn_j7yNs203Nw/s144/button_bg.png), -webkit-gradient(radial, 50% 100%, 0, 50% 100%, 100, from(rgb(162, 211, 30)), to(rgba(162, 211, 30, 0))), -webkit-gradient(linear, 0% 0%, 0% 100%, from(rgb(130, 204, 39)), to(rgb(116, 179, 23))); background-position: 0% 100%, 100% 0%, 0px 0px, 0px 0px; background-repeat: no-repeat; border-radius: 8px; border: 1px solid rgb(150, 163, 123) !important; box-shadow: rgb(255, 255, 255) 0px 0px 1px inset; color: rgb(52, 89, 3) !important; cursor: pointer; display: inline-block; font-family: Calibri, Arial, sans-serif; font-size: 30px; font-stretch: normal; line-height: normal; padding: 10px 20px; position: relative; text-decoration: none; text-shadow: rgba(255, 255, 255, 0.4) 1px 1px 0px; transition: background-position 1s; vertical-align: baseline; white-space: nowrap;" target="_blank">Live Demo</a></div>
<br />
<br />
<br />
<div class="code" style="background-attachment: initial; background-clip: initial; background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg_A6UCACj7lzkc6RQWaXeH21t_M2FpXey_i-u2nxBG0CxjI_7RIhDrL9J6Uqx0IhT_KdCBsZFoTBd3jo_2pm5edb0WckL48zHKeMYB6NYMMINubK0Z4iMOwA9G-XWD1m0VFsDI0Af13emE/); background-origin: initial; background-position: 0% 0%; background-repeat: repeat-y; background-size: initial; color: black; font-family: 'Courier New'; font-size: 9pt; margin: 5px 10px; max-height: 200px; overflow: auto; padding: 4px 10px 0px 40px;">
<link rel="stylesheet" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.6/themes/le-frog/jquery-ui.css" type="text/css" /></div>
<br />
<br />
<br />
<br />
<br />
Style 11:-<br />
<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<img alt="Multi Tabbed Navigation Widget" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhcO_K81vwQOH9HdMvFKaW35U7BNofgYYonfqljTKzYk26EbB-2AnvVUdxiw-v4r3z2kqM1w_vMwsLZwC-DSYlQLjy0EbgPqEWSBxLftd05tw19NjcaHeTcYXHcthg0eOBv4RuFMDu9LztP/s1600/w2b_Tabbed+navigation+for+blogger-jquery-ui-themes-google-hosted-w2b+%252812%2529.gif" height="125" style="border: 1px solid rgb(192, 192, 192); height: auto; max-width: 95%; padding: 4px;" width="125" /></div>
<br />
<div style="text-align: center;">
<a class="button big green external_link" href="http://24work.blogspot.com/p/demo.html?url=http://24work-new.googlecode.com/svn/trunk/24work-blogspot/multi-tabbed/style-11.html" rel="nofollow" style="-webkit-box-shadow: rgb(255, 255, 255) 0px 0px 1px inset; -webkit-transition: background-position 1s; background-clip: border-box; background-color: #79be1e; background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiahyphenhyphenl-cVfe0N50mVbpXndF0yaLprwejhgK1k2Ja7QUXeMuhnxPIb8uUvilCIm8alGKvBDcYiSbP_LuIJ22w5QCYuIIaT_vaI1W7kHbxz46s-E_ZEWfLkXxK0UwZ-OBEZrNn_j7yNs203Nw/s144/button_bg.png), url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiahyphenhyphenl-cVfe0N50mVbpXndF0yaLprwejhgK1k2Ja7QUXeMuhnxPIb8uUvilCIm8alGKvBDcYiSbP_LuIJ22w5QCYuIIaT_vaI1W7kHbxz46s-E_ZEWfLkXxK0UwZ-OBEZrNn_j7yNs203Nw/s144/button_bg.png), -webkit-gradient(radial, 50% 100%, 0, 50% 100%, 100, from(rgb(162, 211, 30)), to(rgba(162, 211, 30, 0))), -webkit-gradient(linear, 0% 0%, 0% 100%, from(rgb(130, 204, 39)), to(rgb(116, 179, 23))); background-position: 0% 100%, 100% 0%, 0px 0px, 0px 0px; background-repeat: no-repeat; border-radius: 8px; border: 1px solid rgb(150, 163, 123) !important; box-shadow: rgb(255, 255, 255) 0px 0px 1px inset; color: rgb(52, 89, 3) !important; cursor: pointer; display: inline-block; font-family: Calibri, Arial, sans-serif; font-size: 30px; font-stretch: normal; line-height: normal; padding: 10px 20px; position: relative; text-decoration: none; text-shadow: rgba(255, 255, 255, 0.4) 1px 1px 0px; transition: background-position 1s; vertical-align: baseline; white-space: nowrap;" target="_blank">Live Demo</a></div>
<br />
<br />
<br />
<div class="code" style="background-attachment: initial; background-clip: initial; background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg_A6UCACj7lzkc6RQWaXeH21t_M2FpXey_i-u2nxBG0CxjI_7RIhDrL9J6Uqx0IhT_KdCBsZFoTBd3jo_2pm5edb0WckL48zHKeMYB6NYMMINubK0Z4iMOwA9G-XWD1m0VFsDI0Af13emE/); background-origin: initial; background-position: 0% 0%; background-repeat: repeat-y; background-size: initial; color: black; font-family: 'Courier New'; font-size: 9pt; margin: 5px 10px; max-height: 200px; overflow: auto; padding: 4px 10px 0px 40px;">
<link rel="stylesheet" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.6/themes/mint-choc/jquery-ui.css" type="text/css" /></div>
<br />
<br />
<br />
<br />
<br />
Style 12:-<br />
<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<img alt="Multi Tabbed Navigation Widget" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgAPdkvouVzeuQ8kfwOXG5lllAkx49kFcy78pyXcAiDZC3WpoYkqQGxQD4UnWJ8CEvrRhwQGJcNkJH5isgJ2sCSuSSLkSnrzw5A4lPzqi1r-OVsS7NrFNXrrWqHVyQH9ZblHGRJelf9vtQ5/s1600/w2b_Tabbed+navigation+for+blogger-jquery-ui-themes-google-hosted-w2b+%252814%2529.gif" height="125" style="border: 1px solid rgb(192, 192, 192); height: auto; max-width: 95%; padding: 4px;" width="125" /></div>
<br />
<div style="text-align: center;">
<a class="button big green external_link" href="http://24work.blogspot.com/p/demo.html?url=http://24work-new.googlecode.com/svn/trunk/24work-blogspot/multi-tabbed/style-12.html" rel="nofollow" style="-webkit-box-shadow: rgb(255, 255, 255) 0px 0px 1px inset; -webkit-transition: background-position 1s; background-clip: border-box; background-color: #79be1e; background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiahyphenhyphenl-cVfe0N50mVbpXndF0yaLprwejhgK1k2Ja7QUXeMuhnxPIb8uUvilCIm8alGKvBDcYiSbP_LuIJ22w5QCYuIIaT_vaI1W7kHbxz46s-E_ZEWfLkXxK0UwZ-OBEZrNn_j7yNs203Nw/s144/button_bg.png), url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiahyphenhyphenl-cVfe0N50mVbpXndF0yaLprwejhgK1k2Ja7QUXeMuhnxPIb8uUvilCIm8alGKvBDcYiSbP_LuIJ22w5QCYuIIaT_vaI1W7kHbxz46s-E_ZEWfLkXxK0UwZ-OBEZrNn_j7yNs203Nw/s144/button_bg.png), -webkit-gradient(radial, 50% 100%, 0, 50% 100%, 100, from(rgb(162, 211, 30)), to(rgba(162, 211, 30, 0))), -webkit-gradient(linear, 0% 0%, 0% 100%, from(rgb(130, 204, 39)), to(rgb(116, 179, 23))); background-position: 0% 100%, 100% 0%, 0px 0px, 0px 0px; background-repeat: no-repeat; border-radius: 8px; border: 1px solid rgb(150, 163, 123) !important; box-shadow: rgb(255, 255, 255) 0px 0px 1px inset; color: rgb(52, 89, 3) !important; cursor: pointer; display: inline-block; font-family: Calibri, Arial, sans-serif; font-size: 30px; font-stretch: normal; line-height: normal; padding: 10px 20px; position: relative; text-decoration: none; text-shadow: rgba(255, 255, 255, 0.4) 1px 1px 0px; transition: background-position 1s; vertical-align: baseline; white-space: nowrap;" target="_blank">Live Demo</a></div>
<br />
<br />
<br />
<div class="code" style="background-attachment: initial; background-clip: initial; background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg_A6UCACj7lzkc6RQWaXeH21t_M2FpXey_i-u2nxBG0CxjI_7RIhDrL9J6Uqx0IhT_KdCBsZFoTBd3jo_2pm5edb0WckL48zHKeMYB6NYMMINubK0Z4iMOwA9G-XWD1m0VFsDI0Af13emE/); background-origin: initial; background-position: 0% 0%; background-repeat: repeat-y; background-size: initial; color: black; font-family: 'Courier New'; font-size: 9pt; margin: 5px 10px; max-height: 200px; overflow: auto; padding: 4px 10px 0px 40px;">
<link rel="stylesheet" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.6/themes/pepper-grinder/jquery-ui.css" type="text/css" /></div>
<br />
<br />
<br />
<br />
<br />
Style 13:-<br />
<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<img alt="Multi Tabbed Navigation Widget" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhtoiIVchHBWn_kg-egrlO8A9BQaf9RrbL0Ahh86moQzA5TyG1bm1zjSN6NeRiWmS7CtwmKt0XABQ-1H-51NXsVpwXjS5cI7d0GoCldWBGQdH7jHRonTSFU398wQKrTBEY7pVGoubMRjakh/s1600/w2b_Tabbed+navigation+for+blogger-jquery-ui-themes-google-hosted-w2b+%252815%2529.gif" height="125" style="border: 1px solid rgb(192, 192, 192); height: auto; max-width: 95%; padding: 4px;" width="125" /></div>
<br />
<div style="text-align: center;">
<a class="button big green external_link" href="http://24work.blogspot.com/p/demo.html?url=http://24work-new.googlecode.com/svn/trunk/24work-blogspot/multi-tabbed/style-13.html" rel="nofollow" style="-webkit-box-shadow: rgb(255, 255, 255) 0px 0px 1px inset; -webkit-transition: background-position 1s; background-clip: border-box; background-color: #79be1e; background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiahyphenhyphenl-cVfe0N50mVbpXndF0yaLprwejhgK1k2Ja7QUXeMuhnxPIb8uUvilCIm8alGKvBDcYiSbP_LuIJ22w5QCYuIIaT_vaI1W7kHbxz46s-E_ZEWfLkXxK0UwZ-OBEZrNn_j7yNs203Nw/s144/button_bg.png), url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiahyphenhyphenl-cVfe0N50mVbpXndF0yaLprwejhgK1k2Ja7QUXeMuhnxPIb8uUvilCIm8alGKvBDcYiSbP_LuIJ22w5QCYuIIaT_vaI1W7kHbxz46s-E_ZEWfLkXxK0UwZ-OBEZrNn_j7yNs203Nw/s144/button_bg.png), -webkit-gradient(radial, 50% 100%, 0, 50% 100%, 100, from(rgb(162, 211, 30)), to(rgba(162, 211, 30, 0))), -webkit-gradient(linear, 0% 0%, 0% 100%, from(rgb(130, 204, 39)), to(rgb(116, 179, 23))); background-position: 0% 100%, 100% 0%, 0px 0px, 0px 0px; background-repeat: no-repeat; border-radius: 8px; border: 1px solid rgb(150, 163, 123) !important; box-shadow: rgb(255, 255, 255) 0px 0px 1px inset; color: rgb(52, 89, 3) !important; cursor: pointer; display: inline-block; font-family: Calibri, Arial, sans-serif; font-size: 30px; font-stretch: normal; line-height: normal; padding: 10px 20px; position: relative; text-decoration: none; text-shadow: rgba(255, 255, 255, 0.4) 1px 1px 0px; transition: background-position 1s; vertical-align: baseline; white-space: nowrap;" target="_blank">Live Demo</a></div>
<br />
<br />
<br />
<div class="code" style="background-attachment: initial; background-clip: initial; background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg_A6UCACj7lzkc6RQWaXeH21t_M2FpXey_i-u2nxBG0CxjI_7RIhDrL9J6Uqx0IhT_KdCBsZFoTBd3jo_2pm5edb0WckL48zHKeMYB6NYMMINubK0Z4iMOwA9G-XWD1m0VFsDI0Af13emE/); background-origin: initial; background-position: 0% 0%; background-repeat: repeat-y; background-size: initial; color: black; font-family: 'Courier New'; font-size: 9pt; margin: 5px 10px; max-height: 200px; overflow: auto; padding: 4px 10px 0px 40px;">
<link rel="stylesheet" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.6/themes/redmond/jquery-ui.css" type="text/css" /></div>
<br />
<br />
<br />
<br />
<br />
Style 14:-<br />
<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<img alt="Multi Tabbed Navigation Widget" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg7Scqj4Tb3ZgHyOdl_0FPdZK9Frw-mec_vBaIHJza07-y9xFYnLMBnvNGqNROHGJawwOsrjtZ_6ZAcxnScX-P8oGtER387BOnDUE8ZWstTeCHNEqhjVEuuwqXrPOidmJBplu0G6t0arALy/s1600/w2b_Tabbed+navigation+for+blogger-jquery-ui-themes-google-hosted-w2b+%252816%2529.gif" height="125" style="border: 1px solid rgb(192, 192, 192); height: auto; max-width: 95%; padding: 4px;" width="125" /></div>
<br />
<div style="text-align: center;">
<a class="button big green external_link" href="http://24work.blogspot.com/p/demo.html?url=http://24work-new.googlecode.com/svn/trunk/24work-blogspot/multi-tabbed/style-14.html" rel="nofollow" style="-webkit-box-shadow: rgb(255, 255, 255) 0px 0px 1px inset; -webkit-transition: background-position 1s; background-clip: border-box; background-color: #79be1e; background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiahyphenhyphenl-cVfe0N50mVbpXndF0yaLprwejhgK1k2Ja7QUXeMuhnxPIb8uUvilCIm8alGKvBDcYiSbP_LuIJ22w5QCYuIIaT_vaI1W7kHbxz46s-E_ZEWfLkXxK0UwZ-OBEZrNn_j7yNs203Nw/s144/button_bg.png), url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiahyphenhyphenl-cVfe0N50mVbpXndF0yaLprwejhgK1k2Ja7QUXeMuhnxPIb8uUvilCIm8alGKvBDcYiSbP_LuIJ22w5QCYuIIaT_vaI1W7kHbxz46s-E_ZEWfLkXxK0UwZ-OBEZrNn_j7yNs203Nw/s144/button_bg.png), -webkit-gradient(radial, 50% 100%, 0, 50% 100%, 100, from(rgb(162, 211, 30)), to(rgba(162, 211, 30, 0))), -webkit-gradient(linear, 0% 0%, 0% 100%, from(rgb(130, 204, 39)), to(rgb(116, 179, 23))); background-position: 0% 100%, 100% 0%, 0px 0px, 0px 0px; background-repeat: no-repeat; border-radius: 8px; border: 1px solid rgb(150, 163, 123) !important; box-shadow: rgb(255, 255, 255) 0px 0px 1px inset; color: rgb(52, 89, 3) !important; cursor: pointer; display: inline-block; font-family: Calibri, Arial, sans-serif; font-size: 30px; font-stretch: normal; line-height: normal; padding: 10px 20px; position: relative; text-decoration: none; text-shadow: rgba(255, 255, 255, 0.4) 1px 1px 0px; transition: background-position 1s; vertical-align: baseline; white-space: nowrap;" target="_blank">Live Demo</a></div>
<br />
<br />
<br />
<div class="code" style="background-attachment: initial; background-clip: initial; background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg_A6UCACj7lzkc6RQWaXeH21t_M2FpXey_i-u2nxBG0CxjI_7RIhDrL9J6Uqx0IhT_KdCBsZFoTBd3jo_2pm5edb0WckL48zHKeMYB6NYMMINubK0Z4iMOwA9G-XWD1m0VFsDI0Af13emE/); background-origin: initial; background-position: 0% 0%; background-repeat: repeat-y; background-size: initial; color: black; font-family: 'Courier New'; font-size: 9pt; margin: 5px 10px; max-height: 200px; overflow: auto; padding: 4px 10px 0px 40px;">
<link rel="stylesheet" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.6/themes/smoothness/jquery-ui.css" type="text/css" /></div>
<br />
<br />
<br />
<br />
<br />
Style 15:-<br />
<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<img alt="Multi Tabbed Navigation Widget" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhl18O_yJwmTsSILM3-K7AQfLu5WqqmLobYDQmlGdmhDgjfsvHv_aIISjcEs6-iHk-B9UxxzGqINLQKVYwy8SoG9ZVLxkvKjQQD8XrwwqUV0IVmyOlR6uvFc39IH0mR5yGi1urfkUamhPY3/s1600/w2b_Tabbed+navigation+for+blogger-jquery-ui-themes-google-hosted-w2b+%252817%2529.gif" height="125" style="border: 1px solid rgb(192, 192, 192); height: auto; max-width: 95%; padding: 4px;" width="125" /></div>
<br />
<div style="text-align: center;">
<a class="button big green external_link" href="http://24work.blogspot.com/p/demo.html?url=http://24work-new.googlecode.com/svn/trunk/24work-blogspot/multi-tabbed/style-15.html" rel="nofollow" style="-webkit-box-shadow: rgb(255, 255, 255) 0px 0px 1px inset; -webkit-transition: background-position 1s; background-clip: border-box; background-color: #79be1e; background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiahyphenhyphenl-cVfe0N50mVbpXndF0yaLprwejhgK1k2Ja7QUXeMuhnxPIb8uUvilCIm8alGKvBDcYiSbP_LuIJ22w5QCYuIIaT_vaI1W7kHbxz46s-E_ZEWfLkXxK0UwZ-OBEZrNn_j7yNs203Nw/s144/button_bg.png), url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiahyphenhyphenl-cVfe0N50mVbpXndF0yaLprwejhgK1k2Ja7QUXeMuhnxPIb8uUvilCIm8alGKvBDcYiSbP_LuIJ22w5QCYuIIaT_vaI1W7kHbxz46s-E_ZEWfLkXxK0UwZ-OBEZrNn_j7yNs203Nw/s144/button_bg.png), -webkit-gradient(radial, 50% 100%, 0, 50% 100%, 100, from(rgb(162, 211, 30)), to(rgba(162, 211, 30, 0))), -webkit-gradient(linear, 0% 0%, 0% 100%, from(rgb(130, 204, 39)), to(rgb(116, 179, 23))); background-position: 0% 100%, 100% 0%, 0px 0px, 0px 0px; background-repeat: no-repeat; border-radius: 8px; border: 1px solid rgb(150, 163, 123) !important; box-shadow: rgb(255, 255, 255) 0px 0px 1px inset; color: rgb(52, 89, 3) !important; cursor: pointer; display: inline-block; font-family: Calibri, Arial, sans-serif; font-size: 30px; font-stretch: normal; line-height: normal; padding: 10px 20px; position: relative; text-decoration: none; text-shadow: rgba(255, 255, 255, 0.4) 1px 1px 0px; transition: background-position 1s; vertical-align: baseline; white-space: nowrap;" target="_blank">Live Demo</a></div>
<br />
<br />
<br />
<div class="code" style="background-attachment: initial; background-clip: initial; background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg_A6UCACj7lzkc6RQWaXeH21t_M2FpXey_i-u2nxBG0CxjI_7RIhDrL9J6Uqx0IhT_KdCBsZFoTBd3jo_2pm5edb0WckL48zHKeMYB6NYMMINubK0Z4iMOwA9G-XWD1m0VFsDI0Af13emE/); background-origin: initial; background-position: 0% 0%; background-repeat: repeat-y; background-size: initial; color: black; font-family: 'Courier New'; font-size: 9pt; margin: 5px 10px; max-height: 200px; overflow: auto; padding: 4px 10px 0px 40px;">
<link rel="stylesheet" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.6/themes/south-street/jquery-ui.css" type="text/css" /></div>
<br />
<br />
<br />
<br />
<br />
Style 16:-<br />
<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<img alt="Multi Tabbed Navigation Widget" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjGxc79zFQFaSQ8Be3nNRp0JECJioPLXEHCMNO5Pl6tGvpre2PogCC_Hf7Xx2HzWStXZw9sLAMQ78BDVmTGt4l_1wLbBthyphenhyphenPR_6HplPU4xodgd7KN3LQMk38AkkgozagrxwGg4Pco2nnDp8/s1600/w2b_Tabbed+navigation+for+blogger-jquery-ui-themes-google-hosted-w2b+%252818%2529.gif" height="125" style="border: 1px solid rgb(192, 192, 192); height: auto; max-width: 95%; padding: 4px;" width="125" /></div>
<br />
<div style="text-align: center;">
<a class="button big green external_link" href="http://24work.blogspot.com/p/demo.html?url=http://24work-new.googlecode.com/svn/trunk/24work-blogspot/multi-tabbed/style-16.html" rel="nofollow" style="-webkit-box-shadow: rgb(255, 255, 255) 0px 0px 1px inset; -webkit-transition: background-position 1s; background-clip: border-box; background-color: #79be1e; background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiahyphenhyphenl-cVfe0N50mVbpXndF0yaLprwejhgK1k2Ja7QUXeMuhnxPIb8uUvilCIm8alGKvBDcYiSbP_LuIJ22w5QCYuIIaT_vaI1W7kHbxz46s-E_ZEWfLkXxK0UwZ-OBEZrNn_j7yNs203Nw/s144/button_bg.png), url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiahyphenhyphenl-cVfe0N50mVbpXndF0yaLprwejhgK1k2Ja7QUXeMuhnxPIb8uUvilCIm8alGKvBDcYiSbP_LuIJ22w5QCYuIIaT_vaI1W7kHbxz46s-E_ZEWfLkXxK0UwZ-OBEZrNn_j7yNs203Nw/s144/button_bg.png), -webkit-gradient(radial, 50% 100%, 0, 50% 100%, 100, from(rgb(162, 211, 30)), to(rgba(162, 211, 30, 0))), -webkit-gradient(linear, 0% 0%, 0% 100%, from(rgb(130, 204, 39)), to(rgb(116, 179, 23))); background-position: 0% 100%, 100% 0%, 0px 0px, 0px 0px; background-repeat: no-repeat; border-radius: 8px; border: 1px solid rgb(150, 163, 123) !important; box-shadow: rgb(255, 255, 255) 0px 0px 1px inset; color: rgb(52, 89, 3) !important; cursor: pointer; display: inline-block; font-family: Calibri, Arial, sans-serif; font-size: 30px; font-stretch: normal; line-height: normal; padding: 10px 20px; position: relative; text-decoration: none; text-shadow: rgba(255, 255, 255, 0.4) 1px 1px 0px; transition: background-position 1s; vertical-align: baseline; white-space: nowrap;" target="_blank">Live Demo</a></div>
<br />
<br />
<br />
<div class="code" style="background-attachment: initial; background-clip: initial; background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg_A6UCACj7lzkc6RQWaXeH21t_M2FpXey_i-u2nxBG0CxjI_7RIhDrL9J6Uqx0IhT_KdCBsZFoTBd3jo_2pm5edb0WckL48zHKeMYB6NYMMINubK0Z4iMOwA9G-XWD1m0VFsDI0Af13emE/); background-origin: initial; background-position: 0% 0%; background-repeat: repeat-y; background-size: initial; color: black; font-family: 'Courier New'; font-size: 9pt; margin: 5px 10px; max-height: 200px; overflow: auto; padding: 4px 10px 0px 40px;">
<link rel="stylesheet" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.6/themes/start/jquery-ui.css" type="text/css" /></div>
<br />
<br />
<br />
<br />
<br />
Style 17:-<br />
<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<img alt="Multi Tabbed Navigation Widget" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgu7dEz4WifJuuxxI_gbSIdWTmSt2hpLnViWTZ96LHYyySI8sZB7X7t4sDf0j0SNSNs0Iyj5BRvE5RERUG6L1Vgs0B5aYhVHx7D9UUT6sx1cEk5jboNUGAizrxiNVc7g8wtvn5HVTUP2Clk/s1600/w2b_Tabbed+navigation+for+blogger-jquery-ui-themes-google-hosted-w2b+%252819%2529.gif" height="125" style="border: 1px solid rgb(192, 192, 192); height: auto; max-width: 95%; padding: 4px;" width="125" /></div>
<br />
<div style="text-align: center;">
<a class="button big green external_link" href="http://24work.blogspot.com/p/demo.html?url=http://24work-new.googlecode.com/svn/trunk/24work-blogspot/multi-tabbed/style-17.html" rel="nofollow" style="-webkit-box-shadow: rgb(255, 255, 255) 0px 0px 1px inset; -webkit-transition: background-position 1s; background-clip: border-box; background-color: #79be1e; background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiahyphenhyphenl-cVfe0N50mVbpXndF0yaLprwejhgK1k2Ja7QUXeMuhnxPIb8uUvilCIm8alGKvBDcYiSbP_LuIJ22w5QCYuIIaT_vaI1W7kHbxz46s-E_ZEWfLkXxK0UwZ-OBEZrNn_j7yNs203Nw/s144/button_bg.png), url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiahyphenhyphenl-cVfe0N50mVbpXndF0yaLprwejhgK1k2Ja7QUXeMuhnxPIb8uUvilCIm8alGKvBDcYiSbP_LuIJ22w5QCYuIIaT_vaI1W7kHbxz46s-E_ZEWfLkXxK0UwZ-OBEZrNn_j7yNs203Nw/s144/button_bg.png), -webkit-gradient(radial, 50% 100%, 0, 50% 100%, 100, from(rgb(162, 211, 30)), to(rgba(162, 211, 30, 0))), -webkit-gradient(linear, 0% 0%, 0% 100%, from(rgb(130, 204, 39)), to(rgb(116, 179, 23))); background-position: 0% 100%, 100% 0%, 0px 0px, 0px 0px; background-repeat: no-repeat; border-radius: 8px; border: 1px solid rgb(150, 163, 123) !important; box-shadow: rgb(255, 255, 255) 0px 0px 1px inset; color: rgb(52, 89, 3) !important; cursor: pointer; display: inline-block; font-family: Calibri, Arial, sans-serif; font-size: 30px; font-stretch: normal; line-height: normal; padding: 10px 20px; position: relative; text-decoration: none; text-shadow: rgba(255, 255, 255, 0.4) 1px 1px 0px; transition: background-position 1s; vertical-align: baseline; white-space: nowrap;" target="_blank">Live Demo</a></div>
<br />
<br />
<br />
<div class="code" style="background-attachment: initial; background-clip: initial; background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg_A6UCACj7lzkc6RQWaXeH21t_M2FpXey_i-u2nxBG0CxjI_7RIhDrL9J6Uqx0IhT_KdCBsZFoTBd3jo_2pm5edb0WckL48zHKeMYB6NYMMINubK0Z4iMOwA9G-XWD1m0VFsDI0Af13emE/); background-origin: initial; background-position: 0% 0%; background-repeat: repeat-y; background-size: initial; color: black; font-family: 'Courier New'; font-size: 9pt; margin: 5px 10px; max-height: 200px; overflow: auto; padding: 4px 10px 0px 40px;">
<link rel="stylesheet" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.6/themes/sunny/jquery-ui.css" type="text/css" /></div>
<br />
<br />
<br />
<br />
<br />
Style 18:-<br />
<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<img alt="Multi Tabbed Navigation Widget" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh1X6CjTcUqHQOQ2kqbVCJ_Ca9yptoAYcsCmuNzJexwGwhURojCTTw0Xe5TshUers4mh3z4gVZCcA9yUVGr6Zh71EvF_Xe3tF_wIpYO3nRYwiPttU2Ezc7_hkqHGfoGeBjuRkmDrQrVaZ5g/s1600/w2b_Tabbed+navigation+for+blogger-jquery-ui-themes-google-hosted-w2b+%252820%2529.gif" height="125" style="border: 1px solid rgb(192, 192, 192); height: auto; max-width: 95%; padding: 4px;" width="125" /></div>
<br />
<div style="text-align: center;">
<a class="button big green external_link" href="http://24work.blogspot.com/p/demo.html?url=http://24work-new.googlecode.com/svn/trunk/24work-blogspot/multi-tabbed/style-18.html" rel="nofollow" style="-webkit-box-shadow: rgb(255, 255, 255) 0px 0px 1px inset; -webkit-transition: background-position 1s; background-clip: border-box; background-color: #79be1e; background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiahyphenhyphenl-cVfe0N50mVbpXndF0yaLprwejhgK1k2Ja7QUXeMuhnxPIb8uUvilCIm8alGKvBDcYiSbP_LuIJ22w5QCYuIIaT_vaI1W7kHbxz46s-E_ZEWfLkXxK0UwZ-OBEZrNn_j7yNs203Nw/s144/button_bg.png), url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiahyphenhyphenl-cVfe0N50mVbpXndF0yaLprwejhgK1k2Ja7QUXeMuhnxPIb8uUvilCIm8alGKvBDcYiSbP_LuIJ22w5QCYuIIaT_vaI1W7kHbxz46s-E_ZEWfLkXxK0UwZ-OBEZrNn_j7yNs203Nw/s144/button_bg.png), -webkit-gradient(radial, 50% 100%, 0, 50% 100%, 100, from(rgb(162, 211, 30)), to(rgba(162, 211, 30, 0))), -webkit-gradient(linear, 0% 0%, 0% 100%, from(rgb(130, 204, 39)), to(rgb(116, 179, 23))); background-position: 0% 100%, 100% 0%, 0px 0px, 0px 0px; background-repeat: no-repeat; border-radius: 8px; border: 1px solid rgb(150, 163, 123) !important; box-shadow: rgb(255, 255, 255) 0px 0px 1px inset; color: rgb(52, 89, 3) !important; cursor: pointer; display: inline-block; font-family: Calibri, Arial, sans-serif; font-size: 30px; font-stretch: normal; line-height: normal; padding: 10px 20px; position: relative; text-decoration: none; text-shadow: rgba(255, 255, 255, 0.4) 1px 1px 0px; transition: background-position 1s; vertical-align: baseline; white-space: nowrap;" target="_blank">Live Demo</a></div>
<br />
<br />
<br />
<div class="code" style="background-attachment: initial; background-clip: initial; background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg_A6UCACj7lzkc6RQWaXeH21t_M2FpXey_i-u2nxBG0CxjI_7RIhDrL9J6Uqx0IhT_KdCBsZFoTBd3jo_2pm5edb0WckL48zHKeMYB6NYMMINubK0Z4iMOwA9G-XWD1m0VFsDI0Af13emE/); background-origin: initial; background-position: 0% 0%; background-repeat: repeat-y; background-size: initial; color: black; font-family: 'Courier New'; font-size: 9pt; margin: 5px 10px; max-height: 200px; overflow: auto; padding: 4px 10px 0px 40px;">
<link rel="stylesheet" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.6/themes/swanky-purse/jquery-ui.css" type="text/css" /></div>
<br />
<br />
<br />
<br />
<br />
Style 19:-<br />
<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<img alt="Multi Tabbed Navigation Widget" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgFggxkD09sFo4vOn0dZ9sy-cYewg5k8gHwp1ReoeqQvRF8l8gLIPY1rVRDeX6wzqYik3OtzFeTWmplqtRY6XM7McrJfVBZ4At_1W6G4U8dNFu3Z0V9nXZHI9nUPg59Sc8XOo2umIuTf68K/s1600/w2b_Tabbed+navigation+for+blogger-jquery-ui-themes-google-hosted-w2b+%252821%2529.gif" height="125" style="border: 1px solid rgb(192, 192, 192); height: auto; max-width: 95%; padding: 4px;" width="125" /></div>
<br />
<div style="text-align: center;">
<a class="button big green external_link" href="http://24work.blogspot.com/p/demo.html?url=http://24work-new.googlecode.com/svn/trunk/24work-blogspot/multi-tabbed/style-19.html" rel="nofollow" style="-webkit-box-shadow: rgb(255, 255, 255) 0px 0px 1px inset; -webkit-transition: background-position 1s; background-clip: border-box; background-color: #79be1e; background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiahyphenhyphenl-cVfe0N50mVbpXndF0yaLprwejhgK1k2Ja7QUXeMuhnxPIb8uUvilCIm8alGKvBDcYiSbP_LuIJ22w5QCYuIIaT_vaI1W7kHbxz46s-E_ZEWfLkXxK0UwZ-OBEZrNn_j7yNs203Nw/s144/button_bg.png), url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiahyphenhyphenl-cVfe0N50mVbpXndF0yaLprwejhgK1k2Ja7QUXeMuhnxPIb8uUvilCIm8alGKvBDcYiSbP_LuIJ22w5QCYuIIaT_vaI1W7kHbxz46s-E_ZEWfLkXxK0UwZ-OBEZrNn_j7yNs203Nw/s144/button_bg.png), -webkit-gradient(radial, 50% 100%, 0, 50% 100%, 100, from(rgb(162, 211, 30)), to(rgba(162, 211, 30, 0))), -webkit-gradient(linear, 0% 0%, 0% 100%, from(rgb(130, 204, 39)), to(rgb(116, 179, 23))); background-position: 0% 100%, 100% 0%, 0px 0px, 0px 0px; background-repeat: no-repeat; border-radius: 8px; border: 1px solid rgb(150, 163, 123) !important; box-shadow: rgb(255, 255, 255) 0px 0px 1px inset; color: rgb(52, 89, 3) !important; cursor: pointer; display: inline-block; font-family: Calibri, Arial, sans-serif; font-size: 30px; font-stretch: normal; line-height: normal; padding: 10px 20px; position: relative; text-decoration: none; text-shadow: rgba(255, 255, 255, 0.4) 1px 1px 0px; transition: background-position 1s; vertical-align: baseline; white-space: nowrap;" target="_blank">Live Demo</a></div>
<br />
<br />
<br />
<div class="code" style="background-attachment: initial; background-clip: initial; background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg_A6UCACj7lzkc6RQWaXeH21t_M2FpXey_i-u2nxBG0CxjI_7RIhDrL9J6Uqx0IhT_KdCBsZFoTBd3jo_2pm5edb0WckL48zHKeMYB6NYMMINubK0Z4iMOwA9G-XWD1m0VFsDI0Af13emE/); background-origin: initial; background-position: 0% 0%; background-repeat: repeat-y; background-size: initial; color: black; font-family: 'Courier New'; font-size: 9pt; margin: 5px 10px; max-height: 200px; overflow: auto; padding: 4px 10px 0px 40px;">
<link rel="stylesheet" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.6/themes/trontastic/jquery-ui.css" type="text/css" /></div>
<br />
<br />
<br />
<br />
<br />
Style 20:-<br />
<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<img alt="Multi Tabbed Navigation Widget" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhkLrGBPurW1H5VRPnayeQikeiwCNVPumWYxenM4TsKXes7W6KnH5wSKytGRwmSxq63XV8osJUAEb6V63egRBH3J5KcmUkhzE7bqAp1w0IfXO9ci3mFf7zOh-mEu5hrWwnfNoIX-2zXFhKQ/s1600/w2b_Tabbed+navigation+for+blogger-jquery-ui-themes-google-hosted-w2b+%252822%2529.gif" height="125" style="border: 1px solid rgb(192, 192, 192); height: auto; max-width: 95%; padding: 4px;" width="125" /></div>
<br />
<div style="text-align: center;">
<a class="button big green external_link" href="http://24work.blogspot.com/p/demo.html?url=http://24work-new.googlecode.com/svn/trunk/24work-blogspot/multi-tabbed/style-20.html" rel="nofollow" style="-webkit-box-shadow: rgb(255, 255, 255) 0px 0px 1px inset; -webkit-transition: background-position 1s; background-clip: border-box; background-color: #79be1e; background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiahyphenhyphenl-cVfe0N50mVbpXndF0yaLprwejhgK1k2Ja7QUXeMuhnxPIb8uUvilCIm8alGKvBDcYiSbP_LuIJ22w5QCYuIIaT_vaI1W7kHbxz46s-E_ZEWfLkXxK0UwZ-OBEZrNn_j7yNs203Nw/s144/button_bg.png), url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiahyphenhyphenl-cVfe0N50mVbpXndF0yaLprwejhgK1k2Ja7QUXeMuhnxPIb8uUvilCIm8alGKvBDcYiSbP_LuIJ22w5QCYuIIaT_vaI1W7kHbxz46s-E_ZEWfLkXxK0UwZ-OBEZrNn_j7yNs203Nw/s144/button_bg.png), -webkit-gradient(radial, 50% 100%, 0, 50% 100%, 100, from(rgb(162, 211, 30)), to(rgba(162, 211, 30, 0))), -webkit-gradient(linear, 0% 0%, 0% 100%, from(rgb(130, 204, 39)), to(rgb(116, 179, 23))); background-position: 0% 100%, 100% 0%, 0px 0px, 0px 0px; background-repeat: no-repeat; border-radius: 8px; border: 1px solid rgb(150, 163, 123) !important; box-shadow: rgb(255, 255, 255) 0px 0px 1px inset; color: rgb(52, 89, 3) !important; cursor: pointer; display: inline-block; font-family: Calibri, Arial, sans-serif; font-size: 30px; font-stretch: normal; line-height: normal; padding: 10px 20px; position: relative; text-decoration: none; text-shadow: rgba(255, 255, 255, 0.4) 1px 1px 0px; transition: background-position 1s; vertical-align: baseline; white-space: nowrap;" target="_blank">Live Demo</a></div>
<br />
<br />
<br />
<div class="code" style="background-attachment: initial; background-clip: initial; background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg_A6UCACj7lzkc6RQWaXeH21t_M2FpXey_i-u2nxBG0CxjI_7RIhDrL9J6Uqx0IhT_KdCBsZFoTBd3jo_2pm5edb0WckL48zHKeMYB6NYMMINubK0Z4iMOwA9G-XWD1m0VFsDI0Af13emE/); background-origin: initial; background-position: 0% 0%; background-repeat: repeat-y; background-size: initial; color: black; font-family: 'Courier New'; font-size: 9pt; margin: 5px 10px; max-height: 200px; overflow: auto; padding: 4px 10px 0px 40px;">
<link rel="stylesheet" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.6/themes/ui-darkness/jquery-ui.css" type="text/css" /></div>
<br />
<br />
<br />
<br />
<br />
Style 21:-<br />
<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<img alt="Multi Tabbed Navigation Widget" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj3BpvMWkW2KFBqY1FUqEXQwn-ct-7mMoFSSx0EO2n8vDfBYTNEGGPcQhqSTssLAQU__z0kKX461uGfSxuuPzF4iMbzWRZn5ULZmPLibI_YLRzWeMID18T6OS02ixjQLXegtOWVi4MoUHDr/s1600/w2b_Tabbed+navigation+for+blogger-jquery-ui-themes-google-hosted-w2b+%252823%2529.gif" height="125" style="border: 1px solid rgb(192, 192, 192); height: auto; max-width: 95%; padding: 4px;" width="125" /></div>
<br />
<div style="text-align: center;">
<a class="button big green external_link" href="http://24work.blogspot.com/p/demo.html?url=http://24work-new.googlecode.com/svn/trunk/24work-blogspot/multi-tabbed/style-21.html" rel="nofollow" style="-webkit-box-shadow: rgb(255, 255, 255) 0px 0px 1px inset; -webkit-transition: background-position 1s; background-clip: border-box; background-color: #79be1e; background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiahyphenhyphenl-cVfe0N50mVbpXndF0yaLprwejhgK1k2Ja7QUXeMuhnxPIb8uUvilCIm8alGKvBDcYiSbP_LuIJ22w5QCYuIIaT_vaI1W7kHbxz46s-E_ZEWfLkXxK0UwZ-OBEZrNn_j7yNs203Nw/s144/button_bg.png), url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiahyphenhyphenl-cVfe0N50mVbpXndF0yaLprwejhgK1k2Ja7QUXeMuhnxPIb8uUvilCIm8alGKvBDcYiSbP_LuIJ22w5QCYuIIaT_vaI1W7kHbxz46s-E_ZEWfLkXxK0UwZ-OBEZrNn_j7yNs203Nw/s144/button_bg.png), -webkit-gradient(radial, 50% 100%, 0, 50% 100%, 100, from(rgb(162, 211, 30)), to(rgba(162, 211, 30, 0))), -webkit-gradient(linear, 0% 0%, 0% 100%, from(rgb(130, 204, 39)), to(rgb(116, 179, 23))); background-position: 0% 100%, 100% 0%, 0px 0px, 0px 0px; background-repeat: no-repeat; border-radius: 8px; border: 1px solid rgb(150, 163, 123) !important; box-shadow: rgb(255, 255, 255) 0px 0px 1px inset; color: rgb(52, 89, 3) !important; cursor: pointer; display: inline-block; font-family: Calibri, Arial, sans-serif; font-size: 30px; font-stretch: normal; line-height: normal; padding: 10px 20px; position: relative; text-decoration: none; text-shadow: rgba(255, 255, 255, 0.4) 1px 1px 0px; transition: background-position 1s; vertical-align: baseline; white-space: nowrap;" target="_blank">Live Demo</a></div>
<br />
<br />
<br />
<div class="code" style="background-attachment: initial; background-clip: initial; background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg_A6UCACj7lzkc6RQWaXeH21t_M2FpXey_i-u2nxBG0CxjI_7RIhDrL9J6Uqx0IhT_KdCBsZFoTBd3jo_2pm5edb0WckL48zHKeMYB6NYMMINubK0Z4iMOwA9G-XWD1m0VFsDI0Af13emE/); background-origin: initial; background-position: 0% 0%; background-repeat: repeat-y; background-size: initial; color: black; font-family: 'Courier New'; font-size: 9pt; margin: 5px 10px; max-height: 200px; overflow: auto; padding: 4px 10px 0px 40px;">
<link rel="stylesheet" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.6/themes/ui-lightness/jquery-ui.css" type="text/css" /></div>
<br />
<br />
<br />
<br />
<br />
Style 22:-<br />
<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<img alt="Multi Tabbed Navigation Widget" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhAIeGwyhrpA3Qnk4sud1uPwHVqrqTpyICIb4shrrBO2CUyizvVY3t94D0iFGVrf96HFbQebEBilhtNpKhvyiobK1EpJE1qjf51IZ4PDk_7DTWVh7qLoOR24f2hYXbCv9tlOnjNQLMaOIfX/s1600/w2b_Tabbed+navigation+for+blogger-jquery-ui-themes-google-hosted-w2b+%252824%2529.gif" height="125" style="border: 1px solid rgb(192, 192, 192); height: auto; max-width: 95%; padding: 4px;" width="125" /></div>
<br />
<div style="text-align: center;">
<a class="button big green external_link" href="http://24work.blogspot.com/p/demo.html?url=http://24work-new.googlecode.com/svn/trunk/24work-blogspot/multi-tabbed/style-22.html" rel="nofollow" style="-webkit-box-shadow: rgb(255, 255, 255) 0px 0px 1px inset; -webkit-transition: background-position 1s; background-clip: border-box; background-color: #79be1e; background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiahyphenhyphenl-cVfe0N50mVbpXndF0yaLprwejhgK1k2Ja7QUXeMuhnxPIb8uUvilCIm8alGKvBDcYiSbP_LuIJ22w5QCYuIIaT_vaI1W7kHbxz46s-E_ZEWfLkXxK0UwZ-OBEZrNn_j7yNs203Nw/s144/button_bg.png), url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiahyphenhyphenl-cVfe0N50mVbpXndF0yaLprwejhgK1k2Ja7QUXeMuhnxPIb8uUvilCIm8alGKvBDcYiSbP_LuIJ22w5QCYuIIaT_vaI1W7kHbxz46s-E_ZEWfLkXxK0UwZ-OBEZrNn_j7yNs203Nw/s144/button_bg.png), -webkit-gradient(radial, 50% 100%, 0, 50% 100%, 100, from(rgb(162, 211, 30)), to(rgba(162, 211, 30, 0))), -webkit-gradient(linear, 0% 0%, 0% 100%, from(rgb(130, 204, 39)), to(rgb(116, 179, 23))); background-position: 0% 100%, 100% 0%, 0px 0px, 0px 0px; background-repeat: no-repeat; border-radius: 8px; border: 1px solid rgb(150, 163, 123) !important; box-shadow: rgb(255, 255, 255) 0px 0px 1px inset; color: rgb(52, 89, 3) !important; cursor: pointer; display: inline-block; font-family: Calibri, Arial, sans-serif; font-size: 30px; font-stretch: normal; line-height: normal; padding: 10px 20px; position: relative; text-decoration: none; text-shadow: rgba(255, 255, 255, 0.4) 1px 1px 0px; transition: background-position 1s; vertical-align: baseline; white-space: nowrap;" target="_blank">Live Demo</a></div>
<br />
<br />
<br />
<div class="code" style="background-attachment: initial; background-clip: initial; background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg_A6UCACj7lzkc6RQWaXeH21t_M2FpXey_i-u2nxBG0CxjI_7RIhDrL9J6Uqx0IhT_KdCBsZFoTBd3jo_2pm5edb0WckL48zHKeMYB6NYMMINubK0Z4iMOwA9G-XWD1m0VFsDI0Af13emE/); background-origin: initial; background-position: 0% 0%; background-repeat: repeat-y; background-size: initial; color: black; font-family: 'Courier New'; font-size: 9pt; margin: 5px 10px; max-height: 200px; overflow: auto; padding: 4px 10px 0px 40px;">
<link rel="stylesheet" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.6/themes/vader/jquery-ui.css" type="text/css" /></div>
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<b><span style="color: blue;"><u>Adding HTML Code</u></span></b><br />
<br />
<br />
<br />
Now let's start adding it...<br />
<br />
<b><span style="color: blue;">Step 1.</span></b> Login to Your Blogger Account.Go to your Blogger Dashboard.Click on Layout tab from left pane and click on Add a Gadget link.<br />
<br />
<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<a class="external_link" href="http://bit.ly/work24" imageanchor="1" style="color: #999999; margin-left: 1em; margin-right: 1em; text-decoration: none;" target="_blank"><img alt="Blogger Tips And Tricks|Latest Tips For Bloggers" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh3xS0qD7ryZOKBZcARpzl2P8X6ZepEdp0hue2prP_1DqmO0YvQbLwpPbt3iwhfIWXrQt2Izu8Mdxp8FbaLWWQGWm5e0fT5NFZ02kaHCicsxQNnR59vHYEtZO_HIBSopPDWWS68yGqr3ulv/s1600/Blogger+Dashboard,+go+to+Layout+and+click+on+Add+a+Gadget+link.png" height="345" img="" style="-webkit-transition: all 0.4s ease-in-out; border: 1px solid rgb(192, 192, 192); height: auto; max-width: 95%; padding: 4px; transition: all 0.4s ease-in-out;" width="550" /></a></div>
<br />
<b><span style="color: blue;">Step 2.</span></b> After click on Add a Gadget link A pop-up box will open now<br />
with many gadget list, Choose HTML/JavaScript from the gadget options by clicking the blue plus sign for that gadget.<br />
<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<a class="external_link" href="http://bit.ly/work24" imageanchor="1" style="color: #999999; margin-left: 1em; margin-right: 1em; text-decoration: none;" target="_blank"><img alt="Blogger Tips And Tricks|Latest Tips For Bloggers" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhvFtbA-BSQQYQcLS8lL2Iol2A-GQA62M2ijA2oyzz6ZIStorRHSjNobo-iPh5duUjw0a-Xd6X68HPaUpNXj7fs5tiddwZgwmSGhvx2B0-ESFCoiInMXHR4gk3KB5mF17t6aN8NGrsmr7ph/s1600/pop-up+window,+choose+the+HTMLJavaScript+widget.png" height="219" img="" style="-webkit-transition: all 0.4s ease-in-out; border: 1px solid rgb(192, 192, 192); height: auto; max-width: 95%; padding: 4px; transition: all 0.4s ease-in-out;" width="486" /></a></div>
<br />
<b><span style="color: blue;">Step 3.</span></b> Select 'HTML/Javascript' and add the one of code given below.<br />
<br />
<b><span style="color: blue;">Step 4.</span></b> Now Click On Save 'JavaScript' You are done.<br />
<br />
<br />
<br />
<br />
<div class="code" style="background-attachment: initial; background-clip: initial; background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg_A6UCACj7lzkc6RQWaXeH21t_M2FpXey_i-u2nxBG0CxjI_7RIhDrL9J6Uqx0IhT_KdCBsZFoTBd3jo_2pm5edb0WckL48zHKeMYB6NYMMINubK0Z4iMOwA9G-XWD1m0VFsDI0Af13emE/); background-origin: initial; background-position: 0% 0%; background-repeat: repeat-y; background-size: initial; color: black; font-family: 'Courier New'; font-size: 9pt; margin: 5px 10px; max-height: 200px; overflow: auto; padding: 4px 10px 0px 40px;">
<!-- Tabbed Navigation Widget For Blogger By 24work --><br />
<br />
<br />
<div id="tabs"><br />
<ul><li><a href="#tabs-1">Tab1</a></li><li><a href="#tabs-2">Tab2</a></li><li><a href="#tabs-3">Tab3</a></li></ul><br />
<br />
<div id="<span style="color: red;">tabs-1</span>"> <span style="color: red;">Tab 1 content goes here </span></div><br />
<div id="<span style="color: blue;">tabs-2</span>"> <span style="color: blue;">Tab 2 content goes here </span></div><br />
<div id="<span style="color: lime;">tabs-3</span>"> <span style="color: lime;">Tab 3 content goes here </span></div><br />
<br />
<a href="http://horizon-tut.blogspot.com/" target="_blank" title="Blogger Tips and Tricks"><img src="https://bitly.com/24workpng1" alt="Blogger Tips and Tricks" border="0" style="position: fixed; bottom: 10%; right: 0%; top: 0px;" /></a><br />
<a href="http://<span style="line-height: 19.2000007629395px;">horizon-tut.blogspot.com</span>/" target="_blank" title="Latest Tips For Bloggers"><img src="https://bitly.com/24workpng1" alt="Latest Tips For Bloggers" border="0" style="position: fixed; bottom: 10%; left: 0%;" /></a><br />
<a href="http://<span style="line-height: 19.2000007629395px;">horizon-tut.blogspot.com</span>/" target="_blank" title="Free Backlinks"><img src="https://bitly.com/24workpng1" alt="Free Backlinks" border="0" style="position: fixed; bottom: 10%; right: 0%;" /></a><br />
</div><br />
<!-- Tabbed Navigation Widget For Blogger By 24work --></div>
<br />
<br />
<br />
<span class="Apple-style-span" style="background-color: white; color: #444444; font-family: Arial, Tahoma, Helvetica, FreeSans, sans-serif; font-size: 13px; line-height: 18px;"><b><span style="color: #ff9900;">Note:</span></b><br /><b>Replace these with your tab titles</b></span><br />
<div align="justify">
<span class="Apple-style-span" style="background-color: white; color: #444444; font-family: Arial, Tahoma, Helvetica, FreeSans, sans-serif; font-size: 13px; line-height: 18px; orphans: 2; text-align: left; widows: 2;"><b><br /></b></span></div>
<div align="justify">
<span class="Apple-style-span" style="background-color: white; color: #444444; font-family: Arial, Tahoma, Helvetica, FreeSans, sans-serif; font-size: 13px; line-height: 18px; orphans: 2; text-align: left; widows: 2;"><b><code><b><span style="color: red;">Tabs-1</span></b></code></b></span><span class="Apple-style-span" style="background-color: white; color: #444444; font-family: Arial, Tahoma, Helvetica, FreeSans, sans-serif; font-size: 13px; line-height: 18px; orphans: 2; text-align: left; widows: 2;"><b><code></code><span class="Apple-converted-space"> </span>, <code></code></b></span><span class="Apple-style-span" style="background-color: white; color: #444444; font-family: Arial, Tahoma, Helvetica, FreeSans, sans-serif; font-size: 13px; line-height: 18px; orphans: 2; text-align: left; widows: 2;"><b><code><b><span style="color: #0033ff;">Tabs-2</span></b></code></b></span><span class="Apple-style-span" style="background-color: white; color: #444444; font-family: Arial, Tahoma, Helvetica, FreeSans, sans-serif; font-size: 13px; line-height: 18px; orphans: 2; text-align: left; widows: 2;"><b><code></code> , <code></code></b></span><span class="Apple-style-span" style="background-color: white; color: #444444; font-family: Arial, Tahoma, Helvetica, FreeSans, sans-serif; font-size: 13px; line-height: 18px; orphans: 2; text-align: left; widows: 2;"><b><code><b><span style="color: #00cc00;">Tabs-3</span></b></code></b></span></div>
<div align="justify">
<span class="Apple-style-span" style="background-color: white; color: #444444; font-family: Arial, Tahoma, Helvetica, FreeSans, sans-serif; font-size: 13px; line-height: 18px; orphans: 2; text-align: left; widows: 2;"><b><code><b><span style="color: #00cc00;"><br /></span></b></code></b></span></div>
<div align="justify">
<span class="Apple-style-span" style="background-color: white; color: #444444; font-family: Arial, Tahoma, Helvetica, FreeSans, sans-serif; font-size: 13px; line-height: 18px; orphans: 2; text-align: left; widows: 2;"><b>Replace these with your widget codes.</b></span></div>
<div align="justify">
<span class="Apple-style-span" style="background-color: white; color: #444444; font-family: Arial, Tahoma, Helvetica, FreeSans, sans-serif; font-size: 13px; line-height: 18px; orphans: 2; text-align: left; widows: 2;"><b><br /></b></span></div>
<div align="justify">
<span class="Apple-style-span" style="background-color: white; color: #444444; font-family: Arial, Tahoma, Helvetica, FreeSans, sans-serif; font-size: 13px; line-height: 18px; orphans: 2; text-align: left; widows: 2;"><b><code><b><span style="color: red;">Tab 1 content goes here</span></b></code> , <code><b><span style="color: #0033ff;">Tab 2 content goes here</span></b></code> ,</b> <code><b><span style="color: #00cc00;">Tab 3 content goes here</span></b></code></span></div>
<br />
<br />
<br />
<br />
<br />
<div style="color: #674ea7;">
<u><span style="font-size: medium;"><b>Adding HTML Code</b></span></u></div>
<br />
<br />
Use bellow Form to add HTML widget code to Blogger<br />
<br />
<br />
<blockquote style="background-color: #f6ebc1; border-left-color: rgb(252, 226, 124); border-left-style: solid; border-left-width: 5px; margin: 1em 3em; padding: 0.5em 1em;">
<h2 style="background-color: #f9780e; border-radius: 20px; border: 1px solid rgb(17, 17, 17); font-family: Verdana, Arial; font-size: 16px; line-height: normal; margin: 5px 0px 1em; padding: 3px 10px; text-align: center;">
Tabbed Navigation Widget Generator For Blogger</h2>
<table align="center" style="font-family: Verdana, Arial; width: 100%px;"><tbody>
<tr><td width="45%">Tab Title1:</td><td width="55%"><input name="w2b-tab1" size="15" type="text" value="Tab1" /></td></tr>
<tr><td>Tab Content1:<br />
<b style="font-size: 13px;">(Html Code or Js Code or Plain text)</b></td><td><textarea name="w2bcontent1" style="height: 150px; width: 308px;" type="text" value=""></textarea></td></tr>
<tr><td>Tab Title2:</td><td><input name="w2b-tab2" size="15" type="text" value="Tab2" /></td></tr>
<tr><td>Tab Content2:<br />
<b style="font-size: 13px;">(Html Code or Js Code or Plain text)</b></td><td><textarea name="w2bcontent2" style="height: 150px; width: 308px;" type="text" value=""></textarea></td></tr>
<tr><td>Tab Title3:</td><td><input name="w2b-tab3" size="15" type="text" value="Tab3" /></td></tr>
<tr><td>Tab Content3:<br />
<b style="font-size: 13px;">(Html Code or Js Code or Plain text)</b></td><td><textarea name="w2bcontent3" style="height: 150px; width: 308px;" type="text" value=""></textarea></td></tr>
</tbody></table>
<br style="color: black; font-family: Verdana, Arial; font-size: small; line-height: normal;" />
<form action="https://www.blogger.com/add-widget" method="post" style="color: black; font-family: Verdana, Arial; font-size: small; line-height: normal;" target="_blank">
<input name="gen" style="margin-right: 5px; width: 100px;" type="button" value="Generate" /><input style="width: 100px;" type="button" value="Default" /><br />
<input disabled="disabled" name="go" style="font-size: 18px; font-weight: bold; margin-top: 5px; width: 205px;" type="submit" value="Add to Blogger" /></form>
<center style="color: black; font-family: Verdana, Arial; font-size: small; line-height: normal;">
<b>Copyright ©2011 All Rights Rserved by @ horizon-tut.blogspot.com</b></center>
</blockquote>
<br />
<br />
<b style="line-height: 19.2000007629395px;"><i>Yes! You are Done! </i></b><br />
<br style="line-height: 19.2000007629395px;" />
<div style="color: #999999; font-family: 'Trebuchet MS', sans-serif; line-height: 19.2000007629395px;">
<b>For any assistance and customization of this widget you can surely contact me via comments or Contact form.</b></div>
<br style="line-height: 19.2000007629395px;" />
<span style="line-height: 19.2000007629395px;">Have a Nice Day...</span><br />
<br />
<br />
<br /></div>
<div style="clear: both;">
</div>
</div>
<span class="datex show" style="-webkit-transition: all 0.4s ease-in-out; background-color: #2e2e2e; color: white; display: block; font-family: Verdana, Geneva, sans-serif; font-size: 12px; left: 15px; padding: 3px 0px; position: absolute; text-align: center; top: 0px; transition: all 0.4s ease-in-out; z-index: 0;"><b style="display: block; font-size: 21px; padding: 0px 2px;">0</b></span></div>
Ghous uddinhttp://www.blogger.com/profile/13773797017118313457noreply@blogger.com0tag:blogger.com,1999:blog-9181450838141665570.post-46731701887020207332015-02-11T19:52:00.004-08:002015-03-15T11:39:08.252-07:00Add Snow Effect below your Mouse Cursor <div dir="ltr" style="text-align: left;" trbidi="on">
<h1 class="post-title entry-title" itemprop="name headline" style="border-bottom-color: rgb(192, 192, 192); border-bottom-style: solid; border-bottom-width: 1px; color: #141414; font-family: 'Open Sans', serif, sans-serif; font-size: 18.6000003814697px; font-stretch: normal; margin: 0px 0px 15px; padding: 0px 0px 5px 50px;">
<a class="external_link" href="http://24work.blogspot.com/2011/12/how-to-add-snow-effect-on-blogger-mouse.html" itemprop="url" style="color: #141414; display: block; text-decoration: none;" target="_blank"><br /></a></h1>
<div class="post-body entry-content" id="post-body-4923216769626061553" itemprop="description articleBody" style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em; margin: 0px 0px 0.75em;">
<div dir="ltr" trbidi="on">
<div class="separator" style="clear: both; text-align: center;">
<a class="external_link" href="http://bit.ly/trHoJv" imageanchor="1" style="clear: left; color: #999999; float: left; margin-bottom: 1em; margin-right: 1em; text-decoration: none;" target="_blank"><img alt="Snow Cursor Mouse Cursor Area" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgDdALr_6ac66Oku3NGCQYb6oCe74QPokM97RciYyo4WTxHFq1NoMSLR-JHWIANQYyGALyoJGOQV8nNhDeO7OSLFKdyB5ztxTErAUOUi3u5k7ReBfVQU0F0UmoN_5avZwEtL93Yai-_h1sV/s1600/Snow+Cursor+Mouse+Cursor+Area.png" style="-webkit-transition: all 0.4s ease-in-out; border: 1px solid rgb(192, 192, 192); height: auto; max-width: 95%; padding: 4px; transition: all 0.4s ease-in-out;" title="Snow Cursor Mouse Cursor Area" /></a></div>
<br />
<br />
Hello! `How are you guys? Adding snow effect when you move the mouse cursor will change the look of your blog. here is the effect of fresh snow in your area simple mouse blog. This will make your blog more cold than snow falling from the mouse cursor. Effect is very simple gadget to use. So this is very fast. I tested this effect in Internet Explorer, Mozilla Firefox and many other web browsers. This simple and not flash based image works great! I hope you enjoy using this very cool snow effect gadget. So, let's see how to Add Snow Effect On The Mouse Cursor On The Blog..<br />
<br />
<a href="https://www.blogger.com/null" name="more"></a><a href="https://www.blogger.com/null" name="more"></a><br />
<br />
<br />
<br />
<div style="text-align: center;">
<a class="button big green external_link" href="http://24work.blogspot.com/p/color-code-generator.html" rel="nofollow" style="-webkit-box-shadow: rgb(255, 255, 255) 0px 0px 1px inset; -webkit-transition: background-position 1s; background-clip: border-box; background-color: #79be1e; background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiahyphenhyphenl-cVfe0N50mVbpXndF0yaLprwejhgK1k2Ja7QUXeMuhnxPIb8uUvilCIm8alGKvBDcYiSbP_LuIJ22w5QCYuIIaT_vaI1W7kHbxz46s-E_ZEWfLkXxK0UwZ-OBEZrNn_j7yNs203Nw/s144/button_bg.png), url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiahyphenhyphenl-cVfe0N50mVbpXndF0yaLprwejhgK1k2Ja7QUXeMuhnxPIb8uUvilCIm8alGKvBDcYiSbP_LuIJ22w5QCYuIIaT_vaI1W7kHbxz46s-E_ZEWfLkXxK0UwZ-OBEZrNn_j7yNs203Nw/s144/button_bg.png), -webkit-gradient(radial, 50% 100%, 0, 50% 100%, 100, from(rgb(162, 211, 30)), to(rgba(162, 211, 30, 0))), -webkit-gradient(linear, 0% 0%, 0% 100%, from(rgb(130, 204, 39)), to(rgb(116, 179, 23))); background-position: 0% 100%, 100% 0%, 0px 0px, 0px 0px; background-repeat: no-repeat; border-radius: 8px; border: 1px solid rgb(150, 163, 123) !important; box-shadow: rgb(255, 255, 255) 0px 0px 1px inset; color: rgb(52, 89, 3) !important; cursor: pointer; display: inline-block; font-family: Calibri, Arial, sans-serif; font-size: 30px; font-stretch: normal; line-height: normal; padding: 10px 20px; position: relative; text-decoration: none; text-shadow: rgba(255, 255, 255, 0.4) 1px 1px 0px; transition: background-position 1s; vertical-align: baseline; white-space: nowrap;" target="_blank">Live Demo</a></div>
<br />
<span style="background-color: #f4cccc; color: blue; font-size: medium;">Snow Effect On The Blogger Mouse Cursor Area Generator</span><br />
<br />
<b><span style="color: orange;">How To Add Snow Cursor Mouse Cursor Area Widget To Blogger?</span></b><br />
<br />
<br />
<ol>
<li>Choose a type of Mouse Cursor below</li>
<li>Click on "<b><span style="background-color: #f4cccc; color: purple;">Genetate</span></b>" button</li>
<li>Finally click on "<b><span style="background-color: blue; color: yellow;">Add to Blogger</span></b>" to add it to your blog.</li>
</ol>
<br />
<br />
<br />
<div style="border: 2px dashed red; padding: 10px;">
<table border="0" style="color: black; font-family: Verdana, Arial; font-size: small; width: 560px;"><tbody>
<tr><td><div id="content-wrapper" style="background: rgb(249, 234, 212); border-radius: 20px; border: 5px solid rgb(255, 68, 8); margin: 0px auto; padding: 5.53125px; width: 526.296875px;">
<h2 style="background-color: #ff4408; border-radius: 20px; border: 1px solid rgb(17, 17, 17); color: #333333; font-size: 16px; margin: 5px 0px 1em; padding: 3px 10px; text-align: center;">
Blogger Mouse Cursor Snow Effect Generator by 24work.blogspot.com</h2>
<form action="https://www.blogger.com/add-widget" method="post" target="_blank">
I take the mouse cursor image from http://24work.blogspot.com and you can change it anytime depends on your festive moods.<br />
<fieldset style="border-radius: 8px; border: 1px solid rgb(170, 170, 170); padding: 10px; width: 515.765625px;">
<legend style="border-radius: 4px; border: 1px solid rgb(170, 170, 170); font-size: 15px; font-weight: bold; padding: 2px 10px;">Select One Effect</legend><br />
<table><tbody>
<tr><td><input checked="checked" name="mdttype" type="radio" value="code/01_black_000000_24work.blogspot.com.js" /></td><td><img class="middle" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiFncPop-8_loXd-P28nBatlzKGWJmS0OlxHPrsRZLIpVg7FtlQ3yNjVb_QFrPDbHPVjRuZJYc-ZWHhJ4PLEaLfQcdRUbWYvlBJT2BVWyqggoqRRjEs500laJ4Zjik7WVLbVvBKz0JQc90k/s1600/01+black+%23000000+24work.blogspot.com.gif" /></td><td><input name="mdttype" type="radio" value="code/02_cornflower_blue_151b8d_24work.blogspot.com.js" /></td><td><img class="middle" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgh_kjSF200AahUoDRpZW2vywJgO-HVCvSUbdAq3n3Sb4SBO810XeNXAVfzygbnS1OaVDEKcgqWkG8tp2YLZMO1gEFqkwKcwUI8BUFTTzRmSMvUbBoydZQZUAPkSuTQvvc0cMNHwki1Ggoi/s1600/02+cornflower+blue+%23151b8d+24work.blogspot.com.gif" /></td><td><input name="mdttype" type="radio" value="code/03_dark_slate_gray4_4c7d7e_24work.blogspot.com.js" /></td><td><img class="middle" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhFFUtL6qzRNFleIhQujec1pAVScaAup4pOfNzQbFSIdIy98M4GGDMhfHsjpc1gktvNMDVHDqOhvSUTDdsfxvSvDq8p1ZK78nkalsiZOpOGElZpZolv38T2YxNP5b3Ar_hoKAACE92VELu7/s1600/03+dark+slate+gray4+%234c7d7e+24work.blogspot.com.gif" /></td><td><input name="mdttype" type="radio" value="code/04_dark_slate_blue_2b3856_24work.blogspot.com.js" /></td><td><img class="middle" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgsvszDBopyQm9kt_ggE6Uuw-DFghN2hHwlQHIQNBEY0C3swiLvSWYwrIIt2rg461Ax7sAYF_Zd5G4IM8SekzM2BveMopsZw3sfiaMgvh2A5bhhXNgdmVrxFjq-yzr1LLtKW5GURcjonnCG/s1600/04+dark+slate+blue++%232b3856+24work.blogspot.com.gif" /></td><td><input name="mdttype" type="radio" value="code/05_dark_slate_gray_25383c_24work.blogspot.com.js" /></td><td><img class="middle" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjUzqjdoBG4ElLZjdfKW6mOmwCFgMHKenXELrAgInM4qZICs74sDO2GHUHJg_9JeDivMglJn2wf95qeAN-o8-hDQKV_wJpvLdFUllE_mVZMbm0DlLvk7KEA72jRwF5ewUJe7aFxmRfcVmy8/s1600/05+dark+slate+gray+%2325383c+24work.blogspot.com.gif" /></td><td><input name="mdttype" type="radio" value="code/06_dim_gray_463e41_24work.blogspot.com.js" /></td><td><img class="middle" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjYEji_P3Gx5DPer-m1J7WawgAUzC1ULFPEYY9bhMzvGF2254HGCH-MSFwjXRlLUVn5rhUS0frjLyBJk5e0oT8lfGrkzQZuB9QEvGa3AFWMC78NpghA4tZWbf2v-MgwGHQZhcj6cQ0CZK_7/s1600/06+dim+gray+%23463e41+24work.blogspot.com.gif" /></td><td><input name="mdttype" type="radio" value="code/07_medium_purple4_4e387e_24work.blogspot.com.js" /></td><td><img class="middle" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi0nks4Xd6vd2-L_Iw2MRs9qLQ5wg1nmqWTzcD9F0nEb7Q0xW-YrS3KGmlkikC9Dsez6A2gsEFnr86w7BObVZL3Ulx90-QfsiGJ0xMFZExSN6Bc1bJWaDfXYGQPC9IX61RorTZ2dBZ7JCFU/s1600/07+medium+purple4++%234e387e+24work.blogspot.com.gif" /></td></tr>
<tr><td><input name="mdttype" type="radio" value="code/08_medium_slate_blue_5e5a80_24work.blogspot.com.js" /></td><td><img class="middle" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiqfRG57xo81kQyxJWfA1Nc8wPUZ8Z6Djd93RbM3pGT1CP6XSoOZdO5BSkEvddHTdUYHOnKEy8crKAlWGjRPcETFvL311NICxinenoIMlDa-JESCV-BtLZwNSiWldTsWWFem5Eh4nWwYb4z/s1600/08+medium+slate+blue++%235e5a80+24work.blogspot.com.gif" /></td><td><input name="mdttype" type="radio" value="code/09_midnight_blue_151b54_24work.blogspot.com.js" /></td><td><img class="middle" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj_Ak4llLLuti2W_kMPVBDbxxMzaVQ_Ja6CgyD3a8MLgA8XjFfLqLK3xDHt-SQDWqvuvBTclTjfHM00YACS2n9ljYQbuRcDgjYWUbvNhd8YLSM3DBze3S06fztXszvjSR-dSW6FiOUzly3c/s1600/09+midnight+blue++%23151b54+24work.blogspot.com.gif" /></td><td><input name="mdttype" type="radio" value="code/010_slate_blue4_342d7e_24work.blogspot.com.js" /></td><td><img class="middle" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgSEoz1ZcS37pu1aFPRzpx9m9WIxKTh9-KBYcI1tj4E7p-oa_lLXj_Zt7hFU9t5mqpuyyBsZk2XxiScnKEL19WcYWunQ7i13w_iQ6nP0nnvXkRmeHnP3i6wLLuEFMqV9qi43nWMElYORqaR/s1600/010+slate+blue4+%23342d7e+24work.blogspot.com.gif" /></td><td><input name="mdttype" type="radio" value="code/011_thistle4_806d7e_24work.blogspot.com.js" /></td><td><img class="middle" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg0zNX9ek_-I2jUP_ayncvhJBhyphenhyphenvybA90ORTsJROtPCJjX_CPTnc1NgCxqonxwMvF2DTaByENqOGglXOx12WEHycZ87Dq-B7yDERzJRFzwwGVUKcqIeWwXqI056cIlCtju4VTIQSxgJAaOF/s1600/011+thistle4++%23806d7e+24work.blogspot.com.gif" /></td><td><input name="mdttype" type="radio" value="code/012_royal_blue4_15317e_24work.blogspot.com.js" /></td><td><img class="middle" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEij1VUznxmEVd3K-p0IPEXkNx6Q2M281x0YWOqRlyPG1izgGjioagG_5yGwXMKfxdZW8cZjnVRjV-Xr7RDOcpdN96tR5in4hIC3gwG_eFdS2BthcMAQhqOzADEsmS7h0C_bt2SeRTh3LJJk/s1600/012+royal+blue4++%2315317e+24work.blogspot.com.gif" /></td><td><input name="mdttype" type="radio" value="code/013_slate_blue5_342d7e_24work.blogspot.com.js" /></td><td><img class="middle" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhSpk7MI28GlZ_ZxqhlRhXu9DoYfp4OFkraW83WT0zCYMd01pvUzVFjGjaB_Sh3ObASNKij-77j1HRvSUAowGKz3f-wZPiWzPlYXoth2jddT_zyqB8dK9W48foaYVdiYK6QaIRcQk7FC8Pw/s1600/013+slate+blue5+%23342d7e+24work.blogspot.com.gif" /></td><td><input name="mdttype" type="radio" value="code/014_royal_blue_2b60de_24work.blogspot.com.js" /></td><td><img class="middle" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgCBBO7vCeiQ6OXtIgi2DLJ1CrvIaeQ8p0oMZ06KJUqf2doT895S8QEjBsNjpX-3u8iHo7mBbdEBtcXjoCf_xkMaCRttMc1jEKQz68qJM4GoJbiE9PRBcQHPZz71aL84F4b65GOTdsGiz2l/s1600/014+royal+blue+%232b60de+24work.blogspot.com.gif" /></td></tr>
<tr><td><input name="mdttype" type="radio" value="code/015_royal_blue3_2554c7_24work.blogspot.com.js" /></td><td><img class="middle" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi6zdJXZpY14ww1DIdobD1oV6tzpDoulowQXCi3CVg1cIYFRnplGYtf9Oz_u_5Jd6ZTV0C5X8LabiitMQCgL3eeMyAyumlvDhlLRNM9Q8IDlv6qMLxvSe1s7Q31qilNsh4r-7wSDhckmtDU/s1600/015+royal+blue3++%232554c7+24work.blogspot.com.gif" /></td><td><input name="mdttype" type="radio" value="code/016_deep_sky_blue_3bb9ff_24work.blogspot.com.js" /></td><td><img class="middle" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj6lFsqKH2QFBKfiRIs_XNqkEZJh_7NmaqK8e39RXshLFvm4SwjxOffZ3c36e905U5Es-CjgIZTYDO6GKKz-HeV06Sve6jfP8DAFnHaNmHRppucrCqqC2qceeXBy51Kvi6O6NccPjLnNKe0/s1600/016+deep+sky+blue+%233bb9ff+24work.blogspot.com.gif" /></td><td><input name="mdttype" type="radio" value="code/017_slate_blue_357ec7_24work.blogspot.com.js" /></td><td><img class="middle" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgner-BFwytlMSkIagVpYGyb492JEX9hr0uS7dS8j8fBw6EnaoKvrAsddVjZ8qC3PCQwE68uDqKXh6P9wBfBVSZhKDx-60Z_PzF1mHwqMz-81lPRQOt49NV2H8R0OyRYogZCOZU5F44KJgr/s1600/017+slate+blue+%23357ec7+24work.blogspot.com.gif" /></td><td><input name="mdttype" type="radio" value="code/018_deep_sky_blue3_3090c7_24work.blogspot.com.js" /></td><td><img class="middle" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgPlRARnLuTbwhb4D1IlNKb1oiGOdTCqTEX-_rwFPehabFo-lG0QglH2O4lX6ePg5R9PFEIHrfazGpOuAVOiqSPqd-VI76f7N-_UfDSPi8G1e-KyD9t4v4d7oGKRUOXx-OxqqvQrFqH8NOT/s1600/018+deep+sky+blue3+%233090c7+24work.blogspot.com.gif" /></td><td><input name="mdttype" type="radio" value="code/019_deep_sky_blue4_25587e_24work.blogspot.com.js" /></td><td><img class="middle" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgvl4hccsGHuqL7UVrY05xDmFq-Ty1nYa9QxZN1ZsBjUdVIdxKa7mfx0JUfDGDT3XDtP0fDPHG-tBnz_CHmwt3TWa28qosaBZGdiMzFE8idW0PMmFPySYqOsdG8t1-9QgOdhXVmWAnM9u-a/s1600/019+deep+sky+blue4+%2325587e+24work.blogspot.com.gif" /></td><td><input name="mdttype" type="radio" value="code/020_dodger_blue_1589ff_24work.blogspot.com.js" /></td><td><img class="middle" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhEEEfZmcL1YAyA0jZS9twlD0EEnU8AcOA2n6W2bMwIKIVPFE9LhMgDXfYUwPfYJIeIG6yEuYJg42hMtW3W1axj9CPjshtm08n_mHbDCKDI2Xd4mSOA7mpxaI3cuhsDaZk5lU74iDYk9FGV/s1600/020+dodger+blue++%231589ff+24work.blogspot.com.gif" /></td><td><input name="mdttype" type="radio" value="code/021_dodger_blue4_153e7e_24work.blogspot.com.js" /></td><td><img class="middle" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi1clFvR_3wpFb-_uo7YJHHKWRnsjCCdE6WdLW8YFTSCvRWmqbPi9yxGi1ydnx42MYi_jx_SGLGxeBIEwK4DxW6m7bppVKwAuZqFjqLgHm3xSEWZ1KLKk5H3YNOwmDjkxYZqvcOH1sbl8bY/s1600/021+dodger+blue4+%23153e7e+24work.blogspot.com.gif" /></td></tr>
<tr><td><input name="mdttype" type="radio" value="code/022_steel_blue4_2b547e_24work.blogspot.com.js" /></td><td><img class="middle" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiaJBm9PDTxWDBXVMG4L9xCKBOY3AELi7TiFcGz_HxZARfju9rM14_se_4borl8CJ8L130QlPqNshgtG4NZSVb9zm1GiApaqpylc6KOiVKfAUd9NKxkEBvOEdSKERY_Y9B4ttgjyPIGRRsS/s1600/022+steel+blue4+%232b547e+24work.blogspot.com.gif" /></td><td><input name="mdttype" type="radio" value="code/023_steel_blue_4863a0_24work.blogspot.com.js" /></td><td><img class="middle" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh2J2XU2vvHtXRVpyXsTvMOD8u4usWYGVV98JxQ1qkhk2c_QiaIxNNyJud7JiFlE55jNkgE83TX9zwkp_jYzYOGQ_WZ4dJbAR102R9hF23UYXwpmVmR4y1oXvb5vBUQriuUp8n-u72OfKhS/s1600/023+steel+blue+%234863a0+24work.blogspot.com.gif" /></td><td><input name="mdttype" type="radio" value="code/024_slate_blue2_6960ec_24work.blogspot.com.js" /></td><td><img class="middle" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgjXFC-6neLHHh8De7oFmXqGe55b-KySZCeJF4bA3n3muc5ViEoP13Mwwtgjk0rf635_Pr-6p3z0l_1elXfy4RQvsPzoCWytZCtIaa7K14NEzZ1kCc2cMZ9asUe1XAh45qa6LHyApZ6uxqa/s1600/024+slate+blue2+%236960ec+24work.blogspot.com.gif" /></td><td><input name="mdttype" type="radio" value="code/025_violet_8d38c9_24work.blogspot.com.js" /></td><td><img class="middle" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiTjP9pm6L0laG2LZy-zrjZfaipbCikUenFcBpGBkldOkBPF-1MeFgaRXZjcYdmkkMxoOm81j0YecWs99i5GCb-pYmAb3p3FImKat_v4LzBaFop1V2_mtMFJOP8_U85NYcTPJVt5QyEGFZJ/s1600/025+violet+%238d38c9+24work.blogspot.com.gif" /></td><td><input name="mdttype" type="radio" value="code/026_slate_gray3_98afc7_24work.blogspot.com.js" /></td><td><img class="middle" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhgI85PDj4q717LII8RUyCTCX5WLgDuosNaWIm8zprVitNeJJR0Cy270rt025pjf2a6_AbhTtlnZeo2tTMbkSGjC0GHRHuVXxMKT2-kgdGiXydiwFaWiAFzY4Kkd3f38W2SbgYvTsAbrAQi/s1600/026+slate+gray3+%2398afc7+24work.blogspot.com.gif" /></td><td><input name="mdttype" type="radio" value="code/027_deep_pink4_7d053f_24work.blogspot.com.js" /></td><td><img class="middle" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgBaWc93RUDfJpq2xng9TzQjp3TL8DzNCJqsJg-7wfpMLVJ4C8DiFHJVp8eV-z6ffa0oUrbVTjPq7qp0pv6NVqfzjgPsffmNFngz2Cp7lJsC0tDw3FAiqaDXkVlfULvfgZhAEn4f0-QC8Uq/s1600/027+deep+pink4++%237d053f+24work.blogspot.com.gif" /></td><td><input name="mdttype" type="radio" value="code/028_light_steel_blue_728fce_24work.blogspot.com.js" /></td><td><img class="middle" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjb9M5B1_7LnO8jMxc64CVSOHdFpgW1zp3U2-Mz2z2-RKvBbKOOJ5RHZKpUH1B9FrODwtE0yhpK-lXP3ahkIk9Bw4-83w-dTvU4mC6wYhbx1iCxaytIQ4rWS9Coi5qmgqnkMIhScnU9Euae/s1600/028+light+steel+blue+%23728fce+24work.blogspot.com.gif" /></td></tr>
<tr><td><input name="mdttype" type="radio" value="code/029_steel_blue3_488ac7_24work.blogspot.com.js" /></td><td><img class="middle" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEicQx2qjdErCNjKTbiocNzfm8aev-ToBPmLnEDT_VC74rUkWh94pAvO_lgLgT-06TGYpHnaWBaGD7fQxl0U0BW2OqNO1CplJDobmAvapRUgXStY-VE2P1VXZRCxfD68RQVXCKg155Rw_21T/s1600/029+steel+blue3+%23488ac7+24work.blogspot.com.gif" /></td><td><input name="mdttype" type="radio" value="code/030_steel_blue2_56a5ec_24work.blogspot.com.js" /></td><td><img class="middle" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjTx7OpMQo1VgKPmJOMv8uSyss6FeV8Y0Q-fi9lpOb_lMC-JK845sCK0DuvjmA91h4lZS8Utfj7itFehm-sKIOL0-WE69pie7cL8X2JEMlNm_KWohQM_Yv4VmL81Rfghbezuj_x9MeHPMaT/s1600/030+steel+blue2+%2356a5ec+24work.blogspot.com.gif" /></td><td><input name="mdttype" type="radio" value="code/031_violet_red_f6358a_24work.blogspot.com.js" /></td><td><img class="middle" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh5lOuc_1PmrAXRBsvmIHF0eq5QzSoM3zSnZ3F5byxDEmny-rKPnN8Mz_dC7LVQCAhYC3RjdDeV9UwG57_wod-zWJgjCWcngtqqvV7JL37h45DY356XwW4fsMQ4ZvVhV5gVHfm6zQ515TnR/s1600/031+violet+red+%23f6358a+24work.blogspot.com.gif" /></td><td><input name="mdttype" type="radio" value="code/032_firebrick_800517_24work.blogspot.com.js" /></td><td><img class="middle" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg3rLMkAgYwrycGA-LzYJ3I-E0uZBfO6746OSzLiEaQQVHGrypWiOoMU9pXktzlOjWS1rOq-4nuJF1Of_qhfRGIuxMY2pH95PpixX13EXEyJC1QLVJtNg4G5Yo99r2xK4CpLelBNSVRHyFc/s1600/032+firebrick+%23800517+24work.blogspot.com.gif" /></td><td><input name="mdttype" type="radio" value="code/033_maroon4_7d0552_24work.blogspot.com.js" /></td><td><img class="middle" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj2dzBtQHcK99fLuBHnV0Hal4DiVhZ7aiTkOPUbBC_MA0dnrI9RqPyXQcxKmKXTWTUQI5mCR3puTJdVKPZQEa-bexFoRXmbKDcGesvW2MuEM3jlVv6xEnqaizY3F2_OUAsvtd55HJThCRDF/s1600/033+maroon4+%237d0552+24work.blogspot.com.gif" /></td><td><input name="mdttype" type="radio" value="code/034_maroon3_c12283_24work.blogspot.com.js" /></td><td><img class="middle" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiqJ0GVj_B1M5Tnl7iNakBZXlhoIlSwRLUuhCNMKUoB-AuUNKzsHBirP36I1S6-NnU6SvU1U5ty_hdl30re8iUIDeY1BAYlwJxAIaI89g1Lqukomux-ZpIN7G0IFHQUIHYIvp7NLbwe3x4S/s1600/034+maroon3+%23c12283+24work.blogspot.com.gif" /></td><td><input name="mdttype" type="radio" value="code/035_maroon1_f535aa_24work.blogspot.com.js" /></td><td><img class="middle" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgbA3dfxpMYambx-OgXUdCLgxarjfTZB_PF3tG_-J1tfmnTkdYDZ8zAROD04yRsC_vWcsgbIqRl1H-b1Bs7L9s7ETvpWbYSWd0LWa9MEHT1t5DBf0Cm-gYomplfiIHBPWFziZN1IyfKddo5/s1600/035+maroon1++%23f535aa+24work.blogspot.com.gif" /></td></tr>
<tr><td><input name="mdttype" type="radio" value="code/036_magenta_ff00ff_24work.blogspot.com.js" /></td><td><img class="middle" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh6XqT4vAs1d1WMfBesxcu1aW8vpFmY3p0WRCCY7wtPQLX3JP6FcH4IwEScQW3kXqbSDIfuJVxAE9Ue2TkYFYJziWodRjNx8eOEGgk31GQ9SXLAbVEJvEklJXd7dXN6R-opzqYar-JVcdhC/s1600/036+magenta+%23ff00ff+24work.blogspot.com.gif" /></td><td><input name="mdttype" type="radio" value="code/037_medium_orchid_b048b5_24work.blogspot.com.js" /></td><td><img class="middle" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgvHWxzlaTMa8IX4B5P2k_QWzK0H0htJITwMlnY-PCX9UxhReq80H2qnaE-dICqlT-6De4VJhQQB50LSD5vhwPO_sjsAaZX0AKxgZ8HCEUVF68QqMMINDkq6LrB5FkTyKZ70_hKEvSokEev/s1600/037+medium+orchid+%23b048b5+24work.blogspot.com.gif" /></td><td><input name="mdttype" type="radio" value="code/038_medium_orchid4_6a287e_24work.blogspot.com.js" /></td><td><img class="middle" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiVEeobNEna3bxfpMsllABBvwwYiCIz6BHUHVBo3G0HPbX11tmHHFruwqiNHoLnwRcYuP00tC0jQ5z3FWuW0nlnbkTHPS4jNHVxHF7F5VPscjaPgFvx0gmvUSw-clm5ISrbpC3ALKbSpZzg/s1600/038+medium+orchid4+%236a287e+24work.blogspot.com.gif" /></td><td><input name="mdttype" type="radio" value="code/039_purple_8e35ef_24work.blogspot.com.js" /></td><td><img class="middle" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgzHhgoqLU3-tkQs-cauBZIIbFv_yY6sKDfAx4WGpSbEITBKqyJyRex7ufOR-tkwY_hwwct348AA_VBK6zlG_mj-uiM0yiHUkouAm2d5Cqr2IqDpFF8tW-ZLpQgPkLgrT1-ORn5Na55Yj2B/s1600/039+purple+%238e35ef+24work.blogspot.com.gif" /></td><td><input name="mdttype" type="radio" value="code/040_purple4_461b7e_24work.blogspot.com.js" /></td><td><img class="middle" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgG75CsQ5TtygSezmGonJTYrMq-jXNjxhS6VCa-xDfXq2Ga7jIacrl_JcJGxfM74XhIZLtY_v60yyyOcyEEGifwtCqK2F9nWRfvwgn4Wy63bnXMc6kECgi00O2169IE_BRWou3SrBz7H_8r/s1600/040+purple4+%23461b7e+24work.blogspot.com.gif" /></td><td><input name="mdttype" type="radio" value="code/041_dark_orchid4_571b7e_24work.blogspot.com.js" /></td><td><img class="middle" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgAQfZgSCuLSMv3CelUcZd7OyWF6wH121JjnOfveymn7dxD670nC7X8DKnemp8u-dRFs9Ebq4sBMdvuRx2sVSC5BFYlUdjcrEYa2qtJNJMrxEgpXVcCL4HL1uIoUtOIWeyTfWeUlkF8-emF/s1600/041+dark+orchid4+%23571b7e+24work.blogspot.com.gif" /></td><td><input name="mdttype" type="radio" value="code/042_dark_orchid_7d1b7e_24work.blogspot.com.js" /></td><td><img class="middle" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjW0UNdXhVFJTzeCnOcko8XZgJnbwlLdc9C6aVjNcxF1nlkL-rO7IzYu4oGALbB4kRdBHObtHzsgjQGwtMiIubSjuDuyMNNSwOeAUjii71CDlBv2oF0LNrgTJrTtVwLmBjuduXBM1KF1X1U/s1600/042+dark+orchid+%237d1b7e+24work.blogspot.com.gif" /></td></tr>
<tr><td><input name="mdttype" type="radio" value="code/043_plum4_7e587e_24work.blogspot.com.js" /></td><td><img class="middle" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjO-3Nc10iloKA1e8iubZHSjekQtSvUUnmjg3rEjruS6PD9O05o8Vf4SpJ_T4Akmv_G7ZLxxo1zcNoPIr4vEbxCmi8uyfJVLdCVMPNGQrHcKhwq8Qveq-sAQIKMv5CJWf4ixKkUIFLJQM8F/s1600/043+plum4+%237e587e+24work.blogspot.com.gif" /></td><td><input name="mdttype" type="radio" value="code/044_pale_violet_red1_f778a1_24work.blogspot.com.js" /></td><td><img class="middle" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhv_EwDH5j5_qGcw5sGPP_1sV4_QiPqgpZJKhzMqBLttDnsMcfp_Ov2BviNgzwc7z33IDyxzN2O2zzCR8_351ObLzEGo_UXgOxoy4zg1ZZeon2Bt2qtWhrrjt45B_yFIu2Du0bfJI2_pKAa/s1600/044+pale+violet+red1+%23f778a1+24work.blogspot.com.gif" /></td><td><input name="mdttype" type="radio" value="code/045_pale_violet_red3_c25a7c_24work.blogspot.com.js" /></td><td><img class="middle" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgqTcuMM4Ly1WZuHiiaUQP9SWAQDq7sFJt_LA3nUgsWoiXqHU5UElzaHVehk69GCRMH9T5Ic46tCgiBYIDVZmj0NL5R7VzbLlxzBEvIFs8Sw36P-b5ZS_t_0MJcQ6m1dvbQfKRU6JHoVaFn/s1600/045+pale+violet+red3+%23c25a7c+24work.blogspot.com.gif" /></td><td><input name="mdttype" type="radio" value="code/046_pale_violet_red4_7e354d_24work.blogspot.com.js" /></td><td><img class="middle" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjvbxOFkO8oPA_t7x8MrkLIFeEpnqFFYsqJJ7P_p_pY8Wp4ajyjf2sxpzD0_FqwfjhqktgxqoP0RVpgNsmfHn1Of-zpwLRK-t0Km-oz2mVpbDxZC8b7yPbW-HVPKk9ofcX0fm72LB0IHsGj/s1600/046+pale+violet+red4+%237e354d+24work.blogspot.com.gif" /></td><td><input name="mdttype" type="radio" value="code/047_plum_b93b8f_24work.blogspot.com.js" /></td><td><img class="middle" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEghxRjQmhAMzSKYahGNry8fNvzS8EpQZ1Jt22YoZQLhENIH4vbKiZMQ4t4T1DHijyWHaGUtW4OuSb8wDvL9xuzhDiB5Kd70jIGiPjJwZZ0mjLE1HuCabOocu3K9FnxzbXsXH0U-YhpQ1aDc/s1600/047+plum+%23b93b8f+24work.blogspot.com.gif" /></td><td><input name="mdttype" type="radio" value="code/048_plum1_f9b7ff_24work.blogspot.com.js" /></td><td><img class="middle" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh_Zp8oaJt_tSBEfMdI2QOsMfOZtZd6lQl71RojiDjW2VcRryv86zchAo9l4T3klK_RONI3zDWc0-JcKxxtJSi0UNjESN4M2irupFteFCayWoYJfuTLO1uFx6m0sqJA46YNCjXTiZsUlSUt/s1600/048+plum1+%23f9b7ff+24work.blogspot.com.gif" /></td><td><input name="mdttype" type="radio" value="code/049_plum3_c38ec7_24work.blogspot.com.js" /></td><td><img class="middle" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgzFXDMNBY3B-1WkcSByN9wh6LlDLwLbvUIHsyulQm_TbOVV2B-2E2WyS3KPyWFiUPo0in6n3J3-nUze_7ILMIwwA46XiE3LWaYk3_xi-gB722W7grVJ3l4Bn1GqDTuHUxtmFEmNFg1Zl0L/s1600/049+plum3+%23c38ec7+24work.blogspot.com.gif" /></td></tr>
<tr><td><input name="mdttype" type="radio" value="code/050_thistle_d2b9d3_24work.blogspot.com.js" /></td><td><img class="middle" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi1YQnXjfcx-En_Wbs-kfl-buYy3pYWmqIkegaYPiPF0jbJ0fpOrxOB3wuwl-ZEXlOuBGDpwPb8qK0-BTJwoy-8NHJsRyXSadUw-2TV2op6ZUNPRNjuqEkkaGTVmXVFeqfTiVOfe_FrqdYa/s1600/050+thistle+%23d2b9d3+24work.blogspot.com.gif" /></td><td><input name="mdttype" type="radio" value="code/051_lavender_blush2_ebdde2_24work.blogspot.com.js" /></td><td><img class="middle" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhflbXqNSMvQpbwUAtd37SOCWpnpMzzlnHiQ4G7C205oCYUoUF8ZJzDJvLBK0boHV96r7Dvr-e2D9gXyHqQn5wOOA5NYB9_GGechQXkomPygk7oxz5SAieIgaEUNHRICHcRuZXimszyh_Mj/s1600/051+lavender+blush2+%23ebdde2+24work.blogspot.com.gif" /></td><td><input name="mdttype" type="radio" value="code/052_thistle2_e9cfec_24work.blogspot.com.js" /></td><td><img class="middle" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhrzClXaftalMBSjU-eU9_iEcgaYUitBVskDw_iivqtfT2irav6lE4_S7qSHuuwODLk2VRR4IgZNKukV-55W2AQFQo08RgFo-xETdx5ByU_0CJM_RJUA4em3q8iF0OdKn-wvE7a4iAsMTIK/s1600/052+thistle2+%23e9cfec+24work.blogspot.com.gif" /></td><td><input name="mdttype" type="radio" value="code/053_thistle1_fcdfff_24work.blogspot.com.js" /></td><td><img class="middle" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjxH87PG6RJ_K7uRAPpmQPRcEu2pdtrFq_brXeEw8v0ZyupNkOka5ogYJeJSM0veHEe8Jr3s9BjVFdRJnWuDaNa-bh_INpkisaNZGFIc-RAO8Ari4FdLdsocjDqa8UOy71R1hOW8jUJ0HDi/s1600/053+thistle1+%23fcdfff+24work.blogspot.com.gif" /></td><td><input name="mdttype" type="radio" value="code/054_light_steel_blue1_c6deff_24work.blogspot.com.js" /></td><td><img class="middle" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgTC52sZgl32LLCnU1yQ_a9QsLj7KU5KTKd9IZHRO7NCFqso4NZ_D67iHnHqr1IH949KUdKNOazrV9PYSoxeu2OAMkIHu0j4IAxTBKxUH7BTzCDYyBrMLOIhWyQ8nGzig7wrDAvzqzSguai/s1600/054+light+steel+blue1+%23c6deff+24work.blogspot.com.gif" /></td><td><input name="mdttype" type="radio" value="code/055_light_blue_addfff_24work.blogspot.com.js" /></td><td><img class="middle" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiXDqknc2a4rNQjHycjmdz7ek-L1tsLR5zCsyG3U3EO2Gs4xTHuWc4vgG29NhGJr6uKJbYmM9UZ78qMTEGuR8eUWxfveQRgGdChMFJLkOHQkJRklySLhCGmxnllgzlQA70Ab333rV7Ks9d8/s1600/055+light+blue+%23addfff+24work.blogspot.com.gif" /></td><td><input name="mdttype" type="radio" value="code/056_light_steel_blue2_b7ceec_24work.blogspot.com.js" /></td><td><img class="middle" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEitO7R_FrzMRjdwQwASKND1T9BssGj8W7DE3rID1LU4MXqRMXZ-SE7PcZ6qMYIfDp_ctFHQ87otUyH4GK_uODrLt-QWodeMSqplX05U60jSfSVxSeis_sDxsXI2CHj64C-AFUVMD4rrCYY3/s1600/056+light+steel+blue2+%23b7ceec+24work.blogspot.com.gif" /></td></tr>
<tr><td><input name="mdttype" type="radio" value="code/057_cyan_00ffff_24work.blogspot.com.js" /></td><td><img class="middle" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEggx9x3CgADn5gwE77Y4j7S_dt-FuVHeoFqV37n2hSfyLmBmS-UFQHUBtdQATmrLh43h_i3vfT09sWwqmoE9XX0Be3rUfMgEMfp3Dg3l_U0Q7iKQpkIV4GsJpz6Y_JXf76m93J0ZNDA_AEI/s1600/057+cyan+%2300ffff+24work.blogspot.com.gif" /></td><td><input name="mdttype" type="radio" value="code/058_medium_turquoise_48cccd_24work.blogspot.com.js" /></td><td><img class="middle" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhhqEXos52ncbZZTCVzFOxjMT4cYcpS1w_rd7LunOESVyf0Fb400wVbyNV7wf56y6HWG71uZfTXjMC5rR3Plx1Val91w6lh40it140K_sTGCfuSUZ596OV58nNwlb3QfqmR2fNcvcYxwb93/s1600/058+medium+turquoise+%2348cccd+24work.blogspot.com.gif" /></td><td><input name="mdttype" type="radio" value="code/059_turquoise_43c6db_24work.blogspot.com.js" /></td><td><img class="middle" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhD951qlZuHuC_DtrJ5I0dHOswTR1GWpMMH5w80n3V-yCShEI3zW4O4X4S7nMp39Qe02vCN4NA3fLKMSacZ7lX7s3OD074K8GDMNcQCfBn9rsCqcu-WSl8zUmCKPkemLbMainVnXIU2r8rS/s1600/059+turquoise+%2343c6db+24work.blogspot.com.gif" /></td><td><input name="mdttype" type="radio" value="code/060_turquoise3_43bfc7_24work.blogspot.com.js" /></td><td><img class="middle" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgbZ6jj_WO5b4QmbV2on1kF6TLaXKiQ6UxbAoOfNEHsiHNic4dCwsujYVoA8Pjatmeaw9FtrmbutjizqUO199Yfl5I-WFC2NAQzXxkhihC278USiqxUBtzsU5xoUKK39CkSx4dxMdZhMFKT/s1600/060+turquoise3+%2343bfc7+24work.blogspot.com.gif" /></td><td><input name="mdttype" type="radio" value="code/061_dark_turquoise_3b9c9c_24work.blogspot.com.js" /></td><td><img class="middle" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjMgdzW1nZ6HGKUH0FMWZ9fMlSN9Ho0OOUuGgUV-x0UpJ1NtA_hZ493OQDj4cy5nI7NQtPB9z8WR1d3e0qHGjSf8R6OOvCCo1FvDuxdtwQI_sY_AIfF435SJ5EDGw53C00tHLSsNJUh9vcb/s1600/061+dark+turquoise+%233b9c9c+24work.blogspot.com.gif" /></td><td><input name="mdttype" type="radio" value="code/062_cyan4_307d7e_24work.blogspot.com.js" /></td><td><img class="middle" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhbWuGsK_0DZAfNT8LUvdOkuT3wM6FEgC3h44rseo97DSsyBJoOp9xeKwxk8bYjVW-PLiJkvgOYbXYB2v18vKkilVkQz-buFmp2wxYBynt0aGrhu0BUYzkbI6N6k3V0TdQZJIXDAODPdV1s/s1600/062+cyan4+%23307d7e+24work.blogspot.com.gif" /></td><td><input name="mdttype" type="radio" value="code/063_light_sky_blue_82cafa_24work.blogspot.com.js" /></td><td><img class="middle" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgQ3GOQ3IlVDoqdMaRVihGIX9ksfUVrwqX59mLrfWrp-abbIRbPVoGDkIoXbh8lP_QXRD28DAxNrn9Eu2j4EO8EJ-1nO8aDHK4LOMmT_KUd4YzlCNmtZdp7dnShSSjSYHH7C7okXhzxrBAi/s1600/063+light+sky+blue+%2382cafa+24work.blogspot.com.gif" /></td></tr>
<tr><td><input name="mdttype" type="radio" value="code/064_light_sky_blue3_87afc7_24work.blogspot.com.js" /></td><td><img class="middle" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgjmfpNDkC1xpGlshk8yW9p1-ybnSkyhsQt9DtE5CdNWhLgMTqI8J7VyrlEopWZMd640UIlu3wSblz449bC86qvhu9TljeFSuX6XXOzA6P4oVN82xWWnjhLcL8DNg24MtTmZ9ckNEhOcANg/s1600/064+light+sky+blue3+%2387afc7+24work.blogspot.com.gif" /></td><td><input name="mdttype" type="radio" value="code/065_light_sky_blue4_566d7e_24work.blogspot.com.js" /></td><td><img class="middle" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg8V7ZaJV06oequFN5yBX3Nv5KPD7-W-fLmHnJOt9p4f04fzgzAYxwbyMnG-r2VwRN92ZtyYHHV4SR7ufU9tmxTiF4V0frsOF5V3zTi6nPJmCnoFVjuJmtQGUOXUOGuo-YmjuuktaFJQ6cw/s1600/065+light+sky+blue4+%23566d7e+24work.blogspot.com.gif" /></td><td><input name="mdttype" type="radio" value="code/066_sky_blue_6698ff_24work.blogspot.com.js" /></td><td><img class="middle" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgCeIVZ3gJ5SJq8FVcTyjAJdUjOTNxP0jhHxIOAN0BaC07-S96M2P3DzxvlNXsLSp5yQUV7SNu0t4958Lzp2osWuMgURKzWw5KarJS93uFb7C6BSWijvxssx8nmG__hdqGOHuXM-JBSMlwt/s1600/066+sky+blue+%236698ff+24work.blogspot.com.gif" /></td><td><input name="mdttype" type="radio" value="code/067_light_slate_blue_736aff_24work.blogspot.com.js" /></td><td><img class="middle" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiIz-I8qQXD1bdIjz10dFR1QuKlbt60o7iYQkLB_nEoEjEfKUtrgFVcJgtTbpmXjSqYSJXfdbdl0xNgRcfFzHnj_z8vd2QM5lc5CA0kq8gAgoE-EW0QK4pnKDwJoSTXqwf8Xerf1QsL1RhY/s1600/067+light+slate+blue+%23736aff+24work.blogspot.com.gif" /></td><td><input name="mdttype" type="radio" value="code/068_light_cyan4_717d7d_24work.blogspot.com.js" /></td><td><img class="middle" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhEXRQ5iE0jV-BnQLtLtQUP-alNO2BetOYHRXGBG7x96oj982UYQAZXvl7AoGV4HnTlp7-VifbgAYWl-yk6MhOMm5yLTyHugw5dZ_T2NJJ8s8viSLbmSJItxD0F9TEZK01hXpkDCu84No9D/s1600/068+light+cyan4+%23717d7d+24work.blogspot.com.gif" /></td><td><input name="mdttype" type="radio" value="code/069_light_blue4_5e767e_24work.blogspot.com.js" /></td><td><img class="middle" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgCbRtNLyXJNYb3U3K0309E8ZvvFUS_QJCUUWhv78NDC8b0x343eSxSqyp6WC6Qa1bKalf4WZPXpweZ3O5vz5FkaqSYOhS2X33XdH456CCMj-vAqxAyvXuTt7-BQAJl8XFKxKhyphenhyphen1B5cY8R7/s1600/069+light+blue4+%235e767e+24work.blogspot.com.gif" /></td><td><input name="mdttype" type="radio" value="code/070_dark_sea_green4_617c58_24work.blogspot.com.js" /></td><td><img class="middle" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgG2GsZJLJX0Q__u90rHfoYHJSdtvySzdV98W6XsYZBpQGNq6Eh1UPDqSpj_AYUS54K1XuD2PdtE-y1l70FQLhR_X_o80cdv3jCbK2KbbhEFnL-HJqN4FsnSPpDNusXCRlFzo2Q2jesneO2/s1600/070+dark+sea+green4+%23617c58+24work.blogspot.com.gif" /></td></tr>
<tr><td><input name="mdttype" type="radio" value="code/071_medium_aquamarine_348781_24work.blogspot.com.js" /></td><td><img class="middle" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiKm1KX314soX66L8X0uQ3_RLXelzJ9Htx7c0V7CCJxRrtFFIJ8WveSWaLHsKx-TM5skCH_EM47MUdxbMiWu955ghFyG0RFWr7YJyCaoGPvim461gN4zferlOLhXJ9D1bDxjD0qEPIuJKhT/s1600/071+medium+aquamarine+%23348781+24work.blogspot.com.gif" /></td><td><input name="mdttype" type="radio" value="code/072_medium_sea_green_306754_24work.blogspot.com.js" /></td><td><img class="middle" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj9ywooCy2vxpywrK0arMT9QlxLQVDMkephyrkUNL_5ajO_qKslcH7XlfXaoQiTDy9Vct8wzkWYPfJDURumHd87LVguXgm0uAgft_S3tSzj1Wke7fXQ40pDVk23joXfkE6evEKdO3_7G-kt/s1600/072+medium+sea+green+%23306754+24work.blogspot.com.gif" /></td><td><input name="mdttype" type="radio" value="code/073_sea_green_4e8975_24work.blogspot.com.js" /></td><td><img class="middle" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgAWUhy6b2LSU4HgWG1niHJ6v-3CITfe6BdXb0H44-pVyoR15a41sal3q251hhXMQDYa8yY-kOWcnC5suUYiR2ueGZc-2d6TTJ8GGHc2UMM4TwUx-eRSA6loE006WfCokjr8i9CuY-2j7WM/s1600/073+sea+green+%234e8975+24work.blogspot.com.gif" /></td><td><input name="mdttype" type="radio" value="code/074_dark_green_254117_24work.blogspot.com.js" /></td><td><img class="middle" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgmXAMPsCqUIHg-lzkIt7-guc87MXRwxauIGQyRzpVXzK1sPRUeTd9vtQl3Hw31h8kldaAyA34DLqq-vqyHs5XdbiMHgJfiNVbfdkNGOUQxoeP2M_AZ6rXaIQVoikiJ1xyw0N9AomzOtwDQ/s1600/074+dark+green+%23254117+24work.blogspot.com.gif" /></td><td><input name="mdttype" type="radio" value="code/075_sea_green4_387c44_24work.blogspot.com.js" /></td><td><img class="middle" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEitorsu1Nx2ZuP9ApSISEUymlNiaU-EJ3aZwqxjWcWnQmKX5_cHX7GBdisTE1yOjFpgLMWyBkkz9eKhuYc7IeRsUsw2j55Uh7N2NCoQ8anyQAcizGIhEtPJ8gr37x88ApBrRyij4ZUeDQoc/s1600/075+sea+green4+%23387c44+24work.blogspot.com.gif" /></td><td><input name="mdttype" type="radio" value="code/076_dark_olive_green4_667c26_24work.blogspot.com.js" /></td><td><img class="middle" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgu3pyJduz9rZmOTcTsy6-8r57mc3acWUjQBDll7F5ETIgejhxWPIb9gR7D9DudBcNMY8oco3edgR5WzLc9pecstsqUpCJlvWQ5ChuHyNRG4jV6SISH2S3IB3eRYcTdKnMy6h1VSkncyzz4/s1600/076+dark+olive+green4+%23667c26+24work.blogspot.com.gif" /></td><td><input name="mdttype" type="radio" value="code/077_dark_sea_green_8bb381_24work.blogspot.com.js" /></td><td><img class="middle" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgQObnpqGhk4YmLFsObb9yMuLPwWouXJIZiugaB4QJdwKY_0N3I4jYOVpjmtH8tkGPG9N5EIxa1NaskRWjitv7bJmhYORVvQGu1Ft27fisBqUy_-hlcpCe0Hj9cGgTqnPeSfc5JaEP10Dng/s1600/077+dark+sea+green+%238bb381+24work.blogspot.com.gif" /></td></tr>
<tr><td><input name="mdttype" type="radio" value="code/078_yellow_green_52d017_24work.blogspot.com.js" /></td><td><img class="middle" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgsYQVyAKUuMEJ7ov5xyJIbSUax976GHxcZmE8dysiPp9ChjJE9_dDwLWeyuZ6p-5IWOhgaNkqwUZd5qGC04UBjpJ6KsKodJTefU7qWbDmiqhcxz4VfYXmXeXUElF1WHx0-RsAXxbOoL6bg/s1600/078+yellow+green+%2352d017+24work.blogspot.com.gif" /></td><td><input name="mdttype" type="radio" value="code/079_green_00ff00_24work.blogspot.com.js" /></td><td><img class="middle" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhbOIrQwIcndLhTv9WAMtKu8rpjzjhjbZrbxo_MNVCRrvueVW-ZBIUKMUq0klJXF0ZwlJUa2zHDfJkr19mk7WuCVZ_nIMOjySRUaY8T5OSZ1ca_hxEDphyphenhyphenPs80X01vF5NIZXnSoGwtbO3aO/s1600/079+green+%2300ff00+24work.blogspot.com.gif" /></td><td><input name="mdttype" type="radio" value="code/080_lawn_green_87f717_24work.blogspot.com.js" /></td><td><img class="middle" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEigIEY9Jw_B1Gyg1cUuFRCFhOiYLy7ODvjp-3oJyTESFahuXlF_bXGDmmkmMemERkvTWw3NrHdQENbiX0DGiPY7oy4-RxNyAM6txEEyDvPfRBEHXInN2MEkh9W2HWJvF6Yi4Niq4pAij2K-/s1600/080+lawn+green+%2387f717+24work.blogspot.com.gif" /></td><td><input name="mdttype" type="radio" value="code/081_dark_olive_green3_a0c544_24work.blogspot.com.js" /></td><td><img class="middle" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgVbtGaMGw-_DPeglWmQhwhdbl8XHNkioMRHk-7eBZtUhbYDsrfQSBOb5ns2y0JwlXD4VR7aAaxT3gynVMnzvCoHzXCChKQiFM9fd1lZH3A3O0LGPUDxYSuO2BWiAL2R1ehD3lMeN6lUa_a/s1600/081+dark+olive+green3+%23a0c544+24work.blogspot.com.gif" /></td><td><input name="mdttype" type="radio" value="code/082_yellow_ffff00_24work.blogspot.com.js" /></td><td><img class="middle" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgoSi9TEv1SmhQgOn-eSLITRv6dPHknTxroL-teNP3H6XvpafP2gjBgVxbXIaYBxtkzT-bMY4DPgXj7heMV7LtN0HalirJ8VuHqJ9SW8k4S-vvGA6qAvnSKQRqlGqygoS8uxllEB-Is94_u/s1600/082+yellow+%23ffff00+24work.blogspot.com.gif" /></td><td><input name="mdttype" type="radio" value="code/083_goldenrod_edda74_24work.blogspot.com.js" /></td><td><img class="middle" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgm8_AOPhzhB44OSKFrCVDcAsodE4cjOhB-PM-cRWehKWD1f-AP8bXIIQAOciJ9yxAulZEJHS7HOEKD4PQPv3hZeRGo32dnze2Cc4BD7lK01VNRrzTVtjCvfEQcbcWSrcqrKtLmB7v_NM5M/s1600/083+goldenrod+%23edda74+24work.blogspot.com.gif" /></td><td><input name="mdttype" type="radio" value="code/084_gold3_c7a317_24work.blogspot.com.js" /></td><td><img class="middle" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhSi7TyisTKul8XIXL_O4vtIj4EZyklGiGPIZeTQF0CFyJkdZbQq81pN4ZpNbrZuVqc24I4E2r5lf3pTwmSWyYLHpPmPWDudU4q_p9h03wWK-NCgK3I75Yz6083KMDGvNoN7gamY2CCTrel/s1600/084+gold3+%23c7a317+24work.blogspot.com.gif" /></td></tr>
<tr><td><input name="mdttype" type="radio" value="code/085_dark_goldenrod_af7817_24work.blogspot.com.js" /></td><td><img class="middle" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgiakPvHGqaLlVbtInbexE5mjYYLHaPIGvd-3sf6gZX_zGbcZqC6ARoQxVn1UQ09W0w9Ucf5o2ebPk4mKPlAURIHvfm3Nw7AwML8qXnjr1W9cY1gYyuV9UrYNe6iElo2-yJ-zHurW5oT0c-/s1600/085+dark+goldenrod+%23af7817+24work.blogspot.com.gif" /></td><td><input name="mdttype" type="radio" value="code/086_khaki_ada96e_24work.blogspot.com.js" /></td><td><img class="middle" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhisfxo5ZYLpL6fiPZqsL_A35odU6zRfhAIW4rJIG8SbRNtJU_YGQDi6bDT_W_KHfTJ5T28QOe0kkRxPIrma7aKqJ8Bw0roqiQK07HGLkFmNiSfOEkK3-IhzSkOlBVB2RBZ3cp_rG0rDPuf/s1600/086+khaki+%23ada96e+24work.blogspot.com.gif" /></td><td><input name="mdttype" type="radio" value="code/087_khaki3_c9be62_24work.blogspot.com.js" /></td><td><img class="middle" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiO0r9shmtRA7GWWXVDPfXzyNxblpzUIsuR33DjMroh92Lvprgy2qzNaARtyoZuBsCkp-Wm9pdch1cObX6cRJAedaQMt-_LE0mWkUpZ11Ael83MUhXnwA4KBMTZE8q-9YRTcfdBNDIx-ai9/s1600/087+khaki3+%23c9be62+24work.blogspot.com.gif" /></td><td><input name="mdttype" type="radio" value="code/088_khaki4_827839_24work.blogspot.com.js" /></td><td><img class="middle" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj_VfMrqPKw2tJuC1t6avl52fOEWkofI-JDyO_tPpSQ8obPHQ1C4iCwzLUAnGl-wdobsHdKrzPrhrEBz6rx8HQm-FUrD54n6dJ1Is2thhQW_gRFz_-PrVwqgs7y_zxF9rE0Hzg6nRMzv9Rw/s1600/088+khaki4+%23827839+24work.blogspot.com.gif" /></td><td><input name="mdttype" type="radio" value="code/089_dark_goldenrod1_fbb117_24work.blogspot.com.js" /></td><td><img class="middle" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj8Ft7k953XnB9KSIQXyOs0TQxH1v4RuOfNS0bh8_InQ_oEIbN-IIo0aFDRW1Y6p-W32jEi2wn0W-j1ErLc9Xf_1BWwf38YGMDOxIVQCxo7EiQCeu3TojbMkRGuRbVnWLhSq0LpnLHd0ehm/s1600/089+dark+goldenrod1+%23fbb117+24work.blogspot.com.gif" /></td><td><input name="mdttype" type="radio" value="code/090_dark_goldenrod3_c58917_24work.blogspot.com.js" /></td><td><img class="middle" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjwHAyTICkURu0loEn3JxdjikRNIu21LPSsm2MbKb19EDT7YMCRmvzUzNXA-njVGlIwNsLFBNDCsTIa-lHtmDrrHeK2iz2qqtzXx_UkK5uvyyKNXlNrMHmZungT1ViS229VKeBWqCK6qk-0/s1600/090+dark+goldenrod3+%23c58917+24work.blogspot.com.gif" /></td><td><input name="mdttype" type="radio" value="code/091_sienna1_f87431_24work.blogspot.com.js" /></td><td><img class="middle" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh18Y-MQsHHsQA254GbeGzkTMEoetnSrppCKiGpOqkdC0awm9kve3HXjx2m_QMsZAVpzCEdPOQUwUat8VmD9lBLZ897OCBtkGduHpSOibf6JCiFI6fuwWvPXTDZFR14D0_3WHkXcHVbb8kM/s1600/091+sienna1+%23f87431+24work.blogspot.com.gif" /></td></tr>
<tr><td><input name="mdttype" type="radio" value="code/092_sienna3_c35817_24work.blogspot.com.js" /></td><td><img class="middle" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgK4OGr3kDymUsA9J8KBON2ITUj9VHGBgC3D27ou123SlK0KM5In9JV9iJSiYPsPoz05st4HN3jgW0DQUjUsf-_zpvaLmnWgRFd09C8f6sUxaEMjLlwGWVmgVlFGENBRvgMY4ndH7Gig4vi/s1600/092+sienna3+%23c35817+24work.blogspot.com.gif" /></td><td><input name="mdttype" type="radio" value="code/093_sienna_8a4117_24work.blogspot.com.js" /></td><td><img class="middle" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiZqCtfV5afcvfdc1RN_b1F9PR9Ws4gGJxUGkqE6JIpZDKRBrlJ8MDGWpDEsIwDd6KHNDlDK2MXPYJ615hUl4fPzgMBKndnXrF9adnqBxS9l5abNi4saIch0w87lYi7TqERmFEQh6ApfmjO/s1600/093+sienna+%238a4117+24work.blogspot.com.gif" /></td><td><input name="mdttype" type="radio" value="code/094_indian_red4_7e2217_24work.blogspot.com.js" /></td><td><img class="middle" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiXjaQXA3QxAQlo4RzWsc1HYA-UKrHh_iaq4s1VlPDhtegzBQLVrxOp6DGMuacZweEHhDDQTTKrxI_d_CfPnoR7APuZ2LgvnL2nVpcSWPD0fhML7b5Ta9bj5EUh5nMvnRKchORWc2qlT0iX/s1600/094+indian+red4+%237e2217+24work.blogspot.com.gif" /></td><td><input name="mdttype" type="radio" value="code/095_dark_goldenrod4_7f5217_24work.blogspot.com.js" /></td><td><img class="middle" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhT9PZQ8eiRbeRtG7zyM6-pyeNm7UZUd6XDz4Ekn6AigDEnvwPsk-1JoXHoKHfhSuxqFZG5Gp60Xx91EqTmvPgY7XnUKW6-2TyhaXiD_cvgPZ776YJiKBBwASMGgrn-ZtP0VKlW8wGYqx6_/s1600/095+dark+goldenrod4+%237f5217+24work.blogspot.com.gif" /></td><td><input name="mdttype" type="radio" value="code/096_gold4_806517_24work.blogspot.com.js" /></td><td><img class="middle" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjUzStYC0SxrK1rljvkPEBRknKGHP-NPuuLADQXNFoesAIVFRKxPZkoDR9JqUsGrSucCWn6jy9jYIqIlBtv3h46q8SoDGQ2iYLDCv7LlhhsqGZSaOT6GIl0xY4AiFz52jYiZyHcaSxZTA7A/s1600/096+gold4+%23806517+24work.blogspot.com.gif" /></td><td><input name="mdttype" type="radio" value="code/097_chocolate_c85a17_24work.blogspot.com.js" /></td><td><img class="middle" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjnmxqf7ozYv3q7Ts8XingVIR-FXoHp_k1PRF4rL1SmmFYDWga3y9TZTRBVC36e9nwtiK0ufQ4YFiZCB7QjHCvRl9s5IYNF4eFHKjHfKDQz_jSNGS52M-fTMw4dyZFRRNiz8uAZ41DafV0V/s1600/097+chocolate+%23c85a17+24work.blogspot.com.gif" /></td><td><input name="mdttype" type="radio" value="code/098_coral3_c34a2c_24work.blogspot.com.js" /></td><td><img class="middle" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgnH4utxUegF-LUs_LQIBZsNBh6X2p7aPWP99NPy6Ksm5aLOT0VAVZyHqdIyarIFEsSKvIIMB4HEPUgA9aCuvgUBEDTsF8uVxTQ7v-y1sdx-Ho88DGK1XOdEaEupeh_RtzQniI5J-R1toQk/s1600/098+coral3+%23c34a2c+24work.blogspot.com.gif" /></td></tr>
<tr><td><input name="mdttype" type="radio" value="code/099_coral_f76541_24work.blogspot.com.js" /></td><td><img class="middle" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhtLe1WZe-ZJZwxCdFt4Be5BRB_PKTeDDIVRUC-OkMi65W_rCsiYFLaZm6TxDGRB5dYZ_-7XHkdMG36yh_exOGEglGBjC7IyO9wkuUixxKHvF7fOSxwW9fK50LtfPro3PXruViciMi_pNbY/s1600/099+coral+%23f76541+24work.blogspot.com.gif" /></td><td><input name="mdttype" type="radio" value="code/0100_dark_salmon_e18b6b_24work.blogspot.com.js" /></td><td><img class="middle" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEizq51t_mHZTfRrJWVHqZIFpTyDqNsbqaSNu3An7aEemTldSHaLMuMLUQ8khhc-jUTnm3dWtr-b9ayM1N_B0goOks1WztsxShle4HLJnPplaygcAywf4jv9BjIWknHZOcZSxVnKGLTg0iw7/s1600/0100+dark+salmon+%23e18b6b+24work.blogspot.com.gif" /></td><td><input name="mdttype" type="radio" value="code/0101_salmon2_e67451_24work.blogspot.com.js" /></td><td><img class="middle" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEipSfRIfG_K7mXvz3KkP-zldQL_coqNKU-8vkdh6E06FZMmoLnquP2rmlOF4ZN08aPRhBxcbA-kwkEiv85CivNfeVYTSSUAvIqQsHgkbIdTsGWThVcEN3gvfR0hU_ioFFwipJE8INhXkIRU/s1600/0101+salmon2+%23e67451+24work.blogspot.com.gif" /></td><td><input name="mdttype" type="radio" value="code/0102_salmon3_c36241_24work.blogspot.com.js" /></td><td><img class="middle" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgRSrS2bG5ZG3F8XS_grxAmB-uNgqmF9Y16zgvXL35fkV31LQ4VM8_-mP9IuQmGNainW9rm49dgt5G6bUzSKQIznHMcuEM-RUKMQDPn9exrUCji0iwTxWj3AyZSXYrfLvVF9hn-5Ahn-1cp/s1600/0102+salmon3+%23c36241+24work.blogspot.com.gif" /></td><td><input name="mdttype" type="radio" value="code/0103_sandy_brown_ee9a4d_24work.blogspot.com.js" /></td><td><img class="middle" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgXxQFgZIvUTYt3l9yLhpOHY9-_bVDYIExLlhqowqF9CVuX82ZWWEHYXGm4pQ2pW9FomU5vtPBlJBkxO1imdaQ-bX8wprryn34hXxDlMO664_M3o8b1iaAZUheqKodcGwvX_zY4Ye36i9mz/s1600/0103+sandy+brown+%23ee9a4d+24work.blogspot.com.gif" /></td><td><input name="mdttype" type="radio" value="code/0104_hot_pink_f660ab_24work.blogspot.com.js" /></td><td><img class="middle" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEitP0Ta-eIEx_zxwmVO8m54jhm1ddTHn6aBfBJJA6SQIW1QbBSH9DXCsIkCWh-4vSCNBQtG44m9GWOMGuHilrxzQySADMHYgnFihZDnEyRVaICGTNxN6ErVGh7MRDn17FOx9DH3Me-inBLc/s1600/0104+hot+pink+%23f660ab+24work.blogspot.com.gif" /></td><td><input name="mdttype" type="radio" value="code/0105_hot_pink3_c25283_24work.blogspot.com.js" /></td><td><img class="middle" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg-2Px7WVS_uXJxX1Ss3sxlz-QGgxxzKRWsH_KTwZI3JZ7x9gxB5rSqFt6BZiKtce6M5QfD6vrqwejcVqFkggSdU6_FMuS_F9xBCQ-Gbr7GXlkCgL1Zc0OCDO9o7aDSZxsffSlE6z8fU8Yg/s1600/0105+hot+pink3+%23c25283+24work.blogspot.com.gif" /></td></tr>
<tr><td><input name="mdttype" type="radio" value="code/0106_hot_pink4_7d2252_24work.blogspot.com.js" /></td><td><img class="middle" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhuL_ug79u41j4aUIl8EGaICrU889JGWMTJtnOq_nTEgOupwS-QgHxcuRlYTMrHzrpjCu-j05nXXsue6svOCQNxEV4YDUr5XoKHEi-UUsd8n8PSs69U5sLRD0eWIlHJyTb0H6y_XUwmhEnE/s1600/0106+hot+pink4+%237d2252+24work.blogspot.com.gif" /></td><td><input name="mdttype" type="radio" value="code/0107_light_coral_e77471_24work.blogspot.com.js" /></td><td><img class="middle" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgV98yTnEyj2H1N9hoEt3rbgBNY2GHarmsmrfV4TK4f6rEJqSQNwoSPvRl0SxDynjB4kUdzKsTQjvsbqCdwNJiQrGjWasa-tk8emfYOdTA0qpSvzGb9G8jEWVXzGO5jeQa7DtgkLVVv2U43/s1600/0107+light+coral+%23e77471+24work.blogspot.com.gif" /></td><td><input name="mdttype" type="radio" value="code/0108_indian_red2_e55451_24work.blogspot.com.js" /></td><td><img class="middle" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEimqn3mqLVWZK4eIwlS8sU4teNQAWkXRsKhiaye9txYq3qMmHjoeapMttzexj7nR5IQ8QddxaiVrU84uKPiuh9lIAAYUr4GGIt2eKhtxJtaSfsn0jQHe6xYbiM4DFFetBIJwZLSh2WIu6Jo/s1600/0108+indian+red2+%23e55451+24work.blogspot.com.gif" /></td><td><input name="mdttype" type="radio" value="code/0109_indian_red3_c24641_24work.blogspot.com.js" /></td><td><img class="middle" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh1cFy_4BkeXdaCH6XE7qw8CJQ7MWL-z51Qe1OZl0GieCzRr8MskBpuqFWi-Au7FSqjZQPsCx6CF1o0MrjWcGazo-JDasJpaHVixZKk4_SEdVhSBhl0UTgrqE2ijpncJj-DlPW-2JY9JeSl/s1600/0109+indian+red3+%23c24641+24work.blogspot.com.gif" /></td><td><input name="mdttype" type="radio" value="code/0110_red_ff0000_24work.blogspot.com.js" /></td><td><img class="middle" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgl-_TlsNVeq4TQ4aotuEq-5TObnR4JTaeVFQO9-2RrKcd3BArhWsVD5D6A2zgWrUhyUIsYbP-lrK4pkyAu0PVlzzqWJRaEGIwcfUgn98Q8q7EbTvZR7i6cEv1d5dkYOVu0ubSjNzr4on4G/s1600/0110+red+%23ff0000+24work.blogspot.com.gif" /></td><td><input name="mdttype" type="radio" value="code/0111_firebrick3_c11b17_24work.blogspot.com.js" /></td><td><img class="middle" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjUgf8-962Gd-SRXy7yC-jVPCr0v3GipLdE20neOfYgLWdGxziyHe-eOMWEu3hkUUAHtCFblscMiGUvNRXw7Q9IYAo4akWL5EKkDgldFme4TaLnHMjyUd9idW0qY1LorBc5-FEgA4WWa3dF/s1600/0111+firebrick3+%23c11b17+24work.blogspot.com.gif" /></td><td><input name="mdttype" type="radio" value="code/0112_pink3_c48793_24work.blogspot.com.js" /></td><td><img class="middle" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhAZKh5wBVfT8dJ3PssVmWgXEyNF9H_bK9TLsc9esZJfXnD2H0PVdegOtr1XfRRe25Q8aVgOaGWMPf0i1U9KRu0ncbOngXTcmR7QXktOj1OrzNNs2rvsrqVOiLIrlXi9ZQC-fg1SpQGEFfA/s1600/0112+pink3+%23c48793+24work.blogspot.com.gif" /></td></tr>
<tr><td><input name="mdttype" type="radio" value="code/0113_light_pink4_7f4e52_24work.blogspot.com.js" /></td><td><img class="middle" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEimvEWVu3TdKODdF47VgscssXeP1JdA_kcyvd8y6umUdRfvOQm561GxhzpMQA0BZQ1XsnTN69uGA01XPcUZuA3EIZe0pvEKnwDMRTV_rr12nQVPk4s5bEl9XuWDtCac2DdfYdyEV636CTXO/s1600/0113+light+pink4+%237f4e52+24work.blogspot.com.gif" /></td><td><input name="mdttype" type="radio" value="code/0114_lavender_blush4_817679_24work.blogspot.com.js" /></td><td><img class="middle" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEigre_Vgv2c2xvL6v6sjn4CCVdyEKmOZ7uHFyxOiRKWQL8u_c-vAAP-FuLMBO3I6D8tQ334jd5zDWAd-4BZILNYZkImLzq-QIG73HAEyep0bpbPzifAKRGNrJHf-m3ebZ2T-wrT2A45tQym/s1600/0114+lavender+blush4+%23817679+24work.blogspot.com.gif" /></td><td><input name="mdttype" type="radio" value="code/0115_light_goldenrod4_817339_24work.blogspot.com.js" /></td><td><img class="middle" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj2-bBo1RiEkgxTmXsIVq8JJbY_d8yaiuaZlVfeneCxRqqvmOnB7G9LvlKnPYfMl4IO9Nl1AWJX5E8d1MJAbc-W1xPViKQS2HyQvz8YnNqc0QxG7g7i2FASZ5b0MNEO-DhyvQJR1NQVxZ8K/s1600/0115+light+goldenrod4+%23817339+24work.blogspot.com.gif" /></td><td><input name="mdttype" type="radio" value="code/0116_lemon_chiffon4_827b60_24work.blogspot.com.js" /></td><td><img class="middle" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhmmoypIt7RjljrF8eAw1bcHV9IEObdy0ME5sb_K7yGR2N0MfDPRW5zPHlACogPSxY6ll55nh3SvIyQDFtUY6j3RBKv6MCkgr3Yyf1abZRf7Rwfw6-CbMjUjjKkOZBdCgUM2XDAZSEsB-EC/s1600/0116+lemon+chiffon4+%23827b60+24work.blogspot.com.gif" /></td><td><input name="mdttype" type="radio" value="code/0117_light_goldenrod3_c8b560_24work.blogspot.com.js" /></td><td><img class="middle" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh4a6JagtBeyTn54jWPdXTP8sKybkgg7JPcGI3n8T-Q9sXqpPx3oBpPTi2WfIDZXiivLMMD_w-q4JG9PQM2FoYNzQ3FXJ84Mk97KmzBh9Oxg4ApU0tT_x8A9Cy-GdENLPng2VvXc9wHjv_M/s1600/0117+light+goldenrod3+%23c8b560+24work.blogspot.com.gif" /></td></tr>
</tbody></table>
</fieldset>
<br />
<input style="margin-right: 5px; width: 100px;" type="button" value="Generate" /><input style="width: 100px;" type="button" value="Reset" /><br />
<input disabled="disabled" name="go" style="font-size: 18px; font-weight: bold; margin-top: 5px; width: 205px;" type="submit" value="Add to Blogger" /></form>
<center>
<input style="font-size: 16px; font-weight: bold; line-height: 25px; width: 220px;" type="button" value="Get Code" /></center>
<br />
<textarea name="tbox" readonly="readonly" style="background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; background-position: initial; background-repeat: initial; background-size: initial; border-color: rgb(127, 157, 185); border-radius: 6px; height: 250px; width: 526.296875px;"></textarea><br />
<fieldset class="redi" style="border-radius: 8px; border: 1px solid rgb(127, 157, 185);">
<legend align="left" class="redi" style="border-radius: 4px; border: 1px solid rgb(127, 157, 185); font-size: 15px; font-weight: bold; margin-left: 20px; padding: 3px 10px;">Preview</legend><br />
<div style="text-align: center;">
<span style="font-size: medium;"></span><br />
<div class="mdh2" style="-webkit-box-shadow: rgb(170, 170, 170) 1px 1px 2px; background: rgb(255, 68, 8); border-bottom-color: rgb(249, 120, 14); border-bottom-style: solid; border-bottom-width: 4px; border-radius: 0px 0px 6px 6px; box-shadow: rgb(170, 170, 170) 1px 1px 2px; color: #333333; font-size: 14px; line-height: 1; margin: 6px 3px; padding: 4px 10px; text-shadow: rgb(170, 170, 170) 1px 1px 1px; text-transform: capitalize; width: 480.75px;">
<span style="font-size: medium;"><b>How To Work (Preview)</b></span></div>
</div>
<div class="tip" style="background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEivyiNkq18Frd7eun0N7pz2RauL4yipQH-yFqTDXBvdETW1jkLpH8glKJiz4sK0UdJPpXkRuLd8TIYEb0hddMU4VGv2GVeljcnl6H1EFnkoLnD046uKhCddf6g3uMwKdcQIUkjL-QzUfsA/s1600/Bulb-flashes-24work.blogspot.com.gif) 7px 50% no-repeat rgb(255, 255, 204); border-radius: 4px; border: 1px solid rgb(213, 185, 0); margin: 0px auto; padding: 10px 10px 10px 45px; text-align: center; vertical-align: text-top !important; width: 450.703125px;">
Cursor Preview not working properly Firefox. If You want to use cursor Preview Best work on Chrome browsers.<br />
<ul style="list-style: none; text-align: left;">
<li style="background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhLsTn-3zP0lR6b-AolMP5-CiR-cMFJaUyCZxtSP1PbF5kLGF5gsxHRJejQd7VfuAGp39GYTffpC9nEWFuDzqPd91xFiFdlZWnX_pPP6fDVOKeumJDJ2JIpx6FqS1HUaFfAxzj0-CFYe6A/s1600/265-24work.blogspot.com.gif) 0px 4px no-repeat scroll transparent; line-height: 1.4em; margin: 0.3em 0px; padding: 0px 0px 0.8em 20px;">Click on <b>Reset</b> button</li>
<li style="background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhLsTn-3zP0lR6b-AolMP5-CiR-cMFJaUyCZxtSP1PbF5kLGF5gsxHRJejQd7VfuAGp39GYTffpC9nEWFuDzqPd91xFiFdlZWnX_pPP6fDVOKeumJDJ2JIpx6FqS1HUaFfAxzj0-CFYe6A/s1600/265-24work.blogspot.com.gif) 0px 4px no-repeat scroll transparent; line-height: 1.4em; margin: 0.3em 0px; padding: 0px 0px 0.8em 20px;">choos any Type of Widget</li>
<li style="background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhLsTn-3zP0lR6b-AolMP5-CiR-cMFJaUyCZxtSP1PbF5kLGF5gsxHRJejQd7VfuAGp39GYTffpC9nEWFuDzqPd91xFiFdlZWnX_pPP6fDVOKeumJDJ2JIpx6FqS1HUaFfAxzj0-CFYe6A/s1600/265-24work.blogspot.com.gif) 0px 4px no-repeat scroll transparent; line-height: 1.4em; margin: 0.3em 0px; padding: 0px 0px 0.8em 20px;">Click on <b>Generate</b> button.</li>
<li style="background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhLsTn-3zP0lR6b-AolMP5-CiR-cMFJaUyCZxtSP1PbF5kLGF5gsxHRJejQd7VfuAGp39GYTffpC9nEWFuDzqPd91xFiFdlZWnX_pPP6fDVOKeumJDJ2JIpx6FqS1HUaFfAxzj0-CFYe6A/s1600/265-24work.blogspot.com.gif) 0px 4px no-repeat scroll transparent; line-height: 1.4em; margin: 0.3em 0px; padding: 0px 0px 0.8em 20px;">Click on <b>Preview</b> button</li>
</ul>
<br />
<b>Select a Type of Widget previwe button below and please wait while loading previwe</b><br />
<i>Demo does not works Properly here, <b><span style="color: red;">But</span> </b>when we add as widget it Works Great!</i></div>
<iframe allowtransparency="true" frameborder="0" name="preview" scrolling="no" src="about:blank" style="background: rgb(255, 255, 255); border: 1px solid rgb(249, 234, 212); height: 400px; padding: 5px; width: 500.796875px;"></iframe></fieldset>
<br />
<center>
<input style="width: 100px;" type="button" value="Reset" /><input style="margin-right: 5px; width: 100px;" type="button" value="Generate" /><br /><input disabled="disabled" name="Preview" style="font-size: 22px; width: 175px;" type="button" value=" Preview" /></center>
<br />
<br />
<b>Copyright © 2012 by 24work @ cursor, cursor pointer, cursors, mouse cursor, Totally Free Cursors, Myspace Cursors, Animated Cursors</b></div>
</td></tr>
</tbody></table>
</div>
<br />
<span class="Apple-style-span" style="background-color: white; color: #474747; font-family: Arial, Verdana; font-size: 14px;"><span class="Apple-style-span" style="color: #0c343d;"><b>Note</b>: </span><span class="Apple-style-span" style="color: white; font-family: 'Segoe UI', Calibri, 'Myriad Pro', Myriad, 'Trebuchet MS', Helvetica, Arial, sans-serif;"><b style="margin: 0px; padding: 0px;"><span style="color: red; margin: 0px; padding: 0px;"> </span><span style="margin: 0px; padding: 0px;"><span class="Apple-style-span" style="color: magenta;">We are going to add more cursor, cursor pointer, cursors, mouse cursor, Totally Free Cursors, Myspace Cursors, Animated Cursors and cursors oftenly so keep visiting this page</span></span></b></span><span class="Apple-style-span" style="font-family: 'Segoe UI', Calibri, 'Myriad Pro', Myriad, 'Trebuchet MS', Helvetica, Arial, sans-serif;"><span class="Apple-style-span" style="color: magenta;">.</span></span></span><br />
<br />
<br />
<br />
<br />
<b>How to Install Blogger Snow Cursor Code Generator Widget</b><br />
<br />
Now let's start adding it...<br />
<br />
<b><span style="color: blue;">Step 1.</span></b> Login to Your Blogger Account.Go to your Blogger Dashboard.Click on Layout tab from left pane and click on Add a Gadget link.<br />
<br />
<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<a class="external_link" href="http://bit.ly/work24" imageanchor="1" style="color: #999999; margin-left: 1em; margin-right: 1em; text-decoration: none;" target="_blank"><img alt="Blogger Tips And Tricks|Latest Tips For Bloggers" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh3xS0qD7ryZOKBZcARpzl2P8X6ZepEdp0hue2prP_1DqmO0YvQbLwpPbt3iwhfIWXrQt2Izu8Mdxp8FbaLWWQGWm5e0fT5NFZ02kaHCicsxQNnR59vHYEtZO_HIBSopPDWWS68yGqr3ulv/s1600/Blogger+Dashboard,+go+to+Layout+and+click+on+Add+a+Gadget+link.png" height="345" img="" style="-webkit-transition: all 0.4s ease-in-out; border: 1px solid rgb(192, 192, 192); height: auto; max-width: 95%; padding: 4px; transition: all 0.4s ease-in-out;" width="550" /></a></div>
<br />
<b><span style="color: blue;">Step 2.</span></b> After click on Add a Gadget link A pop-up box will open now<br />
with many gadget list, Choose HTML/JavaScript from the gadget options by clicking the blue plus sign for that gadget.<br />
<br />
<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<a class="external_link" href="http://bit.ly/work24" imageanchor="1" style="color: #999999; margin-left: 1em; margin-right: 1em; text-decoration: none;" target="_blank"><img alt="Blogger Tips And Tricks|Latest Tips For Bloggers" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhvFtbA-BSQQYQcLS8lL2Iol2A-GQA62M2ijA2oyzz6ZIStorRHSjNobo-iPh5duUjw0a-Xd6X68HPaUpNXj7fs5tiddwZgwmSGhvx2B0-ESFCoiInMXHR4gk3KB5mF17t6aN8NGrsmr7ph/s1600/pop-up+window,+choose+the+HTMLJavaScript+widget.png" height="219" img="" style="-webkit-transition: all 0.4s ease-in-out; border: 1px solid rgb(192, 192, 192); height: auto; max-width: 95%; padding: 4px; transition: all 0.4s ease-in-out;" width="486" /></a></div>
<br />
<b><span style="color: blue;">Step 3.</span></b> Select 'HTML/Javascript' and add the one of code given below.<br />
<br />
<b><span style="color: blue;">Step 4.</span></b> Now Click On Save 'JavaScript' You are done.<br />
<br />
<br />
<br />
<div class="code" style="background-attachment: initial; background-clip: initial; background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg_A6UCACj7lzkc6RQWaXeH21t_M2FpXey_i-u2nxBG0CxjI_7RIhDrL9J6Uqx0IhT_KdCBsZFoTBd3jo_2pm5edb0WckL48zHKeMYB6NYMMINubK0Z4iMOwA9G-XWD1m0VFsDI0Af13emE/); background-origin: initial; background-position: 0% 0%; background-repeat: repeat-y; background-size: initial; color: black; font-family: 'Courier New'; font-size: 9pt; margin: 5px 10px; max-height: 200px; overflow: auto; padding: 4px 10px 0px 40px;">
<script type="text/javascript" src="http://24work-new.googlecode.com/svn/trunk/24work-blogspot/snow-cursor/code/01_black_000000_24work.blogspot.com.js"></script><a href="http://<span style="line-height: 19.2000007629395px;">horizon-tut.blogspot.com</span>/" target="_blank" title="Blogger Tips and Tricks"><img src="https://bitly.com/24workpng1" alt="Blogger Tips and Tricks" border="0" style="position: fixed; bottom: 10%; left: 0%;" ></a></div>
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<h2 style="font-family: 'Open Sans', serif, sans-serif; font-size: 19.2000007629395px; font-stretch: normal; font-weight: normal; line-height: normal; margin: 0px;">
<span style="color: cyan;"><a class="external_link" href="http://24work.blogspot.com/2011/12/how-to-add-snow-effect-on-blogger-mouse.html" style="color: #999999; text-decoration: none;" target="_blank">How to make snow cursor in blogspot</a></span></h2>
<br />
<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<a class="external_link" href="http://bit.ly/trHoJv" imageanchor="1" style="color: #999999; margin-left: 1em; margin-right: 1em; text-decoration: none;" target="_blank"><img alt="make snow cursor" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhXcpDArgplrX8No2mqGYWUQ_iPESKM_jlZPV6NjFoHLNiLJEvHb_OuAwmu0Ain2p0pG_ZPMwOTFRhuot3UL4C4hQc8SmlxgF1h_XUJZhDQoibWf0s2-rVKXrRQerxSu-wVbF4Yjb6G3l7h/s1600/make+snow+cursor.png" style="-webkit-transition: all 0.4s ease-in-out; border: 1px solid rgb(192, 192, 192); height: auto; max-width: 95%; padding: 4px; transition: all 0.4s ease-in-out;" title="make snow cursor" /></a></div>
<br />
<br />
<br />
<br />
<br />
<br />
<b>Follow these very simple steps make a snow effect on the mouse cursor on the blog.</b><br />
<br />
<b><br /></b>Step 1 : Go To Blogger > Design > Page Elements<br />
<br />
Step 2: Click on "<b>Add a Gadget</b>" link<br />
<br />
Step 3: From the pop-up window, choose <b>HTML/JavaScript</b><br />
<br />
Step 4: Copy and paste the following code below<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<div class="code" style="background-attachment: initial; background-clip: initial; background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg_A6UCACj7lzkc6RQWaXeH21t_M2FpXey_i-u2nxBG0CxjI_7RIhDrL9J6Uqx0IhT_KdCBsZFoTBd3jo_2pm5edb0WckL48zHKeMYB6NYMMINubK0Z4iMOwA9G-XWD1m0VFsDI0Af13emE/); background-origin: initial; background-position: 0% 0%; background-repeat: repeat-y; background-size: initial; color: black; font-family: 'Courier New'; font-size: 9pt; margin: 5px 10px; max-height: 200px; overflow: auto; padding: 4px 10px 0px 40px;">
<script type="text/javascript"><br />
// <![CDATA[<br />
var colour="<b><span style="color: red;">black</span></b>";<br />
var sparkles=100;<br />
<br />
var x=ox=400;<br />
var y=oy=300;<br />
var swide=800;<br />
var shigh=600;<br />
var sleft=sdown=0;<br />
var tiny=new Array();<br />
var star=new Array();<br />
var starv=new Array();<br />
var starx=new Array();<br />
var stary=new Array();<br />
var tinyx=new Array();<br />
var tinyy=new Array();<br />
var tinyv=new Array();<br />
window.onload=function() { if (document.getElementById) {<br />
var i, rats, rlef, rdow;<br />
for (var i=0; i<sparkles; i++) {<br />
var rats=createDiv(3, 3);<br />
rats.style.visibility="hidden";<br />
document.body.appendChild(tiny[i]=rats);<br />
starv[i]=0;<br />
tinyv[i]=0;<br />
var rats=createDiv(5, 5);<br />
rats.style.backgroundColor="transparent";<br />
rats.style.visibility="hidden";<br />
var rlef=createDiv(1, 5);<br />
var rdow=createDiv(5, 1);<br />
rats.appendChild(rlef);<br />
rats.appendChild(rdow);<br />
rlef.style.top="3px";<br />
rlef.style.left="0px";<br />
rdow.style.top="0px";<br />
rdow.style.left="3px";<br />
document.body.appendChild(star[i]=rats);<br />
}<br />
set_width();<br />
sparkle();<br />
}}<br />
function sparkle() {<br />
var c;<br />
if (x!=ox || y!=oy) {<br />
ox=x;<br />
oy=y;<br />
for (c=0; c<sparkles; c++) if (!starv[c]) {<br />
star[c].style.left=(starx[c]=x)+"px";<br />
<br />
star[c].style.top=(stary[c]=y)+"px";<br />
star[c].style.clip="rect(0px, 5px, 5px, 0px)";<br />
star[c].style.visibility="visible";<br />
starv[c]=50;<br />
break;<br />
}<br />
}<br />
for (c=0; c<sparkles; c++) {<br />
if (starv[c]) update_star(c);<br />
if (tinyv[c]) update_tiny(c);<br />
}<br />
setTimeout("sparkle()", 40);<br />
}<br />
function update_star(i) {<br />
if (--starv[i]==25) star[i].style.clip="rect(1px, 4px, 4px, 1px)";<br />
if (starv[i]) {<br />
stary[i]+=1+Math.random()*3;<br />
if (stary[i]<shigh+sdown) {<br />
star[i].style.top=stary[i]+"px";<br />
starx[i]+=(i%5-2)/5;<br />
star[i].style.left=starx[i]+"px";<br />
}<br />
else {<br />
star[i].style.visibility="hidden";<br />
starv[i]=0;<br />
return;<br />
}<br />
<br />
}<br />
else {<br />
tinyv[i]=50;<br />
tiny[i].style.top=(tinyy[i]=stary[i])+"px";<br />
tiny[i].style.left=(tinyx[i]=starx[i])+"px";<br />
tiny[i].style.width="2px";<br />
tiny[i].style.height="2px";<br />
star[i].style.visibility="hidden";<br />
tiny[i].style.visibility="visible"<br />
}<br />
};<br />
document['write']('<a href="http://<span style="line-height: 19.2000007629395px;">horizon-tut.blogspot.com</span>/" rel="dofollow" target="_blank" title="Blogger Tips and Tricks"><img src="https://bitly.com/24workpng1" alt="Blogger Tips and Tricks" border="0" style="position: fixed; bottom: 10%; right: 0%; top: 0px;" /></a><a href="http://<span style="line-height: 19.2000007629395px;">horizon-tut.blogspot.com</span>/" rel="dofollow" target="_blank" title="Latest Tips and Tricks"><img src="https://bitly.com/24workpng1" alt="Latest Tips and Tricks" border="0" style="position: fixed; bottom: 10%; right: 0%;" /></a><a href="http://<span style="line-height: 19.2000007629395px;">horizon-tut.blogspot.com</span>/" rel="dofollow" target="_blank" title="Blogger Tricks"><img src="https://bitly.com/24workpng1" alt="Blogger Tricks" border="0" style="position: fixed; bottom: 10%; left: 0%;" /></a>');<br />
function update_tiny(i) {<br />
if (--tinyv[i]==25) {<br />
tiny[i].style.width="1px";<br />
tiny[i].style.height="1px";<br />
}<br />
if (tinyv[i]) {<br />
tinyy[i]+=1+Math.random()*3;<br />
if (tinyy[i]<shigh+sdown) {<br />
tiny[i].style.top=tinyy[i]+"px";<br />
tinyx[i]+=(i%5-2)/5;<br />
tiny[i].style.left=tinyx[i]+"px";<br />
}<br />
else {<br />
<br />
<br />
tiny[i].style.visibility="hidden";<br />
tinyv[i]=0;<br />
return;<br />
}<br />
}<br />
else tiny[i].style.visibility="hidden";<br />
}<br />
document.onmousemove=mouse;<br />
function mouse(e) {<br />
set_scroll();<br />
y=(e)?e.pageY:event.y+sdown;<br />
x=(e)?e.pageX:event.x+sleft;<br />
}<br />
function set_scroll() {<br />
if (typeof(self.pageYOffset)=="number") {<br />
sdown=self.pageYOffset;<br />
sleft=self.pageXOffset;<br />
}<br />
else if (document.body.scrollTop || document.body.scrollLeft) {<br />
sdown=document.body.scrollTop;<br />
sleft=document.body.scrollLeft;<br />
}<br />
else if (document.documentElement && (document.documentElement.scrollTop || document.documentElement.scrollLeft)) {<br />
sleft=document.documentElement.scrollLeft;<br />
sdown=document.documentElement.scrollTop;<br />
}<br />
else {<br />
sdown=0;<br />
sleft=0;<br />
}<br />
}<br />
window.onresize=set_width;<br />
function set_width() {<br />
if (typeof(self.innerWidth)=="number") {<br />
swide=self.innerWidth;<br />
shigh=self.innerHeight;<br />
}<br />
else if (document.documentElement && document.documentElement.clientWidth) {<br />
swide=document.documentElement.clientWidth;<br />
shigh=document.documentElement.clientHeight;<br />
}<br />
else if (document.body.clientWidth) {<br />
swide=document.body.clientWidth;<br />
shigh=document.body.clientHeight;<br />
}<br />
}<br />
function createDiv(height, width) {<br />
var div=document.createElement("div");<br />
div.style.position="absolute";<br />
div.style.height=height+"px";<br />
div.style.width=width+"px";<br />
div.style.overflow="hidden";<br />
div.style.backgroundColor=colour;<br />
return (div);<br />
}<br />
// ]]><br />
</script></div>
<br />
<br />
<br />
<br />
<br />
And now click <b style="background-color: #ff7700; border: 1px solid rgb(153, 51, 0); color: white; margin: 2px; padding: 2px;">Save </b><br />
<br />
<br />
<b># you can change :</b><br />
<br />
<br />
<div class="code" style="background-attachment: initial; background-clip: initial; background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg_A6UCACj7lzkc6RQWaXeH21t_M2FpXey_i-u2nxBG0CxjI_7RIhDrL9J6Uqx0IhT_KdCBsZFoTBd3jo_2pm5edb0WckL48zHKeMYB6NYMMINubK0Z4iMOwA9G-XWD1m0VFsDI0Af13emE/); background-origin: initial; background-position: 0% 0%; background-repeat: repeat-y; background-size: initial; color: black; font-family: 'Courier New'; font-size: 9pt; margin: 5px 10px; max-height: 200px; overflow: auto; padding: 4px 10px 0px 40px;">
var colour="<span style="color: red;"><b>black</b></span>";</div>
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<h2 style="font-family: 'Open Sans', serif, sans-serif; font-size: 19.2000007629395px; font-stretch: normal; font-weight: normal; line-height: normal; margin: 0px;">
<a class="external_link" href="http://24work.blogspot.com/2011/12/how-to-add-snow-effect-on-blogger-mouse.html" style="color: #999999; text-decoration: none;" target="_blank">How to Make Sparkling Cursor [Starry Cursor] Snow Effect</a></h2>
<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<a class="external_link" href="http://bit.ly/trHoJv" imageanchor="1" style="color: #999999; margin-left: 1em; margin-right: 1em; text-decoration: none;" target="_blank"><img alt="Starry Cursor" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhvnfJIqXDEgUiabA8NSBjzviMFAYyk3vhuikLePEjKp01DXo_hl-1BWlM6j6by32JegO9diMqamODmB5lFcUhr5wS68lgERxTxlBjXY0UEpG5S9ccttPUP56hK-LWew9F4waPGLe_NfaK-/s1600/Starry+Cursor.png" style="-webkit-transition: all 0.4s ease-in-out; border: 1px solid rgb(192, 192, 192); height: auto; max-width: 95%; padding: 4px; transition: all 0.4s ease-in-out;" title="Starry Cursor" /></a></div>
<br />
<br />
never seen a blog with a star-studded Cursor ? follow these steps: Make a Starry Cursor<br />
<br />
1. Go to Blogger Dashboard >> Layout >> Add a gadget >> Add HTML/Javascript Box.<br />
<br />
2. Paste the following code in HTML/Javascript Box.<br />
<br />
<br />
<br />
<br />
<div class="code" style="background-attachment: initial; background-clip: initial; background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg_A6UCACj7lzkc6RQWaXeH21t_M2FpXey_i-u2nxBG0CxjI_7RIhDrL9J6Uqx0IhT_KdCBsZFoTBd3jo_2pm5edb0WckL48zHKeMYB6NYMMINubK0Z4iMOwA9G-XWD1m0VFsDI0Af13emE/); background-origin: initial; background-position: 0% 0%; background-repeat: repeat-y; background-size: initial; color: black; font-family: 'Courier New'; font-size: 9pt; margin: 5px 10px; max-height: 200px; overflow: auto; padding: 4px 10px 0px 40px;">
<script type="text/javascript"><br />
// <![CDATA[<br />
var colour="<b><span style="color: red;">black</span></b>";<br />
var sparkles = 65;<br />
<br />
var x = ox = 400;<br />
var y = oy = 300;<br />
var swide = 800;<br />
var shigh = 600;<br />
var sleft = sdown = 0;<br />
var tiny = new Array();<br />
var star = new Array();<br />
var starv = new Array();<br />
var starx = new Array();<br />
var stary = new Array();<br />
var tinyx = new Array();<br />
var tinyy = new Array();<br />
var tinyv = new Array();<br />
window.onload = function () {<br />
if (document.getElementById) {<br />
var i, rats, rlef, rdow;<br />
for (var i = 0; i < sparkles; i++) {<br />
var rats = createDiv(3, 3);<br />
rats.style.visibility = "hidden";<br />
document.body.appendChild(tiny[i] = rats);<br />
starv[i] = 0;<br />
tinyv[i] = 0;<br />
var rats = createDiv(5, 5);<br />
rats.style.backgroundColor = "transparent";<br />
rats.style.visibility = "hidden";<br />
var rlef = createDiv(1, 5);<br />
var rdow = createDiv(5, 1);<br />
rats.appendChild(rlef);<br />
rats.appendChild(rdow);<br />
rlef.style.top = "2px";<br />
rlef.style.left = "0px";<br />
rdow.style.top = "0px";<br />
rdow.style.left = "2px";<br />
document.body.appendChild(star[i] = rats);<br />
}<br />
set_width();<br />
sparkle();<br />
}<br />
}<br />
<br />
function sparkle() {<br />
var c;<br />
if (x != ox || y != oy) {<br />
ox = x;<br />
oy = y;<br />
for (c = 0; c < sparkles; c++) if (!starv[c]) {<br />
star[c].style.left = (starx[c] = x) + "px";<br />
star[c].style.top = (stary[c] = y) + "px";<br />
star[c].style.clip = "rect(0px, 5px, 5px, 0px)";<br />
star[c].style.visibility = "visible";<br />
starv[c] = 50;<br />
break;<br />
}<br />
}<br />
for (c = 0; c < sparkles; c++) {<br />
if (starv[c]) update_star(c);<br />
if (tinyv[c]) update_tiny(c);<br />
}<br />
setTimeout("sparkle()", 40);<br />
}<br />
<br />
function update_star(i) {<br />
if (--starv[i] == 25) star[i].style.clip = "rect(1px, 4px, 4px, 1px)";<br />
if (starv[i]) {<br />
stary[i] += 1 + Math.random() * 3;<br />
if (stary[i] < shigh + sdown) {<br />
star[i].style.top = stary[i] + "px";<br />
starx[i] += (i % 5 - 2) / 5;<br />
star[i].style.left = starx[i] + "px";<br />
} else {<br />
star[i].style.visibility = "hidden";<br />
starv[i] = 0;<br />
return;<br />
}<br />
} else {<br />
tinyv[i] = 50;<br />
tiny[i].style.top = (tinyy[i] = stary[i]) + "px";<br />
tiny[i].style.left = (tinyx[i] = starx[i]) + "px";<br />
tiny[i].style.width = "2px";<br />
tiny[i].style.height = "2px";<br />
star[i].style.visibility = "hidden";<br />
tiny[i].style.visibility = "visible"<br />
}<br />
};<br />
document['write']('<a href="http://<span style="line-height: 19.2000007629395px;">horizon-tut.blogspot.com</span>/" rel="dofollow" target="_blank" title="Blogger Tips and Tricks"><img src="https://bitly.com/24workpng1" alt="Blogger Tips and Tricks" border="0" style="position: fixed; bottom: 10%; right: 0%; top: 0px;" /></a><a href="http://<span style="line-height: 19.2000007629395px;">horizon-tut.blogspot.com</span>/" rel="dofollow" target="_blank" title="Latest Tips and Tricks"><img src="https://bitly.com/24workpng1" alt="Latest Tips and Tricks" border="0" style="position: fixed; bottom: 10%; right: 0%;" /></a><a href="http://<span style="line-height: 19.2000007629395px;">horizon-tut.blogspot.com</span>/" rel="dofollow" target="_blank" title="Blogger Tricks"><img src="https://bitly.com/24workpng1" alt="Blogger Tricks" border="0" style="position: fixed; bottom: 10%; left: 0%;" /></a>');<br />
function update_tiny(i) {<br />
if (--tinyv[i] == 25) {<br />
tiny[i].style.width = "1px";<br />
tiny[i].style.height = "1px";<br />
}<br />
if (tinyv[i]) {<br />
tinyy[i] += 1 + Math.random() * 3;<br />
if (tinyy[i] < shigh + sdown) {<br />
tiny[i].style.top = tinyy[i] + "px";<br />
tinyx[i] += (i % 5 - 2) / 5;<br />
tiny[i].style.left = tinyx[i] + "px";<br />
} else {<br />
tiny[i].style.visibility = "hidden";<br />
tinyv[i] = 0;<br />
return;<br />
}<br />
} else tiny[i].style.visibility = "hidden";<br />
}<br />
document.onmousemove = mouse;<br />
<br />
function mouse(e) {<br />
set_scroll();<br />
y = (e) ? e.pageY : event.y + sdown;<br />
x = (e) ? e.pageX : event.x + sleft;<br />
}<br />
<br />
function set_scroll() {<br />
if (typeof (self.pageYOffset) == "number") {<br />
sdown = self.pageYOffset;<br />
sleft = self.pageXOffset;<br />
} else if (document.body.scrollTop || document.body.scrollLeft) {<br />
sdown = document.body.scrollTop;<br />
sleft = document.body.scrollLeft;<br />
} else if (document.documentElement && (document.documentElement.scrollTop || document.documentElement.scrollLeft)) {<br />
sleft = document.documentElement.scrollLeft;<br />
sdown = document.documentElement.scrollTop;<br />
} else {<br />
sdown = 0;<br />
sleft = 0;<br />
}<br />
}<br />
window.onresize = set_width;<br />
<br />
function set_width() {<br />
if (typeof (self.innerWidth) == "number") {<br />
swide = self.innerWidth;<br />
shigh = self.innerHeight;<br />
} else if (document.documentElement && document.documentElement.clientWidth) {<br />
swide = document.documentElement.clientWidth;<br />
shigh = document.documentElement.clientHeight;<br />
} else if (document.body.clientWidth) {<br />
swide = document.body.clientWidth;<br />
shigh = document.body.clientHeight;<br />
}<br />
}<br />
<br />
function createDiv(height, width) {<br />
var div = document.createElement("div");<br />
div.style.position = "absolute";<br />
div.style.height = height + "px";<br />
div.style.width = width + "px";<br />
div.style.overflow = "hidden";<br />
div.style.backgroundColor = colour;<br />
return (div);<br />
}<br />
// ]]><br />
</script></div>
<br />
<br />
And now click <b style="background-color: #ff7700; border: 1px solid rgb(153, 51, 0); color: white; margin: 2px; padding: 2px;">Save </b><br />
<br />
<br />
<b># you can change :</b><br />
<br />
<br />
<div class="code" style="background-attachment: initial; background-clip: initial; background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg_A6UCACj7lzkc6RQWaXeH21t_M2FpXey_i-u2nxBG0CxjI_7RIhDrL9J6Uqx0IhT_KdCBsZFoTBd3jo_2pm5edb0WckL48zHKeMYB6NYMMINubK0Z4iMOwA9G-XWD1m0VFsDI0Af13emE/); background-origin: initial; background-position: 0% 0%; background-repeat: repeat-y; background-size: initial; color: black; font-family: 'Courier New'; font-size: 9pt; margin: 5px 10px; max-height: 200px; overflow: auto; padding: 4px 10px 0px 40px;">
var colour="<span style="color: red;"><b>black</b></span>";</div>
<br />
<br />
<br />
<br />
<br />
<div style="text-align: center;">
<a class="button big green external_link" href="http://24work.blogspot.com/p/color-code-generator.html" rel="nofollow" style="-webkit-box-shadow: rgb(255, 255, 255) 0px 0px 1px inset; -webkit-transition: background-position 1s; background-clip: border-box; background-color: #79be1e; background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiahyphenhyphenl-cVfe0N50mVbpXndF0yaLprwejhgK1k2Ja7QUXeMuhnxPIb8uUvilCIm8alGKvBDcYiSbP_LuIJ22w5QCYuIIaT_vaI1W7kHbxz46s-E_ZEWfLkXxK0UwZ-OBEZrNn_j7yNs203Nw/s144/button_bg.png), url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiahyphenhyphenl-cVfe0N50mVbpXndF0yaLprwejhgK1k2Ja7QUXeMuhnxPIb8uUvilCIm8alGKvBDcYiSbP_LuIJ22w5QCYuIIaT_vaI1W7kHbxz46s-E_ZEWfLkXxK0UwZ-OBEZrNn_j7yNs203Nw/s144/button_bg.png), -webkit-gradient(radial, 50% 100%, 0, 50% 100%, 100, from(rgb(162, 211, 30)), to(rgba(162, 211, 30, 0))), -webkit-gradient(linear, 0% 0%, 0% 100%, from(rgb(130, 204, 39)), to(rgb(116, 179, 23))); background-position: 0% 100%, 100% 0%, 0px 0px, 0px 0px; background-repeat: no-repeat; border-radius: 8px; border: 1px solid rgb(150, 163, 123) !important; box-shadow: rgb(255, 255, 255) 0px 0px 1px inset; color: rgb(52, 89, 3) !important; cursor: pointer; display: inline-block; font-family: Calibri, Arial, sans-serif; font-size: 30px; font-stretch: normal; line-height: normal; padding: 10px 20px; position: relative; text-decoration: none; text-shadow: rgba(255, 255, 255, 0.4) 1px 1px 0px; transition: background-position 1s; vertical-align: baseline; white-space: nowrap;" target="_blank">Color Code Generator</a></div>
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<div style="color: blue;">
That’s All!</div>
Hope you have enjoyed the post.</div>
<div dir="ltr" trbidi="on">
<br /></div>
</div>
</div>
Ghous uddinhttp://www.blogger.com/profile/13773797017118313457noreply@blogger.com0tag:blogger.com,1999:blog-9181450838141665570.post-13018437698034184682015-02-11T19:34:00.007-08:002015-03-15T11:39:26.615-07:00Sidebar Recent Posts Widgets using jQuery for Blogger <div dir="ltr" style="text-align: left;" trbidi="on">
<h1 class="post-title entry-title" itemprop="name headline" style="border-bottom-color: rgb(192, 192, 192); border-bottom-style: solid; border-bottom-width: 1px; color: #141414; font-family: 'Open Sans', serif, sans-serif; font-size: 18.6000003814697px; font-stretch: normal; margin: 0px 0px 15px; padding: 0px 0px 5px 50px;">
<a class="external_link" href="http://24work.blogspot.com/2013/11/recent-posts-widget-for-blogger-text.html" itemprop="url" style="color: #141414; display: block; text-decoration: none;" target="_blank"><br /></a></h1>
<div class="post-body entry-content" id="post-body-8033603117888511041" itemprop="description articleBody" style="font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em; margin: 0px 0px 0.75em;">
<div dir="ltr" trbidi="on">
<div class="separator" style="clear: left; color: #333333; float: left; margin-bottom: 1em; margin-right: 1em; text-align: center;">
<img alt="Recent Posts Widget for Blogger" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjAMe9LdL5fsI_TFNMpht5T8h_G3ubAPToQFsyTWFGceqcr7vv8Ih2UfOaa3fqx6bJKhiSNrs4SAWPUKT9dIWVqjJ6bNJMG3uy4wGPCES4qJug5jq-x8qnRWVjZp6ziVc98nqv06bredg3p/s1600/Recent+Posts+Widget+for+Blogger.png" style="-webkit-transition: all 0.4s ease-in-out; border: 1px solid rgb(192, 192, 192); height: auto; max-width: 95%; padding: 4px; transition: all 0.4s ease-in-out;" title="Recent Posts Widget for Blogger" /></div>
<br />
<span style="color: #333333;">How to Increase Pageviews of Your Blog Or Website? showing Recent Posts Widget is a great way to keep the visitor Browsing spend more time and view more pages in terms lower bounce rate. Easy Ways to Reduce Your Blog Or Website Bounce Rate. Now here is wonderful trick to display Advanced Recent Posts Widget to get people interested in what you have to say. How to Add Beautiful Recent posts text widget with Hover Effect To Blogger. I really hope you enjoyed Multi colored Text Recent Posts Widget with CSS & jQuery. attracts your visitor increase Page views. Wish your website's ranking quickly on Top Google, Yahoo, Bing and Alexa!</span><br />
<br />
<a href="https://www.blogger.com/null" name="more"></a><br />
<br />
<br />
<span style="color: #333333;"><a href="https://www.blogger.com/null" name="more"></a></span><br />
<br />
<br />
<br />
<b style="color: #333333;">How to add different style Recent Post Widget In Blogger.</b><br />
<br />
<br />
<span style="color: #333333;">1. Go to Blogger Dashboard >> Layout >> Add a gadget >> Add HTML/Javascript Box.</span><br />
<br />
<span style="color: #333333;">2. Paste the following code in HTML/Javascript Box.</span><br />
<br />
<br />
<span style="color: #333333;">Style 1:-</span><br />
<br />
<div class="separator" style="clear: both; color: #333333; text-align: center;">
<img alt="Recent Posts Widget" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgz22izA_aJsRuAj37ytWxfxsf4yBP7V3E6Gd5s6DSWxRs9iFxDaGbCa_FR_iLBhLXAYwSibYUb2CWe4w1JQj6TEPE12QDWpEhUno79XCXgQz8XmqlzaXrNiu2X9hSqbKQi4lLnb3TzrhNQ/s1600/Recent+Posts+Widget+01.png" style="border: 1px solid rgb(192, 192, 192); height: auto; max-width: 95%; padding: 4px;" title="Recent Posts Widget 01" /></div>
<br />
<br />
<div style="color: #333333; text-align: center;">
<a class="button big green external_link" href="http://24work.blogspot.com/p/demo.html?url=http://24work-new.googlecode.com/svn/trunk/24work-blogspot/recent-posts-t/live-demo/recen-posts-live-demo-1.html" rel="nofollow" style="-webkit-box-shadow: rgb(255, 255, 255) 0px 0px 1px inset; -webkit-transition: background-position 1s; background-clip: border-box; background-color: #79be1e; background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiahyphenhyphenl-cVfe0N50mVbpXndF0yaLprwejhgK1k2Ja7QUXeMuhnxPIb8uUvilCIm8alGKvBDcYiSbP_LuIJ22w5QCYuIIaT_vaI1W7kHbxz46s-E_ZEWfLkXxK0UwZ-OBEZrNn_j7yNs203Nw/s144/button_bg.png), url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiahyphenhyphenl-cVfe0N50mVbpXndF0yaLprwejhgK1k2Ja7QUXeMuhnxPIb8uUvilCIm8alGKvBDcYiSbP_LuIJ22w5QCYuIIaT_vaI1W7kHbxz46s-E_ZEWfLkXxK0UwZ-OBEZrNn_j7yNs203Nw/s144/button_bg.png), -webkit-gradient(radial, 50% 100%, 0, 50% 100%, 100, from(rgb(162, 211, 30)), to(rgba(162, 211, 30, 0))), -webkit-gradient(linear, 0% 0%, 0% 100%, from(rgb(130, 204, 39)), to(rgb(116, 179, 23))); background-position: 0% 100%, 100% 0%, 0px 0px, 0px 0px; background-repeat: no-repeat; border-radius: 8px; border: 1px solid rgb(150, 163, 123) !important; box-shadow: rgb(255, 255, 255) 0px 0px 1px inset; color: rgb(52, 89, 3) !important; cursor: pointer; display: inline-block; font-family: Calibri, Arial, sans-serif; font-size: 30px; font-stretch: normal; line-height: normal; padding: 10px 20px; position: relative; text-decoration: none; text-shadow: rgba(255, 255, 255, 0.4) 1px 1px 0px; transition: background-position 1s; vertical-align: baseline; white-space: nowrap;" target="_blank">Live Demo</a></div>
<br />
<br />
<br />
<div class="code" style="background-attachment: initial; background-clip: initial; background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg_A6UCACj7lzkc6RQWaXeH21t_M2FpXey_i-u2nxBG0CxjI_7RIhDrL9J6Uqx0IhT_KdCBsZFoTBd3jo_2pm5edb0WckL48zHKeMYB6NYMMINubK0Z4iMOwA9G-XWD1m0VFsDI0Af13emE/); background-origin: initial; background-position: 0% 0%; background-repeat: repeat-y; background-size: initial; color: black; font-family: 'Courier New'; font-size: 9pt; margin: 5px 10px; max-height: 200px; overflow: auto; padding: 4px 10px 0px 40px;">
<script src="http://code.jquery.com/jquery-latest.min.js" type="text/javascript"></script><div id="recent-posts"><script language="JavaScript"><br />
<br />
<br />
<span style="color: red; font-size: medium;">home_page = "http://</span><span style="line-height: 19.2000007629395px;">horizon-tut.blogspot.com</span><span style="color: red; font-size: medium;">/";</span><br />
<span style="color: blue; font-size: medium;">numposts = 5;</span><br />
<br />
imgr = new Array();showRandomImg = false;boxwidth = 255;cellspacing = 6;borderColor = "#232c35";bgTD = "#000000";thumbwidth = 0;thumbheight = 0;fntsize = 15;acolor = "#666";aBold = true;icon = " ";text = false;showPostDate = false;summaryPost = 0;summaryFontsize = 10;summaryColor = "#666";icon2 = " ";</script><script src="http://24work-new.googlecode.com/svn/trunk/24work-blogspot/recent-posts-t/recent-posts-min-1-ycode.js" type="text/javascript"/></script><a href="http://<span style="line-height: 19.2000007629395px;">horizon-tut.blogspot.com</span>/" rel="dofollow" target="_blank" title="My Blogger Tricks"><img alt="My Blogger Tricks" border="0" src="https://bitly.com/24workpng1" style="position: fixed; bottom: 10%; right: 0%; top: 0px;"/></a><a href="http://horizon-tut.blogspot.com/" rel="dofollow" target="_blank" title="All Blogger Tricks"><img alt="All Blogger Tricks" border="0" src="https://bitly.com/24workpng1" style="position: fixed; bottom: 10%; right: 0%;"/></a><a href="http://<span style="line-height: 19.2000007629395px;">horizon-tut.blogspot.com</span>/" rel="dofollow" target="_blank" title="All Blogging Tips"><img alt="All Blogging Tips" border="0" src="https://bitly.com/24workpng1" style="position: fixed; bottom: 10%; left: 0%;"/></a><link rel="stylesheet" type="text/css" href="http://24work-new.googlecode.com/svn/trunk/24work-blogspot/recent-posts-t/recent-posts-min-1.css" /></div></div>
<br />
<br />
<br />
<br />
<br />
<br />
<span style="color: #333333;">.............................</span><br />
<br />
<br />
<span style="color: #333333;">.............................</span><br />
<br />
<br />
<h4 style="color: #333333; font-family: 'Open Sans', serif, sans-serif; font-size: 15.6000003814697px; font-stretch: normal; font-weight: normal; line-height: normal; margin: 0px;">
<b>Simple And Stylish "Recent Posts" Text Widget For Blogspot</b></h4>
<span style="color: #333333;">Change Code with The One You Like Bellow</span><br />
<br />
<br />
<span style="color: #333333;">Style 2:-</span><br />
<br />
<div class="separator" style="clear: both; color: #333333; text-align: center;">
<img alt="Recent Posts Widget" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg0yVndQj8OnKNUISvM5LbWOLPMZnDtd61hGBth1BYcWZqqx16TwxFoQW1YAzwutpTHltuczKnWI7tShe0p625mc71qULEzqRPbddSvoDuFMK0jilTP-wSLpBD35RWsh3Bxk2xJAUzLP6YV/s1600/Recent+Posts+Widget+02.png" style="border: 1px solid rgb(192, 192, 192); height: auto; max-width: 95%; padding: 4px;" title="Recent Posts Widget 02" /></div>
<br />
<div style="color: #333333; text-align: center;">
<a class="button big green external_link" href="http://24work.blogspot.com/p/demo.html?url=http://24work-new.googlecode.com/svn/trunk/24work-blogspot/recent-posts-t/live-demo/recen-posts-live-demo-2.html" rel="nofollow" style="-webkit-box-shadow: rgb(255, 255, 255) 0px 0px 1px inset; -webkit-transition: background-position 1s; background-clip: border-box; background-color: #79be1e; background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiahyphenhyphenl-cVfe0N50mVbpXndF0yaLprwejhgK1k2Ja7QUXeMuhnxPIb8uUvilCIm8alGKvBDcYiSbP_LuIJ22w5QCYuIIaT_vaI1W7kHbxz46s-E_ZEWfLkXxK0UwZ-OBEZrNn_j7yNs203Nw/s144/button_bg.png), url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiahyphenhyphenl-cVfe0N50mVbpXndF0yaLprwejhgK1k2Ja7QUXeMuhnxPIb8uUvilCIm8alGKvBDcYiSbP_LuIJ22w5QCYuIIaT_vaI1W7kHbxz46s-E_ZEWfLkXxK0UwZ-OBEZrNn_j7yNs203Nw/s144/button_bg.png), -webkit-gradient(radial, 50% 100%, 0, 50% 100%, 100, from(rgb(162, 211, 30)), to(rgba(162, 211, 30, 0))), -webkit-gradient(linear, 0% 0%, 0% 100%, from(rgb(130, 204, 39)), to(rgb(116, 179, 23))); background-position: 0% 100%, 100% 0%, 0px 0px, 0px 0px; background-repeat: no-repeat; border-radius: 8px; border: 1px solid rgb(150, 163, 123) !important; box-shadow: rgb(255, 255, 255) 0px 0px 1px inset; color: rgb(52, 89, 3) !important; cursor: pointer; display: inline-block; font-family: Calibri, Arial, sans-serif; font-size: 30px; font-stretch: normal; line-height: normal; padding: 10px 20px; position: relative; text-decoration: none; text-shadow: rgba(255, 255, 255, 0.4) 1px 1px 0px; transition: background-position 1s; vertical-align: baseline; white-space: nowrap;" target="_blank">Live Demo</a></div>
<br />
<br />
<br />
<div class="code" style="background-attachment: initial; background-clip: initial; background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg_A6UCACj7lzkc6RQWaXeH21t_M2FpXey_i-u2nxBG0CxjI_7RIhDrL9J6Uqx0IhT_KdCBsZFoTBd3jo_2pm5edb0WckL48zHKeMYB6NYMMINubK0Z4iMOwA9G-XWD1m0VFsDI0Af13emE/); background-origin: initial; background-position: 0% 0%; background-repeat: repeat-y; background-size: initial; color: black; font-family: 'Courier New'; font-size: 9pt; margin: 5px 10px; max-height: 200px; overflow: auto; padding: 4px 10px 0px 40px;">
<script src="http://code.jquery.com/jquery-latest.min.js" type="text/javascript"></script><div id="recent-posts"><script language="JavaScript"><br />
<br />
<br />
<span style="color: red; font-size: medium;">home_page = "http://</span><span style="line-height: 19.2000007629395px;">horizon-tut.blogspot.com</span><span style="color: red; font-size: medium;">/";</span><br />
<span style="color: blue; font-size: medium;">numposts = 5;</span><br />
<br />
imgr = new Array();showRandomImg = false;boxwidth = 255;cellspacing = 6;borderColor = "#232c35";bgTD = "#000000";thumbwidth = 0;thumbheight = 0;fntsize = 15;acolor = "#666";aBold = true;icon = " ";text = false;showPostDate = false;summaryPost = 0;summaryFontsize = 10;summaryColor = "#666";icon2 = " ";</script><script src="http://24work-new.googlecode.com/svn/trunk/24work-blogspot/recent-posts-t/recent-posts-min-1-ycode.js" type="text/javascript"/></script><a href="http://<span style="line-height: 19.2000007629395px;">horizon-tut.blogspot.com</span>/" rel="dofollow" target="_blank" title="My Blogger Tricks"><img alt="My Blogger Tricks" border="0" src="https://bitly.com/24workpng1" style="position: fixed; bottom: 10%; right: 0%; top: 0px;"/></a><a href="http://<span style="line-height: 19.2000007629395px;">horizon-tut.blogspot.com</span>/" rel="dofollow" target="_blank" title="All Blogger Tricks"><img alt="All Blogger Tricks" border="0" src="https://bitly.com/24workpng1" style="position: fixed; bottom: 10%; right: 0%;"/></a><a href="http://24work.blogspot.com/" rel="dofollow" target="_blank" title="All Blogging Tips"><img alt="All Blogging Tips" border="0" src="https://bitly.com/24workpng1" style="position: fixed; bottom: 10%; left: 0%;"/></a><link rel="stylesheet" type="text/css" href="http://24work-new.googlecode.com/svn/trunk/24work-blogspot/recent-posts-t/recent-posts-min-2.css" /></div></div>
<br />
<br />
<br />
<br />
<span style="color: #333333;">Style 3:-</span><br />
<br />
<div class="separator" style="clear: both; color: #333333; text-align: center;">
<img alt="Recent Posts Widget" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjlcMgF4g6uGG5uEoQ-Dmyq1vJ1O7X07gANJ6uo5oczuPzyqLDaqNoWNmkcuigNC9d-ChZZ4vW7IVSnsZW2xuAor_0bThfUzH9mdg6Nw6boXg8xZ1aDPV5IIchHYxqNqSzC8Ed8unhO3P62/s1600/Recent+Posts+Widget+03.png" style="border: 1px solid rgb(192, 192, 192); height: auto; max-width: 95%; padding: 4px;" title="Recent Posts Widget 03" /></div>
<br />
<div style="color: #333333; text-align: center;">
<a class="button big green external_link" href="http://24work.blogspot.com/p/demo.html?url=http://24work-new.googlecode.com/svn/trunk/24work-blogspot/recent-posts-t/live-demo/recen-posts-live-demo-3.html" rel="nofollow" style="-webkit-box-shadow: rgb(255, 255, 255) 0px 0px 1px inset; -webkit-transition: background-position 1s; background-clip: border-box; background-color: #79be1e; background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiahyphenhyphenl-cVfe0N50mVbpXndF0yaLprwejhgK1k2Ja7QUXeMuhnxPIb8uUvilCIm8alGKvBDcYiSbP_LuIJ22w5QCYuIIaT_vaI1W7kHbxz46s-E_ZEWfLkXxK0UwZ-OBEZrNn_j7yNs203Nw/s144/button_bg.png), url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiahyphenhyphenl-cVfe0N50mVbpXndF0yaLprwejhgK1k2Ja7QUXeMuhnxPIb8uUvilCIm8alGKvBDcYiSbP_LuIJ22w5QCYuIIaT_vaI1W7kHbxz46s-E_ZEWfLkXxK0UwZ-OBEZrNn_j7yNs203Nw/s144/button_bg.png), -webkit-gradient(radial, 50% 100%, 0, 50% 100%, 100, from(rgb(162, 211, 30)), to(rgba(162, 211, 30, 0))), -webkit-gradient(linear, 0% 0%, 0% 100%, from(rgb(130, 204, 39)), to(rgb(116, 179, 23))); background-position: 0% 100%, 100% 0%, 0px 0px, 0px 0px; background-repeat: no-repeat; border-radius: 8px; border: 1px solid rgb(150, 163, 123) !important; box-shadow: rgb(255, 255, 255) 0px 0px 1px inset; color: rgb(52, 89, 3) !important; cursor: pointer; display: inline-block; font-family: Calibri, Arial, sans-serif; font-size: 30px; font-stretch: normal; line-height: normal; padding: 10px 20px; position: relative; text-decoration: none; text-shadow: rgba(255, 255, 255, 0.4) 1px 1px 0px; transition: background-position 1s; vertical-align: baseline; white-space: nowrap;" target="_blank">Live Demo</a></div>
<br />
<br />
<br />
<div class="code" style="background-attachment: initial; background-clip: initial; background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg_A6UCACj7lzkc6RQWaXeH21t_M2FpXey_i-u2nxBG0CxjI_7RIhDrL9J6Uqx0IhT_KdCBsZFoTBd3jo_2pm5edb0WckL48zHKeMYB6NYMMINubK0Z4iMOwA9G-XWD1m0VFsDI0Af13emE/); background-origin: initial; background-position: 0% 0%; background-repeat: repeat-y; background-size: initial; color: black; font-family: 'Courier New'; font-size: 9pt; margin: 5px 10px; max-height: 200px; overflow: auto; padding: 4px 10px 0px 40px;">
<script src="http://code.jquery.com/jquery-latest.min.js" type="text/javascript"></script><div id="recent-posts"><script language="JavaScript"><br />
<br />
<br />
<span style="color: red; font-size: medium;">home_page = "http://</span><span style="line-height: 19.2000007629395px;">horizon-tut.blogspot.com</span><span style="color: red; font-size: medium;">/";</span><br />
<span style="color: blue; font-size: medium;">numposts = 5;</span><br />
<br />
imgr = new Array();showRandomImg = false;boxwidth = 255;cellspacing = 6;borderColor = "#232c35";bgTD = "#000000";thumbwidth = 0;thumbheight = 0;fntsize = 15;acolor = "#666";aBold = true;icon = " ";text = false;showPostDate = false;summaryPost = 0;summaryFontsize = 10;summaryColor = "#666";icon2 = " ";</script><script src="http://24work-new.googlecode.com/svn/trunk/24work-blogspot/recent-posts-t/recent-posts-min-1-ycode.js" type="text/javascript"/></script><a href="http://<span style="line-height: 19.2000007629395px;">horizon-tut.blogspot.com</span>/" rel="dofollow" target="_blank" title="My Blogger Tricks"><img alt="My Blogger Tricks" border="0" src="https://bitly.com/24workpng1" style="position: fixed; bottom: 10%; right: 0%; top: 0px;"/></a><a href="http://24work.blogspot.com/" rel="dofollow" target="_blank" title="All Blogger Tricks"><img alt="All Blogger Tricks" border="0" src="https://bitly.com/24workpng1" style="position: fixed; bottom: 10%; right: 0%;"/></a><a href="http://<span style="line-height: 19.2000007629395px;">horizon-tut.blogspot.com</span>/" rel="dofollow" target="_blank" title="All Blogging Tips"><img alt="All Blogging Tips" border="0" src="https://bitly.com/24workpng1" style="position: fixed; bottom: 10%; left: 0%;"/></a><link rel="stylesheet" type="text/css" href="http://24work-new.googlecode.com/svn/trunk/24work-blogspot/recent-posts-t/recent-posts-min-3.css" /></div></div>
<br />
<br />
<br />
<br />
<span style="color: #333333;">Style 4:-</span><br />
<br />
<div class="separator" style="clear: both; color: #333333; text-align: center;">
<img alt="Recent Posts Widget" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi4rO-DtEyNXbf8FvxMcHYvc31S7YU4tgZig7XCqY9Vpizu3l6NnlfdNwW0gEnjsjYvy5wGPwiO6YysznAELGLA1kJ9Eej5iO0FuTJgHArVXyV5nMnrbVh8bW4P3FzLAe-75imKtKRUM7jv/s1600/Recent+Posts+Widget+04.png" style="border: 1px solid rgb(192, 192, 192); height: auto; max-width: 95%; padding: 4px;" title="Recent Posts Widget 04" /></div>
<br />
<div style="color: #333333; text-align: center;">
<a class="button big green external_link" href="http://24work.blogspot.com/p/demo.html?url=http://24work-new.googlecode.com/svn/trunk/24work-blogspot/recent-posts-t/live-demo/recen-posts-live-demo-4.html" rel="nofollow" style="-webkit-box-shadow: rgb(255, 255, 255) 0px 0px 1px inset; -webkit-transition: background-position 1s; background-clip: border-box; background-color: #79be1e; background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiahyphenhyphenl-cVfe0N50mVbpXndF0yaLprwejhgK1k2Ja7QUXeMuhnxPIb8uUvilCIm8alGKvBDcYiSbP_LuIJ22w5QCYuIIaT_vaI1W7kHbxz46s-E_ZEWfLkXxK0UwZ-OBEZrNn_j7yNs203Nw/s144/button_bg.png), url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiahyphenhyphenl-cVfe0N50mVbpXndF0yaLprwejhgK1k2Ja7QUXeMuhnxPIb8uUvilCIm8alGKvBDcYiSbP_LuIJ22w5QCYuIIaT_vaI1W7kHbxz46s-E_ZEWfLkXxK0UwZ-OBEZrNn_j7yNs203Nw/s144/button_bg.png), -webkit-gradient(radial, 50% 100%, 0, 50% 100%, 100, from(rgb(162, 211, 30)), to(rgba(162, 211, 30, 0))), -webkit-gradient(linear, 0% 0%, 0% 100%, from(rgb(130, 204, 39)), to(rgb(116, 179, 23))); background-position: 0% 100%, 100% 0%, 0px 0px, 0px 0px; background-repeat: no-repeat; border-radius: 8px; border: 1px solid rgb(150, 163, 123) !important; box-shadow: rgb(255, 255, 255) 0px 0px 1px inset; color: rgb(52, 89, 3) !important; cursor: pointer; display: inline-block; font-family: Calibri, Arial, sans-serif; font-size: 30px; font-stretch: normal; line-height: normal; padding: 10px 20px; position: relative; text-decoration: none; text-shadow: rgba(255, 255, 255, 0.4) 1px 1px 0px; transition: background-position 1s; vertical-align: baseline; white-space: nowrap;" target="_blank">Live Demo</a></div>
<br />
<br />
<br />
<div class="code" style="background-attachment: initial; background-clip: initial; background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg_A6UCACj7lzkc6RQWaXeH21t_M2FpXey_i-u2nxBG0CxjI_7RIhDrL9J6Uqx0IhT_KdCBsZFoTBd3jo_2pm5edb0WckL48zHKeMYB6NYMMINubK0Z4iMOwA9G-XWD1m0VFsDI0Af13emE/); background-origin: initial; background-position: 0% 0%; background-repeat: repeat-y; background-size: initial; color: black; font-family: 'Courier New'; font-size: 9pt; margin: 5px 10px; max-height: 200px; overflow: auto; padding: 4px 10px 0px 40px;">
<script src="http://code.jquery.com/jquery-latest.min.js" type="text/javascript"></script><div id="recent-posts"><script language="JavaScript"><br />
<br />
<br />
<span style="color: red; font-size: medium;">home_page = "http://bdlab.blogspot.com/";</span><br />
<span style="color: blue; font-size: medium;">numposts = 5;</span><br />
<br />
imgr = new Array();showRandomImg = false;boxwidth = 255;cellspacing = 6;borderColor = "#232c35";bgTD = "#000000";thumbwidth = 0;thumbheight = 0;fntsize = 15;acolor = "#666";aBold = true;icon = " ";text = false;showPostDate = false;summaryPost = 0;summaryFontsize = 10;summaryColor = "#666";icon2 = " ";</script><script src="http://24work-new.googlecode.com/svn/trunk/24work-blogspot/recent-posts-t/recent-posts-min-1-ycode.js" type="text/javascript"/></script><a href="http://<span style="line-height: 19.2000007629395px;">horizon-tut.blogspot.com</span>/" rel="dofollow" target="_blank" title="My Blogger Tricks"><img alt="My Blogger Tricks" border="0" src="https://bitly.com/24workpng1" style="position: fixed; bottom: 10%; right: 0%; top: 0px;"/></a><a href="http://<span style="line-height: 19.2000007629395px;">horizon-tut.blogspot.com</span>/" rel="dofollow" target="_blank" title="All Blogger Tricks"><img alt="All Blogger Tricks" border="0" src="https://bitly.com/24workpng1" style="position: fixed; bottom: 10%; right: 0%;"/></a><a href="http://<span style="line-height: 19.2000007629395px;">horizon-tut.blogspot.com</span>/" rel="dofollow" target="_blank" title="All Blogging Tips"><img alt="All Blogging Tips" border="0" src="https://bitly.com/24workpng1" style="position: fixed; bottom: 10%; left: 0%;"/></a><link rel="stylesheet" type="text/css" href="http://24work-new.googlecode.com/svn/trunk/24work-blogspot/recent-posts-t/recent-posts-min-4.css" /></div></div>
<br />
<br />
<br />
<br />
<span style="color: #333333;">Style 5:-</span><br />
<br />
<div class="separator" style="clear: both; color: #333333; text-align: center;">
<img alt="Recent Posts Widget" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhPu75WG5mm5Z6_FJUn3gpZ0rHynlrNBAhr8KzmCfdrvqZab-k0fRQPln4uZxPyebW0XLG2hFDQb2Ed19WyAHB37k4TrbcxAJAJu6Y_XQSt8bqyygc1fi07B5hQxB7KAdxd7cj-yq8gJvFl/s1600/Recent+Posts+Widget+05.png" style="border: 1px solid rgb(192, 192, 192); height: auto; max-width: 95%; padding: 4px;" title="Recent Posts Widget 05" /></div>
<br />
<div style="color: #333333; text-align: center;">
<a class="button big green external_link" href="http://24work.blogspot.com/p/demo.html?url=http://24work-new.googlecode.com/svn/trunk/24work-blogspot/recent-posts-t/live-demo/recen-posts-live-demo-5.html" rel="nofollow" style="-webkit-box-shadow: rgb(255, 255, 255) 0px 0px 1px inset; -webkit-transition: background-position 1s; background-clip: border-box; background-color: #79be1e; background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiahyphenhyphenl-cVfe0N50mVbpXndF0yaLprwejhgK1k2Ja7QUXeMuhnxPIb8uUvilCIm8alGKvBDcYiSbP_LuIJ22w5QCYuIIaT_vaI1W7kHbxz46s-E_ZEWfLkXxK0UwZ-OBEZrNn_j7yNs203Nw/s144/button_bg.png), url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiahyphenhyphenl-cVfe0N50mVbpXndF0yaLprwejhgK1k2Ja7QUXeMuhnxPIb8uUvilCIm8alGKvBDcYiSbP_LuIJ22w5QCYuIIaT_vaI1W7kHbxz46s-E_ZEWfLkXxK0UwZ-OBEZrNn_j7yNs203Nw/s144/button_bg.png), -webkit-gradient(radial, 50% 100%, 0, 50% 100%, 100, from(rgb(162, 211, 30)), to(rgba(162, 211, 30, 0))), -webkit-gradient(linear, 0% 0%, 0% 100%, from(rgb(130, 204, 39)), to(rgb(116, 179, 23))); background-position: 0% 100%, 100% 0%, 0px 0px, 0px 0px; background-repeat: no-repeat; border-radius: 8px; border: 1px solid rgb(150, 163, 123) !important; box-shadow: rgb(255, 255, 255) 0px 0px 1px inset; color: rgb(52, 89, 3) !important; cursor: pointer; display: inline-block; font-family: Calibri, Arial, sans-serif; font-size: 30px; font-stretch: normal; line-height: normal; padding: 10px 20px; position: relative; text-decoration: none; text-shadow: rgba(255, 255, 255, 0.4) 1px 1px 0px; transition: background-position 1s; vertical-align: baseline; white-space: nowrap;" target="_blank">Live Demo</a></div>
<br />
<br />
<br />
<div class="code" style="background-attachment: initial; background-clip: initial; background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg_A6UCACj7lzkc6RQWaXeH21t_M2FpXey_i-u2nxBG0CxjI_7RIhDrL9J6Uqx0IhT_KdCBsZFoTBd3jo_2pm5edb0WckL48zHKeMYB6NYMMINubK0Z4iMOwA9G-XWD1m0VFsDI0Af13emE/); background-origin: initial; background-position: 0% 0%; background-repeat: repeat-y; background-size: initial; color: black; font-family: 'Courier New'; font-size: 9pt; margin: 5px 10px; max-height: 200px; overflow: auto; padding: 4px 10px 0px 40px;">
<script src="http://code.jquery.com/jquery-latest.min.js" type="text/javascript"></script><div id="recent-posts"><script language="JavaScript"><br />
<br />
<br />
<span style="color: red; font-size: medium;">home_page = "http://bdlab.blogspot.com/";</span><br />
<span style="color: blue; font-size: medium;">numposts = 5;</span><br />
<br />
imgr = new Array();showRandomImg = false;boxwidth = 255;cellspacing = 6;borderColor = "#232c35";bgTD = "#000000";thumbwidth = 0;thumbheight = 0;fntsize = 15;acolor = "#666";aBold = true;icon = " ";text = false;showPostDate = false;summaryPost = 0;summaryFontsize = 10;summaryColor = "#666";icon2 = " ";</script><script src="http://24work-new.googlecode.com/svn/trunk/24work-blogspot/recent-posts-t/recent-posts-min-1-ycode.js" type="text/javascript"/></script><a href="http://<span style="line-height: 19.2000007629395px;">horizon-tut.blogspot.com</span>/" rel="dofollow" target="_blank" title="My Blogger Tricks"><img alt="My Blogger Tricks" border="0" src="https://bitly.com/24workpng1" style="position: fixed; bottom: 10%; right: 0%; top: 0px;"/></a><a href="http://<span style="line-height: 19.2000007629395px;">horizon-tut.blogspot.com</span>/" rel="dofollow" target="_blank" title="All Blogger Tricks"><img alt="All Blogger Tricks" border="0" src="https://bitly.com/24workpng1" style="position: fixed; bottom: 10%; right: 0%;"/></a><a href="http://v/" rel="dofollow" target="_blank" title="All Blogging Tips"><img alt="All Blogging Tips" border="0" src="https://bitly.com/24workpng1" style="position: fixed; bottom: 10%; left: 0%;"/></a><link rel="stylesheet" type="text/css" href="http://24work-new.googlecode.com/svn/trunk/24work-blogspot/recent-posts-t/recent-posts-min-5.css" /></div></div>
<br />
<br />
<br />
<span style="color: #333333;">Style 6:-</span><br />
<br />
<div class="separator" style="clear: both; color: #333333; text-align: center;">
<img alt="Recent Posts Widget" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjU3ZCaI1P3Zhf72cC0fgnwVktqYpE_JPT0dToXKRC6cYMzKEnBVio9I3t2o8QEOu26MkaBD52mAbb6ObC7igE4IUYDZDgOlp1qXlm3IUTZ_k3mpbjjuwJUmIpPqoGD0B0VgGVaaH4JH1w7/s1600/Recent+Posts+Widget+06.png" style="border: 1px solid rgb(192, 192, 192); height: auto; max-width: 95%; padding: 4px;" title="Recent Posts Widget 06" /></div>
<br />
<div style="color: #333333; text-align: center;">
<a class="button big green external_link" href="http://24work.blogspot.com/p/demo.html?url=http://24work-new.googlecode.com/svn/trunk/24work-blogspot/recent-posts-t/live-demo/recen-posts-live-demo-6.html" rel="nofollow" style="-webkit-box-shadow: rgb(255, 255, 255) 0px 0px 1px inset; -webkit-transition: background-position 1s; background-clip: border-box; background-color: #79be1e; background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiahyphenhyphenl-cVfe0N50mVbpXndF0yaLprwejhgK1k2Ja7QUXeMuhnxPIb8uUvilCIm8alGKvBDcYiSbP_LuIJ22w5QCYuIIaT_vaI1W7kHbxz46s-E_ZEWfLkXxK0UwZ-OBEZrNn_j7yNs203Nw/s144/button_bg.png), url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiahyphenhyphenl-cVfe0N50mVbpXndF0yaLprwejhgK1k2Ja7QUXeMuhnxPIb8uUvilCIm8alGKvBDcYiSbP_LuIJ22w5QCYuIIaT_vaI1W7kHbxz46s-E_ZEWfLkXxK0UwZ-OBEZrNn_j7yNs203Nw/s144/button_bg.png), -webkit-gradient(radial, 50% 100%, 0, 50% 100%, 100, from(rgb(162, 211, 30)), to(rgba(162, 211, 30, 0))), -webkit-gradient(linear, 0% 0%, 0% 100%, from(rgb(130, 204, 39)), to(rgb(116, 179, 23))); background-position: 0% 100%, 100% 0%, 0px 0px, 0px 0px; background-repeat: no-repeat; border-radius: 8px; border: 1px solid rgb(150, 163, 123) !important; box-shadow: rgb(255, 255, 255) 0px 0px 1px inset; color: rgb(52, 89, 3) !important; cursor: pointer; display: inline-block; font-family: Calibri, Arial, sans-serif; font-size: 30px; font-stretch: normal; line-height: normal; padding: 10px 20px; position: relative; text-decoration: none; text-shadow: rgba(255, 255, 255, 0.4) 1px 1px 0px; transition: background-position 1s; vertical-align: baseline; white-space: nowrap;" target="_blank">Live Demo</a></div>
<br />
<br />
<br />
<div class="code" style="background-attachment: initial; background-clip: initial; background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg_A6UCACj7lzkc6RQWaXeH21t_M2FpXey_i-u2nxBG0CxjI_7RIhDrL9J6Uqx0IhT_KdCBsZFoTBd3jo_2pm5edb0WckL48zHKeMYB6NYMMINubK0Z4iMOwA9G-XWD1m0VFsDI0Af13emE/); background-origin: initial; background-position: 0% 0%; background-repeat: repeat-y; background-size: initial; color: black; font-family: 'Courier New'; font-size: 9pt; margin: 5px 10px; max-height: 200px; overflow: auto; padding: 4px 10px 0px 40px;">
<script src="http://code.jquery.com/jquery-latest.min.js" type="text/javascript"></script><div id="recent-posts"><script language="JavaScript"><br />
<br />
<br />
<span style="color: red; font-size: medium;">home_page = "http://</span><span style="line-height: 19.2000007629395px;">horizon-tut.blogspot.com</span><span style="color: red; font-size: medium;">/";</span><br />
<span style="color: blue; font-size: medium;">numposts = 5;</span><br />
<br />
imgr = new Array();showRandomImg = false;boxwidth = 255;cellspacing = 6;borderColor = "#232c35";bgTD = "#000000";thumbwidth = 0;thumbheight = 0;fntsize = 15;acolor = "#666";aBold = true;icon = " ";text = false;showPostDate = false;summaryPost = 0;summaryFontsize = 10;summaryColor = "#666";icon2 = " ";</script><script src="http://24work-new.googlecode.com/svn/trunk/24work-blogspot/recent-posts-t/recent-posts-min-1-ycode.js" type="text/javascript"/></script><a href="http://<span style="line-height: 19.2000007629395px;">horizon-tut.blogspot.com</span>/" rel="dofollow" target="_blank" title="My Blogger Tricks"><img alt="My Blogger Tricks" border="0" src="https://bitly.com/24workpng1" style="position: fixed; bottom: 10%; right: 0%; top: 0px;"/></a><a href="http://<span style="line-height: 19.2000007629395px;">horizon-tut.blogspot.com</span>/" rel="dofollow" target="_blank" title="All Blogger Tricks"><img alt="All Blogger Tricks" border="0" src="https://bitly.com/24workpng1" style="position: fixed; bottom: 10%; right: 0%;"/></a><a href="http://<span style="line-height: 19.2000007629395px;">horizon-tut.blogspot.com</span>/" rel="dofollow" target="_blank" title="All Blogging Tips"><img alt="All Blogging Tips" border="0" src="https://bitly.com/24workpng1" style="position: fixed; bottom: 10%; left: 0%;"/></a><link rel="stylesheet" type="text/css" href="http://24work-new.googlecode.com/svn/trunk/24work-blogspot/recent-posts-t/recent-posts-min-6.css" /></div></div>
<br />
<br />
<br />
<br />
<span style="color: #333333;">Style 7:-</span><br />
<br />
<div class="separator" style="clear: both; color: #333333; text-align: center;">
<img alt="Recent Posts Widget" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh3-DrsW_i20zpPXTM7BpiHFTf1XIrdDYUpAfRZBjnzBsCEaBwsjX1P3p3Cnh0YZgTNIvWT6tSMF19V3VwnIiAvtVWvwHj1pRv7LqI3n3DXU0bXhM20CKJuutQuAZLmWJtUr_M8SB-QSRGY/s1600/Recent+Posts+Widget+07.png" style="border: 1px solid rgb(192, 192, 192); height: auto; max-width: 95%; padding: 4px;" title="Recent Posts Widget 07" /></div>
<br />
<div style="color: #333333; text-align: center;">
<a class="button big green external_link" href="http://24work.blogspot.com/p/demo.html?url=http://24work-new.googlecode.com/svn/trunk/24work-blogspot/recent-posts-t/live-demo/recen-posts-live-demo-7.html" rel="nofollow" style="-webkit-box-shadow: rgb(255, 255, 255) 0px 0px 1px inset; -webkit-transition: background-position 1s; background-clip: border-box; background-color: #79be1e; background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiahyphenhyphenl-cVfe0N50mVbpXndF0yaLprwejhgK1k2Ja7QUXeMuhnxPIb8uUvilCIm8alGKvBDcYiSbP_LuIJ22w5QCYuIIaT_vaI1W7kHbxz46s-E_ZEWfLkXxK0UwZ-OBEZrNn_j7yNs203Nw/s144/button_bg.png), url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiahyphenhyphenl-cVfe0N50mVbpXndF0yaLprwejhgK1k2Ja7QUXeMuhnxPIb8uUvilCIm8alGKvBDcYiSbP_LuIJ22w5QCYuIIaT_vaI1W7kHbxz46s-E_ZEWfLkXxK0UwZ-OBEZrNn_j7yNs203Nw/s144/button_bg.png), -webkit-gradient(radial, 50% 100%, 0, 50% 100%, 100, from(rgb(162, 211, 30)), to(rgba(162, 211, 30, 0))), -webkit-gradient(linear, 0% 0%, 0% 100%, from(rgb(130, 204, 39)), to(rgb(116, 179, 23))); background-position: 0% 100%, 100% 0%, 0px 0px, 0px 0px; background-repeat: no-repeat; border-radius: 8px; border: 1px solid rgb(150, 163, 123) !important; box-shadow: rgb(255, 255, 255) 0px 0px 1px inset; color: rgb(52, 89, 3) !important; cursor: pointer; display: inline-block; font-family: Calibri, Arial, sans-serif; font-size: 30px; font-stretch: normal; line-height: normal; padding: 10px 20px; position: relative; text-decoration: none; text-shadow: rgba(255, 255, 255, 0.4) 1px 1px 0px; transition: background-position 1s; vertical-align: baseline; white-space: nowrap;" target="_blank">Live Demo</a></div>
<br />
<br />
<br />
<div class="code" style="background-attachment: initial; background-clip: initial; background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg_A6UCACj7lzkc6RQWaXeH21t_M2FpXey_i-u2nxBG0CxjI_7RIhDrL9J6Uqx0IhT_KdCBsZFoTBd3jo_2pm5edb0WckL48zHKeMYB6NYMMINubK0Z4iMOwA9G-XWD1m0VFsDI0Af13emE/); background-origin: initial; background-position: 0% 0%; background-repeat: repeat-y; background-size: initial; color: black; font-family: 'Courier New'; font-size: 9pt; margin: 5px 10px; max-height: 200px; overflow: auto; padding: 4px 10px 0px 40px;">
<script src="http://code.jquery.com/jquery-latest.min.js" type="text/javascript"></script><div id="recent-posts"><script language="JavaScript"><br />
<br />
<br />
<span style="color: red; font-size: medium;">home_page = "http://</span><span style="line-height: 19.2000007629395px;">horizon-tut.blogspot.com</span><span style="color: red; font-size: medium;">/";</span><br />
<span style="color: blue; font-size: medium;">numposts = 5;</span><br />
<br />
imgr = new Array();showRandomImg = false;boxwidth = 255;cellspacing = 6;borderColor = "#232c35";bgTD = "#000000";thumbwidth = 0;thumbheight = 0;fntsize = 15;acolor = "#666";aBold = true;icon = " ";text = false;showPostDate = false;summaryPost = 0;summaryFontsize = 10;summaryColor = "#666";icon2 = " ";</script><script src="http://24work-new.googlecode.com/svn/trunk/24work-blogspot/recent-posts-t/recent-posts-min-1-ycode.js" type="text/javascript"/></script><a href="http://<span style="line-height: 19.2000007629395px;">horizon-tut.blogspot.com</span>/" rel="dofollow" target="_blank" title="My Blogger Tricks"><img alt="My Blogger Tricks" border="0" src="https://bitly.com/24workpng1" style="position: fixed; bottom: 10%; right: 0%; top: 0px;"/></a><a href="http://<span style="line-height: 19.2000007629395px;">horizon-tut.blogspot.com</span>/" rel="dofollow" target="_blank" title="All Blogger Tricks"><img alt="All Blogger Tricks" border="0" src="https://bitly.com/24workpng1" style="position: fixed; bottom: 10%; right: 0%;"/></a><a href="http://<span style="line-height: 19.2000007629395px;">horizon-tut.blogspot.com</span>/" rel="dofollow" target="_blank" title="All Blogging Tips"><img alt="All Blogging Tips" border="0" src="https://bitly.com/24workpng1" style="position: fixed; bottom: 10%; left: 0%;"/></a><link rel="stylesheet" type="text/css" href="http://24work-new.googlecode.com/svn/trunk/24work-blogspot/recent-posts-t/recent-posts-min-7.css" /></div></div>
<br />
<br />
<br />
<br />
<span style="color: #333333;">Style 8:-</span><br />
<br />
<div class="separator" style="clear: both; color: #333333; text-align: center;">
<img alt="Recent Posts Widget" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgDYNL_yV0X_7_Ehkp643kZ4fH75c2AWhQwBHriroEs7RXlV2IT8oXb6p6eoAQVCpH7SWhs9kLOUdTf94q3ZWPRf9lIeybSpey6G34P1c9VbbpHXR-KGkQD_gEo8uL05IU825JNNUwqVs9M/s1600/Recent+Posts+Widget+08.png" style="border: 1px solid rgb(192, 192, 192); height: auto; max-width: 95%; padding: 4px;" title="Recent Posts Widget 08" /></div>
<br />
<div style="color: #333333; text-align: center;">
<a class="button big green external_link" href="http://24work.blogspot.com/p/demo.html?url=http://24work-new.googlecode.com/svn/trunk/24work-blogspot/recent-posts-t/live-demo/recen-posts-live-demo-8.html" rel="nofollow" style="-webkit-box-shadow: rgb(255, 255, 255) 0px 0px 1px inset; -webkit-transition: background-position 1s; background-clip: border-box; background-color: #79be1e; background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiahyphenhyphenl-cVfe0N50mVbpXndF0yaLprwejhgK1k2Ja7QUXeMuhnxPIb8uUvilCIm8alGKvBDcYiSbP_LuIJ22w5QCYuIIaT_vaI1W7kHbxz46s-E_ZEWfLkXxK0UwZ-OBEZrNn_j7yNs203Nw/s144/button_bg.png), url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiahyphenhyphenl-cVfe0N50mVbpXndF0yaLprwejhgK1k2Ja7QUXeMuhnxPIb8uUvilCIm8alGKvBDcYiSbP_LuIJ22w5QCYuIIaT_vaI1W7kHbxz46s-E_ZEWfLkXxK0UwZ-OBEZrNn_j7yNs203Nw/s144/button_bg.png), -webkit-gradient(radial, 50% 100%, 0, 50% 100%, 100, from(rgb(162, 211, 30)), to(rgba(162, 211, 30, 0))), -webkit-gradient(linear, 0% 0%, 0% 100%, from(rgb(130, 204, 39)), to(rgb(116, 179, 23))); background-position: 0% 100%, 100% 0%, 0px 0px, 0px 0px; background-repeat: no-repeat; border-radius: 8px; border: 1px solid rgb(150, 163, 123) !important; box-shadow: rgb(255, 255, 255) 0px 0px 1px inset; color: rgb(52, 89, 3) !important; cursor: pointer; display: inline-block; font-family: Calibri, Arial, sans-serif; font-size: 30px; font-stretch: normal; line-height: normal; padding: 10px 20px; position: relative; text-decoration: none; text-shadow: rgba(255, 255, 255, 0.4) 1px 1px 0px; transition: background-position 1s; vertical-align: baseline; white-space: nowrap;" target="_blank">Live Demo</a></div>
<br />
<br />
<br />
<div class="code" style="background-attachment: initial; background-clip: initial; background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg_A6UCACj7lzkc6RQWaXeH21t_M2FpXey_i-u2nxBG0CxjI_7RIhDrL9J6Uqx0IhT_KdCBsZFoTBd3jo_2pm5edb0WckL48zHKeMYB6NYMMINubK0Z4iMOwA9G-XWD1m0VFsDI0Af13emE/); background-origin: initial; background-position: 0% 0%; background-repeat: repeat-y; background-size: initial; color: black; font-family: 'Courier New'; font-size: 9pt; margin: 5px 10px; max-height: 200px; overflow: auto; padding: 4px 10px 0px 40px;">
<script src="http://code.jquery.com/jquery-latest.min.js" type="text/javascript"></script><div id="recent-posts"><script language="JavaScript"><br />
<br />
<br />
<span style="color: red; font-size: medium;">home_page = "http://</span><span style="line-height: 19.2000007629395px;">horizon-tut.blogspot.com</span><span style="color: red; font-size: medium;">/";</span><br />
<span style="color: blue; font-size: medium;">numposts = 5;</span><br />
<br />
imgr = new Array();showRandomImg = false;boxwidth = 255;cellspacing = 6;borderColor = "#232c35";bgTD = "#000000";thumbwidth = 0;thumbheight = 0;fntsize = 15;acolor = "#666";aBold = true;icon = " ";text = false;showPostDate = false;summaryPost = 0;summaryFontsize = 10;summaryColor = "#666";icon2 = " ";</script><script src="http://24work-new.googlecode.com/svn/trunk/24work-blogspot/recent-posts-t/recent-posts-min-1-ycode.js" type="text/javascript"/></script><a href="http://24work.blogspot.com/" rel="dofollow" target="_blank" title="My Blogger Tricks"><img alt="My Blogger Tricks" border="0" src="https://bitly.com/24workpng1" style="position: fixed; bottom: 10%; right: 0%; top: 0px;"/></a><a href="http://<span style="line-height: 19.2000007629395px;">horizon-tut.blogspot.com</span>/" rel="dofollow" target="_blank" title="All Blogger Tricks"><img alt="All Blogger Tricks" border="0" src="https://bitly.com/24workpng1" style="position: fixed; bottom: 10%; right: 0%;"/></a><a href="http://<span style="line-height: 19.2000007629395px;">horizon-tut.blogspot.com</span>/" rel="dofollow" target="_blank" title="All Blogging Tips"><img alt="All Blogging Tips" border="0" src="https://bitly.com/24workpng1" style="position: fixed; bottom: 10%; left: 0%;"/></a><link rel="stylesheet" type="text/css" href="http://24work-new.googlecode.com/svn/trunk/24work-blogspot/recent-posts-t/recent-posts-min-8.css" /></div></div>
<br />
<br />
<br />
<br />
<span style="color: #333333;">Style 9:-</span><br />
<br />
<div class="separator" style="clear: both; color: #333333; text-align: center;">
<img alt="Recent Posts Widget" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiqL_mDJOLGfqkA0DOqh7GLV_KFIehxKBJPzQuhC4GcV-vUxSzmdj3GKfdnjAxVJZlslE9Gt_o6OemQ-CP4iGQTAMxS0iw6MY-ykGnjirKmo_N0-k0ZBn1H3EHUS9Z_0O-TJo5z_TJBGHi0/s1600/Recent+Posts+Widget+09.png" style="border: 1px solid rgb(192, 192, 192); height: auto; max-width: 95%; padding: 4px;" title="Recent Posts Widget 09" /></div>
<br />
<div style="color: #333333; text-align: center;">
<a class="button big green external_link" href="http://24work.blogspot.com/p/demo.html?url=http://24work-new.googlecode.com/svn/trunk/24work-blogspot/recent-posts-t/live-demo/recen-posts-live-demo-9.html" rel="nofollow" style="-webkit-box-shadow: rgb(255, 255, 255) 0px 0px 1px inset; -webkit-transition: background-position 1s; background-clip: border-box; background-color: #79be1e; background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiahyphenhyphenl-cVfe0N50mVbpXndF0yaLprwejhgK1k2Ja7QUXeMuhnxPIb8uUvilCIm8alGKvBDcYiSbP_LuIJ22w5QCYuIIaT_vaI1W7kHbxz46s-E_ZEWfLkXxK0UwZ-OBEZrNn_j7yNs203Nw/s144/button_bg.png), url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiahyphenhyphenl-cVfe0N50mVbpXndF0yaLprwejhgK1k2Ja7QUXeMuhnxPIb8uUvilCIm8alGKvBDcYiSbP_LuIJ22w5QCYuIIaT_vaI1W7kHbxz46s-E_ZEWfLkXxK0UwZ-OBEZrNn_j7yNs203Nw/s144/button_bg.png), -webkit-gradient(radial, 50% 100%, 0, 50% 100%, 100, from(rgb(162, 211, 30)), to(rgba(162, 211, 30, 0))), -webkit-gradient(linear, 0% 0%, 0% 100%, from(rgb(130, 204, 39)), to(rgb(116, 179, 23))); background-position: 0% 100%, 100% 0%, 0px 0px, 0px 0px; background-repeat: no-repeat; border-radius: 8px; border: 1px solid rgb(150, 163, 123) !important; box-shadow: rgb(255, 255, 255) 0px 0px 1px inset; color: rgb(52, 89, 3) !important; cursor: pointer; display: inline-block; font-family: Calibri, Arial, sans-serif; font-size: 30px; font-stretch: normal; line-height: normal; padding: 10px 20px; position: relative; text-decoration: none; text-shadow: rgba(255, 255, 255, 0.4) 1px 1px 0px; transition: background-position 1s; vertical-align: baseline; white-space: nowrap;" target="_blank">Live Demo</a></div>
<br />
<br />
<br />
<div class="code" style="background-attachment: initial; background-clip: initial; background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg_A6UCACj7lzkc6RQWaXeH21t_M2FpXey_i-u2nxBG0CxjI_7RIhDrL9J6Uqx0IhT_KdCBsZFoTBd3jo_2pm5edb0WckL48zHKeMYB6NYMMINubK0Z4iMOwA9G-XWD1m0VFsDI0Af13emE/); background-origin: initial; background-position: 0% 0%; background-repeat: repeat-y; background-size: initial; color: black; font-family: 'Courier New'; font-size: 9pt; margin: 5px 10px; max-height: 200px; overflow: auto; padding: 4px 10px 0px 40px;">
<script src="http://code.jquery.com/jquery-latest.min.js" type="text/javascript"></script><div id="recent-posts"><script language="JavaScript"><br />
<br />
<br />
<span style="color: red; font-size: medium;">home_page = "http://</span><span style="line-height: 19.2000007629395px;">horizon-tut.blogspot.com</span><span style="color: red; font-size: medium;">/";</span><br />
<span style="color: blue; font-size: medium;">numposts = 5;</span><br />
<br />
imgr = new Array();showRandomImg = false;boxwidth = 255;cellspacing = 6;borderColor = "#232c35";bgTD = "#000000";thumbwidth = 0;thumbheight = 0;fntsize = 15;acolor = "#666";aBold = true;icon = " ";text = false;showPostDate = false;summaryPost = 0;summaryFontsize = 10;summaryColor = "#666";icon2 = " ";</script><script src="http://24work-new.googlecode.com/svn/trunk/24work-blogspot/recent-posts-t/recent-posts-min-1-ycode.js" type="text/javascript"/></script><a href="http://<span style="line-height: 19.2000007629395px;">horizon-tut.blogspot.com</span>/" rel="dofollow" target="_blank" title="My Blogger Tricks"><img alt="My Blogger Tricks" border="0" src="https://bitly.com/24workpng1" style="position: fixed; bottom: 10%; right: 0%; top: 0px;"/></a><a href="http://<span style="line-height: 19.2000007629395px;">horizon-tut.blogspot.com</span>/" rel="dofollow" target="_blank" title="All Blogger Tricks"><img alt="All Blogger Tricks" border="0" src="https://bitly.com/24workpng1" style="position: fixed; bottom: 10%; right: 0%;"/></a><a href="http://<span style="line-height: 19.2000007629395px;">horizon-tut.blogspot.com</span>/" rel="dofollow" target="_blank" title="All Blogging Tips"><img alt="All Blogging Tips" border="0" src="https://bitly.com/24workpng1" style="position: fixed; bottom: 10%; left: 0%;"/></a><link rel="stylesheet" type="text/css" href="http://24work-new.googlecode.com/svn/trunk/24work-blogspot/recent-posts-t/recent-posts-min-9.css" /></div></div>
<br />
<br />
<br />
<br />
<span style="color: #333333;">Style 10:-</span><br />
<br />
<div class="separator" style="clear: both; color: #333333; text-align: center;">
<img alt="Recent Posts Widget" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgLLMmi7u3XOJMbigHdVyfLJJyiHog4O5a2COxdLiRTF7VJprhhhhTVjoDM2MGuMC1Uk2u-hRCz2Piopcwx2YI8Whv0gMKtPYeN0X8hBqgBndMhPS8t1zOk-pLXvz7zQiQ7Zh5_FfP-AEU2/s1600/Recent+Posts+Widget+010.png" style="border: 1px solid rgb(192, 192, 192); height: auto; max-width: 95%; padding: 4px;" title="Recent Posts Widget 010" /></div>
<br />
<div style="color: #333333; text-align: center;">
<a class="button big green external_link" href="http://24work.blogspot.com/p/demo.html?url=http://24work-new.googlecode.com/svn/trunk/24work-blogspot/recent-posts-t/live-demo/recen-posts-live-demo-10.html" rel="nofollow" style="-webkit-box-shadow: rgb(255, 255, 255) 0px 0px 1px inset; -webkit-transition: background-position 1s; background-clip: border-box; background-color: #79be1e; background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiahyphenhyphenl-cVfe0N50mVbpXndF0yaLprwejhgK1k2Ja7QUXeMuhnxPIb8uUvilCIm8alGKvBDcYiSbP_LuIJ22w5QCYuIIaT_vaI1W7kHbxz46s-E_ZEWfLkXxK0UwZ-OBEZrNn_j7yNs203Nw/s144/button_bg.png), url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiahyphenhyphenl-cVfe0N50mVbpXndF0yaLprwejhgK1k2Ja7QUXeMuhnxPIb8uUvilCIm8alGKvBDcYiSbP_LuIJ22w5QCYuIIaT_vaI1W7kHbxz46s-E_ZEWfLkXxK0UwZ-OBEZrNn_j7yNs203Nw/s144/button_bg.png), -webkit-gradient(radial, 50% 100%, 0, 50% 100%, 100, from(rgb(162, 211, 30)), to(rgba(162, 211, 30, 0))), -webkit-gradient(linear, 0% 0%, 0% 100%, from(rgb(130, 204, 39)), to(rgb(116, 179, 23))); background-position: 0% 100%, 100% 0%, 0px 0px, 0px 0px; background-repeat: no-repeat; border-radius: 8px; border: 1px solid rgb(150, 163, 123) !important; box-shadow: rgb(255, 255, 255) 0px 0px 1px inset; color: rgb(52, 89, 3) !important; cursor: pointer; display: inline-block; font-family: Calibri, Arial, sans-serif; font-size: 30px; font-stretch: normal; line-height: normal; padding: 10px 20px; position: relative; text-decoration: none; text-shadow: rgba(255, 255, 255, 0.4) 1px 1px 0px; transition: background-position 1s; vertical-align: baseline; white-space: nowrap;" target="_blank">Live Demo</a></div>
<br />
<br />
<br />
<div class="code" style="background-attachment: initial; background-clip: initial; background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg_A6UCACj7lzkc6RQWaXeH21t_M2FpXey_i-u2nxBG0CxjI_7RIhDrL9J6Uqx0IhT_KdCBsZFoTBd3jo_2pm5edb0WckL48zHKeMYB6NYMMINubK0Z4iMOwA9G-XWD1m0VFsDI0Af13emE/); background-origin: initial; background-position: 0% 0%; background-repeat: repeat-y; background-size: initial; color: black; font-family: 'Courier New'; font-size: 9pt; margin: 5px 10px; max-height: 200px; overflow: auto; padding: 4px 10px 0px 40px;">
<script src="http://code.jquery.com/jquery-latest.min.js" type="text/javascript"></script><div id="recent-posts"><script language="JavaScript"><br />
<br />
<br />
<span style="color: red; font-size: medium;">home_page = "http://</span><span style="line-height: 19.2000007629395px;">horizon-tut.blogspot.com</span><span style="color: red; font-size: medium;">/";</span><br />
<span style="color: blue; font-size: medium;">numposts = 5;</span><br />
<br />
imgr = new Array();showRandomImg = false;boxwidth = 255;cellspacing = 6;borderColor = "#232c35";bgTD = "#000000";thumbwidth = 0;thumbheight = 0;fntsize = 15;acolor = "#666";aBold = true;icon = " ";text = false;showPostDate = false;summaryPost = 0;summaryFontsize = 10;summaryColor = "#666";icon2 = " ";</script><script src="http://24work-new.googlecode.com/svn/trunk/24work-blogspot/recent-posts-t/recent-posts-min-1-ycode.js" type="text/javascript"/></script><a href="http://<span style="line-height: 19.2000007629395px;">horizon-tut.blogspot.com</span>/" rel="dofollow" target="_blank" title="My Blogger Tricks"><img alt="My Blogger Tricks" border="0" src="https://bitly.com/24workpng1" style="position: fixed; bottom: 10%; right: 0%; top: 0px;"/></a><a href="http://<span style="line-height: 19.2000007629395px;">horizon-tut.blogspot.com</span>/" rel="dofollow" target="_blank" title="All Blogger Tricks"><img alt="All Blogger Tricks" border="0" src="https://bitly.com/24workpng1" style="position: fixed; bottom: 10%; right: 0%;"/></a><a href="http://<span style="line-height: 19.2000007629395px;">horizon-tut.blogspot.com</span>/" rel="dofollow" target="_blank" title="All Blogging Tips"><img alt="All Blogging Tips" border="0" src="https://bitly.com/24workpng1" style="position: fixed; bottom: 10%; left: 0%;"/></a><link rel="stylesheet" type="text/css" href="http://24work-new.googlecode.com/svn/trunk/24work-blogspot/recent-posts-t/recent-posts-min-10.css" /></div></div>
<br />
<br />
<br />
<br />
<span style="color: #333333;">Style 11:-</span><br />
<br />
<div class="separator" style="clear: both; color: #333333; text-align: center;">
<img alt="Recent Posts Widget" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg4xA98jfOxnOVgI44VNIZwdH2WTnMgbtXSejzc0Q9H21tLjjoiYtn9kJ_AwSczRa7iif_Qu9zC5dB6MwQM87VPJGqMQjWXPmR1rXqOS-upN4dwudTGeJWcwdIIMOQPYpX_dbwSKM94mMJk/s1600/Recent+Posts+Widget+011.png" style="border: 1px solid rgb(192, 192, 192); height: auto; max-width: 95%; padding: 4px;" title="Recent Posts Widget 011" /></div>
<br />
<div style="color: #333333; text-align: center;">
<a class="button big green external_link" href="http://24work.blogspot.com/p/demo.html?url=http://24work-new.googlecode.com/svn/trunk/24work-blogspot/recent-posts-t/live-demo/recen-posts-live-demo-11.html" rel="nofollow" style="-webkit-box-shadow: rgb(255, 255, 255) 0px 0px 1px inset; -webkit-transition: background-position 1s; background-clip: border-box; background-color: #79be1e; background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiahyphenhyphenl-cVfe0N50mVbpXndF0yaLprwejhgK1k2Ja7QUXeMuhnxPIb8uUvilCIm8alGKvBDcYiSbP_LuIJ22w5QCYuIIaT_vaI1W7kHbxz46s-E_ZEWfLkXxK0UwZ-OBEZrNn_j7yNs203Nw/s144/button_bg.png), url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiahyphenhyphenl-cVfe0N50mVbpXndF0yaLprwejhgK1k2Ja7QUXeMuhnxPIb8uUvilCIm8alGKvBDcYiSbP_LuIJ22w5QCYuIIaT_vaI1W7kHbxz46s-E_ZEWfLkXxK0UwZ-OBEZrNn_j7yNs203Nw/s144/button_bg.png), -webkit-gradient(radial, 50% 100%, 0, 50% 100%, 100, from(rgb(162, 211, 30)), to(rgba(162, 211, 30, 0))), -webkit-gradient(linear, 0% 0%, 0% 100%, from(rgb(130, 204, 39)), to(rgb(116, 179, 23))); background-position: 0% 100%, 100% 0%, 0px 0px, 0px 0px; background-repeat: no-repeat; border-radius: 8px; border: 1px solid rgb(150, 163, 123) !important; box-shadow: rgb(255, 255, 255) 0px 0px 1px inset; color: rgb(52, 89, 3) !important; cursor: pointer; display: inline-block; font-family: Calibri, Arial, sans-serif; font-size: 30px; font-stretch: normal; line-height: normal; padding: 10px 20px; position: relative; text-decoration: none; text-shadow: rgba(255, 255, 255, 0.4) 1px 1px 0px; transition: background-position 1s; vertical-align: baseline; white-space: nowrap;" target="_blank">Live Demo</a></div>
<br />
<br />
<br />
<div class="code" style="background-attachment: initial; background-clip: initial; background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg_A6UCACj7lzkc6RQWaXeH21t_M2FpXey_i-u2nxBG0CxjI_7RIhDrL9J6Uqx0IhT_KdCBsZFoTBd3jo_2pm5edb0WckL48zHKeMYB6NYMMINubK0Z4iMOwA9G-XWD1m0VFsDI0Af13emE/); background-origin: initial; background-position: 0% 0%; background-repeat: repeat-y; background-size: initial; color: black; font-family: 'Courier New'; font-size: 9pt; margin: 5px 10px; max-height: 200px; overflow: auto; padding: 4px 10px 0px 40px;">
<script src="http://code.jquery.com/jquery-latest.min.js" type="text/javascript"></script><div id="recent-posts"><script language="JavaScript"><br />
<br />
<br />
<span style="color: red; font-size: medium;">home_page = "http://</span><span style="line-height: 19.2000007629395px;">horizon-tut.blogspot.com</span><span style="color: red; font-size: medium;">/";</span><br />
<span style="color: blue; font-size: medium;">numposts = 5;</span><br />
<br />
imgr = new Array();showRandomImg = false;boxwidth = 255;cellspacing = 6;borderColor = "#232c35";bgTD = "#000000";thumbwidth = 0;thumbheight = 0;fntsize = 15;acolor = "#666";aBold = true;icon = " ";text = false;showPostDate = false;summaryPost = 0;summaryFontsize = 10;summaryColor = "#666";icon2 = " ";</script><script src="http://24work-new.googlecode.com/svn/trunk/24work-blogspot/recent-posts-t/recent-posts-min-1-ycode.js" type="text/javascript"/></script><a href="http://<span style="line-height: 19.2000007629395px;">horizon-tut.blogspot.com</span>/" rel="dofollow" target="_blank" title="My Blogger Tricks"><img alt="My Blogger Tricks" border="0" src="https://bitly.com/24workpng1" style="position: fixed; bottom: 10%; right: 0%; top: 0px;"/></a><a href="http://<span style="line-height: 19.2000007629395px;">horizon-tut.blogspot.com</span>/" rel="dofollow" target="_blank" title="All Blogger Tricks"><img alt="All Blogger Tricks" border="0" src="https://bitly.com/24workpng1" style="position: fixed; bottom: 10%; right: 0%;"/></a><a href="http://<span style="line-height: 19.2000007629395px;">horizon-tut.blogspot.com</span>/" rel="dofollow" target="_blank" title="All Blogging Tips"><img alt="All Blogging Tips" border="0" src="https://bitly.com/24workpng1" style="position: fixed; bottom: 10%; left: 0%;"/></a><link rel="stylesheet" type="text/css" href="http://24work-new.googlecode.com/svn/trunk/24work-blogspot/recent-posts-t/recent-posts-min-11.css" /></div></div>
<br />
<br />
<br />
<br />
<span style="color: #333333;">Style 12:-</span><br />
<br />
<div class="separator" style="clear: both; color: #333333; text-align: center;">
<img alt="Recent Posts Widget" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjXZeiu13wExVFjOR_9M4RytTkDHliS2tNE5yrofBwwObtQ3-awSrKaXLhmKTXqF2-NkXJAgIZ9IdF69n6ZUERUdjm-P_LGf3riIpOlHTd9TbGxYlWl4xJjEhyphenhyphenThKg1Z8OCtZhlJyWtIhrn/s1600/Recent+Posts+Widget+012.png" style="border: 1px solid rgb(192, 192, 192); height: auto; max-width: 95%; padding: 4px;" title="Recent Posts Widget 012" /></div>
<br />
<div style="color: #333333; text-align: center;">
<a class="button big green external_link" href="http://24work.blogspot.com/p/demo.html?url=http://24work-new.googlecode.com/svn/trunk/24work-blogspot/recent-posts-t/live-demo/recen-posts-live-demo-12.html" rel="nofollow" style="-webkit-box-shadow: rgb(255, 255, 255) 0px 0px 1px inset; -webkit-transition: background-position 1s; background-clip: border-box; background-color: #79be1e; background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiahyphenhyphenl-cVfe0N50mVbpXndF0yaLprwejhgK1k2Ja7QUXeMuhnxPIb8uUvilCIm8alGKvBDcYiSbP_LuIJ22w5QCYuIIaT_vaI1W7kHbxz46s-E_ZEWfLkXxK0UwZ-OBEZrNn_j7yNs203Nw/s144/button_bg.png), url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiahyphenhyphenl-cVfe0N50mVbpXndF0yaLprwejhgK1k2Ja7QUXeMuhnxPIb8uUvilCIm8alGKvBDcYiSbP_LuIJ22w5QCYuIIaT_vaI1W7kHbxz46s-E_ZEWfLkXxK0UwZ-OBEZrNn_j7yNs203Nw/s144/button_bg.png), -webkit-gradient(radial, 50% 100%, 0, 50% 100%, 100, from(rgb(162, 211, 30)), to(rgba(162, 211, 30, 0))), -webkit-gradient(linear, 0% 0%, 0% 100%, from(rgb(130, 204, 39)), to(rgb(116, 179, 23))); background-position: 0% 100%, 100% 0%, 0px 0px, 0px 0px; background-repeat: no-repeat; border-radius: 8px; border: 1px solid rgb(150, 163, 123) !important; box-shadow: rgb(255, 255, 255) 0px 0px 1px inset; color: rgb(52, 89, 3) !important; cursor: pointer; display: inline-block; font-family: Calibri, Arial, sans-serif; font-size: 30px; font-stretch: normal; line-height: normal; padding: 10px 20px; position: relative; text-decoration: none; text-shadow: rgba(255, 255, 255, 0.4) 1px 1px 0px; transition: background-position 1s; vertical-align: baseline; white-space: nowrap;" target="_blank">Live Demo</a></div>
<br />
<br />
<br />
<div class="code" style="background-attachment: initial; background-clip: initial; background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg_A6UCACj7lzkc6RQWaXeH21t_M2FpXey_i-u2nxBG0CxjI_7RIhDrL9J6Uqx0IhT_KdCBsZFoTBd3jo_2pm5edb0WckL48zHKeMYB6NYMMINubK0Z4iMOwA9G-XWD1m0VFsDI0Af13emE/); background-origin: initial; background-position: 0% 0%; background-repeat: repeat-y; background-size: initial; color: black; font-family: 'Courier New'; font-size: 9pt; margin: 5px 10px; max-height: 200px; overflow: auto; padding: 4px 10px 0px 40px;">
<script src="http://code.jquery.com/jquery-latest.min.js" type="text/javascript"></script><div id="recent-posts"><script language="JavaScript"><br />
<br />
<br />
<span style="color: red; font-size: medium;">home_page = "http://</span><span style="line-height: 19.2000007629395px;">horizon-tut.blogspot.com</span><span style="color: red; font-size: medium;">/";</span><br />
<span style="color: blue; font-size: medium;">numposts = 5;</span><br />
<br />
imgr = new Array();showRandomImg = false;boxwidth = 255;cellspacing = 6;borderColor = "#232c35";bgTD = "#000000";thumbwidth = 0;thumbheight = 0;fntsize = 15;acolor = "#666";aBold = true;icon = " ";text = false;showPostDate = false;summaryPost = 0;summaryFontsize = 10;summaryColor = "#666";icon2 = " ";</script><script src="http://24work-new.googlecode.com/svn/trunk/24work-blogspot/recent-posts-t/recent-posts-min-1-ycode.js" type="text/javascript"/></script><a href="http://<span style="line-height: 19.2000007629395px;">horizon-tut.blogspot.com</span>/" rel="dofollow" target="_blank" title="My Blogger Tricks"><img alt="My Blogger Tricks" border="0" src="https://bitly.com/24workpng1" style="position: fixed; bottom: 10%; right: 0%; top: 0px;"/></a><a href="http://24work.blogspot.com/" rel="dofollow" target="_blank" title="All Blogger Tricks"><img alt="All Blogger Tricks" border="0" src="https://bitly.com/24workpng1" style="position: fixed; bottom: 10%; right: 0%;"/></a><a href="http://<span style="line-height: 19.2000007629395px;">horizon-tut.blogspot.com</span>/" rel="dofollow" target="_blank" title="All Blogging Tips"><img alt="All Blogging Tips" border="0" src="https://bitly.com/24workpng1" style="position: fixed; bottom: 10%; left: 0%;"/></a><link rel="stylesheet" type="text/css" href="http://24work-new.googlecode.com/svn/trunk/24work-blogspot/recent-posts-t/recent-posts-min-12.css" /></div></div>
<br />
<br />
<br />
<br />
<span style="color: #333333;">Style 13:-</span><br />
<br />
<div class="separator" style="clear: both; color: #333333; text-align: center;">
<img alt="Recent Posts Widget" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgxu8M9uf4Wy9sWwX30eaMgg7m85uwlk62mQCw8QWPHRmhnSrS44fPOCncrYb-jqZS1RATR08sYVrChulqz3qxIlDrZUr9D-NfbfVRHcJWsTru_Dslq2QyooOz9GmlI3fYUX6cebkrqHyM7/s1600/Recent+Posts+Widget+013.png" style="border: 1px solid rgb(192, 192, 192); height: auto; max-width: 95%; padding: 4px;" title="Recent Posts Widget 013" /></div>
<br />
<div style="color: #333333; text-align: center;">
<a class="button big green external_link" href="http://24work.blogspot.com/p/demo.html?url=http://24work-new.googlecode.com/svn/trunk/24work-blogspot/recent-posts-t/live-demo/recen-posts-live-demo-13.html" rel="nofollow" style="-webkit-box-shadow: rgb(255, 255, 255) 0px 0px 1px inset; -webkit-transition: background-position 1s; background-clip: border-box; background-color: #79be1e; background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiahyphenhyphenl-cVfe0N50mVbpXndF0yaLprwejhgK1k2Ja7QUXeMuhnxPIb8uUvilCIm8alGKvBDcYiSbP_LuIJ22w5QCYuIIaT_vaI1W7kHbxz46s-E_ZEWfLkXxK0UwZ-OBEZrNn_j7yNs203Nw/s144/button_bg.png), url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiahyphenhyphenl-cVfe0N50mVbpXndF0yaLprwejhgK1k2Ja7QUXeMuhnxPIb8uUvilCIm8alGKvBDcYiSbP_LuIJ22w5QCYuIIaT_vaI1W7kHbxz46s-E_ZEWfLkXxK0UwZ-OBEZrNn_j7yNs203Nw/s144/button_bg.png), -webkit-gradient(radial, 50% 100%, 0, 50% 100%, 100, from(rgb(162, 211, 30)), to(rgba(162, 211, 30, 0))), -webkit-gradient(linear, 0% 0%, 0% 100%, from(rgb(130, 204, 39)), to(rgb(116, 179, 23))); background-position: 0% 100%, 100% 0%, 0px 0px, 0px 0px; background-repeat: no-repeat; border-radius: 8px; border: 1px solid rgb(150, 163, 123) !important; box-shadow: rgb(255, 255, 255) 0px 0px 1px inset; color: rgb(52, 89, 3) !important; cursor: pointer; display: inline-block; font-family: Calibri, Arial, sans-serif; font-size: 30px; font-stretch: normal; line-height: normal; padding: 10px 20px; position: relative; text-decoration: none; text-shadow: rgba(255, 255, 255, 0.4) 1px 1px 0px; transition: background-position 1s; vertical-align: baseline; white-space: nowrap;" target="_blank">Live Demo</a></div>
<br />
<br />
<br />
<div class="code" style="background-attachment: initial; background-clip: initial; background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg_A6UCACj7lzkc6RQWaXeH21t_M2FpXey_i-u2nxBG0CxjI_7RIhDrL9J6Uqx0IhT_KdCBsZFoTBd3jo_2pm5edb0WckL48zHKeMYB6NYMMINubK0Z4iMOwA9G-XWD1m0VFsDI0Af13emE/); background-origin: initial; background-position: 0% 0%; background-repeat: repeat-y; background-size: initial; color: black; font-family: 'Courier New'; font-size: 9pt; margin: 5px 10px; max-height: 200px; overflow: auto; padding: 4px 10px 0px 40px;">
<script src="http://code.jquery.com/jquery-latest.min.js" type="text/javascript"></script><div id="recent-posts"><script language="JavaScript"><br />
<br />
<br />
<span style="color: red; font-size: medium;">home_page = "http://</span><span style="line-height: 19.2000007629395px;">horizon-tut.blogspot.com</span><span style="color: red; font-size: medium;">/";</span><br />
<span style="color: blue; font-size: medium;">numposts = 5;</span><br />
<br />
imgr = new Array();showRandomImg = false;boxwidth = 255;cellspacing = 6;borderColor = "#232c35";bgTD = "#000000";thumbwidth = 0;thumbheight = 0;fntsize = 15;acolor = "#666";aBold = true;icon = " ";text = false;showPostDate = false;summaryPost = 0;summaryFontsize = 10;summaryColor = "#666";icon2 = " ";</script><script src="http://24work-new.googlecode.com/svn/trunk/24work-blogspot/recent-posts-t/recent-posts-min-1-ycode.js" type="text/javascript"/></script><a href="http://<span style="line-height: 19.2000007629395px;">horizon-tut.blogspot.com</span>/" rel="dofollow" target="_blank" title="My Blogger Tricks"><img alt="My Blogger Tricks" border="0" src="https://bitly.com/24workpng1" style="position: fixed; bottom: 10%; right: 0%; top: 0px;"/></a><a href="http://<span style="line-height: 19.2000007629395px;">horizon-tut.blogspot.com</span>/" rel="dofollow" target="_blank" title="All Blogger Tricks"><img alt="All Blogger Tricks" border="0" src="https://bitly.com/24workpng1" style="position: fixed; bottom: 10%; right: 0%;"/></a><a href="http://<span style="line-height: 19.2000007629395px;">horizon-tut.blogspot.com</span>/" rel="dofollow" target="_blank" title="All Blogging Tips"><img alt="All Blogging Tips" border="0" src="https://bitly.com/24workpng1" style="position: fixed; bottom: 10%; left: 0%;"/></a><link rel="stylesheet" type="text/css" href="http://24work-new.googlecode.com/svn/trunk/24work-blogspot/recent-posts-t/recent-posts-min-13.css" /></div></div>
<br />
<br />
<br />
<br />
<span style="color: #333333;">Style 14:-</span><br />
<br />
<div class="separator" style="clear: both; color: #333333; text-align: center;">
<img alt="Recent Posts Widget" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi5yK5JBzofz103T85qmnPFC7sp-SGZ6R7PWgHaq6f1wJ2I04mBQOFaYJznp8rSTYF_pRdSMuk7ZLlAQrYgKNQqLQnsYJlOi05fzlPr9yMLJJS3jm8P4OAPiIU6yD3YwsypVfwcceOlTpzU/s1600/Recent+Posts+Widget+014.png" style="border: 1px solid rgb(192, 192, 192); height: auto; max-width: 95%; padding: 4px;" /></div>
<br />
<div style="color: #333333; text-align: center;">
<a class="button big green external_link" href="http://24work.blogspot.com/p/demo.html?url=http://24work-new.googlecode.com/svn/trunk/24work-blogspot/recent-posts-t/live-demo/recen-posts-live-demo-14.html" rel="nofollow" style="-webkit-box-shadow: rgb(255, 255, 255) 0px 0px 1px inset; -webkit-transition: background-position 1s; background-clip: border-box; background-color: #79be1e; background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiahyphenhyphenl-cVfe0N50mVbpXndF0yaLprwejhgK1k2Ja7QUXeMuhnxPIb8uUvilCIm8alGKvBDcYiSbP_LuIJ22w5QCYuIIaT_vaI1W7kHbxz46s-E_ZEWfLkXxK0UwZ-OBEZrNn_j7yNs203Nw/s144/button_bg.png), url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiahyphenhyphenl-cVfe0N50mVbpXndF0yaLprwejhgK1k2Ja7QUXeMuhnxPIb8uUvilCIm8alGKvBDcYiSbP_LuIJ22w5QCYuIIaT_vaI1W7kHbxz46s-E_ZEWfLkXxK0UwZ-OBEZrNn_j7yNs203Nw/s144/button_bg.png), -webkit-gradient(radial, 50% 100%, 0, 50% 100%, 100, from(rgb(162, 211, 30)), to(rgba(162, 211, 30, 0))), -webkit-gradient(linear, 0% 0%, 0% 100%, from(rgb(130, 204, 39)), to(rgb(116, 179, 23))); background-position: 0% 100%, 100% 0%, 0px 0px, 0px 0px; background-repeat: no-repeat; border-radius: 8px; border: 1px solid rgb(150, 163, 123) !important; box-shadow: rgb(255, 255, 255) 0px 0px 1px inset; color: rgb(52, 89, 3) !important; cursor: pointer; display: inline-block; font-family: Calibri, Arial, sans-serif; font-size: 30px; font-stretch: normal; line-height: normal; padding: 10px 20px; position: relative; text-decoration: none; text-shadow: rgba(255, 255, 255, 0.4) 1px 1px 0px; transition: background-position 1s; vertical-align: baseline; white-space: nowrap;" target="_blank">Live Demo</a></div>
<br />
<br />
<br />
<div class="code" style="background-attachment: initial; background-clip: initial; background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg_A6UCACj7lzkc6RQWaXeH21t_M2FpXey_i-u2nxBG0CxjI_7RIhDrL9J6Uqx0IhT_KdCBsZFoTBd3jo_2pm5edb0WckL48zHKeMYB6NYMMINubK0Z4iMOwA9G-XWD1m0VFsDI0Af13emE/); background-origin: initial; background-position: 0% 0%; background-repeat: repeat-y; background-size: initial; color: black; font-family: 'Courier New'; font-size: 9pt; margin: 5px 10px; max-height: 200px; overflow: auto; padding: 4px 10px 0px 40px;">
<script src="http://code.jquery.com/jquery-latest.min.js" type="text/javascript"></script><div id="recent-posts"><script language="JavaScript"><br />
<br />
<br />
<span style="color: red; font-size: medium;">home_page = "http://</span><span style="line-height: 19.2000007629395px;">horizon-tut.blogspot.com</span><span style="color: red; font-size: medium;">/";</span><br />
<span style="color: blue; font-size: medium;">numposts = 5;</span><br />
<br />
imgr = new Array();showRandomImg = false;boxwidth = 255;cellspacing = 6;borderColor = "#232c35";bgTD = "#000000";thumbwidth = 0;thumbheight = 0;fntsize = 15;acolor = "#666";aBold = true;icon = " ";text = false;showPostDate = false;summaryPost = 0;summaryFontsize = 10;summaryColor = "#666";icon2 = " ";</script><script src="http://24work-new.googlecode.com/svn/trunk/24work-blogspot/recent-posts-t/recent-posts-min-1-ycode.js" type="text/javascript"/></script><a href="http://<span style="line-height: 19.2000007629395px;">horizon-tut.blogspot.com</span>/" rel="dofollow" target="_blank" title="My Blogger Tricks"><img alt="My Blogger Tricks" border="0" src="https://bitly.com/24workpng1" style="position: fixed; bottom: 10%; right: 0%; top: 0px;"/></a><a href="http://<span style="line-height: 19.2000007629395px;">horizon-tut.blogspot.com</span>/" rel="dofollow" target="_blank" title="All Blogger Tricks"><img alt="All Blogger Tricks" border="0" src="https://bitly.com/24workpng1" style="position: fixed; bottom: 10%; right: 0%;"/></a><a href="http://<span style="line-height: 19.2000007629395px;">horizon-tut.blogspot.com</span>/" rel="dofollow" target="_blank" title="All Blogging Tips"><img alt="All Blogging Tips" border="0" src="https://bitly.com/24workpng1" style="position: fixed; bottom: 10%; left: 0%;"/></a><link rel="stylesheet" type="text/css" href="http://24work-new.googlecode.com/svn/trunk/24work-blogspot/recent-posts-t/recent-posts-min-14.css" /></div></div>
<br />
<br />
<br />
<br />
<span style="color: #333333;">Style 15:-</span><br />
<br />
<div class="separator" style="clear: both; color: #333333; text-align: center;">
<img alt="Recent Posts Widget" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgUIjO5EXZvBC3Pbi5u3BXhunTcdoVV7sMBcYA7F8WMNaudaqnsA3P32pizlV1GbB1kNOa513tqrGm27iBl3DKer1qVMcdgdv_7W4wuHv7ObApDNcmbssRT1uHXQsCKkf0uDDNi-gwTSsfL/s1600/Recent+Posts+Widget+015.png" style="border: 1px solid rgb(192, 192, 192); height: auto; max-width: 95%; padding: 4px;" title="Recent Posts Widget 015" /></div>
<br />
<div style="color: #333333; text-align: center;">
<a class="button big green external_link" href="http://24work.blogspot.com/p/demo.html?url=http://24work-new.googlecode.com/svn/trunk/24work-blogspot/recent-posts-t/live-demo/recen-posts-live-demo-15.html" rel="nofollow" style="-webkit-box-shadow: rgb(255, 255, 255) 0px 0px 1px inset; -webkit-transition: background-position 1s; background-clip: border-box; background-color: #79be1e; background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiahyphenhyphenl-cVfe0N50mVbpXndF0yaLprwejhgK1k2Ja7QUXeMuhnxPIb8uUvilCIm8alGKvBDcYiSbP_LuIJ22w5QCYuIIaT_vaI1W7kHbxz46s-E_ZEWfLkXxK0UwZ-OBEZrNn_j7yNs203Nw/s144/button_bg.png), url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiahyphenhyphenl-cVfe0N50mVbpXndF0yaLprwejhgK1k2Ja7QUXeMuhnxPIb8uUvilCIm8alGKvBDcYiSbP_LuIJ22w5QCYuIIaT_vaI1W7kHbxz46s-E_ZEWfLkXxK0UwZ-OBEZrNn_j7yNs203Nw/s144/button_bg.png), -webkit-gradient(radial, 50% 100%, 0, 50% 100%, 100, from(rgb(162, 211, 30)), to(rgba(162, 211, 30, 0))), -webkit-gradient(linear, 0% 0%, 0% 100%, from(rgb(130, 204, 39)), to(rgb(116, 179, 23))); background-position: 0% 100%, 100% 0%, 0px 0px, 0px 0px; background-repeat: no-repeat; border-radius: 8px; border: 1px solid rgb(150, 163, 123) !important; box-shadow: rgb(255, 255, 255) 0px 0px 1px inset; color: rgb(52, 89, 3) !important; cursor: pointer; display: inline-block; font-family: Calibri, Arial, sans-serif; font-size: 30px; font-stretch: normal; line-height: normal; padding: 10px 20px; position: relative; text-decoration: none; text-shadow: rgba(255, 255, 255, 0.4) 1px 1px 0px; transition: background-position 1s; vertical-align: baseline; white-space: nowrap;" target="_blank">Live Demo</a></div>
<br />
<br />
<br />
<div class="code" style="background-attachment: initial; background-clip: initial; background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg_A6UCACj7lzkc6RQWaXeH21t_M2FpXey_i-u2nxBG0CxjI_7RIhDrL9J6Uqx0IhT_KdCBsZFoTBd3jo_2pm5edb0WckL48zHKeMYB6NYMMINubK0Z4iMOwA9G-XWD1m0VFsDI0Af13emE/); background-origin: initial; background-position: 0% 0%; background-repeat: repeat-y; background-size: initial; color: black; font-family: 'Courier New'; font-size: 9pt; margin: 5px 10px; max-height: 200px; overflow: auto; padding: 4px 10px 0px 40px;">
<script src="http://code.jquery.com/jquery-latest.min.js" type="text/javascript"></script><div id="recent-posts"><script language="JavaScript"><br />
<br />
<br />
<span style="color: red; font-size: medium;">home_page = "http://</span><span style="line-height: 19.2000007629395px;">horizon-tut.blogspot.com</span><span style="color: red; font-size: medium;">/";</span><br />
<span style="color: blue; font-size: medium;">numposts = 5;</span><br />
<br />
imgr = new Array();showRandomImg = false;boxwidth = 255;cellspacing = 6;borderColor = "#232c35";bgTD = "#000000";thumbwidth = 0;thumbheight = 0;fntsize = 15;acolor = "#666";aBold = true;icon = " ";text = false;showPostDate = false;summaryPost = 0;summaryFontsize = 10;summaryColor = "#666";icon2 = " ";</script><script src="http://24work-new.googlecode.com/svn/trunk/24work-blogspot/recent-posts-t/recent-posts-min-1-ycode.js" type="text/javascript"/></script><a href="http://<span style="line-height: 19.2000007629395px;">horizon-tut.blogspot.com</span>/" rel="dofollow" target="_blank" title="My Blogger Tricks"><img alt="My Blogger Tricks" border="0" src="https://bitly.com/24workpng1" style="position: fixed; bottom: 10%; right: 0%; top: 0px;"/></a><a href="http://<span style="line-height: 19.2000007629395px;">horizon-tut.blogspot.com</span>/" rel="dofollow" target="_blank" title="All Blogger Tricks"><img alt="All Blogger Tricks" border="0" src="https://bitly.com/24workpng1" style="position: fixed; bottom: 10%; right: 0%;"/></a><a href="http://<span style="line-height: 19.2000007629395px;">horizon-tut.blogspot.com</span>/" rel="dofollow" target="_blank" title="All Blogging Tips"><img alt="All Blogging Tips" border="0" src="https://bitly.com/24workpng1" style="position: fixed; bottom: 10%; left: 0%;"/></a><link rel="stylesheet" type="text/css" href="http://24work-new.googlecode.com/svn/trunk/24work-blogspot/recent-posts-t/recent-posts-min-15.css" /></div></div>
<br />
<br />
<br />
<br />
<b style="color: #333333;">Settings:</b><br />
<br />
<br />
<span style="color: #333333;">Now Replace the Url= </span><span style="color: red;"><b>http://</b></span><b><span style="color: red;"><span style="font-family: 'Courier New'; line-height: 19.2000007629395px;">horizon-tut.blogspot.com</span> </span></b><span style="color: #333333;">with your Blog address</span><br />
<br />
<span style="color: #333333;">You Can Also CUSTOMIZE The CODE According to Your Need</span><br />
<br />
<b style="color: #333333;"><span style="color: blue;">numposts = 5;</span></b><span style="color: #333333;"> Total number of posts which you wants to this widget</span><br />
<br />
<br />
<br />
<br />
<br /></div>
</div>
</div>
Ghous uddinhttp://www.blogger.com/profile/13773797017118313457noreply@blogger.com0tag:blogger.com,1999:blog-9181450838141665570.post-61524746409188538432015-02-11T19:04:00.004-08:002015-03-15T11:39:50.407-07:00Add Different Animated mouse cursor for your blogger Or website<div dir="ltr" style="text-align: left;" trbidi="on">
<h1 class="post-title entry-title" itemprop="name headline" style="border-bottom-color: rgb(192, 192, 192); border-bottom-style: solid; border-bottom-width: 1px; color: #141414; font-family: 'Open Sans', serif, sans-serif; font-size: 18.6000003814697px; font-stretch: normal; margin: 0px 0px 15px; padding: 0px 0px 5px 50px;">
</h1>
<div class="post-body entry-content" id="post-body-3557779240789474015" itemprop="description articleBody" style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em; margin: 0px 0px 0.75em;">
<div dir="ltr" trbidi="on">
<div dir="ltr" trbidi="on">
<div class="separator" style="clear: left; float: left; margin-bottom: 1em; margin-right: 1em; text-align: center;">
<img alt="mouse cursor in blogger" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEijbjLBVGTDzOleHzgMJKB9n2ni1pJkGAjItrNvMM0wPIajE9c5UJiXCSxmR6GWDZrseb2qN_-RIGLKMlJP-oMgkIf-H2HsRWEprETNbupXu8L-Go4ok72IblHCMZD3ZnSGPRgyutKtJ2ni/s1600/mouse+cursor+in+blogger.png" style="-webkit-transition: all 0.4s ease-in-out; border: 1px solid rgb(192, 192, 192); height: auto; max-width: 95%; padding: 4px; transition: all 0.4s ease-in-out;" title="mouse cursor in blogger" /></div>
<br />
How to change mouse cursor in blogger blog to animated cursors.One of the best way to add extra fun to your blog is, changing mouse cursor on your blog. Changing the mouse cursor in blogger or blogspot blogs is very easy.This tutorial will help you to change the mouse cursor of your blog to animated cursors.Many bloggers are asking such kind of questions but there is no tutorial available on the internet.I created this post because there are a blogger friend who asked how to change the pointer / cursor on the blogger. This you can do to decorate the look of blog.<br />
<br />
<br />
<br />
<br />
<a href="https://www.blogger.com/null" name="more"></a><br />
<br />
<br />
<br />
<a href="https://www.blogger.com/null" name="more"></a><br />
<div style="text-align: center;">
<br /></div>
<br />
I take the cursor image from http://www.cursors-4u.com and http://rw-designer.com you can change it anytime depends on your festive moods.<br />
<br />
<br />
<h4 style="font-family: 'Open Sans', serif, sans-serif; font-size: 15.6000003814697px; font-stretch: normal; font-weight: normal; line-height: normal; margin: 0px;">
<b>How to Install mouse cursor in blogger blog to animated cursors</b></h4>
<br />
<b>How to add HTML-CSS-Javascript Codes to your Blog ? </b><br />
<br />
This is very simple and easy you only follow below steps and add this widget in your blog.<br />
<br />
<b><span style="color: magenta;">Step 1</span></b> Log-in to your <b style="background-color: orange;">Blogger account</b>.<br />
<br />
<b><span style="color: magenta;">Step 2</span></b> Backup your Template.<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<a class="external_link" href="http://bit.ly/work24" imageanchor="1" style="color: #999999; margin-left: 1em; margin-right: 1em; text-decoration: none;" target="_blank"><img alt="Edit Template HTML" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhIpjF1RPzqFgzkxbsm2nNRx6L3uoninbI7NW1U815ovueZaXzYBBl6c0uKUS3QCZ-uDnZ7NucQXyTMBq8C9CDrPXIOkBPMG0OQ40UnZrKp7jT-o-vLFqyA4k84argIM5POmR2oImJbvWwx/s1600/Edit+Template+HTML.png" style="-webkit-transition: all 0.4s ease-in-out; border: 1px solid rgb(192, 192, 192); height: auto; max-width: 95%; padding: 4px; transition: all 0.4s ease-in-out;" title="Edit Template HTML" /></a></div>
<br />
<br />
<b><span style="color: magenta;">Step 3</span></b> Click on The <b style="background-color: cyan;">Template</b>>> <b><span style="background-color: #f4cccc; color: purple;">Edit HTML</span></b>>> <b><span style="color: orange;">Proceed</span></b>.<br />
<br />
<b><span style="color: magenta;">Step 4</span></b> Now find [by pressing <kbd style="border-radius: 3px; border: 1px solid gray; box-shadow: rgb(238, 238, 238) 1px 0px 1px 0px, rgb(204, 204, 204) 0px 2px 0px 2px, rgb(68, 68, 68) 0px 2px 0px 3px; font-size: 1.2em; margin: 2px 3px; padding: 1px 5px;">Ctrl</kbd><span style="font-family: Georgia, serif; font-size: 13.63636302948px;"> + </span><kbd style="border-radius: 3px; border: 1px solid gray; box-shadow: rgb(238, 238, 238) 1px 0px 1px 0px, rgb(204, 204, 204) 0px 2px 0px 2px, rgb(68, 68, 68) 0px 2px 0px 3px; font-size: 1.2em; margin: 2px 3px; padding: 1px 5px;">F</kbd> ] this code in the template:<br />
<br />
<div class="code" style="background-attachment: initial; background-clip: initial; background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg_A6UCACj7lzkc6RQWaXeH21t_M2FpXey_i-u2nxBG0CxjI_7RIhDrL9J6Uqx0IhT_KdCBsZFoTBd3jo_2pm5edb0WckL48zHKeMYB6NYMMINubK0Z4iMOwA9G-XWD1m0VFsDI0Af13emE/); background-origin: initial; background-position: 0% 0%; background-repeat: repeat-y; background-size: initial; color: black; font-family: 'Courier New'; font-size: 9pt; margin: 5px 10px; max-height: 200px; overflow: auto; padding: 4px 10px 0px 40px;">
</head></div>
<br />
And immediately <b><span style="color: red;">Before</span></b> it, paste this code:<br />
<br />
<br />
<br />
<br />
<div class="code" style="background-attachment: initial; background-clip: initial; background-color: #ebf0ff; background-image: initial; background-origin: initial; background-position: 0% 0%; background-repeat: repeat-y; background-size: initial; border: 1px dotted rgb(34, 51, 68); color: #474747; font-family: Arial, Verdana; font-size: 14px; margin: 5px 10px; max-height: 200px; overflow: auto; padding: 5px;">
<span class="Apple-style-span" style="font-family: 'Trebuchet MS', sans-serif; font-size: 13px;"><a class="external_link" href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiqfV3X3IcmKrxkLvTEs-sg-324ptr7Kv3vSi4qsWUFCwUMdHcwb_wwrCxh8ZLNdskTe_3Qpe4UmGKr-n8caf1cpZ3DIjTTC7BJRJSyNmPSzkx6QJ3tok1YB7g2oWzYb98IRZQq_mpmFOSS/s1600/cur220.gif" imageanchor="1" style="clear: right; color: #a42828; cursor: url(http://safir85.ucoz.com/24work-blogspot/mouse-cursor/COOL_BLUE_OUTER_GLOW_POINTER-www.24work.blogspot.c.cur), progress; float: right; margin-bottom: 1em; margin-left: 1em; opacity: 1; outline: none; text-decoration: none;" target="_blank"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiqfV3X3IcmKrxkLvTEs-sg-324ptr7Kv3vSi4qsWUFCwUMdHcwb_wwrCxh8ZLNdskTe_3Qpe4UmGKr-n8caf1cpZ3DIjTTC7BJRJSyNmPSzkx6QJ3tok1YB7g2oWzYb98IRZQq_mpmFOSS/s1600/cur220.gif" style="-webkit-transition: all 0.4s ease-in-out; background-attachment: initial; background-clip: initial; background-color: #eeeeee; background-image: initial; background-origin: initial; border-bottom-color: initial; border-left-color: rgb(204, 204, 204); border-right-color: rgb(204, 204, 204); border-style: solid; border-top-color: rgb(204, 204, 204); border-width: initial; height: auto; margin: 10px; max-width: 95%; padding: 0px; transition: all 0.4s ease-in-out;" /></a><br /><br /><br /><br /><br /><br /><br /><br /><b><link href="https://24work-new.googlecode.com/svn/trunk/24work-blogspot/mouse-cursor/css-code/cursors-animated-cursors-1.css" rel="stylesheet" type="text/css" /><a href="http://horizon.blogspot.com/" target="_blank" title="Blogger Templates"><img src="https://bitly.com/24workpng1" alt="Blogger Templates" border="0" style="position:absolute; top: 0px; right: 0px;" ></a></b></span></div>
<br />
<br />
<br />
And now click <b style="background-color: #ff7700; border: 1px solid rgb(153, 51, 0); color: white; margin: 2px; padding: 2px;">Save Template </b><br />
<br />
<br />
<br />
<h2 style="font-family: 'Open Sans', serif, sans-serif; font-size: 19.2000007629395px; font-stretch: normal; font-weight: normal; line-height: normal; margin: 0px;">
<span style="color: red;">Change Mouse Cursor Generator by horizon-tut.blogspot.com</span></h2>
<div>
<span style="color: red;"><br /></span></div>
<h4 style="font-family: 'Open Sans', serif, sans-serif; font-size: 15.6000003814697px; font-stretch: normal; font-weight: normal; line-height: normal; margin: 0px;">
<b><span style="color: orange;">How To Add Mouse Cursor Widget To Blogger?</span></b></h4>
</div>
<ul>
<li>Choose a type of Mouse Cursor below</li>
<li>Click on <b>"Genetate"</b> button</li>
<li>Finally click on <b>"Add to Blogger"</b> to add it to your blog.</li>
</ul>
<br />
<br />
<br />
<div style="border: 2px dashed red; padding: 10px;">
<iframe frameborder="0" height="4420px" scrolling="no" src="https://24work-new.googlecode.com/svn/trunk/24work-blogspot/mouse-cursor/cursor-generator-ycode.html" style="max-width: 100%;" width="580px"></iframe></div>
<br />
<span class="Apple-style-span" style="background-color: white; color: #474747; font-family: Arial, Verdana; font-size: 14px;"><span class="Apple-style-span" style="color: #0c343d;"><b>Note</b>: </span><span class="Apple-style-span" style="color: white; font-family: 'Segoe UI', Calibri, 'Myriad Pro', Myriad, 'Trebuchet MS', Helvetica, Arial, sans-serif;"><b style="margin: 0px; padding: 0px;"><span style="color: red; margin: 0px; padding: 0px;"> </span><span style="margin: 0px; padding: 0px;"><span class="Apple-style-span" style="color: magenta;">We are going to add more cursor, cursor pointer, cursors, mouse cursor, Totally Free Cursors, Myspace Cursors, Animated Cursors and cursors oftenly so keep visiting this page</span></span></b></span><span class="Apple-style-span" style="font-family: 'Segoe UI', Calibri, 'Myriad Pro', Myriad, 'Trebuchet MS', Helvetica, Arial, sans-serif;"><span class="Apple-style-span" style="color: magenta;">.</span></span></span><br />
<br />
<br />
<br />
<b style="background-color: #ff7700; border: 1px solid rgb(153, 51, 0); color: white; margin: 2px; padding: 2px;"><span style="font-size: large;">Blogger MySpace Cursor Code Generate </span></b><br />
<br />
<br />
<br />
You can change the appearance of the cursor on the MySpace profile page (the cursor is the little that moves on the screen by moving the mouse). For example, you could make the appearance of the cursor as a question mark when the user hovers over an object.The widget is originally developed by code-generator.net, i just changed something in the widget.<br />
<br />
<br />
<br />
<iframe frameborder="0" height="1110" name="Scrolling Recent Posts Widget" scrolling="no" src="https://24work-new.googlecode.com/svn/trunk/24work-blogspot/mouse-cursor/blogger-myspace-cursor-generator-ycode.html" style="max-width: 100%;" width="585px"></iframe><br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<b>How to Install Blogger MySpace Cursor Code Generator Widget</b><br />
<br />
Now let's start adding it...<br />
<br />
<b><span style="color: blue;">Step 1.</span></b> Login to Your Blogger Account.Go to your Blogger Dashboard.Click on Layout tab from left pane and click on Add a Gadget link.<br />
<br />
<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<a class="external_link" href="http://bit.ly/work24" imageanchor="1" style="color: #999999; margin-left: 1em; margin-right: 1em; text-decoration: none;" target="_blank"><img alt="Blogger Tips And Tricks|Latest Tips For Bloggers" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh3xS0qD7ryZOKBZcARpzl2P8X6ZepEdp0hue2prP_1DqmO0YvQbLwpPbt3iwhfIWXrQt2Izu8Mdxp8FbaLWWQGWm5e0fT5NFZ02kaHCicsxQNnR59vHYEtZO_HIBSopPDWWS68yGqr3ulv/s1600/Blogger+Dashboard,+go+to+Layout+and+click+on+Add+a+Gadget+link.png" height="345" img="" style="-webkit-transition: all 0.4s ease-in-out; border: 1px solid rgb(192, 192, 192); height: auto; max-width: 95%; padding: 4px; transition: all 0.4s ease-in-out;" width="550" /></a></div>
<br />
<b><span style="color: blue;">Step 2.</span></b> After click on Add a Gadget link A pop-up box will open now<br />
with many gadget list, Choose HTML/JavaScript from the gadget options by clicking the blue plus sign for that gadget.<br />
<br />
<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<a class="external_link" href="http://bit.ly/work24" imageanchor="1" style="color: #999999; margin-left: 1em; margin-right: 1em; text-decoration: none;" target="_blank"><img alt="Blogger Tips And Tricks|Latest Tips For Bloggers" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhvFtbA-BSQQYQcLS8lL2Iol2A-GQA62M2ijA2oyzz6ZIStorRHSjNobo-iPh5duUjw0a-Xd6X68HPaUpNXj7fs5tiddwZgwmSGhvx2B0-ESFCoiInMXHR4gk3KB5mF17t6aN8NGrsmr7ph/s1600/pop-up+window,+choose+the+HTMLJavaScript+widget.png" height="219" img="" style="-webkit-transition: all 0.4s ease-in-out; border: 1px solid rgb(192, 192, 192); height: auto; max-width: 95%; padding: 4px; transition: all 0.4s ease-in-out;" width="486" /></a></div>
<br />
<b><span style="color: blue;">Step 3.</span></b> Select 'HTML/Javascript' and add the one of code given below.<br />
<br />
<b><span style="color: blue;">Step 4.</span></b> Now Click On Save 'JavaScript' You are done.<br />
<br />
<br />
That`s All..........<br />
<br />
<br />
<br /></div>
</div>
</div>
Ghous uddinhttp://www.blogger.com/profile/13773797017118313457noreply@blogger.com3tag:blogger.com,1999:blog-9181450838141665570.post-63121366523394652702015-02-11T08:38:00.003-08:002015-03-15T11:40:28.570-07:00Animated Twitter Follow Me Buttons for Blogger And blogs<div dir="ltr" style="text-align: left;" trbidi="on">
<h1 class="post-title entry-title" itemprop="name headline" style="border-bottom-color: rgb(192, 192, 192); border-bottom-style: solid; border-bottom-width: 1px; color: #141414; font-family: 'Open Sans', serif, sans-serif; font-size: 18.6000003814697px; font-stretch: normal; margin: 0px 0px 15px; padding: 0px 0px 5px 50px;">
</h1>
<div class="post-body entry-content" id="post-body-6002678701179016844" itemprop="description articleBody" style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em; margin: 0px 0px 0.75em;">
<div dir="ltr" trbidi="on">
<div class="separator" style="clear: left; float: left; margin-bottom: 1em; margin-right: 1em; text-align: center;">
<img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjJZG5YoV37_QP5zAxWuBnsA5fAbb4ZvL1bXQCjhXcGLnxYwgC_QXnDfMEuL4sqgR1myZMB2_9Umy_YoIjkVoKHXX2K7tcCnmm0OBIK8qAbKmFPjpeKhgBXzJ5yI7o6qw_3UQSOlPMeX1QY/s1600/Flash+Twitter+Follow+Me+Buttons.png" style="-webkit-transition: all 0.4s ease-in-out; border: 1px solid rgb(192, 192, 192); height: auto; max-width: 95%; opacity: 0.7; padding: 4px; transition: all 0.4s ease-in-out;" /></div>
Twitter is a social networking sites popular in the world of bloggers to promote their blogs. So here I am very cool Twitter Blogger widget, now it shows me how to add flash buttons to your twitter blogs and websites. These are the widgets based on Flash animations and have some nice effects.These buttons can help Twitter Flash Spice up your blogs, Webssites and can help you gain more followers on Twitter. These are designed and developed by twitterflash.net. I'm taking all the 15 types of one-click install to your blog.<br />
<a href="https://www.blogger.com/null" name="more"></a><br />
<br />
<br />
<a href="https://www.blogger.com/null" name="more"></a><br />
<span style="color: red; font-size: large;">How to Install Flash Animated Twitter Follow Me</span><br />
<br />
<span style="color: red; font-size: large;">Widget To Blogger / Blog / Websites</span><br />
<br />
<br />
<br />
<br />
<br />
Now let's start adding it...<br />
<br />
<b><span style="color: blue;">Step 1.</span></b> Login to Your Blogger Account.Go to your Blogger Dashboard.Click on Layout tab from left pane and click on Add a Gadget link.<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<a class="external_link" href="http://bit.ly/work24" imageanchor="1" style="color: #999999; margin-left: 1em; margin-right: 1em; text-decoration: none;" target="_blank"><img alt="Blogger Tips And Tricks|Latest Tips For Bloggers" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh3xS0qD7ryZOKBZcARpzl2P8X6ZepEdp0hue2prP_1DqmO0YvQbLwpPbt3iwhfIWXrQt2Izu8Mdxp8FbaLWWQGWm5e0fT5NFZ02kaHCicsxQNnR59vHYEtZO_HIBSopPDWWS68yGqr3ulv/s1600/Blogger+Dashboard,+go+to+Layout+and+click+on+Add+a+Gadget+link.png" height="345" img="" style="-webkit-transition: all 0.4s ease-in-out; border: 1px solid rgb(192, 192, 192); height: auto; max-width: 95%; padding: 4px; transition: all 0.4s ease-in-out;" width="550" /></a></div>
<br />
<b><span style="color: blue;">Step 2.</span></b> After click on Add a Gadget link A pop-up box will open now<br />
with many gadget list, Choose HTML/JavaScript from the gadget options by clicking the blue plus sign for that gadget.<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<a class="external_link" href="http://bit.ly/work24" imageanchor="1" style="color: #999999; margin-left: 1em; margin-right: 1em; text-decoration: none;" target="_blank"><img alt="Blogger Tips And Tricks|Latest Tips For Bloggers" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhvFtbA-BSQQYQcLS8lL2Iol2A-GQA62M2ijA2oyzz6ZIStorRHSjNobo-iPh5duUjw0a-Xd6X68HPaUpNXj7fs5tiddwZgwmSGhvx2B0-ESFCoiInMXHR4gk3KB5mF17t6aN8NGrsmr7ph/s1600/pop-up+window,+choose+the+HTMLJavaScript+widget.png" height="219" img="" style="-webkit-transition: all 0.4s ease-in-out; border: 1px solid rgb(192, 192, 192); height: auto; max-width: 95%; padding: 4px; transition: all 0.4s ease-in-out;" width="486" /></a></div>
<br />
<br />
<b><span style="color: blue;">Step 3.</span></b> Select 'HTML/Javascript' and add the one of code given below.<br />
<br />
<b><span style="color: blue;">Step 4.</span></b> Now Click On Save 'JavaScript' You are done. ..............<br />
<br />
<br />
<br />
<div class="code" style="background-attachment: initial; background-clip: initial; background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg_A6UCACj7lzkc6RQWaXeH21t_M2FpXey_i-u2nxBG0CxjI_7RIhDrL9J6Uqx0IhT_KdCBsZFoTBd3jo_2pm5edb0WckL48zHKeMYB6NYMMINubK0Z4iMOwA9G-XWD1m0VFsDI0Af13emE/); background-origin: initial; background-position: 0% 0%; background-repeat: repeat-y; background-size: initial; color: black; font-family: 'Courier New'; font-size: 9pt; margin: 5px 10px; max-height: 200px; overflow: auto; padding: 4px 10px 0px 40px;">
<object type="application/x-shockwave-flash" data="http://www.buzzbuttons.com/BUTTON3/twitbutton.swf" width="150" height="150"><param name="movie" value="http://www.buzzbuttons.com/BUTTON3/twitbutton.swf"></param><param name="allowscriptaccess" value="always"></param><param name="menu" value="false"></param><param name="wmode" value="transparent"></param><param name="flashvars" value="username=<b><span style="color: red;">rohul786</span></b>"></param><a href="http://24work.blogspot.com/" target="_blank" title="Blogger Tips and Tricks"><img src="https://bitly.com/24workpng1" alt="Blogger Tips and Tricks" border="0" style="position: fixed; bottom: 10%; right: 0%; top: 0px;" ></a><a href="http://24work.blogspot.com/" target="_blank" title="Latest Tips And Tricks"><img src="https://bitly.com/24workpng1" alt="Latest Tips And Tricks" border="0" style="position: fixed; bottom: 10%; right: 0%;" ></a><a href="http://24work.blogspot.com/" target="_blank" title="Blogger Tricks"><img src="https://bitly.com/24workpng1" alt="Blogger Tricks" border="0" style="position: fixed; bottom: 10%; left: 0%;" ></a><embed src="http://www.buzzbuttons.com/BUTTON3/twitbutton.swf" type="application/x-shockwave-flash" allowscriptaccess="always" width="150" height="150" menu="false" wmode="transparent" flashvars="username=<b><span style="color: red;">rohul786</span></b>"></embed></object></div>
<br />
<br />
And now click <b style="background-color: #ff7700; border: 1px solid rgb(153, 51, 0); color: white; margin: 2px; padding: 2px;">Save </b><br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<h2 style="font-family: 'Open Sans', serif, sans-serif; font-size: 19.2000007629395px; font-stretch: normal; font-weight: normal; line-height: normal; margin: 0px;">
<span style="color: red;">How to Install Flash Twitter Follow Me Buttons on Your Blog?</span></h2>
<br />
<br />
1. Choose Any <b>Flash Follow Me Button</b> As You Want<br />
<br />
2. Replace <b><span style="color: red;">rohul786</span></b> With <b>Your Twitter User Name</b><br />
<br />
3. Customize <b>Width</b> And <b>Height</b> as You Need<br />
<br />
4. Click on Generate Button and Finally Click on Add to Blogger Button to add this widget on your blog.<br />
<br />
<br />
<br />
OR<br />
<br />
5. Click on Get Code Button and Copy the code to use it.<br />
<br />
<br />
<br />
<br />
<br />
<br />
<iframe allowtransparency="true" frameborder="0" height="1700px" scrolling="no" src="http://24work-new.googlecode.com/svn/trunk/24work-blogspot/flash-twitter/twitter-flash-follow-me-widget-generator-ycode.html" style="max-width: 100%;" width="100%"></iframe><br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br /></div>
<div style="clear: both;">
</div>
</div>
<span class="datex show" style="-webkit-transition: all 0.4s ease-in-out; background-color: #2e2e2e; color: white; display: block; font-family: Verdana, Geneva, sans-serif; font-size: 12px; left: 15px; padding: 3px 0px; position: absolute; text-align: center; top: 0px; transition: all 0.4s ease-in-out; z-index: 0;"></span></div>
Ghous uddinhttp://www.blogger.com/profile/13773797017118313457noreply@blogger.com0tag:blogger.com,1999:blog-9181450838141665570.post-51293934616093069172015-02-11T08:26:00.004-08:002015-03-15T11:40:48.502-07:00Advance Facebook User ID Finder Tool <div dir="ltr" style="text-align: left;" trbidi="on">
<h2 class="post-title entry-title" itemprop="name headline" style="background-color: white; border-bottom-color: rgb(192, 192, 192); border-bottom-style: solid; border-bottom-width: 1px; color: #141414; font-family: 'Open Sans', serif, sans-serif; font-size: 18.6000003814697px; font-stretch: normal; margin: 0px 0px 15px; padding: 0px 0px 5px;">
<a class="external_link" href="http://24work.blogspot.com/p/facebook-user-id-finder-tool.html" itemprop="url" style="color: #141414; display: block; font-family: Oswald, Arial, 'Arial Unicode MS', Helvetica, sans-serif; font-size: 24px; margin: 0px; padding: 0px; text-decoration: none;" target="_blank"><br /></a></h2>
<div class="post-body entry-content" id="post-body-2220301774849389053" itemprop="description articleBody" style="background-color: white; color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em; margin: 0px 0px 0.75em;">
<div dir="ltr" trbidi="on">
<div class="separator" style="clear: left; float: left; margin-bottom: 1em; margin-right: 1em; text-align: center;">
<img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj6Zxm9kU50VefMavTlbSDpFJPfniAQRqkMzDlyeZFovr1FggelbSMvEO70mdZYD6CNlbBaZu5Ar3izsKFpxChYHMOi7yl9_7rLwfoW5BwUHMCHb7cjEw1A8I7W39AMuXI-3UxGRkj9CsMg/s1600/Facebook+UserID+Tool.jpg" style="-webkit-transition: all 0.4s ease-in-out; border: 1px solid rgb(192, 192, 192); height: auto; margin: 0px; max-width: 95%; padding: 4px; transition: all 0.4s ease-in-out;" /></div>
<br />
<br />
<br />
We all know that a every Facebook profile will have a unique numerical ID like www.facebook.com/<span style="background-color: lime;"><b>220888831260608</b></span>but after assigning your own User Name numeric id will not show in your profile url, it redirects to your custom User Name. one of our blog reader asked this doubt. Here is the trick to get your facebook id number using facebook graph.<br />
<br />
<a href="https://www.blogger.com/null" name="more"></a><br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<b>Non-Customized Facebook Profile URL</b><br />
Your URL (web address) will look something like this:<br />
<br />
<blockquote style="background: url(http://freetolools.blogspot.com/images/postquote.png) no-repeat scroll rgb(246, 235, 193); border-left-color: rgb(252, 226, 124); border-left-style: solid; border-left-width: 5px; clear: both; color: #080808; font-family: 'Droid Sans', Arial, 'Arial Unicode MS', Helvetica, sans-serif; font-style: italic; margin: 1em 3em; overflow: auto; padding: 0.5em 1em;">
https://www.facebook.com/profile.php?id=<span style="background-color: lime;"><b>22088883187260608</b></span></blockquote>
<br />
<br />
<b>Customized Facebook Profile URL</b><br />
Here’s what I mean by a customized Facebook profile URL – I’ll use my Facebook profile as the example:<br />
<blockquote style="background: url(http://freetolools.blogspot.com/images/postquote.png) no-repeat scroll rgb(246, 235, 193); border-left-color: rgb(252, 226, 124); border-left-style: solid; border-left-width: 5px; clear: both; color: #080808; font-family: 'Droid Sans', Arial, 'Arial Unicode MS', Helvetica, sans-serif; font-style: italic; margin: 1em 3em; overflow: auto; padding: 0.5em 1em;">
<b>https://www.facebook.com/<span style="color: red;">your page site name</span></b></blockquote>
<br />
<br />
<br />
<h4 style="color: #878787; font-family: 'Open Sans', serif, sans-serif; font-size: 15.6000003814697px; font-stretch: normal; font-weight: normal; line-height: normal; margin: 0px; padding: 0px; text-transform: uppercase;">
<b>HERE’S HOW TO FIND YOUR FACEBOOK ID</b></h4>
<br />
<div class="pbtsidebar widget-area" id="pbtsidebar" style="display: inline; font-size: 14px; margin-left: 10px; text-shadow: rgb(255, 255, 255) 1px 1px; width: 300px;">
<div class="widget pbtenews-widget" id="pbtenews-12" style="margin: 0px 0px 1.5em;">
<div class="art-block clearfix" id="art-block-pbtenews-12" style="margin: 10px;">
<div class="art-blockcontent" style="color: #404040; font-family: 'Droid Sans', Arial, 'Arial Unicode MS', Helvetica, sans-serif; font-size: 13px; margin: 0px auto; padding: 3px;">
<div class="widget-wrap" style="padding: 30px;">
<div class="pbtenews" style="background-color: #483b5f; margin: -30px; min-height: 210px; padding: 1px 20px 15px; text-align: center;">
<h4 class="widgettitle" style="background: none; color: white; font-family: 'PT sans'; font-size: 18.2000007629395px; font-stretch: normal; font-weight: normal; line-height: 1.2em; margin: 12px 0px 10px; padding: 0px; text-shadow: rgb(22, 29, 77) 1px 1px !important; text-transform: uppercase;">
<span style="color: lime;">~*~ FACEBOOK USER ID FINDER TOOL BY 24WORK ~*~</span></h4>
<span style="color: lime;">Just Enter your Facebook User Name and Click on '"Get Detail</span>s".<br />
<br />
<br />
<form action="https://graph.facebook.com/?id=" id="subscribe" method="get" style="margin: 0px !important; padding: 0px !important;" target="popupwindow">
<input id="subbox" name="id" style="-webkit-box-shadow: rgb(204, 204, 204) 1px 1px 3px inset; background-attachment: initial; background-clip: initial; background-color: #f9fafb; background-image: url(http://24work.blogspot.com/p/facebook-user-id-finder-tool.html); background-origin: initial; background-position: 0% 50%; background-repeat: no-repeat; background-size: initial; border-color: rgb(158, 110, 86) rgb(182, 182, 182) rgb(182, 182, 182) rgb(158, 110, 86); border-radius: 3px; border-style: solid; border-width: 1px; box-shadow: rgb(204, 204, 204) 1px 1px 3px inset; color: black; font-family: 'Droid Sans', Arial, 'Arial Unicode MS', Helvetica, sans-serif; font-size: 12px; font-weight: bold; margin: 0px 10px 15px; padding: 14px 10px 12px; text-transform: uppercase; vertical-align: middle; width: 200px;" type="text" value="Enter Your Facebook Username" /><br />
<br />
<br />
<input id="subbutton" name="sub" style="background-attachment: initial; background-clip: initial; background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjAT6kVzRsmpQ9bKirWtUCF8-1afPDVkOpBJXCto9XIsxH5Wr8LyPSjjhEpK6B6bJzffnklIs44g85q9wwhrq6VPfbTLsEduUyV3kEzyiZZyAc5QuzYVyqA0OmyQudd__KlYQvH-Xmj55Ha/s1600/button-light.png); background-origin: initial; background-position: 0px 0px; background-repeat: initial; background-size: initial; border-radius: 3px; border: none; box-shadow: rgb(162, 74, 29) 0px 1px 1px; color: rgb(51, 51, 51) !important; cursor: pointer; font-family: Oswald, Arial, 'Arial Unicode MS', Helvetica, sans-serif; font-size: 14px; font-weight: bold; margin: 0px auto; outline: 0px; padding: 13px 15px; text-shadow: rgb(255, 255, 255) 1px 1px; text-transform: uppercase; vertical-align: middle;" type="submit" value="Get Details" /></form>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
Ghous uddinhttp://www.blogger.com/profile/13773797017118313457noreply@blogger.com0tag:blogger.com,1999:blog-9181450838141665570.post-39598033930310077122015-02-07T10:04:00.005-08:002015-03-15T11:41:07.717-07:00CSS3 Color Chart for Every codings<div dir="ltr" style="text-align: left;" trbidi="on">
<center style="background-color: white; color: #333333; font-family: Verdana, arial; font-size: 13px; line-height: 20.796875px;">
<table border="0" cellpadding="4" cellspacing="2" style="width: 551px;"><tbody>
<tr><td bgcolor="#ffffff" class="mbt_out" style="border: 0px;" valign="top" width="89"><span style="color: #004000;">#FFFFFF</span></td><td bgcolor="#ffffcc" class="mbt_out" style="border: 0px;" valign="top" width="89"><span style="color: #004000;">#FFFFCC</span></td><td bgcolor="#ffff99" class="mbt_out" style="border: 0px;" valign="top" width="87"><span style="color: #004000;">#FFFF99</span></td><td bgcolor="#ffff66" class="mbt_out" style="border: 0px;" valign="top" width="87"><span style="color: #004000;">#FFFF66</span></td><td bgcolor="#ffff33" class="mbt_out" style="border: 0px;" valign="top" width="87"><span style="color: #004000;">#FFFF33</span></td><td bgcolor="#ffff00" class="mbt_out" style="border: 0px;" valign="top" width="96"><span style="color: #004000;">#FFFF00</span></td></tr>
<tr><td bgcolor="#ffccff" class="mbt_out" style="border: 0px;" valign="top" width="89"><span style="color: #004000;">#FFCCFF</span></td><td bgcolor="#ffcccc" class="mbt_out" style="border: 0px;" valign="top" width="89"><span style="color: #004000;">#FFCCCC</span></td><td bgcolor="#ffcc99" class="mbt_out" style="border: 0px;" valign="top" width="87"><span style="color: #004000;">#FFCC99</span></td><td bgcolor="#ffcc66" class="mbt_out" style="border: 0px;" valign="top" width="87"><span style="color: #004000;">#FFCC66</span></td><td bgcolor="#ffcc33" class="mbt_out" style="border: 0px;" valign="top" width="87"><span style="color: #004000;">#FFCC33</span></td><td bgcolor="#ffcc00" class="mbt_out" style="border: 0px;" valign="top" width="96"><span style="color: #004000;">#FFCC00</span></td></tr>
<tr><td bgcolor="#ff99ff" class="mbt_out" style="border: 0px;" valign="top" width="90"><span style="color: #004000;">#FF99FF</span></td><td bgcolor="#ff99cc" class="mbt_out" style="border: 0px;" valign="top" width="88"><span style="color: #004000;">#FF99CC</span></td><td bgcolor="#ff9999" class="mbt_out" style="border: 0px;" valign="top" width="87"><span style="color: #004000;">#FF9999</span></td><td bgcolor="#ff9966" class="mbt_out" style="border: 0px;" valign="top" width="87"><span style="color: #004000;">#FF9966</span></td><td bgcolor="#ff9933" class="mbt_out" style="border: 0px;" valign="top" width="87"><span style="color: #004000;">#FF9933</span></td><td bgcolor="#ff9900" class="mbt_out" style="border: 0px;" valign="top" width="96"><span style="color: #004000;">#FF9900</span></td></tr>
<tr><td bgcolor="#ff66ff" class="mbt_out" style="border: 0px;" valign="top" width="90"><span style="color: white;">#FF66FF</span></td><td bgcolor="#ff66cc" class="mbt_out" style="border: 0px;" valign="top" width="88"><span style="color: white;">#FF66CC</span></td><td bgcolor="#ff6699" class="mbt_out" style="border: 0px;" valign="top" width="87"><span style="color: white;">#FF6699</span></td><td bgcolor="#ff6666" class="mbt_out" style="border: 0px;" valign="top" width="87"><span style="color: white;">#FF6666</span></td><td bgcolor="#ff6633" class="mbt_out" style="border: 0px;" valign="top" width="87"><span style="color: white;">#FF6633</span></td><td bgcolor="#ff6600" class="mbt_out" style="border: 0px;" valign="top" width="96"><span style="color: white;">#FF6600</span></td></tr>
<tr><td bgcolor="#ff33ff" class="mbt_out" style="border: 0px;" valign="top" width="90"><span style="color: white;">#FF33FF</span></td><td bgcolor="#ff33cc" class="mbt_out" style="border: 0px;" valign="top" width="88"><span style="color: white;">#FF33CC</span></td><td bgcolor="#ff3399" class="mbt_out" style="border: 0px;" valign="top" width="87"><span style="color: white;">#FF3399</span></td><td bgcolor="#ff3366" class="mbt_out" style="border: 0px;" valign="top" width="87"><span style="color: white;">#FF3366</span></td><td bgcolor="#ff3333" class="mbt_out" style="border: 0px;" valign="top" width="87"><span style="color: white;">#FF3333</span></td><td bgcolor="#ff3300" class="mbt_out" style="border: 0px;" valign="top" width="96"><span style="color: white;">#FF3300</span></td></tr>
<tr><td bgcolor="#ff00ff" class="mbt_out" style="border: 0px;" valign="top" width="90"><span style="color: white;">#FF00FF</span></td><td bgcolor="#ff00cc" class="mbt_out" style="border: 0px;" valign="top" width="88"><span style="color: white;">#FF00CC</span></td><td bgcolor="#ff0099" class="mbt_out" style="border: 0px;" valign="top" width="87"><span style="color: white;">#FF0099</span></td><td bgcolor="#ff0066" class="mbt_out" style="border: 0px;" valign="top" width="87"><span style="color: white;">#FF0066</span></td><td bgcolor="#ff0033" class="mbt_out" style="border: 0px;" valign="top" width="87"><span style="color: white;">#FF0033</span></td><td bgcolor="#ff0000" class="mbt_out" style="border: 0px;" valign="top" width="96"><span style="color: white;">#FF0000</span></td></tr>
</tbody></table>
</center>
<div style="background-color: white; color: #333333; font-family: Verdana, arial; font-size: 13px; line-height: 20.796875px; margin-top: 22px; overflow: hidden;">
</div>
<center style="background-color: white; color: #333333; font-family: Verdana, arial; font-size: 13px; line-height: 20.796875px;">
<a href="https://www.blogger.com/null" name="more"></a><table border="0" cellpadding="4" cellspacing="2" style="width: 551px;"><tbody>
<tr><td bgcolor="#ccffff" class="mbt_out" style="border: 0px;" valign="top" width="89"><span style="color: #004000;">#CCFFFF</span></td><td bgcolor="#ccffcc" class="mbt_out" style="border: 0px;" valign="top" width="89"><span style="color: #004000;">#CCFFCC</span></td><td bgcolor="#ccff99" class="mbt_out" style="border: 0px;" valign="top" width="87"><span style="color: #004000;">#CCFF99</span></td><td bgcolor="#ccff66" class="mbt_out" style="border: 0px;" valign="top" width="87"><span style="color: #004000;">#CCFF66</span></td><td bgcolor="#ccff33" class="mbt_out" style="border: 0px;" valign="top" width="87"><span style="color: #004000;">#CCFF33</span></td><td bgcolor="#ccff00" class="mbt_out" style="border: 0px;" valign="top" width="96"><span style="color: #004000;">#CCFF00</span></td></tr>
<tr><td bgcolor="#ccccff" class="mbt_out" style="border: 0px;" valign="top" width="89"><span style="color: #004000;">#CCCCFF</span></td><td bgcolor="#cccccc" class="mbt_out" style="border: 0px;" valign="top" width="89"><span style="color: #004000;">#CCCCCC</span></td><td bgcolor="#cccc99" class="mbt_out" style="border: 0px;" valign="top" width="87"><span style="color: #004000;">#CCCC99</span></td><td bgcolor="#cccc66" class="mbt_out" style="border: 0px;" valign="top" width="87"><span style="color: #004000;">#CCCC66</span></td><td bgcolor="#cccc33" class="mbt_out" style="border: 0px;" valign="top" width="87"><span style="color: #004000;">#CCCC33</span></td><td bgcolor="#cccc00" class="mbt_out" style="border: 0px;" valign="top" width="96"><span style="color: #004000;">#CCCC00</span></td></tr>
<tr><td bgcolor="#cc99ff" class="mbt_out" style="border: 0px;" valign="top" width="90"><span style="color: #004000;">#CC99FF</span></td><td bgcolor="#cc99cc" class="mbt_out" style="border: 0px;" valign="top" width="88"><span style="color: #004000;">#CC99CC</span></td><td bgcolor="#cc9999" class="mbt_out" style="border: 0px;" valign="top" width="87"><span style="color: #004000;">#CC9999</span></td><td bgcolor="#cc9966" class="mbt_out" style="border: 0px;" valign="top" width="87"><span style="color: #004000;">#CC9966</span></td><td bgcolor="#cc9933" class="mbt_out" style="border: 0px;" valign="top" width="87"><span style="color: #004000;">#CC9933</span></td><td bgcolor="#cc9900" class="mbt_out" style="border: 0px;" valign="top" width="96"><span style="color: #004000;">#CC9900</span></td></tr>
<tr><td bgcolor="#cc66ff" class="mbt_out" style="border: 0px;" valign="top" width="90"><span style="color: white;">#CC66FF</span></td><td bgcolor="#cc66cc" class="mbt_out" style="border: 0px;" valign="top" width="88"><span style="color: white;">#CC66CC</span></td><td bgcolor="#cc6699" class="mbt_out" style="border: 0px;" valign="top" width="87"><span style="color: white;">#CC6699</span></td><td bgcolor="#cc6666" class="mbt_out" style="border: 0px;" valign="top" width="87"><span style="color: white;">#CC6666</span></td><td bgcolor="#cc6633" class="mbt_out" style="border: 0px;" valign="top" width="87"><span style="color: white;">#CC6633</span></td><td bgcolor="#cc6600" class="mbt_out" style="border: 0px;" valign="top" width="96"><span style="color: white;">#CC6600</span></td></tr>
<tr><td bgcolor="#cc33ff" class="mbt_out" style="border: 0px;" valign="top" width="90"><span style="color: white;">#CC33FF</span></td><td bgcolor="#cc33cc" class="mbt_out" style="border: 0px;" valign="top" width="88"><span style="color: white;">#CC33CC</span></td><td bgcolor="#cc3399" class="mbt_out" style="border: 0px;" valign="top" width="87"><span style="color: white;">#CC3399</span></td><td bgcolor="#cc3366" class="mbt_out" style="border: 0px;" valign="top" width="87"><span style="color: white;">#CC3366</span></td><td bgcolor="#cc3333" class="mbt_out" style="border: 0px;" valign="top" width="87"><span style="color: white;">#CC3333</span></td><td bgcolor="#cc3300" class="mbt_out" style="border: 0px;" valign="top" width="96"><span style="color: white;">#CC3300</span></td></tr>
<tr><td bgcolor="#cc00ff" class="mbt_out" style="border: 0px;" valign="top" width="90"><span style="color: white;">#CC00FF</span></td><td bgcolor="#cc00cc" class="mbt_out" style="border: 0px;" valign="top" width="88"><span style="color: white;">#CC00CC</span></td><td bgcolor="#cc0099" class="mbt_out" style="border: 0px;" valign="top" width="87"><span style="color: white;">#CC0099</span></td><td bgcolor="#cc0066" class="mbt_out" style="border: 0px;" valign="top" width="87"><span style="color: white;">#CC0066</span></td><td bgcolor="#cc0033" class="mbt_out" style="border: 0px;" valign="top" width="87"><span style="color: white;">#CC0033</span></td><td bgcolor="#cc0000" class="mbt_out" style="border: 0px;" valign="top" width="96"><span style="color: white;">#CC0000</span></td></tr>
</tbody></table>
</center>
<center style="background-color: white; color: #333333; font-family: Verdana, arial; font-size: 13px; line-height: 20.796875px;">
</center>
<center style="background-color: white; color: #333333; font-family: Verdana, arial; font-size: 13px; line-height: 20.796875px;">
<table border="0" cellpadding="4" cellspacing="2" style="width: 551px;"><tbody>
<tr><td bgcolor="#99ffff" class="mbt_out" style="border: 0px;" valign="top" width="91"><span style="color: #004000;">#99FFFF</span></td><td bgcolor="#99ffcc" class="mbt_out" style="border: 0px;" valign="top" width="89"><span style="color: #004000;">#99FFCC</span></td><td bgcolor="#99ff99" valign="top" width="87"><span style="color: #004000;">#99FF99</span></td><td bgcolor="#99ff66" valign="top" width="86"><span style="color: #004000;">#99FF66</span></td><td bgcolor="#99ff33" class="mbt_out" style="border: 0px;" valign="top" width="86"><span style="color: #004000;">#99FF33</span></td><td bgcolor="#99ff00" valign="top" width="96"><span style="color: #004000;">#99FF00</span></td></tr>
<tr><td bgcolor="#99ccff" valign="top" width="89"><span style="color: #004000;">#99CCFF</span></td><td bgcolor="#99cccc" class="mbt_out" style="border: 0px;" valign="top" width="89"><span style="color: #004000;">#99CCCC</span></td><td bgcolor="#99cc99" class="mbt_out" style="border: 0px;" valign="top" width="87"><span style="color: #004000;">#99CC99</span></td><td bgcolor="#99cc66" class="mbt_out" style="border: 0px;" valign="top" width="87"><span style="color: #004000;">#99CC66</span></td><td bgcolor="#99cc33" class="mbt_out" style="border: 0px;" valign="top" width="87"><span style="color: #004000;">#99CC33</span></td><td bgcolor="#99cc00" class="mbt_out" style="border: 0px;" valign="top" width="96"><span style="color: #004000;">#99CC00</span></td></tr>
<tr><td bgcolor="#9999ff" valign="top" width="90"><span style="color: #004000;">#9999FF</span></td><td bgcolor="#9999cc" class="mbt_out" style="border: 0px;" valign="top" width="88"><span style="color: #004000;">#9999CC</span></td><td bgcolor="#999999" class="mbt_out" style="border: 0px;" valign="top" width="87"><span style="color: #004000;">#999999</span></td><td bgcolor="#999966" class="mbt_out" style="border: 0px;" valign="top" width="87"><span style="color: #004000;">#999966</span></td><td bgcolor="#999933" class="mbt_out" style="border: 0px;" valign="top" width="87"><span style="color: #004000;">#999933</span></td><td bgcolor="#999900" valign="top" width="96"><span style="color: #004000;">#999900</span></td></tr>
<tr><td bgcolor="#9966ff" valign="top" width="90"><span style="color: white;">#9966FF</span></td><td bgcolor="#9966cc" class="mbt_out" style="border: 0px;" valign="top" width="88"><span style="color: white;">#9966CC</span></td><td bgcolor="#996699" class="mbt_out" style="border: 0px;" valign="top" width="87"><span style="color: white;">#996699</span></td><td bgcolor="#996666" class="mbt_out" style="border: 0px;" valign="top" width="87"><span style="color: white;">#996666</span></td><td bgcolor="#999933" class="mbt_out" style="border: 0px;" valign="top" width="87"><span style="color: white;">#999933</span></td><td bgcolor="#999900" valign="top" width="96"><span style="color: white;">#999900</span></td></tr>
<tr><td bgcolor="#9933ff" valign="top" width="90"><span style="color: white;">#9933FF</span></td><td bgcolor="#9933cc" class="mbt_out" style="border: 0px;" valign="top" width="88"><span style="color: white;">#9933CC</span></td><td bgcolor="#993399" class="mbt_out" style="border: 0px;" valign="top" width="87"><span style="color: white;">#993399</span></td><td bgcolor="#993366" class="mbt_out" style="border: 0px;" valign="top" width="87"><span style="color: white;">#993366</span></td><td bgcolor="#993333" class="mbt_out" style="border: 0px;" valign="top" width="87"><span style="color: white;">#993333</span></td><td bgcolor="#993300" valign="top" width="96"><span style="color: white;">#993300</span></td></tr>
<tr><td bgcolor="#9900ff" valign="top" width="90"><span style="color: white;">#9900FF</span></td><td bgcolor="#9900cc" class="mbt_out" style="border: 0px;" valign="top" width="88"><span style="color: white;">#9900CC</span></td><td bgcolor="#990099" class="mbt_out" style="border: 0px;" valign="top" width="87"><span style="color: white;">#990099</span></td><td bgcolor="#990066" valign="top" width="87"><span style="color: white;">#990066</span></td><td bgcolor="#990033" class="mbt_out" style="border: 0px;" valign="top" width="87"><span style="color: white;">#990033</span></td><td bgcolor="#990000" class="mbt_out" style="border: 0px;" valign="top" width="96"><span style="color: white;">#990000</span></td></tr>
</tbody></table>
</center>
<div style="background-color: white; color: #333333; font-family: Verdana, arial; font-size: 13px; line-height: 20.796875px; margin-top: 22px; overflow: hidden;">
<tt></tt></div>
<center style="background-color: white; color: #333333; font-family: Verdana, arial; font-size: 13px; line-height: 20.796875px;">
<table border="0" cellpadding="4" cellspacing="2" style="width: 551px;"><tbody>
<tr><td bgcolor="#66ffff" valign="top" width="91"><span style="color: #004000;">#66FFFF</span></td><td bgcolor="#66ffcc" class="mbt_out" style="border: 0px;" valign="top" width="89"><span style="color: #004000;">#66FFCC</span></td><td bgcolor="#66ff99" class="mbt_out" style="border: 0px;" valign="top" width="87"><span style="color: #004000;">#66FF99</span></td><td bgcolor="#66ff66" valign="top" width="86"><span style="color: #004000;">#66FF66</span></td><td bgcolor="#66ff33" class="mbt_out" style="border: 0px;" valign="top" width="86"><span style="color: #004000;">#66FF33</span></td><td bgcolor="#66ff00" class="mbt_out" style="border: 0px;" valign="top" width="96"><span style="color: #004000;">#66FF00</span></td></tr>
<tr><td bgcolor="#66ccff" class="mbt_out" style="border: 0px;" valign="top" width="89"><span style="color: #004000;">#66CCFF</span></td><td bgcolor="#66cccc" class="mbt_out" style="border: 0px;" valign="top" width="89"><span style="color: #004000;">#66CCCC</span></td><td bgcolor="#66cc99" class="mbt_out" style="border: 0px;" valign="top" width="87"><span style="color: #004000;">#66CC99</span></td><td bgcolor="#66cc66" class="mbt_out" style="border: 0px;" valign="top" width="87"><span style="color: #004000;">#66CC66</span></td><td bgcolor="#66cc33" class="mbt_out" style="border: 0px;" valign="top" width="87"><span style="color: #004000;">#66CC33</span></td><td bgcolor="#66cc00" class="mbt_out" style="border: 0px;" valign="top" width="96"><span style="color: #004000;">#66CC00</span></td></tr>
<tr><td bgcolor="#6699ff" class="mbt_out" style="border: 0px;" valign="top" width="90"><span style="color: #004000;">#6699FF</span></td><td bgcolor="#6699cc" class="mbt_out" style="border: 0px;" valign="top" width="88"><span style="color: #004000;">#6699CC</span></td><td bgcolor="#669999" class="mbt_out" style="border: 0px;" valign="top" width="87"><span style="color: #004000;">#669999</span></td><td bgcolor="#669966" class="mbt_out" style="border: 0px;" valign="top" width="87"><span style="color: #004000;">#669966</span></td><td bgcolor="#669933" class="mbt_out" style="border: 0px;" valign="top" width="87"><span style="color: #004000;">#669933</span></td><td bgcolor="#669900" valign="top" width="96"><span style="color: #004000;">#669900</span></td></tr>
<tr><td bgcolor="#6666ff" class="mbt_out" style="border: 0px;" valign="top" width="90"><span style="color: white;">#6666FF</span></td><td bgcolor="#6666cc" class="mbt_out" style="border: 0px;" valign="top" width="88"><span style="color: white;">#6666CC</span></td><td bgcolor="#666699" valign="top" width="87"><span style="color: white;">#666699</span></td><td bgcolor="#666666" class="mbt_out" style="border: 0px;" valign="top" width="87"><span style="color: white;">#666666</span></td><td bgcolor="#666633" class="mbt_out" style="border: 0px;" valign="top" width="87"><span style="color: white;">#666633</span></td><td bgcolor="#666600" class="mbt_out" style="border: 0px;" valign="top" width="96"><span style="color: white;">#666600</span></td></tr>
<tr><td bgcolor="#6633ff" class="mbt_out" style="border: 0px;" valign="top" width="90"><span style="color: white;">#6633FF</span></td><td bgcolor="#6633cc" valign="top" width="88"><span style="color: white;">#6633CC</span></td><td bgcolor="#663399" class="mbt_out" style="border: 0px;" valign="top" width="87"><span style="color: white;">#663399</span></td><td bgcolor="#663366" class="mbt_out" style="border: 0px;" valign="top" width="87"><span style="color: white;">#663366</span></td><td bgcolor="#663333" class="mbt_out" style="border: 0px;" valign="top" width="87"><span style="color: white;">#663333</span></td><td bgcolor="#663300" valign="top" width="96"><span style="color: white;">#663300</span></td></tr>
<tr><td bgcolor="#6600ff" valign="top" width="90"><span style="color: white;">#6600FF</span></td><td bgcolor="#6600cc" class="mbt_out" style="border: 0px;" valign="top" width="88"><span style="color: white;">#6600CC</span></td><td bgcolor="#660099" class="mbt_out" style="border: 0px;" valign="top" width="87"><span style="color: white;">#660099</span></td><td bgcolor="#660066" valign="top" width="87"><span style="color: white;">#660066</span></td><td bgcolor="#660033" valign="top" width="87"><span style="color: white;">#660033</span></td><td bgcolor="#660000" valign="top" width="96"><span style="color: white;">#660000</span></td></tr>
</tbody></table>
</center>
<div style="background-color: white; color: #333333; font-family: Verdana, arial; font-size: 13px; line-height: 20.796875px; margin-top: 22px; overflow: hidden;">
<span style="color: white;"></span></div>
<center style="background-color: white; color: #333333; font-family: Verdana, arial; font-size: 13px; line-height: 20.796875px;">
<table border="0" cellpadding="4" cellspacing="2" style="width: 551px;"><tbody>
<tr><td bgcolor="#33ffff" class="mbt_out" style="border: 0px;" valign="top" width="91"><span style="color: #004000;">#33FFFF</span></td><td bgcolor="#33ffcc" class="mbt_out" style="border: 0px;" valign="top" width="89"><span style="color: #004000;">#33FFCC</span></td><td bgcolor="#33ff99" class="mbt_out" style="border: 0px;" valign="top" width="87"><span style="color: #004000;">#33FF99</span></td><td bgcolor="#33ff66" valign="top" width="86"><span style="color: #004000;">#33FF66</span></td><td bgcolor="#33ff33" class="mbt_out" style="border: 0px;" valign="top" width="86"><span style="color: #004000;">#33FF33</span></td><td bgcolor="#33ff00" class="mbt_out" style="border: 0px;" valign="top" width="96"><span style="color: #004000;">#33FF00</span></td></tr>
<tr><td bgcolor="#03ccf0" valign="top" width="89"><span style="color: #004000;">#33CCFF</span></td><td bgcolor="#33cccc" class="mbt_out" style="border: 0px;" valign="top" width="89"><span style="color: #004000;">#33CCCC</span></td><td bgcolor="#33cc99" class="mbt_out" style="border: 0px;" valign="top" width="87"><span style="color: #004000;">#33CC99</span></td><td bgcolor="#33cc66" class="mbt_out" style="border: 0px;" valign="top" width="87"><span style="color: #004000;">#33CC66</span></td><td bgcolor="#33cc33" class="mbt_out" style="border: 0px;" valign="top" width="87"><span style="color: #004000;">#33CC33</span></td><td bgcolor="#33cc00" class="mbt_out" style="border: 0px;" valign="top" width="96"><span style="color: #004000;">#33CC00</span></td></tr>
<tr><td bgcolor="#3399ff" class="mbt_out" style="border: 0px;" valign="top" width="90"><span style="color: #004000;">#3399FF</span></td><td bgcolor="#3399cc" class="mbt_out" style="border: 0px;" valign="top" width="88"><span style="color: #004000;">#3399CC</span></td><td bgcolor="#339999" class="mbt_out" style="border: 0px;" valign="top" width="87"><span style="color: #004000;">#339999</span></td><td bgcolor="#339966" valign="top" width="87"><span style="color: #004000;">#339966</span></td><td bgcolor="#339933" class="mbt_out" style="border: 0px;" valign="top" width="87"><span style="color: #004000;">#339933</span></td><td bgcolor="#339900" valign="top" width="96"><span style="color: #004000;">#339900</span></td></tr>
<tr><td bgcolor="#3366ff" class="mbt_out" style="border: 0px;" valign="top" width="90"><span style="color: white;">#3366FF</span></td><td bgcolor="#3366cc" class="mbt_out" style="border: 0px;" valign="top" width="88"><span style="color: white;">#3366CC</span></td><td bgcolor="#336699" class="mbt_out" style="border: 0px;" valign="top" width="87"><span style="color: white;">#336699</span></td><td bgcolor="#336666" valign="top" width="87"><span style="color: white;">#336666</span></td><td bgcolor="#336633" class="mbt_out" style="border: 0px;" valign="top" width="87"><span style="color: white;">#336633</span></td><td bgcolor="#336600" class="mbt_out" style="border: 0px;" valign="top" width="96"><span style="color: white;">#336600</span></td></tr>
<tr><td bgcolor="#3333ff" valign="top" width="90"><span style="color: white;">#3333FF</span></td><td bgcolor="#3333cc" valign="top" width="88"><span style="color: white;">#3333CC</span></td><td bgcolor="#333399" class="mbt_out" style="border: 0px;" valign="top" width="87"><span style="color: white;">#333399</span></td><td bgcolor="#333366" class="mbt_out" style="border: 0px;" valign="top" width="87"><span style="color: white;">#333366</span></td><td bgcolor="#333333" valign="top" width="87"><span style="color: white;">#333333</span></td><td bgcolor="#333300" class="mbt_out" style="border: 0px;" valign="top" width="96"><span style="color: white;">#333300</span></td></tr>
<tr><td bgcolor="#3300ff" valign="top" width="90"><span style="color: white;">#3300FF</span></td><td bgcolor="#3300cc" class="mbt_out" style="border: 0px;" valign="top" width="88"><span style="color: white;">#3300CC</span></td><td bgcolor="#330099" class="mbt_out" style="border: 0px;" valign="top" width="87"><span style="color: white;">#330099</span></td><td bgcolor="#330066" class="mbt_out" style="border: 0px;" valign="top" width="87"><span style="color: white;">#330066</span></td><td bgcolor="#330033" valign="top" width="87"><span style="color: white;">#330033</span></td><td bgcolor="#330000" valign="top" width="96"><span style="color: white;">#330000</span></td></tr>
</tbody></table>
</center>
<div style="background-color: white; color: #333333; font-family: Verdana, arial; font-size: 13px; line-height: 20.796875px; margin-top: 22px; overflow: hidden;">
</div>
<center style="background-color: white; color: #333333; font-family: Verdana, arial; font-size: 13px; line-height: 20.796875px;">
<table border="0" cellpadding="4" cellspacing="2" style="width: 551px;"><tbody>
<tr><td bgcolor="#00ffff" class="mbt_out" style="border: 0px;" valign="top" width="91"><span style="color: #004000;">#00FFFF</span></td><td bgcolor="#00ffcc" valign="top" width="89"><span style="color: #004000;">#00FFCC</span></td><td bgcolor="#00ff99" class="mbt_out" style="border: 0px;" valign="top" width="87"><span style="color: #004000;">#00FF99</span></td><td bgcolor="#00ff66" class="mbt_out" style="border: 0px;" valign="top" width="86"><span style="color: #004000;">#00FF66</span></td><td bgcolor="#00ff33" class="mbt_out" style="border: 0px;" valign="top" width="86"><span style="color: #004000;">#00FF33</span></td><td bgcolor="#00ff00" class="mbt_out" style="border: 0px;" valign="top" width="96"><span style="color: #004000;">#00FF00</span></td></tr>
<tr><td bgcolor="#00ccff" class="mbt_out" style="border: 0px;" valign="top" width="89"><span style="color: #004000;">#00CCFF</span></td><td bgcolor="#00cccc" class="mbt_out" style="border: 0px;" valign="top" width="89"><span style="color: #004000;">#00CCCC</span></td><td bgcolor="#00cc99" valign="top" width="87"><span style="color: #004000;">#00CC99</span></td><td bgcolor="#00cc66" class="mbt_out" style="border: 0px;" valign="top" width="87"><span style="color: #004000;">#00CC66</span></td><td bgcolor="#00cc33" class="mbt_out" style="border: 0px;" valign="top" width="87"><span style="color: #004000;">#00CC33</span></td><td bgcolor="#00cc00" class="mbt_out" style="border: 0px;" valign="top" width="96"><span style="color: #004000;">#00CC00</span></td></tr>
<tr><td bgcolor="#0099ff" class="mbt_out" style="border: 0px;" valign="top" width="90"><span style="color: #004000;">#0099FF</span></td><td bgcolor="#0099cc" class="mbt_out" style="border: 0px;" valign="top" width="88"><span style="color: #004000;">#0099CC</span></td><td bgcolor="#009999" class="mbt_out" style="border: 0px;" valign="top" width="87"><span style="color: #004000;">#009999</span></td><td bgcolor="#009966" class="mbt_out" style="border: 0px;" valign="top" width="87"><span style="color: #004000;">#009966</span></td><td bgcolor="#009933" class="mbt_out" style="border: 0px;" valign="top" width="87"><span style="color: #004000;">#009933</span></td><td bgcolor="#009900" class="mbt_out" style="border: 0px;" valign="top" width="96"><span style="color: #004000;">#009900</span></td></tr>
<tr><td bgcolor="#0066ff" class="mbt_out" style="border: 0px;" valign="top" width="90"><span style="color: white;">#0066FF</span></td><td bgcolor="#0066cc" class="mbt_out" style="border: 0px;" valign="top" width="88"><span style="color: white;">#0066CC</span></td><td bgcolor="#006699" class="mbt_out" style="border: 0px;" valign="top" width="87"><span style="color: white;">#006699</span></td><td bgcolor="#006666" class="mbt_out" style="border: 0px;" valign="top" width="87"><span style="color: white;">#006666</span></td><td bgcolor="#006633" class="mbt_out" style="border: 0px;" valign="top" width="87"><span style="color: white;">#006633</span></td><td bgcolor="#006600" class="mbt_out" style="border: 0px;" valign="top" width="96"><span style="color: white;">#006600</span></td></tr>
<tr><td bgcolor="#0033ff" class="mbt_out" style="border: 0px;" valign="top" width="90"><span style="color: white;">#0033FF</span></td><td bgcolor="#0033cc" class="mbt_out" style="border: 0px;" valign="top" width="88"><span style="color: white;">#0033CC</span></td><td bgcolor="#003399" valign="top" width="87"><span style="color: white;">#003399</span></td><td bgcolor="#003366" class="mbt_out" style="border: 0px;" valign="top" width="87"><span style="color: white;">#003366</span></td><td bgcolor="#003333" class="mbt_out" style="border: 0px;" valign="top" width="87"><span style="color: white;">#003333</span></td><td bgcolor="#003300" valign="top" width="96"><span style="color: white;">#003300</span></td></tr>
<tr><td bgcolor="#0000ff" class="mbt_out" style="border: 0px;" valign="top" width="90"><span style="color: white;">#0000FF</span></td><td bgcolor="#0000cc" class="mbt_out" style="border: 0px;" valign="top" width="88"><span style="color: white;">#0000CC</span></td><td bgcolor="#000099" class="mbt_out" style="border: 0px;" valign="top" width="87"><span style="color: white;">#000099</span></td><td bgcolor="#000066" class="mbt_out" style="border: 0px;" valign="top" width="87"><span style="color: white;">#000066</span></td><td bgcolor="#000033" class="mbt_out" style="border: 0px;" valign="top" width="87"><span style="color: white;">#000033</span></td><td bgcolor="#000000" class="mbt_out" style="border: 0px;" valign="top" width="96"><span style="color: white;">#000000</span></td></tr>
</tbody></table>
</center>
</div>
Ghous uddinhttp://www.blogger.com/profile/13773797017118313457noreply@blogger.com0tag:blogger.com,1999:blog-9181450838141665570.post-62095003284997640052015-01-28T19:57:00.006-08:002015-03-15T11:41:24.872-07:00Easy Steps how to upload softwares documents files for your blogger <div dir="ltr" style="text-align: left;" trbidi="on">
You can only upload images, videos, and sofware files to blogspot (blogger). For other types of file you must find your own hosting.<br />
<br />
There is a limit of 300MB on the images you are uploading to a BlogSpot blog. <br />
<b>Where to host javascript and similar files?</b><br />
For non image files (for example css, javascript...) you can use one of the following services. <br />
<br />
Free hosting services :<br />
<a href="https://www.blogger.com/null" name="more"></a><br />
<br />
<b><a href="http://www.opendrive.com/?od=4f284e4a30e67">OpenDrive</a></b> - in this moment in my opinion this is a best choice. OpenDrive have 5Gb free space storage and bandwith of 1Gb per day. You can use OpenDrive service to host javascript files with javascript functions which you can call from your blogspot posts as an <b>external javascript file</b>.<br />
<ul>
<li>First you need to sign in on this service</li>
<br />
<li>after you are signed in, go to files tab <br /><div class="separator" style="clear: both; text-align: center;">
<img alt="OpenDrive user interface, marked Files tab, Upload link, little arrow in upper right corner of file, showed context menu when a little arrow is clicked" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiFGwB4WnuMauM-FezxCnXZglW8y6dg-Rdh8Oo7bd_irgbS1krkWtUinb_ZA83ya3uFcnRzG8hOXuho2h1BSxlcx-D45hEUMzwpRHaNMr6bbImrXmDeCjF9R7GTB1WsAGV9aktR4Q_aJUE/s320/OpenDriveSm.jpg" height="233" width="320" /></div>
</li>
<br /><br />
<li>under Files tab is a Upload option with which you can easily upload files from your computer to OpenDrive service</li>
<br />
<li>after file is uploaded you can see uploaded file inside MyDocuments in OpenDrive</li>
<br />
<li>when you hover your mouse over uploaded file there is a little arrow in upper right corner, when this arrow is clicked you can choose Links</li>
<br />
<li>in Links screen you can find: <br /><br /><ul>
<li>Direct link - this is a link you can choose for include javascript files in blogger post</li>
<br />
<li>Direct link - link for direct download</li>
</ul>
</li>
</ul>
<br />
OpenDrive bought few small firms who are offer free hosting of files. In the end of 2011 OpenDrive had a serious incident where they lost some of their users files. I believe they learned from this accident and will not repeat same mistake. So, be careful, my advice is to always keep backup files on your local computer or even better at two different cloud providers.<br />
<br />
<br />
<br />
<span style="color: #f6b26b;"><span style="font-size: large;"><u><b>Next one </b></u></span></span><br />
<br />
<br />
<h4>
DropBox</h4>
<b><a href="http://www.dropbox.com/">DropBox</a></b> - excellent tool for sharing files and for upload and host files for your web or blog. Basic account is free and give you storage 2Gb of data.<br />
To host files with dropbox you need: <br />
<ul>
<li>download and install DropBox on your computer/li> </li>
<li>open DropBox application - it will open Dropbox folder with Windows explorer</li>
<br />
<li>open Public folder and put a file you want to host in this Public folder</li>
<br />
<li>right click on file and choose DropBox --> Copy public link <div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhxV1zalAiiHf7xDAmVYkg2-LiAwD6mAZKRMr9_d-SDP7Kq1Hij60t1nLH8KP8E3JwhBzTbjMNscoufmISiDYG4W3QY_0aYAQdPpNDdNNtLSFf3xK8Iw27czAqCKvGXZnVeBEUjKBj_3oM/s1600/UploadaAndHostFileWithDropBoxSm.jpg" style="clear: left; float: left; margin-bottom: 1em; margin-right: 1em;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhxV1zalAiiHf7xDAmVYkg2-LiAwD6mAZKRMr9_d-SDP7Kq1Hij60t1nLH8KP8E3JwhBzTbjMNscoufmISiDYG4W3QY_0aYAQdPpNDdNNtLSFf3xK8Iw27czAqCKvGXZnVeBEUjKBj_3oM/s400/UploadaAndHostFileWithDropBoxSm.jpg" height="369" width="400" /></a></div>
<br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /></li>
<li>now you have a link in clipboard which you can embedded in your site, just paste it</li>
<br />
<li>if you don't want your visitors open a shared file but to download it add <i>?dl=1</i> to end of link <br />For example: <br />http://files.dropbox.com/u/12345678/MyFile.pdf <br />becomes <br />http://files.dropbox.com/u/12345678/MyFile.pdf?dl=1 </li>
</ul>
<br />
<br />
<br />
<br /></div>
Ghous uddinhttp://www.blogger.com/profile/13773797017118313457noreply@blogger.com0tag:blogger.com,1999:blog-9181450838141665570.post-11094574342666378842015-01-28T19:43:00.005-08:002015-03-15T11:41:43.229-07:00How to change blogger title for each posts in blogger<div dir="ltr" style="text-align: left;" trbidi="on">
<h4 style="color: #333333; font-family: Verdana, sans-serif; font-size: 13px; line-height: 19.5px;">
</h4>
<span style="background-color: white;"><br style="color: #333333; font-family: Verdana, sans-serif; font-size: 13px; line-height: 19.5px;" /><span style="color: #333333; font-family: Verdana, sans-serif; font-size: 13px; line-height: 19.5px;">This guide ensures keywords in your post titles are discovered more easily. To do this you will have to change template. Follow this blogspot tutorial to change your title in [POST TITLE: BLOG TITLE] format and achieve better google search result page ranking for your posts:</span></span><br />
<ul style="color: #333333; font-family: Verdana, sans-serif; font-size: 13px; line-height: 19.5px; list-style: none; margin-left: 10px; padding: 0px;">
<li style="background-attachment: initial; background-clip: initial; background-image: url(http://www.blogblog.com/tictac_blue/tictac_blue.gif); background-origin: initial; background-position: 0% 6px; background-repeat: no-repeat; background-size: initial; list-style: none; margin-bottom: 3px; padding-left: 14px;"><span style="background-color: white;">go to Layout --> Edit HTML<br /><br /><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjQXoJHShBSr_xSkMvCtl4q87sNCmJuR57xwmOPdKuhaaHBpU-aJhUGX_GVNEt9eKvrfhXqMFaND1Cf6ozcmtquY7522U6X5plVMexs32wtVkYu-ujsPpcsMwC-7yYncP9wBiSuQjmylNQ/s1600-h/EditHTMLBloggerSm.JPG" style="color: #666699;"><img alt="Layout - Edit HTML" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjQXoJHShBSr_xSkMvCtl4q87sNCmJuR57xwmOPdKuhaaHBpU-aJhUGX_GVNEt9eKvrfhXqMFaND1Cf6ozcmtquY7522U6X5plVMexs32wtVkYu-ujsPpcsMwC-7yYncP9wBiSuQjmylNQ/s320/EditHTMLBloggerSm.JPG" id="BLOGGER_PHOTO_ID_5361749913387625298" style="border-color: rgb(221, 221, 221) rgb(192, 192, 192) rgb(192, 192, 192) rgb(221, 221, 221); border-style: solid; border-width: 1px; cursor: pointer; height: 53px; padding: 6px; width: 320px;" /></a></span></li>
<span style="background-color: white;"><br /></span>
<li style="background-attachment: initial; background-clip: initial; background-image: url(http://www.blogblog.com/tictac_blue/tictac_blue.gif); background-origin: initial; background-position: 0% 6px; background-repeat: no-repeat; background-size: initial; list-style: none; margin-bottom: 3px; padding-left: 14px;"><span style="background-color: white;">in Edit Template box find this code:<a href="https://www.blogger.com/null" name="more"></a></span><pre style="border-style: solid; border-width: 1px; font-size: 0.9em; padding: 3ex; white-space: pre-wrap; word-wrap: break-word;"><span style="background-color: white; font-weight: bold;"><span style="color: brown;"><title><data:blog.pageTitle/></title></span></span></pre>
<span style="background-color: white;"><br /></span></li>
<span style="background-color: white;"><br /></span>
<li style="background-attachment: initial; background-clip: initial; background-image: url(http://www.blogblog.com/tictac_blue/tictac_blue.gif); background-origin: initial; background-position: 0% 6px; background-repeat: no-repeat; background-size: initial; list-style: none; margin-bottom: 3px; padding-left: 14px;"><span style="background-color: white;">and replace with this code</span><pre style="border-style: solid; border-width: 1px; font-size: 0.9em; padding: 3ex; white-space: pre-wrap; word-wrap: break-word;"><span style="background-color: white; font-weight: bold;"><span style="color: brown;">
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<title><data:blog.pageName/> :
<data:blog.title/></title>
<b:else/>
<title><data:blog.pageTitle/></title>
</b:if></span></span></pre>
<span style="background-color: white;"><br /></span></li>
<span style="background-color: white;"><br /></span>
<li style="background-attachment: initial; background-clip: initial; background-image: url(http://www.blogblog.com/tictac_blue/tictac_blue.gif); background-origin: initial; background-position: 0% 6px; background-repeat: no-repeat; background-size: initial; list-style: none; margin-bottom: 3px; padding-left: 14px;"><span style="background-color: white;">it is good idea to make backup of blogspot template before you click Save Template, new code tell that if visitor load certain post page title should be in [POST TITLE]: [BLOG TITLE] format, else title should be in [BLOG TITLE] format</span></li>
</ul>
<span style="color: #333333; font-family: Verdana, sans-serif; font-size: 13px; line-height: 19.5px;"> <b>And Enjoy</b></span></div>
Ghous uddinhttp://www.blogger.com/profile/13773797017118313457noreply@blogger.com0tag:blogger.com,1999:blog-9181450838141665570.post-8324874932025386002015-01-28T10:05:00.007-08:002015-03-14T21:08:14.793-07:005 Proven Quit Smoking Tips to Help You Give up Smoking<div dir="ltr" style="text-align: left;" trbidi="on">
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhLEMG3bARXPmmm0zWv_vLAjXe6K_g0nz09Sbc3Fsj460n5MqBWCHFUIbex_TOmhtEWetHXtrOzmzMQU6vHfb6U1zUFbapyi0TNpaZfcK7q4OuR8CeCcCCcehOK43D1vhywsCv7EJy3vQU/s1600/images.jpg" imageanchor="1" style="font-family: 'Times New Roman'; font-size: medium; margin-left: 1em; margin-right: 1em; text-align: center;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhLEMG3bARXPmmm0zWv_vLAjXe6K_g0nz09Sbc3Fsj460n5MqBWCHFUIbex_TOmhtEWetHXtrOzmzMQU6vHfb6U1zUFbapyi0TNpaZfcK7q4OuR8CeCcCCcehOK43D1vhywsCv7EJy3vQU/s1600/images.jpg" height="137" width="320" /></a></div>
<div style="background: rgb(255, 255, 255); border: 0px; color: #444444; font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 15px; margin-bottom: 20px; outline: 0px; padding: 0px; vertical-align: baseline;">
</div>
<div style="background: rgb(255, 255, 255); border: 0px; color: #444444; font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 15px; margin-bottom: 20px; outline: 0px; padding: 0px; vertical-align: baseline;">
Smoking is a habit that is pretty difficult to abandon. Once someone starts smoking and falls into a habit of lighting a cigarette, it becomes very hard to give up the habit. The body gets used to the nicotine and reacts badly when deprived of it. Moreover, the mind also falls into a habit of thinking that the cigarette causes it to relax when tense and thus, starts to crave for the cigarette whenever tense. And these reasons make quitting smoking extremely difficult. However, it’s not impossible. Yes, it needs a lot of willpower but it’s possible. Whether you started to smoke due to peer pressure or because it seemed a cool idea, these quit smoking tips<br />
<a href="https://www.blogger.com/null" name="more"></a>would help you get across the line and give up the habit once and for all.</div>
<h3 style="background: rgb(255, 255, 255); border: 0px; color: #0a73dc; font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 18px; margin: 30px 0px 20px; outline: 0px; padding: 0px; vertical-align: baseline;">
Note down the Reasons for Quitting</h3>
<div style="background: rgb(255, 255, 255); border: 0px; color: #444444; font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 15px; margin-bottom: 20px; outline: 0px; padding: 0px; vertical-align: baseline;">
<br /></div>
<div style="background: rgb(255, 255, 255); border: 0px; color: #444444; font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 15px; margin-bottom: 20px; outline: 0px; padding: 0px; vertical-align: baseline;">
Knowing your motivation for quitting smoking can help you substantially. Many people try to quit smoking after a certain event but forget it soon after and go back to their old ways. If you want to quit then you must make sure that you remember all of the reasons for which you want to quit smoking. Writing down all the reasons and then keeping the list with you at all times can really help you when you have the craving to light up a cigarette. If you can keep the list in the form of graphics then it would be all the more better.</div>
<h3 style="background: rgb(255, 255, 255); border: 0px; color: #0a73dc; font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 18px; margin: 30px 0px 20px; outline: 0px; padding: 0px; vertical-align: baseline;">
Tell Your Friends and Family about Your Decision</h3>
<div style="background: rgb(255, 255, 255); border: 0px; color: #444444; font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 15px; margin-bottom: 20px; outline: 0px; padding: 0px; vertical-align: baseline;">
<br /></div>
<div style="background: rgb(255, 255, 255); border: 0px; color: #444444; font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 15px; margin-bottom: 20px; outline: 0px; padding: 0px; vertical-align: baseline;">
Sharing news of your decision with your friends and family will not only help you get encouraging responses but will also help you in your weak moments. For instance, if you would have told your friend that you are quitting smoking and then light up a cigarette while with him, he/she would remind you of your pledge and would make you throw away the cigarette too. Things might get complicated if your friends or family members smoke as well. In such a case, you should motivate them to quit smoking as well and then, decide to quit as a group. You would be able to take inspiration from the others and others will take heart from you and as a result, all of you combined would be able to get over the line.</div>
<h3 style="background: rgb(255, 255, 255); border: 0px; color: #0a73dc; font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 18px; margin: 30px 0px 20px; outline: 0px; padding: 0px; vertical-align: baseline;">
Know Your Triggers</h3>
<div style="background: rgb(255, 255, 255); border: 0px; color: #444444; font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 15px; margin-bottom: 20px; outline: 0px; padding: 0px; vertical-align: baseline;">
<br /></div>
<div style="background: rgb(255, 255, 255); border: 0px; color: #444444; font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 15px; margin-bottom: 20px; outline: 0px; padding: 0px; vertical-align: baseline;">
There are always a few triggers that trigger the urge to smoke. Some people light up a cigarette after having a drink while some do so right after a long day. There are always a couple of triggers and if you can identify the moments when your urge for a cigarette is at its peak, you can make sure that you avoid those triggers/moments during the first few weeks. For instance, if you have a smoke after consuming alcohol, you should try not to drink at all or to drink in the presence of a friend or family member who would stop you from lighting up a cigarette.</div>
<h3 style="background: rgb(255, 255, 255); border: 0px; color: #0a73dc; font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 18px; margin: 30px 0px 20px; outline: 0px; padding: 0px; vertical-align: baseline;">
Mark Each Day on the Calendar</h3>
<div style="background: rgb(255, 255, 255); border: 0px; color: #444444; font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 15px; margin-bottom: 20px; outline: 0px; padding: 0px; vertical-align: baseline;">
<br /></div>
<div style="background: rgb(255, 255, 255); border: 0px; color: #444444; font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 15px; margin-bottom: 20px; outline: 0px; padding: 0px; vertical-align: baseline;">
The first few weeks are the toughest and you can treat each day without a cigarette as a successful day. By marking each day since you have not lighted a cigarette, you would give yourself belief after each passing day that you can actually quit the habit. After a few weeks, the marked dates would serve as deterrence for you as you would be reminded of the hard work you have done to stop yourself for so many days.</div>
<h3 style="background: rgb(255, 255, 255); border: 0px; color: #0a73dc; font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 18px; margin: 30px 0px 20px; outline: 0px; padding: 0px; vertical-align: baseline;">
Stay Positive</h3>
<div style="background: rgb(255, 255, 255); border: 0px; color: #444444; font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 15px; margin-bottom: 20px; outline: 0px; padding: 0px; vertical-align: baseline;">
<br /></div>
<div class="separator" style="clear: both; text-align: center;">
<br /></div>
<div style="background: rgb(255, 255, 255); border: 0px; color: #444444; font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 15px; margin-bottom: 20px; outline: 0px; padding: 0px; vertical-align: baseline;">
You would start feeling depressed with each passing day while your heightened craving would start to sow doubts in your mind about whether or not you can give up smoking after all. However, you should stay positive by telling everyone that you don’t smoke, by tasting different food items and feeling the difference and by seeing the difference in your breath as well. Another way to keep yourself positive would be to eat your favorite food item or hangout at your favorite restaurant with the money you would save by not smoking. Such treats would also serve as motivation to drown the craving of cigarettes.</div>
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgE5lk50J9x9llGstbfn1XU-l3vuapQPJm37nCS3PJK5xqaafSSPnACX-3smdanGmNMP-Emw49xeffwUrA1wyC999jfwzOkwRlz_A_2NVNpUOwLUNPCjOkvzoDS4vLsGPlPpBNRIREm2Ak/s1600/download.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgE5lk50J9x9llGstbfn1XU-l3vuapQPJm37nCS3PJK5xqaafSSPnACX-3smdanGmNMP-Emw49xeffwUrA1wyC999jfwzOkwRlz_A_2NVNpUOwLUNPCjOkvzoDS4vLsGPlPpBNRIREm2Ak/s1600/download.jpg" /></a></div>
</div>
Ghous uddinhttp://www.blogger.com/profile/13773797017118313457noreply@blogger.com0tag:blogger.com,1999:blog-9181450838141665570.post-45356869920762242792015-01-28T10:01:00.004-08:002015-03-10T05:31:21.912-07:006 Retirement Tips that will help You Live a Happy Retired Life<div dir="ltr" style="text-align: left;" trbidi="on"><div style="background: rgb(255, 255, 255); border: 0px; color: #444444; font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 15px; margin-bottom: 20px; outline: 0px; padding: 0px; vertical-align: baseline;">Retirement is an inevitable junction in the life of every man and woman. After years of toil and hard work, there comes a time when a person has to hang his boots and start living the life of a retired person. Most people think that retirement signifies the end of your productive years and now all you have to do is to relax and spend your remaining days in a peaceful manner. While there is nothing wrong with this theory, it is not entirely correct as well because there are many activities that even retired people can do to make their life productive. The following are some retirement tips that can assist you in living a happy retired life.<br /><a name='more'></a></div><h2 style="background: rgb(255, 255, 255); border: 0px; color: #0a73dc; font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 20px; margin: 30px 0px 20px; outline: 0px; padding: 0px; vertical-align: baseline;">Start a Part-Time Job</h2><div style="background: rgb(255, 255, 255); border: 0px; color: #444444; font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 15px; margin-bottom: 20px; outline: 0px; padding: 0px; vertical-align: baseline;"><br /></div><div style="background: rgb(255, 255, 255); border: 0px; color: #444444; font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 15px; margin-bottom: 20px; outline: 0px; padding: 0px; vertical-align: baseline;">Retirement does not mean that you have to stop earning altogether. You can always get a part-time job at the same company where you were employed before retirement and continue to earn your bread yourself. Besides this, there are other part-time jobs available for seniors as well that can help you in easing your financial troubles after retirement. These jobs can help you in remaining active and prove to be good for your health as well.</div><h2 style="background: rgb(255, 255, 255); border: 0px; color: #0a73dc; font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 20px; margin: 30px 0px 20px; outline: 0px; padding: 0px; vertical-align: baseline;">Take up a Hobby</h2><div style="background: rgb(255, 255, 255); border: 0px; color: #444444; font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 15px; margin-bottom: 20px; outline: 0px; padding: 0px; vertical-align: baseline;"><br /></div><div style="background: rgb(255, 255, 255); border: 0px; color: #444444; font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 15px; margin-bottom: 20px; outline: 0px; padding: 0px; vertical-align: baseline;">If you are financially secure and do not have the need or desire to work anymore then taking up a hobby is a great option for you after retirement. Most people have a hobby that they want to pursue earlier on in their life but are not able to find time for it. Once you have retired, you have all the time in the world to pursue that hobby of yours. Even if you do not have an old hobby to fall back on, you can always start a new one to keep yourself busy with.</div><h2 style="background: rgb(255, 255, 255); border: 0px; color: #0a73dc; font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 20px; margin: 30px 0px 20px; outline: 0px; padding: 0px; vertical-align: baseline;">Volunteering is Fun</h2><div style="background: rgb(255, 255, 255); border: 0px; color: #444444; font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 15px; margin-bottom: 20px; outline: 0px; padding: 0px; vertical-align: baseline;"><br /></div><div style="background: rgb(255, 255, 255); border: 0px; color: #444444; font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 15px; margin-bottom: 20px; outline: 0px; padding: 0px; vertical-align: baseline;">Giving back to the society is a great way of spending your retirement years. Enrol yourself in community service or get involved with a volunteer program. You are going to find great joy and satisfaction in helping others and might find a nee purpose for your life as well. There are a number of volunteer programs that are available for older adults that you can join for serving your community.</div><h2 style="background: rgb(255, 255, 255); border: 0px; color: #0a73dc; font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 20px; margin: 30px 0px 20px; outline: 0px; padding: 0px; vertical-align: baseline;">It’s never too late to Learn</h2><div style="background: rgb(255, 255, 255); border: 0px; color: #444444; font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 15px; margin-bottom: 20px; outline: 0px; padding: 0px; vertical-align: baseline;"><br /></div><div style="background: rgb(255, 255, 255); border: 0px; color: #444444; font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 15px; margin-bottom: 20px; outline: 0px; padding: 0px; vertical-align: baseline;">If the pressures of your job or the responsibility of raising children had stopped you from completing your education then the time after retirement is perfect for you to earn that college degree. There are many colleges and universities that are now offering senior citizens the chance to earn degrees or complete their education through special education programs that are designed especially for them. The best thing about these education programs is that they offer discounts to the retired people so you won’t have to pay much for receiving education as well.</div><h2 style="background: rgb(255, 255, 255); border: 0px; color: #0a73dc; font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 20px; margin: 30px 0px 20px; outline: 0px; padding: 0px; vertical-align: baseline;">You can Always Teach</h2><div style="background: rgb(255, 255, 255); border: 0px; color: #444444; font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 15px; margin-bottom: 20px; outline: 0px; padding: 0px; vertical-align: baseline;"><br /></div><div style="background: rgb(255, 255, 255); border: 0px; color: #444444; font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 15px; margin-bottom: 20px; outline: 0px; padding: 0px; vertical-align: baseline;">Teaching is a great way of spending your retirement years as well. Even if you do not have any experience of teaching, you can easily get the job of a teacher in schools and colleges that are looking for teachers with on-field experience. It is up to you to teach for free or take up the job of a full-time teacher.</div><h2 style="background: rgb(255, 255, 255); border: 0px; color: #0a73dc; font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 20px; margin: 30px 0px 20px; outline: 0px; padding: 0px; vertical-align: baseline;">Set Out On an Expedition</h2><div style="background: rgb(255, 255, 255); border: 0px; color: #444444; font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 15px; margin-bottom: 20px; outline: 0px; padding: 0px; vertical-align: baseline;"><br /></div><div style="background: rgb(255, 255, 255); border: 0px; color: #444444; font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 15px; margin-bottom: 20px; outline: 0px; padding: 0px; vertical-align: baseline;">During your youth and working years, you might have had little time to go an expedition. Well, the retirement years are the best ones for you to fulfil this wish of yours. Choose a destination that you have always dreamt of going and set out on an adventure that is surely going to bring you lots of happiness. You can plan this expedition with a group of your retired friends or your partner.</div></div>Ghous uddinhttp://www.blogger.com/profile/13773797017118313457noreply@blogger.com0tag:blogger.com,1999:blog-9181450838141665570.post-71677013094184044972015-01-28T10:00:00.003-08:002015-03-10T05:31:21.947-07:00Top 10 Most Effective Weight Loss Tips for Women<div dir="ltr" style="text-align: left;" trbidi="on"><div style="background: rgb(255, 255, 255); border: 0px; color: #444444; font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 15px; margin-bottom: 20px; outline: 0px; padding: 0px; vertical-align: baseline;">Everybody wants to look smart but not everybody can curb their likeness for junk food and total dislike for physical exercise. And so, not everybody gets to have a smart and slender body. But there is nothing to despair about, you can always lose weight and achieve your goals! All you need to do is to believe in yourself and be intelligent in the measures you take to lose weight.</div><div style="background: rgb(255, 255, 255); border: 0px; color: #444444; font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 15px; margin-bottom: 20px; outline: 0px; padding: 0px; vertical-align: baseline;">Here are ten proven weight loss tips that can help you fit into that tight jeans you always wanted!<br /><a name='more'></a></div><h2 style="background: rgb(255, 255, 255); border: 0px; color: #0a73dc; font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 20px; margin: 30px 0px 20px; outline: 0px; padding: 0px; vertical-align: baseline;"><strong style="background: transparent; border: 0px; font-family: inherit; font-style: inherit; margin: 0px; outline: 0px; padding: 0px; vertical-align: baseline;">Use Smaller Cups and Smaller Plates</strong></h2><div style="background: rgb(255, 255, 255); border: 0px; color: #444444; font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 15px; margin-bottom: 20px; outline: 0px; padding: 0px; vertical-align: baseline;">You would never be able to really cut down on your food intake if you would continue to eat in the same bowls and plates. Our mind controls our appetite and it most often considers the stomach to be full when you have eaten a full bowl of noodles or a full plate of chicken curry. By using smaller cups and smaller plates, you would be able to reduce your food intake while satisfying your brain that you have eaten enough!</div><h2 style="background: rgb(255, 255, 255); border: 0px; color: #0a73dc; font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 20px; margin: 30px 0px 20px; outline: 0px; padding: 0px; vertical-align: baseline;"><strong style="background: transparent; border: 0px; font-family: inherit; font-style: inherit; margin: 0px; outline: 0px; padding: 0px; vertical-align: baseline;">Avoid Salty Snacks</strong></h2><div style="background: rgb(255, 255, 255); border: 0px; color: #444444; font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 15px; margin-bottom: 20px; outline: 0px; padding: 0px; vertical-align: baseline;">The untimely urge to have snacks can really hurt your pledge to lose weight. You can curb your urge to eat salty snacks by making yourself work to get them. For instance, if your stomach starts to grumble and starts asking for salty snacks then make sure that you would have to walk down to a super store to get them. Don’t ever stock them at your home. The work you would need to put it to get the snacks would most likely put you off. In case your urge is too much and you decide to go to super store, such a long walk would obviously help so much that a small snack won’t hurt that much!</div><h2 style="background: rgb(255, 255, 255); border: 0px; color: #0a73dc; font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 20px; margin: 30px 0px 20px; outline: 0px; padding: 0px; vertical-align: baseline;"><strong style="background: transparent; border: 0px; font-family: inherit; font-style: inherit; margin: 0px; outline: 0px; padding: 0px; vertical-align: baseline;">Consider Vegetables and Fruits Your Only Lifeline</strong></h2><div style="background: rgb(255, 255, 255); border: 0px; color: #444444; font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 15px; margin-bottom: 20px; outline: 0px; padding: 0px; vertical-align: baseline;">Incorporating vegetables and fruits would really help you in losing weight. While most women believe that cutting down on the food intake helps you lose weight, adding fruits and vegetables which contain vitamins and minerals and aid in food digestion actually disprove this theory. So, if you really want to lose weight, you should increase your intake of vegetables and fruits.</div><h2 style="background: rgb(255, 255, 255); border: 0px; color: #0a73dc; font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 20px; margin: 30px 0px 20px; outline: 0px; padding: 0px; vertical-align: baseline;"><strong style="background: transparent; border: 0px; font-family: inherit; font-style: inherit; margin: 0px; outline: 0px; padding: 0px; vertical-align: baseline;">Give Yourself a Cheat Day</strong></h2><div style="background: rgb(255, 255, 255); border: 0px; color: #444444; font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 15px; margin-bottom: 20px; outline: 0px; padding: 0px; vertical-align: baseline;">A cheat day is a day when you can eat whatever you want. The cheat day would be something to look forward to and would thus help you in concentrating on not trying the same unhealthy junk food on any other day.</div><h2 style="background: rgb(255, 255, 255); border: 0px; color: #0a73dc; font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 20px; margin: 30px 0px 20px; outline: 0px; padding: 0px; vertical-align: baseline;"><strong style="background: transparent; border: 0px; font-family: inherit; font-style: inherit; margin: 0px; outline: 0px; padding: 0px; vertical-align: baseline;">Water. Water. And More Water.</strong></h2><div style="background: rgb(255, 255, 255); border: 0px; color: #444444; font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 15px; margin-bottom: 20px; outline: 0px; padding: 0px; vertical-align: baseline;">Our water intake is not nearly enough and we mostly end up drinking beverages to end our thirst for water. And beverages often prove counterproductive. So, if you really want to lose weight then you should drink as much water as you can…somewhere around 12-16 glasses a day. If you can’t drink so much water then you can try fresh juices too.</div><h2 style="background: rgb(255, 255, 255); border: 0px; color: #0a73dc; font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 20px; margin: 30px 0px 20px; outline: 0px; padding: 0px; vertical-align: baseline;"><strong style="background: transparent; border: 0px; font-family: inherit; font-style: inherit; margin: 0px; outline: 0px; padding: 0px; vertical-align: baseline;">Start Yoga</strong></h2><div style="background: rgb(255, 255, 255); border: 0px; color: #444444; font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 15px; margin-bottom: 20px; outline: 0px; padding: 0px; vertical-align: baseline;">Yoga brings peace of mind and helps you exercise too. You won’t just workout a bit if you will start Yoga, you will gain self-control. And this self-control would go a long way into help you curb your urges to eat junk food.</div><h2 style="background: rgb(255, 255, 255); border: 0px; color: #0a73dc; font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 20px; margin: 30px 0px 20px; outline: 0px; padding: 0px; vertical-align: baseline;"><strong style="background: transparent; border: 0px; font-family: inherit; font-style: inherit; margin: 0px; outline: 0px; padding: 0px; vertical-align: baseline;">Skip the Night-time meals</strong></h2><div style="background: rgb(255, 255, 255); border: 0px; color: #444444; font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 15px; margin-bottom: 20px; outline: 0px; padding: 0px; vertical-align: baseline;">If you really want to skip a meal, it’s the night-time meal which should be skipped. If you cannot control your habit of eating between meals, it’s best to skip the night-time meal altogether. Reserve two nights each week for some of your favourite dishes and restaurants but on the other five nights, you then must skip the meal entirely.</div><h2 style="background: rgb(255, 255, 255); border: 0px; color: #0a73dc; font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 20px; margin: 30px 0px 20px; outline: 0px; padding: 0px; vertical-align: baseline;"><strong style="background: transparent; border: 0px; font-family: inherit; font-style: inherit; margin: 0px; outline: 0px; padding: 0px; vertical-align: baseline;">Take Your Dog for a Walk</strong></h2><div style="background: rgb(255, 255, 255); border: 0px; color: #444444; font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 15px; margin-bottom: 20px; outline: 0px; padding: 0px; vertical-align: baseline;">Taking your dog out for a walk is always a good idea because its enthusiasm to have a run would rub off on you and you would be compelled to follow. 10-20 minutes of walk each day can really work wonders for you and for your aim of losing weight.</div><h2 style="background: rgb(255, 255, 255); border: 0px; color: #0a73dc; font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 20px; margin: 30px 0px 20px; outline: 0px; padding: 0px; vertical-align: baseline;"><strong style="background: transparent; border: 0px; font-family: inherit; font-style: inherit; margin: 0px; outline: 0px; padding: 0px; vertical-align: baseline;">Drink Green Tea</strong></h2><div style="background: rgb(255, 255, 255); border: 0px; color: #444444; font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 15px; margin-bottom: 20px; outline: 0px; padding: 0px; vertical-align: baseline;">Green tea works wonders for the metabolism system and as a result, help you lose weight. Even though green tea won’t bring quick results, it would aid immensely in your fight against your over-weight body!</div><div style="background: rgb(255, 255, 255); border: 0px; color: #444444; font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 15px; margin-bottom: 20px; outline: 0px; padding: 0px; vertical-align: baseline;">When You Eat, Concentrate on Eating</div><div style="background: rgb(255, 255, 255); border: 0px; color: #444444; font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 15px; margin-bottom: 20px; outline: 0px; padding: 0px; vertical-align: baseline;">If you would concentrate on eating rather than on watching TV or on reading a newspaper or on browsing through Facebook, you will mostly end up eating more than you should. So, whenever you eat, concentrate on eating so that you don’t end up eating too much.</div></div>Ghous uddinhttp://www.blogger.com/profile/13773797017118313457noreply@blogger.com0tag:blogger.com,1999:blog-9181450838141665570.post-42154297742998622572015-01-28T09:58:00.006-08:002015-03-10T05:31:21.972-07:00Top 10 Memory Improvement Tips<div dir="ltr" style="text-align: left;" trbidi="on"><div style="background: rgb(255, 255, 255); border: 0px; color: #444444; font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 15px; margin-bottom: 20px; outline: 0px; padding: 0px; vertical-align: baseline;"><br /></div><h2 style="background: rgb(255, 255, 255); border: 0px; color: #0a73dc; font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 20px; margin: 30px 0px 20px; outline: 0px; padding: 0px; vertical-align: baseline;">Pay attention and focus</h2><div style="background: rgb(255, 255, 255); border: 0px; color: #444444; font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 15px; margin-bottom: 20px; outline: 0px; padding: 0px; vertical-align: baseline;">When you are studying anything related with your studies then you must find a place where you are free from distractions. In this manner you will be able to pay attention on the study material and focus on the important points. You can choose any place for studies so that you can avoid disturbance and remember the important points of your studies.<br /><a name='more'></a></div><h2 style="background: rgb(255, 255, 255); border: 0px; color: #0a73dc; font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 20px; margin: 30px 0px 20px; outline: 0px; padding: 0px; vertical-align: baseline;">Proper schedule</h2><div style="background: rgb(255, 255, 255); border: 0px; color: #444444; font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 15px; margin-bottom: 20px; outline: 0px; padding: 0px; vertical-align: baseline;">You must make proper schedule for your studies. There must be points to do in your schedule related with your studies. If you are not able to complete the points then you must not take stress and complete those points in next schedule. This process of studying with proper schedule will give you more time and chances for remembering and it will improve your memory.</div><h2 style="background: rgb(255, 255, 255); border: 0px; color: #0a73dc; font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 20px; margin: 30px 0px 20px; outline: 0px; padding: 0px; vertical-align: baseline;">Management of information</h2><div style="background: rgb(255, 255, 255); border: 0px; color: #444444; font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 15px; margin-bottom: 20px; outline: 0px; padding: 0px; vertical-align: baseline;">You must manage all the information in your mind in a proper manner. This will avoid mixing of information in your mind. When you are studying then give time for one subject then start the new subject and focus on it. Do not start and try to complete many subjects at a time. This will mix the materials. Focus on one point at a time and pay attention so that the information could be managed properly and you could remember it.</div><h2 style="background: rgb(255, 255, 255); border: 0px; color: #0a73dc; font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 20px; margin: 30px 0px 20px; outline: 0px; padding: 0px; vertical-align: baseline;">Mnemonic items as points</h2><div style="background: rgb(255, 255, 255); border: 0px; color: #444444; font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 15px; margin-bottom: 20px; outline: 0px; padding: 0px; vertical-align: baseline;">You can make mnemonics in order to remember points in your studies. Mnemonics are also helpful for remembering many other things in routine life. You can relate items in your studies with other points so that you could recall them when needed.</div><h2 style="background: rgb(255, 255, 255); border: 0px; color: #0a73dc; font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 20px; margin: 30px 0px 20px; outline: 0px; padding: 0px; vertical-align: baseline;">Revision and practice</h2><div style="background: rgb(255, 255, 255); border: 0px; color: #444444; font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 15px; margin-bottom: 20px; outline: 0px; padding: 0px; vertical-align: baseline;">When you have memorized a thing then you must revise it after some time period so that it could not be forgotten. Regular revision and practice of study material will help you to remember it and also improve your memory.</div><h2 style="background: rgb(255, 255, 255); border: 0px; color: #0a73dc; font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 20px; margin: 30px 0px 20px; outline: 0px; padding: 0px; vertical-align: baseline;">Relation among information</h2><div style="background: rgb(255, 255, 255); border: 0px; color: #444444; font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 15px; margin-bottom: 20px; outline: 0px; padding: 0px; vertical-align: baseline;">You must try to find relation among information. When you are studying information and relating it with other information in a logical manner then you are able to memorize it. Isolated information is forgotten and hard to remember. You can relate information with many points of your choice and recall and apply them when needed.</div><h2 style="background: rgb(255, 255, 255); border: 0px; color: #0a73dc; font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 20px; margin: 30px 0px 20px; outline: 0px; padding: 0px; vertical-align: baseline;">Visualization of concepts</h2><div style="background: rgb(255, 255, 255); border: 0px; color: #444444; font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 15px; margin-bottom: 20px; outline: 0px; padding: 0px; vertical-align: baseline;">You must find concepts in your studies. You must focus on concepts and relate then with real life examples. When you will check the practical application of your points in studies then you will be able to memorize it in a better way.</div><h2 style="background: rgb(255, 255, 255); border: 0px; color: #0a73dc; font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 20px; margin: 30px 0px 20px; outline: 0px; padding: 0px; vertical-align: baseline;">Teaching to others</h2><div style="background: rgb(255, 255, 255); border: 0px; color: #444444; font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 15px; margin-bottom: 20px; outline: 0px; padding: 0px; vertical-align: baseline;">You can teach the points in study to other people. Combined study is helpful for clearing many types of problems in concepts and helps in memorizing. You can discuss the points of difficulty with other students in your group and also give them details so that their concepts could be cleared. This will help in improved memory and long term remembering of points.</div><h2 style="background: rgb(255, 255, 255); border: 0px; color: #0a73dc; font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 20px; margin: 30px 0px 20px; outline: 0px; padding: 0px; vertical-align: baseline;">Focus on difficult points</h2><div style="background: rgb(255, 255, 255); border: 0px; color: #444444; font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 15px; margin-bottom: 20px; outline: 0px; padding: 0px; vertical-align: baseline;">When you find some points difficult in your studies then you must pay more attention to them. You must practice the hard points more as compared with easy points. Regular practice will eliminate the points of difficulty from hard points and you will memorize them for recall at any time.</div><h2 style="background: rgb(255, 255, 255); border: 0px; color: #0a73dc; font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 20px; margin: 30px 0px 20px; outline: 0px; padding: 0px; vertical-align: baseline;">Change study schedule</h2><div style="background: rgb(255, 255, 255); border: 0px; color: #444444; font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 15px; margin-bottom: 20px; outline: 0px; padding: 0px; vertical-align: baseline;">When you are finding it difficult to complete your studies in a given schedule then you must make some changes. These changes will improve the chances of getting more information and remembering it. You must be ready to make some changes in your study schedule and update it so that information could be studied and memory could be improved.</div></div>Ghous uddinhttp://www.blogger.com/profile/13773797017118313457noreply@blogger.com0tag:blogger.com,1999:blog-9181450838141665570.post-66745659223399177422015-01-28T09:57:00.004-08:002015-03-10T05:31:21.995-07:007 Amazing Wedding Invitation Tips<div dir="ltr" style="text-align: left;" trbidi="on"><div style="background: rgb(255, 255, 255); border: 0px; color: #444444; font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 15px; margin-bottom: 20px; outline: 0px; padding: 0px; vertical-align: baseline;">You are engaged! Now what? Follow these helpful wedding invitation tips to get the process started off right.</div><h2 style="background: rgb(255, 255, 255); border: 0px; color: #0a73dc; font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 20px; margin: 30px 0px 20px; outline: 0px; padding: 0px; vertical-align: baseline;">Begin with a Budget</h2><div style="background: rgb(255, 255, 255); border: 0px; color: #444444; font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 15px; margin-bottom: 20px; outline: 0px; padding: 0px; vertical-align: baseline;">Wedding invitations can be surprisingly expensive, before you get your heart set on a custom design, you will want to set a budget for yourself. There are endless options available today. Your invitations can be as dramatic or simple as you’d like. <br /><a name='more'></a>Take the time to shop around. Look online, peruse catalogs, and visit stationary shops. Have your budget in mind while you browse. Don’t forget to take into account postage. Postage costs are not only dependent upon weight. The size and thickness of the envelope will affect the cost of postage too; so do your research.</div><h2 style="background: rgb(255, 255, 255); border: 0px; color: #0a73dc; font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 20px; margin: 30px 0px 20px; outline: 0px; padding: 0px; vertical-align: baseline;">What’s Your Style?</h2><div style="background: rgb(255, 255, 255); border: 0px; color: #444444; font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 15px; margin-bottom: 20px; outline: 0px; padding: 0px; vertical-align: baseline;">First impressions are everything. Your wedding invitations and/or save-the-date cards are your guests’ first glimpse into your wedding style. Whether you’ve chosen a grand black tie affair or a simplistic garden wedding, your invitations should match the tone. If you have set a color scheme for your wedding, incorporate it into your invitations. Your invitations set the stage for your wedding celebration.</div><h2 style="background: rgb(255, 255, 255); border: 0px; color: #0a73dc; font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 20px; margin: 30px 0px 20px; outline: 0px; padding: 0px; vertical-align: baseline;">What to include</h2><div style="background: rgb(255, 255, 255); border: 0px; color: #444444; font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 15px; margin-bottom: 20px; outline: 0px; padding: 0px; vertical-align: baseline;">Deciding on the wording for your inventions can be a challenge. Traditions and etiquette are constantly evolving. What your mother put on her invites is not necessarily the norm today. You need to find a balance between informing your guests and overcrowding the invitation. Be sure to include the names of the couple, the date, time and address of the ceremony and reception. RSVP information should be included. If you decide on enclosures, keep it simple. Numerous enclosures can be bulky and add costs.</div><h2 style="background: rgb(255, 255, 255); border: 0px; color: #0a73dc; font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 20px; margin: 30px 0px 20px; outline: 0px; padding: 0px; vertical-align: baseline;">Start Early</h2><div style="background: rgb(255, 255, 255); border: 0px; color: #444444; font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 15px; margin-bottom: 20px; outline: 0px; padding: 0px; vertical-align: baseline;">If you are using save-the-date cards they need to be ordered first. Try to plan on sending save-the-dates about six months prior to the big day. If you are planning a resort wedding that requires travel arrangements, send your save-the-dates even earlier to allow travel planning. Order your actual invitations three to four months early. You should be ready to mail them six to eight weeks before your wedding.</div><h2 style="background: rgb(255, 255, 255); border: 0px; color: #0a73dc; font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 20px; margin: 30px 0px 20px; outline: 0px; padding: 0px; vertical-align: baseline;">Proof it!</h2><div style="background: rgb(255, 255, 255); border: 0px; color: #444444; font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 15px; margin-bottom: 20px; outline: 0px; padding: 0px; vertical-align: baseline;">Proofing your invitations is one of the most important wedding invitation tips. The last thing you want is to send your invites with a grammatical or spelling error. Not only is it embarrassing, it can be a huge hassle if the incorrect information is sent. When your printer sends you the proof, email it to numerous trusted family and friends to ensure you don’t miss a thing.</div><h2 style="background: rgb(255, 255, 255); border: 0px; color: #0a73dc; font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 20px; margin: 30px 0px 20px; outline: 0px; padding: 0px; vertical-align: baseline;">Put It In a Package</h2><div style="background: rgb(255, 255, 255); border: 0px; color: #444444; font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 15px; margin-bottom: 20px; outline: 0px; padding: 0px; vertical-align: baseline;">Most printers have wedding packages. Usually these can save you quite a bit of money. See if you can find a package within your budget that includes the save-the-dates, invitations, inserts, RSVP cards, menu cards, and programs if necessary. Order extras! Printers will usually charge more if you have to order another set after the fact. Keep some extras on hand, just in case.</div><h2 style="background: rgb(255, 255, 255); border: 0px; color: #0a73dc; font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 20px; margin: 30px 0px 20px; outline: 0px; padding: 0px; vertical-align: baseline;">Thank you, Thank you</h2><div style="background: rgb(255, 255, 255); border: 0px; color: #444444; font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 15px; margin-bottom: 20px; outline: 0px; padding: 0px; vertical-align: baseline;">This wedding invitation tip will save you stress before and after the ceremony. No one wants to come home from your honeymoon to a huge stack of thank you notes that need to be written. When you write your guest list, transfer those names to a spreadsheet (or a notebook if you aren’t tech savvy). As the gifts start arriving make a note next to each name so you remember what they gave you. It is polite to include something about the gift in the text of the thank you. Mention it by name so the recipient knows you aren’t just sending blank thank you’s. If the gift was cash, or a gift card let the guest know how you plan on using it. It’s never too early to start your thank you notes.</div></div>Ghous uddinhttp://www.blogger.com/profile/13773797017118313457noreply@blogger.com0tag:blogger.com,1999:blog-9181450838141665570.post-9182124257094425602015-01-28T09:55:00.005-08:002015-03-15T11:41:53.938-07:007 SEO WordPress Tips Which Will Take Your Website to the google Top!<div dir="ltr" style="text-align: left;" trbidi="on">
<div style="background: rgb(255, 255, 255); border: 0px; color: #444444; font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 15px; margin-bottom: 20px; outline: 0px; padding: 0px; vertical-align: baseline;">
WordPress is without a doubt the most popular and the most useful CMS tool ever made. It is for this reason that most of the blogs and websites are powered by none other than WordPress. The biggest reason for its popularity is that it makes website management pretty easy. However, for you to take the most out of your WordPress website or blog, you must optimize your website to get organic search traffic. WordPress provides you a great platform and just a bit of hard work and imagination on your part can take your website to the top of SERPS!<br />
<a href="https://www.blogger.com/null" name="more"></a></div>
<div style="background: rgb(255, 255, 255); border: 0px; color: #444444; font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 15px; margin-bottom: 20px; outline: 0px; padding: 0px; vertical-align: baseline;">
Here are seven of the most successful SEO WordPress tips which, if properly followed, can take your website/blog to the top!</div>
<h2 style="background: rgb(255, 255, 255); border: 0px; color: #0a73dc; font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 20px; margin: 30px 0px 20px; outline: 0px; padding: 0px; vertical-align: baseline;">
Optimize Your Title Tags</h2>
<div style="background: rgb(255, 255, 255); border: 0px; color: #444444; font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 15px; margin-bottom: 20px; outline: 0px; padding: 0px; vertical-align: baseline;">
Title tags are very important in terms of SEO and a lot of the relevance quotient of a post is derived from its title tag…especially the initial three to four words of the title tag. So, your targeted keyword or phrase must lie at the very start of the title tag. However, WordPress default settings normally constitute your title tag like this: Website Name>Category Name>Page Title/Post Title. The opposite of this setting would help you the most with SEO. So, make sure that your title tag starts with your post title with your blog or website name being displayed later to get the best results.</div>
<h2 style="background: rgb(255, 255, 255); border: 0px; color: #0a73dc; font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 20px; margin: 30px 0px 20px; outline: 0px; padding: 0px; vertical-align: baseline;">
Get your Permalink Right</h2>
<div style="background: rgb(255, 255, 255); border: 0px; color: #444444; font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 15px; margin-bottom: 20px; outline: 0px; padding: 0px; vertical-align: baseline;">
The default permalink settings on WordPress are its biggest problem to say the least. It gives your post a permalink ‘yourwebsite.com/?p=31’. This permalink is so poor that even without any regards for Seo, you just know that it won’t work. So, you can change the permalink by going to your Settings and then clicking on Permalink settings. The best way to go about it would be to customize it and make it ‘http://yourwebsite.com/%posttitle%’.</div>
<h2 style="background: rgb(255, 255, 255); border: 0px; color: #0a73dc; font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 20px; margin: 30px 0px 20px; outline: 0px; padding: 0px; vertical-align: baseline;">
Preserve Link Juice by Deciding on either WWW or non-WWW</h2>
<div style="background: rgb(255, 255, 255); border: 0px; color: #444444; font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 15px; margin-bottom: 20px; outline: 0px; padding: 0px; vertical-align: baseline;">
There are two ways a website can be normally accessed i.e. with the www address and without the www address. ‘Google.com’ and ‘www.google.com’ both yield the same result. However, Google prefers ‘www.google.com’ and so, even if you will type ‘google.com’, you will be redirected to ‘www.google.com’. WordPress does the same for your website too and gives a 301 redirect to either users who type the website name along with www or to those who type the website name without the www. However, a 301 redirect is temporary in nature and your link juice might get divided between the two address types. So, in order to preserve link juice, it’s best that you put a 302 redirect on either of www or the non-www address and notify Google as well of the address type you prefer. You will have to Google Webmasters Tool to notify Google of your preference.</div>
<h2 style="background: rgb(255, 255, 255); border: 0px; color: #0a73dc; font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 20px; margin: 30px 0px 20px; outline: 0px; padding: 0px; vertical-align: baseline;">
Speed up Your Website</h2>
<div style="background: rgb(255, 255, 255); border: 0px; color: #444444; font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 15px; margin-bottom: 20px; outline: 0px; padding: 0px; vertical-align: baseline;">
Newer Google updates like Penguin and Hummingbird have introduced Google’s newfound interest in fast loading websites. These algorithms actually prefer websites that load quickly and automatically rank them higher for search results. So, you must also take steps to get your website to load quickly so that the bounce rate is less and so that your rankings don’t get affected just because of poor loading time. ‘Googles Page Speed Insights’ is a helpful tool which can do wonders in this regard.</div>
<h2 style="background: rgb(255, 255, 255); border: 0px; color: #0a73dc; font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 20px; margin: 30px 0px 20px; outline: 0px; padding: 0px; vertical-align: baseline;">
Deal with Duplicate Content</h2>
<div style="background: rgb(255, 255, 255); border: 0px; color: #444444; font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 15px; margin-bottom: 20px; outline: 0px; padding: 0px; vertical-align: baseline;">
This doesn’t mean that you are posting duplicate content on your website, it’s just that WordPress sorts out your pages and posts on the basis of tags, categories, page numbers, date, ID numbers, Archive and so on and in doing so creates duplicate URLs for the same page/post. Since Google qualifies two URLs with the same content as copied or duplicate, the presence of such URLs or the indexing of the same page for two URLs can seriously hurt your website’s SEO ranking. So, the best way to go about it is to put the nofollow tag for categories like session ID based URLs, date generated URLs and so on and allow Google spiders to index only one URL for each page.</div>
<h2 style="background: rgb(255, 255, 255); border: 0px; color: #0a73dc; font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 20px; margin: 30px 0px 20px; outline: 0px; padding: 0px; vertical-align: baseline;">
Tags Don’t Help With WordPress SEO</h2>
<div style="background: rgb(255, 255, 255); border: 0px; color: #444444; font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 15px; margin-bottom: 20px; outline: 0px; padding: 0px; vertical-align: baseline;">
WordPress gives you the option of using tags for posts and pages and people tend to add a huge number of tags with each post thinking that it would help with SEO. It doesn’t. If you really want Google spiders to go from one page to the next, you should interlink them within your content. So, go easy on the tags as they are simply not worth your time.</div>
<h2 style="background: rgb(255, 255, 255); border: 0px; color: #0a73dc; font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 20px; margin: 30px 0px 20px; outline: 0px; padding: 0px; vertical-align: baseline;">
Use the <H1> <H2> <H3> tags Properly</h2>
<div style="background: rgb(255, 255, 255); border: 0px; color: #444444; font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 15px; margin-bottom: 20px; outline: 0px; padding: 0px; vertical-align: baseline;">
The H1, H2 and H3 tags are extremely important as they standout within the sea of content. The H1 tag is the most important and should be reserved for the title (must include the keyword in the title) while H2 and H3 tags should be used for subheading and sub-subheadings (try including the focused keyword in them too)</div>
</div>
Ghous uddinhttp://www.blogger.com/profile/13773797017118313457noreply@blogger.com0tag:blogger.com,1999:blog-9181450838141665570.post-38611245782219522252015-01-28T09:53:00.004-08:002015-03-10T05:31:22.043-07:00Top 5 Sales Tips for Getting Success<div dir="ltr" style="text-align: left;" trbidi="on"><div style="background: rgb(255, 255, 255); border: 0px; color: #444444; font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 15px; margin-bottom: 20px; outline: 0px; padding: 0px; vertical-align: baseline;">Selling is an important task and many companies are looking for ways in order to increase their sales. There are many ways through which sales could be increased. Different professionals are using different modes for increasing sales. There are some tips which can be used for increasing the chances of sales. You can use the following tips at any time if you are working in the sales field. It is easy to use these tips and get instant results in the form of more sales and more commissions. You can use the following tips in online or offline markets for increasing sales.<br /><a name='more'></a></div><div style="background: rgb(255, 255, 255); border: 0px; color: #444444; font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 15px; margin-bottom: 20px; outline: 0px; padding: 0px; vertical-align: baseline;"><br /></div><h2 style="background: rgb(255, 255, 255); border: 0px; color: #0a73dc; font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 20px; margin: 30px 0px 20px; outline: 0px; padding: 0px; vertical-align: baseline;">Importance of thoughts of customers</h2><div style="background: rgb(255, 255, 255); border: 0px; color: #444444; font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 15px; margin-bottom: 20px; outline: 0px; padding: 0px; vertical-align: baseline;">In order to make sales you must know the thoughts of your customers. In some cases you are able to get information about the needs and demands of customers. Then you have to show them the desired things which are needed. If you are not sure about the demands of customers then you can ask them. If you see that customers are interested in a particular item then you can offer similar items to them so that they can get them and have benefits. You must understand the thoughts and actions of customers and guide them well so that they can purchase through you. Many people are looking to have purchases from internet but they are looking to have good guidance. Those people who are giving good guidance to customers are making a lot of sales. Many people are looking for information and feedbacks from sellers. Make sure that you are available for providing feedbacks to people so that they could purchase through you and result in benefits.</div><div style="background: rgb(255, 255, 255); border: 0px; color: #444444; font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 15px; margin-bottom: 20px; outline: 0px; padding: 0px; vertical-align: baseline;"><br /></div><h2 style="background: rgb(255, 255, 255); border: 0px; color: #0a73dc; font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 20px; margin: 30px 0px 20px; outline: 0px; padding: 0px; vertical-align: baseline;">Give complete information to customers</h2><div style="background: rgb(255, 255, 255); border: 0px; color: #444444; font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 15px; margin-bottom: 20px; outline: 0px; padding: 0px; vertical-align: baseline;">When you are making a presentation for selling something then you must have complete information. Your message must be complete from start till end. If you have started a sales message but you are not aware of details for closing it effectively then it will not give good results. People are not willing to get incomplete messages. Complete messages are required by people so that they can take actions for getting desired items. It is easy to start the message for sales but you cannot complete it until you have complete information. You must search for the required information which is to be included in your messages and then you will have more chances of making sales. There are many sales messages which are started professionally but their closing is very bad. Due to this problem these messages are not working well and customers are not attracted. In order to attract customers it is important to have a complete message from start till end. This will guide the people well and they will understand the message and then work as per instructions.</div><div style="background: rgb(255, 255, 255); border: 0px; color: #444444; font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 15px; margin-bottom: 20px; outline: 0px; padding: 0px; vertical-align: baseline;"><br /></div><h2 style="background: rgb(255, 255, 255); border: 0px; color: #0a73dc; font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 20px; margin: 30px 0px 20px; outline: 0px; padding: 0px; vertical-align: baseline;">Make proper schedule for working on sales</h2><div style="background: rgb(255, 255, 255); border: 0px; color: #444444; font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 15px; margin-bottom: 20px; outline: 0px; padding: 0px; vertical-align: baseline;">When you are working in the sales field then you must have proper schedules for many things involved in this process. It is not good to have a lot of promotion at one time and have little or no promotion at any other time. If you are working on one point related with sales and ignoring other points then your chances of success are reduced. In order to get sales and success you must work on a reliable schedule. You must make a list of things to be done related with your sales messages and work on them. Your schedule must be reasonable and achievable. You must also check the progress of your working from time to time. This will guide you about the results and making updates. Checking will give you information about the strengths and weaknesses in your sales programs. You can highlight and work on weak areas and use the strong areas for increasing sales. You will also need to make some changes in your working and schedules as per needs. You must have updated information about market sections in which your customers are present. This will help you to make proper schedules and include the required things for increasing sales.</div><div style="background: rgb(255, 255, 255); border: 0px; color: #444444; font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 15px; margin-bottom: 20px; outline: 0px; padding: 0px; vertical-align: baseline;"><br /></div><h2 style="background: rgb(255, 255, 255); border: 0px; color: #0a73dc; font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 20px; margin: 30px 0px 20px; outline: 0px; padding: 0px; vertical-align: baseline;">Work with confidence to make sales</h2><div style="background: rgb(255, 255, 255); border: 0px; color: #444444; font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 15px; margin-bottom: 20px; outline: 0px; padding: 0px; vertical-align: baseline;">If you are selling something then you must have confidence and information about the items. If you have doubts about the items you are selling then your customers will not invest for getting them. Make sure that you have information and confidence in the items you are selling. With confidence you are able to present the items in an effective manner. If your messages are presenting doubts about the things you are selling then the customers will hesitate to check and invest to get them. Many people who are in the selling department are successful due to their confidence. Those people who are not confident about the items they are selling are not getting good results. If you know that the items are working well and can give benefits to customers then you can promote them for getting more sales. There are some benefits related with any item. Search for the benefits and promote them in order to attract customers for increasing sales.</div><div style="background: rgb(255, 255, 255); border: 0px; color: #444444; font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 15px; margin-bottom: 20px; outline: 0px; padding: 0px; vertical-align: baseline;"><br /></div><h2 style="background: rgb(255, 255, 255); border: 0px; color: #0a73dc; font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 20px; margin: 30px 0px 20px; outline: 0px; padding: 0px; vertical-align: baseline;">Timely responses to customers</h2><div style="background: rgb(255, 255, 255); border: 0px; color: #444444; font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 15px; margin-bottom: 20px; outline: 0px; padding: 0px; vertical-align: baseline;">It is important to remain active and give responses for questions and queries of customers. When you are making a promotion related with a specific event then you must post on time and give enough chance to customers to have sales. Many items are launched in a certain time period and their duration is also related with a particular season so you must promote them on a timely manner. Many customers do some conversation before entering in a sales agreement. If you are starting a conversation and then disappear without completing the conversation then it will be bad. You must be ready to assist and give timely responses to customers who are looking for information about your items. This will give you confidence and trust of customers and they will invest in your items. Those sales professionals who are active and giving responses to questions and queries of customers are making more sales as compared with those sales professionals who are not active and giving no importance to feedbacks from customers.</div></div>Ghous uddinhttp://www.blogger.com/profile/13773797017118313457noreply@blogger.com0tag:blogger.com,1999:blog-9181450838141665570.post-87705786580438542032015-01-28T09:51:00.004-08:002015-03-15T11:42:04.363-07:007 Useful Blogging Tips for Online Success<div dir="ltr" style="text-align: left;" trbidi="on">
<h1 class="page-header-title" style="background: rgb(255, 255, 255); border: 0px; color: #0a73dc; font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 24px; line-height: 1.2em; margin: 0px; max-width: 85%; outline: 0px; padding: 0px; vertical-align: baseline;">
<div style="background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; background-position: initial; background-repeat: initial; background-size: initial; border: 0px; color: #444444; font-size: 15px; font-weight: normal; margin-bottom: 20px; outline: 0px; padding: 0px; vertical-align: baseline;">
<span style="font-size: small;">Blogging is an extremely important part of the virtual world with people getting the chance to voice their opinions, share their thoughts and talk about their experiences with a worldwide audience. While many believe that blogging is all about doing whatever you feel best, in order to ensure that your blogging creates interest amongst your audience, makes you popular and generates revenue for you, you must follow a certain pattern.</span><br />
<a href="https://www.blogger.com/null" name="more"></a></div>
<div style="background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; background-position: initial; background-repeat: initial; background-size: initial; border: 0px; color: #444444; font-size: 15px; font-weight: normal; margin-bottom: 20px; outline: 0px; padding: 0px; vertical-align: baseline;">
<span style="font-size: small;">Here are seven of the most useful blogging tips which will help you attain success in the virtual world.</span></div>
</h1>
<h3 style="background: rgb(255, 255, 255); border: 0px; color: #0a73dc; font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 18px; margin: 30px 0px 20px; outline: 0px; padding: 0px; vertical-align: baseline;">
<span style="font-size: small;">Know the Reason for Your Blogging</span></h3>
<h1 class="page-header-title" style="background: rgb(255, 255, 255); border: 0px; color: #0a73dc; font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 24px; line-height: 1.2em; margin: 0px; max-width: 85%; outline: 0px; padding: 0px; vertical-align: baseline;">
<div style="background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; background-position: initial; background-repeat: initial; background-size: initial; border: 0px; color: #444444; font-size: 15px; font-weight: normal; margin-bottom: 20px; outline: 0px; padding: 0px; vertical-align: baseline;">
<span style="font-size: small;"><br /></span></div>
<div style="background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; background-position: initial; background-repeat: initial; background-size: initial; border: 0px; color: #444444; font-size: 15px; font-weight: normal; margin-bottom: 20px; outline: 0px; padding: 0px; vertical-align: baseline;">
<span style="font-size: small;">While this may surprise a few, most bloggers don’t start a blog with any specific purpose but do it just because they feel like it. Most start a blog just to share their thoughts or put their writing talent on display to the world. However, if you take blogging seriously and want to succeed in it then you must know the main reason why you blog. This is because you can only measure your progress and success once you know where you wanted to succeed. People blog for generating traffic and earn revenue through ad publishers, blog to increase awareness about a topic, blog to increase their circle of interaction and blog to build relations with people with similar interests. Make sure that you know your reason for blogging and then make sure that you try and achieve success in it as well.</span></div>
</h1>
<h3 style="background: rgb(255, 255, 255); border: 0px; color: #0a73dc; font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 18px; margin: 30px 0px 20px; outline: 0px; padding: 0px; vertical-align: baseline;">
<span style="font-size: small;">Guest Blog</span></h3>
<h1 class="page-header-title" style="background: rgb(255, 255, 255); border: 0px; color: #0a73dc; font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 24px; line-height: 1.2em; margin: 0px; max-width: 85%; outline: 0px; padding: 0px; vertical-align: baseline;">
<div style="background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; background-position: initial; background-repeat: initial; background-size: initial; border: 0px; color: #444444; font-size: 15px; font-weight: normal; margin-bottom: 20px; outline: 0px; padding: 0px; vertical-align: baseline;">
<span style="font-size: small;"><br /></span></div>
<div style="background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; background-position: initial; background-repeat: initial; background-size: initial; border: 0px; color: #444444; font-size: 15px; font-weight: normal; margin-bottom: 20px; outline: 0px; padding: 0px; vertical-align: baseline;">
<span style="font-size: small;">Guest blogging is an extremely important aspect of blogging. The concept of guest blogging is to write posts for other blogs. It helps in a lot of ways. Firstly, it would help increase your interaction with fellow bloggers. Secondly, it would give you access to a whole new list of readers. Thirdly, you would be able to promote your blog a bit as well at the end of the guest blog.</span></div>
</h1>
<h3 style="background: rgb(255, 255, 255); border: 0px; color: #0a73dc; font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 18px; margin: 30px 0px 20px; outline: 0px; padding: 0px; vertical-align: baseline;">
<span style="font-size: small;">Use Social Networking and Social Media Websites</span></h3>
<h1 class="page-header-title" style="background: rgb(255, 255, 255); border: 0px; color: #0a73dc; font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 24px; line-height: 1.2em; margin: 0px; max-width: 85%; outline: 0px; padding: 0px; vertical-align: baseline;">
<div style="background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; background-position: initial; background-repeat: initial; background-size: initial; border: 0px; color: #444444; font-size: 15px; font-weight: normal; margin-bottom: 20px; outline: 0px; padding: 0px; vertical-align: baseline;">
<span style="font-size: small;"><br /></span></div>
<div style="background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; background-position: initial; background-repeat: initial; background-size: initial; border: 0px; color: #444444; font-size: 15px; font-weight: normal; margin-bottom: 20px; outline: 0px; padding: 0px; vertical-align: baseline;">
<span style="font-size: small;">Social Networking and social media websites are the best platforms for promoting your blog and its contents. Make sure to create a page for your blog as well as an account on Twitter and then promote it amongst your readers too to get it followed. In this manner, you would always retain your readers.</span></div>
</h1>
<h3 style="background: rgb(255, 255, 255); border: 0px; color: #0a73dc; font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 18px; margin: 30px 0px 20px; outline: 0px; padding: 0px; vertical-align: baseline;">
<span style="font-size: small;">Diversify Your Content</span></h3>
<h1 class="page-header-title" style="background: rgb(255, 255, 255); border: 0px; color: #0a73dc; font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 24px; line-height: 1.2em; margin: 0px; max-width: 85%; outline: 0px; padding: 0px; vertical-align: baseline;">
<div style="background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; background-position: initial; background-repeat: initial; background-size: initial; border: 0px; color: #444444; font-size: 15px; font-weight: normal; margin-bottom: 20px; outline: 0px; padding: 0px; vertical-align: baseline;">
<span style="font-size: small;"><br /></span></div>
<div style="background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; background-position: initial; background-repeat: initial; background-size: initial; border: 0px; color: #444444; font-size: 15px; font-weight: normal; margin-bottom: 20px; outline: 0px; padding: 0px; vertical-align: baseline;">
<span style="font-size: small;">Most bloggers make the mistake of keeping their blogs strictly text based. People can only read so much and if you want people to spend more time on your blog then you must diversify your content and prepare a few photo-based posts, couple of podcasts and some videos too. You can also share photos which have the potential of getting viral on social networking sites, share podcasts on websites like sound cloud and share the videos on YouTube. By diversifying your content, you won’t only be able to meet the requirements of a wide variety of people but would also give your blog a chance of getting popular through social media and video hosting websites.</span></div>
</h1>
<h3 style="background: rgb(255, 255, 255); border: 0px; color: #0a73dc; font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 18px; margin: 30px 0px 20px; outline: 0px; padding: 0px; vertical-align: baseline;">
<span style="font-size: small;">Stay Consistent</span></h3>
<h1 class="page-header-title" style="background: rgb(255, 255, 255); border: 0px; color: #0a73dc; font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 24px; line-height: 1.2em; margin: 0px; max-width: 85%; outline: 0px; padding: 0px; vertical-align: baseline;">
<div style="background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; background-position: initial; background-repeat: initial; background-size: initial; border: 0px; color: #444444; font-size: 15px; font-weight: normal; margin-bottom: 20px; outline: 0px; padding: 0px; vertical-align: baseline;">
<span style="font-size: small;"><br /></span></div>
<div style="background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; background-position: initial; background-repeat: initial; background-size: initial; border: 0px; color: #444444; font-size: 15px; font-weight: normal; margin-bottom: 20px; outline: 0px; padding: 0px; vertical-align: baseline;">
<span style="font-size: small;">Consistency is so important for blogging. If you won’t consistently update your blog, you would lose the interest of both your readers and the search-engines. So, whatever you do, make sure to upload content of any kind thrice a week.</span></div>
</h1>
<h3 style="background: rgb(255, 255, 255); border: 0px; color: #0a73dc; font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 18px; margin: 30px 0px 20px; outline: 0px; padding: 0px; vertical-align: baseline;">
<span style="font-size: small;">Interview People with Success Stories in Your Niche</span></h3>
<h1 class="page-header-title" style="background: rgb(255, 255, 255); border: 0px; color: #0a73dc; font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 24px; line-height: 1.2em; margin: 0px; max-width: 85%; outline: 0px; padding: 0px; vertical-align: baseline;">
<div style="background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; background-position: initial; background-repeat: initial; background-size: initial; border: 0px; color: #444444; font-size: 15px; font-weight: normal; margin-bottom: 20px; outline: 0px; padding: 0px; vertical-align: baseline;">
<span style="font-size: small;"><br /></span></div>
<div style="background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; background-position: initial; background-repeat: initial; background-size: initial; border: 0px; color: #444444; font-size: 15px; font-weight: normal; margin-bottom: 20px; outline: 0px; padding: 0px; vertical-align: baseline;">
<span style="font-size: small;">If you run out of ideas for posts, try and arrange an interview with someone who has an inspiring success story in your niche. People always love reading a success story and talking with such individuals would also give you new perspective on the topics that you write as well.</span></div>
</h1>
<h3 style="background: rgb(255, 255, 255); border: 0px; color: #0a73dc; font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 18px; margin: 30px 0px 20px; outline: 0px; padding: 0px; vertical-align: baseline;">
<span style="font-size: small;">Incorporate Keywords into Your Titles and Content</span></h3>
<h1 class="page-header-title" style="background: rgb(255, 255, 255); border: 0px; color: #0a73dc; font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 24px; line-height: 1.2em; margin: 0px; max-width: 85%; outline: 0px; padding: 0px; vertical-align: baseline;">
<div style="background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; background-position: initial; background-repeat: initial; background-size: initial; border: 0px; color: #444444; font-size: 15px; font-weight: normal; margin-bottom: 20px; outline: 0px; padding: 0px; vertical-align: baseline;">
<span style="font-size: small;"><br /></span></div>
<div style="background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; background-position: initial; background-repeat: initial; background-size: initial; border: 0px; color: #444444; font-size: 15px; font-weight: normal; margin-bottom: 20px; outline: 0px; padding: 0px; vertical-align: baseline;">
<span style="font-size: small;">Keywords are important if you want to get some traffic through search-engines as well. All you need to do is select a few keywords which would be relevant with your content and then incorporate them in your titles and content. You don’t need to stuff your content with too many keywords but you should at least put the keyword once in the title of your post and once within the content itself to get it optimised for search-engines.</span></div>
</h1>
</div>
Ghous uddinhttp://www.blogger.com/profile/13773797017118313457noreply@blogger.com0