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

/*home*/
#homecntblocks {
	position: absolute;
	top: 0;
	left: 0;
	margin: 65px 0 0 80px;
	width: 520px;
}

#hardwork {
	width: 100%;
	margin-bottom: 4%;
}

#hardwork img {
	width: 100%;
}

#homeblocks {
	width: 100%;
	height: 563px;
}

#homeblocks:after {
	content: "";
	display: block;
	clear: both;	
}

#logoblock {
	width: 300px; 
	margin-right: 13px;
	padding: 30px;
	height: 563px;
	background-color: rgba(255,255,255,.95);
	display: block;
	float: left;
	z-index: 1000;
}

img#logomain {
	width: 100%;
	height: auto;
	margin-bottom: 25px; 
}

#buslogos {
	width: 100%;
}

div#buslogoscroll {
	width: 100%;
	height: 115px;
	overflow: hidden;
	text-align: center;
	background-color: #ffffff;
	padding: 13px 0px;
	vertical-align: middle;
}

#buslogoscroll img {
	height: auto;
	width: 180px;
	margin: 13px 0px;	
}

#homeformblock {
	width: 207px;
	height: 100%;
	display: block;
	float: left;
}

/*bus portal*/
/*form fields*/
#codeform {
	width: 250px;
	margin: 70px auto 0 auto;
}

#codeform input {
width: 100%;
padding: 2px 5px;
height: 23px;
margin-bottom: 8px;
background-color: #ffffff;
border: none;
font-family: Helvetica, sans-serif;
font-size: 14px;
text-align: center;
color: #000000;
}

/*buttons*/
#codeform button {
width: 100px;
height: 23px;
padding: 2px 5px;
cursor: pointer;
font-family: Helvetica, sans-serif;
font-size: 14px;
color: #ffffff;
border: 1px solid #c56426;
background-color: #ee7830;
}

#codeform button:hover {
-moz-transform: scale(1.1);
  -ms-transform: scale(1.1);
  -o-transform: scale(1.1);
  -webkit-transform: scale(1.1);
  transform: scale(1.1);	
}

/*redemption*/
#redempstats {
width: 100%;
max-width: 800px;
padding: 25px;
margin: 70px auto;
background-color: #ffffff;
border: 9px solid #01aef0;
-webkit-box-shadow: 5px 5px 21px 0px rgba(0,0,0,.17);
-moz-box-shadow: 5px 5px 21px 0px rgba(0,0,0,.17);
-o-box-shadow: 5px 5px 21px 0px rgba(0,0,0,.17);
-ms-box-shadow: 5px 5px 21px 0px rgba(0,0,0,.17);
box-shadow: 5px 5px 21px 0px rgba(0,0,0,.17);
}

.redempbox {
width: 21.951219512195% /*90/410*/;
height: 120px;
padding-top: 25px;
margin-right: 04.065040650407% /*16.66666666666667/410*/;
border: 1px solid #e2e4e5;
float: left;
-moz-border-radius: 5px;
-ms-border-radius: 5px;
-o-border-radius: 5px;
-webkit-border-radius: 5px;
border-radius: 5px;
}

#cancbox {
	margin-right: 0;
}

#redempstats:after {
	content: "";
	display: block;
	clear: both;
}

/*about*/
#aboutcnt img {
	margin: 20px 0 30px 0;
	width: 100%;
	max-width: 625px;
	
}

#aboutcnt p {
	margin: 0 auto;
	padding: 0 10%;
	max-width: 800px;
	min-width: 200px;
	
}

/*abt 2*/
.forthecol {
	float: left;
	width: 21%;
	padding: 0 2%;
	overflow: visible;
	text-align: center;
	z-index: 998;
}

.forthecol h5 {
	margin-bottom: 15px;
	white-space: nowrap;
}

#studentscirc, #teacherscirc, #parentscirc, #businessescirc {
width: 200px;
height: 200px;
background-repeat: no-repeat;
background-size: 100%;
margin: 0 auto 30px auto;
}

#studentscirc:hover, #teacherscirc:hover, #parentscirc:hover, #businessescirc:hover  {
-moz-transform: scale(1.2);
  -ms-transform: scale(1.2);
  -o-transform: scale(1.2);
  -webkit-transform: scale(1.2);
  transform: scale(1.2);	
}

#studentscirc {
background-image: url(../images/studentscirc.svg);

}

#teacherscirc {
background-image: url(../images/teacherscirc.svg);
	
}

#parentscirc {
background-image: url(../images/parentscirc.svg);
	
}

#businessescirc {
	background-image: url(../images/businesscirc.svg);
}

/*rewards*/
.rewpanhalf {
	width: 50%; 
	float: left;
	min-width: 300px;
}

/*registration placeholder*/
#regbannercal, #regbannertype {
	float: left;
}

#regbannercal{
	width: 30%;
	margin-right: 2%;
}

#regbannercal img {
	width: 100%;
}

#regbannertype{
	width: 63%;
}

#regbannertype a {
	color: #666666;
	border-bottom: 1px dotted #666666;
	text-decoration: none;	
}

#regbannertype a:visited {
}

#regbannertype a:hover, #regbannertype a:focus, #regbannertype a:active {
	color: #ee7830;
	border-bottom: 1px dotted #ee7830;
}

/*registration*/
.regthird {
	float: left;
	width: 31.026528258362% /*896.66666666666667/2890*/;
}

#userinfo {padding-right: 03.460207612457% /*100/2890*/;}
#persinfo {padding-right: 01.730103806228% /*50/2890*/;}
#schoolinfo {padding-left: 01.730103806228% /*50/2890*/;}


input#city, #persinfo .custom-dropdownBlue {
	float: left;
	width: 35%;
	display: block;
}

#persinfo .customSelect {
	width: 100%;
	display: block;
}


#city {
margin-right: 04.460966542751% /*40/896.66666666666667*/;
}

#selectschool, #teachstud {
float: left;
width: 100%;
margin-bottom: 8px;
display: block;
}

#selectschool .customSelect, #teachstud .customSelect {
	width: 100%;
	display: block;
}

.regthird input {
width: 100%;
margin-bottom: 8px;
}

#userinfo p, #persinfo p, #schoolinfo p {
	text-align: left;
	font-style: italic;
	padding-bottom: 6px;
}

#regpancnt .smbtn {
	margin-top: 86px;
	width: 100px;	
	float: right;
}

/*my points*/
#pointscirccont {
	width: 100%;	
}

#pointscirccont:after {
	content: "";
	display: block;
	clear: both;
}

.pointscirc {
	width: 25%;
	float: left;
	cursor:pointer;
}

a#myclasses, a#enrollinclass, a#viewassign, a#myrewards {
display: block;
margin: 0 auto;
height: 115px;
width: 200px;
padding-top: 85px;
text-decoration: none;
background-position: center;
background-repeat: no-repeat;
background-size: contain;	
}

a#myclasses {
background-image: url(../images/myclasses.svg);
}

a#enrollinclass {
background-image: url(../images/enrollclass.svg);
}

a#viewassign {
background-image: url(../images/viewassignments.svg);
}

a#myrewards {
background-image: url(../images/viewredrew.svg);		
}

a#myclasses:hover, a#enrollinclass:hover, a#viewassign:hover, a#myrewards:hover {
-moz-transform: scale(1.1);
-ms-transform: scale(1.1);
-o-transform: scale(1.1);
-webkit-transform: scale(1.1);
transform: scale(1.1);	
}

/*manage profile*/
#manageinnerwrap {
	max-width: 458px;
	margin: 0 auto;
}

#userinfomanage, #managebtns {
	float: left;
}

#userinfomanage {
display: block;
background-color: #ffffff;
width: 48%;
margin-right: 4%;
padding: 15px 0;
}

#managebtns {
	width: 48%;
}

#changepassbtn {
	margin-bottom: 12px;
}

/*main infographic*/
#stars, #stars img {
	width: 100%;
	display: block;
	margin: 0px 0 20px 0;
}

#infographicwrap, .igrow {
width: 100%;
display: block;
}

#igstudrow, #igteachrow, #igparentrow {
	border-bottom: 1px solid rgba(255,255,255,.25);
	padding-bottom: 20px;
}

#igteachrow, #igparentrow, #igbusrow {
	padding-top: 20px;
}

.igsubtitle, .igcnt{
	float: left;
	display: block;
}

.igsubtitle {
	width: 25%;
	height: 100%;
}

.igcnt {
	width: 75% /*750*/;
	height: 100%;
}

.igcell, .igarrow, #igtrophy {
	float: left;
	display: block;
	height: 100%;
}

/*arrows*/
.igarrow {
	height: 70px;
	background-repeat: no-repeat;
	background-position: center 20px;
	width: 5.333333333333%; /*40px/750*/
}

#igstudcellrow1 .igarrow {
	background-image: url(../images/yellow-triangle.png);
}

#igstudcellrow2 .igarrow {
	background-image: url(../images/yellow-triangle-left.png);
}

#yellowdownleft {
	padding-bottom: 20px;
	background-image: url(../images/yellow-triangle-downleft.png);
	background-repeat: no-repeat;
	background-position: bottom left;
}

#igteachrow .igarrow {
	background-image: url(../images/orange-triangle.png);
}

#igparentrow .igarrow {
	background-image: url(../images/blue-triangle.png);
}

#igbusrow .igarrow {
	background-image: url(../images/green-triangle.png);
}
/*end arrows*/

/*student row*/
#igstudcellrow1 .igcell {
	width: 21%/*157.5/750*/;	
}

#igstudcellrow2 .igcell {
	width: 21%;
}

#igstudcellrow2 #studcell1 {
	margin-left: 40.3333333333335%;
	padding-top: 20px;
	background-image: url(../images/yellow-triangle-upleft.png);
	background-repeat: no-repeat;
	background-position: top left;
}

#igstudcellrow2 #studcell2 {
	margin-right: 12.3333333333335%;
	padding-top: 20px;
}

#igstudcellrow2 .yellowarrowleft {
	background-position: center 40px;
}
/*end student row*/

/*teacher row*/
#igteachrow .igcell {
	width: 15.733333333333%/*118/750*/;	
}

/*parent row*/
#igparentrow .igcell {
	width: 15.733333333333%/*118/750*/;
}

/*business row*/
#igbusrow .igcell, #igtrophy {
	width: 21%/*157.5/750*/;
}

#igtrophy {
	margin-left: 5.333333333333%; /*40px/750*/
}

#igtrophy img {
	width: 100%;
}

/*infographic clears*/
#igstudrow:after, #igstudcellrow1:after, #igstudcellrow2:after, #igteachrow:after, #igparentrow:after, #igbusrow:after, .igcnt:after {
	clear: both;
	display: block;
	content: "";
}


















/*points system infographic*/
.psstudheadorange, .psstudheadgreen, .psstudheadblue, .psteachheadorange, .psteachheadgreen, .psteachheadblue, .psteachheadpink {
	width: 100%;
	height: 50px;	
}

.psstudheadorange, .psteachheadorange {
border: 1px solid #c56426;
background-color: #ee7830;
}

.psstudheadgreen, .psteachheadgreen {
border: 1px solid #3b9a47;
background-color: #13cf56;
}

.psstudheadblue, .psteachheadblue {
border: 1px solid #2690be;
background-color: #01aef0;
}

.psteachheadpink {
border: 1px solid #DA639B;
background-color: #ff6bb9;
}

.psgradeorange, .psgradegreen, .psgradeblue, .studpointval, .teachpointvalorange, .teachpointvalgreen, .teachpointvalblue, .teachpointvalpink, .peruploadtxt {
	float: left;
	height: 100%;
	display: block;	
}

.psgradeorange, .psgradegreen, .psgradeblue, .psgradepink, .teachpointvalorange, .teachpointvalgreen, .teachpointvalblue, .teachpointvalpink {
	background-position: center right;
	background-repeat: no-repeat;
	background-size: 11px 16px;		
}

.psgradeorange, .teachpointvalorange {
	background-image: url(../images/orange-triangle.png);
}

.psgradegreen, .teachpointvalgreen {
	background-image: url(../images/green-triangle.png);
}

.psgradeblue, .teachpointvalblue{
	background-image: url(../images/blue-triangle.png);
}

.teachpointvalpink {
	background-image: url(../images/pink-triangle.png);
}


/*student points system infographic*/
.studentpointscol {
	width: 30%;/*300/1000*/
	margin-right: 5%; /*50/1000*/
	height: 400px;
	float: left;
}

#assignstudpts {
	margin-right: 0;
}

