MediaWiki:FandomMobile.css

/* Main page */ /*** front page styles ***/ .fpmain { width: 100%; overflow: hidden; }

.fpbox { margin: 5px; padding: 5px; overflow: auto; background: transparent; border: 1px solid transparent; box-shadow: 1px 1px 2px transparent; }

.fpbox.plain { background: transparent; border: none; box-shadow: none; }

.fpbox .heading, .fpbox .mainheading, .fpbox .welcome { margin: 0 0 10px; padding: 0 0 5px; overflow: auto; border: 0; border-bottom: 1px solid #505050; }

.fpbox .mainheading, .fpbox .welcome { font-size: 150%; font-weight: bold; }

.fpbox .heading { text-align: center; font-size: 132%; }

.linkslabel { margin: 15px 5px 5px; padding: 0 0 5px; border-bottom: 2px solid #505050; }

/* auto-resize front page video to fit smaller columns */ .fpbox .embedvideo, .fpbox .embedvideowrap { width: 100% !important; max-width: 480px; margin: 0 auto; }

.fpbox .embedvideowrap iframe { width: 100% !important; }

/*** Template:FP link styles ***/ .fplinks { display: flex; flex-wrap: wrap; justify-content: space-evenly; align-items: stretch; text-align: center; font-weight: bold; }

.fplink-outer { padding: 5px; flex-basis: calc(25% - 10px); width: calc(25% - 15px); min-width: 115px; display: inline-block; vertical-align: middle; }

.fplink-wide { flex-basis: calc(33% - 10px); width: calc(33% - 15px); }

.fplink-fullwidth { flex-basis: 100%; width: calc(100% - 15px); font-weight: bold; }

.fplink { box-sizing: border-box; width: 100%; height: 100%; display: table; }

.fplink-fullwidth .fplink { background: rgba(100,100,100,0.4); }

.fplink-plain { background: transparent; border-radius: 0; border: 0; box-shadow: none; }

.fplink-inner { display: table-row; }

.fplink a { display: block; position: relative; }

.fplink img { max-width: 150px; width: 100%; height: auto; }

.mp-heroes img { width: 96px; }

/* Items grid */ .items-overview-grid { display:grid; grid-template-columns: repeat(4, 25%); }

.item-overview-entry { padding-top:.5em; padding-bottom:.5em; }

/* Tooltips */ div.skill-tooltip-wrapper { display: none; }