.pwd-reset-box {
margin-top: 5%;
overflow: auto;
width: 100%;
max-width: 600px;
-webkit-overflow-scrolling: touch;
border: 1px solid #cfcfcf;
display: inline-block;
padding: 15px;
text-align: left;
}

.pwd-reset-box .outputmsg_error {
display: block;
}

.pwd-notification-box {
overflow: auto;
width: 100%;
max-width: 600px;
-webkit-overflow-scrolling: touch;
border: 1px solid #cfcfcf;
display: inline-block;
padding-left: 10px;
padding-right: 10px;
padding-bottom: 50px;
padding-top: 50px;
margin-top: 5%;
text-align: center;
}

.pwd-page-box {
padding: 15px;
}

.pwd-change-box {
overflow: auto;
width: 600px;
-webkit-overflow-scrolling: touch;
border: 0px solid #cfcfcf;
display: inline-block;
padding: 10px;
text-align: left;
}


.captcha-image {
border: 1px solid #cfcfcf;
margin-right: 20px;
}

.pwd-title {
font-size: 16px;
font-weight: bold;
display: block;
margin-top: 5px;
margin-bottom: 12px;
}

.pwd-subtitle {
font-size: 13px;
display: block;
margin-bottom: 15px;
}

/* can probably remove pwd-section-title and subtitle if we change the enrollment page to a 'wizard' */
.pwd-section-title {
font-size: 16px;
font-weight: bold;
display: block;
margin-top: 5px;
margin-bottom: 10px;
padding-left: 5px;
padding-right: 5px;
background-color: #ffffff;
}

.pwd-section-subtitle {
font-size: 13px;
display: block;
margin-bottom: 20px;
}

.pwd-content {
border: 1px inset #cfcfcf;
line-height: 16px;
text-align: left;
margin: 5px;
padding: 5px;
padding-left: 20px ;
display: inline-block;
}

.pwd-additional-info {
margin-top: 10px;
/*display: inline-block;*/
}

.pwd-request-reference {
font-size: 130%;
font-weight: bold;
padding-left: 5px;
}

#new_password {
background-color:#e6e8ea;
border-style:groove;
font-size: 24px;
width:200px;
margin-left: auto;
margin-right: auto;
}

.pwd-enroll-box {
overflow: auto;
width: 100%;
-webkit-overflow-scrolling: touch;
border: 0px solid #cfcfcf;
display: inline-block;
padding: 10px;
text-align: left;
}

.pwd-enroll-section {
display: inline-block;
padding-bottom: 20px;
width: 100%;
}

.pwd-bottom-btn-bar {
margin-top: 20px;
margin-bottom: 20px;
}

.pwd-icon {
font-size: 42px;
margin-bottom: 20px;
display: inline-block;
}

.pwd-icon-small {
font-size: 12px;
margin-bottom: 0px;
display: inline-block;
}

.pwd-icon-success {
color: #71e279;
}

.pwd-icon-error {
color: #f95050;
}

.pwd-enroll-sms-devices tr {
border: 0px;
height: 36px;
}

.pwd-enroll-sms-devices th {
padding-left:10px;
padding-right:10px;
vertical-align: center;
border-top: 0px solid #bdc0c4;
border-bottom: 2px solid #bdc0c4;
color: #bdc0c4;
}

.pwd-enroll-sms-devices td {
padding-left:10px;
padding-right:10px;
vertical-align: center;
border-top: 1px solid #bdc0c4;
border-bottom: 1px solid #bdc0c4;
}

.pwd-enroll-sms-name-cell {
text-align: left;
width: 300px
}

.pwd-enroll-sms-country-code-cell {
text-align: left;
width: 300px
}

.pwd-enroll-sms-phone-cell {
text-align: left;
width: 300px
}

.pwd-enroll-sms-provider-cell {
text-align: left;
width: 300px
}

.pwd-add-device-dialog {
width: 500px;
}

.pwd-verify-device-dialog {
width: 500px;
}

.pwd-modal-subtitle {
text-align: left;
}

