$bg: darken(white, 10%);
$shadow: 0 3px 6px rgba(0,0,0,0.16), 0 3px 6px rgba(0,0,0,0.23);

*{
	margin:0;
	padding:0;
	box-sizing:border-box;
}

img{
	max-width:100%;
}

body{
	background-color: #cccccc;
	display:flex;
	height:100vh;
	width:100vw;
	font-family:'Montserrat';
}

.container{
	width:1200px;
	max-width:100%;
	margin:auto;
}

.display{	
	display:flex;
	flex-wrap:wrap;
	justify-content:space-around;
	.display-item{		
		flex-grow:1;
		padding:15px;
		>span{
			display:block;
			text-align:center;
			padding:15px;
			font-size:2em;
		}
	}
}

.business-card, .flippable-business-card{
	width:550px;
	height:300px;
	max-width:100%;	
	border-radius:4px;	
	margin:0 auto;
}

.business-card{
	display:flex;
	  justify-content: center;
	flex-direction:column;	
	background: linear-gradient(135deg, #fff 0%,#fff 50%,rgba(0,109,044,.2) 50.5%,rgba(0,109,044, .6) 100%); 
	color:rgba(0,0,0,.8);	
	box-shadow: 0 3px 6px rgba(0,0,0,0.16), 0 3px 6px rgba(0,0,0,0.23);
	}
	.profile{
		display:flex;
			justify-content:space-evenly;

		border-bottom:1px solid rgba(0,0,0,.2);
		padding:15px;		
		.profile-image{
			background-image: url(bullit_logo.gif);
			background-position:center;

			width:274px;
			height:151px;
			
		}
		.profile-title{
			padding-left:15px;
			display:flex;
			flex-direction:column;
			justify-content:space-evenly;
			h2{
				font-size:1.4em;
			}
		}
	}
	.info{
		display:flex;
		flex-grow:1;
		.info-contact{
			padding:15px;
			display:flex;
			flex-shrink:1;
			flex-direction:column;
			justify-content:space-around;
			a{
				color:rgba(0,0,0,.8);
			}
			i{
				font-size:1.2em;
				width:25px;
			}
		}
		.info-bio{
			display:flex;
			flex-grow:1;
			flex-basis:50%;
			flex-direction:column;

			padding:15px;
			text-align:center;
		}
	}
}

