/****************************/
/* General typography       */
/****************************/
html {
    font-family: 'Open Sans', sans-serif;
}

/****************************/
/* Headerbar style          */
/****************************/
.trazelab-button {
    color: #6dcff6 !important;
    background-color: white !important;
    border-width: 2px;
    border-color: #6dcff6;
    border-style: solid;
}

.trazelab-button:disabled {
    color: rgba(0,0,0,0.38) !important;
    background-color: rgba(0,0,0,0.12) !important;
    cursor: default;
    border-width: 2px;
    border-color: #525152;
    border-style: solid;
}

/****************************/
/* Headerbar style          */
/****************************/
#logo-trazelab {
    height: 65px;
    text-decoration: none !important;
}

.logo-image {
    font-size: 30px !important;
}

.logo-text {
    font-size: 30px !important;
}

#logon-toolbar {
    background-color: #6dcff6;
}

#vertical-navigation > md-toolbar {
    background-color: #525152 !important;
}

#vertical-navigation > div.scroll-wrapper.scrollbar-inner.ng-scope {
    background-color: #525152 !important;
}

#project-toolbar > button:hover > md-icon {
    color: #6dcff6;
}

#alarm-button:hover > md-icon {
    color: #6dcff6;
}

#notes-button:hover > md-icon {
    color: #6dcff6;
}

#help-button:hover > md-icon {
    color: #6dcff6;
}

#virtual-button:hover > md-icon {
    color: #6dcff6;
}

#quick-panel-toggle:hover > md-icon {
    color: #6dcff6;
}

#sidebar-menu {
    padding: 0 0px;
    background-color: #6dcff6 !important;
    height: 64px;
}

#menu-add-new {
    background-color: #6dcff6 !important;
}

body > div.md-dialog-container.ng-scope > md-dialog > form > md-toolbar > div {
    background-color: #525152 !important;
}

body > div.md-dialog-container.ng-scope > md-dialog > form > md-dialog-actions > div > button:nth-child(2) {
    background-color: #525152 !important;
}

#toolbar > div > div > div.layout-fill.layout-align-start-center.layout-row > button {
    background-color: #6dcff6;
    opacity: 0.8;
}

#message-graphic-view > div > div > div.header.Nov > button  {
    background-color: #6dcff6;
}

form.ng-valid  > md-dialog-actions > button.save-button.md-accent.md-raised.md-button.ng-scope.md-ink-ripple.md-default-theme {
    background-color: #6dcff6 !important;
}

form.ng-invalid  > md-dialog-actions > button.save-button.md-accent.md-raised.md-button.ng-scope.md-ink-ripple.md-default-theme {
    background-color: #6dcff6 !important;
    opacity: 0.5;
}

#alarm-button > b.badge {
    position: absolute;
    top: 3px;
    right: 6px;
    cursor: pointer;
    background: #6dcff6;
    display: inline-block;
    font-size: 12px;
    box-shadow: inset 1px 1px 0 #6dcff6,inset 0 -1px 0 #b7e7fa;
    color: #fff;
    font-weight: 700;
    border-radius: 50%;
    -moz-border-radius: 50%;
    -webkit-border-radius: 50%;
    padding-bottom: 1px;
    padding-top: 1px;
    padding-right: 4px;
    padding-left: 4px;
    text-align: center;
    line-height: normal;
}

#alarm-panel > md-list > md-list-item > div > div.md-list-item-inner > div {
    width: 250px;
    text-overflow: ellipsis;
}

md-switch.md-checked > div.md-container > div.md-bar {
    background-color: #2ECC71 !important;
}

md-switch > div.md-container > div.md-bar {
    background-color: #EC7063 !important;
}

/****************************/
/* submenu toolbar style    */
/****************************/
#submenu > div > md-toolbar {
    background-color: #525152 !important;
    height: 55px;
    color: #FFFFFF;
}


#submenu > div > md-toolbar > div > button md-icon {
    color: #ffffff;
}

#submenu > div > md-toolbar > div > button:hover {
    border-bottom: solid 3px #6dcff6;
    border-radius: 0px !important;
    color: #6dcff6;
}

#submenu > div > md-toolbar > div > button.active {
    border-bottom: solid 3px #6dcff6;
    border-radius: 0px !important;
    color: #6dcff6;
}

#submenu > div > md-toolbar > div > button:hover md-icon {
    color: #6dcff6;
}

#submenu > div > md-toolbar > div > button.active md-icon {
    color: #6dcff6;
}

.submenu-content {
    background-color: #525152 !important;
}

.submenu-content > md-menu-item > button > md-icon {
    color: white;
}

md-menu-content.submenu-content > md-menu-item {
    color: white;
}

#submenu > div > md-toolbar > div > md-menu-bar {
    padding-left: 0px;
    padding-right: 0px;
}

/****************************/
/* splash view style*/
/****************************/
md-progress-circular > svg > path {
    stroke: #6dcff6 !important;
}

#splash-screen {
    background-color: #11a8e3 !important;
}

#splash-screen .spinner-wrapper .spinner .inner .left .half-circle {
    border: 10px solid black;
}

#splash-screen .spinner-wrapper .spinner .inner .right .half-circle {
    border: 10px solid #11a8e3;
}

/****************************/
/* login view style*/
/****************************/
#login-form > form > button {
    background-color: #6dcff6;
} /* nor used*/

#login {
    background : url("../assets/images/trazelab/fondo-trazelab.jpg") no-repeat;
    background-size: cover;
}

#login-panel #login-form-wrapper {
    -webkit-box-flex: 1;
    -ms-flex: 1 0 auto;
    flex: 1 0 auto;
}

#login-panel #login-form-wrapper #login-form {
    width: 384px;
    max-width: 384px;
    padding: 15px;
    background: #FFFFFF;
    text-align: center;
    /*border-radius: 12px;*/
}

#login-panel #login-form-wrapper #login-form .logo {
    width: 128px;
    height: 128px;
    line-height: 128px;
    font-size: 86px;
    font-weight: 500;
    margin: 32px auto;
    color: #FFFFFF;
    border-radius: 2px;
}

#login-panel #login-form-wrapper #login-form .title {
    font-size: 30px;
    /*margin: 16px 0 32px 0;*/
}

#login-panel #login-form-wrapper #login-form form {
    width: 100%;
    text-align: left;
}

#login-panel #login-form-wrapper #login-form form md-checkbox {
    margin: 0;
}

#login-panel #login-form-wrapper #login-form form .remember-forgot-password {
    font-size: 13px;
    margin-top: 8px;
}

#login-panel #login-form-wrapper #login-form form .remember-forgot-password .remember-me {
    margin-bottom: 16px;
}

#login-panel #login-form-wrapper #login-form form .remember-forgot-password .forgot-password {
    font-size: 13px;
    font-weight: 500;
    margin-bottom: 16px;
}

#login-panel #login-form-wrapper #login-form form .submit-button {
    width: 220px;
    margin: 16px auto;
    display: block;
}

#login-panel #login-form-wrapper #login-form .register {
    margin: 32px auto 24px auto;
    width: 250px;
    font-weight: 500;
}

#login-panel #login-form-wrapper #login-form .register .text {
    margin-right: 8px;
}

#login-panel #login-form-wrapper #login-form .separator {
    font-size: 15px;
    font-weight: 600;
    margin: 24px auto 16px auto;
    position: relative;
    overflow: hidden;
    width: 100px;
    color: rgba(0, 0, 0, 0.54);
}

#login-panel #login-form-wrapper #login-form .separator .text {
    display: inline-block;
    vertical-align: baseline;
    position: relative;
    padding: 0 8px;
    z-index: 9999;
}

#login-panel #login-form-wrapper #login-form .separator .text:before, #login #login-form-wrapper #login-form .separator .text:after {
    content: '';
    display: block;
    width: 30px;
    position: absolute;
    top: 10px;
    border-top: 1px solid #6dcff6;
}

#login-panel #login-form-wrapper #login-form .separator .text:before {
    right: 100%;
}

#login-panel #login-form-wrapper #login-form .separator .text:after {
    left: 100%;
}

#login-panel #login-form-wrapper #login-form .md-button.google, #login #login-form-wrapper #login-form .md-button.facebook {
    width: 192px;
    text-transform: none;
    color: #FFFFFF;
    font-size: 13px;
}

#login-panel #login-form-wrapper #login-form .md-button.google md-icon, #login #login-form-wrapper #login-form .md-button.facebook md-icon {
    color: #FFFFFF;
    margin: 0 8px 0 0;
}

#login-panel #login-form-wrapper #login-form .md-button.google {
    background-color: #D73D32;
}
#login-panel #login-form-wrapper #login-form .md-button.facebook {
    background-color: #3f5c9a;
}

#logon-button {
    height: 50px;
    width: 100px;
    margin-right: 40px;
    background-color: transparent;
    margin-top: 30px;
    margin-right: 15px;
}

#logon-button > md-icon {
    font-size: 70px;
    color: #000000;
    width: 80px;
}

.arrow-up {
    width: 0;
    height: 0;
    border-left: 10px solid transparent;
    border-right: 10px solid transparent;
    border-bottom: 10px solid white;
    margin-left: 325px;
}

.remember-me {
    margin-left: 9px !important;
}

#login-form > form > div > a {
    color: #525152;
}

/*****************************/
/* forgot password view style*/
/*****************************/
#forgot-password {
    background : url("../assets/images/trazelab/fondo-trazelab.jpg") no-repeat;
    background-size: cover;
}

#toolbar > div > a:link {
    text-decoration: none!important;
}

#logo-trazelab {
    height: 100% !important;
    width: 500px !important;
    display: block;
    margin-left: 10px;
    margin-right: auto;
    cursor: pointer;
}

#forgot-password-form > div.login.layout-align-center-center.layout-row > a {
    color: #525152;
}

/****************************/
/* reset password view style*/
/****************************/
#reset-password {
    background : url("../assets/images/trazelab/fondo-trazelab.jpg") no-repeat;
    background-size: cover;
}

/****************************/
/* status bar style         */
/****************************/
#footer > div > md-toolbar {
    background-color: #525152 !important;
    /*height: 55px;*/
}

md-tooltip.tooltip-big .md-content {
    font-size: 20px;
}

#status-alarm {
    margin-left: 10px;
    margin-right: 0px;
    /*border-radius: 10px;*/
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    background-color: #525152 !important;
    color: white;
    font-size: 17px;
}

#status-button {
    padding: 2px;
    background-color: #525152 !important;
}

#status-clock-date {
    font-size: 15px;
}

#status-clock-time {
    font-size: 13px;
}

#logo-samoa {
    height: 20px;
}

#clock-container {
    padding: 13px;
}

/******************/
/*logo color style*/
/******************/
div.logo.md-accent-bg {
    background-color: #6dcff6;
}

#vertical-navigation .navigation-header .logo .logo-image {
    background: #6dcff6;
}

#splash-screen .logo {
    background-color: #6dcff6;
}

#logo-trazelab {
    width: 250px;
    height: 100px;
    display: block;
    margin-left: auto;
    margin-right: auto
}

md-icon.md-default-theme, md-icon {
    color: rgba(255,255,255,0.87);
}

#vertical-navigation .navigation-header .logo .logo-text {
    font-size: x-large;
}

