templates/Home/index.html.twig line 1

Open in your IDE?
  1. {% extends "layout.html.twig" %}
  3. {% block headerCss %}{% endblock %}
  4. {% block navHome %}
  5.     selected
  6. {% endblock %}
  7. {% block navHomeHamburger %}
  8.     active
  9. {% endblock %}
  10. {% block classHome %}
  11.     class="home"
  12. {% endblock %}
  14. {% block contenu %}
  15.     <section id="landing" class="bg-app-main pt-0">
  16.         <div class="container">
  17.             <div class="row">
  18.                 <div class="col-md-6">
  19.                     <div class="text-center text-md-start mt-5">
  20.                         <div class="landing__slider landing__slider-text">
  21.                             <div class="slick-item pt-5">
  22.                                 <h1 class="section__title mb-4">
  23.                                     <span class="z-index-3 position-relative">Un médecin en
  24.                                     </span>
  25.                                     <span class="decoration">
  26.                                         <img class="teleconsultation" src="{{ asset('build/images/home/teleconsultation.svg') }}" alt="téléconsultation">
  27.                                         téléconsultation
  28.                                     </span>,
  29.                                     <br class="d-none d-md-block"/>
  30.                                     <span class="z-index-3 position-relative">où que vous soyez.</span>
  31.                                 </h1>
  32.                             </div>
  33.                             <div class="slick-item pt-5">
  34.                                 <h1 class="section__title mb-4">
  35.                                     <span class="z-index-3 position-relative">Un médecin
  36.                                     </span>
  37.                                     <span class="decoration">
  38.                                         <img class="chez-vous" src="{{ asset('build/images/home/teleconsultation.svg') }}" alt="chez vous">
  39.                                         chez vous,
  40.                                     </span><br class="d-none d-md-block"/>
  41.                                     <span class="z-index-3 position-relative">où que vous soyez.</span>
  42.                                 </h1>
  43.                             </div>
  44.                         </div>
  45.                         <p class="clr-primary fs-24 ff-open-sans">Consultez maintenant ou sur rendez-vous depuis votre ordinateur ou votre smartphone.</p>
  46.                     </div>
  47.                     <div class="d-flex flex-column flex-md-row flex-wrap gap-4 mb-5 mt-5 home-btn">
  48.                         <a href="{{ path('app_commande_visio') }}" class="button button-outline-secondary">Téléconsultation
  49.                             <i class="bi bi-arrow-right"></i>
  50.                         </a>
  51.                         <a href="{{ path('app_commande_domicile') }}" class="button button-outline-secondary">Médecin à domicile
  52.                             <i class="bi bi-arrow-right"></i>
  53.                         </a>
  54.                     </div>
  55.                     <div class="d-flex flex-column align-items-center d-md-block">
  56.                         <ul class="fit-content list-unstyled fs-12 ff-open-sans" style="color:black">
  57.                             <li class="d-flex align-items-center mb-3">
  58.                                 <img class="me-2" src="{{ asset('build/images/icons/check-list-icon.svg') }}" alt="Icone Liste" width="16" height="16">
  59.                                 <p class="fs-12 ff-open-sans m-0" style="color:#03045e;font-size: 14px">Sans vous déplacer</p>
  60.                             </li>
  61.                             <li class="d-flex align-items-center mb-3">
  62.                                 <img class="me-2" src="{{ asset('build/images/icons/check-list-icon.svg') }}" alt="Icone Liste" width="16" height="16">
  63.                                 <p class="fs-12 ff-open-sans m-0" style="color:#03045e;font-size: 14px">Remboursable par la sécurité sociale</p>
  64.                             </li>
  65.                             <li class="d-flex align-items-center mb-3">
  66.                                 <img class="me-2" src="{{ asset('build/images/icons/check-list-icon.svg') }}" alt="Icone Liste" width="16" height="16">
  67.                                 <p class="fs-12 ff-open-sans m-0" style="color:#03045e;font-size: 14px">Arrêt de travail et ordonnance si nécessaire</p>
  68.                             </li>
  69.                         </ul>
  70.                     </div>
  71.                 </div>
  72.                 <div class="d-none d-md-block col-md-6">
  73.                     <div class="landing__slider landing__slider-images">
  74.                         <div class="slick-item d-block d-xl-block">
  75.                             <div class="d-flex align-items-center justify-content-center">
  76.                                 <img class="img-fluid mb-5 mb-md-0" src="{{ asset('build/images/doctor-teleconsultation-resize.png') }}" alt="Un médecin en téléconsultation, où que vous soyez." width="645" height="792">
  77.                             </div>
  78.                         </div>
  79.                         <div class="slick-item">
  80.                             <div class="d-flex align-items-center justify-content-center">
  81.                                 <img class="img-fluid d-none d-md-block mb-5 mb-md-0" src="{{ asset('build/images/doctor-at-home.svg') }}" alt="Un médecin chez vous, où que vous soyez." width="464" height="570">
  82.                                 <img class="img-fluid d-block d-md-none mb-5 mb-md-0" src="{{ asset('build/images/doctor-at-home.png') }}" alt="Un médecin chez vous, où que vous soyez." width="464" height="570">
  83.                             </div>
  84.                         </div>
  85.                     </div>
  86.                 </div>
  87.             </div>
  88.         </div>
  89.     </section>
  91.     <section class="bg-app-secondary-light">
  92.         <div class="container">
  93.             <div class="row">
  94.                 <div class="col-12 mb-4">
  95.                     <p class="text-uppercase text-center fs-20 ff-open-sans fw-semi-bold clr-primary">ILS nous font confiance</p>
  96.                 </div>
  97.             </div>
  98.             <div class="row d-none d-md-flex">
  99.                 <div class="col-xs-12 col-sm-6 col-md-2 d-flex align-items-center">
  100.                     <img class="d-block img-fluid m-center" src="{{ asset('build/images/logo/bpi.svg') }}" alt="bpi" width="150" height="60">
  101.                 </div>
  102.                 <div class="col-xs-12 col-sm-6 col-md-2 d-flex align-items-center">
  103.                     <img class="d-block img-fluid m-center" src="{{ asset('build/images/logo/tf1.png') }}" alt="TF1" width="150" height="60">
  104.                 </div>
  106.                 <div class="col-xs-12 col-sm-6 col-md-2 d-flex align-items-center">
  107.                     <img class="d-block img-fluid m-center" src="{{ asset('build/images/logo/pn-pharmavance.png') }}" alt="Pharmavance" width="250" height="52">
  108.                 </div>
  109.                 <div class="col-xs-12 col-sm-6 col-md-2 d-flex align-items-center">
  110.                     <img class="d-block img-fluid m-center" src="{{ asset('build/images/logo/pn-timihotel.png') }}" alt="Timi hotel" width="130" height="72">
  111.                 </div>
  112.                 <div class="col-xs-12 col-sm-6 col-md-2 d-flex align-items-center">
  113.                     <img class="d-block img-fluid m-center" src="{{ asset('build/images/logo/pn-french-tech.png') }}" alt="La french tech" width="110" height="72">
  114.                 </div>
  115.                 <div class="col-xs-12 col-sm-6 col-md-2 d-flex align-items-center">
  116.                     <img class="d-block img-fluid m-center" src="{{ asset('build/images/logo/smfu.png') }}" alt="smfu" width="110" height="72">
  117.                 </div>
  119.             </div>
  122.             <div id="partners-carousel" class="carousel slide d-md-none" data-bs-ride="carousel">
  123.                 <div class="carousel-inner">
  124.                     <div class="carousel-item active" data-bs-interval="10000">
  125.                         <div class="row">
  126.                             <div class="col-6 d-flex align-items-center">
  127.                                 <img class="d-block img-fluid m-center" src="{{ asset('build/images/logo/bpi.svg') }}" alt="bpi" width="154" height="44">
  128.                             </div>
  129.                             <div class="col-6 d-flex align-items-center">
  130.                                 <img class="d-block img-fluid m-center" src="{{ asset('build/images/logo/tf1.png') }}" alt="Timi hotel" width="154" height="62">
  131.                             </div>
  132.                         </div>
  133.                     </div>
  135.                     <div class="carousel-item" data-bs-interval="10000">
  136.                         <div class="row">
  137.                             <div class="col-6 d-flex align-items-center">
  138.                                 <img class="d-block img-fluid m-center" src="{{ asset('build/images/logo/pn-pharmavance.png') }}" alt="Pharmavance" width="154" height="39">
  139.                             </div>
  140.                             <div class="col-6 d-flex align-items-center">
  141.                                 <img class="d-block img-fluid m-center" src="{{ asset('build/images/logo/pn-timihotel.png') }}" alt="Timi hotel" width="130" height="72">
  142.                             </div>
  143.                         </div>
  144.                     </div>
  145.                     <div class="carousel-item" data-bs-interval="10000">
  146.                         <div class="row">
  147.                             <div class="col-6 d-flex align-items-center">
  148.                                 <img class="d-block img-fluid m-center" src="{{ asset('build/images/logo/pn-french-tech.png') }}" alt="La french tech" width="110" height="72">
  149.                             </div>
  150.                             <div class="col-6 d-flex align-items-center">
  151.                                 <img class="d-block img-fluid m-center" src="{{ asset('build/images/logo/smfu.png') }}" alt="smfu" width="110" height="72">
  153.                             </div>
  154.                         </div>
  155.                     </div>
  156.                 </div>
  157.             </div>
  158.         </div>
  159.     </section>
  161.     <section class="pb-0 bg-app-main">
  162.         <div class="container">
  163.             <div class="row">
  164.                 <div class="col-12 text-center mb-5">
  165.                     <p class="chip --info mb-2">Utilisation optimale</p>
  166.                     <h2 class="section__title">Simple,
  167.                         <span class="decoration">
  168.                             <img class="d-block d-md-block securise" style="top: 10px;" src="{{ asset('build/images/home/securise.svg') }}" alt="sécurisé" width="100" height="72">
  169.                             fiable et sécurisé
  170.                         </span>.
  171.                     </h2>
  172.                     <p class="clr-primary fs-16 ff-open-sans mb-5">C'est rapide, simple et nos docteurs sont disponibles 24h/24 et 7J/7.</p>
  173.                 </div>
  174.                 <div class="col-xs-12 col-sm-6 col-md-3">
  175.                     <div class="d-flex-column text-center clr-primary mb-5">
  176.                         <img class="feature-icon m-center mb-3" src="{{ asset('build/images/icons/toujours-disponible.svg') }}" alt="Toujours disponible" width="72" height="72">
  177.                         <p class="fs-20 ff-gentium-basic fw-bold mb-1">Toujours disponibles</p>
  178.                         <p class="fs-16 ff-open-sans">Nos docteurs sont joignables 24h/24 et 7J/7.</p>
  179.                     </div>
  180.                 </div>
  181.                 <div class="col-xs-12 col-sm-6 col-md-3">
  182.                     <div class="d-flex-column text-center clr-primary mb-5">
  183.                         <img class="feature-icon m-center mb-3" src="{{ asset('build/images/icons/donnees-securisees.svg') }}" alt="Données sécurisées" width="72" height="72">
  184.                         <p class="fs-20 ff-gentium-basic fw-bold mb-1">Données sécurisées</p>
  185.                         <p class="fs-16 ff-open-sans">Vos informations resteront toujours confidentielles.</p>
  186.                     </div>
  187.                 </div>
  188.                 <div class="col-xs-12 col-sm-6 col-md-3">
  189.                     <div class="d-flex-column text-center clr-primary mb-5">
  190.                         <img class="feature-icon m-center mb-3" src="{{ asset('build/images/icons/construit-communaute.svg') }}" alt="Construit en communauté" width="72" height="72">
  191.                         <p class="fs-20 ff-gentium-basic fw-bold mb-1">Construit en communauté</p>
  192.                         <p class="fs-16 ff-open-sans">Fondé par des professionels de la santé.</p>
  193.                     </div>
  194.                 </div>
  195.                 <div class="col-xs-12 col-sm-6 col-md-3">
  196.                     <div class="d-flex-column text-center clr-primary">
  197.                         <img class="feature-icon m-center mb-3" src="{{ asset('build/images/icons/haut-standard.svg') }}" alt="Haut standard" width="72" height="72">
  198.                         <p class="fs-20 ff-gentium-basic fw-bold mb-1">Haut standard</p>
  199.                         <p class="fs-16 ff-open-sans">Site vérifié et agréé par l’ARS et le CNIL.</p>
  200.                     </div>
  201.                 </div>
  202.             </div>
  203.         </div>
  204.     </section>
  206.     <section class="pb-0 bg-app-main">
  207.         <div class="container">
  208.             <div class="row">
  209.                 <div class="col-md-6">
  210.                     <p class="chip --info mb-3">Adapté à vos besoins</p>
  211.                     <h2 class="section__title">Votre
  212.                         <span class="decoration">
  213.                             <img class="d-block d-md-block premier" src="{{ asset('build/images/home/premier.svg') }}" alt="premier" width="110" height="10">
  214.                             premier
  215.                         </span>
  216.                         site médical
  217.                     </h2>
  218.                     <ul class="clr-primary">
  219.                         <li>
  220.                             <p class="fs-16 ff-open-sans">Une prise en charge par un médecin à domicile ou via un système de téléconsultation.</p>
  221.                         </li>
  222.                         <li>
  223.                             <p class="fs-16 ff-open-sans">Nous mettons à votre disposition des docteurs qualifiés, dont nous vérifions le profil au préalable.
  224.                             </p>
  225.                         </li>
  226.                         <li>
  227.                             <p class="fs-16 ff-open-sans">Nous vous assurons une consultation en ligne ou la venue d’un médecin , que vous ayez une affection de longue date ou depuis quelques jours seulement.</p>
  228.                         </li>
  229.                     </ul>
  230.                     <a href="{{ path('honoraire_homepage') }}" class="read-more clr-primary">En savoir plus</a>
  231.                 </div>
  232.                 <div class="col-md-6 col-md-push-1 d-flex justify-content-center justify-content-md-end">
  233.                     <img class="img-fluid d-none d-md-block" src="{{ asset('build/images/first-medical-web.svg') }}" alt="Votre premier site médical" width="464" height="450">
  234.                     <img class="img-fluid d-block d-md-none" src="{{ asset('build/images/first-medical-web.png') }}" alt="Votre premier site médical" width="464" height="450">
  235.                 </div>
  236.             </div>
  237.         </div>
  238.     </section>
  240.     <section class="pb-0 bg-app-main">
  241.         <div class="container">
  242.             <div class="row">
  243.                 <div class="col-lg-7 pt-lg-5 d-flex flex-column justify-content-center">
  244.                     <div class="text-center text-md-start">
  245.                         <p class="chip --info mt-lg-5">3 étapes simples</p>
  246.                         <h2 class="section__title">Vos téléconsultations médicales et visites à domicile en
  247.                             <span class="decoration">
  248.                                 <img class="d-block d-md-block trois" src="{{ asset('build/images/home/trois.svg') }}" alt="3">
  249.                                 3
  250.                             </span>
  251.                             étapes
  252.                             <span class="decoration">
  253.                                 <img class="d-block d-md-block simples" src="{{ asset('build/images/home/simples.svg') }}" alt="simples">
  254.                                 simples
  255.                             </span>
  256.                         </h2>
  257.                     </div>
  258.                     <div class="d-grid d-md-block mt-5 mt-md-0">
  259.                         <a href="{{ path('app_commande_visio') }}" class="button button-contained-primary">Prendre rendez-vous</a>
  260.                     </div>
  261.                 </div>
  262.                 <div class="col-lg-5">
  263.                     <div class="d-flex flex-column justify-content-center mt-5 mt-md-0">
  264.                         <button aria-label="flèche vers le haut"  class="teleconsulting-stepper-control-prev teleconsulting-stepper-control" type="button">
  265.                             <i class="bi bi-arrow-up-circle"></i>
  266.                         </button>
  267.                         <div class="teleconsulting-stepper mt-5 mt-lg-0">
  268.                             <div class="slick-item d-flex justify-content-center">
  269.                                 <div class="teleconsulting-step first">
  270.                                     <img src="{{ asset('build/images/icons/teleconsulting-step-1.svg') }}" alt="Faites une demande en ligne"/>
  271.                                     <img class="teleconsulting-step__ext" src="{{ asset('build/images/ext/ext-step.svg') }}" alt="ext-step"/>
  272.                                     <p class="teleconsulting__title">Faites une demande en ligne</p>
  273.                                     <p class="teleconsulting__desc">Dites-nous en plus sur vous. Vos informations sont enregistrées sur un serveur sécurisé et agréé Données de Santé pour garantir le secret médical.</p>
  274.                                     <span class="step">1.</span>
  275.                                 </div>
  276.                             </div>
  277.                             <div class="slick-item d-flex justify-content-center">
  278.                                 <div class="teleconsulting-step second">
  279.                                     <img src="{{ asset('build/images/icons/teleconsulting-step-2.svg') }}" alt="Consultez un médecin en quelques minutes à domicile ou en vidéo."/>
  280.                                     <img class="teleconsulting-step__ext" src="{{ asset('build/images/ext/ext-step.svg') }}" alt="ext-step"/>
  281.                                     <p class="teleconsulting__title">Consultez un médecin en quelques minutes à domicile ou en vidéo.</p>
  282.                                     <p class="teleconsulting__desc">Décrivez vos symptômes avec quelques questions; prenez rendez-vous ou patientez quelques minutes : un médecin généraliste, inscrit à l’Ordre, se déplace chez vous ou vous appelle en vidéo.</p>
  283.                                     <span class="step">2.</span>
  284.                                 </div>
  285.                             </div>
  286.                             <div class="slick-item d-flex justify-content-center">
  287.                                 <div class="teleconsulting-step third">
  288.                                     <img src="{{ asset('build/images/icons/teleconsulting-step-3.svg') }}" alt="Obtenez vos documents médicaux en ligne"/>
  289.                                     <img class="teleconsulting-step__ext" src="{{ asset('build/images/ext/ext-step.svg') }}" alt="ext-step"/>
  290.                                     <p class="teleconsulting__title">Obtenez vos documents médicaux en ligne</p>
  291.                                     <p class="teleconsulting__desc">Retrouvez le compte-rendu de vos visites à domicile et téléconsultations, vos traitements, vos arrêts de travail ou encore vos attestations sur Urgence Docteurs.</p>
  292.                                     <span class="step">3.</span>
  293.                                 </div>
  294.                             </div>
  295.                         </div>
  296.                         <button aria-label="flèche vers le bas" class="teleconsulting-stepper-control-next teleconsulting-stepper-control" type="button">
  297.                             <i class="bi bi-arrow-down-circle"></i>
  298.                         </button>
  299.                     </div>
  300.                 </div>
  301.             </div>
  302.         </div>
  303.     </section>
  305.     <section>
  306.         <div class="container">
  307.             <div class="row">
  308.                 <div class="col-12 col-md-6 offset-md-3 text-center">
  309.                     <h2 class="section__title m-0">Médecins généralistes, psychologues, psychiatres, pédiatres...</h2>
  310.                     <h2 class="section__title">Une équipe
  311.                         <span class="decoration">
  312.                             <img class="d-block d-md-block medical" src="{{ asset('build/images/home/medical.svg') }}" alt="médicale">
  313.                             médicale
  314.                         </span>
  315.                         <span class="decoration">
  316.                             <img class="d-block d-md-block complete" src="{{ asset('build/images/home/complete.svg') }}" alt="complète">
  317.                             complète
  318.                         </span>
  319.                     </h2>
  320.                     <p class="clr-primary fs-16">Consultez des médecins spécialisés, capables de vous accompagner au mieux dans votre traitement.</p>
  321.                 </div>
  322.             </div>
  323.         </div>
  324.         <div class="mt-4 mb-2">
  325.             <marquee class="d-none d-md-block" direction="right" scrollamount="10">
  326.                 <span class="chip --info --tag">
  327.                     <i class="bi bi-circle-fill"></i>Généralistes</span>
  328.                 <span class="chip --info --tag">
  329.                     <i class="bi bi-circle-fill"></i>Pédiatres</span>
  330.                 <span class="chip --info --tag">
  331.                     <i class="bi bi-circle-fill"></i>Psychiatres</span>
  332.                 <span class="chip --info --tag">
  333.                     <i class="bi bi-circle-fill"></i>Psychologues</span>
  334.                 <span class="chip --info --tag">
  335.                     <i class="bi bi-circle-fill"></i>Neurologues</span>
  336.                 <span class="chip --info --tag">
  337.                     <i class="bi bi-circle-fill"></i>Généralistes</span>
  338.                 <span class="chip --info --tag">
  339.                     <i class="bi bi-circle-fill"></i>Pédiatres</span>
  340.                 <span class="chip --info --tag">
  341.                     <i class="bi bi-circle-fill"></i>Psychiatres</span>
  342.                 <span class="chip --info --tag">
  343.                     <i class="bi bi-circle-fill"></i>Psychologues</span>
  344.                 <span class="chip --info --tag">
  345.                     <i class="bi bi-circle-fill"></i>Neurologues</span>
  346.                 <span class="chip --info --tag">
  347.                     <i class="bi bi-circle-fill"></i>Généralistes</span>
  348.                 <span class="chip --info --tag">
  349.                     <i class="bi bi-circle-fill"></i>Pédiatres</span>
  350.                 <span class="chip --info --tag">
  351.                     <i class="bi bi-circle-fill"></i>Psychiatres</span>
  352.                 <span class="chip --info --tag">
  353.                     <i class="bi bi-circle-fill"></i>Psychologues</span>
  354.                 <span class="chip --info --tag">
  355.                     <i class="bi bi-circle-fill"></i>Neurologues</span>
  356.                 <span class="chip --info --tag">
  357.                     <i class="bi bi-circle-fill"></i>Généralistes</span>
  358.                 <span class="chip --info --tag">
  359.                     <i class="bi bi-circle-fill"></i>Pédiatres</span>
  360.                 <span class="chip --info --tag">
  361.                     <i class="bi bi-circle-fill"></i>Psychiatres</span>
  362.                 <span class="chip --info --tag">
  363.                     <i class="bi bi-circle-fill"></i>Psychologues</span>
  364.                 <span class="chip --info --tag">
  365.                     <i class="bi bi-circle-fill"></i>Neurologues</span>
  366.             </marquee>
  367.             <marquee direction="right" scrollamount="8">
  368.                 <span class="chip --info --tag">
  369.                     <i class="bi bi-circle-fill"></i>Gynécologue</span>
  370.                 <span class="chip --info --tag">
  371.                     <i class="bi bi-circle-fill"></i>Sexologue</span>
  372.                 <span class="chip --info --tag">
  373.                     <i class="bi bi-circle-fill"></i>Cardiologue</span>
  374.                 <span class="chip --info --tag">
  375.                     <i class="bi bi-circle-fill"></i>Anesthésisthe</span>
  376.                 <span class="chip --info --tag">
  377.                     <i class="bi bi-circle-fill"></i>Généraliste</span>
  378.                 <span class="chip --info --tag">
  379.                     <i class="bi bi-circle-fill"></i>Urgentiste</span>
  380.                 <span class="chip --info --tag">
  381.                     <i class="bi bi-circle-fill"></i>Gynécologue</span>
  382.                 <span class="chip --info --tag">
  383.                     <i class="bi bi-circle-fill"></i>Sexologue</span>
  384.                 <span class="chip --info --tag">
  385.                     <i class="bi bi-circle-fill"></i>Cardiologue</span>
  386.                 <span class="chip --info --tag">
  387.                     <i class="bi bi-circle-fill"></i>Anesthésisthe</span>
  388.                 <span class="chip --info --tag">
  389.                     <i class="bi bi-circle-fill"></i>Généraliste</span>
  390.                 <span class="chip --info --tag">
  391.                     <i class="bi bi-circle-fill"></i>Urgentiste</span>
  392.                 <span class="chip --info --tag">
  393.                     <i class="bi bi-circle-fill"></i>Gynécologue</span>
  394.                 <span class="chip --info --tag">
  395.                     <i class="bi bi-circle-fill"></i>Sexologue</span>
  396.                 <span class="chip --info --tag">
  397.                     <i class="bi bi-circle-fill"></i>Cardiologue</span>
  398.                 <span class="chip --info --tag">
  399.                     <i class="bi bi-circle-fill"></i>Anesthésisthe</span>
  400.                 <span class="chip --info --tag">
  401.                     <i class="bi bi-circle-fill"></i>Généraliste</span>
  402.                 <span class="chip --info --tag">
  403.                     <i class="bi bi-circle-fill"></i>Urgentiste</span>
  404.                 <span class="chip --info --tag">
  405.                     <i class="bi bi-circle-fill"></i>Gynécologue</span>
  406.                 <span class="chip --info --tag">
  407.                     <i class="bi bi-circle-fill"></i>Sexologue</span>
  408.                 <span class="chip --info --tag">
  409.                     <i class="bi bi-circle-fill"></i>Cardiologue</span>
  410.                 <span class="chip --info --tag">
  411.                     <i class="bi bi-circle-fill"></i>Anesthésisthe</span>
  412.                 <span class="chip --info --tag">
  413.                     <i class="bi bi-circle-fill"></i>Généraliste</span>
  414.                 <span class="chip --info --tag">
  415.                     <i class="bi bi-circle-fill"></i>Urgentiste</span>
  416.             </marquee>
  417.         </div>
  418.         <div class="text-center mb-5 mb-md-0">
  419.             <a href="{{ path('docteur_homepage') }}" class="read-more clr-primary">En savoir plus</a>
  420.         </div>
  421.     </section>
  423.     <section class="bg-app-primary">
  424.         <div class="container">
  425.             <div class="row">
  426.                 <div class="col-md-6">
  427.                     <p class="chip --info mb-3">Remboursement</p>
  428.                     <h2 class="section__title clr-secondary">Vos téléconsultations et visites à domicile sont
  429.                         <span class="decoration">
  430.                             <img class="d-block d-md-block remboursables1" src="{{ asset('build/images/home/remboursement_1.svg') }}" alt="remboursables">
  431.                             <img class="d-block d-md-block remboursables2" src="{{ asset('build/images/home/remboursement_2.svg') }}" alt="remboursables">
  432.                             <img class="d-block d-md-block remboursables3" src="{{ asset('build/images/home/remboursement_3.svg') }}" alt="remboursables">
  433.                             remboursables, si
  434.                         </span>
  435.                         :
  436.                     </h2>
  437.                     <p class="clr-secondary fs-18 fw-bold ff-open-sans">Visites à domicile</p>
  438.                     <ul class="clr-secondary">
  439.                         <li>
  440.                             <p class="clr-secondary fs-16 ff-open-sans">Comme en cabinet, les visites à domicile réalisées sur Urgence Docteurs sont remboursables par l’Assurance Maladie.</p>
  441.                         </li>
  442.                     </ul>
  443.                     <p class="clr-secondary fs-18 fw-bold ff-open-sans">En téléconsultation</p>
  444.                     <ul class="clr-secondary">
  445.                         <li>
  446.                             <p class="clr-secondary fs-16 ff-open-sans">Si vous êtes pris en charge sur Urgence Docteurs par votre médecin traitant.</p>
  447.                         </li>
  448.                         <li>
  449.                             <p class="clr-secondary fs-16 ff-open-sans">Si votre médecin traitant est indisponible ou que vous n’en avez pas et que vous consultez un médecin par le biais d'Urgence Docteurs.</p>
  450.                         </li>
  451.                     </ul>
  452.                     <a href="{{ path('honoraire_homepage') }}" class="read-more clr-secondary-light">En savoir plus</a>
  453.                 </div>
  454.                 <div class="col-md-6 d-flex justify-content-center justify-content-md-end">
  455.                     <img class="img-fluid d-none d-md-block" src="{{ asset('build/images/refunds.svg') }}" alt="Remboursement" width="464" height="450">
  456.                     <img class="img-fluid d-block d-md-none" src="{{ asset('build/images/refunds.png') }}" alt="Remboursement" width="464" height="450">
  457.                 </div>
  458.             </div>
  459.             <div class="row">
  460.                 <div class="col-12"><br/><br/><br/></div>
  461.             </div>
  462.             <div class="row">
  463.                 <div class="order-md-last col-md-6">
  464.                     <p class="chip --info mb-3">Données sécurisées</p>
  465.                     <h2 class="section__title clr-secondary">Nos engagements pour la
  466.                         <span class="decoration">
  467.                             <img class="d-block d-md-block securite" src="{{ asset('build/images/home/securite.svg') }}" alt="sécurité">
  468.                             sécurité
  469.                         </span>
  470.                         de vos données :</h2>
  471.                     <p class="clr-secondary fs-18 fw-bold ff-open-sans">Secret médical assuré</p>
  472.                     <ul class="clr-secondary">
  473.                         <li>
  474.                             <p class="clr-secondary fs-16 ff-open-sans">Nous sommes tenus au secret médical, nous avons donc mis en place un hébergement sécurisé et des algorithmes de cryptage de vos données.</p>
  475.                         </li>
  476.                     </ul>
  477.                     <p class="clr-secondary fs-18 fw-bold ff-open-sans">Vous avez le contrôle</p>
  478.                     <ul class="clr-secondary">
  479.                         <li>
  480.                             <p class="clr-secondary fs-16 ff-open-sans">Vos données sont en sécurité, vous avez aussi le droit de nous en demander la suppression de notre base de données, en nous contactant par mail.</p>
  481.                         </li>
  482.                     </ul>
  483.                     <a href="{{ path('condition_homepage')}}" class="read-more clr-secondary-light">En savoir plus</a>
  484.                 </div>
  485.                 <div class="order-md-first col-md-6 d-flex justify-content-center justify-content-md-start">
  486.                     <img class="img-fluid d-none d-md-block" src="{{ asset('build/images/secure-data.svg') }}" alt="Données sécurisées" width="464" height="450">
  487.                     <img class="img-fluid d-block d-md-none" src="{{ asset('build/images/secure-data.png') }}" alt="Données sécurisées" width="464" height="450">
  488.                 </div>
  489.             </div>
  490.         </div>
  491.     </section>
  493.     <section id="testimonial" class="bg-app-main">
  494.         <div id="testimonial-carousel" class="carousel slide" data-bs-ride="carousel">
  495.             <div class="carousel-indicators">
  496.                 <button type="button" data-bs-target="#carouselExampleDark" data-bs-slide-to="0" class="active" aria-current="true" aria-label="Slide 1"></button>
  497.                 <button type="button" data-bs-target="#carouselExampleDark" data-bs-slide-to="1" aria-label="Slide 2"></button>
  498.                 <button type="button" data-bs-target="#carouselExampleDark" data-bs-slide-to="2" aria-label="Slide 3"></button>
  499.             </div>
  500.             <div class="carousel-inner">
  501.                 <div class="carousel-item active" data-bs-interval="10000">
  502.                     <div class="container">
  503.                         <div class="row">
  504.                             <div class="col-8 offset-2 text-center">
  505.                                 <p class="chip --info --note">
  506.                                     <img src="{{ asset('build/images/icons/star.svg') }}" alt="4,7 sur l'App Store" width="93" height="16">
  507.                                     5 sur l'App Store
  508.                                 </p>
  509.                                 <h2 class="section__title mt-5">"Très pratique et les médecins sont
  510.                                     <span class="decoration">
  511.                                         <img class="d-block d-md-block supers" src="{{ asset('build/images/home/supers.svg') }}" alt="supers">
  512.                                         supers
  513.                                     </span>,
  514.                                     <span class="decoration d-inline-block">
  515.                                         <img class="d-block d-md-block bienveillants1" src="{{ asset('build/images/home/bienveillant_1.svg') }}" alt="bienveillants" width="17" height="6">
  516.                                         <img class="d-block d-md-block bienveillants2" src="{{ asset('build/images/home/bienveillant_2.svg') }}" alt="bienveillants" width="11" height="8">
  517.                                         <img class="d-block d-md-block bienveillants3" src="{{ asset('build/images/home/bienveillant_3.svg') }}" alt="bienveillants" width="8" height="13">
  518.                                         bienveillants
  519.                                     </span>
  520.                                     et à
  521.                                     <span class="decoration">
  522.                                         <img class="d-block d-md-block ecoute" src="{{ asset('build/images/home/ecoute.svg') }}" alt="l'écoute" width="113" height="9">
  523.                                         l'écoute
  524.                                     </span>
  525.                                     !"
  526.                                 </h2>
  527.                                 <p class="clr-primary fs-16 ff-open-sans mt-5">Maha El Aoufir, utilisatrice depuis 2018.</p>
  528.                             </div>
  529.                         </div>
  530.                     </div>
  531.                 </div>
  532.                 <div class="carousel-item" data-bs-interval="10000">
  533.                     <div class="container">
  534.                         <div class="row">
  535.                             <div class="col-8 offset-2 text-center">
  536.                                 <p class="chip --info --note">
  537.                                     <img src="{{ asset('build/images/icons/star.svg') }}" alt="5 sur l'App Store" width="93" height="16">
  538.                                     5 sur l'App Store
  539.                                 </p>
  541.                                 <h2 class="section__title mt-5">"Un pédiatre
  542.                                     <span class="decoration">
  543.                                         <img class="d-block d-md-block supers" src="{{ asset('build/images/home/supers.svg') }}" alt="supers">
  544.                                         en moins de 45 minutes à Paris
  545.                                     </span>,
  546.                                     <span class="decoration d-inline-block">
  547.                                         <img class="d-block d-md-block bienveillants1" src="{{ asset('build/images/home/bienveillant_1.svg') }}" alt="bienveillants">
  548.                                         <img class="d-block d-md-block bienveillants2" src="{{ asset('build/images/home/bienveillant_2.svg') }}" alt="bienveillants">
  549.                                         <img class="d-block d-md-block bienveillants3" src="{{ asset('build/images/home/bienveillant_3.svg') }}" alt="bienveillants">
  550.                                         Médécin à l'écoute
  551.                                     </span>
  552.                                     et
  553.                                     <span class="decoration">
  554.                                         <img class="d-block d-md-block ecoute" src="{{ asset('build/images/home/ecoute.svg') }}" alt="l'écoute">
  555.                                         contentieux
  556.                                     </span>
  557.                                     !"
  558.                                 </h2>
  559.                                 <p class="clr-primary fs-16 ff-open-sans mt-5">Julien Sarfati, utilisateur depuis 2019.</p>
  560.                             </div>
  561.                         </div>
  562.                     </div>
  563.                 </div>
  564.                 <div class="carousel-item" data-bs-interval="10000">
  565.                     <div class="container">
  566.                         <div class="row">
  567.                             <div class="col-8 offset-2 text-center">
  568.                                 <p class="chip --info --note">
  569.                                     <img src="{{ asset('build/images/icons/star.svg') }}" alt="5 sur l'App Store" width="93" height="16">
  570.                                     5 sur l'App Store
  571.                                 </p>
  573.                                 <h2 class="section__title mt-5">"Le médecin
  574.                                     <span class="decoration">
  575.                                         <img class="d-block d-md-block supers" src="{{ asset('build/images/home/supers.svg') }}" alt="supers">
  576.                                         s'est  déplacé rapidement
  577.                                     </span>
  578.                                     <span class="decoration">
  579.                                         <img class="d-block d-md-block ecoute" src="{{ asset('build/images/home/ecoute.svg') }}" alt="l'écoute">
  580.                                         surtout pour un dimanche
  581.                                     </span>
  582.                                     !"
  584.                                 </h2>
  586.                                 <p class="clr-primary fs-16 ff-open-sans mt-5">Frédérique Bretel, utilisateur depuis 2018.</p>
  587.                             </div>
  588.                         </div>
  589.                     </div>
  590.                 </div>
  592.             </div>
  593.             <button aria-label="flèche vers la gauche" class="carousel-control-prev" type="button" data-bs-target="#testimonial-carousel" data-bs-slide="prev">
  594.                 <i class="bi bi-arrow-left"></i>
  595.             </button>
  596.             <button aria-label="flèche vers la droite"  class="carousel-control-next" type="button" data-bs-target="#testimonial-carousel" data-bs-slide="next">
  597.                 <i class="bi bi-arrow-right"></i>
  598.             </button>
  599.         </div>
  600.     </section>
  602.     <section class="ps-3 pe-3 ps-md-0 pe-md-0 bg-app-main" id="content-apps">
  603.         <div class="container">
  604.             <div class="row bg-app-secondary-light rounded-2 pt-5 pb-5">
  605.                 <div class="offset-md-2 col-md-8 col-12 text-center">
  606.                     <h2 class="section__title">+ de
  607.                         <span class="decoration">
  608.                             <img class="d-block d-md-block cinq" src="{{ asset('build/images/home/500000.svg') }}" alt="500 000">
  609.                             500 000
  610.                         </span>
  611.                         consultations réalisées en France.
  612.                     </h2>
  613.                     <p class="clr-primary fs-16 ff-open-sans">Que ça soit pour vous, ou pour vos enfants, notre mission est la même : vous garantir une prise en charge médicale rapide, tout en gardant le souci de la qualité.</p>
  614.                     <div class="d-flex flex-wrap justify-content-center gap-4 mt-4">
  615.                         <a href="https://apps.apple.com/fr/app/urgence-docteurs/id1278662130" target="_blank">
  616.                             <img class="store-icon" src="{{ asset('build/images/apple-store.svg') }}" alt="App store">
  617.                         </a>
  618.                         <a href="https://play.google.com/store/apps/details?id=com.app.urgencedocteurs" target="_blank">
  619.                             <img class="store-icon" src="{{ asset('build/images/google-store.svg') }}" alt="Google play">
  620.                         </a>
  621.                     </div>
  622.                 </div>
  623.             </div>
  624.             <div class="row">
  625.                 <div class="col-12"><br/><br/><br/></div>
  626.             </div>
  627.             <div class="row bg-app-secondary-light rounded-2 pt-5 pb-5">
  628.                 <div class="col-12 text-center">
  629.                     <h2 class="section__title">Consultez sans
  630.                         <span class="decoration">
  631.                             <img class="d-block d-md-block attendre1" src="{{ asset('build/images/home/attendre_1.svg') }}" alt="attendre">
  632.                             <img class="d-block d-md-block attendre2" src="{{ asset('build/images/home/attendre_2.svg') }}" alt="attendre">
  633.                             <img class="d-block d-md-block attendre3" src="{{ asset('build/images/home/attendre_3.svg') }}" alt="attendre">
  634.                             <img class="d-block d-md-block attendre4" src="{{ asset('build/images/home/attendre_4.svg') }}" alt="attendre">
  635.                             attendre
  636.                         </span>
  637.                     </h2>
  638.                     <p class="chip --info --alert mt-2 text-start">
  639.                         <i class="bi bi-exclamation-triangle"></i>
  640.                         <span class="fs-14 fw-bold text-start">Attention, en cas d’urgence immédiate, appelez le
  641.                             <span class="fw-bold text-decoration-underline">112</span>
  642.                         </span>
  643.                     </p>
  644.                     <div class="d-flex flex-column flex-md-row justify-content-center align-items-center gap-4 mt-5">
  645.                         <div class="d-flex flex-column text-start p-4 emergency-box bg-app-white">
  646.                             <img class="img-fluid feature-icon mb-4" src="{{ asset('build/images/icons/consultant-sans-attendre-1.svg') }}" alt="Consultez maintenant ou sur rendez-vous depuis votre ordinateur ou votre smartphone." width="72" height="72">
  647.                             <p class="flex-fill fs-18 ff-open-sans clr-primary">Consultez maintenant ou sur rendez-vous depuis votre ordinateur ou votre smartphone.</p>
  648.                             <a href="{{ path('app_commande_visio') }}" class="button button-outline-secondary">Obtenir une téléconsultation
  649.                                 <i class="bi bi-arrow-right"></i>
  650.                             </a>
  651.                         </div>
  652.                         <div class="d-flex flex-column text-start p-4 emergency-box bg-app-white">
  653.                             <img class="img-fluid feature-icon mb-4" src="{{ asset('build/images/icons/consultant-sans-attendre-2.svg') }}" alt="Recevez un médecin pour une consultation à domicile,  24h/24 et 7J/7" width="72" height="72">
  654.                             <p class="flex-fill fs-18 ff-open-sans clr-primary">Recevez un médecin pour une consultation à domicile,  24h/24 et 7J/7</p><br><br>
  655.                             <a href="{{ path('app_commande_domicile') }}" class="button button-outline-secondary">Recevoir un médecin à domicile
  656.                                 <i class="bi bi-arrow-right"></i>
  657.                             </a>
  658.                         </div>
  659.                     </div>
  660.                 </div>
  661.             </div>
  662.         </div>
  663.     </section>
  664. {% endblock %}
  666. {% block javascripts %}
  667.     {{ parent() }}
  668. {% endblock %}