@charset "utf-8";

#dashboard { float: left; width: 100%;}
#perfil { float: left; width: 100%;}
#servicos { float: left; width: 100%;}
#recompensa { float: left; width: 100%;}
#atendimento { float: left; width: 100%;}
#shop { float: left; width: 100%;}
#seguranca { float: left; width: 100%;}
#vips { float: left; width: 100%;}

#dashboard .avisos { float: left; width: 100%; margin: 16px 0 0;}
#dashboard .avisos .ident { float: left; width: 100%; padding: 18px 0 14px; margin: 0 0 3px; text-transform: uppercase; text-align: center; font-weight: bold; font-size: 1em; line-height: 0; -webkit-border-top-left-radius: 4px; -webkit-border-top-right-radius: 4px; -moz-border-radius-topleft: 4px; -moz-border-radius-topright: 4px; border-top-left-radius: 4px; border-top-right-radius: 4px;}
#dashboard .avisos .tab { float: left; width: 100%; margin: 2px 0; border: 1px solid rgb(90 90 90 / 50%);}
#dashboard .avisos .tab .a_prepara { position: relative; float: left; width: 100%; padding: 0; margin: 0; outline: 0;}
#dashboard .avisos .tab .a_titulo { float: left; width: 100%; padding: 10px 70px 10px 10px; font-weight: bold; font-size: 1.1em;}
#dashboard .avisos .tab .a_link { position: absolute; top: 10px; right: 10px; padding: 1px 10px; background-color: #a6957b; font-weight: bold; color: rgb(250 250 250) !important;}
#dashboard .avisos .tab .a_link:hover { background-color: #9e815a;}
#dashboard .avisos .tab .a_texto { float: left; width: 100%; padding: 0 15px; border-top: 1px solid rgb(90 90 90 / 50%);}


#dashboard .portfolio { float: left; width: 100%; margin: 0 0 11px;}
#dashboard .portfolio .ident { float: left; width: 100%; padding: 17px 0 16px; margin: 0 0 3px; text-transform: uppercase; text-align: center; font-weight: bold; font-size: 1em; line-height: 0; -webkit-border-top-left-radius: 4px; -webkit-border-top-right-radius: 4px; -moz-border-radius-topleft: 4px; -moz-border-radius-topright: 4px; border-top-left-radius: 4px; border-top-right-radius: 4px;}
#dashboard .portfolio .nomesi { float: left; width: 100%; margin: 11px 0 0; font-weight: bold;}
#dashboard .portfolio .inicio { float: left; width: 100%;}
#dashboard .portfolio .inicio .carteira { float: left; width: 100%; margin: 2px 0 0; outline: 1px solid rgb(90 90 90); outline-offset: -1px; position: relative;}
#dashboard .portfolio .inicio .carteira .relatorio { float: left; width: 100%; height: 160px; position: relative;}
#dashboard .portfolio .inicio .carteira .bolsa { position: absolute; width: 100%; top: 0; left: 0;}
#dashboard .portfolio .inicio .carteira .bolsa .nomecar { float: left; width: 100%; padding: 5px 5px 3px; background-color: rgb(90 90 90 / 20%); text-transform: uppercase; text-align: center; font-weight: bold; font-size: 0.85em; position: relative;}
#dashboard .portfolio .inicio .carteira .bolsa .bt { position: absolute; top: 50%; padding: 11px 5px 10px; margin: -10px 0; font-size: 0.9em; color: rgb(250 250 250) !important; line-height: 0;}
#dashboard .portfolio .inicio .carteira .bolsa .bt.alterar { right: 33px; background-color: #5b6d78;}
#dashboard .portfolio .inicio .carteira .bolsa .bt.alterar:hover { background-color: #272e34;}
#dashboard .portfolio .inicio .carteira .bolsa .bt.remover { width: 15px; right: 5px; background-color: #272e34;}
#dashboard .portfolio .inicio .carteira .bolsa .bt.remover:hover { background-color: #5b6d78;}
#dashboard .portfolio .inicio .carteira .setinha { position: absolute; top: 50%; width: 20px; height: 20px; top: 50%; background-position: 50%; background-repeat: no-repeat;}
#dashboard .portfolio .inicio .carteira .setinha.pe { left: -8px; background-image: url('../imagens/neutro-setinha-pe.png?v1');}
#dashboard .portfolio .inicio .carteira .setinha.pd { right: -8px; background-image: url('../imagens/neutro-setinha-pd.png?v1');}
#dashboard .portfolio .inicio .carteira .resumo { float: left; width: 50%; padding: 8px 0;}
#dashboard .portfolio .inicio .carteira .resumo h2 { float: left; width: 100%; font-size: 0.88em;}
#dashboard .portfolio .inicio .carteira .resumo h3 { float: left; width: 100%; font-weight: bold; font-size: 1em;}
#dashboard .portfolio .inicio .carteira .alarmes { float: left; width: 100%; padding: 8px 10px;}
#dashboard .portfolio .inicio .carteira .alarmes h2 { float: left; width: 100%; font-size: 1em;}
#dashboard .portfolio .inicio .carteira .carmais { float: left; width: 100%; padding: 5px 0; background-color: rgb(90 90 90 / 20%); text-align: center;}
#dashboard .portfolio .inicio .carteira .carmais:hover { background-color: rgb(90 90 90 / 30%);}
#dashboard .portfolio .inicio .carteira .bb { border-bottom: 1px solid rgb(90 90 90);}
#dashboard .portfolio .inicio .moedas { float: left; width: 100%; margin: 21px 0 0;}
#dashboard .portfolio .inicio .moedas .nagmoe { float: left; width: 100%;}
#dashboard .portfolio .inicio .moedas .nagmoe button { width: 49.8%; padding: 12px 0; text-transform: uppercase; text-align: center; font-weight: bold;}
#dashboard .portfolio .inicio .moedas .nagmoe button.b1 { float: left;}
#dashboard .portfolio .inicio .moedas .nagmoe button.b2 { float: right;}
#dashboard .portfolio .inicio .moedas .listar { padding: 0;}
#dashboard .portfolio .inicio .moedas .listar .mod { display: flex; justify-content: space-between; float: left; width: 100%; padding: 12px; font-size: 14px;}
#dashboard .portfolio .inicio .moedas .listar .mod .m3 { float: left; width: 100%;}
#dashboard .portfolio .inicio .moedas .listar .mod .m3.tr { text-align: right;}
#dashboard .portfolio .inicio .moedas .listar .mod.bt { border-top: 1px solid rgb(90 90 90 / 30%);}
#dashboard .portfolio .gerenciar { float: left; width: 100%; margin: 0 0 11px;}
#dashboard .portfolio .gerenciar .carteira { float: left; width: 100%;}
#dashboard .portfolio .gerenciar .selativo .listar { top: 50px; padding: 7px;}

