/* Our Works */
    .ip-portfolio-counter-inner-wrapper { padding: 100px 0;}
    /* Number Count */
        .our-score-board {padding: 40px 0;background: #18235f;box-shadow: rgba(0, 0, 0, 0.24) 0px 3px 8px;}
        .run-letter-div div span{color: #1176E0;font-size: 60px;font-weight: 500;text-align: center;}
        .plus {color: #1176E0;display: flex;justify-content: center;align-items: center;font-weight: 600;font-size: 60px;}
        .scoreboard-wrap{display: flex;justify-content: center;align-items: center;flex-wrap: wrap;gap: 20px;  padding: 20px 0 0;}
        .run-letter-div span {font-size: 28px;color: #060606;}
        .run-letter-div{width: 100%;max-width: 235px;text-align: center;position: relative;}
        .run-letter-div:last-child::before {display: none;}
        .run-letter-div::before { content: ''; position: absolute; top: 0px; right: 0px; width: 2px; bottom: 0; margin: auto; height: 85%; background: linear-gradient(0deg, #1176e000 0%, #1176e096 25%, #1176e0 50%, #1176e096 75%, #1176e000 100%);}
    /* Number Count */

    .ip-our-works-wrapper {background: #1E1E1E; padding: 100px 0;}
    .our-works {  display: flex; justify-content: space-between; align-items: center; padding: 20px 40px; border-radius: 20px; position: relative;  overflow: hidden;}
    .our-works::before {content: ''; position: absolute; background: #0C62B7D6; width: 100%; height: 100%; top: 0; left: 0;} 
    .our-works h2, .our-works p {color: #fff; position: relative;}
    .our-works h2 {font-size: 48px;}

    .our-works-display {display: flex;justify-content: space-between;align-items: flex-start;gap: 40px;  padding: 60px 0 0;}
    .our-works-display ul {position: sticky; top: 112px;width: 100%; max-width: 210px;}
    .our-works-display-main { width: 100%; max-width: 1000px;}
    .our-works-display-images { display: flex; justify-content: center; align-items: center; gap: 40px; flex-wrap: wrap;}
    .work-display { width: 100%; max-width: 450px;  border-bottom: 2px solid #39b9ff;}
    .work-display span {display: flex; justify-content: center; align-items: center;}
    .work-display span, .work-display span img { width: 100%; max-width: 450px; object-fit: cover; border-radius: 10px;  position: relative;}
    .work-display p {color: #fff; text-align: center;}
    .our-works-display ul li:last-child {margin: 0;}
    .our-works-display ul li a {color:  #fff; display: flex; justify-content: flex-start; align-items: center; gap: 25px;  margin: 40px 0;  font-size: 18px;}
    .our-works-display ul li a img {width: 100%; max-width: 40px; filter: brightness(0) saturate(100%) invert(100%) sepia(0%) saturate(7495%) hue-rotate(148deg) brightness(104%) contrast(102%);}
    .our-works-display ul li.active a {color: #39b9ff; font-weight: 600;}
    .our-works-display ul li.active a img {filter: invert(66%) sepia(31%) saturate(4147%) hue-rotate(174deg) brightness(102%) contrast(100%);}
    .our-works-display-images {display: none;}
    .our-works-display-images.active {display: flex;}
/* Our Works */

@media (max-width: 1280px){
    .work-display { max-width: 400px;}
}

@media (max-width: 1200px){
    .work-display { max-width: 330px;}
}

@media (max-width: 992px){
    .our-works-display {flex-direction: column;}
    .our-works-display ul { position: relative; top: 0; width: 100%; max-width: 100%; display: flex; justify-content: center; align-items: center; gap: 30px;}
}

@media (max-width: 920px){
    .our-works-display ul { display: -webkit-inline-box; overflow-x: scroll;}
    .our-works-display ul li a {margin: 0;}
    .our-works-display ul li a img { max-width: 35px;}
}

@media (max-width: 776px){
    .our-works h2 {font-size: 38px;}
}

@media (max-width: 576px){
    .our-works {flex-direction: column;}
    .our-works h2, .our-works p {text-align: center;}
}