{% extends "layout.html.j2" %}
{% set active_page="home/" %}

{% block main %}
    {# <div style="height: 5em; display: block;"></div> #}
<header class= "bg-light">
  <div class="container container--padding">
    <img src="/static/images/cara_full_text.png" class="logo d-block m-auto" id="desktop_logo">
    <img src="/static/images/cara_full_logo.png" class="logo d-none m-auto" id="mobile_logo">
  </div>
</header>
   
<div class="container container--padding">
  <div class="d-flex mb-3 justify-content-center" id="calculator_app_button">
    <div><a href="{{ calculator_prefix }}" role="button" class="btn btn-outline-primary"><div class="d-flex d-row"><i class="icon-calculator"></i><span class="pl-1">Calculator</div></a></div>
  </div>
  <div class="split">
    <div class="col-lg-8 col-md-7 pl-0">
      <h2 class="paragraph-title">Introduction</h2><br>
      <div>
          <p>
          CARA is a risk assessment tool developed to model the concentration of viruses in enclosed spaces, in order to inform space-management decisions.
          It does this by simulating the long-range airborne spread SARS-CoV-2 virus in a finite volume, assuming homogenous mixing, and it estimates the risk of COVID-19 airborne transmission therein.
          Please see the <a href="/about">About</a> page for more details on the methodology, assumptions and limitations of CARA.
          </p>
          <p>
          The full CARA source code can be accessed freely under an Apache 2.0 open source license from our <a href="https://gitlab.cern.ch/cara/cara">code repository</a>.
          It includes detailed instructions on how to run your own version of this tool.
          </p>
          <br>
      </div>
    </div>
    <div class="align-self-center">
      <img src="static/images/CARA_1_Vs3_Colour.jpg" class="cara_home_image">
    </div>
  </div>
  <br>
  
  <div id="apps_section" class="d-none">
    <div class="d-flex flex-row" >
      <h2 class="paragraph-title pr-4 align-self-center">Apps:</h2>
      <br>
      <div class="pr-3"><a href="{{ calculator_prefix }}" role="button" class="btn btn-lg btn-outline-primary"><div class="d-flex d-row"><i class="icon-calculator"></i><span class="pl-2">Calculator</div></a></div>
      <br>
      <div class="expert_app_button"><a href="https://cara.web.cern.ch/expert-app" role="button" class="btn btn-lg btn-outline-secondary"><div class="d-flex d-row"><i class="icon-expert"></i><span class="pl-2">Expert (beta)</div></a></div>
    </div>
    <hr width="95%">
  </div>

  {% block cara_at_cern %}
  {% endblock cara_at_cern %}
  
  <br>
  <h3 class="paragraph-title">Acknowledgements</h3><br>
  {{ text_blocks['Acknowledgements'] }}
  <span style="height: 3vh; display: block;"></span>
  </div>
</div>
{% endblock main %}
