.flipAnimationEntrance{animation-duration:1s;animation-name:flipAnimationEntrance;animation-timing-function:ease-in-out;animation-fill-mode:forwards}@keyframes flipAnimationEntrance{0%{transform:rotateY(0deg)}to{transform:rotateY(180deg)}}.backdrop{position:absolute;top:0;left:0;width:100%;height:100%;background:rgba(0,0,0,.5);-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);z-index:1000;display:flex;justify-content:center;align-items:center}.bird_modal{--perspective:1000px;--rotateX:0;--rotateY:0;--angle:15deg;position:relative;display:grid;place-content:center;text-align:center;box-shadow:var(--shadow);padding:2rem;width:clamp(10rem,15rem,20rem);height:clamp(15rem,20rem,25rem);background-color:var(--background);border:2px solid var(--secondary);border-radius:1rem;aspect-ratio:1/2;transform:perspective(var(--perspective)) rotateX(var(--rotateX)) rotateY(var(--rotateY))!important;transition:transform .35s ease;.bird_front{-webkit-backface-visibility:hidden;backface-visibility:hidden;position:absolute;display:flex;flex-direction:column;align-items:center;width:100%;font-family:var(--font-comfortaa);height:100%;&:after{content:"";position:absolute;top:0;left:0;width:100%;height:100%;background-image:url(https://assets.codepen.io/13471/sparkles.gif);background-position:50% 50%;border-radius:1rem;opacity:.2;background-blend-mode:overlay;filter:brightness(1) contrast(1);mix-blend-mode:color-dodge}.heading{display:flex;padding:.25rem;font-size:1rem;font-weight:1000;align-items:center;justify-content:center}img{border:.4rem solid var(--secondary);padding:0}.description{display:flex;font-size:.8rem;font-weight:1000;text-align:left;padding:.25rem .25rem .25rem 8rem;width:100%}}.bird_back{position:absolute;-webkit-backface-visibility:hidden;backface-visibility:hidden;transform:rotateY(180deg)}}.bird_modal>:where(h1,p){background:#fff;margin:0;padding:.5rem}.mouse_position_tracker{position:absolute;inset:0}.mouse_position_tracker>div{position:absolute;width:calc(100% / 3);height:calc(100% / 3);z-index:2}.bird_modal:has(.mouse_position_tracker>div:first-child:hover){--rotateX:var(--angle);--rotateY:calc(var(--angle) * -1)}.bird_modal:has(.mouse_position_tracker>div:nth-child(2):hover){--rotateX:var(--angle)}.bird_modal:has(.mouse_position_tracker>div:nth-child(3):hover){--rotateX:var(--angle);--rotateY:var(--angle)}.bird_modal:has(.mouse_position_tracker>div:nth-child(4):hover){--rotateY:calc(var(--angle) * -1)}.bird_modal:has(.mouse_position_tracker>div:nth-child(6):hover){--rotateY:var(--angle)}.bird_modal:has(.mouse_position_tracker>div:nth-child(7):hover){--rotateX:calc(var(--angle) * -1);--rotateY:calc(var(--angle) * -1)}.bird_modal:has(.mouse_position_tracker>div:nth-child(8):hover){--rotateX:calc(var(--angle) * -1)}.bird_modal:has(.mouse_position_tracker>div:nth-child(9):hover){--rotateX:calc(var(--angle) * -1);--rotateY:var(--angle)}.mouse_position_tracker>div:nth-of-type(3n - 2){left:0}.mouse_position_tracker>div:nth-of-type(3n - 1){left:calc(100% / 3)}.mouse_position_tracker>div:nth-of-type(3n){right:0}.mouse_position_tracker>div:nth-child(n+1):nth-child(-n+3){top:0}.mouse_position_tracker>div:nth-child(n+4):nth-child(-n+6){top:calc(100% / 3)}.mouse_position_tracker>div:nth-child(n+7):nth-child(-n+9){bottom:0}