.ui-mobile-viewport, .ui-page {
  background-color:#e6e6e6 !important;
}

div.ui-page {
  margin:15px;
}

.ui-overlay-a, .ui-page-theme-a, .ui-page-theme-a .ui-panel-wrapper {
  text-shadow:none !important;
}

span.fa { font-size:3em; }

.main { width:100%; }

.container-fluid label {
  display: block;
  margin-left: auto;
  margin-right: auto;
  min-height: 32px;
  line-height: 32px;
  padding-left: 10px;
  padding-right: 10px;
  border-radius: 4px;
  background-color: #D9E8E7;
  color:#333;
  text-align: center;
  cursor: pointer;
  font-weight:normal;
}
.container-fluid label span {
  line-height: 1.2;
  vertical-align: middle;
  display: inline-block;
}
.container-fluid label:hover,
.container-fluid label:active {
  background-color: #16A9B0;
  color:#FFF;
}
.container-fluid .checked label {
  background-color: #16A9B0;
  color:#FFF;
}

td.mtext, td.qtext { font-size:1.2em; }

.cell.hvcell, .cell_error.hvcell,
.cell.checked, .cell_error.checked { background-color:#16A9B0; }

.nav-btn {
	text-align:left;
	width: 220px;
}

.progress-wrapper {
	text-align: right;
	vertical-align: middle;
}

.progress {
	margin-left: auto;
	margin-right: 0px;
}

.progress-bar { background-color:#304691; }

label > input { display:none; }
label, .vtext { display:block; text-align:center; width:100%; }
.checked .vtext {
	color:#FFF;
	background:#16A9B0;
	font-weight:bold;
}

label ~ input[type="text"] { width:98%; }

.date {
	font-family:monospace;
	font-weight:bold;
	color:#16A9B0;
}

.navbar, .progress { margin-bottom:0; }


@media (min-width: 415px) {
	.fluidgrid .canvas, .fluidgrid .canvas tbody { display:block; }
	.fluidgrid .canvas tr, .fluidgrid .canvas td { display:inline-block; }
}

@media (max-width: 736px) and (orientation: landscape) {
	body { margin:0; padding:0; }
        div.ui-page { margin:0; }

	body, .ui-mobile-viewport, .ui-page {
		background:white !important;
	}

	#conteneur {
		width:100%;
		max-width: auto; 
		height: 100%; 
		margin: 0; 
		padding: 0; 
		-webkit-box-shadow: none; 
		box-shadow: none; 
		-webkit-border-radius: 0; 
		border-radius: 0; 
	}

	#main { margin-left:0; }

	.blk { padding:10px; }
}

@media (max-width: 414px) {
	body { margin:0; padding:0; }
        div.ui-page { margin:0; }

	body, .ui-mobile-viewport, .ui-page {
		background:white !important;
	}

	#conteneur {
		width:100%;
		max-width: auto; 
		height: 100%; 
		margin: 0; 
		padding: 0; 
		-webkit-box-shadow: none; 
		box-shadow: none; 
		-webkit-border-radius: 0; 
		border-radius: 0; 
	}

	#main { margin-left:0; }

	.navbar,
	.navbar > tbody,
	.navbar > tbody > tr,
	.nav-btn,
	.progress-wrapper,
	.nav { display:block; }

	.nav-btn, .progress-wrapper, .progress { width:100%; text-align:center; }

	.nav-btn { padding:0; }

	.nav { height:auto; margin:2px; width:99%; }

	.progress { margin:0; }
	.progress-wrapper { padding:0; }

	td.mtext, td.qtext { text-align:justify; }
	td.qbody { padding-bottom:1em; }

	div.perror { margin:0; }

	.blk { padding:5px; text-align:justify; }

	.canvas { width:100%; }
} 

@media (min-width: 426px) {
	#canvas_q26 { width:100%; }
}

@media (min-width: 500px) {
	#canvas_q26 { width:80%; }
}

@media (min-width: 800px) {
	#canvas_q26 { width:60%; }
}

@media (min-width: 1000px) {
	#canvas_q26 { width:50%; }
}