Как сделать верстку как на картине?
если хочется "только на цсс", то простейший вариант изготовления аккордеона вручную - это выбор развёрнутого в данный момент блока на радиокнопках.
расположить без изысков: подряд три дива, в каждом сначала заголовок, потом блок с тектом.  блоки изначально спрятаны, заголовки видны.  
заголовки блоков - это лейблы для спрятанных радиокнопок с одинаковым name.  видимость блока определяется селектором следующих элементов, вроде такого: input[checked] ~ div.block { display: block; }
юзер тычет в зголовок, кнопка переключается, прошлый блок сворачивается, новый растопыривается.
Это называется аккордеон, на codepen можно найти разные реализации