header{display:flex;justify-content:space-between;align-items:center;padding:0 20px;background-color:#dcdcdc;margin:0;font-size:x-large;position:sticky;top:0;z-index:10}.swichButton{background-color:#dcdcdc;display:flex;align-items:center;justify-content:center;font-size:30px;text-decoration:none;color:#000;border:none;border-radius:5px;padding:10px 20px;transition:background-color .4s ease,transform .2s ease}.swichButton:hover,.swichButton:focus{background-color:#0003;transform:scale(1.01)}body{margin:0;padding:0;bottom:0}*{box-sizing:border-box}:root{margin:0;padding:0;bottom:0}h1{margin:0}.mainPage{flex:1;display:flex;flex-direction:column;justify-content:center;align-items:center}#root{margin:0;padding:0;bottom:0;height:100%;display:flex;flex-direction:column;height:100vh;background-attachment:fixed;background-position:center;overflow:hidden}.skew{background-color:#dcdcdc;font-size:inherit;position:fixed;bottom:-50vh;right:0;left:0;height:100vh;transform:skewY(7deg);z-index:0}.mainContainer{font-size:xx-large;color:#442727;z-index:10;background-color:#0003;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:20px;gap:10px;border-radius:10px}.mainContainer button{font-size:inherit;background-color:#dcdcdc}.mainContainer button:hover,.mainContainer button:focus{background-color:#fff}.pulsing-button{position:relative;padding:10px 20px;font-size:1.2rem;border:3px solid black;border-radius:40px;cursor:pointer;background-color:#fff;animation:pulseShadow 1.5s ease-out infinite}@keyframes pulseShadow{0%{box-shadow:0 0 #0006}50%{box-shadow:0 0 0 15px #0000}to{box-shadow:0 0 #0000}}.rr--group{display:flex;width:100%;position:relative}.rr--box{display:flex;width:100%;flex-grow:1;-webkit-tap-highlight-color:rgba(0,0,0,0)}.rr--svg{display:flex;aspect-ratio:1;width:100%;flex-grow:1;overflow:clip;pointer-events:none}@supports not (overflow: clip){.rr--svg{overflow:auto}}.rr--box:focus,.rr--box:focus-visible,.rr-reset:focus-visible,.rr-reset:focus{outline:none;box-shadow:none}.rr--focus-reset{outline:6px double #0079ff}.rr--box:focus-visible .rr--svg{outline:6px double #0079ff;isolation:isolate}.rr--reset{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0;right:0;bottom:50%}[dir=rtl] .rr--reset{left:0;right:auto}.rr--dir-y .rr--reset{bottom:0;right:50%}.rr--disabled{opacity:.5;cursor:not-allowed}.rr--disabled .rr--svg{pointer-events:none}.rr--pointer .rr--box{cursor:pointer}.rr--dir-x{flex-direction:row}.rr--dir-y{flex-direction:column}.rr--space-sm .rr--svg{padding:8%}.rr--space-md .rr--svg{padding:12.5%}.rr--space-lg .rr--svg{padding:17.5%}.rr--dir-x.rr--gap-sm .rr--svg{margin:0 6.25%}.rr--dir-x.rr--gap-sm .rr--box:focus-visible:after{width:87.5%;left:6.25%}.rr--dir-x.rr--gap-md .rr--svg{margin:0 12.5%}.rr--dir-x.rr--gap-md .rr--box:focus-visible:after{width:75%;left:12.5%}.rr--dir-x.rr--gap-lg .rr--svg{margin:0 25%}.rr--dir-x.rr--gap-lg .rr--box:focus-visible:after{width:50%;left:25%}.rr--dir-y.rr--gap-sm .rr--svg{margin:6.25% 0}.rr--dir-y.rr--gap-md .rr--svg{margin:12.5% 0}.rr--dir-y.rr--gap-lg .rr--svg{margin:25% 0}.rr--rx-sm .rr--svg{border-radius:5%}.rr--rx-md .rr--svg{border-radius:15%}.rr--rx-lg .rr--svg{border-radius:20%}.rr--rx-full .rr--svg{border-radius:100%}.rr--has-stroke .rr--svg{stroke-linecap:round;stroke-linejoin:round}.rr--has-border .rr--svg{border-width:var(--rr--border-width);border-style:solid}.rr--on .rr--svg{fill:var(--rr--fill-on-color, none)}.rr--off .rr--svg{fill:var(--rr--fill-off-color, none)}.rr--has-stroke .rr--on .rr--svg{stroke:var(--rr--stroke-on-color, currentColor)}.rr--has-stroke .rr--off .rr--svg{stroke:var(--rr--stroke-off-color, currentColor)}.rr--on .rr--svg{background-color:var(--rr--box-on-color, none)}.rr--off .rr--svg{background-color:var(--rr--box-off-color, none)}.rr--has-border .rr--off .rr--svg{border-color:var(--rr--border-off-color, currentColor)}.rr--has-border .rr--on .rr--svg{border-color:var(--rr--border-on-color, currentColor)}.rr--fx-colors{--rr--easing: .2s cubic-bezier(.61, 1, .88, 1)}.rr--fx-colors .rr--svg{transition-duration:.2s;transition-timing-function:var(--rr--easing);transition-property:background-color,border-color,fill,stroke}.rr--fx-opacity .rr--off{opacity:.35;transition:opacity var(--rr--easing)}.rr--fx-opacity .rr--on{opacity:1}@media (hover: hover){.rr--fx-opacity .rr--box:hover{opacity:1}}@media (hover: hover){.rr--fx-zoom .rr--box{transition:transform var(--rr--easing);transform:scale(1)}.rr--fx-zoom .rr--box:hover{transform:scale(1.2)}@media (prefers-reduced-motion){.rr--fx-zoom .rr--box:hover{transform:scale(1)}}}@media (hover: hover){.rr--fx-position .rr--box{transition:transform var(--rr--easing);transform:translateY(0)}.rr--fx-position .rr--box:hover{transform:translateY(-15%)}@media (prefers-reduced-motion){.rr--fx-position .rr--box:hover{transform:translateY(0)}}}.rr--svg-stop-1{stop-color:var(--rr--fill-on-color, rgba(0, 0, 0, 0))}[dir=rtl] .rr--svg-stop-1,.rr--svg-stop-2{stop-color:var(--rr--fill-off-color, rgba(0, 0, 0, 0))}[dir=rtl] .rr--svg-stop-2{stop-color:var(--rr--fill-on-color, rgba(0, 0, 0, 0))}.rr--hf-svg-on{fill:var(--rr--fill-on-color, none)}.rr--hf-svg-off{fill:var(--rr--fill-off-color, none)}.rr--has-stroke .rr--hf-svg-on{stroke:var(--rr--stroke-on-color, currentColor)}.rr--has-stroke .rr--hf-svg-off{stroke:var(--rr--stroke-off-color, currentColor)}.rr--hf-svg-on .rr--svg,.rr--hf-svg-off .rr--svg{background-color:var(--rr--box-off-color, none)}.rr--has-border .rr--hf-svg-on .rr--svg{border-color:var(--rr--border-on-color, currentColor)}.rr--has-border .rr--hf-svg-off .rr--svg{border-color:var(--rr--border-off-color, currentColor)}.rr--dir-x .rr--hf-box-int .rr--svg{background:linear-gradient(to right,var(--rr--box-on-color, none) 50%,var(--rr--box-off-color, none) 50%)}[dir=rtl] .rr--dir-x .rr--hf-box-int .rr--svg{background:linear-gradient(to left,var(--rr--box-on-color, none) 50%,var(--rr--box-off-color, none) 50%)}.rr--dir-y .rr--hf-box-int .rr--svg{background:linear-gradient(to bottom,var(--rr--box-on-color, none) 50%,var(--rr--box-off-color, none) 50%)}.rr--hf-box-on .rr--svg{background-color:var(--rr--box-on-color, none)}.rr--hf-box-off .rr--svg{background-color:var(--rr--box-off-color, none)}.rr--hf-box-on .rr--svg,.rr--hf-box-off .rr--svg,.rr--hf-box-int .rr--svg{fill:var(--rr--fill-off-color, none)}.rr--has-stroke .rr--hf-box-on .rr--svg,.rr--has-stroke .rr--hf-box-off .rr--svg,.rr--has-stroke .rr--hf-box-int .rr--svg{stroke:var(--rr--stroke-off-color, currentColor)}.rr--has-border .rr--hf-box-on .rr--svg,.rr--has-border .rr--hf-box-int .rr--svg{border-color:var(--rr--border-on-color, currentColor)}.rr--has-border .rr--hf-box-off .rr--svg{border-color:var(--rr--border-off-color, currentColor)}.card{background-color:#dcdcdc;display:flex;flex-direction:column;align-items:center;justify-content:center;width:fit-content;border-radius:5px;width:100%;font-size:large;background:#fff;box-shadow:0 4px 8px #0003,0 10px 20px #0000001a;padding:20px;transition:transform .3s ease,box-shadow .3s ease;text-align:center;box-sizing:border-box;color:#000;position:relative}.countInput{text-align:center;vertical-align:middle;margin:0;width:5ch}.qtyButtonsBox{display:flex;flex-direction:column;justify-content:center;align-items:center}.qtyButtons{margin-top:10px;gap:2px;display:flex;justify-content:center;align-items:center;width:fit-content}.qtyButtons button{flex:1;font-size:large;background-color:#0003;border:none;padding:7px 5px;border-radius:5px}.qtyButtons button:hover,.qtyButtons button:focus{background-color:#00000059}.qtyButtons button:active{background-color:#00000080}.countInput::-webkit-outer-spin-button,.countInput::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}.card:hover{transform:translateY(-10px) scale(1.03);box-shadow:0 10px 15px #0000004d,0 20px 30px #00000026}.card__viewport{width:100%;overflow:hidden;position:relative}.card__track{display:flex;transition:transform .35s ease-in-out;will-change:transform}.moreCardOptions button{display:flex;align-items:center;justify-content:center;background:#ffffffe6;border:none;cursor:pointer;padding:10px;border-radius:50%;box-shadow:0 2px 6px #0003}.moreCardOptions button:hover{background-color:#dcdcdc}.moreCardOptions button:disabled{opacity:.4;cursor:not-allowed;background:#ffffffe6}.card__panel{flex:0 0 100%;display:flex;flex-direction:column;align-items:center;gap:8px}.card__panel img{width:100%;height:auto;display:block}.moreCardOptions{z-index:100;position:fixed;top:50%;right:0;left:0;background-color:transparent;transform:translateY(-50%);display:flex;justify-content:space-between;cursor:pointer}.container{flex:1;box-sizing:border-box;display:flex;align-items:start;justify-content:start;overflow-y:auto;background-color:#f8f8ff}.cardBox{padding:20px 20px 100px;display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));flex:1;gap:20px;transition:all .3s ease}.flexRow{display:flex;height:100%}.modalBox{position:fixed;inset:0;display:flex;justify-content:flex-end;z-index:12;pointer-events:none;background-color:transparent}.modalBox.show{background-color:#00000080}.modalBox.show{pointer-events:all}.modal{background-color:#dcdcdc;padding:20px;min-height:100%;width:70vw;transform:translate(110%);transition:transform 1s cubic-bezier(.25,.8,.25,1);box-shadow:-5px 0 15px #0000004d;display:flex;flex-direction:column;justify-content:flex-start;overflow-y:auto}.cartBox{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:20px}.delete{position:absolute;top:4px;right:4px;border-radius:50%;height:50px;width:50px;background-color:#fff;border:none}.sideBarPopUpButton.hidden{transform:translate(-200%)}.delete:hover,.delete:focus{background-color:#0003}.numberOfItemsBox{position:absolute;aspect-ratio:1;top:0;right:0;background-color:red;border-radius:50%;font-size:small;padding:10px}.numberOfItems{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.card{position:relative}.delete img{height:70%}.modalBox.show .modal{transform:translate(0)}.modalBox.hide .modal{transform:translate(110%)}.modalBox .card{height:fit-content}.cart{position:absolute;height:60px;width:60px;bottom:10px;left:10px;font-size:xx-large;background-color:#dcdcdc;border-radius:50%;color:#fff;display:flex;justify-content:center;align-items:center}.cart:after{content:"";position:absolute;top:50%;left:50%;width:100%;height:100%;border-radius:50%;transform:translate(-50%,-50%) scale(1)}.cart.hasItems:after{animation:pulseBorder 1.3s infinite;border:2px solid rgb(0,0,0)}.cart img{height:60%;color:#fff}.cart:hover,.cart:focus{background-color:#959595}@keyframes pulseBorder{0%{transform:translate(-50%,-50%) scale(1);opacity:1}70%{transform:translate(-50%,-50%) scale(1.3);opacity:0}to{transform:translate(-50%,-50%) scale(1);opacity:0}}.sideBarPopUpButton{position:fixed;height:60px;width:60px;bottom:80px;left:10px;font-size:xx-large;background-color:#dcdcdc;border-radius:50%;color:#fff;display:flex;justify-content:center;align-items:center;z-index:10}.sideBarPopUpButton img{height:60%}.sideBarPopUpButton:hover,.sideBarPopUpButton:focus{background-color:#959595}.sideBarBox{background-color:#fff;width:250px;flex-shrink:0;overflow:hidden;transition:width .3s ease;display:flex;flex-direction:column;justify-content:start;padding:10px 10px 100px;align-items:center;margin:0;overflow-y:hidden;box-shadow:inset -10px 0 10px -10px #0000004d}.sortButtons{overflow-y:auto;padding-bottom:10px;padding-top:10px;width:100%}.close{display:flex;align-items:center;justify-content:center;margin:0}.close img{margin:0}input{width:100%;margin-bottom:10px;font-size:large}.sideBarBox>*{min-width:0}.sideBarBox button{width:100%;margin-bottom:5px;background-color:#0000000d;border:none;border-radius:2px;font-size:large;cursor:pointer;transition:background-color .4s ease,transform .2s ease}.sideBarBox button:hover,.sideBarBox button:focus{background-color:#0003}.sideBarBox.hidden{width:0;padding:0;overflow:hidden}.closeButtonBox{width:100%;display:flex;justify-content:space-between;gap:20px;margin:0}.closeButtonBox .close{width:auto;border-radius:50%;aspect-ratio:1;background:none;border:none;font-size:large}.closeButtonBox button:hover{background-color:#0000004d}.sideBarBox button.active{background-color:#0000004d;transform:scale(1.1)}
