﻿
.submit-loader-login {
    top: 3px;
}

.mg-right10px {
    margin-right: 10px!important;
}

.mg-top7px {
    margin-top: 7px;
}

.mg-top10px {
    margin-top: 10px!important;
}

.mg-top15px {
    margin-top: 15px!important;
}

.mg-bot5px {
    margin-bottom: 7px!important;
}

.mg-bot7px {
    margin-bottom: 7px!important;
}

.mg-bot10px {
    margin-bottom: 10px!important;
}

.mg-bot15px {
    margin-bottom: 15px!important;
}

.w90p {
    width: 90%!important;
}

.float_l {
    float: left!important;
}

.float_r {
    float: right!important;
}

.cardError {
    color: #e24343!important;
    margin: 0 0 0 0;
    display: none;
    float: left;
}

.date-error { display: block;color:red!important;}

.no-margin { margin: 0px;}
ul.sx-tabs li a span.attempt-error {
    padding: 0px;
    line-height: 14px;
    color: red !important;
    margin-bottom: 5px;
}

/*#region  Terms and Conditions View */
.sxui #registrationDetails {
    margin-left: 0px;
    margin-right: 0px;
}

    .sxui #registrationDetails .agree label {
        float: left;
        width: 100%;
    }

    .sxui #registrationDetails .agree p {
        float: left;
        width: 85%;
        margin: -3px 0 0 0px;
    }

    .sxui #registrationDetails .back, .sxui #registrationDetails .next {
        margin: 10px 0 20px 10px;
    }

    .sxui #registrationDetails .cancel {
        font-size: 14px;
        margin-top: 20px;
    }

#registrationDetails h2 {
    font-size: 20px !important;
    padding-left: 0 !important;
    margin-top: 10px !important;
    margin-bottom: 10px !important;
}

#registrationDetails {
    /*padding-left: 10px !important;
    padding-right: 10px !important;
    padding-top: 10px !important;*/
}

.privacyMessage p {
    margin-left: 0px !important;
    padding-left: 0px !important;
}

.termsOfUseMessage p {
    margin-left: 0px !important;
    padding-left: 0px !important;
}

.TermsPrivacyStatement {
    margin: 20px 0px;
}
/*#endregion */

/*#region Identify View */

.ui-datepicker-trigger {
    width: 25px;
    vertical-align: top !important;
    padding-top: 2px;
}

#datepickerDiv {
    display: inline-block !important;
}

.dropdownlist {
    margin-right: 2px;
}

.selectBox-dropdown .selectBox-label {
    padding: 4px 8px !important;
    width: inherit !important;
}

#datepickerDiv.error .selectBox-dropdown {
    background: url(/portals/_default/skins/engage/images/jquery.selectBoxRed.png) top left no-repeat;
}

#datepickerDiv.error .selectBox-dropdown .selectBox-arrow {
    background: url(/portals/_default/skins/engage/images/jquery.selectBox-arrowRed.png) top left no-repeat;
}

.ui-datepicker-calendar td a.ui-state-active {
    background-color: #3093CC !important;
    color: #FFF !important;
}

.sxui .med-margins { padding: 10px 20px!important;}

/*#endregion */

/*#region Verify View */


.verify-block .flex-right {
    width: auto;
}

.sx-tabs-full {
    display: table!important;
    overflow: hidden;
}

    .sx-tabs-full li {
        display: table-cell!important; /* [4] */
        margin-right: 0px !important;
        float: none !important;
        width: 33%;
    }

        .sx-tabs-full li a span {
            float: none !important;
        }

    .sx-tabs-full li {
        display: table-cell!important; /* [4] */
    }

    .attempt-error {
        height: 14px;
        line-height: 14px;
        margin: 0px;
        padding: 0px;
        color: red!important;
    }


ul.sx-tabs li span.text {
    padding: 0px;
    margin: 0px;
    height: 14px;
    line-height: 14px;
}

ul.sx-tabs li span.icon {
    background-image: url(images/verify-tabs.png)!important;
    background-repeat: no-repeat !important;
    display: inline-block;
    height: 42px;
    width: 42px;
    padding: 0px;
    margin-top: 5px;
}

ul.sx-tabs li span.icon, .tabbedAccordion h3 span.icon {
    background-image: url(images/verify-tabs.png)!important;
    background-repeat: no-repeat !important;
    display: inline-block;
    height: 42px;
    width: 42px;
    padding: 0px;
    margin-top: 5px;
}

ul.sx-tabs li span.icon-email, .tabbedAccordion h3 span.icon-email {
    background-position: 0px 0px;
}

ul.sx-tabs li a:hover span.icon-email, ul.sx-tabs li a.selected span.icon-email,
.tabbedAccordion h3:hover span.icon-email, .tabbedAccordion h3.ui-accordion-header-active span.icon-email {
    background-position: 0px -46px;
}

ul.sx-tabs li span.icon-phone, .tabbedAccordion h3 span.icon-phone {
    background-position: 2px -184px;
}

ul.sx-tabs li a:hover span.icon-phone, ul.sx-tabs li a.selected span.icon-phone,
.tabbedAccordion h3:hover span.icon-phone, .tabbedAccordion h3.ui-accordion-header-active span.icon-phone {
    background-position: 2px -226px;
}

ul.sx-tabs li span.icon-txt, .tabbedAccordion h3 span.icon-txt {
    background-position: 6px -92px;
}

ul.sx-tabs li a:hover span.icon-txt, ul.sx-tabs li a.selected span.icon-txt,
.tabbedAccordion h3:hover span.icon-txt, .tabbedAccordion h3.ui-accordion-header-active span.icon-txt {
    background-position: 6px -138px;
}


#accordion h3 {
    display: none;
}

h5.tabAdditionalMessage {
    font-weight: bold;
    color: #2993ce;
}

a.phonePrefix {
    width: 75px!important;
}

input.phone-textfield {
    height: 31px!important;
}

input.pin-number { width: 30px!important;margin-right: 10px;}

.small-spacing p { margin-bottom: 10px;}

.confirm-pin { margin-top: 10px;border-top: 1px dotted #e1e1e1;padding-top:10px;}
.confirm-pin h5 { margin-bottom: 10px !important;}

/*#endregion*/

/*#region Login details View  */

.txtUsername::-ms-clear {
    display: none;
}

/*#endregion*/

/*#region Complete View  */

/*#endregion*/

.sxui input[type="checkbox"].sx-checkbox + label span {
    float: left;
    display: inline-block;
    width: 21px;
    height: 30px;
    margin: 0px 2px 0 0;
    vertical-align: middle;
    cursor: pointer;
}

.sxui .agree p {
    float: left;
    width: 85%;
    margin: 3px 0 0 6px;
}

.requiredFieldLegend {
    margin-bottom: 20px !important;
    margin-top: 20px !important;
}

.buttonsLocation {
    width: 100%;
    margin-top: 20px;
    margin-bottom: 20px;
    display: inline-block;
}

    .buttonsLocation span.cancelReg {
        float: left;
        margin-top: 4px;
    }

    .buttonsLocation span.moveToNextStep {
        float: right;
    }

.cancelLocation {
    float: left;
    margin-top: 27px;
    display: inline-block;
}

ul.sx-tabs {
    width: 100%;
}

.tab1-li {
    width: 50%;
    float: left !important;
}

.tab2-li {
    width: 49%;
    float: right !important;
}

ul.sx-tabs li a {
    width: 100%;
    text-align: center;
}

ul.sx-tabs li {
    margin-right: 0px !important;
}

    ul.sx-tabs li a span {
        float: none !important;
    }

#cancelRegistrationDialogDiv_registration, #cancelRegistrationDialogDiv_security, #cancelRegistrationDialogDiv_confirm {
    text-align: center;
    margin: 10px;
    height: 90px !important;
}

/*#region  Placeholder/Watermark */
input[type=text]::-webkit-input-placeholder { /* WebKit browsers */
    color: #999 !important;
}

input[type=text]:-moz-placeholder { /* Mozilla Firefox 4 to 18 */
    color: #999 !important;
    opacity: 1 !important;
}

input[type=text]::-moz-placeholder { /* Mozilla Firefox 19+ */
    color: #999 !important;
    opacity: 1 !important;
}

input[type=text]:-ms-input-placeholder { /* Internet Explorer 10+ */
    color: #999 !important;
}
/*#endregion */

/*#region  Registration Details Page */
.sxui #registrationDetails {
    margin-left: 0px;
    margin-right: 0px;
}

.sxui .agree label {
    float: left;
    width: 100%;
}

.sxui .agree p {
    float: left;
    width: 85%;
    margin: 3px 0 0 6px;
}

.sxui #registrationDetails .back, .sxui #registrationDetails .next {
    margin: 10px 0 20px 10px;
}

.sxui #registrationDetails .cancel {
    font-size: 14px;
    margin-top: 20px;
}

#registrationDetails h2 {
    font-size: 20px !important;
    padding-left: 0 !important;
    margin-top: 10px !important;
    margin-bottom: 10px !important;
}

#registrationDetails {
    /*padding-left: 10px !important;
    padding-right: 10px !important;
    padding-top: 10px !important;*/
}

.privacyMessage p {
    margin-left: 0px !important;
    padding-left: 0px !important;
    width: 85%;
    margin: 0;
}

.termsOfUseMessage p {
    margin-left: 0px !important;
    padding-left: 0px !important;
}
/*#endregion */

/*#region Security Questions Page */
#securityQuestions .row {
    margin-bottom: 8px;
}

#securityQuestions .gp-label, .gp-label-clear, .gp-field, .gp-validation {
    display: inline-block;
    margin-top: 5px;
}

#securityQuestions .gp-label, .gp-label-clear {
    width: 28% !important;
    float: left;
    text-align: left;
    margin-top: 10px;
}

#securityQuestions .gp-field {
    width: 40% !important;
    float: left;
}

    #securityQuestions .gp-field a.selectBox {
        width: 100% !important;
    }

    #securityQuestions .gp-field .selectBox-label {
        width: 100% !important;
    }

#securityQuestions .gp-validation {
}

#securityQuestions input[type='text'], select {
    width: 100%;
}

.sxui input[type=text], .sxui input[type=password], .selectBox {
    width: 247px;
}

div.row select.selectBox {
    margin: 0;
    padding: 4px 5px 4px 10px;
    height: 28px;
}

p.flex-left {
    margin-bottom: 0;
}


.success-watermark {
    margin-right: 90px;
}

.group-row {
    padding: 45px;
}

/* #region Confirm */
.tab-confirm .suggestedAddresses {
    position: relative;
    display: block;
    max-width: 400px;
}

    .tab-confirm .suggestedAddresses ul.ui-autocomplete {
        position: absolute;
        top: 0 !important;
        left: 0 !important;
        background: #fff;
        border: 1px solid #e1e1e1 !important;
        border-radius: 0;
    }

        .tab-confirm .suggestedAddresses ul.ui-autocomplete a {
            font-size: 12px;
        }

.tab-confirm .find-address-holder {
    display: block;
    position: relative;
    float: left;
    margin-right: 4px;
}

    .tab-confirm .find-address-holder .textbox-progress {
        background: url('images/progress.gif') no-repeat right center;
        display: none;
        position: absolute;
        top: 6px;
        right: 5px;
        width: 16px;
        height: 16px;
    }

.tab-confirm ul.ui-autocomplete {
    box-shadow: 0 2px 7px #e1e1e1;
    width: 100% !important;
}

    .tab-confirm ul.ui-autocomplete li {
        padding: 2px;
        border-bottom: 1px solid #e1e1e1;
    }

   .tab-confirm ul.ui-autocomplete li.manual-address-item {
       margin: 2px;
       font-size: 12px;
   }

        .tab-confirm ul.ui-autocomplete li a {
            padding: 3px 1px 3px 6px;
        }

            .tab-confirm ul.ui-autocomplete li a.ui-state-focus {
                background-image: none;
                background-color: #e1e1e1;
                border: none;
                margin: 0 !important;
                color: #3093cc;
                -ms-border-radius: 0;
                border-radius: 0;
            }

/* #endregion */

@media screen and (max-width: 768px) {
    #securityQuestions .gp-label, .gp-label-clear {
        min-width: 140px;
        /*float: left;
        text-align: left;
        margin-top: 10px;*/
    }

    #securityQuestions .gp-field {
        min-width: 270px;
        max-width: 270px;
        /*float: left;*/
    }

    .legalContent {
        display: none !important;
    }
}

@media screen and (max-width: 480px) {

    .verify-block .flex-right {
        width: 100%;
    }

    #securityQuestions .gp-label {
        min-width: 100%;
    }

    #securityQuestions .gp-label-clear {
        display: none;
    }

    #securityQuestions .gp-field {
        min-width: 100% !important;
    }

    #securityQuestions select {
        display: block !important;
    }

    #securityQuestions a.selectBox {
        display: none !important;
    }

    .sxui input[type=text], .sxui input[type=password], .selectBox {
        width: 100%;
    }

    .success-watermark {
        margin-right: 6px;
    }

    .responsive .sxui .agree p {
        float: left;
        width: 85%;
        margin: 3px 0 0 6px;
    }

    .first {
        /*width: 100%;*/
        margin: 3px;
    }

    .empty {
        display: none;
    }
}
/*#endregion*/

