﻿/* MY ACCOUNT NAVIGATION - Signed in and Signed out */

.mod-nav .userMenu {	
	position: absolute;
	left: 131px;
	top: 0;
}

.mod-nav .userMenu .navLink:link,
.mod-nav .userMenu .navLink:visited {
	background: transparent url(../../images/navigation/nav-list-user.png) no-repeat 0 0;
	padding-left: 40px;
	float: left;
}

.mod-nav .userMenu .navLink:hover,
.mod-nav .userMenu .navLink:active,
.mod-nav .userMenu .navLink:focus {background-position: 0 -41px;}


/* Active State */
.mod-nav .userMenu .navLink.active {background-position: 0 -41px;}

.mod-nav .signedIn .navLink span {
	background: transparent url(../../images/navigation/nav-list-arrow.png) no-repeat 100% 0;
	padding-right: 20px; 
}

.mod-nav .signedIn .navLink.active span {background-position: 100% -190px;}

.mod-nav .userMenu .userMenuSub {
	background: #484848;	
	clear: both;	
	display: none;
	left: 0;
	top: 41px;
	padding: 10px 0;	
	position: absolute;	
	min-width: 195px;
}


/* Active State */
.mod-nav .userMenu .userMenuSub.active {display: block;}

.mod-nav .userMenu .userName {
	font-weight: bold;
	color: rgb(255,255,255);
	font-size: 14px;
	margin: 0 10px 10px;
}

.mod-nav .userMenu .navButton {
	background: rgb(225,225,225);
	width: auto;
	font-weight: bold;	
	margin-left: 10px;
}

.mod-nav .userMenu .navButton a:link,
.mod-nav .userMenu .navButton a:visited {
	color: rgb(52,52,52);
	line-height: 1;
	padding: 10px;
	height: auto;
}

.mod-nav .userMenu .navButton a:hover,
.mod-nav .userMenu .navButton a:active,
.mod-nav .userMenu .navButton a:focus {
	background: rgb(52,52,52);
	color: rgb(255,255,255);
}

/* END MY ACCOUNT NAVIGATION */

/* Mod-lightbox*/

