@CHARSET "UTF-8";

@import url('https://fonts.googleapis.com/css?family=Roboto');
body
{
    background-color: #2E302E;
    color: #343434;
    padding: 5em;
    font-family: Tahoma, Arial, Helvetica, Verdana, sans-serif;
    font-size: 100%;
}

#documentWrapper
{
    margin: 0 auto;
    background-color: #3E403E;
    padding: 5px;
    width: 800px;
}

#documentWrapper h1
{
    margin: 0;
    padding: 0.25em;
    background-color: #4C6F48;
    color: #EFEFEF;
    font-size: 2.25em;
    font-family: 'Roboto Condensed', sans-serif;
    font-weight: 700;
}

#documentWrapper h2
{
    margin: 0;
    padding: 0.25em;
    background-color: #4C6F48;
    color: #EFEFEF;
    font-size: 1.5em;
    font-family: 'Roboto Condensed', sans-serif;
    font-weight: 700;
}

.important
{
    display: block;
    padding: 0.5em;
    color: #dcba3f;
    margin: 0.5em 0.25em;
    border: 0.1em solid #ec4715;
    text-align: center;
}

a, a:visited {
    color: #da5d3f;
    font-weight: bold;
}

a:hover {
    color: #429335;
    text-decoration: none;
}

div.homelink {
    text-align: right;
    padding: 0.5em;
}

.content
{
    background-color: #F5F5F5;
    margin-top: 4px;
    padding: 0.5em;
}

.content li
{
    padding: 0.25em;
}

.content p
{
    padding: 0.25em;
}

.content p.description
{
    margin: 0 0.25em;
}

.content.center {
    display: flex;
    justify-content: center;
}

.content a.button {
    display: inline-block;
    font-size: 1.5em;
    font-weight: bold;
    border-radius: 8px;
    color: #ffffff;
    padding: 13px 32px;
    text-decoration: none;
}

.content a.button.link {
    box-shadow: 0px 10px 14px -7px #276873;
    background:linear-gradient(to bottom, #599bb3 5%, #408c99 100%);
    background-color: #599bb3;
    text-shadow: 0px 1px 0px #3d768a;
    margin: 1.25em auto;
}

.content a.button.link:hover {
    background:linear-gradient(to bottom, #408c99 5%, #599bb3 100%);
    background-color: #408c99;
    cursor: pointer;
}
.content a.button.link:active {
    position:relative;
    top:1px;
}

.content ul.commands {
    list-style-type: none;
    padding: 0;
}
.content ul.commands li {
    display: flex;
    align-items: baseline;
    margin-bottom: 0.5em;
}
.content ul.commands span.command {
    flex: 0 0 15em;
    margin-right: 1em;
    padding: 0.2em 0.5em;
    background-color: #2f322f;
    color: #F8F8F8;
    border-radius: 4px;
}

.content ul.ranks {
    list-style-type: none;
    padding: 0;
}
.content ul.ranks li {
    display: flex;
    align-items: baseline;
    margin-bottom: 0.5em;
}
.content ul.ranks span.rank {
    flex: 0 0 5em;
    margin-right: 1em;
    padding: 0.2em 0.5em;
    background-color: #263326;
    color: #F8F8F8;
    border-radius: 4px;
    text-align: center;
    font-weight: bold;
}
.content ul.ranks table th {
    padding-right: 0.75em;
    font-weight: normal;
}
.content ul.ranks table td {
    font-weight: bold;
}
span.special_rank {
    display: inline-block;
    background-color: #263326;
    color: #F8F8F8;
    padding: 0.2em;
    border-radius: 4px;
    text-align: center;
    font-weight: bold;
}

.footer
{
    font-size: 0.5em;
    text-align: center;
}