/* MFW style overrides */

/* resize logo to fill space available */
/* first for mobile */

header .logo {
    margin: 1px 0 !important;
}

header .logo img {
    max-height: 40px !important;
}

/* then for larger screens */
@media screen and (min-width: 40.0625em) {
  header .logo {
      margin: 4px 0 !important;
  }

  header .logo img {
      max-height: 54px !important;
  }
}
.logo img {
  height: auto !important;
}

/*overide margin-top for cart and search for mobile*/
@media screen and (max-width: 40em) {
#bannerCart, #searchToggle {
    margin-top: 1px !important;
}
}

/* turn off the portal username display */
#wpthemeUserName {
  display: none !important;
}


.cartItems a, .cartItems a:active,
.topNavBar a, .topNavBar a:active {
  color: #555;
}
a, a:active, a:hover, a:focus {
  color: #009cdf;
  text-decoration: none;
  transition: all 250ms ease-in-out;
  -webkit-transition: all 250ms ease-in-out;
  /* color: #0368a1; */
}

#itemDetailLeft {
    position: relative;
    height: 325px;
    margin: auto;
    width: 300px;
}

.itemDetailLayout4 .itemDetailLeft .itemImage .image {
  width: 250px;
}
.itemDetailLayout4 .itemDetailLeft .imageThumbs ul li {
  width: 20px !important;
  height: 20px !important;
}

@media screen and (max-width: 30em) {
  .flyBox .fbContent, .flyBoxAlert .fbContent, .itemDetailLightbox .lbContent {
      max-height: 500px;
  }

  #itemDetailLeft {
      width: 100vw;
  }
  .appContainer.itemDetail .itemDetailLayout4, .appContainer.itemDetail .itemDetailLayout4 .itemDetailContainer, .backLink.itemDetailback, .itemDetailLayout4 .itemDetailFull, .itemDetailLayout4 .rightColumn {
    width: 100vw !important;
  }
  .itemDetailLayout4 .itemDetailContainer .itemDetailRight {
      width: 100vw;
      float: none;
      margin: 0 5px;
  }
}

@media (min-width:75em) {
  /* for larger screen give more space for upsell items */
  .appContainer.itemDetail .itemDetailLayout4 {
    width: 1140px !important; /* default was 1080px */
    margin: auto;
  }
}

#itemPriceBox {
    max-width: 135px !important;
}

#OverViewTab { overflow: hidden; }
.itemDescription h1 {font-weight: 700;}

#itemImage {
    top: 50%;
    left: 50%;
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    margin: 0;
    position: absolute;
}
/**/
.s2k-dojo .dijitTabContainerTop-tabs .dijitTab .tabLabel {
    min-height: 16px;
    margin: 0;
    position: absolute;
    top: 50%;
    left: 50%;
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
}
.s2k-dojo .dijitTabContainerTop-tabs .dijitTab {
    -moz-border-radius: 2px 2px 0 0;
    border-radius: 10px 10px 0 0;
    font-weight: bold;
    vertical-align: middle;
    min-height: 43px;
    padding-left: 25px;
    padding-right: 25px;
}
/*
@media (min-width:1200px) {
.s2k-dojo .dijitTabContainerTop-tabs .dijitTab {
}
}
*/
/* Add to wishlist styles */
.itemQuantity .dijitTextBox .dijitInputField {
    padding: 0px !important;
}
.boxes .ogButton .dijitDropDownButton .dijitButtonNode {
    margin-top: 0 !important;
}
/* End add to wishlist styles */
/* Related items*/
.relatedItems .listView .detailRow .itemImage {
  float: left;
  margin-right: 10px;
  min-width: 127px;
}
 .listView .detailRow .itemImage img {
  width: auto !important;
  height: auto !important;
  max-width: 175px;
}
 .itemDetailLayout4 .relatedItems .detailRow {
    display: inline-block !important;
}
.listView .detailRow .itemDetails {
    width: unset !important;
    max-width: 440px;
}

/*the floating header was set to z-index 2001 - which put it above the popup tooltip when items are added to cart.
 changing it to be 999 since the popup is set to 1000 and this one is easier to change. */
.headerBanner .logoNavContainer {
    z-index: 999 !important;
}

.upsellProducts	.groundShipping,
.upsellProducts .heavy,
.upsellProducts .hazardSurcharge,
.upsellProducts .overSized,
.upsellProducts .refrigerated {
  background-repeat: no-repeat;
  background-position: 0 0;
  width: 15px;
  height: 15px;
  display: block;
  float: left;
  margin: 2px;
}

/* Search results page */

/* rearrange page controls and selectors at top of page */
.mainCol .topControls .buttonBar .right .layoutButtons {
margin: -10px 5px 0 0;
}
.mainCol .topControls .buttonBar .right .listSize {
position: initial;
}
.mainCol .topControls .buttonBar {
margin-top: -27px;
padding: 0 0 10px 0;
float: right;
width: 50%;
}
.topControls .gridPaging {
padding: 0;
}
/* end rearrange controls */

.outerContainer .innerContainer .wpthemeMainContent {
	/* max-width: 1000px; */
	max-width: 1280px;
	margin: auto;
}
#itemPriceBox {
    text-align: center;
    max-width: 115px;
    float: right;
    margin: 10px;
    padding: 5px;
    border: 1px solid #999;
}
.itemDetailLayout4 .priceBox .addToCart {
margin-top: 0px;
}
.itemDetailLayout4 .priceBox .quantity {
margin-top: 0px;
}
.itemDetailLayout4 .priceBox .addToCartButton {
margin-top: 0px;
margin-bottom: 0px;
}
#cartBox {
width: 100%;
min-height: 40px;
}

.shippingIcon {
	background-repeat: no-repeat;
	background-position: 0px 0px;
	width: 18px;
	height: 16px; /* formerly 18, but it fits better on the line this way */
	display: inline-block;
}
#pkgOptions a:hover, #pkgOptions a:focus {
	text-decoration: none;
}

.boxes .itemResults .itemDescription {
    height: 28px;
}
.boxes .additionalInfo {
    height: auto;
    margin: 5px;
}
.boxes .itemResults .itemDescription, .boxes .itemResults .itemDescription h3 {
    margin: 0;
    font-size: 1em;
    white-space: unset;
    overflow: unset;
    text-overflow: unset;
    text-align: center;
}
.listView .detailRow .itemDetails {
    width: unset;
}
/* end search results page */


/* end of overrides */

/* used to hide components in various places */
.dspNone {
  display: none !important;
}

/* used on view cart page */
.inCartMessage {
  color: slategray;
  margin-left: 2em;
  font-size: 1em;
}

.inCartWarning {
  color: #A11C3F;
}

.mfwOrangebutton {
		background: linear-gradient(to bottom, rgba(220,150,42,1) 25%, rgba(241,90,34,1) 100%) !important;
		color: #fff !important;
}
.mfwBluebutton {
		background: linear-gradient(to bottom, rgba(29,161,220,1) 25%, rgba(44,73,107,1) 100%) !important;
		color: #fff !important;
}
.mfwGreenbutton {
		background: linear-gradient(to bottom, rgba(141,198,63,1) 25%, rgba(0,92,50,1) 100%) !important;
		color: #fff !important;
}
.mfwPurplebutton {
		background: linear-gradient(to bottom, rgba(178,94,166,1) 25%, rgba(102,34,102,1) 100%) !important;
		color: #fff !important;
}
.mfwOrangebackground,
.mfwOrange:hover {
	background: hsl(34,96%,89%) !important;
}
.mfwBluebackground,
.mfwBlue:hover {
	background: hsl(199,100%,94%) !important;
}
.mfwGreenbackground,
.mfwGreen:hover {
	background: hsl(81,35%,87%) !important;
}
.mfwPurplebackground,
.mfwPurple:hover {
	background: hsl(309,35%,87%) !important;
}


/* Generic ToolTip CSS */
.tool {
  cursor : help;
  position : relative;
}

.tool::before, .tool::after {
  position : absolute;
  left : 50%;
  opacity : 0;
  z-index: -100;
}

.tool:hover::before, .tool:focus::before, .tool:hover::after, .tool:focus::after {
  opacity : 1;
  z-index: 100;
}

.tool::before {
  border-style : solid;
  border-width : 1em .75em 0 .75em;
  border-color : #3e474f transparent transparent transparent;
  bottom : 100%;
  margin-left : -.5em;
  content : " ";
}

.tool::after {
  background : #3e474f;
  border-radius : .25em;
  bottom : 180%;
  color : white;
  width : 17.5em;
  padding: 1em;
  margin-left : -8.75em;
  content : attr(data-tip);
}
/*end generic tooltip css*/

/* MFW tooltip styles for coupon box*/
.mfwTooltip {
  border-bottom: 1px dotted black;
}
/* Show the tooltip text when you mouse over the tooltip container */
.mfwTooltip:hover .mfwTooltipText {
visibility: visible;
}

.mfwTooltipText {
    visibility: hidden;
    position: absolute;
    background: white;
    width: 70%;
    border-radius: 6px;
    padding: 10px;
    box-shadow: 10px 10px grey;
    border: 4px;
    border-style: solid;
    border-color: black;
    left:60px;
}

/* table as DIV */
.divTable {
	display: table;
	width: 100%;
}
.divTableRow {
	display: table-row;
}
.divTableHeading {
	background-color: #EEE;
	display: table-header-group;
}
.divTableCell, .divTableHead {
	border: 1px solid #999999;
	padding: 3px 10px;
}
@media screen and (min-width: 40.0625em) {
  .divTableCell, .divTableHead {
  	display: table-cell;
  }
}
.divTableHeading {
	background-color: #EEE;
	display: table-header-group;
	font-weight: bold;
}
.divTableFoot {
	background-color: #EEE;
	display: table-footer-group;
	font-weight: bold;
}
.divTableBody {
	display: table-row-group;
}

/* used on WORLD magazine page */
.linkButton {
  display: inline-block;
  color: #fff;
  padding: 4px 12px;
  margin-top: 8px;
  border-top: 1px solid rgba(250, 250, 250, 0.4);
  border-left: 1px solid rgba(250, 250, 250, 0.4);
  border-bottom: 1px solid rgba(0, 0, 0, 0.4);
  border-right: 1px solid rgba(0, 0, 0, 0.4);
  background: linear-gradient(to bottom, #646462 0%, #0b0b0b 100%);
}

.linkButton:hover, .linkButton:focus {
  text-decoration: none;
  color: white;
}

.linkButton img {
  margin: -2px 5px 2px 0;
}