JSFiddle - React, Tailwind, and code Playground

HTML

<body>
	<div class="main">
		<p>.main p { }</p>
	</div>
	<p>.main + p { }</p>
</body>

CSS

p {
			font-family: 'American Typewriter', 'Courier New', Courier, Monaco, mono;
			font-size: 2.5em;
			font-weight: bold;
			text-align: center;
			margin: 0;
			border: 10px solid rgba( 200, 200, 200, 0.5 );
		}
		.main {
			width: 270px;
			height: 80px;
			padding: 40px;
			margin-bottom: 40px;
		}
		.main, p {
			background-color: rgba( 153, 153, 153, 0.2 );
		}
		.main p {
			border-color: green;
		}
		.main + p {
			width: 250px;
			height: 60px;
			padding: 40px;
			border-color: blue;
		}