﻿.ui.container {
    min-height: 300px;
    height: 100%;
}

.flex.form {
    display: flex !important;
    flex-direction: column;
    align-items: stretch;
    justify-content: center;
    flex: 1;
    border: 0px solid grey;
    min-width: 684px;
    max-width: 1040px;
    margin-left: auto !important;
    margin-right: auto !important;
    height: 100%;
    row-gap: 5px;
}

.small.form {
    width: 654px;
}

.medium.form {
    width: 1040px;
}

.logoContainer {
    height: 144px;
    width: 440px;
    margin: 0 auto 16px auto;
    display: flex;
    align-items: center;
    justify-content: center;
}

.logo {
    text-align: center;
    line-height: 0;
}

    .logo > img {
        max-height: 144px;
        max-width: 440px;
        height: auto;
    }

.ui.form.segment {
    border-radius: 8px !important;
    padding-top: 72px;
    padding-bottom: 64px;
    padding-left: 0px;
    padding-right: 0px;
}

.ui.form.content {
    padding-top: 0px;
    padding-bottom: 0px;
    padding-right: 120px;
    padding-left: 120px;
}

.ui.title.header {
    font-weight: 300;
    font-size: 20px;
    line-height: 36px;
}

.ui.disclaimer.segment {
    font-style: italic;
    font-weight: 400;
    font-size: 12px;
    line-height: 14.52px;
    color: #666666;
}

.flex.centered.section {
    display: flex;
    flex-direction: row;
    justify-content: center;
    margin-top: 32px;
    column-gap: 10px;
}

div[class*='space between'].inline.fields {
    justify-content: space-between
}

div[class*='centered'].inline.fields > .field {
    padding-right: 0px !important;
}

div[class*='centered'].inline.fields {
    justify-content: center;
}

div[class*='centered medium gap'].inline.fields {
    column-gap: 22px;
}

.containerSubtitle.overflow {
    max-height: 300px;
    overflow-y: scroll;
    padding-right: 10px;
    text-align: justify;
    padding-top: 5px;
}

/*
    From original login.css
*/

.defaultContainer {
    background-color: #FFF;
    text-align: center;
    border-radius: 10px
}

.containerSubtitle {
    font-family: Inter;
    font-style: normal;
    font-weight: normal;
    font-size: 14px;
    line-height: 20px;
    color: #333333;
    text-align: center;
}

.containerText {
    color: #333333;
    margin-top: 7px;
    margin-bottom: 1px;
    padding: 0;
    font: 400 14px Inter;
    text-align: center;
}

.containerButton {
    padding-top: 36px;
    text-align: center;
}

.panelContainerWrapper {
    width: 654px;
    /*height: 735px; */
    position: absolute;
    left: 0;
    right: 0;
    top: 30%;
    margin: auto;
    display: flex;
    flex-direction: column;
    align-items: center;
}

.panelContainer {
    min-width: 654px;
    /*min-height: 735px;*/
    background-color: white;
    border-radius: 10px;
}

.tool-tip {
    color: #4D4D4D;
    z-index: 20000;
}

.tool-title {
    font-weight: bold;
    font-size: 11px;
    margin: 0px;
    color: #203b78;
    padding-bottom: 4px;
}

.tool-text {
    font-size: 11px;
}

    .tool-text ul {
        list-style: disc none outside;
        margin-left: 15px;
    }

.brand_l {
    width: 36px;
    background: transparent url(../i/l/x/brand_l.gif) no-repeat right 0;
    zoom: 1;
}

.brand_c {
    background: transparent url(../i/l/x/brand_c.gif) repeat-x top;
    padding: 0px;
}

div.divTable {
    display: table;
    margin: 0 auto;
}

div.divTr {
    padding-right: 5px;
    display: table-row;
}

div.divTd {
    padding-right: 5px;
    padding-bottom: 5px;
    display: table-cell;
}

.loginHelp, .loginHelp a {
    font: 400 13px Source Sans Pro;
    color: #003B70;
    text-decoration: none;
}

.titleLabel {
    font-weight: 300;
    font-size: 20px;
    line-height: 36px;
    display: flex;
    /* text-align: center; */
    color: #999999;
    justify-content: center;
}

.subtitleLabel {
    width: 172px;
    height: 19px;
    left: 385px;
    top: 506px;
    /* Body/Subtitle Bold 16px */

    font-family: Inter;
    font-style: normal;
    font-weight: bold;
    font-size: 16px;
    line-height: 19px;
    display: flex;
    align-items: center;
    text-align: center;
    /* Grey/Black #333333 */

    color: #333333;
}

.baseTextBtn {
    background-image: none;
    background-color: #003B70;
    color: white;
    border: 1px solid #003B70 !important;
    padding: 2px 10px;
    font: 600 20px Source Sans Pro;
    -moz-border-radius: 5px 5px 5px 5px;
    border-radius: 5px 5px 5px 5px;
}

    .baseTextBtn:hover {
        background-color: #F49211;
        border: 1px solid #F49211 !important;
        cursor: pointer;
    }

.cancelButtonLogin {
    font: 500 20px Source Sans Pro;
    background-image: none;
    background-color: white;
    color: #003B70;
    border: 1px solid lightgrey !important;
    -moz-border-radius: 5px 5px 5px 5px;
    border-radius: 5px 5px 5px 5px;
    padding: 2px 10px;
}

    .cancelButtonLogin:hover {
        color: #F49211;
        border: 1px solid #F49211 !important;
        cursor: pointer;
    }

textarea:focus, input:focus {
    outline: 0;
}

ul.langContainer {
    list-style: none;
    padding-left: 0px;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
}

.langContainer li {
    font: 400 15px Source Sans Pro;
    color: #003B70;
    text-decoration: none;
    background-color: white;
    padding: 6px;
}

.langContainer a {
    color: #003B70;
}

.powered.by {
    display: flex;
    justify-content: flex-end;
    padding: 5px 15px 10px 10px;
    margin-top: 18px;
}

.UNandPWPanel {
    padding-bottom: 15px;
    padding-top: 15px;
}

.buttonContainer input {
    margin-right: 10px;
}

.valSummary {
    text-align: left;
    font: 400 14px Source Sans Pro;
    margin: 0 auto;
    display: inline-block;
    line-height: 30px;
}

.pwChanged {
    color: #B0B5BA;
}

.pwChangeValidation ul {
    list-style-type: none;
}

.pwChangeError {
    color: red;
    font: 400 14px Source Sans Pro;
    display: block;
    line-height: 20px;
}

.loginErrorPanel {
    color: red;
    padding: 5px;
}

.resetPW {
    text-align: center;
    margin-top: 20px;
    display: inline-block;
}

.tip-tl {
    background: transparent url(../i/l/x/tip_corners.gif) no-repeat 0 0;
    zoom: 1;
}

.tip-tc {
    height: 8px;
    background: transparent url(../i/l/x/tip_tb.gif) repeat-x 0 0;
    overflow: hidden;
}

.tip-tr {
    background: transparent url(../i/l/x/tip_corners.gif) no-repeat right -8px;
}

.tip-ml {
    background: transparent url(../i/l/x/tip_l.gif) repeat-y 0;
    overflow: hidden;
    zoom: 1;
}

.tip-mc {
    background: #fffabf;
}

.tip-mr {
    background: transparent url(../i/l/x/tip_r.gif) repeat-y right;
    overflow: hidden;
}

.tip-bl {
    background: transparent url(../i/l/x/tip_corners.gif) no-repeat 0 -16px;
    zoom: 1;
}

.tip-bc {
    background: transparent url(../i/l/x/tip_tb.gif) repeat-x 0 -8px;
    height: 8px;
    overflow: hidden;
}

.tip-br {
    background: transparent url(../i/l/x/tip_corners.gif) no-repeat right -24px;
}

.tip-tl, .tip-bl {
    padding-left: 8px;
    overflow: hidden;
}

.tip-tr, .tip-br {
    padding-right: 8px;
    overflow: hidden;
}

.flex-container {
    display: flex;
}

    .flex-container > div:first-child {
        left: 194px;
        right: 534px;
    }



.horizontal.divider {
    border-bottom: 1px solid #DADADA;
    margin: 20px 0px;
}

.ui.placeholder.password.segment {
    border: 0 !important;
    font-style: normal;
    font-weight: normal;
    font-size: 14px;
    line-height: 20px;
    color: #333333;
    /* min-height: unset;*/
}

/* Login page */
#loginBody .ui.container {
    min-height: 100%;
    height: auto;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    display: flex;
}

#loginBody .ui.form.segment {
    /* to decrease top/bottom padding/whitespace on login page */
    padding: 32px 0;
}

#loginBody ul.langContainer {
    margin-bottom: 0;
}

#loginBody .flex.form {
    height: auto;
    flex: 0;
}

#loginBody .ui.disclaimer.segment {
    position: absolute;
    top: 100%;
}