body {
    background-color: rgb(252, 252, 252);
    font-size: 0.80rem;
}

#editorSection {
}

    #editorSection .basic-grid {
        display: grid;
        grid-column-gap: 40px;
        grid-template-columns: 550px 1fr;
        padding: 10px;
    }

        #editorSection .basic-grid .right-contents {
            display: flex;
            flex-direction: column;
        }

    #editorSection .ex-heading {
        background-color: rgb(240,240,240);
        border-color: rgb(100,100,100);
        border-style: solid;
        border-bottom-width: 0px;
        border-left-width: 1px;
        border-top-left-radius: 3px;
        border-top-right-radius: 3px;
        border-right-width: 1px;
        border-top-width: 1px;
        flex-grow: 0;
        margin-top: auto;
        padding: 4px;
    }

    #editorSection .ex-structs {
        border-color: rgb(50, 50, 50);
        border-style: solid;
        border-width: 1px;
        display: grid;
        grid-column-gap: 20px;
        grid-template-columns: 1fr 1fr;
        padding: 10px;
    }

        #editorSection .ex-structs .right-contents {
            display: flex;
            flex-direction: column;
        }

        #editorSection .ex-structs .ex-struct-group {
        }

            #editorSection .ex-structs .ex-struct-group ~ .ex-struct-group {
                line-height: 140%;
                margin-top: auto;
            }

            #editorSection .ex-structs .ex-struct-group .example-struct {
                color: rgb(0, 0, 255);
                margin-left: 10px;
                width: 100%;
            }

                #editorSection .ex-structs .ex-struct-group .example-struct:hover {
                    background-color: rgb(240, 240, 255);
                    cursor: pointer;
                }

            #editorSection .ex-structs .ex-struct-group .example-struct-heading {
                font-weight: bold;
            }

#introSection {
}

    #introSection .basic-grid {
        display: grid;
        grid-column-gap: 30px;
        grid-template-columns: 1fr 1fr;
    }

        #introSection .basic-grid .left-contents p:last-child {
            margin-bottom: 0px;
        }

        #introSection .basic-grid .right-contents p:last-child {
            margin-bottom: 0px;
        }

.struct-editor {
}

    .struct-editor .bottom-cmnds {
        background-color: rgb(230, 230, 230);
        border-color: rgb(0, 0, 0);
        border-style: solid;
        border-width: 1px;
        padding: 10px;
    }

    .struct-editor canvas {
        border-color: rgb(0, 0, 0);
        border-style: solid;
        border-width: 1px;
    }

    .struct-editor .demo-video {
        background-color: inherit;
        border: none;
        color: rgb(0,0,255);
        float: right;
        font-size: inherit;
        line-height: inherit;
        margin-right: 8px;
        padding: 2px;
        text-align: right;
        text-decoration: underline;
    }

        .struct-editor .demo-video:hover {
            background-color: rgb(200,200,200);
        }

    .struct-editor .edit-button {
        margin-right: 10px;
        padding: 2px;
        width: 120px;
    }

    .struct-editor .top-cmnds {
        background-color: rgb(230, 230, 230);
        border-color: rgb(0, 0, 0);
        border-style: solid;
        border-width: 1px;
        display: grid;
        grid-template-columns: 1fr 1fr 1fr;
        grid-column-gap: 20px;
        margin-bottom: 2px;
        padding-bottom: 10px;
        padding-left: 20px;
        padding-right: 20px;
        padding-top: 10px;
    }

        .struct-editor .top-cmnds select {
            color: rgb(0, 0, 255);
            width: 100%;
        }