.service-style1-area{
position: relative;
display: block;
background: #f3f3f4;
padding: 118px 0 50px;
z-index: 1;
}
.single-service-style1 {
position: relative;
display: flex;
align-items: center;
margin-bottom: 63px;
}
.single-service-style1 .icon-holder {
position: relative;
display: block;
width: 50px;
}
.single-service-style1 .icon-holder .inner{
position: relative;
display: block;
overflow: hidden;
color: #777777;
font-size: 50px;
-webkit-transition: all 0.4s linear;
-o-transition: all 0.4s linear;
transition: all 0.4s linear;  
}
.single-service-style1:hover .icon-holder .inner{
transform: perspective(400px) rotateY(360deg);
}
.single-service-style1:hover .img-holder img{
transform: scale(1.2);    
}
.single-service-style1 .img-holder::before {
position: absolute;
top: 50%;
left: 50%;
display: block;
content: '';
width: 0;
height: 0;
background: rgba(255, 255, 255, .5);
border-radius: 50%;
-webkit-transform: translate(-50%, -50%);
transform: translate(-50%, -50%);
opacity: 0;
z-index: 10;
}
.single-service-style1:hover .img-holder::before {
-webkit-animation: circle .75s;
animation: circle .75s;
}
.single-service-style1 .text-holder {
position: relative;
display: block;
padding-left: 20px;
}
.single-service-style1 .text-holder h3 {
font-size: 16px;
line-height: 20px;
font-weight: 700;
margin: 0 0 9px;
}
.single-service-style1 .text-holder h3 a{
color: #11161e;
transition: all 200ms linear;
transition-delay: 0.1s;
}
.single-service-style1 .text-holder p{
margin: 0;   
} .service-style2-area{
position: relative;
display: block;
background: #f3f3f4;
padding: 120px 0 80px;
overflow: hidden;
z-index: 1;
}
.service-style2-area.bg_white{
background: #ffffff;
}
.service-style2-area .shape1 {
position: absolute;
top: 100px;
left: 0;
bottom: 0;
right: 0;
z-index: -1;
opacity: 0.10;
}
.service-style2_top_box {
position: relative;
display: flex;
flex-direction: row;
justify-content: space-between;
align-items: flex-end;
flex-wrap: wrap;
padding-bottom: 61px;
}
.service-style2_top_box .sec-title{
position: relative;
display: block;
padding: 0;
}
.service-style2_top_box .sec-title h2{
text-transform: capitalize;
font-weight: 600;
}
.service-style2_top_box .sec-title h2 span{
font-weight: 800;
}
.service-style2_top_box .text_box{
position: relative;
display: block;
max-width: 470px;
width: 100%;
top: -2px;
}
.service-style2_top_box .text_box .top{
margin: 0 0 17px;
}
.service-style2_top_box .text_box .top p{
font-weight: 700;
margin: 0;
}
.service-style2_top_box .text_box .bottom{
position: relative;
display: block;
}
.service-style2_top_box .text_box .bottom p{
margin: 0;
}
.single-service-style2{
position: relative;
display: block;
background: #ffffff;
padding: 50px 30px 43px;
margin-bottom: 40px;
transition: all 0.5s cubic-bezier(0.62, 0.21, 0.45, 1.52);
z-index: 1;
}
.single-service-style2:hover{
box-shadow: 0px 15px 27px 3px rgba(231, 73, 1, 0.35);
}
.single-service-style2:before {
position: absolute;
content: '';
left: 0;
bottom: 0;
width: 100%;
height: 0%;
transition: all 500ms ease;
z-index: -1;
}
.single-service-style2:hover:before {
height: 100%;
top: 0px;
}
.single-service-style2 .icon-holder{
position: relative;
display: block;
padding-bottom: 27px;
}
.single-service-style2 .icon-holder span:before{
color: #777777;
font-size: 50px;
line-height: 50px;
transition: all 200ms linear;
transition-delay: 0.1s;
}
.single-service-style2:hover .icon-holder span:before{
color: #ffffff;
}
.single-service-style2 .text-holder{
position: relative;
display: block;
}
.single-service-style2 .text-holder h3{
font-size: 16px;
line-height: 22px;
font-weight: 700;
margin: 0 0 8px;
}
.single-service-style2 .text-holder h3 a{
color: #11161e;
transition: all 500ms linear;
transition-delay: 0.1s;
}
.single-service-style2:hover .text-holder h3 a{
color: #ffffff;
}
.single-service-style2 .text-holder p{
margin: 0;
transition: all 900ms linear;
transition-delay: 0.1s;
}
.single-service-style2:hover .text-holder p{
color: #ffffff;
} .about-style1-area.pdb120{
padding-bottom: 120px;
}
.about-style1-content-box.margin0 {
margin-top: 0px;
} .service-details-area{
position: relative;
display: block;
background: #f3f3f4;
padding: 120px 0 100px;
}
.service-details-single-image {
position: relative;
display: block;
overflow: hidden;
}
.service-details-single-image::before {
position: absolute;
top: 50%;
left: 50%;
z-index: 1;
display: block;
content: '';
width: 0;
height: 0;
background: rgba(255, 255, 255,.2);
border-radius: 0%;
-webkit-transform: translate(-50%, -50%);
transform: translate(-50%, -50%);
opacity: 0;
}
.service-details-single-image:hover::before {
-webkit-animation: circle .95s;
animation: circle .95s;
}
@-webkit-keyframes circle {
0% {
opacity: 1;
}
40% {
opacity: 1;
}
100% {
width: 200%;
height: 200%;
opacity: 0;
}
}
@keyframes circle {
0% {
opacity: 1;
}
40% {
opacity: 1;
}
100% {
width: 200%;
height: 200%;
opacity: 0;
}
}
.service-details-single-image img{
width: 100%;
transition: all 500ms ease;
}
.service-details-single-image:hover img{
transform: scale(1.05)
}
.service-details-content{
position: relative;
display: block;
padding-top: 45px;
}
.service-details-content .top {
position: relative;
display: flex;
justify-content: space-between;
align-items: center;
flex-direction: row;
flex-wrap: wrap;
padding-bottom: 20px;
}
.service-details-content .top .title_holder {
position: relative;
display: flex;
align-items: center;
}
.service-details-content .top .title_holder .icon{
width: 80px;
}
.service-details-content .top .title_holder .icon span::before{
font-size: 50px;
line-height: 50px;
}
.service-details-content .top .title_holder .title{
position: relative;
display: block;
}
.service-details-content .top .title_holder .title h4{
font-size: 16px;
line-height: 28px;
font-weight: 700;
text-transform: uppercase;
}
.service-details-content .top .social_link{
position: relative;
display: block;
}