#CHRONODATING-APPLICATION { margin: 0px; padding: 0px; }
#CHRONODATING-COMMANDS { padding: 5px 10px; }
#CHRONODATING-COMMANDS ul { margin: 40px; background-color: rgba(0, 0, 0, .5); padding: 20px;  }
#CHRONODATING-COMMANDS ul li { list-style-type: none; padding-top: 10px; }
#CHRONODATING-COMMANDS ul li a { font-size: 125%; color: #fff; }

#gridViewport ul { list-style-type: none; margin: 0 auto; padding: 0; }
#gridViewport img { vertical-align: middle; }

#gridViewport .participantsGrid .group { float: left; border-bottom: 5px solid #fff; margin-right: -5px; border-right: 5px solid #fff; }
#gridViewport .participantsGrid .assignment { line-height: 150%; margin: 5px; padding: 5px 10px; }
#gridViewport .participantsGrid .assignment.odd { background: #e0e0e0; }
#gridViewport .participantsGrid .assignment .participant { font-weight: 600; float: left; }
#gridViewport .participantsGrid .assignment .separator { float: right; padding: 0 0 0 10px; }
#gridViewport .participantsGrid .assignment .area { font-weight: 200; float: right; }

#gridViewport .participantsView .group { margin-bottom: 20px; }
#gridViewport .participantsView .assignment { line-height: 150%; margin: 0 auto; width: 95%; padding: 5px 10px; }
#gridViewport .participantsView .assignment.odd { background: #e0e0e0; }
#gridViewport .participantsView .assignment .participant { font-weight: 600; float: left; }
#gridViewport .participantsView .assignment .separator { float: right; padding: 0 0 0 10px; }
#gridViewport .participantsView .assignment .separator img { background-color: #fff; }
#gridViewport .participantsView .assignment .area { font-weight: 200; float: right; }
#gridViewport .participantsView .assignment:hover { font-size: 200%; }

#gridViewport .areasView .group { height: 50px; }
#gridViewport .areasView .area { margin: 0 auto; width: 95%; }
#gridViewport .areasView .area .areaTitle { border-bottom: 3px solid #000; clear: both; }
#gridViewport .areasView .area:hover { font-weight: bold; }
#gridViewport .areasView .area .areaAssignments { float: right; width: 60%; line-height: 150%; }
#gridViewport .areasView .area .areaDescription { float: left; width: 30%; }
#gridViewport .areasView .area .areaDescription img { max-width: 100%; }
#gridViewport .areasView .area .assignment.odd { background: #e0e0e0; }
#gridViewport .areasView .area .assignment .participant { padding: 0 10px; }