body{
  background-color: rgba(0,0,0);
}
.teste{
  background-color: #000000;
  padding: 25px;
}
.navbar-light .navbar-nav .nav-link {
  color: rgba(255,255,255);
}
.navbar-light .navbar-nav .nav-link:hover {
  color: rgba(255,211,113);
}
a.btn.btn-light.ml-4:hover{
  background-color: rgba(234,173,68);
}
.background-container {
  position: relative;
  overflow: hidden;
  width: 100%;
}
.border-row {
  border: 1px solid red;
}
.image-slide {
  transition: opacity 0.5s ease, transform 0.5s ease;
}
.image-slide.active {
  opacity: 1;
  transform: translateX(0);
}
.slide {
  max-width: 100%;
  width: 100%;
  position: absolute;
  transition: opacity 0.5s ease, transform 0.5s ease;
}
.slide.active {
  opacity: 1;
  transform: translateX(0);
}
.slide:not(.active) {
  opacity: 0;
  transform: translateX(-100%);
}
.blocoA {
  width: 580px;
  height: 310px;
  margin-left: -30px;
  margin-top: 0px;
  border-radius: 30px;
}
.blocoB {
  background: url(../../images/novo/BlocoB.png);
  background-size: cover; 
  width: 580px;
  height: 310px;
  margin-left: -5px;
  margin-top: 0px;
  border-radius: 10px;
  border-right: 3px solid yellow;
}
.blocoC {
  background-size: cover; 
  width: 580px;
  height: 310px;
  margin-left: -5px;
  margin-top: 0px;
  border-radius: 10px;
  border-left: 2px solid yellow;
}
.blocoYoutube {
  background: url(../../images/novo/youtube.jpg);
  background-size: cover; 
  margin-left: -55px;
  width: 290px;
  height: 150px;
  border-radius: 20px;
  border-bottom: 2px solid yellow;
  transition: transform 0.3s;
}
.blocoYoutube:hover {
 transform: scale(0.9);
}
.blocoDiscord {
  background: url(../../images/novo/discord.jpg);
  background-size: cover; 
  margin-left: -14px;
  width: 290px;
  height: 150px;
  border-bottom: 2px solid yellow;
  border-radius: 20px;
  transition: transform 0.3s;
}
.blocoDiscord:hover {
 transform: scale(0.9);
}
.blocoDownload {
  background: url(../../images/novo/download.jpg);
  background-position: absolute;
  background-size: cover; 
  margin-left: 12px;
  width: 290px;
  height: 150px;
  border-bottom: 2px solid yellow;
  border-radius: 20px;
  transition: transform 0.3s;
}
.blocoDownload:hover {
  transform: scale(0.9);
}
.blocoDonate {
  background: url(../../images/novo/donate.jpg);
  background-position: absolute;
  background-size: cover; 
  margin-left: -35px;
  width: 290px;
  height: 150px;
  border-bottom: 2px solid yellow;
  border-radius: 20px;
  transition: transform 0.3s;
}
.blocoDonate:hover {
  transform: scale(0.9);
}
.blocoNews {
/*background: url(../../images/novo/paredeNews.png);*/
  background-color: rgba(0,0,0);
  padding-top: 25px;
  background-size: cover; 
  /*margin-left: -30px;*/
  /*width: 780px;*/
  width: 100%;
  height: 705px;
  border-radius: 25px;
}

#bloco-rank1{
	float: left;
	margin-left: -5px;
}

.blocoRank1 {
  background: url(../../images/novo/rank2.png);
  background-size: cover; 
  margin-top: -30px;
  margin-left: -71px;
  width: 430px;
  height: 615px;
  border-radius: 0px;
}

#bloco-rank2{
	float: left;
	margin-left: -10px;
}

.blocoRank2 {
  background: url(../../images/novo/rank2.png);
  background-size: cover; 
  margin-top: -30px;
  margin-left: -32px;
  width: 430px;
  height: 615px;
  border-radius: 0px;
}

#bloco-rank3{
	float: left;
	margin-left: -10px;
}

.blocoRank3 {
  background: url(../../images/novo/rank2.png);
  background-size: cover; 
  margin-top: -30px;
  margin-left: 7px;
  width: 430px;
  height: 615px;
  border-radius: 0px;
}

.blocoGuerras {
 /* background: #4a4f5a;
  background-size: cover; 
  margin-left: -30px;
  margin-top: 15px;
  width: 780px;
  height: 315px;
  border-radius: 25px;*/

  background: url(../../images/novo/blocoA.jpg);
  background-size: cover; 
  margin-left: -8px;
  margin-top: 0px;
  width: 109%;
  height: 310px;
  border-radius: 10px;
  border-right: 3px solid yellow;

}
.blocoFAQ {
  background: url(../../images/novo/Personagem7.png);
  background-size: cover; 
  margin-left: 0px;
  margin-top: 15px;
  width: 1087px;
  height: 682px;
  border-radius: 25px;
}
.next-left{ 
  position: absolute;
  bottom: 5%;
  left: 70%;
  transition: transform 0.3s;
}
.next-right{ 
  position: absolute;
  bottom: 5%;
  left: 85%;
  transform: scaleX(-1);
  transition: transform 0.3s;
}
.number-page-cardA{
  position: absolute;
  bottom: 6.5%;
  left: 80.3%;
  color: white;
}
.title-cardA{
  font-size: 40px;
  position: absolute;
  bottom: 15%;
  right: 66.0%;
  color: white;
  transition: transform 0.3s;
  cursor: pointer;
}
.title-cardA:hover{
 transform: scale(1.25);
}
.subtitle-cardA{
  font-size: 15px;
  position: absolute;
  bottom: 3%;
  right: 57.0%;
  color: white;
}
.title-cardB{
  font-size: 35px;
  position: absolute;
  bottom: 75%;
  right: 75%;
  color: white;
}
.title-cardB::before {
  content: "";
  display: block;
  width: 180%;
  height: 3px;
  background-color: white;
  position: absolute;
  bottom: -2px;
  left: 0;
  border-radius: 20px;
}
.gema-news {
  position: absolute;
  bottom: 55%;
  right: 83%;
  transform: scaleX(-1);
  cursor: pointer;
}
.update-news{
 position: absolute;
 bottom: 58%;
 right: 72%;
 color: #f8ce11;
 font-size: 17px;
 transition: transform 0.3s, opacity 0.3s;
 cursor: pointer;
}
.date-update-news{
  position: absolute;
  bottom: 52%;
  right: 67%;
  color: white;
  font-size: 16px;
  cursor: pointer;
}
.date-update-news::before {
  content: "";
  display: block;
  width: 180%;
  height: 2px;
  background-color: white;
  position: absolute;
  bottom: -2px;
  left: 0;
  border-radius: 20px;
}
.gema-news-2 {
  position: absolute;
  bottom: 55%;
  right: 83%;
  transform: scaleX(-1);
  cursor: pointer;
}
.update-news-2{
  margin-top: 10px;
  position: absolute;
  top: -55px;
  right: 72%;
  color: #f8ce11;
  font-size: 17px;
  transition: transform 0.3s, opacity 0.3s;
  cursor: pointer;
}
.date-update-news-2{
  position: absolute;
  top: -25px;
  right: 67%;
  color: white;
  font-size: 16px;
  cursor: pointer;
}
.date-update-news-2::before {
  content: "";
  display: block;
  width: 180%;
  height: 2px;
  background-color: white;
  position: absolute;
  bottom: -2px;
  left: 0;
  border-radius: 20px;
}
.gema-news-3 {
  position: absolute;
  bottom: 55%;
  right: 83%;
  transform: scaleX(-1);
  cursor: pointer;
}
.update-news-3{
  margin-top: 10px;
  position: absolute;
  top: -55px;
  right: 72%;
  color: #f8ce11;
  font-size: 17px;
  transition: transform 0.3s, opacity 0.3s;
  cursor: pointer;
}
.date-update-news-3{
  position: absolute;
  top: -25px;
  right: 67%;
  color: white;
  font-size: 16px;
  cursor: pointer;
}
.date-update-news-3::before {
  content: "";
  display: block;
  width: 180%;
  height: 2px;
  background-color: white;
  position: absolute;
  bottom: -2px;
  left: 0;
  border-radius: 20px;
  cursor: pointer;
}
#home{
  background: url(../../images/novo/bg.jpg);
/*background-color: black;*/
  background-size: cover;
  background-repeat: no-repeat;
  height: 600px;
}
#second-update{
  position: relative;
  bottom: -210px;
}
#third-update{
  position: relative;
  bottom: -280px;
}
.read-more-news-1{
  position: absolute;
  right: 5%;
  bottom: 53%;
  width: 150px;
  height: 45px;
  border-radius: 70px;
  border: 2px solid #fdb00a;
  z-index: 10;
  transition: transform 0.5s,background-color 0.5s;
}
.read-more-news-1:hover {
  transform: scale(1.1);
}
.read-more-news-2{
  position: absolute;
  right: 5%;
  bottom: 29%;
  width: 150px;
  height: 45px;
  border-radius: 70px;
  border: 2px solid #fdb00a;
  z-index: 10;
  transition: transform 0.5s,background-color 0.5s;
}
.read-more-news-2:hover {
  transform: scale(1.1);
}
.read-more-news-3{
  position: absolute;
  right: 5%;
  bottom: 5%;
  width: 150px;
  height: 45px;
  border-radius: 70px;
  border: 2px solid #fdb00a;
  z-index: 10;
  transition: transform 0.5s,background-color 0.5s;
}
.read-more-news-3:hover {
  transform: scale(1.1);
}
.btn-read-more{
  position: absolute;
  right: 3%;
  top: 7%;
  transition: transform 0.5s;
}
.btn-read-more:hover {
  transform: rotate(360deg); 
}
.txt-read-more{
  position: absolute;
  font-size: 10px;
  color: #fdb00a;
  letter-spacing: 2px;
  left: 12%;
  top: 32%;
}
.update-news:hover{
 transform: translateX(15px); 
 opacity: 0.7;
}
.update-news-2:hover{
 transform: translateX(15px); 
 opacity: 0.7; 
}
.update-news-3:hover{
 transform: translateX(15px); 
 opacity: 0.7;
}
footer {
  background-color: #000000;
  color: #fff;
  text-align: center;
  padding: 10px;
  position: fixed; 
  bottom: 0; 
  width: 100%; 
  height: 90px;
  z-index: 100;
}
a.nav-link{
  transition: transform 0.3s, box-shadow 0.5s;
  position: relative;
  z-index: 1;
  overflow: hidden;
}
a.nav-link:hover{
  transform: scale(1.3);
  box-shadow: 0 0 0 gold;
}
a.btn.btn-light.ml-4 {
  border-radius: 35px;
  transition: transform 0.3s, box-shadow 0.5s;
  position: relative;
  z-index: 1;
  overflow: hidden;
}
a.btn.btn-light.ml-4:hover {
  transform: scale(1.2);
  box-shadow: 0 0 20px gold;
}
a.btn.btn-light.ml-4{
  padding-left: 20px;
  padding-right: 20px; 
  transition: transform 0.3s, box-shadow 0.5s, padding 0.5s;
}
.donate{
  border-radius: 35px;
  transition: transform 0.3s, box-shadow 0.5s;
  position: relative;
  z-index: 1;
}
.donate:hover{
  transform: scale(1.2);
  box-shadow: none; 
}
div.blocoB.position-relative{
  transition: border-right 0.3s;
}
div.blocoA.position-relative{
  transition: border-left 0.3s;
}
.title-bloco-news {
  font-size: 35px;
  color: white;
}
#registro-dados-news {
  max-height: calc(100% - 50px); 
  overflow-y: auto;
  padding-top: 15px;
}
#registro-dados-news thead {
  position: sticky;
  top: 0;
  background-color: #343a40;
  color: white;
}
#registro-dados-news table {
  border-collapse: separate; 
  border-spacing: 0 5px;
  width: 100%;
}
.tipo_noticie,
.tipo_maintenance,
.tipo_update,
.tipo_generic {
  font-size: 14px;
  color: white;
  text-align: center;
  white-space: nowrap;
  text-transform: uppercase;
  padding: 5px 15px;
  border-radius: 18px;
}
.tipo_noticie {
  background-color: #28c7db;
}
.tipo_maintenance {
  background-color: #d1ab28;
}
.tipo_update {
  background-color: #43930d;
}
.tipo_generic{
  background-color: #7743df;
}
.table tr {
  background-color: rgba(68, 43, 119, 0.2);
  color: white;
}
i{
 transition: transform 0.8s;
}
i:hover{
  transform: rotate(360deg); 
}
.detalhes {
  padding: 10px;
  border: 1px solid gray;
  animation: fadeInUp 0.3s ease-in-out; 
  width: 100%; 
  box-sizing: border-box; 
}
.d-none {
  display: none;
}
@keyframes fadeInUp {
  from {
    opacity: 0;
    transform: translateY(20px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}
.top{
  padding-right: 46px;
  padding-left: 59px;
}
.players{
  padding-right: 50px;
}
.title-bloco-ranking{
  padding-top: 29px;
  font-size: 20px;
  color: white;
  margin-bottom: 7px;
  border-bottom: 0px solid white;
  padding-bottom: 7px;
}
div.title-bloco-ranking span{
  margin-right: 10px;
  margin-left: 5px;
}
#tabela-ranking-players, #tabela-ranking-guilds, #tabela-ranking-fames{
  text-align: center;
  padding-left:50px; 
  padding-right:45px; 
}
.blocoRank1, .blocoRank2 .blocoRank3 {
  overflow-y: auto;
}

#tabela-ranking-players table, #tabela-ranking-guilds table, #tabela-ranking-fames table{
  border-collapse: separate; 
  border-spacing: 0 2.9px;
}
#timer{
  position: absolute;
  left: 39.8%;
  bottom: 270px;
  font-size: 32px;
  color: white;
  font-weight: bold;
}
.blocoGuerras{
/* background: linear-gradient(135deg, #111827, #0d111b);*/
 
 padding-top: 40px;
 padding-left: 50px;
 padding-right: 50px;
 padding-bottom: 80px;
}
#guild2{
  float: right;
}
#guild1{
  float: left;
}
#titleGuild1{
  position: absolute;
  padding-top: 140px;
  /*right: 530px;*/
  right: 328px;
  color: white;
  font-size: 26px;
  letter-spacing: 2px;
  text-align: center;
  width: 270px;
}

#titleGuild1 p{
  font-size: 24px;
  text-align: center;
}

#subtitleGuild1{
  position: absolute;
  padding-top: 190px;
  right: 560px;
  color: white;
  font-size: 18px;
  letter-spacing: 2px;
}

#titleGuild2{
  position: absolute;
  padding-top: 140px;
  /*left: 71%;*/
  left: 61%;
  color: white;
  font-size: 26px;
  letter-spacing: 2px;
  width: 270px;
  text-align: center;
}

#titleGuild2 p{
  font-size: 24px;
  text-align: center;
}

p.war_time{
	font-size: 16px;
	margin-top: -67px;
}

#subtitleGuild2{
  position: absolute;
  padding-top: 190px;
  left: 72%;
  color: white;
  font-size: 18px;
  letter-spacing: 2px;
}
#sword{
  position: absolute;
  top: -5%;
  left: 42%;
  right: 20%;
  z-index: 11;
  transition: transform 0.6s;
}
#sword:hover{
  transform: scale(1.2);
}
#titleGuild1{
  transition: transform 0.3s, color 0.6s;
  z-index: 15;
}

#titleGuild2{
  transition: transform 0.3s, color 0.6s;
  z-index: 15;
}
#titleGuild1:hover{
 color: yellow;
 cursor: pointer;
}

#titleGuild2:hover{
 color: yellow;
 cursor: pointer;
}
.aura-amarela {
  position: absolute;
  left: 80px;
  top: 0px;
  width: 220px;
  height: 220px; 
  border-radius: 50%;
  background: radial-gradient(circle, rgba(255, 255, 0, 0.6) 0%, rgba(255, 255, 0, 0)70%);
  animation: pulseAura 3s ease-in-out infinite;
}
.aura-azul {
  position: absolute;
  left: 300px;
  top: 0px;
  width: 220px;
  height: 220px; 
  border-radius: 50%;
  background: radial-gradient(circle, rgba(0, 8, 240, 0.6) 0%, rgba(0, 8, 240, 0)70%);
  animation: pulseAura 3s ease-in-out infinite;
}

