/* -------------- BROWSER OVERRIDES ----------------------------------------------------- */

td { -moz-user-select: none; }


/* -------------- JS PLUGIN : SELECT2 OVERRIDES; ----------------------------------------------------- */

.select2-container .select2-selection--single { min-height: 32px; }
.select2-container .select2-selection__clear { margin-right:10px; }
.select2-container--default .select2-selection--single .select2-selection__arrow {
	height:30px !important; border-bottom-right-radius: 3px; border-top-right-radius: 3px;
	right:1px; background:#CCC; }


.select2-container--disabled { opacity: 0.5; }
.select2-container--default.select2-container--disabled .select2-selection--single {
	cursor: not-allowed;
}



/* -------------- JS PLUGIN : FLEXIGRID OVERRIDES ----------------------------------------------------- */

.flexigrid { height:100%; overflow: hidden; display: flex; flex-direction: column; align-items: stretch; }

/*.flexigrid .gBlock { min-height: 95%; }*/

/*.flexigrid div.hDiv { position: absolute; top:0; left: 0; z-index: 2;}*/
.flexigrid div.hDiv th div, .flexigrid div.bDiv td div, div.colCopy div {
	padding:10px; /* do not adjust - tightness of rows will affect ability to tap on devices */
}

.flexigrid div.bDiv { overflow-y:scroll; height:100%; flex: 1; }

.flexigrid div.nDiv { height:30%; max-height: 70%; min-height:190px; min-width: 170px; }


.flexigrid div.nBtn { height: 36px; border-bottom: none; border-left:1px solid #CCC; border-right:1px solid #CCC; width: 24px;  }

	.flexigrid div.nBtn div { height: 36px; width: 20px; }

.flexigrid div.sDiv { display:block; float:left; }

	.flexigrid div.sDiv .sDiv2 { width:auto; }

.flexigrid div.pDiv .pDiv2 { width:auto; margin: 3px; }

	.flexigrid div.pDiv .pDiv2 > div { display:none;  }
	.flexigrid div.pDiv .pDiv2 > div:last-child { display:block; }

.flexigrid div.vGrip { display:none; }


.flexigrid div.bDiv tr.trSelected:hover td,
.flexigrid div.bDiv tr.trSelected:hover td.sorted,
.flexigrid div.bDiv tr.trOver.trSelected td.sorted,
.flexigrid div.bDiv tr.trOver.trSelected td,
.flexigrid tr.trSelected td.sorted,
.flexigrid tr.trSelected td {
	background:#80bcdd !important;
}

.flexigrid div.bDiv tr:hover td,
.flexigrid div.bDiv tr:hover td.sorted,
.flexigrid div.bDiv tr.trOver td.sorted,
.flexigrid div.bDiv tr.trOver td {
	background:#80bcdd !important;
}

/* -------------- MESSAGE ----------------------------------------------------- */

.messagesCell { cursor: default; text-align: center; padding:0px !important; width:100%; height:100%; }

/* -------------- NOTE ----------------------------------------------------- */

.tableNoteBtn { content: " "; display: block; cursor: pointer;
text-align: center; padding:5px 0 !important; width:100%; height:100%; }

/*.tableNoteBtn:hover { background: rgba(100,100,100,0.3); }*/
.tableNoteBtn span.icon { margin-top: 6px; }
.tableNoteBtn .noteContent { display: none; }

.flexTbl td[abbr=notes] > div { padding:0 !important; height:35px; }



/* -------------- TABLE STYLES ----------------------------------------------------- */
/*
.flexTbl tr:nth-child(even) { background: white; }
.flexigrid tr.erow td { background:none; }

.flexTbl tr:nth-child(odd) { background: #f7f7f7; }
*/


/* -------------- RESET OVERRIDES ----------------------------------------------------- */

.form-group { padding:0 20px; }

.container { padding-left:0; padding-right:0; }
.row { margin-left:0; margin-right: 0; }

hr { height:auto; margin:0; display:block; width:100%; }

.navbar-default .navbar-nav > li > a:focus, .navbar-default .navbar-nav > li > a:hover { color:white; }


/* -------------- BOOTSTRAP STYLINGS ----------------------------------------------------- */

/*.btn-primary { border-color:#2e6da4; background-color: #337ab7; color:#fff; }*/
.row .btn { width:100%; }
.btn-primary { border-color:#c9c9c9; background-color: #dddddd; color:#000; }
.btn-primary:hover { border-color:#dddddd; background-color: #FFF; color:#000;  }

.btn-primary.disabled, .btn-primary[disabled], fieldset[disabled] .btn-primary, .btn-primary.disabled:hover,
.btn-primary[disabled]:hover, fieldset[disabled] .btn-primary:hover, .btn-primary.disabled:focus,
.btn-primary[disabled]:focus, fieldset[disabled] .btn-primary:focus, .btn-primary.disabled.focus, .btn-primary.focus[disabled],
fieldset[disabled] .btn-primary.focus, .btn-primary.disabled:active, .btn-primary[disabled]:active,
fieldset[disabled] .btn-primary:active, .btn-primary.disabled.active, .btn-primary.active[disabled],
fieldset[disabled] .btn-primary.active {
	background: rgba(221,221,221,0.3); color: rgba(0,0,0,0.7);
}

.form-control[disabled],
.form-control[readonly],
fieldset[disabled] .form-control { opacity: 0.7; }

/*.modal-backdrop { z-index: 999999; }*/
.modal-dialog.working::after { z-index: 999; }

.bootstrap-switch { width:100% !important; }

.btn-default { background-color:#efefef; }
/*
.bootstrap-switch-container { width:150% !important; }
.bootstrap-switch-handle-on,
.bootstrap-switch-label,
.bootstrap-switch-handle-off { width:33.3% !important; }
*/

.dropdown-menu { border-right:0; }

    .dropdown-menu > li > a { color: #333; }
        .dropdown-menu > li > a:hover { color: #0085ba; background: none; }

	.dropdown-menu .safeatures p { font-weight: 400; color:#888; margin:0; padding:3px 20px; font-style: italic; }

	.dropdown-menu .safeatures ul { list-style: none; padding-left:20px; }

	.dropdown-menu .safeatures:after { display:block; content:""; width:80%; margin:auto; margin-top:10px; margin-bottom: 5px;
	padding: 0;  height:1px; background: #888; }

	.dropdown-menu a.btn { width: 80%; margin:10px auto;   }



.dropdown-toggle span.name { text-transform: capitalize; margin-right:10px; }

div.required label::after { display: inline-block; }



/* -------------- GLOBAL ELEMENTS ----------------------------------------------------- */

html, body { height:100%; color: #636b6f; height: 100vh; margin: 0; font-size: 14px; }

body { background: #2e333a; }

div.required { position: relative;  }
div.required label { width:auto; }
div.required label:after { content:'*'; color:red; font-family: monospace; width:20px; height:20px; font-size: 20px; padding-left:5px; }

input[type=number] {
-moz-appearance: textfield;
-webkit-appearance: textfield;
}


/* -------------- DROPZONE ----------------------------------------------------- */

body.dz-drag-hover .previewContainer { position: relative; }
body.dz-drag-hover .previewContainer:before { content:''; display:block; position: absolute; top:0; left:0; right:0; bottom:0; background: rgba(0,0,0,0.4); z-index: 99999; width:100%; height:100%;  }

.dz-image img { width: 100%; }

.dz-success-mark,
.dz-error-mark,
.dz-size,
.dz-filename { display:none; }

.dz-error-message { color:red; }



/* -------------- HEADER ----------------------------------------------------- */


.navbar { position:fixed; width:100%; background: #181816; min-width: 534px; }

.navbar .container { width:100%; max-width:1920px; display: table; vertical-align: top; }

.navbar-default .navbar-brand,
.navbar-default .navbar-nav > li > a,
.navbar-default .navbar-text { color:white; }

.navbar-default .navbar-nav > li > a:hover { color:#0085ba; }
.navbar-static-top { border:none; }

.navbar-default .navbar-brand:focus, .navbar-default .navbar-brand:hover { color:white; cursor: default; }


.navbar-nav { margin-left:5px; }
    .navbar-right { margin-right:14px; display: table-cell; vertical-align: top; float: right; }
        .navbar-nav .open .dropdown-menu { background-color: #e7e7e7; border: none; min-width: 100%;
            box-shadow:0 4px 3px rgba(0, 0, 0, 0.176);
            -webkit-box-shadow:0 4px 3px rgba(0, 0, 0, 0.176);
            -moz-box-shadow:0 4px 3px rgba(0, 0, 0, 0.176); }


/*.navbar-header .navbar-toggle.collapsed*/
.container .navbar-header {
    display: table-cell; overflow: hidden; vertical-align: top; float: left; margin-left: 15px; }

.navbar-collapse,
.navbar-collapse.collapse,
.navbar-collapse.collapse.in { border-top: 0; }

.navbar-brand {
    position: absolute; left: 410px; right: 136px; top: 0; text-align: center; margin: auto; padding:14px; }

.navbar-toggle { z-index:1; }



/* -------------- MODALS ----------------------------------------------------- */

	body.modal-open .outerWrapper { min-width: 551px; }
	body.modal-open .modal { padding-right: 0 !important; }


	.modal { min-width: 552px; }

		.modal-dialog .list-group-item { padding:0; border-radius: 0; border:0; }
		.modal-dialog .form-group.row { padding-left:0; padding-right:0; }

		.modal-dialog input { width:100%; }
		.modal-dialog label { 	width:100%; width:auto; font-weight: normal; line-height: 22px; color:#666; font-size:14px;
								font-style: italic; padding-left:2px; }

		.modal-dialog .birthdateInput > div { width: 33%;  }
		.modal-dialog .birthdateInput > div:nth-child(2) { margin: 0 20px; }

		.modal-dialog.working:after { 	position: absolute; top:0; left:0; right:0; bottom:0;
										width:100%: height:100%; background: rgba(0,0,0,0.8); content:" "; }

		.modal-body { padding-top: 0; }



	.icsModal { background: rgba(0,0,0,0.6); height:100%; display: none; align-items: center; justify-content: center; }

		.icsModal .form-group { width:100%; }

			.icsModal .form-group > div { padding-top:15px; }



	.icsModal .modal-dialog { width: 94%; max-width: 1000px; height:auto; max-height:90%; padding:30px 0; margin:0 auto; }

		.icsModal .modal-dialog .modal-content { height:100%; }

			.icsModal .modal-dialog .modal-content form { display:flex; flex-direction:column; height:100%; align-items:stretch; }

				.icsModal .modal-dialog .modal-content form .modal-body {
					align-items:flex-start; align-content:flex-start; display:flex; flex-flow:row wrap; justify-content:flex-start;
				}



	.icsModal .modal-body { padding-top:15px; margin-bottom: 20px; }

	.icsModal .modal-header { background: #5e88bd; color:white; border:none; clear: both; min-height: auto; padding:5px 15px; }

		.icsModal .modal-header h4 { font-weight: bold; }

		.icsModal .modal-header button.close { font-size: 32px; margin-top:0px; margin-left:4px; opacity:0.3; }
		.icsModal .modal-header button.close:hover { opacity: 0.8; }



	.icsModal .modal-footer { text-align:center; }


	.icsModal .btn-primary { border-color:#2e69b3; background-color: #367bd2; color:white; }
	.icsModal .btn-primary:hover { border-color:#3e80d4; background-color: #4a95f4; color:white;  }

	.icsModal .typeForms > li { display:none;  }

	.icsModal .modalControls > input { float:left; width:49%; }
	.icsModal .modalControls > input.floatRight { float:right; }
	.icsModal .modalControls > input:nth-child(2) { padding-left: 10px; }



/* -------------- SPECIFIC MODALS ----------------------------------------------------- */

	/* Add Note Modal */

	.icsModal.addNoteModal { height:100%; }
	.icsModal.addNoteModal .modal-dialog { max-width:500px; }

	.addNoteModal .entry-info { width:100%; }

	/* Rank Modal */

	#rankModal { }
	#rankModal .modal-dialog { width: 80%; max-height: 70%; height: auto; }
	#rankModal .modal-dialog .modal-content { height:100%; }
	#rankModal .modal-dialog .modal-content .modal-body { flex:1; }
	#rankModal .modal-dialog .modal-content .modal-body table { width:100%; }

	#rankModal .modal-dialog .modal-content .modal-body > div:first-child {
		background: white; height:70px; padding:0;
	}

	#rankModal .selectedStudents tr { border-bottom:1px solid #CCC; }
	#rankModal .headerRow tr { border-bottom:3px solid #CCC; font-weight:bold; background: white; z-index: 2; }
	/*#rankModal .selectedStudents { width:100%; background: red; max-height: 50%; overflow-y scroll; }



	#rankModal .selectedStudents tr td p { padding: 5px 13px; }

	#rankModal .selectedStudents tr td:first-child { text-align: center; }
	#rankModal .selectedStudents tr td:first-child p { padding-left:  }
	*/


	/* Add Modal */

	.row .btn.dupeBtn { width: auto; margin-right: 20px; margin-top:3px; }

	.staffModal.studentModal .modal-dialog { height: 100%; max-height:863px; padding:30px 0; }




	.staffModal.studentModal .loginField div:first-child { float:left; width: 60%; }
    .staffModal.studentModal .generateNum { float:left; width:35%; margin:27px 0 0 5%; }
    .staffModal.studentModal .range { font-size: 11px; margin-top:10px; color:#386194;}



	.staffModal.studentModal .expiredAlert { display:none; }


	.staffModal.studentModal .passwordField label:after {
		font-family: 'Raleway', sans-serif; font-size: 12px; content: "(Will save if set)"; width: 150px; padding-left:10px; }

	.staffModal.studentModal .passwordField.required label:after {
		font-family: monospace; content: "*"; width: 20px; padding-left:5px; font-size: 20px; }

	.staffModal.studentModal .sexInput,
	.staffModal.studentModal .leadInput { display:none; height:0; width:0; }
	.staffModal.studentModal .date { width:100%; }

	.staffModal.studentModal .entry-info { width: 70%;  }
	.staffModal.studentModal .entry-images { width: 30%; height: 151px;  }

		.staffModal.studentModal .modal-title { }
		.staffModal.studentModal .modal-title .select2 { margin-top:6px; }

		.staffModal.studentModal .modal-title h4 { text-align: right;}
		.staffModal.studentModal .modal-title h4.alignLeft { text-align: left; }

		.staffModal.studentModal .entry-images .thumbnail,
		.staffModal.studentModal .entry-images .belt  { width:100%; margin: 0; }

		.staffModal.studentModal .entry-images .defaultPicture { position: relative; height:auto; }
		.staffModal.studentModal .entry-images .defaultPicture p { position: absolute; bottom:20px; left: 0; right:0; text-align: center; font-weight:bold; color:#354c69; }
		.staffModal.studentModal .entry-images .defaultPicture img { width: 100%; }

		.staffModal.studentModal .entry-images textarea { resize: none; }

	.staffModal.studentModal .btn-group label { font-style: normal; font-weight:600; font-size: 12px; text-align: center;  }

	.staffModal.studentModal .entry-program { width:70%; }
	.staffModal.studentModal .entry-address { width:70%; }

	.staffModal.studentModal textarea.form-control { height:204px;}

	.staffModal.studentModal .modal-footer .alignRight { padding-right: 32px; }
	.staffModal.studentModal .modal-footer .form-group { margin-bottom: 0; }

	.staffModal.studentModal .modal-footer .row > div { padding-top:0; }


	/* Entry Items - Student */

	/*.staffModal.studentModal .typeForms > li form { display:flex;display:flex; flex-direction: row; flex-wrap: wrap;
    justify-content: flex-start; align-content: flex-start; align-items: flex-start; }*/

    	.staffModal.studentModal form .modal-body { overflow-y:scroll; }

	.staffModal.studentModal form hr { width:70%; margin-top:10px; margin-bottom:0px; }


	/* Entry Items - Staff */

	/* Entry Items - Supplier */

	.supplierModal .entry-info { width:100%; }











/* -------------- CONTENT AREA ----------------------------------------------------- */

.outerWrapper { width:100%; margin: auto; min-width: 534px; max-width: 1920px; height: 100%; }

	.outerWrapper > form { height: 100%; }

	.outerWrapper .innerWrapper {
		height: 100%; padding-top:50px;
	}

		.outerWrapper .innerWrapper	.mainBody { height: 100%; padding-top:15px; }

				.outerWrapper .innerWrapper	.mainBody > div { height:100%;}



/* -------------- ADMIN PAGES ----------------------------------------------------- */

.standardTable { padding: 20px; }
.standardTable table { width:100%; margin-top:20px; }
.standardTable table td p,
.standardTable table td img { margin:5px; vertical-align: middle; }
.standardTable .headerRow tr { border-bottom:3px solid #CCC; font-weight:bold; background: white; }
.standardTable .noDataMsg { text-align: center; font-style: italic; color: #444; padding: 9px; }
.standardTable .tableCont span { margin:0 20px; }

.staffModal.studentModal .thumbnail { border: dashed 2px #CCC;
/*border-image:url("/images/border.png") 10 round; border-image-width: 1;*/  }

.icsModal .defaultPicture { text-align: center; }
.icsModal .errMsgPop { z-index: 500; position: absolute; text-align: center;  bottom:60px; left: 0; border-radius: 5px; color:white; width:100%; height:29px; background: rgba(0,0,0,0.8); }

	.icsModal .loginBlock .errMsgPop { bottom: 90px; }

		.icsModal .errMsgPop p { margin: 4px; font-size: 14px;  }
		.icsModal .errMsgPop span { border-width:15px 15px 0; width:0; height:0; border-color:rgba(0,0,0,0.8) transparent; border-style: solid; content: ""; display:block;
		position: absolute; bottom:-15px; left:43%; }


.staffModal.studentModal .defaultPicture img { margin:15px 0; max-width: 287px; width: 100%; }

.staffModal.studentModal .statusBox { display: none; }


/* -------------- PANELS ----------------------------------------------------- */

.panel { border-radius: 0; margin-bottom:15px; padding-top:0; }

.panel .typeSelect + span { width: 100%; padding: 0; margin:0; }
.select2 { width: 100% !important; min-height: 34px; }



/* -------------- FLEX LAYOUTS ----------------------------------------------------- */

.flex { display:flex; height:100%; flex-direction:column; align-items:stretch; }


/* -------------- FLEX PANELS ----------------------------------------------------- */

	.flex .header.panel { padding: 0; border:0; background: #456a98; }

	.flex .filter.panel { padding: 0; border:0; background: #456a98; }

		.flex .filter.panel .row { margin: 0 0 10px 0; }

		.flex .filter.panel label { color:white; padding-top: 10px; text-transform:uppercase; font-weight: normal; letter-spacing: 2px; font-size:10px; }


		.flex .filter.panel .expiredSelect { }
		.flex .filter.panel .genderSelect { }

		.flex .filter.panel .searchBox { color:#444; line-height: 28px; font-size: 16px; padding-left:8px; }
		/*
		.flex .filter.panel .resetBtn { margin-top:25px; }
		.flex .filter.panel .resetBtn[disabled] { display:none; }
		*/
		.flex .filter.panel .resetBtn { margin-top:28px; }
		.flex .filter.panel .divider { margin-top: 33px; text-align: center; }


	.flex .content.panel { padding-top:0; flex:15; overflow-y: hidden; }

	.flex .controls { background: #456a98; }
	.flex .controls .row { margin:5px 0; }

	.flex .tabs { height:auto; background: #456a98; }
	.flex .tabs.panel { border:none; padding-top:0; }
	.flex .tab-content { flex:1; overflow-y: hidden;  }


			.flex .tab-content .detailTab .studentTop { height:300px; }
			.flex .tab-content .detailTab .studentBot { flex:1; overflow-y: scroll; }


	/* GRID AREA */

	.mainTblContainer .tab-content { height:100%; }
	.mainTblContainer > .panel { margin-bottom:0; }

	.mainTblContainer .noResultsWrapper { top:0; bottom:0; left:0; right:0; position: absolute; z-index: 500; background: lightgray; opacity: 0.6; }
	.mainTblContainer .noResultsWrapper:after { content: "No data was found..."; color:black; font-weight: bold; font-size: 24px; text-align: center;
width: 100%; height: 100%; top:50%; margin-top:-35px; display: block; position: absolute; z-index: 11; opacity: 0.8;}

	.mainTblContainer .loadingSearch { display: none; background:rgba(255,255,255,0.6); height:100%; width:100%; z-index: 10; position: absolute;; }
	.mainTblContainer .loadingSearch:after { content: "Searching ..."; color:black; font-weight: bold; font-size: 24px; text-align: center;
width: 100%; height: 100%; top:50%; margin-top:-35px; display: block; position: absolute; z-index: 11; opacity: 0.8;}

	.mainTblContainer .loadingSearch.noResults:after { content: "No Results Found"; }

	#gridStudent,
	#gridStaff,
	#gridSupplier { height:100%; }

	/* NAVIGATION TABS ------------ */

	.nav-tabs { border-bottom:none; }
	.nav-tabs > li { margin-bottom:0; }
	.nav-tabs > li > a { color:white; border-radius:0; margin-right:0; border:none; }
	.nav-tabs > li > a:hover { background: #8296af; color:#292e35; border-color:#8296af; }
	.nav-tabs > li.active > a { background: white; color:black; }

	/* LEFT COL PANELS ------------ */

	.leftCol {  }

		.leftCol .filter > div > input,
		.leftCol .filter > div > select { width:100%; margin:0; }

		.tabBar { position: relative; }

			.tabBar > div { margin:5px; }

			.dojoSelectWrapper { position: absolute; top: 0; right: 0; width: 170px; }


		.leftCol .revealFilters { color: white; padding: 0; margin: 0; text-align: center; text-decoration: underline; font-size: 13px;
		cursor: pointer; padding-top:5px; padding-bottom:5px; }
		.leftCol .revealFilters:hover { background: #4c75a8; border:0; }

			.leftCol .revealFilters p { padding: 0; margin: 0; }

		.leftCol .header .row { padding-top:0px; padding-bottom:5px; }


		.leftCol .filterRow { padding:0 15px 0 15px; display:flex; flex-direction:row; flex-wrap:wrap; }
		.leftCol .filterRow > div { padding-left:10px; padding-right: 10px; }




		.leftCol .addTypeBox > div { float:left; }
		.leftCol .addTypeBox > div:nth-child(1) { width:70%; }
		.leftCol .addTypeBox > div:nth-child(2) { width:30%; padding-left:10px; }

		.leftCol .selectControls > div { float:left; width:50%; }
		.leftCol .selectControls > div:nth-child(2) { padding-left:10px; }

		.standardLayout .header h4 { color:white; font-weight:bold;  }




	/* RIGHT COL PANELS ------------ */

	.rightCol  { padding-left: 0; }
	.rightCol .tabs.panel { margin-bottom: 0; display:flex; }

	.rightCol .init .studentTop .thumbnail { border:none;  }
	.rightCol .init .studentBot .list-group { display: none; }
	.rightCol .supplierLayout { display:none; }

		.rightCol .panel .panel-heading { box-shadow: none; margin: 0; padding: 0; border:none; }
		.rightCol .panel .panel-body { padding: 0; margin:0; }

		.row .btnContainer { flex:1; display:flex; justify-content: flex-end; align-items: center; }

		.row .btnContainer .btn.editBtn,
		.row .btnContainer .btn.editSupplierBtn,
		.row .btnContainer .btn.exportLogBtn,
		.row .btnContainer .btn.addNote { border-radius: 0; height:33px;
		margin:0 3px; width:100px; }

.btn.btn-primary.editBtn { padding: 0; }


			/* Details Pane */

			.detailTab { height:100%; }
			.detailTab .studentTop { text-align: center; padding-top: 14px; }

				.detailTab .studentTop img.profile { height: 170px; margin:auto; margin-bottom:15px; display:block; }
				.detailTab .studentTop img.belt { margin-bottom:15px; width:100%; max-width: 200px; cursor: pointer; }

			.detailTab .studentBot { font-size:13px; text-align:right; border:none; overflow-y:scroll; height: 65%; }

				.detailTab .studentBot li { height:auto; padding: 0;  }

					.detailTab .studentBot li span { float: left; width: 100px; padding-right:20px; font-weight: bold; height: 100%; padding: 10px 0; }

					/*.detailTab .studentBot li p { text-align: left; padding-left:140px; margin-bottom: 0; padding: 10px 0 10px 120px; max-width: 100%; }*/
					.detailTab .studentBot li p { text-align: left; height: 100%; padding:0; margin:10px 20px 0 115px; max-width: 100%; }

					.detailTab .studentBot li p:after { clear: both; content:''; display:block; width:1px; height:1px; }

			#sideLogs { height:100%; }

				#sideLogs .logList { height:100%; overflow-y:scroll; display:block; position: relative; }
	
				#sideLogs .logList td { -moz-user-select:text !important; }
					

			#sideSupplier.detailTab .studentBot { height:100%; }


			/* Logs Pane */

			.logTab { height:100%; }
			.logTab table { width:100%; }

				.logTab table tr td { border-bottom: 1px solid #dddddd; font-size:13px; }

				.logTab table tr td:first-child { }

					.logTab table tr td p { padding: 10px; margin:0; color:black; }

					.logTab table tr td span { color:#888; }


			.logTab table:first-child { background:#efefef; }

				.logTab table:first-child tr td:first-child {  }

			.logTab .ackBtn { background: url('/images/logs-default.png') no-repeat; display: block; width:28px; height:28px; }
			.logTab .ackBtn.acknowledged { background: url('/images/logs-confirmed.png') no-repeat; cursor: default; }

			.logTab tr.alertRow { background-color: #da8585; }
			.logTab tr.confirmRow { background-color: #b9e2a2; }






/* -------------- PAGE OVERRIDES ----------------------------------------------------- */





	/* LOGIN PAGE ------------ */

	.login-page .top-right { position: absolute; right: 10px; top: 18px; }
	.login-page .content { text-align: center; margin-top:-20%; }
	.login-page .title { font-size: 84px; font-family: 'Raleway', sans-serif; font-weight: 100; }
	.login-page .links > a { color: #636b6f; padding: 0 25px; font-size: 12px; font-weight: 600; letter-spacing: .1rem;
				text-decoration: none; text-transform: uppercase; }
	.login-page .m-b-md { margin-bottom: 30px; }
	.login-page .panel-default > .panel-heading {  }


		/* ATTENDANCE STYLE ------------ */

		.alertwrap { align-items:flex-start; align-content:flex-start; display:flex; flex-flow:row wrap; justify-content:flex-start; }

			.alertwrap .alertimg { margin-left: 50px; }
			.alertwrap img { width: 95px; border-radius: 50px; box-shadow: 0px 2px 1px rgba(0,0,0,0.3);  }

			.alertwrap .alertmsg { flex:1; }

				.alertwrap .alertmsg p { text-align: left; padding-top:34px; padding-left:38px; font-size: 16px; }

				.alertwrap .alertmsg .renew {
					font-weight:bold; border:2px solid maroon; padding:10px; margin:20px 70px 10px 39px;
					text-align: center; color:white; background:maroon;
				}

				.alertwrap .alertmsg .renew+p {
					padding-top:4px;
					padding-left:38px;
				}



	/* PROGRAMS PAGE ------------ */
    .panel.filter.program { padding-left: 0; width: 100%; }
        .panel.filter.program h3 { color: #fff; }
            .panel.filter.program button { margin-top: 17px; }


	/* RANKS PAGE ------------ */
    .panel.filter.ranks { padding-left: 0; width: 100%; }
        .panel.filter.ranks h3 { color: #fff; }
            .panel.filter.ranks button { margin-top: 17px; }


	/* KEY RUNS PAGE ------------ */
    .panel.filter.keyruns { padding-left: 0; width: 100%; }
        .panel.filter.keyruns h3 { color: #fff; }
            .panel.filter.keyruns button { margin-top: 17px; }

    .keyrunTable .fullAdjust { width: 180px; -webkit-transition: min-width 0.5s; transition: min-width 0.5s; }
	.keyrunTable .halfAdjust { width: 80px; -webkit-transition: min-width 0.5s; transition: min-width 0.5s;  }


	/* DOJO PAGE ------------ */
    .panel.filter.dojo { padding-left: 0; width: 100%; }
        .panel.filter.dojo h3 { color: #fff; }
            .panel.filter.dojo button { margin-top: 17px; }


	/* USER PROFILE LOGIN ------ */

	.userProfile .noResultsWrapper { top:0; bottom:0; left:0; right:0; position: absolute; z-index: 500; background: #AAA; opacity: 0.6; }
	.userProfile .noResultsWrapper:after { content: "No log data was found..."; color:black; font-weight: bold; font-size: 24px; text-align: center;
width: 100%; height: 100%; top:50%; margin-top:-35px; display: block; position: absolute; z-index: 11; opacity: 0.8;}

	.userProfile .form-control[disabled], .form-control[readonly], fieldset[disabled] .form-control {
		border:1px #ececec solid; color:#0a0a5b; background:#fafafa;
	}

	.userProfile .standardLayout > .panel { position: relative; }

	.userProfile .buttons { position: absolute; top: 5px; right:0; }

	.userProfile .buttons button {
		border-radius: 0; height:33px; margin:0; width:auto; float:right; position: relative; padding:0 13px; margin-right:5px;
	}

	.userProfile #sideDetails .flex { align-items:flex-start; align-content:flex-start; display:flex; flex-flow:row wrap; justify-content:flex-start;
	overflow-y:scroll; position: relative; }

	.userProfile #sideDetails .flex > div { width:100%; -webkit-transition: width 0.5s; transition: width 0.5s;
	-webkit-transition: margin-left 0.5s; transition: margin-left 0.5s; }

	.userProfile #sideDetails h4,
	.userProfile #sideDetails .seperator { display:inline-block; vertical-align: middle; }

	.userProfile #sideDetails .flex > .entry-images { width: 20%; height: 140px; text-align: center; }

	.userProfile #sideDetails .flex > .entry-general { margin-left: -2%; width: 80%; }
	.userProfile #sideDetails .flex > .entry-general.adminview { margin-left: 0; width: 100%; }

	.userProfile #sideDetails .flex > .entry-info { margin-left:18%; }
	.userProfile #sideDetails .flex > .entry-info.adminview { margin-left: 0; }

	.userProfile #sideDetails .flex > .entry-address { margin-left:18%; padding-bottom:30px; }

	.userProfile #sideDetails .noteBox { text-align: left; }
	.userProfile #sideDetails .noteBox textarea { resize:none; }

	.userProfile #sideDetails hr { width:90%; margin:10px auto; }
	.userProfile #sideDetails .seperator { color: #CCC; margin: 0 10px; vertical-align: top; }
	.userProfile #sideDetails h4 { margin-right:10px; }

	.userProfile #sideDetails .miniLab { color:#1c3d66; font-style: italic; letter-spacing: 2px; margin-right:10px; font-size: 12px; vertical-align: middle; }
	.userProfile #sideDetails .form-group > div { padding-top:15px; }

	.userProfile #sideDetails .thumbnail { margin:20px auto 10px auto; }
	.userProfile #sideDetails .thumbnail,
	.userProfile #sideDetails .belt { width: 100%; max-width: 290px; }

	.userProfile #sideProgram .flex > .entry-program { margin-top:35px; }


	.standard-page #messageDialog { height:100px; }


/* -------------- CALENDAR SECTION ----------------------------------------------------- */


	.event_active { background:#aee2fe; color:black; }
	.event_complete { background:#c8ccfe; color:black; }
	.event_cancel { background:#febcbc; color:black; }

	.dhx_cal_cover { z-index: 900; }

	#addEventModal .searchBox { margin-bottom:10px; }

	.connectedSortable { width: 100%; min-height: 20px; list-style-type: none; margin: 0; padding: 5px; float: left; height:300px;
	overflow-y:scroll; background: #EEE; border:1px solid #CCC; }

	.connectedSortable li { border:1px solid #CCC; margin: 2px 0; padding: 3px 0 3px 10px; font-size: 1.0em; width: 100%; background: white;
	cursor:pointer; }

	#addEventModal .searchBox + .connectedSortable { height:210px; }

	#addEventModal .addAllUsers { width:30%; float:left; margin-top:10px; }
	#addEventModal .removeAllUsers { width:30%; float:right; margin-top:10px; }


	#addEventModal { opacity:1; }
    #addEventModal label { width: 200px; }

    .dhx_cal_event, .dhx_cal_event_clear, .dhx_cal_event_line { padding: 1px 6px 2px 8px; }
    .dhx_cal_event .dhx_body, .dhx_cal_event_line { font-size: 8pt; font-family: inherit; }
    .dhx_cal_event_clear { height: auto; }
    .dhx_cal_event_line { border: none; height: auto; line-height: inherit; }

/* -------------- TOOLS ----------------------------------------------------- */

.loading { cursor: wait !important; opacity:0.5 !important; }

.hideMe { display:none !important; }

.divider { color:rgba(255,255,255,0.5); }

.flex { display:flex; }
.flex1 { flex:1;  }
.flex2 { flex:2;  }
.flex3 { flex:3;  }

.full-height { height: 100vh; }
.over-scroll { overflow-y:scroll; }

.flex-float { display:flex; height:100%; align-items:stretch; }
.flex-center { align-items: center; display: flex; justify-content: center; }
.position-ref { position: relative; }

.alignRight { text-align: right; }
.alignLeft { text-align: left; }

.clearFix { clear: both; }

.BordRad { border-radius: 4px!important; }


.floatLeft { float: left; }
.floatRight { float: right; }



/* -------------- REPSONSIVE ----------------------------------------------------- */

@media only screen and ( min-width: 1601px ) {

	.keyrunTable .fullAdjust { width: 250px; }
	.keyrunTable .halfAdjust { width: 60px; }

}

@media only screen and ( max-width: 1600px ) {

	.userProfile #sideDetails .flex > .entry-images { width: 30%; }
	.userProfile #sideDetails .flex > .entry-general { width: 70%; }

	.userProfile #sideDetails .flex > .entry-info,
	.userProfile #sideDetails .flex > .entry-program,
	.userProfile #sideDetails .flex > .entry-address { margin-left:28%; }

	.userProfile #sideDetails hr { width:70%; margin:10px auto 10px 28%; }

	.keyrunTable .fullAdjust { width: 250px; }
	.keyrunTable .halfAdjust { width: 60px; }

	/*.filterRow { background: green; }*/

}

@media only screen and ( max-width: 1199px ) {

	/*.filterRow { background: brown; }*/
	.filterRow > div:nth-child(1) { flex:75%; }
	.filterRow > div:nth-child(2) { flex:25%; }

	.filterRow > div:nth-child(3) { flex:25%; }
	.filterRow > div:nth-child(4) { flex:25%; }
	.filterRow > div:nth-child(5) { flex:20%; }
	.filterRow > div:nth-child(6) { flex:5%; }
	.filterRow > div:nth-child(7) { flex:25%; max-width: 25%; }


}

@media only screen and ( max-width: 991px ) {

    .clearFixMed { clear: both; }

    .staffModal.studentModal .entry-info,
    .staffModal.studentModal .entry-images,
    .staffModal.studentModal .entry-program,
    .staffModal.studentModal .entry-address,
    .staffModal.studentModal .typeForms > li hr { width: 100%; }

    .staffModal.studentModal .entry-images { height: auto; }

    .staffModal.studentModal .entry-info:after { content: ""; width: 100%; background-color: red; height: 1px;  }

	/*.filterRow { background: red; }*/
	.filterRow > div:nth-child(5) { flex:25%; }
	.filterRow > div:nth-child(6) { display:none; }
	.filterRow > div:nth-child(7) { flex:100%; }


	.leftCol .addTypeBox > div { float:none; width:100%; }
	.leftCol .addTypeBox > div:nth-child(2) { padding-left:0; padding-top:10px; }

	.leftCol .selectControls > div { float:none; width:100%; }
	.leftCol .selectControls > div:nth-child(2) { padding-left:0; padding-top:10px; }


}

@media only screen and ( max-width: 767px ) {


    .userProfile #sideDetails .flex > .entry-general { width: 100%; margin-left: 0; position: absolute; top:0; left: 0; }
    .userProfile #sideDetails .flex > .entry-general.adminview { position: relative; top:auto; left: auto; }
    .userProfile #sideDetails .flex > .entry-images { width: 100%; height:auto; padding-top:110px; }
    .userProfile #sideDetails .noteBox textarea { height:50px; }

    .userProfile #sideDetails .flex > .entry-info,
    .userProfile #sideDetails .flex > .entry-program,
    .userProfile #sideDetails .flex > .entry-address { margin-left: 0; }

	.userProfile #sideDetails h1 { text-align: center; }
    .userProfile #sideDetails h4 { font-size: 14px; }
    .userProfile #sideDetails .subHeaders { display:flex; justify-content:center;  margin: auto; }

	/*.filterRow { background: blue; }*/

    .clearFixSm { clear: both; }
    .col-xs-12.rightCol { padding-left: 15px; }
    .flex .filter.panel .resetBtn  { margin-top: 33px; }
    .flex .filter.panel .divider { margin-top: 38px; }

    .navbar-brand { left: 90px !important; }

    #app-navbar-collapse { clear: both; }
    #app-navbar-collapse ul { display: table; margin: auto; }
    #app-navbar-collapse ul li { display: table-cell; }

    li.dropdown.open ul { position: absolute!important; right: 0; bottom: 0px; z-index: 2; height: 50px;}

    .staffModal.studentModal .entry-images .defaultPicture p { bottom:40px; }

	.tableScaler { min-width:0;  }
}


@media only screen and ( max-width: 596px ) {

	.userProfile #sideDetails .flex > .entry-images { padding-top:130px; }

	.userProfile #sideDetails .subHeaders { display:flex; flex-direction:row; flex-wrap:wrap;  margin: auto; width:100%; }
	.userProfile #sideDetails .subHeaders h4 { flex: 1 0 40%; }
	.userProfile #sideDetails .subHeaders h4:last-child { flex:0 1 100%;  }


}

@media only screen and ( max-width: 461px ) {


    .clearFixXS { clear: both; }

    .staffModal.studentModal .entry-info,
    .staffModal.studentModal .entry-images,
    .staffModal.studentModal .entry-program,
    .staffModal.studentModal .entry-address,
    .staffModal.studentModal .typeForms > li hr { width: 100%; }

    .staffModal.studentModal .entry-images { height: 100%; }

    .staffModal.studentModal .entry-info:after { content: ""; width: 100%; background-color: red; height: 1px;  }
    .staffModal.studentModal .modal-footer .alignRight { padding-right: 0px; }

    .navbar-brand { left: 59px; }


}


/* -------------- USER LOGIN ----------------------------------------------------- */

.rightCol.userLogin { padding-left:15px; }


/* -------------- CALENDAR PAGE WRAPPER ----------------------------------------------------- */

.outerWrapper .calendarWrapper .mainBody { padding-top:0; }

.calendarWrapper div[class^="col-"] { padding-left:0; padding-right:0; }

/* -------------- TOOLS - BUTTON GROUP AUTO WIDTH ----------------------------------------------------- */

.btn-group.fullWidth-2 { width:100%; }
.btn-group.fullWidth-2 > label { width: 50%; }

.btn-group.fullWidth-3 { width:100%; }
.btn-group.fullWidth-3 > label { width: 33.3%; }

.btn-group.fullWidth-4 { width:100%; }
.btn-group.fullWidth-4 > label { width: 25%; }

.btn-group.fullWidth-5 { width:100%; }
.btn-group.fullWidth-5 > label { width: 20%; }

/* -------------- LOADER - ALERTS ----------------------------------------------------- */

.loaderWrapper .msgAlert {
	position: absolute; top: 50%; left:50%; margin-left:-84px; margin-top:-70px;
	height:141px; width:168px; opacity: 0; text-align: center;;
}

.loaderWrapper .msgAlert img { width:100%; max-width: 108px; }

.loaderWrapper .msgAlert p { color: white; font-weight: bold; font-size: 20px; margin-top: 20px; }


/* -------------- LOADER - MODAL SPINNER ----------------------------------------------------- */

.loaderWrapper {
	width:100%; height: 100%;
	bottom:0; top:0; right:0; left:0; position: fixed;
	display:flex; align-items: center; justify-content: center;
	background: rgba(0,0,0,0.7);
  	z-index: 99999;
}

.pageLoader {
  margin: auto;
  font-size: 10px;
  position: relative;
  text-indent: -9999em;
  border-top: 1.1em solid rgba(255, 255, 255, 0.2);
  border-right: 1.1em solid rgba(255, 255, 255, 0.2);
  border-bottom: 1.1em solid rgba(255, 255, 255, 0.2);
  border-left: 1.1em solid #ffffff;
  -webkit-transform: translateZ(0);
  -ms-transform: translateZ(0);
  transform: translateZ(0);
  -webkit-animation: load8 1.1s infinite linear;
  animation: load8 1.1s infinite linear;
}
.pageLoader,
.pageLoader:after {
  border-radius: 50%;
  width: 10em;
  height: 10em;
}


@-webkit-keyframes load8 {
  0% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  100% {
    -webkit-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}

@keyframes load8 {
  0% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  100% {
    -webkit-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}