.mod-lightbox{
    width:770px;
    background:#fff;
    min-height: 325px;
}
.mod-lightbox a,
.mod-lightbox .btn {color:#002f5d;}
.mod-lightbox .disabled{color:#999;background-position:0 -569px;cursor:auto;}

.col-content{
    width:320px;
    float:left;
    overflow: auto;
    padding: 0 50px 20px 20px;
    }
.col-content .formHead{
    border-bottom: 1px solid #DADADA;
    overflow:auto;
    width: 100%;
    margin: 30px 0 20px;
}
.ie7 .col-content{overflow:hidden;}
    .col-content .formHead h2{
        float: left;
        font-size: 35px;
        line-height: 100%;
    }
    .col-content .formHead p {float: right;}
    .col-content p {padding:0 0 10px 0; margin-bottom:0;}
    .col-content .formHead p a{font-weight:bold;}
.col-r{
    width:330px;
    background:url("../../images/modules/mod-lightbox-separator.png") no-repeat 0 0 #eee;
    min-height:622px;
    float:right;
    padding: 25px 20px;
    text-align: center;
    }

.col-r h2, #cboxContent .col-r h2 {
    background: url("../../images/modules/mod-lightbox-TheFA-logo.png") no-repeat scroll center 0 transparent;
    height: 245px;
    text-indent: -999em;
    width: 350px;
    }
.mod-lightboxSignIn .col-content {}

.col-r h3 {
    background: none;
    width: 310px;
    font-size: 2.3em;
    margin-bottom: 20px;
    font-family: 'FSJackRegular';
    line-height: 33px;
}
    
/* .col-r h3{
    background: url("../../images/modules/mod-lightbox-intro.png") no-repeat scroll center 0 transparent;
    height: 254px;
    text-indent: -999em;
    width: 350px;
} */

.col-r p.marketing{
    background: url("../../images/modules/mod-lightbox-divider.png") no-repeat scroll center bottom transparent;
    padding: 10px 0 12px 0;
    margin:0;
    font-size:1.3em;
}

.col-r p.marketing-last {
    background: none;
    padding: 10px 0 12px 0;
    margin:0;
    font-size:1.3em;
}

.formRow{
    clear:both;
    margin:0 0 10px 0;
    }

.formRow .formRowcal{
    width:280px;
    float:left;
    }
   .formRow .formRowcal input.input-text {margin: 0 10px 15px 0;}
    .formRow input.input-text{
        width: 300px;
        color:#b2b2b2; 
        float: none;   
    }
    .formRow input{
        margin-right:10px;
        float:left;
    }
    .formRow label{
        display:block;
        font-weight: bold;  
        margin:0 5px 7px 0; 
        float:left;
        width:auto;
    }
    
   
    .opt label {
        width:290px; 
        margin-right:0;
        font-size: 11px;
        font-weight: normal;
}
    .ie .opt label {width: 285px; margin-right:0;}    
    .ie7 .formRow label {margin:0 10px 7px 0;}  
    
    .formRow .formRowcal label {
        width:150px;
    }
    .formRow .formRowpass label{
        width:auto;
        margin-right:5px;
    }
    
    .ie7 .formRow .formRowpass label{
        margin-right:10px;
    }
    
    .formRow .formRowcal span {
        float:right;
        clear:none;
        font-size: 11px;
   }
   
  .formRow .formRowpass span {
        float:left;
        clear:none;
        font-size: 11px;
        margin-top:1px;
   }
    
    .ie7 .formRow label {margin:0;}
    .formRowError input {border: 1px solid #E30613;}
    .formRowError label {color:#e30613;}
    .formRow span{
        float:left;
        font-size: 11px;
        margin-top:1px;
   }
    .ie7 .formRow span {margin-left:5px;}
     /* .formRow .calendarIcon  {
        background: url("../../images/modules/mod-lightbox-calendarIcon.png") no-repeat scroll center 0 transparent;
        display: block;
        float: left;
        height: 26px;
        left: 15px;
        position: relative;
        top: 34px;
        width: 26px;
        clear:none;
    } */
    
    .formRow .calendarIcon  {display:none;}
     
    .mod-lightbox .custom-checkbox label{
        background:url("../../images/modules/mod-lightbox-checkBoxes.png") no-repeat scroll -13px -15px transparent;
        font-weight: normal;
        font-size:11px; 
        color:#666;
    }
    .mod-lightbox .custom-checkbox label.hover, .mod-lightbox .custom-radio label.hover{background-position: -13px -114px;}
    .mod-lightbox .custom-checkbox label.checked, .mod-lightbox .custom-radio label.checked{background-position: -13px -215px;}
    .mod-lightbox .tncs    {
        float: left;
        font-size: 12px;
        line-height: 100%;
        padding: 6px 0 0.5em 5px;}
        .mod-lightbox .tncs a{color:#666;text-decoration:underline;}
    .mod-lightbox .custom-checkbox{overflow:auto;float: left;}
    #formSignUp{margin:15px 0 0 0;}
    
    
    .mod-lightbox-errorSummary{
        background:url("../../images/modules/mod-lightbox-error-icon.png") no-repeat 10px 5px #e30613;
        color:#fff;
        padding:0 0 0 45px;
        min-height:35px;
    }
        .mod-lightbox-errorSummary p {
            color:#fff;
            line-height: 100%;
            padding: 10px 10px 10px 45px;
            margin: 0 0 20px;
        }
        
        .mod-lightbox-errorSummary li {padding:10px 0;}
                
/*Signin*/
.formRow input {line-height: 1.5;}
.need {clear:both; padding:0 0px 0px 25px;}
.mod-lightboxSignin{
    background: url("../../images/modules/mod-lightbox-TheFA-logo.png") no-repeat scroll 30px 30px transparent;
    width:620px;
    overflow: hidden;
    height:auto;
}

.theme-england .mod-lightboxSignin{height:371px;}

.mod-lightboxSignin .col-content {float:right;}
    
.formRow .input-validation-error {border: 1px solid #E30613;}
.formRow .data-val-required {border: 1px solid #E30613;}

.cp-loader-sign-in {
    position: fixed;
    top: 50%;
    left: 50%;
}

#ResetPasswordForm .formRow input.input-text {
    float: left;
    clear:both;
    margin:10px 0 20px 0;
}

/*Reset*/
.formRow .lbtn-l{float:left;}
.formRow .footertxt{font-size:12px;float:right;position:relative;top:7px;clear:none;}
.formRow .footertxt a{font-weight:bold;}
.custom-checkbox .smallTxt{font-size:11px;color:#999;}

/*form table*/
.mod-lightbox table{
       width:100%;
}
.mod-lightbox table th{
background:#002f5d;color:#fff;font-weight:bold;}

.mod-lightbox table th,
.mod-lightbox table td{
    padding:10px 5px;
    text-align:left;
}
.mod-lightbox table tr:hover td{background:#f5f5f5;}
.mod-lightbox table tr:hover td a{color:#666;}
.mod-lightbox table td{border-bottom: 1px solid #ededed;}
.mod-lightbox table td.first{border-left: 1px solid #ededed;}
.mod-lightbox table td.last{border-right: 1px solid #ededed;}
.mod-lightbox table a{font-weight:bold;}
.mod-lightboxAccount{width:730px;}
.mod-lightboxAccount .col-content {width:430px;}
.mod-lightboxAccount .footertxt{
    float: right;
    padding: 18px 0 0;
    position: relative;
}
.mod-lightboxAccount .footertxt a{font-weight:bold;font-size: 13px;}

/* With benefits*/

.mod-lightboxWithBenefits{
    width:930px;
    background:url("../../images/modules/mod-lightbox-TheFA-logo.png") no-repeat scroll 30px 30px transparent;
}

.mod-lightboxWithBenefits .col-content{padding:0 40px 20px 225px;}
.mod-lightboxWithBenefits .footertxt{
    width:70%;
    text-align:right;
}
.mod-lightboxWithBenefits .col-r{
    width:305px;
    min-height:300px;
    text-align:center;
}
.ui-datepicker { width: 17em; padding: .2em .2em 0;background: none repeat scroll 0 0 #fff;border: 1px solid #CECECE; display:none;}
.ui-datepicker .ui-datepicker-header { position:relative; padding:.2em 0;border-bottom: 1px solid #CECECE; height:24px;}
.ui-datepicker .ui-datepicker-prev, .ui-datepicker .ui-datepicker-next { position:absolute; top: 1px; width: 1.8em; height: 1.8em; }
.ui-datepicker .ui-datepicker-prev-hover, .ui-datepicker .ui-datepicker-next-hover { top: 0px; }
.ui-datepicker .ui-datepicker-prev { left:1px; }
.ui-datepicker .ui-datepicker-next { right:10px; }
.ui-datepicker .ui-datepicker-prev-hover { left:0px; }
.ui-datepicker .ui-datepicker-next-hover { right:9px; }
.ui-datepicker .ui-datepicker-prev span, .ui-datepicker .ui-datepicker-next span { display: block; position: absolute; left: 50%; margin-left: -8px; top: 50%; margin-top: -8px; color: #666666;}
.ui-datepicker .ui-datepicker-title { margin: 0 2.3em; line-height: 1.8em; text-align: center; }
.ui-datepicker .ui-datepicker-title select { float:left; font-size:1em; margin:1px 0; }
.ui-datepicker select.ui-datepicker-month-year {width: 100%;}
.ui-datepicker select.ui-datepicker-month {margin-left : 10px;}
.ui-datepicker select.ui-datepicker-month, 
.ui-datepicker select.ui-datepicker-year { width: 60px; height:18px;}
.ui-datepicker .ui-datepicker-title select.ui-datepicker-year {float: left; margin-left: 5px;}
.ui-datepicker table {width: 100%; font-size: .9em; border-collapse: collapse; margin:0 0 .4em; }
.ui-datepicker th { padding: .7em .3em; text-align: center; font-weight: bold; border: 0;  }
.ui-datepicker td { border: 0; padding: 3px;border: 1px solid #CECECE; }
.ui-datepicker td span, .ui-datepicker td a { display: block; padding: .2em; text-align: right; text-decoration: none; }
.ui-datepicker .ui-datepicker-buttonpane { background-image: none; margin: .7em 0 0 0; padding:0 .2em; border-left: 0; border-right: 0; border-bottom: 0; }
.ui-datepicker .ui-datepicker-buttonpane button { float: right; margin: .5em .2em .4em; cursor: pointer; padding: .2em .6em .3em .6em; width:auto; overflow:visible; }
.ui-datepicker .ui-datepicker-buttonpane button.ui-datepicker-current { float:left; }

/* with multiple calendars */
.ui-datepicker.ui-datepicker-multi { width:auto; }
.ui-datepicker-multi .ui-datepicker-group { float:left; }
.ui-datepicker-multi .ui-datepicker-group table { width:95%; margin:0 auto .4em; }
.ui-datepicker-multi-2 .ui-datepicker-group { width:50%; }
.ui-datepicker-multi-3 .ui-datepicker-group { width:33.3%; }
.ui-datepicker-multi-4 .ui-datepicker-group { width:25%; }
.ui-datepicker-multi .ui-datepicker-group-last .ui-datepicker-header { border-left-width:0; }
.ui-datepicker-multi .ui-datepicker-group-middle .ui-datepicker-header { border-left-width:0; }
.ui-datepicker-multi .ui-datepicker-buttonpane { clear:left; }
.ui-datepicker-row-break { clear:both; width:100%; }

/* RTL support */
.ui-datepicker-rtl { direction: rtl; }
.ui-datepicker-rtl .ui-datepicker-prev { right: 2px; left: auto; }
.ui-datepicker-rtl .ui-datepicker-next { left: 2px; right: auto; }
.ui-datepicker-rtl .ui-datepicker-prev:hover { right: 1px; left: auto; }
.ui-datepicker-rtl .ui-datepicker-next:hover { left: 1px; right: auto; }
.ui-datepicker-rtl .ui-datepicker-buttonpane { clear:right; }
.ui-datepicker-rtl .ui-datepicker-buttonpane button { float: left; }
.ui-datepicker-rtl .ui-datepicker-buttonpane button.ui-datepicker-current { float:right; }
.ui-datepicker-rtl .ui-datepicker-group { float:right; }
.ui-datepicker-rtl .ui-datepicker-group-last .ui-datepicker-header { border-right-width:0; border-left-width:1px; }
.ui-datepicker-rtl .ui-datepicker-group-middle .ui-datepicker-header { border-right-width:0; border-left-width:1px; }

/* IE6 IFRAME FIX (taken from datepicker 1.5.3 */
.ui-datepicker-cover {
    display: none; /*sorry for IE5*/
    display/**/: block; /*sorry for IE5*/
    position: absolute; /*must have*/
    z-index: -1; /*must have*/
    filter: mask(); /*must have*/
    top: -4px; /*must have*/
    left: -4px; /*must have*/
    width: 200px; /*must have*/
    height: 200px; /*must have*/
}


.lbtn {
	background: rgb(255,255,255) url("../../images/components/lbtn-sprite.png") no-repeat scroll 0 -569px;
	border: 0 none;
	color: rgb(0,47,93);
	font-weight: 700;
	font-size: 14px;
	padding: 7px 15px;	
	text-shadow: 1px 1px 0 rgb(255,255,255);
	display:inline-block;
	margin:0;
	cursor:pointer;
	/* CSS3 Box Shadow */
	-webkit-box-shadow: 0 1px 3px 0 rgba(0,0,0,.2);
	-moz-box-shadow: 0 1px 3px 0 rgba(0,0,0,.2);
	-o-box-shadow: 0 1px 3px 0 rgba(0,0,0,.2); 
	-ms-box-shadow: 0 1px 3px 0 rgba(0,0,0,.2);
	box-shadow: 0 1px 3px 0 rgba(0,0,0,.2);
	
	/* CSS3 Transition Effect */
	transition: all .25s ease-in-out;
	-moz-transition: all .25s ease-in-out;
	-webkit-transition: all .25s ease-in-out;	
}
.lbtn:hover{
    background: rgb(255,255,255) url("../../images/components/lbtn-sprite.png") no-repeat 100% -569px;
}

.ie7 .lbtn,
.ie8 .lbtn{
    
	overflow: visible;
	margin-top: -2px;
	width: auto;
	filter:
	progid:DXImageTransform.Microsoft.Shadow(color=#eeeeee,direction=0,strength=2),
	progid:DXImageTransform.Microsoft.Shadow(color=#dddddd,direction=45,strength=1),
	progid:DXImageTransform.Microsoft.Shadow(color=#dddddd,direction=90,strength=2),
	progid:DXImageTransform.Microsoft.Shadow(color=#dddddd,direction=135,strength=2),
	progid:DXImageTransform.Microsoft.Shadow(color=#dddddd,direction=180,strength=3),
	progid:DXImageTransform.Microsoft.Shadow(color=#dddddd,direction=225,strength=2),
	progid:DXImageTransform.Microsoft.Shadow(color=#dddddd,direction=270,strength=2),
	progid:DXImageTransform.Microsoft.Shadow(color=#dddddd,direction=315,strength=1);
	
}

.EnglandExclusiveContent .mod-lightboxWithBenefits{width:660px;}
.EnglandCompetition .mod-lightboxWithBenefits {width:630px;}
.EnglandCompetition .mod-lightboxWithBenefits .col-r, 
.EnglandExclusiveContent  .mod-lightboxWithBenefits .col-r {display:none;}

.staticSignIn .mod-lightbox{overflow:visible;/*padding:150px 0 0 0;*/}
.staticSignIn .mod-lightboxSignin{background:none;}

.mod-lightbox .faq {margin:50px 0 0 0; padding:0;}
.mod-lightbox .faq p {padding:0;}

#cboxContent h2 {padding: 0;}

/*sign up and account pages*/

#mainContainer .mod-signFormPage .mod-lightboxSignin,
.mod-signFormPage .mod-lightbox{
    width:940px;
    margin:0 0 0 10px;
    }
.mod-signFormPage #signin-form{clear:both;}
#mainContainer .mod-signFormPage .mod-lightboxSignin,
.mod-signFormPage .mod-lightbox{
    background: url("../../images/modules/mod-lightbox-bg.jpg") no-repeat right 0 transparent;
    }
.mod-signFormPage .col-r{
    background:none;
    width:430px;    
    }

.mod-signFormPage .formRow .formRowcal,
.mod-signFormPage .col-r h2, 
.mod-signFormPage .col-r h3,
.mod-signFormPage #cboxContent .col-r h2{
    width:430px;
    }
.mod-signFormPage #signin-form .mod-lightbox{
    overflow:auto;
    margin:0 10px;
    }
.mod-signFormPage .opt label,
.mod-signFormPage .formRow input.input-text {width:410px;}
.mod-signFormPage .col-r p.marketing{padding:10px 50px;}
.mod-signFormPage .col-content{
   width: 430px; 
    padding:0 20px 20px 10px;
    }
.mod-signFormPage #mod-quickNav{
    margin: -10px 0 0;
    padding: 10px 0 20px;
    }
.mod-signFormPage .col-r{min-height:300px;}

/*Reset pass*/
.mod-signFormPage .mod-lightboxSignin .col-content{
    float:left;
    }
.mod-signFormPage .col-content .formHead{margin-top:0;}