.table-container {
  overflow-x: auto; /* Adiciona rolagem horizontal em telas menores */
}

.table-original-width {
  width: 100%; /* Defina o valor desejado para o width */
}

@keyframes pulseAura {
  0% {
    transform: scale(2);
    opacity: 0.8;
  }
  50% {
    transform: scale(1.1);
    opacity: 0.5;
  }
  100% {
    transform: scale(0.2);
    opacity: 0.8;
  }
}
.FAQ{
  transition: transform 0.4s;
}
.FAQ:hover{
  transform: scale(1.04);
  cursor: pointer;
}
.centered {
  position: absolute;
  top: 100%;
  left: 100%;
  transform: translate(-50%, -50%);
  text-align: center;
}

.table-responsive {
    display: block;
  width: 100%;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  -ms-overflow-style: -ms-autohiding-scrollbar;
}

@media (min-width: 320px) and (max-width: 480px) {
  #home{
	/*background: url(../../images/novo/wallpaperazul.png);*/
    background-color: black;
	  background-size: cover;
	  background-repeat: no-repeat;
	  height: 491px;
	  width: 100%;
	}

	#rodape{
	  width: 100%;
	}

	#timer{
	  position: absolute;
	  left: 37.5%;
	  bottom: 270px;
	  font-size: 30px;
	  color: white;
	  font-weight: bold;
	}

	.title-cardA{
	  font-size: 45px;
	  position: absolute;
	  bottom: 35%;
	  right: 36%;
	  color: white;
	  transition: transform 0.3s;
	  cursor: pointer;
	}

	.subtitle-cardA{
	  font-size: 14px;
	  position: absolute;
	  bottom: 22%;
	  right: 32.0%;
	  color: white;
	}

	.next-left{ 
	  position: absolute;
	  width: 52px;
	  bottom: 8%;
	  left:68%;
	  transition: transform 0.3s;
	}

	.next-right{ 
		position: absolute;
		width: 52px;
		bottom: 8%;
		left: 85%;
		transform: scaleX(-1);
		transition: transform 0.3s;
	}

	.number-page-cardA{
	  position: absolute;
	  bottom: 8.5%;
	  left: 80.5%;
	  color: white;
	}

	.blocoC {
	  width: 100%;
	  height: 310px;
	  margin-left: 20px;
	  margin-top: -5px;
	  border-radius: 10px;
	  border-right: 2px solid yellow;
	}

	.blocoA {
	  width: 580px;
	  height: 310px;
	  margin-left: -40px;
	  margin-top: -5px;
	  margin-bottom: 20px;
	  border-radius: 30px;
	}

	.blocoB {
	  background: url(../../images/novo/BlocoB.png);
	  background-size: cover; 
	  width: 100%;
	  height: 310px;
	  margin-left: 10px;
	  margin-top: -5px;
	  border-radius: 10px;
	  border-right: 3px solid yellow;
	}

	.title-cardB{
	  font-size: 30px;
	  position: absolute;
	  bottom: 75%;
	  right: 70%;
	  color: white;
	}

	.gema-news{
	  width: 35px;
	  position: absolute;
	  bottom: 55%;
	  right: 82.5%;
	  transform: scaleX(-1);
	  cursor: pointer;
	}
	.gema-news-2{
	  width: 35px;
	  position: absolute;
	  bottom: 55%;
	  right: 88.5%;
	  transform: scaleX(-1);
	  cursor: pointer;
	}
	.gema-news-3{
	  width: 35px;
	   position: absolute;
	  bottom: 55%;
	  right: 88.5%;
	  transform: scaleX(-1);
	  cursor: pointer;
	}

	.update-news{
		 position: absolute;
		 bottom: 57%;
		 right: 65%;
		 color: #f8ce11;
		 font-size: 17px;
		 transition: transform 0.3s, opacity 0.3s;
		 cursor: pointer;
	}

	.update-news-2{
		 position: absolute;
		 bottom: 57%;
		 right: 69%;
		 color: #f8ce11;
		 font-size: 17px;
		 transition: transform 0.3s, opacity 0.3s;
		 cursor: pointer;
	}

	.update-news-3{
		 position: absolute;
		 bottom: 57%;
		 right: 69%;
		 color: #f8ce11;
		 font-size: 17px;
		 transition: transform 0.3s, opacity 0.3s;
		 cursor: pointer;
	}

	.date-update-news{
	  position: absolute;
	  bottom: 51%;
	  right: 58%;
	  color: white;
	  font-size: 16px;
	  cursor: pointer;
	}

	.date-update-news-2{
	  position: absolute;
	  bottom: 51%;
	  right: 62%;
	  color: white;
	  font-size: 16px;
	  cursor: pointer;
	}

	.date-update-news-3{
	  position: absolute;
	  bottom: 53%;
	  right: 62%;
	  color: white;
	  font-size: 16px;
	  cursor: pointer;
	}

	.date-update-news::before {
	  content: "";
	  display: block;
	  width: 100%;
	  height: 2px;
	  background-color: white;
	  position: absolute;
	  bottom: -8px;
	  left: 0;
	  border-radius: 20px;
	  cursor: pointer;
	 }


	.date-update-news-2::before {
	  content: "";
	  display: block;
	  width: 100%;
	  height: 2px;
	  background-color: white;
	  position: absolute;
	  bottom: -8px;
	  left: 0;
	  border-radius: 20px;
	  cursor: pointer;
	 }

	.date-update-news-3::before {
	  content: "";
	  display: block;
	  width: 100%;
	  height: 2px;
	  background-color: white;
	  position: absolute;
	  bottom: -8px;
	  left: 0;
	  border-radius: 20px;
	  cursor: pointer;
	}

	.read-more-news-1{
	  position: absolute;
	  right: 4%;
	  bottom: 53%;
	  width: 40%;
	  height: 14%;
	  border-radius: 70px;
	  border: 2px solid #fdb00a;
	  z-index: 10;
	  transition: transform 0.5s,background-color 0.5s;
	}

	.read-more-news-2{
	  position: absolute;
	  width: 40%;
	   right: 4%;
	  height: 14%;
	}

	.read-more-news-3{
	  position: absolute;
	  right: 4%;
	  width: 40%;
	  height: 14%;
	}

	.btn-read-1{
	  top: 4%;
	}

	.blocoYoutube, .blocoDiscord, .blocoDownload, .blocoDonate {
	  background-size: cover; 
	  width: 100%;
	  border-bottom: 2px solid yellow;
	  border-radius: 10px;
	  transition: transform 0.3s;
	  margin-bottom: 25px;
	}

	.blocoYoutube{
	  margin-left: 2px;
	}

	.blocoDiscord{
		margin-left: 2px;
	}

	.blocoDownload{
		margin-left: 2px;
	}

	.blocoDonate{
		margin-left: 2px;
	}

	.blocoNews{
	  margin-bottom: 35px;
	  width: 100%;
	  margin-left: 0.9%;
	}

	.table{
	  font-size: 12px;
	}

	.blocoRank1{
	  width: 100%;
	  margin-left: -2%;
	}
	
	#bloco-rank2 {
		margin-left: 5px;
		margin-top: 250px;
	}
	
	.title-bloco-ranking{
	  padding-left: 0px;
	  font-size: 18px;
	}

	.blocoRank2{
	  width: 100%;
	  margin-left: -2%;
	}
	
	#bloco-rank3 {
		margin-left: 5px;
		margin-top: 55px;
	}

	.logoTopo{
	  display: none;
	}
	
	#bloco-guerras {
		margin-top: -180px;
	}

	.blocoGuerras{
	 /* background: linear-gradient(135deg, #111827, #0d111b);*/
         
		 width: 100%;
		 
		 margin-bottom: 126px;
		 margin-left: 0.5%;
		 height: 260px;
	}

	#guild1{
	width: 105px;
	position: absolute;
	left: 50px;
	}

	#guild2{
	width: 105px;
	position: absolute;
	right: 50px;
	}

	#titleGuild1{
	  position: absolute;
	  padding-top: 115px;
	  /*left: 15.8%;*/
	  /*right: 20%;*/
	  right: 50%;
	  color: white;
	  font-size: 20px;
	  letter-spacing: 2px;
	  width: 50%;
	}

	#titleGuild1 p{
	  text-align: center;
	  font-size: 17px;
	}

	#subtitleGuild1{
	  position: absolute;
	  padding-top: 145px;
	  right: 61.5%;
	  color: white;
	  font-size: 14px;
	  letter-spacing: 2px;
	}

	#titleGuild2{
	  position: absolute;
	  padding-top: 115px;
	  /*left: 62.5%;*/
	  left: 51%;
	  color: white;
	  font-size: 20px;
	  letter-spacing: 2px;
	  width: 50%;
	}

	#titleGuild2 p{
	  text-align: center;
	  font-size: 17px;
	}

	#subtitleGuild2{
	  position: absolute;
	  padding-top: 145px;
	  left: 62.5%;
	  color: white;
	  font-size: 14px;
	  letter-spacing: 2px;
	}

	p.war_time{
		font-size: 15px;
		margin-top: -50px;
	}

	.aura-amarela, .aura-azul{
	  display: none;
	}

	.blocoFAQ {
	  width: 100%;
	  height: 80px;
	  background: url(../../images/novo/Personagem7.png);
	  background-size: cover;
	  background-position: center; /* Centraliza a imagem no bloco */
	  margin-left: 2%;
	  margin-top: 135%;
	  border-radius: 25px;
	}

}

