description = "Mission & Vision"

[staticPage]
useContent = 0
default = 0
==
<?php
use System\Classes\CombineAssets;
  function onStart(){
    $css = ['assets/css/about.css', 'assets/video/videojs.min.css'];
    $scripts = ['assets/video/videojs.min.js', 'assets/video/youtube.min.js', 'assets/javascript/scrollbooster.min.js', 'assets/javascript/about.js'];
    $this->addCss(CombineAssets::combine($css, base_path('themes/linus')));
    $this->addJs(CombineAssets::combine($scripts, base_path('themes/linus')));
  }
?>
==
{% partial 'site/head' %}
{% partial 'site/header' %}
{% component 'staticPage' %}
{variable tab="Hero" type="mediafinder" mode="image" name="heroImage" label="Image" span="full" comment="1300px X 500px"}{/variable}
{variable tab="Hero" label="Header" type="text" name="heroHeader" span="left"}{/variable}
{% partial 'hero-banner' %}
<div class="row noPM section-pad-3 mission">
  <div class="bg-pattern"></div>
  <div class="container">
    <div class = "row">
      <ul class="nav-pill flex-con trans">
        <li>
          <a href="{{url('/about')}}">
            <div class = "btn-text-b">BRIEF HISTORY OF MECHATRENDS</div>
          </a>
        </li>
        <li>
          <a href="{{url('/mission-vision')}}">
            <div class = "btn-text-b pill-active">MISSION AND VISION</div>
          </a>
        </li>
        <li>
          <a href="{{url('/organization')}}">
            <div class = "btn-text-b">OUR ORGANIZATION</div>
          </a>
        </li>
         <li>
          <a href="{{url('/corporate-social-responsibility-policy')}}">
            <div class = "btn-text-b">CORPORATE SOCIAL RESPONSIBILITY POLICY</div>
          </a>
        </li>
      </ul>
    </div>
    <div class="row flex-con-stretch">
      <div class="col-sm-6 col-xs-12 mission-base card-shadow">
        {variable tab="Mission Vision" label="Header" type="text" name="mHeader" span="full"}{/variable}
        {variable tab="Mission Vision" label="Content" type="richeditor" name="mContent" span="full"}{/variable}
        <h3 class="block-header text-center">{{mHeader}}</h3>
        <br>
        <div class="p-text">{{mContent|raw}}</div>
      </div>
      <div class="col-sm-6 col-xs-12 vision-base card-shadow">
        {variable tab="Mission Vision" label="Header" type="text" name="vHeader" span="full"}{/variable}
        {variable tab="Mission Vision" label="Content" type="richeditor" name="vContent" span="full"}{/variable}
        <h3 class="block-header text-center">{{vHeader}}</h3>
        <br>
        <div class="p-text">{{vContent|raw}}</div>
      </div>
    </div>
    <div class="row section-pad-3 flex-con soc-res">
      <div class="col-sm-6 col-xs-12">
        {variable tab="Social Responsibility" label="Header" type="text" name="sHeader" span="full"}{/variable}
        {variable tab="Social Responsibility" label="Content" type="richeditor" name="sContent" span="full"}{/variable}
        <h5 class="block-title hidden">SOCIAL RESPONSIBILITY</h5>
        <h3 class="block-header">{{sHeader}}</h3><br>
        <div class="p-text">{{sContent|raw}}</div>
      </div>
      <div class="col-sm-6 col-xs-12">
        {variable tab="Social Responsibility" type="mediafinder" mode="image" name="videoPoster" label="Image" span="full" comment="500px X 500px"}{/variable}
        <div class="abt-video-base-border"></div>
        <div class="abt-video-base bg-img wow fadeInRight" data-wow-delay="1s" id="abt-video-reveal" style="background-image: url({{videoPoster|media}})">
        </div>
      </div>
    </div>
  </div>
</div>
{% partial 'site/footer' %}