@import url("https://fonts.googleapis.com/css2?family=Michroma&display=swap");@import url("https://fonts.googleapis.com/css2?family=WDXL+Lubrifont+TC&display=swap");.michroma-regular{font-family:Michroma,sans-serif;font-weight:400;font-style:normal}body{font-family:Instrument Sans,sans-serif;margin:0;padding:0;background-color:#1c1917}.sec4Btns{display:none}.scrollLeftButton,.scrollRightButton{background-color:#2C2C2C;color:#fff;border:none;padding:8px 16px;border-radius:8px;cursor:pointer;transition:background-color .2s ease-in;height:2em;font-size:2em;align-self:center}.scrollLeftButton{margin-left:.5em}.scrollRightButton{margin-right:.5em;margin-left:.5em}.scrollButtonContainer{display:flex;width:100vw;position:relative;left:-2vw}.title{font-family:Michroma,sans-serif;font-size:2.5em;color:#e3e6e8;left:1em;top:-.3em}.header,.title{position:absolute}.header{width:97.5%;top:0;left:0;padding:1em;background-color:#1c1917;border-bottom:1px solid #333;height:3em}.boardContainer{padding-top:3em;border-radius:8px;display:flex;flex-direction:column}.section{display:flex;overflow-x:scroll;overflow-y:hidden;width:80vw;height:17em;margin-left:1em}.section.textSection{height:7em}.section::-webkit-scrollbar{background-color:transparent;height:1px}.card.selectedFinish{background-color:rgba(255,77,77,.1);transform:scale(.98);transition:all .2s ease-in-out}.cardText.selectedFinishText{color:#2C2C2C}@keyframes shake{0%{transform:rotate(-1.6deg) translateY(0)}10%{transform:rotate(1.5deg) translateY(-.5px)}20%{transform:rotate(-1.3deg) translateY(.2px)}30%{transform:rotate(1.6deg) translateY(-.3px)}40%{transform:rotate(-1.4deg) translateY(.4px)}50%{transform:rotate(1.4deg) translateY(-.2px)}60%{transform:rotate(-1.7deg) translateY(.1px)}70%{transform:rotate(1.3deg) translateY(-.4px)}80%{transform:rotate(-1.5deg) translateY(.3px)}90%{transform:rotate(1.6deg) translateY(-.1px)}to{transform:rotate(-1.6deg) translateY(0)}}@media (prefers-reduced-motion:reduce){.icon{animation:none}}.card{background-color:#292827;padding:1vh;border-radius:8px;height:15em;width:15em;margin:auto 1vw;overflow:visible;display:inline-block;transform-origin:50% 60%}.card,.card:hover{transition:all .2s ease-in-out}.card:hover{transform:scale(1.02)}.card.textCard{height:5em;width:18em;color:#e3e6e8;justify-content:center;transition:all .5s ease-in-out}.cardImg{height:15em;width:15em;object-fit:cover;transition:height .5s ease-in-out}.cardText{font-family:Michroma,sans-serif;font-size:2em;height:1.5em;text-wrap:nowrap;margin:.5em auto auto;display:flex;justify-content:center;transition:all .5s ease-in-out}.cardText.finishText{font-size:1.3em;margin:1em auto auto;text-align:center}.cardDelete.finishDelete,.editButton.finishEditButton{top:1.5em;height:2.5em}.cardDisc{color:#fff;margin:auto 1px;font-size:1.2em}.addCard{background-color:#131313a8;border-bottom:1px solid #333;color:#e3e6e8;padding:1.5vh;margin:2em auto;height:100%;width:100%;transition:all .2s ease-in-out;overflow-y:hidden;overflow:visible;display:flex;flex-direction:column;align-items:center;border-radius:8px}#priceInput,#rowInput{width:35%}.card.active{border:2px solid #3995e6;background-color:rgba(57,149,230,.1);transform:scale(1.02);transition:all .2s ease-in-out}.inputBox{border:none;padding:8px;border-radius:4px;background-color:#2C2C2C;color:#fff;width:80%;height:50%}.inputBox:focus{outline:none}.pairText{display:flex;width:50%;margin:16px 8px}.submitButton{color:#fff;padding:8px 16px;font-size:1em;height:2.5em;border:1px solid #3995e6;border-radius:4px;cursor:pointer;margin:16px;background:transparent;position:relative;overflow:hidden;transition:all .2s ease-in-out}.submitButton:before{content:"";position:absolute;height:100%;width:0;top:0;left:-40px;transform:skewX(45deg);background-color:#3995E6;z-index:-1;transition:all .5s}.submitButton:hover{color:white}.submitButton:hover:before{width:160%}.cardDelete{background-color:#1c1917;color:#ff4d4d;padding:8px;border:none;z-index:10;border-radius:8px 0 0 0;cursor:pointer;position:relative;left:-.6em;width:35%;height:25%;top:1%;transition:left .26s linear,width .25s linear,height .25s linear,font-size .25s linear}.cardDelete.textDelete{left:-.6em;top:.6em;height:2.5em}.cardDelete:hover{scale:1.05;border:1px dashed #ff4d4d;z-index:1000;border-radius:8px 0 0 8px}.editButton{background-color:#1c1917;color:#e3e6e8;padding:8px;border:none;z-index:10;border-radius:0 0 8px 0;cursor:pointer;position:relative;left:-.6em;width:35%;height:25%;top:1%}.editButton:hover{scale:1.05;border:1px dashed #e3e6e8;border-radius:0 8px 8px 0}.editButton.textEditButton{left:-.6em;top:.6em;height:2.5em}.buttonContainer{position:relative;top:-110%;height:100%;gap:8px;margin-top:8px}.cardInfoWrapper{display:flex;justify-content:space-between;height:0;overflow:hidden;transition:all .5s ease-in-out;white-space:nowrap}.linkButton{background-color:#2C2C2C;color:#fff;border:none;padding:8px 16px;position:relative;z-index:10;border-radius:4px;cursor:pointer;transition:background-color .2s ease-in;margin:auto 1px;height:2em;font-size:1em}.linkButton:hover{background-color:#e3e6e8;color:#1c1917}.toggleSinglesButton{right:22em}.toggleSingleDrop,.toggleSinglesButton{background-color:#1c1917;color:#fff;padding:8px 16px;border:none;border-radius:4px;cursor:pointer;transition:background-color .2s ease-in-out;height:calc(1em + 8px);display:flex;position:absolute;top:1.5em}.toggleSingleDrop{right:12em;display:none}.toggleSinglesText{margin:auto 8px;font-size:1em;font-weight:100}.toggleDetailsButton{background-color:#2C2C2C;color:#fff;padding:8px 16px;border:none;border-radius:4px;cursor:pointer;transition:background-color .2s ease-in-out;height:calc(1em + 8px);display:flex;position:absolute;right:12em}.toggleDetailsButton:hover{background-color:#e3e6e8;color:#1c1917}.toggleDetailsButton:hover .toggleDetailsIcon{filter:invert(.3)}.shDetails{margin:auto 8px;font-size:1em;font-weight:lighter}.toggleDetailsIcon{width:24px;height:24px;filter:invert(1);animation:.3s ease-in-out forwards}.adminLoginButton{background-color:#1c1917;color:#fff;padding:8px 16px;border:1px solid #3995e6;border-radius:4px;cursor:pointer;font-size:1em;font-weight:lighter;height:2.5em}.adminLoginButton:hover{background-color:#2a7bbf}.adminLogoutButton{background-color:#1c1917;color:#e3e6e8;padding:8px 16px;border:1px solid #ff4d4d;border-radius:4px;cursor:pointer;font-size:1em;height:2.5em;margin-right:2.5em;right:0;position:absolute}.adminLogoutButton:hover{background-color:#ff4d4d;color:#fff}.sectionTitle{font-weight:100;color:#e3e6e8;margin-left:1em;margin-top:1vw;margin-bottom:0}.totalContainer{width:-moz-fit-content;width:fit-content;display:flex;align-items:center;margin:1vw;justify-self:flex-end}.totalTitle{color:#e3e6e8;font-size:1.5em;margin-right:.5em}.totalPrice{color:#e3e6e8;font-size:2.5em}.labourFeeTitle{color:#e3e6e8;font-weight:100;margin-left:1em;margin-right:1em}.labourFeeContainer{display:flex;align-items:center;margin:1vw}.resetButton{background-color:#1c1917;color:#fff;padding:8px 16px;border:1px solid #ff4d4d;border-radius:4px;cursor:pointer;transition:background-color .2s ease-in-out;margin-left:1vw;font-size:1.3em}.resetButton:hover{background-color:#ff4d4d;color:#fff}.resetContainer{display:flex;align-items:center}.stickyFooter{position:-webkit-sticky;position:sticky;bottom:0;background-color:#1c1917;padding:10px 0;margin-top:10px;border-top:1px solid #333;z-index:100}.footerFlex{display:flex;justify-content:space-between;align-items:center}.stickyFooterShadow{position:fixed;bottom:0;left:0;width:100%;height:9em;background-color:#1c1917;z-index:99}.inputFee{border:.5px solid #e3e6e8;padding:8px;border-radius:4px;margin:6px 5px;background-color:#1c1917;color:#fff}.inputFee:focus{outline:none}.addCardButton{border:.5px solid #e3e6e8;padding:1vh;height:25vh;width:25vh;transition:all .2s ease-in-out;margin:auto 1vw;display:flex;justify-content:center;align-items:center}.addCardIcon{filter:invert(1);width:25vh;height:25vh;cursor:pointer;transition:transform .3s ease}.addButtonContainer{display:flex}.fullContainer{display:flex;align-items:center;background-color:#1c1917;z-index:1000}.addCol1,.addCol2{display:flex}.loginContainer{width:8em;gap:8px;right:3em}.loginBlock,.loginContainer{display:flex;flex-direction:column;position:absolute}.loginBlock{border-radius:8px;padding:8px;background-color:#131313;width:15em;top:3em;right:0}.loginInput{margin:8px;border:none;padding:8px;border-radius:4px;background-color:#1c1917;color:#fff}.loginInput:focus{outline:none}.loginButton{background-color:#1c1917;color:#fff;padding:8px 16px;border:.5px solid #3995e6;border-radius:4px;cursor:pointer;transition:background-color .2s ease-in-out;font-size:1em;font-weight:lighter;height:2.5em;margin:8px}.loginButton:hover{background-color:#2a7bbf}.adminLoginText{color:#e3e6e8;font-size:1.5em;margin-bottom:.5em;margin-top:.5em}.customPriceCard{display:flex;flex-direction:column;align-items:center;width:18em}.customInputBox{border:none;padding:8px;border-radius:4px;background-color:#2C2C2C;color:#fff;width:17em}.customInputBox:focus{outline:none}.addTitle{color:#e3e6e8;font-size:1.2em;font-weight:100;margin-bottom:8px}.connectionSelector{margin-bottom:16px;display:flex;margin-left:1em;margin-right:1em;height:8em}.connectionButton{display:flex;background-color:#292827;color:#e3e6e8;padding:8px 16px;border-radius:8px;cursor:pointer;border:none;font-size:1em;height:4em;width:50vw;font-size:1.5em;margin:.5em 8px 8px;transition:transform .2s ease-in-out,background-color .2s ease-in-out}.connectionButton.active{border:2px solid #3995e6;background-color:rgba(57,149,230,.1);transform:scale(1.02);transition:all .2s ease-in-out}.connectionButton:hover{transform:scale(1.02)}.connectionLabel{margin:auto;font-family:Michroma,sans-serif}#section-4,#section-4-title{display:none}.progressBarContainer{display:flex;border:1px solid #e3e6e8;width:60%;height:1.5em;border-radius:8px;justify-self:start}.progressBarWrapper{width:60%}.progressBarWrapper,.progressCard{border:1px solid #e3e6e8}.mobileProgressBar{display:none;width:100%;height:1em;margin-bottom:-.5em;z-index:100;background-color:#1c1917}.singleSectionContainer{margin-top:5em}.longTxt{font-size:1em;padding:1em}@media only screen and (max-width:600px){.shDetails{display:none}.section{height:18em;width:95%;margin-left:0}.section.textSection{height:9em}.sectionTitle{margin-left:0}.addCard{width:87vw}.pairText{flex-direction:column;padding:8px}.addText{margin:8px 0}#urlInput{width:100%}#priceInput{width:60%}#rowInput{width:50%}.cardDelete{top:0;left:-1em}.cardDelete.textDelete{left:-1em;top:0;height:2.5em}.editButton{top:0;left:-1em}.editButton.textEditButton{left:-1em;top:0;height:2.5em}.title{left:8px;margin-top:1em;font-size:2em}.adminLoginButton{position:absolute;right:-3em}.toggleDetailsButton{position:absolute;right:9em}.adminLogoutButton{margin-right:0}.connectionButton{height:auto;width:50%;display:flex;justify-content:center;align-items:center;padding:0}.connectionLabel{font-size:1em}.connectionSelector{display:flex;margin-left:0;height:8em;width:105%}.scrollLeftButton,.scrollRightButton{display:none}.mobileProgressBar{display:flex}.desktopProgressBar{display:none}.cardText.long{margin-top:1.5em;font-size:1em}.toggleSinglesButton{display:none}.toggleSingleDrop{display:flex;right:19em;top:3em;width:2em;z-index:1000}}.inputs{display:flex;flex-direction:column;gap:8px;margin:auto}.addContainer{display:flex;gap:16px;margin-top:8px}.addText{color:lightgray;font-size:1.2em;margin-top:8px}.addSection{display:flex;flex-direction:column;gap:8px;margin:auto}.selectOption{background-color:#1c1917;color:#e3e6e8;border-radius:8px;font-size:1.3em;height:2em;margin-bottom:1em}.selectOption:focus{outline:none}.escBtn{background-color:#2C2C2C;color:#e3e6e8;border:none;border-radius:8px;height:3em;margin-left:.5em}