Advertisement
Guest User

Untitled

a guest
Mar 17th, 2018
58
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 15.28 KB | None | 0 0
  1. <!-------------------- ABOUT ME ------------------>
  2.  
  3. <style>
  4.  
  5. @import url('https://fonts.googleapis.com/css?family=Pinyon+Script|Bellefair|Allura|Alex+Brush|Carrois+Gothic|Cormorant+Garamond|Dancing+Script|Great+Vibes|Kaushan+Script|Marcellus|Sacramento|Tangerine');
  6. @import url('https://fonts.googleapis.com/css?family=Yesteryear|Merienda|Satisfy|Cagliostro');
  7.  
  8. .ichiraku {DO NOT REMOVE CREDIT FROM THE CODE}
  9.  
  10. body {
  11. background-color:#191919;
  12. background-attachment:fixed;
  13. color:#f1f1f1;
  14.  
  15. }
  16.  
  17. div, li {
  18. color:#f1f1f1;
  19. font-weight:lighter;
  20. font-family:"Cormorant Garamond";
  21.  
  22. }
  23. ::-webkit-scrollbar-thumb:vertical {
  24. background-color: #f1f1f1;
  25. height: 7px;
  26. width:5px;
  27. }
  28. ::-webkit-scrollbar-thumb:horizontal{
  29. background-color: #f1f1f1;
  30. height: 1px;
  31. width:5px;
  32.  
  33. }
  34. ::-webkit-scrollbar {
  35. height:2px;
  36. width:2px;
  37. }
  38.  
  39. .banner{
  40. position: absolute;
  41. left:50%;
  42. margin-left:-225px;
  43. top:60%;
  44. margin-top:-300;
  45. background-color:#191919;
  46. width: 450px;
  47. text-align:left;
  48. font-family:"Cormorant Garamond";
  49. }
  50.  
  51. .navigation {
  52. text-align:center;
  53. position: absolute;
  54. height:500px;
  55. left:50%;
  56. top:60%;
  57.  
  58. margin-left:-254px;
  59. margin-top:-300px;
  60. background-color:transparent;
  61.  
  62. }
  63.  
  64. .shannaro{
  65. position:absolute;
  66. left:50%;
  67. top:60%;
  68. width:455px;
  69. text-align:right;
  70. font-size:30px;
  71. letter-spacing:5px;
  72. color:#f1f1f1;
  73. margin-left:-225px;
  74. margin-top:-345px;
  75. text-shadow: 2px 2px #464646;
  76.  
  77. }
  78. .tabs {
  79. position: absolute;
  80. left:50%;
  81. margin-left:-225px;
  82. top:60%;
  83. margin-top:200;
  84. min-height: 30px;
  85.  
  86. width: 450px;
  87. text-align:left;
  88. font-family:"Cormorant Garamond";
  89. }
  90. .tab {
  91. background-color: inherit;
  92. color: black;
  93.  
  94. font-size:11px;
  95. font-weight:bold;
  96. font-family:"Marcellus";
  97. display:inline-block;
  98.  
  99. }
  100. .tab label {
  101.  
  102. text-transform:uppercase;
  103. background:#f1f1f1;
  104.  
  105. width:110px;
  106. display:block;
  107. text-align:center;
  108.  
  109. }
  110. .tab label:hover {
  111. background: #7b7b7b;
  112.  
  113. transition:.9s;
  114. }
  115. .tab [type=radio] {
  116. display: none;
  117. }
  118. .content {
  119. position: absolute;
  120. position: absolute;
  121. text-align: justify;
  122. bottom: 30px;
  123. left: 1;
  124. font-family: calibri;
  125. letter-spacing: 1px;
  126. font-size: 10px;
  127. background-color: #191919;
  128. right: 3;
  129. top: -270;
  130. padding: 10px;
  131.  
  132. }
  133. [type=radio]:checked ~ label {
  134. background: #232323;
  135. color:#e9e6fa;
  136. z-index: 2;
  137. }
  138. [type=radio]:checked ~ label ~ .content {
  139. z-index: 1;
  140. }
  141. .basic {
  142. display:inline-block;
  143. width:223px;
  144. height:202px;
  145. color:#f1f1f1;
  146. padding:5px;
  147. font-size:12px;
  148. font-family:"Cormorant Garamond";
  149. overflow:auto;
  150. background:#232323;
  151.  
  152. border:1px solid black;
  153. }
  154.  
  155. .bio {
  156.  
  157. width:410px;
  158.  
  159. height:200px;
  160. background:#232323;
  161. font-weight:bold;
  162. border:1px solid black;
  163. color:#f1f1f1;
  164. font-size:12px;
  165. padding:5px;
  166. text-align:justify;
  167. font-family:"Cormorant Garamond";
  168. overflow:auto;
  169. }
  170.  
  171. .extra {
  172.  
  173. width:222px;
  174.  
  175. height:200px;
  176. background:#232323;
  177. font-weight:bold;
  178. border:1px solid black;
  179. color:#f1f1f1;
  180. font-size:12px;
  181. padding:5px;
  182. text-align:justify;
  183. font-family:"Cormorant Garamond";
  184. overflow:auto;
  185. }
  186.  
  187.  
  188. .connections{
  189.  
  190. width:410px;
  191.  
  192. height:200px;
  193. background:#232323;
  194. font-weight:bold;
  195. border:1px solid black;
  196. color:#f1f1f1;
  197. font-size:12px;
  198. padding:5px;
  199. text-align:justify;
  200. font-family:"Cormorant Garamond";
  201. overflow:auto;
  202.  
  203.  
  204. }
  205.  
  206.  
  207. .container-audio {
  208. width: 30px;
  209. height: 30px;
  210. border-radius: 5px;
  211. position: fixed;
  212. bottom: 0;
  213. right: 0;
  214. color: #000;
  215. margin: 20px;
  216. overflow: hidden;
  217. }
  218.  
  219. /*******TEXT STYLING*********/
  220.  
  221. a.connect:active, a.connect:visited, a.connect:link {
  222. text-align:center;
  223.  
  224. font-size:10;
  225. height:15px;
  226. display: block;
  227. color:#f1f1f1;
  228.  
  229. text-decoration: none;
  230. border:1px solid #1c1c1c;
  231. padding:2px;
  232. padding-top:6px;
  233. margin:2px;
  234. font-family:"Marcellus";
  235. letter-spacing:4px;
  236.  
  237. }
  238.  
  239.  
  240. a.connect:hover {
  241. background-color:#f1f1f1;
  242. color:black
  243. }
  244.  
  245. a.navi:active, a.navi:visited, a.navi:link {
  246. text-align:left;
  247. text-transform:initial;
  248. font-weight:lighter;
  249. width:300px;
  250. color:#f1f1f1;
  251. background-color:#2f2f2f;
  252. text-decoration: none;
  253. display:block;
  254. margin-bottom:5px;
  255. padding:3px 5 0 8;
  256. font-size:15px;
  257. font-family:"Bellefair";
  258. letter-spacing:18px;
  259. transition: all 1s ease-in-out;
  260. -webkit-transition: all 1s ease-in-out;
  261. -moz-transition: all 1s ease-in-out;
  262. -o-transition: all 1s ease-in-out;
  263. -ms-transition: all 1s ease-in-out;
  264. }
  265. a.navi:hover {
  266. letter-spacing:5px;
  267. transform: translate(-5em,0);
  268. -webkit-transform: translate(-5em,0);
  269. -moz-transform: translate(-5em,0);
  270. -o-transform: translate(-5em,0);
  271. -ms-transform: translate(-5em,0);
  272. }
  273. a:active, a:visited, a:link {
  274. color: #f1f1f1;
  275. font-size: 14px;
  276. font-family: gabriola;
  277. text-decoration:none;
  278. font-weight:normal;
  279. letter-spacing:1px;
  280. -webkit-transition: all 0.6s ease-out;
  281. -moz-transition: all 0.6s ease-out;
  282. transition: all 0.6s ease-out;
  283. line-height:20px;
  284. text-shadow:15px 0px transparent, -15px 0px transparent;
  285. }
  286. a:hover {
  287. color:#f1f1f1;
  288. font-size: 12px;
  289.  
  290. text-decoration:none;
  291. font-weight:normal;
  292. letter-spacing:1px;
  293. -webkit-transition: all 0.6s ease-out;
  294. -moz-transition: all 0.6s ease-out;
  295. transition: all 0.6s ease-out;
  296. text-shadow: 0px 0px, 0px 0px ;
  297. }
  298. I {
  299. font: italic 9px georgia;
  300. color:#ffffff;
  301. line-height:8px;
  302. text-transform:none;
  303. letter-spacing:1px;
  304. font-weight:normal;
  305. }
  306. B {
  307. font-family:"Marcellus";
  308. font-size:11px;
  309. letter-spacing:2px;
  310. line-height:9px;
  311. color:#88878a;
  312. text-transform:uppercase;
  313. }
  314. h1 {
  315. text-align:right;
  316. padding:5px;
  317. margin:5px;
  318. color:#f1f1f1;
  319. font-weight:lighter;
  320. font-size:40px;
  321. letter-spacing:5px;
  322. text-transform:initial;
  323. font-family: 'allura',serif;
  324. display:block;
  325. line-height:10px;
  326. }
  327.  
  328.  
  329. h2 {
  330. text-align:right;
  331. margin-left:10px;
  332. color:#f1f1f1;
  333. font-size:11px;
  334. line-height:10px;
  335. letter-spacing:5px;
  336. text-transform:uppercase;
  337. font-weight:lighter;
  338. font-family: 'Cagliostro',serif;
  339. display:inline-block;
  340. }
  341. h3 {
  342. color:#f1f1f1;
  343. margin-top:15px;
  344. padding-right:10px;
  345. text-align:right;
  346. font-family:"Kaushan Script", serif;
  347. font-size:15px;
  348. letter-spacing:2px;
  349. line-height:14px;
  350. border-left:265px solid black;
  351. text-transform:;
  352. display:block;
  353. font-weight:lighter;
  354. }
  355. h4 {
  356. color:#f1f1f1;
  357. margin-top:15px;
  358. padding-left:10px;
  359. text-align:left;
  360. font-family:"Kaushan Script", serif;
  361. font-size:15px;
  362. letter-spacing:2px;
  363. line-height:14px;
  364. border-right:265px solid black;
  365. text-transform:;
  366. display:block;
  367. font-weight:lighter;
  368. }
  369.  
  370. h5 {
  371. text-align:right;
  372. padding:5px;
  373. margin:5px;
  374. color:#f1f1f1;
  375. font-weight:lighter;
  376. font-size:30px;
  377. letter-spacing:3px;
  378. text-transform:initial;
  379. font-family: 'Marcellus';
  380. display:block;
  381. }
  382.  
  383. .userAlbums {
  384. display:none;
  385. }
  386. .extendedNetwork {
  387. display:none;
  388. }
  389. .latestBlogEntry {
  390. display:none;
  391. }
  392. .latestBlogEntry {
  393. display:none;
  394. }
  395. .whitetext12{
  396. visibility:hidden;
  397. display:none;
  398. }
  399. .orangetext15{
  400. visibility:hidden;
  401. display:none;
  402. }
  403. .lightbluetext8{
  404. visibility:hidden;
  405. display:none;
  406. }
  407. td.text td.text{
  408. background-color:transparent;
  409. }
  410. /* Hides the Blurbs bar */
  411. td.text table {
  412. background-color:transparent;
  413. }
  414. /* Hides the Friends bar */
  415. table.interestsanddetails span.lightbluetext8, table.interestsanddetails td.text {
  416. display:none;
  417. }
  418. table.interestsanddetails td {
  419. width:0px;
  420. padding:0px;
  421. }
  422. table.interestsanddetails td td {
  423. background-color: transparent!important;
  424. }
  425. table.interestsanddetails, table.interestsanddetails td {
  426. border:none!important;
  427. }
  428. .contactTable {
  429. display: none;
  430. }
  431. .clearfix {
  432. margin-top: -100px;
  433. }
  434. table div font {
  435. display: none;
  436. }
  437. .userProfileURL {
  438. display:none;
  439. }
  440. .friendspace{
  441. display:none
  442. }
  443. .friendsComments {
  444. display:none;
  445. }
  446. .profileInfo{
  447. display:none;
  448. }
  449. .nametext {
  450. display:none;
  451. }
  452. div div table div, div.clearfix a, input {
  453. display:none;
  454. }
  455. div.clearfix table div div {
  456. display:block;
  457. }
  458. .userProfileDetail {
  459. display:none;
  460. }
  461. table.profileInfo * {
  462. background-color:transparent;
  463. }
  464. table.profileInfo td td {
  465. letter-spacing:-100px;
  466. font-size:0px;
  467. }
  468. table.profileInfo td td.text, table.profileInfo td td * {
  469. font-size:11px;
  470. letter-spacing:0px;
  471. }
  472. table.profileInfo td td a {
  473. display:none;
  474. }
  475. table.profileInfo td td.text * {
  476. display:inline;
  477. }
  478. table#profileV1Main td {
  479. background-color:transparent
  480. }
  481. </style>
  482.  
  483.  
  484.  
  485.  
  486.  
  487.  
  488.  
  489.  
  490.  
  491.  
  492.  
  493.  
  494.  
  495.  
  496.  
  497.  
  498.  
  499.  
  500.  
  501.  
  502.  
  503.  
  504. <!----------------------LIKE TO MEET------------------>
  505. <div class="navigation">
  506. <a href="/home.php" class="navi">Home</a>
  507. <a href="/send_message.php?member_id=######" class="navi">Message</a>
  508. <a href="/add_comment.php?member_id=######" class="navi">Comment</a>
  509. <a href="/view_journal_member.php?member_id=######" class="navi">Bulletins</a>
  510. <a href="/gallery.php?member_id=######" class="navi">Gallery</a>
  511. <a href="status_stream.php?member_id=######" class="navi">Stream</a>
  512. <a href="/312015" class="navi">Credit</a>
  513. </div>
  514.  
  515. <div class="shannaro"><h5>VISIONARY</h5></div>
  516. <div class="banner"> <img src="https://i.imgur.com/IaFU2FG.gif" style="width:447; height:230"></div>
  517. <div class="tabs">
  518.  
  519. <!-- TAB 1-->
  520. <div class="tab">
  521. <input type="radio" id="tab-1" name="tab-group-1" checked>
  522. <label for="tab-1"> I </label>
  523. <div class="content">
  524. <img src="https://i.imgur.com/ECsx9OM.gif" style="float:left;width:180;height:240;margin-right:10px;">
  525. <center> <h2>Basic Information</h2></center>
  526. <div class="basic"><b>Full Name:</b> Blah<br>
  527. <b>Nicknames/Titles:</b> Blah<br>
  528. <b>Gender:</b> Blah<br>
  529. <b>Alignment:</b> Blah<br>
  530. <b>Age:</b> Blah<br>
  531. <b>Race/Homeland:</b> Blah<br>
  532. <b>Class:</b> Blah<br>
  533. <b>Hair:</b> Blah<br>
  534. <b>Skin:</b> Blah<br>
  535. <b>Eyes:</b> Blah<br>
  536. <b>Height:</b> Blah<br>
  537. <b>Weight:</b> Blah<br>
  538. <b>Markings (Scars, Tattoo's etc):</b> Blah<br>
  539. <b>Physical Features:</b> Blah<br>
  540. <b>General Happiness:</b> Blah<br>
  541. <b>Social Level:</b> Blah<br>
  542. <b>Optimistic/Pessimistic:</b> Blah<br>
  543. <b>Positive Personality Traits:</b> Blah<br>
  544. <b>Negative Personality Traits:</b> Blah<br>
  545. <b>Misc. Quirks:</b> Blah<br>
  546. <b>Religion/Philosophy:</b> Blah<br>
  547. <b>Likes:</b> Blah<br>
  548. <b>Favorite Foods:</b> Blah<br>
  549. <b>Favorite Drinks:</b> Blah<br>
  550. <b>Favorite Colors:</b> Blah<br>
  551. <b>Dislikes:</b> Blah<br>
  552. <b>Hobbies:</b> Blah<br>
  553. <b>Relationship Status:</b> Blah<br>
  554. <b>Place of residence:</b> Blah<br>
  555. <b>Place of Birth:</b> Blah<br>
  556. <b>Occupation:</b> Blah<br>
  557. <b>Group/Guild/Clan affiliation: </b> Blah<br>
  558. <b>Enemies:</b> Blah<br>
  559. <b>Wealth Status:</b> Blah<br>
  560. <b>Favored Weapon:</b> Blah<br>
  561. <b>Weapon SKill:</b> Blah<br>
  562. <b>Magic Abilities</b> Blah<br>
  563. <b>Magic Strengths:</b> Blah<br>
  564. <b>Other Information:</b> Blah<br></div>
  565. </div>
  566. </div>
  567.  
  568.  
  569. <!-- TAB 2 -->
  570. <div class="tab">
  571. <input type="radio" id="tab-2" name="tab-group-1">
  572. <label for="tab-2"> II </label>
  573.  
  574. <div class="content">
  575. <center> <h2>Biography</h2></center>
  576. <div class="bio">
  577. <b>bold.</b>
  578. <u>underlined.</u>
  579. <i>italics.</i>
  580. <a href="">link.</a>
  581. <li>bullets.</li>
  582. <h1>header 1</h1>
  583. <h2>header 2</h2>
  584. <h3>header 3</h3>
  585. <h4>header 4</h4>
  586.  
  587. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Mauris imperdiet congue mauris, vehicula tincidunt ipsum placerat ut. Fusce posuere turpis eget fringilla feugiat. Pellentesque consequat molestie ullamcorper. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Duis feugiat convallis odio, ac rhoncus justo commodo sed. Ut quis sodales nibh. Nulla sagittis mauris diam, vel lobortis nunc gravida sit amet. Vivamus id mauris eu dui auctor vestibulum ac vitae felis. Nam eu fringilla dui, non blandit eros. Curabitur molestie scelerisque diam commodo feugiat.
  588. <br><br>
  589. Proin pharetra lobortis leo. Donec turpis ex, eleifend in erat quis, porttitor finibus arcu. Donec ligula risus, auctor non arcu sed, consectetur porttitor lacus. Curabitur cursus viverra neque eget suscipit. Proin tempor felis quam. Integer aliquet est at ligula ullamcorper ultricies. Vivamus leo purus, fringilla a augue sit amet, imperdiet rutrum dolor. In sit amet suscipit neque, auctor porttitor lacus. Sed ullamcorper orci in felis luctus vehicula.
  590. <br><br>
  591. </div>
  592. </div>
  593. </div>
  594.  
  595. <!-- TAB 3 -->
  596. <div class="tab">
  597. <input type="radio" id="tab-3" name="tab-group-1" >
  598. <label for="tab-3"> III </label>
  599. <div class="content">
  600. <center> <h2>Connections</h2></center>
  601. <div class="connections">
  602. <a href="/" class="connect">NAME</a>
  603. <a href="/" class="connect">NAME</a>
  604. <a href="/" class="connect">NAME</a>
  605. <a href="/" class="connect">NAME</a>
  606. <a href="/" class="connect">NAME</a>
  607. <a href="/" class="connect">NAME</a>
  608. <a href="/" class="connect">NAME</a>
  609.  
  610. <a href="/" class="connect">NAME</a>
  611. <a href="/" class="connect">NAME</a>
  612. <a href="/" class="connect">NAME</a>
  613. <a href="/" class="connect">NAME</a>
  614. <a href="/" class="connect">NAME</a>
  615. <a href="/" class="connect">NAME</a>
  616. <a href="/" class="connect">NAME</a>
  617. </div>
  618. </div>
  619. </div>
  620.  
  621.  
  622. <!-- TAB 4 -->
  623. <div class="tab">
  624. <input type="radio" id="tab-4" name="tab-group-1">
  625. <label for="tab-4"> IV </label>
  626. <div class="content">
  627. <img src="https://78.media.tumblr.com/58936d915c59c80c463caeecc01e6844/tumblr_nzgmd7hckH1qjmwryo1_500.gif" style="margin-left:12px;float:right;width:180;height:240;">
  628. <center> <h2>Extra Tab</h2></center>
  629. <div class="extra">
  630. <li>Rules, Owes, Stats, etc. can go here.</li>
  631. </div>
  632. </div>
  633. </div>
  634.  
  635.  
  636.  
  637. <!-- MUSIC -->
  638. <div class="container-audio">
  639. <audio controls autoplay loop>
  640. <source src="https://gospelsongsmp3.com/wp-content/uploads/2017/09/NF-Let-You-Down-Gospelsongsmp3.com_.mp3" type="audio/mp3">
  641. Your browser dose not Support the audio Tag
  642. </audio>
  643. </div>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement