Advertisement
RageQxeen

The Goddess of the Night

Jul 25th, 2022
48
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 8.64 KB | None | 0 0
  1. <html>
  2. <body>
  3. <meta name="viewport" content="width=device-width, initial-scale=1">
  4.  
  5. <style type="text/css">
  6.  
  7. @import url('https://fonts.googleapis.com/css?family=Comfortaa|Cinzel');
  8.  
  9. html, body {
  10. background: rgb(0,0,0);
  11. background: -moz-radial-gradient(circle, rgba(0,0,0,1) 0%, rgba(60,40,92,1) 50%, rgba(14,43,77,1) 100%);
  12. background: -webkit-radial-gradient(circle, rgba(0,0,0,1) 0%, rgba(60,40,92,1) 50%, rgba(14,43,77,1) 100%);
  13. background: radial-gradient(circle, rgba(0,0,0,1) 0%, rgba(60,40,92,1) 50%, rgba(14,43,77,1) 100%);
  14. filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#000000",endColorstr="#0e2b4d",GradientType=1);
  15. }
  16.  
  17. ::-webkit-scrollbar-button:vertical:{
  18. background-color: #transparent;}
  19.  
  20. ::-webkit-scrollbar-thumb:vertical {
  21. background-color:#transparent;
  22. height:150px;}
  23.  
  24. ::-webkit-scrollbar-thumb:horizontal {
  25. background-color:#transparent;
  26. height:60px;}
  27.  
  28.  
  29. ::-webkit-scrollbar {
  30. height:60px;
  31. width:5px;
  32. background-color:#transparent;}
  33.  
  34. #image {
  35. width: 700px;
  36. margin: 0px;
  37. border: none;
  38. height: 750px;
  39. background-color:transparent;
  40. position: absolute;
  41. right: 30vw;
  42. bottom: 5vw;
  43. background-image:url("https://i.ibb.co/zXNL3ZD/13.png");
  44. background-repeat:no-repeat;
  45. background-position: center;
  46. background-size: 100%;
  47. z-index: 2;
  48. }
  49.  
  50. body .fade {
  51. background-color: #000;
  52. background-image:url("https://wallpapercave.com/wp/qvpyfs0.gif");
  53. background-size: 400px;
  54. background-repeat: repeat;
  55. background-position: top;
  56. width: 2000px;
  57. height: 1000px;
  58. margin:auto;
  59. position: absolute;
  60. right: 0%;
  61. top: 0%;
  62. z-index:1;
  63. opacity: 1;
  64. animation-fill-mode: ease-in-out forwards;
  65. }
  66.  
  67. body:hover .fade{
  68. animation: fader ease-in-out 10s;
  69. animation-iteration-count: 1;
  70. transform-origin: 50% 50%;
  71. animation-fill-mode:ease-in-out forwards; /*when the spec is finished*/
  72. -webkit-animation: fader ease-in-out 10s;
  73. -webkit-animation-iteration-count: 1;
  74. -webkit-transform-origin: 50% 50%;
  75. -webkit-animation-fill-mode:forwards; /*Chrome 16+, Safari 4+*/
  76. -moz-animation: fader ease-in-out 10s;
  77. -moz-animation-iteration-count: 1;
  78. -moz-transform-origin: 50% 50%;
  79. -moz-animation-fill-mode:forwards; /*FF 5+*/
  80. -o-animation: fader ease-in-out 10s;
  81. -o-animation-iteration-count: 1;
  82. -o-transform-origin: 50% 50%;
  83. -o-animation-fill-mode:forwards; /*Not implemented yet*/
  84. -ms-animation: fader ease-in-out 10s;
  85. -ms-animation-iteration-count: 1;
  86. -ms-transform-origin: 50% 50%;
  87. -ms-animation-fill-mode:forwards; /*IE 10+*/
  88. }
  89.  
  90. @keyframes fader{
  91. 0% {
  92. opacity:1;
  93. transform: scaleX(1.00) scaleY(1.00) ;
  94. }
  95. 50% {
  96. opacity:0;
  97. transform: scaleX(NaN) scaleY(NaN) ;
  98. }
  99. 100% {
  100. z-index: -1;
  101. opacity: 0;
  102. }
  103. }
  104.  
  105. @-moz-keyframes fader{
  106. 0% {
  107. opacity:1;
  108. -moz-transform: scaleX(1.00) scaleY(1.00) ;
  109. }
  110. 50% {
  111. opacity:0;
  112. -moz-transform: scaleX(NaN) scaleY(NaN) ;
  113. }
  114. 100% {
  115. z-index: -1;
  116. opacity: 0;
  117. }
  118. }
  119.  
  120. @-webkit-keyframes fader {
  121. 0% {
  122. opacity:1;
  123. -webkit-transform: scaleX(1.00) scaleY(1.00) ;
  124. }
  125. 50% {
  126. opacity:0;
  127. -webkit-transform: scaleX(NaN) scaleY(NaN) ;
  128. }
  129. 100% {
  130. z-index: -1;
  131. opacity: 0;
  132. }
  133. }
  134.  
  135. @-o-keyframes fader {
  136. 0% {
  137. opacity:1;
  138. -o-transform: scaleX(1.00) scaleY(1.00) ;
  139. }
  140. 50% {
  141. opacity:0;
  142. -o-transform: scaleX(NaN) scaleY(NaN) ;
  143. }
  144. 100% {
  145. z-index: -1;
  146. opacity: 0;
  147. }
  148. }
  149.  
  150. @-ms-keyframes fader {
  151. 0% {
  152. opacity:1;
  153. -ms-transform: scaleX(1.00) scaleY(1.00) ;
  154. }
  155. 50% {
  156. opacity:0;
  157. -ms-transform: scaleX(NaN) scaleY(NaN) ;
  158. }
  159. 100% {
  160. z-index: -1;
  161. opacity: 0;
  162. }}
  163.  
  164. #container {
  165. background-color: transparent;
  166. background-image: url('https://media.istockphoto.com/photos/clear-night-sky-with-milky-way-and-huge-amount-of-stars-picture-id1287456867?b=1&k=20&m=1287456867&s=170667a&w=0&h=k_ldypib_aEeLD71QVzSS5kBV9QI-INb5k684DVEZ94=');
  167. background-size: 100%;
  168. background-position: center;
  169. width: 25vw;
  170. height: 35vw;
  171. margin:auto;
  172. position: absolute;
  173. padding: 5px;
  174. right: 5vw;
  175. bottom: 5vw;
  176. z-index:3;
  177. border: 2px solid #000;
  178. box-shadow: 0px 5px 10px #000;
  179. z-index: 10;
  180. }
  181.  
  182. #content {
  183. background-color: #4c4c4c;
  184. width: 24vw;
  185. height: 34vw;
  186. margin:auto;
  187. position: absolute;
  188. padding: 5px;
  189. font-family: 'Comfortaa', cursive;
  190. font-size: 15px;
  191. color: #000;
  192. right: 0.3vw;
  193. bottom: 0.3vw;
  194. z-index:4;
  195. border: 2px solid #000;
  196. }
  197.  
  198. #container2 {
  199. background-color: transparent;
  200. background-image: url('https://media.istockphoto.com/photos/clear-night-sky-with-milky-way-and-huge-amount-of-stars-picture-id1287456867?b=1&k=20&m=1287456867&s=170667a&w=0&h=k_ldypib_aEeLD71QVzSS5kBV9QI-INb5k684DVEZ94=');
  201. background-size: 100%;
  202. background-position: center;
  203. width: 25vw;
  204. height: 35vw;
  205. margin:auto;
  206. position: absolute;
  207. padding: 5px;
  208. left: 5vw;
  209. bottom: 5vw;
  210. z-index:3;
  211. border: 2px solid #000;
  212. box-shadow: 0px 5px 10px #000;
  213. z-index: 10;
  214. }
  215.  
  216. #content2 {
  217. background-color: #4c4c4c;
  218. width: 24vw;
  219. height: 34vw;
  220. margin:auto;
  221. position: absolute;
  222. padding: 5px;
  223. font-family: 'Comfortaa', cursive;
  224. font-size: 15px;
  225. color: #000;
  226. right: 0.3vw;
  227. bottom: 0.3vw;
  228. z-index:4;
  229. border: 2px solid #000;
  230. }
  231.  
  232. h1{
  233. background: url('https://i.ibb.co/MZZ4V0M/4.jpg');
  234. background-size: cover;
  235. background-position: center;
  236. text-align: center;
  237. border: 2px solid #000;
  238. border-radius: 15px;
  239. font-size: 30px;
  240. font-family: 'Cinzel', cursive;
  241. color: #000;
  242. text-shadow: 1px 1px 0 #c0c0c0, -1px -1px 0 #c0c0c0, -1px 1px 0 #c0c0c0, 1px -1px 0 #c0c0c0;
  243. line-height: 2;
  244. }
  245. h2{
  246. background: url('https://i.ibb.co/5rw79rt/3.jpg');
  247. background-size: cover;
  248. background-position: center;
  249. text-align: center;
  250. border: 2px solid #000;
  251. border-radius: 15px;
  252. font-size: 30px;
  253. font-family: 'Cinzel', cursive;
  254. color: #000;
  255. text-shadow: 1px 1px 0 #c0c0c0, -1px -1px 0 #c0c0c0, -1px 1px 0 #c0c0c0, 1px -1px 0 #c0c0c0;
  256. line-height: 2;
  257. }
  258. h3{
  259. background: url('https://i.ibb.co/M6Qx35M/1.jpg');
  260. background-size: cover;
  261. background-position: center;
  262. text-align: center;
  263. border: 2px solid #000;
  264. border-radius: 15px;
  265. font-size: 30px;
  266. font-family: 'Cinzel', cursive;
  267. color: #000;
  268. text-shadow: 1px 1px 0 #c0c0c0, -1px -1px 0 #c0c0c0, -1px 1px 0 #c0c0c0, 1px -1px 0 #c0c0c0;
  269. line-height: 2;
  270. }
  271. h4{
  272. background: url('https://i.ibb.co/XbyZWmH/2.jpg');
  273. background-size: cover;
  274. background-position: center;
  275. text-align: center;
  276. border: 2px solid #000;
  277. border-radius: 15px;
  278. font-size: 30px;
  279. font-family: 'Cinzel', cursive;
  280. color: #000;
  281. text-shadow: 1px 1px 0 #c0c0c0, -1px -1px 0 #c0c0c0, -1px 1px 0 #c0c0c0, 1px -1px 0 #c0c0c0;
  282. line-height: 2;
  283. }
  284. a {text-decoration: none; color: #111;}
  285. i {color: #ac94b7; font-weight: bold;}
  286. b {color: #57738c;}
  287.  
  288. .credit{
  289. position: fixed;
  290. bottom: 0px;
  291. left: 2px;
  292. height: 25px;
  293. width: 25px;
  294. line-height: 15px;
  295. font-size: 10px;
  296. color: #000;
  297. text-align: center;
  298. font-family: roboto;
  299. }
  300.  
  301. #Layout {position: fixed; left: 0px; top: 0px; right: 0px; bottom: 0px;}
  302. </style>
  303. <div id="Layout" oncontextmenu="return false;">
  304.  
  305. <div class="credit" title="Profile by RageQxeen">♛</div>
  306. <!--
  307. <div class="fade"></div>
  308. -->
  309.  
  310. <div id="image"></div>
  311.  
  312. <div id="container">
  313.  
  314. <div id="content">
  315. <div style="width: 24vw; height: 34vw; overflow-y: hidden;">
  316.  
  317. <a name="one"></a>
  318. <div style="width: 24vw; height: 34vw; overflow: auto;">
  319. <h4>Out of Character</h4>
  320. <center><b>00</b>. Want a code? Go <a href="https://rageqxeen.neocities.org/vw_codes/rageqxeen.html">here</a>. Refrain from stealing.</center><br><br>
  321.  
  322. </div>
  323. </div>
  324. </div>
  325. </div>
  326.  
  327. <div id="container2">
  328.  
  329. <div id="content2">
  330. <div style="width: 24vw; height: 34vw; overflow-y: hidden;">
  331.  
  332. <a name="one"></a>
  333. <div style="width: 24vw; height: 34vw; overflow: auto;">
  334. <h1>Dossier</h1>
  335. <font style=float:left><b>Name</b></font> <font style=float:right> </font><br>
  336. <font style=float:left><b>Moniker</b></font> <font style=float:right><a title=" ">hover</a></font><br>
  337. <font style=float:left><b>Gender</b></font> <font style=float:right> </font><br>
  338. <font style=float:left><b>Apparent Age</b></font> <font style=float:right> </font><br>
  339. <font style=float:left><b>Race</b></font> <font style=float:right> </font><br>
  340. <font style=float:left><b>Height</b></font> <font style=float:right> </font><br>
  341. <font style=float:left><b>Marital</b></font> <font style=float:right><a href="https://roleplay.chat/profile.php?user=" target="_blank">Disinterest</a></font><br>
  342. <font style=float:left><b>Orientation</b></font> <font style=float:right> </font><br><br>
  343.  
  344. <h2>History</h2>
  345.  
  346. <h3>Powers</h3>
  347.  
  348.  
  349. </div>
  350. </div>
  351. </div>
  352. </div>
  353. </div>
  354. </body>
  355. </html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement