We do our best to give you all information you need. Use the Search menu to search for the page you are looking for. The most used pages are on the side menu or in the Popular Pages page.

Do you miss important stuff or do you have suggestions? Let us know via Discord or in-game. Thank you for using our Wiki!

Difference between revisions of "MediaWiki:Common.css"

From GrinderScape Wiki
Jump to: navigation, search
Line 1: Line 1:
@import url(https://fonts.googleapis.com/css?family=Open+Sans:600,600italic,700);
+
<div style='padding:10px 0;text-align:center;background-color:#ECE6D8;color:#000;'>Wiki design is currently under construction. Wiki content is still available to browse.</div>
@import url(https://fonts.googleapis.com/css?family=Roboto+Slab:700);
+
<header>
@import url(https://www.grinderscape.org/webfonts/fa-regular-400.eot);
+
     <div class='entire-header'>
@import url(https://www.grinderscape.org/webfonts/fa-brands-400.eot);
+
        <div class='header-top'>
@import url(https://www.grinderscape.org/webfonts/fa-solid-900.eot);
+
            <div class='container dFlx'>
 
+
                <ul class='play-link'>
body {
+
                    <li><a itemprop='url' href='https://www.facebook.com/Grinderscape.org'><i class='fab fa-facebook-square'></i></a></li>
    background: url(https://www.grinderscape.org/images/home-bg.jpeg);
+
                    <li><a itemprop='url' href='https://www.youtube.com/user/dokenfilm/feed'><i class='fab fa-youtube'></i></a></li>
    font-family: Open Sans, sans-serif;
+
                    <li><a itemprop='url' href='https://discord.gg/b46xx5u'><i class='fab fa-discord'></i></a></li>
    line-height: 20px;
+
                </ul>
}
+
                <div class='logo'>
 
+
                    <a itemprop='url' href='https://www.grinderscape.org/home'><img src='https://www.grinderscape.org/images/grinderscape-logo.png' alt='GrinderScape'></a>
a {
+
                </div>
    color: #272525;
+
                <div class='mobile-logo'>
    text-decoration: none;
+
                    <a itemprop='url' href='https://www.grinderscape.org/home'><img src='https://www.grinderscape.org/images/grinderscape-logo-mobile.png' alt='GrinderScape'></a>
}
+
                </div>
 
+
                <ul class='login'>
a.new {
+
                    <li id='n-Log-in'><a href='/Special:UserLogin' data-toggle='modal' data-target='#myModal-user'>Wiki Login</a></li>
    color: #b24040;
+
                </ul>
}
+
            </div>
 
+
        </div>
/* nav ul {
+
        <div class='header-bottm'>
    list-style-type: none;
+
            <div class='container'>
    list-style-image: none;
+
                <div class='mobile-menu'>
    text-align: center;
+
                    <span></span>
    margin: auto;
+
                    <span></span>
}
+
                    <span></span>
 
+
                </div>
nav ul li {
+
                <ul class='main-nav'>
    margin: 0;
+
                    <li><a itemprop='url' href='https://www.grinderscape.org'>HOME</a></li>
    display: inline-flex;
+
                    <li><a itemprop='url' href='http://forum.grinderscape.org/'>FORUM</a></li>
} */
+
                    <li><a itemprop='url' href='https://www.grinderscape.org/store'>STORE</a></li>
 
+
                    <li><a itemprop='url' href='https://www.grinderscape.org/download'>DOWNLOAD</a></li>
header {
+
                    <li><a href='javascript:void(0);' data-toggle='modal' data-target='#myModal-vote'>VOTE</a></li>
    min-width: auto;
+
                    <li><a itemprop='url' href='https://www.grinderscape.org/highscores'>HIGHSCORES</a></li>
}
+
                    <li class='acitve'><a itemprop='url' href='http://wiki.grinderscape.org/'>WIKI</a></li>
 
+
                    <li><a itemprop='url' href='https://www.grinderscape.org/contact'>CONTACT</a></li>
div#logo {
+
                    <li>
    padding: 30px 0;
+
                        <ul class='mobile-mw-navigation'>
    margin: auto;
+
                        </ul>
    text-align: center;
+
                    </li>
}
+
                </ul>
 
+
            </div>
div#main-wrapper {
+
         </div>
}
+
     </div>
 
+
</header>
div#mw-navigation {
+
    display: none;
+
}
+
 
+
div#mw-head {
+
    position: initial;
+
}
+
 
+
div#p-personal {
+
    position: initial;
+
    text-align: right;
+
    padding-bottom: 0;
+
}
+
 
+
#p-personal ul {
+
    padding: 0;
+
    display: inline-block;
+
}
+
 
+
#p-personal ul li {
+
    float: initial;
+
    margin: 0;
+
    display: inline-block;
+
    padding: 0 !important;
+
    background: none;
+
}
+
 
+
#p-personal ul li a {
+
    margin: 10px;
+
    padding: 0;
+
    display: block;
+
}
+
 
+
div#mw-head div.vectorMenu h3 {
+
    display: none;
+
}
+
 
+
div#siteNotice {
+
    margin-bottom: 30px;
+
    padding: 30px;
+
    text-align: left;
+
}
+
 
+
div#noticeTitle {
+
    margin-bottom: 10px !important;
+
    background: url(https://i.imgur.com/3dqF3sx.png) no-repeat;
+
}
+
 
+
div#localNotice {
+
    margin-bottom: 0;
+
}
+
 
+
div#localNotice>p {
+
    margin: 0;
+
}
+
 
+
div#pageInfo {
+
    margin: 0 0 30px 0;
+
    padding: 30px;
+
}
+
 
+
h1#firstHeading {
+
    background: url(https://i.imgur.com/qpqwLFJ.png) no-repeat;
+
    padding: 0 0 0 30px;
+
    line-height: 20px;
+
    margin: 0;
+
    border-bottom: none;
+
    font-size: 13px;
+
    color: #592c0d;
+
}
+
 
+
span.subpages {
+
    position: relative;
+
    border-top: 2px solid #161b20;
+
    padding-top: 10px;
+
    margin-top: 10px;
+
}
+
 
+
div#content-sidebar-wrap {
+
    display: table;
+
    width: 100%;
+
}
+
 
+
div#mw-panel {
+
    position: initial;
+
    width: 350px;
+
    display: table-cell;
+
    padding: 0 0 0 30px !important;
+
    vertical-align: top;
+
    box-sizing: border-box;
+
}
+
 
+
div#p-logo {
+
    display: none;
+
}
+
 
+
div#p-search {
+
    margin: 0;
+
    float: initial;
+
    margin-bottom: 30px;
+
    padding: 30px;
+
}
+
 
+
div#p-search div#searchTitle {
+
    background: url(https://i.imgur.com/X1fC0qz.png) no-repeat;
+
}
+
 
+
span.subpages:before {
+
    content: "";
+
    position: absolute;
+
    height: 2px;
+
    width: 20px;
+
    background-color: #afafaf;
+
    top: -2px;
+
    left: 0;
+
}
+
 
+
form#searchform {
+
    padding: 0;
+
    margin: 0;
+
}
+
 
+
div#simpleSearch {
+
    margin: 0;
+
     padding: 0;
+
    width: 100%;
+
    height: initial;
+
    border: 0;
+
    background: none;
+
}
+
 
+
div#simpleSearch #searchInput,
+
input#database_input {
+
    padding: 10px;
+
    line-height: 20px;
+
    font-family: Open Sans, sans-serif;
+
    background-color: transparent;
+
    border: 1px solid #161b20;
+
    outline: none;
+
}
+
 
+
div#simpleSearch #searchButton {
+
    position: initial;
+
    width: 100%;
+
    margin-top: 10px !important;
+
    text-indent: initial;
+
}
+
 
+
div#mw-panel div.portal {
+
    margin: 0;
+
    padding: 30px;
+
    margin-bottom: 30px;
+
}
+
 
+
div#mw-panel div.portal h3 {
+
    cursor: initial;
+
    display: block !important;
+
}
+
 
+
div#mw-panel div.portal h3#p-In_the_wiki-label {
+
    background: url(https://i.imgur.com/7DeMxyz.png) no-repeat;
+
}
+
 
+
div#mw-panel div.portal h3#p-Popular_pages-label {
+
    background: url(https://i.imgur.com/qtaf1a3.png) no-repeat;
+
}
+
 
+
div#mw-panel div.portal h3#p-Categories-label {
+
    background: url(https://i.imgur.com/Lnp5kiv.png) no-repeat;
+
}
+
 
+
div#mw-panel div#p-Management {
+
    display: none;
+
}
+
 
+
div#mw-panel div.portal h3#p-Management-label {
+
    background: url(https://i.imgur.com/vcNXF6N.png) no-repeat;
+
}
+
 
+
div#mw-panel div.portal div.body {
+
    margin: 0 !important;
+
}
+
 
+
div#mw-panel div.portal div.body ul li {
+
    line-height: 20px;
+
    display: flex;
+
    padding: 10px 0;
+
    border-bottom: 1px solid rgba(0, 0, 0, 0.1);
+
}
+
 
+
div#mw-panel div.portal div.body ul li:last-child {
+
    border-bottom: none;
+
}
+
 
+
div#content-wrap {
+
    box-sizing: border-box;
+
}
+
 
+
div#content-navigation-wrap {
+
    margin-bottom: 30px;
+
    overflow: hidden;
+
}
+
 
+
div#navigation {
+
    display: flex;
+
    height: 42px;
+
    position: relative;
+
    margin-bottom: 60px;
+
}
+
 
+
div#navigation:before {
+
    content: "";
+
    position: absolute;
+
    bottom: 0;
+
    border-bottom: 2px solid rgba(0, 0, 0, 0.1);
+
    width: 100%;
+
}
+
 
+
div#left-navigation {
+
    margin: 0;
+
    position: absolute;
+
}
+
 
+
div#right-navigation {
+
    position: absolute;
+
    right: 0;
+
    margin: 0;
+
}
+
 
+
div.vectorTabs {
+
    background: none;
+
    padding: 0;
+
    height: initial;
+
}
+
 
+
div.vectorTabs ul {
+
    background: none;
+
}
+
 
+
div.vectorTabs ul li {
+
    background: none !important;
+
    font-size: 0;
+
}
+
 
+
div.vectorTabs ul li.selected a {
+
    cursor: initial;
+
    border-bottom: 2px solid #5C3219;
+
}
+
 
+
div.vectorTabs span {
+
    background: none;
+
}
+
 
+
div.vectorTabs ul li a {
+
    line-height: 20px;
+
    padding: 10px;
+
    font-size: 13px;
+
    height: initial;
+
    border-bottom: 2px solid transparent;
+
}
+
 
+
div.vectorTabs ul li a:hover {
+
    border-bottom: 2px solid rgba(0, 0, 0, 0.2);
+
}
+
 
+
h3#p-cactions-label {
+
    padding: 0;
+
    margin: 0 !important;
+
}
+
 
+
h3#p-cactions-label span {
+
    display: none;
+
}
+
 
+
div.vectorMenu h3 a {
+
    position: initial;
+
    display: block;
+
    width: 46px;
+
    height: 40px;
+
    background: url(https://i.imgur.com/l1cW7qY.png) no-repeat center !important;
+
    background-position: initial;
+
    outline: none;
+
}
+
 
+
div.vectorMenu h3 a:hover {
+
    background: #transparent !important;
+
}
+
 
+
div.vectorMenu div.menu {
+
    top: 40px;
+
    left: initial;
+
    right: 0;
+
    border: none;
+
    background: #c7b07c;
+
}
+
 
+
div.vectorMenu div.menu li {
+
    line-height: 20px;
+
}
+
 
+
div.vectorMenu li:first-child a {
+
    border-top: 1px solid #151A1E;
+
}
+
 
+
div.vectorMenu li a {
+
    padding: 10px 15px;
+
    font-size: 12px;
+
    border-bottom: 1px solid #151A1E;
+
}
+
 
+
div.vectorMenu li a:hover {
+
    background: rgba(255, 255, 255, 0.1);
+
}
+
 
+
div#content {
+
    margin: 0;
+
    padding: 30px;
+
    border: none;
+
    background: none;
+
}
+
 
+
#contentSub,
+
#contentSub2 {
+
    margin: 30px 0;
+
}
+
 
+
ul#footer-info {
+
    margin: 0 30px;
+
    border-top: 2px solid rgba(0, 0, 0, 0.2);
+
}
+
 
+
div#footer {
+
    margin: 0;
+
    padding: 0;
+
    min-width: auto;
+
}
+
 
+
div#customFooter {
+
    margin: 0;
+
    background: #252525;
+
    margin-top: 30px;
+
    padding: 30px;
+
    text-align: center;
+
}
+
 
+
div#customFooter div a {
+
    width: 20px;
+
    height: 20px;
+
    display: inline-block;
+
    margin: 0 5px !important;
+
}
+
 
+
ul#footer-places,
+
ul#footer-icons,
+
li#ca-unwatch,
+
li#ca-watch,
+
div#jump-to-nav,
+
span#wpSummaryLabel,
+
input#wpSummary,
+
div.editCheckboxes,
+
div#editpage-copywarn {
+
    display: none;
+
}
+
 
