@font-face {
    font-family: "Open Sans";
    src: url('../fonts/OpenSans-Regular.ttf');
    font-weight: 400;
    font-style: normal;
    font-display: swap
}
@font-face {
    font-family: "Open Sans";
    src: url('../fonts/OpenSans-Medium.ttf');
    font-weight: 500;
    font-style: normal;
    font-display: swap
}
@font-face {
    font-family: "Open Sans";
    src: url('../fonts/OpenSans-SemiBold.ttf');
    font-weight: 600;
    font-style: normal;
    font-display: swap
}
@font-face {
    font-family: "Open Sans";
    src: url('../fonts/OpenSans-Bold.ttf');
    font-weight: 700;
    font-style: normal;
    font-display: swap
}
@font-face {
    font-family: "Open Sans";
    src: url('../fonts/OpenSans-ExtraBold.ttf');
    font-weight: 800;
    font-style: normal;
    font-display: swap
}
@font-face {
    font-family: "Noto Serif";
    src: url('../fonts/NotoSerif-Regular.ttf');
    font-weight: 400;
    font-style: normal;
    font-display: swap
}
@font-face {
    font-family: "Noto Serif";
    src: url('../fonts/NotoSerif-Italic.ttf');
    font-weight: 400;
    font-style: italic;
    font-display: swap
}
@font-face {
    font-family: "Noto Serif";
    src: url('../fonts/NotoSerif-Bold.ttf');
    font-weight: 700;
    font-style: normal;
    font-display: swap
}
@font-face {
    font-family: "Raleway";
    src: url('../fonts/Raleway-Regular.ttf');
    font-weight: 400;
    font-style: normal;
    font-display: swap
}
@font-face {
    font-family: "Raleway";
    src: url('../fonts/Raleway-Medium.ttf');
    font-weight: 500;
    font-style: normal;
    font-display: swap
}
@font-face {
    font-family: "Raleway";
    src: url('../fonts/Raleway-SemiBold.ttf');
    font-weight: 600;
    font-style: normal;
    font-display: swap
}
@font-face {
    font-family: "Raleway";
    src: url('../fonts/Raleway-Bold.ttf');
    font-weight: 700;
    font-style: normal;
    font-display: swap
}
@font-face {
    font-family: "Raleway";
    src: url('../fonts/Raleway-ExtraBold.ttf');
    font-weight: 800;
    font-style: normal;
    font-display: swap
}
@font-face {
    font-family: "Raleway";
    src: url('../fonts/Raleway-Black.ttf');
    font-weight: 900;
    font-style: normal;
    font-display: swap
}
.blog-post .new-container{  
    max-width: 1160px;
    margin: 0 auto;
}
.blog-post p,
.blog-post h1,
.blog-post h2,
.blog-post h3{
    margin-bottom:0;

}
.blog-post{
    font-family: "Raleway";
    color: #000000;
    margin-bottom:48px;
    margin-top:32px;
}

.blog-post .blog-banner{
    min-height: 500px;
    background-position: right!important;
    background-repeat: no-repeat!important;
    background-size:cover!important; 
    padding-left: 48px;
}
.blog-post .blog-banner-content{   
    max-width: 532px;   
    width: 100%;
    min-height: 500px;
    margin: 0;   
    display: flex;
    align-items: center;
    color:white;
}
.blog-post .blog-banner-title{
    font-family: 'Noto Serif';
    font-style: normal;
    font-weight: 700;
    font-size: 48px;
    line-height: 65px; 
    color: #FFFFFF;
    margin-bottom:32px;

}
.blog-post .blog-banner-content .banner-text{
    display:none;
}
.blog-post .blog-banner-logo{
    display:flex;
    align-items: center;
    font-family: 'Open Sans';
    font-style: normal;
    font-weight: 400;
    font-size: 16px;
    line-height: 22px;   
    color: rgba(255, 255, 255, 0.72);
}
.blog-post .banner-name{
    margin-left:16px;
    font-weight: 700;
}
.blog-post .banner-updated-text:before{
    content:"/";
    margin: 0 5px;
}
.blog-post .blog-block{
    margin-bottom:32px
}

