<link href="//maxcdn.bootstrapcdn.com/bootstrap/4.1.1/css/bootstrap.min.css" rel="stylesheet" id="bootstrap-css">
<script src="//maxcdn.bootstrapcdn.com/bootstrap/4.1.1/js/bootstrap.min.js"></script>
<script src="//code.jquery.com/jquery-1.11.1.min.js"></script>
<!------ Include the above in your HEAD tag ---------->
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
<!--about us section start from here-->
<div id="aboutUs" class="pb-0">
<div class="container-fluid">
<!--About us header start from here-->
<section class="row">
<article class="col-xl-10 col-12 text-center auto">
<h2 class="headingColor text-uppercase fontWeight800">About Us</h2>
<div class="divider mt-4"></div>
<p class="mt-5 subText">We help you in creating a financial strategy that represents your personality.
Getting to know you is
financial advisor's primary goal. - An approach centered around your life's priorities. It's time for a
Financial strategy that puts your needs and priorities front and center.</p>
</article>
</section>
<!--// About us header end here-->
<div class="boxShadow">
<section class="row mt-5 text-center innerboxShadow">
<article class="col-sm-12 col-md-4 col-lg-4 col-xl-4 p-5">
<i class="fa fa-pie-chart font40" aria-hidden="true"></i>
<h3 class="headingColor fontsize22 fontWeight600">Financial Projections</h3>
<p class="mb-0">Lorem ipsum dolor sit, amet consectetur adipisicing elit. Soluta cumque sapiente vitae
iste sequi.</p>
</article>
<article class="col-sm-12 col-md-4 col-lg-4 col-xl-4 p-5 boxActive">
<i class="fa fa-lightbulb-o font40" aria-hidden="true"></i>
<h3 class="headingColor fontsize22 fontWeight600">Strategy & Consulting</h3>
<p class="mb-0">Lorem ipsum dolor sit, amet consectetur adipisicing elit. Soluta cumque sapiente vitae
iste sequi.</p class="mb-0">
</article>
<article class="col-sm-12 col-md-4 col-lg-4 col-xl-4 p-5">
<i class="fa fa-headphones font40" aria-hidden="true"></i>
<h3 class="headingColor fontsize22 fontWeight600">Online Consulting</h3>
<p class="mb-0">Lorem ipsum dolor sit, amet consectetur adipisicing elit. Soluta cumque sapiente vitae
iste sequi.</p class="mb-0">
</article>
</section>
</div>
</div>
</div>
<!--//about us section end here-->
<!-- Our Industries start form here -->
<div id="ourIndustries">
<div class="container">
<section class="row">
<article class="col-xl-10 col-12 text-center auto">
<h2 class="headingColor text-uppercase fontWeight800">our industries</h2>
<div class="divider mt-4"></div>
</article>
</section>
<div class="ourIndustries">
<section class="row mt-5">
<article class="col-sm-12 col-md-6 col-lg-6 col-xl-4 p-2">
<div class="row m-0">
<div class="col-sm-2">
<i class="fa fa-pie-chart font40" aria-hidden="true"></i>
</div>
<div class="col-sm-10">
<h3 class="headingColor fontsize22 fontWeight600">Corporate Finance</h3>
<p class="mb-0">Lorem ipsum dolor sit, amet consectetur adipisicing elit. Soluta cumque
sapiente vitae
iste sequi.</p>
</div>
</div>
</article>
<article class="col-sm-12 col-md-6 col-lg-6 col-xl-4 p-2">
<div class="row m-0">
<div class="col-sm-2">
<i class="fa fa-bar-chart" aria-hidden="true"></i>
</div>
<div class="col-sm-10">
<h3 class="headingColor fontsize22 fontWeight600">Economic Consulting</h3>
<p class="mb-0">Lorem ipsum dolor sit, amet consectetur adipisicing elit. Soluta cumque
sapiente vitae
iste sequi.</p>
</div>
</div>
</article>
<article class="col-sm-12 col-md-6 col-lg-6 col-xl-4 p-2">
<div class="row m-0">
<div class="col-sm-2">
<i class="fa fa-bell" aria-hidden="true"></i>
</div>
<div class="col-sm-10">
<h3 class="headingColor fontsize22 fontWeight600">Forensic & Litigation</h3>
<p class="mb-0">Lorem ipsum dolor sit, amet consectetur adipisicing elit. Soluta cumque
sapiente vitae
iste sequi.</p>
</div>
</div>
</article>
<article class="col-sm-12 col-md-6 col-lg-6 col-xl-4 p-2">
<div class="row m-0">
<div class="col-sm-2">
<i class="fa fa-microphone" aria-hidden="true"></i>
</div>
<div class="col-sm-10">
<h3 class="headingColor fontsize22 fontWeight600">Strategic Communications</h3>
<p class="mb-0">Lorem ipsum dolor sit, amet consectetur adipisicing elit. Soluta cumque
sapiente vitae
iste sequi.</p>
</div>
</div>
</article>
<article class="col-sm-12 col-md-6 col-lg-6 col-xl-4 p-2">
<div class="row m-0">
<div class="col-sm-2">
<i class="fa fa-laptop" aria-hidden="true"></i>
</div>
<div class="col-sm-10">
<h3 class="headingColor fontsize22 fontWeight600">Technology Consulting</h3>
<p class="mb-0">Lorem ipsum dolor sit, amet consectetur adipisicing elit. Soluta cumque
sapiente vitae
iste sequi.</p>
</div>
</div>
</article>
<article class="col-sm-12 col-md-6 col-lg-6 col-xl-4 p-2">
<div class="row m-0">
<div class="col-sm-2">
<i class="fa fa-plus-square" aria-hidden="true"></i>
</div>
<div class="col-sm-10">
<h3 class="headingColor fontsize22 fontWeight600">Healthcare Consulting</h3>
<p class="mb-0">Lorem ipsum dolor sit, amet consectetur adipisicing elit. Soluta cumque
sapiente vitae
iste sequi.</p>
</div>
</div>
</article>
</section>
</div>
</div>
</div>
<!-- // Our Industries end here -->
/*
/* Copyright (c) 2020 karanjeet singh
/* Author: karanjeet singh
*/
@import url('https://fonts.googleapis.com/css?family=Muli:300,400,900&display=swap');
body {
font-family: 'Muli', sans-serif;
}
.auto {
margin: auto;
}
.headingColor {
color: #0e3868;
}
.fontWeight800 {
font-weight: 800;
}
.fontWeight600 {
font-weight: 600;
}
.divider {
width: 80px;
height: 5px;
border-radius: 10px;
background-color: #652fdf;
margin: auto;
}
.subText {
font-size: 1.2rem;
color: #304a63;
}
.fontsize22 {
font-size: 1.1rem;
}
.boxShadow {
-webkit-box-shadow: 1px 15px 28px 10px rgba(219, 216, 219, 0.43);
-moz-box-shadow: 1px 15px 28px 10px rgba(219, 216, 219, 0.43);
box-shadow: 1px 15px 28px 10px rgba(219, 216, 219, 0.43);
}
.font40 {
font-size: 20px !important;
margin-bottom: 20px;
border-radius: 50%;
color: #652fdf;
}
#aboutUs,
#ourIndustries {
padding: 100px 0;
}
.boxShadow>section>article>i {
width: 50px;
height: 50px;
border-radius: 50px;
border: solid 1px #652fdf;
line-height: 50px;
}
.boxShadow>section>article {
background-color: #ffffff;
transition: background-color 0.5s ease;
}
.boxShadow>section>article.boxActive {
background-color: #652fdf;
color: #fff;
transition: background-color 0.5s ease;
}
.boxShadow:hover>section>article.boxActive {
background-color: #fff;
}
.boxShadow:hover>section>article.boxActive>h3,
.boxShadow:hover>section>article.boxActive>p {
color: #000;
}
.boxShadow>section>article:hover {
background-color: #652fdf;
color: #fff;
}
.boxShadow>section>article:hover>h3,
.boxShadow>section>article.boxActive>h3 {
color: #fff;
}
.boxShadow>section>article:hover>i.font40,
.boxShadow>section>article.boxActive>i.font40 {
background-color: #ffffff !important;
}
/*our industries start from here*/
.ourIndustries>section>article>div.row>div.col-sm-2>i {
width: 50px;
height: 50px;
border-radius: 50px;
line-height: 50px;
background-color: #652fdf;
}
.ourIndustries>section>article>div.row>div.col-sm-2>i.fa {
text-align: center;
color: #ffffff;
}
#ourIndustries {
background-color: #f0eff2;
}
.ourIndustries > section > article:nth-last-child(-1n + 3){
margin-top: 50px;
}
@media (max-width:1199px){
.ourIndustries>section>article:nth-last-child(1n) {
margin-top: 50px;
}
}
@media (max-width:767px) {
.ourIndustries>section>article:first-child {
margin-top: 0 !important;
}
.ourIndustries>section>article:nth-last-child(1n) {
margin-top: 30px;
background-color: none !important;
}
}
