templates/front/about/become_teacher.html.twig line 1

  1. {% extends "front/base.html.twig" %}
  3. {% block title %} - About us{% endblock %}
  6. {% block mainBarnner %}
  8. {% endblock %}
  10. {% block mainContent %}
  12.     <!-- =======================
  13. Page Banner START -->
  14.     <section class="bg-light py-5 position-relative overflow-hidden">
  15.         <!-- SVG decoration -->
  16.         <figure class="fill-primary opacity-1 position-absolute top-50 end-0 me-n6 d-none d-sm-block">
  17.             <svg width="211px" height="211px">
  18.                 <path d="M210.030,105.011 C210.030,163.014 163.010,210.029 105.012,210.029 C47.013,210.029 -0.005,163.014 -0.005,105.011 C-0.005,47.015 47.013,-0.004 105.012,-0.004 C163.010,-0.004 210.030,47.015 210.030,105.011 Z"/>
  19.             </svg>
  20.         </figure>
  22.         <!-- SVG decoration -->
  23.         <figure class="fill-primary position-absolute top-50 start-100 translate-middle ms-n7 mt-7 d-none d-sm-block">
  24.             <svg class="opacity-5" enable-background="new 0 0 160.7 159.8" height="180px">
  25.                 <path d="m153.2 114.5c1.2 0 2.1 1 2.1 2.2s-1 2.2-2.1 2.2c-1.2 0-2.1-1-2.1-2.2-0.1-1.2 0.9-2.2 2.1-2.2z"></path>
  26.                 <path d="m116.4 114.5c1.2 0 2.1 1 2.1 2.2s-1 2.2-2.1 2.2c-1.2 0-2.1-1-2.1-2.2s0.9-2.2 2.1-2.2z"></path>
  27.                 <path d="m134.8 114.5c1.2 0 2.1 1 2.1 2.2s-1 2.2-2.1 2.2c-1.2 0-2.1-1-2.1-2.2s0.9-2.2 2.1-2.2z"></path>
  28.                 <path d="m135.1 96.9c1.2 0 2.1 1 2.1 2.2s-1 2.2-2.1 2.2c-1.2 0-2.1-1-2.1-2.2s0.9-2.2 2.1-2.2z"></path>
  29.                 <path d="m153.5 96.9c1.2 0 2.1 1 2.1 2.2s-1 2.2-2.1 2.2c-1.2 0-2.1-1-2.1-2.2-0.1-1.2 0.9-2.2 2.1-2.2z"></path>
  30.                 <path d="m98.3 96.9c1.2 0 2.1 1 2.1 2.2s-1 2.2-2.1 2.2c-1.2 0-2.1-1-2.1-2.2s0.9-2.2 2.1-2.2z"></path>
  31.                 <ellipse cx="116.7" cy="99.1" rx="2.1" ry="2.2"></ellipse>
  32.                 <path d="m153.2 149.8c1.2 0 2.1 1 2.1 2.2s-1 2.2-2.1 2.2c-1.2 0-2.1-1-2.1-2.2-0.1-1.3 0.9-2.2 2.1-2.2z"></path>
  33.                 <path d="m135.1 132.2c1.2 0 2.1 1 2.1 2.2s-1 2.2-2.1 2.2c-1.2 0-2.1-1-2.1-2.2 0-1.3 0.9-2.2 2.1-2.2z"></path>
  34.                 <path d="m153.5 132.2c1.2 0 2.1 1 2.1 2.2s-1 2.2-2.1 2.2c-1.2 0-2.1-1-2.1-2.2-0.1-1.3 0.9-2.2 2.1-2.2z"></path>
  35.                 <path d="m80.2 79.3c1.2 0 2.1 1 2.1 2.2s-1 2.2-2.1 2.2c-1.2 0-2.1-1-2.1-2.2s1-2.2 2.1-2.2z"></path>
  36.                 <path d="m117 79.3c1.2 0 2.1 1 2.1 2.2s-1 2.2-2.1 2.2c-1.2 0-2.1-1-2.1-2.2s0.9-2.2 2.1-2.2z"></path>
  37.                 <path d="m98.6 79.3c1.2 0 2.1 1 2.1 2.2s-1 2.2-2.1 2.2c-1.2 0-2.1-1-2.1-2.2s0.9-2.2 2.1-2.2z"></path>
  38.                 <path d="m135.4 79.3c1.2 0 2.1 1 2.1 2.2s-1 2.2-2.1 2.2c-1.2 0-2.1-1-2.1-2.2s0.9-2.2 2.1-2.2z"></path>
  39.                 <path d="m153.8 79.3c1.2 0 2.1 1 2.1 2.2s-1 2.2-2.1 2.2c-1.2 0-2.1-1-2.1-2.2s0.9-2.2 2.1-2.2z"></path>
  40.                 <path d="m80.6 61.7c1.2 0 2.1 1 2.1 2.2s-1 2.2-2.1 2.2c-1.2 0-2.1-1-2.1-2.2-0.1-1.2 0.9-2.2 2.1-2.2z"></path>
  41.                 <ellipse cx="98.9" cy="63.9" rx="2.1" ry="2.2"></ellipse>
  42.                 <path d="m117.3 61.7c1.2 0 2.1 1 2.1 2.2s-1 2.2-2.1 2.2c-1.2 0-2.1-1-2.1-2.2s0.9-2.2 2.1-2.2z"></path>
  43.                 <ellipse cx="62.2" cy="63.9" rx="2.1" ry="2.2"></ellipse>
  44.                 <ellipse cx="154.1" cy="63.9" rx="2.1" ry="2.2"></ellipse>
  45.                 <path d="m135.7 61.7c1.2 0 2.1 1 2.1 2.2s-1 2.2-2.1 2.2c-1.2 0-2.1-1-2.1-2.2s0.9-2.2 2.1-2.2z"></path>
  46.                 <path d="m154.4 44.1c1.2 0 2.1 1 2.1 2.2s-1 2.2-2.1 2.2c-1.2 0-2.1-1-2.1-2.2s0.9-2.2 2.1-2.2z"></path>
  47.                 <path d="m80.9 44.1c1.2 0 2.1 1 2.1 2.2s-1 2.2-2.1 2.2c-1.2 0-2.1-1-2.1-2.2-0.1-1.2 0.9-2.2 2.1-2.2z"></path>
  48.                 <path d="m44.1 44.1c1.2 0 2.1 1 2.1 2.2s-1 2.2-2.1 2.2c-1.2 0-2.1-1-2.1-2.2-0.1-1.2 0.9-2.2 2.1-2.2z"></path>
  49.                 <path d="m99.2 44.1c1.2 0 2.1 1 2.1 2.2s-1 2.2-2.1 2.2c-1.2 0-2.1-1-2.1-2.2s1-2.2 2.1-2.2z"></path>
  50.                 <ellipse cx="117.6" cy="46.3" rx="2.1" ry="2.2"></ellipse>
  51.                 <path d="m136 44.1c1.2 0 2.1 1 2.1 2.2s-1 2.2-2.1 2.2c-1.2 0-2.1-1-2.1-2.2s0.9-2.2 2.1-2.2z"></path>
  52.                 <path d="m62.5 44.1c1.2 0 2.1 1 2.1 2.2s-1 2.2-2.1 2.2c-1.2 0-2.1-1-2.1-2.2-0.1-1.2 0.9-2.2 2.1-2.2z"></path>
  53.                 <path d="m154.7 26.5c1.2 0 2.1 1 2.1 2.2s-1 2.2-2.1 2.2c-1.2 0-2.1-1-2.1-2.2s0.9-2.2 2.1-2.2z"></path>
  54.                 <path d="m62.8 26.5c1.2 0 2.1 1 2.1 2.2s-1 2.2-2.1 2.2c-1.2 0-2.1-1-2.1-2.2-0.1-1.2 0.9-2.2 2.1-2.2z"></path>
  55.                 <ellipse cx="136.3" cy="28.6" rx="2.1" ry="2.2"></ellipse>
  56.                 <path d="m99.6 26.5c1.2 0 2.1 1 2.1 2.2s-1 2.2-2.1 2.2c-1.2 0-2.1-1-2.1-2.2-0.1-1.2 0.9-2.2 2.1-2.2z"></path>
  57.                 <path d="m117.9 26.5c1.2 0 2.1 1 2.1 2.2s-1 2.2-2.1 2.2c-1.2 0-2.1-1-2.1-2.2s1-2.2 2.1-2.2z"></path>
  58.                 <path d="m81.2 26.5c1.2 0 2.1 1 2.1 2.2s-1 2.2-2.1 2.2c-1.2 0-2.1-1-2.1-2.2-0.1-1.2 0.9-2.2 2.1-2.2z"></path>
  59.                 <path d="m26 26.5c1.2 0 2.1 1 2.1 2.2s-1 2.2-2.1 2.2c-1.2 0-2.1-1-2.1-2.2s0.9-2.2 2.1-2.2z"></path>
  60.                 <ellipse cx="44.4" cy="28.6" rx="2.1" ry="2.2"></ellipse>
  61.                 <path d="m136.6 13.2c-1.2 0-2.1-1-2.1-2.2s1-2.2 2.1-2.2c1.2 0 2.1 1 2.1 2.2 0.1 1.2-0.9 2.2-2.1 2.2z"></path>
  62.                 <path d="m155 13.2c-1.2 0-2.1-1-2.1-2.2s1-2.2 2.1-2.2c1.2 0 2.1 1 2.1 2.2 0.1 1.2-0.9 2.2-2.1 2.2z"></path>
  63.                 <path d="m26.3 13.2c-1.2 0-2.1-1-2.1-2.2s1-2.2 2.1-2.2c1.2 0 2.1 1 2.1 2.2s-0.9 2.2-2.1 2.2z"></path>
  64.                 <path d="m81.5 13.2c-1.2 0-2.1-1-2.1-2.2s1-2.2 2.1-2.2c1.2 0 2.1 1 2.1 2.2s-0.9 2.2-2.1 2.2z"></path>
  65.                 <path d="m63.1 13.2c-1.2 0-2.1-1-2.1-2.2s1-2.2 2.1-2.2c1.2 0 2.1 1 2.1 2.2s-0.9 2.2-2.1 2.2z"></path>
  66.                 <path d="m44.7 13.2c-1.2 0-2.1-1-2.1-2.2s1-2.2 2.1-2.2c1.2 0 2.1 1 2.1 2.2s-0.9 2.2-2.1 2.2z"></path>
  67.                 <path d="m118.2 13.2c-1.2 0-2.1-1-2.1-2.2s1-2.2 2.1-2.2c1.2 0 2.1 1 2.1 2.2 0.1 1.2-0.9 2.2-2.1 2.2z"></path>
  68.                 <path d="m7.9 13.2c-1.2 0-2.1-1-2.1-2.2s1-2.2 2.1-2.2c1.2 0 2.1 1 2.1 2.2 0.1 1.2-0.9 2.2-2.1 2.2z"></path>
  69.                 <path d="m99.9 13.2c-1.2 0-2.1-1-2.1-2.2s1-2.2 2.1-2.2c1.2 0 2.1 1 2.1 2.2s-1 2.2-2.1 2.2z"></path>
  70.             </svg>
  71.         </figure>
  73.         <!-- SVG decoration -->
  74.         <figure class="position-absolute bottom-0 start-0 d-none d-lg-block">
  75.             <svg width="822.2px" height="301.9px" viewBox="0 0 822.2 301.9">
  76.                 <path class="fill-warning" d="M752.5,51.9c-4.5,3.9-8.9,7.8-13.4,11.8c-51.5,45.3-104.8,92.2-171.7,101.4c-39.9,5.5-80.2-3.4-119.2-12.1 c-32.3-7.2-65.6-14.6-98.9-13.9c-66.5,1.3-128.9,35.2-175.7,64.6c-11.9,7.5-23.9,15.3-35.5,22.8c-40.5,26.4-82.5,53.8-128.4,70.7 c-2.1,0.8-4.2,1.5-6.2,2.2L0,301.9c3.3-1.1,6.7-2.3,10.2-3.5c46.1-17,88.1-44.4,128.7-70.9c11.6-7.6,23.6-15.4,35.4-22.8 c46.7-29.3,108.9-63.1,175.1-64.4c33.1-0.6,66.4,6.8,98.6,13.9c39.1,8.7,79.6,17.7,119.7,12.1C634.8,157,688.3,110,740,64.6 c4.5-3.9,9-7.9,13.4-11.8C773.8,35,797,16.4,822.2,1l-0.7-1C796.2,15.4,773,34,752.5,51.9z"/>
  77.             </svg>
  78.         </figure>
  80.         <div class="container position-relative">
  81.             <div class="row g-4 align-items-center">
  82.                 <div class="col-md-6">
  83.                     <!-- Title -->
  84.                     <h1>{% trans %}APPLYASINSTRUCTOR_KEY{% endtrans %}</h1>
  85.                     <p>{% trans %}APPLYASINSTRUCTORDESCRIPTION_KEY{% endtrans %}</p>
  86.                     <!-- Button -->
  87.                     <a href="#contactTitle" class="btn btn-primary mb-0">{% trans %}CONTACTUS_KEY{% endtrans %}</a>
  88.                 </div>
  90.                 <div class="col-md-6 text-center">
  91.                     <!-- Image -->
  92.                     <img src="{{ asset('assets/images/element/04.svg') }}" class="h-300px h-xl-400px" alt="">
  93.                 </div>
  94.             </div>
  95.         </div>
  96.     </section>
  97.     <!-- =======================
  98.     Page Banner END -->
  100.     <!-- =======================
  101.     Work START -->
  102.     <section>
  103.         <div class="container">
  104.             <!-- Title -->
  105.             <div class="row mb-4">
  106.                 <div class="col-sm-10 col-xl-6 text-center mx-auto">
  107.                     <h2>{% trans %}STARTITLE_KEY{% endtrans %}</h2>
  108.                     <p class="mb-0">{% trans %}STARTITLEDESCRIPTION_KEY{% endtrans %}</p>
  109.                 </div>
  110.             </div>
  112.             <!-- Work process -->
  113.             <div class="row g-4 g-md-5">
  114.                 <!-- Item -->
  115.                 <div class="col-md-4 text-center">
  116.                     <img src="{{ asset('assets/images/element/create-account.svg') }}" class="h-200px" alt="">
  117.                     <h4 class="mt-3">{% trans %}CREATEACCOUNT_KEY{% endtrans %}</h4>
  118.                     <p class="text-truncate-2 mb-0">{% trans %}STARCREATEACCOUNTDESCRIPTION_KEY{% endtrans %}</p>
  119.                 </div>
  121.                 <!-- Item -->
  122.                 <div class="col-md-4 text-center">
  123.                     <img src="{{ asset('assets/images/element/add-course.svg') }}" class="h-200px" alt="">
  124.                     <h4 class="mt-3">{% trans %}STARADDYOURCOURSE_KEY{% endtrans %}</h4>
  125.                     <p class="text-truncate-2 mb-0">{% trans %}STARADDYOURCOURSEDESCRIPTION_KEY{% endtrans %}</p>
  126.                 </div>
  128.                 <!-- Item -->
  129.                 <div class="col-md-4 text-center">
  130.                     <img src="{{ asset('assets/images/element/earn-money.svg') }}" class="h-200px" alt="">
  131.                     <h4 class="mt-3">{% trans %}STAREARINGMONEY_KEY{% endtrans %}</h4>
  132.                     <p class="text-truncate-2 mb-0">{% trans %}STAREARINGMONEYDESCRIPTITON_KEY{% endtrans %}</p>
  133.                 </div>
  134.             </div> <!-- Row END -->
  135.         </div>
  136.     </section>
  137.     <!-- =======================
  138.     Work END -->
  140.     <!-- =======================
  141.     Counter START -->
  142.     <section class="py-0 py-lg-5">
  143.         <div class="container">
  144.             <div class="bg-orange bg-opacity-10 p-4 p-sm-5 rounded position-relative overflow-hidden">
  145.                 <!-- SVG decoration -->
  146.                 <figure class="position-absolute top-50 end-0 translate-middle-y me-n7">
  147.                     <svg class="fill-white opacity-8 rotate-193" width="676px" height="161.3px" viewBox="0 0 676 161.3" style="enable-background:new 0 0 676 161.3;" xml:space="preserve">
  148.                     <path d="M53.6,18.8c28.6,8.8,50.3,27.3,70.9,48c19.9,19.9,39.5,40.8,65.3,53c53.3,24.9,116,12.4,168.2-9.1 c58.4-23.9,113.2-59.8,176.2-70.3c30.9-5.1,64.1-2.6,90.9,14.7c22.4,14.4,34.4,36.9,39.5,62.4c2.9,14.5,3.9,29.2,4.6,43.9h6.8 c-0.2-4.2-0.5-8.3-0.8-12.5c-1.7-24.1-4.9-49.1-17.6-70.3c-14.5-23.9-40-39.2-67-44.8c-32.9-6.8-67.2-0.3-98.5,10.2 c-30.3,10-59,24.2-87.7,38.1c-54.8,26.4-115.5,53.1-177.9,42c-14.5-2.6-28.7-7.4-41.7-14.7c-12.8-7.3-23.9-16.7-34.6-26.7 c-20.7-19.6-39.4-42-64.1-56.8c-25.6-15.4-56.4-22.2-86-19H0v6.9C17.9,11.8,36.3,13.5,53.6,18.8z"/>
  149.                 </svg>
  150.                 </figure>
  151.                 <!-- SVG decoration -->
  152.                 <figure class="position-absolute top-0 start-0 mt-3 ms-n3 opacity-5">
  153.                     <svg width="818.6px" height="235.1px" viewBox="0 0 818.6 235.1">
  154.                         <path class="fill-orange" d="M735,226.3c-5.7,0.6-11.5,1.1-17.2,1.7c-66.2,6.8-134.7,13.7-192.6-16.6c-34.6-18.1-61.4-47.9-87.3-76.7 c-21.4-23.8-43.6-48.5-70.2-66.7c-53.2-36.4-121.6-44.8-175.1-48c-13.6-0.8-27.5-1.4-40.9-1.9c-46.9-1.9-95.4-3.9-141.2-16.5 C8.3,1.2,6.2,0.6,4.2,0H0c3.3,1,6.6,2,10,3c46,12.5,94.5,14.6,141.5,16.5c13.4,0.6,27.3,1.1,40.8,1.9 c53.4,3.2,121.5,11.5,174.5,47.7c26.5,18.1,48.6,42.7,70,66.5c26,28.9,52.9,58.8,87.7,76.9c58.3,30.5,127,23.5,193.3,16.7 c5.8-0.6,11.5-1.2,17.2-1.7c26.2-2.6,55-4.2,83.5-2.2v-1.2C790,222,761.2,223.7,735,226.3z"></path>
  155.                     </svg>
  156.                 </figure>
  158.                 <div class="row g-4 position-relative align-items-center justify-content-center">
  160.                     <!-- Counter item -->
  161.                     <div class="col-sm-6 col-lg-3 text-center">
  162.                         <div class="d-flex justify-content-center">
  163.                             <h4 class="purecounter display-6 text-orange fw-bold mb-0" data-purecounter-start="0" data-purecounter-end="89"    data-purecounter-delay="200">0</h4>
  164.                             <span class="display-6 text-orange mb-0">K</span>
  165.                         </div>
  166.                         <h6 class="mb-0 fw-bold">{% trans %}TOTALCOURSES_KEY{% endtrans %}</h6>
  167.                     </div>
  169.                     <!-- Counter item -->
  170.                     <div class="col-sm-6 col-lg-3 text-center">
  171.                         <div class="d-flex justify-content-center">
  172.                             <h4 class="purecounter display-6 text-orange fw-bold mb-0" data-purecounter-start="0" data-purecounter-end="25"    data-purecounter-delay="200">0</h4>
  173.                             <span class="display-6 text-orange mb-0">K</span>
  174.                         </div>
  175.                         <h6 class="mb-0 fw-bold">{% trans %}TOTALINSTRUCTORS_KEY{% endtrans %}</h6>
  176.                     </div>
  178.                     <!-- Counter item -->
  179.                     <div class="col-sm-6 col-lg-3 text-center">
  180.                         <div class="d-flex justify-content-center">
  181.                             <h4 class="purecounter display-6 text-orange fw-bold mb-0" data-purecounter-start="0" data-purecounter-end="180"    data-purecounter-delay="200">0</h4>
  182.                             <span class="display-6 text-orange mb-0">K</span>
  183.                         </div>
  184.                         <h6 class="mb-0 fw-bold">{% trans %}TOTALCOURSES_KEY{% endtrans %}</h6>
  185.                     </div>
  187.                     <!-- Counter item -->
  188.                     <div class="col-sm-6 col-lg-3 text-center">
  189.                         <div class="d-flex justify-content-center">
  190.                             <h4 class="purecounter display-6 text-orange fw-bold mb-0" data-purecounter-start="0" data-purecounter-end="20"    data-purecounter-delay="200">0</h4>
  191.                             <span class="display-6 text-orange mb-0">+</span>
  192.                         </div>
  193.                         <h6 class="mb-0 fw-bold">{% trans %}LANGUAGES_KEY{% endtrans %}</h6>
  194.                     </div>
  195.                 </div> <!-- Row END -->
  196.             </div>
  197.         </div>
  198.     </section>
  199.     <!-- =======================
  200.     Counter END -->
  202.     <!-- =======================
  203.     Form and Tabs START -->
  204.     <section id="contactTitle">
  205.         <div class="container">
  206.             <div class="row">
  208.                 <!-- Left Content START -->
  209.                 <div class="col-lg-5 position-relative mt-xl-0" id="fill-instructor-form">
  211.                     <!-- SVG decoration -->
  212.                     <figure class="position-absolute top-0 start-50 mt-n3 ms-5 d-none d-sm-block z-index-1">
  213.                         <svg    width="192.5px" height="89.4px" viewBox="0 0 192.5 89.4">
  214.                             <path class="fill-warning" d="M170.2,0.5c-0.1,0-0.2,0-0.4,0c-2.6-0.1-5.2-0.4-7.8-0.5c-2.9-0.1-5.8,0-8.6,0.2c-1.4,0.1-2.9,0.3-4.3,0.5 c-0.5,0.1-1,0-1.5,0c-1-0.1-1.9,0.2-2.9,0.3c-5.6,0.9-11.1,2.1-16.5,3.6c-2.7,0.7-5.4,1.6-8.1,2.5c-0.6,0.2-1.2,0.4-1.8,0.5 c-0.4,0-0.8,0-1.2,0.1c-1.5,0.2-3,1.1-4.3,1.8c-3,1.5-5.9,3.2-8.6,5.2c-2,1.5-3.8,3.1-5.6,4.8c-0.9,0.9-1.7,1.8-2.5,2.7 c-0.4,0.4-1.1,0.7-1.4,1.2c-0.3,0.4-0.6,0.9-0.9,1.4c-0.9,1.2-1.7,2.3-2.7,3.4c-0.3,0.4-0.7,0.6-1.2,0.6c-1.4,0.1-2.8-0.1-4.2-0.1 c-0.7,0-1.2,0.2-1.9,0.2c-3.3,0.4-6.6,0.7-9.8,1.6c-1.7,0.5-3.4,0.9-5.1,1.4c-5.4,1.5-11,2.9-16,5.4c-4.6,2.2-8.7,5.2-12.7,8.3 c-2,1.6-4,3.2-5.9,4.9c-0.8,0.7-1.6,1.2-2.5,1.6c-0.9,0.5-1.7,1.3-2.4,2c-1.4,1.3-2.9,2.6-4.3,3.9c-1.2,1.1-2.5,2.1-3.6,3.3 c-0.9,1-2,1.9-3,2.8c-1,0.9-2.1,1.9-3.1,2.8c-0.8,0.7-1.6,1.2-2.3,1.9c-0.9,0.9-1.7,1.9-2.7,2.7c0-0.7,0.2-1.3,0.2-2 c0-1.8-0.2-3.7-0.7-5.5c-0.2-0.9-0.5-1.8-1.1-2.4c-0.6-0.7-1.7-1-2.4-0.6c-0.1,0.1-0.3,0.2-0.4,0.3c-0.1,0.2-0.1,0.4,0,0.6 c0.7,3.7,1.2,7.4,0.7,11.1c-0.2,2.4-0.9,4.9-2,7c-0.5,1-1.2,1.9-1.7,3c-0.4,1-1.4,1.8-2.1,2.7C0.3,86,0.1,86.3,0,86.6 c-0.1,0.4,0.1,0.7,0.2,1.1c0.3,0.8,0.8,1.6,1.6,1.7c0.5,0,0.9-0.2,1.3-0.5c0.9-0.5,1.7-1.1,2.6-1.6c0.4-0.2,0.7-0.5,1.1-0.7 c1.7-1.3,3.7-2.3,5.7-3.1c4.3-1.7,9.1-2.4,13.8-1.7c0.2,0,0.4,0.1,0.7,0c0.7-0.2,0.9-1.2,0.4-1.8c-0.4-0.6-1.2-0.8-1.9-1 c-2.7-0.8-5.4-1.5-8.2-1.8c-0.7-0.1-1.4-0.1-2.1-0.2c-0.3,0-0.6,0-0.8,0c-0.3,0-0.9,0.2-1.2,0.1C13,77,13,77.1,13,76.8 c0-0.4,0.6-0.8,0.9-1c0.5-0.4,0.9-0.8,1.4-1.2c1.1-1,2.3-1.9,3.4-2.9c0.6-0.5,1.1-1,1.7-1.5c0.3-0.3,0.5-0.7,0.9-1 c1.2-1.1,2.7-1.7,3.9-2.8c0.4-0.4,0.8-0.8,1.2-1.2c0.8-0.8,1.7-1.5,2.6-2.2c1-0.8,2.1-1.6,3.1-2.3c0.9-0.6,1.9-1.1,2.6-2 c0.8-1,2.1-1.7,3.1-2.5c1.1-0.9,2.2-1.8,3.3-2.6c3.9-3.1,7.9-6.2,12.3-8.6c5.2-2.7,10.6-4.9,16.3-6.4c5.5-1.4,11.2-1.8,16.8-2.7 c0.2,0,0.3-0.1,0.5-0.1c1.4-0.2,2.3-0.4,2,1.5c-0.8,4.9,2.3,7.5,5.8,9.8c4,2.5,8,5,12.7,5.8c5.2,0.9,10.4,2.7,15.9,0.8 c3-1,6.3-5,6.2-7.6c0-1.7-0.3-3.5-1-5.1c-0.6-1.4-1.5-3-2.8-3.7c-1-0.5-1.9-1.5-2.8-2.2c-1.1-0.8-2.2-1.5-3.3-2.1 c-2.3-1.2-4.8-2.1-7.3-2.8c-3.5-0.9-7.2-1.4-10.8-1.8c-0.9-0.1-1.7-0.2-2.6-0.2c-0.2,0-1.4,0-1.4-0.2c-0.1-0.2,0.3-0.5,0.4-0.6 c0.8-0.9,1.7-1.8,2.5-2.6c1.7-1.7,3.6-3.3,5.5-4.8c2-1.6,4.2-3,6.4-4.1c1.1-0.6,2.3-1.1,3.5-1.5c0.6-0.2,1.2-0.4,1.8-0.6 c0.4-0.2,0.7-0.5,1.1-0.7c1.2-0.6,2.7-0.9,4-1.3c1.4-0.4,2.8-0.8,4.2-1.2c2.8-0.8,5.6-1.5,8.4-2.2c3.4-0.8,6.9-1.6,10.3-2.4 c7.9-1.7,15.9-2.4,24-1.7c4.4,0.4,8.9,0.9,13.2,2.1c1.3,0.4,2.5,0.8,3.9,1.1c0.7,0.1,1.4,0.5,2,0.9c0.9,0.5,1.7,0.9,2.6,1.4 c0.3,0.2,0.7,0.3,0.9,0.1c0.1-0.1,0.1-0.3,0.1-0.4c0-0.9-0.4-1.8-1-2.5c-0.5-0.6-1.2-1.4-1.9-1.8c-0.9-0.6-2.2-0.9-3.3-1.3 c-1.1-0.4-2.2-0.7-3.3-1c-2.8-0.8-5.6-1.4-8.5-1.9C173.1,0.9,171.6,0.6,170.2,0.5z M106.8,36c5,0.8,11.2,2,16.2,6.2 c1.1,0.9,2.8,1.6,2.3,3.4c-0.4,1.7-2.1,1.8-3.5,2.3c-5,1.5-9.9,0-14.5-1.2c-4.9-1.2-9.7-3.3-13.5-7c-0.6-0.6-1.2-1.3-1.5-2.1 c-0.1-0.3-0.1-0.7-0.2-1c-0.1-0.3-0.3-0.6,0-0.9c0.2-0.2,0.5-0.3,0.9-0.3c2.4-0.4,4.9-0.6,7.4-0.5c0.9,0,1.8,0.4,2.7,0.5 C104.5,35.6,105.7,35.8,106.8,36z"/>
  215.                         </svg>
  216.                     </figure>
  218.                     <div class="card card-body shadow p-4">
  219.                         <!-- Title -->
  220.                         <h3>{% trans %}CONTACTUS_KEY{% endtrans %}</h3>
  221.                         <!-- Form START -->
  222.                         {{ form_start(contactForm, {'attr': {'class': 'row g-3 mt-2 position-relative z-index-9'}}) }}
  223.                             <!-- Name -->
  224.                             <div class="col-lg-6">
  225.                                 {{ form_label(contactForm.name) }}
  226.                                 {{ form_widget(contactForm.name) }}
  227.                             </div>
  228.                             <!-- Email -->
  229.                             <div class="col-lg-6">
  230.                                 {{ form_label(contactForm.email) }}
  231.                                 {{ form_widget(contactForm.email) }}
  232.                             </div>
  233.                             <!-- Textarea -->
  234.                             <div class="col-12">
  235.                                 {{ form_label(contactForm.message) }}
  236.                                 {{ form_widget(contactForm.message, {'attr': {'rows': '3', 'spellcheck': false}}) }}
  237.                             </div>
  238.                             <!-- Button -->
  239.                             <div class="col-12">
  240.                                 <button type="submit" class="btn btn-primary mb-0">Submit form</button>
  241.                             </div>
  242.                         {{ form_end(contactForm) }}
  243.                         <!-- Form END -->
  244.                     </div>
  245.                 </div>
  246.                 <!-- Left Content END -->
  248.                 <!-- Tabs START -->
  249.                 <div class="col-lg-7 z-index-9 mt-5 mt-xl-0">
  250.                     <h3>{% trans %}HOWTOBECOMEANINSTRUCTOR_KEY{% endtrans %}</h3>
  251.                     <ul class="nav nav-pills nav-pill-soft my-4" id="course-pills-tab" role="tablist">
  252.                         <!-- Tab item -->
  253.                         <li class="nav-item me-2 me-lg-4" role="presentation">
  254.                             <button class="nav-link mb-2 mb-xl-0 active" id="course-pills-tab-1" data-bs-toggle="pill" data-bs-target="#course-pills-1" type="button" role="tab" aria-controls="course-pills-1" aria-selected="true">{% trans %}BECOMEANINSTRUCTOR_KEY{% endtrans %}</button>
  255.                         </li>
  256.                         <!-- Tab item -->
  257.                         <li class="nav-item me-2 me-lg-4" role="presentation">
  258.                             <button class="nav-link mb-2 mb-xl-0" id="course-pills-tab-2" data-bs-toggle="pill" data-bs-target="#course-pills-2" type="button" role="tab" aria-controls="course-pills-2" aria-selected="false">{% trans %}INSTRUCTORROLE_KEY{% endtrans %}</button>
  259.                         </li>
  260.                         <!-- Tab item -->
  261.                         <li class="nav-item me-2 me-lg-4" role="presentation">
  262.                             <button class="nav-link mb-2 mb-xl-0" id="course-pills-tab-3" data-bs-toggle="pill" data-bs-target="#course-pills-3" type="button" role="tab" aria-controls="course-pills-3" aria-selected="false">{% trans %}STARTWITHCOURSE_KEY{% endtrans %}</button>
  263.                         </li>
  264.                     </ul>
  266.                     <!-- Tab contents START -->
  267.                     <div class="tab-content" id="pills-tabContent">
  268.                         <!-- Content -->
  269.                         <div class="tab-pane fade show active" id="course-pills-1" role="tabpanel" aria-labelledby="course-pills-tab-1">
  270.                             <h6>{% trans %}BECOMEANINSTRUCTOR_KEY{% endtrans %}</h6>
  271.                             {% trans %}BECOMEANINSTRUCTORDETAIL_KEY{% endtrans %}
  272.                         </div>
  274.                         <!-- Content -->
  275.                         <div class="tab-pane fade" id="course-pills-2" role="tabpanel" aria-labelledby="course-pills-tab-2">
  276.                             <h6>{% trans %}INSTRUCTORROLE_KEY{% endtrans %}</h6>
  277.                             <p></p>
  279.                             <!-- Info -->
  280.                             <ul class="list-group list-group-borderless mb-3">
  281.                                 <li class="list-group-item">
  282.                                     <i class="fas fa-check-circle text-success me-2"></i>{% trans %}INSTRUCTORROLEDESCRIPTIONLIST1_KEY{% endtrans %}
  283.                                 </li>
  284.                                 <li class="list-group-item d-flex">
  285.                                     <i class="fas fa-check-circle text-success me-2 mt-1"></i>{% trans %}INSTRUCTORROLEDESCRIPTIONLIST2_KEY{% endtrans %}
  286.                                 </li>
  287.                                 <li class="list-group-item">
  288.                                     <i class="fas fa-check-circle text-success me-2"></i>{% trans %}INSTRUCTORROLEDESCRIPTIONLIST3_KEY{% endtrans %}
  289.                                 </li>
  290.                             </ul>
  291.                         </div>
  293.                         <!-- Content -->
  294.                         <div class="tab-pane fade" id="course-pills-3" role="tabpanel" aria-labelledby="course-pills-tab-3">
  295.                             <h6>{% trans %}STARTWITHCOURSE_KEY{% endtrans %}</h6>
  296.                             <p>
  297.                                 {% trans %}STARTWITHCOURSEDESCRIPTION2_KEY{% endtrans %}
  298.                                 <img src="{{ asset('assets/images/element/instructor-course.svg') }}" class="rounded float-start me-3 h-200px my-3" alt="..."> {% trans %}STARTWITHCOURSEDESCRIPTION2_KEY{% endtrans %}
  299.                                 <u>{% trans %}STARTWITHCOURSEDESCRIPTION3_KEY{% endtrans %}</u>  
  300.                                 {% trans %}STARTWITHCOURSEDESCRIPTION4_KEY{% endtrans %}
  301.                             </p>
  302.                         </div>
  303.                     </div>
  304.                     <!-- Tab contents END -->
  305.                 </div>
  306.                 <!-- Tabs END -->
  307.             </div>
  308.         </div>
  309.     </section>
  310.     <!-- =======================
  311.     Form and Tabs END -->
  313.     <!-- =======================
  314.     Action box START -->
  315.     <section class="pt-0">
  316.         <div class="container position-relative">
  317.             <!-- SVG -->
  318.             <figure class="position-absolute top-50 start-50 translate-middle ps-3">
  319.                 <svg class="fill-white opacity-2">
  320.                     <path d="m496 22.999c0 10.493-8.506 18.999-18.999 18.999s-19-8.506-19-18.999 8.507-18.999 19-18.999 18.999 8.506 18.999 18.999z"/>
  321.                     <path d="m775 102.5c0 5.799-4.701 10.5-10.5 10.5-5.798 0-10.499-4.701-10.499-10.5 0-5.798 4.701-10.499 10.499-10.499 5.799 0 10.5 4.701 10.5 10.499z"/>
  322.                     <path d="m192 102c0 6.626-5.373 11.999-12 11.999s-11.999-5.373-11.999-11.999c0-6.628 5.372-12 11.999-12s12 5.372 12 12z"/>
  323.                     <path d="m20.499 10.25c0 5.66-4.589 10.249-10.25 10.249-5.66 0-10.249-4.589-10.249-10.249-0-5.661 4.589-10.25 10.249-10.25 5.661-0 10.25 4.589 10.25 10.25z"/>
  324.                 </svg>
  325.             </figure>
  327.             <div class="bg-dark p-4 p-sm-5 rounded-3">
  328.                 <div class="row justify-content-center position-relative">
  329.                     <!-- Svg -->
  330.                     <figure class="position-absolute top-50 start-0 translate-middle-y">
  331.                         <svg width="141px" height="141px">
  332.                             <path class="fill-white opacity-1" d="M140.520,70.258 C140.520,109.064 109.062,140.519 70.258,140.519 C31.454,140.519 -0.004,109.064 -0.004,70.258 C-0.004,31.455 31.454,-0.003 70.258,-0.003 C109.062,-0.003 140.520,31.455 140.520,70.258 Z"/>
  333.                         </svg>
  334.                     </figure>
  335.                     <!-- Action box -->
  336.                     <div class="col-11 position-relative">
  337.                         <div class="row align-items-center">
  338.                             <!-- Title -->
  339.                             <div class="col-lg-7">
  340.                                 <h3 class="text-white">{% trans %}BECOMEANINSTRUCTOR_KEY{% endtrans %}!</h3>
  341.                                 <p class="text-white mb-3 mb-lg-0">{% trans %}BECOMEANINSTRUCTORLOGINDESCRIPTION_KEY{% endtrans %}</p>
  342.                             </div>
  343.                             <!-- Button -->
  344.                             <div class="col-lg-5 text-lg-end">
  345.                                 <a href="{{ url("app_front_register", {type: 'trainer'}) }}" class="btn btn-lg btn-white mb-0">{% trans %}STARTTEACHINGTODAY_KEY{% endtrans %}</a>
  346.                             </div>
  347.                         </div>
  348.                     </div>
  349.                 </div>
  350.             </div>
  351.         </div>
  352.     </section>
  353.     <!-- =======================
  354.     Action box END -->
  356. {% endblock %}