.infographic {
  color: #fff;
  max-width: 1440px;
  padding: 1px 0 1.5em;
  position: relative;}

.infographic:before, .infographic:after {
  content: '';
  display: block;
  height: 50%;
  position: absolute;
  width: 100%;
  left: 0;
  margin: auto;
  max-width: 1440px;
  right: 0;
  z-index: -1;}
  
.infographic:before {
  top: 0;}
  
.infographic:after {
  bottom: 0;}
	
.infographic-title {
	-moz-osx-font-smoothing: grayscale;
	-webkit-font-smoothing: antialiased;
	color: #fff;
	font: normal 21px 'Proxima Nova Light', sans-serif;
	margin: 3%;
	padding: 2%;
	text-align: center;}
	
.infographic .icons {
	display: none;}
	
.infographic .infographic-text [class*='icon-'] {
	display: block;
	padding: 5% 0 3% 0;
	text-align: center;}
	
.infographic [class*='icon-']:before {
	font-size: 64px;}
	
.infographic-text {
	margin: 0 auto;
	padding: 2% 0;
	position: relative;
	top: 0;
	width: 75%;}
	
.infographic-text h2 {
	-moz-osx-font-smoothing: grayscale;
	-webkit-font-smoothing: antialiased;
	color: #fff;
	font: normal 16px/21px "Proxima Nova Bold", sans-serif;
	margin: 8px 0;
	padding: 0;
	text-align: center;
	text-transform: uppercase;}
	
.infographic-text p {
	font: normal 16px/28px 'Proxima Nova Light', sans-serif;}
	
@media (min-width: 48em) {

	
	.infographic {
		height: 700px;
		margin: 0 auto;}
		
	.infographic-title {
		font-size: 42px;
		margin: 0;
		padding-top: 9%;}
		
	.infographic .icons {
		display: block;
		text-align: center;
		width: 100%;}
		
	.infographic [class*='icon-'] {
		border-radius: 50%;
		display: inline-block;
		height: 63px;
		margin: 0 1.25% 3% 1.25%;
		width: 63px;}
		
	.infographic [class*='icon-']:hover {
		-webkit-box-shadow: rgba(0, 0, 0, 0.2980039) 0px 2px 3px 0px;
		background-color: #fff;
		box-shadow: rgba(0, 0, 0, 0.2980039) 0px 2px 3px 0px;
		color: #0f95d3;}
		
	.infographic-text {
		-webkit-box-shadow: rgba(0, 0, 0, 0.2980039) 0px 2px 3px 0px;
		background-color: rgba(255, 255, 255, 0.901961);
		box-shadow: rgba(0, 0, 0, 0.2980039) 0px 2px 3px 0px;
		display: none;
		margin: 0 auto;
		padding: 30px 45px;
		text-align: center;
		width: 50%;}
		
	.infographic-text [class*='icon-'] {
		display: none !important;}
		
	.infographic-text h2 {
		color: #0f95d3;}
		
	.infographic-text p {
		color: #677782;
		padding-bottom: 0px;}

}
	
@media (min-width: 54em) {

	.infographic-title {
		padding-top: 5%;}
	
	.infographic [class*='icon-'] {
		height: 95px;
		width: 95px;}
	
	.infographic [class*='icon-']:before {
		font-size: 96px;}

}

@media (min-width: 65em) {

	.infographic-title {
		padding-top: 2%;}
		
}