Advertisement
Guest User

Expert CSS

a guest
Oct 25th, 2015
421
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 4.54 KB | None | 0 0
  1. /*This profile template has been created by the one known as Rannel. It's intended purpose is to be both a template and a learning tool for those curious on how to use different codes - majorly css and java. It is for intermediate use only. The creator will help answer questions, if only the one using this template has a basic knowledge of both css and java. Most, if not all text edits NEED TO BE DONE IN HTML. DO NOT TOUCH JAVA UNLESS EXPERIENCED.*/
  2. #profile-container {background:none;}
  3. *, body, a {cursor: url(http://img62.imageshack.us/img62/3750/840y.png), progress !important;}
  4. a:link, a:visited, a:active{
  5. color: inherit;
  6. text-decoration: none;
  7. -moz-transition: 0.5s;
  8. -webkit-transition: 0.5s;
  9. -o-transition: 0.5s;
  10. }
  11. a:hover {
  12. cursor: url(http://cur.cursors-4u.net/others/oth-6/oth589.cur), progress !important;
  13. }
  14. .links {
  15. display: inline-block;
  16. position: relative;
  17. }
  18. .links:after {
  19. display: block;
  20. content: "";
  21. margin-top: -6px;
  22. width: 0;
  23. background: transparent;
  24. border-bottom: 1px solid transparent;
  25. -moz-transition: 0.5s;
  26. -webkit-transition: 0.5s;
  27. -o-transition: 0.5s;
  28. }
  29. .links:hover:after {
  30. width: 100%;
  31. border-bottom: 1px solid #6B676B;
  32. }
  33. @font-face {
  34. src: url(https://dl.dropboxusercontent.com/u/62876172/basictitlefont.ttf);
  35. font-family: basictitle;
  36. }
  37. /*bold, italics, underline*/
  38. strong {
  39. letter-spacing: 1px;
  40. border-bottom: 1px dotted #6B676B;
  41. }
  42. em {
  43. color: #FCFBE3;
  44. }
  45. /*LINE*/
  46. #line {
  47. position: fixed;
  48. left: 0; margin-top: 200px;
  49. width: 100%; height: 100px;
  50. background: #4b1e1b;
  51. }
  52. /*Profile Begin*/
  53. #box {
  54. position: absolute;
  55. margin-top: 130px; right: 0;
  56. width: 500px; height: 230px;
  57. background: #FCFBE3;
  58. border: 3px solid #4b1e1b;
  59. }
  60. .borderr {
  61. position: absolute;
  62. top: 20px; left: 20px;
  63. width: 184px; height: 184px;
  64. border: 3px solid #4b1e1b;
  65. }
  66. .pic {
  67. position: absolute;
  68. top: 5%; left: 5%;
  69. width: 90%; height: 90%;
  70. background: url(http://i.imgur.com/2zZYpkt.jpg);
  71. /* WARNING - only use this if you are familiar with how to position images in CSS */
  72. background-position: /* horizontal position */ 50% /* vertical */ 45%;
  73. background-size: 170%;
  74. -webkit-filter: grayscale(50%);
  75. -moz-filter: grayscale(50%);
  76. -ms-filter: grayscale(50%);
  77. -o-filter: grayscale(50%);
  78. filter: grayscale(50%);
  79. }
  80. /*picture hover*/
  81. .over {
  82. position: absolute;
  83. top: 5%; left: 5%;
  84. width: 90%; height: 90%;
  85. background: rgba(255,255,255,.5);
  86. opacity: 0;
  87. -moz-transition: 0.5s;
  88. -webkit-transition: 0.5s;
  89. -o-transition: 0.5s;
  90. }
  91. .over:hover {
  92. opacity: 1;
  93. }
  94. /*Buttons*/
  95. .one, .two, .three {
  96. position: relative;
  97. left: 10%; top: 18%;
  98. margin-bottom: 5%;
  99. width: 80%; height: 15%;
  100. font-family: basictitle;
  101. font-size: 20px;
  102. Color: #FFF;
  103. text-align: center;
  104. padding-top: 6px;
  105. background: rgba(0,0,0,.5);
  106. -moz-transition: 0.5s;
  107. -webkit-transition: 0.5s;
  108. -o-transition: 0.5s;
  109. }
  110. .one:hover, .two:hover, .three:hover {
  111. box-shadow: inset 50px 0 rgba(0,0,0,.5), inset -50px 0 rgba(0,0,0,.5), inset 0 10px rgba(0,0,0,.5), inset 0 -10px rgba(0,0,0,.5);
  112. cursor: url(http://cur.cursors-4u.net/others/oth-6/oth589.cur), progress !important;
  113. }
  114. /*Words at the bottom of profile container.*/
  115. .quote {
  116. position: absolute;
  117. bottom: -5px; right: 0;
  118. font-family: basictitle;
  119. color: #4b1e1b;
  120. font-size: 35px;
  121. }
  122. /*DO NOT EDIT .wordbox*/
  123. .wordbox {
  124. position: absolute;
  125. top: 20px; right: 20px;
  126. width: 260px; height: 170px;
  127. }
  128. /*Editable.*/
  129. .stats {
  130. position: absolute;
  131. top: 32%; left: 0;
  132. width: 100%; height: 65%;
  133. font-family: calibri;
  134. color: #4b1e1b;
  135. font-size: 11px;
  136. text-align: center;
  137. display: none;
  138. }
  139. .bio, .ooc {
  140. position: absolute;
  141. top: 0; left: 0;
  142. width: 100%; height: 100%;
  143. font-family: calibri;
  144. color: #4b1e1b;
  145. font-size: 11px;
  146. line-height: 10px;
  147. text-align: justify;
  148. overflow: auto;
  149. display: none;
  150. }
  151. .bio::first-letter {
  152. font-size: 50px;
  153. line-height: 50px;
  154. font-family: basictitle;
  155. float: left;
  156. background: #4b1e1b;
  157. border: 3px double #FCFBE3;
  158. color: #fff;
  159. height: 30px;
  160. padding: 10px 10px 0 10px;
  161. margin: 0 3px 3px 0px;
  162. }
  163. /*Scrollbar*/
  164. ::-webkit-scrollbar-thumb:vertical {
  165. background-color: #4b1e1b;
  166. height: 30px;
  167. border-right: 7px solid #FCFBE3;
  168. border-left: 8px solid #FCFBE3;
  169. }
  170. ::-webkit-scrollbar-thumb:horizontal {
  171. background-color: #F0E9E9;
  172. height: 7px!important;
  173. }
  174. ::-webkit-scrollbar {
  175. background: #F0E9E9;
  176. border-left: 9px solid #FCFBE3;
  177. border-right: 8px solid #FCFBE3;
  178. height:7px; width: 18px;
  179. }
  180. /*DO NOT EDIT*/
  181. .SEEKINGSMUT {
  182. position: absolute;
  183. bottom: -30px; right: 0;
  184. width: 100%;
  185. font-family: calibri;
  186. color: #4b1e1b;
  187. font-size: 11px;
  188. text-align: center;
  189. }
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement