.menu-bar{top:var(--banner-height);z-index:200;background-color:#feb2a3;flex-direction:column;gap:0;height:100vh;padding:40px 20px 20px;display:flex;position:fixed;left:0}.menu-bar--design{background-image:linear-gradient(to bottom,var(--robbie-blue),#fff)}.menu-bar--ceramics{background-image:linear-gradient(to bottom,var(--robbie-purple),#fff)}.menu-bar--illustration{background-image:linear-gradient(to bottom,var(--robbie-green),#fff)}.menu-bar--about{background-image:linear-gradient(to bottom,var(--robbie-yellow),#fff)}.menu-item{text-align:left;color:#000;width:240px;margin-bottom:10px;padding:6px 8px;font-family:Arial,Helvetica,sans-serif;font-size:2em;font-weight:700;text-decoration:none;transition:background-color .2s,color .2s;display:block}.menu-item.active{color:#fff;font-weight:900}.menu-item:hover{text-decoration:underline}.menu-bar:has(.menu-item--design:hover:not(.active)){background-image:linear-gradient(to bottom,var(--robbie-blue),#fff)}.menu-bar:has(.menu-item--ceramics:hover:not(.active)){background-image:linear-gradient(to bottom,var(--robbie-purple),#fff)}.menu-bar:has(.menu-item--illustration:hover:not(.active)){background-image:linear-gradient(to bottom,var(--robbie-green),#fff)}.menu-bar:has(.menu-item--about:hover:not(.active)){background-image:linear-gradient(to bottom,var(--robbie-yellow),#fff)}.hamburger-btn{z-index:300;cursor:pointer;background:#feb2a3;border:1.6px solid #000;border-radius:0;justify-content:center;align-items:center;width:44px;height:44px;padding:0;display:none;position:fixed;top:16px;right:16px}.hamburger-icon{background:#000;width:22px;height:2px;transition:background .2s;display:block;position:relative}.hamburger-icon:before,.hamburger-icon:after{content:"";background:#000;width:22px;height:2px;transition:transform .3s;display:block;position:absolute;left:0}.hamburger-icon:before{top:-7px}.hamburger-icon:after{top:7px}.hamburger-icon.open{background:0 0}.hamburger-icon.open:before{top:0;transform:rotate(45deg)}.hamburger-icon.open:after{top:0;transform:rotate(-45deg)}.menu-overlay{display:none}@media (max-width:768px){.hamburger-btn{display:flex}.menu-overlay{z-index:199;background:rgba(0,0,0,.4);width:100%;height:100%;display:block;position:fixed;top:0;left:0}.menu-bar{z-index:200;background-color:#fff;flex-direction:column;justify-content:center;align-items:center;width:100%;height:100vh;padding:20px;transition:transform .3s;position:fixed;top:0;left:0;right:0;overflow-y:auto;transform:translate(100%)}.menu-bar.menu-open{transform:translate(0)}.menu-item{width:100%;margin-bottom:20px;font-size:1.2em}}
:root{--banner-height:80px}.banner{height:var(--banner-height);z-index:300;cursor:pointer;background-color:#fff;align-items:center;text-decoration:none;display:flex;position:fixed;top:0;left:0;right:0;overflow:hidden}.banner-track{white-space:nowrap;width:max-content;animation:50s linear infinite marquee;display:flex}.banner-text{white-space:nowrap;flex-shrink:0;padding:0 20px 15px;font-family:Arial,Helvetica,sans-serif;font-size:3em;font-weight:700}.banner-text:nth-child(6n+1){color:var(--robbie-red)}.banner-text:nth-child(6n+2){color:var(--robbie-blue)}.banner-text:nth-child(6n+3){color:var(--robbie-purple)}.banner-text:nth-child(6n+4){color:var(--robbie-green)}.banner-text:nth-child(6n+5){color:var(--robbie-yellow)}.banner-text:nth-child(6n+6){color:var(--robbie-pink)}@keyframes marquee{0%{transform:translate(0)}to{transform:translate(-50%)}}