/* Styling for tselepidis-posts shortcode */

#postsLoop {
  display: grid;
  grid-template-columns: auto auto auto;
  gap: 50px;
}

#postsLoop .singlePost {
  max-width: 400px;
}

#postsLoop .postImage {
    max-width:250px;
    margin-bottom:5px;
}

#postsLoop .postHeadlineTitle {
    font-weight: 400;
    margin: 0.5rem 0 0.3rem 0;
}

#postsLoop .postButton{
    background-color: var( --e-global-color-181613c );
    color: #FFFFFF;
    border-color: #E8E8E8;
    transition-duration: 0.1s;
    border-style: none;
    border-radius: 50px 50px 50px 50px;
}

#postsLoop .dateSpan{
    font-size: 0.8em;
}

/* Mobile responsive */

@media only screen and (max-width: 767px){
    #postsLoop {
      display: grid;
      grid-template-columns: auto;
      gap: 50px;
    }
    
    #postsLoop .singlePost {
        text-align:center;
        max-width:100%;
    }
    
    #postsLoop .postImage {
        display:block;
        margin: 0 auto;
    }
    
    #postsLoop .postParagraph {
        padding: 0px 5rem 0px 5rem;
    }
}

@media only screen and (min-width: 768px) and (max-width:1024px){
    #postsLoop {
      display: grid;
      grid-template-columns: auto auto;
      gap: 50px;
    }
}