.heroButtons a {
    color: #7f7f7f ;
}
.heroButtons .csbutton.selected a {
	color: #000;
}

/*----- [start] CAROUSEL SECTION -----*/
.heroBanners {
    overflow: hidden;
    position: relative;
    transform: translatez(0);
}

.heroBannersOuter {
    position: relative;
    -webkit-transition: all 1.0s ease-in-out;
    -moz-transition:all 1.0s ease-in-out;
    -o-transition:all 1.0s ease-in-out;
    transition:all 1.0s ease-in-out;
}
.heroBanners > .heroBannersOuter > div.banner{
    background-color: #fff;
    position: absolute;
}
.heroBanners > .heroBannersOuter > div.banner1 {
    left: 0;
}
.heroBanners > .heroBannersOuter > div.banner2 {
    left: 1182px;
}
.heroBanners > .heroBannersOuter > div.banner3 {
    left: 2364px;
}
.heroBanners > .heroBannersOuter > div.banner4 {
    left: 3546px;
    background-repeat: no-repeat;
}
.heroButtons {
    margin: 0 auto;
    background-color: #FFF;
}
.heroButtons > .button {
    width: 178px;
    display: inline;
    float:left;
    text-align: center;
    position: relative;
}
.heroButtons > .fscs {
    width: 227px;
    display: inline;
    float:right;
}
.heroButtons > .fscs a {
 	margin: 0;
}
.ie7 p.ie.fscs, .ie8 p.ie.fscs, .ie9 p.ie.fscs {display:inline !important;}
.heroButtons a, .heroBanners a, .heroButtons a:active, .heroBanners a:active {
    -webkit-tap-highlight-color: rgba(0,0,0,0);
    -webkit-tap-highlight-color: transparent;
    background-color:transparent;
}
.heroButtons a {
    color: #7f7f7f !important;
    display: block;
    /*border-left: 1px solid #f0f0f0;*/
}
.heroButtons a.last {
    /*border-right: 1px solid #f0f0f0;*/
	margin-top: 18px;
}
.heroButtons .selected a {
    color: #000 !important;
}
.clearBoth {
    clear: both;
}
.bannerControl {
    background-color: #555555;
    background-image: url('/images/background/bcbg.jpg');
    background-repeat: no-repeat;
    background-position: 15px 0px;	color: #FFFFFF;
    position: absolute;
    right: 0;
    top: 40px;
    width: 110px;
    height: 24px;
    padding-left: 5px;
    z-index: 20;
}
.heroButtons .arrow {
    display: none;
    width: 28px;
    height: 14px;
    background: url('/images/background/active_carousel_arrow.png') no-repeat 0 0 transparent;
    position: absolute;
    top: -13px;
    left: 86px;
	left: calc(50% - 14px);
}
.heroButtons .selected .arrow {
    display: block;
}
.banner1 a .rates {
    position: absolute;
    width: 474px;
    height: 93px;
    top: 158px;
    left: 121px;
    padding: 10px;
}
.banner1 a .rates > div {
    float: left;
    width: 227px;
}
.banner1 a .rates > div:first-child {
    margin-right: 20px;
}
#pageBody.home.redesign  .rates .rate .currencyName:first-letter {
    text-transform: uppercase;
}
.rates .rate .currencyName {
    float: left;
    width: 150px;
}
.rates .rate {
    font-size: 14px;
    line-height: 1em;
    margin-bottom: 10px;
}
/*----- [end] CAROUSEL SECTION -----*/

@media screen {
	div.msCsel{overflow:hidden;-webkit-transform:translate3d(0,0,0);-moz-transform:translate3d(0,0,0);-ms-transform:translate3d(0,0,0);transform:translate3d(0,0,0);position:relative}
	div.msCsel ul.inner{display:block;width:400.01%;min-height:1px;}
	div.msCsel ul.inner li{margin:0!important;padding:0px!important;display:inline-block;float:left;overflow:hidden;width:25%;}
	div.msCsel.css1.s2 ul.inner{margin-left:-25%}
	div.msCsel.css1.s3 ul.inner{margin-left:-50%}
	div.msCsel.css1.s4 ul.inner{margin-left:-75%}

	div.msCsel.css3 ul.inner{
		overflow:auto;
		-webkit-transition: all 660ms cubic-bezier(.55,.94,.62,.96);
		-moz-transition: all 660ms cubic-bezier(.55,.94,.62,.96);
		-ms-transition: all 660ms cubic-bezier(.55,.94,.62,.96);
		transition: all 660ms cubic-bezier(.55,.94,.62,.96);
	}

	div.msCsel.css3.s1 ul.inner{
		-webkit-transform:translate3d(0%,0,0);
		-moz-transform:translate3d(0%,0,0);
		-ms-transform:translate3d(0%,0,0);
		transform:translate3d(0%,0,0);
	}

	div.msCsel.css3.s2 ul.inner{
		-webkit-transform:translate3d(-25%,0,0);
		-moz-transform:translate3d(-25%,0,0);
		-ms-transform:translate3d(-25%,0,0);
		transform:translate3d(-25%,0,0);
	}

	div.msCsel.css3.s3 ul.inner{
		-webkit-transform:translate3d(-50%,0,0);
		-moz-transform:translate3d(-50%,0,0);
		-ms-transform:translate3d(-50%,0,0);
		transform:translate3d(-50%,0,0);
	}

	div.msCsel.css3.s4 ul.inner{
		-webkit-transform:translate3d(-75%,0,0);
		-moz-transform:translate3d(-75%,0,0);
		-ms-transform:translate3d(-75%,0,0);
		transform:translate3d(-75%,0,0);
	}

	div.msCsel ul.ux{
		-webkit-transform:translateZ(0);
		-moz-transform:translateZ(0);
		-ms-transform:translateZ(0);
		transform:translateZ(0);
		position:absolute;
		display:block;
		background: #555555;
		list-style:none;
		top: 1.063rem;
		right: 1px;
		-webkit-animation:uxIn 600ms 0 1 forwards normal;
		-moz-animation:uxIn 600ms 0 1 forwards normal;
		-ms-animation:uxIn 600ms 0 1 forwards normal;
		animation:uxIn 600ms 0 1 forwards normal;
		/* border-bottom: 1px solid #aeaeae; */
		/* border-left: 1px solid #aeaeae; */
		box-shadow: 1px 1px 1px 1px rgba(0, 0, 0, 0.2);
	}

	@-webkit-keyframes uxIn{0%{opacity:0}100%{opacity:1}}
	@-moz-keyframes uxIn{0%{opacity:0}100%{opacity:1}}
	@-ms-keyframes uxIn{0%{opacity:0}100%{opacity:1}} 
	@keyframes uxIn{0%{opacity:0}100%{opacity:1}} 


	div.msCsel ul.ux li{
		float:left;
		padding: 0;
	}
	/* August 2017 - AbilityNet fix */
	div.msCsel ul.ux li a,div.msCsel ul.ux li button{
		width: 12px;
		height: 12px;
		display:inline-block;
		padding:7px;
		outline:none!important;
		box-sizing: content-box;
	}
	
	div.msCsel ul.ux li a.cc{
		height: 12px;
	}
	
	div.msCsel ul.ux li.last{
		border-left: 1px solid #aeaeae;
	}

	div.msCsel ul.ux li span{
		text-indent:-5000px;
		display:block;
		background: #a8a8a8;
		border-radius:10px;
		height:100%;
		box-shadow: inset 1px 0px 0px 0px rgba(0, 0, 0, 0.2);
	}
	div.msCsel ul.ux li a.cc span{
	}

	div.msCsel ul.ux li a:hover span, 
	div.msCsel ul.ux li a:focus span, 
	div.msCsel ul.ux li a:active span{
		background-position: 3px 3px;
	}

	div.msCsel.s1 ul.ux li span.s1,
	div.msCsel.s2 ul.ux li span.s2,
	div.msCsel.s3 ul.ux li span.s3,
	div.msCsel.s4 ul.ux li span.s4{
		background: #FFF;
	}

	/*
	div.msCsel.p0 ul.ux li span.p{
		background: url(/images/msCarouselUI.png) no-repeat -112px -1px;
		border-radius: 0;
		width:12px;
		height:12px;
	}*/
	div.msCsel.p0 ul.ux li a:hover span.p, 
	div.msCsel.p0 ul.ux li a:focus span.p, 
	div.msCsel.p0 ul.ux li a:active span.p{
		background-position: -135px -1px;
	}

	/*
	div.msCsel.p1 ul.ux li span.p{
		background: url(/images/msCarouselUI.png) no-repeat -66px -1px;
		border-radius: 0;
		width:12px;
		height:12px;
	}
	*/

	div.msCsel.p1 ul.ux li a:hover, 
	div.msCsel.p1 ul.ux li a:focus , 
	div.msCsel.p1 ul.ux li a:active span.p{
		background-position: -88px -1px;
	}

	div.msCsel.p1 ul.ux a.p1{display:none;}
	div.msCsel.p0 ul.ux a.p0{display:none;}
	
	/* August 2017 - AbilityNet fix */
	button.pp.p1, button.pp.p0, button.pp {
    	background-color:#555555;
		border: none;
		padding-bottom: 5px;
		cursor: pointer;
		}
	
    div.msCsel.p0 ul.ux li button:hover span.p,
	div.msCsel.p0 ul.ux li button:focus span.p,
	div.msCsel.p0 ul.ux li button:active span.p {
		background-position: -135px -1px;
	}
	div.msCsel.p1 ul.ux li button:hover,
	div.msCsel.p1 ul.ux li button:focus,
	div.msCsel.p1 ul.ux li button:active span.p {
		background-position: -88px -1px;
	}

	/*div.msCsel.p1 ul.ux button.p1{display:none;}
	div.msCsel.p0 ul.ux button.p0{display:none;}*/
	
	div.msCsel ul.ux li span.p{
		border-radius: 0;
		width:12px;
		height:12px;
	}
	div.msCsel.p0 ul.ux li span.p{
		background: url(/images/msCarouselUI.png) no-repeat -112px -1px;
	}
	div.msCsel.p1 ul.ux li span.p{
		background: url(/images/msCarouselUI.png) no-repeat -66px -1px;
	}
	
/* END: August 2017 - AbilityNet fix */
	
	/*mobile ux*/
	@media screen and (max-width: 640px) {	
		div.msCsel{width:100%}
		div.msCsel ul.ux{
			position: inherit;
			top: inherit;
			right:inherit;
			display: -webkit-inline-flex;
			display: inline-flex;
			margin:0 0 4px 0px;	
			width: 100%;
			border-left:none;
			border-right:none;
			border-bottom:none;
			border-top: 1px solid #aeaeae;
		}

		div.msCsel ul.ux li{
			margin:2px auto;
			text-align:center;
			-webkit-flex-grow: 1;
			flex-grow: 1;
		}
		.msCsel li.mscitem > a {
			display:block;
		}
	}

	/*need some placement/old IE specific fixes*/
	#homeCarousel.css1 ul.inner{width:2812px}
	#homeCarousel.css1.s2 ul.inner{margin-left: -703px;}
	#homeCarousel.css1.s3 ul.inner{margin-left: -1406px;}
	#homeCarousel.css1.s4 ul.inner{margin-left: -2109px;}
}