/*! normalize.css v3.0.3 | MIT License | github.com/necolas/normalize.css */
img,legend{border:0}legend,td,th{padding:0}html{font-family:sans-serif;-ms-text-size-adjust:100%;-webkit-text-size-adjust:100%}body{margin:0}article,aside,details,figcaption,figure,footer,header,hgroup,main,menu,nav,section,summary{display:block}audio,canvas,progress,video{display:inline-block;vertical-align:baseline}audio:not([controls]){display:none;height:0}[hidden],template{display:none}a{background-color:transparent}a:active,a:hover{outline:0}abbr[title]{border-bottom:1px dotted}b,optgroup,strong{font-weight:700}dfn{font-style:italic}h1{font-size:2em;margin:.67em 0}mark{background:#ff0;color:#000}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sup{top:-.5em}sub{bottom:-.25em}svg:not(:root){overflow:hidden}figure{margin:1em 40px}hr{box-sizing:content-box;height:0}pre,textarea{overflow:auto}code,kbd,pre,samp{font-family:monospace,monospace;font-size:1em}button,input,optgroup,select,textarea{color:inherit;font:inherit;margin:0}button{overflow:visible}button,select{text-transform:none}button,html input[type=button],input[type=reset],input[type=submit]{-webkit-appearance:button;cursor:pointer}button[disabled],html input[disabled]{cursor:default}button::-moz-focus-inner,input::-moz-focus-inner{border:0;padding:0}input{line-height:normal}input[type=checkbox],input[type=radio]{box-sizing:border-box;padding:0}input[type=number]::-webkit-inner-spin-button,input[type=number]::-webkit-outer-spin-button{height:auto}input[type=search]{-webkit-appearance:textfield;box-sizing:content-box}input[type=search]::-webkit-search-cancel-button,input[type=search]::-webkit-search-decoration{-webkit-appearance:none}fieldset{border:1px solid silver;margin:0 2px;padding:.35em .625em .75em}table{border-collapse:collapse;border-spacing:0}

/*
* Based on Skeleton V2.0.4 | www.getskeleton.com
* Copyright 2014, Dave Gamache
* Free to use under the MIT license, http://www.opensource.org/licenses/mit-license.php
*/

/* Table of contents
––––––––––––––––––––––––––––––––––––––––––––––––––
- navigation bar
- Grid
- Base Styles
- Typography
- Links
- Buttons
- Forms
- Lists
- Code
- Tables
- Spacing
- Clearing
- Media Queries
- misc
- tastybot commands
- userlist
- events
- rules/faq
*/

/* navigation bar
–––––––––––––––––––––––––––––––––––––––––––––––––– */
#navbar {
    list-style: none;
    font-weight: 600;
    line-height: 4rem;
    border-bottom: 1px solid #eee;
    letter-spacing: .1rem;
}

#navbar li {
    display: inline-block;
    margin: 0 18px;
}

#navbar li a {
    text-decoration: none;
    color:#222;
}

#navbar li a:hover {
    color:#0FA0CE;
}

#navbar li.home {
    font-size: 1.7rem;
}

@media (max-width: 700px) {
    #navbar li.home {
        display:block;
    }
}

@media (min-width: 750px) {
    #navbar li.home {
        font-size: 1.5rem;
        margin: auto 50px;
    }
}

/* Grid
–––––––––––––––––––––––––––––––––––––––––––––––––– */
.container {
    position: relative;
    width: 100%;
    max-width: 960px;
    margin: 0 auto;
    padding: 0 20px;
    box-sizing: border-box;
}

.column,
.columns {
    width: 100%;
    float: left;
    box-sizing: border-box;
}

/* For devices larger than 400px */
@media (min-width: 400px) {
    .container {
        width: 85%;
        padding: 0;
    }
}



/* For devices larger than 550px */
@media (min-width: 550px) {
    .container {
        width: 80%;
    }

    .column,
    .columns {
        margin-left: 4%;
    }

    .column:first-child,
    .columns:first-child {
        margin-left: 0;
    }

    .one.column,
    .one.columns {
        width: 4.66666666667%;
    }

    .two.columns {
        width: 13.3333333333%;
    }

    .three.columns {
        width: 22%;
    }

    .four.columns {
        width: 30.6666666667%;
    }

    .five.columns {
        width: 39.3333333333%;
    }

    .six.columns {
        width: 48%;
    }

    .seven.columns {
        width: 56.6666666667%;
    }

    .eight.columns {
        width: 65.3333333333%;
    }

    .nine.columns {
        width: 74.0%;
    }

    .ten.columns {
        width: 82.6666666667%;
    }

    .eleven.columns {
        width: 91.3333333333%;
    }

    .twelve.columns {
        width: 100%;
        margin-left: 0;
    }

    .one-third.column {
        width: 30.6666666667%;
    }

    .two-thirds.column {
        width: 65.3333333333%;
    }

    .one-half.column {
        width: 48%;
    }

    /* Offsets */
    .offset-by-one.column,
    .offset-by-one.columns {
        margin-left: 8.66666666667%;
    }

    .offset-by-two.column,
    .offset-by-two.columns {
        margin-left: 17.3333333333%;
    }

    .offset-by-three.column,
    .offset-by-three.columns {
        margin-left: 26%;
    }

    .offset-by-four.column,
    .offset-by-four.columns {
        margin-left: 34.6666666667%;
    }

    .offset-by-five.column,
    .offset-by-five.columns {
        margin-left: 43.3333333333%;
    }

    .offset-by-six.column,
    .offset-by-six.columns {
        margin-left: 52%;
    }

    .offset-by-seven.column,
    .offset-by-seven.columns {
        margin-left: 60.6666666667%;
    }

    .offset-by-eight.column,
    .offset-by-eight.columns {
        margin-left: 69.3333333333%;
    }

    .offset-by-nine.column,
    .offset-by-nine.columns {
        margin-left: 78.0%;
    }

    .offset-by-ten.column,
    .offset-by-ten.columns {
        margin-left: 86.6666666667%;
    }

    .offset-by-eleven.column,
    .offset-by-eleven.columns {
        margin-left: 95.3333333333%;
    }

    .offset-by-one-third.column,
    .offset-by-one-third.columns {
        margin-left: 34.6666666667%;
    }

    .offset-by-two-thirds.column,
    .offset-by-two-thirds.columns {
        margin-left: 69.3333333333%;
    }

    .offset-by-one-half.column,
    .offset-by-one-half.columns {
        margin-left: 52%;
    }

}

/* Base Styles
–––––––––––––––––––––––––––––––––––––––––––––––––– */
/* NOTE
html is set to 62.5% so that all the REM measurements throughout Skeleton
are based on 10px sizing. So basically 1.5rem = 15px :) */
html {
    font-size: 62.5%;
    overflow-y: scroll;
}

body {
    font-size: 1.5em;
    line-height: 1.6;
    font-weight: 400;
    font-family: "Raleway", "HelveticaNeue", "Helvetica Neue", Helvetica, Arial, sans-serif;
    color: #222;
}

/* Typography
–––––––––––––––––––––––––––––––––––––––––––––––––– */
h1, h2, h3, h4, h5, h6 {
    margin-top: 0;
    margin-bottom: 2rem;
    font-weight: 300;
}

h1 {
    font-size: 4.0rem;
    line-height: 1.2;
    letter-spacing: -.1rem;
}

h2 {
    font-size: 3.6rem;
    line-height: 1.25;
    letter-spacing: -.1rem;
}

h3 {
    font-size: 3.0rem;
    line-height: 1.3;
    letter-spacing: -.1rem;
}

h4 {
    font-size: 2.4rem;
    line-height: 1.35;
    letter-spacing: -.08rem;
}

h5 {
    font-size: 1.8rem;
    line-height: 1.5;
    letter-spacing: -.05rem;
}

h6 {
    font-size: 1.5rem;
    line-height: 1.6;
    letter-spacing: 0;
}

/* Larger than phablet */
@media (min-width: 550px) {
    h1 {
        font-size: 5.0rem;
    }

    h2 {
        font-size: 4.2rem;
    }

    h3 {
        font-size: 3.6rem;
    }

    h4 {
        font-size: 3.0rem;
    }

    h5 {
        font-size: 2.4rem;
    }

    h6 {
        font-size: 1.5rem;
    }
}

p {
    margin-top: 0;
}

/* Links
–––––––––––––––––––––––––––––––––––––––––––––––––– */
a {
    color: #1EAEDB;
}

a:hover {
    color: #0FA0CE;
}

/* Buttons
–––––––––––––––––––––––––––––––––––––––––––––––––– */
.button,
button,
input[type="submit"],
input[type="reset"],
input[type="button"] {
    display: inline-block;
    height: 38px;
    padding: 0 30px;
    color: #555;
    text-align: center;
    font-size: 11px;
    font-weight: 600;
    line-height: 38px;
    letter-spacing: .1rem;
    text-transform: uppercase;
    text-decoration: none;
    white-space: nowrap;
    background-color: transparent;
    border-radius: 4px;
    border: 1px solid #bbb;
    cursor: pointer;
    box-sizing: border-box;
}

.button:hover,
button:hover,
input[type="submit"]:hover,
input[type="reset"]:hover,
input[type="button"]:hover,
.button:focus,
button:focus,
input[type="submit"]:focus,
input[type="reset"]:focus,
input[type="button"]:focus {
    color: #333;
    border-color: #888;
    outline: 0;
}

.button.button-primary,
button.button-primary,
input[type="submit"].button-primary,
input[type="reset"].button-primary,
input[type="button"].button-primary {
    color: #FFF;
    background-color: #33C3F0;
    border-color: #33C3F0;
}

.button.button-primary:hover,
button.button-primary:hover,
input[type="submit"].button-primary:hover,
input[type="reset"].button-primary:hover,
input[type="button"].button-primary:hover,
.button.button-primary:focus,
button.button-primary:focus,
input[type="submit"].button-primary:focus,
input[type="reset"].button-primary:focus,
input[type="button"].button-primary:focus {
    color: #FFF;
    background-color: #1EAEDB;
    border-color: #1EAEDB;
}

/* Forms
–––––––––––––––––––––––––––––––––––––––––––––––––– */
input[type="email"],
input[type="number"],
input[type="search"],
input[type="text"],
input[type="tel"],
input[type="url"],
input[type="password"],
textarea,
select {
    height: 38px;
    padding: 6px 10px; /* The 6px vertically centers text on FF, ignored by Webkit */
    background-color: #fff;
    border: 1px solid #D1D1D1;
    border-radius: 4px;
    box-shadow: none;
    box-sizing: border-box;
}

/* Removes awkward default styles on some inputs for iOS */
input[type="email"],
input[type="number"],
input[type="search"],
input[type="text"],
input[type="tel"],
input[type="url"],
input[type="password"],
textarea {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
}

textarea {
    min-height: 65px;
    padding-top: 6px;
    padding-bottom: 6px;
}

input[type="email"]:focus,
input[type="number"]:focus,
input[type="search"]:focus,
input[type="text"]:focus,
input[type="tel"]:focus,
input[type="url"]:focus,
input[type="password"]:focus,
textarea:focus,
select:focus {
    border: 1px solid #33C3F0;
    outline: 0;
}

label,
legend {
    display: block;
    margin-bottom: .5rem;
    font-weight: 600;
}

fieldset {
    padding: 0;
    border-width: 0;
}

input[type="checkbox"],
input[type="radio"] {
    display: inline;
}

label > .label-body {
    display: inline-block;
    margin-left: .5rem;
    font-weight: normal;
}

/* Lists
–––––––––––––––––––––––––––––––––––––––––––––––––– */
ul {
    list-style: circle inside;
}

ol {
    list-style: decimal inside;
}

ol, ul {
    padding-left: 0;
    margin-top: 0;
}

ul ul,
ul ol,
ol ol,
ol ul {
    margin: 1.5rem 0 1.5rem 3rem;
    font-size: 90%;
}

li {
    margin-bottom: 1rem;
}

/* Code
–––––––––––––––––––––––––––––––––––––––––––––––––– */
code {
    padding: .2rem .5rem;
    margin: 0 .2rem;
    font-size: 90%;
    white-space: nowrap;
    background: #F1F1F1;
    border: 1px solid #E1E1E1;
    border-radius: 4px;
}

pre > code {
    display: block;
    padding: 1rem 1.5rem;
    white-space: pre;
}

/* Tables
–––––––––––––––––––––––––––––––––––––––––––––––––– */
th,
td {
    padding: 12px 15px;
    text-align: left;
    border-bottom: 1px solid #E1E1E1;
}

th:first-child,
td:first-child {
    padding-left: 0;
}

th:last-child,
td:last-child {
    padding-right: 0;
}

/* Spacing
–––––––––––––––––––––––––––––––––––––––––––––––––– */
button,
.button {
    margin-bottom: 1rem;
}

input,
textarea,
select,
fieldset {
    margin-bottom: 1.5rem;
}

pre,
blockquote,
dl,
figure,
table,
p,
ul,
ol,
form {
    margin-bottom: 2.5rem;
}

/* Utilities
–––––––––––––––––––––––––––––––––––––––––––––––––– */
.u-full-width {
    width: 100%;
    box-sizing: border-box;
}

.u-max-full-width {
    max-width: 100%;
    box-sizing: border-box;
}

.u-pull-right {
    float: right;
}

.u-pull-left {
    float: left;
}

.u-center {
    text-align: center;
}

.u-bold {
    font-weight: 600;
}

/* Clearing
–––––––––––––––––––––––––––––––––––––––––––––––––– */

.container:after, .row:after, .u-cf {
    content: "";
    display: table;
    clear: both;
}

/* Media Queries
–––––––––––––––––––––––––––––––––––––––––––––––––– */
/*
Note: The best way to structure the use of media queries is to create the queries
near the relevant code. For example, if you wanted to change the styles for buttons
on small devices, paste the mobile query code up in the buttons section and style it
there.
*/

/* Larger than mobile */
@media (min-width: 400px) {
}

/* Larger than phablet (also point when grid becomes active) */
@media (min-width: 550px) {
}





/* Larger than Desktop HD */
@media (min-width: 1200px) {
}

/* misc
–––––––––––––––––––––––––––––––––––––––––––––––––– */
.noscript {
    display:none;
}
.jumbotron {
    margin-top: 3rem;
    text-align: center;
    margin-bottom: 5rem;
}

@media (min-width: 1025px) {
    .jumbotron {
        margin-top: 7rem;
    }
}

hr {
    margin-top: 3rem;
    margin-bottom: 3.5rem;
    border-width: 0;
    border-top: 1px solid #E1E1E1;
}

.social a {
    display:inline-block;
    margin:1rem;
    color:#222;
}

/* Social icons: inline SVGs sized to match the text and coloured like the nav links. */
.social svg {
    width:3.2rem;
    height:3.2rem;
    fill:currentColor;
    vertical-align:middle;
}

.social a:hover {
    color:#0FA0CE;
}

@media (max-width: 550px) {
    .news {
        border-bottom: 1px solid #eee;
        margin-bottom: 3rem;
    }

    /* A lone news block has nothing stacked below it, so it needs no divider. */
    .news.solo {
        border-bottom: none;
        margin-bottom: 0;
    }
}

