body {
    /*set max width and center*/
    max-width: 960px;
    margin: 0 auto;
}

body {
    color: #666666;
    font-family: "Calibri", Tahoma, Helvetica, Arial, sans-serif;
}

@media screen and (min-width: 600px) {
    body {
        font-size: 16px;
    }
}

@media screen and (max-width: 599px) {
    body {
        font-size: 12px;
    }
}

@media print {
    body {
        font-size: 12px;
    }
}

h1 {
    color: #333333;
    font-family: "Calibri", Tahoma, Helvetica, Arial, sans-serif;
    font-size: 4em;
    font-weight: 700;
    letter-spacing: -3px;
    line-height: 1em;
    margin-bottom: 1em;
    text-transform: uppercase;
}

h2 {
    color: #e61d35;
    font-family: "Calibri", Tahoma, Helvetica, Arial, sans-serif;
    font-size: 3em;
    font-weight: 700;
    letter-spacing: -1.5px;
    line-height: 2em;
    margin-bottom: .6em;
}

h3 {
    color: #5b5b5b;
    font-family: "Calibri", Tahoma, Helvetica, Arial, sans-serif;
    font-size: 2em;
    font-weight: 900;
    line-height: 1.7em;
    margin-bottom: .4em;
}

h4 {
    color: #e61d35;
    font-family: "Calibri", Tahoma, Helvetica, Arial, sans-serif;
    font-size: 1.6em;
    font-weight: 500;
    line-height: 1.7em;
    margin-bottom: .4em;
}

h5 {
    color: #5b5b5b;
    font-family: "Calibri", Tahoma, Helvetica, Arial, sans-serif;
    font-size: 1.2em;
    font-weight: 400;
    line-height: 1.5em;
    margin-bottom: .2em;
}

p {
    color: #666666;
    font-family: "Calibri", Helvetica, Tahoma, Arial, sans-serif;
    font-size: 1em;
    line-height: 1.4em;
    margin-bottom: 1.4em;
}

.highlight {
    background-color: yellow;
}

code {
    color: #000000;
    font-family: monospace;
    padding: 0 .2em;
    margin-bottom: 1em;
}

pre {
    margin: 1px;
    padding: 2px;
    border: 1px solid #333333;
    background-color: #EEEEEE;
}

a {
    color: #e61d35;
    font-family: "Calibri", Tahoma, Helvetica, Arial, sans-serif;
    font-size: 1em;
}

a:link, a:visited, a:active {
    text-decoration: none;
}

a:hover {
    text-decoration: underline;
}

ul {
    color: #666666;
    font-family: Helvetica, Arial, sans-serif;
    font-size: 1em;
    font-weight: 400;
    line-height: 1em;
    padding-left: 1.2em;
}

li {
    color: #666666;
    font-family: Helvetica, Arial, sans-serif;
    font-size: 1em;
    font-weight: 400;
    line-height: 1.4em;
    list-style-image: url("http://www.smartclip.com/sites/all/themes/smartclip/media/images/list-arrow.jpg");
}

ul li ul li {
    color: #333333;
    font-family: Helvetica, Arial, sans-serif;
    font-size: 1em;
    font-weight: 400;
    line-height: 1.4em;
    list-style-image: none;
    list-style-type: square;
}

/**
 * GitHub Gist Theme
 * Author : Louis Barranqueiro - https://github.com/LouisBarranqueiro
 */

.hljs {
    display: block;
    background: white;
    padding: 0.5em;
    color: #333333;
    overflow-x: auto;
}

.hljs-comment,
.hljs-meta {
    color: #969896;
}

.hljs-string,
.hljs-variable,
.hljs-template-variable,
.hljs-strong,
.hljs-emphasis,
.hljs-quote {
    color: #df5000;
}

.hljs-keyword,
.hljs-selector-tag,
.hljs-type {
    color: #a71d5d;
}

.hljs-literal,
.hljs-symbol,
.hljs-bullet,
.hljs-attribute {
    color: #0086b3;
}

.hljs-section,
.hljs-name {
    color: #63a35c;
}

.hljs-tag {
    color: #333333;
}

.hljs-title,
.hljs-attr,
.hljs-selector-id,
.hljs-selector-class,
.hljs-selector-attr,
.hljs-selector-pseudo {
    color: #795da3;
}

.hljs-addition {
    color: #55a532;
    background-color: #eaffea;
}

.hljs-deletion {
    color: #bd2c00;
    background-color: #ffecec;
}

.hljs-link {
    text-decoration: underline;
}

pre {
    white-space: pre-wrap !important;
    word-break: break-word !important;
    overflow: hidden !important;
}