/* CSS is how you can add style to your website, such as colors, fonts, and positioning of your
   HTML content. To learn how to do something, just try searching Google for questions like
   "how to change link color." */
   
body { cursor: url('https://i.gyazo.com/39753ec8ea0ee7b895cda88acefffa87.png'), auto; }

pre code {
  background-color: #eee;
  border: 1px solid #999;
  display: block;
  padding: 20px;
}

img { 
    image-rendering: optimizeSpeed;             /* STOP SMOOTHING, GIVE ME SPEED  */
    image-rendering: -moz-crisp-edges;          /* Firefox                        */
    image-rendering: -o-crisp-edges;            /* Opera                          */
    image-rendering: -webkit-optimize-contrast; /* Chrome (and eventually Safari) */
    image-rendering: pixelated; /* Chrome */
    image-rendering: optimize-contrast;         /* CSS3 Proposed                  */
    -ms-interpolation-mode: nearest-neighbor;   /* IE8+                           */

}

.hand:active {
    cursor: url('/images/lowclickcursor1.png');
}

.pixelated {
  image-rendering: -moz-crisp-edges;
  -ms-interpolation-mode: nearest-neighbor;
  image-rendering: pixelated !important;
}

.linkheader {
  margin: 5px;
  margin-top: 10px;
  padding: 1px;
  text-align: center;
  border: 1px solid #fff;
  border-left: none;
  border-right: none;
  /* TODO: Width between 70% - 100% */
  /*background-image: linear-gradient(90deg, rgba(0, 0, 0, 0.0), rgba(100, 21, 150, 0.48), rgba(0, 0, 0, 0.0));*/
}
.linkheader li {
  display: inline-block;
  margin: 5px;
  font-size: 1.2em;
}
.linkheader a {
  text-shadow: 1px 1px 1px #808080;
}

body {
  background-color: black;
  color: white;
  font-family: Arial, Helvetica, sans-serif;
  font-size: 13px;
  font-smooth: never;
  -webkit-font-smoothing : none;
}

a {
  color: #fff;
  cursor: url("/images/lowclickcursor1.png"), auto;
}
a:focus, a:hover {
  background-color: #fff;
  color: #000;
}
a:active {
  background-color: #000;
}

/* windows 95 scrollbar */
::-webkit-scrollbar {
  width: 15px;
  height: 15px;
  background-color: #000;
  background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAIAAAACAQMAAABIeJ9nAAAABlBMVEX////AwMCU81DAAAAADElEQVQIHWNoYHAAAAHEAMEKQ169AAAAAElFTkSuQmCC);
  background-size: 2px;
}
::-webkit-scrollbar-track {
}
::-webkit-scrollbar-thumb {
  background-color: silver;
  border-left: ridge 2px #fff;
  border-top: ridge 2px #fff;
  border-right: ridge 2px grey;
  border-bottom: ridge 2px grey;
}
::-webkit-scrollbar-thumb:active {
  background-color: #d0d0d0;
}
::-webkit-scrollbar-button {
  background-color: darkgrey;
  background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADwAAAAPBAMAAABKPLFCAAAABGdBTUEAALGPC/xhBQAAACBjSFJNAAB6JgAAgIQAAPoAAACA6AAAdTAAAOpgAAA6mAAAF3CculE8AAAAIVBMVEUAAACGhILr6ulbWlqop6ddXV0hISHk4+MAAABubm3///8cDMtbAAAAAXRSTlMAQObYZgAAAAFiS0dECmjQ9FYAAAAJcEhZcwAACxMAAAsTAQCanBgAAAAHdElNRQfgChMNNQqYsOkJAAAAfElEQVQY02MQhAABQRTAABVlEFICA0EIpYjGpZ60CUTaGcoNQpVWTodIlxmBuaqtEGl3JXUnED+sCCKtngqWNptmBJY2KwKqF1RS7YTZPSMIyFVOV08GSytnJith6lYpUiqB2B0RhM1uuMtVsbucusGCTZoRJYpgACoqCABTOTzVZ8THeQAAACV0RVh0ZGF0ZTpjcmVhdGUAMjAxNi0xMC0xOVQxNTo1MToyOCswMjowMPJE7xwAAAAldEVYdGRhdGU6bW9kaWZ5ADIwMTYtMTAtMTlUMTU6NTE6MjgrMDI6MDCDGVegAAAAAElFTkSuQmCC);
  width: 15px;
  height: 15px;
}
::-webkit-scrollbar-button:vertical:start {
  background-position: -45px 0;
}
::-webkit-scrollbar-button:vertical:end {
  background-position: 0 0;
}
::-webkit-scrollbar-button:horizontal:start {
  background-position: -15px 0;
}
::-webkit-scrollbar-button:horizontal:end {
  background-position: -30px 0;
}

.rainbow {
   /* Chrome, Safari, Opera */
  -webkit-animation: rainbow 3s infinite; 
  
  /* Internet Explorer */
  -ms-animation: rainbow 3s infinite;
  
  /* Standar Syntax */
  animation: rainbow 3s infinite; 
}

/* Chrome, Safari, Opera */
@-webkit-keyframes rainbow{
  0%{color: orange;}	
  10%{color: purple;}	
	20%{color: red;}
	40%{color: yellow;}
	60%{color: green;}
	100%{color: blue;}
	100%{color: orange;}	
}
/* Internet Explorer */
@-ms-keyframes rainbow{
  0%{color: orange;}	
  10%{color: purple;}	
	20%{color: red;}
	40%{color: yellow;}
	60%{color: green;}
	100%{color: blue;}
	100%{color: orange;}	
}

/* Standar Syntax */
@keyframes rainbow{
  0%{color: orange;}	
  10%{color: purple;}	
	20%{color: red;}
	40%{color: yellow;}
	60%{color: green;}
	100%{color: blue;}
	100%{color: orange;}
}