.blog-container {
    width: clamp(1px, 56.3023vw, 2162px);
}

.blog-img {
    width: 100%;
    height: clamp(1px, 18.438vw, 708px);
    background-color: #D9D9D9;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: clamp(1px, 1.1vw, 40px);
}

.blog-img img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: clamp(1px, 1.1vw, 40px);
}

.blog-img.no-image {
    background-color: #D9D9D9;
    border-radius: clamp(1px, 1.1vw, 40px);
}

.blog-content:hover .read-icon {
    width: clamp(1px, 9.505vw, 364px);
    height: clamp(1px, 2.709vw, 104px);
    background: #FF922E;
    border-radius: 26px;
    display: flex;
    justify-content: center;
    align-items: center;

}

.read-icon img {
    display: none;
    width: auto;
    height: clamp(1px, 0.573vw, 22px);
}

.blog-content:hover a img {
    display: block !important;

}

.blog-content:hover a label,
.blog-content:hover a {
    color: white !important;
    text-decoration: none !important;
}

.blog-content:hover .blog-meta {
    color: #FF922E !important;
}

.blog-sidebar {
    width: clamp(1px, 22.657vw, 870px);
}

.search-form {
    position: relative;
    width: clamp(1px, 22.657vw, 870px);
    height: clamp(1px, 3.073vw, 118px);
    border: 1px solid #242424;
    border-radius: clamp(1px, 0.5vw, 20px);
}

.form-control {
    padding: 0 clamp(.5rem, 1.3vw, 3rem);
    border: none !important;
    border-radius: clamp(1px, 0.5vw, 20px) !important;
    transition: none !important;
}

.form-control:focus {
    background-color: transparent !important;
    border-color: transparent !important;
    box-shadow: none !important;
}

.search-form input[type="search"]::-webkit-search-cancel-button {
    display: none;
}

.search-icon img {
    width: clamp(1px, 1.3021vw, 50px);
    position: absolute;
    right: clamp(.5rem, 1.3vw, 3rem);
    top: 50%;
    transform: translateY(-50%);

}

.blog-sidebar-recent {
    width: 100%;
    height: fit-content;
    background: #F8F8F8;
    border-radius: clamp(1px, 1.1vw, 40px);
}


.blog-recent-img {
    width: clamp(1px, 7.344vw, 242px);
    min-width: clamp(1px, 7.344vw, 242px);
    height: clamp(1px, 6.771vw, 260px);
    background-color: #D9D9D9;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 5px;
}

.blog-recent-img img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 5px;
}

.blog-recent-img.no-image {
    background-color: #D9D9D9;
    border-radius: 5px;
}

.ajax-pagination button {
    border: none !important;
    background-color: transparent !important;
}

.page-btn {
    width: clamp(1px, 1.9799vw, 76px);
    height: clamp(1px, 1.9799vw, 76px);
    border-radius: 50px;
}

.page-btn.active {
    background-color: #FF922E !important;
    color: #FFFFFF;
}

.page-nav img {
    width: clamp(1px, 1.3021vw, 50px);
    height: auto;
}

.prev-arrow {
    transform: rotate(180deg);
}

/* Single Page */
.blog-single-img-container {
    height: clamp(1px, 29.8444vw, 1146px);
    margin-top: clamp(1px, 7.29165vw, 280px);
}

.blog-single-img {
    position: relative;
    z-index: 1;
    width: clamp(1px, 78.907vw, 3030px);
    height: clamp(1px, 34.271vw, 1316px);
    background-color: #D9D9D9;
    border-radius: clamp(1px, 1.1vw, 40px);
}

.blog-single-container {
    position: relative;
    z-index: 2;
    width: clamp(1px, 51.7188vw, 1986px);
    padding-left: clamp(1px, 3.125vw, 120px);
}

.blog-single-img img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: clamp(1px, 1.1vw, 40px);
}

.blog-single-img.no-image {
    background-color: #D9D9D9;
    border-radius: clamp(1px, 1.1vw, 40px);
}

.blog-single-content {
    padding: clamp(1px, 1.302081vw, 50px);
    width: clamp(1px, 51.7188vw, 1986px);
    height: fit-content;
    background: #FFFFFF;
    box-shadow: 0px 0px 40px rgba(29, 58, 83, 0.1);
    border-radius: clamp(1px, 0.9vw, 32px);
}

.author-icon {
    width: clamp(1px, 2.084vw, 80px);
    height: clamp(1px, 2.084vw, 80px);
    object-fit: cover;
}

.blog-description {
    width: clamp(1px, 51.7188vw, 1986px);
}

.blog-description p {
    margin-bottom: clamp(1px, 1.302081vw, 50px);
}

.blog-description p strong {
    font-family: Poppins Bold;
    font-size: clamp(1px, 1.10573vw, 44px) !important;
}

