body {
    /*padding-top: 50px;*/
    /*padding-bottom: 20px;*/
}

#app {
    min-height: 100%;
}

.max-height {
    height: 100vh !important;
}

.full-height {
    height: 100%;
}

.flex {
    display: flex;
}

.fg-1 {
    flex-grow: 1 !important;
}

.fg-2 {
    flex-grow: 2 !important;
}

.fg-10 {
    flex-grow: 10 !important;
}

.full-view-height {
    min-height: 100vh;
}

#app .borg-head-icon {
    height: 30px;
    margin-top: -2px;
    margin-right: .10rem;
}



section.login {
    width: 600px;
    margin: auto;
    margin-top: 10%;
    padding: 20px;
    padding-left: 20px; /*190px;*/
    border: 1px solid rgba(0,0,0,0.1);
    border-radius: 5px;
    background-color: rgba(255,255,255,0.6);
    position: relative;
}

    section.login .emblem {
        position: absolute;
        top: 40px;
        left: 40px;
        height: 250px;
        opacity: 0.85;
    }

#particles-js {
    position: absolute;
    z-index: -1;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
}

/* Wrapping element */
/* Set some basic padding to keep content from hitting the edges */
.body-content {
    padding-left: 15px;
    padding-right: 15px;
    padding-top: 20px;
}

.content-column {
    padding-top: 40px !important;
}
/* tab pane padding */
.tab-pane {
    padding: 15px;
}

/* Carousel */
.carousel-caption p {
    font-size: 20px;
    line-height: 1.4;
}

/* Make .svg files in the carousel display properly in older browsers */
.carousel-inner .item img[src$=".svg"] {
    width: 100%;
}

/* QR code generator */
#qrCode {
    margin: 15px;
}

/* Hide/rearrange for smaller screens */
@media screen and (max-width: 767px) {
    /* Hide captions */
    .carousel-caption {
        display: none;
    }
}

li a.active {
    color: red;
}
/* json editor*/
.json-wrap .CodeMirror {
    height: 155px;
}

/* sidebar */
.sidebar {
    top: 47px !important;
}

.topbar {
    border-radius: 0 !important;
}
/*.sidebar .search {
    margin:2px;
}
.sidebar .search  input[type="text"] {
    padding: 3px;
}*/

/* content assimilator */
.testModal {
    min-height:600px;
    display:flex!important;
    flex-direction:column;
}
.testModal .CodeMirror {
    height: 500px;
}
/* content browser */
.content-browser .ui.pagination.menu {
    /*margin-top:20px;*/
}
.content-browser .img-wrap {
    position:relative;
}
    .content-browser .img-wrap span {
        position:absolute;
        bottom:0;
        left:0;
    }
    /* tags */
    .tags .delete-btn {
        margin-top: 22px;
    }

.editor {
    /*height:600px;*/
    min-height: 650px;
    max-height: 800px;
}

.snippet .editor {
    min-height: 200px;
    max-height: 200px;
}

.fullscreen-editor {
    background-color:white;
    position: fixed;
    z-index: 1000;
    height: 100vh;
    max-height: 100vh;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
}

.fs-mode .ui.modal {
    will-change: unset;
}

.ui.fullscreen.modal {
    width: 98% !important;
    left: initial !important;
    margin: 1em auto;
}

.widgetFS {
    background-color: white;
    z-index: 1000;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    min-height: 100%;
    height: auto;
}


/* fix link icon*/
i.icon.link::before {
    content: "\f0c1";
}

.handle {
    cursor: move;
}

/*.push {
    margin-top:80px;
}*/
.flex-grow-1 {
    flex-grow: 1;
}

.flex-H {
    display: flex;
    justify-content: stretch;
    flex-direction: column;
}

.column .tab {
    height: 100%;
}
    .column .tab.flex-H.active {
        display:flex;
        justify-content:stretch;
        flex-direction:column;
    }

    .ui.label.blue .ui.checkbox label,
    .ui.label.green .ui.checkbox label,
    .ui.label.red .ui.checkbox label {
        color: white !important;
    }

.highlight {
    color: #db2828 !important; /* #2185d0*/
}

.ui.modal .scrolling.content {
    max-height: 90vh !important;
}

.domScan {
    overflow-y: scroll;
    height: 80vh;
    /*position: fixed*/
}

.snippets .monaco-editor {
    min-height: 200px;
}
.monaco-editor {
    min-height:600px;
}
.monaco-mouse-cursor-text {
    padding: 0 !important;
    border: none !important;
}

/* standard margins */
.mt-10 {
    margin-top: 10px;
}

.mt-15 {
    margin-top: 15px;
}

.mt-20 {
    margin-top: 20px;
}

.mt-30 {
    margin-top: 30px;
}

.mt-40 {
    margin-top: 40px;
}

.mt-50 {
    margin-top: 50px;
}

.mt-60 {
    margin-top: 60px;
}

.mb-10 {
    margin-bottom: 10px;
}

.mb-15 {
    margin-bottom: 15px;
}

.mb-20 {
    margin-bottom: 10px;
}

.mb-30 {
    margin-bottom: 15px;
}

.min-w-20 {
    min-width: 20%;
}
/* tab segment remove border*/
.tab.segment,
.ui.attached.segment {
    border: none;
    box-shadow: none;
    -webkit-box-shadow: none;
    padding-left: 0;
    padding-right:0;
}

@media (max-width: 767.98px) {
    #pianoDashboard .mobile-hidden,
    .mobile-hidden {
        display: none !important;
    }
}
@media (min-width: 767.98px) {
    #pianoDashboard .mobile-visible,
    .mobile-visible {
        display: none !important;
    }
}