API tools faq
paste
drunkblushed

malibu nights by drunkblushed

drunkblushed
Nov 1st, 2019 (edited)
3,276
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 28.33 KB | None | 0 0
raw download clone embed print report
  1. <!--
  2.  
  3. ♡ MALIBU NIGHTS BY DRUNKBLUSHED ♡
  4.  
  5. — do not combine with other themes.
  6. — do not take copy or take parts of this theme.
  7. — do not remove credits and redistribute as your own.
  8.  
  9.  
  10. -->
  11.  
  12. <html>
  13. <head>
  14.  
  15.  
  16.  
  17.  
  18. <meta name="color:background" content="#eeeeee"/>
  19. <meta name="color:posts" content="#f8f8f8"/>
  20. <meta name="color:container" content="#f3f3f3"/>
  21. <meta name="color:borders" content="#ededed"/>
  22. <meta name="color:accent" content="#B1B5C8"/>
  23. <meta name="color:bold" content="#9DA1B2"/>
  24. <meta name="color:italic" content="#ddd"/>
  25. <meta name="color:text" content="#707071"/>
  26. <meta name="color:sidebar" content="#DFE0FF"/>
  27. <meta name="color:sidebar text" content="#9DA1B2"/>
  28. <meta name="color:link" content="#B1B5C8"/>
  29. <meta name="color:permalink" content="#3c3c3c"/>
  30. <meta name="color:permalink bg" content="#DFE0FF"/>
  31.  
  32. <meta name="image:sidebar" content="https://via.placeholder.com/250x250"/>
  33. <meta name="image:graphic" content="https://via.placeholder.com/410x450"/>
  34. <meta name="image:tab header" content="https://via.placeholder.com/190x100"/>
  35. <meta name="image:tab icon" content="https://via.placeholder.com/50x50"/>
  36. <meta name="image:ig1" content="https://via.placeholder.com/50x50"/>
  37. <meta name="image:ig2" content="https://via.placeholder.com/50x50"/>
  38. <meta name="image:ig3" content="https://via.placeholder.com/50x50"/>
  39. <meta name="image:ig4" content="https://via.placeholder.com/50x50"/>
  40. <meta name="image:ig5" content="https://via.placeholder.com/50x50"/>
  41. <meta name="image:ig6" content="https://via.placeholder.com/50x50"/>
  42.  
  43. <meta name="if:hoverposts" content="0"/>
  44. <meta name="if:scrollposts" content="0"/>
  45.  
  46. <meta name="text:main title" content=""/>
  47. <meta name="text:tab subtitle" content="name" />
  48. <meta name="text:tab desc" content="YOU CAN PUT MORE TEXT HERE. POSSIBLY INFO ABOUT YOUR MUSE OR YOU CAN ALSO INCLUDE EVEN MORE SONG LYRICS? THIS OVERFLOWS BTW SO THAT'S SUPER FUN!" />
  49. <meta name="text:side desc" content"I got way too much time to be this hurt
  50. Somebody help, it's getting worse What do you do with a broken heart?
  51. Once the light fades, everything is dark" />
  52. <meta name="text:extra link title" content="" />
  53. <meta name="text:extra link url" content="" />
  54.  
  55.  
  56.  
  57.  
  58. <title>{title}</title>
  59.  
  60. <!------SCRIPTS------->
  61.  
  62. <link href="https://fonts.googleapis.com/css?family=Roboto:400,700,900&display=swap" rel="stylesheet">
  63.  
  64. <link href="//solrainha.github.io/honeybee/honeybee.css" rel="stylesheet">
  65.  
  66. <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js"></script>
  67.  
  68. <script type="text/javascript" src="https://static.tumblr.com/7qjmkr5/IUmmdsy41/jquery.style-my-tooltips.js"></script>
  69. <script>
  70. (function($){
  71. $(document).ready(function(){
  72. $("[title]").style_my_tooltips();
  73. });
  74. })(jQuery);
  75. </script>
  76.  
  77. <script src="//ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
  78. <script src ="//static.tumblr.com/fwgzvyf/Oj1o08f6h/shythemes.vr.js"></script>
  79.  
  80. <style type="text/css">
  81.  
  82. /*----------------- FONTS -----------------*/
  83. @font-face { font-family:"tokyoreg"; src: url('https://dl.dropbox.com/s/jgq18n62iha87v6/Tokyo-Regular.ttf'); }
  84. @font-face { font-family: "primetime"; src: url('https://dl.dropboxusercontent.com/s/uzoszwd2yfzqmmx/PRIMETIME.ttf');}
  85. @font-face { font-family: "collection"; src: url('https://dl.dropboxusercontent.com/s/tqf0kl9l003lk76/CollectionFree.otf') ;}
  86. @font-face { font-family: "tbv"; src: url('https://dl.dropboxusercontent.com/s/y5etshmjzbq2r3p/Taken%20by%20Vultures%20Alternates%20Demo.otf') ;}
  87. @font-face { font-family: "tbv2"; src: url('https://dl.dropboxusercontent.com/s/sh5eu2dtonzzcug/Taken%20by%20Vultures%20Demo.otf') ;}
  88.  
  89.  
  90. /*----------------- TEXT STYLES -----------------*/
  91.  
  92. body{
  93. background-color: {color:background};
  94. font-family: 'roboto', sans-serif;
  95. color:{color:text};
  96. letter-spacing:1px;
  97. line-height:110%px;
  98. }
  99.  
  100. a:link, a:active, a:visited{
  101. color: {color:Link};
  102. text-decoration:none;
  103. -webkit-transition: all 0.2s linear;
  104. -moz-transition: all 0.2s linear;
  105. transition: all 0.2s linear;
  106. }
  107.  
  108. a:hover {
  109. color:{color:Link Hover};
  110. -webkit-transition: all 0.2s linear;
  111. -moz-transition: all 0.2s linear;
  112. transition: all 0.2s linear;
  113. }
  114.  
  115. b,bold,strong{
  116. color:{color:bold};
  117. text-transform:uppercase;
  118. }
  119.  
  120. em,i,italic{
  121. color:{color:italic};
  122. }
  123.  
  124. big{font-size:15px;font-family: 'roboto', sans-serif;}
  125.  
  126. small,sup, sub{
  127. font-size:9px;
  128. }
  129.  
  130. h1{font-family: "primetime";
  131. letter-spacing:1px;
  132. padding:5px;
  133. text-align:center;
  134. font-size: 20px;
  135. text-transform:uppercase;
  136. line-height: 120%;
  137. color:{color:accent};}
  138.  
  139. h2{font-family: "primetime";
  140. letter-spacing:1px;
  141. padding:5px;
  142. text-align:right;
  143. font-size: 20px;
  144. text-transform:uppercase;
  145. line-height: 120%;
  146. color:{color:link};}
  147.  
  148. .posttitle{
  149. font-family: "primetime";
  150. letter-spacing:1px;
  151. padding:5px;
  152. text-align:center;
  153. font-size: 24px;
  154. text-transform:uppercase;
  155. line-height: 120%;
  156. -webkit-text-stroke: 1.5px {color:accent};
  157. -webkit-text-fill-color: rgba(0, 0, 0, 0);
  158. }
  159.  
  160. blockquote{
  161. margin-left:0px;
  162. padding-left:15px;
  163. border-left: 1px solid {color:borders};
  164. width:95%;
  165. }
  166.  
  167.  
  168. .p { padding-top: 5px;}
  169. .ol, ul { margin-left: 30px; padding: 5px; }
  170. .ul { list-style-type: square; }
  171.  
  172. ::-webkit-scrollbar-thumb {
  173. display: none;
  174. }
  175.  
  176. ::-webkit-scrollbar {
  177. display: none;
  178. }
  179.  
  180. #s-m-t-tooltip {
  181. z-index: 999999999999999999;
  182. background: #fff;
  183. font-size: 8px;
  184. line-height: 13px;
  185. letter-spacing: 1.5px;
  186. text-transform: uppercase;
  187. color: {color:text};
  188. font-weight:900;
  189. background-color:{color:posts};
  190. border:1px solid {color:borders};
  191. max-width: 150px;
  192. word-wrap: break-word;
  193. padding: 2px 5px 2px 6px;
  194. display: block;
  195. margin: 24px 14px 7px 12px;
  196. -webkit-transition:.3s;
  197. -moz-transition:.3s;
  198. }
  199.  
  200. /*----------------- CONTAINERS & POSTS -----------------*/
  201.  
  202. #bigcont{
  203. margin: auto;
  204. left:0px;
  205. top:0px;
  206. bottom:0px;
  207. right:0px;
  208. }
  209.  
  210. #entries{
  211. padding:30px;
  212. z-index:99;
  213. margin: auto;
  214. left:0px;
  215. top:0px;
  216. bottom:0px;
  217. right:0px;
  218. width:760px;
  219. position:absolute;
  220. height:390px;
  221. overflow-y:scroll;
  222. background-color:{color:container};
  223. overflow-x:hidden;
  224. border:1px solid {color:borders};
  225. }
  226.  
  227. {block:IfHoverPosts}
  228. #entries:hover #post{
  229. opacity:1;
  230. -webkit-transition: all 0.4s linear;
  231. -moz-transition: all 0.4s linear;
  232. transition: all 0.4s linear;
  233. }
  234.  
  235. #entries:hover .centerimage{
  236. opacity:0;
  237. -webkit-transition: all 0.4s linear;
  238. -moz-transition: all 0.4s linear;
  239. transition: all 0.4s linear;
  240. }
  241.  
  242. #entries:hover .notes{
  243. opacity:1;
  244. -webkit-transition: all 0.4s linear;
  245. -moz-transition: all 0.4s linear;
  246. transition: all 0.4s linear;
  247. }
  248. {/block:IfHoverPosts}
  249.  
  250. #post {
  251. font-size:9.5px;
  252. background-color:{color:posts};
  253. padding:25px;
  254. width:300px;z-index:99;
  255. margin-top:00px;
  256. margin-bottom:40px;
  257. margin-left:0px;
  258. line-height:160%;
  259. letter-spacing:1px;
  260. {block:IfHoverPosts}
  261. opacity:0;
  262. -webkit-transition: all 0.4s linear;
  263. -moz-transition: all 0.4s linear;
  264. transition: all 0.4s linear;
  265. {/block:IfHoverPosts}
  266. border:1px solid {color:borders};
  267. }
  268.  
  269. #post .tags {position:relative;
  270. text-align:left;
  271. color:{color:link};
  272. padding:8px;
  273. font-size:6.5px;
  274. letter-spacing:2px;
  275. font-family: 'roboto', sans-serif;
  276. text-transform:uppercase;
  277. -webkit-transition: all 0.2s linear;
  278. -moz-transition: all 0.2s linear;
  279. transition: all 0.2s linear;
  280. margin-bottom:-20px;
  281. margin-top:5px;
  282. margin-left:-8px;
  283. }
  284.  
  285. #post .tags a{
  286. color:{color:link};
  287. }
  288.  
  289. #post img{
  290. max-width:300px;
  291. height:auto;
  292. }
  293.  
  294.  
  295.  
  296. #post:hover .tags {position:relative;
  297. text-align:left;opacity:1;
  298. color:{color:link};
  299. padding:8px; width:auto;
  300. text-transform:uppercase;-webkit-transition: all 0.2s linear;
  301. -moz-transition: all 0.2s linear;
  302. transition: all 0.2s linear;}
  303. .tags a {color:{color:text};text-transform:uppercase;}
  304.  
  305. .tags a:hover {color:{color:link hover};text-transform:uppercase;}
  306.  
  307.  
  308. .info{
  309. background:{color:permalink bg};
  310. position:relative;
  311. padding:12px;
  312. margin-top:20px;
  313. margin-bottom:0px;
  314. text-transform:uppercase;
  315. letter-spacing:2px;
  316. color:{color:permalink};
  317. font-size:8.5px;
  318. line-height:100%;
  319. }
  320.  
  321. .info span{
  322. text-align:left;
  323. padding-left:-20px;
  324. text-transform:uppercase;
  325. margin-top:2px;
  326. padding-right:5px;
  327. }
  328.  
  329. .info rb{
  330. right:0%;
  331. position:absolute;
  332. padding-right:0px;
  333. margin-top:-1px;
  334. }
  335.  
  336. .info b{
  337. font-weight:900;
  338. color:{color:permalink};
  339. }
  340.  
  341. .info a{
  342. margin-left:0px;
  343. font-size:8.5px;
  344. color: {color:permalink};
  345. }
  346.  
  347.  
  348. /*----------------- CUSTOMIZATIONS -----------------*/
  349.  
  350. #maintitle{
  351. font-family:"primetime";
  352. font-size:40px;
  353. position:fixed;
  354. margin-top:5px;
  355. margin-left:410px;
  356. -webkit-text-stroke: 1px {color:bold};
  357. -webkit-text-fill-color: rgba(0, 0, 0, 0);
  358. max-width:200px;
  359. text-align:left;
  360. word-spacing:-3px;
  361. z-index:999999999;
  362. line-height:90%;
  363. }
  364.  
  365. #maintitle span{
  366. -webkit-text-fill-color: {color:bold};
  367. font-family:"collection";
  368. letter-spacing:1px;
  369. font-size:80px;
  370. text-transform:lowercase;
  371. }
  372.  
  373. #sidedesc{
  374. font-family:"roboto";
  375. font-size:8px;
  376. position:fixed;
  377. margin-top:295px;
  378. margin-left:600px;
  379. color:{color:sidebar text};
  380. text-align:justify;
  381. word-spacing:0px;
  382. font-weight:400;
  383. width:160px;
  384. z-index:99999999;
  385. line-height:200%;
  386. letter-spacing:1.5px;
  387. text-transform:uppercase;
  388. font-style:italic;
  389. height:110px;
  390. overflow:hidden;
  391. }
  392.  
  393. .sideimage {position:fixed;z-index:99; width:250px; height:250px;margin-left:0px; margin-top:100px; margin-left:80px; opacity:1;}
  394.  
  395. .sideimage img {width:250px; height:250px; position:fixed; border-radius:100%;}
  396.  
  397. .centerimage {background:{color:accent}; margin-left:-30px; height:400px; margin-top:-30px; width:410px; height:450px; margin-bottom:50px; {block:IfHoverPosts} position:fixed; z-index:-999;{/block:IfHoverPosts} {block:IfScrollPosts}z-index:999; {/block:IfScrollPosts} -webkit-transition: all 0.4s linear;
  398. -moz-transition: all 0.4s linear;
  399. transition: all 0.4s linear;}
  400.  
  401. .centerimage img { width:410px; height:450px;}
  402.  
  403. #sidebar {background:{color:sidebar}; width:410px; height:450px; position: fixed; margin-top:-30px; margin-left:380px; overflow:hidden;}
  404.  
  405.  
  406. /*----------------- NAVIGATION & PAGINATION -----------------*/
  407.  
  408. #tabzbg{
  409. width:150px;
  410. height:150px;
  411. border-radius:50%;
  412. background-color:{color:sidebar text};
  413. margin-left:305px;
  414. margin-top:-85px;
  415. position:absolute;
  416. z-index:999999;
  417. }
  418.  
  419. .tabz{
  420. width:50px;
  421. height:10px;
  422. font-size:13px;
  423. z-index:99999999999999999;
  424. position:fixed;
  425. text-transform:uppercase;
  426. margin-left:715px;
  427. text-align:center;
  428. font-family:"tokyoreg";
  429. margin-top:-35px;
  430. padding:10px;
  431. line-height:180%;
  432. }
  433.  
  434. .tabz a{
  435. color:{color:sidebar};
  436. padding:3px;
  437. }
  438.  
  439. .tabz a:hover{
  440. font-size:14px;
  441. }
  442.  
  443. #pagibg{
  444. width:150px;
  445. height:150px;
  446. border-radius:50%;
  447. background-color:{color:sidebar text};
  448. margin-left:-45px;
  449. margin-top:390px;
  450. position:absolute;
  451. z-index:999999;
  452. }
  453.  
  454. .pagination {
  455. position:fixed;margin-top:410px; margin-left:-20px;border-radius:4px;
  456. font-size:10px;padding:5px;width:80px;text-align:right;
  457. z-index:9999999999; height:30px; line-height:120%;}
  458.  
  459. .pagination a{
  460. display:block;
  461. color:{color:sidebar};
  462. font-size:9px;
  463. letter-spacing:2px;
  464. }
  465.  
  466. /*----------------- ASK POSTS -----------------*/
  467.  
  468. .qt {
  469. padding:15px;
  470. background-color:transparent;
  471. border: 1px solid {color:borders};
  472. color:{color:text};
  473. padding-left:15px;
  474. margin-top:10px;
  475. margin-left:0px;
  476. width:270px;
  477. padding-bottom:20px;
  478. margin-bottom:20px;
  479. padding-top:20px;
  480. }
  481.  
  482. .as img {
  483. position:absolute;
  484. border-radius:50px;
  485. margin-left:-40px;
  486. margin-right:40px;
  487. margin-top:-5px;
  488. border:3px solid {color:accent};
  489. }
  490.  
  491. .as {
  492. padding-top:6px;
  493. background-color:{color:posts};
  494. padding:5px;
  495. color:{color:accent};
  496. font-size:16px;
  497. letter-spacing:1px;
  498. margin-left:12%;
  499. margin-top:-35px;
  500. display:inline;
  501. width:auto;
  502. position:absolute;
  503. margin-bottom:10px;
  504. text-transform:lowercase;
  505. font-family:"primetime";
  506. }
  507.  
  508. .as a{
  509. color:{color:accent};
  510. }
  511.  
  512. /*----------------- CHAT POSTS -----------------*/
  513.  
  514. .answer span,.convo li{margin:0 0 5px;border-radius:1em;padding:.5em 10px;max-width:75%;clear:both;position:relative}.answer .them,.user_1,.user_3,.user_5,.user_7,.user_9,.user_11{float:left;background:{color:container};color:{color:text};left:3px}.me::after,.user_1::after,.user_3::after,.user_5::after,.user_7::after,.user_9::after,.user_11::after{content:"";position:absolute;left:-.5em;bottom:0;width:.5em;height:1em;border-right:.5em solid {color:container};border-bottom-right-radius:1em .5em}.answer .me,.user_2,.user_4,.user_6,.user_8,.user_10,.user_12{right:3px;float:right;background-color:{color:permalink bg};color:#000}.them::after,.user_2::after,.user_4::after,.user_6::after,.user_8::after,.user_10::after,.user_12::after{content:"";position:absolute;right:-.5em;bottom:0;width:.5em;height:1em;border-left:.5em solid {color:permalink bg};border-bottom-left-radius:1em .5em}.me p,.answer,.asked span{padding:0;margin:0}.answer{overflow:hidden}
  515. .asked p {
  516. text-align: left;
  517. margin: 0 0px 10px 0px;
  518. padding: 0;
  519. color:{color:text};
  520. font-size: 12px;
  521. line-height: 0px;
  522. }
  523. .footerright .viasrc {
  524. float: left;
  525. }
  526. .asked a {
  527. margin:0;padding:0;
  528. }
  529. .user_4{background-color:{color:container};color{color:text}}.user_4::after{border-color:{color:container}}.user_6{background-color:{color:container};color{color:text}}.user_6::after{border-color:{color:container}}.user_5{background-color:{color:link};color:#000}.user_5::after{border-color:{color:link}}.user_3{background-color:{color:container};color{color:text}}.user_3::after{border-color:{color:container}}.user_7{background-color:{color:container};color{color:text}}.user_7::after{border-color:{color:container}}.user_8{background-color:{color:container};color{color:text}}.user_8::after{border-color:{color:container}}.user_9{background-color:{color:container};color{color:text}}.user_9::after{border-color:{color:container}}
  530. .convo {
  531. overflow: hidden;
  532. list-style-type: none;
  533. padding: 0;
  534. margin: 0;
  535. }
  536.  
  537. /*----------------- PERMALINK PAGE -----------------*/
  538. ol.notes {
  539. width:350px;
  540. padding: 0px;
  541. margin: 0px 0px;
  542. list-style-type: none;
  543. margin-left:10px;
  544. margin-top:-10px;
  545. font-size:9px;
  546. {block:IfHoverPosts}
  547. opacity:0;
  548. -webkit-transition: all 0.4s linear;
  549. -moz-transition: all 0.4s linear;
  550. transition: all 0.4s linear;
  551. {/block:IfHoverPosts}
  552. }
  553.  
  554. ol.notes li.note {
  555. padding: 10px;
  556. }
  557.  
  558. ol.notes li.note img.avatar {
  559. vertical-align: -4px;
  560. margin-right: 10px;
  561. width: 16px;
  562. height: 16px;
  563. }
  564.  
  565. ol.notes li.note span.action {
  566. font-weight: bold;
  567. }
  568.  
  569. ol.notes li.note .answer_content {
  570. font-weight: normal;
  571. }
  572.  
  573. ol.notes li.note blockquote {
  574. border-color: {color:posts};
  575. padding: 4px 10px;
  576. margin: 10px 0px 0px 25px;
  577. }
  578.  
  579. ol.notes li.note blockquote a {
  580. text-decoration: none;
  581. text-transform:uppercase;
  582. }
  583.  
  584. /*----------------- TABS BASE CODE BY NCIGHBOURHOOD -----------------*/
  585.  
  586.  
  587. .tabzcon { /* tablinks content aka the box under the tablinks */
  588. margin: auto;
  589. left:-410px;
  590. top:0px;
  591. bottom:0px;
  592. right:0px;
  593. padding:0px;
  594. position:absolute;
  595. width:410px;
  596. height:450px;
  597. background-color:{color:container};
  598. color:#6c4b45;
  599. z-index:99999999999999999999999999999999999999999999999999;
  600. overflow:hidden;
  601. }
  602.  
  603.  
  604. .tabzclose { /* the close button, u prob dont need to touch this */
  605. font-size:10px;
  606. padding:3px;
  607. color:{color:text};
  608. margin-top:10px;
  609. margin-right:10px;
  610. float:right;
  611. }
  612.  
  613. .tabzclose:hover {
  614. cursor:pointer;
  615. }
  616.  
  617.  
  618. /*----------------- TABS STYLING -----------------*/
  619. #tabcircle{
  620. width:300px;
  621. height:300px;
  622. border-radius:50%;
  623. background-color:{color:sidebar text};
  624. margin-left:-110px;
  625. margin-top:-120px;
  626. position:absolute;
  627. }
  628.  
  629. #tabsub{
  630. margin-top:165px;
  631. color:{color:accent};
  632. font-family:"collection";
  633. text-align:center;
  634. font-size:70px;
  635. width:160px;
  636. height:30px;
  637. margin-left:20px;
  638. position:absolute;
  639. display:inline-block;
  640. z-index:99999999999;
  641. }
  642.  
  643. .tabstats{
  644. margin-top:20px;
  645. width:160px;
  646. height:140px;
  647. padding:0px;
  648. color:{color:sidebar};
  649. position:fixed;
  650. font-size:8.5px;
  651. text-transform:uppercase;
  652. overflow-y:hidden;
  653. line-height:220%;
  654. position:absolute;
  655. display:inline-block;
  656. margin-left:20px;
  657. text-align:justify;
  658. letter-spacing:1.5px;
  659. }
  660.  
  661. .tabstats span{
  662. background-color:{color:posts};
  663. color:{color:accent};
  664. padding:2px;
  665. border-radius:1px;
  666. margin-right:5px;
  667. font-weight:700;
  668. font-size:8px;
  669. }
  670.  
  671.  
  672. #tablink{
  673. width:180px;
  674. height:100px;
  675. text-align:left;
  676. margin-left:20px;
  677. margin-top:350px;
  678. position:absolute;
  679. }
  680.  
  681. #tablink a{
  682. font-size:16px;
  683. font-family:"primetime";
  684. line-height:250%;
  685. padding:7px;
  686. border-radius:2px;
  687. margin-right:5px;
  688. margin-top:20px;
  689. background-color:{color:accent};
  690. color:{color:sidebar};
  691. }
  692.  
  693. #tablink a:hover{
  694. color:{color:accent};
  695. background-color:{color:posts};
  696. }
  697.  
  698. #tabdesc{
  699. font-family:"roboto";
  700. font-size:8px;
  701. position:fixed;
  702. margin-top:235px;
  703. margin-left:20px;
  704. color:{color:text};
  705. text-align:justify;
  706. font-weight:400;
  707. width:160px;
  708. line-height:200%;
  709. letter-spacing:1.5px;
  710. text-transform:uppercase;
  711. font-style:italic;
  712. height:95px;
  713. overflow:auto;
  714. }
  715.  
  716. #socialbase{
  717. background-color:{color:posts};
  718. height:320px;
  719. width:190px;
  720. margin-left:200px;
  721. margin-top:65px;
  722. border-radius:10px;
  723. position:fixed;
  724. }
  725.  
  726. #youtube{
  727. width:190px;
  728. height:100px;
  729. }
  730.  
  731. #youtube img{
  732. width:190px;
  733. height:100px;
  734. background-color:{color:accent};
  735. border-radius:10px 10px 0px 0px;
  736. -webkit-transition: all 0.4s linear;
  737. -moz-transition: all 0.4s linear;
  738. transition: all 0.4s linear;
  739. }
  740.  
  741. #profilepic img{
  742. width:50px;
  743. height:50px;
  744. border-radius:50%;
  745. margin-top:-30px;
  746. margin-left:10px;
  747. border:2px solid {color:posts};
  748. }
  749.  
  750. #playbutton{
  751. margin-top:-65px;
  752. margin-left:80px;
  753. position:fixed;
  754. font-size:30px;
  755. color:white;
  756. opacity:0.4;
  757. }
  758.  
  759. #twitbutton{
  760. width:60px;
  761. border:1px solid {color:borders};
  762. padding:3px;
  763. border-radius:20px;
  764. font-size:8px;
  765. text-transform:uppercase;
  766. color:{color:text};
  767. text-align:center;
  768. line-height:100%;
  769. padding-top:1px;
  770. display:block;
  771. position:fixed;
  772. margin-left:105px;
  773. margin-top:-15px;
  774. letter-spacing:1px;
  775. }
  776.  
  777. #twitbutton:hover{
  778. background-color:{color:sidebar text};
  779. color:{color:sidebar};
  780. border:1px solid {color:sidebar text};
  781. }
  782.  
  783. #username{
  784. font-size:14px;
  785. font-family:"tokyoreg";
  786. letter-spacing:0.5px;
  787. color:{color:accent};
  788. margin-left:15px;
  789. line-height:100%;
  790. margin-top:-5px;
  791. }
  792.  
  793. #username span{
  794. font-size:10px;
  795. font-family:'roboto';
  796. letter-spacing:1px;
  797. color:{color:text};
  798. }
  799.  
  800. #socialstat1 span, #socialstat2 span, #socialstat3 span{
  801. font-size:12px;
  802. color:{color:italic};
  803. letter-spacing:0.5px;
  804. overflow:hidden;
  805. text-align:left;
  806. font-weight:bold;
  807. margin-left:0px;
  808. width:80px;
  809. }
  810.  
  811. #socialstat1 {
  812. font-size:8px;
  813. color:{color:text};
  814. text-align left;
  815. font-weight:none;
  816. width:30px;
  817. height:10px;
  818. text-transform:uppercase;
  819. margin-left:15px; margin-top:10px;
  820. position:fixed;
  821. line-height:150%;
  822. }
  823.  
  824. #socialstat2 {
  825. font-size:8px;
  826. color:{color:text};
  827. text-align left;
  828. font-weight:none;
  829. width:30px;
  830. height:10px;
  831. text-transform:uppercase;
  832. margin-left:58px; margin-top:10px;
  833. position:fixed;
  834. line-height:150%;
  835. }
  836.  
  837. #socialstat3 {
  838. font-size:8px;
  839. color:{color:text};
  840. text-align left;
  841. font-weight:none;
  842. width:30px;
  843. height:10px;
  844. text-transform:uppercase;
  845. margin-left:125px; margin-top:10px;
  846. position:fixed;
  847. line-height:150%;
  848. }
  849.  
  850. #igposts{
  851. width:180px;
  852. text-align:center;
  853. margin-left:6px;
  854. margin-top:40px;
  855. border-radius:3px;
  856. }
  857.  
  858. #igposts img{
  859. width:50px;
  860. height:50px;
  861. padding:2px;
  862. border-radius:3px;
  863. }
  864.  
  865.  
  866. /*----------------- CREDITS / DO NOT TOUCH! -----------------*/
  867. #credits{
  868. position:fixed;
  869. bottom:0px;
  870. right:5px;
  871. width:35px;
  872. height:35px;
  873. text-align:center;
  874. }
  875.  
  876. #credits a{
  877. font-family:"primetime";
  878. font-size:18px;
  879. -webkit-text-stroke: 1px {color:accent};
  880. -webkit-text-fill-color: rgba(0, 0, 0, 0);
  881. }
  882.  
  883. #credits a:hover{
  884. font-family:"primetime";
  885. -webkit-text-fill-color: {color:accent};
  886. }
  887.  
  888.  
  889. {CustomCSS}
  890. </style>
  891.  
  892. <link rel="shortcut icon" href="{Favicon}">
  893. <link rel="alternate" type="application/rss+xml" title="RSS" href="{RSS}" /><meta name="viewport" content="width=820" />
  894.  
  895.  
  896. </head>
  897.  
  898. <body>
  899.  
  900. <!--TABS BASE CODE BY ALYOFRP. DO NOT REMOVE THIS CREDIT!-->
  901.  
  902.  
  903. <!--DO NOT TOUCH-->
  904. <div id="TabzOne" class="tabzcon alytut" style="display:none">
  905. <span onclick="this.parentElement.style.display='none'" class="tabzclose">
  906. <span class="th th-cross"></span></span>
  907. <div id="tabcircle"></div>
  908.  
  909.  
  910. <!--TAB SUBTITLE & DESC-->
  911. <div id="tabsub">{text:tab subtitle}</div>
  912. <div id="tabdesc">{text:tab desc}</div>
  913.  
  914. <!--TAB STATS-->
  915. <div class="tabstats">
  916. <span>name</span>serena sinclair. <br/>
  917. <span>age</span>twenty one. <br/>
  918. <span>work</span>wedding planner.<br/>
  919. <span>hometown</span>manila, ph. <br/>
  920. <span>zodiac</span>scorpio. <br/>
  921. <span>label</span>the syrupy. <br/>
  922. <span>pronouns</span>she/her. <br/></div>
  923.  
  924. <!--TAB LINKS-->
  925. <div id="tablink">
  926. <a href="/"><span class="th th-heart-1-o" title="intro"></span></a>
  927. <a href="/"><span class="th th-diamond-o" title="musings"></span></a>
  928. <a href="/"><span class="th th-quote-down-o" title="interactions"></span></a>
  929. <a href="/"><span class="th th-camera-o" title="visage"></span></a><br/>
  930. <a href="/"><span class="th th-music-o" title="playlist"></span></a>
  931. <a href="/"><span class="th th-hashtag" title="socials"></span></a>
  932. <a href="/"><span class="th th-pinterest-o" title="pinterest"></span></a>
  933. <a href="/"><span class="th th-users-o" title="connections"></span></a>
  934. </div>
  935.  
  936. <!--SOCIAL-->
  937. <div id="socialbase">
  938. <div id="youtube"><img src="{image:tab header}"></div>
  939. <div id="playbutton"><span class="th th-play-o"></span></div>
  940. <div id="profilepic"><img src="{image:tab icon}"></div>
  941. <div id="twitbutton">following</div>
  942. <div id="username">SERENA <br/>
  943. <span>@serenasinclair</span></div>
  944.  
  945. <div id="socialstat1">
  946. <span>450</span><br/>posts</div>
  947.  
  948. <div id="socialstat2">
  949. <span>145K</span><br/>followers</div>
  950.  
  951. <div id="socialstat3">
  952. <span>250</span><br/>following</div>
  953.  
  954. <div id="igposts">
  955. <img src="{image:ig1}">
  956. <img src="{image:ig2}">
  957. <img src="{image:ig3}">
  958. <img src="{image:ig4}">
  959. <img src="{image:ig5}">
  960. <img src="{image:ig6}">
  961. </div>
  962.  
  963. </div><!--end social-->
  964.  
  965.  
  966.  
  967. </div><!--END TAB ONE-->
  968.  
  969.  
  970. <div id="entries">
  971.  
  972. <div class="tabz">
  973. <a href="/" title="HOME"><span class="th th-home-o"></span></a>
  974. <a href="/ask" title="MESSAGE"><span class="th th-chat-bubble-o"></span></a>
  975. <a href="#" class="tablink tabzact" onclick="openAlytut(event, 'TabzOne');" title="NAVIGATE"><span class="th th-worldwide-o"></span></a>
  976. <a href="{text:extra link url}" title="{text:extra link title}"><span class="th th-star-o"></span></a>
  977.  
  978.  
  979. </div>
  980.  
  981. <div id="maintitle">{text:main title}</div>
  982.  
  983. <div id="sidedesc">{text:side desc}</div>
  984.  
  985. <div id="sidebar">
  986. <div class="sideimage">
  987. <img src="{image:sidebar}" draggable="false"></div><div id="tabzbg">
  988. </div>
  989.  
  990. <div id="pagibg"></div>
  991. <div class="pagination">
  992. {block:Pagination}
  993. {block:PreviousPage}
  994. <a href="{PreviousPage}" title="back">BACK <span class="th th-chevron-left"></span></a>
  995. {/block:PreviousPage}
  996. {block:NextPage}
  997. <a href="{NextPage}" title="next">NEXT <span class="th th-chevron-right"></span></a>
  998. {/block:NextPage}
  999. {/block:Pagination}
  1000. </div>
  1001.  
  1002. </div>
  1003.  
  1004. {block:IfHoverPosts}
  1005. <div class="centerimage">
  1006. <img src="{image:graphic}" draggable="false"></div>{/block:IfHoverPosts}
  1007.  
  1008. {block:IfScrollPosts}
  1009. {block:IndexPage}
  1010. <div class="centerimage">
  1011. <img src="{image:graphic}" draggable="false"></div>{/block:IndexPage}{/block:IfScrollPosts}
  1012.  
  1013. {block:Posts}
  1014.  
  1015. <div id="post">
  1016.  
  1017.  
  1018. {block:text}
  1019. {block:Title}
  1020. <div class="posttitle">{Title}</div>
  1021. {/block:Title}
  1022. {Body}
  1023. {/block:text}
  1024.  
  1025. {block:Link}
  1026. <div class="posttitle">
  1027. <a href="{URL}">{Name}</a>
  1028. </div>
  1029. {block:Description}{Description}{/block:Description}
  1030. {/block:Link}
  1031.  
  1032. {block:Photo}
  1033. <center>
  1034. {LinkOpenTag}
  1035. <a href="{permalink}">
  1036. <img src="{PhotoURL-400}" alt="{PhotoAlt}" width="300"></a>
  1037. {LinkCloseTag}
  1038. </center>
  1039. {block:Caption}{Caption}{/block:Caption}
  1040. {block:ContentSource}
  1041. <!-- {SourceURL}{block:SourceLogo}<img src="{BlackLogoURL}"
  1042. width="{LogoWidth}" height="{LogoHeight}" alt="{SourceTitle}" />
  1043. {/block:SourceLogo}
  1044. {block:NoSourceLogo}{SourceLink}{/block:NoSourceLogo} -->
  1045. {/block:ContentSource}
  1046. {block:ReblogParentURL}
  1047. <!-- {block:NoSourceLogo}{SourceLink}{/block:NoSourceLogo} -->
  1048. {/block:ReblogParentURL}
  1049. {/block:Photo}
  1050.  
  1051. {block:Photoset}
  1052. {Photoset}
  1053. {block:Caption}{Caption}{/block:Caption}
  1054. {/block:Photoset}
  1055.  
  1056. {block:Quote}
  1057. <h1>{Quote}</h1>
  1058. {block:Source}
  1059. <center>- {Source}</center>
  1060. {/block:Source}
  1061. {/block:Quote}
  1062.  
  1063. {block:Chat}
  1064. {block:Title}
  1065. <h1>{Title}</h1>{/block:Title}<br>
  1066. <ul class="convo">{block:Lines}<li class="line_{Alt} user_{UserNumber}">{block:Label}<span class="label"><strong>{Label}</strong></span>{/block:Label}
  1067. {Line}</li>{/block:Lines}</ul>
  1068. {/block:Chat}
  1069.  
  1070. {block:Audio}
  1071. {block:AlbumArt}
  1072. <img src="{AlbumArtURL}" width="80px" align="left" style="margin-right:10px" />{/block:AlbumArt}
  1073. <span class="audio">{AudioPlayerGrey}<br></span>
  1074. {block:TrackName}<b>Title:</b> {TrackName}<br />{/block:TrackName}
  1075. {block:Artist}<b>Artist:</b> {Artist}<br />{/block:Artist}
  1076. {/block:ExternalAudio}<b>Played:</b> {PlayCount} times
  1077. {block:Caption}{Caption}{/block:Caption}
  1078. {/block:Audio}
  1079.  
  1080. {block:Video}
  1081. <div class="video">{Video-500}</div>
  1082. {block:Caption}{Caption}{/block:Caption}
  1083. {/block:Video}
  1084.  
  1085. {block:Answer}
  1086. <div class="pt"></div>
  1087. <div class="qt">{Question}</div>
  1088. <div class="as"><img src="{AskerPortraitURL-24}">{Asker}</div>
  1089. {Answer}{/block:Answer}
  1090.  
  1091.  
  1092. {block:IndexPage}
  1093. <div class="info">
  1094. {block:Date}
  1095. <span><a href="{Permalink}" title="{TimeAgo}">
  1096. <b>{ShortMonth}{DayOfMonthWithZero}{ShortYear}</b></a>
  1097. {block:NoteCount}with
  1098. <b><a href="{Permalink}">{NoteCountWithLabel}</b></a>{/block:NoteCount}</span>
  1099. {/block:Date}
  1100. <rb>
  1101. <span>
  1102.  
  1103. {block:RebloggedFrom}
  1104. <a href="{reblogparenturl}" title="via"><span class="th th-share-o"></span></a>{/block:RebloggedFrom}
  1105.  
  1106. {block:ContentSource}
  1107. <a href="{SourceURL}" title="source"><span class="th th-push-pin-o"></span></a>{/block:ContentSource}
  1108.  
  1109. <a href="{ReblogURL}" title="reblog" target="_blank" class="reblog"><span class="th th-reload"></span></a></span></rb>
  1110. </div>
  1111.  
  1112. <div class="tags">{block:HasTags}
  1113. {block:Tags}<a href="{TagURL}">#<font style="text-transform:uppercase;">{Tag}</font>&nbsp;</a>
  1114. {/block:Tags}
  1115. {/block:HasTags}</div>
  1116. {/block:IndexPage}
  1117.  
  1118.  
  1119. {block:PermalinkPage}
  1120. <div class="info">
  1121. {block:Date}<span>
  1122. <a href="{Permalink}">
  1123. <b>{ShortMonth}{DayOfMonthWithZero}{ShortYear}</b></a> with <b><a href="{Permalink}">{NoteCountWithLabel}</b></a></span>
  1124. {/block:Date}
  1125. <span>
  1126. </span>
  1127. </div>
  1128.  
  1129. <div class="tags">{block:HasTags}
  1130. {block:Tags}<a href="{TagURL}">#<font style="text-transform:uppercase;">{Tag}</font>&nbsp;</a>
  1131. {/block:Tags}
  1132. {/block:HasTags}</div>
  1133. {/block:PermalinkPage}
  1134.  
  1135.  
  1136. </div><!----POST END---->
  1137.  
  1138. {block:PostNotes}
  1139. {PostNotes}
  1140. {/block:PostNotes}
  1141. {/block:Posts}
  1142.  
  1143. </div><!----ENTRIES END---->
  1144. </div>
  1145.  
  1146. <div id="credits">
  1147. <a href="https://drunkblushed.tumblr.com/" title="theme by drunkblushed">DB.</a></div>
  1148.  
  1149.  
  1150. </body>
  1151. <script>
  1152. function openAlytut(evt, alytutName) {
  1153. var i, x, tablinks;
  1154. x = document.getElementsByClassName("alytut");
  1155. for (i = 0; i < x.length; i++) {
  1156. x[i].style.display = "none";
  1157. }
  1158. tablinks = document.getElementsByClassName("tablink");
  1159. for (i = 0; i < x.length; i++) {
  1160. tablinks[i].className = tablinks[i].className.replace(" tabzact", "");
  1161. }
  1162. document.getElementById(alytutName).style.display = "block";
  1163. evt.currentTarget.className += " tabzact";
  1164. }
  1165. </script>
  1166.  
  1167. </html>
Advertisement
Add Comment
Please, Sign In to add comment
Public Pastes
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!