
*::-webkit-scrollbar {
    width: 10px;
}
*::-webkit-scrollbar-thumb {
    background-color: #b11f25;
}
.how-to-use {
    background-color: #FBF4F0;
}
.about-block {
    background: url(https://datlryerpd085.cloudfront.net/temples99/bg-pttran1.png) no-repeat 0 0;
    background-size: cover;
}
.ommbg-gradiant-block {
    background: url(https://datlryerpd085.cloudfront.net/temples99/offer-bg-omm.png) no-repeat center 0;
    background-size: 100%;
}
.ommbg-block {
    background: url(https://datlryerpd085.cloudfront.net/temples99/omm-image.png) no-repeat center 0;
    background-size: 40%;
}
.list-box {
    border-color:var(--temcol-secondary-color) !important;
}
    .list-box ul li > span, .temple-what ul li .iconSize {
        animation: spin-clockwise 8s infinite linear;
        margin-top: 2px;
    }
.serveice-block .col-lg-3:hover figure {
    animation: spin-clockwise 0.80s linear;
}
@keyframes spin-clockwise {
    0% {
        transform: rotate(0deg);
    }

    100% {
        transform: rotate(360deg);
    };
}
.Sevas-block {
    background: rgb(247,225,220);
    background: linear-gradient(180deg, rgba(247,225,220,0.80) 0%, rgba(255,255,255,0.80) 100%);
}
.owl-nav {
    display: flex;justify-content: space-between;align-items: center;gap: 20px;padding: 6px;
    background: #fff;width: 180px;margin: 0 auto;border-radius: 50rem;box-shadow: var(--bs-box-shadow) !important;margin-top: 15px;
}

.clients {
    background: #402B64 url(https://datlryerpd085.cloudfront.net/patren-bg1.png) no-repeat 0 0;
    background-size: 100%;
}
.team-bg {
    background: url(https://d2r3fkmprkayl1.cloudfront.net/LIMC/body-bg.png) center 0 no-repeat !important;
}
footer {
    background: url(https://datlryerpd085.cloudfront.net/temples99/bg-pttran1.png) no-repeat center 0;
    background-size: cover;
}
.list-event-block {
    background: url(https://d2r3fkmprkayl1.cloudfront.net/Events99/login-bar-bg.png) 0 0 / cover no-repeat;
}
.gradin-style {
    background: linear-gradient(180deg, #d9961b 0%, #b11f25 100%) !important;
}

/*========================= Marquee Start ====================*/

.Marquee {
    width: 100%;display: flex;overflow: hidden;
}

.Marquee-content {
    display: flex;animation: marquee 30s linear infinite running;
}

.Marquee-content:hover {
    -webkit-animation-play-state: paused;-moz-animation-play-state: paused;
    -o-animation-play-state: paused;-ms-animation-play-state: paused;animation-play-state: paused;
}

.Marquee-tag {
    width: 200px;display: inline-flex;-webkit-box-align: center;align-items: center;
    -webkit-box-pack: center;-moz-box-pack: center;-o-box-pack: center;-ms-flex-pack: center;
    -webkit-justify-content: center;justify-content: center;transition: all 0.5s ease;
}

.Marquee-tag:hover {
    -webkit-transform: scale(1.1);-moz-transform: scale(1.1);-o-transform: scale(1.1);
    -ms-transform: scale(1.1);transform: scale(1.1);cursor: pointer;
}

@-moz-keyframes marquee {
    0% {
        -webkit-transform: translateX(0);-moz-transform: translateX(0);-o-transform: translateX(0);
        -ms-transform: translateX(0);transform: translateX(0);
    }

    100% {
        -webkit-transform: translate(-50%);-moz-transform: translate(-50%);
        -o-transform: translate(-50%);-ms-transform: translate(-50%);transform: translate(-50%);
    }
}

@-webkit-keyframes marquee {
    0% {
        -webkit-transform: translateX(0);-moz-transform: translateX(0);-o-transform: translateX(0);
        -ms-transform: translateX(0);transform: translateX(0);
    }

    100% {
        -webkit-transform: translate(-50%);-moz-transform: translate(-50%);
        -o-transform: translate(-50%);-ms-transform: translate(-50%);transform: translate(-50%);
    }
}

@-o-keyframes marquee {
    0% {
        -webkit-transform: translateX(0);-moz-transform: translateX(0);
        -o-transform: translateX(0);-ms-transform: translateX(0);transform: translateX(0);
    }

    100% {
        -webkit-transform: translate(-50%);-moz-transform: translate(-50%);
        -o-transform: translate(-50%);-ms-transform: translate(-50%);transform: translate(-50%);
    }
}

@keyframes marquee {
    0% {
        -webkit-transform: translateX(0);-moz-transform: translateX(0);
        -o-transform: translateX(0);-ms-transform: translateX(0);transform: translateX(0);
    }

    100% {
        -webkit-transform: translate(-50%);-moz-transform: translate(-50%);
        -o-transform: translate(-50%);-ms-transform: translate(-50%);transform: translate(-50%);
    }
}


/*========================= Marquee End ====================*/
/* ===================== Responsive Medias Start ======================= */

@media (max-width: 1750px) {}

@media (max-width: 1600px) {
}


@media (max-width: 1441px) {
    .serveice-block {
        top: -140px;
    }
}

@media (max-width: 1400px) {
    .serveice-block {
        top: -60px;
    }
}

@media (max-width: 1290px) {}

@media (max-width: 1199px) {
    #sevasCarouselBlock .iconSize-big2 {
        width: 150px;height: 150px;
    }
}

@media (max-width: 991px) {
    .banner_main_image {
        position: relative !important;top: 0;
    }
    #navbarSupportedContent {
        position: absolute;border-top: 1px solid #ddd;background: var(--temcol-secondary-color) !important;
    }
    .serveice-block {
        top:auto;
    }
    .swarnagiri-block {
        background: url(https://datlryerpd085.cloudfront.net/temples99/swarnagiri-image.png) no-repeat 0 0;
        background-size: cover;
    }    
}

@media (max-width: 767px) {

}

@media (max-width: 601px) {
    .clients {
        background-size: cover;
    }
    #carouselBlock .ourCostermer {
        width: 90px;height: 90px;
    }
}

@media (max-width: 431px) {
   .serveice-block .iconSize-xxl {
        width: 90px;height: 90px;
    }
}

@media (max-width: 414px) {}

@media (max-width: 400px) {
    
}

@media (max-width: 376px) {
    
}

@media (max-width: 361px) {}

@media (max-width: 321px) {}
/* ==========================================================================
   .t99-prose — article + blog-index styling
   --------------------------------------------------------------------------
   WHY THIS EXISTS. The blog bodies are written as bare semantic HTML
   (<article>/<section>/<h2>/<p>/<ul>) with NO Bootstrap classes on any element.
   Their only styling hook is .t99-prose on the column wrapper, and that class
   was never defined in any stylesheet, in this bundle or live. Every blog page
   therefore rendered at browser defaults: Times body text, default headings,
   default blue links, no spacing rhythm.

   Design vocabulary is taken from the rest of this site, not invented:
     brand gradient  linear-gradient(180deg, #d9961b, #b11f25)   (.gradin-style)
     gold            var(--temcol-primary-color)   #FAAF26
     deep red        var(--temcol-secondary-color) #b11f25
     headings        var(--font-family-oswald), uppercase
     body            Outfit (inherited from body)
     surfaces        white, 1rem radius, soft shadow - as used across the site
     page ground     #f1f5f9

   Scoped entirely under .t99-prose; nothing here can reach another page.
   ========================================================================== */

.t99-prose {
    color: #253044;
    font-size: 1.0625rem;
    line-height: 1.75;
}

/* Article pages get a white reading surface. The index does not - its cards
   supply their own, and a white card on a white card reads as nothing. */
.t99-prose:not(.t99-prose--index) {
    background: #fff;
    border-radius: 1rem;
    box-shadow: 0 .5rem 1.5rem rgba(24, 16, 8, .08);
    padding: clamp(1.5rem, 4vw, 3.25rem);
}

/* ---------- headings ---------- */
.t99-prose h1,
.t99-prose h2,
.t99-prose h3,
.t99-prose h4 {
    font-family: var(--font-family-oswald);
    font-weight: 500;
    line-height: 1.18;
    color: #1b1208;
    text-wrap: balance;
}

.t99-prose h1 {
    font-size: clamp(1.95rem, 4.6vw, 2.85rem);
    margin: 0 0 .75rem;
    text-transform: uppercase;
    letter-spacing: .01em;
}

/* Section headings carry a short brand rule instead of a full grey divider -
   the same gold-to-red gradient the site uses for its primary buttons. */
.t99-prose h2 {
    position: relative;
    font-size: clamp(1.4rem, 2.9vw, 1.85rem);
    text-transform: uppercase;
    letter-spacing: .015em;
    margin: 2.75rem 0 1rem;
    padding-top: 1.25rem;
}
.t99-prose h2::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 3.25rem;
    height: 4px;
    border-radius: 2px;
    background: linear-gradient(180deg, #d9961b 0%, #b11f25 100%);
}
.t99-prose article > section:first-of-type > h2:first-child { margin-top: 1.75rem; }

.t99-prose h3 { font-size: 1.25rem; margin: 2rem 0 .6rem; }
.t99-prose h4 { font-size: 1.08rem; margin: 1.5rem 0 .5rem; }

/* ---------- body copy ---------- */
.t99-prose p { margin: 0 0 1.15rem; }
.t99-prose p:last-child { margin-bottom: 0; }
.t99-prose strong { font-weight: 600; color: #1b1208; }

/* Opening paragraph of the article reads as a lead. */
.t99-prose article > section:first-of-type > p:first-of-type {
    font-size: 1.15rem;
    line-height: 1.7;
    color: #3c4757;
}

/* ---------- article header ---------- */
.t99-prose article > header {
    margin-bottom: 2rem;
    padding-bottom: 1.5rem;
    border-bottom: 1px solid #ece7df;
}

/* The "Updated ... N min read" line. */
.t99-prose article > header p em {
    display: inline-block;
    font-style: normal;
    font-size: .74rem;
    font-weight: 600;
    letter-spacing: .1em;
    text-transform: uppercase;
    color: #8a5a00;
    background: #fdf4e0;
    border: 1px solid #f5e2b8;
    border-radius: 999px;
    padding: .3rem .85rem;
}

/* ---------- breadcrumb ---------- */
.t99-prose nav[aria-label="Breadcrumb"] {
    font-size: .78rem;
    letter-spacing: .06em;
    text-transform: uppercase;
    color: #736c5e;
    margin-bottom: 1rem;
}
.t99-prose nav[aria-label="Breadcrumb"] a { color: #736c5e; text-decoration: none; }
.t99-prose nav[aria-label="Breadcrumb"] a:hover { color: var(--temcol-secondary-color); }

/* ---------- links ---------- */
.t99-prose p a,
.t99-prose li a {
    color: var(--temcol-secondary-color);
    text-decoration: underline;
    text-decoration-thickness: 1px;
    text-underline-offset: 3px;
}
.t99-prose p a:hover,
.t99-prose li a:hover { color: #8c181d; }
.t99-prose a:focus-visible {
    outline: 2px solid var(--temcol-primary-color);
    outline-offset: 2px;
    border-radius: 3px;
}

/* ---------- lists ---------- */
.t99-prose ul,
.t99-prose ol { margin: 0 0 1.3rem; padding-left: 1.5rem; }
.t99-prose li { margin-bottom: .65rem; padding-left: .15rem; }
.t99-prose ul > li::marker { color: var(--temcol-primary-color); font-size: 1.15em; }
.t99-prose ol > li::marker {
    color: var(--temcol-secondary-color);
    font-family: var(--font-family-oswald);
    font-weight: 600;
}
.t99-prose li > ul,
.t99-prose li > ol { margin-top: .65rem; }

/* ---------- occasional long-form elements ---------- */
.t99-prose blockquote {
    margin: 1.75rem 0;
    padding: 1rem 1.35rem;
    border-left: 4px solid var(--temcol-primary-color);
    background: #fdfaf4;
    border-radius: 0 .5rem .5rem 0;
    color: #3c4757;
}
.t99-prose img { max-width: 100%; height: auto; border-radius: .75rem; }
.t99-prose code {
    font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
    font-size: .87em;
    background: #f6f3ed;
    border: 1px solid #e8e1d4;
    border-radius: 4px;
    padding: .12em .38em;
}
.t99-prose .table-scroll { overflow-x: auto; margin: 0 0 1.3rem; }
.t99-prose table { width: 100%; border-collapse: collapse; font-size: .93rem; }
.t99-prose th,
.t99-prose td { border: 1px solid #e8e1d4; padding: .6rem .75rem; text-align: left; vertical-align: top; }
.t99-prose th {
    background: #faf7f1;
    font-family: var(--font-family-oswald);
    font-weight: 500;
    text-transform: uppercase;
    letter-spacing: .04em;
    font-size: .82rem;
}

/* ==========================================================================
   Blog index - a card grid, not a bulleted list.
   The markup is a plain <ul> whose <li> each hold <h2><a>, a date <p>, and a
   summary <p>. CSS Grid turns that into cards without touching the HTML.
   ========================================================================== */

.t99-prose--index .t99-index-head {
    background: #fff;
    border-radius: 1rem;
    box-shadow: 0 .5rem 1.5rem rgba(24, 16, 8, .08);
    padding: clamp(1.5rem, 4vw, 2.5rem);
    margin-bottom: 1.75rem;
    border-bottom: 0;
}
.t99-prose--index .t99-index-head p:last-child {
    margin: 0;
    color: #55606f;
    font-size: 1.08rem;
}

.t99-prose .t99-postlist {
    list-style: none;
    margin: 0;
    padding: 0;
    display: grid;
    gap: 1.25rem;
    grid-template-columns: 1fr;
}
@media (min-width: 768px) {
    .t99-prose .t99-postlist { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

.t99-prose .t99-postlist > li {
    position: relative;
    display: flex;
    flex-direction: column;
    margin: 0;
    padding: 1.6rem 1.5rem 1.5rem;
    background: #fff;
    border-radius: 1rem;
    box-shadow: 0 .5rem 1.5rem rgba(24, 16, 8, .08);
    overflow: hidden;
    transition: transform .18s ease, box-shadow .18s ease;
}

/* Brand bar across the top of each card. */
.t99-prose .t99-postlist > li::before {
    content: "";
    position: absolute;
    inset: 0 0 auto 0;
    height: 4px;
    background: linear-gradient(90deg, #d9961b 0%, #b11f25 100%);
}

.t99-prose .t99-postlist > li:hover {
    transform: translateY(-3px);
    box-shadow: 0 .9rem 2rem rgba(24, 16, 8, .14);
}

.t99-prose .t99-postlist > li > h2 {
    /* MUST stay static. .t99-prose h2 sets position:relative for its gradient
       rule, and if that carried through here it would become the containing
       block for the stretched link below - the read-more and the click overlay
       would resolve against the TITLE instead of the card. */
    position: static;
    order: 2;
    margin: 0 0 .6rem;
    padding-top: 0;
    font-size: clamp(1.15rem, 2.1vw, 1.35rem);
    text-transform: none;
    letter-spacing: 0;
    line-height: 1.3;
}
.t99-prose .t99-postlist > li > h2::before { content: none; }

.t99-prose .t99-postlist > li > h2 > a {
    color: #1b1208;
    text-decoration: none;
}
.t99-prose .t99-postlist > li:hover > h2 > a { color: var(--temcol-secondary-color); }

/* The date line is the first <p>; float it above the title as an eyebrow. */
.t99-prose .t99-postlist > li > p:first-of-type {
    order: 1;
    margin: 0 0 .7rem;
}
.t99-prose .t99-postlist > li > p:first-of-type em {
    font-style: normal;
    font-size: .7rem;
    font-weight: 600;
    letter-spacing: .1em;
    text-transform: uppercase;
    color: #8a5a00;
}

.t99-prose .t99-postlist > li > p:last-child {
    order: 3;
    margin: 0;
    font-size: .97rem;
    line-height: 1.65;
    color: #55606f;
}

/* Read-more affordance, generated so the markup stays untouched.
   A real flex item on the CARD - not an absolutely-positioned pseudo on the
   link. margin-top:auto pushes it to the bottom of whatever height the card
   ends up at, so it lines up across a row of unequal-length summaries and
   needs no reserved padding to sit in. */
.t99-prose .t99-postlist > li::after {
    content: "Read the guide \2192";
    order: 4;
    margin-top: auto;
    padding-top: 1.1rem;
    font-family: var(--font-family-oswald);
    font-size: .78rem;
    font-weight: 500;
    letter-spacing: .08em;
    text-transform: uppercase;
    color: var(--temcol-secondary-color);
}
/* The whole card is the click target. */
.t99-prose .t99-postlist > li > h2 > a::before {
    content: "";
    position: absolute;
    inset: 0;
    z-index: 1;
}
.t99-prose .t99-postlist > li > h2 > a:focus-visible {
    outline: 2px solid var(--temcol-primary-color);
    outline-offset: 4px;
}

/* ---------- small screens ---------- */
@media (max-width: 575.98px) {
    .t99-prose { font-size: 1rem; line-height: 1.7; }
    .t99-prose:not(.t99-prose--index) { border-radius: .75rem; }
    .t99-prose h2 { margin-top: 2.1rem; padding-top: 1.05rem; }
    .t99-prose ul,
    .t99-prose ol { padding-left: 1.25rem; }
    .t99-prose .t99-postlist > li { padding: 1.4rem 1.25rem 1.25rem; }
}

@media (prefers-reduced-motion: reduce) {
    .t99-prose .t99-postlist > li { transition: none; }
    .t99-prose .t99-postlist > li:hover { transform: none; }
}

/* ==========================================================================
   Footer hooks — footer-block / footer-menu / copyright-block
   --------------------------------------------------------------------------
   These three classes are used by the Temples99 footer markup but were never
   defined in this bundle. The app defines them in Tickets99_Web/css/styles.css
   and Tickets99_Domain/css/styles.css ("Footer Start" section), which this
   static bundle does not load. Ported here, adapted to the Temples99 palette.

   NOT a straight copy. The app's generic rule is

       .footer-menu ul li a:hover { color: var(--bs-red) !important; }

   and --bs-red (#ed1c24) scores 1.50:1 against this footer's background — it
   would be all but invisible. The app already knows this: it ships a Temples
   override using --temcol-primary-color. That gold (#FAAF26) still only makes
   3.52:1, under the 4.5:1 AA floor for body text, so the hover below uses a
   lightened tint of the same brand gold at 4.68:1 on the measured average
   background and 6.75:1 on its darkest region.

   Background reference: the footer's background comes from the `footer {}` rule
   above (bg-pttran1.png), measured 99.8% opaque, average rgb(161,58,63).

   The other four classes in this footer — .foot-logo, .social-icon-foot,
   .attendee_icons and .logo-box — are deliberately NOT styled here. They carry
   no rules anywhere in the codebase, including the app; they are inert markup
   hooks. Layout and spacing for those elements come from Bootstrap utilities
   already on the same elements, and inventing styles for them would change the
   design rather than restore it.
   ========================================================================== */

/* Defensive, not currently load-bearing: the footer has no absolutely-positioned
   descendant today, so this changes nothing on the page as it stands. It is here
   for parity with the app, which ships the same declaration, so that if one is
   ever added it resolves against the footer instead of escaping to the viewport.
   The other rules in this block DO affect the current markup. */
.footer-block {
    position: relative;
}

/* Footer link hover / focus / current-page.
   !important is required, not stylistic: the links carry Bootstrap's .text-white,
   whose colour declaration is itself !important and would otherwise win. */
.footer-block .footer-menu ul li a:hover,
.footer-block .footer-menu ul li a:focus-visible,
.footer-block .footer-menu ul li a.active {
    color: #FDD489 !important;
}

.footer-block .footer-menu ul li a {
    transition: color .15s ease-in-out;
}

/* Keyboard focus needs to be visible against the dark red ground; the browser
   default ring is not reliably legible there. */
.footer-block .footer-menu ul li a:focus-visible,
.footer-block .social-icon-foot a:focus-visible {
    outline: 2px solid #FDD489;
    outline-offset: 3px;
    border-radius: 3px;
}

/* Lifts the copyright line toward the divider rule above it. Matches the app's
   .copyright-block p span { top: -12px }. The span already carries
   .position-relative in the markup, which this depends on. */
.copyright-block p span {
    top: -12px;
}

@media (prefers-reduced-motion: reduce) {
    .footer-block .footer-menu ul li a { transition: none; }
}

/* Footer "Popular Searches" keywords became real links in the 2026-09-10 audit.
   They carry Bootstrap .text-white/.text-decoration-none already, so only the hover
   state is needed. #FDD489 is the same lightened brand gold the footer menu uses
   above (4.68:1 on the measured footer background) - reusing it keeps the two link
   groups in the footer behaving identically. */
.footer-block .t99-poplink:hover,
.footer-block .t99-poplink:focus-visible {
    color: #FDD489 !important;
    text-decoration: underline !important;
}
