Diferencia entre revisiones de «MediaWiki:Common.css»
Ir a la navegación
Ir a la búsqueda
m |
|||
(No se muestran 100 ediciones intermedias de 3 usuarios) | |||
Línea 122: | Línea 122: | ||
.wpb-topbanner-toc { | .wpb-topbanner-toc { | ||
font-family: Ubuntu; | font-family: Ubuntu; | ||
} | } | ||
Línea 161: | Línea 137: | ||
padding: 1em; | padding: 1em; | ||
column-count: 3; | column-count: 3; | ||
column-gap: | column-gap: 30px; | ||
} | } | ||
Línea 196: | Línea 172: | ||
.column { | .column { | ||
float: left; | float: left; | ||
} | } | ||
Línea 374: | Línea 349: | ||
{ | { | ||
overflow-y: scroll; | overflow-y: scroll; | ||
height: | height: 240px; | ||
padding-top: 3px; | padding-top: 3px; | ||
padding-bottom: 13px; | padding-bottom: 13px; | ||
Línea 396: | Línea 371: | ||
/*Delete Link Modifications*/ | /*Delete Link Modifications*/ | ||
.home-header a { | |||
color: inherit !important; | |||
text-decoration: none; | |||
} | |||
.category-bottom a, .category-bottom a:hover, .category-bottom a:focus, .category-bottom a:active, .category-bottom a:visited | .category-bottom a, .category-bottom a:hover, .category-bottom a:focus, .category-bottom a:active, .category-bottom a:visited | ||
{ | { | ||
text-decoration: none | color: #000000; | ||
text-decoration: none; | |||
} | } | ||
Línea 499: | Línea 480: | ||
{ | { | ||
background-image: url("/images/6/63/Embajadores_BR_Publicidad.png"); | background-image: url("/images/6/63/Embajadores_BR_Publicidad.png"); | ||
background-position: | background-position: 274px 167px; | ||
} | } | ||
Línea 534: | Línea 515: | ||
{ | { | ||
background-image: url("/images/7/7c/Avatares_NFT.png"); | background-image: url("/images/7/7c/Avatares_NFT.png"); | ||
background-position: | background-position: 269px 230px; | ||
} | } | ||
Línea 583: | Línea 564: | ||
{ | { | ||
background-image: url("/images/c/cb/Banner_Fansites.png"); | background-image: url("/images/c/cb/Banner_Fansites.png"); | ||
background-position: -62px - | background-position: -62px 3px; | ||
} | |||
/*Image and image position of the Category NFTFurni*/ | |||
.NFTFurni | |||
{ | |||
background-image: url("/images/3/3c/NFT_furni.png"); | |||
} | |||
/*Image and image position of the Category Metakey*/ | |||
.Metakey | |||
{ | |||
background-image: url("/images/7/7a/Meta_3.png"); | |||
} | } | ||
Línea 791: | Línea 782: | ||
/* Simple NFT list template by gabo */ | /* Simple NFT list template by gabo */ | ||
div.polaroid { | div.polaroid { | ||
width: 100%; | width: 100%; | ||
background-color: white; | background-color: white; | ||
box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19); | box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19); | ||
margin-bottom: | margin-bottom: 5px; | ||
border-radius: 0px 0px 5px 5px !important; | border-radius: 0px 0px 5px 5px !important; | ||
} | } | ||
Línea 807: | Línea 795: | ||
column-gap: 20px; | column-gap: 20px; | ||
} | |||
.column2 { | |||
float: left; | |||
width: 26%; | |||
margin-left: 5px; | |||
} | |||
.home-header { | |||
margin: 0!important; | |||
font-family: "Ubuntu", Arial, Tahoma !important; | |||
color: #fff !important; | |||
font-size: 20px!important; | |||
height: 65px; | |||
width: 250px; | |||
text-shadow: 0 1px 3px rgb(0 0 0 / 60%); | |||
box-shadow: 0 1px 5px rgba(0,0,0,.35); | |||
font-weight: 700; | |||
border: 0; | |||
padding: 10px!important; | |||
border-radius: 10px; | |||
text-decoration: none; | |||
display: flex; | |||
justify-content: flex-start; | |||
align-items: center; | |||
margin: 4px !important; | |||
margin-top: 8px !important; | |||
-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; | |||
} | |||
.home-header:hover { | |||
filter: brightness(120%); | |||
-webkit-filter: brightness(120%); | |||
-moz-filter: brightness(120%); | |||
} | |||
/*Ambassador Card*/ | |||
/*General Container*/ | |||
.emb{ | |||
display: inline-block; | |||
width: 233px; | |||
height: fit-content; | |||
box-sizing: border-box; | |||
margin-right: 6px; | |||
margin-bottom: 12px; | |||
border-radius: 5px; | |||
box-shadow: 2px 2px 8px rgb(0 0 0 / 50%); | |||
} | |||
/*Width and height counting padding to everthing except the general container*/ | |||
.emb * {box-sizing: border-box;} | |||
/*Text style for every <p>*/ | |||
.emb p { | |||
font-size: 13pt; | |||
margin: 0; | |||
text-align: center; | |||
} | |||
/*Card Title (You will see the ambassador's nick)*/ | |||
.emb .e-name { | |||
width: 100%; | |||
padding: 5px 10px; | |||
background-color: #cf9c1d; | |||
color: whitesmoke; | |||
border-radius: 5px 5px 0 0; | |||
overflow: hidden; | |||
text-overflow: ellipsis; | |||
font-size: 15pt; | |||
font-weight: bold; | |||
} | |||
/*Special display for ambassador's appearence (in habbbo) and the text with the rol*/ | |||
.emb .e-content * {display: inline-flex;} | |||
/*Style for background of ambassador's appearance*/ | |||
.emb .e-content .e-keko { | |||
display: flex; | |||
float: left; | |||
background: url('https://1.bp.blogspot.com/-hJswqb3mpqw/YN1fxq_msLI/AAAAAAABkaQ/hlzy85wjrGoc0m5ZU1lfpwzuvmGIHjZ1ACPcBGAsYHg/s0/inside.gif'), gray; | |||
width: fit-content; | |||
} | |||
/*Style for ambassador's appearance (in habbo)*/ | |||
.emb .e-content .e-keko img { | |||
width: 64px; | |||
height: 110px; | |||
margin: 0 10px; | |||
margin-bottom: 5px; | |||
user-select: none; | |||
} | |||
/*Align rol content with image correctly and background*/ | |||
.emb .e-content .e-info { | |||
display: flow-root; | |||
background-color: #3eb0d5; | |||
} | |||
/*Vertical Align rol text and icon*/ | |||
.emb .e-content .e-info div { | |||
display: flex; | |||
width: fit-content; | |||
height: 115px; | |||
margin: 0 auto; | |||
padding: 5px; | |||
align-items: center; | |||
} | |||
/*Horizontal Align rol text and icon*/ | |||
.emb .e-content .e-info div * {display: inline-block;} | |||
/*Size & separation of the info text*/ | |||
.emb .e-content .e-info div img { | |||
height: 40px; | |||
width: 40px; | |||
margin-right: 5px; | |||
} | |||
/*Info text appearance*/ | |||
.emb .e-content .e-info div p { | |||
max-height: 100%; | |||
overflow: auto; | |||
max-width: 100%; | |||
color: whitesmoke; | |||
} | |||
/*Container for profile link*/ | |||
.emb .e-profile { | |||
text-decoration: none; | |||
display: block; | |||
background-color: darkblue; | |||
color: whitesmoke; | |||
border-radius: 0 0 5px 5px; | |||
padding: 5px 10px; | |||
} | |||
/*Appearance of text profile link*/ | |||
.emb .e-profile p {font-size: 15pt;} | |||
.emb .e-profile:hover p {text-decoration: underline;} | |||
/*Appearance of img profile link*/ | |||
.emb .e-profile p img { | |||
margin-top: -3px; | |||
margin-right: 5px; | |||
user-select: none; | |||
vertical-align: middle; | |||
} | } |
Revisión actual del 16:47 26 sep 2022
/* Los estilos CSS colocados aquí se aplicarán a todas las apariencias */ * {font-family: Arial} #firstHeading{ font: 33px Ubuntu, serif; } .infobox { background: #eee; border: 1px solid #aaa; float: right; margin: 0 0 1em 1em; padding: 1em; width: 300px; } .infobox-title { font-size: 2em; text-align: center; font-family: Ubuntu; } .infobox-image { text-align: center; padding: 8px 0px; background: url(/images/9/9c/Background_box2.png); } .infobox-header { text-align: center; } .infobox-placa { text-align: center; } .infobox th { text-align: left; vertical-align: top; } .infobox td { vertical-align: top; } .wpb-topbanner-toc{ font-family: Ubuntu; } .inforare { background: #eee; border: 1px solid #aaa; float: right; margin: 0 0 1em 1em; padding: 1em; width: 300px; } .inforare-title { font-size: 2em; text-align: center; font-family: Ubuntu; } .inforare-image { text-align: center; padding: 5px 0px; background: url(https://files.habboemotion.com/resources/images/website_backgrounds/newbg.png); } .infobox-header-rare { text-align: center; } .inforare-placa { text-align: center; } .inforare th { text-align: left; vertical-align: top; } .inforare td { vertical-align: top; } .wpb-topbanner-toc{ font-family: Ubuntu; } #ca-talk { display: none !important; } /* Los estilos CSS colocados aquí se aplicarán a todas las apariencias */ * {font-family: Arial} .menu { background: #eee; float: left; border: 1px solid #aaa; margin: 0 0 0em 0em; padding: 0em; width: 50%; } .menu-title { font-size: 2em; text-align: center; font-family: Ubuntu; } .menu-image { text-align: center; } .menu-placa { text-align: right; } .menu th { text-align: left; vertical-align: top; } .menu td { vertical-align: top; } .wpb-topbanner-toc { font-family: Ubuntu; } #ca-talk { display: none !important; } * {font-family: Arial} .menu3 { background: #eee; border: 1px solid #aaa; margin: 0 0 1em 1em; padding: 1em; column-count: 3; column-gap: 30px; } } .menu3-title { font-size: 2em; text-align: center; font-family: Ubuntu; } .menu3-image { text-align: center; } .menu3-placa { text-align: right; } .menu3 th { text-align: center; vertical-align: top; } .menu3 td { vertical-align: top; } .wpb-topbanner-toc{ font-family: Ubuntu; } #ca-talk { display: none !important; } .column { float: left; } /* Clear floats after the columns */ .container:after { content: ""; display: table; clear: both; } /* Simple stafflist template by Kriegberg */ /* Individual member boxes */ .stafflist-member { /* Specify the stafflist member box properties */ width: 280px; height: 80px; background-color: #E0E0E0; margin: 5px; vertical-align: middle; /* Make the character image show up in the correct way */ background-repeat: no-repeat; background-position: 30px 5px; image-rendering: pixelated; image-rendering: -moz-crisp-edges; /* Display as float left to prevent line breaks between div elements and to keep things tidy */ float: left; } /* Individual member name */ .stafflist-member-name { margin-top: 28px !important; margin-right: 20px !important; font-size: 18px; font-weight: bold; line-height: 0.5; text-align: right; } /* Individual member description */ .stafflist-member-description { margin-right: 20px !important; font-size: 16px; line-height: 0.5; text-align: right; } /* Staff Card */ /*Correct text position written after </html>*/ .HitBox-Height { display: table; } /* Card Appearance */ .Staff-Habbo { width: 200px; height: 346px; line-height: 1.15; border: 1px solid #bb9513; background-color: #f7d547; margin-right: 8px; margin-bottom: 15px; float: left; text-decoration: none; color: black; } .Staff-Habbo:active { color: black; text-decoration: none; } .Staff-Habbo:visited { color: black; text-decoration: none; } .Staff-Habbo:link { text-decoration: none; } /* Staff Title */ .Staff-Habbo t { display: block; background-color: #f9d141; } .Staff-Habbo t p { margin: 0; text-align: center; font-size: 20px; } .Staff-Habbo t p img { vertical-align: unset; margin-left: -3px; margin-right: 3px; image-rendering: pixelated; image-rendering: -moz-crisp-edges; -ms-interpolation-mode: nearest-neighbor; } /* Staff Appearance */ .Staff-Habbo picture { display: block; height: 133px; background-color: #f9db4a; text-align: center; } .Staff-Habbo picture img { vertical-align: unset; image-rendering: pixelated; image-rendering: -moz-crisp-edges; -ms-interpolation-mode: nearest-neighbor; } /* Descriptive Text */ .Staff-Habbo txt p { margin: 8px 30px 8px 8px; } /*Popular & Selection styles*/ /*Important Classes*/ /*General Style*/ .category { width: 250px; line-height: 1.15; font-weight: bolder; margin-right: 40px; image-rendering: pixelated; } /*Group Title Style*/ .category-top { border: 1px solid; border-bottom: 0; text-align: center; padding: 3px; height: 26.45px; } /*Eliminate Extra Margin & Add Custom Font Size*/ .category-top p { margin: 0; font-size: 21px; } /*Group Container Pages Style*/ .category-bottom { overflow-y: scroll; height: 240px; padding-top: 3px; padding-bottom: 13px; border: 1px solid; font-size: 30px; scrollbar-width: thin; } /*Width & Color of the Scrollbar Background (Chromium & Safari)*/ .category-bottom::-webkit-scrollbar { width: 8px; background-color: #f0f0f0; } /*Color of the Scrollbar (Chromium & Safari)*/ .category-bottom::-webkit-scrollbar-thumb { background-color: #cdcdcd; } /*Delete Link Modifications*/ .home-header a { color: inherit !important; text-decoration: none; } .category-bottom a, .category-bottom a:hover, .category-bottom a:focus, .category-bottom a:active, .category-bottom a:visited { color: #000000; text-decoration: none; } /*Group Pages Style and Font Effect*/ .category-bottom a div { display: flex; width: 90%; height: 60px; margin-top: 10px; margin-left: auto; margin-right: auto; border: 1px solid; border-radius: 3px; text-shadow: 0 0 1em black, 0 0 0.2em black, 0 0 0.3em black, 0 0 0.4em black, 0 0 0.5em black; } /*Font Color for Pages Titles*/ .category-bottom a div p { margin: auto; text-align: center; color: white; } /*Selección HabboWiki Classes*/ /*Image, image position of the Title Selección HabboWiki & Text Adaptation for the image*/ .HabboWiki { background-image: url("/images/5/5e/Estrella.png"); background-repeat: no-repeat; background-position: 96.5% 55%; font-size: 21px; padding-right: 23px; height: 26.45px; } /*Special Font for Selección HabboWiki Title*/ .category .HabboWiki p { font-size: 21px; line-height: 27px; } /*Más Populares Classes*/ /*Image, image position of the Title Entradas Populares & Text Adaptation for the image*/ .Popular { background-image: url("/images/5/5b/More_Populars_Icon.png"); background-repeat: no-repeat; background-position: 94.3% 55%; padding-right: 22px; } /*Background color (Rainbow) of the Lámpara Dragón Arcoíris LTD page*/ .Rainbow_Dragon { background: linear-gradient(to bottom, red, orange, yellow, green, blue); } /*Image and image position of the SnowStorm page*/ .SnowStorm { background-image: url("/images/6/6c/SS_and_Battle_Banzai.gif"); background-position: 314px 850px; } /*Image and image position of the Habbo 2020 page*/ .Habbo_2020 { background-image: url("https://www.habbowiki.com/images/b/be/Lpromo_habbo_trading.png"); background-position: 1200px 1330px; } /*Image and image position of the Crackeables page*/ .Craft { background-image: url("/images/3/36/Regalos.gif"); background-position: 750px 1000px; } /*Image and image position of the Asociación Internacional de Clubes page*/ .AIC { background-image: url("/images/3/37/Futbol_habbo.gif"); background-position: 980px 920px; } /*Background color (Gradient Pink) of the Dragón de Fuego Rosa page*/ .Pink_Dragon { background: radial-gradient(circle, pink 0%, #f97e93 100%); } /*Image and image position of the Embajadores page*/ .Emb { background-image: url("/images/6/63/Embajadores_BR_Publicidad.png"); background-position: 274px 167px; } /*Image and image position of the Beta Tester page*/ .Testers { background-image: url("/images/5/54/Betatester1.png"); background-position: 70px 82px; } /*Image and image position of the Puntos de Progresión page*/ .Points { background-image: url("/images/3/39/Puntos_Recompensa.png"); background-position: 302px 344px; } /*Image and image position of the Selección MaW page*/ .MaW { background-image: url("/images/3/30/MaW-BaW_Publicity.png"); background-position: 318px 100px; } /*Image and image position of the Category LTD*/ .LTD { background-image: url("/images/3/3e/Furnis_LTD_Mudo.png"); background-position: 730px 1010px; } /*Image and image position of the Category Proyectos NFT*/ .NFT { background-image: url("/images/7/7c/Avatares_NFT.png"); background-position: 269px 230px; } /*Image and image position of the Category Raros*/ .Rares { background-image: url("/images/5/5a/Rares_Banner.png"); background-position: 350px 320px; } /*Image and image position of the category Lotes*/ .Lotes { background-image: url("/images/2/2b/Creaci%C3%B3n_Lotes_Unity.png"); background-position: -130px 653px; } /*Image and image position of the Category Proyectos Oficiales*/ .Official_Projects { background-image: url("/images/1/16/Proyectos_oficiales.png"); background-position: 100px 100px; } /*Image and image position of the Category Proyectos No Oficiales*/ .Unofficial_Projects { background-image: url("/images/e/e5/Proyectos_no_oficiales.png"); background-position: 100px 100px; } /*Image and image position of the Category HabboTubers*/ .HBTubers { background-image: url("/images/7/70/HabboTubers.png"); background-position: 302px 260px; } /*Image and image position of the Category Juegos Oficiales*/ .Official_Games { background-image: url("/images/6/6c/SS_and_Battle_Banzai.gif"); background-position: -100px -50px; } /*Image and image position of the Category Fansites*/ .Fansites { background-image: url("/images/c/cb/Banner_Fansites.png"); background-position: -62px 3px; } /*Image and image position of the Category NFTFurni*/ .NFTFurni { background-image: url("/images/3/3c/NFT_furni.png"); } /*Image and image position of the Category Metakey*/ .Metakey { background-image: url("/images/7/7a/Meta_3.png"); } /*Image and image position of the Category Canjeables*/ .Canjeables { background-image: url("/images/9/99/Fondo_Lingotes.gif"); } /*Independent Classes*/ /*Selected Effect*/ .category-bottom a div:hover { opacity: 0.7; } /*Smaller Shadow Effect for Fonts*/ .less_shadow_font { text-shadow: 2px 2px 8px black; } /*Less Bold that Default*/ .bold { font-weight: bold; } /*Delete Bold*/ .no-bold { font-weight: initial; } /*Small text*/ .small_f { font-size: 25px; } /*Smaller text*/ .smaller { font-size: 20px; } .container2 { position: relative; width: 10%; max-width: 300px; min-width: 300px; display: inline-block; border: none !important; border: 0 !important; background: none !important; } .image2 { display: block; width: 100%; height: auto; max-width: 300px; min-width: 300px; } .overlay2 { position: absolute; bottom: 0; background: rgb(0, 0, 0); background: rgba(0, 0, 0, 0.5); /* Black see-through */ color: #f1f1f1; max-width: 300px; transition: .5s ease; opacity:0; color: white; font-size: 20px; padding: 20px; text-align: center; } .container2:hover .overlay2 { opacity: 1; } /* Simple NFT list template by Kriegberg */ /* Individual NFT boxes */ .nftlist-avatar { /* Specify NFT box properties */ width: 200px !important; height: 310px !important; margin: 5px !important; vertical-align: middle; /* Fix for pixel art blurriness */ image-rendering: pixelated !important; image-rendering: crisp-edges !important; /* Display as float left to prevent line breaks between div elements and to keep things tidy */ float: left !important; } /* Avatar info box styling */ .nftlist-avatar-info { margin-top: 220px !important; height: 80px !important; padding: 5px !important; background-color: rgba(0, 0, 0, 0.5) !important; border-radius: 0px 0px 10px 10px !important; } /* Avatar number styling */ .nftlist-avatar-info-number { font-size: 18px !important; font-weight: bold !important; color: #FFFFFF !important; line-height: 0.5 !important; text-align: center !important; margin-top: 22px !important; } /* Avatar owner info styling */ .nftlist-avatar-info-owner { font-size: 16px !important; color: #FFFFFF !important; line-height: 0.5 !important; text-align: center !important; } /* Simple NFT list template by Kriegberg */ /* Individual NFT boxes */ .nftlist-small-avatar { /* Specify NFT box properties */ width: 100px !important; height: 155px !important; margin: 5px !important; vertical-align: middle !important; /* Fix for pixel art blurriness */ image-rendering: pixelated !important; image-rendering: crisp-edges !important; /* Display as float left to prevent line breaks between div elements and to keep things tidy */ float: left !important; } /* Avatar info box styling */ .nftlist-small-avatar-info { margin-top: 110px !important; height: 41px !important; padding: 2px !important; background-color: rgba(0, 0, 0, 0.5) !important; border-radius: 0px 0px 5px 5px !important; } /* Avatar number styling */ .nftlist-small-avatar-info-number { font-size: 12px !important; font-weight: bold !important; color: #FFFFFF !important; line-height: 0.4 !important; text-align: center !important; margin-top: 11px !important; } /* Avatar owner info styling */ .nftlist-small-avatar-info-owner { font-size: 11px !important; color: #FFFFFF !important; line-height: 0.4 !important; text-align: center !important; } /* Simple NFT list template by Kriegberg2 */ /* Individual NFT boxes */ .nftlist-small-avatar2 { /* Specify NFT box properties */ width: 759px !important; height: 300px !important; margin: 5px !important; vertical-align: middle !important; /* Fix for pixel art blurriness */ image-rendering: pixelated !important; image-rendering: crisp-edges !important; /* Display as float left to prevent line breaks between div elements and to keep things tidy */ float: left !important; } /* Avatar info box styling */ .nftlist-small-avatar-info2 { margin-top: 110px !important; height: 41px !important; padding: 2px !important; background-color: rgba(0, 0, 0, 0.5) !important; border-radius: 0px 0px 5px 5px !important; } /* Avatar number styling */ .nftlist-small-avatar-info-number2 { font-size: 12px !important; font-weight: bold !important; color: #FFFFFF !important; line-height: 0.4 !important; text-align: center !important; margin-top: 11px !important; } /* Avatar owner info styling */ .nftlist-small-avatar-info-owner2 { font-size: 11px !important; color: #FFFFFF !important; line-height: 0.4 !important; text-align: center !important; } /* Simple NFT list template by gabo */ div.polaroid { width: 100%; background-color: white; box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19); margin-bottom: 5px; border-radius: 0px 0px 5px 5px !important; } div.container4 { text-align: center; padding: 10px 20px; column-gap: 20px; } .column2 { float: left; width: 26%; margin-left: 5px; } .home-header { margin: 0!important; font-family: "Ubuntu", Arial, Tahoma !important; color: #fff !important; font-size: 20px!important; height: 65px; width: 250px; text-shadow: 0 1px 3px rgb(0 0 0 / 60%); box-shadow: 0 1px 5px rgba(0,0,0,.35); font-weight: 700; border: 0; padding: 10px!important; border-radius: 10px; text-decoration: none; display: flex; justify-content: flex-start; align-items: center; margin: 4px !important; margin-top: 8px !important; -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; } .home-header:hover { filter: brightness(120%); -webkit-filter: brightness(120%); -moz-filter: brightness(120%); } /*Ambassador Card*/ /*General Container*/ .emb{ display: inline-block; width: 233px; height: fit-content; box-sizing: border-box; margin-right: 6px; margin-bottom: 12px; border-radius: 5px; box-shadow: 2px 2px 8px rgb(0 0 0 / 50%); } /*Width and height counting padding to everthing except the general container*/ .emb * {box-sizing: border-box;} /*Text style for every <p>*/ .emb p { font-size: 13pt; margin: 0; text-align: center; } /*Card Title (You will see the ambassador's nick)*/ .emb .e-name { width: 100%; padding: 5px 10px; background-color: #cf9c1d; color: whitesmoke; border-radius: 5px 5px 0 0; overflow: hidden; text-overflow: ellipsis; font-size: 15pt; font-weight: bold; } /*Special display for ambassador's appearence (in habbbo) and the text with the rol*/ .emb .e-content * {display: inline-flex;} /*Style for background of ambassador's appearance*/ .emb .e-content .e-keko { display: flex; float: left; background: url('https://1.bp.blogspot.com/-hJswqb3mpqw/YN1fxq_msLI/AAAAAAABkaQ/hlzy85wjrGoc0m5ZU1lfpwzuvmGIHjZ1ACPcBGAsYHg/s0/inside.gif'), gray; width: fit-content; } /*Style for ambassador's appearance (in habbo)*/ .emb .e-content .e-keko img { width: 64px; height: 110px; margin: 0 10px; margin-bottom: 5px; user-select: none; } /*Align rol content with image correctly and background*/ .emb .e-content .e-info { display: flow-root; background-color: #3eb0d5; } /*Vertical Align rol text and icon*/ .emb .e-content .e-info div { display: flex; width: fit-content; height: 115px; margin: 0 auto; padding: 5px; align-items: center; } /*Horizontal Align rol text and icon*/ .emb .e-content .e-info div * {display: inline-block;} /*Size & separation of the info text*/ .emb .e-content .e-info div img { height: 40px; width: 40px; margin-right: 5px; } /*Info text appearance*/ .emb .e-content .e-info div p { max-height: 100%; overflow: auto; max-width: 100%; color: whitesmoke; } /*Container for profile link*/ .emb .e-profile { text-decoration: none; display: block; background-color: darkblue; color: whitesmoke; border-radius: 0 0 5px 5px; padding: 5px 10px; } /*Appearance of text profile link*/ .emb .e-profile p {font-size: 15pt;} .emb .e-profile:hover p {text-decoration: underline;} /*Appearance of img profile link*/ .emb .e-profile p img { margin-top: -3px; margin-right: 5px; user-select: none; vertical-align: middle; }