body { margin: 0; font-family: Arial, sans-serif; line-height: 2.2;}.hseparator { width: 0.6em;}.box-number { padding:0.3em 0.6em 0.3em 0.6em; border:1px solid black; color:white; background-color: #999; --border-radius: 100%; }p, br { padding-bottom: 1em;}input[type=text],input[type=number] { padding: 1em; font-size: 1.4em; margin-bottom: 1em; border:none; border-left: 0.6em solid #DDD; font-family: "Inconsolata"; text-transform: uppercase; width: 100%;}input[type=text]:hover,input[type=number]:hover{ border-left: 0.6em solid #000;}input[type=text]:focus,input[type=number]:focus { color: #FFF; background: #000;}input[type=button], input[type=submit], input[type=reset] { cursor:pointer; font-size: 1em; border:1px solid black; border-radius: 0.3em; padding: .7em;}input[type=button]:hover, input[type=submit]:hover, input[type=reset]:hover { cursor:pointer; color:white; background-color: black;}.form { margin-left: .5em; border-left: 0.6em solid #DDD; padding-left: .5em;}.form:hover { border-left: 0.6em solid black;}.header { margin: 0; line-height: 1;}a.top:link, a.top:visited { color: blue;}a:link, a:visited { color: blue; text-decoration: none;}a.top:hover{ text-decoration: none; border:0; color:green; } a:hover { border-top: 1px solid white; border-bottom: 1px solid white; animation: blinker 2s linear infinite; padding-top: .8em; padding-bottom: .8em; border-radius: 0.8em;}h1, h2, h3 { padding-left: 0.8em; text-transform: uppercase;}a.menu:link, a.menu:visited { padding-right: 0.8em; padding-left: 0.8em; color:black;}a.menu:hover { text-decoration: none; border:none; animation: none; background: black; color:white; border-radius: 0; padding-top: 2em; padding-bottom: 2em;}.footer { background-color: #DDD; color:#666; padding-bottom: 1em; padding-bottom: 1em;}.brand-font { font-family: "Inconsolata";}.brand { background-color: #000; color:#FFF; padding:0.3em;}footer { font-size: 1em; text-transform: capitalize; padding-bottom: 1em; padding-top: 1em;}.capitalize { text-transform: capitalize;}.upper {text-transform: uppercase;}.hero { height: 100vh; background: linear-gradient(to right, #6a11cb, #2575fc); color: white; display: flex; flex-direction: column; justify-content: center; align-items: center; text-align: center; padding: 20px; font-family: "Inconsolata"}.hero h1 { font-size: 2.5rem; margin-bottom: 15px;}.hero p { font-size: 1.2rem; max-width: 600px;}.lightbox-overlay { line-height: 1; position: fixed; top: 0; left: 0; width: 100%; height: 100%; background: rgba(255,255,255,0.7); display: flex; justify-content: center; align-items: center; visibility: hidden; opacity: 0; transition: opacity 0.3s ease, visibility 0.3s ease; z-index: 1000;}.lightbox-overlay.active { visibility: visible; opacity: 1;}.lightbox { background: #FFF; padding: 20px; border-radius: 8px; max-width: 90%; width: 400px; position: relative; text-align: center; border: 1px solid #DDD;}.lightbox h2 { margin-top: 0;}.close-btn { position: absolute; top: 10px; right: 15px; font-size: 20px; cursor: pointer; color: #000; border-top:1px solid #FFF; border-bottom:1px solid #FFF; border-radius: 20%; padding:0.3em;}.content { margin-left: .5em; border-left: 0.6em solid yellowgreen; padding-left: .5em;}.close-btn:hover { background-color:#FFF; color: #000; border-top:1px solid #000; border-bottom:1px solid #000;}.orange { padding:10px; background-color: #EE9C6C;}.green { padding:10px; background-color: #80BEAF;}.purple { padding:10px; background-color: #BE14B4;}.promo { width:100%; font-family: monospace; color: #FFF;}.promo-title { color: #333; line-height: 0.6;}div .progress-bar { --background-color: #779933; padding:0.3em; color: #DDD; font-weight: bold; font-family: "Inconsolata"; --animation: blinker 1s linear infinite; background-image: url("https://beboom.cc/bg.png"); background-repeat: repeat; font-size:1.7em; opacity: 1;} div .progress { border:1px solid #CCC; padding: 0.3em; height: 5vh; opacity: 1;}.small { margin-top: -1em; font-family: monospace; font-size: 0.7em; text-transform: uppercase;}.backtop { font-size: 2em; position:fixed; bottom:1em; right:1em; padding:10px; height: 25px; --border:1px solid #666; border-radius:20%; display: inline-block; --background-color:#FFFFFF; vertical-align: middle; opacity: 0.8; color:blue; animation: blinker 3s linear infinite;}.backtop:hover { color: #5C85EC; --border:1px solid blue;}@keyframes blinker { 50% { opacity: 0; }}@media (max-width: 600px) { .hero h1 { font-size: 1.8rem; } .hero p { font-size: 1rem; }}