/* 
	Section Background (bg.css)
	
	Table of Content
	- general settings for section & subheader
	- general background image for subheader
	- background settings for page subheader
	- background settings for section
	- subheader for side navigation
	- media query
*/


/* general  for subheader */

#subheader {
    background: url(../images/background/service.jpg)top fixed;
    height: 430px;
    background-size: initial !important;
    display: flex;
    align-items: center;
    background-repeat: no-repeat;
}


/* background settings for page subheader */

.page-projects #subheader {
    background-image: url(../images/background/service.jpg);
}

.page-projects-alt #subheader {
    background-image: url(../images/background/subheader-1b.html);
}

.page-services #subheader {
    background-image: url(../images/services.jpg);
}

.page-about #subheader {
    background-image: url(../images/about.jpg);
}

.page-real #subheader {
    background-image: url(../images/real.jpg);
}

.page-con #subheader {
    background-image: url(../images/infra.jpg);
}

.page-career #subheader {
    background-image: url(../images/career.jpg);
}

.page-contact #subheader {
    background-image: url(../images/contact.jpg);
}


/* background settings for section */

#info-address {
    background: url(../images/background/bg-3.jpg) top fixed;
}

#view-all-projects,
#call-to-action {
    padding: 60px 0 60px 0;
}

#section-about-us-2 {
    background: #f8f8f8;
    height: 100%;
}

#section-about-us-2 .image-container {
    background: url(../images/background/bg-side-1.html);
}

#section-about-us-3 {
    background: #f5f5f5;
    height: 100%;
}

#section-about-us-3 .image-container {
    background: url(../images/background/bg-side-2.html);
}

#section-about-us-4 .image-container {
    background: url(../images/background/bg-side-3.html);
}

#section-welcome-5 {
    background: url(../images/background/bg-14.html) top fixed;
}

#section-blog {
    background: url(../images/background/bg-5.html) top fixed;
}

#section-coming-soon {
    background: none;
    /* position: absolute; */
    /* min-height: 100%; */
    width: 100%;
    z-index: 1;
    background: #18191b;
}

#section-describe {
    background: #202020;
}

#section-download {
    background: url(../images/background/bg-9.html) top fixed;
}

#bg-coming-soon-page {
    background: url(../images/background/bg-6.html) top fixed;
    position: fixed;
    min-height: 100%;
    width: 100%;
}

#section-about-us-2 {
    background: #18191b;
    height: 100%;
}

.de_light #section-about-us-2 {
    background: none;
}

#section-welcome {
    background: url(../images/background/bg-4.html) top fixed;
}

#section-welcome-2 {
    background: url(../images/background/bg-6.html) top fixed;
}

#section-welcome-3 {
    background: url(../images/background/bg-7.html) top fixed;
}

#section-welcome-4 {
    background: url(../images/background/bg-10.html) top fixed;
}

#section-welcome-6 {
    background: url(../images/background/bg-15.html) top fixed;
}

#section-welcome-7 {
    background: url(../images/background/bg-19.html) fixed center;
}

#section-welcome-8 {
    background: url(../images/background/bg-20.html) fixed center;
}

#section-welcome-9 {
    background: url(../images/background/bg-21.html) top fixed;
}

#section-welcome-10 {
    background: url(../images/background/bg-23.html) top fixed;
}

#section-welcome-11 {
    background: url(../images/background/bg-25.html) top fixed;
}

#section-welcome-12 {
    background: url(../images/background/bg-26.html) top fixed;
}

#section-welcome-13 {
    background: url(../images/background/bg-29.html) top fixed;
}

#section-welcome-14 {
    background: url(../images/background/bg-30.html) top fixed;
}

#section-why-choose-us {
    background: url(../images/background/bg-8.html) top fixed;
}

#section-why-choose-us-3 {
    background: url(../images/background/bg-16.html) top fixed;
}

#section-portfolio {
    /* background: #18191b; */
    /* background-image: url(../images/bg.png); */
    /* width:101%; */
    overflow: hidden;
    /* padding: 90px 0px !important; */
    background-repeat: no-repeat;
    background-position: initial;
}

.client-sec {
    background: #f5f5f5;
}

.de_light #section-portfolio {
    background: #fff;
}

#section-skill-bar {
    background: url(../images/background/bg-8.html) top fixed;
}

#section-testimonial {
    background: url(../images/background/bg-3.jpg) top fixed;
    /* padding: 0px; */
    transform: skewY(5deg);
    background-size: cover;
    background-repeat: no-repeat !important;
}

#section-vision {
    background: url(../images/background/bg-3.jpg) top fixed;
    /* padding: 0px; */
    background-size: cover;
    background-repeat: no-repeat !important;
}

#section-testimonial-2 {
    background: url(../images/background/bg-17.html) top fixed;
}

#section-steps {
    background: url(../images/background/bg-2.html) top fixed;
}

#section-steps-2 {
    background: #f5f5f5;
}

#section-steps-3 {
    background: url(../images/background/bg-12.html) top fixed;
}

#section-steps-4 {
    background: url(../images/background/bg-32.html) top no-repeat;
}

#section-team {
    background: #111;
}

.de_light #section-team {
    background: #f5f5f5;
}

#hide-content {
    position: absolute;
    width: 100%;
    min-height: 100%;
    z-index: 100;
    display: none;
    background: rgba(0, 0, 0, .8);
}

#section-fun-facts .image-container {
    background: url(../images/background/bg-side-4.html);
}

#section-fun-facts-2 {
    background: url(../images/background/bg-13.html) center;
}

#section-fun-facts-3 {
    background: url(../images/background/bg-18.html) top;
}

#section-side-1.side-bg .background-image {
    background: url(../images/background/bg-side-5.html);
}

#section-side-2.side-bg .background-image {
    background: url(../images/background/bg-side-6.html);
}

#section-custom-1 {
    background: url(../images/background/bg-17.html) top fixed;
}

#section-custom-2 {
    background: url(../images/background/bg-16.html) top fixed;
}

#section-cta-1 {
    background: url(../images/background/bg-22.html) top fixed;
}

#section-profile-experiences {
    background: url(../images/background/bg-24.html) top fixed;
}

#section-hero-index-landing-product {
    background: url(../images/background/bg-27.html) top fixed;
}

#section-side-1-index-landing-product.side-bg .image-container {
    background: url(../images/background/bg-side-10.html) center;
}

#section-contact-landing-product {
    background: url(../images/background/bg-28.html) bottom no-repeat;
}

#section-before-after {
    background: url(../images/background/bg-31.html) top no-repeat;
}

#section-pattern-1 {
    background: url(../images/background/pattern-1.html) 100% !important;
}

#side-01-about.side-bg .image-container {
    background: url(../images/background/bg-side-8.html) center;
}

#side-01-contact.side-bg .image-container {
    background: url(../images/background/bg-side-7.html) center;
}

#side-01-services.side-bg .image-container {
    background: url(../images/background/bg-side-9.html) center;
}


/* services section side background */

#section-service-1.side-bg .background-image {
    background: url(../images/background/bg-service-1.html);
}

#section-service-2.side-bg .background-image {
    background: url(../images/background/bg-service-2.html);
}

#section-service-3.side-bg .background-image {
    background: url(../images/background/bg-service-3.html);
}

#section-service-4.side-bg .background-image {
    background: url(../images/background/bg-service-4.html);
}

#section-service-2,
#section-service-4 {
    background: #f2f2f2;
}


/* background settings for side navigation subheader */

.de-navbar-left.de_light #subheader {
    background: url(../images/background/bg-subheader-sn.html)top fixed;
}

.de-navbar-left.de_light.page-projects #subheader {
    background-image: url(../images/background/subheader-1-sn.html);
}

.de-navbar-left.de_light.page-services #subheader {
    background-image: url(../images/background/subheader-2-sn.html);
}

.de-navbar-left.de_light.page-about #subheader {
    background-image: url(../images/background/subheader-3-sn.html);
}

.de-navbar-left.de_light.page-blog #subheader {
    background-image: url(../images/background/subheader-4-sn.html);
}

.de-navbar-left.de_light.page-shop #subheader {
    background-image: url(../images/background/subheader-5-sn.html);
}

.de-navbar-left.de_light.page-contact #subheader {
    background-image: url(../images/background/subheader-6-sn.html);
}

.bg-fit-height {
    -webkit-background-size: auto 100% !important;
    -moz-background-size: auto 100% !important;
    -o-background-size: auto 100% !important;
    background-size: auto 100% !important;
    background-attachment: scroll !important;
}


/* media query */

@media only screen and (max-width: 767px) {
    section {
        -webkit-background-size: auto 100% !important;
        -moz-background-size: auto 100% !important;
        -o-background-size: auto 100% !important;
        background-size: auto 100% !important;
        background-attachment: scroll !important;
        background-position: top !important;
    }
    section.fit-width {
        -webkit-background-size: 100% auto !important;
        -moz-background-size: 100% auto !important;
        -o-background-size: 100% auto !important;
        background-size: 100% auto !important;
        background-attachment: scroll !important;
        background-position: top !important;
    }
    .page-services #subheader {
        background-image: url(../images/background/mservice.jpg);
        box-shadow: inset 0 0 0 2000px rgb(255 255 255 / 76%);
    }
    .page-about #subheader {
        background-image: url(../images/background/aboutm.jpg);
        box-shadow: inset 0 0 0 2000px rgb(255 255 255 / 76%);
    }
    .page-real #subheader {
        background-image: url(../images/background/realm.jpg);
        box-shadow: inset 0 0 0 2000px rgb(255 255 255 / 38%);
    }
    .page-con #subheader {
        background-image: url(../images/background/infram.jpg);
        box-shadow: inset 0 0 0 2000px rgb(255 255 255 / 54%);
    }
    .page-career #subheader {
        background-image: url(../images/background/careerm.jpg);
        box-shadow: inset 0 0 0 2000px rgb(255 255 255 / 76%);
    }
    .page-contact #subheader {
        background-image: url(../images/background/contactm.jpg);
        box-shadow: inset 0 0 0 2000px rgb(255 255 255 / 42%);
    }
}