@charset "utf-8";
/* CSS Document */

:focus {
	outline: 1px dotted #404040;	
}

@font-face {
	font-family: 'icomoon';
	src:url('../fonts/icomoon.eot?fgqjf5');
	src:url('../fonts/icomoon.eot?#iefixfgqjf5') format('embedded-opentype'),
		url('../fonts/icomoon.woff?fgqjf5') format('woff'),
		url('../fonts/icomoon.ttf?fgqjf5') format('truetype'),
		url('../fonts/icomoon.svg?fgqjf5#icomoon') format('svg');
	font-weight: normal;
	font-style: normal;
}

html, body { margin:0; padding:0; }
body { font-family:'Arial', Helvetica, Sans-Serif; font-size:18px; color:#404040; }
#wrapper { width:100%; max-width:1260px; margin:0 auto; overflow:hidden; }

.explore { font-size:16px; border-bottom:1px solid #d9d9d9; text-align:center; padding:12px 0 10px; text-transform:uppercase; display:none; }

nav { border: 1px solid #d9d9d9; padding:0; margin:0; overflow:hidden; }
nav ul { margin:0; padding:0; }
nav li { font-family:'Arial Black', Helvetica, Sans-Serif; width:-moz-calc(33.333333% - 18px); width:-webkit-calc(33.333333% - 18px);  width:calc(33.333333% - 18px);  font-weight:bold; color:#595959; text-transform:uppercase; display:inline-block; cursor:pointer; position:relative; padding:11px 0 13px; text-align:center; float:left; }
nav li.active { color:#dd1d21; }
nav li:after { content:''; position:absolute; background:#fbce07; width:90%; height:5px; bottom:0; left:50%; transform: translateX(-50%); }
nav li.active:after { content:''; position:absolute; background:#dd1d21; width:90%; height:5px; bottom:0; left:50%; transform: translateX(-50%); }
nav li span { font-family:'Arial', Helvetica, Sans-Serif; font-weight:normal; margin-right:5px; }
nav li#btnHome { width:50px; height:50px; padding:0; border-right:1px solid #d9d9d9; background:url(../img/icon-box-inactive.png) no-repeat 50% 50%; background-size:25px; }
nav li.active#btnHome { background:url(../img/icon-box-active.png) no-repeat 50% 50%; background-size:25px; }
nav li#btnWealth { border-right:1px solid #d9d9d9; }
nav li#btnWellbeing { border-right:1px solid #d9d9d9; }

.asset-container { background: url(../img/bg-home.jpg) no-repeat 50% 50% / 1700px; height:562px; border: 1px solid #d9d9d9; border-top:0; padding:0px 0 180px; transition: 1s ease all; overflow:hidden; position: relative;; }

/* Home */

#homeBody .container { width:510px; margin:0 auto; padding:161px 30px; text-align:center; }
#homeBody .container #present { width:95px; height:110px; background:url(../img/img-present.png) no-repeat 0 0; background-size:100%; margin:0 auto; }
#homeBody .container h2 { font-family:'Arial Black', Helvetica, Sans-Serif; font-size:30px; color:#dd1d21; text-transform:uppercase; }
#homeBody .container p { line-height:26px; }


/* Wealth */

#wealthBody { width:-moz-calc(100% - 323px); width:-webkit-calc(100% - 323px); width:calc(100% - 323px); height:562px; border: 1px solid #d9d9d9; border-top:0; border-left:0; padding:90px 0; float:left; display:none; }
#wealthBody .container { position:relative; }

#wealthBodyMobile { display:none; }

/* Wellbeing */

#wellbeingBody { width:-moz-calc(100% - 323px); width:-webkit-calc(100% - 323px); width:calc(100% - 323px); height:562px;border: 1px solid #d9d9d9; border-top:0; border-left:0; padding:90px 0; float:left; display:none; }
#wellbeingBody .container { position:relative; }
#wellbeingBodyMobile { display:none; }

/* Lifestyle */

#lifestyleBody { width:-moz-calc(100% - 323px); width:-webkit-calc(100% - 323px); width:calc(100% - 323px); height:562px; border: 1px solid #d9d9d9; border-top:0; border-left:0; padding:90px 0; float:left; display:none; }
#lifestyleBody .container { position:relative; }
#lifestyleBodyMobile { display:none; }

/* Benefits Icons */

.benefit { width:150px; font-family:'Arial Black', Helvetica, Sans-Serif; font-size:14px; line-height:20px; font-weight:bold; color:#595959; text-transform:uppercase; text-align:center; padding:100px 0 0; position:absolute; cursor:pointer; }
.benefit.active { color:#dd1d21; }

.benefit#pension { background:url(../img/icon-pension.png) no-repeat 50% 0; background-size:80px; top:22px; left:120px; padding:96px 0 0; }
.benefit.active#pension { background:url(../img/icon-pension-active.png) no-repeat 50% 0; background-size:80px; }
.benefit#financialeducation { background:url(../img/icon-finance.png) no-repeat 40% 0; background-size:60px; top:20px; left:280px; }
.benefit.active#financialeducation { background:url(../img/icon-finance-active.png) no-repeat 40% 0; background-size:60px; }
.benefit#basesalary { background:url(../img/icon-wallet.png) no-repeat 50% 0;  background-size:70px; top:200px; left:40px; }
.benefit.active#basesalary { background:url(../img/icon-wallet-active.png) no-repeat 50% 0;  background-size:70px; }
.benefit#discretionarybonus { background:url(../img/icon-wallet.png) no-repeat 50% 0;  background-size:70px; top:200px; left:190px; }
.benefit.active#discretionarybonus { background:url(../img/icon-wallet-active.png) no-repeat 50% 0; background-size:70px; }
.benefit#londonallowance { background:url(../img/icon-wallet.png) no-repeat 50% 0;  background-size:70px; top:200px; left:360px; }
.benefit.active#londonallowance { background:url(../img/icon-wallet-active.png) no-repeat 50% 0;  background-size:70px;  }
.benefit#carallowance { background:url(../img/icon-car.png) no-repeat 50% 0;  background-size:80px; top:409px; left:100px; padding:80px 0 0; }
.benefit.active#carallowance { background:url(../img/icon-car-active.png) no-repeat 50% 0; background-size:80px; }
.benefit#tax { background:url(../img/icon-chart.png) no-repeat 50% 0;  background-size:80px; top:390px; left:280px; }
.benefit.active#tax { background:url(../img/icon-chart-active.png) no-repeat 50% 0;  background-size:80px; }

.benefit#healthcare { background:url(../img/icon-wellbeing.png) no-repeat 50% 0; background-size:80px; top: -50px; left: 330px; }
.benefit.active#healthcare { background:url(../img/icon-wellbeing-active.png) no-repeat 50% 0; background-size:80px; }
.benefit#bewell { background:url(../img/icon-wellbeing.png) no-repeat 40% 0; background-size:80px; top:-50px; left:500px; }
.benefit.active#bewell { background:url(../img/icon-wellbeing-active.png) no-repeat 40% 0; background-size:80px; }
.benefit#gip { background:url(../img/icon-wellbeing.png) no-repeat 50% 0;  background-size:80px; top:140px; left:330px; }
.benefit.active#gip { background:url(../img/icon-wellbeing-active.png) no-repeat 50% 0;  background-size:80px; }
.benefit#employeeassistance { background:url(../img/icon-wellbeing.png) no-repeat 50% 0;  background-size:80px; top:140px; left:490px; }
.benefit.active#employeeassistance { background:url(../img/icon-wellbeing-active.png) no-repeat 50% 0; background-size:80px; }

.benefit#flexible { background:url(../img/icon-flexible.png) no-repeat 50% 0; background-size:80px; top:90px; right:350px; padding:110px 0 0; }
.benefit.active#flexible { background:url(../img/icon-flexible-active.png) no-repeat 50% 0; background-size:80px; }
.benefit#annualleave { background:url(../img/icon-leave.png) no-repeat 40% 0; background-size:80px; top:100px; right:200px; }
.benefit.active#annualleave { background:url(../img/icon-leave-active.png) no-repeat 40% 0; background-size:80px; }
.benefit#family { background:url(../img/icon-maternity.png) no-repeat 50% 0;  background-size:80px; top:100px; right:50px; }
.benefit.active#family { background:url(../img/icon-maternity-active.png) no-repeat 50% 0;  background-size:80px; }
.benefit#childcare { background:url(../img/icon-childcare.png) no-repeat 50% 0;  background-size:80px; top:350px; right:350px; }
.benefit.active#childcare { background:url(../img/icon-childcare-active.png) no-repeat 50% 0; background-size:80px; }
.benefit#discounts { background:url(../img/icon-discounts.png) no-repeat 50% 0;  background-size:80px; top:350px; right:200px; }
.benefit.active#discounts { background:url(../img/icon-discounts-active.png) no-repeat 50% 0; background-size:80px; }
.benefit#seasonticket { background:url(../img/icon-discounts.png) no-repeat 50% 0;  background-size:80px; top:350px; right:50px; }
.benefit.active#seasonticket { background:url(../img/icon-discounts-active.png) no-repeat 50% 0; background-size:80px; }

/* Sidebar */

#sidebar { width:260px; height:700px; background:#fff; border-right:1px solid #d9d9d9;  border-bottom:1px solid #d9d9d9; padding:20px 30px 22px; float:left; display:none;  }
#sidebar h3 { font-family:'Arial Black', Helvetica, Sans-Serif; font-size:18px; color:#dd1d21; text-transform:uppercase; margin:20px 0 0 0; }
#sidebar p { font-size:16px; line-height:26px; float:left; margin:10px 0 10px 0; }

#sidebar .icon { width:50px; height:50px;  float:left; display:block; }
#sidebar #sidebar-pension .icon { background: url(../img/icon-pension-active.png) no-repeat 0 50%; background-size:50px; margin:5px 10px 0 0; }
#sidebar #sidebar-financialeducation .icon { background:url(../img/icon-finance-active.png) no-repeat 50% 50%; background-size:40px; margin:20px 10px 0 0;  }
#sidebar #sidebar-basesalary .icon { background: url(../img/icon-wallet-active.png) no-repeat 50% 50%; background-size:45px; margin:5px 10px 0 0; }
#sidebar #sidebar-discretionarybonus .icon { background: url(../img/icon-wallet-active.png) no-repeat 50% 50%; background-size:45px; margin:20px 10px 10px 0; }
#sidebar #sidebar-londonallowance .icon { background: url(../img/icon-wallet-active.png) no-repeat 50% 5px; background-size:45px; margin:20px 10px 0 0; }
#sidebar #sidebar-carallowance .icon { background: url(../img/icon-car-active.png) no-repeat top center; background-size:45px; margin:20px 10px -5px 0; }
#sidebar #sidebar-tax .icon { background: url(../img/icon-chart-active.png) no-repeat top center; background-size:45px; margin:25px 10px 10px 0; }

#sidebar #sidebar-healthcare .icon { background: url(../img/icon-wellbeing-active.png) no-repeat 0 50%; background-size:45px; margin:21px 10px 5px 0; }
#sidebar #sidebar-bewell .icon { background:url(../img/icon-wellbeing-active.png) no-repeat 50% 50%; background-size:45px; margin:8px 10px 5px 0; }
#sidebar #sidebar-gip .icon { background: url(../img/icon-wellbeing-active.png) no-repeat 50% 50%; background-size:45px; margin:21px 10px 5px 0; }
#sidebar #sidebar-employeeassistance .icon { background: url(../img/icon-wellbeing-active.png) no-repeat 50% 50%; background-size:45px; margin:21px 10px 5px 0; }

#sidebar #sidebar-flexible .icon { background: url(../img/icon-flexible-active.png) no-repeat 0 50%; background-size:45px; margin:21px 10px 5px 0; }
#sidebar #sidebar-annualleave .icon { background:url(../img/icon-leave-active.png) no-repeat 50% 50%; background-size:45px; margin:8px 10px 5px 0; }
#sidebar #sidebar-family .icon { background: url(../img/icon-maternity-active.png) no-repeat 50% 50%; background-size:45px; margin:10px 10px 5px 0; }
#sidebar #sidebar-childcare .icon { background: url(../img/icon-childcare-active.png) no-repeat 50% 50%; background-size:45px; margin:21px 10px 5px 0; }
#sidebar #sidebar-discounts .icon { background: url(../img/icon-discounts-active.png) no-repeat 50% 50%; background-size:45px; margin:21px 10px 5px 0; }
#sidebar #sidebar-seasonticket .icon { background: url(../img/icon-discounts-active.png) no-repeat 50% 50%; background-size:45px; margin:21px 10px 5px 0; }

#sidebar .sidebar-content { display:none; overflow:hidden; }

	#boxWrapper {
		position:absolute;
		background:#fff;
		width:100%;
		height:748px;
		top:-5px;
		left:0;
		opacity:1;
	}

    #boxWrapper h2 { width:800px; font-size:18px; font-family:'Arial'; color:#404040; font-weight:normal; position:absolute; top:-70px; left:0px; }

	#box {
	  position: relative;
	  background: url(../img/bg-home.jpg) no-repeat -581px 50% / 1710px;
	  width:550px;
	  height: 550px;
	  perspective: 800px;
	  margin:102px auto 0;
	  cursor: pointer;
	} 
	
	#flap1, #flap2, #flap3, #flap4 {
	  position: absolute;
	  box-sizing: border-box;
	}
	
	#flap1 {
      background: #f2f2f2;
	  -webkit-box-shadow: inset 0 0 2px #dddddd;
	  		  box-shadow: inset 0 0 2px #dddddd;
	  width: 275px;
	  height: 550px;
	  z-index: 1;
	  transform-origin: 0 0;
	  transition: transform ease-in-out 1.5s, background ease-in 1.5s;
	}
	
	#flap2 {
	  left: 275px;
      background: #eeeeee;
	  -webkit-box-shadow: inset 0 0 2px #dddddd;
	  		  box-shadow: inset 0 0 2px #dddddd;
	  width: 274px;
	  height: 550px;
	  z-index: 1;
	  transform-origin: 100% 0;
	  transition: transform 1.5s ease-in-out 1.5s, background 1.5s ease-in 1.5s;
	}
	
	#flap3 {
      background: #f2f2f2;
	  -webkit-box-shadow: inset 0 0 2px #dddddd;
	  		  box-shadow: inset 0 0 2px #dddddd;
	  width: 550px;
	  height: 275px;
	  transform-origin: 0 0;
	  transition: transform 1.5s ease-in-out 3s, background 1.5s ease-in 3s;
	}
	
	#flap4 {
      background: #eeeeee;
	  -webkit-box-shadow: inset 0 0 2px #dddddd;
	  		  box-shadow: inset 0 0 2px #dddddd;
	  top: 275px;
	  width: 550px;
	  height: 275px;
	  transform-origin: 0 100%;
	  transition: transform 1.5s ease-in-out 4.5s, background 1.5s ease-in 4.5s;
	}

#foot { width:100%; max-width:1260px; margin:0 auto; }
	
	/*#box:hover #flap1{
      background: #f2f2f2;	
	  transform: rotateY(-170deg) scaleX(2);
	}
	#box:hover #flap2{
      background: #f2f2f2;
	  transform: rotateY(170deg) scaleX(2);
	}
	#box:hover #flap3{
      background: #f2f2f2;
	  transform: rotateX(170deg) scaleY(2);
	}
	#box:hover #flap4{
      background: #f2f2f2;
	  transform: rotateX(-170deg) scaleY(2);
	}		*/

/* Mobile styling */

@media (max-width:768px) {
	
	.explore { display:block; }
	
	.asset-container { background:none !important; padding:0; height:auto; border:0; }
	
	#boxWrapper {display:none;}
	
	#sidebar { display:none !important; }
	
	button.accordion { font-size:16px; font-weight:bold; background-color: #ffffff; color: #595959; border:none; border-bottom:1px solid #d9d9d9; cursor: pointer; padding: 20px 35px 10px 15px; width: 100%; text-align: left; outline: none; transition: 0.4s; position:relative; }
	button.accordion.active { color:#dd1d21; border-bottom:none; }
	button.accordion:after { content:'\e618'; font-family:'icomoon'; font-size:22px; font-weight:normal; width:22px; height:22px; position:absolute; top:50%; right:10px; transform: translateY(-50%); }
	button.accordion.active:after { content:'\e606'; font-family:'icomoon'; font-size:22px; color:#dd1d21; font-weight:normal; width:22px; height:22px; position:absolute; top:50%; right:10px; transform: translateY(-50%); }
	div.panel { padding: 0 18px; margin-top:-18px; background-color: white; border-bottom:1px solid #d9d9d9; display: none; }

	nav span { display:none; }
	nav li { font-size:12px; width:-moz-calc(33.333333% - 15px); width:-webkit-calc(33.333333% - 15px);  width:calc(33.333333% - 15px); padding:11px 0 12px; }	
	nav li#btnHome { width:40px; height:40px; padding:0; background:url(../img/icon-box-inactive.png) no-repeat 50% 50%; background-size:20px; }
	nav li.active#btnHome { background:url(../img/icon-box-active.png) no-repeat 50% 45%; background-size:20px; }
	
	#homeBody { background: url(../img/bg-home.jpg) repeat 50% 50%; background-size:2400px; padding:0; position:relative;  }
	#homeBody .container { width:-moz-calc(100% - 60px); width:-webkit-calc(100% - 60px); width:calc(100% - 60px); padding:50px 30px; }
	/*#homeBody .container:after { content:''; background:rgba(255,255,255,0.5); width:100%; height:100%; position:absolute; top:0; left:0; z-index:1; }*/
	#homeBody .container #present { width:70px; height:90px; background:url(../img/img-present.png) no-repeat 0 0; background-size:100%; margin:0 auto; z-index:2; position:relative; }
	#homeBody .container h2 { font-family:'Arial Black', Helvetica, Sans-Serif; font-size:19px; color:#dd1d21; text-transform:uppercase; z-index:2; position:relative; }
	#homeBody .container p { font-size:14px; line-height:22px; z-index:2; position:relative; }
	.mobile-category .container p { font-size:14px; line-height:22px; z-index:2; position:relative; }
	
	.icon { width:40px; height:40px; float:left; display:block; }
	#wealthBodyMobile #pensionMob .icon { background: url(../img/icon-pension.png) no-repeat 0 50%; background-size:40px; margin:-13px 10px 0 0; }
	#wealthBodyMobile #pensionMob.active .icon { background: url(../img/icon-pension-active.png) no-repeat 0 50%; background-size:40px; }
	#wealthBodyMobile #financialeducationMob .icon { background: url(../img/icon-finance.png) no-repeat 0 50%; background-size:30px; margin:-13px 10px 0 0; }
	#wealthBodyMobile #financialeducationMob.active .icon { background: url(../img/icon-finance-active.png) no-repeat 0 50%; background-size:30px; }
	#wealthBodyMobile #basesalaryMob .icon { background: url(../img/icon-wallet.png) no-repeat 0 50%; background-size:30px; margin:-13px 7px 0 3px; }
	#wealthBodyMobile #basesalaryMob.active .icon { background: url(../img/icon-wallet-active.png) no-repeat 0 50%; background-size:30px; }
	#wealthBodyMobile #discretionarybonusMob .icon { background: url(../img/icon-wallet.png) no-repeat 0 50%; background-size:30px; margin:-13px 7px 0 3px; }
	#wealthBodyMobile #discretionarybonusMob.active .icon { background: url(../img/icon-wallet-active.png) no-repeat 0 50%; background-size:30px; }
	#wealthBodyMobile #londonallowanceMob .icon { background: url(../img/icon-wallet.png) no-repeat 0 50%; background-size:30px; margin:-13px 7px 0 3px; }
	#wealthBodyMobile #londonallowanceMob.active .icon { background: url(../img/icon-wallet-active.png) no-repeat 0 50%; background-size:30px; }
	#wealthBodyMobile #carallowanceMob .icon { background: url(../img/icon-car.png) no-repeat 0 50%; background-size:30px; margin:-13px 7px 0 3px; }
	#wealthBodyMobile #carallowanceMob.active .icon { background: url(../img/icon-car-active.png) no-repeat 0 50%; background-size:30px; }
	#wealthBodyMobile #taxMob .icon { background: url(../img/icon-chart.png) no-repeat top center; background-size:35px; margin:-6px 13px 0 -3px; }
	#wealthBodyMobile #taxmob.active .icon { background: url(../img/icon-chart-active.png) no-repeat top center; background-size:35px; }
	
	#wellbeingBodyMobile #healthcareMob .icon { background: url(../img/icon-wellbeing.png) no-repeat 0 50%; background-size:35px; margin:-13px 10px 0 0; }
	#wellbeingBodyMobile #healthcareMob.active .icon { background: url(../img/icon-wellbeing-active.png) no-repeat 0 50%; background-size:35px; }
	#wellbeingBodyMobile #bewellMob .icon { background: url(../img/icon-wellbeing.png) no-repeat 0 50%; background-size:35px; margin:-13px 10px 0 0; }
	#wellbeingBodyMobile #bewellMob.active .icon { background: url(../img/icon-wellbeing-active.png) no-repeat 0 50%; background-size:35px; }
	#wellbeingBodyMobile #gipMob .icon { background: url(../img/icon-wellbeing.png) no-repeat 0 50%; background-size:35px; margin:-13px 10px 0 0; }
	#wellbeingBodyMobile #gipMob.active .icon { background: url(../img/icon-wellbeing-active.png) no-repeat 0 50%; background-size:35px; }
	#wellbeingBodyMobile #employeeassistanceMob .icon { background: url(../img/icon-wellbeing.png) no-repeat 0 50%; background-size:35px; margin:-13px 10px 0 0; }
	#wellbeingBodyMobile #employeeassistanceMob.active .icon { background: url(../img/icon-wellbeing-active.png) no-repeat 0 50%; background-size:35px; }
	
	#lifestyleBodyMobile #flexibleMob .icon { background: url(../img/icon-flexible.png) no-repeat 0 50%; background-size:35px; margin:-13px 10px 0 0; }
	#lifestyleBodyMobile #flexibleMob.active .icon { background: url(../img/icon-flexible-active.png) no-repeat 0 50%; background-size:35px; }
	#lifestyleBodyMobile #annualleaveMob .icon { background: url(../img/icon-leave.png) no-repeat 0 50%; background-size:35px; margin:-13px 10px 0 0; }
	#lifestyleBodyMobile #annualleaveMob.active .icon { background: url(../img/icon-leave-active.png) no-repeat 0 50%; background-size:35px; }
	#lifestyleBodyMobile #familyMob .icon { background: url(../img/icon-maternity.png) no-repeat 0 50%; background-size:35px; margin:-13px 10px 0 0; }
	#lifestyleBodyMobile #familyMob.active .icon { background: url(../img/icon-maternity-active.png) no-repeat 0 50%; background-size:35px; }
	#lifestyleBodyMobile #childcareMob .icon { background: url(../img/icon-childcare.png) no-repeat 0 50%; background-size:35px; margin:-13px 10px 0 0; }
	#lifestyleBodyMobile #childcareMob.active .icon { background: url(../img/icon-childcare-active.png) no-repeat 0 50%; background-size:35px; }
	#lifestyleBodyMobile #discountsMob .icon { background: url(../img/icon-discounts.png) no-repeat 0 50%; background-size:35px; margin:-13px 10px 0 0; }
	#lifestyleBodyMobile #discountsMob.active .icon { background: url(../img/icon-discounts-active.png) no-repeat 0 50%; background-size:35px; }
	#lifestyleBodyMobile #seasonticketMob .icon { background: url(../img/icon-discounts.png) no-repeat 0 50%; background-size:35px; margin:-13px 10px 0 0; }
	#lifestyleBodyMobile #seasonticketMob.active .icon { background: url(../img/icon-discounts-active.png) no-repeat 0 50%; background-size:35px; }
	
	#footer { border-top:1px solid #ddd; }
}

/*.show { display:block !important; }*/


/* modal box disclaimer */
.disclaimer-btn { margin: 20px 0 10px; text-decoration: none; display: inline-block; padding:  10px 20px; background: #efefef; border: solid 1px #ddd; line-height:  20px; font-size: 14px; font-weight: bold; color: #404040; text-transform:  uppercase; }

.modal-box {
  display: none;
  position: absolute;
  z-index: 1000;
  width: 75%;
  background: #fff;
  border: 1px solid #ddd;
	border-bottom: 5px solid #f7d117;
  background-clip: padding-box;
}


@media (min-width: 32em) {

.modal-box { width: 60%; }
}


.modal-box .modal-body { padding: 0 40px 30px 30px; max-height:  350px; overflow-y: scroll; }
.modal-box .modal-body h3 { color: #dd1d21;}
.modal-box .modal-body p, .modal-box .modal-body li { font-size: 14px; line-height: 20px;}
.modal-box .modal-body ul { list-style-type: none; padding-left: 30px; }
.modal-box .modal-body ul li { position: relative;  margin-bottom: 5px;}
.modal-box .modal-body ul li:before { content:""; float: left; display: block; width: 8px; height: 8px; margin-top: 7px; margin-left: -15px; position: absolute;background: #dd1d21;}

.modal-box .modal-body ul li span { display: block; float: left; }
.modal-overlay {
  /*opacity: 0;
  filter: alpha(opacity=0);*/
  position: absolute;
  top: 0;
  left: 0;
  z-index: 900;
  width: 100%;
  height: 100%;
  /*background: rgba(0, 0, 0, 0.3) !important;*/
}

a.close {
  line-height: 1;
  font-size: 40px;
  position: absolute;
  top: 10px;
  right: 30px;
  text-decoration: none;
  color: #bbb;
	
}

a.close:hover {
  color: #222;
  -webkit-transition: color 1s ease;
  -moz-transition: color 1s ease;
  transition: color 1s ease;
}