/*--------------------------------------------------------------
Accessibility
--------------------------------------------------------------*/
/* Text meant only for screen readers */
.screen-reader-text {
	clip: rect(1px, 1px, 1px, 1px);
	position: absolute !important;
	height: 1px;
	width: 1px;
	overflow: hidden;
}

.screen-reader-text:hover,
.screen-reader-text:active,
.screen-reader-text:focus {
	background-color: #f1f1f1;
	border-radius: 3px;
	box-shadow: 0 0 2px 2px rgba(0, 0, 0, 0.6);
	clip: auto !important;
	color: #21759b;
	display: block;
	font-size: 14px;
	font-weight: bold;
	height: auto;
	left: 5px;
	line-height: normal;
	padding: 15px 23px 14px;
	text-decoration: none;
	top: 5px;
	width: auto;
	z-index: 100000; /* Above WP toolbar */
}

/*--------------------------------------------------------------
Typography
--------------------------------------------------------------*/

body {
	margin: 0;
}

body,
button,
input,
select,
textarea {
	font-family: 'Meriweather', 'Times', serif;
	font-size: 18px;
	line-height: 1.5;
}

h1,
h2,
h3,
h4,
h5,
h6 {
	clear: both;
}

p {
	margin-bottom: 1.5em;
}

b,
strong {
	font-weight: bold;
}

dfn,
cite,
em,
i {
	font-style: italic;
}

blockquote {
	margin: 0 1.5em;
}

address {
	margin: 0 0 1.5em;
}

pre {
    display: inline-block;
    font-family: "Courier 10 Pitch", Courier, monospace;
    color: #ddca7e;
    background: #282c34;
	padding: .5em .8em;
    border-radius: .2em;
}

code,
kbd,
tt,
var {
	font: 15px Monaco, Consolas, "Andale Mono", "DejaVu Sans Mono", monospace;
}

abbr,
acronym {
	border-bottom: 1px dotted #666;
	cursor: help;
}

mark,
ins {
	background: #fff9c0;
	text-decoration: none;
}

sup,
sub {
	font-size: 75%;
	height: 0;
	line-height: 0;
	position: relative;
	vertical-align: baseline;
}

sup {
	bottom: 1ex;
}

sub {
	top: .5ex;
}

small {
	font-size: 75%;
}

big {
	font-size: 125%;
}

figure {
	margin: 0;
}


/*--------------------------------------------------------------
General styling
--------------------------------------------------------------*/


img {
	display: block;
	border: 0;
	max-width: 100%;
	height: auto;
}

/* Header */

.masthead {
	text-align: left;
}


/*--------------------------------------------------------------
Cards:
--------------------------------------------------------------*/

.cards {
	margin: 1em;
	padding: 0;
	list-style-type: none;
}

.cards a {
	display: block;
	text-decoration: none;
}

.caption {
	padding: 1em;
	background: hsla(120,100%,25%,0.5);
	color: white;
	transition: all .4s;
}

a:focus .caption,
a:hover .caption {
	background: hsla(120,100%,25%,1);
}

.caption-title {
	margin: 0;
	font-size: 1em;
	line-height: 1.1em;
	font-family: 'Open Sans', Arial, sans-serif;
}

/*--------------------------------------------------------------
Custom
--------------------------------------------------------------*/

body {
	background-color: #f8f9e8;
	font-size: 1em;
}
.intro,
.masthead {
	padding-left: 1em;
	line-height: 1.2
}

.intro img {
	float: left;
	max-width: 16%;
	margin: 0 1em 0 1em;
}

.section-title {
	font-size: 1.2em;
	font-weight: bold;
	padding: 0 .5em 0 .5em;
	
}

.section:nth-child(1),
.section:nth-child(2) {
		padding: 0 1em 0 1em;
		text-align: justify;
}


.site-title {
	font-size: 1.5em;
}

#content{
	clear: left;
}

#footer {
	padding: 1em;
	/*border-top: 1px solid black;
	border-bottom: 1px solid black;*/
	margin-bottom: 2em;
	background-color: #000;
	color: #fff;
	text-align-last: center;
	font-size: 75%;
}

#footer p {
	margin: .2em;
}

.padright {
	padding-left: 2em;
}

.bullet {
	margin-top: -1em;
}

