#EntryTag {
    margin-top: 20px;
    font-size: 9pt;
    color: gray
}

.topicListFooter {
    text-align: right;
    margin-right: 10px;
    margin-top: 10px
}

#divRefreshComments {
    text-align: right;
    margin-right: 10px;
    margin-bottom: 5px;
    font-size: 9pt
}

* {
    margin: 0;
    padding: 0
}

body {
    /* 圖片素材來自theinspirationgrid，僅用於學習 */
    background-image: url(https://theinspirationgrid.com/app/uploads/2019/03/art-bisa-butler-07-550x735.jpg);
    background-repeat: no-repeat;
    background-attachment: fixed;
}
 
/* 加載動畫 */
/* #home::after{
    content: "Cad's Blog";
    text-align: center;
    color:rgb(255, 255, 255);
    background-color: #000;
    position: absolute;
    bottom: 0px;
    right: 0px;
    min-height: 100%;
    min-width: 100%;
    height:100%;
    width: 100%;
    line-height: 600px;
    text-indent: 0em;
    z-index: 999;
    font-size: 30px;

    animation: 2s openaction ease-in-out;

    opacity: 0;
    visibility: hidden; 
} 

@keyframes openaction {
	0% {
		opacity: 0;
        visibility: visible;
        text-indent: 10rem;
	}

	10% {
        opacity: 1;
    }
    
	70% {
        opacity: 1;
        text-indent: 0rem;
	}

	90% {
        opacity: 1;
        text-indent: 0rem;
		 right: 0;
	}

	100% {
        opacity: 0;
		right: 100%;
	}
}      */

table {
    border-collapse: collapse;
    border-spacing: 0
}

fieldset, img {
    border: 0
}

li {
    list-style: none
}

h1, h2, h3, h4, h5, h6 {
    font-size: 100%;
    font-weight: 400
}

a:active, a:hover, a:link, a:visited {
    color: #000;
    text-decoration: none
}

.clear {
    clear: both
}

#home {
    background-color: #fff;
    font-family: "微软雅黑";
    font-size: 12px;
    color: #000;
    padding-top: 30px;
    padding-right: 25px;
    word-wrap: break-word;
    box-shadow: 0 0 25px #000;
    position: relative;
    width: 900px;
    margin: 15px 15px 0 15px;
    float: right;
    line-height: 1.5
}

#header {
    margin-bottom: 15px;
    padding-left: 45px
}

#header .headermaintitle{
    opacity: 0.6;
    transition: opacity .3s ease-in-out;
    color:#096dd9
}

/* 可用animation也可用transition */
#header .headermaintitle:hover::after{
    content: "Cad";
    background-color: black; 
    color: white;
    font-size: 16px;
    margin-left: 0px;
    opacity: 1;
    animation: .5s titleaction ease-in-out;
}

@keyframes titleaction{
    0%{margin-left: 40px;    background-color: #096dd9;     }
    100%{margin-left: 0px;}
}

#header .headermaintitle:hover{
    opacity: 1;
}
#blogTitle {
    margin-bottom: 15px
}

#lnkBlogLogo {
    background-color: #170b2f;
    transition:background-color 0.3s ease-in-out;
    color: white;
    width: 20px;
    height: 120px;
    display: block;
    position: absolute;
    /* top: 2%; */
    left: 0;
}
#lnkBlogLogo:hover{
    background-color: #096dd9
}

#blogLogo {
    display: none
}

#blogTitle h1 {
    font-size: 400%
}

#blogTitle h2 {
    display: none
}

#navList {
    overflow: auto;
    margin-bottom: 10px
}

#navList li {
    float: left
}

.menu {
    color: #85a5ff!important;
    margin-right: 30px;
    font-size: 200%; 
    transition: opacity .3s ease-in-out ;
    opacity: .5
}
.menu:hover{
    opacity: 1;
}

#navList a[href="//www.cnblogs.com/"] {
    color: #000!important
}

.blogStats {
    text-align: right;
    color: gray
}

#main {
    overflow: auto;
    padding-left: 25px
}

#mainContent {
    float: left;
    width: 650px
}

.day {
    margin-bottom: 10px;
    border-bottom: 1px solid #000
}

.dayTitle {
    background-color: #85a5ff;
    padding-top: 3px;
    padding-left: 15px;
    padding-right: 15px;
    padding-bottom: 3px;
    margin-bottom: 10px
}

.dayTitle a {
    color: #fff;
    font-size: 133%
}

.postTitle {
    background-image: url(images/logo.png);
    background-repeat: repeat-y;
    background-position: -10px 0;
    margin-bottom: 10px;
    padding-left: 15px;
    padding-right: 15px;
    line-height: 1.5
}

.postTitle2 {
    font-size: 200%;
}



.postCon {
    font-size: 116%;
    padding-left: 15px;
    padding-right: 15px;
    margin-bottom: 5px;
    overflow: auto
}

.postDesc {
    color: gray;
    text-align: right;
    padding-left: 15px;
    padding-right: 15px;
    margin-bottom: 5px;
    opacity: .6;
}

