<link href="//netdna.bootstrapcdn.com/bootstrap/3.0.0/css/bootstrap.min.css" rel="stylesheet" id="bootstrap-css">
<script src="//netdna.bootstrapcdn.com/bootstrap/3.0.0/js/bootstrap.min.js"></script>
<script src="//code.jquery.com/jquery-1.11.1.min.js"></script>
<!------ Include the above in your HEAD tag ---------->
<!DOCTYPE html><html class=''>
<head><script src='//production-assets.codepen.io/assets/editor/live/console_runner-079c09a0e3b9ff743e39ee2d5637b9216b3545af0de366d4b9aad9dc87e26bfd.js'></script><script src='//production-assets.codepen.io/assets/editor/live/events_runner-73716630c22bbc8cff4bd0f07b135f00a0bdc5d14629260c3ec49e5606f98fdd.js'></script><script src='//production-assets.codepen.io/assets/editor/live/css_live_reload_init-2c0dc5167d60a5af3ee189d570b1835129687ea2a61bee3513dee3a50c115a77.js'></script><meta charset='UTF-8'><meta name="robots" content="noindex"><link rel="shortcut icon" type="image/x-icon" href="//production-assets.codepen.io/assets/favicon/favicon-8ea04875e70c4b0bb41da869e81236e54394d63638a1ef12fa558a4a835f1164.ico" /><link rel="mask-icon" type="" href="//production-assets.codepen.io/assets/favicon/logo-pin-f2d2b6d2c61838f7e76325261b7195c27224080bc099486ddd6dccb469b8e8e6.svg" color="#111" /><link rel="canonical" href="https://codepen.io/NyannNyann/pen/cdLao?limit=all&page=75&q=gallery" />
<style class="cp-pen-styles">body{background:#333;}
.main-nav{list-style:none;width:auto;margin:0px auto;z-index: 9999999999999999999;-webkit-transition:all 0.8s ease-in-out;
-moz-transition:all 0.8s ease-in-out;}
.main-nav li{float:left;width:150px;padding:15px 5px 15px 5px;position:relative;-moz-transition:background-color .4s ease;-o-transition:background-color .4s ease;-webkit-transition:background-color .4s ease;-ms-transition:background-color .4s ease;background:#434343}
.main-nav li:hover{background:rgba(0,0,0,0.4);-moz-transition:background-color .1s ease;-o-transition:background-color .1s ease;-webkit-transition:background-color .1s ease;-ms-transition:background-color .1s ease}
.main-nav a{border-top:0;display:block;position:relative;z-index:2;color:#FFF;font:bold 15px kulturista-web-1,kulturista-web-2,Serif;text-decoration:none;text-transform:uppercase;letter-spacing:.5px;overflow:hidden;text-align:center!important;padding:10px!important}
.main-nav a:before{content:"";display:block;height:40px;background:url(https://1.bp.blogspot.com/-_IP6NWRJ5F8/UBVsNloH-3I/AAAAAAAADtY/--XihfeS-l8/s1600/nav-sprite.png) top center no-repeat}
.ie8 .main-nav a{padding:10px!important}
.main-nav span{text-align:center;font-size:9px;white-space:nowrap;display:block}
.main-nav .forums a:before{background-position:center -40px}
.main-nav .snippets a:before{background-position:center -80px}
.main-nav .almanac a:before{background-position:center -160px}
.main-nav .videos a:before{background-position:center -280px}
.main-nav .gallery a:before{background-position:center -200px}
.main-nav .downloads a:before{background-position:center -240px}
.main-nav .deals a:before{background-position:center -120px}
.home .main-nav .articles a,.single-post .main-nav .articles a,.Vanilla .main-nav .forums a,.page-template-page-snippet-cat-php .main-nav .snippets a,.page-template-page-snippet-php .main-nav .snippets a,.page-template-video-archive-php .main-nav .videos a,.page-template-video-single-php .main-nav .videos a,.page-template-page-almanac-group-php .main-nav .almanac a,.page-template-page-almanac-single-php .main-nav .almanac a,.post-type-archive-screenshot .main-nav .gallery a,.single-screenshot .main-nav .gallery a,.page-template-page-downloads-php .main-nav .downloads a,.page-template-page-deals-php .main-nav .deals a{color:#000}
.main-nav li:before{content:"";position:absolute;top:100%;left:0;right:0;height:8px}
.page-template-video-archive-php .main-nav .videos,.page-template-video-single-php .main-nav .videos,.main-nav .videos:hover{background:#01b0ec}
.page-template-video-archive-php .main-nav .videos:before,.page-template-video-single-php .main-nav .videos:before{background:#0484b0}
.home .main-nav .articles,.single-post .main-nav .articles,.main-nav .articles:hover{background:#ef7901}
.home .main-nav .articles:before,.single-post .main-nav .articles:before{background:#cf7000}
.Vanilla .main-nav .forums,.main-nav .forums:hover{background:#d54421}
.Vanilla .main-nav .forums:before{background:#bb2904}
.page-template-page-snippet-cat-php .main-nav .snippets,.page-template-page-snippet-php .main-nav .snippets,.main-nav .snippets:hover{background:#98bf0d}
.page-template-page-snippet-cat-php .main-nav .snippets:before,.page-template-page-snippet-php .main-nav .snippets:before{background:#87a812}
.page-template-page-almanac-group-php .main-nav .almanac,.page-template-page-almanac-single-php .main-nav .almanac,.main-nav .almanac:hover{background:#7449f1}
.page-template-page-almanac-group-php .main-nav .almanac:before,.page-template-page-almanac-single-php .main-nav .almanac:before{background:#5531bf}
.post-type-archive-screenshot .main-nav .gallery,.single-screenshot .main-nav .gallery,.main-nav .gallery:hover{background:#b147a3}
.post-type-archive-screenshot .main-nav .gallery:before,.single-screenshot .main-nav .gallery:before{background:#922a84}
.page-template-page-downloads-php .main-nav .downloads,.main-nav .downloads:hover{background:#f6b402}
.page-template-page-downloads-php .main-nav .downloads:before{background:#d49b00}
.page-template-page-deals-php .main-nav .deals,.main-nav .deals:hover{background:#8d8d8d}
.page-template-page-deals-php .main-nav .deals:before{background:#5e5e5e}
.home .main-nav .articles{-webkit-animation:nav-1 1.5s 1s ease 1;-moz-animation:nav-1 1.5s 1s ease 1}
.home .main-nav .forums{-webkit-animation:nav-2 1.5s 1.1s ease 1;-moz-animation:nav-2 1.5s 1.1s ease 1}
.home .main-nav .snippets{-webkit-animation:nav-3 1.5s 1.2s ease 1;-moz-animation:nav-3 1.5s 1.2s ease 1}
.home .main-nav .videos{-webkit-animation:nav-4 1.5s 1.3s ease 1;-moz-animation:nav-4 1.5s 1.3s ease 1}
.home .main-nav .almanac{-webkit-animation:nav-5 1.5s 1.4s ease 1;-moz-animation:nav-5 1.5s 1.4s ease 1}
.home .main-nav .gallery{-webkit-animation:nav-6 1.5s 1.5s ease 1;-moz-animation:nav-6 1.5s 1.5s ease 1}
.home .main-nav .downloads{-webkit-animation:nav-7 1.5s 1.6s ease 1;-moz-animation:nav-7 1.5s 1.5s ease 1}
.home .main-nav .deals{-webkit-animation:nav-8 1.5s 1.7s ease 1;-moz-animation:nav-8 1.5s 1.7s ease 1}
.main-nav li:nth-child(n+7){border-bottom:0}
.main-nav-wrap{margin:-21px 0 0 -21px}
.ie8 .main-nav-wrap{margin:0}
.main-nav li a,.main-nav li a:hover{color:#fff;text-decoration:none}
.ie8 .main-nav a:before,.ie8 .main-nav li:before{display:none}</style></head><body>
<nav class='main-nav-wrap'>
<ul class='main-nav group'>
<li class='articles'><a href='#'>Home<span>Home Page</span></a></li>
<li class='forums'><a href='#'>Blogger<span>Blogger Tricks</span></a></li>
<li class='snippets'><a href='#'>TEMPLATES<span>BLOGGER TEMPLATES</span></a></li>
<li class='videos'><a href='#'>Cool Tricks<span>Tricks</span></a></li>
<li class='almanac'><a href='#'>Guest Post<span>Write For Us</span></a></li>
<li class='gallery'><a href='#'>Sitemap<span>List Of Posts</span></a></li>
<li class='downloads'><a href='#'>Tools<span>Blogger Tools</span></a></li>
<li class='deals'><a href='#'>Contact<span>Contact Admin</span></a></li>
</ul>
</nav>
</body></html>