+
/* div#siteNotice,
+
div#pageInfo,
+
div#content-navigation-wrap,
+
div#p-search,
+
div#mw-panel div.portal {
+
    background: #bca674 !important;
+
    box-shadow: 0 0 5px rgba(0, 0, 0, 0.5);
+
} */
+
 
+
div#noticeTitle,
+
div#searchTitle,
+
div#mw-panel div.portal h3 {
+
    position: relative;
+
    font-size: 13px;
+
    padding: 0 0 10px 30px;
+
    color: #592c0d;
+
    margin-bottom: 30px;
+
    border-bottom: 2px solid rgba(0, 0, 0, 0.1);
+
    overflow: initial;
+
}
+
 
+
body,
+
.mw-body p,
+
p,
+
a:hover,
+
div#mw-panel div.portal div.body ul li a,
+
span.subpages a,
+
div#simpleSearch #searchInput,
+
div.vectorTabs ul li a,
+
table,
+
.mw-body-content,
+
.mw-body pre,
+
textarea#wpTextbox1,
+
#contentSub,
+
#contentSub2,
+
input#database_input,
+
div#mw-panel div.portal div.body ul li a:visited,
+
a:visited,
+
.mw-body a.external,
+
.mw-body a.external:visited {
+
    color: #272525;
+
}
+
 
+
a:hover, a:focus, .mw-body a.external:hover {
+
    text-decoration: none;
+
    color: #5c3219;
+
}
+
div.portal h3:before,
+
div#searchTitle:before,
+
div#noticeTitle:before {
+
    content: "";
+
    position: absolute;
+
    height: 2px;
+
    width: 20px;
+
    background-color: #5c3219;
+
    bottom: -2px;
+
    left: 0;
+
}
+
 
+
div.editButtons input[type="submit"],
+
div#simpleSearch #searchButton,
+
div.editButtons span a,
+
div#customFooter div a,
+
button#database_button {
+
    border-radius: 3px;
+
    color: #afafaf;
+
    border: 1px solid #5c3219;
+
    background-color: #5c3219;
+
    background-image: linear-gradient(transparent, rgba(0, 0, 0, 0.15));
+
    padding: 10px;
+
    margin: 0;
+
    font-family: Open Sans, sans-serif;
+
    font-size: 12px;
+
    line-height: 20px;
+
    cursor: pointer;
+
    outline: none;
+
}
+
 
+
div.editButtons span a:hover, div.editButtons input[type="submit"]:hover {
+
    background-color: #bca674;
+
    color: #593018;
+
}
+
 
+
a#mw-editform-cancel:hover {
+
    background-color: #bca674;
+
}
+
 
+
 
+
 
+
/* New Site Design */
+
 
+
/* Base Classes */
+
 
+
div,
+
table,
+
tr,
+
th,
+
td,
+
figure,
+
th,
+
video,
+
audio,
+
h1,
+
h2,
+
h3,
+
h4,
+
h5,
+
h6,
+
aside,
+
canvas,
+
section,
+
header,
+
footer,
+
nav,
+
span,
+
p,
+
small,
+
big,
+
a,
+
b,
+
strong,
+
img,
+
hr,
+
pre,
+
button,
+
input,
+
textarea,
+
optgroup,
+
ul,
+
li,
+
ol,
+
select,
+
option,
+
blockquote,
+
nav {
+
    margin: 0;
+
    padding: 0;
+
    outline: none;
+
    border: none;
+
    text-decoration: none;
+
    list-style-type: none
+
}
+
 
+
ul {
+
    margin-bottom: 0
+
}
+
 
+
.dFlx {
+
    display: -webkit-box;
+
    display: -moz-box;
+
    display: -ms-flexbox;
+
    display: -webkit-flex;
+
    display: flex
+
}
+
 
+
/* Header */
+
 
+
.container {
+
    max-width: 1600px;
+
    margin: auto
+
}
+
 
+
header {
+
    position: relative;
+
    width: 100%
+
}
+
 
+
.header-top {
+
    padding: 14px 0;
+
    box-sizing: border-box;
+
    position: relative;
+
    width: 100%;
+
    background: #110901
+
}
+
 
+
.header-top .container {
+
    justify-content: space-between
+
}
+
 
+
.header-top .logo {
+
    position: absolute;
+
    top: 0;
+
    right: 0;
+
    left: 0;
+
    margin: auto;
+
    max-width: 380px;
+
    width: 380px;
+
    z-index: 99
+
}
+
 
+
.header-top .login {
+
    display: -webkit-box;
+
    display: -moz-box;
+
    display: -webkit-flex;
+
    display: -ms-flexbox;
+
    display: flex
+
}
+
 
+
.header-top .login li {
+
    margin-right: 10px
+
}
+
 
+
.header-top .login li:last-child {
+
    margin-right: 0
+
}
+
 
+
.header-top .login li:last-child a:hover {
+
    text-decoration: underline
+
}
+
 
+
.play-link {
+
    display: -webkit-box;
+
    display: -moz-box;
+
    display: -webkit-flex;
+
    display: -ms-flexbox;
+
    display: flex
+
}
+
 
+
.play-link li {
+
    margin-right: 15px
+
}
+
 
+
.play-link li a {
+
    color: #fff;
+
    text-shadow: 0 3px 15px rgba(0, 0, 0, .75);
+
    font-size: 22px
+
}
+
 
+
.play-link li a:hover {
+
    color: #ff8936;
+
    text-shadow: 0 3px 15px rgba(0, 0, 0, .75)
+
}
+
 
+
.login a {
+
    color: #90b41a;
+
    text-transform: uppercase;
+
    font-size: 15px
+
}
+
 
+
.header-bottm {
+
    padding: 30px 0;
+
    box-sizing: border-box;
+
    width: 100%;
+
    background: #060402;
+
    background: linear-gradient(90deg, rgba(6, 4, 2, 0.6026785714285714) 0%, rgba(38, 26, 6, 0.45) 10%, rgba(38, 26, 6, 0.45) 90%, rgba(6, 4, 2, 0.6) 100%)
+
}
+
 
+
.header-bottm .main-nav {
+
    display: -webkit-box;
+
    display: -moz-box;
+
    display: -webkit-flex;
+
    display: -ms-flexbox;
+
    display: flex;
+
    flex-flow: row
+
}
+
 
+
.header-bottm .main-nav li {
+
    margin-right: 5.75%;
+
    position: relative;
+
    display:inline-flex;
+
}
+
 
+
.header-bottm .main-nav li:last-child {
+
    margin-right: 0
+
}
+
 
+
.header-bottm .main-nav li:nth-child(4) {
+
    margin-right: 32.41%
+
}
+
 