.postDesc a {
    color: gray
}

.postDesc >a{
    transition: all 0.3s ease-in-out;
    color:#fa8c16
}

.postDesc >a:hover{
    color: #fff;
    background-color: #adc6ff
}

.postSeparator {
    border-bottom: 1px dashed #000;
    margin-bottom: 10px
}

.topicListFooter {
    padding-left: 15px;
    padding-right: 15px;
    margin: 0
}

.topicListFooter a {
    color: green
}

#sideBar {
    width: 225px;
    float: right
}

#sideBarMain {
    font-size: 116%
}

#sideBarMain li {
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap
}

.newsItem {
    border: 1px solid #000;
    padding: 15px;
    margin-bottom: 15px;
    margin-left:5px;
}

#calendar {
    border: 1px solid #000;
    padding: 15px;
    margin-bottom: 15px
}

.Cal {
    width: 100%
}

.CalTitle {
    width: 100%;
    border-bottom: 1px solid #000
}

.CalNextPrev a {
    font-weight: 400!important;
    color: #000!important;
    background-color: transparent!important
}

.CalDayHeader {
    border-bottom: 1px dashed #000
}

#calendar a {
    color: green;
    font-weight: 700
}

#calendar a:hover {
    color: #fff;
    background-color: green
}

.CalTodayDay {
    font-weight: 700;
    color: #cd4900
}

.catListTag {
    overflow: auto
}

.catListTag li {
    float: left;
    float: none\9;
    margin: 0 4px 6px 0;
    overflow: visible!important;
    white-space: normal!important;
    word-break: break-all!important
}

.catListTag a {
    color: #fff;
    background-color: green;
    padding: 1px 3px 1px 3px
}

.div_my_zzk {
    position: relative
}

.input_my_zzk {
    width: 155px;
    height: 25px;
    padding-right: 30px;
    width: 100px\9;
    height: auto\9;
    padding-right: 0\9
}

.btn_my_zzk {
    background-repeat: no-repeat;
    background-size: 25px;
    background-color: transparent;
    width: 25px;
    height: 25px;
    color: transparent;
    border: 0;
    border-style: none;
    position: absolute;
    cursor: pointer;
    top: 2px;
    right: 6px;
    background-repeat: repeat\9;
    background-size: auto\9;
    background-color: green\9;
    width: auto\9;
    height: auto\9;
    color: #fff\9;
    border: 0\9;
    border-style: none\9;
    position: static\9;
    cursor: pointer\9
}

#btnZzk {
    background-image: url(images/search.png);
    background-image: none\9;
    background-image: none\0
}

.mySearch input[value="谷歌搜索"] {
    background-image: url(images/google.png);
    background-image: none\9;
    background-image: none\0
}

#leftcontentcontainer>div {
    border: 1px solid #000;
    padding: 15px;
    margin-bottom: 15px;
    margin-left:5px;
}

.catListTitle {
    font-size: 200%;
    margin-bottom: 5px
}

.recent_comment_body {
    text-indent: 2em;
    font-size: 85%;
    color: gray!important;
    overflow: visible!important;
    white-space: normal!important
}

.recent_comment_author {
    border-bottom: 1px dashed #000;
    font-size: 85%;
    color: green!important;
    overflow: visible!important;
    white-space: normal!important
}

#topics {
    margin-bottom: 10px;
    border-bottom: 1px solid #000
}

.postBody {
    font-size: 116%;
    padding-left: 15px;
    padding-right: 15px;
    margin-bottom: 5px
}

#cnblogs_post_body {
    margin-bottom: 30px;
    overflow: auto
}

#MySignature {
    background-color: #f8f8ee;
    border: solid 1px #e8e7d0;
    box-shadow: 0 0 15px #aaa;
    padding: 10px;
    margin-bottom: 10px;
    color: gray
}

#BlogPostCategory {
    margin-bottom: 5px
}

#EntryTag {
    margin-top: 0;
    text-align: right
}

#EntryTag a {
    color: #fff;
    background-color: green;
    padding: 1px 3px 1px 3px
}

.feedback_area_title {
    color: #fff;
    font-size: 133%;
    background-color: #cd4900;
    padding: 3px 15px 3px 15px;
    margin-bottom: 10px
}

.feedbackItem {
    position: relative;
    border-bottom: 1px solid #000;
    padding-left: 15px;
    padding-right: 15px;
    margin-bottom: 10px
}

.feedbackListSubtitle {
    margin-left: 65px;
    margin-bottom: 5px;
    border-bottom: 1px dashed #000
}

.feedbackManage {
    position: absolute;
    bottom: 0;
    right: 15px
}

.feedbackManage a {
    color: gray
}

.feedbackManage+a[href^="#"] {
    display: block;
    width: 50px;
    height: 50px;
    background-color: green;
    position: absolute;
    color: #fff;
    font-size: 133%;
    text-align: center;
    left: 15px
}

