:root {
    /* Colors */
    --color-primary: #025747;
    --color-primary-contrast: #e4ffb8;
    --color-background-primary: #ffffff;
    --color-background-secondary: #f6f3ee;
    --color-text-primary: #1e1e1e;
    --color-text-tertiary: #707070;
    --color-text-link: #377a69;
    --color-border-input: #868686;
    --color-border-secondary: #dddddd;
    --color-progress-active: #1e1e1e;
    --color-progress-inactive: #dddddd;
    
    /* Typography */
    --font-family-primary: 'Oceanic Grotesk', 'Inter', -apple-system, BlinkMacSystemFont, sans-serif;
    --font-weight-regular: 350;
    --font-weight-medium: 500;
    --font-weight-bold: 700;
    
    /* Font Sizes */
    --font-size-title: 32px;
    --font-size-heading-2: 24px;
    --font-size-body-1: 18px;
    --font-size-body-2: 16px;
    --font-size-button-1: 20px;
    --font-size-label: 16px;
    
    /* Line Heights */
    --line-height-title: 1.5;
    --line-height-body-1: 28px;
    --line-height-body-2: 24px;
    --line-height-button: 20px;
    --line-height-label: 22px;
    
    /* Spacing */
    --spacing-xs: 4px;
    --spacing-sm: 8px;
    --spacing-md: 16px;
    --spacing-lg: 24px;
    --spacing-xl: 18px;
    --spacing-2xl: 30px;
    
    /* Border Radius */
    --radius-round: 9999px;
    --radius-md: 12px;
    --radius-sm: 2px;
}	


	/* Progress Bar */
.progress-bar {
    display: flex;
    gap: var(--spacing-xs);
    width: 100%;
}

.progress-track {
    flex: 1;
    height: 4px;
    background-color: var(--color-progress-inactive);
    border-radius: var(--radius-sm);
    transition: background-color 0.3s ease;
}

.progress-track.active {
    background-color: var(--color-progress-active);
}


.btn {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 100% !important;
    height: 56px !important;
    font-size: var(--font-size-button-1) !important;
    font-weight: var(--font-weight-medium) !important;
    border-radius: var(--radius-round) !important;
    transition: all 0.2s ease !important;
    text-align: center !important;
	text-decoration: none !important;
}

/* Primary Button - Filled */
.btn-primary {
    background-color: var(--color-primary) !important;
    color: var(--color-primary-contrast) !important;
    border: none !important;
}

.btn-primary:hover {
    background-color: #024038 !important;
    transform: translateY(-1px) !important;
}

.btn-primary:active {
    transform: translateY(0) !important;
}

/* Outline Button */
.btn-outline {
    background-color: var(--color-background-primary) !important;
    color: var(--color-primary) !important;
    border: 1px solid var(--color-primary) !important;
}

.btn-outline:hover {
    background-color: var(--color-primary) !important;
    color: var(--color-primary-contrast) !important;
}

/* Help Section */
.help-section {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: var(--spacing-xs);
    padding-bottom: var(--spacing-sm);
    width: 100%;
    margin: 20px 0;
    clear: both;
}

/* Help section in section 1 page 1 */
#CL .help-section {
    margin-top: 30px !important;
    padding-top: 20px;
    clear: both !important;
}

.help-text {
    font-size: var(--font-size-body-2);
    font-weight: var(--font-weight-regular);
    color: var(--color-text-primary);
    line-height: var(--line-height-body-2);
}

.help-link {
    font-size: var(--font-size-body-2);
    font-weight: var(--font-weight-medium);
    color: var(--color-text-link);
    text-decoration: underline;
    line-height: var(--line-height-body-2);
}

.help-link:hover {
    color: var(--color-primary);
}

.member-section {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: var(--spacing-md);
    width: 100%;
    margin-top: var(--spacing-md);
}

.member-text {
    font-size: var(--font-size-body-2);
    font-weight: var(--font-weight-regular);
    color: var(--color-text-primary);
    text-align: center;
    line-height: var(--line-height-body-2);
}

/* Form Group - ensures consistent width for all form fields */
.form-group {
    width: 100%;
}

.form-group .inputlabelcontainer {
    width: 100% !important;
}

.form-group .inputlabelcontainer .input,
.form-group .inputlabelcontainer input {
    width: 100% !important;
}

/* Consistent width for all form fields in section 2, 3, 4 */
#section2 .inputlabelcontainer,
#section3 .inputlabelcontainer,
#section4 .inputlabelcontainer {
    width: 100% !important;
}

#section2 .inputlabelcontainer .input,
#section3 .inputlabelcontainer .input,
#section4 .inputlabelcontainer .input {
    width: 100% !important;
}

#section2 .inputlabelcontainer input,
#section3 .inputlabelcontainer input,
#section4 .inputlabelcontainer input,
#section2 .inputlabelcontainer select,
#section3 .inputlabelcontainer select,
#section4 .inputlabelcontainer select {
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box;
}

/* Override specific email field width constraints */
#section2 #email,
#section2 #email .input,
#section2 #email .input input,
#section2 #email input,
#registerform #email,
#registerform #email .input,
#registerform #email .input input,
#registerform #email input,
#register #leftcolumn.page2 #regformwrapper #registerform #email .input,
#leftcolumn.page2 #registerform #email,
#leftcolumn.page2 #registerform #email .input,
#leftcolumn.page2 #registerform #email input {
    width: 100% !important;
    max-width: 100% !important;
    min-width: unset !important;
    box-sizing: border-box;
}

/* Override Secret Question and Secret Answer field width constraints */
#section4 #security,
#section4 #security .input,
#section4 #security select,
#section4 #answer,
#section4 #answer .input,
#section4 #answer input,
#leftcolumn.page2 #registerform #security,
#leftcolumn.page2 #registerform #security select,
#leftcolumn.page2 #registerform #answer,
#leftcolumn.page2 #registerform #answer input {
    width: 100% !important;
    max-width: 100% !important;
    min-width: unset !important;
    box-sizing: border-box;
}

/* Checkbox alignment for Terms and Privacy */
#policy_line,
#privacy_act_line {
    display: flex !important;
    align-items: flex-start !important;
    gap: 10px !important;
}

#policy_line input[type="checkbox"],
#privacy_act_line input[type="checkbox"] {
    margin-top: 4px;
    width: auto !important;
    height: auto !important;
    min-width: 18px;
    min-height: 18px;
    flex-shrink: 0;
}

#policy_line, #privacy_act_line {
    width: 100% !important;
}

/* Form Actions - centers buttons */
.form-actions {
	margin-top: 30px;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: var(--spacing-sm);
    width: 100%;
    margin-top: var(--spacing-md);
}

/* Back link button styling */
.btn-link {
    background: none;
    border: none;
	font-size: 18px;
    color: var(--color-text-link);
    font-size: var(--font-size-body-2);
    font-weight: var(--font-weight-medium);
    text-decoration: underline;
    cursor: pointer;
    padding: var(--spacing-xs) var(--spacing-sm);
}

.btn-link:hover {
    color: var(--color-primary);
}

.or{
			display: flex;
			font-family: var(--font-family-primary);
			font-weight: var(--font-weight-regular);
			color: var(--color-text-primary);
			margin: 10px 0px;
			line-height: 1.5;
			font-size: x-large;
		}



#passwordTip{
	margin-top: 20px;
    margin-left: 10px;
}

.agreements-section {
    padding-top: var(--spacing-md);
}

.agreement-text {
	margin-left: 2px;
    font-size: var(--font-size-body-2);
    font-weight: var(--font-weight-regular);
    color: var(--color-text-primary);
    line-height: var(--line-height-body-2);
}

.agreement-link {
    font-weight: var(--font-weight-medium);
    color: var(--color-text-link);
    text-decoration: underline;
    transition: color 0.2s ease;
}

.agreement-link:hover {
    color: var(--color-primary);
}

.disabled-input{
	width: 100% !important; 
    height: 48px !important;
    padding: 0 var(--spacing-md) !important;
    font-size: var(--font-size-body-1) !important;
    color: var(--color-text-primary) !important;
    background-color: #efe9e9 !important;
    border: 1px solid var(--color-border-input) !important;
    border-radius: var(--radius-md) !important;
    outline: none !important;
    transition: border-color 0.2s ease, box-shadow 0.2s ease !important;
    padding-top: 10px !important;
    box-sizing: border-box !important;
}

.form-input::placeholder {
    color: var(--color-text-tertiary);
}

/* Focus styles with high specificity to override existing rules */
#register input[type="text"]:focus,
#register input[type="email"]:focus,
#register input[type="password"]:focus,
#register textarea:focus,
#login input[type="text"]:focus,
#login input[type="email"]:focus,
#login input[type="password"]:focus,
#login textarea:focus {
    border-color: var(--color-primary) !important;
    box-shadow: 0 0 0 2px rgba(2, 87, 71, 0.1) !important;
}

#register select:focus,
#login select:focus {
    border-color: var(--color-primary) !important;
    box-shadow: 0 0 0 2px rgba(2, 87, 71, 0.1) !important;
}

#register button:focus-visible,
#register input:focus-visible,
#login button:focus-visible,
#login input:focus-visible {
    outline: 2px solid var(--color-primary) !important;
    outline-offset: 2px !important;
}

#register a:focus,
#login a:focus {
    outline: 2px solid var(--color-primary) !important;
    outline-offset: 2px !important;
}

.password-toggle {
    position: absolute;
    right: 12px;
    top: 50%;
    transform: translateY(-50%);
    width: 24px;
    height: 24px;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0;
    background: none;
    border: none;
    cursor: pointer;
    opacity: 0.7;
    transition: opacity 0.2s ease;
}

.password-toggle:hover {
    opacity: 1;
}

.password-toggle.active svg path {
    fill: var(--color-primary);
}

.password-hint {
    font-size: var(--font-size-body-2);
    font-weight: var(--font-weight-regular);
    color: var(--color-text-primary);
    line-height: var(--line-height-body-2);
}
	


.footer {
    width: 100%;
    background-color: var(--color-background-secondary);
    border-top: 1px solid var(--color-border-secondary);
    padding: var(--spacing-2xl) 0;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: var(--spacing-xl);
}

.footer-nav {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: var(--spacing-lg) 48px;
}

.footer-link {
    font-size: var(--font-size-body-2) !important;
    font-weight: var(--font-weight-medium)!important;
    color: var(--color-text-primary)!important;
    text-decoration: underline !important;
    line-height: var(--line-height-body-2)!important;
    transition: color 0.2s ease !important;
}

.footer-link:hover {
    color: var(--color-primary);
}

.footer-copyright {
    font-size: var(--font-size-body-2);
    font-weight: var(--font-weight-regular);
    color: var(--color-text-primary);
    text-align: center;
    line-height: var(--line-height-body-2);
}
	


.branding-nav,
#tblbranding {
    width: 100%;
}

