<html lang="en-US">
<head>
	<title>Responsive Type with CSS - by Dapper Gentlemen</title>
	<link href='https://fonts.googleapis.com/css?family=Lato:900' rel='stylesheet' type='text/css'>
</head>

<body>
	<header>
		<h1>
			Dapper Gentlemen
		</h1>
			<h2>
				Designing the internet.
		 	</h2>
    </header>
  
	<section>
    	<p>
    		By using vW as a sizing unit we can have type, margins, containers and more scale to the screen width of the user.
    	</p>
		<p>
			Not only can you scale type to the user's viewport, you can scale anything that allows sizing to scale to the viewport as well. Containers for example.
	    </p>
	</section>
</body>
</html>
body {
	background-color:   #ff5442;
  font-family:        ‘Lato’, Arial, sans-serif; 
  margin:             2vw;
  
}

h1 {
	color:              #fff;
	font-size:          6vw;
	font-weight:        900;
	text-transform:     uppercase;
  line-height:        .3vw;
	}

h2 {
  color:              #fff;
  font-size:          4vw;
}

p {
  color:              #fff;
  font-size:          1em;
}

External CSS

This Pen doesn't use any external CSS resources.

External JavaScript

This Pen doesn't use any external JavaScript resources.