/*accordian css*/
#body-content {
    margin-top:120px;
}
.show {
    display: none; 
}
.hide:target + .show {
    display: inline; 
}
.hide:target {
    display: none; 
}
.hide:target ~ .list {
    display:inline; 
}
#four .inner h4 {
    text-align:left;
}
.hide, .show {
	text-decoration: none;
	margin-right: 0;
	float: left;
	text-align: left;
	font-weight: 700;
	line-height:1.25;
	margin:1em 0 1em 0;
	font-size: 1.1em;
	text-transform:uppercase;
}
.hide:hover, .show:hover {
	color: #888;
	text-decoration: none;
/*	margin-bottom: 25px;*/
}
.w3-hide{display:none!important}.w3-show-block,.w3-show{display:block!important; clear:left;}.w3-show-inline-block{display:inline-block!important}
@media (max-width:1205px){.w3-auto{max-width:95%}}
@media (max-width:600px){.w3-modal-content{margin:0 10px;width:auto!important}.w3-modal{padding-top:30px}
.w3-dropdown-hover.w3-mobile .w3-dropdown-content,.w3-dropdown-click.w3-mobile .w3-dropdown-content{position:relative}
.w3-hide-small{display:none!important}.w3-mobile{display:block;width:100%!important}.w3-bar-item.w3-mobile,.w3-dropdown-hover.w3-mobile,.w3-dropdown-click.w3-mobile{text-align:center}
.w3-dropdown-hover.w3-mobile,.w3-dropdown-hover.w3-mobile .w3-btn,.w3-dropdown-hover.w3-mobile .w3-button,.w3-dropdown-click.w3-mobile,.w3-dropdown-click.w3-mobile .w3-btn,.w3-dropdown-click.w3-mobile .w3-button{width:100%}}
@media (max-width:768px){.w3-modal-content{width:500px}.w3-modal{padding-top:50px}}
@media (min-width:993px){.w3-modal-content{width:900px}.w3-hide-large{display:none!important}.w3-sidebar.w3-collapse{display:block!important}}
@media (max-width:992px) and (min-width:601px){.w3-hide-medium{display:none!important}}
@media (max-width:992px){.w3-sidebar.w3-collapse{display:none}.w3-main{margin-left:0!important;margin-right:0!important}.w3-auto{max-width:100%}}


	#four {
		padding: .5em 1em .5em 1em;
	}

	#four .inner {
		display: -ms-flexbox;
		display: -moz-flex;
		display: -webkit-flex;
		display: -ms-flex;
		display: flex;
		-moz-flex-direction: row;
		-webkit-flex-direction: row;
		-ms-flex-direction: row;
		flex-direction: row;
		-moz-justify-content: space-between;
		-webkit-justify-content: space-between;
		-ms-justify-content: space-between;
		justify-content: space-between;
		-ms-flex-pack: justify;
	}

	#four .inner article {
		/*width: 20%;*/
		padding:0px 20px;
		display: block;
	}
	#four .inner article a.show::before {
	    content: "-";
	}
	#four .inner article a.hide::before {
	    content: "+";
	}
	#four .inner article h3 {
		margin:0 0 .25em 0;
	}
	#four .inner article h5 {
		text-transform:none;
	}
	/*bio css use
	#four .inner article p {
		color: #000;
		padding: 0px 25px;
		text-align: left;
	}*/
	/*changed a little for accordian use*/
	#four .inner article p {
		color: #000;
		text-align: left;
	}


	#four .inner article .icon {
		color: #b3b3b3;
		font-size: 3em;
	}
	@media screen and (max-width: 980px) {
		.flip-card{
			width: auto 0;
			margin:0 auto;
		}
		.flip-card-back {
		  font-size:.95em;
		}
		
		#four .inner {
			-moz-flex-direction: column;
			-webkit-flex-direction: column;
			-ms-flex-direction: column;
			flex-direction: column;
		}

		#four .inner article {
			margin: 0 auto;
			width:100%;
		}

		#four {
			padding: 0em;
		}
		.flip-card {
		}

		@media screen and (max-width: 736px) {
			#four {
				padding: 0em;
			}			

section .inner {
	text-align:none!important;
}
header {
    padding-top:60px;
}
.flip-card {
  background-color: transparent;
  width: 258px;
  height: 355px;
  perspective: 1000px;
  transform-style: preserve-3d;
  display:inline-block;
}
#one {
    padding:2em 0;
}
/*  UPDATED! flip the pane when hovered */
.flip-card:hover .back {
    transform: rotateY(0deg);
}
.flip-card:hover .front {
    transform: rotateY(180deg);
}
/*
.flip-card, .front {
    width: 100%;
    height: 100%;
}

.flip-card, .back {
    width: 300px;
	height:410px;
}
*/
#four img {
    width:100%;
}

/* hide back of pane during swap */
.front, .back {
    backface-visibility: hidden;
    transition: 0.6s;
    transform-style: preserve-3d;
    position: absolute;
    width: 100%;
	height: 100%;

}
.back{
  background-color: #DCDDDE;
  color:#000;
  font-size:.85em;
  overflow: hidden;
  /*padding: 15px;*/
}
@media screen and (max-width: 480px) {
	 .back {
		 font-size:auto;
	}
}
/*  UPDATED! front pane, placed above back */
.front {
    z-index: 2;
    transform: rotateY(0deg);
}

/* back, initially hidden pane */
.back {
    transform: rotateY(-180deg);
}
.flipper{
  position: relative;
  width: 100%;
  height: 100%;
  text-align: center;
  transition: transform 0.6s;
  transform-style: preserve-3d;
  box-shadow: 0 4px 8px 0 rgba(0,0,0,0.2);
}

.biocaption {
	padding-top:5px;
}

	#four {
		padding: .5em 1em .5em 1em;
	}

	#four .inner {
		display: -ms-flexbox;
		display: -moz-flex;
		display: -webkit-flex;
		display: -ms-flex;
		display: flex;
		-moz-flex-direction: row;
		-webkit-flex-direction: row;
		-ms-flex-direction: row;
		flex-direction: row;
		-moz-justify-content: space-between;
		-webkit-justify-content: space-between;
		-ms-justify-content: space-between;
		justify-content: flex-start
		-ms-flex-pack: justify;
		flex-wrap:wrap;
	}

	#four .inner article {
        max-width:290px;
		display: block;
		padding-bottom: 20px;
		flex:1 auto;
		-webkit-flex: 1 auto;
		-moz-flex: 1 auto;
		align-self: auto;
	}
	#four .inner article h3 {
		margin:0 0 0 0;
	}
	#four .inner article h5 {
		text-transform:none;
	}
	#four .inner article p {
		color: #000;
		padding: 0px 10px;
		text-align: left;
	}

	#four .inner article .icon {
		color: #b3b3b3;
		font-size: 3em;
	}
	@media screen and (max-width: 980px) {
		.flip-card{
			width: auto 0;
			margin:0 auto;
		}
		.flip-card-back {
		  font-size:.95em;
		}
		
		#four .inner {
			-moz-flex-direction: column;
			-webkit-flex-direction: column;
			-ms-flex-direction: column;
			flex-direction: column;
		}

		#four .inner article {
			margin: 0 auto;
		}

		#four {
			padding: 0em;
		}
		.flip-card {
		}

		@media screen and (max-width: 736px) {
			#four {
				padding: 0em;
			}