/* Text color on mobile devices */
@media (max-width: 767px) {
    .text-primary {
        color: #00aeef !important; /* white color on mobile */
    }
}
/*#product_info .img-thumbnail {*/
/*  width: 100%;*/
/*}*/

/* Makes price bar Teal on mobile */
@media only screen and (max-width: 574px) {
    #productpricetotal #producttotalprice,
    #productpricetotal .price_calc_unit_price {
        justify-content: center !important;
        background-color: #00aeef;
        border-radius: 6px; /* Adjust the value to control the roundness of corners */
        padding: 5px 10px; /* Adjust padding as needed */
        cursor: pointer; /* Add cursor pointer to indicate interactivity */
        display: inline-block; /* Ensure it behaves like a block element */
        text-align: center; /* Center text within the button */
    }
}


/* Changes color and weight of Pricing Calculator text
#price_calculator #producttotalprice {
    color: #00aeef !important;
}
*/

/* Default font style */
#price_calculator #producttotalprice {
    color: #00aeef !important;
    font-weight: normal; /* Normal font weight */
}

/* Media query for mobile devices - Changes color and weight of Pricing Calculator text */
@media only screen and (max-width: 767px) {
    #price_calculator #producttotalprice {
        color: #ffffff !important; /* White font color */
    }
}


/* Change footer link color to white on hover */
.footer_links a span:hover {
    color: #FFF !important;
}


/* Removes Arrows from Carousel Slider 
.carousel-control-prev, .carousel-control-next {
    display: none;
    }
    */
 
 /* Removes Indicators from Carousel Slider   
.carousel-indicators {
    display: none;
}
*/

    
/* Changes Top Message Color */
    .bg-primary {
    background-color: #e40000 !important;
    }
    
/*
    .bg-primary {
    background: linear-gradient(135deg, #FFCC80, #FF7043, #D32F2F) !important;
}
*/
 
/* Changes Badge Color  */
    .badge-info {
    background: #ff0293;
    color: #fff;
    font-weight: normal;
}


/* Changes Padding on Menu Badge */
.mr-2, .mx-2 {
    margin-left: 0.5rem !important;
}

.bg-light {
  background-color: #eff3f5 !important;
}


/* Changes Color of Danger Button */
.btn-danger {
    color: #fff;
    background-color: #979797;
    border-color: #979797;
}


/* Changes Color of Danger Button */
.btn-danger:hover {
    color: #fff;
    background-color: #666666;
    border-color: #666666;
    }


/* Changes color of Green success button */
.btn-success {
    background: #30b97a;
    border-color: #30b97a;
}


/* Changes color of Green success button hover */
.btn-success:hover {
  background: #1f8658;
  border-color: #1f8658;
}


/* Changes color of Green success button hover
.btn-success:hover, .btn-success:focus, .btn-success:not(:disabled):not(.disabled):active, .btn-success:not(:disabled):not(.disabled).active, .btn-success:not(:disabled):not(.disabled):active:focus {
  background: #1f8658;
  border-color: #1f8658;
}
*/



/* Changes Padding above Products on Homepage  */
@media screen and (min-width: 1248px) {
.home_page_body .middle_content {
    padding-top: 2rem;
    padding-bottom: 4rem;
}
}

/* Changes BKG Color behind Benefits on Homepage  */
.header-content .services_resources {
    background-color: #eff3f5;
}

/* Changes Padding on Mobile "My Account" button
.btn.btn-sm {
   line-height: 3.3;
}
*/

/* Changes Color of Danger Text
.text-danger {
    color: #35afdc !important;
}
*/

/* Changes Color of Info Button */
.btn-info {
    background: #2ba2d6;
    border-color: #2ba2d6;
    color: #fff;
}

/* Changes Color of Secondary Button */
.btn-outline-secondary {
    background: #00aeef;
    border-color: #00aeef;
    color: #ffffff;
}


/* Changes Color of Secondary Button when Disabled */
.btn-outline-secondary.disabled, .btn-outline-secondary:disabled {
    color: #b0b0b0;
    background-color: rgba(0,0,0,0);
    border-color: #b0b0b0;
}


/* Changes Color of Sidebar Titles*/
#straightmenu .list-group .list-group-item > a.all-product {
    font-size: 16px;
    font-size: 1rem;
    font-family: "nunitosemibold", sans-serif;
    color: #000 !important;
}


/* Changes Color for Checkout Bubbles*/
.bg-primary {
    background-color: #30b97a !important;
}


/* Changes Placeholder for Upload Later */
.imgPlaceHolder:not(.title-PlaceHolder):before {
    content: "\f0aa";
    }

#shopping-cart .order-img .imgPlaceHolder:not(.title-PlaceHolder):before {
    font-size: 18px;
    font-size: 2.125rem;
    height: 33px;
}

/* Changes Placeholder for Upload Later */
.imgPlaceHolder:not(.title-PlaceHolder):after {
    display: none;
}


/* Changes color of upload button */
.btn-title-text.upload_design a {
    background: #30b97a !important;
    border-color: #30b97a;
}


/* Changes color of upload button hover */
.btn-title-text.upload_design:hover a .h4,
.btn-title-text.upload_design:hover a i {
  color: #1f8658 !important;
}



/* Changes color of info button */
.btn-info,
.btn-info:hover,
.btn-info:focus,
.btn-info:not(:disabled):not(.disabled):active,
.btn-info:not(:disabled):not(.disabled).active,
.btn-info:not(:disabled):not(.disabled):active:focus {
    background: #30b97a;
    border-color: #30b97a;
    color: #fff;
}

/* Changes color of info button hover */
.btn-info:hover,
.btn-info:focus,
.btn-info:not(:disabled):not(.disabled):active,
.btn-info:not(:disabled):not(.disabled).active,
.btn-info:not(:disabled):not(.disabled):active:focus {
    background: #1f8658;
    border-color: #1f8658;
    color: #fff;
}




/* Changes color of info button background hover */
.btn-title-text.upload_design:hover a {
  background: #1f8658 !important;
}

/* Changes color of info button text hover */
.btn-title-text.upload_design:hover a .h4,
.btn-title-text.upload_design:hover a i {
  color: #fff !important;
}

@media screen and (max-width:767px) {
    .price_calculator #productpricetotal {
  z-index: 99;
}
}



/* Change cart color when hovered */
.fa-shopping-cart:hover:before {
    color: #00aeef;
}

/* Changes shoppig cart badge text color when hovered */
.top-header .top-links li a:hover .badge {
    color: #fff; /* Color on hover */
}




/* Changes Position of Promotional Text 
.float-right {
    float: none !important;
    margin-left: 6px;
}*/

#product-info .upload_artwork_letter {
    display: none;
}


/* Removes small underline from H1 and H2 titles */
.main_title h2:after {
  content: " ";
  display: block;
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  width: 0px;
  height: 2px;
  background: linear-gradient(to right, #4dabe9, #a4e4ff);
  margin: 0 auto;
}


/* Removes small underline from H1 and H2 titles */
.HomePage_Title h1:after {
  content: " ";
  display: block;
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  width: 0px;
  height: 2px;
  background: linear-gradient(to right, #4dabe9, #a4e4ff);
  margin: 0 auto;
}


/* Why Choose TheFlyerLab Underline */

.gradient-underline {
  position: relative; /* Needed for positioning the pseudo-element */
  display: inline-block; /* Ensures proper spacing and alignment */
}

/* Why Choose TheFlyerLab Gradient Text */
.gradient-underline {
  position: relative;
  display: inline-block;
  background: linear-gradient(to right, #00a8f4, #904ada, #d6268c); /* Gradient for text */
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}

/* Why Choose TheFlyerLab Gradient Underline */
.gradient-underline::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: -6px; /* Adjust distance from the text */
  width: 100%; /* Matches the width of the span */
  height: 2px; /* Thickness of the underline */
  background: linear-gradient(to right, #00a8f4, #904ada, #d6268c); /* Gradient */
  border-radius: 2px; /* Optional: smooth edges */
}

.no-underline::after {
  display: none !important;
}


.product-box .card.hover-box-shadow .card-body .card-title {
  color: #416480 !important;
  font-size: 20px;
  font-size: 1.25rem;
  font-family: "nunitosemibold", sans-serif;
}


.wisp {
  position: relative;
  display: inline-block !important; /* Ensure bell is visible */
  visibility: visible !important;
  z-index: 10; /* Ensure it's above other elements */
}

.wisp_count {
  position: absolute !important; /* Correctly position counter */
  top: -2px !important;
  right: 20px !important;
  background: rgb(255, 59, 48) !important;
  color: rgb(255, 255, 255) !important;
  border-radius: 50% !important;
  width: 15px !important;
  height: 15px !important;
  display: flex !important;
  justify-content: center !important;
  align-items: center !important;
  z-index: 10 !important;
}

.top_header {
  display: flex; /* Align children horizontally */
  align-items: center;
  justify-content: space-between;
  width: 100%; /* Ensure full width */
  overflow: visible; /* Prevent clipping */
}

@media (max-width: 768px) {
  .top_header a[href="tel:8669935937"] {
    display: none; /* Hide phone number on mobile */
  }
}

  
@media (max-width: 768px) {
  .wisp {
    display: inline-block !important;
    visibility: visible !important;
  }
}