html {
    overflow: scroll;
    overflow-x: hidden;
    -ms-overflow-style: none;
    scrollbar-width: none;
}
::-webkit-scrollbar {
    width: 0px;  /* Remove scrollbar space */
    background: transparent;  /* Optional: just make scrollbar invisible */
}
/* Optional: show position indicator in red */
::-webkit-scrollbar-thumb {
    background: #FF0000;
}

nav#display { position: fixed; z-index: 99; left: 0px; top:0; /*background-color: #555;*/ }
nav#display.hide { display:none; }
nav#display:hover { left: 0; }
nav#display a.menu-link-button { color: #ccc; background-color: #212121; padding: .3em .5em; display: block; font-size:.8em; text-align: left; }
nav#display a.menu-link-button.current { background-color: #3e3e3e; text-decoration: underline }
nav#display button.hide_nav { color: #ccc; background-color: #212121; padding: .3em .5em; display: block; font-size:.8em; text-align: left; }

#bg_container { position:absolute; top:0; left:0; right:0; min-height: 100vh; }
#bg_container.contrast-container { background-color: rgb(255,255,255); padding: 5vh 5vw; }
#bg_container.gamma-container { background-color: rgb(0,0,0); padding: 5vh 5vw; }
#bg_container.sharpness-container { background-color: rgb(34, 34, 34); padding: 10vh 10vw; }
#bg_container.blooming-container { background-color: rgb(0,0,0); padding: 5vh 5vw; }
#bg_container.text-container { background-color: rgb(0,0,0); padding: 5vh 5vw; }
#bg_container.high-blocks .bg-block{ height: 40vh; }
#bg_container.high-blocks .bg-block.half-h{ height: 10vh; }
.bg-block{ height: 25vh; width: 100%; display: block; }
.text-block{ min-height: 150px; margin-bottom: 50px; width: 100%; display: block; }
.bg-block.sharpness-block{ height: 40vh; width: 100%; overflow:hidden; display: block; }

.bg-block:after{ display: block; clear:both; content:''; }
.bg-block.half-h { height: 12.5vh; }
.bg-block.quarter-h { height: 6vh; }
.bg-block.half-h .bg-block{ height: 12.5vh; }
.bg-block.full-h .bg-block{ height: 100vh; }

