body, .gridView { font-family: Nunito,Helvetica,Arial,sans-serif; background-color: #fff; text-rendering: optimizeLegibility; }
	body {font-size: .9rem; padding: 0;	margin: 0;  }
	.pageHeader { background-color: #f4f4f4; margin: 0; padding: 1rem; }
	.user { float: right; }
	.error, .alert{ font-size: 1rem; background-color: #fccd32; /* #efc728; */ /* #f5f2e7; */ padding-left: 4rem; padding-right: 4rem; padding-top: .75rem; padding-bottom: .75rem; margin-top: 0;  }
	
	.info { font-size: 1rem; background-color: #eff7ff; /* #f5f2e7; */ padding-left: 4rem; padding-right: 4rem; padding-top: .75rem; padding-bottom: .75rem; border: solid 1px #2874bb; margin-top: 1rem; margin-bottom: 1rem;  }

		.info h2 { color: #2874bb; font-size: 1.25rem; padding-bottom: 0; margin-bottom: 0; 
		line-height: 1rem; } 
		
		.info p {margin-top: .25rem; padding-top: 0; }
	
	.headerBand { background-color: #5353d1; padding: 12px;  }
	
	h1 { font-weight: 400; font-size: 1.5rem; color: #444444; text-rendering: optimizeLegibility; margin: 0; margin-bottom: 0;  background-color: #f4f4f4; padding-left: 1rem; padding-right: 1rem; 
	border-bottom: .0625rem solid #e2e2e2;  padding-top: .75rem; padding-bottom: .75rem;	}
	h2 span, .ddl { font-weight: 600; font-size: .875rem; color: #444444; text-rendering: optimizeLegibility; padding: 0; margin: 0; }
	h2 {font-size: 1.25rem; }

	h3 {font-size: 1rem; }
	
	a, a:link, a:visited, a:active, a:hover { color: #0074db; }

	
	.ddl { margin: 0; padding: 0; border: none; background-color: transparent; text-decoration: underline; font-weight: bold; font-size: 1.25rem; }

	.content { margin-left: 1rem; margin-right: 1rem;  }

	.gridView { margin: 12px; border: solid 1px #bdbdbd; }
	.gridView tr { border-bottom: solid 1px #bdbdbd; }
	.gridView tr th { background-color: #f4f4f4; padding: 1rem; border-right: solid 1px #bdbdbd; border-bottom: solid 4px #bdbdbd;  }
	.gridView tr:hover { background-color:#eff7ff; }
	.gridView tr {height: 3rem; }
	.gridView td { text-align: center; }
	.gridView td:nth-child(1), .gridView th:nth-child(1) { text-align: left; }
	
	.data { width: 100%; clear: both; margin-bottom: 24px; border: solid .0625rem #bdbdbd; }
	.data .items {clear: both; border-bottom: solid 1px #dedede; padding: .25rem; font-size: .8rem;  }
	.data .items.dashed { border-bottom-style: dashed !important; }
	.data .items.total { border-bottom: double 4px #dedede;background-color: #efefef; margin-bottom: 24px; }
	.data .items.month { background-color: #efefef; font-weight: bold; }
	
	#itemsHeader { background-color: #bdbdbd;color: #444; font-weight: 400;  }
	
	.data .items .ID { min-width: 120px; display: inline-block;  }
	.data .items .title { min-width: 250px; display: inline-block;  }
	.data .items .date { min-width: 200px; display: inline-block;  }
	.data .items .rate { min-width: 120px; display: inline-block;  }
	.data .items .hours { min-width: 100px; display: inline-block;  }
	.data .items .amount { min-width: 100px; display: inline-block; text-align: right;  }
	
	.items:hover {background-color: #ffffcc; }
	.note { background-color: #ffffcc; padding: 10px; color: orange; }
	
	.tooltip { position: relative; display: inline-block; border-bottom: 1px dotted black; }

	.tooltip .tooltiptext { visibility: hidden; width: 160px; background-color: black; color: #fff; 
	text-align: center; padding: 5px 0; border-radius: 6px;
	/* Position the tooltip text - see examples below! */
	position: absolute; z-index: 1; }
	
	.tooltip .tooltiptext { width: 160px; top: 100%; left: 50%;
		margin-left: -80px; /* Use half of the width (120/2 = 60), to center the tooltip */ }

	.tooltip:hover .tooltiptext { visibility: visible; }	
	
.alert a {
 background: #77b6e0;
  background-image: -webkit-linear-gradient(top, #77b6e0, #187bb8);
  background-image: -moz-linear-gradient(top, #77b6e0, #187bb8);
  background-image: -ms-linear-gradient(top, #77b6e0, #187bb8);
  background-image: -o-linear-gradient(top, #77b6e0, #187bb8);
  background-image: linear-gradient(to bottom, #77b6e0, #187bb8);
  -webkit-border-radius: 4;
  -moz-border-radius: 4;
  border-radius: 4px;
  font-family: Arial;
  color: #ffffff;
  font-size: 16px;
  padding: 8px 12px 8px 12px;
  text-decoration: none;
}
.alert a:hover {
  background: #3cb0fd;
  background-image: -webkit-linear-gradient(top, #3cb0fd, #3498db);
  background-image: -moz-linear-gradient(top, #3cb0fd, #3498db);
  background-image: -ms-linear-gradient(top, #3cb0fd, #3498db);
  background-image: -o-linear-gradient(top, #3cb0fd, #3498db);
  background-image: linear-gradient(to bottom, #3cb0fd, #3498db);
  text-decoration: none;
}
.alert a:active {
	position:relative;
	top:1px;
}

.topTextS1 { background-color: #f5f2e7; color: #8a6a00; border-left: solid 2rem #efc728; padding: .75rem; font-size: 1rem;
	margin-top: 0; border-bottom: .0625rem solid #e2e2e2; }
.topTextS2 { background-color: #eff7ff; color: #2874bb;  border-left: solid 2rem #2874bb; padding: .75rem; font-size: 1rem;
margin-top: 0; border-bottom: .0625rem solid #e2e2e2; }
.normal { }
.bold {font-weight: 600; }
.italic { font-style: italic; }

.regInfo { padding-bottom: 1rem; }

/* --------------- */body {font-size: .9rem; padding: 0;	margin: 0;  }
body, .gridView { font-family: Nunito,Helvetica,Arial,sans-serif; background-color: #fff; text-rendering: optimizeLegibility; }
.pageHeader { background-color: #f4f4f4; margin: 0; padding: 1rem; }
.user { float: right; }
.error { font-size: .7rem; background-color: #ffffcc; padding-left: 4rem; padding-right: 4rem; }
.plain { font-weight: normal; }
.headerBand { background-color: #5353d1; padding: 12px;  }
small {font-size: .7rem; }
.content {  }
.future { color: #999999; }

/* h1 { font-weight: 400; font-size: 1.25rem; color: #444444; text-rendering: optimizeLegibility; padding: 0; margin: 0; } */
/* h2 span { font-weight: 400; font-size: 1.1rem; color: #444444; text-rendering: optimizeLegibility; padding: 0; margin: 0; }
*/

.gridView { margin: 12px; border: solid 1px #bdbdbd; color: #333333; border-collapse: collapse; width: 98%; }
.gridView tr { border-bottom: solid 1px #bdbdbd; }
.gridView tr th, .gridViewHeader { background-color: #f4f4f4; padding: 1rem; border-right: solid 1px #bdbdbd; 
	border-bottom: solid 4px #bdbdbd; color: #333333; }
.gridView tr:hover { background-color:#eff7ff; }
.gridView tr {height: 3rem; }
.gridView td { text-align: center; }
.gridView td:nth-child(1), .gridView th:nth-child(1) { text-align: left; }
.gridView td:nth-child(1) { padding-left: .5rem; }

#itemsHeader { background-color: #bdbdbd;color: #444; font-weight: 400;  }

.data { width: 100%; clear: both; margin-bottom: 24px; border: solid .0625rem #bdbdbd; }
.data .items {clear: both; border-bottom: solid 1px #dedede; padding: .25rem; font-size: .8rem;  }
.data .items.dashed { border-bottom-style: dashed !important; }
.data .items.total { border-bottom: double 4px #dedede;background-color: #efefef; margin-bottom: 24px; }
.data .items.month { background-color: #efefef; font-weight: bold; }
.data .items .ID { min-width: 120px; display: inline-block;  }
.data .items .title { min-width: 250px; display: inline-block;  }
.data .items .date { min-width: 200px; display: inline-block;  }
.data .items .rate { min-width: 120px; display: inline-block;  }
.data .items .hours { min-width: 100px; display: inline-block;  }
.data .items .amount { min-width: 100px; display: inline-block; text-align: right;  }

.items:hover {background-color: #ffffcc; }
.note { background-color: #ffffcc; padding: 10px; color: orange; }
.comments { text-align: center; padding: 4rem; }

ul.columns {
  column-count: 2;
  column-rule: dotted 1px #333;
  list-style-type: none;
}

ul.columns li img {
  max-width: 120px;
}






.pnlRegInfo { padding: 2rem; }
  
  /***** FOR ADMIN PAGE *****/

.adminNavButton, .adminNavButtonActive {
	/* box-shadow:inset 2px 2px 0px 0px #54a3f7; */
	font-family: Open Sans,Helvetica,Arial,sans-serif;
	font-size: .875rem;
	font-style: normal;
    font-weight: 400;
	font-style: normal;
	text-decoration: none;
	text-align: center;
    white-space: normal;
	padding: 1rem 1rem .75rem;
	border: 0;
	/* border-bottom: .1rem solid #bdbdbd; */
	background-color: #fff;
	color: #bdbdbd;
	border-bottom: .1rem solid #fff;
}

.adminNavButton:hover {
	    color: #0074db;
			border-bottom: .1rem solid #bdbdbd;

}
.adminNavButton:active {
	/* position:relative;
	top:1px; */
	border-bottom: .0625rem solid #0074db;
	color: #0074db;
}

.adminNavButtonActive { border-bottom: .1rem solid #0074db; }

.adminCards { clear: both; }

.adminTDSubHead {background-color: #bdbdbd; font-size: 1rem; font-weight: 600; }

.adminButton, #dgContactInfo input[type=submit] {
    height: 2.375rem;
    padding: .325rem .875rem;
    font-size: .875rem;
	background-color: #fff;
    color: #0074db;
    /* box-shadow: inset 0 0 0 1px #; */
	display: inline-block;
    max-width: 100%;
    /* height: 2.75rem; */
    /* padding: .5rem 2.5rem; */
    transition: all .1s ease-in-out;
    transition: all .2s ease-in-out;
    border-radius: 6.25rem;
    font-family: Nunito,Helvetica,Arial,sans-serif;
    /* font-size: 1rem; */
    font-style: normal;
    font-weight: 400;
    /* line-height: 1.45; */
    text-align: center;
    text-decoration: none;
    text-overflow: ellipsis;
    white-space: nowrap;
    vertical-align: middle;
    -ms-touch-action: manipulation;
    touch-action: manipulation;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    /* font-size-adjust: .5; */
	border: solid 2px #999;
}

.adminButton:hover { background-color: #0074db; color: #fff; border: solid 2px #666; }

#dgContactInfo input[type=submit] {     
	height: 2rem;
    padding: .25rem .6rem;
    font-size: .825rem;
	margin-right: .5rem;
	color: red;
	}
	
	#dgContactInfo input[type=submit]:hover {
		background-color: red; color: #fff;
	}

.pnlAdminPadding { margin: 1rem; padding: 2rem; margin-top: 0; padding-top: 0; }

#pnlRegDates TABLE TH, #pnlRegDates TABLE TD, #pnlAddContact TABLE TH, #pnlAddContact TABLE TD { border-bottom: solid 1px #333; }

#pnlEditText input[type=text] {width: 90%; border-top: solid 1px #000; border-bottom: solid 1px #000; border-right: solid 1px #000; margin-bottom: 1rem; margin-top: .5rem; padding: .75rem; }

.ddlEdit { border: .0625rem solid #999; background-color: #ffffff; text-rendering: optimizeLegibility; text-decoration: none; border-radius: .429rem;  height: 2.5rem; outline: none; color: #333; padding: .6875rem .75rem .6875rem .75rem; line-height: 1.875rem; box-sizing: border-box; font-family: Open Sans,Helvetica, Arial,sans-serif; font-style: normal; font-weight: 400; font-size: .875rem;}

.tbEdit {padding-top: 1rem; padding-bottom: 1rem; min-width: 20rem; }

.tbEditSmall {padding-top: .5rem; padding-bottom: .5rem;  margin-left: .5rem; margin-right: .5rem; border-radius: .25rem; border: solid 1px #333; }

.adminSaveButtonArea { border-top: solid 1px #666; padding-top: 1rem; padding-bottom: 2rem; }