CSS Selector for nth child

<!DOCTYPE html>
<html>
<head>
<style type="text/css">
/* .red is class for p here on which style is to be applied*/
.red:nth-of-type(2) 
{
	background-color: #4EA2F5;
	color: #FFF;
}

.red:nth-of-type(3) 
{
	background-color: #F15832;
	color: #FFF;
}
</style>
</head>
<body>
	<div class="home">
		<span>blah</span>
		<p class="red">first</p>
		<p class="red">second</p>
		<p class="red">third</p>
		<p class="red">fourth</p>
	</div>
</body>
</html>

Output