@import url('https://fonts.googleapis.com/css2?family=Inter:wght@100;200;300;400;500;600;700;800;900&display=swap'); :root { /* --bs-primary: #3a57e8; */ --bs-primary: #3E5F9E; } html { width: 100%; height: 100%; overflow: hidden; } body { font-family: 'Inter', sans-serif; width: 100%; height: 100%; -webkit-touch-callout: none; -webkit-user-select: none; -khtml-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; overflow-block: hidden; overflow: hidden; /* background-repeat: no-repeat; background-image: url(https://media.discordapp.net/attachments/1157069784446414898/1174200092836774029/image.png); background-size: cover; background-position: center; */ display: none; } body::after { position: absolute; content: ''; top: 0; left: 0; z-index: -1; width: 100%; height: 100%; background: rgb(0,0,0); background: radial-gradient(circle, rgba(0,0,0,0.1825105042016807) 0%, rgba(35, 38, 53, 0.8) 100%); } ::-webkit-scrollbar{ width: 3px; height: 1px; border-radius: 10px; background: #ECECEC; } ::-webkit-scrollbar-thumb{ background: #c4c3c3; border-radius: 10px; transition: all 1s; } ::-webkit-scrollbar-thumb:hover{ background: #9c9c9c; } ::-webkit-scrollbar-track{ background: transparent; } .overflow-verperfil::-webkit-scrollbar{ display: none; } .container{ width: 1200px; height: 750px; position: absolute; left: 0; top: 0; bottom: 0; right: 0; margin: auto; background: #ECECEC; border-radius: 20px; animation-name: zoomIn; -webkit-animation-duration: 1s; animation-duration: 1s; } /* -------------------------------------- -- Lado (Menu) -------------------------------------- */ .container .lado{ width: 20%; height: 100%; position: absolute; top: 0; left: 0; background: white; border-radius: 20px 0px 0px 20px; } .container .lado .logo-painel{ width: 200px; display: block; margin-left: auto; margin-right: auto; margin-top: 10%; } .container .lado .categoria{ font-size: 14px; margin-left: 5%; margin-top: 5%; font-family: 'Inter', sans-serif; } .container .lado .categoria i{ margin-left: 2%; } .container .lado .botao-lado{ width: 90%; height: 45px; background: transparent; border-radius: 10px; margin-left: 5%; margin-top: 2%; outline: 1px solid transparent; border: 0; text-align: left; font-size: 22px; color: #66728C; font-family: 'Inter', sans-serif; transition: all .5s ease-in; } .container .lado .botao-lado:hover{ background: #3E5F9E; outline: 2px solid #3E5F9E20; background-image: url(assets/fundo.png); background-size: cover; color: #fff; } .container .lado .botao-lado .iconePrimeiro { font-size: 20px; margin-left: 10%; } .container .lado .botao-lado .iconeSegundo { position: absolute; left: 85%; margin-top: 2.5%; font-size: 14px; } .container .lado .botao-lado ss{ font-size: 16px; position: relative; top: -4.5%; left: 5%; font-style: normal; font-weight: 600; letter-spacing: 0.5px; font-family: 'Inter', sans-serif; } .container .lado .botao-lado.active{ background: var(--bs-primary); outline: 2px solid #3E5F9E20; background-image: url(assets/fundo.png); background-size: cover; color: #fff; } .container .lado .carg-box{ position: absolute; width: 90%; height: 200px; margin-left: 5%; bottom: 2%; } .container .lado .cargo-painel{ width: 100%; } .container .lado .cargo-usuario{ font-family: 'Inter', sans-serif; letter-spacing: 0.5px; font-style: normal; font-weight: 600; text-align: center; margin-top: -17%; color: #fff; } /* -------------------------------------- -- Meio (Geral) -------------------------------------- */ .container .meio{ width: 80%; height: 100%; position: absolute; top: 0; left: 20%; animation-name: zoomIn; -webkit-animation-duration: 1s; animation-duration: 1s; } .container .meio .text-pagina1{ font-family: 'Inter'; font-style: normal; font-size: 14px; color: #999999; margin-left: 3%; margin-top: 3%; } .container .meio.text-pagina1 .iconetextPagina{ font-size: 12px; } .container .meio .text-pagina2{ font-family: 'Inter'; font-style: normal; font-weight: 700; font-size: 30px; color: #353535; margin-left: 3%; } .container .meio .box-usuario{ position: absolute; width: 250px; height: 40px; top: 5%; left: 70.5%; display: flex; line-height: 40px; justify-content: right; } .container .meio .nome-personagem{ font-family: 'Inter'; font-style: normal; font-weight: 700; } .container .meio .imagem-personagem{ min-width: 40px; max-width: 40px; min-height: 40px; max-height: 40px; border-radius: 10px; margin-left: 5%; object-fit: cover; } .container .meio .pulse-personagem{ width: 10px; height: 10px; border-radius: 10px; position: relative; left: -5.5%; top: 68%; background: rgb(67, 243, 23); box-shadow: 0 0 0 rgba(67, 243, 23, 0.4); animation: pulse 2s infinite; } @-webkit-keyframes pulse { 0% { -webkit-box-shadow: 0 0 0 0 rgba(67, 243, 23, 0.4); } 70% { -webkit-box-shadow: 0 0 0 10px rgba(204,169,44, 0); } 100% { -webkit-box-shadow: 0 0 0 0 rgba(204,169,44, 0); } } @keyframes pulse { 0% { -moz-box-shadow: 0 0 0 0 rgba(67, 243, 23, 0.4); box-shadow: 0 0 0 0 rgba(67, 243, 23, 0.4); } 70% { -moz-box-shadow: 0 0 0 10px rgba(204,169,44, 0); box-shadow: 0 0 0 10px rgba(204,169,44, 0); } 100% { -moz-box-shadow: 0 0 0 0 rgba(204,169,44, 0); box-shadow: 0 0 0 0 rgba(204,169,44, 0); } } @-webkit-keyframes pulse-on { 0% { -webkit-box-shadow: 0 0 0 0 rgba(67, 243, 23, 0.4); } 70% { -webkit-box-shadow: 0 0 0 10px rgba(204,169,44, 0); } 100% { -webkit-box-shadow: 0 0 0 0 rgba(204,169,44, 0); } } @keyframes pulse-on { 0% { -moz-box-shadow: 0 0 0 0 rgba(67, 243, 23, 0.4); box-shadow: 0 0 0 0 rgba(67, 243, 23, 0.4); } 70% { -moz-box-shadow: 0 0 0 10px rgba(204,169,44, 0); box-shadow: 0 0 0 10px rgba(204,169,44, 0); } 100% { -moz-box-shadow: 0 0 0 0 rgba(204,169,44, 0); box-shadow: 0 0 0 0 rgba(204,169,44, 0); } } @-webkit-keyframes pulse-off { 0% { -webkit-box-shadow: 0 0 0 0 rgba(255, 86, 86, 0.4); } 70% { -webkit-box-shadow: 0 0 0 10px rgba(255, 86, 86, 0); } 100% { -webkit-box-shadow: 0 0 0 0 rgba(255, 86, 86, 0); } } @keyframes pulse-off { 0% { -moz-box-shadow: 0 0 0 0 rgba(255, 86, 86, 0.4); box-shadow: 0 0 0 0 rgba(255, 86, 86, 0.4); } 70% { -moz-box-shadow: 0 0 0 10px rgba(255, 86, 86, 0); box-shadow: 0 0 0 10px rgba(255, 86, 86, 0); } 100% { -moz-box-shadow: 0 0 0 0 rgba(255, 86, 86, 0); box-shadow: 0 0 0 0 rgba(255, 86, 86, 0); } } /* -------------------------------------- -- Meio (Pagiona Inicio) -------------------------------------- */ .pagina-dashboard .box-mensagem{ width: 70%; height: 25%; border-radius: 10px; margin-left: 3%; margin-top: 2%; background: white; } .pagina-dashboard .ola-mensagem{ position: relative; font-family: 'Inter'; font-style: normal; font-weight: 700; font-size: 24px; top: 15%; left: 5%; color: var(--bs-primary); } .pagina-dashboard .wave { font-size: 22px; animation-name: wave-animation; animation-duration: 2.5s; animation-iteration-count: infinite; transform-origin: 70% 70%; display: inline-block; margin-right: 1%; } @keyframes wave-animation { 0% { transform: rotate( 0.0deg) } 10% { transform: rotate(14.0deg) } 20% { transform: rotate(-8.0deg) } 30% { transform: rotate(14.0deg) } 40% { transform: rotate(-4.0deg) } 50% { transform: rotate(10.0deg) } 60% { transform: rotate( 0.0deg) } 100% { transform: rotate( 0.0deg) } } .pagina-dashboard .box-mensagem2{ width: 60%; margin-top: 6%; margin-left: 5%; font-family: 'Inter'; font-style: normal; font-weight: 500; font-size: 13px; color: #999999; } .pagina-dashboard .box-botao{ width: 200px; height: 45px; margin-top: 1%; margin-left: 5%; text-align: center; transition: all 1s ease; } .pagina-dashboard .box-botao:hover{ transform: scale(1.05); } .pagina-dashboard .box-botao img{ width: 100%; height: 100%; } .pagina-dashboard .box-quantidade-players{ margin-top: -16%; font-family: 'Inter'; font-style: normal; font-weight: 500; font-size: 15px; color: #FFFFFF; } .pagina-dashboard .box-svg{ width: 170px; margin-top: -18.5%; margin-left: 72%; } .pagina-dashboard .box-contadores{ width: 70%; height: 16%; margin-left: 3%; margin-top: 1%; } .pagina-dashboard .item-contador{ width: 32.8%; height: 100%; border-radius: 10px; background: white; display: inline-block; } .pagina-dashboard .item-contador img{ width: 60px; height: 60px; margin-top: 15%; margin-left: 5%; } .pagina-dashboard .item-contador .text-contador{ font-family: 'Inter'; font-style: normal; font-weight: 600; font-size: 14px; line-height: 16px; color: #999999; margin-top: -23%; margin-left: 38%; } .pagina-dashboard .item-contador .text2-contador{ font-family: 'Inter'; font-style: normal; font-weight: 700; font-size: 24px; line-height: 16px; color: #353535; margin-top: 3%; margin-left: 38%; } .pagina-dashboard .item-contador span{ color: var(--bs-primary); } .pagina-dashboard .grafico{ width: 70%; height: 40%; margin-top: 1%; margin-left: 3%; border-radius: 10px; background: white; } .pagina-dashboard .grafico .text-grafico{ font-family: 'Inter'; font-style: normal; font-weight: 700; font-size: 24px; line-height: 16px; left: 5%; top: 5%; position: relative; } .pagina-dashboard .grafico .text2-grafico{ font-family: 'Inter'; font-style: normal; font-weight: 500; font-size: 12px; line-height: 16px; margin-left: 5%; margin-top: 3%; color: #999999; } .pagina-dashboard .grafico .text3-grafico{ font-family: 'Inter'; font-style: normal; font-weight: 500; text-align: center; font-size: 14px; line-height: 16px; position: relative; margin-top: 15%; } .pagina-dashboard .grafico #myChart{ max-height: 75%; margin-top: 2%; margin-left: 5%; } canvas { background-color: transparent; } .box-grafico-cores{ width: 22%; height: 65%; margin-top: -33%; margin-left: 75%; } .box-grafico-cores img{ width: 150px; height: 30px; margin-top: 2%; } .box-teleports{ width: 21.5%; border-radius: 10px; height: 50%; background: white; position: absolute; top: 13.5%; left: 74%; } .text-teleports{ font-style: normal; font-family: 'Inter'; font-weight: 700; font-size: 18px; line-height: 23px; color: #353535; margin-left: 5%; position: relative; top: 4%; } .text2-teleports{ font-style: normal; font-family: 'Inter'; font-weight: 300; font-size: 10px; line-height: 23px; color: #999999; margin-left: 5%; position: relative; top: 2.5%; } .box-itens-teleports{ width: 90%; height: 75%; margin-left: 5%; margin-top: 5%; overflow: auto; } .box-itens-teleports .item-teleport{ width: 100%; height: 50px; border-radius: 10px; background: #F2F2F2; display: flex; margin-top: 2%; } .box-itens-teleports .item-teleport img{ min-width: 30px; max-width: 30px; min-height: 30px; max-height: 30px; border-radius: 30px; object-fit: cover; margin-left: 5%; margin-top: 5.5%; } .box-itens-teleports .nome-teleport{ font-family: 'Inter'; font-style: normal; font-weight: 700; font-size: 16px; color: #353535; margin-left: 5%; line-height: 50px; } .box-itens-teleports .botao-remover-teleport{ position: absolute; background: #FF666620; width: 35px; height: 35px; right: 10%; margin-top: 3.5%; border-radius: 10px; } .box-itens-teleports .botao-remover-teleport2{ background: #FF6666; width: 30px; height: 30px; border-radius: 10px; display: block; margin-left: auto; margin-right: auto; margin-top: 2.5px; text-align: center; transition: all 1s; } .box-itens-teleports .botao-remover-teleport2:hover{ transform: scale(1.1); } .box-itens-teleports .botao-remover-teleport2 i { color: #fff; text-align: center; line-height: 30px; font-size: 14px; animation-name: neon-anim; animation-duration: 2.5s; animation-iteration-count: infinite; } @keyframes neon-anim { 0% { text-shadow: 0 0 10px rgba(255, 255, 255, 0.2); color: rgba(255, 255, 255, 0.2); } 50% { text-shadow: 0 0 10px rgb(255, 255, 255); color: rgba(255, 255, 255); } 100% { text-shadow: 0 0 10px rgba(255, 255, 255, 0.2); color: rgba(255, 255, 255, 0.2); } } .criar-teleport{ width: 150px; margin-left: 14.5%; transition: all 1s; } .criar-teleport:hover{ transform: scale(1.05); } .box-entradas{ width: 21.5%; border-radius: 10px; height: 32.5%; background: white; position: absolute; top: 64.5%; left: 74%; } .text-entradas{ font-style: normal; font-family: 'Inter'; font-weight: 700; font-size: 18px; line-height: 23px; color: #353535; margin-left: 5%; position: relative; top: 4%; } .text2-entradas{ font-style: normal; font-family: 'Inter'; font-weight: 300; font-size: 10px; line-height: 23px; color: #999999; margin-left: 5%; position: relative; top: 2.5%; } .box-itens-entradas{ width: 90%; height: 72%; margin-left: 5%; margin-top: 5%; overflow: auto; } .box-itens-entradas .item-entradas{ width: 100%; height: 50px; border-radius: 10px; background: #F2F2F2; margin-top: 2%; } .box-itens-entradas .item-entradas img{ min-width: 30px; max-width: 30px; min-height: 30px; max-height: 30px; border-radius: 30px; object-fit: cover; margin-left: 5%; margin-top: 5.5%; } .box-itens-entradas .nome-entradas{ font-family: 'Inter'; font-style: normal; font-weight: 700; font-size: 12px; color: #353535; margin-left: 5%; margin-top: -15%; margin-left: 25%; } .box-itens-entradas .data-entradas{ font-family: 'Inter'; font-style: normal; font-weight: 300; font-size: 9px; color: #999999; margin-left: 5%; margin-left: 25%; } .box-itens-entradas .botao-remover-entradas{ background: #FF666620; width: 35px; height: 35px; margin-left: 76.5%; margin-top: -16.5%; border-radius: 10px; } .box-itens-entradas .botao-remover-entradas2{ background: #FF6666; width: 30px; height: 30px; border-radius: 10px; display: block; margin-left: auto; margin-right: auto; position: relative; top: 7%; text-align: center; transition: all 1s; } .box-itens-entradas .botao-remover-entradas2:hover{ transform: scale(1.1); } .box-itens-entradas .botao-remover-entradas2 i { color: #fff; text-align: center; line-height: 30px; font-size: 14px; animation-name: neon-anim; animation-duration: 2.5s; animation-iteration-count: infinite; } @keyframes neon-anim { 0% { text-shadow: 0 0 10px rgba(255, 255, 255, 0.2); color: rgba(255, 255, 255, 0.2); } 50% { text-shadow: 0 0 10px rgb(255, 255, 255); color: rgba(255, 255, 255); } 100% { text-shadow: 0 0 10px rgba(255, 255, 255, 0.2); color: rgba(255, 255, 255, 0.2); } } .pulse-entradas{ width: 10px; height: 10px; border-radius: 10px; position: relative; margin-left: 15%; margin-top: -5%; } .ONLINE-PULSEENTRADAS{ background: rgb(67, 243, 23); box-shadow: 0 0 0 rgba(67, 243, 23, 0.4); animation: pulse-on 2s infinite; } .OFFLINE-PULSEENTRADAS{ background: rgb(255, 86, 86); box-shadow: 0 0 0 rgba(255, 86, 86, 0.4); animation: pulse-off 2s infinite; } .pagina-jogadores .box-aviso-pagina-jogador-1{ width: 35%; margin-left: 3%; margin-top: 1%; height: 90px; background: white; border-radius: 10px; } .pagina-jogadores .box-aviso-pagina-jogador-1 .nome-aviso-pagina-jogador-1{ font-style: normal; font-family: 'Inter'; font-weight: 700; color: #353535; font-size: 20px; margin-left: 5%; position: relative; top: 20%; } .pagina-jogadores .box-aviso-pagina-jogador-1 .aviso-pagina-jogadores-1{ width: 80px; margin-top: -5%; margin-left: 73%; } .pagina-jogadores .box-aviso-pagina-jogador-1 .desc-aviso-pagina-jogador-1{ font-style: normal; font-family: 'Inter'; font-weight: 300; color: #353535; font-size: 12px; margin-left: 5%; margin-top: -9%; width: 85%; } .pagina-jogadores .contador-pagina-jogadores-box{ width: 56.5%; margin-left: 3%; margin-top: -9.5%; height: 90px; margin-left: 39%; display: flex; } .pagina-jogadores .contador-pagina-jogadores-box .contador-pagina-jogadores:nth-child(1){ margin-left: 0%; } .pagina-jogadores .contador-pagina-jogadores-box .contador-pagina-jogadores{ width: 32.1%; height: 100%; margin-left: 1%; border-radius: 10px; background: white; display: inline-block; } .pagina-jogadores .contador-pagina-jogadores-box .contador-pagina-jogadores .contador-pagina-jogadores-text1{ font-style: normal; font-family: 'Inter'; font-weight: 300; color: #B4B4B4; font-size: 14px; margin-left: 5%; margin-top: 8%; } .pagina-jogadores .contador-pagina-jogadores-box .contador-pagina-jogadores .contador-pagina-jogadores-text2{ font-style: normal; font-family: 'Inter'; font-weight: 700; color: #353535; font-size: 23px; margin-left: 5%; margin-top: 12%; } .contador-pagina-jogadores-item1{ width: 60px; height: 25px; border-radius: 5px; text-align: center; font-style: normal; font-family: 'Inter'; font-weight: 300; font-size: 12px; line-height: 25px; margin-top: -15%; margin-left: 60%; display: flex; align-items: center; justify-content: center; } .contador-pagina-vivo{ background: #FFF3C7; color: #CAA00C; } .contador-pagina-down{ background: #FFC7C7; color: #D92828; } .contador-pagina-up{ background: #CFFFC7; color: #41D928; } .contador-pagina-jogadores-item1 img{ width: 15px; } .header-jogadores{ width: 91.5%; height: 30px; margin-top: 1%; margin-left: 3%; } .item-header1{ font-style: normal; font-family: 'Inter'; font-weight: 700; color: #353535; font-size: 14px; display: inline-block; text-align: center; } .overflow-lista-jogadores{ width: 91.5%; margin-top: 1%; margin-left: 3%; height: 66%; overflow: auto; } .item-jogadores{ width: 99%; height: 80px; background: white; border-radius: 10px; } .h1jo{ width: 13%; height: 100%; line-height: 80px; text-align: center; font-style: normal; font-family: 'Inter'; font-weight: 700; color: #353535; } .h2jo{ width: 31%; height: 100%; margin-top: -9.2%; margin-left: 13%; } .imgh2{ min-width: 60px; min-height: 60px; max-width: 60px; max-height: 60px; object-fit: cover; filter: drop-shadow(0px 4px 4px rgba(0, 0, 0, 0.3)); border-radius: 10px; margin-left: 5%; margin-top: 3.5%; } .nome-jogadorh2{ font-style: normal; font-family: 'Inter'; font-weight: 700; color: #353535; margin-top: -18%; margin-left: 32%; } .cargo-jogadorh2{ margin-left: 32%; font-style: normal; font-family: 'Inter'; font-weight: 300; font-size: 16px; } .h3jo{ width: 13%; height: 100%; margin-top: -9.2%; margin-left: 44%; } .status-online{ color: #48AA85; background: #48AA8530; width: 80%; height: 40px; border-radius: 10px; line-height: 40px; position: relative; top: 25%; text-align: center; font-style: normal; font-family: 'Inter'; font-weight: 300; font-size: 16px; } .status-online-ONLINE{ color: #48AA85; background: #48AA8530; width: 80%; height: 40px; border-radius: 10px; line-height: 40px; position: relative; top: 25%; text-align: center; font-style: normal; font-family: 'Inter'; font-weight: 300; font-size: 16px; } .status-online-AFK{ color: #AAA048; background: #AA8F4830; width: 80%; height: 40px; border-radius: 10px; line-height: 40px; position: relative; top: 25%; text-align: center; font-style: normal; font-family: 'Inter'; font-weight: 300; font-size: 16px; } .h4jo{ width: 13%; height: 100%; margin-top: -9.2%; margin-left: 57%; } .flag{ position: relative; top: 25%; width: 55px; height: 40px; margin-left: 12%; border-radius: 10px; } .h5jo{ width: 17%; height: 100%; margin-top: -9.2%; margin-left: 70%; display: flex; align-items: center; } .h5jo img{ width: 30px; height: 30px; margin-left: 3%; } .h6jo{ width: 10%; height: 100%; margin-top: -9.2%; margin-left: 87%; display: flex; align-items: center; position: relative; } .h6jo i{ color: #35353550; transition: all .5s; margin-right: 5px; } .h6jo i:nth-child(1){ margin-left: 20%; } .h6jo i:nth-child(2){ margin-left: 20%; } .h6jo i:hover{ color: #353535; transform: scale(1.1); } .tooltip { display: none; position: absolute; top: 105%; left: 50%; transform: translateX(-50%); background-color: #353535; font-style: normal; font-family: 'Inter'; font-weight: 300; font-size: 12px; color: #fff; padding: 4px; border-radius: 5px; } .overflow-verperfil{ width: 100%; height: 88%; overflow: auto; } .pagina-verperfil .banner-cidade { width: 92.5%; height: 250px; /* Ajuste a altura conforme necessário */ object-fit: cover; margin-left: 3%; margin-top: 1%; border-radius: 10px; filter: drop-shadow(0px 4px 4px rgba(0, 0, 0, 0.3)); } .pagina-verperfil .imagem-usuario{ object-fit: cover; min-width: 110px; max-width: 110px; min-height: 110px; max-height: 110px; border-radius: 110px; margin-left: 8%; margin-top: -9%; filter: drop-shadow(0px 4px 4px rgba(0, 0, 0, 0.3)); } .pagina-verperfil .nome-ver-perfil{ font-style: normal; font-family: 'Inter'; font-weight: 700; color: #fff; margin-top: -9%; font-size: 23px; margin-left: 21%; position: relative; } .pagina-verperfil .passaporte-ver-perfil{ font-style: normal; font-family: 'Inter'; font-weight: 700; color: #fff; font-size: 16px; margin-left: 21%; position: relative; } .pagina-verperfil .bolinha-ver-perfil{ position: relative; width: 10px; height: 10px; border-radius: 15px; background: rgb(43, 163, 13); box-shadow: 0 0 0 rgba(43, 163, 13, 0.4); animation: pulse-ver-perfil 2s infinite; display: inline-block; margin-left: 1%; } .pagina-verperfil .admin-ver-perfil{ width: 160px; height: 40px; text-align: center; font-style: normal; font-family: 'Inter'; font-weight: 700; font-size: 14px; line-height: 40px; border-radius: 5px; position: relative; margin-top: -23%; margin-left: 77.5%; background: #3E5F9E; outline: 2px solid #3E5F9E20; background-image: url('https://media.discordapp.net/attachments/1176036604268265503/1189984945767190700/image.png'); background-size: cover; color: #fff; } .pagina-verperfil .identidade-box{ width: 60%; height: 32%; background: white; margin-top: 25%; margin-left: 3%; border-radius: 10px; } .pagina-verperfil .identidade-box-text1{ font-style: normal; font-family: 'Inter'; font-weight: 700; color: #353535; font-size: 22px; margin-left: 4%; top: 10%; position: relative; } .pagina-verperfil .identidade-box-text2{ font-style: normal; font-family: 'Inter'; font-weight: 300; color: #999999; font-size: 14px; margin-left: 4%; margin-top: 4%; } .pagina-verperfil .identidade-box-text2 ss{ color: #3E5F9E; font-style: normal; font-family: 'Inter'; font-weight: bold; } .pagina-verperfil .box-itens-identidade{ width: 92.5%; height: 55%; margin-top: 1%; margin-left: 4%; } .pagina-verperfil .item-identidade{ width: 173px; height: 58px; border-radius: 10px; display: inline-block; } .pagina-verperfil .item-identidade .barra{ height: 80%; width: 3%; margin-top: 3.5%; border-radius: 10px; background: #ECECEC; } .icon-item-identidade{ width: 25px; height: 25px; margin-top: -18.5%; margin-left: 8%; } .pagina-verperfil .item-identidade .text1-item-identidade{ font-style: normal; font-family: 'Inter'; font-weight: bold; color: #353535; font-size: 16px; margin-top: -22%; margin-left: 28%; } .pagina-verperfil .item-identidade .text2-item-identidade{ font-style: normal; font-family: 'Inter'; font-weight: 200; color: #999999; font-size: 14px; margin-left: 28%; } .pagina-verperfil .item-identidade .vip{ color: #3D7AF1; } .pagina-verperfil .computer-opacity{ width: 198.78px; height: 179.22px; margin-top: -40%; margin-left: 68%; } .pagina-verperfil .opcoes-box{ width: 31.5%; border-radius: 10px; height: 50%; margin-top: -22.1%; margin-left: 64%; } .item-opcoes-box{ width: 100%; height: 30%; margin-top: 4%; } .item-opcoes-box img{ width: 100%; height: 100%; object-fit: cover; border-radius: 10px; } .background-black{ width: 100%; height: 100%; background: #0f0f0f8a; border-radius: 10px; margin-top: -32.7%; position: relative; transition: all 1s; } .background-black .barra1{ width: 30%; height: 5px; border-radius: 10px; top: 8%; position: relative; background: transparent; margin-left: 35%; } .background-black .barra2{ width: 30%; height: 5px; border-radius: 10px; top: 5.5%; position: relative; background: white; margin-left: 35%; } .text1-background { font-style: normal; font-family: 'Inter'; font-weight: 600; color: #fff; margin-left: 18%; margin-top: 7%; font-size: 10px; } .text2-background { font-style: normal; font-family: 'Inter'; font-weight: 600; color: #fff; margin-top: 1%; text-align: center; font-size: 32px; } .background-black:hover{ background: #0f0f0fd5; } .atividade-box{ width: 60%; height: 48%; background: white; margin-top: -11%; margin-left: 3%; border-radius: 10px; } .pagina-verperfil .ativdade-box-text1{ font-style: normal; font-family: 'Inter'; font-weight: 700; color: #353535; font-size: 22px; margin-left: 4%; top: 10%; width: 20%; position: relative; } .pagina-verperfil .criar-anotacao{ width: 120px; text-align: center; height: 35px; line-height: 35px; border-radius: 10px; background: #3E5F9E; font-style: normal; font-family: 'Inter'; font-weight: 700; color: #fff; margin-top: -1.2%; margin-left: 75%; outline: 2px solid #3E5F9E20; background-image: url('https://media.discordapp.net/attachments/1176036604268265503/1189984945767190700/image.png'); background-size: cover; transition: all 1s; } .pagina-verperfil .criar-anotacao:hover{ background: #3b73dd; } .pagina-verperfil .overflow-atividade{ width: 92%; height: 73%; margin-left: 4%; margin-top: 2%; overflow: auto; } .pagina-verperfil .item-atividade{ width: 97%; min-height: 35%; height: auto; padding: 5px; border-radius: 10px; background: #F4F4F4; align-items: center; margin-top: -0.2%; } .pagina-verperfil .icon-atividade{ width: 60px; height: 60px; border-radius: 100px; margin-top: 3%; margin-left: 5%; position: relative; justify-content: center; display: flex; align-items: center; transition: all .5s; } .pagina-verperfil .icon-atividade img{ width: 35px; height: 35px; } .atividade-normal{ background: #439FF420; } .atividade-chamado{ background: #E0BA3120; } .icon-atividade:hover img{ content: url('assets/trash.png'); transform: rotate(360deg); } .icon-atividade:hover{ background-color: #FF000040; } .icon-atividade img { transition: transform 0.3s ease; } .icon-atividade:hover img { transform: rotate(360deg); } .icon-atividade:hover img:after { content: url('assets/adv.png'); display: block; position: absolute; top: 0; left: 0; opacity: 0; transform: rotate(360deg); transition: opacity 0.3s ease; } .icon-atividade:hover img:after { opacity: 1; } .nome-atividade{ width: 50%; font-style: normal; font-family: 'Inter'; font-weight: 700; color: #353535; font-size: 18px; } .data-atividade{ width: 50%; font-style: normal; font-family: 'Inter'; font-weight: 400; color: #353535; font-size: 14px; text-align: right; } .data-atividade img{ width: 15px; height: 15px; position: relative; top: 5%; } .header-anotacao{ width: 75%; height: 22px; display: flex; margin-left: 20%; margin-top: -12%; } .meio-anotacao{ width: 80%; min-height: 30px; height: auto; padding-bottom: 10px; margin-left: 20%; margin-top: 2%; font-style: normal; font-family: 'Inter'; font-weight: 400; color: #999999; font-size: 14px; } .criador-anotacao-box{ width: 50%; height: 25px; margin-left: 20%; margin-top: 2%; margin-bottom: 2%; display: flex; } .criador-anotacao-box img{ min-width: 25px; max-width: 25px; min-height: 25px; max-height: 25px; border-radius: 100px; object-fit: cover; } .nome-criador-anotacao{ font-style: normal; font-family: 'Inter'; font-weight: 400; color: #353535; font-size: 14px; line-height: 25px; margin-left: 2%; } .espacar-ativdade{ height: 25px; width: 8px; margin-left: 6%; margin-top: -1%; background: #F4F4F4; border-radius: 10px; } /* -------------------------------------- -- Editar Inventario -------------------------------------- */ .pagina-verinventario .header-editarinventario{ width: 92.5%; height: 50px; margin-left: 3%; margin-top: 2%; display: flex; } .pagina-verinventario .botao-voltar{ width: 40px; height: 40px; background: #3E5F9E; outline: 2px solid #3E5F9E20; background-image: url('https://media.discordapp.net/attachments/1176036604268265503/1189984945767190700/image.png'); background-size: cover; border-radius: 10px; text-align: center; justify-content: center; align-items: center; display: flex; transition: all 1s; } .pagina-verinventario .botao-voltar:hover{ background: #3D7AF1; } .pagina-verinventario .botao-voltar img{ width: 25px; height: 25px; } .imagem-personagem-verinventario{ min-width: 40px; max-width: 40px; min-height: 40px; max-height: 40px; border-radius: 10px; margin-left: 1%; object-fit: cover; } .nome-personagem-verinventario{ font-style: normal; font-family: 'Inter'; line-height: 40px; margin-left: 1%; font-weight: 700; color: #353535; font-size: 16px; } .botao-adicionar-verinventario{ position: absolute; right: 4.5%; width: 180px; height: 40px; background: #3E5F9E; outline: 2px solid #3E5F9E20; background-image: url('https://media.discordapp.net/attachments/1176036604268265503/1189984945767190700/image.png'); background-size: cover; border-radius: 10px; font-style: normal; font-family: 'Inter'; font-weight: 700; color: #fff; display: flex; text-align: center; justify-content: center; align-items: center; font-size: 16px; transition: all 1s; } .botao-adicionar-verinventario:hover{ background: #3D7AF1; } .botao-adicionar-verinventario img{ width: 20px; margin-right: 5px; } .overflow-verinventario{ width: 92.5%; height: 75%; margin-left: 3%; overflow: auto; } .item-verinventario{ width: 167px; height: 180px; border-radius: 10px; background: white; display: inline-block; margin-left: 0.4%; margin-top: 1%; } .item-verinventario img{ width: 85px; height: 85px; margin-left: auto; margin-right: auto; display: block; margin-top: 14%; transition: transform 0.3s ease; } .header-item-verinventario{ width: 80%; margin-left: 10%; display: flex; position: relative; top: 7%; } .header-item1{ width: 49%; font-style: normal; font-family: 'Inter'; font-weight: 700; color: #353535; font-size: 12px; } .header-item2{ width: 49%; text-align: right; font-style: normal; font-family: 'Inter'; font-weight: 700; color: #353535; font-size: 12px; } .nome-item-verinventario{ text-align: center; margin-top: 2%; font-style: normal; font-family: 'Inter'; font-weight: 700; color: #353535; font-size: 14px; } .nome-item-vercarros{ text-align: center; margin-top: 2%; font-style: normal; font-family: 'Inter'; font-weight: 700; color: #353535; font-size: 14px; } .durability{ width: 80%; margin-top: 4%; margin-left: 10%; height: 10px; border-radius: 10px; background: rgba(15, 15, 15, 0.8); } .durability2{ width: 60%; height: 100%; border-radius: 10px; background: #31ee89; } .barra-verinventario{ width: 70%; height: 10px; background: #3E5F9E; outline: 2px solid #3E5F9E20; background-image: url('https://media.discordapp.net/attachments/1176036604268265503/1189984945767190700/image.png'); background-size: cover; border-radius: 10px 10px 0px 0px; margin-left: 15%; margin-top: 5%; } /* -------------------------------------- -- Adicionar Item -------------------------------------- */ .pagina-adicionaritem-player .header-editarinventario{ width: 92.5%; height: 50px; margin-left: 3%; margin-top: 2%; display: flex; } .pagina-adicionaritem-player .botao-voltar{ width: 40px; height: 40px; background: #3E5F9E; outline: 2px solid #3E5F9E20; background-image: url('https://media.discordapp.net/attachments/1176036604268265503/1189984945767190700/image.png'); background-size: cover; border-radius: 10px; text-align: center; justify-content: center; align-items: center; display: flex; transition: all 1s; } .pagina-adicionaritem-player .botao-voltar:hover{ background: #3D7AF1; } .pagina-adicionaritem-player .botao-voltar img{ width: 25px; height: 25px; } .imagem-personagem-adicionaritem{ min-width: 40px; max-width: 40px; min-height: 40px; max-height: 40px; border-radius: 10px; margin-left: 1%; object-fit: cover; } .nome-personagem-verinventario{ font-style: normal; font-family: 'Inter'; line-height: 40px; margin-left: 1%; font-weight: 700; color: #353535; font-size: 16px; } .overflow-listadeitens-adicionar{ width: 92.5%; height: 75%; margin-left: 3%; overflow: auto; } .overflow-listadeitens-adicionar-bau{ width: 92.5%; height: 75%; margin-left: 3%; overflow: auto; } .adicionar-quantidade-item{ width: 600px; height: 310px; background: white; border-radius: 10px; position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; } .adicionar-quantidade-item span{ color: #3E5F9E; font-weight: 700; } .adicionar-quantidade-item-inv{ width: 600px; height: 310px; background: white; border-radius: 10px; position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; } .adicionar-quantidade-item-inv span{ color: #3E5F9E; font-weight: 700; } .adicionar-quantidade-carro{ width: 600px; height: 310px; background: white; border-radius: 10px; position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; } .adicionar-quantidade-carro span{ color: #3E5F9E; font-weight: 700; } .adicionar-quantidade-item-bau{ width: 600px; height: 310px; background: white; border-radius: 10px; position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; } .adicionar-quantidade-item-bau span{ color: #3E5F9E; font-weight: 700; } .search-item-box-player{ position: absolute; right: 4.5%; width: 180px; height: 40px; background: white; border-radius: 10px; display: flex; } .search-item-box-player i { color: #353535; line-height: 40px; margin-left: 5%; } .search-item-box-player input{ outline: 0; border: 0; border: 10px; width: 75%; background: transparent; margin-left: 10%; font-style: normal; font-family: 'Inter'; font-weight: 400; } /* -------------------------------------- -- Ver Garagem -------------------------------------- */ .pagina-vergaragem .header-editarinventario{ width: 92.5%; height: 50px; margin-left: 3%; margin-top: 2%; display: flex; } .pagina-vergaragem .botao-voltar{ width: 40px; height: 40px; background: #3E5F9E; outline: 2px solid #3E5F9E20; background-image: url('https://media.discordapp.net/attachments/1176036604268265503/1189984945767190700/image.png'); background-size: cover; border-radius: 10px; text-align: center; justify-content: center; align-items: center; display: flex; transition: all 1s; } .pagina-vergaragem .botao-voltar:hover{ background: #3D7AF1; } .pagina-vergaragem .botao-voltar img{ width: 25px; height: 25px; } .item-vergaragem{ width: 167px; height: 180px; border-radius: 10px; background: white; display: inline-block; margin-left: 0.4%; margin-top: 1%; } .item-vergaragem img{ width: 150px; height: 85px; margin-left: auto; margin-right: auto; display: block; margin-top: 14%; object-fit: cover; transition: transform 0.3s ease; } .bot-carro{ color: #3E5F9E; text-align: center; margin-top: 7%; transition: all .5s; width: 100%; } .bot-carro i{ transition: all .5s; margin-left: 20px; } .bot-carro i:hover{ transform: scale(1.2); } .barra-vergaragem{ width: 70%; height: 10px; background: #3E5F9E; outline: 2px solid #3E5F9E20; background-image: url('https://media.discordapp.net/attachments/1176036604268265503/1189984945767190700/image.png'); background-size: cover; border-radius: 10px 10px 0px 0px; margin-left: 15%; margin-top: 7%; } .overflow-vergaragem{ width: 92.5%; height: 75%; margin-left: 3%; overflow: auto; } .nome-item-vergaragem{ text-align: center; margin-top: 2%; font-style: normal; font-family: 'Inter'; font-weight: 700; color: #353535; font-size: 14px; } /* -------------------------------------- -- Format -------------------------------------- */ .format{ position: absolute; top: 0; left: 0; width: 100%; height: 100%; border-radius: 20px; background: rgba(15, 15, 15, 0.6); } .criar-telport{ width: 600px; height: 400px; background: white; border-radius: 10px; position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; } .text-criar-telport{ font-family: 'Inter'; font-style: normal; font-weight: 700; font-size: 20px; left: 5%; top: 8%; position: relative; color: #353535; } .desc-criar-telport{ font-family: 'Inter'; font-style: normal; font-weight: 300; font-size: 14px; margin-top: 5%; margin-left: 5%; color: #999999; } .box-info-criar-teleport{ width: 90%; height: 34%; background: #F4F4F4; margin-left: 5%; margin-top: 2%; border-radius: 10px; } .criar-teleport-sistema{ font-family: 'Inter'; font-style: normal; font-weight: 700; font-size: 20px; left: 5%; top: 11%; position: relative; color: #353535; } .item-criar-telport{ width: 70%; height: 16px; margin-left: 5%; margin-top: 2%; font-family: 'Inter'; font-style: normal; font-weight: 300; font-size: 13px; } .item-criar-telport span{ width: 5px; height: 5px; border-radius: 5px; background: #999999; } .img-criar-teleport{ width: 160px; margin-top: -11%; margin-left: 70%; } .input-criar-teleport-box{ width: 90%; margin-left: 5%; height: 40px; margin-top: 3%; border-radius: 10px; background: #F4F4F4; display: flex; } .input-criar-teleport-box2{ width: 45%; height: 100%; line-height: 40px; text-align: center; color: #fff; font-family: 'Inter'; font-style: normal; font-weight: 500; border-radius: 10px; font-size: 14px; background: #353535; } .icon-criar-teleport{ margin-right: 10px; } .input-criar-teleport-box input{ outline: 0; border: 0; border-radius: 10px; background: transparent; width: 54%; font-style: normal; font-weight: 500; border-radius: 10px; margin-left: 1%; } .confirmar-criar-teleport{ width: 40%; height: 40px; border-radius: 10px; text-align: center; line-height: 40px; font-style: normal; font-weight: 500; border-radius: 10px; color: #fff; margin-top: 2.5%; margin-left: 30%; background: #3E5F9E; outline: 2px solid #3E5F9E20; background-image: url('https://media.discordapp.net/attachments/1176036604268265503/1189984945767190700/image.png'); background-size: cover; transition: all 1s ease; } .confirmar-criar-teleport:hover{ background: #3D7AF1; } .fechar-criar-teleport { width: 40px; height: 40px; position: absolute; top: 7%; right: 5%; background: rgb(245, 87, 87, 0.2); color: #fff; border-radius: 10px; text-align: center; display: flex; justify-content: center; align-items: center; transition: all 1s ease; } .fechar-criar-teleport2 { background: rgb(245, 87, 87); width: 35px; height: 35px; border-radius: 10px; line-height: 35px; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); transition: all 1s ease; } .fechar-criar-teleport2:hover{ background: rgb(241, 56, 56); } .fechar-criar-teleport:hover{ transform: scale(1.05); } @-webkit-keyframes pulse-ver-perfil { 0% { -webkit-box-shadow: 0 0 0 0 rgba(43, 163, 13, 0.4); } 70% { -webkit-box-shadow: 0 0 0 10px rgba(204,169,44, 0); } 100% { -webkit-box-shadow: 0 0 0 0 rgba(204,169,44, 0); } } @keyframes pulse-ver-perfil { 0% { -moz-box-shadow: 0 0 0 0 rgba(43, 163, 13, 0.4); box-shadow: 0 0 0 0 rgba(43, 163, 13, 0.4); } 70% { -moz-box-shadow: 0 0 0 10px rgba(204,169,44, 0); box-shadow: 0 0 0 10px rgba(204,169,44, 0); } 100% { -moz-box-shadow: 0 0 0 0 rgba(204,169,44, 0); box-shadow: 0 0 0 0 rgba(204,169,44, 0); } } .remover-quantidade-item{ width: 600px; height: 310px; background: white; border-radius: 10px; position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; } .remover-quantidade-item span{ color: #3E5F9E; font-weight: 700; } .box-info-criar-remover-quantidade{ width: 90%; height: 25%; background: #F4F4F4; margin-left: 5%; margin-top: 2%; border-radius: 10px; } .img-criar-remover-quantidade{ width: 100px; margin-top: -12%; margin-left: 70%; } .header-vergarabem-bau{ width: 92.5%; height: 50px; margin-left: 3%; margin-top: 2%; display: flex; } .header-vergarabem-bau .botao-voltar{ width: 40px; height: 40px; background: #3E5F9E; outline: 2px solid #3E5F9E20; background-image: url('https://media.discordapp.net/attachments/1176036604268265503/1189984945767190700/image.png'); background-size: cover; border-radius: 10px; text-align: center; justify-content: center; align-items: center; display: flex; transition: all 1s; } .header-vergarabem-bau .botao-voltar:hover{ background: #3D7AF1; } .header-vergarabem-bau .botao-voltar img{ width: 25px; height: 25px; } .overflow-vergaragem-bau{ width: 92.5%; height: 75%; margin-left: 3%; overflow: auto; } .box-info-criar-remover-carro{ width: 90%; height: 100px; background: #F4F4F4; margin-left: 5%; margin-top: 2%; border-radius: 10px; } .remover-carro{ width: 600px; height: 250px; background: white; border-radius: 10px; position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; } .remover-carro span{ color: #3E5F9E; font-weight: 700; } .overflow-adicionar-carro{ width: 92.5%; height: 75%; margin-left: 3%; overflow: auto; } .adicionar-carro-garagem{ width: 600px; height: 250px; background: white; border-radius: 10px; position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; } .adicionar-carro-garagem span{ color: #3E5F9E; font-weight: 700; } .remover-quantidade-item-bau{ width: 600px; height: 310px; background: white; border-radius: 10px; position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; } .remover-quantidade-item-bau span{ color: #3E5F9E; font-weight: 700; } /* -------------------------------------- -- Adicionar Item Bau -------------------------------------- */ .pagina-adicionaritem-bau .header-editarinventario{ width: 92.5%; height: 50px; margin-left: 3%; margin-top: 2%; display: flex; } .pagina-adicionaritem-bau .botao-voltar{ width: 40px; height: 40px; background: #3E5F9E; outline: 2px solid #3E5F9E20; background-image: url('https://media.discordapp.net/attachments/1176036604268265503/1189984945767190700/image.png'); background-size: cover; border-radius: 10px; text-align: center; justify-content: center; align-items: center; display: flex; transition: all 1s; } .pagina-adicionaritem-bau .botao-voltar:hover{ background: #3D7AF1; } .pagina-adicionaritem-bau .botao-voltar img{ width: 25px; height: 25px; } .item-remover img:hover{ content: url('assets/trash2.png'); transform: rotate(360deg); opacity: 0.6; } .overflow-lista-mortes{ width: 91.5%; margin-top: 0%; margin-left: 3%; height: 80%; overflow: auto; } .item-morte{ width: 99%; height: 80px; background: white; border-radius: 10px; } .morte-h1jo{ width: 68%; height: 100%; line-height: 80px; font-style: normal; font-family: 'Inter'; font-weight: 700; color: #353535; } .morte-h1jo-img{ min-width: 60px; min-height: 60px; max-width: 60px; max-height: 60px; object-fit: cover; filter: drop-shadow(0px 4px 4px rgba(0, 0, 0, 0.3)); border-radius: 10px; margin-left: 5%; margin-top: 1.5%; } .morte-nome-jogadorh2{ font-style: normal; font-family: 'Inter'; font-weight: 700; font-size: 16px; color: #353535; margin-top: -11.8%; margin-left: 20%; } .morte-img-arma{ min-width: 50px; max-width: 50px; margin-top: -10%; margin-left: 45%; background: #3E5F9E; outline: 3px solid #3E5F9E20; background-image: url(assets/fundo.png); background-size: cover; padding: 10px; border-radius: 10px; } .morte-h1jo-img2{ min-width: 60px; min-height: 60px; max-width: 60px; max-height: 60px; object-fit: cover; filter: drop-shadow(0px 4px 4px rgba(0, 0, 0, 0.3)); border-radius: 10px; margin-top: -12%; margin-left: 64%; } .morte-nome-jogadorh22{ font-style: normal; font-family: 'Inter'; font-weight: 700; font-size: 16px; color: #353535; margin-top: -13.6%; margin-left: 79%; } .morte-h2jo{ width: auto; max-width: 10%; height: 100%; margin-top: -9.2%; margin-left: 68%; align-items: center; display: flex; font-style: normal; font-family: 'Inter'; font-weight: 700; color: #353535; text-align: center; } .morte-h3jo{ width: 15%; height: 100%; margin-top: -9.2%; margin-left: 83%; display: flex; align-items: center; position: relative; } .morte-h3jo i{ color: #35353550; transition: all .5s; margin-right: 5px; } .morte-h3jo i:nth-child(1){ margin-left: 0%; } .morte-h3jo i:nth-child(2){ margin-left: 10%; } .morte-h3jo i:nth-child(3){ margin-left: 10%; } .morte-h3jo i:hover{ color: #353535; transform: scale(1.1); } .pagina-itens .box-aviso-pagina-jogador-1{ width: 92.5%; margin-left: 3%; margin-top: 1%; height: 90px; background: white; border-radius: 10px; } .pagina-itens .box-aviso-pagina-jogador-1 .nome-aviso-pagina-jogador-1{ font-style: normal; font-family: 'Inter'; font-weight: 700; color: #353535; font-size: 20px; margin-left: 3%; position: relative; top: 15%; } .pagina-itens .box-aviso-pagina-jogador-1 .aviso-pagina-jogadores-1{ width: 140px; margin-top: -8%; margin-left: 80%; } .pagina-itens .box-aviso-pagina-jogador-1 .desc-aviso-pagina-jogador-1{ font-style: normal; font-family: 'Inter'; font-weight: 300; color: #353535; font-size: 12px; margin-left: 3%; margin-top: 2.5%; width: 80%; } .overflow-listaitensgeral{ width: 92.5%; margin-top: 0%; margin-left: 3%; height: 72%; overflow: auto; } .overflow-listacarrosgeral{ width: 92.5%; margin-top: 0%; margin-left: 3%; height: 72%; overflow: auto; } .item-veritens{ width: 167px; height: 180px; border-radius: 10px; background: white; display: inline-block; margin-left: 0.3%; margin-top: 1%; } .item-veritens img{ width: 100px; height: 100px; margin-left: auto; margin-right: auto; display: block; margin-top: 14%; transition: transform 0.3s ease; object-fit: cover; } .item-vercarros{ width: 167px; height: 180px; border-radius: 10px; background: white; display: inline-block; margin-left: 0.3%; margin-top: 1%; } .item-vercarros img{ width: 135px; height: 135px; margin-left: auto; margin-right: auto; display: block; margin-top: 5%; transition: transform 0.3s ease; object-fit: cover; } .search-veritens{ position: absolute; left: 25%; top: 5%; width: 180px; height: 40px; background: white; border-radius: 10px; display: flex; } .search-veritens i { color: #353535; line-height: 40px; margin-left: 5%; } .search-veritens input{ outline: 0; border: 0; border: 10px; width: 75%; background: transparent; margin-left: 10%; font-style: normal; font-family: 'Inter'; font-weight: 400; } .pagina-carros .box-aviso-pagina-jogador-1{ width: 92.5%; margin-left: 3%; margin-top: 1%; height: 90px; background: white; border-radius: 10px; } .pagina-carros .box-aviso-pagina-jogador-1 .nome-aviso-pagina-jogador-1{ font-style: normal; font-family: 'Inter'; font-weight: 700; color: #353535; font-size: 20px; margin-left: 3%; position: relative; top: 15%; } .pagina-carros .box-aviso-pagina-jogador-1 .aviso-pagina-jogadores-1{ width: 140px; margin-top: -8%; margin-left: 80%; } .pagina-carros .box-aviso-pagina-jogador-1 .desc-aviso-pagina-jogador-1{ font-style: normal; font-family: 'Inter'; font-weight: 300; color: #353535; font-size: 12px; margin-left: 3%; margin-top: 2.5%; width: 80%; }