@charset "UTF-8";
/* CSS Document */

 html, body {
		 height:100%;
		 min-width:inherit !important;
	 }
	 a {
		 cursor:pointer;
	 }
.header, .footer {
zoom:1 !important;
width:100%;	
}
	 #classCanvas {
min-height: 100%;

width: 100%;
padding:10px;
margin: 0 auto;
}
.draggable_student {
	background:url(s_icon.png) center center no-repeat;
}
* html #classCanvas {
height: 100%;
}
#connectInfo {
	font-size:.8em;
	color:#333;
	padding:0px;
	margin-top:10px;
	width:100px; text-align:center;
}
div.hasDatepicker {
	display: block;
	padding: 0;
	overflow: visible;
	margin: 8px 0;
	max-width:340px
}
.ui-datepicker {
	overflow: visible; margin: 0;
}
.ui-datepicker .ui-datepicker-header {
	position:relative;
	padding:.6em 0;
	border-bottom: 0;
	font-weight: bold;
}
.ui-datepicker .ui-datepicker-prev,
.ui-datepicker .ui-datepicker-next {
	padding: 1px 0 1px 2px;
	position:absolute;
	top: .6em;
	margin-top: 0;
	text-indent: -9999px;
	-webkit-border-radius: 1em;
	border-radius: 1em;
	vertical-align: middle;
	margin-right: .625em;
	width: 1.75em;
	height: 1.75em;
	white-space: nowrap !important;
}
.ui-datepicker .ui-datepicker-prev:after,
.ui-datepicker .ui-datepicker-next:after {
	left: 50%;
	margin-left: -11px;
	top: 50%;
	margin-top: -11px;
	content: "";
	position: absolute;
	display: block;
	width: 22px;
	height: 22px;
	background-color: rgba(0,0,0,.3) /*{global-icon-disc}*/;
	background-position: center center;
	background-repeat: no-repeat;
	-webkit-border-radius: 1em;
	border-radius: 1em;
}
.ui-datepicker .ui-datepicker-next:after{
	background-image: url("data:image/svg+xml;charset=US-ASCII,%3C%3Fxml%20version%3D%221.0%22%20encoding%3D%22iso-8859-1%22%3F%3E%3C!DOCTYPE%20svg%20PUBLIC%20%22-%2F%2FW3C%2F%2FDTD%20SVG%201.1%2F%2FEN%22%20%22http%3A%2F%2Fwww.w3.org%2FGraphics%2FSVG%2F1.1%2FDTD%2Fsvg11.dtd%22%3E%3Csvg%20version%3D%221.1%22%20id%3D%22Layer_1%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20xmlns%3Axlink%3D%22http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink%22%20x%3D%220px%22%20y%3D%220px%22%20%20width%3D%2214px%22%20height%3D%2214px%22%20viewBox%3D%220%200%2014%2014%22%20style%3D%22enable-background%3Anew%200%200%2014%2014%3B%22%20xml%3Aspace%3D%22preserve%22%3E%3Cpolygon%20fill%3D%22%23FFF%22%20points%3D%2214%2C7%207%2C0%207%2C5%200%2C5%200%2C9%207%2C9%207%2C14%20%22%2F%3E%3Cg%3E%3C%2Fg%3E%3Cg%3E%3C%2Fg%3E%3Cg%3E%3C%2Fg%3E%3Cg%3E%3C%2Fg%3E%3Cg%3E%3C%2Fg%3E%3Cg%3E%3C%2Fg%3E%3Cg%3E%3C%2Fg%3E%3Cg%3E%3C%2Fg%3E%3Cg%3E%3C%2Fg%3E%3Cg%3E%3C%2Fg%3E%3Cg%3E%3C%2Fg%3E%3Cg%3E%3C%2Fg%3E%3Cg%3E%3C%2Fg%3E%3Cg%3E%3C%2Fg%3E%3Cg%3E%3C%2Fg%3E%3C%2Fsvg%3E");
}
.ui-datepicker .ui-datepicker-prev:after{
	background-image: url("data:image/svg+xml;charset=US-ASCII,%3C%3Fxml%20version%3D%221.0%22%20encoding%3D%22iso-8859-1%22%3F%3E%3C!DOCTYPE%20svg%20PUBLIC%20%22-%2F%2FW3C%2F%2FDTD%20SVG%201.1%2F%2FEN%22%20%22http%3A%2F%2Fwww.w3.org%2FGraphics%2FSVG%2F1.1%2FDTD%2Fsvg11.dtd%22%3E%3Csvg%20version%3D%221.1%22%20id%3D%22Layer_1%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20xmlns%3Axlink%3D%22http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink%22%20x%3D%220px%22%20y%3D%220px%22%20%20width%3D%2214px%22%20height%3D%2214px%22%20viewBox%3D%220%200%2014%2014%22%20style%3D%22enable-background%3Anew%200%200%2014%2014%3B%22%20xml%3Aspace%3D%22preserve%22%3E%3Cpolygon%20fill%3D%22%23FFF%22%20points%3D%227%2C5%207%2C0%200%2C7%207%2C14%207%2C9%2014%2C9%2014%2C5%20%22%2F%3E%3Cg%3E%3C%2Fg%3E%3Cg%3E%3C%2Fg%3E%3Cg%3E%3C%2Fg%3E%3Cg%3E%3C%2Fg%3E%3Cg%3E%3C%2Fg%3E%3Cg%3E%3C%2Fg%3E%3Cg%3E%3C%2Fg%3E%3Cg%3E%3C%2Fg%3E%3Cg%3E%3C%2Fg%3E%3Cg%3E%3C%2Fg%3E%3Cg%3E%3C%2Fg%3E%3Cg%3E%3C%2Fg%3E%3Cg%3E%3C%2Fg%3E%3Cg%3E%3C%2Fg%3E%3Cg%3E%3C%2Fg%3E%3C%2Fsvg%3E");
}
.ui-datepicker .ui-datepicker-prev {
	left:9px;
}
.ui-datepicker .ui-datepicker-next {
	right:2px;
}
.ui-datepicker .ui-datepicker-title {
	margin: 0 2.3em;
	line-height: 1.8em;
	text-align: center;
}
.ui-datepicker .ui-datepicker-title select {
	font-size:.8em; margin:1px 0;
}
.ui-datepicker select.ui-datepicker-month-year {
	width: 100%;
}
.ui-datepicker select.ui-datepicker-month,
.ui-datepicker select.ui-datepicker-year {
	width: 49%;
}
.ui-datepicker table {
	width: 100%;
	border-collapse: collapse;
	margin:0;
	font-size:.8em;
}
.ui-datepicker td {
	border-width: 1px;
	padding: 0;
	border-style: solid;
	text-align: center;
	min-width: 41px;
}
.ui-datepicker td span,
.ui-datepicker a {
	display: block;
	text-align: center;
	text-decoration: none;
	/* from .ui-btn class */
	font-size: 12px;
	position: relative;
	text-overflow: ellipsis;
	overflow: hidden;
	white-space: nowrap;
	cursor: pointer;
	-webkit-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
	text-decoration: none !important;
	font-weight: bold;
	border-width: 1px;
	border-style: solid;
}
.ui-datepicker td a {
	padding: .2em 0;
	font-weight: bold;
	margin: 0;
	border-width: 0;
}
.ui-datepicker-calendar th {
	padding-top: .4em;
	padding-bottom: .4em;
	border-width: 1px;
	border-style: solid;
}
.ui-datepicker-calendar th span,
.ui-datepicker-calendar span.ui-state-default {
	opacity: .7;
}
.ui-datepicker-calendar td a,
.ui-datepicker-calendar td span {
	padding: .6em .5em;
}
.ui-datepicker .ui-state-disabled {
	opacity: 1;
}
.ui-datepicker.ui-corner-all,
.ui-datepicker .ui-datepicker-header.ui-corner-all {
	border-radius: 0;
	-webkit-border-radius: 0;
}


