/* Global styles */

html {
    /* Size settings */
    height: 100%;

    /* Hide horizontal overflow and always show vertical scroll bar */
    overflow-x: hidden;
    overflow-y: scroll;
}

body {
    /* Size settings */
    height: 100%;

    /* Padding settings */
    padding-top: 20px;

    /* Color settings */
    color: #333;

    /* Font settings */
    font-family: 'Roboto', sans-serif;
    font-weight: 300;
    font-size: 18px;
    line-height: 1.4em;
}

@media (max-width: 992px) {
    body {
        /* Padding settings */
        padding-top: 10px;
    }
}


/* Content styles */

.intro-span {
    display: block;
}

@media (max-width: 992px) {
    .intro-span {
        display: inline;
    }
}

a {
    /* Color settings */
    color: #ff3002;

    /* Font settings */
    font-weight: 500;
}

a:hover {
    /* Color settings */
    color: #ff3002;

    /* Disable link underline on hover */
    text-decoration: none;
}

#github-buttons {
    margin-top: 18px;

    /* HACK: The star IFrame doesn't seem to load centered, so shift it. */
    padding-left: 33px;
}

.lead {
    font-size: 21px;
}

h1 {
    /* Font settings */
    font-size: 60px;
}

@media (max-width: 992px) {
    h1 {
        /* Font settings */
        font-size: 45px;
    }
}

h2 {
    /* Margin settings */
    margin-top: 30px;

    /* Font settings */
    font-size: 30px;
}

p {
    margin: 15px 0px 15px 0px;
}


/* Footer styles */

.wrapper {
    /* Size settings */
    min-height: 100%;

    /* Margin settings (bottom margin should be footer height) */
    margin: 0 auto -100px;
}

footer, .footer-push {
    /* Position settings */
    position: relative;

    /* Size settings */
    height: 100px;

    /* Font settings */
    font-size: 16px;

    /* Color settings */
    color: #888;

    /* Alignment settings */
    text-align: center;
}

.copyright {
    /* Position settings */
    position: absolute;
    bottom: 15px;

    /* Size settings */
    width: 100%;
}


/* Alert style overrides */


.alert {
    /* Don't add a border radius */
    border-radius: 0;
}


/* Code style overrides */

code, pre code {
    /* Use a nicer color for inline code */
    color: #333;

    /* Set up a consistent background color */
    background-color: #f5f5f5;

    /* Don't add a border radius */
    border-radius: 0;

    /* Font settings */
    font-size: 16px;
}

pre {
    /* Don't wrap code with a border */
    border: none;

    /* Don't add a border radius */
    border-radius: 0;

    /* Override bootstrap's wrapping of code */
    overflow-x: auto;

    /* Remove excessive padding */
    padding: 0 0 5px 25px;
}

pre code {
    /* Override bootstrap's wrapping of code */
    overflow-wrap: normal;
    white-space: pre;
}
