.flex-display {
    display: flex;
}

.taxonomy-dropdown {
    width: 100%;
}

 .expert-posts{
    display: grid;
 }
 .custom-taxonomy-listitems {
    display: grid;
    grid-template-columns: 1fr 1fr;
}
@media(min-width:768px) {



    .expert-posts .post-item:nth-child(1) {
        grid-area: 1 / 1 / span 2 / -1;
    }

    .expert-posts .post-item:nth-child(1) {
        grid-column: 4 / span 6;
        margin-right: calc(var(--border-offset) * -1);
        margin-left: calc(var(--border-offset) * -1);
        border-right: 1px solid rgb(255, 255, 255);
        border-left: 1px solid rgb(255, 255, 255);
        padding-right: var(--border-offset);
        padding-left: var(--border-offset);
    }

    .expert-posts .post-item:nth-child(2) {

        position: relative;
        grid-area: 1 / 1 / auto / span 3;

    }

    .expert-posts .post-item:nth-child(3) {

        grid-column: 1 / span 3;
    }

    .expert-posts .post-item:nth-child(4) {

        position: relative;
        grid-area: 1 / 10 / auto / span 3;
    }

    .expert-posts .post-item:nth-child(5) {

        grid-column: 10 / span 3;

    }

    .expert-posts {

        --grid-gap: 1rem;
        --grid-margin: 1.5rem;
        display: grid;
        grid-template-columns: repeat(4, 1fr);
        column-gap: var(--grid-gap);
        row-gap: var(--grid-gap);
        margin: 0px auto;
        width: 100%;
        max-width: 1600px;
        padding-right: calc(1 * var(--grid-margin));
        padding-left: calc(1 * var(--grid-margin));
        padding-top: 2rem;

    }

    .expert-posts {
        grid-template-columns: repeat(12, 1fr);
    }

    .expert-posts .aspect-image:before {
        content: "";
        display: block;
        padding-top: min(56.25%, var(--aspect-ratio-box-max-height, 200vh));
        width: 100%;
    }

    .expert-posts  .aspect-image {
        position: relative;
    }

    .expert-posts .post-item .image-overlay {
        inset: 0px;
        overflow: hidden;
        position: absolute;
    }

    .expert-posts .post-item:nth-child(1) .aspect-image:before {
        content: "";
        display: block;
        padding-top: min(100%, var(--aspect-ratio-box-max-height, 200vh));
        width: 100%;
    }

}

.post-list a {
    display: inline-block;


}

.post-list .image-overlay a {
    display: block;
    width: 100%;

}

.post-taxonomies .category-button {
    display: none;
}

.post-taxonomies .category-button:first-child {
    display: inline-block;
}

/* Grid options */


selector p {
    margin-top: 10px  !important;
}
selector .expert-posts {
    padding: 0  !important;
}
selector img {
    height: 100%  !important;
}

.list-grid-layout {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr 1fr;

  }

@media(min-width:1024px) {
    .list-post {
        display: grid  ;
        row-gap: 0px  ;
        column-gap: var(--wp--custom--layout--grid-column-gap)  ;
    }
    .list-post{
        grid-template-columns: 835fr 316fr  ;
        grid-template-areas: "feature spot1" "feature spot2" "feature spot3" "feature spot4"  ;
        column-gap: 15px  ;
    }


    .list-post .post-item:nth-child(1) {
        display: grid  ;
        grid-template-areas: "stack"  ;
        grid-template-columns: auto    ;
        column-gap: 20px  ;
    }
    .list-post .post-item:nth-child(2) {
        grid-area: spot1  ;
    }
    .list-post .post-item:nth-child(3) {
        grid-area: spot2  ;
    }
    .list-post .post-item:nth-child(4) {
        grid-area: spot3  ;
    }
    .list-post .post-item {
        display: grid  ;
        grid-template-columns: 120px minmax(0,1fr)  ;
        column-gap: 20px  ;
    }
    .list-post .post-item:nth-child(5) {
        grid-area: spot4  ;
    }
 

    .list-post .post-item:nth-child(1) {
        padding-bottom: 2rem  ;
        grid-area: feature  ;
    }

    .list-post .post-item:nth-child(1) .aspect-image:before {
        content: ""  ;
        display: block  ;
        padding-top: min(59.25%, var(--aspect-ratio-box-max-height, 200vh))  ;
        width: 100%  ;
    }

    .list-post .post-item:nth-child(1) .aspect-image {
        position: relative  ;
    }

    .list-post .post-item:nth-child(1) .image-overlay {
        inset: 0px  ;
        overflow: hidden  ;
        position: absolute  ;
    }
    
    .list-post .post-item:nth-child(1) .post-content {
        background: #fff  ;
        margin: 0 auto  ;
        text-align: center  ;
        width: 583px  ;
        display: flex  ;
        align-items: center  ;
        justify-content: center  ;
        background: #fff  ;
        transform: translateY(-66px)  ;
        padding: 21px  ;
        gap: 17px  ;
        flex-direction: column;
    }
    .list-post .post-item:nth-child(1) {
        grid-template-columns: auto    ;
        column-gap: 20px  ;
    }

}
@media only screen and (max-width: 1023px) {
    
    .list-post .post-item:nth-child(1) {
        display: grid  ;
        grid-template-areas: "stack"  ;
        grid-template-columns: auto    ;
        column-gap: 20px  ;
    }
    .list-post {
        display: grid;
        row-gap: 16px;
        column-gap: var(--wp--custom--layout--grid-column-gap);
    }
    .list-post .post-item {
        display: grid;
        grid-template-columns: 120px minmax(0,1fr);
        column-gap: 20px;
    }
    

    .list-post .post-item:nth-child(1) .post-content {
        background: #fff  ;
        margin: 0 auto  ;
        text-align: center  ;
        width: 583px  ;
        display: flex  ;
        align-items: center  ;
        justify-content: center  ;
        background: #fff  ;
        transform: translateY(-66px)  ;
        padding: 21px  ;
        gap: 17px  ;
        flex-direction: column;
    }
    .list-post .post-item {
        align-items: center;
    }
    .list-grid-layout {
        display: grid;
        grid-template-columns: 1fr 1fr;
    
      }

}

@media only screen and (max-width: 767px) {
    .list-grid-layout {
        display: grid;
        grid-template-columns: 1fr;
     
      }
      .custom-taxonomy-listitems {
        display: grid;
        grid-template-columns: 1fr;
    }
}
  