Advertisement
Not a member of Pastebin yet?
Sign Up,
it unlocks many cool features!
- <style type="text/css">
- @import url(https://fonts.googleapis.com/css?family=Farsan);
- @import url(https://fonts.googleapis.com/css?family=Aref+Ruqaa);
- @import url(https://fonts.googleapis.com/css?family=Allura);
- @import url(https://fonts.googleapis.com/css?family=Amatic+SC);
- ::-webkit-scrollbar { width: 3px; }
- ::-webkit-scrollbar-track { border-radius: 2px; background-color: #; }
- ::-webkit-scrollbar-thumb { border-radius: 2px; background-color: #ccc; }
- body {
- background-image: url("http://i.imgur.com/X4fxTgD.png");
- background-repeat:no-repeat;
- background-color: #949697;
- background-size: 23% 90%;
- background-position: left bottom;
- margin: 0;
- }
- @font-face{
- font-family: 'Murder';
- src:url(https://dl.dropboxusercontent.com/s/2c0jc49lbcn1nwm/youmurdererbb_reg.otf);
- }
- .name{position: absolute;
- z-index:50;
- left: 6%;
- top: -10%;
- color: #000;
- text-shadow: -2px 0 #fff, 0 -2px #fff,-2px 0 #fff, 0 -2px #fff;
- font-family: Murder;
- line-height:00px;
- text-align:center;
- font-size: 6vw;
- letter-spacing: 0vw;}
- #box {
- z-index: 10;
- background: url();
- background-size: 1;
- background-position: bottom left;
- background-repeat: repeat;
- border-radius: 10px 10px 10px 10px;
- background-size: ;
- position: absolute;
- background-color:#807998;
- border: 0px solid #a39cae;
- top:22%;
- left: 30%;
- height:55%;
- width: 50%;
- }
- .thoughts{
- position:absolute;
- top:10%;
- left:-4.5%;
- width: 0;
- height: 0;
- border-top: 30px solid transparent;
- border-bottom: 30px solid transparent;
- border-left: 42px solid #807998;
- transform: rotate (-180deg);
- -webkit-transform: rotate(-180deg);
- -ms-transform: rotate (-180deg);
- }
- .gif { position: absolute;
- top: 3%;
- left: 3%;
- width: 25%;
- height: 23%;
- border: 3px solid #673a7f;
- background-image: url(http://i.imgur.com/e7cQ66w.gif);
- background-size: 100% 100%;
- border-radius: 5px 5px 5px 5px;}
- .tab1 { z-index:10; position: absolute; top: 29%; left: 4%; width: 4%; height: 7%; border-radius: 0%;background-color: #;border:1px solid #;background: url(http://i.imgur.com/3Xvzby3.png);
- background-size: 100% 100%; -webkit-filter: grayscale(100%);-webkit-transition: all 0.9s ease-out; -moz-transition: all 0.9s ease-out;}
- .tab1:hover { z-index:10; position: absolute;border:2px solid #;-webkit-filter: grayscale(0%);-webkit-transition: all 0.9s ease-out; -moz-transition: all 0.9s ease-out;}
- .tab2 { z-index:10; position: absolute; top: 29%; left: 9%; width: 4%; height: 7%; border-radius: 0%;background-color: #;border:1px solid #;background:url(http://i.imgur.com/3Xvzby3.png);
- background-size: 100% 100%; -webkit-filter: grayscale(100%);-webkit-transition: all 0.9s ease-out; -moz-transition: all 0.9s ease-out;}
- .tab2:hover { z-index:10; position: absolute;border:2px solid #;-webkit-filter: grayscale(0%);-webkit-transition: all 0.9s ease-out; -moz-transition: all 0.9s ease-out;}
- .tab3 { z-index:10; position: absolute; top: 29%; left: 14%; width: 4%; height: 7%; border-radius: 0%;background-color: #;border:1px solid #;background:url(http://i.imgur.com/3Xvzby3.png);
- background-size: 100% 100%; -webkit-filter: grayscale(100%);-webkit-transition: all 0.9s ease-out; -moz-transition: all 0.9s ease-out;}
- .tab3:hover { z-index:10; position: absolute;border:2px solid #;-webkit-filter: grayscale(0%);-webkit-transition: all 0.9s ease-out; -moz-transition: all 0.9s ease-out;}
- .tab4 { z-index:10; position: absolute; top: 29%; left: 19%; width: 4%; height: 7%; border-radius: 0%;background-color: #;border:1px solid #;background:url(http://i.imgur.com/3Xvzby3.png);
- background-size: 100% 100%; -webkit-filter: grayscale(100%);-webkit-transition: all 0.9s ease-out; -moz-transition: all 0.9s ease-out;}
- .tab4:hover { z-index:10; position: absolute;border:2px solid #;-webkit-filter: grayscale(0%);-webkit-transition: all 0.9s ease-out; -moz-transition: all 0.9s ease-out;}
- .tab5 { z-index:10; position: absolute; top: 29%; left: 24%; width: 4%; height: 7%; border-radius: 0%;background-color: #;border:1px solid #;background:url(http://i.imgur.com/3Xvzby3.png);
- background-size: 100% 100%; -webkit-filter: grayscale(100%);-webkit-transition: all 0.9s ease-out; -moz-transition: all 0.9s ease-out;}
- .tab5:hover { z-index:10; position: absolute;border:2px solid #;-webkit-filter: grayscale(0%);-webkit-transition: all 0.9s ease-out; -moz-transition: all 0.9s ease-out;}
- .content {position: absolute;z-index: -1; left: 35%; top:3%; border-left: 3px solid #;border-radius: 0px 0px 0px 0px; height:91.5%; width:0%; background-color:#000; overflow-x:auto;overflow-y:auto;
- font-family:Amatic SC; font-size:18px;line-height:15px;padding:3px;opacity:0;color:#fff;-webkit-transition: all 1.5s ease-in-out;-moz-transition: all 1.5s ease-in-out;-ms-transition: all 1.5s ease-in-out;
- -o-transition: all 1.5s ease-in-out;transition: all 1.5s ease-in-out;}
- .content:target{position: absolute;z-index: 3; opacity:0.9;width:59%; -webkit-transition: all 1.5s ease-in-out;-moz-transition: all 1.5s ease-in-out;-ms-transition: all 1.5s ease-in-out;
- -o-transition: all 1.5s ease-in-out;transition: all 1.5s ease-in-out;}
- .oocbox {position: absolute;
- z-index: 3;
- left: 3%;
- top:38%;
- border: 1px solid #673a7f;
- height:56%;
- width:25%;
- background-color:#766F8E;
- overflow-x:auto;
- overflow-y:auto;
- font-family:Amatic SC;
- font-size:18px;
- line-height:14px;
- padding:3px;
- font-weight:bold;
- color:#ccc;}
- h1 {width: 100%; height: auto; font-size: 35px;font-family:Murder;letter-spacing: 0.1vw;margin-top:5px; margin-bottom: 10px; text-align: center; border-bottom: 2px solid #; color: #766F8E;}
- h2 {width: 100%; height: auto; font-size: 30px;font-family:Murder;letter-spacing: 0.1vw;margin-top:5px; margin-bottom: 10px; text-align: center; border-bottom: 2px solid #; color: #2a0c42;}
- b, strong { color: #819ED2;}
- a {color: #969696; text-decoration: none; }
- a:hover {color: #fff;cursor: url('http://media.tumblr.com/e7f72e808c4dbe5006b9c3a30dbc9b79/tumblr_inline_mh67vhwGnR1rdqsqf.png');}
- </style>
- <div id="box">
- <div class="name">
- Frisk
- </div>
- <div class="gif"></div>
- <div class="thoughts"></div>
- <a href="#1"><div class="tab1"></div></a>
- <a href="#2"><div class="tab2"></div></a>
- <a href="#3"><div class="tab3"></div></a>
- <a href="#4"><div class="tab4"></div></a>
- <a href="#Reset"><div class="tab5"></div></a>
- <div class="oocbox">
- <h2>OoC</h2>
- </div>
- <div id="1" class="content">
- <h1>Title</h1>
- Words <b>Bold</b> <i>Italics</i> <a href="profile.php?user=???" target="_blank">Link</a>
- </div>
- <div id="2" class="content">
- <h1>Title</h1>
- </div>
- <div id="3" class="content">
- <h1>Title</h1>
- </div>
- <div id="4" class="content">
- <h1>Title</h1>
- </div>
- </div>
- </div>
- </div>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement