API tools faq
paste
Advertisement
octomoosey

Mask

octomoosey
Sep 20th, 2014 (edited)
4,866
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 18.12 KB | None | 0 0
raw download clone embed print report
  1. <!-- octomoosey @ tumblr -->
  2.  
  3. <html xmlns="//www.w3.org/1999/xhtml" xml:lang="en" lang="en">
  4. <head><title>{Title}</title>
  5. <link rel="shortcut icon" href="{Favicon}">
  6. <link rel="alternate" type="application/rss+xml" href="{RSS}">
  7. {block:Description}<meta name="description" content="{MetaDescription}" />{/block:Description}
  8.  
  9. <script src="//code.jquery.com/jquery-1.10.2.js"></script>
  10. <script src="//code.jquery.com/ui/1.11.1/jquery-ui.js"></script>
  11.  
  12. <style type="text/css">
  13.  
  14. body {
  15. background-color: #ffffff; /* background color */
  16. font-family: calibri;
  17. font-size: 11px;
  18. letter-spacing: 1px;
  19.  
  20. /* background image url */
  21. background-image: url('//static.tumblr.com/d3c5ec0f6406488176d34f5cb85eb1ef/5x3zqsv/TWMnb6l5f/tumblr_static_1lb6gnk8cdq88c48swsog4g48.gif');
  22. background-position: bottom right;
  23. background-repeat: no-repeat;
  24. background-attachment: fixed;}
  25.  
  26. a {
  27. color:#d77109; /* links color */
  28. text-decoration:none;
  29. -webkit-transition-duration:.6s;
  30. -moz-transition-duration:.6s;
  31. -o-transition-duration:.6s;
  32. -ms-transition-duration:.6s;}
  33.  
  34. a:hover {
  35. color:#aaaaaa; /* links hover color */
  36. -webkit-transition-duration:.6s;
  37. -moz-transition-duration:.6s;
  38. -o-transition-duration:.6s;
  39. -ms-transition-duration:.6s;}
  40.  
  41. #line {
  42. position:fixed;
  43. width:110%;
  44. height:100px;
  45. left:0px;
  46. top:150px;
  47. background-color: #000000;} /* horizontal bar color */
  48.  
  49. #container {
  50. position:fixed;
  51. margin-left:60px;
  52. width: 500px;
  53. height: 550px;
  54. background-color: #fff; /* container background color */
  55. top: 30px; }
  56.  
  57. #icon {
  58. position:fixed;
  59. margin-left:600px;
  60. top:162px;
  61. padding:3px;
  62. border: 3px solid #fff;} /* icon border color */
  63.  
  64. #icon img {
  65. height:64px;
  66. width:64px;}
  67.  
  68. #quote {
  69. position:fixed;
  70. margin-left:680px;
  71. top:162px;
  72. padding:3px;
  73. color:#fff;} /* quote-description text color */
  74.  
  75. .img {
  76. width: 500px;
  77. height: 100px;
  78. overflow:hidden;
  79. top: 0px;
  80. left: 0px; }
  81.  
  82. #tabs{
  83. position: fixed;
  84. margin-top:240px; }
  85.  
  86. #tabs .ui-tabs-nav {
  87. position: absolute;
  88. list-style-type: none;
  89. left: 500px;
  90. width: 300px;
  91. top: 0px; }
  92.  
  93. #tabs- .ui-tabs-nav li {
  94. border-left: none; }
  95.  
  96. #tabs .ui-tabs-nav li.ui-tabs-selected, { }
  97. #tabs .ui-tabs-nav li.ui-state-active { }
  98. #tabs .ui-tabs-nav .ui-state-focus a {
  99. outline: none;}
  100.  
  101. #tabs .ui-tabs-nav li a {
  102. text-decoration: none;
  103. font-weight: bold;
  104. line-height: 16px;}
  105.  
  106. #tabs ul li a:hover {
  107. text-decoration: underline;}
  108.  
  109. #tabs #Content_Area {
  110. background-color: #ffffff; /* tab content background color */
  111. clear:both;
  112. overflow:hidden;
  113. line-height:18px;
  114. position: relative;
  115. top: -120px;
  116. z-index: 5;
  117. height: 500px;
  118. width:500px;
  119. overflow: auto;}
  120.  
  121. p { padding-left: 10px; }
  122.  
  123. #grouptitle {
  124. color:#000; /* link group title color */
  125. text-transform:uppercase;
  126. font-size:13px;
  127. margin-top:15px;
  128. margin-bottom:5px;
  129. border-bottom:1px solid #000; /* group title border color */
  130. padding:8px;}
  131.  
  132. #grouplinks {
  133. margin-top:0px;
  134. padding:8px;
  135. margin-left:0px;}
  136.  
  137. table {
  138. margin-top:-9px;
  139. width: 100%;
  140. margin-left:-2px;
  141. background-color: transparent;
  142. border-collapse: collapse;}
  143.  
  144. td{
  145. font-family: calibri;
  146. font-size: 11px;
  147. letter-spacing: 1px;
  148. height: 100px;
  149. overflow: auto;}
  150.  
  151. #rel img {
  152. margin:8px;
  153. border:5px solid #000; /* relationships icon border color */
  154. width:80px;
  155. height:80px;
  156. padding:5px;
  157. -webkit-transition:all 0.3s ease-out;
  158. -moz-transition:all 0.3s ease-out;
  159. transition:all 0.3s ease-out;}
  160.  
  161. #rel:hover img {
  162. border:5px solid #d77109; /* relationships icon border hover color */
  163. -webkit-transition:all 0.3s ease-out;
  164. -moz-transition:all 0.3s ease-out;
  165. transition:all 0.3s ease-out;}
  166.  
  167. #blogroll img {
  168. margin:8px;
  169. border:5px solid #000; /* blogroll icon border color */
  170. display:table;
  171. float:left;
  172. padding:5px;
  173. -webkit-transition:all 0.3s ease-out;
  174. -moz-transition:all 0.3s ease-out;
  175. transition:all 0.3s ease-out;}
  176.  
  177. #blogroll:hover img {
  178. border:5px solid #d77109; /* blogroll icon border hover color */
  179. -webkit-transition:all 0.3s ease-out;
  180. -moz-transition:all 0.3s ease-out;
  181. transition:all 0.3s ease-out;}
  182.  
  183.  
  184. </style>
  185. </head>
  186. <body>
  187.  
  188. <div id="line"></div>
  189. <div id="icon"><img src="{PortraitURL-64}"></div>
  190. <div id="quote">
  191.  
  192. <!-- change the main urls here -->
  193. <a href="/">home</a> ♦
  194. <a href="/ask">ask</a> ♦
  195. <a href="/submit">submit</a> ♦
  196. <a href="/archive">archive</a> ♦
  197. <a href="//www.tumblr.com/dashboard">dash</a> ♦
  198. <a href="//octomoosey.tumblr.com/">©</a><br><br> <!-- DO NOT REMOVE CREDIT -->
  199.  
  200. <!-- change the description/quote here -->
  201. There is a face beneath this mask, but it isn’t me.<br>I’m no more that face than I am the muscles beneath it, <br>or the bones beneath that.”
  202. ― Steve Moore, V for Vendetta</div>
  203.  
  204. <div id="container">
  205.  
  206. <!-- change the tab TITLES here - do not change the URL -->
  207. <div id="tabs">
  208. <ul>
  209. <li><a href="#tab-1"><span>About || Bio</span></a></li>
  210. <li><a href="#tab-2"><span>Tags</span></a></li>
  211. <li><a href="#tab-3"><span>Relationships</span></a></li>
  212. <li><a href="#tab-4"><span>Blogroll</span></a></li>
  213. <li><a href="#tab-5"><span>Disclaimer || Rules</span></a></li>
  214. </ul>
  215.  
  216. <!-- THIS IS WHERE YOUR TABBED CONTENT STARTS -->
  217.  
  218. <!-- THIS IS WHERE YOUR ABOUT/BIO STARTS -->
  219. <div id="tab-1">
  220. <div id="Content_Area">
  221.  
  222. <!-- change the image url of your 'about' page here image size is 500px wide by 100px high -->
  223. <div class="img"><img src="//31.media.tumblr.com/2603c3495b0ddd29fbe671dc025dae06/tumblr_inline_nc7gtzdnQL1si7bjl.gif"></div>
  224.  
  225. <!-- add your bio/about information here -->
  226.  
  227. <p align="center"><b>Your Character || Indie RP Blog</b>
  228. <p>
  229. <p align="center" span style="line-height: 20px; color: #d77109; font-size:18px">H i s t o r y<p>
  230.  
  231. Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.<p>
  232. Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.<p>
  233.  
  234. <p align="center" span style="line-height: 20px; color: #d77109; font-size:18px">T o d a y<p>
  235.  
  236. Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque laudantium, totam rem aperiam, eaque ipsa quae ab illo inventore veritatis et quasi architecto beatae vitae dicta sunt explicabo. Nemo enim ipsam voluptatem quia voluptas sit aspernatur aut odit aut fugit, sed quia consequuntur magni dolores eos qui ratione voluptatem sequi nesciunt. Neque porro quisquam est, qui dolorem ipsum quia dolor sit amet, consectetur, adipisci velit, sed quia non numquam eius modi tempora incidunt ut labore et dolore magnam aliquam quaerat voluptatem. Ut enim ad minima veniam, quis nostrum exercitationem ullam corporis suscipit laboriosam, nisi ut aliquid ex ea commodi consequatur? Quis autem vel eum iure reprehenderit qui in ea voluptate velit esse quam nihil molestiae consequatur, vel illum qui dolorem eum fugiat quo voluptas nulla pariatur?<p>
  237.  
  238. Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque laudantium, totam rem aperiam, eaque ipsa quae ab illo inventore veritatis et quasi architecto beatae vitae dicta sunt explicabo. Nemo enim ipsam voluptatem quia voluptas sit aspernatur aut odit aut fugit, sed quia consequuntur magni dolores eos qui ratione voluptatem sequi nesciunt. Neque porro quisquam est, qui dolorem ipsum quia dolor sit amet, consectetur, adipisci velit, sed quia non numquam eius modi tempora incidunt ut labore et dolore magnam aliquam quaerat voluptatem. Ut enim ad minima veniam, quis nostrum exercitationem ullam corporis suscipit laboriosam, nisi ut aliquid ex ea commodi consequatur? Quis autem vel eum iure reprehenderit qui in ea voluptate velit esse quam nihil molestiae consequatur, vel illum qui dolorem eum fugiat quo voluptas nulla pariatur?
  239. </div></div>
  240.  
  241. <!-- THIS IS WHERE YOUR ABOUT/BIO PAGE ENDS -->
  242.  
  243. <!-- THIS IS WHERE YOUR TAGS/NAVIGATION PAGE STARTS -->
  244.  
  245. <div id="tab-2">
  246. <div id="Content_Area">
  247.  
  248. <!-- change the image url of your 'tags' page here image size is 500px wide by 100px high -->
  249.  
  250. <div class="img"><img src="//31.media.tumblr.com/2603c3495b0ddd29fbe671dc025dae06/tumblr_inline_nc7gtzdnQL1si7bjl.gif"></div>
  251.  
  252. <!-- ADD AS MANY GROUPS AS YOU LIKE - COPY FROM HERE DOWN TO THE DIV BENEATH LINK TWELVE AND JUST PASTE BENEATH - MAKE SURE TO INCLUDE THE END DIV -->
  253.  
  254. <div id="grouptitle">about + ooc</div> <!-- change the group title here -->
  255.  
  256. <div id="grouplinks">
  257.  
  258. <!-- add your navigation links here -->
  259.  
  260. <a href="/">link one</a> +
  261. <a href="/">link two</a> +
  262. <a href="/">link three</a> +
  263. <a href="/">link four</a> +
  264. <a href="/">link five</a> +
  265. <a href="/">link six</a> +
  266. <a href="/">link seven</a> +
  267. <a href="/">link eight</a> +
  268. <a href="/">link nine</a> +
  269. <a href="/">link ten</a> +
  270. <a href="/">link eleven</a> +
  271. <a href="/">link twelve</a>
  272. </div>
  273.  
  274. <div id="grouptitle">graphics</div>
  275. <div id="grouplinks">
  276.  
  277. <a href="/">link one</a> +
  278. <a href="/">link two</a> +
  279. <a href="/">link three</a> +
  280. <a href="/">link four</a> +
  281. <a href="/">link five</a> +
  282. <a href="/">link six</a> +
  283. <a href="/">link seven</a> +
  284. <a href="/">link eight</a> +
  285. <a href="/">link nine</a> +
  286. <a href="/">link ten</a> +
  287. <a href="/">link eleven</a> +
  288. <a href="/">link twelve</a>
  289. </div>
  290.  
  291. <div id="grouptitle">muse tags</div>
  292. <div id="grouplinks">
  293.  
  294. <a href="/">link one</a> +
  295. <a href="/">link two</a> +
  296. <a href="/">link three</a> +
  297. <a href="/">link four</a> +
  298. <a href="/">link five</a> +
  299. <a href="/">link six</a> +
  300. <a href="/">link seven</a> +
  301. <a href="/">link eight</a> +
  302. <a href="/">link nine</a> +
  303. <a href="/">link ten</a> +
  304. <a href="/">link eleven</a> +
  305. <a href="/">link twelve</a>
  306. </div>
  307.  
  308. <div id="grouptitle">memes</div>
  309. <div id="grouplinks">
  310.  
  311. <a href="/">link one</a> +
  312. <a href="/">link two</a> +
  313. <a href="/">link three</a> +
  314. <a href="/">link four</a> +
  315. <a href="/">link five</a> +
  316. <a href="/">link six</a> +
  317. <a href="/">link seven</a> +
  318. <a href="/">link eight</a> +
  319. <a href="/">link nine</a> +
  320. <a href="/">link ten</a> +
  321. <a href="/">link eleven</a> +
  322. <a href="/">link twelve</a>
  323. </div>
  324.  
  325. <div id="grouptitle">magic anons</div>
  326. <div id="grouplinks">
  327.  
  328. <a href="/">link one</a> +
  329. <a href="/">link two</a> +
  330. <a href="/">link three</a> +
  331. <a href="/">link four</a> +
  332. <a href="/">link five</a> +
  333. <a href="/">link six</a> +
  334. <a href="/">link seven</a> +
  335. <a href="/">link eight</a> +
  336. <a href="/">link nine</a> +
  337. <a href="/">link ten</a> +
  338. <a href="/">link eleven</a> +
  339. <a href="/">link twelve</a>
  340. </div>
  341.  
  342. </div></div>
  343.  
  344. <!-- THIS IS WHERE YOUR TAGS/NAVIGATION PAGE ENDS -->
  345.  
  346. <!-- THIS IS WHERE YOUR RELATIONSHIPS PAGE STARTS -->
  347.  
  348. <div id="tab-3">
  349. <div id="Content_Area">
  350.  
  351. <table>
  352.  
  353. <!-- CHARACTER ONE STARTS HERE -->
  354.  
  355. <tr><td> <div id="rel">
  356.  
  357. <a href="/"><!-- ADD THE THE LINK TO THE CHARACTER HERE -->
  358.  
  359. <!-- ADD THE THE URL TO AN ICON HERE -->
  360. <img src="//media.tumblr.com/688c55cb759331a09fa5e5c736b33009/tumblr_inline_nbum2nUCn81ronkfd.jpg" /></a></div></td>
  361.  
  362. <!-- ADD YOUR DESCRIPTION HERE -->
  363. <td><div style="height:100px; overflow:auto">Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</div></td></tr>
  364.  
  365. <!-- CHARACTER ONE ENDS HERE -->
  366.  
  367. <!-- CHARACTER TWO STARTS HERE -->
  368.  
  369. <tr><td> <div id="rel">
  370.  
  371. <a href="/">
  372.  
  373. <img src="//media.tumblr.com/d4636f1e7309c3adcc86651edd6bac97/tumblr_inline_nbuf29glAF1ronkfd.jpg" /></a></div></td>
  374.  
  375. <td><div style="height:100px; overflow:auto">Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</div></td></tr>
  376.  
  377. <!-- CHARACTER TWO ENDS HERE -->
  378.  
  379. <tr><td> <div id="rel">
  380.  
  381. <a href="/">
  382.  
  383. <img src="//media.tumblr.com/b269bd5e0e46920206670fd940240fcc/tumblr_inline_nbumb9Rgwu1ronkfd.jpg" /></a></div></td>
  384.  
  385. <td><div style="height:100px; overflow:auto">Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</div></td></tr>
  386.  
  387. <tr><td> <div id="rel">
  388.  
  389. <a href="/">
  390.  
  391. <img src="//media.tumblr.com/7b40d8221edecbf765e83337451ffc94/tumblr_inline_nbuezc7X9m1ronkfd.jpg" /></a></div></td>
  392.  
  393. <td><div style="height:100px; overflow:auto">Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</div></td></tr>
  394.  
  395. <tr><td> <div id="rel">
  396.  
  397. <a href="/">
  398.  
  399. <img src="//media.tumblr.com/688c55cb759331a09fa5e5c736b33009/tumblr_inline_nbum2nUCn81ronkfd.jpg" /></a></div></td>
  400.  
  401. <td><div style="height:100px; overflow:auto">Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</div></td></tr>
  402.  
  403. <tr><td> <div id="rel">
  404.  
  405. <a href="/">
  406.  
  407. <img src="//media.tumblr.com/d4636f1e7309c3adcc86651edd6bac97/tumblr_inline_nbuf29glAF1ronkfd.jpg" /></a></div></td>
  408.  
  409. <td><div style="height:100px; overflow:auto">Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</div></td></tr>
  410.  
  411. </table>
  412. </div></div>
  413.  
  414. <!-- THIS IS WHERE YOUR RELATIONSHIPS PAGE ENDS -->
  415.  
  416. <!-- THIS IS WHERE YOUR BLOGROLL STARTS -->
  417.  
  418. <div id="tab-4">
  419. <div id="Content_Area">
  420. {block:Following}
  421. {block:Followed}
  422. <div id="blogroll">
  423. <a href="{FollowedURL}" title="{FollowedName}"><img src="{FollowedPortraitURL-64}"/></a>
  424. </div>
  425. {/block:Followed}
  426. {/block:Following}
  427.  
  428. </div></div>
  429.  
  430. <!-- THIS IS WHERE YOUR BLOGROLL ENDS -->
  431.  
  432. <!-- THIS IS WHERE YOUR DISCLAIMER/RULES/GUIDELINES PAGE STARTS -->
  433.  
  434. <div id="tab-5">
  435. <div id="Content_Area">
  436.  
  437. <!-- change the image url of your 'disclaimer' page here image size is 500px wide by 100px high -->
  438.  
  439. <div class="img"><img src="//31.media.tumblr.com/2603c3495b0ddd29fbe671dc025dae06/tumblr_inline_nc7gtzdnQL1si7bjl.gif"></div>
  440. <p align="center" span style="line-height: 20px; color: #d77109; font-size:18px">D i s c l a i m e r;<p>
  441.  
  442. Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.<p>
  443. Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
  444.  
  445. </div></div>
  446.  
  447. <!-- THIS IS WHERE YOUR DISCLAIMER/RULES/GUIDELINES PAGE ENDS -->
  448. </div>
  449.  
  450.  
  451. <script>
  452. $("#tabs").tabs({
  453. show: function(event, ui) {
  454. var $target = $(ui.panel);
  455.  
  456. $('.content:visible').effect(
  457. 'explode',
  458. {},
  459. 1500,
  460. function(){
  461. $target.fadeIn();
  462. });
  463. }
  464. });</script>
  465.  
  466. </body>
  467. </html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement
Public Pastes
Advertisement
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!