html {
      overflow-y: scroll; /* Always show vertical scrollbar to prevent jump */
    }

    body {
      display: flex;
      justify-content: center;
      align-items: center;
      flex-direction: column;
      margin-top: 30px;
      margin-bottom: 30px;
      padding-right: 0px;
      background-image: url('data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTU0NCIgaGVpZ2h0PSIxOTE4IiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIiBvdmVyZmxvdz0iaGlkZGVuIj48ZGVmcz48Y2xpcFBhdGggaWQ9ImNsaXAwIj48cmVjdCB4PSIwIiB5PSIwIiB3aWR0aD0iMTU0NCIgaGVpZ2h0PSIxOTE4Ii8+PC9jbGlwUGF0aD48L2RlZnM+PGcgY2xpcC1wYXRoPSJ1cmwoI2NsaXAwKSI+PHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjE1NDQiIGhlaWdodD0iMTkxNy43MSIgZmlsbD0iI0ZGRkZGRiIvPjxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxNTQ0IiBoZWlnaHQ9IjE5MTcuNzEiIGZpbGw9IiMzRjhERDgiLz48cGF0aCBkPSJNNDQ0IDg1Mi44NzJDNDQ0IDc5MC40NzMgNDk0LjM2OCA3MzkuODg5IDU1Ni41IDczOS44ODkgNjE4LjYzMiA3MzkuODg5IDY2OSA3OTAuNDczIDY2OSA4NTIuODcyIDY2OSA5MTUuMjcxIDYxOC42MzIgOTY1Ljg1NSA1NTYuNSA5NjUuODU1IDQ5NC4zNjggOTY1Ljg1NSA0NDQgOTE1LjI3MSA0NDQgODUyLjg3MloiIGZpbGw9IiMyNTU5OEEiIGZpbGwtcnVsZT0iZXZlbm9kZCIgZmlsbC1vcGFjaXR5PSIwLjUyMTU2OSIvPjxwYXRoIGQ9Ik0yMCA0NDkuOTMyQzIwIDM5NS44MTcgNjMuODc2MSAzNTEuOTQ3IDExOCAzNTEuOTQ3IDE3Mi4xMjQgMzUxLjk0NyAyMTYgMzk1LjgxNyAyMTYgNDQ5LjkzMiAyMTYgNTA0LjA0OCAxNzIuMTI0IDU0Ny45MTggMTE4IDU0Ny45MTggNjMuODc2MSA1NDcuOTE4IDIwIDUwNC4wNDggMjAgNDQ5LjkzMloiIGZpbGw9IiMyNTU5OEEiIGZpbGwtcnVsZT0iZXZlbm9kZCIgZmlsbC1vcGFjaXR5PSIwLjQ1ODgyNCIvPjxwYXRoIGQ9Ik05NiAzMDAuOTU1Qzk2IDIzOC41NTYgMTQ2LjM2OCAxODcuOTcyIDIwOC41IDE4Ny45NzIgMjcwLjYzMiAxODcuOTcyIDMyMSAyMzguNTU2IDMyMSAzMDAuOTU1IDMyMSAzNjMuMzU0IDI3MC42MzIgNDEzLjkzOCAyMDguNSA0MTMuOTM4IDE0Ni4zNjggNDEzLjkzOCA5NiAzNjMuMzU0IDk2IDMwMC45NTVaIiBmaWxsPSIjMjU1OThBIiBmaWxsLXJ1bGU9ImV2ZW5vZGQiIGZpbGwtb3BhY2l0eT0iMC41NDkwMiIvPjxwYXRoIGQ9Ik01OTEgMjY5LjQ2QzU5MSAyNTQuODI2IDYwMy4wODggMjQyLjk2MyA2MTggMjQyLjk2MyA2MzIuOTEyIDI0Mi45NjMgNjQ1IDI1NC44MjYgNjQ1IDI2OS40NiA2NDUgMjg0LjA5MyA2MzIuOTEyIDI5NS45NTYgNjE4IDI5NS45NTYgNjAzLjA4OCAyOTUuOTU2IDU5MSAyODQuMDkzIDU5MSAyNjkuNDZaIiBmaWxsPSIjMjU1OThBIiBmaWxsLXJ1bGU9ImV2ZW5vZGQiIGZpbGwtb3BhY2l0eT0iMC41MjE1NjkiLz48cGF0aCBkPSJNOTYyIDYyMy40MDZDOTYyIDYwOC43NzMgOTc0LjA4OCA1OTYuOTEgOTg5IDU5Ni45MSAxMDAzLjkxIDU5Ni45MSAxMDE2IDYwOC43NzMgMTAxNiA2MjMuNDA2IDEwMTYgNjM4LjA0IDEwMDMuOTEgNjQ5LjkwMiA5ODkgNjQ5LjkwMiA5NzQuMDg4IDY0OS45MDIgOTYyIDYzOC4wNCA5NjIgNjIzLjQwNloiIGZpbGw9IiMyNTU5OEEiIGZpbGwtcnVsZT0iZXZlbm9kZCIgZmlsbC1vcGFjaXR5PSIwLjUyMTU2OSIvPjxwYXRoIGQ9Ik0xNDI4IDYyLjk5MDVDMTQyOCA0OC4wODExIDE0MzkuODYgMzUuOTk0NiAxNDU0LjUgMzUuOTk0NiAxNDY5LjE0IDM1Ljk5NDYgMTQ4MSA0OC4wODExIDE0ODEgNjIuOTkwNSAxNDgxIDc3LjkgMTQ2OS4xNCA4OS45ODY1IDE0NTQuNSA4OS45ODY1IDE0MzkuODYgODkuOTg2NSAxNDI4IDc3LjkgMTQyOCA2Mi45OTA1WiIgZmlsbD0iIzI1NTk4QSIgZmlsbC1ydWxlPSJldmVub2RkIiBmaWxsLW9wYWNpdHk9IjAuNTIxNTY5Ii8+PHBhdGggZD0iTTEwNDUgODIxLjM3N0MxMDQ1IDgwNi43NDMgMTA1Ny4wOSA3OTQuODgxIDEwNzIgNzk0Ljg4MSAxMDg2LjkxIDc5NC44ODEgMTA5OSA4MDYuNzQzIDEwOTkgODIxLjM3NyAxMDk5IDgzNi4wMSAxMDg2LjkxIDg0Ny44NzMgMTA3MiA4NDcuODczIDEwNTcuMDkgODQ3Ljg3MyAxMDQ1IDgzNi4wMSAxMDQ1IDgyMS4zNzdaIiBmaWxsPSIjMjU1OThBIiBmaWxsLXJ1bGU9ImV2ZW5vZGQiIGZpbGwtb3BhY2l0eT0iMC41MjE1NjkiLz48cGF0aCBkPSJNMTIzNyAyMjAuOTY3QzEyMzcgMTg5LjQ5MSAxMjYyLjUyIDE2My45NzUgMTI5NCAxNjMuOTc1IDEzMjUuNDggMTYzLjk3NSAxMzUxIDE4OS40OTEgMTM1MSAyMjAuOTY3IDEzNTEgMjUyLjQ0MiAxMzI1LjQ4IDI3Ny45NTggMTI5NCAyNzcuOTU4IDEyNjIuNTIgMjc3Ljk1OCAxMjM3IDI1Mi40NDIgMTIzNyAyMjAuOTY3WiIgZmlsbD0iIzI1NTk4QSIgZmlsbC1ydWxlPSJldmVub2RkIiBmaWxsLW9wYWNpdHk9IjAuNDE5NjA4Ii8+PHBhdGggZD0iTTE1NiA2MTguOTA3QzE1NiA1ODkuMDg4IDE4MC4xNzcgNTY0LjkxNSAyMTAgNTY0LjkxNSAyMzkuODIzIDU2NC45MTUgMjY0IDU4OS4wODggMjY0IDYxOC45MDcgMjY0IDY0OC43MjYgMjM5LjgyMyA2NzIuODk5IDIxMCA2NzIuODk5IDE4MC4xNzcgNjcyLjg5OSAxNTYgNjQ4LjcyNiAxNTYgNjE4LjkwN1oiIGZpbGw9IiMyNTU5OEEiIGZpbGwtcnVsZT0iZXZlbm9kZCIgZmlsbC1vcGFjaXR5PSIwLjUyMTU2OSIvPjxwYXRoIGQ9Ik0zMiA2MjcuNDA2QzMyIDYxMi43NzIgNDQuMDg4MyA2MDAuOTEgNTkgNjAwLjkxIDczLjkxMTcgNjAwLjkxIDg2IDYxMi43NzIgODYgNjI3LjQwNiA4NiA2NDIuMDM5IDczLjkxMTcgNjUzLjkwMiA1OSA2NTMuOTAyIDQ0LjA4ODMgNjUzLjkwMiAzMiA2NDIuMDM5IDMyIDYyNy40MDZaIiBmaWxsPSIjMjU1OThBIiBmaWxsLXJ1bGU9ImV2ZW5vZGQiIGZpbGwtb3BhY2l0eT0iMC4yMzkyMTYiLz48cGF0aCBkPSJNNjY5IDc5NC44ODFDNjY5IDc3OS45NzEgNjgxLjA4OCA3NjcuODg1IDY5NiA3NjcuODg1IDcxMC45MTIgNzY3Ljg4NSA3MjMgNzc5Ljk3MSA3MjMgNzk0Ljg4MSA3MjMgODA5Ljc5IDcxMC45MTIgODIxLjg3NyA2OTYgODIxLjg3NyA2ODEuMDg4IDgyMS44NzcgNjY5IDgwOS43OSA2NjkgNzk0Ljg4MVoiIGZpbGw9IiMyNTU5OEEiIGZpbGwtcnVsZT0iZXZlbm9kZCIgZmlsbC1vcGFjaXR5PSIwLjUyMTU2OSIvPjxwYXRoIGQ9Ik01MjQgMTEyMi4zM0M1MjQgMTEwNy43IDUzNi4wODggMTA5NS44NCA1NTEgMTA5NS44NCA1NjUuOTEyIDEwOTUuODQgNTc4IDExMDcuNyA1NzggMTEyMi4zMyA1NzggMTEzNi45NiA1NjUuOTEyIDExNDguODMgNTUxIDExNDguODMgNTM2LjA4OCAxMTQ4LjgzIDUyNCAxMTM2Ljk2IDUyNCAxMTIyLjMzWiIgZmlsbD0iIzI1NTk4QSIgZmlsbC1ydWxlPSJldmVub2RkIiBmaWxsLW9wYWNpdHk9IjAuNTIxNTY5Ii8+PHBhdGggZD0iTTE0MDAgMjY0LjQ2QzE0MDAgMjAyLjMzOCAxNDUwLjU5IDE1MS45NzcgMTUxMyAxNTEuOTc3IDE1NzUuNDEgMTUxLjk3NyAxNjI2IDIwMi4zMzggMTYyNiAyNjQuNDYgMTYyNiAzMjYuNTgzIDE1NzUuNDEgMzc2Ljk0MyAxNTEzIDM3Ni45NDMgMTQ1MC41OSAzNzYuOTQzIDE0MDAgMzI2LjU4MyAxNDAwIDI2NC40NloiIGZpbGw9IiMyNTU5OEEiIGZpbGwtcnVsZT0iZXZlbm9kZCIgZmlsbC1vcGFjaXR5PSIwLjUyMTU2OSIvPjxwYXRoIGQ9Ik0xMTk4Ljk5LTI4LjU1MDlDMTIzMy4yNC02MS4xOTcyIDEyODcuNDgtNTkuODk5MSAxMzIwLjEzLTI1LjY1MTYgMTM1Mi43OCA4LjU5NTgyIDEzNTEuNDggNjIuODIzOSAxMzE3LjIzIDk1LjQ3MDEgMTI4Mi45OCAxMjguMTE2IDEyMjguNzQgMTI2LjgxOCAxMTk2LjA5IDkyLjU3MDggMTE2My40NCA1OC4zMjMzIDExNjQuNzQgNC4wOTUyOCAxMTk4Ljk5LTI4LjU1MDlaIiBmaWxsPSIjMjU1OThBIiBmaWxsLXJ1bGU9ImV2ZW5vZGQiIGZpbGwtb3BhY2l0eT0iMC41MjE1NjkiLz48cGF0aCBkPSJNMTIwNi44MiAzMzMuMzIyQzEyNTEuODUgMjkwLjQgMTMyMy4xNiAyOTIuMTA3IDEzNjYuMDkgMzM3LjEzNCAxNDA5LjAyIDM4Mi4xNjEgMTQwNy4zMSA0NTMuNDU3IDEzNjIuMjggNDk2LjM3OCAxMzE3LjI0IDUzOS4zIDEyNDUuOTQgNTM3LjU5MyAxMjAzLjAxIDQ5Mi41NjYgMTE2MC4wOCA0NDcuNTQgMTE2MS43OSAzNzYuMjQzIDEyMDYuODIgMzMzLjMyMloiIGZpbGw9IiMyNTU5OEEiIGZpbGwtcnVsZT0iZXZlbm9kZCIgZmlsbC1vcGFjaXR5PSIwLjMwMTk2MSIvPjxwYXRoIGQ9Ik02NDcuNTUyIDEzODAuODVDNjcyLjg3MSAxMzU2LjcyIDcxMi45NjEgMTM1Ny42OCA3MzcuMDk1IDEzODIuOTkgNzYxLjIzIDE0MDguMzEgNzYwLjI3MSAxNDQ4LjM5IDczNC45NTIgMTQ3Mi41MiA3MDkuNjMzIDE0OTYuNjUgNjY5LjU0MyAxNDk1LjY5IDY0NS40MDkgMTQ3MC4zOCA2MjEuMjc0IDE0NDUuMDYgNjIyLjIzMyAxNDA0Ljk4IDY0Ny41NTIgMTM4MC44NVoiIGZpbGw9IiMyNTU5OEEiIGZpbGwtcnVsZT0iZXZlbm9kZCIgZmlsbC1vcGFjaXR5PSIwLjUyMTU2OSIvPjxwYXRoIGQ9Ik03MTAgNDI2LjQzNkM3MTAgMzY0LjMxMyA3NjAuMzY4IDMxMy45NTMgODIyLjUgMzEzLjk1MyA4ODQuNjMyIDMxMy45NTMgOTM1IDM2NC4zMTMgOTM1IDQyNi40MzYgOTM1IDQ4OC41NTkgODg0LjYzMiA1MzguOTE5IDgyMi41IDUzOC45MTkgNzYwLjM2OCA1MzguOTE5IDcxMCA0ODguNTU5IDcxMCA0MjYuNDM2WiIgZmlsbD0iIzI1NTk4QSIgZmlsbC1ydWxlPSJldmVub2RkIiBmaWxsLW9wYWNpdHk9IjAuNTIxNTY5Ii8+PHBhdGggZD0iTTgzMyAxMDgzLjM0QzgzMyAxMDIxLjIxIDg4My4zNjggOTcwLjg1NCA5NDUuNSA5NzAuODU0IDEwMDcuNjMgOTcwLjg1NCAxMDU4IDEwMjEuMjEgMTA1OCAxMDgzLjM0IDEwNTggMTE0NS40NiAxMDA3LjYzIDExOTUuODIgOTQ1LjUgMTE5NS44MiA4ODMuMzY4IDExOTUuODIgODMzIDExNDUuNDYgODMzIDEwODMuMzRaIiBmaWxsPSIjMjU1OThBIiBmaWxsLXJ1bGU9ImV2ZW5vZGQiIGZpbGwtb3BhY2l0eT0iMC41MjE1NjkiLz48cGF0aCBkPSJNMTAyNyA2MzQuNDA1QzEwMjcgNTcyLjI4MiAxMDc3LjU5IDUyMS45MjIgMTE0MCA1MjEuOTIyIDEyMDIuNDEgNTIxLjkyMiAxMjUzIDU3Mi4yODIgMTI1MyA2MzQuNDA1IDEyNTMgNjk2LjUyOCAxMjAyLjQxIDc0Ni44ODggMTE0MCA3NDYuODg4IDEwNzcuNTkgNzQ2Ljg4OCAxMDI3IDY5Ni41MjggMTAyNyA2MzQuNDA1WiIgZmlsbD0iIzI1NTk4QSIgZmlsbC1ydWxlPSJldmVub2RkIiBmaWxsLW9wYWNpdHk9IjAuNTIxNTY5Ii8+PHBhdGggZD0iTTgyMyA3NjkuODg0QzgyMyA3MDcuNDg2IDg3My4zNjggNjU2LjkwMSA5MzUuNSA2NTYuOTAxIDk5Ny42MzIgNjU2LjkwMSAxMDQ4IDcwNy40ODYgMTA0OCA3NjkuODg0IDEwNDggODMyLjI4MyA5OTcuNjMyIDg4Mi44NjcgOTM1LjUgODgyLjg2NyA4NzMuMzY4IDg4Mi44NjcgODIzIDgzMi4yODMgODIzIDc2OS44ODRaIiBmaWxsPSIjMjU1OThBIiBmaWxsLXJ1bGU9ImV2ZW5vZGQiIGZpbGwtb3BhY2l0eT0iMC41MjE1NjkiLz48cGF0aCBkPSJNNDkzIDYyMS45MDdDNDkzIDU1OS41MDggNTQzLjU5MiA1MDguOTI0IDYwNiA1MDguOTI0IDY2OC40MDggNTA4LjkyNCA3MTkgNTU5LjUwOCA3MTkgNjIxLjkwNyA3MTkgNjg0LjMwNSA2NjguNDA4IDczNC44OSA2MDYgNzM0Ljg5IDU0My41OTIgNzM0Ljg5IDQ5MyA2ODQuMzA1IDQ5MyA2MjEuOTA3WiIgZmlsbD0iIzI1NTk4QSIgZmlsbC1ydWxlPSJldmVub2RkIiBmaWxsLW9wYWNpdHk9IjAuNTIxNTY5Ii8+PHBhdGggZD0iTS0xOSA3NzIuODg0Qy0xOSA3MTguNzY4IDI0Ljg3NjEgNjc0Ljg5OSA3OSA2NzQuODk5IDEzMy4xMjQgNjc0Ljg5OSAxNzcgNzE4Ljc2OCAxNzcgNzcyLjg4NCAxNzcgODI3IDEzMy4xMjQgODcwLjg2OSA3OSA4NzAuODY5IDI0Ljg3NjEgODcwLjg2OS0xOSA4MjctMTkgNzcyLjg4NFoiIGZpbGw9IiMyNTU5OEEiIGZpbGwtcnVsZT0iZXZlbm9kZCIgZmlsbC1vcGFjaXR5PSIwLjUyMTU2OSIvPjxwYXRoIGQ9Ik05ODAgNDk5LjkyNUM5ODAgNDg1LjAxNiA5OTEuODY0IDQ3Mi45MjkgMTAwNi41IDQ3Mi45MjkgMTAyMS4xNCA0NzIuOTI5IDEwMzMgNDg1LjAxNiAxMDMzIDQ5OS45MjUgMTAzMyA1MTQuODM0IDEwMjEuMTQgNTI2LjkyMSAxMDA2LjUgNTI2LjkyMSA5OTEuODY0IDUyNi45MjEgOTgwIDUxNC44MzQgOTgwIDQ5OS45MjVaIiBmaWxsPSIjMjU1OThBIiBmaWxsLXJ1bGU9ImV2ZW5vZGQiIGZpbGwtb3BhY2l0eT0iMC41MjE1NjkiLz48cGF0aCBkPSJNMTM1MSA4NTMuODcyQzEzNTEgODM4Ljk2MiAxMzYyLjg2IDgyNi44NzYgMTM3Ny41IDgyNi44NzYgMTM5Mi4xNCA4MjYuODc2IDE0MDQgODM4Ljk2MiAxNDA0IDg1My44NzIgMTQwNCA4NjguNzgxIDEzOTIuMTQgODgwLjg2OCAxMzc3LjUgODgwLjg2OCAxMzYyLjg2IDg4MC44NjggMTM1MSA4NjguNzgxIDEzNTEgODUzLjg3MloiIGZpbGw9IiMyNTU5OEEiIGZpbGwtcnVsZT0iZXZlbm9kZCIgZmlsbC1vcGFjaXR5PSIwLjUyMTU2OSIvPjxwYXRoIGQ9Ik0xNDI4IDQ4MS40MjhDMTQyOCA0NzIuMzE2IDE0MzUuMzkgNDY0LjkzIDE0NDQuNSA0NjQuOTMgMTQ1My42MSA0NjQuOTMgMTQ2MSA0NzIuMzE2IDE0NjEgNDgxLjQyOCAxNDYxIDQ5MC41MzkgMTQ1My42MSA0OTcuOTI1IDE0NDQuNSA0OTcuOTI1IDE0MzUuMzkgNDk3LjkyNSAxNDI4IDQ5MC41MzkgMTQyOCA0ODEuNDI4WiIgZmlsbD0iIzI1NTk4QSIgZmlsbC1ydWxlPSJldmVub2RkIiBmaWxsLW9wYWNpdHk9IjAuNTIxNTY5Ii8+PHBhdGggZD0iTTE0MzQgMTA1MS44NEMxNDM0IDEwMzYuOTMgMTQ0Ni4wOSAxMDI0Ljg1IDE0NjEgMTAyNC44NSAxNDc1LjkxIDEwMjQuODUgMTQ4OCAxMDM2LjkzIDE0ODggMTA1MS44NCAxNDg4IDEwNjYuNzUgMTQ3NS45MSAxMDc4Ljg0IDE0NjEgMTA3OC44NCAxNDQ2LjA5IDEwNzguODQgMTQzNCAxMDY2Ljc1IDE0MzQgMTA1MS44NFoiIGZpbGw9IiMyNTU5OEEiIGZpbGwtcnVsZT0iZXZlbm9kZCIgZmlsbC1vcGFjaXR5PSIwLjQiLz48cGF0aCBkPSJNMTI4OCA2ODMuODk3QzEyODggNjU1LjE4MyAxMzExLjI4IDYzMS45MDUgMTM0MCA2MzEuOTA1IDEzNjguNzIgNjMxLjkwNSAxMzkyIDY1NS4xODMgMTM5MiA2ODMuODk3IDEzOTIgNzEyLjYxMiAxMzY4LjcyIDczNS44OSAxMzQwIDczNS44OSAxMzExLjI4IDczNS44OSAxMjg4IDcxMi42MTIgMTI4OCA2ODMuODk3WiIgZmlsbD0iIzI1NTk4QSIgZmlsbC1ydWxlPSJldmVub2RkIiBmaWxsLW9wYWNpdHk9IjAuMzAxOTYxIi8+PHBhdGggZD0iTTY5MiAxMjE1LjgyQzY5MiAxMjAwLjkxIDcwMy44NjUgMTE4OC44MiA3MTguNSAxMTg4LjgyIDczMy4xMzYgMTE4OC44MiA3NDUgMTIwMC45MSA3NDUgMTIxNS44MiA3NDUgMTIzMC43MyA3MzMuMTM2IDEyNDIuODEgNzE4LjUgMTI0Mi44MSA3MDMuODY1IDEyNDIuODEgNjkyIDEyMzAuNzMgNjkyIDEyMTUuODJaIiBmaWxsPSIjMjU1OThBIiBmaWxsLXJ1bGU9ImV2ZW5vZGQiIGZpbGwtb3BhY2l0eT0iMC41MjE1NjkiLz48cGF0aCBkPSJNMTUyIDEzMDkuM0MxNTIgMTIzMi44MiAyMTQuMjMyIDExNzAuODIgMjkxIDExNzAuODIgMzY3Ljc2OCAxMTcwLjgyIDQzMCAxMjMyLjgyIDQzMCAxMzA5LjMgNDMwIDEzODUuNzggMzY3Ljc2OCAxNDQ3Ljc4IDI5MSAxNDQ3Ljc4IDIxNC4yMzIgMTQ0Ny43OCAxNTIgMTM4NS43OCAxNTIgMTMwOS4zWiIgZmlsbD0iIzI1NTk4QSIgZmlsbC1ydWxlPSJldmVub2RkIiBmaWxsLW9wYWNpdHk9IjAuNTIxNTY5Ii8+PHBhdGggZD0iTTkxMyAxMzUyLjhDOTEzIDEzMzcuODkgOTI1LjA4OCAxMzI1LjggOTQwIDEzMjUuOCA5NTQuOTEyIDEzMjUuOCA5NjcgMTMzNy44OSA5NjcgMTM1Mi44IDk2NyAxMzY3LjcxIDk1NC45MTIgMTM3OS43OSA5NDAgMTM3OS43OSA5MjUuMDg4IDEzNzkuNzkgOTEzIDEzNjcuNzEgOTEzIDEzNTIuOFoiIGZpbGw9IiMyNTU5OEEiIGZpbGwtcnVsZT0iZXZlbm9kZCIgZmlsbC1vcGFjaXR5PSIwLjUyMTU2OSIvPjxwYXRoIGQ9Ik0xMTI2IDg2Mi4zNzFDMTEyNiA4MDAuMjQ4IDExNzYuMzcgNzQ5Ljg4OCAxMjM4LjUgNzQ5Ljg4OCAxMzAwLjYzIDc0OS44ODggMTM1MSA4MDAuMjQ4IDEzNTEgODYyLjM3MSAxMzUxIDkyNC40OTMgMTMwMC42MyA5NzQuODU0IDEyMzguNSA5NzQuODU0IDExNzYuMzcgOTc0Ljg1NCAxMTI2IDkyNC40OTMgMTEyNiA4NjIuMzcxWiIgZmlsbD0iIzI1NTk4QSIgZmlsbC1ydWxlPSJldmVub2RkIiBmaWxsLW9wYWNpdHk9IjAuNTIxNTY5Ii8+PHBhdGggZD0iTTE0MzIuNDggNTQxLjY1N0MxNDc3LjUxIDQ5OC43MzUgMTU0OC44MiA1MDAuNDQyIDE1OTEuNzUgNTQ1LjQ2OSAxNjM0LjY4IDU5MC40OTYgMTYzMi45NyA2NjEuNzkyIDE1ODcuOTQgNzA0LjcxMyAxNTQyLjkgNzQ3LjYzNSAxNDcxLjYgNzQ1LjkyOCAxNDI4LjY3IDcwMC45MDEgMTM4NS43NCA2NTUuODc1IDEzODcuNDUgNTg0LjU3OCAxNDMyLjQ4IDU0MS42NTdaIiBmaWxsPSIjMjU1OThBIiBmaWxsLXJ1bGU9ImV2ZW5vZGQiIGZpbGwtb3BhY2l0eT0iMC41MjE1NjkiLz48cGF0aCBkPSJNMTA2NiAxMDY1Ljg0QzEwNjYgOTY0Ljc4NyAxMTQ3LjkzIDg4Mi44NjcgMTI0OSA4ODIuODY3IDEzNTAuMDcgODgyLjg2NyAxNDMyIDk2NC43ODcgMTQzMiAxMDY1Ljg0IDE0MzIgMTE2Ni44OSAxMzUwLjA3IDEyNDguODEgMTI0OSAxMjQ4LjgxIDExNDcuOTMgMTI0OC44MSAxMDY2IDExNjYuODkgMTA2NiAxMDY1Ljg0WiIgZmlsbD0iIzI1NTk4QSIgZmlsbC1ydWxlPSJldmVub2RkIiBmaWxsLW9wYWNpdHk9IjAuNzAxOTYxIi8+PHBhdGggZD0iTTYwNyA2MjkuNDA2QzYwNyA1NjcuMjgzIDY1Ny4zNjggNTE2LjkyMiA3MTkuNSA1MTYuOTIyIDc4MS42MzIgNTE2LjkyMiA4MzIgNTY3LjI4MyA4MzIgNjI5LjQwNiA4MzIgNjkxLjUyOCA3ODEuNjMyIDc0MS44ODkgNzE5LjUgNzQxLjg4OSA2NTcuMzY4IDc0MS44ODkgNjA3IDY5MS41MjggNjA3IDYyOS40MDZaIiBmaWxsPSIjMjU1OThBIiBmaWxsLXJ1bGU9ImV2ZW5vZGQiIGZpbGwtb3BhY2l0eT0iMC41MjE1NjkiLz48cGF0aCBkPSJNLTEzNSAxNDE5LjI5Qy0xMzUgMTMxOC41MS01My4wNjgyIDEyMzYuODEgNDcuOTk5OSAxMjM2LjgxIDE0OS4wNjggMTIzNi44MSAyMzEgMTMxOC41MSAyMzEgMTQxOS4yOSAyMzEgMTUyMC4wNiAxNDkuMDY4IDE2MDEuNzYgNDcuOTk5OSAxNjAxLjc2LTUzLjA2ODIgMTYwMS43Ni0xMzUgMTUyMC4wNi0xMzUgMTQxOS4yOVoiIGZpbGw9IiMyNTU5OEEiIGZpbGwtcnVsZT0iZXZlbm9kZCIgZmlsbC1vcGFjaXR5PSIwLjUyMTU2OSIvPjxwYXRoIGQ9Ik0tMTAwIDEyMy45ODFDLTEwMCAyMi45Mjg0LTE4LjA2ODEtNTguOTkxMSA4My01OC45OTExIDE4NC4wNjgtNTguOTkxMSAyNjYgMjIuOTI4NCAyNjYgMTIzLjk4MSAyNjYgMjI1LjAzNCAxODQuMDY4IDMwNi45NTQgODMgMzA2Ljk1NC0xOC4wNjgxIDMwNi45NTQtMTAwIDIyNS4wMzQtMTAwIDEyMy45ODFaIiBmaWxsPSIjMjU1OThBIiBmaWxsLXJ1bGU9ImV2ZW5vZGQiIGZpbGwtb3BhY2l0eT0iMC4yNzA1ODgiLz48cGF0aCBkPSJNNDUzIDIxMi40NjhDNDUzIDE5Ny44MzUgNDY0Ljg2NCAxODUuOTcyIDQ3OS41IDE4NS45NzIgNDk0LjEzNiAxODUuOTcyIDUwNiAxOTcuODM1IDUwNiAyMTIuNDY4IDUwNiAyMjcuMTAxIDQ5NC4xMzYgMjM4Ljk2NCA0NzkuNSAyMzguOTY0IDQ2NC44NjQgMjM4Ljk2NCA0NTMgMjI3LjEwMSA0NTMgMjEyLjQ2OFoiIGZpbGw9IiMyNTU5OEEiIGZpbGwtcnVsZT0iZXZlbm9kZCIgZmlsbC1vcGFjaXR5PSIwLjUyMTU2OSIvPjxwYXRoIGQ9Ik0yMzEgNzM2Ljg4OUMyMzEgNjkzLjgxOCAyNjUuOTIyIDY1OC45MDEgMzA5IDY1OC45MDEgMzUyLjA3OCA2NTguOTAxIDM4NyA2OTMuODE4IDM4NyA3MzYuODg5IDM4NyA3NzkuOTYxIDM1Mi4wNzggODE0Ljg3OCAzMDkgODE0Ljg3OCAyNjUuOTIyIDgxNC44NzggMjMxIDc3OS45NjEgMjMxIDczNi44ODlaIiBmaWxsPSIjMjU1OThBIiBmaWxsLXJ1bGU9ImV2ZW5vZGQiIGZpbGwtb3BhY2l0eT0iMC4xODAzOTIiLz48cGF0aCBkPSJNMjY2IDUwMC40MjVDMjY2IDQ4NS43OTIgMjc4LjA4OCA0NzMuOTI5IDI5MyA0NzMuOTI5IDMwNy45MTIgNDczLjkyOSAzMjAgNDg1Ljc5MiAzMjAgNTAwLjQyNSAzMjAgNTE1LjA1OCAzMDcuOTEyIDUyNi45MjEgMjkzIDUyNi45MjEgMjc4LjA4OCA1MjYuOTIxIDI2NiA1MTUuMDU4IDI2NiA1MDAuNDI1WiIgZmlsbD0iIzI1NTk4QSIgZmlsbC1ydWxlPSJldmVub2RkIiBmaWxsLW9wYWNpdHk9IjAuNTIxNTY5Ii8+PHBhdGggZD0iTTE0MzIuNDggMTE1OS42OEMxNDc3LjUxIDExMTYuNzYgMTU0OC44MiAxMTE4LjQ2IDE1OTEuNzUgMTE2My40OSAxNjM0LjY4IDEyMDguNTIgMTYzMi45NyAxMjc5LjgxIDE1ODcuOTQgMTMyMi43NCAxNTQyLjkgMTM2NS42NiAxNDcxLjYgMTM2My45NSAxNDI4LjY3IDEzMTguOTIgMTM4NS43NCAxMjczLjkgMTM4Ny40NSAxMjAyLjYgMTQzMi40OCAxMTU5LjY4WiIgZmlsbD0iIzI1NTk4QSIgZmlsbC1ydWxlPSJldmVub2RkIiBmaWxsLW9wYWNpdHk9IjAuNTIxNTY5Ii8+PHBhdGggZD0iTTQ2IDEwMTIuODVDNDYgOTM2LjA5MiAxMDguMjMyIDg3My44NjkgMTg1IDg3My44NjkgMjYxLjc2OCA4NzMuODY5IDMyNCA5MzYuMDkyIDMyNCAxMDEyLjg1IDMyNCAxMDg5LjYgMjYxLjc2OCAxMTUxLjgzIDE4NSAxMTUxLjgzIDEwOC4yMzIgMTE1MS44MyA0NiAxMDg5LjYgNDYgMTAxMi44NVoiIGZpbGw9IiMyNTU5OEEiIGZpbGwtcnVsZT0iZXZlbm9kZCIgZmlsbC1vcGFjaXR5PSIwLjUyMTU2OSIvPjxwYXRoIGQ9Ik0xMDQ0IDE1MTMuNzdDMTA0NCAxNDEyLjcyIDExMjUuNzEgMTMzMC44IDEyMjYuNSAxMzMwLjggMTMyNy4yOSAxMzMwLjggMTQwOSAxNDEyLjcyIDE0MDkgMTUxMy43NyAxNDA5IDE2MTQuODMgMTMyNy4yOSAxNjk2Ljc1IDEyMjYuNSAxNjk2Ljc1IDExMjUuNzEgMTY5Ni43NSAxMDQ0IDE2MTQuODMgMTA0NCAxNTEzLjc3WiIgZmlsbD0iIzI1NTk4QSIgZmlsbC1ydWxlPSJldmVub2RkIiBmaWxsLW9wYWNpdHk9IjAuNDM5MjE2Ii8+PHBhdGggZD0iTTE0NSAxNzIyLjc0QzE0NSAxNjYwLjM0IDE5NS4zNjggMTYwOS43NiAyNTcuNSAxNjA5Ljc2IDMxOS42MzIgMTYwOS43NiAzNzAgMTY2MC4zNCAzNzAgMTcyMi43NCAzNzAgMTc4NS4xNCAzMTkuNjMyIDE4MzUuNzIgMjU3LjUgMTgzNS43MiAxOTUuMzY4IDE4MzUuNzIgMTQ1IDE3ODUuMTQgMTQ1IDE3MjIuNzRaIiBmaWxsPSIjMjU1OThBIiBmaWxsLXJ1bGU9ImV2ZW5vZGQiIGZpbGwtb3BhY2l0eT0iMC41MjE1NjkiLz48cGF0aCBkPSJNNzQ2IDE2OTEuMjVDNzQ2IDE2NzYuNjEgNzU3Ljg2NCAxNjY0Ljc1IDc3Mi41IDE2NjQuNzUgNzg3LjEzNSAxNjY0Ljc1IDc5OSAxNjc2LjYxIDc5OSAxNjkxLjI1IDc5OSAxNzA1Ljg4IDc4Ny4xMzUgMTcxNy43NCA3NzIuNSAxNzE3Ljc0IDc1Ny44NjQgMTcxNy43NCA3NDYgMTcwNS44OCA3NDYgMTY5MS4yNVoiIGZpbGw9IiMyNTU5OEEiIGZpbGwtcnVsZT0iZXZlbm9kZCIgZmlsbC1vcGFjaXR5PSIwLjUyMTU2OSIvPjxwYXRoIGQ9Ik01NSAxODM1LjIyQzU1IDE4MjAuNTkgNjYuODY0NCAxODA4LjczIDgxLjUgMTgwOC43MyA5Ni4xMzU1IDE4MDguNzMgMTA4IDE4MjAuNTkgMTA4IDE4MzUuMjIgMTA4IDE4NDkuODYgOTYuMTM1NSAxODYxLjcyIDgxLjUgMTg2MS43MiA2Ni44NjQ0IDE4NjEuNzIgNTUgMTg0OS44NiA1NSAxODM1LjIyWiIgZmlsbD0iIzI1NTk4QSIgZmlsbC1ydWxlPSJldmVub2RkIiBmaWxsLW9wYWNpdHk9IjAuMjc4NDMxIi8+PHBhdGggZD0iTTQxMiAxODU3LjIyQzQxMiAxNzk1LjEgNDYyLjM2OCAxNzQ0Ljc0IDUyNC41IDE3NDQuNzQgNTg2LjYzMiAxNzQ0Ljc0IDYzNyAxNzk1LjEgNjM3IDE4NTcuMjIgNjM3IDE5MTkuMzQgNTg2LjYzMiAxOTY5LjcgNTI0LjUgMTk2OS43IDQ2Mi4zNjggMTk2OS43IDQxMiAxOTE5LjM0IDQxMiAxODU3LjIyWiIgZmlsbD0iIzI1NTk4QSIgZmlsbC1ydWxlPSJldmVub2RkIiBmaWxsLW9wYWNpdHk9IjAuNTIxNTY5Ii8+PHBhdGggZD0iTTExMjQgMTc4NC4yM0MxMTI0IDE3NjkuNiAxMTM2LjA5IDE3NTcuNzQgMTE1MSAxNzU3Ljc0IDExNjUuOTEgMTc1Ny43NCAxMTc4IDE3NjkuNiAxMTc4IDE3ODQuMjMgMTE3OCAxNzk4Ljg3IDExNjUuOTEgMTgxMC43MyAxMTUxIDE4MTAuNzMgMTEzNi4wOSAxODEwLjczIDExMjQgMTc5OC44NyAxMTI0IDE3ODQuMjNaIiBmaWxsPSIjMjU1OThBIiBmaWxsLXJ1bGU9ImV2ZW5vZGQiIGZpbGwtb3BhY2l0eT0iMC41MjE1NjkiLz48cGF0aCBkPSJNODI2IDE3MzEuNzRDODI2IDE2NjkuMzQgODc2LjM2OCAxNjE4Ljc2IDkzOC41IDE2MTguNzYgMTAwMC42MyAxNjE4Ljc2IDEwNTEgMTY2OS4zNCAxMDUxIDE3MzEuNzQgMTA1MSAxNzk0LjE0IDEwMDAuNjMgMTg0NC43MiA5MzguNSAxODQ0LjcyIDg3Ni4zNjggMTg0NC43MiA4MjYgMTc5NC4xNCA4MjYgMTczMS43NFoiIGZpbGw9IiMyNTU5OEEiIGZpbGwtcnVsZT0iZXZlbm9kZCIgZmlsbC1vcGFjaXR5PSIwLjUyMTU2OSIvPjxwYXRoIGQ9Ik0zNzkgMTQ4Mi43OEMzNzkgMTQyMC4zOCA0MjkuMzY4IDEzNjkuNzkgNDkxLjUgMTM2OS43OSA1NTMuNjMyIDEzNjkuNzkgNjA0IDE0MjAuMzggNjA0IDE0ODIuNzggNjA0IDE1NDUuMTggNTUzLjYzMiAxNTk1Ljc2IDQ5MS41IDE1OTUuNzYgNDI5LjM2OCAxNTk1Ljc2IDM3OSAxNTQ1LjE4IDM3OSAxNDgyLjc4WiIgZmlsbD0iIzI1NTk4QSIgZmlsbC1ydWxlPSJldmVub2RkIiBmaWxsLW9wYWNpdHk9IjAuNTIxNTY5Ii8+PHBhdGggZD0iTTEyNzMgMTY4NC43NUMxMjczIDE2MjIuMzUgMTMyMy41OSAxNTcxLjc2IDEzODYgMTU3MS43NiAxNDQ4LjQxIDE1NzEuNzYgMTQ5OSAxNjIyLjM1IDE0OTkgMTY4NC43NSAxNDk5IDE3NDcuMTUgMTQ0OC40MSAxNzk3LjczIDEzODYgMTc5Ny43MyAxMzIzLjU5IDE3OTcuNzMgMTI3MyAxNzQ3LjE1IDEyNzMgMTY4NC43NVoiIGZpbGw9IiMyNTU5OEEiIGZpbGwtcnVsZT0iZXZlbm9kZCIgZmlsbC1vcGFjaXR5PSIwLjUyMTU2OSIvPjxwYXRoIGQ9Ik0xNDI4IDE0OTIuNzhDMTQyOCAxNDc3Ljg3IDE0NDAuMDkgMTQ2NS43OCAxNDU1IDE0NjUuNzggMTQ2OS45MSAxNDY1Ljc4IDE0ODIgMTQ3Ny44NyAxNDgyIDE0OTIuNzggMTQ4MiAxNTA3LjY5IDE0NjkuOTEgMTUxOS43NyAxNDU1IDE1MTkuNzcgMTQ0MC4wOSAxNTE5Ljc3IDE0MjggMTUwNy42OSAxNDI4IDE0OTIuNzhaIiBmaWxsPSIjMjU1OThBIiBmaWxsLXJ1bGU9ImV2ZW5vZGQiIGZpbGwtb3BhY2l0eT0iMC4yMTE3NjUiLz48cGF0aCBkPSJNNjQzIDExMi40ODNDNjQzIDk3Ljg0OTggNjU0Ljg2NSA4NS45ODcxIDY2OS41IDg1Ljk4NzEgNjg0LjEzNiA4NS45ODcxIDY5NiA5Ny44NDk4IDY5NiAxMTIuNDgzIDY5NiAxMjcuMTE2IDY4NC4xMzYgMTM4Ljk3OSA2NjkuNSAxMzguOTc5IDY1NC44NjUgMTM4Ljk3OSA2NDMgMTI3LjExNiA2NDMgMTEyLjQ4M1oiIGZpbGw9IiMyNTU5OEEiIGZpbGwtcnVsZT0iZXZlbm9kZCIgZmlsbC1vcGFjaXR5PSIwLjE4ODIzNSIvPjwvZz48L3N2Zz4=');
      background-repeat: no-repeat;
      background-size: cover;
      background-position: top;
      background-attachment: fixed;
      background-color: #f4f4f4;
    }

    .container {
      width: 100%;
      text-align: center;
      display: flex;
      flex-direction: column;
      align-items: center;
    }

    table {
      width: 1150px;
      border-collapse: collapse;
      box-shadow: 6px 6px 15px rgba(0, 0, 0, 0.3);
      border-radius: 8px;
      overflow: hidden;
      border: 0px solid #000000;
      background-color: #ffffff;
      margin: 10px auto;
    }

    th,
    td {
      border: 0px solid #000000;
      padding: 8px;
      padding-top: 3px;
      padding-bottom: 100px;
      text-align: center;
      vertical-align: middle;
    }

    th {
      background-color: #f4f4f4;
      font-weight: bold;
    }

    .bold {
      font-weight: bold;
      margin-left: 8px;
    }

    .footer {
      font-size: 12px;
      font-family: verdana;
      vertical-align: bottom;
      margin-top: 300px;
      margin-bottom: 50px;
      color: #adadad;
    }

    /* ========== CLICKABLE BOXES STYLES ========== */
    .match-columns {
      display: flex;
      justify-content: center;
      gap: 200px;
      margin-top: 30px;
      margin-bottom: 30px;
    }

    .column {
      display: flex;
      flex-direction: column;
      align-items: center;
      min-width: 180px;
    }

    .choice {
  display: flex;
  justify-content: center;
  align-items: center;
  flex-wrap: wrap;
  padding: 12px 20px;
  margin: 8px 0;
  border: 2px solid #aaa;
  border-radius: 8px;
  background-color: #f9f9f9;
  cursor: pointer;
  font-family: Verdana, sans-serif;
  font-size: 16px;
  user-select: none;
  transition: background-color 0.5s, border-color 0.5s, color 0.5s, opacity 1.5s ease, max-height 1.5s ease;
  width: 350px;
  text-align: center;
  min-height: 40px;
  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2); /* <-- drop shadow */
}

    .choice:hover {
      background-color: #e6f0ff;
      border-color: #3399ff;
      border: solid;
    }

    .choice.selected {
      background-color: #d0e7ff;
      border-color: #007bff;
    }

    /* === Left side boxes (both ID and class selectors) === */
    #left-list .choice,
    .left-list .choice {
      background-color: #f9f9f9;
      border: 2px solid #aaa;
      color: #333;
      cursor: pointer;
      transition: background-color 0.5s, border-color 0.5s;
    }

    #left-list .choice.selected,
    .left-list .choice.selected {
      background-color: #;
      border-color: #000000;
      transition: none; /* No transition by default */
    }

    #left-list .choice.correct,
    .left-list .choice.correct {
      background-color: #d4edda;
      border-color: #28a745;
      color: #155724;
      cursor: pointer;
    }

    #left-list .choice.incorrect,
    .left-list .choice.incorrect {
      background-color: #f8d7da;
      border-color: #dc3545;
      color: #721c24;
    }

    /* === Right side boxes (both ID and class selectors) === */
    #right-list .choice,
    .right-list .choice {
      background-color: #f9f9f9;
      border: 2px solid #aaa;
      color: #333;
      cursor: pointer;
      transition: background-color 0.5s, border-color 0.5s;
    }

    #right-list .choice.selected,
    .right-list .choice.selected {
      background-color: #;
      border-color: #000000;

    }

    #right-list .choice.correct,
    .right-list .choice.correct {
      background-color: #d4edda;
      border-color: #28a745;
      color: #155724;
      cursor: default;
    }

    #right-list .choice.incorrect,
    .right-list .choice.incorrect {
      background-color: #f8d7da;
      border-color: #dc3545;
      color: #721c24;
    }

    /* Block container styles for fade in */
    .block {
      opacity: 0;
      max-height: 0;
      overflow: hidden;
      transition: opacity 1.5s ease, max-height 1.5s ease;
      margin-bottom:100px;
    }

    .block.active {
      opacity: 1;
      max-height: 2000px; /* large enough to show content */
      overflow: visible;
    }