#dashboard .mundi .numeros .ajax { min-height: auto;}
#dashboard .mundi .numeros .valores { flex-wrap: wrap; font-size: 1em;}
#dashboard .mundi .numeros .valores .bloco { margin: 0;}
#dashboard .mundi .numeros .valores .lado1 { flex: 1 1 20%;}
#dashboard .mundi .numeros .valores .lado2 { width: 450px; margin-left: 15px;}
#dashboard .mundi .numeros .valores .grafico { background-color: rgb(250 250 250 / 80%);}
#dashboard .mundi .numeros .valores .opcoes { flex-wrap: wrap}
#dashboard .mundi .numeros .valores .opcoes button { flex: 1 1 20%; margin: 0 5px 5px 0; background-color: rgb(90 90 90 / 20%); font-weight: bold;}
#dashboard .mundi .numeros .valores .opcoes button.ativo { background-color: rgb(138 113 76); color: rgb(255 255 255);}
#dashboard .mundi .numeros .valores .opcoes button:hover { background-color: rgb(138 113 76); color: rgb(255 255 255);}
#dashboard .mundi .numeros .valores .opcoes button.mais { flex: auto; width: 20px; cursor: auto;}
#dashboard .mundi .numeros .valores .opcoes button.mais:hover { background-color: rgb(90 90 90 / 20%); color: rgb(40 40 40); cursor: auto;}
#dashboard .mundi .numeros .valores .nun { margin: 21px 0;}
#dashboard .mundi .numeros .valores .nun .ajax { flex-wrap: wrap; align-items: center;}
#dashboard .mundi .numeros .valores .nun .total { font-size: 3em;}
#dashboard .mundi .numeros .valores .nun .usdt { margin: 0 10px; font-size: 1.5em;}
#dashboard .mundi .numeros .valores .nun .seta { top: 50%; right: 10px; margin: -20px 0 0; background: url('../imagens/neutro-seta-pe.png') 50% no-repeat;}
#dashboard .mundi .numeros .valores .tempo { text-align: center;}
#dashboard .mundi .numeros .valores .tempo .ajax { flex-wrap: wrap;}
#dashboard .mundi .numeros .valores .tempo span { flex: 1 1 20%; margin: 0 5px; outline: 1px solid rgb(90 90 90 / 20%);}
#dashboard .mundi .numeros .atalhos { flex-wrap: wrap; font-size: 1em;}
#dashboard .mundi .numeros .atalhos .bloco { margin: 0;}
#dashboard .mundi .numeros .atalhos .lado1 { flex: 1 1 20%;}
#dashboard .mundi .numeros .atalhos .lado2 { width: 450px; margin-left: 15px;}
#dashboard .mundi .numeros .atalhos .setores { margin: 0 0 5px;}
#dashboard .mundi .numeros .atalhos .grandes a { position: relative; padding: 0 0 15%; margin: 0 5px 28px; background-size: 50%; background-position: 50%; background-repeat: no-repeat;}
#dashboard .mundi .numeros .atalhos .grandes a.automatizacao { background-image: url('../imagens/neutro-dashboard-mundi-atalhos-g-automatizacao.png?v1');}
#dashboard .mundi .numeros .atalhos .grandes a.recompensa { background-image: url('../imagens/neutro-dashboard-mundi-atalhos-g-recompensa.png?v1');}
#dashboard .mundi .numeros .atalhos .grandes a.peer { background-image: url('../imagens/neutro-dashboard-mundi-atalhos-g-peer.png?v1');}
#dashboard .mundi .numeros .atalhos .grandes a.rank { background-image: url('../imagens/neutro-dashboard-mundi-atalhos-g-rank.png?v1');}
#dashboard .mundi .numeros .atalhos .grandes a.batepapo { background-image: url('../imagens/neutro-dashboard-mundi-atalhos-g-batepapo.png?v1');}
#dashboard .mundi .numeros .atalhos .grandes a.indicacao { background-image: url('../imagens/neutro-dashboard-mundi-atalhos-g-indicacao.png?v1');}
#dashboard .mundi .numeros .atalhos .grandes a.mundiso { background-image: url('../imagens/neutro-dashboard-mundi-atalhos-g-mundiso.png?v1');}
#dashboard .mundi .numeros .atalhos .grandes a.shop { background-image: url('../imagens/neutro-dashboard-mundi-atalhos-g-shop.png?v2');}
#dashboard .mundi .numeros .atalhos .grandes a.bookmundi { background-image: url('../imagens/neutro-dashboard-mundi-atalhos-g-bookmundi.png?v1');}
#dashboard .mundi .numeros .atalhos .grandes a.seguranca { background-image: url('../imagens/neutro-dashboard-mundi-atalhos-g-seguranca.png?v1');}
#dashboard .mundi .numeros .atalhos .grandes a.faqs { background-image: url('../imagens/neutro-dashboard-mundi-atalhos-g-faqs.png?v1');}
#dashboard .mundi .numeros .atalhos .grandes a.atendimento { background-image: url('../imagens/neutro-dashboard-mundi-atalhos-g-atendimento.png?v1');}
#dashboard .mundi .numeros .atalhos .grandes span { position: absolute; width: 100%; bottom: -24px; left: 0; text-align: center; font-size: 0.8em;}
#dashboard .mundi .numeros .atalhos .pequenos { padding: 4px 0; margin: 8px 0 28px; background-color: rgb(39 46 52 / 11%);}
#dashboard .mundi .numeros .atalhos .pequenos a { position: relative; padding: 0 0 15%; margin: 0 10px; background-size: 50%; background-position: 50%; background-repeat: no-repeat;}
#dashboard .mundi .numeros .atalhos .pequenos a.boot { background-image: url('../imagens/neutro-dashboard-mundi-atalhos-p-boot.png?v1');}
#dashboard .mundi .numeros .atalhos .pequenos a.servicos { background-image: url('../imagens/neutro-dashboard-mundi-atalhos-p-servicos.png?v1');}
#dashboard .mundi .numeros .atalhos .pequenos a.integracoes { background-image: url('../imagens/neutro-dashboard-mundi-atalhos-p-integracoes.png?v1');}
#dashboard .mundi .numeros .atalhos .pequenos a.rank { background-image: url('../imagens/neutro-dashboard-mundi-atalhos-p-rank.png?v1');}
#dashboard .mundi .numeros .atalhos .pequenos span { position: absolute; width: 100%; bottom: -30px; left: 0; text-align: center; font-weight: bold; font-size: 0.8em;}
#dashboard .mundi .numeros .atalhos .mais { padding: 11px 0 19px; margin: 11px 0 0; line-height: 0;}
#dashboard .mundi .numeros .atalhos .boas { text-align: center; font-size: 0.8em;}

