html,
	body {
		box-sizing: border-box;
		background-color: #265e6d;
		padding: 0;
		margin: 0 auto;
		color: #666666;
		font-family: 'Lato';
		font-weight: 400;
		font-size: 16px;
		line-height: 1.6rem;
	}
	::selection {
	  background: #b2deea;
		}
		::-moz-selection {
		  background: #b2deea;
		}
		*, *:before, *:after {
		  box-sizing: inherit;
		}

	p {
		margin-top: 1rem;
		margin-bottom: 0;
		}
		p.reference {
			margin-top: 0;
			padding-left: 1.5rem;
			font-style: italic;
		}
		h2 {
			color: #bd5331;
			font-weight: 700;
			font-size: 1.25rem;
			line-height: 1.75rem;
		}
		h3 {
			color: black;
			font-weight: 900;
			font-size: 0.9rem;
			margin-top: 3rem;
		}
		h2,
		h3 {
			text-transform: uppercase;
			letter-spacing: .1rem;
		}
		h4 {
			font-size: 1rem;
			color: black;
			font-style: italic;
			margin-bottom: 0;
		}
		a:link, a:visited {
			color: #bd5331;
			text-decoration: underline;
			}
			a:hover {
				color: #4fb1cc;
			}

	.container {
		max-width: 60rem;
		width: 100%;
		margin: 0 auto;
	}

	.logo {
		padding-top: 1.5rem;
		padding-bottom: 2rem;
		max-width: 20rem;
		}
		.logo img {
			width: 100%;
		}

	.nav {
		background-color: #337a8e;
		float: left;
		width: 100%;
		border-top-left-radius: .3rem;
		border-top-right-radius: .3rem;
		text-align: center;
		text-transform: uppercase;
		font-weight: 700;
		font-size: .85rem;
		letter-spacing: .1em;
		}
		.nav ul {
			list-style-type: none;
			padding: 0;
			display: inline-block;
			line-height: 1rem;
			}
			.nav li {
				float: right;
				padding: .3rem 1rem .18rem;
				/* border: 1px solid teal; */
			}
			.nav a:link, .nav a:visited {
				color: white;
				text-decoration: none;
				padding-bottom: 1.1rem;
				}
				.nav a:hover {
					color: #4fb1cc;
				}
                .page-beliefs    .nav .page-beliefs,
                .page-calendar   .nav .page-calendar,
                .page-contact    .nav .page-contact,
                .page-home       .nav .page-home,
                .page-ministries .nav .page-ministries,
                .page-staff      .nav .page-staff {
					color: #4fb1cc;
					background-image: url("images/pattern_nav-arrow.svg");
					background-size: 23px 10px;
					background-repeat: no-repeat;
					background-position: center bottom;
				}

	.content {
		clear: both;
		background-color: white;
		border-bottom-left-radius: .3rem;
		border-bottom-right-radius: .3rem;
		padding-bottom: 2rem;
		}
		.section {
			padding: 3rem 5.5rem 3.8rem 5.8rem;
			/* position: relative; */
			display: inline-block;
			width: 100%;
			/* background-color: black; */
			/* outline: 10px solid yellow; */
		}
		hr {
			border: 0;
			height: 1px;
			background-color: #d3d3d3;
			clear: both;
			margin: 0;
		}

	.home .hero {
		background-image: url("images/crosses.png");
		background-size: 208px auto;
		background-repeat: no-repeat;
		background-position: left 10rem bottom -1px;
		}
		.home .hero p {
			color: #265e6d;
			font-family: 'Bilbo Swash Caps', cursive;
			float: right;
			text-indent: -1rem;
			font-size: 2.5rem;
			line-height: 3.7rem;
			margin-right: 2rem;
		}
		.home .overview {
			width: 90%;
			margin: 0 auto;
		}
		.home .overview .services,
		.home .overview .location {
			text-align: center;
			width: 50%;
			float: left;
			padding: 2rem 0;
			}
			.home .overview a:link,
			.home .overview a:visited {
				/* color: inherit; */
				/* text-decoration: none; */
				}
				.home .overview a:hover {
					/* color: #4fb1cc; */
					/* text-decoration: underline; */
				}
			.home .overview h3 {
				margin: .3rem 0;
			}
			.home .overview img {
				width: 37px;
			}
		.home p.description {
			text-align: center;
			padding: 1rem 1rem 0;
		}

	.ministries .content,
	.staff .content {
		padding-bottom: 4rem;
		}
	.ministries .section,
	.staff .section {
		padding-bottom: 1rem;
		}
		.ministries .section .title,
		.staff .section .title,
		.contact .section .title {
			position: relative;
			float: left;
			width: 100%;
			margin-bottom: 1rem;
			}
			.ministries .title::after,
			.staff .title::after,
			.contact .title::after {
				content: "";
				border-top: 1px solid #d3d3d3;
				position: absolute;
				left: -5.8rem;
				right: -5.5rem;
				top: 2rem;
				display: block;
				z-index: 1;
			}
		.ministries .title img,
		.staff .title img,
		.contact .title img {
			width: 165px;
			z-index: 2;
			position: absolute;
			float: left;
			border: 7px solid white;
			-webkit-box-shadow: 1px 1px 7px 0px rgba(0,0,0,0.2);
			-moz-box-shadow: 1px 1px 7px 0px rgba(0,0,0,0.2);
			box-shadow: 1px 1px 7px 0px rgba(0,0,0,0.2);
		}
		.ministries .title h2,
		.staff .title h2,
		.staff .bio {
			margin-left: 190px;
			margin-top: 3.5rem;
		}
		.ministries .column {
			width: 50%;
			float: left;
			padding-right: 1rem;
			margin-bottom: 3.5rem;
			}
			.ministries .column h3:first-child {
				margin-top: 1rem;
			}
			.ministries .column:last-child {
				padding-right: 0;
				padding-left: 1rem;
			}
		.ministries .children .column:first-child {
			padding-bottom: 5rem;
		}

	.staff .overview .column {
		/* outline: 1px solid gray; */
		width: 50%;
		float: left;
		min-width: 10rem;
		/* padding: 1rem; */
		margin-right: .5rem;
		}
		.staff .overview .table {
			display: table;
			/* outline: 1px solid gray; */
			width: 100%;
			}
			.staff .overview .row {
				display: table-row;
				/* outline: 1px solid gray; */
			}
			.staff .overview .cell {
				display: table-cell;
				/* outline: 1px solid red; */
				width: 50%;
			}
			.staff .overview .group {
				/* outline: 2px solid green; */
				display: table;
				width: 100%;
			}
			.staff .overview .entry {
				display: table-cell;
				/* outline: 1px solid blue; */
				width: 50%;
				padding: 0 .5rem;
				}
				.staff .overview .cell:first-child .group {
					margin-left: -0.5rem;
				}
				.staff .overview .cell:last-child .group {
					margin-right: -0.5rem;
				}
		.staff .overview ul {
			list-style-type: none;
			padding-left: 0;
		}
		.staff .overview a:link,
		.staff .overview a:visited {
			color: inherit;
			text-decoration: none;
			}
			.staff .overview a:hover {
				color: #bd5331;
				text-decoration: underline;
			}

	.contact .hero p {
		color: #265e6d;
		font-family: 'Bilbo Swash Caps', cursive;
		text-align: center;
		font-size: 2.5rem;
		line-height: 3.7rem;
		}
		.contact a:link.secondary,
		.contact a:visited.secondary {
			color: inherit;
			}
			.contact a:hover.secondary {
				color: #bd5331;
			}
		.contact .title img {
			width: 400px;
			}
			.contact .title h2,
			.contact .title p {
				margin-left: 430px;
				}
				.contact .title h2 {
					margin-top: 3.5rem;
				}
		.contact .title::before {
			content: "";
			border-bottom: 1px solid #d3d3d3;
			position: absolute;
			left: -5.8rem;
			right: -5.5rem;
			bottom: -2rem;
			display: block;
			z-index: 1;
		}
		.contact iframe.map {
			float: left;
			width: 400px;
			margin-right: 30px;
		}

	.footer {
		max-width: 60rem;
		color: white;
		padding: 2rem 1rem 5rem;
		}
		.footer .logo {
			max-width: 180px;
			float: left;
			padding: 0;
			margin-bottom: 2rem;
		}
		.footer a:link, .footer a:visited {
			text-decoration: none;
			color: white;
			}
			.footer a:hover {
				text-decoration: underline;
			}
		.contact .section {
			padding-top: 0;
			}
			.contact .hero {
				padding-top: 3rem;
			}
		.contact_info {
			float: right;
		}
		.contact_info div {
			float: left;
			margin-right: 2rem;
			margin-bottom: 1rem;
			}
			.contact_info div:last-child {
				margin-right: 0;
			}
			.contact_info img {
				height: 23px;
				float: left;
				margin-top: .2rem;
			}
			.contact_info p {
				float: left;
				margin-top: 0;
				margin-left: .8rem;
			}

	.clearfix:after {
		content: "";
		display: block;
		clear: both;
	}

	iframe.calendar {
		width: 100%;
	}

	.modal-container {
		position: absolute;
		display: none;
		z-index: 999;
		-webkit-overflow-scrolling: touch;
		}
		.modal-container:target {
			display: block;
			pointer-events: auto;
		}
		a.modal-close {
			background-color: rgba(38, 94, 109, 0.9);
			display: inline-block;
			position: fixed;
			top: 0;
			left: 0;
			width: 100%;
			height: 100%;
			overflow-y: scroll;
			text-align: center;
			color: #666666;
			}
			a.modal-close:hover {
				/* border-bottom: none; */
			}
			a.modal-close:hover .modal-contents {
				color: #666666;
			}
			.modal-contents {
				background-color: #eceff4;
				padding: 2em 2em 7em;
				display: inline-block;
				margin: 4em auto;
				}
				.modal-contents>div {
					max-width: 65em;
					margin: 0 5%;
					clear: both;
					/* outline: 2px solid red; */
					}
					.modal-contents>div img {
						width: 100%;
					}
					.modal-contents .col-2 {
						/* padding-bottom: 10em; */
						/* border-top: 1px solid black; */
						/* display: inline-block; */
					}
			.modal-close .button {
				margin-bottom: 2em;
			}
			p.close-link {
				text-align: right;
				margin-top: 0;
				color: #bd5331;
				}
				p.close-link:hover {
					text-decoration: underline;
				}
				p.subtitle {
					font-style: italic;
					margin-top: 0;
				}
			.modal-container hr {
				margin: 40px 0;
			}
			.modal-contents>div {
				text-align: left;
			}


