thanksamber

Theme 005

May 4th, 2015
9,263
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 22.76 KB | None | 0 0
  1. <!DOCTYPE html>
  2.  
  3. <!-- macfustythemes -->
  4. <head>
  5. <title>{Title}</title>
  6. {block:Description}
  7. <meta name="description" content="{MetaDescription}">
  8. {/block:Description}
  9.  
  10. <meta name="image:Background" content="http://static.tumblr.com/01wstkc/UBxnntg4k/space_ship.png">
  11. <meta name="image:Sidebar" content="http://static.tumblr.com/01wstkc/M7xnntg60/mercury.gif">
  12.  
  13. <meta name="color:Background" content="#000">
  14. <meta name="color:Text" content="#fff">
  15. <meta name="color:Links" content="#27bbf0">
  16. <meta name="color:Hover" content="#000">
  17. <meta name="color:Highlight" content="#27bbf0">
  18. <meta name="color:Sidebar Background" content="#000">
  19. <meta name="color:Nav Links" content="#000">
  20. <meta name="color:Nav Text" content="#fff">
  21. <meta name="text:Posts BG" content="rgba(0, 0, 0, 0.6)">
  22.  
  23. <meta name="text:Link 1 URL" content="/ask">
  24. <meta name="text:Link 1" content="Communications">
  25. <meta name="text:Link 2 URL" content="/">
  26. <meta name="text:Link 2" content="Link 2">
  27. <meta name="text:Link 3 URL" content="/">
  28. <meta name="text:Link 3" content="Link 3">
  29. <meta name="text:Link 4 URL" content="/">
  30. <meta name="text:Link 4" content="Link 4">
  31. <meta name="text:Description Heading" content="Mission Briefing">
  32.  
  33. <link rel="shortcut icon" href="{Favicon}">
  34.  
  35.  
  36. <!-- HTML5 Shiv -->
  37. <!--[if lt IE 9]>
  38. <script src="http://static.tumblr.com/hriofhd/Qj0m8pn7q/html5shiv.js"></script>
  39. <![endif]-->
  40.  
  41. <link href='http://fonts.googleapis.com/css?family=Orbitron' rel='stylesheet' type='text/css'>
  42.  
  43.  
  44. <style>
  45.  
  46. body {
  47. background-color: {color:Background};
  48. background-image: url('{image:Background}');
  49. background-repeat: no-repeat;
  50. background-attachment: fixed;
  51. background-size: cover;
  52. color: {color:Text};
  53. font-size: 11px;
  54. font-family: 'Calibri', sans-serif;
  55. line-height: 18px;
  56. }
  57.  
  58. a {
  59. color: {color:Links};
  60. text-decoration: none;
  61. letter-spacing: 1px;
  62. -moz-transition: all 0.5s ease;
  63. -o-transition: all 0.5s ease;
  64. -webkit-transition: all 0.5s ease;
  65. transition: all 0.5s ease;
  66. }
  67.  
  68. a:hover {
  69. color: {color:Hover};
  70. letter-spacing: 0px;
  71. }
  72.  
  73. blockquote {
  74. border-left: 1px solid {color:Text};
  75. padding: 1% 0 1% 2%;
  76. }
  77.  
  78. .clear {
  79. clear: both;
  80. }
  81.  
  82. #credit {
  83. position: fixed;
  84. bottom: 5px;
  85. right: 10px;
  86. opacity: 0.6;
  87. -moz-transition: all 0.5s ease;
  88. -o-transition: all 0.5s ease;
  89. -webkit-transition: all 0.5s ease;
  90. transition: all 0.5s ease;
  91. }
  92.  
  93. #credit img {
  94. height: 40px;
  95. width: 40px;
  96. }
  97.  
  98. #credit:hover {
  99. opacity: 1;
  100. }
  101.  
  102. li {
  103. list-style-type: square;
  104. }
  105.  
  106. /** SIDEBAR */
  107.  
  108. #sidebar {
  109. position: fixed;
  110. height: 100%;
  111. width: 450px;
  112. left: 0;
  113. top: 0;
  114. }
  115.  
  116. #sidebarbackground {
  117. background-color: {color:Sidebar Background};
  118. position: fixed;
  119. height: 100%;
  120. width: 475px;
  121. opacity: 0.4;
  122. margin-left: 25px;
  123. }
  124. #radar-outer {
  125. position: absolute;
  126. border-radius: 100%;
  127. height: 250px;
  128. width: 250px;
  129. margin: 105px 0 0 50px;
  130. z-index: 1;
  131. }
  132.  
  133. #radar-outer img {
  134. height: 100%;
  135. }
  136.  
  137. #radar-inner {
  138. border-radius: 100%;
  139. position: absolute;
  140. height: 125px;
  141. width: 125px;
  142. margin: 163px 0 0 115px;
  143. overflow: hidden;
  144. opacity: 0.6;
  145. }
  146.  
  147. #radar-inner img {
  148. height: 100%;
  149. width: 100%;
  150. }
  151.  
  152. #nav ul {
  153. font-family: 'Orbitron', sans-serif;
  154. font-size: 12px;
  155. padding: 0;
  156. margin-left: 260px;
  157. }
  158.  
  159. #nav {
  160. position: absolute;
  161. margin-top: 100px;
  162. text-transform: lowercase;
  163. }
  164.  
  165. #nav ul li {
  166. position: relative;
  167. height: 14px;
  168. list-style-type: none;
  169. text-align: right;
  170. width: 125px;
  171. padding: 3px 5px 3px 30px;
  172. opacity: 0.8;
  173. background-color: #fff;
  174. box-shadow: 0 0 12px {color:Highlight};
  175. -moz-transition: all 0.5s ease;
  176. -o-transition: all 0.5s ease;
  177. -webkit-transition: all 0.5s ease;
  178. transition: all 0.5s ease;
  179. }
  180.  
  181. #nav ul li.one {
  182. margin: 30px 0 0 -12px;
  183. }
  184.  
  185. #nav ul li.two {
  186. margin: 21px 0 0 20px;
  187. }
  188.  
  189. #nav ul li.three {
  190. margin: 21px 0 0 25px;
  191. }
  192.  
  193. #nav ul li.four {
  194. margin: 21px 0 0 22px;
  195. }
  196.  
  197. #nav ul li.five {
  198. margin: 21px 0 0 0;
  199. }
  200.  
  201. #nav a {
  202. letter-spacing: 1px;
  203. color: {color:Links};
  204. }
  205.  
  206. #nav ul a {
  207. color: {color:Nav Links};
  208. }
  209.  
  210. #nav ul li:hover {
  211. background-color: {color:Highlight};
  212. width: 150px;
  213. }
  214.  
  215. #nav ul li::after {
  216. content: "";
  217. position: absolute;
  218. width: 0;
  219. height: 0;
  220. top: 0;
  221. margin-left: 5px;
  222. border-style: solid;
  223. border-width: 20px 0 0 20px;
  224. border-color: transparent transparent transparent #fff;
  225. -moz-transition: all 0.5s ease;
  226. -o-transition: all 0.5s ease;
  227. -webkit-transition: all 0.5s ease;
  228. transition: all 0.5s ease;
  229. }
  230.  
  231. #nav ul li:hover::after {
  232. border-color: transparent transparent transparent {color:Highlight};
  233. }
  234.  
  235. #desc {
  236. position: relative;
  237. margin: 360px 0 0 75px;
  238. height: 200px;
  239. width: 200px;
  240. border-right: 3px solid #fff;
  241. color: {color:Nav Text};
  242. opacity: 0.8;
  243. overflow: hidden;
  244. padding: 10px;
  245. text-align: justify;
  246. }
  247.  
  248. #line {
  249. width: 40px;
  250. border-bottom: 3px solid #fff;
  251. margin: 13px 0 0 264px;
  252. transform: rotate(-50deg);
  253. opacity: 0.8;
  254. }
  255.  
  256. #mtitle {
  257. font-family: 'Orbitron', sans-serif;
  258. text-align: right;
  259. padding: 5px 0 5px 0;
  260. font-size: 16px;
  261. border-bottom: 2px solid #fff;
  262. color: {color:Highlight};
  263. text-transform: lowercase;
  264. margin-bottom: 2px;
  265. }
  266.  
  267. #spaceship {
  268. position: relative;
  269. float: right;
  270. width: 125px;
  271. height: 200px;
  272. margin: -190px 10px 0 0;
  273. opacity: 0.8;
  274.  
  275. }
  276.  
  277. #power ul {
  278. position: absolute;
  279. bottom: 40px;
  280. padding: 0;
  281. width: 25px;
  282. color: {color:Nav Text};
  283. font-family: 'Orbitron', sans-serif;
  284. text-transform: lowercase;
  285. text-align: center;
  286.  
  287. }
  288.  
  289.  
  290. #power ul.two {
  291. margin-left: 50px;
  292. }
  293.  
  294. #power ul li.hover {
  295. -moz-transition: all 0.2s ease;
  296. -o-transition: all 0.2s ease;
  297. -webkit-transition: all 0.2s ease;
  298. transition: all 0.2s ease;
  299. }
  300.  
  301. #power ul.two li.hover {
  302. opacity: 0;
  303. }
  304.  
  305. #power ul.three {
  306. margin-left: 100px;
  307. }
  308.  
  309. #spaceship:hover > #power ul.one li.hover {
  310. opacity: 0;
  311. }
  312.  
  313. #spaceship:hover > #power ul.two li.hover {
  314. opacity: 1;
  315. }
  316.  
  317. #spaceship:hover > #power ul.three li.hover {
  318. opacity: 0;
  319. }
  320.  
  321. #power ul li {
  322. float: left;
  323. list-style-type: none;
  324. width: 30px;
  325. height: 3px;
  326. background-color: {color:Highlight};
  327. margin: 0 0 5px 10px;
  328. box-shadow: 0 0 3px #fff;
  329. }
  330.  
  331. #power ul li.label {
  332. background-color: transparent;
  333. box-shadow: none;
  334. }
  335.  
  336. #power ul li a {
  337. color: {color:Nav Text};
  338. }
  339.  
  340. #pagination {
  341. position: absolute;
  342. bottom: 30px;
  343. width: 150px;
  344. text-align: center;
  345. font-family: 'Orbitron', sans-serif;
  346. text-transform: lowercase;
  347. }
  348.  
  349. /** POSTS */
  350. #content {
  351. width: 640px;
  352. margin: 75px 0 0 625px;
  353. }
  354.  
  355. .post {
  356. position: relative;
  357. width: 500px;
  358. padding: 20px;
  359. margin: 0 0 50px 0;
  360. text-align: justify;
  361. background-color: {text:Posts BG};
  362. }
  363.  
  364.  
  365. .post img {
  366. max-width: 100%;
  367. }
  368.  
  369. .ptitle {
  370. font-family: 'Orbitron', sans-serif;
  371. text-transform: lowercase;
  372. text-align: right;
  373. font-size: 22px;
  374. padding-bottom: 10px;
  375. border-bottom: 1px solid {color:Text};
  376. color: {color:Links};
  377. margin-bottom: 10px;
  378. }
  379.  
  380. .pquote {
  381. font-family: 'Orbitron', sans-serif;
  382. text-transform: lowercase;
  383. text-align: right;
  384. font-size: 20px;
  385. padding-bottom: 10px;
  386. color: {color:Links};
  387. }
  388.  
  389. .pquote a {
  390. color: {color:Links};
  391. }
  392.  
  393. .pquote a:hover {
  394. color: {color:Text};
  395. }
  396.  
  397. .label {
  398. font-family: 'Orbitron', sans-serif;
  399. text-transform: lowercase;
  400. color: {color:Links};
  401. }
  402. .right {
  403. text-align: right;
  404. }
  405.  
  406. .icon-outer {
  407. border: 10px solid #fff;
  408. width: 90px;
  409. height: 90px;
  410. border-radius: 100%;
  411. opacity: 0.8;
  412. }
  413.  
  414. .icon-inner {
  415. width: 60px;
  416. height: 60px;
  417. padding: 5px;
  418. border: 5px solid #001b37;
  419. border-radius: 100%;
  420. margin: 5px 0 0 5px;
  421. }
  422.  
  423. .icon-inner img {
  424. border-radius: 100%;
  425. width: 100%;
  426. height: 100%;
  427. }
  428.  
  429. .player {
  430. position: relative;
  431. opacity: 0.8;
  432. float: left;
  433. margin: -70px 0 0 108px;
  434. }
  435.  
  436. .player::after {
  437. content: "";
  438. position: absolute;
  439. width: 0;
  440. height: 0;
  441. top: 0;
  442. right: -27px;
  443. margin-left: 5px;
  444. border-style: solid;
  445. border-width: 27px 0 0 27px;
  446. border-color: transparent transparent transparent #fff;
  447. }
  448.  
  449. .track {
  450. float: left;
  451. margin: -40px 0 0 115px;
  452. }
  453.  
  454. .footer {
  455. position: relative;
  456. font-family: 'Orbitron', sans-serif;
  457. width: 555px;
  458. margin: 10px 0 0 -25px;
  459. background-color: #fff;
  460. text-align: center;
  461. opacity: 0.8;
  462. color: {color:Nav Links};
  463. font-size: 10px;
  464. text-transform: lowercase;
  465. }
  466.  
  467. .footer a {
  468. color: {color:Nav Links};
  469. }
  470.  
  471. .footer a:hover {
  472. color: {color:Hover};
  473. }
  474.  
  475. .footer::before {
  476. content: "";
  477. position: absolute;
  478. width: 0;
  479. height: 0;
  480. top: 0px;
  481. left: -18px;
  482. border-style: solid;
  483. border-width: 0 0 18px 18px;
  484. border-color: transparent transparent #fff; transparent;
  485. }
  486.  
  487. .tags {
  488. margin-top: 10px;
  489. text-align: center;
  490. text-transform: lowercase;
  491. }
  492.  
  493. .qicon-outer {
  494. float: left;
  495. border: 10px solid #fff;
  496. width: 100px;
  497. height: 100px;
  498. border-radius: 100%;
  499. opacity: 0.8;
  500. margin: -30px 0 0 -30px;
  501. }
  502.  
  503. .qicon-inner {
  504. width: 70px;
  505. height: 70px;
  506. padding: 5px;
  507. border: 5px solid #001b37;
  508. border-radius: 100%;
  509. margin: 5px 0 0 5px;
  510. }
  511.  
  512. .qicon-inner img {
  513. border-radius: 100%;
  514. width: 100%;
  515. height: 100%;
  516. }
  517.  
  518. .ask {
  519. width: 350px;
  520. padding: 5px 10px;
  521. background-color: #fff;
  522. opacity: 0.8;
  523. font-family: 'Orbitron', sans-serif;
  524. text-transform: lowercase;
  525. margin: 16px 0 0 88px;
  526. color: {color:Nav Links};
  527. height: 18px;
  528. overflow: hidden;
  529. }
  530.  
  531. .ask a {
  532. color: {color:Nav Links};
  533. }
  534.  
  535. .ask a:hover {
  536. color: {color:Highlight};
  537. }
  538.  
  539. .question {
  540. float: left;
  541. margin-top: 0px;
  542. width: 346px;
  543. padding: 10px;
  544. border-bottom: 1px solid #fff;
  545. }
  546.  
  547. .ask::after {
  548. content: "";
  549. position: absolute;
  550. width: 0;
  551. height: 0;
  552. top: 36px;
  553. right: 33px;
  554. margin-left: 5px;
  555. border-style: solid;
  556. border-width: 28px 0 0 29px;
  557. border-color: transparent transparent transparent #fff;
  558. }
  559.  
  560. .answer {
  561. text-align: justify;
  562. width: 450px;
  563. }
  564.  
  565. .datei {
  566. position: relative;
  567. float: right;
  568. opacity: 0.7;
  569. text-shadow: 2px 2px 8px #000;
  570. text-align: center;
  571. }
  572.  
  573. .day {
  574. width: 20px;
  575. position: absolute;
  576. margin: -74px 0 0 39px;
  577. font-family: 'Orbitron', sans-serif;
  578. font-size: 16px;
  579. }
  580.  
  581. .month {
  582. margin-left: -7px;
  583. }
  584.  
  585. .datei a {
  586. color: {color:Nav Text};
  587. }
  588.  
  589. .datei a:hover {
  590. letter-spacing: 1px;
  591. color: {color:Links};
  592. }
  593.  
  594. .dateibg {
  595. position: absolute;
  596. float: right;
  597. opacity: 0.7;
  598. text-shadow: 2px 2px 8px #000;
  599. text-align: center;
  600. width: 40px;
  601. height: 40px;
  602. background-color: #000;
  603. opacity: 0.5;
  604. border-radius: 100%;
  605. margin: 28px 0 0 29px;
  606.  
  607. }
  608.  
  609.  
  610. </style>
  611. </head>
  612. <body>
  613. <div id="credit"><a target="new" href="http://macfustythemes.tumblr.com/"><img src="http://static.tumblr.com/01wstkc/Cm0nnsgaq/rocket.png"></a></div>
  614. <!-- SIDEBAR -->
  615. <div id="sidebarbackground"></div>
  616. <div id="sidebar">
  617. <div id="radar-outer">
  618. <img src="http://static.tumblr.com/01wstkc/gHunnotgp/radar.png">
  619. </div>
  620. <div id="radar-inner"><img src="{image:Sidebar}"></div>
  621.  
  622. <div id="nav">
  623. <ul>
  624. <a href="/"><li class="one">initiate
  625. <div class="triangle"></div>
  626. </li></a>
  627. {block:ifLink1Url}
  628.  
  629. <a href="{text:Link 1 URL}"><li class="two">{text:Link 1}
  630. </li></a>
  631. {/block:ifLink1Url}
  632. {block:ifLink2Url}
  633. <a href="{text:Link 2 URL}"><li class="three">{text:Link 2}</li></a>
  634. {/block:ifLink2Url}
  635. {block:ifLink3Url}
  636. <div class="link3"><i></i></div>
  637. <a href="{text:Link 3 URL}"><li class="four">{text:Link 3}</li></a>
  638. {/block:ifLink3Url}
  639. {block:ifLink4Url}
  640. <div class="link4"><i></i></div>
  641. <a href="{text:Link 4 URL}"><li class="five">{text:Link 4}</li></a>
  642. {/block:ifLink4Url}
  643. </ul>
  644. </div>
  645. <div id="desc">
  646. <div id="mtitle">{text:Description Heading}</div>
  647. {Description}
  648. </div>
  649. <div id="line"></div>
  650. <div id="spaceship">
  651. <div id="power">
  652. <ul class="one">
  653. <li class="hover"></li>
  654. <li class="hover"></li>
  655. <li class="hover"></li>
  656. <li class="hover"></li>
  657. <li class="hover"></li>
  658. <li class="hover"></li>
  659. <li class="hover"></li>
  660. <li class="hover"></li>
  661. <li class="hover"></li>
  662. <li class="hover"></li>
  663. <li class="hover"></li>
  664. <li></li>
  665. <li></li>
  666. <li></li>
  667. <li></li>
  668. <li></li>
  669. <li></li>
  670. &nbsp;&nbsp;power
  671. </ul>
  672. <ul class="two">
  673. <li class="hover"></li>
  674. <li class="hover"></li>
  675. <li class="hover"></li>
  676. <li class="hover"></li>
  677. <li class="hover"></li>
  678. <li class="hover"></li>
  679. <li class="hover"></li>
  680. <li class="hover"></li>
  681. <li class="hover"></li>
  682. <li class="hover"></li>
  683. <li></li>
  684. <li></li>
  685. <li></li>
  686. <li></li>
  687. <li></li>
  688. <li></li>
  689. <li></li>
  690. &nbsp;shields
  691. </ul>
  692. <ul class="three">
  693. <li class="hover"></li>
  694. <li class="hover"></li>
  695. <li class="hover"></li>
  696. <li class="hover"></li>
  697. <li></li>
  698. <li></li>
  699. <li></li>
  700. <li></li>
  701. <li></li>
  702. <li></li>
  703. <li></li>
  704. <li></li>
  705. <li></li>
  706. &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;hull
  707. </ul>
  708. </div>
  709. <div id="pagination">
  710. {block:PreviousPage}
  711. <a href="{PreviousPage}">&laquo;</a>
  712. {/block:PreviousPage}
  713. {block:JumpPagination length="4"}
  714. {block:CurrentPage}
  715. <a href="{Url}">0{PageNumber}</a>&nbsp;
  716. {/block:CurrentPage}
  717. {block:JumpPage}
  718. <a href="{Url}">0{PageNumber}</a>&nbsp;
  719. {/block:JumpPage}
  720. {/block:JumpPagination}
  721. {block:NextPage}
  722. <a href="{NextPage}">&raquo;</a>
  723. {/block:NextPage}
  724. </div>
  725. </div>
  726. </div>
  727. <!-- POSTS -->
  728. <div id="content">
  729. {block:Posts}
  730. <div class="datei">
  731. <div class="dateibg"></div>
  732. <a href="{Permalink}"><img src="http://static.tumblr.com/01wstkc/wH4nntfvs/date_icon.png">
  733. <div class="day">
  734. {DayofMonthWithZero}
  735. <div class="month">
  736. {ShortMonth}
  737. </div>
  738. </div></a>
  739. </div>
  740. <div class="post">
  741. {block:Text}
  742. {block:Title}<div class="ptitle">{Title}</div>{/block:Title}
  743. {Body}
  744. {/block:Text}
  745.  
  746. {block:Photo}
  747. <img src="{PhotoUrl-500}">
  748. {block:Caption}{Caption}{/block:Caption}
  749. {/block:Photo}
  750.  
  751. {block:Photoset}
  752. {Photoset-500}
  753. {block:Caption}{Caption}{/block:Caption}
  754. {/block:Photoset}
  755.  
  756. {block:Quote}
  757. <div class="pquote">{Quote}</div>
  758. {block:Source}<div class="right">{Source}</div>{/block:Source}
  759. {block:Quote}
  760.  
  761. {block:Link}
  762. <div class="pquote"><a href="{Url}">{Name}</a></div>
  763. {block:Description}{Description}{/block:Description}
  764. {/block:Link}
  765.  
  766. {block:Chat}
  767. {block:Title}<div class="ptitle">{Title}</div>{/block:Title}
  768. {block:Lines}
  769. {block:Label}
  770. <div class="label">{Label}</div>
  771. {/block:Label}
  772. {Line}
  773. {/block:Lines}
  774. {/block:Chat}
  775.  
  776. {block:Audio}
  777. <div class="icon-outer">
  778. <div class="icon-inner">
  779. {block:AlbumArt}
  780. <img src="{AlbumArtURL}">
  781. {/block:AlbumArt}
  782. </div>
  783. </div>
  784. <div class="player">{AudioPlayer}</div>
  785. <div class="track">{block:TrackName}{TrackName}{/block:TrackName} - {block:Artist}{Artist}{/block:Artist}</div>
  786. <div class="clear"></div>
  787. {block:Caption}{Caption}{/block:Caption}
  788. {/block:Audio}
  789.  
  790. {block:Video}
  791. {Video-500}
  792. {block:Caption}{Caption}{/block:Caption}
  793. {/block:Video}
  794.  
  795. {block:Answer}
  796. <div class="qicon-outer">
  797. <div class="qicon-inner">
  798. <img src="{AskerPortraitURL-64}">
  799. </div>
  800. </div>
  801. <div class="ask">incoming communication from {Asker}:</div>
  802. <div class="question">{Question}</div>
  803. <div class="clear"></div>
  804. <div class="answer">{Answer}</div>
  805. {/block:Answer}
  806. <div class="footer">
  807. <a href="{Permalink}">{NoteCountWithLabel}</a>
  808. {block:RebloggedFrom}
  809. - Origin: <a href="{ReblogParentUrl}">{ReblogParentName}</a>
  810. {/block:RebloggedFrom}
  811. </div>
  812. {block:HasTags}
  813. <div class="tags">
  814. {block:Tags}
  815. <a href="{TagURL}">#{Tag}</a>&nbsp;
  816. {/block:Tags}
  817. </div>
  818. {/block:HasTags}
  819. </div>
  820. {block:Postnotes}
  821. {PostNotes}
  822. {/block:Postnotes}
  823. {/block:Posts}
  824. </div>
  825.  
  826. </body>
  827. </html>
Advertisement
Add Comment
Please, Sign In to add comment