/*
* Skeleton V2.0.4
* Copyright 2015, Jack Heeney
*/


/* Table of contents
––––––––––––––––––––––––––––––––––––––––––––––––––
- Grid
- Base Styles
- Typography
- Links
- Buttons
- Forms
- Lists
- Code
- Tables
- Spacing
- Utilities
- Clearing
- Media Queries
*/


/* Grid
–––––––––––––––––––––––––––––––––––––––––––––––––– */
* {
    box-sizing: border-box;
}

.container {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 30px;
    box-sizing: content-box;
}

    .container.fixedWidth {
        width: 1080px;
    }

.column, .columns {
    float: left;
    *display: inline;
    margin: 0 1.3888888889%;
}

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

    .column.last, .columns.last {
        margin-right: 0 !important;
    }

/* Micro Clearfix on Row & Container */
.row:before,
.row:after,
.container:before,
.container:after {
    content: " ";
    /* 1 */
    display: table;
    /* 2 */
}

.row:after,
.container:after {
    clear: both;
}

.row,
.container {
    *zoom: 1;
}

.one.column {
    width: 5.5555555556%;
}

.two.columns {
    width: 13.8888888889%;
}

.three.columns {
    width: 22.2222222222%;
}

.four.columns {
    width: 30.5555555556%;
}

.five.columns {
    width: 38.8888888889%;
}

.six.columns {
    width: 47.2222222222%;
}

.seven.columns {
    width: 55.5555555556%;
}

.eight.columns {
    width: 63.8888888889%;
}

.nine.columns {
    width: 72.2222222222%;
}

.ten.columns {
    width: 80.5555555556%;
}

.eleven.columns {
    width: 88.8888888889%;
}

.twelve.columns {
    width: 97.2222222222%;
}

.quarter.column {
    width: 22.2222222222%;
}

.third.column {
    width: 30.5555555556%;
}

.half.column {
    width: 47.2222222222%;
}

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

.three-quarters.column {
    width: 72.2222222222%;
}

.centeredColumn {
    float: none;
    margin: 0 auto;
    text-align: center;
}

/*------------------------------
  Offsets
------------------------------*/
.offset-by-one {
    margin-left: 9.7222222222%;
}

.offset-by-two {
    margin-left: 18.0555555556%;
}

.offset-by-three {
    margin-left: 26.3888888889%;
}

.offset-by-four {
    margin-left: 34.7222222222%;
}

.offset-by-five {
    margin-left: 43.0555555556%;
}

.offset-by-six {
    margin-left: 51.3888888889%;
}

.offset-by-seven {
    margin-left: 59.7222222222%;
}

.offset-by-eight {
    margin-left: 68.0555555556%;
}

.offset-by-nine {
    margin-left: 76.3888888889%;
}

.offset-by-ten {
    margin-left: 84.7222222222%;
}

.offset-by-eleven {
    margin-left: 93.0555555556%;
}

.offset-by-half {
    margin-left: 5.5555555556%;
}

.offset-by-one-half {
    margin-left: 11.8888888889%;
}

.offset-by-two-half {
    margin-left: 22.2222222222%;
}

.offset-by-three-half {
    margin-left: 30.5555555556%;
}

.offset-by-four-half {
    margin-left: 38.8888888889%;
}

.offset-by-five-half {
    margin-left: 47.2222222222%;
}

.offset-by-six-half {
    margin-left: 55.5555555556%;
}

.offset-by-seven-half {
    margin-left: 63.8888888889%;
}

.offset-by-eight-half {
    margin-left: 72.2222222222%;
}

.offset-by-nine-half {
    margin-left: 80.5555555556%;
}

.offset-by-ten-half {
    margin-left: 88.8888888889%;
}

.offset-by-eleven-half {
    margin-left: 97.2222222222%;
}

/*------------------------------
  Nested Columns
------------------------------*/
.two.columns .column, .two.columns .columns {
    margin-left: 10%;
    margin-right: 10%;
}

.two.columns .one.columns {
    width: 40%;
}

.three.columns .column, .three.columns .columns {
    margin-left: 6.25%;
    margin-right: 6.25%;
}

.three.columns .one.columns {
    width: 25%;
}

.three.columns .two.columns {
    width: 62.5%;
}

