/* Desktop articles retain their existing dimensions when there is room. */
.single-blog .contentblog { max-width: 100%; }
.single-blog .contentblog .blogcontent :where(img, video, iframe, table) { max-width: 100%; }
.single-blog .contentblog .blogcontent img { height: auto; }

/* A narrow desktop/tablet viewport can reflow without a fixed-width canvas. */
@media (max-width: 1040px) {
	.single-blog .header-container { width: 940px !important; max-width: 100%; flex-wrap: wrap; }
	.single-blog #top-menu { max-width: 100%; }
	.single-blog .contentblog { width: calc(100% - 32px); }
	.single-blog .contentblog .bloglist { width: calc(100% - 385px); }
	.single-blog .contentblog .bloglist .blogdetail { width: calc(100% - 40px); margin-left: 40px; margin-right: 0; }
	.single-blog .contentblog .bloglist .blogdetail .blogcontent { width: 100%; overflow-wrap: break-word; }
	.single-blog .contentblog .rnew { max-width: 100%; height: auto; min-height: 50px; }
	.single-blog .contentblog .rnewdesc { width: calc(100% - 58px); }
	.single-blog .contentblog .blog-social,
	.single-blog .contentblog .blog-social > div { max-width: 100%; }
	.single-blog .contentblog .blogdetail iframe { max-width: 100%; }
	.single-blog #footer > .row { width: 100%; max-width: 100%; }
}
@media (max-width: 800px) {
	/* Keep the phone header proportions even when desktop markup was served. */
	.single-blog #top-header {
		--blog-header-unit: 0.15625vw;
		min-height: 0;
		height: calc(120 * var(--blog-header-unit));
	}
	.single-blog #top-header .header-container {
		position: relative;
		width: 100% !important;
		height: 100%;
		min-height: 0;
		margin: 0;
		padding: 0;
		flex-wrap: nowrap;
	}
	.single-blog #top-header .header-container > .columns {
		float: none;
		margin: 0;
		padding: 0;
	}
	.single-blog #top-header .header-container > .logo {
		position: absolute;
		left: calc(90 * var(--blog-header-unit));
		top: calc(28 * var(--blog-header-unit));
		width: calc(219 * var(--blog-header-unit)) !important;
	}
	.single-blog #top-header #logo { width: 100%; margin: 0; padding: 0; }
	.single-blog #top-header #logo :is(svg, img) {
		display: block;
		width: 100%;
		height: auto;
	}
	.single-blog #top-header .header-container > .four.columns {
		position: absolute;
		right: 0;
		width: calc(330 * var(--blog-header-unit)) !important;
	}
	.single-blog #top-header #call-to-action { justify-content: center; }
	.single-blog #top-header #call-to-action h2 {
		margin: 0;
		padding: 0;
		font-size: calc(29 * var(--blog-header-unit));
		line-height: 1.2;
		text-align: center;
		text-shadow: none;
	}
	.single-blog #top-header #call-to-action h2 a {
		display: flex;
		flex-direction: column-reverse;
	}
	.single-blog #top-header #call-to-action h2 br { display: none; }
	.single-blog #top-header #call-to-action h2 span { font-size: inherit; }
	.single-blog #top-header #call-to-action > a,
	.single-blog #top-header .lang_tabs,
	.single-blog #top-menu-container { display: none; }
	.single-blog .header-container > .columns { width: auto; }
	.single-blog .header-container .lang_tabs { width: 100%; }
	.single-blog .contentblog .bloglist { width: 100%; }
	.single-blog .contentblog .bloglist .blogdetail { width: 100%; margin-left: 0; }
	.single-blog .contentblog .blogright { float: none; clear: both; max-width: 100%; margin: 25px auto; }
	.single-blog .contentblog .blogright .latestnews { max-width: calc(100% - 15px); }
	.single-blog .contentblog .blogright .latestnews .lnew { max-width: calc(100% + 10px); height: auto; min-height: 50px; display: flow-root; }
	.single-blog .contentblog .blogright .latestnews .newdesc { width: min(215px, calc(100% - 70px)); }
}