.blog-post #blog_row {
    flex-wrap: unset;
}
.blog-post .blog-right {
    padding: 0 0 0 24px ;
}
.blog-post #blog_left {
    padding:8px 24px;
    max-width: 272px;
    background: #FFFFFF;
    border: 1px solid #CCCCCC;
    border-radius: 2px;
    z-index: 16;
}
.blog-post .blog-info p{
    font-style: normal;
    font-weight: 500;
    font-size: 18px;
    line-height: 170%;
}
.blog-post .blog-info img{
    width:100%;
    height: auto;
    margin: 32px 0;
    object-fit: contain;
}
.blog-post .blog-info h5{
    font-weight: 700;
    font-size: 17px;
    line-height: 32px;
    margin-bottom:16px;

}
.blog-post .blog-info h4{
    font-weight: 700;
    font-size: 24px;
    line-height: 28px;
    margin-bottom:16px;

}
.blog-post .blog-info h3{
    font-weight: 700;
    font-size: 32px;
    line-height: 44px;
    margin-bottom:32px;
}
.blog-post .blog-info ul li{
    list-style-type: disc;
}
.blog-post .blog-info ul,
.blog-post .blog-info ol{
    margin:8px 0;
    margin-left:25px;
    font-style: normal;
    font-weight: 500;
    font-size: 18px;
    line-height: 220%;
}
.blog-post .blog-info ol{
    margin:16px;
}

.blog-post .blog-info ul li::marker{
    font-size: 10px;
    color: #000000;
}
.blog-post .blog-info ol li::marker {
    font-size: 18px;
    font-family: 'Raleway';
    color: #000000;
}
.blog-post .blog-left .list-item.active::before{
    content: "";
    background: #50709C;
    border-radius: 10px;
    margin-right: 8px;
    min-width: 2px;
    height: 43px;
    display:block;
}
.blog-post .blog-left .list-item{
    padding:16px 0;    
    border-bottom:1px solid #E1E1E2;
    display:flex;
    align-items: center;
}
.blog-post .blog-left .list-item:last-child{
    border-bottom:none;
}
.blog-post .blog-left .list-item a{
    font-style: normal;
    font-weight: 500;
    font-size: 16px;
    line-height: 19px;
    color: #17181A;

}
.blog-post .blog-left .list-item:hover a{
    font-weight: 600;
    color: #000000;
}
.blog-post .blog-left .list-item.active a{
    font-weight: 600;
    color: #000000;
}
.blog-post .blue-block {
    width: 100%;
    min-height: 144px;
    padding: 28px 72px;
    display: flex;
    align-items: center;;
    justify-content: space-between;
    background: #64BD81;
    border: 0.496381px solid rgba(242, 242, 242, 0.17);
    border-radius: 4px;   
    margin:32px 0;
    
}
.blog-post .blue-block .blue-text {
    width: 320px;
}
.blog-post .blue-block .blue-text * {
    color: #000000;;
}
.blog-post .blue-block .fs-16 {
    font-family: 'Inter';
    font-style: normal;
    font-weight: 400;
    font-size: 16px;
    line-height: 24px;
}
.blog-post .blue-block .fs-24 {
    margin-bottom:8px;
    text-align: left;
    font-family: 'Inter';
    font-style: normal;
    font-weight: 500;
    font-size: 24px;
    line-height: 32px;
}
.blog-post .mid-btn-small a{
    width: 148px!important;
}

.blog-post .mid-btn a{
    width: 272px;
    height: 48px;
    background: #FF7C00;
    box-shadow: 0px 2px 8px rgba(0, 0, 0, 0.2);
    border-radius: 2px;    
    font-family: 'Inter';
    font-weight: 500;
    font-size: 16px;
    line-height: 24px;
    color: #ffffff;    
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all .3s;
}

