/*
Theme Name: Salient Child Theme
Description: This is a custom child theme for Salient
Theme URI:   https://themeforest.net/item/salient-responsive-multipurpose-theme/4363266
Author: ThemeNectar
Author URI:  https://themeforest.net/user/themenectar
Template: salient
Version: 1.0
*/

/* Start Header CSS */

div#header-space {
    position: absolute !important;
}

div#header-outer {
    background: #ffffff00 !important;
}

#header-outer header ul.sf-menu li a, div#HomeBanner a.extra-color-1 {
    font-family: Roboto !important;
    font-size: 18px !important;
    font-weight: 500 !important;
    border-radius: 0 !important;
}

#header-outer header li#menu-item-61.HeaderBtn a::before {
    background: #ffffff00 !important;
    margin: 0 !important;
}

#header-outer header li#menu-item-61.HeaderBtn a, div#HomeBanner a.extra-color-1 {
    padding: 17px 40px !important;
    background: #C9C9CA !important;
    margin: 0 !important;
    transition: .3s ease-in-out !important;
}

#header-outer header li#menu-item-61.HeaderBtn a span, div#HomeBanner a.extra-color-1 span {
    color: #214562 !important;
    font-weight: 600 !important;
    transition: .3s ease-in-out !important;
}

#header-outer header li#menu-item-61.HeaderBtn a:hover, div#HomeBanner a.extra-color-1:hover {
    background: #214562 !important;
    transition: .3s ease-in-out !important;
    transform: scale(1) !important;
}

#header-outer header li#menu-item-61.HeaderBtn a:hover span, div#HomeBanner a.extra-color-1:hover span {
    color: #c9c9ca !important;
    transition: .3s ease-in-out !important;
}

h2.WhiteColor, p.WhiteColor, h1.WhiteColor {
	color: #C9C9CA !important;
}

h2.Green, p.Green, h1.Green {
	color: #3C5D48 !important;
}

::selection {
    background: #3c5e49 !important;
    color: #eaeaea !important;
}

img::selection {
    background: #ff000000 !important;
}

::-webkit-scrollbar-track {
	border: 1px solid #324439;
	background-color: #eaeaea;
}

::-webkit-scrollbar {
	width: 15px;
	background-color: #F5F5F5;
}

::-webkit-scrollbar-thumb {
	background-color: #33463a;
    border-radius: 5px !important;
}

#page-header-bg h1 {
    font-family: 'Dharma Gothic E' !important;
    font-size: 110px !important;
    line-height: 100px !important;
    letter-spacing: 2px !important;
}

.page-id-44 div#ContactSec .row-bg-wrap {
    border-top: 4px solid #c9c9ca !important;
}

/* End Header CSS */

/* Start HomeBanner CSS */

.HeadMain {
    font-family: Dharma Gothic E !important;
    font-weight: 800 !important;
    color: #464646 !important;
    font-size: 100px !important;
    line-height: 100px !important;
}

p {
    font-family: Roboto !important;
    font-size: 20px !important;
    font-weight: 400 !important;
    letter-spacing: .5px !important;
    line-height: 30px !important;
    color: #464646 !important;
}

div#HomeBanner p {
    width: 45% !important;
}

div#HomeBanner .swiper-slide .content .buttons {
    padding-top: 50px !important;
}

div#HomeBanner .swiper-slide .button a {
    border-radius: 0 !important;
    padding: 20px 40px !important;
    transform: scale(1) !important;
    font-family: Roboto !important;
    font-size: 18px !important;
    font-weight: 500 !important;
}

div#HomeBanner .slider-pagination .swiper-pagination-switch:before {
    background: #ffffff !important;
    transform: scale(2.5) !important;
    box-shadow: inset 0 0 0 0.4px #ffffff !important;
    margin: 0 !important;
}

div#HomeBanner span.swiper-pagination-switch {
    opacity: 1 !important;
    margin: 0 0px !important;
}

div#HomeBanner span.swiper-pagination-switch.swiper-visible-switch.swiper-active-switch:before {
    background: #ffffff00 !important;
    box-shadow: inset 0 0 0 0 #000000 !important;
    box-shadow: inset 0 0 0 0.5px #ffffff !important;
    transform: scale(2.8) !important;
}

div#HomeBanner .button.transparent a:hover::before {
    backdrop-filter: blur(8px) !important;
    transition: .3s ease-in-out !important;
}

div#HomeBanner .button.transparent a::before {
    background: #ffffff00 !important;
    inset: 0 !important;
    position: absolute !important;
    content: "" !important;
    z-index: -1 !important;
    transition: .3s ease-in-out !important;
}

div#HomeBanner a.slider-prev i, a.slider-next i {
    border: 0 !important;
}

div#HomeBanner a.slider-next i::before {
    content: "\27F6" !important;
}

div#HomeBanner a.slider-prev i::before{
    content: "\27F5" !important;
}

div#HomeBanner a.slider-prev i::before, a.slider-next i::before {
    font-size: 60px !important;
}

div#HomeBanner a.slider-prev i {
    left: 10px !important;
}

.UpperTxt {
    font-family: Roboto !important;
    font-size: 30px !important;
    font-weight: 900 !important;
    line-height: 30px !important;
    letter-spacing: 0.25em !important;
}

/* End HomeBanner CSS */

/* Start About Sec CSS */

div#AboutSec img {
    margin: 0 0 0 auto !important;
}

div#AboutSec img.Img1 {
    position: absolute !important;
    top: 15px !important;
    transition: .8s cubic-bezier(0.61, 0.24, 0.48, 0.93) !important;
    left: -10px !important;
    z-index: -1 !important;
}

div#AboutSec .ImgCol .vc_column-inner:hover img.Img1 {
    left: -260px !important;
    transition: .8s cubic-bezier(0.61, 0.24, 0.48, 0.93) !important;
}

div#AboutSec p {
    width: 90% !important;
}

#BtnMain {
    margin: 20px 0 0px 0 !important;
    font-family: Roboto !important;
    font-size: 18px !important;
    font-weight: 500 !important;
    letter-spacing: 0.03em !important;
    padding: 18px 40px !important;
    border-radius: 0 !important;
    text-transform: uppercase !important;
}

#BtnMain:hover {
    background: #464646 !important;
    transform: scale(1) !important;
    color: #eaeaea !important;
    transition: .3s ease-in-out !important;
}

div#AboutSec .ImgCol {
    overflow: visible !important;
    z-index: -9 !important;
}

/* End About Sec CSS */

/* Start Services CSS */

.HeaderMain {
    text-align: center !important;
    margin-bottom: 30px !important;
}

div#ServicesSec .HoverTxt .ServiceHead {
    font-size: 40px !important;
    line-height: 40px !important;
}

div#ServicesSec .HoverTxt p {
    padding: 0 !important;
    font-size: 16px !important;
    font-weight: 500 !important;
}

div#ServicesSec .HoverTxt {
    margin: 0 !important;
    background: #EAEAEA !important;
    position: absolute !important;
    bottom: 40px !important;
    left: 30px !important;
    right: 30px !important;
    padding: 20px 30px !important;
}

div#ServicesSec img {
    width: 100% !important;
}

div#ServicesSec .col .vc_column-inner {
    padding: 0 5px !important;
}

div#ServicesSec a.play_button {
    position: absolute !important;
    right: 55px !important;
    bottom: 60px !important;
    height: 70px !important;
    width: 70px !important;
    background: #3C5D48 !important;
    border-radius: 50px !important;
    transition: .3s ease !important;
}

div#ServicesSec a.play_button::before {
    border: 0 !important;
}

div#ServicesSec .nectar_video_lightbox svg path {
    fill: white !important;
}

