API tools faq
paste
mik98

grimm siblings - css

mik98
Jul 25th, 2026
10
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 9.94 KB | None | 0 0
raw download clone embed print report
  1. body { background-color:#000!important;}
  2.  
  3.  
  4. #xg_body a { color: #aaa;
  5. }
  6.  
  7. #xg_body a:hover { color: #aaa;
  8. }
  9.  
  10. #xg_layout_column_2 { background: #trans;
  11. font-color: #aaa;
  12. font-family: poppins;
  13. font-size: 12px;
  14. margin-left: -115px;
  15. margin-top: 0px;
  16. width: 1200px;
  17. height: 500px;
  18. }
  19.  
  20. ::-webkit-scrollbar {
  21. display: none;
  22. }
  23.  
  24. /****html****/
  25.  
  26. #code { height: 1500px;}
  27.  
  28.  
  29.  
  30. #container { background-color: #222;!important; z-index: 1px; width: 550px; height: 320px; left: 260px; top: 100px; border-radius: 6px; position: absolute; filter: grayscale(10%) brightness(100%); background-size: cover; border-bottom: 60px #360909 solid;}
  31.  
  32. #container2 { background-image: url(https://i.pinimg.com/736x/ef/a7/39/efa739bc60f7edb6e2e6b87f74623d39.jpg);!important; z-index: 1px; width: 300px; height: 160px; left: 260px; top: 100px; border-radius: 6px; position: absolute; filter: grayscale(100%) brightness(200%); background-size: cover; border-bottom: 0px #aaa solid;}
  33.  
  34. #container3 { background-color: #222;!important; z-index: 1px; width: 190px; height: 220px; left: 260px; top: 200px; border-radius: 10px 40px 0px 00px; position: absolute; filter: grayscale(10%) brightness(100%); background-size: cover; border-bottom: 0px #aaa solid;}
  35.  
  36. #container4 { background-color: #333;!important; z-index: 1px; width: 120px; height: 170px; left: 450px; top: 250px; border-radius: 0px 0px 0px 00px; position: absolute; filter: grayscale(10%) brightness(100%); background-size: cover; border-bottom: 0px #aaa solid;}
  37.  
  38.  
  39. #container5 { background-image: url(https://storage.ning.com/topology/rest/1.0/file/get/31134594096?profile=original);!important; z-index: 1px; width: 120px; height: 50px; left: 450px; top: 250px; border-radius: 0px 0px 0px 00px; position: absolute; filter: grayscale(10%) brightness(100%); background-size: cover; border-bottom: 0px #aaa solid;}
  40.  
  41.  
  42. #container6 { background-color: #222;;!important; z-index: 1px; width: 330px; height: 480px; left: 560px; top: 30px; border-radius: 6px; position: absolute; filter: grayscale(10%) brightness(100%); background-size: cover; border-top: 40px #360909 solid; overflow: hidden}
  43.  
  44. #container7 { background-color: #111;;!important; z-index: 1px; width: 370px; height: 400px; left: 540px; top: 120px; border-radius: 6px; position: absolute; filter: grayscale(10%) brightness(100%); background-size: cover; border-top: 0px #aaa solid;}
  45.  
  46. #website { background-image: url(https://storage.ning.com/topology/rest/1.0/file/get/13466076687?profile=original);;!important; z-index: 1px; width: 330px; height: 70px; left: 563px; top: 40px; border-radius: 6px; position: absolute; filter: contrast(10%) brightness(10%); background-size: cover; border-top: 0px #aaa solid;}
  47.  
  48.  
  49. #website2 { background-color: #111!important; z-index: 1px; width: 165px; height: 14px; left: 690px; 90px; top: 88px; border-radius: 0px; position: absolute; background-size: cover; filter: contrast(102%) grayscale(0%); letter-spacing: 1px; font-size:8px; text-align: left; padding-top: 0px; font-family: roboto; text-transform: lowercase; color: #aaa; }
  50.  
  51. #title { background-color: #trans!important; z-index: 1px; width: 205px; height: 35px; left: 250px; 90px; top: 200px; border-radius: 0px; position: absolute; background-size: cover; filter: contrast(97%) grayscale(0%); letter-spacing: 2px; font-size:60px; text-align: left; padding-top: 0px; font-family: shutter; text-transform: normal; color: #4F1111; line-height: 40px;}
  52.  
  53. #title2 { background-color: #trans!important; z-index: 1px; width: 155px; height: 35px; left: 275px; 90px; top: 290px; border-radius: 0px; position: absolute; background-size: cover; filter: contrast(97%) grayscale(0%); letter-spacing: 1px; font-size:6px; text-align: justify; padding-top: 0px; font-family: roboto; text-transform: uppercase; color: #fff; line-height: 13px; font-style: italic; }
  54.  
  55.  
  56. #title3 { background-color: #trans!important; z-index: 1px; width: 225px; height: 35px; left: 295px; 90px; top: 445px; border-radius: 0px; position: absolute; background-size: cover; filter: contrast(97%) grayscale(0%); letter-spacing: 2px; font-size:9px; text-align: justify; padding-top: 0px; font-family: robold; text-transform: uppercase; color: #fff; line-height: 12px; font-style: normal; font-weight: 100;}
  57.  
  58.  
  59. @font-face {
  60. font-family: shutter;
  61. src: url(HTTPS://DL.DROPBOXUSERCONTENT.COM/s/l52ysbcirhvz2c4/shutter.ttf);
  62. }
  63.  
  64.  
  65. #contain {
  66. position:absolute;
  67. width:365px;
  68. height:390px;
  69. margin-left:550px;
  70. margin-top:125px;
  71. background:transparent;
  72. overflow:auto;
  73. padding:0px;
  74. border-radius:6px;
  75. border-top:0px #222 solid;
  76. }
  77.  
  78.  
  79. /* CHARACTER CARDS */
  80.  
  81. .view {
  82. width:145px;
  83. height:160px;
  84. margin:12px;
  85. float:left;
  86. overflow:hidden;
  87. position:relative;
  88. text-align:center;
  89. border:3px #222 double;
  90. border-radius:6px;
  91. background:#111;
  92. filter:grayscale(.3) brightness(80%) contrast(100%);
  93. }
  94.  
  95.  
  96. .view img {
  97. width:160px!important;
  98. height:165px!important;
  99. object-fit:cover;
  100. display:block;
  101. position:absolute;
  102. top:-5px;
  103. left:-8px;
  104. }
  105.  
  106.  
  107. /* MAIN IMAGE */
  108.  
  109. .main-img {
  110. opacity:1;
  111. transition:all .6s ease;
  112. z-index:1;
  113. }
  114.  
  115.  
  116. /* HOVER IMAGE */
  117.  
  118. .hover-img {
  119. opacity:0;
  120. transition:all .6s ease;
  121. z-index:2;
  122. }
  123.  
  124.  
  125. /* HOVER TRANSITION */
  126.  
  127. .view:hover .main-img {
  128. opacity:0;
  129. }
  130.  
  131.  
  132. .view:hover .hover-img {
  133. opacity:1;
  134. }
  135.  
  136.  
  137. /* DARK OVERLAY */
  138.  
  139. .mask {
  140. position:absolute;
  141. top:0;
  142. left:0;
  143. width:145px;
  144. height:160px;
  145. background:rgba(0,0,0,.55);
  146. opacity:0;
  147. transition:all .5s ease;
  148. z-index:4;
  149. display:flex;
  150. flex-direction:column;
  151. justify-content:center;
  152. align-items:center;
  153. }
  154.  
  155.  
  156. .view:hover .mask {
  157. opacity:1;
  158. }
  159.  
  160.  
  161. /* NAME */
  162.  
  163. .info {
  164. color:#fff!important;
  165. font-family:buffalo;
  166. font-size:11px;
  167. text-transform:uppercase;
  168. letter-spacing:1px;
  169. margin-bottom:8px;
  170. }
  171.  
  172.  
  173. /* BIO */
  174.  
  175. .bio {
  176. color:#fff!important;
  177. font-family:'caviar dreams';
  178. font-size:10px!important;
  179. font-style:normal;
  180. text-align:center;
  181. text-transform:lowercase;
  182. letter-spacing:0px;
  183. line-height:12px;
  184. padding:0 10px;
  185. font-weight:1000;
  186. }
  187.  
  188.  
  189. @font-face {
  190. font-family:caviar dreams;
  191. src:url(https://static.tumblr.com/v6akjgz/RCIqf9hvq/caviardreams.ttf);
  192. }
  193.  
  194.  
  195. @font-face {
  196. font-family:buffalo;
  197. src:url(https://static.tumblr.com/v6akjgz/QAXringwi/buffaloinline2grunge.ttf);
  198. }
  199. #muses { background-color: #222; z-index: 1px; width: 75px; height: 18px; left: 456px; 90px; top: 297px; border-radius: 0px; position: absolute; border: 1px solid #360909; text-transform: lowercase; font-family: buffalo; padding-top: 6px; text-align: center; font-size: 10px; font-color: #360909; letter-spacing: 1px; }
  200.  
  201. #comment { background-color: #222; z-index: 1px; width: 75px; height: 18px; left: 456px; 90px; top: 327px; border-radius: 0px; position: absolute; border: 1px solid #360909; text-transform: lowercase; font-family: buffalo; padding-top: 6px; text-align: center; font-size: 10px; font-color: #360909; letter-spacing: 1px; }
  202.  
  203. #forum { background-color: #222; z-index: 1px; width: 75px; height: 18px; left: 456px; 90px; top: 358px; border-radius: 0px; position: absolute; border: 1px solid #360909; text-transform: lowercase; font-family:buffalo; padding-top: 6px; text-align: center; font-size: 10px; font-color: #360909; letter-spacing: 1px; }
  204.  
  205. #leave { background-color: #222; z-index: 1px; width: 75px; height: 18px; left: 456px; 90px; top: 388px; border-radius: 0px; position: absolute; border: 1px solid #360909; text-transform: lowercase; font-family:buffalo; padding-top: 6px; text-align: center; font-size: 10px; font-color: #360909; letter-spacing: 1px; }
  206.  
  207.  
  208. @font-face { font-family:'buffalo'; src: url(https://static.tumblr.com/v6akjgz/QAXringwi/buffaloinline2grunge.ttf); }
  209.  
  210. /****deleted codes****/
  211.  
  212. h1, h2, h3 {display:none} #xg_head, #xg_foot{display:none} #xg_layout_column_1 {display:none} .xg_module.xg_module_comment_wall {display:none} .xg_span-5 {display:none} ul.nobullets.last-child {display:none} .xg_chat.chatFooter {display:none} li.right {display:none} #xn_bar {display:none} #xn_bar_menu_tabs, #xn_bar_menu_more, p#xn_gyo_link, p#xn_brand{ display:none !important; }
  213.  
  214. /****fonts****/
  215.  
  216. @font-face { font-family: qwenzy; src: url(HTTPS://DL.DROPBOXUSERCONTENT.COM/s/5by6d7bk0k6fkoj/Qwenzy.ttf); }
  217.  
  218. @font-face { font-family: shrikhand; src:url('https://dl.dropboxusercontent.com/s/vd0h7y96gdck6yd/Shrikhand-Regular.ttf?dl=0');}
  219.  
  220. @font-face { font-family: 'poppins'; src: url('https://dl.dropboxusercontent.com/s/c7yh7zqu0j7bvb0/Poppins-Regular.otf'); ;}
  221.  
  222. @font-face{font-family:"cocogoose";src:url('https://static.tumblr.com/d5muzyw/ESoqs98ai/cocogoose_pro-trial.ttf');
  223.  
  224. @font-face { font-family: caviar dreams; src: url(https://static.tumblr.com/v6akjgz/RCIqf9hvq/caviardreams.ttf); }
  225.  
  226.  
  227. @font-face {font-family: smf; src: url(HTTPS://DL.DROPBOXUSERCONTENT.COM/s/6m4tzkspt7u7hfr/MADE%20Soulmaze%20Filled.ttF);}
  228.  
  229. @font-face {font-family: noteworthy; src: url(HTTPS://DL.DROPBOXUSERCONTENT.COM/s/d63hhsagwae41zk/Noteworthy%20Script.otf); }
  230.  
  231.  
  232. @font-face {font-family: soulmaze; src: url(HTTPS://DL.DROPBOXUSERCONTENT.COM/s/y2v3i4y79zzk3i3ojrzgb/MADE-Soulmaze-Outline-PERSONAL-USE.ttf);}
  233.  
  234.  
  235. @font-face {
  236. font-family: HelveticaNeueLight;
  237. src: url(HTTPS://DL.DROPBOXUSERCONTENT.COM/scl/fi/gdjbejlyhackhfqi044wg/HelveticaNeueLight.otf?rlkey=7d180rxzgvjgqic3oo3nr77lh&st=8thopr6g);
  238. }
  239.  
  240. @font-face {
  241. font-family: HelveticaNeueBold;
  242. src: url(HTTPS://DL.DROPBOXUSERCONTENT.COM/scl/fi/73ds2x5evmg8ybsn3a3zv/HelveticaNeueBold.otf?rlkey=49x5kt8kipoqexay7o1za68mr&st=ozj44hia);
  243. }
  244.  
  245.  
  246. @font-face {font-family: roboto; src: url(HTTPS://DL.DROPBOXUSERCONTENT.COM/s/i5x37kqbtb40s0b/Roboto-Light.ttf);}
  247.  
  248.  
  249. @font-face {font-family: robold; src: url(HTTPS://DL.DROPBOXUSERCONTENT.COM/s/qynix3bz0j8ppva/Roboto-BoldCondensed.ttf);}
Advertisement
Add Comment
Please, Sign In to add comment
Public Pastes
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
Not a member of Pastebin yet?
Sign Up, it unlocks many cool features!