/*! site styles */
/*
	Breakpoints
	s-tab:   25em / 400px 
	l-tab:   43.75em / 700px
	desk:    56.25em / 900px
	m-desk:  71.875em / 1150px
	l-desk:  81.25em / 1300px

MQ Block:

@media only screen and (min-width: 25em) {
    
}

@media only screen and (min-width: 43.75em) {
    
}

@media only screen and (min-width: 56.25em) {
    
}

@media only screen and (min-width: 81.25em) {
    
}

Colors:

Orange: #DC5705;
Lightest Blue: #B7D0E8;
Light Blue: #8BB1DD;
Blue: #4A90E2;
Dark Blue: #35475B;

Gray: #494949;

Fonts: 

Serif: "Alegreya", Georgia, "New Times Roman", serif;
Sans-serif: "Fira Sans", Helvetica, Arial, sans-serif;


*/

/* ==========================================================================
   HTML Elements
   ========================================================================== */

body {
  background-color: #F4F3EF;
}

body, 
p, 
th, 
td, 
ul, 
li {
	font-family: Georgia, "New Times Roman", serif;
}

h1 {
	color: #35475B;
	font-family: Georgia, "New Times Roman", serif;
	font-size: 3em;
	font-weight: bold;
	letter-spacing: -1px;
}

h2 {
	font-family: Georgia, "New Times Roman", serif;
	font-style: italic;
	font-weight: 300;
	letter-spacing: -1px;
}

h3 {
	font-family: Georgia, "New Times Roman", serif;
}

h4 {
	font-family: Georgia, "New Times Roman", serif;
}

h5 {
	font-family: Georgia, "New Times Roman", serif;
}

h6 {
	font-family: Georgia, "New Times Roman", serif;
}

p {
	margin: 0 0 1em 0;
}

a:link {
  color: blue;
  -webkit-text-decoration-skip: skip;
  text-decoration-skip: ink;
}

a:visited {
  color: purple;
}

a:hover {
  color: navy;
}

a:active {
  color: red;
}

a:focus {
  color: red;
}

img {
	height: auto;
	margin: 0;
	max-width: 100%;
	padding: 0;
	width: 100%;
}

figure {
	margin: 0;
	padding: 0;
}

/* ==========================================================================
   Responsive Typography
   ========================================================================== */

p, h1, h2, h3, h4, h5, h6 {
	margin-left: auto;
	margin-right: auto;
	-webkit-transition: font-size linear 0.15s;
	-moz-transition: font-size linear 0.15s;
	transition: font-size linear 0.15s; 	
}

p {
	font-size: 1.125em;
	line-height: 1.4375;
	max-width: 40em;
}
.wf-inactive p {
	font-family: Georgia, "New Times Roman", serif;;
	font-size: 1.1em;
	line-height: 1.45;
}
	@media only screen and (min-width: 81.25em) {
	    p {
		    font-size: 1.3333em;
		    line-height: 1.5;
		}
	    .wf-inactive p {
		    font-size: 1.095em;
		    letter-spacing: -0.4px;
		    line-height: 1.55;
		}
	}


h1 {
	font-size: 3em;
	line-height: 1.15;
	margin-top: 0.5em;
	margin-bottom: 0.25em;
}
.wf-inactive h1 {
	font-family: "New Times Roman", serif;
	font-size: 3.08em;
	font-weight: bold;
	line-height: 1.15
}
	@media only screen and (min-width: 25em) {
    h1 {
	    font-size: 3.25em;
	    line-height: 1.25;
		}
		.wf-inactive h1 {
			font-size: 3.3em;
			line-height: 1.25; 
			letter-spacing: 0;
			margin-top: 0.55em;
		}
	}
	
	@media only screen and (min-width: 43.75em) {
    h1 { 
	    font-size: 4.5em;
	    line-height: 1.125;
		}
		.wf-inactive h1 {
			font-size: 4.375em;
			line-height: 1.1;
			margin-top: 0.5em;
		}
	}
	
	@media only screen and (min-width: 56.25em) {
    h1 { 
    	font-size: 5em;
	    line-height: 1;
    }
		.wf-inactive h1 {
			font-size: 4.9em;
			margin-top: 0.45em;
		}
	}
	
	@media only screen and (min-width: 81.25em) {
    h1 { 
    	font-size: 6em;
	    line-height: 1;
    }
		.wf-inactive h1 {
			font-size: 3.9em;
			letter-spacing: 0;
			line-height: 1.15;
			margin-top: 0.45em;
		}
	}

