ChaZayari

Orrin

Oct 8th, 2020
58
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 4.45 KB | None | 0 0
  1. <style>
  2. @import url('https://fonts.googleapis.com/css2?family=Cormorant+Garamond&family=Cormorant+Unicase&display=swap');
  3. ::-webkit-scrollbar{width:0vw;height:0vh;}
  4. ::-webkit-scrollbar-track{border-radius:0;background:transparent;}
  5. ::-webkit-scrollbar-thumb{border-radius:0;background:transparent;}
  6.  
  7.  
  8.  
  9. body{
  10. background: #66583d;
  11. }
  12.  
  13.  
  14. #image{
  15. position: fixed;
  16. background: url(https://i.imgur.com/whOL3vy.jpg);
  17. background-position:0% 20%;
  18. background-size: cover;
  19. height: 30vh;
  20. width: 40vw;
  21. top: 20vh;
  22. left: 30vw;
  23. }
  24.  
  25. #title{
  26. position: fixed;
  27. height: 6vh;
  28. width: 40vw;
  29. left:30vw;
  30. top: 44.25vh;
  31. font-family: 'Cormorant Unicase';
  32. font-size: 6vh;
  33. color: #fff;
  34. }
  35.  
  36.  
  37. #box1, #box2, #box3{
  38. position: fixed;
  39. bottom: 10vh;
  40. padding: 0.5%;
  41. height: 35vh;
  42. width: 11.5vw;
  43. border: .5vh #472d11 solid;
  44. background: #fcf7e6;
  45. font-family: 'Cormorant Garamond';
  46. font-size: 2vh;
  47. color: #472d11;
  48. overflow: auto;
  49. }
  50.  
  51. #box1{
  52. left: 30vw;
  53. }
  54.  
  55. #box2{
  56. left: 43.65vw;
  57. }
  58.  
  59. #box3{
  60. right: 30vw;
  61. }
  62.  
  63. h1{
  64. font-size: 3.25vh;
  65. font-weight: lighter;
  66. border-bottom: .25vh #472d11 solid;
  67. }
  68.  
  69. a{color: #472d11;
  70. text-decoration: underline;
  71. transition: 0.3s;
  72. }
  73. a:hover{
  74. color: #fff;
  75. transition: 0.3s;
  76. }
  77.  
  78. .r{float: right;
  79.  
  80.  
  81. </style>
  82.  
  83. <div id="image"></div>
  84. <div id="title">Orrin Azahlmar</div>
  85.  
  86. <div id="box1">
  87. <h1>Stats</h1>
  88. Name<div class="r">Stat</div><br>
  89. Name<div class="r">Stat</div><br>
  90. Name<div class="r">Stat</div><br>
  91. Name<div class="r">Stat</div><br>
  92. <br>
  93. Name<div class="r">Stat</div><br>
  94. Name<div class="r">Stat</div><br>
  95. Name<div class="r">Stat</div><br>
  96. Name<div class="r">Stat</div><br>
  97. <br>
  98. Name<div class="r">Stat</div><br>
  99. Name<div class="r">Stat</div><br>
  100. Name<div class="r">Stat</div><br>
  101. Name<div class="r">Stat</div><br>
  102. </div>
  103. <div id="box2">
  104. <font style="text-align:center"><h1>OOC</h1></font>
  105. <ol>
  106. <li></li>
  107. <li></li>
  108. <li></li>
  109. <li></li>
  110. <li></li>
  111. <li></li>
  112. <li>Layout built by <a href="https://roleplay.chat/profile.php?user=From+Shadows">From Shadows</a> for Orrin's use only.</li>
  113. </div>
  114. <div id="box3">
  115. <font style="text-align:right"><h1>Story</h1></font>
  116. <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Sed elementum tempus egestas sed. Enim nunc faucibus a pellentesque sit amet porttitor. Felis donec et odio pellentesque diam. Pellentesque diam volutpat commodo sed egestas egestas. Nulla porttitor massa id neque aliquam. In ornare quam viverra orci sagittis. Velit euismod in pellentesque massa placerat duis ultricies. A condimentum vitae sapien pellentesque habitant morbi tristique senectus. Amet justo donec enim diam vulputate ut pharetra sit amet. Vel facilisis volutpat est velit egestas dui id. Sit amet est placerat in. Sit amet volutpat consequat mauris. Fermentum et sollicitudin ac orci phasellus egestas tellus rutrum tellus. Sodales ut etiam sit amet.</p>
  117.  
  118. <p>Donec enim diam vulputate ut pharetra sit amet aliquam. Eget magna fermentum iaculis eu non diam phasellus. Nulla facilisi nullam vehicula ipsum a. Platea dictumst vestibulum rhoncus est pellentesque. In hendrerit gravida rutrum quisque non tellus orci. Nibh praesent tristique magna sit. Risus in hendrerit gravida rutrum quisque. Vel risus commodo viverra maecenas accumsan lacus vel facilisis. Elementum nibh tellus molestie nunc non blandit. Diam quam nulla porttitor massa id neque aliquam vestibulum. Pellentesque adipiscing commodo elit at imperdiet dui accumsan sit amet. Habitant morbi tristique senectus et netus et. Elementum sagittis vitae et leo duis ut.</p>
  119.  
  120. <p>Ornare massa eget egestas purus viverra. Arcu non odio euismod lacinia. Venenatis urna cursus eget nunc scelerisque viverra. Sodales ut etiam sit amet nisl purus in mollis. Cursus metus aliquam eleifend mi in nulla posuere sollicitudin. Quis ipsum suspendisse ultrices gravida dictum fusce. In ornare quam viverra orci. Nisl tincidunt eget nullam non. Ac tortor dignissim convallis aenean et tortor at risus. Dolor sed viverra ipsum nunc aliquet bibendum. Scelerisque eu ultrices vitae auctor eu augue. Sit amet nisl suscipit adipiscing. Etiam tempor orci eu lobortis. Nam libero justo laoreet sit amet cursus sit amet. Et leo duis ut diam quam nulla porttitor massa. Lobortis feugiat vivamus at augue. Accumsan sit amet nulla facilisi morbi tempus. Amet consectetur adipiscing elit pellentesque habitant morbi tristique. Maecenas pharetra convallis posuere morbi leo. Dui faucibus in ornare quam viverra orci.</p>
  121. </div>
Add Comment
Please, Sign In to add comment