@font-face { font-family: 'Social Font Face'; src: url('SocialFontFace.eot'); src: url('SocialFontFace.eot?#iefix') format('embedded-opentype'), url('SocialFontFace.woff') format('woff'), url('SocialFontFace.ttf') format('truetype'); font-weight: normal; font-style: normal; }

html {min-height: 100%; font-size: 16px;}
html > * { outline: none; }

body { font-family: Calibri, sans-serif;  margin: 42px 0.2% 0 0.5%;}
label {font-family: "Segoe UI",Arial,Verdana,sans-serif; font-weight: 600; color: #666;}
tr[ondblclick], tr[onclick] {cursor: pointer;}
input[type=number] {padding-right: 0;}
fieldset {display: block; margin-left: 2px; margin-right: 2px; padding-top: 0.35em; padding-bottom: 0.625em; padding-left: 0.75em; padding-right: 0.75em; border: 1px solid #ddd;}
legend {display: inline-block; width: auto; padding-left: 5px; padding-right: 5px; border: none; margin-bottom: 2px;}
h1, h2, h3, h4, h5, h6 {font-weight: bold;}


.paginginfo * {line-height: 2.5rem; height: 2.5rem;}
.invalid, .invalid:focus {border: 1px solid #F44236; box-shadow: 0 0 5px #F44236;}
.valid {border: 1px solid #4CAF50; box-shadow: 0 0 5px #4CAF50;}

#WebsiteHeader { background: #336699 url('/images/view-logo-h.svg') no-repeat fixed 3% 5px; background-size: 150px 30px; position: fixed; top: 0; left: 0; right: 0; height: 40px; text-align: center; z-index: 3; padding-right: 1%; }

#siteTitle { position: absolute; top: 17px; left: 5%; right: 5%; color: #ffffff; font-size: 2.25rem; font-weight: bold; line-height: 1; text-align: center; transform: translateY(-50%);}

#MainContent { margin-left: 3%; padding: 0.1%; background-color: #fff; }

#MainContentLite {  padding: 0.1%; background-color: #000000; }

#SideBar { position: fixed; top: 42px; left: 0.2%; bottom: 0; padding-top: 16px; padding-left: 0.3%; padding-right: 0.3%; border-right: 1px solid #d2d2d2; box-shadow: 3px 0 5px rgba(51, 51, 51, 0.75); z-index: 2; }
#SideBar .nav > li > a { padding: 0.45rem; transition: background 0.5s; }
#SideBar .nav > li > a:focus, #SideBar .nav > li > a:hover { background-color: #337AB7; color: #fff; text-shadow: 1px 1px 2px #333; }
#sbToggler {position: absolute; top: 0px; right: 0px; padding: 0 2px; font-weight: bold; line-height: 1; text-decoration: none; z-index: 3; transition: all linear 1s;}
.sbCaption {display: none;}

#LoginContainer {border: 4px solid #afafaf; background-color: #eee; box-shadow: 0 2px 10px #333; margin-top: -50px; margin-bottom: 20px;}
#LoginContainer div {box-sizing: border-box;}
#LoginContainer > div.row > div {padding: 20px;}
#LoginContainer > div.row > div:nth-child(2) {background-color: #fff; background-image: url('/images/factoryviewonline.png'); background-position: 96% 98%; background-size: 72px 63px; background-repeat: no-repeat;}


#SignupContainer {
    border: 4px solid #afafaf;
    background-color: #eee;
    box-shadow: 0 2px 10px #333;
    margin-top: 0px;
    margin-bottom: 20px;
}

#SignupContainer div {
    box-sizing: border-box;
}

#SignupContainer > div.row > div {
    padding: 20px;
}

#SignupContainer > div.row > div:nth-child(2) {
    background-color: #fff;
    background-image: url('/images/factoryviewonline.png');
    background-position: 96% 98%;
    background-size: 72px 63px;
    background-repeat: no-repeat;
}



#OnlineUsers {padding: 0.5rem; max-height: 265px; overflow-y: auto;}
#OnlineUsers .col-sm-3 {margin-bottom: 0.5rem;}
#OnlineUsers .statusIcon {position: absolute; bottom: 0; right: 0.75rem; z-index: 2; background-color: #FFF; border-radius: 50%; border: 2px solid #FFF;}

#lastestInventoryTransactionsPanel {padding: 0.5rem; max-height: 265px; overflow-y: auto;}
#lastestInventoryTransactionsPanel .col-sm-3 {margin-bottom: 0.5rem;}
#lastestInventoryTransactionsPanel .statusIcon {position: absolute; bottom: 0; right: 0.75rem; z-index: 2; background-color: #FFF; border-radius: 50%; border: 2px solid #FFF;}

#AlertMsg { position: fixed; top: 35%; left: 25%; width: 50%; max-height: 50%; z-index: 9999; box-shadow: 0 0 10px #666; }
#loadingIndicator {position: fixed; top: 0; left: 0; width: 100%; height: 100%; background-color: rgba(0,0,0,0.120); z-index: 999999;}
#eBayProductList {padding-top: 15px;}
#copyright {position: absolute; bottom: 14px; left: 10px; line-height: 1;}

.eliptico { display: inline-block; white-space: nowrap; overflow-x: hidden; text-overflow: ellipsis; }

.row.content { height: 600px }

.width50, .width100 {display: inline-block; padding: 5px; border-bottom: 1px solid #ddd;}
.width50 {width: 50%; float: left;}
.width100 {width: 100%;}

.dropdown-menu li { cursor: pointer; }
.dropdown-menu > li > a { padding: 7px 20px; }
.dropdown-header { font-weight: bold; background-color: #E3F2FD; font-size: 14px; }

.row h1 { margin: 0 auto; font-size: 24px; line-height: 34px; }
.row h3, .row h4 {margin: 0 auto;}
.pagination + div {margin: 20px 0;}
.searchbar {margin-bottom: 12px;}

.autocomplete { position: absolute; max-height: 200px; overflow-y: auto; z-index: 999999; background-color: #fff; border: 1px solid #E3F2FD; box-shadow: 0 3px 3px #666; display: none; transition: all 1s; }
.autocomplete button {display: block; padding: 2px 5px; text-align: left; text-decoration: none;}
.autocomplete button:hover {text-decoration: none;}

.bg-light-green {background-color: #9ccc65 !important;}
.bg-panelprimary { background-color: #337AB7; }
.bg-primary { background-color: #2196F3 !important; }
.bg-info, .input-group-addon { background-color: #E3F2FD !important; }
.bg-success { background-color: #4CAF50 !important; }
.bg-danger { background-color: #F44236 !important; }
.bg-warning { background-color: #F4A82F !important; }
.bg-cyan { background-color: #E3F2FD !important; }
.bg-teal { background-color: #009788 !important; }
.bg-darkblue { background-color: #01579B !important; }
.bg-purple, .label-purple { background-color: #A75DB4; }
.bg-panelprimary, .bg-primary, .bg-success, .bg-danger, .bg-warning, .bg-teal, .bg-darkblue, .bg-purple, .label-purple { color: #ffffff !important; }

.text-success { color: #4CAF50; }
.text-danger { color: #D50000; }
.text-warning { color: #F0AD4E; }

.text-gray {
    color: #ababab;
}


.panel.panel-primary, .panel.panel-success, .panel.panel-danger, .panel.panel-info, .panel.panel-warning {box-shadow: 0px 2px 4px rgb(128, 128, 128);}
.panel.panel-success {border-color: #4CAF50;}
.panel.panel-success .panel-heading {background-image: none; background-color: #4CAF50;}
.panel.panel-success .panel-footer a {color: #4CAF50;}
.panel.panel-success .panel-footer a:hover {color: #27772a;}
.panel.panel-danger {border-color: #F44236;}
.panel.panel-danger .panel-heading {background-image: none; background-color: #F44236; color: #FFF;}
.panel.panel-danger .panel-footer {background-image: none; background-color: #FFEEDD;}
.panel.panel-danger .panel-footer a {color: #F44236;}
.panel.panel-danger .panel-footer a:hover {color: #ce2d25;}
.panel.panel-red {border-color: #D9534F;}
.panel.panel-red .panel-heading {background-image: none; background-color: #D9534F;}
.panel.panel-red .panel-footer a {color: #D9534F;}
.panel.panel-red .panel-footer a:hover {color: #ce2d25;}
.panel.panel-warning {border-color: #F4A82F;}
.panel.panel-warning .panel-heading {background-image: none; background-color: #F4A82F;}
.panel.panel-warning .panel-footer {background-image: none; background-color: #F9EFD1;}
.panel.panel-warning .panel-footer a {color: #F39C12;}
.panel.panel-warning .panel-footer a:hover {color: #C27D0E;}

.bg-Inventory { background-color: rgba(255, 255, 255, 0.73) !important; }
.panel.panel-Inventory {border-color: rgba(31, 31, 31, 0.73);}
.panel.panel-Inventory .panel-heading {background-image: none; background-color: #f4e9e3; color: #000000;}
.panel.panel-Inventory .panel-footer {background-image: none; background-color: #c2d1f0;}
.panel.panel-Inventory .panel-footer a {color: rgba(0, 0, 0, 0.73);}
.panel.panel-Inventory .panel-footer a:hover {color: rgba(0, 0, 0, 0.73);}

.bg-WorkOrders { background-color: rgba(255, 255, 255, 0.73) !important; }
.panel.panel-WorkOrders {border-color: rgba(31, 31, 31, 0.73);}
.panel.panel-WorkOrders .panel-heading {background-image: none; background-color: #f4e9e3; color: #000000;}
.panel.panel-WorkOrders .panel-footer {background-image: none; background-color: #c2d1f0;}
.panel.panel-WorkOrders .panel-footer a {color: rgba(0, 0, 0, 0.73);}
.panel.panel-WorkOrders .panel-footer a:hover {color: rgba(0, 0, 0, 0.73);}

.bg-Requests { background-color: rgba(255, 255, 255, 0.73) !important; }
.panel.panel-Requests {border-color: rgba(31, 31, 31, 0.73);}
.panel.panel-Requests .panel-heading {background-image: none; background-color: #f4e9e3; color: #000000;}
.panel.panel-Requests .panel-footer {background-image: none; background-color: #c2d1f0;}
.panel.panel-Requests .panel-footer a {color: rgba(0, 0, 0, 0.73);}
.panel.panel-Requests .panel-footer a:hover {color: rgba(0, 0, 0, 0.73);}

.panel.panel-SmallSuccess {border-color: rgba(31, 31, 31, 0.73);}
.panel.panel-SmallSuccess {background-image: none; background-color: #aaf4a6; color: #000000;}
.panel.panel-SmallSuccess {color: rgba(0, 0, 0, 0.73);}
.panel.panel-SmallSuccess {color: rgba(0, 0, 0, 0.73);}

.panel.panel-Uncategorized {border-color: rgba(31, 31, 31, 0.73); }
.panel.panel-Uncategorized .panel-heading {background-image: none; background-color: #f4e9e3; color: #000000;}
.panel.panel-Uncategorized .panel-footer {background-image: none; background-color: #c2d1f0;}
.panel.panel-Uncategorized .panel-footer a {color: rgba(0, 0, 0, 0.73);}
.panel.panel-Uncategorized .panel-footer a:hover {color: rgba(0, 0, 0, 0.73);}

.panel.panel-Categorized {border-color: rgba(31, 31, 31, 0.73);background-color:#64ef64;}
.panel.panel-Categorized .panel-footer {background-image: none; background-color: #c2d1f0;}
.panel.panel-Categorized .panel-footer a {color: rgba(0, 0, 0, 0.73);}
.panel.panel-Categorized .panel-footer a:hover {color: rgba(0, 0, 0, 0.73);}

.panel-heading { font-size: 14px; font-weight: bold; font-style: italic; background-image: none !important; padding: 0.5em 1em; }
.panel-heading h1 { font-size: 2.325em; line-height: 1; }
.panel-heading h3 { margin-top: 0; margin-bottom: 0; }
.panel-heading p { font-size: 0.9em; line-height: 1; font-weight: normal; font-style: normal; }

.panel-Customeraccount {
    font-size: 14px;
    font-weight: bold;
    font-style: italic;
    background-image: none !important;
    padding: 0.5em 2em;
}

.panel-Customeraccount h1 {
    font-size: 1.2em;
    line-height: 1;
}

.panel-Customeraccount h3 {
    margin-top: 0;
    margin-bottom: 0;
}

.panel-Customeraccount p {
    font-size: 0.9em;
    line-height: 1;
    font-weight: normal;
    font-style: normal;
}

.panel-Customeraccount p2 {
    font-size: 1.5em;
    line-height: 1;
    font-weight: bold;
    font-style: normal;
}

.CustomerAccountDivider {
    border-style: outset;
    border-color: lightblue;
    height: auto;
}

.CustomerAccountDividerSelected {
    border-style: outset;
    border-color: blue;

    height: auto;
}

.CustomerAccountSelection {

    border-style: ridge;
}


.panel-Customeraccount-footer {
    border-bottom-style: inherit;
    border-top-style: inherit;
    border-color: #8e8e8e;
    background-image: none;
    background-color: #ececec;
}

.panel-Customeraccount-footer a {
    color: rgba(0, 0, 0, 0.73);
}

.panel-Customeraccount-footer a:hover {
    color: rgba(0, 0, 0, 0.73);
}


.panel-Settings {background-image: none; background-color: #474747; color: #ffffff;}
.panel-Settings { font-size: 14px; font-weight: bold; font-style: italic; background-image: none !important; padding: 0.5em 1em; }
.panel-Settings h1 { font-size: 2.325em; line-height: 1; }
.panel-Settings h3 { margin-top: 0; margin-bottom: 0; }
.panel-Settings p { font-size: 0.9em; line-height: 1; font-weight: normal; font-style: normal; }

.panel-group .panel {margin-bottom: 10px;}
.panel-group .panel-body { padding: 10px; }
.panel-group table { margin-bottom: 0; }

table.table, table.table.table-hover {background-color: #ffffff; border: 1px solid rgba(128, 128, 128, 0.5); box-shadow: 0px 2px 4px rgb(128, 128, 128);}

.tab-pane.fade.in.active { padding: 15px; }
.tab-pane.fade.in.active table, .panel-body table { box-shadow: none !important; border: none; }
.tab-content { background-color: #ffffff; border-left: 1px solid #ddd; border-right: 1px solid #ddd; border-bottom: 1px solid #ddd; box-shadow: 0px 2px 4px rgb(128, 128, 128); }

.input-group-addon i { cursor: pointer; }

.loader { margin-top: 200px; text-align: center; color: #ffffff; font-size: 24px; }
.loader img {animation-name: imgfade; animation-duration: 1s; animation-iteration-count: infinite;}

.ONLINE { display: block; font-weight: 600; color: #4CAF50; margin-top: 35px; }
.OFFLINE { display: block; font-weight: 600; color: red;margin-top: 35px; }
.ERROR { display: block; font-weight: 600; color: #D9534F; margin-top: 35px; }

.equipmentButton {display: block; width: 100%; height: 50px;}



.dropdown-submenu { position: relative; }
.dropdown-submenu .dropdown-menu { top: 0; left: 100%; margin-top: -5px; margin-left: -5px; }
.dropdown-submenu:hover>.dropdown-menu { display: block; }

.popover {max-width: inherit; z-index: 9999999;}
.popover-title {background-color: #2196F3; color: #fff;}
.popover-content {padding: 4px 4px 8px 4px;}
.popover-content div:not([class=row]) {padding-left: 4px; padding-right: 4px;}
.popover-content div[class=row] {margin-left: -4px; margin-right: -4px;}
.popover-content td, .popover-content th {white-space: nowrap; padding: 0.25rem 0.5rem;}

.input-xs {padding: 1px 5px; height: auto;}

.iconDiv {display: inline-block; width: 40px; text-align: center;}
.icon {max-width: 36px; max-height: 36px;}
.iconDiv24 {display: inline-block; width: 30px; text-align: center;}
.icon24 {max-width: 24px; max-height: 24px;}
.icon48 {max-width: 48px; max-height: 48px;}
.icon68 {max-width: 68px; max-height: 68px;}

.chartTooltip {border: 1px solid #2196F3 !important; margin: 0.25rem;}
.chartTooltip th {text-align: center; white-space: nowrap; padding: 0.25rem;}
.chartTooltip td {white-space: nowrap; padding: 0.25rem;}
.chartTooltip td.quantity {text-align: center;}
.chartTooltip td.total {text-align: right;}

.modal-lg {width: 90%; margin: 2rem auto;}
.chat-buble {width: 75%; padding: 0.5rem; border-radius: 0.5rem; border: 1px solid #2196F3; margin-bottom: 0.5rem; display: block; clear: both; background: #fff; box-shadow: 0 0 4px #333;}

.badge {margin-left: -4px; margin-top: -16px;}
.dropdown-menu > li > a > .badge {margin-left: -1px; margin-top: -9px;}
.progress {margin-bottom: 0; margin-top: 0.125rem;}

.notifications {font-size: 0.75rem;}
.markall {color: #fff; font-weight: normal; line-height: 1rem;}
.markall:hover {color: #fc0; text-decoration: none;}
.unread {font-weight: bold; background-color: #E3F2FD;}
.unread:hover {background-color: #C8E3F7 !important;}

.width20 {display: inline-block; width: 20%; padding: 0.25rem;}
.width25 {display: inline-block; width: 25%; padding: 0.25rem;}

.lp-file-preview {width: 100%; height: 210px;}
.lp-file-content {width: 100%; height: 160px; text-align: center;}
.lp-file-content img {max-width: 100%; max-height: 160px; margin: auto 0;}
.lp-file-footer {width: 100%; height: 50px; text-align: center; font-size: 0.75rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;}

.tooltip-inner {max-width: 1500px; width: auto; white-space: nowrap; background-color: #2196F3;}
.tooltip.top > .tooltip-arrow {border-top-color: #2196F3 !important;}
.tooltip.right > .tooltip-arrow {border-right-color: #2196F3 !important;}
.tooltip.left > .tooltip-arrow {border-left-color: #2196F3 !important;}
.tooltip.bottom > .tooltip-arrow {border-bottom-color: #2196F3 !important;}

.btn-toggle, .btn-toggle-active {width: 60px; min-width: 60px; height: 24px; border-radius: 12px; padding: 0; text-align: center; line-height: 24px; display: inline-block;}
.btn-toggle span.fa, .btn-toggle-active span.fa {color: #fff; width: 24px; min-width: 24px; height: 22px; min-height: 22px; text-align: center; line-height: 24px; position: relative; top: -1px;}
.btn-toggle {background-color: #F44236; border: 2px solid #F44236;}
.btn-toggle-active {background-color: #4CAF50; border: 2px solid #4CAF50;}
.btn-toggle span.fa {float: right;}
.btn-toggle-active span.fa {float: left;}
.btn-toggle span.switch, .btn-toggle-active span.switch {width: 30px; height: 30px; min-width: 30px; min-height: 30px; background-color: #fff; border-radius: 50%; display: inline-block; position: relative; top: -4px;}
.btn-toggle span.switch {border: 1px solid #F44236; left: -3px;}
.btn-toggle-active span.switch {border: 1px solid #4CAF50; right: -3px;}

.tag {display: inline-block; background-color: #2196F3; color: #fff; padding: 0.25rem 0.5rem; margin: 0.25rem; border-radius: 0.25rem; font-size: 0.875rem;}
.tag:first-child {margin-left: 0;}
.tag a {background-color: #F44236; color: #fff; border-radius: 0.25rem; padding: 2px 4px; margin-left: 0.25rem;}

input.form-control, .input-group .form-control {position: initial;}

@keyframes imgfade {
	0% {opacity: 0;}
	50% {opacity: 1;}
	100% {opacity: 0;}
}

.easy-autocomplete { width: auto !important; }

.fa-ebay { font-family: 'Social Font Face' !important; }
.fa-ebay:before { content: "e"; }


.chartcolor {color:red;}
/* TABLE SORTER STYLES */
table.tablesorter thead tr .header { background-image: url(/images/bg.gif); background-repeat: no-repeat; background-position: center right; cursor: pointer; }
table.tablesorter thead tr .headerSortUp { background-image: url(/images/asc.gif); }
table.tablesorter thead tr .headerSortDown { background-image: url(/images/desc.gif); }
table.tablesorter thead.bg-info th {cursor: pointer; transition: all 0.5s;}
table.tablesorter thead.bg-info th:hover {background-color: #337ab7; color: #ffffff;}

@media screen and (max-width: 650px) {
	body {margin-top: 50px;}
	#WebsiteHeader {background-size: 105px 20px; background-position: 3% 10px; height: 50px;}
	#siteTitle {font-size: 1.25rem; line-height: 1; top: 25px; left: 20%; right: 20%;}
	#SideBar {display: none;}
	.equipmentButton {display: inline-block; width: 25%;}
	.invIconDiv {width: 30px;}
	.invIcon {max-width: 24px; max-height: 24px;}
	.table thead {display: none;}
	.table td {display: block;}
	.table td input {display: inline-block;}
	.table td:before {content: attr(data-th); font-weight: bold; display: inline-block; width: 30%;}
	.table td.forty:before {width: 40%;}
	.table > tbody > tr {border-top: 1px solid #DDD; border-bottom: 1px solid #ddd; margin-bottom: 0.5rem;}
	.table > tbody > tr > td {border-top: none; text-align: left !important;}
	.nav > li > a {padding: 0.25rem 0.5rem;}
}

@media screen and (max-width: 850px) and (min-width: 651px) {
	#MainContent {left: 13%;}
	#SideBar {width: 8%;}
}

@media print {
	@page {size: 8.5in 11in; margin: 0;}
	body {background-color: #fff; margin: 4cm 1.5cm 2cm 1.5cm;}
	h1 {font: bold italic 24pt/50pt sans-serif; text-align: center; color: #369;}
	table {border: 1px solid #999; border-collapse: collapse; width: 100%;}
	th, td {font-size: 12pt; padding: 2pt;}
	th {background-color: #E3F2FD; white-space: nowrap; text-align: center;}
	#SideBar, #WebsiteHeader, .no-print {display: none;}
	#MainContent {width: 100% !important; margin-left: 0 !important;}
	#PrintLogo {position: absolute; top: 1.6cm; left: 1.5cm; width: 7.5cm; height: 2cm; z-index: 5;}
}

.switch {
	position: relative;
	display: inline-block;
	width: 60px;
	height: 34px;
}

/* Hide default HTML checkbox */
.switch input {display:none;}

/* The slider */
.slider {
	position: absolute;
	cursor: pointer;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background-color: #ccc;
	-webkit-transition: .4s;
	transition: .4s;
}

.slider:before {
	position: absolute;
	content: "";
	height: 26px;
	width: 26px;
	left: 4px;
	bottom: 4px;
	background-color: white;
	-webkit-transition: .4s;
	transition: .4s;
}

input:checked + .slider {
	background-color: #2196F3;
}

input:focus + .slider {
	box-shadow: 0 0 1px #2196F3;
}

input:checked + .slider:before {
	-webkit-transform: translateX(26px);
	-ms-transform: translateX(26px);
	transform: translateX(26px);
}

/* Rounded sliders */
.slider.round {
	border-radius: 34px;
}

.slider.round:before {
	border-radius: 50%;
}


.tooltipHelp {
	position: relative;
	display: inline-block;
	z-index: 2000 !important;
	border-bottom: 1px dotted black; /* If you want dots under the hoverable text */
}

/* Tooltip text */
.tooltipHelp {
	visibility: hidden;
	width: 120px;
	background-color: black;
	color: #fff;
	text-align: center;
	padding: 5px 0;
	border-radius: 6px;
	z-index: 2000 !important;
	/* Position the tooltip text - see examples below! */
	position: absolute;
	z-index: 1;
}

/* Show the tooltip text when you mouse over the tooltip container */
.tooltipHelp:hover {
	z-index: 2000 !important;
	visibility: visible;
}

.borders {
    border-style: groove;
}

.labelInspect {
    display: inline;
    padding: .2em .6em .3em;
    font-size: 100%;
    font-weight: bold;
    line-height: 1;
    color: black;
    text-align: center;
    white-space: nowrap;
    vertical-align: baseline;
    border-radius: .25em;
    background-color: yellow;
}

/* Style the button that is used to open and close the collapsible content */
.collapsible {
    background-color: #e8e8e8;
    color: #444;
    cursor: pointer;
    padding: 2px;
    width: 100%;
    border: none;
    text-align: left;
    outline: none;
    font-size: 15px;
    font-weight: bold;
}

/* Add a background color to the button if it is clicked on (add the .active class with JS), and when you move the mouse over it (hover) */
.collapsible:hover {
    background-color: #ccc;
}

/* Style the button that is used to open and close the collapsible content */
.collapsibleSettings {
    background-color: #efefef;
    color: #444;
    cursor: pointer;
    padding: 2px;
    width: 100%;
    border: none;
    text-align: left;
    outline: none;
    font-size: 15px;
    font-weight: bold;
}

/* Add a background color to the button if it is clicked on (add the .active class with JS), and when you move the mouse over it (hover) */
.collapsibleSettings:hover {
    background-color: #ccc;
}

/* Style the collapsible content. Note: hidden by default */
.content {
    padding: 0 18px;
    display: none;
    overflow: hidden;
    background-color: #f1f1f1;
}

/* Style the button that is used to open and close the collapsible content */
.collapsibleSettingsTerms {
    background-color: #ffffff;
    color: #444;
    cursor: pointer;
    padding: 2px;
    width: 100%;
    border: none;
    text-align: left;
    outline: none;
    font-size: 15px;
    font-weight: bold;
}

/* Add a background color to the button if it is clicked on (add the .active class with JS), and when you move the mouse over it (hover) */
.collapsibleSettingsTerms:hover {
    background-color: #ffffff;
}

/* Style the collapsible content. Note: hidden by default */
.contentTerms {
    padding: 0 18px;
    display: none;
    overflow: hidden;
    background-color: #ffffff;
}

.right {
    float: right;
}

.left {
    float: left;
}

.Basic {
    font-size: 13px;
    font-weight: bold;
    color: green;
}

.Free {
    font-size: 16px;
    font-weight: bold;
    color: Red;
}

.Premium {
    font-size: 18px;
    font-weight: bold;
}

.Enhanced {
    font-size: 20px;
    font-weight: bold;
    color: green;
}



.container2 {
    background-color: #000;
    margin: 130px auto;
    min-height: auto;
    width: auto;
    overflow: auto;
    padding: 0px 100px;
}

.left2 {
    width: 600px;
    margin-right: 20px;
}

.right2 {
    width: 320px;
    height: 300px;
    background-color: #999;
    float: right;
}

.panel2 {
    background-color: red;
}

/* Hiding the checkbox, but allowing it to be focused */
.badgebox
{
    opacity: 0;
}



.badgebox + .badge
{
    background-color: lightgrey;
    margin-top: 2px;
    /* Move the check mark away when unchecked */
    text-indent: -999999px;
    /* Makes the badge's width stay the same checked and unchecked */
    width: 27px;
}

.badgebox:focus + .badge
{
    /* Set something to make the badge looks focused */
    /* This really depends on the application, in my case it was: */

    /* Adding a light border */
    box-shadow: inset 0px 0px 5px;
    /* Taking the difference out of the padding */
}

.badgebox:checked + .badge
{
    background-color: lightgreen;
    margin-top: 2px;
    /* Move the check mark back when checked */
    text-indent: 0;
}

tableReport.table {background-color: #ffffff; border: 1px solid rgba(128, 128, 128, 0.5); box-shadow: 0px 2px 4px rgb(128, 128, 128);}

.help {cursor: help;}

.text-disabled{
    color: lightgray;
}

.tableFixHead    { overflow-y: auto; height: 800px; }
.tableFixHead th { position: sticky; top: 0; }

.tableFixHead2    { overflow-y: auto; max-height: 400px; }
.tableFixHead2 th { position: sticky; top: 0; }

/* Just common table stuff. Really. */
table  { border-collapse: collapse; width: 100%; }
th, td { padding: 8px 16px; }
th     { background:#eee; }

.fvotablebackground{
    background-color: #337AB7;}

.popover{
    min-width: 200px; /* Max Width of the popover (depending on the container!) */
}

/*BANNER for cookie law */
.bs-calltoaction{
    position: relative;
    width:auto;
    padding: 15px 25px;
    border: 1px solid black;
    margin-top: 10px;
    margin-bottom: 10px;
    border-radius: 5px;
}

.bs-calltoaction > .row{
    display:table;
    width: calc(100% + 30px);
}

.bs-calltoaction > .row > [class^="col-"],
.bs-calltoaction > .row > [class*=" col-"]{
    float:none;
    display:table-cell;
    vertical-align:middle;
}

.cta-contents{
    padding-top: 10px;
    padding-bottom: 10px;
}

.cta-title{
    margin: 0 auto 15px;
    padding: 0;
}

.cta-desc{
    padding: 0;
}

.cta-desc p:last-child{
    margin-bottom: 0;
}

.cta-button{
    padding-top: 10px;
    padding-bottom: 10px;
}

@media (max-width: 991px){
    .bs-calltoaction > .row{
        display:block;
        width: auto;
    }

    .bs-calltoaction > .row > [class^="col-"],
    .bs-calltoaction > .row > [class*=" col-"]{
        float:none;
        display:block;
        vertical-align:middle;
        position: relative;
    }

    .cta-contents{
        text-align: center;
    }
}



.bs-calltoaction.bs-calltoaction-default{
    color: #333;
    background-color: #fff;
    border-color: #ccc;
}

.bs-calltoaction.bs-calltoaction-primary{
    color: #fff;
    background-color: #337ab7;
    border-color: #2e6da4;
}

.bs-calltoaction.bs-calltoaction-info{
    color: #fff;
    background-color: #5bc0de;
    border-color: #46b8da;
}

.bs-calltoaction.bs-calltoaction-success{
    color: #fff;
    background-color: #5cb85c;
    border-color: #4cae4c;
}

.bs-calltoaction.bs-calltoaction-warning{
    color: #fff;
    background-color: #f0ad4e;
    border-color: #eea236;
}

.bs-calltoaction.bs-calltoaction-danger{
    color: #fff;
    background-color: #d9534f;
    border-color: #d43f3a;
}

.bs-calltoaction.bs-calltoaction-primary .cta-button .btn,
.bs-calltoaction.bs-calltoaction-info .cta-button .btn,
.bs-calltoaction.bs-calltoaction-success .cta-button .btn,
.bs-calltoaction.bs-calltoaction-warning .cta-button .btn,
.bs-calltoaction.bs-calltoaction-danger .cta-button .btn{
    border-color:#fff;
}

.pointer { cursor: pointer; }
/*End of cookie law banner*/




progress {
    text-align: center;
    height: 1.5em;
    width: 100%;
    -webkit-appearance: none;
    border: none;

    /* Set the progressbar to relative */
    position:relative;
}
progress:before {
    content: attr(data-label);
    font-size: 0.8em;
    vertical-align: 0;

    /*Position text over the progress bar */
    position:absolute;
    left:0;
    right:0;
}
progress::-webkit-progress-bar {
    background-color: #c9c9c9;
}
progress::-webkit-progress-value {
    background-color: #03a824;
}
progress::-moz-progress-bar {
    background-color: #03a824;
}