API tools faq
paste
letsrp

Stars Dance - Theme #5

letsrp
Jul 23rd, 2013
686
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 16.59 KB | None | 0 0
raw download clone embed print report
  1. <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
  2.  
  3. <!--
  4. ゜・。。・゜☆゜・。。(◕‿◕✿)・゜゜・。。・゜☆゜・。。・゜
  5.  
  6. .---. .-''-.,---------. .-'''-..-------. .-------.
  7. | ,_| .'_ _ \ \/ _ | _ _ \ \ _(`)_ \
  8. ,-./ ) / ( ` ) `--. ,---(`' )/`--| ( ' ) | | (_ o._)|
  9. \ '_ '`). (_ o _) | | \ (_ o _). |(_ o _) / | (_,_) /
  10. > (_) )| (_,_)___| :_ _: (_,_). '.| (_,_).' __| '-.-'
  11. ( . .-'' \ .---. (_I_) .---. \ | |\ \ | | |
  12. `-'`-'|__\ `-' / (_(=)_)\ `-' | | \ `' | |
  13. | \ / (_I_) \ /| | \ // )
  14. `--------``'-..-' '---' `-...-' ''-' `'-' `---'
  15.  
  16.  
  17. this theme was made by letsrp @ tumblr.com
  18. - don't use as base to make your own themes
  19. - don't edit and redistribute it
  20. - keep credit
  21. - don't steal, please
  22.  
  23. ゜・。。・゜☆゜・。。(◕‿◕✿)・゜゜・。。・゜☆゜・。。・゜
  24. -->
  25.  
  26. <html>
  27. <head>
  28. <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.5.1/jquery.min.js"></script>
  29. <script type="text/javascript" src="http://static.tumblr.com/y0x5xm1/WdCmcx05a/jquery.nivo.slider.pack.js"></script>
  30. <script type="text/javascript">
  31. var $nv4wp = jQuery.noConflict();
  32. $nv4wp(window).load(function() {
  33. $nv4wp('#slider').nivoSlider({
  34. effect:'random',
  35. slices:15, // For slice animations
  36. boxCols: 4, // For box animations
  37. boxRows: 2, // For box animations
  38. animSpeed:500, // Slide transition speed
  39. pauseTime:3000, // How long each slide will show
  40. startSlide:0, // Set starting Slide (0 index)
  41. directionNav:true, //Next & Prev
  42. controlNav:false, // 1,2,3... navigation
  43. controlNavThumbs:false, // Use thumbnails for Control Nav
  44. controlNavThumbsFromRel:false, // Use image rel for thumbs
  45. controlNavThumbsSearch: '.jpg', // Replace this with...
  46. controlNavThumbsReplace: '_thumb.jpg', // ...this in thumb Image src
  47. keyboardNav:true, //Use left & right arrows
  48. pauseOnHover:true, //Stop animation while hovering
  49. manualAdvance:false, //Force manual transitions
  50. captionOpacity:0.8, //Universal caption opacity
  51. prevText: 'Prev', // Prev directionNav text
  52. nextText: 'Next', // Next directionNav text
  53. beforeChange: function(){}, // Triggers before a slide transition
  54. afterChange: function(){}, // Triggers after a slide transition
  55. slideshowEnd: function(){}, // Triggers after all slides have been shown
  56. lastSlide: function(){}, // Triggers when last slide is shown
  57. afterLoad: function(){} // Triggers when slider has loaded
  58. });
  59. });
  60. </script>
  61.  
  62. <script type="text/javascript" src="http://static.tumblr.com/y0x5xm1/e1gmcx29e/jquery.nivo.slider.js"></script>
  63. <script type="text/javascript">
  64. $(window).load(function() {
  65. $('#slider').nivoSlider();
  66. });
  67. </script>
  68.  
  69. <title>{Title}</title>
  70. <link rel="shortcut icon" href="{Favicon}" />
  71. <link rel="alternate" type="application/rss+xml" href="{RSS}" />
  72. <meta name="description" content="{MetaDescription}" />
  73. <link href='http://fonts.googleapis.com/css?family=Open+Sans+Condensed:700,300' rel='stylesheet' type='text/css'>
  74.  
  75. <!-- DEFAULT VARIABLES -->
  76. <meta name="color:Background" content="#181717"/>
  77. <meta name="color:Entry" content="#000000"/>
  78. <meta name="color:Text" content="#c5c3c3"/>
  79. <meta name="color:Title" content="#164875"/>
  80. <meta name="color:Links" content="#bed1da"/>
  81. <meta name="color:Link Bars" content="#b7ccdf"/>
  82. <meta name="color:BLinks" content="#ffffff"/>
  83. <meta name="color:Links Hover" content="#f0f8fa"/>
  84. <meta name="color:Info" content="#202020"/>
  85. <meta name="color:Scrollbar" content="#b7cecf"/>
  86. <meta name="color:Tab" content="#ffffff"/>
  87.  
  88. <meta name="color:Line1" content="#dde7f0"/>
  89. <meta name="color:Line2" content="#cadbeb"/>
  90. <meta name="color:Line3" content="#9abcdb"/>
  91. <meta name="color:Line4" content="#87aaca"/>
  92. <meta name="color:Line5" content="#d5e9fa"/>
  93.  
  94. <meta name="if:Show Tags" content="0"/>
  95. <meta name="if:Show Lines" content="1"/>
  96.  
  97. <meta name="text:link 1 title" content="home"/>
  98. <meta name="text:link 1 url" content="/"/>
  99. <meta name="text:link 2 title" content="inbox"/>
  100. <meta name="text:link 2 url" content="/ask"/>
  101. <meta name="text:link 3 title" content="navi"/>
  102. <meta name="text:link 3 url" content="/"/>
  103.  
  104. <meta name="text:tab title" content="hover"/>
  105. <meta name="text:tab text" content="w/e here."/>
  106.  
  107. <meta name="text:title right" content="260px"/>
  108. <meta name="text:title top" content="40px"/>
  109.  
  110. <meta name="image:Title" content="http://static.tumblr.com/5bc3fbd88fc2045b847a7ec77cc42070/yy7o4zk/6jgmqddi2/tumblr_static_untitled-1.png"/>
  111. <meta name="image:Background" content="http://static.tumblr.com/592f79f9113f20e7c563b2d310f9cc66/yy7o4zk/bJvmqdb8l/tumblr_static_tumblr_static_wood4.jpg"/>
  112. <meta name="image:Slide 1" content="http://static.tumblr.com/7355011cc56b0a3e4cc43ea005937257/yy7o4zk/lF1mqeqch/tumblr_static_001btscomegetitday02.png"/>
  113. <meta name="image:Slide 2" content="http://static.tumblr.com/617b9f89c8d1811265bbe33a1da08378/yy7o4zk/Magmqeqcv/tumblr_static_004btscomegetitday02.png"/>
  114. <meta name="image:Slide 3" content="http://static.tumblr.com/a59b503d82cb3d35ad157ce1c324e9a0/yy7o4zk/4Aemqeqd9/tumblr_static_005btscomegetitday02.png"/>
  115.  
  116.  
  117. <style type="text/css">
  118.  
  119. ::-webkit-scrollbar-thumb{
  120. background-color: {color:Scrollbar};
  121. border: 2px solid {color:Entry};
  122. height:auto;
  123. -moz-border-radius: 10px;
  124. border-radius: 10px;
  125. }
  126.  
  127. ::-webkit-scrollbar {
  128. height:auto;
  129. width:9px;
  130. background-color: {color:Text};
  131. border: 4px solid {color:Entry};
  132. }
  133.  
  134.  
  135. body{
  136. color:{color:Text};
  137. background-attachment:fixed;
  138. background-color:{color:Background};
  139. background-image: url('{image:Background}');
  140. font-size:10px;
  141. font-family:consolas;
  142. }
  143.  
  144. a {color: {color:Links}; text-decoration:none;}
  145. a:hover {color:{color:Links Hover}; text-decoration:none;}
  146.  
  147.  
  148. #pop {
  149. background-color:{color:Line2};
  150. position: fixed;
  151. margin-top:150px;
  152. margin-left:-8px;
  153. text-align:fixed;
  154. height:20px;
  155. padding:4px;
  156. width:100%;
  157. border-bottom:10px solid {color:Line3};
  158. border-top:10px solid {color:Line1};
  159. }
  160.  
  161. #pop1 {
  162. background-color: {color:Line4};
  163. position: fixed;
  164. margin-top:193px;
  165. margin-left:-8px;
  166. text-align:fixed;
  167. height:30px;
  168. padding:4px;
  169. width:100%;
  170. border-bottom:27px solid {color:Line5};
  171.  
  172. }
  173.  
  174. #entries {
  175. position:fixed;
  176. background-color:{color:Entry};
  177. margin-top:100px;
  178. margin-left:595px;
  179. float:left;
  180. padding-top:0px;
  181. text-align:justify;
  182. height:600px;
  183. overflow:auto;
  184. width:518px;
  185. }
  186.  
  187. #banner {
  188. position: fixed;
  189. margin-top:{text:title top};
  190. margin-left:{text:title right};
  191. height:67px;
  192. width:auto;
  193. }
  194.  
  195. .posts {
  196. padding:0px;
  197. text-align:justify;
  198. width:500px;
  199. margin-left:5px;
  200. margin-top:5px;
  201. font-size:10px;
  202. font-family:consolas;
  203. }
  204.  
  205.  
  206. #side {
  207. background-color:{color:Entry};
  208. position: fixed;
  209. margin-top:100px;
  210. margin-left:238px;
  211. text-align:justify;
  212. height:100%;
  213. padding:4px;
  214. width:350px;
  215. }
  216.  
  217.  
  218. #info {
  219. display:block;
  220. background-color:{color:Info};
  221. margin:5px 0px 2px 0px;
  222. padding:4px 5px 4px 5px;
  223. color:{color:Text};
  224. font-size:8px;
  225. font-family: calibri, helvetica, arial;
  226. line-height:110%;
  227. text-transform:uppercase;
  228. width:492px;
  229. text-align:right;
  230. letter-spacing:1px;
  231. }
  232.  
  233. #info a {
  234. color:{color:Links};
  235. }
  236.  
  237. #info a:hover {
  238. color:{color:Links Hover};
  239. }
  240.  
  241. #tags {
  242. margin-right:7px;
  243. font-family:calibri;
  244. text-align:right;
  245. text-transform:lowercase;
  246. font-size:9px;
  247. opacity:1;
  248. -webkit-transition:0.3s linear;
  249. outline: none;
  250. font-style:italic;
  251. }
  252.  
  253. #entries:hover #tags{opacity:1; display:block;}
  254.  
  255. .bubble {
  256. text-align:left;
  257. margin-left:29px;
  258. margin-top:10px;
  259. font-size:10px;
  260. border-bottom: 1px solid {color:Text};
  261. position: relative;
  262. }
  263.  
  264. .askborder {
  265. float: left;
  266. margin-top:0px;
  267. padding: 2px;
  268. border-radius:15px;
  269. }
  270.  
  271. #title2 {
  272. font-size:12px;
  273. font-style:normal;
  274. text-align:center;
  275. line-height:12px;
  276. color:{color:Text};
  277. }
  278.  
  279. #title3 {
  280. font-size:23px;
  281. font-style:normal;
  282. text-align:center;
  283. margin-top:9px;
  284. font-family:'Open Sans Condensed';
  285. line-height:12px;
  286. color:{color:Text};
  287. }
  288.  
  289.  
  290. blockquote {
  291. border-left:3px solid {color:Scrollbar};
  292. padding-left:5px;
  293. margin-right:15px;
  294. margin-left:15px;
  295. }
  296.  
  297. #source {
  298. margin-top:3px;
  299. text-align:right;
  300. margin-bottom:5px;
  301. font-size:10px;
  302. }
  303.  
  304. .chat {
  305. line-height: 12px;
  306. list-style: none;
  307. margin-left:-30px;
  308. }
  309. .chat ul {
  310. line-height: 15px;
  311. list-style: none;
  312. line-height:20px;
  313. }
  314. .person1 {
  315. color: {color:Text}
  316. left:5px;
  317. }
  318. .person1 .label {
  319. font-weight: bold;
  320. color:{color:Text};
  321. }
  322. .person2 {
  323. color: {color:Text};}
  324. left: 5px;
  325. }
  326.  
  327. #billy {
  328. font-family: calibri, helvetica, arial;
  329. text-align: center;
  330. font-size: 12px;
  331. color:{color:Side Text};
  332. text-transform: uppercase;
  333. padding:5px;
  334. width:165px;
  335. background-color:{color:Link Bars};
  336. height:20px;
  337. width:335px;
  338. height:auto;
  339. margin-top:10px;
  340. letter-spacing: 2px;
  341. }
  342.  
  343. .blurb {
  344. font-family: Calibri;
  345. text-align: center;
  346. font-size: 9px;
  347. color:{color:Title};
  348. text-transform: uppercase;
  349. padding:5px;
  350. width:20px;
  351. background-color:{color:Link Bars};
  352. height:20px;
  353. width:335px;
  354. height:7px;
  355. line-height:7px;
  356. margin-top:10px;
  357. letter-spacing: 2px;
  358. }
  359.  
  360. .nivoSlider {
  361. position:relative;
  362. width:345px;
  363. height:345px;
  364. overflow: hidden;
  365. }
  366.  
  367. .nivoSlider img {
  368. position:absolute;
  369. top:0px;
  370. left:0px;
  371. max-width: none;
  372. }
  373.  
  374. .nivo-main-image {
  375. display: block !important;
  376. position: relative !important;
  377. width: 100% !important;
  378. }
  379.  
  380. /* If an image is wrapped in a link */
  381. .nivoSlider a.nivo-imageLink {
  382. position:absolute;
  383. top:0px;
  384. left:0px;
  385. width:100%;
  386. height:100%;
  387. border:0;
  388. padding:0;
  389. margin:0;
  390. z-index:6;
  391. display:none;
  392. }
  393.  
  394. /* The slices and boxes in the Slider */
  395. .nivo-slice {
  396. display:block;
  397. position:absolute;
  398. z-index:5;
  399. height:100%;
  400. top:0;
  401. }
  402.  
  403. .nivo-box {
  404. display:block;
  405. position:absolute;
  406. z-index:5;
  407. overflow:hidden;
  408. }
  409.  
  410. .nivo-box img {
  411. display:block;
  412. }
  413.  
  414. /* Caption styles */
  415. .nivo-caption {
  416. position:absolute;
  417. left:0px;
  418. bottom:0px;
  419. background:#000;
  420. color:#fff;
  421. width:100%;
  422. z-index:8;
  423. padding: 5px 10px;
  424. opacity: 0.8;
  425. overflow: hidden;
  426. display: none;
  427. -moz-opacity: 0.8;
  428. filter:alpha(opacity=8);
  429. -webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
  430. -moz-box-sizing: border-box; /* Firefox, other Gecko */
  431. box-sizing: border-box; /* Opera/IE 8+ */
  432. }
  433.  
  434. .nivo-caption p {
  435. padding:5px;
  436. margin:0;
  437. font-size:14px;
  438. }
  439.  
  440. .nivo-caption a {
  441. display:inline !important;
  442. }
  443.  
  444. .nivo-html-caption {
  445. display:none;
  446. }
  447.  
  448. /* Direction nav styles (e.g. Next & Prev) */
  449.  
  450. .nivo-directionNav a {
  451. position:absolute;
  452. top:45%;
  453. z-index:9;
  454. cursor:pointer;
  455. display:block;
  456. width:31px;
  457. height:34px;
  458. background:url('http://static.tumblr.com/y0x5xm1/ei3mcx19v/arrows.png') no-repeat;
  459. text-indent:-9999px;
  460. border:0;
  461. }
  462.  
  463. .nivoSlider .nivo-directionNav a {
  464. opacity: 0;
  465. -webkit-transition: all 200ms ease-in-out;
  466. -moz-transition: all 200ms ease-in-out;
  467. -o-transition: all 200ms ease-in-out;
  468. transition: all 200ms ease-in-out;
  469. }
  470.  
  471. .nivoSlider:hover .nivo-directionNav a {
  472. opacity: 1;
  473. }
  474.  
  475. a.nivo-nextNav {
  476. background-position:-30px 0;
  477. right:15px;
  478. }
  479.  
  480. a.nivo-prevNav {
  481. left:15px;
  482. }
  483.  
  484. .nivo-prevNav {
  485. left:0px;
  486. }
  487.  
  488. .nivo-nextNav {
  489. right:0px;
  490. }
  491.  
  492. /* Control nav styles (e.g. 1,2,3...) */
  493. .nivo-controlNav {
  494. text-align:center;
  495. padding: 15px 0;
  496. }
  497.  
  498. .nivo-controlNav a {
  499. cursor:pointer;
  500. }
  501.  
  502. .nivo-controlNav a.active {
  503. font-weight:bold;
  504. }
  505.  
  506. #death {
  507. text-align: justify;
  508. padding: 5px;
  509. font-size: 10px;
  510. position:fixed;
  511. margin-top:74px;
  512. margin-left:935px;
  513. -webkit-transition: all .4s ease-in-out;
  514. -moz-transition: all .4s ease-in-out;
  515. -o-transition: all .4s ease-in-out;
  516. }
  517.  
  518. #death:hover {
  519. top:-60px;
  520. }
  521.  
  522. #hitabb {
  523. padding: 4px;
  524. background: {color:Tab};
  525. width:159px;
  526. height:150px;
  527. }
  528.  
  529. #tabb {
  530. height:11px;
  531. padding: 5px;
  532. background:{color:Link Bars};
  533. width: 70px;
  534. color:{color:BLinks};
  535. text-align:center;
  536. text-transform:uppercase;
  537. font-size:8px;
  538. font-family:Lucida Sans Unicode;
  539. letter-spacing:2px;
  540. }
  541.  
  542. .tablink {
  543. position:fixed;
  544. opacity: 1;
  545. margin-left: 700px;
  546. margin-top: 79px;
  547. width: 250px;
  548. -webkit-transition: all 0.7s ease;
  549. -moz-transition: all 0.7s ease;
  550. -o-transition: all 0.7s ease;
  551. }
  552.  
  553. .tablink a{
  554. color: {color:BLinks};
  555. width: 70px;
  556. margin-right:-3px;
  557. margin-bottom: 5px;
  558. display: inline-block;
  559. text-align:center;
  560. text-transform:uppercase;
  561. font-size:8px;
  562. font-family:Lucida Sans Unicode;
  563. letter-spacing:2px;
  564. background-color:{color:Link Bars};
  565. padding:4px;
  566. }
  567.  
  568. .tablink a:hover{
  569. -webkit-transition: all 0.7s ease;
  570. -moz-transition: all 0.7s ease;
  571. -o-transition: all 0.7s ease;
  572. }
  573.  
  574. #billy{
  575. position:fixed ! important;
  576. width: 270px;
  577. height:auto;
  578. margin-top: 490px;
  579. margin-left: 280px;
  580. padding: 3px;
  581. color:{color:Text};
  582. line-height:10px;
  583. font-family:consolas;
  584. font-size:10px;
  585. text-align:center;
  586. z-index:999;
  587. }
  588.  
  589. </style>
  590. {CustomCSS}
  591. </style>
  592. </head>
  593. <body>
  594.  
  595. <div id="billy">
  596. {Description}
  597. <br>
  598. <br>
  599. {block:PreviousPage}<a href="{PreviousPage}"><font size="3">prev</font></a>{/block:PreviousPage}
  600. {block:NextPage}<a href="{NextPage}"><font size="3">next</font></a>{/block:NextPage}
  601. </div></div>
  602.  
  603. <div class="tablink">
  604. <a href="{text:link 1 url}">{text:link 1 title}</a>
  605. <a href="{text:link 2 url}">{text:link 2 title}</a>
  606. <a href="{text:link 3 url}">{text:link 3 title}</a>
  607. </div>
  608.  
  609. <div id="death">
  610. <div id="tabb">{text:tab title}</div>
  611. <div id="hitabb">{text:tab text}
  612. </div></div></div>
  613.  
  614. {block:IfShowLines}
  615. <div id="pop"></div></div>
  616. <div id="pop1"></div>{/block:IfShowLines}
  617.  
  618.  
  619. <div id="banner">
  620. <div id="titleimg">
  621. <img src="{image:Title}"/>
  622. </div></div>
  623.  
  624. <div id="side">
  625. <div class="slider-wrapper theme-default">
  626. <div id="slider" class="nivoSlider">
  627. <a href="/" target="_blank">
  628. <img src="{image:Slide 1}"/></a>
  629. <img src="{image:Slide 2}"/></a>
  630. <img src="{image:Slide 3}" data-transition="slideInLeft" />
  631. </div>
  632.  
  633. <div class="blurb"><b>{Title}</b></div>
  634. </div></div></div>
  635.  
  636. <div id="entries">
  637. {block:Posts}
  638. <div class="posts">
  639. {block:Title}<div id="title3">{Title}</div>{/block:Title}
  640. {block:Text}{Body}{/block:Text}
  641.  
  642. {block:Photo}<center>{LinkOpenTag}<img src="{PhotoURL-500}" alt="{PhotoAlt}"/>{LinkCloseTag}</center>{block:Caption}{Caption}{/block:Caption}{/block:Photo}
  643.  
  644. {block:Photoset}<center>{Photoset-500}</center>{block:Caption}{Caption}{/block:Caption}{/block:Photoset}
  645.  
  646. {block:Quote}<div id="title2">"{Quote}"</div>
  647. {block:Source}<div id="source">— {Source}</div>{/block:Source}{/block:Quote}
  648.  
  649. {block:Link}<div id="title2"><a href="{URL}" class="link" {Target}>{Name}</a></div>
  650. {block:Description}{Description}{/block:Description}
  651. {/block:Link}
  652.  
  653. {block:Chat}<div class="chat"><ul>{block:Lines}<li class="person{UserNumber}">{block:Label}<span class="label">{Label}</span>{/block:Label} {Line}</li>{/block:Lines}</ul></div>{/block:Chat}
  654.  
  655. {block:Audio}<div id="_">{block:AlbumArt}<img src="{AlbumArtURL}" width="80px" height="80px" align="left" style="margin-right:10px" />{/block:AlbumArt}<div style="width:495px; height:30px;padding:2px;background-color:black; margin-left:0px;">
  656. {AudioPlayerBlack}</div><br>
  657. {block:TrackName}<b>Title:</b> {TrackName}<br />{/block:TrackName}
  658. {block:Artist}<b>Artist:</b> {Artist}<br />{/block:Artist}
  659. {block:ExternalAudio}<b>Download:</b> <a href="{ExternalAudioURL}">click here</a><br />{/block:ExternalAudio}<b>Played:</b> {PlayCount} times
  660. {block:Caption}{Caption}{/block:Caption}<br clear="all" /></div> {/block:Audio}
  661.  
  662. {block:Video}{Video-500}{block:Caption}{Caption}{/block:Caption}{/block:Video}
  663.  
  664. {block:Answer}<img src="{AskerPortraitURL-24}" align="left" class="askborder"><div class="bubble"><span></span>{Asker}: {Question}&nbsp;</div>
  665. <div style="margin-left:20px;">
  666. {Answer}</div>{/block:Answer}
  667.  
  668. {block:Date}
  669. <div id="info"><a href="{Permalink}">{MonthNumberWithZero}.{DayOfMonthWithZero}</a>{block:NoteCount} <a href="{Permalink}">({NoteCount})</a>{/block:NoteCount}<br>{block:RebloggedFrom}<a href="{ReblogParentURL}">{ReblogParentName}</a>{/block:RebloggedFrom}
  670. {block:ContentSource}<a href="{SourceURL}">©{SourceLink}</a>{/block:ContentSource}</div>{/block:Date}
  671.  
  672. {block:IfShowTags}
  673. <div id="tags">{block:Tags}#<a href="{TagURL}">{Tag}</a> {/block:Tags}</div>{/block:HasTags}{/block:IfShowTags}</div><br>{/block:posts}{block:PostNotes}{PostNotes}{/block:PostNotes}
  674.  
  675. </div>
  676. </div>
  677. </div>
  678. </body>
  679. </div>
  680. <div style="position:fixed; bottom:3px; right:5px;font-family:arial; font-size:10px;"><a href="http://letsrp.tumblr.com">©</a>
  681. </html>
Advertisement
Add Comment
Please, Sign In to add comment
Public Pastes
We use cookies for various purposes including analytics. By continuing to use Pastebin, you agree to our use of cookies as described in the Cookies Policy.  OK, I Understand
Not a member of Pastebin yet?
Sign Up, it unlocks many cool features!