API tools faq
paste
Advertisement
b0rn-to-be-wild

All in one II pastel

b0rn-to-be-wild
May 8th, 2014
384
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 14.68 KB | None | 0 0
raw download clone embed print report
  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  2.  
  3.  
  4. <!----
  5.  
  6. © borntobewildthemes.tumblr.com | "All in One II pastel"
  7.  
  8. + Please do not redistribute this page or remove credits
  9. + You are allowed to make changes as long as you keep our credits
  10. + If you have any questions or concerns, just contact us!
  11. + Thanks for using our page! Hope you enjoy it!
  12.  
  13. ---->
  14.  
  15.  
  16. <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
  17. <head>
  18.  
  19. <!--Google fonts-->
  20.  
  21. <link href="//fonts.googleapis.com/css?family=Arimo:400" rel="stylesheet" type="text/css">
  22.  
  23. <link href='http://fonts.googleapis.com/css?family=Kaushan+Script' rel='stylesheet' type='text/css'>
  24.  
  25. <!------ IMPORTANT SCRIPTS, DO NOT REMOVE ------>
  26.  
  27. <!---Style my tooltips--->
  28.  
  29. <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js"></script>
  30. <script src="jquery.style-my-tooltips.js"></script>
  31.  
  32. <script type="text/javascript" src="http://static.tumblr.com/imovwvl/dJWl20ley/jqueryformasonry.js"></script>
  33.  
  34. <script src="http://static.tumblr.com/rzl30kg/eAxm7a751/jquery.style-my-tooltips.js"></script>
  35. <script>
  36. (function($){
  37. $(document).ready(function(){
  38. $("[title]").style_my_tooltips({
  39. tip_follows_cursor:true,
  40. tip_delay_time:200,
  41. tip_fade_speed:300
  42. }
  43. );
  44. });
  45. })(jQuery);
  46. </script>
  47.  
  48. <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
  49. <script>
  50. $(document).ready(function(){
  51. $("#title1").click(function(){
  52. $("#about").slideToggle(500);
  53. });
  54. });
  55. </script>
  56.  
  57. <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
  58. <script>
  59. $(document).ready(function(){
  60. $("#title2").click(function(){
  61. $("#faq").slideToggle(500);
  62. });
  63. });
  64. </script>
  65.  
  66. <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
  67. <script>
  68. $(document).ready(function(){
  69. $("#title3").click(function(){
  70. $("#tags").slideToggle(500);
  71. });
  72. });
  73. </script>
  74.  
  75. <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
  76. <script>
  77. $(document).ready(function(){
  78. $("#title4").click(function(){
  79. $("#blogroll").slideToggle(500);
  80. });
  81. });
  82. </script>
  83.  
  84. <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
  85.  
  86. <link rel="shortcut icon" href="{Favicon}" />
  87. <link rel="alternate" type="application/rss+xml" href="{RSS}" />
  88.  
  89. <style type="text/css">
  90.  
  91. /* Body */
  92.  
  93. body {
  94. font-style:none;
  95. background-color:#fff;
  96. /* image in the middle */
  97. background-image: url('http://static.tumblr.com/3989e5a80daeb22b4038a748b108c03d/ethhhsr/4cPmm1hd2/tumblr_static_pastel_plasma_colors.jpg');
  98. background-size:cover;
  99. overflow:hidden;
  100. margin:0;
  101. padding:0;
  102. }
  103.  
  104. a {
  105. color:#bbb;
  106. text-decoration:none;
  107. border:none;
  108. -webkit-transition-duration: 0.9s;
  109. }
  110.  
  111. a:hover {
  112. color:{color:hover};
  113. text-decoration:none;
  114. -webkit-transition: all 0.8s ease-out;
  115. -moz-transition: all 0.8s ease-out;
  116. transition: all 0.8s ease-out;
  117. }
  118.  
  119. a img:hover {
  120. opacity:1;
  121. border-radius:0px;
  122. }
  123.  
  124. img {
  125. border:none;
  126. }
  127.  
  128. blockquote {
  129. padding-left:5px;
  130. border-left:2px solid {color:border};
  131. }
  132.  
  133. h1 {
  134. font-size:20px;
  135. }
  136.  
  137. /* Webkit scrollbar */
  138.  
  139. ::-webkit-scrollbar-thumb {
  140. background: #bbb;
  141. height: auto;
  142. border: 2px solid #fff;
  143. }
  144.  
  145. ::-webkit-scrollbar {
  146. height:10px;
  147. width:10px;
  148. background: #bbb;
  149. height: auto;
  150. border: 4px solid #fff;
  151. }
  152.  
  153. /* Cursor code */
  154.  
  155. /* Start http://www.cursors-4u.com */ body, a:hover {cursor: url(http://cur.cursors-4u.net/others/oth-9/oth800.cur), progress !important;} /* End http://www.cursors-4u.com */
  156.  
  157. /* Main stuff */
  158.  
  159. #everything {
  160. margin-left:auto;
  161. margin-right:auto;
  162. margin-top:0px;
  163. }
  164.  
  165. /* Header */
  166.  
  167. #header {
  168. font-size:40px;
  169. text-align:center;
  170. margin-top:0px;
  171. margin-left:0;
  172. border-bottom:3px solid #bbb;
  173. width:100%;
  174. height:40px;
  175. padding:5px;
  176. background:#fff;
  177. }
  178.  
  179. /* Links */
  180.  
  181. #links {
  182. width:100%;
  183. height:15px;
  184. font-family:Arimo;
  185. text-transform:uppercase;
  186. text-align:center
  187. font-size:30px;
  188. margin-top:0px;
  189. margin-left:0px;
  190. padding:0px;
  191. background:#fff;
  192. }
  193.  
  194. #links a {
  195. padding:5px;
  196. font-size:20px;
  197. color: #bbb;
  198. -webkit-transition: all 0.4s ease;
  199. -moz-transition: all 0.4s ease
  200. -o-transition: all 0.4s ease;
  201. -ms-transition: all 0.4s ease;
  202. transition: all 0.4s ease;
  203. }
  204.  
  205. #links a:hover {
  206. color:#fff;
  207. background-color:#bbb;
  208. }
  209.  
  210. /* Container */
  211.  
  212. #container{
  213. z-index: 300;
  214. top:90px;
  215. position:absolute;
  216. left:0px;
  217. width:100%;
  218. height:100%;
  219. text-align:center;
  220. background-color:#fff;
  221. opacity:1;
  222. border-top:3px solid #bbb;
  223. overflow:hidden;
  224. }
  225.  
  226. #container2{
  227. z-index: 300;
  228. top:40px;
  229. position:relative;
  230. margin:auto;
  231. width:400px;
  232. height:100%;
  233. text-align:center;
  234. overflow-x:hidden;
  235. overflow-y:auto;
  236. }
  237.  
  238. /* First box */
  239.  
  240. #title1 {
  241. font-family:'Kaushan Script';
  242. font-size:30px;
  243. text-align:center;
  244. line-height:50px;
  245. margin-top:0px;
  246. margin-left:96px;
  247. color:#fff;
  248. width:300px;
  249. height:50px;
  250. padding:5px;
  251. background:#FBECE2;
  252. }
  253.  
  254. #title1 p {
  255. margin:10px 0px;
  256. }
  257.  
  258. #title1 span{
  259. display:block;
  260. float:left;
  261. position:absolute;
  262. width:1px;
  263. height:1px;
  264. font-size:0;
  265. line-height: 1px;
  266. margin-left:20px;
  267. margin-top:0px;
  268. border-top:7px solid transparent;
  269. border-bottom:7px solid transparent;
  270. border-right:10px solid red;
  271. z-index:1000000;
  272. }
  273.  
  274. #title1:hover{
  275. color:#777;
  276. -webkit-transition: all 0.7s ease-in-out;
  277. -moz-transition: all 0.7s ease-in-out;
  278. -o-transition: all 0.7s ease-in-out;
  279. }
  280.  
  281. #title1img img{
  282. position:absolute;
  283. margin-top:-5px;
  284. margin-left:-250px;
  285. border: 5px ridge #bbb;
  286. width: 50px;
  287. height:50px;
  288. }
  289.  
  290. #about{
  291. width:380px;
  292. font-family:'Arimo';
  293. max-height:150px;
  294. overflow:hidden;
  295. overflow-y:auto;
  296. padding:10px;
  297. padding-top:0px;
  298. margin-top:5px;
  299. margin-left:20;
  300. font-size:15px;
  301. color:#bbb;
  302. line-height:20px;
  303. display:none;
  304. text-align:left;
  305. }
  306.  
  307. #about:first-letter{
  308. font-size:200%;
  309. font-family:Kaushan Script;
  310. color:#777;
  311. }
  312.  
  313. /* Second box */
  314.  
  315. #title2 {
  316. font-family:'Kaushan Script';
  317. font-size:30px;
  318. text-align:center;
  319. line-height:50px;
  320. margin-top:4px;
  321. margin-left:0px;
  322. color:#fff;
  323. width:400px;
  324. height:50px;
  325. padding:5px;
  326. background:#E1EFCB;
  327. }
  328.  
  329. #title2:hover{
  330. color:#777;
  331. -webkit-transition: all 0.7s ease-in-out;
  332. -moz-transition: all 0.7s ease-in-out;
  333. -o-transition: all 0.7s ease-in-out;
  334. }
  335.  
  336. #faq{
  337. position:relative;
  338. width:380px;
  339. font-family:Arimo;
  340. max-height:150px;
  341. overflow:hidden;
  342. overflow-y:auto;
  343. padding:10px;
  344. margin-top:15px;
  345. font-size:15px;
  346. color:#bbb;
  347. line-height:20px;
  348. display:none;
  349. text-align:center;
  350. }
  351.  
  352. #faq b{
  353. color:#777;
  354. font-family:Kaushan Script;
  355. }
  356.  
  357. #faq:hover{
  358. -webkit-transition: all 0.4s ease;
  359. -moz-transition: all 0.4s ease
  360. -o-transition: all 0.4s ease;
  361. -ms-transition: all 0.4s ease;
  362. transition: all 0.4s ease;
  363. }
  364.  
  365. /* Third box */
  366.  
  367. #title3 {
  368. position:relative;
  369. font-family:'Kaushan Script';
  370. font-size:30px;
  371. text-align:center;
  372. line-height:50px;
  373. margin-top:15px;
  374. margin-left:0;
  375. color:#fff;
  376. width:400px;
  377. height:50px;
  378. padding:5px;
  379. background:#CCE2F0;
  380. }
  381.  
  382. #title3:hover{
  383. color:#777;
  384. -webkit-transition: all 0.7s ease-in-out;
  385. -moz-transition: all 0.7s ease-in-out;
  386. -o-transition: all 0.7s ease-in-out;
  387. }
  388.  
  389. #tags{
  390. position:relative;
  391. width:380px;
  392. font-family:Arimo;
  393. height:170px;
  394. overflow:hidden;
  395. overflow-y:auto;
  396. padding:10px;
  397. margin-top:10px;
  398. font-size:15px;
  399. color:#bbb;
  400. line-height:20px;
  401. display:none;
  402. text-align:left;
  403. }
  404.  
  405. #grouptitle {
  406. position:absolute;
  407. padding:4px;
  408. text-align:center;
  409. font-family:'Kaushan Script';
  410. color:#fff;
  411. font-size:15px;
  412. width:150px;
  413. height:30px;
  414. line-height:30px;
  415. margin-left:-90px;
  416. margin-top:-110px;
  417. background:#CCE2F0;
  418. }
  419.  
  420. #grouplinks {
  421. position:absolute;
  422. width:150px;
  423. padding:2px;
  424. margin-top:-70px;
  425. margin-left:-90px;
  426. border:2px solid #CCE2F0;
  427. background:#fff;
  428. }
  429.  
  430. #grouplinks a {
  431. font-family:'Arimo';
  432. display:block;
  433. color:#bbb;
  434. font-size:10px;
  435. padding:2px;
  436. text-align:center;
  437. letter-spacing:1px;
  438. text-transform:uppercase;
  439. margin-bottom:2px;
  440. -webkit-transition: all 0.4s ease-in-out;
  441. -moz-transition: all 0.4s ease-in-out;
  442. -o-transition: all 0.4s ease-in-out;
  443. -ms-transition: all 0.4s ease-in-out;
  444. transition: all 0.4s ease-in-out;
  445. }
  446.  
  447. #grouplinks a:hover {
  448. background:#CCE2F0;
  449. color:#fff;
  450. }
  451.  
  452. /* Fourth box */
  453.  
  454. #title4 {
  455. font-family:'Kaushan Script';
  456. font-size:30px;
  457. text-align:center;
  458. line-height:50px;
  459. margin-top:15px;
  460. margin-left:0;
  461. color:#fff;
  462. width:400px;
  463. height:50px;
  464. padding:5px;
  465. background:#D9CAF1;
  466. }
  467.  
  468. #title4:hover{
  469. color:#777;
  470. -webkit-transition: all 0.7s ease-in-out;
  471. -moz-transition: all 0.7s ease-in-out;
  472. -o-transition: all 0.7s ease-in-out;
  473. }
  474.  
  475. #blogroll{
  476. position:relative;
  477. width:380px;
  478. max-height:150px;
  479. overflow:hidden;
  480. overflow-y:auto;
  481. padding:10px;
  482. margin-top:5px;
  483. color:#D9CAF1;
  484. display:none;
  485. text-align:left;
  486. }
  487.  
  488. #blogroll img {
  489. width:35px;
  490. height:35px;
  491. margin:4px;
  492. border:2px #bbb ridge;
  493. border-radius:0px;
  494. padding:2px;
  495. decoration:none;
  496. opacity:0.7;
  497. }
  498.  
  499. /* Tooltips */
  500.  
  501. #s-m-t-tooltip {
  502. max-width:300px;
  503. z-index:10000;
  504. margin:24px 14px 7px 12px;
  505. padding:8px;
  506. color:#fff;
  507. background:#bbb;
  508. font-size:12px;
  509. line-height:16px;
  510. }
  511.  
  512. /* Credits */
  513.  
  514. #credits {
  515. position:fixed;
  516. right:10px;
  517. top:100px;
  518. z-index:100000;
  519. }
  520.  
  521. #credits img{
  522. border:2px solid #bbb;
  523. }
  524.  
  525. {CustomCSS}
  526.  
  527. </style></head>
  528.  
  529. <body>
  530.  
  531. <div id="everything">
  532.  
  533. <div id="header">
  534.  
  535. <div id="links">
  536. <a href="/">HOME</a>
  537. <a href="/ask">ASK</a>
  538. <a href="/submit">SUBMIT</a>
  539. <a href="http://tumblr.com">DASH</a>
  540. </div>
  541.  
  542. </div>
  543.  
  544. <div id="container">
  545.  
  546. <center>
  547.  
  548. <div id="container2">
  549.  
  550. <div id="title1">
  551.  
  552. <div id="title1img"> <!-- CHANGE ABOUT IMAGE -->
  553. <img src="http://24.media.tumblr.com/tumblr_mbbm0oaVar1rdkoleo1_500.jpg">
  554. </div>
  555.  
  556. <span style="position: absolute;display:inline-block;width:0;height:0;line-height:0;border:31.52173913043478px solid transparent;margin-left:34px;border-right:31.52173913043478px solid #FBECE2;left:0px;top:-1px"></i></span></span><b>About</b></div><br>
  557.  
  558. <div id="about">
  559. <!-- CHANGE DESCRIPTION -->
  560. Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
  561. <!-- CHANGE DESCRIPTION -->
  562. </div>
  563.  
  564.  
  565. <div id="title2"><b>F.A.Q.</b></div>
  566.  
  567. <div id="faq">
  568.  
  569. <!-- CHANGE FAQ -->
  570. <b>THIS IS A QUESTION</b><br>
  571.  
  572. This is an answer<br><br>
  573.  
  574.  
  575. <b>THIS IS A QUESTION</b><br>
  576.  
  577. This is an answer<br><br>
  578.  
  579.  
  580. <b>THIS IS A QUESTION</b><br>
  581.  
  582. This is an answer<br><br>
  583.  
  584.  
  585. <b>THIS IS A QUESTION</b><br>
  586.  
  587. This is an answer<br><br>
  588.  
  589.  
  590. <b>THIS IS A QUESTION</b><br>
  591.  
  592. This is an answer<br>
  593. <!-- CHANGE FAQ -->
  594.  
  595. <br><br></div>
  596.  
  597. <div id="title3"><b>Tags</b></div>
  598.  
  599. <div id="tags">
  600. <table id="all" border="0" cellpadding="100" cellspacing="0">
  601.  
  602. <td><div id="grouptitle"><big>Group</div>
  603. <div id="grouplinks">
  604.  
  605. <a href="/">Link</a>
  606.  
  607. <a href="/">Link</a>
  608.  
  609. <a href="/">Link</a>
  610.  
  611. <a href="/">Link</a>
  612.  
  613. <a href="/">Link</a>
  614.  
  615. </div></td>
  616.  
  617. <td><div id="grouptitle"><big>Group</div>
  618. <div id="grouplinks">
  619.  
  620. <a href="/">Link</a>
  621.  
  622. <a href="/">Link</a>
  623.  
  624. <a href="/">Link</a>
  625.  
  626. <a href="/">Link</a>
  627.  
  628. <a href="/">Link</a>
  629.  
  630. </div></td><tr>
  631.  
  632. <td><div id="grouptitle"><big>Group</div>
  633. <div id="grouplinks">
  634.  
  635. <a href="/">Link</a>
  636.  
  637. <a href="/">Link</a>
  638.  
  639. <a href="/">Link</a>
  640.  
  641. <a href="/">Link</a>
  642.  
  643. <a href="/">Link</a>
  644.  
  645. </div></td>
  646.  
  647. <td><div id="grouptitle"><big>Group</div>
  648. <div id="grouplinks">
  649.  
  650. <a href="/">Link</a>
  651.  
  652. <a href="/">Link</a>
  653.  
  654. <a href="/">Link</a>
  655.  
  656. <a href="/">Link</a>
  657.  
  658. <a href="/">Link</a>
  659.  
  660. </div></td>
  661.  
  662. <!-- To add more tag boxes just copy/paste:
  663.  
  664. <tr>
  665.  
  666. <td><div id="grouptitle"><big>Group</div>
  667. <div id="grouplinks">
  668.  
  669. <a href="/">Link</a>
  670.  
  671. <a href="/">Link</a>
  672.  
  673. <a href="/">Link</a>
  674.  
  675. <a href="/">Link</a>
  676.  
  677. <a href="/">Link</a>
  678.  
  679. </div></td>
  680.  
  681. <td><div id="grouptitle"><big>Group</div>
  682. <div id="grouplinks">
  683.  
  684. <a href="/">Link</a>
  685.  
  686. <a href="/">Link</a>
  687.  
  688. <a href="/">Link</a>
  689.  
  690. <a href="/">Link</a>
  691.  
  692. <a href="/">Link</a>
  693.  
  694. </div></td>
  695.  
  696. -->
  697.  
  698. </table>
  699. </div>
  700.  
  701. <div id="title4"><b>Blogroll</b></div>
  702.  
  703. <div id="blogroll"
  704. {block:Following}{block:Followed}<a title='{FollowedName}' target='_blank' href='{FollowedURL}'><img border='0' src='{FollowedPortraitURL-96}' />{/block:Followed}{/block:Following}</div>
  705. </div>
  706.  
  707. </body>
  708.  
  709. <a href="http://borntobewildthemes.tumblr.com"><div id="credits">
  710. <img src="http://i57.tinypic.com/301g6eg.jpg"></div></a>
  711.  
  712. </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!