#screenoverlay
{
	background-color: #314462; /* The color to display*/

	/* The transparency of the background */
	opacity: .75;
	filter: alpha(opacity=75);

	position: absolute;
	left: 0px;
	top: 0px;
	width: 100%;
	height: 250%;

	/* Set the overlay so it appears above the page content */
	z-index: 1000;
}

#uploadoverlay
{
	background-color: #314462; /* The color to display*/

	/* The transparency of the background */
	opacity: .75;
	filter: alpha(opacity=75);

	position: absolute;
	left: 0px;
	top: 0px;
	width: 100%;
	height: 250%;

	/* Set the overlay so it appears above the page content */
	z-index: 999;
}

#notesbox
{
	position: absolute;

	/* Positioning */
	margin-left:-300px;
	left:50%;
	
	top: 50px;
	
	padding: 5px;
	width: 600px;
	height: auto;	
	background-color: #FFF;
	border: 1px solid #aaaaaa;
    font-size:90%;

	/*Must use a z-index greater than the screen overlay*/
	z-index: 1001;
}

#deletebox
{
	position: absolute;

	/* Positioning */
	margin-left:-275px;
	left:50%;
	
	top: 200px;
	
	padding: 5px;
	width: 550px;
	height: auto;	
	background-color: #FFF;
	border: 1px solid #aaaaaa;
    font-size:90%;

	/*Must use a z-index greater than the screen overlay*/
	z-index: 1001;
}

#confirmbox
{
	position: absolute;

	/* Positioning */
	margin-left:-275px;
	left:50%;
	top: 200px;

	padding: 5px;
	width: 550px;
	height: auto;
	background-color: #FFF;
	border: 1px solid #aaaaaa;
    font-size:90%;

	/*Must use a z-index greater than the screen overlay*/
	z-index: 1001;
}

#mergebox
{
	position: absolute;

	/* Positioning */
	margin-left:-275px;
	left:50%;
	top: 200px;

	padding: 5px;
	width: 550px;
	height: auto;
	background-color: #FFF;
	border: 1px solid #aaaaaa;
    font-size:90%;

	/*Must use a z-index greater than the screen overlay*/
	z-index: 1001;
}

#gradebox
{
	position: absolute;

	/* Positioning */
	margin-left:-300px;
	left:50%;
	top: 200px;

	padding: 5px;
	width: 600px;
	height: auto;
	background-color: #FFF;
	border: 1px solid #aaaaaa;

	/*Must use a z-index greater than the screen overlay*/
	z-index: 1001;
}

#settingsbox
{
	position: absolute;

	/* Positioning */
	margin-left:-300px;
	left:50%;
	top: 200px;

	padding: 5px;
	width: 500px;
	height: auto;
	background-color: #FFF;
	border: 1px solid #aaaaaa;

	/*Must use a z-index greater than the screen overlay*/
	z-index: 1001;
}

#newuserbox
{
	position: absolute;

	/* Positioning */
	margin-left:-350px;
	left:50%;
	top: 200px;

	padding: 5px;
	width: 700px;
	height: auto;
	background-color: #FFF;
	border: 1px solid #8DC7C7;
    font-size:90%;

	/*Must use a z-index greater than the screen overlay*/
	z-index: 1001;
}



/* popup div */

.paneltable
{
	width:99%;
	margin-top:0px;
	margin-bottom:0px;
	border-collapse:collapse;
}

.paneltable th
{
	padding:4px;
	border-bottom:2px solid #fff;
	border-right:1px solid #fff;
	border-top:0px solid transparent;
	background-color:#F5FAFA;
	color:#336666;
	font-weight:bold;
	text-align:left;		
}


.paneltable .paneltablecol1
{
	background-color:#F5FAFA;    
	color:#336666;
	padding:4px;
	border-bottom:1px solid #fff;
	border-top:1px solid transparent;
	border-right:1px solid #fff;
	width:24%;
	vertical-align:top;
}

.paneltable .paneltablecol2
{   
	background-color:#F5FAFA;
	color:#336666;
	padding:4px;
	border-bottom:1px solid #fff;
	border-top:1px solid transparent;
	width:74%;
	vertical-align:top;
}

