API tools faq
paste
neothm

#09 ELECTRIC

neothm
Sep 6th, 2015
5,963
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 36.95 KB | None | 0 0
raw download clone embed print report
  1. <!DOCTYPE html>
  2. <html lang="en">
  3. <!--
  4. #09 ELECTRIC by Neo
  5. Find me on tumblr: @NEOTHM | @NEOVAK
  6. If you need help/spotted a glitch, feel free to message me!
  7. Thank you for taking an interest in this code. Enjoy. ♡
  8. -->
  9.  
  10. <head>
  11. <meta charset="utf-8">
  12. <title>{block:PostTitle}{PostTitle} | {/block:PostTitle}{Title}</title>
  13. {block:Description}<meta name="description" content="{MetaDescription}">{/block:Description}
  14. <link rel="shortcut icon" hre f="{Favicon}">
  15. <link rel="altertnate" type="application/rss+xml" href="{RSS}">
  16. <link href='//fonts.googleapis.com/css?family=Lato:300,400,700|Montserrat:400,700|Inconsolata:400,700|Quattrocento+Sans:400,700|Roboto:300,500,700' rel='stylesheet' type='text/css'>
  17. <link rel="stylesheet" href="//code.ionicframework.com/ionicons/2.0.1/css/ionicons.min.css">
  18. <link rel="stylesheet" href="http://static.tumblr.com/wgg6svp/dSSnw0j95/style.css">
  19. <link rel="stylesheet" href="http://static.tumblr.com/wgg6svp/jSmnqcghc/normalizer.css">
  20. <link rel="stylesheet" href="http://static.tumblr.com/xfxohnq/ZZQnh9hqr/moderne_sans.css">
  21. <meta name="image:Logo" content="">
  22. <meta name="image:PageBackground" content="">
  23. <meta name="image:Header" content="">
  24. <meta name="image:SidebarOne" content="">
  25. <meta name="image:SidebarTwo" content="">
  26. <meta name="image:SidebarThree" content="">
  27. <meta name="image:SidebarFour" content="">
  28. <meta name="image:SidebarFive" content="">
  29. <meta name="text:HeaderHeight" content="250px">
  30. <meta name="if:FullSizeBackground" content="1">
  31. <meta name="if:LatestUpdates" content="1">
  32. <meta name="if:LightVersion" content="0">
  33. <meta name="if:LeftSidebar" content="1">
  34. <meta name="if:OverlappingSidebarContent" content="1">
  35. <meta name="if:DropdownLinks" content="1">
  36. <meta name="if:Link1" content="1">
  37. <meta name="if:Link2" content="1">
  38. <meta name="if:Link3" content="1">
  39. <meta name="if:Link4" content="1">
  40.  
  41. <meta name="color:PageBackground" content="#000">
  42. <meta name="color:BlogTitle" content="#333333">
  43. <meta name="color:PostsBackground" content="#2B2B2B">
  44. <meta name="text:DropdownMenu" content="Dropdown Links">
  45. <meta name="text:DropdownLink1URL" content="/">
  46. <meta name="text:DropdownLink1Name" content="Link 1">
  47. <meta name="text:DropdownLink2URL" content="/">
  48. <meta name="text:DropdownLink2Name" content="Link 2">
  49. <meta name="text:DropdownLink3URL" content="/">
  50. <meta name="text:DropdownLink3Name" content="Link 3">
  51.  
  52. <meta name="text:Link1URL" content="/">
  53. <meta name="text:Link1Name" content="Link 1">
  54. <meta name="text:Link2URL" content="/">
  55. <meta name="text:Link2Name" content="Link 2">
  56. <meta name="text:Link3URL" content="/">
  57. <meta name="text:Link3Name" content="Link 3">
  58. <meta name="text:Link4URL" content="/">
  59. <meta name="text:Link4Name" content="Link 4">
  60.  
  61. <meta name="text:Update1URL" content="/">
  62. <meta name="text:Update1Name" content="Update 1">
  63. <meta name="text:Update2URL" content="/">
  64. <meta name="text:Update2Name" content="Update 2">
  65. <meta name="text:Update3URL" content="/">
  66. <meta name="text:Update3Name" content="Update 3">
  67. <meta name="text:Update4URL" content="/">
  68. <meta name="text:Update4Name" content="Update 4">
  69. <meta name="text:Update5URL" content="/">
  70. <meta name="text:Update5Name" content="Update 5">
  71.  
  72. <meta name="color:Links" content="#aaa">
  73. <meta name="color:LinksHover" content="#000">
  74.  
  75. <meta name="text:DateOfCreation" content="">
  76. <meta name="text:OnlineUsersCounter" content="">
  77. <meta name="text:VisitCounter" content="">
  78.  
  79. <meta name="text:Info1Name" content="">
  80. <meta name="text:Info1" content="">
  81. <meta name="text:Info2Name" content="">
  82. <meta name="text:Info2" content="">
  83. <meta name="text:Info3Name" content="">
  84. <meta name="text:Info3" content="">
  85. <meta name="text:Info4Name" content="">
  86. <meta name="text:Info4" content="">
  87. <meta name="text:Info5Name" content="">
  88. <meta name="text:Info5" content="">
  89. <meta name="text:ReadMoreURL" content="">
  90. <meta name="text:ReadMoreName" content="">
  91. <meta name="text:UpcomingActivity1" content="">
  92. <meta name="text:UpcomingActivity2" content="">
  93. <meta name="text:UpcomingActivity3" content="">
  94. <meta name="text:UpcomingActivity4" content="">
  95.  
  96. <meta name="select:Font" content="'Lato'" title="Lato">
  97. <meta name="select:Font" content="'Montserrat'" title="Montserrat">
  98. <meta name="select:Font" content="'Inconsolata'" title="Inconsolata">
  99. <meta name="select:Font" content="'Quattrocento Sans'" title="Quattrocento Sans">
  100. <meta name="select:Font" content="'Roboto'" title="Roboto">
  101.  
  102.  
  103.  
  104. <meta name="select:NextPage" content="pagi" title="Pagination">
  105. <meta name="select:NextPage" content="loadmorebtn" title="Load more button">
  106. <meta name="select:NextPage" content="ifntscroll" title="Infinite Scroll">
  107.  
  108. <style type="text/css">
  109. *{
  110. margin:0;
  111. padding:0;
  112. }
  113. ::selection{
  114. background-color:#000;
  115. color:#fff;
  116. }
  117. ::-moz-selection{
  118. background-color:#000;
  119. color:#fff;
  120. }
  121. ::-webkit-scrollbar{
  122. width:11px;
  123. height:11px;
  124. {block:IfLightVersion}
  125. background-color:#fff;
  126. {/block:IfLightVersion}
  127. {block:IfNotLightVersion}
  128. background-color:#000;
  129. {/block:IfNotLightVersion}
  130. }
  131. ::-webkit-scrollbar-track{
  132. {block:IfLightVersion}
  133. border:5px solid #fff;
  134. background-color: #fff;
  135. {/block:IfLightVersion}
  136. {block:IfNotLightVersion}
  137. border:5px solid #000;
  138. background-color: #000;
  139. {/block:IfNotLightVersion}
  140. }
  141. ::-webkit-scrollbar-thumb{
  142. {block:IfLightVersion}
  143. border:5px solid #fff;
  144. background-color: #aaa;
  145. {/block:IfLightVersion}
  146. {block:IfNotLightVersion}
  147. border:5px solid #000;
  148. background-color: #fff;
  149. {/block:IfNotLightVersion}
  150. }
  151. #infscr-loading{
  152. display:none!important;
  153. }
  154. .vignette{
  155. background:transparent none!important;
  156. }
  157. .tmblr-lightbox img {
  158. border-radius:10px!important;
  159. box-shadow:0px 0px 5px rgba(100,100,100,.8)!important;
  160. }
  161. .tmblr-lightbox {
  162. background-color:rgba(255,255,255,.8)!important;
  163. }
  164. img{
  165. max-width:100%;
  166. height:auto;
  167. }
  168. .tmblr-iframe.iframe-controls--desktop{
  169. {block:IfLightVersion}
  170. filter:invert(100%);
  171. -webkit-filter:invert(100%);
  172. -moz-filter:invert(100%);
  173. -ms-filter:invert(100%);
  174. -o-filter:invert(100%);
  175. {/block:IfLightVersion}
  176. transform:scale(.8, .8);
  177. -webkit-transform:scale(.8, .8);
  178. -moz-transform:scale(.8, .8);
  179. top:10px;
  180. right:0px;
  181. position:fixed;
  182. opacity:.7;
  183. transition-duration:.3s;
  184. -webkit-transition-duration:.3s;
  185. -moz-transition-duration:.3s;
  186. -ms-transition-duration:.3s;
  187. -o-transition-duration:.3s;
  188. z-index:999999999999999999!important;
  189. }
  190.  
  191. .tmblr-iframe.iframe-controls--desktop:hover{
  192. opacity:1;
  193. transition-duration:.3s;
  194. -webkit-transition-duration:.3s;
  195. -moz-transition-duration:.3s;
  196. -ms-transition-duration:.3s;
  197. -o-transition-duration:.3s;
  198. }
  199. #s-m-t-tooltip{
  200. line-height:100%;
  201. font-size:8px;
  202. text-transform:uppercase;
  203. text-align:center;
  204. letter-spacing:1px;
  205. max-width:100px;
  206. z-index:9999!important;
  207. padding:5px;
  208. margin:15px;
  209. background-color:#fff;
  210. border:1px solid #eee;
  211. color:#000;
  212. }
  213.  
  214. html, body{
  215. height:100%;
  216. }
  217. body{
  218. text-align:justify;
  219. font:lighter 12px/170% 'Moderne Sans', sans-serif;
  220. color:#444;
  221. background-color:#fff;
  222. -webkit-font-smoothing: antialiased;
  223. -moz-osx-font-smoothing: grayscale;
  224. background:{color:PageBackground} url('{image:PageBackground}');
  225. {block:IfFullSizeBackground}
  226. background-size:cover;
  227. background-attachment:fixed;
  228. {/block:IfFullSizeBackground}
  229. }
  230. a{
  231. color:{color:Links};
  232. text-decoration:none;
  233. }
  234. a:hover{
  235. color:{color:LinksHover};
  236. }
  237. a, a:hover{
  238. cursor:pointer!important;
  239. }
  240. a, a:hover,
  241. li, li:hover,
  242. :before, :hover:before,
  243. :after, :hover:after{
  244. transition-duration:.3s;
  245. -webkit-transition-duration:.3s;
  246. -moz-transition-duration:.3s;
  247. -ms-transition-duration:.3s;
  248. -o-transition-duration:.3s;
  249. }
  250. header,
  251. #smthg,
  252. nav,
  253. main,
  254. footer{
  255. width:900px;
  256. position:relative;
  257. margin:0 auto;
  258. }
  259. header{
  260. height:300px;
  261. {block:IfNotLightVersion}
  262. background-color:#000;
  263. {/block:IfNotLightVersion}
  264. {block:IfLightVersion}
  265. background-color:#fff;
  266. {/block:IfLightVersion}
  267. overflow:hidden;
  268. }
  269. #updates{
  270. {block:IfNotLightVersion}
  271. background:#000 url('http://static.tumblr.com/wgg6svp/Jonnu93q7/black.png');
  272. {/block:IfNotLightVersion}
  273. {block:IfLightVersion}
  274. background:#fff url('http://s1.postimg.org/4qgbhptpn/bg_332887.png');
  275. {/block:IfLightVersion}
  276. }
  277. #updates,
  278. section{
  279. width:600px;
  280. }
  281. header > img{
  282. width:290px;
  283. height:290px;
  284. margin:5px;
  285. }
  286. header > img,
  287. aside{
  288. display:block;
  289. {block:IfNotLightVersion}
  290. background-color:#000;
  291. {/block:IfNotLightVersion}
  292. {block:IfLightVersion}
  293. background-color:#fff;
  294. {/block:IfLightVersion}
  295. }
  296. #updates{
  297. height:300px;
  298. }
  299. header > img, #updates,
  300. aside, section{
  301. {block:IfNotLeftSidebar}float:left;{/block:IfNotLeftSidebar}
  302. {block:IfLeftSidebar}float:right;{/block:IfLeftSidebar}
  303. }
  304. h2{
  305. padding:0 20px;
  306. text-transform:uppercase;
  307. letter-spacing:4px;
  308. word-spacing:7px;
  309. {block:IfNotLightVersion}
  310. color:#888;
  311. background-color:#000;
  312. {/block:IfNotLightVersion}
  313. {block:IfLightVersion}
  314. color:#ccc;
  315. background-color:#fff;
  316. {/block:IfLightVersion}
  317. line-height:40px;
  318. margin:10px 0 0;
  319. }
  320. h2 i{
  321. font-size:27px;
  322. vertical-align:-3px;
  323. margin-right:5px;
  324. }
  325. #updates ul{
  326. text-transform:uppercase;
  327. letter-spacing:1px;
  328. padding:20px 0 0 30px;
  329. height:100%;
  330. }
  331. #updates a, #updates a:hover{
  332. {block:IfNotLightVersion}
  333. color:#fff;
  334. {/block:IfNotLightVersion}
  335. {block:IfLightVersion}
  336. color:#888;
  337. {/block:IfLightVersion}
  338. }
  339. #updates li{
  340. margin-bottom:5px;
  341. list-style-type:none;
  342. padding:10px;
  343. font-size:10px;
  344. }
  345. #updates a:hover,
  346. #updates li:hover a{
  347. color:#444;
  348. }
  349. #updates li:hover{
  350. cursor:pointer!important;
  351. }
  352. #updates li:hover,
  353. nav,
  354. footer{
  355. {block:IfNotLightVersion}
  356. background-color:#000;
  357. {/block:IfNotLightVersion}
  358. {block:IfLightVersion}
  359. background-color:#fff;
  360. {/block:IfLightVersion}
  361. }
  362.  
  363. nav,
  364. h1,
  365. footer,
  366. .readmore,
  367. h4,
  368. h3 a,
  369. .perma{
  370. text-align:center;
  371. text-transform:uppercase;
  372. letter-spacing:1px;
  373. }
  374. nav{
  375. line-height:50px;
  376. font-size:11px;
  377. z-index:999;
  378. position:relative;
  379. }
  380. nav li{
  381. list-style-type:none;
  382. display:inline-block;
  383. margin:0 20px;
  384. position:relative;
  385. }
  386. nav li a{
  387. {block:IfNotLightVersion}
  388. color:#fff;
  389. {/block:IfNotLightVersion}
  390. {block:IfLightVersion}
  391. color:#000;
  392. {/block:IfLightVersion}
  393. }
  394.  
  395. nav li a:hover,
  396. footer a:hover{
  397. {block:IfNotLightVersion}
  398. color:#444;
  399. {/block:IfNotLightVersion}
  400. {block:IfLightVersion}
  401. color:#ccc;
  402. {/block:IfLightVersion}
  403. }
  404. .dropdown ul{
  405. width:calc(100% + 40px);
  406. position:absolute;
  407. top:45px;
  408. left:-20px;
  409. line-height:35px;
  410. {block:IfNotLightVersion}
  411. background-color:#000;
  412. {/block:IfNotLightVersion}
  413. {block:IfLightVersion}
  414. background-color:#fff;
  415. {/block:IfLightVersion}
  416. max-height:0px;
  417. overflow:hidden;
  418. transition-duration:.3s;
  419. -webkit-transition-duration:.3s;
  420. -moz-transition-duration:.3s;
  421. -ms-transition-duration:.3s;
  422. -o-transition-duration:.3s;
  423. }
  424. .dropdown:hover ul{
  425. max-height:200px;
  426. overflow:hidden;
  427. transition-duration:.3s;
  428. -webkit-transition-duration:.3s;
  429. -moz-transition-duration:.3s;
  430. -ms-transition-duration:.3s;
  431. -o-transition-duration:.3s;
  432. }
  433. .dropdown > a:after{
  434. margin-left:10px;
  435. content: "\f3d0";
  436. display: inline-block;
  437. font-family: "Ionicons";
  438. }
  439. .dropdown:hover > a:after{
  440. content: "\f3d8";
  441. }
  442. .dropdown li{
  443. margin:5px 0;
  444. display:block;
  445. width:100%;
  446. }
  447. .dropdown li:before{
  448. content:"";
  449. position:absolute;
  450. top:0;
  451. left:0;
  452. right:0;
  453. margin:auto;
  454. width:50%;
  455. height:1px;
  456. {block:IfNotLightVersion}
  457. background-color:rgba(255, 255, 255, .6);
  458. {/block:IfNotLightVersion}
  459. {block:IfLightVersion}
  460. background-color:rgba(150, 150, 150, .2);
  461. {/block:IfLightVersion}
  462. }
  463. .dropdown li:hover:before{
  464. width:100%;
  465. }
  466. .fixed{
  467. position:fixed;
  468. left:0;
  469. right:0;
  470. top:0;
  471. margin:auto;
  472. }
  473. #smthg{
  474. background:#000 url('{image:Header}');
  475. background-size:cover;
  476. background-position:center;
  477. overflow:hidden;
  478. height:{text:HeaderHeight};
  479. }
  480.  
  481. #smthg h1{
  482. display:block;
  483. color:{color:BlogTitle};
  484. {block:IfNotLightVersion}
  485. background-color:rgba(0,0,0,.7);
  486. {/block:IfNotLightVersion}
  487. {block:IfLightVersion}
  488. background-color:rgba(255,255,255,.7);
  489. {/block:IfLightVersion}
  490. line-height:70px;
  491. position:absolute;
  492. bottom:0;
  493. left:0;
  494. right:0;
  495. }
  496.  
  497. footer{
  498. overflow:hidden;
  499. padding:40px 0;
  500. {block:IfNotLightVersion}
  501. color:#fff;
  502. background:#000 url('http://static.tumblr.com/wgg6svp/Jonnu93q7/black.png');
  503. {/block:IfNotLightVersion}
  504. {block:IfLightVersion}
  505. color:#000;
  506. background:#000 url('http://static.tumblr.com/wgg6svp/ivOnu97ym/bg_332872.png');
  507. {/block:IfLightVersion}
  508. }
  509.  
  510. #pagination span{
  511. font-weight:bold;
  512. font-style:italic;
  513. font-size:12px;
  514. margin:0 5px;
  515. }
  516. #pagination a{
  517. {block:IfNotLightVersion}
  518. color:#999;
  519. {/block:IfNotLightVersion}
  520. {block:IfLightVersion}
  521. color:#888;
  522. {/block:IfLightVersion}
  523. }
  524. #pagination a:hover{
  525. {block:IfNotLightVersion}
  526. color:#fff;
  527. {/block:IfNotLightVersion}
  528. {block:IfLightVersion}
  529. color:#444;
  530. {/block:IfLightVersion}
  531. }
  532. #loadmore{
  533. display:block;
  534. margin-bottom:10px;
  535. {block:IfNotLightVersion}
  536. color:#aaa;
  537. {/block:IfNotLightVersion}
  538. {block:IfLightVersion}
  539. color:#676;
  540. {/block:IfLightVersion}
  541. }
  542. #loadmore:hover{
  543. {block:IfNotLightVersion}
  544. color:#fff;
  545. {/block:IfNotLightVersion}
  546. {block:IfLightVersion}
  547. color:#000;
  548. {/block:IfLightVersion}
  549. }
  550.  
  551.  
  552. #credits{
  553. display:table;
  554. margin:10px auto;
  555. font-size:8px;
  556. padding:5px 10px;
  557. position:relative;
  558. opacity:.7;
  559. }
  560. #credits a{
  561. {block:IfNotLightVersion}
  562. color:#fff;
  563. {/block:IfNotLightVersion}
  564. {block:IfLightVersion}
  565. color:#000;
  566. {/block:IfLightVersion}
  567. }
  568. #credits a:hover{
  569. {block:IfNotLightVersion}
  570. color:#aaa;
  571. {/block:IfNotLightVersion}
  572. {block:IfLightVersion}
  573. color:#ccc;
  574. {/block:IfLightVersion}
  575. }
  576. #credits:hover{
  577. opacity:1;
  578. }
  579. #credits:hover:before{
  580. width:100%;
  581. }
  582. #credits:before{
  583. width:50%;
  584. height:1px;
  585. content:"";
  586. position:absolute;
  587. top:0;
  588. left:0;
  589. right:0;
  590. margin:auto;
  591. {block:IfNotLightVersion}
  592. background-color:#fff;
  593. {/block:IfNotLightVersion}
  594. {block:IfLightVersion}
  595. background-color:#444;
  596. {/block:IfLightVersion}
  597. }
  598. .pagi #loadmore,
  599. .loadmorebtn #pagination,
  600. .ifntscroll{
  601. display:none;
  602. }
  603. .side{
  604. margin:10px 10px 30px 10px;
  605. }
  606. .team{
  607. overflow:hidden;
  608. }
  609. .team img{
  610. border:5px solid #fff;
  611. width:35px;
  612. height:35px;
  613. margin:2.5px;
  614. display:block;
  615. float:left;
  616. }
  617. .upcoming li{
  618. position:relative;
  619. }
  620. .upcoming li:after{
  621. content:"";
  622. width:0px;
  623. height:1px;
  624. {block:IfNotLightVersion}
  625. background-color:#000;
  626. {/block:IfNotLightVersion}
  627. {block:IfLightVersion}
  628. background-color:#fff;
  629. {/block:IfLightVersion}
  630. position:absolute;
  631. bottom:0;
  632. left:0;
  633. }
  634. .upcoming li:hover{
  635. cursor:pointer!important;
  636. }
  637. .upcoming li:hover:after{
  638. width:100%;
  639. }
  640. aside form{
  641. display:block;
  642. margin:20px 15px 45px;
  643. overflow:hidden;
  644. }
  645. aside input[type="text"]{
  646. display:block;
  647. line-height:40px;
  648. border:none;
  649. width:190px;
  650. padding:5px 10px;
  651. float:left;
  652. {block:IfNotLightVersion}
  653. background-color:#fff;
  654. {/block:IfNotLightVersion}
  655. {block:IfLightVersion}
  656. background-color:#f2f2f2;
  657. {/block:IfLightVersion}
  658. outline:none;
  659. }
  660. aside input[type="submit"]{
  661. outline:none;
  662. border:none;
  663. padding:5px;
  664. line-height:40px;
  665. width:50px;
  666. float:left;
  667. text-transform:uppercase;
  668. letter-spacing:1px;
  669. font-size:8px;
  670. {block:IfNotLightVersion}
  671. background-color:#eee;
  672. {/block:IfNotLightVersion}
  673. {block:IfLightVersion}
  674. background-color:#ccc;
  675. {/block:IfLightVersion}
  676. }
  677. .side > img{
  678. display:block;
  679. width:100%;
  680. height:150px;
  681. }
  682. .side li b:after{
  683. content:":";
  684. }
  685. .side li b:before{
  686. content:"\f469";
  687. display:inline-block;
  688. font-family:"Ionicons";
  689. margin-right:10px;
  690. }
  691. .side > ul, .side > div{
  692. position:relative;
  693. z-index:1;
  694. {block:IfNotLightVersion}
  695. background-color:#fff;
  696. {/block:IfNotLightVersion}
  697. {block:IfLightVersion}
  698. background-color:#f2f2f2;
  699. {/block:IfLightVersion}
  700. padding:30px;
  701. margin:{block:IfOverlappingSidebarContent}-60px 10px{/block:IfOverlappingSidebarContent}{block:IfNotOverlappingSidebarContent}5px 0{/block:IfNotOverlappingSidebarContent} 50px;
  702. }
  703. .side li{
  704. list-style-type:none;
  705. text-transform:uppercase;
  706. font-size:9px;
  707. }
  708. h4{
  709. display:block;
  710. padding:5px 10px;
  711. font-size:8px;
  712. }
  713. .readmore{
  714. display:block;
  715. padding:5px 10px;
  716. font-size:8px;
  717. margin-top:15px;
  718. {block:IfNotLightVersion}
  719. border:2px solid #000;
  720. color:#000;
  721. {/block:IfNotLightVersion}
  722. {block:IfLightVersion}
  723. border:2px solid #fff;
  724. color:#888;
  725. {/block:IfLightVersion}
  726. }
  727. .readmore:hover{
  728. {block:IfNotLightVersion}
  729. background-color:#000;
  730. color:#fff;
  731. {/block:IfNotLightVersion}
  732. {block:IfLightVersion}
  733. background-color:#fff;
  734. border-color:#fff;
  735. color:#000;
  736. {/block:IfLightVersion}
  737. }
  738. main{
  739. font-family:{select:Font};
  740. display:block;
  741. overflow:hidden;
  742. {block:IfNotLightVersion}
  743. background-color:#000;
  744. {/block:IfNotLightVersion}
  745. {block:IfLightVersion}
  746. background-color:#fff;
  747. {/block:IfLightVersion}
  748. }
  749. section{
  750. background-color:{color:PostsBackground};
  751. min-height:100%;
  752. display:block;
  753. overflow:hidden;
  754. }
  755. aside{
  756. height:100%;
  757. display:block;
  758. overflow:hidden;
  759. width:300px;
  760. }
  761. article{
  762. overflow:hidden;
  763. margin:100px auto;
  764. width:500px;
  765. background-color:#fff;
  766. }
  767. h3 a{
  768. display:block;
  769. text-align:left;
  770. position:relative;
  771. margin-top:40px;
  772. margin-left:40px;
  773. padding-bottom:20px;
  774. font-size:10px;
  775. font-family:'Moderne Sans';
  776. color:#000;
  777. }
  778. h3 a:after{
  779. width:30%;
  780. content:"";
  781. height:2px;
  782. background-color:#000;
  783. position:absolute;
  784. bottom:0;
  785. left:0;
  786. }
  787. article:hover h3 a:after{
  788. width:calc(100% - 40px);
  789. }
  790. .pictures{
  791. min-width:100%;
  792. max-width:100%;
  793. display:block;
  794. }
  795. .caption{
  796. padding:20px 40px{block:IndexPage} 0{/block:IndexPage};
  797. }
  798. .caption blockquote{
  799. padding-left:20px;
  800. border-left:1px solid #eee;
  801. }
  802. .caption p, .caption pre, .caption blockquote{
  803. margin:10px 0;
  804. }
  805. .caption ol,
  806. .caption ul{
  807. margin:10px 20px;
  808. }
  809. .caption li{
  810. padding-left:20px;
  811. }
  812. .perma{
  813. margin:20px auto;
  814. width:430px;
  815. text-align:left;
  816. font-size:8px;
  817. overflow:hidden;
  818. }
  819. .perma > span{
  820. width:390px;
  821. display:block;
  822. float:left;
  823. line-height:130%;
  824. overflow:hidden;
  825. line-height:17px;
  826. }
  827. .btns{
  828. overflow:hidden;
  829. width:40px;
  830. display:block;
  831. float:left;
  832. }
  833. .btns span{
  834. text-align:center;
  835. display:block;
  836. width:12px;
  837. height:12px;
  838. margin-top:2px;
  839. margin-right:8px;
  840. line-height:12px;
  841. float:left;
  842. font-size:12px;
  843. position:relative;
  844. overflow:hidden;
  845. color:#000;
  846. }
  847. .btns a{
  848. color:#000;
  849. }
  850. .like_button{
  851. display:block;
  852. }
  853. .like_button iframe{
  854. width:10px!important;
  855. margin-top:-4px;
  856. }
  857. .perma > span a:first-child{
  858. margin-right:10px;
  859. font-weight:bold;
  860. color:#000;
  861. display:table;
  862. position:relative;
  863. }
  864. .perma > span a:first-child:after{
  865. width:100%;
  866. height:2px;
  867. background-color:#000;
  868. content:"";
  869. position:absolute;
  870. left:0;
  871. bottom:0;
  872.  
  873. }
  874.  
  875. .perma > span *{
  876. float:left;
  877. margin-right:5px;
  878. }
  879. .fu-tumblr *{
  880. display:block;
  881. min-width:100%;
  882. max-width:100%;
  883. }
  884. .quote{
  885. display:inline-block;
  886. padding:20px 0;
  887. padding-left:80px;
  888. width:calc(100% - 95px);
  889. position:relative;
  890. font-style:italic;
  891. }
  892. .quote:before{
  893. content: "\f347";
  894. font-style: normal;
  895. font-family: "Ionicons";
  896. font-size:30px;
  897. line-height:40px;
  898. display:block;
  899. width:35px;
  900. left:20px;
  901. position:absolute;
  902. top:0;
  903. margin:auto;
  904. height:40px;
  905. bottom:0;
  906. border-right:1px solid #000;
  907. }
  908. .quote + .caption{
  909. margin:10px;
  910. {block:PermalinkPage}margin-bottom:0;{/block:PermalinkPage}
  911. text-align:center;
  912. letter-spacing:1px;
  913. font-size:9px;
  914. text-transform:uppercase;
  915. }
  916. .question, .audio{
  917. width:430px;
  918. margin:30px auto 0;
  919. }
  920. .question img, .player{
  921. display:inline-block;
  922. width:40px;
  923. height:40px;
  924. padding:10px 14px 10px 0;
  925. margin-right:15px;
  926. vertical-align:middle;
  927. border-right:1px solid #eee;
  928. position:relative;
  929. }
  930.  
  931. .question b{
  932. text-transform:uppercase;
  933. letter-spacing:1px;
  934. font-size:9px;
  935. margin-right:10px;
  936. }
  937. .question span, .audio p{
  938. vertical-align:middle;
  939. display:inline-block;
  940. width:355px;
  941. }
  942. .audio p{
  943. text-align:center;
  944. }
  945. .audio img{
  946. display:block;
  947. }
  948. .audio_player{
  949. opacity:.3;
  950. top:10px;
  951. left:0px;
  952. position:absolute;
  953. display:block;
  954. width:40px!important;
  955. height:40px!important;
  956. overflow:hidden;
  957. background-color:#fff;
  958. transition-duration:.8s;
  959. -webkit-transition-duration:.8s;
  960. -moz-transition-duration:.8s;
  961. -ms-transition-duration:.8s;
  962. -o-transition-duration:.8s;
  963. }
  964. iframe.tumblr_audio_player{
  965. position:absolute;
  966. width:40px;
  967. height:40px;
  968. top:0;
  969. left:0;
  970. right:0;
  971. bottom:0;
  972. margin:auto;
  973. background-color:transparent!important;
  974.  
  975. }
  976. a#reblogged{
  977. opacity:0;
  978. }
  979. .visibile{
  980. opacity:1!important;
  981. }
  982. .audio:hover .audio_player{
  983. opacity:1;
  984. transition-duration:.8s;
  985. -webkit-transition-duration:.8s;
  986. -moz-transition-duration:.8s;
  987. -ms-transition-duration:.8s;
  988. -o-transition-duration:.8s;
  989. }
  990. ul.chat{
  991. padding:0;
  992. }
  993. .chat li{
  994. list-style-type:none;
  995. padding:10px 15px;
  996. }
  997. li.odd{
  998. background-color:#444;
  999. color:#fff;
  1000. }
  1001. a.tumblr_blog{
  1002. font-weight:bold;
  1003. text-transform:uppercase;
  1004. font-size:9px;
  1005. color:#000;
  1006. font-style:italic;
  1007. }
  1008. .chat b{
  1009. font-size:10px;
  1010. text-transform:uppercase;
  1011. letter-spacing:1px;
  1012. }
  1013.  
  1014. #notes img{
  1015. display:none;
  1016. }
  1017. #notes ol{
  1018. margin:10px 30px;
  1019. text-transform:uppercase;
  1020. letter-spacing:1px;
  1021. font-size:8px;
  1022. }
  1023. #notes li{
  1024. list-style-type:none;
  1025. padding:10px;
  1026. }
  1027.  
  1028. .quote{
  1029. display:inline-block;
  1030. padding:20px 0;
  1031. padding-left:80px;
  1032. width:calc(100% - 95px);
  1033. position:relative;
  1034. }
  1035. .quote{
  1036. font-style:italic;
  1037. }
  1038. .quote:before{
  1039. content: "\f347";
  1040. speak: none;
  1041. font-style: normal;
  1042. font-weight: normal;
  1043. font-family: "Ionicons";
  1044. font-size:30px;
  1045. line-height:40px;
  1046. display:block;
  1047. width:35px;
  1048. left:20px;
  1049. position:absolute;
  1050. top:0;
  1051. margin:auto;
  1052. height:40px;
  1053. bottom:0;
  1054. border-right:1px solid #000;
  1055. }
  1056. .quote + .caption{
  1057. margin:10px;
  1058. {block:PermalinkPage}margin-bottom:0;{/block:PermalinkPage}
  1059. text-align:center;
  1060. letter-spacing:1px;
  1061. font-size:9px;
  1062. text-transform:uppercase;
  1063. }
  1064. </style>
  1065. </head>
  1066. <body>
  1067. <div id="smthg">
  1068. <h1>{Title}</h1>
  1069. </div>
  1070. <nav>
  1071. <li><a href="/"> Index </a></li>
  1072. <li><a href="/ask"> Contact </a></li>
  1073. <!-- Dropdown menu: -->
  1074. {block:IfDropdownLinks}
  1075. <li class="dropdown">
  1076. <a href="#"> {text:DropdownMenu} </a>
  1077. <ul>
  1078. <li><a href="{text:DropdownLink1URL}"> {text:DropdownLink1Name} </a></li>
  1079. <li><a href="{text:DropdownLink2URL}"> {text:DropdownLink2Name} </a></li>
  1080. <li><a href="{text:DropdownLink3URL}"> {text:DropdownLink3Name} </a></li>
  1081. </ul>
  1082. </li>
  1083. {/block:IfDropdownLinks}
  1084. {block:IfLink1}
  1085. <li><a href="{text:Link1URL}"> {text:Link1Name} </a></li>
  1086. {/block:IfLink1}
  1087. {block:IfLink2}
  1088. <li><a href="{text:Link2URL}"> {text:Link2Name} </a></li>
  1089. {/block:IfLink2}
  1090. {block:IfLink3}
  1091. <li><a href="{text:Link3URL}"> {text:Link3Name} </a></li>
  1092. {/block:IfLink3}
  1093. {block:IfLink4}
  1094. <li><a href="{text:Link4URL}"> {text:Link4Name} </a></li>
  1095. {/block:IfLink4}
  1096. <li><a href="/archive"> archive </a></li>
  1097. </nav>
  1098. {block:IndexPage}
  1099. {block:IfLatestUpdates}
  1100. <header>
  1101. <div id="updates">
  1102. <h2><i class="ion-android-menu"></i> Latest updates</h2>
  1103. <ul>
  1104. <li><a href="{text:Update1URL}">{text:Update1Name}</a></li>
  1105. <li><a href="{text:Update2URL}">{text:Update2Name}</a></li>
  1106. <li><a href="{text:Update3URL}">{text:Update3Name}</a></li>
  1107. <li><a href="{text:Update4URL}">{text:Update4Name}</a></li>
  1108. <li><a href="{text:Update5URL}">{text:Update5Name}</a></li>
  1109. </ul>
  1110. </div>
  1111. <img src="{image:Logo}">
  1112. </header>
  1113. {/block:IfLatestUpdates}
  1114. {/block:IndexPage}
  1115. <main>
  1116. <section>
  1117. {block:Posts}
  1118. {block:ContentSource}<!-- {SourceURL}{block:SourceLogo}<img src="{BlackLogoURL}"width="{LogoWidth}" height="{LogoHeight}" alt="{SourceTitle}" />{/block:SourceLogo}{block:NoSourceLogo}{SourceLink}{/block:NoSourceLogo} -->{/block:ContentSource}<!-- {block:NoRebloggedFrom}{block:RebloggedFrom}{ReblogParentName}{/block:RebloggedFrom}{/block:NoRebloggedFrom} -->
  1119. <article>
  1120. {block:Text}
  1121. {block:Title}<h3><a href="{Permalink}">{Title}</a></h3>{/block:Title}
  1122. <div class="caption">
  1123. {Body}
  1124. </div>
  1125. {/block:Text}
  1126.  
  1127. {block:Link}
  1128. <h3><a href="{URL}">{Name} »</a></h3>
  1129. {block:Description}
  1130. <div class="caption">
  1131. {Description}
  1132. </div>
  1133. {/block:Description}
  1134. {/block:Link}
  1135.  
  1136. {block:Video}
  1137. <div class="fu-tumblr">{Video-500}</div>
  1138. {block:Caption}
  1139. <div class="caption">
  1140. {Caption}
  1141. </div>
  1142. {/block:Caption}
  1143. {/block:Video}
  1144.  
  1145. {block:Photoset}
  1146. <div class="photo-slideshow" id="photoset_{PostID}" data-layout="{PhotosetLayout}">
  1147. <a onclick="Tumblr.Lightbox.init([/*{block:Photos}, /**/ { width: {PhotoWidth-HighRes}, height: {PhotoHeight-HighRes}, low_res: '{PhotoURL-500}', high_res: '{PhotoURL-HighRes}' }{/block:Photos}]); $('body').toggleClass('tumblr_lightbox_active'); return false">
  1148. {block:Photos}
  1149. <div class="photo-data">
  1150. <div class="pxu-photo">
  1151. <img alt="{PhotoAlt}" src="{PhotoURL-500}" width="{PhotoWidth-500}" height="{PhotoHeight-500}" data-highres="{PhotoURL-HighRes}" data-width="{PhotoWidth-HighRes}" data-height="{PhotoHeight-HighRes}" class="{block:Exif}exif-yes {/block:Exif}{block:Caption}caption-yes{/block:Caption}" {block:Exif}data-camera="{block:Camera}{Camera}{/block:Camera}" data-iso="{block:ISO}{ISO}{/block:ISO}" data-aperture="{block:Aperture}{Aperture}{/block:Aperture}" data-exposure="{block:Exposure}{Exposure}{/block:Exposure}" data-focal="{block:FocalLength}{FocalLength}{/block:FocalLength}"{/block:Exif} {block:Caption}data-caption="{Caption}"{/block:Caption}>
  1152. </div>
  1153. </div>
  1154. {/block:Photos}
  1155. </a>
  1156. </div>
  1157.  
  1158. {block:Caption}
  1159. <div class="caption">
  1160. {Caption}
  1161. </div>
  1162. {/block:Caption}
  1163. {/block:Photoset}
  1164.  
  1165. {block:Photo}
  1166. <a href="{PhotoURL-HighRes}" target="_blank"><img src="{PhotoURL-HighRes}" alt="{PhotoAlt}" class="pictures"></a>
  1167. {block:Caption}
  1168. <div class="caption">
  1169. {Caption}
  1170. </div>
  1171. {/block:Caption}
  1172. {/block:Photo}
  1173.  
  1174.  
  1175. {block:Chat}
  1176. {block:Title}
  1177. <h3><a href="{Permalink}">{Title}</a></h3>
  1178. {/block:Title}
  1179. <ul class="chat">
  1180. {block:Lines}
  1181. <li class="{Alt}">
  1182. {block:Label}
  1183. <b>{Label}</b>
  1184. {/block:Label}
  1185. {Line}
  1186. </li>
  1187. {/block:Lines}
  1188. </ul>
  1189. {/block:Chat}
  1190.  
  1191. {block:Audio}
  1192. <div class="audio">
  1193. <div class="player">
  1194. {block:AlbumArt}
  1195. <img src="{AlbumArtURL}">
  1196. {/block:AlbumArt}
  1197. <span>{block:AudioPlayer} {AudioPlayer} {/block:AudioPlayer}</span>
  1198. </div>
  1199. <p>
  1200. {block:Artist}
  1201. <b>{Artist}</b> <br>
  1202. {/block:Artist}
  1203. {block:TrackName}
  1204. {TrackName}
  1205. {/block:TrackName}
  1206. </p>
  1207. </div>
  1208. {block:Caption}
  1209. <div class="caption">{Caption}</div>
  1210. {/block:Caption}
  1211. {/block:Audio}
  1212.  
  1213. {block:Quote}
  1214. <h3 class="quote">{Quote}</h3>
  1215. {block:Source}
  1216. <div class="caption">
  1217. {Source}
  1218. </div>
  1219. {/block:Source}
  1220. {/block:Quote}
  1221.  
  1222. {block:Answer}
  1223. <div class="question">
  1224. <img src="{AskerPortraitURL-96}">
  1225. <span>
  1226. <b>{Asker}</b>
  1227. {Question}
  1228. </span>
  1229. </div>
  1230. <div class="caption">{Answer}</div>
  1231. {/block:Answer}
  1232.  
  1233. {block:Date}
  1234. <div class="perma">
  1235. <div class="btns">
  1236. <span>
  1237. {LikeButton color="black"}
  1238. </span>
  1239. <span>
  1240. <a href="{ReblogURL}" title="Reblog" target="_blank"><i class="ion-arrow-return-left"></i></a>
  1241. </span>
  1242. </div>
  1243. <span><a href="{Permalink}">{Month} {DayOfMonth}{DayOfMonthSuffix}{block:NoteCount}, +{NoteCountWithLabel}{/block:NoteCount}</a> {block:HasTags}<b>Filed under:</b> {block:Tags}<a href="{TagURL}">#{Tag}</a>{/block:Tags} {/block:HasTags}{block:PermalinkPage}{block:RebloggedFrom}<br><a href="{ReblogParentURL}" title="{ReblogParentTitle}">via {ReblogParentName},</a> <a href="{ReblogRootURL}" title="{ReblogRootTitle}">©{ReblogRootName}</a>{/block:RebloggedFrom}{/block:PermalinkPage}</span>
  1244. </div>
  1245. {/block:Date}
  1246. {block:PostNotes}
  1247. <div id="notes">{PostNotes}</div>
  1248. {/block:PostNotes}
  1249. </article>
  1250. {/block:Posts}
  1251. </section>
  1252. <aside>
  1253. <div class="side">
  1254. <img src="{image:SidebarOne}">
  1255. <div>
  1256. {Description}
  1257. </div>
  1258. </div>
  1259. <form>
  1260. <input type="text" placeholder="#search...">
  1261. <input type="submit" value="go">
  1262. </form>
  1263. <div class="side">
  1264. <img src="{image:SidebarTwo}">
  1265. <ul>
  1266. <li><b>{text:Info1Name}</b> {text:Info1}</li>
  1267. <li><b>{text:Info2Name}</b> {text:Info2}</li>
  1268. <li><b>{text:Info3Name}</b> {text:Info3}</li>
  1269. <li><b>{text:Info4Name}</b> {text:Info4}</li>
  1270. <li><b>{text:Info5Name}</b> {text:Info5}</li>
  1271. <a class="readmore" href="{text:ReadMoreURL}">{text:ReadMoreName}</a>
  1272. </ul>
  1273. </div>
  1274. <div class="side">
  1275. <img src="{image:SidebarThree}">
  1276. <ul class="upcoming">
  1277. <h4>Upcoming activities</h4>
  1278. <li>{text:UpcomingActivity1}</li>
  1279. <li>{text:UpcomingActivity2}</li>
  1280. <li>{text:UpcomingActivity3}</li>
  1281. <li>{text:UpcomingActivity4}</li>
  1282. </ul>
  1283. </div>
  1284. <div class="side">
  1285. <img src="{image:SidebarFour}">
  1286. <ul>
  1287. <li><b>Established</b> {text:DateOfCreation}</li>
  1288. <li><b>Online</b> {text:OnlineUsersCounter}</li>
  1289. <li><b>Visits</b> {text:VisitCounter}</li>
  1290. <li><b>Theme credit</b> <a href="http://neothm.com" target="_blank">Neothm.com</a></li>
  1291. </ul>
  1292. </div>
  1293. {block:GroupMembers}
  1294. <div class="side">
  1295. <img src="{image:SidebarFive}">
  1296. <div class="team">
  1297. <h4>Team</h4>
  1298. {block:GroupMember}
  1299. <a href="{GroupMemberURL}" title="{GroupMemberName}"><img src="{GroupMemberPortraitURL-64}"></a>
  1300. {/block:GroupMember}
  1301. </div>
  1302. </div>
  1303. {/block:GroupMembers}
  1304. </aside>
  1305. </main>
  1306. <footer class="{select:NextPage}">
  1307. {block:Pagination}
  1308. <div id="pagination">
  1309. {block:PreviousPage}<a href="{PreviousPage}"><i class="ion-ios-arrow-left"></i>  </a>{/block:PreviousPage}
  1310. {block:JumpPagination length="5"}
  1311. {block:CurrentPage}<span>{PageNumber}</span>{/block:CurrentPage}
  1312. {block:JumpPage}<a href="{URL}">{PageNumber}</a>{/block:JumpPage}{/block:JumpPagination}
  1313. {block:NextPage}<a id="nxt" href="{NextPage}"> <i class="ion-ios-arrow-right"></i></a>{/block:NextPage}
  1314. </div>
  1315. <a id="loadmore">Load more posts</a>
  1316. {/block:Pagination}
  1317. <span id="credits">theme by <a href="http://neothm.com/" target="_blank">neo</a></span>
  1318. </footer>
  1319.  
  1320.  
  1321.  
  1322. <script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jquery/1.8.0/jquery.min.js"></script>
  1323. <script src="http://static.tumblr.com/wgg6svp/sDinmsq3x/jquery.style-my-tooltips.js"></script>
  1324. <script src="http://static.tumblr.com/wgijwsy/Ebfm2v4gy/jquery.masonry.min.js"></script>
  1325. <script src="http://static.tumblr.com/wgijwsy/u2vm2hxv6/jquery.infinitescroll.min.js"></script>
  1326. <script src="http://static.tumblr.com/iwtk77u/Yhym2yygt/jquery.imagesloaded.min.js"></script>
  1327. <script src="http://static.tumblr.com/emvnqzg/NOVo0fisl/scripts.js"></script>
  1328.  
  1329. <script type="text/javascript" src="http://static.tumblr.com/wgg6svp/Wf8nw0j2c/pxuphotoset.js"></script>
  1330. <script type="text/javascript">
  1331. $(function(){
  1332.  
  1333. $('.photo-slideshow').pxuPhotoset({
  1334. 'rounded' : false,
  1335. 'gutter' : '5px'
  1336. });
  1337. var nav = $('nav').offset().top;
  1338. $(window).scroll(function(){
  1339. if($(window).scrollTop() > nav){
  1340. $('nav').addClass('fixed');
  1341. {block:IndexPage}
  1342. $('header').css({'margin-top':'50px'});
  1343. {/block:IndexPage}
  1344. {block:PermalinkPage}
  1345. $('main').css({'margin-top':'50px'});
  1346. {/block:PermalinkPage}
  1347. }else{
  1348. $('nav').removeClass('fixed');
  1349. {block:IndexPage}
  1350. $('header').css({'margin-top':'0px'});
  1351. {/block:IndexPage}
  1352. {block:PermalinkPage}
  1353. $('main').css({'margin-top':'0px'});
  1354. {/block:PermalinkPage}
  1355. }
  1356. });
  1357. function adjust(){
  1358. var aside = $('aside').height();
  1359. var section = $('section').height();
  1360. if(aside > section){
  1361. $('section').height($('aside').height());
  1362. }else{
  1363. $('aside').height($('section').height());
  1364. }
  1365.  
  1366. if($('footer').hasClass('ifntscroll')){
  1367. $('a#reblogged').addClass('visibile');
  1368. }
  1369. }
  1370. setTimeout(function(){
  1371. adjust();
  1372. }, 700);
  1373.  
  1374. $('form').submit(function(event){
  1375. event.preventDefault();
  1376. var se = $('aside input[type="text"]').val();
  1377. if(se != ""){
  1378. window.location.replace("http://{Name}.tumblr.com/tagged/"+se);
  1379. }else{
  1380. $('aside input[type="text"]').css({'background-color':'#CCCCCC'});
  1381. }
  1382.  
  1383. });
  1384.  
  1385.  
  1386. $("[title]").style_my_tooltips({
  1387. tip_follows_cursor:true,
  1388. tip_delay_time:200,
  1389. tip_fade_speed:500
  1390. });
  1391.  
  1392. {block:IndexPage}
  1393. var parent = $('section');
  1394. if($('footer').hasClass('ifntscroll') || $('footer').hasClass('loadmorebtn')){
  1395. parent.infinitescroll({
  1396. navSelector : "#pagination",
  1397. nextSelector : "#nxt",
  1398. itemSelector : "article",
  1399. bufferPx : 50,
  1400. done : "",
  1401. loading: {
  1402. img : "",
  1403. msgText: "",
  1404. finishedMsg:""
  1405. },
  1406. },
  1407. function( newElements ) {
  1408. var $newElems = $( newElements ).css({ opacity: 0 });
  1409. $newElems.imagesLoaded(function(){
  1410. $newElems.animate({ opacity: 1 }).find('.photo-slideshow').pxuPhotoset();
  1411. adjust();
  1412. });
  1413. });
  1414.  
  1415. if($('footer').hasClass('loadmorebtn')){
  1416. parent.infinitescroll({
  1417. behavior: 'twitter'
  1418. });
  1419. $(window).unbind('.infscr');
  1420. $('a#loadmore').click(function(){
  1421. $('section').infinitescroll('retrieve');
  1422. $('footer').show();
  1423. return false;
  1424. });
  1425. }
  1426. }
  1427. {/block:IndexPage}
  1428. });
  1429. </script>
  1430. </body>
  1431. </html>
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!