body {
    font: 14px "Droid Sans",sans-serif; 
    width: 350px; 
    height: auto;
    overflow-x: hidden; 
    touch-action: pinch-zoom; 
}

h1 { 
    width: 640px; 
    font: 20px "Droid Sans", sans-serif; 
    color: indigo;
}

.hcolor { 
    padding: 5px; 
    background-color: lemonchiffon; 
}

.row {
    width: 640px;
    border: 1px solid grey;
    border-bottom: 0;
    background-color: ivory;
    position: relative;
    overflow: hidden;
}

.image {
    background-color: ivory;
    border: 1px solid grey;
    width: 350px;
    margin: 2px 2px 2px 0px;
    padding: 2px 2px 2px 2px;
    overflow: hidden;
}

.text {
    overflow: hidden;
    margin-right:2px;
}

.txtbox {
    padding: 6px 8px 6px 8px;
    border: 1px solid gray;
    margin: 2px 2px 2px 2px;
}

h2, p {
    font: 14px "Droid Sans",sans-serif;
    padding: 0px 0px 0px 0px;
    margin:  0px 0px 0px 0px;
    -webkit-text-size-adjust: none;
}

.textwidth { width: 290px;}
.playsound { color: teal;}
.speech    { width: 280px; line-height: 1.2; padding: 5px; background-color: FloralWhite; }
.comment   { color: gray; }
.image     { background-color: ivory }

span.prefix    { color: rosybrown }
span.verb      { color: red }
span.det       { color: blue }
span.color     { color: gold }
span.colorinfo { color: gold; display: initial; }
span.theme     { color: darkgreen }
span.bracket   { color: gray }
span.orient    { color: deepskyblue }
span.prep      { color: chocolate }
span.target    { color: maroon }
span.manner    { color: tan }
span.suffix    { color: rosybrown }

@media screen and (max-width: 580px) {
    h1 {
        font-size: 16px;
    }
}