.nav-toggle{height:var(--icon-size)}.nav-toggle .checkbox{display:none}.nav-toggle .hamburger-container{height:var(--icon-size);padding:calc(var(--icon-size)/4);cursor:pointer;transition:color var(--transition-duration) ease;align-items:center;display:flex}.nav-toggle .hamburger-container:hover{color:var(--primary-color)}.nav-toggle .hamburger-container .icon-container{width:var(--svg-size);height:var(--svg-size);position:relative}.nav-toggle .hamburger-container .icon-container .icon-element-container{width:var(--svg-size);transition:transform var(--transition-duration) ease-in-out .1s;justify-content:center;align-items:center;display:flex;position:absolute;top:50%}.nav-toggle .hamburger-container .icon-container .icon-element-container .icon-element{background:currentColor;transition:all .4s ease-in-out}.nav-toggle.closed .icon-open-hamburger .icon-element{background:currentColor;width:100%;height:2px}.nav-toggle.closed .icon-open-hamburger .icon-element-container.top{transform:translateY(calc(var(--svg-size)/3*-1))}.nav-toggle.closed .icon-open-hamburger .icon-element-container.middle{transform:translateY(0)}.nav-toggle.closed .icon-open-hamburger .icon-element-container.bottom{transform:translateY(calc(var(--svg-size)/-3*-1))}.nav-toggle.closed .icon-open-dots .icon-element{background:currentColor;border-radius:50%;width:4px;height:4px}.nav-toggle.closed .icon-open-dots .icon-element-container.top{transform:translateY(calc(var(--svg-size)/3*-1))}.nav-toggle.closed .icon-open-dots .icon-element-container.middle{transform:translateY(0)}.nav-toggle.closed .icon-open-dots .icon-element-container.bottom{transform:translateY(calc(var(--svg-size)/-3*-1))}.nav-toggle.open .icon-element{background:currentColor;width:100%;height:2px}.nav-toggle.open .icon-close-x .icon-element-container.top{transform:rotate(45deg)scaleX(1.2)}.nav-toggle.open .icon-close-x .icon-element-container.middle{opacity:0}.nav-toggle.open .icon-close-x .icon-element-container.bottom{transform:rotate(-45deg)scaleX(1.2)}.nav-toggle.open .icon-close-arrow-left .icon-element-container.top{transform:rotate(28deg)scaleX(1)translateY(6px)}.nav-toggle.open .icon-close-arrow-left .icon-element-container.middle{opacity:0;width:0}.nav-toggle.open .icon-close-arrow-left .icon-element-container.bottom{transform:rotate(-28deg)scaleX(1)translateY(-6px)}