html, body, div, h1, h2, h3, h4, h5, h6, p, pre, blockquote, address, img, dl,
dt, dd, ol, ul, li, table, caption, tbody, tfoot, thead, tr, th, td, form, input,
fieldset, legend, object, embed {
  border: 0;
  margin: 0;
  padding: 0;
}

html {
   font-family: 'Avenir Next';
}

body {
	margin-bottom: 135px;
	color: #6D6D6D;
	font-size: 16px;
}

h1 {
 	font-family: 'AvenirNext-DemiBold';
  font-size: 26px;
  margin: 0;
  margin-bottom: 30px;
  background: #69D2E7;
 	color: white;
	padding-left: 10px;
	padding-top: 6px;
	padding-bottom: 4px;
 	-webkit-border-top-left-radius: 3px;
  -webkit-border-top-right-radius: 3px;
}


h2 {
	font-family: 'AvenirNext-DemiBold';
  font-size: 18px;
	color: #6D6D6D;
	font-weight: normal;
 	margin: 0;
 	padding: 0;
}

h3 {
  font-size: 21px;
  color: #6D6D6D;
}

.title {
	margin: 0px;
	padding: 0px;	
  font-family: 'AvenirNext-DemiBold';
  font-size: 20px;
  font-weight: normal;
  margin-bottom: 10px;
  color: #6D6D6D;
  text-shadow: none;
}

.title-line {
	margin-top: -12px;
	padding: 0px;
	height: 1px;
	background: rgba(160, 142, 120, 0.9);
}

.description {
  color: #6D6D6D;
  margin-top: 10px;
	margin-bottom: 20px;
}

.description > .code {
  font-family: courier;
}

.description.intro {margin-bottom: 0px;}

*.wrapper {
	margin: 0px;
	max-width: 800px;
}


*.wrapper-left{
	float: left;
	width: 50%;
	padding-top: 0px;
	padding-bottom: 10px;
}

*.wrapper-code{
	float: right;
	width: 40%;
	font-size: 16px;
	line-height: 20px;
	padding-right: 20px;
	padding-top: 0px;
	padding-bottom: 10px;
	font-family: courier;
}

*.wrapper-intro {
	margin: 0px;
	padding: 0px;
	padding-bottom: 10px;
}

.first-section-wrapper {
  display: block;
}

.section-wrapper {
	position: relative;
  display: inline-block;
  width: 100%;
  max-width: 800px;
	height: auto;
	
}

.section-wrapper.space {margin-bottom: 50px;}