/**********************************/
/*angular material datatable style*/
/**********************************/
.blue_button {
    text-shadow: 0 -1px 0 #06C;
    background-color: #06C;
    border-color: #0040A5;
    background-size: 100% auto;
    background-image: linear-gradient(#09F, #06C);
    color: #FFF;
    font-weight: bold;
    cursor: pointer;
    font-size: 14px;
    line-height: 18px;
    font-family: "Helvetica Neue", Arial, sans-serif;
}

table.md-table thead {
    background-color: #A7B5C1;
    border-radius: 7px;
    color: #FFF;
    padding: 5px 8px;
    font-weight: 400;
    cursor: pointer;
}

.odd {
    background-color: #F5F6FB;
}

table.md-table tbody.md-body > tr.md-row.even:hover {
    background-color: white !important;
}

table.md-table tbody.md-body > tr.md-row.odd:hover {
    background-color: white !important;
}

/*table.md-table tbody.md-body > tr.md-row.even:not([disabled]):hover {*/
    /*background-color: white !important;*/
    /*font-weight: bold;*/
/*}*/

/*table.md-table tbody.md-body > tr.md-row.odd:not([disabled]):hover {*/
    /*background-color: #F5F6FB !important;*/
    /*font-weight: bold;*/
/*}*/

/*table.md-table tbody.md-body > tr.md-selected.md-row:not([disabled]):hover {*/
    /*background-color: #525152 !important;*/
/*}*/

/*table.md-table tbody.md-body > tr.md-selected {*/
    /*background-color: #525152 !important;*/
/*}*/

table.md-table td.md-cell.message {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    min-width: 300px;
    max-width: 300px;
}

table.md-table td.md-cell.message:hover {
    text-overflow: clip;
    white-space: normal;
    word-break: break-all;
}

/*********************/
/*tabsheet tabs style*/
/*********************/
md-icon.md-default-theme, md-icon {
    color: #525152;
}

/*resolve animation flickering BUG in tabsheet*/
#content > md-tabs {
    -webkit-transition: all 0.0s !important;
    transition: all 0.0s !important;
}

/***********************/
/* report manager style*/
/***********************/
#StiViewerReportPanel {
    overflow: hidden !important;
    top: 25px !important;
}

/***********************/
/* container view style*/
/***********************/
.content {
    padding: 10px;
}

.card-view {
    font-size: 1.6rem;
}

/***********************/
/* mxGraph canvas style*/
/***********************/
#zone-button {
    position: absolute;
}

#component-panel {
    padding-top: 10px;
    padding-bottom: 10px;
}

#graph-container {
    overflow:hidden;
    width: 100%;
    height: 100%;
    background: url("../assets/images/mxgraph/grid.gif");
    cursor:default;
}

.graph-container > svg {
    background-image: url("data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iNDAiIGhlaWdodD0iNDAiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PHBhdHRlcm4gaWQ9ImdyaWQiIHdpZHRoPSI0MCIgaGVpZ2h0PSI0MCIgcGF0dGVyblVuaXRzPSJ1c2VyU3BhY2VPblVzZSI+PHBhdGggZD0iTSAwIDEwIEwgNDAgMTAgTSAxMCAwIEwgMTAgNDAgTSAwIDIwIEwgNDAgMjAgTSAyMCAwIEwgMjAgNDAgTSAwIDMwIEwgNDAgMzAgTSAzMCAwIEwgMzAgNDAiIGZpbGw9Im5vbmUiIHN0cm9rZT0iI2UwZTBlMCIgb3BhY2l0eT0iMC4yIiBzdHJva2Utd2lkdGg9IjEiLz48cGF0aCBkPSJNIDQwIDAgTCAwIDAgMCA0MCIgZmlsbD0ibm9uZSIgc3Ryb2tlPSIjZTBlMGUwIiBzdHJva2Utd2lkdGg9IjEiLz48L3BhdHRlcm4+PC9kZWZzPjxyZWN0IHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIGZpbGw9InVybCgjZ3JpZCkiLz48L3N2Zz4=")
}

button.delete-tab-buttom {
    padding-left: 0px;
    margin-left: 0px;
    font-size: 15px;
}

#canvas > md-tabs > md-tabs-wrapper > md-tabs-canvas > md-pagination-wrapper > md-tab-item {
    padding-right: 10px;
    padding-left: 10px;
}

#canvas > md-tabs > md-tabs-wrapper > md-tabs-canvas > md-pagination-wrapper > md-tab-item > button {
    padding-right: 0px;
    padding-left: 0px;
    margin-left: 0px;
    margin-right: 0px;
}

