body{
    -moz-font-feature-settings: "ss01";
    -webkit-font-feature-settings: "ss01";
    font-feature-settings: "ss01";
}

.header_title{
    font-family: rokh;
    font-size: 28px;
    font-weight: 800;
    color: var(--title_color);
    margin-top: 40px;
    /* margin-bottom: 30px; */

}


.header_description{
    font-family: vazirmatn;
    font-size: 18px;
    font-weight: 600;
    color: var(--subtitle_color);
}












.content_container{
    display: flex;
    flex-flow: row wrap;
    margin-top: 20px;
    
}


.content_container.col-6 .post_container{
  width: calc((100% - 150px) / 6);
}

.content_container.col-5 .post_container{
  width: calc((100% - 120px) / 5);
}

.content_container.col-4 .post_container{
  width: calc((100% - 90px) / 4);
}

.content_container.col-3 .post_container{
  width: calc((100% - 60px) / 3);
}




.content_container.col-6 > a.post_container:nth-child(6n){
    margin-left: 0;
}

.content_container.col-5 > a.post_container:nth-child(5n){
    margin-left: 0;
}

.content_container.col-4 > a.post_container:nth-child(4n){
    margin-left: 0;
}

.content_container.col-3 > a.post_container:nth-child(3n){
    margin-left: 0;
}



.content_container > a.post_container{
    display: flex;
    flex-flow: column;
    /* gap: 10px; */
    color: var(--text-color);
    /* margin: 8px; */
    text-decoration: none;

    margin-left: 30px;
    margin-bottom: 20px;
}




.content_container > a.post_container img{
    width: 100%;
    height: auto;
    aspect-ratio: 1 / 1;
    border-radius: 10px;
    overflow: hidden;
}

.post_title{
    font-family: vazirmatn;
    font-size: 16px !important;
    line-height: 20px;
    font-weight: 800;
    color: var(--text_color);
    padding: 0 !important;
    margin-top: 13px !important;
    height: 40px;
    overflow: hidden;
}

.keyhan_post_no_image{
    width: 100%;
    height: auto;
    aspect-ratio: 1 / 1;
    background-color: gray;
    border-radius: 10px;
    overflow: hidden;
    background-image: url(../images/no_tumb_image.webp);
    background-size: cover;
    background-position: center;
    filter: brightness(0.9);
}









    /* ------------ start page counter ------------ */
        .page_counter_container{
            max-width: 100%;
            /* height: 44px; */
            /* overflow: hidden; */
            margin: auto;
            margin-top: 70px;
            margin-bottom: 70px;

            display: flex;
            flex-flow: row wrap;
            justify-content: center;
            
        }

        .page_counter_container a{
            text-decoration: none;
            color: unset;
        }


        .page_counter_container .current{
            opacity: 0.5;
        }

        

        .page_next{
            width: 101px;
            height: 35px;
            border-radius: 5px;
            border: 1px solid var(--theme_base_color);
            cursor: pointer;
            
            font-family: vazirmatn;
            font-size: 15px;
            font-weight: bold;
            line-height: 23px;
            color: var(--theme_base_color);

            display: flex;
            flex-flow: row nowrap;
            justify-content: center;
            align-items: center;

            margin-left: 2px;
            margin-right: 2px;
        }

        /* .page_counter{
            max-width: 500px;
            height: 44px;
            margin: 0 4px;
            overflow: hidden;
            display: flex;
            flex-flow: row wrap;
            justify-content: center;
        } */

        .counter{
            width: 35px;
            height: 35px;
            border-radius: 5px;
            /* margin: 1px 4px; */
            margin-left: 2px;
            margin-right: 2px;
            border: 1px solid var(--theme_base_color);
            cursor: pointer;

            font-family: vazirmatn;
            font-size: 15px;
            font-weight: bold;
            line-height: 23px;
            color: var(--theme_base_color);

            display: flex;
            flex-flow: row nowrap;
            justify-content: center;
            align-items: center;
        }

        .page_prev{
            width: 101px;
            height: 35px;
            border-radius: 5px;
            border: 1px solid var(--theme_base_color);
            cursor: pointer;

            font-family: vazirmatn;
            font-size: 15px;
            font-weight: bold;
            line-height: 23px;
            color: var(--theme_base_color);

            display: flex;
            flex-flow: row nowrap;
            justify-content: center;
            align-items: center;

            margin-left: 2px;
            margin-right: 2px;
        }

        .page_counter_container .dots{
            line-height: 30px;
            font-size: 30px;
            color: var(--theme_base_color);
            font-weight: 400;
            font-family: vazirmatn;


            margin-left: 5px;
            margin-right: 5px;
        }


    /* ------------ end page counter ------------ */




@media screen and (max-width: 1024px){

    .content_container.col-6 .post_container,.content_container.col-5 .post_container,.content_container.col-4 .post_container,.content_container.col-3 .post_container{
        width: calc((100% - 60px) / 3) !important;
    }

    .content_container a.post_container{
        margin-left: 30px !important;
    }

    .content_container a.post_container:nth-child(3n){
        margin-left: 0px !important;
    }
  
}


@media screen and (max-width: 767px){

    .content_container.col-6 .post_container,.content_container.col-5 .post_container,.content_container.col-4 .post_container,.content_container.col-3 .post_container{
        width: calc((100% - 30px) / 2) !important;
    }

    .content_container a.post_container{
        margin-left: 30px !important;
    }

    .content_container a.post_container:nth-child(2n){
        margin-left: 0px !important;
    }
  
}