/* 
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~

                                       ADDITIONAL 2 STYLE --- MAIN CSS START

~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
*/

/*bannerWrap*/

.bannerWrap .title {
	text-shadow: 0px 0px 14px #fff, 4px 3px 24px #fff;
}

.bannerWrap .title {
	max-width: 825px !important;
	margin: 0 auto;
}

.bannerWrap h3 {
	font-family: 'Muli';      
 	font-weight: bold;	
    letter-spacing: .5px;
 	font-size: 28px !important;
 	line-height: 38px !important;
 	position: relative;     
 	margin-bottom: 30px;
 	text-shadow: 0px 0px 14px #fff, 4px 3px 24px #fff;
}

.bannerWrap h3:after {
	content: '';
    display: inline-block;
    width: 4px;
    height: 62px;
    background: #4f6342;
    position: absolute;
    top: calc(100% + 30px);
    right: 50%;
}

.bannerWrap .elementor-widget-button {
	margin-top: 90px;
}

/*bannerWrap*/

/*projectWrap*/
.projectWrap .imageBox {
	position: relative;
}

/*projectWrap*/


/*animation*/
.scnTitle,
.page-loaded .title {
	opacity: 1;
}

.scnTitle.in-viewport-once,
.title {
	opacity: 0;
	-webkit-animation: fade-in 1s 0s ease forwards;
    animation: fade-in 1s 0s ease forwards;
}

@keyframes fade-in {

	0% {
    	opacity: 0;
	}

	100% {
		opacity: 1;
	}
}

.scnTitle label,
.title label {
	overflow: hidden;
	display: inline-block;
	vertical-align: top;
}

.scnTitle span,
.title span {
    display: inline-block;
    opacity: 0;
    -webkit-transform: translateY(140px); 
    -o-transform: translateY(140px);
    -moz-transform: translateY(140px); 
    transform: translateY(140px); 
}

.scnTitle.in-viewport-once span,
.page-loaded .title span {
	-webkit-transform: translateY(0);
	-o-transform: translateY(0);
	-moz-transform: translateY(0);
	transform: translateY(0);
	opacity: 1;
	-webkit-transition: transform ease 0s .5s,opacity ease .5s;
	-o-transition: transform ease 0s .5s,opacity ease .5s;
	-moz-transition: transform ease 0s .5s,opacity ease .5s;
	transition: transform ease 0s .5s,opacity ease .5s;
}


.page-loaded .title span:nth-child(1),
.scnTitle.in-viewport-once label:nth-child(1) span {
	-webkit-transition: transform cubic-bezier(0.68, -0.24, 0.16, 1.32) .8s 0s,opacity cubic-bezier(0.68, -0.24, 0.16, 1.32) .8s 0s;
	-o-transition: transform cubic-bezier(0.68, -0.24, 0.16, 1.32) .8s 0s,opacity cubic-bezier(0.68, -0.24, 0.16, 1.32) .8s 0s;
	-moz-transition: transform cubic-bezier(0.68, -0.24, 0.16, 1.32) .8s 0s,opacity cubic-bezier(0.68, -0.24, 0.16, 1.32) .8s 0s;
	transition: transform cubic-bezier(0.68, -0.24, 0.16, 1.32) .8s 0s,opacity cubic-bezier(0.68, -0.24, 0.16, 1.32) .8s 0s;
}

.page-loaded .title span:nth-child(2),
.scnTitle.in-viewport-once label:nth-child(2) span {
	-webkit-transition: transform cubic-bezier(0.68, -0.24, 0.16, 1.32) .8s .05s,opacity cubic-bezier(0.68, -0.24, 0.16, 1.32) .8s .075s;
	-o-transition: transform cubic-bezier(0.68, -0.24, 0.16, 1.32) .8s .05s,opacity cubic-bezier(0.68, -0.24, 0.16, 1.32) .8s .075s;
	-moz-transition: transform cubic-bezier(0.68, -0.24, 0.16, 1.32) .8s .05s,opacity cubic-bezier(0.68, -0.24, 0.16, 1.32) .8s .075s;
	transition: transform cubic-bezier(0.68, -0.24, 0.16, 1.32) .8s .05s,opacity cubic-bezier(0.68, -0.24, 0.16, 1.32) .8s .075s;
}