@media (min-width: 481px) and (max-width: 768px) {
  #home{
/*background: url(../../images/novo/wallpaperazul.png);*/
  background-color: black;
  background-size: cover;
  background-repeat: no-repeat;
  height: 491px;
  width: 100%;
}

#rodape{
  width: 80%;
}

#timer{
  position: absolute;
  left: 39.8%;
  bottom: 270px;
  font-size: 30px;
  color: white;
  font-weight: bold;
}

.title-cardA{
  font-size: 45px;
  position: absolute;
  bottom: 35%;
  right: 27%;
  color: white;
  transition: transform 0.3s;
  cursor: pointer;
}

.subtitle-cardA{
  font-size: 14px;
  position: absolute;
  bottom: 22%;
  right: 24.0%;
  color: white;
}

.next-left{ 
  position: absolute;
  width: 52px;
  bottom: 8%;
  left:76%;
  transition: transform 0.3s;
}

.next-right{ 
position: absolute;
width: 52px;
bottom: 8%;
left: 94%;
transform: scaleX(-1);
transition: transform 0.3s;
}

.number-page-cardA{
  position: absolute;
  bottom: 8.5%;
  left: 89%;
  color: white;
}

.blocoC {
  position: absolute;
  right: -30px;
  width: 600px;
  height: 310px;
  margin-left: -5px;
  margin-top: -5px;
  border-radius: 10px;
  border-left: 2px solid yellow;
}

.blocoA {
  width: 580px;
  height: 310px;
  margin-left: -40px;
  margin-top: -5px;
  margin-bottom: 20px;
  border-radius: 30px;
}

