h2 {
    font-size: 16px;
    font-weight: bold;
}

.scenario p {
    font-size: 12px; 
}

.scenario p.note {
    font-family: monospace;
}

.scenario p.error {
    color: #ff0000;
    font-size: 12px;
}

.code {
    background: #dedeff;  
    padding: 0px 15px;
    border: 1px dashed #a0a0ff;
    font-family: monospace;
    font-size: 12px;
}

.code button {
    background: none;
    border: none;
    font-weight: bold;
    padding: 0 10px 3px 10px;
    font-size: 20px;
    position: relative;
}

.code button:hover,
.code select:hover,
.code input:hover {
    background: #a0a0ff;
}

.code select {
    background: none;
    border: 1px dashed #a0a0ff;
    padding: 0 10px;
}

.code input {
    background: none;
    border: 1px dashed #a0a0ff;
    padding: 0 10px;
}

.scenario { 
    margin-bottom: 30px;
}







code .Highlight-boolean {
    color: #0086b3;
}

code .Highlight-class {
    color: #0086b3;
}

code .Highlight-comment {
    color: #969896;
}

code .Highlight-constant {
    color: #a71d5d;
}

code .Highlight-function {
    color: #795da3;
}

code .Highlight-keyword {
    color: #a71d5d;
}

code .Highlight-number {
    color: #0086b3;
}

code .Highlight-operator {
    color: #a71d5d;
}

code .Highlight-punctuation {
    color: #333;
}

code .Highlight-string {
    color: #df5000;
}