/* Global overwrites */
.preview-block .resource-list .item .item-meta {
    width: auto;
    margin: 0;
    padding: 0;
    /* Add any other properties you want to reset */
}
.column-reynard {
    display: inline-flex;
    flex-direction: column;
    width: 20%;
    box-sizing: border-box;
    padding: 10px;
    flex-wrap: nowrap;
}
.column-maristmag {
    display: inline-flex;
    flex-direction: column;
    width: 40%;
    box-sizing: border-box;
    padding: 10px;
    flex-wrap: nowrap;
}

.site-page-pagination {
    display: none;
}

body.vertical-menu header {
    background-color: #0c3d5d;
    font-family: Bookman Old Style, serif;
    font-size: 1.1rem;
}

.off-canvas-content, body.vertical-menu {
    background: #0c3d5d;
}

@media only screen and (max-width: 1023px) {
    .off-canvas-content {
        background: white !important;
    }
}

body.vertical-menu header .vertical.menu li,
body.vertical-menu header .toc-block>ul li,
body.vertical-menu header .toc-block ul ul li,
.toc-block ul body.vertical-menu header ul li {
    margin: 5px 0;
}

body.vertical-menu header .vertical.menu li a,
body.vertical-menu header .toc-block>ul li a,
body.vertical-menu header .toc-block ul ul li a,
.toc-block ul body.vertical-menu header ul li a {
    padding: 0.6rem;
}

a.nav-header:hover {
    opacity: .8;
}

h1, .h1, h2, .h2, h3, .h3, h4, .site-title h1, .h4, h5, .preview-block h4, .preview-block .site-title h1, .site-title .preview-block h1, .h5, h6, .h6, h6 {
    font-family: EB Garabmond, serif !important;
}

h6 {
    font-size: .8rem;
}

div#content, .preview-block .resource-list .item .item-thumbnail img, .img {
    font-family: EB Garabmond, serif !important;
    max-width: 100%;
}

button.button {
    background: #767676;
}

.browse div#uv-1, .media-list, .value, .description {
    display: none;
}

body.vertical-menu #content, body:not(.item) #content, body.browse #content {
    min-height: 0;
    padding: 25px !important;
}

body.item:not(.browse) #content {
    padding: 0px !important;
}

/* Custom Grid and Image Styles */
/* Initial state: 4 columns */
.preview-block .resource-list {
  display: grid;
  grid-template-columns: repeat(4, 300px);

  padding-right: 30% !important;
  overflow-x: auto; /* Enables horizontal scrolling if necessary */
}

/* Base styles for grid */
.preview-block .resource-list {
  display: grid;
  grid-template-columns: repeat(4, 300px); /* 4 columns */
}


  .preview-block .resource-list .item {
    padding: 4px;
  }
}

.preview-block .resource-list .item {
    padding-right: 93px;
}

.preview-block .resource-list .item .item-thumbnail img {
    width: 125px !important;
    height: 115px !important;
    object-fit: cover;
    margin: 0 auto !important;
}

.preview-block .resource-list .resource{
   margin-left: 65px;
   border-bottom: 0px solid #8e8e8e;
}


.item.resource {
  display: flex;
  flex-direction: column;
}

.item.resource .item-meta {
  order: 2; 
  font-weight: normal !important;
  font-size: 1rem;
  line-height: 1.5rem;
}

.item.resource .item-thumbnail {
  order: 1; /* This ensures the image appears first */
}