.blocoB {
  background: url(../../images/novo/BlocoB.png);
  background-size: cover; 
  width: 115%;
  height: 310px;
  margin-left: 10px;
  margin-top: -5px;
  border-radius: 10px;
  border-right: 3px solid yellow;
}

.title-cardB{
  font-size: 30px;
  position: absolute;
  bottom: 75%;
  right: 65%;
  color: white;
}

.gema-news{
  width: 35px;
  position: absolute;
  bottom: 55%;
  right: 79.5%;
  transform: scaleX(-1);
  cursor: pointer;
}
.gema-news-2{
  width: 35px;
  position: absolute;
  bottom: 55%;
  right: 86.6%;
  transform: scaleX(-1);
  cursor: pointer;
}
.gema-news-3{
  width: 35px;
   position: absolute;
  bottom: 55%;
  right: 86.6%;
  transform: scaleX(-1);
  cursor: pointer;
}

.update-news{
 position: absolute;
 bottom: 57%;
 right: 61%;
 color: #f8ce11;
 font-size: 17px;
 transition: transform 0.3s, opacity 0.3s;
 cursor: pointer;
}

.update-news-2{
 position: absolute;
 bottom: 57%;
 right: 69%;
 color: #f8ce11;
 font-size: 17px;
 transition: transform 0.3s, opacity 0.3s;
 cursor: pointer;
}

.update-news-3{
 position: absolute;
 bottom: 57%;
 right: 69%;
 color: #f8ce11;
 font-size: 17px;
 transition: transform 0.3s, opacity 0.3s;
 cursor: pointer;
}

.date-update-news{
  position: absolute;
  bottom: 51%;
  right: 53%;
  color: white;
  font-size: 16px;
  cursor: pointer;
}

.date-update-news-2{
  position: absolute;
  bottom: 51%;
  right: 62%;
  color: white;
  font-size: 16px;
  cursor: pointer;
}

.date-update-news-3{
  position: absolute;
  bottom: 53%;
  right: 62%;
  color: white;
  font-size: 16px;
  cursor: pointer;
}

.date-update-news-2::before {
  content: "";
  display: block;
  width: 180%;
  height: 2px;
  background-color: white;
  position: absolute;
  bottom: -8px;
  left: 0;
  border-radius: 20px;
  cursor: pointer;
  }

.date-update-news-3::before {
  content: "";
  display: block;
  width: 180%;
  height: 2px;
  background-color: white;
  position: absolute;
  bottom: -8px;
  left: 0;
  border-radius: 20px;
  cursor: pointer;
  }

.read-more-news-1{
  position: absolute;
  right: -10%;
  bottom: 53%;
  width: 140px;
  height: 42px;
  border-radius: 70px;
  border: 2px solid #fdb00a;
  z-index: 10;
  transition: transform 0.5s,background-color 0.5s;
}

.read-more-news-2{
  position: absolute;
  right: -10%;
  width: 140px;
  height: 42px;
}

.read-more-news-3{
  position: absolute;
  right: -10%;
  width: 140px;
  height: 42px;
}

.btn-read-1{
  top: 4%;
}

.blocoYoutube, .blocoDiscord, .blocoDownload, .blocoDonate {
  background-size: cover; 
  width: 115%;
  border-bottom: 2px solid yellow;
  border-radius: 10px;
  transition: transform 0.3s;
  margin-bottom: 25px;
}

.blocoYoutube{
  margin-left: 2px;
}

.blocoDiscord{
 margin-left: 4px;
}

.blocoDownload{
margin-left: 3px;
}

.blocoDonate{
margin-left: 3px;
}

.blocoNews{
  margin-bottom: 35px;
  width: 115%;
  margin-left: 0.9%;
}

.table{
  font-size: 18px;
}

.blocoRank1{
  margin-left: -2%;
}

.blocoRank2{
  margin-left: -2%;
}

.logoTopo{
  display: none;
}

.blocoGuerras{
 /*background: linear-gradient(135deg, #111827, #0d111b);*/
 
 width: 120%;
 padding-top: 60px;
 padding-left: 70px;
 padding-right: 70px;
 padding-bottom: 80px;
 margin-bottom: 126px;
 margin-left: 0.5%;
 height: 260px;
}

#guild1{
width: 105px;
}

#guild2{
width: 105px;
}

#titleGuild1{
  position: absolute;
  padding-top: 115px;
  left: 25.8%;
  right: 60%;
  color: white;
  font-size: 25px;
  letter-spacing: 2px;
}

#subtitleGuild1{
  position: absolute;
  padding-top: 145px;
  right: 51.5%;
  color: white;
  font-size: 14px;
  letter-spacing: 2px;
}

#titleGuild2{
  position: absolute;
  padding-top: 115px;
  left: 71.5%;
  color: white;
  font-size: 25px;
  letter-spacing: 2px;
}
#subtitleGuild2{
  position: absolute;
  padding-top: 145px;
  left: 71.5%;
  color: white;
  font-size: 14px;
  letter-spacing: 2px;
}

.aura-amarela, .aura-azul{
  display: none;
}

.blocoFAQ {
  width: 350px;
  height: 80px;
   background: url(../../images/novo/Personagem7.png);
  background-size: cover;
  background-position: center; /* Centraliza a imagem no bloco */
  margin-left: 8%;
  margin-top: 7%;
  border-radius: 25px;
}
}