.louzhu {
    color: #cd4900
}

.feedbackCon {
    padding-left: 65px;
    margin-bottom: 35px;
    font-size: 116%
}

#comment_nav {
    margin-right: 0;
    margin-bottom: 10px;
    text-align: center;
    padding-top: 3px;
    padding-bottom: 3px;
    padding-left: 15px;
    padding-right: 15px;
    background-color: green
}

#comment_nav a {
    color: #fff;
    font-size: 116%
}

.PostListTitle, .entrylistTitle, .thumbTitle {
    background-color: #cd4900;
    padding-top: 3px;
    padding-left: 15px;
    padding-right: 15px;
    padding-bottom: 3px;
    margin-bottom: 10px;
    color: #fff;
    font-size: 133%
}

.entrylistDescription, .thumbDescription {
    background-color: green;
    padding-top: 3px;
    padding-left: 15px;
    padding-right: 15px;
    padding-bottom: 3px;
    margin-bottom: 10px;
    color: #fff;
    text-align: right
}

.entrylistItem {
    margin-bottom: 10px;
    border-bottom: 1px solid #000
}

.entrylistPosttitle {
    background-image: url(images/logo.png);
    background-repeat: repeat-y;
    background-position: -10px 0;
    margin-bottom: 10px;
    padding-left: 15px;
    padding-right: 15px
}

.entrylistItemTitle {
    font-size: 200%
}

.entrylistPostSummary {
    font-size: 116%;
    padding-left: 15px;
    padding-right: 15px;
    margin-bottom: 5px
}

.entrylistItemPostDesc {
    color: gray;
    text-align: right;
    padding-left: 15px;
    padding-right: 15px;
    margin-bottom: 5px
}

.entrylistItemPostDesc a {
    color: gray
}

.entrylist .postSeparator {
    display: none
}

.PostList {
    padding-left: 15px;
    padding-right: 15px;
    margin-bottom: 10px;
    border-bottom: 1px dashed #000
}

.postTitl2 {
    float: left;
    margin-bottom: 5px
}

.postDesc2 {
    float: right;
    color: gray;
    margin-bottom: 5px
}

.postText2 {
    clear: both;
    color: gray;
    margin-bottom: 5px
}

.divPhoto {
    border: 1px solid green;
    padding: 2px;
    margin-right: 10px;
    opacity: .5
}

.divPhoto:hover {
    opacity: 1
}

#footer {
    text-align: center;
    border-top: 2px solid #85a5ff;
    margin-top: 50px;
    margin-left: 25px;
    padding-top: 10px;
    padding-bottom: 10px
}

#footer .footer-span{
    position: relative;
    float: right;
    right: 0px;
    color: white;
    background-color: black; 
    transition: all 0.3s ease-in-out
    /* animation: .3s footeraction ease-in-out; */
}

#footer .footer-span:hover{
    background-color: #096dd9; 
    right:10px
}

.postBody h1 {
    display: block;
    font-size: 3em;
    font-weight: 700;
    margin: 15px auto 2px auto
}

.postBody h2 {
    display: block;
    font-size: 2em;
    font-weight: 700;
    margin: 15px auto 2px auto
}

.postBody h3 {
    display: block;
    font-size: 1.17em;
    font-weight: 700;
    margin: 15px auto 2px auto
}

.postBody h4 {
    display: block;
    font-weight: 700;
    margin: 15px auto 2px auto
}

.postBody h5 {
    display: block;
    font-size: .83em;
    font-weight: 700;
    margin: 15px auto 2px auto
}

.postBody h6 {
    font-size: 100%;
    font-size: .67em;
    font-weight: 700;
    margin: 15px auto 2px auto
}

.postBody a {
    color: green;
    padding: 1px 3px 1px 3px
}

.postBody a:hover {
    background-color: green;
    color: #fff
}

.postBody blockquote {
    background: url(images/quote.png) no-repeat -75px -20px #f0f0f0;
    border-radius: 10px;
    margin: 20px 0;
    padding: 20px 50px
}

.postCon a {
    color: green;
    padding: 1px 3px 1px 3px
}

.postCon a:hover {
    background-color: green;
    color: #fff
}

.c_b_p_desc{
    opacity: .7;
}

.c_b_p_desc_readmore {
    transition: all 0.3s ease-in-out;
    color:#fa8c16!important
}

.c_b_p_desc_readmore:hover {
    color: #fff!important;
    background-color: #adc6ff!important
}

#cnblogs_post_body img {
    max-width: 620px
}


/* 媒体查询只写了大于1600像素 */
@media (min-width: 1366px) {
    /* 将显示框往左边移动一定距离 */
#home {
    background-color: #fff;
    font-family: "微软雅黑";
    font-size: 12px;
    color: #000;
    padding-top: 30px;
    padding-right: 25px;
    word-wrap: break-word;
    box-shadow: 0 0 25px #000;
    position: relative;
    width: 900px;
    margin: 2% 5% 0 15%;
    float: right;
    line-height: 1.5
}
}