MediaWiki:App local.css

.slideboxlightshow { width: auto !important; height: auto !important; margin: 0 auto }

.slideboxlightshow a { display: block; width: auto !important; height: auto !important }

/* Infobox style */ .infobox { float: right; width: 20em; margin-left: 1em; margin-right: 1em; margin-bottom: 0.5em; padding: 2px; background-color: #111111; border: 1px solid #ffffff; }

.infobox-table { width: 100%; padding: 0; background-color: #ffffff; border: 1px solid #ffffff; }

.infobox-header { padding: 0.1em; color: #ffffff; background-color: #13473f; font-size: 130%; text-align: center; }

.infobox-section { background-color: #dddddd; }

.infobox-centered { text-align: center; }

.infobox-row { vertical-align: top; }

.infobox-row-name { text-align: left; white-space: nowrap; }

.infobox-spacer { height: 0.5em; }

/* Tiles (Template:Tile) */ .tile_container { margin: 4px 0px 8px 8px; padding: 0; position: relative; display: inline-block; width: 105px; height: 105px; vertical-align: middle; text-align: center; border: 1px solid black; border-radius: 15px; }

.tile_container:hover{ background: #fff; }

.tile_inner { position:relative; top:6px; left:0; font-size:14px; font-weight:bold; }

/* -- */ /* "ARKITEXURE"-STYLE INFOBOX */ /* -- */

/* arkitexure rounded borders */ .info-arkitex { border-radius: 10px; -moz-border-radius: 10px; -webkit-border-radius: 10px; -khtml-border-radius: 10px; -icab-border-radius: 10px; -o-border-radius: 10px; float: center; }

.info-arkitex-left { border-radius: 10px 0 0 10px; -moz-border-radius: 10px 0 0 10px; -webkit-border-radius: 10px 0 0 10px; -khtml-border-radius: 10px 0 0 10px; -icab-border-radius: 10px 0 0 10px; -o-border-radius: 10px 0 0 10px; float: left; }

.info-arkitex-right { border-radius: 0 10px 10px 0; -moz-border-radius: 0 10px 10px 0; -webkit-border-radius: 0 10px 10px 0; -khtml-border-radius: 0 10px 10px 0; -icab-border-radius: 0 10px 10px 0; -o-border-radius: 0 10px 10px 0; float: right; }

/* arkitexure full container */ .info-framework { float: right; min-width: 340px; width: 340px; max-width: 410px; background: #68a090; border: 2px solid #44685e; margin: 0 0 8px 8px; padding: 5px 5px 0 5px; overflow: hidden; }

/* arkitexure individual module (sub-container) */ .info-module { display: inline-block; min-width: 333px; width: 97%; max-width: 402px; text-align: right; background: #9dc1b7; margin: 0 0 0/*5px*/ 0;   padding: 4px 4px 0 4px; overflow: hidden; }

/* arkitexure "sub-module" component */ .info-unit { display: inline-block; width: 100%; min-width: 333px; max-width: 402px; text-align: center; margin: 0 0 0/*4px*/ 0; padding: 0; background: #9dc1b7; overflow: hidden; }

.info-unit-row { display: flex; flex-direction: row; align-items: top; min-width: 335px; width: 100%; max-width: 402px; padding: 0; margin: 0; overflow: hidden; }

.info-unit-comment { display: flex; align-items: left; font-size: 11px !important; }

.info-unit-caption { text-align: center !important; padding: 0 8px 0 8px !important; background: none !important; }

/* arkitexure cell, intended for one total column, 100% width */ .info-X1-100 { display: inline-block; min-width: 330px; width: 100%; max-width: 396px; margin: 1px; padding: 5px 2px 5px 2px; background: #fff; }

.info-masthead { display: flex !important; align-items: center; justify-content: center; min-height: 38px; height: auto; font-size: 24px; }

.info-column { display: flex !important; flex-direction: column; align-items: center; }

.info-sound-div { margin: 5px 0 -5px 0; }

/* arkitexure cell, intended for two total columns, 25% width */ .info-X2-25 { display: flex; align-items: center; justify-content: center; min-width: 65px; width: 25%; max-width: 92px; min-height: 40px; height: 40px; max-height: 40px; margin: 1px; padding: 5px 8px 5px 8px; background: #edf3eb; }

/* arkitexure cell, intended for two total columns, 75% width */ .info-X2-75 { display: flex; align-items: center; justify-content: center; min-width: 233px; width: 75%; max-width: 274px; margin: 1px; padding: 5px 8px 5px 8px; background: #fff; min-height: 40px; height: auto; font-size: 24px; }

/* arkitexure cell, intended for two total columns, 40% width */ .info-X2-40 { display: inline-block; min-width: 140px; width: 40%; max-width: 144px; min-height: 24px; height: 24px; max-height: 24px; margin: 1px; padding: 5px 8px 5px 8px; background: #edf3eb; text-align: right; }

/* arkitexure cell, intended for two total columns, 60% width */ .info-X2-60 { display: inline-block; min-width: 158px; width: 60%; max-width: 222px; min-height: 24px; height: auto; margin: 1px; padding: 5px 8px 5px 8px; background: #fff; text-align: left; }

/* arkitexure cell, intended for three total columns, 33% width */ .info-X3-33 { display: inline-block; min-width: 93px; width: 33%; max-width: 116px; min-height: 24px; height: auto; margin: 1px; padding: 5px 8px 5px 8px; background: #fff; text-align: center; } /* END "ARKITEXURE"-STYLE INFOBOX */

/* Creature Region Map */ .cr-region-map-map img { filter: sepia(60%); }

.cr-region-map-marker { font-size: 12px; font-weight: bold; position: absolute; border-radius: 2px; }

.cr-region-map-markercave { border: 1px solid black; }

.stripes { background: repeating-linear-gradient( 45deg, transparent, transparent 5px, rgba(0, 0, 0, 0.3) 5px, rgba(0, 0, 0, 0.3) 10px); }

.cr-region-map-very-common { -webkit-filter: hue-rotate(120deg) brightness(400%); filter: hue-rotate(120deg) brightness(400%); }

.cr-region-map-common { -webkit-filter: hue-rotate(78deg) brightness(400%); filter: hue-rotate(78deg) brightness(400%); }

.cr-region-map-uncommon { -webkit-filter: hue-rotate(60deg) brightness(400%); filter: hue-rotate(60deg) brightness(400%); }

.cr-region-map-very-uncommon { -webkit-filter: hue-rotate(48deg) brightness(400%); filter: hue-rotate(48deg) brightness(400%); }

.cr-region-map-rare { -webkit-filter: hue-rotate(24deg) brightness(400%); filter: hue-rotate(24deg) brightness(400%); }

.cr-region-map-very-rare { }

.cr-region-map-cl-very-common { background-color: hsl(120, 100%, 60%); }

.cr-region-map-cl-common { background-color: hsl(78, 100%, 60%); }

.cr-region-map-cl-uncommon { background-color: hsl(60, 100%, 63.3%); }

.cr-region-map-cl-very-uncommon { background-color: hsl(48, 100%, 63.3%); }

.cr-region-map-cl-rare { background-color: hsl(30, 100%, 56.7%); }

.cr-region-map-cl-very-rare { background-color: hsl(0, 100%, 56.7%); }

.cr-region-map-cl-unknown { background-color: #ccc; }