Advertisement
Not a member of Pastebin yet?
Sign Up,
it unlocks many cool features!
- <style>
- @import url('https://fonts.googleapis.com/css?family=Cardo|Cinzel+Decorative|IM+Fell+English+SC|Italianno|Jim+Nightshade|Source+Serif+Pro|Zeyada');
- @import url('https://fonts.googleapis.com/css?family=Georgia');
- .pfor{ display:none; background-color:transparent; }
- body {background:url('') top left fixed repeat;
- background-color:#fff;
- overflow:hidden; }
- #profile{ border:0px; background-color:transparent; }
- *{cursor:url('https://i.imgur.com/8QmAMfq.png'), default; }
- ::-webkit-scrollbar { width:5px; height:0px;
- background:; }
- ::-webkit-scrollbar-thumb { background-color:#dbd3d2;
- border:1px solid #dbd3d2;
- -webkit-border-radius:10px; border-radius:10px; }
- body{
- background-color: transparent;
- background-position:right top; background-image: url("");
- background-repeat: repeat; background-attachment:fixed; background-size: repeat}
- #name{
- height:100px; width:400px;
- top:-15px; left:45px;
- background-color:#;
- color:#d2c4c1;
- font-family:'italianno', cursive;
- font-size:65px;
- letter-spacing:1px;
- text-transform:; text-align:justify;
- margin: 0px 5px 0px; padding:px;
- box-shadow: inset 0px 0px 20px #,
- 0px 0px 20px #;
- position:absolute;
- float:left; overflow:auto;
- opacity:.0; transition: 1s;
- filter: blur(0px); opacity:1.0; transition: 1s; }
- #titles{ position:absolute;
- width:400px; height:43px;
- left:40px; top:35px;
- background-color:transparent;
- color:#ccbcb8;
- font-family:'IM Fell English SC';
- font-size:11px;
- line-height:15px;
- letter-spacing:1px;
- text-transform:uppercase; text-align:justify;
- padding:13px; float:left;
- overflow:auto; opacity:.0; transition: 1s;
- filter: blur(0px); opacity:1.0; transition: 1s; }
- #opening{ position:fixed; width:100%; height:100%; left:150px; bottom:150px; }
- #opening-img { position:absolute;
- background-image:url('https://i.imgur.com/w5zFJ4E.png');
- background-position:0% 20%; background-size:443px;
- background-attachment: absolute;
- background-repeat:no-repeat;
- height:617px; width:443px;
- bottom:-200px; left:25px;
- filter: blur(0px); opacity:1.0; transition: 1s; }
- body:hover #opening-img {filter: blur(10px); opacity:.0; transition: 1.5s;}
- #opening-img2 { position:absolute;
- background-image:url('https://i.imgur.com/6dyLWnV.png');
- background-position:0% 20%; background-size:430px;
- background-attachment: absolute;
- background-repeat:no-repeat;
- height:617px; width:430px;
- bottom:-100px; left:25px;
- filter: blur(1px); opacity:1.0; transition: 1s;
- animation: bounce 3.25s infinite;
- -o-animation: bounce 3.25s infinite;
- -moz-animation:bounce 3.25s infinite;
- -webkit-animation: bounce 3.25s infinite;
- -webkit-transition: all 0.3s ease-out;
- transition: all 0.8s ease-out;
- }
- @keyframes bounce{
- 0% {top: 30px;}
- 50% {top: 50px;}
- 100% {top: 30px;}
- }
- @-webkit-keyframes bounce {
- 0% {top: 30px;}
- 50% {top: 50px;}
- 100% {top: 30px;}
- }
- body:hover #opening-img2 {filter: blur(10px); opacity:.0; transition: 1.5s;}
- #ooc{ position:absolute;
- width:400px; height:43px;
- left:40px; bottom:80px;
- background-color:transparent;
- color:#ccbcb8;
- font-family:'IM Fell English SC';
- font-size:10px;
- line-height:15px;
- letter-spacing:1px;
- text-transform:uppercase; text-align:justify;
- padding:13px; float:left;
- overflow:auto; opacity:.0; transition: 1s;
- filter: blur(0px); opacity:1.0; transition: 1s; }
- body:hover #music { opacity:1.0; transition-delay: 1.5s; }
- #container{ position:absolute; left:-105px; bottom:110px; opacity:.0; transition: 1s; }
- body:hover #container { filter: blur(0px); opacity:1.0; transition-delay: 1s; }
- #portrait { position:absolute;
- background-image:url('https://i.imgur.com/FgGPbSo.pngg');
- background-position:0% 20%; background-size:350px;
- background-attachment: absolute;
- background-repeat:no-repeat;
- box-shadow: inset 0px 0px 20px #fff,
- 0px 0px 20px #fff;
- height:478px; width:350px;
- bottom:-50px; left:225px;
- -webkit-filter: grayscale(5%);
- filter: grayscale(5%);}
- body:hover #stats { opacity:1.0; transition-delay:1s; }
- #elf{ position:absolute;
- width:190px; height:50px;
- left:580px; top:-274px;
- background-color:transparent;
- color:#ccbcb8;
- font-family:'IM Fell English SC';
- font-size:22px;
- letter-spacing:2px;
- text-transform:; text-align:center;
- padding:13px; float:left;
- overflow:auto; opacity:.0; transition: 1s; }
- body:hover #elf { opacity:1.0; transition-delay:1s; }
- #stats{ position:absolute;
- width:190px; height:170px;
- left:580px; top:-235px;
- background-color:transparent;
- color:#a08f8d;
- font-family:'cardo';
- font-size:14px;
- line-height:23px;
- letter-spacing:0px;
- text-transform:; text-align:justify;
- padding:13px; float:left;
- border-top:1px dotted #a08f8d;
- overflow:auto; opacity:.0; transition: 1s; }
- body:hover #stats { opacity:1.0; transition-delay:1s; }
- #story{ position:absolute;
- width:190px; height:50px;
- left:534px; top:-64px;
- background-color:transparent;
- color:#ccbcb8;
- font-family:'IM Fell English SC';
- font-size:18px;
- letter-spacing:2px;
- text-transform:; text-align:center;
- padding:13px; float:left;
- overflow:auto; opacity:.0; transition: 1s; }
- body:hover #story { opacity:1.0; transition-delay:1s; }
- #blurb{ position:absolute;
- width:190px; height:200px;
- left:580px; top:-29px;
- background-color:transparent;
- color:#a08f8d;
- font-family:'cardo';
- font-size:14px;
- line-height:18px;
- letter-spacing:0px;
- text-transform:; text-align:justify;
- padding:13px; float:left;
- border-top:1px dotted #a08f8d;
- border-bottom:1px dotted #a08f8d;
- overflow:auto; opacity:.0; transition: 1s; }
- body:hover #blurb { opacity:1.0; transition-delay:1s; }
- #headcanons{ position:absolute;
- width:545px; height:160px;
- left:207px; bottom:-236px;
- background-color:transparent;
- color:#a08f8d;
- font-family:'cardo';
- font-size:12px;
- line-height:18px;
- letter-spacing:1px;
- text-transform:; text-align:justify;
- padding:13px; float:left;
- border-top:1px dotted #a08f8d;
- overflow:auto; opacity:.0; transition: 1s; }
- body:hover #headcanons { opacity:1.0; transition-delay:1s; }
- #headcanons::first-letter{
- background-color:#ccbcb8;
- color:#fff;
- font-family:'cinzel decorative', cursive;
- font-size:35px;
- line-height:35px;
- letter-spacing:1px;
- text-transform:uppercase;
- text-shadow: 1px 0px 0px #a08f8d,
- 0px 1px 0px #a08f8d,
- -1px 0px 0px #a08f8d,
- 0px -1px 0px #a08f8d;
- margin: 0px 5px 0px; padding:10px;
- box-shadow: inset 0px 0px 20px #a08f8d,
- 0px 0px 20px #a08f8d;
- float:left; }
- #people{ position:absolute;
- width:190px; height:50px;
- left:575px; bottom:-127px;
- background-color:transparent;
- color:#a08f8d;
- font-family:'cardo';
- font-size:15px;
- line-height:18px;
- letter-spacing:1px;
- text-transform:; text-align:justify;
- padding:13px; float:left;
- overflow:auto; opacity:.0; transition: 1s; }
- body:hover #people { opacity:1.0; transition-delay:1s; }
- b{ color:#a08f8d;
- font-family:'teko';
- font-size:12px;
- letter-spacing:3px;
- line-height:18px;
- text-transform:uppercase;
- text-align:center;
- }
- s{ color:#ccbcb8; }
- a {color:#a08f8d;
- letter-spacing:1px;
- line-height:18px;
- text-decoration:none;
- text-transform:;
- padding:1px; display:inline-block; }
- a:hover {color:#a08f8d;
- text-shadow: 0px -4px 3px #dbd3d2,
- 0px 4px 3px #dbd3d2,
- 0px 2px 2px #815761,
- 0px -2px 2px #815761;
- text-decoration: none;
- transition: 1.2s;
- }
- a[data-tooltip] { position: relative; }
- a[data-tooltip]::before,
- a[data-tooltip]::after { position: absolute;
- display: none;
- opacity: .9; }
- a[data-tooltip]::before { content: attr(data-tooltip);
- background: #ccbcb8;
- color: #a08f8d;
- font-family:'teko'; font-size:14px;
- letter-spacing:1px; padding:2px;
- border-radius: 5px; width:65px;
- text-decoration: none;
- box-shadow: 1px 0px 0px #d2cac9,
- 0px 1px 0px #d2cac9,
- -1px 0px 0px #d2cac9,
- 0px -1px 0px #d2cac9; }
- a[data-tooltip]::after { width:0; height:0;
- border: 6px solid transparent;
- content: ''; }
- a[data-tooltip]:hover::before,
- a[data-tooltip]:hover::after {
- display: block; }
- a[data-tooltip][data-placement="bottom"]::before {
- top: 100%; left: 0;
- margin-top: 10px; }
- a[data-tooltip][data-placement="bottom"]::after {
- border-bottom-color: #ccbcb8;
- border-top: none;
- top: 100%;
- left: 10px;
- margin-top: 4px; }
- u { position:absolute;
- background-color:transparent;
- color:#a08f8d;
- font-family:'IM Fell English SC';
- font-size:10px;
- line-height:15px;
- letter-spacing:1px;
- border-bottom:1px dotted #bbb;
- text-decoration:none;
- text-transform:uppercase; text-align:justify;
- padding:2px; }
- </style>
- <body>
- <div id="opening">
- <div id="opening-img">
- <div id="opening-img2"></div>
- <div id="name">
- <center> Ellana Lavellan </center>
- </div>
- <div id="titles">
- <center>former inquisitor. holy stump of andraste. <br> dragon age: inquisition.</center>
- </div>
- <div id="ooc">
- <center> tap or hover for full profile. </center>
- </div>
- </div>
- <div id="container">
- <div id="portrait">
- </div>
- <div id="music-player">
- <div style="margin-top:4px;">
- <audio controls style="opacity:1; width:150px; margin-bottom:91px; margin-left:365px;" loop="">
- <source src="https://dl.dropboxusercontent.com/s/n9ypdx293py3me6/DAI%20Tavern%20Songs.mp3?dl=0">
- </audio>
- </div>
- </div>
- <div id="elf">THE ELF</div>
- <div id="stats">
- <u>full name:</u> <font style="float:right;">Ellana Lavellan</font><br>
- <u>age:</u> <font style="float:right;">Early 30s</font><br>
- <u>height:</u> <font style="float:right;">5’04”</font><br>
- <u>class:</u> <font style="float:right;">Shapeshifter</font><br>
- <u>affiliation:</u> <font style="float:right;"><s><i>Inquisition</i></s></font><br>
- <font style="float:right;">Friends of Red Jenny</font><br>
- <font style="float:right;">Clan Lavellan</font>
- </div>
- <div id="story">HISTORY</div>
- <div id="blurb">
- 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.
- <br> <font color="white">❧</font> At the Well of Sorrows, she told Morrigan to fuck off and drank from the Well herself.
- </div>
- <div id="headcanons">
- <span style="font-family: 'IM Fell English SC'; font-size:18px; color:#a08f8d; letter-spacing:1px;">THE STORY SO FAR...</span>
- <br><br>
- <center><i>Under Construction</i></center>
- </div>
- <div id="people">
- <center>❦</center>
- </div>
- </div>
- </body>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement