* { box-sizing:border-box;}
body { background: #f8f8f8;}

.post h2 { margin: 30px 0;
    font-weight: bold;
    letter-spacing: 2px;
color:#25c9ca;
}
.post h3{
font-size:25px;
letter-spacing: 2px;
color:#25c9ca;
}
.post h4{
font-size:22px;
letter-spacing: 2px;
color:#25c9ca;
}

.header-right { display:none;}
.container { width:95%; max-width:1400px;}
#header { background:#000; }

.logo h1.site_title { font:bold 30px/1.4 "微軟正黑體"; }

.menu-primary { display:flex; width:100%; justify-content:center;}
.menu-primary li { float:none; display:inline-block;flex-grow :0; flex-shrink:0;}


.menu-primary-responsive-container { display:none;}

.menu-primary-container { background:#25c9ca; box-shadow:none;}
.menu-primary li a { font:16px/1 "微軟正黑體"; color:#fff; letter-spacing: 1px;}
.menu-primary li:hover a { color:#000; }

#main { display:flex; background:none; }

.search #main { display:block; background:none; }

.home #content,
.category #content,
.search #content,
.tag #content { display:inline-flex; justify-content: space-between; flex-wrap: wrap; padding:0 20px; float:none; width:calc(100% - 320px); }

.page-title { display:block; /*width:100%*/;}

.home .post,
.category .post,
.search .post,
.tag .post {position: relative; display:inline-flex ; flex-grow :0; flex-shrink:0; flex-wrap:wrap; margin:0 0 50px 0;  width:30%; background:#fff; box-shadow:0 10px 15px rgba(0,0,0,0.1);flex-direction: column;transition: .5s; }

.home .post:hover,
.category .post:hover,
.search .post:hover,
.tag .post:hover { transform: scale(1.1); }

.home .post > *,
.category .post > * ,
.search .post > * ,
.tag .post > * { flex-grow :0; flex-shrink:0; width:100%; }

.home .post .entry,
.category .post .entry,
.search .post .entry ,
.tag .post .entry { order:-1; height:400px; overflow: hidden;}

.home .post img,
.category .post img,
.search .post img,
.tag .post img { display:none;}



.home .featured_image,
.category .featured_image,
.search .featured_image,
.tag .featured_image { display:block !important; padding:0; margin:0; border:none; width:100%; transition: .5s; }



.home .post h2,
.category .post h2,
.search .post h2,
.tag .post h2  { position: absolute;top:10%; left:15%; margin:0 auto; padding: 10px; width:70%; linh-height:1; font-size:0; background:rgba(255,255,255,0.8); z-index:10;opacity: 0; transition: .5s;}

.home .post:hover h2,
.category .post:hover h2,
.search .post:hover h2,
.tag .post:hover h2 { opacity: 1; }


.home .post h2 a,
.category .post h2 a,
.search .post h2 a ,
.tag .post h2 a {display:block; margin:0; padding:0; font: 16px/1.6 "微軟正黑體"; letter-spacing: 1px; color:rgba(0,0,0,0.7)}

.postmeta-primary { display:block; position: absolute; bottom:10px; right:10px; width:100%; height:15px; text-align:right; opacity:0.3; }
.postmeta-primary span { display:none;} 
.postmeta-primary span.meta_date { display:block;}

.home .post p,
.category .post p,
.search .post p,
.tag .post p { margin:0 auto; width:80%; font: 16px/2 "微軟正黑體"; color:rgba(0,0,0,0.5); }

.readmore { display: block; margin:20px auto 30px ; text-align: center;}
.readmore a { color:rgba(255,255,255,1); background:#26ccca; border-radius:99em;}

.navigation { display:block; width:100%; }


#sidebar-primary { position: sticky; top:0;display:inline-flex; width:320px; flex-wrap: wrap;align-self:flex-start;  }

.widget-container { display:block; width:100%; height:auto; flex-grow :0; flex-shrink:0;  }

.widgettitle, .widgettitle a, .widgettitle a:hover { font:14px/1.6 "微軟正黑體"; color:#26ccca !important;letter-spacing: 1px; }

.widget-container a,
.widget-container p { font:14px/1.6 "微軟正黑體" !important; }



/**********TABLE**************/
@media only screen and (max-width: 800px) {
.menu-primary { justify-content:start;}

.clearfix:nth-child(2) { position: sticky; position: -webkit-sticky; top:0; padding:0 20px; z-index:10; overflow-x: scroll;overflow-y:hidden;background:#26ccca; }

.clearfix:nth-child(2) ul li {background:#26ccca; }

.entry.clearfix:nth-child(2) {background:none; }

.menu-primary-container { display:block;}
.home #content,
.category #content,
.search #content,
.tag #content { padding:0;}

.home .post,
.category .post,
.search .post,
.tag .post { width:100%;}

}



/******MOBILE*******/


@media only screen and (max-width: 500px) {
#main { display:block;}
.home #content, .category #content, .search #content, .tag #content { display:block; width:100%;}


.container { position:relative; width:100%; background:#000; z-index:1; }
#main { padding:0; }

.home .post,
.category .post,
.search .post ,
.tag .post { width:100%; background:#000; border-bottom: 1px solid rgba(255,255,255,0.2); overflow:hidden;}

.home .post h2,
.category .post h2,
.search .post h2 ,
.tag .post h2 { top:40%; left:2%; width:90%; height:auto; opacity: 1;background:none; }

.home .post h2 a,
.category .post h2 a,
.search .post h2 a,
.tag .post h2 a { font: bold 16px/1.4 "微軟正黑體";color:#fff; text-shadow:0 0 5px rgba(0,0,0,1),0 0 5px rgba(0,0,0,1)}

.home .post .entry,
.category .post .entry,
.search .post .entry ,
.tag .post .entry { position: relative;;height:auto}

.home .post .entry::after,
.category .post .entry::after,
.search .post .entry::after,
.tag .post .entry::after {display:block; content:""; position: absolute; bottom:60px ; left:0;width:100%; height:30px; background:red; z-index:2;visibility:visible;
background: linear-gradient(0deg, rgba(0, 0, 0, 1)0%, rgba(0, 0, 0, 0)100%); }

.home .post p,
.category .post p,
.search .post p,
.tag .post p { position: relative;max-height:50px; overflow: hidden; width:90%; font: 14px/2 "微軟正黑體"; color:#fff;  opacity: 0.8; z-index:1;  }

#sidebar-primary { display:block; position: static;width:100%;  }

.home #sidebar-primary,
.category #sidebar-primary,
.search #sidebar-primary,
.tag #sidebar-primary { background:#fff;}

}



/**********單頁文章*********/

.single #main,
.page #main { display:flex; }
.single #content,
.page #content { display:inline-flex; width:calc(100% - 320px); }

.single #content .post,
.page #content .post { width:100%; flex-grow :0; flex-shrink:0;}

.single #content .featured_image,
.page #content .featured_image { display:none;}

.single h1.title,
.page h1.title { letter-spacing: 1px;}


.single p,
.page p {font: 18px/2 "微軟正黑體"; color:#000; opacity: 0.8;letter-spacing: 2px;}

.single p strong,
.page p strong {font-size:1.4em }

hr.wp-block-separator { margin:50px auto; width:50%; border:1px dashed rgba(0,0,0,0.2)}

.wp-block-buttons { margin:50px 0; text-align: center;} 

.single li,
.page li {font: 18px/1.6 "微軟正黑體"; color:#000;}


/******MOBILE*******/


@media only screen and (max-width: 500px) {
.single h1.site_title ,
.page  h1.site_title { font: bold 20px/2 "微軟正黑體"; letter-spacing: 2px; }

.single #main ,
.page #main { display:block; margin:0 auto; padding:0 2.5%; width:100%;background:#fff;  }
.single #content,
.page #content { display:block; width:100%;}


.single h1 ,
.page h1{ font: 20px/1.5 "微軟正黑體";color:#000;}

.single p ,
.page h1 {font: 18px/2 "微軟正黑體"; color:#000; opacity: 1;letter-spacing: 2px;}

.single iframe ,
.page iframe{ width:100% !important;}


}



/*******其他通用設定*****/

#credits { display:none; }

.single .post table { border: 1px solid rgba(0,0,0,0.07); }

.single .post table tr:nth-child(1) { background:#26ccca; color:#fff }
.single .post table tr:nth-child(even){background:#efefef; }
.single .post table td {font: 18px/2 "微軟正黑體"; border-right: 1px solid rgba(0,0,0,0.07)}
.copyright{
	display: none;
}
@media only screen and (max-width: 500px) {
.single .post table td{font: 14px/1.4 "微軟正黑體"; }
}

