* {
    margin: 0;
    padding: 0;
    font-family: Microsoft YaHei, "Helvetica Neue", Helvetica, "Segoe UI", Arial, freesans, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
}


/** Header **/

.site-header {
    padding-top: 20px;
    padding-bottom: 20px;
    width: 100%;
    position: fixed;
    margin: 40px 0 30px 0;
    top: 0;
    left: 0 !important;
    right: 0;
    z-index: 103;
    color: #000;
    background: #fff;
    filter: alpha(opacity=60);
    opacity: 0.6;
    -webkit-transition: all 0.5s ease;
    -moz-transition: all 0.5s ease;
    -ms-transition: all 0.5s ease;
    -o-transition: all 0.5s ease;
    transition: all 0.5s ease;
}

.site-header #site-header-brand {
    color: #2e2e2e;
    float: left;
}

.site-header a {
    text-decoration: none;
}

.site-header a:hover {
    color: #4183c4;
}

#site-header-brand,
#site-header-brand .octicon {
    margin-top: 0;
    margin-bottom: 0;
    font-size: 38px;
    font-weight: 400;
    line-height: 38px;
}

.site-header-nav {
    float: right;
    margin-bottom: -20px;
}

.site-header-nav-item {
    color: #000;
    display: inline-block;
    padding: 10px;
    margin-left: 1.25rem;
    font-size: 20px;
}


/******* Scroll Start *******/

.site-header {
    box-shadow: 0 0 5px rgba(0, 0, 0, 0.1);
}

.site-header.site-header-nav-scrolled {
    margin: 0;
    background-color: white;
    filter: alpha(opacity=100);
    opacity: 1;
    -webkit-box-shadow: 0 0.125em 0.125em 0 rgba(0, 0, 0, 0.125);
    -moz-box-shadow: 0 0.125em 0.125em 0 rgba(0, 0, 0, 0.125);
    -ms-box-shadow: 0 0.125em 0.125em 0 rgba(0, 0, 0, 0.125);
    -o-box-shadow: 0 0.125em 0.125em 0 rgba(0, 0, 0, 0.125);
    box-shadow: 0 0.125em 0.125em 0 rgba(0, 0, 0, 0.125);
}


/******* Scroll End *******/


/******* Scroll Start on the phone *******/

.site-header {
    box-shadow: 0 0 5px rgba(0, 0, 0, 0.1);
}

.site-header.site-header-nav-scrolled-ph {
    margin-top: -160px;
    -webkit-box-shadow: 0 0.125em 0.125em 0 rgba(0, 0, 0, 0.125);
    -moz-box-shadow: 0 0.125em 0.125em 0 rgba(0, 0, 0, 0.125);
    -ms-box-shadow: 0 0.125em 0.125em 0 rgba(0, 0, 0, 0.125);
    -o-box-shadow: 0 0.125em 0.125em 0 rgba(0, 0, 0, 0.125);
    box-shadow: 0 0.125em 0.125em 0 rgba(0, 0, 0, 0.125);
}


/******* Scroll End *******/

#header-gh-btns {
    margin-bottom: 15px;
}

@media only screen and (max-width: 500px) {
    #header-gh-btns>iframe {
        display: block;
        margin-bottom: 5px;
    }
}


/** Jumbotron **/

.jumbotron {
    position: relative;
    padding-top: 200px;
    padding-bottom: 100px;
    color: #fff;
}

.jumbotron a {
    color: #fff;
    text-decoration: none;
}

.jumbotron #jumbotron-meta-info {
    margin-top: 20px;
}

.jumbotron .meta-info {
    font-size: 20px;
    margin-right: 15px;
    display: inline-block;
    vertical-align: middle;
}

.jumbotron.meta-info,
.jumbotron .meta-info .octicon {
    font-size: 18px;
}


/** big image **/

.jumbotron.big-img {
    background: no-repeat center center;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    background-size: cover;
    -o-background-size: cover;
}

.jumbotron.big-img .big-img-transition {
    position: relative;
    width: 100%;
    height: 100%;
    opacity: 0;
    background: no-repeat center center;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    background-size: cover;
    -o-background-size: cover;
    -webkit-transition: opacity 1s linear;
    -moz-transition: opacity 1s linear;
    transition: opacity 1s linear;
}


/* --- Footer --- */

footer {
    padding: 30px 0;
    border-top: 1px #EAEAEA solid;
    font-size: 14px;
    background-color: #F5F5F5;
}

footer p.text-muted {
    color: #777777;
}

footer a {
    color: #404040;
}

footer .list-inline {
    margin: 0;
    padding: 0;
}

footer .copyright {
    font-family: 'Open Sans', 'Helvetica Neue', Helvetica, Arial, sans-serif;
    text-align: center;
    margin-bottom: 0;
}