.four.columns .column, .four.columns .columns {
    margin-left: 4.5454545455%;
    margin-right: 4.5454545455%;
}

.four.columns .one.columns {
    width: 18.1818181818%;
}

.four.columns .two.columns {
    width: 45.4545454545%;
}

.four.columns .three.columns {
    width: 72.7272727273%;
}

.five.columns .column, .five.columns .columns {
    margin-left: 3.5714285714%;
    margin-right: 3.5714285714%;
}

.five.columns .one.columns {
    width: 14.2857142857%;
}

.five.columns .two.columns {
    width: 35.7142857143%;
}

.five.columns .three.columns {
    width: 57.1428571429%;
}

.five.columns .four.columns {
    width: 78.5714285714%;
}

.six.columns .column, .six.columns .columns {
    margin-left: 2.9411764706%;
    margin-right: 2.9411764706%;
}

.six.columns .one.columns {
    width: 11.7647058824%;
}

.six.columns .two.columns {
    width: 29.4117647059%;
}

.six.columns .three.columns {
    width: 47.0588235294%;
}

.six.columns .four.columns {
    width: 64.7058823529%;
}

.six.columns .five.columns {
    width: 82.3529411765%;
}

.seven.columns .column, .seven.columns .columns {
    margin-left: 2.5%;
    margin-right: 2.5%;
}

.seven.columns .one.columns {
    width: 10%;
}

.seven.columns .two.columns {
    width: 25%;
}

.seven.columns .three.columns {
    width: 40%;
}

.seven.columns .four.columns {
    width: 55%;
}

.seven.columns .five.columns {
    width: 70%;
}

.seven.columns .six.columns {
    width: 85.0%;
}

.eight.columns .column, .eight.columns .columns {
    margin-left: 2.1739130435%;
    margin-right: 2.1739130435%;
}

.eight.columns .one.columns {
    width: 8.6956521739%;
}

.eight.columns .two.columns {
    width: 21.7391304348%;
}

.eight.columns .three.columns {
    width: 34.7826086957%;
}

.eight.columns .four.columns {
    width: 47.8260869565%;
}

.eight.columns .five.columns {
    width: 60.8695652174%;
}

.eight.columns .six.columns {
    width: 73.9130434783%;
}

.eight.columns .seven.columns {
    width: 86.9565217391%;
}

.nine.columns .column, .nine.columns .columns {
    margin-left: 1.9230769231%;
    margin-right: 1.9230769231%;
}

.nine.columns .one.columns {
    width: 7.6923076923%;
}

.nine.columns .two.columns {
    width: 19.2307692308%;
}

.nine.columns .three.columns {
    width: 30.7692307692%;
}

.nine.columns .four.columns {
    width: 42.3076923077%;
}

.nine.columns .five.columns {
    width: 53.8461538462%;
}

.nine.columns .six.columns {
    width: 65.3846153846%;
}

.nine.columns .seven.columns {
    width: 76.9230769231%;
}

.nine.columns .eight.columns {
    width: 100%;
}

.ten.columns .column, .ten.columns .columns {
    margin-left: 1.724137931%;
    margin-right: 1.724137931%;
}

.ten.columns .one.columns {
    width: 6.8965517241%;
}

.ten.columns .two.columns {
    width: 17.2413793103%;
}

.ten.columns .three.columns {
    width: 27.5862068966%;
}

.ten.columns .four.columns {
    width: 37.9310344828%;
}

.ten.columns .five.columns {
    width: 48.275862069%;
}

.ten.columns .six.columns {
    width: 58.6206896552%;
}

.ten.columns .seven.columns {
    width: 68.9655172414%;
}

.ten.columns .eight.columns {
    width: 79.3103448276%;
}

.ten.columns .nine.columns {
    width: 89.6551724138%;
}

.eleven.columns .column, .eleven.columns .columns {
    margin-left: 1.5625%;
    margin-right: 1.5625%;
}

.eleven.columns .one.columns {
    width: 6.25%;
}

.eleven.columns .two.columns {
    width: 15.625%;
}

.eleven.columns .three.columns {
    width: 25%;
}

.eleven.columns .four.columns {
    width: 34.375%;
}

.eleven.columns .five.columns {
    width: 43.75%;
}

.eleven.columns .six.columns {
    width: 53.125%;
}

.eleven.columns .seven.columns {
    width: 62.5%;
}