/* ---------- MOBILE STYLES ---------- */

.mobile-show, .tablet-show {font-size: 0%; max-height: 0; overflow: hidden; display: none;}

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

	/* Hides elements on tablet */
	.tablet-hide {display: none;}

	/* Show elements on tablet */
	.tablet-show {
		display: block;
		margin: 0;
		padding: 0;
		overflow: visible;
		width: auto;
		max-height: inherit;
		font-size: inherit;
	}

	.home .hero {
		background-position: left 3rem bottom -1px;
		}
		.home .hero p {
			font-size: 2rem;
			line-height: 3rem;
			margin-right: 0;
		}
		.home .overview {
			width: 100%;
		}
	.ministries .column {
		width: 100%;
		float: left;
		padding-right: 0;
		}
		.ministries .column:last-child {
			padding-left: 0;
			margin-top: 0;
		}
		.ministries .column:last-child h3:first-child {
			margin-top: 3rem;
		}
		.ministries .modal-contents .col-2 div .column:first-child {
			margin-bottom: 0;
		}
	.staff .overview .cell {
		display: block;
		float: left;
		width: 100%;
		}
		.staff .overview .group {
			margin-left: -0.5rem;
		}
	.contact .title img {
		width: 200px;
		}
		.contact .title h2,
		.contact .title p {
			margin-left: 230px;
		}
		.contact .hero {
			padding-top: 2rem;
			padding-bottom: 2rem;
		}
		.contact .section:nth-child(2) {
			padding-bottom: 0;
		}
		.contact iframe.map {
			width: 200px;
		}
	.footer {
		text-align: center;
		margin: 0 auto;
		}
		.footer .logo {
			clear: right;
			width: 100%;
			max-width: 100%;
			display: inline-block;
			text-align: center;
			}
			.footer .logo img {
				max-width: 180px;
			}
		.footer .contact_info {
			display: inline-block;
			float: none;
		}
}

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

	/* Hides elements on mobile */
	.mobile-hide {display: none;}

	/* Show elements on mobile */
	.mobile-show {
		display: block;
		margin: 0;
		padding: 0;
		overflow: visible;
		width: auto;
		max-height: inherit;
		font-size: inherit;
	}
	html, body {
		padding: 0;
		font-size: 14px;
	}
	.logo {
		margin: 0 auto;
		}
	.nav {
		width: 100%;
		}
		.nav a {
			border-bottom: 2px solid #265e6d;
			padding-bottom: 15px;
			padding-top: 15px;
			float: left;
			clear: both;
			width: 100%;
			}
      .page-beliefs    .nav .page-beliefs,
      .page-calendar   .nav .page-calendar,
      .page-contact    .nav .page-contact,
      .page-home       .nav .page-home,
      .page-ministries .nav .page-ministries,
      .page-staff      .nav .page-staff {
				background-image: none;
			}
	.content {
		border-bottom-left-radius: 0;
		border-bottom-right-radius: 0;
	}
	.section {
		padding: 1.5rem 3rem 2rem;
	}
	.home .hero {
		background-position: center bottom -1px;
		}
		.home .hero p {
			float: none;
			text-align: center;
			text-indent: 0;
			font-size: 2rem;
			line-height: 3rem;
			margin-bottom: 8rem;
		}
		.home .overview .services,
		.home .overview .location {
			clear: both;
			width: 100%;
		}
		.ministries .title::after,
		.staff .title::after {
			top: 0;
		}
		.ministries .title img,
		.staff .title img {
			display: none;
		}
		.ministries .title h2,
		.staff .title h2,
		.staff .bio {
			margin-left: 0;
		}
		.ministries .column {
			margin-top: 0;
			}
			.ministries .column:last-child h3:first-child {
				/* margin-top: 3rem; */
			}
			.ministries .children .column:first-child {
				padding-bottom: 3rem;
			}
	.contact .hero {
		padding-top: 1.5rem;
		padding-bottom: 0;
	}
	.contact .title img {
		display: none;
		}
		.contact .title h2,
		.contact .title p {
			margin-left: 0;
		}
		.contact iframe.map {
			display: none;
		}
	.footer .logo {
		margin-top: 2rem;
		}
		.footer .contact_info div {
			float: left;
			clear: both;
		}

}