/* Theme Colors — from 主题巴巴 demo/bokex.html */

/* Primary Color */
a:hover,
.sf-menu li a:hover,
.sf-menu li li a:hover,
.sf-menu li.sfHover a,
.sf-menu li.sfHover li a:hover,
.posts-nav-menu ul li a:hover,
.sidebar .widget a:hover,
.site-footer .widget a:hover,
.author-box a:hover,
article.hentry .edit-link a:hover,
.comment-content a:hover,
.entry-meta a:hover,
.entry-title a:hover,
.content-list .entry-title a:hover,
.pagination .page-numbers:hover,
.pagination .page-numbers.current,
.author-box .author-meta .author-name a:hover,
.site-header .search-icon:hover span,
.site-header .search-icon:hover span:before,
article.hentry .edit-link a,
.author-box a,
.page-content a,
.entry-content a,
.comment-author a,
.comment-content a,
.comment-reply-title small a:hover,
.sidebar .widget a,
.friend-nav li a:hover,
.tooltip .left .contact-info h3,
.single #primary .entry-footer .entry-like a,
.single #primary .entry-footer .entry-sponsor span,
.form-submit-text a,
.zhuanti-heading .section-more a:hover,
.mini-page h4 a:hover,
.mini-page ul li a:hover,
#tag_letter li a,
#all_tags li a,
#all_tags li a:hover {
	color: #de2910;
}
h2.section-title .title,
.breadcrumbs h1 span.title,
.pagination .page-numbers:hover,
.pagination .page-numbers.current,
.sidebar .widget .widget-title span,
#featured-grid h2.section-title span {
	border-bottom-color: #de2910;
}

button,
.btn,
input[type="submit"],
input[type="reset"],
input[type="button"],
.friend .friend-title:before,
.partner-title:before,
.sidebar .widget .widget-title:before,
.related-content .section-title:before,
.comment-reply-title:before,
.comments-title:before,
.bottom-right span.icon-link .text,
.bottom-right a .text,
.posts-nav-menu ul li a:after,
.single #primary .entry-footer .entry-like a:hover,
.single #primary .entry-footer .entry-sponsor span:hover,
.form-submit .submit,
.footer-search .search-submit:hover,
#tag_letter li a:hover {
	background-color: #de2910;
}
.sf-menu li li a:hover {
	background-color: #de2910 !important;
}
.bx-wrapper .bx-pager.bx-default-pager a:hover,
.bx-wrapper .bx-pager.bx-default-pager a.active,
.bx-wrapper .bx-pager.bx-default-pager a:focus {
	background-color: #ffbe02;
}

.single #primary .entry-footer .entry-like a,
.single #primary .entry-footer .entry-like a:hover,
.single #primary .entry-footer .entry-sponsor span,
#all_tags li a:hover {
	border-color: #de2910;
}

/* Secondary Color */
.page-content a:hover,
.entry-content a:hover {
	color: #ff4c4c;
}

/* Tertiary Color */
.content-list .entry-meta .entry-like a.liked {
	color: #76b852 !important;
}
@media only screen and (max-width: 959px) {
	.site-header {
		background-color: transparent;
		background-image: none;
		box-shadow: none;
	}
	#primary-nav {
		clear: both;
		width: 100%;
		overflow-x: auto;
		overflow-y: hidden;
		-webkit-overflow-scrolling: touch;
		overscroll-behavior-x: contain;
		scrollbar-width: none;
		background-color: rgba(255, 255, 255, 0.82);
		background-image: linear-gradient(180deg, rgba(255, 255, 255, 0.92), rgba(255, 244, 238, 0.78));
		-webkit-backdrop-filter: saturate(160%) blur(18px);
		backdrop-filter: saturate(160%) blur(18px);
		border-top: 1px solid rgba(255, 255, 255, 0.7);
		border-bottom: 1px solid rgba(222, 41, 16, 0.12);
		box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.85);
		touch-action: pan-x pan-y;
		cursor: grab;
	}
	#primary-nav::-webkit-scrollbar {
		display: none;
	}
	#primary-menu {
		display: flex;
		flex-wrap: nowrap;
		align-items: stretch;
		float: none;
		width: max-content;
		min-width: 100%;
		margin: 0;
		padding: 0;
		background-color: transparent;
	}
	#primary-menu:after {
		content: none;
		display: none;
	}
	#primary-nav ul#primary-menu > li {
		float: none;
		width: auto;
		flex: 0 0 auto;
		line-height: 44px;
	}
	#primary-nav ul#primary-menu > li > a {
		display: block;
		padding: 0 16px;
		line-height: 44px;
		white-space: nowrap;
		color: #333 !important;
	}
	#primary-nav ul#primary-menu > li.current-menu-item > a,
	#primary-nav ul#primary-menu > li > a:hover {
		background-color: transparent;
		background-image: linear-gradient(#de2910, #de2910);
		background-repeat: no-repeat;
		background-position: center bottom;
		background-size: calc(100% - 32px) 2px;
		color: #de2910 !important;
	}
}

