@import url('https://fonts.googleapis.com/css2?family=Sofia+Sans+Semi+Condensed:ital,wght@0,400..800;1,400..800&display=swap'); /* global display font, see block at end */
.Content.BorderLeft {
padding-left: 50px;
border-left: solid #dedede 1px;    
}
.M40 {
margin-left: 40px;
margin-right: 40px;    
}
.M20 {
margin-left: 20px;
margin-right: 20px;    
}
.btn.next {
background-image: url(//cdn10.bigcommerce.com/r-cf8dc1a36e37ca22115036b22a6b2976a6384be1/themes/Sammot/images/white/btnNext.png) !important;
background-position: 12px 50% !important;
background-repeat: no-repeat !important;
padding-left: 33px;
margin-top: 0;
}
.btn.back {
background-image: url(//cdn10.bigcommerce.com/r-cf8dc1a36e37ca22115036b22a6b2976a6384be1/themes/Sammot/images/white/btnPrev.png) !important;
background-position: 12px 50% !important;
background-repeat: no-repeat !important;
padding-left: 33px;
margin-top: 0;
}


.iframe-container {
  position: relative;
  width: 100%;
  padding-bottom: 56.25%; /* 16:9 ratio */
  height: 0;
  overflow: hidden;
}

.iframe-container iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  border: 0;
}


.desktop-br {
    display: none;
}

/* Display <br> only on devices wider than 768px */
@media (min-width: 768px) {
    .desktop-br {
        display: inline;
    }
}

/* Hide the extra AddThis DetailRow under the Add to Cart section */
.productAddToCartRight > form + .DetailRow {
    display: none !important;
}


/* Hide the extra AddThis DetailRow under the Add to Cart section */
.productAddToCartRight > form + .DetailRow {
    display: none !important;
}

/* Hide the Facebook like box on product pages */
.FacebookLikeButtonContainer {
    display: none !important;
}


/* Remove the light grey border around the main product image box on product pages */
.ProductPage .ProductThumbWrap {
    border: none !important;
    box-shadow: none !important; /* in case the "border" is actually a shadow */
}

/* Also remove any border directly on the image inside, just in case */
.ProductPage .ProductThumbWrap img {
    border: none !important;
}


/* Remove borders from thumbnail strip on product pages */
.ProductPage .ProductTinyImageList li,
.ProductPage .ProductTinyImageList li.normal,
.ProductPage .ProductTinyImageList li.selected,
.ProductPage .ProductTinyImageList li .TinyOuterDiv,
.ProductPage .ProductTinyImageList li .TinyOuterDiv > div,
.ProductPage .ProductTinyImageList img {
    border: none !important;
    outline: none !important;
}

/* === Global display font: Sofia Sans Semi Condensed (replaces Oswald), added 2026-09-30 ===
   Source: SBG-stores stores/sakebomb/content/global-font-sofia-sans.css. Every selector below is one the
   theme's styles.css / white.css set to Oswald. Default weight 500 (Medium); #Logo h1 stays bold (700).
   To undo: delete this block and the @import line at the top of custom.css. */
input[type=submit], .btn,   input[type=reset],  input[type=button], h1, h2, h3, .TitleHeading, h3, h4, #Logo, #HeaderLower, .ProductMain h5.brandName, #QuickViewProductDetails h5.brandName, #ProductReviews a.button, .ProductPriceWrap .RetailPrice, .ProductPriceWrap .PriceRow, .fastCartItemBox .ProductPrice, .fastCartSummaryBox .ProductPrice, #FooterUpper .Column input.Button, #HeaderLower li ul li, #SideCartContents .ViewCartLink, #SideCartContents .CheckoutLink, #sidr-right-compare .CompareNowLink, .ProductList li .ProductActionAdd a, .ProductList li .ProductActionAdd a.Choose, table.Stylize th, .fastCartContent .fastCartTop .fastCartProd a, .MobileView.CloseMenu a, #PageContent h1, #PageContent h2, #PageContent h3, #PageContent h4, #PageContent h5, #PageContent h1 { font-family: 'Sofia Sans Semi Condensed', 'Helvetica Neue', Arial, sans-serif !important; font-weight: 500 !important; }
#Logo h1 { font-family: 'Sofia Sans Semi Condensed', 'Helvetica Neue', Arial, sans-serif !important; font-weight: 700 !important; }
/* === end global display font === */
/* === Accent colour "yellow-red" (replaces the theme's orange #FF5C46), generated 2026-09-30 ===
   Source: SBG-stores stores/sakebomb/operations/build-accent-override.js. text #B5121B, backgrounds #F5C400
   with #000000 text, borders #F5C400. 50 rules. To undo: delete this block. */
#TopMenu .currency-converter #SideCurrencySelector h2 { color:#B5121B; }
#Logo h1 { color:#B5121B; }
.ProductTinyImageList li.selected { border-color:#F5C400 !important; }
.TabNav li a:hover { color:#B5121B; }
.Right li a:hover { color:#B5121B; }
.SubBrandList li a:hover { color:#B5121B; }
.SubBrandListGrid li a.BrandName:hover { color:#B5121B; }
.fastCartBottom h3 { color:#B5121B; }
.OutOfStockMessage { color:#B5121B; }
a { color:#B5121B; }
input[type=submit]:hover, .btn:hover, input[type=reset]:hover, input[type=button]:hover { background-color:#F5C400; color:#000000; }
.btn.btn-secondary { background-color:#F5C400; color:#000000; }
#FooterUpper .Column input.Button { background-color:#F5C400; color:#000000; }
#TopMenu .selCurr { color:#B5121B; }
#TopMenu .checkout { background-color:#F5C400; color:#000000; }
#Logo a { color:#B5121B; }
#HeaderLower { border-bottom-color:#F5C400; }
#Header > a { background-color:#F5C400; color:#000000; }
#HeaderLower li.ActivePage a, #HeaderLower li.over a, #HeaderLower li a:hover { background-color:#F5C400; color:#000000; }
#HeaderLower li ul li a:hover { background-color:#F5C400 !important; color:#000000 !important; }
#HeaderLower li.subOver li a { color:#B5121B; }
#HeaderLower li.subOver li.subOver li a { color:#B5121B; }
#SideCartContents h2, #sidr-right-compare h2 { background-color:#F5C400; color:#000000; background-image:radial-gradient(rgba(0,0,0,.22) 1px,transparent 1.2px); background-size:3px 3px; }
#SideCartContents .ViewCartLink, #SideCartContents .CheckoutLink, #sidr-right-compare .CompareNowLink { background-color:#F5C400; color:#000000; }
.Content .SideRecentlyViewed h2 { color:#B5121B; }
.Content .FeaturedProducts h2, .Content .Block h2 { color:#B5121B; }
.Left .Block h2 { color:#B5121B; }
.ProductList li .ProductDetails a:hover { color:#B5121B; }
.ProductList li .ProductActionAdd a:hover { background-color:#F5C400; color:#000000; border-color:#F5C400; }
.Left .CategoryList h2, .Left #SideNewProducts h2, #sidr-left-menu h2 { color:#B5121B; }
.addtowishlist > a:hover, .compare > a:hover { color:#B5121B; }
.TabNav li.Active a { color:#B5121B; }
.EstimateShipping input[type=button]:hover { background-color:#F5C400; color:#000000; }
.SalePrice { color:#B5121B; }
.treeview li a:hover, .treeview li a.selected, .treeview li li a.selected, .treeview li li li a.selected { background-color:#F5C400; color:#000000; }
.Content .Block h1, h1.title, .title, h1.PageHeader, h1.PageHeader.M40 { color:#B5121B !important; }
.BrandCloud a:hover { color:#B5121B; }
#SitemapContent li a:hover, #SitemapContent li { color:#B5121B; }
.ProductMain h1, #QuickViewProductDetails h1 { color:#B5121B; }
.Right .Block h2 { background-color:#F5C400; color:#000000; background-image:radial-gradient(rgba(0,0,0,.22) 1px,transparent 1.2px); background-size:3px 3px; }
.ProductList li .ProductDetails em { color:#B5121B; }
#ModalContent a, .ModalContent a { color:#B5121B !important; }
#SimilarProductsByCustomerViews h2 { color:#B5121B; }
.ProductReviewForm h4 { color:#B5121B; }
.fastCartContent .fastCartTop .fastCartProd a { color:#B5121B; }
.RemoveFromWishlistForm input[type="submit"]:hover { color:#B5121B !important; }
#SideAccountMenu li a:hover { color:#B5121B; }
.NewsDate { color:#B5121B; }
.MobileView.CloseMenu a { background-color:#F5C400; color:#000000; color:#B5121B; }
#LogoContainer a, #LogoContainer a span { color:#B5121B; }
/* === end accent colour === */
/* Header cart/compare buttons are white icon images; on the yellow they need to be black. */
#quickcartview img, #compareview img { filter: brightness(0); }
/* === Box headings (Categories, Current Top Sellers, page titles, "SakeBomb Garage - Service Center"), 2026-09-30 ===
   The theme's grey dot texture (images/square.png) made the new Medium-weight font hard to read, so: a much
   fainter CSS dot pattern, lighter dots on the yellow boxes, and SemiBold (650) type. To undo: delete this block. */
.Content .SideRecentlyViewed h2, .Content .FeaturedProducts h2, .Content .Block h2, .Left .Block h2,
.Left .CategoryList h2, .Left #SideNewProducts h2, #sidr-left-menu h2, .fastCartBottom h3,
#SimilarProductsByCustomerViews h2, .ExpressCheckoutBlockCollapsed .ExpressCheckoutTitle,
.Content .Block h1, h1.title, .title, h1.PageHeader, h1.PageHeader.M40 {
  background-image: radial-gradient(rgba(0,0,0,.07) 1px, transparent 1.2px) !important; background-size: 3px 3px !important;
  font-weight: 650 !important; }
.Right .Block h2, #SideCartContents h2, #sidr-right-compare h2 {
  background-image: radial-gradient(rgba(0,0,0,.10) 1px, transparent 1.2px) !important; background-size: 3px 3px !important;
  font-weight: 650 !important; }
/* === end box headings === */