.section-title-pro h2.title {

    font-size: 40px;

    margin-bottom: 8px;

}

.section-title-pro.service-style--3 p {

    padding: 0 21%;

    font-weight: 300;

    color: #717173;

    margin-bottom: 60px;

}

.title-service{text-align: center;}

.service-style--pro {

    position: relative;

    margin-bottom: 40px;

    overflow: hidden;

    border-radius: 6px;

    -webkit-transition: all .3s cubic-bezier(.645,.045,.355,1);

    transition: all .3s cubic-bezier(.645,.045,.355,1);

}

.service-style--pro .thumbnail a {

    display: block;

    position: relative;

    z-index: 1;

}

.service-style--pro .thumbnail a img{

    -webkit-transition: all .3s cubic-bezier(.645,.045,.355,1);

    transition: all .3s cubic-bezier(.645,.045,.355,1);

}

.thumbnail img {

    border-radius: 5px;

    box-shadow: 0 25px 65px rgba(0,0,0,.1);

}

.w-100 {

    width: 100%!important;

}

.service-style--pro .thumbnail a:after {

    background: -webkit-gradient(linear,left top,left bottom,color-stop(0,#fc004d),to(#000));

    background: -webkit-linear-gradient(top,#fc004d,#000);

    background: linear-gradient(180deg,#0c59db 0,#000);

    position: absolute;

    left: 0;

    right: 0;

    width: 100%;

    height: 100%;

    content: "";

    z-index: 1;

    opacity: 0;

}

.service-style--pro .content {

position: absolute;

    bottom: -142px;

    width: 100%;

    padding: 0px 0px;

    z-index: 3;

    text-align: center;

}

.service-style--pro .content:before {

    position: absolute;

    content: "";

    background: -webkit-gradient(linear,left top,left bottom,color-stop(0,transparent),color-stop(70%,#000));

    background: -webkit-linear-gradient(top,transparent,#000 70%);

    background: linear-gradient(180deg,transparent 0,#000 70%);

    left: 0;

    top: 0;

    width: 100%;

    height: 100%;

    opacity: 1;

    z-index: -1;

}

.service-style--pro .content p.servicetype {
    font-family: 'Kanit';

    font-size: 18px;

    margin-bottom: 15px;

    color: #ffffff;

    background-color: rgb(0 0 0 / 0.6);

    padding: 10px;

    height: 65px;

    overflow: hidden;

    display: -webkit-box;

    -webkit-line-clamp: 2;

    -webkit-box-orient: vertical;

}

.service-style--pro .content h4.title {
    font-family: 'Kanit';
    margin-bottom: 0;
    line-height: 22px;
    padding: 0px 10px;
    color: #fff;

}

.active-dark h4{color: #fff;}

.service-style--pro .content h4.title a {

    color: #fff;

    font-size: 16px;

    font-weight: 500;

}



.service-style--pro .content .service-btn {

    margin-top: 35px;

    -webkit-transition: .7s;

    transition: .7s;

    opacity: 0;

    visibility: hidden;

}



a.rn-btn, button.rn-btn {

    padding: 0 23px;

    height: 40px;

    display: inline-block;

    line-height: 34px;

    border: 2px solid #0c59db;

    border-radius: 4px;

    font-size: 14px;

    position: relative;

    z-index: 2;

    color: #0c59db;

    letter-spacing: .2px;

    text-transform: uppercase;

}

a.rn-btn:hover, button.rn-btn:hover {

    border: 2px solid #0c59db;

    -webkit-transform: translateY(-3px);

    transform: translateY(-3px);

    color: #fff;

    background: #0c59db;

}

.service-style--pro:hover .content {

    bottom: 0;

}

.service-style--pro:hover .content:before {

    opacity: 0;

}

.service-style--pro, .service-style--pro .content, .service-style--pro .content .service-btn, .service-style--pro .content:before, .service-style--pro .content h4.title a, .service-style--pro .thumbnail a:after, .service-style--pro .thumbnail a img, .footer-right .footer-link ul.ft-link li a, .header-area .header-wrapper a.rn-btn, .item-portfolio-static .thumbnail a img, .mainmenunav ul.mainmenu>li>a, .mainmenunav ul.mainmenu>li>ul.submenu, .mainmenunav ul.mainmenu>li>ul.submenu li a, .portfolio, .portfolio-sacousel-inner .slick-dots li button:after, .portfolio-style--3, .portfolio-style--3 .content, .portfolio-style--3 .content .portfolio-btn, .portfolio-style--3 .content:before, .portfolio-style--3 .content h4.title a, .portfolio-style--3 .thumbnail a:after, .portfolio-style--3 .thumbnail a img, .portfolio-tilthover .portfolio .bg-blr-image, .portfolio-tilthover .portfolio .content, .portfolio .bg-blr-image, .portfolio .content .inner .portfolio-button, .portfolio .thumbnail-inner:before, .portfolio .thumbnail:after, .related-work .inner h4 a, .rn-address .icon, .rn-address .inner p a, .rn-pagination ul.page-list li a:before, .rn-pricing .pricing-table-inner .pricing-footer a.rn-btn, .rn-slick-dot .slick-dots li button:after, .service.service__style--1, .service.service__style--2, .service.service__style--2 .content h3.title, .service.service__style--2 .content p, .service.service__style--2 .icon, .service.service__style--2:before, .single-demo a, .standard-service .content h3 a, .team .thumbnail:after, .team .thumbnail img, a.btn-transparent, a.btn-transparent:after, a.rn-btn, button.rn-btn, input, textarea, ul.brand-list li, ul.brand-list li img, ul.social-share li a, ul.testimonial-thumb-wrapper li .thumb:after, ul.testimonial-thumb-wrapper li .thumb img {

    -webkit-transition: all .3s cubic-bezier(.645,.045,.355,1);

    transition: all .3s cubic-bezier(.645,.045,.355,1);

}

.service-style--pro:hover .content .service-btn {

    opacity: 1;

    visibility: visible;

}

.service-style--pro .content .service-btn {

    margin-top: 35px;

    -webkit-transition: .7s;

    transition: .7s;

    opacity: 0;

    visibility: hidden;

}

.service-style--pro:hover .thumbnail a:after {

    opacity: .85;

    top: 0;

}