.box_title_holder
{	
	font-size:1.1em;
	padding: 4px 2px 4px 2px;
	margin-bottom:2px;	
	background-color:#8DC7C7;
    height:18px;
}

.box_title
{	
	color:#FFFFFF;
	font-weight:bold;
    float:left;
	padding-bottom:5px;
}

.box_subtitle {
	padding-left: 3px;
	padding-right: 3px;
	padding-top: 3px;
	padding-bottom: 3px;
	color: #336666;
}

.box_close
{
	padding-top:2px;
    float:right;
    height:15px;
}

.box_text
{	
	padding-top:8px;
	padding-left:3px;
	padding-right:3px;
	padding-bottom:3px;
	margin-bottom:3px;
	background-color:#FFFFFF;
	color:#808080;
}

.box_alert {
	font-size: 100%;
	padding-top: 3px;
	padding-left: 3px;
	padding-right: 3px;
	padding-bottom: 3px;
	margin-bottom: 3px;
	background-color: #FFFFFF;
	color: #808080;
}

.box_smalltext
{	
    font-size:90%;
	padding-top:8px;
	padding-left:3px;
	padding-right:3px;
	padding-bottom:3px;
	margin-bottom:3px;
	background-color:#FFFFFF;
	color:#808080;
}

.box_text_center
{	
    position: relative;
    left: 50%;
    transform: translateX(-50%);
    text-align:center;
    font-size:1.3em;
    width:90%;
    height:85%;
	background-color:#FFFFFF;
	color:#808080;
}

.box_search
{	
	padding-top:3px;
	padding-bottom:10px;
	padding-left:2px;
}

.box_text a
{
    text-decoration:underline;
}

.box_buttons
{
    padding-top:25px;
	padding-bottom:2px;
}


.box_split1
{	
	padding-top:3px;
	padding-bottom:10px;
	width:65%;	
	float:left;	
}

.box_split2
{	
	padding-top:3px;
	padding-bottom:10px;
	padding-left:2px;	
	width:30%;
	text-align:right;
	float:right;	
}

.box_header
{
    display:none;
}

.report_title_holder{
	display:none;
}

#explain_stars
{
	position: absolute;

	/* Positioning */
	margin-left:-325px;
	left:50%;
	
	top: 100px;
	
	padding: 5px;
	width: 650px;
	background-color: #FFF;
	border: 1px solid #aaaaaa;
    font-size:90%;

	/*Must use a z-index greater than the screen overlay*/
	z-index: 1003;
}

.listdiv
{
    color:#333;
}

.explain_title
{
	color:#0073AA;	
	font-weight:bold;
}

#emailbox
{
	position: absolute;

	/* Positioning */
	margin-left:-300px;
	left:50%;
	
	top: 50px;
	
	padding: 5px;
	width: 600px;
	background-color: #FFF;
	border: 1px solid #aaaaaa;
    font-size:90%;

	/*Must use a z-index greater than the screen overlay*/
	z-index: 1001;
}

#infobox
{
	position: absolute;

	/* Positioning */
	left:430px;
	
	top: 180px;
	
	padding: 5px;
	width: 250px;
	height: 100px;
	background-color: #e8edff;
    font-size:70%;

	/*Must use a z-index greater than the screen overlay*/
	z-index: 1001;
}


.popup_title
{	
	font-size:1.1em;
	padding-bottom:5px;	
	color:#336666;
	font-weight:bold;
}

.popup_table_content
{
	width:370px;
	text-align:right;
	font-family: 'Century Gothic', 'Trebuchet MS', Arial, Verdana, Helvetica, sans-serif;
	color:#333333;	
	padding:6px;
	background-color:#f5f7fa;	
}

.popup_desc
{
	min-width:95%;
	width:95%;
	padding-bottom:5px;
}

.popup_buttons {
	padding-top: 4px;
	padding-bottom: 3px;
	padding-left: 3px;
	padding-right: 3px;
}



/* popup div*/
#approvebox
{
	position: absolute;

	/* Positioning */
	margin-left:-325px;
	left:50%;
	top: 100px;

	padding: 5px;
	width: 650px;
	height: auto;
	background-color: #FFF;
	border: 1px solid #aaaaaa;

	/*Must use a z-index greater than the screen overlay*/
	z-index: 1002;
}

#approverrejectbox
{
	position: absolute;

	/* Positioning */
	margin-left:-325px;
	left:50%;
	top: 200px;

	padding: 5px;
	width: 650px;
	height: auto;
	background-color: #FFF;
	border: 1px solid #aaaaaa;

	/*Must use a z-index greater than the screen overlay*/
	z-index: 1002;
}

#approverreopenbox {
	position: absolute;
	/* Positioning */
	margin-left: -325px;
	left: 50%;
	top: 200px;
	padding: 5px;
	width: 650px;
	height: auto;
	background-color: #FFF;
	border: 1px solid #aaaaaa;
	/*Must use a z-index greater than the screen overlay*/
	z-index: 1002;
}

#printbox
{
	position: absolute;

	/* Positioning */
	margin-left:-350px;
	left:50%;
	top: 200px;

	padding: 5px;
	width: 700px;
	height: auto;
	background-color: #FFF;
	border: 1px solid #aaaaaa;

	/*Must use a z-index greater than the screen overlay*/
	z-index: 1002;
}

#staffinfobox
{
	position: absolute;

	/* Positioning */
	margin-left:-350px;
	left:50%;
	top: 200px;

	padding: 5px;
	width: 700px;
	height: auto;
	background-color: #FFF;
	border: 1px solid #aaaaaa;

	/*Must use a z-index greater than the screen overlay*/
	z-index: 1002;
}

#leavetypebox
{
	position: absolute;

	/* Positioning */
	margin-left:-350px;
	left:50%;
	top: 200px;

	padding: 5px;
	width: 750px;
	height: auto;
	background-color: #FFF;
	border: 1px solid #aaaaaa;

	/*Must use a z-index greater than the screen overlay*/
	z-index: 1022;
}

#recipientsbox
{
	position: absolute;

	/* Positioning */
	margin-left:-325px;
	left:50%;
	top: 70px;

	padding: 5px;
	width: 700px;
	height: 510px;
	background-color: #FFF;
	border: 1px solid #aaaaaa;

	/*Must use a z-index greater than the screen overlay*/
	z-index: 1002;
}

#attendeesbox
{
	position: absolute;

	/* Positioning */
	margin-left:-300px;
	left:50%;
	top: 40px;

	padding: 5px;
	width: 740px;
	height: 610px;
	background-color: #FFF;
	border: 1px solid #aaaaaa;

	/*Must use a z-index greater than the screen overlay*/
	z-index: 1002;
}

#qrcodebox
{
	position: absolute;

	/* Positioning */
	margin-left:-325px;
    margin-top:-275px;
	left:50%;
	top: 50%;

	padding: 5px;
	width: 650px;
	height: 550px;
	background-color: #FFF;
	border: 1px solid #aaaaaa;

	/*Must use a z-index greater than the screen overlay*/
	z-index: 1003;
}

#attendee_save
{
	position: absolute;

	/* Positioning */
	margin-left:-250px;
    margin-top:-45px;
	left:50%;
    top:50%;
	padding: 5px;
	width: 500px;
	height: 90px;
	background-color: #FFF;
	border: 1px solid #aaaaaa;
    font-size:90%;

	/*Must use a z-index greater than the screen overlay*/
	z-index: 1004;
}

#attendee_copy
{
	position: absolute;

	/* Positioning */
	margin-left:-250px;
    margin-top:-52px;
	left:50%;
    top:50%;
	padding: 5px;
	width: 500px;
	height: 115px;
	background-color: #FFF;
	border: 1px solid #aaaaaa;
    font-size:90%;

	/*Must use a z-index greater than the screen overlay*/
	z-index: 1004;
}

#leavebox
{
	position: absolute;

	/* Positioning */
	margin-left:-300px;
	left:50%;
	top: 200px;

	padding: 5px;
	width: 600px;
	height: auto;
	background-color: #FFF;
	border: 1px solid #aaaaaa;

	/*Must use a z-index greater than the screen overlay*/
	z-index: 1002;
}

#uploadbox
{
	position: absolute;

	/* Positioning */
	margin-left:-225px;
	left:50%;
	top: 200px;

	padding: 5px;
	width: 450px;
	height: auto;
	background-color: #FFF;
	border: 1px solid #aaaaaa;
    font-size:90%;

	/*Must use a z-index greater than the screen overlay*/
	z-index: 1002;
}

