Actions

MediaWiki

Difference between revisions of "Common.css"

(Added dnd css)
 
m (Added padding to documentation code)
 
(106 intermediate revisions by 3 users not shown)
Line 1: Line 1:
−
/* CSS placed here will be applied to all skins */
+
@font-face
−
@import "https://cdnjs.cloudflare.com/ajax/libs/normalize/8.0.0/normalize.min.css";
+
{
−
/* --------------------------------
+
  font-family: 'Nodestro Caps';
 +
  src: url("https://www.gmbinder.com/assets/fonts/Nodesto Caps Condensed.otf");
 +
  font-weight: bold;
 +
}
  
−
Variables & Mixins
+
@font-face
 +
{
 +
  font-family: 'Nodestro Caps';
 +
  src: url("https://www.gmbinder.com/assets/fonts/Nodesto Caps Condensed Bold.otf");
 +
  font-weight: bold;
 +
}
  
−
-------------------------------- */
+
@font-face
−
@font-face {
+
{
−
  font-family: Bookinsanity;
+
   font-family: 'Nodestro Caps';
−
  src: url(../assets/fonts/Bookinsanity.otf); }
+
   src: url("https://www.gmbinder.com/assets/fonts/Nodesto Caps Condensed Italic.otf");
−
@font-face {
+
   font-weight: normal;
−
  font-family: BookinsanityBold;
+
   font-style: italic;
−
  src: url(../assets/fonts/BookinsanityBold.otf); }
+
}
−
@font-face {
 
−
  font-family: BookinsanityItalic;
 
−
  src: url(../assets/fonts/BookinsanityItalic.otf); }
 
−
@font-face {
 
−
  font-family: BookinsanityBoldItalic;
 
−
  src: url(../assets/fonts/BookinsanityBoldItalic.otf); }
 
−
@font-face {
 
−
  font-family: MrEavesSmallCaps;
 
−
  src: url(../assets/fonts/MrEavesSmallCaps.otf); }
 
−
@font-face {
 
−
  font-family: ScalySans;
 
−
  src: url(../assets/fonts/ScalySans.otf); }
 
−
@font-face {
 
−
   font-family: ScalySansBold;
 
−
   src: url(../assets/fonts/ScalySansBold.otf); }
 
−
@font-face {
 
−
  font-family: ScalySansItalic;
 
−
  src: url(../assets/fonts/ScalySansItalic.otf); }
 
−
@font-face {
 
−
  font-family: ScalySansBoldItalic;
 
−
  src: url(../assets/fonts/ScalySansBoldItalic.otf); }
 
−
@font-face {
 
−
  font-family: Nodesto;
 
−
  src: url(../assets/fonts/NodestoCapsCondensed.otf); }
 
−
@font-face {
 
−
   font-family: ZatannaMisdirection;
 
−
  src: url(../assets/fonts/ZatannaMisdirection.otf); }
 
−
@font-face {
 
−
   font-family: ZatannaMisdirectionItalic;
 
−
  src: url(../assets/fonts/ZatannaMisdirectionItalic.otf); }
 
−
/* --------------------------------
 
  
−
Responsive Grid & Media Queries
+
@font-face
 +
{
 +
  font-family: 'MrEeeves';
 +
  src: url("https://dnd-fonts.herokuapp.com/fonts/MrsEaves SmallCaps Regular.otf");
 +
}
  
−
-------------------------------- */
+
@font-face
−
@supports (display: grid) {
+
{
−
  body {
+
  font-family: 'ScalySans';
−
    display: grid;
+
  src: url("https://dnd-fonts.herokuapp.com/fonts/ScalaSans Regular LF.otf");
−
    grid-template-columns: [main-left] [main-right]; }
+
}
−
    @media (min-width: 450px) {
 
−
      body {
 
−
        grid-template-columns: 1fr [main-left] 350px [main-right] 1fr; } }
 
−
    @media (min-width: 992px) {
 
−
      body {
 
−
        gap: 2rem;
 
−
        grid-gap: 2rem;
 
−
        grid-template-columns: 1fr [main-left] 400px [middle] 400px [main-right] 1fr; } }
 
−
    body > .page-wrapper,
 
−
    body > .page-wrapper > section.intro,
 
−
    body > .page-wrapper > div {
 
−
      display: contents; }
 
−
    body section.intro header {
 
−
      grid-column: 1 / span end; }
 
−
      body section.intro header > h1 {
 
−
        text-align: center; }
 
−
        body section.intro header > h1::before {
 
−
          content: "";
 
−
          display: block;
 
−
          min-height: 150px;
 
−
          background-image: url("../assets/branding/logo-ver-1.png");
 
−
          background-repeat: no-repeat;
 
−
          background-position: center;
 
−
          background-size: contain;
 
−
          margin: auto;
 
−
          min-width: 250px;
 
−
          width: 50%; }
 
−
        body section.intro header > h1::after {
 
−
          content: "";
 
−
          display: block;
 
−
          min-height: 50px;
 
−
          background-color: #ef3f3f;
 
−
          clip-path: polygon(50% 25%, 100% 50%, 50% 75%, 0% 50%);
 
−
          -webkit-clip-path: polygon(50% 25%, 100% 50%, 50% 75%, 0% 50%);
 
−
          margin: auto;
 
−
          width: 35%; }
 
−
      body section.intro header > h2 {
 
−
        text-align: center;
 
−
        margin: 2rem 0 0 0; }
 
−
        body section.intro header > h2::before {
 
−
          content: "";
 
−
          display: block;
 
−
          min-height: 300px;
 
−
          background-image: url("../assets/zen-garden-map-sm.jpg");
 
−
          background-repeat: no-repeat;
 
−
          background-position: top;
 
−
          background-size: contain;
 
−
          margin: 2rem auto -8rem auto;
 
−
          width: 95%; }
 
−
          @media (min-width: 450px) {
 
−
            body section.intro header > h2::before {
 
−
              background-image: url("../assets/zen-garden-map-md.jpg");
 
−
              margin-bottom: 2rem; } }
 
−
          @media (min-width: 992px) {
 
−
            body section.intro header > h2::before {
 
−
              background-image: url("../assets/zen-garden-map-lg.jpg");
 
−
              margin-bottom: 4rem; } }
 
−
    @media (min-width: 450px) {
 
−
      body section.intro > div {
 
−
        grid-column-start: main-left; } }
 
−
    body footer {
 
−
      grid-row-start: 9;
 
−
      text-align: center;
 
−
      font-family: "ZatannaMisdirection", sans-serif;
 
−
      font-size: 16px;
 
−
      margin-top: 3rem; }
 
−
      body footer a {
 
−
        padding: .5rem .7rem;
 
−
        margin: -.25rem;
 
−
        border-top: 2px solid #d3b63b;
 
−
        border-bottom: 2px solid #d3b63b; }
 
−
      body footer::after {
 
−
        content: "DISCLAIMER: This page is a fan-made work, and is not affiliated with Wizards of the Coast. We acknowledge Wizards of the Coast and its products as the inspiration for the design of this page. Dungeons & Dragons, D&D, Wizards of the Coast, the dragon ampersand, all Wizards of the Coast product names, and their respective logos are trademarks of Wizards of the Coast in the USA and other countries.";
 
−
        display: block;
 
−
        min-height: 50px;
 
−
        margin: 3rem 0 -2rem 0; }
 
−
    body aside {
 
−
      margin-top: 2.5rem; }
 
−
      body aside:before, body aside:after {
 
−
        content: "";
 
−
        display: block;
 
−
        background-color: black;
 
−
        height: 10px; }
 
−
      body aside:before {
 
−
        clip-path: polygon(0px 10px, 100% 10px, calc(100% - 20px) 0px, calc(100% - 20px) 8px, 20px 8px, 20px 0px);
 
−
        -webkit-clip-path: polygon(0px 10px, 100% 10px, calc(100% - 20px) 0px, calc(100% - 20px) 8px, 20px 8px, 20px 0px); }
 
−
      body aside:after {
 
−
        clip-path: polygon(20px 10px, 20px 2px, calc(100% - 20px) 2px, calc(100% - 20px) 10px, 100% 0px, 0px 0px);
 
−
        -webkit-clip-path: polygon(20px 10px, 20px 2px, calc(100% - 20px) 2px, calc(100% - 20px) 10px, 100% 0px, 0px 0px); }
 
−
      body aside > div {
 
−
        display: grid;
 
−
        background-color: #dcdee0;
 
−
        grid-template-columns: [left] 1fr [middle] 1fr [right];
 
−
        padding: 2rem; }
 
−
        body aside > div h3 {
 
−
          color: black;
 
−
          border-bottom: none;
 
−
          font-family: "ScalySansBold", sans-serif;
 
−
          font-size: 20px;
 
−
          font-variant: small-caps;
 
−
          margin: 0.5rem 0; }
 
−
        body aside > div ul {
 
−
          list-style: none;
 
−
          margin: 0;
 
−
          padding: 0; }
 
−
          body aside > div ul > li {
 
−
            padding: 0.1rem 0; }
 
−
            body aside > div ul > li > a {
 
−
              color: #a1452e;
 
−
              font-family: "ScalySans", sans-serif;
 
−
              font-size: 14px;
 
−
              text-decoration: none; }
 
−
        body aside > div .design-selection {
 
−
          grid-column: left / span right; }
 
−
          body aside > div .design-selection ul > li {
 
−
            display: grid;
 
−
            grid-template-columns: [left] 1fr [middle-left] 0px [middle-right] 1fr [right];
 
−
            visibility: collapse; }
 
−
            body aside > div .design-selection ul > li:nth-of-type(2n+1) a {
 
−
              background-color: #bdd4d1; }
 
−
            body aside > div .design-selection ul > li a {
 
−
              padding: 0.3rem 1rem;
 
−
              visibility: visible; }
 
−
              body aside > div .design-selection ul > li afirst-child {
 
−
                grid-column: left / span middle-left; }
 
−
              body aside > div .design-selection ul > li alast-child {
 
−
                grid-column: middle-right / span right; }
 
−
        body aside > div .design-archives {
 
−
          grid-column: left / span middle; }
 
−
        body aside > div .zen-resources {
 
−
          grid-column: middle / span right; }
 
−
    @media (min-width: 450px) {
 
−
      body section.intro > div,
 
−
      body div.main > div,
 
−
      body aside.sidebar,
 
−
      body footer {
 
−
        grid-column-start: main-left; } }
 
−
    @media (min-width: 992px) {
 
−
      body div.summary,
 
−
      body footer {
 
−
        grid-column: main-left / span main-right; }
 
−
      body div.main > div.explanation,
 
−
      body div.main > div.benefits,
 
−
      body aside.sidebar {
 
−
        grid-column-start: middle; }
 
−
      body div.benefits::after {
 
−
        content: "";
 
−
        display: block;
 
−
        min-height: 150px;
 
−
        background-image: url("../assets/zen-garden-illustration.png");
 
−
        background-repeat: no-repeat;
 
−
        background-position: top;
 
−
        background-size: contain;
 
−
        height: 100%; }
 
−
      body footer {
 
−
        grid-row-start: 6; } } }
 
−
/* --------------------------------
 
  
−
xNavigation
+
@font-face
 +
{
 +
  font-family: 'ScalySansBold';
 +
  src: url("https://dnd-fonts.herokuapp.com/fonts/ScalaSans Bold LF.otf");
 +
}
  
−
-------------------------------- */
+
@font-face
−
/* --------------------------------
+
{
 +
  font-family: 'BookSanity';
 +
  src: url("https://dnd-fonts.herokuapp.com/fonts/Bookmania Regular.otf");
 +
}
  
−
xTypography
 
  
−
-------------------------------- */
+
@font-face
−
h2, h3 {
+
{
−
   font-family: "MrEavesSmallCaps", serif;
+
   font-family: 'BookSanity';
−
   color: #8b281c; }
+
  src: url("https://dnd-fonts.herokuapp.com/fonts/Bookmania Bold.otf");
 +
   font-weight: bold;
 +
}
  
−
h1 {
+
 
−
   font-family: "Nodesto", serif;
+
@font-face
−
   color: white;
+
{
−
   letter-spacing: .025em;
+
   font-family: 'BookSanity';
−
   text-shadow: -3px -3px 0px black, 3px 3px 0px black, -3px 3px 0px black, 3px -3px 0px black, -3px -2px 0px black, 3px 2px 0px black, -3px 2px 0px black, 3px -2px 0px black, -3px -1px 0px black, 3px 1px 0px black, -3px 1px 0px black, 3px -1px 0px black, -3px 0px 0px black, 3px 0px 0px black, -2px -3px 0px black, 2px 3px 0px black, -2px 3px 0px black, 2px -3px 0px black, -1px -3px 0px black, 1px 3px 0px black, -1px 3px 0px black, 1px -3px 0px black, 0px -3px 0px black, 0px 3px 0px black;
+
  src: url("https://dnd-fonts.herokuapp.com/fonts/Bookmania Regular Italic.otf");
−
  text-transform: uppercase;
+
   font-style: italic;
−
  font-size: 66px;
+
}
−
  line-height: 1.2;
+
 
−
  margin: 0 0 .4em; }
+
 
−
  @media (min-width: 992px) {
+
@font-face
−
     h1 {
+
{
−
      font-size: 96px; } }
+
   font-family: 'BookSanity';
 +
  src: url("https://dnd-fonts.herokuapp.com/fonts/Bookmania Bold Italic.otf");
 +
   font-weight: bold;
 +
  font-style: italic;
 +
}
 +
 
 +
body {
 +
    font-family: BookSanity;
 +
    background-color: #EEE5CE; /*#ece9de*/
 +
    background-image: url(images/7/7b/Phb_bg.jpg);
 +
}
 +
 
 +
a {
 +
    color: #a1452e;
 +
    text-decoration: underline;
 +
}
 +
 
 +
a:visited {
 +
    color: #d67f69;
 +
    text-decoration: underline;
 +
}
 +
 
 +
.toc {
 +
    font-family: scalysans;
 +
}
 +
 
 +
.toc a {
 +
    color: #a1452e;
 +
    text-decoration: none;
 +
}
 +
 
 +
.toc li a {
 +
    width: 100%;
 +
    height: 100%;
 +
    display: block;
 +
}
 +
 
 +
.toctogglelabel {
 +
    cursor: pointer;
 +
    color: #a1452e;
 +
}
 +
 
 +
.toc-stripy {
 +
     background-color: #e0e5c1;
 +
}
 +
 
 +
 
 +
input[type="search"] {
 +
    font-family: scalysans;
 +
}
  
 
h2 {
 
h2 {
−
  margin: 1em 0;
+
    margin-top: .2em;
−
  font-size: 36px; }
+
    margin-bottom: .2em;
 +
    font-family: MrEeeves, serif;
 +
    font-weight: 800;
 +
    color: #58180D;
 +
}
 +
 
 +
.title
 +
{
 +
    font-family: "Nodesto", serif;
 +
    color: white;
 +
    letter-spacing: .025em;
 +
    text-shadow: -3px -3px 0px black, 3px 3px 0px black, -3px 3px 0px black, 3px -3px 0px black, -3px -2px 0px black, 3px 2px 0px black, -3px 2px 0px black, 3px -2px 0px black, -3px -1px 0px black, 3px 1px 0px black, -3px 1px 0px black, 3px -1px 0px black, -3px 0px 0px black, 3px 0px 0px black, -2px -3px 0px black, 2px 3px 0px black, -2px 3px 0px black, 2px -3px 0px black, -1px -3px 0px black, 1px 3px 0px black, -1px 3px 0px black, 1px -3px 0px black, 0px -3px 0px black, 0px 3px 0px black;
 +
    text-transform: uppercase;
 +
    font-size: 60px !important;
 +
    line-height: 1.2;
 +
    margin: 0 0 .4em;
 +
}
 +
 
 +
.mw-headline {
 +
    margin-top: .2em;
 +
    margin-bottom: .2em;
 +
    font-family: MrEeeves, serif;
 +
    font-weight: 800;
 +
    color: #58180D;
 +
}
  
−
h3 {
+
.info-box {
−
  margin: 1em 0;
+
    background-color: #e0e5c1;
−
  font-size: 24px;
+
     text-align: left;  
−
  border-bottom: 2px solid #d3b63b;
+
     font-size: 100%;  
−
  padding-bottom: .1rem; }
+
     overflow:hidden;  
−
  h3.nav {
+
     border-collapse: inherit;
−
     font-family: "ScalySansBold", sans-serif;
+
     margin: 0;
−
     font-size: 1.7rem;
+
     padding: 1rem;
−
     color: black;
+
    width: 400px;
−
     border-bottom: 0;
 
−
     font-variant: small-caps; }
 
−
     h3.nav::before {
 
−
      content: none !important; }
 
−
  h3 + p {
 
 
     font-family: "ScalySans", sans-serif;
 
     font-family: "ScalySans", sans-serif;
−
    font-size: 14px;
+
}
−
     line-height: 1.8;
+
 
−
    padding: 10px;
+
.infobox-title{
−
    background-color: #dcdee0;
+
     line-height: normal;
−
    border-left: 2px solid #8b281c;
+
}
−
     border-right: 2px solid #8b281c;
+
 
−
    position: relative; }
+
.info-box th {
−
    h3 + p::before, h3 + p::after {
+
     font-family: "ScalySansBold";
−
      content: "";
+
    font-size: 30px;
−
      display: block;
+
     text-align: center;
−
      position: absolute;
+
     padding-top: 12px;
−
      width: calc(100% - 4px);
+
}
−
      height: 12px;
 
−
      margin-right: 10px;
 
−
      border-left: 6px dotted #8b281c;
 
−
      border-right: 6px dotted #8b281c; }
 
−
     h3 + p::before {
 
−
      border-image: url(../assets/box-text-corner-top.svg) 4/6px/0px;
 
−
      top: -3px;
 
−
      left: -4px; }
 
−
     h3 + p::after {
 
−
      border-image: url(../assets/box-text-corner-bottom.svg) 4/6px/0px;
 
−
      bottom: -3px;
 
−
      left: -4px; }
 
  
−
/* Numbers before h3's */
+
.info-box td {
−
.preamble > h3::before {
+
    vertical-align: text-top;
−
  content: '1. '; }
+
}
  
−
.explanation > h3::before {
+
.info-box-outer {
−
  content: '2. '; }
+
    margin: 5px;
 +
    float: right;
 +
}
  
−
.participation > h3::before {
+
.info-box-outer:before, .info-box-outer:after {
−
  content: '3. '; }
+
    content: "";
 +
    display: block;
 +
    background-color: black;
 +
    height: 10px;  
 +
}
  
−
.benefits > h3::before {
+
.info-box-outer:before {
−
  content: '4. '; }
+
    clip-path: polygon(0px 10px, 100% 10px, calc(100% - 20px) 0px, calc(100% - 20px) 8px, 20px 8px, 20px 0px);
 +
    -webkit-clip-path: polygon(0px 10px, 100% 10px, calc(100% - 20px) 0px, calc(100% - 20px) 8px, 20px 8px, 20px 0px);
 +
}
  
−
.requirements > h3::before {
+
.info-box-outer:after {
−
  content: '5. '; }
+
    clip-path: polygon(20px 10px, 20px 2px, calc(100% - 20px) 2px, calc(100% - 20px) 10px, 100% 0px, 0px 0px);
 +
    -webkit-clip-path: polygon(20px 10px, 20px 2px, calc(100% - 20px) 2px, calc(100% - 20px) 10px, 100% 0px, 0px 0px);  
 +
}
  
−
p {
+
.top-bar {
−
  font-size: 16px;
+
    background-color: #B22222;
−
  line-height: 1.6;
+
    text-decoration: none;
−
  color: black;
+
}
−
  font-family: "Bookinsanity", serif; }
+
.top-bar-section ul li {
−
  p.footer {
+
     text-decoration: none;
−
     font-family: "ZatannaMisdirection", sans-serif; }
+
    background-color: #B22222;
 +
}
  
−
a {
+
.left a{  
−
  transition: .25s; }
+
    text-decoration:none;
−
  a:link {
+
    padding: 1.0em;
−
     color: #a1452e;
+
}
−
     text-decoration: none; }
+
 
−
  a:visited {
+
 
−
     color: #522317; }
+
.top-bar-section .left li .dropdown{
−
  a:hover {
+
    background-colour: #B22222;
−
     text-decoration: underline; }
+
}
−
  a:active {
+
.top-bar-section .dropdown li:not(.has-form):not(.active) > a:not(.button){
−
     color: #d27963; }
+
     background-color:#333333;
 +
}
 +
.top-bar-section .dropdown li:not(.has-form):not(.active):hover > a:not(.button){
 +
     background-color: #b26a22;
 +
}
 +
.top-bar-section .has-form {
 +
     background-color: #B22222;
 +
}
 +
.top-bar-section ul li > a {
 +
    font-family: MrEeeves,serif;
 +
    font-size: 1.0rem
 +
 
 +
}
 +
 
 +
.title-name {
 +
     font-size: 1.3rem;
 +
    margin: 0 .5em;
 +
    color: #FFF;
 +
    line-height: 2.1em;
 +
}
 +
.h3#tagline{ display:none; }
 +
 
 +
.documentation {
 +
     border: 1px solid #a2a9b1;
 +
    background-color: #ece4cd;
 +
    padding: 1em 2em 1em 2em;
 +
}
  
−
body {
+
.code {
−
  background: url(../assets/bg-top.png) no-repeat top, url(../assets/bg-bottom.png) no-repeat bottom, url(../assets/bg-middle.jpg) repeat-y center;
+
    color: white;
−
  background-color: black;
+
    background-color: black;
−
  background-size: 300%;
+
    padding: 1em;
−
  padding: 7rem 1rem; }
+
}
−
  @media (min-width: 450px) {
 
−
    body {
 
−
      background-size: 100%; } }
 
−
  @media (min-width: 992px) {
 
−
    body {
 
−
      background-size: 1040px; } }
 
  
−
/*# sourceMappingURL=style.css.map */
+
.usageResult {
 +
    float: left;
 +
    margin: 10px;
 +
    margin-right: 100%;
 +
    display: block;
 +
}

Latest revision as of 19:39, 28 November 2020

@font-face
{
  font-family: 'Nodestro Caps';
  src: url("https://www.gmbinder.com/assets/fonts/Nodesto Caps Condensed.otf");
  font-weight: bold;
}

@font-face
{
  font-family: 'Nodestro Caps';
  src: url("https://www.gmbinder.com/assets/fonts/Nodesto Caps Condensed Bold.otf");
  font-weight: bold;
}

@font-face
{
  font-family: 'Nodestro Caps';
  src: url("https://www.gmbinder.com/assets/fonts/Nodesto Caps Condensed Italic.otf");
  font-weight: normal;
  font-style: italic;
}

@font-face
{
  font-family: 'MrEeeves';
  src: url("https://dnd-fonts.herokuapp.com/fonts/MrsEaves SmallCaps Regular.otf");
}

@font-face
{
  font-family: 'ScalySans';
  src: url("https://dnd-fonts.herokuapp.com/fonts/ScalaSans Regular LF.otf");
}

@font-face
{
  font-family: 'ScalySansBold';
  src: url("https://dnd-fonts.herokuapp.com/fonts/ScalaSans Bold LF.otf");
}

@font-face
{
  font-family: 'BookSanity';
  src: url("https://dnd-fonts.herokuapp.com/fonts/Bookmania Regular.otf");
}


@font-face
{
  font-family: 'BookSanity';
  src: url("https://dnd-fonts.herokuapp.com/fonts/Bookmania Bold.otf");
  font-weight: bold;
}


@font-face
{
  font-family: 'BookSanity';
  src: url("https://dnd-fonts.herokuapp.com/fonts/Bookmania Regular Italic.otf");
  font-style: italic;
}


@font-face
{
  font-family: 'BookSanity';
  src: url("https://dnd-fonts.herokuapp.com/fonts/Bookmania Bold Italic.otf");
  font-weight: bold;
  font-style: italic;
}

body {
    font-family: BookSanity;
    background-color: #EEE5CE; /*#ece9de*/
    background-image: url(images/7/7b/Phb_bg.jpg);
}

a {
    color: #a1452e;
    text-decoration: underline;
}

a:visited {
    color: #d67f69;
    text-decoration: underline;
}

.toc {
    font-family: scalysans;
}

.toc a {
    color: #a1452e;
    text-decoration: none;
}

.toc li a {
    width: 100%;
    height: 100%;
    display: block;
}

.toctogglelabel {
    cursor: pointer;
    color: #a1452e;
}

.toc-stripy {
    background-color: #e0e5c1;
}


input[type="search"] {
    font-family: scalysans;
}

h2 {
    margin-top: .2em;
    margin-bottom: .2em;
    font-family: MrEeeves, serif;
    font-weight: 800;
    color: #58180D;
}

.title 
{
    font-family: "Nodesto", serif;
    color: white;
    letter-spacing: .025em;
    text-shadow: -3px -3px 0px black, 3px 3px 0px black, -3px 3px 0px black, 3px -3px 0px black, -3px -2px 0px black, 3px 2px 0px black, -3px 2px 0px black, 3px -2px 0px black, -3px -1px 0px black, 3px 1px 0px black, -3px 1px 0px black, 3px -1px 0px black, -3px 0px 0px black, 3px 0px 0px black, -2px -3px 0px black, 2px 3px 0px black, -2px 3px 0px black, 2px -3px 0px black, -1px -3px 0px black, 1px 3px 0px black, -1px 3px 0px black, 1px -3px 0px black, 0px -3px 0px black, 0px 3px 0px black;
    text-transform: uppercase;
    font-size: 60px !important;
    line-height: 1.2;
    margin: 0 0 .4em;
}

.mw-headline {
    margin-top: .2em;
    margin-bottom: .2em;
    font-family: MrEeeves, serif;
    font-weight: 800;
    color: #58180D;
}

.info-box {
    background-color: #e0e5c1;
    text-align: left; 
    font-size: 100%; 
    overflow:hidden; 
    border-collapse: inherit;
    margin: 0;
    padding: 1rem;
    width: 400px;
    font-family: "ScalySans", sans-serif;
}

.infobox-title{
    line-height: normal;
}

.info-box th {
    font-family: "ScalySansBold";
    font-size: 30px;
    text-align: center;
    padding-top: 12px;
}

.info-box td {
    vertical-align: text-top;
}

.info-box-outer {
    margin: 5px;
    float: right;
}

.info-box-outer:before, .info-box-outer:after {
    content: "";
    display: block;
    background-color: black;
    height: 10px; 
}

.info-box-outer:before {
    clip-path: polygon(0px 10px, 100% 10px, calc(100% - 20px) 0px, calc(100% - 20px) 8px, 20px 8px, 20px 0px);
    -webkit-clip-path: polygon(0px 10px, 100% 10px, calc(100% - 20px) 0px, calc(100% - 20px) 8px, 20px 8px, 20px 0px); 
}

.info-box-outer:after {
    clip-path: polygon(20px 10px, 20px 2px, calc(100% - 20px) 2px, calc(100% - 20px) 10px, 100% 0px, 0px 0px);
    -webkit-clip-path: polygon(20px 10px, 20px 2px, calc(100% - 20px) 2px, calc(100% - 20px) 10px, 100% 0px, 0px 0px); 
}

.top-bar {
    background-color: #B22222;
    text-decoration: none;
}
.top-bar-section ul li {
    text-decoration: none;
    background-color: #B22222;
}

.left a{ 
    text-decoration:none;
    padding: 1.0em;
}


.top-bar-section .left li .dropdown{
    background-colour: #B22222;
}
.top-bar-section .dropdown li:not(.has-form):not(.active) > a:not(.button){
    background-color:#333333;
}
.top-bar-section .dropdown li:not(.has-form):not(.active):hover > a:not(.button){
    background-color: #b26a22;
}
.top-bar-section .has-form {
    background-color: #B22222;
}
.top-bar-section ul li > a {
    font-family: MrEeeves,serif;
    font-size: 1.0rem

}

.title-name {
    font-size: 1.3rem;
    margin: 0 .5em;
    color: #FFF;
    line-height: 2.1em;
}
.h3#tagline{ display:none; }

.documentation {
    border: 1px solid #a2a9b1;
    background-color: #ece4cd;
    padding: 1em 2em 1em 2em;
}

.code {
    color: white;
    background-color: black;
    padding: 1em;
}

.usageResult {
    float: left;
    margin: 10px;
    margin-right: 100%;
    display: block;
}
Retrieved from "http://wiki.theredshift.org/index.php?title=MediaWiki:Common.css&oldid=1277"