User:Maxforce99/common.css

/* CSS placed here will affect users of the Hydra skin */ /* For elements which only display in the mobile view */ /* Hide main page header */ body.page-Main_Page h1.firstHeading { display:none; }

/* for "edit this page" tab and "discussion" tab etc */ .pagetab { border-style: solid solid none; border-width: thin; border-color: #808080; padding:0.25ex 1ex 0ex; font-size: 95%; }

.ambox { background-color: #eeeeee; border-bottom-color: #383838; border-right-color: #383838; border-top-color: #383838; border-collapse: collapse; font-size: 95%; margin: 0 auto 2px auto; width: 80%; }

.ambox-gray { border-left-color: #383838; }

.ambox.ambox-tiny { font-size: 90%; margin: 2px 0; width: auto; }

.ambox + .ambox { margin-top: -2px; }

.ambox-text { padding: 0.25em 0.5em; }

.ambox-image { padding: 2px 0px 2px 0.5em; text-align: center; width: 60px; }

.ambox-tiny .ambox-image { padding: 2px 0.5em; text-align: left; width: auto; }

/* Ambox colors */ .ambox-blue { border-left: 10px solid #1e90ff; }

.ambox-red { border-left: 10px solid #b22222; }

.ambox-orange { border-left: 10px solid #f28500; }

.ambox-yellow { border-left: 10px solid #f4c430; }

.ambox-purple { border-left: 10px solid #9932cc; }

.ambox-gray { border-left: 10px solid #bba; }

.ambox-green { border-left: 10px solid #228b22; }

/* Ambox small text */ .amsmalltext { font-size: smaller; margin-left:0.8em; margin-top:0.5em; }

/* INFOBOXES: game or book depended color style */ .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; }

/* Claim wiki button - this section can be removed if you remove the claim button from the main page */ .claimwikibutton { text-align: center; }

.claimwikibutton a { background: url("http://media-mercury.cursecdn.com/attachments/1/716/claim_wiki_button.png") no-repeat scroll left center / 100% auto rgba(0, 0, 0, 0); color: transparent; display: block; height: 57px; margin: 0 auto; max-width: 100%; width: 200px; }

.claimwikibutton a:hover { background: url("http://media-mercury.cursecdn.com/attachments/1/717/claim_wiki_button_hover.png") no-repeat scroll left center / 100% auto rgba(0, 0, 0, 0); color: transparent; }

/* copyright images tweak */ .copyright-icon { background: url(http://hydra-media.cursecdn.com/commons.cursetech.com/thumb/b/b6/Copyright.png/32px-Copyright.png) transparent center center no-repeat; background-size: 100%; width: 32px; height: 32px; }

.grad { background: rgb(60, 91, 129); background: -moz-linear-gradient(top, rgba(60, 91, 129, 1) 0%, rgba(64, 117, 183, 1) 100%); background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, rgba(60, 91, 129, 1)), color-stop(100%, rgba(64, 117, 183, 1))); background: -webkit-linear-gradient(top, rgba(60, 91, 129, 1) 0%, rgba(92, 148, 170, 1) 100%); background: -o-linear-gradient(top, rgba(60, 91, 129, 1) 0%, rgba(64, 117, 183, 1) 100%); background: -ms-linear-gradient(top, rgba(60, 91, 129, 1) 0%, rgba(64, 117, 183, 1) 100%); background: linear-gradient(to bottom, rgba(60, 91, 129, 1) 0%, rgba(64, 117, 183, 1) 100%); filter: progid: DXImageTransform.Microsoft.gradient(startColorstr='#0a1633', endColorstr='#5c94aa', GradientType=0); }

.gradHeader { text-align: center; color: #FFFFFF; font-size: 90%; padding: 5px 5px 4px 4px; border: 1px solid #3c5b81; border-radius: 5px; -webkit-border-radius: 5px; -moz-border-radius: 5px; }

/******************** * Main Page Layout * ********************/

display: flex; flex-wrap: wrap; }
 * 1) mp-layout {

background: rgba(255,255,255,.0); display: flex; flex-direction: column; border: solid 3px rgba(5,42,84,.8); border-radius: 1em; padding: .5em; margin: .5em; }
 * 1) mp-layout .mp-block {

color: #919590; font-weight: bold; flex: auto 0 0; }
 * 1) mp-layout .mp-block .mp-heading {

flex: auto 1 1; }
 * 1) mp-layout .mp-block .mp-content {

.mp-content { padding: .5em; }

flex: 100% 1 1; text-align: center; }
 * 1) mp-layout #welcome {

/* Style for horizontal lists (separator following item). @source mediawiki.org/wiki/Snippets/Horizontal_lists @revision 8 (2016-05-21) @author User:Edokter */ .hlist dl, .hlist ol, .hlist ul { margin: 0; padding: 0; } /* Display list items inline */ .hlist dd, .hlist dt, .hlist li { margin: 0; display: inline; } /* Display nested lists inline */ .hlist.inline, .hlist.inline dl, .hlist.inline ol, .hlist.inline ul, .hlist dl dl, .hlist dl ol, .hlist dl ul, .hlist ol dl, .hlist ol ol, .hlist ol ul, .hlist ul dl, .hlist ul ol, .hlist ul ul { display: inline; } /* Hide empty list items */ .hlist .mw-empty-li { display: none; } /* Generate interpuncts */ .hlist dt:after { content: ": "; } .hlist dd:after, .hlist li:after { content: " · "; font-weight: bold; } .hlist dd:last-child:after, .hlist dt:last-child:after, .hlist li:last-child:after { content: none; } /* Add parentheses around nested lists */ .hlist dd dd:first-child:before, .hlist dd dt:first-child:before, .hlist dd li:first-child:before, .hlist dt dd:first-child:before, .hlist dt dt:first-child:before, .hlist dt li:first-child:before, .hlist li dd:first-child:before, .hlist li dt:first-child:before, .hlist li li:first-child:before { content: " (";   font-weight: normal; } .hlist dd dd:last-child:after, .hlist dd dt:last-child:after, .hlist dd li:last-child:after, .hlist dt dd:last-child:after, .hlist dt dt:last-child:after, .hlist dt li:last-child:after, .hlist li dd:last-child:after, .hlist li dt:last-child:after, .hlist li li:last-child:after {    content: ")"; font-weight: normal; } /* Put ordinals in front of ordered list items */ .hlist ol { counter-reset: listitem; } .hlist ol > li { counter-increment: listitem; } .hlist ol > li:before { content: " " counter(listitem) "\a0"; } .hlist dd ol > li:first-child:before, .hlist dt ol > li:first-child:before, .hlist li ol > li:first-child:before { content: " (" counter(listitem) "\a0"; }

/* Default styling for Navbar template */ .navbar { display: inline; font-size: 88%; font-weight: normal; } .navbar ul { display: inline; white-space: nowrap; } .mw-body-content .navbar ul { line-height: inherit; } .navbar li { word-spacing: -0.125em; } .navbar.mini li abbr[title] { font-variant: small-caps; border-bottom: none; text-decoration: none; cursor: inherit; } /* Navbar styling when nested in infobox and navbox */ .infobox .navbar { font-size: 100%; } .navbox .navbar { display: block; font-size: 100%; } .navbox-title .navbar { /* @noflip */ float: left; /* @noflip */ text-align: left; /* @noflip */ margin-right: 0.5em; width: 6em; }

.infobox { border: none; border-spacing: 3px; background-color: rgba(255,255,255,.5); color: black; /* @noflip */ margin: 0.5em 0 0.5em 1em; padding: 0.2em; /* @noflip */ float: right; /* @noflip */ clear: right; font-size: 88%; line-height: 1.5em; } .infobox caption { font-size: 125%; font-weight: bold; padding: 0.2em; } .infobox td, .infobox th { vertical-align: top; /* @noflip */ text-align: left; }

/***************** * Tabber Layout * *****************/

/* This will style the div that contains the whole tabber object. Generally this can be left alone. */ body .tabberlive { }

/* This will style each tab's content area. */ body .tabberlive .tabbertab { }

/* This is the box that surrounds all the tabs. */ body ul.tabbernav { }

/* This is a box that surrounds each of the tabs. */ body ul.tabbernav li { }

/* This is the style for the tabs, parts of this can be overridden for the current tab with the next selector */ body ul.tabbernav li a, body ul.tabbernav li a:link, body ul.tabbernav li a:visited, body ul.tabbernav li a:hover { }

/* This is the style for the currently selected tab */ body ul.tabbernav li.tabberactive a, body ul.tabbernav li.tabberactive a:link, body ul.tabbernav li.tabberactive a:visited, body ul.tabbernav li.tabberactive a:hover { }

.tabelite { background-color:#0066ff; padding:2px; font-size:8pt; border:thin solid white; }

.tabheroic { background-color:#ffcc00; padding:2px; font-size:8pt; border:thin solid white; }

.tablegendary { background-color:#990099; padding:2px; font-size:8pt; border:thin solid white; }

/* Tabber Dungeon */ .selectordungeon .tabbernav li:nth-of-type(1) a { background-color: #ffffff; color: #000000; border: 1px solid #000000; overflow: hidden; }       .selectordungeon .tabbernav li:nth-of-type(2) a { background-color: #0066ff; color: #ffffff; border: 1px solid #000000; overflow: hidden; }       .selectordungeon .tabbernav li:nth-of-type(3) a { background-color: #ffcc00; color: #000000; border: 1px solid #000000; overflow: hidden; }       .selectordungeon .tabbernav li:nth-of-type(4) a { background-color: #990099; color: #ffffff; border: 1px solid #000000; overflow: hidden; }

/** End of Tabber Dungeon **/

/* News list */ .news-list li { list-style: none; }

.news-date { color: #747474; font-size: 65%; }

/* Added responsiveness for images on Classess */ @media only screen and (min-width:1100px) { div.classesTable img { width:45%; height:auto; } } @media only screen and (max-width:750px) { div.classesTable img { width:90%; height:auto; } } /* end Classes responsiveness */

.menu ul.submenu { display:none; position:absolute; left:98.5%; width:100%; float:left; border-left:0; border-radius: 0 1em 1em 0; padding-left:1em; }

li.submenu-title:hover ul.submenu, ul.submenu:hover { display:inline-block; }

.menu.layered > ul > li { margin:0; padding-right:0.5em; }

.menu.layered ul { padding-right:0; }