.page-loaded .title span:nth-child(3),
.scnTitle.in-viewport-once label:nth-child(3) span {
	-webkit-transition: transform cubic-bezier(0.68, -0.24, 0.16, 1.32) .8s .1s,opacity cubic-bezier(0.68, -0.24, 0.16, 1.32) .8s .15s;
	-o-transition: transform cubic-bezier(0.68, -0.24, 0.16, 1.32) .8s .1s,opacity cubic-bezier(0.68, -0.24, 0.16, 1.32) .8s .15s;
	-moz-transition: transform cubic-bezier(0.68, -0.24, 0.16, 1.32) .8s .1s,opacity cubic-bezier(0.68, -0.24, 0.16, 1.32) .8s .15s;
	transition: transform cubic-bezier(0.68, -0.24, 0.16, 1.32) .8s .1s,opacity cubic-bezier(0.68, -0.24, 0.16, 1.32) .8s .15s;
}
.page-loaded .title span:nth-child(4),
.scnTitle.in-viewport-once label:nth-child(4) span {
	-webkit-transition: transform cubic-bezier(0.68, -0.24, 0.16, 1.32) .8s .15s,opacity cubic-bezier(0.68, -0.24, 0.16, 1.32) .8s .225s;
	-o-transition: transform cubic-bezier(0.68, -0.24, 0.16, 1.32) .8s .15s,opacity cubic-bezier(0.68, -0.24, 0.16, 1.32) .8s .225s;
	-moz-transition: transform cubic-bezier(0.68, -0.24, 0.16, 1.32) .8s .15s,opacity cubic-bezier(0.68, -0.24, 0.16, 1.32) .8s .225s;
    transition: transform cubic-bezier(0.68, -0.24, 0.16, 1.32) .8s .15s,opacity cubic-bezier(0.68, -0.24, 0.16, 1.32) .8s .225s;
}

.page-loaded .bannerWrap .title label:nth-child(1) span {
	-webkit-transition-delay: 1s !important;
	-o-transition-delay: 1s !important;
	-moz-transition-delay: 1s !important;
	transition-delay: 1s !important;
}

.page-loaded .bannerWrap .title label:nth-child(2) span {
	-webkit-transition-delay: 1.1s !important;
	-o-transition-delay: 1.1s !important;
	-moz-transition-delay: 1.1s !important;
	transition-delay: 1.1s !important;
}

.page-loaded .bannerWrap .title label:nth-child(3) span {
	-webkit-transition-delay: 1.2s !important;
	-o-transition-delay: 1.2s !important;
	-moz-transition-delay: 1.2s !important;
	transition-delay: 1.2s !important;
}

.page-loaded .bannerWrap .title label:nth-child(4) span {
	-webkit-transition-delay: 1.3s !important;
	-o-transition-delay: 1.3s !important;
	-moz-transition-delay: 1.3s !important;
	transition-delay: 1.3s !important;
}

.scnTitle:not(.in-viewport-once) h2.elementor-heading-title:before {
	-webkit-clip-path: polygon(0 0, 35% 0, 35% 100%, 0% 100%);
	-o-clip-path: polygon(0 0, 35% 0, 35% 100%, 0% 100%);
	-moz-clip-path: polygon(0 0, 35% 0, 35% 100%, 0% 100%);
	clip-path: polygon(0 0, 35% 0, 35% 100%, 0% 100%);
}

.scnTitle h2.elementor-heading-title:before {
	-webkit-clip-path: polygon(0 0, 100% 0, 100% 100%, 0% 100%);
	-o-clip-path: polygon(0 0, 100% 0, 100% 100%, 0% 100%);
	-moz-clip-path: polygon(0 0, 100% 0, 100% 100%, 0% 100%);
	clip-path: polygon(0 0, 100% 0, 100% 100%, 0% 100%);
	-webkit-transition: all .8s;
	-o-transition: all .8s;
	-moz-transition: all .8s;
	transition: all .8s;
	-webkit-transition-delay: 1s;
	transition-delay: 1s;
}

.bannerWrap h3 {
	opacity: 0;
	-webkit-transition: all 1s;
	-o-transition: all 1s;
	-moz-transition: all 1s;
	transition: all 1s;
	-webkit-transition-delay: 1.8s;
	transition-delay: 1.8s;
} 

.page-loaded .bannerWrap h3 {
	opacity: 1;
}

.bannerWrap h3:after {
	-webkit-clip-path: polygon(0 0, 100% 0, 100% 50%, 0 50%);
	-o-clip-path: polygon(0 0, 100% 0, 100% 50%, 0 50%);
	-moz-clip-path: polygon(0 0, 100% 0, 100% 50%, 0 50%);
	clip-path: polygon(0 0, 100% 0, 100% 50%, 0 50%);
	-webkit-transition: all 1s;
	-o-transition: all 1s;
	-moz-transition: all 1s;
	transition: all 1s;
	opacity: 0;
	-webkit-transition-delay: 2s;    
	transition-delay: 2s;
}

.page-loaded .bannerWrap h3:after {
	opacity: 1;
	-webkit-clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%);
	-o-clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%);
	-moz-clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%);
	clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%);
}

.bannerWrap .dbtn {
	opacity: 0;
	-webkit-transition: all 1s !important;
	-o-transition: all 1s !important;
	-moz-transition: all 1s !important;
    transition: all 1s !important;
    -webkit-transition-delay: 2.2s !important;
    transition-delay: 2.2s !important;
}

.page-loaded .bannerWrap .dbtn {
	opacity: 1;
}

.journeyWrap .imageBox:not(.in-viewport-once) .elementor-swiper-button svg {
	opacity: 0;
	animation: none;
}

.journeyWrap .imageBox .elementor-swiper-button svg {
    -webkit-animation: bounce-effect 2s linear;
    animation: bounce-effect 2s linear;
    -webkit-animation-delay: 1s;
    animation-delay: 1s;
    -webkit-transition-delay: 1s;
    transition-delay: 1s;
    opacity: 1; 
} 

@keyframes bounce-effect {

	0%, 20% {
	    opacity: 0;
	}

	50%, 80%, 100% {
		-webkit-transform: translateY(0);
		-o-transform: translateY(0);
		-moz-transform: translateY(0);
	    transform: translateY(0);
	    opacity: 1;
	}
	40% {
		-webkit-transform: translateY(-30px);
		-o-transform: translateY(-30px);
		-moz-transform: translateY(-30px);
	    transform: translateY(-30px);
	    opacity: 1;
	}
	60% {
		-webkit-transform: translateY(-15px);
		-o-transform: translateY(-15px);
		-moz-transform: translateY(-15px);
	    transform: translateY(-15px);
	    opacity: 1;
	}
}

.footer .footerlogo:before {
	-webkit-clip-path: polygon(100% 0, 0 0, 0 100%, 100% 100%);
	-o-clip-path: polygon(100% 0, 0 0, 0 100%, 100% 100%);
	-moz-clip-path: polygon(100% 0, 0 0, 0 100%, 100% 100%);
	clip-path: polygon(100% 0, 0 0, 0 100%, 100% 100%);
	-webkit-transition: all 1.2s;
	-o-transition: all 1.2s;
	-moz-transition: all 1.2s;
	transition: all 1.2s;
	-webkit-transition-delay: 1s;   
	transition-delay: 1s;
}

.footer .footerlogo:not(.in-viewport-once):before {
	-webkit-clip-path: polygon(0 0, 0 0, 0 100%, 0% 100%);
	-o-clip-path: polygon(0 0, 0 0, 0 100%, 0% 100%);
	-moz-clip-path: polygon(0 0, 0 0, 0 100%, 0% 100%);
  clip-path: polygon(0 0, 0 0, 0 100%, 0% 100%);
}

.iphone.osx .bannerWrap .elementor-widget-button {
    margin-top: 20px;
}

.iphone.osx .filterCatWrap .categoryBox .buttonBox .elementor-widget-button .btnWrp,
.iphone.osx .filterCatWrap .categoryBox .buttonBox .elementor-widget-button .elementor-button-wrapper,
.iphone.osx .filterCatWrap .categoryBox .buttonBox .elementor-widget-button {
	height: auto;

}

/*animation*/


/*madeWrap */

.madeWrap .madeBox h3 {
	font-family: 'Poppins';
    font-weight: normal;
    font-size: 32px;
    line-height: 40px;
}

/*madeWrap */

/*imgpopWrap**/

.imgpopWrap .videoBox {
	transform: scale(1);
    transition: all .5s;
}

.imgpopWrap .videoBox:hover {
    transform: scale(.98);
}

.imgpopWrap .videobutton,
.imgpopWrap .dbtn {
	width: 100%;
    height: 100%;
    margin-top: 0;
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;	
    left: 0;
    opacity: 0;
    font-size: 0;
}

/*imgpopWrap*/

.seeWrap .elementor-widget-text-editor {
	position: relative;
}

.seeWrap .elementor-widget-container i {
	position: absolute;
	font-size: 55px;
}