footer .theme-by {
    text-align: center;
    margin: 10px 0 0;
}

@media only screen and (min-width: 768px) {
    footer {
        padding: 50px 0;
    }
    footer .footer-links {
        font-size: 18px;
    }
    footer .copyright {
        font-size: 16px;
    }
}


/** Footer **/

.site-footer {
    position: relative;
    margin-top: 40px;
    padding: 40px 0;
    font-size: 12px;
    line-height: 1.5;
    color: #777;
    border-top: 2px solid #eee
}

.site-footer .octicon-mark-github {
    position: absolute;
    left: 50%;
    color: #ccc;
}

.site-footer .octicon-mark-github:hover {
    color: #bbb;
}


/** Post List **/

.post-list-item {
    position: relative;
    padding-top: 30px;
    padding-bottom: 30px;
    list-style: none;
    border-bottom: 1px solid #eee;
}

.post-list-title a {
    text-decoration: none;
}

.post-list-description {
    margin-top: 8px;
    margin-bottom: 0;
    font-size: 18px;
    color: #666;
}

.post-list-meta {
    margin-top: 8px;
    margin-bottom: 0;
    color: #888;
}

.post-list-meta,
.post-list-meta.octicon {
    font-size: 18px;
}

.geopattern {
    background-size: contain;
    /* To fix strange behavior when zoom in/out */
}

.sidebar-title {
    text-align: center;
}

.error {
    position: absolute;
    top: 45%;
    left: 50%;
    transform: translate(-50%, -50%);
    display: block;
    font-family: "Roboto Mono", monospace;
    min-width: 680px;
    text-align: center;
}

.error-emoji {
    color: rgba(0, 0, 0, .4);
    font-size: 150px;
}

.error-text {
    color: rgba(0, 0, 0, .4);
    line-height: 21px;
    margin-top: 60px;
    white-space: pre-wrap;
}


/* --- Tables --- */

table {
    padding: 0;
}

table tr {
    border-top: 1px solid #cccccc;
    background-color: #ffffff;
    margin: 0;
    padding: 0;
}

table tr:nth-child(2n) {
    background-color: #f8f8f8;
}

table tr th {
    font-weight: bold;
    border: 1px solid #cccccc;
    text-align: left;
    margin: 0;
    padding: 6px 13px;
}

table tr td {
    border: 1px solid #cccccc;
    text-align: left;
    margin: 0;
    padding: 6px 13px;
}

table tr th :first-child,
table tr td :first-child {
    margin-top: 0;
}

table tr th :last-child,
table tr td :last-child {
    margin-bottom: 0;
}


/* --- Code blocks --- */

.content .row pre,
pre {
    font-size: 16px;
    line-height: 1.5em;
}

.content .row pre code,
pre code {
    white-space: pre;
}

.content .row pre.highlight,
pre.highlight,
.content .row .highlight>pre,
.highlight>pre,
.content .row td.code pre,
td.code pre {
    padding: 9.5px;
    background-color: #FAFAFA;
    background-image: linear-gradient(#F9F9F9 50%, #FDFDFD 50%);
    background-repeat: repeat;
    background-size: 3em 3em;
    background-position: 0px 10px;
    border-left: 7px solid #444;
}

code table,
.content .row code table,
code table td,
.content .row code table td,
code table th,
.content .row code table th,
code table tbody,
.content .row code table tbody,
code table tr,
.content .row code table tr,
td.gutter pre,
.content .row td.gutter pre {
    padding: 0;
    border: none;
    background-color: #fff;
}

.content .row code table {
    margin: 0;
    display: table;
    width: fit-content;
}

.content .row .highlight>pre,
.highlight>pre {
    padding: 0;
}

.content .row .highlight>pre.highlight,
.highlight>pre.highlight {
    padding: 9.5px;
}

.content .row td.code pre,
td.code pre {
    border-width: 0 0 0 2px;
    border-style: solid;
    border-color: #444;
    border-radius: 0;
}

.content .row td.gutter,
td.gutter {
    padding-top: 3px;
}


/* --- Notification boxes --- */

.box-note,
.box-warning,
.box-error,
.box-success {
    padding: 15px 15px 15px 10px;
    margin: 20px 20px 20px 5px;
    border: 1px solid #eee;
    border-left-width: 5px;
    border-radius: 5px 3px 3px 5px;
}

.box-note {
    background-color: #eee;
    border-left-color: #2980b9;
}

.box-warning {
    background-color: #fdf5d4;
    border-left-color: #f1c40f;
}

.box-error {
    background-color: #f4dddb;
    border-left-color: #c0392b;
}

.box-success {
    background-color: #98FB98;
    border-left-color: #3CB371;
}