* { 
	box-sizing: border-box; 
}
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 100%;
}
p { margin: 1em 0; }

/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section, main {
	display: block;
}
html {
	line-height: 1;
	font-size: 62.5%
}
table {
	border-collapse: collapse;
	border-spacing: 0;
}

ul, ol, li {
	border: 0;
	font-size: 100%;
}

* { -webkit-text-size-adjust:none; }
body { 
	margin: 0 0 50px 0; 
	font-family: 'Open Sans', sans-serif;
	font-size: 1.3rem; 
	color: #000; 
	line-height: 1.43; 
	-webkit-font-smoothing: antialiased; 
	-webkit-text-size-adjust: 100%; 
}

.logout { background: #bbb; color: white; font-weight: bold; line-height: 2.5rem; text-align: right; margin-bottom: 50px; }
header { text-align: center; }
.logo { margin-bottom: 35px; }
nav { position: relative; }
main { display: block; }
article { width: 1000px; max-width: 94%; margin: 0 auto; }
aside { }
footer { }
.footer { }
sup { font-size: .65em; }

h1, h2, h3, h4 { line-height: 1.2; margin-bottom: 1rem; }
h1 { font-size: 4.0rem; text-transform: uppercase; font-weight: 300; }
h2 { font-size: 2.4rem; font-weight: 300; }
h3 { font-size: 1.4rem; }
h4 { font-size: 1.3rem; }

a { color: #0083c4; text-decoration: none; }
a.navlink { display: inline-block; text-align: center; }
a.navlink, span.showMenu { line-height: 30px; padding: 0 .75rem; }
a.navlink.active { }
.navigationLayer a { display: block; }
.footer a, .footer a:hover { color: inherit; }

.noshow { display: none; }
.center { text-align: center; }
img { border: none; max-width: 100%; }

.clearfix:after { visibility: hidden; display: block; font-size: 0; content: " "; clear: both; height: 0; }
.clearfix { position: relative; }
input, textarea, select { 
	-webkit-appearance:none;
	-moz-appearance:none;
	width: 100%;
	max-width: 100%;
	line-height: 28px;
	background: #efefef;
	border: 1px solid #ccc;
	font-size: inherit;
	font-family: inherit;
	margin-bottom: 12px;
	padding: 0;
	padding-left: 10px;
	border-radius: 0 !important;
}
select {
	height: 30px;
	line-height: 30px;
	-webkit-appearance:none;
	-moz-appearance:none;
	background-position:right 50%;
	background-repeat:no-repeat;
	background-image:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAA4AAAAMCAYAAABSgIzaAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyJpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuMC1jMDYwIDYxLjEzNDc3NywgMjAxMC8wMi8xMi0xNzozMjowMCAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENTNSBNYWNpbnRvc2giIHhtcE1NOkluc3RhbmNlSUQ9InhtcC5paWQ6NDZFNDEwNjlGNzFEMTFFMkJEQ0VDRTM1N0RCMzMyMkIiIHhtcE1NOkRvY3VtZW50SUQ9InhtcC5kaWQ6NDZFNDEwNkFGNzFEMTFFMkJEQ0VDRTM1N0RCMzMyMkIiPiA8eG1wTU06RGVyaXZlZEZyb20gc3RSZWY6aW5zdGFuY2VJRD0ieG1wLmlpZDo0NkU0MTA2N0Y3MUQxMUUyQkRDRUNFMzU3REIzMzIyQiIgc3RSZWY6ZG9jdW1lbnRJRD0ieG1wLmRpZDo0NkU0MTA2OEY3MUQxMUUyQkRDRUNFMzU3REIzMzIyQiIvPiA8L3JkZjpEZXNjcmlwdGlvbj4gPC9yZGY6UkRGPiA8L3g6eG1wbWV0YT4gPD94cGFja2V0IGVuZD0iciI/PuGsgwQAAAA5SURBVHjaYvz//z8DOYCJgUxAf42MQIzTk0D/M+KzkRGPoQSdykiKJrBGpOhgJFYTWNEIiEeAAAMAzNENEOH+do8AAAAASUVORK5CYII=);
}
form input, form textarea { width: 100%; }
form input[type=submit], form input[type=button] { 
	-webkit-appearance:none;
	-moz-appearance:none;
	width: 100% !important; 
}
form input[type=file] { background: none; border: 0; line-height: auto }
input:focus, select:focus, textarea:focus, button:focus { outline: none; }
label {
	display: block;
	font-weight: bold;
	text-transform: uppercase;
	line-height: 2;
}
input.removeActivity {
	border-radius: 0 !important;
}

/***    Button Styles   ***/
.btn { 
	display: block;
	background: #ccc;
	color: white;
	font-weight: bold;
	padding: 2px 8px;
	margin: .3rem 0 0 0;
	text-transform: uppercase;
	transition: all .3s ease;
}
.add { 
	background: #0083c4;
}
.add:hover { 
	background: #006da3; 
}
.submit {
	background: #54a010;
	line-height: inherit;
	border-radius: 0;
	border-width: 0;
}
.submit:hover {
	background: #437e0d;
}
.plusSign {
	font-weight: 800;
	font-size: 1.5em;
	line-height: 0;
	position: relative;
	top: 2px;
}
.totalHours { 
	color: #C00;
	font-weight: bold;
}
.totalHours.bingoBango { 
	color: #54a010;
}
.payrollstartBtn {
	background: #efefef; 
	border: 1px solid #ccc; 
	border-radius: 5px; 
	display: block; 
	font-size: 1.2em; 
	font-weight: bold;
	margin-bottom: 1rem;
	padding: 10% 0; 
	text-align: center;
	transition: all ease .3s; 
}
.payrollstartBtn:hover {
	background: #0083c4;
	color: white;
}

.warning {
	background: #efefef;
	border: 1px solid red;
	border-radius: 10px;
	padding: 1em 2em;
	margin: 1em 0;
}
.warning h3 { margin-bottom: 0; }

.desktopOnly { display: none; }
.error { border: 1px solid #f00 !important; }
.offScreen { position: absolute; left: -10000px; }

.rowLabel { display: inline-block; width: 80px; font-weight: bold; }
.entryRow { margin: 0; padding: 5px 0; width: 100%; }
.entryRow:nth-child(odd) { background: #efefef; }

.activityRowReport { 
	background-color: #efefef; 
	background-image: 
		url(/images/bcgrd-graph.png),
		url(/images/bcgrd-graph.png),
		url(/images/bcgrd-graph.png)
	;
	background-repeat: repeat-y, repeat-y, repeat-y;
	background-position: 25%, 50%, 75%; 
	border-left: 1px solid #bebebe;
	border-right: 1px solid #dbdbdb;
	padding: 1rem 0; 
}
.activities .col:last-of-type > .activityRow { border-bottom: 2px solid #bebebe !important; }
.activity { background: #0767b1; }
.value { background: rgba(255,255,255,0); color: white; padding: 2px 3px; margin: 0 3px 0; line-height: 1; white-space: nowrap; }
.navigationLayer { position: absolute; position: fixed; z-index: 100; top: 0; left: 0; width: 100%; height: 100%; background: rgba(0,0,0,.85); display: none; }
.navigationLayer ul { background: #eee; list-style: none; margin: 0; padding: 0; width: 300px; margin: 50px auto; font-weight: bold;  }
.navigationLayer ul li { padding: 0 15px; line-height: 35px; border-bottom: 1px solid rgba(0,0,0,.10); transition: .3s all ease; }
.navigationLayer ul li:hover { background: white; }
.close { background: #bbb; color: white; cursor: pointer; }
.close:hover { background: #999 !important; }

.datepick {
	font-size: 18px !important;
}

@media (max-width: 575px) {
	.activityRowReport { margin: .25rem 0 1rem; padding: 0; background: transparent; border: 0; }
}
@media (max-width: 767px) {
	.bs-row.activityRow { 
		padding-top: 12px; 
		background: linear-gradient(rgba(0,0,0,.09) 0, white 100%);
	}
	.bs-row.activityRow:nth-of-type(odd) {
	}
	.activityRow .col-md-1 {
	    -webkit-box-ordinal-group: 14;
	    -ms-flex-order: 13;
	    order: 13;
	}
}
@media (min-width: 768px) {
	.mobileOnly { display: none; }
	.desktopOnly { display: block; }
	.btn { display: inline-block; margin: .5rem .5rem .5rem 0; }
	.payrollstartBtn { padding: 20% 0; }
}

/***   Login Form  ***/
.loginForm {
	width: 500px; 
	max-width: 94%;
	margin: 0 auto;
	padding: 30px 20px;
	border-radius: 10px;
	box-shadow: 0 0 10px rgba(0,0,0,.3);
}
.loginForm label {
	display: block;
	font-weight: bold;
	text-transform: uppercase;
}
.loginForm input {

}