<style>
.ABCV{/*блок целиком*/
width:500px; /*ширина*/
margin:auto; /*отступы автоматические*/
line-height:16px; /*высота линий*/
}


#LTRSV {/*Буквы блок полностью*/
width:500px; /*ширина*/
height:35px; /*высота*/
margin-bottom:25px; /*отступ снизу*/
text-align:center; /*текст по центру*/
transition:all linear 0.45s; -webkit-transition:all linear 0.45s; /*анимация*/
}

#LTRSV:hover {/*Наведение на буквы*/
height:160px; /*высота появляющегося контейнера*/
color:white; /*цвет шрифта*/
}

#LTRSV span{/*чёрная полоса*/
display:block; 
margin-top:-25px; /*отступ сверху*/
height:5px; /*высота линии*/
background:black; /*цвет линии*/
}

.LTRSV {/*круглые области на фоне букв*/
transition:all ease 0.35s; -webkit-transition:all ease 0.35s; /*анимация*/
position:relative; /*позиционирование*/
z-index:3; 
display:inline-block; 
vertical-align:top; /*вертикальное выравнивание*/
margin:0 15px; /*отступы*/
height:33px; /*высота*/
width:35px; /*ширина*/
padding:12px 5px 0px 5px; /*отступы*/
border-radius:35px; /*закругление краём*/
text-align:center; /*по центру*/
color:white; /*цвет шрифта*/
background:teal; /*фоновый цвет*/
}

.LTRSV div {/*контейнер при наведении на буквы - настройки*/
position:absolute; /*позиционирование*/
z-index:1; 
margin-left:-45px; /*отступ слева*/
margin-top:25px; /*отступ сверху*/
width:500px; /*ширина*/
height:0; /*высота ноль - то есть его не видно*/
overflow:hidden; 
background:rgba(250,250,250,0.3); /*цвет фона*/ 
color:black; /*цвет шрифта*/
text-align:left; /*текст слева*/
font-size:11px; /*размер шрифта*/
transition:all linear 0.45s; -webkit-transition:all linear 0.45s; /*анимация*/
}

.LTRSV:hover div{/*контейнер при наведении на буквы - появляется*/
width:500px; /*ширина*/
height:135px;  /*высота*/
}

.LTRSV p {/*блок с текстом в сером конейнере*/
width:490px; /*ширина*/
height:125px; /*высота*/
padding:5px; /*отступ по всем четырём краям*/
overflow:auto;
transform:translateY(-125px); -webkit-transform:translateY(-125px); /*анимация*/
transition:all linear 0.45s; -webkit-transition:all linear 0.45s; /*анимация*/
}

.LTRSV:hover p{/*блок с текстом в сером конейнере при наведении мышью на буквы*/
transform:translateY(0px); -webkit-transform:translateY(0px); /*анимация*/
}

.VII div{/*двигаем второй круг с буквами*/
position:absolute; /*позиционирование*/
margin-left:-120px; /*отступ слева*/
}

.VIII div{ /* двигаем 3й круг с буквами */
position:absolute; /*позиционирование*/
margin-left:-195px; /*отступ слева*/
}

.VIV div{ /* двигаем 4й круг с буквами */
position:absolute; /*позиционирование*/
margin-left:-270px; /*отступ слева*/
}

.VV div{ /* двигаем 5й круг с буквами */
position:absolute; /*позиционирование*/
margin-left:-345px; /*отступ слева*/
}

.VVI div{/* двигаем 6й круг с буквами */
position:absolute; /*позиционирование*/
margin-left:-420px; /*отступ слева*/
}
.STUV {/*Блок с буквами S T U*/
font-size:12px; /*размер шрифта*/
height:32px; /*высота*/
width:35px; /*ширина*/
padding:13px 5px 0px 5px; /*отступы*/
}
.STUV div{ /* двигаем Блок с буквами S T U  */
position:absolute; /*позиционирование*/
margin-left:-270px;/*отступ слева*/
}
.XYZV {/*Блок с буквами XYZ*/
font-size:12px; /*размер шрифта*/
height:32px; /*высота*/
width:35px; /*ширина*/
padding:13px 5px 0px 5px; /*отступы*/
}
.XYZV div{/* двигаем Блок с буквами XYZ  */
position:absolute; /*позиционирование*/ 
margin-left:-420px; /*отступ слева*/
}
<style>