/* General -----------------------------------------------------------------------------*/

* { font-family: 'Open Sans', sans-serif; line-height: 1; }
html { height: 100%; width: 100%; }

body { color: #808080; }
a { color: #666666; }
p + p { margin-top: 10px; }

#mainCtr { margin: 40px auto; width: 90%; }
body.logout { display: flex; height: 100%; padding: 50px; }
body.logout #mainCtr { margin: auto; width: 400px; }

.logo { font-size: 3rem; color: #1E51F7; font-weight: 700; text-decoration: none; }

header { border-bottom: 2px solid #e6e6e6; padding-bottom: 20px; margin-bottom: 40px; }

header nav ul { list-style: none; margin: 0; padding: 0; }
header nav ul li, header nav ul li a { margin: 0; text-decoration: none; font-size: 1.4rem; }

#breadcrumb { list-style: none; margin: 0; padding: 0; font-size: 1.3rem; margin: -10px 0 20px; }
#breadcrumb li { margin-right: 5px; }
#breadcrumb li, #breadcrumb li a { display: inline-block; text-decoration: none; font-weight: 400; color: #666; }
#breadcrumb li a:hover, #breadcrumb li a:focus { text-decoration: underline; }

#footerNav { border-top: 2px solid #f0f0f0; padding-top: 20px; margin-top: 50px; }
#footerNav ul { text-align: center; list-style: none; margin: 0; padding: 0; font-size: 1.3rem; }
#footerNav ul li, #footerNav ul li a { display: inline-block; text-decoration: none; font-weight: 300; color: #aaa; }
#footerNav ul li a:hover, #footerNav ul li a:focus { text-decoration: underline; }

h1 { color: #1E51F7; font-weight: 300; font-size: 2.4rem; font-family: 'Open Sans', sans-serif; }
h2 { color: #1E51F7; font-weight: 300; font-size: 2rem; font-family: 'Open Sans', sans-serif; }

hr { height: 2px; margin: 30px 0; background: #f0f0f0; }

.button-link { margin: 0 0 0 20px; font-size: 1.3rem; color: #999; text-decoration: none; }

.box { background: #eee; padding: 30px; } .box-border { border: 2px solid #eee; padding: 30px; }
.box + * { margin-top: 30px; }

.text-right { text-align: right; } .text-center { text-align: center; }

.boxTitle { line-height: 32px; }
.boxTitle + .pannel, .pannel + .pannel { margin-top: 20px; padding-top: 20px; border-top: 2px solid #e6e6e6; }
.pannel { display: none; }
[data-target] { cursor: pointer; }

.ui-datepicker { background: #fff; padding: 20px; border: 2px solid #e6e6e6; display: none; }
.ui-datepicker table { margin: 0; }
.ui-datepicker-header { padding-bottom: 10px; font-size: 80%; }
.ui-datepicker-title { text-align: center; }
.ui-datepicker-prev { float: left; cursor: pointer; padding: 2px 10px; }
.ui-datepicker-next { float: right; cursor: pointer; padding: 2px 10px; }
.ui-datepicker tbody td { padding: 0; }
.ui-datepicker tbody td a { padding: 10px 0; text-align: center; display: block; text-decoration: none; }
.ui-datepicker tbody td span.ui-state-default { padding: 10px 0; text-align: center; display: block; opacity: .5; }
.ui-datepicker tbody td.ui-datepicker-today .ui-state-default { font-weight: bold; }

.scrollTop { position: fixed; cursor: pointer; bottom: 50px; right: 20px; display: block; background: #f0f0f0; width: 40px; height: 40px; line-height: 40px; text-align: center; }

.data-number { font-family: monospace; }
.no-underline { text-decoration: none; }

#overlay { position: fixed; width: 100%; height: 100%; background: rgba(255, 255, 255, .8); top: 0; left: 0; }
#pop { width: 600px; overflow: auto; transition: all .3s; max-width: 90%; max-height: 80%; padding: 30px; background: #fff; position: fixed; box-shadow: 0 0 100px 0 rgba(0, 0, 0, .2); top: 10%; left: 50%; margin-left: -300px; }
#pop #close { position: absolute; cursor: pointer; top: 10px; right: 10px; font-size: 40px; line-height: 40px; height: 40px; width: 40px; text-align: center; }

.tooltip { position: absolute; width: 150px; padding: 15px; color: #fff; background: #1E51F7; left: 50%; margin-left: -75px; bottom: 30px; }
.tooltip:before { content: ""; position: absolute; bottom: -6px; left: 50%; margin-left: -6px; width: 0; height: 0; border-style: solid; border-width: 6px 7px 0 6px; border-color: #1E51F7 transparent transparent transparent; }

.flexRow { display: flex; margin: 0 -10px; flex-wrap: wrap; }
.flexRow > * { width: calc(25% - 20px); margin: 0 10px; }
.flexRow > *:nth-child(n+5) { margin-top: 20px; }

.reports-link { text-align: center; padding: 20px !important; }
.reports-link .fa { display: block; font-size: 200%; margin-bottom: 10px; }
.reports-link span { display: block; }
.reports-link .title { font-size: 140%; }
.reports-link .desc { font-size: 90%; margin-top: 10px; }

/* Table -----------------------------------------------------------------------------*/

.table, table { table-layout: auto; border: 0; }

td, th { border: 0; font-size: 1.4rem; vertical-align: middle; }
/*tr td:first-child, tr th:first-child { padding-left: 0; }*/

thead { border-bottom: 2px solid #1E51F7; }
th { color: #1E51F7; font-weight: normal; }
th a { color: #1E51F7; text-decoration: none; font-weight: bold; }

tbody tr:not(:first-child) { border-top: 2px solid #f0f0f0; }

.actions a, .actions .btn { color: #666666; background: #eee; position: relative; padding: 0 6px; text-decoration: none; display: inline-block; min-width: 26px; text-align: center; line-height: 24px; height: 24px; font-size: 1.2rem; border-radius: 2px; box-shadow: 0px 1px 0px 0px #aaa; }
.actions a i, .actions .btn i { font-size: 1.4rem; }
.actions a:hover, .actions a:focus, .actions .btn:hover, .actions .btn:focus { top: 1px; box-shadow: 0px 0px 0px 0px #aaa; }

td .light { text-decoration: none; font-size: 80%; opacity: .5; }

tbody tr:hover { background: #f9f9f9; }

tbody tr.contactLine { border-top: 0; }

.verticalTable th { width: 20%; }

tr .showOnTrHover { opacity: 0; } tr:hover .showOnTrHover { opacity: 1; }

/* Form -----------------------------------------------------------------------------*/

form.center { max-width: 400px; }

form .input label, form .input input, form .input select, form .input textarea { display: block; }

form .input label { margin: 0; }

form .input input, form .input select, form .input textarea, #liveSearch, .ms-choice { border: 2px solid #e6e6e6; line-height: 1.5; width: 100%; padding: 6px 10px; color: #666; font-weight: 300; }
#liveSearch { width: auto; font-size: 80%; padding: 2px 4px; }

form .input label + input, form .input label + select, form .input label + textarea { margin-top: 5px; }

form * + .input, form .input + .input, form .row + .row { margin-top: 20px; }

form .row { display: flex; margin: 0 -1%px; }
form .row .input { margin: 0 1%; width: calc(20% - 2%); }
form .row .input.small { margin: 0 1%; width: calc(10% - 2%); }
form .row button[type='submit'] { margin: 2px 10px; height: 32px; }

button[type='submit'], .btn { border: 0; text-decoration: none; cursor: pointer; position: relative; margin: 0 auto; display: inline-block; background: #1E51F7; color: #fff; border-radius: 3px; padding: 8px 12px; font-size: 1.4rem; box-shadow: 0px 3px 0px 0px #1A31A5; }
button[type='submit']:hover, .btn:hover { color: #fff; top: 1px; box-shadow: 0px 2px 0px 0px #1A31A5; } button[type='submit']:focus, .btn:focus { color: #fff; top: 2px; box-shadow: 0px 1px 0px 0px #1A31A5; }
button[type='submit'] { margin-top: 20px; }

.btn.btn-text { background: 0; border: 0; box-shadow: none; color: #aaa; }
.btn.btn-text:hover, .btn.btn-text:hover {  }

.input.checkbox input { width: auto; display: inline-block; margin-right: 10px; }

form .error-message { color: #fff; background: #db4b4b; position: relative; padding: 10px; font-size: 1.2rem; margin-top: 5px; }
form .error-message:before { content: ''; top: -7px; border-width: 0 6px 7px 6px; border-color: transparent transparent #db4b4b transparent; position: absolute; display: block; width: 0; height: 0; border-style: solid;  }

.input.required label { font-weight: bold; } .input.required label:after { content: ' *'; }

h1 .btn, h2 .btn { margin-top: -5px; }

/* Pagination -----------------------------------------------------------------------------*/

.paginator { text-align: center; }
.paginator p {  font-size: 1.2rem; }

.pagination { padding: 0; list-style: none; }
.pagination li, .pagination li a { display: inline-block; text-decoration: none; }
.pagination li { border: 2px solid #e6e6e6; margin: 0 2px; }
.pagination li a { padding: 0px 8px; line-height: 24px; font-size: 1.4rem; min-width: 22px; text-align: center; }

/* Notifications -----------------------------------------------------------------------------*/

.message { color: #fff; background: #248ac2; position: relative; padding: 20px 40px 20px 20px; margin-bottom: 20px; line-height: 1.2; }
.message.error { background: #db4b4b; }
.message.success { background: #86c224; }
.message:after { content: '×'; display: block; position: absolute; top: 0; right: 0; font-size: 2.4rem; width: 40px; height: 40px; line-height: 40px; text-align: center; cursor: pointer; }

/* Hamburger -----------------------------------------------------------------------------*/

#nav-icon { width: 25px; height: 25px; position: relative; -webkit-transform: rotate(0deg); -moz-transform: rotate(0deg); -o-transform: rotate(0deg); transform: rotate(0deg); -webkit-transition: .5s ease-in-out; -moz-transition: .5s ease-in-out; -o-transition: .5s ease-in-out; transition: .5s ease-in-out; cursor: pointer; }
#nav-icon span { display: block; position: absolute; height: 4px; width: 100%; background: #808080; border-radius: 9px; opacity: 1; left: 0; -webkit-transform: rotate(0deg); -moz-transform: rotate(0deg); -o-transform: rotate(0deg); transform: rotate(0deg); -webkit-transition: .25s ease-in-out; -moz-transition: .25s ease-in-out; -o-transition: .25s ease-in-out; transition: .25s ease-in-out; }
#nav-icon span:nth-child(1) { top: 0px; -webkit-transform-origin: left center; -moz-transform-origin: left center; -o-transform-origin: left center; transform-origin: left center; }
#nav-icon span:nth-child(2) { top: 8px; -webkit-transform-origin: left center; -moz-transform-origin: left center; -o-transform-origin: left center; transform-origin: left center; }
#nav-icon span:nth-child(3) { top: 16px; -webkit-transform-origin: left center; -moz-transform-origin: left center; -o-transform-origin: left center; transform-origin: left center; }
#nav-icon.open span:nth-child(1) { -webkit-transform: rotate(45deg); -moz-transform: rotate(45deg); -o-transform: rotate(45deg); transform: rotate(45deg); top: 0px; left: 2px; }
#nav-icon.open span:nth-child(2) { width: 0%; opacity: 0; }
#nav-icon.open span:nth-child(3) { -webkit-transform: rotate(-45deg); -moz-transform: rotate(-45deg); -o-transform: rotate(-45deg); transform: rotate(-45deg); top: 18px; left: 2px; }

/* Multiple select -----------------------------------------------------------------------------*/

.ms-parent { display: inline-block; max-width: 100%; position: relative; vertical-align: middle; font-size: 90%; }
.ms-choice { height: 40px; line-height: 40px; overflow: hidden; text-align: left; white-space: nowrap; text-decoration: none; background: #fff; }
.ms-choice.disabled { background: #f4f4f4; background-image: none; cursor: default; }
.ms-choice > span { position: absolute; top: 0; left: 10px; height: 40px; line-height: 40px; right: 30px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; display: block; padding-left: 8px; }
.ms-choice > span.placeholder { color: #999; }
.ms-choice > div { top: 17px; right: 12px; position: absolute; display: block; width: 0; height: 0; border-style: solid; border-width: 6px 4px 0 4px; border-color: #999 transparent transparent transparent; }
.ms-choice > div.open { background: url('multiple-select.png') right top no-repeat; }
.ms-drop { overflow: hidden; display: none; padding: 0; position: absolute; z-index: 1000; background: #fff; color: #000; border: 2px solid #e6e6e6; }
.ms-drop.bottom { top: 100%; -webkit-box-shadow: 0 4px 5px rgba(0, 0, 0, .15); -moz-box-shadow: 0 4px 5px rgba(0, 0, 0, .15); box-shadow: 0 4px 5px rgba(0, 0, 0, .15); }
.ms-drop.top { bottom: 100%; -webkit-box-shadow: 0 -4px 5px rgba(0, 0, 0, .15); -moz-box-shadow: 0 -4px 5px rgba(0, 0, 0, .15); box-shadow: 0 -4px 5px rgba(0, 0, 0, .15); }
.ms-search { display: inline-block; margin: 0; min-height: 26px; padding: 4px; position: relative; white-space: nowrap; width: 100%; z-index: 10000; }
.ms-search input { width: 100%; height: auto !important; min-height: 24px; padding: 0 20px 0 5px; margin: 0; outline: 0; font-family: sans-serif; font-size: 1em; border: 1px solid #aaa; -webkit-border-radius: 0; -moz-border-radius: 0; border-radius: 0; -webkit-box-shadow: none; -moz-box-shadow: none; box-shadow: none; background: #fff url('multiple-select.png') no-repeat 100% -22px; background: url('multiple-select.png') no-repeat 100% -22px, -webkit-gradient(linear, left bottom, left top, color-stop(0.85, white), color-stop(0.99, #eeeeee)); background: url('multiple-select.png') no-repeat 100% -22px, -webkit-linear-gradient(center bottom, white 85%, #eeeeee 99%); background: url('multiple-select.png') no-repeat 100% -22px, -moz-linear-gradient(center bottom, white 85%, #eeeeee 99%); background: url('multiple-select.png') no-repeat 100% -22px, -o-linear-gradient(bottom, white 85%, #eeeeee 99%); background: url('multiple-select.png') no-repeat 100% -22px, -ms-linear-gradient(top, #ffffff 85%, #eeeeee 99%); background: url('multiple-select.png') no-repeat 100% -22px, linear-gradient(top, #ffffff 85%, #eeeeee 99%); }
.ms-search, .ms-search input { -webkit-box-sizing: border-box; -khtml-box-sizing: border-box; -moz-box-sizing: border-box; -ms-box-sizing: border-box; box-sizing: border-box; }
.ms-drop ul { overflow: auto; margin: 0; padding: 10px 15px; }
.ms-drop ul > li { list-style: none; display: list-item; background-image: none; position: static; }
.ms-drop ul > li + li { margin-top: 4px; }
.ms-drop ul > li .disabled { opacity: .35; filter: Alpha(Opacity=35); }
.ms-drop ul > li.multiple { display: block; float: left; }
.ms-drop ul > li.group { clear: both; }
.ms-drop ul > li.multiple label { width: 100%; display: block; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ms-drop ul > li label { font-weight: normal; display: block; white-space: nowrap; }
.ms-drop ul > li label.optgroup { font-weight: bold; }
.ms-drop input[type="checkbox"] { vertical-align: middle; width: auto; display: inline-block; margin-right: 5px; }
.ms-drop .ms-no-results { display: none; }

/* Responsive -----------------------------------------------------------------------------*/

@media (min-width: 861px) {

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

	header nav ul li, header nav ul li a { display: inline-block; line-height: 26px; }
	header nav ul li a { padding: 5px 10px; }
	#mainNav { margin-left: 125px; padding-left: 10px; border-left: 1px solid #e6e6e6; }

	#nav-icon { display: none !important; }
	header nav ul { display: block !important; }

	.sub-menu { padding-top: 10px; visibility: hidden; opacity: 0; position: absolute; top: 30px; overflow: hidden; left: 0; margin-left: 0; z-index: 99; min-width: 280px; transition: top .3s, opacity .3s; }
	.sub-menu:before { content: ""; position: absolute; top: 3px; left: 0px; margin-left: 30px; width: 0; height: 0; border-style: solid; border-width: 0 6px 7px 6px; border-color: transparent transparent #1E51F7 transparent; }
	.sub-menu li { overflow: hidden; display: block; width: 100%; line-height: 16px; }
	.sub-menu li + li { border-top: 1px solid #1A31A5; }
	.sub-menu a { background: #1E51F7; width: 100%; line-height: 16px; padding: 11px 10px 10px 10px; border-bottom: 1px solid #1E51F7; text-transform: none; color: #fff; }
	
	.has-sub-menu { position: relative; }
	.has-sub-menu > a { padding-right: 22px !important; }
	.has-sub-menu > a:before { content: ""; top: 16px; right: 6px; position: absolute; display: block; width: 0; height: 0; border-style: solid; border-width: 6px 4px 0 4px; border-color: #999 transparent transparent transparent; }
	.has-sub-menu:hover .sub-menu, .has-sub-menu:focus .sub-menu { visibility: visible; opacity: 1; }
	
}

@media (max-width:860px) {

	header nav { margin-top: 10px; }
	header nav ul li + li { margin-top: 5px; }
	header nav ul li a { border: 2px solid #e6e6e6; border-radius: 3px; display: block; padding: 7px 12px; }

	#nav-icon { display: block !important; float: right; margin-top: 4px; }
	header nav ul { display: none; }

	.button-link { display: block; margin: 20px 0; }

}