.recipe .main {
	font-size: 14px;
}

.recipe .preamble {
	display: flex;
	justify-content: space-evenly;
	flex-wrap: wrap;
}

.recipe .summary {
	max-width: 540px;
	padding-right: 20px;
}

.recipe .heading {
	font-size: 20px;
	margin-bottom: 10px;
	text-align: center;
}

.recipe .title {
	font-weight: 700;
}

.recipe .summary .facts {
	display: flex;
	justify-content: center;
}

.recipe .summary .facts > div {
	margin: 0 15px;
}

.recipe .summary .times {
	font-size: 12px;
	width: 125px;
}

.recipe .summary .times > div {
	display: flex;
	justify-content: space-between;
}

.recipe .intro {
	text-indent: 20px;
	margin-top: 10px;
}

.recipe .primaryImage {
	margin-bottom: 10px;
	margin-top: 10px;
}

.recipe .primaryImage img {
	width: 400px;
}

.recipe .recipeNote, .recipe .step {
	margin-top: 20px;
	padding-top: 20px;
	border-top: 2px dotted #999999;
	display: flex;
}

.recipe .step {
	justify-content: left;
}

.recipe .step .title {
	font-size: 16px;
}

.recipe .step .stepNumber > div {
	width: 38px;
	height: 38px;
	border-radius: 25px;
	border: 3px solid #007700;
	text-align: center;
	vertical-align: middle;
	font-size: 30px;
	margin-right: 20px;
}

.recipe .step .stepDetails {
	display: flex;
	justify-content: space-between;
	flex-wrap: wrap;
}

.recipe .step .stepDetails .head {
	margin-top: 5px;
	margin-bottom: 3px;
	color: #586b90;
	font-weight: 700;
}

.recipe .step .stepDetails .stepInfo {
	width: 650px;
}

.recipe .step .ingredient {
	display: flex;
	justify-content: space-between;
	margin-right: 20px;
}

.recipe .step .ingredient > div {
	font-size: 12px;
}

.recipe .step .ingredientQty {
	margin-right: 20px;
}

.recipe .step .stepHint {
	margin-top: 10px;
}

.recipe .stepContent {
	width: calc(100% - 65px);
}

.recipe .notes {
	margin-top: 20px;
	padding: 20px;
	border-top: 2px dotted #999999;
}

.expander {
	opacity: 0.03;
	cursor: pointer;
	width: 15px;
	margin: 20px auto 0;
}

.expander img {
	width: 15px;
}

.expanded {
	height: 50vh;
}