Untitled
3 years ago in Plain Text
<html dir="rtl">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/4.0.0-alpha.6/css/bootstrap.min.css">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/animate.css/3.5.2/animate.min.css">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css" />
<section class="services">
<div class="container">
<div class="row">
<div class="col-md-3">
<div class="service-thumb">
<div class="thumb-icon"><i class="fa fa-paper-plane" aria-hidden="true"></i></div>
<h4>ניהול יומן</h4>
</div>
</div><!-- .Col ends here -->
<div class="col-md-3">
<div class="service-thumb">
<div class="thumb-icon"><i class="fa fa-paint-brush" aria-hidden="true"></i></div>
<h4>ניהול משימות</h4>
</div>
</div><!-- .Col ends here -->
<div class="col-md-3">
<div class="service-thumb">
<div class="thumb-icon"><i class="fa fa-code" aria-hidden="true"></i></div>
<h4>הנהלת חשבונות</h4>
</div>
</div><!-- .Col ends here -->
<div class="col-md-3">
<div class="service-thumb">
<div class="thumb-icon"><i class="fa fa-line-chart" aria-hidden="true"></i></div>
<h4>ניהול מכירות</h4>
</div>
</div><!-- .Col ends here -->
</div><!-- .Row ends here -->
</div><!-- .Container ends here -->
</section><!-- .Services ends here -->
<style>
/*---------------------------------------
Typorgraphy
-----------------------------------------*/
h1, h2, h3, h4, h5, h6 {
font-family: 'Ubuntu', sans-serif;
}
h1, h2, h4 {
font-weight: 500;
}
h1 {
font-size: 60px;
letter-spacing: -1px;
}
h2 {
color: #fff;
font-size: 23px;
line-height: 22px;
margin: 0px;
font-weight: 600;
}
h3 {
font-size: 16px;
line-height: 32px;
letter-spacing: 3px;
text-transform: uppercase;
}
h4 {
color: #fff;
font-size: 18px;
line-height: 26px;
font-weight: 500;
}
h5 {
letter-spacing: 0.5px;
}
ul, ol{list-style:none; padding:0; margin:0;}
img {
max-width: 60%;
}
.services{
padding: 3px 0px;
text-align: center;
}
.section-title {
margin: 0;
padding-bottom: 20px;
}
.section-title p {
max-width: 2px;
margin: auto;
}
.services .service-thumb {
margin-bottom:20px; margin-top:4px;
background: #911146;
padding-top: 7px;
padding-bottom: 5px;
}
.services .service-thumb h4 {
color: #fff;
font-weight: 600 !important;
}
.services .service-thumb .thumb-icon {
color: #fff;
width: 30px;
height: 70px;
border-radius:8px 0;
line-height: 6px;
margin: 0 auto 5px auto;
transition: ease-in-out 0.3s;
-webkit-transition: ease-in-out 0.3s;
-moz-transition: ease-in-out 0.3s;
-ms-transition: ease-in-out 0.3s;
}
/*
.services .service-thumb:hover .thumb-icon {
background: #35203B;
-webkit-transform: scale(1.1);
transform: scale(1.1);
border-radius:0 20px;
-webkit-box-shadow: 0px 0px 41px 2px rgba(0,0,0,0.29);
-moz-box-shadow: 0px 0px 41px 2px rgba(0,0,0,0.29);
box-shadow: 0px 0px 41px 2px rgba(0,0,0,0.29);
}
*/
.services .fa {
font-size: 30px;
padding-top: 10px;
padding-bottom: 0px;
font-weight: 600;
}
</style>
</html>