{{define "main"}}
<section id="home" class="presentation">
    <div class="introduction">
        <div class="intro-text">
            <h1>
                {{i18n "sfcamp"}}
                <span style="color:#469198">({{i18n "div-ed"}})</span>
            </h1>
            <p>{{i18n "intro" | safeHTML}}</p>
            <div class="cta-block">
                <div class="cta">
                    <a href='{{"#about" | relLangURL}}'><button>{{i18n "about"}}</button></a>
                </div>
                <div class="dropdown cta">
                    <button onclick="myFunction()" class="dropbtn">{{i18n "apply"}}</button>
                    <div id="myDropdown" class="dropdown-content" style="padding: 5px;">
                        <button style="padding: 0px;"><a href='{{"learners" | relLangURL}}'>{{i18n "as-learner"}}<br>({{i18n "register-closed"}})</a></button>
                        <button style="padding: 0px;"><a href='{{"mentors" | relLangURL}}'>{{i18n "as-mentor"}}<br>({{i18n "register"}})</a></button>
                        <button style="padding: 0px;"><a href="#subscribe">{{i18n "subscribe-updates" | safeHTML}}</a></button>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <div class="cover">
        <img src='{{"img/landing-image.png" | absURL}}' alt="person on a bench" />
    </div>
</section>
<section id="about">
    <div class="about-section">
        <div class="about-cover">
            <img src='{{"img/example-29.svg" | absURL}}' alt="person in front of workspace" />
        </div>
        <div class="about-text">
            <h1 class="medium-heading">{{i18n "whats-sfcamp"}}</h1>
            <p class="para">{{i18n "sfcamp-desc"}}</p>
        </div>
        <div class="about-text">
            <h1 class="medium-heading">{{i18n "whats-div-ed"}}</h1>
            <p class="para">{{i18n "div-ed-desc"}}</p>
        </div>
    </div>
    <div class="tasks-section">
        <div class="task-text">
            <h1 class="medium-heading">{{i18n "what-tasks"}}</h1>
            <p class="para">{{i18n "tasks-desc"}}:</p>
        </div>
    </div>
    <div class="task-tech">
        <div class="about-cover task-cover">
            <img src='{{"img/tech.svg" | absURL}}' alt="a smartphone and a desktop computer" />
        </div>
        <div class="about-text task-block">
            <div class="block">
                <h1 class="medium-heading" style="color:#469198; text-align: center">{{i18n "tech"}}</span>
                </h1>
                <ul>
                    <li>{{i18n "programming"}}</li>
                    <li>{{i18n "sysadmin"}}</li>
                    <li>{{i18n "packaging"}}</li>
                    <li>{{i18n "forensics"}}</li>
                    <li>{{i18n "uiux"}}</li>
                </ul>
            </div>
        </div>
    </div>
    <div class="task-tech">
        <div class="about-text task-block">
            <div class="block">
                <h1 class="medium-heading" style="color:#469198; text-align: center">{{i18n "nontech"}}</span>
                </h1>
                <ul>
                    <li>{{i18n "art"}}</li>
                    <li>{{i18n "l10n"}}</li>
                    <li>{{i18n "publicity"}}</li>
                    <li>{{i18n "event-org"}}</li>
                </ul>
            </div>
        </div>
        <div class="about-cover task-cover">
            <img src='{{"img/non-tech.svg" | absURL}}' alt="infomatics and books" />
        </div>
    </div>
    <div class="about-section" style="margin-top: 10vh auto;">
        <div class="about-text">
            <h1 class="medium-heading" style="color:#469198">{{i18n "how-it-works"}}</h1>
            <p class="para">{{i18n "how-desc" | safeHTML}}</p>
        </div>
    </div>
    <div class="about-section" style="margin: 10vh auto;">
        <div class="about-cover">
            <img src='{{"img/mentor.svg" | absURL}}' alt="people planning and making things" />
        </div>
        <div class="about-text">
            <h1 class="medium-heading" style="color:#469198">{{i18n "mentors-who"}}</h1>
            <p class="para">{{i18n "mentors-desc"}}</p>
            <div class="cta">
                <a href='{{"mentors" | relLangURL}}'><button>{{i18n "about-mentorship"}}</button></a>
            </div>
        </div>
    </div>
    <div class="about-section" style="margin-bottom: 10vh auto;">
        <div class="about-text">
            <h1 class="medium-heading" style="color:#469198">{{i18n "learners-who"}}</h1>
            <p class="para">{{i18n "learners-desc"}}</p>
            <div class="cta">
                <a href='{{"learners" | relLangURL}}'><button>{{i18n "about-participation"}}</button></a>
            </div>
        </div>
        <div class="about-cover" style="display:flex; margin:auto;">
            <img src='{{"img/mentee.png" | absURL}}' alt="people trying to find things" />
        </div>
    </div>
    <div class="about-section" style="margin: 10vh auto;">
        <div id="tools" class="about-text">
            <h1 class="medium-heading" style="color: #469198">{{i18n "comm-infra"}}</h1>
            <div style="width: 100%;">
                <ul>
                    <li><a href="https://videos.fsci.in/videos/watch/b3f34489-ad2b-4cfb-956b-7a8bad799d89" target="_blank">{{i18n "bbb"}}</a> {{i18n "bbb-desc"}}</li>
                    <li><a href="https://videos.fsci.in/videos/watch/5fbd125f-d309-4eda-a4af-4009ced56f71" target="_blank">{{i18n "matrix"}}</a>/<a href="https://ravidwivedi.in/posts/xmpp-guide/">{{i18n "xmpp"}}</a>/<a href="http://www.irc.org/">{{i18n "irc"}}</a> {{i18n "im-desc"}}</li>
                    <li><a href="https://socialhub.activitypub.rocks/t/introduction-to-activitypub/508" target="_blank">{{i18n "apub"}}</a>/<a href="https://diasp.org">{{i18n "diaspora"}}</a> {{i18n "apub-desc"}}</li>
                    <li><a href="https://videos.fsci.in/videos/watch/76f79bb3-b5ca-4929-8ceb-74bb18783803" target="_blank">{{i18n "mlist"}}</a> {{i18n "mlist-desc"}}</li>
                    <li><a href="https://about.gitlab.com" target="_blank">{{i18n "gitlab"}}</a> {{i18n "gitlab-desc"}}</li>
                    <li><a href="https://joinpeertube.org" target="_blank">{{i18n "peertube"}}</a> {{i18n "peertube-desc"}}</li>
                    <li><a href="https://cryptpad.fr" target="_blank">{{i18n "cryptpad"}}</a>/<a href="https://etherpad.org/">{{i18n "etherpad"}}</a> {{i18n "pad-desc"}}</li>
                </ul>
                <p>{{i18n "infra-desc"}}</p>

                <h3>{{i18n "mailman-iframe"}}</h3>
                <iframe src="https://videos.fsci.in/videos/embed/76f79bb3-b5ca-4929-8ceb-74bb18783803" style="min-height: 400px; width: 100%;" frameborder="0" sandbox="allow-same-origin allow-scripts" allowfullscreen="allowfullscreen"></iframe>
                <h3>{{i18n "matrix-iframe"}}</h3>
                <iframe src="https://videos.fsci.in/videos/embed/5fbd125f-d309-4eda-a4af-4009ced56f71" style="min-height: 400px; width: 100%;" frameborder="0" sandbox="allow-same-origin allow-scripts" allowfullscreen="allowfullscreen"></iframe>
                <h3>{{i18n "bbb-iframe"}}</h3>
                <iframe src="https://videos.fsci.in/videos/embed/b3f34489-ad2b-4cfb-956b-7a8bad799d89" style="min-height: 400px; width: 100%;" frameborder="0" sandbox="allow-same-origin allow-scripts" allowfullscreen="allowfullscreen"></iframe>
            </div>
        </div>
    </div>
</section>
<section id="contact">
    <div class="tasks-section">
        <div id="subscribe" class="task-text">
            <p class="para" style="color:white">{{i18n "contrib-desc"}}</p>
            <h2 class="medium-heading" style="color:white">{{i18n "subscribe"}}</h2>
        </div>
        <div class="icon-row primary subscribe">
            <a id="ml-modal-open" title="Mailing List">
              <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512">
                <path fill="#ffffff" d="M494.586 164.516c-4.697-3.883-111.723-89.95-135.251-108.657C337.231 38.191 299.437 0 256 0c-43.205 0-80.636 37.717-103.335 55.859-24.463 19.45-131.07 105.195-135.15 108.549A48.004 48.004 0 0 0 0 201.485V464c0 26.51 21.49 48 48 48h416c26.51 0 48-21.49 48-48V201.509a48 48 0 0 0-17.414-36.993zM464 458a6 6 0 0 1-6 6H54a6 6 0 0 1-6-6V204.347c0-1.813.816-3.526 2.226-4.665 15.87-12.814 108.793-87.554 132.364-106.293C200.755 78.88 232.398 48 256 48c23.693 0 55.857 31.369 73.41 45.389 23.573 18.741 116.503 93.493 132.366 106.316a5.99 5.99 0 0 1 2.224 4.663V458zm-31.991-187.704c4.249 5.159 3.465 12.795-1.745 16.981-28.975 23.283-59.274 47.597-70.929 56.863C336.636 362.283 299.205 400 256 400c-43.452 0-81.287-38.237-103.335-55.86-11.279-8.967-41.744-33.413-70.927-56.865-5.21-4.187-5.993-11.822-1.745-16.981l15.258-18.528c4.178-5.073 11.657-5.843 16.779-1.726 28.618 23.001 58.566 47.035 70.56 56.571C200.143 320.631 232.307 352 256 352c23.602 0 55.246-30.88 73.41-45.389 11.994-9.535 41.944-33.57 70.563-56.568 5.122-4.116 12.601-3.346 16.778 1.727l15.258 18.526z"/>
              </svg>
                <span class="get-in-touch">{{i18n "email"}}</span>
            </a>
            <a href="https://venera.social/profile/sfcamp" target="_blank" rel="noopener" title="Friendica/Mastodon/Diaspora">
                <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 216.4144 232.00976">
                    <path stroke="#fff" stroke-width="12px" fill="#ffffff00" d="M211.80734 139.0875c-3.18125 16.36625-28.4925 34.2775-57.5625 37.74875-15.15875 1.80875-30.08375 3.47125-45.99875 2.74125-26.0275-1.1925-46.565-6.2125-46.565-6.2125 0 2.53375.15625 4.94625.46875 7.2025 3.38375 25.68625 25.47 27.225 46.39125 27.9425 21.11625.7225 39.91875-5.20625 39.91875-5.20625l.8675 19.09s-14.77 7.93125-41.08125 9.39c-14.50875.7975-32.52375-.365-53.50625-5.91875C9.23234 213.82 1.40609 165.31125.20859 116.09125c-.365-14.61375-.14-28.39375-.14-39.91875 0-50.33 32.97625-65.0825 32.97625-65.0825C49.67234 3.45375 78.20359.2425 107.86484 0h.72875c29.66125.2425 58.21125 3.45375 74.8375 11.09 0 0 32.975 14.7525 32.975 65.0825 0 0 .41375 37.13375-4.59875 62.915" />
                    <path fill="#fff" d="M177.50984 80.077v60.94125h-24.14375v-59.15c0-12.46875-5.24625-18.7975-15.74-18.7975-11.6025 0-17.4175 7.5075-17.4175 22.3525v32.37625H96.20734V85.42325c0-14.845-5.81625-22.3525-17.41875-22.3525-10.49375 0-15.74 6.32875-15.74 18.7975v59.15H38.90484V80.077c0-12.455 3.17125-22.3525 9.54125-29.675 6.56875-7.3225 15.17125-11.07625 25.85-11.07625 12.355 0 21.71125 4.74875 27.8975 14.2475l6.01375 10.08125 6.015-10.08125c6.185-9.49875 15.54125-14.2475 27.8975-14.2475 10.6775 0 19.28 3.75375 25.85 11.07625 6.36875 7.3225 9.54 17.22 9.54 29.675" />
                </svg>
                <span class="get-in-touch">{{i18n "apub"}}</span>
            </a>
            <a href="https://matrix.to/#/#sfcamp:poddery.com" target="_blank" rel="noopener" title="Matrix">
                <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="currentColor" stroke="currentColor" stroke-width="1" stroke-linecap="round" stroke-linejoin="round">
                    <path d="M.632.55v22.9H2.28V24H0V0h2.28v.55zm7.043 7.26v1.157h.033c.309-.443.683-.784 1.117-1.024.433-.245.936-.365 1.5-.365.54 0 1.033.107 1.481.314.448.208.785.582 1.02 1.108.254-.374.6-.706 1.034-.992.434-.287.95-.43 1.546-.43.453 0 .872.056 1.26.167.388.11.716.286.993.53.276.245.489.559.646.951.152.392.23.863.23 1.417v5.728h-2.349V11.52c0-.286-.01-.559-.032-.812a1.755 1.755 0 0 0-.18-.66 1.106 1.106 0 0 0-.438-.448c-.194-.11-.457-.166-.785-.166-.332 0-.6.064-.803.189a1.38 1.38 0 0 0-.48.499 1.946 1.946 0 0 0-.231.696 5.56 5.56 0 0 0-.06.785v4.768h-2.35v-4.8c0-.254-.004-.503-.018-.752a2.074 2.074 0 0 0-.143-.688 1.052 1.052 0 0 0-.415-.503c-.194-.125-.476-.19-.854-.19-.111 0-.259.024-.439.074-.18.051-.36.143-.53.282-.171.138-.319.337-.439.595-.12.259-.18.6-.18 1.02v4.966H5.46V7.81zm15.693 15.64V.55H21.72V0H24v24h-2.28v-.55z" />
                </svg>
                <span class="get-in-touch">{{i18n "matrix"}}</span>
            </a>
            <a href="xmpp:sfcamp2021-dived@groups.poddery.com?join" target="_blank" rel="noopener" title="XMPP">
                <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 1536 1792">
                    <path stroke="#fff" stroke-width="12.189" fill="#ffffff" d="M1536.002 222.059l-92.61 30.869-274.275 81.267c1.22 15.846 1.219 31.692 1.219 48.756 0 300.516-152.673 667.163-406.229 929.072-246.573-261.01-394.58-620.998-394.58-916.882 0-17.065.002-32.91 1.221-48.756l-273.039-80.9c.001-.25.008-.52.008-.766L5.082 231.81c-44.84 387.494 210.421 895.362 636.547 1191.819-117.051 93.505-250.003 164.663-395.209 201.367v28.033c72.485-9.02 142.62-23.092 210.227-41.625 104.198-26.196 203.938-66.072 297.779-116.67a1415.295 1415.295 0 0 0 40.765 22.281c1.91 1.004 3.823 1.998 5.737 2.993.414.215.827.433 1.242.648a1331.627 1331.627 0 0 0 30.285 15.215c141.163 68.79 295.978 114.462 460.988 128.129v-26.817c-153.031-38.682-292.45-115.632-413.992-216.68 450.875-294.71 703.503-800.224 656.551-1198.444z"/>
                </svg>
                <span class="get-in-touch">{{i18n "xmpp"}}</span>
            </a>
            <a href="https://kiwiirc.com/nextclient/irc.pirateirc.net:+6697/#sfcamp" target="_blank" rel="noopener" title="IRC">
                <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 576 512">
                    <path fill="#ffffff" d="M532 386.2c27.5-27.1 44-61.1 44-98.2 0-80-76.5-146.1-176.2-157.9C368.3 72.5 294.3 32 208 32 93.1 32 0 103.6 0 192c0 37 16.5 71 44 98.2-15.3 30.7-37.3 54.5-37.7 54.9-6.3 6.7-8.1 16.5-4.4 25 3.6 8.5 12 14 21.2 14 53.5 0 96.7-20.2 125.2-38.8 9.2 2.1 18.7 3.7 28.4 4.9C208.1 407.6 281.8 448 368 448c20.8 0 40.8-2.4 59.8-6.8C456.3 459.7 499.4 480 553 480c9.2 0 17.5-5.5 21.2-14 3.6-8.5 1.9-18.3-4.4-25-.4-.3-22.5-24.1-37.8-54.8zm-392.8-92.3L122.1 305c-14.1 9.1-28.5 16.3-43.1 21.4 2.7-4.7 5.4-9.7 8-14.8l15.5-31.1L77.7 256C64.2 242.6 48 220.7 48 192c0-60.7 73.3-112 160-112s160 51.3 160 112-73.3 112-160 112c-16.5 0-33-1.9-49-5.6l-19.8-4.5zM498.3 352l-24.7 24.4 15.5 31.1c2.6 5.1 5.3 10.1 8 14.8-14.6-5.1-29-12.3-43.1-21.4l-17.1-11.1-19.9 4.6c-16 3.7-32.5 5.6-49 5.6-54 0-102.2-20.1-131.3-49.7C338 339.5 416 272.9 416 192c0-3.4-.4-6.7-.7-10C479.7 196.5 528 238.8 528 288c0 28.7-16.2 50.6-29.7 64z"/>
                </svg>
                <span class="get-in-touch">{{i18n "irc"}}</span>
            </a>
            <a href="https://videos.fsci.in/accounts/sfcamp/videos" target="_blank" rel="noopener" title="Peertube">
                <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
                    <path d="M3,0v12l9-6L3,0z M3,12v12l9-6L3,12z M12,6v12l9-6L12,6z"/>
                </svg>
                <span class="get-in-touch">{{i18n "peertube"}}</span>
            </a>
        </div>
        <div class="task-text">
            <h2 id="contact-us" style="color:white">{{i18n "contact-us"}}</h2>
        </div>
        <div class="icon-row primary contact-us">
            <a href="mailto:camp@fsci.in" target="_blank" rel="noopener" title="Mail">
                <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
                    <path d="M4 4h16c1.1 0 2 .9 2 2v12c0 1.1-.9 2-2 2H4c-1.1 0-2-.9-2-2V6c0-1.1.9-2 2-2z"></path>
                    <polyline points="22,6 12,13 2,6"></polyline>
                </svg>
                <span class="get-in-touch">{{i18n "email"}}</span>
            </a>
            <a href="https://matrix.to/#/#sfcamp:poddery.com" target="_blank" rel="noopener" title="Matrix">
                <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="currentColor" stroke="currentColor" stroke-width="1" stroke-linecap="round" stroke-linejoin="round">
                    <path d="M.632.55v22.9H2.28V24H0V0h2.28v.55zm7.043 7.26v1.157h.033c.309-.443.683-.784 1.117-1.024.433-.245.936-.365 1.5-.365.54 0 1.033.107 1.481.314.448.208.785.582 1.02 1.108.254-.374.6-.706 1.034-.992.434-.287.95-.43 1.546-.43.453 0 .872.056 1.26.167.388.11.716.286.993.53.276.245.489.559.646.951.152.392.23.863.23 1.417v5.728h-2.349V11.52c0-.286-.01-.559-.032-.812a1.755 1.755 0 0 0-.18-.66 1.106 1.106 0 0 0-.438-.448c-.194-.11-.457-.166-.785-.166-.332 0-.6.064-.803.189a1.38 1.38 0 0 0-.48.499 1.946 1.946 0 0 0-.231.696 5.56 5.56 0 0 0-.06.785v4.768h-2.35v-4.8c0-.254-.004-.503-.018-.752a2.074 2.074 0 0 0-.143-.688 1.052 1.052 0 0 0-.415-.503c-.194-.125-.476-.19-.854-.19-.111 0-.259.024-.439.074-.18.051-.36.143-.53.282-.171.138-.319.337-.439.595-.12.259-.18.6-.18 1.02v4.966H5.46V7.81zm15.693 15.64V.55H21.72V0H24v24h-2.28v-.55z" />
                </svg>
                <span class="get-in-touch">{{i18n "matrix"}}</span>
            </a>
            <a href="xmpp:sfcamp2021-dived@groups.poddery.com?join" target="_blank" rel="noopener" title="XMPP">
                <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 1536 1792">
                    <path stroke="#fff" stroke-width="12.189" fill="#ffffff" d="M1536.002 222.059l-92.61 30.869-274.275 81.267c1.22 15.846 1.219 31.692 1.219 48.756 0 300.516-152.673 667.163-406.229 929.072-246.573-261.01-394.58-620.998-394.58-916.882 0-17.065.002-32.91 1.221-48.756l-273.039-80.9c.001-.25.008-.52.008-.766L5.082 231.81c-44.84 387.494 210.421 895.362 636.547 1191.819-117.051 93.505-250.003 164.663-395.209 201.367v28.033c72.485-9.02 142.62-23.092 210.227-41.625 104.198-26.196 203.938-66.072 297.779-116.67a1415.295 1415.295 0 0 0 40.765 22.281c1.91 1.004 3.823 1.998 5.737 2.993.414.215.827.433 1.242.648a1331.627 1331.627 0 0 0 30.285 15.215c141.163 68.79 295.978 114.462 460.988 128.129v-26.817c-153.031-38.682-292.45-115.632-413.992-216.68 450.875-294.71 703.503-800.224 656.551-1198.444z"/>
                </svg>
                <span class="get-in-touch">{{i18n "xmpp"}}</span>
            </a>
            <a href="https://kiwiirc.com/nextclient/irc.pirateirc.net:+6697/#sfcamp" target="_blank" rel="noopener" title="IRC">
                <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 576 512">
                    <path fill="#ffffff" d="M532 386.2c27.5-27.1 44-61.1 44-98.2 0-80-76.5-146.1-176.2-157.9C368.3 72.5 294.3 32 208 32 93.1 32 0 103.6 0 192c0 37 16.5 71 44 98.2-15.3 30.7-37.3 54.5-37.7 54.9-6.3 6.7-8.1 16.5-4.4 25 3.6 8.5 12 14 21.2 14 53.5 0 96.7-20.2 125.2-38.8 9.2 2.1 18.7 3.7 28.4 4.9C208.1 407.6 281.8 448 368 448c20.8 0 40.8-2.4 59.8-6.8C456.3 459.7 499.4 480 553 480c9.2 0 17.5-5.5 21.2-14 3.6-8.5 1.9-18.3-4.4-25-.4-.3-22.5-24.1-37.8-54.8zm-392.8-92.3L122.1 305c-14.1 9.1-28.5 16.3-43.1 21.4 2.7-4.7 5.4-9.7 8-14.8l15.5-31.1L77.7 256C64.2 242.6 48 220.7 48 192c0-60.7 73.3-112 160-112s160 51.3 160 112-73.3 112-160 112c-16.5 0-33-1.9-49-5.6l-19.8-4.5zM498.3 352l-24.7 24.4 15.5 31.1c2.6 5.1 5.3 10.1 8 14.8-14.6-5.1-29-12.3-43.1-21.4l-17.1-11.1-19.9 4.6c-16 3.7-32.5 5.6-49 5.6-54 0-102.2-20.1-131.3-49.7C338 339.5 416 272.9 416 192c0-3.4-.4-6.7-.7-10C479.7 196.5 528 238.8 528 288c0 28.7-16.2 50.6-29.7 64z"/>
                </svg>
                <span class="get-in-touch">{{i18n "irc"}}</span>
            </a>
            <a href="https://git.fosscommunity.in/community/camp/-/issues/" target="_blank" rel="noopener" title="Gitlab">
                <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
                    <path d="M22.65 14.39L12 22.13 1.35 14.39a.84.84 0 0 1-.3-.94l1.22-3.78 2.44-7.51A.42.42 0 0 1 4.82 2a.43.43 0 0 1 .58 0 .42.42 0 0 1 .11.18l2.44 7.49h8.1l2.44-7.51A.42.42 0 0 1 18.6 2a.43.43 0 0 1 .58 0 .42.42 0 0 1 .11.18l2.44 7.51L23 13.45a.84.84 0 0 1-.35.94z" />
                </svg>
                <span class="get-in-touch">{{i18n "gitlab"}}</span>
            </a>
        </div>
        <div class="icon-row secondary">
            <ul style="padding:0">
                <li>
                    <a href="https://git.fosscommunity.in/community/camp" target="_blank" rel="noopener" title="Wesbite source repo - Merge requests are welcome">
                        <svg xmlns="http://www.w3.org/2000/svg" class="icon icon-tabler icon-tabler-code" width="44" height="44" viewBox="0 0 24 24" stroke-width="1.5" stroke="#dddddd" fill="none" stroke-linecap="round" stroke-linejoin="round">
                            <path stroke="none" d="M0 0h24v24H0z" fill="none"/>
                            <polyline points="7 8 3 12 7 16" />
                            <polyline points="17 8 21 12 17 16" />
                            <line x1="14" y1="4" x2="10" y2="20" />
                        </svg>
                        <span class="get-in-touch">{{i18n "help-site"}}</span>
                    </a>
                </li>
                <li>
                    <a href="https://git.fosscommunity.in/community/camp/-/wikis/How-To-Translate" target="_blank" rel="noopener" title="See how to translate">

                        <svg xmlns="http://www.w3.org/2000/svg" class="icon icon-tabler icon-tabler-language" width="44" height="44" viewBox="0 0 24 24" stroke-width="1.5" stroke="#dddddd" fill="none" stroke-linecap="round" stroke-linejoin="round">
                            <path stroke="none" d="M0 0h24v24H0z" fill="none"/>

                            <path d="M5 7h7m-2 -2v2a5 8 0 0 1 -5 8m1 -4a7 4 0 0 0 6.7 4" />
                            <path d="M11 19l4 -9l4 9m-.9 -2h-6.2" />

                        </svg>
                        <span class="get-in-touch">{{i18n "help-translate"}}</span>
                    </a>
                </li>
            </ul>
        </div>
    </div>
</section>
<div id="ml-modal" class="modal">
  <div class="modal-content">
    <div class="modal-header">
      <span class="close close-btn">&times;</span>
      <h2>Warning</h2>
    </div>
    <div class="modal-body">
      <p class="para">Since Microsoft mail servers are rejecting our mails, contact us in case you did not receive a welcome mail from the list.</p>
      <p class="para">Mailing List Archives will show all emails posted to this Mailing List. You can read and participate using a web browser in addition to participation via email.</p>
      <div class="cta ml">
        <a href="https://lists.fsci.in/postorius/lists/camp-announce.lists.fsci.in/" class="subscribe-btn" target="_blank"><button>{{i18n "subscribe-ml"}}</button></a>
        <a href="https://lists.fsci.in/hyperkitty/list/camp-announce@lists.fsci.in/" class="subscribe-btn" target="_blank"><button>{{i18n "ml-archive"}}</button></a>
      </div>
    </div>
  </div>
<script>
  const modal = document.getElementById("ml-modal");
  const modal_btn = document.getElementById("ml-modal-open");
  const close_btn = document.getElementsByClassName("close-btn")[0];
  const subscribe_btn = document.getElementsByClassName("subscribe-btn")[0];

  modal_btn.onclick = function() {
    modal.style.display = "block";
  }

  close_btn.onclick = function() {
    modal.style.display = "none";
  }

  subscribe_btn.onclick = function() {
    modal.style.display = "none";
  }

  window.onclick = function(event) {
    if (event.target == modal) {
      modal.style.display = "none";
    }
  }
</script>
{{end}}