/* Hide login button on registration pages - this CSS only loads on register pages */
.welcome-header-actions,
.header-login-btn,
#show-login-btn-welcome,
button.header-login-btn {
    display: none !important;
    visibility: hidden !important;
}

.logo-container {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    width: 100%;
    gap: 1rem;
    background: transparent !important;
}

/* Legacy table styles for backwards compatibility */
#tblbranding table {
    width: 100%;
    border-collapse: collapse;
    table-layout: fixed;
}

#tblbranding td {
    background: transparent;
    padding: 0.5rem;
}

/* Three logo positions */
.logoleft {
    background: transparent !important;
    text-align: left;
    display: flex;
    align-items: center;
    justify-content: flex-start;
}

.logomid {
    background: transparent !important;
    text-align: center;
    align-items: center;
    justify-content: center;
}

.logoright {
    background: transparent !important;
    text-align: right;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    margin-left: auto;
}

/* Logo images */
.logoleft img,
.logomid img,
.logoright img,
#logoleft,
#logomid,
#logoright {
    height: 60px;
    width: auto;
    max-height: 60px;
    max-width: 100%;
    object-fit: contain;
}

/* Logo links */
.logoleft a,
.logomid a,
.logoright a {
    display: inline-flex;
    align-items: center;
    text-decoration: none;
    border-radius: 4px;
    transition: var(--transition);
}

.logoleft a:focus,
.logomid a:focus,
.logoright a:focus,
.logoleft a:focus-visible,
.logomid a:focus-visible,
.logoright a:focus-visible {
    outline: 2px solid var(--color-primary);
    outline-offset: 4px;
}
	
	
	
	/*  login page css starts from here */
	html {
		font-size: 1em;
		-ms-text-size-adjust: 100%;
		-webkit-text-size-adjust: 100%
	}
	#error {font-weight:bold; color:red}
	body {
		background-color: var(--color-background-secondary);
		color:#000;
		font-family:Arial,Helvetica,sans-serif;
		margin:5px 0 0 0;
		padding-top:0;
		text-align:left;
	}
	#login a:focus, #register a:focus{outline:3px dotted #0066a5;}
	#login input:focus, #register input:focus{outline:2px solid #92BDE0;}
	#popup .textreset, 
	#popup .textreset a, 
	#popup #textsize, 
	#popup #lastlogin, 
	#popup #hello, 
	#popup #hello a, 
	#popup #hello a:link, 
	#popup #hello a:visited 
	{
		color: #867979 !important
	}
	#file ul {
		list-style-position: inside;
		padding-left: 10px;
	}
	#maincontainer {
		 margin:0 auto !important;
		  clear:left}
	
	
	.boxcontent {margin:0 auto;
		 width:auto;
		}
	#login .b2, #login .b3, #login .b4,
	#register .b2, #register .b3, #register .b4,
	#forgotsn .b2, #forgotsn .b3, #forgotsn .b4,
	#forgotpw .b2, #forgotpw .b3, #forgotpw .b4
	{background:none;height:0}
	#login .b1,
	#register .b1,
	#forgotsn .b1,
	#forgotpw .b1
	{
		margin: 0 1px;
		width: 1002px
	}
	.core {
		background:#fff;
		float:left;
		width:100%
	}
	* html body #toprow, * html body #maincontainer, * html body #footer_container {width: 61.25em}  
	html body div#maincontainer, html body div#toprow, html body div#footer_container {font-size: 100%}

	/*BODY ROUNDED CORNERS*/

	.b1, .b2, .b3, .b4 {
		clear: both;
		display:block;
		font-size:1px; 
		overflow:hidden; 
		height:1px
	}
	.b1 {margin:0 5px}
	.b2 {margin:0 3px}
	.b3 {margin:0 2px}
	.b4 {height:2px; margin:0 1px}
	#toprow {
		display:block;
		font-family: arial; 
		font-weight: normal;
		height:1em;
		margin:0 auto;
		min-height:21px;
		padding:10px 0;
		text-align:left;
		width:980px
	}
	#topsection {margin: 10px 0 0}
	#register #textonly a, #interstitial #textonly a {text-decoration:none}
	#emailSuggestionAnchor {
		color: blue !important;
		text-decoration: underline !important;
	}
	#textoptions {
		float:left;
		font-size:.75em;
		margin:0 0 0 3px;
		width:100%
	}
	#textoptions ul {
		display: inline;
		float:left;
		list-style-type: none;
		width:50%;
	}
	.ie6 #textoptions ul {width:100%}
	.ie6 #text li {float:left}
	#textoptions ul ul li {
		display: inline;
		list-style-type: none;
		margin: 0 0 0 3px
	}
	#text li {
		list-style-image:none;
		list-style-type: none;
		width:auto;
	}
	html #textoptions a {font-weight:bold}
	#text #textincrease {
		background: url(/images/lcc_ico_sprites.gif) no-repeat 0 -1105px transparent;
		color: #676666;
		cursor:pointer;
		float: left;
		font-size:17px;
		font-weight: bold;
		height: 21px;
		line-height:18px;
		padding:0;
		text-align: center;
		width: 24px
	}
	#textreset, .textreset {
		color: #fff;
		cursor:pointer;
		float: left;
		font-weight: bold;
		height: 21px;
		line-height: 18px;
		padding:0;
		text-align: center
	}
	.textreset {margin: 0}
	.textreset a, .textreset a:link, .textreset a:active, .textreset a:visited {
		color: #fff;
		font-weight:bold;
		text-decoration:none
	}
	#textsize {
		color:#fff;
		float:left;
		font-weight:bold;
		line-height:18px;
		margin:0 0 0 4px;
		padding:0
	}

	/*BRANDING*/

	#brandingwrapper {
		padding:0;
		background-color: var(--color-background-primary);
    	border-bottom: 1px solid var(--color-border-secondary);
	}
	#ie7 #brandingwrapper {margin:0}
	body.popup #branding {float:none; min-width:980px !important; width: 980px !important}
	#brandingwrapper #innertube {
    padding: 1rem 2rem;
    background: white !important;
	max-width: 1200px;
		margin:0 auto;
	}
	#branding {
		float:left;
		width:100%
	}
	#tblbranding {
		width:100%
	}
	.logomid {
		background:#fff;
		text-align:center;
	}

	/*MODULES*/

	#modulesvertical {
		float:left;
		width:26.333em
	}
	#modulesvertical .right_module {
		background-color:#fff;
		border:1px solid #C7C8CA;
		clear:both;
		margin:0 0 5px;
		padding:0;
		width:100%
	}
	.sf0 #modulesvertical .right_module {
		margin:0 0 0 5px;
		width:99%
	}
	#modulesvertical .right_module .module_title {
		clear:both;
		color:#0066A5;
		font-size:1.2em;
		font-weight:bold;
		height:24px;
		line-height:24px;
		margin: 15px 0 5px 15px
	}
	#modulesvertical .right_module .module_text {
		clear:both;
		margin: 0 15px 15px;
		overflow:hidden;
		width:93%
	}
	#modulesvertical .right_module .module_text ul {
		list-style-position:outside;
		list-style-type: none;
		margin: 0;
		padding: 0 0 10px
	}
	#modulesvertical .right_module .module_text ul li {
		background-image: url(/images/li_arrow.gif);
		background-position: 15px 8px;
		background-repeat: no-repeat;
		padding-left: 30px;
		width:85%
	}

	/*MEMBER ID HINT, ONE-TIME USE Shadowboxes*/

	#memberid_hint, #one_time_use {
		background:transparent none repeat scroll 0 0;
		color:#000;
		margin:.3em auto
	}
	#memberid_hint #hintcontainer {max-width:750px}
	#one_time_use #container {
		margin:0 0 0 20px;
		max-width:560px;
		padding:0 0 20px
	}
	#memberid_hint #leftcolumn {width:400px}
	#memberid_hint #compare_table {padding:10px}
	#memberid_hint table.compare_table th {
		background:#0066A5;
		color:#fff;
		font-style:italic;
		text-align:left
	}
	#memberid_hint table.compare_table td {color:#0066A5}
	.txtcolor {color:#0066A5}
	.bgcolor1 {background:#0066A5}
	#regformwrapper {
		width: 100%;
		max-width: 410px;
		display: flex;
		flex-direction: column;
		gap: var(--spacing-md);
		}
	#loginform, #registerform {
		float:left;
		width:100%
	}
	#regwrapper {
		top:0
	}
	#register #thankyou {margin:1em}
	#register .login_title {font-size:0.9em;}
	#register .login_title span {color:blue;}
	#register 
	#register .reg_title, #login .login_title {
		display:inline;
		font-family:Arial,Helvetica,sans-serif;
		font-size:1.667em;
		font-weight:normal;
		text-align:left
	}
	#register .reg_inline {
		display:inline;

	}
	h1 {
		background: url("../images/abt_img_line.gif") no-repeat scroll left bottom transparent;
		font-family:Arial,Helvetica,sans-serif;
		font-size:1.667em;
		font-weight:normal;
		padding: 0 0 10px;
		text-align:left
	}
	.ie6 h1, .ie7 h1 {margin:0.75em 0 0}
	h2,
	fieldset legend.txtcolor {
		background:url(/images/abt_img_line.gif) no-repeat bottom left;
		background-color:transparent;
		font-family:Arial,Helvetica,sans-serif;
		font-size:1.167em;
		font-weight:bold;
		padding:10px 0
	}
	fieldset legend.txtcolor {margin:0 0 0 -1px}
	.ie6 fieldset legend.txtcolor {margin:0 0 0 -6px}
	h2.blue {
		background:transparent;
		color:#145193;
		font-size:1.167em;
		margin:0;
		padding:0
	}
	h2.black {
		background:transparent;
		color:#000;
		font-size:1.167em;
		margin:0;
		padding:0
	}
	a.MItip, a:active.MItip, a:visited.MItip {font-weight:normal}
	a {font-weight:bold}
	#interstitial a, #register a, #login a {
		text-decoration:underline;
		display: inline-flex;
		align-items: center;
		justify-content: center;
		font-size: var(--font-size-button-2);
		font-weight: var(--font-weight-medium);
		color: #5c5c5c;
		text-decoration: underline;
		line-height: var(--line-height-button-2);
		height: 32px;
		transition: color 0.2s ease;
	}
	label {
		color:#000;
		font-weight:bold
	}
	#outerlistspacer {
		clear:left;
		float:left;
		margin:5px 0;
		width:100%
	}
	#listspacer {
		margin:0 0 0 20px;
		padding:0
	}
	ul {
		list-style-position: outside;
		list-style-type:disc;
		margin:0;
		padding:0
	}
	ul li {
		margin:0;
		padding:0;
		vertical-align:top;
		width:100%
	}
	.error {
		color:#F00;
		font-weight:bold
	}
	#registerform .errors {
		clear:both;
		width:100%;
		/*position:absolute;*/
		bottom: -18px;
		margin: 0 0 10px
	}
	#registerform #email .errors {min-width: 333px;}
	#registerform #email .input input, #registerform #email .input, #registerform #email .tip {min-width: 320px;}
	#password .errors {width:100%;float:none}
	#registerform label {
		font-size: var(--font-size-label);
		font-weight: var(--font-weight-medium);
		color: var(--color-text-primary);
		line-height: var(--line-height-label);
		padding: 0 var(--spacing-sm);
		}
	#registerform .errors, #registerform .errors a, #registerform .errors a:hover, #registerform .errors p {
		color:#c00;
		font-weight:normal;
		text-decoration:none;
		padding: 0 4px;
	}
	.asterisk {
		color:#F00;
		font-size:1.4em
	}
	.required {color:#f00}
	.alert {
		color:#f00;
		float:left;
		font-weight:normal;
		margin:0 20px;
		width:90%
	}
	.alertheading {
		color:#f00;
		font-size:14px;
		font-weight:bold
	}
	#forgotpw a.svclnk, #login a.svclnk, #register a.svclnk  {
		color:#c00;
		font-size:1em;
		font-weight:bold;
		text-decoration:none
	}

	/*BUTTON APPEARANCE - SPAN TYPE */

	.buttonSpan, .buttonSpan[type="submit"] {
		background-color: #5D8028 !important;
		border: 1px solid #5D8028;
		-moz-border-radius: 5px;
		-webkit-border-radius: 5px;
		border-radius: 5px;
		-moz-box-sizing: border-box;
		-webkit-box-sizing: border-box;
		box-sizing: border-box;
		color: #fff;
		font-size: 18px;
		height: 30px;
		line-height: 1em;
		vertical-align: middle;
		width: 92px;
		position: relative;
		z-index: 0;
		behavior: url(/js/PIE.htc);
		cursor: pointer
	}
	.buttonSpan.lifemart, .buttonSpan.lifemart[type="submit"]{background-color:#03709C !important; border: 1px solid #03709C !important;}
	#leftcolumn.page2 #signUp, #leftcolumn.page1 input.buttonSpan {
		max-width: 410px;
		width: 335px;
		background: none repeat scroll 0 0 #5D8028;
		border: 1px solid #5D8028;
		-moz-border-radius: 5px;
		-webkit-border-radius: 5px;
		border-radius: 5px;
		color: #fff;
		cursor: pointer;
		font-size: 18px;
		height: 40px;
		line-height: 1em;
		position: relative;
		vertical-align: middle;
		z-index: 0;
		behavior: url(/js/PIE.htc);
	}
	#leftcolumn.page2 #signUp {
		margin: 0;
	}
	#leftcolumn.page2 #signUp.lifemart{
		background-color:#03709C;
	}
	.buttonSpan a {
		color:#000;
		font-size:1em;
		font-weight:bold;
		line-height:1.77em;
		padding:0 5px
	}

	/* Button Anchor Tag Font Color for SPAN type Button */

	.buttonSpan a, .buttonSpan a:link, .buttonSpan a:visited {
		color:#000;
		font-size:1em;
		text-decoration:none
	}

	/*BUTTON APPEARANCE - INPUT TYPE */

	.button {
		background:#FFDE5A url(/images/messagecenternavbg.gif) repeat-x;
		border:1px solid #C9C9C9;
		color:#000;
		cursor:pointer;
		display:inline-block;
		font-size:1em;
		font-weight:bold;
		height:1.93em;
		margin:0 0 0 5px;
		padding:2px 5px 3px;
		text-align:center;
		text-decoration:none
	}
	.email-preferences-button {
		width: 240px;
		height: 50px;
		cursor: pointer;
		text-decoration: none;
		line-height: 50px;
		text-align: center;
		color: #fff;
		font-size: 20px;
		font-weight: 700;
		background: #0065A5;
		border-radius: 50px;
		-moz-border-radius: 50px;
		-webkit-border-radius: 50px;
		border: 1px solid #0065A5;
		transition: all .2s ease;
		margin: 0 auto;
	}
	.email-preferences-text {
		font-size: 20px;
		font-weight: 600;
		color: #646464;
	}
	.email-preferences-bottomtext {
		color: #646464;
		font-size: 16px;
		margin-top: 25px;
		padding-left: 10px;
		font-weight: 400;
	}
	.ff3 .button {padding:2px 11px 3px}
	.ie8 .button {padding:2px 14px 3px}
	.ie6 .ie67marginBottomMinus2, .ie7 .ie67marginBottomMinus2 {margin-bottom:-2px}
	.ff3 .ff3floatRight, .ie8 .ie8floatRight {float:right}
	input, select {
		font-size:1.1em;
		font-family:inherit;
		height:1.3em;
		margin:0;
		padding:0
	}
	.resendemail input{height:auto}
	.reg_input {
		clear:both;
		float:left;
		padding:0;
		width:100%
	}
	.reg_input #policy_line input,
	.reg_input #privacy_act_line input {
		height:auto;
		width:auto
	}
	.label, .terms_label {
		clear:both;
		float:left;
		font-weight:bold;
		padding:0;
		vertical-align:top
	}
	.input, .terms_input {
		clear:both;
		float:left;
		font-size:1em;
		margin:0;
		position:relative
	}
	.reg_input .input {height:auto; float:none;}
	.input {
		height:2em;
		padding:0;
	}
	.terms_input {
		height:1.5em;
		padding:0.5em 0 0 0.5em;
		vertical-align:bottom
	}
	#policy_line {
		padding: 5px 0;
    	margin-top: 10px;
    	margin: 0px;
	}
	.privacyAct #policy_line {background:none;}
	#policy_line, #privacy_act_line {
		clear:both;
		float:left;
		line-height:1.6em;
		width:95%;
		position: relative;
	}
	.terms_line {
		clear:both;
		float:left;
		margin:1.5em 0 !important;
		width:95%
	}
	.ie6 .terms_line, .ie7 .terms_line {margin:2em 0 0}
	#registerform .tip {
		clear:both;
		float:left;
		font-weight:normal;
		color:#5c5c5c;
		margin-top: 10px;
    	margin-left: 4px;
	}
	#register .inputlabelcontainer {
		margin-bottom:2em; 
		position:relative;
		width:100%;
		vertical-align: top
	}
	#leftcolumn.page2 #registerform #password,#leftcolumn.page2 #registerform #confirmPassword {margin-bottom:1em;}
	#register .inputlabelcontainerwithtip {
		float:left; 
		margin-bottom:0.5em; 
		position:relative;
		width:100%
	}
	.input input, .terms_input input, .input select {
		position:relative;
		width:auto
	}
	#dob_mm, #dob_dd, #dob_yyyy {float:left}
	#sf11 #register #DOB.label label, #sf12 #register #DOB.label label {vertical-align:top}
	select {
		font-size:1.1em;
		height:1.5em;
		margin-right:5px
	}
	option {
		font-size:1em;
		height:1.3em
	}
	textarea {font-size:1.1em}
	.termswrapper {
		float:left;
		margin:0 0 1em;
		width:100%
	}
	#reqFields {color:#5b5b5b; width:335px;font-weight:bold;}
	.ie7 .termswrapper {margin:1em 0}
	#txtcolorbutton {
		clear:both; 
		margin:2em 0 0
	}
	.ie6 #txtcolorbutton, .ie7 #txtcolorbutton {margin:1em 0 0}
	.txtarea {
		background:#EBEBE4;
		border:solid 1px #7F9DB9;
		display:block;
		float:left;
		height:200px;
		overflow:auto;
		padding:0 5px;
		width:511px
	}
	.accept {float:none}
	.reg_input span#print {
		float:none;
		margin-left:10px;
		padding-left:20px;
		vertical-align:top
	}
	.reg_input span#print a {text-decoration:none}
	#gender {position:relative}
	.radio {
		float:left;
		margin:0 5px;
		position:relative;
	}
	.radiolabel {
		float:left;
		line-height:1em;
		margin:0 1em 0 2px;
	}
	.submit,.continue {
		background:#369;
		border:0;
		color:#fff;
		font-weight:bold
	}
	a#access {
		float:left;
		height:24px;
		margin-left:0;
		padding:4px 0 0 8px;
		text-decoration:none;
		width:107px
	}
	.submit {margin-left:400px}
	#forgotsn .error,
	#forgotpw .error {
		float:left;
		margin-top:10px;
		width:99%
	}
	#forgotpw label.hide, #forgotsn label.hide {display:none}
	.continue {margin-left:0}
	#midwrapper {
		float:left;
		width:100%;
		filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ebebeb', endColorstr='#ffffff',GradientType=0 );

	}
	.radiowrapper {
		float:left;
		margin:15px 0 5px;
		width:95%
	}
	.ie6 .radiowrapper {width:90%}
	.radiowrapper label {
		float:left;
		font-size:1em;
		font-weight:normal;
		width:90%
	}
	#midwrapper fieldset.radiowrapper {
		float:left;
		width:98%
	}
	fieldset#radiowrapper {padding:0}
	fieldset#radiowrapper legend {
		color:#007eb0;
		font-size: 1.2em;
		padding:0;
		padding-top:1em
	}
	#registerform .radio_item label {
		font-size: 0.9em;
		color: #000;
	}
	.ie6 fieldset#radiowrapper legend, .ie7 fieldset#radiowrapper legend {margin-left:-6px}
	.radio_item {
		float:left;
		font-size:1em;
		line-height:1.2em;
		width:100%;
	}
	.radio_item input {
		height:auto;
		width:auto;
	}
	#register .radio_item {
		margin-bottom: 5px;
	}
	#inputwrapper {
		clear:both;
		float:left;
		width:100%;
		margin-top:15px;
	}
	#inputwrapper .buttonSpan {
		clear:both;
		float:left;
		margin:2em 0 1em;
	}
	.inputwrappererror {
		float:left;
		width:99%
	}
	.ie6 .inputwrappererror {width:auto}
	# {
		float:left;
		width:65%
	}
	#ie6 #inputwrapper .buttonSpan,
	#ie7 #inputwrapper .buttonSpan {margin:2em 0 1em 0}
	#ie6 #register input.buttonSpan,
	#ie6 #login    input.buttonSpan,
	#ie7 #register input.buttonSpan,
	#ie7 #login    input.buttonSpan {
		height:28px;
		margin-bottom:0; 
		padding:0
	}
	#login .buttonSpan {
		background: url("/images/messagecenternavbg.gif") repeat-x scroll 0 0 #ffde5a;
		border: 1px solid #c9c9c9;
		color: #000;
		cursor: pointer;
		display: inline-block;
		font-size: 1em !important;
		font-weight: bold;
		height: 26px !important;
		margin: -0.001em 0 0;
		padding: 2px 10px;
		text-align: center;
		text-decoration: none;
		width: auto;
		-moz-border-radius: 0;
		-webkit-border-radius: 0;
		border-radius: 0;
		position: relative;
		z-index: 0;
		behavior: url(/js/PIE.htc);
		font-size: 1.1em;
		height: 1.3em
	}
	#login #screenname {
	margin-bottom: 15px;
	}

	/*FOOTER*/
	body.popup #footer_container {clear:left; background:url("/images/footer_shadow.gif") no-repeat scroll 0 0 transparent; width:1002px; left:0}

	.footerlnk {
		font-size:1em;
		font-weight:normal;
		padding:0;
		text-decoration:none
	}
	/*IRIS-AG MERGE 19-01-2010*/
	#footer_container {
		float:none;
		height:100px;
		margin:0 auto;
		width:61.25em
	}

	/* FOOTER LINKS */

	#copyright {
		float:left;
		font-size:0.65em;
		margin:0;
		width:80%
	}
	.ie6 #copyright {margin:0 0 0 1px}
	#copyright .footertxt {
		float:left;
		margin:0 0 20px;
		width:100%
	}
	#copyright .footertxt #address {
		float:left;
		text-align:center;
		width:45%
	}
	#copyright .footertxt #copyright2 {
		float:left;
		text-align:left;
		width:55%
	}
	#footer_links {
		float:left;
		font-size:0.75em;
		margin:0;
		padding:3px 0 0;
		width:80%
	}
	#footer_links .footerlnk {
		font-size:1em;
		margin:0 2px;
		padding:0
	}
	#watchdog {
		float:right;
		margin-top:3px;
		text-align:right;
		width:auto
	}
	#interstitial  a.logbotlnk,
	#register a.logbotlnk, 
	#register a:active.logbotlnk, 
	#register a:visited.logbotlnk {
		color:#145193;	
		font-weight: bold;
		text-decoration: none
	}
	#register a:hover.logbotlnk,
	#interstitial a:hover.logbotlnk {text-decoration: underline}
	.hint {
		display: none;
		font-size: 0.917em;	
		left:14em;
		margin:0 0 0 10px;
		padding:5px;
		position:absolute;
		width:350px;
		z-index:10
	}
	.hint p {margin:5px 0}
	.hint .hint-pointer {display:none}

	/*LOGIN*/
	#loginwrapper {
		background:#fff;
		float:left;
		margin:0 0 0 10px;
		padding:0;
		text-align:left;
		width:980px
	}
	#ie6 #loginwrapper {margin:0 0 0 5px}
	#leftcolumn {
		display: flex;
    	justify-content: center;
    	padding: var(--spacing-2xl) var(--spacing-md);
	}
	#leftcolumn.page2 {width:auto;}
	.ie6 #leftcolumn {
		margin-left:5px;
		width:50%
	}
	#leftcolumn.page2 #registerform .input input,
	#leftcolumn.page2 #registerform .tip,
	#leftcolumn.page2 #registerform .label {float:none;}
	#leftcolumn.page2 #registerform .inputlabelcontainer {width:auto;}
	#leftcolumn.page2 #registerform #email,
	#leftcolumn.page2 #registerform #memID,
	#leftcolumn.page2 #registerform #security,
	#leftcolumn.page2 #registerform #answer {display:block; width:335px;}
	#leftcolumn.page2 #registerform #security {display:inline-block !important;}
	#leftcolumn.page2 #registerform #security select {
		width:435px;
		background-color: #f4f4f4;
		-moz-border-radius: 5px;
		-webkit-border-radius: 5px;
		border-radius: 5px;
		padding: 5px 0 5px 5px;
		height:auto;
		/*position: relative;
		z-index: 0;
		behavior: url(/js/PIE.htc);*/
	}
	/*#leftcolumn.page2 #registerform #password {vertical-align: middle;}*/
	#leftcolumn.page2 #registerform #fName input,
	#leftcolumn.page2 #registerform #lName input,
	#leftcolumn.page2 #registerform #email input,
	#leftcolumn.page2 #registerform #password input,
	#leftcolumn.page2 #registerform #confirmPassword input {
			width: 100%;
			height: 48px;
			padding: 0 var(--spacing-md);
			font-size: var(--font-size-body-1);
			color: var(--color-text-primary);
			background-color: var(--color-background-primary);
			border: 1px solid var(--color-border-input);
			border-radius: var(--radius-md);
			outline: none;
			transition: border-color 0.2s ease, box-shadow 0.2s ease;	
		}

	#leftcolumn.page2 #fName .input, #leftcolumn.page2 #password .input {margin-right: 20px}
	#leftcolumn.page2 #fName .input, 
	#leftcolumn.page2 #password .input, 
	#leftcolumn.page2 #lName .input {
		height: auto;
	}
	#register #leftcolumn.page2 #regformwrapper #registerform #email .input {
		-moz-box-sizing: border-box;
		-webkit-box-sizing: border-box;
		box-sizing: border-box;
		width:335px !important;
		max-width:335px !important;
		height: auto;
	}
	#leftcolumn.page2 #registerform #email input,
	#leftcolumn.page2 #registerform #memID input,
	#leftcolumn.page2 #registerform #security select,
	#leftcolumn.page2 #registerform #answer input, 
	#leftcolumn.page2 #registerform #regCustField input {
		-moz-box-sizing: border-box;
		-webkit-box-sizing: border-box;
		box-sizing: border-box;
	}
	.buttonSpan[title="Log In"] {
		height: 30px;
		vertical-align: initial;
	}
	#leftcolumn.page2 .tip {
		max-width: 535px;
		vertical-align: middle
	}
	#SecretQuestion {float:none;margin:0;}
	#leftcolumn.page2 #registerform #memID,
	#leftcolumn.page2 #registerform #memID .input,
	#leftcolumn.page2 #registerform #email,
	#leftcolumn.page2 #registerform #email .input,
	#leftcolumn.page2 #registerform #regCustField,
	#leftcolumn.page2 #registerform #regCustField .input,
	#leftcolumn.page2 #registerform #password .input,
	#leftcolumn.page2 #registerform .tip
	{width:auto !important;}
	#leftcolumn.page2 #registerform #memID, #leftcolumn.page2 #registerform #email, #leftcolumn.page2 #registerform #regCustField {display:block;}
	#leftcolumn .innertube {margin:0 30px 0 0}
	#forgotpw #leftcolumn,
	#forgotsn #leftcolumn {
		float:left;
		margin-left:20px;
		width:90%
	}
	#register a.svclnk {margin:0 0 0 20px; padding: 10px 0; display: block}
	#login #loginRow {
		float: right;
		margin: 0 2em 2em 0;
		padding: 1em 0 0;
		width: 33%;
	}
	#loginRow {
		margin:0 auto;
		padding:1em 0 0;
		width:96%;
	}
	#regwrapper #loginRow{
		box-sizing: border-box;
		padding: 0 25px 0 15px;	
	}
	.ie6 #loginRow {margin:0 -9em 2em 0; width:30%}
	#brandingwrapper #loginRow {
		float:right;
		left:-10px;
		padding:0;
		position:relative;
		top:20px;
		width:27.167em;
		z-index:10
	}
	#brandingwrapper #memberlogin {
		color:#145193;
		display:inline;
		float:left;
		font-size:1.5em;
		font-weight:normal;
		margin-left:2px;
		padding-top:2px;
		text-align:center;
		vertical-align:bottom
	}
	#member, #dependent {
		float:left;
		margin-bottom:10px;
		margin-right:0.583em;
		vertical-align:bottom
	}
	.ie6 #dependent {margin-right: 0.35em}
	#ie6 .radio_item label  {
		height:2.1em;
		padding-top:0.25em
	}
	.showloginbox {width:37.5em}
	sup {font-size:0.7em;}
	sup.small {
		font-size:80%;
		font-weight:normal;
		vertical-align:text-top
	}
	.bold {font-weight:bold}
	.italic {font-style:italic}
	.underline {text-decoration:underline}
	.blue {color:#145193}
	.black {color:#000}
	.fuschia {color:#D4284E}
	h3.fuschia {
		font-size:1.1em;
		margin-bottom:0
	}
	.brown {background:#C9AE5C}
	.lightgray {background:#F8F9FB}
	.slate {color:#5C6F7B}
	.center {text-align:center}
	.small {font-size:.9em}

	/*Login Box ROUNDED CORNERS*/
	#login #loginformwrapper {
		background:#EEF9FF;
		border:1px solid #92BDE0;
		box-shadow:5px 5px 5px #ccc;
		-webkit-box-shadow:5px 5px 5px #ccc;
		float:left;
		margin:0 0 1em 0;
		padding:1em;
		width:91%
	}
	#regwrapper #loginRow.reg .login_title {
		display: block;
		border-bottom: 5px solid #f3f3f3;
		margin-right: 0;
		padding-bottom: 15px;
		padding-top: 20px;
	}
	#loginRow.reg #loginformwrapper {padding:0;}
	#loginRow.reg #loginformwrapper input[type="text"],
	#loginRow.reg #loginformwrapper input[type="password"],
	#leftcolumn.page1 input,
	#leftcolumn.page2 input
	{
		    width: 90%;
			height: 48px;
			padding: 0 var(--spacing-md);
			font-size: var(--font-size-body-1);
			color: var(--color-text-primary);
			background-color: var(--color-background-primary);
			border: 1px solid var(--color-border-input);
			border-radius: var(--radius-md);
			outline: none;
			transition: border-color 0.2s ease, box-shadow 0.2s ease;
	}
	#leftcolumn #SecretQuestion{
		background-color:#f4f4f4;
		border: 1px solid #ccc;
		-webkit-border-radius: 2px;
		-moz-border-radius: 2px;
		border-radius: 2px;
		margin: 5px 0 10px;
		padding:5px;
		-moz-box-sizing: border-box;
		-webkit-box-sizing: border-box;
		box-sizing: border-box;
		width: 335px;
		max-width: 335px;
		/*position: relative;
		z-index: 0;
		behavior: url(/js/PIE.htc);*/
		
	}
	#leftcolumn.page1 .radio_item input {
		margin: 0 10px 20px 0;
	}
	#loginRow.reg .login_title,#loginRow.reg #loginformwrapper {display:table-cell;line-height: 20px;vertical-align: middle;}
	#loginRow.reg #loginformwrapper {padding-left: 10px;}
	#loginRow.reg .login_title {color:#000;font-weight: bold;padding:0 10px 0 0;}
	#loginRow.reg .login_title span {color:#00b5fa;}
	#loginRow.reg #loginformwrapper label {float:none; position:static; display: block; width: auto; height: auto; color: #007eb0; font-size: 1.2em;}
	#regformwrapper .reg_title,#loginRow.reg #loginformwrapper div {display: inline-block;}
	#regformwrapper .reg_title, #regwrapper .login_title {
		letter-spacing: 1px;
		font-size: var(--font-size-title);
		font-weight: var(--font-weight-medium);
		color: var(--color-text-primary);
		line-height: var(--line-height-title);
		margin-bottom: var(--spacing-sm);
		}
	#loginformwrapper .b1, #loginformwrapper .b2, #loginformwrapper .b3, #loginformwrapper .b4,
	#loginformwrapper .b5, #loginformwrapper .b6, #loginformwrapper .b7, #loginformwrapper .b8 {
		display:block;
		font-size:1px; 
		overflow:hidden;
		height:1px
	}
	#loginformwrapper .b3, #loginformwrapper .b5, #loginformwrapper .b6, #loginformwrapper .b7, #loginformwrapper .b8 {
		background:#F9F9F9; border-right:1px solid #E4E4E4; border-left:1px solid #E4E4E4
	}
	#loginformwrapper .b1 {background:#E4E4E4; margin:0 5px}
	#loginformwrapper .b2 {background:#F9F9F9; border-right:2px solid #E4E4E4; border-left:1px solid #E4E4E4; margin:0 3px}
	#loginformwrapper .b3 {margin:0 2px}
	#loginformwrapper .b4 {height:2px; background:#F9F9F9; border-right:1px solid #E4E4E4; border-left:1px solid #E4E4E4; margin:0 1px}
	#loginformwrapper .b5 {margin:0 5px}
	#loginformwrapper .b6 {margin:0 3px}
	#loginformwrapper .b7 {margin:0 2px}
	#loginformwrapper .b8 {margin:0 1px}
	#loginformwrapper .boxcontent {
		height:7em;
		overflow:hidden;
		width:99.5%
	}
	#loginformwrapper {
		padding:1em;
	}
	.ie6 #loginformwrapper {width:95%}
	#loginboxwrapper {
		float:left;
		height:6.333em;
		margin:0;
		padding:0;
		width:100%
	}
	#loginboxtop {
		background:#F9F9F9;
		float:left;
		padding-right:10px;
		padding-top:5px;
		width:25.3em;
		padding:0.417em 0 0 1em
	}
	#loginboxbottom {
		float:left;
		height:2.8em;
		padding:0.417em 0 1.5em 1em;
		width:25.3em
	}
	#memberlogin {
		color:#999;
		display:inline;
		float:left;
		font-size:1.167em;
		font-weight:bold;
		height:21px;
		margin-left:10px;
		padding-top:2px;
		text-align:center;
		vertical-align:bottom
	}
	#newuser {
		display:inline;
		float:left;
		height:1.75em;
		padding:0 0 1em 1.667em;
		text-align:center;
		vertical-align:top;
		width:9.917em
	}
	#newuser a.signup {
		color:#595037;
		font-size:0.917em;
		text-decoration:none
	}
	#newuser .b1, #newuser .b2, #newuser .b3, #newuser .b4,
	#newuser .b5, #newuser .b6, #newuser .b7, #newuser .b8 {
		display:block;
		font-size:1px; 
		overflow:hidden;
		height:1px
	}

	#newuser .b1, #newuser .b5 {background:#C8C8CA; margin:0 5px}
	#newuser .b2, #newuser .b6 {background:#E9ED71; border-right:2px solid #C8C8CA; border-left:2px solid #C8C8CA; margin:0 3px}
	#newuser .b3, #newuser .b7 {background:#E9ED71; border-right:1px solid #C8C8CA; border-left:1px solid #C8C8CA; margin:0 2px}
	#newuser .b4, #newuser .b8 {background:#E9ED71; border-right:1px solid #C8C8CA; border-left:1px solid #C8C8CA; margin:0 1px}

	#newuser .boxcontent {
		background:#DDB716 url(/images/yellowbuttonbg.gif) repeat-x;
		border-left:1px solid #C8C8CA;
		border-right:1px solid #C8C8CA; 
		height:1.2em;
		overflow:hidden;
		width:98.3%;
	}
	#screenname {
		float:left;
		margin-right:1em;
		*margin-right:1em;
		_margin-right:1em
	}
	#login #password {
		float:left;
		margin-right:1em;
	}
	#go {
		background:transparent none repeat scroll 0 0;
		float:left;
		margin:1.3em 0 0 .25em;
		width:2em
	}
	#go input {
		background:#77A63E;
		border:0;
		color:#fff;
		font-family:Verdana;
		font-size:1em;
		height:1.2em;
		text-transform:uppercase
	}
	#loginformwrapper #go .b1, #loginformwrapper #go .b2, #loginformwrapper #go .b3, #loginformwrapper #go .b4,
	#loginformwrapper #go .b5, #loginformwrapper #go .b6, #loginformwrapper #go .b7, #loginformwrapper #go .b8 {
		display:block;
		font-size:1px; 
		overflow:hidden;
		height:1px;
		background:#77A63E
	}
	#loginformwrapper #go .b1, #loginformwrapper #go .b5 {margin:0 5px}
	#loginformwrapper #go .b2, #loginformwrapper #go .b6 {border-right:1px solid #77A63E; border-left:1px solid #77A63E; margin:0 3px}
	#loginformwrapper #go .b3, #loginformwrapper #go .b7 {border-right:1px solid #77A63E; border-left:1px solid #77A63E; margin:0 2px}
	#loginformwrapper #go .b4, #loginformwrapper #go .b8 {border-right:1px solid #77A63E; border-left:1px solid #77A63E; margin:0 1px}
	#loginformwrapper #go .boxcontent {
		background:#77A63E none repeat scroll 0 0;
		border:0;
		color:#fff;
		display:block;
		height:1.4em;
		margin:0;
		padding:0;
		text-align:center;
		width:2.0em
	}
	#forgotpw a:hover,
	#forgotsn a:hover,
	#register a:hover,
	#login a:hover {text-decoration:underline}
	#alert {
		background-color:#E8E8E8;
		border:2px dotted #145193;
		margin-top:10px;
		padding:5px
	}

	/*worklife4you and jpmc*/

	#loginleftcolumn {
		background-color:#fff;
		float:left;
		margin:0;
		width:auto
	}

	#logincontentwrapper {
		background:#fff;
		float: left;
		margin:0;
		padding:2px 0 0 10px;
		width: 300px
	}
	#login #contentwrapper {
		float: left;
		width: 300px
	}
	#contentcolumn {
		background:#fff;
		float:left;
		padding:0 10px
	}
	ul.jpmc {
		list-style-type:none;
		margin:0;
		padding:0;
	}
	ul.jpmc li {
		background-image: url(/images/jpmc/bullet.gif);
		background-repeat: no-repeat
	}
	.clear {clear:both}
	#CL, #DP {width:100%}
	#CL .continue, #DP .continue, .submit {
		display:inline;
		float:left;
		margin:0;
		width:100%
	}
	#CL label, #DP label, #loginformwrapper label
	{
		float:left;
		width:100%
	}

	.ie8 #CL label, .ie8 #DP label {width:90%}
	#CL input, #DP input {
		clear:both;
		float:left;
		margin-top:3px;
	}
	#DP p, #CL p {
		float:left;
		margin:1em 0;
		width:95%
	}
	#bluebutton {
		height:1.667em;
		width:7em
	}
	#bluebutton .b1,#bluebutton .b2, #bluebutton .b3, #bluebutton .b4 {
		clear:both;
		display:block;
		font-size:1px; 
		overflow:hidden;
		height:1px
	}
	#bluebutton .b1 {background:#C8C8CA; margin:0 5px}
	#bluebutton .b2 {background:#4E84C1; border-right:2px solid #C8C8CA; border-left:1px solid #C8C8CA; margin:0 3px}
	#bluebutton .b3 {background:#4E84C1; border-right:1px solid #C8C8CA; border-left:1px solid #C8C8CA; margin:0 2px}
	#bluebutton .b4 {background:#4E84C1; border-right:1px solid #C8C8CA; border-left:1px solid #C8C8CA; margin:0 1px}

	#bluebutton .boxcontent {
		border-left:1px solid #C8C8CA;
		border-right:1px solid #C8C8CA; 
		font-size:.9em;
		overflow:hidden;
		padding:0;
	}
	#bluebutton .boxcontent input {
		background:#4E84C1;
		color:#fff;
		padding:0;
		text-align:center;
		text-decoration:none;
		width:100%
	}
	.floatright {float:right}
	.floatleft {float:left}
	.marginleft400 {margin-left:41.667em}
	.marginleft10 {margin-left:0.833em}
	.margintop10px {margin-top:10px}
	.marginleft5 {margin-left:0.417em}
	.marginright5 {margin-right:0.417em}

	#CL .rcblock, #CL .emlblock {
		display: flex;
		flex-direction: column;
		gap: 2px;
		width: auto;
	}
	#CL span.bold {
		margin: 25px 0px;
		display: flex;
		font-family: var(--font-family-primary);
		font-weight: var(--font-weight-regular);
		color: var(--color-text-primary);
		line-height: 1.5;
		font-size: x-large;
	}
	
	/*LOGIN PAGE FOOTER POP-UP*/
	#popup {padding:10px}
	#popup #outerlistspacer {width:100%}

	/*DIVISION LOGIN PAGE*/
	#onecolumn {margin:0 25%}
	.division .buttonSpan {display:inline}
	.division #loginformwrapper {
		margin:0 0 20px;
		width:100%
	}
	.division select {display:inline}
	#standalonecontainer ul li {list-style-position:inside}
	#standalonecontainer .innertube {
		float:left;
		font-size:.85em;
		margin:0 0 20px 20px;
		text-align:left;
		width:75%
	}
	fieldset {border:0}
	#skip a, #skip a:active, #skip a:hover, #skip a:visited, .skip {
		height:1px;
		left:0;
		overflow:hidden;
		position:absolute;
		top:-500px;
		width:1px
	}
	#login .skip {position: relative;top:0;}

	#loginRow #mobileShowHide {
		display:none;
	}
	#loginRow.reg .login_title span.loginText{
		color: #000;
		display:inline-block;
	}
	#loginRow p.error {margin: 0 0 30px}

	/*  login page css ends here */

	/*   interstitial page css starts  */

	#interstitial html, #interstitial body, #interstitial div, #interstitial p, #interstitial input{/* margin:0; padding:0; border:0;*/}
	#interstitial body{font-family:Arial,Helvetica,sans-serif}
	#interstitial #blueLine{width:100%; height:.4em; background-color:#0066A8}
	#interstitial fieldset, #interstitial legend{margin:0; padding:0}
	#interstitial .interstitialTitles{padding:0 0 0.2em .8em; color:#145193; width:30em; font-size:1.3em; font-weight:bold}
	#interstitial .welcome{margin:0 0 0 -.3em; padding:1em 0 0.3em 0.3em; font-size:1.5em; background:url("../images/abt_img_line.gif") no-repeat scroll .4em bottom transparent}
	#interstitial p{font:1em/1.5em; width:55em; margin:0;}
	#interstitial input#input_terms, 
	#interstitial input#input_privacy_act {margin:0.5em 0 0; height:1em}
	#interstitial #leftcolumn{width:85%}
	#interstitial #leftcolumn a, #interstitial #leftcolumn a:active,
	#interstitial #leftcolumn a:visited{color:#145193; text-decoration:underline; font-weight:bold}
	#interstitial .grayBkgd{margin:0 0 1em; padding:1.5em 0; width:57em}
	#interstitial .blue{padding:.3em 0 .2em; font: bold 1.167em Arial,Helvetica,sans-serif}
	#interstitial .bold{font-weight:bold}
	#interstitial .error{color:#F00; font-weight:bold}
	#interstitial #email{margin:0; padding:0; /* .3em 0 0*/}
	#interstitial #submitRow{margin:1.5em 0 .7em; clear:both;}
	#interstitial #submitInter{margin:0}
	#interstitial ul li#errCheckTerm, #interstitial ul li#v_error_msg{padding:.1em 0 0; font-weight:bold; color:red}
	#interstitial ul{padding:0 0 1em 2em}
	#interstitial #textoptions ul {padding: 0}

	#interstitial fieldset, #interstitial legend{margin:0; padding:0; border:medium none}

	/*IE6 IE7 IE8 for interstitial.vm  */    

	.ie6 #interstitial #input_terms, .ie7 #interstitial #input_terms, .ie8 #interstitial #input_terms{margin:0; height:1.2em}
	.ie7 #interstitial .button, .ie8 #interstitial .button{margin-bottom:0} 
	.ie6 #interstitial #submitInter, .ie6 #interstitial .button, .ie7 #interstitial #submitInter{margin:0; padding:0 .4em 0}
	.ie6 #interstitial #email,.ie7 #interstitial #email,.ie8 #interstitial #email{margin:0}

	/* for email_opts.vm */
	#register #opts, #submitsubs #opts {margin: 0 0 0 0.7em}

	#opts .opt_name {
		font-weight:bold; 
		margin-left:0.8em;
	}
		/* Styles for the toggle switch */
		.toggle-container {
			display: flex;
			align-items: center;
		}
		#opts .toggle-container .switch {
			position: relative;
			display: inline-block;
			width: 50px;
			height: 34px;
		}

		#opts .toggle-container .switch .slider {
			position: absolute;
			cursor: pointer;
			top: 0;
			left: 0;
			right: 0;
			bottom: 0;
			background-color: #ccc;
			border-radius: 34px;
		}

		#opts .toggle-container .switch .slider:before {
			position: absolute;
			content: "";
			height: 26px;
			width: 26px;
			left: 4px;
			bottom: 4px;
			background-color: white;
			border-radius: 50%;
			transition: .4s;
		}

		#opts .toggle-container .switch input:checked + .slider {
			background-color: #33C85A;
		}

		#opts .toggle-container .switch input:focus + .slider {
			box-shadow: 0 0 1px #33C85A;
		}

		#opts .toggle-container .switch input:checked + .slider:before {
			transform: translateX(26px);
		}
		#opts .toggle-container .switch .slider.round {
			border-radius: 34px;
		}

		/* Modify this style to fit your design */
		#opts .slider.round:before {
			border-radius: 50%;
		}
		/* Styles for the text */
		#opts .slider-text {
			margin-left: 10px !important;
			font-size: 16px;
			font-weight: 600;
			color: #646464;
		}
	/* interstitial page css ends  */

	/* RESPONSIVE STYLES FOR LOGIN / REGISTRATION / FORGOT SN & PW PAGES */

	@media screen and (min-width:1px) and (max-width:768px) {
		#register.lmOnlyUsers #leftcolumn.page2 fieldset.reg_input div.reg_input{margin-top:10px;}
		#loginRow #mobileShowHide {cursor: pointer; color: #0066a5; text-decoration: underline; display:inline-block;}
		#register.lmOnlyUsers #regwrapper #loginRow #mobileShowHide {font-size:1.2em;}
		#loginRow.reg .login_title span.loginText{display:none;}
		#regwrapper #loginRow.reg .login_title  {
			font-size: 1.2em;
			padding: 15px 0 10px;
			border-bottom: 0 none;
		}
		html, body{
			margin:0;
			padding:0;
			height:100%;
			font-family: var(--font-family-primary);
    		font-weight: var(--font-weight-regular);
    		color: var(--color-text-primary);
    		background-color: var(--color-background-secondary);
    		line-height: 1.5;
		}
		body *{line-height:1.5em;}
		#wrapper {
			margin: 0 auto;
			margin-bottom: -30px !important;
			padding: 0;
			border: 1px solid #999;
			border-top: 0;
			border-bottom: 0;
			background-color: #fff;
			min-height:100%;
			box-shadow: 0 10px 10px 5px #b3b3b3;
			-webkit-box-shadow: 0 10px 10px 5px #b3b3b3
		}	
		#register.lmOnlyUsers #wrapper{background: inherit;}
		#register.lmOnlyUsers #regwrapper{margin-bottom: 0;}
		#toprow {
			float: left;
			margin: 0 auto;
			padding: 10px 5px !important;
			background-color: #fff;
			min-height:20px;
		}

		#textoptions {
			float: left;
			width: auto;
			margin: 0 0 0 10px;
			padding: 0
		}
		#textoptions ul {
			float: left;
			width: 100%
		}
		#text li {
			float: left;
			margin: 0 10px 0 0
		}
		#text li:last-child, #textreset{margin:0}
		#textonly {
			float: left;
			margin: 0 10px
		}
		#textonly a, #textincrease{margin:0 10px 0 0 !important}
		#maincontainer {
			float: left;
			background-color: #fff !important
		}
		#logincontentwrapper {
			float: left;
			margin: 0 !important;
			padding: 0 !important;
		}
		#contentcolumn {
			padding: 0 !important;
		}
		.boxcontent {
			float: left;
			margin: 0;
			padding: 0;
		}
		#brandingwrapper {overflow:hidden}
		#brandingwrapper, #loginwrapper, #regwrapper {
			float: left;
			margin: 0;
			padding: 0
		}
		#loginRow.reg #loginformwrapper {display:none;}
		.login_title span:hover {cursor: pointer;}
		#loginformwrapper #forgotpw {display:block !important;}
		#regwrapper{background-color: var(--color-background-secondary);}
		#leftcolumn, #loginRow {
			float: left !important;
			width: auto !important;
			margin: 0 !important;
			padding: 0 10px !important;
		}
		#login #loginRow {padding: 0 10px}
		.login_title, .reg_title {
			float: left !important;
			display: block !important;
			margin: 0 0 15px !important
		}
		#loginformwrapper, #midwrapper, #regformwrapper {
			float: left !important;
			box-shadow: 0 0 !important;
			-webkit-box-shadow: 0 0 !important;
		}
		#regformwrapper {
			padding: 10px 0;
			width: 100%;
		}
		#register .reg_inline {
			display: block;
			clear: both;
			float: left;
			margin: 0 0 20px
		}
		#register #midwrapper {padding:10px}
		#register fieldset {margin:0px}
		.b1, .b2, .b3, .b4 {
			display: none !important
		}
		#register.lmOnlyUsers .b1{display:block !important; width: auto !important;}
		#usms_rght {
			float: right !important;
			padding: 0 0 0 5px !important;
			height: auto !important
		}
		#usms_dog {
			float: left !important;
			padding: 0 5px 5px 0 !important;
			height: auto !important
		}
		#footer_container {
			clear: both;
			position: static !important;
			left: 0 !important;
			background-color: #fff;
			padding: 0
		}
		#footer_links {
			float: left !important;
			width: auto;
			padding: 0 10px !important
		}
		#copyright {
			float: left !important;
			padding: 10px !important
		}
		#popup #logoright {
			width: 190px !important;
			max-width: 190px !important;
			height: 82px !important
		}
		#popup #toprow {
			background-color: transparent !important
		}
		#popup #tblbranding {
			width: 418px !important
		}
		#register.lmOnlyUsers #brandingwrapper #innertube img{
			height:auto !important;
		}
	}
	@media screen and (min-width:1px) and (max-width:360px) {
		input, select {font-size: 1em}
		#tblbranding {width: 300px !important;}
		#tblbranding td.logoleft, #tblbranding td.logomid, #tblbranding td.logoright{max-width: 100px !important;}
		#tblbranding td img {max-width: 100px !important;}
		#toprow {width:290px !important}
		h1 > br {display:none !important}
		.terms_line, #register #midwrapper, #register fieldset {width:260px !important}
		#register #leftcolumn.page2 #midwrapper, #register #leftcolumn.page2 fieldset, 
		#register #leftcolumn.page1 #midwrapper, #register #leftcolumn.page1 fieldset{width: 100% !important; padding: 0 !important}
		input:not([type="checkbox"]):not([type="radio"]), select {max-width:100% !important;}
		#loginformwrapper{width:258px !important;padding:10px !important}
		#screenname, #password {margin:0 !important}
		#disney_lft, #va_lft, #wl4u_lft, #FedEx, #usms_rght, #usms_dog {display: none !important}
		#logincontentwrapper {
			width: 280px;
			padding: 0px !important
		}
		#adv{max-width:280px !important;height:auto}
		#leftcolumn.page2 #regformwrapper, #leftcolumn.page1 #regformwrapper {width: 100%}
		#leftcolumn.page2 #fName.inputlabelcontainer, 
		#leftcolumn.page2 #lName.inputlabelcontainer,
		#leftcolumn.page2 #password.inputlabelcontainer,
		#leftcolumn.page2 #confirmPassword.inputlabelcontainer,
		#leftcolumn.page2 #registerform #security.inputlabelcontainer,
		#leftcolumn.page2 #registerform #answer.inputlabelcontainer
		{width:100% !important; max-width:100% !important;}
		fieldset.reg_input div.reg_input {width:260px; max-width: 260px;}
		#register #leftcolumn.page2 fieldset.reg_input div.reg_input {width:100%; max-width: 100%;}
		#leftcolumn.page2 #registerform #fName input, #leftcolumn.page2 #registerform #lName input, 
		#leftcolumn.page2 #registerform #password input, #leftcolumn.page2 #registerform #confirmPassword input {
			width: 100%;
			max-width: 100%
		}
		#leftcolumn.page2 #registerform .tip {margin: 0 0 10px}
		#register #leftcolumn.page2 .inputlabelcontainer {margin: 5px 0}
		#leftcolumn.page2 #fName .input, #leftcolumn.page2 #password .input {margin-right: 0; width: 100%}
		#leftcolumn.page2 #registerform #memID, 
		#leftcolumn.page2 #registerform #memID .input, 
		#leftcolumn.page2 #registerform #email, 
		#leftcolumn.page2 #registerform #email .input, 
		#leftcolumn.page2 #registerform #password .input, 
		#leftcolumn.page2 #registerform .tip {
			display: block;
			width: 100%;
		}
		#leftcolumn.page2 #registerform #password {vertical-align: top;}
		#leftcolumn.page2 #registerform #email input,
		#leftcolumn.page2 #registerform #memID input,
		#leftcolumn.page2 #registerform #memID input,
		#leftcolumn.page2 #security.inputlabelcontainer select,
		#leftcolumn.page2 #answer.inputlabelcontainer input,
		#corp_or_ccode, #work_email, #member_work_email, 
		#leftcolumn.page2 #signUp,
		#reqFields, #leftcolumn.page1 input.buttonSpan
		{width:100% !important; max-width:100% !important;}
		#leftcolumn.page2 #registerform input#signUp[disabled] {
			opacity: .6;
		}
		#corp_or_ccode, #work_email, #member_work_email {
			-moz-box-sizing: border-box;
			-webkit-box-sizing: border-box;
			box-sizing: border-box;
			height: auto
		}
		#leftcolumn.page2 #fName.inputlabelcontainer .input {margin:0}
		#leftcolumn.page2 #fName.inputlabelcontainer input, 
		#leftcolumn.page2 #lName.inputlabelcontainer input,
		#leftcolumn.page2 #password.inputlabelcontainer input,
		
		#leftcolumn.page2 #confirmPassword.inputlabelcontainer input
		{width:100% !important; max-width:100% !important;}
		#password .errors, #passwordTip {width:100% !important; max-width:100% !important;}
		#registerform .errors {bottom:0;float:none;position:relative;}
		#leftcolumn.page2 #fName input {width:100% !important;max-width:100% !important;}
		.login_title, .reg_title {margin: 0 !important}
		#CL .rcblock, #CL .emlblock {
			float: none;
			width: 100%;
		}
		#CL span.bold {
			margin: 25px 0px;
		display: flex;
		font-family: var(--font-family-primary);
		font-weight: var(--font-weight-regular);
		color: var(--color-text-primary);
		line-height: 1.5;
		font-size: x-large;
		}
		#CL .rcblock input, #CL .emlblock input {
			width: 100%;
		}
		#register #leftcolumn.page2 #regformwrapper #registerform #email .input, 
		#leftcolumn.page2 #fName .input, 
		#leftcolumn.page2 #password .input, 
		#leftcolumn.page2 #lName .input {
			max-width: 100% !important;
			width: 100% !important
		}
		#leftcolumn.page2 #fName .input, #leftcolumn.page2 #password .input {margin-right: 0}
		#policy_line, #privacy_act_line {margin: 10px 0}
		div#txtcolorbutton {
			display: block !important;
		}
	}

	@media screen and (max-width:767px) {
		#register.lmOnlyUsers #loginRow.reg #loginformwrapper{
			text-align: inherit !important;
		}
		#register.lmOnlyUsers #regwrapper #loginRow.reg .login_title{
			height:60px !important;
		}
		div#leftcolumn {
			margin-bottom: 100px !important;
		}
		#register.lmOnlyUsers div#leftcolumn {margin-bottom: 0 !important;}
	}

	@media only screen and (min-device-width: 800px) and (max-device-height: 812px) and (-webkit-device-pixel-ratio: 3) {
		html #register.lmOnlyUsers #wrapper #footer_container{
			width: 123% !important;
		}
	}

	@media screen and (min-width:361px) and (max-width:480px) {
		#mobileShowHide {cursor: pointer}
		#wrapper, #maincontainer, .boxcontent, #brandingwrapper, #loginwrapper, #regwrapper, #footer_container {width:100% !important; max-width:480px !important}
		#tblbranding {width: 340px !important;}
		#tblbranding td.logoleft, #tblbranding td.logomid, #tblbranding td.logoright{max-width: 113px !important;}
		#tblbranding td img {max-width: 113px !important;}
		h1 > br {display:none !important}
		#toprow {width:330px !important}
		.terms_line, #register #midwrapper, #register fieldset {width:100% !important; max-width:295px !important}
		input:not([type="checkbox"]):not([type="radio"]), select {max-width:100% !important;}
		#disney_lft, #va_lft, #wl4u_lft, #FedEx, #usms_rght, #usms_dog {display: none !important}
		#logincontentwrapper {
			width: 320px;
			padding: 0px !important
		}
		#adv{max-width:320px !important;height:auto}
		#leftcolumn.page2 #fName.inputlabelcontainer, 
		#leftcolumn.page2 #lName.inputlabelcontainer,
		#leftcolumn.page2 #password.inputlabelcontainer,
		#leftcolumn.page2 #confirmPassword.inputlabelcontainer,
		#leftcolumn.page2 #registerform #security.inputlabelcontainer,
		#leftcolumn.page2 #registerform #answer.inputlabelcontainer
		{width:100% !important; max-width:100% !important;}
		fieldset.reg_input div.reg_input {width:100%; max-width: 100%;}
		#leftcolumn.page2 #registerform #password {vertical-align: top;}
		#leftcolumn.page2 #registerform #email input,
		#leftcolumn.page2 #registerform #memID input,
		#leftcolumn.page2 #registerform #memID input,
		#leftcolumn.page2 #security.inputlabelcontainer select,
		#leftcolumn.page2 #answer.inputlabelcontainer input,
		#corp_or_ccode, #work_email, #member_work_email, 
		#leftcolumn.page2 #signUp,
		#reqFields, #leftcolumn.page1 input.buttonSpan
		{width:100% !important; max-width:100% !important;}
		#corp_or_ccode, #work_email, #member_work_email {
			-moz-box-sizing: border-box;
			-webkit-box-sizing: border-box;
			box-sizing: border-box;
			height: auto
		}
		#leftcolumn.page2 #fName.inputlabelcontainer .input {margin:0}
		#leftcolumn.page2 #fName.inputlabelcontainer input, 
		#leftcolumn.page2 #lName.inputlabelcontainer input,
		#leftcolumn.page2 #password.inputlabelcontainer input,
		
		#leftcolumn.page2 #confirmPassword.inputlabelcontainer input
		{width:100% !important; max-width:100% !important;}
		#password .errors, #passwordTip {width:100% !important; max-width:100% !important;}
		#registerform .errors {bottom:0;float:none;position:relative;}
		#leftcolumn.page2 #fName input {width:100% !important;max-width:100% !important;}
		#leftcolumn.page2 #regformwrapper, #leftcolumn.page1 #regformwrapper {width: 100%;padding: var(--spacing-lg) 24px var(--spacing-lg);}
		#register #leftcolumn.page2 #midwrapper, #register #leftcolumn.page2 fieldset, 
		#register #leftcolumn.page1 #midwrapper, #register #leftcolumn.page1 fieldset {
			padding: 0 !important;
			width: 100% !important
		}
		#register #leftcolumn.page2 .inputlabelcontainer, #register #leftcolumn.page1 .inputlabelcontainer {margin: 5px 0}
		#leftcolumn.page2 #registerform .tip {margin: 0 0 10px}
		#leftcolumn.page2 #registerform #memID, 
		#leftcolumn.page2 #registerform #memID .input, 
		#leftcolumn.page2 #registerform #email, 
		#leftcolumn.page2 #registerform #email .input, 
		#leftcolumn.page2 #registerform #password .input, 
		#leftcolumn.page2 #registerform .tip {
			display: block;
			width: 100%;
		}
		#leftcolumn.page2 #registerform #fName input, #leftcolumn.page2 #registerform #lName input, 
		#leftcolumn.page2 #registerform #password input, #leftcolumn.page2 #registerform #confirmPassword input, 
		#leftcolumn.page1 #registerform #fName input, #leftcolumn.page1 #registerform #lName input, 
		#leftcolumn.page1 #registerform #password input, #leftcolumn.page1 #registerform #confirmPassword input {
			width: 100%;
			max-width: 100%
		}
		#CL .rcblock, #CL .emlblock {
			float: none;
			width: 100%;
		}
		#CL span.bold {
			margin: 25px 0px;
		display: flex;
		font-family: var(--font-family-primary);
		font-weight: var(--font-weight-regular);
		color: var(--color-text-primary);
		line-height: 1.5;
		font-size: x-large;
		}
		#CL .rcblock input, #CL .emlblock input {
			width: 100%;
		}
		#register #leftcolumn.page2 #regformwrapper #registerform #email .input, 
		#leftcolumn.page2 #fName .input, 
		#leftcolumn.page2 #password .input, 
		#leftcolumn.page2 #lName .input {
			max-width: 100% !important;
			width: 100% !important
		}
		#leftcolumn.page2 #fName .input, #leftcolumn.page2 #password .input {margin-right: 0}
		#policy_line, #privacy_act_line {margin: 10px 0}
		div#txtcolorbutton {
			display: block !important;
		}
	}
	@media screen and (min-width:481px) and (max-width:540px) {
		#mobileShowHide {cursor: pointer}
		#wrapper, #maincontainer, .boxcontent, #brandingwrapper, #loginwrapper, #regwrapper, #footer_container {width:460px !important}
		#toprow {width:450px !important}
		#tblbranding {width: 480px !important;}
		#tblbranding td.logoleft, #tblbranding td.logomid, #tblbranding td.logoright{max-width: 160px !important;}
		#tblbranding td img {max-width: 150px !important;}
		.terms_line, #register #midwrapper, #register fieldset {width:415px !important}
		input, select {max-width:400px;}
		#disney_lft, #va_lft, #wl4u_lft, #FedEx {max-width: 70px !important; height: auto !important;padding: 0 15px 10px 0 !important;}
		#usms_rght, #usms_dog {max-width: 60px !important}
		#adv{max-width:420px !important;height:auto}
		#register #leftcolumn.page2 #midwrapper, #register #leftcolumn.page2 fieldset {
			padding: 0 !important;
			width: 100% !important
		}
		#register #leftcolumn.page2 .inputlabelcontainer {margin: 5px 0}
		#leftcolumn.page2 #registerform .tip {margin: 0 0 10px}
		#CL .rcblock, #CL .emlblock {
			float: none;
			width: 100%;
		}
		#CL span.bold {
			margin: 25px 0px;
			display: flex;
			font-family: var(--font-family-primary);
			font-weight: var(--font-weight-regular);
			color: var(--color-text-primary);
			line-height: 1.5;
			font-size: x-large;
		}
		#CL .rcblock input, #CL .emlblock input {
			width: 100%;
		}
		#register #leftcolumn.page2 #regformwrapper #registerform #email .input, 
		#leftcolumn.page2 #fName .input, 
		#leftcolumn.page2 #password .input, 
		#leftcolumn.page2 #lName .input {
			max-width: 100% !important;
			width: 100% !important
		}
		#leftcolumn.page2 #fName .input, #leftcolumn.page2 #password .input {margin-right: 0}
		#policy_line, #privacy_act_line {margin: 10px 0}
	}
	@media screen and (min-width:541px) and (max-width:640px) {
		#wrapper, #maincontainer, .boxcontent, #brandingwrapper, #loginwrapper, #regwrapper, #footer_container {width:520px !important}
		#toprow {width: 510px !important}
		#tblbranding {width: 520px !important;}
		#tblbranding td.logoleft, #tblbranding td.logomid, #tblbranding td.logoright{max-width: 173px !important;}
		#tblbranding td img {max-width: 173px !important;}
		.terms_line, #register #midwrapper, #register fieldset {width:475px !important}
		input, select {max-width:460px;}
		#usms_rght, #usms_dog {max-width: 80px !important}
		#logincontentwrapper {
			width: 340px;
			padding-left: 10px !important
		}
		#register #leftcolumn.page2 .inputlabelcontainer {margin: 5px 0}
		#CL .rcblock, #CL .emlblock {
			float: none;
			width: 100%;
		}
		#CL span.bold {
			margin: 25px 0px;
		}

		.or{
			display: flex;
			font-family: var(--font-family-primary);
			font-weight: var(--font-weight-regular);
			color: var(--color-text-primary);
			margin: 10px 0px;
			line-height: 1.5;
			font-size: x-large;
		}



		#CL .rcblock input, #CL .emlblock input {
			width: 100%;
		}
	}
	@media screen and (min-width:641px) and (max-width:720px) {
		#wrapper, #maincontainer, .boxcontent, #brandingwrapper, #loginwrapper, #regwrapper, #footer_container {width:620px !important}
		#toprow {width: 610px !important}
		#tblbranding {width: 620px !important;}
		#tblbranding td.logoleft, #tblbranding td.logomid, #tblbranding td.logoright{max-width: 206px !important;}
		#tblbranding td img {max-width: 206px !important;}
		.terms_line, #register #midwrapper, #register fieldset {width:575px !important}
		input, select {max-width:560px;}
		#usms_rght, #usms_dog {max-width: 100px !important}
		#logincontentwrapper {
			width: 440px;
			padding-left: 10px !important
		}
		#register #leftcolumn.page2 .inputlabelcontainer {margin: 5px 0}
	}
	@media screen and (min-width:721px) and (max-width:768px) {
		#wrapper, #maincontainer, .boxcontent, #brandingwrapper, #loginwrapper, #regwrapper, #footer_container {width:700px !important}
		#toprow {width: 690px !important}
		#tblbranding {width: 700px !important;}
		#tblbranding td.logoleft, #tblbranding td.logomid, #tblbranding td.logoright{max-width: 233px !important;}
		#tblbranding td img {max-width: 233px !important;}
		.terms_line, #register #midwrapper, #register fieldset {width:655px !important}
		input, select {max-width:640px;}
		#usms_rght, #usms_dog {max-width: 100px !important}
		#logincontentwrapper {
			width: 520px;
			padding-left: 10px !important
		}
		#register #leftcolumn.page2 .inputlabelcontainer {margin: 5px 0}
		#leftcolumn.page2 .tip {max-width: 290px}
	}
	#leftcolumn.page2 #registerform #password, #leftcolumn.page2 #registerform #confirmPassword {
		margin-bottom: 0;
	}

	#txtcolorbutton {
		padding: 1em 0 0;
	}
	#answer {
		margin-bottom:0 !important;
	}
	#leftcolumn.page2 .tip {
		max-width: 335px;
		vertical-align: middle;
	}

	/*---------------Fixed Toggle Login of Registration page--------------------*/

	#register.lmOnlyUsers #regwrapper #loginRow.reg {
		width: 100% !important;
		background: #f3f3f3;
	}

	#register.lmOnlyUsers #regwrapper #loginRow.reg .login_title {
		display: flex !important;
		align-items: center;
		justify-content: center;
		height: 90px;
		font-weight: 400;
		border: none;
		padding: 0 !important;
		margin: 0 !important;
		width:100%;
	}

	#register.lmOnlyUsers #regwrapper #loginRow.reg .login_title .loginText {
		display: none
	}

	#register.lmOnlyUsers #regwrapper #loginRow.reg .login_title #mobileShowHide {
		display: inline-block;
		outline: none
	}

	#register.lmOnlyUsers #regwrapper #loginRow.reg #mobileShowHide {
		padding: 0 10px;
		font-weight: 400
	}

	#register.lmOnlyUsers #regwrapper #loginRow.reg br.clear {
		display: none
	}

	#register.lmOnlyUsers  #copyright .footertxt {
		margin: 0
	}

	#register.lmOnlyUsers #maincontainer {
		margin-bottom: 50px!important
	}

	#register.lmOnlyUsers #loginformwrapper>div {
		float: none
	}

	#register.lmOnlyUsers #loginformwrapper {
		text-align: center
	}

	#register.lmOnlyUsers #loginRow.reg #loginformwrapper {
		display: none;
		width: 100%;
		text-align: center;
		padding-bottom: 10px;
	}

	#register.lmOnlyUsers #wrapper #footer_container {
		left: 0;
		display: flex;
		flex-direction: row-reverse;
		justify-content: center;
		align-items: center;
		height: 55px!important;
		width: 100%!important;
		padding: 0px!important;
		transform: translateX(0%);
		margin: 0 auto;
		background: #282a2b
	}

	#register.lmOnlyUsers #wrapper #footer_container * {
		font-size: 12px;
		font-weight: 400
	}

	#register.lmOnlyUsers #copyright {
		color: #b4b4b4!important;
		width: auto
	}

	#register.lmOnlyUsers #copyright .footertxt {
		margin: 0
	}

	#register.lmOnlyUsers #footer_links, #register.lmOnlyUsers #footer_links * {
		color: #BFBFBF!important;
		width: auto
	}

	#register.lmOnlyUsers .logomid {
		background: transparent;
	}

	#register.lmOnlyUsers #midwrapper {
		padding-left: 0;
	}

	#register.lmOnlyUsers .inputlabelcontainer {
		margin-bottom: 1em !important;
	}

	#register.lmOnlyUsers #regwrapper #loginRow.reg .login_title {
		font-size: 1.4em;
		font-weight: normal;
	}

	#register.lmOnlyUsers #regwrapper #loginRow.reg .login_title a {
		font-size: 1.3em;
		font-weight: bold;
	}

	#register.lmOnlyUsers #regwrapper #leftcolumn.page2 #signUp.lifemart {
		color: black !important;
		background: none repeat scroll 0 0 rgb(0,180,250) !important;
		border-color: rgb(0,180,250) !important;    
		font-weight:bold;
		height: 50px;
		z-index: 1;
		background: transparent !important;
		margin: 0;
		border: 0 !important;
	}

	#register.lmOnlyUsers #regwrapper #policy_line, #register.lmOnlyUsers #regwrapper #privacy_act_line{
		color:#5c5c5c;	
	}

	#register.lmOnlyUsers #regwrapper .innerloginwrapper p.error{
		text-align: left;
		margin-bottom:10px;
	}
	#register.lmOnlyUsers #regwrapper .innerloginwrapper #forgotpw {margin-top:10px;}

	#register.lmOnlyUsers #regwrapper .logoleft, #register.lmOnlyUsers #regwrapper .logoright, #register.lmOnlyUsers #regwrapper .logomid {
		width: auto;
		padding: 20px 0;
	}
	#register.lmOnlyUsers #brandingwrapper #innertube td {
		display: inline-block;
		padding: 10px 0;
	}
	#register.lmOnlyUsers #brandingwrapper #innertube img{
		height: 72px;
		width: 220px;
		display: inline-block;
	}

	#txtcolorbutton >span {
		position: absolute;
    left: 0;
    top: 0;
    margin: 16px 0px;
    text-align: center;
    width: 100%;
	}
	div#txtcolorbutton {
		position: relative;
		padding: 0;
		margin-top: 30px;
		border-radius: 5px;
	}
	span.buttonContainerLM {
		font-size: 18px;
		color: #000;
		font-weight: bold;
	}
	span.buttonContainer {
		font-size: 18px;
		color: #fff;
	}

