@import '../../css/glyphicons.css';

/* SpeakUp style */

@font-face {
    font-family: 'Lato', sans-serif;
    src: url(../../fonts/Lato-Regular.ttf) format("truetype");
}

html {
    font-size: 10px;
}

body {
    font-family: 'Lato', sans-serif;
    background-color: #f7f7f7;
    font-size: 14px;
}

h1, h2, h3, h4, h5, h6 {
    font-family: 'Lato', sans-serif;
}

.h1, .h2, .h3, h1, h2, h3 {
    margin-top: 20px;
    margin-bottom: 10px;
}

.h1, h1 {
    font-size: 36px;
}

.h2, h2 {
    font-size: 30px;
    color: #326179;
}

.h3, h3 {
    font-size: 24px;
}

p, h3, h5, h6 {
    color: #707176;
}

.alert-info p {
    color: #31708f;
}

p.aside, h4 {
    color: #6390af;
}

input[type="text"], input[type="password"], input[type="email"], textarea {
    border: 1px solid #bbb;
    border-radius: 5px;
    background-color: #fbfbfb;
}

.row-alert .col-12 {
    padding: 0;
}

.web-form-item {
    background-color: #fff;
    border: 1px solid #dadada;
}

.web-buttons .col-sm-12, .web-buttons .col-12 {
    padding: 0;
}

@media screen and (max-width: 450px) {
    .h2, h2 {
        font-size: 28px;
    }
}

@media screen and (max-width: 767px) {
    .web-form-half-left {
        padding: 0;
    }

    .web-form-half-right {
        padding: 0;
    }
}

@media screen and (min-width: 768px) {
    .web-form-half-left {
        padding: 0 15px 0 0;
    }

    .web-form-half-right {
        padding: 0 0 0 15px;
    }
}

/* Outlines Chrome */

textarea:focus {
    outline: -webkit-focus-ring-color auto 0 !important;
}

input:focus {
    outline: -webkit-focus-ring-color auto 0 !important;
}

/* Text direction */

.rtl {
    direction: rtl;
}

.ltr {
    direction: ltr;
}

.justify {
    text-align: justify;
}

/* Buttons */

.btn {
    padding: 6px 12px !important;
}

.btn-primary {
    background-color: #326179;
    border: 0 !important;
    box-shadow: none !important;
}

.btn-primary:hover {
    background-color: #6390af;
}

.btn-primary:active {
    background-color: #6390af !important;
}

.btn-primary:focus {
    background-color: #6390af;
}

.btn-primary:disabled {
    background-color: #6390af;
}

.btn-primary:active {
    background-color: #6390af;
    border: 1px solid #6390af;
}

.btn-primary:visited {

}

.btn-link {
    color: #f0896e;
}

.btn-link:hover {
}

.btn-link:visited {
}

.btn.btn-default {
    color: #333;
    background-color: #fff;
    border-color: #ccc;
}

.btn.btn-default:hover {
    background-color: #e6e6e6;
    border-color: #adadad;
}

.web-buttons .row {
    margin-top: 40px;
    margin-bottom: 5px;
}

.button-icon span {
    margin-top: 4px;
}

.button-icon-left {
    margin-right: 20px;
}

.web-buttons .button-icon-left {
    margin-bottom: 5px;
}

.button-icon-right {
    margin-left: 20px;
}

.web-buttons .button-icon-right {
    margin-bottom: 5px;
}

.button-icon-left span {
    float: left;
}

.button-icon-right span {
    float: right;
}

.button-icon, .web-buttons .button-icon {
    font-size: 2.0rem;
    text-align: left;
    float: left;
}

.button-icon-log-out, .button-icon-log-out:visited {
    color: #ec6f57;
    font-weight: bold;
}

.button-icon-log-out:hover {
    color: #ec6f57;
}

.web-title .button-icon-log-out {
    font-weight: inherit;
    font-size: 1.8rem;
    margin-top: 2px;
}

button .glyphicon-send {
    margin-left: 10px;
}

button .glyphicon-log-out {
    margin-left: 10px;
}

button .glyphicon-menu-left {
    margin-right: 5px;
}

button .glyphicon-menu-right {
    margin-left: 5px;
}

button .glyphicon-print {
    margin-left: 5px;
}

/* Web header */

.web-header {
    padding-bottom: 20px;
    background-color: #fff;
}

.web-header img {
    margin-top: 15px;
    max-height: 50px;
    float: right;
    clear: none;
}

.web-header img.web-header-speakup-logo {
    max-height: 75px;
    float: left;
}

.web-header img.web-header-client-logo {
    max-height: 75px;
    float: right;
}

.web-title {
    background-color: #326179;
    min-height: 60px;
    padding-top: 8px;
    padding-bottom: 8px;
}

/* Headings */

.blue-heading {
    margin: 0 -15px;
    background-color: #326179;
    padding: 5px 15px;
    margin-bottom: 10px;
}

.blue-heading h2, .blue-heading h3 {
    color: #fff;
    margin-top: 10px;
}

/* Web form */

.web-form {
    padding-top: 10px;
    padding-bottom: 60px;
}

.web-form p {
    font-size: 2.5rem;
}

.web-form .row {
    margin-top: 10px;
}

.web-form-container {
    /*border: 1px solid red;*/
}

/* Sticky footer */

html {
    position: relative;
    min-height: 100%;
}

body {
    margin-bottom: 75px;
}

.container {
    width: auto;
    max-width: 1024px;
    padding: 0 15px;
}

.homepage div, .homepage p, .homepage span, .homepage a, .homepage {
    font-size: 1.9rem;
}

.footer {
    position: absolute;
    bottom: 0;
    width: 100%;
    min-height: 80px;
    background-color: #f1f1f1;
    text-align: center;
    border: 1px solid #dadada;
}

.footer .aside {
    /*color: #fff;*/
    color: #326179;
    margin: 15px 0;
}

.footer .aside a {
    color: inherit;
}

@media screen and (max-width: 480px) {
    body {
        margin-bottom: 90px;
    }

    .footer {
        min-height: 90px;
    }
}

/* Alerts */
.alert {
    font-size: 1.8rem;
    padding: 15px;
}

.alert span {
    margin-right: 6px;
}

.rtl .alert span {
    margin-right: 0;
    margin-left: 6px;
}

.alert span.error {
    word-wrap: break-word;
}

/* Country selector */

#select-country .homepage {
    margin-bottom: 20px;
}

.header_select_country {
    /*width: 660px;*/
    /*margin-left: auto;*/
    /*margin-right: auto;*/
    /*margin-bottom: -20px;*/
    /*padding-top: 5px;*/
    /*padding-bottom: 5px;*/
}

#country-selector {
    width: 100%;
    height: 35px;
    padding-left: 32px;
    color: #444;
    font-weight: bold;
    background-image: url('flags/search.png');
    background-repeat: no-repeat;
    background-position: 8px 10px;
    box-sizing: border-box;
    border: 1px solid #6390af;
}

.header_select_country input[type=text]::-ms-clear {
    display: none;
}

input#country-selector::-webkit-input-placeholder {
    color: #808080 !important;
}

input#country-selector:-moz-placeholder { /* Firefox 18- */
    color: #808080 !important;
}

input#country-selector::-moz-placeholder { /* Firefox 19+ */
    color: #808080 !important;
}

input#country-selector:-ms-input-placeholder {
    color: #808080;
}

.header_select_country button#btn-open-country {
    min-width: 100%;
    height: 35px;
    float: right;
    margin: 0;
    vertical-align: middle;
    color: #ffffff;
    font-weight: bold;
    background-color: #326179;
    border: 1px solid #6390af;
    -moz-border-radius: 0;
    -webkit-border-radius: 0;
    padding: 0;
}

.header_select_country button#btn-open-country:disabled {
    background-color: #dfdbcd;
    border: 1px solid #c0c0c0;
    color: #a0a0a0;
}

/* Country list */
#select-country-container {
    background-color: #fff;
    border: 1px solid #dadada;
    padding-bottom: 10px;
}

#country_list {
    vertical-align: top;
}

#country_list div {
    border: 1px dotted #ccc;
    margin: 2px 2px;
    height: 19px;
    /*width: 156px;*/
}

#country_list div a {
    font: bold 11px arial, sans-serif;
    color: #777;
    text-decoration: none;
    margin-left: 4px;
    padding-left: 20px;
    line-height: 17px;
    background-repeat: no-repeat;
}

#country_list div a:hover, #country_list div a:active {
    color: #77f;
    text-decoration: underline;
}

#country-list-container {
    /*width: 620px;*/
    height: 350px;
    display: table;
    padding: 15px 10px;
    margin: 0 auto;
}

/*#country-list-container > div.row {*/
/*display: table-row;*/
/*text-align: center;*/
/*}*/

/*#country-list-container > div.row > div {*/
/*display: table-cell;*/
/*box-sizing: border-box;*/
/*margin: 0;*/
/*padding: 0;*/
/*text-align: left;*/
/*}*/

.country-selector-item {
    margin: 5px;
    padding: 5px;
}

.country-selector-item a:link, .country-selector-item a:visited {
    color: #777;
    font-weight: bold;
}

.country-selector-item a:hover, .country-selector-item a:active {
    color: #77f;
    text-decoration: underline;
}

.country-selector-item img.country-flag {
    margin-right: 15px;
}

.country-name {
    float: left;
    margin: 0;
    margin-left: 10px;
}

/* Select Language */

#select-language #select-language-row p {
    line-height: 4.5rem;
    margin: 0;
}

#select-language .web-buttons button {
    margin-right: 10px;
}

#select-language .language-row .col-12 {
    padding: 0;
}

#select-language .web-form-item {
    padding-bottom: 10px;
}

#select-language .web-form p {
    margin: 3px 0;
}

#select-language .btn-primary {
    min-width: 180px;
}

@media screen and (max-width: 767px) {
    .language-button {
        float: right;
    }
}

/* Custom page */

#custom-page .homepage {
    margin-bottom: 20px;
    background-color: #fff;
    padding: 15px 0;
    border: 1px solid #dadada;
}

#custom-page .web-form-item {
    padding-bottom: 20px;
    min-height: 260px;
}

#custom-page .web-form-item .web-buttons {
    position: absolute;
    bottom: 20px;
    right: 20px;
    left: 20px;
}

#custom-page p {
    font-size: 1.9rem;
    color: #333;
}

#custom-page .custom-action-text {
    margin-bottom: 55px;
}

/* Access code */

#header_access_code {
    text-align: center;
    background-color: white;
    border: 1px solid #555;
    width: 660px;
    margin-left: auto;
    margin-right: auto;
    margin-bottom: -20px;
    padding-top: 5px;
    padding-bottom: 5px;
    display: none;
}

/* Enter access code page */

.web-form-container .row {
    margin-left: 0;
    margin-right: 0;
}

#enter-access-code .homepage {
    margin-bottom: 20px;
    padding: 15px 0;
}

#accesscode-img-container {
    margin-left: 0;
}

#enter-access-code .phone-instruction p span {
    margin: 0 8px 0 0;
}

#enter-access-code .rtl .phone-instruction p span {
    margin: 0 0 0 8px;
}

#img-accesscode-phone {
    display: inline-block;
}

#enter-access-code p, #enter-access-code li {
    font-size: 2.6rem;
}

#enter-access-code .web-instructions input {
    width: 100%;
    line-height: 36px;
    font-size: 24px;
    padding: 6px 10px 6px 10px;
    /*text-align: center;*/
    /*margin-left: auto;*/
    /*margin-right: auto;*/
    margin: 6px auto 6px auto;
}

#enter-access-code .instructions-container {
    /*display: table-row;*/
    /*width: 100%;*/
}

#enter-access-code .web-instructions, #enter-access-code .phone-instructions {
    padding-bottom: 10px;
}

#enter-access-code .alert {
    margin-top: 20px;
}

#enter-access-code .with-phone-instructions .web-instructions-inner {
    min-height: 370px;
    padding-bottom: 20px;
}

#enter-access-code .without-phone-instructions .web-instructions-inner {
    padding-bottom: 20px;
    margin-top: -25px;
}

#enter-access-code .phone-instructions-inner {
    min-height: 370px;
    padding-bottom: 20px;
}

#enter-access-code .phone-instructions {
    padding: 15px 0;
}

#enter-access-code .web-instructions {
    /*padding: 15px 0;*/
    padding: 0;
}

#enter-access-code .without-phone-instructions input {
    max-width: 600px;
}

#enter-access-code .phone-instruction p {
    margin: 0 0 10px 30px;
    color: #333;
}

#enter-access-code .phone-instruction li {
    margin: 0 0 10px 20px;
    color: #333;
}

#enter-access-code .phone-instruction p.phone-instruction-text {
    color: #707176;
}

span.icon-security-key {
    position: relative;
    top: 1px;
    display: inline-block;
    /*background-image: url('key24x24.png');*/
    background-size: 24px 24px;
    width: 24px;
    height: 24px;
}

@media screen and (min-width: 768px) {

    #enter-access-code .web-instructions, #enter-access-code .phone-instructions {
        /*min-height: 320px;*/
        /*border-right: 3px solid #d0d0d0;*/
        border-top: none;
        border-bottom: none;
        /*padding: 0;*/
    }

    #enter-access-code .phone-instructions {
        padding: 0 0 0 10px;
    }

    #enter-access-code .with-phone-instructions {
        padding: 0 10px 0 0;
    }

}

#enter-access-code .phone-instructions {
    /*text-align: left;*/
    /*padding: 8px 12px 8px 12px;*/
}

/* Enter case number */

#enter-case-number .web-form-item, #enter-case-password .web-form-item {
    padding-bottom: 20px;
}

#enter-case-number .alert {
    margin-bottom: 10px;
}

#enter-case-number .checkbox {
    margin-top: 5px;
}

/* Select task */
#select-task .select-task-container .select-task-img img {
    margin-left: auto;
    margin-right: auto;
    width: 210px;
}

#select-task .select-task-container .select-task-label {
    text-align: center;
    font-size: 2.5rem;
    min-height: 71px;
}

#select-task .select-task-container .select-task-button {
    display: block;
    margin-left: auto;
    margin-right: auto;
    margin-top: 20px;
    text-align: center;
}

#select-task .web-form-item {
    padding-bottom: 20px;
}

#select-task .web-form-half-left, #select-task .web-form-half-right {
    margin-top: -10px;
}

#select-task .button-icon {
    float: none;
}

#select-task .select-task-button .float-right {
    float: none !important;
}

.select-task-img {
    padding-top: 10px;
    margin-bottom: 10px;
    margin-top: 20px;
}

.task-existing-case {
    /*padding-bottom: 10px;*/
    padding: 15px 0;
}

.task-existing-case-inner {
    min-height: 275px;
}

.task-new-message {
    padding-bottom: 10px;
    padding: 15px 0;
}

.task-new-message-inner {
    min-height: 275px;
}

@media (min-width: 1400px) and (max-width: 1699px) {
    #select-task .web-form-item {
        padding: 0 50px 20px 50px;
    }
}

@media (min-width: 1700px) {
    #select-task .web-form-item {
        padding: 0 100px 20px 100px;
    }
}

@media screen and (min-width: 768px) {

    .task-existing-case {
        /*padding-bottom: 10px;*/
        padding: 0 10px 0 0;
    }

    .task-new-message {
        padding-bottom: 10px;
        padding: 0 0 0 15px;
    }

}

@media screen and (max-width: 767px) {

    #select-task .web-form-container .select-task-container {
        margin-top: -10px;
    }

    .web-form-item {
        margin-top: 20px;
    }
}

@media print {
    body {
        margin-bottom: 0;
    }
}

/* New message */

#new-case .homepage {
    margin-bottom: 20px;
    background-color: #fff;
    padding: 15px 0;
    border: 1px solid #dadada;
}

#new-case .alert {
    margin-top: 20px;
    border: 1px solid #dadada;
}

.message-form {
    margin-top: 20px !important;
}

#add_attachment {
    margin-top: 5px;
}

.attachments {
    margin: 0;
}

.single-attachment {
    font-size: 1.6rem;
    display: block;
    margin-right: 20px;
    margin-bottom: 5px;
}

.rtl .single-attachment {
    margin-right: 0;
    margin-left: 20px;
}

.single-attachment button {
    margin-left: 2px;
}

.new-message textarea {
    width: 100%;
    padding: 5px 10px;
    font-size: 1.7rem;
    border-radius: 0;
}

.message-form .col-12 {
    padding: 0;
}

#new-case .form-group {
    font-size: 1.5rem;
}

#new-case .web-buttons {
    margin-top: -10px;
}

#new-case .web-buttons button {
    margin-top: 10px;
}

#new-case .attachments .col-12, #new-case .message-text .col-12 {
    padding: 0;
}

#new-case .web-form .thread-message .attachments {
    border-top: none;
}

#new-case .web-form .attachments-inner-right {
    margin-left: 50px;
}

.web-form .thread-message .message-icon {
    position: absolute;
    margin-left: 0;
    width: 45px;
    height: 100%;
    background-color: #bed0da;
    border-right: 1px solid #778899;
}

.web-form .attachments-inner-left {
    position: absolute;
    margin-left: 0;
    width: 45px;
    height: 100%;
    background-color: #bed0da;
    border-right: 1px solid #778899;
}

.web-form .glyphicon-file {
    top: 3px;
}

#new-case .web-form .attachments-inner-right, #edit-case .web-form .attachments-inner-right {
    display: inline-block;
    margin-left: 50px;
    margin-bottom: 5px;
    margin-top: 5px;
}

#new-case .web-form .attachments-inner-right.rtl, #edit-case .web-form .attachments-inner-right.rtl {
    margin-right: 5px;
    float: right;
}

/* Edit case */

#edit-case .web-form .attachments-inner-right {
    margin-left: 50px;
}

#edit-case .web-form .thread-message .attachments {
    border-top: 0;
}

/* Attach file */

#attach-file .homepage {
    margin-bottom: 20px;
    margin-top: 20px;
    background-color: #fff;
    padding: 15px 0;
    border: 1px solid #dadada;
}

/* Roundup page */
p.case-number {
    /*margin-top: 15px;*/
    margin-bottom: 15px;
    padding: 10px;
    background: #f5860f;
    text-align: center;
    color: black;
}

@media (min-width: 1100px) {
    p.case-number {
        font-size: 2.5em;
    }
}

@media (max-width: 1100px) {
    p.case-number {
        font-size: 1.2em;
    }
}

.message-posted-notice {
    margin-bottom: 0;
}

.message-thread-container {
    margin: 0;
    border: 1px solid #dadada;
    background-color: #fff;
    padding: 10px 20px 10px 20px;
}

.speakup-message h2 {
    font-size: 1.9rem;
}

.speakup-message p {
    font-size: 1.9rem;
}

#roundup .homepage {
    margin-bottom: 20px;
    margin-top: 0;
    background-color: #fff;
    padding: 15px 0;
    border: 1px solid #dadada;
}

.case-property {
    background-color: #fff;
    padding: 15px 0;
    border: 1px solid #dadada;
}

.case-property select {
    font-size: 1.9rem;
    height: 1.9em;
}

.case-property label, .case-property span {
    margin: 0;
    line-height: 34px;
    font-size: 1.9rem;
}

.message-text-inner {
    margin-left: 45px;
    padding: 10px 15px;
}

.attachment-single {
    font-size: 1.4rem;
    padding: 10px 15px;
    display: inline-block;
}

/* View response */

#view-response .homepage {
    background-color: #fff;
    padding: 15px 0;
    border: 1px solid #dadada;
}

#view-response .web-form .attachments-inner-right {
    margin-bottom: 0;
    margin-top: 0;
}

.message-thread-container {
    font-size: 1.6rem;
    margin-top: 10px;
}

.web-form .attachments-inner-right {
    margin-left: 45px;
}

.web-form .thread-navigation {
    margin: -1px -15px 0 -15px;
    border: 1px solid #778899;
}

.web-form .thread-navigation .header-container {
    background-color: #fff;
    margin: 0;
}

.web-form .thread-navigation .header-container > div {
    padding: 0;
}

.web-form .thread-navigation .message-header,
.web-form .thread-navigation .message-icon,
.web-form .thread-navigation .message-date {
    padding: 10px 15px 0 5px;
    display: inline;
    float: left;
}

.web-form .thread-navigation .message-icon {
    padding: 0;
    margin-bottom: -15px;
    clear: none;
}

.web-form .thread-navigation .message-header-text {
    margin-left: 20px;
}

.web-form .thread-navigation.messenger .message-icon {
    color: #6390af;
}

.web-form .thread-navigation.company .message-icon {
    color: #f0896e;
}

.web-form .thread-navigation .message-header {
    /*margin-top: 10px;*/
    font-weight: bold;
    clear: right;
}

.web-form .thread-navigation .message-date {
    /*display: block;*/
    padding-top: 5px;
    padding-left: 15px;
    padding-bottom: 10px;
    clear: left;
}

.web-form .thread-message {
    margin: -1px -15px 10px 0;
    border: 1px solid #778899;
    background-color: #d9edf7;
}

.web-form .thread-message.new-message {
    background-color: #fff;
    width: 100%;
}

.web-form .thread-message .header-container {
    border-top-left-radius: 4px;
    border-top-right-radius: 4px;
    background-color: #fff;
    margin: 0;
}

.web-form .thread-message .message-header,
.web-form .thread-message .message-icon,
.web-form .thread-message .message-date {
    padding: 10px 15px 10px 15px;
    /*display: inline;*/
    clear: none;
}

.web-form .thread-message .message-icon {
    /*margin: 0 0 0 -15px;*/
    border-right: 1px solid #778899;
    /*float: left;*/
}

.web-form .thread-message.messenger .message-icon {
    background-color: #bed0da;
}

.web-form .thread-message.company .message-icon {
    background-color: #f0896e;
}

.web-form .thread-message .message-header, .web-form .thread-message .message-date.rtl {
    float: left;
    margin-left: 45px;
}

.web-form .thread-message .message-date, .web-form .thread-message .message-header.rtl {
    float: right;
    margin-left: 0;
}

.web-form .thread-message .attachments {
    margin: 0;
    border-top: 1px solid #778899;
}

.web-form .thread-message .message-text {
    border-top: 1px solid #778899;
    margin: 0;
    /*padding: 10px 15px 10px 15px;*/
    border-bottom-left-radius: 4px;
    border-bottom-right-radius: 4px;
}

.web-form .thread-message .message-text .col-12 {
    padding: 0;
}

.web-form .thread-message .col-12 {
    padding: 0;
}

.web-form .message-inner {
    margin-left: 45px;
}

.web-form .message-inner textarea {
    border: 0;
    border-radius: 0;
    background-color: #fff;
    margin-bottom: -6px;
}

.web-form .message-inner textarea::placeholder {
    font-weight: bold;
}

.web-form .message-inner textarea::-webkit-input-placeholder {
    font-weight: bold;
}

.web-form .message-inner textarea:-moz-placeholder {
    font-weight: bold;
}

.web-form .message-inner textarea::-moz-placeholder {
    font-weight: bold;
}

.web-form .message-inner textarea:-ms-input-placeholder {
    font-weight: bold;
}

/* Choose password */

#choose-password .homepage {
    background-color: #fff;
    padding: 15px 0;
    border: 1px solid #dadada;
}

#choose-password .web-form-item {
    padding-bottom: 20px;
}

#choose-password .alert {
    margin-bottom: 10px;
}

#choose-password .checkbox {
    margin-top: 5px;
}

/* password entry */

.password-entry input[type="text"], .password-entry input[type="password"] {
    line-height: 36px;
    font-size: 24px;
    padding: 2px 10px 2px 10px;
    margin: 6px auto 6px auto;
    max-width: 88%; /* leave some space for the info icon */
}

.password-entry .glyphicon-info-sign {
    font-size: 25px;
    margin-left: 1px;
    color: #000;
}

.password-entry .info-button {
    display: inline-block;
    height: 25px;
    vertical-align: sub;
}

.password-entry .col-12 {
    padding: 0;
}

/* Privacy statement */
#privacy_statement_link {
    color: #555;
    text-decoration: none;
}

#client_privacy_statement {
    color: #555;
    text-decoration: none;
}

#privacy_statement_link:hover {
    text-decoration: underline;
    cursor: pointer;
}

#client_privacy_statement:hover {
    text-decoration: underline;
    cursor: pointer;
}

#privacy_statement {
    text-align: left;
    background: url(logo-150.png) center bottom no-repeat;
}

