/* reset rule */
  *{margin: 0; padding: 0; box-sizing: border-box;}

    body {
    font-family:verdana;
    color: #444;
    background-image: url("../images/weight_room.jpg");
    min-height: 100vh;
    background-size: cover;
    background-repeat: no-repeat;
    background-attachment: fixed;
    background-position: center 30%;
    }

    #gym_div {
        border: 20px solid rgba(199, 239, 24, 0.3); /* circular border */
        border-radius: 20px;
        width: 90%;
        max-width: 1200px;
        min-height: 90vh; /* Fixed height enables scrolling */
        margin: 20px auto 0; /* adds top space and centers */
        background-color: rgba(172, 102, 102, 0.9);
        padding: 2rem;
        overflow-y:auto;
    }

    #gym_div h1 {
        margin: 1rem 0; /*space below heading */
        font-size: clamp(1.8rem, 3vh, 2.5rem);
        color: #fff;
        text-shadow: 1px 1px 3px rgba(0, 0, 0, 0.5);
    }

    #gym_div .normal {
        text-align: center;
        margin: 1rem 0; /* space above and below paragraph */
        padding: 15px; /* prevents text from touching borders */
        line-height: 1.6;
        color: #fff;
        background-color: rgba(0, 0, 0, 0.3);
        border-radius: 8px;
    }

    @media (max-width: 600px) {
        #gym_div h1 {
          font-size: 1.5rem;
        }
        #gym_div .normal {
          font-size: 0.9rem;
        }
      }

    #gym_div::-webkit-scrollbar {
        width: 8px;
    }

    #gym_div::-webkit-scrollbar-thumb {
        background: rgba(199, 239, 24, 0.3);
        border-radius: 4px;
    }

   .Jeff_Nippard_Ultimate_Guide {
        width: 100%;
        display: flex;
        flex-direction: column;
        gap: 2rem;
        align-items: center;
        margin: 2rem 0;
   }

   .Jeff_Nippard_Ultimate_Guide iframe {
        width: 100%;
        max-width: 560px;
        height: 315px;
        aspect-ratio: 16/9;
        border: 4px solid rgba(199,239,24,0.3);
        border-radius: 10px;
        background: #000;
   }

   @media (max-width: 768px) {
    .Jeff_Nippard_Ultimate_Guide iframe {
      height: auto;
      min-height: 200px;
    }
  }

  nav { 
    text-align: center;
    margin-top: 2rem;
    padding: 15px;
    background-color: rgba(0, 0, 0, 0.4);
    border-radius: 8px;
   } 

   /* styling the hyperlinks within the nav menu */
   nav a {
    color: rgb(238, 208, 148);
    text-decoration: none;
    padding: 8px 15px;
    margin: 0 5px;
    border-radius: 4px;
    transition: all 0.3s ease;
    display: inline-block;
   }

   nav a:hover { background-color: #6101ba; color: #f10f0f; transform: translateY(-2px); }

   .hidden-footer {
    background: linear-gradient(to right, #006400, forestgreen);
    padding: 15px;
    text-align: center; 
    opacity: 0.8; /* hidden by default */
    width: 100%;
    color: sandybrown; 
    transition: all 0.3s ease; /* Smooth fade effect */
    font-size: 0.9rem;
   }

 .hidden-footer:hover {
    opacity: 1; /* reveals on hover */
    box-shadow: 0 -2px 10px rgba(0,0,0,0.2);
   }

   /* Responsive adjustments */
@media (max-width: 768px) {
    #gym_div {
        width: 95%;
        padding: 1rem;
    }
    
    .Jeff_Nippard_Ultimate_Guide iframe {
        height: auto;
        min-height: 200px;
    }
    
    nav a {
        display: block;
        margin: 5px 0;
    }
}