HellaBlind

akenhaten

Dec 20th, 2019 (edited)
142
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 9.86 KB | None | 0 0
  1. <!--
  2.  
  3. THEME 10 [BOUSSOLE] by saisei-themes @ tumblr
  4.  
  5. - do not repost
  6. - do not claim as your own
  7. - do not use as base
  8. - enjoy !
  9.  
  10. -->
  11.  
  12.  
  13. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  14. <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
  15.  
  16. <head>
  17.  
  18. <link href="https://fonts.googleapis.com/css?family=Quicksand" rel="stylesheet">
  19.  
  20.  
  21. <title>{Title}</title>
  22.  
  23. <link rel="shortcut icon" href="{Favicon}">
  24. <link rel="alternate" type="application/rss+xml" href="{RSS}">
  25.  
  26.  
  27. <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.0/jquery.min.js"></script>
  28.  
  29. <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.0/jquery.min.js"></script>
  30.  
  31. <script src="https://npmcdn.com/isotope-layout@3.0/dist/isotope.pkgd.min.js"></script>
  32.  
  33. <script src="https://use.fontawesome.com/257106a2c1.js"></script>
  34.  
  35. <script>
  36. $(document).ready(function() {
  37. var $container = $('.grid').isotope({
  38. itemSelector: '.grid-item',
  39. masonry: {
  40. columnWidth: 100
  41. }
  42. });
  43.  
  44. $('.btn').click(function () {
  45. $(this) // wrap this, it always refers to the clicked event element
  46. .parents('.grid-item')// find parent grid item
  47. .find('.drop, .drop2, .drop3') // find adjacent drop
  48. .toggle('slow'); // only toggle that one element
  49.  
  50. });
  51.  
  52. $('.btn').click(function () {
  53. $(this)
  54. .parents('.one')
  55. .find('.grid-item')
  56. .toggleClass('fullsize');
  57. $container.isotope('layout');
  58. });
  59.  
  60. });
  61. </script>
  62.  
  63. <style type="text/css">
  64.  
  65. /* POPUP BOXES */
  66.  
  67. .popup_block{
  68. display:none;
  69. background:{color:posts};
  70. padding:20px;
  71. border:5px solid {color:accent};
  72. outline: 1px solid {color:border};
  73. float:left;
  74. position:fixed;
  75. top:50%;left:50%;
  76. z-index: 99999;
  77. font-size: {text:font size}px;
  78. }
  79.  
  80. *html #fade {position: absolute;}
  81. *html .popup_block {position: absolute;}
  82. #fade {
  83. display:none;
  84. position:fixed;
  85. left:0px;
  86. top:0px;
  87. width:100%;
  88. height:100%;
  89. z-index:9999;
  90. background:#000; /* change to #fff for solid white */
  91. opacity:0.2; /* change to opacity:1; */
  92. }
  93.  
  94. #popheading {
  95. font-size: 35px;
  96. font-family: 'radiometry';
  97. color: {color:border};
  98. border-bottom: 1px solid {color:border2};
  99. padding-bottom: 5px;
  100. padding-top: 5px;
  101. margin-bottom: 10px;
  102. }
  103.  
  104. /* CUSTOM FONT */
  105.  
  106. @font-face { font-family: "silkscreen"; src: url('https://dl.dropboxusercontent.com/s/4bj79wi75v77m0r/slkscr.ttf?dl=1'); format(“truetype”);}
  107.  
  108. @font-face { font-family: "bebas_neue"; src: url('https://dl.dropboxusercontent.com/s/scbj3da4dz3dfmf/bebasneue.otf?dl=1'); format(“truetype”);}
  109.  
  110. .dc::-webkit-scrollbar{ width: 5px; }
  111.  
  112. .dc::-webkit-scrollbar-thumb{ background-color: #e6e6e6;}
  113.  
  114. .dc::-webkit-scrollbar-track { background-color: #f6f6f6;}
  115.  
  116.  
  117. /* TEXT STUFF */
  118.  
  119. h1, h2 {
  120. font-size: 25px;
  121. font-family: 'radiometry';
  122. }
  123.  
  124. small, sup, sub {
  125. font-size: {text:font size}px;
  126. }
  127.  
  128. a {
  129. text-decoration: none;
  130. color: #999;
  131. -webkit-transition: all .8s ease-in-out;
  132. -moz-transition: all .8s ease-in-out;
  133. -o-transition: all .8s ease-in-out;
  134. transition: all .8s ease-in-out;
  135. font-style: bold;
  136. }
  137.  
  138. a:hover {
  139. color: #cfcfcf;
  140. -webkit-transition: all .8s ease-in-out;
  141. -moz-transition: all .8s ease-in-out;
  142. -o-transition: all .8s ease-in-out;
  143. transition: all .8s ease-in-out;
  144. }
  145.  
  146. b, strong {
  147. color: #919191;
  148. }
  149.  
  150. i, em {
  151. color: #cfcfcf;
  152. }
  153.  
  154. /* BODY */
  155.  
  156. body {
  157. background: url('http://i.imgur.com/fzhm3tM.png');
  158. margin: 0px;
  159. padding: 0px;
  160. color: {color:text};
  161. font-family: quicksand;
  162. font-size: 13px;
  163. overflow-y: scroll;
  164. overflow-x: hidden;
  165. font-size: {text:font size}px;
  166. -webkit-font-smoothing:antialiased;
  167. }
  168.  
  169. /* GRID */
  170.  
  171. .grid {
  172. margin-left: auto;
  173. margin-right: auto;
  174. margin-top: 50px;
  175. margin-bottom: 50px;
  176. width: 600px;
  177. height: 100%;
  178. }
  179.  
  180. .grid:after {
  181. display: inline-block;
  182. clear: both;
  183. content: '';
  184. }
  185.  
  186. .grid-item {
  187. float: left;
  188. margin: 10px;
  189. width: 150px;
  190. height: 150px;
  191. font-size: 10px;
  192. }
  193.  
  194. .grid-item img {
  195. height: 100px;
  196. width: 100px;
  197. }
  198.  
  199. .grid-item.fullsize {
  200. float: left;
  201. height: 350px;
  202. position: relative;
  203. }
  204.  
  205. /* PAGE HEADER */
  206.  
  207. #top {
  208. position: relative;
  209. background: #999;
  210. color: #fff;
  211. width: 100%;
  212. padding: 5px;
  213. font-size: 30px;
  214. top: 0px;
  215. text-align: center;
  216. border-bottom: 2px solid #5e0404;
  217. letter-spacing: 2px;
  218. font-family:'bebas_neue';
  219. text-shadow: 0px 1px 2px #aa8383;
  220. }
  221.  
  222. /* ROW */
  223.  
  224. .one {
  225. width: 500px;
  226. }
  227.  
  228. /* ICONS */
  229.  
  230. .icon {
  231. position: absolute;
  232. top: 0;
  233. right: 0;
  234. border: 5px solid #fff;
  235. height: 100px;
  236. width: 100px;
  237. outline: 1px solid #e6e6e6;
  238. }
  239.  
  240. /* NAME BUTTON */
  241.  
  242. .btn {
  243. background-color: #999;
  244. color:#fff;
  245. font-size: 8px;
  246. font-family: 'silkscreen';
  247. margin-top: 115px;
  248. padding:3px;
  249. margin-left: 40px;
  250. border: none;
  251. text-align: left;
  252. width: 110px;
  253. -webkit-font-smoothing: none;
  254. border-bottom: 1px solid #5e0404;
  255. }
  256.  
  257. .btn:after {
  258. position: absolute;
  259. right: 0;
  260. top: 118px;
  261. padding: 0 5px;
  262. content: "";
  263. font-weight: 100;
  264. }
  265.  
  266. .btn:focus {
  267. outline: 0;
  268. }
  269.  
  270. /* BOXES */
  271.  
  272. .drop {
  273. background-color: #fff;
  274. height: 200px;
  275. width: 488px;
  276. position: absolute;
  277. margin-top: 10px;
  278. color: #919191;
  279. display:none;
  280. text-align: justify;
  281. margin-left: 40px;
  282. padding: 10px;
  283. border: 1px solid #e6e6e6;
  284. letter-spacing: .5px;
  285. z-index: 9999;
  286. }
  287.  
  288. .drop2 {
  289. background-color: #fff;
  290. height: 200px;
  291. width: 488px;
  292. position: absolute;
  293. margin-top: 10px;
  294. color: #919191;
  295. display:none;
  296. text-align: justify;
  297. margin-left: -160px;
  298. padding: 10px;
  299. border: 1px solid #e6e6e6;
  300. z-index: 9999;
  301. }
  302.  
  303. .drop3 {
  304. background-color: #fff;
  305. height: 200px;
  306. width: 488px;
  307. position: absolute;
  308. margin-top: 10px;
  309. color: #919191;
  310. display:none;
  311. text-align: justify;
  312. margin-left: -360px;
  313. padding: 10px;
  314. border: 1px solid #e6e6e6;
  315. z-index: 9999;
  316. }
  317.  
  318. .dc {
  319. width: 465px;
  320. height: 155px;
  321. overflow-y: scroll;
  322. padding: 10px;
  323. position: absolute;
  324. font-size: 11px;
  325. margin-top: 5px;
  326. }
  327.  
  328. /* BOX HEADER */
  329.  
  330. #boxtop {
  331. width: 100%;
  332. margin: -10px -10px 0px -10px;
  333. text-transform: uppercase;
  334. font-size: 15px;
  335. }
  336.  
  337. #header {
  338. font-family: 'bebas_neue';
  339. color: #fff;
  340. position: relative;
  341. letter-spacing: 1px;
  342. background: #999;
  343. padding: 5px;
  344. width: 48%;
  345. text-transform: capitalize;
  346. display: inline-block;
  347. }
  348.  
  349. #subtitle {
  350. font-family: 'bebas_neue';
  351. color: #919191;
  352. position: relative;
  353. letter-spacing: 1px;
  354. border-bottom: 1px solid #e6e6e6;
  355. padding: 5px 9px 4px 10px;
  356. float: right;
  357. width: 50%;
  358. text-transform: uppercase;
  359. display: inline-block;
  360. margin-right: -20px;
  361. text-align: left;
  362. }
  363.  
  364. /* INFO SECTION */
  365.  
  366. .basic {
  367. width: 100%;
  368. margin-top: -10px;
  369. }
  370.  
  371. .info {
  372. width: 50%;
  373. display: inline-block;
  374. }
  375.  
  376. .info li {
  377. border-bottom: 1px solid #e6e6e6;
  378. list-style-type: none;
  379. padding:3px 0px 3px 0px;
  380. }
  381.  
  382. .info li:before {
  383. font-family: 'FontAwesome';
  384. content:"\f101";
  385. padding-right: 4px;
  386. }
  387.  
  388. /* LINKS */
  389.  
  390. .links {
  391. width: 45%;
  392. float:right;
  393. display: inline-block;
  394. margin-left: 10px;
  395. padding-top: 5px;
  396. }
  397.  
  398. .links a, .links i {
  399. display: inline-block;
  400. font-size: 10px;
  401. padding: 3px 0px 3px 0px;
  402. }
  403.  
  404. .links i {
  405. padding-right: 7px;
  406. color: #919191;
  407. }
  408.  
  409.  
  410. /* CREDIT - DO NOT DELETE */
  411.  
  412. #cred {
  413. background-color: #999;
  414. font-family: 'bebas neue';
  415. font-size: 10px;
  416. color: #fff;
  417. padding: 5px 6px 5px 6px;
  418. width: 15px;
  419. border: 2px solid #fff;
  420. outline: 1px solid #999;
  421. float:bottom;
  422. top: 95%;
  423. left: 10px;
  424. position: fixed;
  425. }
  426.  
  427. #cred a {
  428. color: #fff;
  429. font-size: 12px;
  430. letter-spacing: 3px;
  431. }
  432.  
  433. </style></head>
  434.  
  435. <body>
  436. <div id="top">Akenhaten I</div>
  437.  
  438. <div class="grid">
  439.  
  440. <!--BEGIN FIRST ROW -->
  441.  
  442. <!-- FIRST MUSE -->
  443.  
  444. <div class="one">
  445. <div class="grid-item">
  446. <div class="icon"><img src="https://cdn.discordapp.com/attachments/376215349718155267/571086105705840691/6048ec48c647b6b298eb3fd19087fd24.png"></div>
  447. <button class="btn"><center>"Come. You will all be turned into mummies."</button>
  448.  
  449. <div class="drop">
  450.  
  451. <div id="boxtop">
  452. <div id="header">SHINY PALOSSAND</div><div id="subtitle">"Weakness is a sin..."</div></div>
  453.  
  454. <div class="dc">
  455.  
  456. <div class="basic">
  457. <div class="info">
  458.  
  459. <!-- WRITE BASIC INFO HERE, EACH LINE BETWEEN <li></li> TAGS. -->
  460.  
  461. <li><b>origin:</b> SINNOH</li>
  462. <li><b>gender:</b> MALE</li>
  463. <li><b>age:</b> N/A</li>
  464. </div>
  465.  
  466. <!-- LINK SECTION -->
  467.  
  468. <div class="links">
  469. <i class="fa fa-tag" aria-hidden="true"></i><a target="_blank" href="https://cdn.discordapp.com/attachments/376215349718155267/571086431779422208/58b2082b71596435ae6f108e5a71ed78.png">Sand Castle Pokémon.</a>
  470. <br>
  471. <i class="fa fa-heart" aria-hidden="true"></i><a href="LINK URL">Widowed Pharaoh.</a>
  472.  
  473. <br>
  474. <i class="fa fa-user" aria-hidden="true"></i><a target="_blank" href="https://pokemondb.net/pokedex/palossand">Pokédex.</a></div>
  475. </div>
  476.  
  477. <!-- BIOGRAPHY/INFO SECTION -->
  478.  
  479. <p><center>
  480. <u>Nature</u>: Relaxed<br>
  481. <u>Ability</u>: Water Compaction<br>
  482. <u>Held Item</u>: Weakness Policy <br>
  483. <u>Moveset</u>: Shore Up - Sandstorm - Giga Drain<br>
  484. Iron Defense - Shadow Ball - Earth Power<p>
  485. A Pharaoh of old whose reign rivaled no other in the sea of sand, long before anyone you once knew set foot within them. They believed that death would be enough to thwart his rule, but from the grave he rises without the burden of a mortal shell to deter him.<p>
  486. A <a target="_blank" href="https://roleplay.chat/profile.php?user=Khepri">disappointment</a> of a daughter.<br>
  487. A <a target="_blank" href="https://roleplay.chat/profile.php?user=Ankh">prince</a> of the sands.</p>
  488.  
  489. <p><u>Out of Sand</u><p>
  490. ICLY is a huge sandy vagina, OOCLY is pretty chill.<br>
  491. Dark themes. Hit me up.<br>
  492. Questions? Comments? Criticism? Stuff them into the fan mail slot.<br> I'll get to it eventually. Probably not.<br>
  493. T1 battles. Don't god mod me.<br>
  494. Not here to get you off, you worthless peon.<br>
  495. FC is Crocodile from One Piece. Art isn't mine, code isn't mine.
  496. </p>
  497.  
  498. </div>
  499. </div>
  500. </div>
Add Comment
Please, Sign In to add comment