* {
    margin: 0;
    padding: 0;
    border: 0;
    outline: 0;
    background: transparent;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

html, body {
    height: 100%;
}

body {
    font-family: 'SSP Regular' !important;
    font-size: 12px;
    box-sizing: border-box;
    background-color: #FFFFFF;
}

[class^="dx"],
[class*=" dx"] {
    font-family: 'SSP Regular' !important;
    font-size: 12px !important;
}

.hidden {
    display: none !important;
}

.ot4-grid-container {
    display: table;
    width: 100%;
    height: 100%;
}

.ot4-left-menu {
    display: table-cell;
    width: 240px;
    min-width: 200px;
    height: 100%;
    background-color: #14284b;
    background-image: url(/Content/Images/Otmis4/Knijf2023_wit.png);
    background-position: center 32px;
    background-size: 66.66% auto;
    background-repeat: no-repeat;
    position: relative;
}

    .ot4-left-menu .outer-menu-container {
        display: block;
        width: 100%;
        position: relative;
        top: calc(125px + 0.35vw);
    }


.ot4-right-content {
    display: table-cell;
    vertical-align: top;
    background-color: #fff;
}

.outer-menu-container .user-container {
    text-align: center;
    padding: 0 10%;
    color: #ffffff;
}

.user-container .avatar {
    display: inline-block;
    border-radius: 50%;
    background-color: #759dd5;
    width: calc(40px + 0.25vw);
    height: calc(40px + 0.25vw);
    line-height: calc(40px + 0.25vw);
    font-size: calc(12px + 0.5vw);
    text-transform: uppercase;
}

.user-container .company-name {
    font-family: 'SSP Semi Bold' !important;
    font-size: 1.17em;
    line-height: 1.7em;
    margin-top: 0.57em;
}

.user-container .user-name {
    font-size: 1.17em;
    line-height: 1.7em;
    text-transform: capitalize;
}

.outer-menu-container .menu-container {
    display: block;
    width: 100%;
    margin-top: 4.5em;
}

.separator {
    display: block;
    margin: 0 auto;
    width: 80%;
    height: 1.7em;
    margin-bottom: 1.7em;
    border-bottom: 1px solid #ffffff;
}

.menu-container .dxm-main {
    background-color: transparent !important;
    border-style: none !important;
}

.menu-container .dxmLite_KnijffMaterial .dxm-vertical {
    width: 100%;
}

.menu-container li.dxm-item {
    position: relative;
    padding: 0 10% 0 10%;
    transition: all linear 300ms;
    -webkit-transition: all linear 300ms;
    -moz-transition: all linear 300ms;
    -o-transition: all linear 300ms;
}

    .menu-container li.dxm-item * {
        pointer-events: none;
    }

.menu-container span.dx-vam {
    font-family: 'SSP Semi Bold' !important;
    font-size: 1em;
    color: #ffffff !important;
    text-transform: capitalize;
    padding: 0 !important;
}

.menu-container .dxm-content {
    padding: 0 !important;
    line-height: 40px;
    display: inline-block;
    float: none !important;
}

.menu-container li.dxm-selected {
    background-color: #364766 !important;
}

    .menu-container li.dxm-selected .dx-vam {
        color: #ff8f00 !important;
    }

.menu-container li.dxm-item:hover .dx-vam,
.menu-container a span.dx-vam:hover,
.menu-container div.dxm-hasText span.dx-vam:hover,
.menu-container .dxm-selected div.dxm-content span.dx-vam {
    font-family: 'SSP Bold' !important;
    font-size: 1em;
    color: #ff8f00 !important;
}

.menu-container li.dxm-item:hover {
    background-color: #364766 !important;
}

.ot4-left-menu .otmis-version {
    position: absolute;
    bottom: 2em;
    display: block;
    width: 100%;
    padding: 0 10%;
    text-align: left;
    color: #ffffff;
}

.ot4-top-menu {
    position: relative;
    display: block;
    width: 100%;
    min-height: 120px;
    max-height: 120px;
    background-color: #f1f2f4;
}

    .ot4-top-menu .yellow-arrow {
        position: absolute;
        right: 25%;
        top: 0;
        bottom: 0;
        display: none !important;
        width: 240px;
        background: url(/Content/Images/Otmis4/arrow_yellow.png) no-repeat top left transparent;
        background-size: contain;
    }

    .ot4-top-menu .page-name,
    .ot4-top-menu .header-big,
    .ot4-top-menu .header-small {
        color: #4e5d78;
        position: absolute;
        right: 11.78%;
    }

    .ot4-top-menu .header-big {
        font-family: 'SSP Bold' !important;
        font-size: 2.34em;
        text-transform: uppercase;
        top: 23.33%;
    }

    .ot4-top-menu .header-small {
        font-family: 'SSP Semi Bold' !important;
        bottom: 23.33%;
    }

    .ot4-top-menu .page-name {
        font-family: 'SSP Semi Bold' !important;
        font-size: 2.84em;
        left: 3.45%;
        top: 23.33%;
        right: auto;
    }

    .ot4-top-menu .crumb-bar {
        font-family: 'SSP Semi Bold' !important;
        font-size: 1.17em !important;
        position: absolute;
        bottom: 1.33em;
        left: 3.45%;
    }

        .ot4-top-menu .crumb-bar .crumb {
            display: inline-block;
            color: #4e5d78;
            line-height: 1.7em;
            padding: 0 0.66em;
            cursor: pointer;
        }

            .ot4-top-menu .crumb-bar .crumb.inactive {
                cursor: default;
            }

            .ot4-top-menu .crumb-bar .crumb a {
                font-family: 'SSP Semi Bold' !important;
                color: #4e5d78;
                text-decoration: none;
            }

                .ot4-top-menu .crumb-bar .crumb a:hover {
                    color: #ff8f00 !important;
                }


        .ot4-top-menu .crumb-bar .crumb-separator {
            display: inline-block;
            height: 1.7em;
        }

        .ot4-top-menu .crumb-bar .crumb:first-of-type {
            padding-left: 0;
        }

        .ot4-top-menu .crumb-bar .crumb:last-of-type {
            border-right-style: none;
            cursor: default;
        }

.extended-crumbs {
    display: inline-block;
}

[class^="ot4-notification-nr-"] .dxm-content:after,
[class*=" ot4-notification-nr-"] .dxm-content:after {
    content: '?';
    display: inline-block;
    position: absolute;
    width: 24px;
    height: 24px;
    color: #fff;
    background-color: #dd2727;
    top: 10px;
    border-radius: 3px;
    text-align: center;
    vertical-align: middle;
    line-height: 24px;
    margin-left: 1em;
    font-family: 'SSp Bold';
}

.menu-container [class^="ot4-notification-nr-"] .dxm-content:after,
.menu-container [class*=" ot4-notification-nr-"] .dxm-content:after {
    right: 3em;
}

[class^="ot4-notification-nr-"].ot4-green .dxm-content:after, [class*=" ot4-notification-nr-"].ot4-green .dxm-content:after {
    background-color: #0bb07b;
}

[class^="ot4-notification-nr-"].ot4-orange .dxm-content:after, [class*=" ot4-notification-nr-"].ot4-orange .dxm-content:after {
    background-color: #f89734;
}

[class^="ot4-notification-nr-"] h5.dxm-content:after,
[class*=" ot4-notification-nr-"] h5.dxm-content:after {
    font-family: 'SSp Black';
    font-size: 1rem;
    top: 7px;
}

.ot4-notification-nr-0 .dxm-content:after {
    display: none !important;
}

.ot4-main-content {
    display: block;
    width: 100%;
    background-color: #ffffff;
    padding: 64px 58px 32px 58px;
}

.ot4-lite-pages {
    z-index: 1;
    display: table;
    width: 100%;
    align-items: center;
    justify-content: center;
}

    .ot4-lite-pages:before {
        content: '';
        background-image: url(/Content/Images/Otmis4/lite-background.png);
        background-repeat: no-repeat;
        background-size: cover;
        background-position: center center;
        opacity: 0.5;
        position: absolute;
        top: 0;
        bottom: 0;
        left: 0;
        right: 0;
        z-index: 0;
    }

    .ot4-lite-pages > * {
        z-index: 2;
    }

.lite-outer-container {
    display: table-cell;
    width: 100%;
    text-align: center;
    vertical-align: middle;
}

.lite-inner-container {
    font-family: 'SSP Semi Bold';
    position: relative;
    display: inline-block;
    margin: auto;
    width: 1184px;
    height: 680px;
    border-radius: 4px;
    background-color: transparent;
    color: #ffffff;
    box-shadow: 0 32px 40px -2px rgba(10, 22, 70, 0.12), 0 0 1px 0 rgba(10, 22, 70, 0.06);
    transition: all linear 300ms;
    -webkit-transition: all linear 300ms;
    -moz-transition: all linear 300ms;
    -o-transition: all linear 300ms;
}

    .lite-inner-container.log-in {
        background-image: url(/Content/Images/Otmis4/login-background.png);
        background-repeat: no-repeat;
        background-position: center center;
        background-size: cover;
    }

    .lite-inner-container.recover-account {
        background-color: #ffffff;
        color: #0a1f44;
    }

        .lite-inner-container.recover-account .centeredContent,
        .lite-inner-container.request-account .centeredContent {
            width: auto;
        }

    .lite-inner-container.request-account {
        height: 760px;
    }

    .lite-inner-container .company-logo {
        /*background-image: url(/Content/Images/Otmis4/Knijf2023_wit.png);*/
        background-repeat: no-repeat;
        background-position: bottom right;
        background-size: contain;
        position: absolute;
        display: inline-block;
        width: 13.26%;
        height: 10.5%;
        right: 32.6%;
        bottom: 5.8%;
    }

    /*.lite-inner-container.recover-account .company-logo {
        background-image: url(/Content/Images/Otmis4/Knijf2023_wit.png);
    }*/

    .lite-inner-container .arrow-cloud {
        background-image: url(/Content/Images/Otmis4/Knijf2023_wit.png);
        background-repeat: no-repeat;
        background-position: bottom right;
        background-size: contain;
        position: absolute;
        display: inline-block;
        width: 17.06%;
        height: 10.5%;
        right: 3.4%;
        bottom: 5.8%;
    }

    .lite-inner-container .centeredContent {
        display: inline-table;
        text-align: left;
        position: absolute;
        padding: 0 9.45%;
        height: 100%;
        left: 0;
    }

    .lite-inner-container .info-block {
        display: inline-table;
        width: 31.81%;
        margin: 0 9.45%;
        text-align: left;
        position: absolute;
        left: 0;
        top: 17.64%;
    }

        .lite-inner-container .info-block.is-single-column {
            display: inline-block;
        }

.login-form-container {
    padding-top: 5.88%;
    width: 39.16%;
}

.lite-inner-container h1 {
    font-size: 2.84em;
    line-height: 4rem;
}

.lite-inner-container.recover-account h1 {
    font-family: 'SSP Bold' !important;
    line-height: 4rem;
}


.lite-inner-container h2 {
    font-size: 2em;
    line-height: 3rem;
}

.centeredContent .inline_block {
    display: table-cell;
    vertical-align: middle;
}

.recover-account .centeredContent .inline_block {
    display: table-cell;
    vertical-align: top;
    padding-top: 32%;
}

.lite-inner-container .link {
    color: #006ce6;
    font-size: 1.17em;
    line-height: 1.7em;
    margin-left: 0.66em;
    text-decoration: none;
    transition: all linear 250ms;
    -webkit-transition: all linear 250ms;
    -moz-transition: all linear 250ms;
    -o-transition: all linear 250ms;
}

    .lite-inner-container .link.small {
        font-size: 1em;
        line-height: 1.7em !important;
    }

        .lite-inner-container .link.small.semi-bold {
            font-family: 'SSP Semi Bold' !important;
        }

    .lite-inner-container .link:hover {
        color: #ffffff;
    }

    .lite-inner-container .link.on-white:hover {
        color: #ffad0d;
    }

.lite-inner-container .on-white {
    font-family: "SSP Regular" !important;
    position: absolute;
    right: 1.5em;
    top: 1em;
}

.normal-text-small,
.dxflCaption_KnijffMaterial {
    font-family: 'SSP Semi Bold' !important;
    font-size: 1em !important;
    line-height: 1.7em !important;
    color: #ffffff !important;
}

.recover-account .normal-text-small,
.recover-account .dxflCaption_KnijffMaterial {
    color: #4e5d78 !important;
}

.normal-text {
    font-family: 'SSP Semi Bold' !important;
    font-size: 1.17em !important;
    line-height: 1.7em !important;
    display: inline-block;
}

    .normal-text.regular,
    .normal-text-small.regular {
        font-family: 'SSP Regular' !important;
    }

    .normal-text.bold {
        font-family: 'SSP Bold' !important;
    }

.dxflCaptionCellSys {
    font-family: 'SSP Semi Bold' !important;
    padding: 0 !important;
    font-size: 1em !important;
}

.dxflItem_KnijffMaterial,
.dxflViewFormLayoutSys
.dxflEditFormItemSys.dxflItem_KnijffMaterial {
    padding: 0 !important;
}

.dxflNestedControlCell_KnijffMaterial {
    padding: 0.42em 0 1.35em !important;
    position: relative;
}

    .dxflNestedControlCell_KnijffMaterial.inline-button,
    .dxflCheckBoxItemSys .dxflNestedControlCell_KnijffMaterial {
        padding: 0 !important;
    }

    .dxflNestedControlCell_KnijffMaterial.inline-button {
        position: relative;
        top: 2.65em;
        text-align: center;
    }

.inline-button .dxbButton_KnijffMaterial div.dxb {
    padding-top: 3px !important;
}

.dxflCheckBoxItemSys .dxflCaptionCellSys {
    padding-left: 4px !important;
    cursor: pointer;
}

.taken-action-info {
    border-style: none;
    border-radius: 4px;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    -o-border-radius: 4px;
    font-family: 'SSP Regular' !important;
    font-size: 1.17em !important;
    line-height: 1.7em !important;
    text-align: center;
    color: #fff;
    padding: 8px !important;
    display: block;
    margin-top: 3em;
}

textarea,
.dxeTextBox_KnijffMaterial,
.dxeButtonEdit_KnijffMaterial {
    border-style: none;
    border-radius: 4px;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    -o-border-radius: 4px;
    background-color: #ffffff !important;
}

    .dxeTextBox_KnijffMaterial.dxeReadOnly_KnijffMaterial,
    .dxeTextBox_KnijffMaterial.dxeDisabled_KnijffMaterial {
        background-color: #f1f2f4 !important;
    }

.dxeMemo_KnijffMaterial,
.dxTB.dxucTextBox_KnijffMaterial,
.dxeButtonEdit_KnijffMaterial,
.ot4-main-content .dxeTextBox_KnijffMaterial:not(.dxeInvalid_KnijffMaterial),
.recover-account .dxeTextBox_KnijffMaterial:not(.dxeInvalid_KnijffMaterial) {
    border: solid 1px #e1e4e8 !important;
    border-style: solid !important;
}

.dxeButtonEdit_KnijffMaterial,
.dxeTextBox_KnijffMaterial .dxeEditArea_KnijffMaterial {
    background-color: transparent;
    font-family: 'SSP Regular' !important;
    font-size: 1.17em !important;
    line-height: 1.7em !important;
    height: 1.7em !important;
    color: #8a94a6;
}

.dxeMemo_KnijffMaterial > tbody > tr > td {
    padding: 0.5em 0.5em 2em;
    background-color: #ffffff;
}

.dxeMemo_KnijffMaterial textarea {
    background-color: #ffffff;
    font-family: 'SSP Regular' !important;
    font-size: 1.17em !important;
    line-height: 1.7em !important;
    color: #8a94a6 !important;
    overflow-y: auto;
}

.dxeTextBox_KnijffMaterial td.dxic,
.dxeButtonEdit_KnijffMaterial td.dxic,
[cellspacing='0'].dxeButtonEdit_KnijffMaterial td.dxic {
    padding: 8px !important;
}

.dxgvFilterRow_KnijffMaterial .dxeTextBox_KnijffMaterial td.dxic {
    padding: 4px 8px !important;
}

.dxWeb_edtCheckBoxUnchecked_KnijffMaterial,
.dxWeb_edtCheckBoxChecked_KnijffMaterial {
    background: none !important;
    background-position: top left !important;
    height: 2em;
    width: 2em;
}

    .dxWeb_edtCheckBoxUnchecked_KnijffMaterial:before,
    .dxWeb_edtCheckBoxChecked_KnijffMaterial:before {
        font-family: OtmisIcons !important;
        font-style: normal !important;
        font-weight: normal !important;
        font-variant: normal !important;
        font-size: 2em;
        text-transform: none !important;
        speak: none;
        line-height: 1;
        -webkit-font-smoothing: antialiased;
        -moz-osx-font-smoothing: grayscale;
        position: relative;
        color: #ffffff;
        display: inline-block;
    }

.recover-account .dxWeb_edtCheckBoxUnchecked_KnijffMaterial:before,
.recover-account .dxWeb_edtCheckBoxChecked_KnijffMaterial:before {
    color: #e1e4e8;
}

.dxWeb_edtCheckBoxUnchecked_KnijffMaterial:not(.switch-button):before {
    content: "\6e";
}

.dxWeb_edtCheckBoxChecked_KnijffMaterial:not(.switch-button):before {
    content: "\6c";
}

.recover-account .dxWeb_edtCheckBoxChecked_KnijffMaterial:before {
    color: #759dd5;
}

.dxflButtonItemSys.dxflItem_KnijffMaterial {
    width: 100% !important;
}

.dxbButton_KnijffMaterial {
    background-color: #759DD5;
    border: solid 1px #759DD5;
    border-radius: 4px;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    -o-border-radius: 4px;
    display: table !important;
}

    .dxbButton_KnijffMaterial.green-button:not(.dxbDisabled_KnijffMaterial) {
        background-color: #0bb07b;
        border: solid 1px #0bb07b;
    }

    .dxbButton_KnijffMaterial:not(.dxbDisabled_KnijffMaterial):hover {
        border: solid 1px #4172b4;
        background-color: #4172b4;
    }

    .dxbButton_KnijffMaterial.green-button:not(.dxbDisabled_KnijffMaterial):hover {
        background-color: #00865a;
        border: solid 1px #00865a;
    }

.open-buttons .dxbButton_KnijffMaterial {
    background-color: #ebf5ff;
    border: solid 1px #0c66ff;
    color: #0c66ff;
}

.open-button .dxbButton_KnijffMaterial:not(.dxbDisabled_KnijffMaterial) {
    background-color: #ebf5ff;
    border: solid 1px #0c66ff;
    color: #0c66ff;
}

.open-button .dxb {
    position: relative;
}

.left-image .dxbButton_KnijffMaterial img {
    margin-right: 10px !important;
    margin-top: 2px;
}

.open-button.left-aligned img {
    position: absolute;
    left: 12px;
    top: 34%;
}

.open-button.right-aligned img {
    position: absolute;
    right: 12px;
    top: 34%;
}

.open-buttons .dxbButton_KnijffMaterial img {
    float: left;
    position: relative;
    top: 2px;
    width: 24px;
}

.lite-inner-container .dxbButton_KnijffMaterial {
    background-color: #5481C1;
    border: solid 1px #5481C1;
}

.lite-inner-container .dxbButton_KnijffMaterial.disabled {
    background-color: #d2d6db !important;
}


.open-button .dxbButton_KnijffMaterial:not(.dxbDisabled_KnijffMaterial):hover,
.open-buttons .dxbButton_KnijffMaterial:not(.dxbDisabled_KnijffMaterial):hover {
    color: #fff !important;
}

.lite-inner-container .dxbButton_KnijffMaterial:not(.dxbDisabled_KnijffMaterial):hover {
    border: solid 1px #4172b4;
    background-color: #4172b4;
}

.dxucControl_KnijffMaterial .dxucBrowseButton_KnijffMaterial a,
.cancel-button .dxbButton_KnijffMaterial .dx-vam {
    color: #0a1f44;
}

.dxucControl_KnijffMaterial .dxucBrowseButton_KnijffMaterial,
.cancel-button .dxbButton_KnijffMaterial {
    background-color: #ffffff;
    border: solid 1px #e1e4e8;
    cursor: pointer !important;
}

    .dxucControl_KnijffMaterial .dxucBrowseButton_KnijffMaterial:hover,
    .dxucControl_KnijffMaterial .dxucBrowseButtonHover_KnijffMaterial,
    .cancel-button .dxbButton_KnijffMaterial:hover {
        border: solid 1px #4172b4;
        background-color: #4172b4;
        cursor: pointer;
    }

        .dxucControl_KnijffMaterial .dxucBrowseButtonHover_KnijffMaterial a,
        .cancel-button .dxbButton_KnijffMaterial:hover .dx-vam {
            color: #ffffff;
            cursor: pointer;
        }

.submit-button-container {
    padding-top: 1.1em !important;
}

.recover-account .submit-button-container {
    padding-top: 2em !important;
}

.dxucControl_KnijffMaterial .dxucBrowseButton_KnijffMaterial a,
.dxbButton_KnijffMaterial .dx-vam {
    font-family: 'SSP Semi Bold' !important;
    font-size: 1.17em !important;
    line-height: 1.7em !important;
    text-transform: none !important;
}

.dxbButton_KnijffMaterial.dxbDisabled_KnijffMaterial {
    color: #ffffff;
}

.dxeInvalid_KnijffMaterial {
    border: 1px solid #dd2727 !important;
}

.dxeErrorCell_KnijffMaterial {
    position: absolute;
    right: 0px;
    padding: 0px !important;
    z-index: 100;
}

.ot4i-invalid-extended + .dxeErrorCell_KnijffMaterial:after {
    content: "\73";
    font-family: OtmisIcons !important;
    font-style: normal !important;
    font-weight: normal !important;
    font-variant: normal !important;
    font-size: 1.7em;
    text-transform: none !important;
    speak: none;
    line-height: 1;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    position: absolute;
    top: 0.4em;
    right: -0.1em;
    color: #dd2727;
}

.dxeErrorCell_KnijffMaterial img {
    position: relative;
    top: 1.1em;
    z-index: 110;
}

.dxeTextBox_KnijffMaterial.ot4-valid-input .dxic:after {
    content: "\72";
    font-family: OtmisIcons !important;
    font-style: normal !important;
    font-weight: normal !important;
    font-variant: normal !important;
    text-transform: none !important;
    speak: none;
    line-height: 1;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    position: absolute;
    color: #0bb07b;
    top: 0.95em;
    font-size: 1.5em;
    right: 0.5em;
}

.recover-account .image-container {
    display: block;
    position: absolute;
    width: 100%;
    height: 100%;
}

    .recover-account .image-container .state-image {
        display: inline-block;
        position: absolute;
        background-image: url(/Content/Images/Otmis4/fingerprint.svg);
        background-repeat: no-repeat;
        background-position: center center;
        background-size: contain;
        width: 21.11%;
        height: 36.76%;
        left: 64.69%;
        top: 31.61%;
    }

        .recover-account .image-container .state-image.valid {
            background-image: url(/Content/Images/Otmis4/checked.svg);
        }

        .recover-account .image-container .state-image.new-account {
            background-image: url(/Content/Images/Otmis4/user-account.svg);
        }

        .recover-account .image-container .state-image.ot4i-invalid {
            background-image: none;
        }

            .recover-account .image-container .state-image.ot4i-invalid:before {
                color: #dd2727;
                font-size: 20em;
                top: -0.25em;
                left: -0.25em;
            }

.recover-account .normal-text {
    color: #4e5d78 !important;
}

    .recover-account .normal-text.dark,
    .recover-account .normal-text-small.dark {
        color: #0a1f44 !important;
    }

.back-button-container {
    float: right;
    padding: 2em 2em 0 0;
}

    .back-button-container img.dx-vam {
        margin-right: 1em !important;
    }

.dxeRadioButtonList_KnijffMaterial td.dxe,
.dxeCheckBoxList_KnijffMaterial td.dxe {
    padding-left: 3px !important;
}

.dxEditors_edtRadioButtonUnchecked_KnijffMaterial {
    background: url(/Content/Images/Otmis4/inactive.svg);
    background-position: center center;
}

    .dxEditors_edtRadioButtonUnchecked_KnijffMaterial:hover {
        background: url(/Content/Images/Otmis4/hovered.svg);
        background-position: center center;
    }

.dxEditors_edtRadioButtonChecked_KnijffMaterial {
    background: url(/Content/Images/Otmis4/active.svg);
    background-position: center center;
}

.dxWeb_edtCheckBoxUnchecked_KnijffMaterial.switch-button {
    background: url(/Content/Images/Otmis4/switch-off.svg) !important;
    background-position: center center !important;
    background-repeat: no-repeat !important;
    width: 4em;
}

.dxWeb_edtCheckBoxChecked_KnijffMaterial.switch-button {
    background: url(/Content/Images/Otmis4/switch-on.svg) !important;
    background-position: center center !important;
    background-repeat: no-repeat !important;
    width: 4em;
}

/* --- End Light Layout --- */

/* --- Start Content Styles */

.ot4-desktop {
    display: table;
    table-layout: fixed;
    width: auto;
    height: 100%;
}

.ot4-table-row {
    display: table-row;
}

.ot4-table-cell {
    display: table-cell;
    vertical-align: top;
    text-align: left;
}

.ot4-table-row .ot4-table-cell:first-child {
    padding-right: 128px;
}

.top-aligned .ot4-table-cell {
    vertical-align: top;
    padding-top: 64px;
}

.ot4-table-cell .tile-wrapper {
    display: inline-block;
    width: auto;
}

.ot4-table-cell .bigTileOuterPanel {
    position: relative;
    width: 584px;
    height: 360px;
    display: inline-block;
    text-align: center;
    border-radius: 8px;
    background-color: #f1f2f4;
    box-shadow: 0 16px 16px -1px rgba(10, 22, 70, 0.1), 0 0 1px 0 rgba(10, 22, 70, 0.06);
    transition: all linear 300ms;
    -webkit-transition: all linear 300ms;
    -moz-transition: all linear 300ms;
    -o-transition: all linear 300ms;
}



.description-container {
    position: absolute;
    top: 48.88%;
    left: 6.84%;
    width: 68.15%;
    text-align: left;
}

    .description-container .header-big {
        font-family: 'SSP Bold' !important;
        font-size: 2.84em;
        line-height: 4rem;
        color: #4e5d78 !important;
    }

    .description-container .normal-text-small {
        color: #4e5d78 !important;
        width: 74.87%
    }

.numbers-container {
    position: absolute;
    right: 6.84%;
    top: 9.5%;
    text-align: right;
}

    .numbers-container .number {
        font-family: 'SSP Bold' !important;
        font-size: 2.84em;
        line-height: 4rem;
        color: #8a94a6 !important;
    }

        .numbers-container .number.red {
            color: #dd2727 !important;
        }

    .numbers-container .number-description {
        font-size: 1.5em;
        line-height: 1.7rem;
        color: #8a94a6 !important;
    }

.tile-wrapper .button-wrapper {
    position: absolute;
    right: 6.84%;
    bottom: 11.11%;
}

.icon-container {
    position: absolute;
    top: 9.5%;
    left: 6.84%;
    width: 8em;
    height: 8em;
}


[class^="ot4-img-"],
[class*=" ot4-img-"] {
    background-repeat: no-repeat;
    background-position: center center;
    background-size: contain;
    height: 100%;
}

.ot4-img-notifications {
    background-image: url(/Content/Images/Otmis4/home-notifications.svg);
}

.ot4-img-portfolio {
    background-image: url(/Content/Images/Otmis4/home-ip-portfolio.svg);
}

.ot4-img-watching {
    background-image: url(/Content/Images/Otmis4/home-watching.svg);
}

.ot4-img-contact {
    background-image: url(/Content/Images/Otmis4/home-contact.svg);
}

.ot4-img-trademarks {
    background-image: url(/Content/Images/Otmis4/trademarks.svg);
}

.ot4-img-designs {
    background-image: url(/Content/Images/Otmis4/designs.svg);
}

.ot4-img-conflicts {
    background-image: url(/Content/Images/Otmis4/conflicts.svg);
}

.ot4-img-domains {
    background-image: url(/Content/Images/Otmis4/domain-names.svg);
}

.ot4-img-download .smallTileIcon img {
    display: none;
}

.ot4-img-download .smallTileIcon:before {
    font-family: OtmisIcons !important;
    font-style: normal !important;
    font-weight: normal !important;
    font-variant: normal !important;
    font-size: 1.17em;
    text-transform: none !important;
    speak: none;
    line-height: 1;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    position: absolute;
    right: 12px;
    color: #14284b;
    font-size: 1em;
    content: 'q';
}

.ot4-img-download:hover .smallTileIcon:before {
    color: #759dd5;
}

.ot4-img-details {
    background-image: url(/Content/Images/Otmis4/row_details.svg);
}

/* --- End Content Styles --- */
/* --- Start Popup Styles --- */
#PopupPanel {
    width: 100% !important;
    height: auto !important
}

#PopupContent {
    vertical-align: text-top;
    color: #4e5d78 !important;
    padding: 0px 8% 3em;
}

.popup-control {
    background-color: #ffffff !important;
    border-radius: 8px !important;
    box-shadow: 0 32px 40px -2px rgba(10, 22, 70, 0.12), 0 0 1px 0 rgba(10, 22, 70, 0.06);
    width: 480px;
}

    .popup-control .close-popup-button {
        display: inline-block;
        width: 2em;
        position: absolute;
        top: 0;
        right: 0.7em;
        cursor: pointer;
    }

        .popup-control .close-popup-button.ot4i-invalid:hover:before {
            color: #759dd5 !important;
        }

        .popup-control .close-popup-button.ot4i-invalid:before {
            font-size: 1.7em;
        }

.simple-page-wrapper h1 {
    font-family: 'SSP Semi Bold' !important;
    color: #4e5d78 !important;
}

.simple-page-wrapper h3 {
    font-family: 'SSP Semi Bold' !important;
    color: #4e5d78 !important;
}

.form-wrapper h5,
.popup-control h5,
h5.dxm-content {
    font-family: 'SSP Black' !important;
    font-size: 1.67em !important;
    line-height: 1.6em;
    color: #4e5d78 !important;
}

.form-wrapper h5 {
    font-size: 2em !important;
    line-height: 1.5em !important;
}

.popup-control .button-container {
    display: block;
    width: 28.33%;
    position: absolute;
    bottom: 7.4%;
    left: 35.83%;
}

.popup-control .button-container-centered {
    display: block;
    width: 28.33%;
    position: static;
    margin: 0 auto;
}

.popup-control .bookmark-icon,
.popup-control .warning-icon,
.popup-control .settings-icon,
.popup-control .contact-icon,
.popup-control .party-icon,
.popup-control .info-icon,
.popup-control .send-icon {
    display: block;
    width: 10%;
    padding-bottom: 10%;
    margin: 2em auto 1em;
    background-image: url(/Content/Images/Otmis4/party.svg);
    background-repeat: no-repeat;
    background-position: center center;
    background-size: contain;
}

.header-container .warning-icon {
    background-repeat: no-repeat;
    background-position: center center;
    background-size: contain;
    width: 56px;
    height: 56px;
    margin: 1em 0 0 0;
    float: right;
}

.header-container .warning-icon,
.popup-control .warning-icon {
    background-image: url(/Content/Images/Otmis4/alert-solid.svg);
}

.popup-control .send-icon {
    background-image: url(/Content/Images/Otmis4/send.png);
}

.popup-control .contact-icon {
    background-image: url(/Content/Images/Otmis4/home-contact.svg);
}

.popup-control .settings-icon {
    background-image: url(/Content/Images/Otmis4/checked.svg);
}

.popup-control .bookmark-icon {
    background-image: url(/Content/Images/Otmis4/bookmark-solid.svg);
}

.popup-control .info-icon {
    background-image: url(/Content/Images/Otmis4/info.svg);
    width: 48px;
    height: 48px;
}

.popup-control .popup-content {
    font-size: 1em !important;
    line-height: 1.7em !important;
    color: #4e5d78 !important;
    padding: 8.33%;
    width: 100%;
    text-align: left;
}

    .popup-control .popup-content.custom-popup {
        padding: 2% 4.14% 8.33% 4.14%;
        font-family: 'SSP Regular' !important;
        font-size: 16px !important;
        font-weight: 600;
    }

.image-wrapper {
    display: block;
    width: 16em;
    height: 16em;
    margin: 4em auto;
    background-repeat: no-repeat;
    background-position: center center;
    background-size: contain;
}

    .image-wrapper.warning-icon {
        background-image: url(/Content/Images/Otmis4/alert-solid.svg);
    }

    .image-wrapper.checked-icon {
        background-image: url(/Content/Images/Otmis4/checked.svg);
    }

/* --- End Popup Styles --- */

#TeamLeaderPhotoPanel {
    text-align: right;
    padding-right: 9%;
    vertical-align: top;
    color: #4e5d78 !important;
}

.leader-title {
    font-family: 'SSP Regular';
    font-size: 1.34em;
    line-height: 1.85em;
    color: #4e5d78 !important;
}

#CaseTagAddForm .submit-button-container,
#CaseTagDeleteForm .submit-button-container,
#RequestActionForm .submit-button-container,
#LogOutForm .submit-button-container {
    text-align: center !important;
}

    #LogOutForm .submit-button-container:not(.cancel-button) .dxbButton_KnijffMaterial {
        background-color: #ffad0d;
        border: solid 2px #ffad0d;
    }

        #LogOutForm .submit-button-container:not(.cancel-button) .dxbButton_KnijffMaterial:hover {
            border: solid 2px #f07300;
        }

    #CaseTagDeleteForm .submit-button-container:not(.cancel-button) .dxbButton_KnijffMaterial {
        background-color: #dd2727;
        border: solid 2px #dd2727;
    }

        #CaseTagDeleteForm .submit-button-container:not(.cancel-button) .dxbButton_KnijffMaterial:hover {
            border: solid 2px #a50000;
            background-color: #a50000;
        }

#RequestActionForm .dxeMemo_KnijffMaterial > tbody > tr > td {
    padding-bottom: 0.5em !important;
}

/* --- Cases Styles --- */
.dxtcLite_KnijffMaterial.dxtc-top > .dxtc-content {
    border-top-style: none !important;
    padding: 3em 0px !important;
    padding-left: 10px !important;
}

[class^="dxgv"],
[class*=" dxgv"],
.dxgvControl_KnijffMaterial,
.dxeButtonEdit_KnijffMaterial,
.dxucTextBox_KnijffMaterial,
.dxeButtonEdit_KnijffMaterial .dxeEditArea_KnijffMaterial,
.dxeButtonEditSys .dxeButtonEditButton_KnijffMaterial,
.dxtcLite_KnijffMaterial > .dxtc-content {
    font-family: 'SSP Regular' !important;
    color: #4e5d78 !important;
    background-color: #ffffff !important;
}

tr.dxgvDataRowHover_KnijffMaterial.dxh1h,
tr.dxgvDataRowHover_KnijffMaterial.dxh1h td {
    background-color: #e9f4ff !important;
}

.dxgvHeader_KnijffMaterial {
    background-color: #e1e4e8 !important;
    font-size: 1.17em !important;
    line-height: 1.7em !important;
    padding: 0px;
}

.dxgvFilterRow_KnijffMaterial .dxgv {
    padding: 0.25em 15px 0.5em 5px !important;
    border-bottom: 2px #414042 solid !important;
}

.dxgvHeader_KnijffMaterial td,
.dxgvEditFormDisplayRow_KnijffMaterial td.dxgv,
.dxgvDetailCell_KnijffMaterial td.dxgv,
.dxgvDataRow_KnijffMaterial td.dxgv,
.dxgvDetailRow_KnijffMaterial.dxgvADR td.dxgvAIC {
    padding: 1em 10px 1em 16px !important;
}

.dxichCellSys label {
    cursor: pointer;
}

.dxgvEmptyDataRow_KnijffMaterial div {
    font-family: 'SSP Semi Bold' !important;
    font-size: 1.17em;
    line-height: 1.7rem;
}

.dxeTextBoxDefaultWidthSys {
    width: 100% !important;
}

#ContactViewPanel .dxflNestedControlCell_KnijffMaterial table {
    width: 100% !important;
}

.account-selector {
    position: relative;
    display: inline-block;
    margin: 2.5em auto;
    width: 100%;
    left: -5em;
}

    .account-selector .dxeFocused_KnijffMaterial {
        border: solid 1px #5aacff !important;
    }

    .account-selector .dxeButtonEditButtonHover_KnijffMaterial,
    .account-selector .dxeButtonEditButtonHover_KnijffMaterial {
        color: #4e5d78 !important;
    }

    .account-selector .dxeEditArea_KnijffMaterial {
        font-family: 'SSP Semi Bold' !important;
        font-size: 1.17em !important;
        line-height: 1em !important;
    }

    .account-selector .dxeButtonEditSys {
        box-shadow: 0 3px 3px -1px rgba(10, 22, 70, 0.1), 0 0 1px 0 rgba(10, 22, 70, 0.06);
    }

        .account-selector .dxeButtonEditSys .dxic {
            padding: 10px 8px 11px !important;
        }

    .account-selector .dxeListBoxItemRow_KnijffMaterial {
        height: 4em;
    }

    .account-selector .dxeListBoxItem_KnijffMaterial {
        padding-left: 4em;
        background-image: url(/Content/Images/Otmis4/with-icon.svg);
        background-repeat: no-repeat;
        background-position: 0.5em 1em;
        background-size: 32px 32px;
    }

#TeamLeaderPhotoPanel img {
    min-width: 104px;
}

#AccountSettingsForm1_0_3 {
    width: calc(100% - 50px) !important;
}

#AccountSettingsForm1_0_4 {
    width: 50px !important;
    float: none !important;
    display: inline-block;
}

.switch-button-input {
    width: 50px !important;
}
.switchOnClass {
    color: #5481C1;
    font-weight:bold;
}
.ot4-case-detail-tab {
    display: inline-block;
    min-width: 116px;
    padding: 0em 0.5em;
    height: 40px;
    margin-right: 10px;
    border-bottom: 2px solid #ffffff;
}

    .ot4-case-detail-tab.active {
        border-bottom: 2px solid #759dd5;
    }

    .ot4-case-detail-tab:not(.active):hover {
        border-bottom: 2px solid #b0b7c3;
    }

.ot4-case-detail-caption {
    font-family: 'SSP Semi Bold' !important;
    font-size: 1.17em !important;
    line-height: 1.7em !important;
    text-align: center;
    color: #4e5d78;
}

[class^="ot4-status-"],
[class*=" ot4-status-"] {
    display: inline-block;
    padding: 5px 8px;
    text-align: center;
    color: #ffffff;
    font-size: 12px !important;
    min-width: 8em;
    border-radius: 3px;
    margin-top: 1em;
    margin-bottom: 2em;
}

.cell [class^="ot4-status-"],
.cell [class*=" ot4-status-"] {
    margin-top: 0px;
}

.ot4-status-registered {
    background-color: #0BB07B;
}

.ot4-status-refused {
    background-color: red;
}

.ot4-status-pending {
    background-color: #F89728;
}

.ot4-status-partially-registered {
    background-color: #CFF8EB;
    border: 1px solid #0BB07B;
    color: #4E5D78;
}

.ot4-status-finalized {
    background-color: #EC008C;
}

.ot4-status-3dr-party,
.ot4-status-abandond,
.ot4-status-case-closed {
    border: 1px solid silver;
    color: #4e5d78;
}

.ot4-statustext {
    font-family: 'SSP Black' !important;
    font-size: 12px !important;
    line-height: 1.17em;
    text-transform: uppercase;
}

.ot4-mark-image {
    width: 18vw;
    height: 18vw;
    border: 1px solid #b0b7c3;
    display: table-cell;
    vertical-align: middle;
}

    .ot4-mark-image img {
        width: 90% !important;
        left: 5%;
    }

.column-40 {
    width: 40% !important;
    vertical-align: top;
}

.column-45 {
    width: 45.5% !important;
    vertical-align: top;
}

.column-50 {
    width: 50% !important;
    vertical-align: top;
}

.column-54 {
    width: 47.5% !important;
    vertical-align: top;
}

.column-60 {
    width: 60% !important;
    vertical-align: top;
}

.column-auto {
    width: auto !important;
    vertical-align: top;
}

.detailCleanUpPane {
    padding-top: 1em;
}

.case-info-caption-cell {
    display: table-cell;
    width: 208px;
    padding-right: 16px;
    padding-bottom: 4px;
    vertical-align: top;
}

    .case-info-caption-cell.slim {
        width: 35%;
    }

.normal-text.red,
.red {
    color: #dd2727 !important;
}

.normal-text.red {
    font-family: 'SSP Bold' !important;
}

.may-lapse {
    display: inline-block;
    width: 109px;
    height: 24px;
    font-family: SSP Bold;
    font-size: 12px;
    line-height: 1.76em;
    text-align: center;
    color: #006ce6;
    background-color: #EEF7FF;
    border: 1px solid #83C3FE;
    border-radius: 3px;
    margin-left: 2em;
}

.ot4-bottom-border {
    border-bottom: 1px solid #e1e4e8 !important;
}

.ot4-goto-contact,
.ot4-save-to-pdf {
    background-color: #EBF5FF;
    color: #0d55cf;
    font-family: SSP Bold;
    font-size: 12px;
    line-height: 1.67;
    border-color: #759DD5 !important;
    position: relative;
}

    .ot4-goto-contact div.dxb,
    .ot4-save-to-pdf .dxb {
        padding: 2px 36px 2px 12px !important;
    }

    .ot4-save-to-pdf:before,
    .ot4-goto-contact:before {
        font-family: OtmisIcons !important;
        font-style: normal !important;
        font-weight: normal !important;
        font-variant: normal !important;
        font-size: 1.17em;
        text-transform: none !important;
        speak: none;
        line-height: 1;
        -webkit-font-smoothing: antialiased;
        -moz-osx-font-smoothing: grayscale;
        position: absolute;
        right: 12px;
        top: 0.7em;
        color: #759dd5;
        font-size: 1.17em;
    }

    .ot4-goto-contact:before {
        content: 'p';
    }

    .ot4-save-to-pdf:before {
        content: 'q'
    }

.ot4-save-to-pdf {
    margin-right: 16px;
}

    .ot4-save-to-pdf:hover:before,
    .ot4-goto-contact:hover:before,
    .ot4-goto-contact:hover,
    .ot4-save-to-pdf:hover {
        color: #ffffff;
    }

.slimScrollDivNoPadding {
    padding-right: 24px;
}

.slimScrollRail {
    padding: 0px 4px;
}

.slimScrollBar {
    margin-right: 2px;
}

.sub-header {
    font-family: SSP Black;
    font-size: 1.75em;
    line-height: 1.17em;
    color: #4e5d78;
    width: 34% !important;
    white-space: nowrap;
}

[class^="dxgvDataRow_"] .dxgv,
[class*=" dxgvDataRow_"] .dxgv {
    font-family: 'SSP Regular' !important;
    font-size: 1.17em !important;
    line-height: 1.7em !important;
    color: #4e5d78 !important;
}

.grid-page-size .dxp-comboBox {
    background-color: #ffffff;
    border: 1px solid #e1e4e8;
    border-radius: 4px;
    padding: 3px 4px 4px 4px !important;
}

    .grid-page-size .dxp-comboBox input {
        font-family: 'SSP Semi Bold' !important;
        font-size: 1em !important;
        color: #0a1f44;
        line-height: 1.17em !important;
    }

    .grid-page-size .dxp-comboBox .dxp-dropDownButton {
        background: none;
        background-color: transparent !important;
    }

.grid-page-size .dxp-dropDownButton img {
    background-position: -22px -305px !important;
}

.grid-page-size .dx {
    margin-top: 0.75em;
    font-family: 'SSP Semi Bold' !important;
    font-size: 1.17em !important;
    line-height: 1.7em !important;
    color: #4e5d78 !important;
    margin-right: 0.5em;
}

.dxpLite_KnijffMaterial .dxp-comboBox {
    /*border-style: none !important;*/
    background-color: transparent !important;
    font-family: 'SSP Regular' !important;
    font-size: 1.17em !important;
    line-height: 1.7em !important;
    color: #4e5d78 !important;
}

.dxgvPagerBottomPanel_KnijffMaterial {
    border-top-style: none !important;
}

#CaseTagAddForm #AddTagButton,
#CaseTagDeleteForm #CaseTagDeleteButton,
#RequestActionForm #RequestButton,
#LogOutForm #CancelFormButton {
    float: right;
    margin-right: 8px;
}

#CaseTagAddButton #CancelAddTagButton,
#RequestActionForm #CancelRequestAction,
#LogOutForm #LogOutButton,
#CaseTagDeleteForm #CaseTagDeleteCancelButton {
    margin-left: 8px;
}

img.dxis-overlayElement, .dxis-overlayElement > img {
    opacity: 0;
    filter: progid:DXImageTransform.Microsoft.Alpha(Style=0, Opacity=0)
}

.dxisControl > .dxis-passePartout > .dxis-prevBtnHorWrapper,
.dxisControl > .dxis-passePartout > .dxis-prevBtnHorOutsideWrapper,
.dxisControl > .dxis-passePartout > .dxis-nextBtnHorWrapper,
.dxisControl > .dxis-passePartout > .dxis-nextBtnHorOutsideWrapper {
    top: 115% !important;
    width: 64px;
    height: 40px;
    border-radius: 8px;
    background-color: #f1f2f4 !important;
    box-shadow: 0 3px 3px -1px rgba(10, 22, 70, 0.1), 0 0 1px 0 rgba(10, 22, 70, 0.06);
    z-index: 100;
}

.dxis-prevBtnHor,
.dxis-nextBtnHor {
    margin: 0px !important;
    height: 100%;
    width: 100%;
    background: none;
}

.dxisControl .dxis-prevBtnHorWrapper, .dxisControl .dxis-prevBtnHorOutsideWrapper {
    left: 29% !important;
}

.dxisControl .dxis-nextBtnHorWrapper, .dxisControl .dxis-nextBtnHorOutsideWrapper {
    right: 29% !important;
}

.dxis-prevBtnHor:before,
.dxis-nextBtnHor:before {
    font-family: OtmisIcons !important;
    font-style: normal !important;
    font-weight: normal !important;
    font-variant: normal !important;
    font-size: 2em !important;
    text-transform: none !important;
    speak: none;
    line-height: 1;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    position: absolute;
    left: 30%;
    top: 20%;
    color: #a7aebb !important;
    display: inline-block;
    pointer-events: none;
}

.dxis-prevBtnHor.dxis-prevBtnHorDisabled:before,
.dxis-nextBtnHor.dxis-nextBtnHorDisabled:before {
    color: #e1e4e8 !important;
}

.dxis-prevBtnHor.dxis-prevBtnHorHover:before,
.dxis-nextBtnHor.dxis-nextBtnHorHover:before {
    color: #4e5d78 !important;
}

.dxis-prevBtnHor:before {
    content: 't';
}

.dxis-nextBtnHor:before {
    content: 'u';
}

#NotificationCentralPanel {
    flex-basis: 100% !important;
    padding-left: 0 !important;
}

.dxgvDataRow_KnijffMaterial td.dxgv {
    border-bottom: 1px solid #c9ced6;
}

.riskLevelTableCell {
    width: 100%;
}

.riskLevelCircle {
    vertical-align: middle;
    position: relative;
    top: -1px;
    margin-left: 0px;
    margin-right: 8px;
    box-shadow: 0 3px 3px -1px rgba(10, 22, 70, 0.1), 0 0 1px 0 rgba(10, 22, 70, 0.06);
    background-color: #ffffff;
}

td.dxgv.passed-deadline {
    font-family: 'SSP Bold';
    font-size: 14px;
    font-weight: bold;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.71;
    letter-spacing: normal;
    color: #d41e1b !important;
}

td.dxgvCommandColumn_KnijffMaterial.dxgv {
    padding-left: 0px !important;
    padding-right: 0px !important;
}

    td.dxgvCommandColumn_KnijffMaterial.dxgv span {
        margin: 0 !important;
        width: auto !important;
        height: 24px !important;
    }

div.standardBackgroundColor {
    background-color: transparent !important;
}

.notification-header-cell {
    display: table-cell;
    background-color: #e1e4e8;
    vertical-align: middle;
    padding: 16px;
}

.notification-detail-header {
    font-family: 'SSP Bold';
    font-size: 14px;
    font-weight: bold;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.71;
    letter-spacing: normal;
    color: #4e5d78;
}

.notification-detail-content {
    background-color: #f7f8f9;
    border-right: 16px solid #fff;
}

    .notification-detail-content .dxbButton_KnijffMaterial {
        margin: 0 auto;
    }

.mark-detail-container {
    height: 288px;
    vertical-align: middle;
    display: table-cell;
}

.text-for-information-purposes {
    font-family: 'SSP Bold';
    font-size: 16px;
    font-weight: bold;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.75;
    letter-spacing: normal;
    color: #4e5d78;
}

h5.text-mark {
    font-family: 'SSP Bold';
    font-size: 20px !important;
    font-weight: bold;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.6;
    letter-spacing: normal;
    text-align: center;
    color: #4e5d78;
}

.mark-label {
    font-family: 'SSP Regular';
    font-size: 14px;
    font-weight: normal;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.71;
    letter-spacing: normal;
    color: #4e5d78;
    white-space: normal;
}

    .mark-label.bold {
        font-family: 'SSP Black';
        font-weight: 900;
    }

#DecisionMenu {
    width: auto;
}

#InfringementAlertMessageTextView {
    width: 100%;
}

.img-action-modal {
    height: auto;
    border-radius: 2px;
    border: solid 2px #ffad0d;
    left: 0px;
    right: 0px;
    bottom: 0px;
    vertical-align: bottom;
    position: absolute;
}

.dxtcLite_KnijffMaterial.dxtc-top > .dxtc-content.tabbed-page {
    padding: 0em 0em 0em 0em !important;
    width: 95%;
}

#NotificationGridView_col9 table > tbody > tr > td:last-of-type {
    display: none;
    visibility: collapse;
}

#AlertIDHeader {
    display: inline-block;
    position: relative;
    top: 12px;
}

#CaseGridView.otm4-normal-grid {
    display: table;
}

#CaseGridViewCompact {
    display: none;
}

.otm4-header-cell table > tbody > tr > td:last-of-type {
    padding: 1em 8px 1em 0px !important;
}

.otm4-compact-grid .dxgvHeader_KnijffMaterial td,
.otm4-compact-grid .otm4-header-cell table > tbody > tr > td:last-of-type {
    padding: 0em 0.5em !important;
}

.otm4-compact-grid #CaseGridView_DXHeadersRow0 > td {
    padding-top: 0.25em !important;
}

.otm4-compact-grid #CaseGridView_DXHeadersRow1 > td {
    padding-bottom: 0.25em !important;
}

.otm4-compact-grid [id^="CaseGridView_DXDataRow"][id$="_0"] {
    background: none;
    background-color: lightyellow !important;
}

    .otm4-compact-grid [id^="CaseGridView_DXDataRow"][id$="_0"] td {
        border-bottom-style: none !important;
        background-color: transparent !important;
    }

        .otm4-compact-grid [id^="CaseGridView_DXDataRow"][id$="_0"] td[rowspan],
        .otm4-compact-grid [id^="CaseGridView_DXDataRow"][id$="_1"] td {
            border-bottom-style: solid !important;
        }


.case-tag {
    display: inline-block;
    height: 24px;
    border-radius: 4px;
    font-family: 'SSP Regular';
    font-size: 12px;
    font-weight: normal;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.67;
    letter-spacing: normal;
    text-align: center;
    color: #0d55cf;
    background-color: #ebf5ff;
    margin: 0px 8px 25px 0;
    padding: 2px 8px;
}

    .case-tag .delete-case-tag {
        display: inline-block;
        width: 17px;
        height: 16px;
        margin-left: 9px;
        float: right;
        background: url(../Content/Images/Otmis4/delete-tag.svg) no-repeat center center;
        background-size: 16px 16px;
        position: relative;
        top: 2px;
        left: 2px;
        cursor: pointer;
    }

        .case-tag .delete-case-tag:hover {
            background: url(../Content/Images/Otmis4/hover-delete-tag.svg) no-repeat center center;
            background-size: 16px 16px;
        }

#GoToButtonAddTagButton {
    display: inline-block !important;
    height: 24px;
    width: auto !important;
    border-radius: 4px;
    font-family: 'SSP Regular';
    font-size: 12px;
    font-weight: normal;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.76em;
    letter-spacing: normal;
    text-align: center;
    color: #0d55cf;
    background-color: #e1e4e8;
    margin: 0px 8px 25px 0 !important;
    padding: 0px 8px !important;
    border-style: none;
    vertical-align: top;
}

    #GoToButtonAddTagButton:hover {
        background-color: #4172b4;
    }

    #GoToButtonAddTagButton div {
        display: inline-block;
        padding: 0px !important;
        border-style: none;
        padding: 0px !important;
    }

        #GoToButtonAddTagButton div span.dx-vam {
            font-family: 'SSP Regular' !important;
            font-size: 12px !important;
            font-weight: normal !important;
            font-stretch: normal !important;
            font-style: normal !important;
            padding: 0px !important;
        }

    #GoToButtonAddTagButton:hover div span.dx-vam {
        color: #ffffff;
    }

.dxpLite_KnijffMaterial:not(.dxpLiteDisabled_KnijffMaterial) .dxp-num:not(.dxp-current):hover {
    color: #fff !important;
    text-decoration: none;
}

.notification-type-container {
    display: block;
    width: 80%;
    height: 2em;
    line-height: 2em;
    text-align: center;
    color: #fff;
    background-color: #759dd5;
    border-radius: 3px;
}

.dxgvHeader_KnijffMaterial.no-sort {
    cursor: default !important;
}

    .dxgvHeader_KnijffMaterial.no-sort > table td:last-of-type {
        display: none !important;
    }

.details-icon img {
    margin-right: 0.5em;
}

.hidden {
    display: none !important;
}

.canvas-target canvas {
    left: 0;
}

.status-cell-token {
    border-radius: 3px;
    text-align: center;
    max-width: 300px;
}

.notification-overview-grid span img {
    margin: 0 !important;
}

#NotificationCaseStateCombo {
    display: inline-table !important;
}

.ot4i-sub-item.collapsed + .dxm-separator,
.ot4i-sub-item.collapsed {
    display: none;
    transition-duration: 0;
    transition: none;
}

.dxmLite_KnijffMaterial .dxm-disabled,
.dxmLite_KnijffMaterial .dxm-disabled a.dx,
.dxmLite_KnijffMaterial .dxm-disabled a span.dx-vam,
.dxmLite_KnijffMaterial .dxm-disabled div.dxm-hasText span.dx-vam {
    background-color: inherit;
    color: #ffffff !important;
    cursor: pointer !important;
}

/* Accounts (start) */

.ot41-label {
    margin: 0 0 4px;
    font-size: 12px;
    font-weight: normal;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.67;
    letter-spacing: normal;
    color: #4e5d78;
}

.ot41-input {
    border: solid 1pt #e1e4e8;
    border-radius: 8px;
    background-color: #fff;
    color: #0a1f44;
    font-size: 14px;
    position: relative;
}

    .ot41-input.disabled {
        background-color: #e1e4e8;
    }

    .ot41-input:focus-within {
        border: solid 2px #5aacff;
    }

.ot41-text-box,
.ot41-combobox {
    display: block;
    position: relative;
    width: 100%;
    border: solid 1pt #e1e4e8;
    border-radius: 8px;
    color: #0a1f44;
    font-size: 14px;
    margin: 1px 0px;
}

    .ot41-text-box > input,
    .ot41-combobox > div {
        display: inline-block;
        width: 100%;
        padding: 8px 24px 8px 16px;
        line-height: 21px;
        background-color: #fff;
        border-radius: 8px;
    }

.ot41-combobox {
    min-height: 40px;
    margin: 0;
    border: solid 2px #5aacff;
}

.ot41-text-box > input {
    padding: 8px 28px 8px 12px;
    font-family: 'SSP Regular' !important;
    font-size: 14px;
    color: #0a1f44;
}

.ot41-text-box.searchField {
    background: url(/Content/Images/Otmis4/icon-search.svg) !important;
    background-position: right 8px center !important;
    background-repeat: no-repeat !important;
}

    .ot41-text-box.searchField > input {
        background-color: transparent;
    }

.ot41-input:focus-within:after,
.ot41-input.active:after,
.ot41-combobox:after {
    content: "\69";
    display: inline-block;
    position: absolute;
    top: 33%;
    right: 12px;
    font-family: OtmisIcons !important;
    font-style: normal !important;
    font-weight: normal !important;
    font-variant: normal !important;
    font-size: 12px;
    text-transform: none !important;
    cursor: pointer;
    transform: rotate(90deg);
}

.ot41-input.expanded:after,
.ot41-combobox:not(.collapsed):after,
.ot41-combobox.selected:after {
    transform: none !important;
    color: #5aacff;
}

.ot41-text-box:focus-within {
    border: solid 2px #5aacff;
}

.ot41-input.active {
    border: solid 2px #5aacff;
}

.ot41-combobox.active:not(.collapsed):after {
    color: #5481c1;
}

.ot41-combobox.active {
    font-weight: 600;
}

.ot41-combobox-list {
    cursor: pointer;
    position: absolute;
    z-index: 10;
    width: 224px;
    padding: 8px;
    border-radius: 12px;
    box-shadow: 0 16px 16px -1px rgba(10, 22, 70, 0.1), 0 0 1px 0 rgba(10, 22, 70, 0.06);
    background-color: #fff;
}

    .ot41-combobox-list.teamSelectOptions {
        width: 300px;
    }

.ot41-combobox-option {
    display: inline-block;
    width: 100%;
    padding: 8px 24px 8px 8px;
    line-height: 21px;
    border-radius: 4px;
    color: #4e5d78;
    font-size: 14px;
    cursor: pointer;
}

    .ot41-combobox-option:hover {
        background-color: #f1f2f4;
        color: #0a1f44;
    }

.selectoption.ot41-combobox-option {
    display: flex;
    align-items: center;
}

    .selectoption.ot41-combobox-option .selectoptiontext {
        margin-left: 12px;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
    }

.account-status {
    width: 140px;
    height: 24px;
    color: white;
    text-align: center;
    border-radius: 4px;
    text-transform: uppercase;
}

.pageTab {
    display: inline-block;
    width: 240px;
    height: 40px;
    font-size: 14px;
    font-weight: 600;
    text-align: center;
    cursor: pointer;
    color: #4e5d78;
}

    .pageTab.selected {
        border-bottom: solid 2pt #759dd5;
    }

.pageTabSpace {
    display: block;
    height: 50px;
}

.-Icon-style {
    display: inline-block;
    width: 21px;
    height: 21px;
    border-radius: 50%;
    background-color: #f89734;
    color: white;
    cursor: pointer;
    line-height: 1.67rem;
}

.PartyParent {
    margin-bottom: 16px;
    width: 500px;
}

.PartyParentInner {
    display: flex;
    align-items: center;
}

.removeparty {
    background-color: #5481c1;
    margin-left: 18px;
    font-family: OtmisIcons !important;
    font-style: normal !important;
    font-weight: normal !important;
    font-variant: normal !important;
    text-transform: none !important;
    font-size: 18px;
    -webkit-transition: opacity linear 3ms;
    -moz-transition: opacity linear 3ms;
    transition: opacity linear 3ms;
}

.switch-option {
    display: block;
    margin-top: 24px;
}

.text-description {
    display: inline-block;
    margin-left: 16px;
}

.text-title {
    margin: 0 0 4px 0;
    font-size: 16px;
    font-weight: bold;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.75;
    letter-spacing: normal;
    color: #4e5d78;
}

.text-subtitle {
    width: 400px;
    height: 40px;
    margin: 4px 0 0 0;
    font-size: 12px;
    font-weight: 600;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.67;
    letter-spacing: normal;
    color: #4e5d78;
}

.section-headers {
    margin: 0 0 4px 0.5px;
    font-size: 34px;
    font-weight: bold;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.41;
    letter-spacing: normal;
    color: #4e5d78;
}

.text-warning {
    margin: 40px 96px 32px 8px;
    padding-top: 20px;
    font-size: 12px;
    font-weight: 600;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.67;
    letter-spacing: normal;
    color: #4e5d78;
    border-top: solid 1px #b0b7c3;
}

    .text-warning:before {
        content: 'i';
        margin-right: 18px;
        display: inline-block;
        font-style: normal !important;
        font-weight: normal !important;
        font-variant: normal !important;
        text-transform: none !important;
        text-align: center;
        font-size: 16px;
        width: 21px;
        height: 21px;
        border-radius: 50%;
        background-color: #f89734;
        color: white;
        cursor: pointer;
        line-height: 1.75rem;
        position: relative;
        top: 2px;
    }

.bold-input {
    font-weight: 600;
    width: 100%;
    line-height: 2.35em;
}

::placeholder {
    font-weight: 400 !important;
}

.-State.stretch {
    margin-bottom: 0;
}

.lookedUpParties,
.lookedUpCRMs {
    position: absolute;
    z-index: 100;
    overflow-y: auto;
    width: 463px;
    max-height: 200px;
    padding: 8px;
    border-radius: 12px;
    box-shadow: 0 16px 16px -1px rgba(10, 22, 70, 0.1), 0 0 1px 0 rgba(10, 22, 70, 0.06);
    background-color: #fff;
}

.createAccount {
    width: 224px;
    height: 40px;
    margin: 64px 0;
    border-radius: 4px;
    background-color: #5481c1;
    color: white;
    cursor: pointer;
    text-align: center;
    padding-top: 10px;
    font-size: 14px;
}

    .createAccount:hover,
    .removeparty:hover {
        opacity: 0.85;
    }

.language-selector{
    max-width:300px;
    overflow:hidden;
}
@media screen and (max-width:1280px) {
    .detailColumn {
        display: block !important;
        width: 75% !important;
    }
}

/* Accounts (end) */

@media screen and (max-width:1279px) {
    td .dxflGroupCell_KnijffMaterial {
        display: block;
        width: 100% !important;
    }

        td.dxflGroupCell_KnijffMaterial table {
            padding-right: 0px !important;
        }
}

@media screen and (max-width:1620px) {
    .ot4-table-cell .bigTileOuterPanel {
        width: 467px;
        height: 288px;
    }

    .ot4-table-row :first-child.ot4-table-cell {
        padding-right: 96px;
    }
}

@media screen and (max-width:1280px) and (min-width:1025px) {
    .ot4-table-row :first-child.ot4-table-cell {
        padding-right: 64px;
    }

    .ot4-table-cell .bigTileOuterPanel {
        width: 350px;
        height: 320px;
    }

    .tile-wrapper .button-wrapper {
        position: absolute;
        right: 6.84%;
        bottom: 5.55%;
    }

    .description-container {
        top: 38.88%;
        width: 100%;
    }

    .icon-container {
        width: 5em;
        height: 5em;
    }
}

@media screen and (max-width:1024px) {
    .ot4-table-cell {
        display: block !important;
        padding-bottom: 64px;
        padding-right: 0px !important;
    }

        .ot4-table-cell .bigTileOuterPanel {
            width: 467px;
            height: 288px;
        }

    .top-aligned .ot4-table-cell {
        padding-top: 0px;
    }
}

@media all and (max-width: 1480px) {
    .dxgvHeader_KnijffMaterial td {
        white-space: normal;
        vertical-align: top;
    }

    .dxgvHeader_KnijffMaterial td,
    .dxgvEditFormDisplayRow_KnijffMaterial td.dxgv,
    .dxgvDetailCell_KnijffMaterial td.dxgv,
    .dxgvDataRow_KnijffMaterial td.dxgv,
    .dxgvDetailRow_KnijffMaterial.dxgvADR td.dxgvAIC {
        padding: 1em 0.5em 1em !important;
    }

    .otm4-compact-grid .dxgvEditFormDisplayRow_KnijffMaterial td.dxgv,
    .otm4-compact-grid .dxgvDetailCell_KnijffMaterial td.dxgv,
    .otm4-compact-grid .dxgvDataRow_KnijffMaterial td.dxgv,
    .otm4-compact-grid .dxgvDetailRow_KnijffMaterial.dxgvADR td.dxgvAIC {
        padding: 0.25em 0.5em 0.25em !important;
    }
}

@media all and (max-width:1024px) {
    .caseTopPanelLeftCell,
    .caseTopPanelRightCell {
        display: table-row;
    }
}

@media screen and (max-width: 1280px) {
    .lite-inner-container {
        width: 888px;
        height: 510px;
    }

    .login-form-container {
        padding-top: 2.94%;
        width: 40%;
    }
}

@media screen and (max-width: 1024px) {
    .lite-inner-container {
        width: 789px;
        height: 453px;
    }
}

@media screen and (max-width: 800px) {
    .login-form-container {
        width: 45%;
    }

    .lite-inner-container {
        width: 80%;
        height: 80%;
        min-height: 480px;
    }

    .dxflNestedControlCell_KnijffMaterial {
        white-space: nowrap;
    }
}

@media screen and (max-width: 480px) {
    .lite-inner-container {
        height: 95%;
        min-height: 550px;
    }

    .login-form-container {
        padding-top: 2.94%;
        width: 100%;
    }

    #LogInForm_0_3 .dxflHARSys > div {
        margin-left: 0;
        padding-left: 0px !important;
    }

    #LogInForm_0_3 .link {
        margin-left: 0.33em !important;
    }

    #LogInForm_0_2 .dxflElConSys > div {
        float: none !important;
    }

    .lite-inner-container .company-logo {
        width: 25%;
        left: 9.45%;
    }

    .lite-inner-container .arrow-cloud {
        width: 25%;
        right: 9.45%;
    }
}