p span {
    margin-right: 2px;
}

div.gp-label span {
    margin-right: 2px;
}

.sxui .cardnumber-container .tooltip-icon {
    margin-top: 7px!important;
    float: left;
}

.sxui .step-left-200px .flex-left {
    width: 200px;
}

.rb-identify {
    position: relative;
    top: 3px;
    float: left;
}

.thin {
    margin-bottom: 0px !important;
}

.thick {
    margin-top: 20px !important;
}

.text-field-margins {
    margin-right: 3px;
    margin-left: 0px !important;
}

.phone-container .left-col {
    float: left;
    width: 30%;
    max-width: 75px;
    margin-right: 10px;
}

.phone-container .right-col {
    float: left;
    width: 68%;
    max-width: 235px;
}

@media screen and (max-width: 768px) {

    /*.sxui .step-left-200px .flex-left {
    width: 100%;
}*/

    .responsive #accordion h3 {
        display: block;
    }

    .responsive #verifyDetailsTabs {
        display: none!important;
    }

    /*#region Accordion */

    .tabbedAccordion h3 span.icon {
        padding-left: 50px;
        width: 140px;
        vertical-align: middle;
        line-height: 42px;
        /*color: #3093cc!important;*/
    }

    /*.responsive div.tabbedAccordion h3.ui-accordion-header-active {
        color: #3093cc;
        background: #ffffff !important;
        border-bottom: 1px solid #e5e5e5!important;
        margin-bottom: 5px!important;
    }

    .responsive div.tabbedAccordion div.ui-accordion-content {
        margin-top: 0px!important;
        border-top: 1px solid #e5e5e5!important;
    }*/

    /*#endregion*/
}

.dialog {
    text-align: center;
    margin: 10px;
    height: 90px !important;
}

.flex-right p.error {
    float: none !important;
}

@media screen and (max-width: 480px) {

    .mob-w90p { width: 90%;}

    .ui-tooltip {
        width: 150px !important;
    }
    .flex-right .textfield {
        margin-bottom: 18px;
    }

    .flex-right .txtCardPart {
        margin-bottom: 0 !important;
    }

    div.buttonsLocation {
        margin-top: 2px;
    }

    #verifyView .div.buttonsLocation {
        margin-top: 20px;
    }

    .empty {
        display: none;
    }

    .sxui input[type=text], .sxui input[type=password] {
        width: 100%;
    }

    .responsive .sxui .flex-left {
        float: left;
        width: 100%;
    }

    .responsive .sxui input[type=text], .sxui input[type=password] {
        width: 100%;
    }

    .responsive .sxui .sx-tab-block {
        padding: 10px;
    }

    .phone-container .left-col {
        float: left;
        width: 30%;
    }

    .phone-container .right-col {
        float: left;
        width: 63%;
        overflow: hidden;
    }

        .phone-container .right-col input {
            width: 100%;
            margin-left: 0px;
        }

    .sxui .cardnumber-container input[type="text"] {
        width: 23% !important;
        margin-right: 5px;
        margin-left: 0px !important;
    }

    .tooltip-mobile {
        display: inline-block !important;
    }

    .tooltip-desktop {
        display: none !important;
    }

    div.questionDropDownRow select {
        display: block !important;
        width: 100% !important;
    }

    div.questionDropDownRow a.selectBox {
        display: none !important;
    }

    /*.questionDropDownRow .flex-left { margin-bottom: 5px;}*/

    .mg-btm-10px-mob {
        margin-bottom: 10px;
    }

    .mob-block { display: block;margin-top: 30px;}

    .sxui .cardnumber-container input[type="text"] {
        margin-right: 2px;
    }

    .find-address-holder {
        width: 100%;
    }

    .btn-find-address { width: 100%;margin-top: 7px!important;text-align: center;}

    .dnnFormPopup { width: 97% !important;}
}

.attempts-error {
    width: 100%;
    height: 100%;
    background: none repeat scroll 0% 0% #FFF;
    text-align: center !important;
    vertical-align: central !important;
    border: 1px solid #d3d3d3;
    min-height: 120px;
    line-height: 120px;
}



@media all and (min-width: 481px) {
    .tooltip-mobile {
        display: none !important;
    }

    .tooltip-desktop {
        display: inline-block !important;
    }

    .sxui .cardnumber-container input[type="text"] {
        width: 58px !important;
        margin-right: 5px;
        margin-left: 0px !important;
    }
}

