Advertisement
sexycullen

# 75

May 24th, 2014
4,562
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 9.21 KB | None | 0 0
  1. <html>
  2. <head>
  3.  
  4. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  5. <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
  6.  
  7. <!--------------------------------------------
  8. THEME # 75
  9. BY: http://britishrobert.tumblr.com/ (PREV SPUNKHANDSOME)
  10.  
  11. RULES, IMPORTANT: DON'T REMOVE THE CREDIT // DON'T CLAIM AS YOUR OWN // DON'T USE AS A BASE
  12.  
  13. --------------------------------------------->
  14.  
  15. <title>{Title}</title>
  16. <link rel="shortcut icon" href="{Favicon}">
  17. <link rel="altertnate" type="application/rss+xml" href="{RSS}">
  18. <meta name="description" content="" />
  19. <meta http-equiv="x-dns-prefetch-control" content="off"/>
  20.  
  21. <link href='http://fonts.googleapis.com/css?family=Merriweather+Sans:400,700' rel='stylesheet' type='text/css'>
  22.  
  23. <link href='http://fonts.googleapis.com/css?family=Josefin+Slab:400,700,400italic,700italic' rel='stylesheet' type='text/css'>
  24.  
  25. <link href='http://fonts.googleapis.com/css?family=Kotta+One' rel='stylesheet' type='text/css'>
  26.  
  27. <link href='http://fonts.googleapis.com/css?family=Junge' rel='stylesheet' type='text/css'>
  28.  
  29. <link href='http://fonts.googleapis.com/css?family=Open+Sans+Condensed:300,300italic,700&subset=latin,cyrillic-ext' rel='stylesheet' type='text/css'>
  30.  
  31.  
  32. <style type="text/css">
  33.  
  34. ::-webkit-scrollbar {background-color: transparent; height:4px; width:3px}
  35. ::-webkit-scrollbar-thumb:vertical {background-color:#000000; height:50px}
  36. ::-webkit-scrollbar-thumb:horizontal {background-color:#FFFFFF; height:8px!important}
  37.  
  38. body {
  39. color: {color:Text};
  40. background-color:#FFFFFF;
  41. }
  42.  
  43. a {
  44. color: #444;
  45. text-decoration: none;
  46. -moz-transition-duration: 0.5s;
  47. -o-transition-duration: 0.5s;
  48. -webkit-transition-duration: 0.5s;
  49. transition-duration: 0.5s;
  50. }
  51.  
  52. a:hover {
  53. color: #000000;
  54. -moz-transition-duration: 0.5s;
  55. -o-transition-duration: 0.5s;
  56. -webkit-transition-duration: 0.5s;
  57. transition-duration: 0.5s;
  58. }
  59.  
  60. .sidebar {
  61. margin:auto;
  62. top:130px;
  63. margin-left:-60px;
  64. }
  65.  
  66. .part1 {
  67. padding:5px;
  68. top:130px;
  69. margin:auto;
  70. position:fixed;
  71. }
  72.  
  73. .table1 {
  74. width:200px;
  75. padding:0px 5px 5px 5px;
  76. border-right: 1px solid #F5F5F5;
  77. }
  78.  
  79. .links1 {
  80. text-transform: uppercase;
  81. letter-spacing: 0px;
  82. font-family: Open Sans Condensed;
  83. font-size:11px;
  84. letter-spacing:1px;
  85. text-align:right;
  86. padding:4px;
  87. line-height:290%;
  88. margin: 15px 0 6px 0;
  89. color:#262626;
  90. }
  91.  
  92. .links1 a {
  93. border-bottom: 1px solid #f0f0f0;
  94. padding:3px;
  95. }
  96.  
  97. .links1 a:hover {
  98. letter-spacing:4px;
  99. -moz-transition-duration: 0.5s;
  100. -o-transition-duration: 0.5s;
  101. -webkit-transition-duration: 0.5s;
  102. transition-duration: 0.5s;
  103. }
  104.  
  105. .container {
  106. width:1000px;
  107. height:auto;
  108. position:relative;
  109. margin:auto;
  110. top: 3px;
  111. left:1px;
  112. border: 0px solid #f0f0f0;
  113. }
  114.  
  115. .chars {
  116. width:750px;
  117. height:auto;
  118. margin:auto;
  119. position:relative;
  120. margin-top: 5px;
  121. margin-left:160px;
  122. border: 0px solid #000;
  123. }
  124.  
  125. .table:hover .name { margin-top:2px;filter: alpha(opacity = 100);
  126. opacity:100;-webkit-transition: all 0.5s ease-out;
  127. -moz-transition: all 0.5s ease-out;transition: all 0.5s ease-out;}
  128.  
  129. .table:hover .basic { margin-top:-160px;filter: alpha(opacity = 100);
  130. opacity:100;-webkit-transition: all 0.5s ease-out;
  131. -moz-transition: all 0.5s ease-out;transition: all 0.5s ease-out;}
  132.  
  133. .table:hover .image {margin-top:0px;filter: alpha(opacity = 20);
  134. opacity:0.1;-webkit-transition: all 0.5s ease-out;
  135. -moz-transition: all 0.5s ease-out;transition: all 0.5s ease-out;}
  136.  
  137. .table {
  138. width:160px;
  139. height:auto;
  140. position:relative;
  141. margin-left:20px;
  142. text-align:center;
  143. margin-top:60px;
  144. top:4px;
  145. display:inline-block;
  146. border: 0px solid #f0f0f0;
  147. }
  148.  
  149. .image {
  150. width:160px;
  151. height:auto;
  152. -webkit-transition:0.7s ease; opacity:100;
  153. border-bottom: 1px solid #f0f0f0;
  154. }
  155.  
  156. .name {
  157. width:160px;
  158. font-size:7px;
  159. font-family:arial;
  160. letter-spacing:3px;
  161. margin-top:2px;
  162. padding-top:5px;
  163. padding-bottom:5px;
  164. text-align:center;
  165. text-transform:uppercase;
  166. font-weight:none;
  167. color:#000;
  168. background-color:;
  169. -webkit-transition:0.7s ease; position:absolute; opacity:100;
  170. border-bottom: 1px solid #f0f0f0;
  171. }
  172.  
  173. .basic {
  174. width:160px;
  175. text-align:center;
  176. font-size:9px;
  177. font-family:cambria;
  178. line-height:130%;
  179. padding:5px 3px;
  180. margin-top:-160px;
  181. color:#444;
  182. -webkit-transition:0.7s ease; position:absolute; opacity:0;
  183. }
  184.  
  185. .links {
  186. letter-spacing: 0px;
  187. font-size:10px;
  188. font-family: calibri;
  189. padding:4px 3px;
  190. margin: 5px 0 6px 0;
  191. color:#262626;
  192. border-bottom: 0px solid #f0f0f0;
  193. }
  194.  
  195. .links a {
  196. padding:3px;
  197. }
  198.  
  199. .info {
  200. padding:4px;
  201. margin:1px;
  202. text-align:justify;
  203. font-size:10px;
  204. font-family: calibri;
  205. color:#000000;
  206. }
  207.  
  208. .credit {
  209. position:fixed;
  210. font-family:calibri;
  211. font-size:8px;
  212. font-weight:normal;
  213. line-height:150%;
  214. letter-spacing:0px;
  215. right:5px;
  216. bottom:20px;
  217. text-transform:uppercase;
  218. text-align:center;
  219. }
  220.  
  221. .credit a {
  222. font-style:normal;
  223. padding:3px;
  224. color:{color:Link};
  225. -moz-transition-duration:0.5s;
  226. -webkit-transition-duration:0.5s;
  227. -o-transition-duration:0.5s;
  228. }
  229.  
  230. </style>
  231. </head>
  232. <body>
  233. <div class="container">
  234. <div class="sidebar">
  235. <td>
  236.  
  237. <div class="part1">
  238. <div class="table1">
  239.  
  240. <div class="links1">
  241. <a href="/">link</a><br>
  242. <a href="/">link</a><br>
  243. <a href="/">link</a><br>
  244. <a href="/">link</a><br>
  245. <a href="/">link</a><br>
  246. <a href="/">link</a><br>
  247. <a href="/">link</a><br>
  248. </div>
  249.  
  250. </div>
  251. </div>
  252. </div>
  253. </td>
  254.  
  255.  
  256. <div class="chars">
  257.  
  258. <! 1 >
  259. <tr>
  260. <div class="table">
  261.  
  262. <center><img src="https://31.media.tumblr.com/978884ca1b420217bc6a3ee6b5b40377/tumblr_inline_n1zocpM26y1sso8d0.png" class="image">
  263. <div class="name">
  264. <a href="/"> name</a>
  265. </div>
  266. <div class="basic">
  267. lorem ipsum dolor sit amet, consectetuer adipiscing elit. aliquam nisi lorem, pulvinar id, commodo feugiat, vehicula et, mauris.
  268. </div>
  269. </div>
  270.  
  271.  
  272.  
  273. <! 2 >
  274. <tr>
  275. <div class="table">
  276.  
  277. <center><img src="https://31.media.tumblr.com/978884ca1b420217bc6a3ee6b5b40377/tumblr_inline_n1zocpM26y1sso8d0.png" class="image">
  278. <div class="name">
  279. <a href="/"> name</a>
  280. </div>
  281. <div class="basic">
  282. lorem ipsum dolor sit amet, consectetuer adipiscing elit. aliquam nisi lorem, pulvinar id, commodo feugiat, vehicula et, mauris.
  283. </div>
  284. </div>
  285.  
  286.  
  287. <! 3 >
  288. <tr>
  289. <div class="table">
  290.  
  291. <center><img src="https://31.media.tumblr.com/978884ca1b420217bc6a3ee6b5b40377/tumblr_inline_n1zocpM26y1sso8d0.png" class="image">
  292. <div class="name">
  293. <a href="/"> name</a>
  294. </div>
  295. <div class="basic">
  296. lorem ipsum dolor sit amet, consectetuer adipiscing elit. aliquam nisi lorem, pulvinar id, commodo feugiat, vehicula et, mauris.
  297. </div>
  298. </div>
  299.  
  300.  
  301. <! 4 >
  302. <tr>
  303. <div class="table">
  304.  
  305. <center><img src="https://31.media.tumblr.com/978884ca1b420217bc6a3ee6b5b40377/tumblr_inline_n1zocpM26y1sso8d0.png" class="image">
  306. <div class="name">
  307. <a href="/"> name</a>
  308. </div>
  309. <div class="basic">
  310. lorem ipsum dolor sit amet, consectetuer adipiscing elit. aliquam nisi lorem, pulvinar id, commodo feugiat, vehicula et, mauris.
  311. </div>
  312. </div>
  313.  
  314.  
  315. <br>
  316.  
  317.  
  318. <! 5 >
  319. <tr>
  320. <div class="table">
  321.  
  322. <center><img src="https://31.media.tumblr.com/978884ca1b420217bc6a3ee6b5b40377/tumblr_inline_n1zocpM26y1sso8d0.png" class="image">
  323. <div class="name">
  324. <a href="/"> name</a>
  325. </div>
  326. <div class="basic">
  327. lorem ipsum dolor sit amet, consectetuer adipiscing elit. aliquam nisi lorem, pulvinar id, commodo feugiat, vehicula et, mauris.
  328. </div>
  329. </div>
  330.  
  331.  
  332.  
  333. <! 6 >
  334. <tr>
  335. <div class="table">
  336.  
  337. <center><img src="https://31.media.tumblr.com/978884ca1b420217bc6a3ee6b5b40377/tumblr_inline_n1zocpM26y1sso8d0.png" class="image">
  338. <div class="name">
  339. <a href="/"> name</a>
  340. </div>
  341. <div class="basic">
  342. lorem ipsum dolor sit amet, consectetuer adipiscing elit. aliquam nisi lorem, pulvinar id, commodo feugiat, vehicula et, mauris.
  343. </div>
  344. </div>
  345.  
  346.  
  347.  
  348.  
  349. <! 7 >
  350. <tr>
  351. <div class="table">
  352.  
  353. <center><img src="https://31.media.tumblr.com/978884ca1b420217bc6a3ee6b5b40377/tumblr_inline_n1zocpM26y1sso8d0.png" class="image">
  354. <div class="name">
  355. <a href="/"> name</a>
  356. </div>
  357. <div class="basic">
  358. lorem ipsum dolor sit amet, consectetuer adipiscing elit. aliquam nisi lorem, pulvinar id, commodo feugiat, vehicula et, mauris.
  359. </div>
  360. </div>
  361.  
  362.  
  363.  
  364.  
  365. <! 8 >
  366. <tr>
  367. <div class="table">
  368.  
  369. <center><img src="https://31.media.tumblr.com/978884ca1b420217bc6a3ee6b5b40377/tumblr_inline_n1zocpM26y1sso8d0.png" class="image">
  370. <div class="name">
  371. <a href="/"> name</a>
  372. </div>
  373. <div class="basic">
  374. lorem ipsum dolor sit amet, consectetuer adipiscing elit. aliquam nisi lorem, pulvinar id, commodo feugiat, vehicula et, mauris.
  375. </div>
  376. </div>
  377.  
  378.  
  379.  
  380.  
  381.  
  382. <div class="credit"><a href="http://britishrobert.tumblr.com/"><u>britishrobert</a></u></div>
  383.  
  384.  
  385. </div>
  386. </div>
  387. </div>
  388.  
  389.  
  390. </body>
  391. </html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement