/* ===========================================================================
   Contact block without the message form.

   assets/css/main.css's own #contact rules are built for a form (60% wide)
   next to this "split" section (40% wide, its two children stacked with a
   line between them). Once the form is gone -- see
   _code/partials/contact.html -- .split is the only child left, so this
   turns it back into two even columns: Email on the left, Phone on the
   right, with a line between them instead of above.
   =========================================================================== */

#contact > .inner {
	padding: 4em 3em !important;
}

#contact > .inner > .split {
	display: -webkit-flex;
	display: flex;
	width: 100%;
	padding: 0;
}

#contact > .inner > .split > * {
	-webkit-flex: 1 1 50%;
	flex: 1 1 50%;
	padding: 0 2em;
}

#contact > .inner > .split > *:before {
	display: none;
}

#contact > .inner > .split > :first-child {
	padding-left: 0;
}

#contact > .inner > .split > :last-child {
	padding-right: 0;
	border-left: solid 1px rgba(212, 212, 255, 0.1);
}

@media screen and (max-width: 736px) {

	#contact > .inner > .split {
		display: block;
	}

	#contact > .inner > .split > * {
		padding: 0;
	}

	#contact > .inner > .split > :last-child {
		border-left: 0;
		border-top: solid 1px rgba(212, 212, 255, 0.1);
		margin-top: 2em;
		padding-top: 2em;
	}

}