/* Text logo — original demo uses an image logo inside the 75px header */
.custom-logo-text {
	display: inline-block;
	color: #111;
	font-size: 28px;
	font-weight: 700;
	line-height: 75px;
	vertical-align: middle;
	white-space: nowrap;
}
.logo-suffix {
	display: none;
}
@media only screen and (max-width: 959px) {
	.site-branding {
		float: none;
		display: block;
		width: 100%;
		height: 50px;
		padding-left: 0;
		background-color: rgba(222, 41, 16, 0.78);
		background-image:
			linear-gradient(180deg, rgba(255, 255, 255, 0.32), rgba(255, 255, 255, 0.06)),
			linear-gradient(90deg, rgba(255, 122, 26, 0.82) 0%, rgba(222, 41, 16, 0.82) 100%);
		-webkit-backdrop-filter: saturate(160%) blur(18px);
		backdrop-filter: saturate(160%) blur(18px);
		box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.4);
		text-align: center;
	}
	.site-branding #logo {
		text-align: center;
	}
	.custom-logo-link,
	.custom-logo-link:hover,
	.custom-logo-text,
	.custom-logo-text:hover {
		color: #fff;
	}
	.custom-logo-text {
		font-size: 20px;
		line-height: 50px;
	}
	.logo-suffix {
		display: inline;
		font-size: 20px;
		font-weight: 600;
		line-height: inherit;
	}
	.header-right,
	.header-search {
		display: none !important;
	}
}

/* Featured / list thumbs match demo HTML: 640×350, 190×110, 400×260 shown at 243px */
.content-list .thumbnail-wrap {
	height: 158px;
	background: #dbeafe;
	overflow: hidden;
}
@media only screen and (max-width: 767px) {
	.content-list .thumbnail-link {
		width: 32%;
		max-width: none;
	}
	.content-list .thumbnail-wrap {
		height: auto;
		aspect-ratio: 400 / 260;
	}
	.content-list .entry-date,
	.content-list .entry-meta .entry-date {
		display: inline;
	}
}
.content-list .thumbnail-wrap img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}
#featured-slider .thumbnail-link,
#featured-slider .thumbnail-wrap {
	display: block;
	width: 100%;
}
#featured-slider .thumbnail-wrap {
	aspect-ratio: 640 / 350;
	height: auto;
	min-height: 0;
	background: #93c5fd;
	overflow: hidden;
}
#featured-slider .thumbnail-wrap img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
}
#featured-grid .thumbnail-wrap {
	aspect-ratio: 190 / 110;
	height: auto;
	background: #bfdbfe;
	overflow: hidden;
}
#featured-grid .thumbnail-wrap img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
}
.widget_posts_thumbnail .thumbnail-wrap {
	background: #dbeafe;
	overflow: hidden;
}
@media only screen and (max-width: 959px) {
	#secondary .widget-boke-x-views .thumbnail-wrap {
		aspect-ratio: 400 / 260;
	}
	#secondary .widget-boke-x-views .thumbnail-wrap img {
		width: 100%;
		height: 100%;
		object-fit: cover;
		display: block;
	}
}

/*
 * Official demo is 1160px, which fills a 1366 laptop. This window is much
 * wider, so grow the canvas with the same 20px gutter and 300px sidebar,
 * and keep the featured 640:350 row aligned with the three small tiles.
 */
@media (min-width: 1600px) {
	.container {
		width: 1400px;
	}
	#primary {
		width: 1080px;
	}
	#featured-slider {
		width: 880px;
	}
	#featured-grid .thumbnail-wrap {
		aspect-ratio: auto;
		height: 153.75px;
	}
	.content-list .thumbnail-link {
		width: 29%;
		max-width: 360px;
	}
	.content-list .thumbnail-wrap {
		height: auto;
		aspect-ratio: 400 / 260;
	}
}

#site-bottom {
	text-align: center;
	font-size: 15px;
}
#site-bottom .footer-left {
	float: none;
	width: auto;
}
#site-bottom .footer-nav {
	margin-bottom: 8px;
}
#site-bottom .footer-nav li {
	margin: 0 8px 6px;
}
#site-bottom .footer-logo {
	float: none;
	display: block;
	margin: 0 auto 10px;
}
#site-bottom .site-info {
	line-height: 1.8;
}
#site-bottom .site-beian {
	margin-top: 4px;
	color: rgba(255, 255, 255, 0.55);
	font-size: 14px;
	line-height: 1.8;
}
#site-bottom .site-beian a {
	color: rgba(255, 255, 255, 0.55);
}
#site-bottom .site-beian a:hover {
	color: #fff;
}
#site-bottom .beian-sep {
	color: rgba(255, 255, 255, 0.28);
	margin: 0 8px;
}