#canvas > md-tabs > md-tabs-wrapper > md-tabs-canvas > md-pagination-wrapper > md-ink-bar {
    background-color: #6dcff6 !important;
}

/***************************/
/* Scada layout view style */
/***************************/
#scada-view {
    overflow-x: hidden !important;
}

.component {
    width: 50%;
    margin: 0 auto;
    cursor: pointer;
}

.component.active > img {
    border-width: 2px;
    border-style: inset;
    padding: 5px;
}

.device-icon {
    height: 100px;
}

.toggler {
    -webkit-background-clip: padding-box;
    background-clip: padding-box;
    border: 1px solid #6dcff6;
    width: 20px;
    height: 48px;
    top: 47%;
    cursor: pointer;
}

#scada-view > md-sidenav.md-sidenav-left {
    width: 150px;
}

#scada-view > md-sidenav.md-sidenav-right {
    width: 280px;
}

.sidebar-left > .toggler {
    -webkit-border-top-right-radius: 4px;
    -webkit-border-bottom-right-radius: 4px;
    -moz-border-radius-topright: 4px;
    -moz-border-radius-bottomright: 4px;
    border-top-right-radius: 4px;
    border-bottom-right-radius: 4px;
    border-left: 1px solid #fff;
    -webkit-box-shadow: 1px 0px 8px rgba(0, 0, 0, .175);
    box-shadow: 1px 0px 8px rgba(0, 0, 0, .175);
    right: -20px;
}

.sidebar-left > .toggler > md-icon {
    margin-bottom: 0px;
    margin-top: 12px;
    margin-left: -3px;
    font-weight: bold;
}

.sidebar-right > .toggler {
    -webkit-border-top-left-radius: 4px;
    -webkit-border-bottom-left-radius: 4px;
    -moz-border-radius-topleft: 4px;
    -moz-border-radius-bottomleft: 4px;
    border-top-left-radius: 4px;
    border-bottom-left-radius: 4px;
    border-right: 1px solid #fff;
    -webkit-box-shadow: -1px 0px 8px rgba(0, 0, 0, .175);
    box-shadow: -1px 0px 8px rgba(0, 0, 0, .175);
    left: -20px;
}

.sidebar-right > .toggler > md-icon {
    margin-bottom: 0px;
    margin-top: 12px;
    margin-left: -3px;
    font-weight: bold;
}

#canvas-toolbar {
    padding: 0px;
}

#canvas > md-tabs > md-tabs-wrapper > md-tabs-canvas > md-pagination-wrapper > md-tab-item > button {
    padding-top: 0px;
    padding-bottom: 20px;
}

#canvas > md-tabs > md-tabs-wrapper > md-tabs-canvas > md-pagination-wrapper > md-tab-item > button > md-icon {
    font-size: 15px;
    margin-left: 0px;
    border-bottom-width: 10px;
}

#scada-ok-button {
    min-width: 48px !important;
}

/***************************/
/* Order view style        */
/***************************/

/***************************/
/* Dashboard view style    */
/***************************/
#calendarView > div > div > table > tbody > tr > td > div.fc-time-grid-container.fc-scroller > div > div.fc-content-skeleton > table > tbody > tr > td > div > a {
    color: white;
}

#calendarView > div > div > table > tbody > tr > td > div.fc-time-grid-container.fc-scroller > div > div.fc-content-skeleton > table > tbody > tr > td > div > a {
    color: white;
}

#calendarView > div > div > table > tbody > tr > td > div > div > div > div.fc-content-skeleton > table > tbody > tr > td > a > div {
    color: white;
}

#dashboard-tab-view > md-tabs > md-tabs-wrapper > md-tabs-canvas > md-pagination-wrapper > md-ink-bar {
    background: #6dcff6 !important;
}

#widgets > div:nth-child(1) > ms-widget:nth-child(1) > ms-widget-front {
    background-color: #6dcff6 !important;
}

#widgets > div:nth-child(1) > ms-widget:nth-child(2) > ms-widget-front,
#widgets > div:nth-child(1) > ms-widget:nth-child(3) > ms-widget-front
{
    background-color: #7B9A3E !important;
}

#calendarView > div > div.fc-month-view > table > tbody > tr > td > div > div > div {
    height: 100px !important;
}

.slick-prev:before, .slick-next:before {
    color: black;
}

.slick-dots li button:before {
    font-size: 15px;
}

.widget-front, .widget-back {
    background-color: white !important;
    border-color: #0a0a0a;
    border-style: solid;
    border-width: medium;
    color:  rgba(82,81,82,1) !important;
}

.widget-front .total-volume {
    color: rgba(82,81,82,0.65) !important;
}

.widget-front .total-percentage {
    background-color: #6dcff6 !important;
    border-radius: 50%;
    width: 65px;
    height: 65px;
    line-height: 65px;
    text-align: center;
    color: white !important;
}

md-progress-linear > div > div.md-bar.md-bar2 {
    background-color: rgba(82,81,82,1) !important;
}

md-progress-linear > div {
    background-color: rgba(0,0,0,0.12) !important;
}

.series-selector {
    cursor: pointer !important;
}

/***************************/
/* Alarm view style    */
/***************************/
#alarm-tab-view > md-tabs > md-tabs-wrapper > md-tabs-canvas > md-pagination-wrapper > md-ink-bar {
    background: #6dcff6 !important;
}

/***************************/
/* Order view style        */
/***************************/
#order-main-view > md-tabs > md-tabs-wrapper > md-tabs-canvas > md-pagination-wrapper > md-ink-bar {
    background: #6dcff6 !important;
}

/****************************/
/* Configuration view style */
/****************************/
#configuration-main-view > md-tabs > md-tabs-wrapper > md-tabs-canvas > md-pagination-wrapper > md-ink-bar {
    background: #6dcff6 !important;
}

/****************************/
/* terminal view            */
/****************************/
#terminal-footer {
    background-color: #525152 !important;
}

.terminal-menu {
    background-color: #525152 !important;
}

/****************************/
/* help view                */
/****************************/
#vertical-navigation > a {
    background-color: white;
}

.help-menu {
    background-color: #525152 !important;
}


/****************************/
/* virtual teminal          */
/****************************/
#vertical-navigation > ms-navigation > ul > li > ul > li > div > a.active {
    background-color: #EAEAEB !important;
    color: #525152 !important;
}

#vertical-navigation > ms-navigation > ul > li > ul > li > div > a.active > i {
    color: #525152 !important;
}

#vertical-navigation > ms-navigation > ul > li > ul > li > div > a:hover, a:focus {
    border-bottom: none;
}

/****************************/
/* google  toasts           */
/****************************/
.md-top.md-center {
    left: 50%;
    transform: translate3d(-50%, 0, 0);
}

.md-button.md-default-theme.md-warn.md-raised:not([disabled]):hover, .md-button.md-warn.md-raised:not([disabled]):hover, .md-button.md-default-theme.md-warn.md-fab:not([disabled]):hover, .md-button.md-warn.md-fab:not([disabled]):hover {
    background-color: #6dcff6;
}

/****************************/
/* product                  */
/****************************/
/*.stretch-height md-tab-content > div {
    margin: 0;
    width: 100%;
    min-height: 100%;
    height: 400px;
}*/


/****************************/
/* table                    */
/****************************/

/* header */
table.md-table thead.md-head>tr.md-row {
    height: 31px;
}

.table-header th span label{
    font-size: 15px
}

/* body */
table.md-table.md-row-select tbody.md-body>tr.md-row {
    height: 31px;
}

/* pagination */
/*.md-table-pagination, .md-table-pagination > div {*/
    /*height: 30px !important;*/
/*}*/

/****************************/
/* md-checkbox              */
/****************************/
md-checkbox {
    min-width: 15px;
    min-height: 15px;
}

md-checkbox .md-container, md-checkbox .md-icon{
    width: 15px !important;
    height: 15px !important;

}

md-checkbox .md-icon {
    position: static !important;
}

/****************************/
/* splitter                 */
/****************************/

/* bar */
#order-tab-list-view > div > ms-widget > ms-widget-front > div > div.ng-scope.ng-isolate-scope.stretch.ui-splitbar.animate-row,
#expedition-tab-list-view > div > ms-widget > ms-widget-front > div > div.ng-scope.ng-isolate-scope.stretch.ui-splitbar.animate-row,
#expedition-tab-historic-view > div > ms-widget > ms-widget-front > div > div.ng-scope.ng-isolate-scope.stretch.ui-splitbar.animate-row {
    background: #525152;
}

/* arrows */
#order-tab-list-view > div > ms-widget > ms-widget-front > div > div.ng-scope.ng-isolate-scope.stretch.ui-splitbar.animate-row > a,
#expedition-tab-list-view > div > ms-widget > ms-widget-front > div > div.ng-scope.ng-isolate-scope.stretch.ui-splitbar.animate-row > a, 
#expedition-tab-historic-view > div > ms-widget > ms-widget-front > div > div.ng-scope.ng-isolate-scope.stretch.ui-splitbar.animate-row > a {
    color: white;
}

/****************************/
/* md-dialog                */
/****************************/

md-dialog.dialog-tables {
    max-width: 70%;
    width: 70%;
    max-height: 100%;
    height: 530px;
}

/* md-dialog-content */


/* md-dialog-actions*/
md-dialog md-dialog-actions.dialog-actions-fixed{
    position: fixed;
    left: 0;
    top: 88%;
    width: 100%;
    background-color: #cccccc;
}

/****************************/
/* toast                    */
/****************************/
md-toast.md-error-packing-toast-theme .md-toast-content {
    background-color: #FFD54F;
    color: black;
}

/****************************/
/* autocomplete             */
/****************************/
.autocomplete-custom-item li{
  border-bottom: 1px solid #ccc;
  height: auto;
  padding-top: 8px;
  padding-bottom: 8px;
  white-space: normal;
}
.autocomplete-custom-item li:last-child {
  border-bottom-width: 0;
}
.autocomplete-custom-item .item-title,
.autocomplete-custom-item .item-metadata {
  display: block;
  line-height: 2;
}
.autocomplete-custom-item .item-title i {
  height: 18px;
  width: 18px;
}

/****************************/
/* utilities classes        */
/****************************/

/* height */
.vh-100 {
    height: 100vh !important;
}

.vh-70 {
    height: 70vh !important;
}

.height-30px {
    height: 30px !important;
}

.height-35px {
    height: 35px !important;
}

.height-45px {
    height: 45px !important;
    min-height: 45px;
}

.height-70px {
    height: 70px !important;
}

.height-76per {
    height: 76% !important;
}

.height-80per {
    height: 80% !important;
}

.height-83per {
    height: 83% !important;
}

.height-100per {
    height: 100% !important;
}


/* padding */
.padding-0 {
    padding: 0 !important;
}

.padding-5px {
    padding: 5px !important;
}

.padding-15px {
    padding: 15px !important;
}

/* padding-left */
.padding-left-15px {
    padding-left: 15px !important;
}

.padding-left-10px {
    padding-left: 10px !important;
}


/* margin */
.margin-0px {
    margin: 0 !important;
}

.margin-5px {
    margin: 5px !important;
}

.margin-20px {
    margin: 20px !important;
}

.margin-0-10px {
    margin: 0 10px !important;
}

.margin-5-10px {
    margin: 5px 10px !important;
}

.margin-5-20px {
    margin: 5px 20px !important;
}

/* margin-top */
.margin-top-13px {
    margin-top: 13px !important;
}

.margin-top-40px {
    margin-top: 40px !important;
}


/* background-color*/
.background-white {
    background-color: white !important;
}

.backgroun-497b94 {
    background-color: #497b94 !important;
}