/******************************************************LOGIN PAGE*/
.login-wrapper {
    height: 100%; 
}

.login-modal {
    width: auto;
    min-width: 350px;
    height: 70%;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    overflow-y: hidden;
    overflow-x: hidden;
    box-shadow: 0 0 40px;
    background-color: #fff;
    border-radius: 5px;
}

.link-visited-white:visited {
    color: #fff;
}

/******************LEFT SIDE******************/
#login-details-wrapper {
    width: 350px; 
    height: 100%; 
    background-color: #8DC9E6; 
    display: inline-block; 
    position: absolute; 
    padding: 0 40px 0 40px; 
    text-align: center;
    overflow: hidden auto;
}

#login-details-wrapper #self-service-logo {
    width: 100%; 
    margin: 30px auto 20px auto; 
    border-bottom: 1px solid #CBEBF4; 
    padding-bottom: 20px;
}

.login-field {
    margin-bottom: 10px;
}

#login-details-wrapper input {
    background-color: #fff;
    height: 45px;
    display: block;
    margin-bottom: 10px;
    position: relative;
}

#cloud1 {
    width: 660px; 
    max-width: none; 
    position: absolute; 
    bottom: 0; 
    left: -260px;
}

/******************RIGHT SIDE******************/
#extra-information-wrapper {
    width: calc(100% - 350px); 
    height: 100%;  
    min-width: 421px; 
    margin-left: -3px; 
    background-color: #fff; 
    display: inline-block; 
    position: absolute; 
    left: 354px;
} 

#blog-iframe {
    height: 100%;
    width: 100%;
    padding: 4%;
}

#scheduled-maintenance-wrapper {
    height: 10%; 
    margin: 4%; 
    background-color: #f2f2f2; 
    border: 1px solid #d9d9d9;
    border-radius: 3px;
    position: relative;
}

#scheduled-maintenance-wrapper > div {
    display: inline-block;
}

#scheduled-maintenance-icon {
    height: calc(100% - 20px);
    width: 68px; 
    position: absolute;
}

#scheduled-maintenance-icon svg {
    height: 100%;
    width: 100%;
    fill: #9d9d9d !important;
}

#scheduled-maintenance-message-wrapper {
    height: 100%;
    width: calc(100% - 68px);
    padding: 10px 0;
    font-size: 12px;
    white-space: normal;
    line-height: 16px;
    position: absolute;
    left: 68px;
    overflow-y: auto;
}

#scheduled-maintenance-message-wrapper > div {
    font-size: 14px;
    margin-bottom: 5px;
}
/******************************************************END LOGIN PAGE*/
/******************************************************PORTAL HOME / INDEX */
.navigation-pane.portal-home {
    display:inline-block !important;
    margin:10px 0 !important;
    height:46px !important;
    width:100% !important;
    background-color:#50535a !important;
    border:1px solid #292929;
    border-radius:2px;
    font-size:1.2rem !important;
    text-overflow:ellipsis;
    white-space: nowrap;
    overflow:hidden;
    cursor:pointer;
}

.navigation-pane.portal-home:hover {
    background-color:#656871 !important;
}

.navigation-pane.portal-home > div {
    width:32px;
    height:32px;
    padding:6px;
    margin:6px;
    display:inline-block;
    border-radius:2px;
}

.navigation-pane.portal-home svg {
    width:20px;
    height:20px;
    fill:white;
    vertical-align:middle;
}

.navigation-pane.portal-home span {
    color:#ffffff;
}

#customer-select-panel .modal-body {
    padding: 0;
}
/******************************************************END PORTAL HOME*/
/******************************************************DEPLOYMENTS*/
#deployment-card-container svg {
    vertical-align: super;
}

#deployment-list .listview-heading {
    font-size: 1.4rem;
}

#tabs-overview p, #tabs-overview a{
    white-space: pre-wrap;
}

.deployment-info-row *,
.environment-info-row *,
.suite-info-row * {
    display:inline-block;
    margin:0;
}

.deployment-details-status-icon *,
.environment-details-status-icon *,
.suite-details-status-icon * {
    height:32px;
    width:32px;
}

#details-info-header-row p {
    color:#888B94;
}

#deployments-overview-container h4,
#environments-overview-container h4,
#suites-overview-container h4 {
    margin-bottom: 0;
    margin-top:1rem;
}

#deployment-list svg,
#suite-list svg {
    width: 32px;
    height: 25px;
    top:3px !important;
}

#deployment-list li > .icon + *,
#environment-list li > .icon + *,
#suite-list li > .icon + * {
    display: inline-block;
}

.deployment-info-row > p,
.environment-info-row > p,
.suite-info-row > p {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.deployment-hideable {
    visibility: hidden;
}

#user-select-shdo, #report-year-select-shdo {
    background-color: #ffffff !important;
}

.timeline-chart {
    margin-top: 20px;
    padding-top: 20px; 
    border: 1px solid #BDBDBD; 
    background: #ffffff; 
    width: 834px;
    position: absolute;
}

#environments-left-side.is-visible,
#deployments-left-side.is-visible,
#suites-left-side.is-visible {
    -webkit-transition: left .75s ease-out;
    -ms-transition: left .75s ease-out;
    left: 0;
}

#environments-left-side.is-hidden,
#deployments-left-side.is-hidden,
#suites-left-side.is-hidden {
    -webkit-transition: left .75s ease-out;
    -ms-transition: left .75s ease-out;
    left: -500px;
}

#environments-right-side.is-expanded,
#deployments-right-side.is-expanded,
#suites-right-side.is-expanded {
    -webkit-transition: width .3s ease-out;
    -ms-transition: width .3s ease-out;
    width: 100%;
    position: absolute;
    right: 0;
}

#environments-right-side.is-normal,
#deployments-right-side.is-normal,
#suites-right-side.is-normal {
    -webkit-transition: width .72s ease-out;
    -ms-transition: width .72s ease-out;
    position: absolute;
    right: 0;
}

#deployments-right-side.is-normal {
    width: calc(100% - 450px);
}

#environments-right-side.is-normal,
#suites-right-side.is-normal {
    width: calc(100% - 400px);
}

#environments-left-side.is-visible,
#deployments-left-side.is-visible,
#suites-left-side.is-visible {
    -webkit-transition: left .75s ease-out;
    -ms-transition: left .75s ease-out;
    left: 0;
}

#environments-left-side.is-hidden,
#deployments-left-side.is-hidden,
#suites-left-side.is-hidden {
    -webkit-transition: left .75s ease-out;
    -ms-transition: left .75s ease-out;
    left: -500px;
}

#environments-right-side.is-expanded,
#deployments-right-side.is-expanded,
#suites-right-side.is-expanded {
    -webkit-transition: width .3s ease-out;
    -ms-transition: width .3s ease-out;
    width: 100%;
    position: absolute;
    right: 0;
}

#environments-right-side.is-normal,
#deployments-right-side.is-normal,
#suites-right-side.is-normal {
    -webkit-transition: width .72s ease-out;
    -ms-transition: width .72s ease-out;
    position: absolute;
    right: 0;
}

#environments-right-side.is-normal,
#suites-right-side.is-normal,
#deployments-right-side.is-normal {
    width: calc(100% - 400px);
}
/******************************************************END DEPLOYMENTS*/
/******************************************************CONTACT MANAGEMENT*/


/******************************************************END CONTACT MANAGEMENT*/
/******************************************************OUTAGES*/
#outage-details-modal *{
    overflow-y: auto;
    overflow-x: hidden;
}

#outage-details-modal {
    overflow-y: auto;
    overflow-x: hidden;
}

#outage-details-modal .field {
    width: 1100px;
}

#outage-details-modal p {
    width:1000px!important;
}

.outage-list-item{
    font-size:large;
    font-weight:bolder;
}
/******************************************************END OUTAGES*/
/******************************************************SERVICE REQUESTS*/
#select-printer-driver-template .buttonset {
    display:none;
}
/******************************************************END SERVICE REQUESTS*/
/******************************************************ENVIRONMENTS*/
.environment-item svg {
    top: 0 !important;
    height: 32px;
}

#environment-list .listview-heading {
    font-size: 1.4rem;
    width: auto !important;
}

/******************************************************END ENVIRONMENTS*/
/******************************************************SUITES*/

/******************************************************END SUITES*/
/******************************************************IMAGE MANAGER*/
#image-list .btn-primary {
    background-color: #368ac0 !important;
}

#image-list .btn-secondary {
    background-color: #bdbdbd !important;
}

#image-list .image-item {
    cursor: default;
}
/******************************************************END IMAGE MANAGER*/
/******************************************************GLOBAL*/
.status-green {
    color:#80ce4d !important;
}

.status-red {
    color:#e84f4f !important;
}

.status-blue {
    color: #54A1D3 !important;
}

.status-gray {
    color:#999999 !important;
}

.background-red {
    background-color: #e84f4f !important;
}

.background-yellow {
    background-color: #ffd726 !important;
}

.background-green {
    background-color: #80ce4d !important;
}

.notification-red {
    border: 2px solid #b33737;
    background-color: #e84f4f;
}

