body {
  margin: 0px;
  padding: 0px;
  font-family: Helvetica, sans-serif;
  overflow: hidden;
  background-color: #ffc993;
}
#appWrapper {
  position: absolute;
  top: 0px;
  left: 0px;
  right: 0px;
  bottom: 0px;
  margin: 0px;
  padding: 0px;
  overflow: hidden;
  background-image: url(../img/uiGraphics/viewBkg.jpg);
  background-size: 100% 100%;
}
.view {
  position: absolute;
  top: 0px;
  right: 0px;
  bottom: 0px;
  left: 0px;
  margin: 0px;
  padding: 0px;
  -webkit-transition: -webkit-transform 500ms ease-out, opacity 500ms ease-out;
  -moz-transition: -moz-transform 500ms ease-out, opacity 500ms ease-out;
  -o-transition: -o-transform 500ms ease-out, opacity 500ms ease-out;
  -ms-transition: -ms-transform 500ms ease-out, opacity 500ms ease-out;
  transition: transform 500ms ease-out, opacity 500ms ease-out;
}
@font-face {
  font-family: HeaderFont;
  src: url('../fonts/LANENAR_.ttf');
}
* {
  -webkit-tap-highlight-color: rgba(0,0,0,0);
}
li .content {
  pointer-events: none;
}
li .controls {
  pointer-events: auto;
}
#appWrapper[activeView=loginView] #loginView {
  -webkit-transform: translate3D(0%,0px,0px);
  -moz-transform: translate3D(0%,0px,0px);
  -o-transform: translate3D(0%,0px,0px);
  -ms-transform: translate3D(0%,0px,0px);
  transform: translate3D(0%,0px,0px);
  opacity: 1;
}
#appWrapper[activeView=loginView] #homeView {
  -webkit-transform: translate3D(100%,0px,0px);
  -moz-transform: translate3D(100%,0px,0px);
  -o-transform: translate3D(100%,0px,0px);
  -ms-transform: translate3D(100%,0px,0px);
  transform: translate3D(100%,0px,0px);
  opacity: 1;
}
#appWrapper[activeView=loginView] #workView {
  -webkit-transform: translate3D(200%,0px,0px);
  -moz-transform: translate3D(200%,0px,0px);
  -o-transform: translate3D(200%,0px,0px);
  -ms-transform: translate3D(200%,0px,0px);
  transform: translate3D(200%,0px,0px);
  opacity: 1;
}
#appWrapper[activeView=homeView] #loginView {
  -webkit-transform: translate3D(-100%,0px,0px);
  -moz-transform: translate3D(-100%,0px,0px);
  -o-transform: translate3D(-100%,0px,0px);
  -ms-transform: translate3D(-100%,0px,0px);
  transform: translate3D(-100%,0px,0px);
  opacity: 1;
}
#appWrapper[activeView=homeView] #homeView {
  -webkit-transform: translate3D(0%,0px,0px);
  -moz-transform: translate3D(0%,0px,0px);
  -o-transform: translate3D(0%,0px,0px);
  -ms-transform: translate3D(0%,0px,0px);
  transform: translate3D(0%,0px,0px);
  opacity: 1;
}
#appWrapper[activeView=homeView] #workView {
  -webkit-transform: translate3D(100%,0px,0px);
  -moz-transform: translate3D(100%,0px,0px);
  -o-transform: translate3D(100%,0px,0px);
  -ms-transform: translate3D(100%,0px,0px);
  transform: translate3D(100%,0px,0px);
  opacity: 1;
}
#appWrapper[activeView=workView] #loginView {
  -webkit-transform: translate3D(-200%,0px,0px);
  -moz-transform: translate3D(-200%,0px,0px);
  -o-transform: translate3D(-200%,0px,0px);
  -ms-transform: translate3D(-200%,0px,0px);
  transform: translate3D(-200%,0px,0px);
  opacity: 1;
}
#appWrapper[activeView=workView] #homeView {
  -webkit-transform: translate3D(-100%,0px,0px);
  -moz-transform: translate3D(-100%,0px,0px);
  -o-transform: translate3D(-100%,0px,0px);
  -ms-transform: translate3D(-100%,0px,0px);
  transform: translate3D(-100%,0px,0px);
  opacity: 1;
}
#appWrapper[activeView=workView] #workView {
  -webkit-transform: translate3D(0%,0px,0px);
  -moz-transform: translate3D(0%,0px,0px);
  -o-transform: translate3D(0%,0px,0px);
  -ms-transform: translate3D(0%,0px,0px);
  transform: translate3D(0%,0px,0px);
  opacity: 1;
}
#appWrapper #workPanelWrapper {
  visibility: visible;
}
#appWrapper #workNavigation {
  visibility: visible;
}
#appWrapper #workBottomBar {
  visibility: visible;
}
#appWrapper #homePanelWrapper {
  visibility: visible;
}
#appWrapper #homeNavigation {
  visibility: visible;
}
#appWrapper #homeBottomBar {
  visibility: visible;
}
#appWrapper #loginCardWrapper {
  visibility: visible;
}
#appWrapper[activeView=loginView] #homeView {
  background: none;
}
#appWrapper[activeView=loginView] #workView {
  background: none;
}
#appWrapper[activeView=loginView] #workPanelWrapper {
  visibility: hidden !important;
}
#appWrapper[activeView=loginView] #workNavigation {
  visibility: hidden !important;
}
#appWrapper[activeView=loginView] #workBottomBar {
  visibility: hidden !important;
}
#appWrapper[activeView=loginView] #homePanelWrapper {
  visibility: hidden !important;
}
#appWrapper[activeView=loginView] #homeNavigation {
  visibility: hidden !important;
}
#appWrapper[activeView=loginView] #homeBottomBar {
  visibility: hidden !important;
}
#appWrapper[activeView=homeView] #loginView {
  background: none;
}
#appWrapper[activeView=homeView] #workView {
  background: none;
}
#appWrapper[activeView=homeView] #workPanelWrapper {
  visibility: hidden !important;
}
#appWrapper[activeView=homeView] #workNavigation {
  visibility: hidden !important;
}
#appWrapper[activeView=homeView] #workBottomBar {
  visibility: hidden !important;
}
#appWrapper[activeView=homeView] #loginCardWrapper {
  visibility: hidden !important;
}
#appWrapper[activeView=workView] #loginView {
  background: none;
}
#appWrapper[activeView=workView] #homeView {
  background: none;
}
#appWrapper[activeView=workView] #homePanelWrapper {
  visibility: hidden !important;
}
#appWrapper[activeView=workView] #homeNavigation {
  visibility: hidden !important;
}
#appWrapper[activeView=workView] #homeBottomBar {
  visibility: hidden !important;
}
#appWrapper[activeView=workView] #loginCardWrapper {
  visibility: hidden !important;
}
.panel[activeWidget=one] 			.listWrapper[listID='one'] {
  -webkit-transform: translate3D(0%,0px,0px);
  -moz-transform: translate3D(0%,0px,0px);
  -o-transform: translate3D(0%,0px,0px);
  -ms-transform: translate3D(0%,0px,0px);
  transform: translate3D(0%,0px,0px);
  opacity: 1;
}
.panel[activeWidget=one] 			.listWrapper[listID='two'] {
  -webkit-transform: translate3D(100%,0px,0px);
  -moz-transform: translate3D(100%,0px,0px);
  -o-transform: translate3D(100%,0px,0px);
  -ms-transform: translate3D(100%,0px,0px);
  transform: translate3D(100%,0px,0px);
  opacity: 1;
  pointer-events: none;
}
.panel[activeWidget=one] 			.listWrapper[listID='three'] {
  -webkit-transform: translate3D(200%,0px,0px);
  -moz-transform: translate3D(200%,0px,0px);
  -o-transform: translate3D(200%,0px,0px);
  -ms-transform: translate3D(200%,0px,0px);
  transform: translate3D(200%,0px,0px);
  opacity: 1;
  pointer-events: none;
}
.panel[activeWidget=one] 			.datePicker {
  -webkit-transform: translate3D(200%,0px,0px);
  -moz-transform: translate3D(200%,0px,0px);
  -o-transform: translate3D(200%,0px,0px);
  -ms-transform: translate3D(200%,0px,0px);
  transform: translate3D(200%,0px,0px);
  opacity: 1;
  pointer-events: none;
}
.panel[activeWidget=one] 			.dataExplorer {
  -webkit-transform: translate3D(200%,0px,0px);
  -moz-transform: translate3D(200%,0px,0px);
  -o-transform: translate3D(200%,0px,0px);
  -ms-transform: translate3D(200%,0px,0px);
  transform: translate3D(200%,0px,0px);
  opacity: 1;
  pointer-events: none;
}
.panel[activeWidget=two] 			.listWrapper[listID='one'] {
  -webkit-transform: translate3D(-100%,0px,0px);
  -moz-transform: translate3D(-100%,0px,0px);
  -o-transform: translate3D(-100%,0px,0px);
  -ms-transform: translate3D(-100%,0px,0px);
  transform: translate3D(-100%,0px,0px);
  opacity: 1;
  pointer-events: none;
}
.panel[activeWidget=two] 			.listWrapper[listID='two'] {
  -webkit-transform: translate3D(0%,0px,0px);
  -moz-transform: translate3D(0%,0px,0px);
  -o-transform: translate3D(0%,0px,0px);
  -ms-transform: translate3D(0%,0px,0px);
  transform: translate3D(0%,0px,0px);
  opacity: 1;
}
.panel[activeWidget=two] 			.listWrapper[listID='three'] {
  -webkit-transform: translate3D(100%,0px,0px);
  -moz-transform: translate3D(100%,0px,0px);
  -o-transform: translate3D(100%,0px,0px);
  -ms-transform: translate3D(100%,0px,0px);
  transform: translate3D(100%,0px,0px);
  opacity: 1;
  pointer-events: none;
}
.panel[activeWidget=two] 			.datePicker {
  -webkit-transform: translate3D(200%,0px,0px);
  -moz-transform: translate3D(200%,0px,0px);
  -o-transform: translate3D(200%,0px,0px);
  -ms-transform: translate3D(200%,0px,0px);
  transform: translate3D(200%,0px,0px);
  opacity: 1;
  pointer-events: none;
}
.panel[activeWidget=two] 			.dataExplorer {
  -webkit-transform: translate3D(200%,0px,0px);
  -moz-transform: translate3D(200%,0px,0px);
  -o-transform: translate3D(200%,0px,0px);
  -ms-transform: translate3D(200%,0px,0px);
  transform: translate3D(200%,0px,0px);
  opacity: 1;
  pointer-events: none;
}
.panel[activeWidget=three] 			.listWrapper[listID='one'] {
  -webkit-transform: translate3D(-200%,0px,0px);
  -moz-transform: translate3D(-200%,0px,0px);
  -o-transform: translate3D(-200%,0px,0px);
  -ms-transform: translate3D(-200%,0px,0px);
  transform: translate3D(-200%,0px,0px);
  opacity: 1;
  pointer-events: none;
}
.panel[activeWidget=three] 			.listWrapper[listID='two'] {
  -webkit-transform: translate3D(-100%,0px,0px);
  -moz-transform: translate3D(-100%,0px,0px);
  -o-transform: translate3D(-100%,0px,0px);
  -ms-transform: translate3D(-100%,0px,0px);
  transform: translate3D(-100%,0px,0px);
  opacity: 1;
  pointer-events: none;
}
.panel[activeWidget=three] 			.listWrapper[listID='three'] {
  -webkit-transform: translate3D(0%,0px,0px);
  -moz-transform: translate3D(0%,0px,0px);
  -o-transform: translate3D(0%,0px,0px);
  -ms-transform: translate3D(0%,0px,0px);
  transform: translate3D(0%,0px,0px);
  opacity: 1;
}
.panel[activeWidget=three] 			.datePicker {
  -webkit-transform: translate3D(200%,0px,0px);
  -moz-transform: translate3D(200%,0px,0px);
  -o-transform: translate3D(200%,0px,0px);
  -ms-transform: translate3D(200%,0px,0px);
  transform: translate3D(200%,0px,0px);
  opacity: 1;
  pointer-events: none;
}
.panel[activeWidget=three] 			.dataExplorer {
  -webkit-transform: translate3D(200%,0px,0px);
  -moz-transform: translate3D(200%,0px,0px);
  -o-transform: translate3D(200%,0px,0px);
  -ms-transform: translate3D(200%,0px,0px);
  transform: translate3D(200%,0px,0px);
  opacity: 1;
  pointer-events: none;
}
.panel[activeWidget=datePicker] 	.listWrapper[listID='one'] {
  -webkit-transform: translate3D(-200%,0px,0px);
  -moz-transform: translate3D(-200%,0px,0px);
  -o-transform: translate3D(-200%,0px,0px);
  -ms-transform: translate3D(-200%,0px,0px);
  transform: translate3D(-200%,0px,0px);
  opacity: 1;
  pointer-events: none;
}
.panel[activeWidget=datePicker] 	.listWrapper[listID='two'] {
  -webkit-transform: translate3D(-200%,0px,0px);
  -moz-transform: translate3D(-200%,0px,0px);
  -o-transform: translate3D(-200%,0px,0px);
  -ms-transform: translate3D(-200%,0px,0px);
  transform: translate3D(-200%,0px,0px);
  opacity: 1;
  pointer-events: none;
}
.panel[activeWidget=datePicker] 	.listWrapper[listID='three'] {
  -webkit-transform: translate3D(-200%,0px,0px);
  -moz-transform: translate3D(-200%,0px,0px);
  -o-transform: translate3D(-200%,0px,0px);
  -ms-transform: translate3D(-200%,0px,0px);
  transform: translate3D(-200%,0px,0px);
  opacity: 1;
  pointer-events: none;
}
.panel[activeWidget=datePicker] 	.datePicker {
  -webkit-transform: translate3D(0%,0px,0px);
  -moz-transform: translate3D(0%,0px,0px);
  -o-transform: translate3D(0%,0px,0px);
  -ms-transform: translate3D(0%,0px,0px);
  transform: translate3D(0%,0px,0px);
  opacity: 1;
}
.panel[activeWidget=datePicker] 	.dataExplorer {
  -webkit-transform: translate3D(200%,0px,0px);
  -moz-transform: translate3D(200%,0px,0px);
  -o-transform: translate3D(200%,0px,0px);
  -ms-transform: translate3D(200%,0px,0px);
  transform: translate3D(200%,0px,0px);
  opacity: 1;
  pointer-events: none;
}
.panel[activeWidget=dataExplorer] 	.listWrapper[listID='one'] {
  -webkit-transform: translate3D(-200%,0px,0px);
  -moz-transform: translate3D(-200%,0px,0px);
  -o-transform: translate3D(-200%,0px,0px);
  -ms-transform: translate3D(-200%,0px,0px);
  transform: translate3D(-200%,0px,0px);
  opacity: 1;
  pointer-events: none;
}
.panel[activeWidget=dataExplorer] 	.listWrapper[listID='two'] {
  -webkit-transform: translate3D(-200%,0px,0px);
  -moz-transform: translate3D(-200%,0px,0px);
  -o-transform: translate3D(-200%,0px,0px);
  -ms-transform: translate3D(-200%,0px,0px);
  transform: translate3D(-200%,0px,0px);
  opacity: 1;
  pointer-events: none;
}
.panel[activeWidget=dataExplorer] 	.listWrapper[listID='three'] {
  -webkit-transform: translate3D(-200%,0px,0px);
  -moz-transform: translate3D(-200%,0px,0px);
  -o-transform: translate3D(-200%,0px,0px);
  -ms-transform: translate3D(-200%,0px,0px);
  transform: translate3D(-200%,0px,0px);
  opacity: 1;
  pointer-events: none;
}
.panel[activeWidget=dataExplorer] 	.datePicker {
  -webkit-transform: translate3D(200%,0px,0px);
  -moz-transform: translate3D(200%,0px,0px);
  -o-transform: translate3D(200%,0px,0px);
  -ms-transform: translate3D(200%,0px,0px);
  transform: translate3D(200%,0px,0px);
  opacity: 1;
  pointer-events: none;
}
.panel[activeWidget=dataExplorer] 	.dataExplorer {
  -webkit-transform: translate3D(0%,0px,0px);
  -moz-transform: translate3D(0%,0px,0px);
  -o-transform: translate3D(0%,0px,0px);
  -ms-transform: translate3D(0%,0px,0px);
  transform: translate3D(0%,0px,0px);
  opacity: 1;
}
.panel						.listWrapper[listID='one']   > ul {
  visibility: hidden;
}
.panel						.listWrapper[listID='two']   > ul {
  visibility: hidden;
}
.panel						.listWrapper[listID='three'] > ul {
  visibility: hidden;
}
.panel[activeWidget=one]   	.listWrapper[listID='one']   > ul {
  visibility: visible;
}
.panel[activeWidget=two]   	.listWrapper[listID='two']   > ul {
  visibility: visible;
}
.panel[activeWidget=three] 	.listWrapper[listID='three'] > ul {
  visibility: visible;
}
#appWrapper[activeView=homeView] #workView .listWrapper {
  visibility: hidden !important;
}
#appWrapper[activeView=homeView] #workView .content {
  visibility: hidden !important;
}
#appWrapper[activeView=homeView] #workView .listWrapper ul {
  visibility: hidden !important;
}
#appWrapper[activeView=workView] #homeView .listWrapper {
  visibility: hidden !important;
}
#appWrapper[activeView=workView] #homeView .content {
  visibility: hidden !important;
}
#appWrapper[activeView=workView] #homeView .listWrapper ul {
  visibility: hidden !important;
}
#appWrapper[activeView=loginView] #workView .listWrapper {
  visibility: hidden !important;
}
#appWrapper[activeView=loginView] #workView .content {
  visibility: hidden !important;
}
#appWrapper[activeView=loginView] #workView .listWrapper ul {
  visibility: hidden !important;
}
#appWrapper[activeView=loginView] #homeView .listWrapper {
  visibility: hidden !important;
}
#appWrapper[activeView=loginView] #homeView .content {
  visibility: hidden !important;
}
#appWrapper[activeView=loginView] #homeView .listWrapper ul {
  visibility: hidden !important;
}
.panel[activeWidget=datePicker] .toolbar .toolbarCenterContainer {
  display: none !important;
}
.panel[activeWidget=datePicker] .toolbar .toolbarLeftContainer {
  display: none !important;
}
.panel[activeWidget=datePicker] .toolbar .toolbarRightContainer {
  display: none !important;
}
.panel[activeWidget=datePicker] .header {
  display: none !important;
}
.panel[activeWidget=datePicker] .listHeader {
  display: none !important;
}
.panel[activeWidget=dataExplorer] .toolbar .toolbarCenterContainer {
  display: none !important;
}
.panel[activeWidget=dataExplorer] .toolbar .toolbarLeftContainer {
  display: none !important;
}
.panel[activeWidget=dataExplorer] .toolbar .toolbarRightContainer {
  display: none !important;
}
.panel[activeWidget=dataExplorer] .header {
  display: none !important;
}
.panel[activeWidget=dataExplorer] .listHeader {
  display: none !important;
}
#appWrapper 		#sidePanel {
  -webkit-transform: translate3D(200%,0px,0px) scale3d(1.0,1.0,1.0);
  -moz-transform: translate3D(200%,0px,0px) scale3d(1.0,1.0,1.0);
  -o-transform: translate3D(200%,0px,0px) scale3d(1.0,1.0,1.0);
  -ms-transform: translate3D(200%,0px,0px) scale3d(1.0,1.0,1.0);
  transform: translate3D(200%,0px,0px) scale3d(1.0,1.0,1.0);
  opacity: 1;
}
#appWrapper 		#modalForm {
  -webkit-transform: translate3D(0%,-200%,0px) scale3d(0.2,0.2,0.2);
  -moz-transform: translate3D(0%,-200%,0px) scale3d(0.2,0.2,0.2);
  -o-transform: translate3D(0%,-200%,0px) scale3d(0.2,0.2,0.2);
  -ms-transform: translate3D(0%,-200%,0px) scale3d(0.2,0.2,0.2);
  transform: translate3D(0%,-200%,0px) scale3d(0.2,0.2,0.2);
  opacity: 1;
}
#appWrapper 		#modalFrame {
  -webkit-transform: translate3D(0px,-200%,0px) scale3d(0.2,0.2,0.2);
  -moz-transform: translate3D(0px,-200%,0px) scale3d(0.2,0.2,0.2);
  -o-transform: translate3D(0px,-200%,0px) scale3d(0.2,0.2,0.2);
  -ms-transform: translate3D(0px,-200%,0px) scale3d(0.2,0.2,0.2);
  transform: translate3D(0px,-200%,0px) scale3d(0.2,0.2,0.2);
  opacity: 1;
}
#appWrapper 		#tempAlert {
  -webkit-transform: translate3D(500%,0px,0px) scale3d(1.0,1.0,1.0);
  -moz-transform: translate3D(500%,0px,0px) scale3d(1.0,1.0,1.0);
  -o-transform: translate3D(500%,0px,0px) scale3d(1.0,1.0,1.0);
  -ms-transform: translate3D(500%,0px,0px) scale3d(1.0,1.0,1.0);
  transform: translate3D(500%,0px,0px) scale3d(1.0,1.0,1.0);
  opacity: 0;
}
#appWrapper 		#permAlert {
  -webkit-transform: translate3D(200%,0px,0px) scale3d(0.2,0.2,0.2);
  -moz-transform: translate3D(200%,0px,0px) scale3d(0.2,0.2,0.2);
  -o-transform: translate3D(200%,0px,0px) scale3d(0.2,0.2,0.2);
  -ms-transform: translate3D(200%,0px,0px) scale3d(0.2,0.2,0.2);
  transform: translate3D(200%,0px,0px) scale3d(0.2,0.2,0.2);
  opacity: 1;
}
#appWrapper 		#modalAlert {
  -webkit-transform: translate3D(200%,0px,0px) scale3d(0.2,0.2,0.2);
  -moz-transform: translate3D(200%,0px,0px) scale3d(0.2,0.2,0.2);
  -o-transform: translate3D(200%,0px,0px) scale3d(0.2,0.2,0.2);
  -ms-transform: translate3D(200%,0px,0px) scale3d(0.2,0.2,0.2);
  transform: translate3D(200%,0px,0px) scale3d(0.2,0.2,0.2);
  opacity: 0;
}
#appWrapper 		#loadingMsg {
  -webkit-transform: translate3D(0%,0px,0px) scale3d(1.0,1.0,1.0);
  -moz-transform: translate3D(0%,0px,0px) scale3d(1.0,1.0,1.0);
  -o-transform: translate3D(0%,0px,0px) scale3d(1.0,1.0,1.0);
  -ms-transform: translate3D(0%,0px,0px) scale3d(1.0,1.0,1.0);
  transform: translate3D(0%,0px,0px) scale3d(1.0,1.0,1.0);
  opacity: 1;
}
#appWrapper[activeModal=sidePanel] 	#sidePanel {
  -webkit-transform: translate3D(0%,0px,0px) scale3d(1.0,1.0,1.0);
  -moz-transform: translate3D(0%,0px,0px) scale3d(1.0,1.0,1.0);
  -o-transform: translate3D(0%,0px,0px) scale3d(1.0,1.0,1.0);
  -ms-transform: translate3D(0%,0px,0px) scale3d(1.0,1.0,1.0);
  transform: translate3D(0%,0px,0px) scale3d(1.0,1.0,1.0);
  opacity: 1;
}
#appWrapper[activeModal=modalForm] 	#modalForm {
  -webkit-transform: translate3D(0%,0%,0px) scale3d(1.0,1.0,1.0);
  -moz-transform: translate3D(0%,0%,0px) scale3d(1.0,1.0,1.0);
  -o-transform: translate3D(0%,0%,0px) scale3d(1.0,1.0,1.0);
  -ms-transform: translate3D(0%,0%,0px) scale3d(1.0,1.0,1.0);
  transform: translate3D(0%,0%,0px) scale3d(1.0,1.0,1.0);
  opacity: 1;
}
#appWrapper[activeModal=modalFrame] #modalFrame {
  -webkit-transform: translate3D(0%,0px,0px) scale3d(1.0,1.0,1.0);
  -moz-transform: translate3D(0%,0px,0px) scale3d(1.0,1.0,1.0);
  -o-transform: translate3D(0%,0px,0px) scale3d(1.0,1.0,1.0);
  -ms-transform: translate3D(0%,0px,0px) scale3d(1.0,1.0,1.0);
  transform: translate3D(0%,0px,0px) scale3d(1.0,1.0,1.0);
  opacity: 1;
}
#appWrapper[activeModal=tempAlert] 	#tempAlert {
  -webkit-transform: translate3D(0%,0px,0px) scale3d(1.0,1.0,1.0);
  -moz-transform: translate3D(0%,0px,0px) scale3d(1.0,1.0,1.0);
  -o-transform: translate3D(0%,0px,0px) scale3d(1.0,1.0,1.0);
  -ms-transform: translate3D(0%,0px,0px) scale3d(1.0,1.0,1.0);
  transform: translate3D(0%,0px,0px) scale3d(1.0,1.0,1.0);
  opacity: 1;
}
#appWrapper[activeModal=permAlert] 	#permAlert {
  -webkit-transform: translate3D(0%,0px,0px) scale3d(1.0,1.0,1.0);
  -moz-transform: translate3D(0%,0px,0px) scale3d(1.0,1.0,1.0);
  -o-transform: translate3D(0%,0px,0px) scale3d(1.0,1.0,1.0);
  -ms-transform: translate3D(0%,0px,0px) scale3d(1.0,1.0,1.0);
  transform: translate3D(0%,0px,0px) scale3d(1.0,1.0,1.0);
  opacity: 1;
}
#appWrapper[showPermAlert=yes] {
  top: 20px !important;
}
#appWrapper[activeModal=modalAlert] #modalAlert {
  -webkit-transform: translate3D(0%,0px,0px) scale3d(1.0,1.0,1.0);
  -moz-transform: translate3D(0%,0px,0px) scale3d(1.0,1.0,1.0);
  -o-transform: translate3D(0%,0px,0px) scale3d(1.0,1.0,1.0);
  -ms-transform: translate3D(0%,0px,0px) scale3d(1.0,1.0,1.0);
  transform: translate3D(0%,0px,0px) scale3d(1.0,1.0,1.0);
  opacity: 1;
}
#appWrapper[activeModal=loadingMsg] #loadingMsg {
  -webkit-transform: translate3D(0%,0px,0px) scale3d(1.0,1.0,1.0);
  -moz-transform: translate3D(0%,0px,0px) scale3d(1.0,1.0,1.0);
  -o-transform: translate3D(0%,0px,0px) scale3d(1.0,1.0,1.0);
  -ms-transform: translate3D(0%,0px,0px) scale3d(1.0,1.0,1.0);
  transform: translate3D(0%,0px,0px) scale3d(1.0,1.0,1.0);
  opacity: 1;
}
#appWrapper[activeModal=modalFormAndSidePanel] 	#sidePanel {
  -webkit-transform: translate3D(0%,0px,0px) scale3d(1.0,1.0,1.0);
  -moz-transform: translate3D(0%,0px,0px) scale3d(1.0,1.0,1.0);
  -o-transform: translate3D(0%,0px,0px) scale3d(1.0,1.0,1.0);
  -ms-transform: translate3D(0%,0px,0px) scale3d(1.0,1.0,1.0);
  transform: translate3D(0%,0px,0px) scale3d(1.0,1.0,1.0);
  opacity: 1;
}
#appWrapper[activeModal=modalFormAndSidePanel] 	#modalForm {
  -webkit-transform: translate3D(0%,0%,0px) scale3d(1.0,1.0,1.0);
  -moz-transform: translate3D(0%,0%,0px) scale3d(1.0,1.0,1.0);
  -o-transform: translate3D(0%,0%,0px) scale3d(1.0,1.0,1.0);
  -ms-transform: translate3D(0%,0%,0px) scale3d(1.0,1.0,1.0);
  transform: translate3D(0%,0%,0px) scale3d(1.0,1.0,1.0);
  opacity: 1;
}
#networkAlert {
  display: none;
}
#networkAlert[state=active] {
  display: block;
  background-color: rgba(0,0,0,0.7);
  position: absolute;
  bottom: 0px;
  left: 0px;
  width: auto;
  margin: 0px;
  padding: 3px;
  text-align: center;
  font-size: 12px;
  color: white;
}
#networkAlert[state=active] img {
  margin-right: 4px;
  padding: 0px;
  vertical-align: middle;
}
#networkAlert[state=error] {
  display: block;
  background-color: #ff0000;
  position: absolute;
  bottom: 0px;
  left: 0px;
  right: 0px;
  margin: 0px;
  padding: 1px;
  text-align: center;
  font-size: 12px;
  color: white;
}
.panel > .emptyListMsg {
  display: none;
  position: absolute;
  width: 220px;
  left: 50%;
  margin-left: -110px;
  top: 180px;
  color: white;
  font-size: 14px;
  text-align: center;
  padding-top: 20px;
  padding-bottom: 20px;
  z-index: 1000;
}
.panel[empty=yes] > .emptyListMsg {
  display: block !important;
}
.panel[empty=yes] > .content > .listWrapper > .list > li {
  visibility: hidden !important;
}
.panel[empty=yes][mode=add] > .content > .listWrapper > .list > li {
  visibility: visible !important;
}
.panel[empty=yes][mode=add] > .emptyListMsg {
  display: none !important;
}
.panel > .emptyListMsg .loadingIndicator {
  vertical-align: middle;
  margin-right: 5px;
}
.toolbarCenterContainer {
  position: absolute;
  top: 40px;
  left: 0px;
  right: 0px;
  height: 30px;
  text-align: center;
}
.toolbarLeftContainer {
  position: absolute;
  top: 0px;
  bottom: 0px;
  left: 0px;
  text-align: left;
}
.toolbarRightContainer {
  position: absolute;
  top: 0px;
  bottom: 0px;
  right: 0px;
  text-align: left;
  border-right: solid 1px rgba(0,0,0,0.5);
  -webkit-box-shadow: inset -1px 0px 0px rgba(255,255,255,0.5);
  -moz-box-shadow: inset -1px 0px 0px rgba(255,255,255,0.5);
  box-shadow: inset -1px 0px 0px rgba(255,255,255,0.5);
}
.toolbarCenterContainer[state=hidden],
.toolbarLeftContainer[state=hidden] {
  display: none;
}
#workBottomBar .toolbarCenterContainer,
#homeBottomBar .toolbarCenterContainer {
  top: 0px;
}
.toolbarBtn {
  position: relative;
  display: inline-block;
  vertical-align: top;
  top: 0px;
  bottom: 0px;
  height: 40px;
  line-height: 40px;
  text-align: center;
  font-size: 14px;
  font-weight: light;
  cursor: hand;
  cursor: pointer;
  color: black;
  background-color: rgba(255,255,255,0.3) !important;
}
.toolbarLeftContainer .toolbarBtn {
  border-right: solid 1px rgba(255,255,255,0.5);
  -webkit-box-shadow: 1px 0px 0px rgba(0,0,0,0.5);
  -moz-box-shadow: 1px 0px 0px rgba(0,0,0,0.5);
  box-shadow: 1px 0px 0px rgba(0,0,0,0.5);
  padding-right: 1px;
}
.toolbarRightContainer .toolbarBtn {
  border-left: solid 1px rgba(0,0,0,0.5);
  -webkit-box-shadow: -1px 0px 0px rgba(255,255,255,0.5);
  -moz-box-shadow: -1px 0px 0px rgba(255,255,255,0.5);
  box-shadow: -1px 0px 0px rgba(255,255,255,0.5);
  padding-left: 1px;
}
.toolbarBtn:focus {
  background-color: #34a0ff !important;
}
.toolbarBtn:hover {
  background-color: rgba(255,255,255,0.5) !important;
}
.toolbarBtn[state=hidden] {
  display: none;
}
.toolbarBtn span {
  display: block;
  margin: 0px;
  padding: 0px;
  padding-left: 40px;
  padding-right: 15px;
  width: auto;
  pointer-events: none;
  color: black;
}
.toolbarBtn[btnType=plain] {
  padding-left: 20px;
  padding-right: 20px;
}
.toolbarBtn[btnType=post] {
  background: url('../img/uiGlyphs/noir_postBtn.png');
  background-repeat: no-repeat;
  background-size: 20px 20px;
  background-position: 11px center;
}
.toolbarBtn[btnType=add] {
  background: url('../img/uiGlyphs/noir_addBtn.png');
  background-repeat: no-repeat;
  background-size: 20px 20px;
  background-position: 11px center;
}
.toolbarBtn[btnType=edit] {
  background: url('../img/uiGlyphs/noir_editBtn.png');
  background-repeat: no-repeat;
  background-size: 20px 20px;
  background-position: 11px center;
}
.toolbarBtn[btnType=delete] {
  background: url('../img/uiGlyphs/noir_deleteBtn.png');
  background-repeat: no-repeat;
  background-size: 20px 20px;
  background-position: 11px center;
}
.toolbarBtn[btnType=refresh] {
  background: url('../img/uiGlyphs/noir_refreshBtn.png');
  background-repeat: no-repeat;
  background-size: 20px 20px;
  background-position: 11px center;
}
.toolbarBtn[btnType=print] {
  background: url('../img/uiGlyphs/noir_printBtn.png');
  background-repeat: no-repeat;
  background-size: 20px 20px;
  background-position: 11px center;
}
.toolbarBtn[btnType=window] {
  background: url('../img/uiGlyphs/noir_windowBtn.png');
  background-repeat: no-repeat;
  background-size: 20px 20px;
  background-position: 11px center;
}
.toolbarBtn[btnType=manage] {
  background: url('../img/uiGlyphs/noir_manageBtn.png');
  background-repeat: no-repeat;
  background-size: 20px 20px;
  background-position: 11px center;
}
.toolbarBtn[btnType=back] {
  background: url('../img/uiGlyphs/noir_backBtn.png');
  background-repeat: no-repeat;
  background-size: 20px 20px;
  background-position: 11px center;
}
.toolbarBtn[btnType=exitAdd] {
  background: url('../img/uiGlyphs/blanc_cancelBtn.png');
  background-repeat: no-repeat;
  background-size: 20px 20px;
  background-position: 11px center;
}
.toolbarBtn[btnType=exitDelete] {
  background: url('../img/uiGlyphs/blanc_cancelBtn.png');
  background-repeat: no-repeat;
  background-size: 20px 20px;
  background-position: 11px center;
}
.toolbarBtn[btnType=exitEdit] {
  background: url('../img/uiGlyphs/blanc_cancelBtn.png');
  background-repeat: no-repeat;
  background-size: 20px 20px;
  background-position: 11px center;
}
.toolbarBtn[btnType=confirmAdd] {
  background: url('../img/uiGlyphs/blanc_confirmBtn.png');
  background-repeat: no-repeat;
  background-size: 20px 20px;
  background-position: 11px center;
}
.toolbarBtn[btnType=cancelAdd] {
  background: url('../img/uiGlyphs/blanc_cancelBtn.png');
  background-repeat: no-repeat;
  background-size: 20px 20px;
  background-position: 11px center;
}
.toolbarBtn[btnType=confirmEdit] {
  background: url('../img/uiGlyphs/blanc_confirmBtn.png');
  background-repeat: no-repeat;
  background-size: 20px 20px;
  background-position: 11px center;
}
.toolbarBtn[btnType=cancelEdit] {
  background: url('../img/uiGlyphs/blanc_cancelBtn.png');
  background-repeat: no-repeat;
  background-size: 20px 20px;
  background-position: 11px center;
}
@media screen and (max-width: 600px) {
  .toolbarBtn span {
    display: none;
  }
  .toolbarBtn {
    min-width: 40px;
  }
  .toolbarBtn[btnType=post] {
    background-position: center center, center center !important;
  }
  .toolbarBtn[btnType=add] {
    background-position: center center, center center !important;
  }
  .toolbarBtn[btnType=edit] {
    background-position: center center, center center !important;
  }
  .toolbarBtn[btnType=delete] {
    background-position: center center, center center !important;
  }
  .toolbarBtn[btnType=refresh] {
    background-position: center center, center center !important;
  }
  .toolbarBtn[btnType=print] {
    background-position: center center, center center !important;
  }
  .toolbarBtn[btnType=manage] {
    background-position: center center, center center !important;
  }
  .toolbarBtn[btnType=back] {
    background-position: center center, center center !important;
  }
  .toolbarBtn[btnType=exitAdd] {
    background-position: center center, center center !important;
  }
  .toolbarBtn[btnType=exitDelete] {
    background-position: center center, center center !important;
  }
  .toolbarBtn[btnType=exitEdit] {
    background-position: center center, center center !important;
  }
  .toolbarBtn[btnType=confirmAdd] {
    background-position: center center, center center !important;
  }
  .toolbarBtn[btnType=cancelAdd] {
    background-position: center center, center center !important;
  }
}
.panel[activetoogles=two] > .header	> h1,
.panel[activetoogles=three] > .header > h1 {
  top: 10px !important;
}
#homeView .panel[activetoogles=two] > .header	> h2,
#homeView .panel[activetoogles=three] > .header > h2 {
  top: 50px !important;
}
.panel[activeWidget=one] 	.toolbarBtn[btnType=back] {
  display: none;
}
.panel[activetoogles=two] 	.toolbarBtn[btnType=back] {
  display: none;
}
.panel[activetoogles=three] .toolbarBtn[btnType=back] {
  display: none;
}
.panel[activeToogles=none] .toogleBtnGroup {
  display: none;
}
.panel[activeToogles=two]  .toogleBtn[toogleID=three] {
  display: none;
}
.toolbarBtn[btnType=menu] {
  width: 40px;
  background: url(../img/uiGlyphs/noir_menuBtn.png);
  background-repeat: no-repeat;
  background-size: 20px 20px;
  background-position: center center;
}
.toolbarBtn[btnType=expose] {
  display: none;
  width: 40px;
  background: url(../img/uiGlyphs/noir_exposeBtn.png);
  background-repeat: no-repeat;
  background-size: 20px 20px;
  background-position: center center;
  border-right: solid 1px rgba(0,0,0,0.5);
  border-left: solid 1px rgba(255,255,255,0.5);
  -webkit-box-shadow: inset -1px 0px 0px rgba(255,255,255,0.5), inset 1px 0px 0px rgba(0,0,0,0.5);
  -moz-box-shadow: inset -1px 0px 0px rgba(255,255,255,0.5), inset 1px 0px 0px rgba(0,0,0,0.5);
  box-shadow: inset -1px 0px 0px rgba(255,255,255,0.5), inset 1px 0px 0px rgba(0,0,0,0.5);
}
.toolbarBtn[btnType=expose][state=visible] {
  display: inline-block;
}
.toogleBtnGroup {
  display: inline-block;
  position: relative;
  top: 5px;
  width: auto;
  border: solid 1px white;
}
.toogleBtn {
  position: relative;
  top: 0px;
  bottom: 0px;
  display: inline-block;
  vertical-align: top;
  height: 23px;
  padding-top: 7px;
  padding-left: 5px;
  padding-right: 5px;
  text-align: center;
  font-size: 14px;
  cursor: hand;
  cursor: pointer;
  background-color: #ffd900;
  color: black;
}
.toogleBtn:nth-child(1) {
  border-right: solid 1px white;
}
.toogleBtn:nth-child(3) {
  border-left: solid 1px white;
}
.panel[activeWidget=one] 	.toogleBtn[toogleID=two] {
  background: none !important;
  color: white !important;
}
.panel[activeWidget=one] 	.toogleBtn[toogleID=three] {
  background: none !important;
  color: white !important;
}
.panel[activeWidget=two] 	.toogleBtn[toogleID=one] {
  background: none !important;
  color: white !important;
}
.panel[activeWidget=two] 	.toogleBtn[toogleID=three] {
  background: none !important;
  color: white !important;
}
.panel[activeWidget=three] 	.toogleBtn[toogleID=one] {
  background: none !important;
  color: white !important;
}
.panel[activeWidget=three] 	.toogleBtn[toogleID=two] {
  background: none !important;
  color: white !important;
}
.panel[mode=add] 	.toolbarBtn span {
  color: white;
}
.panel[mode=edit] 	.toolbarBtn span {
  color: white;
}
.panel[mode=delete] .toolbarBtn span {
  color: white;
}
.listWrapper {
  position: absolute;
  top: 80px;
  left: 0px;
  right: 0px;
  bottom: 0px;
  margin: 0px;
  padding: 0px;
  border-right: solid 1px rgba(0,0,0,0.3);
  -webkit-box-shadow: inset -1px 0px 0px rgba(255,255,255,0.1);
  -moz-box-shadow: inset -1px 0px 0px rgba(255,255,255,0.1);
  box-shadow: inset -1px 0px 0px rgba(255,255,255,0.1);
  -webkit-transition: -webkit-transform 500ms ease-out, opacity 500ms ease-out;
  -moz-transition: -moz-transform 500ms ease-out, opacity 500ms ease-out;
  -o-transition: -o-transform 500ms ease-out, opacity 500ms ease-out;
  -ms-transition: -ms-transform 500ms ease-out, opacity 500ms ease-out;
  transition: transform 500ms ease-out, opacity 500ms ease-out;
  -webkit-overflow-scrolling: touch;
  overflow-y: auto;
  overflow-x: hidden;
  z-index: 10;
}
.listWrapper > ul {
  margin: 0px;
  padding: 0px;
  position: relative;
  left: 0px;
  right: 0px;
  display: block;
  list-style: none;
  padding-bottom: 200px;
}
.listWrapper > ul > li {
  display: block;
  position: relative;
  left: 0px;
  right: 0px;
  height: auto;
  min-height: 50px;
  margin: 0px;
  padding: 0px;
  -webkit-box-shadow: 0px 1px 0px rgba(255,255,255,0.1);
  -moz-box-shadow: 0px 1px 0px rgba(255,255,255,0.1);
  box-shadow: 0px 1px 0px rgba(255,255,255,0.1);
  border-bottom: solid 1px rgba(0,0,0,0.3);
}
.listWrapper > ul > li > .content {
  position: relative;
  left: 0px;
  right: 0px;
  padding: 15px;
  padding-left: 30px;
  pointer-events: none;
  color: white;
  font-size: 16px;
}
.listWrapper > ul > li > .content .indicator {
  display: inline-block;
  width: auto;
  height: auto;
  margin: 2px;
  padding: 2px 5px 2px 5px;
  background-color: #fbff00;
  color: #493800;
  font-size: 12px;
  vertical-align: middle;
  -webkit-border-radius: 10px;
  -moz-border-radius: 10px;
  border-radius: 10px;
}
.listWrapper > ul > li > .content .indicator strong {
  font-weight: bold;
  color: black;
}
.listWrapper > ul > li > .controls {
  font-size: 16px;
  position: absolute;
  right: 5px;
  top: 50%;
  padding: 0px;
  margin: 0px;
  padding-right: 30px;
  height: 30px;
  width: auto;
  margin-top: -15px;
}
.listWrapper > ul > li[state=hidden] {
  display: none !important;
}
.formInputWrapper {
  display: inline-block;
  vertical-align: top;
  padding: 0px;
  margin: 0px;
  margin-right: 5px;
  pointer-events: auto;
}
.formInputWrapper .formLabel {
  color: white;
  font-size: 16px;
  font-weight: normal;
}
.formInputWrapper label {
  display: block;
  font-size: 12px;
  text-align: left;
  color: #fff;
  margin: 0px;
  padding: 0px;
}
.formInputWrapper input {
  width: 100px;
  margin: 0px;
  padding: 3px;
  font-size: 14px;
  border: 1px solid #000000;
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  border-radius: 3px;
  outline: none;
}
.formInputWrapper textarea {
  width: 100px;
  margin: 0px;
  padding: 3px;
  font-size: 14px;
  border: 1px solid #000000;
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  border-radius: 3px;
  outline: none;
  min-height: 26px;
}
#workView .formInputWrapper textarea.megatext {
  height: 300px;
}
#workView .formInputWrapper textarea {
  height: 26px;
}
input[type=checkbox] {
  visibility: hidden;
  height: 12px;
  width: 50px;
}
input[type=checkbox] + .checkbox {
  position: relative;
  display: block;
  width: 50px;
  height: 25px;
  -webkit-border-radius: 15px;
  -moz-border-radius: 15px;
  border-radius: 15px;
  background-color: #ff0049;
  pointer-events: auto;
  margin-top: -12px;
}
input[type=checkbox] + .checkbox:after {
  position: absolute;
  display: block;
  content: '';
  top: 0px;
  right: 0px;
  width: 24px;
  height: 24px;
  background: white;
  -webkit-border-radius: 15px;
  -moz-border-radius: 15px;
  border-radius: 15px;
  border: solid 1px #333;
}
input[type=checkbox]:checked + .checkbox {
  background-color: #027c26;
}
input[type=checkbox]:checked + .checkbox:after {
  left: 0px;
}
.checkboxLabel {
  width: 50px;
  text-align: center !important;
}
.dateChooserField {
  width: 110px;
}
#autoExpandHelper {
  display: block;
  position: relative;
  width: 100px;
  height: auto;
  margin: 0px;
  padding: 3px;
  font-size: 14px;
  border: 1px solid #000000;
  outline: none;
  word-wrap: break-word;
  visibility: hidden;
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  border-radius: 3px;
  -webkit-transform: translate3D(200%,0px,0px);
  -moz-transform: translate3D(200%,0px,0px);
  -o-transform: translate3D(200%,0px,0px);
  -ms-transform: translate3D(200%,0px,0px);
  transform: translate3D(200%,0px,0px);
}
input[customStyle=leftPairField] {
  -webkit-border-radius: 3px 0px 0px 3px;
  -moz-border-radius: 3px 0px 0px 3px;
  border-radius: 3px 0px 0px 3px;
}
input[customStyle=rightPairField] {
  margin-left: -5px;
  border-left: none;
  -webkit-border-radius: 0px 3px 3px 0px;
  -moz-border-radius: 0px 3px 3px 0px;
  border-radius: 0px 3px 3px 0px;
}
.panel[mode=delete] .itemDeleteBtn {
  display: inline-block !important;
}
.panel[mode=delete] li[grayed] .itemDeleteBtn {
  display: none !important;
}
.panel[mode=normal] .listWrapper[itemFlagMode] .itemFlagBtn {
  display: inline-block !important;
}
.panel[mode=normal] .listWrapper[itemManageMode] .itemManageBtn {
  display: inline-block !important;
}
.panel[mode=normal] .listWrapper[itemActionMode] .itemActionBtn {
  display: inline-block !important;
}
.panel[mode=normal] .listWrapper[itemPrintMode] .itemPrintBtn {
  display: inline-block !important;
}
.panel[mode=add] .toolbar {
  background: -webkit-linear-gradient(top left,#0c8300 0%,#053e00 100%) !important;
}
.panel[mode=edit] .toolbar {
  background: -webkit-linear-gradient(top left,#670086 0%,#24002f 100%) !important;
}
.panel[mode=delete] .toolbar {
  background: -webkit-linear-gradient(top left,#ff0005 0%,#be0004 100%) !important;
}
.itemDeleteBtn {
  display: none;
  width: auto;
  height: 24px;
  background-color: #ff003d;
  color: white;
  font-size: 14px;
  padding: 6px 20px 0px 20px;
  text-align: center;
}
.itemActionBtn {
  display: none;
  width: auto;
  height: 24px;
  background-color: #ffd900;
  color: black;
  font-size: 14px;
  padding: 6px 20px 0px 20px;
  text-align: center;
}
.itemPrintBtn {
  display: none;
  width: auto;
  height: 24px;
  background-color: #ffd900;
  color: black;
  font-size: 14px;
  padding: 6px 20px 0px 20px;
  text-align: center;
}
.itemFlagBtn {
  display: none;
  width: 30px;
  height: 30px;
  background: url(../img/uiGlyphs/inline_unselectedFlag.png);
  background-size: 30px 30px;
  background-repeat: no-repeat;
  background-position: center center;
}
.itemFlagBtn[flagged] {
  background: url(../img/uiGlyphs/inline_selectedFlag.png) !important;
  background-size: 30px 30px !important;
  background-repeat: no-repeat !important;
  background-position: center center !important;
}
.itemManageBtn {
  display: none;
  width: 30px;
  height: 30px;
  background: url(../img/uiGlyphs/blanc_settingsBtn.png);
  background-size: 30px 30px;
  background-repeat: no-repeat;
  background-position: center center;
}
#homeView .itemManageBtn {
  background: url(../img/uiGlyphs/noir_settingsBtn.png);
  background-size: 30px 30px;
  background-repeat: no-repeat;
  background-position: center center;
}
.list .dataColumn[size=index] {
  width: 20px;
}
.list .dataColumn[size=xsmall] {
  width: 30px;
}
.list .dataColumn[size=small] {
  width: 60px;
}
.list .dataColumn[size=medium] {
  width: 100px;
}
.list .dataColumn[size=large] {
  width: 160px;
}
.list .dataColumn[size=xlarge] {
  width: 300px;
}
.list .dataColumn[size=superlarge] {
  width: 380px;
}
.list .dataColumn[size=fullwidth] {
  width: 100%;
}
.list .dataColumn[size=small__plus_medium] {
  width: 152px;
}
.list .dataColumn[size=date] {
  width: 110px;
}
.list .column[size=index] {
  width: 20px;
}
.list .column[size=xsmall] {
  width: 30px;
}
.list .column[size=small] {
  width: 60px;
}
.list .column[size=medium] {
  width: 100px;
}
.list .column[size=large] {
  width: 160px;
}
.list .column[size=xlarge] {
  width: 300px;
}
.list .column[size=superlarge] {
  width: 380px;
}
.list .column[size=fullwidth] {
  width: 100%;
}
.list .column[size=small__plus_medium] {
  width: 152px;
}
.list .column[size=date] {
  width: 110px;
}
.list .formdata[size=index] {
  width: 20px;
}
.list .formdata[size=xsmall] {
  width: 30px;
}
.list .formdata[size=small] {
  width: 60px;
}
.list .formdata[size=medium] {
  width: 100px;
}
.list .formdata[size=large] {
  width: 160px;
}
.list .formdata[size=xlarge] {
  width: 300px;
}
.list .formdata[size=superlarge] {
  width: 380px;
}
.list .formdata[size=fullwidth] {
  width: 100%;
}
.list .formdata[size=small__plus_medium] {
  width: 152px;
}
.list .formdata[size=date] {
  width: 110px;
}
.listHeader .column[size=index] {
  width: 5px;
}
.listHeader .column[size=xsmall] {
  width: 27px;
}
.listHeader .column[size=small] {
  width: 57px;
}
.listHeader .column[size=medium] {
  width: 97px;
}
.listHeader .column[size=large] {
  width: 157px;
}
.listHeader .column[size=xlarge] {
  width: 297px;
}
.listHeader .column[size=superlarge] {
  width: 377px;
}
.listHeader .column[size=fullwidth] {
  width: 100%;
}
.listHeader .column[size=small__plus_medium] {
  width: 149px;
}
.listHeader .column[size=date] {
  width: 107px;
}
input[size=index] {
  width: 6px;
}
input[size=xsmall] {
  width: 16px;
}
input[size=small] {
  width: 46px;
}
input[size=medium] {
  width: 86px;
}
input[size=large] {
  width: 146px;
}
input[size=xlarge] {
  width: 286px;
}
input[size=superlarge] {
  width: 366px;
}
input[size=fullwidth] {
  width: 100%;
}
input[size=small__plus_medium] {
  width: 138px;
}
input[size=date] {
  width: 96px;
}
label[size=index] {
  width: 6px;
}
label[size=xsmall] {
  width: 16px;
}
label[size=small] {
  width: 46px;
}
label[size=medium] {
  width: 86px;
}
label[size=large] {
  width: 146px;
}
label[size=xlarge] {
  width: 286px;
}
label[size=superlarge] {
  width: 366px;
}
label[size=fullwidth] {
  width: 100%;
}
label[size=small__plus_medium] {
  width: 138px;
}
label[size=date] {
  width: 96px;
}
textarea[size=index] {
  width: 20px;
}
textarea[size=xsmall] {
  width: 30px;
}
textarea[size=small] {
  width: 60px;
}
textarea[size=medium] {
  width: 100px;
}
textarea[size=large] {
  width: 160px;
}
textarea[size=xlarge] {
  width: 300px;
}
textarea[size=superlarge] {
  width: 380px;
}
textarea[size=megalarge] {
  width: 380px;
  height: 380px;
}
textarea[size=fullwidth] {
  width: 100%;
}
textarea[size=small__plus_medium] {
  width: 152px;
}
textarea[size=date] {
  width: 110px;
}
.formLabel[size=index] {
  width: 20px;
}
.formLabel[size=xsmall] {
  width: 30px;
}
.formLabel[size=small] {
  width: 60px;
}
.formLabel[size=medium] {
  width: 100px;
}
.formLabel[size=large] {
  width: 160px;
}
.formLabel[size=xlarge] {
  width: 300px;
}
.formLabel[size=superlarge] {
  width: 380px;
}
.formLabel[size=fullwidth] {
  width: 100%;
}
.formLabel[size=small__plus_medium] {
  width: 152px;
}
.formLabel[size=date] {
  width: 110px;
}
.datasetChooser {
  position: relative;
  display: none;
  vertical-align: top;
  top: 0px;
  bottom: 0px;
  height: 40px;
  line-height: 40px;
  text-align: center;
  font-size: 14px;
  font-weight: light;
  cursor: hand;
  cursor: pointer;
  color: black;
  background-color: rgba(255,255,255,0.3) !important;
  width: 140px;
  border-right: solid 1px rgba(0,0,0,0.5);
  border-left: solid 1px rgba(255,255,255,0.5);
  -webkit-box-shadow: inset -1px 0px 0px rgba(255,255,255,0.5), inset 1px 0px 0px rgba(0,0,0,0.5);
  -moz-box-shadow: inset -1px 0px 0px rgba(255,255,255,0.5), inset 1px 0px 0px rgba(0,0,0,0.5);
  box-shadow: inset -1px 0px 0px rgba(255,255,255,0.5), inset 1px 0px 0px rgba(0,0,0,0.5);
}
.datasetChooser[state=visible] {
  display: inline-block;
}
.datasetChooser[state=hidden] {
  display: none;
}
.datasetChooserOptions {
  display: none;
  list-style: none;
  position: absolute;
  top: 50px;
  left: 0px;
  width: 140px;
  height: auto;
  min-height: 20px;
  max-height: 50vh;
  overflow: auto;
  background-color: white;
  color: black;
  margin: 0px;
  padding: 0px;
  z-index: 1000;
}
.datasetChooserOptions:after {
  content: '';
  position: absolute;
  top: -10px;
  left: 50%;
  margin-left: -10px;
  width: 0;
  height: 0;
  border-left: 10px solid transparent;
  border-right: 10px solid transparent;
  border-bottom: 10px solid white;
}
.datasetChooserOptions[state=visible] {
  display: block;
}
.datasetChooserOptions[state=hidden] {
  display: none;
}
.datasetChooserOptions li {
  display: block;
  position: relative;
  left: 0px;
  right: 0px;
  margin: 0px;
  padding: 13px 5px 13px 5px;
  font-size: 14px;
  color: #005fff;
  font-weight: normal;
  border-bottom: solid 1px #005fff;
  text-align: center;
}
.datasetChooserOptions li:hover {
  background-color: #cbf3ff;
}
#loginCard {
  background-color: #c1f6ff;
  background-image: url(../img/uiGraphics/grass.png), url(../img/uiGraphics/school_tree.png), url(../img/uiGraphics/field.png);
  background-size: auto 50px, 250px auto, 100% 100px;
  background-repeat: repeat-x, no-repeat, no-repeat;
  background-position: bottom left, 10px bottom, bottom left;
}
#loginCardWrapper {
  border-bottom: solid 1px rgba(0,0,0,0.5);
  -webkit-box-shadow: 0px 1px 0px rgba(255,255,255,0.5);
  -moz-box-shadow: 0px 1px 0px rgba(255,255,255,0.5);
  box-shadow: 0px 1px 0px rgba(255,255,255,0.5);
}
#loginCardWrapper:after {
  content: '';
  display: block;
  position: absolute;
  left: 0px;
  right: 0px;
  bottom: 0px;
  height: 5px;
  background: -webkit-linear-gradient(bottom, rgba(0,0,0,0.5) 0%, rgba(0,0,0,0) 100%);
  background: -moz-linear-gradient(bottom, rgba(0,0,0,0.5) 0%, rgba(0,0,0,0) 100%);
  background: -o-linear-gradient(bottom, rgba(0,0,0,0.5) 0%, rgba(0,0,0,0) 100%);
  background: -ms-linear-gradient(bottom, rgba(0,0,0,0.5) 0%, rgba(0,0,0,0) 100%);
  background: linear-gradient(bottom, rgba(0,0,0,0.5) 0%, rgba(0,0,0,0) 100%);
}
@media screen and (max-width: 600px) {
  #loginViewCardWrapper #loginFormWrapper {
    background-color: rgba(255,255,255,0.3);
    background: -webkit-linear-gradient(top, rgba(255,255,255,0.7) 80%, rgba(255,255,255,0) 100%);
    background: -moz-linear-gradient(top, rgba(255,255,255,0.7) 80%, rgba(255,255,255,0) 100%);
    background: -o-linear-gradient(top, rgba(255,255,255,0.7) 80%, rgba(255,255,255,0) 100%);
    background: -ms-linear-gradient(top, rgba(255,255,255,0.7) 80%, rgba(255,255,255,0) 100%);
    background: linear-gradient(top, rgba(255,255,255,0.7) 80%, rgba(255,255,255,0) 100%);
  }
}
@media screen and (min-width: 600px) {
  #loginCard {
    border-left: solid 1px rgba(0,0,0,0.5);
    -webkit-box-shadow: -1px 0px 0px rgba(255,255,255,0.5), inset 10px 0px 10px rgba(0,0,0,0.5);
    -moz-box-shadow: -1px 0px 0px rgba(255,255,255,0.5), inset 10px 0px 10px rgba(0,0,0,0.5);
    box-shadow: -1px 0px 0px rgba(255,255,255,0.5), inset 10px 0px 10px rgba(0,0,0,0.5);
  }
  #loginViewCardWrapper #loginFormWrapper {
    background-color: rgba(255,255,255,0.3);
    -webkit-box-shadow: inset 10px 0px 10px rgba(0,0,0,0.3);
    -moz-box-shadow: inset 10px 0px 10px rgba(0,0,0,0.3);
    box-shadow: inset 10px 0px 10px rgba(0,0,0,0.3);
    background: -webkit-linear-gradient(top, white 0%, white 0%);
    background: -moz-linear-gradient(top, white 0%, white 0%);
    background: -o-linear-gradient(top, white 0%, white 0%);
    background: -ms-linear-gradient(top, white 0%, white 0%);
    background: linear-gradient(top, white 0%, white 0%);
  }
}
#loginViewCardWrapper .postedMsg {
  background-color: white;
}
@media screen and (max-width: 600px) {
  #loginViewCardWrapper {
    display: block;
    position: absolute;
    top: 0px;
    bottom: 0px;
    left: 0px;
    right: 0px;
    margin: 0px;
    padding: 0px;
    padding-bottom: 100px;
    -webkit-overflow-scrolling: touch;
    overflow-y: auto;
    overflow-x: hidden;
  }
  #loginCardWrapper {
    position: relative;
    top: 0px;
    left: 0px;
    right: 0px;
    height: 100%;
    min-height: 300px;
    max-height: 480px;
    overflow: hidden;
  }
  #loginCard {
    position: absolute;
    top: 0px;
    left: 0px;
    right: 0px;
    height: 100%;
  }
  #schoolCard {
    position: relative;
    top: 20px;
    left: 10px;
    right: 0px;
    min-height: 200px;
    padding: 0px;
    margin-right: 20px;
    margin-bottom: 20px;
    padding-bottom: 20px;
  }
  #coverPicture {
    position: relative;
    top: 0px;
    left: 0px;
    right: 10px;
    margin: 0px;
    padding: 0px;
  }
  #coverPicture img {
    width: 100%;
    margin: 0px;
  }
  #schoolProfile {
    position: relative;
    display: block;
    text-align: left;
    margin: 0px;
    padding: 0px;
    background-color: white;
    padding-left: 100px;
    padding-top: 10px;
    height: 80px;
    top: -4px;
  }
  #schoolName {
    display: block;
    position: relative;
    left: 0px;
    right: 0px;
    font-size: 24px;
    color: #333;
    margin: 0px;
    padding: 0px;
    font-family: HeaderFont, Helvetica, sans-serif;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
  }
  #schoolContactInfo {
    display: block;
    position: relative;
    left: 0px;
    right: 0px;
    font-size: 11px;
    color: #666;
    margin: 0px;
    padding: 0px;
    font-weight: light;
  }
  #schoolLogo {
    position: absolute;
    top: -40px;
    left: 5px;
    border: solid 4px white;
    background-color: #999;
    padding: 1px;
    height: 80px;
  }
  #schoolLogo img {
    height: 80px;
    width: 80px;
  }
  #loginViewCardWrapper .postedMsg {
    position: relative;
    display: block;
    text-align: left;
    margin: 0px;
    padding: 20px !important;
    left: 0px;
    right: 10px;
    top: 10px;
  }
}
@media screen and (min-width: 600px) {
  #loginViewCardWrapper {
    display: block;
    position: absolute;
    top: 0px;
    bottom: 0px;
    left: 0px;
    right: 0px;
    margin: 0px;
    padding: 0px;
    padding-bottom: 100px;
  }
  #loginCardWrapper {
    position: absolute;
    top: 0px;
    left: 0px;
    right: 0px;
    bottom: 0px;
    overflow: auto;
    -webkit-overflow-scrolling: touch;
    overflow-y: auto;
    overflow-x: hidden;
  }
  #loginCard {
    position: absolute;
    top: 0px;
    right: 0px;
    bottom: 0px;
    width: 270px;
  }
  #schoolCard {
    position: absolute;
    top: 0px;
    left: 0px;
    right: 270px;
    bottom: 0px;
    padding: 20px;
    margin: 0px;
    padding-bottom: 20px;
    -webkit-overflow-scrolling: touch;
    overflow-y: scroll;
    overflow-x: hidden;
  }
  #coverPicture {
    position: relative;
    top: 0px;
    min-width: 300px;
    max-width: 550px;
    margin: auto;
    padding: 0px;
  }
  #coverPicture img {
    width: 100%;
    margin: 0px;
    min-height: 40px;
  }
  #schoolProfile {
    position: relative;
    display: block;
    text-align: left;
    background-color: white;
    height: 80px;
    top: -4px;
    min-width: 200px;
    max-width: 450px;
    margin: auto;
    padding: 0px;
    padding-left: 100px;
  }
  #schoolName {
    display: block;
    position: relative;
    left: 0px;
    right: 0px;
    font-size: 24px;
    color: #333;
    margin: 0px;
    padding: 0px;
    font-family: HeaderFont, Helvetica, sans-serif;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
  }
  #schoolContactInfo {
    display: block;
    position: relative;
    left: 0px;
    right: 0px;
    font-size: 11px;
    color: #666;
    margin: 0px;
    padding: 0px;
    font-weight: light;
  }
  #schoolLogo {
    position: absolute;
    top: -40px;
    left: 5px;
    border: solid 4px white;
    background-color: #999;
    padding: 1px;
    height: 80px;
  }
  #schoolLogo img {
    height: 80px;
    width: 80px;
  }
  #loginViewCardWrapper .postedMsg {
    position: relative;
    display: block;
    text-align: left;
    margin: auto;
    padding: 20px !important;
    min-width: 260px;
    max-width: 510px;
    top: 10px;
  }
}
#loginFormWrapper {
  display: block;
  position: absolute;
  top: 0px;
  right: 0px;
  left: 0px;
  height: 200px;
  padding: 0px;
  margin: 0px;
  padding-top: 10px;
}
#loginFormWrapper form {
  position: relative;
  left: 5px;
  right: 5px;
  top: 10px;
}
#loginFormWrapper .formInputWrapper {
  display: block;
  position: relative;
  left: 0px;
  right: 0px;
  padding: 1px 18px 0px 0px;
  margin: 0px;
}
#loginFormWrapper .formInputWrapper label {
  display: block;
  position: relative;
  width: 100% !important;
  color: #555;
}
#loginFormWrapper .formInputWrapper input {
  display: block;
  position: relative;
  width: 100% !important;
  color: black;
  height: 31px;
  -webkit-border-radius: 0px;
}
#loginFormWrapper #loginBtn {
  display: block;
  position: relative;
  left: 5px;
  right: 0px;
  top: 15px;
  margin-right: 10px;
  height: 40px;
  line-height: 40px;
  font-size: 16px;
  color: white;
  background-color: #006bff;
  text-align: center;
  cursor: hand;
  cursor: pointer;
  pointer-events: auto;
}
#loginFormWrapper #forgotYourPasswordBtn {
  display: block;
  position: relative;
  left: 5px;
  right: 0px;
  top: 20px;
  margin-right: 10px;
  height: 24px;
  line-height: 24px;
  text-align: center;
  font-size: 14px;
  font-style: italic;
  color: #fff;
  background-color: rgba(0,0,0,0.5);
  cursor: hand;
  cursor: pointer;
  pointer-events: auto;
}
#loginFormWrapper #loginMsgArea {
  visibility: hidden;
  position: relative;
  left: 0px;
  right: 0px;
  top: 25px;
  background-color: #b10000;
  padding: 5px;
  text-align: center;
  color: white;
  font-weight: bold;
}
#loginFormWrapper #loginMsgArea[warning] {
  visibility: visible;
}
#twitterFeedBtn {
  position: absolute;
  top: 5px;
  left: 0px;
  width: auto;
  height: 30px;
  background: url(../img/uiGraphics/twitter.png);
  background-size: 30px 30px;
  background-repeat: no-repeat;
  background-color: #006bff;
  border-radius: 0px 15px 15px 0px;
  -webkit-box-shadow: 0px 2px 2px rgba(0,0,0,0.3);
  -moz-box-shadow: 0px 2px 2px rgba(0,0,0,0.3);
  box-shadow: 0px 2px 2px rgba(0,0,0,0.3);
  color: white;
  line-height: 30px;
  padding-left: 35px;
  padding-right: 15px;
  text-align: left;
  font-size: 14px;
}
#twitterFeed > a {
  color: black;
  display: block;
  text-align: center;
  padding: 0px;
  margin: 0px;
  width: 100%;
  height: 360px;
  line-height: 360px;
  font-size: 12px;
  font-weight: normal;
}
#twitterFeed {
  display: block;
  position: absolute;
  top: 40px;
  left: 5px;
  width: 220px;
  -webkit-transition: -webkit-transform 1s;
  -moz-transition: -moz-transform 1s;
  -o-transition: -o-transform 1s;
  -ms-transition: -ms-transform 1s;
  transition: transform 1s;
  -webkit-box-shadow: 0px 2px 2px rgba(0,0,0,0.3);
  -moz-box-shadow: 0px 2px 2px rgba(0,0,0,0.3);
  box-shadow: 0px 2px 2px rgba(0,0,0,0.3);
  border-radius: 5px !important;
  height: 360px;
  background: white;
}
#twitterFeed[justlaunched] {
  transition-delay: 5s;
  -webkit-transition-delay: 5s;
}
#twitterFeed[viewState=A] {
  -webkit-transform: translate3d(0px,0px,0px);
  -moz-transform: translate3d(0px,0px,0px);
  -o-transform: translate3d(0px,0px,0px);
  -ms-transform: translate3d(0px,0px,0px);
  transform: translate3d(0px,0px,0px);
}
#twitterFeed[viewState=B] {
  -webkit-transform: translate3d(-250px,0px,0px);
  -moz-transform: translate3d(-250px,0px,0px);
  -o-transform: translate3d(-250px,0px,0px);
  -ms-transform: translate3d(-250px,0px,0px);
  transform: translate3d(-250px,0px,0px);
}
#homePanelWrapper {
  position: absolute;
  top: 0px;
  right: 0px;
  bottom: 40px;
  left: 80px;
  margin: 0px;
  padding: 0px;
  overflow: hidden;
}
#homeNavigation {
  position: absolute;
  top: 0px;
  left: 0px;
  bottom: 0px;
  width: 80px;
  margin: 0px;
  padding: 0px;
  overflow: visible;
  -webkit-transform: translate3D(0%,0px,0px);
}
#homeBottomBar {
  position: absolute;
  right: 0px;
  bottom: 0px;
  left: 80px;
  height: 40px;
  margin: 0px;
  padding: 0px;
  overflow: hidden;
  border-top: solid 1px black;
  -webkit-box-shadow: inset 0px 1px 0px rgba(255,255,255,0.4);
}
#homeNavigation .navigationWrapper {
  position: absolute;
  top: 40px;
  bottom: 39px;
  left: 0px;
  right: -2px;
  background-color: rgba(0,0,0,0.3);
  border-top: solid 1px black;
  border-bottom: solid 1px rgba(255,255,255,0.5);
  border-right: solid 1px rgba(0,0,0,0.5);
  -webkit-box-shadow: inset 0px 1px 1px rgba(255,255,255,0.5), inset 0px -1px 1px black, inset -1px 0px 1px rgba(255,255,255,0.5), inset 0px 3px 3px rgba(0,0,0,0.3), inset 0px -3px 3px rgba(0,0,0,0.3);
}
#homeNavigation .navigationWrapper ul {
  margin: 0px;
  padding: 0px;
  position: absolute;
  top: 0px;
  left: 0px;
  right: 0px;
  height: auto;
}
#homeNavigation .navigationWrapper li {
  position: relative;
  left: 0px;
  right: 0px;
  height: 60px;
}
#homeNavigation .navigationWrapper li[state=hidden] {
  display: none;
}
#homeNavigation .navigationWrapper li:hover {
  background-color: rgba(255,255,255,0.3);
}
#homeNavigation .navigationWrapper li .label {
  position: absolute;
  bottom: 5px;
  left: 3px;
  right: 3px;
  color: black;
  text-align: center;
  font-size: 12px;
  pointer-events: none;
}
#homeNavigation .navigationWrapper li .icon {
  width: 30px;
  height: 30px;
  position: absolute;
  left: 25px;
  top: 5px;
  pointer-events: none;
}
#homeNavigation .navigationWrapper li .icon img {
  width: 30px;
  pointer-events: none;
}
#homeNavigation .navigationWrapper .badge {
  display: block;
  position: absolute;
  width: 15px;
  height: 16px;
  top: 1px;
  right: 4px;
  color: black;
  background-color: #ffd900;
  border: solid 1px white;
  text-align: center;
  font-size: 13px;
  padding: 2px;
  -webkit-border-radius: 5px;
  pointer-events: none;
}
#homeNavigation .navigationWrapper li[no_notification] .badge {
  display: none;
}
#homeNavigation .navigationWrapper li:first-child {
  height: 75px;
}
#homeNavigation .navigationWrapper li:first-child .icon {
  top: 20px;
}
#homeNavigation .navigationWrapper li:first-child .badge {
  top: 16px;
}
#homeView .panel {
  position: absolute;
  left: 0px;
  top: 0px;
  bottom: 0px;
  right: 0px;
  -webkit-tap-highlight-color: rgba(0,0,0,0);
}
#homeView .panel > .toolbar {
  position: absolute;
  top: 0px;
  left: 0px;
  right: 0px;
  height: 40px;
  -webkit-box-shadow: 0px 1px 0px rgba(255,255,255,0.4), 0px 3px 3px rgba(0,0,0,0.3);
  border-bottom: solid 1px black;
  z-index: 100;
}
#homeView .panel > .content {
  position: absolute;
  top: 40px;
  bottom: 0px;
  left: 0px;
  right: 0px;
  background-color: rgba(0,0,0,0.5);
}
#homeView .panel > .header {
  position: absolute;
  top: 70px;
  left: 0px;
  right: 0px;
  height: 80px;
  -webkit-box-shadow: 0px 1px 0px rgba(255,255,255,0.4);
  border-bottom: solid 1px black;
  z-index: 1;
}
#homeView .panel > .header > h1 {
  position: absolute;
  left: 5px;
  right: 5px;
  top: -5px;
  margin: 0px;
  padding: 0px;
  font-size: 32px;
  font-family: HeaderFont, Helvetica, sans-serif;
  color: white;
  text-align: center;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  height: 40px;
  max-height: 40px;
}
#homeView .panel > .header > h2 {
  position: absolute;
  left: 5px;
  right: 5px;
  top: 35px;
  margin: 0px;
  padding: 0px;
  font-size: 18px;
  font-family: HeaderFont, Helvetica, sans-serif;
  color: white;
  text-align: center;
  text-overflow: ellipsis;
  height: 30px;
  max-height: 30px;
}
#homeView .panel ::-webkit-scrollbar {
  width: 14px;
  height: 14px;
}
#homeView .panel ::-webkit-scrollbar-button:start:decrement,
#homeView .panel ::-webkit-scrollbar-button:end:increment {
  display: block;
  height: 0;
  background-color: transparent;
}
#homeView .panel ::-webkit-scrollbar-thumb:vertical {
  height: 50px;
  background-color: rgba(255,255,255,0.5);
}
#homeView .panel ::-webkit-scrollbar-thumb:horizontal {
  width: 50px;
  background-color: rgba(255,255,255,0.5);
}
#homeView .panel ::-webkit-scrollbar-track-piece {
  background: -webkit-linear-gradient(left,rgba(255,157,114,0.5) 0%,rgba(131,0,110,0.5) 100%), -webkit-linear-gradient(left,#983b00 0%,#FFA72B 100%), -webkit-linear-gradient(left,white 0%,white 100%);
  background-size: 14px 100%, 14px 100%, 14px 100%;
  background-position: top right, top right, top right;
  background-repeat: no-repeat, no-repeat, no-repeat;
}
#homeView .listWrapper {
  position: absolute;
  top: 112px;
  left: 0px;
  right: 0px;
  bottom: 0px;
  -webkit-overflow-scrolling: touch;
  overflow-y: auto;
  overflow-x: hidden;
  margin: 0px;
  padding: 0px;
  padding: 20px 0px 0px 0px;
  background-color: rgba(0,0,0,0.3);
}
#homeView .listWrapper > ul {
  margin: 0px;
  padding: 0px 30px 100px 30px;
  position: relative;
  left: 0px;
  right: 0px;
  display: block;
  list-style: none;
  min-height: 100%;
  text-align: center;
  background: url(../img/uiGraphics/homeViewShelfBkg.png);
  background-size: 100% 200px;
  background-repeat: repeat-y;
}
#homeView .listWrapper > ul > li {
  display: inline-block;
  vertical-align: top;
  width: 210px;
  height: 160px;
  background-color: white;
  margin: 20px;
  padding: 0px;
  margin-right: 5px;
  border: none;
  -webkit-box-shadow: -2px 2px 10px rgba(0,0,0,0.7) !important;
}
#homeView .listWrapper > ul > li[state=hidden] {
  display: inline-block !important;
  visibility: hidden !important;
}
#homeView .panel[mode=edit] .listWrapper > ul > li[state=hidden] {
  display: none !important;
  visibility: hidden !important;
}
#homeView .listWrapper > ul > li > .content {
  color: white;
  font-size: 16px;
  position: absolute;
  top: 0px;
  left: 0px;
  right: 0px;
  bottom: 0px;
  padding: 15px;
  padding-left: 30px;
  text-align: left;
}
#homeView .listWrapper > ul > li > .controls {
  color: black;
  font-size: 16px;
  position: absolute;
  margin: 0px;
  padding: 0px;
  left: 0px;
  right: 0px;
  bottom: 0px;
  height: 35px;
  margin-top: 45px;
  text-align: right;
}
#homeView .listWrapper > ul > li > .controls .itemDeleteBtn {
  display: none;
  vertical-align: middle;
  margin: 0px 5px 0px 5px;
}
#homeView .listWrapper > ul > li > .controls .itemFlagBtn {
  display: none;
  vertical-align: middle;
  margin: 0px 5px 0px 5px;
}
#homeView .listWrapper > ul > li > .controls .itemActionBtn {
  display: none;
  vertical-align: middle;
  margin: 0px 5px 0px 5px;
}
#homeView .listWrapper > ul > li > .content .cardTitle {
  color: white;
  position: absolute;
  bottom: 50px;
  left: 10px;
  right: 10px;
  font-size: 18px;
  font-style: italic;
  font-family: Helvetica, Tahoma, Arial, Sans-serif;
  font-weight: bold;
}
#homeView .listWrapper > ul > li > .content .cardTitle .itemSubheader {
  font-size: 12px;
  font-weight: normal;
}
#homeView .listWrapper > ul > li > .content .cardStyle {
  position: absolute;
  top: 0px;
  left: 0px;
  right: 0px;
  bottom: 40px;
}
#homeView .listWrapper > ul > li > .content .schoolTreeApp {
  background-image: url(../img/shelfGlyphs/schooltree.png);
  background-color: #233C66;
  background-size: 60px 60px;
  background-repeat: no-repeat;
  background-position: 10px 10px;
}
#homeView .listWrapper > ul > li > .content .usersApp {
  background-image: url(../img/shelfGlyphs/users.png);
  background-color: #3D69B2;
  background-size: 60px 60px;
  background-repeat: no-repeat;
  background-position: 10px 10px;
}
#homeView .listWrapper > ul > li > .content .enrollmentApp {
  background-image: url(../img/shelfGlyphs/enroll.png);
  background-color: #5896FF;
  background-size: 60px 60px;
  background-repeat: no-repeat;
  background-position: 10px 10px;
}
#homeView .listWrapper > ul > li > .content .avaluarApp {
  background-image: url(../img/shelfGlyphs/avaluar.png);
  background-color: #0B1194;
  background-size: 60px 60px;
  background-repeat: no-repeat;
  background-position: 10px 10px;
}
#homeView .listWrapper > ul > li > .content .attendenzaApp {
  background-image: url(../img/shelfGlyphs/attendenza.png);
  background-color: #039463;
  background-size: 60px 60px;
  background-repeat: no-repeat;
  background-position: 10px 10px;
}
#homeView .listWrapper > ul > li > .content .condottaApp {
  background-image: url(../img/shelfGlyphs/condotta.png);
  background-color: #94044D;
  background-size: 60px 60px;
  background-repeat: no-repeat;
  background-position: 10px 10px;
}
#homeView .listWrapper > ul > li > .content .informasiApp {
  background-image: url(../img/shelfGlyphs/informasi.png);
  background-color: #A15B04;
  background-size: 60px 60px;
  background-repeat: no-repeat;
  background-position: 10px 10px;
}
#homeView .listWrapper > ul > li > .content .debtmanagementApp {
  background-image: url(../img/shelfGlyphs/debt.png);
  background-color: #8DA10C;
  background-size: 60px 60px;
  background-repeat: no-repeat;
  background-position: 10px 10px;
}
#homeView .listWrapper > ul > li > .content .statisticsApp {
  background-image: url(../img/shelfGlyphs/stats.png);
  background-color: #cf9f00;
  background-size: 60px 60px;
  background-repeat: no-repeat;
  background-position: 10px 10px;
}
#homeView .listWrapper > ul > li > .content .printApp {
  background-image: url(../img/shelfGlyphs/print.png);
  background-color: #660040;
  background-size: 60px 60px;
  background-repeat: no-repeat;
  background-position: 10px 10px;
}
#homeView .listWrapper > ul > li > .content .accessApp {
  background-image: url(../img/shelfGlyphs/access.png);
  background-color: #75067D;
  background-size: 60px 60px;
  background-repeat: no-repeat;
  background-position: 10px 10px;
}
#homeView .listWrapper > ul > li > .content .custumercareApp {
  background-image: url(../img/shelfGlyphs/custumercare.png);
  background-color: #4D0673;
  background-size: 60px 60px;
  background-repeat: no-repeat;
  background-position: 10px 10px;
}
#homeView .listWrapper > ul > li > .content .activityApp {
  background-image: url(../img/shelfGlyphs/activity.png);
  background-color: #391551;
  background-size: 60px 60px;
  background-repeat: no-repeat;
  background-position: 10px 10px;
}
#homeView .listWrapper > ul > li > .content .course {
  background-image: url(../img/shelfGlyphs/course.png);
  background-color: #5896FF;
  background-size: 60px 60px;
  background-repeat: no-repeat;
  background-position: 10px 10px;
}
#homeView .listWrapper > ul > li > .content .group {
  background-image: url(../img/shelfGlyphs/group.png);
  background-color: #039463;
  background-size: 60px 60px;
  background-repeat: no-repeat;
  background-position: 10px 10px;
}
#homeView .listWrapper > ul > li > .content .mixGroup {
  background-image: url(../img/shelfGlyphs/group.png);
  background-color: #94044D;
  background-size: 60px 60px;
  background-repeat: no-repeat;
  background-position: 10px 10px;
}
#homeView .listWrapper > ul > li > .content .skiffer_billingAndPayments {
  background-image: url(../img/shelfGlyphs/debt.png);
  background-color: #577200;
  background-size: 60px 60px;
  background-repeat: no-repeat;
  background-position: 10px 10px;
}
#homeView .listWrapper > ul > li > .content .skiffer_clientAccounts {
  background-image: url(../img/shelfGlyphs/schools.png);
  background-color: #F75C00;
  background-size: 60px 60px;
  background-repeat: no-repeat;
  background-position: 10px 10px;
}
#homeView .listFormContent {
  position: absolute;
  top: 15px;
  left: 5px;
  right: 5px;
}
#homeView .listFormContent label {
  color: white;
  width: 180px;
}
#homeView .listFormContent input {
  width: 180px;
}
#homeView .listFormToolbar {
  position: absolute;
  bottom: 15px;
  left: 5px;
  right: 5px;
}
#homeView .listAddForm {
  background: -webkit-linear-gradient(top left,#0c8300 0%,#053e00 100%);
}
#homeView .listEditForm {
  background: -webkit-linear-gradient(top left,#670086 0%,#24002f 100%);
}
@media screen and (max-width: 600px) {
  #homeView .listWrapper > ul > li {
    position: relative;
    left: 0px;
    right: 0px;
    top: 20px;
    display: block;
    width: auto;
    margin-bottom: 40px;
  }
}
#workPanelWrapper 					> .panel > .content {
  visibility: hidden;
}
#workPanelWrapper[focusPanel=one]	> .panel > .content {
  visibility: visible;
}
#workPanelWrapper[focusPanel=two]	> .panel > .content {
  visibility: visible;
}
#workPanelWrapper[focusPanel=three]	> .panel > .content {
  visibility: visible;
}
#workPanelWrapper[focusPanel=four]	> .panel > .content {
  visibility: visible;
}
#workPanelWrapper[focusPanel=none]	> .panel > .content {
  visibility: visible;
}
#workPanelWrapper .panel {
  width: 100%;
}
#workPanelWrapper 					.panel 					.content {
  opacity: 0;
}
#workPanelWrapper[focusPanel=one] 	.panel[panelID=one] 	.content {
  opacity: 1;
}
#workPanelWrapper[focusPanel=two] 	.panel[panelID=two] 	.content {
  opacity: 1;
}
#workPanelWrapper[focusPanel=three] .panel[panelID=three] 	.content {
  opacity: 1;
}
#workPanelWrapper[focusPanel=four] 	.panel[panelID=four] 	.content {
  opacity: 1;
}
#workPanelWrapper[focusPanel=none] 	.panel 					.content {
  opacity: .5;
}
#workPanelWrapper 					.panel 					.header {
  opacity: 0;
}
#workPanelWrapper[focusPanel=one] 	.panel[panelID=one] 	.header {
  opacity: 1;
}
#workPanelWrapper[focusPanel=two] 	.panel[panelID=two] 	.header {
  opacity: 1;
}
#workPanelWrapper[focusPanel=three] .panel[panelID=three] 	.header {
  opacity: 1;
}
#workPanelWrapper[focusPanel=four] 	.panel[panelID=four] 	.header {
  opacity: 1;
}
#workPanelWrapper[focusPanel=none] 	.panel 					.header {
  opacity: .5;
}
#workPanelWrapper 					.panel[listheader=visible] 					.listHeader {
  opacity: 0 !important;
}
#workPanelWrapper 					.panel[listheader=hidden] 					.listHeader {
  opacity: 0 !important;
}
#workPanelWrapper[focusPanel=one] 	.panel[panelID=one][listheader=visible] 	.listHeader {
  opacity: 1 !important;
}
#workPanelWrapper[focusPanel=two] 	.panel[panelID=two][listheader=visible] 	.listHeader {
  opacity: 1 !important;
}
#workPanelWrapper[focusPanel=three] .panel[panelID=three][listheader=visible] 	.listHeader {
  opacity: 1 !important;
}
#workPanelWrapper[focusPanel=four] 	.panel[panelID=four][listheader=visible] 	.listHeader {
  opacity: 1 !important;
}
#workPanelWrapper[focusPanel=none] 	.panel[listheader=visible] 					.listHeader {
  opacity: .5 !important;
}
#workPanelWrapper .panel .toolbar {
  opacity: .5;
}
#workPanelWrapper[focusPanel=one] 	.panel[panelID=one] 	.toolbar {
  opacity: 1;
}
#workPanelWrapper[focusPanel=two] 	.panel[panelID=two] 	.toolbar {
  opacity: 1;
}
#workPanelWrapper[focusPanel=three] .panel[panelID=three] 	.toolbar {
  opacity: 1;
}
#workPanelWrapper[focusPanel=four] 	.panel[panelID=four] 	.toolbar {
  opacity: 1;
}
#workPanelWrapper .panel .toolbarLeftContainer {
  opacity: 0;
}
#workPanelWrapper[focusPanel=one] 	.panel[panelID=one] 	.toolbarLeftContainer {
  opacity: 1;
}
#workPanelWrapper[focusPanel=two] 	.panel[panelID=two] 	.toolbarLeftContainer {
  opacity: 1;
}
#workPanelWrapper[focusPanel=three] .panel[panelID=three] 	.toolbarLeftContainer {
  opacity: 1;
}
#workPanelWrapper[focusPanel=four] 	.panel[panelID=four] 	.toolbarLeftContainer {
  opacity: 1;
}
#workPanelWrapper .panel .toolbarCenterContainer {
  opacity: 0;
}
#workPanelWrapper[focusPanel=one] 	.panel[panelID=one] 	.toolbarCenterContainer {
  opacity: 1;
}
#workPanelWrapper[focusPanel=two] 	.panel[panelID=two] 	.toolbarCenterContainer {
  opacity: 1;
}
#workPanelWrapper[focusPanel=three] .panel[panelID=three] 	.toolbarCenterContainer {
  opacity: 1;
}
#workPanelWrapper[focusPanel=four] 	.panel[panelID=four] 	.toolbarCenterContainer {
  opacity: 1;
}
#workPanelWrapper .panel .toolbarRightContainer {
  opacity: 0;
}
#workPanelWrapper[focusPanel=one] 	.panel[panelID=one] 	.toolbarRightContainer {
  opacity: 1;
}
#workPanelWrapper[focusPanel=two] 	.panel[panelID=two] 	.toolbarRightContainer {
  opacity: 1;
}
#workPanelWrapper[focusPanel=three] .panel[panelID=three] 	.toolbarRightContainer {
  opacity: 1;
}
#workPanelWrapper[focusPanel=four] 	.panel[panelID=four] 	.toolbarRightContainer {
  opacity: 1;
}
#workPanelWrapper				 	.panel {
  background: -webkit-linear-gradient(top left,#132009 0%,#004d3a 100%);
  background: -moz-linear-gradient(top left,#132009 0%,#004d3a 100%);
  background: -o-linear-gradient(top left,#132009 0%,#004d3a 100%);
  background: -ms-linear-gradient(top left,#132009 0%,#004d3a 100%);
  background: linear-gradient(top left,#132009 0%,#004d3a 100%);
}
#workPanelWrapper[focusPanel=one] 	.panel[panelID=one] {
  background: -webkit-linear-gradient(top left,#1c4400 0%,#004d3a 100%);
  background: -moz-linear-gradient(top left,#1c4400 0%,#004d3a 100%);
  background: -o-linear-gradient(top left,#1c4400 0%,#004d3a 100%);
  background: -ms-linear-gradient(top left,#1c4400 0%,#004d3a 100%);
  background: linear-gradient(top left,#1c4400 0%,#004d3a 100%);
}
#workPanelWrapper[focusPanel=two] 	.panel[panelID=two] {
  background: -webkit-linear-gradient(top left,#1c4400 0%,#004d3a 100%);
  background: -moz-linear-gradient(top left,#1c4400 0%,#004d3a 100%);
  background: -o-linear-gradient(top left,#1c4400 0%,#004d3a 100%);
  background: -ms-linear-gradient(top left,#1c4400 0%,#004d3a 100%);
  background: linear-gradient(top left,#1c4400 0%,#004d3a 100%);
}
#workPanelWrapper[focusPanel=three] .panel[panelID=three] {
  background: -webkit-linear-gradient(top left,#1c4400 0%,#004d3a 100%);
  background: -moz-linear-gradient(top left,#1c4400 0%,#004d3a 100%);
  background: -o-linear-gradient(top left,#1c4400 0%,#004d3a 100%);
  background: -ms-linear-gradient(top left,#1c4400 0%,#004d3a 100%);
  background: linear-gradient(top left,#1c4400 0%,#004d3a 100%);
}
#workPanelWrapper[focusPanel=four] 	.panel[panelID=four] {
  background: -webkit-linear-gradient(top left,#1c4400 0%,#004d3a 100%);
  background: -moz-linear-gradient(top left,#1c4400 0%,#004d3a 100%);
  background: -o-linear-gradient(top left,#1c4400 0%,#004d3a 100%);
  background: -ms-linear-gradient(top left,#1c4400 0%,#004d3a 100%);
  background: linear-gradient(top left,#1c4400 0%,#004d3a 100%);
}
#workPanelWrapper[focusPanel=one] 	.panel[panelID=one] {
  -webkit-transform: translate3D(0%,0px,0px);
  -moz-transform: translate3D(0%,0px,0px);
  -o-transform: translate3D(0%,0px,0px);
  -ms-transform: translate3D(0%,0px,0px);
  transform: translate3D(0%,0px,0px);
}
#workPanelWrapper[focusPanel=one] 	.panel[panelID=two] {
  -webkit-transform: translate3D(100%,0px,0px);
  -moz-transform: translate3D(100%,0px,0px);
  -o-transform: translate3D(100%,0px,0px);
  -ms-transform: translate3D(100%,0px,0px);
  transform: translate3D(100%,0px,0px);
  -webkit-box-shadow: none;
  box-shadow: none;
}
#workPanelWrapper[focusPanel=one] 	.panel[panelID=three] {
  -webkit-transform: translate3D(100%,0px,0px);
  -moz-transform: translate3D(100%,0px,0px);
  -o-transform: translate3D(100%,0px,0px);
  -ms-transform: translate3D(100%,0px,0px);
  transform: translate3D(100%,0px,0px);
  -webkit-box-shadow: none;
  box-shadow: none;
}
#workPanelWrapper[focusPanel=one] 	.panel[panelID=four] {
  -webkit-transform: translate3D(100%,0px,0px);
  -moz-transform: translate3D(100%,0px,0px);
  -o-transform: translate3D(100%,0px,0px);
  -ms-transform: translate3D(100%,0px,0px);
  transform: translate3D(100%,0px,0px);
  -webkit-box-shadow: none;
  box-shadow: none;
}
#workPanelWrapper[focusPanel=two] 	.panel[panelID=one] {
  -webkit-transform: translate3D(0%,0px,0px);
  -moz-transform: translate3D(0%,0px,0px);
  -o-transform: translate3D(0%,0px,0px);
  -ms-transform: translate3D(0%,0px,0px);
  transform: translate3D(0%,0px,0px);
}
#workPanelWrapper[focusPanel=two] 	.panel[panelID=two] {
  -webkit-transform: translate3D(6%,0px,0px);
  -moz-transform: translate3D(6%,0px,0px);
  -o-transform: translate3D(6%,0px,0px);
  -ms-transform: translate3D(6%,0px,0px);
  transform: translate3D(6%,0px,0px);
}
#workPanelWrapper[focusPanel=two] 	.panel[panelID=three] {
  -webkit-transform: translate3D(100%,0px,0px);
  -moz-transform: translate3D(100%,0px,0px);
  -o-transform: translate3D(100%,0px,0px);
  -ms-transform: translate3D(100%,0px,0px);
  transform: translate3D(100%,0px,0px);
  -webkit-box-shadow: none;
  box-shadow: none;
}
#workPanelWrapper[focusPanel=two] 	.panel[panelID=four] {
  -webkit-transform: translate3D(100%,0px,0px);
  -moz-transform: translate3D(100%,0px,0px);
  -o-transform: translate3D(100%,0px,0px);
  -ms-transform: translate3D(100%,0px,0px);
  transform: translate3D(100%,0px,0px);
  -webkit-box-shadow: none;
  box-shadow: none;
}
#workPanelWrapper[focusPanel=three] .panel[panelID=one] {
  -webkit-transform: translate3D(0%,0px,0px);
  -moz-transform: translate3D(0%,0px,0px);
  -o-transform: translate3D(0%,0px,0px);
  -ms-transform: translate3D(0%,0px,0px);
  transform: translate3D(0%,0px,0px);
}
#workPanelWrapper[focusPanel=three] .panel[panelID=two] {
  -webkit-transform: translate3D(3%,0px,0px);
  -moz-transform: translate3D(3%,0px,0px);
  -o-transform: translate3D(3%,0px,0px);
  -ms-transform: translate3D(3%,0px,0px);
  transform: translate3D(3%,0px,0px);
}
#workPanelWrapper[focusPanel=three] .panel[panelID=three] {
  -webkit-transform: translate3D(6%,0px,0px);
  -moz-transform: translate3D(6%,0px,0px);
  -o-transform: translate3D(6%,0px,0px);
  -ms-transform: translate3D(6%,0px,0px);
  transform: translate3D(6%,0px,0px);
}
#workPanelWrapper[focusPanel=three] .panel[panelID=four] {
  -webkit-transform: translate3D(100%,0px,0px);
  -moz-transform: translate3D(100%,0px,0px);
  -o-transform: translate3D(100%,0px,0px);
  -ms-transform: translate3D(100%,0px,0px);
  transform: translate3D(100%,0px,0px);
  -webkit-box-shadow: none;
  box-shadow: none;
}
#workPanelWrapper[focusPanel=four] 	.panel[panelID=one] {
  -webkit-transform: translate3D(0%,0px,0px);
  -moz-transform: translate3D(0%,0px,0px);
  -o-transform: translate3D(0%,0px,0px);
  -ms-transform: translate3D(0%,0px,0px);
  transform: translate3D(0%,0px,0px);
}
#workPanelWrapper[focusPanel=four] 	.panel[panelID=two] {
  -webkit-transform: translate3D(2%,0px,0px);
  -moz-transform: translate3D(2%,0px,0px);
  -o-transform: translate3D(2%,0px,0px);
  -ms-transform: translate3D(2%,0px,0px);
  transform: translate3D(2%,0px,0px);
}
#workPanelWrapper[focusPanel=four] 	.panel[panelID=three] {
  -webkit-transform: translate3D(4%,0px,0px);
  -moz-transform: translate3D(4%,0px,0px);
  -o-transform: translate3D(4%,0px,0px);
  -ms-transform: translate3D(4%,0px,0px);
  transform: translate3D(4%,0px,0px);
}
#workPanelWrapper[focusPanel=four] 	.panel[panelID=four] {
  -webkit-transform: translate3D(6%,0px,0px);
  -moz-transform: translate3D(6%,0px,0px);
  -o-transform: translate3D(6%,0px,0px);
  -ms-transform: translate3D(6%,0px,0px);
  transform: translate3D(6%,0px,0px);
}
#workPanelWrapper[activePanels=four][focusPanel=none]  .panel[panelID=one] {
  -webkit-transform: translate3D(0%,0px,0px);
  -moz-transform: translate3D(0%,0px,0px);
  -o-transform: translate3D(0%,0px,0px);
  -ms-transform: translate3D(0%,0px,0px);
  transform: translate3D(0%,0px,0px);
}
#workPanelWrapper[activePanels=four][focusPanel=none]  .panel[panelID=two] {
  -webkit-transform: translate3D(25%,0px,0px);
  -moz-transform: translate3D(25%,0px,0px);
  -o-transform: translate3D(25%,0px,0px);
  -ms-transform: translate3D(25%,0px,0px);
  transform: translate3D(25%,0px,0px);
}
#workPanelWrapper[activePanels=four][focusPanel=none]  .panel[panelID=three] {
  -webkit-transform: translate3D(50%,0px,0px);
  -moz-transform: translate3D(50%,0px,0px);
  -o-transform: translate3D(50%,0px,0px);
  -ms-transform: translate3D(50%,0px,0px);
  transform: translate3D(50%,0px,0px);
}
#workPanelWrapper[activePanels=four][focusPanel=none]  .panel[panelID=four] {
  -webkit-transform: translate3D(75%,0px,0px);
  -moz-transform: translate3D(75%,0px,0px);
  -o-transform: translate3D(75%,0px,0px);
  -ms-transform: translate3D(75%,0px,0px);
  transform: translate3D(75%,0px,0px);
}
#workPanelWrapper[activePanels=three][focusPanel=none] .panel[panelID=one] {
  -webkit-transform: translate3D(0%,0px,0px);
  -moz-transform: translate3D(0%,0px,0px);
  -o-transform: translate3D(0%,0px,0px);
  -ms-transform: translate3D(0%,0px,0px);
  transform: translate3D(0%,0px,0px);
}
#workPanelWrapper[activePanels=three][focusPanel=none] .panel[panelID=two] {
  -webkit-transform: translate3D(33%,0px,0px);
  -moz-transform: translate3D(33%,0px,0px);
  -o-transform: translate3D(33%,0px,0px);
  -ms-transform: translate3D(33%,0px,0px);
  transform: translate3D(33%,0px,0px);
}
#workPanelWrapper[activePanels=three][focusPanel=none] .panel[panelID=three] {
  -webkit-transform: translate3D(66%,0px,0px);
  -moz-transform: translate3D(66%,0px,0px);
  -o-transform: translate3D(66%,0px,0px);
  -ms-transform: translate3D(66%,0px,0px);
  transform: translate3D(66%,0px,0px);
}
#workPanelWrapper[activePanels=three][focusPanel=none] .panel[panelID=four] {
  -webkit-transform: translate3D(100%,0px,0px);
  -moz-transform: translate3D(100%,0px,0px);
  -o-transform: translate3D(100%,0px,0px);
  -ms-transform: translate3D(100%,0px,0px);
  transform: translate3D(100%,0px,0px);
}
#workPanelWrapper[activePanels=two][focusPanel=none]   .panel[panelID=one] {
  -webkit-transform: translate3D(0%,0px,0px);
  -moz-transform: translate3D(0%,0px,0px);
  -o-transform: translate3D(0%,0px,0px);
  -ms-transform: translate3D(0%,0px,0px);
  transform: translate3D(0%,0px,0px);
}
#workPanelWrapper[activePanels=two][focusPanel=none]   .panel[panelID=two] {
  -webkit-transform: translate3D(50%,0px,0px);
  -moz-transform: translate3D(50%,0px,0px);
  -o-transform: translate3D(50%,0px,0px);
  -ms-transform: translate3D(50%,0px,0px);
  transform: translate3D(50%,0px,0px);
}
#workPanelWrapper[activePanels=two][focusPanel=none]   .panel[panelID=three] {
  -webkit-transform: translate3D(100%,0px,0px);
  -moz-transform: translate3D(100%,0px,0px);
  -o-transform: translate3D(100%,0px,0px);
  -ms-transform: translate3D(100%,0px,0px);
  transform: translate3D(100%,0px,0px);
}
#workPanelWrapper[activePanels=two][focusPanel=none]   .panel[panelID=four] {
  -webkit-transform: translate3D(100%,0px,0px);
  -moz-transform: translate3D(100%,0px,0px);
  -o-transform: translate3D(100%,0px,0px);
  -ms-transform: translate3D(100%,0px,0px);
  transform: translate3D(100%,0px,0px);
}
#workPanelWrapper[activePanels=one][focusPanel=none]   .panel[panelID=one] {
  -webkit-transform: translate3D(0%,0px,0px);
  -moz-transform: translate3D(0%,0px,0px);
  -o-transform: translate3D(0%,0px,0px);
  -ms-transform: translate3D(0%,0px,0px);
  transform: translate3D(0%,0px,0px);
}
#workPanelWrapper[activePanels=one][focusPanel=none]   .panel[panelID=two] {
  -webkit-transform: translate3D(100%,0px,0px);
  -moz-transform: translate3D(100%,0px,0px);
  -o-transform: translate3D(100%,0px,0px);
  -ms-transform: translate3D(100%,0px,0px);
  transform: translate3D(100%,0px,0px);
}
#workPanelWrapper[activePanels=one][focusPanel=none]   .panel[panelID=three] {
  -webkit-transform: translate3D(100%,0px,0px);
  -moz-transform: translate3D(100%,0px,0px);
  -o-transform: translate3D(100%,0px,0px);
  -ms-transform: translate3D(100%,0px,0px);
  transform: translate3D(100%,0px,0px);
}
#workPanelWrapper[activePanels=one][focusPanel=none]   .panel[panelID=four] {
  -webkit-transform: translate3D(100%,0px,0px);
  -moz-transform: translate3D(100%,0px,0px);
  -o-transform: translate3D(100%,0px,0px);
  -ms-transform: translate3D(100%,0px,0px);
  transform: translate3D(100%,0px,0px);
}
@media screen and (max-width: 600px) {
  #workView #workPanelWrapper {
    -webkit-transition: -webkit-transform 500ms ease-out;
    -moz-transition: -moz-transform 500ms ease-out;
    -o-transition: -o-transform 500ms ease-out;
    -ms-transition: -ms-transform 500ms ease-out;
    transition: transform 500ms ease-out;
    left: 0px !important;
    -webkit-box-shadow: -8px 0px 8px rgba(0,0,0,0.5);
    -moz-box-shadow: -8px 0px 8px rgba(0,0,0,0.5);
    box-shadow: -8px 0px 8px rgba(0,0,0,0.5);
    border-left: none !important;
  }
  #workView #workBottomBar {
    -webkit-transition: -webkit-transform 500ms ease-out;
    -moz-transition: -moz-transform 500ms ease-out;
    -o-transition: -o-transform 500ms ease-out;
    -ms-transition: -ms-transform 500ms ease-out;
    transition: transform 500ms ease-out;
    left: 0px !important;
    -webkit-box-shadow: -8px 0px 8px rgba(0,0,0,0.5);
    -moz-box-shadow: -8px 0px 8px rgba(0,0,0,0.5);
    box-shadow: -8px 0px 8px rgba(0,0,0,0.5);
    background: -webkit-linear-gradient(top left, #FF7527 0%, #FF9D72 100%);
    background: -moz-linear-gradient(top left, #FF7527 0%, #FF9D72 100%);
    background: -o-linear-gradient(top left, #FF7527 0%, #FF9D72 100%);
    background: -ms-linear-gradient(top left, #FF7527 0%, #FF9D72 100%);
    background: linear-gradient(top left, #FF7527 0%, #FF9D72 100%);
  }
  #workView #workPanelWrapper {
    -webkit-transform: translate3D(0px,0px,0px);
    -moz-transform: translate3D(0px,0px,0px);
    -o-transform: translate3D(0px,0px,0px);
    -ms-transform: translate3D(0px,0px,0px);
    transform: translate3D(0px,0px,0px);
  }
  #workView #workBottomBar {
    -webkit-transform: translate3D(0px,0px,0px);
    -moz-transform: translate3D(0px,0px,0px);
    -o-transform: translate3D(0px,0px,0px);
    -ms-transform: translate3D(0px,0px,0px);
    transform: translate3D(0px,0px,0px);
  }
  #workView #workNavigation {
    opacity: 1;
    pointer-events: none;
    z-index: -100;
    background-color: rgba(0,0,0,0.3);
    width: 200px;
  }
  #workView[sideNavigation=hidden] #workPanelWrapper {
    -webkit-transform: translate3D(200px,0px,0px);
    -moz-transform: translate3D(200px,0px,0px);
    -o-transform: translate3D(200px,0px,0px);
    -ms-transform: translate3D(200px,0px,0px);
    transform: translate3D(200px,0px,0px);
  }
  #workView[sideNavigation=hidden] #workBottomBar {
    -webkit-transform: translate3D(200px,0px,0px);
    -moz-transform: translate3D(200px,0px,0px);
    -o-transform: translate3D(200px,0px,0px);
    -ms-transform: translate3D(200px,0px,0px);
    transform: translate3D(200px,0px,0px);
  }
  #workView[sideNavigation=hidden] #workNavigation {
    pointer-events: auto;
  }
  #workNavigation .navigationWrapper li .label {
    color: white;
  }
  #workNavigation .navigationWrapper li .icon {
    -webkit-filter: invert(100%);
  }
}
@media screen and (min-width: 600px) {
  #workView[sideNavigation=hidden] #workPanelWrapper {
    left: 0px;
  }
  #workView[sideNavigation=hidden] #workBottomBar {
    left: 0px;
  }
  #workView[sideNavigation=hidden] #workNavigation {
    -webkit-transform: translate3D(-100%,0px,0px);
    -moz-transform: translate3D(-100%,0px,0px);
    -o-transform: translate3D(-100%,0px,0px);
    -ms-transform: translate3D(-100%,0px,0px);
    transform: translate3D(-100%,0px,0px);
  }
}
#workPanelWrapper {
  position: absolute;
  top: 0px;
  right: 0px;
  bottom: 40px;
  left: 200px;
  margin: 0px;
  padding: 0px;
  overflow: hidden;
  border-left: solid 1px black;
  -webkit-box-shadow: -1px 0px 0px white;
}
#workNavigation {
  position: absolute;
  top: 0px;
  bottom: 0px;
  left: 0px;
  width: 200px;
  margin: 0px;
  padding: 0px;
  overflow: hidden;
  border-right: solid 1px black;
  -webkit-box-shadow: inset -1px 0px 0px rgba(255,255,255,0.7);
  -webkit-transform: translate3D(0%,0px,0px);
}
#workBottomBar {
  position: absolute;
  right: 0px;
  bottom: 0px;
  left: 201px;
  height: 40px;
  margin: 0px;
  padding: 0px;
  overflow: hidden;
  border-top: solid 1px black;
  -webkit-box-shadow: inset 0px 1px 0px rgba(255,255,255,0.7);
}
#workPanelWrapper .panel[panelID=one] > .content {
  right: 0px;
}
#workPanelWrapper .panel[panelID=one] > .listHeader {
  right: 0px;
}
#workPanelWrapper .panel[panelID=one] > .header {
  right: 0px;
}
#workPanelWrapper .panel[panelID=one] > .toolbar .toolbarRightContainer {
  right: 0px;
}
#workPanelWrapper .panel[panelID=one] > .toolbar .toolbarCenterContainer {
  right: 0px;
}
#workPanelWrapper .panel[panelID=one] > .toolbar .paginationNext {
  right: 0px;
}
#workPanelWrapper .panel[panelID=one] {
  -webkit-box-shadow: none;
  box-shadow: none;
  -webkit-border-radius: 0px;
  -moz-border-radius: 0px;
  border-radius: 0px;
}
#workPanelWrapper .panel[panelID=one] .content {
  -webkit-border-radius: 0px;
  -moz-border-radius: 0px;
  border-radius: 0px;
}
#workPanelWrapper .panel[panelID=one] .toolbar {
  -webkit-border-radius: 0px;
  -moz-border-radius: 0px;
  border-radius: 0px;
}
#workPanelWrapper .panel > .toolbar .toolbarRightContainer {
  right: 6%;
}
#workPanelWrapper .panel > .toolbar .toolbarCenterContainer {
  right: 6%;
}
#sidePanel .panel[activeWidget=dataExplorer] .content {
  top: 43px !important;
  right: 0px !important;
}
#workPanelWrapper .panel,
#sidePanel .panel {
  position: absolute;
  left: 0px;
  top: 0px;
  bottom: 0px;
  -webkit-transition: -webkit-transform 500ms ease-out, color 500ms ease-out;
  -moz-transition: -moz-transform 500ms ease-out, color 500ms ease-out;
  -o-transition: -o-transform 500ms ease-out, color 500ms ease-out;
  -ms-transition: -ms-transform 500ms ease-out, color 500ms ease-out;
  transition: transform 500ms ease-out, color 500ms ease-out;
  -webkit-box-shadow: -5px 0px 5px rgba(0,0,0,0.7);
  -moz-box-shadow: -5px 0px 5px rgba(0,0,0,0.7);
  box-shadow: -5px 0px 5px rgba(0,0,0,0.7);
  -webkit-border-radius: 5px 0px 0px 5px;
  -moz-border-radius: 5px 0px 0px 5px;
  border-radius: 5px 0px 0px 5px;
}
#workPanelWrapper .panel > .content,
#sidePanel .panel > .content {
  position: absolute;
  top: 70px;
  bottom: 0px;
  left: 0px;
  right: 6%;
  -webkit-border-radius: 0px 0px 0px 5px;
  overflow: hidden;
  -webkit-transition: opacity 300ms ease-out;
}
#workPanelWrapper .panel > .toolbar,
#sidePanel .panel > .toolbar {
  position: absolute;
  top: 0px;
  left: 0px;
  right: 0;
  height: 40px;
  -webkit-box-shadow: 0px 1px 0px rgba(255,255,255,0.5);
  border-bottom: solid 1px black;
  -webkit-border-radius: 5px 0px 0px 0px;
  -webkit-transition: opacity 300ms ease-out;
  background: -webkit-linear-gradient(top left, #FF7527 0%, #FF9D72 100%);
  background: -moz-linear-gradient(top left, #FF7527 0%, #FF9D72 100%);
  background: -o-linear-gradient(top left, #FF7527 0%, #FF9D72 100%);
  background: -ms-linear-gradient(top left, #FF7527 0%, #FF9D72 100%);
  background: linear-gradient(top left, #FF7527 0%, #FF9D72 100%);
}
#workPanelWrapper .panel > .header,
#sidePanel .panel > .header {
  position: absolute;
  top: 70px;
  left: 0px;
  right: 6%;
  height: 80px;
  -webkit-box-shadow: 0px 1px 0px rgba(255,255,255,0.1);
  border-bottom: solid 1px rgba(0,0,0,0.3);
  -webkit-transition: opacity 300ms ease-out;
}
#workPanelWrapper .panel > .listHeader,
#sidePanel .panel > .listHeader {
  position: absolute;
  top: 150px;
  left: 0px;
  right: 6%;
  height: 20px;
  overflow: hidden;
  pointer-events: none;
  background-color: #ffd900;
  padding-left: 20px;
  -webkit-transition: opacity 500ms ease-out;
  -moz-transition: opacity 500ms ease-out;
  -o-transition: opacity 500ms ease-out;
  -ms-transition: opacity 500ms ease-out;
  transition: opacity 500ms ease-out;
}
#workPanelWrapper .panel > .header > h1,
#sidePanel .panel > .header > h1 {
  position: absolute;
  display: block;
  left: 0px;
  right: 0px;
  top: -10px;
  max-height: 40px;
  margin: 0px;
  padding: 0px;
  font-family: HeaderFont, Helvetica, sans-serif;
  font-size: 32px;
  color: white;
  text-align: center;
  pointer-events: none;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
#workPanelWrapper .panel > .header > h2,
#sidePanel .panel > .header > h2 {
  position: absolute;
  display: block;
  left: 0px;
  right: 0px;
  bottom: 5px;
  max-height: 22px;
  height: 22px;
  margin: 0px;
  padding: 0px;
  text-align: left;
  background-color: rgba(255,255,255,0.7);
  pointer-events: none;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
#workPanelWrapper .panel > .header > h2 > ul,
#sidePanel .panel > .header > h2 > ul {
  list-style: none;
  display: block;
  position: absolute;
  left: 0px;
  right: 0px;
  bottom: 0px;
  top: 0px;
  margin: 0px;
  padding: 0px;
}
#workPanelWrapper .panel > .header > h2 > ul > li,
#sidePanel .panel > .header > h2 > ul > li {
  display: inline-block;
  vertical-align: top;
  margin: 0px;
  padding: 2px 5px 0px 28px;
  height: 20px;
  font-family: Helvetica, sans-serif;
  font-size: 16px;
  color: #023110;
  background: url(../img/uiGlyphs/carved_arrowRight.png);
  background-size: 22px 100%;
  background-repeat: no-repeat;
  background-position: top left;
  max-width: 40%;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
#workPanelWrapper .panel > .header > h2 > ul > li:nth-child(1),
#sidePanel .panel > .header > h2 > ul > li:nth-child(1) {
  background: none;
}
#workPanelWrapper .panel > .listHeader .column,
#sidePanel .panel > .listHeader .column {
  position: relative;
  float: left;
  display: block;
  top: 0px;
  bottom: 0px;
  height: 20px;
  text-align: center;
  font-size: 14px;
  color: black;
  padding-top: 2px;
  border-right: solid 1px black;
  margin-left: -1px;
  padding-left: 1px;
  padding-right: 2px;
}
#workPanelWrapper .panel[listHeader=visible] > .content,
#sidePanel .panel[listHeader=visible] > .content {
  top: 90px;
}
#workPanelWrapper .panel[listHeader=visible] > .listHeader,
#sidePanel .panel[listHeader=visible] > .listHeader {
  opacity: 1;
}
#workPanelWrapper .panel[listHeader=hidden]  > .listHeader,
#sidePanel .panel[listHeader=hidden]  > .listHeader {
  pointer-events: none;
  opacity: 0;
}
#workPanelWrapper .paginationPrev,
#sidePanel .paginationPrev {
  display: block;
  width: 40px;
  height: 30px;
  position: absolute;
  top: 86px;
  left: 0px;
  background: url(../img/uiGlyphs/jaune_paginationLeftBtn.png);
  background-size: 40px 30px;
  background-repeat: repeat-x;
  background-position: top left;
}
#workPanelWrapper .paginationNext,
#sidePanel .paginationNext {
  display: block;
  width: 40px;
  height: 30px;
  position: absolute;
  top: 86px;
  right: 6%;
  background: url(../img/uiGlyphs/jaune_paginationRightBtn.png);
  background-size: 40px 30px;
  background-repeat: repeat-x;
  background-position: top left;
}
#workPanelWrapper .paginationPrev[state=hidden],
#sidePanel .paginationPrev[state=hidden] {
  display: none;
}
#workPanelWrapper .paginationNext[state=hidden],
#sidePanel .paginationNext[state=hidden] {
  display: none;
}
#workPanelWrapper .panel[listHeader=hidden] .paginationPrev,
#workPanelWrapper .panel[listHeader=hidden] .paginationNext,
#sidePanel .panel[listHeader=hidden] .paginationPrev,
#sidePanel .panel[listHeader=hidden] .paginationNext {
  display: none;
}
#workPanelWrapper .panel ::-webkit-scrollbar,
#sidePanel .panel ::-webkit-scrollbar {
  width: 10px;
  height: 14px;
}
#workPanelWrapper .panel ::-webkit-scrollbar-button:start:decrement,
#workPanelWrapper .panel ::-webkit-scrollbar-button:end:increment,
#sidePanel .panel ::-webkit-scrollbar-button:start:decrement,
#sidePanel .panel ::-webkit-scrollbar-button:end:increment {
  display: block;
  height: 0;
  background-color: transparent;
}
#workPanelWrapper .panel ::-webkit-scrollbar-thumb:vertical,
#sidePanel .panel ::-webkit-scrollbar-thumb:vertical {
  height: 50px;
  background-color: rgba(255,255,255,0.5);
}
#workPanelWrapper .panel ::-webkit-scrollbar-thumb:horizontal,
#sidePanel .panel ::-webkit-scrollbar-thumb:horizontal {
  width: 50px;
  background-color: rgba(255,255,255,0.5);
}
#workPanelWrapper .panel ::-webkit-scrollbar-track-piece,
#sidePanel .panel ::-webkit-scrollbar-track-piece {
  background-color: transparent;
  border-left: solid 1px rgba(255,255,255,0.1);
  -webkit-box-shadow: inset 1px 0px 0px rgba(0,0,0,0.3);
}
#workPanelWrapper .panel .header .closePanelBtn,
#sidePanel .panel .header .closePanelBtn {
  display: none;
  width: 40px;
  height: 30px;
  background: url(../img/uiGlyphs/blanc_closePanelBtn.png);
  background-size: 40px 30px;
  background-repeat: no-repeat;
  background-position: top left;
  position: absolute;
  right: 0px;
  top: -20px;
  z-index: 100;
}
#workPanelWrapper .panel .header .closePanelBtn[state=visible],
#sidePanel .panel .header .closePanelBtn[state=visible] {
  display: block;
}
#workView .listWrapper > ul > li,
#sidePanel .listWrapper > ul > li {
  overflow-x: hidden;
  -webkit-overflow-scrolling: auto;
}
#workView .listWrapper > ul > li[grayed],
#sidePanel .listWrapper > ul > li[grayed] {
  font-style: italic;
  opacity: .4;
}
#workView .listWrapper > ul > li[state=navigated],
#sidePanel .listWrapper > ul > li[state=navigated] {
  background: -webkit-linear-gradient(top left,#0067a3 0%,#002a82 100%) !important;
}
#workView .listWrapper > ul > li[state=saving],
#sidePanel .listWrapper > ul > li[state=saving] {
  background: -webkit-linear-gradient(top left,#ffc400 0%,#b06100 100%) !important;
}
#workView .listWrapper > ul > li[state=fail],
#sidePanel .listWrapper > ul > li[state=fail] {
  background: -webkit-linear-gradient(top left,#ff3d00 0%,#ff0000 100%) !important;
}
#workView .listWrapper > ul > li[state=selected],
#sidePanel .listWrapper > ul > li[state=selected] {
  background: -webkit-linear-gradient(top left,rgba(255,255,255,0.4) 0%,rgba(255,255,255,0) 100%) !important;
}
#workView .listWrapper > ul > li[outline=one] .content,
#sidePanel .listWrapper > ul > li[outline=one] .content {
  left: 40px;
}
#workView .listWrapper > ul > li[outline=two] .content,
#sidePanel .listWrapper > ul > li[outline=two] .content {
  left: 70px;
}
#workView .panel[mode=normal] .listWrapper > ul > li[navigationItem]:after,
#sidePanel .panel[mode=normal] .listWrapper > ul > li[navigationItem]:after {
  content: '';
  display: block;
  position: absolute;
  width: 40px;
  height: 40px;
  top: 50%;
  right: 0px;
  margin-top: -20px;
  background: url(../img/uiGlyphs/carved_arrowRight.png);
  background-position: right center;
  background-size: 40px 40px;
  background-repeat: no-repeat;
}
#workView .listWrapper > ul > li .item,
#sidePanel .listWrapper > ul > li .item {
  position: relative;
  top: 0px;
  bottom: 0px;
  left: 0px;
  right: 0px;
}
#workView .listWrapper > ul > li .icon140px,
#sidePanel .listWrapper > ul > li .icon140px {
  width: 90px;
  height: 70px;
  position: absolute;
  margin: 0px;
  padding: 0px;
  left: 25px;
  top: 50%;
  margin-top: -35px;
}
#workView .listWrapper > ul > li .itemContent140px,
#sidePanel .listWrapper > ul > li .itemContent140px {
  position: relative;
  top: 0px;
  left: 100px;
  right: 0px;
  min-height: 50px;
  padding-top: 20px;
}
#workView .listWrapper > ul > li .itemContent140px > div,
#sidePanel .listWrapper > ul > li .itemContent140px > div {
  position: relative;
  left: 0px;
  right: 0px;
}
#workView .listWrapper > ul > li .itemContent140px strong,
#sidePanel .listWrapper > ul > li .itemContent140px strong {
  font-weight: bold;
  font-size: 16px;
}
#workView .listWrapper > ul > li .itemContent140px em,
#sidePanel .listWrapper > ul > li .itemContent140px em {
  font-style: italic;
  font-size: 12px;
}
#workView .listWrapper > ul > li .itemSubheader,
#sidePanel .listWrapper > ul > li .itemSubheader {
  color: #FDE803;
  font-size: 10px;
  font-style: italic;
}
#workView .listWrapper > ul > li .indexColumn,
#sidePanel .listWrapper > ul > li .indexColumn {
  display: inline-block;
  vertical-align: top;
  font-style: italic;
  font-weight: normal;
  font-size: 12px;
  width: 20px;
  color: #d7ff9a;
  position: absolute;
  margin-left: -19px;
  margin-top: -2px;
  padding-top: 3px;
}
#workView .listWrapper > ul > li .column,
#sidePanel .listWrapper > ul > li .column {
  display: inline-block;
  vertical-align: top;
  word-wrap: break-word;
  font-weight: normal;
  margin-left: -4px;
}
#workView .listWrapper > ul > li .dataColumn,
#workView .listWrapper > ul > li .datacolumn,
#sidePanel .listWrapper > ul > li .dataColumn,
#sidePanel .listWrapper > ul > li .datacolumn {
  display: inline-block;
  vertical-align: top;
  color: #FDE803;
  text-align: center;
  margin-left: -4px;
}
#workView .listWrapper > ul > li .formdata,
#sidePanel .listWrapper > ul > li .formdata {
  display: inline-block;
  vertical-align: top;
  color: #FDE803;
  text-align: left;
  margin-left: -4px;
}
#workView .listWrapper > ul > li .outline0,
#sidePanel .listWrapper > ul > li .outline0 {
  font-weight: bold;
}
#workView .listWrapper > ul > li .outline1,
#sidePanel .listWrapper > ul > li .outline1 {
  padding-left: 40px;
}
#workView .listWrapper > ul > li .outline2,
#sidePanel .listWrapper > ul > li .outline2 {
  padding-left: 60px;
  font-style: italic;
}
#workView .listWrapper > ul > li .superscript,
#sidePanel .listWrapper > ul > li .superscript {
  font-size: xx-small;
  vertical-align: top;
}
#workView .listWrapper > ul > li .subscript,
#sidePanel .listWrapper > ul > li .subscript {
  font-size: xx-small;
  vertical-align: bottom;
}
#workView .listWrapper > ul > li .subnote,
#sidePanel .listWrapper > ul > li .subnote {
  font-size: xx-small;
  font-weight: bold;
  font-style: italicl;
}
#workView .listWrapper > ul > li .listDateItem,
#sidePanel .listWrapper > ul > li .listDateItem {
  width: 50px;
  height: 50px;
  position: absolute;
  margin: 0px;
  padding: 0px;
  left: 35px;
  top: 50%;
  margin-top: -25px;
  -webkit-border-radius: 10px;
  overflow: hidden;
  border: solid 3px white;
}
#workView .listWrapper > ul > li .listDateItem .head,
#sidePanel .listWrapper > ul > li .listDateItem .head {
  position: absolute;
  top: 0px;
  left: 0px;
  right: 0px;
  height: 17px;
  background-color: #FF0000;
  color: white;
  font-size: 14px;
  text-align: center;
  padding-top: 3px;
  font-weight: bold;
}
#workView .listWrapper > ul > li .listDateItem .body,
#sidePanel .listWrapper > ul > li .listDateItem .body {
  position: absolute;
  top: 20px;
  left: 0px;
  right: 0px;
  bottom: 0px;
  background-color: #EEE;
  color: black;
  font-size: 23px;
  text-align: center;
  font-weight: bold;
  padding-top: 2px;
}
#workView .listAddForm {
  left: 0px;
  right: 0px;
  margin: 3px;
  padding: 0px;
  background: -webkit-linear-gradient(top left,#0c8300 0%,#053e00 100%);
  -webkit-border-radius: 3px;
  z-index: 99999;
  min-height: 50px;
  border: solid 2px #bdff7b;
}
#workView .listAddForm[outline=one] {
  margin-left: 30px;
}
#workView .listAddForm[outline=two] {
  margin-left: 70px;
}
#workView .listAddForm[outline=one]:after,
#workView .listAddForm[outline=two]:after {
  content: ' ';
  height: 0;
  width: 0;
  position: absolute;
  border: 14px solid transparent;
  border-bottom-color: #bdff7b;
  top: -28px;
  left: 15px;
}
#workView .listEditForm {
  left: 0px;
  right: 0px;
  margin: 3px;
  padding: 0px;
  background: -webkit-linear-gradient(top left,#670086 0%,#24002f 100%);
  -webkit-border-radius: 3px;
  z-index: 99999;
  min-height: 50px;
  -webkit-transform: translate3d(0px,0px,0px);
  -webkit-transition: -webkit-transform 300ms ease-out;
  border: solid 2px #fd7bff;
}
#workView .listEditForm[outlinemode] {
  -webkit-transform: translate3d(70px,0px,0px);
}
#workView .listFormContent {
  display: block;
  position: relative;
  left: 0px;
  right: 0px;
  padding: 5px;
  margin: 0px;
  padding-left: 22px;
  vertical-align: top;
}
#workView .listFormToolbar {
  display: block;
  position: relative;
  left: 0px;
  right: 0px;
  height: 30px;
  padding: 0px;
  margin: 0px;
  padding-left: 20px;
  padding-right: 20px;
  border-top: solid 1px rgba(0,0,0,0.5);
  -webkit-box-shadow: inset 0px 1px 1px rgba(255,255,255,0.5);
  text-align: right;
  pointer-events: none;
}
#workView .listFormActionsToolbar {
  display: block;
  position: absolute;
  bottom: 0px;
  left: 0px;
  right: 0px;
  height: 30px;
  padding: 0px;
  margin: 0px;
  padding-left: 20px;
  padding-right: 20px;
  border-top: solid 1px rgba(0,0,0,0.5);
  -webkit-box-shadow: inset 0px 1px 1px rgba(255,255,255,0.5);
  text-align: left;
  pointer-events: none;
}
#workView .listFormMsgArea {
  display: block;
  position: relative;
  left: 0px;
  right: 0px;
  height: 16px;
  padding: 5px;
  margin: 0px;
  padding-left: 20px;
  color: white;
  font-size: 12px;
  font-style: italic;
}
#workView .listFormToolbar .toolbarBtn,
#workView .listFormActionsToolbar .toolbarBtn {
  height: 29px;
  line-height: 29px;
  border-left: solid 1px rgba(255,255,255,0.5);
  -webkit-box-shadow: inset 1px 0px 0px rgba(0,0,0,0.5);
  margin-top: 1px;
  pointer-events: auto;
  color: white;
}
#workView .listFormToolbar .toolbarBtn:last-child,
#workView .listFormActionsToolbar .toolbarBtn:last-child {
  border-right: solid 1px rgba(0,0,0,0.5);
  border-left: solid 1px rgba(255,255,255,0.5);
  -webkit-box-shadow: inset -1px 0px 0px rgba(255,255,255,0.5), inset 1px 0px 0px rgba(0,0,0,0.5);
  color: white;
}
#workNavigation .navigationWrapper {
  position: absolute;
  top: 0px;
  left: 0px;
  right: 0px;
  bottom: 40px;
  margin: 0px;
  padding: 0px;
  -webkit-overflow-scrolling: touch;
  overflow-y: auto;
  overflow-x: hidden;
  border-bottom: solid 1px rgba(0,0,0,0.5);
  -webkit-box-shadow: 0px 1px 0px rgba(255,255,255,0.3);
}
#workNavigation .navigationWrapper ul {
  margin: 0px;
  padding: 0px;
  position: absolute;
  top: 50px;
  left: 0px;
  right: 0px;
  height: auto;
  padding-bottom: 50px;
}
#workNavigation .navigationWrapper li {
  position: relative;
  left: 0px;
  right: 0px;
  height: 46px;
}
#workNavigation .navigationWrapper li[navigated] {
  background-color: rgba(0,0,0,0.1);
  -webkit-box-shadow: inset 0px 2px 2px rgba(0,0,0,0.2), inset 0px -2px 2px rgba(0,0,0,0.2);
}
#workNavigation .navigationWrapper li[state=hidden] {
  display: none;
}
#workNavigation .navigationWrapper .label {
  display: block;
  position: absolute;
  top: 0px;
  bottom: 0px;
  left: 40px;
  right: 5px;
  color: #000;
  padding-top: 15px;
  font-size: 14px;
  font-weight: normal;
  text-align: left;
  pointer-events: none;
}
#workNavigation .navigationWrapper .icon {
  display: block;
  position: absolute;
  top: 5px;
  bottom: 0px;
  left: 5px;
  width: 30px;
  padding: 3px;
  pointer-events: none;
}
#workNavigation .navigationWrapper .badge {
  display: block;
  position: absolute;
  width: 13px;
  height: 13px;
  line-height: 13px;
  top: 1px;
  right: 3px;
  color: #FFF;
  background-color: red;
  border: solid 1px white;
  text-align: center;
  font-size: 12px;
  font-weight: normal;
  padding: 1px;
  -webkit-border-radius: 5px;
  pointer-events: none;
}
#workNavigation .navigationWrapper .icon img {
  width: 30px;
  height: 30px;
  pointer-events: none;
}
#workNavigation .navigationWrapper li[no_icon] .icon {
  display: none;
}
#workNavigation .navigationWrapper li[no_icon] .label {
  left: 35px;
}
#workNavigation .navigationWrapper li[no_notification] .badge {
  display: none;
}
#workNavigation .homeViewBtn {
  position: absolute;
  bottom: 11px;
  left: 5px;
  right: 5px;
  text-align: center;
  font-size: 16px;
  color: black;
}
#sidePanel {
  position: absolute;
  top: 0px;
  bottom: 0px;
  right: 0px;
  width: 300px;
  background-color: white;
  -webkit-transition: -webkit-transform 500ms ease-out, opacity 500ms ease-out;
  -webkit-box-shadow: -10px 0px 10px rgba(0,0,0,0.7);
  -webkit-tap-highlight-color: rgba(0,0,0,0);
  -webkit-border-radius: 5px 0px 0px 5px;
}
#sidePanel .panel {
  right: 0px;
  background: -webkit-linear-gradient(top left,#091022 0%,#00314d 100%);
  background: -moz-linear-gradient(top left,#091022 0%,#00314d 100%);
  background: -o-linear-gradient(top left,#091022 0%,#00314d 100%);
  background: -ms-linear-gradient(top left,#091022 0%,#00314d 100%);
  background: linear-gradient(top left,#091022 0%,#00314d 100%);
  overflow: hidden;
}
#sidePanel .panel .header h1 {
  padding-left: 12px !important;
}
#sidePanel .panel .header h2 {
  font-family: Helvetica, sans-serif;
  font-size: 16px;
  margin: 0px !important;
  padding: 3px 5px 0px 12px !important;
  height: 20px !important;
}
#sidePanel .panel > .toolbar {
  background: -webkit-linear-gradient(top left,#5c6e8c 0%,#929db0 100%);
  background: -moz-linear-gradient(top left,#5c6e8c 0%,#929db0 100%);
  background: -o-linear-gradient(top left,#5c6e8c 0%,#929db0 100%);
  background: -ms-linear-gradient(top left,#5c6e8c 0%,#929db0 100%);
  background: linear-gradient(top left,#5c6e8c 0%,#929db0 100%);
}
#sidePanel .panel > .content {
  bottom: 40px !important;
}
#sidePanelBottomBar {
  position: absolute;
  right: 0px;
  bottom: 0px;
  left: 0px;
  height: 40px;
  margin: 0px;
  padding: 0px;
  overflow: hidden;
  border-top: solid 1px black;
  -webkit-box-shadow: inset 0px 1px 0px rgba(255,255,255,0.7);
  -webkit-border-radius: 0px 0px 0px 5px;
  background: -webkit-linear-gradient(top left,#5c6e8c 0%,#929db0 100%);
  background: -moz-linear-gradient(top left,#5c6e8c 0%,#929db0 100%);
  background: -o-linear-gradient(top left,#5c6e8c 0%,#929db0 100%);
  background: -ms-linear-gradient(top left,#5c6e8c 0%,#929db0 100%);
  background: linear-gradient(top left,#5c6e8c 0%,#929db0 100%);
}
#modalForm {
  position: absolute;
  top: 0px;
  bottom: 0px;
  left: 0px;
  right: 0px;
  background-color: rgba(0,0,0,0.5);
  -webkit-transition: -webkit-transform 500ms ease-out, opacity 500ms ease-out;
  -webkit-tap-highlight-color: rgba(0,0,0,0);
  min-height: 200px;
}
@media screen and (max-width: 600px) {
  #modalForm #modalFormWrapper {
    top: 20px;
    bottom: 20px;
    left: 2px;
    right: 2px;
  }
}
@media screen and (min-width: 600px) {
  #modalForm #modalFormWrapper {
    top: 20px;
    bottom: 20px;
    left: 50%;
    width: 600px;
    margin-left: -300px;
  }
}
#modalForm #modalFormWrapper {
  position: absolute;
  background-color: white;
  -webkit-transition: -webkit-transform 500ms ease-out, opacity 500ms ease-out;
  -webkit-box-shadow: 0px 0px 10px rgba(0,0,0,0.7);
  -webkit-tap-highlight-color: rgba(0,0,0,0);
}
#modalForm #modalFormContent {
  position: absolute;
  top: 40px;
  bottom: 41px;
  left: 0px;
  right: 0px;
  margin: 0px;
  padding: 20px;
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
}
#modalForm #modalFormContent form {
  position: relative;
  left: 0px;
  right: 0px;
  margin: 0px;
  padding: 0px;
  min-height: 100%;
}
#modalForm #modalFormMsg {
  display: none;
  position: absolute;
  left: 0px;
  right: 0px;
  bottom: 40px;
  margin: 0px;
  padding: 10px;
  font-size: 16px;
  color: #ff0000;
  font-style: italic;
  text-align: center;
  background-color: rgba(0,0,0,0.2);
}
#modalForm #modalFormMsg[state=active] {
  display: block;
}
#modalForm #modalFormBottomBar {
  position: absolute;
  right: 0px;
  bottom: 0px;
  left: 0px;
  height: 40px;
  margin: 0px;
  padding: 0px;
  overflow: hidden;
  border-top: solid 1px black;
  -webkit-box-shadow: inset 0px 1px 0px rgba(255,255,255,0.7);
  background-color: #DDD;
}
#modalForm #modalFormTopBar {
  position: absolute;
  right: 0px;
  top: 0px;
  left: 0px;
  height: 40px;
  margin: 0px;
  padding: 0px;
  overflow: hidden;
  border-bottom: solid 1px rgba(255,255,255,0.7);
  -webkit-box-shadow: inset 0px -1px 0px black;
  background-color: #DDD;
}
#modalForm #modalFormTitle {
  position: absolute;
  top: 0px;
  bottom: 0px;
  left: 0px;
  right: 0px;
  padding-top: 5px;
  font-size: 24px;
  color: #444;
  font-weight: normal;
  text-align: center;
}
#modalForm #modalFormContent .formInputWrapper {
  display: block;
  position: relative;
  left: 0px;
  right: 0px;
  margin: 10px 0px 10px 0px;
}
#modalForm #modalFormContent .formInputWrapper label {
  position: relative;
  left: 0px;
  right: 0px;
  color: #005fff;
  font-weight: normal;
}
#modalForm #modalFormContent .formInputWrapper input {
  position: relative;
  left: 0px;
  right: 0px;
  border: solid 1px #005fff;
  height: 36px;
}
#modalForm #modalFormContent .formInputWrapper textarea {
  position: relative;
  left: 0px;
  right: 0px;
  border: solid 1px #005fff;
  min-height: 36px;
}
#modalForm #modalFormContent .formInputWrapper .formLabel {
  position: relative;
  left: 0px;
  right: 0px;
  color: #888;
  text-align: left;
  font-style: normal;
  font-size: 14px;
}
#modalForm #modalFormWrapper:not([useRTE]) .formInputWrapper textarea {
  height: 30px;
}
#modalForm #modalFormWrapper[useRTE] #modalFormContent {
  top: 65px;
  bottom: 30px;
  overflow-y: hidden;
  -webkit-overflow-scrolling: none;
}
#modalForm #modalFormWrapper[useRTE] #modalFormContent form {
  position: absolute;
  left: 20px;
  right: 20px;
  top: 0px;
  bottom: 0px;
  margin: 0px;
  padding: 0px;
}
#modalForm #modalFormWrapper[useRTE] .formInputWrapper {
  position: absolute;
  top: 0px;
  bottom: 0px;
  left: 0px;
  right: 0px;
}
#modalForm #modalFormWrapper[useRTE] textarea,
#modalForm #modalFormWrapper[useRTE] .wysihtml5-sandbox {
  position: absolute !important;
  top: 18px !important;
  bottom: 40px !important;
  left: 0px !important;
  right: 0px !important;
  overflow-y: scroll !important;
  -webkit-overflow-scrolling: touch !important;
  border: solid 1px #005fff !important;
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  border-radius: 3px;
}
#modalForm #modalFormWrapper[useChooser] .formInputWrapper {
  right: 180px !important;
}
#modalForm #modalFormWrapper[useChooser] #dropboxBtn {
  position: absolute;
  top: 50%;
  right: 0px;
  width: 170px;
  margin: 10px 0px 10px 0px;
  padding: 0px;
  height: 30px;
  line-height: 30px;
  background: #0034ff;
  color: white;
  font-size: 16px;
  text-align: center;
  -webkit-border-radius: 10px;
  -moz-border-radius: 10px;
  border-radius: 10px;
}
#modalForm #modalFormWrapper[useChooser] #dropboxFilePreview {
  position: absolute;
  top: 50%;
  bottom: 50px;
  right: 0px;
  width: 170px;
  margin: 0px;
  padding: 0px;
  margin-top: 50px;
  padding-top: 5px;
  background: #ddd;
  color: black;
  font-size: 13px;
  font-style: italic;
  text-align: center;
  overflow-y: scroll !important;
  -webkit-overflow-scrolling: touch !important;
  -webkit-border-radius: 10px;
  -moz-border-radius: 10px;
  border-radius: 10px;
}
#modalForm #modalFormWrapper[useChooser] #dropboxFilePreview .preview {
  display: block;
  position: relative;
  left: 0px;
  right: 0px;
  margin: 0px;
  padding: 10px 5px 10px 5px;
  text-align: left;
}
#modalForm #modalFormWrapper[useChooser] #dropboxFilePreview .preview img {
  display: inline-block;
  width: 32px;
  vertical-align: middle;
}
#modalForm #modalFormWrapper[useChooser] #dropboxFilePreview .preview span {
  display: inline-block;
  vertical-align: middle;
  width: 120px;
}
#modalForm #modalFormWrapper:not([useCheckbox]) .checkboxGroup > h1 {
  display: none;
}
#modalForm #modalFormWrapper:not([useCheckbox]) .checkboxGroup > .formInputWrapper > .checkboxLabel {
  text-align: left !important;
  font-size: 14px !important;
  left: 115px !important;
  top: 12px !important;
  position: absolute !important;
  display: inline-block !important;
  width: 300px !important;
}
#modalForm #modalFormWrapper:not([useCheckbox]) .checkboxGroup > .formInputWrapper > .checkbox {
  display: inline-block !important;
}
#modalForm #modalFormWrapper[useCheckbox][useChooser] .checkboxGroup {
  bottom: 50%;
}
#modalForm #modalFormWrapper[useCheckbox][useRTE] .checkboxGroup {
  top: 18px;
  bottom: 50px;
}
#modalForm #modalFormWrapper[useCheckbox][useRTE][useChooser] .checkboxGroup {
  bottom: 50%;
}
#modalForm #modalFormWrapper[useCheckbox] .formInputWrapper {
  right: 180px !important;
}
#modalForm #modalFormWrapper[useCheckbox] .checkboxGroup {
  position: absolute;
  top: 0px;
  right: 0px;
  width: 170px;
  margin: 0px;
  padding: 0px;
  margin-top: 10px;
  padding-top: 5px;
  background: #ddd;
  color: black;
  font-size: 13px;
  font-style: italic;
  text-align: center;
  overflow-y: scroll !important;
  overflow-x: hidden !important;
  -webkit-overflow-scrolling: touch !important;
  -webkit-border-radius: 10px;
  -moz-border-radius: 10px;
  border-radius: 10px;
}
#modalForm #modalFormWrapper[useCheckbox] .checkboxGroup h1 {
  position: relative;
  left: 0px;
  right: 0px;
  margin: 0px;
  padding: 0px;
  height: 30px;
  line-height: 30px;
  font-size: 16px;
  font-weight: normal;
  color: #005fff;
}
#modalForm #modalFormWrapper[useCheckbox] .checkboxGroup .formInputWrapper {
  position: relative;
  text-align: left !important;
  margin-bottom: 6px;
  left: 5px;
}
#modalForm #modalFormWrapper[useCheckbox] .checkboxGroup .checkboxLabel {
  display: inline-block;
  vertical-align: middle;
  width: 100px !important;
  text-align: left !important;
  padding-left: 60px;
  color: black;
}
#modalForm #modalFormWrapper[useCheckbox] .checkboxGroup input {
  display: inline-block;
  vertical-align: middle;
  width: 2px !important;
  position: static;
}
#modalForm #modalFormWrapper[useCheckbox] .checkboxGroup input[type="checkbox"] + .checkbox {
  margin-top: -30px;
}
#modalForm #wysihtml5-toolbar {
  display: none;
  position: absolute;
  top: 47px;
  left: 0px;
  right: 0px;
  height: 20px;
  margin: 0px;
  padding: 0px;
  z-index: 1;
  text-align: center;
}
#modalForm #modalFormWrapper[useRTE] #wysihtml5-toolbar {
  display: block;
}
#modalForm #wysihtml5-toolbar .toolGroup {
  display: inline-block;
  margin: 0px 6px 0px 6px;
  padding: 0px;
  list-style: none;
}
#modalForm #wysihtml5-toolbar [data-wysihtml5-command],
#modalForm #wysihtml5-toolbar [data-wysihtml5-action] {
  position: relative;
  border: 1px solid #005fff;
  height: 20px;
  line-height: 20px;
  min-width: 12px;
  margin: 0px 2px 0px 2px;
  padding: 0px 3px 0px 3px;
  list-style: none;
  font-size: 12px;
  color: #005fff;
  display: inline-block;
  vertical-align: top;
  cursor: pointer;
  width: auto;
  text-decoration: none;
}
#modalForm #wysihtml5-toolbar [data-wysihtml5-command]:hover,
#modalForm #wysihtml5-toolbar [data-wysihtml5-action]:hover {
  background-color: #cbefff;
}
#modalForm #wysihtml5-toolbar .wysihtml5-action-active,
#modalForm #wysihtml5-toolbar .wysihtml5-command-active {
  background-color: #004381;
  color: white;
}
#modalForm #wysihtml5-toolbar .wysihtml5-commands-disabled [data-wysihtml5-command] {
  border: 1px solid #bebebe;
  color: #bebebe;
}
#modalForm #wysihtml5-toolbar [data-wysihtml5-command=bold] {
  font-weight: bold;
}
#modalForm #wysihtml5-toolbar [data-wysihtml5-command=italic] {
  font-style: italic;
}
#modalForm #wysihtml5-toolbar [data-wysihtml5-command=underline] {
  text-decoration: underline;
}
#modalForm #wysihtml5-toolbar [data-wysihtml5-command=formatBlock] {
  font-weight: bold;
}
#modalForm #wysihtml5-toolbar [data-wysihtml5-dialog] {
  position: absolute;
  top: 65px;
  left: 0px;
  right: 0px;
  color: #fff;
  font-size: 14px;
  text-align: left;
  border: 1px solid #ccc;
  padding: 5px 10px;
  background: #20222f;
  text-align: center;
  top: 45px;
}
#modalForm #wysihtml5-toolbar [data-wysihtml5-dialog] input {
  color: black;
  padding: 3px;
  width: 300px;
}
#modalForm #wysihtml5-toolbar [data-wysihtml5-dialog] input:focus {
  outline: 0;
  border: 1px solid #ffffff;
}
#modalForm #wysihtml5-toolbar [data-wysihtml5-dialog-action] {
  padding: 4px;
  color: black;
  cursor: pointer;
  font-size: 12px;
}
#modalForm #wysihtml5-toolbar [data-wysihtml5-dialog-action="save"] {
  background: #c9ff87;
}
#modalForm #wysihtml5-toolbar [data-wysihtml5-dialog-action="cancel"] {
  background: #ccc;
}
#tempAlert {
  display: block;
  position: absolute;
  top: 40%;
  left: 50%;
  width: 300px;
  min-height: 40px;
  margin-left: -150px;
  background-color: rgba(0,0,0,0.7);
  color: white;
  font-size: 16px;
  -webkit-border-radius: 10px;
  padding: 20px;
  -webkit-transition: -webkit-transform 500ms ease-out, opacity 500ms ease-out;
  text-align: center;
}
#tempAlert strong {
  font-size: 20px;
  font-weight: bold;
  color: #ffd900;
}
#permAlert {
  background-color: rgba(255,0,0,0.6);
  color: white;
  text-align: center;
}
#permAlert strong {
  font-size: 18px;
  font-weight: bold;
  color: #ffd900;
}
#modalAlert {
  position: absolute;
  top: 0px;
  left: 0px;
  right: 0px;
  bottom: 0px;
  background-color: rgba(0,0,0,0.5);
}
#modalAlertMsg {
  position: absolute;
  top: 40%;
  left: 20%;
  right: 20%;
  margin-top: -40px;
  color: white;
  font-size: 16px;
  text-align: center;
}
#modalAlertConfirmBtn {
  position: absolute;
  top: 40%;
  left: 50%;
  width: 100px;
  height: 26px;
  background-color: #ff003d;
  border: solid 1px white;
  color: white;
  text-align: center;
  font-size: 16px;
  padding-top: 8px;
  margin-left: -125px;
  margin-top: 40px;
}
#modalAlertCancelBtn {
  position: absolute;
  top: 40%;
  left: 50%;
  width: 100px;
  height: 26px;
  background-color: #333;
  border: solid 1px white;
  color: white;
  text-align: center;
  font-size: 16px;
  padding-top: 8px;
  margin-left: 25px;
  margin-top: 40px;
}
#modalFrame {
  position: absolute;
  top: 0px;
  bottom: 0px;
  left: 0px;
  right: 0px;
  background-color: rgba(0,0,0,0.5);
  -webkit-transition: -webkit-transform 500ms ease-out, opacity 500ms ease-out;
}
#frameWrapper {
  position: absolute;
  top: 0px;
  bottom: 61px;
  left: 15px;
  right: 15px;
  background-color: white;
  overflow: hidden;
  margin: 0px;
  padding: 0px;
  -webkit-overflow-scrolling: touch;
  overflow: scroll;
}
#frameWrapper > iframe {
  width: 100%;
  height: 100%;
  overflow: auto;
  -webkit-overflow-scrolling: touch;
  margin: 0px;
  padding: 0px;
}
#modalFrameBottomBar {
  position: absolute;
  right: 15px;
  bottom: 20px;
  left: 15px;
  height: 40px;
  margin: 0px;
  padding: 0px;
  overflow: hidden;
  border-top: solid 1px black;
  -webkit-box-shadow: inset 0px 1px 0px rgba(255,255,255,0.7);
  background-color: #DDD;
  -webkit-border-radius: 0px 0px 0px 5px;
}
.datePicker {
  position: absolute;
  top: 0px;
  left: 0px;
  right: 0px;
  bottom: 0px;
  -webkit-overflow-scrolling: touch;
  overflow-y: auto;
  overflow-x: hidden;
  -webkit-touch-callout: none;
  -webkit-user-select: none;
  -khtml-user-select: none;
  -moz-user-select: moz-none;
  -ms-user-select: none;
  user-select: none;
  cursor: default;
}
.datePicker .calendarToolbar {
  margin-left: 30px;
  margin-top: 10px;
  padding: 5px;
  width: 224px;
  overflow-y: auto;
}
.datePicker .calendarToolbar .btn {
  display: block;
  float: left;
  width: 30px;
  height: 25px;
  line-height: 25px;
  background-color: #FF0000;
  color: #FFF;
  margin: 5px;
  text-align: center;
  -webkit-border-radius: 15px;
  font-size: 14px;
  font-family: Helvetica, Tahoma, Arial, Sans-serif;
}
.datePicker .calendarToolbar .toolbarLabel {
  display: block;
  float: left;
  width: 50px;
  color: #000;
  margin: 5px;
  text-align: center;
}
.datePicker .calendarToolbar .toolbarLabel h1 {
  font-size: 18px;
  color: white;
  margin: 0px;
  padding: 0px;
}
.datePicker .calendarToolbar .toolbarLabel h2 {
  font-size: 14px;
  color: rgba(255,255,255,0.6);
  margin: 0px;
  padding: 0px;
}
.datePicker .calendarHeader {
  margin-left: 30px;
  margin-top: 5px;
  padding: 5px;
  width: 224px;
  overflow-y: auto;
}
.datePicker .calendarHeader ul {
  display: block;
  width: 100%;
  float: left;
  margin: 0px;
  padding: 0px;
}
.datePicker .calendarHeader ul li {
  display: block;
  width: 20px;
  height: 20px;
  float: left;
  border-style: none;
  color: white;
  margin: 0px;
  padding: 6px;
  text-align: center;
}
.datePicker .calendarWrapper {
  margin-left: 30px;
  margin-top: 0px;
  padding: 5px;
  width: 224px;
  background-color: rgba(255,255,255,0.3);
  overflow-y: auto;
}
.datePicker .calendarWrapper ul {
  display: block;
  width: 100%;
  float: left;
  margin: 0px;
  padding: 0px;
}
.datePicker .calendarWrapper ul li {
  display: block;
  width: 20px;
  height: 20px;
  float: left;
  border-style: solid;
  border-width: 1px;
  border-color: rgba(255,255,255,0.7);
  background-color: #FFF;
  color: #000;
  margin: 0px;
  padding: 5px;
  text-align: center;
}
.datePicker .calendarWrapper ul .enabledBox:hover {
  background-color: #F8EED4;
}
.datePicker .calendarWrapper ul .selectedDate {
  background-color: #FAB60C;
}
.datePicker .calendarWrapper ul .disabledBox {
  border-style: solid;
  border-width: 1px;
  border-color: rgba(255,255,255,0.5);
  background-color: rgba(255,255,255,0);
}
.dataExplorer {
  position: absolute;
  top: 0px;
  left: 0px;
  right: 0px;
  bottom: 0px;
  -webkit-overflow-scrolling: touch;
  overflow-y: scroll;
  overflow-x: hidden;
  -webkit-touch-callout: none;
  -webkit-user-select: none;
  -khtml-user-select: none;
  -moz-user-select: moz-none;
  -ms-user-select: none;
  user-select: none;
  cursor: default;
}
.dataExplorer .dataExplorerTitle {
  position: relative;
  left: 0px;
  right: 0px;
  margin: 0px;
  padding: 5px;
  line-height: 40px;
  height: 40px;
  font-size: 18px;
  font-weight: normal;
  color: #fff;
  text-align: center;
  text-overflow: ellipsis;
  white-space: nowrap;
  overflow: hidden;
}
.dataExplorer .dataExplorerTitle .subtitle {
  font-size: 11px;
  font-weight: normal;
}
.dataExplorer .collection {
  position: relative;
  left: 0px;
  right: 0px;
  margin: 0px;
  padding: 5px;
  padding: 0px;
  border-bottom: solid 1px #ffd900;
  text-align: center;
}
.dataExplorer .set {
  display: none;
  vertical-align: top;
  width: auto;
  min-width: 30px;
  margin: 5px 5px 0px 5px;
  padding: 0px 5px 0px 5px;
  color: black;
  background-color: rgba(255,255,255,0.7);
  font-size: 12px;
  line-height: 30px;
  height: 30px;
  text-align: center;
  -webkit-border-radius: 5px 5px 0px 0px;
  -moz-border-radius: 5px 5px 0px 0px;
  border-radius: 5px 5px 0px 0px;
}
.dataExplorer .set[state=visible] {
  display: inline-block;
}
.dataExplorer .set[state=hidden] {
  display: none;
}
.dataExplorer .set[selected] {
  background-color: #ffd900;
}
.dataExplorer .selectables {
  position: relative;
  left: 0px;
  right: 0px;
  margin: 0px;
  padding: 5px;
  padding: 0px;
  border-bottom: solid 1px rgba(255,255,255,0.7);
  text-align: center;
}
.dataExplorer .selectable {
  display: none;
  vertical-align: top;
  width: auto;
  margin: 5px;
  padding: 0px;
  text-align: center;
  width: 80px;
}
.dataExplorer .selectable[state=visible] {
  display: inline-block;
}
.dataExplorer .selectable[state=hidden] {
  display: none;
}
.dataExplorer .selectableLabel {
  width: 80px;
  height: 80px;
  -webkit-border-radius: 40px;
  -moz-border-radius: 40px;
  border-radius: 40px;
  background-color: #ff6d1f;
  color: white;
  line-height: 80px;
  text-align: center;
  font-size: 16px;
  font-weight: bold;
}
.dataExplorer .selectableOption {
  display: none;
  width: 80px;
  height: 30px;
  line-height: 30px;
  background-color: #afc7ff;
  color: black;
  margin-top: 5px;
  font-size: 13px;
}
.dataExplorer .selectableOption[state=visible] {
  display: block;
}
.dataExplorer .selectableOption[state=hidden] {
  display: none;
}
.dataExplorer .selectableOption[selected] {
  background-color: #ffd900;
  color: black;
}
.dataExplorer .actionButtonsWrapper {
  position: relative;
  left: 0px;
  right: 0px;
  margin: 0px;
  padding: 5px;
  padding: 0px;
  background-color: rgba(255,226,79,0.2);
  border-bottom: solid 1px rgba(255,255,255,0.7);
  text-align: center;
}
.dataExplorer .actionButtonsWrapper[state=visible] {
  opacity: 1;
}
.dataExplorer .actionButtonsWrapper[state=hidden] {
  opacity: .5;
  pointer-events: none;
}
.dataExplorer .dataExplorerBtn {
  display: block;
  left: 0px;
  right: 0px;
  margin: 0px;
  padding: 0px;
  margin-top: 5px;
  margin-bottom: 5px;
  height: 40px;
  line-height: 40px;
  background-color: #ffd900;
  font-size: 16px;
  color: black;
  text-align: center;
}
.dataExplorer .dataExplorerBtn[state=visible] {
  display: block;
}
.dataExplorer .dataExplorerBtn[state=hidden] {
  display: none;
}
.dataExplorer .dataExplorerBtn[notInUse] {
  display: none;
}
.dataExplorer .processPreview {
  position: relative;
  left: 0px;
  right: 0px;
  margin: 0px;
  padding: 10px;
  border-bottom: solid 1px rgba(255,255,255,0.7);
  text-align: center;
  min-height: 30px;
  font-size: 13px;
  font-weight: normal;
  color: #98c9d1;
  text-align: left;
}
.dataExplorer .processPreview strong {
  color: white;
  font-size: 16px;
  font-weight: bold;
}
.dataExplorer .dataPreviewList {
  position: relative;
  left: 0px;
  right: 0px;
  margin: 0px;
  padding: 0px;
  border-bottom: solid 1px rgba(255,255,255,0.7);
  text-align: center;
  list-style: none;
  display: block;
}
.dataExplorer .dataPreviewList > li {
  position: relative;
  left: 0px;
  right: 0px;
  margin: 0px;
  padding: 10px;
  border-bottom: solid 1px rgba(255,255,255,0.3);
  text-align: left;
  display: none;
  font-size: 13px;
  font-weight: normal;
  color: #98c9d1;
  min-height: 24px;
  line-height: 24px;
}
.dataExplorer .dataPreviewList > li strong {
  color: white;
  font-size: 16px;
  font-weight: bold;
}
.dataExplorer .dataPreviewList > li .gcardPrevCol1 {
  display: inline-block;
  vertical-align: middle;
  color: #b6f0ff;
  font-size: 13px;
  font-weight: normal;
  width: 155px;
  margin: 2px;
}
.dataExplorer .dataPreviewList > li .gcardPrevCol1 .sub {
  color: #597997;
  line-height: 12px;
  font-size: 11px;
  font-weight: normal;
  font-style: italic;
}
.dataExplorer .dataPreviewList > li .gcardPrevCol2 {
  display: inline-block;
  vertical-align: middle;
  color: white;
  font-size: 16px;
  font-weight: bold;
  width: 90px;
  margin: 2px;
  padding: 0px;
}
.dataExplorer .dataPreviewList > li[state=visible] {
  display: block;
}
.dataExplorer .dataPreviewList > li[state=hidden] {
  display: none;
}
.postedMsg {
  background-color: white;
  padding: 30px;
  margin-top: 10px;
  pointer-events: auto;
  max-width: 650px;
}
.list li[navigationItem][grayed] .postedMsg {
  opacity: .7;
}
.list li[navigationItem] .postedMsg {
  margin-right: 25px;
  pointer-events: none;
}
.wysihtml5-editor,
.postedMsg {
  font-size: 14px !important;
  color: #666 !important;
  font-weight: normal;
}
.wysihtml5-editor h1,
.postedMsg h1 {
  font-size: 28px;
  margin: 2px 0px 14px 0px;
  padding: 0px;
  color: #000;
  font-weight: normal;
}
.wysihtml5-editor h2,
.postedMsg h2 {
  font-size: 22px;
  margin: 2px 0px 8px 0px;
  padding: 0px;
  color: #000;
  font-weight: normal;
}
.wysihtml5-editor h3,
.postedMsg h3 {
  font-size: 18px;
  margin: 2px 0px 8px 0px;
  padding: 0px;
  color: #333;
  font-weight: normal;
}
.wysihtml5-editor i,
.postedMsg i {
  font-style: italic;
  color: #52005a;
}
.wysihtml5-editor b,
.postedMsg b {
  color: #000;
  font-weight: bold;
}
.wysihtml5-editor u,
.postedMsg u {
  color: #000;
  font-weight: normal;
  text-decoration: underline;
}
.wysihtml5-editor a,
.postedMsg a {
  display: inline-block;
  text-decoration: none;
  color: white;
  font-weight: normal;
  background-color: #0030ff;
  -webkit-border-radius: 10px;
  -moz-border-radius: 10px;
  border-radius: 10px;
  padding: 0px 14px 0px 14px;
  height: 18px;
  line-height: 18px;
  margin: 2px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.wysihtml5-editor .listData,
.postedMsg .listData {
  list-style: none;
}
.wysihtml5-editor .postedItemData[outline=one],
.postedMsg .postedItemData[outline=one] {
  margin-left: 40px;
}
.wysihtml5-editor .postedItemData[outline=two],
.postedMsg .postedItemData[outline=two] {
  margin-left: 70px;
}
.wysihtml5-editor .postedItemData,
.postedMsg .postedItemData {
  border-bottom: solid 1px #BBB;
  padding: 5px;
}
.wysihtml5-editor .listItemHeader,
.postedMsg .listItemHeader {
  display: inline-block;
  vertical-align: middle;
  width: 200px;
  font-weight: normal;
  font-size: 14px;
  color: #444;
  padding: 5px;
}
.wysihtml5-editor .listItemHeader,
.postedMsg .listItemData {
  display: inline-block;
  vertical-align: middle;
  font-weight: bold;
  font-size: 16px;
  color: black;
  padding: 5px;
}
.wysihtml5-editor img,
.postedMsg img {
  display: block;
  width: 100%;
  margin: auto;
}
.postedMsg .downloads {
  display: block;
  margin: 15px;
  padding: 10px;
  margin-top: 30px;
  padding-bottom: 15px;
  border: solid 1px #CCC;
  -webkit-border-radius: 5px;
  background-color: #EEE;
}
.postedMsg .downloads > li {
  display: block;
  position: relative;
  left: 0px;
  right: 0px;
  height: 30px;
  padding-top: 10px;
  padding-bottom: 10px;
}
.postedMsg .downloads > li .imgContainer {
  width: 70px;
  display: inline-block;
  text-align: center;
  vertical-align: middle;
  background-color: #DDD;
  -webkit-border-radius: 5px;
  margin-right: 5px;
}
.postedMsg .downloads > li .imgContainer img {
  height: 30px;
  margin: 5px;
}
.postedMsg .downloads > li .icon {
  position: absolute;
  top: 3px;
  left: 3px;
  width: 32px;
  height: 32px;
  display: block;
  vertical-align: middle;
  padding: 0px;
}
.postedMsg .downloads > li .icon img {
  width: 32px;
  height: 32px;
  margin: 0px;
}
.postedMsg .downloads > li .filename {
  position: relative;
  top: 3px;
  left: 40px;
  right: 3px;
  margin-right: 40px;
  font-style: italic;
  display: inline-block;
}
.postedMsg .downloads > li a {
  text-decoration: none;
  color: #444;
  font-size: 14px;
}