.row [class^=col-], .row [class*=" col-"] {
    width: 100%;
}

.grid-listing-group {
    margin-bottom: 5rem;
}

.grid-listing {
    display: flex;
    flex-wrap: wrap;
    margin: -0.5rem;
}

.grid-listing .gl-item {
    padding: 0.5rem;
    position: relative;
    display: flex;
    align-items: center;
}

.grid-listing .gl-item:before {
    content: "";
    border: 0.1rem solid #ccc;
    border-radius: 0.3rem;
    -moz-border-radius: 0.3rem;
    -webkit-border-radius: 0.3rem;
    width: -webkit-calc(100% - 1rem);
    width: -moz-calc(100% - 1rem);
    width: calc(100% - 1rem);
    height: -webkit-calc(100% - 1rem);
    height: -moz-calc(100% - 1rem);
    height: calc(100% - 1rem);
    position: absolute;
    left: 0.5rem;
    top: 0.5rem;
    z-index: 0;
    transition: background 0.5s ease;
    -moz-transition: background 0.5s ease;
    -webkit-transition: background 0.5s ease;
}

.grid-listing .gl-item:hover:before {
    background: #eee;
}

.grid-listing .gl-item:hover a {
    color: #333;
}

.grid-listing[data-col="3"] .gl-item,
.grid-listing[data-col="4"] .gl-item,
.grid-listing[data-col="6"] .gl-item {
    width: 50%;
}

.grid-listing .gl-item-wrap {
    display: block;
    padding: 1.25rem 1.75rem;
    width: 100%;
    z-index: 1;
    border-radius: 0.4rem;
    -moz-border-radius: 0.4rem;
    -webkit-border-radius: 0.4rem;
    margin: 0.1rem;
    background: transparent;
}

@media (min-width: 768px) {
    .row {
        display: flex;
        flex-wrap: wrap;
        margin-left: -1.5rem;
        margin-right: -1.5rem;
    }

    .row [class^=col-], .row [class*=" col-"] {
        padding-left: 1.5rem;
        padding-right: 1.5rem;
        position: relative;
    }

    .grid-listing[data-col="3"] .gl-item {
        width: 33.3333%;
    }

    .grid-listing[data-col="4"] .gl-item, .grid-listing[data-col="6"] .gl-item {
        width: 25%;
    }
}

@media (min-width: 768px) {
    .row .col-sm-1 {
        width: 8.3333%;
    }

    .row .col-sm-2 {
        width: 16.6666%;
    }

    .row .col-sm-3 {
        width: 25%;
    }

    .row .col-sm-4 {
        width: 33.3333%;
    }

    .row .col-sm-5 {
        width: 41.6665%;
    }

    .row .col-sm-6 {
        width: 50%;
    }

    .row .col-sm-7 {
        width: 58.3333%;
    }

    .row .col-sm-8 {
        width: 66.6666%;
    }

    .row .col-sm-9 {
        width: 75%;
    }

    .row .col-sm-10 {
        width: 83.3334%;
    }

    .row .col-sm-11 {
        width: 91.6667%;
    }

    .row .col-sm-12 {
        width: 100%;
    }
}

@media (min-width: 992px) {
    .row .col-md-1 {
        width: 8.3333%;
    }

    .row .col-md-2 {
        width: 16.6666%;
    }

    .row .col-md-3 {
        width: 25%;
    }

    .row .col-md-4 {
        width: 33.3333%;
    }

    .row .col-md-5 {
        width: 41.6665%;
    }

    .row .col-md-6 {
        width: 50%;
    }

    .row .col-md-7 {
        width: 58.3333%;
    }

    .row .col-md-8 {
        width: 66.6666%;
    }

    .row .col-md-9 {
        width: 75%;
    }

    .row .col-md-10 {
        width: 83.3334%;
    }

    .row .col-md-11 {
        width: 91.6667%;
    }

    .row .col-md-12 {
        width: 100%;
    }

    .grid-listing[data-col="6"] .gl-item {
        width: 16.6666%;
    }
}

.row.no-gutter {
    margin: 0;
}

.row.no-gutter [class^=col-], .row.no-gutter [class*=" col-"] {
    padding: 0;
}

/* Profiles in Los Angeles Grid Listing */
.pila-grid-listing {
    display: flex;
    flex-wrap: wrap;
    padding: 0 0 6.25rem 0;
    margin: -1.25rem;
    border-bottom: 1px solid var(--tertiary-border-color);
    position: relative;
}

.pila-grid-listing .grid-listing-item {
    padding: 1.25rem;
}

.pila-grid-listing[data-col="2"] .grid-listing-item,
.pila-grid-listing[data-col="3"] .grid-listing-item,
.pila-grid-listing[data-col="4"] .grid-listing-item {
    width: 100%;
}

.pila-grid-listing[data-col="5"] .grid-listing-item {
    width: 50%;
}

.pila-grid-listing[data-col="9"] .grid-listing-item {
    width: 25%;
}

.pila-grid-listing .grid-listing-item .grid-listing-item-link {
    width: 100%;
    padding: 2rem 1.5rem;
    font-weight: 600;
    cursor: pointer;
    display: block;
    border: 1px solid var(--primary-border-color);
    color: var(--neutral-black);
    transition: color, border, .2s ease-in-out;
}

.pila-grid-listing .grid-listing-item .grid-listing-item-link:hover {
    border: 1px solid var(--secondary-border-color);
    color: var(--yellow-green);
}

.pila-grid-listing .grid-listing-item .grid-listing-item-link.pl-0 {
    padding-left: 0;
}

.pila-grid-listing .grid-listing-item .grid-listing-item-link.pl-0.border-0 {
    border: 1px solid transparent;
}

@media screen and (min-width: 576px) {
    /* Grid listing */
    .pila-grid-listing[data-col="2"] .grid-listing-item,
    .pila-grid-listing[data-col="3"] .grid-listing-item,
    .pila-grid-listing[data-col="4"] .grid-listing-item {
        width: 50%;
    }

    .pila-grid-listing[data-col="5"] .grid-listing-item {
        width: 33.33%;
    }

    .pila-grid-listing[data-col="9"] .grid-listing-item {
        width: 20%;
    }
}

@media screen and (min-width: 768px) {
    /* Grid listing */
    .pila-grid-listing[data-col="2"] .grid-listing-item,
    .pila-grid-listing[data-col="3"] .grid-listing-item,
    .pila-grid-listing[data-col="4"] .grid-listing-item {
        width: 33.33%;
    }

    .pila-grid-listing[data-col="5"] .grid-listing-item {
        width: 25%;
    }

    .pila-grid-listing[data-col="9"] .grid-listing-item {
        width: 14.28%;
    }
}

@media screen and (min-width: 992px) {
    /* Grid listing */
    .pila-grid-listing[data-col="2"] .grid-listing-item,
    .pila-grid-listing[data-col="3"] .grid-listing-item,
    .pila-grid-listing[data-col="4"] .grid-listing-item {
        width: 25%;
    }

    .pila-grid-listing[data-col="5"] .grid-listing-item {
        width: 20%;
    }

    .pila-grid-listing[data-col="9"] .grid-listing-item {
        width: 11.11%;
    }
}