

// About 02
.about-area2{
    // left content
    .about-caption{
        padding-left: 50px;
        @media #{$laptop}{
            padding-left: 50px;
        }
        @media #{$lg}{
            padding-left: 0px;
        }
        @media #{$md}{
          padding-top: 50px;
          padding-left: 0px;
        }
        @media #{$sm}{
          padding-top: 50px;
          padding-left: 0px;
        }
        @media #{$xs}{
          padding-top: 40px;
          padding-left: 0px;
        }
        .pera-top{
            color: #234821;
            font-weight: 300;
            font-size: 26px;
            @media #{$xs}{
                font-size: 23px;
              }
        }
        .pera-bottom {
            font-size: 16px;
            color: $font-color1;
            font-weight: 300;
        }
    }
    // Right img
    .about-img{
        img{
            width: 100%;
        }
    }
}
.about-caption{
    @media #{$xs}{
        // margin-bottom: 35px;
    }
}

// Footer About
.about-low-area{
    // left content
    margin-bottom: -314px;
    position: relative;
    .about-caption{
        @media #{$lg}{
            padding-left: 89px;
        }
        @media #{$md}{
            padding-left: 89px;
        }
        @media #{$sm}{
            padding-left: 60px;
        }
        @media #{$xs}{
            padding-left: 25px;
        }
        .section-tittle{
            h2{
                color: #fff;
            }
        }
         p{
            font-size: 26px;
            color: #fff;
            line-height: 1.6;
            margin-bottom: 43px;
            padding-right: 50px;
            font-weight: 300;
            @media #{$lg}{
                padding-right: 20px;
            }
            @media #{$sm}{
                padding-right: 0px;
            }
            @media #{$xs}{
                padding-right: 0px;
                font-size: 19px;
            }
        }
    }

    // Right img
    .about-img{
        @media #{$md}{
         padding-top: 100px;
        }
        @media #{$sm}{
            padding-top: 100px;
        }
        @media #{$xs}{
            padding-top: 100px;
        }
        .about-font-img{
            position: relative;
            z-index: 1;
            right: -1px;
            img{
                width: 100%;
            }
        }
    }
}
.about-caption{
    @media #{$xs}{
        // margin-bottom: 35px;
    }
	
}
.bg-height.pb-160{
    @media #{$xs}{
        padding-bottom: 100px;
    }
}

//   background shape
.about-cap-wrapper{
    position: relative;
    &::before {
        position: absolute;
        content: "";
        width: 100%;
        height: 536px;
        background: #5AAC4E;
        top: -108px;
        border-radius: 0 0 0 156px;
        @media #{$xs}{
            height: 437px;
            border-radius: 0 0 0 56px;  
            top: -73px;
        }

    }
    &::after{
        position: absolute;
        bottom: 92px;
        content: "";
        border-top: 62px solid #5AAC4E;
        border-left: 800px solid transparent;
        left: 139px;
        z-index: -1;
        @media #{$xs}{
            content: unset;
        }
        @media #{$sm}{
            content: unset;
        }
        @media #{$md}{
            content: unset;
        }
        @media #{$lg}{
            content: unset;
        }
    }
}