API tools faq
paste
Advertisement
Guest User

Untitled

a guest
Feb 26th, 2017
76
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 10.24 KB | None | 0 0
raw download clone embed print report
  1. <!DOCTYPE HTML>
  2. <html>
  3. <head>
  4.  
  5. <!--
  6.  
  7.  
  8. PAGE PACK - #5 BIAS PAGE BY KIMTYS.TUMBLR.COM
  9.  
  10. edit as much as you want but please don't hide or remove credits!
  11.  
  12.  
  13. -->
  14.  
  15. <title>{Title}</title>
  16. <link rel="shortcut icon" href="{Favicon}">
  17. <meta name="description" content="{MetaDescription}" />
  18. <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js"></script>
  19. <script src="https://static.tumblr.com/iuw14ew/VSQma1786/jquery.style-my-tooltips.js"></script>
  20. <link rel="altertnate" type="application/rss+xml" href="{RSS}">
  21. <link href='https://fonts.googleapis.com/css?family=Oswald' rel='stylesheet' type='text/css'/>
  22.  
  23. <script>
  24. $(document).ready(function(){
  25. $("a[title]").style_my_tooltips({
  26. tip_follows_cursor:true,
  27. tip_delay_time:0,
  28. tip_fade_speed:0,
  29. attribute:"title"
  30. });
  31. });
  32. </script>
  33.  
  34. <style type="text/css">
  35.  
  36.  
  37. ::-moz-selection {
  38. background:#ffc3d4; /* SELECTION BACKGROUND COLOR */
  39. color:#fff; /* SELECTION TEXT COLOR */
  40. }
  41. ::selection {
  42. background:#411212; /* SELECTION BACKGROUND COLOR */
  43. color:#fff; /* SELECTION TEXT COLOR */
  44. }
  45.  
  46. ::-webkit-scrollbar-thumb:vertical {
  47. background: #411212; /* SCROLL COLOR */
  48. height: 5px;
  49. width:9px;
  50. border-radius: 0px; -moz-border-radius: 8px -webkit-border-radius: 8px o-border-radius: 8px; -ms-border-radius: 8px;
  51. }
  52.  
  53.  
  54. ::-webkit-scrollbar {
  55. height: 0px;
  56. width: 3px;
  57. background: transparent;
  58. border: 1px solid transparent transparent transparent transparent;
  59. }
  60.  
  61. body {
  62. margin:0;
  63. padding:0;
  64. border:0;
  65. background-color: #fff;
  66. background-image: url(http://i.imgur.com/UyDBHed.png);
  67. background-attachment: fixed;
  68. background-position: center;
  69. -webkit-background-size: cover;
  70. -moz-background-size: cover;
  71. -o-background-size: cover;
  72. background-size: cover;
  73. background-repeat: not-repeat;
  74. color:#aaa;
  75. font-family:arial;
  76. font-size:10px;
  77. word-wrap:break-word;
  78. }
  79.  
  80. a {
  81. color:#aaa; /* LINK COLOR */
  82. text-decoration:underline;
  83. }
  84.  
  85.  
  86. a:hover {
  87. color:#aaa; /*LINK HOVER COLOR */
  88. cursor:help;
  89. text-decoration:none;
  90. }
  91.  
  92. b, bold, strong {
  93. color:#aaa; /* BOLD COLOR */
  94. }
  95.  
  96. #s-m-t-tooltip {
  97. z-index: 9999;
  98. background: #fff; /* TOOLTIP BACKGROUND COLOR */
  99. line-height:150%;
  100. font: 9px tunga;
  101. color:#bbb; /* TOOLTIP TEXT COLOR */
  102. font-style: normal;
  103. letter-spacing: 1px;
  104. font-weight:bold;
  105. text-transform: uppercase;
  106. border: 2px solid #f2f4f9; /* TOOLTIP BORDER 1 COLOR */
  107. outline:2px solid #fff; /* TOOLTIP BORDER 2 COLOR */
  108. max-width: 300px;
  109. text-align: justify;
  110. padding: 3px 6px 2px 6px;
  111. display: block;
  112. margin: 24px 14px 7px 12px;
  113. }
  114.  
  115. #center {
  116. width:auto;
  117. margin-right:auto;
  118. margin-top:50px;
  119. margin-bottom:50px;
  120. margin-left:268px;
  121. background:transparent;
  122. }
  123.  
  124. #sidebar {
  125. position: fixed;
  126. border-right:2px solid #f5f5f5; /* SIDEBAR BORDER 1 COLOR */
  127. outline:2px solid #fff; /* SIDEBAR BORDER 2 COLOR */
  128. width: 265px;
  129. height:100%;
  130. text-align: center;
  131. top: 0px;
  132. left:0px;
  133. z-index:99;
  134. padding-right:0px;
  135. background:#fff; /* SIDEBAR BACKGROUND COLOR */
  136. }
  137.  
  138. .sidebar {
  139. margin:auto;
  140. margin-top:100px; /* TITLE TOP POSITION */
  141. }
  142.  
  143.  
  144. #title{
  145. font-family: cambria;
  146. line-height:90%;
  147. font-size:40px;
  148. font-weight:700;
  149. text-transform:uppercase;
  150. color: #000; /* TITLE COLOR */
  151. padding: 5px;
  152. text-align:center;
  153. margin-top:0px;
  154. margin-bottom:-15px;
  155. border-bottom:1px solid #ccc;
  156. padding-bottom:5px;
  157. }
  158.  
  159. #title span {
  160. font-weight:300;
  161. color:#411212; /* TITLE SECOND COLOR */
  162. }
  163.  
  164. #desc {
  165. position:relative;
  166. font-size: 9px;
  167. font-family: calibri;
  168. text-transform:uppercase;
  169. letter-spacing:1px;
  170. font-weight:bold;
  171. margin:auto;
  172. color: #ccc; /* DESCRIPTION FONT COLOR */
  173. overflow:scroll;
  174. overflow:auto;
  175. max-height:80px;
  176. margin-top:22px;
  177. opacity:1;
  178. width:200px;
  179. padding:8px 8px 8px 8px;
  180. -webkit-transition: all 1s ease-in-out;
  181. -moz-transition: all 1s ease-in-out;
  182. -o-transition: all 1s ease-in-out;}
  183.  
  184. #link {
  185. display:inline-block;
  186. font:9px calibri;
  187. text-transform:uppercase;
  188. font-weight:bold;
  189. text-transform:italic;
  190. letter-spacing:1px;
  191. margin-top:5px;
  192. }
  193.  
  194. #link a {
  195. color:#bbb; /* DESC LINK COLOR */
  196. padding: 1px 4px 0px 4px;
  197. text-decoration:none;
  198. }
  199.  
  200. #link a:hover {
  201. background:#fff; /* DESC LINK BACKGROUND HOVER COLOR */
  202. color:#bbb; /* DESC LINK HOVER COLOR */
  203. text-decoration:none;
  204. }
  205.  
  206.  
  207. #pic1 {
  208. margin-left:100px;
  209. margin-right:-100px;
  210. margin-bottom:100px;
  211. display:inline-block;
  212. position:relative;
  213. }
  214.  
  215.  
  216. .pic {
  217. width:150px;
  218. height:200px;
  219. margin:20px;
  220. padding:15px;
  221. background:#fff; /* PICS BACKGROUND COLOR */
  222. display:inline-block;
  223. border:2px double #f5f5f5; /* PICS BORDER 1 COLOR */
  224. outline:2px solid #fff; /* PICS BORDER 2 COLOR */
  225. -webkit-transition: all 0.6s ease-in;
  226. -moz-transition: all 0.6s ease-in;
  227. -o-transition: all 0.6s ease-in;
  228. }
  229.  
  230. .pic img {
  231. width:150px;
  232. opacity:;
  233. height:200px;
  234. display:inline-block;
  235. background-position: center;
  236. background-size: length;
  237. background-repeat: not-repeat;
  238. }
  239.  
  240.  
  241. .pic:hover .info {
  242. opacity:1;
  243. margin-top:0px;
  244. -webkit-transition: all 0.4s ease-in;
  245. -moz-transition: all 0.4s ease-in;
  246. -o-transition: all 0.4s ease-in;
  247. }
  248.  
  249. .info {
  250. position:absolute;
  251. width:144px;
  252. height:194px;
  253. padding:3px;
  254. font-size:10px;
  255. word-spacing:0px;
  256. background:#FFF; /* INFO BACKGROUND COLOR */
  257. font-family:calibri;
  258. text-transform:lowercase;
  259. color:#000; /* INFO FONT COLOR */
  260. overflow:scroll;
  261. overflow:auto;
  262. max-height:200px;
  263. opacity:0;
  264. margin-top:0px;
  265. text-align:center;
  266. -webkit-transition: all 0.4s ease-in;
  267. -moz-transition: all 0.4s ease-in;
  268. -o-transition: all 0.4s ease-in;
  269. }
  270.  
  271. .infox {
  272. position: relative;
  273. top: 50%;
  274. max-height:200px;
  275. -webkit-transform: translateY(-50%);
  276. -ms-transform: translateY(-50%);
  277. transform: translateY(-50%);
  278. }
  279.  
  280. .info b {
  281. font-weight:normal;
  282. }
  283.  
  284. h1 {
  285. width:70px;
  286. padding:3px;
  287. background-color: #000;
  288. font-size:7px;
  289. text-transform:uppercase;
  290. letter-spacing:5px;
  291. margin-left:15px;
  292. color:#fff;
  293. font-family:calibri;
  294. font-weight:700;
  295. letter-spacing:2px;
  296. margin-left:30px;
  297. }
  298.  
  299.  
  300.  
  301. #sub {
  302. color:#411212; /* SUBTITLE FONT COLOR */
  303. font-size:13px;
  304. margin-bottom:10px;
  305. text-transform:lowercase;
  306. font-style: italic;
  307. }
  308.  
  309.  
  310. hr {
  311. border:0;
  312. height:2px;
  313. background: #fff; /* BREAK LINE COLOR */
  314. }
  315.  
  316.  
  317. #name {
  318. font-size:14px;
  319. width:180px;
  320. font-family:cambria;
  321. text-transform:uppercase;
  322. text-style:italic;
  323. background-color: #fff;
  324. padding: 4px 5px 4px 5px;
  325. color:#000; /* NAME COLOR */
  326. word-spacing:1px;
  327. text-align:center;
  328. font-weight:500;
  329. margin-top:-10px;
  330. margin-left:18px;
  331. position:absolute;
  332. }
  333.  
  334. #name span {
  335. color:#411212; /* NAME SECOND COLOR */
  336. font-style:italic;
  337. }
  338.  
  339. #name a {
  340. color:#000; /* IF YOU CHANGE THE NAME COLOR, CHANGE THIS TOO */
  341. text-decoration:none;
  342. }
  343.  
  344. #cr {
  345. bottom:10px;
  346. left:10px;
  347. font-weight:bold;
  348. color:#ffc3d4; /* CR LINK COLOR */
  349. font-size:12px;
  350. position:fixed;
  351. background:#f5f5f5; /* CR BACKGROUND COLOR */
  352. padding:4px 7px;
  353. border: 2px solid #fff; /* CR BORDER 1 COLOR */
  354. outline:2px solid #f5f5f5; /* CR BORDER 2 COLOR */
  355. }
  356.  
  357.  
  358.  
  359.  
  360. </style>
  361.  
  362.  
  363. </head>
  364.  
  365. <body>
  366.  
  367.  
  368. <div id="sidebar">
  369.  
  370. <!-- CREDIT -->
  371.  
  372. <a href="http://kimtys.tumblr.com" title="theme by kimtys"><div id="cr">k.</div></a>
  373.  
  374. <!-- SIDEBAR -->
  375.  
  376. <div class="sidebar">
  377. <div id="title"><span>WISH</span>LIST</div>
  378. <div id="desc">
  379. ooc: this is where abel's connections are gathered, if you want to plot with him, you can send a message and we will think/plot something. xox
  380. </div></div>
  381. <div id="link"><a href="/">back</a> <a href="/ask">ask</a> <a href="/a">atlas</a></div>
  382. </div>
  383.  
  384. <div id="center">
  385.  
  386. <!-- NAME 1 -->
  387.  
  388. <div id="pic1">
  389. <div class="pic">
  390. <div class="info"><section class="infox">
  391. <h1>muse</h1>
  392. <div id="sub">pretty quote</div>
  393. <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer quis mattis tortor. Phasellus vulputate interdum purus a viverra. Phasellus tristique ante at libero congue, imperdiet tempus est gravida. Morbi ut sapien ut urna euismod auctor a sed purus. Nunc commodo suscipit tellus, maximus elementum eros consectetur eleifend. Vivamus quis diam metus. Phasellus volutpat libero diam. In auctor fringilla enim. Cras pharetra lacinia tellus, ut fermentum tortor efficitur eget. Aenean justo tortor, blandit a tempus ac, mollis tempus nulla. Mauris felis dolor, hendrerit pretium maximus vel, efficitur et nunc. Nulla vel interdum quam, quis tristique metus.</p>
  394.  
  395. <p>Sed rutrum, eros non fermentum placerat, neque ipsum euismod orci, id mattis tellus orci non metus. Maecenas eget odio augue. Vivamus fermentum pulvinar nulla sed semper. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nam et pretium dui, sed vulputate enim. Vivamus ac elementum diam. Nam ut lorem non dui eleifend facilisis. Nam at ex laoreet, gravida est consectetur, porta tortor. Ut luctus nisi in felis facilisis lacinia. Nulla commodo lacus non vestibulum dictum. Ut mauris velit, mollis eu dolor eu, fermentum rhoncus nisl. Pellentesque laoreet mi nisi, eget vehicula mauris pretium id.</p>
  396.  
  397. <p>Aliquam tincidunt vitae leo eget molestie. Duis tempus tempus ligula, sed dapibus arcu pulvinar eget. Nunc sagittis nisl nec massa interdum suscipit. Duis lobortis rutrum risus at congue. Nulla eu diam scelerisque, auctor dolor vitae, commodo leo. Proin pellentesque sem nec posuere tincidunt. Aenean nec faucibus dolor. Aliquam suscipit, turpis a fermentum efficitur, leo dui euismod urna, quis lobortis nunc lectus a turpis. Nunc ultricies risus ipsum, a congue nibh porttitor nec.</p>
  398. </div></section>
  399. <img src="https://s-media-cache-ak0.pinimg.com/236x/0f/6d/e8/0f6de8ecccf061f28afe68e9cd491afa.jpg"></div> <!-- 150x200px -->
  400. <div id="name"><a href="LINK HERE">
  401. <span>worst</span> behaviour
  402. </div></a></div>
  403.  
  404. <!-- END NAME 1 -->
  405.  
  406.  
  407. <!-- BREAK LINE -->
  408.  
  409.  
  410.  
  411. </div>
  412. </body>
  413. </html>
  414.  
  415. <!--
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!