div 
{ margin: 0 2px 2px 0px; 
  font-family: helvetica, arial;
  overflow-wrap: break-word;
  overflow-x: hidden;
}

p, th, td, li
{ font-size:15pt; }

input.goButton {
    background-color: red;
    color: white;
    padding: 5px 5px;
    text-align: center;
    text-decoration: none;
    display: inline-block;
    font-size: 15px;
}

.flex-container
{ display: -webkit-flex;
  display: flex;
}

.endMessage
{ overflow-y: hidden;
  display: none;
}

div#narrow
{ font-size:2pt;}

div#left-header
{ float:left;
  border:1px solid black;
}

div#right-header
{ width:100%;
  float:right;
  border:1px solid black;
}

div#title 
{ font-size:xx-large;
  font-weight:bold; }

div#controls
{ font-size:large;
  font-weight: bold;
}

div#heading-text
{   width:95%;
    float:left;}

header
{ background-color: black;
  color: white;
  font-family: helvetica, arial;
}

object#mapExperiment
{ width:100%;
  min-height:100%;
}

div#introduction, div#testIntroduction, div#questionnaire, div#instructions1, div#instructions2, div#instructions3, div#taskTimeout, div#taskCorrect, div#taskDone, div#routeTracingIncorrect, div#journeyPlanningIncorrect, div#endRouteTracingTraining, div#endRouteTracing, div#endJourneyPlanningTraining, div#endJourneyPlanning, div#endRegionPlanning, div#endRun, div#showData, div#generalReject, div#generalError  
{  margin: 0px 10%; }

html, body, div#flex-container, div#main-panel 
{  margin: 0;
   padding: 0;
   min-width: 100%;
   width: 100%;
   max-width: 100%;
}
    
html
{  min-height: 100%%;
   height: 100%;
   max-height: 100%;
}

body, div#flex-container, div#mainPanel
{  min-height: 100%;
   height: 100%;
   max-height: 100%;
}

div#mapExperimentContainer
{  min-height: 100%;
   height: 100%;
   max-height: 100%;
    border: 0px;
    padding: 0px;
    margin: 0px;
  }

div.warning
{ color:red; }