/*
CTC Separate Stylesheet
Updated: 2024-05-28 16:42:20
*/

.nav__menu {
    list-style: none;
    display: flex !important;
    gap: 20px;
    padding-top: 20px;
    padding-bottom: 20px;
    font-family: 'Roboto', sans-serif;
}
.single-product .woocommerce-product-gallery, .product_meta .posted_in, .tabs.wc-tabs {
display:none;
}
.single-product .product.type-product {
padding-top:0;
}
#tab-description h2:first-of-type {
  display:none;
}
button.single_add_to_cart_button {
	background-color: #bf0418 !important;
}
.woocommerce:where(body:not(.woocommerce-uses-block-theme)) div.product p.price, .woocommerce:where(body:not(.woocommerce-uses-block-theme)) div.product span.price {
	color:black;
}
.woocommerce span.onsale {
	background-color:red !important;
}
.related.products {
    display: none !important;
}
.woocommerce #content div.product div.summary, .woocommerce div.product div.summary, .woocommerce-page #content div.product div.summary, .woocommerce-page div.product div.summary {
	float:unset !important;
}
.woocommerce span.onsale {
	top: -4em;
  left: -4em;
}
@media only screen and (max-width: 768px) {
    .woocommerce span.onsale {
	top: -4em;
  left: -3em;
}
}
/* Font Awesome icon for the cart */
.menu-item.cart-icon a::before {
    content: '\f07a'; /* Unicode for shopping cart icon in Font Awesome */
    font-family: 'Font Awesome 5 Free'; /* Font Awesome font family */
    font-weight: 900; /* Required for solid icons */
    font-size: 20px; /* Adjust the size as needed */
    display: block;
}

.woocommerce:where(body:not(.woocommerce-uses-block-theme)) ul.products li.product .price {
    color: black !important;
}
a.wc-block-cart__submit-button {
    border: 1px solid brown;
}
a.wc-block-cart__submit-button:hover {
    border:none;
    background-color: brown;
    color: white;
}
.product__button-wrapper a#openModalButton.button.button__custom.button__custom--product {

  padding: 0 !important;
  background-color: #bf0418 ;
}
.button__custom--product:hover {
    background: #eee !important;
}
.fab.fa-youtube-play::before {
  content: "\f167"; /* Unicode for the YouTube icon */
  font-family: "Font Awesome 5 Brands";
}
ul.footer-menu,ul.footer-menu li {
  list-style: none;
  text-align: left;
  line-height: 1.4em;
}
ul.footer-menu a {
  color:white;
}
ul.footer-menu a:hover {
  color:red;
}
#p24-change-currency-widget {
	border:none !important;
	padding:0 !important;
}
#p24-change-currency-widget h2 {
	font-weight:400 !important;
	font-size:16px !important;
}
form .widget-title {
	font-weight:400 !important;
	font-size:16px !important;
	display:none;
}
.woocommerce .quantity .qty {
	height:37px !important;
}
#join {
  background-color: #ff3434;
  display: table;
  width: 209px;
  position: fixed;
  right: -35px;
  top: 236px;
  padding: 14px 36px 14px 21px;
  z-index: 100;
  -webkit-transition: all 0.2s ease;
  -moz-transition: all 0.2s ease;
  -ms-transition: all 0.2s ease;
  -o-transition: all 0.2s ease;
  transition: all 0.2s ease;
  transform: scale(0.8);
}
@media only screen and (max-width: 991px){
    #join {width: 190px !important;padding:10px 36px 10px 21px !important;}
    #join p {font-size: 14px !important;}
    #join img {
        padding-top:9px !important;
    }
     #promotional-block2 {
        z-index: 1000 !important;
     }
     #join {
      display: none;
     }
}
#join p,
#join img {
  display: inline-block;
}
#join img {
  padding-top: 11px;
  float: left;
  position: relative;
  left: -5px;
}
 #join p {
  font-size: 16px;
  float: right;
  font-weight: bold;
  margin-bottom: 0;
line-height: 2.7em;
color: white;
}
 #join p span {
  font-size: 17px;
  color: #121212;
}
 #join:hover, #join2:hover {
  right: 0;
}
 #join:hover img {
  -webkit-animation: flote 0.7s ease infinite;
  -moz-animation: flote 0.7s ease infinite;
  -ms-animation: flote 0.7s ease infinite;
  animation: flote 0.7s ease infinite;
}
/* ------------------------------------------------------------------
   Modern, standards-compliant block (all evergreen browsers, 2025+)
------------------------------------------------------------------ */
@keyframes flote {
  0%   { transform: translate3d(0, 0, 0); }
  25%  { transform: translate3d(-4px, 0, 0); }
  75%  { transform: translate3d( 4px, 0, 0); }
  100% { transform: translate3d(0, 0, 0); }
}

/* ------------------------------------------------------------------
   Optional vendor prefixes for genuinely old engines
   (≈ Safari ≤ 8, Android ≤ 4.4, Firefox ≤ 4, IE/Edge Legacy)
------------------------------------------------------------------ */
@-webkit-keyframes flote {
  0%   { transform: translate3d(0, 0, 0); }
  25%  { transform: translate3d(-4px, 0, 0); }
  75%  { transform: translate3d( 4px, 0, 0); }
  100% { transform: translate3d(0, 0, 0); }
}

@-moz-keyframes flote {
  0%   { transform: translate3d(0, 0, 0); }
  25%  { transform: translate3d(-4px, 0, 0); }
  75%  { transform: translate3d( 4px, 0, 0); }
  100% { transform: translate3d(0, 0, 0); }
}

@-ms-keyframes flote {
  0%   { transform: translate3d(0, 0, 0); }
  25%  { transform: translate3d(-4px, 0, 0); }
  75%  { transform: translate3d( 4px, 0, 0); }
  100% { transform: translate3d(0, 0, 0); }
}
