.reeditor_dragdrop {
    border: 1px solid black;
    padding: 2px;
    padding: 5px;
    grid-gap: 5px;
}

sp_grid_scopedparam {
    grid-column: auto;
    display: inline-grid;
    grid-template-columns: 30% 60% 10%;
    width: 100%;
    padding: 5px;
    grid-gap: 5px;
}

sp_grid_inputparameter {
    grid-column: auto;
    display: inline-grid;
    grid-template-columns: 30% 60% 10%;
    width: 100%;
    padding: 5px;
    grid-gap: 5px;
}

sp_grid_rules {
    grid-column: auto;
    display: inline-grid;
    grid-template-columns: 20% 10% 10% 10% 35% 5% 10%;
    width: 100%;
    padding: 5px;
    grid-gap: 5px;
}

rules > *:not(sp_grid_rules) {
    margin-left: 1em;
}

.sp_grid_main {
    grid-column: auto;
    display: inline-grid;
    grid-template-columns: 70% 30%;
    width: 100%;
    padding: 10px 0px 10px 0px;
    grid-gap: 5px;
}

.sp_grid_main_fullscreen {
    grid-column: auto;
    display: inline-grid;
    grid-template-columns: 100%;
    width: 100%;
    padding: 10px 0px 10px 0px;
    grid-gap: 5px;
}

.rules {
    padding: 5px;
    border: 2px;
    padding: 2px;
    grid-gap: 5px;
}

.rules_arrange {
    padding: 5px;
    border: 2px dashed gray;
    padding: 2px;
    grid-gap: 5px;
}

reeditor_blockquote {
    border-left: 10px solid #ccc;
    margin: 1.5em 10px;
    padding: 0.5em 10px;
}

    reeditor_blockquote:before {
        color: #ccc;
        font-size: 4em;
        line-height: 0.1em;
        margin-right: 0.25em;
        vertical-align: -0.4em;
    }

    reeditor_blockquote p {
        display: inline;
    }

.redditor_rules_error {
    background: salmon;
}

.redditor_rules_success {
    background: lightgreen;
}

sp_grid_tabs {
    grid-column: auto;
    display: grid;
    text-align: center;
    grid-template-columns: 50% 50%;
    width: 100%;
}

sp_grid_kvp {
    grid-column: auto;
    display: inline-grid;
    grid-template-columns: 40% 60%;
    width: 100%;
}

sp_grid_workflow {
    grid-column: auto;
    display: inline-grid;
    grid-template-columns: 95% 5%;
    text-align: center;
    align-items: center;
    justify-content: center;
    border: none;
    padding: 2px;
    grid-gap: 5px;
    width: 100%;
}

.sp_grid_workflow_children {
    margin-left: 1em;
}

.reeditor_menubutton {
    display: inline-block;
    align-items: center;
    justify-content: center;
    background-color: white;
    color: black;
    border: 2px solid #008CBA;
    cursor: pointer;
    position: relative;
    width: 100%;
    height: 30px;
    transition-duration: 0.4s;
    text-decoration: none;
}

.reeditor_menubutton_depressed {
    background-color: #008CBA;
    color: white;
}

.reeditor_button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background-color: white;
    color: black;
    border: 2px solid #008CBA;
    cursor: pointer;
    position: relative;
    width: 120px;
    height: 30px;
    transition-duration: 0.4s;
    text-decoration: none;
}

    .reeditor_button:hover {
        background-color: #008CBA;
        color: white;
    }

    .reeditor_button input[type=file] {
        position: absolute;
        width: 100%;
        height: 100%;
        opacity: 0;
        cursor: pointer;
    }

.reeditor_button_depressed {
    background-color: #008CBA;
    color: white;
}

.jsonTextArea {
    height: 100%;
    width: 100%;
    display: block;
    max-width: 100%;
    font-family: monospace;
}

.JSONErrors {
    background-color: salmon;
    width: 100%;
}
