.logo-grid {	
    display: grid;
    grid-auto-flow: column;
    grid-auto-columns: minmax(0, 1fr);
    width: 100%;
    align-items: stretch;
	padding-bottom:10px;
}

/* Each logo link */
.logo-grid a {
	background:#fff;
    display: flex;
    align-items: center;
    justify-content: center;
    min-width: 0;
    padding: 0 clamp(30px, 1vw, 60px);
	border:none;
    border-right: 1px solid #ddd;
    text-decoration: none;
    box-sizing: border-box;
}

/* Remove border from last logo */
.logo-grid a:last-child {
    border-right: none;
}

/* Logo images */
.logo-grid img {
    display: block;
    width: 100%;
    height: 60px;
    object-fit: contain;
}

/* Resolution higher than 840px only */
@media (min-width: 840px) {
	.logo-grid a {
		transition: opacity 0.2s ease;
	}

	.logo-grid a:hover {
		opacity: 0.6;
	}
}

/* Smaller Resolutions */
@media (max-width: 1600px) {

	.logo-grid a {
		padding: 0 clamp(20px, 1vw, 60px);
	}
}

/* Tablet and mobile */
@media (max-width: 840px) {
    .logo-grid {
        grid-auto-flow: row;
        grid-auto-columns: auto;
        grid-template-columns: repeat(4, minmax(0, 1fr));
        row-gap: 20px;
		margin:10px 0;
		padding:0;
    }

    .logo-grid a {
        padding: 6px clamp(5px, 1.5vw, 12px);		
		/*border-bottom: 1px solid #ddd;*/
    }

    /* No border after every 4th logo */
    .logo-grid a:nth-child(4n) {
        border-right: none;
    }

    .logo-grid img {
        height: 40px;		
    }
}

/* Small mobile */
@media (max-width: 480px) {
    .logo-grid {
        row-gap: 5px;
    }

    .logo-grid img {
        height: 30px;
    }
}