* {
    /* outline: thin solid red; */
}

@media (max-width: 1290px) {
    html {
        height: 100%;
        zoom: 0.9;
    }
}

.droppable.lvl-over {
    border: 1px dashed black !important;
}

.lvl-target {
    background-color: #ddd; 
    opacity: .5;
}

[draggable] {
    cursor: move;
}

.col-OPERATIONAL {
    display: none;
}

.debug {
    border: 1px dashed red !important;
}

.row div:not(.col-md-1) {
    /* border: 1px dashed red !important; */
}

.canvas {
    height: 840px;
    /* width: 120% !important; */
    overflow-y: hidden;
}

.canvas .panel-content {
    padding: 0.5rem 0.5rem !important;
}

.canvas .panel:hover {
    box-shadow: 0px 0px 20px 5px rgba(0,0,0,0.4);
    cursor: pointer;
}

.canvas .detail-window .panel:hover {
    box-shadow: initial;
    cursor: default;
}


.canvas .panel-hdr strong {
    font-size: 14px;
    margin-left: -0.5rem;
}

.completed-ratio h1 {
    font-size: 150px;
    color: #9DC347;
    font-weight: 700;
    margin-top: 20px;
}

.completed-ratio h2 {
    font-size: 40px;
    color: #9DC347;
    font-weight: 700;
}

.h-33 {
    height: 32.4%;
}

.h-21 {
    height: 25%;
}

.h-46 {
    height: 40%;
    max-height: 40%;
    overflow: hidden;
}

.h-21 .canvas-panel-content {
    max-height: 100px !important;
    overflow: hidden;
}

.h-46 .canvas-panel-content {
    max-height: 200px !important;
    overflow: hidden;
}

.h-48 {
    height: 48% !important;    
    overflow: hidden;
}

.h-60 {
    height: 75% !important;    
    overflow: hidden;
}

.h-60 .canvas-panel-content {
    max-height: 375px !important;
    overflow: hidden;
}

.h-65 {
    height: 100% !important;    
    overflow: hidden;
}

.h-100-alt {
    height: 102% !important;    
    overflow: hidden;
}

.h-65 .canvas-panel-content {
    max-height: 550px !important;
    overflow: hidden;
}

.ta-editor.form-control {
    height: auto !important;
}

.working {
    position: fixed;
    width: 100%;
    left: 0px;
    z-index: 99999;
    height: 100%;
    top: 0px;
    background-color: rgb(127,127,127,0.4);
}

.working .loading-icon {
    margin: 0 auto;
    display: block;
    text-align: center;
    margin-top: 300px;
}

.working .loading-icon i.fa {
    font-size: 100px;
}

.detail-window .rotate-btn {
    transform: rotate(90deg);
    position: fixed;
    right: -110px;
    top: 240px;
}

.detail-window .panel {
    transition: all .5s ease-in-out;
    max-width: initial;
    right: 32px;
    position: absolute;
    background-color: #f9f6fa;
    z-index: 1000;
    height: 90%;
    top: 10px;
    box-shadow: 0px 0px 28px 0px rgba(86, 61, 124, 0.13);
}

.detail-window .panel.open {
    width: 350px !important;
    overflow-y: auto;
}

.detail-window .panel.closed {
    width: 0px !important;
    display: none;
}


.detail-window.closed .size-toggle {
    position: absolute;
    left: -25px;
    width: 25px;
    padding: 10px 0px;
}

.detail-window.open .size-toggle {
    margin-top: 10px;
    margin-bottom: 10px;
}

tr th a {
    cursor: pointer;
}
tr th a i.fa {
    margin-right: 10px;
}

.rating {
    color: #a9a9a9;
    margin: 0;
    padding: 0;
}
ul.rating {
    display: inline-block;
}
.rating li {
    list-style-type: none;
    display: inline-block;
    padding: 1px;
    text-align: center;
    font-weight: bold;
    cursor: pointer;
}
.rating .filled {
    color: red;
}

.popover-body {
    padding-top: 12.5px !important;
}

.list-unstyled li {
    margin: 5px 0;
}

.dismiss-btn {
    width: 25px;
    height: 25px;
    position: absolute;
    right: 0px;
}

.dismiss-btn i.fa {
    margin-left: -12px;
    font-size: 18px;
}

.custom-card-header {
    width: calc(100% - 60px); 
    font-size: 15px;
}

#swimlanes .badge-danger {
    background-color: red !important;
}

.muted-card {
    opacity: 0.5;
}

.header-row {
    position: absolute;
    z-index: 999999;
    top: -70px;
    left: 100px;
    width: calc(100% - 100px);
}

.modal-body .header-row {
    left: 0px !important;
    width: 100%;
}

.btn-toolbar .btn {
    height: 30px !important;
    padding-top: 5px;
    width: 30px;
    padding-left: 7.5px;
}

.btn-toolbar .btn-group {
    margin-right: 15px;
}

.ta-editor {
    min-height: 300px !important;
}

.ta-editor div[contenteditable="true"] {
    min-height: 300px !important;
}

.canvas-panel-content {
    word-break: break-word;

}

.h-20 .canvas-panel-content {
    height: 90px;
    overflow: hidden;
}

.h-25 .canvas-panel-content {
    height: 90px;
    overflow: hidden;
}

.h-33 .canvas-panel-content {
    height: 115px;
    overflow: hidden;
}

.h-46 .canvas-panel-content {
    height: 190px;
    overflow: hidden;
}

.h-48 .canvas-panel-content {
    height: 210px;
    overflow: hidden;
}

.h-90 .canvas-panel-content {
    height: 510px;
    overflow: hidden;
}

.canvas-panel-content:after {
    content: "";
    position : absolute;
    z-index: 1;
    bottom: 0;
    left: 0;
    pointer-events: none;
    background-image : linear-gradient(to bottom, rgba(255,255,255, 0), rgba(255,255,255, 1) 90%);
    width: 100%;
    height: 0em;
}

.funnel-container {
    padding-top: 60px;
    z-index: 1;
}

.funnel-container img {
    z-index: -1;
    position: absolute;
    height: 350px;
    width: 350px;
    top: 40px;
    left: calc(50% - 180px);
}

.funnel-container .row {
    height: 120px;
    z-index: 99998;
    /* border: thin solid red; */
}

.funnel-container .row > div {
    /* border: thin solid red; */
    height: 40px;
    text-align: center;
    
}

.funnel-container .row > div h2, .funnel-container .row > div h4, .funnel-container .row > div p {
    line-height: 40px;
}

.operational-row > div {
    margin-top: 70px;
    /* border-bottom: thin dashed gray; */
}

.renewal-row > div {
    margin-top: 50px;
    /* border-bottom: thin dashed gray; */
}

.expiring-row > div {
    margin-top: 25px;
    /* border-bottom: thin dashed gray; */
}

.header-funnel-row {
    position: absolute;
    width: 100%;
    top: 0px;
}

.sidebar-logo {
    width: 50px !important;
    height: 50px !important;
}

.canvas .header-row {
    top: -50px !important;
    /* width: 97.5%; */
}

.modal-dialog {
    margin-top: 100px;
}

.btn-success:disabled {
	color: #fff;
    background-color: gray !important;
    border-color: gray !important;
    box-shadow: 0 2px 6px 0 rgba(128, 128, 128, 0.5) !important;	
}

@media (min-width: 992px) {
    .nav-function-hidden:not(.nav-function-top) .page-sidebar {
        z-index: 1000001;
    }
}


div[uib-modal-window="modal-window"].modal.show {
    z-index: 99999 !important;
}

.col-md-512 {
    flex: 0 0 20%;
    max-width: 20%;
    padding-left: 12px;
    padding-right: 12px;
}

.results-panel {
    border: 1px solid rgba(0, 0, 0, 0.1); 
    border-top: none;
}

.detail-data-boxes > div.col-md-2 {
    text-align: center;
}

.detail-data-boxes span {
    font-size: 11px;
    font-weight: bold;
    
}

.detail-data-boxes h2 {
    color: #9CBF50;
    font-size: 40px;
    font-weight: bold;
    margin-top: 10px;
}

.select2-container {
    width: 100% !important;
}

.btn-primary {
    background-color: #9DC347 !important;
    border-color: #9DC347 !important;
    box-shadow: 0 2px 6px 0 rgba(0, 0, 0, 0.5) !important;
}

.btn-outline-primary {
    /* background-color: #9DC347 !important; */
    border-color: #9DC347 !important;
    color: #9DC347 !important;
    /* box-shadow: 0 2px 6px 0 rgba(0, 0, 0, 0.5) !important; */
}

.btn-outline-primary:hover, .btn-outline-primary.active, .btn-outline-primary:active, .btn-outline-primary:focus, .btn-outline-primary:not(:disabled):not(.disabled):active:focus, .btn-outline-primary:not(:disabled):not(.disabled).active:focus, .show > .btn-outline-primary.dropdown-toggle:focus {
    /* darken by 20% */
    background-color: #829a3f !important;
    border-color: #829a3f !important;
    color: #fff !important;
}

.btn-primary:hover {
    /* darken by 20% */
    background-color: #829a3f !important;
    border-color: #829a3f !important;
}

.btn-success {
    background-color: #9DC347 !important;
    border-color: #9DC347 !important;
    box-shadow: 0 2px 6px 0 rgba(0, 0, 0, 0.5) !important;
}

.btn-success:hover {
    /* darken by 20% */
    background-color: #829a3f !important;
    border-color: #829a3f !important;
}

.btn-danger {
    background-color: #87A658 !important;
    border-color: #87A658 !important;
    box-shadow: 0 2px 6px 0 rgba(0, 0, 0, 0.5) !important;
}

.btn-danger:hover {
    /* darken by 20% */
    background-color: #6c8645 !important;
    border-color: #6c8645 !important;
}

.custom-control-input:checked ~ .custom-control-label::before {
    color: #fff;
    background-color: #9CBF50 !important;
    border-color: #9CBF50 !important;
}

.page-logo, .page-sidebar {
    background-color: #1B2F44 !important;
}

.nav-menu li a > [class*='fa-'], .nav-menu li a > .ni {
    color: #fff !important;
}

.nav-menu li a {
    color: #fff !important;
}

a.nav-link-text {
    color: #fff !important;
}

a:not(.btn):not(.dropdown-item):not(.nav-link):not(.nav-item):not(.nav-link-text) {
    color: #266577;
}

.progress-bar {
    background-color: #9CBF50 !important;
}

.btn.btn-primary.active {
    background-color: #6c8645 !important;
    border-color: #6c8645 !important;
}