API tools faq
paste
Advertisement
Turgen

GUICSS

Turgen
Feb 20th, 2025 (edited)
207
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
CSS 18.60 KB | None | 0 0
raw download clone embed print report
  1. //SSM2CSS
  2. $yellow: #FFE800;
  3. $brown: #404040;
  4. $blue: #1CD3F8;
  5. $angle: 8px;
  6. $angle-o: 4px;
  7.  
  8.  
  9. .box
  10. {
  11.     text-align:center;
  12.     padding:0px;
  13.     box-shadow:none;
  14. }
  15.  
  16. .thing,.box-header,.box-footer,.box-bit
  17. {
  18.     background:#39f;
  19.     box-shadow:0px 0px 4px rgba(0,0,0,0.2),1px 1px 2px rgba(0,0,0,0.5),0px 0px 4px rgba(255,255,255,0.5) inset;
  20. }
  21. .box-bit{border-radius:0px;}
  22.  
  23. .box-header
  24. {
  25.     border-bottom-left-radius:20px;
  26.     border-bottom-right-radius:20px;
  27.     margin-bottom:0px;
  28.     text-align: center;
  29. }
  30. .box-footer
  31. {
  32.     border-top-left-radius:20px;
  33.     border-top-right-radius:20px;
  34.     margin-top:1px;
  35. }
  36.  
  37.  
  38. #game{
  39. background-image: hidden !important;
  40. z-index: 3 !important;
  41. }
  42.  
  43. .thing .shiny .noClick .noText{
  44.  
  45. z-index: -1 !important;
  46.  
  47. }
  48.  
  49. .thing .shiny .bigButton .noText{
  50.  
  51. z-index: 4 !important;
  52.  
  53. }
  54.  
  55.  
  56.  
  57. .shiny-icon{
  58.  
  59.  
  60. //opacity: 0.2;
  61. //transform: rotate(90deg) !important;
  62.  
  63. }
  64.  
  65. #box-main
  66. {
  67.     left:0px;
  68.     top:0px;
  69.     bottom:0px;
  70.     overflow:hidden;
  71.     width:30%;
  72.     position:absolute;
  73. }
  74. #box-res.fullWidth
  75. {
  76.     width:100%;
  77.     top:40%;
  78.     height:5%;
  79.     min-height:32px;
  80.     z-index:100;
  81.     position:absolute;
  82. }
  83. #box-buttons
  84. {
  85.     top:0px;
  86.     right:0px;
  87.     bottom:0px;
  88.     left:0px;
  89.     position:absolute;
  90. }
  91. #box-store
  92. {
  93.     left: 30%;
  94.     height: 90%;
  95.     width: 60%;
  96.    
  97.     position:absolute;
  98.     margin: 5% !important;
  99. }
  100.  
  101. #box-buildings,#box-upgrades,#box-buildings2,#box-upgrades2
  102. {
  103.    
  104.    
  105.     width:50%;
  106.     //right:0px;
  107.     overflow-x:hidden;
  108.     overflow-y:scroll;
  109.     padding-bottom:48px;/* this is to accommodate the info and settings buttons */
  110.     position:absolute;
  111. }
  112. #box-buildings
  113. {right:50%;}
  114.  
  115. #box-upgrades
  116. {right:50%;
  117.  
  118. }
  119.  
  120. #box-buildings2
  121. {
  122. right:0%;
  123.  
  124. }
  125.  
  126. #box-upgrades2
  127. {right:0%;}
  128.  
  129. //#box-buildings{background:linear-gradient(to right,rgba(0,0,0,0) 0%,rgba(0,0,0,0.25) 20%);}
  130. //#box-upgrades{background:rgba(0,0,0,0.3);}
  131. //#box-buildings2{background:linear-gradient(to right,rgba(0,0,0,0) 0%,rgba(0,0,0,0.25) 20%);}
  132. //#box-upgrades2{background:rgba(0,0,0,0.3);}
  133.  
  134. #bulkDisplay{margin:-11px 24px 4px 24px;}
  135.  
  136.  
  137. .thing
  138. {
  139.     display:inline-block;
  140.     padding:auto;
  141.     margin:auto;
  142.     margin-bottom:1px;
  143.     cursor:pointer;
  144. }
  145. .thing:hover,.thing.lit
  146. {
  147.     background:#6cf;
  148. }
  149. .thing.cantAfford
  150. {
  151.     opacity:0.65;
  152. }
  153. .upgrade.cantAfford
  154. {
  155.     box-shadow:0px 0px 4px #39f;
  156.     border-radius:8px;
  157. }
  158. .upgrade.cantAfford:hover
  159. {
  160.     box-shadow:0px 0px 4px #6cf;
  161. }
  162. .upgrade.owned,.achiev.owned
  163. {
  164.     background:#6cf;
  165. }
  166. .thing-text,.thing-costs{font-weight:bold;}
  167.  
  168.  
  169.  
  170. .building
  171. {
  172.     padding-left: 10% !important;
  173.     border-top-left-radius:20px;
  174.     border-bottom-left-radius:20px;
  175.     display:block;
  176.     padding-right: auto;
  177.     margin-right:auto;
  178.     font-size:14px;
  179. }
  180.  
  181. .fullWidth
  182. {
  183.     display:block;
  184.     margin-left:0px;
  185.     margin-right:0px;
  186.     z-index:10;
  187. }
  188. #game .fullWidth
  189. {
  190.     height:auto;
  191.     min-height:auto;
  192. }
  193. .fullWidth,.fullWidth:hover
  194. {
  195.     /*background:rgba(0,0,0,0.5);
  196.     background:linear-gradient(to bottom,rgba(0,0,0,0.5) 0%,rgba(0,0,0,0.25) 50%,rgba(0,0,0,0.5) 100%);*/
  197.     background:linear-gradient(to right,rgba(0,0,0,0) 0%,rgba(0,0,0,0.25) 50%,rgba(0,0,0,0) 100%);
  198.     box-shadow:none;
  199. }
  200. .fullWidth:before,.fullWidth:after
  201. {
  202.     content:'';
  203.     height:1px;
  204.     background:linear-gradient(to right,rgba(255,255,255,0) 0%,rgba(255,255,255,0.25) 50%,rgba(255,255,255,0) 100%);
  205.     position:absolute;
  206.     left:0px;
  207.     right:0px;
  208.     z-index:-1;
  209. }
  210. .fullWidth:before{top:-1px;}
  211. .fullWidth:after{bottom:-1px;}
  212.  
  213. .fullWidth .thing-icon
  214. {
  215.     margin-top:-14px;
  216.     margin-bottom:-14px;
  217. }
  218. .fullWidth .thing-text
  219. {
  220.     margin-top:-4px;
  221.     margin-bottom:-4px;
  222. }
  223.  
  224. #game.filtersOn .thing-icon{filter:drop-shadow(0px 0px 0px rgba(0,0,0,0));}
  225.  
  226.  
  227. //---------------------------------------------------------------------------------------------------------
  228.  
  229.  
  230.  
  231.  
  232.  
  233. #game
  234.   {
  235.     background:#002130;
  236.     background-size: cover;
  237.     font-family: DejaVu Sans Mono, monospace !important;
  238.     letter-spacing: 0px;
  239.     //font-size: 12px;
  240.     font-stretch: ultra-expanded;
  241.    
  242.    // font-family:Century Gothic,sans-serif;
  243.     //font-weight:100;
  244.     color:#93f8ff;
  245.   }
  246. .upgrade, .building
  247.   {
  248.  
  249. background-repeat: no-repeat;
  250.     font-weight:100 !important;
  251.     margin-top:0px;
  252.     padding: 6% 6%;
  253.     text-align: left;
  254.     //height: 48px;
  255.     border-radius:0px;
  256.     //background:#002130;
  257.     border: 0px solid #002130;
  258.     background:rgba(255,255,255,0.5);
  259.    
  260.     width: 100%;
  261.  
  262.   transition: all .15s linear 0s;
  263.   position: relative;
  264.   display: inline-block;
  265.  
  266.   background-color: $yellow;
  267.   color: $brown;
  268.  
  269.  
  270.  
  271.   box-shadow: -6px 6px 0 $brown;
  272.   text-decoration: none;
  273.  
  274.   &:hover {
  275.     top: 3px;
  276.     left: -3px;
  277.     box-shadow: -3px 3px 0 $brown;
  278.    
  279.     &::after {
  280.       top: 1px;
  281.       left: -2px;
  282.       width: $angle-o;
  283.       height: $angle-o;
  284.     }
  285.    
  286.     &::before {
  287.       bottom: -2px;
  288.       right: 1px;
  289.       width: $angle-o;
  290.       height: $angle-o;
  291.     }
  292.   }
  293.  
  294.   &::after {
  295.     transition: all .15s linear 0s;
  296.     content: '';
  297.     position: absolute;
  298.     top: 2px;
  299.     left: -4px;
  300.     width: $angle;
  301.     height: $angle;
  302.     background-color: $brown;
  303.     transform: rotate(45deg);
  304.     z-index: -1;
  305.    
  306.   }
  307.  
  308.   &::before {
  309.     transition: all .15s linear 0s;
  310.     content: '';
  311.     position: absolute;
  312.     bottom: -4px;
  313.     right: 2px;
  314.     width: $angle;
  315.     height: $angle;
  316.     background-color: $brown;
  317.     transform: rotate(45deg);
  318.     z-index: -1;
  319.   }
  320. }
  321.  
  322. .thing-text
  323. {
  324.  
  325.  
  326.  
  327. }
  328. .thing-icon
  329. {
  330.    
  331.  }
  332.  
  333.  
  334. #thing-0
  335.   {
  336.    
  337.     background-repeat: no-repeat;
  338.     //max-width: 250px;
  339.     //max-height: 250px;
  340.     padding: 0px 50px;
  341.     border-radius:50%;
  342.     float: left;
  343.     padding-left: 21%;
  344.     background:rgba(0,55,79,0.00);
  345.      
  346.    
  347.  
  348. /*-webkit-animation-name: spin;
  349.     -webkit-animation-duration: 4000ms;
  350.     -webkit-animation-iteration-count: infinite;
  351.     -webkit-animation-timing-function: linear;
  352.     -moz-animation-name: spin;
  353.     -moz-animation-duration: 4000ms;
  354.     -moz-animation-iteration-count: infinite;
  355.     -moz-animation-timing-function: linear;
  356.     -ms-animation-name: spin;
  357.     -ms-animation-duration: 4000ms;
  358.     -ms-animation-iteration-count: infinite;
  359.     -ms-animation-timing-function: linear;
  360.    
  361.     animation-name: spin;
  362.     animation-duration: 910000ms;
  363.     animation-iteration-count: infinite;
  364.     animation-timing-function: linear;*/
  365. }
  366. @-ms-keyframes spin {
  367.     from { -ms-transform: rotate(0deg); }
  368.     to { -ms-transform: rotate(360deg); }
  369. }
  370. @-moz-keyframes spin {
  371.     from { -moz-transform: rotate(0deg); }
  372.     to { -moz-transform: rotate(360deg); }
  373. }
  374. @-webkit-keyframes spin {
  375.     from { -webkit-transform: rotate(0deg); }
  376.     to { -webkit-transform: rotate(360deg); }
  377. }
  378. @keyframes spin {
  379.     from {
  380.         transform:rotate(0deg);
  381.     }
  382.     to {
  383.         transform:rotate(360deg);
  384.     }
  385. }
  386.  
  387.  
  388.  
  389. #thing-0:hover
  390.   {
  391.    
  392.     padding: 50px 50px;
  393.     border-radius:50%;
  394.     float: left;
  395.     padding-left: 21%;
  396.     color:#93f8ff;
  397.     background:rgba(0,55,79,0.00);
  398.     //background-image: linear-gradient(to right, #00000000 , #4286f466 , #93f8ff99);
  399.    
  400.   }
  401.  
  402. .thing-text{
  403.  
  404. font-weight:100;
  405.  
  406. }
  407.  
  408. #thing-1
  409.   {
  410.     padding: 40px 40px;
  411.     float: left;
  412.     padding-left: 14%;
  413.     width: 90%;
  414.    
  415.   }
  416.  
  417. #thing-2
  418.   {
  419.     padding: 40px 40px;
  420.     padding-left: 14%;
  421.     padding-top: 10px !important;
  422.     float: left;
  423.     width: 90%;
  424.    
  425.   }
  426. #thing-3
  427.   {
  428.     padding: 40px 40px;
  429.     padding-left: 14%;
  430.     padding-top: 10px !important;
  431.     float: left;
  432.     width: 90%;
  433.    
  434.   }
  435. #thing-4
  436.   {
  437.     padding: 40px 40px;
  438.     padding-left: 14%;
  439.     padding-top: 10px !important;
  440.     float: left;
  441.     width: 90%;
  442.    
  443.   }
  444.  
  445.  
  446. .building:hover {
  447.  top: 0px !important;
  448. right: 0px !important;
  449. left: 0px !important;
  450.     //transform: skew(30deg);
  451.    
  452. }
  453.  
  454. .thing:hover
  455.   {
  456.     border: 0px solid #93f8ff;
  457.     //background:#002130;
  458.     color:#93f8ff;
  459.     background:rgba(0,55,79,0.50);
  460.    
  461.    
  462.   }
  463. .thing:active
  464.   {
  465.    
  466.     border: 0px solid #FFFFFF;
  467.     background:#002130;
  468.     color:#002130;
  469.     transform: translateY(2px);
  470.     background:rgba(255,255,255,0.5);
  471.    
  472.   }
  473.  
  474. .upgrade.owned, .achiev.owned {
  475.     //width: 100%;
  476.     //padding: 6% 6%;
  477.     text-align: left;
  478.     //height: 48px;
  479.     border-radius:0px;
  480.     //background:#002130;
  481.     border: 0px solid #002130;
  482.     background:rgba(255,255,255,0.5);
  483.    
  484. }
  485. .upgrade:hover{
  486. top: 0px !important;
  487. right: 0px !important;
  488. left: 0px !important;
  489.     //width: 100%;
  490.     float: left;
  491.     border: 0px solid #93f8ff;
  492.     //background:#002130;
  493.     color:#93f8ff;
  494.     text-align: left;
  495.     background:rgba(0,55,79,0.70);
  496.     box-shadow: 0px 0px 0px #39f;
  497. }
  498. .upgrade.owned:hover{
  499.     //width: 100%;
  500.     float: left;
  501.     padding: 6% 6%;
  502.     text-align: left;
  503.     //height: 48px;
  504.     border-radius:0px;
  505.     //background:#002130;
  506.     border: 0px solid #002130;
  507.     background:rgba(255,255,255,0.5);
  508.    
  509. }
  510. .upgrade.cantAfford {
  511.     //width: 100%;
  512.     float: left;
  513.     padding: 6% 6%;
  514.     text-align: left;
  515.     //height: 48px;
  516.     border-radius:0px;
  517.     //background:#002130;
  518.     border: 0px solid #002130;
  519.     background:rgba(255,255,255,0.5);
  520.    
  521.     box-shadow: 0px 0px 0px #39f;
  522. }
  523. .upgrade {
  524.     width: 100%;
  525.     float: left;
  526.     padding: 6% 6%;
  527.     padding-left: 10% !important;
  528.     text-align: left;
  529.     //height: 48px;
  530.     border-radius:0px;
  531.     //background:#002130;
  532.     border: 0px solid #002130;
  533.     background:rgba(255,255,255,0.5);
  534.    
  535.     box-shadow: 0px 0px 0px #39f;
  536.     font-family: DejaVu Sans Mono, monospace !important;
  537.     font-size: 14px;
  538. }
  539. .upgrade.notOwned {
  540.     width: 101% !important;
  541.     float: left;
  542.     margin-left: auto;
  543.     margin-right: auto;
  544.     padding: 6% 6%;
  545.     text-align: left;
  546.     //height: 48px;
  547.     border-radius:0px;
  548.     //background:#002130;
  549.     border: 0px solid #002130;
  550.     background:rgba(255,255,255,0.5);
  551.    
  552.     box-shadow: 0px 0px 0px #39f;
  553. }
  554.  
  555. .upgrade.notOwned:hover{
  556.    
  557.     //float: left;
  558.     border: 0px solid #93f8ff;
  559.     //background:#002130;
  560.     color:#93f8ff;
  561.     text-align: left;
  562.     background:rgba(0,55,79,0.70);
  563.    
  564.     box-shadow: 0px 0px 0px #39f;
  565. }
  566.  
  567.  
  568. .thing,.box-header,.box-footer,.box-bit
  569. {
  570.    
  571.     border: 0px solid #000000;
  572.     //font-family:"Courier",Courier,monospace;
  573.     //font-weight:300;
  574.     color:#93f8ff;
  575.     background:#002130;
  576.     background:rgba(255,255,255,0.5);
  577.     box-shadow:0px 0px 0px rgba(0,0,0,0),0px 0px 0px rgba(0,0,0,0),0px 0px 0px rgba(0,55,79,0) inset;
  578.    
  579. }
  580.  
  581. .glow {
  582.     animation: glow 0.0s;
  583. }
  584.  
  585.  
  586.  
  587. .box-header {
  588.    
  589.     margin-bottom:1%;
  590.     padding: 15px 15px;
  591.     height: 40px;
  592.     border: 0px solid #000000;
  593.     border-radius: 0px;
  594.     //font-family: "Courier",Courier,monospace;
  595.     font-size: 18px;
  596.     color: #93f8ff;
  597.     background: #002130;
  598.     background: rgba(255,255,255,0.5);
  599.     box-shadow: 0px 0px 0px rgba(0,0,0,0), 0px 0px 0px rgba(0,0,0,0), 0px 0px 0px rgba(0,55,79,0) inset;
  600.    
  601.     text-align: center;
  602. }
  603.  
  604.  
  605. #bulkDisplay {
  606.     position: relative;
  607.     top: 0px;
  608.     margin: 0px 0px 0px 0px;
  609.     margin-bottom: 0px;
  610. }
  611.  
  612. #box-things-Buildings {
  613. position: relative;
  614.    
  615.  
  616. }
  617.  
  618. .box-bit{
  619. padding: 0% 0%;
  620. margin-bottom:0px;
  621. position: relative;
  622. top: 0px;
  623. border-radius: 0px;
  624. background: #00213000;
  625. }
  626.  
  627. //#game.filtersOn .thing-icon{filter:drop-shadow(3px 3px 1px rgba(0,0,0,0.5));}
  628. #game.filtersOn .thing-icon{filter:drop-shadow(0px 0px 0px rgba(0,0,0,0));}
  629.  
  630. .popup, #tooltip, .toast {
  631.     background: #000000;
  632.    
  633.     //text-shadow: 1px 1px 0px rgba(0,0,0,0.5);
  634.     color: #93f8ff;
  635.     //border: 0px solid #93f8ff;
  636.     //background: url(lib/img/darkNoise.jpg);
  637.     border-radius: 0px;
  638.     /*box-shadow: 0px 0px 0px 1px #000, 0px 0px 0px 2px rgba(255,255,255,0.5), 0px 0px 15px 1px rgba(255,255,255,0.15) inset, 4px 4px 2px rgba(0,0,0,0.25), 4px 4px 20px rgba(0,0,0,0.5);*/
  639.     box-sizing: border-box;
  640.     padding: 8px 8px;
  641.  
  642. }
  643.  
  644.  
  645. #tooltipContent{
  646. color: #93f8ff;
  647. font-weight: 100;
  648.  
  649. }
  650.  
  651. ::-webkit-scrollbar-thumb {
  652.     background: #93f8ff33;
  653.     //background: #1f546a;
  654.  
  655.     //background-image: linear-gradient(to left, #00000000 , #93f8ff55);
  656.     box-shadow: 0px 0px 0px 0px #333 inset, 0px 0px 0px 0px #999 inset, 0px 0px 0px 0px #fff inset;
  657. }
  658.  
  659. ::-webkit-scrollbar-track {
  660.     background: #4286f400;
  661.     box-shadow: 0px 0px 0px 0px #00000000 inset, 0px 0px 0px 0px #444 inset, 0px 0px 0px 0px #222 inset;
  662.     width: 20px !important;
  663. }
  664. ::-webkit-scrollbar-thumb {
  665.     background: #93f8ff33;
  666.     //background: #1f546a;
  667.    
  668.     //background-image: linear-gradient(to left, #00000000, #93f8ff55);
  669.     box-shadow: 0px 0px 0px 0px #000 inset, 0px 0px 0px 0px #999 inset, 0px 0px 0px 0px #fff inset;
  670. }
  671. ::-webkit-scrollbar-thumb:hover {
  672.     background: #93f8ff99;
  673.     //background: #5cb2c5;
  674.  
  675.     box-shadow: 0px 0px 0px 0px #000 inset, 0px 0px 0px 0px #999 inset, 0px 0px 0px 0px #fff inset;
  676. }
  677. .achiev, .achiev:hover{
  678.     padding:5px 5px;
  679.     background-image: linear-gradient(to right, #00000000 , #4286f400 , #93f8ff00);
  680. }
  681. title {
  682.     display: none;
  683. }
  684.  
  685. .my-anim {
  686.     animation-name: my-anim;
  687.     animation-duration: 0s;
  688. }
  689.  
  690. .thing.bigButton, .thing-icon {
  691. top: 21%;
  692. left: 51%;
  693. background-repeat: no-repeat;
  694.     opacity: 1;
  695.     transform: scale(1);
  696.     transition: transform 0.00s ease-out;
  697.    
  698. }
  699. #thing-icon-0{
  700. z-index: -2 !important;
  701.  
  702. }
  703. .thing.bigButton:hover, .thing-icon:hover {
  704. background-repeat: no-repeat;
  705.     transform: scale(1);
  706.     transition: transform 0.00s ease-out;
  707.     transition: transform 0.00s ease-in;
  708.    
  709.    
  710. }
  711.  
  712. #game.filtersOn .shadowed {
  713.     filter: drop-shadow(0px 0px 0px rgba(0,0,0,0.0));
  714. }
  715.  
  716. .wobble {
  717.     animation: wobble 1s;
  718.     transform: scale(1);
  719.     animation-duration: 5s;
  720.     transition: transform 5.00s ease-out;
  721.     transition: transform 0.00s ease-in;
  722. }
  723.  
  724. @keyframes wobble {
  725. 0% {
  726.     opacity: 0.7;
  727.     transform: scale(1.3);
  728. }
  729. 10% {
  730.     opacity: 1;
  731.     transform: scale(1.3);
  732. }
  733. 100%
  734.     opacity: 1;
  735.     transform: scale(1);
  736. }
  737. }
  738.  
  739. .thing.bigButton .thing-icon{transform:scale(1);}
  740. .thing.bigButton:hover .thing-icon{transform:scale(1);}
  741. .thing.bigButton:active .thing-icon{transform:scale(1);}
  742.  
  743. div {
  744.     display: visible !important;
  745. }
  746.  
  747. #bulkDisplay {
  748.     position: relative;
  749.     top: 0px;
  750.     margin: 0px 0px 0px 0px;
  751.     margin-top: 5px;
  752.     margin-right: 0px;
  753.     margin-bottom: 0px;
  754.     margin-left: 0px;
  755.     margin-bottom: 0px;
  756.     visibility: visible !important;
  757.    
  758.     text-align: right;
  759. }
  760.  
  761.  
  762. .box-bit-content{
  763.  
  764. display: inline !important;
  765. }
  766.  
  767. div#bulkDisplay.box-bit {
  768. float: right;
  769. margin-right: auto;
  770. margin-left: auto;
  771.  
  772. }
  773.  
  774. .popup {
  775.     position: relative;
  776.     left: 50%;
  777.     top: 50%;
  778.     width: 30%;
  779.     pointer-events: auto;
  780.     transition: opacity 0.15s,left 0.15s,top 0.15s;
  781.     opacity: 0;
  782. }
  783. .box{
  784. margin: 0px !important;
  785. padding: 0px !important;
  786. }
  787.  
  788. #fpsGraph {
  789.     background: #333;
  790.     color: #93f8ff33;
  791.     position: absolute;
  792.     left: 0px;
  793.     bottom: 0px;
  794.     padding: 3px;
  795.     width: 128px;
  796.     height: 64px;
  797.     z-index: 10000000;
  798.     opacity: 0.5;
  799.     pointer-events: none;
  800. }
  801.  
  802.  
  803.  
  804. #box-upgrades::-webkit-scrollbar, #box-buildings::-webkit-scrollbar, #box-upgrades2::-webkit-scrollbar, #box-buildings2::-webkit-scrollbar {
  805.     width: 8px !important;
  806. }
  807.  
  808.  #box-buildings, #box-buildings2{
  809.     top: 5% !important;
  810.     overflow-y: auto !important;
  811. height: 45%:
  812. width: 100%;
  813. bottom: 50% !important;
  814. padding-top: 1vh !important;
  815.  
  816. }
  817.  
  818. #box-upgrades, #box-upgrades2{
  819. top: 55% !important;
  820. overflow-y: auto !important;
  821.  
  822. width: 40%;
  823. bottom: 5% !important;
  824.  
  825.  
  826. }
  827.  
  828. #box-upgrades{
  829. width: 50%;
  830. }
  831.  
  832.  
  833.  
  834. .outFrame #game {
  835.     right: 0% !important;
  836.     bottom: 0px;
  837. }
  838. div#bulkDisplay.box-bit
  839. {
  840.  
  841. }
  842.  
  843.  
  844. #box-buildings2Header{
  845. position:absolute;
  846. right:0%;
  847. top: 0%;
  848.  
  849. }
  850. #box-upgrades2Header{
  851. position:absolute;
  852. top: 50%;
  853. right:0%;
  854.  
  855.  
  856. }
  857. #box-upgradesHeader{
  858. position:absolute;
  859. top: 50%;
  860. right:50%;
  861.  
  862.  
  863. }
  864. #box-buildingsHeader{
  865. position:absolute;
  866. right:50%;
  867. top: 0%;
  868.  
  869.  
  870. }
  871.  
  872. #box-buildings2Header, #box-upgrades2Header, #box-upgradesHeader, #box-buildingsHeader{
  873. height: 2% !important;
  874. width: 50%;
  875. }
  876.  
  877. #toasts {
  878. position: absolute !important;
  879. right: 72% !important;
  880.  
  881. }
  882. #fpsCounter, #fpsGraph{
  883. position: absolute !important;
  884. bottom: 0px !important;
  885. left: 0px !important;
  886. width: 128px !important;
  887. height: 64px !important;
  888. }
  889.  
  890. #thing-8{
  891. position: absolute !important;
  892. top: -39vh;
  893. font-size: 2.8vh;
  894. left: 0.2vw;
  895. color: #ffffff44;
  896. background-color: #00000000;
  897.  
  898. }
  899.  
  900. #thing-text-8{
  901. font-weight: 900 !important;
  902. }
  903.  
  904. #thing-9{
  905. position: absolute !important;
  906. top: -37vh;
  907. font-size: 1.8vh;
  908. left: 0.2vw;
  909. color: #93f8ff44;
  910. background-color: #00000000;
  911.  
  912.  
  913. }
  914.  
  915. #log::-webkit-scrollbar {
  916.   display: none;
  917. }
  918.  
  919.  
  920.  
  921. #logOuter{
  922. border-style: solid !important;
  923. border-radius: 0% !important;
  924. border-color: #FFFFFF !important;
  925. }
  926. #logInner{
  927. display: flex;
  928. flex-direction: column;
  929. width: 20vw !important;
  930. padding: 5%;
  931. font-family: 'Courier Prime', monospace !important;
  932. color: #FFFFFF;
  933. overflow:auto;
  934. }
  935. #box-log{
  936. border-style: solid !important;
  937. border-radius: 0% !important;
  938. border: 1px;
  939. border-color: #FFFFFF !important;
  940. background-color: #002130;
  941. }
  942. .log{
  943. width: 100% !important;
  944. opacity: 50% !important;
  945. top: 81% !important;
  946. left: 4% !important;
  947. height: 12% !important;
  948. width: 20% !important;
  949. }
  950.  
  951. #thing-text-1, #thing-text-2, #thing-text-3, #thing-text-4{
  952.  
  953. }
  954.  
  955. #box-res{
  956. }
  957.  
  958. #thing-icon-1, #thing-icon-2, #thing-icon-3, #thing-icon-4{
  959.  
  960.  
  961. }
  962. #thing-1, #thing-2, #thing-3, #thing-4{
  963.  
  964. }
  965.  
  966. img{object-fit: contain !important;}
  967.  
  968. #box-things-sortup, #box-things-sortup2, #box-things-Upgrades, #box-things-upgrades2  /*if necessary, change this to the name of the box containing your upgrades. it should start with "box-things" and you can use inspect element to find it*/
  969. {
  970.     display:flex;
  971.     flex-wrap:wrap;
  972.     justify-content:center; /*you can change this to "flex-start" if you want upgrades aligned to the left*/
  973.     flex-direction: column-reverse;
  974. }
  975.  
  976. #box-things-Buildings, #box-things-buildings2{
  977.     display:flex;
  978.     flex-wrap:wrap;
  979.     justify-content:center; /*you can change this to "flex-start" if you want upgrades aligned to the left*/
  980.  
  981.     flex-direction: column-reverse;
  982. }
  983.  
  984. .tag-sortup, .tag-sortup2, .building, .thing-77, .upgrade2.notOwned, .upgrade2.cantAfford{
  985.     order:3;
  986. }
  987. .upgrade.notOwned {
  988.     order:2;
  989. }
  990. .upgrade.owned, .upgrade2.owned
  991. {
  992.     order:1;
  993. }#tooltip{
  994.  
  995. width: 38em;
  996.  
  997.  
  998. }#game
  999.   {
  1000.     background:#002130;
  1001.     background-size: cover;
  1002.     font-family: DejaVu Sans Mono, monospace !important;
  1003.     letter-spacing: 0px;
  1004.  
  1005.     font-stretch: ultra-expanded
  1006.  
  1007.    // font-family:Century Gothic,sans-serif;
  1008.     //font-weight:100;
  1009.     color:#93f8ff;
  1010.   }
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement
Public Pastes
Advertisement
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!