Advertisement
Lizellea

Isshin

Dec 16th, 2016
117
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 4.67 KB | None | 0 0
  1. <style type="text/css">
  2.  
  3. @import url(https://fonts.googleapis.com/css?family=Jim+Nightshade);
  4. @import url(https://fonts.googleapis.com/css?family=Pragati+Narrow);
  5.  
  6. body {
  7. background-color: #000;
  8. background-image: url(http://i.imgur.com/66HyzBY.jpg);
  9. background-attachment: fixed;
  10. background-position:center;
  11. background-repeat: repeat;
  12. background-size: 100% 100%;
  13. overflow:hidden;}
  14.  
  15.  
  16. ::-webkit-scrollbar-track {background-color:#fff;}
  17. ::-webkit-scrollbar-thumb {background-color:#000; border:3px solid #fff;}
  18. ::-webkit-scrollbar {width:11px;height:5px;}
  19.  
  20.  
  21. #frame {
  22. z-index: 10;
  23. background: url(http://i.imgur.com/z8XSlCZ.jpg);
  24. background-size: 1;
  25. background-position: center;
  26. background-repeat: no-repeat;
  27. background-size: 50% 100%;
  28. position: absolute;
  29. background-color:#000;
  30. border-left: 10px groove #000;
  31. border-right: 10px groove #f0dbc9;
  32. border-top: 10px groove #000;
  33. border-bottom: 10px groove #f0dbc9;
  34. top: 25%;
  35. left: 14%;
  36. height:45%;
  37. width: 70%;
  38. }
  39.  
  40. .box {position: absolute;
  41. z-index: -1;
  42. left: 25%;
  43. top:-10%;
  44. border: 2px solid #f0dbc9;
  45. height:97%;
  46. width:49%;
  47. background-color:#000;
  48. overflow-x:auto;
  49. overflow-y:auto;
  50. font-family:Pragati Narrow;
  51. font-size:16px;
  52. line-height:17px;
  53. padding:3px;
  54. opacity:0;
  55. color:#fff;
  56. transition: 0.8s;
  57. -moz-transition: 0.8s;
  58. webkit-transition: 0.8s;
  59. -o-transition: 0.8s;}
  60.  
  61. .box:target{position: absolute;
  62. z-index: 3;
  63. top:0%;
  64. opacity:0.9;
  65. transition: 0.8s;
  66. -moz-transition: 0.8s;
  67. webkit-transition: 0.8s;
  68. -o-transition: 0.8s;}
  69.  
  70. .tab1 { z-index:10; position: absolute; top: -8%; left: 26%; width: 8%; height: 4%; border-radius: 0%;background-color: #f0dbc9;box-shadow:0px 0px 30px #000;}
  71. .tab2 { z-index:10; position: absolute; top: -8%; left: 36%; width: 8%; height: 4%; border-radius: 0%;background-color: #f0dbc9;box-shadow:0px 0px 30px #000;}
  72. .tab3 { z-index:10; position: absolute; top: -8%; left: 46%; width: 8%; height: 4%; border-radius: 0%;background-color: #f0dbc9;box-shadow:0px 0px 30px #000;}
  73. .tab4 { z-index:10; position: absolute; top: -8%; left: 56%; width: 8%; height: 4%; border-radius: 0%;background-color: #f0dbc9;box-shadow:0px 0px 30px #000;}
  74. .tab5 { z-index:10; position: absolute; top: -8%; left: 66%; width: 8%; height: 4%; border-radius: 0%;background-color: #f0dbc9;box-shadow:0px 0px 30px #000;}
  75.  
  76.  
  77. a {color: #BFA3A3; text-decoration: none; }
  78. a:hover {color: blue; text-decoration: line-through;
  79. cursor: url('http://media.tumblr.com/e7f72e808c4dbe5006b9c3a30dbc9b79/tumblr_inline_mh67vhwGnR1rdqsqf.png');}
  80. *{cursor: url('http://media.tumblr.com/7c3edb626c8cf9435c5c0b2d6acceffd/tumblr_inline_mh67v6xNXM1rdqsqf.png'), default;}
  81.  
  82. b, strong {font-weight: bold; color: #6C6868;}
  83.  
  84. h1 {width: 100%; height: auto; font-size: 25px;font-family:Jim Nightshade; margin-top: 10px; text-align: center; border-bottom: 1px solid #FAF3A1; color: #556558;}
  85.  
  86.  
  87. .circle{border-radius:150px;-webkit-transition: all 0.8s ease-out;-moz-transition: all 0.8s ease-out;-o-transition: all 0.8s ease-out;}
  88. .circle:hover{border-radius:0px;-webkit-transition: all 0.8s ease-out;-moz-transition: all 0.8s ease-out;-o-transition: all 0.8s ease-out;-webkit-transform: rotate(-360deg); -moz-transform: rotate(-360deg); -ms-transform: rotate(-360deg); -o-transform: rotate(-360deg);}
  89.  
  90. #music{background-color:#transparent;width:50px;height:50px;margin:auto;position:absolute;left:51%;top:29%;background-image:url("http://assets.clickmotive.com/Designs/LEMidnight/playButton.png");background-repeat:no-repeat;background-position:center;background-size:100% 100%;}
  91.  
  92. #credit{ position: fixed;
  93. right: 1px;
  94. bottom: 0px;
  95. font-family: Arial;
  96. font-variant: normal;
  97. font-weight: normal;
  98. font-size: 90%;
  99. color: #ccc;
  100. z-index:1;}
  101.  
  102. </style>
  103. <div id="credit">
  104. Layout © <a href="profile.php?user=Pachi" target="_blank">Pachi</a>
  105. </div>
  106.  
  107.  
  108. <div id="Music">
  109. <audio controls loop style="opacity: 0; width: 10%;"><source src="http://puu.sh/sQRkn/3421feddb1.mp3">
  110. </div>
  111.  
  112.  
  113. <div id="frame">
  114. <img src="http://i.imgur.com/nh5Arky.png" height="100%" style="position:absolute; bottom:0%; left: 0%;">
  115. <img src="http://i.imgur.com/HfhCDa2.png" width="25%" height="100%" style="position:absolute; bottom:0%; right: 0%;">
  116.  
  117. <a href="#1"><div class="tab1"></div></a>
  118. <a href="#2"><div class="tab2"></div></a>
  119. <a href="#3"><div class="tab3"></div></a>
  120. <a href="#4"><div class="tab4"></div></a>
  121. <a href="#5"><div class="tab5"></div></a>
  122.  
  123.  
  124. <div id="1" class="box">
  125. <h1>Title</h1>
  126. Tab1 <b>Bold</b> <i>Italics</i> <a href="link.com">Link</a>
  127. </div>
  128.  
  129. <div id="2" class="box">
  130. <h1>Title</h1>
  131. Tab2
  132. </div>
  133.  
  134. <div id="3" class="box">
  135. <h1>Title</h1>
  136. Tab3
  137. </div>
  138.  
  139. <div id="4" class="box">
  140. <h1>Title</h1>
  141. Tab4
  142. </div>
  143. </div>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement