.grid,
.grid-1-1,
.grid-1-2,
.grid-1-3,
.grid-2-1,
.grid-3,
.grid-4,
.grid-5 {
    display: grid;
    gap: 2rem;
}
.flex {
    display: flex;
}
.flex.direction-column {
    flex-direction: column;
}
.justify-content-center {
    justify-content: center;
}
.no-gap,
.grid.no-gap,
.flex.no-gap {
    gap: 0;
}
.align-center {
    align-items: center;
}
.self-center {
    align-self: center;
    justify-self: center;
}
@media screen and (min-width: 600px){
	.grid-1-1, .grid-3, .grid-4, .grid-5 {
        grid-template-columns: 1fr 1fr;
    }
}
@media screen and (min-width: 900px){

    .grid-1-2 {
        grid-template-columns: 1fr 2fr;
    }
    .grid-2-1 {
        grid-template-columns: 2fr 1fr;
    }
    .grid-1-3 {
        grid-template-columns: 1fr 3fr;
    }
	.grid-3 {
        grid-template-columns: 1fr 1fr 1fr;
    }
    .grid-4 {
        grid-template-rows: auto;
        grid-template-columns: 1fr 1fr 1fr 1fr;
        grid-auto-columns: 1fr;
    }
    .grid-5 {
        grid-template-rows: auto;
        grid-template-columns: repeat(5, 1fr);
        grid-auto-columns: 1fr;
    }
    .gap-4 {
        gap: 4rem;
    }
}
.order-2 {
    order: 2;
}
@media screen and (max-width: 599px) {
    .order-2-small {
        order: 2;
    }
    
}