nav{width:40%}nav>ul>li{width:50%}ul{gap:5px;margin:0;padding:0;display:flex;justify-content:flex-start}li{list-style-type:none}li>a>button{font-size:100%;width:100%}.headerH1{font-size:4vw;margin-top:0}.headerContainer{display:flex;flex-direction:column;background-color:var(--background-color-secondary);padding:5px}.HeaderBar{display:flex;justify-content:space-evenly;align-items:flex-end}@media screen and (max-width: 500px){.headerH1{font-size:clamp(5px,6vw,40px)}}.cart-menu{display:flex;justify-content:center;align-items:center;width:20%;min-height:100%;position:relative;border-radius:8px}.cart-menu:hover,.cart-menu-expanded:hover{border-color:var(--button-hover)}.cart-menu:active{background-color:#2b2b2b}.cart-menu,.cart-menu-expanded{background-color:var(--button-background);border:2px solid var(--box-border-color);transition:border-color .3s cubic-bezier(.785,.135,.15,.86)}.cart-icon,.total-items-text{font-size:clamp(2px,5vw,15px)}.cart-menu-expanded{border-top:none;border-radius:0 0 20% 20%;width:93%;padding-left:2%;padding-right:3%;padding-bottom:5%;position:absolute;top:100%;right:0;z-index:3;display:flex;flex-direction:column;overflow-x:hidden}.cart-item{display:flex;flex-direction:column;font-size:1vw;max-height:50vh;overflow-y:scroll}.cart-item-header{display:grid;grid-template-columns:1fr 5fr 2fr 2fr;border-bottom:1px solid var(--single-border-color)}.cart-item-preview{display:grid;grid-template-columns:1fr 5fr 2fr 2fr}.cart-total{font-size:1.5vw;border-top:2px solid var(--single-border-color);border-bottom:4px double var(--single-border-color)}.checkout-button{font-size:2vw;background-color:var(--button-background-important)}@media screen and (max-width: 500px){.cart-menu{width:40%}.cart-menu-expanded{padding-top:10%;border-radius:15%;right:-5vw;width:120%}.cart-item{font-size:2vw}.cart-icon,.total-items-text{font-size:clamp(2px,3vw,50px)}.cart-total,.checkout-button{font-size:4vw}}.footerContainer{font-size:clamp(8px,1vw,10px);color:var(--text-color);background-color:var(--background-color-secondary)}#root{display:flex;flex-direction:column;position:relative;min-height:100vh;width:100vw}header{text-align:center;position:sticky;top:0;border-bottom:2px solid #444444}main{display:flex;flex-direction:column;align-items:center;padding-left:10vw;padding-right:10vw;padding-bottom:2vh;overflow-y:scroll;text-align:center}footer{font-size:clamp(10px,2vw,12px);text-align:center;position:fixed;bottom:0;width:100%;border-top:2px solid #444444}@media screen and(max-width:320px){main{margin:0}}.image-container>p{margin:0;font-size:.8vw}.image-container>.image{border:2px solid #ccc;border-radius:15%;width:50%}.card{display:flex;flex-direction:column;justify-content:start;align-items:center;text-align:center;background-color:var(--background-color-tertiary);color:var(--text-color);border:3px solid var(--box-border-color);border-radius:15px;padding:10px}.card-image{border:2px solid #303030;border-radius:10%;justify-self:start;width:clamp(20px,50%,200px);aspect-ratio:1 / 1}.card-content{display:flex;flex-direction:column;justify-content:space-between;flex-grow:1}.card-title{font-size:clamp(10px,2vw,30px)}.card-price{font-size:clamp(15px,3vw,50px);margin-top:auto;margin-bottom:0}.card-rating{font-size:clamp(5px,1vw,15px)}.add-to-cart-container{display:flex;flex-direction:column;justify-content:center;align-items:center}.quantity{display:flex;justify-content:center;width:80%}.quantity>input{background-color:var(--background-color-primary);color:var(--text-color);border:1px solid var(--box-border-color);border-radius:10px;font-size:2vw;text-align:center;width:75%;-webkit-appearance:textfield;-moz-appearance:textfield;appearance:textfield}.quantity-buttons{display:flex;flex-direction:column;font-size:clamp(5px,2vw,15px)}.quantity-buttons>button{aspect-ratio:1 / 1;border-radius:10px;width:1.5vw;padding:0}.add-button{font-size:clamp(10px,1.5vw,30px)}@media screen and (max-width:500px){.quantity{max-height:50%;margin-bottom:6px}.quantity>input{font-size:clamp(10px,4vw,20px)}.quantity-buttons{font-size:clamp(5px,4vw,15px)}.quantity-buttons>button{width:5vw}}.card-container{display:grid;grid-template-columns:repeat(4,1fr);gap:5px;margin-bottom:50px}@media screen and (max-width:500px){.card-container{grid-template-columns:repeat(2,1fr)}}.checkout-container{display:flex;flex-direction:column;align-items:center;padding:20px;max-width:80vw}.checkout-container h2{font-size:2vw;margin:0}.checkout-summary{background-color:var(--background-color-tertiary);display:flex;flex-direction:column;border:3px solid var(--box-border-color);margin:0 2% 2%;overflow-y:scroll;height:50vh;width:80vw}.checkout-header{background-color:var(--background-color-quaternary);display:grid;grid-template-columns:1fr 2fr 1fr 1fr;width:100%;border-bottom:0;border-width:3px 3px 0 3px;border-style:solid;border-color:var(--box-border-color)}.checkout-item{display:grid;grid-template-columns:1fr 2fr 1fr 1fr;border-bottom:1px solid var(--box-border-color);padding:1% 5%}.checkout-total{font-size:clamp(20px,2.5vw,50px);border-bottom:8px double var(--single-border-color)}.purchase-now-button{background-color:var(--button-background-important);width:50%;font-size:1.5vw;margin:10px}@media screen and (max-width: 500px){.checkout-container{padding:0}.checkout-container>h2{font-size:6vw}.checkout-container{font-size:50%}.purchase-now-button{font-size:4vw}}:root[data-theme=dark]{--background-color-primary: #353535;--background-color-secondary: #242424;--background-color-tertiary: #2b2b2b;--background-color-quaternary: #222222;--box-border-color: #0e0e0e83;--single-border-color: #aaaaaa;--text-color: white;--link-color: #676eff;--button-background: #1a1a1a;--button-background-important: #2000d6ec;--button-hover: #646cff}:root[data-theme=light]{--background-color-primary: #f4f4f4;--background-color-secondary: #ff8800;--background-color-tertiary: #ff9900d3;--background-color-quaternary: #ff9900;--box-border-color: #1a1a1a;--single-border-color: #1a1a1a;--text-color: black;--link-color: #213547;--button-background: #ffffff;--button-background-important: #008cff8f;--button-hover: #00f7ff}:root{font-family:Inter,system-ui,Avenir,Helvetica,Arial,sans-serif;line-height:1.5;font-weight:400;color-scheme:light dark;color:var(--text-color);background-color:var(--background-color-primary);font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;transition:.3s ease-in-out}a{font-weight:500;color:var(--link-color);text-decoration:inherit}a:hover{color:#535bf2}body{margin:0;display:flex;min-width:320px;min-height:100vh}h1{font-size:3.2em;line-height:1.1}button{border-radius:8px;border:2px solid var(--box-border-color);padding:.6em 1.2em;font-size:1em;font-weight:500;font-family:inherit;background-color:var(--button-background);color:var(--text-color);cursor:pointer;transition:border-color .25s}button:hover{border-color:var(--button-hover)}button:focus,button:focus-visible{outline:4px auto -webkit-focus-ring-color}