templates/pages/Formation.html.twig line 1

Open in your IDE?
  1. {% extends 'base.html.twig' %}
  3. {% block stylesheets %}
  4. <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.13.1/css/all.min.css"/>
  6.     <style>
  7.         .mobile-version{
  8.             display:none;
  9.         }
  10.         .support-scrollsnap {
  11.             box-shadow: 2px 0px 5px 0px;
  12.             /* border-radius: 26px; */
  13.         }
  14.         
  15.         .slide {
  16.             background-repeat: no-repeat;
  17.             background-size: cover;
  18.             width: 96%;
  19.             height: 577px;
  20.             background-image: url('{{ asset('front/images/Group13111.png') }}');
  21.             padding-bottom:50% !important;
  22.         }
  23.         .objectif {
  24.             background-repeat: no-repeat;
  25.             background-size: cover;
  26.             width: revert;
  27.             /*height: 600px;*/
  28.             background-image: url('{{ asset('front/images/objectif.png') }}')
  29.         }
  30.         .travel {
  32.             background-repeat: no-repeat;
  33.             background-size: cover;
  34.             width: revert;
  35.             height: 250px;
  36.             background-image: url('{{ asset('front/images/travel.png') }}')
  37.         }
  39.         #top {
  41.             /*top: 140px;*/
  42.             margin-top:5%;
  43.             /*padding:1%;*/
  45.         }
  47.         hr {
  48.             width: 36px;
  49.             height: 3px !important;
  50.             background: #00008F;
  51.             margin: 1.5rem 0;
  52.             border: 0;
  53.             opacity: 1;
  54.         }
  56.         .imageslide {
  57.             color: #FFF;
  58.             font-family: Poppins;
  59.             font-size: 40px;
  60.             font-style: normal;
  61.             font-weight: 600;
  62.             line-height: 188%;
  63.         }
  64.         button a {
  65.             color: white;
  66.             font-size: 16px;
  67.             font-weight: 600;
  68.         }
  69.         #btnslide {
  71.             background-color: transparent;
  72.             width: 250px;
  73.             height: 75px;
  75.             position: relative;
  76.             box-shadow: 0 20px 73px rgba(173.19, 173.19, 173.19, 0.50);
  77.             border-radius: 10px;
  78.             border: 2px #FFEE9D solid;
  80.         }
  82.         #btnslide1 {
  83.             background-color: transparent;
  84.             width: 250px;
  85.             height: 75px;
  87.             position: relative;
  89.             border: 2px transparent solid;
  92.         }
  93.         .cont {
  94.             max-width: 800px;
  95.         }
  96.         .header-title {
  97.             color: white;
  98.         }
  99.         .text-after-header {
  100.             color: white;
  101.             font-size: 11px;
  102.             font-weight: 400;
  103.             line-height: 30.08px;
  104.             word-wrap: break-word;
  105.         }
  106.         span.date-filiere {
  107.             margin-left: 15px;
  108.             font-size: 13px;
  109.             font-weight: 300;
  110.         }
  111.         .session {
  112.             text-align: center;
  113.             border-left: 1px solid white;
  114.         }
  115.         i.fas.fa-download {
  116.             color: #FFEE9D;
  117.             font-size: 23px;
  118.             margin-right: 10px;
  119.         }
  120.         i.fas.fa-comment-dots {
  121.             color: #FFEE9D;
  122.             font-size: 23px;
  123.             margin-right: 10px;
  124.         }
  125.         a.btn.btn-download , a.btn.btn-contact {
  126.             color: white;
  127.             font-size: 13px;
  128.         }
  129.         a.btn.btn-contact {
  130.             border: 1px solid white;
  131.             padding: 12px;
  132.             padding-right: 70px;
  133.             padding-left: 70px;
  134.         }
  135.         #nom, #prenom, #email, #message {
  136.             font-size: 12px;
  137.             border: none;
  138.             background: #F8F8F8;
  139.         }
  140.         button#sub-form {
  141.             padding: 4px 40px;
  142.             background: #3e2e6c;
  143.             color: white;
  144.             border: none;
  145.             float: right;
  146.             margin-top: 10px;
  147.         }
  148.         
  149.         /* new style  */
  150.         
  151.  
  153. .scroll-container,
  154. .scroll-area {
  155.   max-width: 850px;
  156.   height: 300px;
  157.   font-size: 60px;
  158. }
  160. .scroll-container {
  161.   overflow: auto;
  162.   -webkit-scroll-snap-type: y mandatory;
  163.       -ms-scroll-snap-type: y mandatory;
  164.           /*scroll-snap-type: y mandatory;*/
  165. }
  167. .scroll-area {
  168.   scroll-snap-align: start;
  169. }
  171. .scroll-container,
  172. .scroll-area {
  173.   margin: 0 auto;
  174. }
  176. .scroll-area {
  177.   align-items: center;
  178.   justify-content: center;
  179.   color: white;
  180. }
  182. .scroll-area:nth-of-type(1) {
  183.   background: #49b293;
  184. }
  186. .col-md-5.col-sm-12 {
  187.     margin-top: 6%;
  188. }
  190. h6.header-title.mb-5 {
  191.     margin-top: 28%;
  192. }
  194. .text-start {
  195.     text-align: left!important;
  196.     margin-top: 15%;
  197. }
  199.         /* end style */
  200.         
  201.         @media only screen and (max-width: 767px) {
  202.             button#sub-form {
  203.                 margin-bottom: 20px;
  204.             }
  205.             #nom, #prenom, #email, #message{
  206.                 margin-bottom:15px;
  207.             }
  208.             .laptop-version {
  209.                 display:none !important;
  210.             }
  211.             .margin-upper-mysection {
  212.                 margin-top: 40%;
  213.             }
  214.             .slide-mobile {
  215.                 height: auto;
  216.                 background: #3e2e6c;
  217.                 text-align: justify;
  218.                 padding-bottom: 50px;
  219.                 margin-bottom: 10%;
  220.             }
  221.             .header-title {
  222.                 color: white;
  223.                 padding-top: 30px;
  224.             }
  225.             .session {
  226.                 text-align: center;
  227.                 border-top: 1px solid white;
  228.                 border-left:none !important;
  229.             }
  230.             .text-after-header{
  231.                 font-size:13px ;
  232.             }
  233.             .mobile-version{
  234.                 display: block !important;
  235.             }
  236.         }
  237.    
  238.     </style>
  239. {% endblock %}
  241. {% block body %}
  243. <div class="margin-upper-mysection"></div>
  244. {# laptop version #}
  245. <div class="laptop-version">
  247.     <section id="top" class="common-sec main-classes-list slide">
  249.         <div class="container">
  250.             <div class="row">
  251.                 <div class="col-md-2"></div>
  253.                 <div class="col-md-8 col-sm-12 text-start">
  255.                     <h3 class="header-title mb-5">BTS Systèmes constructifs bois et habitat (SCBH)</h3>
  256.                     <p class="mt-5 text-after-header">
  257.                               Le titulaire de ce diplôme intervient de la conception technique à la réception des ouvrages de la construction bois. Chaque projet, qu'il soit de construction, de rénovation ou d'extension, le met en relation avec tous les partenaires de l'entreprise (client, fournisseurs, personnel). Son rôle consiste à apporter une réponse technique et économique à une affaire (métré, devis, solutions constructives…). Il élabore le dossier de production avec les notes de calcul. Responsable de chantier, il organise et assure la pose de tous les éléments du bâtiment majoritairement en bois : charpente, couverture, poutres, murs, menuiseries, parquets, portes, fenêtres, agencements extérieurs. Il utilise l'outil informatique (CAO, simulations des comportements et calculs, CFAO, logiciels de calcul de devis, de gestion de chantier…).
  259. Ce professionnel s'insère dans une entreprise artisanale, une TPE, une PME (charpente, enveloppe et vêtures des maisons et bâtiments). Il exerce ses activités en bureau d'études, sur chantier. Il évolue vers des fonctions de conducteur de travaux, de chargé d'affaires, de responsable de projets, responsable de bureau d'études de prix, responsable de fabrication en atelier, responsable de bureau d'études techniques, voire d'adjoint au chef d'entreprise.
  261.                         </p>
  263.                 </div>
  264.                 {#<div class="col-md-3 mt-2 session">#}
  266.                 {#<h6 class="header-title mb-5">Prochaines sessions  :</h6>#}
  267.                 {#{% for session in sessions %}#}
  268.                 {#    <div> <i class="fas fa-calendar-alt mt-3" style="color:white"></i> <span class="date-filiere" style="color:white">{{ session.startAt|date('d M Y-g:s') }}</span>  </div>#}
  269.                 {#{% endfor %}#}
  270.                 
  271.                 {#<div> <i class="fas fa-calendar-alt mt-3" style="color:white"></i> <span class="date-filiere date-filiere" style="color:white">12 Nov 2023 - 08:30 </span>   </div>#}
  272.                 {#<div> <i class="fas fa-calendar-alt mt-3" style="color:white"></i> <span class="date-filiere" style="color:white">12 Nov 2023 - 08:30 </span>   </div>#}
  274.                 {#</div>#}
  276.                 <div class="col-md-2"></div>
  277.             </div>
  278.             {#<div class="row mt-4">#}
  279.             {#    <div class="col-sm-12 text-center">#}
  281.             {#        <a href="#" class="btn btn-download"><i class="fas fa-download"></i> Télécharger la fiche programme</a>#}
  282.             {#        <a href="#" class="btn btn-contact"><i class="fas fa-comment-dots"></i> Contactez-nous</a>#}
  285.             {#    </div>#}
  286.             {#</div>#}
  287.         </div>
  288.         
  291.     </section>
  294.         {# objectif #}
  296.         <section id="top" class="common-sec main-classes-list">
  298.             <div class="container objectif">
  299.                 <div class="row" style="padding-bottom: 5%;">
  300.                     <div class="col-lg-6">
  301.                         <h2>COMPÉTENCES VISÉES</h2>
  302.                         <img style="width: 90%;" src="{{asset('front/images/hr.png') }}" alt="accademy">
  303.                         <p style="color:#8D96B5!important; font-size: 13px;">A l’issue de sa formation, le technicien supérieur SCBH est capable de définir les conditions de réalisation des ouvrages en bois et d’assurer le bon déroulement d’un
  304. chantier. Il travaille dans le bureau d’étude à la réalisation de plan d’exécution, notes de
  305. calcul. Il est capable de chiffrer le projet et d’établir un devis. Il organise les moyens de production, tant au niveau des hommes que des outils et de l’approvisionnement en matière première. Cette formation demande des capacités techniques et humaines pour assumer un rôle d’interlocuteur avec tous les partenaires d’un projet de bâtiment.
  306. </p>
  307.                     </div>
  308.                     <div class="col-lg-6">
  309.                         <div style=" padding: 22px;background: #5821D4;box-shadow: 0px 1px 24px rgba(3, 1, 56, 0.10);border-radius: 5px;">
  310.                             <img style="width: 10%;" src="{{asset('front/images/message.png') }}" alt="accademy"><br>
  311.                             <h6 style="color:white">Pré-requis pour candidater</h6>
  312.                             <p style="color:white !important; font-size: 13px; font-weight: 300;">• Bac professionnel technicien constructeur
  313. bois.<br>
  314. • Bac professionnel technicien menuisier
  315. agenceur.<br>
  316. • Brevet professionnel charpente.<br>
  317. • Bac général à dominante scientifique.<br>
  318. • Bac L et ES avec expérience bois
  319. significative de 3 à 6 mois.<br>
  320. • Bac STI2D option architecture et
  321. construction.<br>
  322. Les candidats doivent vérifier leur éligibilité
  323. au contrat d’apprentissage.<br>
  324. </p>
  326.                         </div>
  328.                     </div>
  329.                 </div>
  330.                 
  331.                 
  332.                 
  333.                 
  334.             
  335.              <div class="row mb-4">
  336.                 
  337.                     
  338.                      
  339.                          <div class="col-lg-4">
  340.                                      <div class="support-scrollsnap">
  341.                             
  342.                                 <div class="scroll-container" style="background: white;">
  343.                                     <div class="scroll-area" style=" padding: 22px;background: white;border-radius: 5px;">
  344.                                         <img style="width: 10%;" src="{{asset('front/images/message.png') }}" alt="accademy">
  345.                                         <h3 style="color: #857d7d;">Métiers et débouchés</h3>
  346.                                          <p style="color:#8D96B5 !important;margin: auto;font-size:13px">Secteurs d’activités
  347. Le technicien supérieur SCBH intervient dans les entreprises qui fabriquent les structures, produits et composants en bois utilisés dans l’habitat. Selon la taille de l’entreprise, le titulaire du brevet de technicien supérieur SCBH exerce tout ou partie de ses activités en bureau d’études, sur chantier ou éventuellement en atelier, avec un niveau de spécialisation et d’autonomie variable.</p>
  348.                                     </div>
  349.                                     <div class="scroll-area" style=" padding: 22px;background: white;box-shadow: 0px 1px 24px rgba(3, 1, 56, 0.10);border-radius: 5px;"></div>
  350.                                 </div>
  351.                             </div>
  352.                           </div>
  353.                          <div class="col-lg-4">
  354.                                      <div class="support-scrollsnap">
  355.                             
  356.                                 <div class="scroll-container" style="background: white;">
  357.                                     <div class="scroll-area" style=" padding: 22px;background: white;border-radius: 5px;">
  358.                                         <img style="width: 10%;" src="{{asset('front/images/message.png') }}" alt="accademy">
  359.                                         <h3 style="color: #857d7d;">Fonctions exercées</h3>
  360.                                          <p style="color:#8D96B5 !important;margin: auto;font-size:13px">• Conducteur de travaux.<br>
  361. • Chargé d’affaires.<br>
  362. • Responsable de projets.<br>
  363. • Responsable de bureau d’études de prix.<br>
  364. • Responsable de fabrication en atelier.<br>
  365. • Responsable de bureau d’études
  366. techniques<br>
  367. • Adjoint au dirigeant de l’entreprise.<br>
  368. • Reprise ou création d’entreprise.<br>
  370. </p>
  371.                                     </div>
  372.                                     <div class="scroll-area" style=" padding: 22px;background: white;box-shadow: 0px 1px 24px rgba(3, 1, 56, 0.10);border-radius: 5px;"></div>
  373.                                 </div>
  374.                             </div>
  375.                           </div>
  376.                            <div class="col-lg-4">
  377.                                      <div class="support-scrollsnap">
  378.                             
  379.                                 <div class="scroll-container" style="background: white;">
  380.                                     <div class="scroll-area" style=" padding: 22px;background: white;border-radius: 5px;">
  381.                                         <img style="width: 10%;" src="{{asset('front/images/message.png') }}" alt="accademy">
  382.                                         <h3 style="color: #857d7d;">Poursuite d’études</h3>
  383.                                          <p style="color:#8D96B5 !important;margin: auto;font-size:13px">• Licence professionnelle construction bois.<br>
  384. • Classe préparatoire ATS génie civil.<br>
  385. • Pour les meilleurs apprentis, il est possible<br>
  386. de continuer vers un diplôme d’ingénieur.
  388. </p>
  389.                                     </div>
  390.                                     <div class="scroll-area" style=" padding: 22px;background: white;box-shadow: 0px 1px 24px rgba(3, 1, 56, 0.10);border-radius: 5px;"></div>
  391.                                 </div>
  392.                             </div>
  393.                           </div>
  394.                      
  395.                         
  396.                              
  397.                    
  398.             </div>  
  399.             <div class="row mb-4">
  400.                      
  401.                          <div class="col-lg-4">
  402.                                      <div class="support-scrollsnap">
  403.                             
  404.                                 <div class="scroll-container" style="background: white;">
  405.                                     <div class="scroll-area" style=" padding: 22px;background: white;border-radius: 5px;">
  406.                                         <img style="width: 10%;" src="{{asset('front/images/message.png') }}" alt="accademy">
  407.                                         <h3 style="color: #857d7d;font-size:25px;">Contrôle en cours de formation</h3>
  408.                                          <p style="color:#8D96B5 !important;margin: auto;font-size:13px"> anglais/espagnol, mathématiques physique chimie, expérimentation et mise en œuvre 
  409.                                         </p>
  410.                                     </div>
  411.                                     <div class="scroll-area" style=" padding: 22px;background: white;box-shadow: 0px 1px 24px rgba(3, 1, 56, 0.10);border-radius: 5px;"></div>
  412.                                 </div>
  413.                             </div>
  414.                           </div>
  415.                          <div class="col-lg-4">
  416.                                      <div class="support-scrollsnap">
  417.                             
  418.                                 <div class="scroll-container" style="background: white;">
  419.                                     <div class="scroll-area" style=" padding: 22px;background: white;border-radius: 5px;">
  420.                                         <img style="width: 10%;" src="{{asset('front/images/message.png') }}" alt="accademy">
  421.                                         <h3 style="color: #857d7d;">Épreuves ponctuelles </h3>
  422.                                          <p style="color:#8D96B5 !important;margin: auto;font-size:13px">culture générale et expression française, étude technico-économique (répondre à une affaire, analyse dimensionnement et choix des composants), conception et suivi de chantier (conception de systèmes constructifs bois, suivi de chantier)
  423. </p>
  424.                                     </div>
  425.                                     <div class="scroll-area" style=" padding: 22px;background: white;box-shadow: 0px 1px 24px rgba(3, 1, 56, 0.10);border-radius: 5px;"></div>
  426.                                 </div>
  427.                             </div>
  428.                           </div>
  429. {#                           <div class="col-lg-4">#}
  430. {#                                     <div class="support-scrollsnap">#}
  431.                             
  432. {#                                <div class="scroll-container" style="background: white;">#}
  433. {#                                    <div class="scroll-area" style=" padding: 22px;background: white;border-radius: 5px;">#}
  434. {#                                        <img style="width: 10%;" src="{{asset('front/images/message.png') }}" alt="accademy">#}
  435. {#                                        <h3 style="color: #857d7d;">Accessibilité aux PMR</h3>#}
  436. {#                                         <p style="color:#8D96B5 !important;margin: auto;font-size:13px">Prévention des Risques Professionnels<br>#}
  438. {#■ Préparation au profil opérateur de l'Autorisation d'Intervention à Proximité des<br>#}
  439. {#Réseaux (Aérien)<br>#}
  440. {#■ Application des principes de prévention des risques CMR<br>#}
  441. {#■ Préparation à l'habilitation électrique B0 conformément à la norme NF C 18-510<br>#}
  442. {#■ Préparation à l'habilitation électrique H0 conformément à la norme NF C 18-510<br>#}
  443. {#■ Préparation au certificat de prévention des risques liés à l'activité physique pour<br>#}
  444. {#une opération - formation initiale<br>#}
  445. {#■ Préparation à l'attestation d’utilisation d’échafaudages de pied (R408 – annexe#}
  446. {#5)<br>#}
  447. {#■ Préparation au certificat de Sauveteur Secouriste du Travail - formation initiale#}
  449. {#</p>#}
  450. {#                                    </div>#}
  451. {#                                    <div class="scroll-area" style=" padding: 22px;background: white;box-shadow: 0px 1px 24px rgba(3, 1, 56, 0.10);border-radius: 5px;"></div>#}
  452. {#                                </div>#}
  453. {#                            </div>#}
  454. {#                          </div>#}
  455.                         
  456.                
  457.             </div>
  458.             </div>        
  459.             
  460.                 <br>
  461.                 
  462.                 </div>
  463.             </div>
  464.         </section>
  466.         
  467.         
  468.         {# blog #}
  469. </div>
  471. {# mobile version #}
  472. <div class="mobile-version">
  473.     
  474.     <section class="slide-mobile">
  475.         <div class="container">
  476.             <h3 class="header-title mb-5 text-center">Filiére Menuiserie</h3>
  477.             <p class="mt-5 text-after-header">
  478.                         Le titulaire du Brevet professionnel Menuisier est un professionnel hautement qualifié de la menuiserie et de l'agencement qui intervient en atelier et sur chantier pour fabriquer et mettre en œuvre différents ouvrages de menuiserie extérieure et intérieure ainsi que tout aménagement de pièce, bureau, cuisine, salle de bains, magasin, salle d'exposition, lieux de réunion et d'accueil de publics...Il est également susceptible d'effectuer des opérations de rénovation des ouvrages courants de la profession mais, aussi, de réhabilitation de ceux qui font partie du patrimoine et des monuments historiques.
  479.                 </p>
  480.                 
  481.                 <div class="session">
  483.                     <h6 class="header-title mb-5">Prochaines sessions  :</h6>
  484.                     <div> <i class="fas fa-calendar-alt mt-3" style="color:white" aria-hidden="true"></i> <span class="date-filiere" style="color:white">12 Nov 2023 - 08:30 </span>  </div>
  485.                     <div> <i class="fas fa-calendar-alt mt-3" style="color:white" aria-hidden="true"></i> <span class="date-filiere date-filiere" style="color:white">12 Nov 2023 - 08:30 </span>   </div>
  486.                     <div> <i class="fas fa-calendar-alt mt-3" style="color:white" aria-hidden="true"></i> <span class="date-filiere" style="color:white">12 Nov 2023 - 08:30 </span>   </div>
  487.                     
  488.                 </div>
  489.                 <div class="text-center">
  490.                      <a href="#" class="btn btn-contact mt-5"><i class="fas fa-comment-dots" aria-hidden="true"></i> Contactez-nous</a>
  491.                     <a href="#" class="btn btn-download mt-3"><i class="fas fa-download" aria-hidden="true"></i> Télécharger la fiche programme</a>
  492.                    
  495.                 </div>
  496.                 
  497.                 
  498.                         
  499.                 
  500.         </div>
  501.     </section>
  502.     
  503.     <section class="second-section">
  504.         
  505.         <div class="container">
  506.             <h2>Filière Menuiserie </h2>
  507.             <img style="width: 65%;" src="/front/images/hr.png" alt="accademy">
  508.             <p style="color:#8D96B5!important; font-size: 13px;">Lorem ipsum dolor psooLorem ipsum dolor psooLorem ipsum dolor psooLorem ipsum dolor psooLorem ipsum dolor psooLorem ipsum dolor psooLorem ipsum dolor psooLorem ipsum dolor psooLorem ipsum dolor psooLorem ipsum dolor psoo</p>
  509.             
  510.             <div style=" padding: 22px;background: #3e2e6c ;box-shadow: 0px 1px 24px rgba(3, 1, 56, 0.10);border-radius: 5px;margin-bottom: 10%;">
  511.                             <img style="width: 10%;" src="/front/images/message.png" alt="accademy"><br>
  512.                             <h6 style="color:white;margin-top: 5%;">Délais d’accès aux formations</h6>
  513.                             <p style="color:white !important; font-size: 13px; font-weight: 300;">Adapté la formation aux métiers existants · Formation en lien avec les besoins nationaux · Insertion et Reconversion, Accessibilité</p>
  515.             </div>
  516.             
  517.             
  518.                         <div class="support-scrollsnap mb-5">
  519.                         
  520.                             <div class="scroll-container" style="background: white;">
  521.                                 <div class="scroll-area" style=" padding: 22px;background: white;border-radius: 5px;">
  522.                                     <img style="width: 10%;" src="/front/images/message.png" alt="accademy">
  523.                                     <h3 style="color: #857d7d;">Prérequis</h3>
  524.                                      <p style="color:#8D96B5 !important;margin: auto;font-size:13px"></p>
  525.                                 </div>
  526.                             </div>
  527.                         </div>
  528.             
  529.                          <div class="support-scrollsnap mb-5">
  530.                         
  531.                             <div class="scroll-container" style="background: white;">
  532.                                 <div class="scroll-area" style=" padding: 22px;background: white;border-radius: 5px;">
  533.                                     <img style="width: 10%;" src="/front/images/message.png" alt="accademy">
  534.                                     <h4 style="color: #857d7d;">Modalités d’évaluation</h4>
  535.                                      <p style="color:#8D96B5 !important;margin: auto;font-size:13px">Évaluation formative tout au long de la formation : questionnaires, études de cas, réalisations pratiques<br>Évaluation certificative conforme aux modalités de l’organisme certificateur :<br> Apprentis : Contrôle en Cours de Formation ou épreuves ponctuelles<br> Stagiaires de la Formation Professionnelle Continue : épreuves ponctuelles<br> Domaine professionnel :<br>■ U11 Analyse d’un ouvrage et choix de solutions technologiques<br>■ U12 Préparation d’une fabrication et d’une mise en œuvre sur chantier<br>■ U13 Réalisation et suivi des ouvrages en entreprise<br>■ U20 Fabrication d’un ouvrage<br>■ U30 Mise en œuvre d’un ouvrage sur chantier<br> Domaine général :<br>■ U40 Étude mathématique et scientifique<br>■ U50 Expression et connaissance du Monde<br>■ U60 Langue vivante étrangère<br>Formation inscrite au RNCP permettant la validation d’un ou plusieurs blocs de compétences (Code RNCP : 18317 ) + d’infos sur certificationprofessionnelle.fr</p>
  536.                                 </div>
  537.                              </div>
  538.                         </div>            
  539.                         
  540.                         <div class="support-scrollsnap mb-5">
  541.                         
  542.                             <div class="scroll-container" style="background: #3e2e6c;">
  543.                                 <div class="scroll-area" style=" padding: 22px;background: #3e2e6c;border-radius: 5px;">
  544.                                     <img style="width: 10%;" src="/front/images/message.png" alt="accademy">
  545.                                     <h3 style="color: white;">Modalités</h3>
  546.                                      <p style="color:white !important;margin: auto;font-size:13px;">Adapté la formation aux métiers existants · Formation en lien avec les besoins nationaux · Insertion et Reconversion, Accessibilité· Adapté la formation aux métiers existants · Formation en lien avec les besoins nationaux · Insertion et Reconversion, Accessibilité · Adapté la formation aux métiers existants · Formation en lien avec les besoins nationaux · Insertion et Reconversion, Accessibilité· Adapté la formation aux métiers existants · Formation en lien avec les besoins nationaux · Insertion et Reconversion, Accessibilité</p>
  547.                                 </div>
  548.                              </div>
  549.                         </div>
  550.                         
  551.                         <div class="support-scrollsnap mb-4">
  552.                         
  553.                             <div class="scroll-container" style="background: white;">
  554.                                 <div class="scroll-area" style=" padding: 22px;background:white;border-radius: 5px;">
  555.                                     <img style="width: 10%;" src="/front/images/message.png" alt="accademy">
  556.                                     <h4 style="color: #857d7d;">Contrôle en cours de formation</h4>
  557.                                      <p style="color:#8D96B5 !important;margin: auto;font-size:13px"> anglais/espagnol, mathématiques physique chimie, expérimentation et mise en œuvre </p>
  558.                                 </div>
  559.                              </div>
  560.                         </div>
  561.                         
  562.                         
  563.                         <div class="support-scrollsnap mb-4">
  564.                         
  565.                             <div class="scroll-container" style="background: white;">
  566.                                 <div class="scroll-area" style=" padding: 22px;background:white;border-radius: 5px;">
  567.                                     <img style="width: 10%;" src="/front/images/message.png" alt="accademy">
  568.                                     <h4 style="color: #857d7d;">Accessibilité aux PMR</h4>
  569.                                      <p style="color:#8D96B5 !important;margin: auto;font-size:13px">Adapté la formation aux métiers existants · Formation en lien avec les besoins nationaux · Insertion et Reconversion, Accessibilité· Adapté la formation aux métiers existants · Formation en lien avec les besoins nationaux · Insertion et Reconversion, Accessibilité · Adapté la formation aux métiers existants · Formation en lien avec les besoins nationaux · Insertion et Reconversion, Accessibilité· Adapté la formation aux métiers existants · Formation en lien avec les besoins nationaux · Insertion et Reconversion, Accessibilité</p>
  570.                                 </div>
  571.                             </div>
  572.                         </div>
  573.                         
  574.         </div>
  575.         {#end container#}
  576.        
  577.        
  578.                     
  579.     </section>
  580.     <section id="top" class="common-sec main-classes-list third-section">
  581.             <div class="container cont">
  582.                 <div class="row">
  583.                     <h2>Setup Academy :
  584.                         <br><b>Contenu de la formation</b>
  585.                     </h2><br>
  586.                     <img style="margin-bottom: 40px;width: 50%;" src="/front/images/hr.png" alt="accademy">
  587.                     <p style="color:#8D96B5!important;font-size:14px; font-weight:300;     text-align: justify;">Lorem ipsum dolor psooLorem ipsum dolor psooLorem ipsum dolor psooLorem ipsum dolor psooLorem ipsum dolor psooLorem ipsum dolor psooLorem ipsum dolor psooLorem ipsum dolor Lorem ipsum dolor psooLorem ipsum dolor psooLorem ipsum dolor psooLorem ipsum dolor psooLorem ipsum dolor psooLorem ipsum dolor psooLorem ipsum dolor psooLorem ipsum dolor Lorem ipsum dolor psooLorem ipsum dolor psooLorem ipsum dolor psooLorem ipsum dolor psooLorem ipsum dolor psooLorem ipsum dolor psooLorem ipsum dolor psooLorem ipsum dolor Lorem ipsum dolor psooLorem ipsum dolor psooLorem ipsum dolor psooLorem ipsum dolor psooLorem ipsum dolorum dolor psooLorem ipsum dolor psooLorem ipsum dolor psooLorem ipsum dolor psooLorem ipsum dolor psooLorem ipsum dolor psooLorem ipsum dolor Lorem ipsum dolor psooLorem ipsum dolor psooLorem ipsum dolor psooLorem ipsum dolor psooLorem ipsum dolor psooLorem ipsum dolor psooLorem ipsum dolor psooLorem ipsum dolor Lorem ipsum dolor psooLorem ipsum dolor psooLorem ipsum dolor psooLorem ipsum dolor psooLorem ipsum dolor psooLorem ipsum dolor psooLorem ipsum dolor psooLorem ipsum dolor Lorem ipsum dolor psooLorem ipsum dolor psooLorem ipsum dolor psooLorem ipsum dolor psooLorem ipsum dolor psooLorem ipsum dolor psooLorem ipsum dolor psooLorem ipsum dolor </p>
  588.                 </div>
  589.             </div>
  590.         </section>
  591.         
  592.     <section class="common-sec main-our-blog">
  593.             <div class="container">
  594.                 <div class="row">
  595.                     <div class="col-md-8 col-sm-12">
  596.                         <h6 style="color:black; font-weight:bold" class="contact-title">Contactez-nous</h6>
  597.                         <span style="padding: 0px;border-bottom: 2px solid #00008F;padding-left: 36px;position: relative;top: -20px !important;"> </span>
  598.                         <p style="color:#8D96B5!important;font-size:14px; font-weight:300"> N'hésitez pas à nous contacter pour toute question ou demande d'information. Nous reviendrons vers vous dans les plus brefs délais. </p>
  599.                         <form>
  600.                         <div class="row">
  601.                             <div class="col-sm-4">
  602.                                 <input type="text" class="form-control" id="nom" placeholder="Nom">
  603.                             </div>
  604.                             <div class="col-sm-4">
  605.                                  <input type="text" class="form-control" id="prenom" placeholder="Prénom">
  606.                             </div>
  607.                             <div class="col-sm-4">
  608.                                 <input type="email" class="form-control" id="email" placeholder="email@example.com">
  609.                             </div>
  610.                              
  611.                         </div>
  612.                         <div class="row mt-4">
  613.                            <div class="col-sm-12">
  614.                                <textarea style="height:100px" class="form-control" id="message" placeholder="Message"></textarea>
  615.                                <button type="submit" id="sub-form" style="background: #3e2e6c;font-size: 12px;font-weight: 300;">Envoyer <i class="fas fa-chevron-right"></i></button>
  616.                            </div>
  617.                         </form>
  618.                     </div>
  619.                     <div class="col-md-4 col-sm-12" style="background:#FFF9E2;text-align:center">
  620.                         <h6 style="color:black; margin-top:40px">Adresse</h6>
  621.                         <span style="padding: 0px;border-bottom: 2px solid #00008F;padding-left: 36px;position: relative;top: -20px !important;"> </span>
  622.                           <p style="color:#8D96B5!important;font-size:14px; font-weight:300">SETUP Paris - 8 avenue président Salvador Allende - 94400 Vitry sur Seine</p>
  624.                           <p style="color:black; margin-top:30px; font-size: 12px;">(+212) 6 30 81 18 62</p>
  625.                           <p style="color:black; margin-top:8px; font-size: 12px;">direction@smartcraft-academy.fr</p>
  627.                         
  628.                     </div>
  629.                 </div>
  630.                 
  631.             </div>
  632.     </section>
  633. </div>
  635. {% endblock %}