h2 {
	font-size: 1.625em;
	line-height: 1.125;
	margin-top: 0.5em;
	margin-bottom: 0.125em;
}
.wf-inactive h2 {
	font-family: "New Times Roman", serif;
	font-size: 1.625em;
	line-height: 1.125; 
	letter-spacing: -1px;
	margin-top: 0.5em;
}
	@media only screen and (min-width: 25em) {
	    h2 {
		    font-size: 1.7em;
		    line-height: 1.125;
			}
			.wf-inactive h2 {
				font-size: 1.75em;
				line-height: 1.125; 
			}
	}
	
	@media only screen and (min-width: 43.75em) {
	    h2 { 
		    font-size: 2em;
		    line-height: 1.125;
		    max-width: 21.5em; /* 43/2 */
			}
			.wf-inactive h2 {
				font-size: 2em;
				line-height: 1.125; 
			}
	}
	
	@media only screen and (min-width: 56.25em) {
	    h2 { 
	    	font-size: 2.45em;
		    line-height: 1.125;
		    max-width: 19.11111111111111em; 
	    }
			.wf-inactive h2 {
				font-size: 2.35em;
				line-height: 1.125; 
		    max-width: 20em; 
			}
	}
	
	@media only screen and (min-width: 81.25em) {
	    h2 { 
	    	font-size: 2.65em;
		    line-height: 1.125;
		    max-width: 21.5em;
	    }
			.wf-inactive h2 {
				font-size: 2.5em;
				line-height: 1.125; 
			}
	}

h3 {
	font-size: 1.3125em;
	line-height: 1.25;
	margin-top: 0.5em;
	margin-bottom: 0.125em;
}
	@media only screen and (min-width: 25em) {
	    h3 {
		    font-size: 1.5em;
		    line-height: 1.25;
		}
	}
	
	@media only screen and (min-width: 43.75em) {
	    h3 { 
		    font-size: 1.75em;
		    line-height: 1.125;
		    max-width: 24.57142857142857em; /* 43/1.75 */
		}
	}
	
	@media only screen and (min-width: 56.25em) {
	    h3 { 
	    	font-size: 1.875em;
		    line-height: 1.125;
		    max-width: 22.93333333333333em; /* 43/1.875 */
	    }
	}
	
	@media only screen and (min-width: 81.25em) {
	    h3 { 
	    	font-size: 2em;
		    line-height: 1.125;
		    max-width: 24.1875em; /* 43/2*1.125 */
	    }
	}

h4 {
	font-size: 1.25em;
	line-height: 1.25;
	margin-top: 0.5em;
	margin-bottom: 0.125em;
}
	@media only screen and (min-width: 25em) {
	    h4 {
		    font-size: 1.25em;
		    line-height: 1.25;
		}
	}
	
	@media only screen and (min-width: 43.75em) {
	    h4 { 
		    font-size: 1.375em;
		    line-height: 1.125;
		    max-width: 31.27272727272727em; /* 43/1.375 */
		}
	}
	
	@media only screen and (min-width: 56.25em) {
	    h4 { 
	    	font-size: 1.375em;
		    line-height: 1.125;
		    max-width: 31.27272727272727em; /* 43/1.375 */
	    }
	}
	
	@media only screen and (min-width: 81.25em) {
	    h4 { 
	    	font-size: 1.5em;
		    line-height: 1.125;
		    max-width: 32.25em; /* 43/1.5*1.125 */
	    }
	}

h5 {
	font-size: 1.125em;
	line-height: 1.25;
	margin-top: 0.5em;
	margin-bottom: 0.25em;
}
	@media only screen and (min-width: 25em) {
	    h5 {
		    font-size: 1.125em;
		    line-height: 1.25;
		}
	}
	
	@media only screen and (min-width: 43.75em) {
	    h5 { 
		    font-size: 1.25em;
		    line-height: 1.125;
		    max-width: 34.4em; /* 43/1.25 */
		}
	}
	
	@media only screen and (min-width: 56.25em) {
	    h5 { 
	    	font-size: 1.25em;
		    line-height: 1.125;
		    max-width: 34.4em; /* 43/1.25 */
	    }
	}
	
	@media only screen and (min-width: 81.25em) {
	    h5 { 
	    	font-size: 1.25em;
		    line-height: 1.125;
		    max-width: 38.7em; /* 43/1.25*1.125 */
	    }
	}

h6 {
	font-size: 1em;
	line-height: 1.25;
	margin-top: 0.5em;
	margin-bottom: 0.25em;
}
	@media only screen and (min-width: 25em) {
	    h6 {
		    font-size: 1em;
		    line-height: 1.25;
		}
	}
	
	@media only screen and (min-width: 43.75em) {
	    h6 { 
		    font-size: 1.125em;
		    line-height: 1.125;
		    max-width: 38.22222222222222em; /* 43/1.125 */
		}
	}
	
	@media only screen and (min-width: 56.25em) {
	    h6 { 
	    	font-size: 1.125em;
		    line-height: 1.125;
		    max-width: 38.22222222222222em; /* 43/1.125 */
	    }
	}
	
	@media only screen and (min-width: 81.25em) {
	    h6 { 
	    	font-size: 1.125em;
		    line-height: 1.125;
		    max-width: 43em; /* 43/1.5*1.125 */
	    }
	}




/* ==========================================================================
   Modules
   ========================================================================== */


