File: /python/moda/public_html/tech/old/templates/hostx/aboutus.tpl
<div class="cpanel_banner about-us-banner">
<div class="container">
<div class="row">
<div class="col-sm-6">
<div class="left pt-5 mt-2">
<h2>{$LANG.aboutPageTitle}</h2>
<h6>{$LANG.aboutPageSubTitle}</h6>
<p>{$LANG.aboutPageSubTitleP}</p>
<a href="#" class="button04 mt-4">{$LANG.aboutPageGetStartButton}</a>
</div>
</div>
<div class="col-sm-6">
<div class="right">
<img src="{$WEB_ROOT}/templates/{$template}/images/abt-banner-inner.png" alt="lady smiling">
</div>
</div>
</div>
</div>
</div>
<!--see-our-story-about-->
<div class="see-our-story-about">
<div class="container">
<div class="row abt-frst-row">
<div class="col-sm-12">
<h4 ><img src="{$WEB_ROOT}/templates/{$template}/images/coma-about.png" alt="quote icon">{$LANG.aboutPageOurStoryTitle}</h4>
</div>
</div>
<div class="row scnd-frst-row">
<div class="col-sm-4">
<h5>{$LANG.aboutPageOurStorySee}</h5>
</div>
<div class="col-sm-8">
<p>{$LANG.aboutPageOurStorySeeP}</p>
</div>
</div>
<div class="row about-metus-row">
<div class="col-sm-6">
<img src="{$WEB_ROOT}/templates/{$template}/images/about-metus-left.png" alt="group of people">
</div>
<div class="col-sm-6">
<h4>{$LANG.aboutPageMeetUs}</h4>
<p>{$LANG.aboutPageMeetUsP}</p>
<ul>
<li>{$LANG.aboutPageMeetUsLi1}</li>
<li>{$LANG.aboutPageMeetUsLi2}</li>
<li>{$LANG.aboutPageMeetUsLi3}</li>
</ul>
</div>
</div>
</div>
</div>
<!--see-our-story-about-->
<!--about-why-choose-us-->
<div class="about-why-choose-us">
<div class="container">
<div class="row choose-us-row">
<div class="col-sm-12">
<h2>{$LANG.aboutPagewhychoose}</h2>
<p>{$LANG.aboutPagewhychooseP}</p>
</div>
</div>
<div class="row choose-us-row-two">
<div class="col-sm-4">
<div class="why-choose-inner-abt border-yellow">
<img src="{$WEB_ROOT}/templates/{$template}/images/why-choos-icon-1.png" alt="resposnive icons">
<h5>{$LANG.aboutPagewhychoose1}</h5>
<p>{$LANG.aboutPagewhychoose2}</p>
</div>
</div>
<div class="col-sm-4">
<div class="why-choose-inner-abt border-light-yellow">
<img src="{$WEB_ROOT}/templates/{$template}/images/why-choos-icon-2.png" alt="24*7 icon">
<h5>{$LANG.aboutPagewhychoose3}</h5>
<p>{$LANG.aboutPagewhychoose4}</p>
</div>
</div>
<div class="col-sm-4">
<div class="why-choose-inner-abt border-light-blue">
<img src="{$WEB_ROOT}/templates/{$template}/images/why-choos-icon-3.png" alt="safe and secure">
<h5>{$LANG.aboutPagewhychoose5}</h5>
<p>{$LANG.aboutPagewhychoose6}</p>
</div>
</div>
</div>
</div>
</div>
<!--about-why-choose-us-->
<!-- wetackcareforupgrade-->
<div class="wetackcareforupgrade">
<div class="container">
<div class="row maintenance-inner-text-row">
<div class="col-sm-6">
<h4>{$LANG.aboutPageWeTakeCareHead}</h4>
<p>{$LANG.aboutPageWeTakeCareHeadP}</p>
</div>
<div class="col-sm-6">
<div class="maintenance-inner-img">
<img src="{$WEB_ROOT}/templates/{$template}/images/we-take-care-img.png" alt="user seeing computer">
</div>
</div>
</div>
</div>
</div>
<!-- wetackcareforupgrade-->
<!-- wetackcareforupgrade-->
<div class="wetackcareforupgrade">
<div class="container">
<div class="row maintenance-inner-text-row">
<div class="col-sm-6">
<div class="maintenance-inner-img m-i-img">
<img src="{$WEB_ROOT}/templates/{$template}/images/award-wining-supports.png" alt="lady support image">
</div>
</div>
<div class="col-sm-6">
<h4>{$LANG.aboutPageAwardWiningHead}</h4>
<p>{$LANG.aboutPageAwardWiningHeadP}</p>
<ul>
<li>{$LANG.aboutPageAwardWiningHeadLi1}</li>
<li>{$LANG.aboutPageAwardWiningHeadLi2}</li>
<li>{$LANG.aboutPageAwardWiningHeadLi3}</li>
</ul>
</div>
</div>
</div>
</div>
<!-- wetackcareforupgrade-->
<!--website-rating-->
<div class="website-rating">
<div class="container">
<div class="row choose-us-row">
<div class="col-sm-12">
<div class="rating-box">
<div class="line-1sh"></div>
<div class="line-2sh"></div>
<div class="ratinginner">
<img src="{$hostx_theme_settings.header_logo}" alt="{$companyname}">
<h4>{$LANG.aboutPageWebsiteRateHead}</h4>
<h2>{$LANG.aboutPageWebsiteRateNumber}</h2>
<img class="star-im" src="{$WEB_ROOT}/templates/{$template}/images/star-img-rat.png" alt="review icon">
<h5>{$LANG.aboutPageWebsiteRateReview}</h5>
<a href="#" class="button04 button05 mt-4">{$LANG.aboutPageGetStartButton}</a>
</div>
</div>
</div>
</div>
</div>
</div>
<!--website-rating-->
<!-- great-service-->
<div class="great-service">
<div class="container">
<div class="row great-service-row">
<h2>{$LANG.aboutPageTeamHead}</h2>
<div class="col-sm-3">
<div class="maintenance-inner-img">
<img src="{$WEB_ROOT}/templates/{$template}/images/great-services-peoples-1.png" alt="user image">
<h5>{$LANG.aboutPageTeamHeadMember1Name}</h5>
<p>{$LANG.aboutPageTeamHeadMember1Position}</p>
<ul class="list-inline">
<li class="list-inline-item"><a href="#"><i class="fa fa-twitter" aria-hidden="true"></i></a></li>
<li class="list-inline-item"><a href="#"><i class="fa fa-instagram" aria-hidden="true"></i></a></li>
</ul>
</div>
</div>
<div class="col-sm-3">
<div class="maintenance-inner-img">
<img src="{$WEB_ROOT}/templates/{$template}/images/great-services-peoples-2.png" alt="user image">
<h5>{$LANG.aboutPageTeamHeadMember2Name}</h5>
<p>{$LANG.aboutPageTeamHeadMember2Position}</p>
<ul class="list-inline">
<li class="list-inline-item"><a href="#"><i class="fa fa-twitter" aria-hidden="true"></i></a></li>
<li class="list-inline-item"><a href="#"><i class="fa fa-instagram" aria-hidden="true"></i></a></li>
</ul>
</div>
</div>
<div class="col-sm-3">
<div class="maintenance-inner-img">
<img src="{$WEB_ROOT}/templates/{$template}/images/great-services-peoples-3.png" alt="user image">
<h5>{$LANG.aboutPageTeamHeadMember3Name}</h5>
<p>{$LANG.aboutPageTeamHeadMember3Position}</p>
<ul class="list-inline">
<li class="list-inline-item"><a href="#"><i class="fa fa-twitter" aria-hidden="true"></i></a></li>
<li class="list-inline-item"><a href="#"><i class="fa fa-instagram" aria-hidden="true"></i></a></li>
</ul>
</div>
</div>
<div class="col-sm-3">
<div class="maintenance-inner-img">
<img src="{$WEB_ROOT}/templates/{$template}/images/great-services-peoples-4.png" alt="user image">
<h5>{$LANG.aboutPageTeamHeadMember4Name}</h5>
<p>{$LANG.aboutPageTeamHeadMember4Position}</p>
<ul class="list-inline">
<li class="list-inline-item"><a href="#"><i class="fa fa-twitter" aria-hidden="true"></i></a></li>
<li class="list-inline-item"><a href="#"><i class="fa fa-instagram" aria-hidden="true"></i></a></li>
</ul>
</div>
</div>
<div class="col-sm-3">
<div class="maintenance-inner-img">
<img src="{$WEB_ROOT}/templates/{$template}/images/great-services-peoples-5.png" alt="user image">
<h5>{$LANG.aboutPageTeamHeadMember5Name}</h5>
<p>{$LANG.aboutPageTeamHeadMember5Position}</p>
<ul class="list-inline">
<li class="list-inline-item"><a href="#"><i class="fa fa-twitter" aria-hidden="true"></i></a></li>
<li class="list-inline-item"><a href="#"><i class="fa fa-instagram" aria-hidden="true"></i></a></li>
</ul>
</div>
</div>
<div class="col-sm-3">
<div class="maintenance-inner-img">
<img src="{$WEB_ROOT}/templates/{$template}/images/great-services-peoples-6.png" alt="user image">
<h5>{$LANG.aboutPageTeamHeadMember6Name}</h5>
<p>{$LANG.aboutPageTeamHeadMember6Position}</p>
<ul class="list-inline">
<li class="list-inline-item"><a href="#"><i class="fa fa-twitter" aria-hidden="true"></i></a></li>
<li class="list-inline-item"><a href="#"><i class="fa fa-instagram" aria-hidden="true"></i></a></li>
</ul>
</div>
</div>
<div class="col-sm-3">
<div class="maintenance-inner-img">
<img src="{$WEB_ROOT}/templates/{$template}/images/great-services-peoples-7.png" alt="user image">
<h5>{$LANG.aboutPageTeamHeadMember7Name}</h5>
<p>{$LANG.aboutPageTeamHeadMember7Position}</p>
<ul class="list-inline">
<li class="list-inline-item"><a href="#"><i class="fa fa-twitter" aria-hidden="true"></i></a></li>
<li class="list-inline-item"><a href="#"><i class="fa fa-instagram" aria-hidden="true"></i></a></li>
</ul>
</div>
</div>
<div class="col-sm-3">
<div class="maintenance-inner-img">
<img src="{$WEB_ROOT}/templates/{$template}/images/great-services-peoples-8.png" alt="user image">
<h5>{$LANG.aboutPageTeamHeadMember8Name}</h5>
<p>{$LANG.aboutPageTeamHeadMember8Position}</p>
<ul class="list-inline">
<li class="list-inline-item"><a href="#"><i class="fa fa-twitter" aria-hidden="true"></i></a></li>
<li class="list-inline-item"><a href="#"><i class="fa fa-instagram" aria-hidden="true"></i></a></li>
</ul>
</div>
</div>
</div>
</div>
</div>
<!-- great-service-->
<!-- frequently-questions-->
<div class="frequently-questions">
<div class="container">
<div class="row frequently-questions-row">
<h2>{$LANG.aboutPageFaqHead}</h2>
<div class="col-sm-12">
<div class="accordion-container-main">
<!--Accordion wrapper-->
<div class="accordion md-accordion" id="accordionEx1" role="tablist" aria-multiselectable="true">
<!-- Accordion card -->
<div class="card">
<!-- Card header -->
<div class="card-header" role="tab" id="headingTwo1">
<a class="collapsed" data-toggle="collapse" data-parent="#accordionEx1" href="#collapseTwo"
aria-expanded="false" aria-controls="collapseTwo1">
<h5 class="mb-0">{$LANG.aboutPageFaqAccord1Head}</h5>
</a>
</div>
<!-- Card body -->
<div id="collapseTwo" class="collapse" role="tabpanel" aria-labelledby="headingTwo1" data-parent="#accordionEx1">
<div class="card-body">{$LANG.aboutPageFaqAccord1Body}</div>
</div>
</div>
<!-- Accordion card -->
<!-- Accordion card -->
<div class="card current">
<!-- Card header -->
<div class="card-header" role="tab" id="headingTwo1">
<a class="collapsed" data-toggle="collapse" data-parent="#accordionEx1" href="#collapseTwo1"
aria-expanded="false" aria-controls="collapseTwo1">
<h5 class="mb-0">{$LANG.aboutPageFaqAccord2Head}</h5>
</a>
</div>
<!-- Card body -->
<div id="collapseTwo1" class="collapse show" role="tabpanel" aria-labelledby="headingTwo1" data-parent="#accordionEx1">
<div class="card-body">{$LANG.aboutPageFaqAccord2Body}</div>
</div>
</div>
<!-- Accordion card -->
<!-- Accordion card -->
<div class="card">
<!-- Card header -->
<div class="card-header" role="tab" id="headingTwo1">
<a class="collapsed" data-toggle="collapse" data-parent="#accordionEx1" href="#collapseThree"
aria-expanded="false" aria-controls="collapseTwo1">
<h5 class="mb-0">{$LANG.aboutPageFaqAccord3Head}</h5>
</a>
</div>
<!-- Card body -->
<div id="collapseThree" class="collapse" role="tabpanel" aria-labelledby="headingTwo1" data-parent="#accordionEx1">
<div class="card-body">{$LANG.aboutPageFaqAccord3Body}</div>
</div>
</div>
<!-- Accordion card -->
<!-- Accordion card -->
<div class="card">
<!-- Card header -->
<div class="card-header" role="tab" id="headingTwo1">
<a class="collapsed" data-toggle="collapse" data-parent="#accordionEx1" href="#headingfour"
aria-expanded="false" aria-controls="collapseTwo1">
<h5 class="mb-0">{$LANG.aboutPageFaqAccord4Head}</h5>
</a>
</div>
<!-- Card body -->
<div id="headingfour" class="collapse" role="tabpanel" aria-labelledby="headingTwo1" data-parent="#accordionEx1">
<div class="card-body">{$LANG.aboutPageFaqAccord4Body}</div>
</div>
</div>
<!-- Accordion card -->
<!-- Accordion card -->
<div class="card">
<!-- Card header -->
<div class="card-header" role="tab" id="headingTwo1">
<a class="collapsed" data-toggle="collapse" data-parent="#accordionEx1" href="#collapsefive"
aria-expanded="false" aria-controls="collapseTwo1">
<h5 class="mb-0">{$LANG.aboutPageFaqAccord5Head}</h5>
</a>
</div>
<!-- Card body -->
<div id="collapsefive" class="collapse" role="tabpanel" aria-labelledby="headingTwo1" data-parent="#accordionEx1">
<div class="card-body">{$LANG.aboutPageFaqAccord5Body}</div>
</div>
</div>
<!-- Accordion card -->
</div>
<!-- Accordion wrapper -->
</div>
</div>
</div>
</div>
</div>
<!-- frequently-questions-->
<div class="get_started">
<div class="container">
<h1>{$LANG.aboutPageFooterTagLine}</h1> <button href="#" class="button01">{$LANG.aboutPageGetStartButton}</button>
</div>
</div>
<script type="text/javascript">
jQuery('.card').on('click', function(){
jQuery('.card.current').removeClass('current');
jQuery(this).addClass('current');
jQuery('.card').find(".collapse").removeClass('show');
jQuery('.card.current').find(".collapse").addClass('show');
jQuery('.card.current').find(".collapse").css('height', '');
});
</script>