/*a class found in CfgLoader when the debugger is activated in a language file.*/
.Debug-Content {
    border: 1px dotted black;

}

/* ========================================================== */
/*                    Preloader                       */
/* ========================================================== */
#preloader {
    position:fixed;
    top:0;
    left:0;
    right:0;
    bottom:0;
    background-color:#fff; /* change if the mask should have another color then white */
    z-index:999999; /* makes sure it stays on top */
}

#status {
    width:200px;
    height:200px;
    color:#fff;
    position:absolute;
    left:50%; /* centers the loading animation horizontally one the screen */
    top:50%; /* centers the loading animation vertically one the screen */
    background-image:url(/images/rosette.gif); /* path to your loading animation */
    background-repeat:no-repeat;
    background-position:center;
    margin:-100px 0 0 -100px; /* is width and height divided by two */
}

#status p{text-align:center;}

/*.tab-pane { padding: .25em; }*/

/*
 * Custom translucent site header
 */

.site-header {
    background-color: rgba(0, 0, 0, .85);
    -webkit-backdrop-filter: saturate(180%) blur(20px);
    backdrop-filter: saturate(180%) blur(20px);
}
.site-header a {
    color: #999;
    transition: ease-in-out color .15s;
}
.site-header a:hover {
    color: #fff;
    text-decoration: none;
}


.link{
    cursor: hand;
    cursor: pointer;
}

.dbt_tips{
    padding: 1em;
}

.tinyeditor_2017 {
    background-color: antiquewhite;
}

/* Oct23; new DBUI field type; appendonly logic where the old value is read-only and the new input can only be appended */
.dbui-appendonly-content {
    padding-left:15px;
    border-radius:3px;
    box-shadow: 0px 4px 20px 0px rgba(0,0,0,0.14), 0px 7px 10px -5px rgba(76,175,80,0.4);
    font-weight: 600;
    font-size: 15px;
}

.dbui-appendonly-instructions {
    color: #590000;

}

/* Some basic extensions to bootstrap's basic colors */
/** New card style tuning, may 2020 **/
.card-header-icon {
    border-radius:3px;
    background-color: #999;
    padding:15px;
    margin-top:-20px;
    margin-right:15px;
    float:left;
    font-weight: 300;
    font-size: 14px;
    box-shadow: 0px 4px 20px 0px rgba(0,0,0,0.14), 0px 7px 10px -5px rgba(76,175,80,0.4);
}

.card-header-image{
    padding:5px;
    float:right;
    margin-top:-50px;
}

.panel-usercolor .card-header {
    /*background-color: rgba(131, 180, 131, 0.3);*/
    background-image:linear-gradient(60deg, rgba(255, 255, 255, 0.4), rgba(0, 0, 0, 0.05));
}

.panel-green, .panel-blue, .panel-red, .panel-yellow {
    margin-top: 1em;
}

.panel-green {
    border-color: #5cb85c !important;
}

.panel-green .card-header {
    color: #000;
    /*background-color: rgba(131, 180, 131, 0.3);*/
    background-image:linear-gradient(60deg, rgba(131, 180, 131, 0.3), rgba(29, 194, 29, 0.3));
}

.panel-green .card-header-icon {
    background-image:linear-gradient(60deg, rgb(102, 187, 106), rgb(67, 160, 71));
}

.panel-green .card-header .btn-primary {
    background-color: #1c581c !important;
    border-color: #1c581c !important;
    color: #fff !important;
}

.panel-green a {
    color: #5cb85c;
}

.panel-green a:hover {
    color: #3d8b3d;
}

.panel-blue {
    border-color: #5c5cb8 !important;
}

.panel-blue .card-header {
    color: #000;
    /*background-color: rgba(131, 180, 131, 0.3);*/
    background-image:linear-gradient(60deg, rgba(171, 171, 252, 0.3), rgba(92, 92, 184, 0.3));
}

.panel-blue .card-header-icon {
    background-image:linear-gradient(60deg, rgb(102, 106, 187), rgb(67, 71, 160));
    color: #fff;
}
.panel-blue .card-header .btn-primary {
    background-color: #0c0c78 !important;
    border-color: #0c0c78 !important;
    color: #fff !important;
}

.panel-blue a {
    color: #5c5cb8;
}

.panel-blue a:hover {
    color: #3d3b8d;
}

.panel-red {
    border-color: #d9534f !important;
}
.panel-red .card-header {
    color: #000;
    /*background-color: rgba(131, 180, 131, 0.3);*/
    background-image:linear-gradient(60deg, rgba(232, 143, 139, 0.3), rgba(217, 83, 79, 0.3));
}

.panel-red .card-header-icon {
    background-image:linear-gradient(60deg, rgb(187, 106, 106), rgb(160, 71, 71));
    color: #fff;
}
.panel-red .card-header .btn-primary {
    background-color: #530c0e !important;
    border-color: #530c0e !important;
    color: #fff !important;
}

.panel-red a {
    color: #d9534f;
}

.panel-red a:hover {
    color: #b52b27;
}

.panel-yellow {
    border-color: #f0ad4e !important;
}
.panel-yellow .card-header {
    color: #000;
    /*background-color: rgba(131, 180, 131, 0.3);*/
    background-image:linear-gradient(60deg, rgba(248, 195, 122, 0.5), rgba(240, 173, 78, 0.3));
}
.panel-yellow .panel-heading {
    border-color: #f0ad4e;
    color: #fff;
    background-color: rgba(240, 173, 78, 0.3);
}
.panel-yellow .card-header-icon {
    background-image:linear-gradient(60deg, #f0ad4e, #a08d0e);
}
.panel-yellow .card-header .btn-primary {
    background-color: #a37130 !important;
    border-color: #a37130 !important;
    color: #000 !important;
}
.panel-yellow a {
    color: #f0ad4e;
}

.panel-yellow a:hover {
    color: #df8a13;
}

.dbui-card {

}

.dbui-card .card-header {
    color: #000;
    /*background-color: rgba(131, 180, 131, 0.3);*/
    background-image:linear-gradient(60deg, rgba(248, 195, 122, 0.5), rgba(240, 173, 78, 0.3));
}
.dbui-card a {
    color: #d97b4f;
    text-decoration: none;
}

.dbui-card a:hover {
    color: #6d3838;
}
.dbui-card .card-body a {
    color: #d97b4f;
    text-decoration: none;
}

.dbui-card .card-body a:hover {
    color: #6d3838;
}

/**
 * A little polishing for our engine features.
 */
.header-content {
    border-radius:3px;
    background-image:linear-gradient(60deg, rgba(171, 171, 252, 0.3), rgba(92, 92, 184, 0.3));
    padding:15px;
}
.header-content-icon {
    border-radius:3px;
    background-color: #999;
    padding:15px;
    /*margin-top:-20px;**/
    margin-right:15px;
    float:left;
    font-weight: 300;
    font-size: 14px;
    color: #fff;
    box-shadow: 0px 4px 20px 0px rgba(0,0,0,0.14), 0px 7px 10px -5px rgba(76,175,80,0.4);
    background-image:linear-gradient(60deg, rgba(171, 171, 252, 0.3), rgba(92, 92, 184, 0.3));
/*    transform: rotate(-15deg);*/
}
.header-content .btn-primary {
    background-color: #5C5CB8 !important;
    border-color: #5C5CB8 !important;
    color: #fff !important;
    margin-top: 1em;
}
.sort-order-icon {
    border-radius:3px;
    background-color: #fff;
    padding:5px;
    float:left;
    font-size: 12px;
    box-shadow: 0px 4px 20px 0px rgba(0,0,0,0.14), 0px 7px 10px -5px rgba(76,175,80,0.4);
}
.ct-editor-activator {
    border-radius:3px;
    background-color: #fff;
    margin-top:-15px;
    margin-right:15px;
    position: relative;
    top: 10px;
    left: -12px;
    font-weight: 300;
    font-size: 14px;
}
.ct-editor-close {
    border-radius:3px;
    background-color: #fff;
    margin-top:-15px;
    margin-right:15px;
    float:left;
    font-weight: 300;
    font-size: 14px;
}
.content-edit {
    border-radius:3px;
    border-color: #0c0c78 !important;

    padding:15px;
    margin-top:-20px;
    margin-right:15px;
    float:left;
}
.content-edit-background {
    /*background-image:linear-gradient(60deg, rgb(26, 27, 68), rgb(67, 71, 160));**/
    padding: 5px;
    border-color: #0c0c78 !important;
    border-radius:3px;
    border: 2px dashed;
}

.footer-content {

}

.beta-feature {

}
.beta-feature::after {
    content: url("/images/beta_feature.png");
}




/* Small devices (landscape phones, 576px and up) */
@media (min-width: 576px) and (max-width: 767.98px) {
    .card-columns {
        column-count: 2 !important;
    }
}
/** Medium devices (tablets, 768px and up)*/
@media (min-width: 768px) and (max-width: 991.98px) {
    .card-columns {
        column-count: 3 !important;
    }
}
/* Large devices (desktops, 992px and up) */
@media (min-width: 992px) and (max-width: 1199.98px) {
    .card-columns {
        column-count: 4 !important;
    }
}
/* Extra large devices (large desktops, 1200px and up) */
@media (min-width: 1200px) {
    .card-columns {
        column-count: 5 !important;
    }
}
/* 4K super large devices (large desktops, 1200px and up) */
@media (min-width: 2200px) {
    .card-columns {
        column-count: 6 !important;
    }
}

/* =========================[ Calendar details ]================================== */
.day, .day-header {
    width: 14.28571%;
}
.day-header {
    color: #F98909;
    padding: 5px;
    justify-content: center;
    display: flex;
}
.week {
    display: flex;
}
.week-header {
    height: 30px;
    display: flex;
}
.week:first-of-type {
    /*text-align: right;*/
    display: flex; justify-content: flex-end;
}
.week:last-of-type {
    text-align: left;
}

.month-header .row .col {
    justify-content: center;
    display: flex;
}


.huge {
    font-size	: 3em;
}

.important-message {
    font-size: 2em;
}

.article-sidebar ul {
    background-color: #d0ae97;
    box-shadow: 0 4px 20px 0 rgba(0,0,0,.14), 0 7px 10px -5px rgba(156,39,176,.4);
}
.article-sidebar .nav-link.active {
    background-color: #9c27b0 !important;
    box-shadow: 0 4px 20px 0 rgba(0,0,0,.14), 0 7px 10px -5px rgba(156,39,176,.4);
}

/*
 * Sparkline details
 */
/*body {*/
/*    font-family: sans-serif;*/
/*    padding: 50px;*/
/*}*/

/*div {*/
/*    position: relative;*/
/*}*/

/**[hidden] {*/
/*    display: none;*/
/*}*/

.tooltip {
    position: absolute;
    background: rgba(0, 0, 0, .7);
    color: #fff;
    padding: 2px 5px;
    font-size: 12px;
    white-space: nowrap;
    z-index: 9999;
}

.sparkline--cursor {
    stroke: orange;
}

.sparkline--spot {
    fill: red;
    stroke: red;
}

.ico-cascadeDelete {
    color: lightblue;
}

.ico-seedTable {
    color: green;
}

.ico-admin-locked {
    color: lightcoral;
}
.ico-admin-unlocked {
    color: lightblue;
}

/* Local styles */
.author {
    font-style: italic;
    font-weight: bold;
}
.emphasis {
    font-style: italic;
}
pre.code {
    background-color: #0a0a0a;
    color: #00FFFF;
    font-weight: bold;
}
.technical-comment {
    padding-left: 128px;
    padding-left: 5.62rem;
    font-style: italic;
    background:url("/images/bookmark_tile.png") repeat-y;
    background-size:50px auto;
}