*{margin:0;padding:0;border:0;}
body{font-family: Verdana, Arial, sans-serif;font-size: 13px;background-color: white; -webkit-box-sizing:border-box; -ms-box-sizing:border-box; }

.header{width:100%; min-width:640px; height:46px; position:relative; background:black; color: white;font-weight: normal; border-bottom: 1px solid #333;}
  
.header .pearson{position:absolute;left:30px;}
.header .cmp3{position:absolute; left:220px; font:bold 18px verdana; line-height:46px; color:#DBFDED;;}
.header .back{position:absolute; right:50px; height:30px; margin-top:8px;}
.header .logininfo{position:absolute; right:200px; font:14px; color:white; line-height:46px; background:transparent;}

.pageheader{-moz-box-shadow: 0px 2px 2px #BBB;-webkit-box-shadow: 0px 2px 2px #BBB;box-shadow: 0px 2px 2px #BBB;
  width:100%; min-width:640px; height:46px; position:relative; background:url(theme/grayheader.png) 0 0 repeat-x; color: white;font-weight: normal;}
  
.pageheader .pearson{position: absolute;left: 30px;top: 8px;height: 30px;}
.pageheader .cmp3{position:absolute; left:220px; font:bold 18px verdana; line-height:46px; color:#DBFDED;}
.pageheader .back{position:absolute; right:50px; height:30px; margin-top:8px;}
.pageheader .logininfo{position:absolute; right:200px; font:14px; color:white; line-height:46px; background:transparent;}

.allgradeunits{ margin:50px 25px; font:14px verdana; color:#444; }

.loginform{width:640px; height:360px; position:relative;  overflow:hidden; left:0; right:0; margin:auto; margin-top:100px; background: rgba(254, 252, 169, 0.3);  }
.uploadform{width:640px; height:360px; position:relative;  overflow:hidden; left:0; right:0; margin:auto; margin-top:100px; background: rgba(254, 252, 169, 0.6);  }

#updateAllScosBtn{background:red; color:white; }

.scoUpdateConfirm, .massupdatetable{position:absolute; width:760px; height:640px; left:0; right:0; margin:auto; top:50px; margin-top:40px; background:#222; color:#e7e7e7;
  padding:25px; -webkit-border-top-right-radius: 15px; -webkit-border-bottom-right-radius: 15px; -moz-border-radius-topright: 15px;
  -moz-border-radius-bottomright: 15px; border-top-right-radius: 15px; border-bottom-right-radius: 15px;
  -webkit-box-shadow: 5px 5px 10px rgba(50, 50, 50, 0.85); -moz-box-shadow:5px 5px 10px rgba(50, 50, 50, 0.85); box-shadow:5px 5px 10px rgba(50, 50, 50, 0.85);}

.scoUpdateConfirm > * {font:18px Helvetica; padding:5px 25px; line-height:40px;}

#progressbar{position:absolute; bottom:150px; width:80%; height:20px; line-height:20px; left:0; right:0; margin:auto; background:gray;
  -webkit-border-radius: 15px; -moz-border-radius: 15px; border-radius: 15px;}

.progress-label{position:absolute; z-index:2; color:#fcfcf3; font:18px Georgia; top:0; left:0; height:20px; line-height:30px; padding-left:50px; }

.ui-progressbar-value{margin-top:0; margin-left:0; top:0; left:0; position:absolute; }
.ui-widget-header{background:#0080ff;}

#updateconfirm, #updatecancel{position:absolute; bottom:50px; font: 20px Georgia; height:30px; line-height:30px; width:120px; text-align:center; background:#eee; cursor:pointer;
  -webkit-border-radius: 15px; -moz-border-radius: 15px; border-radius: 15px;}
#updateconfirm{left:150px; color:green;}
#updatecancel{right:150px; color:gray;}

.container, .projectconfirm{position:relative; padding:50px 120px;}
.loginlabel{font:24px Georgia; color:#00a800; }
#loginid, #loginpsw, #loginbtn{margin-top:20px;}
#loginbtn{margin-left:60px; width:100px; font:normal 14px Georgia; color:#304588;}

.loginwelcome{font:18px Georgia; margin-left:-70px; margin-bottom:20px; width:380px; padding-right:25px; line-height:30px;}

#continue{cursor:pointer; margin-left:20px; margin-top:30px; height:40px;  }

.uploadIntro{font:18px verdana; color:#444; padding:0; position:relative; margin-top:25px; }

#browseExcelUploader{margin-top:0px; margin-left:10px;}

#scolist{width:640px; position:relative; left:0; right:0; margin-left:auto; margin-right:Auto; margin-top:50px;
 font:18px verdana; line-height:25px;}

p#instruction{margin-bottom:5px;}
p#fullscolist, p#warning{margin-bottom:15px; font-size:smaller; }

.loginerror{margin:30px -80px; color:red; font:bold;}

.error, #deletesco{position:relative; width:1000px; left:0; right:0; margin:30px auto 15px auto;}
#deletefloatbox{text-align:right; float:right; font:normal 13px Verdana; padding-bottom:15px;}
#deleteerror{margin-right:20px; color:red; }
input#deletescoid{width:125px;}
input#deleteScoBtn{width:50px; cursor:pointer; background:yellow;}
img#closedelpopup{position:absolute; top:10px; right:5px; z-index:2; }

img#spin{ margin-bottom:5px; margin-left:260px; }

div.gradeunitscolist{position:relative; width:1000px; left:0; right:0; margin-left:auto; margin-right:auto; margin-top:30px;
  font:bold 18px Verdana; text-align:center;}

div.gradeunitscolist >select{display:inline; margin-left:20px; font:bold 18px Verdana; width:120px;}

#scotable{clear:both; position:relative; width:1000px; left:0; right:0; margin-left:auto; margin-right:auto; margin-top:50px; }
table#gradeunitscotable{font:13px Verdana; width:1000px; text-align:center;}

table#gradeunitscotable > thead{margin-top:25px;}

select, input{border:solid 1px gray; background-color:#eee;}

span#csvCreate{text-align:left; line-height:30px; margin-left:50px; background:url(theme/excel.png) 100% 50% no-repeat; padding-right:50px; color:#397518; cursor:pointer;}
span#csvDownload{text-align:left; margin-left:50px; color:red; cursor:pointer;  line-height:30px;}
a#csvDownload{display:inline; text-decoration:none; padding-left:50px; color:red;  background:url(theme/next.png) 0 50% no-repeat;}

/**JQuery Reveal Styles **/
#deletemodalpopup {visibility:hidden;	width:480px;	height:240px;	padding:8px;	background:rgba(0,0,0,.8);
	-webkit-border-radius:8px;	-moz-border-radius:8px;	border-radius:8px;
	position:absolute; top:150px; left:0; right:0; margin:auto;
	z-index:101;
}

#scoSectionJsonEditor{
	position:absolute; top:50px; left:0; right:0; margin:auto; width:800px; min-height:320px; background: white;
	padding: 50px;
	-webkit-border-radius:8px;	-moz-border-radius:8px;	border-radius:8px;
  z-index:101; visibility:hidden;
}

#heading {	width:100%;	height:44px; position:absolute; top:8px; left:0;

	background-image: -webkit-linear-gradient(top, rgb(249, 249, 249), rgb(233, 233, 233));
	background-image: -moz-linear-gradient(top, rgb(249, 249, 249), rgb(233, 233, 233));
	background-image: -o-linear-gradient(top, rgb(249, 249, 249), rgb(233, 233, 233));
	background-image: -ms-linear-gradient(top, rgb(249, 249, 249), rgb(233, 233, 233));
	background-image: linear-gradient(top, rgb(249, 249, 249), rgb(233, 233, 233));
	filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0,StartColorStr='#f9f9f9', EndColorStr='#e9e9e9');

	border-bottom:1px solid #bababa;

	-webkit-box-shadow:
		inset 0px -1px 0px #fff,
		0px 1px 3px rgba(0,0,0,.08);
	-moz-box-shadow:
		inset 0px -1px 0px #fff,
		0px 1px 3px rgba(0,0,0,.08);
	box-shadow:
		inset 0px -1px 0px #fff,
		0px 1px 3px rgba(0,0,0,.08);

	-webkit-border-radius:4px 4px 0px 0px;
	-moz-border-radius:4px 4px 0px 0px;
	border-radius:4px 4px 0px 0px;

	font-size:18px;
	font-weight:bold;
	text-align:center;
	line-height:44px;

	color:#444444;
	text-shadow:0px 1px 0px #fff;
}

#content {
	width:100%;	height:196px;	background:#fcfcfc; position:absolute; top:52px; left:0;

	-webkit-box-shadow:0px 1px 3px rgba(0,0,0,.25);
	-moz-box-shadow:0px 1px 3px rgba(0,0,0,.25);
	box-shadow:0px 1px 3px rgba(0,0,0,.25);

	-webkit-border-radius:0px 0px 4px 4px;
	-moz-border-radius:0px 0px 4px 4px;
	border-radius:0px 0px 4px 4px;
}

#content p { position:relative; font: normal 15px Verdana;	text-align:left;	padding:25px; line-height:22px;	color:#555555;
margin:0; left:0px; right:0px;}