@media screen and (min-width: 501px) {

	.sections {
		display: grid;
		grid-template-columns: repeat(2, 1fr);
		grid-gap: 1em;
		/* For IE 10 */
		display: -ms-grid;
		-ms-grid-columns: 1fr 2.5em 1fr;
		padding-right: 1em;
	}

	.section:nth-child(1) {
		-ms-grid-column: 1;
		text-align: justify;
	}

	.section:nth-child(2) {
		-ms-grid-column: 3;
		text-align: justify;
	}

	.cards {
		display: grid;
		grid-gap: .5em;
		grid-template-columns: repeat(2, 1fr);
		/* For IE 10 */
		display: -ms-grid; 
	    -ms-grid-columns: 1fr .5em 1fr;
	    -ms-grid-rows: auto auto auto; 
	}

	.card-item:nth-child(1) {
		-ms-grid-column: 1;
		-ms-grid-row:1;
	}

	.card-item:nth-child(2) {
		-ms-grid-column: 3;
		-ms-grid-row:1;
	}

	.card-item:nth-child(3) {
		-ms-grid-column: 1;
		-ms-grid-row:2;
	}

	.card-item:nth-child(4) {
		-ms-grid-column: 3;
		-ms-grid-row:2;
	}

	.card-item:nth-child(5) {
		-ms-grid-column: 1;
		-ms-grid-row:3;
	}

	.card-item:nth-child(6) {
		-ms-grid-column: 3;
		-ms-grid-row:3;
	}

	.card-item:nth-child(7) {
		-ms-grid-column: 1;
		-ms-grid-row:4;
	}

	.card-item:nth-child(8) {
		-ms-grid-column: 3;
		-ms-grid-row:4;
	}

	.card-item:nth-child(9) {
		-ms-grid-column: 1;
		-ms-grid-row:5;
	}

	.card-item:nth-child(10) {
		-ms-grid-column: 3;
		-ms-grid-row:5;
	}

	.card-item:nth-child(11) {
		-ms-grid-column: 1;
		-ms-grid-row:6;
	}

	.card-item:nth-child(12) {
		-ms-grid-column: 3;
		-ms-grid-row:6;
	}

	.caption-title {
		font-size: .85em;
	}

	.bullets {
		display: -ms-grid;
		-ms-grid-columns: 1fr .5em 1fr;
		display: grid;
		grid-template-columns: 1fr 1fr;
	}

	.bullet:nth-child(1) {
		-ms-grid-column: 1;
		-ms-grid-row:1;
	}

	.bullet:nth-child(2) {
		-ms-grid-column: 1;
		-ms-grid-row:2;
	}

	#footer {
		font-size: 100%;
	}

}


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

		.sections {
			display: grid;
			grid-template-columns: repeat(2, 1fr);
			/* For IE 10 */
			display: -ms-grid;
			-ms-grid-columns: 1fr 2.5em 1fr;
			padding-right: 1em;
		}

		.section:nth-child(1) {
			-ms-grid-column: 1;
			text-align: justify;
		}

		.section:nth-child(2) {
			-ms-grid-column: 3;
			text-align: justify;
		}

		.cards {
			display: grid;
			grid-gap: .5em;
			grid-template-columns: repeat(3, 1fr);
			/* For IE 10 */
			display: -ms-grid; 
		    -ms-grid-columns: 1fr .5em 1fr .5em 1fr;
		    -ms-grid-rows: auto auto auto; 
		}

		.card-item:nth-child(1) {
			-ms-grid-column: 1;
			-ms-grid-row:1;
		}

		.card-item:nth-child(2) {
			-ms-grid-column: 3;
			-ms-grid-row:1;
		}

		.card-item:nth-child(3) {
			-ms-grid-column: 5;
			-ms-grid-row:1;
		}

		.card-item:nth-child(4) {
			-ms-grid-column: 1;
			-ms-grid-row:2;
		}

		.card-item:nth-child(5) {
			-ms-grid-column: 3;
			-ms-grid-row:2;
		}

		.card-item:nth-child(6) {
			-ms-grid-column: 5;
			-ms-grid-row:2;
		}

		.card-item:nth-child(7) {
			-ms-grid-column: 1;
			-ms-grid-row:3;
		}

		.card-item:nth-child(8) {
			-ms-grid-column: 3;
			-ms-grid-row:3;
		}

		.card-item:nth-child(9) {
			-ms-grid-column: 5;
			-ms-grid-row:3;
		}

		.card-item:nth-child(10) {
			-ms-grid-column: 1;
			-ms-grid-row:4;
		}

		.card-item:nth-child(11) {
			-ms-grid-column: 3;
			-ms-grid-row:4;
		}

		.card-item:nth-child(12) {
			-ms-grid-column: 5;
			-ms-grid-row:4;
		}

		.footer {
			margin: 0 2em 0 2em;
		}

		.caption-title {
			font-size: .85em;
		}
	}


	@media screen and (min-width: 1200px) {

		.sections {
			display: -ms-grid;
			-ms-grid-columns: 1fr 2.5em 1fr;
			padding-right: 1em;
		}

		.section:nth-child(1) {
			-ms-grid-column: 1;
			text-align: justify;
		}

		.section:nth-child(2) {
			-ms-grid-column: 3;
			text-align: justify;
		}

		.cards {
			grid-template-columns: repeat(4, 1fr);
			/* For IE 10 */
			display: -ms-grid; 
		    -ms-grid-columns: 1fr .5em 1fr .5em 1fr .5em 1fr;
		    -ms-grid-rows: auto auto auto; 
		}

		.card-item:nth-child(1) {
			-ms-grid-column: 1;
			-ms-grid-row:1;
		}

		.card-item:nth-child(2) {
			-ms-grid-column: 3;
			-ms-grid-row:1;
		}

		.card-item:nth-child(3) {
			-ms-grid-column: 5;
			-ms-grid-row:1;
		}

		.card-item:nth-child(4) {
			-ms-grid-column: 7;
			-ms-grid-row:1;
		}

		.card-item:nth-child(5) {
			-ms-grid-column: 1;
			-ms-grid-row:2;
		}

		.card-item:nth-child(6) {
			-ms-grid-column: 3;
			-ms-grid-row:2;
		}

		.card-item:nth-child(7) {
			-ms-grid-column: 5;
			-ms-grid-row:2;
		}

		.card-item:nth-child(8) {
			-ms-grid-column: 7;
			-ms-grid-row:2;
		}

		.card-item:nth-child(9) {
			-ms-grid-column: 1;
			-ms-grid-row:3;
		}

		.card-item:nth-child(10) {
			-ms-grid-column: 3;
			-ms-grid-row:3;
		}

		.card-item:nth-child(11) {
			-ms-grid-column: 5;
			-ms-grid-row:3;
		}

		.card-item:nth-child(12) {
			-ms-grid-column: 7;
			-ms-grid-row:3;
		}

		.caption-title {
			font-size: .85em;
		}

		.intro .section-body {
			padding-right: 5em;
		}
	}
}