+
.header-bottm ul li a {
+
    text-transform: uppercase;
+
    color: #fe9826;
+
    font-size: 17px;
+
    display: block;
+
    transition: .2s all ease-in-out;
+
    text-shadow: 0 1px 0 rgba(0, 0, 0, .3)
+
}
+
 
+
.header-bottm ul li.acitve a {
+
    color: #90b41a;
+
    text-shadow: 0 2px 28px #ffaa0a
+
}
+
 
+
.header-bottm ul li a:hover {
+
    color: #90b41a;
+
    text-shadow: 0 2px 28px #ffaa0a
+
}
+
 
+
.header-bottm ul li::after {
+
    position: absolute;
+
    content: '';
+
    background: url(https://www.grinderscape.org/images/menu-after-icon.png) no-repeat;
+
    width: 16px;
+
    height: 16px;
+
    right: -50px;
+
    top: 5px
+
}
+
 
+
.header-bottm .main-nav li:nth-child(4)::after {
+
    position: absolute;
+
    content: '';
+
    background: 0 0;
+
    width: 0;
+
    height: 0;
+
    margin: 0;
+
    right: 0
+
}
+
 
+
.header-bottm ul li:last-child::after {
+
    position: absolute;
+
    content: '';
+
    background: 0 0;
+
    width: 0;
+
    height: 0;
+
    margin: 0;
+
    right: 0
+
}
+
 
+
.mobile-logo {
+
    display: none
+
}
+
 
+
/* Body */
+
 
+
#main-wrapper {
+
    overflow: hidden
+
}
+
 
+
#main-wrapper .container {
+
    position: relative;
+
    padding: 0 20px;
+
    box-sizing: border-box
+
}
+
 
+
#main-wrapper .container::before {
+
    position: absolute;
+
    content: '';
+
    background: url(https://www.grinderscape.org/images/left-sidebar.png);
+
    background-repeat: repeat-y;
+
    width: 110px;
+
    height: 100%;
+
    left: -60px;
+
    z-index: 99;
+
    top: 0;
+
    background-size: 100%
+
}
+
 
+
#main-wrapper .container::after {
+
    position: absolute;
+
    content: '';
+
    background: url(https://www.grinderscape.org/images/right-sidebar.png);
+
    background-repeat: repeat-y;
+
    width: 110px;
+
    height: 100%;
+
    right: -60px;
+
    z-index: 99;
+
    top: 0;
+
    background-size: 100%
+
}
+
 
+
.main-content-cstm {
+
    box-sizing: border-box;
+
    padding: 42px 40px;
+
    padding-bottom: 30px;
+
    box-sizing: border-box;
+
    background: #ab915a;
+
    background: linear-gradient(180deg, rgba(171, 145, 90, 0.28335084033613445) 0%, rgba(171, 145, 90, 0) 95%)
+
}
+
 
+
#content-sidebar-wrap {
+
    display: -webkit-box;
+
    display: -moz-box;
+
    display: -webkit-flex;
+
    display: -ms-flexbox;
+
    display: flex;
+
    justify-content: space-between;
+
    position: relative;
+
    background: url(https://www.grinderscape.org/images/middle-cover-bg.png) repeat-y;
+
    background-size: 100%;
+
    padding: 65px 35px;
+
    padding-bottom: 5px;
+
    box-sizing: border-box
+
}
+
 
+
#content-sidebar-wrap::before {
+
    content: '';
+
    position: absolute;
+
    background: url(https://www.grinderscape.org/images/middle-cover-top-bg.png) repeat-x;
+
    height: 7px;
+
    bottom: -6px;
+
    width: 100%;
+
    left: 0;
+
    top: -4px
+
}
+
 
+
#content-sidebar-wrap::after {
+
    content: '';
+
    position: absolute;
+
    background: url(https://www.grinderscape.org/images/middle-cover-foot-bg.png) repeat-x;
+
    height: 7px;
+
    width: 100%;
+
    left: 0;
+
    bottom: -6px
+
}
+
 
+
#content-sidebar-wrap::before {
+
    box-sizing: border-box
+
}
+
 
+
/* Footer */
+
 