.info-block{ padding: 2em; font-size: 1.2em; width: 100%; float:left; color:#fff }
.text{ padding: 2em 1em; font-size: 1.2em; text-align: center; display: block; width: 100%; color:#fff }

.bg-white{background-color:rgb(255,255,255)}
.bg-white1{background-color:rgb(240,240,240)}
.bg-white2{background-color:rgb(230,230,230)}
.bg-white3{background-color:rgb(200,200,200)}
.bg-grey1{background-color:rgb(180,180,180)}
.bg-grey2{background-color:rgb(160,160,160)}
.bg-grey3{background-color:rgb(110,110,110)}
.bg-grey4{background-color:rgb(80,80,80)}
.bg-grey5{background-color:rgb(30,30,30)}
.bg-black{background-color:rgb(0,0,0)}
.bg-red{background-color:rgb(255,0,0)}
.bg-red-gradient{background:linear-gradient(to right, rgb(255,0,0), rgb(0,0,0))}
.bg-green{background-color:rgb(0,255,0)}
.bg-green-gradient{background:linear-gradient(to right, rgb(0,255,0), rgb(0,0,0))}
.bg-blue{background-color:rgb(0,0,255)}
.bg-blue-gradient{background:linear-gradient(to right, rgb(0,0,255), rgb(0,0,0))}
.bg-normal{background-color:#aa9}
.bg-fire{background-color:#f42}
.bg-water{background-color:#39f}
.bg-electric{background-color:#fc3}
.bg-grass{background-color:#7c5}
.bg-ice{background-color:#6cf}
.bg-fighting{background-color:#b54}
.bg-poison{background-color:#a59}
.bg-ground{background-color:#db5}
.bg-flying{background-color:#89f}
.bg-psychic{background-color:#f59}
.bg-bug{background-color:#ab2}
.bg-rock{background-color:#ba6}
.bg-ghost{background-color:#66b}
.bg-dragon{background-color:#76e}
.bg-dark{background-color:#754}
.bg-steel{background-color:#aab}
.bg-fairy{background-color:#e9e}
.bg-curse{background-color:#698}
.bg-darkorange{background-color:#fd4f00}
.bg-orange{background-color:#e95523}

.bg-red-0{background-color: rgb(0,0,0);}
.bg-red-5{background-color: rgb(5,0,0);}
.bg-red-10{background-color: rgb(10,0,0);}
.bg-red-20{background-color: rgb(20,0,0);} 
.bg-red-30{background-color: rgb(30,0,0);} 
.bg-red-40{background-color: rgb(40,0,0);}
.bg-red-50{background-color: rgb(50,0,0);}
.bg-red-60{background-color: rgb(60,0,0);} 
.bg-red-70{background-color: rgb(70,0,0);} 
.bg-red-80{background-color: rgb(80,0,0);}
.bg-red-90{background-color: rgb(90,0,0);}
.bg-red-100{background-color: rgb(100,0,0);}
.bg-red-110{background-color: rgb(110,0,0);}
.bg-red-120{background-color: rgb(120,0,0);}
.bg-red-130{background-color: rgb(130,0,0);}
.bg-red-140{background-color: rgb(140,0,0);}
.bg-red-150{background-color: rgb(150,0,0);} 
.bg-red-160{background-color: rgb(160,0,0);}
.bg-red-170{background-color: rgb(170,0,0);}
.bg-red-180{background-color: rgb(180,0,0);}
.bg-red-190{background-color: rgb(190,0,0);}
.bg-red-200{background-color: rgb(200,0,0);}
.bg-red-210{background-color: rgb(210,0,0);}
.bg-red-220{background-color: rgb(220,0,0);}
.bg-red-230{background-color: rgb(230,0,0);}
.bg-red-240{background-color: rgb(240,0,0);}
.bg-red-250{background-color: rgb(250,0,0);} 
.bg-red-255{background-color: rgb(255,0,0);}

.bg-green-0{background-color: rgb(0,0,0);}
.bg-green-5{background-color: rgb(0,5,0);}
.bg-green-10{background-color: rgb(0,10,0);}
.bg-green-20{background-color: rgb(0,20,0);} 
.bg-green-30{background-color: rgb(0,30,0);} 
.bg-green-40{background-color: rgb(0,40,0);}
.bg-green-50{background-color: rgb(0,50,0);}
.bg-green-60{background-color: rgb(0,60,0);} 
.bg-green-70{background-color: rgb(0,70,0);} 
.bg-green-80{background-color: rgb(0,80,0);}
.bg-green-90{background-color: rgb(0,90,0);}
.bg-green-100{background-color: rgb(0,100,0);}
.bg-green-110{background-color: rgb(0,110,0);}
.bg-green-120{background-color: rgb(0,120,0);}
.bg-green-130{background-color: rgb(0,130,0);}
.bg-green-140{background-color: rgb(0,140,0);}
.bg-green-150{background-color: rgb(0,150,0);} 
.bg-green-160{background-color: rgb(0,160,0);}
.bg-green-170{background-color: rgb(0,170,0);}
.bg-green-180{background-color: rgb(0,180,0);}
.bg-green-190{background-color: rgb(0,190,0);}
.bg-green-200{background-color: rgb(0,200,0);}
.bg-green-210{background-color: rgb(0,210,0);}
.bg-green-220{background-color: rgb(0,220,0);}
.bg-green-230{background-color: rgb(0,230,0);}
.bg-green-240{background-color: rgb(0,240,0);}
.bg-green-250{background-color: rgb(0,250,0);} 
.bg-green-255{background-color: rgb(0,255,0);}

.bg-blue-0{background-color: rgb(0,0,0);}
.bg-blue-5{background-color: rgb(0,0,5);}
.bg-blue-10{background-color: rgb(0,0,10);}
.bg-blue-20{background-color: rgb(0,0,20);} 
.bg-blue-30{background-color: rgb(0,0,30);} 
.bg-blue-40{background-color: rgb(0,0,40);}
.bg-blue-50{background-color: rgb(0,0,50);}
.bg-blue-60{background-color: rgb(0,0,60);} 
.bg-blue-70{background-color: rgb(0,0,70);} 
.bg-blue-80{background-color: rgb(0,0,80);}
.bg-blue-90{background-color: rgb(0,0,90);}
.bg-blue-100{background-color: rgb(0,0,100);}
.bg-blue-110{background-color: rgb(0,0,110);}
.bg-blue-120{background-color: rgb(0,0,120);}
.bg-blue-130{background-color: rgb(0,0,130);}
.bg-blue-140{background-color: rgb(0,0,140);}
.bg-blue-150{background-color: rgb(0,0,150);} 
.bg-blue-160{background-color: rgb(0,0,160);}
.bg-blue-170{background-color: rgb(0,0,170);}
.bg-blue-180{background-color: rgb(0,0,180);}
.bg-blue-190{background-color: rgb(0,0,190);}
.bg-blue-200{background-color: rgb(0,0,200);}
.bg-blue-210{background-color: rgb(0,0,210);}
.bg-blue-220{background-color: rgb(0,0,220);}
.bg-blue-230{background-color: rgb(0,0,230);}
.bg-blue-240{background-color: rgb(0,0,240);}
.bg-blue-250{background-color: rgb(0,0,250);} 
.bg-blue-255{background-color: rgb(0,0,255);}

.bg-scale-0{background-color: rgb(0,0,0);}
.bg-scale-1{background-color: rgb(1,1,1);}
.bg-scale-2{background-color: rgb(2,2,2);}
.bg-scale-3{background-color: rgb(3,3,3);}
.bg-scale-4{background-color: rgb(4,4,4);}
.bg-scale-5{background-color: rgb(5,5,5);}
.bg-scale-6{background-color: rgb(6,6,6);}
.bg-scale-7{background-color: rgb(7,7,7);}
.bg-scale-8{background-color: rgb(8,8,8);}
.bg-scale-9{background-color: rgb(9,9,9);}
.bg-scale-10{background-color: rgb(10,10,10);}
.bg-scale-11{background-color: rgb(11,11,11);}
.bg-scale-12{background-color: rgb(12,12,12);}
.bg-scale-13{background-color: rgb(13,13,13);}
.bg-scale-14{background-color: rgb(14,14,14);}
.bg-scale-15{background-color: rgb(15,15,15);}
.bg-scale-16{background-color: rgb(16,16,16);}
.bg-scale-17{background-color: rgb(17,17,17);}
.bg-scale-18{background-color: rgb(18,18,18);}
.bg-scale-19{background-color: rgb(19,19,19);}
.bg-scale-20{background-color: rgb(20,20,20);} 
.bg-scale-21{background-color: rgb(21,21,21);} 
.bg-scale-22{background-color: rgb(22,22,22);} 
.bg-scale-23{background-color: rgb(23,23,23);} 
.bg-scale-24{background-color: rgb(24,24,24);} 
.bg-scale-25{background-color: rgb(25,25,25);}
.bg-scale-26{background-color: rgb(26,26,26);}
.bg-scale-27{background-color: rgb(27,27,27);}
.bg-scale-28{background-color: rgb(28,28,28);}
.bg-scale-29{background-color: rgb(29,29,29);}
.bg-scale-30{background-color: rgb(30,30,30);} 
.bg-scale-31{background-color: rgb(31,31,31);}
.bg-scale-32{background-color: rgb(32,32,32);}
.bg-scale-33{background-color: rgb(33,33,33);}
.bg-scale-34{background-color: rgb(34,34,34);}
.bg-scale-35{background-color: rgb(35,35,35);}
.bg-scale-36{background-color: rgb(36,36,36);}
.bg-scale-37{background-color: rgb(37,37,37);}
.bg-scale-38{background-color: rgb(38,38,38);}
.bg-scale-39{background-color: rgb(39,39,39);}
.bg-scale-40{background-color: rgb(40,40,40);}
.bg-scale-45{background-color: rgb(45,45,45);}
.bg-scale-50{background-color: rgb(50,50,50);}
.bg-scale-55{background-color: rgb(55,55,55);}
.bg-scale-60{background-color: rgb(60,60,60);} 
.bg-scale-65{background-color: rgb(65,65,65);}
.bg-scale-70{background-color: rgb(70,70,70);} 
.bg-scale-75{background-color: rgb(75,75,75);}
.bg-scale-80{background-color: rgb(80,80,80);}
.bg-scale-85{background-color: rgb(85,85,85);}
.bg-scale-90{background-color: rgb(90,90,90);}
.bg-scale-95{background-color: rgb(95,95,95);}
.bg-scale-100{background-color: rgb(100,100,100);}
.bg-scale-105{background-color: rgb(105,105,105);}
.bg-scale-110{background-color: rgb(110,110,110);}
.bg-scale-115{background-color: rgb(115,115,115);}
.bg-scale-120{background-color: rgb(120,120,120);}
.bg-scale-125{background-color: rgb(125,125,125);}
.bg-scale-130{background-color: rgb(130,130,130);}
.bg-scale-135{background-color: rgb(135,135,135);}
.bg-scale-140{background-color: rgb(140,140,140);}
.bg-scale-145{background-color: rgb(145,145,145);}
.bg-scale-150{background-color: rgb(150,150,150);} 
.bg-scale-155{background-color: rgb(155,155,155);}
.bg-scale-160{background-color: rgb(160,160,160);}
.bg-scale-165{background-color: rgb(165,165,165);}
.bg-scale-170{background-color: rgb(170,170,170);}
.bg-scale-175{background-color: rgb(175,175,175);}
.bg-scale-180{background-color: rgb(180,180,180);}
.bg-scale-185{background-color: rgb(185,185,185);}
.bg-scale-190{background-color: rgb(190,190,190);}
.bg-scale-195{background-color: rgb(195,195,195);}
.bg-scale-200{background-color: rgb(200,200,200);}
.bg-scale-205{background-color: rgb(205,205,205);}
.bg-scale-210{background-color: rgb(210,210,210);}
.bg-scale-215{background-color: rgb(215,215,215);}
.bg-scale-220{background-color: rgb(220,220,220);}
.bg-scale-225{background-color: rgb(225,225,225);}
.bg-scale-230{background-color: rgb(230,230,230);}
.bg-scale-235{background-color: rgb(235,235,235);}
.bg-scale-240{background-color: rgb(240,240,240);}
.bg-scale-241{background-color: rgb(241,241,241);}
.bg-scale-242{background-color: rgb(242,242,242);}
.bg-scale-243{background-color: rgb(243,243,243);}
.bg-scale-244{background-color: rgb(244,244,244);}
.bg-scale-245{background-color: rgb(245,245,245);}
.bg-scale-246{background-color: rgb(246,246,246);} 
.bg-scale-247{background-color: rgb(247,247,247);} 
.bg-scale-248{background-color: rgb(248,248,248);} 
.bg-scale-249{background-color: rgb(249,249,249);} 
.bg-scale-250{background-color: rgb(250,250,250);} 
.bg-scale-251{background-color: rgb(251,251,251);} 
.bg-scale-252{background-color: rgb(252,252,252);} 
.bg-scale-253{background-color: rgb(253,253,253);} 
.bg-scale-254{background-color: rgb(254,254,254);} 
.bg-scale-255{background-color: rgb(255,255,255);}

.bg-scale-cacaca { background: #cacaca; }

.small-box { line-height: 1; font-size: 14px; padding: 2px 5px; display: inline-block; white-space: nowrap; margin: 8px 3px; border-radius: 10px; color: #fff; }
.small-box.dark { color: #000; }

.bg-gray-gradient-right{background:linear-gradient(to right, rgb(255,255,255), rgb(0,0,0))}
.bg-gray-gradient-left{background:linear-gradient(to left, rgb(255,255,255), rgb(0,0,0))}

.scalerow {  }
.scalerow:after { display:table; clear:both; content:''; }
.scalerow .bg-block { width: 10%; float:left; }
.scalerow.half-w .bg-block { width: 5%; float:left; }

.contrast {  }
.contrast:after { display:table; clear:both; content:''; }
.contrast .bg-block { width: 10%; float:left; }
.contrast .bg-block.half-w { width: 5%; float:left; }
.contrast.half-w .bg-block { width: 10%; float:left; }

.gamma {  }
.gamma:after { display:table; clear:both; content:''; }
.gamma .bg-block { width: 10%; float:left; }
.gamma .bg-block.half-w { width: 5%; float:left; }
.gamma.half-w .bg-block { width: 10%; float:left; }

.grayscale {  }
.grayscale:after { display:table; clear:both; content:''; }
.grayscale .bg-block { width: 10%; float:left; }
/*.grayscale.half .bg-block { width: 5%; float:left; }*/
.grayscale.half-w .bg-block { width: 5%; float:left; }

.black {  }
.black:after { display:table; clear:both; content:''; }
.black .bg-block.bg-sharp { width: 1px; float:left; background-color: black; }
.black .bg-block.bg-sharp-w { width: 1px; float:left; background-color: white; }
.black .bg-block.bg-sharp-2 { width: 2px; float:left; background-color: black; }
.black .bg-block.bg-sharp-w-2 { width: 2px; float:left; background-color: white; }
.black .bg-block.bg-sharp-3 { width: 3px; float:left; background-color: black; }
.black .bg-block.bg-sharp-w-3 { width: 3px; float:left; background-color: white; }
.black .bg-sharp-horizontal { height:1px; width: 100%; background-color: black; }
.black .bg-sharp-horizontal-w { height:1px; width: 100%; background-color: white; }
.black .bg-sharp-horizontal-2 { height:2px; width: 100%; background-color: black; }
.black .bg-sharp-horizontal-w-2 { height:2px; width: 100%; background-color: white; }
.black .bg-sharp-horizontal-3 { height:3px; width: 100%; background-color: black; }
.black .bg-sharp-horizontal-w-3 { height:3px; width: 100%; background-color: white; }
.black .bg-block { width: 10%; float:left; }
.black .bg-block.half-w { width: 5%; float:left; }
/*.grayscale.half .bg-block { width: 5%; float:left; }*/
.black.half-w .bg-block { width: 10%; float:left; }