.pwd-dialog-header {
width: 100%;
font-size: 15px;
font-weight: bold;
margin-bottom: 5px;
padding-top: 5px;
padding-bottom: 5px;
border-bottom: 1px solid #bdc0c4;
display: inline-block;
}

.pwd-dialog-body {
width: 100%;
border-bottom: 0px;
display: inline-block;
}

.pwd-dialog-footer {
width: 100%;
margin-top: 5px;
padding-top: 5px;
padding-bottom: 5px;
display: inline-block;
}

#strength-meter[aria-valuenow="0"] {
background-color: #f95050; /* Same as progress-bar-danger */
}

.progress-bar-dark-green {
background-color: #27be31;
}

.process-breadcrumb > li.disabled {
border-bottom: 0px;
}

.process-breadcrumb > li > a.disabled {
pointer-events: none;
cursor: default;
}

#user_lock_state > i {
margin-right: 10px;
margin-left: 10px;
font-size: 16px;
}

#user_lock_state > i.icon-locked {
color: #f95050;
}

#user_lock_state > i.icon-unlocked {
color: #71e279;
}

#user_lock_state > i.icon-alert {
color: #fc8a3d;
}

#user_lock_state > i.icon-loading {
color: #81878e;
}

.countrycode-dropdown-li {
margin: 2px 2px;
padding: 0 5px;
}

.countrycode-dropdown-li:hover{
cursor: pointer;
}

.countrycode-dropdown-ul{
height: auto;
max-height: 400px;
overflow-x: hidden;
width: 290px;
margin-left: 12.5%;
padding: 15px 15px;
}

.countrycode-dropdown-li:hover, .countrycode-selected{
padding: 0 2px;
border-style: solid;
border-width: 2px;
border-color: #278efc;
}

.captcha-image-container {
padding-bottom: 10px;
}

.pwd-rule-desc {
border-radius: 3px;
border: 1px solid #BDC0C4;
padding: 8px;
margin-bottom: 10px;
box-shadow: 0px 1px 1px rgba(0, 0, 0, 0.075) inset;
}

.required-marker {
margin-left: -7px;
}

#sysverb_send_code {
margin-top: 8px;
margin-bottom: 12px;
}

#captcha_form_group {
margin-top: 15px;
}

.btn-pwd-submit {
float: right;
margin: 10px 0px;
}

#sysverb_unlock_account {
margin-right: 15px;
}

/* Responsive Design styling to improve mobile user experience
550px matches what a lot of heisenberg styles are using for max-width
*/
@media  (max-width: 550px) {

/* Improve vertical alignment of fields and labels on narrow view */
.col-sm-12, .col-sm-3, .col-sm-9, .col-sm-4, .col-sm-8 {
padding-left: 0px;
padding-right: 0px;
}

/* Allow question and asterisk to appear on same line without break */
label {
display: inline;
}

/* ^^ These inline labels have very little space so add some space between label and field */
.form-control {
display: block;
margin-top: 10px;
}

/* For 'Personal data verification' place the radio buttons vertically instead of horizontally */
fieldset > span {
display: block;
margin-top: 10px;
}

#google_captcha {
display: block !important;
}

/* Put captcha box below CAPTCHA label on small screens */
#captcha_form_group > label {
display: block;
}
}

/* Cancel out heisenberg excessive field spacing for $pwd_new */
@media (max-width: 799px) {
.form-group {
margin-bottom: 5px !important;
}
}

/* 600px is arbitrary. Nobody should be using 800x600 desktop resolution anymore */
@media  (max-height: 600px) {

.pwd-reset-box, .pwd-notification-box {
margin-top: 10px;
padding: 10px;
}

#page_timing_div {
display: none;
}

.btn-pwd-submit {
margin: 5px 0px;
}
}

/* Above 550px width the heisenberg stylesheet makes contents of form-group floating, so the form-group element itself
is not aware of their height making it have 0px height which causes padding issues. This fix makes the container
have the correct height */
.form-group {
overflow: hidden;
}

/* Used to show country code dropdown */
.show-overflow {
overflow: visible;
}
