custom-css.css

@font-face {
    font-family: 'System';
    src: url('/media/custom/fonts/system-ms/SystemBold.woff2') format('woff2'),
        url('/media/custom/fonts/system-ms/SystemBold.woff') format('woff');
    font-weight: bold;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: 'MS Serif';
    src: url('/media/custom/fonts/ms-serif/MSSerif.woff2') format('woff2'),
        url('/media/custom/fonts/ms-serif/MSSerif.woff') format('woff');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: 'MS Sans Serif';
    src: url('/media/custom/fonts/ms-sans-serif/MS Sans Serif.woff2') format('woff2'),
        url('/media/custom/fonts/ms-sans-serif/MS Sans Serif.woff') format('woff');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}
ak-form-element[label="Please read and agree to our code of conduct before you continue."] {
    font-size: 16px;
    font-weight: 100;
    padding-bottom: 10px;
}
.pf-c-form__label-text {
	cursor: url('/media/custom/cursors/arrow.cur'), auto !important;
}

div:has(#adultcheckbox:not(:checked)) button {
    /* buggy? */
    pointer-events: none;
    color: gray !important;
    border-bottom: 2px solid black !important;
    border-right: 2px solid black !important;
}

textarea[name="eula"] {
    font-family: "System", sans-serif;
    resize: none;
    margin-bottom: -10px;
    height: 600px;
    line-height: 1em;
    color: black;
    background-color: white !important;
    user-select: none;
    overflow: auto;
    cursor: url('/media/custom/cursors/arrow.cur'), auto !important;
    user-select: none;
}
textarea[name="eula"]::selection {
        color: black;
        background: white;
}

.pf-c-background-image {
	background-color: #161657;
}
p:has(.marginkill) {
	margin-bottom: -20px;
	margin-top: -10px;
	user-select: none;
}
:root {
    --ak-flow-background: url("/media/flow-backgrounds/ms.jpeg") !important;
     --surface: #c0c0c0;
  --button-highlight: #ffffff;
  --button-face: #dfdfdf;
  --button-shadow: #808080;
  --window-frame: #0a0a0a;
  --dialog-blue: #000080;
  --dialog-blue-light: #1084d0;
  --dialog-gray: #808080;
  --dialog-gray-light: #b5b5b5;
  --link-blue: #0000ff;

  /* Spacing */
  --element-spacing: 8px;
  --grouped-button-spacing: 4px;
  --grouped-element-spacing: 6px;
  --radio-width: 12px;
  --checkbox-width: 13px;
  --radio-label-spacing: 6px;
  --range-track-height: 4px;
  --range-spacing: 10px;

  /* Some detailed computations for radio buttons and checkboxes */
  --radio-total-width-precalc: var(--radio-width) + var(--radio-label-spacing);
  --radio-total-width: calc(var(--radio-total-width-precalc));
  --radio-left: calc(-1 * var(--radio-total-width-precalc));
  --radio-dot-width: 4px;
  --radio-dot-top: calc(var(--radio-width) / 2 - var(--radio-dot-width) / 2);
  --radio-dot-left: calc(
    -1 * (var(--radio-total-width-precalc)) + var(--radio-width) / 2 - var(
        --radio-dot-width
      ) / 2
  );

  --checkbox-total-width-precalc: var(--checkbox-width) +
    var(--radio-label-spacing);
  --checkbox-total-width: calc(var(--checkbox-total-width-precalc));
  --checkbox-left: calc(-1 * var(--checkbox-total-width-precalc));
  --checkmark-width: 7px;
  --checkmark-top: 3px;
  --checkmark-left: 3px;

  /* Borders */
  --border-width: 1px;
  --border-raised-outer: inset -1px -1px var(--window-frame),
    inset 1px 1px var(--button-highlight);
  --border-raised-inner: inset -2px -2px var(--button-shadow),
    inset 2px 2px var(--button-face);
  --border-sunken-outer: inset -1px -1px var(--button-highlight),
    inset 1px 1px var(--window-frame);
  --border-sunken-inner: inset -2px -2px var(--button-face),
    inset 2px 2px var(--button-shadow);

  /* Window borders flip button-face and button-highlight */
  --border-window-outer: inset -1px -1px var(--window-frame),
    inset 1px 1px var(--button-face);
  --border-window-inner: inset -2px -2px var(--button-shadow),
    inset 2px 2px var(--button-highlight);

  /* Field borders (checkbox, input, etc) flip window-frame and button-shadow */
  --border-field: inset -1px -1px var(--button-highlight),
    inset 1px 1px var(--button-shadow), inset -2px -2px var(--button-face),
    inset 2px 2px var(--window-frame);
}

