:root {
    --pc-gold: rgba(99, 86, 56, 1);
    --pc-yellow: #b4975a
}

.grid p {
    margin: 0 0 0.25em;
}

@media (max-width: 1100px) {
    .grid-of-links .grid {
        display:block
    }

    .grid-of-links .grid .grid-item {
        min-height: 325px;
    }

    .grid-of-links .grid-item p a {
        min-height: 325px
    }

    .grid-of-links .grid-item p a {
        -ms-flex-align: center;
        align-items: center;
        -ms-flex-pack: center;
        justify-content: center
    }
}

@media (min-width: 1100px) {
    .grid-of-links .grid-item.center p a {
        -ms-flex-align:center;
        align-items: center
    }

    .grid-of-links .grid-item.bottom p a {
        -ms-flex-pack: end;
        justify-content: flex-end
    }

    .grid-of-links .grid-item.right p a {
        -ms-flex-align: end;
        align-items: flex-end
    }
}

.grid-of-links.grid-items-1 {
    grid-template-columns: 1fr
}

.grid-of-links.grid-items-2 {
    grid-template-columns: 1fr 1fr
}

.grid-of-links.grid-items-4 .grid-item:nth-child(1),.grid-of-links.grid-items-4 .grid-item:nth-child(3) {
    background-position: center center;
    grid-row: span 2
}

.grid-of-links.grid-items-5 .grid-item:nth-child(1) {
    background-position: center center;
    grid-row: span 2
}

.grid-of-links.grid-items-7 .grid-item:nth-child(3),.grid-of-links.grid-items-7 .grid-item:nth-child(4) {
    background-position: center center;
    grid-row: span 2
}

.grid-of-links .grid {
    grid-template-columns: 1fr 1fr 1fr;
    grid-template-rows: 325px;
    margin-bottom: 20px;
}

.grid-of-links .grid .grid-item {
    background-size: cover;
    background-position: center top;
    height: 325px;
    width: 100%;
    position: relative;
    overflow: hidden
}

.grid-of-links .grid .grid-item > * {
    display: block;
    flex-wrap: wrap;
    height: 100%;
    width: 100%;
}

.grid-of-links .grid .grid-item > * > a {
    display: inline-grid;
    flex-wrap: wrap;
    height: 100%;
    padding: 15px;
    width: 100%;
}

.block-editor-block-list__block.wp-block.wp-block-acf-pc-custom-grid {
    background: #ccc;
    padding: 20px;
    position: relative;
}

.block-editor-block-list__block.wp-block.wp-block-acf-pc-custom-grid.is-selected {
    border: 3px dashed #111;
}

.block-editor-block-list__block.wp-block.wp-block-acf-pc-custom-grid.is-selected:before {
    content: 'Please fill out the fields to the right.';
    display: block;
    margin-bottom: 20px;
    text-align: center;
}

.grid-of-links .grid-item p,
.grid-of-links .grid-item.has-content p,
#primary .grid-of-links .grid-item.has-content p{
    height: auto;
    font-family: 'GT America Bold', sans-serif !important;
    font-size: 1.4em;
    margin: 0 0 0.25em;
    width: auto
}

.grid-of-links .grid-item p {
    color: inherit;
}

.grid-of-links .grid-item.black-link-text p {
    color: black
}

.grid-of-links .grid-item:not(.black-link-text) a {
    color: white
}

.grid-of-links .grid-item p a {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
    flex-direction: column;
    height: 100%;
    width: 100%;
    text-decoration: none
}

.grid-of-links .grid-item.grid-item.has-content p a {
    display: block;
    padding: 0 1em
}

.grid-of-links .grid-item.has-image p a {
    background-color: rgba(1,1,1,0.25);
    color: white
}

.grid-of-links .grid-item p a:hover {
    background: rgba(1,1,1,0.67);
    color: white;
    height: 100%;
    width: 100%
}

.grid-of-links .grid-item ul a {
    color: white
}

.grid-of-links .grid-item.black-link-text a {
    color: black
}
