MediaWiki:Common.css

From Habbox Wiki
Jump to navigation Jump to search

Note: After publishing, you may have to bypass your browser's cache to see the changes.

  • Firefox / Safari: Hold Shift while clicking Reload, or press either Ctrl-F5 or Ctrl-R (⌘-R on a Mac)
  • Google Chrome: Press Ctrl-Shift-R (⌘-Shift-R on a Mac)
  • Internet Explorer / Edge: Hold Ctrl while clicking Refresh, or press Ctrl-F5
  • Opera: Press Ctrl-F5.
@import url('https://fonts.googleapis.com/css2?family=Ubuntu:ital,wght@0,300;0,400;0,500;0,700;1,300;1,400;1,500;1,700&display=swap');

/* Portal banners */
.portal-banner {height: 350px; width: 100%;background-repeat:no-repeat;background-color:#000;background-position:left;margin-bottom: 20px;}
.homepage-banner {background: url(/wiki/images/portals/thrwiki.png) repeat-x #000 left}
.ny-banner {background: url(/wiki/images/portals/newyear.png) no-repeat #000 left}
.val-banner {background: url(/wiki/images/portals/valentines.png) no-repeat #000 left}
.easter-banner {background-image:url(/wiki/images/portals/easter.png);background-repeat:repeat-x;}
.christmas-banner {background-image:url(/wiki/images/portals/christmas.png);background-repeat:repeat-x;}
.summer-banner {background-image:url(/wiki/images/portals/summer.png);background-repeat:repeat-x;}
.habboween-banner {background-image:url(/wiki/images/portals/habboween.png);background-repeat:repeat-x;}
.help-banner {background-image:url(/wiki/images/portals/help.png);background-repeat:repeat-x;}

/* Header styles */
.h-edit, .question {background: url(images/headers/question.png),linear-gradient(140deg,#7641b9 50%,#6a36ad 50%,#6a36ad 70%,#532194 70%,#532194 100%);}
.h-feat, .stars {background: url(images/headers/stars.png),linear-gradient(140deg,#0096ce 50%,#0388b9 50%,#0388b9 70%,#007ca9 70%,#007ca9 100%);}
.h-file {background: url(images/headers/general.png),linear-gradient(140deg,#d6b332 50%,#cca92b 50%,#cca92b 70%,#c1a027 70%,#c1a027 100%);}
.h-ltds, .furni {background: url(images/headers/furni.png),linear-gradient(140deg,#39b593 50%,#2da282 50%, #2da282 70%,#259274 70%, #259274 100%);}
.h-curr, .bulb {background: url(images/headers/wiki.png),linear-gradient(140deg,#b72704 50%,#ae2505 50%,#a12207 70%,#8f1e09 70%,#75180d 100%);}
.h-cons, .cog {background: url(images/headers/settings.png),linear-gradient(140deg,#ef8a1a 50%,#de8018 50%,#de8018 70%,#cc7412 70%,#cc7412 100%);}
.h-hot, .hotel {background: url(images/headers/hotel.png),linear-gradient(140deg,#92ca47 50%,#7eb535 50%,#7eb535 70%,#71a52b 70%,#71a52b 100%);}
.h-comps, .pres {background: url(images/headers/comps.png),linear-gradient(140deg,#e6b7d5 50%,#e096c5 50%,#e096c5 70%,#d486b8 70%,#d486b8 100%);}
.h-room, .rooms {background:url(images/headers/rooms.png),linear-gradient(140deg,#4745ca 50%,#2827a7 50%,#2827a7 70%,#2827a7 70%,#0f157d 100%);}
.ducks {background: url(images/headers/ducks.png),linear-gradient(140deg,#d6b332 50%,#cca92b 50%,#cca92b 70%,#c1a027 70%,#c1a027 100%);}
.hearts {background: url(images/headers/hearts.png),linear-gradient(140deg,#e096c5 50%,#d486b8 50%,#d486b8 70%,#c36fa5 70%,#c36fa5 100%);}
.people {background: url(images/headers/people.png),linear-gradient(140deg,#888888 50%,#5d5d5d 50%,#5d5d5d 70%,#444444 70%,#444444 100%);}
.xmas {background: url(images/headers/santahat.png),linear-gradient(140deg,#b72704 50%,#ae2505 50%,#a12207 70%,#8f1e09 70%,#75180d 100%);}
.summer{background: url(images/headers/lifebuoy.png),linear-gradient(140deg,#0096ce 50%,#0388b9 50%,#0388b9 70%,#007ca9 70%,#007ca9 100%);}
.bobba{background: url(images/headers/skull.png),linear-gradient(140deg,#675575 50%,#4a345b 50%,#4a345b 70%,#362346 70%,#362346 100%);}
.newyear{background:url(/wiki/images/headers/stars.png),linear-gradient(140deg,#144b8e 50%,#003371 50%,#003371 70%,#001b45 70%,#001b45 100%);}


/*Portals*/
.portal-header{
    margin: 0!important;
    font-family: 'Ubuntu'!important;
    color: white;
    font-size: 20px!important;
    height: 50px;
    border: 0;
    line-height: 50px!important;
    padding-left: 10px!important;
    display: block!important;}
    
    .portal-footer {
    background: url(/wiki/images/headers/badges.png),linear-gradient(140deg,#252525 50%,#505050 50%,#505050 70%,#717171 70%,#717171 85%,#9c9c9c 85%,#9c9c9c 100%);
    height: 40px;
    margin: 0px 0px 0px 0px;
    padding-left: 4%;
    float: left;
    position: relative;
    width: 96%;
}
    
/* Navboxes */
.navbox {
    text-align: left;
    border-spacing: 0px;
    width:100%;
	font-size: 12px;
}

.navbox th {
    background: url(images/headers/wiki.png), linear-gradient(140deg, #65902a 50%, #71a52b 50%, #71a52b 70%, #7eb535 70%, #7eb535 85%, #92ca47 85%, #92ca47 100%);
    color: #FFF;
    font-size: 20px;
    padding:10px;
    line-height: 20px;
}

.navbox tr:nth-child(even) {background: #eee}
.navbox tr:nth-child(odd) {background: #f9f9f9}
.navbox td:first-of-type {padding-right: 20px;font-weight: bold;white-space: nowrap;}
.navbox tr:nth-child(odd) td:first-of-type {background: #efefef;}
.navbox tr:nth-child(even) td:first-of-type {background: #dee0df;}

.infobox {
    font-size: 0.85em;
    background-color: #F9F9F9;
    width: 300px;
    float: right;
    margin: 0px 0px 10px 10px;
    border-spacing: 0px;
}
@media screen and (max-width: 720px) {
	.infobox {width:100%;margin:0px 0px 20px 0px}
	
}

.infobox td {padding: 2px 10px;}

/*Infobox headers*/
.ib-header {text-align:center;color: white;font-size: 20px;font-family: 'Ubuntu',sans-serif;background: url(/wiki/images/headers/wiki.png);border-width: 0px 0px 10px 0px;border-color: #f9f9f9;border-style: solid;}
.ib-room {background: url(/wiki/images/headers/rooms.png);}
.ib-furni {background: url(/wiki/images/headers/furni.png);}
.ib-badges {background: url(/wiki/images/headers/badges.png);}
.ib-hand {background: url(/wiki/images/headers/hand.png);}
.ib-people {background: url(/wiki/images/headers/people.png);}
.ib-stars {background: url(/wiki/images/headers/stars.png);}
.ib-present {background: url(/wiki/images/headers/comps.png);}
.ib-game {background: url(/wiki/images/headers/events.png);}
.ib-hotel {background: url(/wiki/images/headers/hotel.png);}
.ib-ducks {background: url(/wiki/images/headers/ducks.png);}
.ib-fansite {background: url(/wiki/images/headers/hfan-badge.png);}


div#mw-panel {
padding-top:0px !important;
}

.homepage-block-orange .mw-changeslist .mw-enhancedchanges-arrow-space, td.mw-enhanced-rc, .homepage-block-orange .mw-body-content h4, td.mw-changeslist-line-inner span.mw-usertoollinks, td.mw-changeslist-line-inner span.comment, .mw-content-ltr .mw-collapsible-toggle, .mw-content-rtl .mw-content-ltr .mw-collapsible-toggle {display:none!important;}





.alertbox {text-align: left; width:100%; background:#eee; margin:10px 0px;border-spacing: 0px;}
.ab-header {font-family: 'Ubuntu';color:white;font-size: 20px; padding: 10px 20px;}
.ab-text {color: #545454;padding: 10px 20px;}
.ab-image {padding-left: 140px;}

.ab-general, .portal-gen, .general {background:url(images/headers/general.png),linear-gradient(140deg,#ef8a1a 40%,#e48216 40%,#e48216 55%,#d47610 55%,#d47610 70%,#ca6a01 70%,#ca6a01 85%,#b9670e 85%,#b9670e 100%);}
.ab-future {background:url(images/headers/question.png),linear-gradient(140deg,#7f35af 40%,#7525a9 40%,#7525a9 55%,#681b9a 55%,#681b9a 70%,#5c138c 70%,#5c138c 85%,#480077 85%,#480077 100%);}
.ab-current {background:url(images/headers/wiki.png), linear-gradient(140deg,#b72704 30%,#ae2505 30%,#ae2505 40%,#a12207 40%,#a12207 50%,#8f1e09 50%,#8f1e09 60%,#75180d 60%,#75180d 100%);}
.ab-construction {background:url(images/headers/settings.png), linear-gradient(140deg,#ef8a1a 50%, #d47b18 50%, #d47b18 70%,#c56f10 70%,#c56f10 100%);}


.home-block {
    width: 32%;
    height: 370px;
    display: inline-block;
    margin: 0.5%;
}

.home-header {
    margin: 0!important;
    font-family: 'Ubuntu'!important;
    color: white;
    font-size: 20px!important;
    height: 50px;
    border: 0;
    line-height: 50px!important;
    padding-left: 10px!important;
    display: block!important;
}

.home-block .gallerybox .thumb {width: fit-content!important;}
.home-block .gallerybox .gallerytext {display: none;}

.home-block .gallerybox, .home-block .gallery .gallerybox div {
    width: unset!important;
}
.LightGallery {margin: 0px!important;}

.home-text {
    background: #F9F9F9;
    padding: 10px;
    font-size: 90%;
    height: 300px;
    overflow: auto;
}

.home-footer {
    background: url(/wiki/images/headers/badges.png),linear-gradient(140deg,#252525 50%,#505050 50%,#505050 70%,#717171 70%,#717171 85%,#9c9c9c 85%,#9c9c9c 100%);
    height: 40px;
    margin: 0px 0px 0px 0px;
    padding-left: 4%;
    float: left;
    position: relative;
    top: -40px;
    width: 96%;
}

.home-footer a, .portal-footer a {
    color: white!important;
    font-weight: bold;
    background: url(https://habbox.com/wp-content/themes/habboxv7/images/icons/read-more.png) no-repeat!important;
    padding-left: 25px;
    line-height: 40px;
  transition: 0.3s;
}

.home-footer p, .portal-footer p {
    margin: 0px!important;
}

.home-footer a:hover, .portal-footer a:hover {
    opacity:0.4;
    text-decoration:none;
  transition: 0.3s;
}

.home-banner-box {width:50%; float:right; display:inline-block;}
.homepage-banner h1 {
    color: #fff;
    font-family: 'Ubuntu',sans-serif;
    font-size: 400%;
    font-weight: bold;
    float: right;
    background: #00000096;
    margin: 30px 5% 30px 10%;
    display: block;
    border: 0;
    padding: 2%;
    text-align: right;
}

.home-block .ltd-feat {
    display: inline-block;
    float: right;
}

.homepage-banner p {
    color: #fff;
    font-family: 'Ubuntu',sans-serif;
    font-size: 150%;
    float: right;
    background: #00000096;
    margin: 0px 5% 0px 10%;
    display: block;
    border: 0;
    padding: 2%;
    text-align: right;
}

.portal-banner-h1 {
    color: #fff;
    font-family: 'Ubuntu',sans-serif!important;
    font-size: 400%;
    font-weight: bold;
    float: right;
    background: #00000096;
    margin: 30px 5% 30px 10%;
    display: block;
    border: 0;
    padding: 2% 5%!important;
    text-align: right;
}

.portal-box {margin-bottom: 20px;}
.portal-box.full {clear: both;}
.portal-box.half.left {margin-right: 2%;}
.portal-box.half {width: 49%;float: left;}

.portal-box.third {width:39%;float: left;}
.portal-box.twothirds {width:59%;float: left;}

.portal-box.third.left {margin-right: 2%;}
.portal-box.twothirds.left {margin-right: 2%;}
.portal-box img {margin: 0px 20px;}
.portal-box .floatleft img {margin-left: 0px;}
.portal-box .floatright img {margin-right: 0px;}

.portal-box ~ p { display: none;}
.portal-text {padding: 30px;background:#F9F9F9}

@media only screen and (max-width: 1556px) {.homepage-banner h1, .portal-banner h1 {font-size:350%;}} 
@media only screen and (max-width: 1390px) {.homepage-banner p {font-size:130%;}} 
@media only screen and (max-width: 800px) {.homepage-banner p {display:none}.homepage-banner h1, .portal-banner h1 {font-size:300%;}} 


.intro-text {
    color: #50575C;
    font-size: 16px;
    font-family: Ubuntu, sans-serif;
}

.numbers-box {
    width: 100%;
    font-size: 0px;
    text-align: center;
}

.number:first-of-type {
    margin-left: 0px;
}
.number {
    display: inline-block;
    width: fit-content;
    background: #eee;
    font-size: 16px;
    margin: 0% 20px;
    min-width:10%;
}
.nh {
    color: white;
    font-family: 'Ubuntu';
    font-size: 18px;
    font-weight: 500;
    margin: 0px;
    padding: 5px 30px;
}

.number:nth-of-type(1) .nh {background: url(images/headers/articles.png),linear-gradient(140deg,#ef8a1a 50%,#de8018 50%,#de8018 70%,#cc7412 70%,#cc7412 100%);}
.number:nth-of-type(2) .nh {background: url(images/headers/ducks.png),linear-gradient(140deg,#92ca47 50%,#7eb535 50%,#7eb535 70%,#71a52b 70%, #71a52b 100%);}
.number:nth-of-type(3) .nh {background: url(images/headers/hand.png),linear-gradient(140deg,#52d3ff 50%,#48c8f5 50%,#48c8f5 70%,#36b4e0 70%,#36b4e0 100%);}


.nt {
    padding: 5px 30px ;
}

@media only screen and (min-width: 750px) and (max-width: 1200px) {
.home-block {width:48%}
}

@media only screen and (max-width: 750px) {
.home-block {width:98%}
}



.mw-changeslist {
    line-height: 2em;
    font-size: 1em;
}

.mw-changeslist .mw-tag-marker, .mw-changeslist .mw-title {font-weight:bold}

.mw-changeslist-legend.mw-collapsible.mw-made-collapsible {
    display: none;
}

.mw-enhanced-rc td:nth-of-type(2) {display: none;}

.mw-changeslist h4 {
    font-weight: bold;
    font-size: 1.5em;
    margin: 0px;
    padding-bottom:10px;
}

.mw-rcfilters-ui-highlights-enhanced-nested td:first-of-type {
    display: none;
}

@media only screen and (max-width: 1832px) {
    .homepage-block-orange, .homepage-block-green, .homepage-block-blue{
        width: 31.3%!important;
    }
}


@media only screen and (max-width: 1292px) {
    .homepage-block-orange, .homepage-block-green, .homepage-block-blue{
        width: 31%!important;
    }
}

@media only screen and (max-width: 1100px) {
    .homepage-block-orange, .homepage-block-green, .homepage-block-blue{
        width: 30.5%!important;
    }
}

@media only screen and (max-width: 504px) {
    .homepage-block-orange, .homepage-block-green, .homepage-block-blue{
        width: 46.75%!important;
    }
}

.wikitable td {
    min-width: 100px;
}

.no-resize img {object-fit: scale-down;image-rendering: pixelated;}

#p-googleadsense .body {
display:block !important;
}

#p-googleadsense h5 {
background: none !important;
}

#p-googleadsense h5 a {
text-decoration: none !important;
color: #4D4D4D !important;
}

#p-logo a {
height:239px;
}

#p-logo {
height:190px;
}


/* 'show'/'hide' buttons created dynamically by the CollapsibleTables javascript
in [[MediaWiki:Common.js]] are styled here so they can be customised. */
.collapseButton {
padding:5px;
/* @noflip */
float: right;
font-weight: normal;
/* @noflip */
margin-left: 0.5em;
/* @noflip */
text-align: right;
width: auto;
font-size:14px;
font-weight:bold;
}

.hmain{display:block;}
.htwo {display:none;}

.hcont:hover .hmain{
display : none;
}
.hcont:hover .htwo{
display : block;
}

.collapseButton A:link {color: #191970;font-weight:bold;}
.collapseButton A:visited {color: #191970;font-weight:bold;}
.collapseButton A:active {color: #191970;font-weight:bold;}
.collapseButton A:hover {color: #191970;font-weight:bold;}

table.testtable{
margin:1em 1em 1em 0;
border:1px #aaa solid;
background:white;
border-collapse:collapse;
text-align:center;
}
.testtable th,.testtable td{
border:1px #AAA solid;
padding-left:7px;
padding-right:7px;
}
.testtable caption{
font-weight:bold
}
.testtable{
page-break-inside:avoid
}

.square {
    float: left;
    width:12px;
    height:12px;
    display:block;
    overflow:hidden;
    background:red;
    margin-left:5px;
}
#content table.wikitable {
text-align:center;
}

.modwarn {
	-moz-border-radius:5px;
	-webkit-border-radius:5px;
	border-radius:5px;
	border:1px solid #e2001a;
	border-bottom-width:2px;
	width:75%;
	text-align:center;
	color:white;
	text-shadow:1px 1px 1px #e2394c;
	font-weight:bold;
        margin-right:auto; margin-left:auto;
        margin-bottom:10px;
        background:#e28892;
}
.modwarn .inner {
	border-top:1px solid #ffa4ae;
	padding:5px 10px;
	-moz-border-radius:5px;
	-webkit-border-radius:5px;
	border-radius:5px;
}

.modwarn .inner img.mw-icon {
	vertical-align:middle;
	float:left;
	margin-right:5px;
}
/* wikitable class for skinning normal tables
 * keep on sync with commonPrint.css
 */
table.wikitable {
	margin: 1em 1em 1em 0;
	background: #f9f9f9;
	border: 1px #aaa solid;
	border-collapse: collapse;
	color: black;
}
.wikitable th, .wikitable td {
	border: 1px #aaa solid;
	padding: 0.2em;
}
.wikitable th {
	background: #f2f2f2;
	text-align: center;
}
.wikitable caption {
	font-weight: bold;
}

/* hide initially collapsed collapsable tables */
table.collapsed tr.collapsable {
	display: none;
}

table.ombox-notice {
border: 1px solid #AAA;
line-height: 1.6em;
}

table.ombox {
margin: 4px 10%;
border-collapse: collapse;
border: 1px solid #AAA;
background: #F9F9F9;
}

th.mbox-text, td.mbox-text {
border: none;
padding: 0.25em 0.9em;
width: 100%;
}

td.mbox-image {
border: none;
padding: 2px 0 2px 0.9em;
text-align: center;
}

.wikiEditor-ui-toolbar .tabs, .wikiEditor-ui-toolbar .section-main {height: 0px;}

.payday td:first-child, .payday th:first-child {
    display: none;
}