/*
	###########
	Start ipad-mini style
	###########
*/
.second-submit {
	display: none;
}

@media all and (max-width: 1500px) {
	.field-input {
		margin-bottom: 25px;
	}

	.area-column.area-submit {
		display: none;
	}
	.second-submit {
		display: block;
	}
}

@media all and (max-width: 1300px) {
	.field-input {
		min-width: 0;
	}
}

@media all and (max-width: 1280px) {
	.step-title-container {
		padding: 60px 60px 60px 0;
		width: 340px;
	}
}

@media all and (max-width: 1000px) {
	#header {
		padding: 20px 15px;
	}
	.step-table-container {
		display: block;
		height: 100%;
		padding: 0;
		table-layout: inherit;
		width: 100%;
	}

	.step-title-container {
		display: block;
		padding: 20px 60px 60px;
		position: relative;
		text-align: center;
		vertical-align: middle;
		width: 100%;
	}

	.step-title-container:after {
		background-color: #1a1a1a;
		border-radius: 50%;
		bottom: -40px;
		content: attr( data-title );
		color: #fff;
		display: block;
		font-family: 'Lustria', serif;
		font-size: 180%;
		height: 80px;
		line-height: 80px;
		margin: 0 -40px 0 0;
		position: absolute;
		right: 50%;
		top: auto;
		text-align: center;
		width: 80px;
		z-index: 99;
	}

	.step-form-container {
		background: rgba( 255, 255, 255, .9 );
		display: block;
		height: 100%;
		padding: 60px 20px 20px;
		position: relative;
		text-align: center;
		width: 100%;
	}

	.area-container {
		margin: 0 auto;
		max-width: 250px;
		width: 100%;
	}

	img.mls {
		display: block;
		margin: 10px auto;
	}

	.area-container .area-column {
		padding: 0 20px;
		width: 33.3%;
	}

	body {
		font-size: 11pt;
	}

	h1,
	.heading.one {
		font-size: 240%;
		line-height: 1em;
		margin-bottom: 5px;
	}


	h3,
	.heading.three {
		font-size: 150%;
	}

	h4.heading.four {
		font-size: 130%;
	}

	h5,
	.heading.five {
		font-size: 110%;
		max-width: 300px;
		margin: 0 auto 20px;
		text-align: left;
		width: 100%;
	}
}

@media all and (max-width: 768px) {

	h1,
	.heading.one {
		line-height: 1em;
		font-size: 200%;
	}

	h3 br,
	.heading.three br {
		display: none;
	}

	.step-title-container {
		padding: 20px 60px 40px;
	}

	.step-title-container:after {
		background-color: #1a1a1a;
		border-radius: 50%;
		bottom: -30px;
		content: attr( data-title );
		color: #fff;
		display: block;
		font-family: 'Lustria', serif;
		font-size: 130%;
		height: 60px;
		line-height: 60px;
		margin: 0 -30px 0 0;
		position: absolute;
		right: 50%;
		top: auto;
		text-align: center;
		width: 60px;
		z-index: 99;
	}

	/*--- HEADER ---*/

	img.left {
		max-width: 315px;
	}

	img.right {
		max-width: 315px;
	}

	img.right,
	img.left {
		float: none!important;
		margin-left: 0;
		margin-bottom: 10px;
		max-width: 100%;
		padding: 0px;
	}

	.area-container .area-column {
		display: block;
		padding: 0;
		width: 100%;
	}

	.field-input {
		margin-bottom: 10px;
	}

	.area-container .area-column.area-submit {
		display: none;
	}

	.area-input,
	.second-submit {
		margin-top: 20px;
	}

	.evaluation .wrapper.small {
		max-width: 100%;
		overflow: hidden;
	}

	.evaluation .heading.five {
		margin: 0 0 20px;
	}

	.evaluation .heading.five br {
		display: none;
	}

	.evaluation .step.one .form-input input[type="text"] {
		display: block;
		margin-bottom: 5px;
		max-width: 100%;
		vertical-align: bottom;
	}

	.evaluation .step.one .form-input input[type="submit"] {
		width: 100%;
	}

	.evaluation .step.four .form-field {
		grid-template-columns: 1fr;
	}

	.evaluation .step.four .form-field .step-4-picture {
		grid-row: 1;
	}

}