MediaWiki:Common.css

/* CSS placed here will be applied to all skins */ /* This governs the sections on the Community portal */ .cpbox { display: flex; flex-direction: row-reverse; flex-wrap: wrap; }

.cpbox #admins { box-sizing: border-box; width: calc(33% - 10px); margin: 5px; flex-grow: 1; min-width: 300px; }

.cpbox #help { box-sizing: border-box; width: calc(67% - 10px); margin: 5px; flex-grow: 1; }

/* Infobox template style - Copied from gamepedia help wiki */ .infobox { background-color: rgba(0, 0, 0, 0); border: 1px solid #505050; float: right; font-size: 89%; margin-bottom: 0.5em; padding: 0.2em; width: 300px; }

.infobox td.infoboxlabel { background-color: #edeeee; border: 2px solid inherit; font-weight: bold; padding: 0.5px 7px; text-align: right; }

.infoboxname { background-color: #f58120; font-size: 110%; font-weight: bold; padding: 0.5em; }

.infoboxdescription { background-color: #f58120; }

/* The following is copied from Hydra.css



/* CSS placed here will affect users of the Hydra skin */ /* For elements which only display in the mobile view */ .mobileonly { display: none; }

/* fonts */ @font-face { font-family: 'OpenSans-Bold'; src: local('OpenSans-Bold'), local('OpenSans-Bold'), url(/media/hydra/fonts/OpenSans-Bold.ttf) format('truetype'); }

@font-face { font-family: 'OpenSans-BoldItalic'; src: local('OpenSans-BoldItalic'), local('OpenSans-BoldItalic'), url(/media/hydra/fonts/OpenSans-BoldItalic.ttf) format('truetype'); }

@font-face { font-family: 'OpenSans-ExtraBold'; src: local('OpenSans-ExtraBold'), local('OpenSans-ExtraBold'), url(/media/hydra/fonts/OpenSans-ExtraBold.ttf) format('truetype'); }

@font-face { font-family: 'OpenSans-ExtraBoldItalic'; src: local('OpenSans-ExtraBoldItalic'), local('OpenSans-ExtraBoldItalic'), url(/media/hydra/fonts/OpenSans-ExtraBoldItalic.ttf) format('truetype'); }

@font-face { font-family: 'OpenSans-Italic'; src: local('OpenSans-Italic'), local('OpenSans-Italic'), url(/media/hydra/fonts/OpenSans-Italic.ttf) format('truetype'); }

@font-face { font-family: 'OpenSans-Light'; src: local('OpenSans-Light'), local('OpenSans-Light'), url(/media/hydra/fonts/OpenSans-Light.ttf) format('truetype'); }

@font-face { font-family: 'OpenSans-LightItalic'; src: local('OpenSans-LightItalic'), local('OpenSans-LightItalic'), url(/media/hydra/fonts/OpenSans-LightItalic.ttf) format('truetype'); }

@font-face { font-family: 'OpenSans-Regular'; src: local('OpenSans-Regular'), local('OpenSans-Regular'), url(/media/hydra/fonts/OpenSans-Regular.ttf) format('truetype'); }

@font-face { font-family: 'OpenSans-Semibold'; src: local('OpenSans-Semibold'), local('OpenSans-Semibold'), url(/media/hydra/fonts/OpenSans-Semibold.ttf) format('truetype'); }

@font-face { font-family: 'OpenSans-SemiboldItalic'; src: local('OpenSans-SemiboldItalic'), local('OpenSans-SemiboldItalic'), url(/media/hydra/fonts/OpenSans-SemiboldItalic.ttf) format('truetype'); }

p { font-family: "OpenSans-Regular"; }

a { font-family: "OpenSans-ExtraBold"; color:gray; }

a:visited { font-family: "OpenSans-ExtraBold"; color:#505050; }

/* INFOBOXES */ .infoboxtable { background-color: #f9f9f9; border: 1px solid #aaaaaa; color: #000000; float: right; font-size: 89%; margin-bottom: 0.5em; margin-left: 1em; padding: 0.2em; width: 300px; }

.infoboxtable td { vertical-align: top; }

.infoboxtable td > div { background-color: #f9f9f9; border: 2px solid inherit; border-radius: 5px; font-weight: bold; padding: 0.5px 7px; text-align: right; }

.infoboxname { font-size: 110%; font-weight: bold; padding: 0.5em; }

.infoboxdetails { padding: 0em; }

/************************ /* Responsive main page * /************************/   display: none; position: absolute; top: 215px; left: 0; right: 0; text-align: center; color: #d5c192; text-shadow: 0 0 3px #000000; font-size: 0.8em; line-height: 23px; }
 * 1) mainAboveSearch {

color: #ffc949; font-family: 'OpenSans-ExtraBold'; font-weight: bold; }
 * 1) mainAboveSearch a,
 * 2) mainAboveSearch a:link,
 * 3) mainAboveSearch a:visited,
 * 4) mainAboveSearch a.extiw,
 * 5) mainAboveSearch a.external,
 * 6) mainAboveSearch a.extiw:visited,
 * 7) mainAboveSearch a.external:visited {

display: none; position: absolute; top: 315px; left: 0; right: 0; text-align: center; color: #d5c192; text-shadow: 0 0 3px #000000; font-size: 0.8em; line-height: 23px; }
 * 1) mainBelowSearch {

color: #ffc949; }
 * 1) mainBelowSearch a,
 * 2) mainBelowSearch a:link,
 * 3) mainBelowSearch a:visited,
 * 4) mainBelowSearch a.extiw,
 * 5) mainBelowSearch a.external,
 * 6) mainBelowSearch a.extiw:visited,
 * 7) mainBelowSearch a.external:visited {

display: inline-block; vertical-align: top; width: 33.333%; max-width: 33.333%; }
 * 1) mainContent .threecols .leftcol {

display: inline-block; vertical-align: top; width: 33.334%; max-width: 33.334%; }
 * 1) mainContent .threecols .centercol {

display: inline-block; vertical-align: top; width: 33.333%; max-width: 33.333%; }
 * 1) mainContent .threecols .rightcol {

font-weight: bold; padding: 0; margin: 0 0 10px 1.6em; }
 * 1) mainContent .listheading {

padding: 0; margin: 0 0 10px 1.6em; }
 * 1) mainContent ul {

list-style: none; padding: 0; margin: 0 0 10px 0; }
 * 1) mainContent ul li {

display: block; border-radius: 8px; background: #45341E; font-weight: bold; text-align: center; padding: 4px; margin: 40px auto 0 auto; width: 200px; }
 * 1) mainContent .button .wrapper {

display: block; border-radius: 7px; background: #855134; background: linear-gradient(to right, #855134, #D39750 50%, #855134 100%); background: linear-gradient(to right, #855134, #D39750 50%, #855134 100%) border-box; color: #ffffff; font-weight: bold; text-align: center; padding: 8px; }
 * 1) mainContent .button a {

color: #2f1e0b; font-weight: bold; font-size: 125%; text-align: center; margin-bottom: 10px; }
 * 1) mainContent .heading {

border-radius: 7px; margin: 5px; }
 * 1) mainContent .mainBlockInner {

max-width: 100%; height: auto; }
 * 1) mainContent .mainBlockInner img {

flex: 0 1 100%; }
 * 1) mainFeature {

background: linear-gradient(rgba(42, 25, 7, 0.6), rgba(42, 25, 7, 0.6)), #1a0e05 url("https://static.wikia.nocookie.net/atownshiptale_gamepedia_en/images/b/bf/Discord_Splash_Feature.png/revision/latest") no-repeat center center / cover; color: #ffffff; font-size: 105%; text-align: center; padding: 15px 4%; line-height: 2; }
 * 1) mainFeature .mainBlockInner {

color: #ffffff; font-size: 340%; font-weight: bold; line-height: 62px; margin-bottom: 10px; }
 * 1) mainFeature .heading {

padding: 0 6%; }
 * 1) mainFeature p,
 * 2) mainGuide p {

background: linear-gradient(rgba(42, 25, 7, 0.6), rgba(42, 25, 7, 0.6)) repeat left top, #2a1907 url("https://static.wikia.nocookie.net/atownshiptale_gamepedia_en/images/1/1f/Getting_Started.png/revision/latest") no-repeat center top / cover; color: #ffffff; font-size: 105%; text-align: center; padding: 80px 8%; line-height: 2; }
 * 1) mainGuide .mainBlockInner {

color: #ffffff; font-size: 340%; font-weight: bold; line-height: 62px; }
 * 1) mainGuide .heading {

color: #ffdb4e; font-size: 250%; line-height: 45px; margin-bottom: 40px; }
 * 1) mainGuide .subheading {

.fillBackground .mainBlockInner { background: #fdf0d9; padding: 10px; }

.linkGridContainer { display: flex; flex-flow: row wrap; align-content: flex-start; justify-content: space-around; width: 100%; height: 100%; }

.linkGridItem { position: relative; display: table; box-sizing: border-box; color: #ffffff; text-align: center; overflow: hidden; width: 33.333%; height: 130px; padding: 2px; }

.linkGridItem a { display: table-cell; background-position: center center, center center; background-size: cover, cover; color: #ffffff; text-shadow: 1px 1px 2px #000000; font-size: 110%; font-weight: bold; text-align: center; vertical-align: middle; padding: 0 25px; }

.professionIcon { display: inline; }

.professionIcon>div { position: relative; }

.professionIcon a { padding: 0px; }

.professionIcon a:last-child { position: absolute; left: 0px; bottom: 30px; width: 100%; color: white; text-shadow: 1px 1px 2px #000000; text-align: center; }

.professionIcon br { display: none; }

/*Town*/ background-image: url(https://static.wikia.nocookie.net/atownshiptale_gamepedia_en/images/3/3c/A-Township-Tale-Town-small.png/revision/latest) }
 * 1) locationLink1 a {

/*Caves*/ background-image: url(https://static.wikia.nocookie.net/atownshiptale_gamepedia_en/images/7/73/A-Township-Tale-Caves-small.png/revision/latest) }
 * 1) locationLink2 a {

/*Wooded Valley*/ background-image: url(https://static.wikia.nocookie.net/atownshiptale_gamepedia_en/images/7/74/A-Township-Tale-Forest-small.png/revision/latest) }
 * 1) locationLink3 a {

/*The Ponds*/ background-image: url(https://static.wikia.nocookie.net/atownshiptale_gamepedia_en/images/7/73/A-Township-Tale-Caves-small.png/revision/latest) }
 * 1) locationLink4 a {

/*Dust Bowl*/ background-image: url(https://static.wikia.nocookie.net/atownshiptale_gamepedia_en/images/7/73/A-Township-Tale-Caves-small.png/revision/latest) }
 * 1) locationLink5 a {

/*Mountain Pass*/ background-image: url(https://static.wikia.nocookie.net/atownshiptale_gamepedia_en/images/7/73/A-Township-Tale-Caves-small.png/revision/latest) }
 * 1) locationLink6 a {

/*Battlefield*/ background-image: url(https://static.wikia.nocookie.net/atownshiptale_gamepedia_en/images/7/73/A-Township-Tale-Caves-small.png/revision/latest) }
 * 1) locationLink7 a {

/*The Town*/ background-image: url(https://static.wikia.nocookie.net/atownshiptale_gamepedia_en/images/7/73/A-Township-Tale-Caves-small.png/revision/latest) }
 * 1) locationLink8 a {

/*The Town*/ background-image: url(https://static.wikia.nocookie.net/atownshiptale_gamepedia_en/images/7/73/A-Township-Tale-Caves-small.png/revision/latest) }
 * 1) locationLink9 a {

/*The Forest*/ background-image: url(https://static.wikia.nocookie.net/atownshiptale_gamepedia_en/images/d/d7/Forest_Image_1.png/revision/latest) }
 * 1) locationLink10 a {

@media (min-width: 1022px) { #mainContent { display: flex; flex-flow: row wrap; }

.mainBlockOuter { display: flex; flex-basis: 50%; }

.mainBlockInner { flex-basis: 100%; flex-grow: 0; overflow: hidden; }

#mainGuideStreamer, #mainFeatureSection { flex-flow: column; }

#mainGuide, #mainFeature { flex: 0 1 100%; }

#mainLocations, #mainStreamer { flex: 0 0 auto; } }

@media (min-width: 1432px) { .mainBlockOuter { flex-basis: 33.333%; flex-grow: 0; overflow: hidden; } }