API tools faq
paste
Advertisement
Guest User

Charalist Kakki

a guest
May 27th, 2015
261
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 6.41 KB | None | 0 0
raw download clone embed print report
  1. <!DOCTYPE html>
  2. <head>
  3.  
  4. <!---
  5.  
  6. The Crew
  7. a network page by CIRALISM
  8.  
  9. //don't be a dick turd
  10. //you know the rules
  11.  
  12. //customization instructions are commented into the code. PLEASE READ THE GREY TEXT BEFORE ASKING A QUESTION.
  13.  
  14. --->
  15.  
  16. <title>Dioscuri's</title>
  17. <link rel="shortcut icon" href="{Favicon}">
  18.  
  19.  
  20.  
  21. <link href='http://fonts.googleapis.com/css?family=Lato:100,300,400,700,900' rel='stylesheet' type='text/css'>
  22. <style type="text/css">
  23.  
  24. body {
  25. font-family:Lato;
  26. color:black;
  27. background-color:#f3f3f3;/*change the background color of the page*/
  28. font-size:11px;
  29. }
  30. a {
  31. color:black;
  32. text-decoration:none;
  33. -webkit-transition-duration:400ms;-o-transition-duration:400ms;-ms-transition-duration:400ms;-moz-transition-duration:400ms;
  34. }
  35.  
  36.  
  37. .credit {
  38. font-size:7px;
  39. font-weight:bold;
  40. letter-spacing:1px;
  41. text-transform:uppercase;
  42. position:fixed;
  43. right:5px;
  44. bottom:5px;
  45. }
  46.  
  47. .cancan {
  48. position:absolute;
  49. width:600px;
  50. left:50%;
  51. margin-left:-300px;
  52. }
  53.  
  54. .topbit {
  55. padding:20px 30px;
  56. text-align:center;/*you can move the top text to left or right if you want to*/
  57. margin-top:30px;
  58. background-color:#fff;
  59. }
  60.  
  61. .title {
  62. font-weight:bold;
  63. font-family:Lato;
  64. font-size:16px;
  65. text-transform:uppercase;
  66. letter-spacing:1px;
  67. }
  68.  
  69. .links {
  70. font-weight:400;
  71. text-transform:uppercase;
  72. letter-spacing:1px;
  73. font-size:7px;
  74. margin-top:3px;
  75. }
  76.  
  77. .links a {
  78. padding:0px 5px;
  79. }
  80.  
  81. .lobsterroll {
  82. margin-top:-5px;
  83. width:650px;
  84. display:inline-block;
  85. margin-left:-22px;
  86. }
  87.  
  88.  
  89. .person {
  90. padding:30px 30px 25px 30px;
  91. width:230px;
  92. background-color:#fff;
  93. margin-left:20px;
  94. margin-top:20px;
  95. display:inline-block;
  96. }
  97.  
  98. .person img {
  99. width:268px;
  100. height:190px;
  101. -webkit-transition-duration:400ms;-o-transition-duration:400ms;-ms-transition-duration:400ms;-moz-transition-duration:400ms;
  102.  
  103. }
  104.  
  105. .pi {
  106. overflow:hidden;
  107. width:230px;
  108. height:140px;
  109.  
  110. }
  111.  
  112. .person:hover img {
  113. -webkit-transform:scale(1.2);
  114. }
  115.  
  116. .squad {
  117. position:absolute;
  118. font-family:Lato;
  119. margin-top:-115px;
  120. margin-left:25px;
  121. }
  122.  
  123. .desc {
  124. width:150px;
  125. height:50px;
  126. font-weight:300;
  127. letter-spacing:1px;
  128. background-color:rgba(255,255,255,.9);
  129. padding:15px 15px;
  130. text-align:center;
  131. margin-top:5px;
  132. opacity:0;
  133. -webkit-transition-duration:400ms;-o-transition-duration:400ms;-ms-transition-duration:400ms;-moz-transition-duration:400ms;
  134.  
  135. }
  136.  
  137. .desc b {
  138. display:block;
  139. text-transform:uppercase;
  140. font-size:8px;
  141. letter-spacing:1px;
  142. font-weight:900;
  143. padding-bottom:5px;
  144. }
  145.  
  146. .person:hover .desc {
  147. opacity:0.9;
  148. }
  149.  
  150. .url {
  151. text-align:center;
  152. margin-top:-20px;
  153. padding-bottom:10px;
  154. text-transform:uppercase;
  155. font-size:9px;
  156. letter-spacing:2px;
  157. font-weight:400;
  158. }
  159.  
  160. .url a:hover {
  161. font-weight:900;
  162. color:#000;
  163. }
  164. </style>
  165. </head>
  166. <body>
  167. <div class="cancan">
  168. <div class="topbit">
  169. <span class="title">character list</span><!--GROUP TITLE-->
  170. <div class="links">
  171. <a href="http://riferyuri.tumblr.com/">home</a><!--PUT IN YOUR LINKS HERE-->
  172. <a href="http://riferyuri.tumblr.com/ask">ask</a>
  173. <a href="http://www.twitter.com/Dioscuri_">twitter</a>
  174. <a href="http://riferyuri.tumblr.com/archive">archive</a><!--FEEL FREE TO ADD MORE LINKS-->
  175. </div>
  176. </div>
  177.  
  178. <div class="lobsterroll">
  179.  
  180. <table>
  181. <tr>
  182. <!--NEW MEMBER-->
  183. <td class="person">
  184. <div class="url"><a href="http://URL HERE.tumblr.com">galeron pollux</a></div><!--Replace URL HERE with their URL-->
  185. <div class="pi"><img src="http://i.imgbox.com/kyKtmbIV.png"><!--Replace IMAGE URL HERE with any image URL--></div>
  186. <div class="squad">
  187. <div class="desc"><b>new indohogwarts</b><!--Write if admin or member--><b>Play by</b> <i>Greg Nawrat.</i> <br>Slytherin 1799.<!--Put a short description--></div>
  188. </div>
  189. </td>
  190.  
  191.  
  192. <!--NEW MEMBER-->
  193. <td class="person">
  194. <div class="url"><a href="http://URL HERE.tumblr.com">daphne frost</a></div><!--Replace URL HERE with their URL-->
  195. <div class="pi"><img src="http://i.imgbox.com/tIPucEtL.png"><!--Replace IMAGE URL HERE with any image URL--></div>
  196. <div class="squad">
  197. <div class="desc"><b>new indohogwarts</b><!--Write if admin or member--><b>Play by</b> <i>Rachel Hurd-Wood</i>.<br> Hufflepuff 1805.<!--Put a short description--></div>
  198. </div>
  199. </td>
  200. </tr>
  201.  
  202. <!---NEW ROW OF MEMBERS --->
  203. <tr>
  204. <!--NEW MEMBER-->
  205. <td class="person">
  206. <div class="url"><a href="http://URL HERE.tumblr.com">slade durand</a></div><!--Replace URL HERE with their URL-->
  207. <div class="pi"><img src="http://i.imgbox.com/eHwKvrFJ.png"><!--Replace IMAGE URL HERE with any image URL--></div>
  208. <div class="squad">
  209. <div class="desc"><b>new indohogwarts</b><!--Write if admin or member--><b>Play by</b> <i>Matthew Hitt.</i><br> Gryffindor 1806.<!--Put a short description--></div>
  210. </div>
  211. </td><!--NEW MEMBER-->
  212. <td class="person">
  213. <div class="url"><a href="http://URL HERE.tumblr.com">seth lufkin</a></div><!--Replace URL HERE with their URL-->
  214. <div class="pi"><img src="http://i.imgbox.com/STrDDkhs.png"><!--Replace IMAGE URL HERE with any image URL--></div>
  215. <div class="squad">
  216. <div class="desc"><b>new indohogwarts</b><!--Write if admin or member--><b>Play by</b> <i>Jonas Kesseler</i>.<br> Unsorted yet 1809.<!--Put a short description--></div>
  217. </div>
  218. </td>
  219. </tr>
  220.  
  221. <!---To add more members, simply copy/paste everything from NEW ROW OF MEMBERS to this comment and edit the information--->
  222. </table>
  223.  
  224. </div>
  225. </div>
  226.  
  227. <div class="credit"><a href="http://ciralism.tumblr.com">ciralism</a></div>
  228.  
  229. </body>
  230. </html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement
Public Pastes
Advertisement
We use cookies for various purposes including analytics. By continuing to use Pastebin, you agree to our use of cookies as described in the Cookies Policy.  OK, I Understand
Not a member of Pastebin yet?
Sign Up, it unlocks many cool features!