html,
body {
	width: 100%;
}

body  {
	margin: 0;
	padding-bottom: 30px;
}

*, div {
	box-sizing: border-box;
	-moz-box-sizing:border-box;
	-webkit-box-sizing:border-box;font-family: 'arial', 'sans-serif';
}

.clear  {clear: both;}

a:link {text-decoration:none;}
a:visited {text-decoration:none;}
a:hover {color: inherit;text-decoration:none;}
a:active {color:inherit;text-decoration:none;}

.container {
	width: 100%;
	max-width: 1170px;
	height: auto;
	padding: 0 15px;
	margin: 0 auto;
	margin-top: 80px;
}

.jumbotron {
	width: 100%;
	height: auto;
	padding: 30px 0;
}

#second-row {
	width: 100%;
	height: auto;
	text-align: center;
}

#second-row h1 {font-weight: bold;}

#customer_payments  {text-align: center;}

/*.container-fluid {
  padding-right: 15px;
  padding-left: 15px;
  margin-right: auto;
  margin-left: auto;
}*/

.even-row {
	background-color: #ccc !important;
}

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

#loading-spinner {
	margin: 0 auto;
	margin-top: 15%;
	text-align: center;
}

#loading-spinner-batch {
	margin: 0 auto;
	margin-top: 15%;
	text-align: center;
}

.modal-loading-spinner {
	margin: 0 auto; 
	margin-top: 3%;
	text-align: center;
}

.metrics-loading {
	margin: 0 auto;
	text-align: center;
}

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

/** HEADER CSS START */
.navbar-brand img {
	max-height: 40px;
	width: auto;
	margin-top: -5px;
}

.navbar-header {
	height: 70px;
}

.navbar-nav {
	padding-top: 10px;
}

.navbar .nav > li > a {
	color: white !important;
	font-size: 1.2em;
}

.navbar .nav > li > a:hover {
	color: #66ccff !important;
}

.header-dropdown-menu {
	background-color: #007a48 !important;
}

.header-dropdown-menu > li > a {
	color: white !important;
}

.header-dropdown-menu > li > a:hover {
	background-color: #005c36 !important;
	color: #faae1a !important;
}

.header-logo {
	margin-left: 25% !important;
}

.links-right-login {
	margin-right: 25% !important;
	font-size: 1.2em;
}

.links-right-logout {
	margin-right: 25% !important;
}

#contact-us {
	margin-top: 1px;
}
/** HEADER CSS END */

/** INDEX CSS START */


.img-responsive {
	display: block;
	margin: 0 auto;
	max-width: 100%;
	height: auto;
}

.jumbotron h1 {
	color: #85b939 !important;
	font-size: 32px !important;
	font-style: italic;
	font-weight: bold;
}

.jumbotron h4 {
	font-size: 22px;
	font-weight: bold;
}

.loginErrorMessage {
	padding-top: 10px;
}

.loginErrorMessage p {
	text-align: center;
}

#loginModal, #customerServiceModal {
	margin: 0 auto;
	margin-top: 10% !important;
	width: 35% !important;
}

#confirm-invoice-modal, #confirm-inventory-modal, #depotFilesModal, #reportFilesModal {
	margin: 0 auto;
	width: 40% !important;
}

#depot-files {
	width: 100%;
	max-width: 600px;
	height: auto;
	margin: 0 auto;
}

#myModalLabel {
	font-weight: bold;
}

.modal-info {
	text-align: center;
}

#remove-line-btn , #add-another-btn {
	margin-top: 20px;
}

.add-remove-buttons {
	width: 60px !important;
}

.text-success {
	color: #3c763d;
}

.text-warning {
	color: #9F6000;
}

.text-danger {
	margin-top: 3px;
	color: #a94442;
}

#register-button {
	margin-left: 15% !important;
	width: 54%;
	color: #FFF;
	background-color: #0096D3;
	border: 3px solid #FFF;
	font-size: 30px;
	line-height: 42px;
	height: 42px;
}

#display-user:hover {
	color: white !important; 
}

 .container-fluid  {
	width: 100%;
	height: auto;
	padding: 0 15px;
	margin: 0 auto;
 }
 
 .row{}

/** INDEX CSS END */

/************************************* FOOTER CSS START *************************************/
.footer {
	position: fixed;
	bottom: 0;
	width: 100%;
	height: 30px;
	background-color: #009059;
	color: #FFF;
	text-align: center;
	display: flex;
	align-items: center;
	justify-content: center;
}

.footer p {
	margin: 0;
}

#pregen-note {
	padding-top: 5%;
}
/************************************* FOOTER CSS END *************************************/

/************************************** GENERAL CSS CLASSES START **************************************/
input[type="checkbox"]:checked {
	background-color: blue;
	color: blue;
}

.bold {
	font-weight: bold;
}

.content-header {
	font-weight: bold;
	margin-left: 30%;
}

.table-spacing {
	border-collapse: separate;
    border-spacing: 5px;
}

.sm-table-spacing {
	border-collapse: separate;
	border-spacing: 5px;
}

.li-spacing {
	margin: 0 0 5px 0;
}

.btn {
	font-weight: bold !important;
}

.btn-info {
	color: black !important;
}

.btn-primary:hover {
	background-color: black !important;
	color: white !important;
}

.btn-info:hover {
	background-color: white !important;
	color: black !important;
}

.center-content {
	width: 50%;
	margin: 0 auto;
	margin-top: 10px;
}

.center-add-inventory {
	width: 75% !important;
	margin-top: 10% !important;
}

.center-confirm-submit {}

.center-main-content {
	width: 75% !important;
	margin-top: 10% !important;
}

.center-content h3, .center-main-content h3 {
	font-weight: bold;
	padding-bottom: 10px;
}

.center-content form button, .center-main-content form button {
	margin-top: 10px;
}

/** THIS IS USED TO STYLE THE SUCCESS MESSAGES THE SITE RECEIVES */
.text-success, .text-danger {
	font-weight: bold;
}

.modal-style {
	background-color: #89bb3b;
	text-align: center;
} 

.center-search form {
	width: 50% !important;
}

.underline {
	text-decoration: underline;
	border-bottom: 2px solid black;
	text-align: center;
}
/************************************** GENERAL CSS CLASSES END **************************************/

/************************************** ADMIN SECTION CSS START **************************************/
#admin-function-list {
	padding-top: 20px;
}

#site-permissions {
	padding-left: 28%;
}

#create-user-form {
	padding-left: 28%;
	padding-right: 28%;
}

.new-user-control {
	margin: 5px;
}

.permission-feedback {
	width: 224px;
}

#report-permissions {
	margin-top: 30px;
}

#report-permissions h4 {
	font-weight: bold;
}

#site-prop-form {width: 100% !important;}

#site-prop-form h4 {
	margin-left: 25% !important;
}

#save-site-prop {
	margin-top: 2%;
	margin-right: auto !important;
}

.site-prop-btn {
	width: 168px;
	text-align: center;
}

.payin-btn {
    margin-top: 10px;
}

.payin-select {
	margin-top: 10px;
}

.payin-section {
	border-width: 1px;
	border-color: black;
	border-style: solid;
}

#payment_tab_button {
	border-radius: 0px;
}

#batch_tab_button {
	border-radius: 0px;
}

#payment_tab_button.selected {
	border-radius: 0px;
	background-color: #98c5ec;
}

#batch_tab_button.selected {
	border-radius: 0px;
	background-color: #98c5ec;
}

#payment_controls {
	padding: 8px;
}

.texarea-site-prop {
	width: 95%;
}

#select-depotId {
	width: 900px !important;
}

#select-depotId-left {
	width: 100px !important;
}

#depot-hours-textarea {
	width: 400px !important;
}

#depot-prop-save-btn {
	width: 400px !important;
}

#depotFiles div {
	margin-bottom: 5px;
}

/*#invoice-transaction-date {
	width: 150px !important;
}*/
/************************************** ADMIN SECTION CSS END **************************************/

/************************************** DEPOT SECTION CSS START **************************************/
#depot-header {}

#depot-name {
	text-align: center;
	font-weight: bold;
}

#depot-info {
	text-align: center;
	padding-bottom: 20px;
}

#depot-message {text-align: center;}

#depot-metrics {
	width: 100%;
}

#transaction-comparison {
	width: 100%;
	max-width: 400px;
	height: auto;
	margin: 0 auto;
}

#payment-batch-summary {
	width: 100%;
	max-width: 600px;
	height: auto;
	margin: 0 auto;
}

#monthly-units-table {
	width: 100%;
	max-width: 600px;
	height: auto;
	margin: 0 auto;
}

#open-invoices-table, #accounts-payable-table, #accounts-payable-schools-table {
	width: 100%;
}

#payment_copyresult {
	width: 200px;
	margin: auto;
	margin-top: 10px;
	padding:5px;
	color: green;
	background-color:rgb(187, 249, 187);
	border-color:black;
	border-radius:5px;
}

#display-messages {
	width: 100%;
	max-width: 600px;
	height: auto;
	margin: 0 auto;
}

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

.comparison-table-fix {
	width: 150px;
}

#depot-report-list {
	margin: 0 auto;
}

#depot-sidebar div {
	margin-bottom: 5px;
}

#depot-file-wrap {
	margin-bottom: 5px;
	text-align: center;
}

#customer-payment-row {
	margin-top: 20px;
	width: 100%;
	max-width: 600px;
}

/*
.depot-landing-btn {
	text-align: center;
	width: 250px;
}
*/

#inventory-calender {
	width: 85%;
}

#inventory-calender td, #inventory-calender th {
	border: 1px solid #999;
	padding: 0.5rem;
}

.weekDay {
	width: 100px;
}

.selectDate:hover {
	background-color: cyan;
}

#add-invoice input {
	width: 150px;
}

#depot-functions {
	margin-top: 10px;
}

#depot-metrics-header {
	width: 75%;
	height: auto;
	text-align: center;
}

#metric-button-div {}

#metric-button-div button, #depot-functions button, #depot-functions a {
	width: 75%;
	text-align: center;
	margin-top: 2px !important;
}

#depot-functions a {
	color: white;
}

#messageModal button {
	width: 15%;
}

.metric-modals {
	margin-top: 1% !important;
}

#open-invoices-modal-body, #accounts-payable-modal-body, #bulk-orders-modal-body {
	height: auto;
	max-height: 600px;
	overflow: scroll;
}

#subDepotFunctions a, .subDepotFunctions a {
	color: white;
}

#hourly-count h4 {
	text-align: center;
	font-weight: bold;
}

#depot-metrics h4, #ap-totals h4 {
	text-align: center;
	font-weight: bold;
}

#ap-totals table, #hourly-count table {
	margin-top: 10px;
	margin: 0 auto;
	text-align: center;
	width: 50%;
}

#ap-totals {
	margin-top: 10px;
}

#hourly-count {
	margin-top: 30px;
}

#user-permission-examples {
	padding-top: 14.5%;
	padding-left: 0px;
	padding-right: 0px;
	padding-bottom: 0px;
}

.center-table {
	margin: 0 auto;
}
/************************************** DEPOT SECTION CSS END **************************************/

#subDepotFunctions {
	margin-top: 20px;
}

#copy-account-input {
	text-align: center;
}

#copy-invoice-input {
	text-align: center !important;
	margin: 0 auto;
}

#copy-invoice-input tr th {
	text-align: center !important;
}

/** THIS IS USED TO OVERRIDE CENTERING CONTENT AND MAKE A NAVBAR USE 100% OF ITS AVAILABLE SPACING FOR WIDTH */
.navbar-width-fix {
	width: 100% !important; 
}

/** THIS IS USED TO CREATE A SPACE BETWEEN LINKS ON A TABBABLE NAV BAR */
.tab-spacing button {
	margin-left: 3px;
}

/** THIS IS USED TO REMOVE THE DEFAULT BORDER FROM NAV-TABS */
.remove-border {
	border-bottom: 0px !important;
}

#inventory-header {
	text-align: center;
	margin-bottom: 30px;
}

#add-inventory {
	width: 100%;
}

#add-inventory .text-success {
	margin-left: 1%;
}

.add-invoice-align-fix {
	margin-left: 5px;
}

/**** AFTER BACK UP CSS ******/
#add-inventory-table {
	margin-left: 230px;
}

#display-inventory-table {
	margin-top: 15px;
	margin-left: 280px;
}

#display-inventory-table th, #display-inventory-table td {
	width: 205px;
}

.remove-line-btn {
	width: 45px !important;
}

.print-btn {
	float: left;
}

.month-input-qa {
	width: 75px !important;
}

.admin-qa-depot {
	float: left;
	width: 200px !important;
}

.admin-qa-depotid {
	float: left;
	width: 100px !important;
}

/** MAX WIDTH FIXES */
@media (min-width: 1741px) and (max-width: 1859px) {
	.container {
		margin-top: 135px !important;
	}
}

@media (max-width: 1740px) {
	.header-logo {
		margin-left: 5% !important;
	}

	.links-right-logout {
		margin-right: 5% !important;
	}
}

@media (max-width: 1063px) {
	.container {
		margin-top: 135px !important;
	}
}

@media (max-width: 968px) {
	.container {
		margin-top: 135px !important;
	}

	.header-logo {
		margin-left: 5% !important;
	}

	.links-right-login {
		margin-right: 15% !important;
	}
}

@media (max-width: 767px) {
	.container {
		margin-top: 85px !important;
	}

	.header-logo {
		margin-left: 0 !important;
	}

	.jumbotron h1 {
		font-size: 24px !important;
	}

	.jumbotron h4 {
		font-size: 14px !important;
	}

	#login-wrap h3 {
		font-size: 16px !important;
	}

	#override-wrap h3 {
		font-size: 16px !important;
	}
}