/* =====================================================
   MOBILE RESPONSIVE FIXES FOR REGISTRATION FORM
   ===================================================== */

@media screen and (max-width: 768px) {
	/* Form Group responsive */
	.form-group {
		width: 100% !important;
		max-width: 100% !important;
	}
	
	/* All input containers responsive */
	#section2 .inputlabelcontainer,
	#section3 .inputlabelcontainer,
	#section4 .inputlabelcontainer,
	.form-group .inputlabelcontainer {
		width: 100% !important;
		max-width: 100% !important;
	}
	
	/* All input fields responsive */
	#section2 .inputlabelcontainer input,
	#section3 .inputlabelcontainer input,
	#section4 .inputlabelcontainer input,
	#section2 .inputlabelcontainer select,
	#section3 .inputlabelcontainer select,
	#section4 .inputlabelcontainer select,
	#section2 .inputlabelcontainer .input,
	#section3 .inputlabelcontainer .input,
	#section4 .inputlabelcontainer .input {
		width: 100% !important;
		max-width: 100% !important;
		box-sizing: border-box !important;
	}
	
	/* Email field responsive */
	#email,
	#email .input,
	#email input {
		width: 100% !important;
		max-width: 100% !important;
		min-width: unset !important;
	}
	
	/* Password fields responsive */
	#password,
	#password .input,
	#password input,
	#confirmPassword,
	#confirmPassword .input,
	#confirmPassword input {
		width: 100% !important;
		max-width: 100% !important;
	}
	
	/* Secret Question & Answer responsive */
	#security,
	#security .input,
	#security select,
	#answer,
	#answer .input,
	#answer input {
		width: 100% !important;
		max-width: 100% !important;
	}
	
	/* Buttons responsive */
	.btn,
	.btn-primary,
	.btn-outline {
		width: 100% !important;
		max-width: 100% !important;
	}
	
	/* Form actions responsive */
	.form-actions {
		width: 100% !important;
		padding: 0 10px !important;
		box-sizing: border-box !important;
	}
	
	/* Progress bar responsive */
	.progress-bar {
		width: 100% !important;
		max-width: 100% !important;
		padding: 0 10px !important;
		box-sizing: border-box !important;
	}
	
	/* Checkbox lines responsive */
	#policy_line,
	#privacy_act_line {
		width: 100% !important;
		flex-wrap: wrap !important;
		padding: 0 5px !important;
		box-sizing: border-box !important;
	}
	
	#policy_line label,
	#privacy_act_line label {
		flex: 1 !important;
		min-width: 0 !important;
	}
	
	/* Help section responsive */
	.help-section {
		width: 100% !important;
		flex-wrap: wrap !important;
		justify-content: center !important;
		text-align: center !important;
	}
	
	/* Member section responsive */
	.member-section {
		width: 100% !important;
	}
	
	/* Heading responsive */
	#sectionHeading {
		font-size: 1.2em !important;
		padding: 0 10px !important;
	}
	
	/* Tip text responsive */
	.tip {
		width: 100% !important;
		max-width: 100% !important;
	}
	
	/* Password tip responsive */
	#passwordTip {
		width: 100% !important;
		max-width: 100% !important;
	}
}

@media screen and (max-width: 480px) {
	/* Extra small screens */
	.progress-bar {
		gap: 5px !important;
	}
	
	.progress-track {
		height: 6px !important;
	}
	
	#sectionHeading {
		font-size: 1.1em !important;
	}
	
	.btn,
	.btn-primary {
		height: 50px !important;
		font-size: 16px !important;
	}
	
	/* Reduce padding on very small screens */
	#policy_line,
	#privacy_act_line {
		gap: 8px !important;
		font-size: 14px !important;
	}
	
	#policy_line input[type="checkbox"],
	#privacy_act_line input[type="checkbox"] {
		min-width: 16px !important;
		min-height: 16px !important;
	}
}