#perfil .foto { float: left; width: 100%; padding: 12px; position: relative;}
#perfil .foto .atimg { float: left; width: 100%; height: 170px; position: relative;}
#perfil .foto .atimg .imagem { position: absolute; width: 150px; height: 150px; top: 11px; left: 50%; margin: 0 0 0 -77px; background-color: rgb(250 250 250); border: 5px solid rgb(250 250 250);}
#perfil .foto .atimg .imagem img { position: absolute; width: 100%; height: 100%; top: 0; left: 0; object-fit: cover;}
#perfil .foto .carregar { float: left; width: 100%; margin: 5px 0;}
#perfil .foto .carregar .file { float: left; width: 100%; background-color: rgb(0 150 130); position: relative; text-align: center;}
#perfil .foto .carregar .file em { float: left; width: 100%; padding: 14px 0; text-transform: uppercase; font-weight: bold; font-style: normal; color: rgb(250 250 250);}
#perfil .foto .carregar .file input { position: absolute; width: 100%; height: 100%; top: 0; left: 0; z-index: 2; opacity: 0; font-size: 0;}
#perfil .foto .carregar .file:hover { background-color: rgb(0 170 100);}
#perfil .foto .remover { float: left; width: 100%;}
#perfil .foto .remover .submit { float: left; width: 100%; padding: 14px 0; outline: 1px solid rgb(90 90 90 / 40%); outline-offset: -1px; background-color: rgb(250 250 250); color: rgb(20 20 20);}
#perfil .foto .remover .submit:hover { background-color: rgb(240 240 240);}
#perfil .foto .alerta { margin: 11px 0 0;}

#atendimento .perguntas { margin: 0;}
#atendimento .perguntas .tab { float: left; width: 100%; padding: 15px 10px 0; margin: 2px 0; border: 1px solid rgb(90 90 90 / 50%);}
#atendimento .perguntas .tab .pergunta { float: left; width: 100%; font-weight: bold; font-size: 1.1em;}
#atendimento .perguntas .tab .resposta { float: left; width: 100%;}
#atendimento .mensagem { float: left; width: 100%; padding: 10px 0 8px; background-color: #a6957b; text-transform: uppercase; text-align: center; font-weight: bold; font-size: 1em; color: rgb(255 255 255) !important; line-height: 1;}
#atendimento .mensagem:hover { background-color: #937752;}
#atendimento .dialogos { float: left; width: 100%; position: relative;}
#atendimento .dialogos .listar { margin: 2px 0; -webkit-border-bottom-right-radius: 4px; -webkit-border-bottom-left-radius: 4px; -moz-border-radius-bottomright: 4px; -moz-border-radius-bottomleft: 4px; border-bottom-right-radius: 4px; border-bottom-left-radius: 4px;}
#atendimento .dialogos .tab { float: left; width: 100%; padding: 10px 0; border-top: 1px solid rgb(90 90 90 / 50%);}
#atendimento .dialogos .tab:hover { color: #937752 !important;}
#atendimento .faqs { float: left; width: 100%; position: relative;}
#atendimento .faqs .listar { margin: 2px 0; -webkit-border-bottom-right-radius: 4px; -webkit-border-bottom-left-radius: 4px; -moz-border-radius-bottomright: 4px; -moz-border-radius-bottomleft: 4px; border-bottom-right-radius: 4px; border-bottom-left-radius: 4px;}
#atendimento .faqs .categorias { float: left; width: 100%;}
#atendimento .faqs .categorias .um { float: left; padding: 5px 7px 4px; margin: 0 2px 2px 0; background-color: #3C4951; color: rgb(240 240 240); font-size: 0.9em; line-height: 1;}
#atendimento .faqs .categorias .um:hover { background-color: #937752;}
#atendimento .faqs .categorias .um.ativo { background-color: #937752;}
#atendimento .faqs .tab { float: left; width: 100%; margin: 2px 0; border: 1px solid rgb(90 90 90 / 50%);}
#atendimento .faqs .tab .pergunta { float: left; width: 100%; padding: 10px; margin: 0; outline: 0; font-weight: bold; font-size: 1.1em;}
#atendimento .faqs .tab .resposta { float: left; width: 100%; padding: 0 10px; border-top: 1px solid rgb(90 90 90 / 50%);}
#atendimento .chat { float: left; width: 100%; position: relative;}

#seguranca .fatores .tab { padding: 20px;}
#seguranca .fatores .nome { padding: 0 0 12px; margin: 0 0 12px; border-bottom: 1px solid rgb(90 90 90 / 30%);}
#seguranca .fatores .nome h2 { font-size: 1.2em;}
#seguranca .fatores .nome h3 { font-size: 1em;}
#seguranca .conectados .nome { padding: 0 0 12px; margin: 0 0 12px; border-bottom: 1px solid rgb(90 90 90 / 30%);}
#seguranca .conectados .nome h2 { font-size: 1.2em;}
#seguranca .conectados .nome h3 { font-size: 1em;}
#seguranca .conectados .dispositivos .item.i2 { margin: 0 0 0 10px;}
#seguranca .conectados .dispositivos .tab { align-items: center; overflow: hidden;}
#seguranca .conectados .mais { background-image: url('../imagens/mais.png?v3'); background-position:  50%; background-repeat: no-repeat;}
#seguranca .historico { float: left; width: 100%; position: relative;}
#seguranca .historico .listar { float: left; width: 100%; position: relative;}