#letterbox
{
	/* Positioning */
	position: absolute;
	margin-left:-400px;
	left:50%;
	top: 100px;
	padding: 5px;
	width: 800px;
	height: auto;
	background-color: #FFF;
	border: 1px solid #aaaaaa;
    font-size:100%;

	/*Must use a z-index greater than the screen overlay*/
	z-index: 1002;
}

#feedbackbox {
	position: absolute;
	/* Positioning */
	margin-left: -400px;
	margin-top: -332px;
	left: 50%;
	top: 50%;
	padding: 5px;
	width: 800px;
	height: auto;
	background-color: #FFF;
	border: 1px solid #aaaaaa;
	/*Must use a z-index greater than the screen overlay*/
	z-index: 1004;
}


#calendarbox
{
	position: absolute;

	/* Positioning */
	margin-left:-425px;
	left:50%;
	top: 25px;

	padding: 5px;
	width: 850px;
	height: auto;
	background-color: #FFF;
	border: 1px solid #aaaaaa;

	/*Must use a z-index greater than the screen overlay*/
	z-index: 1003;
}

#selectcalendarbox
{
	padding: 5px;
	width: 650px;
	height: auto;
	background-color: #F5FAFA;
	border: 1px solid #aaaaaa;

}
#allowancebox {
	position: absolute;
	/* Positioning */
	margin-left: -430px;
	left: 50%;
	top: 200px;
	padding: 5px;
	width: 875px;
	height: auto;
	background-color: #FFF;
	border: 1px solid #aaaaaa;
	/*Must use a z-index greater than the screen overlay*/
	z-index: 1002;
}

#costsbox {
	position: absolute;
	/* Positioning */
	margin-left: -430px;
	left: 50%;
	top: 200px;
	padding: 5px;
	width: 875px;
	height: auto;
	background-color: #FFF;
	border: 1px solid #aaaaaa;
	/*Must use a z-index greater than the screen overlay*/
	z-index: 1002;
}


#changepassbox
{
	position: absolute;

	/* Positioning */
	margin-left:-425px;
	left:50%;
	top: 100px;

	padding: 5px;
	width: 850px;
	height: auto;
	background-color: #FFF;
	border: 1px solid #aaaaaa;

	/*Must use a z-index greater than the screen overlay*/
	z-index: 1002;
}

#updateemailbox {
	position: absolute;
	/* Positioning */
	margin-left: -275px;
	left: 50%;
	top: 100px;
	padding: 5px;
	width: 650px;
	height: auto;
	background-color: #FFF;
	border: 1px solid #aaaaaa;
	/*Must use a z-index greater than the screen overlay*/
	z-index: 1002;
}

/*Modal Popup*/

.modalBackground {
	background-color:Gray;
	filter:alpha(opacity=70);
	opacity:0.7;

}

.modalbox
{
	padding: 5px;
	width: 500px;
	height: auto;
	background-color: #FFF;
	border: 1px solid #aaaaaa;
}

.staffbox
{
	padding: 5px;
	width: 650px;
	height: auto;
	background-color: #FFF;
	border: 1px solid #aaaaaa;
}

.coursebox
{
	padding: 5px;
	width: 850px;
	height: auto;	
	background-color: #FFF;
	border: 1px solid #aaaaaa;
}

.appraisalbox
{
	padding: 5px;
	width: 800px;
	height: 600px;	
	overflow: auto;
	background-color: #FFF;
	border: 1px solid #aaaaaa;
}

.rejectbox
{
	padding: 5px;
	width: 650px;
	height: auto;
	background-color: #FFF;
	border: 1px solid #aaaaaa;
}

.approvepanel
{
	padding: 5px;
	width: 600px;
	height: auto;
	background-color: #FFF;
	border: 1px solid #aaaaaa;
}

.allowancepanel
{
	padding: 5px;
	width: 750px;
	height: auto;
	background-color: #FFF;
	border: 1px solid #aaaaaa;
}

.clashbox
{
	padding: 5px;
	width: 650px;
	height: auto;
	background-color: #FFF;
	border: 1px solid #aaaaaa;
}

