body {
        margin: 0;
        padding: 0;
        background-image: url(../img/BG/BG-IMAGE_ABOUT_GAME-PP.jpg);
        background-position: center center;
        background-size: cover;
        background-repeat: no-repeat;
        background-attachment: fixed;
        color: #ffffff;
        text-shadow: 0 0 4px #000;
    }


   header {
       padding: 20px;
       text-align: center;
       background: linear-gradient(0deg, rgba(255, 136, 0, 1) 0%, rgba(120, 42, 0, 1) 100%);
       ;
       box-shadow: 0px 0px 10px black;
   }


   a{
    text-decoration: none;
    color: #ff9500;
   }


   h1 {
       margin: 0;
       font-size: 2.4rem;
       letter-spacing: 1px;
   }


   .language-switcher {
       margin-top: 32px;
   }


   .AB-BTN {
       padding-top: 4px;
       padding-bottom: 4px;
       padding-left: 4px;
       padding-right: 4px;
       border: none;
       outline: none;
       background-color: #ffffff;
       color: rgb(0, 0, 0);
       font-weight: 700;
       font-size: 16px;
       transition: all 0.25s ease-in-out;
       border-radius: 6px;
   }


   .AB-BTN:hover {
       cursor: pointer;
       opacity: 0.7;
       box-shadow: 0px 0px 5px rgba(0, 0, 0, 0.5);
   }


   main {
       max-width: 900px;
       margin: 40px auto;
       padding: 20px;
       background: linear-gradient(180deg, rgba(255, 136, 0, 1) 0%, rgba(120, 42, 0, 1) 100%);
       border-radius: 12px;
       box-shadow: 0px 0px 15px black;
   }


   h2 {
       margin-top: 40px;
       font-size: 1.8rem;
   }


   p,
   li {
       font-size: 1.1rem;
       line-height: 1.6;
   }


   ul {
       padding-left: 20px;
   }


   .button-area {
       margin-top: 40px;
       text-align: center;
       margin-bottom: 40px;
   }


   .back-btn {
       padding: 12px 26px;
       background: #ff9500;
       color: #ffffff;
       border-radius: 6px;
       cursor: pointer;
       font-weight: 700;
       text-decoration: none;
       transition: 0.3s;
   }


   .back-btn:hover {
       background: #ffdb4d;
   }


   @media(max-width: 768px) {
       h1 {
           font-size: 2rem;
       }

       h2 {
           font-size: 1.5rem;
       }

       p,
       li {
           font-size: 1rem;
       }

       main {
           margin: 20px;
       }
   }


   @media(max-width: 480px) {
       h1 {
           font-size: 1.7rem;
       }

       h2 {
           font-size: 1.3rem;
       }

       p,
       li {
           font-size: 0.95rem;
       }
   }