API tools faq
paste
Advertisement
destinatia

PAGE 001: ✧ * º • ☾ MUSE PAGE. ❜ — destinatiia

destinatia
Apr 19th, 2016
4,319
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 25.92 KB | None | 0 0
raw download clone embed print report
  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4.  
  5. <!--
  6.  
  7. ✧ * ☾ destinatiia.tumblr.com * ✧
  8.  
  9. - you're allowed edit as much as you want, but don't repost and claim as your own afterwards.
  10. - don't move the credit or put it in another page
  11. - don't take fragments from this code and paste it on your own.
  12. - base code made by neonbikethemes as always,,,, absolutely blessed for their existence thank u
  13. -the icons in the preview were NOT made by me so credit to their rightful owners
  14. -enjoy !! and if you have any questions and/or problems just hmu
  15.  
  16. -->
  17.  
  18. <title>your title</title>
  19.  
  20. <script language="javascript" type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.5/jquery.min.js"></script>
  21.  
  22. <script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.0/jquery.min.js"></script>
  23.  
  24. <script src="http://static.tumblr.com/wgijwsy/Ebfm2v4gy/jquery.masonry.min.js"></script>
  25.  
  26. <link href='https://fonts.googleapis.com/css?family=Montserrat' rel='stylesheet' type='text/css'>
  27.  
  28. <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.5.0/css/font-awesome.min.css">
  29.  
  30.  
  31. <!-- TOOLTIP SCRIPT (REMOVE ONYL IF YOU WANT STANDARD BROWSER TOOLTIPS) -->
  32.  
  33. <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js"></script>
  34. <script src="http://static.tumblr.com/iuw14ew/VSQma1786/jquery.style-my-tooltips.js"></script>
  35. <script>
  36. (function($){
  37. $(document).ready(function(){
  38. $("a[title]").style_my_tooltips({
  39. tip_follows_cursor:true,
  40. tip_delay_time:90,
  41. tip_fade_speed:600,
  42. attribute:"title"
  43. });
  44. });
  45. })(jQuery);
  46. </script>
  47.  
  48.  
  49. <style type="text/css">
  50.  
  51. /* ---------------------------- GENERAL ----------------------------- */
  52.  
  53. /* -------- SELECTION TOOL ------- */
  54.  
  55. ::-moz-selection {
  56. background: {color:text};
  57. color: {color:background};
  58. }
  59.  
  60. ::selection {
  61. background: {color:text};
  62. color: {color:background};
  63. }
  64.  
  65. /* -------- SCROLLBAR ------- */
  66.  
  67. ::-webkit-scrollbar {
  68. width: 9px;
  69. }
  70.  
  71. /* Track */
  72. ::-webkit-scrollbar-track {
  73. background:{color:background};
  74. }
  75.  
  76. /* Handle */
  77. ::-webkit-scrollbar-thumb {
  78. background:{color:text};
  79. }
  80. ::-webkit-scrollbar-thumb:window-inactive {
  81. background: transparent;
  82. }
  83.  
  84. /* ------- TOOLTIPS ------ */
  85.  
  86. #s-m-t-tooltip {
  87. max-width:300px;
  88. margin:10px 0px 0px 10px;
  89. background-color:{color:bakground};
  90. font-family:helvetica;
  91. font-size:12px;
  92. color:{color:text};
  93. z-index:999999999999999999999999999999999999;
  94. }
  95.  
  96. /* -------- BASICS ------- */
  97.  
  98. body {
  99. background: #ccc; /*-- you can change the background color here !! and if you're planning on using a background image, use the following: background:url('bg url'); --*/
  100. color: #aaa; /*-- text color --*/
  101. font-family: helvetica, arial;
  102. letter-spacing:0.5px;
  103. text-shadow: 2px 2px 2px #eee;
  104. font-size: 10px;
  105. font-family:calibri;
  106. margin: 0;
  107. padding: 0;
  108. overflow-y:hidden;
  109. overflow-x:auto;
  110. word-wrap: break-word;
  111. line-height:150%;
  112. }
  113.  
  114. h1 {
  115. font-family:'montserrat', sans serif;
  116. font-size:24px;
  117. padding-bottom:15px;
  118. border-bottom:1px solid #8ecbc4;
  119. color: #8ecbc4; /*-- change the color of the h1 text here --*/
  120. }
  121.  
  122.  
  123. h2 {
  124. font-family:'montserrat', sans serif;
  125. font-size:15px;
  126. font-style:italic;
  127. color: #ddbfa8; /*-- change the color of the h2 text here --*/
  128. }
  129.  
  130.  
  131. a {
  132. color: #ddbfa8; /*-- change the color of the links here --*/
  133. text-decoration: none;
  134. -webkit-transition: all .7s;
  135. -moz-transition: all .7s;
  136. -o-transition: all .7s;
  137. -ms-transition: all .7s;
  138. transition: all .7s;
  139. }
  140.  
  141. sup, sub, small {
  142. color: #ddbfa8; /*-- change the color of the sub n smol text yeh --*/
  143. font-family:'montserrat', sans serif;
  144. }
  145.  
  146. b, strong {
  147. color: #8ecbc4; /*-- change the color of the bold text --*/
  148. font-family:'montserrat', sans serif;
  149. }
  150.  
  151. i, em {
  152. color: #8ecbc4; /*-- change the color of the italic text here --*/
  153. font-family:'montserrat', sans serif;
  154. }
  155.  
  156. a:hover{
  157. color:#f5f5f5; /*-- change the color of the links hover text here --*/
  158. -webkit-transition: all .7s;
  159. -moz-transition: all .7s;
  160. -o-transition: all .7s;
  161. -ms-transition: all .7s;
  162. transition: all .7s;
  163. }
  164.  
  165. #bigcon{
  166. width:520px;
  167. margin-left:auto;
  168. margin-right:auto;
  169. }
  170.  
  171. .tabcontent {
  172. position:static;
  173. margin-left:auto;
  174. margin-right:auto;
  175. width: 500px;
  176. margin-top:-50px;
  177. height:500px;
  178. padding:10px;
  179. background:#f5f5f5; /*-- this is the tab content bg color,, make sure it's the same as the container div --*/
  180. overflow:auto;
  181. text-align:center;
  182. margin-bottom:150px;
  183. }
  184.  
  185. #container {
  186. position:static;
  187. margin-left:auto;
  188. margin-right:auto;
  189. width: 500px;
  190. margin-top:-50px;
  191. height:500px;
  192. padding:10px;
  193. background:#f5f5f5; /*-- this is the this is the container bg color,, make sure it's the same as the tabcontent div --*/
  194. overflow:auto;
  195. text-align:center;
  196. margin-bottom:150px;
  197. }
  198.  
  199. #box {
  200. background:#f5f5f5; /*-- just make sure it's the same color as both the tabcontent and container so it looks neat --*/
  201. width: 520px;
  202. margin-top:-50px;
  203. height:520px;
  204. position:fixed;
  205. margin-left:0px;
  206. z-index:-99;
  207. box-shadow: 3px 3px 5px #ccc;
  208. }
  209.  
  210. #topbar{
  211. position:static;
  212. margin-top:60px;
  213. margin-bottom:50px;
  214. text-align:center;
  215. }
  216.  
  217. .blogtitle{
  218. margin-bottom:20px;
  219. text-transform:uppercase;
  220. font-size:24px;
  221. position:fixed;
  222. z-index:-9999;
  223. width:500px;
  224. margin-top:-40px;
  225. background-color:#fff; /*-- this is the muse page section and has the same color as the navbar div so yeah u got it luv --*/
  226. height:200px;
  227. padding-left:10px;
  228. padding-right:10px;
  229. padding-bottom:10px;
  230. padding-top:18px;
  231. letter-spacing:2px;
  232. font-weight:bold;
  233. }
  234.  
  235. #navbar{
  236. display:inline-block;
  237. background-color:#fff;
  238. text-align:center;
  239. }
  240.  
  241. #yo {
  242. color: #fff;
  243. font-size:7.5px;
  244. float:right;
  245. right:0;
  246. text-shadow:none;
  247. bottom:0;
  248. margin-right:10px;
  249. margin-bottom:10px;
  250. padding:10px;
  251. position:fixed;
  252. font-weight:bold;
  253. text-align:center;
  254.  
  255. }
  256.  
  257.  
  258. /* ------------------------------ TABS ------------------------------ */
  259.  
  260. .tabs {
  261. width:100%;
  262. margin-left:0px;
  263. display:inline-block;
  264. }
  265.  
  266. /*----- Tab Links -----*/
  267.  
  268. /* Clearfix */
  269. .tab-links:after {
  270. display:block;
  271. clear:both;
  272. content:'';
  273. }
  274.  
  275. .tab-links li {
  276. margin-right:5px;
  277. display:inline-block;
  278. list-style:none;
  279. text-transform:uppercase;
  280. }
  281.  
  282. .tab-links a {
  283. padding:7px;
  284. display:inline-block;
  285. width:1px;
  286. box-shadow: 3px 3px 5px #999;
  287. background:#ddd; /*-- this is the lil circle's bg color --*/
  288. height:1px;
  289. border-radius:15px;
  290. border: 3px solid #ddd; /*-- this is the lil circle's border color when it's active --*/
  291. transition:all linear 0.15s;
  292. }
  293.  
  294. .tab-links a:hover { /*-- if u want it to look the same as the preview just copy the settings you put before--*/
  295. text-decoration:none;
  296. width:-1px;
  297. height:-1px;
  298. border-radius:15px;
  299. background-color:#ddd;
  300. border: 3px solid #ddd;
  301. }
  302.  
  303. li.active a, li.active a:hover {
  304. background-color:transparent;
  305. border-radius:15px;
  306. -webkit-transition: all .7s;
  307. -moz-transition: all .7s;
  308. -o-transition: all .7s;
  309. -ms-transition: all .7s;
  310. transition: all .7s;
  311. }
  312.  
  313. /*----- Content of Tabs -----*/
  314. .tab-content {
  315. }
  316.  
  317. .tab {
  318. display:none;
  319. }
  320.  
  321. .tab.active {
  322. display:block;
  323. }
  324.  
  325. /* ----- muse css ----- */
  326.  
  327. .icons {
  328. width:auto;
  329. z-index:999999999;
  330. height:200px;
  331. font-family:'montserrat', sans serif;
  332. font-size:24px;
  333. line-height:40px;
  334. float:left;
  335. text-align:center;
  336. color: #8ecbc4; /* -- you can change the name color here ! --*/
  337. padding:10px;
  338. margin-left:8px;
  339. }
  340.  
  341. .header {
  342. background-color:#fff;
  343. width:480px;
  344. height:180px;
  345. padding:10px;
  346. box-shadow: 3px 3px 5px #ccc;
  347. margin-top:0px;
  348. margin-left:0px;
  349. }
  350.  
  351. .mdesc {
  352. width:200px;
  353. z-index:9999999999;
  354. height:140px;
  355. overflow:auto;
  356. float:right;
  357. padding:10px;
  358. font-size:11px;
  359. text-align:justify;
  360. margin-left:73px;
  361. margin-top:-215px;
  362. }
  363.  
  364. .label {
  365. position:fixed;
  366. background-color:#fff;
  367. width:197px;
  368. padding:20px;
  369. box-shadow: 3px 3px 5px #ccc;
  370. text-align:center;
  371. font-weight:bold;
  372. z-index:99999;
  373. color:#8ecbc4; /*-- change the label text color here ! --*/
  374. font-family:'montserrat', sans serif;
  375. font-size:14px;
  376. height:auto;
  377. margin-top:20px;
  378. position:fixed;
  379. }
  380.  
  381. .stats {
  382. position:fixed;
  383. background:#fff;
  384. text-align:justify;
  385. overflow:auto;
  386. height:96px;
  387. padding:15px;
  388. font-size:10px;
  389. width:207px;
  390. box-shadow: 3px 3px 5px #ccc;
  391. margin-top:85px;
  392. }
  393.  
  394. .bio {
  395. width:213px;
  396. z-index:99;
  397. height:150px;
  398. position:fixed;
  399. overflow:auto;
  400. padding:20px;
  401. font-size:11px;
  402. text-align:justify;
  403. margin-top:20px;
  404. background-color:#fff;
  405. margin-left:248px;
  406. box-shadow: 3px 3px 5px #ccc;
  407. }
  408.  
  409. .iconlinks {
  410. margin-top:236px;
  411. text-shadow: 3px 3px #fff;
  412. }
  413.  
  414.  
  415.  
  416. /* --------------------------- Custom CSS -------------------------- */
  417. </style>
  418. </head>
  419. <body>
  420.  
  421.  
  422. <div id="bigcon">
  423.  
  424.  
  425. <!--TOPBAR-->
  426.  
  427. <div id="topbar">
  428.  
  429. <div class="blogtitle">
  430. <a href="/"style="font-family:'montserrat', sans serif;">✰ * º ❛ MUSE PAGE. ❜</a>
  431. </div>
  432.  
  433. <div id="navbar">
  434. <div class="tabs">
  435. <ul class="tab-links">
  436. <li class="active" style="margin-left:-30px">
  437. <a href="#tab1"></a></li>
  438. <li><a href="#tab2"></a></li>
  439. <li><a href="#tab3"></a></li>
  440. <li><a href="#tab4"></a></li>
  441. <li><a href="#tab5"></a></li>
  442. </ul>
  443. </div>
  444. </div>
  445.  
  446. </div>
  447.  
  448.  
  449. <!-- --------------------------- TABS -------------------------- -->
  450. <div id="box"></div>
  451.  
  452. <div class="tabs">
  453.  
  454. <!-- --------------------------- TAB 1 -------------------------- -->
  455.  
  456. <div class="tab-content">
  457. <div id="tab1" class="tab active">
  458. <div id="container">
  459.  
  460.  
  461.  
  462.  
  463. <div class="header">
  464. <div class="icons">
  465.  
  466. first middle last
  467.  
  468. <br><img src="http://40.media.tumblr.com/334fc8b35783c5e6b742ad83b60125de/tumblr_inline_o2h9htsCNa1skwjzs_100.jpg" style="border-radius:50px;box-shadow: 3px 3px #999;" />&nbsp;
  469. <img src="http://41.media.tumblr.com/e4699e8620d4e3bfabb9d34a62d1fd8e/tumblr_inline_o2h9hoaDxJ1skwjzs_100.jpg" style="border-radius:50px;box-shadow: 3px 3px #999;" />
  470.  
  471. </div>
  472.  
  473. <div class="mdesc"> <!-- you can put wtv you want here tbh,, i'd suggest you to not exceed the text, however, it overflows automatically so its ok though -->
  474. i can <b>HARDLY</b> remember, just the <s>smell</s> of your hands
  475. as they <i>danced</i> on my body, <sup>running</sup> over my pores
  476. with the <b>+</b> force <b>+</b> of steering wheel <b>crushing</b> my bones,
  477. i said you <u>smell</u> like the devil but you <sub>feel</sub> like the lord
  478. and when i think of <b>✰</b> <i>perfection </i><b>✰</b> you know i’m thinking of your
  479. <b><sup>voice</sup></b>
  480. </div></div>
  481.  
  482.  
  483. <div style="margin-top:-10px;">
  484. <div class="label">THE HALCYON</div>
  485. <div class="stats">
  486. <h1>stats</h1>
  487. you can put your stats here or wtv you want obviously,,, and i just got in mind that maybe you could....... yk even place the verses here <b><i>!!</i></b> cool, innit <b>??</b><br>
  488. <br><br>
  489.  
  490. </div>
  491.  
  492.  
  493. <div class="bio">
  494. <h1>biography</h1>
  495. you can put the biography here that'd b cute,, or maybe even more stats<b><i>¿¿</i></b> dunno<b><i>¿¿</i></b> <br><br>song lyrics wouldn't be a bad idea either <b><i>!!</i></b> and dnt worry about how long your text is,, there is always an overflow to back u up <b><i>!!</i></b>
  496. </p>
  497.  
  498. </div></div>
  499.  
  500. <div class="iconlinks">
  501. <a href="FIRSTLINK"><i class="fa fa-camera-retro fa-5x" aria-hidden="true"></i></a>
  502. &nbsp;&nbsp;&nbsp;&nbsp;
  503. <a href="SECONDLINK"><i class="fa fa-commenting fa-5x" aria-hidden="true"></i></a>
  504. &nbsp;&nbsp;&nbsp;&nbsp;
  505. <a href="THIRDLINK"><i class="fa fa-quote-left fa-5x" aria-hidden="true"></i></a>
  506. &nbsp;&nbsp;&nbsp;&nbsp;
  507. <a href="FOURTHLINK"><i class="fa fa-heartbeat fa-5x" aria-hidden="true"></i></a>
  508. &nbsp;&nbsp;&nbsp;&nbsp;
  509. <a href="FIFTHLINK"><i class="fa fa-diamond fa-5x" aria-hidden="true"></i></a>
  510.  
  511. </div>
  512.  
  513.  
  514. </div>
  515. </div>
  516.  
  517. <!-- -------------------------- TAB 2 -------------------------- -->
  518.  
  519. <div id="tab2" class="tab">
  520. <div class="tabcontent">
  521.  
  522.  
  523.  
  524.  
  525. <div class="header">
  526. <div class="icons">
  527.  
  528. first middle last
  529.  
  530. <!-- this is where your muse pic goes --><br><img src="http://41.media.tumblr.com/5488bf44be2d5ee12104ff1038c6e789/tumblr_inline_o2h9hxFNIT1skwjzs_100.jpg" style="border-radius:50px;box-shadow: 3px 3px #999;" />&nbsp;
  531. <img src="http://41.media.tumblr.com/25f7aec0ff40c700e6a4ef3c2141af69/tumblr_inline_o2h9hcOLWp1skwjzs_100.jpg" style="border-radius:50px;box-shadow: 3px 3px #999;" />
  532.  
  533. </div>
  534.  
  535. <div class="mdesc"> <!-- you can put wtv you want here tbh,, i'd suggest you to not exceed the text, however, it overflows automatically so its ok though -->
  536. i can <b>HARDLY</b> remember, just the <s>smell</s> of your hands as they <i>danced</i> on my body, <sup>running</sup> over my pores with the <b>+</b> force <b>+</b> of steering wheel <b>crushing</b> my bones, i said you <u>smell</u> like the devil but you <sub>feel</sub> like the lord and when i think of <b>✰</b> <i>perfection </i><b>✰</b> you know i’m thinking of your <b><sup>voice</sup></b>
  537. </div></div>
  538.  
  539.  
  540. <div style="margin-top:-10px;">
  541. <div class="label">THE HALCYON</div>
  542. <div class="stats">
  543. <h1>stats</h1>
  544. you can put your stats here or wtv you want obviously,,, and i just got in mind that maybe you could....... yk even place the verses here <b><i>!!</i></b> cool, innit <b>??</b><br>
  545. <br><br>
  546.  
  547. </div>
  548.  
  549.  
  550. <div class="bio">
  551. <h1>biography</h1>
  552. you can put the biography here that'd b cute,, or maybe even more stats<b><i>¿¿</i></b> dunno<b><i>¿¿</i></b> <br><br>song lyrics wouldn't be a bad idea either <b><i>!!</i></b> and dnt worry about how long your text is,, there is always an overflow to back u up <b><i>!!</i></b>
  553. <br><br> the following links
  554. </p>
  555.  
  556. </div></div>
  557.  
  558. <div class="iconlinks">
  559. <a href="FIRSTLINK"><i class="fa fa-camera-retro fa-5x" aria-hidden="true"></i></a>
  560. &nbsp;&nbsp;&nbsp;&nbsp;
  561. <a href="SECONDLINK"><i class="fa fa-commenting fa-5x" aria-hidden="true"></i></a>
  562. &nbsp;&nbsp;&nbsp;&nbsp;
  563. <a href="THIRDLINK"><i class="fa fa-quote-left fa-5x" aria-hidden="true"></i></a>
  564. &nbsp;&nbsp;&nbsp;&nbsp;
  565. <a href="FOURTHLINK"><i class="fa fa-heartbeat fa-5x" aria-hidden="true"></i></a>
  566. &nbsp;&nbsp;&nbsp;&nbsp;
  567. <a href="FIFTHLINK"><i class="fa fa-diamond fa-5x" aria-hidden="true"></i></a>
  568.  
  569. </div>
  570.  
  571. </div>
  572. </div>
  573.  
  574.  
  575. <!-- -------------------------- TAB 3 -------------------------- -->
  576.  
  577. <div id="tab3" class="tab">
  578. <div class="tabcontent">
  579.  
  580.  
  581.  
  582. <div class="header">
  583. <div class="icons">
  584.  
  585. first middle last
  586.  
  587. <!-- this is where your muse pic goes --><br><img src="http://41.media.tumblr.com/3f0a61858f231e4f19bdad6135c3c7df/tumblr_inline_o2h9hr2p001skwjzs_100.jpg" style="border-radius:50px;box-shadow: 3px 3px #999;" />&nbsp;
  588. <img src="http://40.media.tumblr.com/c561cc285d4d0a8798ca095fb3a9431f/tumblr_inline_o2h9h6JjK71skwjzs_100.jpg" style="border-radius:50px;box-shadow: 3px 3px #999;" />
  589.  
  590. </div>
  591.  
  592. <div class="mdesc"> <!-- you can put wtv you want here tbh,, i'd suggest you to not exceed the text, however, it overflows automatically so its ok though -->
  593. i can <b>HARDLY</b> remember, just the <s>smell</s> of your hands as they <i>danced</i> on my body, <sup>running</sup> over my pores with the <b>+</b> force <b>+</b> of steering wheel <b>crushing</b> my bones, i said you <u>smell</u> like the devil but you <sub>feel</sub> like the lord and when i think of <b>✰</b> <i>perfection </i><b>✰</b> you know i’m thinking of your <b><sup>voice</sup></b>
  594. </div></div>
  595.  
  596.  
  597. <div style="margin-top:-10px;">
  598. <div class="label">THE HALCYON</div>
  599. <div class="stats">
  600. <h1>stats</h1>
  601. you can put your stats here or wtv you want obviously,,, and i just got in mind that maybe you could....... yk even place the verses here <b><i>!!</i></b> cool, innit <b>??</b><br>
  602. <br><br>
  603.  
  604. </div>
  605.  
  606.  
  607. <div class="bio">
  608. <h1>biography</h1>
  609. you can put the biography here that'd b cute,, or maybe even more stats<b><i>¿¿</i></b> dunno<b><i>¿¿</i></b> <br><br>song lyrics wouldn't be a bad idea either <b><i>!!</i></b> and dnt worry about how long your text is,, there is always an overflow to back u up <b><i>!!</i></b>
  610. <br><br> the following links
  611. </p>
  612.  
  613. </div></div>
  614.  
  615. <div class="iconlinks">
  616. <a href="FIRSTLINK"><i class="fa fa-camera-retro fa-5x" aria-hidden="true"></i></a>
  617. &nbsp;&nbsp;&nbsp;&nbsp;
  618. <a href="SECONDLINK"><i class="fa fa-commenting fa-5x" aria-hidden="true"></i></a>
  619. &nbsp;&nbsp;&nbsp;&nbsp;
  620. <a href="THIRDLINK"><i class="fa fa-quote-left fa-5x" aria-hidden="true"></i></a>
  621. &nbsp;&nbsp;&nbsp;&nbsp;
  622. <a href="FOURTHLINK"><i class="fa fa-heartbeat fa-5x" aria-hidden="true"></i></a>
  623. &nbsp;&nbsp;&nbsp;&nbsp;
  624. <a href="FIFTHLINK"><i class="fa fa-diamond fa-5x" aria-hidden="true"></i></a>
  625.  
  626. </div>
  627.  
  628.  
  629. </div>
  630. </div>
  631.  
  632.  
  633. <!-- -------------------------- TAB 4 -------------------------- -->
  634.  
  635. <div id="tab4" class="tab">
  636. <div class="tabcontent">
  637.  
  638.  
  639.  
  640. <div class="header">
  641. <div class="icons">
  642.  
  643. first middle last
  644.  
  645. <!-- this is where your muse pic goes --><br><img src="http://40.media.tumblr.com/334fc8b35783c5e6b742ad83b60125de/tumblr_inline_o2h9htsCNa1skwjzs_100.jpg" style="border-radius:50px;box-shadow: 3px 3px #999;" />&nbsp;
  646. <img src="http://41.media.tumblr.com/e4699e8620d4e3bfabb9d34a62d1fd8e/tumblr_inline_o2h9hoaDxJ1skwjzs_100.jpg" style="border-radius:50px;box-shadow: 3px 3px #999;" />
  647.  
  648. </div>
  649.  
  650. <div class="mdesc"> <!-- you can put wtv you want here tbh,, i'd suggest you to not exceed the text, however, it overflows automatically so its ok though -->
  651. i can <b>HARDLY</b> remember, just the <s>smell</s> of your hands as they <i>danced</i> on my body, <sup>running</sup> over my pores with the <b>+</b> force <b>+</b> of steering wheel <b>crushing</b> my bones, i said you <u>smell</u> like the devil but you <sub>feel</sub> like the lord and when i think of <b>✰</b> <i>perfection </i><b>✰</b> you know i’m thinking of your <b><sup>voice</sup></b>
  652. </div></div>
  653.  
  654.  
  655. <div style="margin-top:-10px;">
  656. <div class="label">THE HALCYON</div>
  657. <div class="stats">
  658. <h1>stats</h1>
  659. you can put your stats here or wtv you want obviously,,, and i just got in mind that maybe you could....... yk even place the verses here <b><i>!!</i></b> cool, innit <b>??</b><br>
  660. <br><br>
  661.  
  662. </div>
  663.  
  664.  
  665. <div class="bio">
  666. <h1>biography</h1>
  667. you can put the biography here that'd b cute,, or maybe even more stats<b><i>¿¿</i></b> dunno<b><i>¿¿</i></b> <br><br>song lyrics wouldn't be a bad idea either <b><i>!!</i></b> and dnt worry about how long your text is,, there is always an overflow to back u up <b><i>!!</i></b>
  668. <br><br> the following links
  669. </p>
  670.  
  671. </div></div>
  672.  
  673. <div class="iconlinks">
  674. <a href="FIRSTLINK"><i class="fa fa-camera-retro fa-5x" aria-hidden="true"></i></a>
  675. &nbsp;&nbsp;&nbsp;&nbsp;
  676. <a href="SECONDLINK"><i class="fa fa-commenting fa-5x" aria-hidden="true"></i></a>
  677. &nbsp;&nbsp;&nbsp;&nbsp;
  678. <a href="THIRDLINK"><i class="fa fa-quote-left fa-5x" aria-hidden="true"></i></a>
  679. &nbsp;&nbsp;&nbsp;&nbsp;
  680. <a href="FOURTHLINK"><i class="fa fa-heartbeat fa-5x" aria-hidden="true"></i></a>
  681. &nbsp;&nbsp;&nbsp;&nbsp;
  682. <a href="FIFTHLINK"><i class="fa fa-diamond fa-5x" aria-hidden="true"></i></a>
  683.  
  684. </div>
  685.  
  686.  
  687. </div>
  688. </div>
  689.  
  690.  
  691. <!-- -------------------------- TAB 5 -------------------------- -->
  692.  
  693. <div id="tab5" class="tab">
  694. <div class="tabcontent">
  695.  
  696.  
  697.  
  698. <div class="header">
  699. <div class="icons">
  700.  
  701. first middle last
  702.  
  703. <!-- this is where your muse pic goes --><br><img src="http://40.media.tumblr.com/334fc8b35783c5e6b742ad83b60125de/tumblr_inline_o2h9htsCNa1skwjzs_100.jpg" style="border-radius:50px;box-shadow: 3px 3px #999;" />&nbsp;
  704. <img src="http://41.media.tumblr.com/e4699e8620d4e3bfabb9d34a62d1fd8e/tumblr_inline_o2h9hoaDxJ1skwjzs_100.jpg" style="border-radius:50px;box-shadow: 3px 3px #999;" />
  705.  
  706. </div>
  707.  
  708. <div class="mdesc"> <!-- you can put wtv you want here tbh,, i'd suggest you to not exceed the text, however, it overflows automatically so its ok though -->
  709. i can <b>HARDLY</b> remember, just the <s>smell</s> of your hands as they <i>danced</i> on my body, <sup>running</sup> over my pores with the <b>+</b> force <b>+</b> of steering wheel <b>crushing</b> my bones, i said you <u>smell</u> like the devil but you <sub>feel</sub> like the lord and when i think of <b>✰</b> <i>perfection </i><b>✰</b> you know i’m thinking of your <b><sup>voice</sup></b>
  710. </div></div>
  711.  
  712.  
  713. <div style="margin-top:-10px;">
  714. <div class="label">THE HALCYON</div>
  715. <div class="stats">
  716. <h1>stats</h1>
  717. you can put your stats here or wtv you want obviously,,, and i just got in mind that maybe you could....... yk even place the verses here <b><i>!!</i></b> cool, innit <b>??</b><br>
  718. <br><br>
  719.  
  720. </div>
  721.  
  722.  
  723. <div class="bio">
  724. <h1>biography</h1>
  725. you can put the biography here that'd b cute,, or maybe even more stats<b><i>¿¿</i></b> dunno<b><i>¿¿</i></b> <br><br>song lyrics wouldn't be a bad idea either <b><i>!!</i></b> and dnt worry about how long your text is,, there is always an overflow to back u up <b><i>!!</i></b>
  726. <br><br> the following links
  727. </p>
  728.  
  729. </div></div>
  730.  
  731. <div class="iconlinks">
  732. <a href="FIRSTLINK"><i class="fa fa-camera-retro fa-5x" aria-hidden="true"></i></a>
  733. &nbsp;&nbsp;&nbsp;&nbsp;
  734. <a href="SECONDLINK"><i class="fa fa-commenting fa-5x" aria-hidden="true"></i></a>
  735. &nbsp;&nbsp;&nbsp;&nbsp;
  736. <a href="THIRDLINK"><i class="fa fa-quote-left fa-5x" aria-hidden="true"></i></a>
  737. &nbsp;&nbsp;&nbsp;&nbsp;
  738. <a href="FOURTHLINK"><i class="fa fa-heartbeat fa-5x" aria-hidden="true"></i></a>
  739. &nbsp;&nbsp;&nbsp;&nbsp;
  740. <a href="FIFTHLINK"><i class="fa fa-diamond fa-5x" aria-hidden="true"></i></a>
  741.  
  742. </div>
  743.  
  744.  
  745.  
  746. </div>
  747. </div>
  748.  
  749.  
  750.  
  751.  
  752. <!-- END OF TABS -->
  753.  
  754. </div>
  755. </div>
  756. </div>
  757. </div>
  758. </div>
  759. <!-- TABS/ALL-INN-ONE SCRIPTS DO NOT REMOVE!!! -->
  760.  
  761. <script>
  762. $(document).ready(function() {
  763. $('.tabs .tab-links a').on('click', function(e) {
  764. var currentAttrValue = $(this).attr('href');
  765.  
  766. // Show/Hide Tabs
  767. $('.tabs ' + currentAttrValue).fadeIn(600).siblings().hide();
  768.  
  769. // Change/remove current tab to active
  770. $(this).parent('li').addClass('active').siblings().removeClass('active');
  771.  
  772. e.preventDefault();
  773. });
  774. });
  775. </script>
  776.  
  777. <script>
  778. $(document).ready(function() {
  779. $('#filterOptions li a').click(function() {
  780. // fetch the class of the clicked item
  781. var ourClass = $(this).attr('class');
  782.  
  783. // reset the active class on all the buttons
  784. $('#filterOptions li').removeClass('active');
  785. // update the active state on our clicked button
  786. $(this).parent().addClass('active');
  787.  
  788. if(ourClass == 'all') {
  789. // show all our items
  790. $('#ourHolder').children('div.item').show();
  791. }
  792. else {
  793. // hide all elements that don't share ourClass
  794. $('#ourHolder').children('div:not(.' + ourClass + ')').hide();
  795. // show all elements that do share ourClass
  796. $('#ourHolder').children('div.' + ourClass).show();
  797. }
  798. return false;
  799. });
  800. });
  801. </script>
  802.  
  803. <!--dont remove !!-->
  804. <div id="yo">
  805. <a href="http://destinatiia.tumblr.com/"target="_blank"> <i class="fa fa-paint-brush fa-4x"style="color:#fff;"></i> </a>
  806. </div>
  807.  
  808.  
  809. </body>
  810. </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!