+
footer {
+
    position: relative;
+
    padding: 25px 25px 30px;
+
    box-sizing: border-box;
+
    background: #282013;
+
    background: linear-gradient(180deg, rgba(40, 32, 19, 0.8267506831834296) 0%, rgba(39, 31, 16, 0.6754901789817489) 7%, rgba(36, 27, 9, 1) 25%, rgba(30, 21, 4, 1) 50%, rgba(0, 0, 0, 1) 75%, rgba(0, 0, 0, 1) 100%);
+
    background: url(https://grinderscape.org/images/total-futr.png) no-repeat;
+
    background-position: 100% 50%;
+
    background-size: cover
+
}
+
 
+
footer::after {}
+
 
+
.footer-top {
+
    border-bottom: 1px solid #140e01;
+
    position: relative;
+
    z-index: 9;
+
    justify-content: space-between;
+
    padding-bottom: 40px;
+
    padding-top: 30px;
+
    max-width: 82%;
+
    margin: auto
+
}
+
 
+
.footer-top .cw-30 {
+
    width: 29%
+
}
+
 
+
.footer-top .cw-70 {
+
    width: 65%
+
}
+
 
+
.footer-top .cw-70 .cw-33 {
+
    width: 31%;
+
    margin-right: 4%
+
}
+
 
+
.footer-top .cw-70 .cw-33:last-child {
+
    margin-right: 0
+
}
+
 
+
.footer-top li {
+
    display:flex;
+
}
+
 
+
.footer-top li a,
+
.footer-top p {
+
    color: #f6e6c2;
+
    font-family: pt sans caption, sans-serif;
+
    font-weight: 400;
+
    font-size: 15px;
+
}
+
 
+
.footer-top li a:hover {
+
    color: #fe9826
+
}
+
 
+
.footer-top p {
+
    line-height: 1.7
+
}
+
 
+
.footer-top li a {
+
    line-height: 1.9
+
}
+
 
+
.footer-top h5 {
+
    font-family: pt sans caption, sans-serif;
+
    font-weight: 700;
+
    color: #fff;
+
    font-size: 20px;
+
    position: relative;
+
    margin-bottom: 26px
+
}
+
 
+
.footer-top h5::before {
+
    content: '';
+
    position: absolute;
+
    height: 3px;
+
    background: #fff;
+
    width: 30px;
+
    top: -14px
+
}
+
 
+
.footer-btm {
+
    width: 100%;
+
    box-sizing: border-box;
+
    flex-flow: column;
+
    justify-content: center;
+
    position: relative;
+
    z-index: 9;
+
    padding: 50px 0 0
+
}
+
 
+
.footer-btm .footer-logo {
+
    width: 63px;
+
    margin: auto;
+
    margin-bottom: 40px
+
}
+
 
+
.footer-btm p {
+
    text-align: center;
+
    color: #fff
+
}
+
 
+
/* END MAIN */
+
 
+
 
+
 
+
/* FONT AWESOME */
+
 
+
/*!
+
* Font Awesome Free 5.14.0 by @fontawesome - https://fontawesome.com
+
* License - https://fontawesome.com/license/free (Icons: CC BY 4.0, Fonts: SIL OFL 1.1, Code: MIT License)
+
*/
+
.fa,
+
.fab,
+
.fad,
+
.fal,
+
.far,
+
.fas {
+
    -moz-osx-font-smoothing: grayscale;
+
    -webkit-font-smoothing: antialiased;
+
    display: inline-block;
+
    font-style: normal;
+
    font-variant: normal;
+
    text-rendering: auto;
+
    line-height: 1
+
}
+
 
+
.fa-discord:before {
+
    content: "\f392"
+
}
+
 
+
.fa-facebook:before {
+
    content: "\f09a"
+
}
+
 
+
.fa-facebook-f:before {
+
    content: "\f39e"
+
}
+
 
+
.fa-facebook-messenger:before {
+
    content: "\f39f"
+
}
+
 
+
.fa-facebook-square:before {
+
    content: "\f082"
+
}
+
 
+
.fa-youtube:before {
+
    content: "\f167"
+
}
+
 
+
.fa-youtube-square:before {
+
    content: "\f431"
+
}
+
 
+
@font-face {
+
    font-family: "Font Awesome 5 Brands";
+
    font-style: normal;
+
    font-weight: 400;
+
    font-display: block;
+
    src: url(https://www.grinderscape.org/webfonts/fa-brands-400.eot);
+
    src: url(https://www.grinderscape.org/webfonts/fa-brands-400.eot?#iefix) format("embedded-opentype"), url(https://www.grinderscape.org/webfonts/fa-brands-400.woff2) format("woff2"), url(https://www.grinderscape.org/webfonts/fa-brands-400.woff) format("woff"), url(https://www.grinderscape.org/webfonts/fa-brands-400.ttf) format("truetype"), url(https://www.grinderscape.org/webfonts/fa-brands-400.svg#fontawesome) format("svg")
+
}
+
 
+
.fab {
+
    font-family: "Font Awesome 5 Brands"
+
}
+
 
+
@font-face {
+
    font-family: "Font Awesome 5 Free";
+
    font-style: normal;
+
    font-weight: 400;
+
    font-display: block;
+
    src: url(https://www.grinderscape.org/webfonts/fa-regular-400.eot);
+
    src: url(https://www.grinderscape.org/webfonts/fa-regular-400.eot?#iefix) format("embedded-opentype"), url(https://www.grinderscape.org/webfonts/fa-regular-400.woff2) format("woff2"), url(https://www.grinderscape.org/webfonts/fa-regular-400.woff) format("woff"), url(https://www.grinderscape.org/webfonts/fa-regular-400.ttf) format("truetype"), url(https://www.grinderscape.org/webfonts/fa-regular-400.svg#fontawesome) format("svg")
+
}
+
 
+
.fab,
+
.far {
+
    font-weight: 400
+
}
+
 
+
@font-face {
+
    font-family: "Font Awesome 5 Free";
+
    font-style: normal;
+
    font-weight: 900;
+
    font-display: block;
+
    src: url(https://www.grinderscape.org/webfonts/fa-solid-900.eot);
+
    src: url(https://www.grinderscape.org/webfonts/fa-solid-900.eot?#iefix) format("embedded-opentype"), url(https://www.grinderscape.org/webfonts/fa-solid-900.woff2) format("woff2"), url(https://www.grinderscape.org/webfonts/fa-solid-900.woff) format("woff"), url(https://www.grinderscape.org/webfonts/fa-solid-900.ttf) format("truetype"), url(https://www.grinderscape.org/webfonts/fa-solid-900.svg#fontawesome) format("svg")
+
}
+
 
+
.fa,
+
.far,
+
.fas {
+
    font-family: "Font Awesome 5 Free"
+
}
+
 
+
.fa,
+
.fas {
+
    font-weight: 900
+
}
+
 
+
 
+
 
+
/* MOBILE */
+
@media(max-width:1024px) {
+
    .mobile-menu {
+
        width: 40px;
+
        height: 38px;
+
        position: relative;
+
        float: right;
+
        -webkit-transform: rotate(0deg);
+
        -moz-transform: rotate(0deg);
+
        -o-transform: rotate(0deg);
+
        transform: rotate(0deg);
+
        -webkit-transition: .5s ease-in-out;
+
        -moz-transition: .5s ease-in-out;
+
        -o-transition: .5s ease-in-out;
+
        transition: .5s ease-in-out;
+
        cursor: pointer;
+
        overflow: hidden
+
    }
+
 
+
    .mobile-menu span {
+
        display: block;
+
        position: absolute;
+
        height: 5px;
+
        width: 100%;
+
        background: #fff;
+
        border-radius: 9px;
+
        opacity: 1;
+
        left: 0;
+
        -webkit-transform: rotate(0deg);
+
        -moz-transform: rotate(0deg);
+
        -o-transform: rotate(0deg);
+
        transform: rotate(0deg);
+
        -webkit-transition: .25s ease-in-out;
+
        -moz-transition: .25s ease-in-out;
+
        -o-transition: .25s ease-in-out;
+
        transition: .25s ease-in-out
+
    }
+
 
+
    .mobile-menu span:nth-child(1) {
+
        top: 0
+
    }
+
 
+
    .mobile-menu span:nth-child(2) {
+
        top: 11px
+
    }
+
 
+
    .mobile-menu span:nth-child(3) {
+
        top: 22px
+
    }
+
 
+
    .mobile-menu.open span:nth-child(1) {
+
        top: 18px;
+
        -webkit-transform: rotate(135deg);
+
        -moz-transform: rotate(135deg);
+
        -o-transform: rotate(135deg);
+
        transform: rotate(135deg)
+
    }
+
 
+
    .mobile-menu.open span:nth-child(2) {
+
        opacity: 0;
+
        left: -60px
+
    }
+
 
+
    .mobile-menu.open span:nth-child(3) {
+
        top: 18px;
+
        -webkit-transform: rotate(-135deg);
+
        -moz-transform: rotate(-135deg);
+
        -o-transform: rotate(-135deg);
+
        transform: rotate(-135deg)
+
    }
+
 
+
    ul.main-menu {
+
        display: none
+
    }
+
 
+
    .header-bottm .main-nav {
+
        flex-flow: column
+
    }
+
 
+
    .header-bottm .container {
+
        position: relative
+
    }
+
 
+
    .header-bottm .main-nav {
+
        opacity: 0
+
    }
+
 
+
    .header-bottm .main-nav {
+
        position: absolute;
+
        z-index: 999;
+
        width: 100%;
+
        top: 42px;
+
        left: -100%;
+
        -webkit-transition: all .4s ease-in-out;
+
        -o-transition: all .4s ease-in-out;
+
        transition: all .4s ease-in-out;
+
        -moz-transition: all .4s ease-in-out;
+
        -ms-transition: all .4s ease-in-out
+
    }
+
 
+
    .header-bottm .main-nav.side-open {
+
        left: 0;
+
        display: block;
+
        opacity: 1;
+
        height: 100vh;
+
        background: #5a2f02;
+
        z-index: 999;
+
        margin-top: 1em;
+
    }
+
 
+
    .header-bottm .container .mobile-menu {
+
        position: absolute;
+
        right: 0
+
    }
+
 
+
    .header-bottm ul li::after {
+
        content: '';
+
        background: 0 0;
+
        width: 0;
+
        height: 0;
+
        right: 0
+
    }
+
 
+
    .header-bottm .main-nav li {
+
        margin-right: 0;
+
        display:block;
+
    }
+
 
+
    .header-bottm .main-nav li:nth-child(4) {
+
        margin-right: 0
+
    }
+
 
+
    .header-bottm ul li a {
+
        padding: 1em;
+
        display: block;
+
        text-align: center;
+
        background-color: #5a2f02;
+
        border-bottom: 1px solid #222;
+
        font-size: 1.5em;
+
    }
+
 
+
    .header-bottm {
+
        padding: 10px 0;
+
        min-height: 50px
+
    }
+
 
+
    .middle-bx-middle .img-wrp {
+
        padding-bottom: 30px;
+
        max-width: 70%;
+
        margin: auto
+
    }
+
 
+
    .container {
+
        max-width: 96%
+
    }
+
 
+
   
+
}
+
 
+
/* END MOBILE */
+
 
+
/* END NEW DESIGN CSS */
+
 
+
 
+
 
+
 
+
 
+
div#mw-page-base {
+
    background: #151515 url(https://www.grinderscape.org/assets/images/background.png);
+
    position: fixed;
+
    height: 100%;
+
    width: 100%;
+
    z-index: 9999;
+
}
+
 
+
div#mw-head-base {
+
    position: fixed;
+
    left: 50%;
+
    top: 50%;
+
    z-index: 9999;
+
    margin: -75px 0 0 -75px;
+
    border: 16px solid rgba(0, 0, 0, 0.1);
+
    box-shadow: 0 0 5px rgba(0, 0, 0, 0.7), inset 0 0 5px rgba(0, 0, 0, 0.7);
+
    border-radius: 50%;
+
    border-top: 16px solid #627924;
+
    width: 120px;
+
    height: 120px;
+
    -webkit-animation: spin 2s linear infinite;
+
    animation: spin 2s linear infinite;
+
}
+
 
+
@-webkit-keyframes spin {
+
    0% {
+
        -webkit-transform: rotate(0deg);
+
    }
+
 
+
    100% {
+
        -webkit-transform: rotate(360deg);
+
    }
+
}
+
 
+
@keyframes spin {
+
    0% {
+
        transform: rotate(0deg);
+
    }
+
 
+
    100% {
+
        transform: rotate(360deg);
+
    }
+
}
+
 
+
 
+
 
+
 
+
 
+
 
+
 
+
 
+
 
+
 
+
 
+
 
+
 
+
 
+
 
+
 
+
 
+
 
+
 
+
/* Specific Pages */
+
 
+
form#editform {
+
    border: 1px solid rgba(0, 0, 0, 0.3);
+
}
+
 
+
div#toolbar {
+
    padding: 10px 5px;
+
    background: #5c3219;
+
    border-bottom: 1px solid #161b20;
+
    line-height: 0;
+
}
+
 
+
div#toolbar>div {
+
    width: 20px;
+
    height: 20px;
+
    display: inline-block;
+
    vertical-align: middle;
+
    cursor: pointer;
+
    margin: 0 5px;
+
}
+
 
+
div#mw-editbutton-bold,
+
div#mw-editbutton-italic,
+
div#mw-editbutton-headline,
+
div#mw-editbutton-nowiki {
+
    display: none !important;
+
}
+
 
+
div#mw-editbutton-link {
+
    background: url(https://i.imgur.com/Wrs4VMn.png);
+
}
+
 
+
div#mw-editbutton-extlink {
+
    background: url(https://i.imgur.com/HKLvTBX.png);
+
}
+
 
+
div#mw-editbutton-hr {
+
    background: url(https://i.imgur.com/J9is2iW.png);
+
}
+
 
+
textarea#wpTextbox1 {
+
    resize: vertical;
+
    outline: none;
+
    background: rgba(0, 0, 0, 0.1);
+
    font-family: monospace;
+
    line-height: 16px;
+
    font-size: 12px;
+
    border: none;
+
    padding: 10px;
+
}
+
 
