/******************************************************************************************
Units
******************************************************************************************/
/******************************************************************************************
Colors
******************************************************************************************/
/******************************************************************************************
Fonts
******************************************************************************************/
/******************************************************************************************
Mixins for list style types
******************************************************************************************/
/**************************************************************************************************
Advanced typography settings
Get advanced with type if needed for ligatures etc...
**************************************************************************************************/
/**************************************************************************************************
Retina images.
Use with care - http://37signals.com/svn/posts/3271-easy-retina-ready-images-using-scss
**************************************************************************************************/
/**************************************************************************************************
Text Indent
Indent text for sprites
**************************************************************************************************/
/**************************************************
Functions for px to rem conversions
**************************************************/
/**************************************************************************************************
Transitions
Set-up custom transitions
**************************************************************************************************/
/**************************************************************************************************
HEX to RGB
http://codepen.io/sturobson/pen/hdKyv
**************************************************************************************************/
/**************************************************************************************************
Box Shadow
**************************************************************************************************/
/**************************************************************************************************
Circle
**************************************************************************************************/
/**************************************************************************************************
Box Shadow
**************************************************************************************************/
/**************************************************************************************************
Divider
**************************************************************************************************/
/**************************************************************************************************
Input Placeholder Colors
**************************************************************************************************/
/**************************************************************************************************
Buttons
**************************************************************************************************/
#hero
{
	position: relative;
	height: 286px;
	overflow: hidden;
	background-color: transparent;
	background-image: url(../img/_global/background-hero.jpg);
	background-position: 0 0;
	background-repeat: no-repeat;
}

	#hero img
	{
		position: absolute;
		top: 30px;
		right: -187px;
	}

.spotlight
{
	height: 160px;
}

	.spotlight > ul
	{
		height: 100%;
		width: 1022px;
		margin: 0 auto;
	}

		.spotlight > ul > li
		{
			padding: 0;
			border-right: 0;
			background-image: url(../img/_global/border-gradient.png);
			background-position: right bottom;
			background-repeat: no-repeat;
		}

			.spotlight > ul > li.last
			{
				margin-right: 0;
				background-image: none;
			}

	.spotlight li
	{
		position: relative;
		width: 97px;
		height: 100%;
	}

		.spotlight li a
		{
			text-align: center;
		}

			.spotlight li a:hover .arrow-sprite, .spotlight li a:focus .arrow-sprite
			{
				background-position: 0 -23px;
			}

			.spotlight li a .arrow-sprite
			{
				margin: 25px auto 0 auto;
			}

		.spotlight li .icon, .spotlight li strong
		{
			display: block;
			margin-bottom: 10px;
			width: 78px;
			margin: 0 auto 10px auto;
		}

		.spotlight li .icon
		{
			font-size: 50px;
			font-size: 4.1666667rem;
			line-height: 54px;
			line-height: 4.5rem;
		}

		.spotlight li strong
		{
			font-weight: normal;
			height: 32px;
			font-size: 12px;
			font-size: 1rem;
			line-height: 16px;
			line-height: 1.3333333rem;
		}

		.spotlight li .icon.grey-light
		{
			font-size: 24px;
			font-size: 2rem;
			line-height: 28px;
			line-height: 2.3333333rem;
			color: #6c7c80;
		}

.flag-topleft
{
	position: absolute;
	top: 0px;
	left: -6px;
	width: 39px;
	height: 32px;
	background: url(../img/new-flag-topleft.png);
	text-indent: -9999px;
}

.content h2
{
	margin-bottom: 10px;
	font-family: "bentonMedium", "Helvetica Neue", Helvetica, Arial, sans-serif;
	font-size: 22px;
	font-size: 1.8333333rem;
	line-height: 26px;
	line-height: 2.1666667rem;
}

.content article
{
	font-size: 16px;
	font-size: 1.3333333rem;
	line-height: 24px;
	line-height: 2rem;
}

#direct-deposit
{
	height: 322px;
	background-image: url(../img/what-you-get/background-direct-deposit.jpg);
}

	#direct-deposit article
	{
		top: 85px;
		left: 540px;
		width: 360px;
	}


	#add-cash2
{
	height: 630px;
		background-image: url(../img/what-you-get/background-load-cash.jpg);
	background-position: -12px 33px;
}

	#add-cash2 article
	{
		top: 20px;
		left: 35px;
		width: 495px; 
	}

