/*blog css start on 19092025*/
.blog-bg-box {
    background:#edf2fa;
    width: 100%;
    border-radius: 2rem;
}

.left-blog img {
    width: 100%; margin-bottom:30px;
}


.right-blog img {
    width: 100%;
    margin-bottom: 20px;
}
.left-blog .blog-bg-box {padding: 4rem; margin-bottom:20px;}
.right-blog .blog-bg-box {padding: 2.5rem 3rem; margin-bottom:1.5rem;}
.Mbord-design-D {
    width: 100%;
    margin-bottom: 20px;
    display: flex;
}
.Mbord-design-D .md-btn {
    background: #fff;
    color: #000;
    font-size: 14px;
    padding: 6px 15px;
    border-radius: 6px;
    text-decoration: none; float:left;
}
   


    .left-blog .Mbord-date {
        width: 100%;
        margin-bottom: 20px;
        display: flex;
    }
.left-blog .Mbord-read-more {
    width: 100%;
    margin-bottom: 20px;
    display: flex;
}
    .left-blog .Mbord-read-more a {
        font-weight: bold;
        font-size: 14px;
    }

.right-blog  .Mbord-date {
    width: 100%;
    margin-bottom: 5px;
    display: flex;
}

.right-blog  .Mbord-read-more {
    width: 100%;
    margin-bottom: 0px;
    display: flex;
}

    .right-blog .Mbord-read-more a {
        font-weight: bold;
        font-size: 14px;
    }




.left-blog h2 {
    font-size: 37px;
    /* font-family: "Montserrat-ExtraBold-800"; */
    font-family: Montserrat-Medium-500;
    margin-bottom: 25px;
    margin-top: 25px;
    font-weight: 800;
    line-height: 50px;
}


.right-blog h2 {
    font-size: 18px;
    font-family: Montserrat-Medium-500;
    margin-bottom: 15px;
    font-weight: 800;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    line-clamp: 3;
    -webkit-box-orient: vertical;
    height:63px;
}




/*tab------------------------------*/

.blogGl .Mbord-date {
    width: 100%;
    margin-bottom: 5px;
    display: flex;
}

.blogGl .Mbord-read-more {
    width: 100%;
    margin-bottom: 0px;
    display: flex;
}

    .blogGl .Mbord-read-more a {
        font-weight: bold;
        font-size: 14px;
    }
.blogGl img {margin-bottom:20px;
}
/*start portfolio*/
.blogGl .portfolio {
    padding: 0px 0px 40px 0px;
}
    .blogGl .portfolio h2 {
        font-size: 15px;
        font-family: Montserrat-Medium-500;
        margin-bottom: 15px;
        font-weight: 800;
        text-align:left;
    }



    .blogGl .portfolio p {
        color: rgba(255,255,255,.6);
        margin: 20px 40px;
        letter-spacing: 1px;
        line-height: 1.5em;
    }

    /*start tabs*/
    .blogGl .portfolio input[type="radio"] {
        display: none;
    }

    .blogGl .portfolio .tabs label {
        display: inline-block;
        color: #000;
        text-transform: none;
        ;
        text-align: center;
        padding: 10px 18px;
        margin-bottom: 20px;
        cursor: pointer;
        font-size: 18px;
        background: #e1ebf0;
        margin-right: 5px;
        border-radius:8px;
    }
        .blogGl .portfolio .tabs label:hover {
        
            color: #000;
            border-radius: 8px;
        }

    .blogGl .portfolio .tabs .all {
        display: none;
        transform-origin: 10% 50%;
        padding: 13px 26px;
    }
.card-padding {
    padding: 13px 26px;
}

.blogGl .portfolio .tabs .all img {border-radius:12px;
}


.blogGl .portfolio .tabs .content {
    position: relative;
    overflow: hidden;
    min-height: fit-content;
    margin-top: 35px;
}
    .blogGl .portfolio .tabs .content h2 {
        overflow: hidden;
        text-overflow: ellipsis;
        display: -webkit-box;
        -webkit-line-clamp: 2;
        line-clamp: 2;
        -webkit-box-orient: vertical;
    }

    .blogGl .portfolio .tabs .content .content {
        margin: 0px;
        padding: 3rem;
        background: #e1ebf0;
        border-radius: 2rem;
        margin-bottom: 25px;
    }

        .blogGl .portfolio .tabs .content img {
           
            width: 100%;
        }

    .blogGl .portfolio .tabs label:not(:first-of-type) {
        margin-left: -4px;
    }

    .blogGl .portfolio input[id="all"]:checked ~ .content .all {
        display: block;
        animation: animateTabe 1s;
    }

    .blogGl .portfolio input[id="MenuboardDesign"]:checked ~ .content .MenuboardDesign {
        display: block;
        animation: animateTabe 1s;
    }

    .blogGl .portfolio input[id="POSIntegration"]:checked ~ .content .POSIntegration {
        display: block;
        animation: animateTabe 1s;
    }

    .blogGl .portfolio input[id="Templates"]:checked ~ .content .Templates {
        display: block;
        animation: animateTabe 1s;
    }

    .blogGl .portfolio input[id="QSR"]:checked ~ .content .QSR {
        display: block;
        animation: animateTabe 1s;
    }


    .blogGl .portfolio input[id="MenuWalls"]:checked ~ .content .MenuWalls {
        display: block;
        animation: animateTabe 1s;
    }



.blogGl .portfolio input[id="Offer"]:checked ~ .content .Offer {
    display: block;
    animation: animateTabe 1s;
}
 

.blogGl .portfolio input[type="radio"]:checked + label {
    background-color: transparent;
    background: #000;
    border-radius: 8px;
    cursor: default;
    color: #fff;
}

    .blogGl .portfolio .tabs .overlay {
        position: absolute;
        width: 100%;
        height: 100%;
        top: 100%;
        padding-top: 10%;
        color: #fff;
        text-transform: uppercase;
        text-align: center;
        background: rgba(0,0,0,.5);
        left: 0;
        transition: all .5s;
        transition: all .5s linear;
    }

.blogGl .portfolio .tabs .all .content:hover .overlay {
    top: 0;
}

    .blogGl .portfolio .tabs .overlay span {
        padding: 2px 8px;
        border: 1px solid #fff;
        border-radius: 3px;
        cursor: pointer;
    }

        .blogGl .portfolio .tabs .overlay span:hover {
            background: #5CC05C;
            border-color: #5CC05C;
        }


.blogGl input:checked ~ .content {margin:0px;
}

@keyframes animateTabe {
    0% {
        opacity: 0;
    }

    100% {
        opacity: 1;
    }
}

.classic-list {
    list-style-type: none;
}

.blog-details {margin-top:50px;
}

.blog-d-banner {
    background: #e1ebf0;
    padding:3rem;
    border-radius:3rem;
}
    .blog-d-banner img {width:100%; border-radius:1.5rem;
    }

    .blog-d-banner .B-detailsbox {
        padding-right: 13%;
    }

        .blog-d-banner .B-detailsbox h2 {
            font-size: 40px;
            /* font-family: "Montserrat-ExtraBold-800"; */
            font-family: Montserrat-Medium-500;
            margin-bottom: 25px;
            margin-top: 25px;
            font-weight: 800;
            line-height: 53px;
        }


    .blog-d-banner .Mbord-date {
        width: 100%;
        margin-bottom: 5px;
        display: flex;
    }

    .blog-d-banner .Mbord-read-more {
        width: 100%;
        margin-bottom: 0px;
        display: flex;
    }

        .blog-d-banner .Mbord-read-more a {
            font-weight: bold;
            font-size: 14px;
        }

.blog-details-dis img {width:80%; border-radius:1.5rem;
}
.blog-details-dis {
margin:25px 0px;}
    .blog-details-dis p {font-size:16px; margin-bottom:15px;
    }

    .blog-details-dis .bigtext {
        font-size:16px;
        margin-bottom: 50px;
    }
    .blog-details-dis h4 {
        margin-bottom: 30px;
        font-family: Montserrat-Medium-500;
        font-size: 28px;
        font-weight: bold;
    }


.blog-title-link {
    padding: 10px 0px; margin-bottom:40px;
}


    .blog-title-link .blog-link {padding:10px 20px; color:#000; border-radius:6px;
        background: #e1ebf0;
    }

.blog-details-dis ul li {
    list-style-type: disc;
    padding: 6px 0px;
    font-size: 16px;
}
.blog-details-dis ul {
    margin-bottom: 20px;
    width: 100%; margin-left:35px;
}

.card-padding img {border-radius:1.5rem;}
.right-blog img {
    border-radius:12px;
}

.blogGl-isotop li {
    border: 1px solid #ddd;
    border-radius: 25px;
    font-size: 15px !important;
}

    .blogGl-isotop li.active {
        border: 1px solid #000 !important;
        border-radius: 25px !important;
        font-size: 15px !important;
    }

 /** blog pagination date - update on 04112025 */

.blogGl-isotop .grid-item .c-box {
    background: #edf2fa !important;
   
}