/* ===================================================
	XL
===================================================	*/
@media only screen and (max-width: 1400px) {
	.mobile {display: none;}
	.arch::after {width: 50%;  height: 300%; transform: translate(0, -30%);}
}

/* ===================================================
	LG
===================================================	*/
@media only screen and (max-width: 1200px) {
	.arch::after {width: 50%; height: 260%; transform: translate(10%, -30%);}
	.columns-4 { column-count: 2;}
}

/* ===================================================
	MD
===================================================	*/
@media only screen and (max-width: 992px) {
	.arch::after {width: 40%; height: 200%; transform: translate(10%, -30%);}
	.columns-4, .columns-2 { column-count: 1;}
}

/* ===================================================
	SM
===================================================	*/
@media only screen and (max-width: 768px) {
	.desktop {display: none;}
	.mobile {display: block;}
	.toc .link-box {margin-bottom: 5pt;}
	.toc .link-box a {display: inline-block !important; margin-right: 5pt;}
}

/* ===================================================
	XS
===================================================	*/
@media only screen and (max-width: 576px) {
	.arch::after {width: 50%;  height: 300%; transform: translate(0, -5%);}
}