Advertisement
thevioletmaniac

tvm navigation #008

Oct 18th, 2015
65
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
HTML 4.12 KB | None | 0 0
  1. <!--
  2.  
  3.        Navigation number: #008/DIAMOND
  4.        Creator: @thevioletmaniac
  5.        Created: October 18, 2015
  6.        Last update: October 24, 2015
  7.        Website: [http://thevioletmaniac.narod.ru/] or [http://tvm-resources.deviantart.com/]
  8.        Rules: Credit me if you use it/Don't share or modify.
  9.      
  10. -->
  11. <html>
  12. <head>
  13. <title>THEVIOLETMANIAC/NAVIGATION/#008</title>
  14. <META http-equiv="Content-type" content="text/html; charset=windows-1251">
  15. <style>
  16.     body{
  17.         padding: 0;
  18.         margin: 0;
  19.         background: #ebebeb;
  20.     }
  21.  
  22.     .tvm-navigation{
  23.         width: 448px;
  24.         background: non;
  25.         margin: 0 auto;
  26.     }
  27.  
  28.     .tvm-copyright{
  29.         width:100%;
  30.         height:30px;
  31.         line-height: 30px;
  32.         margin-left:0px;
  33.         margin-top:0px;
  34.         float: left;
  35.         position:absolute;
  36.         background: linear-gradient(to bottom, #f9f8f8, #fafafa);
  37.     }
  38.  
  39.     .tvm-copyright a,.tvm-copyright a:visited,.tvm-copyright a:active,.tvm-copyright a:link{
  40.         text-decoration: none;
  41.         color: #000;
  42.         display: block;
  43.         text-transform: uppercase;
  44.         font-size: 10px;
  45.         font-family:arial;
  46.         transition: 0.5s;
  47.         padding-left: 25px;
  48.         width: 180px;
  49.         background: #fff;
  50.         transition: 0.5s;
  51.     }
  52.  
  53.     .tvm-copyright a:hover{
  54.         text-decoration: none;
  55.         color: #373737;
  56.         background: #f1f1f1;
  57.         transition: 0.5s;
  58.     }
  59.  
  60.     .tvm-diamond-navigation{
  61.         width: 110px;
  62.         height: 110px;
  63.         background: none;
  64.         line-height: 120px;
  65.         text-align: center;
  66.         text-decoration: none;
  67.         padding-top: 1px;
  68.         margin: 1px;
  69.         display: block;
  70.         float: left;
  71.     }
  72.  
  73.     .tvm-diamond-link{
  74.         width: 80px;
  75.         height: 80px;
  76.         background: linear-gradient(to bottom, #cca2f4, #8a41dd);
  77.         box-shadow:
  78.             inset 0px 0px 30px #7a31d4,
  79.             0px 0px 10px #dcd6e4;
  80.         border: 0px solid #8545d0;
  81.         line-height: 80px;
  82.         text-align: center;
  83.         text-decoration: none;
  84.         -webkit-transform: rotate(-45deg);
  85.         -moz-transform: rotate(-45deg);
  86.         -ms-transform: rotate(-45deg);
  87.         -o-transform: rotate(-45deg);
  88.         transform: rotate(-45deg);
  89.         margin: 15px;
  90.         transition: 0.5s;
  91.         -webkit-border-radius: 4px;
  92.         -moz-border-radius: 4px;
  93.         border-radius: 4px;
  94.     }
  95.  
  96.     .tvm-diamond-transform{
  97.         -webkit-transform: rotate(45deg);
  98.         -moz-transform: rotate(45deg);
  99.         -ms-transform: rotate(45deg);
  100.         -o-transform: rotate(45deg);
  101.         transform: rotate(45deg);
  102.     }
  103.  
  104.     .tvm-diamond-navigation a,.tvm-diamond-navigation a:visited,.tvm-diamond-navigation a:active,.tvm-diamond-navigation a:link{
  105.         text-decoration: none;
  106.         color: #efecec;
  107.         display: block;
  108.         text-shadow: 1px 0px 2px #7002e0;
  109.         text-transform: uppercase;
  110.         font-size: 10px;
  111.         font-family: arial;
  112.         transition: 0.5s;
  113.     }
  114.  
  115.     .tvm-diamond-link:hover {
  116.         background: linear-gradient(to bototm, #cca2f4, #8a41dd);
  117.         box-shadow:
  118.             inset 0px 0px 30px #4f217f,
  119.             0px 0px 10px #dcd6e4;
  120.         transition: 0.5s;
  121.     }
  122.    
  123.     .clear{
  124.         clear: both;
  125.     }
  126. </style>
  127. </head>
  128. <body>
  129. <div class="tvm-copyright">
  130.     <a href="http://thevioletmaniac.narod.ru/" target="main">coded by thevioletmaniac</a>
  131. </div>
  132.  
  133. <table width="100%" height="100%" cellpadding="0" cellspacing="0">
  134.     <tr>
  135.         <td align="center" valign="middle">
  136.             <div class="tvm-navigation">
  137.                 <div class="tvm-diamond-navigation">
  138.                     <div class="tvm-diamond-link">
  139.                         <div class="tvm-diamond-transform">
  140.                             <a href="http://thevioletmaniac.narod.ru/"  target="main">link #1</a>
  141.                         </div> 
  142.                     </div>
  143.                 </div>
  144.  
  145.                 <div class="tvm-diamond-navigation">
  146.                     <div class="tvm-diamond-link">
  147.                         <div class="tvm-diamond-transform">
  148.                             <a href="http://thevioletmaniac.narod.ru/"  target="main">link #2</a>
  149.                         </div> 
  150.                     </div>
  151.                 </div>
  152.  
  153.                 <div class="tvm-diamond-navigation">
  154.                     <div class="tvm-diamond-link">
  155.                         <div class="tvm-diamond-transform">
  156.                             <a href="http://thevioletmaniac.narod.ru/"  target="main">link #3</a>
  157.                         </div> 
  158.                     </div>
  159.                 </div>
  160.  
  161.                 <div class="tvm-diamond-navigation">
  162.                     <div class="tvm-diamond-link">
  163.                         <div class="tvm-diamond-transform">
  164.                             <a href="http://thevioletmaniac.narod.ru/"  target="main">link #4</a>
  165.                         </div> 
  166.                     </div>
  167.                 </div>
  168.  
  169.                 <div class="clear"></div>
  170.             </div>
  171.         </td>
  172.     </tr>
  173. </table>
  174.  
  175. </body>
  176. </html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement