[html]
<style>
.store {
background-image: url(https://forumstatic.ru/files/001c/7b/1c/28566.png);
background-size: cover;
width: 640px;
height: 654px;
border-radius: 10px;
}
.backgrounds {
width: 620px;
}
.bg-content-main {
height: 300px;
background: var(--background-primary);
border-radius: 0 0 10px 10px;
padding-top: 10px;
padding-bottom: 2px;
}
.bg-content-main-ins {
display: flex;
flex-direction: row;
flex-wrap: wrap;
max-height: 290px;
overflow: auto;
width: 600px;
margin: auto;
justify-content: space-around;
}
.s-bg-ins {
margin-top: 5px;
margin-bottom: 3px;
}
.s-bg-ins {
width: 90px;
height: 90px;
background-size: contain !important;
border-radius: 5px;
}
.s-bg-ins.empty {
background: url(https://forumstatic.ru/files/001c/7b/1c/83333.png?v=1) no-repeat;
}
.single-ic {
width: 34px;
height: 34px;
border-radius: 100%;
background: rgba(35, 37, 40, 0.05);
display: flex;
justify-content: center;
align-items: center;
}
.s-ic-ins {
height: 25px;
background-size: contain;
background-position: center;
width: 25px;
}
.s-ic-ins.empty {
background: url(https://forumstatic.ru/files/001c/7b/1c/77796.png?v=1) no-repeat;
background-size: contain !important;
}
.ic-content-main {
height: 300px;
background: var(--background-primary);
border-radius: 0 0 10px 10px;
padding-top: 10px;
padding-bottom: 2px;
}
.ic-content-main-ins {
display: flex;
flex-direction: row;
flex-wrap: wrap;
max-height: 290px;
overflow: auto;
margin: auto;
justify-content: space-around;
width: 90%;
}
.plashechki {
width: 457px;
margin-right: 5px;
}
.iconchiki {
width: 154px;
margin-left: 5px;
}
.store-main {
padding-top:80px;
padding-left:10px;
padding-right:10px;
}
.tab {
overflow: hidden;
background-color: transparent;
flex-direction: row;
justify-content: center;
display: flex;
margin-bottom: 10px;
}
.pl-content-main {
height: 300px;
background: var(--background-primary);
border-radius: 0 0 10px 10px;
padding-top: 10px;
padding-bottom: 2px;
}
.pl-content-main-ins {
display: flex;
flex-direction: row;
flex-wrap: wrap;
max-height: 290px;
overflow: auto;
width: 445px;
margin: auto;
justify-content: space-around;
}
.single-pl {
margin-top: 2px;
margin-bottom: 3px;
}
.single-ic {
margin-top: 2px;
margin-bottom: 3px;
}
.top-pl {
color: white;
font-family: 'Playfair Display';
font-size: 10px !important;
font-weight: 600;
padding: 2px 0 0 0 !important;
text-align: center !important;
}
.top-pl.bottom {
font-weight: normal !important;
padding-top:0px !important;
margin-top:-3px;
}
.tab button {
display: flex ; flex-direction: row; justify-content: center; align-items: center; padding: 4px 16px; gap: 4px; height: 23px; background: #D3D3D3; border-radius: 4px; border: 0px; color: black; font-family: playfair display; text-transform: uppercase; font-size: 10px; font-weight: bold; margin-left:5px; margin-right:5px; cursor: pointer;
}
.tab button:hover {
background-color: #ddd;
}
.tab button.active {
display: flex ; flex-direction: row; justify-content: center; align-items: center; padding: 4px 16px; gap: 4px; height: 23px; background: #343D47; box-shadow: 0px 0.815028px 0.815028px rgba(40, 44, 41, 0.5); border-radius: 4px; border: 0px; color: white; font-family: playfair display; text-transform: uppercase; font-size: 10px; font-weight: bold;
}
.tabcontent {
display: none;
width: 619px;
}
.pl-header-main, .ic-header-main, .bg-header-main {
font-family: inter;
font-size: 12px;
font-weight: bolder;
background: var(--background-secondary);
border-radius: 10px 10px 0 0;
padding: 4px;
text-align: center;
}
</style>
<div style="justify-items: center;">
<div class="store"><div class="head" style="background: url(https://forumstatic.ru/files/001c/7b/1c/80048.png); position: absolute; width: 340px; height: 80px; z-index: 10; background-size: cover; margin-left: 277px; margin-top: 30px;"></div>
<div class="store-main">
<div class="store-main-descr" style="height: 130px; display: inline-block; vertical-align: middle; align-content: center; overflow-y: scroll; margin-bottom: 10px;text-align: justify; background: var(--background-primary); padding:22px; border-radius:10px;">
<span style="font-family: Playfair Display; font-weight: 700; font-size: 24px; font-style: italic;">Р</span><span style="font-family:inter; font-size:12px; line-height:140%;">авным образом рамки и место обучения кадров требуют от нас анализа существенных финансовых и административных условий. Таким образом сложившаяся структура организации влечет за собой процесс внедрения и модернизации направлений прогрессивного развития. Значимость этих проблем настолько очевидна, что новая модель организационной деятельности в значительной степени обуславливает создание направлений прогрессивного развития. С другой стороны постоянное информационно-пропагандистское обеспечение нашей деятельности способствует подготовки и реализации форм развития.</span>
</div>
<div class="tab">
<button class="tablinks active" onclick="openCity(event, 'Plashki')" id="defaultOpen">плашки и иконки</button>
<button class="tablinks" onclick="openCity(event, 'Iconki')">фоны</button>
</div>
<div id="Plashki" class="tabcontent" style="display: flex">
<div class="plashechki">
<div class="pl-header-main">Плашки — 200</div>
<div class="pl-content-main"><div class="pl-content-main-ins">
<div class="single-pl" style="background: url(https://forumstatic.ru/files/001c/7b/1c/20118.png?v=1) no-repeat; width: 213px;height: 34px; background-size: cover;border-radius: 10px 10px 5px 5px;"><p class="top-pl">расстояние между нами</p><p class="top-pl bottom">сводится к нулю</p></div>
<div class="single-pl" style="background: url(https://forumstatic.ru/files/001c/7b/1c/20118.png?v=1) no-repeat; width: 213px;height: 34px; background-size: cover;border-radius: 10px 10px 5px 5px;"><p class="top-pl">расстояние между нами</p><p class="top-pl bottom">сводится к нулю</p></div>
<div class="single-pl" style="background: url(https://forumstatic.ru/files/001c/7b/1c/20118.png?v=1) no-repeat; width: 213px;height: 34px; background-size: cover;border-radius: 10px 10px 5px 5px;"><p class="top-pl">расстояние между нами</p><p class="top-pl bottom">сводится к нулю</p></div>
<div class="single-pl" style="background: url(https://forumstatic.ru/files/001c/7b/1c/20118.png?v=1) no-repeat; width: 213px;height: 34px; background-size: cover;border-radius: 10px 10px 5px 5px;"><p class="top-pl">расстояние между нами</p><p class="top-pl bottom">сводится к нулю</p></div>
<div class="single-pl" style="background: url(https://forumstatic.ru/files/001c/7b/1c/20118.png?v=1) no-repeat; width: 213px;height: 34px; background-size: cover;border-radius: 10px 10px 5px 5px;"><p class="top-pl">расстояние между нами</p><p class="top-pl bottom">сводится к нулю</p></div>
<div class="single-pl" style="background: url(https://forumstatic.ru/files/001c/7b/1c/20118.png?v=1) no-repeat; width: 213px;height: 34px; background-size: cover;border-radius: 10px 10px 5px 5px;"><p class="top-pl">расстояние между нами</p><p class="top-pl bottom">сводится к нулю</p></div>
<div class="single-pl" style="background: url(https://forumstatic.ru/files/001c/7b/1c/20118.png?v=1) no-repeat; width: 213px;height: 34px; background-size: cover;border-radius: 10px 10px 5px 5px;"><p class="top-pl">расстояние между нами</p><p class="top-pl bottom">сводится к нулю</p></div>
<div class="single-pl" style="background: url(https://forumstatic.ru/files/001c/7b/1c/20118.png?v=1) no-repeat; width: 213px;height: 34px; background-size: cover;border-radius: 10px 10px 5px 5px;"><p class="top-pl">расстояние между нами</p><p class="top-pl bottom">сводится к нулю</p></div>
<div class="single-pl" style="background: url(https://forumstatic.ru/files/001c/7b/1c/20118.png?v=1) no-repeat; width: 213px;height: 34px; background-size: cover;border-radius: 10px 10px 5px 5px;"><p class="top-pl">расстояние между нами</p><p class="top-pl bottom">сводится к нулю</p></div>
<div class="single-pl" style="background: url(https://forumstatic.ru/files/001c/7b/1c/20118.png?v=1) no-repeat; width: 213px;height: 34px; background-size: cover;border-radius: 10px 10px 5px 5px;"><p class="top-pl">расстояние между нами</p><p class="top-pl bottom">сводится к нулю</p></div>
<div class="single-pl" style="background: url(https://forumstatic.ru/files/001c/7b/1c/20118.png?v=1) no-repeat; width: 213px;height: 34px; background-size: cover;border-radius: 10px 10px 5px 5px;"><p class="top-pl">расстояние между нами</p><p class="top-pl bottom">сводится к нулю</p></div>
<div class="single-pl" style="background: url(https://forumstatic.ru/files/001c/7b/1c/20118.png?v=1) no-repeat; width: 213px;height: 34px; background-size: cover;border-radius: 10px 10px 5px 5px;"><p class="top-pl">расстояние между нами</p><p class="top-pl bottom">сводится к нулю</p></div>
<div class="single-pl" style="background: url(https://forumstatic.ru/files/001c/7b/1c/20118.png?v=1) no-repeat; width: 213px;height: 34px; background-size: cover;border-radius: 10px 10px 5px 5px;"><p class="top-pl">расстояние между нами</p><p class="top-pl bottom">сводится к нулю</p></div>
<div class="single-pl" style="background: url(https://forumstatic.ru/files/001c/7b/1c/20118.png?v=1) no-repeat; width: 213px;height: 34px; background-size: cover;border-radius: 10px 10px 5px 5px;"><p class="top-pl">расстояние между нами</p><p class="top-pl bottom">сводится к нулю</p></div>
<div class="single-pl" style="background: url(https://forumstatic.ru/files/001c/7b/1c/20118.png?v=1) no-repeat; width: 213px;height: 34px; background-size: cover;border-radius: 10px 10px 5px 5px;"><p class="top-pl">расстояние между нами</p><p class="top-pl bottom">сводится к нулю</p></div>
<div class="single-pl" style="background: url(https://forumstatic.ru/files/001c/7b/1c/20118.png?v=1) no-repeat; width: 213px;height: 34px; background-size: cover;border-radius: 10px 10px 5px 5px;"><p class="top-pl">расстояние между нами</p><p class="top-pl bottom">сводится к нулю</p></div>
<div class="single-pl" style="background: url(https://forumstatic.ru/files/001c/7b/1c/20118.png?v=1) no-repeat; width: 213px;height: 34px; background-size: cover;border-radius: 10px 10px 5px 5px;"><p class="top-pl">расстояние между нами</p><p class="top-pl bottom">сводится к нулю</p></div>
<div class="single-pl" style="background: url(https://forumstatic.ru/files/001c/7b/1c/20118.png?v=1) no-repeat; width: 213px;height: 34px; background-size: cover;border-radius: 10px 10px 5px 5px;"><p class="top-pl">расстояние между нами</p><p class="top-pl bottom">сводится к нулю</p></div>
<div class="single-pl" style="background: url(https://forumstatic.ru/files/001c/7b/1c/20118.png?v=1) no-repeat; width: 213px;height: 34px; background-size: cover;border-radius: 10px 10px 5px 5px;"><p class="top-pl">расстояние между нами</p><p class="top-pl bottom">сводится к нулю</p></div>
<div class="single-pl" style="background: url(https://forumstatic.ru/files/001c/7b/1c/20118.png?v=1) no-repeat; width: 213px;height: 34px; background-size: cover;border-radius: 10px 10px 5px 5px;"><p class="top-pl">расстояние между нами</p><p class="top-pl bottom">сводится к нулю</p></div>
<div class="single-pl" style="background: url(https://forumstatic.ru/files/001c/7b/1c/20118.png?v=1) no-repeat; width: 213px;height: 34px; background-size: cover;border-radius: 10px 10px 5px 5px;"><p class="top-pl">расстояние между нами</p><p class="top-pl bottom">сводится к нулю</p></div>
<div class="single-pl" style="background: url(https://forumstatic.ru/files/001c/7b/1c/20118.png?v=1) no-repeat; width: 213px;height: 34px; background-size: cover;border-radius: 10px 10px 5px 5px;"><p class="top-pl">расстояние между нами</p><p class="top-pl bottom">сводится к нулю</p></div>
<div class="single-pl" style="background: url(https://forumstatic.ru/files/001c/7b/1c/20118.png?v=1) no-repeat; width: 213px;height: 34px; background-size: cover;border-radius: 10px 10px 5px 5px;"><p class="top-pl">расстояние между нами</p><p class="top-pl bottom">сводится к нулю</p></div>
<div class="single-pl" style="background: url(https://forumstatic.ru/files/001c/7b/1c/20118.png?v=1) no-repeat; width: 213px;height: 34px; background-size: cover;border-radius: 10px 10px 5px 5px;"><p class="top-pl">расстояние между нами</p><p class="top-pl bottom">сводится к нулю</p></div>
<div class="single-pl" style="background: url(https://forumstatic.ru/files/001c/7b/1c/20118.png?v=1) no-repeat; width: 213px;height: 34px; background-size: cover;border-radius: 10px 10px 5px 5px;"><p class="top-pl">расстояние между нами</p><p class="top-pl bottom">сводится к нулю</p></div>
</div>
</div>
</div>
<div class="iconchiki">
<div class="ic-header-main">Иконки — 200</div>
<div class="ic-content-main"><div class="ic-content-main-ins">
<div class="single-ic"><div class="s-ic-ins" style="background:url(https://forumstatic.ru/files/001c/7b/1c/36859.png?v=1) no-repeat; background-size:contain !important;"></div></div>
<div class="single-ic"><div class="s-ic-ins empty"></div></div>
<div class="single-ic"><div class="s-ic-ins empty"></div></div>
<div class="single-ic"><div class="s-ic-ins empty"></div></div>
<div class="single-ic"><div class="s-ic-ins empty"></div></div>
<div class="single-ic"><div class="s-ic-ins empty"></div></div>
<div class="single-ic"><div class="s-ic-ins empty"></div></div>
<div class="single-ic"><div class="s-ic-ins empty"></div></div>
<div class="single-ic"><div class="s-ic-ins empty"></div></div>
<div class="single-ic"><div class="s-ic-ins empty"></div></div>
<div class="single-ic"><div class="s-ic-ins empty"></div></div>
<div class="single-ic"><div class="s-ic-ins empty"></div></div>
<div class="single-ic"><div class="s-ic-ins empty"></div></div>
<div class="single-ic"><div class="s-ic-ins empty"></div></div>
<div class="single-ic"><div class="s-ic-ins empty"></div></div>
<div class="single-ic"><div class="s-ic-ins empty"></div></div>
<div class="single-ic"><div class="s-ic-ins empty"></div></div>
<div class="single-ic"><div class="s-ic-ins empty"></div></div>
<div class="single-ic"><div class="s-ic-ins empty"></div></div>
<div class="single-ic"><div class="s-ic-ins empty"></div></div>
<div class="single-ic"><div class="s-ic-ins empty"></div></div>
<div class="single-ic"><div class="s-ic-ins empty"></div></div>
<div class="single-ic"><div class="s-ic-ins empty"></div></div>
<div class="single-ic"><div class="s-ic-ins empty"></div></div>
<div class="single-ic"><div class="s-ic-ins empty"></div></div>
<div class="single-ic"><div class="s-ic-ins empty"></div></div>
<div class="single-ic"><div class="s-ic-ins empty"></div></div>
<div class="single-ic"><div class="s-ic-ins empty"></div></div>
<div class="single-ic"><div class="s-ic-ins empty"></div></div>
<div class="single-ic"><div class="s-ic-ins empty"></div></div>
<div class="single-ic"><div class="s-ic-ins empty"></div></div>
<div class="single-ic"><div class="s-ic-ins empty"></div></div>
<div class="single-ic"><div class="s-ic-ins empty"></div></div>
<div class="single-ic"><div class="s-ic-ins empty"></div></div>
<div class="single-ic"><div class="s-ic-ins empty"></div></div>
<div class="single-ic"><div class="s-ic-ins empty"></div></div>
</div>
</div>
</div>
</div>
<div id="Iconki" class="tabcontent">
<div class="backgrounds">
<div class="bg-header-main">Фоны — 200</div>
<div class="bg-content-main">
<div class="bg-content-main-ins">
<div class="s-bg-ins" style="background:url(https://forumstatic.ru/files/001c/7b/1c/14375.png?v=1) no-repeat;"></div>
<div class="s-bg-ins empty"></div>
<div class="s-bg-ins empty"></div>
<div class="s-bg-ins empty"></div>
<div class="s-bg-ins empty"></div>
<div class="s-bg-ins empty"></div>
<div class="s-bg-ins empty"></div>
<div class="s-bg-ins empty"></div>
<div class="s-bg-ins empty"></div>
<div class="s-bg-ins empty"></div>
<div class="s-bg-ins empty"></div>
<div class="s-bg-ins empty"></div>
<div class="s-bg-ins empty"></div>
<div class="s-bg-ins empty"></div>
<div class="s-bg-ins empty"></div>
<div class="s-bg-ins empty"></div>
<div class="s-bg-ins empty"></div>
<div class="s-bg-ins empty"></div>
<div class="s-bg-ins empty"></div>
<div class="s-bg-ins empty"></div>
<div class="s-bg-ins empty"></div>
<div class="s-bg-ins empty"></div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
[/html]