/*By Vendor dccity*/
@charset "utf-8";
html, body {margin:0; padding:0; border:0; width:100%; height:100%; font-family:Arial, Verdana, Helvetica, sans-serif, "Microsoft JhengHei","微軟正黑體"; font-size:14px; color:#666; line-height:150%; -webkit-text-size-adjust:none;}
html {overflow:hidden; position:fixed; width:100%; height:100%; background: url(../images/red_border.jpg) 0 100% repeat-x;}
body{overflow:auto; -webkit-overflow-scrolling: touch; }
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,input,textarea,p,blockquote,th,td {margin:0; padding:0; outline:0;}
a {outline: 0; text-decoration:none; padding:0; margin:0;}
a:hover {text-decoration:underline;}
a:active {background:none;}
table, tbody, tfoot, thead, tr, th, td { margin: 0; padding: 0; vertical-align:top; }
table { border-collapse:collapse; border-spacing:0; }
fieldset,img { border:0; }
address,caption,cite,code,dfn,th,var { font-style:normal; font-weight:normal; }
ol,ul {list-style:none; }
caption,th { text-align:left; }
h1,h2,h3,h4,h5,h6 { font-size:100%; font-weight:normal; }
q:before,q:after { content:''; }
abbr,acronym { border:0; }
input, select, textarea {font-family:Arial, Verdana, Helvetica, sans-serif, "Microsoft JhengHei","微軟正黑體"; font-size:14px; color:#666; border-radius:0;}
.floatLeft {float:left !important;}
.floatRight {float:right !important;}
.displayNone, .hidden {display:none;}
.center {text-align:center;}
.clearfix {display: inline-block;}
.clearfix:after {content: " "; display: block; height: 0; clear: both; font-size: 0; visibility: hidden;}
.clearfix {display: block;}
.verMidOut {width:100%; height:100%; display:table; position:relative;}
.verMidMid {width:100%; display:table-cell; top:50%; vertical-align:middle; *position:absolute;}
.verMidIn {width:100%; position:relative; top:-50%;}
.fixed {position:fixed !important; left:0; top:0;}
p {margin-bottom:20px;}
p.last { margin-bottom: 0px;}
input[type=text], input[type=password] {-webkit-appearance:none;}
input[type=text]::-ms-clear, input[type=password]::-ms-reveal {display: none; width : 0; height: 0;}
select option:hover {
background-color: yellow;
}
/* input focus */
select:focus, .select2-selection:focus, input:focus { outline: 0; }
/* This hides focus around selected option in FF */
/*select:-moz-focusring { color: transparent; text-shadow: 0 0 0 #000; }*/
/* input remove icon */
.inputDiv { position: relative; }
a.remove { position: absolute; right: 10px; top: 7px; width: 22px; height: 22px; background: url(../images/icon_remove_m.png) 50% 50% no-repeat; cursor: pointer;}
/* Main Structure starts */
#mainContainer {width:100%; /*min-width:980px; position:relative;*/ background-color:#FAFAFA; overflow: hidden;}
#contentContainer {width:1024px; padding-bottom:20px; margin:0 auto; background-color:#FFF;
/*box-shadow: 7px 0 10px -4px rgba(0, 0, 0, 0.1), -7px 0 10px -4px rgba(0, 0, 0, 0.1);
-webkit-box-shadow: 7px 0 10px -4px rgba(0, 0, 0, 0.1), -7px 0 10px -4px rgba(0, 0, 0, 0.1);*/}
h1 {font-size:24px; line-height:150%; color:#ED1B2E; font-weight:bold;}
h2 {font-size:24px; line-height:150%; color:#ED1B2E; font-weight:normal;}
h3 {font-size:20px; line-height:150%; color:#ED1B2E; font-weight:normal;}
h4 {font-size:18px; line-height:150%; color:#333; font-weight:normal;}
h5 {font-size:14px; line-height:150%; color:#666; font-weight:normal;}
h6 {font-size:24px; line-height:150%; color:#ED1B2E; font-weight:normal;}
.formContainer h6.alignLeft {width:400px; text-align:left; margin:0 auto;}
.inputDiv {/*width:96%;*/ /*padding:0 1.5%;*/ height:34px; text-align:left; border:#D7D7D7 2px solid; -webkit-box-shadow:inset 0 0 4px 0px rgba(0,0,0,.2); box-shadow:inset 0 0 4px 0px rgba(0,0,0,.2); background: #FFFFFF;}
.inputDiv input { border: none; background: 0; /*padding: 0;*/ padding:0 0 0 1.5%; margin: 0 !important; width: 100%; height:34px; line-height: 34px;}
a.btnRed {background-color:#ED1B2E; border-radius:7px; color:#FFF; font-size:20px; padding:10px 0 0 0; height:30px; display:block; text-align:center; }
a.btnRed:hover {text-decoration:none;}
.bottomLinksContainer {padding-right:80px;}
.bottomLinks {clear:both; float:right; padding-top:30px;}
.bottomLinks li {float:left; background:url(../images/icon_stroke.gif) 100% 0 no-repeat; padding: 0 20px 0 20px; position:relative;}
.bottomLinks li.last { background: none; padding-right:0;}
.bottomLinks li a {display:block; min-height:24px; color:#666;}
.bottomLinks li a.btnDemo {}
.bottomLinks li a.btnFaq {}
.innerPage {padding:2% 3.5% 10% 3.5%;}
.stepsContainer {width:763px; margin:15px auto 0 auto;}
.stepsContainer > div {/*background:url(../images/line_step.gif) repeat-x 0 29px;*/ min-height:104px; position:relative; text-align:center;}
.stepsContainer > div.step1 {width:240px;}
.stepsContainer > div.step2 {width:240px;}
.stepsContainer > div.step3 {width:240px;}
.stepsContainer > div.step4 {width:0;}
.stepsContainer > div.done {background-position:0 -71px;}
.stepsContainer > div span {display:block; text-align:center;}
.stepsContainer > div span.icon {width:62px; height:62px; background-repeat:no-repeat; margin:0 auto;}
.stepsContainer > div.done span.icon {background-position:0 -62px;}
.stepsContainer > div.active span.icon {background-position:0 -124px;}
.stepsContainer > div.active span.icon {background-position:0 -124px;}
.stepsContainer > div span.title {font-size:16px; font-weight:bold; padding-top:5px;}
.stepsContainer > div.active span.title, .stepsContainer > div.done span.title {color:#EB192C;}
.stepsContainer > div .container {position:absolute;}
.stepsContainer > div.step1 .container {left:-40px;}
.stepsContainer > div.step2 .container {left:-45px;}
.stepsContainer > div.step3 .container {left:-45px;}
.stepsContainer > div.step4 .container {right:-115px; width:180px;}
.stepsContainer > div.step1 span.icon {background-image:url(../images/icon_step1.png);}
.stepsContainer > div.step2 span.icon {background-image:url(../images/icon_step2.png);}
.stepsContainer > div.step3 span.icon {background-image:url(../images/icon_step3.png);}
.stepsContainer > div.step4 span.icon {background-image:url(../images/icon_step4.png);}
.stepsContainer img {width:100%;}
.stepsContainer.forgotPw img {width:auto;}
.innerPage {
box-shadow:inset 0 -7px 10px -4px rgba(0, 0, 0, 0.1);
-webkit-box-shadow:inset 0 -7px 10px -4px rgba(0, 0, 0, 0.1);}
.formContainer {width:400px; margin:50px auto 0 auto;}
.formContainer h4, .formContainer h5, .formContainer h6, .formContainer h7 {padding:0 0 10px 0;}
.formContainer .textField, .formContainer .radioField, .formContainer .multiTextField, .formContainer .checkBoxField {padding:0 0 30px 0; position:relative;}
.formContainer .textField h4, .formContainer .radioField h4, .formContainer .multiTextField h4, .formContainer .checkBoxField h4 {position:relative;}
.formContainer .textField h4 .btnTips, .formContainer .radioField h4 .btnTips, .formContainer .multiTextField h4 .btnTips {position:absolute; top:0; right:0;}
.formContainer .textField select {width:100%;}
.formContainer .multiTextField .dobItem {float:left; width:30.1%; margin-right:4.7%;}
.formContainer .multiTextField .dobItem.last {margin-right:0;}
.formContainer .multiTextField .dateSelect {background-position:90% 50%; width:122px;}
.formContainer .multiTextField span.dateSelect {width:93% !important;}
.formContainer .radioField span {float:left; font-size:18px; color:#333; width:33%;}
.formContainer .radioField span.first, .verification .radioField span.first { margin-right: 60px; width: auto;}
.formContainer .lifeInsuranceFields .radioField span {}
.formContainer .buttons a {float:left; width:47%;}
.formContainer .buttons a.btnBack {margin-right:3%;}
.formContainer .buttons a.btnNext {margin-left:3%;}
.formContainer .buttons a.btnRegStep {margin-left:3%;}
.formContainer .buttons a.btnSend { width: 80%;}
.formContainer .buttons a.btnReqActCode {margin-right:3%;}
.formContainer .buttons a.btnMakeAct {margin-left:3%;}
.formContainer .buttons.single a { float: none; margin: 0 auto;}
/*label.error {clear:both; color:#F00 !important; font-weight:normal !important; font-size:14px !important;}*/
/*.eClubMembershipFields {display:none;}*/
.btnTips {display:block; width:22px; height:22px; background:url(../images/icon_remark.png) no-repeat;}
.tipsContainer {display:none;}
.tipsContainer .container {position:absolute; left:-38px; bottom:45px; width:220px; /*min-height:150px;*/ padding:40px 20px 20px 20px; background-color:#FDE3E6; border-radius:7px;}
.tipsContainer .container .titleMaintenance { color: #666; font-weight: bold; margin: -20px 0 10px 0; font-size: 18px; }
.tipsContainer.tc .container { left: -58px;}
.tipsContainer .container .content { display: block; padding: 10px; background: #FFFFFF;}
.tipsContainer .mainArrow { background: url(../images/img_popup_arrow.png) 0 0 no-repeat; width: 30px; height: 16px; display: block; position: absolute; bottom: 30px; left: 80px;}
.tipsContainer.tc .mainArrow { left: 50px;}
.tipsContainer p {font-size:14px;}
.textField a, .checkBoxField a { color: #EC1A2D; text-decoration: underline; }
.tipsContainer .btnClose {position:absolute; top:12px; right:12px; width:16px; height:16px; background:url(../images/img_popup_close.png) no-repeat;}
.tipsContainer .arrow {position:absolute; top:80px; left:-15px; width:16px; height:30px; background:url(../images/img_popup_arrow.png) no-repeat;}
.overlay {display:none; width:100%; height:100%; position:fixed; z-index:99; background-color:rgba(0,0,0, 0.6);}
.accountTypeContainer > div {display:none;}
.txtPwField, .pwField {display:none;}
div.h8 {font-size:16px; color:#333;}
.formContainer p.intro {font-size:18px; color:#333;}
.formContainer p a {color:#ED1B2E; text-decoration:underline;}
.buttons.single a {float:none; margin:0 auto;}
.iconPhone {color:#EC1B30; font-size:16px; background: url(../images/icon_phone.png) no-repeat 0 0; padding:2px 0 13px 40px; border-bottom:#EC1B30 2px solid; margin-bottom:20px; background-size: 28px;}
.iconPolicyNumber {color:#EC1B30; font-size:16px; background: url(../images/icon_policyNumber.png) no-repeat 0 0; padding:2px 0 13px 40px; border-bottom:#EC1B30 2px solid; margin-bottom:20px;}
.iconMail {color:#EC1B30; font-size:16px; background: url(../images/icon_mail.png) no-repeat 0 0; padding:2px 0 13px 40px; border-bottom:#EC1B30 2px solid; margin-bottom:20px; background-size: 28px;}
.regSuccess .iconPhone, .regSuccess .iconPolicyNumber, .regSuccess .iconMail { margin-bottom: 70px;}
input::-webkit-input-placeholder { /* WebKit browsers */
color: #A9A9B1;
}
input:-moz-placeholder { /* Mozilla Firefox 4 to 18 */
color: #A9A9B1;
opacity: 1;
}
input::-moz-placeholder { /* Mozilla Firefox 19+ */
color: #A9A9B1;
opacity: 1;
}
input:-ms-input-placeholder { /* Internet Explorer 10+ */
color: #A9A9B1;
}
/* step 2 */
.divider { background: url(../images/line_red.jpg) repeat-x 0 50%; display: block; width: 100%; margin: 40px 0;}
.dividerText { background: url(../images/icon_or.png) 0 0 no-repeat; display: block; width: 30px; height: 30px; text-align: center; margin: 0 auto; color: #FFF; line-height: 30px;}
.formContainer.verification { width: 700px}
.verification .textField, .activationContent { width: 400px; margin: 0 auto; color: #333;}
.formContainer h6 { text-align:center;}
.verification .formFields h4 { text-align: center;}
.verification .formFields h6, .verification .formFields h4.title { padding: 0 0 30px 0;}
.verification .activationCodeField, .verification .buttons { width: 500px; margin: 0 auto;}
.verification .textField h4 { text-align: left;}
.verification .textField h4 span { display: inline-block; /*float: right;*/ margin-left: 15px; font-size:14px; color:#666; font-weight:normal;}
.smsContent p, .postContent p, .activationContent p { color: #333;}
/* step 3 */
.selectCountry { width: 180px !important; padding: 6px 0 0 0 !important;}
.selectCountry + span.select2.select2-container { width: 180px !important;}
span.selectCountry { width: 164px !important; padding: 6px 0 0 3% !important;}
input.registerPhone { width: 200px; float:right;}
.formContainer .checkBoxField span { display: block; padding-left: 25px; color: #333; margin-bottom: 15px;}
.formContainer .checkBoxField input { margin: 8px 12px 0 0;}
.personalInformation ol { list-style: decimal; margin: 0 0 25px 25px;}
.personalInformation { color: #333;}
.personalInformation ol li { margin-bottom: 15px;}
.formContainer .checkBoxField span.custCheckbox {padding-left:0;}
.formContainer .checkBoxField span.custCheckbox label {display:block;}
/* step 4*/
.regSuccess { padding: 40px 0;}
.regSuccess p { padding: 15px 0 25px 0;}
/* Main Structure ends */
/* Header starts */
.header {width:100%; height:72px; background-color:#FAFAFA;}
.header .container {width:1024px; height:100%; margin:0 auto; background-color:#BCBCBA;}
.header .desktopContent .logo {width:206px; height:72px; display:block; float:left; margin:0 0 0 19px; background:url(../images/logo.jpg) no-repeat; text-indent:-9999px;background-size: 100%;}
/*.header .mobileContent .logo {width:163px; height:72px; display:block; float:left; margin:0 0 0 -1px; background:url(../images/logo_m.jpg) no-repeat; text-indent:-9999px; background-size: 100%;}*/
.header .mobileContent .logo {width:150px; height:60px; display:block; float:left; margin:18px 0 0 15px; background:url(../images/logo_m.jpg) no-repeat; text-indent:-9999px; background-size: 100%;}
.header .tools {float:right; margin:40px 21px 0 0;}
.header .tools li {float:left; height:16px; background:url(../images/stroke_tool.gif) no-repeat 100% 0; padding:0 10px;}
.header .tools li.last {background:none; padding-right:0;}
.header .tools li a {display:block; height:100%; background-repeat:no-repeat; text-indent:-9999px; background-size: 100%;}
.header .tools li a.home {background-image:url(../images/icon_home.png); width:17px;}
.header .tools li a.langTc {/*background-image:url(../images/icon_tc.png); width:27px; */ width: 28px; color: #FFF; line-height: 100%; text-indent: 0; text-decoration: none;}
.header .tools li a.langEn {/*background-image:url(../images/icon_en.png); width:27px;*/ width: 19px; color: #FFF; line-height: 100%; text-indent: 0; text-decoration: none;}
.header .tools li a.tel {background-image:url(../images/icon_tel.png); width:15px;}
.header .tools li a.fax {background-image:url(../images/icon_fax.png); width:16px; margin-top: 2px;}
.desktopContent { display: block;}
.mobileContent { display: none;}
/* Header ends */
/* Home starts */
.homeTop {padding:4% 3.5% 2% 3.5%;
box-shadow:inset 0 -7px 10px -4px rgba(0, 0, 0, 0.1);
-webkit-box-shadow:inset 0 -7px 10px -4px rgba(0, 0, 0, 0.1);}
.loginContainer {float:left; width:37%; margin-right:3%;}
.loginContainer .loginBox {padding:3% 5%;
background: -webkit-linear-gradient(top, rgba(238,238,238,1) 0%,rgba(238,238,238,0) 100%); /* Chrome10+,Safari5.1+ */
background: -ms-linear-gradient(top, rgba(238,238,238,1) 0%,rgba(238,238,238,0) 100%); /* IE10+ */
background: linear-gradient(to bottom, rgba(238,238,238,1) 0%,rgba(238,238,238,0) 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#eeeeee', endColorstr='#00eeeeee',GradientType=0 ); /* IE6-9 */
}
.loginContainer h1 { font-size: 20px; margin-bottom: 7px;}
.loginContainer a {color:#666;}
.loginContainer a.btnRed {color:#FFF; width:100%;/* margin-top: 55px;*/}
.loginContainer ul li {padding:15px 0 0 0; text-align:right;}
/*
.loginContainer ul li input.loginId {background-image:url(../images/icon_login.png);}
.loginContainer ul li input.loginPassword {background-image:url(../images/icon_password.png);}
*/
.loginContainer ul li.loginPw .inputDiv {background-image:url(../images/icon_password.png);}
.loginContainer ul li.loginId .inputDiv {background-image:url(../images/icon_login.png);}
.loginContainer ul li .inputDiv {margin-top:3px; background-repeat:no-repeat; background-position: 10px 50%; padding-left: 40px; /*width: 86% !important;*/}
.loginContainer .showPw {margin:7px 0; font-size:14px;}
.loginNote {font-size:14px; margin-top:3%; line-height:160%;}
.loginNote a {text-decoration:underline;}
.registerContainer {float:left; width:60%; font-size:14px;}
.registerContainer p {margin-bottom:17px;}
.registerContainer h3 {padding:0 0 10px 39px; min-height:33px; background-repeat:no-repeat;}
.registerContainer .manageContainer h3 {background-image:url(../images/icon_manage.png); }
.registerContainer .secureContainer h3 {background-image:url(../images/icon_secure.png); }
.manageContainer, .secureContainer {padding-bottom:18px;}
.manageContainer {float:left; width:57%; margin-right:3%;}
.secureContainer {float:left; width:40%;}
.registerContainer ul li {background: url(../images/icon_check.png) no-repeat 5px 1px; padding:0 0 2px 40px;}
.registerContainer h2 { background: url(../images/logo_myprudential.png) 0 0 no-repeat; padding: 0 0 10px 0; text-indent: -9999px; height: 43px;}
.registerContainer a.btnRed {float:left; color:#FFF; width:300px;}
.registerContainer .loginNote {float:left; margin-top:1.6%; width: 100%;}
.homeBottom {padding:20px 3.5% 0 3.5%;}
.homeBottomIntro {float:left; width:46%; padding-top:60px; padding-bottom:20px;}
.homeBottomIntro a {text-decoration:underline; color:#666;}
.homeBottomImg {float:right;}
.homeBottom img { width: 100%;}
/* edit on 20150507 starts */
/* error message */
/* .errorMsg { background-image: url(../images/icon_alert.png);background-repeat: no-repeat; background-position: 0 15px; color: #ED1B2E; padding: 13px 13px 13px 30px; font-style: italic; line-height: 130%; margin-bottom: 17px;}
*/
.errorMsg { display: none;}
.errorMsg span { display: block;}
.errorMsg.tc { font-style: normal;}
.loginContainer .errorMsg { background-color: #FCDDE2; margin-bottom: 0; background-position: 13px 15px; padding: 13px 13px 13px 42px;}
.loginDetail { min-height: 233px; min-height: 235px\9;}
/* edit on 20150507 ends */
/* Home ends */
/* Footer starts */
.footer {width:100%; height:8px; /* background-color:#ED1B2E;*/}
/* Footer ends */
/* Custom radio starts */
input[type='radio'], input[type='checkbox'] {
/* Hide the input, but have it still be clickable */
opacity: 0;
float: left;
margin-top:8px;
}
input[type='radio'] + label, input[type='checkbox'] + label {
margin: 0;
clear: none;
/* Left padding makes room for image */
padding: 5px 0 4px 30px;
/* Make look clickable because they are */
cursor: pointer;
display:block;
}
input[type='radio'] + label, input[type='checkbox'] + label {background-repeat:no-repeat; background-position:0 5px;}
input[type='radio'] + label {background-image:url(../images/cust_radio.png);}
input[type='checkbox'] + label {background-image:url(../images/cust_checkbox.png);}
input[type='radio'] + label {background-image:none\9;}
input[type='checkbox'] + label {background-image:none\9;}
input[type='radio'] + label {background-image:url(../images/cust_radio.png)\9\0;}
input[type='checkbox'] + label {background-image:url(../images/cust_checkbox.png)\9\0;}
/*
Change from unchecked to checked graphic
*/
input[type='radio']:checked + label, input[type='checkbox']:checked + label {background-position:0 -245px;}
/* Custom radio ends */
.dropDownContent > div {display:none;}
.dropDownContent > div:first-child {display:block;}
/* Custom Select starts */
.select2-container {
box-sizing: border-box;
display: inline-block;
margin: 0;
position: relative;
vertical-align: middle; }
.select2-container .select2-selection--single {
box-sizing: border-box;
cursor: pointer;
display: block;
height: 28px;
user-select: none;
-webkit-user-select: none; }
.select2-container .select2-selection--single .select2-selection__rendered {
display: block;
overflow: hidden;
padding-left: 8px;
padding-right: 20px;
text-overflow: ellipsis; }
.select2-container[dir="rtl"] .select2-selection--single .select2-selection__rendered {
padding-right: 8px;
padding-left: 20px; }
.select2-container .select2-selection--multiple {
box-sizing: border-box;
cursor: pointer;
display: block;
min-height: 32px;
user-select: none;
-webkit-user-select: none; }
.select2-container .select2-selection--multiple .select2-selection__rendered {
display: inline-block;
overflow: hidden;
padding-left: 8px;
text-overflow: ellipsis; }
.select2-container .select2-search--inline {
float: left; }
.select2-container .select2-search--inline .select2-search__field {
border: none;
font-size: 100%;
margin-top: 5px; }
.select2-dropdown {
background-color: white;
border: 1px solid #aaa;
border-radius: 4px;
box-sizing: border-box;
display: block;
position: absolute;
left: -100000px;
width: 100%;
z-index: 1051; }
.select2-results {
display: block; }
.select2-results__options {
list-style: none;
margin: 0;
padding: 0; }
.select2-results__option {
padding: 6px;
user-select: none;
-webkit-user-select: none; }
.select2-results__option[aria-selected] {
cursor: pointer; }
.select2-container--open .select2-dropdown {
left: 0; }
.select2-container--open .select2-dropdown--above {
border-bottom: none;
border-bottom-left-radius: 0;
border-bottom-right-radius: 0; }
.select2-container--open .select2-dropdown--below {
border-top: none;
border-top-left-radius: 0;
border-top-right-radius: 0; }
.select2-search--dropdown {
display: none;
padding: 4px; }
.select2-search--dropdown .select2-search__field {
padding: 4px;
width: 100%;
box-sizing: border-box; }
.select2-search--dropdown.select2-search--hide {
display: none; }
.select2-close-mask {
border: 0;
margin: 0;
padding: 0;
display: block;
position: fixed;
left: 0;
top: 0;
min-height: 100%;
min-width: 100%;
height: auto;
width: auto;
opacity: 0;
z-index: 99;
background-color: #fff;
filter: alpha(opacity=0); }
.select2.select2-container {width:100% !important;}
.select2-container--default .select2-selection--single {
width:100%; padding:0; height:38px; font-size:14px; text-align:left; border:#D7D7D7 2px solid; background:url(../images/arrow_select.png) no-repeat 100% 50%;
-webkit-box-shadow:inset 0 0 4px 0px rgba(0,0,0,.2);
box-shadow:inset 0 0 4px 0px rgba(0,0,0,.2);}
.select2-container--default .select2-selection--single .select2-selection__rendered {
color: #444;
line-height: 34px; }
.select2-container--default .select2-selection--single .select2-selection__clear {
cursor: pointer;
float: right;
font-weight: bold; }
.select2-container--default .select2-selection--single .select2-selection__placeholder {
color: #999; }
.select2-container--default .select2-selection--single .select2-selection__arrow {
height: 26px;
position: absolute;
top: 1px;
right: 1px;
width: 20px; }
.select2-container--default .select2-selection--single .select2-selection__arrow b {
border-color: #888 transparent transparent transparent;
border-style: solid;
border-width: 5px 4px 0 4px;
height: 0;
left: 50%;
margin-left: -4px;
margin-top: -2px;
position: absolute;
top: 50%;
width: 0;
display:none;}
.select2-container--default[dir="rtl"] .select2-selection--single .select2-selection__clear {
float: left; }
.select2-container--default[dir="rtl"] .select2-selection--single .select2-selection__arrow {
left: 1px;
right: auto; }
.select2-container--default.select2-container--disabled .select2-selection--single {
background-color: #eee;
cursor: default; }
.select2-container--default.select2-container--disabled .select2-selection--single .select2-selection__clear {
display: none; }
.select2-container--default.select2-container--open .select2-selection--single .select2-selection__arrow b {
border-color: transparent transparent #888 transparent;
border-width: 0 4px 5px 4px; }
.select2-container--default .select2-selection--multiple {
background-color: white;
border: 1px solid #aaa;
border-radius: 4px;
cursor: text; }
.select2-container--default .select2-selection--multiple .select2-selection__rendered {
list-style: none;
margin: 0;
padding: 0 5px;
width: 100%; }
.select2-container--default .select2-selection--multiple .select2-selection__placeholder {
color: #999;
margin-top: 5px;
float: left; }
.select2-container--default .select2-selection--multiple .select2-selection__clear {
cursor: pointer;
float: right;
font-weight: bold;
margin-top: 5px;
margin-right: 10px; }
.select2-container--default .select2-selection--multiple .select2-selection__choice {
background-color: #e4e4e4;
border: 1px solid #aaa;
border-radius: 4px;
cursor: default;
float: left;
margin-right: 5px;
margin-top: 5px;
padding: 0 5px; }
.select2-container--default .select2-selection--multiple .select2-selection__choice__remove {
color: #999;
cursor: pointer;
display: inline-block;
font-weight: bold;
margin-right: 2px; }
.select2-container--default .select2-selection--multiple .select2-selection__choice__remove:hover {
color: #333; }
.select2-container--default[dir="rtl"] .select2-selection--multiple .select2-selection__choice, .select2-container--default[dir="rtl"] .select2-selection--multiple .select2-selection__placeholder {
float: right; }
.select2-container--default[dir="rtl"] .select2-selection--multiple .select2-selection__choice {
margin-left: 5px;
margin-right: auto; }
.select2-container--default[dir="rtl"] .select2-selection--multiple .select2-selection__choice__remove {
margin-left: 2px;
margin-right: auto; }
.select2-container--default.select2-container--disabled .select2-selection--multiple {
background-color: #eee;
cursor: default; }
.select2-container--default.select2-container--disabled .select2-selection__choice__remove {
display: none; }
.select2-container--default.select2-container--open.select2-container--above .select2-selection--single, .select2-container--default.select2-container--open.select2-container--above .select2-selection--multiple {
border-top-left-radius: 0;
border-top-right-radius: 0; }
.select2-container--default.select2-container--open.select2-container--below .select2-selection--single, .select2-container--default.select2-container--open.select2-container--below .select2-selection--multiple {
border-bottom-left-radius: 0;
border-bottom-right-radius: 0; }
.select2-container--default .select2-search--dropdown .select2-search__field {
border: 1px solid #aaa; }
.select2-container--default .select2-search--inline .select2-search__field {
background: transparent;
border: none;
outline: 0; }
.select2-container--default .select2-results > .select2-results__options {
max-height: 200px;
overflow-y: auto; }
.select2-container--default .select2-results__option[role=group] {
padding: 0; }
.select2-container--default .select2-results__option[aria-disabled=true] {
color: #999; }
.select2-container--default .select2-results__option[aria-selected=true] {
background-color: #ddd; }
.select2-container--default .select2-results__option .select2-results__option {
padding-left: 1em; }
.select2-container--default .select2-results__option .select2-results__option .select2-results__group {
padding-left: 0; }
.select2-container--default .select2-results__option .select2-results__option .select2-results__option {
margin-left: -1em;
padding-left: 2em; }
.select2-container--default .select2-results__option .select2-results__option .select2-results__option .select2-results__option {
margin-left: -2em;
padding-left: 3em; }
.select2-container--default .select2-results__option .select2-results__option .select2-results__option .select2-results__option .select2-results__option {
margin-left: -3em;
padding-left: 4em; }
.select2-container--default .select2-results__option .select2-results__option .select2-results__option .select2-results__option .select2-results__option .select2-results__option {
margin-left: -4em;
padding-left: 5em; }
.select2-container--default .select2-results__option .select2-results__option .select2-results__option .select2-results__option .select2-results__option .select2-results__option .select2-results__option {
margin-left: -5em;
padding-left: 6em; }
.select2-container--default .select2-results__option--highlighted[aria-selected] {
background-color: #ED1B2E;
color: white; }
.select2-container--default .select2-results__group {
cursor: default;
display: block;
padding: 6px; }
.select2-container--classic .select2-selection--single {
background-color: #f6f6f6;
border: 1px solid #aaa;
border-radius: 4px;
outline: 0;
background-image: -webkit-linear-gradient(top, #ffffff 50%, #eeeeee 100%);
background-image: -o-linear-gradient(top, #ffffff 50%, #eeeeee 100%);
background-image: linear-gradient(to bottom, #ffffff 50%, #eeeeee 100%);
background-repeat: repeat-x;
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffff', endColorstr='#eeeeee', GradientType=0); }
.select2-container--classic .select2-selection--single:focus {
border: 1px solid #ED1B2E; }
.select2-container--classic .select2-selection--single .select2-selection__rendered {
color: #444;
line-height: 28px; }
.select2-container--classic .select2-selection--single .select2-selection__clear {
cursor: pointer;
float: right;
font-weight: bold;
margin-right: 10px; }
.select2-container--classic .select2-selection--single .select2-selection__placeholder {
color: #999; }
.select2-container--classic .select2-selection--single .select2-selection__arrow {
background-color: #ddd;
border: none;
border-left: 1px solid #aaa;
border-top-right-radius: 4px;
border-bottom-right-radius: 4px;
height: 26px;
position: absolute;
top: 1px;
right: 1px;
width: 20px;
background-image: -webkit-linear-gradient(top, #eeeeee 50%, #cccccc 100%);
background-image: -o-linear-gradient(top, #eeeeee 50%, #cccccc 100%);
background-image: linear-gradient(to bottom, #eeeeee 50%, #cccccc 100%);
background-repeat: repeat-x;
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#eeeeee', endColorstr='#cccccc', GradientType=0); }
.select2-container--classic .select2-selection--single .select2-selection__arrow b {
border-color: #888 transparent transparent transparent;
border-style: solid;
border-width: 5px 4px 0 4px;
height: 0;
left: 50%;
margin-left: -4px;
margin-top: -2px;
position: absolute;
top: 50%;
width: 0; }
.select2-container--classic[dir="rtl"] .select2-selection--single .select2-selection__clear {
float: left; }
.select2-container--classic[dir="rtl"] .select2-selection--single .select2-selection__arrow {
border: none;
border-right: 1px solid #aaa;
border-radius: 0;
border-top-left-radius: 4px;
border-bottom-left-radius: 4px;
left: 1px;
right: auto; }
.select2-container--classic.select2-container--open .select2-selection--single {
border: 1px solid #ED1B2E; }
.select2-container--classic.select2-container--open .select2-selection--single .select2-selection__arrow {
background: transparent;
border: none; }
.select2-container--classic.select2-container--open .select2-selection--single .select2-selection__arrow b {
border-color: transparent transparent #888 transparent;
border-width: 0 4px 5px 4px; }
.select2-container--classic.select2-container--open.select2-container--above .select2-selection--single {
border-top: none;
border-top-left-radius: 0;
border-top-right-radius: 0;
background-image: -webkit-linear-gradient(top, #ffffff 0%, #eeeeee 50%);
background-image: -o-linear-gradient(top, #ffffff 0%, #eeeeee 50%);
background-image: linear-gradient(to bottom, #ffffff 0%, #eeeeee 50%);
background-repeat: repeat-x;
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffff', endColorstr='#eeeeee', GradientType=0); }
.select2-container--classic.select2-container--open.select2-container--below .select2-selection--single {
border-bottom: none;
border-bottom-left-radius: 0;
border-bottom-right-radius: 0;
background-image: -webkit-linear-gradient(top, #eeeeee 50%, #ffffff 100%);
background-image: -o-linear-gradient(top, #eeeeee 50%, #ffffff 100%);
background-image: linear-gradient(to bottom, #eeeeee 50%, #ffffff 100%);
background-repeat: repeat-x;
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#eeeeee', endColorstr='#ffffff', GradientType=0); }
.select2-container--classic .select2-selection--multiple {
background-color: white;
border: 1px solid #aaa;
border-radius: 4px;
cursor: text;
outline: 0; }
.select2-container--classic .select2-selection--multiple:focus {
border: 1px solid #ED1B2E; }
.select2-container--classic .select2-selection--multiple .select2-selection__rendered {
list-style: none;
margin: 0;
padding: 0 5px; }
.select2-container--classic .select2-selection--multiple .select2-selection__clear {
display: none; }
.select2-container--classic .select2-selection--multiple .select2-selection__choice {
background-color: #e4e4e4;
border: 1px solid #aaa;
border-radius: 4px;
cursor: default;
float: left;
margin-right: 5px;
margin-top: 5px;
padding: 0 5px; }
.select2-container--classic .select2-selection--multiple .select2-selection__choice__remove {
color: #888;
cursor: pointer;
display: inline-block;
font-weight: bold;
margin-right: 2px; }
.select2-container--classic .select2-selection--multiple .select2-selection__choice__remove:hover {
color: #555; }
.select2-container--classic[dir="rtl"] .select2-selection--multiple .select2-selection__choice {
float: right; }
.select2-container--classic[dir="rtl"] .select2-selection--multiple .select2-selection__choice {
margin-left: 5px;
margin-right: auto; }
.select2-container--classic[dir="rtl"] .select2-selection--multiple .select2-selection__choice__remove {
margin-left: 2px;
margin-right: auto; }
.select2-container--classic.select2-container--open .select2-selection--multiple {
border: 1px solid #ED1B2E; }
.select2-container--classic.select2-container--open.select2-container--above .select2-selection--multiple {
border-top: none;
border-top-left-radius: 0;
border-top-right-radius: 0; }
.select2-container--classic.select2-container--open.select2-container--below .select2-selection--multiple {
border-bottom: none;
border-bottom-left-radius: 0;
border-bottom-right-radius: 0; }
.select2-container--classic .select2-search--dropdown .select2-search__field {
border: 1px solid #aaa;
outline: 0; }
.select2-container--classic .select2-search--inline .select2-search__field {
outline: 0; }
.select2-container--classic .select2-dropdown {
background-color: white;
border: 1px solid transparent; }
.select2-container--classic .select2-dropdown--above {
border-bottom: none; }
.select2-container--classic .select2-dropdown--below {
border-top: none; }
.select2-container--classic .select2-results > .select2-results__options {
max-height: 200px;
overflow-y: auto; }
.select2-container--classic .select2-results__option[role=group] {
padding: 0; }
.select2-container--classic .select2-results__option[aria-disabled=true] {
color: grey; }
.select2-container--classic .select2-results__option--highlighted[aria-selected] {
background-color: #3875d7;
color: white; }
.select2-container--classic .select2-results__group {
cursor: default;
display: block;
padding: 6px; }
.select2-container--classic.select2-container--open .select2-dropdown {
border-color: #ED1B2E; }
/* Custom Select ends */
/* Global Responsive starts */
@media all and (max-width:1320px)
{
}
@media all and (max-width:768px)
{
#contentContainer {width:768px;}
.header .container {width:768px;}
.loginContainer {width:48%;}
.registerContainer {width:49%;}
.manageContainer {width:100%; margin-right:0;}
.secureContainer {width:100%;}
.homeBottomIntro {width:100%; padding-top:0;}
/*.homeBottomImg {width:100%; text-align:center;}*/
.stepsContainer {width:660px;}
.stepsContainer > div.step1 {width:200px;}
.stepsContainer > div.step2 {width:200px;}
.stepsContainer > div.step3 {width:200px;}
.stepsContainer > div.step1 .container {left:-40px;}
.stepsContainer > div.step2 .container {left:-45px;}
.stepsContainer > div.step3 .container {left:-47px;}
.stepsContainer > div.step4 .container {right:-105px; width:180px;}
.stepsContainer .mobileContent img { width: 100%;}
.registerContainer h2 { background: url(../images/logo_myprudential_m.png) 0 0 no-repeat; background-size: 160px;}
.formContainer.verification, .verification .textField, .verification .activationCodeField, .verification .buttons, .activationContent { width: 500px;}
.formContainer .textField h4 span { display: block; float: none;}
.formContainer h6, .formContainer h4.title { text-align: left;}
.buttons.single a, .formContainer .buttons a.btnSend { width: 100%;}
.mobileContent img { width: 100%; max-height: 312px; max-width: 580px;}
.bottomLinksContainer { width: 100%; padding-right: 0 !important;}
.bottomLinks { float: right; margin-right: 20px;}
.homeTop .bottomLinks { margin-right: 10px;}
.regSuccess { padding: 0;}
.verification .textField h4 span { margin-left: 0; font-size: 14px;}
.radioField.receiveRadio span, .activationCodeField .radioField span { width: auto !important;}
.header .tools {margin:28px 21px 0 0;}
.header .tools li {float:left; height:17px; background:url(../images/stroke_tool_m.gif) no-repeat 100% 0; padding:0 15px;}
.header .tools li a { height: 17px;}
.header .tools li a.home {background-image:url(../images/icon_home_m.png); width:21px;}
.header .tools li a.langTc { width: 35px; font-size: 17px; text-indent: 0;}
.header .tools li a.langEn { width: 24px; font-size: 17px; text-indent: 0;}
/* input remove icon */
.inputDiv { position: relative; }
a.remove { background: url(../images/icon_remove_m.png) 50% 50% no-repeat; }
}
@media all and (max-width:767px)
{
html, body {font-size:14px;}
input, select, textarea {font-size:14px;}
.loginContainer .showPw, .loginNote, .registerContainer, .custSelect {font-size:14px;}
a.btnRed {font-size:18px;}
h4 {font-size:20px;}
h5 { font-size: 14px;}
.verification .formFields h6, .verification .formFields h4.title { padding: 0 0 15px 0;}
.formContainer h6.alignLeft {width:100%;}
#contentContainer {width:100%;}
.header .container {width:100%;}
.loginContainer {width:100%; margin-right:0;
box-shadow:inset 0 -7px 10px -4px rgba(0, 0, 0, 0.1);
-webkit-box-shadow:inset 0 -7px 10px -4px rgba(0, 0, 0, 0.1);}
.loginContainer a.btnRed { margin-top: 20px;}
.registerContainer {width:100%; padding-top:20px;}
.registerContainer a.btnRed {width:100%;}
.manageContainer {width:100%; margin-right:0;}
.secureContainer {width:100%;}
.homeBottomIntro {width:100%; padding-top:0;}
.homeBottomImg {width:100%; text-align:center;}
.homeBottomImg img {width:100%;}
.manageContainer, .secureContainer {padding-bottom: 17px;}
.formContainer {width:100%; margin-top:30px;}
.bottomLinksContainer {padding-right:60px;}
.stepsContainer {width:100%;}
.stepsContainer > div {min-height:62px;}
.stepsContainer > div span.title {display:none; font-size:14px;}
.stepsContainer > div.step1 {width:60px;}
.stepsContainer > div.step2 {width:60px;}
.stepsContainer > div.step3 {width:60px;}
.stepsContainer > div.step4 {width:51px;}
.stepsContainer > div.active {width:175px;}
.stepsContainer > div.step1 .container {left:-5px;}
.stepsContainer > div.step2 .container {left:-5px;}
.stepsContainer > div.step3 .container {left:-5px;}
.stepsContainer > div.step4 .container {right:-5px; width:auto;}
.stepsContainer > div.active .container {width:168px; /*background: url(../images/bg_step.gif) no-repeat 100% 0;*/ background-size:auto 62px; left:0;}
.stepsContainer > div.step4.active {width:168px;}
.stepsContainer > div.step4.active .container {right:0;}
.stepsContainer > div.active span.icon {float:left;}
.stepsContainer > div.active span.title {display:block;float:left; text-align:left; width:100px; padding-top:6px; padding-left:5px; color:#FFF; line-height:120%;}
.formContainer .textField, .formContainer .radioField, .formContainer .multiTextField, .formContainer .checkBoxField {position:static;}
.tipsContainer {position:fixed; width:100%; left:50%; top:50%; z-index:100;}
.tipsContainer .container {position:relative; width:300px; margin:0 auto; left:0; top:0; bottom:auto; z-index:100;}
.tipsContainer .arrow {display:none;}
.formContainer .lifeInsuranceFields .radioField span:first-child,
.formContainer .dropDownContent .radioField span:first-child { padding-bottom: 20px;}
/*.formContainer .activationCodeField .radioField span:first-child { padding-bottom: 20px;}*/
.formContainer .eClubMembershipFields .radioField span.first { padding-bottom: 20px;}
#loginForm h1 { text-align: center;}
.desktopContent {display:none;}
.mobileContent {display:block;}
.header .tools li.deskTopLast {background:none; padding-right:0;}
.formContainer .radioField span {width:100%;}
.formContainer.verification, .verification .textField, .verification .activationCodeField, .verification .buttons, .activationContent { width: 100%;}
.selectCountry + span.select2.select2-container {width:100% !important; margin-bottom:10px;}
input.registerPhone {float:none !important; width:96% !important;}
.tipsContainer .mainArrow { display: none;}
/* mobile images */
.iconPhone {background: url(../images/icon_phone_m.png) no-repeat 0 0; background-size: 28px;}
.iconPolicyNumber { background: url(../images/icon_policyNumber_m.png) no-repeat 0 0; background-size: 28px;}
.iconMail {background: url(../images/icon_mail_m.png) no-repeat 0 0; background-size: 28px;}
.dividerText { background: url(../images/icon_or_m.png) 0 0 no-repeat; background-size: 100%;}
.registerContainer .manageContainer h3 {background-image:url(../images/icon_manage_m.png); background-size: 28px; }
.registerContainer .secureContainer h3 {background-image:url(../images/icon_secure_m.png);background-size: 31px; }
/*
.loginContainer ul li .inputDiv { background-image:url(../images/icon_password_m.png); background-size: 21px; }
.loginContainer ul li:nth-child(1) .inputDiv { background-image:url(../images/icon_login_m.png); background-size: 21px;}
*/
.loginContainer ul li.loginId .inputDiv { background-image:url(../images/icon_login_m.png); background-size: 21px; }
.loginContainer ul li.loginPw .inputDiv { background-image:url(../images/icon_password_m.png); background-size: 21px;}
/* edit on 20150507 starts */
.errorMsg { background-image: url(../images/icon_alert_m.png); background-size: 18px;}
/* edit on 20150507 ends */
.bottomLinks li {position:static; padding-left:10px; padding-right:10px;}
.formContainer.step4{width:100% !important;}
.dobItem .listContainer ul {max-height: 170px;}
}
/* Global Responsive ends */
/* dropdown */
.formContainer .customSelect {z-index: 10;}
.customSelect { width: 100%; padding: 0; height: 38px !important; font-size: 14px; text-align: left; background: url(../images/arrow_select.png) no-repeat 100% 50%; box-sizing: border-box; cursor: pointer; display: block; user-select: none; -webkit-user-select: none;}
.display { color: #444; line-height: 34px; display: block; overflow: hidden; padding-left: 8px; padding-right: 20px;
text-overflow: ellipsis; border: 2px solid #D7D7D7; -webkit-box-shadow: inset 0 0 4px 0px rgba(0,0,0,.2); box-shadow: inset 0 0 4px 0px rgba(0,0,0,.2);}
.listContainer { background: #FFFFFF; border: 2px solid #D7D7D7; border-top: 0; z-index: 999; position: relative;}
.listContainer ul { max-height: 200px; overflow-y: auto; background: #FFFFFF; z-index: 999; }
.listContainer ul li { cursor: pointer; padding: 6px; -webkit-user-select: none;}
.listContainer ul li:hover { background-color: #ED1B2E; color: white; }
a.btnSendSMS , a.btnSendPost , a.btnSendEmail, a.btnReqActCode, a.btnMakeAct{ color: #FFFFFF;text-decoration: blink;}
.formContainer .buttons a.btnSendSMS , .formContainer .buttons a.btnSendEmail, .formContainer .buttons a.btnSendPost .buttons a.btnReqActCode .buttons a.btnMakeAct {width: 80%;}
.postContent .buttons a.btnSendPost {width:80%;}
.radioError {padding-top: 30px;}
.colRed {color: #f00 !important;}
#infoFormLifeStep3 .eStatement{background-color: #F6F6F6; padding: 10px;}
#infoFormLifeStep3 .confirmNote{margin: 10px 0 30px 0; font-weight: bold;}
.formContainer.step4{width:450px;}
.formContainer.step4 .buttons.single{margin-top: 20px;}
.formContainer input:-webkit-autofill {
-webkit-box-shadow: 0 0 0px 1000px white inset !important;
}
.displayNone{display:none !important;}
.formContainer .mt-form .form-control{font-size:1.5rem;}