/* News or events block shown without its partner: stop floating and centre it in the row. */
.column.solo {
    float: none;
    margin-left: auto;
    margin-right: auto;
}

.faq {
    border-bottom: 1px solid #eee;
    margin-bottom: 2rem;
}

.faq:last-child {
    border-bottom: none;
}

/* tastybot commands
–––––––––––––––––––––––––––––––––––––––––––––––––– */
.commands td {
    position: relative;
    overflow: hidden;
    overflow-wrap: break-word;
}

.commands td:nth-of-type(1) {
    min-width: 12rem
}

/* Command cell: bold command name, aliases on their own muted line below. */
.commands .command-name {
    font-weight: 600;
}

.commands .command-aliases {
    display: block;
    color: #777;
    font-size: 0.9em;
}

.commands td:nth-of-type(2) {
    max-width: 20rem
}

.commands td:nth-of-type(3) {
    max-width: 30rem
}

@media only screen and (max-width: 1000px),
(min-device-width: 768px) and (max-device-width: 1024px) {

    /* Force table to not be like tables anymore */
    .commands table, .commands thead, .commands tbody, .commands th, .commands td, .commands tr {
        display: block;
    }

    .commands table {
        border-collapse: collapse;
    }

    /* Hide table headers */
    .commands thead tr {
        position: absolute;
        top: -9999px;
        left: -9999px;
    }

    .commands td {
        border: none;
        border-bottom: 1px solid #eee;
        position: relative;
        padding-left: 10rem;
    }

    .commands td:last-child {
        border-bottom: 1px solid #bbb;
    }

    .commands td:nth-of-type(1), .commands td:nth-of-type(2), .commands td:nth-of-type(3) {
        max-width: none;
    }

    .commands th:first-child, td:first-child {
        padding-left: 10rem;
    }

    .commands td:before {
        /* act like table header */
        position: absolute;
        /* Top/left values mimic padding */
        left: 10px;
        width: 25%;
        padding-right: 10px;
        white-space: nowrap;
    }

    /* labels */
    .commands td:nth-of-type(1):before {
        content: "Command";
    }

    .commands td:nth-of-type(2):before {
        content: "Arguments";
    }

    .commands td:nth-of-type(3):before {
        content: "Description";
    }
}

/* userlist
–––––––––––––––––––––––––––––––––––––––––––––––––– */
#userlist img.face {
    width: 250px;
    height: 250px;
}

#userlist img.rdj-logo {
    max-width: 200px;
    background-color: #222;
}

#userlist .user{
    display:inline-block;
    margin-left: auto;
    margin-right: auto;
    text-decoration:none;
    color:inherit;
}

@media (max-width: 550px) {
    #userlist .user {
        margin-bottom:1rem;
        border-bottom:1px solid #ddd;
    }
}

/* events
–––––––––––––––––––––––––––––––––––––––––––––––––– */
.event {
    text-decoration: none;
    color:#222;
    padding-bottom: 0;
    width:100%
}

#all-events {
    margin-top: 2rem;
}

#event-logo {
    max-width:100%;
}

.event div {
    display:table-cell;
    vertical-align: middle;
}

.event p {
    font-size: 1.8rem;
    font-weight: 600;
    margin-bottom: 0;
}

.event-logo img {
    width: 100px;
    height: 100px;
}

/* rules/faq
–––––––––––––––––––––––––––––––––––––––––––––––––– */
#faq-list {
    border-bottom: 1px solid #eee;
    border-top: 1px solid #eee;
    padding:1rem 0;
}
#faq-list ul {
    display:inline-block;
    margin:0;
}
#faq-list ul li {
    list-style-type: none;
}


#faq-list li {
    display: inline-block;
    margin: 0 18px;
}

#faq-list li a {
    text-decoration: none;
    color:#222;
}

#faq-list li a:hover {
    color:#0FA0CE;
}