.notification-yellow {
    border: 2px solid #967f16;
    background-color: #ffd726;
}

.notification-green {
    border: 2px solid #4e7d2f;
    background-color: #80ce4d;
}

.notification-lightBlue {
    border: 2px solid #999999;
    background-color: #c8e9f4;
}

.notification-lightGrey {
    border: 2px solid #999999;
    background-color: #f0f0f0;
}

.notification-icon-red {
    fill: #b33737;
}

.notification-icon-yellow {
    fill: #967f16;
}

.notification-icon-green {
    fill: #4e7d2f;
}

.font-bold {
    font-weight: bold !important;
}

.loading-blocker {
    position:relative;
    height: calc(100% - 38px);
    z-index: 100;
    background-color: #f0f0f0;
}

.loading-blocker section {
    background-color: #f0f0f0;
    height:40%;
}

.loading-blocker #loading-blocker-button .one,
.loading-blocker #loading-blocker-button .two,
.loading-blocker #loading-blocker-button .three {
    background-color:#313236;
}

.loading-blocker span {
    color: #368ac0;
    font-size: 16px;
    font-size: 1.6rem;
}

.loading-blocker .bar {
    background-color: #368ac0;
}

@media (min-width: 767px) {
    .application-menu ~ .loading-blocker {
        width: 100%; }
    .application-menu.is-open ~ .loading-blocker {
        width: calc(100% - 300px);
        left: 300px;} }

#mongoose-container {
    display:none;
}

.index-listview p.listview-heading {
    width: calc(100% - 37px);
}

.listview li.red {
    border-left: 3px solid #e84f4f !important;
    padding-left: 20px;
}

.listview svg.icon-red {
    fill: #e84f4f;
}

.listview li.green {
    border-left: 3px solid #80ce4d !important;
}

.listview svg.icon-green {
    fill: #80ce4d;
}

.listview li.yellow {
    border-left: 3px solid #ffd726 !important;
}

.listview svg.icon-yellow {
    fill: #ffd726;
}

#index-masthead .masthead-appname {
    margin: 0;
}

#masthead-right-buttons > .button-container-div {
    display: inline-block;
    width: 40px;
    height: 32px;
}

.index-count-badge {
    padding: 0 5px;
    height: 14px;
    position:relative;
    bottom:32px;
    line-height: 15px;
    width: 22px;
}

/*#application-menu .accordion .accordion-pane svg {
    height: 100%;
}*/

#application-menu .accordion .accordion-pane a {
    width: calc(100% - 66px);
}

/* #application-menu #st-accordion,
#application-menu #mt-accordion,
#application-menu #t2v-accordion {
    padding-left: 0px !important;
}

#st-accordion .accordion-header,
#mt-accordion .accordion-header,
#t2v-accordion .accordion-header {
    padding-left: 10px;
} */

#customer-tasks-listview svg {
    margin-top: 10px;
    top: 0 !important;
}

.ip-subnet-input {
    padding: 5px;
    max-width: 37px;
}

.ip-subnet-span {
    font-size: 1.3rem;
    font-weight: 900;
    margin: 0 5px;
}

.svg-icons {
    display: none;
}

.flipped svg {
  -webkit-transform: rotateY(-180deg);
          transform: rotateY(-180deg);
}

.card.effect__hover:hover .card__back {
  -webkit-transform: rotateY(0);
          transform: rotateY(0);
}

.icon-gray {
    fill:#999999;
}

.icon-red {
    fill:#e84f4f;
}

.icon-green {
    fill:#80ce4d;
}

.error-field {
    border-color: red !important;
    background-color: rgb(255, 204, 204) !important;
}
    .error-field svg {
        fill: #5c5c5c !important;
    }
    .error-field span {
        color: #5c5c5c !important;
    }

.display-none,
.auth-hidden {
    display: none !important;
}

.visibility-hidden {
    visibility: hidden !important;
}

.splitter-overlay {
    display: none !important;
}

.password-requirement-field {
    margin-bottom: 10px;
    display: flex;
    align-items: center;
}

    .password-requirement-field:last-of-type {
        margin-bottom: 0;
        display: flex;
        align-items: center;
    }

.unavailable-date-li {
    font-size: 1.5rem;
    margin: 0 2px;
}
/******************************************************END GLOBAL*/
#UpdateEnvironmentNotice {
    background-color: #0066d440;
    border: 1px solid #0066d4;
    display:block;
}
#Show-Deleted{
font-size:1.6rem;
color:white;
margin-top:8px;
font-weight:600;
}
#toggle-switch {
display:inline-block;
}