@media (min-width: 481px) and (max-width: 575.98px) { 

.title-cardA{
  font-size: 45px;
  position: absolute;
  bottom: 35%;
  right: 45.0%;
  color: white;
  transition: transform 0.3s;
  cursor: pointer;
}

.subtitle-cardA{
  font-size: 12px;
  position: absolute;
  bottom: 22%;
  right: 49.0%;
  color: white;
}

.next-left{ 
  position: absolute;
  width: 52px;
  bottom: 15%;
  left:72%;
  transition: transform 0.3s;
}

.next-right{ 
 position: absolute;
 width: 52px;
  bottom: 15%;
  left: 85%;
  transform: scaleX(-1);
  transition: transform 0.3s;
}

.number-page-cardA{
  position: absolute;
  bottom: 15%;
  left: 81.5%;
  color: white;
}

.blocoC {
  background-size: cover; 
  width: 580px;
  height: 310px;
  margin-left: -5px;
  margin-top: -5px;
  border-radius: 10px;
  border-left: 2px solid yellow;
}

.blocoA {
  width: 580px;
  height: 310px;
  margin-left: 0%;
  margin-top: -5px;
  border-radius: 30px;
  margin-bottom: 30px;
}


.gema-news{
  width: 35px;
   position: absolute;
  bottom: 55%;
  right: 77.5%;
  transform: scaleX(-1);
  cursor: pointer;
}
.gema-news-2{
  width: 35px;
}
.gema-news-3{
  width: 35px;
}

.update-news{
 position: absolute;
 bottom: 58%;
 right: 65%;
 color: #f8ce11;
 font-size: 17px;
 transition: transform 0.3s, opacity 0.3s;
 cursor: pointer;
}

.date-update-news{
  position: absolute;
  bottom: 52%;
  right: 59%;
  color: white;
  font-size: 16px;
  cursor: pointer;
}

.blocoYoutube, .blocoDiscord, .blocoDownload, .blocoDonate {
  background-size: cover; 
  width: 100%;
  height: 150px;
  border-bottom: 2px solid yellow;
  border-radius: 10px;
  transition: transform 0.3s;
  margin-bottom: 20px;
}

.blocoYoutube{
  margin-left: 2px;
}

.blocoDiscord{
 margin-left: 4px;
}

.blocoDownload{
margin-left: 3px;
}

.blocoDonate{
margin-left: 3px;
}

.blocoNews{
  margin-bottom: 35px;
}

.blocoRank1{
  margin-left: 5%;
}

.blocoRank2{
  margin-left: 5%;
}

.logoTopo{
  display: none;
}

.blocoGuerras{
 /*background: linear-gradient(135deg, #111827, #0d111b);*/
 
 width: 100%;
 padding-top: 60px;
 padding-left: 70px;
 padding-right: 70px;
 padding-bottom: 80px;
 margin-bottom: 126px;
 margin-left: 0.5%;
 height: 260px;
}

#guild1{
width: 105px;
}

#guild2{
width: 105px;
}

#titleGuild1{
  position: absolute;
  padding-top: 115px;
  right: 60%;
  color: white;
  font-size: 25px;
  letter-spacing: 2px;
}

#subtitleGuild1{
  position: absolute;
  padding-top: 145px;
  right: 63.5%;
  color: white;
  font-size: 14px;
  letter-spacing: 2px;
}

#titleGuild2{
  position: absolute;
  padding-top: 115px;
  left: 65.5%;
  color: white;
  font-size: 25px;
  letter-spacing: 2px;
}
#subtitleGuild2{
  position: absolute;
  padding-top: 145px;
  left: 65.5%;
  color: white;
  font-size: 14px;
  letter-spacing: 2px;
}

.aura-amarela, .aura-azuil{
  display: none;
}

.blocoFAQ {
  width: 570px;
  height: 110px;
   background: url(../../images/novo/Personagem7.png);
  background-size: cover;
  background-position: center; /* Centraliza a imagem no bloco */
  margin-left: -8%;
  margin-top: 7%;
  border-radius: 25px;
}
}
@media (min-width: 576px) and (max-width: 767.98px) { 
.title-cardA {
    font-size: 45px;
    bottom: 35%;
    right: 51%;
  }

  .subtitle-cardA {
    font-size: 16px;
    bottom: 18%;
    right: 43.0%;
  }

  .next-left,
  .next-right {
    bottom: 15%;
    left: 72%;
  }

  .next-right {
    left: 85%;
  }

  .number-page-cardA {
    bottom: 16%;
    left: 81.5%;
  }

  .blocoC,
  .blocoA {
    width: 580px;
    height: 310px;
    margin-top: -5px;
  }

  .blocoA{
    padding-left: 35px;
    margin-bottom: 25px;
  }

  .gema-news {
    bottom: 55%;
    right: 79.5%;
  }

  .update-news {
    bottom: 58%;
    right: 68%;
  }

  .date-update-news {
    bottom: 52%;
    right: 63%;
  }

  .blocoYoutube,
  .blocoDiscord,
  .blocoDownload,
  .blocoDonate {
    width: 85%;
    height: 150px;
    margin-bottom: 15px;
  }

  .blocoYoutube {
    margin-left: 32px;
  }

  .blocoDiscord {
    margin-left: 32px;
  }

  .blocoDownload {
    margin-left: 32px;
  }

  .blocoDonate {
    margin-left: 32px;
  }

.blocoRank1{
  margin-left: 5%;
}

.blocoRank2{
  margin-left: 5%;
}

.logoTopo{
  display: none;
}

.blocoNews {
  /*background: url(../../images/novo/paredeNews.png);*/
  background: url();
  padding-top: 10px;
  padding-left: 35px;
  padding-right: 35px;
  background-size: cover; 
  margin-left: -30px;
  width: 550px;
  height: 705px;
  border-radius: 25px;
}

.blocoGuerras{
 /*background: linear-gradient(135deg, #111827, #0d111b);*/
 
 width: 100%;
 padding-top: 60px;
 padding-left: 70px;
 padding-right: 70px;
 padding-bottom: 80px;
 margin-bottom: 126px;
 margin-left: 0.5%;
 height: 260px;
}

#guild1{
width: 105px;
}

