Advertisement
drunkblushed

selfish by drunkblushed

Mar 28th, 2020 (edited)
10,730
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 29.64 KB | None | 0 0
  1. <!--
  2.  
  3. ♡ SELFISH 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. <meta name="color:background" content="#e7e7e7"/>
  18. <meta name="color:posts" content="#e7e7e7"/>
  19. <meta name="color:container" content="#f0f0f0"/>
  20. <meta name="color:borders" content="#ffffff"/>
  21. <meta name="color:accent" content="#93ad9d"/>
  22. <meta name="color:accent 2" content="#93ad9d"/>
  23. <meta name="color:bold" content="#93ad9d"/>
  24. <meta name="color:italic" content="#93ad9d"/>
  25. <meta name="color:text" content="#3c3c3c"/>
  26. <meta name="color:link" content="#93ad9d"/>
  27. <meta name="color:permalink" content="#3c3c3c"/>
  28. <meta name="color:permalink bg" content="#93ad9d"/>
  29.  
  30. <meta name="image:background" content=""/>
  31. <meta name="image:left image" content="https://via.placeholder.com/200x200"/>
  32. <meta name="image:right image" content="https://via.placeholder.com/210x210"/>
  33. <meta name="image:icon" content="https://via.placeholder.com/50x50"/>
  34.  
  35. <meta name="text:main title" content="SELFISH SELFISH SELFISH"/>
  36. <meta name="text:side description" content="lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum"/>
  37. <meta name="text:stats" content"update! update!" />
  38. <meta name="text:notif" content"if you like my resources, please consider BUYING ME A COFFEE! it would mean a lot." />
  39. <meta name="text:sidelink title1" content="link one" />
  40. <meta name="text:sidelink url1" content="" />
  41. <meta name="text:sidelink title2" content="link two" />
  42. <meta name="text:sidelink url2" content="" />
  43. <meta name="text:sidelink title3" content="link three" />
  44. <meta name="text:sidelink url3" content="" />
  45. <meta name="text:sidelink title4" content="link four" />
  46. <meta name="text:sidelink url4" content="" />
  47.  
  48. <title>{title}</title>
  49.  
  50. <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
  51.  
  52. <link href="//solrainha.github.io/honeybee/honeybee.css" rel="stylesheet">
  53.  
  54. <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
  55. <script>
  56. $(document).ready(function(){
  57. $('.video iframe').each(function(){
  58. var scale = $(this).parents('.video').width() / 500;
  59. $(this).attr({
  60. width: Math.floor($(this).attr('width') * scale),
  61. height: Math.floor($(this).attr('height') * scale)
  62. });
  63. });
  64. });
  65. </script>
  66.  
  67. <script type="text/javascript" src="https://static.tumblr.com/7qjmkr5/IUmmdsy41/jquery.style-my-tooltips.js"></script>
  68. <script>
  69. (function($){
  70. $(document).ready(function(){
  71. $("[title]").style_my_tooltips();
  72. });
  73. })(jQuery);
  74. </script>
  75.  
  76.  
  77. <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
  78.  
  79.  
  80. <link href="https://fonts.googleapis.com/css?family=Montserrat:500,700&display=swap" rel="stylesheet">
  81.  
  82.  
  83. <link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">
  84.  
  85. <!-------MUSIC PLAYER BY GLENTHEMES------->
  86. <script src="https://dl.dropbox.com/s/brdv4yv2iaigjmp/glenplayer07.js"></script>
  87.  
  88. <style type="text/css">
  89.  
  90. /*----------------- FONTS -----------------*/
  91.  
  92. @font-face { font-family: "creo"; src: url('https://dl.dropboxusercontent.com/s/uk7fcayvza8gd9t/Creo-ExtraBold.ttf') ;}
  93.  
  94.  
  95. /*----------------- TEXT STYLES -----------------*/
  96.  
  97. body{
  98. background-color: {color:background};
  99. font-family: 'Montserrat', sans-serif;
  100. color:{color:text};
  101. letter-spacing:1px;
  102. color:{color:text};
  103. font-size:9px;
  104. font-weight:500;
  105. background-image:url({image:background});
  106. }
  107.  
  108. a:link, a:active, a:visited{
  109. color: {color:Link};
  110. text-decoration:none;
  111. -webkit-transition: all 0.2s linear;
  112. -moz-transition: all 0.2s linear;
  113. transition: all 0.2s linear;
  114. text-transform:uppercase;
  115. font-weight:bold;
  116. }
  117.  
  118. a:hover {
  119. color:{color:Link Hover};
  120. -webkit-transition: all 0.2s linear;
  121. -moz-transition: all 0.2s linear;
  122. transition: all 0.2s linear;
  123. }
  124.  
  125. b,bold,strong{
  126. color:{color:bold};
  127. text-transform:uppercase;
  128. }
  129.  
  130. em,i,italic{
  131. color:{color:italic};
  132. }
  133.  
  134. big{
  135. font-size:15px;
  136. font-family: 'Montserrat', sans-serif;
  137. }
  138.  
  139. small,sup, sub{
  140. font-size:9px;
  141. }
  142.  
  143. h1{font-family: "creo";
  144. padding:5px;
  145. letter-spacing:1px;
  146. padding:0px;
  147. text-align:center;
  148. font-size: 24px;
  149. text-transform:uppercase;
  150. line-height: 120%;
  151. color:{color:bold};}
  152.  
  153. h2{font-family: "creo";
  154. padding:5px;
  155. letter-spacing:1px;
  156. text-align:center;
  157. font-size: 28px;
  158. text-transform:uppercase;
  159. line-height: 120%;
  160. color:{color:accent};}
  161.  
  162. .posttitle{
  163. font-family: "creo";
  164. padding:5px;
  165. letter-spacing:1px;
  166. text-align:center;
  167. font-size: 32px;
  168. text-transform:uppercase;
  169. line-height: 120%;
  170. -webkit-text-stroke: 1px {color:bold};
  171. -webkit-text-fill-color: rgba(0, 0, 0, 0);
  172. }
  173.  
  174. blockquote{
  175. margin-left:0px;
  176. padding-left:15px;
  177. border-left: 1px solid {color:borders};
  178. width:95%;
  179. }
  180.  
  181.  
  182. .p { padding-top: 5px;}
  183. .ol, ul { margin-left: 30px; padding: 5px; }
  184. .ul { list-style-type: square; }
  185.  
  186. ::-webkit-scrollbar-thumb {
  187. display: none;
  188. }
  189.  
  190. ::-webkit-scrollbar {
  191. display: none;
  192. }
  193.  
  194. #s-m-t-tooltip {
  195. z-index: 999999999999999999;
  196. background: #fff;
  197. font-size: 8px;
  198. line-height: 13px;
  199. letter-spacing: 1.5px;
  200. text-transform: uppercase;
  201. color: {color:text};
  202. font-weight:900;
  203. background-color:{color:posts};
  204. border:1px solid {color:borders};
  205. border-radius:5px;
  206. max-width: 150px;
  207. word-wrap: break-word;
  208. padding: 2px 5px 2px 6px;
  209. display: block;
  210. margin: 24px 14px 7px 12px;
  211. -webkit-transition: all 0.2s linear;
  212. -moz-transition: all 0.2s linear;
  213. transition: all 0.2s linear;
  214. }
  215.  
  216. ::-moz-selection { background: {color:accent}; }
  217. ::selection { background: {color:accent}; }
  218.  
  219. /*----------------- CONTAINERS & POSTS -----------------*/
  220.  
  221. #entries{
  222. padding:30px;
  223. z-index:99;
  224. margin: auto;
  225. left:0px;
  226. top:-100px;
  227. bottom:0px;
  228. right:0px;
  229. width:550px;
  230. position:absolute;
  231. height:370px;
  232. overflow-y:scroll;
  233. background-color: {color:text};
  234. overflow-x:hidden;
  235. border-radius:15px;
  236. }
  237.  
  238. #container {
  239. margin: auto;
  240. left:0px;
  241. top:-100px;
  242. bottom:0px;
  243. right:0px;
  244. position:absolute;
  245. width:570px;
  246. height:390px;
  247. overflow:auto;
  248. color:{color:text};
  249. z-index:999;
  250. border-radius:10px;
  251. background-color:{color:container};
  252. }
  253.  
  254. #post {
  255. font-size:9px;
  256. background-color:{color:posts};
  257. padding:20px;
  258. width:350px;
  259. z-index:99;
  260. margin-top:20px;
  261. margin-bottom:40px;
  262. margin-left:95px;
  263. line-height:160%;
  264. letter-spacing:1px;
  265. border-radius:10px;
  266. border:1px solid {color:borders};
  267. }
  268.  
  269. #post .tags {position:relative;
  270. text-align:left;
  271. color:{color:link};
  272. padding-top:10px;
  273. font-size:6.5px;
  274. letter-spacing:2px;
  275. font-family: 'Montserrat', 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. line-height:120%;
  281. margin-top:5px;
  282. }
  283.  
  284. #post .tags a{
  285. color:{color:link};
  286. }
  287.  
  288. #post img{
  289. max-width:350px;
  290. height:auto;
  291. }
  292.  
  293.  
  294. #post:hover .tags {position:relative;
  295. text-align:left;opacity:1;
  296. color:{color:link}; width:auto;
  297. text-transform:uppercase;-webkit-transition: all 0.2s linear;
  298. -moz-transition: all 0.2s linear;
  299. transition: all 0.2s linear;}
  300. .tags a {color:{color:text};text-transform:uppercase;}
  301.  
  302. .tags a:hover {color:{color:link hover};text-transform:uppercase;}
  303.  
  304.  
  305. .info{
  306. background:{color:permalink bg};
  307. position:relative;
  308. padding:12px;
  309. margin-top:20px;
  310. margin-bottom:0px;
  311. text-transform:uppercase;
  312. letter-spacing:1px;
  313. color:{color:permalink};
  314. font-size:8.5px;
  315. line-height:100%;
  316. border-radius:5px;
  317. }
  318.  
  319. .info span{
  320. text-align:left;
  321. padding-left:-20px;
  322. text-transform:uppercase;
  323. margin-top:2px;
  324. padding-right:5px;
  325. }
  326.  
  327. .info rb{
  328. right:0%;
  329. position:absolute;
  330. padding-right:0px;
  331. margin-top:-1px;
  332. }
  333.  
  334. .info b{
  335. font-weight:900;
  336. color:{color:permalink};
  337. }
  338.  
  339. .info a{
  340. margin-left:0px;
  341. font-size:8.5px;
  342. color: {color:permalink};
  343. }
  344.  
  345.  
  346. /*----------------- CUSTOMIZATIONS -----------------*/
  347.  
  348. #leftwindow{
  349. width:235px;
  350. height:275px;
  351. padding:0px;
  352. background-color:{color:posts};
  353. margin:auto;
  354. position:fixed;
  355. left:0px;
  356. top:310px;
  357. bottom:0px;
  358. right:670px;
  359. border-radius:15px;
  360. z-index:9999;
  361. -webkit-transition: all 0.2s linear;
  362. -moz-transition: all 0.2s linear;
  363. transition: all 0.2s linear;
  364. }
  365.  
  366. #leftwindow:hover{
  367. transform: scale(1.1);
  368. -webkit-transition: all 0.2s linear;
  369. -moz-transition: all 0.2s linear;
  370. transition: all 0.2s linear;
  371. }
  372.  
  373. #rightwindow{
  374. width:250px;
  375. height:375px;
  376. padding:0px;
  377. background-color:{color:posts};
  378. margin:auto;
  379. position:fixed;
  380. left:700px;
  381. top:230px;
  382. bottom:0px;
  383. right:0px;
  384. border-radius:15px;
  385. -webkit-transition: all 0.2s linear;
  386. -moz-transition: all 0.2s linear;
  387. transition: all 0.2s linear;
  388. }
  389.  
  390. #rightwindow img{
  391. width:210px;
  392. height:210px;
  393. border-radius:10px;
  394. margin-top:45px;
  395. margin-left:20px;
  396. }
  397.  
  398. #rightwindow:hover{
  399. z-index:9999;
  400. -webkit-transition: all 0.2s linear;
  401. -moz-transition: all 0.2s linear;
  402. transition: all 0.2s linear;
  403. }
  404.  
  405. #stats{
  406. font-family:"creo";
  407. font-size:14px;
  408. position:fixed;
  409. margin-top:15px;
  410. margin-left:20px;
  411. color:{color:italic};
  412. width:210px;
  413. text-align:center;
  414. word-spacing:0px;
  415. overflow:hidden;
  416. letter-spacing:2.5px;
  417. font-weight:bold;
  418. }
  419.  
  420.  
  421. .blinking{
  422. animation:blinkingText 1.2s infinite;
  423. }
  424. @keyframes blinkingText{
  425. 0%{ color: {color:italic}; }
  426. 49%{ color: {color:italic}; }
  427. 60%{ color: transparent; }
  428. 99%{ color:transparent; }
  429. 100%{ color: {color:italic}; }
  430. }
  431.  
  432.  
  433. #sideimage {position:fixed; width:200px; height:150px; margin:18px;display:block; background-color:{color:accent}; border-radius:10px;}
  434.  
  435. #sideimage img {width:200px; height:200px; position:fixed; margin-top:-50px;}
  436.  
  437. .description {width:200px; height:50px; line-height:200%; margin-top:180px; margin-left:18px; display:block; font-size:9px; overflow:hidden; }
  438.  
  439. #browserbig{
  440. background-color:{color:accent 2};
  441. padding:5px;
  442. width:auto;
  443. border-radius:15px 15px 0px 0px;
  444. }
  445.  
  446. .dots{
  447. font-size:10px;
  448. margin:5px;
  449. color:{color:posts};
  450. }
  451.  
  452. .comp{
  453. font-size:10px;
  454. margin:5px; text-align:right;}
  455.  
  456.  
  457. @import "compass/css3";
  458.  
  459. .wave1fill{
  460. fill:{color:accent};
  461. width: 830px;
  462. height:670px;
  463. }
  464.  
  465.  
  466. #wave1{
  467. margin:auto;
  468. right:0px;
  469. top:0px;
  470. left:0px;
  471. bottom:0px;
  472. width: 830px;
  473. height:670px;
  474. overflow: hidden;
  475. position:fixed;
  476. }
  477.  
  478. .wave2fill{
  479. fill: transparent;
  480. stroke: {color:accent 2};
  481. stroke-width:1.5px;
  482. width: 830px;
  483. height:670px;
  484. }
  485.  
  486.  
  487. #wave2{
  488. margin:auto;
  489. right:0px;
  490. top:0px;
  491. left:0px;
  492. bottom:0px;
  493. width: 830px;
  494. height:670px;
  495. overflow: hidden;
  496. position:fixed;
  497. transform:rotate(5deg);
  498. }
  499.  
  500. .computer{
  501. fill:{color:posts};
  502. width: 200px;
  503. height: 200px;
  504. }
  505.  
  506.  
  507. #computer{
  508. margin:auto;
  509. right:0px;
  510. top:445px;
  511. left:0px;
  512. bottom:0px;
  513. width: 200px;
  514. height:200px;
  515. overflow: hidden;
  516. position:fixed;
  517. z-index:99;
  518. }
  519.  
  520.  
  521. #maintitle{
  522. font-family:"creo";
  523. font-size:74px;
  524. position:fixed;
  525. margin:auto;
  526. left:0px;
  527. right:740px;
  528. bottom:0px;
  529. top:-380px;
  530. width:300px;
  531. height:250px;
  532. text-align:right;
  533. word-spacing:-3px;
  534. line-height:100%;
  535. padding:10px;
  536. z-index:99999999999999999999999;
  537. -webkit-text-stroke:1.5px {color:bold};
  538. -webkit-text-fill-color: rgba(0, 0, 0, 0);
  539. text-shadow:3px 3px {color:posts};
  540. }
  541.  
  542.  
  543. /*----------------- NAVIGATION & PAGINATION -----------------*/
  544.  
  545. .tabs{
  546. width:200px;
  547. font-size:15px;
  548. z-index:99999999999999999;
  549. position:fixed;
  550. text-transform:uppercase;
  551. margin-left:2px;
  552. text-align:center;
  553. margin-top:-17px;
  554. letter-spacing:3px;
  555. line-height:100%;
  556. word-spacing:10px;
  557. }
  558.  
  559. .tabs a{
  560. color:{color:text};
  561. width:30px;
  562. height:30px;
  563. padding:0px;
  564. display:inline-block;
  565. border-radius:5px;
  566. }
  567.  
  568. .tabs span{
  569. padding:5px;
  570. padding-top:8px;
  571. padding-right:2.5px;
  572. }
  573.  
  574. .tabs a:hover{
  575. font-size:14px;
  576. background-color:{color:bold};
  577. color:{color:posts};
  578. border-radius:50%;
  579. }
  580.  
  581. #pagination {
  582. font-family: 'Montserrat', sans-serif;
  583. font-size:14px;
  584. font-weight:900;
  585. width:400px;
  586. height:100px;
  587. color:{color:accent};
  588. text-align:center;
  589. position:fixed;
  590. margin:auto;
  591. left:0px;
  592. right:0px;
  593. bottom:0px;
  594. top:500px;
  595. z-index:999999999999;
  596. }
  597.  
  598. #pagination a{
  599. display:inline-block;
  600. }
  601.  
  602. #pagination .far{
  603. margin-left:270px;
  604. }
  605.  
  606. #pagination span{
  607. width:14px;
  608. height:14px;
  609. padding:15px;
  610. color:{color:posts};
  611. background-color:{color:bold};
  612. border-radius:50%;
  613. margin:5px;
  614. }
  615.  
  616. #notif{
  617. position:fixed;
  618. top:-520px;
  619. right:0px;
  620. left:740px;
  621. bottom:0px;
  622. margin:auto;
  623. border-radius:15px;
  624. width:240px;
  625. height:50px;
  626. padding:10px;
  627. background-color:{color:posts};
  628. line-height:150%;
  629. -webkit-transition: all 0.2s linear;
  630. -moz-transition: all 0.2s linear;
  631. transition: all 0.2s linear;
  632. z-index:999999999999999999;
  633. }
  634.  
  635. #notif img{
  636. width:50px;
  637. height:50px;
  638. border-radius:50%;
  639. float:left;
  640. margin-right:10px;
  641. }
  642.  
  643. #notif a{
  644. font-weight:bold;
  645. }
  646.  
  647. #notif:hover{
  648. transform: scale(1.1);
  649. -webkit-transition: all 0.2s linear;
  650. -moz-transition: all 0.2s linear;
  651. transition: all 0.2s linear;
  652. }
  653.  
  654. #spotify{
  655. position:fixed;
  656. top:-350px;
  657. right:0px;
  658. left:760px;
  659. bottom:0px;
  660. margin:auto;
  661. border-radius:15px;
  662. width:200px;
  663. height:68px;
  664. background-color:{color:posts};
  665. -webkit-transition: all 0.2s linear;
  666. -moz-transition: all 0.2s linear;
  667. transition: all 0.2s linear;
  668. z-index:999999999999999999;
  669. }
  670.  
  671. #spotify:hover{
  672. transform: scale(1.1);
  673. -webkit-transition: all 0.2s linear;
  674. -moz-transition: all 0.2s linear;
  675. transition: all 0.2s linear;
  676. }
  677.  
  678. /*----------------- ASK POSTS -----------------*/
  679.  
  680. .question {
  681. padding:15px;
  682. background-color:{color:container};
  683. color:{color:text};
  684. margin-top:40px;
  685. margin-left:0px;
  686. width:320px;
  687. margin-bottom:20px;
  688. border-radius:10px;
  689. text-align:center;
  690. }
  691.  
  692. .asker img {
  693. position:absolute;
  694. border-radius:50px;
  695. margin-left:-40px;
  696. margin-right:40px;
  697. margin-top:-10px;
  698. border:5px solid {color:bold};
  699. }
  700.  
  701. .asker {
  702. padding-top:6px;
  703. background-color:{color:posts};
  704. padding:5px;
  705. color:{color:bold};
  706. font-size:16px;
  707. letter-spacing:1.5px;
  708. margin-left:20%;
  709. margin-top:5px;
  710. display:inline;
  711. width:auto;
  712. position:absolute;
  713. margin-bottom:10px;
  714. text-transform:uppercase;
  715. font-family:"creo";
  716. }
  717.  
  718. .asker a{
  719. color:{color:bold};
  720. margin-top:-5px;
  721. }
  722.  
  723.  
  724. /*----------------- CHAT POSTS -----------------*/
  725.  
  726. .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:background};color:{color:text}}.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:background};border-bottom-left-radius:1em .5em}.me p,.answer,.asked span{padding:0;margin:0}.answer{overflow:hidden}
  727. .asked p {
  728. text-align: left;
  729. margin: 0 0px 10px 0px;
  730. padding: 0;
  731. color:{color:text};
  732. font-size: 12px;
  733. line-height: 0px;
  734. }
  735. .footerright .viasrc {
  736. float: left;
  737. }
  738. .asked a {
  739. margin:0;padding:0;
  740. }
  741. .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:background};color:{color:text}}.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}}
  742. .convo {
  743. overflow: hidden;
  744. list-style-type: none;
  745. padding: 0;
  746. margin: 0;
  747. }
  748.  
  749. /*----------------- PERMALINK PAGE -----------------*/
  750. ol.notes {
  751. width:350px;
  752. padding: 0px;
  753. margin: 0px 0px;
  754. list-style-type: none;
  755. margin-left:95px;
  756. margin-top:-10px;
  757. font-size:9px;}
  758.  
  759. ol.notes li.note {
  760. padding: 10px;
  761. }
  762.  
  763. ol.notes li.note img.avatar {
  764. vertical-align: -4px;
  765. margin-right: 10px;
  766. width: 16px;
  767. height: 16px;
  768. }
  769.  
  770. ol.notes li.note .answer_content {
  771. font-weight: normal;
  772. }
  773.  
  774. ol.notes li.note blockquote {
  775. border-color: {color:posts};
  776. padding: 4px 10px;
  777. margin: 10px 0px 0px 25px;
  778. }
  779.  
  780. ol.notes li.note blockquote a {
  781. text-decoration: none;}
  782.  
  783.  
  784. /*----------------- TABS STYLING -----------------*/
  785.  
  786.  
  787. #bar{
  788. position:fixed;
  789. top:585px;
  790. bottom:0px;
  791. right:0px;
  792. left:0px;
  793. margin: auto;
  794. width:220px;
  795. height:15px;
  796. border-radius:8px;
  797. background-color:{color:borders};
  798. z-index:9999999999999999999999999999999;
  799. }
  800.  
  801.  
  802. #phone{
  803. position:fixed;
  804. top:-560px;
  805. bottom:0px;
  806. right:0px;
  807. left:0px;
  808. margin: auto;
  809. width:270px;
  810. height:5px;
  811. background-color:{color:container};
  812. padding:10px 15px;
  813. z-index:9999999999999999999999999999;
  814. font-size:9px;
  815. line-height:110%;
  816. letter-spacing:2.5px;
  817. border-radius:15px 15px 0px 0px;
  818. text-transform:uppercase;
  819. }
  820.  
  821. .phone{
  822. float:right;
  823. }
  824.  
  825. #phone span{font-size:10px;}
  826.  
  827. #phone .material-icons{font-size:11px; color:{color:text}; display: inline-block; margin-top:-5px; text-transform: none;letter-spacing: normal;word-wrap: normal;white-space: nowrap;}
  828.  
  829.  
  830. #sidelink{
  831. position:fixed;
  832. width:280px;
  833. height:100px;
  834. margin-left:15px;
  835. margin-top:15px;
  836. z-index:999999999999999999999999999;
  837. text-align:left;
  838. }
  839.  
  840. #sidelink span{
  841. width:25px;
  842. height:25px;
  843. border-radius:15px;
  844. background-color:{color:accent 2};
  845. color:{color:posts};
  846. font-size:25px;
  847. float:left;
  848. padding:10px;
  849. text-align:center;
  850. margin:5px;
  851. }
  852.  
  853. #sidelink a:hover span{
  854. transform: scale(1.2);
  855. -webkit-transition: all 0.2s linear;
  856. -moz-transition: all 0.2s linear;
  857. transition: all 0.2s linear;
  858. }
  859.  
  860.  
  861.  
  862. /*----------------- CREDITS / DO NOT TOUCH! -----------------*/
  863. #credits{
  864. position:fixed;
  865. bottom:10px;
  866. right:15px;
  867. width:36px;
  868. height:36px;
  869. text-align:center;
  870. }
  871.  
  872. #credits a{
  873. font-weight:bold;
  874. font-family:"creo";
  875. width:36px;
  876. height:36px;
  877. padding:0px;
  878. display:inline-block;
  879. -webkit-text-fill-color: {color:posts};
  880. background-color:{color:bold};
  881. font-size:18px;
  882. border-radius:50%;
  883.  
  884. }
  885.  
  886. #credits span{
  887. padding:5px;
  888. padding-top:10px;
  889. padding-right:5px;
  890. }
  891.  
  892. #credits a:hover{
  893. font-family:"creo";
  894. }
  895.  
  896. .pulse a:hover{
  897. animation: pulse 1s infinite;
  898. animation-timing-function: linear;
  899. }
  900.  
  901. @keyframes pulse {
  902. 0% { transform: scale(1); }
  903. 50% { transform: scale(1.3);
  904. 100% { transform: scale(1); }
  905. }
  906. }
  907.  
  908. /*-------MUSIC PLAYER BY GLENTHEMES-------*/
  909. :root {
  910. --Circle-Size:50px;
  911. --Progress-Border-Size:2px;
  912. --Progress-Empty:#eee;
  913. --Progress-Fill:{color:bold};
  914. --Player-Background:{color:accent 2};
  915. --Play-Pause-Buttons-Size:20px;
  916. --Play-Pause-Buttons-Color:#111;
  917. --Player-Text-Margin:9.5px;
  918.  
  919. --Song-Name-Font-Size:9.5px;
  920. --Song-Name-Color:{color:bold};
  921.  
  922. --Artist-Name-Font-Size:9.5px;
  923. --Artist-Name-Color:#888;
  924. }
  925.  
  926. #glenplayer07 {
  927. position:absolute;
  928. margin-top:10px;
  929. margin-left:10px;
  930. z-index:99;
  931. }
  932.  
  933. .flamingo {
  934. display:flex;
  935. align-items:center;
  936. }
  937.  
  938. .circleofdeath {
  939. width:var(--Circle-Size);
  940. height:var(--Circle-Size);
  941. border-radius:100%;
  942. overflow:hidden;
  943. }
  944.  
  945. .tinfoil {
  946. width:var(--Circle-Size);
  947. height:var(--Circle-Size);
  948. background:var(--Progress-Empty);
  949. border-radius:100%;
  950. }
  951.  
  952. .oven {
  953. background:var(--Progress-Fill);
  954. }
  955.  
  956. .oliveoil {
  957. width:100%;
  958. height:100%;
  959. }
  960.  
  961. .crust {
  962. position:absolute;
  963. top:0;
  964. display:flex;
  965. align-items:center;
  966. justify-content:center;
  967. width:var(--Circle-Size);
  968. height:var(--Circle-Size);
  969. }
  970.  
  971. .cherry {
  972. display:flex;
  973. align-items:center;
  974. justify-content:center;
  975. width:calc(var(--Circle-Size) - (var(--Progress-Border-Size) * 2));
  976. height:calc(var(--Circle-Size) - (var(--Progress-Border-Size) * 2));
  977. background:var(--Player-Background);
  978. border-radius:100%;
  979. cursor:pointer;
  980. z-index:1;
  981. }
  982.  
  983. .music-controls .material-icons {
  984. font-size:var(--Play-Pause-Buttons-Size);
  985. color:var(--Play-Pause-Buttons-Color);
  986. }
  987.  
  988. .pausee {display:none;}
  989.  
  990. .beff {display:none;}
  991. .aff {display:block;}
  992.  
  993. .music-info {
  994. margin-left:var(--Player-Text-Margin);
  995. line-height:1em;
  996. }
  997.  
  998. .song-name {
  999. font-family: 'Montserrat', sans-serif;
  1000. font-size:var(--Song-Name-Font-Size);
  1001. text-transform:uppercase;
  1002. font-weight:bold;
  1003. color:{color:bold};
  1004. color:var(--Song-Name-Color);
  1005. }
  1006.  
  1007. .artist-name {
  1008. margin-top:3px;
  1009. font-family: 'Montserrat', sans-serif;
  1010. font-size:var(--Artist-Name-Font-Size);
  1011. letter-spacing:0.3px;
  1012. color:var(--Artist-Name-Color);
  1013. }
  1014.  
  1015. {CustomCSS}
  1016. </style>
  1017.  
  1018. <link rel="shortcut icon" href="{Favicon}">
  1019. <link rel="alternate" type="application/rss+xml" title="RSS" href="{RSS}" /><meta name="viewport" content="width=820" />
  1020.  
  1021.  
  1022. </head>
  1023.  
  1024. <body>
  1025.  
  1026. <div id="maintitle">{text:main title}</div>
  1027.  
  1028.  
  1029. <div id="wave1">
  1030. <svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 848.17 682.02" xml:space="preserve" class="wave1fill">
  1031. <path class="cls-1" d="M2.09,341.32s13-78,68.78-109.52c40.65-23,87.23-36.22,131.83-52.65s72.26-39.74,95.73-77.4c9.13-14.66,16.9-36.89,26.62-51.24C354.39,7.16,434.36-4,489.11,9.18S587.65,61,614,105.84c18.86,32,29.92,67.21,45.45,100.64s36.7,66.32,70,86.91c23.77,14.69,52.64,22.43,74.5,39.32,36.85,28.49,45.66,76.19,46.06,119.73.33,35.18-3.55,71.3-20.78,102.93-19.29,35.41-53.68,63-92.07,82.39-110.55,55.72-258.74,52-362.63,43-64.37-5.52-128.27-7.39-188.23-29S71.19,593.93,39.66,543.48c-37.75-60.4-38.4-133-37.57-202.16" transform="translate(-1.91 -3.99)"/></svg>
  1032. </div>
  1033.  
  1034. <div id="wave2">
  1035. <svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 848.17 682.02" xml:space="preserve" class="wave2fill">
  1036. <path class="cls-1" d="M2.09,341.32s13-78,68.78-109.52c40.65-23,87.23-36.22,131.83-52.65s72.26-39.74,95.73-77.4c9.13-14.66,16.9-36.89,26.62-51.24C354.39,7.16,434.36-4,489.11,9.18S587.65,61,614,105.84c18.86,32,29.92,67.21,45.45,100.64s36.7,66.32,70,86.91c23.77,14.69,52.64,22.43,74.5,39.32,36.85,28.49,45.66,76.19,46.06,119.73.33,35.18-3.55,71.3-20.78,102.93-19.29,35.41-53.68,63-92.07,82.39-110.55,55.72-258.74,52-362.63,43-64.37-5.52-128.27-7.39-188.23-29S71.19,593.93,39.66,543.48c-37.75-60.4-38.4-133-37.57-202.16" transform="translate(-1.91 -3.99)"/></svg>
  1037. </div>
  1038.  
  1039. <div id="computer">
  1040. <svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 234 158.17" xml:space="preserve" class="computer">
  1041. <path class="cls-1" d="M255,41H87s44.06,90.38-33,158.17H288C210.89,131.4,255,41,255,41Z" transform="translate(-54 -41.02)"/></svg>
  1042. </div>
  1043.  
  1044. <div id="bar"></div>
  1045.  
  1046.  
  1047. <div id="notif">
  1048. <img src="{image:icon}">
  1049. <b>DRUNKBLUSHED</b><br/>
  1050. {text:notif}
  1051. </div>
  1052.  
  1053. <div id="spotify">
  1054. <!-------MUSIC PLAYER BY GLENTHEMES------->
  1055. <div id="glenplayer07">
  1056. <div class="flamingo">
  1057. <div class="circleofdeath">
  1058. <div class="tinfoil">
  1059. <div class="oliveoil"></div>
  1060. </div>
  1061. <div class="crust">
  1062. <div class="cherry">
  1063. <div class="music-controls">
  1064. <i class="material-icons playy">play_arrow</i>
  1065. <i class="material-icons pausee">pause</i>
  1066. </div>
  1067. </div><!--cherry-->
  1068. </div><!--crust-->
  1069. </div><!--circleofdeath-->
  1070.  
  1071. <div class="music-info">
  1072. <div class="song-name">SELFISH</div>
  1073. <div class="artist-name">Madison Beer</div>
  1074. </div><!--music-info-->
  1075. </div><!--flamingo-->
  1076. </div><!--glenplayer07-->
  1077.  
  1078. <audio id="audio" src="https://dl.dropbox.com/s/1n7voelw6o1wp2x/Taylor%20Swift%20-%20Lover%20Remix%20Feat.%20Shawn%20Mendes.mp3" type="audio"></audio>
  1079. <!----end music player---->
  1080. </div>
  1081.  
  1082. <div id="leftwindow">
  1083. <div id="browserbig">
  1084. <div class="dots">
  1085. <span class="th th-circle"></span>
  1086. <span class="th th-circle"></span>
  1087. <span class="th th-circle"></span>
  1088. &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;
  1089. <span class="th th-minus"></span>&nbsp;
  1090. <span class="th th-cross"></span>
  1091. </div></div>
  1092. <div id="sideimage"><img src="{image:left image}" draggable="false"></div>
  1093. <div class="description">{text:side description}</div>
  1094. </div>
  1095.  
  1096. <div id="rightwindow">
  1097. <div id="browserbig">
  1098. <div class="dots">
  1099. <span class="th th-circle"></span>
  1100. <span class="th th-circle"></span>
  1101. <span class="th th-circle"></span>
  1102. &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;
  1103. <span class="th th-minus"></span>&nbsp;
  1104. <span class="th th-cross"></span>
  1105. </div></div>
  1106.  
  1107. <div id="stats">
  1108. <span class="blinking">{text:stats}</span>
  1109. </div>
  1110.  
  1111. <img src="{image:right image}">
  1112.  
  1113. <div id="sidelink">
  1114. <a href="{text:sidelink url1}" title="{text:sidelink title1}"><span class="th th-home-o"></span></a>
  1115. <a href="{text:sidelink url2}" title="{text:sidelink title2}"><span class="th th-envelope-o"></span></a>
  1116. <a href="{text:sidelink url3}" title="{text:sidelink title3}"><span class="th th-star-o"></span></a>
  1117. <a href="{text:sidelink url4}" title="{text:sidelink title4}"><span class="th th-worldwide-o"></span></a>
  1118. </div>
  1119.  
  1120.  
  1121. </div>
  1122.  
  1123.  
  1124. <!-------------------------------POSTS------------------------------->
  1125. <div id="container">
  1126.  
  1127.  
  1128. <div id="pagination">
  1129. {block:Pagination}
  1130. {block:PreviousPage}
  1131. <a href="{PreviousPage}" title="back"><span class="th th-chevron-left"></span></a>
  1132. {/block:PreviousPage}
  1133. {block:NextPage}
  1134. <a href="{NextPage}" title="next" class="far"><span class="th th-chevron-right"></span></a>
  1135. {/block:NextPage}
  1136. {/block:Pagination}</div>
  1137.  
  1138. {block:Posts}
  1139.  
  1140. <div id="post">
  1141.  
  1142. {block:text}
  1143. {block:Title}
  1144. <div class="posttitle">{Title}</div>
  1145. {/block:Title}
  1146. {Body}
  1147. {/block:text}
  1148.  
  1149. {block:Link}
  1150. <div class="posttitle">
  1151. <a href="{URL}">{Name}</a>
  1152. </div>
  1153. {block:Description}{Description}{/block:Description}
  1154. {/block:Link}
  1155.  
  1156. {block:Photo}
  1157. <center>
  1158. {LinkOpenTag}
  1159. <a href="{permalink}">
  1160. <img src="{PhotoURL-400}" alt="{PhotoAlt}" width="350"></a>
  1161. {LinkCloseTag}
  1162. </center>
  1163. {block:Caption}{Caption}{/block:Caption}
  1164. {block:ContentSource}
  1165. <!-- {SourceURL}{block:SourceLogo}<img src="{BlackLogoURL}"
  1166. width="{LogoWidth}" height="{LogoHeight}" alt="{SourceTitle}" />
  1167. {/block:SourceLogo}
  1168. {block:NoSourceLogo}{SourceLink}{/block:NoSourceLogo} -->
  1169. {/block:ContentSource}
  1170. {block:ReblogParentURL}
  1171. <!-- {block:NoSourceLogo}{SourceLink}{/block:NoSourceLogo} -->
  1172. {/block:ReblogParentURL}
  1173. {/block:Photo}
  1174.  
  1175. {block:Photoset}
  1176. <div style="z-index:99999999999999999999;">{Photoset}</div>
  1177. {block:Caption}{Caption}{/block:Caption}
  1178. {/block:Photoset}
  1179.  
  1180. {block:Quote}
  1181. <h1>{Quote}</h1>
  1182. {block:Source}
  1183. <center>- {Source}</center>
  1184. {/block:Source}
  1185. {/block:Quote}
  1186.  
  1187. {block:Chat}
  1188. {block:Title}
  1189. <h1>{Title}</h1>{/block:Title}<br>
  1190. <ul class="convo">{block:Lines}<li class="line_{Alt} user_{UserNumber}">{block:Label}<span class="label"><strong>{Label}</strong></span>{/block:Label}
  1191. {Line}</li>{/block:Lines}</ul>
  1192. {/block:Chat}
  1193.  
  1194. {block:Audio}
  1195. {block:AlbumArt}
  1196. <img src="{AlbumArtURL}" width="90" align="left" style="margin-right:20px; border-radius:50%;" />{/block:AlbumArt}
  1197. <br/>
  1198. {block:TrackName}<b>Title:</b> {TrackName}<br />{/block:TrackName}
  1199. {block:Artist}<b>Artist:</b> {Artist}<br />{/block:Artist}
  1200. {/block:ExternalAudio}<b>Played:</b> {PlayCount} times
  1201. <span class="audio">{AudioPlayerGrey}<br></span>
  1202. {block:Caption}{Caption}{/block:Caption}
  1203. {/block:Audio}
  1204.  
  1205. {block:Video}
  1206. <div class="video">{Video-500}</div>
  1207. {block:Caption}{Caption}{/block:Caption}
  1208. {/block:Video}
  1209.  
  1210. {block:Answer}
  1211. <div class="asker"><img src="{AskerPortraitURL-24}">{Asker}</div>
  1212. <div class="question">{Question}</div>
  1213. {Answer}{/block:Answer}
  1214.  
  1215. {block:IndexPage}
  1216. <div class="info">
  1217. {block:Date}
  1218. <span><a href="{Permalink}" title="{TimeAgo}">
  1219. <b>{Month} {DayOfMonthWithZero}</b></a>
  1220. {block:NoteCount}with
  1221. <b><a href="{Permalink}">{NoteCountWithLabel}</b></a>{/block:NoteCount}</span>
  1222. {/block:Date}
  1223. <rb>
  1224. <span>
  1225.  
  1226. {block:RebloggedFrom}
  1227. <a href="{reblogparenturl}" title="via"><span class="th th-share-o"></span></a>{/block:RebloggedFrom}
  1228.  
  1229. {block:ContentSource}
  1230. <a href="{SourceURL}" title="source"><span class="th th-push-pin-o"></span></a>{/block:ContentSource}
  1231.  
  1232. <a href="{ReblogURL}" title="reblog" target="_blank" class="reblog"><span class="th th-reload"></span></a></span></rb>
  1233. </div>
  1234.  
  1235. <div class="tags">{block:HasTags}
  1236. {block:Tags}<a href="{TagURL}">#<font style="text-transform:uppercase;">{Tag}</font>&nbsp;</a>
  1237. {/block:Tags}
  1238. {/block:HasTags}</div>
  1239. {/block:IndexPage}
  1240.  
  1241.  
  1242. {block:PermalinkPage}
  1243. <div class="info">
  1244. {block:Date}<span>
  1245. <a href="{Permalink}">
  1246. <b>{Month} {DayOfMonthWithZero}</b></a> with <b><a href="{Permalink}">{NoteCountWithLabel}</b></a></span>
  1247. {/block:Date}
  1248. <span>
  1249. </span>
  1250. </div>
  1251.  
  1252. <div class="tags">{block:HasTags}
  1253. {block:Tags}<a href="{TagURL}">#<font style="text-transform:uppercase;">{Tag}</font>&nbsp;</a>
  1254. {/block:Tags}
  1255. {/block:HasTags}</div>
  1256. {/block:PermalinkPage}
  1257.  
  1258.  
  1259. </div><!----POST END---->
  1260.  
  1261. {block:PostNotes}
  1262. {PostNotes}
  1263. {/block:PostNotes}
  1264. {/block:Posts}
  1265.  
  1266. </div><!--END DEFAULT-->
  1267.  
  1268.  
  1269. <!-------------------------------CONTAINER------------------------------->
  1270. <div id="entries">
  1271.  
  1272.  
  1273. </div><!----ENTRIES END---->
  1274. </div>
  1275.  
  1276. <div id="credits">
  1277. <div class="pulse">
  1278. <a href="https://drunkblushed.tumblr.com/" title="made by dana">
  1279. <span class="th th-heart-1-o"></a></div></div>
  1280.  
  1281.  
  1282. </body>
  1283.  
  1284. </html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement