/* width */ ::-webkit-scrollbar { width: 5px; } /* Track */ ::-webkit-scrollbar-track { background: #000000; } /* Handle */ ::-webkit-scrollbar-thumb { background: #888; } /* Handle on hover */ ::-webkit-scrollbar-thumb:hover { background: #555; } .warning-block{ background: rgb(255, 53, 53); box-shadow: 0 10px 0 rgb(182, 1, 1); margin-bottom: 40px; margin-top: 20px; text-align: center; padding: 15px; font-weight: bold; } body{ //background-image: linear-gradient(0deg, rgba(17, 17, 17, 0.8), rgba(17, 17, 17, 0.8)), url('../images/dirt.png'); color: whitesmoke; background-color: rgb(31, 31, 31); background-size: cover, 150px 150px; margin: 0; padding: 0; overflow-x: hidden; position: relative; min-height: 100vh; padding-bottom: 500px; font-family: Raleway; } input[type=text]{ font-size: 15px; border: none; border-radius: 0px; padding: 10px; transition: 0.2s; font-family: Raleway; color: black; display: block; font-weight: bold; box-shadow: 0 10px 0 rgb(209, 209, 209); &:hover{ box-shadow: 0 15px 0 rgb(209, 209, 209); cursor: pointer; translate: 0 -5px; } &:focus{ outline: none; box-shadow: 0 5px 0 rgb(143, 143, 143); background: rgb(223, 223, 223); cursor: text; translate: 0 5px; scale: 1; } } .button, button{ text-decoration: none; color: white; display: block; font-family: Raleway; font-size: 15px; background: rgb(255,165,0); font-weight: bold; padding: 10px; text-align: center; width: fit-content; box-shadow: 0 10px 0 rgb(192, 125, 0); transition: 0.2s; text-transform: uppercase; border: none; cursor: pointer; &:hover{ box-shadow: 0 15px 0 rgb(192, 125, 0); translate: 0 -5px; } &:active{ box-shadow: 0 5px 0 rgb(192, 125, 0); translate: 0 5px; scale: 1.1; } } @font-face { font-family: PSP; src: url("../fonts/PressStart2P.ttf"); } @font-face { font-family: Freeman; src: url('../fonts/Freeman-Regular.ttf'); } @font-face { font-family: Raleway; src: url('../fonts/Raleway-VariableFont_wght.ttf'); } h1{ text-align: center; font-family: Freeman; font-size: 80px; padding: 20px; margin: 0; } h2{ text-align: center; margin: 0; font-size: 25px; } .content-container{ width: 1200px; z-index: 0; padding: 20px; margin-left: auto; margin-right: auto; overflow: hidden; } .title-container{ background: url("../images/bg-alt1.png"); background-repeat: no-repeat; background-position: center; background-attachment: fixed; background-size: cover; padding: 20px; padding-left: 60px; box-shadow: 0 0px 30px rgb(22, 22, 22) inset; h1{ font-family: PSP ; text-align: center; font-size: 80px; margin: 0; text-shadow: 4px 4px black, -4px -4px black, 4px -4px black, -4px 4px black; span{ color: orange; } } } /*# sourceMappingURL=base.css.map */ .logo{ display: block; overflow:visible; margin-top: 10px !important; padding: 0 !important; font-family: PSP ; font-size: 165px; text-shadow: 5px 5px black, -5px -5px black, 5px -5px black, -5px 5px black, 0px 0px 20px; span{ color: orange; } &:nth-child(2){ translate: 165px 0; margin-top:5px !important; @-moz-document url-prefix() { margin-top: -35px !important; translate: 168px 0; } } } .nav-container{ background: rgb(80, 80, 80); height: fit-content; position: sticky; top: 0; z-index: 100; box-shadow: 0 10px 0 rgb(53, 53, 53); ul{ list-style: none; transition: 0.2s; padding: 0; margin: 0; width: fit-content; margin-left: auto; margin-right: auto; a{ transition: 0.3s; color: white; text-decoration: none; display: inline-block; margin-left: 20px; margin-right: 20px; cursor:pointer; div{ height: 4px; width: 0px; margin-left: auto; margin-right: auto; background: orange; transition: 0.3s; } p{ font-size: 17px; margin: 10px; transition: 0.3s; font-weight: bold; } &:hover{ margin-left: 40px; margin-right: 40px; div{ width: 100%; } } } } } footer{ background: rgb(194, 126, 0); box-shadow: 0 -8px 0 rgb(109, 71, 0); height:250px; display: inline-flex; width: 100%; position: absolute; bottom: 0; .logo-image-container{ position: absolute; top: 50%; translate: 0 -50%; left: 50px; img{ height: 150px; } } .vote-form{ position: absolute; top: 50%; translate: 0 -50%; right: 50px; overflow: hidden; width: fit-content; p{ text-align: center; font-weight: bold; font-size: 25px; margin: 0; margin-bottom: 20px; } input{ margin-bottom: 25px; display: inline-block; } button{ display: inline-block; background-color: rgb(80, 80, 80); box-shadow: 0 10px 0 rgb(53, 53, 53); margin: 0; margin-bottom: 20px; scale: 1; &:hover{ box-shadow: 0 15px 0 rgb(53, 53, 53); } &:active{ box-shadow: 0 5px 0 rgb(53, 53, 53); } } } } table{ width: 100%; background-color: rgb(80, 80, 80); box-shadow: 0 10px 0 rgb(53, 53, 53); box-shadow: 0 10px 0 rg; border-spacing: 0; tr{ &:nth-child(odd){ background-color: rgb(100, 100, 100); } &:first-child{ background: rgb(192, 125, 0); text-align: left; border: none; } a{ opacity: 0; color: rgb(255,165,0); font-weight: bold; text-decoration: solid; transition: 0.1s; } &:hover{ a{ transition: 0.1s; opacity: 1; } } } th{ padding:15px; width: fit-content; padding-left: 30px; padding-right: 30px; font-weight: bold; text-transform: uppercase; border: none; border-bottom: 10px solid rgb(109, 71, 0); border-collapse: collapse } td{ padding: 15px; padding-left: 30px; padding-right: 30px; border: none; } }