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

/*Google Font Special Gothic Condensed One*/
body {
    font-family: "Special Gothic Condensed One", sans-serif;
    font-weight: 400;
    font-style: normal;
    margin: 0;
    padding: 0;
    background-image: url(../images/html2.jpg);
    background-size: 165%;
    
    
  }
  
  
  header {
    padding: 1rem;
    text-align: right;
  }
  
  header h1 {
    color: #eee;
    margin: 0;
    font-size: 3.5rem;
  }
  
  .container {
    background-color: white;
    margin: 40px auto;
    padding: 20px;
    border-radius: 8px;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
    position: absolute;
    bottom: 120px;
    left: 42%;
    transform: translateX(-65%);
  }



  
  
  footer {
    background-color: lightslategray;
    color: limegreen;
    text-align: center;
    padding: 7px 0; /* Reduced padding for a smaller footer */
    position: fixed;
    bottom: 0;
    width: 100%;
    box-shadow: 0 -2px 4px rgba(0, 1, 0, 0.1);
  }

    /* Arrange the footer navigation links horizontally with a gap */
    footer nav {
        display: flex;
        justify-content: center;
        gap: 20px;
        margin-bottom: 3px;
      }
      
      /* Adjust the size of the nav links to create a smaller footer */
      footer nav a {
        display: flex;
        align-items: center;
        justify-content: center;
        width: 80px;  /* Reduced size */
        height: 80px; /* Reduced size */
        border: 2px solid #eee;
        border-radius: 50%;
        text-decoration: none;
        color: #eee;
        font-size: 1rem; /* Smaller font size */
        font-weight: bold;
        transition: all 0.3s, color 0.3s;
      }
      
      footer nav a:hover {
        background-color: #0eafe5;
        color: white;
      }