#add-cash
{
	height: 500px;
	background-image: url(../img/what-you-get/background-load-cash.jpg);
	background-position: -12px 33px;
}

	#add-cash article
	{
		top: 20px;
		left: 566px;
		width: 410px;
	}

 



#mobile-check-capture
{
	height: 375px;
	background-image: url(../img/what-you-get/background-mobile-check-capture.jpg);
}

	#mobile-check-capture article
	{
		top: 20px;
		left: 510px;
		width: 470px;
	}

#mobile-capture
{
	height: 337px;
	background-image: url(../img/what-you-get/background-mobile-check-capture.jpg);
}

	#mobile-capture article
	{
		top: 20px;
		width: 470px;
	}

#atm-access
{
	height: 430px;
	background-image: url(../img/what-you-get/background-atm-access.jpg);
}

	#atm-access article
	{
		top: 20px;
		width: 470px;
		text-align: left;
	}

#pay-bills-online
{
	height: 445px;
	background-image: url(../img/what-you-get/background-online-bill-pay.png);
	background-position: -12px 33px;
}

	#pay-bills-online article
	{
		top: 20px;
		left: 566px;
		width: 410px;
	}

#send-receive-money
{
	height: 359px;
	background-image: url(../img/what-you-get/fuel.jpg);
}

	#send-receive-money article
	{
		top: 20px;
		left: 40px;
		width: 505px;
	}

#add-accounts
{
	height: 383px;
	background-image: url(../img/what-you-get/background-subaccounts.png);
	background-position: 40px 24px;
}

	#add-accounts article
	{
		top: 20px;
		left: 510px;
		width: 470px;
	}

#reepay
{
	background-image: url(../img/what-you-get/background-reepay.jpg);
	height: 382px;
}

	#reepay article
	{
		top: 20px;
		left: 45px;
		width: 470px;
	}

	
#MoneyTransfer
{
	height: 359px;
	background-image: url(../img/what-you-get/background-send-receive.jpg);
}

	#MoneyTransfer article
	{
		top: 20px;
		left: 40px;
		width: 505px;
	}

	#PayAdvance
{
	height: 359px;
	background-image: url(../img/what-you-get/PayAdvance.jpg);
}

	#PayAdvance article
	{
		top: 20px;
		left: 40px;
		width: 505px;
	}

#american-express-epay-mobile-app
{
	height: 500px;
	background: url(../img/what-you-get/background_money.png) 55px bottom no-repeat;
}

	#american-express-epay-mobile-app article
	{
		top: 20px;
		left: 480px;
		width: 505px;
	}

#membership-benefits
{
	background-image: url(../img/what-you-get/background_benefits.jpg);
}

	#membership-benefits article
	{
		padding: 35px 0;
	}

	#membership-benefits li + li + li .icon
	{
		margin-top: 0;
	}

.lt-ie8 .spotlight li
{
	width: 95px;
}

.win7 .icon.grey-light, .winXP .icon.grey-light, .winVista .icon.grey-light
{
	font-weight: bold;
	text-shadow: 0 0 0 black, 0 0 0 1px black;
	text-shadow: 0 0 0 1px black, 0 0 0 1px black;
}

.lt-ie9 .spotlight li .icon.grey-light
{
	font-size: 26px;
}

.lt-ie9 #american-express-services li
{
	min-height: 183px;
}

.logos
{
	width: 100%;
	float: left;
	display: block;
	margin-bottom: 10px;
}

	.logos .cvs
	{
		background: url(../img/what-you-get/partner-logos.png) no-repeat;
		float: left;
		height: 40px;
		width: 80px;
		margin: 0;
		display: block;
	}

	.logos .seven
	{
		background: url(../img/what-you-get/partner-logos.png) no-repeat;
		background-position: -80px 0;
		float: left;
		height: 40px;
		width: 50px;
		margin: 0;
		display: block;
	}

.left_p
{
	float: left;
}
