#highlights {
display: grid;
grid-template-columns: repeat(4, 1fr);
   grid-template-rows: 1fr;
column-gap: 2em;
row-gap: 2em;
padding: 40px 0px;
font-family: 'Bebas Neue', display;
position: relative;
}
#highlights ARTICLE {
display: flex;
vertical-align: middle;
align-items: center;
text-align: center;
}
#highlights .highlights--center {
display: flex;
flex-direction: column;
align-items: center;
vertical-align: middle;
width: 100%;
padding: 20px;
}
#highlights DIV>DIV {
font-size: 4.4em;
line-height: normal;
color: #76232f;
}
#highlights DIV>DIV SPAN:nth-child(2n) {
font-size: 20px;
}
#highlights P {
display: block;
font-size: 2.35em;
line-height: 1.1em;
text-transform: uppercase;
}
.highlights__logo {
background-color: #F7F7F7;
width: 80px;
height: 80px;
display: block;
position: absolute;
border-radius: 100%;
left: 50%;
top: 0%;
transform: translate(-50%,-50%);
padding: 20px;
text-align: center;
}
.highlights__logo img {
margin: auto;
max-width: 100%;
max-height: 100%;
height: auto;
width: auto;
display: block;
}
@media only screen and (max-width: 1200px) {
#highlights P {
font-size: 1.85em;
}
}
@media only screen and (max-width: 780px) {
#highlights {
grid-template-columns: repeat(2, 1fr);
}
#highlights .highlights--center {
padding: 10px;
}
}
@media only screen and (max-width: 500px) {
#highlights DIV>DIV {
font-size: 3.4em;
}
#highlights .highlights--center {
padding: 2px;
}
}