.banner-text {
    margin-top: 167px;
}

.banner-text.loaded {
    transform: translateX(-19%);
    transition: .9s;
}


.extra-sec{
    display: none;
}


.banner-image .banner-dynamic-background {
    background-image: url(../images/blogs/banner-image1.png);
}


.blog_section{
    position: relative;
}

.blog-image {
    width: 470px;
    height: 470px;
    border-radius: 50%;
}

.blog-image1.loaded{
    animation: blog_image 1.6s;
}

.blog-image2.loaded{
    animation: blog_image 1.6s;
}


@keyframes blog_image {
    0%{
        transform: scale(0);
    }

    70%{
        transform: scale(1.1);
    }

    100%{
        transform: scale(1);
    }
}


.blog-row{
    padding-block: 80px;
}


.blog-image img {
    width: 100%;
    height: 100%;
    border-radius: 50%;
    object-fit: cover;
}

.blog-content{
    display: flex;
    flex-direction: column;
    padding-inline: 119px 57px;
}

.col-blogs:nth-child(2) .blog-content{
    padding-inline: 57px 119px;
}

.blog-title{
    color: var(--primary-color);
    font-size: 23px;
    font-weight: 500;
    margin-bottom: 30px;
    text-align: right;
    line-height: 43px;
}

.blog-content p{
    font-size: 15px;
    line-height: 28px;
    /* font-weight: 600; */
    color: var(--text-color);
    text-align: justify;
}

.col-blogs{
    display: flex;
    justify-content: center;
}

.blog-image{
    position: relative;
}

.blog-row:nth-child(odd) .blog-image::before{
    position: absolute;
    content: url('data:image/svg+xml,<svg width="64" height="46" viewBox="0 0 64 46" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M3.21094 3.20898C21.368 12.6309 37.3045 26.2858 49.3636 42.7912" stroke="%23443895" stroke-width="3.76" stroke-linecap="round" stroke-linejoin="round"/><path d="M49.2109 22.0869C54.3181 27.822 58.0589 34.7689 60.0744 42.1767" stroke="%23443895" stroke-width="3.76" stroke-linecap="round" stroke-linejoin="round"/></svg>');
    width: 40px;
    height: 40px;
    top: 16px;
    right: 22px;


}

.blog-row:nth-child(odd) .blog-image::after{
    position: absolute;
    content:url('data:image/svg+xml,<svg width="56" height="56" viewBox="0 0 56 56" fill="none" xmlns="http://www.w3.org/2000/svg"><g clip-path="url(%23clip0_225_33)"><path d="M4.86328 2.58984C17.9199 16.4073 34.8074 26.8634 53.3019 32.5805" stroke="%23443895" stroke-width="3.76" stroke-linecap="round" stroke-linejoin="round"/><path d="M2.69922 11.0488C11.1071 22.5795 22.9011 31.7957 36.3738 37.3475" stroke="%23443895" stroke-width="3.76" stroke-linecap="round" stroke-linejoin="round"/><path d="M6.26953 28.1445C10 36.1209 12.31 44.7034 13.0848 53.41" stroke="%23443895" stroke-width="3.76" stroke-linecap="round" stroke-linejoin="round"/></g><defs><clipPath id="clip0_225_33"><rect width="56" height="56" fill="white"/></clipPath></defs></svg>');
    width: 40px;
    height: 40px;
    bottom: 5px;
    left: 67px;

}

.blog-row:nth-child(even) .blog-image::before{
    position: absolute;
    content: url('data:image/svg+xml,<svg width="60" height="60" viewBox="0 0 60 60" fill="none" xmlns="http://www.w3.org/2000/svg"><g clip-path="url(%23clip0_356_2)"><path d="M3.29297 51.626C17.843 39.391 29.259 23.137 36.037 5.00444" stroke="%23443895" stroke-width="3.76" stroke-linecap="round" stroke-linejoin="round"/><path d="M11.6133 54.2783C23.6112 46.5519 33.4947 35.3111 39.817 22.1824" stroke="%23443895" stroke-width="3.76" stroke-linecap="round" stroke-linejoin="round"/><path d="M28.8867 51.7012C37.0657 48.4386 45.7675 46.6293 54.5043 46.3597" stroke="%23443895" stroke-width="3.76" stroke-linecap="round" stroke-linejoin="round"/></g><defs><clipPath id="clip0_356_2"><rect width="56" height="56" fill="white" transform="translate(0.425781 56.332) rotate(-86.6818)"/></clipPath></defs></svg>');
    width: 40px;
    height: 40px;
    bottom: 54px;
    right: 3px;

}

