html,
body {
	height: 100%;
}

.wrap {
	min-height: 100%;
	height:     auto;
	margin:     0 auto -60px;
	padding:    0 0 60px;
}

.container-wide { width: 2000px; margin-right: auto; margin-left: auto; }

.wrap > .container-wide { padding: 10px 15px 20px; }

.wrap > .container { padding: 10px 15px 20px; }


.prodtp-container { width: 2750px; margin-right: auto; margin-left: auto; }

.wrap > .prodtp-container { padding: 10px 15px 20px; }


.detail-container { width: 1000px; margin-left: auto; margin-right: auto; }

.container-dash1-col1 { width: 45%; margin-left: 60px; float: left }

.container-dash1-col2 { width: 45%; margin-right: 60px; float: right }

.footer {
	height:           60px;
	background-color: #F5F5F5;
	border-top:       1px solid #DDD;
	padding-top:      20px;
}

.jumbotron {
	text-align:       center;
	background-color: transparent;
}

.jumbotron .btn {
	font-size: 21px;
	padding:   14px 24px;
}

.not-set {
	color:      #C55;
	font-style: italic;
}

.not-allowed {
	color: #ccc;
	cursor: not-allowed;
	text-decoration: none;
}

.not-allowed:hover,
.not-allowed:active,
.not-allowed:focus {
	    color: #ccc; /* Keep the same color on interaction */
	        text-decoration: none; /* Optional: Prevent underline */
}

/* add sorting icons to gridview sort links */
a.asc:after, a.desc:after {
	position:     relative;
	top:          1px;
	display:      inline-block;
	font-family:  'Glyphicons Halflings';
	font-style:   normal;
	font-weight:  normal;
	line-height:  1;
	padding-left: 5px;
}

a.asc:after {
	content: /*"\e113"*/ "\e151";
}

a.desc:after {
	content: /*"\e114"*/ "\e152";
}

.sort-numerical a.asc:after {
	content: "\e153";
}

.sort-numerical a.desc:after {
	content: "\e154";
}

.sort-ordinal a.asc:after {
	content: "\e155";
}

.sort-ordinal a.desc:after {
	content: "\e156";
}

.grid-view th {
	white-space: nowrap;
}

.hint-block {
	display:    block;
	margin-top: 5px;
	color:      #999;
}

.bright-danger { color: red }
.bright-dollar { color: green }

.notify { color: green }

.error-summary {
	color:       #A94442;
	background:  #FDF7F7;
	border-left: 3px solid #EED3D7;
	padding:     10px 20px;
	margin:      0 0 15px 0;
}

/* align the logout "link" (button in form) of the navbar */
.nav li > form > button.logout {
	padding: 15px;
	border:  none;
}

@media (max-width: 767px) {
	.nav li > form > button.logout {
		display:    block;
		text-align: left;
		width:      100%;
		padding:    10px 15px;
	}
}

.nav > li > form > button.logout:focus,
.nav > li > form > button.logout:hover {
	text-decoration: none;
}

.nav > li > form > button.logout:focus {
	outline: none;
}


/* override bootstrap styles */
.form-horizontal .control-label {
	text-align:  left;
	white-space: nowrap;
}


/* label always black, no validation switches */
.has-success .help-block, .has-success .control-label, .has-success .radio, .has-success .checkbox, .has-success .radio-inline, .has-success .checkbox-inline, .has-success.radio label, .has-success.checkbox label, .has-success.radio-inline label, .has-success.checkbox-inline label {
	color: #333; !important;
}


/* grey text color, lighter grey textbox border */
.has-success .form-control,
.has-success .help-block,
.has-success .form-control-feedback {
	color:        #555;
	border-color: rgb(204, 204, 204);
	box-shadow:   none;
}

/* force blue border and halo, skip validation switch to green */
.has-success .form-control:focus {
	border-color: #66AFE9;
	box-shadow:   0px 1px 1px rgba(0, 0, 0, 0.075) inset, 0px 0px 8px rgba(102, 175, 233, 0.6);
}


.go-btn {
	padding:       2px 12px;
	border:        1px solid transparent;
	border-radius: 4px;
}

.go-form-control {
	text-align:       center;
	height:           26px;
	padding:          6px 4px;
	font-size:        13px;
	line-height:      1.42857143;
	color:            #555;
	background-color: #FFF;
	background-image: none;
	border:           1px solid #CCC;
	border-radius:    4px;
	box-shadow:       inset 0 1px 1px rgba(0, 0, 0, .075);
	transition:       border-color ease-in-out .15s, box-shadow ease-in-out .15s;
}


/* admin */

.wrap > .container {
	padding: 0px 15px 20px;
}


.btn-primary { background-color: rgba(9, 116, 237, 1); border-color: #204D74 }

.btn-success { background-color: rgba(9, 116, 237, 1); border-color: #204D74 }

.btn-primary:hover, .btn-success:hover { color: #FFF; background-color: #286090; border-color: #204D74 }


.btn-small { line-height: 1.1; font-size: 13px; padding: 4px 10px }

.view-only { padding-top: 8px }


/* admin */
nav#eheader-bar div div a div.member-title {
	width: 700px; line-height: 30px; margin-top: 11px;
}

nav#eheader-bar div div.navbar-header a:hover { cursor: default }

nav#eheader-bar div div a div.member-title span { padding-left: 10px; color: #000; }

nav#w0 { margin-bottom: 0px }

div#eheader-collapse { margin-top: 15px; }


div#signin { margin-top: 100px; }

div#signin div { float: none; margin-left: auto; margin-right: auto; }


/* Home and Support links */
div#eheader-collapse ul li a { color: #000; }

/* Logout link */
div#eheader-collapse ul li button { color: #000; }

div#eheader-collapse ul li button:hover { background-color: #EEE; }

div#support span { padding-left: 10px }

div#support h4 { display: inline; color: rgb(15, 115, 238); }


/* MAINTENANCE TABLES, MEMBERS, ... */
div#w0-collapse ul li a {
	font-family:    museo, sans-serif;
	text-transform: uppercase;
	font-weight:    bold;
	letter-spacing: 0.15em;
	font-size:      15px;
	color:          #FFF;
	/*
    padding-top: 10px;
    padding-right: 15px;
    padding-bottom: 10px;
    padding-left: 15px;
    */
}

.navbar-collapse {
	padding-right: 15px;
	padding-left:  0px;
}

.nav > li > a.login {
	position:      relative;
	display:       block;
	padding-right: 0px;
	padding-left:  5px;
}

.nav > li > a {
	position:      relative;
	display:       block;
	padding-right: 30px;
	padding-left:  5px;
}

div#w0-collapse ul li a:hover { color: rgb(15, 115, 238); }

div#w0-collapse ul li ul { padding: 0px }

/* sub-menu dropdown */
/* STATE, RESTORATION GROUP, ... */
div#w0-collapse ul li ul li { background-color: rgba(9, 116, 237, 1); padding-top: 5px}

div#w0-collapse ul li ul li a { color: #BBC5F3;
	font-family:                       museo, sans-serif;
	text-transform:                    uppercase;
	font-weight:                       bold;
	letter-spacing:                    0.75px;
}

div#w0-collapse ul li ul li.divider { height: 0px; margin: 0px; padding: 0px }

/* hover over submenu */
div#w0-collapse ul li ul li a:hover { background-color: rgb(24, 90, 176); color: #FFF; }

div#w0-collapse ul li ul li:hover { background-color: rgb(24, 90, 176); color: #FFF; }

.navbar-inverse .navbar-nav > .selected > a,
.navbar-inverse .navbar-nav > .open > a,
.navbar-inverse .navbar-nav > .open > a:hover,
.navbar-inverse .navbar-nav > .open > a:focus {
	background-color: rgb(30, 50, 99);
}


div#pager-control { float: right; margin-bottom: 10px }

div#pager-control span { padding-right: 4px; padding-left: 4px }

/* admin pencil */
a.update-member span { padding: 0px 40px 0px 5px; }

.tiny { font-size: 75% }


/* Add Calendar Icon to DatePicker Fields */
.date-picker {
	position: relative;
	color:    #555;
}

.date-picker:after {
	content:                 "\e109";
	position:                absolute;
	top:                     8px;
	left:                    8px;
	display:                 block;
	width:                   28px;
	height:                  34px;
	background:              #4797D8;
	/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#337ab7+0,337ab7+100 */
	background:              #337AB7; /* Old browsers */
	background:              -moz-linear-gradient(top, #337AB7 0%, #337AB7 100%); /* FF3.6-15 */
	background:              -webkit-linear-gradient(top, #337AB7 0%, #337AB7 100%); /* Chrome10-25,Safari5.1-6 */
	background:              linear-gradient(to bottom, #337AB7 0%, #337AB7 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	filter:                  progid:DXImageTransform.Microsoft.gradient(startColorstr='#337ab7', endColorstr='#337ab7', GradientType=0); /* IE6-9 */
	border-radius:           4px 0 0 4px;
	padding:                 9px 0 0 7px;
	color:                   #FFF;
	font-family:             'Glyphicons Halflings';
	font-size:               14px;
	font-style:              normal;
	font-weight:             400;
	line-height:             1;
	-webkit-font-smoothing:  antialiased;
	-moz-osx-font-smoothing: grayscale;
}

.date-picker.top-left:after {
	top:  0;
	left: 0;
}

.date-picker input[type="text"].form-control {
	min-width:     127px;
	padding-top:   8px;
	padding-left:  34px;
	padding-right: 38px;
}

.date-picker input[type="text"].form-control + select {
	position:           absolute;
	top:                8px;
	right:              8px;
	width:              30px;
	height:             34px;
	background:         #EFEFEF;
	/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#f2f2f2+0,cccccc+100 */
	background:         #F2F2F2; /* Old browsers */
	background:         -moz-linear-gradient(top, #F2F2F2 0%, #CCC 100%); /* FF3.6-15 */
	background:         -webkit-linear-gradient(top, #F2F2F2 0%, #CCC 100%); /* Chrome10-25,Safari5.1-6 */
	background:         linear-gradient(to bottom, #F2F2F2 0%, #CCC 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	filter:             progid:DXImageTransform.Microsoft.gradient(startColorstr='#f2f2f2', endColorstr='#cccccc', GradientType=0); /* IE6-9 */
	border:             1px solid #CCC;
	border-radius:      0 4px 4px 0;
	padding-right:      2px;
	font-size:          14px;
	text-align:         center;
	-webkit-appearance: none;
	-moz-appearance:    none;
	appearance:         none;
	cursor:             pointer;
}


div.required > label:after { content: " *"; color: red; }

div.required > label.noasterisk:after { content: " "; }


.uline-blue { text-decoration: underline; color: #C9E0FA }

.uline { text-decoration: underline; color: black }


table tbody tr td.col-skinny { width: 85px }
table tbody tr td.col-skinny2 { width: 135px }
table tbody tr td.col-skinny3 { width: 165px }

table tbody tr td.col-medium { width: 170px }

table tbody tr td.col-medium2 { width: 200px }


#order-list table tbody tr { cursor: pointer; }

div#order-list table tbody tr.r1 { background-color: rgba(242, 242, 242, 1) }

div#order-list table tbody tr.r2 { background-color: rgb(255, 255, 255) }

div#order-list table tbody tr:hover { background-color: rgba(60, 102, 219, 0.5) }

/* order-details */
.orderd-action { text-align: center; text-decoration: underline; color: blue }

.action-link:hover { cursor: pointer; }

#all_shipped:hover { cursor: pointer; }

#none_shipped:hover { cursor: pointer; }

.orddet-bucket { padding-right: 20px }

.current-link {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size:   14px;
	color:       orange;
}


/* order details */
div#od-grid { width: 1500px }

div#od-grid table { margin-bottom: 0px }

div#od-grid table thead { background-color: black; color: white }

div#orddet-ordinfo { clear: left; float: left }

div#orddet-ordinfo div.col1 { clear: left; float: left; width: 200px }

div#orddet-ordinfo div.col2 { float: left; width: 200px }
div#orddet-ordinfo div.col2-wide { float: left; width: 400px }

div#orddet-ordinfo div.col-notes { float: left; margin-right: 10px }

div#orddet-billing { float: left }

div#orddet-billing div.header { float: left; width: 300px }

div#orddet-billing div.address { clear: left; float: left; width: 300px }

div#orddet-shipping { float: left }

div#orddet-shipping div.header { float: left; width: 300px }

div#orddet-shipping div.address { clear: left; float: left; width: 300px }



div#orddet-summary { width: 750px; margin-left: 8px }

div#orddet-summary { float: left }

div#orddet-summary div.col1 { clear: left; float: left; width: 450px; text-align: left; height: 25px; }

div#orddet-summary div.col1 span { padding-right: 8px }

div#orddet-summary div.col2 { float: left; width: 70px; text-align: right; height: 25px; text-align: right }


div#orddet-footer { margin-left: 170px }

div#orddet-footer { float: left }

div#orddet-footer div.col1 { clear: left; float: left; width: 485px; text-align: right; height: 25px; }

div#orddet-footer div.col1 span { padding-right: 8px }

div#orddet-footer div.col2 { float: left; width: 70px; text-align: right; height: 25px; text-align: right }



.modal-header {
	padding: 1px;
	border:  none;
}

.modal-body {
	position: relative;
	padding:  0px 15px 15px 15px;
}

@media (min-width: 992px) {
	.modal-extralg {
		width: 1600px;
	}
}


/* product template */
.prodtemp-label { float: left; width: 75px; margin-top: 5px }

.prodtemp-input { width: 200px; margin-left: 0px }

/* div#prodtp-grid table { margin-bottom: 0px } */
div#prodtp-grid table thead { background-color: black; color: white }


div#prodtp-grid table thead tr th a { text-decoration: underline; color: #C9E0FA }

/* country state filter */
.countrytemp-label { float: left; width: 125px; margin-top: 5px }
.countrytemp-input { width: 200px; margin-left: 0px }



/* Purchase Orders */

/*
<select id="purchaseorder-status" class="form-control" name="PurchaseOrder[status]" aria-required="true" aria-invalid="false">
<option value="Created" disabled="">Created</option>
<option style="font-weight: bold" value="Approved">Approved</option>
<option value="Declined" disabled="">Declined</option>
<option value="Issued" disabled="">Issued</option>
<option value="Accepted with Backorders" disabled="">Accepted with Backorders</option>
<option value="Accepted" disabled="">Accepted</option>
<option value="Rejected" disabled="">Rejected</option>
<option value="Partially Shipped" disabled="">Partially Shipped</option>
<option value="Shipped" disabled="">Shipped</option>
<option value="Partially Delivered" disabled="">Partially Delivered</option>
<option value="Delivered" selected="">Delivered</option>
</select>
*/

select#purchaseorder-status option { font-weight: bold }
select#purchaseorder-status option:disabled { font-weight: normal }

span#reject-reason { text-align: left; padding-left: 5px }
span#decline-reason { text-align: left; padding-left: 5px }


label.po-label { float: left; width: 22% }
div.po-input-container { float: left; width: 30%; margin-right: 3px; }
div.po-input-container2 { float: left; width: 60%; margin-right: 3px }
div.label-spacer { float: left; width: 30%; height: 1px }
div.po-addy { margin-left: 17px } 


.form-group-po { margin-bottom: 5px; }
.form-group-po .help-block { margin-top: 2px; margin-bottom: 3px }


.form-group-po2 { margin-bottom: 5px; margin-top: 20px; }
.form-group-po2 .help-block { margin-top: 2px; margin-bottom: 3px }

.field-purchaseorder-freight_account, .field-purchaseorder-hq_num    { margin-top: 10px; }
#add-po-detail-container { position: relative; top: 175px; right: 43px; width: 20px }
#add-po-detail:hover { cursor: pointer  }

.po-productid { width: 120px; }
.po-product-name { width: 400px; }
.product-cost-container { width: 110px }
.product-cost { width: 100px; text-align: center }
.po-cost-container { width: 110px }
.po-cost { width: 100px; text-align: center }

.po-dollar {
	position: relative;
	padding-left: 10px;
}
.po-dollar:before {
	content: "\0024";
	position: absolute;
	left: 0;
	top: 7px;
}

.po-line-total {
	position: relative;
	padding-left: 10px;
	padding-right: 5px;
}
.po-line-total:before {
	content: "\0024";
	position: absolute;
	left: 0;
	top: -2px;
}


div#p0_podetail { width: 1795px }

div#p0_podetail table { margin-bottom: 0px }

div#p0_podetail table thead { background-color: black; color: white }
div#p0_podetail table thead a { color: white }

div#backorder-container { width: 800px; margin-left: auto; margin-right: auto }

div#backorder-grid { width: 800px;  }

div.bo-date { margin-top: 15px  }

.table tfoot tr td { border: none } 
.table tfoot tr.po_total_row td { padding-right: 5px } 

table > tbody > tr > td.v-middle { vertical-align: middle; }




/* Assign State to Region */

.container-country-col1 { width: 20%; margin-left: 50px; float: left }

.container-country-col2 { width: 20%; margin-right: 50px; float: left }

.container-country-col3 { width: 20%; margin-right: 50px; float: left }

.container-country-col4 { width: 20%; margin-right: 50px; float: left }

.inventory-hdr-form .controls {
	padding-top: 25px;
	text-align:  right;
}

/* Enter Physical Count */

div#w0 table tbody tr td.align-center { vertical-align: middle } 


/* Dashboard */

div#orders-list-grid div div div div.summary { text-align: left  }

div#orders-list-grid div table tbody tr { cursor: pointer }
div#pos-list-grid div table tbody tr { cursor: pointer }


div#pos-list-grid div div div div.summary { text-align: left  }

/* User */

.user-detail-container { width: 1750px; margin-left: auto; margin-right: auto; }
	

.container-user-col { width: 16%; margin-left: 0px; margin-bottom: 10px; float: left; font-size: 12px }

div.ud-chk label { font-weight: normal  }


/* Reports */
label.report-label { float: left; width: 100px; margin-top: 5px;  }
div.report-control-container { float: left; width: 25%; }
div.report-control-date { float: left; width: 10% }
div.inventory-report { margin-left: 20px  }
div.invdetail-control-container { float: left; width: 50%; }
div.invdetail-row { margin-top: 10px }

/* Xfer */ 
span.xfer-delete { color: #337ab7; }
span.xfer-delete:hover { cursor: pointer; }

/* Adjustment */
#download_adjust { float: right }