#recompensaIndicacoes { float: left; width: 100%;}
#recompensaIndicacoes .passando { float: left; width: 100%; overflow: hidden; white-space: nowrap; padding: 10px 0; margin: 0 0 11px; outline: 1px solid rgb(90 90 90 / 50%); outline-offset: -1px;}
#recompensaIndicacoes .passando .vai { display: inline-block; animation: passando 200s linear infinite;}
#recompensaIndicacoes .passando .frase { padding: 0 15px; border-left: 2px solid rgb(90 90 90);}
#recompensaIndicacoes .resumo { float: left; width: 100%;}
#recompensaIndicacoes .resumo .ident { float: left; width: 100%; padding: 18px 0 14px; margin: 0 0 3px; text-transform: uppercase; text-align: center; font-weight: bold; font-size: 1em; line-height: 0; -webkit-border-top-left-radius: 4px; -webkit-border-top-right-radius: 4px; -moz-border-radius-topleft: 4px; -moz-border-radius-topright: 4px; border-top-left-radius: 4px; border-top-right-radius: 4px;}
#recompensaIndicacoes .resumo .saldo h2 { float: left; width: 100%; font-size: 1em; opacity: 0.8;}
#recompensaIndicacoes .resumo .saldo h3 { float: left; width: 100%; margin: 4px 0 0; font-weight: bold; font-size: 2em; line-height: 1;}
#recompensaIndicacoes .resumo .fundo { float: left; width: 100%; padding: 15px;}
#recompensaIndicacoes .resumo .fundo .numero { float: left; width: 50%;}
#recompensaIndicacoes .resumo .fundo .numero h2 { float: left; width: 100%; font-size: 0.9em; opacity: 0.8;}
#recompensaIndicacoes .resumo .fundo .numero h3 { float: left; width: 100%; font-weight: bold; font-size: 1.1em; overflow: hidden;}
#recompensaIndicacoes .resumo .fundo .copiaecola { float: left; width: 100%;}
#recompensaIndicacoes .resumo .fundo .copiaecola h2 { float: left; width: 100%; font-size: 0.9em; opacity: 0.8;}
#recompensaIndicacoes .resumo .fundo .copiaecola h3 { display: flex; float: left; width: 100%; font-size: 1em;}
#recompensaIndicacoes .resumo .fundo .copiaecola h3 b { float: left; max-width: 90%; margin: 2px 0 0; overflow: hidden; font-weight: normal;}
#recompensaIndicacoes .resumo .fundo .copiaecola h3 strong { float: left; width: 25px; height: 25px; margin: 0 0 0 5px; background-color: #937752; background-image: url('../imagens/neutro-copiaecola.png?v1'); background-position: 50%; background-repeat: no-repeat; font-size: 0;}
#recompensaIndicacoes .resumo .fundo .copiaecola h3 strong.ok { background-color: rgb(255 146 0 / 25%);}
#recompensaIndicacoes .indicados { float: left; width: 100%; position: relative;}
#recompensaIndicacoes .indicados .listar { margin: 2px 0; -webkit-border-bottom-right-radius: 4px; -webkit-border-bottom-left-radius: 4px; -moz-border-radius-bottomright: 4px; -moz-border-radius-bottomleft: 4px; border-bottom-right-radius: 4px; border-bottom-left-radius: 4px;}
#recompensaIndicacoes .indicados .tab { float: left; width: 100%; padding: 10px 0; border-top: 1px solid rgb(90 90 90 / 50%);}
#recompensaIndicacoes .historico { float: left; width: 100%; position: relative;}
#recompensaIndicacoes .historico .listar { margin: 2px 0; -webkit-border-bottom-right-radius: 4px; -webkit-border-bottom-left-radius: 4px; -moz-border-radius-bottomright: 4px; -moz-border-radius-bottomleft: 4px; border-bottom-right-radius: 4px; border-bottom-left-radius: 4px;}
#recompensaIndicacoes .historico .tab { float: left; width: 100%; border-top: 1px solid rgb(90 90 90 / 50%);}
#recompensaIndicacoes .historico .tab .res { float: left; width: 100%; padding: 10px 0;}
#recompensaIndicacoes .historico .tab .det { float: left; width: 100%; margin: -7px 0 10px; font-size: 0.9em; opacity: 0.8;}
#recompensaIndicacoes .atividades { float: left; width: 100%; position: relative;}
#recompensaIndicacoes .atividades .listar { margin: 2px 0; -webkit-border-bottom-right-radius: 4px; -webkit-border-bottom-left-radius: 4px; -moz-border-radius-bottomright: 4px; -moz-border-radius-bottomleft: 4px; border-bottom-right-radius: 4px; border-bottom-left-radius: 4px;}
#recompensaIndicacoes .atividades .tipo { float: left; width: 100%;}
#recompensaIndicacoes .atividades .tipo .um { float: left; padding: 5px 7px 4px; margin: 0 2px 2px 0; background-color: #3C4951; color: rgb(240 240 240); font-size: 0.9em; line-height: 1;}
#recompensaIndicacoes .atividades .tipo .um:hover { background-color: #937752;}
#recompensaIndicacoes .atividades .tipo .um.ativo { background-color: #937752;}
#recompensaIndicacoes .atividades .nivel { float: left; width: 100%; margin: 5px 0;}
#recompensaIndicacoes .atividades .nivel .um { float: left; padding: 3px 7px 2px; margin: 0 2px 2px 0; background-color: rgb(90 90 90 / 20%); font-size: 0.9em; line-height: 1;}
#recompensaIndicacoes .atividades .nivel .um:hover { background-color: rgb(90 90 90 / 40%);}
#recompensaIndicacoes .atividades .nivel .um.ativo { background-color: rgb(90 90 90 / 40%);}
#recompensaIndicacoes .atividades .tab { float: left; width: 100%; border-top: 1px solid rgb(90 90 90 / 50%);}
#recompensaIndicacoes .atividades .tab .res { float: left; width: 100%; padding: 10px 0;}
#recompensaIndicacoes .atividades .tab .det { float: left; width: 100%; margin: -7px 0 10px; opacity: 0.8;}
#recompensaIndicacoes .atividades .tab .det h2 { float: left; width: 100%; font-size: 0.9em;}