/* header styles */
.branding h1 {
	color: #ffffff;
	font-family: "essonnes-text", Georgia, "New Times Roman", serif;
	font-weight: normal;
	font-size: 1.5em;
	line-height: 1.5;
	margin: 0.5em 0 0 0;
}
.wf-inactive .branding h1 {
	font-family: Georgia, serif;
	font-size: 1.5em;
  letter-spacing: -1px;
	margin: 0.5em 0 0 0;
}
	@media only screen and (min-width: 43.75em) {
	    .branding h1 {
   			font-size: 2.25em;
   			margin-top: 0;
	    }
			.wf-inactive .branding h1 {
				font-size: 2.25em;
				margin: 0;
			}
	}
.branding h1 a:link, 
.branding h1 a:visited {
	color: #ffffff; 
	text-decoration: none;
	text-shadow: 0px 1px 1px rgba(0,0,0,0.75);
}

.branding h1 a:hover, 
.branding h1 a:focus {
	color: #ffffff; 
	text-decoration: none;
	text-shadow: 0px 1px 1px rgba(90,205,81,1);
}

/* /header styles */



/* footer styles */

#footer a:link, 
#footer a:visited {
	color: #ffffff;
}
#footer a:hover {
	color: #B7D0E8;
}

#footer p {
	font-size: 1em;
}

/* /footer styles */

/* content area styles */
.byline {
	color: #717171;
	font-size: 0.875em;
	margin: 0 auto 1em auto;
	max-width: 34.4em;
}
	@media only screen and (min-width: 43.75em) {
    .byline {
	    font-size: 1.3em;
	    max-width: 36em;
    }
	}
	@media only screen and (min-width: 81.25em) {
    .byline {
	    font-size: 1.35em;
      max-width: 42.75em;
    }
	}

blockquote {
	width: 85%;
	margin: 0 auto 1em auto; 
	font-style: italic;
	font-weight: 300;
	font-size: 1.75em;
	line-height: 1.15;
	font-family: Georgia, "New Times Roman", serif; 
	position: relative;
}

.wf-inactive blockquote {
	font-size: 1.75em;
	font-family: Georgia, "New Times Roman", serif;
	letter-spacing: -1px;
}

blockquote:before {
	content: "\201C";
	font-size: 2em;
	color: #9f9f9f;
	position: absolute;
	top: -0.2em;
	left: -0.5em;
    
}

blockquote:after {
	content: "\201D";
	font-size: 2em;
	color: #9f9f9f;
	position: relative;
	bottom: -0.35em;
	right: 0; 
	display: inline;
    line-height: .2em;
}
	@media screen and (min-width: 43.75em) { 
		
		blockquote {
      font-size: 2.5em;
			margin: 0 auto 1em auto; 
			position: relative;
			width: 75%;
		}
    .wf-inactive blockquote {
    	font-size: 2.5em;
    	letter-spacing: -1px;
    }

		blockquote:before {
			left: -0.5em;
		    
		}	
		
		blockquote.left, 
		blockquote.right {
			width: 50%;
		}
		blockquote.left {
			float: left; 
			margin-right: 3.5%;
			margin-left: -2em;
			padding-left: 1em;
		}
		
		blockquote.right {
			float: right; 
			margin-left: 3.5%; 
			margin-right: -2em;
			padding-right: 1em;
		}
		
		blockquote.left:before, 
		blockquote.right:before {
			left: -0.35em;
		    
		}	
	}

/* END BLOCKQUOTE styles */


/* /content area styles */


/* figure styles */
figure {
	position: relative;
	margin-bottom: 1em;
}

figure.small {
	width: 50%;
	-webkit-transition: width linear 0.2s;
	-moz-transition: width linear 0.2s;
    transition: width linear 0.2s;

}
	@media only screen and (min-width: 25em) {
	    figure.small {
		    width: 33%;
	    }
	}
	@media only screen and (min-width: 43.75em) {
	    figure.small {
		    width: 25%;
	    }
	}
	@media only screen and (min-width: 56.25em) {
	    figure.small {
		    width: 25%;
	    }
	}
	@media only screen and (min-width: 71.875em) {
	    figure.small {
		    width: 30%;
	    }
	}
	@media only screen and (min-width: 81.25em) {
	    figure.small {
		    width: 33%;
	    }
	}

figure.medium {
	width: 50%;
	-webkit-transition: width linear 0.2s;
	-moz-transition: width linear 0.2s;
    transition: width linear 0.2s;

}
figure.left {
	float: left;
	margin-right: 1em;
}
figure.right {
	float: right;
	margin-left: 1em;
}

figcaption {
	color: #a1a1a1;
	font-family: "cresta", Helvetica, Arial, sans-serif;
	line-height: 1.25;
}
  @media (min-width: 43.75em) {
    figcaption.right-side {
      position: absolute;
      left: 100%;
      top: 100%;
      width: 55%;
      -moz-transform: rotate(-90deg);
      -webkit-transform: rotate(-90deg);
      transform: rotate(-90deg);
      transform-origin: 0 0; 
    } 
  }

/* /figure styles */