Pagina bugada

por Convidado 03.11.18 20:45

Detalhes da questão

Endereço do fórum: http://policiamentodph.directorioforuns.com/
Versão do fórum: ModernBB

Descrição

Olá, gostaria que vocês ajeita se essa página se possível. Inicialmente, o texto que está dando problemas e depois gostaria que ajeita sse os usuários se você clicar em administração você verá que tem um usuário que não existe, então quero que apareça a foto do usuário (foto em vez de quadrada, redonda) e o nick dele. á pagina http://policiamentodph.directorioforuns.com/h3-tudo-ok

Código:: <br /> <div itemprop="description articleBody" id="post-body-5381674225246114274" class="corpo"><style type="text/css"> .vagas-staff { background-color: #EC2F42; background-image: url(https://i.imgur.com/boJgliw.png),linear-gradient(to bottom,#F15054,#EC2F42); background-repeat: no-repeat; padding: 20px 20px 20px 130px; line-height: 20px; border-radius: 8px; box-shadow: inset 0 0 0 1px #A0161A, inset 0 3px rgba(255,255,255,.5), 0 3px rgba(0,0,0,.2); color: #FFF; text-shadow: 1px 1px 1px rgba(0,0,0,.3); font-size: 14px; z-index: 1; margin-bottom: 20px; } #catstaff {width: 100%;} .contentbaixo { width: 100%; float: left; margin-top: 1%; } .contentstaff { width: 100%; margin-top: -10px; } .area { padding: 0 10px 0 10px; background-color: #eee; border-radius: 5px; box-shadow: 0 1px 0 rgba(0,0,0,0.3), inset 0 1px 0 rgba(255,255,255,0.5), inset 0 -1px 0 rgba(255,255,255,0.5); font-size: 18px; color: #777; line-height: 40px; margin-bottom: 10px; } .toclickstaff { background-color: #F7F7F7; float: left; margin-right: 5px; margin-bottom: 5px; cursor: pointer; padding: 13px 20px; font-size: 13px; color: #777; border-radius: 3px; transition: color 0.2s, background-color 0.2s; text-shadow: 0 1px 0 rgba(255,255,255,0.77); } .toclickstaff:hover, .selected { background-color: #616161; text-shadow: 0 1px 1px rgba(0,0,0,0.3); color: #FFF; } .contentstaff .info { background-color: #353535; border-bottom: 5px solid rgba(0,0,0,0.25); box-shadow: inset 0 0 0 2px rgba(0,0,0,0.02), inset 0 -22px rgba(0,0,0,0.05), 0 2px rgba(0,0,0,0.1); float: left; margin-left: 0; margin-top: 1%; cursor: pointer; padding: 13px 10px; font-size: 12px; color: #FFF; border-radius: 2px; transition: 1s; text-shadow: 0 1px 2px rgba(0,0,0,0.5); width: 98.5%; } .info .rank { font-weight: bold; font-size: 14px; color: #FFF; text-shadow: 0 1px 2px rgba(0,0,0,0.5); } .member { width: 245px; height: 100px; margin: 10px 10px 0 0; background-color: #EEE; border-radius: 5px; float: left; } .member .avatar { width: 65px; height: 80px; margin: 10px 0 0 10px; background-color: #FFF; background-position: -2px -10px; box-shadow: 0 2px 2px rgba(0,0,0,0.1); border-radius: 5px; float: left; } .member .user, .member .func { width: 120px; height: 40px; margin: 10px 10px 0 10px; padding: 0 15px 0 15px; background-color: #FFF; box-shadow: 0 2px 2px rgba(0,0,0,0.1); border-radius: 5px; text-overflow: ellipsis; font-size: 11px; font-weight: 700; color: #777; line-height: 40px; float: left; white-space: nowrap; overflow: hidden; } .member .func { height: 35px!important; line-height: 35px; margin-top: 5px; } </style> <script src="http://code.jquery.com/jquery-1.10.2.js"></script> <br /> <center> <div style="width: 65%;" class="vagas-staff"> Você está interessado em entrar para uma das equipes? <br /> Entre em contato com os Líderes ou Auxiliares da equipe no Habbo e saiba mais!<br /> Nossas vagas são limitadas e bem selecionadas então seja ágil para conquistá-la. </div> </center> <div class="contentstaff"> <div id="catstaff"> <div class="area"> <em class="fa fa-star" aria-hidden="true"> </em> Gestão </div> <div class="toclickstaff adm"> Administrador </div> <div class="toclickstaff lider"> Líder </div> <div class="toclickstaff aux"> Auxiliar </div> </div> <div class="clearfix"> </div> <div id="catstaff"> <div style="margin-top: 15px;" class="area"> <em class="fa fa-pencil-square-o" aria-hidden="true"> </em> Coordenação </div> <div style="opacity: .6; cursor: default;" class="toclickstaff redator"> Redator </div> <div class="toclickstaff cmkt"> Coordenador de Marketing </div> </div> <div class="clearfix"> </div> <div id="catstaff"> <div style="margin-top: 15px;" class="area"> <em class="fa fa-list-ul" aria-hidden="true"> </em> Membros </div> <div class="toclickstaff jorn"> Jornalista </div> <div class="toclickstaff pixel"> Pixel Artista </div> <div class="toclickstaff eventos"> Promotor de Eventos </div> <div class="toclickstaff tuber"> VideoTuber </div> <div class="toclickstaff divulg"> Divulgador </div> </div> <div class="clearfix"> </div> <div class="contentbaixo"> <div style="-webkit-transition: 1s; display: none; transition: 1s;" id="adm"> <div class="info"> <div class="rank"> Administrador </div> Os Administradores são a gerência técnica do portal e de tudo o que envolve o site. </div> <div class="member"> <div style="background-image: url('https://www.habbo.com.br/habbo-imaging/avatarimage?&user=Zaswes&action=std&direction=3&head_direction=3&img_format=png&gesture=std&headonly=0&size=b')" class="avatar"> </div> <div class="user"> <em class="fa fa-user" aria-hidden="true"> </em> Zaswes </div> </div> <div class="member"> <div style="background-image: url('https://www.habbo.com.br/habbo-imaging/avatarimage?&user=dr.jefferson105&action=std&direction=3&head_direction=3&img_format=png&gesture=std&headonly=0&size=b')" class="avatar"> </div> <div class="user"> <em class="fa fa-user" aria-hidden="true"> </em> dr.jefferson105 </div> </div> <div class="member"> <div style="background-image: url('https://www.habbo.com.br/habbo-imaging/avatarimage?&user=robert6966&action=std&direction=3&head_direction=3&img_format=png&gesture=std&headonly=0&size=b')" class="avatar"> </div> <div class="user"> <em class="fa fa-user" aria-hidden="true"> </em> robert6966 </div> </div> </div> <div style="-webkit-transition: 1s; display: none; transition: 1s;" id="lider"> <div class="info"> <div class="rank"> Líder </div> O Líder é o responsável pela gestão da sua área. Ele organiza a equipe que lhe compete e administra a sua área do portal. </div> <div class="member"> <div style="background-image: url('https://www.habbo.com.br/habbo-imaging/avatarimage?&user=-Husky.&action=std&direction=3&head_direction=3&img_format=png&gesture=std&headonly=0&size=b')" class="avatar"> </div> <div class="user"> <em class="fa fa-user" aria-hidden="true"> </em> -Husky. </div> <div class="func"> <em class="fa fa-list" aria-hidden="true" title="Responsável por"> </em> GOPH News </div> </div> <div class="member"> <div style="background-image: url('https://www.habbo.com.br/habbo-imaging/avatarimage?&user=sonequitaRock&action=std&direction=3&head_direction=3&img_format=png&gesture=std&headonly=0&size=b')" class="avatar"> </div> <div class="user"> <em class="fa fa-user" aria-hidden="true"> </em> sonequitaRock </div> <div class="func"> <em class="fa fa-list" aria-hidden="true" title="Responsável por"> </em> Ranking </div> </div> <div class="member"> <div style="background-image: url('https://www.habbo.com.br/habbo-imaging/avatarimage?&user=Rodrig@0.&action=std&direction=3&head_direction=3&img_format=png&gesture=std&headonly=0&size=b')" class="avatar"> </div> <div class="user"> <em class="fa fa-user" aria-hidden="true"> </em> Rodrig@0. </div> <div class="func"> <em class="fa fa-list" aria-hidden="true" title="Responsável por"> </em> Marketing </div> </div> <div class="member"> <div style="background-image: url('https://www.habbo.com.br/habbo-imaging/avatarimage?&user=legallgn.ban&action=std&direction=3&head_direction=3&img_format=png&gesture=std&headonly=0&size=b')" class="avatar"> </div> <div class="user"> <em class="fa fa-user" aria-hidden="true"> </em> legallgn.ban </div> <div class="func"> <em class="fa fa-list" aria-hidden="true" title="Responsável por"> </em> Marketing </div> </div> </div> <div style="-webkit-transition: 1s; display: none; transition: 1s;" id="aux"> <div class="info"> <div class="rank"> Auxiliar </div> O Auxiliar é o sub-responsável pela gestão da sua área. Ele ajuda o Líder a organizar a equipe que lhe compete e coordena a sua área do portal. </div> <div class="member"> <div style="background-image: url('https://www.habbo.com.br/habbo-imaging/avatarimage?&user=Zeus.Ricos&action=std&direction=3&head_direction=3&img_format=png&gesture=std&headonly=0&size=b')" class="avatar"> </div> <div class="user"> <em class="fa fa-user" aria-hidden="true"> </em> Zeus.Ricos </div> <div class="func"> <em class="fa fa-list" aria-hidden="true" title="Responsável por"> </em> GOPH News </div> </div> <div class="member"> <div style="background-image: url('https://www.habbo.com.br/habbo-imaging/avatarimage?&user=.Diiiva.&action=std&direction=3&head_direction=3&img_format=png&gesture=std&headonly=0&size=b')" class="avatar"> </div> <div class="user"> <em class="fa fa-user" aria-hidden="true"> </em> .Diiiva. </div> <div class="func"> <em class="fa fa-list" aria-hidden="true" title="Responsável por"> </em> Marketing </div> </div> </div> <div style="-webkit-transition: 1s; display: none; transition: 1s;" id="redator"> <div class="info"> <div class="rank"> Redator </div> O Redator é o responsável por orientar os Jornalistas e vigiar todas as noticias que são criadas, fazendo as alterações que são necessárias. </div> </div> <div style="-webkit-transition: 1s; display: none; transition: 1s;" id="cmkt"> <div class="info"> <div class="rank"> Coordenador de Marketing </div> O Coordenador de Marketing é o responsável por orientar toda a equipe de Marketing e organizar os eventos da GOPH. </div> <div class="member"> <div style="background-image: url('https://www.habbo.com.br/habbo-imaging/avatarimage?&user=-DhizzyY&action=std&direction=3&head_direction=3&img_format=png&gesture=std&headonly=0&size=b')" class="avatar"> </div> <div class="user"> <em class="fa fa-user" aria-hidden="true"> </em> -DhizzyY </div> </div> </div> <div style="-webkit-transition: 1s; display: none; transition: 1s;" id="jorn"> <div class="info"> <div class="rank"> Jornalista </div> Responsável por trazer e criar notícias no portal e deixar o conteúdo do site atualizado e com qualidade. </div> <div class="member"> <div style="background-image: url('https://www.habbo.com.br/habbo-imaging/avatarimage?&user=Ralf_GB.Ban&action=std&direction=3&head_direction=3&img_format=png&gesture=std&headonly=0&size=b')" class="avatar"> </div> <div class="user"> <em class="fa fa-user" aria-hidden="true"> </em> Ralf_GB.Ban </div> </div> <div class="member"> <div style="background-image: url('https://www.habbo.com.br/habbo-imaging/avatarimage?&user=Kevinho10Hop&action=std&direction=3&head_direction=3&img_format=png&gesture=std&headonly=0&size=b')" class="avatar"> </div> <div class="user"> <em class="fa fa-user" aria-hidden="true"> </em> Kevinho10Hop </div> </div> </div> <div style="-webkit-transition: 1s; display: none; transition: 1s;" id="pixel"> <div class="info"> <div class="rank"> Pixel Artista </div> O Pixel Artista é o responsável por criar artes e imagens das campanhas da GOPH. </div> <div class="member"> <div style="background-image: url('https://www.habbo.com.br/habbo-imaging/avatarimage?&user=-DhizzyY&action=std&direction=3&head_direction=3&img_format=png&gesture=std&headonly=0&size=b')" class="avatar"> </div> <div class="user"> <em class="fa fa-user" aria-hidden="true"> </em> -DhizzyY </div> </div> <div class="member"> <div style="background-image: url('https://www.habbo.com.br/habbo-imaging/avatarimage?&user=.Diiiva.&action=std&direction=3&head_direction=3&img_format=png&gesture=std&headonly=0&size=b')" class="avatar"> </div> <div class="user"> <em class="fa fa-user" aria-hidden="true"> </em> .Diiiva. </div> </div> </div> <div style="-webkit-transition: 1s; display: none; transition: 1s;" id="eventos"> <div class="info"> <div class="rank"> Promotor de Eventos </div> O Promotor de Eventos é o responsável por criar quartos e noticias para os eventos da GOPH. </div> <div class="member"> <div style="background-image: url('https://www.habbo.com.br/habbo-imaging/avatarimage?&user=-DhizzyY&action=std&direction=3&head_direction=3&img_format=png&gesture=std&headonly=0&size=b')" class="avatar"> </div> <div class="user"> <em class="fa fa-user" aria-hidden="true"> </em> -DhizzyY </div> </div> <div class="member"> <div style="background-image: url('https://www.habbo.com.br/habbo-imaging/avatarimage?&user=.Diiiva.&action=std&direction=3&head_direction=3&img_format=png&gesture=std&headonly=0&size=b')" class="avatar"> </div> <div class="user"> <em class="fa fa-user" aria-hidden="true"> </em> .Diiiva. </div> </div> <div class="member"> <div style="background-image: url('https://www.habbo.com.br/habbo-imaging/avatarimage?&user=Thi005&action=std&direction=3&head_direction=3&img_format=png&gesture=std&headonly=0&size=b')" class="avatar"> </div> <div class="user"> <em class="fa fa-user" aria-hidden="true"> </em> Thi005 </div> </div> </div> <div style="-webkit-transition: 1s; display: none; transition: 1s;" id="tuber"> <div class="info"> <div class="rank"> VideoTuber </div> O VideoTuber é o responsável por criar vídeos e produções audiovisuais para os eventos da GOPH. </div> <div class="member"> <div style="background-image: url('https://www.habbo.com.br/habbo-imaging/avatarimage?&user=Paranoic&action=std&direction=3&head_direction=3&img_format=png&gesture=std&headonly=0&size=b')" class="avatar"> </div> <div class="user"> <em class="fa fa-user" aria-hidden="true"> </em> Paranoic </div> </div> <div class="member"> <div style="background-image: url('https://www.habbo.com.br/habbo-imaging/avatarimage?&user=Grettin&action=std&direction=3&head_direction=3&img_format=png&gesture=std&headonly=0&size=b')" class="avatar"> </div> <div class="user"> <em class="fa fa-user" aria-hidden="true"> </em> Grettin </div> </div> </div> <div style="-webkit-transition: 1s; display: none; transition: 1s;" id="divulg"> <div class="info"> <div class="rank"> Divulgador </div> Responsável por divulgar o portal e os eventos pelos quartos e outros sites relacionados ao Habbo. </div> <div class="member"> <div style="background-image: url('https://www.habbo.com.br/habbo-imaging/avatarimage?&user=legallgn.ban&action=std&direction=3&head_direction=3&img_format=png&gesture=std&headonly=0&size=b')" class="avatar"> </div> <div class="user"> <em class="fa fa-user" aria-hidden="true"> </em> legallgn.ban </div> </div> </div> </div><script> $('.toclickstaff').click(function(event) { if($(event.target).hasClass('adm')) { $('.adm').addClass("selected"); $('.lider').removeClass("selected"); $('.aux').removeClass("selected"); $('.redator').removeClass("selected"); $('.cmkt').removeClass("selected"); $('.jorn').removeClass("selected"); $('.pixel').removeClass("selected"); $('.eventos').removeClass("selected"); $('.tuber').removeClass("selected"); $('.divulg').removeClass("selected"); $('#adm').show(500); $('#lider').hide(500); $('#aux').hide(500); $('#redator').hide(500); $('#cmkt').hide(500); $('#jorn').hide(500); $('#pixel').hide(500); $('#eventos').hide(500); $('#tuber').hide(500); $('#divulg').hide(500); } else if($(event.target).hasClass('lider')) { $('.adm').removeClass("selected"); $('.lider').addClass("selected"); $('.aux').removeClass("selected"); $('.redator').removeClass("selected"); $('.cmkt').removeClass("selected"); $('.jorn').removeClass("selected"); $('.pixel').removeClass("selected"); $('.eventos').removeClass("selected"); $('.tuber').removeClass("selected"); $('.divulg').removeClass("selected"); $('#adm').hide(500); $('#lider').show(500); $('#aux').hide(500); $('#redator').hide(500); $('#cmkt').hide(500); $('#jorn').hide(500); $('#pixel').hide(500); $('#eventos').hide(500); $('#tuber').hide(500); $('#divulg').hide(500); } else if($(event.target).hasClass('aux')) { $('.adm').removeClass("selected"); $('.lider').removeClass("selected"); $('.aux').addClass("selected"); $('.redator').removeClass("selected"); $('.cmkt').removeClass("selected"); $('.jorn').removeClass("selected"); $('.pixel').removeClass("selected"); $('.eventos').removeClass("selected"); $('.tuber').removeClass("selected"); $('.divulg').removeClass("selected"); $('#adm').hide(500); $('#lider').hide(500); $('#aux').show(500); $('#redator').hide(500); $('#cmkt').hide(500); $('#jorn').hide(500); $('#pixel').hide(500); $('#eventos').hide(500); $('#tuber').hide(500); $('#divulg').hide(500); } /* else if($(event.target).hasClass('redator')) { $('.adm').removeClass("selected"); $('.lider').removeClass("selected"); $('.aux').removeClass("selected"); $('.redator').addClass("selected"); $('.cmkt').removeClass("selected"); $('.jorn').removeClass("selected"); $('.pixel').removeClass("selected"); $('.eventos').removeClass("selected"); $('.tuber').removeClass("selected"); $('.divulg').removeClass("selected"); $('#adm').hide(500); $('#lider').hide(500); $('#aux').hide(500); $('#redator').show(500); $('#cmkt').hide(500); $('#jorn').hide(500); $('#pixel').hide(500); $('#eventos').hide(500); $('#tuber').hide(500); $('#divulg').hide(500); } */ else if($(event.target).hasClass('cmkt')) { $('.adm').removeClass("selected"); $('.lider').removeClass("selected"); $('.aux').removeClass("selected"); $('.redator').removeClass("selected"); $('.cmkt').addClass("selected"); $('.jorn').removeClass("selected"); $('.pixel').removeClass("selected"); $('.eventos').removeClass("selected"); $('.tuber').removeClass("selected"); $('.divulg').removeClass("selected"); $('#adm').hide(500); $('#lider').hide(500); $('#aux').hide(500); $('#redator').hide(500); $('#cmkt').show(500); $('#jorn').hide(500); $('#pixel').hide(500); $('#eventos').hide(500); $('#tuber').hide(500); $('#divulg').hide(500); } else if($(event.target).hasClass('jorn')) { $('.adm').removeClass("selected"); $('.lider').removeClass("selected"); $('.aux').removeClass("selected"); $('.redator').removeClass("selected"); $('.cmkt').removeClass("selected"); $('.jorn').addClass("selected"); $('.pixel').removeClass("selected"); $('.eventos').removeClass("selected"); $('.tuber').removeClass("selected"); $('.divulg').removeClass("selected"); $('#adm').hide(500); $('#lider').hide(500); $('#aux').hide(500); $('#redator').hide(500); $('#cmkt').hide(500); $('#jorn').show(500); $('#pixel').hide(500); $('#eventos').hide(500); $('#tuber').hide(500); $('#divulg').hide(500); } else if($(event.target).hasClass('pixel')) { $('.adm').removeClass("selected"); $('.lider').removeClass("selected"); $('.aux').removeClass("selected"); $('.redator').removeClass("selected"); $('.cmkt').removeClass("selected"); $('.jorn').removeClass("selected"); $('.pixel').addClass("selected"); $('.eventos').removeClass("selected"); $('.tuber').removeClass("selected"); $('.divulg').removeClass("selected"); $('#adm').hide(500); $('#lider').hide(500); $('#aux').hide(500); $('#redator').hide(500); $('#cmkt').hide(500); $('#jorn').hide(500); $('#pixel').show(500); $('#eventos').hide(500); $('#tuber').hide(500); $('#divulg').hide(500); } else if($(event.target).hasClass('eventos')) { $('.adm').removeClass("selected"); $('.lider').removeClass("selected"); $('.aux').removeClass("selected"); $('.redator').removeClass("selected"); $('.cmkt').removeClass("selected"); $('.jorn').removeClass("selected"); $('.pixel').removeClass("selected"); $('.eventos').addClass("selected"); $('.tuber').removeClass("selected"); $('.divulg').removeClass("selected"); $('#adm').hide(500); $('#lider').hide(500); $('#aux').hide(500); $('#redator').hide(500); $('#cmkt').hide(500); $('#jorn').hide(500); $('#pixel').hide(500); $('#eventos').show(500); $('#tuber').hide(500); $('#divulg').hide(500); } else if($(event.target).hasClass('tuber')) { $('.adm').removeClass("selected"); $('.lider').removeClass("selected"); $('.aux').removeClass("selected"); $('.redator').removeClass("selected"); $('.cmkt').removeClass("selected"); $('.jorn').removeClass("selected"); $('.pixel').removeClass("selected"); $('.eventos').removeClass("selected"); $('.tuber').addClass("selected"); $('.divulg').removeClass("selected"); $('#adm').hide(500); $('#lider').hide(500); $('#aux').hide(500); $('#redator').hide(500); $('#cmkt').hide(500); $('#jorn').hide(500); $('#pixel').hide(500); $('#eventos').hide(500); $('#tuber').show(500); $('#divulg').hide(500); } else if($(event.target).hasClass('divulg')) { $('.adm').removeClass("selected"); $('.lider').removeClass("selected"); $('.aux').removeClass("selected"); $('.redator').removeClass("selected"); $('.cmkt').removeClass("selected"); $('.jorn').removeClass("selected"); $('.pixel').removeClass("selected"); $('.eventos').removeClass("selected"); $('.tuber').removeClass("selected"); $('.divulg').addClass("selected"); $('#adm').hide(500); $('#lider').hide(500); $('#aux').hide(500); $('#redator').hide(500); $('#cmkt').hide(500); $('#jorn').hide(500); $('#pixel').hide(500); $('#eventos').hide(500); $('#tuber').hide(500); $('#divulg').show(500); } }); </script> </div> <div style="clear: both;"> </div> </div>

por **tikky** 03.11.18 20:53

Olá @peidokdl,
Mude a sua página para:

Código:: <!DOCTYPE html> <html> <head> <meta charset="UTF-8" /> <meta http-equiv="X-UA-Compatible" content="IE=edge" /> <meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no" /> <title>Página Equipe</title> <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> </head> <body> <br /> <div itemprop="description articleBody" id="post-body-5381674225246114274" class="corpo"><style type="text/css"> .vagas-staff { background-color: #EC2F42; background-image: url(https://i.imgur.com/boJgliw.png),linear-gradient(to bottom,#F15054,#EC2F42); background-repeat: no-repeat; padding: 20px 20px 20px 130px; line-height: 20px; border-radius: 8px; box-shadow: inset 0 0 0 1px #A0161A, inset 0 3px rgba(255,255,255,.5), 0 3px rgba(0,0,0,.2); color: #FFF; text-shadow: 1px 1px 1px rgba(0,0,0,.3); font-size: 14px; z-index: 1; margin-bottom: 20px; } #catstaff {width: 100%;} .contentbaixo { width: 100%; float: left; margin-top: 1%; } .contentstaff { width: 100%; margin-top: -10px; } .area { padding: 0 10px 0 10px; background-color: #eee; border-radius: 5px; box-shadow: 0 1px 0 rgba(0,0,0,0.3), inset 0 1px 0 rgba(255,255,255,0.5), inset 0 -1px 0 rgba(255,255,255,0.5); font-size: 18px; color: #777; line-height: 40px; margin-bottom: 10px; } .toclickstaff { background-color: #F7F7F7; float: left; margin-right: 5px; margin-bottom: 5px; cursor: pointer; padding: 13px 20px; font-size: 13px; color: #777; border-radius: 3px; transition: color 0.2s, background-color 0.2s; text-shadow: 0 1px 0 rgba(255,255,255,0.77); } .toclickstaff:hover, .selected { background-color: #616161; text-shadow: 0 1px 1px rgba(0,0,0,0.3); color: #FFF; } .contentstaff .info { background-color: #353535; border-bottom: 5px solid rgba(0,0,0,0.25); box-shadow: inset 0 0 0 2px rgba(0,0,0,0.02), inset 0 -22px rgba(0,0,0,0.05), 0 2px rgba(0,0,0,0.1); float: left; margin-left: 0; margin-top: 1%; cursor: pointer; padding: 13px 10px; font-size: 12px; color: #FFF; border-radius: 2px; transition: 1s; text-shadow: 0 1px 2px rgba(0,0,0,0.5); width: 98.5%; } .info .rank { font-weight: bold; font-size: 14px; color: #FFF; text-shadow: 0 1px 2px rgba(0,0,0,0.5); } .member { width: 245px; height: 100px; margin: 10px 10px 0 0; background-color: #EEE; border-radius: 5px; float: left; } .member .avatar { width: 65px; height: 80px; margin: 10px 0 0 10px; background-color: #FFF; background-position: -2px -10px; box-shadow: 0 2px 2px rgba(0,0,0,0.1); border-radius: 50%; float: left; } .member .user, .member .func { width: 120px; height: 40px; margin: 10px 10px 0 10px; padding: 0 15px 0 15px; background-color: #FFF; box-shadow: 0 2px 2px rgba(0,0,0,0.1); border-radius: 5px; text-overflow: ellipsis; font-size: 11px; font-weight: 700; color: #777; line-height: 40px; float: left; white-space: nowrap; overflow: hidden; } .member .func { height: 35px!important; line-height: 35px; margin-top: 5px; } </style> <script src="http://code.jquery.com/jquery-1.10.2.js"></script> <br /> <center> <div style="width: 65%;" class="vagas-staff"> Você está interessado em entrar para uma das equipes? <br /> Entre em contato com os Líderes ou Auxiliares da equipe no Habbo e saiba mais!<br /> Nossas vagas são limitadas e bem selecionadas então seja ágil para conquistá-la. </div> </center> <div class="contentstaff"> <div id="catstaff"> <div class="area"> <em class="fa fa-star" aria-hidden="true"> </em> Gestão </div> <div class="toclickstaff adm"> Administrador </div> <div class="toclickstaff lider"> Líder </div> <div class="toclickstaff aux"> Auxiliar </div> </div> <div class="clearfix"> </div> <div id="catstaff"> <div style="margin-top: 15px;" class="area"> <em class="fa fa-pencil-square-o" aria-hidden="true"> </em> Coordenação </div> <div style="opacity: .6; cursor: default;" class="toclickstaff redator"> Redator </div> <div class="toclickstaff cmkt"> Coordenador de Marketing </div> </div> <div class="clearfix"> </div> <div id="catstaff"> <div style="margin-top: 15px;" class="area"> <em class="fa fa-list-ul" aria-hidden="true"> </em> Membros </div> <div class="toclickstaff jorn"> Jornalista </div> <div class="toclickstaff pixel"> Pixel Artista </div> <div class="toclickstaff eventos"> Promotor de Eventos </div> <div class="toclickstaff tuber"> VideoTuber </div> <div class="toclickstaff divulg"> Divulgador </div> </div> <div class="clearfix"> </div> <div class="contentbaixo"> <div style="-webkit-transition: 1s; display: none; transition: 1s;" id="adm"> <div class="info"> <div class="rank"> Administrador </div> Os Administradores são a gerência técnica do portal e de tudo o que envolve o site. </div> <div class="member"> <div style="background-image: url('https://www.habbo.com.br/habbo-imaging/avatarimage?&user=Zaswes&action=std&direction=3&head_direction=3&img_format=png&gesture=std&headonly=0&size=b')" class="avatar"> </div> <div class="user"> <em class="fa fa-user" aria-hidden="true"> </em> Zaswes </div> </div> <div class="member"> <div style="background-image: url('https://www.habbo.com.br/habbo-imaging/avatarimage?&user=dr.jefferson105&action=std&direction=3&head_direction=3&img_format=png&gesture=std&headonly=0&size=b')" class="avatar"> </div> <div class="user"> <em class="fa fa-user" aria-hidden="true"> </em> dr.jefferson105 </div> </div> <div class="member"> <div style="background-image: url('https://www.habbo.com.br/habbo-imaging/avatarimage?&user=robert6966&action=std&direction=3&head_direction=3&img_format=png&gesture=std&headonly=0&size=b')" class="avatar"> </div> <div class="user"> <em class="fa fa-user" aria-hidden="true"> </em> robert6966 </div> </div> </div> <div style="-webkit-transition: 1s; display: none; transition: 1s;" id="lider"> <div class="info"> <div class="rank"> Líder </div> O Líder é o responsável pela gestão da sua área. Ele organiza a equipe que lhe compete e administra a sua área do portal. </div> <div class="member"> <div style="background-image: url('https://www.habbo.com.br/habbo-imaging/avatarimage?&user=-Husky.&action=std&direction=3&head_direction=3&img_format=png&gesture=std&headonly=0&size=b')" class="avatar"> </div> <div class="user"> <em class="fa fa-user" aria-hidden="true"> </em> -Husky. </div> <div class="func"> <em class="fa fa-list" aria-hidden="true" title="Responsável por"> </em> GOPH News </div> </div> <div class="member"> <div style="background-image: url('https://www.habbo.com.br/habbo-imaging/avatarimage?&user=sonequitaRock&action=std&direction=3&head_direction=3&img_format=png&gesture=std&headonly=0&size=b')" class="avatar"> </div> <div class="user"> <em class="fa fa-user" aria-hidden="true"> </em> sonequitaRock </div> <div class="func"> <em class="fa fa-list" aria-hidden="true" title="Responsável por"> </em> Ranking </div> </div> <div class="member"> <div style="background-image: url('https://www.habbo.com.br/habbo-imaging/avatarimage?&user=Rodrig@0.&action=std&direction=3&head_direction=3&img_format=png&gesture=std&headonly=0&size=b')" class="avatar"> </div> <div class="user"> <em class="fa fa-user" aria-hidden="true"> </em> Rodrig@0. </div> <div class="func"> <em class="fa fa-list" aria-hidden="true" title="Responsável por"> </em> Marketing </div> </div> <div class="member"> <div style="background-image: url('https://www.habbo.com.br/habbo-imaging/avatarimage?&user=legallgn.ban&action=std&direction=3&head_direction=3&img_format=png&gesture=std&headonly=0&size=b')" class="avatar"> </div> <div class="user"> <em class="fa fa-user" aria-hidden="true"> </em> legallgn.ban </div> <div class="func"> <em class="fa fa-list" aria-hidden="true" title="Responsável por"> </em> Marketing </div> </div> </div> <div style="-webkit-transition: 1s; display: none; transition: 1s;" id="aux"> <div class="info"> <div class="rank"> Auxiliar </div> O Auxiliar é o sub-responsável pela gestão da sua área. Ele ajuda o Líder a organizar a equipe que lhe compete e coordena a sua área do portal. </div> <div class="member"> <div style="background-image: url('https://www.habbo.com.br/habbo-imaging/avatarimage?&user=Zeus.Ricos&action=std&direction=3&head_direction=3&img_format=png&gesture=std&headonly=0&size=b')" class="avatar"> </div> <div class="user"> <em class="fa fa-user" aria-hidden="true"> </em> Zeus.Ricos </div> <div class="func"> <em class="fa fa-list" aria-hidden="true" title="Responsável por"> </em> GOPH News </div> </div> <div class="member"> <div style="background-image: url('https://www.habbo.com.br/habbo-imaging/avatarimage?&user=.Diiiva.&action=std&direction=3&head_direction=3&img_format=png&gesture=std&headonly=0&size=b')" class="avatar"> </div> <div class="user"> <em class="fa fa-user" aria-hidden="true"> </em> .Diiiva. </div> <div class="func"> <em class="fa fa-list" aria-hidden="true" title="Responsável por"> </em> Marketing </div> </div> </div> <div style="-webkit-transition: 1s; display: none; transition: 1s;" id="redator"> <div class="info"> <div class="rank"> Redator </div> O Redator é o responsável por orientar os Jornalistas e vigiar todas as noticias que são criadas, fazendo as alterações que são necessárias. </div> </div> <div style="-webkit-transition: 1s; display: none; transition: 1s;" id="cmkt"> <div class="info"> <div class="rank"> Coordenador de Marketing </div> O Coordenador de Marketing é o responsável por orientar toda a equipe de Marketing e organizar os eventos da GOPH. </div> <div class="member"> <div style="background-image: url('https://www.habbo.com.br/habbo-imaging/avatarimage?&user=-DhizzyY&action=std&direction=3&head_direction=3&img_format=png&gesture=std&headonly=0&size=b')" class="avatar"> </div> <div class="user"> <em class="fa fa-user" aria-hidden="true"> </em> -DhizzyY </div> </div> </div> <div style="-webkit-transition: 1s; display: none; transition: 1s;" id="jorn"> <div class="info"> <div class="rank"> Jornalista </div> Responsável por trazer e criar notícias no portal e deixar o conteúdo do site atualizado e com qualidade. </div> <div class="member"> <div style="background-image: url('https://www.habbo.com.br/habbo-imaging/avatarimage?&user=Ralf_GB.Ban&action=std&direction=3&head_direction=3&img_format=png&gesture=std&headonly=0&size=b')" class="avatar"> </div> <div class="user"> <em class="fa fa-user" aria-hidden="true"> </em> Ralf_GB.Ban </div> </div> <div class="member"> <div style="background-image: url('https://www.habbo.com.br/habbo-imaging/avatarimage?&user=Kevinho10Hop&action=std&direction=3&head_direction=3&img_format=png&gesture=std&headonly=0&size=b')" class="avatar"> </div> <div class="user"> <em class="fa fa-user" aria-hidden="true"> </em> Kevinho10Hop </div> </div> </div> <div style="-webkit-transition: 1s; display: none; transition: 1s;" id="pixel"> <div class="info"> <div class="rank"> Pixel Artista </div> O Pixel Artista é o responsável por criar artes e imagens das campanhas da GOPH. </div> <div class="member"> <div style="background-image: url('https://www.habbo.com.br/habbo-imaging/avatarimage?&user=-DhizzyY&action=std&direction=3&head_direction=3&img_format=png&gesture=std&headonly=0&size=b')" class="avatar"> </div> <div class="user"> <em class="fa fa-user" aria-hidden="true"> </em> -DhizzyY </div> </div> <div class="member"> <div style="background-image: url('https://www.habbo.com.br/habbo-imaging/avatarimage?&user=.Diiiva.&action=std&direction=3&head_direction=3&img_format=png&gesture=std&headonly=0&size=b')" class="avatar"> </div> <div class="user"> <em class="fa fa-user" aria-hidden="true"> </em> .Diiiva. </div> </div> </div> <div style="-webkit-transition: 1s; display: none; transition: 1s;" id="eventos"> <div class="info"> <div class="rank"> Promotor de Eventos </div> O Promotor de Eventos é o responsável por criar quartos e noticias para os eventos da GOPH. </div> <div class="member"> <div style="background-image: url('https://www.habbo.com.br/habbo-imaging/avatarimage?&user=-DhizzyY&action=std&direction=3&head_direction=3&img_format=png&gesture=std&headonly=0&size=b')" class="avatar"> </div> <div class="user"> <em class="fa fa-user" aria-hidden="true"> </em> -DhizzyY </div> </div> <div class="member"> <div style="background-image: url('https://www.habbo.com.br/habbo-imaging/avatarimage?&user=.Diiiva.&action=std&direction=3&head_direction=3&img_format=png&gesture=std&headonly=0&size=b')" class="avatar"> </div> <div class="user"> <em class="fa fa-user" aria-hidden="true"> </em> .Diiiva. </div> </div> <div class="member"> <div style="background-image: url('https://www.habbo.com.br/habbo-imaging/avatarimage?&user=Thi005&action=std&direction=3&head_direction=3&img_format=png&gesture=std&headonly=0&size=b')" class="avatar"> </div> <div class="user"> <em class="fa fa-user" aria-hidden="true"> </em> Thi005 </div> </div> </div> <div style="-webkit-transition: 1s; display: none; transition: 1s;" id="tuber"> <div class="info"> <div class="rank"> VideoTuber </div> O VideoTuber é o responsável por criar vídeos e produções audiovisuais para os eventos da GOPH. </div> <div class="member"> <div style="background-image: url('https://www.habbo.com.br/habbo-imaging/avatarimage?&user=Paranoic&action=std&direction=3&head_direction=3&img_format=png&gesture=std&headonly=0&size=b')" class="avatar"> </div> <div class="user"> <em class="fa fa-user" aria-hidden="true"> </em> Paranoic </div> </div> <div class="member"> <div style="background-image: url('https://www.habbo.com.br/habbo-imaging/avatarimage?&user=Grettin&action=std&direction=3&head_direction=3&img_format=png&gesture=std&headonly=0&size=b')" class="avatar"> </div> <div class="user"> <em class="fa fa-user" aria-hidden="true"> </em> Grettin </div> </div> </div> <div style="-webkit-transition: 1s; display: none; transition: 1s;" id="divulg"> <div class="info"> <div class="rank"> Divulgador </div> Responsável por divulgar o portal e os eventos pelos quartos e outros sites relacionados ao Habbo. </div> <div class="member"> <div style="background-image: url('https://www.habbo.com.br/habbo-imaging/avatarimage?&user=legallgn.ban&action=std&direction=3&head_direction=3&img_format=png&gesture=std&headonly=0&size=b')" class="avatar"> </div> <div class="user"> <em class="fa fa-user" aria-hidden="true"> </em> legallgn.ban </div> </div> </div> </div><script> $('.toclickstaff').click(function(event) { if($(event.target).hasClass('adm')) { $('.adm').addClass("selected"); $('.lider').removeClass("selected"); $('.aux').removeClass("selected"); $('.redator').removeClass("selected"); $('.cmkt').removeClass("selected"); $('.jorn').removeClass("selected"); $('.pixel').removeClass("selected"); $('.eventos').removeClass("selected"); $('.tuber').removeClass("selected"); $('.divulg').removeClass("selected"); $('#adm').show(500); $('#lider').hide(500); $('#aux').hide(500); $('#redator').hide(500); $('#cmkt').hide(500); $('#jorn').hide(500); $('#pixel').hide(500); $('#eventos').hide(500); $('#tuber').hide(500); $('#divulg').hide(500); } else if($(event.target).hasClass('lider')) { $('.adm').removeClass("selected"); $('.lider').addClass("selected"); $('.aux').removeClass("selected"); $('.redator').removeClass("selected"); $('.cmkt').removeClass("selected"); $('.jorn').removeClass("selected"); $('.pixel').removeClass("selected"); $('.eventos').removeClass("selected"); $('.tuber').removeClass("selected"); $('.divulg').removeClass("selected"); $('#adm').hide(500); $('#lider').show(500); $('#aux').hide(500); $('#redator').hide(500); $('#cmkt').hide(500); $('#jorn').hide(500); $('#pixel').hide(500); $('#eventos').hide(500); $('#tuber').hide(500); $('#divulg').hide(500); } else if($(event.target).hasClass('aux')) { $('.adm').removeClass("selected"); $('.lider').removeClass("selected"); $('.aux').addClass("selected"); $('.redator').removeClass("selected"); $('.cmkt').removeClass("selected"); $('.jorn').removeClass("selected"); $('.pixel').removeClass("selected"); $('.eventos').removeClass("selected"); $('.tuber').removeClass("selected"); $('.divulg').removeClass("selected"); $('#adm').hide(500); $('#lider').hide(500); $('#aux').show(500); $('#redator').hide(500); $('#cmkt').hide(500); $('#jorn').hide(500); $('#pixel').hide(500); $('#eventos').hide(500); $('#tuber').hide(500); $('#divulg').hide(500); } /* else if($(event.target).hasClass('redator')) { $('.adm').removeClass("selected"); $('.lider').removeClass("selected"); $('.aux').removeClass("selected"); $('.redator').addClass("selected"); $('.cmkt').removeClass("selected"); $('.jorn').removeClass("selected"); $('.pixel').removeClass("selected"); $('.eventos').removeClass("selected"); $('.tuber').removeClass("selected"); $('.divulg').removeClass("selected"); $('#adm').hide(500); $('#lider').hide(500); $('#aux').hide(500); $('#redator').show(500); $('#cmkt').hide(500); $('#jorn').hide(500); $('#pixel').hide(500); $('#eventos').hide(500); $('#tuber').hide(500); $('#divulg').hide(500); } */ else if($(event.target).hasClass('cmkt')) { $('.adm').removeClass("selected"); $('.lider').removeClass("selected"); $('.aux').removeClass("selected"); $('.redator').removeClass("selected"); $('.cmkt').addClass("selected"); $('.jorn').removeClass("selected"); $('.pixel').removeClass("selected"); $('.eventos').removeClass("selected"); $('.tuber').removeClass("selected"); $('.divulg').removeClass("selected"); $('#adm').hide(500); $('#lider').hide(500); $('#aux').hide(500); $('#redator').hide(500); $('#cmkt').show(500); $('#jorn').hide(500); $('#pixel').hide(500); $('#eventos').hide(500); $('#tuber').hide(500); $('#divulg').hide(500); } else if($(event.target).hasClass('jorn')) { $('.adm').removeClass("selected"); $('.lider').removeClass("selected"); $('.aux').removeClass("selected"); $('.redator').removeClass("selected"); $('.cmkt').removeClass("selected"); $('.jorn').addClass("selected"); $('.pixel').removeClass("selected"); $('.eventos').removeClass("selected"); $('.tuber').removeClass("selected"); $('.divulg').removeClass("selected"); $('#adm').hide(500); $('#lider').hide(500); $('#aux').hide(500); $('#redator').hide(500); $('#cmkt').hide(500); $('#jorn').show(500); $('#pixel').hide(500); $('#eventos').hide(500); $('#tuber').hide(500); $('#divulg').hide(500); } else if($(event.target).hasClass('pixel')) { $('.adm').removeClass("selected"); $('.lider').removeClass("selected"); $('.aux').removeClass("selected"); $('.redator').removeClass("selected"); $('.cmkt').removeClass("selected"); $('.jorn').removeClass("selected"); $('.pixel').addClass("selected"); $('.eventos').removeClass("selected"); $('.tuber').removeClass("selected"); $('.divulg').removeClass("selected"); $('#adm').hide(500); $('#lider').hide(500); $('#aux').hide(500); $('#redator').hide(500); $('#cmkt').hide(500); $('#jorn').hide(500); $('#pixel').show(500); $('#eventos').hide(500); $('#tuber').hide(500); $('#divulg').hide(500); } else if($(event.target).hasClass('eventos')) { $('.adm').removeClass("selected"); $('.lider').removeClass("selected"); $('.aux').removeClass("selected"); $('.redator').removeClass("selected"); $('.cmkt').removeClass("selected"); $('.jorn').removeClass("selected"); $('.pixel').removeClass("selected"); $('.eventos').addClass("selected"); $('.tuber').removeClass("selected"); $('.divulg').removeClass("selected"); $('#adm').hide(500); $('#lider').hide(500); $('#aux').hide(500); $('#redator').hide(500); $('#cmkt').hide(500); $('#jorn').hide(500); $('#pixel').hide(500); $('#eventos').show(500); $('#tuber').hide(500); $('#divulg').hide(500); } else if($(event.target).hasClass('tuber')) { $('.adm').removeClass("selected"); $('.lider').removeClass("selected"); $('.aux').removeClass("selected"); $('.redator').removeClass("selected"); $('.cmkt').removeClass("selected"); $('.jorn').removeClass("selected"); $('.pixel').removeClass("selected"); $('.eventos').removeClass("selected"); $('.tuber').addClass("selected"); $('.divulg').removeClass("selected"); $('#adm').hide(500); $('#lider').hide(500); $('#aux').hide(500); $('#redator').hide(500); $('#cmkt').hide(500); $('#jorn').hide(500); $('#pixel').hide(500); $('#eventos').hide(500); $('#tuber').show(500); $('#divulg').hide(500); } else if($(event.target).hasClass('divulg')) { $('.adm').removeClass("selected"); $('.lider').removeClass("selected"); $('.aux').removeClass("selected"); $('.redator').removeClass("selected"); $('.cmkt').removeClass("selected"); $('.jorn').removeClass("selected"); $('.pixel').removeClass("selected"); $('.eventos').removeClass("selected"); $('.tuber').removeClass("selected"); $('.divulg').addClass("selected"); $('#adm').hide(500); $('#lider').hide(500); $('#aux').hide(500); $('#redator').hide(500); $('#cmkt').hide(500); $('#jorn').hide(500); $('#pixel').hide(500); $('#eventos').hide(500); $('#tuber').hide(500); $('#divulg').show(500); } }); </script> </div> <div style="clear: both;"> </div> </div> </body> </html>

Cordialmente,
pedxz.

por Convidado 03.11.18 21:00

A primeira parte foi corrigida, agora queria que tipo em administração aparece a foto de perfil (forma redonda) e o nome do Admin

linck do perfil http://policiamentodph.directorioforuns.com/u1

por **tikky** 03.11.18 21:28

Algum assim, reparei que faltava adicionar o link externo no FontAwesome:

Código:: <!DOCTYPE html> <html> <head> <meta charset="UTF-8" /> <meta http-equiv="X-UA-Compatible" content="IE=edge" /> <meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no" /> <title>Página Equipe</title> <link href="https://stackpath.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css" rel="stylesheet" integrity="sha384-wvfXpqpZZVQGK6TAh5PVlGOfQNHSoD2xbE+QkPxCAFlNEevoEH3Sl0sibVcOQVnN" crossorigin="anonymous"> <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> </head> <body> <br /><div itemprop="description articleBody" id="post-body-5381674225246114274" class="corpo"><style type="text/css"> .vagas-staff { background-color: #EC2F42; background-image: url(https://i.imgur.com/boJgliw.png),linear-gradient(to bottom,#F15054,#EC2F42); background-repeat: no-repeat; padding: 20px 20px 20px 130px; line-height: 20px; border-radius: 8px; box-shadow: inset 0 0 0 1px #A0161A, inset 0 3px rgba(255,255,255,.5), 0 3px rgba(0,0,0,.2); color: #FFF; text-shadow: 1px 1px 1px rgba(0,0,0,.3); font-size: 14px; z-index: 1; margin-bottom: 20px; } #catstaff {width: 100%;} .contentbaixo { width: 100%; float: left; margin-top: 1%; } .contentstaff { width: 100%; margin-top: -10px; } .area { padding: 0 10px 0 10px; background-color: #eee; border-radius: 5px; box-shadow: 0 1px 0 rgba(0,0,0,0.3), inset 0 1px 0 rgba(255,255,255,0.5), inset 0 -1px 0 rgba(255,255,255,0.5); font-size: 18px; color: #777; line-height: 40px; margin-bottom: 10px; } .toclickstaff { background-color: #F7F7F7; float: left; margin-right: 5px; margin-bottom: 5px; cursor: pointer; padding: 13px 20px; font-size: 13px; color: #777; border-radius: 3px; transition: color 0.2s, background-color 0.2s; text-shadow: 0 1px 0 rgba(255,255,255,0.77); } .toclickstaff:hover, .selected { background-color: #616161; text-shadow: 0 1px 1px rgba(0,0,0,0.3); color: #FFF; } .contentstaff .info { background-color: #353535; border-bottom: 5px solid rgba(0,0,0,0.25); box-shadow: inset 0 0 0 2px rgba(0,0,0,0.02), inset 0 -22px rgba(0,0,0,0.05), 0 2px rgba(0,0,0,0.1); float: left; margin-left: 0; margin-top: 1%; cursor: pointer; padding: 13px 10px; font-size: 12px; color: #FFF; border-radius: 2px; transition: 1s; text-shadow: 0 1px 2px rgba(0,0,0,0.5); width: 98.5%; } .info .rank { font-weight: bold; font-size: 14px; color: #FFF; text-shadow: 0 1px 2px rgba(0,0,0,0.5); } .member { width: 245px; height: 100px; margin: 10px 10px 0 0; background-color: #EEE; border-radius: 5px; float: left; } .member .avatar { width: 50px; height: 50px; background-position: center; background-size: cover; margin: 10px 0 0 10px; box-shadow: 0 2px 2px rgba(0,0,0,0.1); border-radius: 50%; float: left; } .member .user, .member .func { width: 120px; height: 40px; margin: 10px 10px 0 10px; padding: 0 15px 0 15px; background-color: #FFF; box-shadow: 0 2px 2px rgba(0,0,0,0.1); border-radius: 5px; text-overflow: ellipsis; font-size: 11px; font-weight: 700; color: #777; line-height: 40px; float: left; white-space: nowrap; overflow: hidden; } .member .func { height: 35px!important; line-height: 35px; margin-top: 5px; } </style> <script src="http://code.jquery.com/jquery-1.10.2.js"></script> <br /> <center> <div style="width: 65%;" class="vagas-staff"> Você está interessado em entrar para uma das equipes? <br /> Entre em contato com os Líderes ou Auxiliares da equipe no Habbo e saiba mais!<br /> Nossas vagas são limitadas e bem selecionadas então seja ágil para conquistá-la. </div> </center> <div class="contentstaff"> <div id="catstaff"> <div class="area"> <em class="fa fa-star" aria-hidden="true"> </em> Gestão </div> <div class="toclickstaff adm"> Administrador </div> <div class="toclickstaff lider"> Líder </div> <div class="toclickstaff aux"> Auxiliar </div> </div> <div class="clearfix"> </div> <div id="catstaff"> <div style="margin-top: 15px;" class="area"> <em class="fa fa-pencil-square-o" aria-hidden="true"> </em> Coordenação </div> <div style="opacity: .6; cursor: default;" class="toclickstaff redator"> Redator </div> <div class="toclickstaff cmkt"> Coordenador de Marketing </div> </div> <div class="clearfix"> </div> <div id="catstaff"> <div style="margin-top: 15px;" class="area"> <em class="fa fa-list-ul" aria-hidden="true"> </em> Membros </div> <div class="toclickstaff jorn"> Jornalista </div> <div class="toclickstaff pixel"> Pixel Artista </div> <div class="toclickstaff eventos"> Promotor de Eventos </div> <div class="toclickstaff tuber"> VideoTuber </div> <div class="toclickstaff divulg"> Divulgador </div> </div> <div class="clearfix"> </div> <div class="contentbaixo"> <div style="-webkit-transition: 1s; display: none; transition: 1s;" id="adm"> <div class="info"> <div class="rank"> Administrador </div> Os Administradores são a gerência técnica do portal e de tudo o que envolve o site. </div> <div class="member"> <div style="background-image: url('https://2img.net/i/fa/modernbb/pp-blank-thumb.png')" class="avatar"> </div> <div class="user"> <em class="fa fa-user" aria-hidden="true"> </em> Admin </div> </div> <div class="member"> <div style="background-image: url('https://www.habbo.com.br/habbo-imaging/avatarimage?&user=dr.jefferson105&action=std&direction=3&head_direction=3&img_format=png&gesture=std&headonly=0&size=b')" class="avatar"> </div> <div class="user"> <em class="fa fa-user" aria-hidden="true"> </em> dr.jefferson105 </div> </div> <div class="member"> <div style="background-image: url('https://www.habbo.com.br/habbo-imaging/avatarimage?&user=robert6966&action=std&direction=3&head_direction=3&img_format=png&gesture=std&headonly=0&size=b')" class="avatar"> </div> <div class="user"> <em class="fa fa-user" aria-hidden="true"> </em> robert6966 </div> </div> </div> <div style="-webkit-transition: 1s; display: none; transition: 1s;" id="lider"> <div class="info"> <div class="rank"> Líder </div> O Líder é o responsável pela gestão da sua área. Ele organiza a equipe que lhe compete e administra a sua área do portal. </div> <div class="member"> <div style="background-image: url('https://www.habbo.com.br/habbo-imaging/avatarimage?&user=-Husky.&action=std&direction=3&head_direction=3&img_format=png&gesture=std&headonly=0&size=b')" class="avatar"> </div> <div class="user"> <em class="fa fa-user" aria-hidden="true"> </em> -Husky. </div> <div class="func"> <em class="fa fa-list" aria-hidden="true" title="Responsável por"> </em> GOPH News </div> </div> <div class="member"> <div style="background-image: url('https://www.habbo.com.br/habbo-imaging/avatarimage?&user=sonequitaRock&action=std&direction=3&head_direction=3&img_format=png&gesture=std&headonly=0&size=b')" class="avatar"> </div> <div class="user"> <em class="fa fa-user" aria-hidden="true"> </em> sonequitaRock </div> <div class="func"> <em class="fa fa-list" aria-hidden="true" title="Responsável por"> </em> Ranking </div> </div> <div class="member"> <div style="background-image: url('https://www.habbo.com.br/habbo-imaging/avatarimage?&user=Rodrig@0.&action=std&direction=3&head_direction=3&img_format=png&gesture=std&headonly=0&size=b')" class="avatar"> </div> <div class="user"> <em class="fa fa-user" aria-hidden="true"> </em> Rodrig@0. </div> <div class="func"> <em class="fa fa-list" aria-hidden="true" title="Responsável por"> </em> Marketing </div> </div> <div class="member"> <div style="background-image: url('https://www.habbo.com.br/habbo-imaging/avatarimage?&user=legallgn.ban&action=std&direction=3&head_direction=3&img_format=png&gesture=std&headonly=0&size=b')" class="avatar"> </div> <div class="user"> <em class="fa fa-user" aria-hidden="true"> </em> legallgn.ban </div> <div class="func"> <em class="fa fa-list" aria-hidden="true" title="Responsável por"> </em> Marketing </div> </div> </div> <div style="-webkit-transition: 1s; display: none; transition: 1s;" id="aux"> <div class="info"> <div class="rank"> Auxiliar </div> O Auxiliar é o sub-responsável pela gestão da sua área. Ele ajuda o Líder a organizar a equipe que lhe compete e coordena a sua área do portal. </div> <div class="member"> <div style="background-image: url('https://www.habbo.com.br/habbo-imaging/avatarimage?&user=Zeus.Ricos&action=std&direction=3&head_direction=3&img_format=png&gesture=std&headonly=0&size=b')" class="avatar"> </div> <div class="user"> <em class="fa fa-user" aria-hidden="true"> </em> Zeus.Ricos </div> <div class="func"> <em class="fa fa-list" aria-hidden="true" title="Responsável por"> </em> GOPH News </div> </div> <div class="member"> <div style="background-image: url('https://www.habbo.com.br/habbo-imaging/avatarimage?&user=.Diiiva.&action=std&direction=3&head_direction=3&img_format=png&gesture=std&headonly=0&size=b')" class="avatar"> </div> <div class="user"> <em class="fa fa-user" aria-hidden="true"> </em> .Diiiva. </div> <div class="func"> <em class="fa fa-list" aria-hidden="true" title="Responsável por"> </em> Marketing </div> </div> </div> <div style="-webkit-transition: 1s; display: none; transition: 1s;" id="redator"> <div class="info"> <div class="rank"> Redator </div> O Redator é o responsável por orientar os Jornalistas e vigiar todas as noticias que são criadas, fazendo as alterações que são necessárias. </div> </div> <div style="-webkit-transition: 1s; display: none; transition: 1s;" id="cmkt"> <div class="info"> <div class="rank"> Coordenador de Marketing </div> O Coordenador de Marketing é o responsável por orientar toda a equipe de Marketing e organizar os eventos da GOPH. </div> <div class="member"> <div style="background-image: url('https://www.habbo.com.br/habbo-imaging/avatarimage?&user=-DhizzyY&action=std&direction=3&head_direction=3&img_format=png&gesture=std&headonly=0&size=b')" class="avatar"> </div> <div class="user"> <em class="fa fa-user" aria-hidden="true"> </em> -DhizzyY </div> </div> </div> <div style="-webkit-transition: 1s; display: none; transition: 1s;" id="jorn"> <div class="info"> <div class="rank"> Jornalista </div> Responsável por trazer e criar notícias no portal e deixar o conteúdo do site atualizado e com qualidade. </div> <div class="member"> <div style="background-image: url('https://www.habbo.com.br/habbo-imaging/avatarimage?&user=Ralf_GB.Ban&action=std&direction=3&head_direction=3&img_format=png&gesture=std&headonly=0&size=b')" class="avatar"> </div> <div class="user"> <em class="fa fa-user" aria-hidden="true"> </em> Ralf_GB.Ban </div> </div> <div class="member"> <div style="background-image: url('https://www.habbo.com.br/habbo-imaging/avatarimage?&user=Kevinho10Hop&action=std&direction=3&head_direction=3&img_format=png&gesture=std&headonly=0&size=b')" class="avatar"> </div> <div class="user"> <em class="fa fa-user" aria-hidden="true"> </em> Kevinho10Hop </div> </div> </div> <div style="-webkit-transition: 1s; display: none; transition: 1s;" id="pixel"> <div class="info"> <div class="rank"> Pixel Artista </div> O Pixel Artista é o responsável por criar artes e imagens das campanhas da GOPH. </div> <div class="member"> <div style="background-image: url('https://www.habbo.com.br/habbo-imaging/avatarimage?&user=-DhizzyY&action=std&direction=3&head_direction=3&img_format=png&gesture=std&headonly=0&size=b')" class="avatar"> </div> <div class="user"> <em class="fa fa-user" aria-hidden="true"> </em> -DhizzyY </div> </div> <div class="member"> <div style="background-image: url('https://www.habbo.com.br/habbo-imaging/avatarimage?&user=.Diiiva.&action=std&direction=3&head_direction=3&img_format=png&gesture=std&headonly=0&size=b')" class="avatar"> </div> <div class="user"> <em class="fa fa-user" aria-hidden="true"> </em> .Diiiva. </div> </div> </div> <div style="-webkit-transition: 1s; display: none; transition: 1s;" id="eventos"> <div class="info"> <div class="rank"> Promotor de Eventos </div> O Promotor de Eventos é o responsável por criar quartos e noticias para os eventos da GOPH. </div> <div class="member"> <div style="background-image: url('https://www.habbo.com.br/habbo-imaging/avatarimage?&user=-DhizzyY&action=std&direction=3&head_direction=3&img_format=png&gesture=std&headonly=0&size=b')" class="avatar"> </div> <div class="user"> <em class="fa fa-user" aria-hidden="true"> </em> -DhizzyY </div> </div> <div class="member"> <div style="background-image: url('https://www.habbo.com.br/habbo-imaging/avatarimage?&user=.Diiiva.&action=std&direction=3&head_direction=3&img_format=png&gesture=std&headonly=0&size=b')" class="avatar"> </div> <div class="user"> <em class="fa fa-user" aria-hidden="true"> </em> .Diiiva. </div> </div> <div class="member"> <div style="background-image: url('https://www.habbo.com.br/habbo-imaging/avatarimage?&user=Thi005&action=std&direction=3&head_direction=3&img_format=png&gesture=std&headonly=0&size=b')" class="avatar"> </div> <div class="user"> <em class="fa fa-user" aria-hidden="true"> </em> Thi005 </div> </div> </div> <div style="-webkit-transition: 1s; display: none; transition: 1s;" id="tuber"> <div class="info"> <div class="rank"> VideoTuber </div> O VideoTuber é o responsável por criar vídeos e produções audiovisuais para os eventos da GOPH. </div> <div class="member"> <div style="background-image: url('https://www.habbo.com.br/habbo-imaging/avatarimage?&user=Paranoic&action=std&direction=3&head_direction=3&img_format=png&gesture=std&headonly=0&size=b')" class="avatar"> </div> <div class="user"> <em class="fa fa-user" aria-hidden="true"> </em> Paranoic </div> </div> <div class="member"> <div style="background-image: url('https://www.habbo.com.br/habbo-imaging/avatarimage?&user=Grettin&action=std&direction=3&head_direction=3&img_format=png&gesture=std&headonly=0&size=b')" class="avatar"> </div> <div class="user"> <em class="fa fa-user" aria-hidden="true"> </em> Grettin </div> </div> </div> <div style="-webkit-transition: 1s; display: none; transition: 1s;" id="divulg"> <div class="info"> <div class="rank"> Divulgador </div> Responsável por divulgar o portal e os eventos pelos quartos e outros sites relacionados ao Habbo. </div> <div class="member"> <div style="background-image: url('https://www.habbo.com.br/habbo-imaging/avatarimage?&user=legallgn.ban&action=std&direction=3&head_direction=3&img_format=png&gesture=std&headonly=0&size=b')" class="avatar"> </div> <div class="user"> <em class="fa fa-user" aria-hidden="true"> </em> legallgn.ban </div> </div> </div> </div><script> $('.toclickstaff').click(function(event) { if($(event.target).hasClass('adm')) { $('.adm').addClass("selected"); $('.lider').removeClass("selected"); $('.aux').removeClass("selected"); $('.redator').removeClass("selected"); $('.cmkt').removeClass("selected"); $('.jorn').removeClass("selected"); $('.pixel').removeClass("selected"); $('.eventos').removeClass("selected"); $('.tuber').removeClass("selected"); $('.divulg').removeClass("selected"); $('#adm').show(500); $('#lider').hide(500); $('#aux').hide(500); $('#redator').hide(500); $('#cmkt').hide(500); $('#jorn').hide(500); $('#pixel').hide(500); $('#eventos').hide(500); $('#tuber').hide(500); $('#divulg').hide(500); } else if($(event.target).hasClass('lider')) { $('.adm').removeClass("selected"); $('.lider').addClass("selected"); $('.aux').removeClass("selected"); $('.redator').removeClass("selected"); $('.cmkt').removeClass("selected"); $('.jorn').removeClass("selected"); $('.pixel').removeClass("selected"); $('.eventos').removeClass("selected"); $('.tuber').removeClass("selected"); $('.divulg').removeClass("selected"); $('#adm').hide(500); $('#lider').show(500); $('#aux').hide(500); $('#redator').hide(500); $('#cmkt').hide(500); $('#jorn').hide(500); $('#pixel').hide(500); $('#eventos').hide(500); $('#tuber').hide(500); $('#divulg').hide(500); } else if($(event.target).hasClass('aux')) { $('.adm').removeClass("selected"); $('.lider').removeClass("selected"); $('.aux').addClass("selected"); $('.redator').removeClass("selected"); $('.cmkt').removeClass("selected"); $('.jorn').removeClass("selected"); $('.pixel').removeClass("selected"); $('.eventos').removeClass("selected"); $('.tuber').removeClass("selected"); $('.divulg').removeClass("selected"); $('#adm').hide(500); $('#lider').hide(500); $('#aux').show(500); $('#redator').hide(500); $('#cmkt').hide(500); $('#jorn').hide(500); $('#pixel').hide(500); $('#eventos').hide(500); $('#tuber').hide(500); $('#divulg').hide(500); } /* else if($(event.target).hasClass('redator')) { $('.adm').removeClass("selected"); $('.lider').removeClass("selected"); $('.aux').removeClass("selected"); $('.redator').addClass("selected"); $('.cmkt').removeClass("selected"); $('.jorn').removeClass("selected"); $('.pixel').removeClass("selected"); $('.eventos').removeClass("selected"); $('.tuber').removeClass("selected"); $('.divulg').removeClass("selected"); $('#adm').hide(500); $('#lider').hide(500); $('#aux').hide(500); $('#redator').show(500); $('#cmkt').hide(500); $('#jorn').hide(500); $('#pixel').hide(500); $('#eventos').hide(500); $('#tuber').hide(500); $('#divulg').hide(500); } */ else if($(event.target).hasClass('cmkt')) { $('.adm').removeClass("selected"); $('.lider').removeClass("selected"); $('.aux').removeClass("selected"); $('.redator').removeClass("selected"); $('.cmkt').addClass("selected"); $('.jorn').removeClass("selected"); $('.pixel').removeClass("selected"); $('.eventos').removeClass("selected"); $('.tuber').removeClass("selected"); $('.divulg').removeClass("selected"); $('#adm').hide(500); $('#lider').hide(500); $('#aux').hide(500); $('#redator').hide(500); $('#cmkt').show(500); $('#jorn').hide(500); $('#pixel').hide(500); $('#eventos').hide(500); $('#tuber').hide(500); $('#divulg').hide(500); } else if($(event.target).hasClass('jorn')) { $('.adm').removeClass("selected"); $('.lider').removeClass("selected"); $('.aux').removeClass("selected"); $('.redator').removeClass("selected"); $('.cmkt').removeClass("selected"); $('.jorn').addClass("selected"); $('.pixel').removeClass("selected"); $('.eventos').removeClass("selected"); $('.tuber').removeClass("selected"); $('.divulg').removeClass("selected"); $('#adm').hide(500); $('#lider').hide(500); $('#aux').hide(500); $('#redator').hide(500); $('#cmkt').hide(500); $('#jorn').show(500); $('#pixel').hide(500); $('#eventos').hide(500); $('#tuber').hide(500); $('#divulg').hide(500); } else if($(event.target).hasClass('pixel')) { $('.adm').removeClass("selected"); $('.lider').removeClass("selected"); $('.aux').removeClass("selected"); $('.redator').removeClass("selected"); $('.cmkt').removeClass("selected"); $('.jorn').removeClass("selected"); $('.pixel').addClass("selected"); $('.eventos').removeClass("selected"); $('.tuber').removeClass("selected"); $('.divulg').removeClass("selected"); $('#adm').hide(500); $('#lider').hide(500); $('#aux').hide(500); $('#redator').hide(500); $('#cmkt').hide(500); $('#jorn').hide(500); $('#pixel').show(500); $('#eventos').hide(500); $('#tuber').hide(500); $('#divulg').hide(500); } else if($(event.target).hasClass('eventos')) { $('.adm').removeClass("selected"); $('.lider').removeClass("selected"); $('.aux').removeClass("selected"); $('.redator').removeClass("selected"); $('.cmkt').removeClass("selected"); $('.jorn').removeClass("selected"); $('.pixel').removeClass("selected"); $('.eventos').addClass("selected"); $('.tuber').removeClass("selected"); $('.divulg').removeClass("selected"); $('#adm').hide(500); $('#lider').hide(500); $('#aux').hide(500); $('#redator').hide(500); $('#cmkt').hide(500); $('#jorn').hide(500); $('#pixel').hide(500); $('#eventos').show(500); $('#tuber').hide(500); $('#divulg').hide(500); } else if($(event.target).hasClass('tuber')) { $('.adm').removeClass("selected"); $('.lider').removeClass("selected"); $('.aux').removeClass("selected"); $('.redator').removeClass("selected"); $('.cmkt').removeClass("selected"); $('.jorn').removeClass("selected"); $('.pixel').removeClass("selected"); $('.eventos').removeClass("selected"); $('.tuber').addClass("selected"); $('.divulg').removeClass("selected"); $('#adm').hide(500); $('#lider').hide(500); $('#aux').hide(500); $('#redator').hide(500); $('#cmkt').hide(500); $('#jorn').hide(500); $('#pixel').hide(500); $('#eventos').hide(500); $('#tuber').show(500); $('#divulg').hide(500); } else if($(event.target).hasClass('divulg')) { $('.adm').removeClass("selected"); $('.lider').removeClass("selected"); $('.aux').removeClass("selected"); $('.redator').removeClass("selected"); $('.cmkt').removeClass("selected"); $('.jorn').removeClass("selected"); $('.pixel').removeClass("selected"); $('.eventos').removeClass("selected"); $('.tuber').removeClass("selected"); $('.divulg').addClass("selected"); $('#adm').hide(500); $('#lider').hide(500); $('#aux').hide(500); $('#redator').hide(500); $('#cmkt').hide(500); $('#jorn').hide(500); $('#pixel').hide(500); $('#eventos').hide(500); $('#tuber').hide(500); $('#divulg').show(500); } }); </script> </div> <div style="clear: both;"> </div> </div> </body> </html>

por Convidado 03.11.18 21:32

Exatamente isso, só que bugou http://policiamentodph.directorioforuns.com/h3-teste e quando clico no nome ele não direciona para o perfil, mais é isso.

por **tikky** 03.11.18 21:38

Agora é só duplicar o usuário Admin, têm uma indicação na página:

Código:: <!DOCTYPE html> <html> <head> <meta charset="UTF-8" /> <meta http-equiv="X-UA-Compatible" content="IE=edge" /> <meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no" /> <title>Página Equipe</title> <link href="https://stackpath.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css" rel="stylesheet" integrity="sha384-wvfXpqpZZVQGK6TAh5PVlGOfQNHSoD2xbE+QkPxCAFlNEevoEH3Sl0sibVcOQVnN" crossorigin="anonymous"> <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> </head> <body> <br /><div itemprop="description articleBody" id="post-body-5381674225246114274" class="corpo"><style type="text/css"> .vagas-staff { background-color: #EC2F42; background-image: url(https://i.imgur.com/boJgliw.png),linear-gradient(to bottom,#F15054,#EC2F42); background-repeat: no-repeat; padding: 20px 20px 20px 130px; line-height: 20px; border-radius: 8px; box-shadow: inset 0 0 0 1px #A0161A, inset 0 3px rgba(255,255,255,.5), 0 3px rgba(0,0,0,.2); color: #FFF; text-shadow: 1px 1px 1px rgba(0,0,0,.3); font-size: 14px; z-index: 1; margin-bottom: 20px; } #catstaff {width: 100%;} .contentbaixo { width: 100%; float: left; margin-top: 1%; } .contentstaff { width: 100%; margin-top: -10px; } .area { padding: 0 10px 0 10px; background-color: #eee; border-radius: 5px; box-shadow: 0 1px 0 rgba(0,0,0,0.3), inset 0 1px 0 rgba(255,255,255,0.5), inset 0 -1px 0 rgba(255,255,255,0.5); font-size: 18px; color: #777; line-height: 40px; margin-bottom: 10px; } .toclickstaff { background-color: #F7F7F7; float: left; margin-right: 5px; margin-bottom: 5px; cursor: pointer; padding: 13px 20px; font-size: 13px; color: #777; border-radius: 3px; transition: color 0.2s, background-color 0.2s; text-shadow: 0 1px 0 rgba(255,255,255,0.77); } .toclickstaff:hover, .selected { background-color: #616161; text-shadow: 0 1px 1px rgba(0,0,0,0.3); color: #FFF; } .contentstaff .info { background-color: #353535; border-bottom: 5px solid rgba(0,0,0,0.25); box-shadow: inset 0 0 0 2px rgba(0,0,0,0.02), inset 0 -22px rgba(0,0,0,0.05), 0 2px rgba(0,0,0,0.1); float: left; margin-left: 0; margin-top: 1%; cursor: pointer; padding: 13px 10px; font-size: 12px; color: #FFF; border-radius: 2px; transition: 1s; text-shadow: 0 1px 2px rgba(0,0,0,0.5); width: 98.5%; } .info .rank { font-weight: bold; font-size: 14px; color: #FFF; text-shadow: 0 1px 2px rgba(0,0,0,0.5); } .member { width: 245px; height: 100px; margin: 10px 10px 0 0; background-color: #EEE; border-radius: 5px; float: left; } .member .avatar { width: 50px; height: 50px; background-position: center; background-size: cover; margin: 10px 0 0 10px; box-shadow: 0 2px 2px rgba(0,0,0,0.1); border-radius: 50%; float: left; } .member .user, .member .func { width: 120px; height: 40px; margin: 10px 10px 0 10px; padding: 0 15px 0 15px; background-color: #FFF; box-shadow: 0 2px 2px rgba(0,0,0,0.1); border-radius: 5px; text-overflow: ellipsis; font-size: 11px; font-weight: 700; color: #777; line-height: 40px; float: left; white-space: nowrap; overflow: hidden; } .member .func { height: 35px!important; line-height: 35px; margin-top: 5px; } </style> <script src="http://code.jquery.com/jquery-1.10.2.js"></script> <br /> <center> <div style="width: 65%;" class="vagas-staff"> Você está interessado em entrar para uma das equipes? <br /> Entre em contato com os Líderes ou Auxiliares da equipe no Habbo e saiba mais!<br /> Nossas vagas são limitadas e bem selecionadas então seja ágil para conquistá-la. </div> </center> <div class="contentstaff"> <div id="catstaff"> <div class="area"> <em class="fa fa-star" aria-hidden="true"> </em> Gestão </div> <div class="toclickstaff adm"> Administrador </div> <div class="toclickstaff lider"> Líder </div> <div class="toclickstaff aux"> Auxiliar </div> </div> <div class="clearfix"> </div> <div id="catstaff"> <div style="margin-top: 15px;" class="area"> <em class="fa fa-pencil-square-o" aria-hidden="true"> </em> Coordenação </div> <div style="opacity: .6; cursor: default;" class="toclickstaff redator"> Redator </div> <div class="toclickstaff cmkt"> Coordenador de Marketing </div> </div> <div class="clearfix"> </div> <div id="catstaff"> <div style="margin-top: 15px;" class="area"> <em class="fa fa-list-ul" aria-hidden="true"> </em> Membros </div> <div class="toclickstaff jorn"> Jornalista </div> <div class="toclickstaff pixel"> Pixel Artista </div> <div class="toclickstaff eventos"> Promotor de Eventos </div> <div class="toclickstaff tuber"> VideoTuber </div> <div class="toclickstaff divulg"> Divulgador </div> </div> <div class="clearfix"> </div> <div class="contentbaixo"> <div style="-webkit-transition: 1s; display: none; transition: 1s;" id="adm"> <div class="info"> <div class="rank"> Administrador </div> Os Administradores são a gerência técnica do portal e de tudo o que envolve o site. </div>  <div class="member"> <div style="background-image: url('https://2img.net/i/fa/modernbb/pp-blank-thumb.png')" class="avatar"> </div> <div class="user"> <em class="fa fa-user" aria-hidden="true"> </em> <a href="/u1">Admin</a> </div> </div>  <div class="member"> <div style="background-image: url('https://www.habbo.com.br/habbo-imaging/avatarimage?&user=dr.jefferson105&action=std&direction=3&head_direction=3&img_format=png&gesture=std&headonly=0&size=b')" class="avatar"> </div> <div class="user"> <em class="fa fa-user" aria-hidden="true"> </em> dr.jefferson105 </div> </div> <div class="member"> <div style="background-image: url('https://www.habbo.com.br/habbo-imaging/avatarimage?&user=robert6966&action=std&direction=3&head_direction=3&img_format=png&gesture=std&headonly=0&size=b')" class="avatar"> </div> <div class="user"> <em class="fa fa-user" aria-hidden="true"> </em> robert6966 </div> </div> </div> <div style="-webkit-transition: 1s; display: none; transition: 1s;" id="lider"> <div class="info"> <div class="rank"> Líder </div> O Líder é o responsável pela gestão da sua área. Ele organiza a equipe que lhe compete e administra a sua área do portal. </div> <div class="member"> <div style="background-image: url('https://www.habbo.com.br/habbo-imaging/avatarimage?&user=-Husky.&action=std&direction=3&head_direction=3&img_format=png&gesture=std&headonly=0&size=b')" class="avatar"> </div> <div class="user"> <em class="fa fa-user" aria-hidden="true"> </em> -Husky. </div> <div class="func"> <em class="fa fa-list" aria-hidden="true" title="Responsável por"> </em> GOPH News </div> </div> <div class="member"> <div style="background-image: url('https://www.habbo.com.br/habbo-imaging/avatarimage?&user=sonequitaRock&action=std&direction=3&head_direction=3&img_format=png&gesture=std&headonly=0&size=b')" class="avatar"> </div> <div class="user"> <em class="fa fa-user" aria-hidden="true"> </em> sonequitaRock </div> <div class="func"> <em class="fa fa-list" aria-hidden="true" title="Responsável por"> </em> Ranking </div> </div> <div class="member"> <div style="background-image: url('https://www.habbo.com.br/habbo-imaging/avatarimage?&user=Rodrig@0.&action=std&direction=3&head_direction=3&img_format=png&gesture=std&headonly=0&size=b')" class="avatar"> </div> <div class="user"> <em class="fa fa-user" aria-hidden="true"> </em> Rodrig@0. </div> <div class="func"> <em class="fa fa-list" aria-hidden="true" title="Responsável por"> </em> Marketing </div> </div> <div class="member"> <div style="background-image: url('https://www.habbo.com.br/habbo-imaging/avatarimage?&user=legallgn.ban&action=std&direction=3&head_direction=3&img_format=png&gesture=std&headonly=0&size=b')" class="avatar"> </div> <div class="user"> <em class="fa fa-user" aria-hidden="true"> </em> legallgn.ban </div> <div class="func"> <em class="fa fa-list" aria-hidden="true" title="Responsável por"> </em> Marketing </div> </div> </div> <div style="-webkit-transition: 1s; display: none; transition: 1s;" id="aux"> <div class="info"> <div class="rank"> Auxiliar </div> O Auxiliar é o sub-responsável pela gestão da sua área. Ele ajuda o Líder a organizar a equipe que lhe compete e coordena a sua área do portal. </div> <div class="member"> <div style="background-image: url('https://www.habbo.com.br/habbo-imaging/avatarimage?&user=Zeus.Ricos&action=std&direction=3&head_direction=3&img_format=png&gesture=std&headonly=0&size=b')" class="avatar"> </div> <div class="user"> <em class="fa fa-user" aria-hidden="true"> </em> Zeus.Ricos </div> <div class="func"> <em class="fa fa-list" aria-hidden="true" title="Responsável por"> </em> GOPH News </div> </div> <div class="member"> <div style="background-image: url('https://www.habbo.com.br/habbo-imaging/avatarimage?&user=.Diiiva.&action=std&direction=3&head_direction=3&img_format=png&gesture=std&headonly=0&size=b')" class="avatar"> </div> <div class="user"> <em class="fa fa-user" aria-hidden="true"> </em> .Diiiva. </div> <div class="func"> <em class="fa fa-list" aria-hidden="true" title="Responsável por"> </em> Marketing </div> </div> </div> <div style="-webkit-transition: 1s; display: none; transition: 1s;" id="redator"> <div class="info"> <div class="rank"> Redator </div> O Redator é o responsável por orientar os Jornalistas e vigiar todas as noticias que são criadas, fazendo as alterações que são necessárias. </div> </div> <div style="-webkit-transition: 1s; display: none; transition: 1s;" id="cmkt"> <div class="info"> <div class="rank"> Coordenador de Marketing </div> O Coordenador de Marketing é o responsável por orientar toda a equipe de Marketing e organizar os eventos da GOPH. </div> <div class="member"> <div style="background-image: url('https://www.habbo.com.br/habbo-imaging/avatarimage?&user=-DhizzyY&action=std&direction=3&head_direction=3&img_format=png&gesture=std&headonly=0&size=b')" class="avatar"> </div> <div class="user"> <em class="fa fa-user" aria-hidden="true"> </em> -DhizzyY </div> </div> </div> <div style="-webkit-transition: 1s; display: none; transition: 1s;" id="jorn"> <div class="info"> <div class="rank"> Jornalista </div> Responsável por trazer e criar notícias no portal e deixar o conteúdo do site atualizado e com qualidade. </div> <div class="member"> <div style="background-image: url('https://www.habbo.com.br/habbo-imaging/avatarimage?&user=Ralf_GB.Ban&action=std&direction=3&head_direction=3&img_format=png&gesture=std&headonly=0&size=b')" class="avatar"> </div> <div class="user"> <em class="fa fa-user" aria-hidden="true"> </em> Ralf_GB.Ban </div> </div> <div class="member"> <div style="background-image: url('https://www.habbo.com.br/habbo-imaging/avatarimage?&user=Kevinho10Hop&action=std&direction=3&head_direction=3&img_format=png&gesture=std&headonly=0&size=b')" class="avatar"> </div> <div class="user"> <em class="fa fa-user" aria-hidden="true"> </em> Kevinho10Hop </div> </div> </div> <div style="-webkit-transition: 1s; display: none; transition: 1s;" id="pixel"> <div class="info"> <div class="rank"> Pixel Artista </div> O Pixel Artista é o responsável por criar artes e imagens das campanhas da GOPH. </div> <div class="member"> <div style="background-image: url('https://www.habbo.com.br/habbo-imaging/avatarimage?&user=-DhizzyY&action=std&direction=3&head_direction=3&img_format=png&gesture=std&headonly=0&size=b')" class="avatar"> </div> <div class="user"> <em class="fa fa-user" aria-hidden="true"> </em> -DhizzyY </div> </div> <div class="member"> <div style="background-image: url('https://www.habbo.com.br/habbo-imaging/avatarimage?&user=.Diiiva.&action=std&direction=3&head_direction=3&img_format=png&gesture=std&headonly=0&size=b')" class="avatar"> </div> <div class="user"> <em class="fa fa-user" aria-hidden="true"> </em> .Diiiva. </div> </div> </div> <div style="-webkit-transition: 1s; display: none; transition: 1s;" id="eventos"> <div class="info"> <div class="rank"> Promotor de Eventos </div> O Promotor de Eventos é o responsável por criar quartos e noticias para os eventos da GOPH. </div> <div class="member"> <div style="background-image: url('https://www.habbo.com.br/habbo-imaging/avatarimage?&user=-DhizzyY&action=std&direction=3&head_direction=3&img_format=png&gesture=std&headonly=0&size=b')" class="avatar"> </div> <div class="user"> <em class="fa fa-user" aria-hidden="true"> </em> -DhizzyY </div> </div> <div class="member"> <div style="background-image: url('https://www.habbo.com.br/habbo-imaging/avatarimage?&user=.Diiiva.&action=std&direction=3&head_direction=3&img_format=png&gesture=std&headonly=0&size=b')" class="avatar"> </div> <div class="user"> <em class="fa fa-user" aria-hidden="true"> </em> .Diiiva. </div> </div> <div class="member"> <div style="background-image: url('https://www.habbo.com.br/habbo-imaging/avatarimage?&user=Thi005&action=std&direction=3&head_direction=3&img_format=png&gesture=std&headonly=0&size=b')" class="avatar"> </div> <div class="user"> <em class="fa fa-user" aria-hidden="true"> </em> Thi005 </div> </div> </div> <div style="-webkit-transition: 1s; display: none; transition: 1s;" id="tuber"> <div class="info"> <div class="rank"> VideoTuber </div> O VideoTuber é o responsável por criar vídeos e produções audiovisuais para os eventos da GOPH. </div> <div class="member"> <div style="background-image: url('https://www.habbo.com.br/habbo-imaging/avatarimage?&user=Paranoic&action=std&direction=3&head_direction=3&img_format=png&gesture=std&headonly=0&size=b')" class="avatar"> </div> <div class="user"> <em class="fa fa-user" aria-hidden="true"> </em> Paranoic </div> </div> <div class="member"> <div style="background-image: url('https://www.habbo.com.br/habbo-imaging/avatarimage?&user=Grettin&action=std&direction=3&head_direction=3&img_format=png&gesture=std&headonly=0&size=b')" class="avatar"> </div> <div class="user"> <em class="fa fa-user" aria-hidden="true"> </em> Grettin </div> </div> </div> <div style="-webkit-transition: 1s; display: none; transition: 1s;" id="divulg"> <div class="info"> <div class="rank"> Divulgador </div> Responsável por divulgar o portal e os eventos pelos quartos e outros sites relacionados ao Habbo. </div> <div class="member"> <div style="background-image: url('https://www.habbo.com.br/habbo-imaging/avatarimage?&user=legallgn.ban&action=std&direction=3&head_direction=3&img_format=png&gesture=std&headonly=0&size=b')" class="avatar"> </div> <div class="user"> <em class="fa fa-user" aria-hidden="true"> </em> legallgn.ban </div> </div> </div> </div><script> $('.toclickstaff').click(function(event) { if($(event.target).hasClass('adm')) { $('.adm').addClass("selected"); $('.lider').removeClass("selected"); $('.aux').removeClass("selected"); $('.redator').removeClass("selected"); $('.cmkt').removeClass("selected"); $('.jorn').removeClass("selected"); $('.pixel').removeClass("selected"); $('.eventos').removeClass("selected"); $('.tuber').removeClass("selected"); $('.divulg').removeClass("selected"); $('#adm').show(500); $('#lider').hide(500); $('#aux').hide(500); $('#redator').hide(500); $('#cmkt').hide(500); $('#jorn').hide(500); $('#pixel').hide(500); $('#eventos').hide(500); $('#tuber').hide(500); $('#divulg').hide(500); } else if($(event.target).hasClass('lider')) { $('.adm').removeClass("selected"); $('.lider').addClass("selected"); $('.aux').removeClass("selected"); $('.redator').removeClass("selected"); $('.cmkt').removeClass("selected"); $('.jorn').removeClass("selected"); $('.pixel').removeClass("selected"); $('.eventos').removeClass("selected"); $('.tuber').removeClass("selected"); $('.divulg').removeClass("selected"); $('#adm').hide(500); $('#lider').show(500); $('#aux').hide(500); $('#redator').hide(500); $('#cmkt').hide(500); $('#jorn').hide(500); $('#pixel').hide(500); $('#eventos').hide(500); $('#tuber').hide(500); $('#divulg').hide(500); } else if($(event.target).hasClass('aux')) { $('.adm').removeClass("selected"); $('.lider').removeClass("selected"); $('.aux').addClass("selected"); $('.redator').removeClass("selected"); $('.cmkt').removeClass("selected"); $('.jorn').removeClass("selected"); $('.pixel').removeClass("selected"); $('.eventos').removeClass("selected"); $('.tuber').removeClass("selected"); $('.divulg').removeClass("selected"); $('#adm').hide(500); $('#lider').hide(500); $('#aux').show(500); $('#redator').hide(500); $('#cmkt').hide(500); $('#jorn').hide(500); $('#pixel').hide(500); $('#eventos').hide(500); $('#tuber').hide(500); $('#divulg').hide(500); } /* else if($(event.target).hasClass('redator')) { $('.adm').removeClass("selected"); $('.lider').removeClass("selected"); $('.aux').removeClass("selected"); $('.redator').addClass("selected"); $('.cmkt').removeClass("selected"); $('.jorn').removeClass("selected"); $('.pixel').removeClass("selected"); $('.eventos').removeClass("selected"); $('.tuber').removeClass("selected"); $('.divulg').removeClass("selected"); $('#adm').hide(500); $('#lider').hide(500); $('#aux').hide(500); $('#redator').show(500); $('#cmkt').hide(500); $('#jorn').hide(500); $('#pixel').hide(500); $('#eventos').hide(500); $('#tuber').hide(500); $('#divulg').hide(500); } */ else if($(event.target).hasClass('cmkt')) { $('.adm').removeClass("selected"); $('.lider').removeClass("selected"); $('.aux').removeClass("selected"); $('.redator').removeClass("selected"); $('.cmkt').addClass("selected"); $('.jorn').removeClass("selected"); $('.pixel').removeClass("selected"); $('.eventos').removeClass("selected"); $('.tuber').removeClass("selected"); $('.divulg').removeClass("selected"); $('#adm').hide(500); $('#lider').hide(500); $('#aux').hide(500); $('#redator').hide(500); $('#cmkt').show(500); $('#jorn').hide(500); $('#pixel').hide(500); $('#eventos').hide(500); $('#tuber').hide(500); $('#divulg').hide(500); } else if($(event.target).hasClass('jorn')) { $('.adm').removeClass("selected"); $('.lider').removeClass("selected"); $('.aux').removeClass("selected"); $('.redator').removeClass("selected"); $('.cmkt').removeClass("selected"); $('.jorn').addClass("selected"); $('.pixel').removeClass("selected"); $('.eventos').removeClass("selected"); $('.tuber').removeClass("selected"); $('.divulg').removeClass("selected"); $('#adm').hide(500); $('#lider').hide(500); $('#aux').hide(500); $('#redator').hide(500); $('#cmkt').hide(500); $('#jorn').show(500); $('#pixel').hide(500); $('#eventos').hide(500); $('#tuber').hide(500); $('#divulg').hide(500); } else if($(event.target).hasClass('pixel')) { $('.adm').removeClass("selected"); $('.lider').removeClass("selected"); $('.aux').removeClass("selected"); $('.redator').removeClass("selected"); $('.cmkt').removeClass("selected"); $('.jorn').removeClass("selected"); $('.pixel').addClass("selected"); $('.eventos').removeClass("selected"); $('.tuber').removeClass("selected"); $('.divulg').removeClass("selected"); $('#adm').hide(500); $('#lider').hide(500); $('#aux').hide(500); $('#redator').hide(500); $('#cmkt').hide(500); $('#jorn').hide(500); $('#pixel').show(500); $('#eventos').hide(500); $('#tuber').hide(500); $('#divulg').hide(500); } else if($(event.target).hasClass('eventos')) { $('.adm').removeClass("selected"); $('.lider').removeClass("selected"); $('.aux').removeClass("selected"); $('.redator').removeClass("selected"); $('.cmkt').removeClass("selected"); $('.jorn').removeClass("selected"); $('.pixel').removeClass("selected"); $('.eventos').addClass("selected"); $('.tuber').removeClass("selected"); $('.divulg').removeClass("selected"); $('#adm').hide(500); $('#lider').hide(500); $('#aux').hide(500); $('#redator').hide(500); $('#cmkt').hide(500); $('#jorn').hide(500); $('#pixel').hide(500); $('#eventos').show(500); $('#tuber').hide(500); $('#divulg').hide(500); } else if($(event.target).hasClass('tuber')) { $('.adm').removeClass("selected"); $('.lider').removeClass("selected"); $('.aux').removeClass("selected"); $('.redator').removeClass("selected"); $('.cmkt').removeClass("selected"); $('.jorn').removeClass("selected"); $('.pixel').removeClass("selected"); $('.eventos').removeClass("selected"); $('.tuber').addClass("selected"); $('.divulg').removeClass("selected"); $('#adm').hide(500); $('#lider').hide(500); $('#aux').hide(500); $('#redator').hide(500); $('#cmkt').hide(500); $('#jorn').hide(500); $('#pixel').hide(500); $('#eventos').hide(500); $('#tuber').show(500); $('#divulg').hide(500); } else if($(event.target).hasClass('divulg')) { $('.adm').removeClass("selected"); $('.lider').removeClass("selected"); $('.aux').removeClass("selected"); $('.redator').removeClass("selected"); $('.cmkt').removeClass("selected"); $('.jorn').removeClass("selected"); $('.pixel').removeClass("selected"); $('.eventos').removeClass("selected"); $('.tuber').removeClass("selected"); $('.divulg').addClass("selected"); $('#adm').hide(500); $('#lider').hide(500); $('#aux').hide(500); $('#redator').hide(500); $('#cmkt').hide(500); $('#jorn').hide(500); $('#pixel').hide(500); $('#eventos').hide(500); $('#tuber').hide(500); $('#divulg').show(500); } }); </script> </div> <div style="clear: both;"> </div> </div> </body> </html>

por Convidado 03.11.18 21:49

Tem só um erro a coordenação era para está abaixo de auxiliar como na gestão em vez de ao lado, do mesmo modo o membros. http://policiamentodph.directorioforuns.com/h2-teste

por **tikky** 04.11.18 15:37

Recriei a página, para ficar mais limpa:

Código:: <!DOCTYPE html> <html> <head> <meta charset="UTF-8" /> <meta http-equiv="X-UA-Compatible" content="IE=edge" /> <meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no" /> <title>Página Equipe</title> <link href="https://stackpath.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css" rel="stylesheet" integrity="sha384-wvfXpqpZZVQGK6TAh5PVlGOfQNHSoD2xbE+QkPxCAFlNEevoEH3Sl0sibVcOQVnN" crossorigin="anonymous" /> <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> <style type="text/css"> * { box-sizing: border-box; } .tab { font-family: sans-serif; } .tab div[class] { display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; -webkit-flex-flow: row wrap; justify-content: space-around; } .tab div[class] > button { margin: 5px; background-color: #656D77; } div.tab button { float: left; border: none; outline: none; cursor: pointer; padding: 14px 16px; transition: 0.3s; color: white; } div.tab button:hover, div.tab button.active { background-color: white; color: black; } .tabcontent { display: none; padding: 6px 12px; } .tab > h6 { max-width: 90%; background-color: #e7e9ec; height: 50px; line-height: 50px; text-indent: 50px; font-weight: 900; } .tabcontent { -webkit-animation: fadeEffect 1s; animation: fadeEffect 1s; } @-webkit-keyframes fadeEffect { from { opacity: 0; } to { opacity: 1; } } @keyframes fadeEffect { from { opacity: 0; } to { opacity: 1; } } .container { margin: 20px auto; width: 70%; } .vagas-staff p:first-child { padding-top: 20px; } .vagas-staff p { line-height: 9px; } .vagas-staff { width: 100%; height: 140px; text-indent: 126px; background-color: #EC2F42; background-image: url(https://i.imgur.com/boJgliw.png), linear-gradient(to bottom, #F15054, #EC2F42); background-repeat: no-repeat; padding: 1em; border-radius: 8px; box-shadow: inset 0 0 0 1px #A0161A, inset 0 3px rgba(255, 255, 255, .5), 0 3px rgba(0, 0, 0, .2); color: #FFF; text-shadow: 1px 1px 1px rgba(0, 0, 0, .3); font-size: 14px; margin: 15px auto 15px auto; } .area { padding: 0 10px 0 10px; background-color: #eee; border-radius: 5px; box-shadow: 0 1px 0 rgba(0, 0, 0, 0.3), inset 0 1px 0 rgba(255, 255, 255, 0.5), inset 0 -1px 0 rgba(255, 255, 255, 0.5); font-size: 18px; color: #777; line-height: 40px; margin-bottom: 10px; } .rule { font-size: 14px; color: #FFF; text-shadow: 0 1px 2px rgba(0, 0, 0, 0.5); background-color: #353535; border-bottom: 5px solid rgba(0, 0, 0, 0.25); box-shadow: inset 0 0 0 2px rgba(0, 0, 0, 0.02), inset 0 -22px rgba(0, 0, 0, 0.05), 0 2px rgba(0, 0, 0, 0.1); cursor: pointer; padding: 1em; font-size: 12px; color: #FFF; border-radius: 2px; transition: 1s; text-shadow: 0 1px 2px rgba(0, 0, 0, 0.5); width: 100%; } .member { width: 245px; height: 100px; margin: 10px 10px 0 0; background-color: #EEE; border-radius: 5px; float: left; } .member .avatar { width: 50px; height: 50px; background-position: center; background-size: cover; margin: 10px 0 0 10px; box-shadow: 0 2px 2px rgba(0, 0, 0, 0.1); border-radius: 50%; float: left; } .member .user, .member .func { width: 120px; height: 40px; margin: 10px 10px 0 10px; padding: 0 15px 0 15px; background-color: #FFF; box-shadow: 0 2px 2px rgba(0, 0, 0, 0.1); border-radius: 5px; text-overflow: ellipsis; font-size: 11px; font-weight: 700; color: #777; line-height: 40px; float: left; white-space: nowrap; overflow: hidden; } .member .func { height: 35px!important; line-height: 35px; margin-top: 5px; } </style> </head> <body> <div class="container"> <div class="vagas-staff"> <p> Você está interessado em entrar para uma das equipes? </p> <p>Entre em contato com os Líderes ou Auxiliares da equipe no Habbo e saiba mais!</p> <p>Nossas vagas são limitadas e bem selecionadas então seja ágil para conquistá-la. </p> </div> <div class="tab"> <h6>Gestão</h6> <div class> <button class="tablinks" onclick="openTab(event, 'admin')"> Administrador </button> <button class="tablinks" onclick="openTab(event, 'lider')"> Líder </button> <button class="tablinks" onclick="openTab(event, 'aux')"> Auxíliar </button> </div> <h6>Coordenação</h6> <div class> <button class="tablinks" onclick="openTab(event, 'red')"> Redação </button> <button class="tablinks" onclick="openTab(event, 'coo')"> Coordenador de marketing </button> </div> <h6>Membros</h6> <div class> <button class="tablinks" onclick="openTab(event, 'jorn')"> Jornalista </button> <button class="tablinks" onclick="openTab(event, 'pixel')"> Píxel Artista </button> <button class="tablinks" onclick="openTab(event, 'pe')"> Promotor de eventos </button> <button class="tablinks" onclick="openTab(event, 'vyt')"> VídeoTuber </button> <button class="tablinks" onclick="openTab(event, 'dv')"> Divulgador </button> </div> </div> <div id="admin" class="tabcontent"> <div class="rule"> <b>Administrador</b> <p>Os Administradores são a gerência técnica do portal e de tudo o que envolve o site.</p> </div>  <div class="member"> <div style="background-image: url('https://2img.net/i/fa/modernbb/pp-blank-thumb.png')" class="avatar"> </div> <div class="user"> <em class="fa fa-user" aria-hidden="true"> </em> <a href="/u1">Admin</a> </div> </div>   <div class="member"> <div style="background-image: url('https://2img.net/i/fa/modernbb/pp-blank-thumb.png')" class="avatar"> </div> <div class="user"> <em class="fa fa-user" aria-hidden="true"> </em> <a href="/u1">Admin</a> </div> </div>  </div> <div id="lider" class="tabcontent"> <div class="rule"> <b>Líder</b> <p>O Líder é o responsável pela gestão da sua área. Ele organiza a equipe que lhe compete e administra a sua área do portal.</p> </div>  <div class="member"> <div style="background-image: url('https://2img.net/i/fa/modernbb/pp-blank-thumb.png')" class="avatar"> </div> <div class="user"> <em class="fa fa-user" aria-hidden="true"> </em> <a href="/u1">Admin</a> </div> </div>   <div class="member"> <div style="background-image: url('https://2img.net/i/fa/modernbb/pp-blank-thumb.png')" class="avatar"> </div> <div class="user"> <em class="fa fa-user" aria-hidden="true"> </em> <a href="/u1">Admin</a> </div> </div>  </div> <div id="aux" class="tabcontent"> <div class="rule"> <b>Auxiliar</b> <p>O Auxiliar é o sub-responsável pela gestão da sua área. Ele ajuda o Líder a organizar a equipe que lhe compete e coordena a sua área do portal.</p> </div>  <div class="member"> <div style="background-image: url('https://2img.net/i/fa/modernbb/pp-blank-thumb.png')" class="avatar"> </div> <div class="user"> <em class="fa fa-user" aria-hidden="true"> </em> <a href="/u1">Admin</a> </div> </div>   <div class="member"> <div style="background-image: url('https://2img.net/i/fa/modernbb/pp-blank-thumb.png')" class="avatar"> </div> <div class="user"> <em class="fa fa-user" aria-hidden="true"> </em> <a href="/u1">Admin</a> </div> </div>  </div> <div id="red" class="tabcontent"> <div class="rule"> <b>Redator</b> <p>O Redator é o responsável por orientar os Jornalistas e vigiar todas as noticias que são criadas, fazendo as alterações que são necessárias. </p> </div> </div> <div id="coo" class="tabcontent"> <div class="rule"> <b> Coordenador de Marketing</b> <p>O Coordenador de Marketing é o responsável por orientar toda a equipe de Marketing e organizar os eventos da GOPH.</p> </div>  <div class="member"> <div style="background-image: url('https://2img.net/i/fa/modernbb/pp-blank-thumb.png')" class="avatar"> </div> <div class="user"> <em class="fa fa-user" aria-hidden="true"> </em> <a href="/u1">Admin</a> </div> </div>   <div class="member"> <div style="background-image: url('https://2img.net/i/fa/modernbb/pp-blank-thumb.png')" class="avatar"> </div> <div class="user"> <em class="fa fa-user" aria-hidden="true"> </em> <a href="/u1">Admin</a> </div> </div>  </div> <div id="jorn" class="tabcontent"> <div class="rule"> <b>Jornalista</b> <p>Responsável por trazer e criar notícias no portal e deixar o conteúdo do site atualizado e com qualidade.</p> </div>  <div class="member"> <div style="background-image: url('https://2img.net/i/fa/modernbb/pp-blank-thumb.png')" class="avatar"> </div> <div class="user"> <em class="fa fa-user" aria-hidden="true"> </em> <a href="/u1">Admin</a> </div> </div>   <div class="member"> <div style="background-image: url('https://2img.net/i/fa/modernbb/pp-blank-thumb.png')" class="avatar"> </div> <div class="user"> <em class="fa fa-user" aria-hidden="true"> </em> <a href="/u1">Admin</a> </div> </div>  </div> <div id="pixel" class="tabcontent"> <div class="rule"> <b>Pixel Artista</b> <p>O Pixel Artista é o responsável por criar artes e imagens das campanhas da GOPH.</p> </div>  <div class="member"> <div style="background-image: url('https://2img.net/i/fa/modernbb/pp-blank-thumb.png')" class="avatar"> </div> <div class="user"> <em class="fa fa-user" aria-hidden="true"> </em> <a href="/u1">Admin</a> </div> </div>   <div class="member"> <div style="background-image: url('https://2img.net/i/fa/modernbb/pp-blank-thumb.png')" class="avatar"> </div> <div class="user"> <em class="fa fa-user" aria-hidden="true"> </em> <a href="/u1">Admin</a> </div> </div>  </div> <div id="pe" class="tabcontent"> <div class="rule"> <b>Promotor de eventos</b> <p>O Promotor de Eventos é o responsável por criar quartos e noticias para os eventos da GOPH.</p> </div>  <div class="member"> <div style="background-image: url('https://2img.net/i/fa/modernbb/pp-blank-thumb.png')" class="avatar"> </div> <div class="user"> <em class="fa fa-user" aria-hidden="true"> </em> <a href="/u1">Admin</a> </div> </div>   <div class="member"> <div style="background-image: url('https://2img.net/i/fa/modernbb/pp-blank-thumb.png')" class="avatar"> </div> <div class="user"> <em class="fa fa-user" aria-hidden="true"> </em> <a href="/u1">Admin</a> </div> </div>  </div> <div id="vyt" class="tabcontent"> <div class="rule"> <b>VideoTuber</b> <p>O VideoTuber é o responsável por criar vídeos e produções audiovisuais para os eventos da GOPH.</p> </div>  <div class="member"> <div style="background-image: url('https://2img.net/i/fa/modernbb/pp-blank-thumb.png')" class="avatar"> </div> <div class="user"> <em class="fa fa-user" aria-hidden="true"> </em> <a href="/u1">Admin</a> </div> </div>   <div class="member"> <div style="background-image: url('https://2img.net/i/fa/modernbb/pp-blank-thumb.png')" class="avatar"> </div> <div class="user"> <em class="fa fa-user" aria-hidden="true"> </em> <a href="/u1">Admin</a> </div> </div>  </div> <div id="dv" class="tabcontent"> <div class="rule"> <b>Divulgador</b> <p>Responsável por divulgar o portal e os eventos pelos quartos e outros sites relacionados ao Habbo.</p> </div>  <div class="member"> <div style="background-image: url('https://2img.net/i/fa/modernbb/pp-blank-thumb.png')" class="avatar"> </div> <div class="user"> <em class="fa fa-user" aria-hidden="true"> </em> <a href="/u1">Admin</a> </div> </div>   <div class="member"> <div style="background-image: url('https://2img.net/i/fa/modernbb/pp-blank-thumb.png')" class="avatar"> </div> <div class="user"> <em class="fa fa-user" aria-hidden="true"> </em> <a href="/u1">Admin</a> </div> </div>  </div> </div> <script type="text/javascript"> //<![CDATA[ function openTab(evt, tabName) { var i, tabcontent, tablinks; tabcontent = document.getElementsByClassName("tabcontent"); for (i = 0; i < tabcontent.length; i++) { tabcontent[i].style.display = "none"; } tablinks = document.getElementsByClassName("tablinks"); for (i = 0; i < tablinks.length; i++) { tablinks[i].className = tablinks[i].className.replace(" active", ""); } document.getElementById(tabName).style.display = "block"; evt.currentTarget.className += " active"; } //]]> </script> </body> </html>

por Convidado 04.11.18 23:24

Muito obrigada, pode fechar.

por **tikky** 05.11.18 6:54

Tópico resolvido

Movido para "Questões resolvidas".

Hitskin.com

Pagina bugada

Pagina bugada

Detalhes da questão

Descrição

Re: Pagina bugada

Re: Pagina bugada

Re: Pagina bugada

Re: Pagina bugada

Re: Pagina bugada

Re: Pagina bugada

Re: Pagina bugada

Re: Pagina bugada

Re: Pagina bugada

Tópico resolvido