#recompensaRanks { float: left; width: 100%;}
#recompensaRanks .comunidade .nomesi { display: flex; justify-content: center; flex-direction: column; min-height: 80px; padding: 10px 110px 10px 40px;}
#recompensaRanks .comunidade .nomesi b { font-size: 1.1em;}
#recompensaRanks .comunidade .nomesi em { font-style: normal; font-size: 0.9em;}
#recompensaRanks .comunidade .todos { width: 30px; height: 30px; top: 50%; left: 0; margin: -15px 0 0; background-image: url('../imagens/neutro-calendario.png?v2'); background-position: 50%; background-repeat: no-repeat;}
#recompensaRanks .comunidade .infor { width: 100px; top: 0; right: 0; font-size: 0.8em; line-height: 1.1;}
#recompensaRanks .comunidade .infor .terminaem { padding: 2px 0 0; outline: 1px solid rgb(90 90 90 / 50%);}
#recompensaRanks .comunidade .infor .count { padding: 2px 0 0; margin: 3px 0 0; outline: 1px solid rgb(90 90 90 / 50%); outline-offset: -1px;}

#recompensaRanks .premiacao { background-color: #272e34;}
#recompensaRanks .premiacao .pel strong { width: 30px; height: 30px; top: 50%; right: 5px; margin: -15px 0 0; background-position: 50%; background-repeat: no-repeat;}
#recompensaRanks .premiacao .pel.abrir strong { background-image: url('../imagens/rank-premiacao-mais.png?v1');}
#recompensaRanks .premiacao .pel.fechar strong { background-image: url('../imagens/rank-premiacao-menos.png?v1');}
#recompensaRanks .premiacao .cto { padding: 0 10px 5px;}
#recompensaRanks .premiacao .destraves .meio { flex-wrap: wrap;}
#recompensaRanks .premiacao .destraves .meio .posicao { float: left; width: 50%; margin: 2px 0;}
#recompensaRanks .premiacao .destraves .meio .posicao .numero { font-size: 1.2em; color: rgb(255 255 255);}
#recompensaRanks .premiacao .destraves .meio .posicao .numero.podio { padding: 0 0 0 40px;}
#recompensaRanks .premiacao .destraves .meio .posicao .numero.podio b { display: flex; justify-content: center; align-items: center; width: 40px; height: 100%; top: 0; left: 0; background-color: rgb(194 152 14);}
#recompensaRanks .premiacao .destraves .meio .posicao .numero.podio strong { padding: 10px 0;}
#recompensaRanks .premiacao .destraves .meio .posicao .numero.no-podio strong { padding: 10px 0;}
#recompensaRanks .premiacao .destraves .meio .posicao .premios { display: flex; align-items: center;}
#recompensaRanks .premiacao .destraves .meio .posicao .usdt { width: 100%; height: 40px;}
#recompensaRanks .premiacao .destraves .meio .posicao .premio { justify-content: center; align-items: center; flex-direction: column; float: left;}
#recompensaRanks .premiacao .destraves .meio .posicao .premio .valor { align-items: center; justify-content: flex-end; font-size: 1.4em;}
#recompensaRanks .premiacao .destraves .meio .posicao .premio .valor span { margin: 0 5px 0 0;}
#recompensaRanks .premiacao .destraves .meio .posicao .premio .valor b { margin: 0 0 0 8px;}
#recompensaRanks .premiacao .destraves .meio .posicao .premio .img { font-size: 0;}
#recompensaRanks .premiacao .destraves .meio .posicao .premio .img img { width: 100%;}
#recompensaRanks .premiacao .destraves .meio .posicao .premio .nome { margin: 4px 0 0; font-weight: bold; font-size: 0.55em; font-style: italic;}
#recompensaRanks .premiacao .destraves .meio .posicao .mais { justify-content: center; align-items: center; float: left; width: 20px; height: 80px;}
#recompensaRanks .premiacao .destraves .meio .bor { min-height: 45px; outline: 1px solid rgb(90 90 90 / 50%); outline-offset: -1px;}
#recompensaRanks .premiacao .destraves .meio .bor.ml { margin: 0 0 0 5px;}
#recompensaRanks .premiacao .destraves .baixo { background-color: rgb(5 5 5 / 20%);}
#recompensaRanks .premiacao .destraves .baixo .nomesi { padding: 0 60px 0 0;}
#recompensaRanks .premiacao .destraves .baixo .setas { top: 50%; right: 5px; margin: -12px 0 0;}
#recompensaRanks .premiacao .destraves .baixo .seta { float: left; width: 24px; height: 24px;}
#recompensaRanks .premiacao .destraves .baixo .seta.recuar { background-image: url('../imagens/neutro-setinha-pe.png'); background-position: 50%; background-repeat: no-repeat;}
#recompensaRanks .premiacao .destraves .baixo .seta.avancar { margin: 0 0 0 3px; background-image: url('../imagens/neutro-setinha-pd.png'); background-position: 50%; background-repeat: no-repeat;}
#recompensaRanks .premiacao .padrao { padding: 10px 7.5px; background-color: rgb(5 5 5 / 40%);}
#recompensaRanks .premiacao .padrao .item { margin: 0 2.5px;}
#recompensaRanks .premiacao .padrao .item.ot { padding: 5px;}
#recompensaRanks .premiacao .padrao .podio { flex-wrap: wrap; align-content: center;}
#recompensaRanks .premiacao .padrao .podio .numero { font-size: 1.5em; color:#a6957b;}
#recompensaRanks .premiacao .padrao .podio .quem { font-size: 0.9em; opacity: 0.7;}
#recompensaRanks .premiacao .padrao .podio .img img { max-width: 90%;}
#recompensaRanks .premiacao .padrao .podio .valor { justify-content: center; align-items: center;}
#recompensaRanks .premiacao .padrao .outras .numero { flex: 0.2; align-items: center; font-size: 1.5em; color:#a6957b;}
#recompensaRanks .premiacao .padrao .outras .valor { flex: 1; justify-content: center; align-items: center;}
#recompensaRanks .premiacao .padrao .outras .valor .mbi { font-size: 0.9em;}
#recompensaRanks .premiacao .padrao .dki { display: block;}
#recompensaRanks .premiacao .padrao .mbi { display: none;}