+
.editOptions {
+
    border: none;
+
    padding: 10px 5px;
+
    margin: 0;
+
    border-top: 1px solid rgba(0, 0, 0, 0.1);
+
    background: rgba(0, 0, 0, 0.2);
+
}
+
 
+
.editButtons {
+
    display: flex;
+
}
+
 
+
span.cancelLink {
+
    margin: 0;
+
    display: flex;
+
}
+
 
+
div.editButtons input[type="submit"],
+
div.editButtons span a {
+
    margin: 0 5px;
+
}
+
 
+
.mw-editTools,
+
.templatesUsed,
+
.hiddencats,
+
.limitreport,
+
span.editHelp,
+
span.mw-editButtons-pipe-separator {
+
    display: none;
+
}
+
 
+
ul#index {
+
    margin-left: 0;
+
}
+
 
+
ul#index li {
+
    display: flex;
+
}
+
 
+
ul#index li:not(:last-child) {
+
    padding-bottom: 10px;
+
    border-bottom: 1px solid rgba(0, 0, 0, 0.1);
+
    margin-bottom: 10px;
+
}
+
 
+
div.img {
+
    width: 40px;
+
    height: 40px;
+
    margin-right: 10px;
+
    display: flex;
+
    justify-content: center;
+
    align-items: center;
+
}
+
 
+
ul#index li div.img img {
+
    max-height: 40px;
+
    max-width: 40px;
+
}
+
 
+
 
+
 
+
 
+
 
+
 
+
 
+
 
+
 
+
 
+
 
+
 
+
 
+
 
+
 
+
 
+
 
+
 
+
 
+
 
+
 
+
 
+
 
+
/* General */
+
 