div#ServicesSec a.play_button:hover {
    transform: scale(1.1) !important;
    transition: .3s ease !important;
    box-shadow: inset 0 0 20px #22202075 !important;
}

div#ServicesSec .row-bg.viewport-desktop::before {
    content: url(https://wlfw.themetafounders.com/wp-content/uploads/2024/03/LeavesImg.png) !important;
    position: absolute !important;
    top: -200px !important;
    left: -10px !important;
    background-repeat: no-repeat !important;
    background-size: contain !important;
    animation: shake-horizontal 5s cubic-bezier(0.455, 0.030, 0.515, 0.955) infinite both;

}

@keyframes shake-horizontal {
  0%,
  100% {
        transform: translateX(0);
  }
  10%,
  30%,
  50%,
  70% {

        transform: translateX(-5px);
  }
  20%,
  40%,
  60% {
        transform: translateX(2px);
  }
  80% {
        transform: translateX(5px);
  }
  90% {
        transform: translateX(-5px);
  }
}

div#ServicesSec .inner-wrap.row-bg-layer {
    overflow: visible !important;
}

/* End Services CSS */

/* Start Choose Us Sec */

.HeaderMain p {
    width: 60% !important;
    margin: 0 auto !important;
}

div#ChooseUsSec #BtnMain {
    margin: 0 !important;
}

/* End Choose Us Sec */

/* Start Team Sec CSS */

div#TeamSec .HeaderMain {
    margin-bottom: 50px !important;
}

div#TeamSec .HoverTxt {
    background: #EAEAEA !important;
    position: absolute !important;
    bottom: 0px !important;
    left: 0 !important;
    padding: 5px 20px !important;
    width: 250px !important;
    transition: .5s ease-in-out !important;
    opacity: 0 !important;
}

div#TeamSec .HoverTxt p.HeadHover {
    padding: 0 !important;
    font-size: 25px !important;
    font-weight: 800 !important;
    line-height: 30px !important;
    transform: rotateX(285deg) !important;
    transition: 1s ease-in-out !important;
    opacity: 0;
}

div#TeamSec .HoverTxt p.SubHeadHover {
    font-size: 13px !important;
    font-weight: 500 !important;
    line-height: 20px !important;
    letter-spacing: 0.03em !important;
    text-transform: uppercase !important;
    transition: .8s ease-in-out !important;
    left: -80px !important;
    opacity: 0 !important;
}

div#TeamSec .vc_col-sm-3 .vc_column-inner:hover .HoverTxt {
    bottom: 40px !important;
    transition: .5s ease-in-out !important;
    overflow: hidden !important;
}

div#TeamSec .vc_col-sm-3 .vc_column-inner:hover .HoverTxt .HeadHover {
    transform: rotateX(0deg) !important;
    transition: 1s ease-in-out !important;
    opacity: 1;
}

div#TeamSec .vc_col-sm-3 .vc_column-inner:hover .HoverTxt .SubHeadHover {
    left: 0px !important;
    position: relative !important;
    opacity: 1 !important;
    transition: .8s ease-in-out !important;
}
 
div#TeamSec .vc_col-sm-3 .vc_column-inner:hover .HoverTxt {
    opacity: 1 !important;
}

div#TeamSec div#ImgRow img {
    width: 100% !important;
    border-radius: 0 50px 0 0 !important;
}

div#TeamSec .IconImg {
    background: #3C5D48 !important;
    padding: 50px 30px 40px 30px !important;
    position: absolute !important;
    top: -115px !important;
    border-radius: 0 0 50px 50px !important;
}

.BgTexture .row-bg.viewport-desktop {
    background-image: url(https://wlfw.themetafounders.com/wp-content/uploads/2024/03/BeforeBg.png) !important;
    background-repeat: no-repeat;
    background-size: 40% 200% !important;
    background-position: right !important;
}

div#TeamSec .row-bg.viewport-desktop {
    border-top: 3px solid #3c5e4991 !important;
    border-bottom: 2px solid #3c5e4991 !important;
}


/* End Team Sec CSS */

/* Start Our Project CSS */

div#OurProjectSec .LeftHeader p {
    width: 40% !important;
}

div#OurProjectSec #BtnMain {
    margin-bottom: 10px !important;
}

div#ProjectBody img {
    width: 100% !important;
    object-fit: cover !important;
    height: 900px !important;
    object-position: bottom !important;
}

div#ProjectBody .twentytwenty-horizontal .twentytwenty-handle::before {
    content: "211111" !important;
    color: red !important;
    position: absolute !important;
}

div#ProjectBody .twentytwenty-left-arrow::before, span.twentytwenty-right-arrow::before {
    position: absolute !important;
    color: #eaeaea !important;
    font-family: Roboto !important;
    font-size: 20px !important;
    font-weight: 500 !important;
    text-transform: uppercase !important;
    letter-spacing: 1px !important;
    top: -30px !important;
}

div#ProjectBody .twentytwenty-left-arrow::before {
    content: "Before" !important;
    right: 20px !important;
}

div#ProjectBody .twentytwenty-right-arrow::before {
    content: "After" !important;
    left: 20px !important;
}

/* End Our Project CSS */

/* Start TestimonialSec CSS */

div#TestimonialSec blockquote p {
    width: 60% !important;
    margin: 60px auto 0 auto !important;
    padding: 0 !important;
}

div#TestimonialSec blockquote {
    text-align: center !important;
}

div#TestimonialSec span.open-quote {
    display: none !important;
}

div#TestimonialSec blockquote span.wrap {
    position: absolute !important;
    top: -60px !important;
    left: 0 !important;
    right: 0 !important;
    font-family: Roboto !important;
    font-weight: 500 !important;
    line-height: 20px !important;
}

div#TestimonialSec blockquote span.wrap span {
    font-size: 25px !important;
    line-height: 25px !important;
}

div#TestimonialSec blockquote span.wrap span::before {
    content: "╼";
    left: -5px !important;
    position: relative !important;
}

div#TestimonialSec .owl-dots button.owl-dot span {
    background: #464646 !important;
    transform: scale(2) !important;
    margin: 0 8px !important;
}

div#TestimonialSec .span_12.dark .owl-theme .owl-dots .owl-dot.active span {
    background: #ff000000 !important;
    box-shadow: inset 0 0 0px 0.5px #464646 !important;
    transform: scale(2.4) !important;
}

div#TestimonialSec .owl-nav.disabled {
    display: flex !important;
    justify-content: space-between !important;
    position: absolute !important;
    left: 0 !important;
    right: 0 !important;
    top: 50% !important;
}

div#TestimonialSec .owl-nav {
    margin: 0 !important;
    border: none !important;
    display: flex !important;
    justify-content: end !important;
    gap: 10px !important;
}
 
div#TestimonialSec .owl-nav button {
    border: 0 !important;
    padding: 6px 60px 6px 30px !important;
    background: #12121200 !important;
}

div#TestimonialSec .owl-nav button:hover{
    background: #00000000 !important;
}

div#TestimonialSec .owl-nav button span {
    position: relative !important;
    color: #fff00000;
    font-size: 50px !important;
}

div#TestimonialSec .owl-nav button span::before {
    position: absolute !important;
    content: "\27F6" !important;
    color: #464646 !important;
    font-size: 50px !important;
    left: -14px !important;
    top: -5px !important;
    transition: .5s ease-in-out !important;
}

div#TestimonialSec .owl-nav button:hover span::before{
    transform: translateX(12px) !important;
}

div#TestimonialSec .owl-nav button.owl-prev span::before {
    content: "\27F5" !important;
    transition: .5s ease-in-out !important;
}

div#TestimonialSec .owl-nav button.owl-prev:hover span::before {
    content: "\27F5" !important;
    transform: translateX(-12px) !important;
}


/* End TestimonialSec CSS */

/* Start Contact Sec CSS */

div#ContactSec .Inline {
    display: flex !important;
    gap: 20px !important;
}

div#ContactSec .Inline p {
    width: 100% !important;
}

div#ContactSec input.wpcf7-form-control.wpcf7-text, textarea {
    background: #ffffff00 !important;
    border-radius: 0 !important;
    border: 2px solid #ffffff4d !important;
    font-family: 'Roboto' !important;
    font-weight: 400 !important;
    font-size: 18px !important;
    color: #fff !important;
    padding: 15px 15px !important;
}

div#ContactSec input.wpcf7-form-control.wpcf7-text::placeholder, textarea::placeholder {
    color: #ffffff8c !important;
}

div#ContactSec input.wpcf7-form-control.wpcf7-text:focus, textarea:focus {
    border: 2px solid #fff !important;
}

div#ContactSec input#BtnMain {
    background: #C9C9CA !important;
    color: #3d5d47 !important;
}

div#ContactSec .wpcf7-response-output {
    background: #c9c9ca !important;
    color: #3d5d47 !important;
    font-family: 'Roboto' !important;
    border: 0 !important;
}

div#ContactSec span.wpcf7-not-valid-tip {
    background: #c9c9ca !important;
}

/* End Contact Sec CSS */

/* Start Footer CSS */

#footer-outer #footer-widgets .widget h4 {
    font-family: Dharma Gothic E !important;
    font-size: 50px !important;
    font-weight: 800 !important;
    line-height: 50px !important;
    letter-spacing: 0.07em !important;
    color: #3b5c47 !important;
}

#footer-outer #footer-widgets ul li {
    font-family: Roboto !important;
    font-size: 18px !important;
    font-weight: 400 !important;
    line-height: 30px !important;
    letter-spacing: 0.03em !important;
    width: fit-content !important;
}

#footer-outer #footer-widgets ul li a, #footer-outer #footer-widgets ul li {
    display: flex !important;
    align-items: baseline !important;
    gap: 8px !important;
}

#footer-outer #footer-widgets ul li i.fas.fa-envelope {
    font-size: 17px !important;
}

#footer-outer #footer-widgets ul li i {
    color: #3b5c47 !important;
}

#footer-outer #footer-widgets ul li:hover a {
    color: #578d6b !important;
    opacity: 1 !important;
}

#footer-outer #footer-widgets ul li.current-menu-item a {
    color: #578d6b !important;
}

#footer-outer #footer-widgets p.WhiteColor {
    width: 80% !important;
    font-size: 18px !important;
}

div#copyright p {
    color: #C9C9CA !important;
    font-size: 18px !important;
    margin: 0 !important;
}

div#copyright {
    padding: 10px 0 !important;
}

#footer-outer #copyright .col ul {
    display: flex !important;
    gap: 20px !important;
    margin: 0 !important;
}

#footer-outer #copyright .col ul li {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    margin: 0 !important;
    height: 36px !important;
    width: 36px !important;
    background: white !important;
    border-radius: 30px !important;
    transition: .5s ease-in-out !important;
}

#footer-outer #copyright .col ul li i {
    color: #3b5c47 !important;
    transition: .5s ease-in-out !important;
}

#footer-outer #copyright .col ul li:hover i {
    color: #fff !important;
    transform: rotate(360deg) !important;
    transition: .5s ease-in-out !important;
}

#footer-outer #copyright .col ul li:hover {
    background: #232323 !important;
    transform: scale(1.2) !important;
    transition: .5s ease-in-out !important;
    box-shadow: 0 0 20px 1px #fff7f714 !important;
}

#footer-outer #copyright .container {
    display: flex !important;
    align-items: center !important;
}

/* End Footer CSS */