#privacy_statement h1, #privacy_statement h2, #privacy_statement p, #privacy_statement a {
    font-family: Calibri, Verdana, sans-serif;
    font-weight: normal;
}

#privacy_statement h1 {
    font-size: 2.2em;
    text-transform: uppercase;
    color: #666;
    text-align: center;
    margin-bottom: 18px;
}

#privacy_statement h2 {
    font-size: 1.8em;
    color: #c35d09;
    margin-top: 30px;
}

#privacy_statement p {
    font-size: 1.2em;
}

#privacy_statement a {
    font-size: 1em;
}

/* Logout Screen*/
.logout-message-container {
    min-height: 370px;
    padding: 0 15px 5px 15px;
}

.logout-message-container .logout-container-logo {
    width: 124px;
    margin: 0 auto 15px;
}

.logout-message-container .logout-container-text {
    margin-bottom: 100px;
}

/* Web Error Screen*/
.error-message-container {
    min-height: 370px;
    padding: 0 15px 5px 15px;
}

.error-message-container .error-container-logo {
    width: 124px;
    margin: 0 auto 15px;
}

.error-message-container .error-container-text {
    margin-bottom: 100px;
}

/* Client logo

#header_client_logo {
    width: 200px;
}

#header_client_logo > img{
    width: inherit;
}
 */
