daily pastebin goal
66%
SHARE
TWEET

ellana's newest profile (wip)

owltrash Dec 7th, 2018 (edited) 59 Never
Upgrade to PRO!
ENDING IN00days00hours00mins00secs
 
  1. <style>
  2. @import url('https://fonts.googleapis.com/css?family=Cardo|Cinzel+Decorative|IM+Fell+English+SC|Italianno|Jim+Nightshade|Source+Serif+Pro|Zeyada');
  3. @import url('https://fonts.googleapis.com/css?family=Georgia');
  4.  
  5.  
  6. .pfor{ display:none; background-color:transparent; }
  7.   body {background:url('') top left fixed repeat;
  8.   background-color:#fff;
  9.   overflow:hidden; }
  10.  
  11. #profile{ border:0px; background-color:transparent; }
  12. *{cursor:url('https://i.imgur.com/8QmAMfq.png'), default; }
  13.  
  14.    ::-webkit-scrollbar { width:5px; height:0px;
  15.    background:; }
  16.    ::-webkit-scrollbar-thumb { background-color:#dbd3d2;
  17.    border:1px solid #dbd3d2;
  18.    -webkit-border-radius:10px; border-radius:10px; }
  19.  
  20.  
  21.     body{
  22.  background-color: transparent;
  23.     background-position:right top; background-image: url("");
  24.     background-repeat: repeat; background-attachment:fixed; background-size: repeat}
  25.  
  26.  
  27.     #name{
  28.     height:100px; width:400px;
  29.     top:-15px; left:45px;
  30.     background-color:#;
  31.        color:#d2c4c1;
  32.        font-family:'italianno', cursive;
  33.        font-size:65px;
  34.     letter-spacing:1px;
  35.     text-transform:; text-align:justify;
  36.     margin: 0px 5px 0px; padding:px;
  37.     box-shadow: inset 0px 0px 20px #,
  38.     0px 0px 20px #;
  39.     position:absolute;
  40.     float:left; overflow:auto;
  41.     opacity:.0; transition: 1s;
  42.     filter: blur(0px); opacity:1.0; transition: 1s; }
  43.    
  44.     #titles{ position:absolute;
  45.     width:400px; height:43px;
  46.     left:40px; top:35px;
  47.     background-color:transparent;
  48.     color:#ccbcb8;
  49.     font-family:'IM Fell English SC';
  50.     font-size:11px;
  51.     line-height:15px;
  52.     letter-spacing:1px;
  53.     text-transform:uppercase; text-align:justify;
  54.     padding:13px; float:left;
  55.     overflow:auto; opacity:.0; transition: 1s;  
  56.     filter: blur(0px); opacity:1.0; transition: 1s; }
  57.    
  58.    
  59. #opening{ position:fixed; width:100%; height:100%; left:150px; bottom:150px; }
  60.  
  61.    #opening-img { position:absolute;
  62.    background-image:url('https://i.imgur.com/w5zFJ4E.png');
  63.    background-position:0% 20%; background-size:443px;
  64.    background-attachment: absolute;
  65.    background-repeat:no-repeat;
  66.    height:617px; width:443px;
  67.    bottom:-200px; left:25px;
  68.    filter: blur(0px); opacity:1.0; transition: 1s; }
  69.  
  70. body:hover #opening-img {filter: blur(10px); opacity:.0; transition: 1.5s;}
  71.  
  72.    #opening-img2 { position:absolute;
  73.    background-image:url('https://i.imgur.com/6dyLWnV.png');
  74.    background-position:0% 20%; background-size:430px;
  75.    background-attachment: absolute;
  76.    background-repeat:no-repeat;
  77.    height:617px; width:430px;
  78.    bottom:-100px; left:25px;
  79.    filter: blur(1px); opacity:1.0; transition: 1s;
  80.     animation: bounce 3.25s infinite;
  81.    -o-animation: bounce 3.25s infinite;
  82.    -moz-animation:bounce 3.25s infinite;
  83.    -webkit-animation: bounce 3.25s infinite;
  84.    -webkit-transition: all 0.3s ease-out;
  85.    transition: all 0.8s ease-out;
  86.    }
  87.    @keyframes bounce{
  88.    0% {top: 30px;}
  89.    50% {top: 50px;}
  90.    100% {top: 30px;}
  91.    }
  92. @-webkit-keyframes bounce {
  93.  0% {top: 30px;}
  94.  50% {top: 50px;}
  95.  100% {top: 30px;}
  96.  }
  97.  
  98.     body:hover #opening-img2 {filter: blur(10px); opacity:.0; transition: 1.5s;}
  99.  
  100.  
  101. #ooc{ position:absolute;
  102. width:400px; height:43px;
  103. left:40px; bottom:80px;
  104. background-color:transparent;
  105. color:#ccbcb8;
  106. font-family:'IM Fell English SC';
  107. font-size:10px;
  108. line-height:15px;
  109. letter-spacing:1px;
  110. text-transform:uppercase; text-align:justify;
  111. padding:13px; float:left;
  112. overflow:auto; opacity:.0; transition: 1s;  
  113. filter: blur(0px); opacity:1.0; transition: 1s; }
  114.  
  115.    body:hover #music { opacity:1.0; transition-delay: 1.5s; }
  116.  
  117.  
  118. #container{ position:absolute; left:-105px; bottom:110px; opacity:.0; transition: 1s; }
  119.    body:hover #container { filter: blur(0px); opacity:1.0; transition-delay: 1s; }
  120.    
  121.  
  122.      #portrait { position:absolute;
  123.      background-image:url('https://i.imgur.com/FgGPbSo.pngg');
  124.      background-position:0% 20%; background-size:350px;
  125.      background-attachment: absolute;
  126.      background-repeat:no-repeat;
  127.        box-shadow: inset 0px 0px 20px #fff,
  128.        0px 0px 20px #fff;
  129.      height:478px; width:350px;
  130.      bottom:-50px; left:225px;
  131.      -webkit-filter: grayscale(5%);
  132.      filter: grayscale(5%);}
  133.      body:hover #stats { opacity:1.0; transition-delay:1s; }
  134.    
  135.  
  136. #elf{ position:absolute;
  137. width:190px; height:50px;
  138. left:580px; top:-274px;
  139. background-color:transparent;
  140.    color:#ccbcb8;
  141.    font-family:'IM Fell English SC';
  142.    font-size:22px;
  143. letter-spacing:2px;
  144. text-transform:; text-align:center;
  145. padding:13px; float:left;
  146. overflow:auto; opacity:.0; transition: 1s;  }
  147.     body:hover #elf { opacity:1.0; transition-delay:1s; }
  148.    
  149. #stats{ position:absolute;
  150. width:190px; height:170px;
  151. left:580px; top:-235px;
  152. background-color:transparent;
  153.    color:#a08f8d;
  154.    font-family:'cardo';
  155.    font-size:14px;
  156.    line-height:23px;
  157. letter-spacing:0px;
  158. text-transform:; text-align:justify;
  159. padding:13px; float:left;
  160. border-top:1px dotted #a08f8d;
  161. overflow:auto; opacity:.0; transition: 1s;  }
  162.     body:hover #stats { opacity:1.0; transition-delay:1s; }
  163.  
  164.  
  165.     #story{ position:absolute;
  166. width:190px; height:50px;
  167. left:534px; top:-64px;
  168. background-color:transparent;
  169.    color:#ccbcb8;
  170.    font-family:'IM Fell English SC';
  171.    font-size:18px;
  172. letter-spacing:2px;
  173. text-transform:; text-align:center;
  174. padding:13px; float:left;
  175. overflow:auto; opacity:.0; transition: 1s;  }
  176.     body:hover #story { opacity:1.0; transition-delay:1s; }
  177.    
  178.    
  179. #blurb{ position:absolute;
  180. width:190px; height:200px;
  181. left:580px; top:-29px;
  182. background-color:transparent;
  183.    color:#a08f8d;
  184.    font-family:'cardo';
  185.    font-size:14px;
  186.    line-height:18px;
  187. letter-spacing:0px;
  188. text-transform:; text-align:justify;
  189. padding:13px; float:left;
  190. border-top:1px dotted #a08f8d;
  191. border-bottom:1px dotted #a08f8d;
  192. overflow:auto; opacity:.0; transition: 1s;  }
  193.     body:hover #blurb { opacity:1.0; transition-delay:1s; }
  194.    
  195.    
  196. #headcanons{ position:absolute;
  197. width:545px; height:160px;
  198. left:207px; bottom:-236px;
  199. background-color:transparent;
  200.    color:#a08f8d;
  201.    font-family:'cardo';
  202.    font-size:12px;
  203.    line-height:18px;
  204. letter-spacing:1px;
  205. text-transform:; text-align:justify;
  206. padding:13px; float:left;
  207. border-top:1px dotted #a08f8d;
  208. overflow:auto; opacity:.0; transition: 1s;  }
  209.     body:hover #headcanons { opacity:1.0; transition-delay:1s; }
  210.  
  211.     #headcanons::first-letter{
  212.     background-color:#ccbcb8;
  213.        color:#fff;
  214.        font-family:'cinzel decorative', cursive;
  215.        font-size:35px;
  216.     line-height:35px;
  217.     letter-spacing:1px;
  218.     text-transform:uppercase;
  219.     text-shadow: 1px 0px 0px #a08f8d,
  220.     0px 1px 0px #a08f8d,
  221.     -1px 0px 0px #a08f8d,
  222.     0px -1px 0px #a08f8d;
  223.     margin: 0px 5px 0px; padding:10px;
  224.     box-shadow: inset 0px 0px 20px #a08f8d,
  225.      0px 0px 20px #a08f8d;
  226.     float:left; }
  227.  
  228. #people{ position:absolute;
  229. width:190px; height:50px;
  230. left:575px; bottom:-127px;
  231. background-color:transparent;
  232.    color:#a08f8d;
  233.    font-family:'cardo';
  234.    font-size:15px;
  235.    line-height:18px;
  236. letter-spacing:1px;
  237. text-transform:; text-align:justify;
  238. padding:13px; float:left;
  239. overflow:auto; opacity:.0; transition: 1s;  }
  240.     body:hover #people { opacity:1.0; transition-delay:1s; }
  241.  
  242.  
  243.     b{ color:#a08f8d;
  244.     font-family:'teko';
  245.     font-size:12px;
  246.     letter-spacing:3px;
  247.     line-height:18px;
  248.     text-transform:uppercase;
  249.     text-align:center;
  250.     }
  251.    
  252.     s{ color:#ccbcb8; }
  253.    
  254. a {color:#a08f8d;
  255. letter-spacing:1px;
  256. line-height:18px;
  257. text-decoration:none;  
  258. text-transform:;
  259.  padding:1px; display:inline-block; }
  260.     a:hover {color:#a08f8d;
  261.     text-shadow: 0px -4px 3px #dbd3d2,
  262.             0px 4px 3px #dbd3d2,
  263.             0px 2px 2px #815761,
  264.             0px -2px 2px #815761;
  265.     text-decoration: none;
  266.     transition: 1.2s;
  267.     }
  268.  
  269. a[data-tooltip] { position: relative; }
  270. a[data-tooltip]::before,
  271. a[data-tooltip]::after { position: absolute;
  272.  display: none;
  273.  opacity: .9; }
  274. a[data-tooltip]::before { content: attr(data-tooltip);
  275.  background: #ccbcb8;
  276.  color: #a08f8d;
  277.  font-family:'teko'; font-size:14px;
  278.  letter-spacing:1px; padding:2px;
  279.  border-radius: 5px;  width:65px;
  280.  text-decoration: none;
  281.  box-shadow: 1px 0px 0px #d2cac9,
  282.     0px 1px 0px #d2cac9,
  283.     -1px 0px 0px #d2cac9,
  284.     0px -1px 0px #d2cac9; }
  285. a[data-tooltip]::after { width:0; height:0;
  286.  border: 6px solid transparent;
  287.  content: ''; }
  288. a[data-tooltip]:hover::before,
  289. a[data-tooltip]:hover::after {
  290.  display: block; }
  291. a[data-tooltip][data-placement="bottom"]::before {
  292.   top: 100%; left: 0;
  293.   margin-top: 10px; }
  294. a[data-tooltip][data-placement="bottom"]::after {
  295.   border-bottom-color: #ccbcb8;
  296.   border-top: none;
  297.   top: 100%;
  298.   left: 10px;
  299.   margin-top: 4px; }
  300.  
  301. u { position:absolute;
  302. background-color:transparent;
  303.    color:#a08f8d;
  304.    font-family:'IM Fell English SC';
  305.    font-size:10px;
  306.    line-height:15px;
  307. letter-spacing:1px;
  308. border-bottom:1px dotted #bbb;
  309. text-decoration:none;  
  310. text-transform:uppercase; text-align:justify;
  311. padding:2px; }
  312.  
  313. </style>
  314. <body>
  315.  
  316.  <div id="opening">
  317.  <div id="opening-img">
  318.  <div id="opening-img2"></div>
  319.  
  320.  <div id="name">
  321.  <center> Ellana Lavellan </center>
  322.     </div>
  323.  <div id="titles">
  324.  <center>former inquisitor. holy stump of andraste. <br> dragon age: inquisition.</center>
  325.     </div>
  326.  <div id="ooc">
  327.  <center> tap or hover for full profile. </center>
  328.     </div>
  329.    
  330.  </div>
  331.  
  332.  
  333. <div id="container">
  334.  
  335.     <div id="portrait">
  336.     </div>
  337.  
  338.  <div id="music-player">
  339. <div style="margin-top:4px;">
  340. <audio controls style="opacity:1; width:150px; margin-bottom:91px; margin-left:365px;" loop="">
  341. <source src="https://dl.dropboxusercontent.com/s/n9ypdx293py3me6/DAI%20Tavern%20Songs.mp3?dl=0">
  342. </audio>
  343. </div>
  344. </div>
  345.  
  346.  
  347.  <div id="elf">THE ELF</div>
  348.  <div id="stats">
  349.  
  350.  <u>full name:</u> <font style="float:right;">Ellana Lavellan</font><br>
  351.  <u>age:</u> <font style="float:right;">Early 30s</font><br>
  352.  <u>height:</u> <font style="float:right;">5’04”</font><br>
  353.  <u>class:</u> <font style="float:right;">Shapeshifter</font><br>
  354.  <u>affiliation:</u> <font style="float:right;"><s><i>Inquisition</i></s></font><br>
  355.  <font style="float:right;">Friends of Red Jenny</font><br>
  356.  <font style="float:right;">Clan Lavellan</font>
  357.  </div>
  358.  
  359.  <div id="story">HISTORY</div>
  360.  
  361.  <div id="blurb">
  362.  
  363.  Once the First of her Clan, Ellana retains a profound connection to the earth and all that depends on it — one that enhances her senses; reveals paths where most see none; and serves as an anchor for an otherwise unpredictable nature.
  364.  <br> <font color="white">❧</font> At the Well of Sorrows, she told Morrigan to fuck off and drank from the Well herself.
  365.  
  366.  </div>
  367.  <div id="headcanons">
  368. <span style="font-family: 'IM Fell English SC'; font-size:18px; color:#a08f8d; letter-spacing:1px;">THE STORY SO FAR...</span>
  369.     <br><br>
  370.     <center><i>Under Construction</i></center>
  371.  
  372.  </div>
  373.  <div id="people">
  374.  <center>❦</center>
  375.  
  376.  </div>
  377.  
  378.  </div>
  379. </body>
RAW Paste Data
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
 
Top