@media (max-width: 640px){.box2d_examples{padding:0 var(--spacing-outer) var(--spacing-outer) var(--spacing-outer);display:flex;flex-direction:column;gap:calc(1 * var(--spacing-outer))}.box2d_examples_text{flex:1 1 33%}.box2d_examples_text h2:after{content:"";display:block;width:6vw;height:2px;background:var(--color-accent);margin-top:.5em}.box2d_examples_examples{flex:1 1 66%;display:flex;flex-direction:column;gap:1rem;position:relative}.box2d_examples_examples_nav{color:var(--color-accent);position:absolute;right:1rem;bottom:1rem;z-index:1;border:1px solid var(--color-accent);border-radius:1rem;display:flex;flex-direction:column;cursor:pointer;overflow:hidden}.box2d_examples_examples_nav>div{padding:.5rem}.box2d_examples_examples_nav>div:hover{background:var(--color-accent);color:var(--color-black)}.box2d_examples_examples_videos{position:relative;border:1px solid var(--color-accent);box-shadow:0 0 2rem var(--color-accent-dark);width:100%;height:auto;aspect-ratio:1280/720}.box2d_examples_examples_videos .video{border:none;position:absolute;top:0;left:0;width:100%;height:100%;display:none}.box2d_examples_examples_videos .video.active{display:block}.box2d_examples_examples_videos .video:hover:after{content:"Click to play";position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);color:var(--color-accent);font-size:1.5rem;font-weight:700;text-shadow:0 0 1rem var(--color-accent-dark)}}@media (min-width: 640.1px){.box2d_examples{padding:0 var(--spacing-outer) var(--spacing-outer) var(--spacing-outer);display:flex;gap:calc(1 * var(--spacing-outer))}.box2d_examples_text{flex:1 1 33%}.box2d_examples_text h2:after{content:"";display:block;width:6vw;height:2px;background:var(--color-accent);margin-top:.5em}.box2d_examples_examples{flex:1 1 66%;display:flex;flex-direction:column;gap:1rem;position:relative}.box2d_examples_examples_nav{color:var(--color-accent);position:absolute;left:1rem;top:1rem;z-index:1;border:1px solid var(--color-accent);border-radius:1rem;display:flex;flex-direction:column;cursor:pointer;overflow:hidden;background-color:#000}.box2d_examples_examples_nav>div{padding:.5rem}.box2d_examples_examples_nav>div:hover{background:var(--color-accent);color:var(--color-black)}.box2d_examples_examples_videos{position:relative;border:1px solid var(--color-accent);box-shadow:0 0 2rem var(--color-accent-dark);width:100%;height:auto;aspect-ratio:1280/720}.box2d_examples_examples_videos .video{border:none;position:absolute;top:0;left:0;width:100%;height:100%;display:none}.box2d_examples_examples_videos .video.active{display:block}}