label.pf-c-check__label {
	cursor: url('/media/custom/cursors/arrow.cur'), auto !important;
}
body{
	cursor: url('/media/custom/cursors/arrow.cur'), auto;
}
a[href^="https://goauthentik.io"] {
        position: fixed;
        left: 0px;
        top: 0px;
        visibility: hidden;
}
a[href^="https://goauthentik.io"]::before {
        visibility: visible;
        content: "Powered by Authentik";
        position: fixed;
        left: 20px;
        top: 20px;
        font-size: 36px;
        font-family: "MS Serif";
}

@media screen and (max-width: 1199px) {
        a[href^="https://goauthentik.io"]::before {
                display: none;
        }
        a[href^="https://goauthentik.io"]{
                display: none;
        }
}

h1, h3 {
	/*font-family: "Sixtyfour", "RedHatDisplay", "Overpass", helvetica, sans-serif !important;*/
	user-select: none;
	color: black !important;
}
h3 {
	font-family: "MS Sans Serif" !important;
}
label {
	cursor: default !important;
	user-select: none;
	color: black !important;
}

.pf-c-brand {
	height: auto;
}

.pf-c-form {
	font-family: "MS Sans Serif" !important;
	color: black !important;
}
.pf-c-login__main-header h1 {
	font-family: "MS Serif" !important;
    	color: black !important;
	margin-left: -6%;
	font-weight: bold !important;
}
.pf-c-login__main-body .pf-c-form__group {
	font-family: "MS Sans Serif" !important;
    	color: black !important;
}
.pf-c-login__main-body {
	margin-left: -4%;
	margin-right: -4%;
	margin-bottom: -3%;
}
.pf-c-empty-state {
	padding: 0px;
}
.pf-c-empty-state__content {
	margin-top: 55px;
}
.pf-c-empty-state__content  h1 {
	font-family: "MS Sans Serif" !important;
}
.pf-c-empty-state__content  h1::after {
	content: "...";
}
.pf-c-empty-state {
	cursor: url('/media/custom/cursors/hourglass.cur'), auto;
}
.pf-c-empty-state__icon {
	background-image: url('/media/custom/img/drumroll.gif');
	background-size: 90%;
	background-repeat: no-repeat;

}
.pf-c-spinner {
	background-image: url('/media/custom/img/hourglass.gif');
	background-size: 90%;
	background-repeat: no-repeat;
	animation: none !important;
}