.blog-post .mid-btn a:hover {
    cursor: pointer;
    background: #e97000;
    box-shadow: 0px 4px 6px 0px #00000033 inset;
    color: #ffffff !important;
    font-size: 15px;
    text-decoration: none;
}
.blog-post .blog-block a{
    color: #2A64F6;
    text-decoration: underline;
}
.blog-post .blog-block a:hover{
    color: #2A64F6!important;
    text-decoration: underline!important;
}
.blog-post .blog-left .close-filter,
.blog-post .blog-left .open-filter{
    display:none;
    position: absolute;
    top:5px;
    right: 0;
    padding:0 16px;
    color: #D9D9D9;
    cursor:pointer;
    font-size: 23px;
}
.blog-post .blog-left .close-filter{
    top:25px;
}
.blog-post .blog-secure-img{
    width: 32px;
    height: 32px;
}
 .blog-post .category-item{
   width: 100%;
    border-radius: 2px;
    padding: 32px 41px 32px 32px;
    margin:0 0 35px 0;
}
.blog-post .category-item .category-item-img img{
    width: 192px;
    height: 176px;

}
.blog-post .category-item .category-item-text {
    width: 196px;
}
.blog-post .category-item .category-item-band-btn{
    margin:8px 0;
}
.blog-post .category-item .category-item-band-images,
.blog-post .category-item .category-item-band,
.blog-post .category-item .category-item-band-calls{
    width:120px;
}
.blog-post .category-item .category-item-band-images img{
    width: 24px;
    margin:3px;
}
.blog-post .category-item .category-item-price-btn{
    color:white!important;
}
.blog-post .category-item .category-item-price-btn:hover{
    color:white!important;
}
.blog-post .category-item .category-item-band-images{
    margin-bottom:0;
}
.blog-post .category-item-band{
    padding: 0;
}
.blog-post .category-item .category-item-img{
    margin-bottom:0
}
.blog-post .category-item a {
    text-decoration: none;
}
.blog-post .category-item a:hover {
    text-decoration: none!important;
}
.blog-post .stars-content .stars-block {   
    align-items: baseline;
}
 
@media only screen and (max-width: 1250px){
    .blog-post .new-container {
        max-width: 1024px;
    }  
    .blog-post #blog_left{
        max-width: 216px;
    }
    .blog-post .shop_page_filter>li>h2 i{
        left: 85%;
    }
   
}
@media only screen and (max-width: 1180px){
    .blog-post .new-container {
        max-width: 1000px;
    }   
}
@media only screen and (max-width: 1024px){
    .blog-post .new-container {
        max-width: 928px;
    }
    .blog-post{
        margin-bottom:32px;
        margin-top:24px;
    }
    
    .blog-post .blog-banner{
        padding-left: 32px;
    }
    .blog-post .blog-banner-content .banner-text{
        display:block;
        font-family: 'Open Sans';
        font-style: normal;
        font-weight: 400;
        font-size: 14px;
        line-height: 20px;       
        color: #FFFFFF;
        margin-bottom:16px;
    }
    .blog-post .blog-banner-content{
        min-height: 400px;      
        max-width: 434px;       
    }
    .blog-post .blog-banner {
        min-height: 400px;
    }
    .blog-post .blog-banner-title {
        font-size: 40px;
        line-height: 54px;
        margin-bottom:16px;
    }
    .blog-post .blog-right {
        padding: 0 0 0 16.25px;
    }

    .blog-post .blog-info p{
        font-size:16px;
    }
    .blog-post .blog-info ul,
    .blog-post .blog-info ol{
        font-size:16px;
    }
    .blog-post .blog-info h4{
        font-size: 18px;
        line-height: 21px;
    }
    .blog-post .blog-info h3{
        font-size: 24px;
    } 
    .blog-post #blog_left{
        max-width: 220px;
        padding:8px 19.4px;
    }  
    .blog-post .blog-left .list-item a {      
        font-size: 14px;  
    }  
    .blog-post .blog-left .list-item.active::before{
        min-width: 1.62px;
    }
    .blog-post .category-item .category-item-title a{      
        font-size: 16px;
        line-height: 22px;
    }
    .blog-post .category-item .category-item-img img{
        width: 150px;
        height: 150px;
    }
    .blog-post .category-item .category-item-text {
        width: 174px;
    }
    .blog-post .category-item .category-item-band-images,
    .blog-post .category-item .category-item-band,
    .blog-post .category-item .category-item-band-calls{
        width: 104px;
    }
    .blog-post .category-item .category-item-band-images img {
        width: 20px;
    }
    .blog-post .category-item .category-content {
        flex-direction: unset;
    }
    .blog-post .category-item {
        height: unset;
        padding:32px 19px;
        margin:20px 0;
    }
    .blog-post .show-mobile {
        display: none;
    }
    .blog-post .hidden-mobile {
        display: flex!important;
    }
    
    .blog-post .category-item-title,
    .blog-post .category-item-band{
        border-bottom:none;
    }
    .blog-post .stars-content .stars-container{
        width: 101px;
    }
    .blog-post .category-item .category-item-band-calls {
        margin:0;
    }
    .blog-post .category-item .category-item-price-save,
    .blog-post .category-item-band-btn-block,
    .blog-post .category-item-band-calls{
        justify-content: center;
    }
    .blog-post .category-item-price-img{
        display:none;
    }
    .blog-post .category-item-band{
        height: unset;
    }   
    .blog-post .category-item .category-item-band-btn {
        width:80px;
        justify-content: center;
        align-items: center;
    }
    .blog-post .blog-info h5{
        font-size:16px;
    }

    
}

@media only screen and (max-width: 991px){
    .blog-post #blog_row{
        height: auto!important;   
        flex-wrap:wrap;     
    }
    .blog-post #blog_left{
        position: relative; 
        top:0;  
        height: auto!important;     
        max-width: 100%;       
        width: 100%;       
        padding: 15px 16px 15px 34px;    
        background: #FFFFFF;
        border: 1px solid #CCCCCC;
        border-radius: 2px; 
        margin-bottom:24px;
    }
    .blog-post .blog-right {
        padding: 0;       
    } 
    .blog-post .blog-left .list-item.active::before{       
        height: 22.7px;
    }
  
    .blog-post #blog_left .list-item{
        display:none;              
    }

    .blog-post #blog_left .list-item.active{
        display:flex; 
        margin-bottom:0;
        border-bottom:none;
        padding:0;
        padding-right: 17px;
    } 
     
    .blog-post #blog_left.scroll-filter .list-item.active{            
        padding: 16px 0;
        padding-right: 17px;

        border-bottom: 1px solid #E1E1E2;
    }          
    
    .blog-post .blog-left .open-filter{
        display:block;
    } 
  
    .blog-post #blog_left.scroll-filter .blog-left{
        max-height: 343px!important;
    }
    .blog-post #blog_left.scroll-filter .blog-left{
        max-height: 270px!important;
        overflow-y: scroll;
        direction:rtl;  
        padding-left:15px;   
    }
    .blog-post #blog_left.scroll-filter .list-item{
        direction: ltr;
        padding-right: 17px;


    }
    .blog-post #blog_left ::-webkit-scrollbar {
        width: 6px;
        background: transparent;          
       
    }
    .blog-post #blog_left ::-webkit-scrollbar-thumb {   
        width: 5px;
        background-color: #D2DFF0; 
        border-radius: 10px;
        height: 50px;
    }
    .blog-post #blog_left.scroll-filter{
        padding-left:10px;
    }
    .blog-post #blog_left .list-item a{
        display: -webkit-box;
        -webkit-line-clamp: 1;
        -webkit-box-orient: vertical;
        overflow: hidden;
        width: 85%;
    }
    .blog-post #blog_left.scroll-filter .list-item a{
        display:block;
    }
    
     
   
    
   

}
@media only screen and (max-width: 980px){
    .blog-post .new-container {
        max-width: 880px;
    }
    .blog-post .blog-banner {       
        background-position: left;
    }
    .middleman .blue-block{
        flex-wrap: wrap;
        align-items: center;
        text-align: center;
        padding: 22px

    }
    .middleman .blue-block .blue-text{
        margin: auto;
        margin-bottom:20px;
    }
    .middleman .blue-block .mid-btn{
        margin: auto!important;        
    } 
}
@media only screen and (max-width: 900px){
    .blog-post .new-container {
        max-width: 760px;
    }
}
@media only screen and (max-width: 768px){   
    .blog-post .new-container {
        max-width: 650px;
    }
    .blog-post .blog-banner{        
        background: linear-gradient(179.87deg, #299160 0.05%, #31A06D 29.45%, #31A26E 39.92%, #2E9D67 52.52%, #2B9765 59.01%, #26955F 61.25%, #208E5E 71.05%, #218E5C 82.2%, #1B8B5A 87.71%, #1A8A59 95.79%, #118955 99.82%), linear-gradient(179.87deg, #299160 0.05%, #31A06D 29.45%, #31A26E 39.92%, #2E9D67 52.52%, #2B9765 59.01%, #26955F 61.25%, #208E5E 71.05%, #218E5C 82.2%, #1B8B5A 87.71%, #1A8A59 95.79%, #118955 99.82%)!important; 
        padding: 48px 32px;
        min-height: unset;

    }
    .blog-post .blog-banner-content {     
        max-width: 100%;       
        min-height: unset;
    }
    .blog-post .blue-block .mid-btn{
        margin: auto!important;        
    }  
    .blog-post .blue-block .fs-24{
        text-align: center;
    }
    .blog-post .blue-block{
        flex-wrap: wrap;
        align-items: center;
        text-align: center;
        padding: 32px 25px

    }
    .blog-post .blue-block .blue-text{
        margin: auto;
        margin-bottom:24px;
    }
    .blog-post .blue-block .mid-btn{
        margin: auto!important;        
    }  
    .blog-post .show-mobile {
        display: block;
    }
    .blog-post .hidden-mobile {
        display: none!important;
    }
    .blog-post .category-item{
        padding:24px;
    }
    .blog-post .category-item .category-content {
        flex-direction: column;
    }
    .blog-post .category-item .category-item-text {
        width: 100%;
    }
    .blog-post .category-item-price-img {
        display: block;
        width: 32px!important;
    }
    .blog-post .category-item .category-item-img img {
        width: 176px;
        height: 176px;
    }
    .blog-post .category-item .category-item-title a {      
        width: 218px;
    }
    .blog-post  .category-item .category-item-price-amount {     
        font-size: 16px;
        line-height: 19px;
    }
    .blog-post .category-item .category-item-img {   
        margin-bottom: 16px;
    }
   
    .blog-post .category-item-coverage-block {
        border-top: 1px solid #d9d9d9;
        padding: 16px 0 12px 0;
        text-align: center;
    }
    .blog-post .mobile-item-band{
        display:flex;
        justify-content: center;
        align-items: center;
        margin-bottom: 16px;
    }
    .blog-post .category-item-band {
        width: 100%!important;
    }
    .blog-post .category-item .category-item-band-images {      
        margin: auto;
        width: 100%;
        border-top: 1px solid #d9d9d9;
        border-bottom: 1px solid #d9d9d9;
        padding: 16px 0;
    }
    .blog-post .category-item .category-item-band-images img {
        width: 24px;
        margin:4px;
    }
    .blog-post .category-item-price,
    .blog-post .category-item .category-item-price-btn{
        width: 100%;
    }
    /* .blog-post .category-item-customer .category-sale-customer{
        left:35%
    }
    .blog-post .category-item-sale .category-sale-badge {
        left:40%;
    } */
    
      

}
@media only screen and (max-width: 700px){
    .blog-post .new-container {
        max-width: 550px;
    }
}
@media only screen and (max-width: 600px){
    .blog-post .new-container {
        max-width: 480px;
    }
    /* .blog-post .category-item-customer .category-sale-customer {
        left:29%
    }
    .blog-post .category-item-sale .category-sale-badge {
        left:36%;
    } */
}

@media only screen and (max-width: 550px){
    .blog-post .new-container {
        max-width: 400px;
    }
    /* .blog-post .category-item-customer .category-sale-customer{
        left:27%
    } */
}
@media only screen and (max-width: 500px){
    .blog-post .new-container {
        max-width: unset;
        padding:0 16px;
    }
    .blog-post{
        margin-bottom:24px;
        margin-top:16px;
    }
    
    .blog-post .blog-banner-title{
        margin-bottom:8px;
        font-weight: 700;
        font-size: 32px;
    }
    .blog-post .blog-banner-content .banner-text{
        font-size: 12px;
        margin-bottom:8px;
    }
    .blog-post .category-item-sale .category-sale-badge,
    .blog-post .category-item-sale .category-sale-customer{
        font-size: 14px;
       
    }
    .blog-post .category-item-sale.category-item-customer .category-sale-badge {
        left: 201px;
    }
}


@media (max-width: 410px) {   
    .blog-post  .category-item-sale.category-item-customer .category-sale-badge {
        left: 157px;
        padding: 6px 10px;
        min-width: 92px;

    }
    .blog-post  .category-item-sale.category-item-customer .category-sale-customer{
        left: 10px;       
        padding: 6px 10px;
    }
    
}