.studpointsbox {
	width: 130px/*130/300*/;
	height: 80px;
	display: block;	
	margin: 25px auto 0px auto;
}

.psgradeorange, .psgradegreen, .psgradeblue, .psgradepink {
	width: 55%;	
}

.studpointval  {
	width: 45%;
	text-align: center;	
	padding-left: 10px;
}

.studpointval:after {
	clear: both;
	content: "";
	display: block;
}

/*teacher points system infographic*/
.teacherpointscol {
	width: 21.25%;/*212.5/1000*/
	margin-right: 5%; /*50/1000*/
	height: 200px;
	float: left;
}

#studyteachpts {
	margin-right: 0;
}

.teachpointsbox {
	width: 100%;
	max-width: 200px;
	height: 100px;
	display: block;	
	margin: 25px auto 0px auto;
	
}

.teachpointvalorange, .teachpointvalgreen, .teachpointvalblue, .teachpointvalpink  {
	width: 32%;
	text-align: center;	
	padding-right: 20px;
}

.teachpointvalorange:after, .teachpointvalgreen:after, .teachpointvalblue:after, .teachpointvalpink:after {
	clear: both;
	content: "";
	display: block;
}

.peruploadtxt {
	width: 68%;
	padding-left: 20px;
}

/*my classes & individual classes*/
.classescol1, .classescol2 {
	float: left;
	height: auto;
}

.classescol1 {
	width: 30%;/*300/1000*/
	margin-right: 5%;/*50/1000*/ 
}

.classescol2 {
	width: 65%;/*650/1000*/
}

#classlist, .viewupcomingassign {
	margin-bottom: 50px;
}

.classdetbox {
	display: block;
	float: left;
	width: 46.153846153846% /*300/650*/;
	margin-bottom: 50px;
	height: 245px;
}

.classdetbox:nth-of-type(odd) {
margin-right: 7.692307692308% /*50/650*/;
}

#mainclassimg {
	height: 200px;
	background-image:url(../images/mainclassimg.jpg);
	margin-bottom: 50px;
}

.viewgradesimg, .viewstudyguidesimg, .createassgnsubgradeimg, .manageclassrosterimg {
	height: 190px;
}

.viewgradesimg {
	background-image:url(../images/viewgradesmain.jpg);
}

.viewstudyguidesimg {
	background-image:url(../images/viewstudyguidesmain.jpg);
}

.createassgnsubgradeimg {
	background-image:url(../images/createassgnsubgrademain.jpg);
}

.manageclassrosterimg{
	background-image:url(../images/managerostermain.jpg);
}

/*rewards center*/
#rewcentpancnt input:first-of-type {
	width: 40%;
	margin-right: 2%;
	background-image: url(../images/magicon.png);
	background-position: right center;
	background-repeat: no-repeat;
}

#rewardsboxwrap {
	margin-top: 50px;
	width: 100%;
}

.rewardbox {
display: block;
float: left;
width: 23%;
margin: 0 2% 10px 0;
height: 380px;
padding: 80px 2.65% 0 2%;
overflow: hidden;
background-image: url(../images/notemag@2x.png);
background-position: top;
background-size: cover;
background-repeat: no-repeat;
}

.rewardbox img{
	width: 100%;
	margin-bottom: 10px;
}

#rewardsboxwrap:after {
	content: "";
	display: block;
	clear:both;
	height: 10px;
}


/*rewards center details*/
.rewardboxlg {
width: 100%;
max-width: 800px;
padding: 140px 6.5% 30px 5%;
background-image: url(../images/notemaglg@2x.png);
background-position: top;
background-size: cover;
background-repeat: no-repeat;
overflow: hidden;
}

.rewardboxlg p {	
font-size: 15px;
margin-bottom: 15px;
line-height: 19px;
}

.rewardinfo {
	width: 100%;
	display: block;
	
}

.rewardinfo:after {
	content: "";
	display: block;
	clear: both;
	margin-bottom: 30px;
}

.rewarddetcol {
width: 50%;
display: block;
float: left;
}

.rewarddetcol:first-of-type {
padding-right: 5%;
}

.rewardlogo {
	width: 100%;
	margin-bottom: 15px;
}

.rewarddet2ndrow {
	width: 100%;
	display: block;
}