/*******************************************************
	
	TALISMAN TUTORIAL
	Aprendendo & Desenvolvendo

	Site desenvolvido por: Origem
	https://talismantutorial.dev
	https://instagram.com/talism4n.tutorial
	https://youtube.com/talismantutorial

	Por favor, manter os créditos
	Muito obrigado

******************************************************/
@charset "utf8";
body{
	background: url("../../assets/img/fundo/IMG-20210629-WA0126.jpg") top center #000 no-repeat;
	font-family: 'Roboto', sans-serif;
}
*{
	margin: 0;
	padding: 0;
	list-style: none;
	box-sizing: border-box;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	text-decoration: none;
}

@font-face{
	src: url(../../dist/fonts/beaufortforlol-medium.otf);
	font-family: beaufort;
	font-weight: 500;
}
@font-face{
	src: url(../../dist/fonts/beaufortforlol-bold.otf);
	font-family: beaufort;
	font-weight: bold;
}
@font-face{
	src: url(../../dist/fonts/Roboto-Regular.ttf);
	font-family: roboto;
	font-weight: 300;
}
@font-face{
	src: url(../../dist/fonts/Roboto-Medium.ttf);
	font-family: roboto;
	font-weight: 500;
}

/* Cursor */
body, 
html, 
label, 
input, p span a{cursor: url("../../assets/img/cursor/default.cur"), default;}
a, button[type=submit], 
select, option, span, p span a{
	cursor:url("../../assets/img/cursor/pointer.cur"), 
	pointer !important; outline: none;
}

.container{width: 100%; margin: 0 auto;}
.content{max-width: 960px; margin: 0 auto;}
.fluido{width: 100%;}

/* section */
.section{height: 450px;}
.section .top{display: block;}
.sociais{
	width: 100%;
	display: flex;
	flex-wrap: wrap;
	justify-content: flex-end;
}
.sociais li{display: inline-flex;}
.sociais li a{
	margin-top: 15px;
	transition: all 0.5s;
}
.sociais li a:hover{opacity: 0.5;}
.logo{
	margin: 0 auto;
	width: 100%;
	max-width: 400px;
	height: 239px;
	display: block;
	position: relative;
	top: 100px;
}
.logo img{
	width: 100%;
	max-width: 400px;
}

/* nav */
.nav{
	display: flex;
	padding: 15px;
	position: relative;
	top: 14px;
	justify-content: space-between;
	background: url("../../assets/img/nav.png") center center no-repeat;
}
.nav ul{height: 50px; line-height: 3px;}
.nav li{display: inline;}
.nav li a{
	float: left;
	text-transform: uppercase;
	padding: 30px 31px;
	font-weight: bold;
	transition: all 0.7s;
	font-family: beaufort;
}
.item_nav{
	color: #111;
	margin-left: 20px;
	margin-top: 3px;
	font-size: 1.1em;
}
.item_nav:hover{
	color: #333;
	text-shadow: 1px 0px 8px #fff;
}
.nav_d{margin-right: 13px;}
.nav_r{position: relative; left: -7px;}
.nav_v{position: relative; left: 24px;}
.item_acc{
	color: #333;
	width: 310px;
	height: 78px;
	position: relative;
	top: -14px;
	left: 15px;
	text-align: center;
	font-size: 1.8em;
}
.item_acc span{
	display: block;
	font-size: 0.5em;
	position: relative;
	top: 18px;
}
.item_acc:hover{text-shadow: 1px 1px 15px #fff;}

/* main */
.main{
	display: flex;
	flex-wrap: wrap;
	margin-top: 5px;
	margin-bottom: 10px;
	justify-content: space-between;
}

/* donate */
.donate{width: 100%;}
.donate h2{
	color: #ccc;
	width: 100%;
	text-align: center;
	margin-bottom: 5px;
	display: inline-block;
	z-index: 2;
}
.donate p{text-align: center; width: 100%;}
.donate img{}

/* aside */
.aside{
	flex-basis: 20%;
	margin-bottom: 20px;
	margin-top: 13px;
}
.download{
	color: #222;
	width: 195px;
	height: 125px;
	background: url("../../assets/img/btn-download.png");
	font-weight: bold;
	text-align: center;
	font-family: beaufort;
	font-size: 2em;
	display: flex;
	justify-content: center;
	flex-direction: column;
	align-content: center;
	transition: all 0.5s;
}
.download:hover{
	background: url("../../assets/img/btn-download-over.png");
}
.download span{
	font-size: 0.4em;
	text-transform: uppercase;
}
.aside .bx{
	border-radius: 6px 6px 0 0;
	margin-bottom: 5px;
}
.aside .bx .title{
	padding: 10px;
	border-radius: 6px 6px 0 0;
	position: relative;
	background: url("../../assets/img/title.png") left no-repeat;
}
.aside .bx .title h1{
	color: #691C13;
	font-weight: bold;
	font-size: 1.3em;
	text-indent: 10px;
	font-family: beaufort;
}
.aside .bx .desc{
	width: 158px;
	margin: 0 auto;
	background: url("../../assets/img/aside_middle.png") center repeat-y;
}
.aside_bottom{
	width: 158px;
	height: 61px;
	margin: 0 auto;
	position: relative;
	background: url("../../assets/img/aside_bottom.png") center repeat-y;
}
.aside_top{
	width: 158px;
	height: 14px;
	margin: 0 auto;
	position: relative;
	background: url("../../assets/img/aside_top.png") center repeat-y;
}
.aside .bx .desc{padding: 5px;}
.aside .bx .desc p{
	color: #fff;
	font-weight: bold;
	font-size: 0.9em;
	text-indent: 15px;
	padding: 5px;
}
.aside .bx .desc p span{
	margin-left: 6px;
	font-size: 0.8em;
	text-transform: uppercase;
}
.aside .bx .desc p .on, .aside .bx .desc p .off{
	border-radius: 4px;
	padding: 2px 7px;
	text-shadow: 1px 0px 5px #fff;
}
.aside .bx .desc p .on{
	background-color: #009900;
}
.aside .bx .desc p .off{
	background-color: #CC0000;
}
.aside .bx .desc ul li{display: block;}
.aside .bx .desc ul li a{
	color: #fff;
	margin: 0 auto;
	width: 95%;
	display: block;
	padding: 10px 0;
	text-align: center;
	font-weight: bold;
	text-indent: -10px;
	border-bottom: 1px solid rgba(255,255,255,0.1);
}
.aside .bx .desc ul li:last-child a{border-bottom: initial;}
.aside .bx .desc ul li a:hover{color: #ccc;}

.aside .bx .desc table{width: 80%; margin: 0 auto;}
.aside .bx .desc table .tr{
	color: orange;
	font-size: 0.9em;
	text-align: center;
}
.aside .bx .desc table tr td{
	color: #fff;
	font-size: 0.9em;
	text-align: center;
	padding: 3px;
}
.aside .bx .title .imgaside{
	position: absolute;
	top: -16px;
	right: 0;
	z-index: 2;
}

/* main-content */
.main-content{flex-basis: 50%;}

/* conteudo*/
.conteudo{
	padding: 35px;
	border-radius: 6px;
	background: url("../../assets/img/conteu_middle.png") center center;
	background-size: 100%;
}

/* content-main */
.content-main{}
.content-main p{
	color: #777;
	font-size: 1em;
	margin-bottom: 7px;
}
.conteu_top{
	width: 760px;
	height: 41px;
	margin: 0 auto;
	position: relative;
	top: 3px;
	z-index: 2;
	background: url("../../assets/img/conteu_top.png") center center no-repeat;
	background-size: 100%;
}
.conteu_bottom{
	width: 760px;
	height: 31px;
	margin: 0 auto;
	position: relative;
	top: -3px;
	z-index: 2;
	background: url("../../assets/img/conteu_bottom.png") center center no-repeat;
	background-size: 100%;
}
.conteudo .title{
	display: block;
	width: 100%;
	padding: 15px;
	margin-bottom: 20px;
	background: url("../../assets/img/line.png") bottom no-repeat;
}
.conteudo .title h2{
	color: #C59E4B;
	font-size: 1.5em;
	margin-top: -40px;
	font-family: beaufort;
}
.conteudo .title h2 img{
	float: left;
	position: relative;
	top: 3px;
	left: -5px;
}

/* item */
.donate{
	padding: 15px;
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
}
.item_donate{
	width: 200px;
	background-color: #333;
	padding: 10px;
	border-radius: 4px;
	margin: 10px 10px;
}
.item_donate h3{
	color: #ccc;
	font-size: 1.2em;
	padding-bottom: 7px;
}
.item_donate .buy{
	margin-right: 5px;
}
.item_donate p{
	color: #888;
	font-size: 0.9em;
}
.item_donate .valor{
	color: green;
	font-size: 1.4em;
	font-weight: bold;
	text-align: left;
}

.item_donate a{
	padding: 7px 10px;
	background-color: green;
	color: #fff;
	border-radius: 5px;
	margin: 8px 0;
	display: inline-block;
}
.item_donate a:hover{
	text-decoration: underline;
}

/* ranking */
.content-main table{
	width: 100%;
	padding: 15px;
}
.content-main .bg-tr{
	width: 100%;
	color: #C59E4B;
	text-align: center;
	margin: 15px 0;
	font-size: 1.2em;
}
.content-main .tr{
	color: #ccc;
	text-align: center;
	position: relative;
	top: 5px;
}

/* criar conta */
.formRegister {
    display: flex;
    justify-content: center;
    width: 100%;
}

.formRegister form {
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 100%;
    max-width: 320px;
}
.formRegister .span{text-align:center; color:#666;}
.formRegister .span a{color:#0099ff;}
.formRegister .span a:hover{text-decoration:underline;}
.formRegister input{
	display:block;
	width: 100%;
	outline:0px solid #777;
	padding: 10px 0; 
	text-indent: 25px;
	background: url("../../assets/img/line-form.png") no-repeat bottom; 
	border-radius:3px; 
	border: 1px solid rgba(255,255,255,0.2);
	margin:0 auto; 
	background-color: #111;
	margin-top:3px;
	color:#999; 
	font-weight:600;
}
.formRegister .bnt-create {
    margin-top: 15px;
    padding: 15px 25px;
    width: 203px;
    height: 62px;
    background: url("../../assets/img/btn-c.png");
    text-transform: uppercase;
    color: #ccc;
    font-size: 1em;
    font-weight: bold;
    transition: all 0.5s;
    border: none;
    cursor: pointer;
    font-family: beaufort;
}
.formRegister .bnt-create:hover, 
.notices button[type=submit]:hover{
	color: #fff;
	text-shadow: 1px 1px 10px #fff;
	background: url("../../assets/img/btn-c-over.png");
}

/* register ok e erro */
.ok, .erro{
	display: block;
	width:70%; 
	text-align: center;
	margin: 0 auto;
	margin-top: 10px; 
	padding:10px; 
	font-size: 1.1em;
}
.ok{color: #5cb85c; }
.erro{color: #f0ad4e;}
.ok span, .erro span{
	display: block; 
	font-weight:100; 
	font-size: 0.9em;
}

/* slide */
.slide{
	width: 637px;
	height: 344px;
	margin: 0 auto;
	display: block;
	padding: 15px;
	background: url("../../assets/img/bg-slide.png") center center no-repeat;
}

/* Slideshow container */
.slideshow-container{
	float: left;
  	width: 515px;
  	height: 300px;
  	border-radius: 6px;
  	position: relative;
  	top: 7px;
  	left: 15px;
  	margin: auto;
}
.slideshow-container img{border-radius: 6px;}
.mySlides {display: none;}
.text{
  color: #f2f2f2;
  font-size: 0.9em;
  padding: 15px 12px;
  position: absolute;
  bottom: 0px;
  width: 100%;
  text-align: left;
  background-color: rgba(0,0,0,0.8);
  border-radius: 0 0 6px 6px;
}
.text h2{
  color: #C59E4B;
  font-size: 1.3em;
}
.text a{
	color: #0099FF;
	display: inline-block;
}
.text a:hover{
	color: #0099FF;
	text-decoration: underline;
}
.numbertext{
  color: #f2f2f2;
  font-size: 12px;
  padding: 8px 12px;
  position: absolute;
  top: 0;
}
.fade{
  -webkit-animation-name: fade;
  -webkit-animation-duration: 1.5s;
  animation-name: fade;
  animation-duration: 1.5s;
}
@-webkit-keyframes fade {
  from {opacity: .4}
  to {opacity: 1}
}
@keyframes fade {
  from {opacity: .4}
  to {opacity: 1}
}

/* info */
.info{margin-top: 15px;}
.info header{
	width: 100%;
	padding: 10px 10px;
	background: url("../../assets/img/Cool-Screenshots.png") bottom left no-repeat;
}
.info header h2{
	padding: 10px;
	color: #C59E4B;
	font-size: 1.5em;
	font-family: beaufort;
}
.info .desc{padding: 10px 20px;}
.info .desc-inf{padding: 10px 20px;}
.info .desc-inf h2{
	color: #C59E4B;
	font-family: beaufort;
	font-weight: 100;
	font-size: 1em;
	padding-bottom: 5px;
}
.info .desc-inf p a{color: #165E80;}
.info .desc-inf p a:hover{
	color: #1E7DAC;
	text-decoration: underline;
}

.info .desc p{
	text-align: left;
	color: #C59E4B;
	font-size: 1em;
	font-weight: bold;
}
.info .desc p span{
	color: #ccc;
	margin-left: 6px;
}
.info .video{
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	position: relative;
}
.info .video .item_videos{
	border: 5px solid #C59E4B;
	border-radius: 4px;
	margin-bottom: 8px;
}

/* download */
.download_file{
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
}
.download_file a{
	width: 238px;
	padding: 18px;
	color: #222;
	display: block;
	text-align: center;
	background: url("../../assets/img/btn.png") center center no-repeat;
	border-radius: 4px;
	font-size: 1.5em;
	font-weight: bold;
	font-family: beaufort;
	text-transform: uppercase;
	margin: 0 10px;
}
.download_file a:hover{
	color: #fff;
	background: url("../../assets/img/btn-over.png") center center no-repeat;
}
.download_file a span{
	display: block;
	font-size: 0.9em;
	text-transform: none;
}
.g-recaptcha{
	margin: 7px 0;
	transform:scale(1.05);
	-webkit-transform:scale(1.05);
	transform-origin:0 0;
	-webkit-transform-origin:0 0; 
}

/* footer */
.footer{
	background: url("../../assets/img/header_bg4.jpg") center top;
	border-top: 4px solid #C59E4B;
	padding: 50px;
}
.footer .rodape{
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
}
.footer .rodape .bx{
	width: 100%;
	max-width: 350px;
}
.footer .rodape .uteis{width: 100%; max-width: 150px;}
.ttdev{margin-top: 20px;}
.footer .rodape .bx .title{padding-bottom: 10px;}
.footer .rodape .bx .title h2{color: #C59E4B;}
.footer .rodape .bx .desc{}
.footer .rodape .bx .desc p{color: #666666;}
.footer .rodape .bx .desc ul li a{color: #777;}
.footer .rodape .bx .desc ul li a:hover{
	color: #C59E4B;
	text-decoration: underline;
}
.autorais{
	padding: 8px;
	border-top: 1px solid rgba(255,255,255,0.1);
	background-color: rgba(0,0,0,0.3);
}
.autorais span{display: block;}
.autorais span a{
	color: #D8B164; 
	display: inline-block;
}
.autorais span a:hover{text-decoration: underline;}
.direitos{}
.direitos p{
	text-align: center;
	color: #777;
	font-size: 0.8em;
}
.fb-page{
	width: 100%;
	border: 8px solid #fff;
	border-radius: 4px;
	display: block;
}

.discord-widget {
    width: 100%;
    border: 8px solid #fff;
    border-radius: 4px;
    display: block;
}

/* Увеличаване ширината на Top Donators box */
.aside .bx.top-donators {
    width: 200px !important;
}

.aside .bx.top-donators .desc {
    width: 200px !important;
}

.aside .bx.top-donators .aside_top,
.aside .bx.top-donators .aside_bottom {
    width: 200px !important;
}


/* ---- DONATE TABLE ---- */
.donate-table {
    width: 100%;
    border-collapse: collapse;
    background-color: #1a1314;
    color: #f0caa5;
    font-family: 'Segoe UI', Tahoma, sans-serif;
    margin-top: 20px;
    border: 1px solid #3a2b2d;
    box-shadow: 0 0 15px rgba(255, 153, 0, 0.1);
}
.donate-table th {
    background-color: #2a1c1d;
    color: #ffcc99;
    padding: 12px 10px;
    font-size: 14px;
    text-transform: uppercase;
    letter-spacing: 1px;
    border-bottom: 2px solid #5e3e2f;
}
.donate-table td {
    padding: 10px;
    text-align: center;
    border-bottom: 1px solid #352424;
}
.donate-table img {
    max-width: 40px;
    border-radius: 6px;
    box-shadow: 0 0 6px rgba(255, 215, 0, 0.5);
}
.donate-table a {
    color: #ffbb66;
    font-weight: bold;
    text-decoration: none;
}
.donate-table a:hover {
    color: #ffd49e;
    text-shadow: 0 0 4px #ffa94d;
}

/* ---- TOOLTIP IMAGE ---- */
.tooltip {
    position: relative;
    display: inline-block;
}
.tooltip-img {
    display: none;
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    z-index: 9999;
    padding: 8px;
    background: rgba(0, 0, 0, 0.95);
    border: 2px solid #d2a66a;
    border-radius: 10px;
    box-shadow: 0 0 25px rgba(255, 191, 0, 0.3);
}
.tooltip-img img {
    width: auto;
    height: auto;
    max-width: 90vw;
    max-height: 90vh;
    border-radius: 6px;
}
.tooltip-img.show {
    display: block;
}
#overlay-close {
    display: none;
    position: fixed;
    top: 0; left: 0;
    width: 100vw; height: 100vh;
    background: rgba(0,0,0,0.4);
    z-index: 9998;
}
#overlay-close.show {
    display: block;
}


.donate-tabs {
    margin-bottom: 10px;
    text-align: center;
}
.tab-btn {
    padding: 8px 16px;
    background: #1e1e1e;
    color: #ffc107;
    border: none;
    cursor: pointer;
    margin: 0 5px;
    font-weight: bold;
}
.tab-btn.active {
    background: #ffc107;
    color: #000;
}
.tab-content {
    display: none;
}
.tab-content.active {
    display: block;
}