.seeWrap .elementor-widget-container i.fa-quote-right  {
	top: -60px;
	left: -50px;
}  


.sliderWrap .elementor-swiper-button {
    width: 40px;
    height: 40px;
    border-radius: 50%;
    background: #8D6754;
    box-shadow: 0 0 0 0;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    box-shadow: 0px 0px 15px 0px rgba(0, 0, 0, 0.5);
    top: 43% !important;
    transition: all .8s !important;
}

.sliderWrap .elementor-swiper-button:hover {
	background: #fff;
}

.sliderWrap .elementor-swiper-button:hover svg {
	fill: #8D6754 !important;
}

.sliderWrap .elementor-swiper-button svg {
    position: absolute;
    top: 10px;
    transition: all .8s !important;
}

.sliderWrap .elementor-swiper-button.elementor-swiper-button-prev svg {
    left: 8px;
}

.sliderWrap .elementor-swiper-button.elementor-swiper-button-next svg {
	right: 8px;
}

.sliderWrap .elementor-swiper-button-prev {
    left: -80px !important;
}

.sliderWrap .elementor-swiper-button-next {
    right: -80px !important;
}

.sliderWrap .elementor-carousel-image {
    height: 370px !important;
}

.sliderWrap .swiper-slide {
    opacity: 1 !important;
    overflow: visible;
    height: inherit !important;  
}

.sliderWrap .swiper-slide .elementor-carousel-image-overlay {
    background-color: transparent !important;
    display: block;
	font-size: 20px;
    line-height: 30px;
    letter-spacing: 0.5px;
    position: static !important;
    text-transform: uppercase;
    width: auto;
    height: auto !important;
    bottom: 0;
    top: auto;
    padding: 30px 0 0;
}

.sliderWrap .elementor-skin-carousel .elementor-main-swiper {
    height: auto;
}

.sliderWrap .swiper-slide:not(:hover) .e-overlay-animation-fade {
    opacity: 1 !important;
}




/* 
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~

                                   ADDITIONAL 2 STYLE --- RESPONSIVE CSS START

~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
*/


/* Laptop screen */


@media (min-width: 1600px) and (max-width: 1700px) {

	.projectWrap .imageBox {
		min-height: 785px !important;
	}

	.projectWrap .topimg img {
		width: 520px !important;
	}

	.projectWrap .middleimg {
		left: -6px !important;
	}

	.projectWrap .bottomimg {
		left: 243px !important;
	}


}

@media (min-width: 1441px) and (max-width: 1599px) {

	.projectWrap .imageBox {
		min-height: 785px !important;
	}

	.projectWrap .topimg img {
		width: 520px !important;
	}

	.projectWrap .middleimg {
		left: -6px !important;
	}

	.projectWrap .bottomimg {
		left: 243px !important;
	}

}




@media (min-width: 1200px) and (max-width: 1440px) {

	.bannerWrap h3 {
		margin-bottom: 15px;
	}

	.bannerWrap h3:after {
		top: calc(100% + 11px);
	}

	.bannerWrap .elementor-widget-button {
    	margin-top: 70px;
    }

    .bannerWrap .title {
		max-width: 710px !important;
	}

	.madeWrap .madeBox h3 {
	    font-size: 30px;
	    line-height: 38px;
	}

	.sliderWrap .elementor-swiper-button-prev {
    	left: -60px !important;
	}

	.sliderWrap .elementor-swiper-button-next {
	    right: -60px !important;
	}

	.sliderWrap .elementor-swiper-button {
	   top: 50% !important;
	}


} 


@media (min-width: 1025px) and (max-width: 1199px) {

	.bannerWrap .lefticon svg,
	.bannerWrap .righticon svg {
		width: 180px;
		height: 180px !important; 
	}

	.bannerWrap h3 {
		font-size: 26px !important;
    	line-height: 35px !important;
	}

	.bannerWrap h3:after {
	    width: 3px;
	    height: 50px;
	    top: calc(100% + 12px);
	}

	.bannerWrap .elementor-widget-button {
    	margin-top: 45px;
    }


    .bannerWrap .title {
		max-width: 634px !important;
	}

	.madeWrap .madeBox h3 {
	    font-size: 28px;
	    line-height: 30px;
	}

   .seeWrap .elementor-widget-container i.fa-quote-right {
	    top: -60px;
	    left: -75px;
	}

	.sliderWrap .elementor-swiper-button-prev {
    	left: -60px !important;
	}

	.sliderWrap .elementor-swiper-button-next {
	    right: -60px !important;
	}

	.sliderWrap .elementor-swiper-button {
	   top: 50% !important;
	}



}



