body
	{
	overflow: hidden;
	}

.layout
	{
	display: grid;
	grid-template-columns: 1fr auto;
	grid-template-rows: auto 1fr;
	grid-template-areas:
		"top-left right"
		"bottom-left right";
	}

.content
	{
	grid-area: right;
	width: 85vw;
	height: 100vh;
	overflow-y: auto;
	min-height: 0;
	padding-right: 1rem;
	}

main article header
	{
	text-align: center;
	}

@media (max-width: 1280px)
	{
	.content
		{
		width: 80vw;
		}
	}

@media (max-width: 1080px)
	{
	.content
		{
		width: 75vw;
		}
	}

@media (max-width: 768px)
	{
	.layout
		{
    	grid-template-columns: 1fr;
		grid-template-areas:
			"right";
  		}

	.content
		{
		width: 98vw;
		margin-left: 1rem;
		margin-right: 1rem;
		}
	}