+
body,
+
div#mw-panel div.portal div.body ul li a,
+
div#simpleSearch #searchButton,
+
div#simpleSearch #searchInput,
+
div#siteNotice,
+
.mw-body p,
+
table,
+
.mw-body-content,
+
#contentSub,
+
#contentSub2,
+
#p-personal ul li,
+
nav ul li,
+
input#database_input {
+
    font-size: 12px;
+
    line-height: 20px;
+
}
+
 
+
div#mw-panel div.portal div.body ul li a:hover,
+
span.subpages a:hover,
+
div.vectorTabs ul li.selected a,
+
div.vectorTabs ul li a:hover,
+
th,
+
span.cancelLink a:hover {
+
    color: #593018 !important;
+
}
+
 
+
.mw-body h1,
+
.mw-body h2,
+
.mw-body h3,
+
.mw-body h4,
+
.mw-body h5,
+
.mw-body h6 {
+
    font-family: Open Sans, sans-serif !important;
+
    color: #afafaf;
+
    line-height: 20px;
+
    font-weight: normal !important;
+
    margin: 30px 0 !important;
+
    font-size: 13px;
+
}
+
 
+
.mw-body img {
+
    max-width: 100%;
+
}
+
 
+
.mw-body p,
+
p {
+
    margin: 30px 0;
+
    line-height: 20px;
+
}
+
 
+
.mw-body h1 {
+
    border-bottom: 1px solid #161b20;
+
    padding-bottom: 10px;
+
}
+
 
+
.mw-body h2 {
+
    border-bottom: none;
+
}
+
 
+
span.mw-editsection {
+
    display: none;
+
}
+
 
+
table {
+
    margin: 30px 0 !important;
+
    background: rgba(0, 0, 0, 0.2) !important;
+
    border-collapse: collapse;
+
}
+
 
+
td,
+
th {
+
    padding: 10px !important;
+
    border: 1px solid #161b20 !important;
+
}
+
 
+
th {
+
    background: #1f272f !important;
+
    font-weight: normal;
+
    text-align: left !important;
+
}
+
 
+
.mw-body pre {
+
    background-color: rgba(0, 0, 0, 0.1);
+
    line-height: 16px;
+
    border: 1px solid rgba(0, 0, 0, 0.1);
+
    padding: 10px;
+
    margin: 30px 0;
+
}
+
 
+
hr {
+
    background-color: #161b20;
+
    margin: 30px 0;
+
}
+
 
+
.mw-body .external {
+
    padding: 0;
+
    background: none;
+
}
+
 
+
.mw-body ul {
+
    margin: 30px 0px 30px 10px;
+
    list-style-position: inside;
+
    list-style-image: none;
+
}
+
 
+
.mw-body ul li {
+
    margin: 0;
+
}
+
 
+
.mw-body ul li ul {
+
    margin: 10px 0 10px 30px;
+
}
+
 
+
div#customFooter {
+
    background: #5C3219 !important;
+
    color: #bca674 !important;
+
}
+
 
+
div#mw-head a {
+
    color: #bca674 !important;
+
}
+
 
+
div#customFooter p {
+
    color: #bca674 !important;
+
}
+
 
+
div#customFooter a {
+
    color: #fff !important;
+
}
+
 
+
fieldset {
+
    border: 1px solid rgba(0, 0, 0, 0.2) !important;
+
}
+
 
+
.mw-changeslist-legend {
+
    border: 1px solid #97855d !important;
+
}
+
 
+
input[type="submit"],
+
input[type="checkbox"],
+
select {
+
    background: #5c3219;
+
    border-color: #5c3219;
+
}
+
 
+
::-webkit-input-placeholder {
+
    color: #717171;
+
}
+
 
+
:-moz-placeholder {
+
    color: #717171;
+
}
+
 
+
::-moz-placeholder {
+
    color: #717171;
+
}
+
 
+
:-ms-input-placeholder {
+
    color: #717171;
+
}
+
 
+
 
+
/* 28-12-2016 */
+
/* nav ul li {
+
    display: inline-block !important;
+
    padding: 10px 0 !important;
+
}
+
 
+
nav ul li a:hover {
+
    color: #fff !important;
+
} */
+
 
+
#mw-watchlist-resetbutton>input {
+
    color: #afafaf !important;
+
}
+
 
+
#mw-watchlist-options input {
+
    color: #afafaf !important;
+
}
+
 
+
.namespaceselector {
+
    color: #afafaf !important;
+
}
+
 
+
.mw-submit {
+
    color: #afafaf !important;
+
}
+
 
+
.namespaceselector {
+
    margin-left: 5px !important;
+
}
+
 
+
.mw-month-selector {
+
    color: #fdfdfd !important;
+
}
+
 
+
#index li {
+
    list-style: none !important;
+
}
+
 
+
.sicon1 {
+
    background: url(https://i.imgur.com/DeOQfOs.png) no-repeat center, linear-gradient(transparent, rgba(0, 0, 0, 0.15)), #3a589e !important;
+
 
+
}
+
 
+
#customFooter>div>a:nth-child(1) {
+
    background: url(https://i.imgur.com/DeOQfOs.png) no-repeat center !important;
+
    background-color: #3a589e !important;
+
    color: #fff !important;
+
}
+
 
+
#customFooter>div>a:nth-child(2) {
+
    background: url("https://i.imgur.com/GZzo3yV.png") no-repeat center !important;
+
    background-color: #3a89c4 !important;
+
    color: #fff !important;
+
}
+
 
+
#customFooter>div>a:nth-child(3) {
+
    background: url("https://i.imgur.com/wF3Xf61.png") no-repeat center !important;
+
    background-color: #c8312b !important;
+
    color: #fff !important;
+
}
+
 
+
.mw-headline {
+
    color: #272525 !important;
+
}
+
 
+
#mw-history-search>input {
+
    color: #999 !important;
+
}
+
 
+
.historysubmit.mw-history-compareselectedversions-button {
+
    color: #fdfdfd !important;
+
}
+
 
+
#toc,
+
.toc,
+
.mw-warning,
+
.toccolours {
+
    background: rgba(254, 254, 254, 0.2) none repeat scroll 0 0 !important;
+
    border: medium none !important;
+
}
+
 
+
.diff-currentversion-title {
+
    color: #222 !important;
+
}
+
 
+
#toctitle>h2 {
+
    color: #222;
+
}
+
 
+
td.diff-context {
+
    background: rgba(254, 254, 254, 0.3) !important;
+
 
+
}
+
 
+
td.diff-addedline .diffchange {
+
    background: rgba(237, 237, 237, 0.5) !important;
+
}
+
 
+
#pagehistory li.selected {
+
    background-color: rgba(254, 254, 254, 0.5) !important;
+
    border: 1px dashed #272525 !important;
+
    padding: 5px !important;
+
}
+
 