@media only screen and (max-width: 600px){
  #recompensaRanks .premiacao .padrao .item.ot { padding: 2px;}
  #recompensaRanks .premiacao .padrao .podio { padding: 2px !important;}
  #recompensaRanks .premiacao .padrao .podio .valor { font-size: 0.9em;}
  #recompensaRanks .premiacao .padrao .outras .numero { font-size: 1em;}
  #recompensaRanks .premiacao .padrao .dki { display: none;}
  #recompensaRanks .premiacao .padrao .mbi { display: block;}
}

#recompensaRanks .rankeamento .tipo .escolha { padding: 0 92px;line-height: 1;}
#recompensaRanks .rankeamento .tipo .indicacao { top: 50%; left: 0; margin: -10px 0 0;}
#recompensaRanks .rankeamento .tipo .contratos { top: 50%; right: 0; margin: -10px 0 0;}

#recompensaRanks .rankeamento .tipo .radio input[type="radio"] { appearance: none; -webkit-appearance: none; -moz-appearance: none; position: absolute; opacity: 0; pointer-events: none;}
#recompensaRanks .rankeamento .tipo .radio input[type="radio"]:checked + .custom-radio { background-color: #000000;}
#recompensaRanks .rankeamento .tipo .radio label { display: flex; align-items: center; gap: 5px; cursor: pointer;}
#recompensaRanks .rankeamento .tipo .radio label .custom-radio { display: inline-block; width: 7px; height: 7px; border: 5px solid #CCCCCC; border-radius: 50%; background-color: white; position: relative; cursor: pointer;}

#recompensaRanks .rankeamento .tipo .nomesi { margin: 8px 0 0; background-color: rgb(90 90 90 / 10%); outline: 1px solid rgb(90 90 90 / 50%);}
#recompensaRanks .rankeamento .tipo .nomesi b { padding: 8px 40px;}
#recompensaRanks .rankeamento .tipo .seta { width: 24px; height: 24px; top: 50%; margin: -12px 0 0;}
#recompensaRanks .rankeamento .tipo .seta.recuar { left: 5px; background-image: url('../imagens/neutro-setinha-pe.png'); background-position: 50%; background-repeat: no-repeat;}
#recompensaRanks .rankeamento .tipo .seta.avancar { right: 5px; background-image: url('../imagens/neutro-setinha-pd.png'); background-position: 50%; background-repeat: no-repeat;}

#recompensaRanks .rankeamento .explique .um { flex: 0.2;}
#recompensaRanks .rankeamento .explique .dois { flex: 1;}
#recompensaRanks .rankeamento .explique .tres { flex: 0.2;}
#recompensaRanks .rankeamento .posicao { margin: 5px 0;}
#recompensaRanks .rankeamento .posicao .nun { width: 50px; top: 0; left: 0; padding: 30px 0; line-height: 0; font-size: 1.2em;}
#recompensaRanks .rankeamento .posicao .detalhes { padding: 0 0 0 55px;}
#recompensaRanks .rankeamento .posicao .detalhes .us { align-items: center; flex: 1; padding: 10px 0 10px 10px;}
#recompensaRanks .rankeamento .posicao .detalhes .us .foto { float: left; width: 40px; height: 40px; font-size: 0; overflow: hidden;}
#recompensaRanks .rankeamento .posicao .detalhes .us .foto img { height: 40px;}
#recompensaRanks .rankeamento .posicao .detalhes .us .nome { float: left; margin: 0 0 0 5px;}
#recompensaRanks .rankeamento .posicao .detalhes .qtd { justify-content: center; align-items: center; width: 85px;}
#recompensaRanks .rankeamento .posicao .detalhes .qtd b { padding: 0 5px;}

#recompensaRanks .rankeamento .posicao.p1 .nun { background-color: #b08854; color: #dbdbdb;}
#recompensaRanks .rankeamento .posicao.p2 .nun { background-color: #dbdbdb; color: #3c4851;}
#recompensaRanks .rankeamento .posicao.p3 .nun { background-color: #a6957b; color: #dbdbdb;}
#recompensaRanks .rankeamento .posicao.outros .nun { outline: 1px solid rgb(90 90 90); outline-offset: -1px;}
#recompensaRanks .rankeamento .posicao.p1 .bd { outline: 1px solid #b08854; outline-offset: -1px;}
#recompensaRanks .rankeamento .posicao.p2 .bd { outline: 1px solid #dbdbdb; outline-offset: -1px;}
#recompensaRanks .rankeamento .posicao.p3 .bd { outline: 1px solid #a6957b; outline-offset: -1px;}
#recompensaRanks .rankeamento .posicao.outros .bd { outline: 1px solid rgb(90 90 90); outline-offset: -1px;}
#recompensaRanks .rankeamento .posicao.p1 .qtd { background-color: #b08854; color: #dbdbdb;}
#recompensaRanks .rankeamento .posicao.p2 .qtd { background-color: #dbdbdb; color: #3c4851;}
#recompensaRanks .rankeamento .posicao.p3 .qtd { background-color: #a6957b; color: #dbdbdb;}
#recompensaRanks .rankeamento .posicao.outros .qtd { outline: 1px solid rgb(90 90 90); outline-offset: -1px;}

#recompensaRanks .todos .tab { margin: 2px 0; outline: 1px solid rgb(90 90 90 / 50%); outline-offset: -1px;}
#recompensaRanks .todos .tab .descricao { padding: 0 70px 0 0;}
#recompensaRanks .todos .tab .descricao b { font-size: 1.1em;}
#recompensaRanks .todos .tab .descricao em { font-style: normal; font-size: 0.9em;}
#recompensaRanks .todos .tab .entrar { top: 50%; right: 10px; padding: 15px 10px; margin: -15px 0 0; background-color: rgb(96 181 81); color: rgb(250 250 250) !important; line-height: 0;}
#recompensaRanks .todos .tab .entrar:hover { background-color: rgb(78 156 64);}



