<html lang="en">

<head>
  <!-- Import SweetAlert2 CSS -->
  <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/sweetalert2@11.1.5/dist/sweetalert2.min.css">

  <!-- Import SweetAlert2 JavaScript -->
  <script src="https://cdn.jsdelivr.net/npm/sweetalert2@11.1.5/dist/sweetalert2.min.js"></script>
  <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
  <title>
    Trang Chủ - Ngọc rồng ART  </title>
  <link rel="canonical" href="" />
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <link rel="icon" type="image/x-icon" href="../public/images/logo/goku.png">
  <!-- bootstrap -->
  <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.0.2/dist/css/bootstrap.min.css" rel="stylesheet">
  <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.0.2/dist/js/bootstrap.bundle.min.js"></script>
  <!-- icon -->
  <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
  <!-- jquery -->
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
  <script src="https://code.jquery.com/jquery-3.6.1.min.js"></script>
  <!-- mycss -->
  <link rel="stylesheet" href="../public/css/cssweb.css?cssweb=72577">
  <script src="//cdn.jsdelivr.net/npm/sweetalert2@11"></script>
  <!-- bootstrap -->
  <script src="https://cdn.jsdelivr.net/npm/@popperjs/core@2.9.2/dist/umd/popper.min.js"></script>
  <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.0.2/dist/js/bootstrap.min.js"></script>
  <!-- Captcha Goole -->
  <script src='https://www.google.com/recaptcha/api.js' async defer></script>
  <script>
    const redirectLink = 'trang-chu';
    document.addEventListener('keydown', function (event) {
      if (event.key === 'F12' || (event.ctrlKey && event.shiftKey && event.key === 'I')) {
        window.location.href = redirectLink;
        event.preventDefault();
      }
    });

    document.addEventListener('contextmenu', function (event) {
      window.location.href = redirectLink;
      event.preventDefault();
    });
    document.addEventListener('keydown', function (event) {
      if (event.ctrlKey && event.key === 'u') {
        window.location.href = redirectLink;
        event.preventDefault();
      }
    });

    setInterval(blockDevTools, 1000);
  </script>
  <style type="text/css">
    #cssweb {
      background-color: black;
    }

    #cssweb2 {
      padding: 30px;
      background-color: rgba(0, 0, 0, 0.3);
    }

    #custom-hr {
      border: none;
      border-top: 1px solid #000;
      margin: 10px 0;
    }

    #custom-hr2 {
      border: none;
      border-top: 1px solid #000;
      margin: 10px 0;
    }

       
	.btn-action {
		background-color: #a10303;
		border-color: black;
		font-weight: bold;
	}

	.btn-action:hover,
	.btn-action:focus {
		background-color: #ffca85 ;
		border-color: black;  
		font-weight: bold;
	}
        
	.btn-download {
		background-color: #FB1B1B;
		border-color: black;
		text-shadow: 1px 1px 0 black;
	}
	.btn-download:hover,
	.btn-download:focus {
		background-color: #b8f9f1;
		border-color: 1px solid black;
		font-weight: bold;
	}
  </style>
</head>

<body class="girlkun-bg" id="cssweb">
  <div class="container-md p-1 col-sm-12 col-lg-6" style="
	z-index: 1;  
	position: relative;
	border-radius: 7px; 
	border: 2px solid #FB1B1B; 
	box-shadow: 0 0 15px #FB1B1B; 
	background-color: #fff6c4;
	padding: 10px;
