Advertisement
althindor

Update for FilthiestCasual

Jan 28th, 2019
447
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
CSS 7.82 KB | None | 0 0
  1. /* Profile by AlthIndor */
  2.  
  3. html, body {background: linear-gradient(to top, #000000 28px, transparent 28px) fixed, url('https://images2.imgbox.com/51/e0/mGLoxCFC_o.png') #FFFFFF fixed center no-repeat;}
  4. body #gaia_header {z-index: 999 !important;}
  5. body a {text-decoration: none !important;}
  6.  
  7. .panel, .panel h2::after {background: url('https://images2.imgbox.com/69/5f/frExmS3E_o.png') border-box no-repeat;}
  8.  
  9. /* Fonts */
  10.  
  11. @font-face {
  12.  font-family: 'Montserrat';
  13.  font-style: normal;
  14.  font-weight: 400;
  15.  src: local('Montserrat Regular'), local('Montserrat-Regular'), url(https://fonts.gstatic.com/s/montserrat/v12/JTUSjIg1_i6t8kCHKm459Wlhyw.woff2) format('woff2'), url(https://fonts.gstatic.com/s/montserrat/v10/zhcz-_WihjSQC0oHJ9TCYBsxEYwM7FgeyaSgU71cLG0.woff) format('woff');
  16. }
  17.  
  18. @font-face {
  19.  font-family: 'Open Sans';
  20.  font-style: normal;
  21.  font-weight: 400;
  22.  src: local('Open Sans'), local('OpenSans'), url(https://fonts.gstatic.com/s/opensans/v15/mem8YaGs126MiZpBA-UFVZ0b.woff2) format('woff2'), url(https://fonts.gstatic.com/s/opensans/v13/cJZKeOuBrn4kERxqtaUH3T8E0i7KZn-EPnyo3HZu7kw.woff) format('woff');
  23. }
  24.  
  25. /* Header */
  26.  
  27. #viewer #gaia_header {
  28.  background: #000000;
  29.  height: 28px !important;
  30. }
  31.  
  32. #gaia_header #header_left, #gaia_header #header_right {
  33.  width: 50% !important;
  34.  font-size: 0 !important;
  35.  padding: 0 1px !important;
  36.  box-sizing: border-box;
  37. }
  38. #gaia_header #header_right {float: right !important;}
  39. #gaia_header .spacer {display: none !important;}
  40. #gaia_header li {margin: 0 5px;}
  41.  
  42. #header_left img {
  43.  background: url('https://gaia.hs.llnwd.net/e1/images/gaia_global/gaia_header/br_gaia_logo_header.png') 0 0 no-repeat;
  44.  background-size: 100% auto;
  45.  width: 0;
  46.  height: 18px;
  47.  padding: 0 38px 0 0;
  48.  margin: 0 -1px 0 0;
  49. }
  50.  
  51. #gaia_header a, #header_left li:last-of-type::after {
  52.  color: #FFFFFF !important;
  53.  font: normal 11px/28px 'Montserrat', sans-serif;
  54.  text-transform: uppercase;
  55. }
  56.  
  57. #header_left li:last-of-type::after {
  58.  content: 'Layout By AlthIndor';
  59.  margin-left: 11px;
  60.  opacity: .75;
  61. }
  62.  
  63. /* Columns */
  64.  
  65. #columns, #column_1 {
  66.  width: 100%;
  67.  height: 100%;
  68.  margin: 0;
  69.  position: absolute;
  70.  top: 0;
  71.  left: 0;
  72. }
  73. #column_2, #column_3 {display: none;}
  74.  
  75. #columns ::-webkit-scrollbar {
  76.  background: #404040;
  77.  width: 10px;
  78.  border-radius: 3px;
  79. }
  80.  
  81. #columns ::-webkit-scrollbar-thumb {
  82.  background: #808080;
  83.  border: 1px solid #404040;
  84.  border-radius: 3px;
  85. }
  86.  
  87. /* Panels */
  88.  
  89. .panel, .panel h2 {
  90.  color: #FFFFFF;
  91.  text-align: center;
  92.  padding: 0;
  93.  margin: 0;
  94.  box-sizing: border-box;
  95. }
  96.  
  97. .panel {
  98.  font: 11px/1.6em 'Open Sans', sans-serif;
  99.  position: absolute;
  100.  overflow: hidden;
  101. }
  102. .panel a {color: #FFFFFF;}
  103.  
  104. #id_about, #id_comments, #id_wishlist, #id_footprints, #id_friends {
  105.  width: 540px;
  106.  height: 540px;
  107.  bottom: -540px;
  108.  left: calc(50% - 270px);
  109.  border: 12px solid transparent;
  110.  z-index: 2;
  111. }
  112. .panel:not(#id_details):not(.media_panel):hover {bottom: 37px;}
  113.  
  114. #id_about, #id_wishlist, #id_footprints, #id_friends, #id_comments dl {
  115.  padding-right: 10px;
  116.  overflow-x: hidden;
  117.  overflow-y: scroll;
  118. }
  119. #id_about img, #id_comments .postcontent img {max-width: 100%;}
  120. .bbcode-swapping-image {background: url('https://i.imgur.com/Fk5mUXF.png');}
  121.  
  122. .panel:not(.media_panel) h2 {
  123.  background: #000;
  124.  width: 100px;
  125.  height: 28px;
  126.  font: normal 11px/28px 'Montserrat', sans-serif;
  127.  position: fixed;
  128.  bottom: 0;
  129.  z-index: 99;
  130. }
  131.  
  132. .panel:not(.media_panel) h2::after {
  133.  content: '';
  134.  background-position: 25px bottom;
  135.  display: block;
  136.  width: 100%;
  137.  height: 0;
  138.  position: absolute;
  139.  top: -15px;
  140.  left: 0;
  141. }
  142. .panel:hover h2::after {height: 25px;}
  143.  
  144. #id_about h2 {left: calc((100% - 540px) / 2);}
  145. #id_comments h2 {left: calc((100% - 540px) / 2 + 110px);}
  146. #id_wishlist h2 {left: calc((100% - 540px) / 2 + 220px);}
  147. #id_footprints h2 {left: calc((100% - 540px) / 2 + 330px);}
  148. #id_friends h2 {left: calc((100% - 540px) / 2 + 440px);}
  149.  
  150. /* Details */
  151.  
  152. #id_details {
  153.  background: none;
  154.  width: 120px;
  155.  height: 150px;
  156.  top: calc(50% - 190px);
  157.  left: calc(50% - 190px);
  158.  z-index: 1;
  159. }
  160. #id_details h2 {display: none;}
  161. #id_details p:nth-of-type(n+2) {display: none;}
  162. #id_details .forum_userstatus {display: none;}
  163.  
  164. /* Comments */
  165.  
  166. #id_comments #alerts_banner {display: none;}
  167. #id_comments .deletecomment {margin: 0 0 0 7px;}
  168. #id_comments .date {font: 9px/2em monospace;}
  169. #id_comments .date a {font-weight: normal;}
  170.  
  171. #id_comments dl {
  172.  width: 100%;
  173.  height: calc(100% - 45px);
  174.  text-align: justify;
  175.  position: absolute;
  176.  bottom: 0;
  177.  left: 0;
  178.  box-sizing: border-box;
  179. }
  180.  
  181. #id_comments dt {
  182.  line-height: normal;
  183.  padding: 0;
  184.  margin-bottom: 3px;
  185.  border-color: #808080;
  186. }
  187.  
  188. #id_comments dd {margin: 0 0 10px 0;}
  189. #id_comments dd:last-of-type {margin: 0;}
  190.  
  191. #id_comments .dropBox {
  192.  background: #404040;
  193.  width: 48px;
  194.  height: 60px;
  195.  margin: 4px 7px 0px 0px;
  196.  border: 1px solid #808080;
  197.  overflow: hidden;
  198. }
  199. #id_comments dd:hover .dropBox {background: #FFFFFF;}
  200.  
  201. #id_comments .dropBox img {
  202.  width: 120px;
  203.  height: 150px;
  204.  margin-top: -26px;
  205.  margin-left: -46px;
  206. }
  207.  
  208. /* Comments Links */
  209.  
  210. #id_comments h2 + div, #id_comments div ~ p {
  211.  background: #FFFFFF;
  212.  float: left;
  213.  width: calc(50% - 5px);
  214.  height: 34px;
  215.  margin: 0;
  216.  position: relative;
  217.  box-shadow: 0 0 0 2px #FFFFFF inset, 0 0 0 4px #000000 inset;
  218. }
  219. #id_comments h2 + div {margin-right: 10px;}
  220.  
  221. #id_comments #alert_container, #id_comments #alert_container a, #id_comments p a[href*='comments'] {
  222.  display: block;
  223.  width: 100%;
  224.  height: 100%;
  225.  padding: 0;
  226. }
  227.  
  228. #id_comments #alert_container a, #id_comments p a[href*='comments'] {
  229.  color: #000000;
  230.  font: normal 11px/34px 'Montserrat', sans-serif;
  231.  text-transform: uppercase;
  232. }
  233.  
  234. /* Wish List */
  235.  
  236. #id_wishlist {
  237.  display: grid;
  238.  grid-template-columns: repeat(10, 1fr);
  239.  grid-auto-rows: min-content;
  240.  grid-gap: 10px 10px;
  241. }
  242.  
  243. #id_wishlist .item {
  244.  background: #404040;
  245.  width: 100%;
  246.  height: 40px;
  247.  padding: 5px;
  248.  position: relative;
  249.  border-radius: 3px;
  250.  box-sizing: border-box;
  251. }
  252. #id_wishlist .item:hover {background: #FFFFFF;}
  253.  
  254. .premium_sparkle, .owner_checkmark {
  255.  margin: 0;
  256.  top: calc(50% - 15px);
  257.  left: calc(50% - 15px);
  258. }
  259.  
  260. #equipped-list, #equipped-list ~ #equipped-item-details, #equipped-item-details_mask {display: none !important;}
  261. #equipped-list_c, #equipped-item-details_c {z-index: 9 !important;}
  262.  
  263. /* Visitors */
  264.  
  265. #id_footprints .item {padding: 3px;}
  266. #id_footprints .item:nth-of-type(even) {background: #404040;}
  267.  
  268. /* Friends */
  269.  
  270. #find_friends_banner {display: none;}
  271. #id_friends h2 ~ p {display: none;}
  272.  
  273. #id_friends ul:not(.buttons) {
  274.  display: grid;
  275.  grid-template-columns: repeat(5,1fr);
  276.  grid-gap: 10px 10px;
  277. }
  278.  
  279. #id_friends ul:not(.buttons) li {
  280.  background: #404040;
  281.  width: 100%;
  282.  padding-top: 2px;
  283.  border-radius: 3px;
  284. }
  285. #id_friends ul:not(.buttons) li p {margin-bottom: 5px;}
  286.  
  287. #id_friends ul:not(.buttons) li img {
  288.  background: #404040;
  289.  border: 1px solid #808080;
  290. }
  291. #id_friends ul:not(.buttons) li:hover img {background: #FFFFFF;}
  292.  
  293. /* Media */
  294.  
  295. .media_panel {
  296.  background: url('https://i.imgur.com/vcNz49l.png') rgba(0,0,0,.6);
  297.  background-size: 32px auto;
  298.  background-position: center -96px;
  299.  width: 34px;
  300.  height: 34px !important;
  301.  top: 35px;
  302.  left: 7px;
  303.  border: 1px solid #FFFFFF;
  304.  border-radius: 3px;
  305.  box-shadow: 0 0 0 1px #000;
  306. }
  307. .media_panel:hover {background-color: #000;}
  308.  
  309. .media_panel h2 {
  310.  background: #000000;
  311.  width: auto;
  312.  height: auto;
  313.  color: #FFFFFF;
  314.  font: bold 10px 'Open Sans', sans-serif;
  315.  padding: 3px 5px;
  316.  position: fixed;
  317.  top: 62px;
  318.  left: 34px;
  319.  border: 1px solid #808080;
  320.  box-shadow: 0 0 0 1px #000000;
  321.  opacity: 0;
  322.  pointer-events: none;
  323. }
  324. .media_panel:hover h2 {opacity: 1;}
  325.  
  326. .media_panel .buttons {
  327.  position: fixed;
  328.  top: 40px;
  329.  left: 45px;
  330. }
  331.  
  332. .media_panel object {
  333.  position: absolute;
  334.  bottom: -1px;
  335.  left: -9px;
  336.  opacity: .01;
  337. }
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement