body {
 font-family: Arial;
 padding: 0 0 0 0;
 margin: 0 10px 0 10px;
}

a {
 color: #00d;
}

a:hover {
 text-decoration: none;
 color: #f50;
}

a.nogo {
 text-decoration: none;
 border-bottom: 1px dashed #00d;
}

a.nogo:hover {
 border-bottom: 1px dashed #f50;
}

h1 {
 margin: 10px 5px 5px 5px;
}

h2 {
 margin: 8px 4px 4px 4px;
 font-size: 22px;
}

h3 {
 margin: 6px 3px 3px 3px;
}

h4 {
 margin: 4px 2px 2px 2px;
}

#header {
 margin: 0px 0px 0px 0px;
 padding: 0 0 0 0;
 border-left: 8px solid #007;
 border-bottom: 1px solid #007;
 border-right: 1px solid #007;
 background-color: #f2f2f2;
 overflow: hidden;
}

#footer {
 clear: both;
 height: 100%;
 margin: 0 0 0 0;
 padding: 10px 10px 0 10px;
}

#container {
 width: 100%;
 float: left;
 margin-right: -235px;
}

#content {
 margin-right: 235px;
}

#rightBar {
 width: 235px;
 float: right;
}

#rightBarContent {
 background-color: #f2f2f2;
 margin-top: 10px;
 border-left: 1px solid #007;
 border-right: 1px solid #007;
 border-bottom: 1px solid #007;
}

.rightBarTitle {
 font-size: 1.1em;
 background-color: #ecefff;
 border-left: 8px solid #007;
 border-top: 1px solid #007;
 border-right: 1px solid #007;
 border-bottom: 1px solid #007;
 margin-left: -1px;
 margin-right: -1px;
 padding: 5px 4px 5px 4px;
}

.rightBarTitleTurn {
 float: right;
}

#logo {
 padding: 5px 5px 5px 5px;
 float: left;
 font-size: 1.1em;
 font-weight: bold;
}

#logo small {
 font-size: 0.7em;
 font-weight: normal;
}

#menu {
 float: right;
}

#menu ul {
 margin: 0 0 0 0;
 padding: 5px 5px 5px 5px;
}

#menu li {
 display: inline;
 padding-right: 5px;
}

#console {
# border: 1px solid #000;
 float: right;
 clear: right;
}

#apiCallProgress {
 background-color: #00f;
 width: 50px;
 height: 15px;
 position: fixed;
 top: 30px;
 right: 13px;
}

#apiCallError {
 background-color: #ffd;
 border: 1px solid #f00;
 padding: 5px 10px 5px 5px;
 width: 218px;
 position: fixed;
 top: 50px;
 right: 10px;
}

#apiCallError * {
 margin: 0 0 0 0;
 padding: 0 0 0 0;
}

.closeButton {
 position: absolute;
 right: 3px; 
 top: 0;
 font-size: smaller;
 color: #f00;
 text-decoration: none;
}

#trainingTitle {
 border: 1px solid #ddd;
# background-color: #f2f2f2;
 padding: 2px 5px 5px 5px;
 margin: 10px 10px 0 0;
}

.textBox {
 border: 1px solid #ddd;
 padding: 2px 5px 5px 5px;
 margin-top: 10px;
}

#questionLinks {
 padding: 0 0 0 3px;
}

#questionLinksTitle {
 float: left;
}

#questionLinks ul{
 display: inline;
 padding: 0;
 margin: 0;
} 

#questionLinks li {
 display: inline;
 padding: 0;
 margin: 0;
}

#questionLinks a {
 text-decoration: none;
}

.naq, .caq, .gaq, .waq {
 padding: 0px 4px 0px 4px;
 border: 1px solid #ddd;
 margin: 0 0 0 0;
}

.naqc, .caqc, .gaqc, .waqc {
 padding: 0px 4px 0px 4px;
 border: 3px solid #f50;
 margin: -2px -2px -2px -2px; 
}

.caq, .caqc {
 background-color: #afa;
}

.gaq, .gaqc {
 background-color: #ffa;
}

.waq, .waqc {
 background-color: #fbb;
}

.answer_image {
 border: 3px solid #f50;
 float:right;
 position:relative;
 top: -20px;
 right: -20px;
}

.congrats_image_right {
 float: right;
}

.congrats_image_left {
 float: left;
 margin: 5px;
}

#question {
 border-left: 10px solid #f50;
 border-right: 1px solid #ddd;
 border-bottom: 1px solid #ddd;
 border-top: 1px solid #ddd;
# background-color: #f2f2f2;
 padding: 0px 5px 5px 5px;
 margin-top: 10px;
}

.answer_comment {
 border: 1px solid #ddd;
 background-color: #ffd;
 padding: 4px 4px 4px 4px; 
 margin: 4px 3px 4px 3px; 
 height: 100px;
 overflow: auto;
 text-align: left;
}

.q_answer_comment {
 width: 300px;
 border: 1px solid #000;
 background-color: #ffd;
 padding: 5px 5px 5px 5px; 
}

.answer_comment_cont {
 float: left;
 padding: 1px 5px 1px 5px;
 font-size: 0.5em;
}

#finishNote {
 border: 1px solid #ddd;
 background-color: #ffd;
 padding: 5px 5px 5px 5px;
 margin-top: 10px;
 overflow: hidden;
}

#answers {
 margin: 0 0 0 0;
 padding: 0 0 0 0;
}

#answers td {
 vertical-align: top;
}

#answers .naq, 
#answers .caq, 
#answers .gaq, 
#answers .waq {
 margin: 10px 10px 0px 0px;
# width: 480px;
 padding: 5px 5px 5px 5px;
}

#answers .naqc, 
#answers .caqc, 
#answers .gaqc, 
#answers .waqc {
 margin: 8px 8px -2px -2px; 
# width: 480px;
 padding: 5px 5px 5px 5px;
}

#textualQuestionImage {
 width: 700px;
}

.textualAnswer {
 width: 300px;
}

#textualQuestionCorrectAnswer {
 position: fixed;
 left: 0px;
 top: 10px;
 width: 100%;
 border: 1px solid #000;
 background-color: #fff;
 padding: 0;
 z-order: 1000;
}

#points, #time_left, #time_elapsed {
 font-size: 5em;
 padding: 5px 5px 5px 5px;
}

#givenAnswers ul {
 padding: 0 0 0 0;
 margin: 5px 5px 5px 5px;
}

#givenAnswers li {
 font-size: 1.1em;
 list-style: none;
}

.sep {
 margin-left: 5px;
 padding-left: 10px;
 border-left: 1px solid #ddd;
}

td.sep {
 padding-left: 10px;
 border-left: 1px solid #ddd;
}

tr.top_sep td, td.top_sep {
 border-top: 1px solid #ddd;
 padding-top: 3px;
}

.box {
 margin: 10px 10px 0px 0px;
 padding: 5px 5px 5px 5px;
 border: 1px solid #ddd;
}

.box1 {
 margin: 10px 0 0px 0px;
 padding: 5px 5px 5px 5px;
 border: 1px solid #ddd;
}

.ratingBox {
 margin: 10px 10px 0 0;
 float: left;
 padding: 5px 5px 5px 5px;
 border: 1px solid #ddd;
}

.ratingBoxTitle, .boxTitle {
 margin: -6px -5px 5px -5px;
 padding: 1px 5px 4px 5px;
 border-left: 10px solid #f50;
 border-bottom: 1px solid #ddd;
}

.title {
 border: 1px solid #ddd;
 padding: 2px 5px 5px 5px;
 margin: 10px 0 0 0;
}

table.rating {
 width: 100%;
# border: 1px solid #000;
}

table.rating td {
 padding: 4px 2px 2px 10px;
# border: 1px solid #000;
 border-bottom: 1px solid #ddd;
 font-size: 1.7em;
}

td.rPos {
 text-align: right;
 vertical-align: top;
}

td.rUser {
 text-align: left;
 vertical-align: top;
}

td.rSep {
 text-align: center;
 vertical-align: top;
}

td.rValue {
 text-align: right;
 vertical-align: top;
}

.rComment {
 font-size: 40%;
 padding-bottom: 1px;
 color: #000;
}

td.rPosC {
 text-align: right;
 vertical-align: top;
 color: #f50;
}

td.rUserC {
 text-align: left;
 vertical-align: top;
 color: #f50;
}

td.rSepC {
 text-align: center;
 vertical-align: top;
 color: #f50;
}

td.rValueC {
 text-align: right;
 vertical-align: top;
 color: #f50;
}

.rCommentC {
 font-size: 40%;
 padding-bottom: 1px;
 color: #000;
}

div.rUser {
# font-size: 1.25em;
 float: left;
}

div.rValue {
# font-size: 1.25em;
 float: left;
 margin-right: 15px;
}

.rTurn {
 margin-top: 22px; 
 font-size: 0.7em;
 float: right;
}

.ratingPages {
 margin-top: 5px;
 margin-right: -1px;
 float: right;
 padding: 1px 1px 1px 1px;
}

#allTrainingRecordsContainer .ratingPages, 
#trainingsContainer .ratingPages,
#chooseTrainingContainer .ratingPages,
#usersContainer .ratingPages,
#questionGroupsContainer .ratingPages,
#trainingResultsContainer .ratingPages,
#userGroupsContainer .ratingPages 
{
 margin-right: 3px;
}

.ratingTotal {
 margin-top: 5px;
 float: left;
 padding: 1px 1px 1px 1px;
}

#allTrainingRecordsContainer .ratingTotal, 
#userGroupsContainer .ratingTotal, 
#usersContainer .ratingTotal, 
#trainingResultsContainer .ratingTotal, 
#questionGroupsContainer .ratingTotal, 
#chooseTrainingContainer .ratingTotal,
#trainingsContainer .ratingTotal 
{
 margin-left: 10px;
}

.curPage {
# background-color: #ddd;
 border: 1px solid #ddd;
 padding: 1px 3px 1px 3px;
}

#debugWindow {
 height: 200px;
 width: 100%;
 position: fixed;
 bottom: 0px;
 left: 0px;
 border: 1px solid #000;
 background-color: #ddd;
 padding: 0 0 0 0;
 z-order: 1000;
}

#debug {
 margin: 0 0 0 0;
 overflow: scroll;
 height: 100%;
 width: 100%;
 font-family: Monospace;
}

#updateDebug {
 padding: 1px 2px 1px 2px;
 border: 1px solid #000;
 background-color: #ccc;
 position: absolute;
 right: 90px;
 top: 10px;
}

#writeDebug {
 padding: 1px 2px 1px 2px;
 border: 1px solid #000;
 background-color: #ccc;
 position: absolute;
 right: 40px;
 top: 10px;
}

#hideDebug, #showDebug {
 padding: 1px 2px 1px 2px;
 border: 1px solid #000;
 background-color: #ccc;
 position: absolute;
 right: 20px;
 top: 10px;
}

.progressBarList {
 margin: 5px 0 0 0;
 padding: 0 0 0 0;
# border: 1px solid #000;
}

.progressBarList li {
 margin: 2px 0 0 0;
 list-style: none;
}

.smallProgressBar {
 padding: 1px 1px 1px 1px;
 height: 10px;
 border: 1px solid #ddd;
}

.progressBarFill {
 height: 100%; 
}

.text {
 padding: 5px 5px 5px 5px;
}

.inline {
 display:inline;
}

.finishNoteResults {
 float: right;
 padding-left: 10px;
 padding-top: 6px;
}

#showBigPreviews, #showSmallPreviews {
 padding-left: 4px;
}

#allTrainingRecordsContainer, 
#trainingResultsContainer, 
#chooseTrainingContainer
{
 border-top: 1px solid #ddd;
 border-left: 1px solid #ddd;
 border-bottom: 1px solid #ddd;
 border-right: 1px solid #ddd;
 padding-bottom: 5px;
 margin: 10px 0px 10px 0px;
 overflow: hidden;
}

#userGroupsContainer, 
#questionGroupsContainer, 
#trainingsContainer,
#usersContainer 
{
 border-top: 1px solid #ddd;
 border-left: 1px solid #ddd;
 border-bottom: 1px solid #ddd;
 border-right: 1px solid #ddd;
 padding-bottom: 5px;
 margin: 10px 0 10px 0px;
 overflow: hidden;
}

#allTrainingRecords, 
#trainings,
#users,
#questionGroups,
#userGroups
{
 border-spacing: 5px 5px;
 margin-top: -6px;
 margin-left: -6px;
 width: 100%;
 font-size: 1.3em; 
}

#trainingResults
{
 border-spacing: 5px 5px;
 margin-top: -6px;
 margin-left: -6px;
 width: 100%;
 font-size: 1em; 
}

#allTrainingRecords thead td:first-child, 
#trainings thead td:first-child,
#users thead td:first-child,
#trainingResults thead td:first-child,
#questionGroups thead td:first-child,
#userGroups thead td:first-child 
{
 border-left: 10px solid #f50;
}

#allTrainingRecords thead td, 
#trainings thead td, 
#users thead td, 
#trainingResults thead td, 
#questionGroups thead td, 
#userGroups thead td 
{
 font-weight: bold;
 padding-top: 10px;
}

#allTrainingRecords td, 
#trainings td,
#users td,
#trainingResults td,
#questionGroups td,
#userGroups td 
{
 font-size: 1.15em;
 vertical-align: top;
 margin-top: 5px;
 border-bottom: 1px solid #ddd;
 border-right: 1px solid #ddd;
 padding: 5px 5px 5px 5px;
}

#allTrainingRecords td.lastCell, 
#trainings td.lastCell,
#users td.lastCell,
#trainingResults td.lastCell,
#questionGroups td.lastCell,
#userGroups td.lastCell 
{
 border-right: 0px;
}

#allTrainingRecords tbody td:first-child, 
#trainings tbody td:first-child, 
#users tbody td:first-child, 
#trainingResults tbody td:first-child, 
#questionGroups tbody td:first-child, 
#userGroups tbody td:first-child 
{
 border-left: 10px solid #fff;
}

#zoomView {
/* width: 100%;*/
 margin-top: 10px;
 display: none;
 border: 1px solid #ddd;
/* background-color: #ccc; */
}

#zoomTable {
 border-top: 1px solid #000;
 border-left: 1px solid #000;
 width: 100%;
 height: 100%;
}

#zoomTable tr td {
 border-right: 1px solid #000;
 border-bottom: 1px solid #000;
}

.zoomPreviewTable td {
 border: 0px !important;
}

/*#zoomViewContainer {
 border: 1px solid #555;
 background-color: #ccc;
 width: 100%;
 height: 100%;
}*/

#zoomView .closeBtn {
 border: 1px solid #555;
 background-color: #fff;
 font-size: 22px;
 padding: 4px;
}

/*#zoomPreviewsLeft, #zoomPreviewsRight {
 border: 1px solid #000;
 width: 49.8%;
 float: left;
 overflow: auto;
 height: 155px;
}
*/
.zoomImgPreviewTitle {
 position: absolute;
 top: 5px;
 left: 6px;
 z-index: 1001;
 color: #f50;
 padding-right: 2px;
 padding-bottom: 2px;
}

.zoomText {
 width: 120px;
 height: 120px;
 border: 1px solid #000;
 margin-top: 2px;
 margin-left: 2px;
 padding: 2px;
}

#zoomViewContainer img {
 border: 1px solid #000;
 margin-top: 2px;
 margin-left: 2px;
}

#zoomedLeftText, #zoomedRightText {
 position: absolute;
 left: 10px;
 top: 10px;
 z-index: 1000;
 font-size: 2em;
 color: #f50;
}

#zoomedRightBottomText {
 position: absolute;
 right: 10px;
 bottom: 0px;
 z-index: 1000;
 font-size: 2em;
 color: #f50;
}

#zoomViewContainer .chosenImg {
 border: 2px solid #f50;
}

img.link {
 border: 1px dashed #00d;
}

img.link:hover {
 cursor: pointer;
 border: 1px dashed #f50;
}

#usernameNotifier, #passNotifier {
 padding-left: 5px;
 font-size: 0.8em;
}

.warning {
 color: #d33;
}

tr.warning {
 background-color: #fee;
 color: #000;
}

.allowed {
 color: #0a0;
}

.formTable {
 margin-top: 5px;
}

.formTable td {
 vertical-align: top;
}

#errors, .errors {
 background-color: #ffd;
 border-left: 10px solid #f00;
 border-right: 1px solid #f00;
 border-top: 1px solid #f00;
 border-bottom: 1px solid #f00;
 padding: 5px 5px 5px 5px;
 margin-top: 10px;
}

#errors ul, .errors ul {
 margin: 0 0 0 0;
 padding: 0 0 0 15px;
 color: #a33;
}

#concurrentsContent {
 padding: 5px 5px 5px 5px;
}

#concurrentsContent ul {
 padding: 0 0 0 0;
 margin: 0 0 0 0;

 list-style: none;
}

#concurrentsContent li {
 list-style: none;
 font-size: smaller;
 padding-bottom: 5px;
 padding-top: 5px;
}

#concurrentsContent .smallProgressBar {
 float:left;
 margin-right: 5px;
}

.small {
 font-size: smaller;
 margin: 5px 5px 3px 0;
}

#questionsContainer {
 overflow: hidden;
}

#questions {
 margin-left: 25px;
 margin-top: 5px;
}

#questions li {
// border: 1px solid #000;
 font-size: 2em;
 border-bottom: 1px solid #ddd;
 margin-bottom: 10px;
 padding: 3px 3px 3px 3px;
}

#questions li.unactive {
 background-color: #eee;
}

table.questions {
 border-spacing: 0 0;
 margin: 5px 5px 5px 0;
}

.questions td {
 width: 170px;
 empty-cells: show;
 text-align: center;
 vertical-align: top;
}

#questions .naq, 
#questions .caq, 
#questions .gaq, 
#questions .waq {
 padding: 4px 0 0 0;
 margin: 0 0 0 0;
}

.questionControls {
 font-size: 0.5em;
 padding: 0 0 5px 10px;
}

.popupPreview {
 position: absolute;
 text-align: left;
 z-order: 1000;
}

.flLeft {
 float: left;
}

.questionPopup {
 background-color: #fff;
 border: 1px solid #ddd;
 padding: 5px 5px 0 5px;
}

.notify {
 border: 1px solid #ddd;
 background-color: #ffd;
 padding: 5px 5px 5px 5px;
 margin: 10px 10px 10px 10px;
 color: #000;
 font-size: 0.5em;
}

.dnone {
 display: none;
}

.dinline {
 display: inline;
}

a.btn {
 border: 1px solid #ddd;
 text-decoration: none;
 padding: 1px 3px 1px 3px;
}

a.btn:hover {
 text-decoration: none;
 background-color: #f6f6f6;
}

.mrg_top {
 margin-top: 10px;
}

.dblmrg_top {
 margin-top: 20px;
}

.mrg {
 margin: 10px 10px 10px 10px;
}

#editor, .editor {
 position: fixed;
 left: 0px;
 top: 0px;
 width: 100%;
 padding-top: 150px;
}

.border {
 padding: 5px 5px 5px 5px;
 border-top: 3px solid #ccc;
 border-bottom: 3px solid #ccc;
 border-right: 3px solid #ccc;
 border-left: 10px solid #f50;
 background-color: #fff;
}

.align-left {
 text-align: left;
}

.boxIndicator {
 position: relative;
 border-left: 10px solid #f50;
 margin-left: -5px;
 margin-top: -5px;
 margin-bottom: -5px;
 margin-right: 5px;
 height: 50px; 
 left: 0px;
 top: 0px;
 float: left;
}

ol.question_groups {
 margin: 0 0 0 25px;
 padding: 0 0 0 0;
 font-size: 0.7em;
}

ol.question_groups li {
 border-bottom: 1px solid #ddd;
}

ol.question_groups .small{
 font-size: 0.6em;
}

.question_groups_turn {
 float: right;
 font-size: smaller;
}

.man:after {
 content: " *";
 color: #d00;
}

.lalign {
 text-align: left;
}

.tvalign {
 vertical-align: top;
}

#dashboard td {
 border-left: 1px solid #ddd;
 padding: 0 3px 0 4px;
}

#dashboard td:first-child {
 border: 0;
}

#dashboard table td {
 border: 0;
 padding: 0 1px 0 2px;
}

#dashboard table td:first-child {
 padding-right: 6px;
}

#dashOnlineContent {
 position: absolute;
 right: 10px;
 top: 63px;
 width: 233px;
 border-left: 1px solid #007;
 border-right: 1px solid #007;
 border-bottom: 1px solid #007;
}

.very_small {
 color: #666;
 font-size: 12px;
 margin: 0;
}

.sliderBody {
 border: 1px solid #666;
 padding: 0;
 background-color: #eee;
 cursor: text;
}

.sliderCursor {
 width: 3px;
 height: 18px;
 border: 1px solid #666;
 cursor: pointer;
 position: relative;
 background-color: #aaa;
}

.sliderLeft {
 cursor: pointer;
 padding: 1px;
}

.sliderRight {
 cursor: pointer;
 padding: 1px;
}

#trainingLogStats {
 display: none;
 margin-top: 20px;
 border-top: 1px solid #666;
 border-left: 1px solid #666;
}

#trainingLogStats td {
 border-right: 1px solid #666;
 border-bottom: 1px solid #666;
 padding: 2px;
}