/* ==========================
            common to most except index
            this has phone code at the bottom
            index uses a separate module for phone code
            ========================== */
		

            /* ==========================
            reset block
            ========================== */
        * {
            margin: 0;
            padding: 0;
            box-sizing: border-box;
        }
        body {
            background-color: #000000;
            
            /* ==========================
            One vh is equal to exactly 1% 
            of the viewport's height.
            Therefore, 100vh means 100% 
            of the browser window's full height.
            ========================== */
            min-height: 100vh;
            
            display: flex;
            justify-content: center;
            font-family: 'Lato', sans-serif;
            
            width: 1000px ;
            min-width: 1000px ;
            margin: 0 auto ; /* Centers perfectly on large desktop monitors */
            position: relative;
        }

        .page-container {
            width: 962px;
            background-color: #000000;
            position: relative;
            padding: 10px 0 20px 0;
            margin: 20px auto;
        }

        .logo {
            text-align: center;
            margin-bottom: 8px;
        }
        .logo img {
            width: 139px;
            height: 127px;
            display: block;
            margin: 0 auto;
        }

        .nav-bar {
            display: flex;
            justify-content: center;
            gap: 6px;
            margin-bottom: 20px;
        }
        .nav-bar a {
            display: inline-block;
            transition: transform 0.2s ease;
            border: 3px solid transparent;
            line-height: 0;
        }
        .nav-bar a:hover {
            transform: scale(1.05);
        }
        .nav-bar a.active {
            border: 3px solid #cc3300;
        }
        .nav-bar img {
            height: 62px;
            width: auto;
            display: block;
        }

        .footer-text {
            text-align: center;
            color: #cc3300;
            font-family: Garamond, 'Times New Roman', serif;
            font-size: 18px;
            margin-top: 15px;
            padding-top: 15px;
            border-top: 1px solid #222;
        }
        .footer-text a {
            color: #66b3ff;
            text-decoration: none;
        }
        .footer-text a:hover {
            text-decoration: underline;
        }

        .loading {
            text-align: center;
            color: #888888;
            padding: 40px 0;
            font-size: 1.2rem;
        }

        
        
        
        /* ==========================    
            mobile phone stoppers
        ========================== */
        html, body {
        
     
          /* 1. Stop font sizes from bloating/changing on mobile */
          -webkit-text-size-adjust: 100%;
          text-size-adjust: 100%;

          /* Stop pull-to-refresh and "rubber-band" bouncing when scrolling */
            overscroll-behavior: none;
          
          /* Resets native, bubbly mobile button and input styles to a flat canvas */
            button, select, input {
            -webkit-appearance: none;
            appearance: none;
           }
        }