/* Web header
.web_header {
    width: 660px;
    margin: 40px 0 40px 70px;
    padding: 0;
    overflow: auto;
}

.web_header > div {
    display: table-cell;
    vertical-align: top;
    height: 100%;
}

.web_area_3 > div {
    margin: 5px;
}

.web_area_3 h2 {
    text-align: left;
    font: bold 16px arial, sans-serif;
    color: #555;
    line-height: 20px;
}

.web_area {
    min-height: 260px;
    height:100%;
    margin: 4px;
    padding: 0;
}

.web_area.bordered {
    border: 1px solid #ccc;
}

.web_area.bordered > h3, .web_area.bordered > h2 {
    border-bottom: 1px solid #ccc;
    padding: 8px;
    line-height: 1.6em;
}

.web_area.half {
    width: 48%;
    float:left;
}

.web_area.half.right {
    float: right;
}

.web_area_content {
    margin: 20px 5px 5px 5px;
    min-height: 120px;
}


.top_buttons {
    padding: 4px 0;
    margin: 0;
    float: left;
}

.bottom_buttons {
    padding: 0;
    margin: 0;
    float: right;
    overflow: auto;
    clear: left;
}
*/
/*
 *  WIZARD SCREENS
h2 {
    margin: 4px 0;;
}

.web_area_2 h2, .web_pane_language {
    text-align: left;
    font: bold 16px arial, sans-serif;
    color: #555;
    line-height: 20px;
}

.web_pane {
    text-align: left;
    width: 548px;
    margin: 60px 50px 90px 50px;
    padding-left: 40px;
    background: #fff;
    overflow: auto;
    display: block;
}

.web_pane_split {
    text-align: left;
    margin: 0 0 0 0;
    background: #fff;
    overflow: auto;
    display: block;
}

.web_pane_row {
    width: 100%;
    margin: 3px 0;
    overflow: auto;
    display: block;
}

.web_pane_language div {
    margin-left: 20px;
}

.web_pane_language {
    text-align: center;
    width: 200px;
    margin: 2px 17px;
    padding: 0;
    overflow: auto;
}


.web_case_nr_left, .web_case_nr_right {
    font: bold 24px arial, sans-serif;
    color: #555;
    line-height: 30px;
    background: #fff;
    border: 1px solid #777;
    margin: 0;
    padding: 6px 10px;
    float: left;
}

.web_case_nr_number {
    font: bold 30px arial, sans-serif;
    color: #fff;
    line-height: 30px;
    background: #e74a20;
    border: 0;
    border-top: 1px solid #777;
    border-bottom: 1px solid #777;
    width: 128px;
    margin: 0;
    padding: 6px 10px;
    float: left;
}

.web_case_nr_left {
    text-align: left;
    width: 275px;
}

.web_case_nr_right {
    text-align: right;
    width: 305px;
}

.web_case_nr_number {
    text-align: center;
}

div#web_password span {
    font: bold 30px arial, sans-serif;
    color: #fff;
    line-height: 30px;
    background: #e74a20;
    border: 0;
    border-top: 1px solid #777;
    border-bottom: 1px solid #777;
    width: 128px;
    margin: 0;
    padding: 6px 10px;
    float: left;
}

span.pwp_warning, span.pwp_warning a {
    font-weight: bold;
    color: #ff4444;
    padding: 3px 4px;
    margin: 2px 0;
    line-height: 14px;
    float: left;
    clear: none;
}

.web_pane input.ui-corner-all, .web_pane input[type="text"], .web_pane input[type="password"] {
    border: 1px solid #aaa;
    -moz-border-radius: 2px;
    -khtml-border-radius: 2px;
    -webkit-border-radius: 2px;
    border-radius: 2px;
    float: left;
    clear: none;
}

.web_pane h2 {
    margin: 4px 4px;
}

.web_pane input {
    margin: 2px 5px 2px 5px;
}

.web_pane span {
    margin: 2px 5px 2px 0;
}

.web_pane input.correct {
    border: 1px solid rgba(32, 170, 73, 1);
    box-shadow: 0 0 5px rgba(32, 170, 73, 1);
}

.clear_none, .clear_none input, .clear_none span {
    float: left;
    clear: none;
    margin-right: 5px;
}

.clear_left {
    float: left;
    clear: left;
    margin-right: 5px;
}

.checkbox_label {
    line-height: 18px;
}

.password_strength_label_green, .password_strength_label_orange, .password_strength_label_red {
    font-weight: bold;
    font-size: 13px;
}

.password_strength_label_green {
    color: #2B9B22;
}

.password_strength_label_orange {
    color: #F7BD00;
}

.password_strength_label_red {
    color: #CA2316;
}

.case_password {
    text-align: justify;
    line-height: 18px;
    border: 1px solid #777;
    background: #fff;
    overflow: auto;
}

.case_password h2 {
    font: bold 24px arial, sans-serif;
    color: #555;
    line-height: 30px;
    background: #fff;
    margin: 6px 10px;
    float: left;
    clear: left;
    text-align: left;
    width: 275px;
}

#password_hint_label {
    float: left;
    clear: left;
    margin: 6px 10px;
    width: 275px;
}

#password_hint_value {
    float: left;
    clear: none;
    margin: 2px 10px;
}

.case_password .case_password_input {
    margin: 16px 6px 4px 6px;
    float: left;
    clear: none;
}

.case_password .case_password_show_password {
    margin: 14px 6px 2px 6px;
    float: left;
    clear: none;
}

.case_password .case_password_show_password input {
    margin-bottom: 0;
    padding: 0;
    float: left;
    clear: none;
}

.case_password .case_password_show_password span {
    margin-top: 2px;
    padding: 0;
    float: left;
    clear: none;
}

div.web_pane_split > div.buttons {
    margin-left: 70px;
    bottom: 0;
}

 */

.password_strength_label_green, .password_strength_label_orange, .password_strength_label_red {
    font-weight: bold;
    font-size: 13px;
}

.password_strength_label_green {
    color: #2B9B22;
}

.password_strength_label_orange {
    color: #F7BD00;
}

.password_strength_label_red {
    color: #CA2316;
}

.ui-combobox-input {
    line-height: 1.5em;
}

.ui-combobox .ui-button {
    height: 2.2em;
    background: #326179;
    position: absolute;
}

.ui-combobox .ui-icon {
    background-image: url(../../css/images/ui-icons_ffffff_256x240.png);
}

.ui-combobox {
    width: 100%;
}

.ui-combobox .ui-widget {
    font-size: inherit;
}

.ui-combobox .ui-combobox-input {
    width: 80%;
    min-width: 0;
}

@media (max-width: 400px) {
    .ui-combobox .ui-combobox-input {
        width: 200px;
    }
}


.card {
    margin-bottom: 20px;
    margin-top: 0;
    background-color: #fff;
    padding: 2rem;
    border: 1px solid #dadada;
}

input.form-input {
    width: 100%;
    line-height: 36px;
    font-size: 24px;
    padding: 6px 10px 6px 10px;
    margin: 6px auto 6px auto;
}