@import url('../constants.css');

    .category-tag-overlay {
        font-size: 14px;
        font-weight: 700;
        position: absolute;
        top: 10PX;
        left: 10px;
        
        padding: 4px 8px;
        border-radius: 4px;
        color: #fff;
        text-transform: uppercase;
    }
    .category-tag-overlay.green {
        background: var(--green);        
    }
    .category-tag-overlay.purple {
        background: var(--tertiary);        
    }
    .category-tag-overlay.orange {
        background: var(--secondary);        
    }
    
    .circle-arrow {
        position: absolute;
        bottom: -120px;
        right: 20px;
        width: 36px;
        height: 36px;
        background: transparent;
        border-radius: 50%;
        display: flex;
        align-items: center;
        justify-content: center;
        font-size: 10px;
        color: #333;
        transition: all 0.3s ease;
    }
    .sm.corner-triangle-overlay {
        border-width: 0 0 89px 64px;
    }
    .sm.circle-arrow {
        bottom: -75px;
        right: 10px;
        width: 22px;
        height: 22px;
    }
    .section.blog-door {
        padding: 100px 0 64px;
    }
    .blog-door .flex-cont {
         display: flex;
         flex-flow: row wrap;
         align-items: start;
         justify-content: space-between;
         width: 100%;
    }
     
     .blog-door .cont-blog {
         width: 100%;
         position: relative;
    }

     .blog-door .cont-blog .cont-blog-text {
         position: relative;
      
    }
     .blog-door .cont-blog .cont-blog-text h2, 
     .blog-door .cont-blog .cont-blog-text h3, 
     .blog-door .cont-blog .cont-blog-text h3, 
     .blog-door .cont-blog .cont-blog-text h4, 
     .blog-door .cont-blog .cont-blog-text h5, 
     .blog-door .cont-blog .cont-blog-text h6{
         color: var(--primary);
    }
     .blog-door .left-wrap {padding-right: 0;}
    .blog-door .right-wrap { padding-left: none; }
     .blog-door .left-wrap .cont-blog .cont-blog-text {
         width: 100%;
    }
     .blog-door .left-wrap .cont-blog .cont-blog-text .text{
         padding-top: 20px;
    }
     .blog-door .left-wrap .cont-blog .cont-blog-text h3 ,
     .blog-door .right-wrap .cont-blog .cont-blog-text .text h3{
         font-size: 32px;
         line-height: normal;
         font-weight: 700;
         text-transform: capitalize;
         
    }

    
     .blog-door .right-wrap .cont-blog:last-child {
         padding-bottom: 0!important;
         margin-bottom: 0!important;
    }
     .blog-door .right-wrap .cont-blog h4 {
         font-size: 27px;
         line-height: 27px;
    }
     .blog-door .right-wrap .cont-blog .img {
         height: auto;
    }
     .blog-door .right-wrap .cont-blog .cont-blog-text {
         display: flex;
         flex-flow: row wrap;
         width: 100%;
         align-items: center;
    }
     .blog-door .right-wrap .cont-blog .cont-blog-text .text {
         width: 100%;
    }
    
     .blog-door .cont-blog .cont-blog-text .text h3,
     .blog-door .cont-blog .cont-blog-text .text h3 a {
        color: var(--headcolor);
        margin-bottom: 12px;

        /* Heading/H3 */
        font-size: 30px;
        font-style: normal;
        font-weight: 600;
        line-height: normal; /* 33.6px */
    }
    .blog-door .cont-blog .cont-blog-text .text p{
        color: var(--headcolor);

        /* Heading/H3 */
        font-size: 18px;
        font-weight: 400;
        line-height: 150%; /* 33.6px */
    }
    .blog-door .cont-blog .cont-blog-text .text h4,
     .blog-door .cont-blog .cont-blog-text .text h4 a {
        color: var(--headcolor);
        margin-bottom: 16px;

        /* Heading/H4 */
        font-size: 24px;
        font-weight: 600;
        line-height: 140%; /* 31.2px */
    }
     .blog-door .right-wrap .cont-blog .cont-blog-text .btn-wrap {
         width: 40%;
    }
    .case-col a h4{
        color: var(--primary);

        /* Heading/H3 */
        font-size: 28px;
        font-weight: 700;
        line-height: 120%; /* 33.6px */
    }

    
    /* ======== Section Blog End ============= */
     @media screen and (max-width: 767px) {
         .blog-door  .blog-door .right-wrap .cont-blog .cont-blog-text {
             display: block;
             flex-flow: unset;
        }
         .blog-door .left-wrap {
             padding-right: 0;
        }
        .case-col {
            padding-bottom: 40px;
        }
        .blog-door .left-wrap ,.blog-door .right-wrap ,
         .blog-door .left-wrap .cont-blog .cont-blog-text, 
         .blog-door .right-wrap .cont-blog .cont-blog-text .text, 
         .blog-door .right-wrap .cont-blog .cont-blog-text .btn-wrap {
             width: 100%;
        }
     
       
         .blog-door .right-wrap .cont-blog {
             margin-bottom: 0;
        }
         .blog-door .right-wrap .cont-blog .cont-blog-text .text p {
             margin-bottom: 15px;
        }
         .section.blog-door {
             padding: 50px 0;
        }
    }