input::-ms-clear {
    display: none;
}

#onboarding-process input,
#onboarding-process input:focus,
#onboarding-process input:active,
#onboarding-process input:hover {
    -webkit-appearance: none;
    box-shadow: 0 0 0px 1000px rgb(231, 230, 230) inset;
    -webkit-box-shadow: 0 0 0px 1000px rgb(231, 230, 230) inset;
    -moz-box-shadow: 0 0 0px 1000px rgb(231, 230, 230) inset;
}

#onboarding-process select {
    -webkit-appearance: none;
    box-shadow: 0 0 0px 1000px rgb(231, 230, 230) inset;
    -webkit-box-shadow: 0 0 0px 1000px rgb(231, 230, 230) inset;
    -moz-box-shadow: 0 0 0px 1000px rgb(231, 230, 230) inset;
}

.link-color {
    color: #525b92;
}

/* Tooltip */

.tip-bg {
    background-color: rgb(231, 230, 230);
}

.tip-color {
    color: rgb(127, 127, 127);
}

tip-arrow {
    border-bottom: 6px solid rgb(231, 230, 230) !important;
}

/* END OF: Tooltip */

.onboarding-process-input-right-icon {
    position: absolute;
    top: 40px;
    right: 20px;
}

.break-paragraphs {
    display: flex;
}

.break-paragraphs p {
    float: left;
    margin: 0;
    margin-right: 4px;
}

#onboarding-process-action-btn {
    position: relative;
    background-color: #2f3f4f;
    color: #ffffff;
    display: inline-block;
    padding: 10px 50px;
    border-radius: 25px;
}

#onboarding-process-action-btn:hover {
    opacity: 0.9;
    filter: alpha(opacity=0.9);
}

#onboarding-process-action-btn-spinner {
    position: absolute;
    top: 10px;
    right: 12px;
}

#onboarding-process {
    background-color: #ffffff;
}

#onboarding-process .section-wrap {
    margin: 0;
    padding: 0;
}

#onboarding-process .form-control {
    border: 2px solid #e5e6e7;
    border-radius: 12px;
    display: block;
    padding: 16px 12px;
    width: 100%;
    font-size: 16px;
    height: auto;
}

#onboarding-process .form-control-sm {
    border: 2px solid #e5e6e7;
    border-radius: 12px;
    display: block;
    padding: 10px 12px;
    width: 100%;
    font-size: 15px;
    height: auto;
}

#onboarding-process .form-control-sm-not-full-width {
    border: 2px solid #e5e6e7;
    border-radius: 12px;
    display: block;
    padding: 10px 12px;
    font-size: 15px;
    height: auto;
}

.onboarding-process-dropdown-arrow {
    position: absolute;
    top: 35px;
    right: 15px;
}

.onboarding-process-dropdown-arrow img {
    max-width: 25px;
}

/* ########################################################################### */

/* ########################### Left sided section ############################ */

/* ########################################################################### */

.bg-image-onboarding-process-wrapper {
    margin: 0;
    padding: 0;
    content: "";
    position: fixed;
    width: 50%;
    top: 0;
    left: 0;
    height: 100vh;
    background-color: transparent;
    overflow-y: hidden;
}

.bg-image-onboarding-process-wrapper .banner_1 {
    background-image: url(/static/img/onboarding_process/image_1.png);
}

.bg-image-onboarding-process-wrapper .banner_2 {
    background-image: url(/static/img/onboarding_process/image_2.png);
}

.bg-image-onboarding-process-wrapper .banner_3 {
    background-image: url(/static/img/onboarding_process/image_3.png);
}

.bg-image-onboarding-process-wrapper .banner_4 {
    background-image: url(/static/img/onboarding_process/image_4.png);
}

.bg-image-onboarding-process-wrapper .banner_5 {
    background-image: url(/static/img/onboarding_process/image_5.png);
}

.bg-image-onboarding-process-wrapper .banner_6 {
    background-image: url(/static/img/onboarding_process/onboarding_process.png);
}

.bg-image-onboarding-process-wrapper .banner {
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
    width: 100%;
    height: inherit;
    z-index: 1;
    background-position: 78% 50%, center top;
    background-repeat: no-repeat;
}

.bg-image-onboarding-process-wrapper .logo {
    background-image: url(/static/img/pobuca-conect-square.svg);
    background-repeat: no-repeat;
    position: absolute;
    top: 20px;
    left: 20px;
    height: 60px;
    max-width: 60px;
    max-height: 60px;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: 40px;
    width: 60px;
    cursor: pointer;
}

/* ####################### END OF: Left sided section ######################## */

/* ########################################################################### */

/* ########################### Right sided section ########################### */

/* ########################################################################### */

.main-onboarding-process-wrapper {
    margin: 0;
    padding: 0;
    content: "";
    position: relative;
    width: 100%;
    top: 0;
    left: 0;
    min-height: 100vh;
    background-color: #ffffff;
    overflow-y: auto;
}

.main-onboarding-process-wrapper .logo {
    background-image: url(/static/img/pobuca-conect-square.svg);
    background-repeat: no-repeat;
    position: absolute;
    top: 20px;
    left: 48px;
    height: 50px;
    max-width: 50px;
    max-height: 50px;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: 40px;
    width: 50px;
    cursor: pointer;
}

/* Onboarding process headers */

#sign_up_header_section,
#sign_in_header_section {
    position: absolute;
    right: 73px;
    top: 30px;
}

#header_sign_up_btn:hover,
#header_sign_in_btn:hover {
    background-color: #2f3f4f;
    color: #ffffff;
    cursor: pointer;
}

#header_sign_up_btn,
#header_sign_in_btn {
    -webkit-transition: background-color 0.2s ease-out;
    -moz-transition: background-color 0.2s ease-out;
    -o-transition: background-color 0.2s ease-out;
    transition: background-color 0.2s ease-out;
}

@media (max-width: 450px) {

    #sign_up_header_section,
    #sign_in_header_section {
        position: absolute;
        right: 53px;
        top: 15px;
    }

    #header_sign_up_message,
    #header_sign_in_message {
        width: 100%;
        display: inline-block;
    }

    #header_sign_up_btn,
    #header_sign_in_btn {
        position: relative;
        left: 3px;
        top: 15px;
    }

    #onboarding-process-action-btn {
        padding: 10px 20px;
    }

    .break-paragraphs {
        display: block;
    }

    .break-paragraphs p {
        width: 100%;
    }
}

@media (min-width: 1450px) {

    #sign_up_header_section,
    #sign_in_header_section {
        position: absolute;
        right: 96px;
        top: 15px;
    }

    #header_sign_up_message,
    #header_sign_in_message {
        width: 100%;
        position: relative;
        top: 15px;
    }

    #header_sign_up_btn,
    #header_sign_in_btn {
        position: relative;
        left: 3px;
        top: 15px;
    }
}

.onboarding-process-sign-header {
    position: relative;
    right: 0;
    top: 0;
    left: 0;
    color: #000000;
    background-color: transparent;
    height: 85px;
    width: 100%;
}

.onboarding-process-sign-btn-header {
    border: 4px solid #2f3f4f;
    color: #2f3f4f;
    padding: 7px 27px;
    font-size: 14px;
    border-radius: 25px;
    margin-left: 5px;
    text-transform: uppercase;
    cursor: pointer;
}

/* END OF: Onboarding process headers */

/* Onboarding process main content */

.onboarding-process-main-content {
    position: relative;
    right: 0;
    top: 0;
    left: 0;
    color: #000000;
    background-color: transparent;
    width: 100%;
    padding-bottom: 65px;
}

/* END OF: Onboarding process main content */

/* Onboarding process footer */

.onboarding-process-footer {
    position: absolute;
    right: 0;
    bottom: 0;
    left: 0;
    background-color: #2f3f4f;
    min-height: 60px;
    width: 100%;
}

.onboarding-process-footer img {
    padding: 8px 3px;
    max-height: 65px;
}

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

    /* Specific to this particular image */
    .onboarding-process-footer {
        display: none;
    }
}

/* END OF: Onboarding process footer */

/* ####################### END OF: Right sided section ######################## */

/* SIGN IN page */
.oauth2-btn i {
    margin-right: 5px;
}

.oauth2-btn {
    border: 1px solid #d9d9d9;
    padding: 9px 14px;
    border-radius: 30px;
    white-space: nowrap;
    display: block;
    font-size: 15px;
    margin: 0 auto 10px;
    color: black;
    width: 260px;
    /* box-shadow: 0 1px 0 1px #f8f8f8; */
}

.oauth2-btn:hover {
    background: #ececec4a;
}

.oauth2-btn.ms i {
    color: #337ab7;
}

.oauth2-btn.google i {
    color: red;
}

#onboarding-process-forgot-pass-link {
    position: absolute;
    right: 0;
    top: 0;
    cursor: pointer;
    text-decoration: underline;
    font-size: 14px;
    color: #2f3f4f;
}

#onboarding-process-forgot-pass-link:hover {
    color: #525b92;
}

