/* GLOBAL STYLES
-------------------------------------------------- */
/* Padding below the footer and lighter body text */
@media (max-width: 769px) and (min-width: 577px) {
	:root {
		--product-row-height: 3.25rem;
		--product-row-width: 4vw;
		--product-column-offset: -3.5vw;
		--navlink: calc(1em * var(--eighthstep));
	}
	.custom-hero {
		height: 12vh; /* Even shorter for mobile screens */
	}
	.custom-hero h2 {
		padding: 0;
		margin: 0;
	}
	.tabs-div-ul {
		margin: 0 18px;
	}
	.toc {
		background-color: #f4f4f6;
		width: auto;
	}
	.page2a-content {
		max-width: 80vw;
	}
	.page2a-tiles {
		max-width: fit-content;
		min-width: fit-content;
	}
	.news-container {
		text-align: center;
		padding: 0 3vw;
		-webkit-column-count: 1; /* Chrome, Safari, Opera */
		-moz-column-count: 1; /* Firefox */
		column-count: 1;
		-webkit-column-gap: 0.2rem; /* Chrome, Safari, Opera */
		-moz-column-gap: 0.2rem; /* Firefox */
		column-gap: 0.2rem;
	}
	.news-item {
		width: calc(95% / 1);
		margin-bottom: 8px;

		padding: 3px 0;
		text-wrap: balance;
		page-break-inside: avoid;
	}
	.page2a-tiles-container {
		min-height: fit-content;
	}

	.phase-table-phases-col {
		width: 2%;
		max-width: 25px;
		padding-left: 6px;
		padding-right: 6px;
	}
	.left-toc {
		border-left: 1px solid #dee2e6;
	}
	
	.product-table-phase-label {
		font-size: 0.85rem;
	}
	.product-table-header {
		width: 100%;
	}
	.product-table-body {
		width: 100%;
	}
	.product-table-cell {
		width: 30%;
	}
	.product-table-subject {
		--product-row-height: 3.5rem;
		--product-row-width: 5.25vw;
		--product-column-offset: -3vw;
	}
	.sublink.two-columns{
		columns: 2;
		-webkit-columns: 2;
		-moz-columns: 2;
	}
	.right-border{
		border-right: none;
		margin-right: 0;
	}	
	.nav-link{
		padding: 0.25rem 0;
		margin: 0;
		font-size: var(--navlink);
	}
	.navbar{
		padding: 0 var(--lg);
	}	
	.navbar-nav {		
		padding-bottom: var(--lg);
	}
	.nav-item.dropdown{
		padding-top: var(--xs);
		padding-bottom:var(--xs);
	}
	.sublink{
		padding-left:0;
	}
	.nav-mega .dropdown-menu.mega-menu>li {
		padding: var(--sm) var(--md);
	}
	.sublink li{
		margin: var(--sm);
	}
}