#guild2{
width: 105px;
}

#titleGuild1{
  position: absolute;
  padding-top: 115px;
  right: 64%;
  color: white;
  font-size: 25px;
  letter-spacing: 2px;
}

#subtitleGuild1{
  position: absolute;
  padding-top: 145px;
  right: 67.5%;
  color: white;
  font-size: 14px;
  letter-spacing: 2px;
}

#titleGuild2{
  position: absolute;
  padding-top: 115px;
  left: 69.0%;
  color: white;
  font-size: 25px;
  letter-spacing: 2px;
}
#subtitleGuild2{
  position: absolute;
  padding-top: 145px;
  left: 69.5%;
  color: white;
  font-size: 14px;
  letter-spacing: 2px;
}

.aura-amarela, .aura-azuil{
  display: none;
}



  .blocoFAQ {
    width: 730px;
    height: 140px;
    margin-left: -22%;
    margin-top: 7%;
  }
}


/* Medium devices (tablets, 768px and up)*/
@media (min-width: 768px) and (max-width: 991.98px) { 
 .espada-inv{
  display: none;
}

.img-inv{
  display: none;
}

.logoTopo{
  display: none;
}

.blocoNews {
  background: url();
  padding-top: 10px;
  padding-left: 35px;
  padding-right: 35px;
  background-size: cover; 
  margin-left: -30px;
  width: 660px;
  height: 705px;
  border-radius: 25px;
}

}


@media (min-width: 923px) and (max-width: 1199.98px) { 

	.img-inv{
	  margin-top: 72px;
	}

	.logoTopo{
	  display: none;
	}

	.blocoNews {
/*background: url(../../images/novo/paredeNews.png);*/
  background: url();
	  /*padding-top: 10px;*/
	  padding-top: 25px;
	  /*padding-left: 35px;
	  padding-right: 35px;*/
	  background-size: cover; 
	  /*margin-left: -30px;*/
	  /*width: 660px;*/
	  width: 120%;
	  height: 705px;
	  border-radius: 25px;
	}
	
	#bloco-rank1{
		margin-left: 5px;
	}

	.blocoRank1 {
	  width: 340px;
	}
	
	#bloco-rank2{
		margin-left: -10px;
	}

	.blocoRank2 { 
	  width: 340px;
	}
	
	#bloco-rank3{
		margin-left: 697px;
		margin-top: -605px;
	}

	.blocoRank3 { 
	  width: 340px;
	}

	#titleGuild1{
	  position: absolute;
	  padding-top: 140px;
	  right: 410px;
	  color: white;
	  font-size: 38px;
	  letter-spacing: 2px;
	}
	#subtitleGuild1{
	  position: absolute;
	  padding-top: 190px;
	  right: 440px;
	  color: white;
	  font-size: 18px;
	  letter-spacing: 2px;
	}

	#titleGuild2{
	  position: absolute;
	  padding-top: 140px;
	  left: 71%;
	  color: white;
	  font-size: 38px;
	  letter-spacing: 2px;
	}
	#subtitleGuild2{
	  position: absolute;
	  padding-top: 190px;
	  left: 72%;
	  color: white;

	}

	#guild2{
	  margin-right: 86px;
	}

	.aura-azul{
	  left: 405px;
	}

	.blocoRank2{
	  z-index: 10;
	  position: absolute;
	}

	.blocoFAQ {
		z-index: 1;
		margin-top: 10px;
	  }

	.title-cardA {
		font-size: 45px;
		bottom: 35%;
		right: 51%;
	  }

	  .subtitle-cardA {
		font-size: 16px;
		bottom: 20%;
		right: 43.0%;
	  }

	.next-left, .next-right {
		bottom: 5%;
		left: 72%;
	 }

	  .next-right {
		left: 85%;
	  }

	  .number-page-cardA {
		bottom: 7%;
		left: 82.2%;
	  }

	  .gema-news {
		bottom: 55%;
		right: 77.5%;
	  }

	  .update-news {
		bottom: 58%;
		right: 64.5%;
	  }

	  .date-update-news {
		bottom: 52%;
		right: 59%;
	  }

}

/* Extra large devices (large desktops, 1200px and up)*/
@media (min-width: 1200px) { 

}

.bloco-ranks-gerais{
 /*background: url(../../images/novo/paredeNews.png);*/
  background: url();
  background-size: cover;
  width: 100%;
  height: 700px;
  padding-top: 50px;
}

.bloco-ranks-gerais {
	padding-left: 120px; 
	padding-right: 120px;
}

#rankings-principais a{
    color: white;
    text-decoration: none;
    background-color: transparent;
    -webkit-text-decoration-skip: objects;
  }

#rankings-principais{
  width: 95%;
  height: 600px;
  overflow: auto;
}

.nav-item{
  color:  white;
}

#rankings-principais .table{
  padding:  15px;
  text-align: center;
  /*border-collapse: separate; 
  border-spacing: 0 10px;*/
  width: 100%;
}

#rankings-principais th{
  /*border-collapse: separate; 
  border-spacing: 0 10px;*/
  width: 25%;
}

#rankings-principais td{
  font-size: 16px;
  /*border-collapse: separate; 
  border-spacing: 0 10px;*/
  width: 25%;
}