.pf-c-avatar {
	box-shadow: rgb(129, 129, 129) -2px -2px, rgb(129, 129, 129) -2px 0px, rgb(129, 129, 128) 0px -2px, rgb(224, 222, 222) 2px 2px, rgb(224, 222, 222) 0px 2px, rgb(224, 222, 222) 2px 0px, rgb(129, 129, 129) 2px -2px, rgb(224, 222, 221) -2px 2px;
	width: 50px;
	height: 50px;
	border: 0px;
	border-radius: 0px;
	margin-right: 12px !important;
}
.avatar {
	/*background-image: url('https://auth.32bit.cafe/media/custom/msn.png');
	background-size: contain;
	background-repeat: no-repeat;
	*/user-select: none;
	background-color: #dadada;
	padding-right: 10px;
	box-shadow: rgb(129, 129, 129) -2px -2px, rgb(129, 129, 129) -2px 0px, rgb(129, 129, 128) 0px -2px, rgb(224, 222, 222) 2px 2px, rgb(224, 222, 222) 0px 2px, rgb(224, 222, 222) 2px 0px, rgb(129, 129, 129) 2px -2px, rgb(224, 222, 221) -2px 2px;
}
ak-loading-overlay {
	cursor: url('/media/custom/cursors/hourglass.cur'), auto;
	background-image:
      linear-gradient(45deg, #000 25%, transparent 25%),
      linear-gradient(135deg, #000 25%, transparent 25%),
      linear-gradient(45deg, transparent 75%, #000 75%),
      linear-gradient(135deg, transparent 75%, #000 75%);
    background-size: 2px 2px; /* Must be a square */
    background-position:0 0, 1px 0, 1px -1px, 0px 1px; /* Must be half of one side of the square */
    background-color: transparent;
    }
* .fa-exclamation-circle:before {
    content: "abc";
    width: 18px;
    display: block;
    background-image: url("/media/custom/img/error.png");
    background-size: 100%;
    background-repeat: no-repeat;
    color: transparent;
}
.pf-c-alert__title {
	font-family: 'System';
}
::-moz-selection { /* Code for Firefox */
  color: white;
  background: blue;
}

::selection {
  color: white;
  background: blue;
}
.reason {
	margin-top: -20px;
}
ak-stage-access-denied-icon::before {
    content: " ";
    display: block;
    height: 1px;
    background-color: rgb(143, 149, 153);
    box-shadow: white 1px 1px, white 1px 0px;
    margin-bottom: 20px;
}
.pf-icon-error-circle-o::before {
    background-image: url("/media/custom/img/error.png");
    background-repeat: no-repeat;
    background-size: 100%;
    color: transparent;
}


/* preload that gif */
body::after {
	position: absolute; width:0; height:0; overflow: hidden; z-index:-1;
	content: url("/media/custom/img/error.png") url('/media/custom/img/hourglass.gif') url('/media/custom/img/drumroll.gif')  url("/media/custom/fonts/ms-sans-serif/MS Sans Serif.woff2") url('/media/custom/fonts/ms-sans-serif/MS Sans Serif.woff') url('/media/custom/fonts/ms-serif/MSSerif.woff') url("/media/custom/fonts/ms-serif/MSSerif.woff2") url('/media/custom/fonts/system-ms/SystemBold.woff2');
}
.pf-c-empty-state__icon *, .pf-c-spinner * {
	visibility: hidden;
}
.pf-c-login__main::before {
font-family: 'System', 'sans-serif';
font-weight: bold !important;
    content: "32-Bit Cafe SSO";
    display: block;
    position: absolute;
    width: calc(100% - 14px);
    background-color: #191eb6;
    color: white;
    text-align: center;
    margin-top: 5px;
    margin-left: 7px;
    box-shadow: -2px -2px #818181, -2px 0 #818181, 0 -2px #818180, 2px 2px #e0dede, 0 2px #e0dede, 2px 0 #e0dede, 2px -2px #818181, -2px 2px #E0DEDD;
}
.pf-c-button::after {
    border: 0px;
}
button, .pf-c-button {
    text-decoration: none;
    cursor: url('/media/custom/cursors/hand.cur'), auto;
    background-color: #c8ced1 !important;
    color: black !important;
    font-family: 'System';
    border: 2px solid !important;
    border-color: black;
    box-shadow: inset -3px -3px grey, inset 3px 3px white;

}
button:hover, .pf-c-button:hover {
	filter: brightness(107%);
}
button:active, .pf-c-button:active {
    box-shadow: inset 3px 3px grey;
}

button.pf-m-link {
	background-color:#6f85d3 !important;
	color: white !important;
	border-color: black !important;
}

.pf-c-button__icon {
	height: 0px;
	filter: invert(1);
}
.pf-c-button__icon img {
	height: 26px;
	margin-top: 1px;
}
a {
	color: blue;
	text-decoration: underline;
	cursor: url('/media/custom/cursors/hand.cur'), auto;
}
a:hover {
	font-weight: bold;
}

.pf-c-login__main {
	background-color: #c8ced1;
	box-shadow: 2px 2px #818181, 2px 0 #818181, 0 2px #818180, -2px -2px #e0dede, 0 -2px #e0dede, -2px 0 #e0dede, -2px 2px #818181, 2px -2px #E0DEDD;
}
.pf-m-action {
	margin: 0 !important;
}
.pf-c-login__main-footer-links {
	padding-bottom: 0px;
}

.pf-c-login__main-footer-band::before {
	content: " ";
	display: block;
	height: 1px;
	background-color: #8f9599;
	box-shadow: 1px 1px white, 1px 0px white;
	margin-bottom: 20px;
}
.pf-c-login__main-footer-band {
	user-select: none;
	font-family: "MS Sans Serif" !important;
    	color: black !important;
	background-color: #c8ced1;
	text-align: left;
	/* border-top: 1px solid;*/
	margin-top: 0px;
	padding-bottom: 15px;
}
.pf-c-login__main-footer-band-item {
	padding: 0px;
}

.ak-brand {
	margin:5px !important;
	margin-top: -20px !important;;
}
/* BEGIN 98.CSS EXCERPT */
input[type="text"]:focus::placeholder,
input[type="password"]:focus::placeholder,
input[type="email"]:focus::placeholder,
input[type="number"]:focus::placeholder 
{
	color: white;
}
input[type="text"],
input[type="password"],
input[type="email"],
input[type="number"] {
	height: 30px;
}

input[type="text"],
input[type="password"],
input[type="email"],
input[type="number"],
select,
textarea {
  padding: 3px 4px;
  border: none;
  box-shadow: var(--border-field);
  background-color: var(--button-highlight);
  box-sizing: border-box;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  border-radius: 0;
}
input[type="number"] {
  /* need this 1 pixel to fit the spinner controls in box */
  height: 22px;
}

input[type="text"],
input[type="password"],
input[type="email"],
input[type="number"] {
  /* For some reason descenders are getting cut off without this */
  line-height: 2;
}

input[type="email"]:disabled,
input[type="password"]:disabled,
input[type="text"]:disabled,
input[type="number"]:disabled,
input[type="email"]:read-only,
input[type="password"]:read-only,
input[type="text"]:read-only,
input[type="number"]:read-only,
textarea:disabled {
  background-color: var(--surface);
}

select {
  appearance: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  position: relative;
  padding-right: 32px;
  background-image: svg-load("/media/custom/icons/button-down.svg");
  background-position: top 2px right 2px;
  background-repeat: no-repeat;
  border-radius: 0;
}

select:focus,
input[type="text"]:focus,
input[type="password"]:focus,
input[type="email"]:focus,
input[type="number"]:focus,
textarea:focus {
  outline: none;
}

input[type="range"] {
  -webkit-appearance: none;
  width: 100%;
  background: transparent;
}

input[type="range"]:focus {
  outline: none;
}

input[type="range"]::-webkit-slider-thumb {
  -webkit-appearance: none;
  height: 21px;
  width: 11px;
  background: svg-load("/media/custom/icons/indicator-horizontal.svg");
  transform: translateY(-8px);
}

input[type="range"].has-box-indicator::-webkit-slider-thumb {
  background: svg-load("/media/custom/icons/indicator-rectangle-horizontal.svg");
  transform: translateY(-10px);
}

input[type="range"]::-moz-range-thumb {
  height: 21px;
  width: 11px;
  border: 0;
  border-radius: 0;
  background: svg-load("/media/custom/icons/indicator-horizontal.svg");
  transform: translateY(2px);
}

input[type="range"].has-box-indicator::-moz-range-thumb {
  background: svg-load("/media/custom/icons/indicator-rectangle-horizontal.svg");
  transform: translateY(0px);
}

input[type="range"]::-webkit-slider-runnable-track {
  width: 100%;
  height: 2px;
  box-sizing: border-box;
  background: black;
  border-right: 1px solid grey;
  border-bottom: 1px solid grey;
  box-shadow: 1px 0 0 white, 1px 1px 0 white, 0 1px 0 white, -1px 0 0 darkgrey,
    -1px -1px 0 darkgrey, 0 -1px 0 darkgrey, -1px 1px 0 white, 1px -1px darkgrey;
}

input[type="range"]::-moz-range-track {
  width: 100%;
  height: 2px;
  box-sizing: border-box;
  background: black;
  border-right: 1px solid grey;
  border-bottom: 1px solid grey;
  box-shadow: 1px 0 0 white, 1px 1px 0 white, 0 1px 0 white, -1px 0 0 darkgrey,
    -1px -1px 0 darkgrey, 0 -1px 0 darkgrey, -1px 1px 0 white, 1px -1px darkgrey;
}

.pf-c-check input[type="checkbox"] {
  appearance: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  margin: 0;
  background: 0;
  position: fixed;
  opacity: 0;
  border: none;
}

.pf-c-check input[type="checkbox"] + label {
  line-height: 13px;
}

.pf-c-check input[type="checkbox"]:focus + label {
  outline: 1px dotted #000000;
}

.pf-c-check input[type="checkbox"] + label {
  cursor: url('/media/custom/cursors/hand.cur'), auto !important;
  position: relative;
  margin-left: var(--checkbox-total-width);
}

.pf-c-check input[type="checkbox"] + label::before {
  cursor: url('/media/custom/cursors/hand.cur'), auto !important;
  content: "";
  position: absolute;
  left: calc(-1 * (var(--checkbox-total-width-precalc)));
  display: inline-block;
  width: var(--checkbox-width);
  height: var(--checkbox-width);
  background: var(--button-highlight);
  box-shadow: var(--border-field);
  margin-right: var(--radio-label-spacing);
}
.pf-c-check input[type="checkbox"]:active + label::before {
  background: var(--surface);
}

.pf-c-check input[type="checkbox"]:checked + label::before {
  background-image: url("/media/custom/icons/checkmark.svg");
  background-size: 60%;
  background-position: center;
  background-repeat: no-repeat;
}

.pf-c-check input[type="checkbox"][disabled] + label::before {
  background: var(--surface);
}

.pf-c-check input[type="checkbox"][disabled]:checked + label::after {
  background: svg-load("/media/custom/icons/checkmark-disabled.svg");
}
/* END 98.css */

/* BEGIN SCROLLBAR */
textarea::-webkit-scrollbar {
	 width: 16px;
	 height: 16px;
}
 textarea::-webkit-scrollbar-track {
	 background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAIAAAACCAIAAAD91JpzAAAAFElEQVQIW2M4fPz0////GYAYyAIASnoKpV3w4kgAAAAASUVORK5CYII=');
	 image-rendering: pixelated;
}
 textarea::-webkit-scrollbar-track:active {
	 background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAIAAAACCAIAAAD91JpzAAAAEElEQVQIW2No6+pjgAAgCwAWogM9VKrgGQAAAABJRU5ErkJggg==');
}
 textarea::-webkit-scrollbar-thumb {
	 border-top: 1px solid #c3c7cb;
	 border-left: 1px solid #c3c7cb;
	 border-right: 1px solid black;
	 border-bottom: 1px solid black;
	 box-shadow: inset 1px 1px 0 0 white, inset -1px -1px 0 0 #868a8e;
	 width: 16px;
	 height: 16px;
	 background-color: #c3c7cb;
	 z-index: 1;
}
 textarea::-webkit-scrollbar-corner {
	 background-color: #c3c7cb;
}
 textarea::-webkit-resizer {
	 width: 16px;
	 height: 16px;
	 background-color: #c3c7cb;
	 background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAAN0lEQVR4Ae3MgQUAMBRDwU5fFF05lb/CARTBw2Ulof0DxPtcwp3hNuEYnjbcEW4TjuFpwx3h9gMWGgZ2Y/PT2gAAAABJRU5ErkJggg==');
	 background-position: bottom right;
	 background-repeat: no-repeat;
	 image-rendering: pixelated;
}
 textarea::-webkit-scrollbar-button, textarea::-webkit-scrollbar-button {
	 border-top: 1px solid #c3c7cb;
	 border-left: 1px solid #c3c7cb;
	 border-right: 1px solid black;
	 border-bottom: 1px solid black;
	 box-shadow: inset 1px 1px 0 0 white, inset -1px -1px 0 0 #868a8e;
	 display: block;
	 width: 16px;
	 height: 16px;
	 background-color: #c3c7cb;
	 image-rendering: pixelated;
	 background-repeat: no-repeat;
	 background-position: center center;
}
 textarea::-webkit-scrollbar-button:active, textarea::-webkit-scrollbar-button:active {
	 background-position: 2px 2px;
}
 textarea::-webkit-scrollbar-button:horizontal:decrement, textarea::-webkit-scrollbar-button:horizontal:decrement {
	 background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAwAAAAMCAQAAAD8fJRsAAAAHklEQVQY02NgoBT8xyX8H5fwf1zCpOjAYwceV1EEAAO2D/HsQ4vsAAAAAElFTkSuQmCC');
}
 textarea::-webkit-scrollbar-button:horizontal:increment, textarea::-webkit-scrollbar-button:horizontal:increment {
	 background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAwAAAAMCAQAAAD8fJRsAAAAHUlEQVQY02NgIB/8xy3xH7fEf9wS/0nUQZqrKAYAK44P8ZRmzLQAAAAASUVORK5CYII=');
}
 textarea::-webkit-scrollbar-button:vertical:decrement, textarea::-webkit-scrollbar-button:vertical:decrement {
	 background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAwAAAAMCAYAAABWdVznAAAAGklEQVR4AWMYxuA/SYphmETFhDX9x4mHGQAAcL4P8dQiMq8AAAAASUVORK5CYII=');
}
 textarea::-webkit-scrollbar-button:vertical:increment, textarea::-webkit-scrollbar-button:vertical:increment {
	 background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAwAAAAMCAQAAAD8fJRsAAAAF0lEQVQY02NgoBf4jwJxSOHQhcNAOgMAWWAP8Rv2U3UAAAAASUVORK5CYII=');
}
 textarea::-webkit-scrollbar-button:horizontal:increment:start, textarea::-webkit-scrollbar-button:horizontal:increment:start {
	 display: none;
}
 textarea::-webkit-scrollbar-button:horizontal:decrement:end, textarea::-webkit-scrollbar-button:horizontal:decrement:end {
	 display: none;
}
 textarea::-webkit-scrollbar-button:vertical:increment:start, textarea::-webkit-scrollbar-button:vertical:increment:start {
	 display: none;
}
 textarea::-webkit-scrollbar-button:vertical:decrement:end, textarea::-webkit-scrollbar-button:vertical:decrement:end {
	 display: none;
}
 textarea::-webkit-scrollbar-button:active, textarea::-webkit-scrollbar-button:active {
	 border-top: 1px solid #868a8e;
	 border-left: 1px solid #868a8e;
	 border-bottom: 1px solid #868a8e;
	 border-right: 1px solid #868a8e;
	 box-shadow: none;
}
/* dakedres was here ;3 */