/* COLORS */ /* Attributes */ /* COLORS */ /* Attributes */ * { font-size: 16px; font-family: "Lucida Console", "Lucida Sans Unicode", "Fira Mono", "Consolas", "Courier New", Courier, monospace, "Times New Roman"; } *, *:before, *:after { margin: 0; padding: 0; box-sizing: border-box; vertical-align: top; } :root { --my-font-color: #6f3; --my-background-color: #000; --my-highlight-color: #fff; --my-prompt-color: #f92672; } body { background-color: var(--my-background-color); } p, pre, h2, .text, td { color: var(--my-font-color); } h1 { font-size: 22px; color: var(--my-font-color); } ul { padding: 2px; list-style-type: none; } li { list-style-type: none; } #entire-game-container { background-color: transparent; } /* Disable border highlight on elements */ input:focus, textarea:focus, button:focus, td:focus, tr:focus { outline: none; } /* Make html links ("a" elements) nice looking buttons with this class */ a:link, a:visited { color: #fff; } .dropdown { color: #fff; background-color: #000; } .text-input { color: #fff; background-color: #000; border-style: solid; border-width: 1px; border-color: white; } /* Notification icon (for create program right now only) */ #create-program-tab { position: relative; } #create-program-notification { font-size: 10px; position: absolute; /* Position the badge within the relatively positioned button */ top: 0; right: 0; } #factions-tab { position: relative; } #factions-notification { font-size: 10px; position: absolute; /* Position the badge within the relatively positioned button */ top: 0; right: 0; } #augmentations-tab { position: relative; } #augmentations-notification { font-size: 10px; position: absolute; /* Position the badge within the relatively positioned button */ top: 0; right: 0; } .notification-on { background-color: #fa3e3e; color: #fff; border-radius: 2px; padding: 1px 3px; } .notification-off { background-color: #333; color: #333; border-radius: 0; padding: 0; } /* help tip. Question mark that opens popup with info/details */ .help-tip { background-color: black; border: 1px solid #fff; border-radius: 5px; color: #fff; content: '?'; display: inline-block; margin-left: 3px; padding: 1px; } .help-tip-big { content: '?'; padding: 3px; margin-left: 3px; color: #fff; border: 1px solid #fff; border-radius: 8px; display: inline-block; } .help-tip:hover, .help-tip-big:hover { background-color: #888; } .help-tip:active, .help-tip-big:active { -webkit-box-shadow: inset 0 1px 4px rgba(0, 0, 0, 0.6); -moz-box-shadow: inset 0 1px 4px rgba(0, 0, 0, 0.6); box-shadow: inset 0 1px 4px rgba(0, 0, 0, 0.6); } /* Flashing button (Red) */ @-webkit-keyframes glowing { 0% { background-color: #b20000; -webkit-box-shadow: 0 0 3px #b20000; } 50% { background-color: #f00; -webkit-box-shadow: 0 0 40px #f00; } 100% { background-color: #b20000; -webkit-box-shadow: 0 0 3px #b20000; } } @-moz-keyframes glowing { 0% { background-color: #b20000; -moz-box-shadow: 0 0 3px #b20000; } 50% { background-color: #f00; -moz-box-shadow: 0 0 40px #f00; } 100% { background-color: #b20000; -moz-box-shadow: 0 0 3px #b20000; } } @-o-keyframes glowing { 0% { background-color: #b20000; box-shadow: 0 0 3px #b20000; } 50% { background-color: #f00; box-shadow: 0 0 40px #f00; } 100% { background-color: #b20000; box-shadow: 0 0 3px #b20000; } } @keyframes glowing { 0% { background-color: #b20000; box-shadow: 0 0 3px #b20000; } 50% { background-color: #f00; box-shadow: 0 0 40px #f00; } 100% { background-color: #b20000; box-shadow: 0 0 3px #b20000; } } .flashing-button { -webkit-animation: glowing 1500ms infinite; -moz-animation: glowing 1500ms infinite; -o-animation: glowing 1500ms infinite; animation: glowing 1500ms infinite; } /* Blinking Cursor */ /* ----- blinking cursor animation ----- */ .typed-cursor { opacity: 1; -webkit-animation: blink 0.95s infinite; -moz-animation: blink 0.95s infinite; -ms-animation: blink 0.95s infinite; -o-animation: blink 0.95s infinite; animation: blink 0.95s infinite; } @-keyframes blink { 0% { opacity: 1; } 50% { opacity: 0; } 100% { opacity: 1; } } @-webkit-keyframes blink { 0% { opacity: 1; } 50% { opacity: 0; } 100% { opacity: 1; } } @-moz-keyframes blink { 0% { opacity: 1; } 50% { opacity: 0; } 100% { opacity: 1; } } @-ms-keyframes blink { 0% { opacity: 1; } 50% { opacity: 0; } 100% { opacity: 1; } } @-o-keyframes blink { 0% { opacity: 1; } 50% { opacity: 0; } 100% { opacity: 1; } } /* Status text */ @-webkit-keyframes status-text { from { opacity: 1; } to { opacity: 0; } } .status-text { display: inline-block; position: fixed; z-index: 2; -webkit-animation: status-text 3s 1; } #status-text-container { background-color: transparent; } #status-text { background-color: transparent; bottom: 0; color: #fff; display: none; font-size: 20px; margin-right: 14px; opacity: 0; padding: 4px; right: 0; top: 0; width: auto; } /* Scan analyze links from AutoLink */ .scan-analyze-link { cursor: pointer; color: #fff; text-decoration: underline; } .scan-analyze-link:hover { text-decoration: none; } /* Accordion menus (Header with collapsible panel) */ .accordion-header { background-color: #444; color: #fff; font-size: 20px; margin: 6px 6px 0 6px; padding: 4px 6px; cursor: pointer; width: 80%; text-align: left; border: none; outline: none; position: relative; } .accordion-header.active, .accordion-header:hover { background-color: #555; } .accordion-header.active:hover { background-color: #666; } .accordion-header:after { content: '\2795'; /* "plus" sign (+) */ font-size: 14px; float: right; color: transparent; text-shadow: 0 0 0 #fff; position: absolute; bottom: 5px; right: 6px; } .accordion-header.active:after { content: "\2796"; /* "minus" sign (-) */ } .accordion-panel { margin: 0 6px 6px 6px; padding: 0 6px 6px 6px; width: 75%; margin-left: 5%; display: none; background-color: #555; overflow-y: auto; overflow-x: none; } .accordion-panel div, .accordion-panel ul, .accordion-panel p, .accordion-panel ul > li { background-color: #555; } /* override the global <span> styling */ #active-scripts-total-production-active, #active-scripts-total-prod-aug-total, #active-scripts-total-prod-aug-avg { margin: 0; padding: 0; } /* Helper Classes */ .hacker-green { color: #adff2f; } .money-gold { color: #ffd700; } .light-yellow { color: #faffdf; } .failure { color: #ff2929; text-shadow: 0 0 0 #ff2929; } .success { color: #3adb76; text-shadow: 0 0 0 #3adb76; } .physical-yellow { color: #faffdf; } .charisma-purple { color: #a671d1; } .smallfont { font-size: 13px; } .optionCheckbox { filter: invert(1) sepia(1) hue-rotate(41deg) brightness(100%) saturate(10); margin: 5px; float: right; } .optionRange { -webkit-appearance: none; background: #777; outline: none; opacity: 0.7; height: 10px; -webkit-transition: .2s; transition: opacity .2s; margin: 3px; } .optionRange::-webkit-slider-thumb { -webkit-appearance: none; appearance: none; width: 10px; height: 10px; background: var(--my-font-color); cursor: pointer; } .optionRange::-moz-range-thumb { width: 10px; height: 10px; background: var(--my-font-color); cursor: pointer; } /* COLORS */ /* Attributes */ /* Styling for tooltip-style elements */ /* Tool tips (when hovering over an element */ .tooltip { display: inline-block; position: relative; /* Positioned to left of element rather than right */ /* Tooltip goes below cursor instead of above */ } .tooltip .tooltiptext { visibility: hidden; width: 300px; background-color: var(--my-background-color); border: 2px solid var(--my-highlight-color); color: #fff; text-align: center; padding: 4px; left: 101%; pointer-events: none; position: absolute; z-index: 99; } .tooltip .tooltiptextleft { visibility: hidden; width: 300px; background-color: var(--my-background-color); border: 2px solid var(--my-highlight-color); color: #fff; text-align: center; padding: 4px; top: 50%; left: 50%; transform: translate(-100%, -100%); /* Backwards compatibility */ -webkit-transform: translate(-100%, -100%); -moz-transform: translate(-100%, -100%); -o-transform: translate(-100%, -100%); -ms-transform: translate(-100%, -100%); position: absolute; z-index: 99; } .tooltip .tooltiptextlow { visibility: hidden; width: 300px; background-color: var(--my-background-color); border: 2px solid var(--my-highlight-color); color: #fff; text-align: center; padding: 4px; left: 101%; pointer-events: none; position: absolute; z-index: 99; bottom: 25%; } /* Same thing as a normal tooltip except its a bit higher */ .tooltip .tooltiptexthigh { visibility: hidden; width: 300px; background-color: var(--my-background-color); border: 2px solid var(--my-highlight-color); color: #fff; text-align: center; padding: 4px; left: 101%; bottom: -25%; position: absolute; z-index: 99; } .tooltip:hover .tooltiptext, .tooltip:hover .tooltiptexthigh, .tooltip:hover .tooltiptextleft, .tooltip:hover .tooltiptextlow { visibility: visible; } /* COLORS */ /* Attributes */ /** * Styling for all buttons * * Includes <button> elements as well as classes that are used * for formatting buttons */ /* Remove default <button> styling */ button { border: none; background-color: transparent; } .a-link-button, .std-button { text-decoration: none; background-color: #555; color: #fff; padding: 3px 5px; margin: 5px; border: 1px solid #333; -moz-user-select: none; -ms-user-select: none; -khtml-user-select: none; -webkit-user-select: none; } .a-link-button:hover, .std-button:hover { background-color: #666; } .a-link-button:active, .std-button:active { -webkit-box-shadow: inset 0 1px 4px rgba(0, 0, 0, 0.6); -moz-box-shadow: inset 0 1px 4px rgba(0, 0, 0, 0.6); box-shadow: inset 0 1px 4px rgba(0, 0, 0, 0.6); } .a-link-button-inactive, .std-button-disabled, .std-button:disabled { text-decoration: none; background-color: #333; color: #fff; padding: 3px 5px; margin: 5px; border: 1px solid #333; cursor: default; -moz-user-select: none; -ms-user-select: none; -khtml-user-select: none; -webkit-user-select: none; } .a-link-button-inactive:hover .tooltiptext, .a-link-button-inactive:hover .tooltiptexthigh, .a-link-button-inactive:hover .tooltiptextleft, .std-button-disabled:hover .tooltiptext, .std-button-disabled:hover .tooltiptexthigh, .std-button-disabled:hover .tooltiptextleft, .std-button:disabled:hover .tooltiptext, .std-button:disabled:hover .tooltiptexthigh, .std-button:disabled:hover .tooltiptextleft { visibility: visible; } .a-link-button-inactive:active, .std-button-disabled:active, .std-button:disabled:active { pointer-events: none; } .a-link-button-bought, .std-button-bought { text-decoration: none; background-color: #0a0; color: #fff; padding: 3px 5px; margin: 5px; border: 1px solid #0a0; cursor: default; } .a-link-button-bought:hover .tooltiptext, .a-link-button-bought:hover .tooltiptexthigh, .a-link-button-bought:hover .tooltiptextleft, .std-button-bought:hover .tooltiptext, .std-button-bought:hover .tooltiptexthigh, .std-button-bought:hover .tooltiptextleft { visibility: visible; } .a-link-button-bought:active, .std-button-bought:active { pointer-events: none; } /** * This is a button that is meant to be used on accordions (accordion-header and accordion-panel classes) * It has a black background so it does not clash with the default accordion coloring */ .accordion-button { -webkit-border-radius: 12px; -moz-border-radius: 12px; border-radius: 12px; -webkit-box-shadow: 1px 1px 3px #000; -moz-box-shadow: 1px 1px 3px #000; box-shadow: 1px 1px 3px #000; color: #aaa; font-size: 16px; font-weight: bold; margin: 4px; padding: 4px; background-color: #000; /* TODO focus selector? */ } .accordion-button:hover, .accordion-button:active { color: #fff; text-decoration: none; cursor: pointer; } /* COLORS */ /* Attributes */ /** * Styling for the main navigation menu on the left-hand-side */ .mainmenu { list-style-type: none; margin: 0; padding: 0; width: 10%; position: fixed; height: 100%; overflow: auto; border: 0; border-bottom: 1px solid #000; border-radius: 0; background-color: #333; } /* Default buttons */ .mainmenu > li a, .mainmenu > li button { display: block; color: #e6e6e6; background-color: #555; padding: 12px 8px; text-decoration: none; cursor: pointer; width: 100%; text-align: left; } .mainmenu.classic > li a, .mainmenu.classic > li button { padding: 16px; } .mainmenu.compact > li a, .mainmenu.compact > li button { display: block; color: #e6e6e6; background-color: #555; text-decoration: none; cursor: pointer; width: 100%; text-align: left; padding: 4px; } /* Hovering makes them lighter */ .mainmenu > li a:hover, .mainmenu > li a:hover:not(.active), .mainmenu > li a:focus { background-color: #777; color: #fff; } .mainmenu > li button:hover, .mainmenu > li button:hover:not(.active) { background-color: #777; color: #fff; } /* Panel headers can become active, and they are "lighter" than the rest */ .mainmenu > li a.active, .mainmenu > li button.active { background-color: #777; color: #fff; } .mainmenu > li a.active:hover, .mainmenu > li button.active:hover { background-color: #aaa; } #hacking-menu-header-li, #character-menu-header-li, #world-menu-header-li, #help-menu-header-li { position: relative; } /* Accordion Outline */ .mainmenu-accordion-header, .mainmenu-accordion-header-compact { outline: 2px solid #fff !important; } .mainmenu-accordion-header-classic { border: 2px solid #fff; padding: 16px !important; } /* Plus and minus signs */ .mainmenu-accordion-header:after, .mainmenu-accordion-header-compact:after { content: '\2795'; float: right; font-size: 13px; position: absolute; bottom: 25%; right: 3px; color: transparent; text-shadow: 0 0 0 #fff; } .mainmenu-accordion-header-classic:after { content: '\2795'; float: right; font-size: 13px; color: #fff; margin-left: 5px; } .mainmenu-accordion-header.opened, .mainmenu-accordion-header-classic.opened, .mainmenu-accordion-header-compact.opened { background-color: #222 !important; } .mainmenu-accordion-header.opened:after, .mainmenu-accordion-header-classic.opened:after, .mainmenu-accordion-header-compact.opened:after { content: "\2796"; } /* Slide down transition */ .mainmenu-accordion-panel { max-height: 0; opacity: 1; transition: max-height 0.2s ease-out; } /* COLORS */ /* Attributes */ /** * Styling for the Character Overview Panel (top-right panel) */ #character-overview-wrapper { position: relative; } #character-overview-container { display: none; position: absolute; /* Stay in place */ right: 0; top: 0; height: auto; /* Full height */ padding: 10px 2px; border: 2px solid var(--my-highlight-color); width: auto; max-width: 280px; overflow: auto; /* Enable scroll if needed */ background-color: rgba(57, 54, 54, 0.9); /* Fallback color */ z-index: 1; } #character-overview-text { color: #faffdf; } #character-overview-text table { border-collapse: collapse; margin: auto; } #character-overview-text td { padding: 2px; vertical-align: middle; } .character-stat-text { color: #fff; background-color: #444; } .character-stat-cell { text-align: right; } #character-hack-wrapper td, #character-agi-wrapper td { border-bottom: 1px #aaa solid; padding-bottom: 10px; } #character-str-wrapper td, #character-cha-wrapper td { padding-top: 10px; } #character-hp-wrapper { color: #dd3434; } .character-hp-cell { color: #dd3434; } #character-money-wrapper { color: #ffd700; } .character-money-cell { color: #ffd700; } #character-hack-wrapper { color: #adff2f; } .character-hack-cell { color: #adff2f; } #character-cha-wrapper { color: #a671d1; } .character-cha-cell { color: #a671d1; } #character-int-wrapper { color: #6495ed; } .character-int-cell { color: #6495ed; } .character-combat-cell { color: #faffdf; } .character-overview-btn { -webkit-border-radius: 12px; -moz-border-radius: 12px; border-radius: 12px; -webkit-box-shadow: 1px 1px 3px #000; -moz-box-shadow: 1px 1px 3px #000; box-shadow: 1px 1px 3px #000; color: #cecece; display: inline-block; font-size: 14px; font-weight: bold; height: 25px; background-color: #000; padding: 5px 8px; } .character-quick-options { margin-top: 10px; text-align: center; } .character-overview-btn:hover, .character-overview-btn:focus { color: #fff; text-decoration: none; cursor: pointer; } /* COLORS */ /* Attributes */ #terminal-container { position: fixed; margin-left: 10%; height: 100%; width: 99%; overflow: auto; overflow-y: scroll; } #terminal { padding-top: 10px; padding-left: 10px; height: auto; width: 70%; font-size: 16px; overflow: auto; overflow-y: scroll; background-color: var(--my-background-color); table-layout: fixed; } #terminal .prompt { color: var(--my-prompt-color); margin: 0; padding: 0; } #terminal-input { background-color: var(--my-background-color); color: var(--my-font-color); transition: height 1s; } .terminal-input { display: inline-block; padding: 0 !important; margin: 0 !important; border: 0; background-color: var(--my-background-color); font-size: 16px; outline: none; color: var(--my-font-color); } .terminal-line { width: 70%; word-wrap: break-word; hyphens: auto; -webkit-hyphens: auto; -moz-hyphens: auto; } #terminal-input-td { display: flex; } #terminal-input-td textarea { overflow: hidden; resize: none; height: auto; } #terminal-input-header { white-space: pre; } #terminal-input-text-box { margin-left: 2px; flex: 1 1 auto; } /* COLORS */ /* Attributes */ /** * Styling for Script Editor (both Ace and CodeMirror) */ #script-editor-container { background-color: transparent; } #ace-editor { margin: 10px; height: 80%; width: 100%; margin-left: 6px; padding-left: 6px; padding-top: 6px; padding-bottom: 6px; border: 2px solid var(--my-highlight-color); z-index: 1; font-family: "Lucida Console", "Lucida Sans Unicode", "Fira Mono", "Consolas", "Courier New", Courier, monospace, "Times New Roman"; } /* This temp element is used for auto adjusting filename field */ .tmp-element { visibility: hidden; white-space: pre; } #script-editor-container { position: fixed; padding-top: 10px; } #script-editor-buttons-wrapper { width: 100%; padding-right: 0; margin-right: 0; } #script-editor-wrapper { height: 100%; width: 70%; background: transparent; } #script-editor-filename-wrapper { background-color: #555; margin-left: 6px; margin-right: 0; padding-left: 6px; width: 100%; border: 2px solid var(--my-highlight-color); } #script-editor-filename-tag { display: inline-block; padding-top: 10px; padding-bottom: 0; float: center; background-color: #555; color: #fff; } #script-editor-filename { -webkit-box-shadow: inset 0 0 8px rgba(0, 0, 0, 0.1), 0 0 16px rgba(0, 0, 0, 0.1); -moz-box-shadow: inset 0 0 8px rgba(0, 0, 0, 0.1), 0 0 16px rgba(0, 0, 0, 0.1); box-shadow: inset 0 0 8px rgba(0, 0, 0, 0.1), 0 0 16px rgba(0, 0, 0, 0.1); background-color: #555; border: 2px solid var(--my-highlight-color); color: #fff; display: inline-block; float: center; margin: 4px; padding: 2px; resize: none; width: 60%; } #script-editor-status { float: left; color: #fff; } #script-editor-options-panel { position: absolute; right: 9%; bottom: 15%; border: 2px solid #fff; width: 19%; background-color: #444; padding: 2px; overflow: auto; z-index: 1; color: #fff; max-height: 50%; } #script-editor-options-panel fieldset { margin-top: 8px; margin-bottom: 8px; padding: 2px; font-size: 12px; } #script-editor-options-panel fieldset input { margin: 2px; } /* Specific overrides for Ace Editor */ .ace_line, .ace_line * { background-color: transparent; margin: 0; padding: 0; } .ace_text-input { font-size: 16px; background-color: transparent; } /* Specified overrides for Code mirror Editor are defined in codemirror-override.scss */ /* COLORS */ /* Attributes */ /** * Customized styling for the Code Mirror editor */ #codemirror-form-wrapper { height: 80%; margin: 10px 0px 0px 6px; } .CodeMirror { height: 100%; width: 100%; border: 2px solid var(--my-highlight-color); z-index: 1; font-family: "Lucida Console", "Lucida Sans Unicode", "Fira Mono", "Consolas", "Courier New", Courier, monospace, "Times New Roman"; font-size: 16px; } /** * Highlight matches */ .cm-matchhighlight { background-color: #8F908A; } .CodeMirror-selection-highlight-scrollbar { background-color: #8F908A; } /** * Show Invisibles */ .cm-whitespace::before { position: absolute; pointer-events: none; color: #404F7D; } /** * Vim command display */ #codemirror-vim-command-display-wrapper { background-color: white; font-size: 13px; height: 30px; margin-left: 6px; } /* COLORS */ /* Attributes */ .active-scripts-list { list-style-type: none; } #active-scripts-container { position: fixed; padding-top: 10px; } #active-scripts-container > p { width: 70%; margin: 6px; padding: 4px; } #active-scripts-container .accordion-header > pre { color: white; } .active-scripts-server-header { background-color: #444; font-size: 20px; color: #fff; margin: 6px 6px 0 6px; padding: 6px; cursor: pointer; width: 60%; text-align: left; border: none; outline: none; } .active-scripts-server-header:after { content: '\2795'; /* "plus" sign (+) */ font-size: 13px; color: #fff; float: right; margin-left: 5px; } .active-scripts-server-header.active, .active-scripts-server-header:hover { background-color: #555; } .active-scripts-server-header.active:after { content: "\2796"; /* "minus" sign (-) */ font-size: 13px; color: #fff; float: right; margin-left: 5px; } .active-scripts-server-header.active:hover { background-color: #666; } .active-scripts-server-panel { margin: 0 6px 6px 6px; padding: 0 6px 6px 6px; width: 55%; margin-left: 5%; display: none; } .active-scripts-server-panel div, .active-scripts-server-panel ul, .active-scripts-server-panel ul > li { background-color: #555; } .active-scripts-script-header { background-color: #555; border: none; color: var(--my-font-color); cursor: pointer; display: block; outline: none; padding: 4px 25px 4px 10px; position: relative; text-align: left; width: auto; } .active-scripts-script-header:after { content: '\2795'; /* "plus" sign (+) */ font-size: 13px; float: right; margin-left: 5px; color: transparent; text-shadow: 0 0 0 var(--my-font-color); position: absolute; bottom: 4px; } .active-scripts-script-header.active:after { content: "\2796"; /* "minus" sign (-) */ } .active-scripts-script-header:hover, .active-scripts-script-header.active:hover { background-color: #666; } .active-scripts-script-header.active { background-color: #555; } .active-scripts-script-panel { background-color: #555; display: none; font-size: 14px; margin-bottom: 6px; padding: 0 18px; width: auto; } .active-scripts-script-panel pre, .active-scripts-script-panel h2, .active-scripts-script-panel ul, .active-scripts-script-panel li { background-color: #555; width: auto; color: #fff; margin-left: 5%; } /* COLORS */ /* Attributes */ /** * Styling for the Hacknet Nodes UI Page */ #hacknet-nodes-container { position: fixed; padding: 10px; } .hacknet-general-info { margin: 10px; width: 70vw; } #hacknet-nodes-container li { float: left; overflow: hidden; white-space: nowrap; } #hacknet-nodes-container li.hacknet-node { -webkit-box-shadow: inset 0 0 8px rgba(0, 0, 0, 0.1), 0 0 16px rgba(0, 0, 0, 0.1); -moz-box-shadow: inset 0 0 8px rgba(0, 0, 0, 0.1), 0 0 16px rgba(0, 0, 0, 0.1); box-shadow: inset 0 0 8px rgba(0, 0, 0, 0.1), 0 0 16px rgba(0, 0, 0, 0.1); margin: 6px; padding: 7px; width: 35vw; border: 2px solid var(--my-highlight-color); } #hacknet-nodes-list { list-style: none; width: 82vw; } #hacknet-nodes-money { margin: 10px; float: left; } #hacknet-nodes-money-multipliers-div { display: inline-block; width: 70vw; } #hacknet-nodes-multipliers { float: right; } #hacknet-nodes-purchase-button { display: inline-block; } .hacknet-node-container { display: inline-table; } .hacknet-node-container .row { display: table-row; height: 30px; } .hacknet-node-container .row p { display: table-cell; } .hacknet-node-container .upgradable-info { display: inline-block; margin: 0 4px; /* Don't want the vertical margin/padding, just left & right */ padding: 0 4px; width: 64px; } /* COLORS */ /* Attributes */ /* CSS for different main menu pages, such as character info, script editor, etc (but excluding terminal which has its own page) */ .generic-menupage-container { height: 100%; padding-left: 10px; margin-left: 10%; width: 99%; overflow-y: scroll; } /* Character Info */ #character-container { padding-top: 10px; position: fixed; } /* World */ #world-container { position: fixed; padding-top: 10px; } #world-city-name, #world-city-desc { padding: 4px; margin: 4px; } /* Create program */ #create-program-container { position: fixed; padding-top: 10px; } #create-program-page-text, #create-program-list { width: 70%; } /* Factions and Faction (Single Faction page) */ #factions-container { position: fixed; padding-top: 10px; } #faction-container { position: fixed; padding-top: 10px; } .faction-work-div { width: 70%; height: 100%; } .faction-work-div-wrapper { overflow: hidden; border: 2px solid #333; padding: 6px; margin: 6px; width: 70%; } #faction-container p, #faction-container pre { padding: 4px 6px; margin: 4px 6px; } #faction-container pre { width: 70%; white-space: pre-wrap; /* Since CSS 2.1 */ white-space: -moz-pre-wrap; /* Mozilla, since 1999 */ white-space: -pre-wrap; /* Opera 4-6 */ white-space: -o-pre-wrap; /* Opera 7 */ word-wrap: break-word; /* Internet Explorer 5.5+ */ } /* World */ #world-container li { margin: 0 0 15px 0; list-style-type: none; } /* Tutorial */ #tutorial-container { position: fixed; padding-top: 10px; } #tutorial-text { width: 70%; margin: 10px; } #tutorial-container a { width: 50%; } /* Dev menu */ #dev-menu-container { position: fixed; padding-top: 10px; } #dev-menu-text { width: 70%; margin: 10px; } #dev-menu-container a { width: 50%; } /* Location */ #location-container { position: fixed; padding: 6px; overflow-x: hidden; } #location-container a { display: inline-block; width: 30%; } #location-slums-description { width: 70%; margin: 10px; } #location-return-to-world-button { margin: 10px; padding: 6px; } #location-container > * { margin: 10px 5px 10px 5px; } #location-job-reputation, #location-company-favor { display: inline; } /* Infiltration */ #infiltration-container { position: fixed; padding: 6px; } #infiltration-container span { margin: 0; padding: 0; } #infiltration-left-panel, #infiltration-right-panel { display: inline-block; border: 1px solid #fff; width: 35%; height: 75%; top: 10px; overflow-y: auto; overflow-x: auto; } #infiltration-faction-select { color: #fff; } #infiltration-left-panel p, #infiltration-right-panel p { margin: 4px; } #infiltration-buttons { margin-top: 20px; } #infiltration-buttons .a-link-button { display: inline; width: 25%; } /** * Styling for the Augmentations UI. This is the page that displays all of the * player's owned and purchased Augmentations and Source-Files. It also allows * the player to install Augmentations */ /* COLORS */ /* Attributes */ #augmentations-container { position: fixed; padding-top: 10px; } #augmentations-content > p { font-size: 14px; width: 70%; } .augmentations-list button, .augmentations-list div { color: var(--my-font-color); text-decoration: none; } .augmentations-list button { padding: 4px; } /* COLORS */ /* Attributes */ /** * Styling for the Red Pill screen (the BitNode selection UI) */ #red-pill-container { position: fixed; } .bitnode.level-0 { color: red; } .bitnode.level-1 { color: yellow; } .bitnode.level-2 { color: #48D1CC; } .bitnode.level-3 { color: blue; } .bitnode.unimplemented { color: gray; } .bitnode:hover { color: #fff; } /* COLORS */ /* Attributes */ #stock-market-container { position: fixed; padding: 6px; } #stock-market-container p { font-size: 13px; } #stock-market-container a { font-size: 14px; } .stock-market-info-and-purchases > h2 { display: block; margin-top: 10px; margin-left: 10px; } .stock-market-info-and-purchases > p { display: block; margin-left: 10px; width: 70%; } .stock-market-info-and-purchases > a, .stock-market-info-and-purchases > button { margin: 10px; } #stock-market-list { list-style: none; } #stock-market-list li button { font-size: 16px; } #stock-market-watchlist-filter { display: block; margin: 5px 5px 5px 10px; padding: 4px; width: 50%; } .stock-market-input { display: inline-block; padding: 4px; margin: 2px; background-color: #000; border: 1px solid #fff; color: var(--my-font-color); } .stock-market-price-movement-warning { border: 1px solid white; color: red; margin: 2px; padding: 2px; } .stock-market-position-text { color: #fff; display: block; } .stock-market-position-text p { color: #fff; display: inline-block; margin: 4px; } .stock-market-position-text h3 { margin: 4px; } .stock-market-order-list { overflow-y: auto; max-height: 100px; } .stock-market-order-list li { color: #fff; padding: 4px; } .stock-market-order-cancel-btn { background-color: #000; border: 1px solid #fff; color: var(--my-font-color); margin: 2px; padding: 0; } /* COLORS */ /* Attributes */ /* Both Work in progress and BitNode stuff */ .generic-fullscreen-container { color: var(--my-font-color); width: 99%; height: 100%; overflow-y: hidden; } .generic-fullscreen-container-scroll { height: 100%; width: 100%; overflow: auto; padding-right: 20px; } #work-in-progress-container { position: fixed; } #work-in-progress-text { color: var(--my-font-color); width: 70%; margin: 10px; } #work-in-progress-cancel-button { -webkit-border-radius: 12px; -moz-border-radius: 12px; border-radius: 12px; -webkit-box-shadow: 1px 1px 3px #000; -moz-box-shadow: 1px 1px 3px #000; box-shadow: 1px 1px 3px #000; color: #aaa; float: left; font-size: 20px; font-weight: bold; margin: 10px; padding: 5px; border: 3px solid #fff; } #work-in-progress-cancel-button:hover, #work-in-progress-cancel-button:focus { color: #fff; text-decoration: none; cursor: pointer; } #cinematic-text-container { position: fixed; } /* COLORS */ /* Attributes */ /* Pop-up boxes */ .popup-box-container { display: none; /* Initially hidden */ position: fixed; /* Stay in place */ z-index: 10; /* Sit on top */ left: 0; top: 0; align-items: center; justify-content: center; width: 100%; height: 100%; overflow: auto; background-color: rbga(var(--my-background-color), 0.4); } .popup-box-content { background-color: var(--my-background-color); padding: 12px; border: 5px solid var(--my-highlight-color); width: 70%; max-height: 80%; overflow-y: auto; color: var(--my-font-color); } .popup-box-button, .popup-box-button-inactive { color: #aaa; float: right; font-size: 16px; font-weight: bold; padding: 2px; margin: 6px; border: 1px solid #fff; background-color: #000; } .popup-box-button:hover, .popup-box-button:focus { color: var(--my-font-color); text-decoration: none; cursor: pointer; } .popupbox-button-inactive { pointer-events: none; cursor: default; } #yes-no-text-input-box-input { color: var(--my-font-color); border: 1px solid #fff; background-color: #000; } .dialog-box-container, #log-box-container { display: block; position: absolute; z-index: 10; width: 50%; height: auto; max-height: 50%; top: 40%; left: 50%; margin: -10% 0 0 -25%; overflow: auto; background-color: var(--my-background-color); border: 5px solid var(--my-highlight-color); } .dialog-box-content, #log-box-content { z-index: 2; background-color: var(--my-background-color); padding: 10px; } .dialog-box-content p span, #log-box-content p span { padding: 0; margin: 0; } .dialog-box-close-button { -webkit-border-radius: 12px; -moz-border-radius: 12px; border-radius: 12px; -webkit-box-shadow: 1px 1px 3px #000; -moz-box-shadow: 1px 1px 3px #000; box-shadow: 1px 1px 3px #000; float: right; color: #aaa; font-size: 20px; font-weight: bold; } #log-box-close { position: fixed; right: 27%; } #log-box-kill-script { right: 11%; position: relative; } #log-box-close, #log-box-kill-script { float: right; display: inline-block; } .dialog-box-close-button:hover, .dialog-box-close-button:focus { color: #fff; text-decoration: none; cursor: pointer; } /* Faction invitation box */ #faction-invitation-box-container { transition: opacity 400ms ease-in; } #faction-invitation-box-warning { margin: 4px; padding: 4px; } /* Infiltration-box */ #infiltration-box-sell, #infiltration-box-faction { display: block; padding: 8px; margin: 8px; } #infiltration-box-content span { padding: 0; margin: 0; } #infiltration-faction-select { background-color: #000; } /* Generic Yes No Box */ #yes-no-text-input-box-input { color: #fff; } /* Game Options */ #game-options-container { transition: opacity 400ms ease-in; } #game-options-content { background-color: var(--my-background-color); padding: 10px; border: 5px solid var(--my-highlight-color); color: var(--my-font-color); width: 80%; max-height: 80%; overflow-y: auto; } #game-options-left-panel, #game-options-right-panel { display: inline-block; width: 49%; } #game-options-close-button { -webkit-border-radius: 12px; -moz-border-radius: 12px; border-radius: 12px; -webkit-box-shadow: 1px 1px 3px #000; -moz-box-shadow: 1px 1px 3px #000; box-shadow: 1px 1px 3px #000; color: #aaa; float: right; margin: 4px; padding: 4px; font-size: 20px; font-weight: bold; } #game-options-close-button:hover, #game-options-close-button:focus { color: #fff; text-decoration: none; cursor: pointer; } #game-options-left-panel fieldset { padding: 2px; margin: 2px; } #import-game-file-selector { display: none; } /* Styling for the game options/settings * * Styling for the actual Game Options popup box can be found in popupboxes.scss * This stylesheet is for everything inside the Game Options pop-up box */ /* COLORS */ /* Attributes */ #game-options-right-panel a { display: block; width: 46%; } #game-options-right-panel button { display: inline-block; width: 46%; } /* COLORS */ /* Attributes */ /* interactivetutorial.css */ #interactive-tutorial-wrapper { position: relative; } #interactive-tutorial-container { display: none; position: absolute; /* Stay in place */ right: 0; top: 0; height: 450px; padding: 10px; border: 5px solid #fff; width: 23%; overflow: hidden; background-color: #444; /* Fallback color */ color: #fff; } #interactive-tutorial-container > strong { background-color: #444; } #interactive-tutorial-text { padding: 4px; margin: 4px; color: #fff; background-color: #444; font-size: 14px; max-height: 350px; overflow-y: auto; } #interactive-tutorial-exit, #interactive-tutorial-next, #interactive-tutorial-back { -webkit-border-radius: 12px; -moz-border-radius: 12px; border-radius: 12px; -webkit-box-shadow: 1px 1px 3px #000; -moz-box-shadow: 1px 1px 3px #000; box-shadow: 1px 1px 3px #000; color: #aaa; font-size: 18px; font-weight: bold; background-color: #000; } #interactive-tutorial-exit:hover, #interactive-tutorial-exit:focus, #interactive-tutorial-next:hover, #interactive-tutorial-next:focus, #interactive-tutorial-back:hover, #interactive-tutorial-back:focus { color: #fff; text-decoration: none; cursor: pointer; } #interactive-tutorial-exit { position: absolute; bottom: 0; left: 0; padding: 4px; } #interactive-tutorial-back { float: left; padding: 4px; } #interactive-tutorial-next { float: right; padding: 4px; } /* COLORS */ /* Attributes */ * { font-size: 16px; font-family: "Lucida Console", "Lucida Sans Unicode", "Fira Mono", "Consolas", "Courier New", Courier, monospace, "Times New Roman"; } *, *:before, *:after { margin: 0; padding: 0; box-sizing: border-box; vertical-align: top; } /* COLORS */ /* Attributes */ @-webkit-keyframes LOADERSPINNER { 0% { -webkit-transform: translate(-50%, -50%) rotate(0deg); } 100% { -webkit-transform: translate(-50%, -50%) rotate(360deg); } } @-moz-keyframes LOADERSPINNER { 0% { -moz-transform: translate(-50%, -50%) rotate(0deg); } 100% { -moz-transform: translate(-50%, -50%) rotate(360deg); } } @-ms-keyframes LOADERSPINNER { 0% { -ms-transform: translate(-50%, -50%) rotate(0deg); } 100% { -ms-transform: translate(-50%, -50%) rotate(360deg); } } @-o-keyframes LOADERSPINNER { 0% { -o-transform: translate(-50%, -50%) rotate(0deg); } 100% { -o-transform: translate(-50%, -50%) rotate(360deg); } } @keyframes LOADERSPINNER { 0% { transform: translate(-50%, -50%) rotate(0deg); } 100% { transform: translate(-50%, -50%) rotate(360deg); } } @-webkit-keyframes LOADERLABEL { 0% { opacity: 1.0; -webkit-transform: translate(-50%, -50%) scale(1); } 5% { opacity: 0.5; -webkit-transform: translate(-50%, -50%) scale(0.5); } 95% { opacity: 0.5; -webkit-transform: translate(-50%, -50%) scale(0.5); } 100% { opacity: 1.0; -webkit-transform: translate(-50%, -50%) scale(1); } } @-moz-keyframes LOADERLABEL { 0% { opacity: 1.0; -moz-transform: translate(-50%, -50%) scale(1); } 5% { opacity: 0.5; -moz-transform: translate(-50%, -50%) scale(0.5); } 95% { opacity: 0.5; -moz-transform: translate(-50%, -50%) scale(0.5); } 100% { opacity: 1.0; -moz-transform: translate(-50%, -50%) scale(1); } } @-ms-keyframes LOADERLABEL { 0% { opacity: 1.0; -ms-transform: translate(-50%, -50%) scale(1); } 5% { opacity: 0.5; -ms-transform: translate(-50%, -50%) scale(0.5); } 95% { opacity: 0.5; -ms-transform: translate(-50%, -50%) scale(0.5); } 100% { opacity: 1.0; -ms-transform: translate(-50%, -50%) scale(1); } } @-o-keyframes LOADERLABEL { 0% { opacity: 1.0; -o-transform: translate(-50%, -50%) scale(1); } 5% { opacity: 0.5; -o-transform: translate(-50%, -50%) scale(0.5); } 95% { opacity: 0.5; -o-transform: translate(-50%, -50%) scale(0.5); } 100% { opacity: 1.0; -o-transform: translate(-50%, -50%) scale(1); } } @keyframes LOADERLABEL { 0% { opacity: 1.0; transform: translate(-50%, -50%) scale(1); } 5% { opacity: 0.5; transform: translate(-50%, -50%) scale(0.5); } 95% { opacity: 0.5; transform: translate(-50%, -50%) scale(0.5); } 100% { opacity: 1.0; transform: translate(-50%, -50%) scale(1); } } .loaderoverlay { position: absolute; width: 100%; height: 100%; background: #000; color: #6f3; } .loaderoverlay .loaderspinner, .loaderoverlay .loaderspinner:before, .loaderoverlay .loaderspinner:after { border: 20px solid rgba(0, 0, 0, 0); border-top-color: #6f3; border-bottom-color: #6f3; border-radius: 1000px; position: absolute; top: 50%; left: 50%; } .loaderoverlay .loaderspinner:before, .loaderoverlay .loaderspinner:after { content: ""; } .loaderoverlay .loaderspinner { -webkit-animation: LOADERSPINNER 5s linear infinite; -moz-animation: LOADERSPINNER 5s linear infinite; -ms-animation: LOADERSPINNER 5s linear infinite; -o-animation: LOADERSPINNER 5s linear infinite; animation: LOADERSPINNER 5s linear infinite; width: 200px; height: 200px; } .loaderoverlay .loaderspinner:before { -webkit-animation: LOADERSPINNER 10s linear infinite; -moz-animation: LOADERSPINNER 10s linear infinite; -ms-animation: LOADERSPINNER 10s linear infinite; -o-animation: LOADERSPINNER 10s linear infinite; animation: LOADERSPINNER 10s linear infinite; width: 160px; height: 160px; } .loaderoverlay .loaderspinner:after { -webkit-animation: LOADERSPINNER 5s linear infinite; -moz-animation: LOADERSPINNER 5s linear infinite; -ms-animation: LOADERSPINNER 5s linear infinite; -o-animation: LOADERSPINNER 5s linear infinite; animation: LOADERSPINNER 5s linear infinite; width: 120px; height: 120px; } .loaderoverlay .loaderlabel { -webkit-animation: LOADERLABEL 5s linear infinite; -moz-animation: LOADERLABEL 5s linear infinite; -ms-animation: LOADERLABEL 5s linear infinite; -o-animation: LOADERLABEL 5s linear infinite; animation: LOADERLABEL 5s linear infinite; text-transform: uppercase; font-family: sans-serif; font-size: 22px; font-weight: 700; letter-spacing: 2px; position: absolute; top: 50%; left: 50%; } .killAllMessage { position: absolute; top: 95%; left: 50%; -webkit-transform: translateX(-50%); -moz-transform: translateX(-50%); -ms-transform: translateX(-50%); -o-transform: translateX(-50%); transform: translateX(-50%); } .killAllMessageWrapperHidden { display: none; } .killAllMessageWrapperShow { display: block; } /* COLORS */ /* Attributes */ /* css for Missions */ /* Hacking missions */ #mission-container { overflow: hidden; } .hack-mission-grid { display: grid; grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr; grid-template-rows: 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr; grid-gap: 2.5%; height: 90%; position: absolute; width: 100%; overflow-y: auto; padding-right: 10px; } .hack-mission-grid::-webkit-scrollbar { display: none; } .hack-mission-node { z-index: 5; background-color: #808080; align-self: center; justify-self: center; display: inline-block; } .hack-mission-node p { -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; margin-top: 8px; color: #fff; font-size: 12px; text-align: center; } .hack-mission-player-node { color: #fff; background-color: #00f; } .hack-mission-player-node-active { border: 2px solid #fff; background-color: #66f; } .hack-mission-enemy-node { color: #fff; background-color: #f00; } .hack-mission-cpu-node { -webkit-border-radius: 50%; -moz-border-radius: 50%; border-radius: 50%; width: 100%; height: 100%; } .hack-mission-firewall-node { width: 90%; height: 100%; } .hack-mission-database-node { -webkit-transform: skew(20deg); -moz-transform: skew(20deg); -ms-transform: skew(20deg); -o-transform: skew(20deg); transform: skew(20deg); width: 100%; height: 90%; } .hack-mission-database-node p { -webkit-transform: skew(-20deg); -moz-transform: skew(-20deg); -ms-transform: skew(-20deg); -o-transform: skew(-20deg); transform: skew(-20deg); -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; color: #fff; font-size: 12px; margin-top: 8px; text-align: center; } .hack-mission-transfer-node { -webkit-transform: skew(-20deg); -moz-transform: skew(-20deg); -ms-transform: skew(-20deg); -o-transform: skew(-20deg); transform: skew(-20deg); width: 100%; height: 90%; } .hack-mission-transfer-node p { -webkit-transform: skew(20deg); -moz-transform: skew(20deg); -ms-transform: skew(20deg); -o-transform: skew(20deg); transform: skew(20deg); -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; color: #fff; font-size: 12px; margin-top: 8px; text-align: center; } .hack-mission-spam-node, .hack-mission-shield-node { height: 100%; width: 100%; } /* Non-map related DOM elements */ /* Element at the top of the Hacking Mission page (intro page, start button, guide buttons, etc.) */ .hack-mission-header-element { margin: 6px; } .hack-mission-action-buttons-container { border: 2px solid #fff; } /* COLORS */ /* Attributes */ /** * Styling for Corporations * The names/labels refer to "Company Management", which was the old name * for the mechanic before it got changed to avoid confusion with normal * companies */ #cmpy-mgmt-container p, #cmpy-mgmt-container a, #cmpy-mgmt-container div, #cmpy-mgmt-container br { font-size: 13px; } /* Header tabs */ .cmpy-mgmt-header-tab { display: inline-block; color: #fff; background-color: #555; border: 1px solid #fff; padding: 4px; } .cmpy-mgmt-header-tab:hover { background-color: #666; } .cmpy-mgmt-header-tab.current { background-color: #777; } /* Switch between Cities */ .cmpy-mgmt-city-tab { display: inline-block; color: #fff; background-color: #555; border: 1px solid #fff; padding: 4px; } .cmpy-mgmt-city-tab:hover { background-color: #666; } .cmpy-mgmt-city-tab.current { background-color: #777; } /* Panels */ #cmpy-mgmt-panel { height: 90%; } .cmpy-mgmt-industry-left-panel, .cmpy-mgmt-industry-right-panel { display: inline-block; height: 100%; overflow-y: auto; overflow-x: auto; overflow: visible; top: 10px; width: 45%; } .cmpy-mgmt-industry-overview-panel { border: 1px solid #fff; color: var(--my-font-color); display: inline-block; padding: 3px; width: 100%; } .cmpy-mgmt-employee-panel { border: 1px solid #fff; display: block; padding: 3px; width: 100%; } .cmpy-mgmt-warehouse-panel { border: 1px solid #fff; display: inline-block; padding: 3px; width: 100%; } /* Hiring new employees */ .cmpy-mgmt-find-employee-option { border: 1px solid #fff; margin: 6px; } .cmpy-mgmt-find-employee-option:hover { background-color: #3d4044; } /* Warehouse */ .cmpy-mgmt-warehouse-material-div { padding: 2px; border: 1px solid #fff; } .cmpy-mgmt-warehouse-product-div { padding: 2px; border: 1px solid #fff; } /* Exporting materials/products */ .cmpy-mgmt-existing-export { border: 1px solid #fff; border-radius: 25px; margin: 4px; padding: 4px; } .cmpy-mgmt-existing-export:hover { background-color: #333; } /* Corporation Upgrades */ .cmpy-mgmt-upgrade-container { border: 1px solid #fff; width: 60%; margin: 4px; } .cmpy-mgmt-upgrade-header { margin: 6px; padding: 6px; } .cmpy-mgmt-upgrade-div { display: inline-block; border: 1px solid #fff; margin: 2px; padding: 6px; border-radius: 25px; font-size: 12px; color: var(--my-font-color); } .cmpy-mgmt-upgrade-div:hover { background-color: #333; } /* Industry Upgrades */ .industry-purchases-and-upgrades-header { font-size: 14px; margin: 2px; padding: 2px; } /* Advertising */ .cmpy-mgmt-advertising-info { font-size: 12px; } /* Research */ #corporation-research-popup-box-content { overflow-x: auto !important; overflow-y: auto !important; } /* COLORS */ /* Attributes */ #bladeburner-container a, #bladeburner-container div, #bladeburner-container p, #bladeburner-container pre, #bladeburner-container td { font-size: 13px; } .bladeburner-action { border: 1px solid #fff; margin: 7px; padding: 7px; white-space: pre-wrap; } .bladeburner-action pre { white-space: pre-wrap; } /* Whatever action is currently active */ .bladeburner-active-action { border: 4px solid #fff; } /* Action & Skills panel navigation button */ .bladeburner-nav-button, .bladeburner-nav-button-inactive { border: 1px solid #fff; margin: 2px; padding: 2px; color: #fff; } .bladeburner-nav-button:hover { background-color: #3d4044; } .bladeburner-nav-button-inactive { text-decoration: none; background-color: #555; cursor: default; pointer-events: none; } /* Checkbox for (de)selecting autoleveling */ .bbcheckbox { position: relative; display: inline; } .bbcheckbox label { width: 20px; height: 20px; cursor: pointer; position: absolute; top: 0; left: 0; background: black; border-width: 1px; border-color: white; border-style: solid; } .bbcheckbox label:after { content: ''; width: 9px; height: 5px; position: absolute; top: 5px; left: 5px; border: 3px solid white; border-top: none; border-right: none; opacity: 0; transform: rotate(-45deg); } .bbcheckbox input[type=checkbox] { margin: 3px; visibility: hidden; } .bbcheckbox input[type=checkbox]:checked + label:after { opacity: 1; } /* Bladeburner Console */ .bladeburner-console-div { display: inline-block; width: 40%; border: 1px solid #fff; overflow: auto; height: 100%; position: absolute; } .bladeburner-console-table { height: auto; overflow: auto; table-layout: fixed; width: 100%; } .bladeburner-console-input-row { transition: height 1s; width: 100%; } .bladeburner-console-input-cell { display: flex; } .bladeburner-console-input { display: inline-block; padding: 0 !important; margin: 0 !important; border: 0; background-color: var(--my-background-color); font-size: 13px; outline: none; color: var(--my-font-color); flex: 1 1 auto; } .bladeburner-console-line { word-wrap: break-word; hyphens: auto; -webkit-hyphens: auto; -moz-hyphens: auto; } /* COLORS */ /* Attributes */ /** * Styling for the Gang mechanic UI (BitNode-2) */ #gang-container { position: fixed; padding: 6px; } #gang-container p, #gang-container pre { font-size: 15px; } #gang-container select { background-color: black; color: white; } #gang-management-subpage > p { padding: 4px; } .gang-member-info-div { background-color: #555; display: inline; float: left; width: 30%; } /** * Showing owned upgrades in the Equipment Box */ .gang-owned-upgrades-div { display: inline-block; margin-left: 6px; width: 75%; } .gang-owned-upgrade { border: 1px solid white; font-size: 12px; margin: 1px; padding: 1px; } /** * Styling for the Sleeves Management page */ /* COLORS */ /* Attributes */ .sleeve-container { border: 1px solid white; margin: 4px; width: 75%; } .sleeve-container p { font-size: 14px; } .sleeves-page-info { display: "block"; width: 75%; } .sleeve-panel { display: inline-block; margin: 0px; padding: 2px; } .sleeve-panel select { display: block; } /** * Styling for the Re-Sleeving Page */ /* COLORS */ /* Attributes */ .resleeve-container { border: 1px solid white; margin: 4px; width: 75%; } .resleeve-container p { font-size: 13px; } .resleeve-panel { display: inline-block; margin: 0px; padding: 2px; } .resleeve-aug-selector { font-size: 13px; } .resleeve-aug-selector option { font-size: 13px; } /* required LIB STYLES */ /* .Treant se automatski dodaje na svaki chart conatiner */ .Treant { position: relative; overflow: hidden; padding: 0 !important; } .Treant > .node, .Treant > .pseudo { position: absolute; display: block; visibility: hidden; } .Treant.Treant-loaded .node, .Treant.Treant-loaded .pseudo { visibility: visible; } .Treant > .pseudo { width: 0; height: 0; border: none; padding: 0; } .Treant .collapse-switch { width: 3px; height: 3px; display: block; border: 1px solid black; position: absolute; top: 1px; right: 1px; cursor: pointer; } .Treant .collapsed .collapse-switch { background-color: #868DEE; } .Treant > .node img { border: none; float: left; } .Treant > .node { cursor: pointer; padding: 4px; min-width: 60px; text-align: center; border: 2px solid #E8E8E3; border-radius: 2px; box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.5); font-size: 12px; } .Treant > .researched { background-color: #666; font-size: 16px; } .Treant > .locked > div { color: red; pointer-events: none; } .Treant > .node > div { font-size: 12px; } .Treant > .unlocked:hover { background-color: #666; } /*! * Bootstrap Grid v4.1.2 (https://getbootstrap.com/) * Copyright 2011-2018 The Bootstrap Authors * Copyright 2011-2018 Twitter, Inc. * Licensed under MIT (https://github.com/twbs/bootstrap/blob/master/LICENSE) */ @-ms-viewport { width: device-width; } html { -webkit-box-sizing: border-box; box-sizing: border-box; -ms-overflow-style: scrollbar; } *, *::before, *::after { -webkit-box-sizing: inherit; box-sizing: inherit; } .container { width: 100%; padding-right: 15px; padding-left: 15px; margin-right: auto; margin-left: auto; } @media (min-width: 576px) { .container { max-width: 540px; } } @media (min-width: 768px) { .container { max-width: 720px; } } @media (min-width: 992px) { .container { max-width: 960px; } } @media (min-width: 1200px) { .container { max-width: 1140px; } } .container-fluid { width: 100%; padding-right: 15px; padding-left: 15px; margin-right: auto; margin-left: auto; } .row { display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; margin-right: -15px; margin-left: -15px; } .no-gutters { margin-right: 0; margin-left: 0; } .no-gutters > .col, .no-gutters > [class*="col-"] { padding-right: 0; padding-left: 0; } .col-1, .col-2, .col-3, .col-4, .col-5, .col-6, .col-7, .col-8, .col-9, .col-10, .col-11, .col-12, .col, .col-auto, .col-sm-1, .col-sm-2, .col-sm-3, .col-sm-4, .col-sm-5, .col-sm-6, .col-sm-7, .col-sm-8, .col-sm-9, .col-sm-10, .col-sm-11, .col-sm-12, .col-sm, .col-sm-auto, .col-md-1, .col-md-2, .col-md-3, .col-md-4, .col-md-5, .col-md-6, .col-md-7, .col-md-8, .col-md-9, .col-md-10, .col-md-11, .col-md-12, .col-md, .col-md-auto, .col-lg-1, .col-lg-2, .col-lg-3, .col-lg-4, .col-lg-5, .col-lg-6, .col-lg-7, .col-lg-8, .col-lg-9, .col-lg-10, .col-lg-11, .col-lg-12, .col-lg, .col-lg-auto, .col-xl-1, .col-xl-2, .col-xl-3, .col-xl-4, .col-xl-5, .col-xl-6, .col-xl-7, .col-xl-8, .col-xl-9, .col-xl-10, .col-xl-11, .col-xl-12, .col-xl, .col-xl-auto { position: relative; width: 100%; min-height: 1px; padding-right: 15px; padding-left: 15px; } .col { -ms-flex-preferred-size: 0; flex-basis: 0; -webkit-box-flex: 1; -ms-flex-positive: 1; flex-grow: 1; max-width: 100%; } .col-auto { -webkit-box-flex: 0; -ms-flex: 0 0 auto; flex: 0 0 auto; width: auto; max-width: none; } .col-1 { -webkit-box-flex: 0; -ms-flex: 0 0 8.3333333333%; flex: 0 0 8.3333333333%; max-width: 8.3333333333%; } .col-2 { -webkit-box-flex: 0; -ms-flex: 0 0 16.6666666667%; flex: 0 0 16.6666666667%; max-width: 16.6666666667%; } .col-3 { -webkit-box-flex: 0; -ms-flex: 0 0 25%; flex: 0 0 25%; max-width: 25%; } .col-4 { -webkit-box-flex: 0; -ms-flex: 0 0 33.3333333333%; flex: 0 0 33.3333333333%; max-width: 33.3333333333%; } .col-5 { -webkit-box-flex: 0; -ms-flex: 0 0 41.6666666667%; flex: 0 0 41.6666666667%; max-width: 41.6666666667%; } .col-6 { -webkit-box-flex: 0; -ms-flex: 0 0 50%; flex: 0 0 50%; max-width: 50%; } .col-7 { -webkit-box-flex: 0; -ms-flex: 0 0 58.3333333333%; flex: 0 0 58.3333333333%; max-width: 58.3333333333%; } .col-8 { -webkit-box-flex: 0; -ms-flex: 0 0 66.6666666667%; flex: 0 0 66.6666666667%; max-width: 66.6666666667%; } .col-9 { -webkit-box-flex: 0; -ms-flex: 0 0 75%; flex: 0 0 75%; max-width: 75%; } .col-10 { -webkit-box-flex: 0; -ms-flex: 0 0 83.3333333333%; flex: 0 0 83.3333333333%; max-width: 83.3333333333%; } .col-11 { -webkit-box-flex: 0; -ms-flex: 0 0 91.6666666667%; flex: 0 0 91.6666666667%; max-width: 91.6666666667%; } .col-12 { -webkit-box-flex: 0; -ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%; } .order-first { -webkit-box-ordinal-group: 0; -ms-flex-order: -1; order: -1; } .order-last { -webkit-box-ordinal-group: 14; -ms-flex-order: 13; order: 13; } .order-0 { -webkit-box-ordinal-group: 1; -ms-flex-order: 0; order: 0; } .order-1 { -webkit-box-ordinal-group: 2; -ms-flex-order: 1; order: 1; } .order-2 { -webkit-box-ordinal-group: 3; -ms-flex-order: 2; order: 2; } .order-3 { -webkit-box-ordinal-group: 4; -ms-flex-order: 3; order: 3; } .order-4 { -webkit-box-ordinal-group: 5; -ms-flex-order: 4; order: 4; } .order-5 { -webkit-box-ordinal-group: 6; -ms-flex-order: 5; order: 5; } .order-6 { -webkit-box-ordinal-group: 7; -ms-flex-order: 6; order: 6; } .order-7 { -webkit-box-ordinal-group: 8; -ms-flex-order: 7; order: 7; } .order-8 { -webkit-box-ordinal-group: 9; -ms-flex-order: 8; order: 8; } .order-9 { -webkit-box-ordinal-group: 10; -ms-flex-order: 9; order: 9; } .order-10 { -webkit-box-ordinal-group: 11; -ms-flex-order: 10; order: 10; } .order-11 { -webkit-box-ordinal-group: 12; -ms-flex-order: 11; order: 11; } .order-12 { -webkit-box-ordinal-group: 13; -ms-flex-order: 12; order: 12; } .offset-1 { margin-left: 8.3333333333%; } .offset-2 { margin-left: 16.6666666667%; } .offset-3 { margin-left: 25%; } .offset-4 { margin-left: 33.3333333333%; } .offset-5 { margin-left: 41.6666666667%; } .offset-6 { margin-left: 50%; } .offset-7 { margin-left: 58.3333333333%; } .offset-8 { margin-left: 66.6666666667%; } .offset-9 { margin-left: 75%; } .offset-10 { margin-left: 83.3333333333%; } .offset-11 { margin-left: 91.6666666667%; } @media (min-width: 576px) { .col-sm { -ms-flex-preferred-size: 0; flex-basis: 0; -webkit-box-flex: 1; -ms-flex-positive: 1; flex-grow: 1; max-width: 100%; } .col-sm-auto { -webkit-box-flex: 0; -ms-flex: 0 0 auto; flex: 0 0 auto; width: auto; max-width: none; } .col-sm-1 { -webkit-box-flex: 0; -ms-flex: 0 0 8.3333333333%; flex: 0 0 8.3333333333%; max-width: 8.3333333333%; } .col-sm-2 { -webkit-box-flex: 0; -ms-flex: 0 0 16.6666666667%; flex: 0 0 16.6666666667%; max-width: 16.6666666667%; } .col-sm-3 { -webkit-box-flex: 0; -ms-flex: 0 0 25%; flex: 0 0 25%; max-width: 25%; } .col-sm-4 { -webkit-box-flex: 0; -ms-flex: 0 0 33.3333333333%; flex: 0 0 33.3333333333%; max-width: 33.3333333333%; } .col-sm-5 { -webkit-box-flex: 0; -ms-flex: 0 0 41.6666666667%; flex: 0 0 41.6666666667%; max-width: 41.6666666667%; } .col-sm-6 { -webkit-box-flex: 0; -ms-flex: 0 0 50%; flex: 0 0 50%; max-width: 50%; } .col-sm-7 { -webkit-box-flex: 0; -ms-flex: 0 0 58.3333333333%; flex: 0 0 58.3333333333%; max-width: 58.3333333333%; } .col-sm-8 { -webkit-box-flex: 0; -ms-flex: 0 0 66.6666666667%; flex: 0 0 66.6666666667%; max-width: 66.6666666667%; } .col-sm-9 { -webkit-box-flex: 0; -ms-flex: 0 0 75%; flex: 0 0 75%; max-width: 75%; } .col-sm-10 { -webkit-box-flex: 0; -ms-flex: 0 0 83.3333333333%; flex: 0 0 83.3333333333%; max-width: 83.3333333333%; } .col-sm-11 { -webkit-box-flex: 0; -ms-flex: 0 0 91.6666666667%; flex: 0 0 91.6666666667%; max-width: 91.6666666667%; } .col-sm-12 { -webkit-box-flex: 0; -ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%; } .order-sm-first { -webkit-box-ordinal-group: 0; -ms-flex-order: -1; order: -1; } .order-sm-last { -webkit-box-ordinal-group: 14; -ms-flex-order: 13; order: 13; } .order-sm-0 { -webkit-box-ordinal-group: 1; -ms-flex-order: 0; order: 0; } .order-sm-1 { -webkit-box-ordinal-group: 2; -ms-flex-order: 1; order: 1; } .order-sm-2 { -webkit-box-ordinal-group: 3; -ms-flex-order: 2; order: 2; } .order-sm-3 { -webkit-box-ordinal-group: 4; -ms-flex-order: 3; order: 3; } .order-sm-4 { -webkit-box-ordinal-group: 5; -ms-flex-order: 4; order: 4; } .order-sm-5 { -webkit-box-ordinal-group: 6; -ms-flex-order: 5; order: 5; } .order-sm-6 { -webkit-box-ordinal-group: 7; -ms-flex-order: 6; order: 6; } .order-sm-7 { -webkit-box-ordinal-group: 8; -ms-flex-order: 7; order: 7; } .order-sm-8 { -webkit-box-ordinal-group: 9; -ms-flex-order: 8; order: 8; } .order-sm-9 { -webkit-box-ordinal-group: 10; -ms-flex-order: 9; order: 9; } .order-sm-10 { -webkit-box-ordinal-group: 11; -ms-flex-order: 10; order: 10; } .order-sm-11 { -webkit-box-ordinal-group: 12; -ms-flex-order: 11; order: 11; } .order-sm-12 { -webkit-box-ordinal-group: 13; -ms-flex-order: 12; order: 12; } .offset-sm-0 { margin-left: 0; } .offset-sm-1 { margin-left: 8.3333333333%; } .offset-sm-2 { margin-left: 16.6666666667%; } .offset-sm-3 { margin-left: 25%; } .offset-sm-4 { margin-left: 33.3333333333%; } .offset-sm-5 { margin-left: 41.6666666667%; } .offset-sm-6 { margin-left: 50%; } .offset-sm-7 { margin-left: 58.3333333333%; } .offset-sm-8 { margin-left: 66.6666666667%; } .offset-sm-9 { margin-left: 75%; } .offset-sm-10 { margin-left: 83.3333333333%; } .offset-sm-11 { margin-left: 91.6666666667%; } } @media (min-width: 768px) { .col-md { -ms-flex-preferred-size: 0; flex-basis: 0; -webkit-box-flex: 1; -ms-flex-positive: 1; flex-grow: 1; max-width: 100%; } .col-md-auto { -webkit-box-flex: 0; -ms-flex: 0 0 auto; flex: 0 0 auto; width: auto; max-width: none; } .col-md-1 { -webkit-box-flex: 0; -ms-flex: 0 0 8.3333333333%; flex: 0 0 8.3333333333%; max-width: 8.3333333333%; } .col-md-2 { -webkit-box-flex: 0; -ms-flex: 0 0 16.6666666667%; flex: 0 0 16.6666666667%; max-width: 16.6666666667%; } .col-md-3 { -webkit-box-flex: 0; -ms-flex: 0 0 25%; flex: 0 0 25%; max-width: 25%; } .col-md-4 { -webkit-box-flex: 0; -ms-flex: 0 0 33.3333333333%; flex: 0 0 33.3333333333%; max-width: 33.3333333333%; } .col-md-5 { -webkit-box-flex: 0; -ms-flex: 0 0 41.6666666667%; flex: 0 0 41.6666666667%; max-width: 41.6666666667%; } .col-md-6 { -webkit-box-flex: 0; -ms-flex: 0 0 50%; flex: 0 0 50%; max-width: 50%; } .col-md-7 { -webkit-box-flex: 0; -ms-flex: 0 0 58.3333333333%; flex: 0 0 58.3333333333%; max-width: 58.3333333333%; } .col-md-8 { -webkit-box-flex: 0; -ms-flex: 0 0 66.6666666667%; flex: 0 0 66.6666666667%; max-width: 66.6666666667%; } .col-md-9 { -webkit-box-flex: 0; -ms-flex: 0 0 75%; flex: 0 0 75%; max-width: 75%; } .col-md-10 { -webkit-box-flex: 0; -ms-flex: 0 0 83.3333333333%; flex: 0 0 83.3333333333%; max-width: 83.3333333333%; } .col-md-11 { -webkit-box-flex: 0; -ms-flex: 0 0 91.6666666667%; flex: 0 0 91.6666666667%; max-width: 91.6666666667%; } .col-md-12 { -webkit-box-flex: 0; -ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%; } .order-md-first { -webkit-box-ordinal-group: 0; -ms-flex-order: -1; order: -1; } .order-md-last { -webkit-box-ordinal-group: 14; -ms-flex-order: 13; order: 13; } .order-md-0 { -webkit-box-ordinal-group: 1; -ms-flex-order: 0; order: 0; } .order-md-1 { -webkit-box-ordinal-group: 2; -ms-flex-order: 1; order: 1; } .order-md-2 { -webkit-box-ordinal-group: 3; -ms-flex-order: 2; order: 2; } .order-md-3 { -webkit-box-ordinal-group: 4; -ms-flex-order: 3; order: 3; } .order-md-4 { -webkit-box-ordinal-group: 5; -ms-flex-order: 4; order: 4; } .order-md-5 { -webkit-box-ordinal-group: 6; -ms-flex-order: 5; order: 5; } .order-md-6 { -webkit-box-ordinal-group: 7; -ms-flex-order: 6; order: 6; } .order-md-7 { -webkit-box-ordinal-group: 8; -ms-flex-order: 7; order: 7; } .order-md-8 { -webkit-box-ordinal-group: 9; -ms-flex-order: 8; order: 8; } .order-md-9 { -webkit-box-ordinal-group: 10; -ms-flex-order: 9; order: 9; } .order-md-10 { -webkit-box-ordinal-group: 11; -ms-flex-order: 10; order: 10; } .order-md-11 { -webkit-box-ordinal-group: 12; -ms-flex-order: 11; order: 11; } .order-md-12 { -webkit-box-ordinal-group: 13; -ms-flex-order: 12; order: 12; } .offset-md-0 { margin-left: 0; } .offset-md-1 { margin-left: 8.3333333333%; } .offset-md-2 { margin-left: 16.6666666667%; } .offset-md-3 { margin-left: 25%; } .offset-md-4 { margin-left: 33.3333333333%; } .offset-md-5 { margin-left: 41.6666666667%; } .offset-md-6 { margin-left: 50%; } .offset-md-7 { margin-left: 58.3333333333%; } .offset-md-8 { margin-left: 66.6666666667%; } .offset-md-9 { margin-left: 75%; } .offset-md-10 { margin-left: 83.3333333333%; } .offset-md-11 { margin-left: 91.6666666667%; } } @media (min-width: 992px) { .col-lg { -ms-flex-preferred-size: 0; flex-basis: 0; -webkit-box-flex: 1; -ms-flex-positive: 1; flex-grow: 1; max-width: 100%; } .col-lg-auto { -webkit-box-flex: 0; -ms-flex: 0 0 auto; flex: 0 0 auto; width: auto; max-width: none; } .col-lg-1 { -webkit-box-flex: 0; -ms-flex: 0 0 8.3333333333%; flex: 0 0 8.3333333333%; max-width: 8.3333333333%; } .col-lg-2 { -webkit-box-flex: 0; -ms-flex: 0 0 16.6666666667%; flex: 0 0 16.6666666667%; max-width: 16.6666666667%; } .col-lg-3 { -webkit-box-flex: 0; -ms-flex: 0 0 25%; flex: 0 0 25%; max-width: 25%; } .col-lg-4 { -webkit-box-flex: 0; -ms-flex: 0 0 33.3333333333%; flex: 0 0 33.3333333333%; max-width: 33.3333333333%; } .col-lg-5 { -webkit-box-flex: 0; -ms-flex: 0 0 41.6666666667%; flex: 0 0 41.6666666667%; max-width: 41.6666666667%; } .col-lg-6 { -webkit-box-flex: 0; -ms-flex: 0 0 50%; flex: 0 0 50%; max-width: 50%; } .col-lg-7 { -webkit-box-flex: 0; -ms-flex: 0 0 58.3333333333%; flex: 0 0 58.3333333333%; max-width: 58.3333333333%; } .col-lg-8 { -webkit-box-flex: 0; -ms-flex: 0 0 66.6666666667%; flex: 0 0 66.6666666667%; max-width: 66.6666666667%; } .col-lg-9 { -webkit-box-flex: 0; -ms-flex: 0 0 75%; flex: 0 0 75%; max-width: 75%; } .col-lg-10 { -webkit-box-flex: 0; -ms-flex: 0 0 83.3333333333%; flex: 0 0 83.3333333333%; max-width: 83.3333333333%; } .col-lg-11 { -webkit-box-flex: 0; -ms-flex: 0 0 91.6666666667%; flex: 0 0 91.6666666667%; max-width: 91.6666666667%; } .col-lg-12 { -webkit-box-flex: 0; -ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%; } .order-lg-first { -webkit-box-ordinal-group: 0; -ms-flex-order: -1; order: -1; } .order-lg-last { -webkit-box-ordinal-group: 14; -ms-flex-order: 13; order: 13; } .order-lg-0 { -webkit-box-ordinal-group: 1; -ms-flex-order: 0; order: 0; } .order-lg-1 { -webkit-box-ordinal-group: 2; -ms-flex-order: 1; order: 1; } .order-lg-2 { -webkit-box-ordinal-group: 3; -ms-flex-order: 2; order: 2; } .order-lg-3 { -webkit-box-ordinal-group: 4; -ms-flex-order: 3; order: 3; } .order-lg-4 { -webkit-box-ordinal-group: 5; -ms-flex-order: 4; order: 4; } .order-lg-5 { -webkit-box-ordinal-group: 6; -ms-flex-order: 5; order: 5; } .order-lg-6 { -webkit-box-ordinal-group: 7; -ms-flex-order: 6; order: 6; } .order-lg-7 { -webkit-box-ordinal-group: 8; -ms-flex-order: 7; order: 7; } .order-lg-8 { -webkit-box-ordinal-group: 9; -ms-flex-order: 8; order: 8; } .order-lg-9 { -webkit-box-ordinal-group: 10; -ms-flex-order: 9; order: 9; } .order-lg-10 { -webkit-box-ordinal-group: 11; -ms-flex-order: 10; order: 10; } .order-lg-11 { -webkit-box-ordinal-group: 12; -ms-flex-order: 11; order: 11; } .order-lg-12 { -webkit-box-ordinal-group: 13; -ms-flex-order: 12; order: 12; } .offset-lg-0 { margin-left: 0; } .offset-lg-1 { margin-left: 8.3333333333%; } .offset-lg-2 { margin-left: 16.6666666667%; } .offset-lg-3 { margin-left: 25%; } .offset-lg-4 { margin-left: 33.3333333333%; } .offset-lg-5 { margin-left: 41.6666666667%; } .offset-lg-6 { margin-left: 50%; } .offset-lg-7 { margin-left: 58.3333333333%; } .offset-lg-8 { margin-left: 66.6666666667%; } .offset-lg-9 { margin-left: 75%; } .offset-lg-10 { margin-left: 83.3333333333%; } .offset-lg-11 { margin-left: 91.6666666667%; } } @media (min-width: 1200px) { .col-xl { -ms-flex-preferred-size: 0; flex-basis: 0; -webkit-box-flex: 1; -ms-flex-positive: 1; flex-grow: 1; max-width: 100%; } .col-xl-auto { -webkit-box-flex: 0; -ms-flex: 0 0 auto; flex: 0 0 auto; width: auto; max-width: none; } .col-xl-1 { -webkit-box-flex: 0; -ms-flex: 0 0 8.3333333333%; flex: 0 0 8.3333333333%; max-width: 8.3333333333%; } .col-xl-2 { -webkit-box-flex: 0; -ms-flex: 0 0 16.6666666667%; flex: 0 0 16.6666666667%; max-width: 16.6666666667%; } .col-xl-3 { -webkit-box-flex: 0; -ms-flex: 0 0 25%; flex: 0 0 25%; max-width: 25%; } .col-xl-4 { -webkit-box-flex: 0; -ms-flex: 0 0 33.3333333333%; flex: 0 0 33.3333333333%; max-width: 33.3333333333%; } .col-xl-5 { -webkit-box-flex: 0; -ms-flex: 0 0 41.6666666667%; flex: 0 0 41.6666666667%; max-width: 41.6666666667%; } .col-xl-6 { -webkit-box-flex: 0; -ms-flex: 0 0 50%; flex: 0 0 50%; max-width: 50%; } .col-xl-7 { -webkit-box-flex: 0; -ms-flex: 0 0 58.3333333333%; flex: 0 0 58.3333333333%; max-width: 58.3333333333%; } .col-xl-8 { -webkit-box-flex: 0; -ms-flex: 0 0 66.6666666667%; flex: 0 0 66.6666666667%; max-width: 66.6666666667%; } .col-xl-9 { -webkit-box-flex: 0; -ms-flex: 0 0 75%; flex: 0 0 75%; max-width: 75%; } .col-xl-10 { -webkit-box-flex: 0; -ms-flex: 0 0 83.3333333333%; flex: 0 0 83.3333333333%; max-width: 83.3333333333%; } .col-xl-11 { -webkit-box-flex: 0; -ms-flex: 0 0 91.6666666667%; flex: 0 0 91.6666666667%; max-width: 91.6666666667%; } .col-xl-12 { -webkit-box-flex: 0; -ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%; } .order-xl-first { -webkit-box-ordinal-group: 0; -ms-flex-order: -1; order: -1; } .order-xl-last { -webkit-box-ordinal-group: 14; -ms-flex-order: 13; order: 13; } .order-xl-0 { -webkit-box-ordinal-group: 1; -ms-flex-order: 0; order: 0; } .order-xl-1 { -webkit-box-ordinal-group: 2; -ms-flex-order: 1; order: 1; } .order-xl-2 { -webkit-box-ordinal-group: 3; -ms-flex-order: 2; order: 2; } .order-xl-3 { -webkit-box-ordinal-group: 4; -ms-flex-order: 3; order: 3; } .order-xl-4 { -webkit-box-ordinal-group: 5; -ms-flex-order: 4; order: 4; } .order-xl-5 { -webkit-box-ordinal-group: 6; -ms-flex-order: 5; order: 5; } .order-xl-6 { -webkit-box-ordinal-group: 7; -ms-flex-order: 6; order: 6; } .order-xl-7 { -webkit-box-ordinal-group: 8; -ms-flex-order: 7; order: 7; } .order-xl-8 { -webkit-box-ordinal-group: 9; -ms-flex-order: 8; order: 8; } .order-xl-9 { -webkit-box-ordinal-group: 10; -ms-flex-order: 9; order: 9; } .order-xl-10 { -webkit-box-ordinal-group: 11; -ms-flex-order: 10; order: 10; } .order-xl-11 { -webkit-box-ordinal-group: 12; -ms-flex-order: 11; order: 11; } .order-xl-12 { -webkit-box-ordinal-group: 13; -ms-flex-order: 12; order: 12; } .offset-xl-0 { margin-left: 0; } .offset-xl-1 { margin-left: 8.3333333333%; } .offset-xl-2 { margin-left: 16.6666666667%; } .offset-xl-3 { margin-left: 25%; } .offset-xl-4 { margin-left: 33.3333333333%; } .offset-xl-5 { margin-left: 41.6666666667%; } .offset-xl-6 { margin-left: 50%; } .offset-xl-7 { margin-left: 58.3333333333%; } .offset-xl-8 { margin-left: 66.6666666667%; } .offset-xl-9 { margin-left: 75%; } .offset-xl-10 { margin-left: 83.3333333333%; } .offset-xl-11 { margin-left: 91.6666666667%; } } .d-none { display: none !important; } .d-inline { display: inline !important; } .d-inline-block { display: inline-block !important; } .d-block { display: block !important; } .d-table { display: table !important; } .d-table-row { display: table-row !important; } .d-table-cell { display: table-cell !important; } .d-flex { display: -webkit-box !important; display: -ms-flexbox !important; display: flex !important; } .d-inline-flex { display: -webkit-inline-box !important; display: -ms-inline-flexbox !important; display: inline-flex !important; } @media (min-width: 576px) { .d-sm-none { display: none !important; } .d-sm-inline { display: inline !important; } .d-sm-inline-block { display: inline-block !important; } .d-sm-block { display: block !important; } .d-sm-table { display: table !important; } .d-sm-table-row { display: table-row !important; } .d-sm-table-cell { display: table-cell !important; } .d-sm-flex { display: -webkit-box !important; display: -ms-flexbox !important; display: flex !important; } .d-sm-inline-flex { display: -webkit-inline-box !important; display: -ms-inline-flexbox !important; display: inline-flex !important; } } @media (min-width: 768px) { .d-md-none { display: none !important; } .d-md-inline { display: inline !important; } .d-md-inline-block { display: inline-block !important; } .d-md-block { display: block !important; } .d-md-table { display: table !important; } .d-md-table-row { display: table-row !important; } .d-md-table-cell { display: table-cell !important; } .d-md-flex { display: -webkit-box !important; display: -ms-flexbox !important; display: flex !important; } .d-md-inline-flex { display: -webkit-inline-box !important; display: -ms-inline-flexbox !important; display: inline-flex !important; } } @media (min-width: 992px) { .d-lg-none { display: none !important; } .d-lg-inline { display: inline !important; } .d-lg-inline-block { display: inline-block !important; } .d-lg-block { display: block !important; } .d-lg-table { display: table !important; } .d-lg-table-row { display: table-row !important; } .d-lg-table-cell { display: table-cell !important; } .d-lg-flex { display: -webkit-box !important; display: -ms-flexbox !important; display: flex !important; } .d-lg-inline-flex { display: -webkit-inline-box !important; display: -ms-inline-flexbox !important; display: inline-flex !important; } } @media (min-width: 1200px) { .d-xl-none { display: none !important; } .d-xl-inline { display: inline !important; } .d-xl-inline-block { display: inline-block !important; } .d-xl-block { display: block !important; } .d-xl-table { display: table !important; } .d-xl-table-row { display: table-row !important; } .d-xl-table-cell { display: table-cell !important; } .d-xl-flex { display: -webkit-box !important; display: -ms-flexbox !important; display: flex !important; } .d-xl-inline-flex { display: -webkit-inline-box !important; display: -ms-inline-flexbox !important; display: inline-flex !important; } } @media print { .d-print-none { display: none !important; } .d-print-inline { display: inline !important; } .d-print-inline-block { display: inline-block !important; } .d-print-block { display: block !important; } .d-print-table { display: table !important; } .d-print-table-row { display: table-row !important; } .d-print-table-cell { display: table-cell !important; } .d-print-flex { display: -webkit-box !important; display: -ms-flexbox !important; display: flex !important; } .d-print-inline-flex { display: -webkit-inline-box !important; display: -ms-inline-flexbox !important; display: inline-flex !important; } } .flex-row { -webkit-box-orient: horizontal !important; -webkit-box-direction: normal !important; -ms-flex-direction: row !important; flex-direction: row !important; } .flex-column { -webkit-box-orient: vertical !important; -webkit-box-direction: normal !important; -ms-flex-direction: column !important; flex-direction: column !important; } .flex-row-reverse { -webkit-box-orient: horizontal !important; -webkit-box-direction: reverse !important; -ms-flex-direction: row-reverse !important; flex-direction: row-reverse !important; } .flex-column-reverse { -webkit-box-orient: vertical !important; -webkit-box-direction: reverse !important; -ms-flex-direction: column-reverse !important; flex-direction: column-reverse !important; } .flex-wrap { -ms-flex-wrap: wrap !important; flex-wrap: wrap !important; } .flex-nowrap { -ms-flex-wrap: nowrap !important; flex-wrap: nowrap !important; } .flex-wrap-reverse { -ms-flex-wrap: wrap-reverse !important; flex-wrap: wrap-reverse !important; } .flex-fill { -webkit-box-flex: 1 !important; -ms-flex: 1 1 auto !important; flex: 1 1 auto !important; } .flex-grow-0 { -webkit-box-flex: 0 !important; -ms-flex-positive: 0 !important; flex-grow: 0 !important; } .flex-grow-1 { -webkit-box-flex: 1 !important; -ms-flex-positive: 1 !important; flex-grow: 1 !important; } .flex-shrink-0 { -ms-flex-negative: 0 !important; flex-shrink: 0 !important; } .flex-shrink-1 { -ms-flex-negative: 1 !important; flex-shrink: 1 !important; } .justify-content-start { -webkit-box-pack: start !important; -ms-flex-pack: start !important; justify-content: flex-start !important; } .justify-content-end { -webkit-box-pack: end !important; -ms-flex-pack: end !important; justify-content: flex-end !important; } .justify-content-center { -webkit-box-pack: center !important; -ms-flex-pack: center !important; justify-content: center !important; } .justify-content-between { -webkit-box-pack: justify !important; -ms-flex-pack: justify !important; justify-content: space-between !important; } .justify-content-around { -ms-flex-pack: distribute !important; justify-content: space-around !important; } .align-items-start { -webkit-box-align: start !important; -ms-flex-align: start !important; align-items: flex-start !important; } .align-items-end { -webkit-box-align: end !important; -ms-flex-align: end !important; align-items: flex-end !important; } .align-items-center { -webkit-box-align: center !important; -ms-flex-align: center !important; align-items: center !important; } .align-items-baseline { -webkit-box-align: baseline !important; -ms-flex-align: baseline !important; align-items: baseline !important; } .align-items-stretch { -webkit-box-align: stretch !important; -ms-flex-align: stretch !important; align-items: stretch !important; } .align-content-start { -ms-flex-line-pack: start !important; align-content: flex-start !important; } .align-content-end { -ms-flex-line-pack: end !important; align-content: flex-end !important; } .align-content-center { -ms-flex-line-pack: center !important; align-content: center !important; } .align-content-between { -ms-flex-line-pack: justify !important; align-content: space-between !important; } .align-content-around { -ms-flex-line-pack: distribute !important; align-content: space-around !important; } .align-content-stretch { -ms-flex-line-pack: stretch !important; align-content: stretch !important; } .align-self-auto { -ms-flex-item-align: auto !important; align-self: auto !important; } .align-self-start { -ms-flex-item-align: start !important; align-self: flex-start !important; } .align-self-end { -ms-flex-item-align: end !important; align-self: flex-end !important; } .align-self-center { -ms-flex-item-align: center !important; align-self: center !important; } .align-self-baseline { -ms-flex-item-align: baseline !important; align-self: baseline !important; } .align-self-stretch { -ms-flex-item-align: stretch !important; align-self: stretch !important; } @media (min-width: 576px) { .flex-sm-row { -webkit-box-orient: horizontal !important; -webkit-box-direction: normal !important; -ms-flex-direction: row !important; flex-direction: row !important; } .flex-sm-column { -webkit-box-orient: vertical !important; -webkit-box-direction: normal !important; -ms-flex-direction: column !important; flex-direction: column !important; } .flex-sm-row-reverse { -webkit-box-orient: horizontal !important; -webkit-box-direction: reverse !important; -ms-flex-direction: row-reverse !important; flex-direction: row-reverse !important; } .flex-sm-column-reverse { -webkit-box-orient: vertical !important; -webkit-box-direction: reverse !important; -ms-flex-direction: column-reverse !important; flex-direction: column-reverse !important; } .flex-sm-wrap { -ms-flex-wrap: wrap !important; flex-wrap: wrap !important; } .flex-sm-nowrap { -ms-flex-wrap: nowrap !important; flex-wrap: nowrap !important; } .flex-sm-wrap-reverse { -ms-flex-wrap: wrap-reverse !important; flex-wrap: wrap-reverse !important; } .flex-sm-fill { -webkit-box-flex: 1 !important; -ms-flex: 1 1 auto !important; flex: 1 1 auto !important; } .flex-sm-grow-0 { -webkit-box-flex: 0 !important; -ms-flex-positive: 0 !important; flex-grow: 0 !important; } .flex-sm-grow-1 { -webkit-box-flex: 1 !important; -ms-flex-positive: 1 !important; flex-grow: 1 !important; } .flex-sm-shrink-0 { -ms-flex-negative: 0 !important; flex-shrink: 0 !important; } .flex-sm-shrink-1 { -ms-flex-negative: 1 !important; flex-shrink: 1 !important; } .justify-content-sm-start { -webkit-box-pack: start !important; -ms-flex-pack: start !important; justify-content: flex-start !important; } .justify-content-sm-end { -webkit-box-pack: end !important; -ms-flex-pack: end !important; justify-content: flex-end !important; } .justify-content-sm-center { -webkit-box-pack: center !important; -ms-flex-pack: center !important; justify-content: center !important; } .justify-content-sm-between { -webkit-box-pack: justify !important; -ms-flex-pack: justify !important; justify-content: space-between !important; } .justify-content-sm-around { -ms-flex-pack: distribute !important; justify-content: space-around !important; } .align-items-sm-start { -webkit-box-align: start !important; -ms-flex-align: start !important; align-items: flex-start !important; } .align-items-sm-end { -webkit-box-align: end !important; -ms-flex-align: end !important; align-items: flex-end !important; } .align-items-sm-center { -webkit-box-align: center !important; -ms-flex-align: center !important; align-items: center !important; } .align-items-sm-baseline { -webkit-box-align: baseline !important; -ms-flex-align: baseline !important; align-items: baseline !important; } .align-items-sm-stretch { -webkit-box-align: stretch !important; -ms-flex-align: stretch !important; align-items: stretch !important; } .align-content-sm-start { -ms-flex-line-pack: start !important; align-content: flex-start !important; } .align-content-sm-end { -ms-flex-line-pack: end !important; align-content: flex-end !important; } .align-content-sm-center { -ms-flex-line-pack: center !important; align-content: center !important; } .align-content-sm-between { -ms-flex-line-pack: justify !important; align-content: space-between !important; } .align-content-sm-around { -ms-flex-line-pack: distribute !important; align-content: space-around !important; } .align-content-sm-stretch { -ms-flex-line-pack: stretch !important; align-content: stretch !important; } .align-self-sm-auto { -ms-flex-item-align: auto !important; align-self: auto !important; } .align-self-sm-start { -ms-flex-item-align: start !important; align-self: flex-start !important; } .align-self-sm-end { -ms-flex-item-align: end !important; align-self: flex-end !important; } .align-self-sm-center { -ms-flex-item-align: center !important; align-self: center !important; } .align-self-sm-baseline { -ms-flex-item-align: baseline !important; align-self: baseline !important; } .align-self-sm-stretch { -ms-flex-item-align: stretch !important; align-self: stretch !important; } } @media (min-width: 768px) { .flex-md-row { -webkit-box-orient: horizontal !important; -webkit-box-direction: normal !important; -ms-flex-direction: row !important; flex-direction: row !important; } .flex-md-column { -webkit-box-orient: vertical !important; -webkit-box-direction: normal !important; -ms-flex-direction: column !important; flex-direction: column !important; } .flex-md-row-reverse { -webkit-box-orient: horizontal !important; -webkit-box-direction: reverse !important; -ms-flex-direction: row-reverse !important; flex-direction: row-reverse !important; } .flex-md-column-reverse { -webkit-box-orient: vertical !important; -webkit-box-direction: reverse !important; -ms-flex-direction: column-reverse !important; flex-direction: column-reverse !important; } .flex-md-wrap { -ms-flex-wrap: wrap !important; flex-wrap: wrap !important; } .flex-md-nowrap { -ms-flex-wrap: nowrap !important; flex-wrap: nowrap !important; } .flex-md-wrap-reverse { -ms-flex-wrap: wrap-reverse !important; flex-wrap: wrap-reverse !important; } .flex-md-fill { -webkit-box-flex: 1 !important; -ms-flex: 1 1 auto !important; flex: 1 1 auto !important; } .flex-md-grow-0 { -webkit-box-flex: 0 !important; -ms-flex-positive: 0 !important; flex-grow: 0 !important; } .flex-md-grow-1 { -webkit-box-flex: 1 !important; -ms-flex-positive: 1 !important; flex-grow: 1 !important; } .flex-md-shrink-0 { -ms-flex-negative: 0 !important; flex-shrink: 0 !important; } .flex-md-shrink-1 { -ms-flex-negative: 1 !important; flex-shrink: 1 !important; } .justify-content-md-start { -webkit-box-pack: start !important; -ms-flex-pack: start !important; justify-content: flex-start !important; } .justify-content-md-end { -webkit-box-pack: end !important; -ms-flex-pack: end !important; justify-content: flex-end !important; } .justify-content-md-center { -webkit-box-pack: center !important; -ms-flex-pack: center !important; justify-content: center !important; } .justify-content-md-between { -webkit-box-pack: justify !important; -ms-flex-pack: justify !important; justify-content: space-between !important; } .justify-content-md-around { -ms-flex-pack: distribute !important; justify-content: space-around !important; } .align-items-md-start { -webkit-box-align: start !important; -ms-flex-align: start !important; align-items: flex-start !important; } .align-items-md-end { -webkit-box-align: end !important; -ms-flex-align: end !important; align-items: flex-end !important; } .align-items-md-center { -webkit-box-align: center !important; -ms-flex-align: center !important; align-items: center !important; } .align-items-md-baseline { -webkit-box-align: baseline !important; -ms-flex-align: baseline !important; align-items: baseline !important; } .align-items-md-stretch { -webkit-box-align: stretch !important; -ms-flex-align: stretch !important; align-items: stretch !important; } .align-content-md-start { -ms-flex-line-pack: start !important; align-content: flex-start !important; } .align-content-md-end { -ms-flex-line-pack: end !important; align-content: flex-end !important; } .align-content-md-center { -ms-flex-line-pack: center !important; align-content: center !important; } .align-content-md-between { -ms-flex-line-pack: justify !important; align-content: space-between !important; } .align-content-md-around { -ms-flex-line-pack: distribute !important; align-content: space-around !important; } .align-content-md-stretch { -ms-flex-line-pack: stretch !important; align-content: stretch !important; } .align-self-md-auto { -ms-flex-item-align: auto !important; align-self: auto !important; } .align-self-md-start { -ms-flex-item-align: start !important; align-self: flex-start !important; } .align-self-md-end { -ms-flex-item-align: end !important; align-self: flex-end !important; } .align-self-md-center { -ms-flex-item-align: center !important; align-self: center !important; } .align-self-md-baseline { -ms-flex-item-align: baseline !important; align-self: baseline !important; } .align-self-md-stretch { -ms-flex-item-align: stretch !important; align-self: stretch !important; } } @media (min-width: 992px) { .flex-lg-row { -webkit-box-orient: horizontal !important; -webkit-box-direction: normal !important; -ms-flex-direction: row !important; flex-direction: row !important; } .flex-lg-column { -webkit-box-orient: vertical !important; -webkit-box-direction: normal !important; -ms-flex-direction: column !important; flex-direction: column !important; } .flex-lg-row-reverse { -webkit-box-orient: horizontal !important; -webkit-box-direction: reverse !important; -ms-flex-direction: row-reverse !important; flex-direction: row-reverse !important; } .flex-lg-column-reverse { -webkit-box-orient: vertical !important; -webkit-box-direction: reverse !important; -ms-flex-direction: column-reverse !important; flex-direction: column-reverse !important; } .flex-lg-wrap { -ms-flex-wrap: wrap !important; flex-wrap: wrap !important; } .flex-lg-nowrap { -ms-flex-wrap: nowrap !important; flex-wrap: nowrap !important; } .flex-lg-wrap-reverse { -ms-flex-wrap: wrap-reverse !important; flex-wrap: wrap-reverse !important; } .flex-lg-fill { -webkit-box-flex: 1 !important; -ms-flex: 1 1 auto !important; flex: 1 1 auto !important; } .flex-lg-grow-0 { -webkit-box-flex: 0 !important; -ms-flex-positive: 0 !important; flex-grow: 0 !important; } .flex-lg-grow-1 { -webkit-box-flex: 1 !important; -ms-flex-positive: 1 !important; flex-grow: 1 !important; } .flex-lg-shrink-0 { -ms-flex-negative: 0 !important; flex-shrink: 0 !important; } .flex-lg-shrink-1 { -ms-flex-negative: 1 !important; flex-shrink: 1 !important; } .justify-content-lg-start { -webkit-box-pack: start !important; -ms-flex-pack: start !important; justify-content: flex-start !important; } .justify-content-lg-end { -webkit-box-pack: end !important; -ms-flex-pack: end !important; justify-content: flex-end !important; } .justify-content-lg-center { -webkit-box-pack: center !important; -ms-flex-pack: center !important; justify-content: center !important; } .justify-content-lg-between { -webkit-box-pack: justify !important; -ms-flex-pack: justify !important; justify-content: space-between !important; } .justify-content-lg-around { -ms-flex-pack: distribute !important; justify-content: space-around !important; } .align-items-lg-start { -webkit-box-align: start !important; -ms-flex-align: start !important; align-items: flex-start !important; } .align-items-lg-end { -webkit-box-align: end !important; -ms-flex-align: end !important; align-items: flex-end !important; } .align-items-lg-center { -webkit-box-align: center !important; -ms-flex-align: center !important; align-items: center !important; } .align-items-lg-baseline { -webkit-box-align: baseline !important; -ms-flex-align: baseline !important; align-items: baseline !important; } .align-items-lg-stretch { -webkit-box-align: stretch !important; -ms-flex-align: stretch !important; align-items: stretch !important; } .align-content-lg-start { -ms-flex-line-pack: start !important; align-content: flex-start !important; } .align-content-lg-end { -ms-flex-line-pack: end !important; align-content: flex-end !important; } .align-content-lg-center { -ms-flex-line-pack: center !important; align-content: center !important; } .align-content-lg-between { -ms-flex-line-pack: justify !important; align-content: space-between !important; } .align-content-lg-around { -ms-flex-line-pack: distribute !important; align-content: space-around !important; } .align-content-lg-stretch { -ms-flex-line-pack: stretch !important; align-content: stretch !important; } .align-self-lg-auto { -ms-flex-item-align: auto !important; align-self: auto !important; } .align-self-lg-start { -ms-flex-item-align: start !important; align-self: flex-start !important; } .align-self-lg-end { -ms-flex-item-align: end !important; align-self: flex-end !important; } .align-self-lg-center { -ms-flex-item-align: center !important; align-self: center !important; } .align-self-lg-baseline { -ms-flex-item-align: baseline !important; align-self: baseline !important; } .align-self-lg-stretch { -ms-flex-item-align: stretch !important; align-self: stretch !important; } } @media (min-width: 1200px) { .flex-xl-row { -webkit-box-orient: horizontal !important; -webkit-box-direction: normal !important; -ms-flex-direction: row !important; flex-direction: row !important; } .flex-xl-column { -webkit-box-orient: vertical !important; -webkit-box-direction: normal !important; -ms-flex-direction: column !important; flex-direction: column !important; } .flex-xl-row-reverse { -webkit-box-orient: horizontal !important; -webkit-box-direction: reverse !important; -ms-flex-direction: row-reverse !important; flex-direction: row-reverse !important; } .flex-xl-column-reverse { -webkit-box-orient: vertical !important; -webkit-box-direction: reverse !important; -ms-flex-direction: column-reverse !important; flex-direction: column-reverse !important; } .flex-xl-wrap { -ms-flex-wrap: wrap !important; flex-wrap: wrap !important; } .flex-xl-nowrap { -ms-flex-wrap: nowrap !important; flex-wrap: nowrap !important; } .flex-xl-wrap-reverse { -ms-flex-wrap: wrap-reverse !important; flex-wrap: wrap-reverse !important; } .flex-xl-fill { -webkit-box-flex: 1 !important; -ms-flex: 1 1 auto !important; flex: 1 1 auto !important; } .flex-xl-grow-0 { -webkit-box-flex: 0 !important; -ms-flex-positive: 0 !important; flex-grow: 0 !important; } .flex-xl-grow-1 { -webkit-box-flex: 1 !important; -ms-flex-positive: 1 !important; flex-grow: 1 !important; } .flex-xl-shrink-0 { -ms-flex-negative: 0 !important; flex-shrink: 0 !important; } .flex-xl-shrink-1 { -ms-flex-negative: 1 !important; flex-shrink: 1 !important; } .justify-content-xl-start { -webkit-box-pack: start !important; -ms-flex-pack: start !important; justify-content: flex-start !important; } .justify-content-xl-end { -webkit-box-pack: end !important; -ms-flex-pack: end !important; justify-content: flex-end !important; } .justify-content-xl-center { -webkit-box-pack: center !important; -ms-flex-pack: center !important; justify-content: center !important; } .justify-content-xl-between { -webkit-box-pack: justify !important; -ms-flex-pack: justify !important; justify-content: space-between !important; } .justify-content-xl-around { -ms-flex-pack: distribute !important; justify-content: space-around !important; } .align-items-xl-start { -webkit-box-align: start !important; -ms-flex-align: start !important; align-items: flex-start !important; } .align-items-xl-end { -webkit-box-align: end !important; -ms-flex-align: end !important; align-items: flex-end !important; } .align-items-xl-center { -webkit-box-align: center !important; -ms-flex-align: center !important; align-items: center !important; } .align-items-xl-baseline { -webkit-box-align: baseline !important; -ms-flex-align: baseline !important; align-items: baseline !important; } .align-items-xl-stretch { -webkit-box-align: stretch !important; -ms-flex-align: stretch !important; align-items: stretch !important; } .align-content-xl-start { -ms-flex-line-pack: start !important; align-content: flex-start !important; } .align-content-xl-end { -ms-flex-line-pack: end !important; align-content: flex-end !important; } .align-content-xl-center { -ms-flex-line-pack: center !important; align-content: center !important; } .align-content-xl-between { -ms-flex-line-pack: justify !important; align-content: space-between !important; } .align-content-xl-around { -ms-flex-line-pack: distribute !important; align-content: space-around !important; } .align-content-xl-stretch { -ms-flex-line-pack: stretch !important; align-content: stretch !important; } .align-self-xl-auto { -ms-flex-item-align: auto !important; align-self: auto !important; } .align-self-xl-start { -ms-flex-item-align: start !important; align-self: flex-start !important; } .align-self-xl-end { -ms-flex-item-align: end !important; align-self: flex-end !important; } .align-self-xl-center { -ms-flex-item-align: center !important; align-self: center !important; } .align-self-xl-baseline { -ms-flex-item-align: baseline !important; align-self: baseline !important; } .align-self-xl-stretch { -ms-flex-item-align: stretch !important; align-self: stretch !important; } } .w-25 { width: 25% !important; } .w-50 { width: 50% !important; } .w-75 { width: 75% !important; } .w-100 { width: 100% !important; } .w-auto { width: auto !important; } .h-25 { height: 25% !important; } .h-50 { height: 50% !important; } .h-75 { height: 75% !important; } .h-100 { height: 100% !important; } .h-auto { height: auto !important; } .mw-100 { max-width: 100% !important; } .mh-100 { max-height: 100% !important; } .m-0 { margin: 0 !important; } .mt-0, .my-0 { margin-top: 0 !important; } .mr-0, .mx-0 { margin-right: 0 !important; } .mb-0, .my-0 { margin-bottom: 0 !important; } .ml-0, .mx-0 { margin-left: 0 !important; } .m-1 { margin: .25rem !important; } .mt-1, .my-1 { margin-top: .25rem !important; } .mr-1, .mx-1 { margin-right: .25rem !important; } .mb-1, .my-1 { margin-bottom: .25rem !important; } .ml-1, .mx-1 { margin-left: .25rem !important; } .m-2 { margin: .5rem !important; } .mt-2, .my-2 { margin-top: .5rem !important; } .mr-2, .mx-2 { margin-right: .5rem !important; } .mb-2, .my-2 { margin-bottom: .5rem !important; } .ml-2, .mx-2 { margin-left: .5rem !important; } .m-3 { margin: 1rem !important; } .mt-3, .my-3 { margin-top: 1rem !important; } .mr-3, .mx-3 { margin-right: 1rem !important; } .mb-3, .my-3 { margin-bottom: 1rem !important; } .ml-3, .mx-3 { margin-left: 1rem !important; } .m-4 { margin: 1.5rem !important; } .mt-4, .my-4 { margin-top: 1.5rem !important; } .mr-4, .mx-4 { margin-right: 1.5rem !important; } .mb-4, .my-4 { margin-bottom: 1.5rem !important; } .ml-4, .mx-4 { margin-left: 1.5rem !important; } .m-5 { margin: 3rem !important; } .mt-5, .my-5 { margin-top: 3rem !important; } .mr-5, .mx-5 { margin-right: 3rem !important; } .mb-5, .my-5 { margin-bottom: 3rem !important; } .ml-5, .mx-5 { margin-left: 3rem !important; } .p-0 { padding: 0 !important; } .pt-0, .py-0 { padding-top: 0 !important; } .pr-0, .px-0 { padding-right: 0 !important; } .pb-0, .py-0 { padding-bottom: 0 !important; } .pl-0, .px-0 { padding-left: 0 !important; } .p-1 { padding: .25rem !important; } .pt-1, .py-1 { padding-top: .25rem !important; } .pr-1, .px-1 { padding-right: .25rem !important; } .pb-1, .py-1 { padding-bottom: .25rem !important; } .pl-1, .px-1 { padding-left: .25rem !important; } .p-2 { padding: .5rem !important; } .pt-2, .py-2 { padding-top: .5rem !important; } .pr-2, .px-2 { padding-right: .5rem !important; } .pb-2, .py-2 { padding-bottom: .5rem !important; } .pl-2, .px-2 { padding-left: .5rem !important; } .p-3 { padding: 1rem !important; } .pt-3, .py-3 { padding-top: 1rem !important; } .pr-3, .px-3 { padding-right: 1rem !important; } .pb-3, .py-3 { padding-bottom: 1rem !important; } .pl-3, .px-3 { padding-left: 1rem !important; } .p-4 { padding: 1.5rem !important; } .pt-4, .py-4 { padding-top: 1.5rem !important; } .pr-4, .px-4 { padding-right: 1.5rem !important; } .pb-4, .py-4 { padding-bottom: 1.5rem !important; } .pl-4, .px-4 { padding-left: 1.5rem !important; } .p-5 { padding: 3rem !important; } .pt-5, .py-5 { padding-top: 3rem !important; } .pr-5, .px-5 { padding-right: 3rem !important; } .pb-5, .py-5 { padding-bottom: 3rem !important; } .pl-5, .px-5 { padding-left: 3rem !important; } .m-auto { margin: auto !important; } .mt-auto, .my-auto { margin-top: auto !important; } .mr-auto, .mx-auto { margin-right: auto !important; } .mb-auto, .my-auto { margin-bottom: auto !important; } .ml-auto, .mx-auto { margin-left: auto !important; } @media (min-width: 576px) { .m-sm-0 { margin: 0 !important; } .mt-sm-0, .my-sm-0 { margin-top: 0 !important; } .mr-sm-0, .mx-sm-0 { margin-right: 0 !important; } .mb-sm-0, .my-sm-0 { margin-bottom: 0 !important; } .ml-sm-0, .mx-sm-0 { margin-left: 0 !important; } .m-sm-1 { margin: .25rem !important; } .mt-sm-1, .my-sm-1 { margin-top: .25rem !important; } .mr-sm-1, .mx-sm-1 { margin-right: .25rem !important; } .mb-sm-1, .my-sm-1 { margin-bottom: .25rem !important; } .ml-sm-1, .mx-sm-1 { margin-left: .25rem !important; } .m-sm-2 { margin: .5rem !important; } .mt-sm-2, .my-sm-2 { margin-top: .5rem !important; } .mr-sm-2, .mx-sm-2 { margin-right: .5rem !important; } .mb-sm-2, .my-sm-2 { margin-bottom: .5rem !important; } .ml-sm-2, .mx-sm-2 { margin-left: .5rem !important; } .m-sm-3 { margin: 1rem !important; } .mt-sm-3, .my-sm-3 { margin-top: 1rem !important; } .mr-sm-3, .mx-sm-3 { margin-right: 1rem !important; } .mb-sm-3, .my-sm-3 { margin-bottom: 1rem !important; } .ml-sm-3, .mx-sm-3 { margin-left: 1rem !important; } .m-sm-4 { margin: 1.5rem !important; } .mt-sm-4, .my-sm-4 { margin-top: 1.5rem !important; } .mr-sm-4, .mx-sm-4 { margin-right: 1.5rem !important; } .mb-sm-4, .my-sm-4 { margin-bottom: 1.5rem !important; } .ml-sm-4, .mx-sm-4 { margin-left: 1.5rem !important; } .m-sm-5 { margin: 3rem !important; } .mt-sm-5, .my-sm-5 { margin-top: 3rem !important; } .mr-sm-5, .mx-sm-5 { margin-right: 3rem !important; } .mb-sm-5, .my-sm-5 { margin-bottom: 3rem !important; } .ml-sm-5, .mx-sm-5 { margin-left: 3rem !important; } .p-sm-0 { padding: 0 !important; } .pt-sm-0, .py-sm-0 { padding-top: 0 !important; } .pr-sm-0, .px-sm-0 { padding-right: 0 !important; } .pb-sm-0, .py-sm-0 { padding-bottom: 0 !important; } .pl-sm-0, .px-sm-0 { padding-left: 0 !important; } .p-sm-1 { padding: .25rem !important; } .pt-sm-1, .py-sm-1 { padding-top: .25rem !important; } .pr-sm-1, .px-sm-1 { padding-right: .25rem !important; } .pb-sm-1, .py-sm-1 { padding-bottom: .25rem !important; } .pl-sm-1, .px-sm-1 { padding-left: .25rem !important; } .p-sm-2 { padding: .5rem !important; } .pt-sm-2, .py-sm-2 { padding-top: .5rem !important; } .pr-sm-2, .px-sm-2 { padding-right: .5rem !important; } .pb-sm-2, .py-sm-2 { padding-bottom: .5rem !important; } .pl-sm-2, .px-sm-2 { padding-left: .5rem !important; } .p-sm-3 { padding: 1rem !important; } .pt-sm-3, .py-sm-3 { padding-top: 1rem !important; } .pr-sm-3, .px-sm-3 { padding-right: 1rem !important; } .pb-sm-3, .py-sm-3 { padding-bottom: 1rem !important; } .pl-sm-3, .px-sm-3 { padding-left: 1rem !important; } .p-sm-4 { padding: 1.5rem !important; } .pt-sm-4, .py-sm-4 { padding-top: 1.5rem !important; } .pr-sm-4, .px-sm-4 { padding-right: 1.5rem !important; } .pb-sm-4, .py-sm-4 { padding-bottom: 1.5rem !important; } .pl-sm-4, .px-sm-4 { padding-left: 1.5rem !important; } .p-sm-5 { padding: 3rem !important; } .pt-sm-5, .py-sm-5 { padding-top: 3rem !important; } .pr-sm-5, .px-sm-5 { padding-right: 3rem !important; } .pb-sm-5, .py-sm-5 { padding-bottom: 3rem !important; } .pl-sm-5, .px-sm-5 { padding-left: 3rem !important; } .m-sm-auto { margin: auto !important; } .mt-sm-auto, .my-sm-auto { margin-top: auto !important; } .mr-sm-auto, .mx-sm-auto { margin-right: auto !important; } .mb-sm-auto, .my-sm-auto { margin-bottom: auto !important; } .ml-sm-auto, .mx-sm-auto { margin-left: auto !important; } } @media (min-width: 768px) { .m-md-0 { margin: 0 !important; } .mt-md-0, .my-md-0 { margin-top: 0 !important; } .mr-md-0, .mx-md-0 { margin-right: 0 !important; } .mb-md-0, .my-md-0 { margin-bottom: 0 !important; } .ml-md-0, .mx-md-0 { margin-left: 0 !important; } .m-md-1 { margin: .25rem !important; } .mt-md-1, .my-md-1 { margin-top: .25rem !important; } .mr-md-1, .mx-md-1 { margin-right: .25rem !important; } .mb-md-1, .my-md-1 { margin-bottom: .25rem !important; } .ml-md-1, .mx-md-1 { margin-left: .25rem !important; } .m-md-2 { margin: .5rem !important; } .mt-md-2, .my-md-2 { margin-top: .5rem !important; } .mr-md-2, .mx-md-2 { margin-right: .5rem !important; } .mb-md-2, .my-md-2 { margin-bottom: .5rem !important; } .ml-md-2, .mx-md-2 { margin-left: .5rem !important; } .m-md-3 { margin: 1rem !important; } .mt-md-3, .my-md-3 { margin-top: 1rem !important; } .mr-md-3, .mx-md-3 { margin-right: 1rem !important; } .mb-md-3, .my-md-3 { margin-bottom: 1rem !important; } .ml-md-3, .mx-md-3 { margin-left: 1rem !important; } .m-md-4 { margin: 1.5rem !important; } .mt-md-4, .my-md-4 { margin-top: 1.5rem !important; } .mr-md-4, .mx-md-4 { margin-right: 1.5rem !important; } .mb-md-4, .my-md-4 { margin-bottom: 1.5rem !important; } .ml-md-4, .mx-md-4 { margin-left: 1.5rem !important; } .m-md-5 { margin: 3rem !important; } .mt-md-5, .my-md-5 { margin-top: 3rem !important; } .mr-md-5, .mx-md-5 { margin-right: 3rem !important; } .mb-md-5, .my-md-5 { margin-bottom: 3rem !important; } .ml-md-5, .mx-md-5 { margin-left: 3rem !important; } .p-md-0 { padding: 0 !important; } .pt-md-0, .py-md-0 { padding-top: 0 !important; } .pr-md-0, .px-md-0 { padding-right: 0 !important; } .pb-md-0, .py-md-0 { padding-bottom: 0 !important; } .pl-md-0, .px-md-0 { padding-left: 0 !important; } .p-md-1 { padding: .25rem !important; } .pt-md-1, .py-md-1 { padding-top: .25rem !important; } .pr-md-1, .px-md-1 { padding-right: .25rem !important; } .pb-md-1, .py-md-1 { padding-bottom: .25rem !important; } .pl-md-1, .px-md-1 { padding-left: .25rem !important; } .p-md-2 { padding: .5rem !important; } .pt-md-2, .py-md-2 { padding-top: .5rem !important; } .pr-md-2, .px-md-2 { padding-right: .5rem !important; } .pb-md-2, .py-md-2 { padding-bottom: .5rem !important; } .pl-md-2, .px-md-2 { padding-left: .5rem !important; } .p-md-3 { padding: 1rem !important; } .pt-md-3, .py-md-3 { padding-top: 1rem !important; } .pr-md-3, .px-md-3 { padding-right: 1rem !important; } .pb-md-3, .py-md-3 { padding-bottom: 1rem !important; } .pl-md-3, .px-md-3 { padding-left: 1rem !important; } .p-md-4 { padding: 1.5rem !important; } .pt-md-4, .py-md-4 { padding-top: 1.5rem !important; } .pr-md-4, .px-md-4 { padding-right: 1.5rem !important; } .pb-md-4, .py-md-4 { padding-bottom: 1.5rem !important; } .pl-md-4, .px-md-4 { padding-left: 1.5rem !important; } .p-md-5 { padding: 3rem !important; } .pt-md-5, .py-md-5 { padding-top: 3rem !important; } .pr-md-5, .px-md-5 { padding-right: 3rem !important; } .pb-md-5, .py-md-5 { padding-bottom: 3rem !important; } .pl-md-5, .px-md-5 { padding-left: 3rem !important; } .m-md-auto { margin: auto !important; } .mt-md-auto, .my-md-auto { margin-top: auto !important; } .mr-md-auto, .mx-md-auto { margin-right: auto !important; } .mb-md-auto, .my-md-auto { margin-bottom: auto !important; } .ml-md-auto, .mx-md-auto { margin-left: auto !important; } } @media (min-width: 992px) { .m-lg-0 { margin: 0 !important; } .mt-lg-0, .my-lg-0 { margin-top: 0 !important; } .mr-lg-0, .mx-lg-0 { margin-right: 0 !important; } .mb-lg-0, .my-lg-0 { margin-bottom: 0 !important; } .ml-lg-0, .mx-lg-0 { margin-left: 0 !important; } .m-lg-1 { margin: .25rem !important; } .mt-lg-1, .my-lg-1 { margin-top: .25rem !important; } .mr-lg-1, .mx-lg-1 { margin-right: .25rem !important; } .mb-lg-1, .my-lg-1 { margin-bottom: .25rem !important; } .ml-lg-1, .mx-lg-1 { margin-left: .25rem !important; } .m-lg-2 { margin: .5rem !important; } .mt-lg-2, .my-lg-2 { margin-top: .5rem !important; } .mr-lg-2, .mx-lg-2 { margin-right: .5rem !important; } .mb-lg-2, .my-lg-2 { margin-bottom: .5rem !important; } .ml-lg-2, .mx-lg-2 { margin-left: .5rem !important; } .m-lg-3 { margin: 1rem !important; } .mt-lg-3, .my-lg-3 { margin-top: 1rem !important; } .mr-lg-3, .mx-lg-3 { margin-right: 1rem !important; } .mb-lg-3, .my-lg-3 { margin-bottom: 1rem !important; } .ml-lg-3, .mx-lg-3 { margin-left: 1rem !important; } .m-lg-4 { margin: 1.5rem !important; } .mt-lg-4, .my-lg-4 { margin-top: 1.5rem !important; } .mr-lg-4, .mx-lg-4 { margin-right: 1.5rem !important; } .mb-lg-4, .my-lg-4 { margin-bottom: 1.5rem !important; } .ml-lg-4, .mx-lg-4 { margin-left: 1.5rem !important; } .m-lg-5 { margin: 3rem !important; } .mt-lg-5, .my-lg-5 { margin-top: 3rem !important; } .mr-lg-5, .mx-lg-5 { margin-right: 3rem !important; } .mb-lg-5, .my-lg-5 { margin-bottom: 3rem !important; } .ml-lg-5, .mx-lg-5 { margin-left: 3rem !important; } .p-lg-0 { padding: 0 !important; } .pt-lg-0, .py-lg-0 { padding-top: 0 !important; } .pr-lg-0, .px-lg-0 { padding-right: 0 !important; } .pb-lg-0, .py-lg-0 { padding-bottom: 0 !important; } .pl-lg-0, .px-lg-0 { padding-left: 0 !important; } .p-lg-1 { padding: .25rem !important; } .pt-lg-1, .py-lg-1 { padding-top: .25rem !important; } .pr-lg-1, .px-lg-1 { padding-right: .25rem !important; } .pb-lg-1, .py-lg-1 { padding-bottom: .25rem !important; } .pl-lg-1, .px-lg-1 { padding-left: .25rem !important; } .p-lg-2 { padding: .5rem !important; } .pt-lg-2, .py-lg-2 { padding-top: .5rem !important; } .pr-lg-2, .px-lg-2 { padding-right: .5rem !important; } .pb-lg-2, .py-lg-2 { padding-bottom: .5rem !important; } .pl-lg-2, .px-lg-2 { padding-left: .5rem !important; } .p-lg-3 { padding: 1rem !important; } .pt-lg-3, .py-lg-3 { padding-top: 1rem !important; } .pr-lg-3, .px-lg-3 { padding-right: 1rem !important; } .pb-lg-3, .py-lg-3 { padding-bottom: 1rem !important; } .pl-lg-3, .px-lg-3 { padding-left: 1rem !important; } .p-lg-4 { padding: 1.5rem !important; } .pt-lg-4, .py-lg-4 { padding-top: 1.5rem !important; } .pr-lg-4, .px-lg-4 { padding-right: 1.5rem !important; } .pb-lg-4, .py-lg-4 { padding-bottom: 1.5rem !important; } .pl-lg-4, .px-lg-4 { padding-left: 1.5rem !important; } .p-lg-5 { padding: 3rem !important; } .pt-lg-5, .py-lg-5 { padding-top: 3rem !important; } .pr-lg-5, .px-lg-5 { padding-right: 3rem !important; } .pb-lg-5, .py-lg-5 { padding-bottom: 3rem !important; } .pl-lg-5, .px-lg-5 { padding-left: 3rem !important; } .m-lg-auto { margin: auto !important; } .mt-lg-auto, .my-lg-auto { margin-top: auto !important; } .mr-lg-auto, .mx-lg-auto { margin-right: auto !important; } .mb-lg-auto, .my-lg-auto { margin-bottom: auto !important; } .ml-lg-auto, .mx-lg-auto { margin-left: auto !important; } } @media (min-width: 1200px) { .m-xl-0 { margin: 0 !important; } .mt-xl-0, .my-xl-0 { margin-top: 0 !important; } .mr-xl-0, .mx-xl-0 { margin-right: 0 !important; } .mb-xl-0, .my-xl-0 { margin-bottom: 0 !important; } .ml-xl-0, .mx-xl-0 { margin-left: 0 !important; } .m-xl-1 { margin: .25rem !important; } .mt-xl-1, .my-xl-1 { margin-top: .25rem !important; } .mr-xl-1, .mx-xl-1 { margin-right: .25rem !important; } .mb-xl-1, .my-xl-1 { margin-bottom: .25rem !important; } .ml-xl-1, .mx-xl-1 { margin-left: .25rem !important; } .m-xl-2 { margin: .5rem !important; } .mt-xl-2, .my-xl-2 { margin-top: .5rem !important; } .mr-xl-2, .mx-xl-2 { margin-right: .5rem !important; } .mb-xl-2, .my-xl-2 { margin-bottom: .5rem !important; } .ml-xl-2, .mx-xl-2 { margin-left: .5rem !important; } .m-xl-3 { margin: 1rem !important; } .mt-xl-3, .my-xl-3 { margin-top: 1rem !important; } .mr-xl-3, .mx-xl-3 { margin-right: 1rem !important; } .mb-xl-3, .my-xl-3 { margin-bottom: 1rem !important; } .ml-xl-3, .mx-xl-3 { margin-left: 1rem !important; } .m-xl-4 { margin: 1.5rem !important; } .mt-xl-4, .my-xl-4 { margin-top: 1.5rem !important; } .mr-xl-4, .mx-xl-4 { margin-right: 1.5rem !important; } .mb-xl-4, .my-xl-4 { margin-bottom: 1.5rem !important; } .ml-xl-4, .mx-xl-4 { margin-left: 1.5rem !important; } .m-xl-5 { margin: 3rem !important; } .mt-xl-5, .my-xl-5 { margin-top: 3rem !important; } .mr-xl-5, .mx-xl-5 { margin-right: 3rem !important; } .mb-xl-5, .my-xl-5 { margin-bottom: 3rem !important; } .ml-xl-5, .mx-xl-5 { margin-left: 3rem !important; } .p-xl-0 { padding: 0 !important; } .pt-xl-0, .py-xl-0 { padding-top: 0 !important; } .pr-xl-0, .px-xl-0 { padding-right: 0 !important; } .pb-xl-0, .py-xl-0 { padding-bottom: 0 !important; } .pl-xl-0, .px-xl-0 { padding-left: 0 !important; } .p-xl-1 { padding: .25rem !important; } .pt-xl-1, .py-xl-1 { padding-top: .25rem !important; } .pr-xl-1, .px-xl-1 { padding-right: .25rem !important; } .pb-xl-1, .py-xl-1 { padding-bottom: .25rem !important; } .pl-xl-1, .px-xl-1 { padding-left: .25rem !important; } .p-xl-2 { padding: .5rem !important; } .pt-xl-2, .py-xl-2 { padding-top: .5rem !important; } .pr-xl-2, .px-xl-2 { padding-right: .5rem !important; } .pb-xl-2, .py-xl-2 { padding-bottom: .5rem !important; } .pl-xl-2, .px-xl-2 { padding-left: .5rem !important; } .p-xl-3 { padding: 1rem !important; } .pt-xl-3, .py-xl-3 { padding-top: 1rem !important; } .pr-xl-3, .px-xl-3 { padding-right: 1rem !important; } .pb-xl-3, .py-xl-3 { padding-bottom: 1rem !important; } .pl-xl-3, .px-xl-3 { padding-left: 1rem !important; } .p-xl-4 { padding: 1.5rem !important; } .pt-xl-4, .py-xl-4 { padding-top: 1.5rem !important; } .pr-xl-4, .px-xl-4 { padding-right: 1.5rem !important; } .pb-xl-4, .py-xl-4 { padding-bottom: 1.5rem !important; } .pl-xl-4, .px-xl-4 { padding-left: 1.5rem !important; } .p-xl-5 { padding: 3rem !important; } .pt-xl-5, .py-xl-5 { padding-top: 3rem !important; } .pr-xl-5, .px-xl-5 { padding-right: 3rem !important; } .pb-xl-5, .py-xl-5 { padding-bottom: 3rem !important; } .pl-xl-5, .px-xl-5 { padding-left: 3rem !important; } .m-xl-auto { margin: auto !important; } .mt-xl-auto, .my-xl-auto { margin-top: auto !important; } .mr-xl-auto, .mx-xl-auto { margin-right: auto !important; } .mb-xl-auto, .my-xl-auto { margin-bottom: auto !important; } .ml-xl-auto, .mx-xl-auto { margin-left: auto !important; } } .visible { visibility: visible !important; } .invisible { visibility: hidden !important; } .add-exp-button { margin-right: 0px; } .remove-exp-button { margin-left: 0px; } .exp-input { margin-right: 0px; margin-left: 0px; margin-top: 5px; margin-bottom: 5px; padding: 2px 5px; } .text-center { margin: auto; text-align: center; vertical-align: middle; } .touch-right { margin-right: 0px; } .touch-left { margin-left: 0px; } .touch-sides { margin-left: 0px; margin-right: 0px; } /*# sourceMappingURL=engineStyle.css.map*/