API tools faq
paste
Advertisement
Demi-monde

Regan

Demi-monde
Oct 20th, 2019
81
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 16.48 KB | None | 0 0
raw download clone embed print report
  1. /* ---- COPY TO BELOW TO HEAD ----*/
  2.  
  3. <link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.1.0/css/all.css" integrity="sha384-lKuwvrZot6UHsBSfcMvOkWwlCMgc0TaWr+30HWe3a4ltaBwTZhyTEggF5tJv8tbt" crossorigin="anonymous">
  4.  
  5. <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/simple-line-icons/2.4.1/css/simple-line-icons.css">
  6.  
  7. <link href='https://fonts.googleapis.com/css?family=Montserrat:700' rel='stylesheet' type='text/css'>
  8.  
  9. <link href="https://fonts.googleapis.com/css?family=ABeeZee:400,400italic|Lato:400,400italic,700,700italic" rel="stylesheet">
  10.  
  11. <style type="text/css">
  12.  
  13. <style>
  14. ::-webkit-scrollbar { width: 1px; height:3px; background: transparent;}
  15. ::-webkit-scrollbar-thumb { background-color: transparent; -webkit-border-radius: 1ex; }
  16.  
  17. /* ---- TEXTS & CUSTOM FONTS ----*/
  18.  
  19. a {
  20. text-decoration:none;
  21. font-style:none;
  22. outline:none;
  23. text-transform:uppercase;
  24. -moz-outline-style:none;
  25. color:#fff;
  26. -webkit-transition: all 0.4s ease-in-out;
  27. -moz-transition: all 0.4s ease-in-out;
  28. -o-transition: all 0.4s ease-in-out;
  29. -ms-transition: all 0.4s ease-in-out;
  30. transition: all 0.4s ease-in-out;
  31. }
  32.  
  33. a:hover {
  34. font-style:bold;
  35. text-transform:uppercase;
  36. -moz-outline-style:none;
  37. color:#737066;
  38. -webkit-transition: all 0.4s ease-in-out;
  39. -moz-transition: all 0.4s ease-in-out;
  40. -o-transition: all 0.4s ease-in-out;
  41. -ms-transition: all 0.4s ease-in-out;
  42. transition: all 0.4s ease-in-out;
  43. }
  44.  
  45. i, em {
  46. color: #b29600;
  47. font-family:arial;
  48. text-shadow: 0px 1px 1px #000;
  49. letter-spacing:1px;
  50. font-size:12px;
  51. }
  52.  
  53. b, strong {
  54. color: #b29600;
  55. font-family:arial;
  56. text-shadow: 0px 1px 1px #000;
  57. letter-spacing:1px;
  58. font-size:12px;
  59. }
  60.  
  61. strike {
  62. text-shadow:0px 1px 0px #222;
  63. letter-spacing:7px;
  64. text-transform:uppercase;
  65. }
  66.  
  67.  
  68. h1 { font-size:9px; font-style:italic; letter-spacing:5px; text-align:right; margin-bottom:15px; opacity:.6;}
  69.  
  70. h3 { font-size:9px; font-style:bold; letter-spacing:2px; text-align:center; margin-bottom:15px; opacity:.6;}
  71.  
  72. @font-face{ font-family:"nouvelle"; src: url('https://dl.dropboxusercontent.com/s/ag5vx5qla7mrqg9/nouvelle_vague_final.ttf’)'); }
  73.  
  74. @font-face{ font-family:"signerica"; src: url('https://dl.dropboxusercontent.com/s/exj78lvoc594ylo/Signerica_Medium.ttf’)'); }
  75.  
  76. @font-face{ font-family:"primetime"; src: url('https://dl.dropboxusercontent.com/s/2b4vrdix7lxxfsw/PRIMETIME%20%E2%95%95%20PERSONAL%20USE%20ONLY.ttf’)'); }
  77.  
  78. @font-face{ font-family:"roboto"; src: url('https://dl.dropboxusercontent.com/s/i5x37kqbtb40s0b/Roboto-Light.ttf’)'); }
  79.  
  80. @font-face{ font-family:"robold"; src: url('https://dl.dropboxusercontent.com/s/qynix3bz0j8ppva/Roboto-BoldCondensed.ttf’)'); }
  81.  
  82. @font-face{ font-family:"hermes"; src: url('https://dl.dropboxusercontent.com/s/rhje42nhg8bamiq/Herrmes.otf’)'); }
  83.  
  84. @font-face{ font-family:"astronout"; src: url('https://dl.dropboxusercontent.com/s/v6587r3a6m8y5eh/Astronout.ttf’)'); }
  85.  
  86.  
  87. body { font-family:helvetica; font-weight:100; font-size:11px; text-align:justify; margin:0; line-height:12px; background:#000; }
  88.  
  89. #container {
  90. width:700px;
  91. height:695px;
  92. position: absolute;
  93. top:0;
  94. bottom:0px;
  95. left:0;
  96. right:0;
  97. margin:auto;
  98. background:transparent; /* container background color */
  99. overflow:hidden;
  100. }
  101.  
  102.  
  103. #holder { position:absolute; width:620px; height:500px; margin: auto; left:0; top:0; bottom:0; right:0; background-color:#1d1d1d; overflow:hidden; }
  104.  
  105. #tabspace { position: absolute; width:440px; height:480px; right:0px; top:0px;filter: blur(10px); opacity:0; transition: 1s; }
  106.  
  107. body:hover #tabspace {filter: blur(0px); opacity:1; transition: .5s;}
  108.  
  109. #graphic { position: absolute; width:580px; height:320px; left:20px; top: 20px; background:#202020; overflow:hidden; background-image:url('https://66.media.tumblr.com/79f674f830ee707368db4c2fd3ad6a4e/tumblr_ojvu4j95Yv1rf1yd3o1_r2_1280.jpg');/* ---- MAINIMG ----*/ background-size:cover; -webkit-filter: grayscale(100%); /* Safari 6.0 - 9.0 */filter: grayscale(100%);blur(0px); opacity:1; transition: 1s;}
  110.  
  111. body:hover #graphic {filter: blur(10px); opacity:.0; transition: .5s;}
  112.  
  113.  
  114. #box { position: absolute; width:220px; height:80px; right:50px; bottom: 150px; background:#33302f; opacity:.5; filter: blur(0px); opacity:1; transition: 1s; }
  115.  
  116. body:hover #box {filter: blur(10px); opacity:.0; transition: .5s;}
  117.  
  118. #title { position:absolute; width:240px; height:30px; right:40px; bottom:215px; text-align:left; font-family:ABeeZee, arial, sans-serif; font-size:35px; line-height:30px; letter-spacing:4px; color:#f8f8f8;filter: blur(0px); opacity:1; transition: 1s; }
  119.  
  120. body:hover #title {filter: blur(10px); opacity:.0; transition: .5s;}
  121.  
  122. #subtitle { position:absolute; width:220px; height:30px; right:40px; bottom:140px; font-family:ABeeZee, arial, sans-serif; font-size:9px; color:#b29600; letter-spacing:5px; line-height:20px; text-align:right;filter: blur(0px); opacity:1; transition: 1s; }
  123.  
  124. body:hover #subtitle {filter: blur(10px); opacity:.0; transition: .5s;}
  125.  
  126. #bottombar { position: absolute; width:620px; height:120px; left:0px; bottom:0px; background-color:#33302f; }
  127.  
  128. #subtitle2 { position: absolute; top:15px; left:20px; width:320px; height:15px; font-family:ABeeZee, arial, sans-serif; font-size:11px; text-transform:lowercase; text-align:left; letter-spacing:3px; color:#b29600;}
  129.  
  130. #desc { position: absolute; bottom:10px; left:20px; width:170px; height:80px; font-family:ABeeZee, arial, sans-serif; font-size:10px; text-transform:lowercase; text-align:justify; letter-spacing:2px; color:#f8f8f8; overflow:auto;}
  131.  
  132.  
  133. /* ---- t a b s ---- */
  134.  
  135. #gif { position:absolute; width:400px; height:300px; top:10px; right:-35px; overflow:hidden; }
  136.  
  137. .gifimg {background-image:url('http://i39.tinypic.com/2d98jer.gif');/* ---- gifbottommainpage ----*/ background-size:cover; -webkit-filter: grayscale(100%); /* Safari 6.0 - 9.0 */filter: grayscale(100%);width:290px; height:100px;postion:abolsute; border:0px solid #202020;background-position: center center;}
  138.  
  139.  
  140. /* ---- stats tab ---- */
  141.  
  142. #tabone { position:absolute; right:20px; top:20px; width: 580px; height:340px; background-color:#202020; overflow:hidden; filter: blur(10px); opacity:0; transition: 1s; }
  143.  
  144. body:hover #tabone {filter: blur(0px); opacity:1; transition: .5s;}
  145.  
  146. #avail { position:absolute; right:-10px; bottom:0px; width:60px; height:340px; padding:5px; background-color:#4c4744; overflow:hidden; font-family:'robold'; font-size:9px; text-transform:uppercase; letter-spacing:5px; color:#f8f8f8; line-height:12px; text-align:center;}
  147.  
  148. #stats { position:absolute; left:0px; top:0px; width:205px; height:175px; padding:15px; background-color:#4c4744; overflow:hidden; font-family:'robold'; font-size:9px; text-transform:uppercase; letter-spacing:5px; color:#f8f8f8; text-align:center; }
  149.  
  150. .stats { position:absolute; width:205px; height:180px; bottom:10px; font-family:ABeeZee, arial, sans-serif; font-size:10px; text-transform:lowercase; text-align:justify; letter-spacing:2px; color:#f8f8f8; overflow:auto; line-height:17px; }
  151.  
  152. .stats tt { font-family:'robold'; text-transform:uppercase; font-size:11px; letter-spacing:3px; word-spacing:8px; color:#b29600;}
  153.  
  154. #aesthetic { position:absolute; left:0px; bottom:0px; width:205px; height:105px; padding:15px; background-color:#33302f; overflow:hidden; font-family:'robold'; font-size:10px; text-transform:uppercase; letter-spacing:5px; color:#f8f8f8; line-height:12px; text-align:center; }
  155.  
  156. .aestit { position:absolute; width:205px; height:25px; top:10px; font-family:ABeeZee, arial, sans-serif; font-size:12px; text-transform:lowercase; text-align:left; letter-spacing:3px; color:#b29600; overflow:auto; line-height:17px;text-shadow: 0px 1px 1px #000; }
  157.  
  158. .aesthetic { position:absolute; width:205px; height:95px; bottom:10px; font-family:ABeeZee, arial, sans-serif; font-size:10px; text-transform:lowercase; text-align:justify; letter-spacing:2px; color:#f8f8f8; overflow:auto; line-height:17px; }
  159.  
  160. #quote { position:absolute; left:235px; top:90px; width:244px; height:125px; padding:25px; background-color:#181818; font-family:'robold'; font-size:10px; text-transform:uppercase; letter-spacing:5px; color:#f8f8f8; line-height:12px; text-align:right; }
  161.  
  162. .moniker { position:absolute; width:175px; height:45px; top:5px; right:30px; font-family:ABeeZee, arial, sans-serif; font-size:15px; text-transform:lowercase; text-align:right; letter-spacing:5px; color:#b29600; overflow:auto; line-height:17px; }
  163.  
  164. .quote { position:absolute; width:240px; height:120px; top:25px; right:25px; font-family:ABeeZee, arial, sans-serif; font-size:10px; text-transform:lowercase; text-align:justify; letter-spacing:3px; color:#f8f8f8; overflow:auto; line-height:15px; }
  165.  
  166. #icon { position:absolute; left:15px; top:-40px; width:50px; height:50px; border:10px solid #181818; background-color:#181818; overflow:hidden; border-radius:100px;background-color:#282525;background-image:url('http://25.media.tumblr.com/f58845cb96fc3e6ddff757260b602d13/tumblr_mymptkH0U41rpe379o1_500.gif');/* ---- giftop ----*/ background-size:cover; -webkit-filter: grayscale(100%); /* Safari 6.0 - 9.0 */filter: grayscale(100%) ;background-position:center center; }
  167.  
  168. #headerbot { position:absolute; left:235px; bottom:0px; width:294px; height:90px; background-color:#282525;background-image:url('https://media1.tenor.com/images/46515204cd56b742eeff11f3a0cb06ea/tenor.gif?itemid=4861228'); /* ---- gifbottom ----*/background-size:cover; -webkit-filter: grayscale(100%); /* Safari 6.0 - 9.0 */filter: grayscale(100%) ;background-position:center center; }
  169.  
  170. #header { position:absolute; left:235px; top:0px; width:294px; height:90px; background-color:#282525;background-image:url('https://66.media.tumblr.com/6039ca493544d4fc7991202de9709ee6/tumblr_pkotujgkTw1utd4rxo1_500.gif');/* ---- giftop ----*/ background-size:cover; -webkit-filter: grayscale(100%); /* Safari 6.0 - 9.0 */filter: grayscale(100%) ;background-position:center center; }
  171.  
  172. .friend {
  173. margin-top:10px;
  174. border-radius:100px;
  175. border: solid 1px #33302f;
  176. -webkit-transition: all 0.8s ease-out;
  177. -moz-transition: all 0.8s ease-out;
  178. -o-transition: all 0.8s ease-out; }
  179.  
  180. .friend:hover {
  181. border-radius:100px;
  182. border: solid 1px #FFF;
  183. -webkit-transition: all 0.8s ease-out;
  184. -moz-transition: all 0.8s ease-out;
  185. -o-transition: all 0.8s ease-out; }
  186.  
  187. @font-face{ font-family:"mellati"; src: url('https://dl.dropboxusercontent.com/s/5g0m5k4s30cbktj/Mellati%20Script%20Free%20Font.otf’)'); }
  188.  
  189. .title { position:absolute; left:370px; top:580px; width:290px; height:auto; letter-spacing:1px; font-family:'mellati'; font-size:70px; line-height:34px; text-align:center; color:#b29600; text-shadow:0px 0px 5px #000; opacity:.9; font-weight:500; font-style:normal;z-index:999; }
  190.  
  191. /* ---- COPY below to BODY - <*/STYLE*> ----*/
  192.  
  193. </style>
  194.  
  195.  
  196. <div id="container">
  197. <div class="title">Southern Charm</div>
  198.  
  199. <div id="holder">
  200.  
  201. <div id="graphic"></div>
  202. <div id="box"> </div>
  203.  
  204.  
  205.  
  206. <div id="title"> Regan O'Connell. </div>
  207. <div id="subtitle"><i>New Orleans.</i></div>
  208.  
  209. <div id="bottombar">
  210.  
  211. <div id="subtitle2"><i class="fas fa-plus"></i> out of character. </div>
  212. <div id="desc">01. DM friendly.<br>
  213. 02. IC is not OOC. Know the difference.<br>
  214. 03. Room RP Preferred.<br>
  215. 04. Snowball writer, shit post to multi para.<br>
  216. 05. Story/Smut.<br>
  217. 06. Don't be a cunt, I won't be a dick.<br>
  218. 07. FC- Sean Patrick Flanery.
  219.  
  220. </div>
  221. <div id="gif"><div class="gifimg"></div></div>
  222. </div>
  223.  
  224. <div id="tabone">
  225.  
  226. <div id="avail"><p><h3>Muses</h3>
  227. <a target="_blank" href="https://roleplay.chat/profile.php?user=Aoife."><img src="https://66.media.tumblr.com/31ac1deb4833aa28e3c28b172ece6c0b/tumblr_o9p5j7PZY61sg4qu7o2_250.jpg" class="friend" width="40" height="40" a title="The most amazing writer in the world, who did this profile for me! "></a>
  228.  
  229. <a target="_blank" href="https://roleplay.chat/profile.php?user="><img src="https://78.media.tumblr.com/b3c0d5372f54f72a2c63456be268fd1a/tumblr_inline_pbd4lo0aHw1srid4g_500.png" class="friend" width="40" height="40" a title="Words here. "></a>
  230. <a target="_blank" href="https://roleplay.chat/profile.php?user="><img src="https://78.media.tumblr.com/b3c0d5372f54f72a2c63456be268fd1a/tumblr_inline_pbd4lo0aHw1srid4g_500.png" class="friend" width="40" height="40" a title="Words here. "></a>
  231. <a target="_blank" href="https://roleplay.chat/profile.php?user="><img src="https://78.media.tumblr.com/b3c0d5372f54f72a2c63456be268fd1a/tumblr_inline_pbd4lo0aHw1srid4g_500.png" class="friend" width="40" height="40" a title="Words here. "></a>
  232. </div>
  233.  
  234. <div id="stats">
  235. <div class="stats">
  236. <tt>name:</tt> Regan O'Connell. <br>
  237. <tt>age:</tt> 26 <br>
  238. <tt>gender:</tt> Male <br>
  239. <tt>species:</tt> Leopard <br>
  240. <tt>rank:</tt> Alpha, Former Nimir Raj <br>
  241. <tt>hair:</tt> Light brown <br>
  242. <tt>eyes:</tt> Blue <br>
  243. <tt>height:</tt> 5'11 <br>
  244. <tt>weight:</tt> 180lbs <br>
  245. <tt>Orientation:</tt> Heterosexual <br>
  246. </div>
  247. </div>
  248.  
  249. <div id="aesthetic">
  250. <div class="aestit">abilities.</div>
  251.  
  252. <div class="aesthetic">
  253. <b>Superhuman Speed:</b> Extremely fast and can ran faster than the human eye can follow.<br>
  254. <b>Superhuman Strength:</b> Akin to the strength of a vampire, lycans are much stronger in their animal form but still stronger than a human when in human form.<br>
  255. <b>Accelerated Healing:</b> Able to heal fast from any mortal wound not caused by silver. More powerful lycans are able to regrow limbs, although it may not be able to be done in one sitting..<br>
  256. <b>Heightened Senses:</b> Extremely acute senses. Lies can be detected through scent and the more powerful lycans can even hear blood moving around a person's body.<br>
  257. <b>Species Command:</b> Powerful, alpha lycans can command species of their own to do certain things. Force shift etc.<br>
  258. <b>Partial Shapeshifting:</b> Able to partially shift, as in claws or even bone structure to alter their appearance.<br>
  259. <b>Healing:</b> To a degree, some lycans can aid in the healing of the same species. In Regan's case, licking wounds can heal.<br>
  260. </div>
  261. </div>
  262.  
  263. <div id="header"></div>
  264.  
  265. <div id="quote">
  266.  
  267. <div id="icon"></div>
  268.  
  269. <div class="moniker">Regan.</div>
  270.  
  271. <div class="quote">Regan is an all around nice guy. Or had been. Jovial and generally always with a smile on his face, recent events had changed his life drastically. Less social and with a brooding nature, Regan more or less keeps to himself these days.
  272. <p><h1>history</h1>
  273. A bit of a jokester, Regan grew up with a fairly normal childhood in the state of Las Vegas. Yes, the City of Sin was where the young man was born and raised, by a single mother when his father disappeared. He was only four. Fairly normal to the fact, that he was given everything he could need or want by his doting mother, and he thrived as a typical boy. Loved and nurtured by the woman who gave birth to him, she was taken from him at the age of fourteen by a vicious and aggressive form of cancer.
  274. </p>
  275. <p>
  276. Sent to live with a distant relative, Regan struggled to cope with the loss and rebelled against the strict rules set out by the Catholic Religion in which his Aunt lived by. Once he reached sixtreen, he ran off. Adamant to make it on his own, to do his own thing and not answer to anyone. He did reasonably well, picking up odd jobs here and there, traversing the countryside, never sitting still for longer than a period of six months to a year before he moved on. He has lived like this for years, the way he wanted to.
  277. </p>
  278. <p>
  279. He had settled, to some degree. Holding down his current job for almost eight months now. Based in St. Louis, everything was moving along just right. He was spending one night in the pub with a few of his fellow colleagues, enjoying end of week happy hour. He was highly buzzed when the night ended and he finally left to make the journey on foot toward the apartment he rented in the center of the city. This night, he was attacked. By a vicious beast that he barely got a good look at in the dark. A bite to his forearm. He reported it immediately but with little to go on, he doubts much will be done about the roaming stray. Or was it a dog? Maybe it was something different....
  280.  
  281. </div>
  282. </div>
  283.  
  284. <div id="headerbot">
  285. </div>
  286.  
  287.  
  288.  
  289. </div></div>
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!