+
#pagehistory li {
+
    border: 1px solid #222 !important;
+
    padding: 5px !important;
+
}
+
 
+
.results-info {
+
    color: #222 !important;
+
}
+
 
+
.mw-ui-input {
+
    background: rgba(254, 254, 254, 0.3) none repeat scroll 0 0 !important;
+
    border: medium none !important;
+
    padding: 6px !important;
+
}
+
 
+
#mw-searchoptions {
+
    background: rgba(254, 254, 254, 0.3) none repeat scroll 0 0 !important;
+
}
+
 
+
#mw-searchoptions h4 {
+
    color: #222 !important;
+
}
+
 
+
.ipsDataItem,
+
.ipsDataList.ipsDataList_zebra>.ipsDataItem {
+
    border: none !important;
+
}
+
 
+
.wikitable th {
+
    color: #fff !important;
+
}
+
 
+
.ipsPad_half {
+
    text-align: center !important;
+
}
+
 
+
#mw-history-search>input {
+
    background: rgba(254, 254, 254, 0.2) none repeat scroll 0 0 !important;
+
    color: #272525 !important;
+
}
+
 
+
.mw-search-profile-tabs {
+
    background-color: rgba(254, 254, 254, 0.2) !important;
+
    border: none !important;
+
}
+
 
+
.highlight-hover {
+
    background-color: #b39f71;
+
}
+
 
+
.highlight {
+
    font-weight: normal;
+
}
+
 
+
/*HOMEPAGE*/
+
.tile-half {
+
    flex: 1;
+
    margin-right: 9px;
+
}
+
 
+
.tile-top {
+
    display: flex;
+
    align-items: center;
+
    background-color: #5C6168;
+
    overflow: hidden;
+
    padding: 0;
+
    height: 13vw;
+
    max-height: 12em;
+
    transition: 0.4s ease-out;
+
}
+
 
+
.tile-bottom {
+
    background-color: #ECE6D8;
+
    padding: 12px 10px;
+
    border-bottom-right-radius: 5px;
+
    border-bottom-left-radius: 5px;
+
    align-self: end;
+
    min-height: 5vw;
+
}
+
 
+
.tile-date {
+
    margin: 0 !important;
+
    font-size: 0.8em !important;
+
    color: #999 !important !important;
+
    line-height: 14px !important;
+
 
+
}
+
 
+
.tile-title {
+
    margin-bottom: 5px;
+
    font-size: 1.4em;
+
    color: #272525;
+
}
+
 
+
.tile-info {
+
    line-height: 1.4em;
+
    color: #272525;
+
}
+
 
+
.click-to-view {
+
    font-size: 0.85em;
+
    color: #e01818;
+
}
+
 
+
.tile-half:hover>.tile-bottom {
+
    background-color: #e8dcbe;
+
}
+
 
+
/* 28-12-2016 */
+
 
+
 
+
 
+
 
+
/* 28-12-2016 responsive layout */
+
@media screen and (max-width:991px) {
+
    #content-sidebar-wrap>div {
+
        width: 100% !important;
+
        display: block !important;
+
        padding: 0 !important;
+
    }
+
 
+
    div#content-sidebar-wrap {
+
         display: block !important;
+
    }
+
}
+
 
+
@media screen and (max-width:767px) {
+
    #content-sidebar-wrap {
+
        display: block !important;
+
    }
+
 
+
    div#mw-panel {
+
        padding: 0 !important;
+
        width: 100% !important;
+
        display: block !important;
+
    }
+
 
+
    .mw-contributions-form {
+
        overflow: auto;
+
        width: 100% !important;
+
    }
+
 
+
    #mw-history-search {
+
        line-height: 30px !important;
+
    }
+
 
+
    .ipsDataItem,
+
    .ipsDataList.ipsDataList_zebra>.ipsDataItem {
+
        border-top: none !important;
+
        border-bottom: none !important;
+
    }
+
}
+
 
+
@media screen and (max-width:450px) {
+
     div#right-navigation {
+
        margin-top: 40px;
+
        position: static;
+
        display: block !important;
+
    }
+
}
+
 
+
/* 28-12-2016 responsive layout */
+

Revision as of 09:00, 15 November 2020

<div style='padding:10px 0;text-align:center;background-color:#ECE6D8;color:#000;'>Wiki design is currently under construction. Wiki content is still available to browse.</div>
<header>
    <div class='entire-header'>
        <div class='header-top'>
            <div class='container dFlx'>
                <ul class='play-link'>
                    <li><a itemprop='url' href='https://www.facebook.com/Grinderscape.org'><i class='fab fa-facebook-square'></i></a></li>
                    <li><a itemprop='url' href='https://www.youtube.com/user/dokenfilm/feed'><i class='fab fa-youtube'></i></a></li>
                    <li><a itemprop='url' href='https://discord.gg/b46xx5u'><i class='fab fa-discord'></i></a></li>
                </ul>
                <div class='logo'>
                    <a itemprop='url' href='https://www.grinderscape.org/home'><img src='https://www.grinderscape.org/images/grinderscape-logo.png' alt='GrinderScape'></a>
                </div>
                <div class='mobile-logo'>
                    <a itemprop='url' href='https://www.grinderscape.org/home'><img src='https://www.grinderscape.org/images/grinderscape-logo-mobile.png' alt='GrinderScape'></a>
                </div>
                <ul class='login'>
                    <li id='n-Log-in'><a href='/Special:UserLogin' data-toggle='modal' data-target='#myModal-user'>Wiki Login</a></li>
                </ul>
            </div>
        </div>
        <div class='header-bottm'>
            <div class='container'>
                <div class='mobile-menu'>
                    <span></span>
                    <span></span>
                    <span></span>
                </div>
                <ul class='main-nav'>
                    <li><a itemprop='url' href='https://www.grinderscape.org'>HOME</a></li>
                    <li><a itemprop='url' href='http://forum.grinderscape.org/'>FORUM</a></li>
                    <li><a itemprop='url' href='https://www.grinderscape.org/store'>STORE</a></li>
                    <li><a itemprop='url' href='https://www.grinderscape.org/download'>DOWNLOAD</a></li>
                    <li><a href='javascript:void(0);' data-toggle='modal' data-target='#myModal-vote'>VOTE</a></li>
                    <li><a itemprop='url' href='https://www.grinderscape.org/highscores'>HIGHSCORES</a></li>
                    <li class='acitve'><a itemprop='url' href='http://wiki.grinderscape.org/'>WIKI</a></li>
                    <li><a itemprop='url' href='https://www.grinderscape.org/contact'>CONTACT</a></li>
                    <li>
                        <ul class='mobile-mw-navigation'>
                        </ul>
                    </li>
                </ul>
            </div>
        </div>
    </div>
</header>