.clear, .clearfix { clear: both; }
.clear:after, .clearfix:after { visibility: hidden; display: block; font-size: 0; content: " "; clear: both; height: 0; }
div, span, ul, li, img, header, nav, footer, main, article, aside, section { position: relative; box-sizing: border-box; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; }


html, body { position: relative; width: 100%; height: 100%; padding: 0 0; margin: 0 0; }
body { display: flex; flex-flow: row wrap; justify-content: center; align-items: center; background: #f2f0e7; font-size: 1.1rem; line-height: 1.7rem; font-weight: 400; font-family: 'Figtree', sans-serif; color: #333; }

	a, a:visited { text-decoration: none; color: #333; }
	a:active, a:hover { text-decoration: none; color: #333; }
	
	
	h1, h2, h3, h4, h5, h6 { margin: 0 0 40px; color: #333; letter-spacing: 0px; line-height: 1em; font-weight: 300; font-family: 'Barlow Semi Condensed', serif; text-shadow: none; }



#container { width: 600px; max-width: 90%; margin: 0 auto; border: 5px solid #D1D1D1; padding: 70px; text-align: center; background: #fff; box-shadow: 0 10px 60px rgba(0,0,0,0.2); border-radius: 10px; -webkit-border-radius: 10px; }

	#container h1 { font-size: 3rem; line-height: 3rem; }
	#container h2 { font-size: 2.4rem; line-height: 2rem; }
	
	
	
	
@media only screen and ( max-width: 479px ) {
	#container { width: 90%; border: 5px solid #D1D1D1; padding: 30px; box-shadow: 0 10px 60px rgba(0,0,0,0); }
		#container h1 { font-size: 2rem; line-height: 2rem; }
		#container h2 { font-size: 1.4rem; line-height: 1rem; }
}