@import url('https://fonts.googleapis.com/css2?family=Alfa+Slab+One&family=IBM+Plex+Sans:wght@200&display=swap');
        .animation1 {
            aspect-ratio: 1;
            border: 1px solid #ccc;
            border-radius: 2vmin;
            color: #03113f;
            font-size: 3.10vmin;
            left: 50%;
            line-height: 8vmin;
            margin: 0;
            overflow: hidden;
            padding: 2vmin;
            top: 50%;
            width: 31vmin;
        }
        
        .animation1:first-line {
            color: #066bfb;
        }
        
        .animation1 figure {
            margin: 0;
        }
        
        @keyframes show {
            0% {
                opacity: 0;
                left: -2ch;
            }
            7%,
            100% {
                opacity: 1;
                left: 0ch;
            }
        }
        
        .animation1 figure span {
            animation: show 5s 1 forwards;
            font-family: 'IBM Plex Sans', Georgia, serif;
            font-weight: 200;
            opacity: 0;
            position: relative;
        }
        
        .animation1 figure span[aria-hidden] {
            font-size: 0.7em;
            vertical-align: bottom;
        }
        
        .animation1 span:nth-child(1) {
            animation-delay: 1s;
        }
        
        .animation1 span:nth-child(2) {
            animation-delay: 1.333s;
        }
        
        .animation1 span:nth-child(3) {
            animation-delay: 1.666s;
        }
        
        .animation1 span:nth-child(4) {
            animation-delay: 2s;
        }
        
        .animation1 span:nth-child(5) {
            animation-delay: 2.333s;
        }
        
        .animation1 span:nth-child(6) {
            animation-delay: 2.666s;
        }
        
        .animation1 span:nth-child(7) {
            animation-delay: 3s;
        }
        
        .animation1 figcaption {
            bottom: 2vmin;
            color: #066bfb;
            font-family: 'Alfa Slab One', Helvetica, sans-serif;
            font-size: 5vmin;
            height: 5vmin;
            line-height: 5vmin;
            font-weight: 400;
            -webkit-mask: repeating-linear-gradient(#0000 0 6.66%, #000 0 12%);
            mask: repeating-linear-gradient(#0000 0 6.66%, #000 0 12%);
            position: absolute;
        }
        
        @media (prefers-reduced-motion) {
            .animation1 span {
                left: auto !important;
            }
        }
        .topnav {
            overflow: hidden;
            background-color: #04AA6D;
            padding: 2px;
        }
        
        rgb (101, 43, 43)rgb(43, 86, 101)rgb(7, 115, 154)rgb(7, 154, 83) .topnav a {
            float: left;
            color: #f2f2f2;
            text-align: center;
            padding: 14px 16px;
            text-decoration: none;
            font-size: 17px;
        }
        
        .topnav a:hover {
            background-color: #ddd;
            color: black;
        }
        /* Create a right-aligned (split) link inside the navigation bar */
        
        .topnav a.split {
            float: right;
            background-color: #04AA6D;
            color: white;
        }
        
        .topnav a {
            float: right;
            margin-right: 20px;
        }
        .blink_me {
            animation: blinker 1s linear infinite;
        }
        
        @keyframes blinker {
            50% {
                opacity: 0;
            }
        }
        .zoom {
            transition: transform .2s;
            /* Animation */
        }
        
        .zoom:hover {
            transform: scale(1.1);
            font-size: 17px;
            /* (150% zoom - Note: if the zoom is too large, it will go outside of the viewport) */
        }
        .banner {
            width: 100%;
            height: 320px;
            background-image: url(assets/Banner/membersrule.png);
            background-position: center center;
            background-size: cover;
        }