.eleven.columns .eight.columns {
    width: 71.875%;
}

.eleven.columns .nine.columns {
    width: 81.25%;
}

.eleven.columns .ten.columns {
    width: 90.625%;
}

.twelve.columns .column, .twelve.columns .columns {
    margin-left: 1.4285714286%;
    margin-right: 1.4285714286%;
}

.twelve.columns .one.columns {
    width: 5.7142857143%;
}

.twelve.columns .two.columns {
    width: 14.2857142857%;
}

.twelve.columns .three.columns {
    width: 22.8571428571%;
}

.twelve.columns .four.columns {
    width: 31.4285714286%;
}

.twelve.columns .five.columns {
    width: 40.0%;
}

.twelve.columns .six.columns {
    width: 48.5714285714%;
}

.twelve.columns .seven.columns {
    width: 57.1428571429%;
}

.twelve.columns .eight.columns {
    width: 65.7142857143%;
}

.twelve.columns .nine.columns {
    width: 74.2857142857%;
}

.twelve.columns .ten.columns {
    width: 82.8571428571%;
}

.twelve.columns .eleven.columns {
    width: 91.4285714286%;
}

/*------------------------------
  Responsive Grid
------------------------------*/
@media only screen and (max-width: 750px) {
    .container {
        max-width: 390px;
    }

    .column, .columns {
        float: none;
        display: block;
        width: auto !important;
        margin: 0px !important;
    }

        .columns .columns, .columns .column {
            margin: 0 !important;
        }

    .offset-by-one,
    .offset-by-two,
    .offset-by-three,
    .offset-by-four,
    .offset-by-five,
    .offset-by-six,
    .offset-by-seven,
    .offset-by-eight,
    .offset-by-nine,
    .offset-by-ten,
    .offset-by-eleven {
        margin-left: 10px;
    }

    .one-mobile.column,
    .two-mobile.columns,
    .three-mobile.columns,
    .four-mobile.columns,
    .five-mobile.columns,
    .six-mobile.columns,
    .seven-mobile.columns,
    .eight-mobile.columns,
    .nine-mobile.columns,
    .ten-mobile.columns,
    .eleven-mobile.columns,
    .twelve-mobile.columns {
        float: left;
        *display: inline;
        margin: 0 1.3888888889% !important;
    }

    .one-mobile.column {
        width: 5.5555555556% !important;
    }

    .two-mobile.columns {
        width: 13.8888888889% !important;
    }

    .three-mobile.columns {
        width: 22.2222222222% !important;
    }

    .four-mobile.columns {
        width: 30.5555555556% !important;
    }

    .five-mobile.columns {
        width: 38.8888888889% !important;
    }

    .six-mobile.columns {
        width: 47.2222222222% !important;
    }

    .seven-mobile.columns {
        width: 55.5555555556% !important;
    }

    .eight-mobile.columns {
        width: 63.8888888889% !important;
    }

    .nine-mobile.columns {
        width: 72.2222222222% !important;
    }

    .ten-mobile.columns {
        width: 80.5555555556% !important;
    }

    .eleven-mobile.columns {
        width: 88.8888888889% !important;
    }

    .twelve-mobile.columns {
        width: 97.2222222222% !important;
    }
}


/* 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%;
}

body {
    font-size: 1.5em; /* currently ems cause chrome bug misinterpreting rems on body element */
    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 {
        display: block;
        text-decoration: none;
        text-transform: capitalize;
        font-size: 16px;
        padding: 6px 15px;
        width: 100px;
        height: 100px;
        text-align: center;
        margin: auto;
        background: #1f8cf5;
        color: #fff;
        border: 2px solid #fff;
        border-radius: 50%;
        -webkit-transition: 0.25s ease-in-out;
        transition: 0.25s ease-in-out;
    }

        .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, s input[type="reset"].button-primary:focus,
        input[type="button"].button-primary:focus {
            color: #007fff;
            border: 2px solid #007fff;
            background-color: #fff;
        }


/* 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: 50px;
    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;
    /*width: 100%;*/
}
/* 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;
    width: 200px;
}

    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: 95%;
    }

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%;
    max-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;
}


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


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

/* Self Clearing Goodness */
.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 tablet */
@media (min-width: 750px) {
}

/* Larger than desktop */
@media (min-width: 1000px) {
}

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