API tools faq
paste
Advertisement
cat_inthe_cradle

Grid

cat_inthe_cradle
Aug 16th, 2016
83
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 13.33 KB | None | 0 0
raw download clone embed print report
  1.  
  2. <style>
  3. body {
  4. background-image:url('http://i.picpar.com/SZXb.png'); }
  5.  
  6. ::-webkit-scrollbar {
  7. width: 5px;
  8. height: 10px;
  9. padding-top: 40px; }
  10.  
  11. ::-webkit-scrollbar-track {
  12. background-color: #ffffff; }
  13.  
  14. ::-webkit-scrollbar-thumb {
  15. height: 30px;
  16. width: 5px;
  17.  
  18. background-color: #f1f1f1; }
  19.  
  20. ::-webkit-scrollbar-track-piece {
  21. height: 30px;
  22. width: 30px; }
  23.  
  24. ::-moz-selection, ::selection {
  25. background: #ebf6f9;
  26. color: #ffffff;
  27. !important }
  28.  
  29. ::selection {
  30. background: #ebf6f9;
  31. color: #ffffff;
  32. !important }
  33.  
  34. a {
  35. font-family: calibri;
  36. font-size: 9px;
  37. text-transform: uppercase;
  38. color: #BD3F3F;
  39. letter-spacing: 0px;
  40. text-decoration: none;
  41. -webkit-transition: all .5s ease-in-out;
  42. }
  43. a:hover {
  44. color: #000;
  45. letter-spacing: 1px;
  46. background-color:#fff;
  47. }
  48. i {
  49. font-style: italic;
  50. font-size: 9px;
  51. font-family: georgia;
  52. text-transform: lowercase;
  53. font-weight: bold italics;
  54. line-spacing: 4px;
  55. color: #000;
  56. }
  57. b {
  58. color: #000;
  59. text-shadow: 1px 2px 4px grey;
  60. font-family: calibri;
  61. font-size: 9px;
  62. line-height: 10px;
  63. text-transform: uppercase;
  64. }
  65. u {
  66. color: #c2e0e8;
  67. font-family: lucida console;
  68. font-size: 8px;
  69. text-transform: uppercase;
  70. letter-spacing: 0px;
  71. text-decoration: none;
  72. border-bottom: dashed 1px #c2e0e8;
  73. }
  74.  
  75. .mainbox {
  76. background-color: #;
  77. position: fixed;
  78. width: 181px;
  79. height: 215px;
  80. left: 774px;
  81. top: 425px;
  82. padding: 10px;
  83. border: px solid #f1f1f1;
  84. opacity: 1;
  85.  
  86. }
  87. .quotebox {
  88. position: fixed;
  89. background-color: #fff;
  90. opacity: 1;
  91. top: 135px;
  92. height: 20px;
  93. width: 216px;
  94. left: 483px;
  95. border-bottom: 7px solid #cfc53f;
  96. font-family: times new roman;
  97. font-size: 20px;
  98. text-transform: uppercase;
  99. line-height: 25px;
  100. text-align: center;
  101. letter-spacing: -4px;
  102. color: #;
  103. font-weight:bold;
  104. }
  105.  
  106. h1 {
  107. padding: 0px;
  108. margin: 0px;
  109.  
  110. font-size: 13px;
  111. font-family: georgia;
  112. font-weight: lighter;
  113. text-transform: uppercase;
  114. text-align: center;
  115. letter-spacinG: 5px;
  116. text-shadow:-2px 1px 0px #000;
  117. color: #ffffff;
  118. }
  119. h2 {
  120. padding: 0px;
  121. margin: 0px 0px 1px 0px;
  122. font-size: 10px;
  123. font-family: georgia;
  124. font-style: italic;
  125. font-weight: lighter;
  126. text-transform: lowercase;
  127. text-align: center;
  128. letter-spacing: 3px;
  129. color: #fff;
  130. background-color:#000;
  131. line-height:5px;
  132. }
  133. .toggleone {
  134. display: inline-block;
  135. color: #ffffff;
  136. background-color: #000;
  137. text-decoration: none;
  138. text-transform: uppercase;
  139. letter-spacing: 0px;
  140. font-family: corbel;
  141. font-size: 9px;
  142. width: 40px;
  143. height: 15px;
  144. margin: 0px 0px 0px 0px;
  145. line-height: 15px;
  146. text-align: center;
  147. -webkit-transition: all .7s ease-in-out;
  148. }
  149. .toggleone:hover {
  150. background-color: #fff;
  151. color: #000;
  152. }
  153. #containerone {
  154. background-color: #fff;
  155. width: 190px;
  156. height: 115px;
  157. top: 3px;
  158. left: -4px;
  159. font-family: arial;
  160. font-size: 9px;
  161. color: #000;
  162. letter-spacing: 1px; }
  163.  
  164. .hoverbox {
  165. position: fixed;
  166. background-color: #fff;
  167. opacity: 0;
  168. width: 208px;
  169. height: 100px;
  170. padding: 5px;
  171. left: 483px;
  172. top: 135px;
  173. font-family: arial;
  174. font-size: 9px;
  175. color: #;
  176. letter-spacing: 0px;
  177. -webkit-transition: all .7s ease-in-out;
  178. }
  179. .hoverbox:hover {
  180. opacity: 1;
  181. top: 190px;
  182. }
  183. .hoverbox b {
  184. color: #d0e6ec;
  185. font-family: calibri;
  186. font-size: 10px;
  187. line-height: 5px;
  188. text-transform: uppercase;
  189. }
  190. .titlebox {
  191. position: fixed;
  192. background-color: #transparent;
  193. -webkit-transform: rotate(90deg);
  194. width: 300px;
  195. height: 30px;
  196. top: 330px;
  197. left: 833px;
  198. font-family: impact;
  199. font-size: 38px;
  200. color: #ffffff;
  201. text-transform: uppercase;
  202. letter-spacing: -1px;
  203. }
  204. .linkbox {
  205. position: fixed;
  206. background-color: #fff;
  207. width: 100px;
  208. height: 100px;
  209. left: 784px;
  210. top: 415px;
  211. z-index: 9;
  212. opacity: 0;
  213. border: 1px solid #000;
  214. -webkit-transition: all .7s ease-in-out;
  215. }
  216. .linkbox:hover {
  217. opacity: 1;
  218. }
  219. .linkbox a {
  220. display: block;
  221. background-color: #ebf6f9;
  222. margin-top: 4px;
  223. height: 15px;
  224. width: 90px;
  225. align: center;
  226. line-height: 15px;
  227. color: #fff;
  228. }
  229. .linkbox a:hover {
  230. background-color: #d5e9ee;
  231. }
  232.  
  233.  
  234.  
  235. #updates {
  236. font-family:helvetica;
  237. font-size:10px;
  238. top:30px;
  239. left:30px;
  240. }
  241.  
  242. #updates h1 {
  243. font-weight:bold;
  244. letter-spacing:2px;
  245. font-size:8px;
  246. text-transform:uppercase;
  247. font-style:none;
  248. }
  249.  
  250. #updates a{
  251. text-decoration:none;
  252. color:#000000;
  253. }
  254.  
  255. #updates a:hover{
  256. letter-spacing:2px;
  257. }
  258.  
  259. #point1 {
  260. position:fixed;
  261. top:100px;;
  262. left:350px;
  263. border:1px solid #000;
  264. width:5px;
  265. height:5px;
  266. border-radius:50%;
  267. background-color:#000;
  268. padding:2px;
  269. z-index:3;
  270. -webkit-transition: all 0.8s ease-out;
  271. -moz-transition: all 0.8s ease-out;
  272. transition: all 0.8s ease-out;
  273. }
  274.  
  275. #point1:hover #cont1 {
  276. opacity:1;
  277. width:110px;
  278. height:60px;
  279. }
  280.  
  281. #cont1 {
  282. position:fixed;
  283. padding:2px;
  284. background-color:#fff;
  285. overflow:hidden;
  286. line-height:11px;
  287. width:0;
  288. height:0;
  289. opacity:0;
  290. top:100px;
  291. left:365px;
  292. -webkit-transition: all 0.8s ease-out;
  293. -moz-transition: all 0.8s ease-out;
  294. transition: all 0.8s ease-out;
  295. }
  296.  
  297. #line1 {
  298. width:55px;
  299. height:1px;
  300. background-color:#000;
  301. position:fixed;
  302. margin-top:108px;
  303. margin-left:345px;
  304. -ms-transform: rotate(60deg);
  305. -ms-transform-origin: 15%;
  306. -webkit-transform: rotate(60deg);
  307. -webkit-transform-origin: 15%;
  308. transform: rotate(60deg);
  309. transform-origin: 15%;
  310. }
  311.  
  312. #point2 {
  313. position:fixed;
  314. margin-top:141px;
  315. margin-left:370px;
  316. border:1px solid #000;
  317. width:5px;
  318. height:5px;
  319. border-radius:50%;
  320. background-color:#000;
  321. padding:2px;
  322. z-index:2;
  323. -webkit-transition: all 0.8s ease-out;
  324. -moz-transition: all 0.8s ease-out;
  325. transition: all 0.8s ease-out;
  326. }
  327.  
  328. #point2:hover #cont2 {
  329. opacity:1;
  330. width:110px;
  331. height:100px;
  332. }
  333.  
  334. #cont2 {
  335. position:fixed;
  336. padding:2px;
  337. overflow:hidden;
  338. line-height:11px;
  339. width:0;
  340. background-color:#fff;
  341. height:0;
  342. opacity:0;
  343. margin-top:10px;
  344. margin-left:15px;
  345. -webkit-transition: all 0.8s ease-out;
  346. -moz-transition: all 0.8s ease-out;
  347. transition: all 0.8s ease-out;
  348. }
  349.  
  350. #line2 {
  351. width:55px;
  352. height:1px;
  353. background-color:#000;
  354. position:fixed;
  355. margin-top:154px;
  356. margin-left:360px;
  357. -ms-transform: rotate(110deg);
  358. -ms-transform-origin: 20%;
  359. -webkit-transform: rotate(110deg);
  360. -webkit-transform-origin: 20%;
  361. transform: rotate(110deg);
  362. transform-origin: 20%;
  363. }
  364.  
  365. #point3 {
  366. position:fixed;
  367. margin-top:188px;
  368. margin-left:350px;
  369. border:1px solid #000;
  370. width:5px;
  371. height:5px;
  372. border-radius:50%;
  373. background-color:#000;
  374. padding:2px;
  375. z-index:1;
  376. -webkit-transition: all 0.8s ease-out;
  377. -moz-transition: all 0.8s ease-out;
  378. transition: all 0.8s ease-out;
  379. }
  380.  
  381. #point3:hover #cont3 {
  382. opacity:1;
  383. width:110px;
  384. height:100px;
  385. }
  386.  
  387. #cont3 {
  388. position:fixed;
  389. padding:2px;
  390. overflow:hidden;
  391. line-height:11px;
  392. width:0;
  393. height:0;
  394. opacity:0;
  395. margin-top:-10px;
  396. background-color:#fff;
  397. margin-left:15px;
  398. -webkit-transition: all 0.8s ease-out;
  399. -moz-transition: all 0.8s ease-out;
  400. transition: all 0.8s ease-out;
  401. }
  402.  
  403. #line3 {
  404. width:45px;
  405. height:1px;
  406. background-color:#000;
  407. position:fixed;
  408. margin-top:200px;
  409. margin-left:350px;
  410. -ms-transform: rotate(50deg);
  411. -ms-transform-origin: 20%;
  412. -webkit-transform: rotate(50deg);
  413. -webkit-transform-origin: 20%;
  414. transform: rotate(50deg);
  415. transform-origin: 20%;
  416. }
  417.  
  418. #point4 {
  419. position:fixed;
  420. margin-top:221px;
  421. margin-left:375px;
  422. border:1px solid #000;
  423. width:5px;
  424. height:5px;
  425. border-radius:50%;
  426. background-color:#000;
  427. padding:2px;
  428. z-index:0;
  429. -webkit-transition: all 0.8s ease-out;
  430. -moz-transition: all 0.8s ease-out;
  431. transition: all 0.8s ease-out;
  432. }
  433.  
  434. #point4:hover #cont4 {
  435. opacity:1;
  436. width:110px;
  437. height:100px;
  438. }
  439.  
  440. #cont4 {
  441. position:fixed;
  442. padding:2px;
  443. overflow:hidden;
  444. line-height:11px;
  445. width:0;
  446. height:0;
  447. opacity:0;
  448. margin-top:-13px;
  449. background-color:#fff;
  450. margin-left:15px;
  451. -webkit-transition: all 0.8s ease-out;
  452. -moz-transition: all 0.8s ease-out;
  453. transition: all 0.8s ease-out;
  454. }
  455.  
  456.  
  457. #acontent, #bcontent, #ccontent, #dcontent, #econtent {
  458.  
  459. width: 200px;
  460. height: 110px;
  461. overflow: auto;
  462. text-align:justify;}
  463.  
  464.  
  465. #bring, #forth, #the, #night {
  466.  
  467. width: 200px;
  468. height: 110px;
  469. overflow: hidden;
  470.  
  471. }
  472.  
  473.  
  474.  
  475.  
  476.  
  477. </style>
  478.  
  479. <div style="letter-spacing: 2px; text-shadow: ##585858 0pt 0em .1em, ##585858 0pt 0em 1em,##585858 1pt 1em 1em; border-radius: ; opacity: 1; width: 504px; height: 337px; background-color:#cfc53f; position: absolute; top: 165px; left: 448px; overflow: auto; text-align: left; border: px solid #BABABA;"><span style="font-family: andale mono,times; font-size: xx-small; color: #000000;"></span></div>
  480.  
  481.  
  482.  
  483. <div style="letter-spacing: 2px; text-shadow: ##585858 0pt 0em .1em, ##585858 0pt 0em 1em,##585858 1pt 1em 1em; border-radius: ; opacity: 1; width: px; height: px; background-image:url(''); position: absolute; top: 167px; left: 450px; overflow: auto; text-align: left; border: px solid #BABABA;"><span style="font-family: andale mono,times; font-size: xx-small; color: #000000;"><img src="image link" alt="" width="500" height="" /></span></div>
  484.  
  485.  
  486.  
  487. <div class="linkbox">
  488. <center>
  489. <div style="width: 100px; height: 100px; border: 4px solid #cfc53f; 33px;">
  490. <img src="image link" height=100; width=100>
  491. </div>
  492. </center>
  493. </div>
  494.  
  495.  
  496.  
  497.  
  498. <div class="titlebox">T e x t </div>
  499.  
  500.  
  501.  
  502.  
  503. <div class="mainbox">
  504. <div style="width: 100px; height: 100px; border: 4px solid #cfc53f; margin-top: -70px; margin-left: 33px; margin-bottom: 10px;">
  505. <img src="image link" height=100; width=100>
  506. </div>
  507.  
  508.  
  509.  
  510.  
  511.  
  512.  
  513.  
  514. <div style="letter-spacing: 2px; text-shadow: ##585858 0pt 0em .1em, ##585858 0pt 0em 1em,##585858 1pt 1em 1em; border-radius: ; opacity: 1; width: 217px; height: 110px; background-color:#fff; position: absolute; top: -235px; left: -290px; overflow: auto; text-align: left; border: px solid #BABABA;"><span style="font-family: andale mono,times; font-size: xx-small; color: #000000;"></span></div>
  515.  
  516. <div style="letter-spacing: 2px; text-shadow: ##585858 0pt 0em .1em, ##585858 0pt 0em 1em,##585858 1pt 1em 1em; border-radius: ; opacity: 1; width: 208px; height: 100px; background-color: ; position: absolute; top: -225px; left: -280px; overflow: auto; text-align: left; border: px solid #BABABA;"><span style="font-family: andale mono,times; font-size: xx-small; color: #000000;">
  517.  
  518. <b>Text</b> Text
  519.  
  520. </span></div>
  521.  
  522.  
  523. <div style="letter-spacing: 2px; text-shadow: ##585858 0pt 0em .1em, ##585858 0pt 0em 1em,##585858 1pt 1em 1em; border-radius: ; opacity: 1; width: 217px; height: 60px; background-color:#cfc53f; position: absolute; top: -120px; left: -290px; overflow: auto; text-align: left; border: px solid #BABABA;"><span style="font-family: andale mono,times; font-size: xx-small; color: #;">
  524.  
  525. </span></div>
  526.  
  527.  
  528. <div style="letter-spacing: 2px; text-shadow: ##585858 0pt 0em .1em, ##585858 0pt 0em 1em,##585858 1pt 1em 1em; border-radius: ; opacity: 1; width: 205px; height: 50px; background-color:; position: absolute; top: -110px; left: -280px; overflow: auto; text-align: left; border: px solid #BABABA;"><span style="font-family: andale mono,times; font-size: xx-small; color: #fff;">
  529.  
  530. <span style="color: #ffffff;"><i><b>Text</i></b>
  531. </span>
  532.  
  533.  
  534. </span></div>
  535.  
  536.  
  537.  
  538. <div style="letter-spacing: 2px; text-shadow: ##585858 0pt 0em .1em, ##585858 0pt 0em 1em,##585858 1pt 1em 1em; border-radius: ; opacity: 1; width: 110px; height: 30px; background-color:#cfc53f; position: absolute; top: 90px; left: -290px; overflow: auto; text-align: left; border: px solid #BABABA;"><span style="font-family: andale mono,times; font-size: xx-small; color: #;">
  539.  
  540. </span></div>
  541. <div style="letter-spacing: 2px; text-shadow: ##585858 0pt 0em .1em, ##585858 0pt 0em 1em,##585858 1pt 1em 1em; border-radius: ; opacity: 1; width: 170px; height: 30px; background-color:#; position: absolute; top: 100px; left: -268px; overflow: auto; text-align: left; border: px solid #BABABA;"><span style="font-family: andale mono,times; font-size: xx-small; color: #;">
  542.  
  543. <a title="Cat in the Cradle codes" href="cat-inthe-cradle.tumblr.com" target="_blank"><i><b>Cat codes</b></i></a>
  544.  
  545. </span></div>
  546.  
  547. <div style="letter-spacing: 2px; text-shadow: ##585858 0pt 0em .1em, ##585858 0pt 0em 1em,##585858 1pt 1em 1em; border-radius: ; opacity: 1; width: 100px; height: 30px; background-color:#cfc53f; position: absolute; top: -293px; left: -50px; overflow: auto; text-align: left; border: px solid #BABABA;"><span style="font-family: andale mono,times; font-size: xx-small; color: #;"></span></div>
  548.  
  549. <div style="letter-spacing: 2px; text-shadow: ##585858 0pt 0em .1em, ##585858 0pt 0em 1em,##585858 1pt 1em 1em; border-radius: ; opacity: 1; width:px; height:px; position: absolute; top: -283px; left: -40px; overflow: auto; text-align: left; border: px solid #BABABA;"><span style="font-family: andale mono,times; font-size: xx-small; color: #;">
  550.  
  551.  
  552. <a title="text." href="link" target="_blank"><i><b>text.</b></i></a>
  553.  
  554. </span></div>
  555.  
  556.  
  557. <div class="quotebox">text</div>
  558.  
  559.  
  560.  
  561. <div class="hoverbox">
  562. <div style="float: left; width: 49%; height: 95px; overflow: auto; overflow-x: hidden; border: solid 0px #000; line-height:8px;">
  563. <br> <b>-</b> Text</div>
  564.  
  565. <div style="float: left; width: 50%; height: 95px; overflow: auto; overflow-x: hidden; border: solid 1px #f1f1f1;">
  566. <img src="image link" width=100 height=100></div>
  567. </div>
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!