Bot commit: Добавлен файл templates/competition/index.html

This commit is contained in:
Vladislav 2026-04-15 14:04:49 +02:00
parent 2cf04a12c7
commit f218d8da34

View File

@ -0,0 +1,333 @@
{% extends "base.html" %}
{% import "/components/header.html" as header %}
{% import "/components/footer.html" as footer %}
{% import "components/share.html" as share %}
{% block title %}{{competition.title}} | Участники{% endblock %}
{% block content %}
{{ header.section(user) }}
<section class="c_72077">
<div class="c_q7xgt b_vnic7">
<div class="c_w3iz6">
<div class="c_k9ibf b_6fwyq" style="grid-area: b;">
<div class="b_ornr9">
<div
style="position:absolute;inset:0;background:url('/b/competition/{{ competition.poster_file_id }}') no-repeat center/cover;filter:blur(3px)">
</div>
<picture>
<img crossorigin="anonymous" fetchpriority="high" loading="eager" alt="{{ competition.title }}" class="b_ornr9"
src="/b/competition/{{ competition.poster_file_id }}">
</picture>
</div>
</div>
<div class="c_k9ibf b_6fwyq grid_a">
<div class="c_pnig2 b_pliaa">
<a class="b_34dg0" href="/competitions">
<svg class="b_7ufh2" width="18" height="18" viewBox="0 0 18 18" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M5.86875 9.75L10.0688 13.95L9 15L3 9L9 3L10.0688 4.05L5.86875 8.25H15V9.75H5.86875Z" fill="#5F1798" />
</svg>
<span class="b_ww2ac">Назад</span>
</a>
{% if competition.get('status',-1) == 2 %}
<div class="b_thlt1_2">
<span class="b_5dr47_2">Закончился</span>
</div>
{% elif competition.get('status',-1) == 1 %}
<div class="b_thlt1_2">
<span class="b_5dr47_2">Идет отбор</span>
</div>
{% else %}
<div class="b_thlt1">
<span class="b_5dr47">Прием заявок</span>
</div>
<span class="b_sdf">До {{ (competition.date_finish.strftime('%d.%m.%Y')) if competition.date_finish else ''}}</span>
{% endif %}
</div>
<header class="c_77wsp b_qx462">
<h2 class="c_aiv78 b_6jj0l">{{competition.title}}</h2>
{% if members|length > 0 %}
<p>Участники: {{ members|length }}</p>
{% endif %}
{% if posts|length > 0 %}
<p>Картины: {{posts|length}}</p>
{% endif %}
{{ share.share('/competition/{}'.format(competition._id), competition.title, '/b/competition/{}'.format(competition.poster_file_id), "Приглашаю на конкурс 🎨") }}
</header>
</div>
<div style="grid-area: c;display: grid;gap: 10px;">
<a class="c_wcdb7 b_ofiw3" href="{% if competition.get('rules_link') %}{{competition.rules_link}}{% else %}/b/competition/{{ competition.rules_file_id }}{% endif %}" rel="noopener noreferrer">
<span class="b_j2ln2">Условия конкурса</span>
</a>
{% if competition.user._id == '681684390000000000000000'%}
<a class="c_wcdb7 b_ofiw3" href="https://vk.ru/im?sel=25126640" rel="noopener noreferrer">
<span class="b_j2ln2">Задать вопрос</span>
</a>
{% endif %}
<!-- TODO -->
{% if competition.get('status',-1) == 0%}
<a class="c_wcdb7 b_ofiw3" href="/profile/competition/{{competition._id}}#main">
<span class="b_j2ln2">Отправить заявку на конкурс</span>
</a>
{% endif %}
</div>
{% if competition.get('status',-1) < 2 and members|length > 10 %}
<div class="inptS">
<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
<path
d="M19.6 21L13.3 14.7C12.8 15.1 12.225 15.4167 11.575 15.65C10.925 15.8833 10.2333 16 9.5 16C7.68333 16 6.14583 15.3708 4.8875 14.1125C3.62917 12.8542 3 11.3167 3 9.5C3 7.68333 3.62917 6.14583 4.8875 4.8875C6.14583 3.62917 7.68333 3 9.5 3C11.3167 3 12.8542 3.62917 14.1125 4.8875C15.3708 6.14583 16 7.68333 16 9.5C16 10.2333 15.8833 10.925 15.65 11.575C15.4167 12.225 15.1 12.8 14.7 13.3L21 19.6L19.6 21ZM9.5 14C10.75 14 11.8125 13.5625 12.6875 12.6875C13.5625 11.8125 14 10.75 14 9.5C14 8.25 13.5625 7.1875 12.6875 6.3125C11.8125 5.4375 10.75 5 9.5 5C8.25 5 7.1875 5.4375 6.3125 6.3125C5.4375 7.1875 5 8.25 5 9.5C5 10.75 5.4375 11.8125 6.3125 12.6875C7.1875 13.5625 8.25 14 9.5 14Z"
fill="#1F1F1F"></path>
</svg>
<input id="memberSearch" list="membersList" type="search" placeholder="Поиск участников..."
aria-label="Поиск участников" />
<datalist id="membersList">
{% for member in members %}
<option value="{{ member.username or '' }}"></option>
{% endfor %}
</datalist>
</div>
{% endif %}
</div>
<div class="c_cnedr">
{% if competition.get('status',-1) == 2%}
{% for post in posts %}
<figure class="c_g5532 b_wcxt0">
<div class="b_1tx4m">
<picture data-link="https://kultmost.ru/artists/{{post.user._id}}" data-label="Все картины автора и стоимость">
<img crossorigin="anonymous" fetchpriority="high" loading="eager" alt="{{ post.title }}" class="b_1tx4m"
src="/b/posts/{{ post.medias[0] }}" data-src="/b/posts/{{ post.medias_original[0] }}">
</picture>
</div>
<figcaption class="c_fzh03 b_bp0ws">
<header class="c_zjvne b_tt84a">
<h2 class="c_6kn8d b_uilob">{{post.title}}</h2>
</header>
<div class="b_xz6em" ><img class="b_ob59y" src="/a/{{post.user._id}}" crossorigin="anonymous" fetchpriority="high" loading="eager">
<div class="c_9hjdk b_ffruz">
<p class="b_qla2q">{{post.city or ''}}</p>
<p class="b_09est">{{post.author}}</p>
<p class="b_qla2q">{{post.grade or ''}}</p>
</div>
</div>
<p class="c_25654 b_tqr4q">{{post.description}}</p>
<p class="c_tn4fi b_vjrwu">{{ (post._id.generation_time.strftime('%d.%m.%Y')) if post._id else ''}}</p>
</figcaption>
</figure>
{% endfor %}
{% else %}
{% for member in members %}
<a href="/competition/{{competition._id}}/{{member.user._id}}" id="{{member.user._id}}">
<div class="c_cvs7y b_bdo54">
<div class="b_rmkjd">
<img class="b_axk6u" src="/a/{{member.user._id}}" crossorigin="anonymous" fetchpriority="high" loading="eager">
<div class="b_2nlvt">
<p class="b_3dduk">{{member.user.living_place or ''}}</p>
<p class="b_d1iwe">{{member.user.username or ''}}</p>
<p class="b_10yj8">{% if 'user' in member.user.roles %}{{member.user.grade or ''}}{% endif %}</p>
</div>
</div>
<div class="b_94nsn">
<p class="b_vskv8">Картины {{member.post_count if member.post_count is not none else 0}}</p>
<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M15.1875 14.6875C16.0625 13.8125 16.5 12.75 16.5 11.5C16.5 10.25 16.0625 9.1875 15.1875 8.3125C14.3125 7.4375 13.25 7 12 7C10.75 7 9.6875 7.4375 8.8125 8.3125C7.9375 9.1875 7.5 10.25 7.5 11.5C7.5 12.75 7.9375 13.8125 8.8125 14.6875C9.6875 15.5625 10.75 16 12 16C13.25 16 14.3125 15.5625 15.1875 14.6875ZM10.0875 13.4125C9.5625 12.8875 9.3 12.25 9.3 11.5C9.3 10.75 9.5625 10.1125 10.0875 9.5875C10.6125 9.0625 11.25 8.8 12 8.8C12.75 8.8 13.3875 9.0625 13.9125 9.5875C14.4375 10.1125 14.7 10.75 14.7 11.5C14.7 12.25 14.4375 12.8875 13.9125 13.4125C13.3875 13.9375 12.75 14.2 12 14.2C11.25 14.2 10.6125 13.9375 10.0875 13.4125ZM5.35 16.9625C3.35 15.6042 1.9 13.7833 1 11.5C1.9 9.21667 3.35 7.39583 5.35 6.0375C7.35 4.67917 9.56667 4 12 4C14.4333 4 16.65 4.67917 18.65 6.0375C20.65 7.39583 22.1 9.21667 23 11.5C22.1 13.7833 20.65 15.6042 18.65 16.9625C16.65 18.3208 14.4333 19 12 19C9.56667 19 7.35 18.3208 5.35 16.9625ZM17.1875 15.5125C18.7625 14.5208 19.9667 13.1833 20.8 11.5C19.9667 9.81667 18.7625 8.47917 17.1875 7.4875C15.6125 6.49583 13.8833 6 12 6C10.1167 6 8.3875 6.49583 6.8125 7.4875C5.2375 8.47917 4.03333 9.81667 3.2 11.5C4.03333 13.1833 5.2375 14.5208 6.8125 15.5125C8.3875 16.5042 10.1167 17 12 17C13.8833 17 15.6125 16.5042 17.1875 15.5125Z" fill="#5F1798"/>
</svg>
{% if competition.type_ == 'artist' %}
{% if member.status%}
<div class="b_thlt1">
<span class="b_5dr47">Проходит</span>
</div>
{%else%}
<div class="b_thlt1_2">
<span class="b_5dr47_2">На рассмотрении</span>
</div>
{%endif%}
{% endif %}
</div>
</div>
</a>
{% endfor %}
{% endif %}
</div>
<script>
(function(){
const input = document.getElementById('memberSearch');
const container = document.querySelector('.c_cnedr');
if (!input || !container) return;
const itemsSelector = '.c_cnedr > a';
const nameSelector = '.b_d1iwe';
const norm = s => (s || '').toString().trim().toLowerCase();
function filter() {
const q = norm(input.value);
const items = container.querySelectorAll(itemsSelector);
items.forEach(a => {
const nameEl = a.querySelector(nameSelector);
const name = norm(nameEl ? nameEl.textContent : '');
a.style.display = (q === '' || name.indexOf(q) !== -1) ? '' : 'none';
});
}
input.addEventListener('input', filter);
input.addEventListener('change', filter);
input.addEventListener('keydown', (e) => { if (e.key === 'Escape') { input.value = ''; filter(); } });
filter();
})();
</script>
</div>
</section>
{{ footer.section() }}
{% endblock %}
{% block head %}
<meta hid="og:title" property="og:title" content="{{competition.title}}">
<meta hid="og:description" property="og:description" content="{{competition.short_desc}}">
<!-- <meta hid="og:type" property="og:type" content="product"> -->
<meta hid="og:image" property="og:image" content="https://avtopost.kultmost.ru/b/competition/{{competition.poster_file_id}}">
<meta hid="og:url" property="og:url" content="https://avtopost.kultmost.ru/competition/{{competition._id}}">
<meta hid="description" name="description" content="{{competition.short_desc}}">
<meta hid="og:site_name" property="og:site_name" content="Конкурсы | KULTMOST.АВТОПОСТ">
{{ header.style() }}
<style type="text/css">
.b_thlt1 { align-items: center; background: rgba(14, 214, 70, 0.20); border-radius: 30px; display: flex; justify-content: center; padding: 1.5px 10px; }
.b_5dr47 { color: #0ED646; font-family: Inter; font-size: 12px; font-style: normal; font-weight: 700; line-height: normal; }
.b_thlt1_2 { align-items: center; background: rgba(95, 23, 152, 0.20); border-radius: 30px; display: flex; justify-content: center; padding: 1.5px 10px; }
.b_5dr47_2 { color: #5F1798; font-family: Inter; font-size: 12px; font-style: normal; font-weight: 700; line-height: normal; }
.b_xz6em { align-items: center; align-self: stretch; display: flex; gap: 13px; }
.b_sdf{font-size: 12px;font-weight: bold;}
picture{overflow: hidden;}
picture>img{width: 100%;object-fit: contain;}
.b_ob59y { border-radius: 1em; height: 70px; min-width: 70px; max-width: 170px; vertical-align: top; object-fit: cover;}
.b_ffruz { align-items: flex-start; display: flex; flex-direction: column; flex: 1 0 0; justify-content: center; }
.b_qla2q { -webkit-box-orient: vertical; -webkit-line-clamp: 1; color: #000; display: -webkit-box; font-family: Inter; font-size: 13px; font-style: normal; font-weight: 400; line-height: normal; overflow: hidden; text-overflow: ellipsis; }
.b_09est { color: #000; font-family: Inter; font-size: 15px; font-style: normal; font-weight: 700; line-height: normal; }
.b_ofiw3 { align-items: center; background: #5F1798; border-radius: 5px; display: flex; justify-content: center; padding: 15px 0; width: 335px; }
.b_j2ln2 { color: #FFF; font-family: Inter; font-size: 14px; font-style: normal; font-weight: 400; line-height: normal; }
.b_itgkw { fill: #5F1798; height: 12px; width: 12px; }
.b_tsh13 { height: 18px; width: 18px; }
.b_52e6m { color: #5F1798; font-family: Inter; font-size: 12px; font-style: normal; font-weight: 700; line-height: normal; }
.b_i5j4n { align-items: center; background: rgba(95, 23, 152, 0.20); border-radius: 30px; display: flex; justify-content: center; padding: 0 10px; }
.b_ucqaf { color: #0ED646; font-family: Inter; font-size: 12px; font-style: normal; font-weight: 700; line-height: normal; }
.b_nj4pd { align-items: center; background: rgba(14, 214, 70, 0.20); border-radius: 30px; display: flex; justify-content: center; padding: 1.5px 10px; }
.b_ucqaf_2 { color: #5F1798; font-family: Inter; font-size: 12px; font-style: normal; font-weight: 700; line-height: normal; }
.b_nj4pd_2 { align-items: center; background: rgba(95, 23, 152, 0.20); border-radius: 30px; display: flex; justify-content: center; padding: 1.5px 10px; }
.b_ucqaf_3 { color: #cc1818; font-family: Inter; font-size: 12px; font-style: normal; font-weight: 700; line-height: normal; }
.b_nj4pd_3 { align-items: center; background: rgba(152, 23, 41, 0.2); border-radius: 30px; display: flex; justify-content: center; padding: 1.5px 10px; }
.b_xdnpi { align-items: flex-start; display: flex; gap: 10px; }
.b_p0rks { color: #000; font-family: Inter; font-size: 24px; font-style: normal; font-weight: 700; line-height: normal; }
.b_0j79e { align-items: center; align-self: stretch; display: flex; }
.b_erngz { align-items: flex-start; background: #FFF; border-radius: 10px; box-shadow: 0 4px 4px 0 rgba(0, 0, 0, 0.25), 0 4px 20px 0 rgba(0, 0, 0, 0.20); display: flex; flex-direction: column; gap: 10px; height: 90px; justify-content: center; padding: 10px 20px; width: 335px; }
.b_cm8eh { aspect-ratio: 1/1; border-radius: 1em; height: 70px; width: 70px; object-fit: cover;}
.b_2oew9 { color: #3A3A3A; font-family: Inter; font-size: 14px; font-style: normal; font-weight: 400; line-height: normal; width: 189px; }
.b_zjx0y { -webkit-box-orient: vertical; -webkit-line-clamp: 1; color: #000; display: -webkit-box; font-family: Inter; font-size: 16px; font-style: normal; font-weight: 700; line-height: normal; overflow: hidden; text-overflow: ellipsis; }
.b_2tocm { -webkit-box-orient: vertical; -webkit-line-clamp: 1; color: #000; display: -webkit-box; font-family: Inter; font-size: 14px; font-style: normal; font-weight: 400; line-height: normal; overflow: hidden; text-overflow: ellipsis; }
.b_wobxu { align-items: flex-start; display: flex; flex-direction: column; flex: 1 0 0; justify-content: center; }
.b_ilrcq { align-items: center; align-self: stretch; display: flex; gap: 13px; }
.b_lyhks { align-items: flex-start; background: #FFF; border-radius: 10px; box-shadow: 0 4px 4px 0 rgba(0, 0, 0, 0.25), 0 4px 20px 0 rgba(0, 0, 0, 0.20); display: flex; flex-direction: column; gap: 10px; justify-content: center; padding: 10px 20px; width: 335px; }
.b_1tx4m { align-self: stretch; border-radius: 5px; }
.b_uilob { color: #000; font-family: Inter; font-size: 24px; font-style: normal; font-weight: 700; line-height: normal; width: 315px; }
.b_tt84a { align-items: center; align-self: stretch; display: flex; justify-content: center; }
.b_tqr4q { -webkit-box-orient: vertical; -webkit-line-clamp: 3; align-self: stretch; color: rgba(58, 58, 58, 0.75); display: -webkit-box; font-family: Inter; font-size: 14px; font-style: normal; font-weight: 400; line-height: normal; overflow: hidden; text-overflow: ellipsis; }
.b_vjrwu { align-self: stretch; color: rgba(58, 58, 58, 0.75); font-family: Inter; font-size: 14px; font-style: normal; font-weight: 400; line-height: normal; text-align: right; }
.b_bp0ws { align-items: flex-start; align-self: stretch; display: flex; flex-direction: column; gap: 10px; justify-content: center; padding: 10px 20px; }
.b_wcxt0 { align-items: flex-start; background: #FDFAFF; border-radius: 5px; border: 1px solid #5F1798; box-shadow: 0 4px 4px 0 rgba(0, 0, 0, 0.25), 0 4px 20px 0 rgba(0, 0, 0, 0.20); display: flex; flex-direction: column; width: 335px; }
.b_kcdt4 { -webkit-box-orient: vertical; -webkit-line-clamp: 1; color: #000; display: -webkit-box; font-family: Inter; font-size: 24px; font-style: normal; font-weight: 700; line-height: normal; overflow: hidden; text-overflow: ellipsis; }
.b_fa8f0 { -webkit-box-orient: vertical; -webkit-line-clamp: 3; align-self: stretch; color: rgba(58, 58, 58, 0.75); display: -webkit-box; font-family: Inter; font-size: 14px; font-style: normal; font-weight: 400; line-height: normal; min-height: 51px; overflow: hidden; text-overflow: ellipsis; }
.b_n8hqw { align-items: flex-start; background: #FDFAFF; border-radius: 5px; border: 1px solid #5F1798; box-shadow: 0 4px 4px 0 rgba(0, 0, 0, 0.25), 0 4px 20px 0 rgba(0, 0, 0, 0.20); display: flex; flex-direction: column; width: 335px; }
.b_g103h { align-items: center; display: flex; flex-direction: column; flex: 1 0 0; gap: 30px; }
/* Mobile */
@media (max-width: 699px) {
.c_wcdb7 { align-items: center; background: #5F1798; border-radius: 5px; display: flex; justify-content: center; min-width: 300px; padding: 15px 0; width: 335px; }
.c_6vze6 { align-content: flex-start; align-items: flex-start; align-self: stretch; display: flex; flex-wrap: wrap; gap: 20px; justify-content: center; min-width: 300px; }
.c_g5532 { align-items: flex-start; background: #FDFAFF; border-radius: 5px; border: 1px solid #5F1798; box-shadow: 0 4px 4px 0 rgba(0, 0, 0, 0.25), 0 4px 20px 0 rgba(0, 0, 0, 0.20); display: flex; flex-direction: column; min-width: 300px; width: 335px; }
.c_fyi26 { align-content: flex-start; align-items: flex-start; align-self: stretch; display: flex; flex-wrap: wrap; gap: 20px; justify-content: center; }
.c_r75b6 { align-items: flex-start; background: #FFF; display: flex; justify-content: center; width: 375px; }
}
/* Tablet */
@media (min-width: 700px) and (max-width: 900px) {
.c_6vze6 { align-content: flex-start; align-items: flex-start; align-self: stretch; display: flex; flex-wrap: wrap; gap: 20px; padding-left: 50px; }
.c_fyi26 { align-content: flex-start; align-items: flex-start; align-self: stretch; display: flex; flex-wrap: wrap; gap: 20px; padding-left: 50px; }
.c_hku7i { align-items: flex-start; display: flex; flex-direction: column; flex: 1 0 0; gap: 30px; }
.c_r75b6 { align-items: flex-start; background: #FFF; display: flex; justify-content: center; width: 800px; }
.c_6kn8d { -webkit-box-orient: vertical; -webkit-line-clamp: 1; display: -webkit-box; overflow: hidden; text-overflow: ellipsis; }
}
/* Desktop */
@media (min-width: 901px) {
.c_ll3bc { -webkit-box-orient: vertical; -webkit-line-clamp: 1; color: #000; display: -webkit-box; font-family: Inter; font-size: 24px; font-style: normal; font-weight: 700; line-height: normal; overflow: hidden; text-overflow: ellipsis; }
.c_6vze6 { align-content: center; align-items: center; align-self: stretch; display: flex; flex-wrap: wrap; gap: 20px; padding-left: 100px; }
.c_6kn8d { -webkit-box-orient: vertical; -webkit-line-clamp: 1; color: #000; display: -webkit-box; font-family: Inter; font-size: 24px; font-style: normal; font-weight: 700; line-height: normal; overflow: hidden; text-overflow: ellipsis; }
.c_zjvne { align-items: center; align-self: stretch; display: flex; }
.c_25654 { -webkit-box-orient: vertical; -webkit-line-clamp: 3; align-self: stretch; color: rgba(58, 58, 58, 0.75); display: -webkit-box; font-family: Inter; font-size: 14px; font-style: normal; font-weight: 400; line-height: normal; min-height: 51px; overflow: hidden; text-overflow: ellipsis; }
.c_fyi26 { align-content: flex-start; align-items: flex-start; align-self: stretch; display: flex; flex-wrap: wrap; gap: 20px; padding-left: 100px; }
.c_r75b6 { align-items: flex-start; background: #FFF; display: flex; justify-content: center; width: 1600px; }
}</style>
<style type="text/css">/* Base (common) styles */
.inptS{height: 48px;display: flex;align-items: center;gap: 10px; border-bottom: 1px solid #5F1798;}
.b_x41jk { fill: #5F1798; height: 12px; width: 12px; }
.b_rroqu { height: 18px; width: 18px; }
.b_ww2ac { color: #5F1798; font-family: Inter; font-size: 12px; font-style: normal; font-weight: 700; line-height: normal; }
.b_34dg0 { align-items: center; background: rgba(95, 23, 152, 0.20); border-radius: 30px; display: flex; justify-content: center; padding: 0 10px; }
.b_5dr47 { color: #0ED646; font-family: Inter; font-size: 12px; font-style: normal; font-weight: 700; line-height: normal; }
.b_thlt1 { align-items: center; background: rgba(14, 214, 70, 0.20); border-radius: 30px; display: flex; justify-content: center; padding: 1.5px 10px; }
.b_5dr47_2 { color: #5F1798; font-family: Inter; font-size: 12px; font-style: normal; font-weight: 700; line-height: normal; }
.b_thlt1_2 { align-items: center; background: rgba(95, 23, 152, 0.20); border-radius: 30px; display: flex; justify-content: center; padding: 1.5px 10px; }
.b_pliaa { align-items: center; display: flex; gap: 10px; }
.b_6jj0l { color: #000; font-family: Inter; font-size: 24px; font-style: normal; font-weight: 700; line-height: normal; }
.b_qx462 { align-items: center; align-self: stretch; display: flex; }
.b_6fwyq { align-items: flex-start; background: #FFF; border-radius: 10px; box-shadow: 0 4px 4px 0 rgba(0, 0, 0, 0.25), 0 4px 20px 0 rgba(0, 0, 0, 0.20); display: flex; flex-direction: column; gap: 10px; justify-content: center; padding: 10px 20px; width: 335px; }
.b_j2ln2 { color: #FFF; font-family: Inter; font-size: 14px; font-style: normal; font-weight: 400; line-height: normal; }
.b_ofiw3 { align-items: center; background: #5F1798; border-radius: 5px; display: flex; justify-content: center; padding: 15px 0; width: 335px; }
.b_axk6u { aspect-ratio: 1/1; border-radius: 1em; height: 70px; width: 70px; object-fit: cover; }
.b_3dduk { color: #3A3A3A; font-family: Inter; font-size: 14px; font-style: italic; font-weight: 400; line-height: normal; }
.b_d1iwe { -webkit-box-orient: vertical; -webkit-line-clamp: 1; color: #000; display: -webkit-box; font-family: Inter; font-size: 16px; font-style: normal; font-weight: 700; line-height: normal; overflow: hidden; text-overflow: ellipsis; }
.b_10yj8 { -webkit-box-orient: vertical; -webkit-line-clamp: 1; color: #000; display: -webkit-box; font-family: Inter; font-size: 14px; font-style: normal; font-weight: 400; line-height: normal; overflow: hidden; text-overflow: ellipsis; }
.b_2nlvt { align-items: flex-start; display: flex; flex-direction: column; flex: 1 0 0; justify-content: center; }
.b_rmkjd { align-items: center; align-self: stretch; display: flex; gap: 13px; }
.b_vskv8 { color: #5F1798; font-family: Inter; font-size: 14px; font-style: normal; font-weight: 400; line-height: normal; }
.b_d6es7 { fill: #5F1798; flex-shrink: 0; height: 15px; width: 22px; }
.b_7z9xr { align-items: center; display: flex; height: 24px; justify-content: center; padding: 4px 1px 5px 1px; width: 24px; }
.b_94nsn { align-items: center; align-self: stretch; display: flex; gap: 10px; }
.b_bdo54 { align-items: flex-start; background: #FFF; border-radius: 10px; box-shadow: 0 4px 4px 0 rgba(0, 0, 0, 0.25), 0 4px 20px 0 rgba(0, 0, 0, 0.20); display: flex; flex-direction: column; gap: 10px; justify-content: center; padding: 10px 20px; width: 335px; }
.b_8ynfe { fill: #5F1798; height: 15px; width: 22px; }
.b_a36z1 { height: 24px; width: 24px; }
.b_vnic7 { align-items: center; align-self: stretch; display: flex; flex-direction: column; gap: 30px; padding: 50px 0 100px; }
.c_77wsp { align-items: baseline;display: flex;flex-direction: column; }
/* Mobile */
@media (max-width: 699px) {
.c_wcdb7 { align-items: center; background: #5F1798; border-radius: 5px; display: flex; justify-content: center; min-width: 300px; padding: 15px 0; width: 335px; }
.c_w3iz6 { align-content: center; align-items: center; align-self: stretch; display: flex; flex-wrap: wrap; gap: 20px; justify-content: center; }
.c_cnedr { align-content: flex-start; align-items: flex-start; align-self: stretch; background: #FFF; display: flex; flex-wrap: wrap; gap: 20px; justify-content: center; }
.c_72077 { align-items: center; background: #FFF; display: flex; flex-direction: column; }
}
/* Tablet */
@media (min-width: 700px) and (max-width: 900px) {
.c_k9ibf { align-items: flex-start; background: #FFF; border-radius: 10px; box-shadow: 0 4px 4px 0 rgba(0, 0, 0, 0.25), 0 4px 20px 0 rgba(0, 0, 0, 0.20); display: flex; flex-direction: column; gap: 10px; justify-content: center; padding: 10px 20px; width: 340px; }
.grid_a{grid-area: a;height: 100%;}
.c_w3iz6 { align-items: flex-start;align-self: baseline;gap: 20px;display: grid;grid-template: "b b a" auto "b b c" auto "b b c" auto; padding-left: 50px; }
.c_cvs7y { align-items: flex-start; background: #FFF; border-radius: 10px; box-shadow: 0 4px 4px 0 rgba(0, 0, 0, 0.25), 0 4px 20px 0 rgba(0, 0, 0, 0.20); display: flex; flex-direction: column; gap: 10px; justify-content: center; padding: 10px 20px; width: 340px; }
.c_cnedr { align-content: flex-start; align-items: flex-start; align-self: stretch; background: #FFF; display: flex; flex-wrap: wrap; gap: 20px; padding-left: 50px; }
.c_72077 { align-items: center; background: #FFF; display: flex; flex-direction: column; }
}
/* Desktop */
@media (min-width: 901px) {
.c_aiv78 { -webkit-box-orient: vertical; -webkit-line-clamp: 1; color: #000; display: -webkit-box; font-family: Inter; font-size: 24px; font-style: normal; font-weight: 700; line-height: normal; overflow: hidden; text-overflow: ellipsis; }
.grid_a{grid-area: a;height: 100%;}
.c_w3iz6 { align-items: flex-start;align-self: baseline;gap: 20px;padding-left: 100px;display: grid;grid-template: "b b a" auto "b b c" auto "b b c" auto;}
.c_cnedr { align-content: center; align-items: center; align-self: stretch; background: #FFF; display: flex; flex-wrap: wrap; gap: 20px; padding-left: 100px; }
.c_72077 { align-items: center; background: #FFF; display: flex; flex-direction: column; }
}</style>
{{ footer.style() }}
{% endblock %}