/*!
* jQuery Mobile Datepicker Wrapper 1.4.2
http://uglymongrel.com.com
*
* Copyright Alexander Schmitz and other contributors
* Released under the MIT license.
* http://uglymongrel.com.org/license
*
*/

/* Globals */
.ui-datepicker,
.ui-datepicker .ui-datepicker-next,
.ui-datepicker .ui-datepicker-prev {
	/* ui-shadow */
	-webkit-box-shadow: 0 1px 3px /*{global-box-shadow-size}*/ rgba(0,0,0,.15) /*{global-box-shadow-color}*/;
	-moz-box-shadow: 0 1px 3px /*{global-box-shadow-size}*/ rgba(0,0,0,.15) /*{global-box-shadow-color}*/;
	box-shadow: 0 1px 3px /*{global-box-shadow-size}*/ rgba(0,0,0,.15) /*{global-box-shadow-color}*/;
}
/* Swatches */
/* A
-----------------------------------------------------------------------------------------------------------*/
html .ui-overlay-a .ui-datepicker td span,
html .ui-overlay-a .ui-datepicker a,
html .ui-body-a .ui-datepicker td span,
html .ui-body-a .ui-datepicker a,
.ui-page-theme-a .ui-datepicker td span,
.ui-page-theme-a .ui-datepicker a {
	/* ui-btn-a */
	background-color: #f6f6f6 /*{a-bup-background-color}*/;
	border-color: #ddd /*{a-bup-border}*/;
	color: #333 /*{a-bup-color}*/;
	text-shadow: 0 /*{a-bup-shadow-x}*/ 1px /*{a-bup-shadow-y}*/ 0 /*{a-bup-shadow-radius}*/ #f3f3f3 /*{a-bup-shadow-color}*/;
}
html body .ui-datepicker .ui-state-highlight {
	/* ui-btn-down */
	background-color: #e8e8e8 /*{a-bdown-background-color}*/;
	border-color: #ddd /*{a-bdown-border}*/;
	color: #333 /*{a-bdown-color}*/;
	text-shadow: 0 /*{a-bdown-shadow-x}*/ 1px /*{a-bdown-shadow-y}*/ 0 /*{a-bdown-shadow-radius}*/ #f3f3f3 /*{a-bdown-shadow-color}*/;
}
html body .ui-datepicker .ui-state-active {
	/* ui-btn-active */
	background-color: #3388cc /*{a-active-background-color}*/;
	border-color: #3388cc /*{a-active-border}*/;
	color: #fff /*{a-active-color}*/;
	text-shadow: 0 /*{a-active-shadow-x}*/ 1px /*{a-active-shadow-y}*/ 0 /*{a-active-shadow-radius}*/ #005599 /*{a-active-shadow-color}*/;
}
.ui-datepicker td,
.ui-datepicker .ui-datepicker-header {
	/* ui-body-a */
	border-color: #ddd /*{a-body-border}*/;
	background-color: #fff /*{a-body-background-color}*/;
	color: #333 /*{a-body-color}*/;
	text-shadow: 0 /*{a-body-shadow-x}*/ 1px /*{a-body-shadow-y}*/ 0 /*{a-body-shadow-radius}*/ #f3f3f3 /*{a-body-shadow-color}*/;
}

.ui-datepicker th {
	/* ui-bar-a */
	background-color: #e9e9e9 /*{a-bar-background-color}*/;
	border-color: #ddd /*{a-bar-border}*/;
	color: #333 /*{a-bar-color}*/;
	text-shadow: 0 /*{a-bar-shadow-x}*/ 1px /*{a-bar-shadow-y}*/ 0 /*{a-bar-shadow-radius}*/ #eee /*{a-bar-shadow-color}*/;
	font-weight: bold;
}
/*!
* jQuery Mobile Datepicker Wrapper 1.4.2
http://uglymongrel.com.com
*
* Copyright Alexander Schmitz and other contributors
* Released under the MIT license.
* http://uglymongrel.com.org/license
*
*/

/* Globals */
.ui-datepicker,
.ui-datepicker .ui-datepicker-next,
.ui-datepicker .ui-datepicker-prev {
	/* ui-shadow */
	-webkit-box-shadow: /*{global-box-shadow-size}*/ /*{global-box-shadow-color}*/;
	-moz-box-shadow: /*{global-box-shadow-size}*/ /*{global-box-shadow-color}*/;
	box-shadow: /*{global-box-shadow-size}*/ /*{global-box-shadow-color}*/;
}
/* Swatches */
/* A
-----------------------------------------------------------------------------------------------------------*/
html .ui-overlay-a .ui-datepicker td span,
html .ui-overlay-a .ui-datepicker a,
html .ui-body-a .ui-datepicker td span,
html .ui-body-a .ui-datepicker a,
.ui-page-theme-a .ui-datepicker td span,
.ui-page-theme-a .ui-datepicker a {
	/* ui-btn-a */
	background-color: /*{a-bup-background-color}*/;
	border-color: /*{a-bup-border}*/;
	color: /*{a-bup-color}*/;
	text-shadow: /*{a-bup-shadow-x}*/ /*{a-bup-shadow-y}*/ /*{a-bup-shadow-radius}*/ /*{a-bup-shadow-color}*/;
}
html body .ui-datepicker .ui-state-highlight {
	/* ui-btn-down */
	background-color: /*{a-bdown-background-color}*/;
	border-color: /*{a-bdown-border}*/;
	color: /*{a-bdown-color}*/;
	text-shadow: /*{a-bdown-shadow-x}*/ /*{a-bdown-shadow-y}*/ /*{a-bdown-shadow-radius}*/ /*{a-bdown-shadow-color}*/;
}
html body .ui-datepicker .ui-state-active {
	/* ui-btn-active */
	background-color: /*{a-active-background-color}*/;
	border-color: /*{a-active-border}*/;
	color: /*{a-active-color}*/;
	text-shadow: /*{a-active-shadow-x}*/ /*{a-active-shadow-y}*/ /*{a-active-shadow-radius}*/ /*{a-active-shadow-color}*/;
}
.ui-datepicker td,
.ui-datepicker .ui-datepicker-header {
	/* ui-body-a */
	border-color: /*{a-body-border}*/;
	background-color: /*{a-body-background-color}*/;
	color: /*{a-body-color}*/;
	text-shadow: /*{a-body-shadow-x}*/ /*{a-body-shadow-y}*/ /*{a-body-shadow-radius}*/ /*{a-body-shadow-color}*/;
}

.ui-datepicker th {
	/* ui-bar-a */
	background-color: /*{a-bar-background-color}*/;
	border-color: /*{a-bar-border}*/;
	color: /*{a-bar-color}*/;
	text-shadow: /*{a-bar-shadow-x}*/ /*{a-bar-shadow-y}*/ /*{a-bar-shadow-radius}*/ /*{a-bar-shadow-color}*/;
	font-weight: bold;
}



.ui-listview > .ui-li-divider {
background: #5e87b0;
   
    color: #fff;
    font-weight: bold;
    text-shadow: 0 1px 0 #3e6790;
}
#classfieldContainer > .ui-controlgroup-controls > .ui-input-text {
	padding:4px !important;
	width:87% !important;
}
#classfieldContainer > .ui-controlgroup-controls {
	width:100% !important;
}

.three-quarter {
	width:75%;
}
.one-quarter {
	width:25%;
}
.half {
	width:50%;
}
.halfminus {
	width:40%;
}
.halfplus {
	width:60%;
}
.third {
	width:33%;
}
.left {
	float:left;
}
.right {
	float:right;
}
.content-left {
	float:left;
}
.content-right {
	float:right;
}
.ui-popup {
	min-width:480px !important;
}
#hometools {
	font-size:80%;
}
.ui-header .mobMenu {
	display:none;
}
.show-mobile {
	display:none;
}
.hide {
	display:none;
}
.btn-active {
	background-color: #38C !important;
border-color: #38C !important;
color: white !important;
text-shadow: none !important;
}
#imageShow, #imageShow1, #imageShow2, #imageShow3, #imageShow4, #imageShow5 {
	text-align:center;
}
.loadImage {
	text-align:center;
	width:auto;
	margin:auto;
	max-width:500px;
	max-height:600px;
}
.bound {
	cursor:pointer;
}
.expand {
	cursor:pointer;
	
}
.enlargeComplete {
	max-width:400px;
	max-height:600px;
	width:auto;
	float:none;
	margin:auto;
	margin-bottom:20px;	
}
.enlargeWait {
	max-width:70px;
	max-height:70px;
	float:left;
	margin:0;
	margin-right:20px;	
}
.listImage {
	max-width:70px !important; 
	margin:8px; 
	max-height:70px !important;
}
.ui-header {
	left: 0;
right: 0;
width: 100%;
position: fixed;
z-index: 1000;
min-height: 2.5em;
}
.ui-page {
	padding-top:2.8em !important;
}

.ui-listview {
	-webkit-box-shadow:none;
-moz-box-shadow:none;
box-shadow:none;

}
.ui-listview li {
	border:#ddd 1px solid;
}
.ui-overlay-a, .ui-page-theme-a, .ui-page-theme-a .ui-panel-wrapper {
	
}
h1 {
	color:#444;
}
h2 {
	color:#333;
}
.ui-popup h1 {
	font-size: 1.8em;
	padding-bottom:8px;
	border-bottom:#85BB56 1px solid;
}
.round {
	border-radius: 0px;
-moz-box-shadow:none;
-webkit-box-shadow:none;
-moz-border-radius:0px;
-webkit-border-radius:0px;
background-color: #F3F9ED /*{a-page-background-color}*/;
}
#hometools .round {
	background-color:rgba(255, 255, 255, 0.7) !important;
	border-radius: 8px!important;
		
-moz-box-shadow: 0 0px 4px 0 #6F6F6F!important;
-webkit-box-shadow: 0 0px 4px 0px #6F6F6F!important;
-moz-border-radius: 8px!important;
-webkit-border-radius: 8px!important;
}
@media (max-width:900px) {
.mobile-full-home {
	width:auto !important;
	float:none;
}
#hometools {
	font-size:100%;
}

.show-mobile {
	display:block !important;
}
.hide-mobile {
	display:none !important;
}

.ui-header .headerMenu .ui-btn {
	font-size:95%;
	margin-left:0px !important;
	margin-right:0px !important;
}
.ui-popup-container {
max-width:530px !important;
}
}
@media (max-width:680px) {
.ui-popup-container {
max-width:475px !important;
}
.ui-header .headerMenu {
	float: none;
clear: both;
margin: 0px;
text-align: right;
width: auto;
background-color: #4784B6;
border-radius: 0 0 8px 8px;
display: none;
box-shadow: #CCC 0px 1px 0px .5px;
margin-left: auto;
margin-right: auto;
position: absolute;
right: 0;
top: 40px;
padding:4px;
z-index:20;
border-radius:0;
}
.ui-header .mobMenu {
	display:block;
}
.ui-header .headerMenu .ui-btn-icon-left::after, .ui-header .headerMenu .ui-btn-icon-right::after, .ui-header .headerMenu .ui-btn-icon-top::after, .ui-header .headerMenu .ui-btn-icon-bottom::after, .ui-header .headerMenu .ui-btn-icon-notext::after {
display:none;	
}
.ui-header .headerMenu .ui-btn {
	font-size:100%;
	padding-left:8px;
	padding-right:8px;
	margin-left:3px !important;
	margin-right:3px !important;
	margin-top:3px !important;
	margin-bottom:3px !important;
}
}
@media (max-width: 580px) {
	.ui-popup-container {
max-width:400px !important;
}
.listImage {
max-width: 70px !important;
margin: 8px;
max-height: 100px !important;
}
.content-left {
	float:none;
}
.formFloat {
min-width: 45% !important;
border: none !important;
vertical-align: top !important;
margin: 0px !important;
margin-bottom:10px !important;
display: inline-block !important;
}
.enlargeComplete {
	max-width:400px;
	max-height:500px;
	width:auto;
	float:none;
	margin:auto;
	margin-bottom:20px;	
}
.loadImage {
	max-width:500px;
	max-height:500px;
}
.enlargeWait {
	max-width:70px;
	max-height:70px;
	float:left;
	margin:0;
	margin-right:20px;	
}

.no-margin-top {
	margin-top:0 !important;
}


.mobile-li {
	font-size:90%;
}
.mobile-h2 {
	font-size:80%;
}

.mobile-padding {
padding-left:1% !important;
padding-right:1% !important;
width:96% !important;	
}

.punchSet::after {
	display:none;
}

#tabs {
	display:none;
}
#recentA {
	display:none;
}
.content-right {
	float:none;
}
.ui-popup {
min-width:260px !important;	
padding:10px !important;
font-size:90% !important;
}
#studentCanvas, #classCanvas, #classCanvas2, #timeCanvas, #guardianCanvas, #timeCanvas2, #guardianCanvas2 {
	width:auto !important;
	padding:10px !important;
	margin:0 !important;
}
.round {
	border-radius:0 !important;
	box-shadow:none !important;
}

.ui-popup .content-screen {

padding:10px !important;

}
.ui-popup:first-child {

padding:0px !important;
padding-top:10px !important;
}
.ui-popup li {

padding:6px !important;

}
#tabs .mobile-li img {
	max-height:55px !important;
	max-width:55px !important;
}
#tabs .ui-li-has-thumb .ui-btn {
	padding-left:5.55em !important;
}
#tabs .ui-li-has-thumb .ui-btn-icon-left {
padding-left:3em !important;	
}
.topLogo {
	margin-top:0px !important;
}
#loginForm {
padding-top: .9em !important;
}
.round .ui-btn-right {
float:none;
position:relative;
left:inherit;
right:inherit !important;
margin-bottom:20px;
top:inherit !important;
}
.mobile-full {
display:block;
	float:none;
}
.enlarge-h2 {
	font-size:150% !important;
	padding-top:8px;
	margin-bottom:0px !important; margin-top:0px !important;
}
 .ui-content .ui-li-aside {
float:none;
position:relative;
left:inherit !important;
margin-top:10px;
right:inherit !important;
top:inherit !important;
 }
  .ui-content .ui-li-aside a {
	  font-size:90%;
  }
  .ui-content h1 {
	font-size:1.6em !important;  
  }
   .ui-content h1 img{
	   max-height:36px !important;
	   max-width:36px !important;
   }
   .formFloat {
	   float:none;
	   margin:0;
	   width:auto;
	   padding:0;
   }
  .punchSet .listImage {
max-width: 40px !important;
margin: 8px;
max-height: 60px !important;
}	
.time-h2 {
	font-size:1.0em !important;
	overflow:auto !important;
	white-space:normal !important;
	min-height:60px;
	
}	
   .ui-controlgroup-horizontal .ui-controlgroup-controls {
display: block;
vertical-align: top;
   }
   .mobile-center {
	   text-align:center;
   }
}
@media (max-width:480px) {
	.enlargeComplete {
	max-width:380px;
	max-height:400px;
	width:auto;
	float:none;
	margin:auto;
	margin-bottom:20px;	
}
.loadImage {
	max-width:380px;
	max-height:380px;
}
.ui-popup-container {
max-width:350px !important;
}	
}
@media (max-width:380px) {
	.enlargeComplete {
	max-width:300px;
	max-height:300px;
	width:auto;
	float:none;
	margin:auto;
	margin-bottom:20px;	
}
.loadImage {
	max-width:300px;
	max-height:300px;
}
.ui-header .ui-btn-left .ui-btn {
	font-size:100%;
}
.ui-header .headerMenu {
	min-width:260px;
}
.ui-header .headerMenu .ui-btn {
	padding:10px !important;
	width:auto;
	display:block;
	font-size:1.2em !important;
	border-radius:0 !important;
	position:relative;
	margin-top:0px !important;
	margin-bottom:0px !important;
	margin-left:0px !important;
	margin-right:0px !important;
}	
.ui-header .headerMenu .ui-btn-icon-left::after, .ui-header .headerMenu .ui-btn-icon-right::after, .ui-header .headerMenu .ui-btn-icon-top::after, .ui-header .headerMenu .ui-btn-icon-bottom::after, .ui-header .headerMenu .ui-btn-icon-notext::after {
display:block;	
}
.ui-popup-container {
max-width:285px !important;
}
}