#vips .titulo { float: left; width: 100%;}
#vips .titulo h2 { float: left; width: 100%; text-transform: uppercase; text-align: center; font-weight: bold; font-size: 1.5em;}
#vips .titulo h3 { float: left; width: 100%; text-align: center; font-size: 1.1em;}
#vips .periodo { display: flex; justify-content: center; float: left; width: 100%; margin: 0 0 11px;}
#vips .periodo .ct { display: flex; padding: 8px; background-color: rgb(90 90 90 / 20%); outline: 2px solid rgb(90 90 90 / 40%);}
#vips .periodo .ct a { padding: 5px 10px; margin: 0 2px;}
#vips .periodo .ct a.ativo { background-color: rgb(90 90 90 / 20%); outline: 1px solid rgb(90 90 90 / 40%);}
#vips .periodo .ct a:hover { background-color: rgb(90 90 90 / 20%); outline: 1px solid rgb(90 90 90 / 40%);}
#vips .iniciadas { float: left; width: 100%; padding: 0 2px;}
#vips .iniciadas .tab { position: relative; padding: 10px 55px 10px 10px; margin: 2px 0;}
#vips .iniciadas .tab span { float: left;}
#vips .iniciadas .tab a { position: absolute; top: 50%; right: 7px; padding: 11px 7px 9px 7px; margin: -10px 0 0; line-height: 0; background-color: rgb(37 131 79); font-weight: bold; font-size: 0.8em; color: rgb(255 255 255) !important;}
#vips .iniciadas .tab a:hover { background-color: rgb(28 105 63);}
#vips .opcoes { display: flex; justify-content: space-between; align-items: stretch; float: left; width: 100%;}
#vips .opcoes .tab { display: flex; width: 100%; margin: 0 2px;}
#vips .opcoes .tab .nome { float: left; width: 100%; text-align: center; font-weight: bold; font-size: 1.5em;}
#vips .opcoes .tab .valor { float: left; width: 100%; margin: 5px 0 0; text-align: center}
#vips .opcoes .tab .descricao { float: left; width: 100%; margin: 5px 0 0; text-align: center;}
#vips .opcoes .tab .beneficios { float: left; width: 100%; margin: 7px 0 0; text-align: center}
#vips .opcoes .tab .beneficios h2 { float: left; width: 100%; padding: 5px; margin: 1px 0; background-color: rgb(70 160 180 / 20%); font-size: 1em;}
#vips .opcoes .tab .contratar { float: left; width: 100%; padding: 10px; margin: 10px 0 0; background-color: rgb(136 228 205);text-transform: uppercase; text-align: center; font-weight: bold; font-size: 1em; color: rgb(5 5 5) !important;}
#vips .opcoes .tab .contratar.bronze { background-color: rgb(217, 164, 112);}
#vips .opcoes .tab .contratar.prata { background-color: rgb(192, 192, 192);}
#vips .opcoes .tab .contratar.ouro { background-color: rgb(255, 215, 0);}
#vips .opcoes .tab .contratar.bronze:hover { background-color: rgb(216, 156, 96);}
#vips .opcoes .tab .contratar.prata:hover { background-color: rgb(169, 169, 169);}
#vips .opcoes .tab .contratar.ouro:hover { background-color: rgb(204, 172, 0);}
#vips .opcoes .tab .contratar:hover { background-color: rgb(101 211 183);}
#vips .contratando { float: left; width: 100%;}
#vips .contratando .pagamento { float: left; width: 100%; margin: 11px 0 0;}
#vips .contratando .pagamento .tab { float: left; width: 100%; margin: 11px 0 0; outline: 1px solid rgb(90 90 90 / 30%); position: relative; overflow: hidden;}
#vips .contratando .pagamento .tab .nun { position: absolute; width: 40px; top: 20px; left: 10px; padding: 20px 0; outline: 1px solid rgb(90 90 90 / 30%); background-color: rgb(90 90 90 / 20%); text-align: center; font-weight: bold; font-style: normal; opacity: 0.8; line-height: 0;}
#vips .contratando .pagamento .tab .inf { float: left; width: 100%; padding: 17px 10px 17px 60px;}
#vips .contratando .pagamento .tab .leia { float: left; width: 100%; padding: 2px 0; font-weight: normal;}
#vips .contratando .pagamento .tab .leia i { font-style: normal; opacity: 0.8;}
#vips .contratando .pagamento .tab .como { float: left; width: 100%; margin: 21px 0;}
#vips .contratando .pagamento .tab .como .co1 { float: left; width: 100%; color: rgb(11 142 175);}
#vips .contratando .pagamento .tab .como .co1:hover { text-decoration: underline;}
#vips .contratando .pagamento .tab .como .co2 { float: left; width: 100%; margin: 2px 0 0; background-color: rgb(90 90 90 / 10%); outline: 1px solid rgb(90 90 90 / 20%); outline-offset: -1px;}
#vips .contratando .pagamento .tab .como .co2 b { float: left; width: 100%; font-weight: normal; font-size: 1.1em;}
#vips .contratando .pagamento .tab .como .co2 cor { padding: 2px 8px 0; background-color: rgb(233 255 91); font-weight: bold; color: rgb(5 5 5);}
#vips .contratando .pagamento .tab .como .co2 em { float: left; width: 100%; padding: 2px 10px;}
#vips .contratando .pagamento .tab .como .co2 i { float: left; width: 100%; padding: 15px; text-align: center; font-style: normal; font-size: 0.9em;}
#vips .contratando .pagamento .tab .como .agrupa { float: left; width: 100%; padding: 15px; border-bottom: 1px solid rgb(90 90 90 / 40%);}
#vips .contratando .pagamento .tab .formas { float: left; width: 100%; padding: 10px; outline: 1px solid rgb(90 90 90); font-size: 1em; color: rgb(5 5 5);}
#vips .contratando .pagamento .tab .ativos { display: flex; justify-content: space-between; float: left; width: 100%; margin: 5px 0 0;}
#vips .contratando .pagamento .tab .ativos .atv { width: 100%; padding: 10px 0; margin: 0 1px; background-color: rgb(250 250 250); text-align: center; font-weight: bold; color: rgb(5 5 5);}
#vips .contratando .pagamento .tab .ativos .atv.ativo { background-color: rgb(113 131 212) !important; color: rgb(250 250 250);}
#vips .contratando .pagamento .tab .ativos .atv:hover { background-color: rgb(90 90 90); color: rgb(250 250 250);}
#vips .contratando .pagamento .tab .valor { float: left; width: 100%; padding: 11px 0; margin: 21px 0 11px; background-color: rgb(90 90 90 / 10%); outline: 1px solid rgb(90 90 90 / 20%); outline-offset: -1px;}
#vips .contratando .pagamento .tab .valor em { float: left; width: 100%; text-align: center; font-style: normal; font-size: 0.9em;}
#vips .contratando .pagamento .tab .valor b { float: left; width: 100%; margin: 5px 0 0; text-align: center; font-size: 1.1em;}
#vips .contratando .pagamento .tab .valor b i { font-weight: normal; font-style: normal; font-size: 0.9em;}
#vips .contratando .pagamento .tab .copiaecola { float: left; width: 100%;}
#vips .contratando .pagamento .tab .copiaecola .etr { float: left; width: 100%;}
#vips .contratando .pagamento .tab .copiaecola .cntd { float: left; width: 100%; height: 40px; outline: 1px solid rgb(90 90 90 / 20%); text-align: center; font-weight: bold; font-size: 1.2em;}
#vips .contratando .pagamento .tab .copiaecola .copiar { float: left; width: 100%; margin: 11px 0 0; text-align: center;}
#vips .contratando .pagamento .tab .copiaecola .copiar:hover { color: rgb(11 142 175);}
#vips .contratando .form { float: left; width: 100%;}
#vips .contratando .form .c1 { float: left; width: 100%; margin: 11px 0 0;}
#vips .contratando .form .nomecampo { float: left; width: 100%; margin: 0 0 2px;}
#vips .contratando .form .nomecampo em { font-style: normal; color: rgb(200 0 0);}
#vips .contratando .form .campo { float: left; width: 100%; height: 50px; padding: 0 10px; outline: 1px solid rgb(90 90 90 / 50%); color: rgb(5 5 5);}
#vips .contratando .form .campo:focus { outline: 1px solid rgb(120 163 219); -webkit-box-shadow: 0 0 15px 0 rgb(0 0 0 / 20%); -moz-box-shadow: 0 0 15px 0 rgb(0 0 0 / 20%); box-shadow: 0 0 15px 0 rgb(0 0 0 / 20%);}
#vips .contratando .form .file { float: left; width: 100%;}
#vips .contratando .form .enviar { float: left; width: 100%;}
#vips .contratando .form .enviar .submit { padding: 8px 18px; background-color: rgb(37 131 79); text-transform: uppercase; font-weight: bold; font-size: 1em; color: rgb(250 250 250); cursor: pointer;}
#vips .contratando .form .enviar .submit:hover { background-color: rgb(28 105 63);}

