@font-face{
    font-family: 'Elstob';
    src:url(https://www.oldenglishaerobics.net/fonts/Elstob[GRAD,opsz,wght].woff2) format('woff2-variations');
    font-weight: 200 800;
    font-style: normal;
}
@font-face{
    font-family: 'Elstob';
    src:url(https://www.oldenglishaerobics.net/fonts/Elstob-Italic[GRAD,opsz,wght].woff2) format('woff2-variations');
    font-weight: 200 800;
    font-style: italic;
}
@font-face{
    font-family:Junicode;
    font-weight:normal;
    font-style:normal;
    src:local("Junicode"),
    local("Junicode Regular"),
    local("Junicode-Regular"),
    url(https://www.oldenglishaerobics.net/fonts/Junicode-Regular.woff) format("woff"),
    url(https://www.oldenglishaerobics.net/fonts/Junicode-Regular.ttf) format("truetype");
}
@font-face{
    font-family:Junicode;
    font-weight:bold;
    font-style:normal;
    src:local("Junicode Bold"),
    local("Junicode-Bold"),
    url(https://www.oldenglishaerobics.net/fonts/Junicode-Bold.woff) format("woff"),
    url(https://www.oldenglishaerobics.net/fonts/Junicode-Bold.ttf) format("truetype");
}
@font-face{
    font-family:Junicode;
    font-weight:normal;
    font-style:italic;
    src:local("Junicode-Italic"),
    local("Junicode Italic"),
    url(https://www.oldenglishaerobics.net/fonts/Junicode-Italic.woff) format("woff"),
    url(https://www.oldenglishaerobics.net/fonts/Junicode-Italic.ttf) format("truetype");
}
@font-face{
    font-family:Junicode;
    font-weight:bold;
    font-style:italic;
    src:local("Junicode BoldItalic"),
    local("Junicode-BoldItalic"),
    url(https://www.oldenglishaerobics.net/fonts/Junicode-BoldItalic.woff) format("woff"),
    url(https://www.oldenglishaerobics.net/fonts/Junicode-BoldItalic.ttf) format("truetype");
}
body { background: #f1ebdf; font-family: junicode; line-height: 1.4em; }
@supports (font-variation-settings: 'wght' 400) {
    body {
        background: #f1ebdf;
        font-family: Elstob;
        font-variation-settings: 'wght' 400, 'opsz' 8, 'GRAD' 1;
        line-height: 1.4em;
    }
}
#resp {display: none; }
.ex { position: absolute; top: 20px; height: 530px; width: 50; }
#prevctr, #nextctr { position: absolute; top: 200px; height: 37px; width: 38px; }
.ex { display: none; left: 75px; width: 690px; border: 1px solid #cdc3b7;
      border-radius: 6px; background-color: #f9f7f5; }
#prevctr { left: 25px; background-image: url(../images/prev.png); background-repeat: no-repeat; }
#nextctr { left: 780px; background-image: url(../images/next.png); background-repeat: no-repeat; }
#prevctr:hover { background-image: url(../images/prev-hover.png); }
#nextctr:hover { background-image: url(../images/next-hover.png); }
#nextctr.disabled { background-image: url(../images/next-inactive.png); }
#prevctr.disabled { background-image: url(../images/prev-inactive.png); }
#totalscore { position: absolute; left: 75px; width: 690px; top: 559px; border: 1px solid #cdc3b7;
              border-radius: 6px; height: 61px; text-align: center; background-color: #f9f7f5; }
/* #totalscore p { display: table; width: 650px; vertical-align: middle; text-align: center; } */
#totalscore div { margin-top: 15px; }
#introtext, .beginmsg, .endmsg { display: none; }
#title { display: none; }
.startup {display: none; }
/* .ex .textcontainer { margin-left: 10px; margin-top: 10px; padding: 4px; width: 662px; height: 138px;
                     border: 1px solid #cdc3b7; border-radius: 6px; overflow: auto;
		     background-color: #f5f1ea; } */
.ex .textcontainer { margin-left: 10px; margin-top: 10px; padding: 4px; width: 662px; height: 138px;
                     border: 1px solid #cdc3b7; border-radius: 6px;
		     background-color: #f5f1ea; }
.textcontainer td { padding-left: 8px; padding-right: 8px; padding-top: 0; padding-bottom: 0; }
/* .ex .instr { margin-left: 10px; margin-top: 10px; padding: 4px; width: 662px;
             border: 1px solid #cdc3b7; border-radius: 6px; height: 69px; overflow: auto;
	     background: #f5f1ea; } */
.ex .instr { margin-left: 10px; margin-top: 10px; padding: 4px; width: 662px;
             border: 1px solid #cdc3b7; border-radius: 6px; height: 69px; background: #f5f1ea; }
.middlematter { margin-left: 10px; margin-top: 10px; width: 670px; height: 211px; padding: 6px 0px 0px 0px; }
.bottommatter { margin-left: 10px; margin-top: 10px; width: 670px; height: 45px;
                clear: both; }
.ui-button { width : 160px; }
.navbutton { position: relative; top: 210px; }
.submitbutton, #homebutton { float: left; }
.giveupbutton, #glossbutton { float: right; }
#homebutton, #glossbutton { margin-top: 10px; }
#homebutton { margin-left: 10px; }
#glossbutton {margin-right: 10px; }
.exmessage { text-align: center; }
.click .word, .combo .word { cursor: pointer; }
.answer { background-color: #f5deb3; }
.hvanswer { background-color: #e5cea3; }
.rightword { color: #007900; }
.wrongword { color: red; }
.missingword { color: #d3008d; }
.choice ul, .combo ul, .multichoice ul { float: left; list-style-type: none; margin-left: 0; margin-right: 10px;
			margin-top: 0px; margin-bottom: 0px; padding: 10px 10px 10px 5px;
			border: 1px solid #cdc3b7; border-radius: 6px; background: #f9f7f5; }
.choice li, .combo li, .multichoice li { padding-left: 20px; cursor: pointer; }
.dropright { color: #007900; }
.dropwrong { color: red; }
.dropmissing { color: #d3008d; }
.liright { background-image: url(../images/right.png);
           background-repeat: no-repeat;
	   background-position: 0 0; }
.liwrong { background-image: url(../images/wrong.png);
           background-repeat: no-repeat;
	   background-position: 0 0; }
.limissing { background-image: url(../images/missing.png);
             background-repeat: no-repeat;
	     background-position: 0 0; }
.inactive, .dim { opacity: 0.7; }
.hi { background-color: #F0E68C; }
.tip { color: blue; }
.target { display: none; }
.text { display: none; }
.exdrag { position: relative; padding: 4px; border: 1px solid #cdc3b7; border-radius: 3px;
          background-color: #f5f1ea; cursor: move; }
.bc { display: none; }
/* .ui-draggable-dragging { -moz-box-shadow: 5px 5px 5px #555; box-shadow: 5px 5px 5px #555; } */
#msgtemplate { display: none; }
.pointsavail, #totscore {font-size: 150%; color: red; }
.ui-dialog-content { font-family : junicode; }
@supports (font-variation-settings: 'wght' 400) {
    .ui-dialog-content {
        font-family : Elstob;
        font-variation-settings: 'wght' 400, 'opsz' 8, 'GRAD' 1;
    }
}
/* "Speech bubble" thanks to Nicolas Gallagher, http://nicolasgallagher.com/pure-css-speech-bubbles/demo/ */
.triangle-right { position: relative; padding: 15px; margin: 1em 0 3em; color: #fff; background: #075698;
		  background: -webkit-gradient(linear, 0 0, 0 100%, from(#2e88c4), to(#075698));
		  background: -moz-linear-gradient(#2e88c4, #075698); background: -o-linear-gradient(#2e88c4, #075698);
		  background: linear-gradient(#2e88c4, #075698); -webkit-border-radius: 10px;
		  -moz-border-radius: 10px; border-radius: 10px; width: 150px; z-index: 10000; left: 740px;
		  top: 50px; }
.triangle-right.left { margin-left: 40px; background: #075698; z-index: 10002; }
.triangle-right:after { content: ""; position: absolute; bottom: -20px; left: 50px; border-width: 20px 0 0 20px;
			border-style: solid; border-color: #075698 transparent;  display: block;  width: 0;
			z-index: 10005; }
.triangle-right.top:after { top: -20px; right: 50px; bottom: auto; left: auto; border-width: 20px 20px 0 0;
			    border-color: transparent #075698;  z-index: 10006; }
.triangle-right.left:after { top: 16px;  left: -40px; bottom: auto; border-width: 15px 40px 0 0;
			     border-color: transparent #075698; z-index: 10007; }
/* textarea.trans {width: 662px; height: 69px; border-radius: 6px;
                overflow: auto; border: 1px solid #cdc3b7; padding: 4px; resize: none;} */
textarea.trans {width: 662px; height: 69px; border-radius: 6px;
                border: 1px solid #cdc3b7; padding: 4px; resize: none;}
/* div.trans_ans {width: 662px; height: 69px; border-radius: 6px; overflow: auto;
               border: 1px solid #cdc3b7; padding: 4px; margin-top: 10px; background: #f5f1ea;} */
div.trans_ans {width: 662px; height: 69px; border-radius: 6px;
               border: 1px solid #cdc3b7; padding: 4px; margin-top: 10px; background: #f5f1ea;}
textarea[disabled] {color: black;}
textarea:disabled {color: black;}