templates/default/home.html.twig line 1

Open in your IDE?
  1. {% extends 'default/website-base.html.twig' %}
  3. {% block body %}
  5.         <header class="navbar navbar-sticky navbar-expand-lg navbar-dark">
  6.             <div class="container position-relative">
  7.                 {% if container.getConfiguration and container.getConfiguration.topImage %}
  8.                     <a class="navbar-brand" href="{{ path('home') }}">
  9.                         <img class="navbar-brand-sticky" src="{{ asset(vich_uploader_asset(container.getConfiguration,'top_image_file')) }}" alt="sticky brand-logo" style="max-width: 120px; max-height: 60px;">
  10.                     </a>
  11.                 {% endif %}
  12.                 <button class="navbar-toggler d-lg-none" type="button" data-toggle="navbarToggler" aria-label="Toggle navigation">
  13.                     <span class="navbar-toggler-icon"></span>
  14.                 </button>
  16.                 <div class="navbar-inner">
  17.                     <button class="navbar-toggler d-lg-none" type="button" data-toggle="navbarToggler" aria-label="Toggle navigation">
  18.                         <span class="navbar-toggler-icon"></span>
  19.                     </button>
  20.                     <nav>
  21.                         <ul class="navbar-nav" id="navbar-nav">
  22.                             <li class="nav-item">
  23.                                 <a class="nav-link scroll" href="#home">Início</a>
  24.                             </li>
  25.                             <li class="nav-item">
  26.                                 <a class="nav-link scroll" href="#features">Vantagens</a>
  27.                             </li>
  28.                             <li class="nav-item">
  29.                                 <a class="nav-link scroll" href="#howitworks">Como funciona</a>
  30.                             </li>
  31.                             <li class="nav-item">
  32.                                 <a class="nav-link scroll" href="#faq">Perguntas frequentes</a>
  33.                             </li>
  34.                             <li class="nav-item">
  35.                                 <a class="nav-link" href="{{ path('hiring') }}">Seja parceiro</a>
  36.                             </li>
  37.                             <li class="nav-item">
  38.                                 <a class="nav-link scroll" href="#contact">Fale conosco</a>
  39.                             </li>
  40.                         </ul>
  41.                     </nav>
  42.                 </div>
  43.             </div>
  44.         </header>
  46.         <section id="home" class="section welcome-area bg-overlay overflow-hidden d-flex align-items-center">
  47.             <div class="container">
  48.                 <div class="row align-items-center">
  49.                     <div class="col-12 col-md-7 col-lg-6">
  50.                         <div class="welcome-intro">
  51.                             {% if container.getConfiguration and container.getConfiguration.landingTitle %}
  52.                                 <h1 class="text-white">{{ container.getConfiguration.landingTitle ? container.getConfiguration.landingTitle|raw : '' }}</h1>
  53.                             {% endif %}
  54.                             {% if container.getConfiguration and container.getConfiguration.landingSubtitle %}
  55.                                 <p class="text-white my-4">{{ container.getConfiguration.landingSubtitle ? container.getConfiguration.landingSubtitle|raw : '' }}</p>
  56.                             {% endif %}
  57.                             <div class="button-group store-buttons d-flex">
  58.                                 {% if container.getConfiguration and container.getConfiguration.android %}
  59.                                     <a target="_blank" href="{{ container.getConfiguration.android ? container.getConfiguration.android : '#' }}">
  60.                                         <img src="{{ asset('front/assets/img/icon-google-play-mono-white.png') }}" alt="">
  61.                                     </a>
  62.                                 {% endif %}
  63.                                 {% if container.getConfiguration and container.getConfiguration.ios %}
  64.                                     <a target="_blank" href="{{ container.getConfiguration.ios ? container.getConfiguration.ios : '#' }}">
  65.                                         <img src="{{ asset('front/assets/img/icon-app-store-mono-white-2.png') }}" alt="">
  66.                                     </a>
  67.                                 {% endif %}
  68.                             </div>
  69.                             <span class="d-inline-block text-white fw-3 font-italic mt-3">* Disponível para iPhone e dispositivos Android</span>
  70.                         </div>
  71.                     </div>
  72.                     <div class="col-12 col-md-5 col-lg-6">                        
  73.                         <div class="welcome-thumb mx-auto" data-aos="fade-left" data-aos-delay="500" data-aos-duration="1000">
  74.                             {% if container.getConfiguration and container.getConfiguration.landingAppImage %}
  75.                                 <img src="{{ asset(vich_uploader_asset(container.getConfiguration,'landing_app_image_file')) }}" alt="">
  76.                             {% else %}
  77.                                 <img src="{{ asset('files/welcome-mockup.png') }}" alt="">
  78.                             {% endif %}
  79.                         </div>
  80.                     </div>
  81.                 </div>
  82.             </div>
  84.             <div class="shape-bottom">
  85.                 <svg viewBox="0 0 1920 310" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="svg replaced-svg">
  86.                     {% if container.getConfiguration and container.getConfiguration.name %}
  87.                         <title>{{ container.getConfiguration.name }}</title>
  88.                     {% endif %}
  89.                     <desc>Feito por DEX Soluções</desc>
  90.                     <defs></defs>
  91.                     <g id="sApp-Landing-Page" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
  92.                         <g id="sApp-v1.0" transform="translate(0.000000, -554.000000)" fill="#FFFFFF">
  93.                             <path d="M-3,551 C186.257589,757.321118 319.044414,856.322454 395.360475,848.004007 C509.834566,835.526337 561.525143,796.329212 637.731734,765.961549 C713.938325,735.593886 816.980646,681.910577 1035.72208,733.065469 C1254.46351,784.220361 1511.54925,678.92359 1539.40808,662.398665 C1567.2669,645.87374 1660.9143,591.478574 1773.19378,597.641868 C1848.04677,601.75073 1901.75645,588.357675 1934.32284,557.462704 L1934.32284,863.183395 L-3,863.183395" id="sApp-v1.0"></path>
  94.                         </g>
  95.                     </g>
  96.                 </svg>
  97.             </div>
  98.         </section>
  100.         {#<!-- ***** Counter Area Start ***** -->
  101.         <section class="section counter-area ptb_50">
  102.             <div class="container">
  103.                 <div class="row justify-content-center">
  104.                     <div class="col-5 col-sm-3 single-counter text-center">
  105.                         <div class="counter-inner p-3 p-md-0">
  106.                             <!-- Counter Item -->
  107.                             <div class="counter-item d-inline-block mb-3">
  108.                                 <span class="counter fw-7">10</span><span class="fw-7">M</span>
  109.                             </div>
  110.                             <h5>Users</h5>
  111.                         </div>
  112.                     </div>
  113.                     <div class="col-5 col-sm-3 single-counter text-center">
  114.                         <div class="counter-inner p-3 p-md-0">
  115.                             <!-- Counter Item -->
  116.                             <div class="counter-item d-inline-block mb-3">
  117.                                 <span class="counter fw-7">23</span><span class="fw-7">K</span>
  118.                             </div>
  119.                             <h5>Download</h5>
  120.                         </div>
  121.                     </div>
  122.                     <div class="col-5 col-sm-3 single-counter text-center">
  123.                         <div class="counter-inner p-3 p-md-0">
  124.                             <!-- Counter Item -->
  125.                             <div class="counter-item d-inline-block mb-3">
  126.                                 <span class="counter fw-7">9</span><span class="fw-7">M</span>
  127.                             </div>
  128.                             <h5>Customer</h5>
  129.                         </div>
  130.                     </div>
  131.                     <div class="col-5 col-sm-3 single-counter text-center">
  132.                         <div class="counter-inner p-3 p-md-0">
  133.                             <!-- Counter Item -->
  134.                             <div class="counter-item d-inline-block mb-3">
  135.                                 <span class="counter fw-7">12</span><span class="fw-7">K</span>
  136.                             </div>
  137.                             <h5>Developer</h5>
  138.                         </div>
  139.                     </div>
  140.                 </div>
  141.             </div>
  142.         </section>
  143.         <!-- ***** Counter Area End ***** -->#}
  145.         {% if advantages|length > 0 %}
  146.         <section id="features" class="section features-area style-two overflow-hidden ptb_100">
  147.             <div class="container">
  148.                 <div class="row justify-content-center">
  149.                     <div class="col-12 col-md-10 col-lg-7">
  150.                         <div class="section-heading text-center">
  151.                             {#<span class="d-inline-block rounded-pill shadow-sm fw-5 px-4 py-2 mb-3">
  152.                                 <i class="far fa-lightbulb text-primary mr-1"></i>
  153.                                 <span class="text-primary">Premium</span>Features
  154.                             </span>#}
  155.                             <h2>Vantagens</h2>
  156.                             {% if container.getConfiguration and container.getConfiguration.advantagesSubtitle %}
  157.                                 <p class="d-none d-sm-block mt-4">{{ container.getConfiguration.advantagesSubtitle ? container.getConfiguration.advantagesSubtitle|raw : '' }}</p>
  158.                                 <p class="d-block d-sm-none mt-4">{{ container.getConfiguration.advantagesSubtitle ? container.getConfiguration.advantagesSubtitle|raw : '' }}</p>
  159.                             {% endif %}
  160.                         </div>
  161.                     </div>
  162.                 </div>
  163.                 <div class="row">
  164.                     {% set count = 0 %}
  165.                     {% for advantage in advantages %}
  166.                         <div class="col-12 col-md-6 col-lg-3 res-margin">
  167.                             <div class="image-box text-center icon-1 p-5 wow fadeInLeft" data-wow-delay="0.4s">
  168.                                 <div class="featured-img mb-3">
  169.                                     {% if advantage.image %}
  170.                                         <img class="avatar-sm" src="{{ asset(vich_uploader_asset(advantage,'imageFile')) }}" alt="">
  171.                                     {% endif %}
  172.                                 </div>
  173.                                 <div class="icon-text">
  174.                                     <h3 class="mb-2">{{ advantage.title|raw }}</h3>
  175.                                     <p>{{ advantage.description|raw }}</p>
  176.                                 </div>
  177.                             </div>
  178.                         </div>
  179.                         {% set count = count + 1 %}
  180.                         {% if count >= 4 %}
  181.                             {% set count = 0 %}
  182.                             <div class="col-12 col-md-6 col-lg-12 res-margin">
  183.                                 <br><br><br>
  184.                             </div>
  185.                         {% endif %}
  186.                     {% endfor %}
  187.                 </div>
  188.             </div>
  189.         </section>
  190.         {% endif %}
  192.         {#<section class="section service-area bg-gray overflow-hidden ptb_100">
  193.             <div class="container">
  194.                 <div class="row justify-content-between">
  195.                     <div class="col-12 col-lg-6 order-2 order-lg-1">
  196.                         <div class="service-text pt-4 pt-lg-0">
  197.                             <h2 class="mb-4">Relaxa! Deixa que a gente faz tudo por você</h2>
  198.                             <ul class="service-list">
  199.                                 <li class="single-service media py-2">
  200.                                     <div class="service-icon pr-4">
  201.                                         <span><i class="fab fa-buffer"></i></span>
  202.                                     </div>
  203.                                     <div class="service-text media-body">
  204.                                         <p>Serviços gerais de manutenção para sua casa como pintura, hidráulico, manutenção de ar-condicionados, chaveiros, eletricista e muito mais.</p>
  205.                                     </div>
  206.                                 </li>
  207.                                 <li class="single-service media py-2">
  208.                                     <div class="service-icon pr-4">
  209.                                         <span><i class="fas fa-magic"></i></span>
  210.                                     </div>
  211.                                     <div class="service-text media-body">
  212.                                         <p>Criamos uma categoria especial para beleza onde você poderá contar com serviços de cabeleleiro, maquiagem, barberia, manicure e pedicure.</p>
  213.                                     </div>
  214.                                 </li>
  215.                                 <li class="single-service media py-2">
  216.                                     <div class="service-icon pr-4">
  217.                                         <span><i class="fas fa-home"></i></span>
  218.                                     </div>
  219.                                     <div class="service-text media-body">
  220.                                         <p>Precisa de uma faxina? Deixa que a gente faz! No Tudo em casa você pode solicitar faxina para sua quitinete, apartamento, casa ou escritório. Simples assim!</p>
  221.                                     </div>
  222.                                 </li>
  223.                                 <li class="single-service media py-2">
  224.                                     <div class="service-icon pr-4">
  225.                                         <span><i class="fas fa-calendar"></i></span>
  226.                                     </div>
  227.                                     <div class="service-text media-body">
  228.                                         <p>Escolha o serviço na data e hora que quiser. O Tudo em casa quer te atender quando for melhor para você.</p>
  229.                                     </div>
  230.                                 </li>
  231.                                 <li class="single-service media py-2">
  232.                                     <div class="service-icon pr-4">
  233.                                         <span><i class="fas fa-credit-card"></i></span>
  234.                                     </div>
  235.                                     <div class="service-text media-body">
  236.                                         <p>Não precisa ter dinheiro trocado em casa para solicitar nosso atendimento. Você pode pagar com o cartão de crédito através do app.</p>
  237.                                     </div>
  238.                                 </li>
  239.                             </ul>
  240.                             <a href="#" class="btn btn-bordered mt-4">Learn More</a>
  241.                         </div>
  242.                     </div>
  243.                     <div class="col-12 col-lg-6 order-1 order-lg-2 d-none d-lg-block">
  244.                         <div class="service-thumb mx-auto">
  245.                             <img src="{{ asset('front/assets/img/athome.png') }}" alt="" style="margin-top: 80px;">
  246.                         </div>
  247.                     </div>
  248.                 </div>
  249.             </div>
  250.         </section>
  252.         <section class="section discover-area overflow-hidden ptb_100">
  253.             <div class="container">
  254.                 <div class="row justify-content-between">
  255.                     <div class="col-12 col-lg-6 order-2 order-lg-1">
  256.                         <div class="service-thumb discover-thumb mx-auto pt-5 pt-lg-0">
  257.                             <img src="{{ asset('front/assets/img/welcome/work-with-us.png') }}" alt="">
  258.                         </div>
  259.                     </div>
  260.                     <div class="col-12 col-lg-6 order-1 order-lg-2">
  261.                         <div class="discover-text pt-4 pt-lg-0">
  262.                             <h2 class="pb-4 pb-sm-0">Quer trabalhar conosco?</h2>
  263.                             <p class="d-none d-sm-block pt-3 pb-4">Tenha flexibilidade para trabalhar o quanto quiser, em qualquer horário, sem se preocupar com a captação de clientes. Só precisamos ajustar algumas coisas:</p>
  264.                             <ul class="check-list">
  265.                                 <li class="py-1">
  266.                                     <div class="list-box media">
  267.                                         <span class="icon align-self-center"><i class="fas fa-check"></i></span>
  268.                                         <span class="media-body pl-2">Todos os profissionais passam por um processo de seleção e recebem treinamento presencial para participar da plataforma.</span>
  269.                                     </div>
  270.                                 </li>
  271.                                 <li class="py-1">
  272.                                     <div class="list-box media">
  273.                                         <span class="icon align-self-center"><i class="fas fa-check"></i></span>
  274.                                         <span class="media-body pl-2">Todo serviço executado será avaliado e uma boa avaliação é o que faz nossa parceria funcionar.</span>
  275.                                     </div>
  276.                                 </li>
  277.                                 <li class="py-1">
  278.                                     <div class="list-box media">
  279.                                         <span class="icon align-self-center"><i class="fas fa-check"></i></span>
  280.                                         <span class="media-body pl-2">Sem essa de esperar o fim do mês! Ganhe dinheiro a cada serviço executado.</span>
  281.                                     </div>
  282.                                 </li>
  283.                                 <li class="py-1">
  284.                                     <div class="list-box media">
  285.                                         <span class="icon align-self-center"><i class="fas fa-check"></i></span>
  286.                                         <span class="media-body pl-2">Você é o seu próprio chefe! Você é totalmente livre para trablhar só quando quiser, sem metas para cumprir.</span>
  287.                                     </div>
  288.                                 </li>
  289.                                 <li class="py-1">
  290.                                     <!-- List Box -->
  291.                                     <div class="list-box media">
  292.                                         <span class="icon align-self-center"><i class="fas fa-check"></i></span>
  293.                                         <span class="media-body pl-2">Aceitou, executou, ganhou!</span>
  294.                                     </div>
  295.                                 </li>
  296.                             </ul>
  297.                             <a href="{{ path('hiring') }}" class="btn btn-bordered mt-4">Quero trabalhar!</a>
  298.                             <div class="icon-box d-flex mt-3">
  299.                                 <div class="service-icon">
  300.                                     <span><i class="fas fa-bell"></i></span>
  301.                                 </div>
  302.                                 <div class="service-icon px-3">
  303.                                     <span><i class="fas fa-envelope-open"></i></span>
  304.                                 </div>
  305.                                 <div class="service-icon">
  306.                                     <span><i class="fas fa-video"></i></span>
  307.                                 </div>
  308.                             </div>
  309.                         </div>
  310.                     </div>
  311.                 </div>
  312.             </div>
  313.         </section>#}
  315.         {% if how_it_works|length > 0 %}
  316.         <section id="howitworks" class="section work-area bg-overlay overflow-hidden ptb_100">
  317.             <div class="container">
  318.                 <div class="row justify-content-center">
  319.                     <div class="col-12 col-lg-6">
  320.                         <div class="work-content text-center">
  321.                             <h2 class="text-white">Como funciona?</h2>
  322.                             {% if container.getConfiguration and container.getConfiguration.howItWorksSubtitle %}
  323.                                 <p class="text-white my-3 mt-sm-4 mb-sm-5">{{ container.getConfiguration.howItWorksSubtitle ? container.getConfiguration.howItWorksSubtitle|raw : '' }}</p>
  324.                             {% endif %}
  325.                         </div>
  326.                     </div>
  327.                 </div>
  328.                 <div class="row">
  329.                     {% for how_it_work in how_it_works %}
  330.                         <div class="col-12 col-md-4">
  331.                             <div class="single-work text-center p-3">
  332.                                 <div class="work-icon">
  333.                                     {% if how_it_work.image %}
  334.                                         <img class="avatar-md" src="{{ asset(vich_uploader_asset(how_it_work,'imageFile')) }}" alt="">
  335.                                     {% endif %}
  336.                                 </div>
  337.                                 <h3 class="text-white py-3">{{ how_it_work.title|raw }}</h3>
  338.                                 <p class="text-white">{{ how_it_work.description|raw }}</p>
  339.                             </div>
  340.                         </div>
  341.                     {% endfor %}
  342.                 </div>
  343.             </div>
  344.         </section>
  345.         {% endif %}
  347.         {% if screens|length > 0 %}
  348.         <section id="screenshots" class="section screenshots-area ptb_100">
  349.             <div class="container">
  350.                 <div class="row justify-content-center">
  351.                     <div class="col-12 col-md-10 col-lg-7">
  352.                         <div class="section-heading text-center">
  353.                             {#<span class="d-inline-block rounded-pill shadow-sm fw-5 px-4 py-2 mb-3">
  354.                                 <i class="far fa-lightbulb text-primary mr-1"></i>
  355.                                 <span class="text-primary">Awesome</span>Interface
  356.                             </span>#}
  357.                             <h2 class="text-capitalize">Interface simples </h2>
  358.                             {% if container.getConfiguration and container.getConfiguration.appSubtitle %}
  359.                                 <p class="d-none d-sm-block mt-4">{{ container.getConfiguration.appSubtitle ? container.getConfiguration.appSubtitle|raw : '' }}</p>
  360.                                 <p class="d-block d-sm-none mt-4">{{ container.getConfiguration.appSubtitle ? container.getConfiguration.appSubtitle|raw : '' }}</p>
  361.                             {% endif %}
  362.                         </div>
  363.                     </div>
  364.                 </div>
  365.                 <div class="row">
  366.                     <div class="col-12">
  367.                         <div class="app-screenshots">
  368.                             {% for screen in screens %}
  369.                                 <div class="single-screenshot">
  370.                                     <img src="{{ asset(vich_uploader_asset(screen,'imageFile')) }}" alt="">
  371.                                 </div>
  372.                             {% endfor %}
  373.                         </div>
  374.                     </div>
  375.                 </div>
  376.             </div>
  377.         </section>
  378.         {% endif %}
  380.         {#<!-- ***** Review Area Start ***** -->
  381.         <section id="review" class="review-area ptb_100">
  382.             <div class="container">
  383.                 <div class="row justify-content-center">
  384.                     <div class="col-12 col-md-10 col-lg-8">
  385.                         <!-- Section Heading -->
  386.                         <div class="section-heading text-center">
  387.                             <span class="d-inline-block rounded-pill shadow-sm fw-5 px-4 py-2 mb-3">
  388.                                 <i class="far fa-lightbulb text-primary mr-1"></i>
  389.                                 <span class="text-primary">Customer's</span>
  390.                                 Reviews
  391.                             </span>
  392.                             <h2 class="text-capitalize">What our customers are saying</h2>
  393.                             <p class="d-none d-sm-block mt-4">Lorem ipsum dolor sit amet, consectetur adipisicing elit. Laborum obcaecati dignissimos quae quo ad iste ipsum officiis deleniti asperiores sit.</p>
  394.                             <p class="d-block d-sm-none mt-4">Lorem ipsum dolor sit amet, consectetur adipisicing elit. Laborum obcaecati.</p>
  395.                         </div>
  396.                     </div>
  397.                 </div>
  398.                 <div class="row">
  399.                     <div class="col-12 col-md-6 col-lg-4 res-margin">
  400.                         <!-- Single Review -->
  401.                         <div class="single-review card">
  402.                             <!-- Card Top -->
  403.                             <div class="card-top p-4">
  404.                                 <div class="review-icon">
  405.                                     <i class="fas fa-star text-warning"></i>
  406.                                     <i class="fas fa-star text-warning"></i>
  407.                                     <i class="fas fa-star text-warning"></i>
  408.                                     <i class="fas fa-star text-warning"></i>
  409.                                     <i class="fas fa-star text-warning"></i>
  410.                                 </div>
  411.                                 <h4 class="text-primary mt-4 mb-3">Excellent service &amp; support!!</h4>
  412.                                 <!-- Review Text -->
  413.                                 <div class="review-text">
  414.                                     <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Quis nam id facilis, provident doloremque placeat eveniet molestias laboriosam. Optio, esse.</p>
  415.                                 </div>
  416.                                 <!-- Quotation Icon -->
  417.                                 <div class="quot-icon">
  418.                                     <img class="avatar-md" src="{{ asset('front/assets/img/icon/quote.png') }}" alt="">
  419.                                 </div>
  420.                             </div>
  421.                             <!-- Reviewer -->
  422.                             <div class="reviewer media bg-gray p-4">
  423.                                 <!-- Reviewer Thumb -->
  424.                                 <div class="reviewer-thumb">
  425.                                     <img class="avatar-lg radius-100" src="{{ asset('front/assets/img/avatar/avatar-1.png') }}" alt="">
  426.                                 </div>
  427.                                 <!-- Reviewer Media -->
  428.                                 <div class="reviewer-meta media-body align-self-center ml-4">
  429.                                     <h5 class="reviewer-name color-primary mb-2">Junaid Hasan</h5>
  430.                                     <h6 class="text-secondary fw-6">CEO, Themeland</h6>
  431.                                 </div>
  432.                             </div>
  433.                         </div>
  434.                     </div>
  435.                     <div class="col-12 col-md-6 col-lg-4 res-margin">
  436.                         <!-- Single Review -->
  437.                         <div class="single-review card">
  438.                             <!-- Card Top -->
  439.                             <div class="card-top p-4">
  440.                                 <div class="review-icon">
  441.                                     <i class="fas fa-star text-warning"></i>
  442.                                     <i class="fas fa-star text-warning"></i>
  443.                                     <i class="fas fa-star text-warning"></i>
  444.                                     <i class="fas fa-star text-warning"></i>
  445.                                     <i class="fas fa-star-half-alt text-warning"></i>
  446.                                 </div>
  447.                                 <h4 class="text-primary mt-4 mb-3">Nice work! Keep it up</h4>
  448.                                 <!-- Review Text -->
  449.                                 <div class="review-text">
  450.                                     <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Quis nam id facilis, provident doloremque placeat eveniet molestias laboriosam. Optio, esse.</p>
  451.                                 </div>
  452.                                 <!-- Quotation Icon -->
  453.                                 <div class="quot-icon">
  454.                                     <img class="avatar-md" src="{{ asset('front/assets/img/icon/quote.png') }}" alt="">
  455.                                 </div>
  456.                             </div>
  457.                             <!-- Reviewer -->
  458.                             <div class="reviewer media bg-gray p-4">
  459.                                 <!-- Reviewer Thumb -->
  460.                                 <div class="reviewer-thumb">
  461.                                     <img class="avatar-lg radius-100" src="{{ asset('assets/img/avatar/avatar-2.png') }}" alt="">
  462.                                 </div>
  463.                                 <!-- Reviewer Media -->
  464.                                 <div class="reviewer-meta media-body align-self-center ml-4">
  465.                                     <h5 class="reviewer-name color-primary mb-2">Junaid Hasan</h5>
  466.                                     <h6 class="text-secondary fw-6">CEO, Themeland</h6>
  467.                                 </div>
  468.                             </div>
  469.                         </div>
  470.                     </div>
  471.                     <div class="col-12 col-md-6 col-lg-4">
  472.                         <!-- Single Review -->
  473.                         <div class="single-review card">
  474.                             <!-- Card Top -->
  475.                             <div class="card-top p-4">
  476.                                 <div class="review-icon">
  477.                                     <i class="fas fa-star text-warning"></i>
  478.                                     <i class="fas fa-star text-warning"></i>
  479.                                     <i class="fas fa-star text-warning"></i>
  480.                                     <i class="fas fa-star text-warning"></i>
  481.                                     <i class="fas fa-star text-warning"></i>
  482.                                 </div>
  483.                                 <h4 class="text-primary mt-4 mb-3">Great support!!</h4>
  484.                                 <!-- Review Text -->
  485.                                 <div class="review-text">
  486.                                     <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Quis nam id facilis, provident doloremque placeat eveniet molestias laboriosam. Optio, esse.</p>
  487.                                 </div>
  488.                                 <!-- Quotation Icon -->
  489.                                 <div class="quot-icon">
  490.                                     <img class="avatar-md" src="{{ asset('front/assets/img/icon/quote.png') }}" alt="">
  491.                                 </div>
  492.                             </div>
  493.                             <!-- Reviewer -->
  494.                             <div class="reviewer media bg-gray p-4">
  495.                                 <!-- Reviewer Thumb -->
  496.                                 <div class="reviewer-thumb">
  497.                                     <img class="avatar-lg radius-100" src="{{ asset('front/assets/img/avatar/avatar-3.png') }}" alt="">
  498.                                 </div>
  499.                                 <!-- Reviewer Media -->
  500.                                 <div class="reviewer-meta media-body align-self-center ml-4">
  501.                                     <h5 class="reviewer-name color-primary mb-2">Junaid Hasan</h5>
  502.                                     <h6 class="text-secondary fw-6">CEO, Themeland</h6>
  503.                                 </div>
  504.                             </div>
  505.                         </div>
  506.                     </div>
  507.                 </div>
  508.             </div>
  509.         </section>
  510.         <!-- ***** Review Area End ***** -->#}
  512.         {#<!-- ***** Price Plan Area Start ***** -->
  513.         <section id="pricing" class="section price-plan-area bg-gray overflow-hidden ptb_100">
  514.             <div class="container">
  515.                 <div class="row justify-content-center">
  516.                     <div class="col-12 col-md-10 col-lg-7">
  517.                         <!-- Section Heading -->
  518.                         <div class="section-heading text-center">
  519.                             <h2>Unlock Full Power Of sApp</h2>
  520.                             <p class="d-none d-sm-block mt-4">Lorem ipsum dolor sit amet, consectetur adipisicing elit. Laborum obcaecati dignissimos quae quo ad iste ipsum officiis deleniti asperiores sit.</p>
  521.                             <p class="d-block d-sm-none mt-4">Lorem ipsum dolor sit amet, consectetur adipisicing elit. Laborum obcaecati.</p>
  522.                         </div>
  523.                     </div>
  524.                 </div>
  525.                 <div class="row justify-content-center">
  526.                     <div class="col-12 col-sm-10 col-lg-8">
  527.                         <div class="row price-plan-wrapper">
  528.                             <div class="col-12 col-md-6">
  529.                                 <!-- Single Price Plan -->
  530.                                 <div class="single-price-plan text-center p-5 wow fadeInLeft" data-aos-duration="2s" data-wow-delay="0.4s">
  531.                                     <!-- Plan Thumb -->
  532.                                     <div class="plan-thumb">
  533.                                         <img class="avatar-lg" src="{{ asset('front/assets/img/pricing/basic.png') }}" alt="">
  534.                                     </div>
  535.                                     <!-- Plan Title -->
  536.                                     <div class="plan-title my-2 my-sm-3">
  537.                                         <h3 class="text-uppercase">Basic</h3>
  538.                                     </div>
  539.                                     <!-- Plan Price -->
  540.                                     <div class="plan-price pb-2 pb-sm-3">
  541.                                         <h1 class="color-primary"><small class="fw-7">$</small>49</h1>
  542.                                     </div>
  543.                                     <!-- Plan Description -->
  544.                                     <div class="plan-description">
  545.                                         <ul class="plan-features">
  546.                                             <li class="border-top py-3">5GB Linux Web Space</li>
  547.                                             <li class="border-top py-3">5 MySQL Databases</li>
  548.                                             <li class="border-top py-3">24/7 Tech Support</li>
  549.                                             <li class="border-top border-bottom py-3">Daily Backups</li>
  550.                                         </ul>
  551.                                     </div>
  552.                                     <!-- Plan Button -->
  553.                                     <div class="plan-button">
  554.                                         <a href="#" class="btn mt-4">Sign Up</a>
  555.                                     </div>
  556.                                 </div>
  557.                             </div>
  558.                             <div class="col-12 col-md-6 mt-4 mt-md-0">
  559.                                 <!-- Single Price Plan -->
  560.                                 <div class="single-price-plan text-center p-5 wow fadeInRight" data-aos-duration="2s" data-wow-delay="0.4s">
  561.                                     <!-- Plan Thumb -->
  562.                                     <div class="plan-thumb">
  563.                                         <img class="avatar-lg" src="{{ asset('front/assets/img/pricing/premium.png') }}" alt="">
  564.                                     </div>
  565.                                     <!-- Plan Title -->
  566.                                     <div class="plan-title my-2 my-sm-3">
  567.                                         <h3 class="text-uppercase">Pro</h3>
  568.                                     </div>
  569.                                     <!-- Plan Price -->
  570.                                     <div class="plan-price pb-2 pb-sm-3">
  571.                                         <h1 class="color-primary"><small class="fw-7">$</small>129</h1>
  572.                                     </div>
  573.                                     <!-- Plan Description -->
  574.                                     <div class="plan-description">
  575.                                         <ul class="plan-features">
  576.                                             <li class="border-top py-3">10GB Linux Web Space</li>
  577.                                             <li class="border-top py-3">50 MySQL Databases</li>
  578.                                             <li class="border-top py-3">Unlimited Email</li>
  579.                                             <li class="border-top border-bottom py-3">Daily Backups</li>
  580.                                         </ul>
  581.                                     </div>
  582.                                     <!-- Plan Button -->
  583.                                     <div class="plan-button">
  584.                                         <a href="#" class="btn mt-4">Sign Up</a>
  585.                                     </div>
  586.                                 </div>
  587.                             </div>
  588.                         </div>
  589.                     </div>
  590.                 </div>
  591.                 <div class="row justify-content-center pt-5">
  592.                     <p class="text-body pt-4 fw-5">Not sure what to choose? <a href="#">Contact Us</a></p>
  593.                 </div>
  594.             </div>
  595.         </section>
  596.         <!-- ***** Price Plan Area End ***** -->#}
  598.         {% if faqs|length > 0 %}
  599.         <section id="faq" class="section faq-area style-two ptb_100">
  600.             <div class="container">
  601.                 <div class="row justify-content-center">
  602.                     <div class="col-12 col-md-10 col-lg-7">
  603.                         <div class="section-heading text-center">
  604.                             <h2 class="text-capitalize">Perguntas frequentes</h2>
  605.                             {% if container.getConfiguration and container.getConfiguration.faqSubtitle %}
  606.                                 <p class="d-none d-sm-block mt-4">{{ container.getConfiguration.faqSubtitle ? container.getConfiguration.faqSubtitle|raw : '' }}</p>
  607.                                 <p class="d-block d-sm-none mt-4">{{ container.getConfiguration.faqSubtitle ? container.getConfiguration.faqSubtitle|raw : '' }}</p>
  608.                             {% endif %}
  609.                         </div>
  610.                     </div>
  611.                 </div>
  612.                 <div class="row justify-content-center">
  613.                     <div class="col-12">
  614.                         <div class="faq-content">
  615.                             <div class="accordion" id="sApp-accordion">
  616.                                 <div class="row justify-content-center">
  617.                                     {% for faq in faqs %}
  618.                                         <div class="col-12 col-md-12">
  619.                                             <div class="card border-0">
  620.                                                 <div class="card-header bg-inherit border-0 p-0">
  621.                                                     <h2 class="mb-0">
  622.                                                         <button class="btn px-0 py-3" type="button">
  623.                                                             {{ faq.question ? faq.question|raw : '' }}
  624.                                                         </button>
  625.                                                     </h2>
  626.                                                 </div>
  627.                                                 <div class="card-body px-0 py-3">
  628.                                                     {{ faq.answer ? faq.answer|raw : '' }}
  629.                                                     <br /><br />
  630.                                                 </div>
  631.                                             </div>
  632.                                         </div>
  633.                                     {% endfor %}
  634.                                 </div>
  635.                                 <div class="row justify-content-center">
  636.                                     <p class="text-body text-center pt-4 fw-5">Permanece com alguma dúvida? <a class="scroll" href="#contact">Fale conosco.</a></p>
  637.                                 </div>
  638.                             </div>
  639.                         </div>
  640.                     </div>
  641.                 </div>
  642.             </div>
  643.         </section>
  644.         {% endif %}
  646.         {#<!-- ***** Team Area Start ***** -->
  647.         <section class="section team-area team-style-two overflow-hidden ptb_100">
  648.             <div class="container">
  649.                 <div class="row justify-content-center">
  650.                     <div class="col-12 col-md-10 col-lg-6">
  651.                         <!-- Section Heading -->
  652.                         <div class="section-heading text-center">
  653.                             <h2 class="text-capitalize">Our Team Experts</h2>
  654.                             <p class="d-none d-sm-block mt-4">Lorem ipsum dolor sit amet, consectetur adipisicing elit. Laborum obcaecati dignissimos quae quo ad iste ipsum officiis deleniti asperiores sit.</p>
  655.                             <p class="d-block d-sm-none mt-4">Lorem ipsum dolor sit amet, consectetur adipisicing elit. Laborum obcaecati.</p>
  656.                         </div>
  657.                     </div>
  658.                 </div>
  659.                 <div class="row">
  660.                     <div class="col-12 col-sm-6 col-md-4 col-lg-3">
  661.                         <!-- Single Team -->
  662.                         <div class="single-team text-center radius-100 overflow-hidden m-2 m-lg-0">
  663.                             <!-- Team Thumb -->
  664.                             <div class="team-thumb radius-100 d-inline-block position-relative overflow-hidden">
  665.                                 <img src="{{ asset('front/assets/img/avatar/avatar-1.png') }}" alt="">
  666.                                 <!-- Team Overlay -->
  667.                                 <div class="team-overlay radius-100">
  668.                                     <h4 class="team-name text-white">Junaid Hasan</h4>
  669.                                     <h5 class="team-post text-white mt-2 mb-3">Founder &amp; CEO</h5>
  670.                                     <!-- Team Icons -->
  671.                                     <div class="team-icons">
  672.                                         <a class="p-2" href="#"><i class="fab fa-facebook-f"></i></a>
  673.                                         <a class="p-2" href="#"><i class="fab fa-twitter"></i></a>
  674.                                         <a class="p-2" href="#"><i class="fab fa-google-plus-g"></i></a>
  675.                                         <a class="p-2" href="#"><i class="fab fa-linkedin-in"></i></a>
  676.                                     </div>
  677.                                 </div>
  678.                             </div>
  679.                         </div>
  680.                     </div>
  681.                     <div class="col-12 col-sm-6 col-md-4 col-lg-3">
  682.                         <!-- Single Team -->
  683.                         <div class="single-team text-center radius-100 overflow-hidden m-2 m-lg-0">
  684.                             <!-- Team Thumb -->
  685.                             <div class="team-thumb radius-100 d-inline-block position-relative overflow-hidden">
  686.                                 <img src="{{ asset('front/assets/img/avatar/avatar-2.png') }}" alt="">
  687.                                 <!-- Team Overlay -->
  688.                                 <div class="team-overlay radius-100">
  689.                                     <h4 class="team-name text-white">Jassica William</h4>
  690.                                     <h5 class="team-post text-white mt-2 mb-3">Co-Founder</h5>
  691.                                     <!-- Team Icons -->
  692.                                     <div class="team-icons">
  693.                                         <a class="p-2" href="#"><i class="fab fa-facebook-f"></i></a>
  694.                                         <a class="p-2" href="#"><i class="fab fa-twitter"></i></a>
  695.                                         <a class="p-2" href="#"><i class="fab fa-google-plus-g"></i></a>
  696.                                         <a class="p-2" href="#"><i class="fab fa-linkedin-in"></i></a>
  697.                                     </div>
  698.                                 </div>
  699.                             </div>
  700.                         </div>
  701.                     </div>
  702.                     <div class="col-12 col-sm-6 col-md-4 col-lg-3">
  703.                         <!-- Single Team -->
  704.                         <div class="single-team text-center radius-100 overflow-hidden m-2 m-lg-0">
  705.                             <!-- Team Thumb -->
  706.                             <div class="team-thumb radius-100 d-inline-block position-relative overflow-hidden">
  707.                                 <img src="{{ asset('front/assets/img/avatar/avatar-3.png') }}" alt="">
  708.                                 <!-- Team Overlay -->
  709.                                 <div class="team-overlay radius-100">
  710.                                     <h4 class="team-name text-white">Md. Arham</h4>
  711.                                     <h5 class="team-post text-white mt-2 mb-3">Web Developer</h5>
  712.                                     <!-- Team Icons -->
  713.                                     <div class="team-icons">
  714.                                         <a class="p-2" href="#"><i class="fab fa-facebook-f"></i></a>
  715.                                         <a class="p-2" href="#"><i class="fab fa-twitter"></i></a>
  716.                                         <a class="p-2" href="#"><i class="fab fa-google-plus-g"></i></a>
  717.                                         <a class="p-2" href="#"><i class="fab fa-linkedin-in"></i></a>
  718.                                     </div>
  719.                                 </div>
  720.                             </div>
  721.                         </div>
  722.                     </div>
  723.                     <div class="col-12 col-sm-6 col-md-4 col-lg-3">
  724.                         <!-- Single Team -->
  725.                         <div class="single-team text-center radius-100 overflow-hidden m-2 m-lg-0">
  726.                             <!-- Team Thumb -->
  727.                             <div class="team-thumb radius-100 d-inline-block position-relative overflow-hidden">
  728.                                 <img src="{{ asset('front/assets/img/avatar/avatar-4.png') }}" alt="">
  729.                                 <!-- Team Overlay -->
  730.                                 <div class="team-overlay radius-100">
  731.                                     <h4 class="team-name text-white">Yasmin Akter</h4>
  732.                                     <h5 class="team-post text-white mt-2 mb-3">Graphic Designer</h5>
  733.                                     <!-- Team Icons -->
  734.                                     <div class="team-icons">
  735.                                         <a class="p-2" href="#"><i class="fab fa-facebook-f"></i></a>
  736.                                         <a class="p-2" href="#"><i class="fab fa-twitter"></i></a>
  737.                                         <a class="p-2" href="#"><i class="fab fa-google-plus-g"></i></a>
  738.                                         <a class="p-2" href="#"><i class="fab fa-linkedin-in"></i></a>
  739.                                     </div>
  740.                                 </div>
  741.                             </div>
  742.                         </div>
  743.                     </div>
  744.                 </div>
  745.             </div>
  746.         </section>
  747.         <!-- ***** Team Area End ***** -->#}
  749.         {% if container.getConfiguration and (container.getConfiguration.ios or container.getConfiguration.android) %}
  750.         <section class="section download-area overlay-dark ptb_100">
  751.             <div class="container">
  752.                 <div class="row justify-content-center">
  753.                     <div class="col-12 col-md-10 col-lg-8">
  754.                         <div class="download-text text-center">
  755.                             {% if container.getConfiguration %}
  756.                                 <h2 class="text-white">{{ container.getConfiguration.headlineTitle ? container.getConfiguration.headlineTitle|raw : 'Instale Já' }}</h2>
  757.                                 <p class="text-white my-3 d-none d-sm-block">{{ container.getConfiguration.headlineSubtitle ? container.getConfiguration.headlineSubtitle|raw : ''  }}</p>
  758.                                 <p class="text-white my-3 d-block d-sm-none">{{ container.getConfiguration.headlineSubtitle ? container.getConfiguration.headlineSubtitle|raw : ''  }}</p>
  759.                                 {% if container.getConfiguration.headlineButton %}
  760.                                     <style>
  761.                                         .headlineButton {
  762.                                             color: #ffffff !important;
  763.                                             font-size: 16px;
  764.                                             border: solid 2px #ffffff;
  765.                                             padding: 15px 30px;
  766.                                             border-radius: 10px;
  767.                                         }
  769.                                         .headlineButton:hover {
  770.                                             color: #333639 !important;
  771.                                             font-size: 16px;
  772.                                             border: solid 2px #333639;
  773.                                             padding: 15px 30px;
  774.                                             border-radius: 10px;
  775.                                         }
  776.                                     </style>
  777.                                     <br />
  778.                                     <a target="_blank" href="{{ container.getConfiguration.headlineLink ? container.getConfiguration.headlineLink : '#' }}" class="headlineButton">
  779.                                         {{ container.getConfiguration.headlineButton }}
  780.                                     </a>
  781.                                 {% else %}
  782.                                 <div class="button-group store-buttons d-flex justify-content-center">
  783.                                     <a target="_blank" href="{{ container.getConfiguration.android ? container.getConfiguration.android : '#' }}">
  784.                                         <img src="{{ asset('front/assets/img/icon-google-play-mono-white.png') }}" alt="">
  785.                                     </a>
  786.                                     <a target="_blank" href="{{ container.getConfiguration.ios ? container.getConfiguration.ios : '#' }}">
  787.                                         <img src="{{ asset('front/assets/img/icon-app-store-mono-white-2.png') }}" alt="">
  788.                                     </a>
  789.                                 </div>
  790.                                 <span class="d-inline-block text-white fw-3 font-italic mt-3">* Disponível para iPhone e dispositivos Android</span>
  791.                                 {% endif %}
  792.                             {% endif %}
  793.                         </div>
  794.                     </div>
  795.                 </div>
  796.             </div>
  797.         </section>
  798.         {% endif %}
  800.         <section class="section subscribe-area ptb_100">
  801.             <div class="container">
  802.                 <div class="row justify-content-center">
  803.                     <div class="col-12 col-md-10 col-lg-7">
  804.                         <div class="subscribe-content text-center">
  805.                             <h2>Cadastre seu e-mail</h2>
  806.                             {% if container.getConfiguration and container.getConfiguration.emailSubtitle %}
  807.                                 <p class="my-4">{{ container.getConfiguration.emailSubtitle ? container.getConfiguration.emailSubtitle|raw : '' }}</p>
  808.                             {% endif %}
  809.                             <form id="subscribe-form" class="subscribe-form" method="POST" action="{{ path('lead') }}">
  810.                                 <div class="form-group">
  811.                                     <input type="email" name="email" class="form-control" id="exampleInputEmail1" aria-describedby="emailHelp" placeholder="Informe seu e-mail">
  812.                                 </div>
  813.                                 <button type="submit" class="btn btn-lg btn-block">Cadastrar</button>
  814.                             </form>
  815.                             <div id="form-message-subscribe" class="alert mt-4" role="alert"></div>
  816.                         </div>
  817.                     </div>
  818.                 </div>
  819.             </div>
  820.         </section>
  822. {% endblock %}