.ctlbuttons{position:relative; width:100%; margin:10px 0; }

.button {
	width:138px;	height:33px; position:absolute; cursor:pointer;
	font-size:13px;	font-weight:bold;	line-height:33px;  text-align:center;
	color:#fff;	text-shadow:0px 1px 0px rgba(0,0,0,.2);

  -webkit-border-radius:3px;	-moz-border-radius:3px;	border-radius:3px;
	-webkit-box-shadow:		inset 0px 1px 0px rgba(255,255,255,.5),	0px 1px 2px rgba(0,0,0,.3);
	-moz-box-shadow:		inset 0px 1px 0px rgba(255,255,255,.5), 0px 1px 2px rgba(0,0,0,.3);
	box-shadow:		inset 0px 1px 0px rgba(255,255,255,.5), 0px 1px 2px rgba(0,0,0,.3);
}

.button.green {
	background: -webkit-linear-gradient(top,  rgba(170,212,79,1) 0%,rgba(116,185,49,1) 90%,rgba(106,173,45,1) 95%,rgba(96,157,41,1) 100%);
	background: -moz-linear-gradient(top,  rgba(170,212,79,1) 0%,rgba(116,185,49,1) 90%,rgba(106,173,45,1) 95%,rgba(96,157,41,1) 100%);
	background: -o-linear-gradient(top,  rgba(170,212,79,1) 0%,rgba(116,185,49,1) 90%,rgba(106,173,45,1) 95%,rgba(96,157,41,1) 100%);
	background: -ms-linear-gradient(top,  rgba(170,212,79,1) 0%,rgba(116,185,49,1) 90%,rgba(106,173,45,1) 95%,rgba(96,157,41,1) 100%);
	background: linear-gradient(top,  rgba(170,212,79,1) 0%,rgba(116,185,49,1) 90%,rgba(106,173,45,1) 95%,rgba(96,157,41,1) 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#aad44f', endColorstr='#609d29',GradientType=0 );

	border:1px solid #5b8821;

	left:100px;
}
.button.red {
	background: -webkit-linear-gradient(top,  rgba(248,114,136,1) 0%,rgba(243,71,85,1) 90%,rgba(225,65,77,1) 95%,rgba(206,59,70,1) 100%);
	background: -moz-linear-gradient(top,  rgba(248,114,136,1) 0%,rgba(243,71,85,1) 90%,rgba(225,65,77,1) 95%,rgba(206,59,70,1) 100%);
	background: -o-linear-gradient(top,  rgba(248,114,136,1) 0%,rgba(243,71,85,1) 90%,rgba(225,65,77,1) 95%,rgba(206,59,70,1) 100%);
	background: -ms-linear-gradient(top,  rgba(248,114,136,1) 0%,rgba(243,71,85,1) 90%,rgba(225,65,77,1) 95%,rgba(206,59,70,1) 100%);
	background: linear-gradient(top,  rgba(248,114,136,1) 0%,rgba(243,71,85,1) 90%,rgba(225,65,77,1) 95%,rgba(206,59,70,1) 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f87288', endColorstr='#ce3b46',GradientType=0 );

	border:1px solid #b0333e;

	right:100px;
}

.reveal-modal-bg { 
	position: fixed; 
	height: 100%;
	width: 100%;
	background: #000;
	background: rgba(0,0,0,.8);
	z-index: 100;
	display: none;
	top: 0;
	left: 0; 
}

