"Social Animation"
Bootstrap 4.1.1 Snippet by csshint

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 ---------->
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.11.2/css/all.min.css"/>
<section class="trial-block shadow3" id="ContactUs">
<div class="height450">
<div class="section-title text-center">
<span class="badge badge-info"><a href="http://www.csshint.com/" target="_blank">Get Started</a></span>
<h2>Social Link</h2>
<span class="section-title-line section-title-line"></span>
</div>
<div class="social-overlap process-scetion mt100">
<div class="container">
<div class="row justify-content-center">
<div class="col-md-10">
<div class="social-bar">
<div class="social-icons mb-3 iconpad text-center">
<a href="http://www.csshint.com/" target="_blank" class="slider-nav-item"><i class="fab fa-facebook"></i></a>
<a href="http://www.csshint.com/" target="_blank" class="slider-nav-item"><i class="fab fa-google-plus"></i></a>
<a href="http://www.csshint.com/" target="_blank" class="slider-nav-item"><i class="fab fa-twitter"></i></a>
<a href="http://www.csshint.com/" target="_blank" class="slider-nav-item"><i class="fab fa-instagram"></i></a>
<a href="http://www.csshint.com/" target="_blank" class="slider-nav-item"><i class="fab fa-linkedin"></i></a>
<a href="http://www.csshint.com/" target="_blank" class="slider-nav-item"><i class="fab fa-pinterest"></i></a>
<a href="http://www.csshint.com/" target="_blank" class="slider-nav-item"><i class="fab fa-skype"></i></a>
<a href="http://www.csshint.com/" class="slider-nav-item"><i class="fab fa-youtube"></i></a>
<a href="http://www.csshint.com/" class="behance slider-nav-item"><i class="fab fa-behance"></i></a>
<a href="http://www.csshint.com/" target="_blank" class="slider-nav-item"><i class="fab fa-dribbble"></i></a>
</div>
</div>
</div>
</div>
</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
body
{
margin:0;
padding:0;
font-family: 'Montserrat Alternates', sans-serif;
}
*
{
padding:0;
margin:0;
}
section {
padding: 100px 0;
}
.shadow3 {
background-image: url("http://www.commixturesoft.com/img/shadow3.png");
background-repeat: no-repeat;
}
.height450{height:450px;}
.badge-info {
background-color: rgba(23, 160, 184, 0.17);
color: #17a2b8;
}
.section-title .badge {
margin: 0 0 8px;
}
.badge {
border-radius: 100px;
font-size: 12px;
font-stretch: normal;
font-style: normal;
font-weight: 500;
letter-spacing: 1px;
XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX
1
XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX

Related: See More


Questions / Comments: