a:focus,
a:hover,
a:active {
	color: #CC0000;
}

p a {
  text-decoration: underline;
  text-decoration-style: dotted;
}

.color {
	color: #CC0000;
}

a.read-more:hover {
	color:#CC0000;
}

.linked:hover {
	color:#CC0000;
}

/*Sliders
------------------------------------*/
/*Main Parallax Sldier*/
.da-slide h2 i {
	background:url(../../plugins/parallax-slider/img/bg-heading.png) repeat;
}

/*Sequence Parallax Sldier*/
.sequence-inner {
  background: -webkit-gradient(linear, 0 0, 0 bottom, from(#fff), to(#defce7));
  background: -webkit-linear-gradient(#fff, #defce7);
  background: -moz-linear-gradient(#fff, #defce7);
  background: -ms-linear-gradient(#fff, #defce7);
  background: -o-linear-gradient(#fff, #defce7);
  background: linear-gradient(#fff, #defce7)
}

#sequence-theme h2 {
	background:rgba(114, 192, 44, 0.8);
}

#sequence-theme .info p {
	background:rgba(114, 192, 44, 0.8);
}

/*Purchase
------------------------------------*/
.purchase a.btn-buy {
    text-shadow: none;
    color: #CC0000;
    background-color: #ffffff; /* White background */
    border: 1px solid #cccccc; /* Subtle border for definition */
    /*padding: 10px 20px;  /* Vertical and horizontal padding */
    /*font-family: Arial, sans-serif; /* Readable font */
    /*font-size: 16px;     /* Appropriate font size */
    cursor: pointer;     /* Indicate interactivity */
    text-align: center;
    text-decoration: none;
    display: inline-block;
}
.purchase a.btn-buy:hover {
    /*background:#AF1007;*/
    background-color: #f0f0f0; /* Slightly off-white on hover */
    border-color: #888282; /* Darker border on hover */
	color: #9D0000;
}

/*Buttons
------------------------------------*/
.btn-u {
	background: #CC0000;
}

.btn-u:hover {
	background: #AF1007;
}

/*Service
------------------------------------*/
.service .service-icon {
	color:#CC0000;
}

/*Service Blocks*/
.service-alternative .service:hover {
	background:#CC0000;
}

/*Thumbnail (Recent Work)
------------------------------------*/
.thumbnail-style h3 a:hover {
	color:#CC0000;
}

.thumbnail-style a.btn-more {
	background:#CC0000;
}
.thumbnail-style a.btn-more:hover {
	box-shadow:0 0 0 2px #AF1007;
}

/*Carousel (Recent Work)*/
.recent-work a:hover span {
	border-bottom:solid 2px #CC0000;
}

.bx-wrapper .bx-prev {
	background-image: url(../../plugins/bxslider/images/controls.png);
}
.bx-wrapper .bx-next {
	background-image: url(../../plugins/bxslider/images/controls.png);
}

/*Typography
------------------------------------*/
/*Heading*/
.headline h2,
.headline h3,
.headline h4 {
	border-bottom:2px solid #CC0000;
}

/*Blockquote*/
blockquote:hover {
	border-left-color:#CC0000;
}

.hero {
	border-left-color: #CC0000;
}

/*Carousel
------------------------------------*/
.carousel-arrow a.carousel-control:hover {
	color: #CC0000;
}

/*Footer
------------------------------------*/
.footer a,
.copyright a,
.footer a:hover,
.copyright a:hover {
	color: #CC0000;
}

/*Footer Blog*/
.footer .dl-horizontal a:hover {
	color:#CC0000 !important;
}

/*Blog Posts
------------------------------------*/
.posts .dl-horizontal a:hover {
	color:#CC0000;
}

.posts .dl-horizontal:hover dt img,
.posts .dl-horizontal:hover dd a {
	color: #CC0000;
	border-color: #CC0000 !important;
}

/*Post Comment*/
.post-comment h3,
.blog-item .media h3,
.blog-item .media h4.media-heading span a {
	color: #CC0000;
}

/*Tabs
------------------------------------*/
/*Tabs v1*/
.tab-v1 .nav-tabs {
	border-bottom: solid 2px #CC0000;
}

.tab-v1 .nav-tabs > .active > a,
.tab-v1 .nav-tabs > .active > a:hover,
.tab-v1 .nav-tabs > .active > a:focus {
	background: #CC0000;
}

.tab-v1 .nav-tabs > li > a:hover {
	background: #CC0000;
}

/*Tabs v2*/
.tab-v2 .nav-tabs li.active a {
	border-top: solid 2px #CC0000;
}

/*Tabs v3*/
.tab-v3 .nav-pills li a:hover,
.tab-v3 .nav-pills li.active a {
	background: #CC0000;
	border: solid 1px #AF1007;
}

/*Accardion
------------------------------------*/
.acc-home a.active,
.acc-home a.accordion-toggle:hover {
	color:#CC0000;
}
.acc-home .collapse.in {
	border-bottom:solid 1px #CC0000;
}

/*Testimonials
------------------------------------*/
.testimonials .testimonial-info {
	color: #CC0000;
}

.testimonials .carousel-arrow i:hover {
	background: #CC0000;
}

/*Info Blocks
------------------------------------*/
.info-blocks:hover i.icon-info-blocks {
	color: #CC0000;
}

/*Breadcrumb
------------------------------------*/
.breadcrumb li.active,
.breadcrumb li a:hover {
	color:#CC0000;
}

/*About Page
------------------------------------*/
.team .thumbnail-style:hover h3 a {
	color:#CC0000 !important;
}

/*Social Icons*/
.team ul.team-socail li i:hover {
	background: #CC0000;
}

/*Pricing Page
------------------------------------*/
/*Pricing Head*/
.pricing:hover h4 {
	color:#55c931;
}

.pricing-head h3 {
	background:#55c931;
	text-shadow:0 1px 0 #32a20f;
	border-bottom:solid 1px #41b91c;
}
.pricing-head h4 {
	color:#999;
	background:#fbfef2;
	border-bottom:solid 1px #f5f9e7;
}

/*Pricing Content*/
.pricing-content li {
	border-bottom:solid 1px #f5f9e7;
}
.pricing-content li i {
	color:#CC0000;
}


/*Priceing Active*/
.price-active h4 {
	color:#55c931;
}

.no-space-pricing .price-active .pricing-head h4,
.no-space-pricing .pricing:hover .pricing-head h4 {
	color:#55c931;
}

/*Right Sidebar
------------------------------------*/
/*Right Sidebar*/
.who li i,
.who li:hover i,
.who li:hover a {
	color:#CC0000;
}

/*Privacy Page
------------------------------------*/
.privacy a:hover {
	color:#CC0000;
}

/*Portfolio Page
------------------------------------*/
/*Portfolio v1*/
.view a.info:hover {
	background: #CC0000;
}

/*Portfolio v2*/
.sorting-block .sorting-nav li.active {
	color: #CC0000;
	border-bottom: solid 1px #CC0000;
}

.sorting-block .sorting-grid li a:hover span.sorting-cover {
	background: #CC0000;
}

/*Blog Page
------------------------------------*/
.blog h3 {
	color:#CC0000;
}
.blog li a:hover {
	color:#CC0000;
}

/*Blog Tags*/
ul.blog-tags a:hover {
	background: #CC0000;
}

.blog-post-tags ul.blog-tags a:hover {
    background: none repeat scroll 0 0 #CC0000;
}

/*Blog Photos*/
.blog-photos li img:hover {
	box-shadow: 0 0 0 2px #CC0000;
}

/*Blog Latest Tweets*/
.blog-twitter .blog-twitter-inner:hover {
	border-color: #CC0000;
	border-top-color: #CC0000;
}
.blog-twitter .blog-twitter-inner:hover:after {
	border-top-color: #CC0000;
}

.blog-twitter .blog-twitter-inner a {
	color: #CC0000;
}

/*Blog Item Page
------------------------------------*/
.blog-item h4.media-heading span a {
	color:#CC0000;
}

/*Coming Soon Page
------------------------------------*/
.coming-soon-border {
	border-top: solid 3px #CC0000;
}

/*Search Page
------------------------------------*/
.booking-blocks p a {
	color: #CC0000;
}

/*Icons Page
------------------------------------*/
.icon-page li:hover {
	color:#CC0000;
}

/*Glyphicons*/
.glyphicons-demo a:hover {
	color: #CC0000;
	text-decoration: none;
}

/*Magazine Page
------------------------------------*/
/*Magazine News*/
.magazine-news .by-author strong {
	color: #CC0000;
}

.magazine-news a.read-more {
	color: #CC0000;
}

/*Magazine Mini News*/
.magazine-mini-news .post-author strong {
	color: #CC0000;
}

.news-read-more i {
	background: #CC0000;
}

/*Sidebar Features*/
.magazine-page h3 a:hover {
	color: #CC0000;
}

/*Page Features
------------------------------------*/
/*Tag Boxes v1*/
.tag-box-v1 {
	border-top: solid 2px #CC0000;
}

/*Tag Boxes v2*/
.tag-box-v2 {
	border-left: solid 2px #CC0000;
}

/*Tag Boxes v7*/
.tag-box-v7 {
	border-bottom: solid 2px #CC0000;
}

/*Font Awesome Icon Page Style*/
.fa-icons li:hover {
   color: #CC0000;
}

.fa-icons li:hover i {
   background: #CC0000;
}

/*GLYPHICONS Icons Page Style*/
.bs-glyphicons li:hover {
   color: #CC0000;
}

/*Navigation
------------------------------------*/
/*Pagination*/
.pagination > .active > a,
.pagination > .active > span,
.pagination > .active > a:hover,
.pagination > .active > span:hover,
.pagination > .active > a:focus,
.pagination > .active > span:focus {
   background-color: #CC0000;
   border-color: #CC0000;
}

.pagination li a:hover {
   background: #AF1007;
   border-color: #AF1007;
}

/*Pager*/
.pager li > a:hover,
.pager li > a:focus {
   background: #AF1007;
   border-color: #AF1007;
}

/*Registration and Login Page v2
------------------------------------*/
.reg-block {
	border-top: solid 2px #CC0000;
}

/*News*/

@media (max-width: 767px) { /* Styles for screens up to 767px wide (e.g., mobile) */
	.full-news-list {
		max-width: 100%;
	}
	.news-home-img {
		max-width:100%;
	}
}
@media (min-width: 768px) { /* Styles for screens 768px wide and above (e.g., desktop) */
	.news-home {
		max-width: 65%;
	}
	.news-home-img {
		max-width:100%;
		max-height: 147.5px;
	}
}

 /* Homepage stepper for user registraton
------------------------------------*/
 .stepper {
    display: flex;
    flex-direction: column;
    counter-reset: stepper;
    gap: 8px;
    background-color: var(--c-stepper-bg);
    padding: 2px;
    padding-bottom: 15px;
    padding-top: 15px;
    border-radius: 10px;
    --c-primary: #ffb0b0;
    --c-secondary: #CC0000;
    --c-stepper-bg: #fff;
 }

 .stepper-item {
    display: grid;
    grid-template-rows: [text-row] auto [line-row] 20px;
    grid-template-columns: [counter-column] 28px [text-column] auto;
    column-gap: 16px;
    row-gap: 8px;
    position: relative;

    &.complete {
       .stepper-counter {
            background-color: var(--c-secondary);
            color: #FFF;
            position: relative;
        }
    }

    &:last-child {
        grid-template-rows: [text-row] auto;
    }
 }

 .stepper-line {
    display: block;
    width: 2px;
    background-color: #8f8f8f;
    height: 100%;
    justify-self: center;

    .stepper-item:last-child & {
        display: none;
    }
 }

 .stepper-counter {
    flex-shrink: 0;
    counter-increment: stepper;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 28px;
    height: 28px;
    background-color: var(--c-primary);
    color: #fff;
    border-radius: 50%;
    line-height: 1;
 }

 .stepper-link {
    display: flex;
    gap: 12px;
    text-decoration: none;

    span {
        padding-top: calc((28px - 1.5em) / 2);
        font-weight: 600;
        border-bottom: 2px solid transparent;
    }

    &:after {
        position: absolute;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
    }

    &:focus {
        outline-offset: 4px;
        outline-color: var(--c-primary);
        outline-width: 2px;
        border-radius: 4px;
    }
 }