Create a gist now

Instantly share code, notes, and snippets.

Embed
Skeleton.css with MaterializeCSS Grids
@charset "UTF-8";
/*
* Skeleton V2.0.4
* Copyright 2014, Dave Gamache
* www.getskeleton.com
* Free to use under the MIT license.
* http://www.opensource.org/licenses/mit-license.php
*/
/* Table of contents
––––––––––––––––––––––––––––––––––––––––––––––––––
- Grid
- Base Styles
- Typography
- Links
- Buttons
- Forms
- Lists
- Code
- Tables
- Spacing
- Utilities
- Clearing
- Media Queries
*/
/* Grid
–––––––––––––––––––––––––––––––––––––––––––––––––– */
/*
* Materialize v0.97.7 (http://materializecss.com)
* Copyright 2014-2015 Materialize
* MIT License (https://raw.githubusercontent.com/Dogfalo/materialize/master/LICENSE)
*/
.container {
margin: 0 auto;
max-width: 1280px;
width: 90%;
}
@media only screen and (min-width: 601px) {
.container {
width: 85%;
}
}
@media only screen and (min-width: 993px) {
.container {
width: 70%;
}
}
.container .row {
margin-left: -0.75rem;
margin-right: -0.75rem;
}
.section {
padding-top: 1rem;
padding-bottom: 1rem;
}
.section.no-pad {
padding: 0;
}
.section.no-pad-bot {
padding-bottom: 0;
}
.section.no-pad-top {
padding-top: 0;
}
.row {
margin-left: auto;
margin-right: auto;
margin-bottom: 20px;
}
.row:after {
content: "";
display: table;
clear: both;
}
.row .col {
float: left;
box-sizing: border-box;
padding: 0 0.75rem;
}
.row .col[class*="push-"],
.row .col[class*="pull-"] {
position: relative;
}
.row .col.s1 {
width: 8.33333%;
margin-left: auto;
left: auto;
right: auto;
}
.row .col.s2 {
width: 16.66667%;
margin-left: auto;
left: auto;
right: auto;
}
.row .col.s3 {
width: 25%;
margin-left: auto;
left: auto;
right: auto;
}
.row .col.s4 {
width: 33.33333%;
margin-left: auto;
left: auto;
right: auto;
}
.row .col.s5 {
width: 41.66667%;
margin-left: auto;
left: auto;
right: auto;
}
.row .col.s6 {
width: 50%;
margin-left: auto;
left: auto;
right: auto;
}
.row .col.s7 {
width: 58.33333%;
margin-left: auto;
left: auto;
right: auto;
}
.row .col.s8 {
width: 66.66667%;
margin-left: auto;
left: auto;
right: auto;
}
.row .col.s9 {
width: 75%;
margin-left: auto;
left: auto;
right: auto;
}
.row .col.s10 {
width: 83.33333%;
margin-left: auto;
left: auto;
right: auto;
}
.row .col.s11 {
width: 91.66667%;
margin-left: auto;
left: auto;
right: auto;
}
.row .col.s12 {
width: 100%;
margin-left: auto;
left: auto;
right: auto;
}
.row .col.offset-s1 {
margin-left: 8.33333%;
}
.row .col.pull-s1 {
right: 8.33333%;
}
.row .col.push-s1 {
left: 8.33333%;
}
.row .col.offset-s2 {
margin-left: 16.66667%;
}
.row .col.pull-s2 {
right: 16.66667%;
}
.row .col.push-s2 {
left: 16.66667%;
}
.row .col.offset-s3 {
margin-left: 25%;
}
.row .col.pull-s3 {
right: 25%;
}
.row .col.push-s3 {
left: 25%;
}
.row .col.offset-s4 {
margin-left: 33.33333%;
}
.row .col.pull-s4 {
right: 33.33333%;
}
.row .col.push-s4 {
left: 33.33333%;
}
.row .col.offset-s5 {
margin-left: 41.66667%;
}
.row .col.pull-s5 {
right: 41.66667%;
}
.row .col.push-s5 {
left: 41.66667%;
}
.row .col.offset-s6 {
margin-left: 50%;
}
.row .col.pull-s6 {
right: 50%;
}
.row .col.push-s6 {
left: 50%;
}
.row .col.offset-s7 {
margin-left: 58.33333%;
}
.row .col.pull-s7 {
right: 58.33333%;
}
.row .col.push-s7 {
left: 58.33333%;
}
.row .col.offset-s8 {
margin-left: 66.66667%;
}
.row .col.pull-s8 {
right: 66.66667%;
}
.row .col.push-s8 {
left: 66.66667%;
}
.row .col.offset-s9 {
margin-left: 75%;
}
.row .col.pull-s9 {
right: 75%;
}
.row .col.push-s9 {
left: 75%;
}
.row .col.offset-s10 {
margin-left: 83.33333%;
}
.row .col.pull-s10 {
right: 83.33333%;
}
.row .col.push-s10 {
left: 83.33333%;
}
.row .col.offset-s11 {
margin-left: 91.66667%;
}
.row .col.pull-s11 {
right: 91.66667%;
}
.row .col.push-s11 {
left: 91.66667%;
}
.row .col.offset-s12 {
margin-left: 100%;
}
.row .col.pull-s12 {
right: 100%;
}
.row .col.push-s12 {
left: 100%;
}
@media only screen and (min-width: 601px) {
.row .col.m1 {
width: 8.33333%;
margin-left: auto;
left: auto;
right: auto;
}
.row .col.m2 {
width: 16.66667%;
margin-left: auto;
left: auto;
right: auto;
}
.row .col.m3 {
width: 25%;
margin-left: auto;
left: auto;
right: auto;
}
.row .col.m4 {
width: 33.33333%;
margin-left: auto;
left: auto;
right: auto;
}
.row .col.m5 {
width: 41.66667%;
margin-left: auto;
left: auto;
right: auto;
}
.row .col.m6 {
width: 50%;
margin-left: auto;
left: auto;
right: auto;
}
.row .col.m7 {
width: 58.33333%;
margin-left: auto;
left: auto;
right: auto;
}
.row .col.m8 {
width: 66.66667%;
margin-left: auto;
left: auto;
right: auto;
}
.row .col.m9 {
width: 75%;
margin-left: auto;
left: auto;
right: auto;
}
.row .col.m10 {
width: 83.33333%;
margin-left: auto;
left: auto;
right: auto;
}
.row .col.m11 {
width: 91.66667%;
margin-left: auto;
left: auto;
right: auto;
}
.row .col.m12 {
width: 100%;
margin-left: auto;
left: auto;
right: auto;
}
.row .col.offset-m1 {
margin-left: 8.33333%;
}
.row .col.pull-m1 {
right: 8.33333%;
}
.row .col.push-m1 {
left: 8.33333%;
}
.row .col.offset-m2 {
margin-left: 16.66667%;
}
.row .col.pull-m2 {
right: 16.66667%;
}
.row .col.push-m2 {
left: 16.66667%;
}
.row .col.offset-m3 {
margin-left: 25%;
}
.row .col.pull-m3 {
right: 25%;
}
.row .col.push-m3 {
left: 25%;
}
.row .col.offset-m4 {
margin-left: 33.33333%;
}
.row .col.pull-m4 {
right: 33.33333%;
}
.row .col.push-m4 {
left: 33.33333%;
}
.row .col.offset-m5 {
margin-left: 41.66667%;
}
.row .col.pull-m5 {
right: 41.66667%;
}
.row .col.push-m5 {
left: 41.66667%;
}
.row .col.offset-m6 {
margin-left: 50%;
}
.row .col.pull-m6 {
right: 50%;
}
.row .col.push-m6 {
left: 50%;
}
.row .col.offset-m7 {
margin-left: 58.33333%;
}
.row .col.pull-m7 {
right: 58.33333%;
}
.row .col.push-m7 {
left: 58.33333%;
}
.row .col.offset-m8 {
margin-left: 66.66667%;
}
.row .col.pull-m8 {
right: 66.66667%;
}
.row .col.push-m8 {
left: 66.66667%;
}
.row .col.offset-m9 {
margin-left: 75%;
}
.row .col.pull-m9 {
right: 75%;
}
.row .col.push-m9 {
left: 75%;
}
.row .col.offset-m10 {
margin-left: 83.33333%;
}
.row .col.pull-m10 {
right: 83.33333%;
}
.row .col.push-m10 {
left: 83.33333%;
}
.row .col.offset-m11 {
margin-left: 91.66667%;
}
.row .col.pull-m11 {
right: 91.66667%;
}
.row .col.push-m11 {
left: 91.66667%;
}
.row .col.offset-m12 {
margin-left: 100%;
}
.row .col.pull-m12 {
right: 100%;
}
.row .col.push-m12 {
left: 100%;
}
}
@media only screen and (min-width: 993px) {
.row .col.l1 {
width: 8.33333%;
margin-left: auto;
left: auto;
right: auto;
}
.row .col.l2 {
width: 16.66667%;
margin-left: auto;
left: auto;
right: auto;
}
.row .col.l3 {
width: 25%;
margin-left: auto;
left: auto;
right: auto;
}
.row .col.l4 {
width: 33.33333%;
margin-left: auto;
left: auto;
right: auto;
}
.row .col.l5 {
width: 41.66667%;
margin-left: auto;
left: auto;
right: auto;
}
.row .col.l6 {
width: 50%;
margin-left: auto;
left: auto;
right: auto;
}
.row .col.l7 {
width: 58.33333%;
margin-left: auto;
left: auto;
right: auto;
}
.row .col.l8 {
width: 66.66667%;
margin-left: auto;
left: auto;
right: auto;
}
.row .col.l9 {
width: 75%;
margin-left: auto;
left: auto;
right: auto;
}
.row .col.l10 {
width: 83.33333%;
margin-left: auto;
left: auto;
right: auto;
}
.row .col.l11 {
width: 91.66667%;
margin-left: auto;
left: auto;
right: auto;
}
.row .col.l12 {
width: 100%;
margin-left: auto;
left: auto;
right: auto;
}
.row .col.offset-l1 {
margin-left: 8.33333%;
}
.row .col.pull-l1 {
right: 8.33333%;
}
.row .col.push-l1 {
left: 8.33333%;
}
.row .col.offset-l2 {
margin-left: 16.66667%;
}
.row .col.pull-l2 {
right: 16.66667%;
}
.row .col.push-l2 {
left: 16.66667%;
}
.row .col.offset-l3 {
margin-left: 25%;
}
.row .col.pull-l3 {
right: 25%;
}
.row .col.push-l3 {
left: 25%;
}
.row .col.offset-l4 {
margin-left: 33.33333%;
}
.row .col.pull-l4 {
right: 33.33333%;
}
.row .col.push-l4 {
left: 33.33333%;
}
.row .col.offset-l5 {
margin-left: 41.66667%;
}
.row .col.pull-l5 {
right: 41.66667%;
}
.row .col.push-l5 {
left: 41.66667%;
}
.row .col.offset-l6 {
margin-left: 50%;
}
.row .col.pull-l6 {
right: 50%;
}
.row .col.push-l6 {
left: 50%;
}
.row .col.offset-l7 {
margin-left: 58.33333%;
}
.row .col.pull-l7 {
right: 58.33333%;
}
.row .col.push-l7 {
left: 58.33333%;
}
.row .col.offset-l8 {
margin-left: 66.66667%;
}
.row .col.pull-l8 {
right: 66.66667%;
}
.row .col.push-l8 {
left: 66.66667%;
}
.row .col.offset-l9 {
margin-left: 75%;
}
.row .col.pull-l9 {
right: 75%;
}
.row .col.push-l9 {
left: 75%;
}
.row .col.offset-l10 {
margin-left: 83.33333%;
}
.row .col.pull-l10 {
right: 83.33333%;
}
.row .col.push-l10 {
left: 83.33333%;
}
.row .col.offset-l11 {
margin-left: 91.66667%;
}
.row .col.pull-l11 {
right: 91.66667%;
}
.row .col.push-l11 {
left: 91.66667%;
}
.row .col.offset-l12 {
margin-left: 100%;
}
.row .col.pull-l12 {
right: 100%;
}
.row .col.push-l12 {
left: 100%;
}
}
/* 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 {
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;
}
/* 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 */
/* Larger than phablet (also point when grid becomes active) */
/* Larger than tablet */
/* Larger than desktop */
/* Larger than Desktop HD */
.container{margin:0 auto;max-width:1280px;width:90%}@media only screen and (min-width: 601px){.container{width:85%}}@media only screen and (min-width: 993px){.container{width:70%}}.container .row{margin-left:-0.75rem;margin-right:-0.75rem}.section{padding-top:1rem;padding-bottom:1rem}.section.no-pad{padding:0}.section.no-pad-bot{padding-bottom:0}.section.no-pad-top{padding-top:0}.row{margin-left:auto;margin-right:auto;margin-bottom:20px}.row:after{content:"";display:table;clear:both}.row .col{float:left;box-sizing:border-box;padding:0 0.75rem}.row .col[class*="push-"],.row .col[class*="pull-"]{position:relative}.row .col.s1{width:8.33333%;margin-left:auto;left:auto;right:auto}.row .col.s2{width:16.66667%;margin-left:auto;left:auto;right:auto}.row .col.s3{width:25%;margin-left:auto;left:auto;right:auto}.row .col.s4{width:33.33333%;margin-left:auto;left:auto;right:auto}.row .col.s5{width:41.66667%;margin-left:auto;left:auto;right:auto}.row .col.s6{width:50%;margin-left:auto;left:auto;right:auto}.row .col.s7{width:58.33333%;margin-left:auto;left:auto;right:auto}.row .col.s8{width:66.66667%;margin-left:auto;left:auto;right:auto}.row .col.s9{width:75%;margin-left:auto;left:auto;right:auto}.row .col.s10{width:83.33333%;margin-left:auto;left:auto;right:auto}.row .col.s11{width:91.66667%;margin-left:auto;left:auto;right:auto}.row .col.s12{width:100%;margin-left:auto;left:auto;right:auto}.row .col.offset-s1{margin-left:8.33333%}.row .col.pull-s1{right:8.33333%}.row .col.push-s1{left:8.33333%}.row .col.offset-s2{margin-left:16.66667%}.row .col.pull-s2{right:16.66667%}.row .col.push-s2{left:16.66667%}.row .col.offset-s3{margin-left:25%}.row .col.pull-s3{right:25%}.row .col.push-s3{left:25%}.row .col.offset-s4{margin-left:33.33333%}.row .col.pull-s4{right:33.33333%}.row .col.push-s4{left:33.33333%}.row .col.offset-s5{margin-left:41.66667%}.row .col.pull-s5{right:41.66667%}.row .col.push-s5{left:41.66667%}.row .col.offset-s6{margin-left:50%}.row .col.pull-s6{right:50%}.row .col.push-s6{left:50%}.row .col.offset-s7{margin-left:58.33333%}.row .col.pull-s7{right:58.33333%}.row .col.push-s7{left:58.33333%}.row .col.offset-s8{margin-left:66.66667%}.row .col.pull-s8{right:66.66667%}.row .col.push-s8{left:66.66667%}.row .col.offset-s9{margin-left:75%}.row .col.pull-s9{right:75%}.row .col.push-s9{left:75%}.row .col.offset-s10{margin-left:83.33333%}.row .col.pull-s10{right:83.33333%}.row .col.push-s10{left:83.33333%}.row .col.offset-s11{margin-left:91.66667%}.row .col.pull-s11{right:91.66667%}.row .col.push-s11{left:91.66667%}.row .col.offset-s12{margin-left:100%}.row .col.pull-s12{right:100%}.row .col.push-s12{left:100%}@media only screen and (min-width: 601px){.row .col.m1{width:8.33333%;margin-left:auto;left:auto;right:auto}.row .col.m2{width:16.66667%;margin-left:auto;left:auto;right:auto}.row .col.m3{width:25%;margin-left:auto;left:auto;right:auto}.row .col.m4{width:33.33333%;margin-left:auto;left:auto;right:auto}.row .col.m5{width:41.66667%;margin-left:auto;left:auto;right:auto}.row .col.m6{width:50%;margin-left:auto;left:auto;right:auto}.row .col.m7{width:58.33333%;margin-left:auto;left:auto;right:auto}.row .col.m8{width:66.66667%;margin-left:auto;left:auto;right:auto}.row .col.m9{width:75%;margin-left:auto;left:auto;right:auto}.row .col.m10{width:83.33333%;margin-left:auto;left:auto;right:auto}.row .col.m11{width:91.66667%;margin-left:auto;left:auto;right:auto}.row .col.m12{width:100%;margin-left:auto;left:auto;right:auto}.row .col.offset-m1{margin-left:8.33333%}.row .col.pull-m1{right:8.33333%}.row .col.push-m1{left:8.33333%}.row .col.offset-m2{margin-left:16.66667%}.row .col.pull-m2{right:16.66667%}.row .col.push-m2{left:16.66667%}.row .col.offset-m3{margin-left:25%}.row .col.pull-m3{right:25%}.row .col.push-m3{left:25%}.row .col.offset-m4{margin-left:33.33333%}.row .col.pull-m4{right:33.33333%}.row .col.push-m4{left:33.33333%}.row .col.offset-m5{margin-left:41.66667%}.row .col.pull-m5{right:41.66667%}.row .col.push-m5{left:41.66667%}.row .col.offset-m6{margin-left:50%}.row .col.pull-m6{right:50%}.row .col.push-m6{left:50%}.row .col.offset-m7{margin-left:58.33333%}.row .col.pull-m7{right:58.33333%}.row .col.push-m7{left:58.33333%}.row .col.offset-m8{margin-left:66.66667%}.row .col.pull-m8{right:66.66667%}.row .col.push-m8{left:66.66667%}.row .col.offset-m9{margin-left:75%}.row .col.pull-m9{right:75%}.row .col.push-m9{left:75%}.row .col.offset-m10{margin-left:83.33333%}.row .col.pull-m10{right:83.33333%}.row .col.push-m10{left:83.33333%}.row .col.offset-m11{margin-left:91.66667%}.row .col.pull-m11{right:91.66667%}.row .col.push-m11{left:91.66667%}.row .col.offset-m12{margin-left:100%}.row .col.pull-m12{right:100%}.row .col.push-m12{left:100%}}@media only screen and (min-width: 993px){.row .col.l1{width:8.33333%;margin-left:auto;left:auto;right:auto}.row .col.l2{width:16.66667%;margin-left:auto;left:auto;right:auto}.row .col.l3{width:25%;margin-left:auto;left:auto;right:auto}.row .col.l4{width:33.33333%;margin-left:auto;left:auto;right:auto}.row .col.l5{width:41.66667%;margin-left:auto;left:auto;right:auto}.row .col.l6{width:50%;margin-left:auto;left:auto;right:auto}.row .col.l7{width:58.33333%;margin-left:auto;left:auto;right:auto}.row .col.l8{width:66.66667%;margin-left:auto;left:auto;right:auto}.row .col.l9{width:75%;margin-left:auto;left:auto;right:auto}.row .col.l10{width:83.33333%;margin-left:auto;left:auto;right:auto}.row .col.l11{width:91.66667%;margin-left:auto;left:auto;right:auto}.row .col.l12{width:100%;margin-left:auto;left:auto;right:auto}.row .col.offset-l1{margin-left:8.33333%}.row .col.pull-l1{right:8.33333%}.row .col.push-l1{left:8.33333%}.row .col.offset-l2{margin-left:16.66667%}.row .col.pull-l2{right:16.66667%}.row .col.push-l2{left:16.66667%}.row .col.offset-l3{margin-left:25%}.row .col.pull-l3{right:25%}.row .col.push-l3{left:25%}.row .col.offset-l4{margin-left:33.33333%}.row .col.pull-l4{right:33.33333%}.row .col.push-l4{left:33.33333%}.row .col.offset-l5{margin-left:41.66667%}.row .col.pull-l5{right:41.66667%}.row .col.push-l5{left:41.66667%}.row .col.offset-l6{margin-left:50%}.row .col.pull-l6{right:50%}.row .col.push-l6{left:50%}.row .col.offset-l7{margin-left:58.33333%}.row .col.pull-l7{right:58.33333%}.row .col.push-l7{left:58.33333%}.row .col.offset-l8{margin-left:66.66667%}.row .col.pull-l8{right:66.66667%}.row .col.push-l8{left:66.66667%}.row .col.offset-l9{margin-left:75%}.row .col.pull-l9{right:75%}.row .col.push-l9{left:75%}.row .col.offset-l10{margin-left:83.33333%}.row .col.pull-l10{right:83.33333%}.row .col.push-l10{left:83.33333%}.row .col.offset-l11{margin-left:91.66667%}.row .col.pull-l11{right:91.66667%}.row .col.push-l11{left:91.66667%}.row .col.offset-l12{margin-left:100%}.row .col.pull-l12{right:100%}.row .col.push-l12{left:100%}}html{font-size:62.5%}body{font-size:1.5em;line-height:1.6;font-weight:400;font-family:"Raleway", "HelveticaNeue", "Helvetica Neue", Helvetica, Arial, sans-serif;color:#222}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}@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}a{color:#1EAEDB}a:hover{color:#0FA0CE}.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}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;background-color:#fff;border:1px solid #D1D1D1;border-radius:4px;box-shadow:none;box-sizing:border-box}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}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{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}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}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}.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}hr{margin-top:3rem;margin-bottom:3.5rem;border-width:0;border-top:1px solid #E1E1E1}.container:after,.row:after,.u-cf{content:"";display:table;clear:both}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment