@charset "UTF-8";

:root {
    /* font-family */
    --font-bold: "Microsoft YaHei", "Microsoft JhengHei", Arial, 'LiHei Pro', sans-serif;
    --font-normal: "Microsoft JhengHei", Arial, 'LiHei Pro', sans-serif;
    /*--font-jinxuan: "jf-jinxuan";*/
    
    --light-theme-bg-color: rgb(215, 224, 233);
    --light-theme-text-color: rgb(36, 35, 35);

    --dark-theme-bg-color: rgb(41, 47, 59);
    --dark-theme-text-color: rgb(247, 242, 239);
    --dark-theme-link-color: #abdd6d;
}

body[data-color-scheme="dark"] {
    --bg-color: var(--dark-theme-bg-color);
    --text-color: var(--dark-theme-text-color);
    --link-color: var(--dark-theme-link-color);

    --title-bg-color: rgb(27, 30, 36);
    --title-text-color: rgb(234, 236, 241);
}

body {
    /*background-color: #333;*/
    font-family: "Microsoft JhengHei", "Microsoft YaHei", Arial, 'LiHei Pro', Helvetica, sans-serif;
    /*font-family: "jf-jinxuan";*/
}

body {
    background-color: #222;
    background-image: repeating-linear-gradient(
        45deg,
        #2b2b2b 0,
        #2b2b2b 1px,
        #222222 0,
        #222222 7px
    );
    background-position: left top;
    background-size: 10px 10px;
    background-repeat: repeat;
    color: #ccc;
}

a,a:link { color: #0D47A1; text-decoration: none; }
a:visited { color: #0D47A1; text-decoration: none; }
a:hover { color: #FF3333; text-decoration: underline; }
a:active { color: #6eb11c; }


h1,h2,h3,h4,h5,h6,strong {
    /*font-family: "Microsoft YaHei", "Microsoft JhengHei", Arial, 'LiHei Pro', sans-serif;*/
    font-family: "Microsoft JhengHei", "Microsoft YaHei", Arial, 'LiHei Pro', sans-serif;
    font-weight: bold;
    margin: 1.2em 0 0.5em 0;
}

pre {
    border: 1px solid #999;
}
/*code {
    background-color: #fff !important;
}*/

/*
.container {
    
}
*/

header {
    border-bottom: 0px solid #777;
}

#search_bar {
    /*background-color: rgb(55, 70, 87);*/
    background-color: rgb(64, 73, 90);
}


.md-container {
    /*width: auto;
    max-width: 900px;*/
    margin-top: 20px;
    margin-bottom: 40px;
    padding: 20px 20px 100px 20px;
    /*padding-bottom: 70px;*/
    
    background-color: var(--bg-color);
    color: var(--text-color);

    /*border: 1px solid var(--text-color);*/
    border: 1px solid transparent;
}
.md-container a:link, .md-container a:visited {
    color: var(--link-color);
}
.md-container a:hover {
    color: #FF3333;
}
#md_content {
    border-top: 10px solid var(--title-bg-color);
    border-bottom: 10px solid var(--title-bg-color);
    padding: 0em 0 3em 0;
}


.md-container h1, .md-container h2 {
    padding: 0.2em 0.5em;

    background-color: var(--title-bg-color);
    color: var(--title-text-color);

    /*font-family: monospace;*/
    
    /*
    border-top: 1px solid var(--text-color);
    border-right: 1px solid var(--text-color);
    border-bottom: 1px solid var(--text-color);
    border-left: 15px solid var(--text-color);
    */
}
.md-container h1 {
    /*font-size: 2em;*/
    margin-top: 10px;
}
/*.md-container h2 {
    /ont-size: 1.9em;
}
.md-container h3 {
    font-size: 1.8em;
}*/

.md-container li > p {
    margin: 0;
    padding: 0;
}

.md_file_datetime {
    text-align: right;
    padding: 10px 0;
    font-size: 12px;
    color: #ccc;
}


footer {
    text-align: center;
    color: #ccc;
    border-top: 2px solid #777;
    border-bottom: 23px solid #111;
    background-color: #111;
}
#footer2 {
    padding: 80px 0 100px 0;
    border-bottom: 2px solid #777;
}

footer a,footer a:link { color: #ccc; text-decoration: none; }
footer a:visited { color: #ccc; text-decoration: none; }
footer a:hover { color: #97D74A; text-decoration: underline; }
footer a:active { color: #FF3333; }

.copyright {
    font-size: 12px;
}

.social-media-links {
    font-size: 2em;
    padding: 0px 0 40px 0;
}

.no_select {
    user-select: none;
}

.nav_icon {
    font-size: 24px;
    display: block;
    text-align: center;
}

.js_only {
    display: none;
}

.form-signin {
    width: 100%;
    max-width: 330px;
    padding: 15px;
    margin: auto;
}
.form-floating label {
    color: #333;
}