#onboarding-process-aad-sign-in-btn {
    /* background-repeat: no-repeat; 
    width: 230px; 
    height: 40px; 
    cursor: pointer; 
    display: inline-block; */
    /* background-repeat: no-repeat; */
    cursor: pointer;
    display: block;
    margin: 15px 0 4px;
    color: #676a6c;
}

.onboarding-process-logic-or-divider {
    color: #2f3f4f;
    font-size: 16px;
    margin: 10px auto;
}

/* END OF: SIGN IN page */

/* SIGN UP page */

.onboarding-process-public-email-signup-btn {
    display: inline;
    padding: 10px 60px;
    border-radius: 25px;
    min-width: 290px;
}

.onboarding-process-public-email-signup-outline-btn {
    display: inline;
    padding: 10px 60px;
    border-radius: 25px;
    min-width: 290px;
    border-color: #23c1c5;
    color: #23c1c5 !important;
    background-color: transparent;
    border-width: 2px;
}

.why-asking-public-email-signup {
    color: rgb(100, 111, 121);
}

.sign-up-tip {
    font-size: 14px;
    width: 100%;
}

#sign-up-work-email {
    width: 100%;
}

/* END OF: SIGN UP page */

/* SIGN UP COMPLETE page */

.sign_up_complete_letter_img {
    max-width: 150px;
    width: 100%;
    margin: 15px auto;
}

#onboarding-process-main-content-sign-up-complete {
    margin-top: 104px;
}

@media (max-width: 768px) {
    #onboarding-process-main-content-sign-up-complete {
        margin-top: 16px;
    }

    #onboarding-process-action-btn {
        padding: 10px 20px;
    }
}

/* END OF: SIGN UP COMPLETE page */

/* BOT SIGN IN COMPLETE page */

.bot_sign_in_complete_img {
    max-width: 150px;
    width: 100%;
    margin: 15px auto;
}

#onboarding-process-main-content-sign-up-complete {
    margin-top: 104px;
}

@media (max-width: 768px) {
    #onboarding-process-main-content-sign-up-complete {
        margin-top: 16px;
    }
}

/* END OF: BOT SIGN IN COMPLETE page */

/* REGISTER page */

.onboarding-process-password-criteria-icon-dot {
    font-size: 13px;
    position: absolute;
    top: 4px;
    left: 1px;
    color: #adadad;
}

.onboarding-process-password-criteria-icon-check {
    font-size: 13px;
    position: absolute;
    top: 4px;
    left: 1px;
    color: #23c1c5;
}

.onboarding-process-password-criteria-icon-times {
    font-size: 13px;
    position: absolute;
    top: 4px;
    left: 1px;
    color: #eb5767;
}

#onboarding-process-register-action-btn {
    position: relative;
    background-color: #2f3f4f;
    color: #ffffff;
    display: inline-block;
    padding: 10px 45px;
    border-radius: 25px;
}

#onboarding-process-register-action-btn:hover {
    opacity: 0.9;
    filter: alpha(opacity=0.9) s;
}

@media (min-width: 768px) {
    #onboarding-process-register-action-btn {
        top: 15px;
    }
}

/* END OF: REGISTER page */

/* INVITE page */

.email-domain {
    position: absolute;
    right: 0;
    top: 10px;
    font-size: 15px;
}

/* END OF: INVITE page */

/* FORGOT PASSWORD COMPLETE page */

.forgot_password_complete_letter_img {
    max-width: 150px;
    width: 100%;
    margin: 15px auto;
}

/* END OF: FORGOT PASSWORD COMPLETE page */

/* ENHANCE PROFILE page */

#onboarding-process-enhance-profile-photo {
    display: initial;
}

#onboarding-process-enhance-profile-photo .onboarding-process-cropArea {
    overflow: hidden;
    width: 100%;
    /* height: 300px; */
    margin: auto;
    /* min-height: 300px; */
    margin-bottom: 20px;
}

#onboarding-process-enhance-profile-photo #onboarding-process-crop-btn {
    position: relative;
    background-color: #2f3f4f;
    color: #ffffff;
    display: inline-block;
    padding: 6px 40px;
    border-radius: 25px;
}

#onboarding-process-enhance-cropped-profile-photo {
    background: #e4e4e4;
    overflow: hidden;
    width: 150px;
    height: 150px;
    border-radius: 50%;
    margin: auto;
    box-shadow: 0 0 0 1px #adadad;
}

#onboarding-process-enhance-cropped-profile-photo>img {
    width: 100%;
    height: auto;
}

#onboarding-process-enhance-cropped-add-profile-photo:hover,
#onboarding-process-enhance-cropped-remove-profile-photo:hover {
    text-decoration: underline;
}

/* END OF: ENHANCE PROFILE page */