.img-horses {
     max-height: 235px;
     margin-left: auto;
     margin-right: auto;
 }

 .img-center {
     display: block;
     margin-left: auto;
     margin-right: auto;
 }

 .rounded-top {
     border-top-left-radius: 10px;
     border-top-right-radius: 10px;
 }

 .feature-block-one .inner-box .lower-content h1 {
     display: block;
     font-size: 22px;
     line-height: 30px;
     font-weight: 800;
 }

 .horsenametruncate {
     overflow: hidden;
     text-overflow: ellipsis;
     white-space: nowrap;
     display: inline-block;
     max-width: 100%;
 }

 /*horse-name is still being used on short codes*/
 .horse-name-collapse {
     text-transform: uppercase;
     font-weight: 700;
     font-size: 1.25rem;
     cursor: pointer;
     letter-spacing: inherit;
     padding: 12px 7px;
 }

 /*revised on horses.blade 1/3/26*/
 .horse-name-collapse {
     text-transform: uppercase;
     font-weight: 700;
     font-size: 1.25rem;
     cursor: pointer;
     color: #60070f;
     letter-spacing: inherit;
     padding: 12px 7px;
 }

 .feature-block-one p {
     color: #828282;
     font-weight: 500;
 }

 h3 {
     font-weight: bold;
 }

 .h1,
 .h2,
 .h3,
 .h4,
 .h5,
 .h6,
 h1,
 h2,
 h3,
 h4,
 h5,
 h6 {
     line-height: 1.2;
 }

 .feature-block-one .inner-box {
     position: relative;
     display: block;
     background: #fff;
     border-radius: 10px;
     box-shadow: 0 10px 50px 0 rgba(0, 0, 0, .1);
     margin-bottom: 1rem;
     padding: 1rem;
 }

 .text-danger {
     color: #900C3F !important;
 }

 @media(max-width:768px) {
     .desktop-show {
         display: none;
     }

     .pedigree-card.hide-mobile {
         display: none;
     }
 }


 /**
Horse detail page
**/
 section.owner-info-detail {
     text-align: center;
     background-color: #f4f4f4;
     padding: 100px 60px;
 }

 svg.svg-inline--fa.fa-envelope {
     display: var(--fa-display, inline-block);
     height: 3em;
     overflow: visible;
     vertical-align: -.125em;
 }

 /*
New Horse pedigree design
*/
 .pedigree-container {
     max-width: 1600px;
     margin: 0 auto;
     padding: 20px;
 }

 section.horse-pedigree-section .horse-name {
     font-size: 16px;
 }

 .pedigree-card {
     background: rgba(255, 255, 255, 0.98);
     border-radius: 20px;
     padding: 50px 30px;
     box-shadow: 0 15px 40px rgba(0, 0, 0, 0.4);
 }

 /* Base style (keep this exactly as you wrote it) */
 .main-horse {
     background: linear-gradient(135deg, #8B4513 0%, #A0522D 100%);
     color: white;
     border-left: none;
     font-size: 22px;
     padding: 20px;
     text-align: center;
 }

 /* Responsive overrides only */
 @media (max-width: 992px) {
     .pedigree-table {
         grid-template-columns: 1fr;
         gap: 15px;
     }

     .label-col {
         font-size: 24px;
         margin-bottom: 10px;
     }

     .gen2-col,
     .gen3-col,
     .gen4-col {
         min-height: auto !important;
         gap: 10px;
     }

     .horse-name {
         font-size: 16px;
     }

     .main-horse {
         font-size: 20px;
         /* override only */
         /* optionally: padding: 15px; if you want it tighter on tablets */
     }
 }

 .divider {
     height: 3px;
     background: linear-gradient(90deg, transparent, #ededed, transparent);
     margin: 40px 0;
 }

 /* Sire Section */
 .sire-section .gen2-col {
     min-height: 200px;
 }

 .sire-section .gen3-col {
     min-height: 276px;
 }

 .sire-section .gen4-col {
     min-height: 200px;
 }

 /* Dam Section */
 .dam-section .gen2-col {
     min-height: 250px;
 }

 .dam-section .gen3-col {
     min-height: 250px;
 }

 .dam-section .gen4-col {
     min-height: 250px;
 }

 .gen4-col .horse-name:nth-child(3) {
     margin-top: 26px;
 }

 @media (max-width: 1400px) {
     .pedigree-table {
         grid-template-columns: 216px 197px 215px 1fr;
         gap: 24px;
     }

     .horse-name {
         font-size: 22px;
     }
 }

 /* Global Icon Helpers updated today */

 @media (max-width: 1200px) {
     .pedigree-table {
         grid-template-columns: 150px 180px 200px 1fr;
     }

     .horse-name {
         font-size: 14px;
         padding: 10px 12px;
     }
 }

 .label-col {
     font-size: 24px;
     margin-bottom: 10px;
 }

 .gen2-col,
 .gen3-col,
 .gen4-col {
     min-height: auto !important;
     gap: 10px;
 }

 .horse-name {
     font-size: 16px;
 }

 .main-horse {
     font-size: 20px;
 }
 }

 @media (max-width: 576px) {
     .gen4-col.left-space {
         margin-left: 58px;
     }

     .gen3-col .horse-name.left-space {
         margin-left: 25px;
     }

     .pedigree-card {
         padding: 30px 15px;
     }

     .label-col {
         font-size: 20px;
     }

     .main-horse {
         font-size: 18px;
         padding: 15px;
     }

     .gen4-col .horse-name:nth-child(3) {
         margin-top: 0;
     }
 }

 /**
        End of pidegree design
        **/
 /**
End of horse detail page
**/
 /**
Post timeline css
*/

/* --- Timeline layout: restore column alignment --- */
.cbp_tmtimeline {
    margin: 0;
    padding: 0;
    list-style: none;
    position: relative;
}

.cbp_tmtimeline:before {
    content: '';
    position: absolute;
    top: 0;
    bottom: 0;
    width: 6px;              /* was 10px; thinner looks better */
    background: #131212;
    left: 24%;
    margin-left: -3px;       /* half of width to center the line */
}

.cbp_tmtimeline > li {
    position: relative;
}

/* This is the piece that usually breaks the design if left is removed */
.cbp_tmtimeline > li .cbp_tmtime {
    display: block;
    width: 25%;
    position: absolute;
    left: 0;                 /* restore anchor */
    top: 0;
    padding-right: 24px;
    text-align: right;
}

.cbp_tmtimeline > li .cbp_tmicon svg {
    width: 34px;
    height: 34px;
    vertical-align: middle;
}

/* Your content cards */
.cbp_tmtimeline > li .cbp_tmlabel {
    margin: 0 97px 15px 31%;
    padding: 2em;
    position: relative;
    border-radius: 5px;
    background: #f8f8f8;
    border: 1px solid #ebebeb;
}

/* Bigger clock icon + less border ring */
.cbp_tmtimeline > li .cbp_tmicon {
    width: 69px;
    height: 69px;
    line-height: 69px;
    font-size: 2rem;
    position: absolute;
    left: 24%;
    top: -9px;
    margin-left: -34.5px;    /* half of 69 */
    border-radius: 50%;
    background: #150502;
    color: #fff;
    text-align: center;

    box-shadow: 0 0 0 3px #ececec; /* lighter ring (was 8px) */
}

@media (max-width: 600px) {
    .cbp_tmtimeline:before { left: 8%; }
    .cbp_tmtimeline > li .cbp_tmicon { left: 8%; margin-left: -34.5px; }
    .cbp_tmtimeline > li .cbp_tmlabel { margin: 0 16px 15px 16%; }
}

 .cbp_tmtimeline>li:nth-child(odd) .cbp_tmlabel {
     background: #fff;
     border: 1px solid #ebebeb;
 }

 .cbp_tmtimeline>li .cbp_tmlabel {
     margin: 0 97px 15px 31%;
     padding: 2em;
     position: relative;
     border-radius: 5px;
     background: #f8f8f8;
     border: 1px solid #ebebeb;
 }

 .cbp_tmtimeline>li .cbp_tmicon {
     width: 40px;
     height: 40px;
     font-family: 'ecoico';
     font-style: normal;
     font-weight: normal;
     font-variant: normal;
     text-transform: none;
     font-size: 1.4em;
     line-height: 35px;
     -webkit-font-smoothing: antialiased;
     position: absolute;
     color: #fff;
     background: #150502;
     border-radius: 50%;
     box-shadow: 0 0 0 3px #ececec;
     text-align: center;
     left: 24%;
     top: -9px;
     margin: 0 0 0 -25px;
 }

 .cbp_tmtimeline>li .cbp_tmtime span {
     display: block;
     text-align: center;
 }

 .cbp_tmtimeline>li:nth-child(odd) .cbp_tmtime span:last-child {
     font-size: 15px;
 }

 .cbp_tmtimeline>li:nth-child(odd) .cbp_tmlabel:after {
     border-right-color: #ebebeb;
 }

 .cbp_tmtimeline>li .cbp_tmlabel:after {
     right: 100%;
     border: solid transparent;
     content: " ";
     height: 0;
     width: 0;
     position: absolute;
     pointer-events: none;
     border-right-color: #ebebeb;
     border-width: 10px;
     top: 10px;
 }

 .video-container {
     position: relative;
     padding-bottom: 56.25%;
     padding-top: 35px;
     height: 0;
     overflow: hidden;
 }

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

 .text-content h1,
 .text-content h3,
 .text-content p {
     word-wrap: break-word;
 }

 @media(max-width:768px) {
     .hero-section .info {
         top: 15%;
         left: 10%;
     }

     #featured .owl-nav {
         top: -50px;
     }

     #blog .tabs {
         height: auto;
         width: 100%;
         /* border-bottom: 10px solid #c02; */
     }

     #blog .tabs a {
         line-height: 38px;
     }

     .tabgroup {
         padding: 20px 0;
     }
 }

 .img-item {
     border-radius: 8px;
 }

 .profile-pic-img {
     width: 80px;
     height: 80px;
     object-fit: cover;
 }

 #blog .tabs li {
     width: 100%;
 }

 @media screen and (max-width: 47.2em) {
     .cbp_tmtimeline>li .cbp_tmtime {
         width: 100%;
     }

     /* Generic lift, no color */
     .icon-lift {
         position: relative;
         top: -4px;
         /* nudge higher so it aligns with text */
     }

     /* Featured icon — red and lifted */
     .icon-featured {
         position: relative;
         top: -4px;
         color: #930a2c;
         /* brand override for danger red */
     }
 }

 @media(max-width:600px) {
     .cbp_tmtimeline>li .cbp_tmicon {
         left: 8%;
     }

     .cbp_tmtimeline:before {
         left: 8%;
     }

     .cbp_tmtimeline>li .cbp_tmlabel {
         margin: 0 16px 15px 16%;
     }

     .horse-detail-gallery .img-item {
         height: 300px;
     }
 }

 /**
Pedigrees styles
*/
 #pedigree {
     text-align: center;
 }

 .pedsireanddam {
     font-size: 1.5em;
     font-weight: bold;
     line-height: 2.35rem;

 }

 .pedgrand {
     font-size: 1.2em;
     padding-top: 10px;
     padding-bottom: 20px;
 }

 .pedgreatgrand {
     font-size: 1em;
 }

 .boxposts {
     background: #fff;
     box-shadow: inset 0px 0px 0px 1px rgba(0, 0, 0, 0.15), 0px 2px 3px 0px rgba(0, 0, 0, 0.1);
     text-align: center;
     height: 465px;
     width: 383px;
 }

 .well {
     min-height: 20px;
     padding: 19px;
     margin-bottom: 20px;
     background-color: #f5f5f5;
     border: 1px solid #e3e3e3;
     border-radius: 4px;
     -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, .05);
     box-shadow: inset 0 1px 1px rgba(0, 0, 0, .05);
 }

 .sirecolor {
     color: #129CEE;
     text-shadow: 0 1px 0 rgba(0, 0, 0, 0.18);
 }


 .damcolor {
     color: #800000;
 }