@charset "UTF-8";
/* CSS Document */
/* Last updated January 2023 */
/* Colophon: http://typekit.com/colophons/zps0fdz */
/* Early inspiration for typefaces, sidenotes, and other features from Tufte CSS: http://edwardtufte.github.io/tufte-css/ */


/* default font size*/
html {
	font-size: 13px; 
	text-rendering: optimizelegibility;
}

@media (max-width: 500px) {
	html {
	font-size: 14px; 
	text-rendering: optimizeSpeed; }
}

@media (max-width: 800px) {
	html {
	font-size: 15px; 
	text-rendering: auto; }
}


/* page body */
body {
	margin: 0px;
	padding: 0px;
	background-color: #fafafa; }
	
@media (max-width : 500px ){
	body {
	background-color:#fafafa;
	margin: 0px;
	padding: 0px; }
}


/* heds & deks */
.hedbody {
	padding-left: 10%;
	max-width: 800px;
}

@media (max-width : 500px ){
	.hedbody {
	padding-left: 3%;
	padding-right: 5%;
}
}


/* div for articles */
.textbody {
	padding-left: 10%;
	max-width: 700px;
}

@media (max-width : 500px ){
	.textbody {
		padding-left: 0%;
		padding-right: 0%;
		max-width: 92%; 
		margin-left: 3%;
		margin-right: 5%;
	}
}


/* div for indented text */
.indentbody {
	padding-left: 5%;
	max-width: 680px;
}

@media (max-width : 500px ){
	.indentbody {
		padding-left: 3%;
		max-width: 400px;
	}
}

/* text body for wider pages */
.textbodyWide {
	padding-left: 10%;
	max-width: 1100px;
	clear: right;
}
	

/* paragraph style */
p {
	font-family: "garamond-premier-pro", "Garamond", "Palatino", "Georgia", serif;
	font-size: 1.5rem;
	font-weight: 400;
	color: #111111;
	line-height: 1.3;
	margin-top: 0.5rem;
	
}

@media (max-width : 500px ){
p {
	font-family: "garamond-premier-pro", "Garamond", "Palatino", "Georgia", serif;
	font-size: 1.4rem;
	font-weight: 400;
	color: #111111;
	line-height: 1.2;
	margin-top: 0.5rem;
	}
}
strong {
	font-style: normal;
	font-weight: 600; 
	}  
	
.strong {
	font-style: normal;
	font-weight: 600; 
	}  

em {
	font-style: italic;
	font-weight: 400;
	}
	
.em {
    font-style: italic;
	font-weight: 400;
	} 
	
p strongem {
	font-style: italic;
	font-weight: 600; 
	} 		
	
.strongem {
	font-style: italic;
	font-weight: 600; 
	} 	
  

/* links */
a:link {
	color: #1C617C;
	font-weight: 600;
	text-decoration: none;
	line-height: inherit;
}

a:visited {
	color: #495859;
}

a:hover {
	color: #495859;
}

a:active {
    color: #1C617C;	}


/* front page hero link styles */
a.topBox:link {
	color: #ffffff;
	text-decoration:none; }

a.topBox:visited {
    color: #ffffff;
	text-decoration:none; }

a.topBox:hover {
	color: #495859;	
	text-decoration:none; }

a.topBox:active {
    color: #ffffff;
	text-decoration:none;
	line-height: inherit;}

.topBox {
    display: inline-block;
    border: 2px solid #ffffff;
    padding: 5px 15px;
    font-family: "brandon-grotesque","Lato","Futura","Gill Sans",sans-serif;
	font-style: normal;
	font-weight: 500;
	font-size: 1.4rem;
	font-variant:normal;
	text-decoration:none;
	background-color: #EBB11A;
	letter-spacing: 0.1rem;
	color: #ffffff;	 }

.topBoxGrey {
    display: inline-block;
    border: 2px solid #fff;
    padding: 5px 15px;
    font-family: "brandon-grotesque","Lato","Futura","Gill Sans",sans-serif;
	font-style: normal;
	color: #ddd;
	font-weight: 400;
	font-size: 1.4rem;
	font-variant:normal;
	text-decoration:none;
	letter-spacing: 0.1rem;
	 }


/* button based on topBox */
.button {
    display: inline-block;
	opacity: 1;
	z-index: 1;
    border: 2px solid #495859;
    padding: 5px 15px;
    font-family: "brandon-grotesque","Lato","Futura","Gill Sans",sans-serif;
	font-style: normal;
	font-weight: 500;
	font-size: 1.4rem;
	font-variant:small-caps;
	text-decoration:none;
	background-color: #E8EAEA;
	letter-spacing: 0.1rem;
	color: #111; }

/* button for side links */
.buttonSide {
    display: inline-block;
	opacity: 1;
	z-index: 1;
    border: 2px solid #495859;
    padding: 2px 10px;
	border-radius: 12px;
    font-family: "brandon-grotesque","Lato","Futura","Gill Sans",sans-serif;
	font-style: normal;
	font-weight: 500;
	font-size: 1.4rem;
	font-variant:small-caps;
	text-decoration:none;
	background-color: #E8EAEA;
	letter-spacing: 0.1rem;
	color: #111; }

/* front page hero image & text */
.hero {
	padding: 2.4rem 1.8rem;
	background-image: url("images/headers/skyline-yellow1308x275.jpg");
	background-size:1308px 275px;	
	background-color: #58626b;
	background-repeat: no-repeat;
	background-position: left top;
	border-radius: 0rem;
}

.heroBox {
    display: inline-block;
    border: 3px solid #fff;
    padding: 5px 15px;
    font-family: "brandon-grotesque","Lato","Futura","Gill Sans",sans-serif;
	font-style: normal;
	font-weight: 600;
	font-size: 2.5rem;
	font-variant:normal;
	text-decoration:none;
	background-color: #1C617C;
	letter-spacing: 0.1rem;
	color: #fff; }

.heroBoxGrey {
    display: inline-block;
    border: 2px solid #fff;
	background: #fff;
	opacity: 0.7;
    padding: 5px 15px;
    font-family: "brandon-grotesque","Lato","Futura","Gill Sans",sans-serif;
	font-style: normal;
	color: #495859;
	font-weight: 400;
	font-size: 1.8rem;
	font-variant:normal;
	text-decoration:none;
	letter-spacing: 0.1rem;
	 }


/* bottom of page bar */
.footer { 
  position: absolute;
  right: 0;
  bottom: 0;
  left: 0;
  padding: 1rem;
  background-color: #D8CC3A;
  height: 45px;
  text-align: left;
}


/* article headline */
.hed {
    font-family: "brandon-grotesque","Lato","Futura","Gill Sans",sans-serif;
    font-style: normal;
    font-weight: 700;
    color: #111111;
    font-size: 3rem;
	line-height: 1.1;
	display:block;
}

@media (max-width : 500px ){
	.hed {
    font-family: "brandon-grotesque","Lato","Futura","Gill Sans",sans-serif;
    font-style: normal;
    font-weight: 700;
    color: #111111;
    font-size: 2rem;
	line-height: 1;
	display:block;
}
}

/* article dek */
.dek {
	font-family: "brandon-grotesque","Lato","Futura","Gill Sans",sans-serif;
	font-style: italic;
	font-weight: 500;
	font-size: 1.8rem;
	line-height: 2rem;
	color: #1C617C;	
	display:block;
	
}

@media (max-width : 500px ){
	.dek {
	font-family: "brandon-grotesque","Lato","Futura","Gill Sans",sans-serif;
	font-style: italic;
	font-weight: 700;
	font-size: 1.7rem;
	line-height: 1.9rem;
	color: #1C617C;	
	display:block;	
	}
}


/* subhed with dek style */
.dekSub {
	font-family: "brandon-grotesque","Lato","Futura","Gill Sans",sans-serif;
	font-style: normal;
	font-weight: 700;
	font-size: 1.9rem;
	line-height: 1.4;
	color: #1C617C;	
	display:block;
	
}
		
/* simple black subhed  */
.subhed {
	display:block;
	font-family: "brandon-grotesque","Lato","Futura","Gill Sans",sans-serif;
	font-style: normal;
	font-weight: 700;
	font-size: 1.8rem;
	color: #111111;
	line-height: 1.5rem;
	
}

/* bigger black subhed  */
.subhedBig {
	display:block;
	font-family: "brandon-grotesque","Lato","Futura","Gill Sans",sans-serif;
	font-style: normal;
	font-weight: 700;
	font-size: 1.9rem;
	color: #111111;
	line-height: 1.2;
	
}

/* subhed style with line over it */
.subhedLine {
	display:block;
	font-family: "brandon-grotesque","Lato","Futura","Gill Sans",sans-serif;
	font-style: normal;
	font-weight: 700;
	font-size: 1.6rem;
	color: #111111;
	line-height: 1.5rem;
	border-top: 1px solid;
	border-color: #495859;

	}

.subhedLineBig {
	display:block;
	font-family: "brandon-grotesque","Lato","Futura","Gill Sans",sans-serif;
	font-style: normal;
	font-weight: 700;
	font-size: 2rem;
	color: #495859;
	line-height: 1.5;
	border-top: dotted 1px;
	padding-top: 0.7rem;
	border-color: #495859;

	}

/* subhed with underline */
.subhedBlackUl {
	display:block;
	font-family: "brandon-grotesque","Lato","Futura","Gill Sans",sans-serif;
	font-style: normal;
	text-decoration: underline;
	font-weight: 700;
	font-size: 1.6rem;
	color: #111;
}

/* emphasis for first line of section */
.firstwords {
	display: inline;
	font-family: "brandon-grotesque","Lato","Futura","Gill Sans",sans-serif;
	font-size: 1.8rem;
	font-variant-caps: all-small-caps;
	font-weight: 700;
	color: #111111;}

/* pullquote style */
.pullquote {
	font-family: "brandon-grotesque","Lato","Futura","Gill Sans",sans-serif;
	font-style: italic;
	font-weight: 500;
	font-size: 1.8rem;
	line-height: 1.2;
	color: #313A40;
	display: inline-block;
	/* gradient */
	/*	background: -webkit-linear-gradient(#1C617C, #9BB9BF);
	background: -o-linear-gradient(#1C617C, #9BB9BF);
	background: linear-gradient(#1C617C, #9BB9BF);
	-webkit-background-clip: text;
	-webkit-text-fill-color: transparent; */	
}


/* pullquote on right */
.pullquote-right {
	width: 400px;
	margin-top: 3rem;
	margin-bottom: 3rem;
	margin-left: -100px;
	margin-right: 0px;
	float: right;
	position: relative;
	left: 150px; }
	
@media (max-width : 500px ){
	.pullquote-right {
	float: left;
	clear: both;
	width: 80%;
	margin-top: 1.5rem;
	margin-bottom: 1.5rem;
	margin-left: 30px;
	margin-right: 30px; 
	text-align: left;
	left: 0px;}
}

@media (max-width : 800px ){
	.pullquote-right {
	float: right;
	clear: both;
	width: 70%;
	margin-top: 1.5rem;
	margin-bottom: 1.5rem;
	margin-left: 30px;
	margin-right: 30px; 
	text-align: left;
	left: 0px; }
}
/* smaller text for sidenotes etc. */
.smtext {
	font-family: "garamond-premier-pro", "Garamond", "Palatino", "Georgia", serif;
	font-size: 1.2rem;
	line-height: 1.1;
	color: #111111; }
	
/* photo caption */
.caption {
	font-family: "brandon-grotesque","Lato","Futura","Gill Sans",sans-serif;
	font-size: 1.4rem;
	line-height: 1.4;
	font-style: normal;
	font-weight: 500;
	color: #495859;
}

/* caption for dropdown */
.captionDropdown {
	font-family: "brandon-grotesque","Lato","Futura","Gill Sans",sans-serif;
	font-size: 1.3rem;
	line-height: 1.1;
	font-style: normal;
	font-weight: 500;
	color: #495859;
}

.captionWhite {
	font-family: "brandon-grotesque", Gill Sans, Futura, sans-serif;
	font-size: 1.1rem;
	font-kerning: auto;
	letter-spacing: 0.05rem;
	line-height: 1.3;
	font-style: normal;
	font-weight: 400;
	color: #ffffff;
	margin-left: 100px;
}

@media (max-width : 500px ){
.captionWhite {
	margin-left:20px;
}
}
.captionBig {
	font-family: "brandon-grotesque","Lato","Futura","Gill Sans",sans-serif;
	font-size: 1.6rem;
	line-height: 1.4rem;
	font-style: normal;
	font-weight: 700;
	color: #111111;
	display: block;
}
	
	
/* smaller caption text for credits*/
.smcaption {
	display:block;
	font-family: "brandon-grotesque","Lato","Futura","Gill Sans",sans-serif;
	font-variant: small-caps;
	font-size: 1.2rem;
	line-height: 1;
	font-style:italic;
	font-weight: 500;
	color: #4D5D5E;
}

.sectionBreak {
	nter;
	padding-left: 50%;
	font-family: "brandon-grotesqueto","Futura","Gill Sans",sans-serif;
}

/* box fixed to top of page */
div.fixedBox {
	
	top: 10%;
	left: 850px;
	position: -webkit-sticky;
  position: sticky;
}

/* box fixed to side of page */
div.fixedSide {
	clear:none;
	left:900px;
	text-align: right;
  position: fixed;
}

/* thin line */
.line {
	border-bottom: dotted 1px;
	padding-top: 0.7rem;
	border-color: #495859;
	line-height: .5;
	display:block;
}



/* blockquote indent*/
.blockquote {
	margin-left: 5%;
	margin-right: 5%;
	padding-right: 10%;
	font-size: 1.5rem;
	line-height: 1.3;
	color: #111111;
	font-family: "garamond-premier-pro", "Garamond", "Palatino", "Georgia", serif;
	font-weight: 400;
	font-style: italic;
	padding-top: 10px;
	padding-bottom: 10px;
}



/* indentation */
.indent {
	padding-left: 60px; }

@media (max-width : 500px ){
	.indent {
	padding-left: 5%;
	padding-right: 7%;}
}

/* indentation for use in boxes */
.indentBox {
	padding-left: 10px; }

/* thin border for white images */	
img.border {
	border: 1px solid #E8EAEA;
	margin-bottom:.6rem;
	margin-top:1rem;
}

/* rounded corners */	
img.rounded {
	border: 1px solid #E8EAEA;
	border-radius: 25px;
	margin-bottom:.6rem;
	margin-top:1rem;
}
	
/* rounded corners w/ border */	
img.borderrounded {
	border: 1px solid #E8EAEA;
	border-radius: 25px;
	margin-bottom:.6rem;
	margin-top:1rem;
}

/* image behind text */
img.background {
	z-index: -10;
	position: relative;
	width: 100%;
}

/* mobile large image */
@media (max-width : 500px ){
	img {
		max-width: 85%; 
	margin-right: 15%;}
}


/* style dropdown button */
.dropbtn {
  	background-color: #D8CC3A;
  	font-family: "brandon-grotesque","Lato","Futura","Gill Sans",sans-serif;
	font-style: normal;
	font-weight: 500;
	font-size: 1.4rem;
	font-variant: small-caps;
	text-decoration:none;
	letter-spacing: 0.1rem;
	color: #fff;
  	padding: 16px; 
  	border: none;
  	cursor: pointer;
}

/* container <div> for dropdown content */
.dropdown {
  	position: relative;
  	display: inline-block;
}

/* dropdown content */
.dropdown-content {
  display: none;
  position: absolute;
  background-color: #f9f9f9;
  min-width: 160px;
  box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
  z-index: 1;
}

/* links inside the dropdown */
.dropdown-content a {
  font-family: "brandon-grotesque","Lato","Futura","Gill Sans",sans-serif;
	font-style: normal;
	font-weight: 500;
	font-size: 1.4rem;
	font-variant:normal;
	text-decoration:none;
	background-color: #D8CC3A;
	letter-spacing: 0.1rem;
	color: #fff;
	color: black;
  padding: 12px 16px;
  display: block;
}

/* dropdown links hover */
.dropdown-content a:hover {background-color: #f1f1f1}

/* show the dropdown menu on hover */
.dropdown:hover .dropdown-content {
  display: block;
}

/* change color of the dropdown button when the dropdown content is shown */
.dropdown:hover .dropbtn {
  background-color: #3e8e41;
}
/* 200px wide image on right */
.right200 { 
	float:right;
	clear: right;
    margin-right: 20px;
	margin-left: 30px;
  	width: 200px;
    margin-top: 1rem;
    margin-bottom: 1rem;
    position: relative; 
	padding-bottom:0.5rem;
	font-family: "brandon-grotesque","Lato","Futura","Gill Sans",sans-serif;
	font-size: 1.1rem;
    line-height: 1.2;
	font-style: normal;
	font-weight: 400; }
	
/* mobile 200px wide image  */
@media (max-width : 500px ){
	.right200 {
		float: left;
	clear: right;
	margin-right: 25%;
		margin-right: 20px;
		margin-left: 30px;
  		width: 200px;
    	margin-top: 1rem;
    	margin-bottom: 1rem;
    	position: relative; 
		padding-bottom:0.5rem;
		font-family: "brandon-grotesque","Lato","Futura","Gill Sans",sans-serif;
		font-size: 1.1rem;
    	line-height: 1.2;
		font-style: normal;
		font-weight: 400; }
		 }

/* 300px wide image on right */
.right300 { 
	float: right;
	clear: right;
	margin-right: -50%;
	margin-top: 1rem;
	margin-bottom: 1rem;
	padding-left: 1.5rem;
	padding-right: 10px;	
  	width: 300px;
	position: relative;
	padding-bottom: 0.5rem;
	line-height: 1.1;
	}

@media (max-width : 500px ){
	.right300 { 
	float: left;
	clear: right;
	margin-right: 25%;
	margin-top: 1rem;
	margin-bottom: 1rem;
	padding-left: 1.5rem;
	padding-right: 10px;	
  	width: 300px;
	position: relative;
	padding-bottom: 0.5rem;
	line-height: 1.1;
	}
}

@media (max-width : 800px ){
	.right300 { 
	float: left;
	margin-right: 8%;
	margin-top: 1rem;
	margin-bottom: 1rem;
	padding-left: 1.5rem;
	padding-right: 10px;	
	position: relative;
	padding-bottom: 0.5rem;
	line-height: 1;
	}
}

/* 200px wide image on left */
.left200 { 
	float:left;
	clear: left;
    margin-right: 20px;
	margin-left: 10px;
  	width: 200px;
    margin-top: 0.2rem;
    margin-bottom: 1rem;
    position: relative;
	padding-bottom:0.5rem;
	font-family: "brandon-grotesque","Lato","Futura","Gill Sans",sans-serif;
	font-size: 1.1rem;
    line-height: 1.2;
	font-style: normal;
	font-weight: 400; }

@media (max-width : 500px ){
	.left200 { 
	float:left;
	clear: right;
    margin-right: 20%;
  	width: 200px;
    margin-top: 1rem;
    margin-bottom: 1rem;
    position: relative;
	padding-bottom:0.5rem;
	font-family: "brandon-grotesque","Lato","Futura","Gill Sans",sans-serif;
	font-size: 1.1rem;
    line-height: 1.2;
	font-style: normal;
	font-weight: 400; }
}

/* 300px wide image on left */
.left300 { 
	float:left;
	clear: left;
    margin-right: 15px;
	margin-left: 10px;
  	width: 300px;
    margin-top: 0.2rem;
    margin-bottom: 1rem;
    position: relative; 
	padding-bottom:0.5rem;
	font-family: "brandon-grotesque","Lato","Futura","Gill Sans",sans-serif;
	font-size: 1.1rem;
    line-height: 1.2;
	font-style: normal;
	font-weight: 400; }
	
	
	/* 100px wide image on left */
.left100 { 
	float:left;
    margin-right: 1rem;
	margin-left: .5rem;
  	width: 100px;
    margin-top: .2rem;
    margin-bottom: .5rem;
    position: relative; 
	padding-bottom:0.5rem;
	font-family: "brandon-grotesque","Lato","Futura","Gill Sans",sans-serif;
	font-size: 1.1rem;
    line-height: 1.2;
	font-style: normal;
	font-weight: 400; }

.wellleft75 { 
	float:left;
	clear: left;
    margin-right: 1rem;
	margin-left: 20px;
  	width: 75px;
    margin-top: .5rem;
    margin-bottom: .5rem;
    position: relative; 
	padding-bottom:0.5rem; }
	
	/* 75px wide image on left */
.left75 { 
	float:left;
	clear: left;
    margin-right: 1rem;
	margin-left: .5rem;
  	width: 75px;
    margin-top: 0rem;
    margin-bottom: 2rem;
    position: relative; 
	padding-bottom:0.5rem;
	font-family: "brandon-grotesque","Lato","Futura","Gill Sans",sans-serif;
	font-size: 1.1rem;
    line-height: 1.2;
	font-style: normal;
	font-weight: 400; }


/* 100px wide headshot */
.right100 { 
	float:right;
	clear: right;
    margin-right: 20px;
	margin-left: 0px;
  	width: 100px;
    margin-top: 0;
    margin-bottom: 0;
    position: relative; 
	padding-bottom:0;	
}

/* sidenote */
.sidenote {
	float: right;
	clear: right;
	margin-right: -50%;
	width: 250px;
	margin-top: 0;
	margin-bottom: 0;
	padding-top: 10px;
	padding-bottom: 10px;
	padding-left: 10px;
	padding-right: 10px;
	border-color: #707070;
	border-style: dotted;
	border-width: 1px;
	border-radius: 6px; 
	background: repeating-linear-gradient(
    60deg,
    #fafafa 0px,
    #ddd 3px,
    #fafafa 3px,
    #ddd 3px );
	/*background-color: #fff; */
	font-family: "brandon-grotesque","Lato","Futura","Gill Sans",sans-serif;
	font-size: 1.4rem;
	line-height: 1.2;
	font-style: normal;
	font-weight: 400;
	vertical-align: baseline;
	position: relative;
}

@media (max-width: 500px) {
	.sidenote {
	float: right;
	clear: left;
	width: 100%;
	margin-top: 1.5rem;
	margin-bottom: 1.5rem;
	margin-left: 1rem;
	margin-right:inherit;
	padding-top: 10px;
	padding-bottom: 10px;
	padding-left: 10px;
	padding-right: 10px;
	border-color: #707070;
	border-style: solid;
	border-width: 2px;
	border-radius: 4px; 
	background-color: #fff;
	font-family: "brandon-grotesque","Lato","Futura","Gill Sans",sans-serif;
	font-size: 1.4rem;
	line-height: 1.2;
	font-style: normal;
	font-weight: 400;
	vertical-align: baseline;
	position: relative;
}
}

@media (max-width: 800px) {
	.sidenote {
	float: left;
	clear: none;
	width: 100%;
	margin-top: 1.5rem;
	margin-bottom: 1.5rem;
	margin-left: 1rem;
	margin-right:inherit;
	padding-top: 10px;
	padding-bottom: 10px;
	padding-left: 10px;
	padding-right: 10px;
	border-color: #707070;
	border-style: solid;
	border-width: 2px;
	border-radius: 4px; 
	background-color: #fff;
	font-family: "brandon-grotesque","Lato","Futura","Gill Sans",sans-serif;
	font-size: 1.4rem;
	line-height: 1.2;
	font-style: normal;
	font-weight: 400;
	vertical-align: baseline;
	position: relative;
}
}

/* sidenote - slightly wider for awards page */
.sidenoteWide {
	float: right;
	clear: right;
	margin-right: -60%;
	width: 300px;
	margin-top: 0;
	margin-bottom: 0;
	padding-top: 10px;
	padding-bottom: 10px;
	padding-left: 10px;
	padding-right: 10px;
	border-color: #707070;
	border-style: dotted;
	border-width: 1px;
	border-radius: 6px; 
	background: repeating-linear-gradient(
    60deg,
    #fafafa 0px,
    #ddd 3px,
    #fafafa 3px,
    #ddd 3px );
	/* background-color: #fff; */
	font-family: "brandon-grotesque","Lato","Futura","Gill Sans",sans-serif;
	font-size: 1.4rem;
	line-height: 1.2;
	font-style: normal;
	font-weight: 400;
	vertical-align: baseline;
	position: relative;
}

@media (max-width : 500px ){
	.sidenoteWide {
	float: right;
	clear: both;
	margin-right: 20%;
	width: 80%;
	margin-top: 0;
	margin-bottom: 2rem;
	padding-top: 10px;
	padding-bottom: 10px;
	padding-left: 10px;
	padding-right: 10px;
	border-color: #707070;
	border-style: dotted;
	border-width: 1px;
	border-radius: 6px;
	background-color: #fff;
	font-family: "brandon-grotesque","Lato","Futura","Gill Sans",sans-serif;
	font-size: 1.2rem;
	line-height: 1.2;
	font-style: normal;
	font-weight: 400;
	vertical-align: baseline;
	position: relative;
}
}

/* sidebar */
.sidebar { 
	float:right;
    clear: right;
	position: relative;
	left: 0px;
    width: 300px;
	background-color: #f2f2f2;   
    margin-top: 1rem;
    margin-bottom: 1rem;
	margin-left: 1rem;
	padding-top: .5rem;
	padding-bottom: 1rem;
	padding-left: 1rem;
	padding-right: 1rem;
	border-color: #9BB9BF;
	border-style: solid;
	border-width: 2px;
	border-radius: 5px;
	vertical-align: baseline; }
	
/* inline note */
.note {
	float: left;
	position: relative;
	left: -15px;
	width: 650px;
	vertical-align: baseline;
	/* [disabled]background-color: rgba(216,204,58,0.30); */
	margin-top: 1rem;
	margin-bottom: 1rem;
	margin-left: 1rem;
	padding-top: 1rem;
	padding-bottom: 1rem;
	padding-left: 1rem;
	padding-right: 1rem;
	border-radius: 10px;
	/*background-image: -webkit-linear-gradient(90deg,rgba(231,231,231,1.00) 0%,rgba(155,185,191,1.00) 100%);
	background-image: -moz-linear-gradient(90deg,rgba(231,231,231,1.00) 0%,rgba(155,185,191,1.00) 100%);
	background-image: -o-linear-gradient(90deg,rgba(231,231,231,1.00) 0%,rgba(155,185,191,1.00) 100%);
	background-image: linear-gradient(0deg,rgba(231,231,231,1.00) 0%,rgba(155,185,191,1.00) 100%);*/
}
	
	/* front page article box */
.noteBox { 	  
	border: 1px dotted #ddd; 
	width:auto;
	float:inherit;
	padding-top: 7px;
	padding-bottom: 7px;
	padding-left: 5px;
	padding-right: 5px;
	margin-bottom: 30px;
	border-radius: 5px; }
	
@media (max-width: 1050px) {
	.noteBox { 	   
	border:none;
	margin-bottom: 30px;}
}

/* home page article listing */
.article {
    float:left;
    clear: right;
	position: relative;
	left: 0px;
	width: 700px;
	vertical-align: text-top;
	padding-left: 0.5rem;
	padding-top: 0rem;
	padding-bottom: 0.8rem;
    margin-top: 0px;
    overflow:visible;
    min-height: 10px;
    display: block;
    
}
					
/* mobile note */
@media (max-width : 500px ){
	.note {	
    clear: right;
	position: relative;
	width: 300px;
	background-color: #f2f2f2;   	
    margin-top: 1rem;
    margin-bottom: 1rem;
	margin-left: 1rem;
	padding-top: 1rem;
	padding-bottom: 1rem;
	padding-left: 1rem;
	padding-right: 1rem; }	
}
						 

.mainwelltext {
	font-family: "brandon-grotesque","Lato","Futura","Gill Sans",sans-serif;
	font-size: 1.6rem;
	line-height: 1.7rem;
	font-style: normal;
	font-weight: 400;
	color: #111111;	
	float:left;
	clear:right;
		
}

.welltext {
	font-family: "brandon-grotesque","Lato","Futura","Gill Sans",sans-serif;
	font-size: 1.3rem;
	line-height: 1.5rem;
	font-style: normal;
	font-weight: 400;
	color: #111111;
	margin-top:15px;	
	margin-left: 10px;
	float:left;
	clear:right;
		
}

.pulldown {
	font-family: "brandon-grotesque","Lato","Futura","Gill Sans",sans-serif;
	font-size: 1.1rem;
	line-height: 1.2rem;
	font-style: normal;
	font-weight: 400;
	color: #111111;
	margin-top:10px;	
	margin-left: 10px;
	float:left;
	clear:both;
		
}
	

/* 200px wide image on left */
.wellleft200 {
	float:left;
	clear:both;
    margin-right: 20px;
	margin-left: 20px;
  	width: 200px;
    margin-top: 1rem;
    margin-bottom: 1rem;
    position: relative;
	padding-bottom:0.5rem;
	}

.bullet {
	font-size: 0.9rem;
	color: #111;
}

/* style for pen icon */
.fas {
	font-size: 1.1rem;
	color: #A4ACAC;
}

/* superscript */
sup {
  vertical-align: super;
  font-size: smaller;
}
 /* the end! */