.blog-description blockquote {
    padding: clamp(1px, 1.302081vw, 50px);
    width: clamp(1px, 51.7188vw, 1986px);
    height: clamp(1px, 7.201vw, 276px);
    background: #FF922E;
    border-radius: 8px;
    text-align: center;
    color: #FFFFFF;
    font-family: Poppins Medium;
}

.blog-description blockquote p {
    margin-bottom: clamp(1px, 0.833331vw, 32px) !important;
}

.author-container {
    padding: clamp(1px, 1.302081vw, 50px);
    width: clamp(1px, 51.7188vw, 1986px);
    border: 1px solid #DFDFE3;
    border-radius: 8px;

}

.blog-feedback {
    padding: clamp(1px, 0.833331vw, 32px);
    width: clamp(1px, 51.7188vw, 1986px);
    height: fit-content;
    background: #F5F5F6;
    border-radius: 8px;
}

.feedback-btn {
    border: 1px solid #7F8490;
    background-color: transparent;
    padding: clamp(1px, 0.3125vw, 12px) clamp(1px, 0.625vw, 24px);
}

.feedback-btn.yes {
    border-top-left-radius: 5px;
    border-bottom-left-radius: 5px;
}

.feedback-btn.no {
    border-top-right-radius: 5px;
    border-bottom-right-radius: 5px;
}

.feedback-btn img {
    width: clamp(1px, 0.782vw, 30px);
    height: auto;
}

.blog-sidebar-related {
    width: clamp(1px, 22.657vw, 870px);
    height: fit-content;
    background: #F8F8F8;
    border-radius: clamp(1px, 1.1vw, 40px);
    margin-top: clamp(1px, 6.77081vw, 260px) !important;
}

@media (max-width:767px) {

    .blog-container,
    .blog-sidebar {
        width: 100%;
    }

    .blog-img {
        width: 100%;
        height: clamp(1px, 50.891vw, 708px);
        border-radius: clamp(1px, 4vw, 28px) !important;
    }

    .blog-content:hover .read-icon {
        width: 100%;
        height: clamp(1px, 11.451vw, 104px);
    }

    .read-icon img {
        height: clamp(1px, 2.545vw, 22px);
    }

    .search-form {
        width: 100% !important;
        height: clamp(1px, 12.214vw, 118px);
        border-radius: clamp(1px, 2.5vw, 20px);
    }

    .form-control {
        padding: 0 clamp(.5rem, 4.07124vw, 3rem);
        border-radius: clamp(1px, 2.5vw, 20px) !important;
    }

    .search-icon img {
        width: clamp(1px, 4.581vw, 50px);
        right: clamp(.5rem, 4.07124vw, 3rem);
    }

    .blog-sidebar-recent {
        border-radius: clamp(1px, 4vw, 32px);
    }

    .blog-recent-img {
        width: clamp(1px, 20.36vw, 160px);
        min-width: clamp(1px, 20.36vw, 160px);
        height: clamp(1px, 20.36vw, 160px);
    }

    .page-btn {
        width: clamp(1px, 9.67vw, 76px);
        height: clamp(1px, 9.67vw, 76px);
    }

    .page-nav img {
        width: clamp(1px, 4.581vw, 50px);
    }

    /* Single page */
    .blog-single-img {
        width: 100%;
        height: clamp(1px, 55.98vw, 1316px);
        border-radius: clamp(1px, 2.9vw, 24px) !important;
    }

    .blog-single-img-container {
        height: clamp(1px, 48.856vw, 1146px);
    }

    .blog-single-container {
        width: 100%;
        padding-left: 0 !important;
    }

    .blog-single-content {
        padding: clamp(1px, 6.36132vw, 50px);
        width: 100%;
        border-radius: clamp(1px, 2.9vw, 24px) !important;
    }

    .blog-single-content .fs-36 {
        font-size: clamp(1px, 5.59796vw, 72px) !important;
    }

    .author-icon {
        width: clamp(1px, 9.161vw, 80px);
        height: clamp(1px, 9.161vw, 80px);
    }

    .blog-description {
        width: 100%;
    }

    .blog-description blockquote {
        padding: clamp(1px, 4.58014vw, 50px);
        width: 100%;
        height: clamp(1px, 42vw, 335px);
    }

    .blog-description p {
        margin-bottom: clamp(1px, 4.07124vw, 50px);
    }

    .blog-description p strong {
        font-size: clamp(1px, 3.30788vw, 44px) !important;
    }

    .blog-description blockquote p {
        margin-bottom: clamp(1px, 3.56234vw, 32px) !important;
    }

    .author-container {
        width: 100%;
    }

    .blog-feedback {
        padding: clamp(1px, 4.58014vw, 50px);
        width: 100%;
    }

    .feedback-btn img {
        width: clamp(1px, 2.545vw, 30px);
        height: auto;
    }

    .feedback-btn {
        padding: clamp(1px, 0.76336vw, 12px) clamp(1px, 2.035623vw, 24px);
    }

    .blog-sidebar-related {
        width: 100%;
        border-radius: clamp(1px, 2.9vw, 24px) !important;
    }

}