.letterbox_title_holder
{	
	font-size:1.1em;
	padding:3px;
	margin-bottom:5px;	
	background-color:#8DC7C7;
    height:20px;
}
.letterbox_title
{	
	color:#FFFFFF;
	font-weight:bold;
    float:left;
}
.letterbox_text
{	
	padding-top:3px;
	padding-left:3px;
	padding-right:3px;
	padding-bottom:3px;
	border:1px solid #e8e6e6;
    width:auto;
    height:450px;
    max-height:450px;
    scrollbar-3dlight-color:aqua;
}

.label_instruct
{
    display:block;
}

#nonattendbox {
	position: absolute;
	/* Positioning */
	margin-left: -250px;
	margin-top: -52px;
	left: 50%;
	top: 50%;
	padding: 5px;
	width: 500px;
	height: auto;
	background-color: #FFF;
	border: 1px solid #aaaaaa;
	/*Must use a z-index greater than the screen overlay*/
	z-index: 1004;
}

#invitationbox {
	position: absolute;
	/* Positioning */
	margin-left: -250px;
	margin-top: -52px;
	left: 50%;
	top: 50%;
	padding: 5px;
	width: 500px;
	height: auto;
	background-color: #FFF;
	border: 1px solid #aaaaaa;
	/*Must use a z-index greater than the screen overlay*/
	z-index: 1004;
}

.formtablelarge {
	width: 99%;
	margin-top: 0px;
	margin-bottom: 0px;
	border-collapse: collapse;
}

.formtablelarge th {
	padding: 4px;
	border-bottom: 2px solid #fff;
	border-right: 1px solid #fff;
	border-top: 0px solid transparent;
	background-color: #F5FAFA;
	color: #336666;
	font-weight: bold;
	text-align: left;
}


.formtablelarge .formtablecol1 {
	background-color: #F5FAFA;
	color: #336666;
	padding: 4px;
	border-bottom: 1px solid #fff;
	border-top: 1px solid transparent;
	border-right: 1px solid #fff;
	width: 35%;
	vertical-align: top;
}

.formtablelarge .formtablecol2 {
	background-color: #F5FAFA;
	color: #336666;
	padding: 4px;
	border-bottom: 1px solid #fff;
	border-top: 1px solid transparent;
	width: 64%;
	vertical-align: top;
}

.expensescol {
	float: left;
	width: 50%;
}

#expensesbox {
	position: absolute;
	/* Positioning */
	margin-left: -420px;
	left: 50%;
	top: 800px;
	padding: 5px;
	width: 840px;
	height: auto;
	background-color: #FFF;
	border: 1px solid #aaaaaa;
	/*Must use a z-index greater than the screen overlay*/
	z-index: 1005;
}

#actualexpensesbox {
	position: absolute;
	/* Positioning */
	margin-left: -375px;
	left: 50%;
	top: 800px;
	padding: 5px;
	width: 750px;
	height: auto;
	background-color: #FFF;
	border: 1px solid #aaaaaa;
	/*Must use a z-index greater than the screen overlay*/
	z-index: 1005;
}

.expensestable {
	width: 100%;
	min-width: 100%;
	border-collapse: collapse;
	text-align: left;
	margin-bottom: 0px;
	background-color: #F5FAFA;
}

.expensestable th {
	color: #336666;
	font-size:100%;
	border-bottom: 1px solid #8DC7C7;
	text-align: left;
	padding: 5px 5px 3px 5px;
}

.expensestable td {
	color: #336666;
	padding: 5px 5px 5px 5px;
	vertical-align: middle;
}

.expensestable .tdcol1 {
	color: #336666;
	width: 30%;
	padding: 5px 5px 5px 5px;
	vertical-align: middle;
}

.expensestable .tdcol2 {
	color: #336666;
	width: 15%;
	padding: 5px 5px 5px 5px;
	vertical-align: middle;
}

.expensestable .tdcol3 {
	color: #336666;
	padding: 5px 5px 5px 5px;
	vertical-align: middle;
}

.expensespaneltitle {
	padding: 3px;
	border-bottom: 2px solid #fff;
	background-color: #8DC7C7;
	color: #FFFFFF;
}

.indexmodalbox {
	padding: 7px;
	width: 700px;
	height: auto;
	background-color: #FFF;
	border: 1px solid #aaaaaa;
}