@media (min-width: 1025px) and (max-width: 1440px) { 


}


/* Large desktop */
@media (min-width: 1200px) {
	.projectWrap .imageBox:before {
	    width: 100vw !important;
	    left: auto;
	    right: 0;
	}

}

@media (max-width: 1200px) {
	.projectWrap .textBox {
	    display: flex;
	    justify-content: center;
	    flex-direction: column;
	}
}


   
/* Portrait tablet to landscape and desktop */
@media (min-width: 768px) and (max-width: 1024px) { 
	.bannerWrap .lefticon svg,
	.bannerWrap .righticon svg {
		width: 150px;
		height: 150px !important; 
	}

	.bannerWrap h3 {
		font-size: 24px !important;
    	line-height: 32px !important;
	}

	.bannerWrap h3:after {
	    width: 3px;
	    height: 50px;
	    top: calc(100% + 13px);
	}

	.bannerWrap .elementor-widget-button {
    	margin-top: 40px;
    }

     .bannerWrap .title {
		max-width: 510px !important;
	}

	.madeWrap .madeBox h3 {
	    font-size: 26px;
	    line-height: 34px;
	}

   .sliderWrap .elementor-swiper-button.elementor-swiper-button-next svg {
	    right: 6px;
	}

	.sliderWrap .elementor-swiper-button.elementor-swiper-button-prev svg {
	    left: 6px;
	}

	.sliderWrap .elementor-swiper-button svg {
    	top: 8px;
    }

	.sliderWrap .elementor-swiper-button-prev {
    	left: -12px !important;
	}

	.sliderWrap .elementor-swiper-button-next {
	    right: -12px !important;
	}

	.sliderWrap .elementor-swiper-button {
	    width: 35px;
	    height: 35px;
	   top: 50% !important;
	}

	
}	

     
/* Landscape phone to portrait tablet */
@media (max-width: 767px) { 
	.bannerWrap .lefticon svg,
	.bannerWrap .righticon svg {
		width: 120px !important;
		height: 120px !important; 
	}

	.bannerWrap h3 {
		font-size: 21px !important;
    	line-height: 30px !important;
    	margin-top: -12px;
    	margin-bottom: 12px;
    	text-shadow: 0px -5px 8px #fff, 20px 10px 26px #fff, 0px 5px 50px #fff !important;
	}

	.bannerWrap h3 br {
		display: none;
	}

	.bannerWrap h3:after {
	    width: 3px;
	    height: 30px;
	    top: calc(100% + 7px);
	}

	.bannerWrap .elementor-widget-button {
    	margin-top: 38px;
    }

    .projectWrap .textBox {
    	text-align: center;
    } 

    .projectWrap .imageBox {
    	max-width: 440px;
    	margin: 0 auto;
    }

    .bannerWrap .title {
		max-width: 410px !important;
    	text-shadow: 0px 0px 2px #fff, 2px 3px 7px #fff;
	}

	.bannerWrap h3 {
	 	text-shadow: 0px 0px 2px #fff, 2px 3px 7px #fff;
	} 

	.madeWrap .madeBox h3 {
	    font-size: 24px;
	    line-height: 32px;
	}

   .seeWrap .elementor-widget-container i {
   		font-size: 35px;
   		top: -10px;  
    }

   .seeWrap .elementor-widget-container i.fa-quote-right {
   		top: -40px;
   }


   .sliderWrap .elementor-swiper-button.elementor-swiper-button-next svg {
	    right: 6px;
	}

	.sliderWrap .elementor-swiper-button.elementor-swiper-button-prev svg {
	    left: 6px;
	}

	.sliderWrap .elementor-swiper-button svg {
    	top: 8px;
    }

	.sliderWrap .elementor-swiper-button-prev {
    	left: calc(50% - 203px) !important;
	}

	.sliderWrap .elementor-swiper-button-next {
	    right: calc(50% - 203px) !important;
	}

	.sliderWrap .elementor-swiper-button {
	    width: 35px;
	    height: 35px;
	   	top: 50% !important;
	}


	
	@media screen and (orientation: landscape) {

	}


	
}

     
/* Landscape phones and down */
@media (max-width: 480px) { 

	.sliderWrap .elementor-swiper-button-next {
	    right: calc(50% - 180px) !important;
	}

	.sliderWrap .elementor-swiper-button-prev {
    	left: calc(50% - 180px) !important;
	}




}