[html]
<center>
<div id="lvlblock0">

                <!--************** ********** ВСТУПЛЕНИЕ ********** **************-->
   <div id="lvlblock1">
ОСНОВНОЙ ТЕКСТ
   </div>

<div class="lvlblockpages">
<div id="lvlblockpageslide">
<input type="radio" id="lvlblockpagetab1" name="lvlblockpagetab" checked="checked"><label for="lvlblockpagetab1">

КНОПКА 1

</label>
<div class="lvlblockpagetabapptabs"><div class="lvlblockpagetabapp"><div class="insidelvlblockpagetabapp"><div class="insideinsidelvlblockpagetab">
                <!--************** ********** ПЕРВАЯ ВКЛАДКА ********** **************-->
<center>
     <table layout="fixed" width=100%>
<tr>
                <!--************** ********** ПЕРВАЯ КАРТА (первая вкладка) ********** **************-->
<td width="30%">
      <div class="lvlblockwrapper">
         <div class="lvlblockcard">
           <div class="lvlblockfront">
           <div class="lvlblockfrontimg"><img src="ССЫЛКА НА КАРТИНКУ"></div>
           <div class="lvlblockfronttext">ТЕКСТ ПОД КАРТИНКОЙ</div>
           </div>
           <div class="lvlblockback"><div class="lvlblockbacktext">
ТЕКСТ КАРТОЧКИ
           </div></div>
         </div>
      </div>
</td>
                <!--************** ********** ВТОРАЯ КАРТА (первая вкладка) ********** **************-->
<td width="30%">
      <div class="lvlblockwrapper">
         <div class="lvlblockcard">
           <div class="lvlblockfront">
           <div class="lvlblockfrontimg"><img src="ССЫЛКА НА КАРТИНКУ"></div>
           <div class="lvlblockfronttext">ТЕКСТ ПОД КАРТИНКОЙ</div>
           </div>
           <div class="lvlblockback"><div class="lvlblockbacktext">
ТЕКСТ КАРТОЧКИ
           </div></div>
         </div>
      </div>
</td>
                <!--************** ********** ТРЕТЬЯ КАРТА (первая вкладка) ********** **************-->
<td width="30%">
      <div class="lvlblockwrapper">
         <div class="lvlblockcard">
           <div class="lvlblockfront">
           <div class="lvlblockfrontimg"><img src="ССЫЛКА НА КАРТИНКУ"></div>
           <div class="lvlblockfronttext">ТЕКСТ ПОД КАРТИНКОЙ</div>
           </div>
           <div class="lvlblockback"><div class="lvlblockbacktext">
ТЕКСТ КАРТОЧКИ
           </div></div>
         </div>
      </div>
</td>
</tr>
    </table>
</center>
</div></div></div></div>

<input type="radio" id="lvlblockpagetab2" name="lvlblockpagetab"><label for="lvlblockpagetab2">

КНОПКА 2

</label><div class="lvlblockpagetabapptabs"><div class="lvlblockpagetabapp"><div class="insidelvlblockpagetabapp"><div class="insideinsidelvlblockpagetab">
                <!--************** ********** ВТОРАЯ ВКЛАДКА ********** **************-->
<center>
     <table layout="fixed" width=100%>
<tr>
                <!--************** ********** ПЕРВАЯ КАРТА (вторая вкладка) ********** **************-->
<td width="30%">
      <div class="lvlblockwrapper">
         <div class="lvlblockcard">
           <div class="lvlblockfront">
           <div class="lvlblockfrontimg"><img src="ССЫЛКА НА КАРТИНКУ"></div>
           <div class="lvlblockfronttext">ТЕКСТ ПОД КАРТИНКОЙ</div>
           </div>
           <div class="lvlblockback"><div class="lvlblockbacktext">
ТЕКСТ КАРТОЧКИ
           </div></div>
         </div>
      </div>
</td>
                <!--************** ********** ВТОРАЯ КАРТА (вторая вкладка) ********** **************-->
<td width="30%">
      <div class="lvlblockwrapper">
         <div class="lvlblockcard">
           <div class="lvlblockfront">
           <div class="lvlblockfrontimg"><img src="ССЫЛКА НА КАРТИНКУ"></div>
           <div class="lvlblockfronttext">ТЕКСТ ПОД КАРТИНКОЙ</div>
           </div>
           <div class="lvlblockback"><div class="lvlblockbacktext">
ТЕКСТ КАРТОЧКИ
           </div></div>
         </div>
      </div>
</td>
                <!--************** ********** ТРЕТЬЯ КАРТА (вторая вкладка) ********** **************-->
<td width="30%">
      <div class="lvlblockwrapper">
         <div class="lvlblockcard">
           <div class="lvlblockfront">
           <div class="lvlblockfrontimg"><img src="ССЫЛКА НА КАРТИНКУ"></div>
           <div class="lvlblockfronttext">ТЕКСТ ПОД КАРТИНКОЙ</div>
           </div>
           <div class="lvlblockback"><div class="lvlblockbacktext">
ТЕКСТ КАРТОЧКИ
           </div></div>
         </div>
      </div>
</td>
</tr>
    </table>
</center>
</div></div></div></div>

<input type="radio" id="lvlblockpagetab3" name="lvlblockpagetab"><label for="lvlblockpagetab3">

КНОПКА 3

</label><div class="lvlblockpagetabapptabs"><div class="lvlblockpagetabapp"><div class="insidelvlblockpagetabapp"><div class="insideinsidelvlblockpagetab">
                <!--************** ********** ТРЕТЬЯ ВКЛАДКА ********** **************-->
<center>
     <table layout="fixed" width=100%>
<tr>
                <!--************** ********** ПЕРВАЯ КАРТА (третья вкладка) ********** **************-->
<td width="30%">
      <div class="lvlblockwrapper">
         <div class="lvlblockcard">
           <div class="lvlblockfront">
           <div class="lvlblockfrontimg"><img src="ССЫЛКА НА КАРТИНКУ"></div>
           <div class="lvlblockfronttext">ТЕКСТ ПОД КАРТИНКОЙ</div>
           </div>
           <div class="lvlblockback"><div class="lvlblockbacktext">
ТЕКСТ КАРТОЧКИ
           </div></div>
         </div>
      </div>
</td>
                <!--************** ********** ВТОРАЯ КАРТА (третья вкладка) ********** **************-->
<td width="30%">
      <div class="lvlblockwrapper">
         <div class="lvlblockcard">
           <div class="lvlblockfront">
           <div class="lvlblockfrontimg"><img src="ССЫЛКА НА КАРТИНКУ"></div>
           <div class="lvlblockfronttext">ТЕКСТ ПОД КАРТИНКОЙ</div>
           </div>
           <div class="lvlblockback"><div class="lvlblockbacktext">
ТЕКСТ КАРТОЧКИ
           </div></div>
         </div>
      </div>
</td>
                <!--************** ********** ТРЕТЬЯ КАРТА (третья вкладка) ********** **************-->
<td width="30%">
      <div class="lvlblockwrapper">
         <div class="lvlblockcard">
           <div class="lvlblockfront">
           <div class="lvlblockfrontimg"><img src="ССЫЛКА НА КАРТИНКУ"></div>
           <div class="lvlblockfronttext">ТЕКСТ ПОД КАРТИНКОЙ</div>
           </div>
           <div class="lvlblockback"><div class="lvlblockbacktext">
ТЕКСТ КАРТОЧКИ
           </div></div>
         </div>
      </div>
</td>
</tr>
    </table>
</center>
</div></div></div></div>

</div></div>
</div>
</center>
<style>#lvlblock0 {position: relative; width: 712px;  height: 649px; background: url('https://forumupload.ru/uploads/000c/73/14/2/624053.png') no-repeat fixed top center;}
#lvlblock1 {
    position: absolute;
    margin: 111px 0 0 104px;
    padding: 16px;
    width: 474px;
    height: 220px;
    overflow: auto;
    text-align: justify;
    background-color: #ffffff;
}

.lvlblockpages {
    position: absolute;
    margin-top: 348px;
    width: 616px;
    height: 280px;
}
.lvlblockpages [type="radio"] {display:none;}
#lvlblockpageslide {
    position: absolute;
    width: 506px;
    height: 260px;
    margin: 20px 0 0 104px;
    overflow: hidden;
    z-index: 2;
}
.lvlblockpages [type="radio"]:checked+label {padding-top: 16px;}
.lvlblockpages label {display: inline-block; height: 14px; margin: 0 26px -8px 26px; width: 80px; padding: 6px; cursor: pointer;
text-align: center; text-transform: uppercase; font-size: 10px; letter-spacing: 1.3px; line-height: 14px;
    background-color: transparent;
    outline: 2px solid #fff;
    outline-offset: -2px;}
.lvlblockpages [type="radio"]:checked+label+.lvlblockpagetabapptabs {opacity:1; z-index:2; -webkit-transition:margin-left .8s 0s, z-index 0s 0s; -moz-transition:margin-left .8s 0s, z-index 0s 0s; -o-transition:margin-left .8s 0s, z-index 0s 0s; -ms-transition:margin-left .8s 0s, z-index 0s 0s; margin-left:0px;}
.lvlblockpagetabapptabs {z-index:0; margin-left:-506px; overflow:hidden; position:absolute; margin-top:5px; -webkit-transition:margin-left .8s 0s, z-index 0s 1s; -moz-transition:margin-left .8s 0s, z-index 0s 1s; -ms-transition:margin-left .8s 0s, z-index 0s 1s; -o-transition:margin-left .8s 0s, z-index 0s 1s;}
.lvlblockpagetabapp {width: 506px; height: 228px; margin-left: 0px;
    background-color: #fff;
    outline: 2px solid #fff;
    outline-offset: -2px;}
.insidelvlblockpagetabapp {padding-top: 18px; text-align: justify; font-size: 12px; line-height: 10px;}
.insideinsidelvlblockpagetab {height: 200px;}
.insideinsidelvlblockpagetab::-webkit-scrollbar {width: 3px; height: 3px;}

.lvlblockwrapper {position: relative; left: 0; top: 0; display: flex; justify-content: center; align-items: center;}
.lvlblockcard {position: relative; width: 100%; height: 180px; perspective: 1000px;}
.lvlblockfront {position: absolute; width: 100%; height: 180px; left: 0; top: 0; display: flex; justify-content: center; align-items: center; transition: 1s; backface-visibility: hidden; overflow-x: hidden;
text-align: justify;
    background-color: transparent;}
.lvlblockback {position: absolute; width: 100%; height: 180px; left: 0; top: 0; display: flex; transition: 1s; backface-visibility: hidden; overflow-x: hidden; transform: rotateY(180deg); font-size: 9.4px; text-align: justify;
    background-color: transparent;}
.lvlblockfrontimg {}
.lvlblockfronttext {position: absolute; margin: 120px 0 0 0px; text-transform: uppercase;}
.lvlblockbacktext {padding: 4px;}
.lvlblockcard:hover .lvlblockfront {transform: rotateY(180deg);}
.lvlblockcard:hover .lvlblockback {transform: rotateY(360deg);}

#lvlblock1::-webkit-scrollbar, .lvlblockback::-webkit-scrollbar {width: 3px; height: 6px;}</style>
[/html]