#bloqueio { float: left; width: 100%; margin: 51px 0;}
#bloqueio .contdo { float: left; width: 100%; padding: 51px 15px 21px; position: relative;}
#bloqueio .logo { position: absolute; width: 100px; height: 100px; top: 0; left: 50%; margin: -50px 0 0 -50px;}
#bloqueio .mensagem { float: left; width: 100%; text-align: center;}
#bloqueio .embreve { float: left; width: 100%; padding: 10px 0; margin: 11px 0 21px; background-color: rgb(15, 35, 51); text-transform: uppercase; text-align: center; font-weight: bold; color: rgb(255 255 255);}
#bloqueio .infor { float: left; width: 100%; text-align: center;}
#bloqueio .sociais { float: left; width: 100%; margin: 21px 0 0;}
#bloqueio .sociais .um { float: left; width: 100%; padding: 5px 0; margin: 3px 0; outline: 1px solid rgb(90 90 90 / 20%); text-align: center; color: rgb(90 90 90);}
#bloqueio .sociais .um:hover { background-color: rgb(90 90 90 / 20%); }

@media only screen and (max-width: 1200px){
  #dashboard .mundi .numeros .valores .lado2 { width: 310px; margin-left: 15px;}
  #dashboard .mundi .numeros .atalhos .lado2 { width: 310px; margin-left: 15px;}
}
@media only screen and (max-width: 1000px){
  #dashboard .mundi .numeros .valores .lado2 { width: 100%; margin-top: 2px; margin-left: 0;}
  #dashboard .mundi .numeros .atalhos .lado2 { width: 100%; margin-top: 2px; margin-left: 0;}
}
@media only screen and (max-width: 800px){
  #dashboard .mundi .numeros .valores .nun .total { font-size: 1.5em;}
  #dashboard .mundi .numeros .valores .nun .usdt { font-size: 1.2em;}
}
@media only screen and (max-width: 800px){
  #vips .iniciadas { padding: 0;}
  #vips .opcoes { display: block;}
  #vips .opcoes .tab { width: 100%; margin: 0;}
}
@media only screen and (max-width: 700px){
  #recompensaRanks .rankeamento .tipo .indicacao { font-size: 0.9em;}
  #recompensaRanks .rankeamento .tipo .contratos { font-size: 0.9em;}
  #recompensaRanks .rankeamento .tipo .escolha { font-size: 0.9em;}

  #recompensaRanks .premiacao .cto { padding: 0 5px 5px;}
  #recompensaRanks .premiacao .destraves .meio .posicao .numero { font-size: 0.7em;}

  #recompensaRanks .premiacao .destraves .meio .posicao .premio .valor img { height: 28px;}
}
@media only screen and (max-width: 500px){
  #seguranca .conectados .dispositivos { flex-direction: column;}
  #seguranca .conectados .dispositivos .item.i2 { margin: 5px 0 0;}
}

@keyframes passando {
  from {
    transform: translateX(100px); /* Começa fora da tela na direita */
  }
  to {
    transform: translateX(-100%); /* Termina fora da tela na esquerda */
  }
}