@media screen and (min-width: 500px){
/* Change direction of appointment type listings into a row and wrap the overflow */
.book-type > div:last-child {
display: flex;
flex-direction: row;
flex-wrap: wrap;
}

/* Set each appointment type listing to take up half of the book-type container */
.book-type > div > .book-type-single {
flex: 0 0 50%;
}
}

/* Set the ‘What type of appointment are you booking?’ header to take up 100% of the book-type container */
.book-type > div > .booking-header {
flex: 100%;
}