/* 
Theme Name: Hello Elementor Child
Theme URI: https://github.com/elementor/hello-theme-child/
Description: Hello Elementor Child is a child theme of Hello Elementor, created by Elementor team
Author: Elementor Team
Author URI: https://elementor.com/
Template: hello-elementor
Version: 2.0.0
Text Domain: hello-elementor-child
License: GNU General Public License v3 or later.
License URI: https://www.gnu.org/licenses/gpl-3.0.html
Tags: flexible-header, custom-colors, custom-menu, custom-logo, editor-style, featured-images, rtl-language-support, threaded-comments, translation-ready
*/

/* Add your custom styles here */

body.page-id-8{background: #f7f7f7; }
#page {overflow-x: hidden; }

/* header start */
#masthead .header_main .header_logo .hfe-site-logo .hfe-site-logo-img{transition: .3s; }
body.sticky-active #masthead .header_main {position: fixed; top: 0; left: 0; width: 100%; background: #fff; }
body.sticky-active #masthead .header_main .header_logo .hfe-site-logo .hfe-site-logo-img{width: 80%; }
/* header end */

/* home services section start */
body .home_grid_hover>.elementor-element{border: 1px solid #eee; border-radius: 8px; overflow: hidden; transition: all 0.2s ease 0s; }
body .home_grid_hover>.elementor-element:hover{transform: translateY(-15px) !important; box-shadow: 0 20px 60px -10px rgb(0 0 0 / 10%) !important; }
/* home services section end */

/* home contact form start */
.home_contact_form .wpcf7-form p br {display: none; }
.home_contact_form .wpcf7-form p:nth-of-type(1) {display: flex; flex-wrap: wrap; gap: 40px 12px; justify-content: center; }
.home_contact_form .wpcf7-form p > .wpcf7-form-control-wrap:nth-of-type(-n+3) {display: inline-block; max-width: 340px; width: 100%; }
.home_contact_form .wpcf7-form p > .wpcf7-form-control-wrap:nth-of-type(-n+3) input {background-color: #f7f7f7; color: #001837; border: 1px solid #eeeeee; border-radius: 5px; height: 48px; font-size: 14px; padding: 10px; transition: all ease .3s; outline: none; }
.home_contact_form .wpcf7-form .home_captcha .wpcf7-captchar {display: inline-block; background-color: #f7f7f7; color: #001837; width: 100%; font-weight: normal; border: 1px solid #eeeeee; border-radius: 5px; max-width: 80px; }
.home_contact_form .wpcf7-form .home_captcha .wpcf7-form-control-wrap {max-width: 80px; }
.home_contact_form .wpcf7-form .wpcf7-submit {background: #282a73; font-family: 'Poppins', serif; font-size: 14px; font-weight: 600; letter-spacing: 0.3px; color: #FFF; padding: 12px 30px; text-transform: uppercase; border-radius: 4px; border: 1px solid #282a73; cursor: pointer; transition: all 0.3s ease 0s; }
.home_contact_form .wpcf7-form .wpcf7-submit:hover{background: #fff; color: #282a73; }
@media(max-width: 575px){
	.home_contact_form .wpcf7-form p:nth-of-type(1){gap: 18px 12px; }
}
/* home contact form end */

/* contact page start */
.servcoind-form {border-radius: 8px; box-shadow: 0 20px 60px -10px rgb(0 0 0 / 10%); }
.servcoind-form .wpcf7-form .wpcf7-form-control{width: 100%; background-color: #f7f7f7; color: #001837; border: 1px solid #eeeeee; border-radius: 5px; margin-top: 5px; margin-bottom: 10px; font-size: 14px; padding: 10px; transition: all ease .3s; box-sizing: border-box; font-family: 'Poppins', serif !important; outline: none; }
.servcoind-form .wpcf7-form img.wpcf7-form-control{width: auto; background: transparent; border: none; padding: 0; }
.servcoind-form .wpcf7-form .wpcf7-form-control-wrap:has(.wpcf7-captchar) {display: inline-block; width: 100%; max-width: 230px; }
.servcoind-form .wpcf7-form img.wpcf7-form-control+br {display: none; }
.servcoind-form .wpcf7-form .wpcf7-submit{background: #282a73; border: 1px solid #282a73; color: #fff; text-transform: uppercase; }
.servcoind-form .wpcf7-form .wpcf7-submit:hover{background: #fff; color: #282a73; }
/* contact page end */

/* images vectore start */
@media(min-width: 769px){
	.dotted-pattern-left img, .dotted-pattern-right img{background: #fff; }
    .dotted-pattern-right.elementor-element.elementor-widget-image {position: relative; padding-right: 50px; padding-bottom: 35px; }
    .dotted-pattern-right.elementor-element.elementor-widget-image:after{
        content: ''; width: 180px; height: auto; aspect-ratio: 1; position: absolute; bottom: 0; right: 0; z-index: -1; opacity: .6;
        background-image: url(https://testingserver24.com/demo/servcoind26/dots-2.svg); background-size: cover;
    }
    .dotted-pattern-left.elementor-element.elementor-widget-image {position: relative; padding-left: 50px; padding-bottom: 35px; }
    .dotted-pattern-left.elementor-element.elementor-widget-image:after{
        content: ''; width: 180px; height: auto; aspect-ratio: 1; position: absolute; bottom: 0; left: 0; z-index: -1; opacity: .6;
        background-image: url(https://testingserver24.com/demo/servcoind26/dots-2.svg); background-size: cover;
    }
}
/* images vectore end */

/* Services pages start */
.services_hero {
    position: relative; color: #fff; font-size: 36px; font-weight: 600; line-height: 46px; padding: 150px 0px;
    background: url(https://servcoind.com/wp-content/uploads/2021/04/map-1-1.png) #282a73; background-position: center; background-repeat: no-repeat; background-size: cover;
}
.services_hero:before{content: ''; background-color: #282a73; pointer-events: none; position: absolute; left: 0; top: 0; width: 100%; height: 100%; opacity: 0.9; }
.services_hero h1 {font-family: 'Poppins', serif !important; font-weight: 600; margin: 0; }
.services_hero .services_hero_wrp {position: relative; z-index: 1; max-width: 1170px; margin-inline: auto; width: 100%; }
.services_child{padding: 50px 20px; font-family: 'Poppins', serif !important; }
.services_child .services_child_wrp{max-width: 1140px; margin-inline: auto; }
.services_child .services_child_inr{display: flex; flex-wrap: wrap; gap: 30px; align-items: flex-start; }
.services_child .left_content{width: 340px; margin-bottom: 50px; padding: 38px 30px 40px; border: 1px solid #eee; border-radius: 5px; }
.services_child .left_content h6{font-size: 13px; line-height: 1; text-align: left; letter-spacing: 1px; position: relative; text-transform: uppercase; margin-top: 0; padding-left: 60px; font-weight: 700; color: #545454; }
.services_child .left_content h6:after{content: ''; height: 1px; width: 50px; top: 6px; left: 0; position: absolute; background: #001837; opacity: .6; }
.services_child .left_content ul{padding: 0; list-style: none; margin: 0; }
.services_child .left_content ul li a{display: inline-block; position: relative; padding: 13px 0; padding-right: 20px; width: 100%; font-size: 15px; font-weight: 600; color: #001837; border-bottom: 1px solid #eee; transition: all ease .5s; text-transform: capitalize; }
.services_child .left_content ul li a span{flex: 1; }
.services_child .left_content ul li a svg{width: 22px; height: auto; flex: 0 0 22px; position: absolute; right: 0; font-size: 20px; color: #001837; top: 50%; transform: translateY(-50%); }
.services_child .left_content ul li a svg path{fill: currentColor; }
.services_child .left_content ul li a:hover{padding-left: 5px; color: #6382f7; }
.services_child .right_content{flex: 1; }
.services_child .right_content .image_wrap{margin-bottom: 20px; }
.services_child .right_content .image_wrap img{width: 100%; }
.services_child .right_content .the_content{font-size: 14px; line-height: 1.7; }
@media(max-width: 768px){
	.services_child .services_child_inr {flex-direction: column-reverse; }
	.services_hero {padding: 80px 20px; }
	.services_hero h1 {font-size: 32px; }
	.services_child .left_content {margin-bottom: 0; width: 100%; }
	
	.hfe-nav-menu a.hfe-menu-item, .hfe-nav-menu a.hfe-sub-menu-item {display: flex; justify-content: center; flex-direction: row; flex-wrap: nowrap; align-content: center; }
}
/* Services pages end */

.dotted-pattern-2{
    position: relative;
    z-index: 1;
}
.dotted-pattern-2:after {
    content: "";
    background-image: url(https://testingserver24.com/demo/servcoind26/dots-2.svg);
    background-size: cover;
    position: absolute;
    top: 0;
    left: 0;
    z-index: 0;
}

.dotted-pattern-2.position-1:after {
    top: unset;
    left: unset;
    bottom: -35px;
    right: -50px;
    height: 180px;
    width: 180px;
    opacity: .6;
}
.dotted-pattern-2.position-2:after {
    top: unset;
    right: unset;
    bottom: -35px;
    left: -50px;
    height: 180px;
    width: 180px;
    opacity: .6;
}