Please tell me how you can implement. It is necessary that when you hover on the block, climbs text from top to bottom. For each block its text. And so the text climbs into a piece of the next block. Thank you in advance. 
There is a code:
<div class="new-home-page-reviews container w960"> <div class="reviews-tab-items col-xs-12 col-sm-6 col-md-4 col-lg-4"> <div class="reviews-tab-items-content"> <div class="reviews-tab-item-image showHideContent"> <div class="reviews-item-text">Благодаря внедренной B2B системы мы в режиме on-line можем видеть все движения товаров, заказы покупателей, наши партнеры в личном кабинете могут всегда видеть актуальные цены в их регионе.</div> </div> <div class="reviews-tab-item-logo"></div> <div class="reviews-tab-item-name">Першин Сергей Алексеевич<span>ООО “Юнипол”</span></div> <div class="hidden-text container w960 content"><div class="hidden-text-triangle col-md-12"><div class="reviews-hidden-text col-md-12">ssssКрупный российский дистрибьютор шин и дисков компания Юнипол работает на российском рынке более 20 лет.В IT-Lite мы арендуем конфигурацию 1С:Управление торговлей 10.3 начиная с 2009 года. Компания имеет географически распределенную структуру с партнерской сетью в 29 регионах России. Это накладывает специфику на ведение бизнеса. В 2010 году специалистами компании IT-Lite были внедрены доработки в конфигурацию 1С:Упраление торговлей и встроена система B2B, работающая через WEB-расширение. B2B портал посредством подключения к информационной базе 1С:УТ позволяет отслеживать в режиме реального времени товарные остатки, цены, отгрузки, а также осуществлять заказы. <br><br> Благодаря внедренной B2B системы мы в режиме on-line можем видеть все движения товаров, заказы покупателей, наши партнеры в личном кабинете могут всегда видеть актуальные цены в их регионе. Для крупного дистрибьютора с большим регионом охвата и количеством рабочих мест с несколько сотен - это фундамент для успешного бизнеса.<br><br> Мы сотрудничаем с компанией IT-Lite более 5 лет. Планируем расти и развиваться вместе и дальше.</div></div></div> </div> </div> <div class="reviews-tab-items col-xs-12 col-sm-6 col-md-4 col-lg-4"> <div class="reviews-tab-items-content"> <div class="reviews-tab-item-image showHideContent"> <div class="reviews-item-text">Сотрудничать с компанией IT-Lite мы начали еще в 2011 году, арендуем выделенный сервер. Технические вопросы, которые возникали за годы работы, оперативно решались специалистами компании.</div> </div> <div class="reviews-tab-item-logo"></div> <div class="reviews-tab-item-name">Мозолевский Максим Александрович <span>ООО “АЛЬФАСНАБ оптовые системы”</span></div> <div class="hidden-text container w960 content3"><div class="hidden-text-triangle col-md-12"><div class="reviews-hidden-text col-md-12">ffffКрупный российский дистрибьютор шин и дисков компания Юнипол работает на российском рынке более 20 лет.В IT-Lite мы арендуем конфигурацию 1С:Управление торговлей 10.3 начиная с 2009 года. Компания имеет географически распределенную структуру с партнерской сетью в 29 регионах России. Это накладывает специфику на ведение бизнеса. В 2010 году специалистами компании IT-Lite были внедрены доработки в конфигурацию 1С:Упраление торговлей и встроена система B2B, работающая через WEB-расширение. B2B портал посредством подключения к информационной базе 1С:УТ позволяет отслеживать в режиме реального времени товарные остатки, цены, отгрузки, а также осуществлять заказы. <br><br> Благодаря внедренной B2B системы мы в режиме on-line можем видеть все движения товаров, заказы покупателей, наши партнеры в личном кабинете могут всегда видеть актуальные цены в их регионе. Для крупного дистрибьютора с большим регионом охвата и количеством рабочих мест с несколько сотен - это фундамент для успешного бизнеса.<br><br> Мы сотрудничаем с компанией IT-Lite более 5 лет. Планируем расти и развиваться вместе и дальше.</div></div></div> </div> </div> <div class="reviews-tab-items col-xs-12 col-sm-12 col-md-4 col-lg-4"> <div class="reviews-tab-items-content"> <div class="reviews-tab-item-image showHideContent"> <div class="reviews-item-text">ООО “Инитлаб” благодарит компанию IT-Lite за предоставление надежных выделенных и виртуальных серверов для задач нашего бизнеса. Отдельно хотелось бы отметить оперативную техническую поддержку!</div> </div> <div class="reviews-tab-item-logo"></div> <div class="reviews-tab-item-name">Агабеков Роман Александрович<span>ООО “Инитлаб”</span></div> <div class="hidden-text container w960 content3"><div class="hidden-text-triangle col-md-12"><div class="reviews-hidden-text col-md-12">ffffКрупный российский дистрибьютор шин и дисков компания Юнипол работает на российском рынке более 20 лет.В IT-Lite мы арендуем конфигурацию 1С:Управление торговлей 10.3 начиная с 2009 года. Компания имеет географически распределенную структуру с партнерской сетью в 29 регионах России. Это накладывает специфику на ведение бизнеса. В 2010 году специалистами компании IT-Lite были внедрены доработки в конфигурацию 1С:Упраление торговлей и встроена система B2B, работающая через WEB-расширение. B2B портал посредством подключения к информационной базе 1С:УТ позволяет отслеживать в режиме реального времени товарные остатки, цены, отгрузки, а также осуществлять заказы. <br><br> Благодаря внедренной B2B системы мы в режиме on-line можем видеть все движения товаров, заказы покупателей, наши партнеры в личном кабинете могут всегда видеть актуальные цены в их регионе. Для крупного дистрибьютора с большим регионом охвата и количеством рабочих мест с несколько сотен - это фундамент для успешного бизнеса.<br><br> Мы сотрудничаем с компанией IT-Lite более 5 лет. Планируем расти и развиваться вместе и дальше.</div></div></div> </div> </div> </div> CSS:
.new-home-page-reviews{ position: relative; padding: 0; margin-bottom: 30px; .reviews-tab-items{ position: relative; padding-bottom: 15px; .reviews-tab-item-image{ border-top-left-radius: 10px; border-top-right-radius: 10px; display: table; cursor: pointer; .reviews-item-text{ padding: 0 8px; display: table-cell; vertical-align: middle; height: 186px; text-align: center; color: white; position: relative; border-top-left-radius: 10px; font-size: 14px; border-top-right-radius: 10px; &:before{ background: url(image/quote_img.png) no-repeat; content: ''; position: absolute; width: 15px; height: 21px; top: 13px; left: 35px; } } } &:nth-child(1) .reviews-tab-item-image{ background: url(image/1-0.png) no-repeat; background-size: cover; &:hover{ background: url(image/1-1.png) no-repeat; background-size: cover; } } &:nth-child(2) .reviews-tab-item-image{ background: url(image/2-0.png) no-repeat; background-size: cover; &:hover{ background: url(image/2-1.png) no-repeat; background-size: cover; } } &:nth-child(3) .reviews-tab-item-image{ background: url(image/3-0.png) no-repeat; background-size: cover; &:hover{ background: url(image/3-1.png) no-repeat; background-size: cover; } } .reviews-tab-item-logo{ position: absolute; width: 50%; height: 35px; left: 26%; border-radius: 20px; top: 56%; text-align: center; box-shadow: 0px 4px 8.8px 0.2px rgba(0, 0, 0, 0.05); background: white; background-repeat: no-repeat; background-position: center; } &:nth-child(1) .reviews-tab-item-logo{ background-image: url(image/unipol_logo.png); } &:nth-child(2) .reviews-tab-item-logo{ background-image: url(image/alfasnab_logo.png); } &:nth-child(3) .reviews-tab-item-logo{ background-image: url(image/initlab_ico.png); } .reviews-tab-item-name{ height: 100px; text-align: center; padding: 33px 0px 0px; box-shadow: 0px 4px 8.8px 0.2px rgba(0, 0, 0, 0.05); border-bottom-left-radius: 10px; border-bottom-right-radius: 10px; background: white; font-size: 14px; font-weight: bold; color: #000000; &>span{ font-size: 15px; font-weight: normal; display: block; } } } &:before{ content: ''; background: url(image/object_1.png) no-repeat; position: absolute; height: 235px; width: 295px; right: 95%; bottom: 0; @media screen and (max-width: 1292px) { display: none; } } } It turned out that something like this: 
&:nth-child(1) .reviews-tab-item-image{ background: url(image/1-0.png) no-repeat; background-size: cover; &:hover{ background: url(image/1-1.png) no-repeat; background-size: cover; } &:hover ~ .hidden-text{ visibility: visible; opacity: 1; } } &:nth-child(2) .reviews-tab-item-image{ background: url(image/2-0.png) no-repeat; background-size: cover; &:hover{ background: url(image/2-1.png) no-repeat; background-size: cover; } &:hover ~ .hidden-text{ visibility: visible; right: -305px; opacity: 1; } } &:nth-child(3) .reviews-tab-item-image{ background: url(image/3-0.png) no-repeat; background-size: cover; &:hover{ background: url(image/3-1.png) no-repeat; background-size: cover; } &:hover ~ .hidden-text{ visibility: visible; right: 12px; opacity: 1; } } .reviews-tab-item-logo{ position: absolute; width: 50%; height: 35px; left: 26%; border-radius: 20px; top: 56%; text-align: center; box-shadow: 0px 4px 8.8px 0.2px rgba(0, 0, 0, 0.05); background: white; background-repeat: no-repeat; background-position: center; } &:nth-child(1) .reviews-tab-item-logo{ background-image: url(image/unipol_logo.png); } &:nth-child(2) .reviews-tab-item-logo{ background-image: url(image/alfasnab_logo.png); } &:nth-child(3) .reviews-tab-item-logo{ background-image: url(image/initlab_ico.png); } .reviews-tab-item-name{ height: 100px; text-align: center; padding: 33px 0px 0px; box-shadow: 0px 4px 8.8px 0.2px rgba(0, 0, 0, 0.05); border-bottom-left-radius: 10px; border-bottom-right-radius: 10px; background: white; font-size: 14px; font-weight: bold; color: #000000; &>span{ font-size: 15px; font-weight: normal; display: block; } } } &:before{ content: ''; background: url(image/object_1.png) no-repeat; position: absolute; height: 235px; width: 295px; right: 95%; bottom: 0; @media screen and (max-width: 1292px) { display: none; } } } .hidden-text{ position:absolute; top:320px; width: 930px; padding:20px; background:#fbfbfb; box-shadow: 0px 4px 8.8px 0.2px rgba(0, 0, 0, 0.05); border-radius:10px; opacity:0; visibility:hidden; transition:.3s; transition-delay:.5s; color:#000; z-index:100; line-height:20px; } .hidden-text_1{ left: 15; } .hidden-text_2{ right: -307px; } .hidden-text_3{ right: 15px; } How can I make it correctly displayed on the mobile phone, so that when pointing to a block, it moves out below it? etc. Thank!