.popup {
  position: fixed;
  top: 85%;
  left: 50%;
  transform: translate(-50%, -50%);
  background: #ffffff;
  padding: 40px 16px;
  border: 2px solid #A9A9A9;
  border-radius: 10px;
  z-index: 1000;
  max-width: 95%;
  width: 900px;
  height: auto;
  box-sizing: border-box;
  text-align: center;
  font-family: Verdana, sans-serif;
  font-size: 16px;
  color: #3A3A3A;
  display: none;
}

.popup.show {
  display: block;
  animation: fadeIn 0.3s ease;
}

@keyframes fadeIn {
  from { opacity: 0; transform: translate(-50%, -60%); }
  to { opacity: 1; transform: translate(-50%, -50%); }
}

.popup .close-btn {
  position: absolute;
  top: 12px;
  right: 16px;
  width: 32px;
  height: 32px;
  font-size: 20px;
  font-weight: bold;
  color: #3A3A3A;
  background: #ddd;
  border: none;
  border-radius: 10%;
  cursor: pointer;
  line-height: 30px;
  text-align: center;
  padding: 0;
  margin-top:4px;
  user-select: none;
}
 .fade-move {
  transition: opacity 0.3s ease, margin-left 0.3s ease;
  opacity: 0.5;
  margin-left: 20px;
}

.next-button {
  margin-top: 20px;
  padding: 10px 20px;
  font-size: 16px;
  font-weight: bold;
  background: linear-gradient(360deg, #2C6CA6 0%, #5599FF 100%);
  color: white;                   /* White text */
  border: none;
  border-radius: 6px;
  cursor: pointer;
  box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
  transition: background-color 0.3s ease;
}

.next-button:hover {
  background-color: #0056b3;      /* Darker blue on hover */
}