"">
      <style>

        .btn-navbar{
            background-color: #5E17EB;
            border-color: black;
            text-shadow: 1px 1px 0 black;
        }
        .btn-navbar:hover,
        .btn-navbar:focus {
            background-color:#5500FF;
            border-color: 1px solid black;
            font-weight: bold;
        }
       
        .table-custom, .table-custom tr, .table-custom td, .table-custom th {
          border: none !important;
        }
        .table-custom th, .table-custom td:first-child {
          width: 150px;
        }
        
        @keyframes blink {
          0% { color: black; }
          50% { color: red; }
          100% { color: black; }
        }
        @keyframes flashing {
          0% {
            border-color: black;
          }
          50% {
            border-color: yellow;
          }
          100% {
            border-color: black;
          }
        }
        @keyframes flashing1 {
          0% {
            border-color: black;
          }
          50% {
            border-color: red;
          }
          100% {
            border-color: black;
          }
        }
        @keyframes flashing2 {
          0% {
            border-color: black;
          }
          50% {
            border-color: #9CF100;
          }
          100% {
            border-color: black;
          }
        }
        @keyframes stretch {
          0% {
            transform: scale(1);
          }
          50% {
            transform: scale(1.2);
          }
          100% {
            transform: scale(1);
          }
        }
        .text-black1 {
          animation: blink 0.5s infinite;
        }

        @keyframes blinking {
          0% { color: #FF0000; }
          50% { color: #FFFFFF; }
          100% { color: #FF0000; }
        }

        .blinking-link {
          animation: blinking 0.5s infinite;
        }
      </style>


<style>


.section1{
    position: relative;
    top: 0;
    left: 0;
    width: 100%;
    height: 100vh;
    background: url(./bg0.jpg);
    background-position-x: center;
    background-size: cover;
}
.span1{
    position: absolute;
    top: 50%;
    left: 50%;
    width: 4px;
    height: 4px;
    background: #fff;
    border-radius: 50%;
    box-shadow: 0 0 0 4px rgba(255, 255, 255, 0.1), 0 0 0 8px rgba(255, 255, 255, 0.1), 0 0 20px rgba(255, 255, 255, 1)  ;
    animation:  animate 1s linear infinite;
}
.span1::before{
    content: '';
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    width: 300px;
    height: 1px;
    background: linear-gradient(90deg, #fff, transparent);
}
@keyframes animate {
    0%
    {
        transform: rotate(315deg) translateX(0);
        opacity: 1;
    }
    70%
    {
        opacity: 1;

    }
    100%
    {
        transform: rotate(315deg) translateX(-1500px);
        opacity: 0;

    }
    
}
.span1:nth-child(1){
    top: 0;
    right: 0;
    left:initial;
    animation-delay:0 ;
    animation-duration: 1s;
}

.span1:nth-child(2){
    top: 0;
    right: 80px;
    left:initial;
    animation-delay:0.2s;
    animation-duration: 3s;
}

.span1:nth-child(3){
    top: 80px;
    right: 0px;
    left:initial;
    animation-delay:0.4s ;
    animation-duration: 2s;
}

.span1:nth-child(4){
    top: 0;
    right: 180px;
    left:initial;
    animation-delay:0.6s;
    animation-duration: 1.5s;
}

.span1:nth-child(5){
    top: 0;
    right: 400px;
    left:initial;
    animation-delay:0.8s;
    animation-duration: 2.5s;
}

.span1:nth-child(6){
    top: 0;
    right: 600px;
    left:initial;
    animation-delay:1s ;
    animation-duration: 3s;
}
.span1:nth-child(7 ){
    top: 300px;
    right: 0px;
    left:initial;
    animation-delay:1s ;
    animation-duration: 1.75s;
}

.span1:nth-child(8){
    top: 0px;
    right: 700px;
    left:initial;
    animation-delay:1.4s ;
    animation-duration: 1.25s;
}

.span1:nth-child(9){
    top: 0px;
    right: 1000px;
    left:initial;
    animation-delay:0.75s ;
    animation-duration: 2.25s;
}

.span1:nth-child(10){
    top: 0px;
    right: 1000px;
    left:initial;
    animation-delay:2.75s ;
    animation-duration: 2.25s;
}
.decorative-section {
    position: fixed;
    overflow: hidden;
}

.image-container {
display: flex;
flex-wrap: wrap;
justify-content: center; /* Căn giữa các hình ảnh trên dòng */
}

.btn-img {
max-width: 160px; /* Điều chỉnh kích thước tối đa của hình ảnh */
margin: 5px; /* Tạo khoảng cách giữa các hình ảnh */
}

@media (max-width: 576px) {
.btn-img {
    max-width: 100px; /* Điều chỉnh kích thước tối đa của hình ảnh trên màn hình di động */
}
}
</style>




      <main>
        <!-- header -->
        <div style=" background-color: rgba(254, 217, 0, 0.9); border-radius: 7px; box-shadow: 0px 2px 5px black;"
    class="pb-1 ">

    <!-- logo -->
    <style>
      .hovered img {
        transform: scale(1.1);
      }

      a img {
        transition: transform 0.3s ease;
      }

      .marquee {
        font-size: 20px;
        overflow: hidden;
        white-space: nowrap;
        width: 50%;
        margin: 0 auto;
        text-align: center;
        padding-top: 10px;
        padding-bottom: 10px;
        font-weight: bold;
      }

      .marquee span {
        display: inline-block;
        animation: marquee 2s linear infinite;
        padding: 0 20px;
        color: white;
      }

      @keyframes marquee {
        0% {
          transform: translateX(100%);
        }

        100% {
          transform: translateX(-100%);
        }
      }

      @keyframes blink {
        0% {
          color: #FFCF00;
        }

        50% {
          color: red;
        }

        100% {
          color: #FFCF00;
        }
      }

      .marquee span {
        animation: marquee 7s linear infinite, blink 1s ease-in-out infinite;
      }

      /* animation: stretch 2s infinite alternate; thành phần co giãn logo */
    </style>
    <div class="p-xs">
      <div class="image-container">
        <a href="trang-chu">
          <center><img style=" width:60%; padding-bottom:10px; pointer-events: none;" src="../public/images/logo/logoweb.gif"
          alt="Logo">
          </center>
        </a>
      </div>
    </div>
    <script>
      function addHoverClass(element) {
        element.classList.add("hovered");
      }

      function removeHoverClass(element) {
        element.classList.remove("hovered");
      }
    </script>

    <div class="marquee">
      <span>Chào mừng bạn đến với Ngọc rồng ART</span>
    </div>
  </div>

  <div class="col text-center mt-2 ">

    <!-- navbar -->
    <div class="align-items-center my-2 d-flex justify-content-center image-container">
      <a href="trang-chu" onmouseover="addHoverClass(this)" onmouseout="removeHoverClass(this)">
        <img src="/public/images/icon/trangchu.png" alt="Trang Chủ" style="max-width: 160px; pointer-events: none;"
          class="btn-img"></a>
      <a id="logoLink" onmouseover="addHoverClass(this)" onmouseout="removeHoverClass(this)">
        <img src="/public/images/icon/taigame.png" alt="Tải Game" style="max-width: 160px; pointer-events: none;"
          class="btn-img"></a>
      <a href="https://zalo.me/g/tldayp224" onmouseover="addHoverClass(this)" onmouseout="removeHoverClass(this)">
        <img src="/public/images/icon/boxzalo.png" alt="Box Zalo" style="max-width: 160px; pointer-events: none;"
          class="btn-img"></a>
    </div>

    <div class="user_name">
                </div>



          <a href="Login" onmouseover="addHoverClass(this)" onmouseout="removeHoverClass(this)">
        <img src="/public/images/icon/dangnhap.png" alt="Đăng nhập" style="max-width: 160px; pointer-events: none;"
          class="btn-img"></a>
      <a href="Register" onmouseover="addHoverClass(this)" onmouseout="removeHoverClass(this)">
        <img src="/public/images/icon/dangky.png" alt="Đăng ký" style="max-width: 160px; pointer-events: none;"
          class="btn-img"></a>
    
    <!-- <div class="p-1 mt-1 ibox-content"
      style="background-color: rgba(254, 217, 0, 0.9); border-radius: 7px; box-shadow: 0px 2px 5px black; margin-bottom:10px;">
      <div class="p-1 text-white"> -->
                  <div class="align-items-center my-2 d-flex justify-content-center image-container">
            <a href="napATM" onmouseover="addHoverClass(this)" onmouseout="removeHoverClass(this)">
              <img src="/public/images/icon/napcoin.png" alt="Trang Chủ" style="max-width: 180px; pointer-events: none;"
                class="btn-img"></a>
            <a href="BXH" onmouseover="addHoverClass(this)" onmouseout="removeHoverClass(this)">
              <img src="/public/images/icon/bxh.png" alt="Box Zalo" style="max-width: 180px; pointer-events: none;"
                class="btn-img"></a>
          </div>
              <!-- </div>
    </div> -->



    <script src="../animation/animation.js"></script>
    <div id="myModal" class="modal">
      <div class="modal-content" style="border: 5px solid black; background: #fff6c4; border-radius: 30px;">
        <span class="close">&times;</span>

        <div class="image-container">
          <a>
            <center><img style="width:40%; padding-bottom:2px;" src="../public/images/logo/logoweb.gif" alt="Logo"></center>
          </a>
        </div>

        <div class="mt-2">
          <div class="card download-bg suggestion" style="border: 2px solid black; border-radius: 30px;">
            <div class="card-body text-center d-flex justify-content-center align-items-center flex-column">
              <h5 class="card-title"><i class="fa-brands fa-android"></i> Phiên Bản Android</h5>
              <p class="card-text">Nhấn vào đây để tải game cho điện thoại Android của bạn.</p>
              <div class="d-flex justify-content-center">
                <a class="btn btn-info1 me-1 mt-1" href="Link">
                  <i class="fa fa-download"></i> Tải về ngay
                </a>
                <!-- <a class="btn btn-info1 me-1 mt-1" href="">
                  <i class="fa fa-download"></i> Cấu hình cao
                </a> -->
              </div>
            </div>
          </div>
        </div>

        <div class=" mt-2">
          <div class="card download-bg suggestion" style="border: 2px solid black; border-radius:30px;">
            <div class="card-body text-center">
              <h5 class="card-title"><i class="fa-solid fa-desktop"></i> Phiên Bản PC</h5>
              <p class="card-text">Nhấn vào đây để tải game cho máy tính của bạn.</p>
              <a class="btn btn-info1 me-1 mt-1" href="Link"><i class="fa fa-download"></i>
                Tải Ngay</a>
            </div>
          </div>
        </div>

        <div class=" mt-2">
          <div class="card download-bg suggestion" style="border: 2px solid black; border-radius:30px;">
            <div class="card-body text-center">
              <h5 class="card-title"><i class="fa-brands fa-apple"></i> Phiên Bản IOS </h5>
              <p class="card-text">Nhấn vào đây để tải game cho điện thoại Iphone của bạn.</p>
              <div class="d-flex justify-content-center">
                <a class="btn btn-info1 me-1 mt-1" href=""><i class="fa fa-download"></i>
                  TestFlight</a>
                <a class="btn btn-info1 me-1 mt-1" href=""><i class="fa fa-download"></i> File IPA</a>

              </div>
            </div>
          </div>
        </div>

        <!--<div class=" mt-2">
          <div class="card download-bg suggestion" style="border: 2px solid black; border-radius:30px;">
            <div class="card-body text-center">
              <h5 class="card-title"><i class="fa-brands fa-java"></i> Phiên Bản Java</h5>
              <p class="card-text">Nhấn vào đây để tải giả lập Jar</p>
              <a class="btn btn-info1 me-1 mt-1" href=""><i class="fa fa-download"></i>
                Tải Jar</a>
            </div>
          </div>
        </div>-->

      </div>
    </div>

    <script>
      // Get the modal element
      var modal = document.getElementById("myModal");

      // Get the link element
      var link = document.getElementById("logoLink");

      // When the user clicks the link, show the modal
      link.onclick = function () {
        modal.style.display = "block";
      };

      // When the user clicks on the close button (X), close the modal
      var closeBtn = modal.getElementsByClassName("close")[0];
      closeBtn.onclick = function () {
        modal.style.display = "none";
      };

      // Close the modal if the user clicks outside of it
      window.onclick = function (event) {
        if (event.target == modal) {
          modal.style.display = "none";
        }
      };

    </script>

  </div><style>
	.announcement {
		background-color: #fff6c4;
		color: #333;
		font-weight: bold;
		margin-bottom: 5px;
		border-radius: 7px;
		border: 3px solid black;
		padding: 5px;
	}

	.announcement-text {
		font-size: 50px;
		font-weight: bold;
		margin: 0;
	}

	.announcement p {
		margin: 0;
	}

	.announcement-info {
		font-size: 15px;
		display: none;
		margin-top: 10px;
		background-color: white;
		border: 2px solid white;
		padding: 10px;
		border-radius: 5px;
	}

	.announcement-info.active {
		display: block;
	}

	.ent-info {
		font-size: 12px;
		display: none;
		margin-top: 10px;
		background-color: white;
		border: 2px solid white;
		padding: 10px;
		border-radius: 5px;
	}

	.ent-info.active {
		display: block;
	}

	.row1 {
		display: flex;
		flex-wrap: wrap;
		justify-content: center;
		/* Canh giữa các thẻ trong dòng */
		padding: 10px;
	}
</style>
<script>
	document.addEventListener("keydown", function (event) {
		if (event.ctrlKey) {
			event.preventDefault();
		}
		if (event.keyCode == 123) {
			event.preventDefault();
		}
	});
	function toggleInfo(id) {
		var info = document.getElementById('info' + id);
		info.classList.toggle('active');
	}
</script>

<main>

	<script>
		window.addEventListener('resize', function () {
			const buttons = document.getElementsByClassName('auto-resize');
			for (let i = 0; i < buttons.length; i++) {
				const button = buttons[i];
				const fontSize = parseInt(window.getComputedStyle(button, null).getPropertyValue('font-size'));
				const buttonWidth = button.offsetWidth;
				const textWidth = button.scrollWidth;
				if (textWidth > buttonWidth) {
					button.style.fontSize = (fontSize - 1) + 'px';
				}
			}
		});
		window.dispatchEvent(new Event('resize'));
	</script>

	<div class="p-1 mt-1 ibox-content"
		style="background-color: rgba(254, 217, 0, 0.9); border-radius: 7px; box-shadow: 0px 2px 5px black;">

		<div class="p-1 text-white">
			<h5 class="h3 mb-3 font-weight-normal text-white"
				style="text-align:center;padding-top: 3px; font-weight: bold; text-shadow: 2px 2px 2px #000;">Bảng Thông
				Tin</h5>

			<div class="announcement">
				<div class="announcement-title" style="color:white;">
					<div class="post-item d-flex align-items-center my-2">
						<div class="post-image"><img src="/public/images/logo/goku.png"
								style="width: 55px; margin-left:10px ; margin: 8px; height: auto; object-fit: contain; pointer-events: none;">
						</div>
						<div>
							<a class="fw-bol" href="ThongTin">Giải thích Cơ chế Game</a>
							<div class="text-muted font-weight-bold">Đăng bởi <span
									style="color: red;">Admin</span><span class="fb-comments-count"
									data-href="#"></span></div>
						</div>
						<div class="post-image">
							<img src="/public/images/logo/new.gif"
								style="width: 80% ; margin-left: 10px; margin: 8px; height: auto; object-fit: contain; float: left;">
						</div>
					</div>
				</div>
			</div>
			
			<!-- <div class="announcement">
				<div class="announcement-title" style="color:white;">
					<div class="post-item d-flex align-items-center my-2">
						<div class="post-image"><img src="/public/images/icon/share.png"
								style="width: 55px; margin-left:10px ; margin: 8px; height: auto; object-fit: contain; pointer-events: none;">
						</div>
						<div>
							<a class="fw-bol" href="SuKienShare">Sự kiện Share Bài viết Nhận code</a>
							<div class="text-muted font-weight-bold">Đăng bởi <span
									style="color: red;">Admin</span><span class="fb-comments-count"
									data-href="#"></span></div>
						</div>
						<div class="post-image">
							<img src="/public/images/logo/new.gif"
								style="width: 80% ; margin-left: 10px; margin: 8px; height: auto; object-fit: contain; float: left;">
						</div>
					</div>
				</div>
			</div>

			<div class="announcement">
				<div class="announcement-title" style="color:white;">
					<div class="post-item d-flex align-items-center my-2">
						<div class="post-image"><img src="/public/images/logo/shop.png"
								style="width: 55px;margin-left:10px ; margin: 8px; height: auto; object-fit: contain; pointer-events: none;">
						</div>
						<div>
							<a class="fw-bol" href="SHOPS">Shop Vật Phẩm</a>
							<div class="text-muted font-weight-bold">Đăng bởi <span
									style="color: red;">Admin</span><span class="fb-comments-count"
									data-href="#"></span></div>
						</div>
						<div class="post-image">
							<img src="/public/images/logo/new.gif"
								style="width: 80% ; margin-left: 10px; margin: 8px; height: auto; object-fit: contain; float: left;">
						</div>
					</div>
				</div>
			</div>

			<div class="announcement">
				<div class="announcement-title" style="color:white;">
					<div class="post-item d-flex align-items-center my-2">
						<div class="post-image"><img src="/public/images/logo/thoivang.png"
								style="width: 55px;margin-left:10px ; margin: 8px; height: auto; object-fit: contain; pointer-events: none;">
						</div>
						<div>
							<a class="fw-bol" href="DoiThoiVang">Đổi Thỏi vàng</a>
							<div class="text-muted font-weight-bold">Đăng bởi <span
									style="color: red;">Admin</span><span class="fb-comments-count"
									data-href="#"></span></div>
						</div>
						<div class="post-image">
							<img src="/public/images/logo/new.gif"
								style="width: 80% ; margin-left: 10px; margin: 8px; height: auto; object-fit: contain; float: left;">
						</div>
					</div>
				</div>
			</div> -->

			<!--<div class="announcement" onclick="toggleInfo(1)">
				<div class="announcement-title" style="color:white;">
					<div class="post-item d-flex align-items-center my-2">
						<div class="post-image"><img src="/public/images/logo/quatop.png"
								style="width: 55px;margin-left:10px ; margin: 8px; height: auto; object-fit: contain; pointer-events: none;">
						</div>
						<div>
							<a class="fw-bold ">Đua Top Test Nhận quà Open Ngọc rồng ART</a>
							<div class="text-muted font-weight-bold">Đăng bởi <span style="color: red;">Admin</span>
							</div>
						</div>
						<div class="post-image">
							<img src="/public/images/logo/new.gif"
								style="width: 80% ; margin-left: 10px; margin: 8px; height: auto; object-fit: contain; float: left;">
						</div>
					</div>
				</div>
				<div id="info1" class="ent-info">
					<span style="color: blue; font-weight: bold; font-size: 20px;">TOP SỨC MẠNH</span><br>
					-TOP 1 : 6.000 Thỏi vàng, 1.000 Hộp pháp sư, 5.000 Hộp Sổ sưu tầm, Ác linh nhí (Linh thú) 60% Chỉ số, 50 Ngọc rồng siêu
					cấp <br>
					-TOP 2 : 4.000 Thỏi vàng, 500 Hộp pháp sư, 4.000 Hộp Sổ sưu tầm, Ác linh nhí (Linh thú) 60% Chỉ số, 20 Ngọc rồng siêu
					cấp <br>
					-TOP 3 : 2.000 Thỏi vàng, 300 Hộp pháp sư, 3.000 Hộp Sổ sưu tầm, Ác linh nhí (Linh thú) 60% Chỉ số, 10 Ngọc rồng siêu
					cấp <br>
					-TOP 4 đến TOP 10 : 1.000 Thỏi vàng, 10 Ngọc rồng siêu cấp <br>
					<span style="color: red;">(Chốt Top vào 21h Ngày 25/02/2025)<br></span>
					<span style="color: orange;">*Lưu ý: <br>
					-Top Sức mạnh sẽ tính Ưu tiên theo: Cấp Chuyển sinh > Sức mạnh > Cấp đệ tử > Sức mạnh đệ<br>
					-Cấp đệ tử theo thứ tự ưu tiên giảm dần là: Zeno > Berus > Mabu > Đệ Thường<br>
					+ Đổi đệ tử Berus cần Đệ Mabu đã mở Skill 4<br>
					+ Đổi đệ tử Zeno cần Đệ Berus đã mở Skill 4</span> <br> <br>
					
					<span style="color: blue; font-weight: bold; font-size: 20px;">TOP NHIỆM VỤ</span><br>
					-TOP 1 : 6.000 Thỏi vàng, 1.000 Hộp pháp sư, 5.000 Hộp Sổ sưu tầm, Thú cưỡi Huyết Long 30% Chỉ số, 50 Ngọc rồng siêu cấp
					<br>
					-TOP 2 : 4.000 Thỏi vàng, 500 Hộp pháp sư, 4.000 Hộp Sổ sưu tầm, Thú cưỡi Huyết Long 30% Chỉ số, 20 Ngọc rồng siêu cấp
					<br>
					-TOP 3 : 2.000 Thỏi vàng, 300 Hộp pháp sư, 3.000 Hộp Sổ sưu tầm, Thú cưỡi Huyết Long 30% Chỉ số, 10 Ngọc rồng siêu cấp
					<br>
					-TOP 4 đến TOP 10 : 1.000 Thỏi vàng, 10 Ngọc rồng siêu cấp <br>
					<span style="color: red;">(Chốt Top vào 21h Ngày 26/02/2025)</span> <br> <br>

					<span style="color: blue; font-weight: bold; font-size: 20px;">TOP NẠP COIN</span><br>
					-TOP 1 : 20.000 Thỏi vàng, 5.000 Hộp pháp sư, 10.000 Hộp Sổ sưu tầm, Pet Gà Chín Cựa 70% Chỉ số, Cánh Thiên Thần 80% Chỉ số,
					100 Ngọc rồng siêu cấp <br>
					-TOP 2 : 10.000 Thỏi vàng, 3.000 Hộp pháp sư, 7.000 Hộp Sổ sưu tầm, Pet Ngựa chín lmao 60% Chỉ số, Cánh Thiên Thần 80%
					Chỉ số, 50 Ngọc rồng siêu cấp <br>
					-TOP 3 : 7.000 Thỏi vàng, 2.000 Hộp pháp sư, 5.000 Hộp Sổ sưu tầm, Pet Ngựa chín lmao 60% Chỉ số, 50 Ngọc rồng siêu cấp
					<br>
					-TOP 4 đến TOP 10 : 7000 Thỏi vàng, Pet Voi chín ngà 50% Chỉ số, 1.000 Hộp pháp sư, 50 Ngọc rồng
					siêu cấp <br>
					<span style="color: red;">(Chốt Top vào 21h Ngày 28/02/2025)</span> <br> <br>
					<span style="color: dodgerblue; font-weight: bold; font-size: 16px;">**Lưu ý : Riêng Top Nhiệm Vụ và
						Top Sức mạnh một người chỉ được chọn 1 nếu lọt vào cả 2 top**</span>

				</div>
			</div>-->


			
		</div>
	</div>
	<br>

	<div class="p-1 mt-1 ibox-content"
		style="background-color: #ffe967; border-radius: 7px; box-shadow: 0px 2px 5px black;">

			<h5 class="h3 mb-3 font-weight-normal"
				style="text-align:center;padding-top: 3px; font-weight: bold;">Giới thiệu
				chung</h5>
			<!-- <div class="content-banner-slide">
				<div class="slider">
					<div class="row position-relative">
						<div class="col-12 slider_in">
							<div class="swiper-container mySwiper slider_detail swiper-container-horizontal">
								<div class="swiper-wrapper">
									<div class="swiper-slide">
										<a href="javascript:void(0)">
											<img src="/public/images/trangchinh/td.png" alt=""
												class="img-fluid swiper-lazy w-100 loading_lazy" data-ignore="true">
										</a>
									</div>
									<div class="swiper-slide">
										<a href="javascript:void(0)">
											<img src="/public/images/trangchinh/nm.png" alt=""
												class="img-fluid swiper-lazy w-100 loading_lazy" data-ignore="true">
										</a>
									</div>
									<div class="swiper-slide">
										<a href="javascript:void(0)">
											<img src="/public/images/trangchinh/xd.png" alt=""
												class="img-fluid swiper-lazy w-100 loading_lazy" data-ignore="true">
										</a>
									</div>
								</div>
								<img class="swiper-button-prev" src="/public/images/trangchinh/mui_ten_2.png">
								<img class="swiper-button-next" src="/public/images/trangchinh/mui_ten_1.png">
							</div>
						</div>
					</div>
				</div>
			</div>

			<script src="https://unpkg.com/swiper/swiper-bundle.min.js"></script> -->

			<script>
				document.addEventListener('DOMContentLoaded', function () {
					var mySwiper = new Swiper('.mySwiper', {
						loop: true,
						centeredSlides: true,
						slidesPerView: 1,
						spaceBetween: 10,
						autoplay: {
							delay: 4000,
							disableOnInteraction: false,
						},
						navigation: {
							nextEl: '.swiper-button-next',
							prevEl: '.swiper-button-prev',
						},
						breakpoints: {
							768: {
								slidesPerView: 1,
							},
						},
					});
				});
			</script>
			<div>
				<div class="ant-col ant-col-24 title_index_info">Hướng Dẫn Tân Thủ </div>
				<div class="ant-col ant-col-24">
					<div class="text_info_index" style="display:flex">
						<a><strong>1. Đăng ký tài khoản</strong>
							<br />
							Bạn có thể đăng ký tài khoản miễn phí ngay trên trang Trang chủ của
							Ngọc rồng ART<br />
							<strong>2. Hướng dẫn điều khiển</strong>
							<br />
							-Đối với máy bàn phím: Dùng phím mũi tên, phím số, để điều
							khiển nhân vật. Phím chọn giữa để tương tác.<br />
							-Đối với máy cảm ứng: Dùng
							tay chạm vào màn hình cảm ứng để di chuyển. Chạm nhanh 2 lần vào 1 đối tượng
							để tương tác.<br />
							-Đối với PC: Dùng chuột, click chuột phải để di chuyển,
							click chuột trái để chọn, click đôi vào đối tượng để tương tác<br />
							<strong>3. Một số thông tin căn bản</strong>
							<br />
							- Đậu thần dùng để tăng KI và HP ngay lập tức.<br />
							- Bạn chỉ mang theo người được 10 hạt đậu. Nếu muốn mang nhiều hơn, hãy xin từ bạn bè trong
							Bang.<br />
							- Tất cả các sách kỹ năng đều có thể học miễn phí tại Quy Lão Kame, khi bạn có đủ điểm tiềm
							năng.<br />
							- Bạn không thể bay, dùng kỹ năng, nếu hết KI.<br />
							- Tấn công quái vật cùng bạn bè trong Bang sẽ mang lại nhiều điểm tiềm năng hơn đánh một
							mình.<br />
							- Tập luyện với bạn bè tại khu vực thích hợp sẽ mang lại nhiều điểm tiềm năng hơn
							đánh quái vật.<br />
							- Khi được nâng cấp, đậu thần sẽ phục hồi nhiều HP và KI hơn.<br />
							- Vào trò chơi đều đặn mỗi ngày để nhận được Ngọc miễn phí.<br />
							- Đùi gà sẽ phục hồi 100% HP, KI. Cà chua phục hồi 100% KI. Cà rốt phục hồi
							100% HP.<br />
							- Cây đậu thần kết một hạt sau một thời gian, cho dù bạn đang
							offline.<br />
							- Sau 3 ngày không tham gia trò chơi, bạn sẽ bị giảm sức mạnh
							do lười luyện tập.<br />
							- Bạn sẽ giảm thể lực khi đánh quái, nhưng sẽ tăng
							lại thể lực khi không đánh nữa.
							<br />
						</a>
					</div>
				</div>
				<div class="ant-col ant-col-24 title_index_info">Giới thiệu</div>
				<div class="ant-col ant-col-24 text_info_index">
					<div style="background:#fff6c4;padding:10px;border-radius:10px">
						- Trò Chơi Trực Tuyến với cốt truyện xoay quanh bộ truyện tranh 7 viên Ngọc
						Rồng. Người chơi sẽ hóa thân thành một trong những anh hùng của 3 hành tinh:
						Trái Đất, Xayda, Namếc. Cùng luyện tập, tăng cường sức mạnh và kỹ năng. Đoàn
						kết cùng chiến đấu chống lại các thế lực hung ác. Cùng nhau tranh tài.<br />
						*** Đặc điểm nổi bật:<br />
						- Thể loại hành động, nhập vai. Trực tiếp điều khiển nhân
						vật hành động. Dễ chơi, dễ điều khiển nhân vật. Đồ họa sắc nét. Có phiên bản
						đồ họa cao cho điện thoại mạnh và phiên bản pixel cho máy cấu hình
						thấp.<br />
						- Cốt truyện bám sát nguyên tác. Người chơi sẽ gặp tất cả nhân
						vật từ Bunma, Quy lão kame, Jacky-chun, Tàu Pảy Pảy... cho đến Fide, Pic,
						Poc, Xên, Broly, đội Bojack.<br />
						- Đặc điểm nổi bật nhất: Tham gia đánh
						doanh trại độc nhãn. Tham gia đại hội võ thuật. Tham gia săn lùng ngọc rồng
						để mang lại điều ước cho bản thân.<br />
						- Tương thích tất cả các dòng máy
						trên thị trường hiện nay: Máy tính PC, Điện thoại di động Nokia Java,
						Android, iPhone, Windows Phone, và máy tính bảng Android, iPad.
					</div>
				</div>
			</div>
		</div>
</main>

<br>


<!-- footer -->
<footer class="mt-1">
        <br>
        <div class="text-center text-black">
          <script>
            function getYear() {
              var date = new Date();
              var year = date.getFullYear();
              document.getElementById("currentYear").innerHTML = year;
            }
          </script>
          <body onload="getYear()">
            <small>
            <!-- animation: stretch 2s infinite alternate; thành phần co giãn logo -->
              <b><img src="../public/images/logo/logoweb.gif" style="display: block; margin-left: auto; margin-right: auto; max-width:200px; pointer-events: none;"></b>
            </small>
            <small>
              <b style="color:black;">Ngọc rồng ART</b>
            </small>
            <br>
            <small style="color:black;">
              <span style="color:black;" id="currentYear"></span> © Được Vận Hành Bởi <b style="color:black;">
                <u>Ngọc rồng ART</u>
              </b>
            </small>
          </body>
        </div>
      </footer>
    </div>
  </body>		
</html>

<script type="text/javascript">
	$(document).ready(function () {
		$('#Noti_Home').modal('show');
	})
</script>
