
@charset "utf-8";
/* Global Settings */
html {
	box-sizing: border-box;
}
*, *:before, *:after {
	box-sizing: inherit;
}
body {
    font-family: Helvetica;
    background-color: #F1F1F2;
    color: #000080;}
img {
	max-width: 100%;
}
h1, h2, h3, h4, h5, h6 {
  font-family: Verdana;
  color: #1A2040; }

h1 {
  font-size: 1.75em; }

h2 {
  font-size: 1.5em; }

h3 {
  font-size: 1.25em; }

p {
  font-size: 1 em;
  line-height: 1.5em;	
}

p a:focus, p a:hover {
      border: medium solid #1D2349;
      text-decoration: none;
      color: #1D2349;
      background-color: rgba(238, 153, 34, 0.1); }

cite a:focus, cite a:hover {
      border: medium solid #1D2349;
      text-decoration: none;
      color: #1D2349;
      background-color: rgba(238, 153, 34, 0.1); }

ul.learn {
	list-style-type: square;
	line-height: 2.5em;
	display: inline-block;
	text-align: left;
}

li a:focus, li a:hover {
      border: medium solid #1D2349;
      text-decoration: none;
      color: #1D2349;
      background-color: rgba(238, 153, 34, 0.1);
	}

.imageBorder {
	border-style: solid;
	border-width: thin;
	border-color: #181E41;
	border-radius: .25em;
}
.largeText {
	font-size: 1.5em;
	font-weight: bold;
}
/* form styling */
.contact {
	border: thin solid #1D2349;
	border-radius: .25em;
	padding: 1em;
}

/* 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;
  }

/* Navigation */
.site-header {
  background: #1D2349;
  border-bottom-style: solid;
  border-bottom-color: #F1AA25;
  border-bottom-width: .25em;
  margin: 0;
}
nav ul {
  list-style-type: none;
  padding: .25em;
  margin: 0; }
.nav-item a {
  text-decoration: none;
  padding-left: 1.5em;
  padding-right: 1.5em;
  color: #F1F1F2; }
.nav-item a:focus, .nav-item a:hover {
    color: #F1AA25;
    border: medium; }

/* Footer */
.site-footer {
  list-style-type: none;
  background: #1D2349;
  justify-content: space-between; 
  border-top-style: solid;
  border-top-color: #F1AA25;
  border-top-width: .25em;
  margin: 0;
}
.social-menu a {
	color: #F1F1F2; 
    text-decoration: none;
	}
.social-menu a:before {
  font-family: FontAwesome;
  padding-right: .5em;
  padding-left: 1.5em; }
.social-menu a.facebook:before {
  content: '\f082'; }
.social-menu a.linkedin:before {
  content: '\f08c'; }
.social-menu a:focus, .social-menu a:hover {
  color: #F1AA25; }

.copyright {
  list-style-type: none;
  color: #F1F1F2;
  font-size: 90%;
  padding-left: 2em;
  padding-right: 1em;
  margin: 0;
  }

/* Form Elements */
input, textarea, select {
	font-family: inherit;
	width: 100%;
	maxwidth: 200px;
	padding: .5em;	
	margin: .5em;
	box-sizing: border-box;
	border: thin solid #1D2349;
	border-radius: .25em;	
}
textarea:focus, input:focus {
	border: thin double #1D2349;
	color: #1D2349;
    background-color: rgba(238, 153, 34, 0.1); 
}
label {
	float: left;
	margin: .25em;
}
input[type=submit] {
	width: 35%;
	text-align: center;
	background-color: #1D2349;
	color: #FFFFFF;
	border-radius: .25em;
}
input[type=submit]:hover {
	background-color: #FFFFFF;
	color: #1D2349;
	font-weight: 300;
	border: medium solid #1D2349;
}

/* Grid Structures */
/* Default, vertical layout for small screen */
.container {
	display: grid;
	grid-template-columns: repeat(12, 1fr);
	grid-gap: .25em;
	max-width: 1200px;
	margin: auto;
}

.branding, .certification, .sideBar, .content, .quote, .membership {
	justify-items: center;
	margin: auto;
}

.content, .quote, .sideBar, {
	text-align: center;
	margin: 0 auto;
}

.container > * {
	grid-column: 1 / span 12;
}

/* Media Queries */
/* Medium Size, two column */
@media (min-width: 675px) {
	#nav-list {
		display: flex;
		justify-content: space-between;
	}
	.branding {
		grid-column: 2 / span 6;
	}
	.certification {
		grid-column: 9 / span 4;
		justify-self: start;
	}
	.content {
		grid-column: 2 / span 7;
		grid-row: 4;
		text-align: left;
	}
	.membership {
		grid-column: 2 / span 3;
		margin: 0;
	}
	.sideBar {
		grid-column: 10 / span 3;
		grid-row: 4;
	}
	.about {
		grid-column: 10 / span 3;
		grid-row: 4;
	}
	.quote, .report {
		grid-column: 2 / span 8;
		grid-row: 5;
	}
	footer {
		grid-row: 6;
		display: flex;
	}
	.social-list {
		display: flex;
		grid-column: 1 / span 2;
	}
	.copyright {
		display: flex;
		grid-column: 4 / span 6;
		padding-right: 2em;
	}
}
/* Large Size, two column */
@media (min-width: 900px){
	.branding {
		grid-column: 2 / span 5;
	}
	.certification: {
		grid-column: 7 / span 2;
	}
	.content {
		grid-column: 2 / span 6;
	}
	.membership {
		margin: 0;
	}
	.sideBar {
		grid-column: 9 / span 4;
	}
}