.blog-row:nth-child(even) .blog-image::after{
    position: absolute;
    content:url('data:image/svg+xml,<svg width="52" height="68" viewBox="0 0 52 68" fill="none" xmlns="http://www.w3.org/2000/svg"><g clip-path="url(%23clip0_356_8)"><path d="M3.48828 60.1162C14.5248 42.8928 29.5746 28.2663 47.1097 17.7607" stroke="%23443895" stroke-width="3.76" stroke-linecap="round" stroke-linejoin="round"/><path d="M26.4766 16.0273C32.653 11.4637 39.9118 8.37133 47.4723 7.0389" stroke="%23443895" stroke-width="3.76" stroke-linecap="round" stroke-linejoin="round"/></g><defs><clipPath id="clip0_356_8"><rect width="63.2848" height="46" fill="white" transform="translate(0 63.0215) rotate(-84.774)"/></clipPath></defs></svg>') ;
    width: 40px;
    height: 40px;
    top: -5px;
    left: 60px;

}

.blog-content a{
    background: var(--primary-color);
    color: #fff;
    font-weight: 500;
    font-family: 'VZ-Bold';
    font-size: 15px;
    width: fit-content;
    padding: 4px 24px;
    border-radius: 24px;
    align-self: flex-end;
    transition: .5s;
}

.blog-content a:hover{
    background: var(--secondary-color);
    transition: .5s;
}

.blog_image{
    width: 100%;
    height: 537px;
    margin-bottom: 30px;
    overflow: hidden;
    border-radius: 195px;
    display: block;
}

.blog_image img{
    width: 100%;
    height: 100%;
    object-fit: cover;
    /*filter: grayscale(1);*/
    transition: .4s;
    transform: scale(1);
}

.blog-info h3{
    font-size: 19px;
    color: var(--primary-color);
    margin-bottom: 20px;
    text-align: center;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 1;
    font-family: 'VZ-Bold' !important;
    font-weight: 500 !important;
}

.blog-info p{
    font-size: 14px;
    color: var(--text-color);
    text-align: center;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    line-height: 28px;
}

.each-blog-box{

    cursor:url(../images/cursor.png), auto !important;
}

.each-blog-box:hover .blog_image img{
    filter: grayscale(0);
    transition: .4s;
    transform: scale(1.1);
}

.extra-title{
    display: flex;
    align-items: center;
    justify-content: center;
    padding-bottom: 40px;
}

.extra-title h4{
    color: var(--primary-color);
    font-size: var(--site-title);
    /*font-weight: 600;*/
    font-family: 'VZ-Bold';
}

.similar-blogs{
    padding-block: 120px;
}

.blog-next, .blog-prev{
    /*display: none;*/
}

.similar_blogs{
    position: unset;
}

.swiper-similar-blogs{
    padding-inline: 45px;
    position: relative;
}

.similar_blogs .swiper-button-next, .similar_blogs .swiper-button-prev  {
    top: 41%;
}



/*responsive*/
@media screen and (max-width: 1999px) and (min-width: 1700px) {
    .extra-banner{
        bottom: -100px;
    }
}



@media screen and (max-width: 1500px){

    .blog-image {
        width: 360px;
        height: 360px;
    }

}

@media screen and (max-width: 1399px){

    .addressbar {
        padding-block: 0;
    }

    .blog-row:nth-child(odd) .blog-image::before {
        top: 14px;
        right: -2px;
    }

    .blog-row:nth-child(odd) .blog-image::after {
        bottom: -4px;
        left: 40px;
    }

    .blog-row:nth-child(even) .blog-image::after {
        top: -7px;
        left: 26px;
    }

    .blog-row:nth-child(even) .blog-image::before {
        bottom: 38px;
        right: -18px;
    }


    .blog-image {
        width: 310px;
        height: 310px;
    }


    .blog-title {
        font-size: 20px;
        line-height: 30px;
    }

    .blog-row {
        padding-block: 0 80px;
    }
}

@media screen and (max-width: 1199px){

    .banner-text {
        margin-top: 81px;
    }

    .blog-content p {
        font-size: 14px;
    }

    .blog-image {
        width: 295px;
        height: 295px;
    }

    .blog-title {
        font-size: 19px;
        line-height: 47px;
        margin-bottom: 18px;
    }

    .blog-content {
        flex-direction: column;
        padding-inline: 61px 35px;
    }

    .col-blogs:nth-child(2) .blog-content {
        padding-inline: 35px 61px;
    }

    .blog_image {
        width: 100%;
        height: 400px;
        margin-bottom: 28px;
    }

    .blog-info h3 {
        font-size: 18px;
        margin-bottom: 13px;
    }

}

@media screen and (max-width: 991px){

    .addressbar {
        padding-block: 40px;
    }


    .similar_blogs .swiper-button-next, .similar_blogs .swiper-button-prev {
        top: 50%;
    }

    .each-blog-box {
        width: 339px;
    }

    .similar_blogs .swiper-slide{
        display: flex;
        align-items: center;
        justify-content: center;
    }

    .blog-next, .blog-prev {
        display: flex;
        align-items: center;
        justify-content: center;
    }

    .each-blog-box {
        background: var(--secondary-color);
        padding: 10px 20px;
        border-radius: 200px;
        display: flex;
        align-items: center;
        flex-direction: column;
        height: 550px;
        padding-top: 33px;
    }

    .blog-info p {
        line-height: 27px;
        overflow: hidden;
        text-overflow: ellipsis;
        display: -webkit-box;
        -webkit-line-clamp: 3;
        -webkit-box-orient: vertical;
    }

    .blog_image img {
        filter: grayscale(0) !important;
    }

    .blog_image {
        width: 265px;
        height: 265px;
        margin-bottom: 28px;
    }

    .col-blogs .blog-content {
        padding-inline: 20px 20px !important;
    }

    .extra-sec {
        display: block;
        /* background: var(--secondary-color); */
        /*padding-block: 100px 173px;*/
        transform: translateY(111px);
        transform: unset !important;
    }

    .extra-sec::before{
        position: absolute;
        content: '';
        width: 100%;
        height: 400px;
        background: var(--secondary-color);
        z-index: 0;
    }

    .extra-sec .container{
        z-index: 1;
        position: relative;
        padding-block: 50px 60px;
    }


    .blog-row:nth-child(odd) {
        padding-block: 0 80px;
        flex-direction: column-reverse;
    }

    .blog-row:nth-child(even) {
        padding-block: 0 80px;
        flex-direction: column;
    }

    .blog-title {
        font-size: 18px;
        line-height: 41px;
        margin-bottom: 13px;
        text-align: center;
    }

    .blog-image {
        width: 298px;
        height: 298px;
        margin-bottom: 39px;
    }

    .blog-row:nth-child(odd) .blog-image::before {
        top: -1px;
        right: 14px;
    }

    .blog-row:nth-child(odd) .blog-image::after {
        bottom: -8px;
        left: 50px;
    }

    .blog-row:nth-child(even) .blog-image::before {
        bottom: 26px;
        right: -2px;
    }

    .blog-row:nth-child(even) .blog-image::after {
        top: 1px;
        left: 23px;
    }

    .extra-sec-content{
        text-align: center;
    }

    .extra-sec-content h4{
        color: var(--primary-color);
        font-size: calc(var(--site-title) - 5px);
        margin-bottom: 14px;
        /*font-weight: 600;*/
        font-family: 'VZ-Bold';
    }

    .extra-sec-content p{
        color: var(--primary-color);
        font-size: 15px;
        text-align: justify;
    }

    .blog-name {
        padding-left: 0;
        text-align: center;
        padding-block: 48px 38px;
    }

    .extra-title h4 {
        font-size: calc(var(--site-title) - 5px);
    }

}

@media screen and (max-width: 767px){

    .swiper-similar-blogs {
        padding-inline: 0;
    }

    /*.blog-next, .blog-prev{*/
    /*    display: none;*/
    /*}*/

    .each-blog-box {
        background: var(--secondary-color);
        padding: 10px 20px;
        border-radius: 168px;
        height: 550px;
        padding-top: 33px;
        width: 354px;
    }

    .swiper-similar-blogs .swiper-slide{
        display: flex;
        align-items: center;
        justify-content: center;
    }

    .extra-title {
        padding-bottom: 25px;
    }

    .blog-info p {
        -webkit-line-clamp: 2;
    }



}

@media screen and (max-width: 575px){

    .addressbar {
        padding-block: 28px;
    }

    .extra-sec::before {
        height: 155px;
    }

    .extra-sec .container {
        padding-block: 1px 0px;
    }


    .extra-sec-content p {
        color: var(--primary-color);
        font-size: var(--mobile-text-font);
        line-height: var(--mobile-line-height);
        text-align: justify;
        margin-bottom: 0;
    }

    .banner-text {
        margin-top: 46px;
    }

    .banner-text.loaded {
        transform: translateX(6%);
    }

    .extra-title h4 {
        font-size: var(--main-mobile-title);
        line-height: var(--mobile-line-height);
    }

    .blog-info h3 {
        font-size: var(--mobile-title-font);
        line-height: var(--mobile-line-height);
        margin-bottom: 6px;
        font-family: 'VZ-Bold';
        /*font-weight: 600;*/
    }

    .extra-title {
        padding-bottom: 22px;
    }


    .blog-title {
        font-size: var(--mobile-title-font);
        line-height: var(--mobile-line-height);
        margin-bottom: 3px;
        /*font-weight: 600;*/
        font-family: 'VZ-Bold';
    }

    .blog-content p {
        font-size: var(--mobile-text-font);
        line-height: var(--mobile-line-height);
        font-weight: 500;
        text-align: justify;
    }

    .blog-row:nth-child(odd) {
        padding-block: 0 58px;
    }

    .similar-blogs {
        padding-block: 26px 77px;
    }

    .blog-info p {
        -webkit-line-clamp: 2;
        font-size: var(--mobile-text-font);
        line-height: var(--mobile-line-height);
    }

    .each-blog-box {
        height: 465px;
    }

    .blog_image {
        width: 217px;
        height: 217px;
        margin-bottom: 23px;
    }

    .blog-name {
        padding-block: 48px 16px;
    }

    .blog_text{
        font-size: var(--mobile-text-font) !important;
        line-height: var(--mobile-line-height) !important;
    }

    .blog_text p{
        font-size: var(--mobile-text-font) !important;
        line-height: var(--mobile-line-height) !important;
    }

    .blog-content a {
        /*background: var(--secondary-color);*/
        /*color: var(--primary-color);*/
        font-size: var(--mobile-text-font);
        line-height: var(--mobile-line-height);
    }

    .blogs-links {
        gap: 8px;
    }

    .blogs-links-appended {
        padding-block: 24px;
    }

    .blog-image {
        width: 230px;
        height: 230px;
        margin-bottom: 29px;
    }

    .blog-row:nth-child(odd) .blog-image::before {
        transform: scale(0.7);
    }

    .blog-row:nth-child(odd) .blog-image::after {
        transform: scale(0.7);
    }

    .blog-row:nth-child(even) .blog-image::after{
        transform: scale(0.7);
        top: -14px;
        left: 18px;
    }

    .blog-row:nth-child(even) .blog-image::before{
        transform: scale(0.7);
        bottom: 30px;
        right: -22px;
    }

    .blog-row:nth-child(odd) .blog-image::after {
        bottom: -13px;
        left: 40px;
    }

    .blog-row:nth-child(odd) .blog-image::before {
        top: -1px;
        right: 2px;
    }

    .blog-row:nth-child(even) .blog-image::before{

    }

    .extra-sec-content h4 {
        color: var(--primary-color);
        font-size: var(--main-mobile-title);
        line-height: var(--mobile-line-height);
        margin-bottom: 4px;
        /*font-weight: 600;*/
        font-family: 'VZ-Bold';
    }

    .extra-sec {
        display: block;
        background: var(--secondary-color);
        padding-block: 36px 16px;
        transform: translateY(48px);
    }

}

@media screen and (max-width: 500px){

    .each-blog-box {
        height: 500px;
        width: 319px;
    }


    .blog-info p {
        text-overflow: ellipsis;
        display: -webkit-box;
        -webkit-line-clamp: 2;
        -webkit-box-orient: vertical;
    }

    .blog_image {
        width: 222px;
        height: 222px;
        margin-bottom: 28px;
    }

}

@media screen and (max-width: 425px){

    .banner-text {
        margin-top: 31px;
    }

    .extra-sec {
        padding-block: 23px 0px;
    }

    .extra-sec::before {
        height: 134px;
    }


    .each-blog-box {
        border-radius: 168px;
        height: 440px;
        padding-top: 33px;
        width: 261px;
    }

    .blog_image {
        width: 196px;
        height: 196px;
        margin-bottom: 20px;
    }


    .blog-info p {
        line-height: var(--mobile-line-height);
        overflow: hidden;
        text-overflow: ellipsis;
        display: -webkit-box;
        -webkit-line-clamp: 3;
        -webkit-box-orient: vertical;
    }

    .blog_image {
        width: 190px;
        height: 190px;
        margin-bottom: 15px;
    }

    .each-blog-box {
        border-radius: 168px;
        height: 396px;
        padding-top: 33px;
        width: 273px;
    }


    .blog-image {
        width: 200px;
        height: 200px;
        margin-bottom: 39px;
    }

    .blog-row:nth-child(odd) .blog-image::before {
        top: -6px;
        right: 9px;
        transform: scale(0.7);
    }

    .blog-row:nth-child(odd) .blog-image::after {
        bottom: -18px;
        left: 50px;
        transform: scale(0.7);
    }

    .blog-row:nth-child(even) .blog-image::after {
        top: -15px;
        left: 23px;
        transform: scale(0.7);
    }
    .blog-row:nth-child(even) .blog-image::before {
        bottom: 18px;
        right: -11px;
        transform: scale(.7);
    }


}

@media screen and (max-width: 375px){


    .banner-text.loaded {
        transform: translateX(23%);
    }

    .banner-text {
        margin-top: 26px;
    }

    .blog-image {
        width: 86%;
        height: 294px;
        margin-bottom: 39px;
    }

    .blog-image {
        width: 175px;
        height: 175px;
        margin-bottom: 33px;
    }

    .blog-row:nth-child(odd) .blog-image::before {
        top: -6px;
        right: -4px;
        transform: scale(0.5);
    }

    .blog-row:nth-child(even) .blog-image::after {
        top: -15px;
        left: 8px;
        transform: scale(0.5);
    }

    .blog-row:nth-child(even) .blog-image::before {
        bottom: 8px;
        right: -11px;
        transform: scale(0.5);
    }

    .blog-row:nth-child(odd) .blog-image::after {
        bottom: -10px;
        left: 14px;
        transform: scale(0.5);
    }
}

@media screen and (max-width: 320px){

    .banner-text.loaded {
        transform: translateX(6%);
    }

    .blog_image {
        width: 184px;
        height: 184px;
        margin-bottom: 10px;
    }

    .each-blog-box {
        border-radius: 168px;
        height: 401px;
        padding-top: 33px;
        width: 245px;
    }
}

/*responsive*/