Advertisement
lizarps

Theme #011: Apartment 3C

May 1st, 2016
486
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 24.26 KB | None | 0 0
  1.  
  2. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  3.  
  4. <!--
  5. Original coding by crayonthemes
  6. T H E M E • B Y • L I Z
  7. ✿ THEME BY LIZ @ MORRISONSRPH ✿
  8. -->
  9.  
  10. <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
  11. <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
  12.  
  13. <title>{Title}</title>
  14. <link rel="shortcut icon" href="{Favicon}">
  15. <link rel="alternate" type="application/rss+xml" href="{RSS}">
  16.  
  17. {block:Description}
  18. <meta name="description" content="{MetaDescription}"/>
  19. {/block:Description}
  20.  
  21.  
  22. <head>
  23. <script type="text/javascript"
  24. src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.1/jquery.min.js"></script>
  25. <script>
  26. $(document).ready(function() {
  27. //
  28. $('a.poplight[href^=#]').click(function() {
  29. var popID = $(this).attr('rel'); //Get Popup Name
  30. var popURL = $(this).attr('href'); //Get Popup href to define size
  31. var query= popURL.split('?');
  32. var dim= query[1].split('&');
  33. var popWidth = dim[0].split('=')[1]; //Gets the first query string value
  34. $('#' + popID).fadeIn().css({ 'width': Number( popWidth ) }).prepend('<a href="#" class="close"></a>');
  35. var popMargTop = ($('#' + popID).height() + 80) / 2;
  36. var popMargLeft = ($('#' + popID).width() + 80) / 2;
  37. //Apply Margin to Popup
  38. $('#' + popID).css({
  39. 'margin-top' : -popMargTop,
  40. 'margin-left' : -popMargLeft
  41. });
  42. $('body').append('<div id="fade"></div>');
  43. $('#fade').css({'filter' : 'alpha(opacity=80)'}).fadeIn(); //Fade in the fade layer - .css({'filter' : 'alpha(opacity=80)'})
  44. return false;
  45. });
  46. $('a.close, #fade').live('click', function() {
  47. $('#fade , .popup_block').fadeOut(function() {
  48. $('#fade, a.close').remove(); //fade them both out
  49. });
  50. return false;
  51. });
  52. });
  53. </script>
  54.  
  55.  
  56. <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
  57. <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.4.0/css/font-awesome.min.css">
  58.  
  59. <meta name="image:Background" content=""/>
  60. <meta name="image:Sidebar 1" content=""/>
  61.  
  62. <meta name="color:background" content="ffffff"/>
  63. <meta name="color:text" content="#000000"/>
  64. <meta name="color:links" content="#dddddd"/>
  65. <meta name="color:bold" content="#809729" />
  66. <meta name="color:italic" content="#809729" />
  67. <meta name="color:sidebar" content="#ffffff"/>
  68. <meta name="color:sidebar links" content="#f1f1f1"/>
  69. <meta name="color:sidebar text" content="#fffff"/>
  70. <meta name="color:sidebar link hover" content="#ffffff"/>
  71. <meta name="color:hover" content="#eeeeee"/>
  72. <meta name="color:box background" content="#ef95a5"/>
  73. <meta name="color:border" content="#000000"/>
  74. <meta name="color:scrollbar" content="#000000"/>
  75. <meta name="color:title" content="#eeeeee"/>
  76. <meta name="color:post background" content="#ffffff"/>
  77. <meta name="color:post links" content="#ef95a5"/>
  78. <meta name="color:permalink border" content="#dddddd"/>
  79. <meta name="color:box shadow" content="#999" />
  80. <meta name="color:info" content="#ffffff" />
  81. <meta name="color:notes" content="#c4d6e8"/>
  82.  
  83. <meta name="text:Hover 1" content="hover 1"/>
  84. <meta name="text:Hover 2" content="hover 2"/>
  85. <meta name="text:Hover 3" content="hover 3"/>
  86. <meta name="text:Hover 4" content="hover 4"/>
  87. <meta name="text:Hover 5" content="hover 5"/>
  88.  
  89. <meta name="if:styledpre" content="1" />
  90.  
  91. <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js"></script>
  92.  
  93. <script src="http://static.tumblr.com/iuw14ew/VSQma1786/jquery.style-my-tooltips.js"></script>
  94.  
  95. <script>
  96.  
  97. (function($){
  98.  
  99. $(document).ready(function(){
  100.  
  101. $("a[title]").style_my_tooltips({
  102.  
  103. tip_follows_cursor:true,
  104.  
  105. tip_delay_time:90,
  106.  
  107. tip_fade_speed:900,
  108.  
  109. attribute:"title"
  110.  
  111. });
  112.  
  113. });
  114.  
  115. })(jQuery);
  116.  
  117. </script>
  118.  
  119.  
  120. <style type="text/css">
  121.  
  122. ::-webkit-scrollbar-thumb {
  123. height:auto;
  124. background-color:{color:Scrollbar};
  125. }
  126.  
  127. ::-webkit-scrollbar {
  128. height:9px;
  129. width:4px;
  130. background-color:{color:ScrollbarBg};
  131. }
  132.  
  133. /*Fonts*/
  134. <link href='http://fonts.googleapis.com/css?family=Poiret+One|Amatic+SC|Megrim|Raleway+Dots' rel='stylesheet' type='text/css'>
  135.  
  136. <link href='http://fonts.googleapis.com/css?family=Lekton|Antic+Slab|Andika' rel='stylesheet' type='text/css'>
  137.  
  138. <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.4.0/css/font-awesome.min.css">
  139.  
  140.  
  141. /* MAIN */
  142.  
  143. body {
  144. background-color:{color:background};
  145. background-image: url('{image:Background}');
  146. color:{color:Text};
  147. font-family: 'roboto'
  148. text-transform: uppercase;
  149. font-size: 10px;
  150. margin: 0px;
  151. padding: 0px;
  152. }
  153.  
  154. iframe#tumblr_controls {
  155. position:fixed!important;
  156. width:40%;
  157. right:3px!important;
  158. top:3px!important;
  159. opacity:.4;
  160. }
  161.  
  162. iframe#tumblr_controls a:hover{
  163. opacity:.9;
  164. }
  165.  
  166. img {
  167. border:none;
  168. overflow:hidden!important;
  169. margin-bottom:10px
  170. }
  171.  
  172. a:link, a:active {
  173. text-decoration:none;
  174. font-size:10px;
  175. color: {color:links}; }
  176.  
  177. a:visited {
  178. text-decoration:none;
  179. color: {color:links}; }
  180.  
  181. a:hover {
  182. text-decoration:none;
  183. color: {color:hover};
  184. font-style:normal;}
  185.  
  186. b, strong {
  187. font-size:9px;
  188. text-shadow:3px 3px 5px {color:#ef95a5};
  189. }
  190.  
  191. blockquote {
  192. border-left:2px solid {color:text};
  193. padding-left:6px; }
  194.  
  195. blockquote img {
  196. max-width:370px!important;
  197. }
  198.  
  199. #tumblr_controls{ position:fixed!important; right: 0px; top:0px;}
  200.  
  201. i, em, .em {color:{color:text};}
  202.  
  203. u, ul {
  204. font-size:10px;
  205. color:#00bcc8;
  206. }
  207.  
  208. big {
  209. font-size:12px;
  210. color:#debeb6;
  211. }
  212.  
  213.  
  214. {block:ifstyledpre}
  215. pre {
  216. text-align:center;
  217. padding:6px;
  218. border:1px solid {color:Text};
  219. box-shadow:2px 2px {color:text};
  220. background:transparent;
  221. color:{color:Text};
  222. font-size:10px;
  223. word-wrap:break-word;
  224. font-family:helvetica;
  225. text-transform:uppercase;
  226. margin:10px;
  227. }
  228. {/block:ifstyledpre}
  229.  
  230. small{font-size:9px;}
  231.  
  232. h1 {
  233. font-size:15px;
  234. color:{color:text};
  235. text-transform:uppercase;
  236. font-family: 'Roboto', sans-serif;
  237. background-color:{color:info};
  238. padding:10px;
  239. font-style:bold, italic;
  240. text-align:center;
  241. }
  242.  
  243. h2 {
  244. font-size:10px;
  245. text-align:center;
  246. line-height:100%;
  247. letter-spacing:-0.5px;
  248. color:{color:text};
  249. background-color:{color:info};
  250. font-weight:bold;
  251. text-transform:uppercase;
  252. padding:5px;
  253. padding-bottom:2px;
  254. }
  255.  
  256.  
  257. .tooltip{
  258. display: inline;
  259. position: relative;
  260. }
  261.  
  262. #s-m-t-tooltip {
  263. max-width:230px;
  264. padding:2px 2px 2px 3px;
  265. margin:20px 7px -2px 20px;
  266. background-color:{color:odd chat background};
  267. font-family:'04b03', arial;
  268. font-size:8px;
  269. line-height:10px;
  270. letter-spacing:1px;
  271. text-transform:uppercase;
  272. color:{color:odd chat text};
  273. z-index:999999999999999999999999999999999999;
  274. -webkit-animation: scale .8s 1; /* Chrome, Safari, Opera */
  275. animation: scale .8s 1;
  276. }
  277.  
  278. .sidebar {
  279. position:fixed;
  280. margin-left:200px;
  281. margin-top:-10px;
  282. height:500px;
  283. width:400px;
  284. padding:5px;
  285. background:{color:post links};
  286. box-shadow: 3px 3px 5px {color:box shadow};
  287. }
  288.  
  289.  
  290. /* CONTENT */
  291.  
  292. .container {
  293. max-height: 500px;
  294. height: 500px;
  295. overflow: auto;
  296. background-color: #000000;
  297. }
  298.  
  299. #entries {
  300. position: fixed;
  301. height:500px;
  302. background-color: {color:post links};
  303. overflow:auto;
  304. padding:5px;
  305. overflow-x:hidden;
  306. width:565px;
  307. margin-left:590px;
  308. margin-top:-20px;
  309. box-shadow: 3px 3px 5px {color:box shadow};
  310. }
  311.  
  312. #post {
  313. width: 500px;
  314. margin-left:10px;
  315. margin-top:20px;
  316. height: auto;
  317. background-color:#fff;
  318. padding: 20px;
  319. margin-bottom:25px;
  320. color: {color:text};
  321. text-align:justify;
  322. }
  323.  
  324. /*POST INFO*/
  325.  
  326. #info {
  327. width:500px;
  328. text-align:center;
  329. font-family:'arial';
  330. margin-top:2px;
  331. margin-left:-5px;
  332. letter-spacing:1px;
  333. font-size:10px;
  334. font-style:none;
  335. padding:5px;
  336. line-height:10px;
  337. text-transform:uppercase;
  338. background:{color:info};
  339. border-bottom:{color:post bg};
  340. border-top: 1px dotted {color:post bg};;
  341. }
  342.  
  343. #info a {
  344. text-align:center;
  345. color:{color:Post Links};
  346. }
  347.  
  348. #info a:hover {
  349. -moz-transition-duration:0.3s;
  350. -webkit-transition-duration:0.3s;
  351. -o-transition-duration:0.3s;
  352. color:{color:Hover}
  353. }
  354.  
  355. #tags {
  356. float:left;
  357. background-color:#c4d6e8;
  358. color:{color:Post Links};
  359. width:530px;
  360. margin-top:6px;
  361. margin-left:-20px;
  362. text-align:center;
  363. font-size:7px;
  364. padding:5px;
  365. margin-bottom:30px;
  366. font-size:8px;
  367. opacity:1;
  368. transition-duration: 0.5s;
  369. -moz-transition-duration: 0.5s;
  370. -webkit-transition-duration: 0.5s;
  371. -o-transition-duration: 0.5s
  372. }
  373.  
  374. #tags a {
  375. letter-spacing:0px;
  376. font-size:8px;
  377. padding:5px;
  378. text-align:center;
  379. font-family:'CALIBRI';
  380. text-decoration:uppercase;
  381. display:inline-block;
  382. color:{color:post links};
  383. }
  384.  
  385. #tags a:hover {
  386. -moz-transition-duration:0.3s;
  387. -webkit-transition-duration:0.3s;
  388. -o-transition-duration:0.3s;
  389. color:{color:Hover};
  390. }
  391.  
  392.  
  393. /*Sidebar*/
  394.  
  395. .sidebarimage {
  396. position:fixed;
  397. margin-top:50px;
  398. margin-left:35px;
  399. width:120px;
  400. height:120px;
  401. background:{color:Background};
  402. border:3px double {color:Sidebar};
  403. box-shadow: 3px 3px 5px {color:box shadow};
  404. }
  405.  
  406. .sbimg1 {
  407. position:fixed;
  408. margin:0;
  409. opacity:1;
  410. -webkit-transition: all .8s ease-in-out;
  411. -moz-transition: all .8s ease-in-out;
  412. -ms-transition: all .8s ease-in-out;
  413. -o-transition: all .8s ease-in-out;
  414. transition: all .8s ease-in-out;
  415. }
  416.  
  417. .blogtitle {
  418. margin-top:80px;
  419. margin-left:-870px;
  420. z-index:100;
  421. font-size:35px;
  422. font-weight:400;
  423. text-transform:uppercase;
  424. font-family:bebas neou, helvetica;
  425. letter-spacing:3px;
  426. line-height:18px;
  427. text-align:center;
  428. color:{color:Title};
  429. padding:5px;
  430. transition: all 0.5s ease-in-out;
  431. -webkit-transition: all 0.5s ease-in-out;
  432. -moz-transition: all 0.5s ease-in-out;
  433. -o-transition: all 0.5s ease-in-out;
  434. }
  435.  
  436. #tit {
  437. position:fixed;
  438. margin-top:0px;
  439. font-family:'roboto';
  440. }
  441.  
  442. #sb {
  443. position:fixed;
  444. margin-top:560px;
  445. margin-left:0px;
  446. }
  447.  
  448.  
  449. #description {
  450. background:{color:post background};
  451. position:fixed;
  452. width:320px;
  453. height:160px;
  454. font-family:'calibri';
  455. font-size:10px;
  456. margin-top:190px;
  457. margin-left:25px;
  458. overflow:auto;
  459. padding:10px;
  460. text-align:justify;
  461. line-height:14px;
  462. color:{color:text};
  463. text-transform:none;
  464. box-shadow: 3px 3px 5px {color:box shadow};
  465. }
  466.  
  467. #description::-webkit-scrollbar-thumb {
  468. width:3px;
  469. height:4px;
  470. background:{color:Sidebar text};
  471. }
  472.  
  473. #description::-webkit-scrollbar {
  474. background:{color:Sidebar text};
  475. width:3px;
  476. }
  477.  
  478.  
  479. #icons {
  480. position:fixed;
  481. padding:5px;
  482. padding-right:0px;
  483. margin-top:390px;
  484. margin-left:110px;
  485. z-index:11;
  486. height:20px;
  487. font-size:17px;
  488. color:{color:post background};
  489. }
  490.  
  491. #icons a {
  492. padding:0 5px;
  493. margin-left:6px;
  494. display:inline-block;
  495. color:{color:post background};
  496. }
  497.  
  498. #icons a:hover {
  499. color:{color:post background};
  500. text-shadow:0px 0px 1px {color:Hover};
  501. }
  502.  
  503. /*PAGINATION*/
  504. #pagination {
  505. margin-top:430px;
  506. margin-left:250px;
  507. width:320px;
  508. position:fixed;
  509. padding:10px 0px;
  510. font-family:'04b03', sans-serif;
  511. font-size:8px;
  512. letter-spacing:2px;
  513. text-transform:uppercase;
  514. line-height:8px;
  515. text-align:center;
  516. }
  517.  
  518. #pagination a {
  519. padding:0px 10px;
  520. font-size:8px;
  521. letter-spacing:4px;
  522. color:{color:post background};
  523. }
  524.  
  525. /*AUDIO*/
  526. #audio {
  527. min-height:70px;
  528. margin:0;
  529. padding:0 0 5px 0;
  530. }
  531.  
  532. #albumartwork {
  533. position:absolute;
  534. background-image: url('http://static.tumblr.com/hbqviai/7KBlqu606/no_album_art.jpg');
  535. background-repeat:no-repeat;
  536. background-position:left;
  537. background-size:80px 80px;
  538. margin:0;
  539. height:80px;
  540. width:80px;
  541. }
  542.  
  543.  
  544. #audioinfo {
  545. font-family:ms gothic;
  546. font-size:11px;
  547. line-height:14px;
  548. margin-top:0px;
  549. margin-left:80px;
  550. height:60px;
  551. padding:10px;
  552. text-align:left;
  553. list-style:none;
  554. color:{color:text};
  555. }
  556.  
  557. #abox {
  558. position:absolute;
  559. margin-top:15px;
  560. margin-left:15px;
  561. width:30px;
  562. height:30px;
  563. padding:10px;
  564. opacity:.9;
  565. background:white;
  566. -webkit-transition: all 0.7s ease;
  567. -moz-transition: all 0.7s ease;
  568. -ms-transition: all 0.7s ease;
  569. -o-transition: all 0.7s ease;
  570. transition: all 0.7s ease;
  571. }
  572.  
  573. #abox:hover {
  574. opacity:1;
  575. }
  576.  
  577. #audioplayer {
  578. margin-top:1px;
  579. margin-left:1px;
  580. width:28px;
  581. height:28px;
  582. overflow:hidden;
  583. }
  584.  
  585.  
  586. /*Titles*/
  587. .title1 {
  588. font-family:helvetica, sans-serif;
  589. font-size:18px;
  590. font-weight:bold;
  591. line-height:100%;
  592. letter-spacing:0px;
  593. padding:0;
  594. margin-bottom:5px;
  595. }
  596.  
  597. .title1::first-letter {
  598. text-transform:uppercase;
  599. }
  600.  
  601.  
  602. /*QUOTE*/
  603. .quote {
  604. font-size:18px;
  605. font-family:helvetica;
  606. font-style:normal;
  607. margin-bottom:15px;
  608. text-transform:normal;
  609. text-align:left;
  610. font-weight:bold;
  611. font-style:italic;
  612. color:{color:Text};
  613. }
  614.  
  615. .quotesource {
  616. font-size:9px;
  617. text-align:right;
  618. font-style:none;
  619. text-transform:lowercase;
  620. font-family:helvetica;
  621. margin-bottom:5px;
  622. color:{color:Text};
  623. }
  624.  
  625.  
  626. /*CHAT*/
  627. .answer span,.convo li{
  628. margin:0 0 5px;
  629. border-radius:1em;
  630. padding:.5em 10px;
  631. max-width:75%;
  632. clear:both;
  633. position:relative
  634. }
  635. .answer .them,.user_1,.user_3,.user_5,.user_7,.user_9,.user_11{
  636. float:left;
  637. background-color:#c4d6e8;
  638. color:#000;
  639. left:3px
  640. }
  641. .me::after,.user_1::after,.user_3::after,.user_5::after,.user_7::after,.user_9::after,.user_11::after{
  642. content:"";
  643. position:absolute;
  644. left:-.5em;
  645. bottom:0;
  646. width:.5em;
  647. height:1em;
  648. border-right:.5em solid #c4d6e8;
  649. border-bottom-right-radius:1em .5em
  650. }
  651. .answer .me,.user_2,.user_4,.user_6,.user_8,.user_10,.user_12{
  652. right:3px;
  653. float:right;
  654. background-color:#ef95a5;
  655. color:#000
  656. }
  657. .them::after,.user_2::after,.user_4::after,.user_6::after,.user_8::after,.user_10::after,.user_12::after{
  658. content:"";
  659. position:absolute;
  660. right:-.5em;
  661. bottom:0;
  662. width:.5em;
  663. height:1em;
  664. border-left:.5em solid #ef95a5;
  665. border-bottom-left-radius:1em .5em
  666. }
  667. .me p,.answer,.asked span{
  668. padding:0;margin:0
  669. }
  670. .answer{
  671. overflow:hidden
  672. }
  673.  
  674. .asked p {
  675. text-align: left;
  676. margin: 0 0px 10px 0px;
  677. padding: 0;
  678. color: #666666;
  679. font-family: 'Inconsolata', Inconsolata;
  680. font-size: 12px;
  681. line-height: 0px;
  682. }
  683.  
  684. .footerright .viasrc {
  685. float: left;
  686. }
  687. .asked a {
  688. margin:0;padding:0;
  689. }
  690. .user_4{background-color:;color:#000000}.user_4::after{border-color:}.user_6{background-color:;color:#000000}.user_6::after{border-color:}.user_5{background-color:;color:#000}.user_5::after{border-color:}.user_3{background-color:;color:#000000}.user_3::after{border-color:}.user_7{background-color:;color:#000000}.user_7::after{border-color:}.user_8{background-color:;color:#000000}.user_8::after{border-color:}.user_9{background-color:;color:#000000}.user_9::after{border-color:}
  691.  
  692. .convo {
  693. overflow: hidden;
  694. list-style-type: none;
  695. padding: 0;
  696. margin: 0;
  697. }
  698.  
  699.  
  700. /*ASKS*/
  701. .que {
  702. padding:9px;
  703. text-align:left;
  704. font-size:9px;
  705. text-transform:italic;
  706. color:{color:text};
  707. background-color: #f5f5f5;
  708. border-left:3px solid {color:post links};
  709. }
  710.  
  711. .asker a {
  712. color:{color:odd chat text};
  713. margin-left:0px;
  714. margin-bottom:15px;
  715. font-size:10px;
  716. text-transform:uppercase;
  717. }
  718.  
  719. .asker {
  720. text-align:left;
  721. padding-top:5px;
  722. color:{color:text};
  723. }
  724.  
  725. .answer {
  726. text-align:left;
  727. margin-top:5px;
  728. margin-bottom:5px;
  729. font-size:11px;
  730. }
  731.  
  732.  
  733. #perma {
  734. padding:10px 15px 0px 15px;
  735. text-align:center;
  736. font-family:ms gothic;
  737. font-size:11px;
  738. letter-spacing:1px;
  739. line-height:13px;
  740. text-transform:uppercase;
  741. color:{color:text};
  742. }
  743.  
  744. #perma a {
  745. color:{color:Links};
  746. -webkit-transition: all 0.7s ease;
  747. -moz-transition: all 0.7s ease;
  748. -ms-transition: all 0.7s ease;
  749. -o-transition: all 0.7s ease;
  750. transition: all 0.7s ease;
  751. }
  752.  
  753.  
  754. /* Chrome, Safari, Opera */
  755. @-webkit-keyframes scale {
  756.  
  757. 0% { transform: scale(.5, .5);-moz-transform: scale(.5, .5);-ms-transform: scale(.5, .5);-webkit-transform: scale(.5, .5);-o-transform: scale(.5, .5);}
  758.  
  759. 50% {transform: scale(1.25, 1.25); -moz-transform: scale(1.25, 1.25); -ms-transform: scale(1.25, 1.25); -webkit-transform: scale(1.25, 1.25); -o-transform: scale(1.25, 1.25);}
  760.  
  761. 100% {transform: scale(1, 1); -moz-transform: scale(1, 1); -ms-transform: scale(1, 1); -webkit-transform: scale(1, 1); -o-transform: scale(1, 1);}
  762.  
  763. }
  764.  
  765. /* Standard syntax */
  766. @keyframes scale {
  767.  
  768. 0% { transform: scale(.5, .5); -moz-transform: scale(.5, .5); -ms-transform: scale(.5, .5); -webkit-transform: scale(.5, .5); -o-transform: scale(.5, .5);}
  769.  
  770. 50% {transform: scale(1.25, 1.25); -moz-transform: scale(1.25, 1.25); -ms-transform: scale(1.25, 1.25); -webkit-transform: scale(1.25, 1.25);
  771. -o-transform: scale(1.25, 1.25);}
  772.  
  773. 100% {transform: scale(1, 1); -moz-transform: scale(1, 1); -ms-transform: scale(1, 1); -webkit-transform: scale(1, 1); -o-transform: scale(1, 1);}
  774. }
  775.  
  776. /*--
  777.  
  778. updates tab #7 by BRAVETHEMES
  779.  
  780. ◤ ◥
  781. don't be an asshole;
  782. keep the credits.
  783. ◣ ◢
  784.  
  785. - - - -
  786.  
  787. for html help go to:
  788. http://bravethemes.tumblr.com/
  789. http://htmlqueens.tumblr.com/
  790.  
  791. --*/
  792. .kingdom{/* this is the coding to the whole tab holder */
  793. width:150px; /* change the width here */
  794. top:100px; /* change how far from the top ; you can also change it to bottom */
  795. left:400px; /* how far from right ; you can also change it to left */
  796. padding:3px;
  797. position:fixed;
  798. background:transparent; /* change the background here */
  799. color:#fff;
  800. }
  801.  
  802. .kingdom b{ /* this are the subtitles */
  803. text-align:center;
  804. line-height:20px;
  805. border-bottom:1px solid #ffffff; /* change the border here */
  806. margin-bottom:2px;
  807. letter-spacing:2px;}
  808.  
  809. #queen{ /* the thing that gets hovered over */
  810. border:1px solid #ffffff; /* change the border here */
  811. padding:7px;
  812. margin:7px;
  813. margin-top:22px;
  814. text-align:center;
  815. font-size:11px;
  816. height:36px;
  817. box-shadow: 3px 3px 5px {color:box shadow};
  818. }
  819.  
  820. .royal{ /* here you cusomize the titles */
  821. border-bottom:1px solid #fff; /* change the borders here */
  822. font-weight:bold;
  823. text-align:center;
  824. font-size:9px
  825. padding:10px;
  826. }
  827.  
  828. /*CREDIT*/
  829.  
  830. #cred {
  831. position:fixed;
  832. font-family:'Calibri';
  833. text-transform:uppercase;
  834. font-size:8px;
  835. right:9px;
  836. bottom:9px;
  837. padding:4px;
  838. letter-spacing:1px;
  839. background-color:{color:content bg};
  840. border:1px solid color: #ef95a5;
  841. }
  842.  
  843. /*POP-UP*/
  844.  
  845. .popup_block{
  846. display:none;
  847. background:#fff;
  848. padding:20px;
  849. border:1px solid #eee; /* if you want a solid white pop-up, delete this */
  850. float:left;
  851. position:fixed;
  852. top:50%;left:50%;
  853. z-index: 99999;
  854. -webkit-box-shadow: 0px 0px 20px #000; /* delete for solid white */
  855. -moz-box-shadow: 0px 0px 20px #000; /* delete for solid white */
  856. box-shadow: 0px 0px 20px #000; /* delete for solid white */
  857. }
  858.  
  859. *html #fade {position: absolute;}
  860. *html .popup_block {position: absolute;}
  861. #fade {
  862. display:none;
  863. position:fixed;
  864. left:0px;
  865. top:0px;
  866. width:100%;
  867. height:100%;
  868. z-index:9999;
  869. background:#fff; /* change to #fff for solid white */
  870. opacity:0.5; /* change to opacity:1; */
  871. }
  872. {CustomCSS}
  873. </style>
  874.  
  875. <script type="text/javascript"
  876. src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.1/jquery.min.js"></script>
  877. <script>
  878. $(document).ready(function() {
  879. //
  880. $('a.poplight[href^=#]').click(function() {
  881. var popID = $(this).attr('rel'); //Get Popup Name
  882. var popURL = $(this).attr('href'); //Get Popup href to define size
  883. var query= popURL.split('?');
  884. var dim= query[1].split('&');
  885. var popWidth = dim[0].split('=')[1]; //Gets the first query string value
  886. $('#' + popID).fadeIn().css({ 'width': Number( popWidth ) }).prepend('<a href="#" class="close"></a>');
  887. var popMargTop = ($('#' + popID).height() + 80) / 2;
  888. var popMargLeft = ($('#' + popID).width() + 80) / 2;
  889. //Apply Margin to Popup
  890. $('#' + popID).css({
  891. 'margin-top' : -popMargTop,
  892. 'margin-left' : -popMargLeft
  893. });
  894. $('body').append('<div id="fade"></div>');
  895. $('#fade').css({'filter' : 'alpha(opacity=80)'}).fadeIn(); //Fade in the fade layer - .css({'filter' : 'alpha(opacity=80)'})
  896. return false;
  897. });
  898. $('a.close, #fade').live('click', function() {
  899. $('#fade , .popup_block').fadeOut(function() {
  900. $('#fade, a.close').remove(); //fade them both out
  901. });
  902. return false;
  903. });
  904. });
  905. </script>
  906.  
  907. </head>
  908. <body>
  909.  
  910. <div class="sidebar">
  911. <div class="sidebarimage">
  912. <div class="sbimg1"><img src="{image:Sidebar 1}"></div>
  913. </div>
  914.  
  915. <div id="icons">
  916. <a href="/" title="{text:Hover 1}"><i class="fa fa-home"></i></a>
  917. <a href="/ask" title="{text:Hover 2}"><i class="fa fa-paper-plane-o"></i></a>
  918. <a href="" title="{text:Hover 3}"><i class="fa fa-list-ul"></i></a>
  919. <a href="" title="{text:Hover 4}"><i class="fa fa-heart-o"></i></a>
  920. <a href="#?w=300" rel="box1" class="poplight" title="{text:Hover 5}"><i class="fa fa-diamond"></i></a>
  921. </div>
  922.  
  923. <div id="description"><span id="dl">{description}</span></div>
  924.  
  925. <!-- updates tab by noveia / bravethemes -->
  926. <div class="kingdom">
  927. <div id="reign">
  928. <div id="queen">
  929. <b>WID</b><br>
  930. your updates here. <!-- change the text here -->
  931. </div>
  932. <div id="queen">
  933. <b>To-Do List</b><br>
  934. your stats here.<!-- change the text here -->
  935. </div>
  936. <!-- if you want more boxes just add <div id="queen"> under this -->
  937. </div>
  938. </div>
  939. </div>
  940.  
  941. <div id="pagination">{block:Pagination}{block:PreviousPage}<a href="{PreviousPage}"> back </a>{/block:PreviousPage}&nbsp;{CurrentPage} of {TotalPages} &nbsp;{block:NextPage}<a href="{NextPage}"> next </a>{/block:NextPage}{/block:Pagination}
  942. </div>
  943. </div>
  944.  
  945.  
  946. <div class="blogtitle">
  947. <span style="font-size:35px; letter-spacing:3px;" id="tit">{Title}</span></div>
  948.  
  949. <div id="box1" class="popup_block">
  950. <pre>TITLE</pre>
  951. <span style="font-size:9px;">write whatever you want to add here, it can be an about, to do, etc.</span>
  952. </div>
  953.  
  954. </div></div></div></div></div></div></div></div></div></div>
  955.  
  956. <div id="entries">
  957. {block:Posts}
  958. <div id="post">
  959.  
  960. {block:Link}<h1><a href="{URL}" {Target}>{Name}</a></h1>{block:Description}{Description}{/block:Description}{/block:Link}
  961.  
  962. {block:Text}
  963. {block:Title}<div class="title1">{Title}</div>{/block:Title}
  964. {Body}
  965. {/block:Text}
  966.  
  967. {block:Photo}
  968. <div class="photo">
  969. {LinkOpenTag}<img src="{PhotoURL-HighRes}" width="100%" />{LinkCloseTag}
  970. </div>{block:Caption}<div class="cap">{Caption}</div>{/block:Caption}
  971. {/block:Photo}
  972.  
  973. {block:Photoset}
  974. <div class="photoset">{Photoset-500}</div>
  975. {block:Caption}<div class="cap">{Caption}</div>{/block:Caption}
  976. {/block:Photoset}
  977.  
  978. {block:Quote}
  979. <div id="quote1">{Quote}</div>
  980. {block:Source}<div class="s">{Source}</div>{/block:Source}
  981. {/block:Quote}
  982.  
  983. {block:Video}
  984. <div class="video">{Video-500}</div>
  985. {block:Caption}<div class="cap">{Caption}</div>{/block:Caption}
  986. {/block:Video}
  987.  
  988.  
  989. {block:Audio}
  990. <div id="audio">
  991. <div id="albumartwork">
  992. {block:AlbumArt}<img src="{AlbumArtURL}" width="80"/>{/block:AlbumArt}</div>
  993. <div id="abox"><div id="audioplayer">{AudioPlayerWhite}</div></div>
  994. <div id="audioinfo">
  995. <li>{block:TrackName}<b>Title:</b> {TrackName}{/block:TrackName}</li>
  996. <li>{block:Artist}<b>By:</b> {Artist}{/block:Artist}</li>
  997. <li>{block:PlayCount}<b>Plays:</b> {FormattedPlayCount}{/block:PlayCount}</li></div></div>{block:Caption}<div class="cap">{Caption}</div>{/block:Caption}
  998. {/block:Audio}
  999.  
  1000. <!--CHAT POST-->
  1001. {block:Chat}
  1002. {block:Title}
  1003. <h1>{Title}</h1>{/block:Title}<br>
  1004. <ul class="convo">{block:Lines}<li class="line_{Alt} user_{UserNumber}">{block:Label}<span class="label"><strong>{Label}</strong></span>{/block:Label}
  1005. {Line}</li>{/block:Lines}</ul>
  1006. {/block:Chat}
  1007.  
  1008. {block:Quote}<div class="quote">“{Quote}”</div>{block:Source} <div class="quotesource">—{Source}</div>{/block:Source}{/block:Quote}
  1009.  
  1010. {block:Answer}<div class="que"><img src="{AskerPortraitURL-24}" style="float:left;">&nbsp;&nbsp; {ASKER}:<br><i>&nbsp;&nbsp; {Question}</i></div><div class="answer">{Answer}</div>{/block:answer}
  1011.  
  1012.  
  1013. <div id="info">
  1014. <a href="{Permalink}" title="{TimeAgo}"><b>{MonthNumberWithZero}/{DayOfMonthWithZero}/{ShortYear} {12HourWithZero}:{Minutes}{CapitalAmPm}</b></a>{/block:Date} —{block:RebloggedFrom} <a href="{ReblogParentURL}">via</a>{/block:RebloggedFrom}
  1015. and {block:ContentSource} <a href="{SourceURL}"><a href="{SourceURL}">source</a>{/block:ContentSource}
  1016. {block:RebloggedFrom} <a href="{ReblogParentURL}" target="_blank"></a>{/block:RebloggedFrom}
  1017. with {NoteCountWithLabel}</a>{block:HasTags}<div id="tags">
  1018. {block:Tags}<i class="fa fa-tag"></i><a href="/tagged/{Tag}">{Tag}</a>{/block:Tags}
  1019. </div>{block:HasTags}
  1020. </div>
  1021. </div>
  1022. {/block:Posts}
  1023. <br><br>{block:PostNotes}<div id="notes"><left>{PostNotes}</div>{/block:PostNotes}</div></div>
  1024. {/block:Posts}</div></div></div>
  1025. <br><br><br><br>
  1026. {/block:Posts}
  1027. </div>
  1028.  
  1029. <div style="position:fixed; font-size:8px; bottom:5px; right:5px; padding:2px;"><a href="http://crayonthemes.tumblr.com" title="theme"><i>thm.</i></a>
  1030. </div>
  1031.  
  1032. </body>
  1033. </div></div></div></div></div></div></div></div></div></div>
  1034. </html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement