.oj-applayout-content:not(.oj-complete) {
    visibility: hidden;
}

.appheader-avatar {
    width: 24px;
    height: 24px
}

.appheader-avatar:before {
    content: url("../../patterns/common/images/avatar_24px.png")
}

.oj-helper-hidden-accessible{
    display:none !important;
}

@media (-webkit-min-device-pixel-ratio: 1.5), (min-resolution: 144dpi), (min-resolution: 1.5dppx) {
    .appheader-avatar:before {
        content: url("../../patterns/common/images/avatar_24px_2x.png");
        -webkit-transform: translate(-25%, -25%) scale(0.5);
        transform: translate(-25%, -25%) scale(0.5)
    }
}

@font-face {
    font-family: HelvNeue;
    src: url('images/HelveticaNeue-Thin.otf');
}

@font-face {
    font-family: 'CloudPortalIcon';
    src: url('images/cloudportal.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'App_custom';
    src: url('fonts/App_custom.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: OracleSansRegular;
    src: url("fonts/OracleSans_Rg.ttf");
}

@font-face {
    font-family: OracleSansSemiBold;
    src: url("fonts/OracleSans_SBd.ttf");
}

html {
    font-family: OracleSansRegular, serif;
}

/* .sc-button-default */

oj-button.sc-button-default button {
    background-color: transparent !important;
}

oj-button.sc-button-default.oj-hover button {
    background-color: #fbf9f8 !important;
    color: black !important;
}

oj-button.sc-button-default.oj-active button {
    border-color: #cbcccd !important;
    color: black !important;
}

oj-button.sc-button-default.oj-active {
    outline: 1px dotted;
    border-radius: 0.25rem;
}

/* .sc-button-primary */

oj-button.sc-button-primary button:disabled {
    background-color: #6d6d7d !important;
    border-color: #6d6d7d !important;
    color: #fff !important;
}

oj-button.sc-button-primary button {
    background-color: #312d2a !important;
    border-color: #312d2a !important;
    color: #fff !important;
}

oj-button.sc-button-primary.oj-hover button {
    background-color: #3a3631 !important;
    border-color: #3a3631 !important;
}

oj-button.sc-button-primary.oj-active button {
    border-color: #3a3631 !important;
}

oj-button.sc-button-primary.oj-active {
    outline: 1px dotted;
    border-radius: 0.25rem;
}

/* Icons */
.icon-clipboard:before {
    content: "\e931";
    font-family: App_custom;
}

.oj-web-applayout-header:first-of-type {
    padding-top: 6px;
}

h2 {
    color: #000;
    font-size: 24px;
    font-weight: normal;
}

/* /Index*/

/* Global */
.js-hide {
    display: none;
}

.oj-dialog {
    width: auto;
}

.oj-dialog-header-close-wrapper {
    margin-top: -4px;
}

* {
    outline: 0;
}

.oj-animate-inline-open,
.oj-animate-inline-open .oj-message.oj-message-error {
    background-color: #ffb0b0;
}

.oj-animate-inline-open.oj-animate-inline-open-active,
.oj-animate-inline-open.oj-animate-inline-open-active .oj-message.oj-message-error {
    transition: background-color 1s 500ms;
    background-color: #fff3f3;
}

.oj-animate-inline-close,
.oj-animate-inline-close .oj-message.oj-message-error {
    opacity: 1;
}

.oj-animate-inline-close.oj-animate-inline-close-active,
.oj-animate-inline-close.oj-animate-inline-close-active .oj-message.oj-message-error {
    transition: opacity 1s;
    opacity: 0;
}

/* /Global*/
.production-alert.global:not(.shown) {
    display: none;
}

/* InstanceList */
.production-alert {
    background: #f6b947;
    position: relative;
}

.production-alert:before {
    content: '!';
    float: left;
    vertical-align: middle;
    display: inline-block;
    width: 28px;
    text-align: center;
    position: absolute;
    top: 50%;
    left: 0;
    font-size: 1.28rem;
    margin: -0.64rem 0;
    color: #ffffff;
    font-weight: bold;
}

.production-alert p {
    border: 1px solid #dde4ea;
    border-left: 0 none;
    background: #ffffff;
    margin-left: 28px;
    padding: 10px;
    font-size: 12px;
}

.production-notice {
    border: 1px solid #dde4ea;
    background: #ffffff;
    padding: 10px;
    font-size: 12px;
    color: #a5a2a2;
}

.data {
    margin-bottom: 5px;
}

.data label {
    color: #A5A2A2;
    display: inline-block;
    width: 120px;
    float: left;
    padding-right: 10px;
    white-space: nowrap;
}

.data span {
    display: inline-block;
    float: left;
}

.operation {
    font-style: italic;
    font-size: 12px;
}

.create-admin-result .oj-flex-item > span {
    margin: .4em 0 .25em 0.2em;
    display: inline-block;
    line-height: 1.6em;
    max-width: 230px;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}

.icon-font-17 {
    font-size: 17px;
}

.create-admin-confirmation .oj-messaging-inline-container {
    margin: .75em 0 -0.75em;
}

/* oj-progressbar overload */
.oj-progress-bar-embedded .oj-progress-bar {
    height: 4px;
    border: 1px none #e5e6e6;
    border-radius: 0;
    position: relative;
    box-sizing: border-box;
    overflow: hidden;
    padding: 0;
    margin-bottom: -4px;
}

.oj-progress-bar-embedded .oj-progress-bar::before {
    content: "";
    position: absolute;
    height: 100%;
    width: 100%;
    z-index: -1;
    background-color: #027bc7;
    opacity: .3;
}

.oj-progress-bar-embedded .oj-progress-bar-indeterminate .oj-progress-bar-value {
    width: 100%;
    height: 100%;
    animation: indeterminateAnimation 1s infinite linear;
    transform-origin: 0 50%;
}

@keyframes indeterminateAnimation {
    0% {
        transform: translateX(0) scaleX(0)
    }
    40% {
        transform: translateX(0) scaleX(.4)
    }
    100% {
        transform: translateX(100%) scaleX(.5)
    }
}

.oj-progress-bar-embedded .oj-progress-bar-value {
    margin: 0;
    box-sizing: border-box;
    height: 100%;
    background: #027bc7;
}

.oj-progress-bar-embedded .oj-progress-bar-overlay {
    height: 100%;
    background: url(images/animated-overlay.gif);
    opacity: 0;
}

/* /oj-progressbar overload */
.sc-button button {
    min-width: 100px;
}

oj-menu-button.oj-button-jqui.oj-selected.oj-button-half-chrome, oj-menu-button.oj-button.oj-selected.oj-button-half-chrome .oj-button-button {
    border: none;
    background: none;
}

.oj-button-jqui.oj-hover.oj-button-half-chrome,
.oj-button.oj-hover.oj-button-half-chrome .oj-button-button {
    color: transparent;
    background-color: transparent;
    border-color: transparent;
    box-shadow: none;
}

.oj-button-jqui.oj-active.oj-button-half-chrome,
.oj-button.oj-active.oj-button-half-chrome .oj-button-button {
    color: white;
    background-color: transparent;
    border-color: transparent;
    opacity: 1;
    box-shadow: none;
}

.oj-button-jqui.oj-selected.oj-button-half-chrome,
.oj-button.oj-selected.oj-button-half-chrome .oj-button-button {
    color: white;
    background-color: transparent;
    border-color: transparent;
    box-shadow: none;
}

.oj-button-jqui.oj-selected.oj-hover.oj-button-half-chrome,
.oj-button.oj-selected.oj-hover.oj-button-half-chrome .oj-button-button {
    color: #76b8e1;
    background-color: transparent;
    border-color: transparent;
}

/* Outlined buttons are similar to half-chrome buttons, but have a border in the default state. */
.user-menu-wrapper .oj-button-jqui.oj-default.oj-button-outlined-chrome,
.user-menu-wrapper .oj-button-jqui.oj-focus-only.oj-button-outlined-chrome,
.user-menu-wrapper .oj-button-jqui.oj-disabled.oj-button-outlined-chrome,
.user-menu-wrapper .oj-button.oj-default.oj-button-outlined-chrome .oj-button-button,
.user-menu-wrapper .oj-button.oj-focus-only.oj-button-outlined-chrome .oj-button-button,
.user-menu-wrapper .oj-button.oj-disabled.oj-button-outlined-chrome .oj-button-button,
.instance-list-wrapper .oj-button-jqui.oj-default.oj-button-outlined-chrome,
.instance-list-wrapper .oj-button-jqui.oj-focus-only.oj-button-outlined-chrome,
.instance-list-wrapper .oj-button-jqui.oj-disabled.oj-button-outlined-chrome,
.instance-list-wrapper .oj-button.oj-default.oj-button-outlined-chrome .oj-button-button,
.instance-list-wrapper .oj-button.oj-focus-only.oj-button-outlined-chrome .oj-button-button,
.instance-list-wrapper .oj-button.oj-disabled.oj-button-outlined-chrome .oj-button-button {
    border-color: transparent;
    background-image: none;
    box-shadow: none;
    background-color: transparent;
}

.user-menu-wrapper .oj-button-jqui.oj-default.oj-button-outlined-chrome,
.user-menu-wrapper .oj-button-jqui.oj-focus-only.oj-button-outlined-chrome,
.user-menu-wrapper .oj-button.oj-default.oj-button-outlined-chrome .oj-button-button,
.user-menu-wrapper .oj-button.oj-focus-only.oj-button-outlined-chrome .oj-button-button,
.instance-list-wrapper .oj-button-jqui.oj-default.oj-button-outlined-chrome,
.instance-list-wrapper .oj-button-jqui.oj-focus-only.oj-button-outlined-chrome,
.instance-list-wrapper .oj-button.oj-default.oj-button-outlined-chrome .oj-button-button,
.instance-list-wrapper .oj-button.oj-focus-only.oj-button-outlined-chrome .oj-button-button {
    text-shadow: none;
    color: #ffffff;
}

.user-menu-wrapper .oj-button-jqui.oj-hover.oj-button-outlined-chrome,
.user-menu-wrapper .oj-button.oj-hover.oj-button-outlined-chrome .oj-button-button,
.instance-list-wrapper .oj-button-jqui.oj-hover.oj-button-outlined-chrome,
.instance-list-wrapper .oj-button.oj-hover.oj-button-outlined-chrome .oj-button-button {
    color: #ffffff;
    background-color: transparent;
    border-color: transparent;
    box-shadow: none;
}

.user-menu-wrapper .oj-button-jqui.oj-active.oj-button-outlined-chrome,
.user-menu-wrapper .oj-button.oj-active.oj-button-outlined-chrome .oj-button-button,
.instance-list-wrapper .oj-button-jqui.oj-active.oj-button-outlined-chrome,
.instance-list-wrapper .oj-button.oj-active.oj-button-outlined-chrome .oj-button-button {
    color: white;
    background-color: transparent;
    border-color: transparent;
    box-shadow: none;
}

.user-menu-wrapper .oj-button-jqui.oj-selected.oj-button-outlined-chrome,
.user-menu-wrapper .oj-button.oj-selected.oj-button-outlined-chrome .oj-button-button,
.instance-list-wrapper .oj-button-jqui.oj-selected.oj-button-outlined-chrome,
.instance-list-wrapper .oj-button.oj-selected.oj-button-outlined-chrome .oj-button-button {
    color: white;
    background-color: transparent;
    border-color: transparent;
    box-shadow: none;
}

.user-menu-wrapper .oj-button-jqui.oj-selected.oj-hover.oj-button-outlined-chrome,
.user-menu-wrapper .oj-button.oj-selected.oj-hover.oj-button-outlined-chrome .oj-button-button,
.instance-list-wrapper .oj-button-jqui.oj-selected.oj-hover.oj-button-outlined-chrome,
.instance-list-wrapper .oj-button.oj-selected.oj-hover.oj-button-outlined-chrome .oj-button-button {
    color: #ffffff;
    background-color: transparent;
    border-color: transparent;
}

.user-menu-wrapper .oj-button-jqui.oj-disabled.oj-button-outlined-chrome,
.user-menu-wrapper .oj-button.oj-disabled.oj-button-outlined-chrome .oj-button-button {
    color: #ffffff;
    border-color: transparent;
    opacity: unset;
}

.user-menu-wrapper .oj-button-jqui.oj-disabled.oj-selected.oj-button-outlined-chrome,
.user-menu-wrapper .oj-button.oj-disabled.oj-selected.oj-button-outlined-chrome .oj-button-button {
    color: white;
    background-color: transparent;
    border-color: transparent;
}


.user-menu-wrapper .oj-button.oj-default.oj-button-outlined-chrome .oj-button-icon,
.user-menu-wrapper .oj-button.oj-focus-only.oj-button-outlined-chrome .oj-button-icon {
    color: #ffffff;
}

.user-menu-wrapper .oj-button.oj-hover.oj-button-outlined-chrome .oj-button-icon {
    color: #ffffff;
}

.user-menu-wrapper .oj-button.oj-active.oj-button-outlined-chrome .oj-button-icon {
    color: white;
}

.user-menu-wrapper .oj-button.oj-selected.oj-button-outlined-chrome .oj-button-icon {
    color: white;
}

.user-menu-wrapper .oj-button.oj-selected.oj-hover.oj-button-outlined-chrome .oj-button-icon {
    color: #ffffff;
}

.user-menu-wrapper .oj-button.oj-disabled.oj-button-outlined-chrome .oj-button-icon {
    color: #ffffff;
}

.user-menu-wrapper .oj-button.oj-disabled.oj-selected.oj-button-outlined-chrome .oj-button-icon {
    color: white;
}

.sc-body .oj-dialog {
    border: 1px solid #6d6d7d;
}

.sc-body .oj-dialog-header {
    background-color: #6d6d7d;
    color: #ffffff;
}

.sc-body .oj-dialog-title {
    color: #ffffff;
}

.sc-body .oj-dialog-header .oj-button.oj-default.oj-button-half-chrome .oj-button-icon,
.sc-body .oj-dialog-header .oj-button.oj-focus-only.oj-button-half-chrome .oj-button-icon {
    color: #ffffff;
}

.sc-body.oj-web-applayout-body {
    overflow-y: auto;
}

.oj-web-applayout-header.service-console-nav > div:first-child::before {
    display: none;
}

.sc-body .oj-tabbar.oj-tabbar-horizontal .oj-tabbar-item.oj-selected a.oj-tabbar-item-content .oj-tabbar-item-label {
    font-weight: bold;
    color: #333;
}

.sc-body .oj-tabbar.oj-tabbar-horizontal .oj-tabbar-item a.oj-tabbar-item-content .oj-tabbar-item-label {
    color: #333;
}

.sc-body .sc-main-header{
    background:#1d2733;
    height: 50px
}

.oj-web-applayout-header.service-console-nav {
    box-shadow: none;
    border-bottom: 1px solid #e2e8ee;
}

.header-gradient {
    height: 4px;
    width: 100%;
    background: linear-gradient(90deg,#b4ec51 0,#53a0fd);
}

.sc-badge {
    padding: 0 .5rem;
    border-radius: .375rem;
    display: inline-flex;
    justify-content: center;
    align-items: center;
    white-space: nowrap;
    font-size: 0.6875rem;
    font-stretch: condensed;
    box-sizing: border-box;
    height: 1.5rem;
    line-height: 1.5rem;
    font-family: OracleSansSemiBold, serif;
}

.sc-badge-info {
    background-color: rgb(228, 241, 247);
    color: rgb(0, 104, 140);
}

.sc-text-semi-bold {
    font-family: OracleSansSemiBold, serif;
}