"9T5 Services"
Bootstrap 4.1.1 Snippet by RizwanAkram

Post to Facebook Tweet this

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
<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="//cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<!------ Include the above in your HEAD tag ---------->
<div class="container">
<div class="row">
<div class="col-12">
<section class="section-benifits">
<div class="slider">
<div class="slide slide-25">
<div class="icon">
<svg class="svg-1" width="298" height="199" viewBox="0 0 298 199" fill="none" xmlns="http://www.w3.org/2000/svg">
<g clip-path="url(#clip0_2_13572)">
<path d="M149.286 43.891C184.171 43.891 212.549 72.405 212.549 107.457C212.549 142.509 184.171 171.023 149.286 171.023C114.401 171.023 86.0229 142.509 86.0229 107.457C86.0229 72.405 114.401 43.891 149.286 43.891ZM149.286 16.6483C99.3685 16.6483 58.9101 57.3004 58.9101 107.457C58.9101 157.614 99.3685 198.266 149.286 198.266C199.204 198.266 239.662 157.614 239.662 107.457C239.662 57.3004 199.204 16.6483 149.286 16.6483Z" fill="var(--bs-primary)"/>
<path d="M230.323 177.471C246.455 158.643 256.246 134.185 256.246 107.457C256.231 48.2044 208.257 0 149.286 0C90.3158 0 42.3412 48.2044 42.3412 107.457C42.3412 134.185 52.1319 158.643 68.264 177.471H0V183.525H75.1326V183.479H82.6037C61.6365 164.879 48.3662 137.712 48.3662 107.457C48.3662 51.5492 93.6446 6.05393 149.286 6.05393C204.928 6.05393 250.206 51.5492 250.206 107.457C250.206 137.697 236.951 164.879 215.969 183.479H222.852V183.525H297.985V177.471H230.308H230.323Z" fill="var(--bs-primary)" fill-opacity="0.25"/>
</g>
<defs>
<clipPath id="clip0_2_13572">
<rect width="298" height="198.266" fill="white"/>
</clipPath>
</defs>
</svg>
<svg class="svg-2" xmlns="http://www.w3.org/2000/svg" id="Layer_1" data-name="Layer 1" viewBox="0 0 85.04 85.04">
<path fill="var(--bs-primary)" d="m62.9,71.11c-.66,0-1.19.53-1.19,1.19,0,2.63-2.14,4.76-4.76,4.76h-5.96c-2.63,0-4.76-2.14-4.76-4.76,0-.66-.53-1.19-1.19-1.19s-1.19.53-1.19,1.19c0,3.94,3.21,7.14,7.14,7.14h5.96c3.94,0,7.14-3.21,7.14-7.14,0-.66-.53-1.19-1.19-1.19Z"/>
<path fill="var(--bs-primary)" d="m54.56,8c.66,0,1.19-.53,1.19-1.19v-2.38c0-.66-.53-1.19-1.19-1.19s-1.19.53-1.19,1.19v2.38c0,.66.53,1.19,1.19,1.19Z"/>
<path fill="var(--bs-primary)" d="m74.71,16.02c.3,0,.59-.11.83-.33l1.75-1.68c.47-.46.49-1.21.03-1.68-.46-.47-1.21-.49-1.68-.03l-1.75,1.68c-.47.46-.49,1.21-.03,1.68.23.24.55.37.86.37Z"/>
<path fill="var(--bs-primary)" d="m64.99,9.98c.15.07.31.1.47.1.46,0,.9-.27,1.09-.72l.95-2.2c.26-.6-.02-1.3-.62-1.56-.6-.26-1.3.02-1.56.62l-.95,2.2c-.26.6.02,1.3.62,1.56Z"/>
<path fill="var(--bs-primary)" d="m42.57,9.36c.19.45.63.72,1.09.72.16,0,.32-.03.47-.1.6-.26.88-.96.62-1.56l-.95-2.2c-.26-.6-.96-.88-1.57-.62-.6.26-.88.96-.62,1.56l.95,2.2Z"/>
<path fill="var(--bs-primary)" d="m80.7,45.73l-3.51-10.54c-.11-12.39-10.21-22.43-22.63-22.43s-22.63,10.15-22.63,22.63c0,7.41,4.48,14.33,9.33,20.7,1.11,1.45,1.87,3.94,2.27,5.5h-4.46c-8.54,0-15.48-6.95-15.48-15.48,0-3.19.96-6.24,2.77-8.85.38-.54.24-1.28-.29-1.66-.54-.38-1.28-.24-1.66.3-2.1,3-3.2,6.53-3.2,10.21,0,9.85,8.01,17.86,17.86,17.86h5.95s.07-.02.11-.02c.04,0,.07,0,.11,0,.04,0,.08-.04.12-.05.08-.02.15-.05.22-.09.07-.04.13-.08.19-.13.06-.05.11-.1.16-.16.05-.06.09-.12.13-.19.04-.07.06-.13.09-.2.02-.08.04-.15.05-.24,0-.04.02-.08.02-.12,0-.04-.02-.07-.02-.11,0-.04,0-.07,0-.11-.04-.21-1.01-5.25-3.04-7.91-4.59-6.04-8.85-12.55-8.85-19.26,0-11.16,9.08-20.25,20.25-20.25s20.25,9.08,20.25,20.25c0,.13.02.26.06.38l3.05,9.15h-4.3c-.66,0-1.19.53-1.19,1.19v7.14c0,1.97-1.6,3.57-3.57,3.57h-1.19c-3.28,0-5.95,2.67-5.95,5.95v3.57h-16.67c-.66,0-1.19.53-1.19,1.19s.53,1.19,1.19,1.19h17.86c.66,0,1.19-.53,1.19-1.19v-4.76c0-1.97,1.6-3.57,3.57-3.57h1.19c3.28,0,5.95-2.67,5.95-5.95v-5.95h4.76c.38,0,.74-.18.97-.49.22-.31.29-.71.16-1.07Z"/>
<path fill="var(--bs-primary)" d="m52.18,35.39c0-3.28-2.67-5.95-5.95-5.95s-5.95,2.67-5.95,5.95,2.67,5.95,5.95,5.95c.61,0,1.2-.09,1.75-.26l1.82,2.98v6.81c0,1.97,1.6,3.57,3.57,3.57h2.38c1.97,0,3.57-1.6,3.57-3.57v-6.81l1.82-2.98c.55.17,1.14.26,1.75.26,3.28,0,5.95-2.67,5.95-5.95s-2.67-5.95-5.95-5.95-5.95,2.67-5.95,5.95c0,1.82.82,3.45,2.11,4.54l-1.94,3.17c-.11.19-.17.4-.17.62v7.15c0,.66-.54,1.19-1.19,1.19h-2.38c-.66,0-1.19-.53-1.19-1.19v-7.15c0-.22-.06-.43-.17-.62l-1.94-3.18c1.29-1.09,2.11-2.72,2.11-4.54Zm10.72-3.57c1.97,0,3.57,1.6,3.57,3.57s-1.6,3.57-3.57,3.57-3.57-1.6-3.57-3.57,1.6-3.57,3.57-3.57Zm-20.25,3.57c0-1.97,1.6-3.57,3.57-3.57s3.57,1.6,3.57,3.57-1.6,3.57-3.57,3.57-3.57-1.6-3.57-3.57Z"/>
<path fill="var(--bs-primary)" d="m39.08,77.07h-4.76c-.66,0-1.19-.53-1.19-1.19v-1c0-1.45-.87-2.75-2.21-3.3l-6.11-2.53c-1.34-.55-2.87-.25-3.89.77l-.71.71c-.45.45-1.24.45-1.68,0l-5.05-5.05c-.46-.46-.46-1.22,0-1.68l.71-.71c1.03-1.02,1.33-2.55.78-3.89l-2.53-6.11c-.55-1.34-1.85-2.21-3.3-2.21h-1c-.66,0-1.19-.54-1.19-1.19v-7.15c0-.66.54-1.19,1.19-1.19h1c1.45,0,2.75-.87,3.3-2.21l2.84-6.85c.37-.89.17-1.91-.52-2.6l-1.27-1.27c-.46-.46-.46-1.22,0-1.68l5.05-5.05c.45-.45,1.23-.45,1.68,0l.71.71c1.03,1.02,2.55,1.33,3.89.77l6.11-2.53c1.34-.56,2.21-1.85,2.21-3.3v-1c0-.66.54-1.19,1.19-1.19h3.57c.66,0,1.19-.53,1.19-1.19s-.53-1.19-1.19-1.19h-3.57c-1.97,0-3.57,1.6-3.57,3.57v1c0,.48-.29.92-.74,1.1l-6.11,2.53c-.45.18-.96.08-1.3-.26l-.71-.71c-1.35-1.35-3.71-1.35-5.05,0l-5.05,5.05c-1.39,1.39-1.39,3.66,0,5.05l1.27,1.27-2.84,6.85c-.18.45-.62.73-1.1.73h-1c-1.97,0-3.57,1.6-3.57,3.57v7.15c0,1.97,1.6,3.57,3.57,3.57h1c.48,0,.92.29,1.1.74l2.53,6.11c.19.45.08.96-.26,1.3l-.71.71c-1.39,1.39-1.39,3.66,0,5.05l5.05,5.05c1.39,1.39,3.66,1.39,5.05,0l.71-.71c.34-.34.85-.44,1.3-.26l6.11,2.53c.45.18.74.62.74,1.1v1c0,1.97,1.6,3.57,3.57,3.57h4.76c.66,0,1.19-.53,1.19-1.19s-.53-1.19-1.19-1.19Z"/>
</svg>
<svg class="svg-circle" width="15" height="15" viewBox="0 0 19 19" fill="none" xmlns="http://www.w3.org/2000/svg">
<circle cx="9.5" cy="9.5" r="9.5" fill="var(--bs-primary)" fill-opacity="0.25"/>
</svg>
</div>
XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
:root {
--bs-primary: #7f3fd1;
}
.section-benifits .slider {
display: flex;
column-gap: 15px;
justify-content: center;
margin: auto;
}
@media (min-width: 1060px) {
.section-benifits .slider {
width: 1015px;
}
}
.section-benifits .slick-slide {
width: 224px;
margin: 0 5px;
}
.section-benifits .slick-slide.slide-25 .card::before, .section-benifits .slick-slide.slide-25 .card::after {
opacity: 0.25;
}
.section-benifits .slick-slide.slide-50 .card::before, .section-benifits .slick-slide.slide-50 .card::after {
opacity: 0.5;
}
.section-benifits .slick-slide.slide-75 .card::before, .section-benifits .slick-slide.slide-75 .card::after {
opacity: 0.75;
}
.section-benifits .slick-list {
padding: 10px 40px;
}
.section-benifits .icon {
margin-bottom: 15px;
position: relative;
background: white;
}
.section-benifits .icon .svg-1 {
XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX
1
XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX

Related: See More

Now UI Kit
BOOTSTRAP 4 OUR SERVICES
Bootstrap 4 Our services
Services Tabs

Questions / Comments: