/*------------------------------------*\
    STAFF SECTION
\*------------------------------------*/

#staff-section {
	background: #f6f6f6; padding: 60px 0;
	text-align: center;
}

#board-section {
	padding: 60px 0;
	text-align: center;
}

.our-team h2 {
	margin-bottom: 48px;
}

.teamlist-wrap {
	position: relative;
	z-index: 2; margin: 0 auto;
	max-width: 1080px; height: 1224px;
	overflow: hidden;
}

.col-team {
	margin: 0 auto; width: 230px;
	height: 306px;
}

.teamlink, .teamlink:hover {
	color: #000;
}

.ct-img {
	max-width: 216px; margin: 0 auto 20px;
	border-radius: 4px;
}

.ct-img.darkshadow:before, .ct-img.darkshadow:after {
	bottom: 20px; left: 10px;
}

.ct-img.darkshadow:after {
	right: 10px; left: auto;
}

.cti-inner {
	overflow: hidden;
	background: #fff;
	border-radius: 4px;
}

.teamlistimg {
	border-radius: 4px;
	-webkit-transition: all 0.2s linear;
	transition: all 0.2s linear;
}

.teamlink:hover .teamlistimg {
	opacity: 0.75;
	-webkit-transform: scale(1.1);
	transform: scale(1.1);
}

.ct-info h3 {
	font-size: 19px; font-weight: 400;
	margin: 0;
}

ul.teamtabs {
	display: table; width: 100%; max-width: 980px;
	height: 48px; background: #f6f6f6;
	border-radius: 4px;
	margin: 0 auto 60px;
}

ul.teamtabs li {
	display: table-cell; vertical-align: middle;
	width: 50%; font-size: 12px; font-weight: 700;
	line-height: 1.3; color: #656565; letter-spacing: 1px;
	text-transform: uppercase; cursor: pointer;
	padding: 0 8px; position: relative;
	-webkit-transition: all 0.2s linear;
	transition: all 0.2s linear;
}

ul.teamtabs li:first-child {
	border-radius: 4px 0 0 4px;
}

ul.teamtabs li:last-child {
	border-radius: 0 4px 4px 0;
}

ul.teamtabs li:hover, ul.teamtabs li.current {
	background: #002855;
	color: #fff;
}

ul.teamtabs li.current:after {
	content: ''; position: absolute;
	display: block; bottom: -10px;
	width: 0; height: 0; 
	border-left: 10px solid transparent;
	border-right: 10px solid transparent;
	border-top: 10px solid #002855;
	left: 50%;
	-webkit-transform: translate(-50%,0);
	transform: translate(-50%,0);
}

.tab-content {
  display: none;
}

.tab-content.current {
  display: inherit;
}

.btn-teamlist {
	margin-bottom: 30px;
}

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

	.our-team h2 {
		font-size: 42px;
		margin-bottom: 68px;
	}

	.teamlist-wrap {
		height: auto !important;
	}

	.col-team {
		width: 33.333333%; float: left;
		padding: 0 22px;
	}

	.btn-teamlist {
		display: none;
	}
	
	.careerslink-wrap {
		padding-bottom: 24px;
	}

	ul.teamtabs {
		display: table; width: 100%;
		height: 48px; background: #f6f6f6;
		border-radius: 4px;
		margin-bottom: 76px;
	}

	ul.teamtabs li.current:after {
		bottom: -20px;
		border-left: 20px solid transparent;
		border-right: 20px solid transparent;
		border-top: 20px solid #002855;
	}

}

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

	.col-team {
		width: 25%; float: left;
		padding: 0 22px;
	}

}

/*------------------------------------*\
    DETAIL PAGE
\*------------------------------------*/

#teamdetail-wrap {
	padding: 80px 0 56px;
	position: relative;
	z-index: 2;
}

#teamdetail-wrap .container {
	max-width: 1080px;
}

.col-img {
	margin-bottom: 48px;
}

.teamimg-wrap {
	max-width: 216px; margin: 0 auto;
	border-radius: 4px;
	background-clip: content-box;
}

.teamimg-wrap.darkshadow:before, .teamimg-wrap.darkshadow:after {
	bottom: 20px; left: 10px;
}

.teamimg-wrap.darkshadow:after {
	right: 10px; left: auto;
}

.teamimg-wrap img {
	border-radius: 4px;
}

.col-bio h2 {
	font-size: 16px; font-weight: 400;
	text-transform: uppercase;
	letter-spacing: 1px; color: #79bde9;
	margin: 0;
}

.team-title {
	margin-bottom: 22px;
}

.team-biowrap p {
	line-height: 1.7;
}

.team-biowrap p:first-of-type {
	font-size: 19px; margin: 0;
	line-height: 1.5;
}

.team-biowrap p:first-of-type:after {
	content: ''; display: block;
	width: 48px; height: 2px;
	background: #79bde9;
	margin: 30px 0;
}

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

	#teamdetail-wrap {
		padding: 100px 0 60px;
	}

	.col-img {
		margin-bottom: 0; float: left;
		width: 22%; padding-top: 5px;
	}

	.teamimg-wrap {
		margin: 0;
	}

	.col-bio {
		float: right; width: 72%;
	}

}

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

	#teamdetail-wrap {
		padding: 170px 0 120px;
	}

	.team-biowrap p:first-of-type {
		font-size: 27px;
	}

}