* {margin: 0; padding: 0;}

body { 
	padding: 300px 20px;
	font-family: 'Teko';
	font-weight: 300;
	font-size: 120%;
}

h1 {
	font-family: 'Teko';
	font-weight: 600;
	font-size: 150%;
}

section {
	width: 250px;
	margin: auto;
}

#team {
	position: relative;
	width: 100%;
	text-align: center;
	margin:auto;
	padding: 0 30px;
}

#team li {
	display: block;
	position: relative;
	margin-bottom: 20px;
	padding: 0 20px;
	width: 175px;
	height: 200px;
}

#team li img {
	position: relative;
	z-index: 400;
}

#team li .selected img {
	width: 175px;
	border: 2px solid #F20AB8;
	position: absolute;
	left: 50%;
	top:0;
	margin-left: -72px;
	transition: all .5s ease-in-out;
	
}

#team li .hover-selected img {
	width: 250px;
	transform: scale(1.2,1.2);
	left: 0;
	top:-25px;
	margin-left: 0;
	z-index: 401;
}


#team li .hover-selected .info-bubble {
	opacity: 1;
	bottom: 260px;
	z-index: 401;
	-webkit-transition-delay: .5s;
	transition-delay: .5s;
}

.info-bubble {
	position: absolute;
	left: 0px;
	bottom: 50px;
	width: 270px;
	z-index: 399;
	padding-bottom: 10px;
	opacity: 0;
	transition: all .5s ease-in-out;
	
}

.info-pointer {
	width:30px;
	height:30px;
	background:#F49EFB;
	transform: rotate(45deg);
	position:absolute;
	bottom:0;
	left:50%;
	margin-left: -15px;
}

.team-member-info {
	background:#F49EFB;
	position: relative;
	z-index: 402;
	padding: 10px;
	text-align: left;
	border-radius: 4px;
}

#team .social {
	font-size: 24px;
	margin-bottom: 0;
	text-align: center;
}

.fade {
	animation: fadein 2s ease-out forwards;
	/*bottom: 0;*/
}

@keyframes fadein {
    from {
        opacity:0;
    }
    to {
        opacity:1;
    }
}