Adicionar imagem ao pop-up de login
4 participantes
Fórum dos Fóruns :: Ajuda e atendimento ao utilizador :: Questões sobre a aparência do fórum :: Questões resolvidas sobre a aparência do fórum
Página 1 de 1 • Compartilhe
Adicionar imagem ao pop-up de login
Detalhes da questão
Endereço do fórum: http://sistemacrp.forumeiros.com
Versão do fórum: ModernBB
Descrição
Saudações,
no meu /login contém essa página e gostaria de colocar o emblema da instituição no quadrado vermelho (https://prnt.sc/x9lire)
Alguém pode ajudar?
Re: Adicionar imagem ao pop-up de login
Bom dia meu querido, se possível, me envie sua folha de estilo css para que possamos realizar as edições.
Re: Adicionar imagem ao pop-up de login
Saudações,
aqui está:
aqui está:
- Código:
@font-face {
font-family: 'Volter Goldfish';
src: url("https://mundogoph.github.io/fonts/Volter.ttf") format('ttf'),
url("https://mundogoph.github.io/fonts/Volter.woff2") format('woff2'),
url("https://mundogoph.github.io/fonts/Volter.woff") format('woff'),
url("https://mundogoph.github.io/fonts/Volter.svg") format('svg');
font-weight: normal;
font-style: normal;
}
@font-face {
font-family: 'Aveny T';
src: url("http://db.onlinewebfonts.com/t/6cdc4cc6b38c8e89e8721abe8aed4ab9.woff2") format('woff2'),
url("http://db.onlinewebfonts.com/t/6cdc4cc6b38c8e89e8721abe8aed4ab9.woff") format('woff'),
url("http://db.onlinewebfonts.com/t/6cdc4cc6b38c8e89e8721abe8aed4ab9.ttf") format('ttf'),
url("http://db.onlinewebfonts.com/t/6cdc4cc6b38c8e89e8721abe8aed4ab9.svg") format('svg');
font-weight: normal;
font-style: normal;
}
#preview .postbody table, #preview .postbody td, div[class*="post--"] .postbody table, div[class*="post--"] .postbody td { border: none!important; }
body {
font-family: "Century Gothic", "Apple Gothic","URW Gothic L","Avant Garde",Futura,sans-serif!important;
}
.legend a {
font-size: 14px;
font-weight: 400;
border-radius: 3px;
display: inline-block;
padding: 3px 9px;
margin: 3px;
}
.legend {
font-size: 0px;
}
/** Correção :: Transição exagerada */
html * {
transition: none;
transition-duration: 0ms;
}
html a,
html button,
html input,
html [role="button"],
html .trans {
transition: all 180ms linear;
transition-duration: 180ms;
}
/** End :: Correção :: Transição exagerada */
.inputbox, input[type="text"], select, textarea {
background: #E9EBED;
border: 1px solid #BFBFBF;
border-radius: 3px;
color: #262626;
}
.inputbox, input[type="text"], textarea { padding-left: 5px; }
select { padding-left: 2px; }
h3 {
border-color: #f5f5f5;
border-style: solid;
border-width: 0 0 1px;
color: #f5f5f5;
font-family: Roboto, sans-serif;
font-size: 1.6rem;
font-weight: 400;
letter-spacing: .3px;
margin-bottom: 12px;
padding-bottom: 3px;
}
/*Correção Icones de Mensagem*/
dl.icon dt,dl.icon dd.dterm {
background-repeat: no-repeat;
background-position: 250px 45px;
}
/* HEADER E MENU
============================================================*/
header {
background-color: #212529;
color: #fff;
line-height: 64px;
text-overflow: ellipsis;
white-space: nowrap;
word-break: keep-all;
z-index: 997;
left: 0;
position: fixed;
right: 0;
top: 0;
}
#main-menu-btn {
color: #fff;
cursor: pointer;
display: block;
float: left;
height: 64px;
line-height: 64px;
margin: 0;
padding: 0 22px;
position: relative;
text-align: center;
}
#main-menu-btn i { line-height: 64px; }
#main-menu-btn:hover, #user-menu:hover { background-color: rgba(0,0,0,0.22); }
#logo-text, #logo-text div {
position: relative;
}
#logo-text:before {
color: #bdbdbd;
content: 'POLíCIA';
font-family: Aveny T;
font-size: 30px;
font-weight: 500;
page-break-after: always;
top: -25px;
left: 80px;
padding: 22px;
position: absolute;
text-shadow: 2px 1px 0 #FFF;
text-transform: uppercase;
}
#logo-text:after {
color: #d8b500;
content: 'CRP';
font-family: Aveny T;
font-size: 30px;
font-weight: 500;
left: 160px;
padding: 22px;
position: absolute;
text-shadow: 2px 1px 0 #FFF;
text-transform: uppercase;
top: -25px;
}
#logo-text div:before {
color: rgb(255, 255, 255);
content: "Formando sucessores";
font-family: Calibri Light, sans-serif;
font-size: 15px;
font-weight: 800;
left: 80px;
position: absolute;
text-shadow: rgb(0, 0, 0) 2px 1px 0px;
text-transform: uppercase;
top: 15px;
}
#header-radio-player {
display: inline-block;
margin: -0.4% 0;
width: auto;
padding-left: 30%;
}
#search-main {
border-bottom: 1px solid rgba(255, 255, 255, 0.22);
display: block;
float: right;
height: 34px;
margin: 15px 22px;
}
#search-main input {
background-color: transparent;
color: #FFFFFF;
direction: ltr;
display: block;
font-size: 14px;
font-family: Open Sans, Arial, sans-serif;
font-weight: 300;
height: 34px;
padding-right: 34px;
width: 250px;
border: none;
border-radius: 0;
}
#search-main input::placeholder {
opacity: 1;
}
#search-main button {
background-color: transparent;
border-radius: 0;
box-shadow: none;
float: right;
font-family: Open Sans, Arial, sans-serif;
font-size: 18px;
height: 34px;
line-height: 34px;
margin: -34px 0 0 0;
padding: 0;
position: relative;
text-align: center;
width: 34px;
color: #fff;
}
#search-main button:hover {
color: rgba(255, 255, 255, 0.5);
}
#search-main i {
font-size: inherit;
}
@media (max-width: 660px) {
#search-main {
border: none;
}
#search-main input {
float: left;
margin-right: -34px;
position: relative;
transition: none;
width: 34px;
z-index: 1;
}
#search-main input:focus {
background-color: #d8b500;
font-size: 21px;
height: 112px;
left: 0;
right: 0;
padding: 0 22px;
position: absolute;
top: 0;
width: 100%;
}
#search-main button {
float: none;
font-size: 24px;
margin: 0;
}
}
header button, #page-header .button {
background-color: #00DCFF;
border-radius: 3px;
box-shadow: 0 2px 2px 0 rgba(0,0,0,0.14), 0 3px 1px -2px rgba(0,0,0,0.2), 0 1px 5px 0 rgba(0,0,0,0.12);
color: #fff;
cursor: pointer;
display: block;
float: right;
font-family: Open Sans, Arial, sans-serif;
font-size: 14px;
height: 34px;
letter-spacing: .2px;
line-height: 34px;
margin: 15px 22px 15px 0;
padding: 0 17px;
width: auto;
}
header button:hover, .logout-button:hover, #page-header .button:hover {
-ms-filter: brightness(90%);
-webkit-filter: brightness(90%);
box-shadow: 0 2px 4px 0 rgba(0,0,0,0.14), 0 5px 3px -2px rgba(0,0,0,0.2), 0 1px 8px 0 rgba(0,0,0,0.12);
filter: brightness(90%);
}
#page-header .button {
float: none;
margin: 0;
text-align: center;
}
/*-- MENU --*/
#main-menu, #main-user-menu {
background-color: #1c1d1f;
box-shadow: 2px 0 2px 0 rgba(0, 0, 0, 0.14), 3px 0 1px -2px rgba(0, 0, 0, 0.2), 1px 0 5px 0 rgba(0, 0, 0, 0.12);
bottom: 0;
font-size: 14px;
overflow: auto;
padding: 11px 22px;
position: fixed;
text-align: left;
top: 0;
z-index: 999;
}
#main-menu { left: 0; }
#main-user-menu { right: 0; }
.main-menu-headline {
color: #fff;
font-size: 20px;
font-weight: 300;
letter-spacing: 0.2px;
overflow: hidden;
padding: 22px 0 11px;
text-align: center;
text-overflow: ellipsis;
max-width: 100%;
}
.main-menu-headline .headline-small { font-size: 13px; }
.main-menu-headline span { display: block; }
#main-menu .divider, #main-user-menu .divider {
background-color: rgba(255, 255, 255, 0.22);
height: 1px;
margin: 11px 0;
width: 100%;
}
#main-menu.hidden, #main-user-menu.hidden {
opacity: 0;
pointer-events: none;
}
#main-menu.hidden { transform: translate3d(-100%, 0, 0); }
#main-user-menu.hidden { transform: translate3d(100%,0,0); }
#main-menu ul, #main-user-menu ul {
display: block;
list-style: none;
margin: 0 -22px;
min-width: 100%;
}
#main-menu ul a, #main-user-menu ul a {
color: #fff;
display: block;
min-width: 300px;
padding: 16px 32px;
}
#main-menu ul a:hover, #main-user-menu ul a:hover {
background-color: rgba(0, 0, 0, 0.22);
}
#main-menu ul i, #main-user-menu ul i {
margin: -4px 16px -4px 0;
vertical-align: -7px;
}
#main-menu ul li.has-sub { position: relative; }
#main-menu ul li.has-sub > ul { display: none; overflow: hidden; }
#main-menu ul li.has-sub.open > ul { display: block; }
#main-menu ul > li.has-sub > a:after {
position: absolute;
right: 27px;
top: 19px;
z-index: 5;
display: block;
height: 15px;
width: 2px;
background: #fff;
content: "";
-webkit-transition: all 0.1s ease-out;
-moz-transition: all 0.1s ease-out;
-ms-transition: all 0.1s ease-out;
-o-transition: all 0.1s ease-out;
transition: all 0.1s ease-out;
}
#main-menu ul > li.has-sub > a:before {
position: absolute;
right: 21px;
top: 25px;
display: block;
width: 15px;
height: 2px;
background: #fff;
content: "";
-webkit-transition: all 0.1s ease-out;
-moz-transition: all 0.1s ease-out;
-ms-transition: all 0.1s ease-out;
-o-transition: all 0.1s ease-out;
transition: all 0.1s ease-out;
}
#main-menu ul > li.has-sub.open > a:after,
#main-menu ul > li.has-sub.open > a:before {
-webkit-transform: rotate(45deg);
-moz-transform: rotate(45deg);
-ms-transform: rotate(45deg);
-o-transform: rotate(45deg);
transform: rotate(45deg);
}
#main-menu ul ul li a {
padding: 14px 60px;
cursor: pointer;
z-index: 2;
font-size: 14px;
text-decoration: none;
color: #dddddd;
background: #292d32;
-webkit-transition: color .2s ease;
-o-transition: color .2s ease;
transition: color .2s ease;
}
#main-menu ul ul li a:hover {
color: #fff;
background-color: rgba(0, 0, 0, .5);
}
#main-menu ul ul ul li a {
padding-left: 24%;
background: #121416;
}
#main-menu ul ul ul li a:hover { background-color: rgba(0, 0, 0, 1); }
#main-menu ul ul > li.has-sub > a:after {
top: 16px;
right: 50px;
background: #dddddd;
}
#main-menu ul ul > li.has-sub > a:before {
top: 22px;
right: 44.5px;
background: #dddddd;
}
#dimmer {
background-color: rgba(0, 0, 0, 0.44);
bottom: 0;
left: 0;
position: fixed;
right: 0;
top: 0;
z-index: 998;
}
#dimmer.hidden {
opacity: 0;
pointer-events: none;
}
/*-- USER MENU --*/
header #user-menu {
float: right;
height: inherit;
position: relative;
font-size: 15px;
font-weight: 500;
color: #fff;
padding: 0 20px;
display: block;
cursor: pointer;
}
#user-menu .user-avatar {
border-radius: 100%;
border: 1px solid #fff;
float: left;
position: relative;
top: 6px;
display: inline-block;
overflow: hidden;
width: 50px;
margin-right: 10px;
height: 50px;
box-shadow: 0 2px 70px rgba(0,0,0,1);
}
#user-menu .user-avatar img {
position: relative;
top: -14px;
right: 9px;
image-rendering: pixelated;
}
span.user-username {color: #fff;}
#user-menu .user-username {
max-width: 90px;
-ms-text-overflow: ellipsis;
text-overflow: ellipsis;
white-space: nowrap;
display: inline-block;
overflow: hidden;
}
.avatar-big {
border-radius: 128px;
border: 1px solid #fff;
box-shadow: 0 1px 3px rgba(0,0,0,0.11), 0 0 1px rgba(0,0,0,0.22);
display: inline-block;
height: 128px;
width: 128px;
overflow: hidden;
position: relative;
}
.avatar-big img {
background-color: #1c1d1f;
object-fit: cover;
position: absolute;
top: -20px;
left: 0;
}
/*-- POPUP DE LOGIN --*/
.login-popup {
-webkit-box-shadow:0 0 20px rgba(0,0,0,.4);
box-shadow:0 0 20px rgba(0,0,0,.4);
background-color:#fff;
-webkit-border-radius:20px;
-moz-border-radius:20px;
border-radius:20px;
position:relative;
padding:37px 50px 50px 325px;
width:auto;max-width:645px;
margin:20px auto;
overflow:hidden;
}
.login-popup:before,
.login-popup:after {
-webkit-border-radius:192px/290px;
-moz-border-radius:192px/290px;
border-radius:192px/290px;
width:385px;
height:580px;
position:absolute;
content:"";
top:0;
display:block;
bottom:0;
margin:auto;
}
.login-popup:before {
background-image:url(https://i.imgur.com/USDUbuf.png);
background-position: -320px -92px;
left:-95px;
}
.login-popup::after {
background-image: url(---);
background-color: #00DCFFb3;
background-position: 154px center;
background-repeat:no-repeat;
left: -93px;
}
.login-popup h3 {
color:#000;
font-size: 20px;
line-height: 26px;
border-bottom: 1px solid rgba(0,0,0,.2);
padding-bottom: 10px;
margin-bottom: 25px;
margin-top: 0;
}
.login-popup .login-form .username-input,
.login-popup .login-form .password-input {
position:relative;
display:block;
}
.login-popup .login-form .username-input i,
.login-popup .login-form .password-input i {
font-size:18px;
font-weight:700;
color: #d4d4d4;
position:absolute;
top:13px;
right:18px;
cursor:text;
display:block;
-webkit-transition:color .2s;
transition:color .2s;
}
.login-popup .login-form .username-input i:before,
.login-popup .login-form .password-input i:before {
font-size:18px;
}
.login-popup .login-form .rounded-input {
padding-right:40px;
margin-bottom:15px;
background-color: #fff;
-webkit-border-radius: 48px;
-moz-border-radius: 48px;
border-radius: 48px;
padding: 11px 24px;
display: block;
font-family: poppins,Arial,sans-serif;
font-weight: 300;
font-size: 14px;
color: #333;
border: 1px solid #d4d4d4;
width: 100%;
height: 47px;
-webkit-transition: border-color .2s;
transition: border-color .2s;
}
.login-popup .login-form .rounded-input:focus,
.login-popup .login-form .rounded-button:focus {
border-color: #15253d;
outline: none;
}
.login-popup .login-form .rounded-input:focus~i { color: #15253d; }
.login-popup .rounded-button {
-webkit-border-radius: 48px;
-moz-border-radius: 48px;
border-radius: 48px;
padding: 11px 24px;
text-decoration: none;
font-weight: 600;
font-size: 14px;
text-transform: uppercase;
cursor: pointer;
height: 47px;
line-height: 21px;
text-shadow: none;
text-align: center;
-webkit-transition: background-color .2s,color .2s;
transition: background-color .2s,color .2s;
display: block;
width:100%;
color: #fff;
}
.rounded-button.login {
background-color: #00DCFF;
}
.rounded-button.register {
background-color: #00DCFF;
margin-top: 10px;
margin-bottom: -5%;
}
.login-popup .login-form .rounded-button.login:hover { background-color: #FDD111; }
.login-popup .rounded-button.register:hover { background-color: #FDD111; }
/*---- Header ----*/
.headerbar {
background-size: contain;
height: 340px;
}
.headerbar .wrap { display: none; }
/*--- Emblema gratuito ----*/
#page-header { position: relative; }
#page-header > .lz-emblems-wrapper {
background-color: rgba(0,0,0,0.7);
padding: 5px;
border-radius: 5px;
position: absolute;
left: 45%;
top: 63%;
transform: translateX(-50%);
display: inline-block;
z-index: 999;
cursor: pointer;
transition: all 200ms linear;
}
/* BODY
=============================================*/
#wrap { background-color: #ffffff; }
#main-content a.cgu-buttons { padding: 9px 18px; }
/*---- Botões ----*/
.button, .button1, .button2, .button-round, input[type="submit"] {
background-color: #00DCFF;
/* border-bottom: 2px solid #f5f5f5; */
}
.button:hover, .button1:hover, .button2:hover, .button-round:hover, input[type="submit"]:hover {
background-color: #00DCFF;
/* border-bottom: 2px solid #222; */
box-shadow: none;
}
/*---- Cabeçalho das categorias e fóruns ---*/
.forabg, .forumbg {
background-color: #212529;
background-position: 0 0;
background-repeat: repeat-x;
border-radius: 3px;
box-shadow: 0 1px 6px rgb(0 0 0 / 86%);
clear: both;
margin-bottom: 24px;
padding: 0;
}
.forumbg:not(.forumbg-table) { background-color: transparent!important; }
.btn-collapse i { font-size: 2.5rem!important; }
.forabg.hidden { background-color: rgba(33, 37, 41,0.9); }
.forabg > .topiclist:first-child {border-bottom: 2px solid #d8b500;}
ul.forums li.row dl {
background-position: left 17px top 50%!important;
background-size: 50px 50px!important;
}
ul.forums dl.icon dd.dterm > div {
margin-left: 0px!important;
}
.forumbg .row:first-child { border-radius: 3px 3px 0 0; }
a.forumtitle:hover, a.forumtitle:visited { color: #2898EF; }
a.forumtitle {
color: #262626!important;
line-height: 60px;
margin-bottom: -20px;
}
table.table1 {
width: 100%!important;
}
.table-title, .table-title h2, ul.topiclist dd.dterm h2, ul.topiclist dt h2 {
display: inline;
font-size: 2rem;
font-weight: 300;
line-height: 15px;
}
li.header dd, li.header dt {
font-size: 2rem;
font-weight: 300;
}
.topic-stats {
font-size: 1.3rem;
color: rgba(0,0,0,0.55);
background-color: rgba(0,0,0,0.05);
padding: 3px 7px;
width: 50%;
display: block;
border-radius: 3px;
text-align: center;
margin: 5px 0;
}
ul.topiclist dd.dterm br {
display: none;
}
.forum-desc { color: #797979; font-size: 14px; font-weight: 400; font-family: Open Sans, Arial, sans-serif!important; }
ul.forums dl.icon dd.dterm > div { width: 65%; }
ul.topiclist {
background-color: #262626;}
ul.topiclist dd.dterm, ul.topiclist dt {
width: 70%;
}
ul.topics .row dd.dterm, ul.topics .row dt {
padding: 25px 18px 9px 81px;
width: 50%;
}
li.row { border-width: 1px 0 0; background-color: #fff; }
dd.lastpost {
width: 30%;
float: right !important;
display: flex !important;
align-items: center;
}
.topics .row .lastpost {
padding: 20px 30px!important;
}
.topiclist > .row > .icon {
position: relative;
display: flex;
}
.topic-pagination {
margin: auto;
display: flex !important;
justify-content: center;
width: 20%;
}
.lastpost > span > a:empty {
pointer-events: none;
}
.lastpost > span > a:empty:before {
content: "Não existem tópicos a visualizar!";
color: #999;
font-style: italic;
position: absolute;
top: 50%;
transform: translate(0, -50%);
}
/*--- Tópicos----*/
.quick-nav-topics { display: none;}
.topic-date {padding-left: 0.7%!important;}
/*---- Botões especiais dos tópicos ----*/
.btn-edit a:hover { background-color: #ebab37; }
.profile-icons li:last-child { margin-right: 10px!important; }
/*---- Perfil nos tópicos ----*/
.postprofile {
background-color: rgb(150 147 147 / 8%);
box-shadow: 2px 0 3px rgba(0,0,0,.2);
border-top: 0;
border-left-width: 7px;
border-radius: 3px 0 0 3px;
width: 250px;
}
.postprofile:before {
content: url(http://habboemotion.com/resources/images/icons/offline.gif);
left: 5px;
position: absolute;
top: 5px;
}
.online .postprofile:before { content: url(http://habboemotion.com/resources/images/icons/online.gif); }
.online:before {background-color: transparent;}
.postprofile-name {
font-size: 16px;
margin-top: 5%;
}
.postprofile-avatar { margin: 10px 0; }
.postprofile-avatar img {
border-radius: 10px;
height: auto;
width: 120px;
background-color: transparent;
}
.postprofile-rank {
border: none;
margin-bottom: 0;
padding-bottom: 0;
}
.postprofile-info {
padding-top: 5%;
}
.postbody {
margin-left: 250px;
position: relative;
}
.postprofile-contact { text-align: center; }
.postprofile-contact a {
float: none;
display: inline-block !important;
}
.postprofile hr {
border-color: #bfbfbf;
margin: 7% -8%;
}
.mod-login-avatar img {
object-fit: cover;
}
/*---- Emblemas ----*/
#field_id4 br { display:none; }
#field_id4 div[alt], .postprofile-info div[alt] {
background-color: rgba(255, 255, 255, 0.2);
background-position: center!important;
background-repeat: no-repeat;
border-bottom: 2px solid rgba(255, 255, 255, 0.2);
border-radius: 3px;
display: inline-block;
height: 50px;
margin-top: 5px;
margin-right: 3.5px;
position: relative;
width: 47px;
}
#field_id4 div[alt]:before, .postprofile-info div[alt]:before {
content: attr(alt);
position: absolute;
top: -60%;
left: 50%;
white-space: nowrap;
transform: translate(-50%);
background-color: rgba(0,0,0,0.9);
color: #fff;
padding: 0 10px;
border-radius: 3px;
user-select: none;
pointer-events: none;
opacity: 0;
line-height: 24px;
transition: 250ms opacity;
z-index:998!important;
}
#field_id4 div[alt]:hover:before, .postprofile-info div[alt]:hover:before { opacity: 1; }
.postprofile-info div[alt] + br { display: none; }
.postprofile-info .label { margin-bottom: 10px; }
.show-more-em {
padding: 7px;
background-color: #00DCFF;
border-radius: 5px;
border-bottom: 3px solid #00DCFF;
font-size: 13px;
color: #fff!important;
font-weight: 600;
text-align: center;
}
.show-more-em:hover {
background-color: #f5f5f5;
border-bottom: 3px solid #f5f5f5;
}
/*--- Botões de moderação ----*/
p.right img:hover { opacity: .75; }
/*---- Botões de amigo/ignorado no perfil ----*/
#profile-advanced-add br { display: none; }
#profile-advanced-add a {
display: block;
text-align: center;
background-color: #0a7d29;
color: #fff;
padding: 15px 0;
font-size: 12px;
font-weight: 700;
border-radius: 3px;
margin-bottom: 8px;
border-bottom: 2px solid #064e1a;
}
#profile-advanced-add a:hover {
background-color: #064e1a;
border-bottom: 2px solid #021f0a;
}
#profile-advanced-add a:last-child {
background-color: #d0062a;
margin-bottom: 0;
border-bottom: 2px solid #9e0520;
}
#profile-advanced-add a:last-child:hover {
background-color: #9e0520;
border-bottom: 2px solid #6d0316;
}
/*---- Categorias do perfil ----*/
div#tabs + .panel.row3 { border: solid 1px #c1c1c1; }
#tabs ul li.activetab, #tabs ul li:hover {box-shadow: inset 0px -5px #c7c7c7;}
#tabs ul .activetab a, #tabs ul li a {
border: none;
padding: 7px 0px;
padding-bottom: 9px;
font-size: 13px;
border-right: solid 1px #ddd;
border-color: #ddd!important;
}
#tabs {
margin-left: 15px;
border: solid 1px #c1c1c1;
border-bottom: solid 0px;
line-height: initial;
padding: 0px 0px;
display: inline-block;
border-radius: 3px 3px 0px 0px;
}
#tabs ul .activetab a span, #tabs ul li a:hover span {color: #c7c7c7;}
/*---- Cabeçalho dos tópicos ----*/
.post-head {
background-color: rgba(0,0,0,0.0);
border-color: rgb(255 255 255 / 0%);
border-radius: 3px 3px 0 0;
border-style: solid;
border-width: 0 0 1px;
padding: 18px;
padding-left: 21%;
}
/*---- Resposta rápida ----*/
#quick_reply {
width: 80%;
margin: auto;
}
.sceditor-container { border-color: #f5f5f5!important; }
#quick_reply #textarea_content {
box-shadow: 0px 7px 20px 0px rgba(0,0,0,0.3);
border-radius: 5px;
}
.sceditor-toolbar {
background: #24282b!important;
border-bottom: none!important;
}
.sceditor-group { border-color: rgba(255,255,255,0.6)!important; }
.sceditor-button {
background-color: #f1f1f1;
margin-right: 2px;
border-bottom: 1px solid rgba(0,0,0,0.5);
}
.sceditor-button.active, .sceditor-button:active, .sceditor-button:hover, .sceditor-button.hover {
background-color: #d8d8d8!important;
box-shadow: none!important;
}
/*--- OUTROS ELEMENTOS BBCODES ---*/
#preview .postbody table:not(.info-table),
#preview .postbody td,
div[class*='post--'] .postbody table:not(.info-table),
div[class*='post--'] .postbody td { border: solid 1px #c2c2c2!important; }
#preview .postbody .info-table,
#preview .postbody .info-table td,
div[class*='post--'] .postbody .info-table,
div[class*='post--'] .postbody .info-table td { border: none!important; }
hr { border-top-color: #444; }
.postbody .content table {
border-collapse: collapse;
border: solid 1px #c2c2c2;
text-align: center;
width: -webkit-fill-available;
}
.postbody .content table tr {
border-bottom: solid 1px #d0d0d0;
}
.postbody .content table td, .postbody .content table th {
padding: 15px 15px;
border: none;
}
/*--- CITAR, CODEBOX E SPOILER ---*/
blockquote {
padding: 8px 16px 8px 10px;
border-radius: 3px;
border-style: solid;
border-width: 0 0 0 6px;
font-size: 14px;
line-height: 1.5;
background-color: transparent;
border-width: 1px 1px 1px 6px;
}
blockquote:before, .codebox:before { display: none!important; }
blockquote cite {
color: #c7c7c7;
margin-bottom: 3px;
}
.codebox {
background-color: #354147!important;
border-color: rgba(0,0,0,0.44)!important;
border-radius: 3px!important;
color: #FFF;
font-size: 14px!important;
line-height: 1.5!important;
padding: 8px 16px 8px 10px!important;
}
.codebox .fa-code-copy-button {
position: absolute;
right: 10px;
top: 8px;
color: #fff;
}
.codebox:not(.spoiler) dt {
font-size: 1.3rem!important;
text-align: left!important;
}
.codebox dt {
color: rgba(255,255,255,0.44)!important;
margin-bottom: 3px!important;
border-bottom: none!important;
}
.spoiler_content .codebox:not(.spoiler) dt {
color: rgba(255,255,255,0.44)!important;
background-color: transparent;
}
.spoiler_content .codebox dt:after { display: none; }
.codebox code {
max-height: 400px!important;
white-space: nowrap!important;
color: #e6e1dc!important;
margin: 0!important;
font-size: 15px!important;
}
.hljs-literal, .hljs-symbol, .hljs-bullet, .hljs-attribute, .hljs-string, .hljs-variable, .hljs-template-variable, .hljs-strong, .hljs-emphasis, .hljs-quote,
.hljs-title, .hljs-attr, .hljs-selector-id, .hljs-selector-class, .hljs-selector-attr, .hljs-selector-pseudo, .hljs-keyword, .hljs-selector-tag, .hljs-type {
color: #fff!important;
}
.spoiler {
border: none!important;
background-color: transparent!important;
padding: 0!important;
color: #212121;
}
.spoiler dt {
background-color: rgba(0,0,0,0.22);
border-radius: 3px;
padding: 6px 11px;
position: relative;
color: #f5f5f5!important;
font-size: 15px!important;
}
.spoiler dt:after, .spoiler_content .spoiler dt:after {
content: "\f104";
font-family: "IonIcons";
line-height: 36px;
pointer-events: none;
position: absolute;
right: 11px;
top: 0;
}
.spoiler_content {
border-left: 3px solid rgba(0,0,0,0.22);
display: none;
color: #f5f5f5;
margin-top: 6px;
padding-left: 22px!important;
padding-bottom: 20px;
padding: 2px;
}
/* FOOTER
**===================*/
.statistics-item strong a span, .statistics-item a:link, .statistics-item a:visited { color: #fff!important; }
.footerbar-system { padding: 20px 0; }
/**
* Definições Iniciais:
*/
.fa-footer,
.fa-footer * { box-sizing: border-box; }
.fa-footer {
font-family: "Segoe UI", "Open Sans", "Helvetica Neue", "Ubuntu", "Helvetica", "Arial", "Trebuchet MS", sans-serif;
font-size: 14px;
color: #f6fbff;
font-weight: 300;
line-height: 1.5;
background: linear-gradient(to bottom, rgba(6, 6, 6, 0.74) 0, rgba(60, 60, 58, 0.76) 100%), url(https://media.discordapp.net/attachments/655505873216733189/656992737748582400/heady.png);
}
/**
* Sistema de Grid e ajustes das colunas genêricas:
*/
.fa-footer .fa-footer-row {
display: flex;
flex-direction: row;
padding: 0 15px;
}
.fa-footer .fa-footer-row .fa-footer-col {
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
margin-right: 30px;
padding: 15px 0;
min-width: 200px;
}
.fa-footer .fa-footer-row .fa-footer-col:last-child { margin-right: 10px; }
.fa-footer .fa-footer-row .fa-footer-col .lead {
text-transform: uppercase;
font-size: 18px;
font-weight: 500;
color: #fff;
margin-bottom: 10px;
}
.fa-footer .fa-footer-row .fa-footer-col p {
font-size: 14px;
line-height: 1.6;
text-align: justify;
}
/**
* Ajustes para a a coluna primária:
*/
.fa-footer .fa-footer-row .fa-primary-footer-col {
position: relative;
flex-grow: 1;
}
.fa-footer .fa-footer-row .fa-primary-footer-col .fa-footer-logo {
display: flex;
justify-content: center;
align-items: center;
}
.fa-footer .fa-footer-row .fa-primary-footer-col .fa-footer-logo img {
width: auto;
margin: 0 30px;
}
.fa-footer .fa-footer-row .fa-primary-footer-col .fa-footer-back-to-top {
position: absolute;
right: -20px;
bottom: -20px;
display: inline-flex;
justify-content: center;
align-items: center;
width: 40px;
height: 40px;
background-color: #24282b;
color: #00DCFF;
font-size: 23px;
border-radius: 20px;
z-index: 3;
cursor: pointer;
transition: all 100ms linear;
}
.fa-footer .fa-footer-row .fa-primary-footer-col .fa-footer-back-to-top .fa { margin-top: -3px; }
.fa-footer .fa-footer-row .fa-primary-footer-col .fa-footer-back-to-top:hover {
background-color: #00DCFF;
color: #fff;
}
/**
* Atribuição final:
*/
.fa-footer .fa-footer-attr {
text-align: center;
padding: 20px;
font-size: 16px;
border-top: solid 1px #2a2e32;
background-color: #24282b;
}
.fa-footer-logo:hover {
-webkit-filter: drop-shadow(0px 5px 20px rgb(255,255,255)) grayscale(1);
filter: drop-shadow(0px 0px 0px rgb(255,255,255)) grayscale(1);
}
/**
* Ajustes para o footer do FA:
*/
#page-footer {
background-color: #212529;
border-top: solid 1px #2a2e32;
border-bottom: solid 1px #2a2e32;
}
.statistics {
box-shadow: 0px -2px 3px rgba(0, 0, 0, 0.37);
}
/**
* Responsive:
*/
@media screen and (max-width: 1000px) {
.fa-footer .fa-footer-row .fa-primary-footer-col .fa-footer-logo img {
margin: 0px;
}
}
@media screen and (max-width: 850px) {
.fa-footer .fa-footer-row {
flex-wrap: wrap;
}
.fa-footer .fa-footer-row .fa-primary-footer-col {
border-right: none;
}
.fa-footer .fa-footer-row .fa-primary-footer-col .fa-footer-logo {
margin-bottom: 2%;
}
.fa-footer .fa-footer-row .fa-primary-footer-col .fa-footer-back-to-top {
right: auto;
}
.fa-footer .fa-footer-row .fa-footer-col:nth-child(2) {
margin-top: 2%;
}
}
/* OUTROS
=================================================================*/
/* USUÁRIOS & RANKS
** ======================================== */
.rank {
color: #fff;
font-size: 13px;
font-weight: 700;
height: 40px;
line-height: 40px;
margin: 10px auto 0;
width: 200px;
padding: 0 5px;
border-radius: 10px;
border-bottom: 2px solid rgba(0,0,0,0.2);
}
.rank:before {
float: left;
width: 40px;
height: 40px;
line-height: 40px;
left: 5px;
background-color: rgba(255,255,255,0.2);
text-align: center;
font-size: 15px;
color: #fff;
font-family: 'Font Awesome 5 Free';
}
/* Ranks Administrativos*/
.rank.supr{background-image: linear-gradient(124deg, #00DCFF, #FF7F00, #FFFF00, #00FF00, #0000ff, #4b0082, #8f00ff);background-size: 1800% 1800%;animation: rainbow 5s linear infinite;}
.rank.supr:before{content: "\f521";margin-right: 5px;font-family: "Font Awesome 5 Free";}
.rank.adm{background-image: radial-gradient(circle, #00DCFF, #db0a10, #b71317, #941719, #711919);background-size: 1800% 1800%;animation: rainbow 6s ease infinite;}
.rank.adm:before{content: "\f085";margin-right: 5px;font-family: "Font Awesome 5 Free";}
.rank.cor{background-image: linear-gradient(to right, #0f9b0f,#002b00,#000000);}
.rank.cor:before{content: "\f0e3";margin-right: 5px;font-family: "Font Awesome 5 Free";}
.rank.dir{background-image: linear-gradient(180deg, rgba(165,255,135,1) 0%, rgba(64,255,0,1) 64%);}
.rank.dir:before{content: "\f24e";margin-right: 5px;font-family: "Font Awesome 5 Free";}
.rank.af{background-image: linear-gradient(0deg, rgba(55,55,55,1) 0%, rgba(126,126,126,1) 35%, rgba(226,226,226,1) 100%);}
.rank.af:before{content: "\f201";margin-right: 5px;font-family: "Font Awesome 5 Free";}
.rank.git{background: linear-gradient(to right, #000000 0%, #4b0303 100%); color:#9e0000;}
.rank.git:before{content: "\f714";margin-right: 5px;font-family: "Font Awesome 5 Free";}
.rank.p2{background: linear-gradient(to right, #000000 0%, #07121c 100%); color:#9e0000;}
.rank.p2:before{content: "\f714";margin-right: 5px;font-family: "Font Awesome 5 Free";}
.rank.dsn{background: linear-gradient(to right, #feac5e, #c779d0, #4bc0c8);background-size: 1800% 1800%;animation: rainbow 10s ease infinite;}
.rank.dsn:before{content: "\f121";margin-right: 5px;font-family: "Font Awesome 5 Free";}
@keyframes rainbow {0% {background-position: 0% 82%;} 50% {background-position: 100% 19%;} 100% {background-position: 0% 82%;}}
.rank.crh{background: linear-gradient(to right, #06bcff 0%, #1b014c 100%);}
.rank.crh:before{content: "\f2c2";margin-right: 5px;font-family: "Font Awesome 5 Free";}
.rank.srp{background-image: linear-gradient(to right, #bdbdbd, #0e0e0e);}
.rank.srp:before {content: "\f274";margin-right: 5px;font-family: "Font Awesome 5 Free";}
/*Ranks dos Usuários*/
.rank.mbr{background-color:#78866b}
.rank.mbr:before{content: "\f4ad";margin-right: 5px;font-family: "Font Awesome 5 Free";}
.rank.ori{background-color:#1100FF;}
.rank.ori:before{content: "\f19d";margin-right: 5px;font-family: "Font Awesome 5 Free";}
.rank.tre{background-color:#F00000;}
.rank.tre:before{content: "\f19d";margin-right: 5px;font-family: "Font Awesome 5 Free";}
.rank.rond{background-color:#FF6600;}
.rank.rond:before{content: "\f19d";margin-right: 5px;font-family: "Font Awesome 5 Free";}
.rank.ldr{background: linear-gradient(to right, #009688 0%, #7986CB 100%);}
.rank.ldr:before{content: "\f4ad";margin-right: 5px;font-family: "Font Awesome 5 Free";}
.rank.ref{background: linear-gradient(to right, #cc3399 0%, #ff009c 100%);}
.rank.ref:before{content: "\f4be";margin-right: 5px;font-family: "Font Awesome 5 Free";}
/** Personalização de Legenda e Grupos**/
/* ------ ESTILO DESATIVADO ------
a[style*=""], span[style*=""] {
background: url(https://i.imgur.com/Ca1WdXK.gif);
font-weight: bold;
text-shadow: 2px 0px 11px #2bc7df;
}
div [style*=""]::before {
font-family: "Font Awesome 5 Free";
content:'\f121';
color: ;
margin-right: 2px;
font-weight: 1000;
font-size: 11px;
}*/
a[style*="#3296FA"], span[style*="#3296FA"] {
background: repeating-linear-gradient(to right, #00DCFF, #FF7F00, #FFFF00, #00FF00, #0000ff, #4b0082, #8f00ff);
-webkit-background-clip: text;
background-size: 1800% 1800%;
-webkit-text-fill-color: transparent;
animation: rainbow 3s ease infinite;
}
div [style*="#3296FA"]::before {
font-family: "Font Awesome 5 Free";
content:'\f3ed';
margin-right: 3px;
font-weight: 1000;
font-size: 12px;
}
a[style*="#1E6104"], span[style*="#1E6104"] {
font-weight: bold;
}
div [style*="#1E6104"]::before {
font-family: "Font Awesome 5 Free";
content:'\f21b';
color: #1E6104;
margin-right: 3px;
font-weight: 1000;
font-size: 13px;
}
a[style*="#A70404"], span[style*="#A70404"] {
font-weight: bold;
}
div [style*="#A70404"]::before {
font-family: "Font Awesome 5 Free";
content:'\f714';
color: #A70404;
margin-right: 3px;
font-weight: 1000;
font-size: 13px;
}
a[style*="#636363"], span[style*="#636363"] {
font-weight: bold;
}
div [style*="#636363"]::before {
font-family: "Font Awesome 5 Free";
content:'\f0e7';
color: #636363;
margin-right: 3px;
font-weight: 1000;
font-size: 13px;
}
a[style*="#081A0B"], span[style*="#081A0B"] {
font-weight: bold;
}
div [style*="#081A0B"]::before {
font-family: "Font Awesome 5 Free";
content:'\f0e3';
color: #081A0B;
margin-right: 3px;
font-weight: 1000;
font-size: 13px;
}
a[style*="#259986"], span[style*="#259986"] {
font-weight: bold;
}
div [style*="#259986"]::before {
font-family: "Font Awesome 5 Free";
content:'\f51c';
color: #259986;
margin-right: 3px;
font-weight: 1000;
font-size: 13px;
}
a[style*="#00BF9F"], span[style*="#00BF9F"] {
font-weight: bold;
}
div [style*="#00BF9F"]::before {
font-family: "Font Awesome 5 Free";
content:'\f2bb';
color: #00BF9F;
margin-right: 3px;
font-weight: 1000;
font-size: 13px;
}
a[style*="#50C728"], span[style*="#50C728"] {
font-weight: bold;
}
div [style*="#50C728"]::before {
font-family: "Font Awesome 5 Free";
content:'\f0ac';
color: #50C728;
margin-right: 3px;
font-weight: 1000;
font-size: 13px;
}
a[style*="#00731F"], span[style*="#00731F"] {
font-weight: bold;
}
div [style*="#00731F"]::before {
font-family: "Font Awesome 5 Free";
content:'\f201';
color: #00731F;
margin-right: 3px;
font-weight: 1000;
font-size: 13px;
}
a[style*="#7E7F80"], span[style*="#7E7F80"] {
font-weight: bold;
}
div [style*="#7E7F80"]::before {
font-family: "Font Awesome 5 Free";
content:'\f482';
color: #7E7F80;
margin-right: 3px;
font-weight: 1000;
font-size: 13px;
}
a[style*="#1100FF"], span[style*="#1100FF"] {
font-weight: bold;
}
div [style*="#1100FF"]::before {
font-family: "Font Awesome 5 Free";
content:'\f5da';
color: #1100FF;
margin-right: 3px;
font-weight: 1000;
font-size: 13px;
}
a[style*="#F05BBC"], span[style*="#F05BBC"] {
font-weight: bold;
}
div [style*="#F05BBC"]::before {
font-family: "Font Awesome 5 Free";
content:'\f02e';
color: #F05BBC;
margin-right: 3px;
font-weight: 1000;
font-size: 13px;
}
a[style*="#235161"], span[style*="#235161"] {
font-weight: bold;
}
div [style*="#235161"]::before {
font-family: "Font Awesome 5 Free";
content:'\f66f';
color: #235161;
margin-right: 3px;
font-weight: 1000;
font-size: 13px;
}
/*LEG COLOR - USUARIOS*/
a[href="/u66"] {
font-weight: bold;
color: #fb11c9!important;
}
/*---- Destaque Habbo ----*/
a[href="/u0"]:not(.profile-icon):before { /*ID DE USUARIO NO FÓRUM*/
font-family: "Font Awesome 5 Free";
content:'\f005';
color:#ffbc07;
margin-right: 5px;
font-weight: 1000;
}
.postprofile-avatar a[href="/u0"]:before { display: none; }
/*---- Assinaturas ----*/
.fa {
display: inline-block;
font: normal normal normal 14px/1 FontAwesome;
font-size: inherit;
text-rendering: auto;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
}
.fa-star:before { content: "\f005"; }
.signature_div a, .signature_div a:visited, .signature_div a:focus, .signature_div a:active { color: #0372be!important; }
.signature_div a:hover { color: #d31141!important; }
.assinatura_admin {
font: 300 18px 'Segoe UI',sans-serif;
background:#fff;
box-shadow:0 1px 1px 0 rgba(0, 0, 0, 0.5);
width:80%;
border-radius:3px;
border-spacing:0;
line-height:32px;
margin:16px 0 16px 16px;
}
.assinatura_admin .desc {
padding:0 16px 16px 48px;
background: url(https://i.imgur.com/8jVOO0D.png) no-repeat 16px 8px;
border-bottom:1px #ccc solid;
}
.assinatura_admin .sign {
padding:10px 16px;
color:#2C353B;
background:url(https://i.imgur.com/nI7w4wh.png) no-repeat right 16px center;
line-height: 24px;
font-size: 15px;
}
/* REGISTRO
=================================================================*/
.instruction {
width: 80%;
height: 160px;
position: relative;
background-color: #8D6CAB;
background-image: url(https://i.imgur.com/axuzFM4.png);
border-radius: 5px;
margin: auto;
}
.instruction:before {
width: 275px;
height: 160px;
position: absolute;
right: 0;
top: 0;
background-image: url(https://i.imgur.com/mC9g8Wg.png);
border-radius: 0 5px 5px 0;
content: '';
}
.instruction .frank {
width: 110px;
height: 143px;
margin: 17px 0 0 17px;
background-image: url(https://i.imgur.com/smFt8fk.png);
float: left;
}
.instruction .cont {
width: 540px;
height: 110px;
margin: 20px 0 0 11px;
text-shadow: 0 1px 2px rgba(0,0,0,0.3);
font-size: 12px;
color: #FFF;
float: left;
}
.instruction .cont p:first-of-type {
margin-bottom: 10px;
font-size: 18px;
font-weight: 700;
}
/*** ESTATÍSTICAS
======================================= ***/
.block { background-color: #E9EBED;
box-shadow: 0 0 5px rgb(0 0 0 / 90%); }
.block a:link,
.block a:visited {
color: #444;
}
.block .h3 {
font-size: 20px;
border: none;
}
.block .h3 i {
height: 28px;
line-height: 30px;
margin-right: 10px;
color: #f5f5f5;
}
.stat-card {
background-color: #E9EBED;
border-radius: 3px;
box-shadow: 0 1px 6px rgb(0 0 0 / 82%);
color: #262626;
font-size: 0;
float: left;
height: 75px;
padding: 15px;
width: 20%;
margin-right: 34px;
text-align: right;
}
.stat-card:last-child { margin-right: 0; }
.stat-card title-stat {
display: block;
font-size: 11px;
text-transform: uppercase;
letter-spacing: 1px;
}
.stat-card strong {
font-size: 25px;
font-weight: 900;
letter-spacing: -1px;
color: #d8b500;
}
.stat-card i {
float: left;
font-size: 40px;
color: #d8b500;
margin-top: -13px;
margin-bottom: -30px;
}
.block .legend { font-size: 0px; }
.block .legend b a {
font-size: 13px;
font-weight: 600;
}
.block .legend b a::after {
content: ", ";
font-weight: 400;
color: #000;
}
.block .legend b:last-child a::after { content: ""; }
/*Mod Tools*/
.success a, .information a, .warn a, .alert a, .custom a, .dev a, .admin a{color: #ecf0f1!important;text-decoration: underline!important;}
.success {/*color: #270;*/background-color: #00a300;}
.success tr::before {content: '\F058 ';font-family: "FontAwesome";}
.alert {/*color: #9F6000;*/background-color: #ffc40d;}
.alert tr::before {content: '\F071 ';font-family: FontAwesome;}
.warn {/*color: #D8000C;*/background-color: #00DCFF;}
.warn tr::before {content: '\F057 ';font-family: FontAwesome;}
.information {/*color: #059;*/background-color: #3a99d9;}
.information tr::before {content: '\F05a ';font-family: FontAwesome;}
.custom {background-color: #2C3E50;}
.custom tr::before {content: '\F069 ';font-family: FontAwesome;}
.dev {background-color: #3296FA;}
.dev tr:before {content: '\F121 ';font-family: FontAwesome;}
.info-table.dev {background: linear-gradient(to right, #000000, #ff2400, #e81d1d, #e8b71d, #e3e81d, #1de840, #1ddde8, #2b1de8, #dd00f3, #c0c0c0, #FFFFFF);background-size: 1800% 1800%;animation: rainbow 10s ease infinite;}
.info-table.success{background-image: linear-gradient(to right top, #00ff16, #33eb0a, #43d702, #4bc400, #4fb100, #4da300, #4a9500, #468700, #3f7a00, #396d00, #326100, #2c5500);background-size: 1800% 1800%;animation: rainbow 4s ease infinite;}
.mod_groups {
line-height: 1.5;
font-size: 11px;
font-weight: 400;
}
.mod_editor_section {
background: #eceff1;
padding: 5px;
font-weight: bold;
text-align: left;
text-transform: uppercase;
}
.copyright_e {
font-size: 9px;
color: black;
}
.mod_editor_message {
padding: 2px 5px;
text-align: left;
}
.mod_groups {
height: 150px;
overflow-y: scroll;
}
.mod_groups li {
list-style-type: none;
}
/*---- Resposta rápida ----*/
#quick_reply {
width: 80%;
margin: auto;
}
.sceditor-container { border-color: #f5f5f5!important; }
#quick_reply #textarea_content {
box-shadow: 0px 7px 20px 0px rgba(0,0,0,0.3);
border-radius: 5px;
}
.sceditor-toolbar {
background: #6f6868!important;
border-bottom: none!important;
}
.sceditor-group { border-color: rgba(255,255,255,0.6)!important; }
.sceditor-button {
background-color: #E9EBED;
margin-right: 2px;
border-bottom: 1px solid rgba(0,0,0,0.5);
}
.sceditor-button.active, .sceditor-button:active, .sceditor-button:hover, .sceditor-button.hover {
background-color: #E9EBED!important;
box-shadow: none!important;
}
/*SCEDITOR*/
.sceditor-container iframe, .sceditor-container textarea {
background: #E9EBED!important;
color: #262626!important;
}
.sceditor-container {background-color: #E9EBED!important;}
.sceditor-button-staff { position: relative;}
.mod_box {
top: 73px;
-moz-background-clip: padding;
background: #fafafa;
background-clip: padding-box;
border: 1px solid #eee;
box-shadow: 1px 2px 4px rgba(0, 0, 0, 0.2);
color: #666;
width: 200px;
line-height: 1;
position: absolute;
}
#quick_reply .mod_box {
top: 35px;
}
.sceditor-button-staff.disabled div {
opacity: 1.0 !important;
filter: alpha(opacity=100) !important;
}
.sceditor-button, .sceditor-button div {
-webkit-box-sizing: content-box!important;
-moz-box-sizing: content-box!important;
box-sizing: content-box!important;
}
.sceditor-button {position: relative;}
a.sceditor-button {padding: .7em;}
.sceditor-button * {
text-indent: initial!important;
color: #262626!important;
line-height: 15px!important;
}
.sceditor-button div {
font-size: 0px!important;
background-image: none!important;
text-rendering: auto;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
}
.sceditor-button div:before {
font-size: 15px!important;
font-family: FontAwesome;
text-indent: initial!important;
position: absolute;
left: 50%;
top: 50%;
transform: translate(-50%, -50%);
font-weight: 500!important;
}
.sceditor-button-bold div:before {content: "\f032";}
.sceditor-button-italic div:before {content: "\f033";}
.sceditor-button-underline div:before {content: "\f0cd";}
.sceditor-button-strike div:before {content: "\f0cc";}
.sceditor-button-left div:before {content: "\f036";}
.sceditor-button-center div:before {content: "\f037";}
.sceditor-button-right div:before {content: "\f038";}
.sceditor-button-justify div:before {content: "\f039";}
.sceditor-button-bulletlist div:before {content: "\f0ca";}
.sceditor-button-orderedlist div:before {content: "\f0cb";}
.sceditor-button-horizontalrule div:before {content: "\f068";}
.sceditor-button-quote div:before {content: "\f10d";}
.sceditor-button-code div:before {content: "\f1c9";}
.sceditor-button-faspoiler div:before {content: "\f146";}
.sceditor-button-fahide div:before {content: "\f070";}
.sceditor-button-table div:before {content: "\f0ce";}
.sceditor-button-servimg div:before {content: "\f03e";}
.sceditor-button-image div:before {content: "\f1c5";}
.sceditor-button-link div:before {content: "\f0c1";}
.sceditor-button-youtube div:before {content: "\f166";}
.sceditor-button-dailymotion {display: none;}
.sceditor-button-flash div:before {content: "\f008";}
.sceditor-button-headers div:before {content: "\f1dc";}
.sceditor-button-size div:before {content: "\f034";}
.sceditor-button-color div:before {content: "\f1fc";}
.sceditor-button-font div:before {content: "\f031";}
.sceditor-button-removeformat div:before {content: "\f12d";}
.sceditor-button-more div:before {content: "\f067";}
.sceditor-button-subscript div:before {content: "\f12c";}
.sceditor-button-superscript div:before {content: "\f12b";}
.sceditor-button-fascroll div:before {content: "\f060";}
.sceditor-button-faupdown div:before {content: "\f062";}
.sceditor-button-farand div:before {content: "\f074";}
.sceditor-button-date div:before {content: "\f133";}
.sceditor-button-time div:before {content: "\f017";}
.sceditor-button-pastetext div:before {content: "\f0ea";}
.sceditor-button-source div:before {content: "\f016";}
.sceditor-button-dailymotion div:before {content: "\f03d";}
.sceditor-button-staff div:before {content: "\f132"; color: #dc0000;}
.success, .information, .warn, .alert, .custom, .dev, .jrevo, .admin, .audi {
width: 95%;
height: auto;
padding: 1.4em;
margin: 1em;
/*border: 2px solid;*/
text-align: left;
border-radius: 2px;
font-weight: 300;
color: white;
}
#container {
margin-right: 0 !important;
margin-left: 0 !important;
}
Re: Adicionar imagem ao pop-up de login
Olá, localize o seu PopUp de Login na folha, que se encontra na linha 485 até 631.
Altere para esse:
Aguardo respostas,
DaviMorais
Altere para esse:
- Código:
/*-- POPUP DE LOGIN --*/
.login-popup {
-webkit-box-shadow:0 0 20px rgba(0,0,0,.4);
box-shadow:0 0 20px rgba(0,0,0,.4);
background-color:#fff;
-webkit-border-radius:20px;
-moz-border-radius:20px;
border-radius:20px;
position:relative;
padding:37px 50px 50px 325px;
width:auto;max-width:645px;
margin:20px auto;
overflow:hidden;
}
.login-popup:before,
.login-popup:after {
-webkit-border-radius:192px/290px;
-moz-border-radius:192px/290px;
border-radius:192px/290px;
width:385px;
height:580px;
position:absolute;
content:"";
top:0;
display:block;
bottom:0;
margin:auto;
}
.login-popup:before {
background-image:url(https://i.imgur.com/USDUbuf.png);
background-position: -320px -92px;
left:-95px;
}
.login-popup::after {
background-image: url(https://i.servimg.com/u/f83/19/58/12/30/16105811.png);
background-color: #00DCFFb3;
background-position: 154px center;
background-repeat:no-repeat;
left: -93px;
}
.login-popup h3 {
color:#000;
font-size: 20px;
line-height: 26px;
border-bottom: 1px solid rgba(0,0,0,.2);
padding-bottom: 10px;
margin-bottom: 25px;
margin-top: 0;
}
.login-popup .login-form .username-input,
.login-popup .login-form .password-input {
position:relative;
display:block;
}
.login-popup .login-form .username-input i,
.login-popup .login-form .password-input i {
font-size:18px;
font-weight:700;
color: #d4d4d4;
position:absolute;
top:13px;
right:18px;
cursor:text;
display:block;
-webkit-transition:color .2s;
transition:color .2s;
}
.login-popup .login-form .username-input i:before,
.login-popup .login-form .password-input i:before {
font-size:18px;
}
.login-popup .login-form .rounded-input {
padding-right:40px;
margin-bottom:15px;
background-color: #fff;
-webkit-border-radius: 48px;
-moz-border-radius: 48px;
border-radius: 48px;
padding: 11px 24px;
display: block;
font-family: poppins,Arial,sans-serif;
font-weight: 300;
font-size: 14px;
color: #333;
border: 1px solid #d4d4d4;
width: 100%;
height: 47px;
-webkit-transition: border-color .2s;
transition: border-color .2s;
}
.login-popup .login-form .rounded-input:focus,
.login-popup .login-form .rounded-button:focus {
border-color: #15253d;
outline: none;
}
.login-popup .login-form .rounded-input:focus~i { color: #15253d; }
.login-popup .rounded-button {
-webkit-border-radius: 48px;
-moz-border-radius: 48px;
border-radius: 48px;
padding: 11px 24px;
text-decoration: none;
font-weight: 600;
font-size: 14px;
text-transform: uppercase;
cursor: pointer;
height: 47px;
line-height: 21px;
text-shadow: none;
text-align: center;
-webkit-transition: background-color .2s,color .2s;
transition: background-color .2s,color .2s;
display: block;
width:100%;
color: #fff;
}
.rounded-button.login {
background-color: #00DCFF;
}
.rounded-button.register {
background-color: #00DCFF;
margin-top: 10px;
margin-bottom: -5%;
}
.login-popup .login-form .rounded-button.login:hover { background-color: #FDD111; }
.login-popup .rounded-button.register:hover { background-color: #FDD111; }
Aguardo respostas,
DaviMorais
Re: Adicionar imagem ao pop-up de login
Foi, irmão.
Agradeço grandemente, forte abraço.
Pode fechar.
Ulalau.
Agradeço grandemente, forte abraço.
Pode fechar.
Ulalau.
Re: Adicionar imagem ao pop-up de login
Tópico resolvidoMovido para "Questões resolvidas". |
Tópicos semelhantes
» [TUTORIAL] Adicionar imagem para login
» Adicionar login em pop-up
» Adicionar login em pop-up
» Login com imagem
» Imagem atrás do login
» Adicionar login em pop-up
» Adicionar login em pop-up
» Login com imagem
» Imagem atrás do login
Fórum dos Fóruns :: Ajuda e atendimento ao utilizador :: Questões sobre a aparência do fórum :: Questões resolvidas sobre a aparência do fórum
Página 1 de 1
Permissões neste sub-fórum
Não podes responder a tópicos