html{

	font-size: 16px;
}

body{

	font-family: sans-serif;
	padding: 1.2rem 0;
	line-height: 1.2rem;
	background: yellow;
}

img{

	max-width: 100%;
}


header, #cats{

	display: grid;
	grid-template-columns: 1fr 1fr 1fr;
}

header{

	margin-bottom: 4.8rem;
	padding: 0 1.2rem;
	font-size: 2.4rem;
	line-height: 2.4rem;
}

header h1{

	margin-bottom: 2.4rem;
	grid-column: 1 / 4;
}

header .intro{

	grid-column: 1 / 3;
}


#cats .cat{

	padding: 0 1.2rem;
	margin-bottom: 2.4rem;

}

#cats .cat .content{

	display: grid;
	grid-template-columns: 1fr 1fr;	
}

.cat h2{

	font-size: 2.4rem;
	line-height: 2.4rem;
	font-family: cursive;
}

.cat  h2,
.cat .content p{

	margin-bottom: 1.2rem;
}

.cat .content figure{

	font-size: 0.75rem;
	line-height: 1rem;
}

.cat .content p{

	padding-right: 1.2rem;
}