/* !!!!!!!!!! DO NOT CUSTOMIZE THIS FILE FOR CUSTOMERS !!!!!!!!!! */
/* Custom changes must be done in custom.css */

/* This option makes div widths and padding calculations in Firefox work the same as IE */
DIV {
	-moz-box-sizing:border-box;
	box-sizing:border-box;
	-webkit-box-sizing:border-box;
	margin:0;
	padding:0;
}
 
#user-bar {
	display: flex;
	flex-flow: row wrap;
	margin: 15px 0;
}

#session_timeout_div {
	display: inline-block;
	white-space: nowrap;
	margin: 0 10px 0 auto;
}

#session_timeout_div:after {
	content: "\00A0\00A0";
}
 
#userinfo {
	display: inline-block;
	z-index: 1;
	margin: 0 auto 0 10px;
}

/* customer name/code/session timeout */
#userinfo span {
	margin-left: 1ch;
}
#userinfo span:empty,
#userinfo span:first-of-type {
	margin: 0;
}
#userinfo span:first-of-type:empty + span {
	margin-left: 0;
}

#srvletarea {
	min-height: 450px;
    height:auto; 
    padding-bottom: 20px;
}

#srvletarea #minamounts {
	border: 1px solid black;
	padding: 5px;
	margin-bottom: 12px;
	max-width: 300px;
}
#srvletarea #minamounts h3 {
	font-family: Arial,Helvetica,sans-serif;
	font-size:9pt;
	font-weight: bold;
}
#srvletarea #minamounts .minnotmet{
	color: red;
}

/* Use this to undo styles that don't make sense for popup windows */
#srvletarea.srvletpopup {
	min-height: 0px;
	height: auto;
	width: auto;
}

#srvletarea td { padding: 3px 4px 3px 4px; } 
#srvletarea th { padding: 3px 4px 3px 4px; } 

#srvletarea #adpage table.catalogTable td, #srvletarea #adpage table.catalogTable th {
	font-size: 11px;
}

#BGDT, #ENDT {
	width: 132px;
}
 		 
/****************************************************************
 * 	jQuery related styles                                    		
 ****************************************************************/

#srvletarea textarea, #srvletarea input[type=text], #srvletarea input[type=password], #srvletarea input[type=number] {
	-webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px; 
 	padding: 3px;
	border: 1px solid #ccc;
}

#srvletarea input[type=button], #srvletarea input[type=submit], #srvletarea input[type=reset] {
    font-size: 15px;
    padding: .4em .6em;
}

div.ui-dialog {
 font-size: 12px;
}

img.ui-datepicker-trigger:hover {
	cursor:pointer;
}

img.ui-datepicker-trigger {
	margin-left: 5px;
}
 
#ui-datepicker-div, #ui-datepicker-header {
	font-size: 11pt;
} 	 
 		
#ui-datepicker-div.ui-datepicker table.ui-datepicker-calendar thead tr th {
	background-color: transparent;
	color: black;
} 		

/* For image hover tooltip window */
.ui-tooltip.ui-widget.ui-corner-all.ui-widget-content { 
    -moz-box-sizing:content-box;
    box-sizing:content-box;
    -webkit-box-sizing:content-box;
}
 		
/****************************************************************
 * 	End jQuery related styles                                   		
 ****************************************************************/		

body.bprint{
	font-size: 9pt;
	background-color: #FFFFFF;
	background-image: none;
	padding-left: 10px;
}

h3.reminderItem, p.reminderItem {
	color: red;
}

table {
	border-collapse: separate;
}

body.MinimumOrderWarning {
	background-color: #FFFFCC;
}

a.nav {
	font-size: 11px; 
	font-weight: bold; 
	text-decoration: none;
	color: White;
}
a.nav:hover {
	text-decoration: underline;
}

a {
	color: #000099;
}

.superscript {
	font-size: smaller; 
	vertical-align:super;
}

p.small {
	font-size: 8pt;
}

.notebox {
	border: 1px solid #CD0A0A;
	/* -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px; */ 
	color: #CD0A0A;
	padding: 5px;
	margin: 10px;
	width: 80%;
}

input.submit, input.submit_short, input.submit_long, input.submit_verylong, input.submit_medium, input.submitCancel, input.submitUpdate, input.submitReturn, input.submitCheckout, input.profMaintSubmit, input.printPreview, input.downloadOrder, input.submitOrder  {
	cursor: pointer;
}
input.submit:hover, input.submit_short:hover, input.submit_long:hover, input.submit_verylong:hover, input.submit_medium:hover, input.submitCancel:hover, input.submitUpdate:hover, input.submitReturn:hover, input.submitCheckout:hover, input.profMaintSubmit:hover {
	cursor: pointer;
}

/***********************************************************************
* Use orderFlow to apply a style to all buttons that lead through
* a completed order: View Shopping Cart, Checkout, etc.
************************************************************************/
input.orderFlow,
button.orderFlow {
	border: 1px solid #00cf00;
}
input.orderCancel,
button.orderCancel {
	border: 1px solid #e74c3c;
}

/*
* close is used on the close link of popup windows.  These are usually the same
* but can be different...if you want to give a special color to the "add to profile
* button.
*/
a.close {
	background-color: #525152;
	border: 1px solid #000000;
	color: #FFFFFF;
	text-decoration: none;
	padding: 2px;
	FONT-FAMILY: verdana, helvetica, tahoma, arial, sans-serif;
	font-size: 8pt;
	width: 140px;
 	text-align: center;
}

a.submit, a.submitRemove {
	color: black;
	text-decoration: underline;
	padding: 1px;
	font-size: 8pt;
	width: 122px;
 	text-align: center;
	padding-left: 4px;
	padding-right: 4px;
	margin-right: 2px;
}

a.submit:hover {
	color: #009900;
}

a.submitRemove:hover {
	color: #990000;
}

li.double {
	padding-bottom : 15px;
}

.shaded {
	background: #EEE;
}

.profileshaded{
	background: #EEE;
}

.pproholiday{
	font-size: 9px;
	margin: 4px;
}

.pproholiday img {
	padding-right: 3px;
}

#csh_message {
	width: 348px;
	margin: 2px;
}

.aditem {
	background: #ffffe5;
}

.noprint {
}

p, td, th, li {
	font-size: 11pt;
}

@media only screen and (max-width: 989px) {
	p, td, th {
		font-size: 10pt;
	}
}

@media only screen and (max-width: 768px) {
	p, td, th {
		font-size: 9pt;
	}
}

th {
	text-align: left;
}

th.right {
	text-align: right;
}

#srvletarea table.week td.today, #srvletarea table.week td.firstday, #srvletarea table.week td.lastday, #srvletarea table.week td.day, #srvletarea table.week td.weeklinks {
	padding: 0px;
}

input.highlight, .highlight {
	background: #FFFF00;
}

/* Calendar */

#calendarDiv td.day {
	padding: 0px;
}	 

#calendarDiv table.ui-widget tbody tr td.day {
	height: 100px;
	width: 80px;
	vertical-align: top;
}
#calendarDiv table.ui-widget tbody tr td.weeklinks {
	padding: 0px;
	width: 10%;
}
#calendarDiv a {
	text-decoration: underline;
}
#calendarDiv span.weekly {
	font-size: 10px;
	font-weight: bold;
	margin: 0 0 2px 0;
	display: block;
	padding: 3px;
}
#calendarDiv span.daynumber {
	font-size: 12px;
	font-weight: bold;
	text-align: right;
	margin: 0 0 2px 0;
	display: block;
	padding: 2px;
}
.calendarside {
	FONT-WEIGHT: bold; FONT-SIZE: 10px; 
	padding-left: 3px;
	padding-bottom: 2px;
}
.pproholiday {
	FONT-SIZE: 10px;
}
.calendarnav {
}

/************profile maintenance *************************/
span.maintButtonPosition {
    margin-left: 150px;
}
#profile_lst.connectedSortable, #catalog_lst.connectedSortable {
    width: 370px;
    height: 400px;
    overflow: hidden;
    overflow-y: scroll;
    padding: 0px;
    border: 2px solid #333;
    background-color: white;
}

#profile_lst ul, #catalog_lst ul {
	padding: 0px;
}
	
#profile_lst li, #catalog_lst li {
	padding: 2px;
	border: 1px solid #ccc;
	list-style-type: none;
}

#profile_lst li:hover, #catalog_lst li:hover {
    cursor: pointer;
}

#profile_lst li.ui-sortable-helper, #catalog_lst li.ui-sortable-helper {
    cursor: move;
}

.pm-trash {
    width: 340px;
    border: 1px solid black;
    padding: 5px;
    margin-bottom: 28px;
}

.pm-trash img {
	vertical-align: middle;
}

/***********core item price increase/decrease***************/
span.priceIncrease {
	font-size: 13pt;
 	text-align: center;
	background: none;
	font-weight: bold;
	color: #0066FF;
	vertical-align: middle;
}
span.priceDecrease {
	font-size: 13pt;
 	text-align: center;
	background: none;
	font-weight: bold;
	color: #8C007B;
	vertical-align: middle;
}

/***********Tooltip Window***************/
.iTt {
	FONT-SIZE:8px;
	FONT-STYLE:normal;
	FONT-WEIGHT:normal;
	COLOR: #006400;
	BORDER-RIGHT:black 1px solid;
	BORDER-TOP:black 1px solid;
	BORDER-LEFT:black 1px solid;
	BORDER-BOTTOM:black 1px solid;
	PADDING:2px;
	BACKGROUND-COLOR: #FFFFE0;
}
.iTt.A:link {
	text-decoration: none; 
	color: #00008b;
}

/********** Order Add Ons / Warning *******************/
.addonmsg, .alert { 
	color: red;
	font-size: 12px;
	font-weight: bold 
}
/********* Expired Pricing Message / No Sales Order No ******/

.noprices, .nosono {
	background-color: #FFE8E8;
	border: 2px solid Red;
	margin: 10px 20px 10px 20px;
	padding: 5px 5px 5px 5px;
}

/********* Coupon Codes ******/
.coupon_message {
    background-color: #ffe;
    border: 1px solid black;
    margin-top: 5px;
    margin-bottom: 5px;
    padding: 5px 5px 5px 5px;
}

/*********Ad and Push List Indicators********************/
.adsuper, .pushsuper, .unitsuper, .subsuper, .brokensuper, .secondarypricelistsuper, .remindersuper {
	padding-left: 2px; 
	padding-right: 2px; 
	font-size: 9px; 
	color: #ff0000;  
	vertical-align:super; 
	font-weight:bold;
}
.pushsuper {
	color: #00ff00;
}
.adprice {
	color: #ff0000;  
}
.subssuper {
	color: orange;
}
.remindersuper {
	color: teal;
}

/******* Use generalTable class instead of login as needed****/
.recapFooter{border:none;width:100%;}

.cartTable, .generalTable, .login, .pricelistrequest, .catalogTable, .orderDetailTable, .recapTable, .creditDetailTable, .reportsTable, .checkoutTable {
	border: 1px solid #000000;
	width: 100%;
}
#catsearchTable, .recvTable {
	width: 100%;
}
.orderDetailTable {
}
.orderDetailTable th {
}
.orderDetailTable tbody tr.shaded {
}
.generalTable{
	width:50%;
}
.catalogTable {
	border-bottom: 0px;
}

.catalogTableMiddle {
	border-left: 1px solid #000000;
	border-right: 1px solid #000000;
	border-bottom: 0px;
	width: 100%;
}

.catalogTableMiddle:last-child {
	border-bottom: 1px solid #000000;
}

.catalogTableTop {
	border-top: 1px solid #000000;
	border-left: 1px solid #000000;
	border-right: 1px solid #000000;
	border-bottom: 0px;
	width: 100%;
}

@media only screen and (max-width: 768px) {
	/* Hide dynamic columns on small screen devices */
	#srvletarea table.catalogTable td.dyncolumn, #srvletarea table.catalogTable th.dyncolumn {
		display: none;
	}
	
}

/* min width for browse catalog page number links (doesn't work in IE) */
th.pagesection div input.pagelink {
	min-width: 20px;
}

.reportsTable th {
	width: 150px;
}
.itemnocol {
	width: 60px;
}

#srvletarea th.desccol {
	padding-left: 42px;
	/* width: 350px; */ /* fixed size */
}

.descvalwidth {
	/* width: 350px; */ /* fixed size */
}

.upccol {
	width: 125px;
	min-width: 125px;
}

.plucol {
	width: 50px;
	min-width: 50px;
}

.checkoutTable, .cartTable {
	border: none;
}
td.buttonCell{
	text-align: center;
}

table.checkoutTable td, table.checkoutTable th {
	text-align: left;
} 

table.recapTable td, table.recapTable th {
}

td.label{
	width: 30%;
}

#srvletarea table.orderDetailTable {
	width:100%;
}

.hidden {
	display: none;
	visibility: hidden;
}

.catalogProdImage { 
	display: block;
	flex-grow: 1;
	margin-right: 5px;
	width: 56px;
	background: #FFF;
	position: relative;
	border: 1px solid #ccc;
	float: left;
}

.catalogProdImageInner {
	background-position: center;
	background-repeat: no-repeat;
	background-size: cover;
	overflow: hidden;
	height: 50px;
	width: 54px;
}

.catalogProdImageOuter {
	width: 57px;
	height: 52px;
	padding: 0px;
	margin: 0px;
	vertical-align: middle;
	display: inline-table;	
}

.catalogProdNotes {
	margin-left: 40px;	
}
.catalogProdNotes i {
	vertical-align: -10%;
}

.noProfileMsg {
	color: white;
}

/***************************************
* Inner table is used within cartTable
*****************************************/
#srvletarea table.innerTable tbody tr th {
	border: 0px;
	padding: 0px;
	width:100%;
}

/******* Product units link style ****/
a.submitUnits {
	color: black; 
	cursor: pointer; 
	font-size: 7pt; 
	font-weight: bold; 
	text-align: center;
	width: 70px;
}

a.submitUnits {
	color: black; 
	cursor: pointer; 
	font-weight: bold; 
}

/******* Credit Card stuff *******/
th.credit {
	background-color: #CCCCCC;
	color: #000000;
}

/******************************************
* Handheld
*******************************************/
/*** Uncomment next line ***/
/* .screen_only{display:block;} */
/*** Comment next line ***/
.handheld_only{display:none;}

/** Ad Items on Calendar Page **/
table.specials td {
	font-size: 11px;
}
table.specials {
	width: 100%;
}

.tableconcls {
	height: 300px; 
	overflow: scroll; 
}

.orderDivider {
	height: 6px; 
	background: #CCCCCC;
}

.dyncolumn {
	padding-right: 6px;
	word-break: break-word;
}

/*****************************************************************
* Print Preview page
*****************************************************************/
body.bprint {
	font-size: 7pt;
} 

body.bprint p, body.bprint th, body.bprint td{
	font-size: 7pt;
}

/*****************************************************************
* Login page / Forgotten password
*****************************************************************/
a.forgotpasslink {
	font-size: 8pt;
}

/************************************
* Contact Us
**************************************/

#FormArea table {
	margin-bottom:10px;
}
#ContactUsAlert, .alertMessage {
	padding:10px;
}
#ContactUsAlert {
	margin-left: 25px;
	width:425px;
	filter:shadow(color:gray, strength:3, direction:135);
}
#ContactUsAlert .alertMessage {
	color: blue;
	background-color: #ffffce;
	border: 1px solid black;
	font-size: 15px;
}
/******************************************
* Order Item Exceptions
*******************************************/
#itemExceptions, #cutoffException {
	margin-left: 5px;	
	margin-right: 5px;	
	margin-bottom: 5px;	
	width:auto;
	filter:shadow(color:gray, strength:3, direction:135);
}	
#itemExceptions h3, #cutoffException h3 {
   margin-top:3px;
}	 
#itemExceptions .itemExceptionMessage, #cutoffException, .cutoffExceptionMessage {	 
	padding:5px;
	color: #a51818;
	background-color: #ffffce;
	border: 1px solid black;
}
/******************************************
* Credits
*******************************************/
.credit {
	color: red;
	font-weight: bold;
}
.creditDetailTable th { }

/**********************************************
* Order Summary/Recap
***********************************************/
.review{
	color: navy;
	background-color:#FFFFCC;
	font: 12px verdana, helvetica, tahoma, arial, sans-serif; 
	font-weight: normal;
	padding: 10px;
	border: 2px solid red;
}

/**************************************************
* Calendar page related
***************************************************/

.hotitem {
    float: left;
    width: 180px;
    height: 200px;
    margin-right: 15px;
}

.calhot {
	display: block;
	flex-grow: 1;
	margin-right: 3px;
	width: 173px;
	background: #FFF;
	margin-bottom: 5px;
	position: relative;
	vertical-align: top;	
}

.hotimg {
	background-position: center;
	background-repeat: no-repeat;
	background-size: cover;
	overflow: hidden;
	height: 128px;
} 

/**************************************************
* Calendar / Policy Page Announcements
***************************************************/
#calendar_announcement{
	margin: 20px 0px;
}
#calendar_announcement table{
	width:100%;
}
#calendar_announcement th{
}
#calendar_announcement td{

}
#calendar_announcement table{
}
.announcements{
	border: 1px solid #ddd; 
	padding: 10px 5px 10px 5px;
}

/*******************************************************************
* Edit Order
**********************************************************************/
#addon_page_note{ display:block; margin-top: 5px; margin-bottom: 5px; width:60%; margin-left: 0px; }
input.editOrderButton{}
input.editOrderButtonDisabled{background-color:#eaeaea; color:#b5b5b5;}
input.addToOrderButton{}

#simplemodal-container.simplemodal-container[style]{ background-color:#ffffd2 !important; color:#000000 !important; height: 200px !important; width: 500px !important; }
#simplemodal-container h3{ color:#4a5910;}
#simplemodal-container input.submit{background-color:#2159a5; color:white; font-size: larger;}
#simplemodal-container input.simplemodal-close{}

/**********************************************
 * Login page
 **********************************************/
.logincustmess {
	font-size: 16px;
	font-weight: bold;
}

.insttext { 
	font-size: 7pt; 
	color: black;
}

table.ptagmaintable {
	width: 200px;
	border: 1px solid black;
}

table.ptagbuttontable input {
	width: 75px;
}

/*************************************************
 * SRP UPDATE
 ************************************************/
.srp_upcclass{
	padding-top:5px;
}
.srp_email{
	width:30em;
}
table.srp_recaptable{
	border-collapse:collapse;
	border-style:solid;
	border-width:1px;
}

table.srp_recaptable th, table.srp_recaptable td{
	border-style:solid;
	border-width:1px;
}

table.srp_recaptable td{
	vertical-align:top;
}
table.srp_recaptable th{
	width:3em;
}
table.srp_recaptable th.desc{
	width:20em;
}
table.srp_recaptable th.srp{
	width:10em;
}

.noProfileMsg {
	color: white;
}

#changeSRPfilterTable {
	border: solid 1px;
}

#changeSRPfilterTable th {
	text-align: center;
}

.categoryFilters {
    width: 275px;
}

.categoryFilters table {
    margin: auto;
}

.filterSection {
	margin: auto 10px;
}

.filterOptions {
	border-left: solid 1px;
}

.filterOptions div {
	margin: 10px auto;
}

.srpTable .priceIncrease, .srpTable .priceDecrease {
    margin-left: 5px;
}

.SRPmodified {
	background-color: palegreen !important;
}

/*************************************************
 * Price Range Text
 ************************************************/

table#pricerangekey {
	width: 50%;
	border: 1px solid black;
}

table#pricerangekey td, table#pricerangekey th {
	font-size: 8pt;
}

table#pricerangekey .firstcol {
	background-color: #ddd;
}

.cartupdate {
    float: left;
    position: relative;
    left: -60px;
    height: 0px;
    color: red;
}

.recvdtclass {
	font-weight: bold;
	white-space: nowrap;
}

div.submitCrossSell {
    border: 2px solid #777779;
    padding: 15px;
    display: inline;
    float: left;
    margin-right: 30px;
    margin-bottom: 20px;
    height: 65px;
    width: 300px;
}

div.submitCrossSell a {
    font-size: 22px;
    color: white;
    opacity: 0.75;
    padding: 6px;
    background-color: black;
}

.mobileHidden {
	display: none;
}

.arrow-right:after {
    content: "";
    position: absolute;
    right: -15px;
    top: 0;
    width: 0; 
    height: 0; 
    border-top: 15px solid transparent;
    border-bottom: 15px solid transparent;
    border-left: 15px solid white;
}

.loading {
	position: fixed;
	top: 0;
	left: 0;
	width: 100vw;
	height: 100vh;
	z-index: 10000;
	background-color: rgba(0, 0, 0, 0.301);
	cursor: progress;
}

.spinner {
    color: rgba(0,0,0,0) !important;
    background-color: white;
    background-image: url(../media/spinner.gif) !important;
    background-repeat: no-repeat !important;
	background-size: 16px 16px !important;
    background-position: center;
}
.catalog_profmaint_button {
	min-width: 20px;
}
.catalog_profmaint_button.spinner {
	background-color: transparent;
	background-position: left center;
}

.catalog_profmaint_button.disabled {
  pointer-events: none;
}
.catalog_profmaint_button.disabled img {
	visibility: hidden;
}

/** Mobile apps links on login page */
.mobile-apps {
	display: flex;
	flex-flow: row nowrap;
	justify-content: center;
	align-items: center;
}
.mobile-apps a,
.mobile-apps img {
	display: block;
	height: 100%;
	width: auto;
}

.mobile-apple,
.mobile-android {
    display: inline-block;
	height: 50px;
	width: auto;
	padding: 5px;
}
/**/

/********************************************
 * Contact Maintenance Page
 * *******************************************/
#customer_contact_edit {
	float: left;
	padding: 20px;
}

p.form-section-detail.phone {
	white-space: nowrap;
}

.customertab {
	background-color: white;
	border-radius: 3px;
	display: flex;
	flex-flow: wrap;
	width: 90%;
	padding-left: 10px;
	border: 13px solid #aabcd4;
}

#customertab_new {
	border: none;
}

.customer_tab_content {
	float: left;
	padding: 10px;
	min-width: 375px;
}

.customer_tab_content p {
	margin: 0 0 0.25em;
}

.customer_tab_content p.form-section-header {
	margin: 0.75em 0 0.75em 0;
	font-weight: bold;
}
.cont-type-info:not([aria-label=""])::before {
	content: " ";
	cursor: help;
	position: absolute;
	width: 12px;
	height: 16px;
	margin-left: 3px;
	background-image: url(../media/question-circle-solid.svg);
	background-size: contain;
	background-repeat: no-repeat;
	background-position: center bottom;
	filter: opacity(50%);
}

.form-section p.form-section-header {
    text-transform: uppercase;
    font-size: 13px;
    color: #A2A8AD;
    letter-spacing: 1px;
}

p.form-section-detail.phone {
    white-space: nowrap;
}

/**/

/* Shopping cart indicator */
.cart-wrapper {
	color: #666;
}
.cart-wrapper .item-num {
	background-color: #d4656b;
}
.cart-wrapper:hover {
	color: #000;
}
.cart-wrapper:hover .item-num {
	background-color: #CE1F28;
}
.cart-wrapper {
	display: inline-flex;
	flex-flow: row nowrap;
	margin: 0 1.5em;
	font-size: 11pt; /* Change this property ONLY to scale up/down */
	cursor: pointer;
}
.cart-wrapper > .cart-text {
	font-size: 1em;
}
.cart-wrapper > .cart-icon {
	font-size: 0.8em;
}
.cart-wrapper > .cart-text *,
.cart-wrapper > .cart-icon * {
	font-size: inherit;
}
.cart-wrapper > .cart-text {
	display: flex;
	flex-flow: column nowrap;
	justify-content: center;
	margin-left: 0.5em;
}
.cart-wrapper > .cart-icon {
	margin: auto;
	padding-right: 0.5em;
	position: relative;
	vertical-align: middle;
	text-align: center;
}
.cart-wrapper > .cart-icon > svg > path {
	fill: currentColor;
}
.cart-wrapper .item-num {
	width: 1.5em;
	height: 1.5em;
	position: absolute;
	top: -0.5em;
	right: 0;
	border-radius: 50%;
	color: #ffffff;
	background-color: #d4656b;
	flex-flow: row nowrap;
	justify-content: center;
	align-items: center;
}
.cart-wrapper .item-num > span {
	line-height: 1.5em;
	height: 1.5em;
}
.cart-wrapper > .cart-text p {
	padding: 0 .2em;
	margin: auto 0 auto auto;
}
/**/

/* New login page styles */
.login-wrapper {
	display: flex;
	flex-flow: row wrap;
	justify-content: center;
	align-items: center;
	width: 100%;
}
.login-wrapper label {
	margin-top: 5px;
	display: block;
	font-size: 11pt;
}
.login-inputs,
.login-links {
	display: flex;
	flex-flow: column nowrap;
}
.login-inputs {
	margin-right: 5em;
	margin-left: 5em;
}
.forgotpasslink {
	margin-top: 1em;
	margin-bottom: 1em;
}
.login-flavor {
	width: 50%;
}

.cartitemcount, #cartitemcount, #cartitemcount_mobile {
    display: inline-block;
}

/**/

/* Public vendor about section */
.extracted-about-text .text{
	width: fit-content;
	margin: auto;
}
/* see media query at end of file */

/* New profile class search */
.hidden.profile-class-filter {
	display: initial;
	visibility: visible;
}
/**/

/* Ad based order (support for CTABCO "Ad based order checkout method") */
.submitCheckout.method-O {
	display: none;
}
.submitReview.method-C {
	display: none;
}

/* password promt styles */
input[id="promptPassword"] {
	margin-left: 10px;
}
/**/

/***********************
 * MEDIA QUERIES
 ***********************/

/* Public vendor about section */
@media (max-width: 520px) {
  .extracted-about-text br{
    display: none;
    content: ' ';
  }
}
/**/

/**
 * Print from a jQuery dialog.
 * assumes popup is direct child of <body>.
 */
@media print {
	/* Remove buttons from the printout */
	.ui-dialog input[type="button"] {
		display: none!important;
	}
	/* default print removes background colors, so remove borders and colored text too */
	.ui-dialog *,
	.orderDetailTable,
	.orderDetailTable * {
		border: none!important;
		color: black!important;
	}
	/* make dialog fill whole screen and not cutoff content */
	.ui-dialog, .ui-dialog-content {
		top: 0px!important;
		left: 0px!important;
		height: auto!important;
		width: auto!important;
	}
}

/** CONTACT MAINETNANCE BALLOONS 
https://github.com/kazzkiq/balloon.css/tree/1027b4f518c616a1ec96b608ee913e8c6d9fd0e4

Edited from original.

The MIT License (MIT)

Copyright (c) 2016 Claudio Holanda

Permission is hereby granted, free of charge, to any person obtaining a copy
of this software and associated documentation files (the "Software"), to deal
in the Software without restriction, including without limitation the rights
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
copies of the Software, and to permit persons to whom the Software is
furnished to do so, subject to the following conditions:

The above copyright notice and this permission notice shall be included in all
copies or substantial portions of the Software.

THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
SOFTWARE.
*/

:root {
  --balloon-color: rgba(16, 16, 16, 0.95);
  --balloon-font-size: 12px;
  --balloon-move: 12px; }

button[aria-label][data-balloon-pos] {
  overflow: visible; }

[aria-label][data-balloon-pos] {
  position: relative;
  cursor: pointer; }
  [aria-label][data-balloon-pos]:after {
    opacity: 0;
    pointer-events: none;
    transition: all .18s ease-out .18s;
    text-indent: 0;
    font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;
    font-weight: normal;
    font-style: normal;
    text-shadow: none;
    font-size: var(--balloon-font-size);
    background: var(--balloon-color);
    border-radius: 2px;
    color: #fff;
    content: attr(aria-label);
    padding: .5em 1em;
    position: absolute;
    white-space: nowrap;
    z-index: 10; }
  [aria-label][data-balloon-pos]:hover:before, [aria-label][data-balloon-pos]:hover:after, [aria-label][data-balloon-pos][data-balloon-visible]:before, [aria-label][data-balloon-pos][data-balloon-visible]:after, [aria-label][data-balloon-pos]:not([data-balloon-nofocus]):focus:before, [aria-label][data-balloon-pos]:not([data-balloon-nofocus]):focus:after {
    opacity: 1;}
  [aria-label][data-balloon-pos].font-awesome:after {
    font-family: FontAwesome, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif; }
  [aria-label][data-balloon-pos][data-balloon-break]:after {
    white-space: pre; }
  [aria-label][data-balloon-pos][data-balloon-break][data-balloon-length]:after {
    white-space: pre-line;
    word-break: break-word; }
  [aria-label][data-balloon-pos][data-balloon-pos="up"]:after {
    bottom: 100%;
    left: 50%;
    margin-bottom: 10px;
    transform: translate(-50%, var(--balloon-move));
    transform-origin: top; }
  [aria-label][data-balloon-pos][data-balloon-pos="up"]:hover:after, [aria-label][data-balloon-pos][data-balloon-pos="up"][data-balloon-visible]:after {
    transform: translate(-50%, 0); }
  [aria-label][data-balloon-pos][data-balloon-pos="down"]:after {
    left: 50%;
    margin-top: 10px;
    top: 100%;
    transform: translate(-50%, calc(var(--balloon-move) * -1)); }
  [aria-label][data-balloon-pos][data-balloon-pos="down"]:hover:after, [aria-label][data-balloon-pos][data-balloon-pos="down"][data-balloon-visible]:after {
    transform: translate(-50%, 0); }
  [aria-label][data-balloon-pos][data-balloon-pos="left"]:after {
    margin-right: 10px;
    right: 100%;
    top: 50%;
    transform: translate(0, -50%); }
  [aria-label][data-balloon-pos][data-balloon-pos="left"]:hover:after, [aria-label][data-balloon-pos][data-balloon-pos="left"][data-balloon-visible]:after {
    transform: translate(calc(var(--balloon-move) * -1), -50%); }
  [aria-label][data-balloon-pos][data-balloon-pos="right"]:after {
    left: 100%;
    margin-left: 10px;
    top: 50%;
    transform: translate(0, -50%); }
  [aria-label][data-balloon-pos][data-balloon-pos="right"]:hover:after, [aria-label][data-balloon-pos][data-balloon-pos="right"][data-balloon-visible]:after {
    transform: translate(var(--balloon-move), -50%); }
  [aria-label][data-balloon-pos][data-balloon-length="small"]:after {
    white-space: normal;
    width: 80px; }
  [aria-label][data-balloon-pos][data-balloon-length="medium"]:after {
    white-space: normal;
    width: 150px; }
  [aria-label][data-balloon-pos][data-balloon-length="large"]:after {
    white-space: normal;
    width: 260px; }
  [aria-label][data-balloon-pos][data-balloon-length="xlarge"]:after {
    white-space: normal;
    width: 380px; }
    @media screen and (max-width: 768px) {
      [aria-label][data-balloon-pos][data-balloon-length="xlarge"]:after {
        white-space: normal;
        width: 90vw; } }
  [aria-label][data-balloon-pos][data-balloon-length="fit"]:after {
    white-space: normal;
    width: 100%; }

/*  END CONTACT MAINTENANCE BALLOONS */

/* Specials carousel styles */
#specials-ui .specials-carousel {
	display: flex;
    padding: 20px 50px;
    margin-bottom: 30px;
}

.special-img {
    width: fit-content;
    margin: auto;
	display: flex;
}

.special-img img {
    width: 200px;
    object-fit: cover;
}

.special-info {
    padding: 10px;
}

.special-add {
    width: fit-content;
    margin: auto;
}

.slick-list {
  overflow: hidden;
}

.slick-slide {
    padding: 15px;
    margin: 5px;
    display: block;
    height: 320px;
    border: 1px solid lightgrey;
    transition: all 0.3s ease-in-out;
}

.slick-slide:hover {
	box-shadow: 0px 3px 9px rgba(0, 0, 0, 0.5);
}

.slick-slide .row {
  margin: unset;
}

.slick-slide .col-lg-3, .slick-slide .col-md-4, .slick-slide .col-sm-6{
  flex: unset;
  max-width: unset;
  width: 100%;
  padding: 0px;
}

.slick-slide .special-info *{
  width: fit-content;
  margin: auto;
  font-size: 10pt;
  text-align: center;
}

.slick-slide .special-box .add-to-cart a{
  width: 100%;
}

.slick-slide .special-box .add-to-cart a::after{
  position: relative;
  left: 19px;
  top: 2px;
}

.slick-track {
  display: flex;
}

.slick-dots {
  display: none !important;
}

.slick-prev, .slick-next {
    /*color: #999;*/
    color: transparent;
    width: 17px;
    height: 20px;
    background-color: transparent;
    border: none;
    position: relative;
    top: 160px;
    font-size: 25pt;
}

.slick-prev:before:hover, .slick-next:before:hover {
	font-weight: bold;
	transition: 0.1s;
}

.slick-prev {
    right: 20px;
}

.slick-next {
    left: 20px;
}

.slick-prev:before {
  content: "\27E8";
  color: grey;
}

.slick-next:before {
  content: "\27E9";
  color: grey;
}

.slick-prev:focus, .slick-next:focus {
  outline: none;
}

@media (max-width: 991px){
  .slick-slide .special-box .special-info .special-title{
    font-size: 10pt;
  }
  .slick-slide .special-info *{
    width: fit-content;
    margin: auto;
    font-size: 8pt;
    text-align: center;
  }
}

@media (max-width: 810px){
  .slick-slide .special-box .add-to-cart a::after{
    font-size: 20px;
    left: 10px;
  }
}
/* end specials carousel styles */
