/* ----------------------------------------------------------------------------------------

* Author        : Awaiken

* Template Name : Renofix - Renovation Building & Painting HTML Template

* File          : CSS File

* Version       : 1.0

* ---------------------------------------------------------------------------------------- */

/* INDEX

----------------------------------------------------------------------------------------

01. Global Variables

02. General css

03. Header css

04. Hero css

05. About Us css

06. Our Services css

07. Our Features css

08. What We Do css

09. Our Projects css

10. Intro Video css

11. How It Work css

12. Our Pricing css

13. Our Testimonials css

14. Our FAQs css

15. Our Blog css

16. Scrolling Ticker css

17. Footer css

18. About Us Page css

19. Services Page css

20. Service Single css

21. Blog Archive css

22. Blog Single css

23. Projects Page css

24. Project Single css

25. Team Page css

26. Team Single css

27. Pricing Page css

28. Testimonials Page css

29. Image Gallery css

30. Video Gallery css

31. FAQs Page css

32.	Contact Us Page css

33. 404 Error Page css

34. Responsive css

35. Home - Version 2 css

36. Home - Version 3 css 

-------------------------------------------------------------------------------------- */



/************************************/

/*** 	 01. Global Variables	  ***/

/************************************/



:root{

	--primary-color				: #13110D;
	--secondary-color			: #F7F5EE;
	--bg-color					: #FFFFFF;
	--text-color				: #757575;
	--accent-color				: #FF6527;
	--white-color				: #FFFFFF;
	--divider-color				: #13110D1A;
	--dark-divider-color		: #FFFFFF1A;
	--error-color				: rgb(230, 87, 87);
	--default-font				: "Stack Sans Headline", sans-serif; 
}



/************************************/

/*** 	   02. General css		  ***/

/************************************/



html,

body{

	width: 100%;

	overflow-x: clip;

}



body{
	font-family: var(--default-font);
	font-size: 16px;
	font-weight: 400;
	line-height: 1em;
	color: var(--text-color);
	background: var(--bg-color);
}

::-webkit-scrollbar-track{
	background-color: var(--primary-color);
	border-left: 1px solid var(--primary-color);
}



::-webkit-scrollbar{
	width: 7px;
	background-color: var(--primary-color);
}



::-webkit-scrollbar-thumb{
	background: var(--accent-color);
}



::selection{
	color: var(--white-color);
	background-color: var(--accent-color);
	filter: invert(1);
}



p{
	line-height: 1.6em;
	margin-bottom: 1.5em;
}



h1,

h2,

h3,

h4,

h5,

h6{
	font-weight: 600;
	line-height: 1.1em;
	color: var(--primary-color);
	margin :0;
}



figure{

	margin: 0;

}



img{

	max-width: 100%;

}



a{

	text-decoration: none;

}



a:hover{
	text-decoration: none;
	outline: 0;
}



a:focus{
	text-decoration: none;
	outline: 0;
}



.container{

	max-width: 1500px;

}



.container,
.container-fluid,
.container-lg,
.container-md,
.container-sm,
.container-xl,
.container-xxl{
    padding-right: 15px;
    padding-left: 15px;
}



.image-anime{

	position: relative;

	overflow: hidden;

}



.image-anime:after{

	content: "";

	position: absolute;

    width: 200%;

    height: 0%;

    left: 50%;

    top: 50%;

    background-color: rgba(255,255,255,.3);

    transform: translate(-50%,-50%) rotate(-45deg);

    z-index: 1;

}



.image-anime:hover:after{

    height: 250%;

    transition: all 600ms linear;

    background-color: transparent;

}
.navbar-brand img {
	width: 105px;
	position: relative;
	top: 12px;
}


.reveal{

	position: relative;

    display: -webkit-inline-box;

    display: -ms-inline-flexbox;

    display: inline-flex;

    visibility: hidden;

    overflow: hidden;

}



.reveal img{

    height: 100%;

    width: 100%;

    -o-object-fit: cover;

    object-fit: cover;

    -webkit-transform-origin: left;

    transform-origin: left;

}



.row{

    margin-right: -15px;

    margin-left: -15px;

}



.row > *{

	padding-right: 15px;

	padding-left: 15px;

}



.row.no-gutters{

    margin-right: 0px;

    margin-left: 0px;

}



.row.no-gutters > *{

    padding-right: 0px;

    padding-left: 0px;

}

.team-social-list ul li a svg {

	width: 18px;

}

.btn-default{

	position: relative;

	display: inline-block;

	font-size: 16px;

	font-weight: 600;

	line-height: 1em;

	text-transform: capitalize;

	background: var(--accent-color);

	color: var(--white-color);

	border-radius: 100px;

	padding: 17px 30px;

	margin-right: 36px;

	border: none;

	transition: all 0.4s ease-in-out;

	z-index: 1;

}

	.middle_video_popup_area {

		position: fixed;

		top: 0;

		left: 0;

		z-index: 999;

		background: rgba(0, 0, 0, 0.6);

		width: 100%;

		height: 100%;

		display: flex;

		justify-content: center;

		align-items: center;

		opacity: 0;

		visibility: hidden;

		transition: all 0.4s ease-in-out;

	}

	.middle_video_popup_area2{

		opacity: 1;

		visibility: visible;

		transition: all 0.4s ease-in-out;

	}

.middle_video_popup_inner {

	position: relative;

}

.vls_vid_pop {

	font-size: 23px;

	color: #fff;

	text-align: right;

	margin: 0 0 9px;

	width: 24px;

	height: 24px;

	display: flex;

	justify-content: center;

	align-items: center;

	cursor: pointer;

	position: absolute;

	right: 0;

	top: -34px;

}



.btn-default:hover{

	color: var(--bg-color);

}



.btn-default::before{

	content: '';

	position: absolute;

	top: 50%;

	right: -32px;

	width: 46px;

	height: 46px;

	background-color: var(--accent-color);

	background-image: url('../images/arrow-white.svg');

	background-repeat: no-repeat;

	background-position: center center;

	background-size: 20px auto;

	border: 1px solid var(--white-color);

	border-radius: 50%;

	transform: translateY(-50%);

	transition: all 0.4s ease-in-out;

}



.btn-default:hover:before{

	background-color: var(--primary-color);

	right: -36px;

}



.btn-default::after{

	content: '';

	position: absolute;

	top: 0;

	bottom: 0;

	left: 50%;

	right: 50%;

	width: 0;

	height: 100%;

	border-radius: 100px;

	opacity: 0;

	background: var(--primary-color);

	transition: all 0.4s ease-in-out;

	z-index: -1;

}

.btn-default:hover:after{

	width: 100%;

	left: 0;

	right: 0;

	opacity: 1;

}

.btn-default.btn-highlighted:hover{

	color: var(--primary-color);

}



.btn-default.btn-highlighted:after{

	background: var(--white-color);

}



.btn-default.btn-highlighted::before{

	border-color: var(--primary-color);

}



.btn-default.btn-highlighted:hover::before{

	background-color: var(--white-color);

	background-image: url('../images/arrow-primary.svg');

}

.readmore-btn{

	position: relative;

	display: inline-block;

	font-weight: 600;

	line-height: normal;

	text-transform: capitalize;

	color: var(--primary-color);

	padding-right: 28px;

	transition: all 0.4s ease-in-out;

}

.readmore-btn::before{

	content: '';

    position: absolute;

    top: 50%;

    right: 0;

	transform: translate(-2px, -50%);

	background-image: url('../images/arrow-primary.svg');

	background-repeat: no-repeat;

	background-position: right center;

	background-size: cover;

	width: 16px;

	height: 16px;

    transition: all 0.4s ease-in-out;

}

.readmore-btn:hover::before{

	transform: translate(0px, -50%);

}

.cb-cursor:before{

	background: var(--accent-color);

}

.preloader{

	position: fixed;

	top: 0;

	left: 0;

	right: 0;

	bottom: 0;

	z-index: 1000;

	background: var(--primary-color);

	display: flex;

	align-items: center;

	justify-content: center;

}

.loading-container,

.loading{

	height: 100px;

	position: relative;

	width: 100px;

	border-radius: 100%;

}

.loading-container{

	margin: 40px auto;

}

.loading{

	border: 1px solid transparent;

	border-color: transparent var(--white-color) transparent var(--white-color);

	animation: rotate-loading 1.5s linear 0s infinite normal;

	transform-origin: 50% 50%;

}

.loading-container:hover .loading,

.loading-container .loading{

	transition: all 0.5s ease-in-out;

}

#loading-icon{

	position: absolute;

	top: 50%;

	left: 50%;

	max-width: 66px;

	transform: translate(-50%, -50%);

}

@keyframes rotate-loading{

	0%{

		transform: rotate(0deg);

	}



	100%{

		transform: rotate(360deg);

	}

}

.bg-section{

	width: 100%;

	max-width: 1880px;

	background-color: var(--secondary-color);

	border-radius: 12px;

	margin: 0 auto;

}

.bg-section .container-fluid{

	padding: 0;

}

.dark-section{

	background-color: var(--primary-color);

	background-image: url('../images/dark-section-bg-shape.png');

	background-repeat: no-repeat;

	background-position: center center;

	background-size: cover;

}

.section-row{

	margin-bottom: 80px;

}

.section-row .section-title{

	margin-bottom: 0; 

}

.section-row .section-title.section-title-center{

	width: 100%;

	max-width: 800px;

	margin: 0 auto;

	text-align: center;

}

.section-btn{

	text-align: right;

}

.section-content-btn .section-btn{

	margin-top: 30px;

	text-align: left;

}

.section-title-content p{

	margin-bottom: 20px;

}

.section-title-content p:last-child{

	margin-bottom: 0;	

}

.section-title{

	margin-bottom: 40px;

}

.section-title h3{

	position: relative;

	display: inline-block;

	font-size: 14px;

	text-transform: uppercase;

	line-height: normal;

	padding-left: 24px;

    margin-bottom: 15px;

}

.section-title h3::before{

	content: '';

    position: absolute;

    left: 0;

    top: 50%;

    transform: translateY(-50%);

    background: url('../images/icon-sub-heading.svg') no-repeat;

	background-position: center center;

	background-size: cover;

    width: 18px;

    height: 18px;

}

.section-title h1{

	font-size: 54px;

	margin-bottom: 0;

	cursor: none;

}

.section-title h2{

	font-size: 44px;

	font-weight: 500;

	margin-bottom: 0;

	cursor: none;

}

.section-title p{

	margin-top: 20px;

	margin-bottom: 0;

}

.dark-section .section-title h3,

.dark-section .section-title h1,

.dark-section .section-title h2,

.dark-section .section-title p,

.dark-section .section-title-content p{

	color: var(--white-color);

}

.help-block.with-errors ul{

	margin: 0;

	text-align: left;

}

.help-block.with-errors ul li{

	color: var(--error-color);

	font-weight: 500;

	font-size: 14px;

}







/************************************/

/**** 	   03. Header css		 ****/

/************************************/



header.main-header{

	position: absolute;

	top: 20px;

	left: 0;

	right: 0;

	z-index: 100;

}



header.main-header .header-sticky{

	position: relative;

	top: 0;

	background: transparent;

	border-radius: 0;

	border-bottom: 1px solid var(--dark-divider-color);

	z-index: 100;

}



header.main-header .header-sticky.hide{

	transform: translateY(-100%);

	transition: transform 0.3s ease-in-out;

}



header.main-header .header-sticky.active{

	position: fixed;

	top: 0;

	left: 0;

	right: 0;

    transform: translateY(0);

	background: var(--primary-color);

	border-bottom: 1px solid var(--dark-divider-color);

	border-radius: 0 0 12px 12px;

}



.navbar{

	padding: 30px 0px;

	align-items: center;

}



.navbar-brand{

	padding: 0;

	margin: 0;

}



.main-menu .nav-menu-wrapper{

	flex: 1;

	text-align: center;

	margin: 0 1.042vw;

}



.main-menu .nav-menu-wrapper > ul{

	align-items: center;

	display: inline-flex;

}



.main-menu ul li{

	margin: 0 10px;

	position: relative;

}



.main-menu ul li a{

	font-size: 16px;

	font-weight: 500;

	line-height: 1.2em;

	padding: 12px 10px !important;

	color: var(--white-color);

	background: transparent;

	border-radius: 0px;

	text-transform: capitalize;

	transition: all 0.3s ease-in-out;

}



.main-menu ul li.submenu > a:after{

	content: '\f107';

	font-family: 'FontAwesome';

	font-weight: 900;

	font-size: 14px;

	margin-left: 8px;

	display: none;

}



.main-menu ul li a:hover,

.main-menu ul li a:focus{

	color: var(--accent-color);

}



.main-menu ul ul{

	visibility: hidden;

	opacity: 0;

	transform: scale(1,0.8);

	transform-origin: top;

	padding: 0;

	margin: 0;

	list-style: none;

	width: 235px;

	border-radius: 12px;

	position: absolute;

	left: 0;

	top: 100%;

	background: var(--accent-color);

	transition: all 0.3s ease-in-out;

	text-align: left;

}



.main-menu ul li.submenu:first-child ul{

    width: 235px;

}



.main-menu ul ul ul{

	left: 100%;

	top: 0;

	text-align: left;

}



.main-menu ul li:hover > ul{

	visibility: visible;

	opacity: 1;

	transform: scale(1,1);

    padding: 5px 0;

}



.main-menu ul li.submenu ul li.submenu > a:after{

    content: '\f105';

    float: right;

}



.main-menu ul ul li{

	margin: 0;

	padding: 0;

}



.main-menu ul ul li a{

	color: var(--white-color);

	padding: 6px 20px !important;

	transition: all 0.3s ease-in-out;

}



.main-menu ul ul li a:hover,

.main-menu ul ul li a:focus{

	color: var(--primary-color);

	background-color: transparent;

	padding: 6px 20px 6px 23px !important;

}



.main-menu ul li.highlighted-menu{

    display: none;

}



.responsive-menu,

.navbar-toggle{

	display: none;

}



.responsive-menu{

	top: 0;

	position: relative;

}



.slicknav_btn{

	background: var(--accent-color);

	padding: 0;

	display: flex;

	align-items: center;

	justify-content: center;

	width: 38px;

	height: 38px;

	margin: 0;

	border-radius: 6px;

}



.slicknav_icon .slicknav_icon-bar{

	display: block;

	width: 100%;

	height: 3px;

	width: 22px;

	background-color: var(--white-color);

	border-radius: 6px;

	margin: 4px auto !important;

	transition: all 0.1s ease-in-out;

}



.slicknav_icon .slicknav_icon-bar:first-child{

	margin-top: 0 !important;

}



.slicknav_icon .slicknav_icon-bar:last-child{

	margin-bottom: 0 !important;

}



.navbar-toggle a.slicknav_btn.slicknav_open .slicknav_icon span.slicknav_icon-bar:nth-child(1){

    transform: rotate(-45deg) translate(-5px, 5px);

}



.navbar-toggle a.slicknav_btn.slicknav_open .slicknav_icon span.slicknav_icon-bar:nth-child(2){

    opacity: 0;

}



.navbar-toggle a.slicknav_btn.slicknav_open .slicknav_icon span.slicknav_icon-bar:nth-child(3){

    transform: rotate(45deg) translate(-5px, -5px);

}



.slicknav_menu{

	position: absolute;

    width: 100%;

	padding: 0;

	background: var(--accent-color);

}



.slicknav_menu ul{

	margin: 5px 0;

}



.slicknav_menu ul ul{

	margin: 0;

}



.slicknav_nav .slicknav_row,

.slicknav_nav li a{

	position: relative;

	font-size: 16px;

	font-weight: 500;

	text-transform: capitalize;

	padding: 7px 20px;

	color: var(--white-color);

	line-height: normal;

	margin: 0;

	border-radius: 0 !important;

	transition: all 0.3s ease-in-out;

}



.slicknav_nav a:hover,

.slicknav_nav a:focus,

.slicknav_nav .slicknav_row:hover{

	background-color: transparent;

	color: var(--primary-color);

}



.slicknav_menu ul ul li a{

    padding: 7px 20px 7px 30px;

}



.slicknav_arrow{

	font-size: 0 !important;

}



.slicknav_arrow:after{

	content: '\f107';

	font-family: 'FontAwesome';

	font-weight: 900;

	font-size: 12px;

	margin-left: 8px;

	color: var(--white-color);

	position: absolute;

	right: 15px;

	top: 50%;

	transform: translateY(-50%);

	transition: all 0.3s ease-out;

}



.slicknav_open > a .slicknav_arrow:after{

    transform: translateY(-50%) rotate(-180deg);

	color: var(--primary-color);

}



/************************************/

/***         04. Hero css	      ***/

/************************************/



.baner_video video {

	width: 100%;

	height: 100%;

}

.hero {

	position: relative;

	background-image: url('../images/hero-bg-image.png');

	padding: 0 0;

	margin-top: 20px;

	overflow: hidden;

}

.container.banner_up_content {

	position: absolute;

	top: 33%;

	left: 21px;

}

.baner_video {

	position: relative;

}

.ban_overlay {

	position: absolute;

	top: 0;

	left: 0;

	width: 100%;

	height: 100%;

	background: rgba(0, 0, 0, 0.6);

}

.hero-content {

	height: 100%;

	align-content: center;

	width: 52%;

}

.video-play-button a svg {

	width: 22px;

	color: #fff;

}



.hero-content-body{

	display: flex;

	flex-wrap: wrap;

	align-items: center;

	gap: 20px 30px;

}



.video-play-button{

	display: inline-flex;

	align-items: center;

	gap: 20px;

}



.video-play-button a{

	position: relative;

	height: 50px;

	width: 50px;

	background: var(--accent-color);

	border-radius: 50%;

	display: flex;

	justify-content: center;

	align-items: center;

	cursor: none;

	transition: all 0.3s ease-in-out;

}



.video-play-button:hover a{

	background: var(--white-color);

}



.video-play-button a.bg-effect:before,

.video-play-button a.bg-effect:after{

	content: '';

	position: absolute;

	top: -30%;

	left: -30%;

	width: 100%;

	height: 100%;

	border: 40px solid var(--white-color);

	opacity: 50%;

	border-radius: 50%;

	transform: scale(0.6);

	z-index: -1;

	animation: border-zooming 1.2s infinite linear;

}



.video-play-button a.bg-effect:after{

	animation-delay: .3s;

}



@keyframes border-zooming{

	100%{

		transform: scale(1);

		opacity: 0;

	}

}



.video-play-button a i{

	font-size: 16px;

	color: var(--white-color);

	margin-left: 2px;

	transition: all 0.3s ease-in-out;

}



.video-play-button:hover a i{

	color: var(--primary-color);

}



.video-play-button h3{

	font-size: 18px;

	color: var(--white-color);

}



.hero-content-footer{

	display: flex;

	flex-wrap: wrap;

	align-items: center;

	gap: 20px 30px;

	border-top: 1px solid var(--dark-divider-color);

	margin-top: 40px;

	padding-top: 40px;

}



.hero-rating-box{

	display: flex;

	align-items: center;

	gap: 15px;

}



.hero-rating-box .icon-box img{

	width: 100%;

	max-width: 54px;

}



.hero-rating-header{

	display: flex;

	align-items: center;

	gap: 15px;

}



.hero-rating-header h2{

	color: var(--white-color);

	font-size: 30px;

	font-weight: 700;

	width: 80px;

}



.hero-rating-header p{

	margin-bottom: 0;

}



.hero-rating-header p i{

	color: var(--accent-color);

}



.hero-rating-review-content{

	margin-top: 5px;

}



.hero-rating-review-content p,

.hero-rating-box-content p{

	color: var(--white-color);

	margin: 0;

}



.hero-rating-box-content{

	max-width: 380px;

}



.hero-image{

	height: 100%;

	align-content: end;

}



.hero-image figure{

	display: block;

	border-radius: 12px 12px 0 0;

}



.hero-image img{

	width: 100%;

	aspect-ratio: 1 / 0.9;

	object-fit: cover;

	margin-bottom: -150px;

	border-radius: 12px 12px 0 0;

}



/************************************/

/***       05. About Us css	      ***/

/************************************/



.about-us{

	padding: 100px 0;

}



.about-us-image-box{

	position: relative;

	display: flex;

	flex-wrap: wrap;

	padding-left: 4.948vw;

}



.about-us-image-box-1{

	width: 71%;

	padding-bottom: 120px;

}



.about-us-image figure{

	display: block;

	border-radius: 12px;

}



.about-us-image img{

	width: 100%;

	object-fit: cover;

	border-radius: 12px;

}



.about-us-image-box-1 .about-us-image img{

	aspect-ratio: 1 / 1.308;

}



.about-us-image-box-2{

	position: relative;

	width: 29%;

	align-content: end;

	z-index: 1;

}



.about-us-image-box-2 .about-us-image figure{

	border: 6px solid var(--white-color);

	border-radius: 20px;

	margin-left: -155px;

	overflow: hidden;

}



.about-us-image-box-2 .about-us-image img{

	aspect-ratio: 1 / 1.302;

}



.about-us-contact-box{

	position: absolute;

	max-width: 200px;

	background-color: var(--accent-color);

	border-radius: 12px;

	top: 100px;

	left: 0;

	text-align: center;

	overflow: hidden;

	z-index: 1;

}



.about-us-contact-box-header{

	padding: 25px 20px;

}



.about-us-contact-box-header .icon-box{

	position: relative;

	display: inline-flex;

	align-items: center;

	justify-content: center;

	height: 40px;

	width: 40px;

	background-color: var(--white-color);

	border-radius: 5px;

	margin-bottom: 20px;

	overflow: hidden;

}



.about-us-contact-box-header .icon-box:before{

	content: '';

	position: absolute;

	top: 0;

	bottom: 0;

	right: 0;

	left: 0;

	background: var(--primary-color);

	border-radius: 10px;

	width: 100%;

	height: 100%;

	transform: rotate(180deg) scale(0);

	transition: all 0.4s ease-in-out;

	z-index: 0;

}



.about-us-contact-box:hover .icon-box:before{

	border-radius: 0;

	transform: rotate(0) scale(1);

}



.about-us-contact-box-header .icon-box img{

	position: relative;

	width: 100%;

	max-width: 22px;

	transition: all 0.4s ease-in-out;

	z-index: 1;

}



.about-us-contact-box:hover .icon-box img{

	filter: brightness(0) invert(1);

}



.about-us-contact-content h3{

	font-size: 16px;

	color: var(--white-color);

	font-weight: 400;

}



.about-us-contact-content p{

	font-size: 14px;

	color: var(--white-color);

	margin: 5px 0 0;

}



.about-us-contact-content p a{

	color: inherit;

	transition: all 0.3s ease-in-out;

}



.about-us-contact-content p a:hover{

	color: var(--primary-color);

}



.about-us-contact-box-btn a{

	display: block;

	font-size: 14px;

	font-weight: 600;

	color: var(--white-color);

	background-color: var(--primary-color);

	padding: 15px;

}



.about-us-content{

	margin-left: 20px;

}



.about-us-body{

	border-top: 1px solid var(--divider-color);

	padding-top: 40px;

}



.about-us-body-item-list{

	display: flex;

	flex-wrap: wrap;

	gap: 30px;

}



.about-us-body-item{

	width: calc(50% - 15px);

	display: flex;

	flex-wrap: wrap;

	align-items: center;

	gap: 15px;

}



.about-us-body-item .icon-box{

	position: relative;

	height: 50px;

	width: 50px;

	background-color: var(--accent-color);

	border-radius: 50%;

	display: flex;

	align-items: center;

	justify-content: center;

	overflow: hidden;

}



.about-us-body-item .icon-box:before{

	content: '';

	position: absolute;

	top: 0;

	bottom: 0;

	right: 0;

	left: 0;

	background: var(--primary-color);

	border-radius: 50%;

	width: 100%;

	height: 100%;

	transform: scale(0);

	transition: all 0.4s ease-in-out;

	z-index: 0;

}



.about-us-body-item:hover .icon-box:before{

	transform: scale(1);

}



.about-us-body-item .icon-box img{

	position: relative;

	width: 100%;

	max-width: 24px;

	z-index: 1;

}



.about-us-body-item-content{

	width: calc(100% - 65px);

}



.about-us-body-item-content h3{

	font-size: 20px;

	line-height: 1.4em;

}



.about-us-list{

	background-color: var(--secondary-color);

	border-radius: 12px;

	padding: 30px;

	margin-top: 40px;

}



.about-us-list ul{

	display: flex;

	flex-wrap: wrap;

	gap: 20px;

	list-style: none;

	margin: 0;

	padding: 0;

}

.scrolling-content.scrolling_first span {

	color: #fff;

	font-size: 45px;

	font-weight: 800;

}

.scrolling-content.scrolling_second span {

	font-size: 45px;

	font-weight: 800;

	color: #fff;

}

.about-us-list ul li{

	width: calc(50% - 10px);

	position: relative;

	color: var(--primary-color);

	line-height: 1.5em;

}

.about-us-list ul li::before {

		display: none;

}

.about-us-list ul li svg {

	width: 23px;

	color: #ff6527;

}

.video-play-button:hover a svg {

	color: #000;

}

.about-us-list ul li::before{

	content: '\f058';

    position: absolute;

    font-family: 'Font Awesome 7 Free';

    font-size: 18px;

    font-weight: 900;

    color: var(--accent-color);

    top: 0;

    left: 0;

}



.about-us-footer{

	display: flex;

	flex-wrap: wrap;

	gap: 20px 30px;

	border-top: 1px solid var(--divider-color);

	margin-top: 40px;

	padding-top: 40px;

}



.about-author-box{

	display: flex;

	flex-wrap: wrap;

	align-items: center;

	gap: 15px;

}



.about-author-box-image figure{

	display: block;

	border-radius: 50%;

}



.about-author-box-image figure img{

	width: 100%;

	max-width: 50px;

	border-radius: 50%;

}



.about-author-box-content h3{

	font-size: 20px;

}



.about-author-box-content p{

	margin: 5px 0 0;

}



/************************************/

/***      06. Our Services css    ***/

/************************************/



.our-services{

	padding: 100px 0;

}



.service-item{

	background-color: var(--white-color);

	height: calc(100% - 30px);

	margin-bottom: 30px;

	padding: 10px;

	border-radius: 12px;

}



.service-item-header{

	padding: 30px 30px 0;

	margin-bottom: 40px;

}



.service-item-content h2{

	font-size: 20px;

}



.service-item-content h2 a{

	color: inherit;

}



.service-item-content p{

	margin: 10px 0 0;

}



.service-item-btn{

	border-top: 1px solid var(--divider-color);

	margin-top: 20px;

	padding-top: 20px;

}



.service-item-image-box{

	position: relative;

}



.service-item-image a,

.service-item-image figure{

	cursor: none;

	border-radius: 12px;

	overflow: hidden;

}



.service-item-image img{

	width: 100%;

	aspect-ratio: 1 / 0.647;

	object-fit: cover;

	border-radius: 12px;

	transition: all 0.6s ease-in-out;

}



.service-item:hover .service-item-image img{

	transform: scale(1.06);

}



.service-item-image-box .icon-box{

	position: absolute;

	bottom: 30px;

	left: 30px;

	width: 50px;

	height: 50px;

	background-color: var(--accent-color);

	border-radius: 50%;

	display: flex;

	align-items: center;

	justify-content: center;

	overflow: hidden;

}



.service-item-image-box .icon-box:before{

	content: '';

	position: absolute;

	top: 0;

	bottom: 0;

	right: 0;

	left: 0;

	background: var(--primary-color);

	border-radius: 50%;

	width: 100%;

	height: 100%;

	transform: scale(0);

	transition: all 0.4s ease-in-out;

}



.service-item:hover .icon-box:before{

	transform: scale(1);

}



.service-item-image-box .icon-box img{

	position: relative;

	width: 100%;

	max-width: 24px;

	z-index: 1;

}



.section-footer-text{

	margin-top: 30px;

	text-align: center;

}



.section-footer-text p{

	margin-bottom: 0;

	color: var(--primary-color);

}



.section-footer-text p span{

	display: inline-block;

	font-size: 14px;

	font-weight: 600;

	background: var(--accent-color);

	color: var(--white-color);

	line-height: 1em;

	padding: 4px 10px;

	border-radius: 20px;

	margin-right: 10px;

}



.section-footer-text p a{

	font-weight: 600;

	text-transform: capitalize;

	text-decoration: underline;

	text-underline-offset: 3px;

	color: var(--accent-color);

	transition: all 0.3s ease-in-out;

}



.section-footer-text p a:hover{

	color: var(--primary-color);

}



.section-footer-text ul{

	width: 100%;

	padding: 0;

	margin: 20px 0 0;

	list-style: none;

}



.section-footer-text ul li{

	display: inline-block;

	font-size: 20px;

	font-weight: 600;

	line-height: normal;

	color: var(--primary-color);

	margin-right: 10px;

}



.section-footer-text ul li:last-child{

	margin: 0;

}



.section-footer-text ul li i{

	color: var(--accent-color);

}



.section-footer-text.section-footer-contact{

	display: flex;

    flex-wrap: wrap;

    align-items: center;

    justify-content: center;

    gap: 10px 20px;

}



.section-footer-text.section-footer-contact span{

	width: 30px;

    height: 30px;

    padding: 0;

    display: inline-flex;

    justify-content: center;

	align-items: center;

    margin-right: 10px;

}



.section-footer-text.section-footer-contact span img{

	width: 100%;

	max-width: 16px;

}



.section-footer-text.section-satisfy-img{

	display: flex;

    flex-wrap: wrap;

    align-items: center;

    justify-content: center;

    gap: 10px;

}



.section-footer-text.section-satisfy-img .satisfy-client-image{

	border-color: var(--white-color);

}



.section-footer-text.section-satisfy-img .satisfy-client-image figure img{

	max-width: 30px;

}



.section-footer-text.section-satisfy-img .satisfy-client-image.add-more{

	width: 32px;

	height: 32px;

}



.section-footer-text.section-satisfy-img .satisfy-client-image.add-more img{

	width: 100%;

	max-width: 16px;

}



.section-footer-text.section-footer-contact ul,

.section-footer-text.section-satisfy-img ul{

	margin: 5px 0 0;

}



.dark-section .section-footer-text p,

.dark-section .section-footer-text ul li{

	color: var(--white-color);

}



.dark-section .section-footer-text p a:hover{

	color: var(--white-color);

}



.dark-section .section-footer-text.section-satisfy-img .satisfy-client-image{

	border-color: var(--primary-color);

}



/************************************/

/***  	07. Our Features css      ***/

/************************************/



.our-features{

	padding: 100px 0;

}



.features-clients-box{

	display: flex;

	flex-direction: column;

	gap: 30px;

	height: calc(100% - 30px);

	margin-bottom: 30px;

}



.features-clients-item{

	background-color: var(--secondary-color);

	border-radius: 12px;

	display: flex;

	flex-wrap: wrap;

	align-items: center;

	justify-content: space-between;

	gap: 20px;

	padding: 30px;

}



.satisfy-client-images{

	display: flex;

	align-items: center;

}



.satisfy-client-image{

	position: relative;

    display: inline-block;

    margin-left: -14px;

	border: 1px solid var(--white-color);

	border-radius: 50%;

	overflow: hidden;

	z-index: 1;

}



.satisfy-client-image:first-child{

	margin: 0;

}



.satisfy-client-image figure{

	display: block;

	border-radius: 50%;

}



.satisfy-client-image figure img{

	width: 100%;

	max-width: 44px;

	border-radius: 50%;

}



.satisfy-client-image.add-more{

	width: 44px;

	height: 44px;

	background-color: var(--accent-color);

	display: flex;

	justify-content: center;

	align-items: center;

}



.satisfy-client-image.add-more img{

	max-width: 20px;

}



.satisfy-client-image.add-more i{

	font-size: 20px;

	color: var(--white-color);

}



.satisfy-client-image.add-more h3{

	font-size: 14px;

	color: var(--white-color);

}



.features-clients-item .satisfy-client-content{

	margin-top: 20px;

}



.features-clients-item .satisfy-client-content h3{

	font-size: 20px;

}



.satisfy-client-counter-item h2{

	font-size: 50px;

	font-weight: 700;

}



.project-features-item{

	position: relative;

	border-radius: 12px;

	height: 100%;

	overflow: hidden;

}



.features-item-image{

	position: absolute;

	top: 0;

	right: 0;

	bottom: 0;

	left: 0;

	height: 100%;

	width: 100%;

}



.features-item-image:before{

	content: '';

	position: absolute;

	top: 0;

	right: 0;

	bottom: 0;

	left: 0;

	height: 100%;

	width: 100%;

	background-color: var(--primary-color);

	opacity: 60%;

}



.features-item-image figure{

	display: block;

	height: 100%;

}



.features-item-image img{

	width: 100%;

	height: 100%;

	object-fit: cover;

}



.features-item-body{

	position: relative;

	height: 100%;

	display: flex;

	flex-direction: column;

	justify-content: space-between;

	gap: 30px;

	padding: 40px;

}



.features-item-content h3{

	font-size: 20px;

}



.features-item-content p{

	margin: 10px 0 0;

}



.features-item-content ul{

	list-style: disc;

	border-top: 1px solid var(--divider-color);

	margin: 30px 0 0;

	padding: 30px 0 0 20px;

}



.features-item-content ul li{

	line-height: 1.5em;

	margin-bottom: 15px;

}



.features-item-content ul li:last-child{

	margin-bottom: 0;

}



.features-item-content ul li::marker{

	color: var(--accent-color);

}



.features-item-body .features-item-content h3,

.features-item-body .features-item-content p{

	color: var(--white-color);

}



.project-features-counter-list{

	display: flex;

	flex-wrap: wrap;

	gap: 20px;

	border-top: 1px solid var(--dark-divider-color);

	padding-top: 30px;

}



.project-features-counter-item{

	width: calc(50% - 10px);

}



.project-features-counter-item h2{

	font-size: 34px;

	color: var(--white-color);

}



.project-features-counter-item p{

	color: var(--white-color);

	margin: 5px 0 0;

}



.core-features-image{

	position: relative;

	height: calc(100% - 30px);

	margin-bottom: 30px;

	align-content: end;

}



.core-features-image:before{

	content: '';

	position: absolute;

	top: 0;

	right: 0;

	bottom: 0;

	left: 0;

	height: 100%;

	width: 100%;

	background: linear-gradient(180deg, transparent 0%, var(--accent-color) 100%);

	border-radius: 12px;

}



.core-features-image figure{

	position: relative;

	display: block;

	text-align: center;

	border-radius: 12px 12px 0 0;

	z-index: 1;

}



.core-features-image img{

	width: 100%;

	aspect-ratio: 1 / 1.41;

	object-fit: cover;

	border-radius: 12px 12px 0 0;

}



.features-support-item{

	display: flex;

	flex-direction: column;

	justify-content: space-between;

	gap: 30px;

	background-color: var(--secondary-color);

	border-radius: 12px;

	padding: 40px;

	height: calc(100% - 30px);

	margin-bottom: 30px;

	overflow: hidden;

}



.features-support-item-image{

	max-width: 450px;

	margin: -140px -140px 0 auto;

}



.features-support-item-image figure{

	mask-image: url('../images/project-support-image-bg-mask.svg');

	-webkit-mask-image: url('../images/project-support-image-bg-mask.svg');

    mask-repeat: no-repeat;

    mask-position: center center;

    mask-size: cover;

	border-radius: 12px;

}



.features-support-item-image img{

	width: 100%;

    aspect-ratio: 1 / 1.053;

    object-fit: cover;

	border-radius: 12px;

}



/************************************/

/***  	  08. What We Do css      ***/

/************************************/



.What-we-do{

	padding: 100px 0;

}



.What-we-do-item{

	position: relative;

	min-height: 395px;

	background-color: var(--dark-divider-color);

	backdrop-filter: blur(20px);

    -webkit-backdrop-filter: blur(20px);

    border-radius: 12px;

	display: flex;

	flex-direction: column;

	justify-content: space-between;

	gap: 30px;

	height: calc(100% - 30px);

	margin-bottom: 30px;

	padding: 30px;

	overflow: hidden;

}



.What-we-do-item .What-we-do-bg-icon{

	position: absolute;

	top: -15px;

	right: -15px;

}



.What-we-do-item .What-we-do-bg-icon img{

	width: 100%;

	max-width: 100px;

}



.What-we-do-item-header h3{

	display: inline-block;

	font-size: 14px;

	font-weight: 500;

	line-height: normal;

	color: var(--white-color);

	border: 1px solid var(--dark-divider-color);

	border-radius: 5px;

	padding: 7px 16px;

}



.What-we-do-item-content{

	margin-bottom: 40px;

}



.What-we-do-item-content h3{

	font-size: 20px;

	color: var(--white-color);

}



.What-we-do-item-content p{

	color: var(--white-color);

	margin: 10px 0 0;

}



.What-we-do-item-body .icon-box{

    position: relative;

    width: 50px;

    height: 50px;

    background: var(--accent-color);

    border-radius: 50%;

    display: flex;

    align-items: center;

    justify-content: center;

    overflow: hidden;

}



.What-we-do-item-body .icon-box::before{

    content: '';

    position: absolute;

    top: 0;

    bottom: 0;

    right: 0;

    left: 0;

    background: var(--white-color);

    border-radius: 50%;

    width: 100%;

    height: 100%;

    transform: scale(0);

    transition: all 0.4s ease-in-out;

    z-index: 0;

}



.What-we-do-item:hover .icon-box::before{

	transform: scale(1);

}



.What-we-do-item-body .icon-box img{

	position: relative;

    width: 100%;

    max-width: 24px;

    transition: all 0.4s ease-in-out;

    z-index: 1;

}



.What-we-do-item:hover .icon-box img{

	filter: brightness(0) invert(0);

}



/************************************/

/***  	  09. Our Projects css    ***/

/************************************/



.our-projects{

	padding: 100px 0;

}



.project-item{

	position: relative;

}



.project-item-image{

	height: 100%;

}



.project-item-image a,

.project-item-image figure{

	position: relative;

	display: block;

	height: 100%;

	border-radius: 12px;

	overflow: hidden;

	cursor: none;

}



.project-item-image img{

	width: 100%;

	height: 100%;

	aspect-ratio: 1 / 1.305;

	object-fit: cover;

	transition: all 0.6s ease-in-out;

}



.project-item:hover .project-item-image img{

	transform: scale(1.06);

}



.project-item-btn{

	position: absolute;

	top: 30px;

	right: 30px;

	opacity: 0;

	visibility: hidden;

	transform: scale(0);

	transition: all 0.4s ease-in-out;

	z-index: 1;

}



.project-item:hover .project-item-btn{

	transform: scale(1);

	opacity: 1;

	visibility: visible;

}



.project-item-btn a{

	background: var(--accent-color);

	border-radius: 50%;

	width: 46px;

	height: 46px;

	display: flex;

	align-items: center;

	justify-content: center;

	transition: all 0.3s ease-in-out;

}



.project-item-btn a:hover{

	background: var(--primary-color);

}



.project-item-btn a img{

	width: 100%;

	max-width: 28px;

	transition: all 0.3s ease-in-out;

}



.project-item-btn a:hover img{

	transform: rotate(45deg);

}



.project-item-content{

	position: absolute;

	left: 10px;

	bottom: 10px;

	right: 10px;

	background: var(--divider-color);

    backdrop-filter: blur(20px);

    -webkit-backdrop-filter: blur(20px);

    border-radius: 12px;

	padding: 20px;

	transition: all 0.4s ease-in-out;

	z-index: 1;

}



.project-item:hover .project-item-content{

	bottom: 15px;

}



.project-item-content h2{

	font-size: 16px;

	font-weight: 400;

	line-height: 1.4em;

	color: var(--white-color);

}



.project-item-content h2 a{

	color: inherit;

}



.project-slider .project-pagination{

	text-align: center;

	margin-top: 50px;

}



.project-slider .project-pagination .swiper-pagination-bullet{

    position: relative;

    height: 10px;

    width: 10px;

    background: var(--divider-color);

	opacity: 1;

    margin: 0 4px;

	border-radius: 100px;

	transition: all 0.4s ease-in-out;

}



.project-slider .project-pagination .swiper-pagination-bullet-active{

	background: var(--accent-color);

	width: 30px;

}



.our-projects .section-footer-text{

	margin-top: 40px;

}



/************************************/

/***  	10. Intro Video css       ***/

/************************************/



.intro-video{

	position: relative;

	min-height: 820px;

	align-content: end;

	overflow: hidden;

}



.intro-video-image{

	position: absolute;

	top: 0;

	bottom: 0;

	left: 0;

	right: 0;

	width: 100%;

	height: 100%;

}



.intro-video-image figure{

	display: block;

	width: 100%;

	height: 100%;

}



.intro-video-image figure:before{

    content: '';

    position: absolute;

    top: 0;

    right: 0;

    bottom: 0;

    left: 0;

    width: 100%;

    height: 100%;

    background: var(--primary-color);

    opacity: 20%;

    z-index: 0;

}



.intro-video-image figure img{

	width: 100%;

	height: 100%;

	object-fit: cover;

}



.intro-video-content-box{

	position: relative;

	max-width: 480px;

	background-color: var(--divider-color);

	backdrop-filter: blur(30px);

    -webkit-backdrop-filter: blur(30px);

	padding: 40px;

	border-radius: 12px 12px 0 0;

	z-index: 1;

}



.intro-video-header .video-play-button{

	padding: 15px 0 15px 15px;

	margin-bottom: 40px;

}



.intro-video-header-title h3{

	font-size: 34px;

	line-height: 1.4em;

	color: var(--white-color);

}



.intro-video-content{

	border-top: 1px solid var(--dark-divider-color);

	padding-top: 40px;

	margin-top: 60px;

}



.intro-video-content p{

	color: var(--white-color);

	margin: 0;

}



/************************************/

/***  	  11. How It Work css     ***/

/************************************/



.how-it-work{

	padding: 100px 0;

}



.how-work-item{

	position: relative;

	background-color: var(--secondary-color);

	border-radius: 12px;

	display: flex;

	flex-direction: column;

	justify-content: space-between;

	gap: 30px;

	min-height: 410px;

	height: calc(100% - 30px);

	margin-bottom: 30px;

	padding: 40px;

	overflow: hidden;

}



.how-work-item::before{

	content: '';

	position: absolute;

	right: 0;

	bottom: 0;

	left: 0;

	width: 100%;

	height: 0%;

	background: var(--accent-color);

	border-radius: 12px;

	z-index: 0;

	transition: all 0.4s ease-in-out;

}



.how-work-item.active::before,

.how-work-item:hover::before{

	height: 100%;

	border-radius: 0;

}



.how-work-item-header{

	position: relative;

	display: flex;

	align-items: center;

	justify-content: space-between;

	gap: 10px;

	z-index: 1;

}



.how-work-item-header .icon-box{

	position: relative;

	height: 50px;

	width: 50px;

	background-color: var(--accent-color);

	border-radius: 50%;

	display: flex;

	align-items: center;

	justify-content: center;

	overflow: hidden;

}



.how-work-item-header .icon-box:before{

	content: '';

	position: absolute;

	top: 0;

	bottom: 0;

	right: 0;

	left: 0;

	background: var(--white-color);

	border-radius: 50%;

	width: 100%;

	height: 100%;

	transform: scale(0);

	transition: all 0.4s ease-in-out;

	z-index: 0;

}



.how-work-item.active .how-work-item-header .icon-box:before,

.how-work-item:hover .how-work-item-header .icon-box:before{

	transform: scale(1);

}



.how-work-item-header .icon-box img{

	position: relative;

	width: 100%;

	max-width: 24px;

	transition: all 0.4s ease-in-out;

	z-index: 1;

}



.how-work-item.active .how-work-item-header .icon-box img,

.how-work-item:hover .how-work-item-header .icon-box img{

	filter: brightness(0) invert(0);

}



.how-work-item-no{

	position: relative;

	padding: 0 16px;

}



.how-work-item-no:before,

.how-work-item-no:after{

	content: '[';

	position: absolute;

	top: 0;

	left: 0;

	font-size: 20px;

	color: var(--accent-color);

	transition: all 0.4s ease-in-out;

}



.how-work-item-no:after{

	content: ']';

	left: auto;

	right: 0;

}



.how-work-item.active .how-work-item-no:before,

.how-work-item:hover .how-work-item-no:before,

.how-work-item.active .how-work-item-no:after,

.how-work-item:hover .how-work-item-no:after{

	color: var(--white-color);

}



.how-work-item-no h3{

	position: relative;

	font-size: 16px;

	font-weight: 600;

	line-height: normal;

	transition: all 0.4s ease-in-out;

}



.how-work-item.active .how-work-item-no h3,

.how-work-item:hover .how-work-item-no h3{

	color: var(--white-color);

}



.how-work-item-content{

	position: relative;

	z-index: 1;

}



.how-work-item-content h3{

	font-size: 20px;

	transition: all 0.4s ease-in-out;

}



.how-work-item-content p{

	margin: 10px 0 0;

	transition: all 0.4s ease-in-out;

}



.how-work-item-content ul{

	list-style: disc;

	margin: 30px 0 0;

	padding: 30px 0 0 20px;

	border-top: 1px solid var(--divider-color);

	transition: all 0.4s ease-in-out;

}



.how-work-item.active .how-work-item-content ul,

.how-work-item:hover .how-work-item-content ul{

	border-color: var(--dark-divider-color);

}



.how-work-item-content ul li{

	line-height: 1.5em;

	margin-bottom: 10px;

	transition: all 0.3s ease-in-out;

}



.how-work-item-content ul li:last-child{

	margin-bottom: 0;

}



.how-work-item-content ul li::marker{

	color: var(--accent-color);

	transition: all 0.3s ease-in-out;

}



.how-work-item.active .how-work-item-content h3,

.how-work-item:hover .how-work-item-content h3,

.how-work-item.active .how-work-item-content p,

.how-work-item:hover .how-work-item-content p,

.how-work-item.active .how-work-item-content ul li,

.how-work-item:hover .how-work-item-content ul li,

.how-work-item.active .how-work-item-content ul li::marker,

.how-work-item:hover .how-work-item-content ul li::marker{

	color: var(--white-color);

}



.how-it-work-footer{

	margin-top: 30px;

}



.how-it-work-footer-list ul{

	display: flex;

	flex-wrap: wrap;

	justify-content: center;

	gap: 20px;

	list-style: none;

	padding: 0;

	margin: 0;

}



.how-it-work-footer-list ul li{

	position: relative;

	font-weight: 500;

    background: var(--secondary-color);

    color: var(--primary-color);

    padding: 12px 20px 12px 36px;

    border-radius: 100px;

	transition: all 0.4s ease-in-out;

}



.how-it-work-footer-list ul li:hover{

	background: var(--accent-color);

	color: var(--white-color);

}



.how-it-work-footer-list ul li::before{

	content: '';

    position: absolute;

    left: 16px;

    top: 50%;

    transform: translateY(-50%);

    background: var(--accent-color);

    border-radius: 50%;

    width: 6px;

    height: 6px;

	transition: all 0.4s ease-in-out;

}



.how-it-work-footer-list ul li:hover::before{

	background: var(--white-color);

}



/************************************/

/***  	  12. Our Pricing css     ***/

/************************************/



.our-pricing{

	padding: 100px 0;

}



.pricing-item{

	background-color: var(--dark-divider-color);

	backdrop-filter: blur(30px);

    -webkit-backdrop-filter: blur(30px);

	border-radius: 12px;

	height: calc(100% - 30px);

	margin-bottom: 30px;

	padding: 10px;

}



.pricing-item-content{

	background-color: var(--dark-divider-color);

	border-radius: 12px;

	padding: 30px;

}



.pricing-item-content h3{

	display: inline-block;

	font-size: 16px;

	font-weight: 400;

	color: var(--white-color);

	line-height: normal;

	padding: 6px 15px;

	border: 1px solid var(--dark-divider-color);

	border-radius: 10px;

	margin-bottom: 20px;

}



.pricing-item-content h2{

	font-size: 44px;

	color: var(--white-color);

}



.pricing-item-content p{

	color: var(--white-color);

	border-top: 1px solid var(--dark-divider-color);

	padding-top: 20px;

	margin: 20px 0 0;

}



.pricing-item-body{

	padding: 40px 30px 30px;

}



.pricing-item-list h3{

	font-size: 20px;

	color: var(--white-color);

}



.pricing-item-list ul{

	list-style: none;

	border-top: 1px solid var(--dark-divider-color);

	margin: 30px 0 0 0;

	padding: 30px 0 0 0;

}



.pricing-item-list ul li{

	position: relative;

	color: var(--white-color);

	line-height: 1.5em;

	padding-left: 25px;

	margin-bottom: 15px;

}



.pricing-item-list ul li:last-child{

	margin-bottom: 0;

}



.pricing-item-list ul li:before{

    content: '\f058';

    position: absolute;

    font-family: 'Font Awesome 7 Free';

    font-size: 18px;

    font-weight: 900;

    color: var(--accent-color);

    top: 0;

    left: 0;

}



.pricing-item-btn{

	margin-top: 30px;

}



.pricing-item-btn .btn-default{

	width: 100%;

	border-radius: 12px;

	text-align: center;

	margin: 0;

}



.pricing-item-btn .btn-default::after{

	border-radius: 12px;

}



.pricing-item-btn .btn-default::before{

	display: none;

}



.pricing-benefit-list{

	margin-top: 30px;

}



.pricing-benefit-list ul{

	display: flex;

	flex-wrap: wrap;

    justify-content: center;

	list-style: none;

	margin: 0;

	padding: 0;

	gap: 20px 40px;

}



.pricing-benefit-list ul li{

	color: var(--white-color);

    display: inline-flex;

    align-items: center;

}



.pricing-benefit-list ul li img{

	width: 100%;

	max-width: 20px;

	margin-right: 10px;

}



/************************************/

/***  13. Our Testimonials css    ***/

/************************************/



.our-testimonials{

	padding: 100px 0;

}



.testimonial-client-box{

	background-color: var(--accent-color);

	border-radius: 12px;

	display: flex;

	flex-direction: column;

	justify-content: space-between;

	gap: 30px;

	height: 100%;

	padding: 40px;

}



.testimonial-client-header-content{

	margin-top: 30px;

}



.testimonial-client-header-content h2{

	font-size: 20px;

	line-height: normal;

	color: var(--white-color);

}



.testimonial-client-header-content h2 span{

	font-size: 40px;

}



.testimonial-client-header-content p{

	color: var(--white-color);

	margin: 10px 0 0;

}



.testimonial-client-box-body{

	border-top: 1px solid var(--dark-divider-color);

	padding-top: 30px;

}



.testimonial-client-box-body ul{

	list-style: disc;

	margin: 0;

	padding: 0 0 0 20px;

}



.testimonial-client-box-body ul li{

	color: var(--white-color);

	line-height: 1.5em;

	margin-bottom: 10px;

}



.testimonial-client-box-body ul li:last-child{

	margin-bottom: 0;

}



.testimonial-client-box-body ul li::marker{

	color: var(--white-color);

}



.testimonial-slider .swiper-wrapper{

	cursor: none;

}



.testimonial-item{

	background-color: var(--secondary-color);

	border-radius: 12px;

	min-height: 480px;

	display: flex;

	flex-wrap: wrap;

	flex-direction: column;

	justify-content: space-between;

	gap: 40px;

	padding: 40px;

}



.testimonial-rating{

	margin-bottom: 20px;

}



.testimonial-rating i{

	font-size: 20px;

	color: var(--accent-color);

}



.testimonial-item-content p{

	font-size: 20px;

	font-weight: 500;

	color: var(--primary-color);

	margin: 0;

}



.testimonial-item-footer{

	border-top: 1px solid var(--divider-color);

	display: flex;

	flex-wrap: wrap;

	align-items: center;

	gap: 10px;

	padding-top: 40px;

}



.testimonial-author{

	width: calc(100% - 50px);

	display: flex;

	flex-wrap: wrap;

	align-items: center;

	gap: 15px;

}



.testimonial-author-image figure{

	display: block;

	border-radius: 50%;

}



.testimonial-author-image figure img{

	width: 100%;

	max-width: 50px;

	border-radius: 50%;

}



.testimonial-author-content{

	width: calc(100% - 65px);

}



.testimonial-author-content h3{

	font-size: 20px;

}



.testimonial-author-content p{

	margin: 5px 0 0;

}



.testimonial-item-quote img{

	width: 100%;

	max-width: 40px;

}



.testimonial-pagination{

    position: relative;

	display: flex;

    margin-top: 50px;

}



 .testimonial-pagination .swiper-pagination-bullet{

	position: relative;

    height: 4px;

    width: 100%;

    background: var(--divider-color);

	border-radius: 0;

	opacity: 1;

    margin: 0 !important;

	transition: all 0.3s ease-in-out;

}



 .testimonial-pagination .swiper-pagination-bullet:before{

	content: '';

    display: block;

    position: absolute;

    top: 0px;

	left: auto;

	right: 0;

    background: var(--accent-color);

	border-radius: 0px;

	width: 0;

	height: 4px;

	transition: all 0.4s ease-in-out;

}



 .testimonial-pagination .swiper-pagination-bullet.swiper-pagination-bullet-active:before{

	width: 100%;

	right: auto;

	left: 0;

}



.our-testimonials  .section-footer-text{

	margin-top: 60px;

}



/************************************/

/***  		14. Our FAQs css	  ***/

/************************************/



.our-faqs{

	padding: 100px 0;

}



.faqs-content{

	position: sticky;

	top: 30px;

}



.faq-accordion .accordion-item{

	background: var(--white-color);

	border-radius: 12px;

	margin-bottom: 30px;

    padding: 0;

	transition: all 0.3s ease-in-out;

	overflow: hidden;

}



.faq-accordion .accordion-item:last-child{

	margin-bottom: 0;

}



.faq-accordion .accordion-header .accordion-button {

	font-size: 18px;

	font-weight: 500;

	line-height: 1.333em;

	background-color: transparent;

	color: var(--primary-color);

	padding: 22px 30px 22px 30px;

	transition: all 0.3s ease-in-out;

	justify-content: space-between;

}

.footer-social-links ul li a svg {

	width: 20px;

}



.faq-accordion .accordion-item .accordion-button::after, 

.faq-accordion .accordion-item .accordion-button.collapsed::after{

  display: none;

}



.faq-accordion .accordion-button:not(.collapsed)::after{

    transform: translateY(-50%) rotate(180deg);

}



.faq-accordion .accordion-item .accordion-body{

	border-top: 1px solid var(--divider-color);

	padding: 22px 30px;

}



.faq-accordion .accordion-item .accordion-body p{

	margin: 0;

}

.accordion-header .accordion-button svg {

	width: 26px;

	color: #ff6527;

}

.faqs-items-list{

	display: flex;

	flex-wrap: wrap;

	gap: 30px;

	border-top: 1px solid var(--divider-color);

	margin-top: 80px;

	padding-top: 60px;

}



.faqs-item{

	width: calc(25% - 22.5px);

	display: flex;

	flex-wrap: wrap;

	gap: 15px;

}



.faqs-item .icon-box{

	position: relative;

	height: 50px;

	width: 50px;

	background-color: var(--accent-color);

	border-radius: 50%;

	display: flex;

	align-items: center;

	justify-content: center;

	overflow: hidden;

}



.faqs-item .icon-box:before{

	content: '';

	position: absolute;

	top: 0;

	bottom: 0;

	right: 0;

	left: 0;

	background: var(--primary-color);

	border-radius: 50%;

	width: 100%;

	height: 100%;

	transform: scale(0);

	transition: all 0.4s ease-in-out;

	z-index: 0;

}



.faqs-item:hover .icon-box:before{

	transform: scale(1);

}



.faqs-item .icon-box img{

	position: relative;

	width: 100%;

	max-width: 24px;

	z-index: 1;

}



.faqs-item-content{

	width: calc(100% - 65px);

}



.faqs-item-content h3{

	font-size: 20px;

}



.faqs-item-content p{

	margin: 10px 0 0;

}



/************************************/

/***  	  15. Our Blog css  	  ***/

/************************************/



.our-blog{

    padding: 100px 0 70px;

}



.post-item{

    height: calc(100% - 30px);

    margin-bottom: 30px;

}



.post-featured-image{

    margin-bottom: 30px;

}



.post-featured-image a, 

.post-featured-image figure{

    display: block;

    border-radius: 12px;

    cursor: none;

    overflow: hidden;

}



.post-featured-image img{

    width: 100%;

    aspect-ratio: 1 / 0.68;

    object-fit: cover;

    transition: all 0.6s ease-in-out;

}



.post-item:hover .post-featured-image img{

	transform: scale(1.06);

}



.post-item-meta{

    margin-bottom: 20px;

}



.post-item-meta ul{

    list-style: none;

    margin: 0;

    padding: 0;

    display: flex;

    flex-wrap: wrap;

    align-items: center;

    gap: 15px 20px;

}



.post-item-meta ul li{

	color: var(--primary-color);

    line-height: normal;

    display: flex;

    align-items: center;

    gap: 10px;

}



.post-item-meta ul li img{

    width: 100%;

    max-width: 20px;

}



.post-item-content h2{

    font-size: 20px;

	line-height: 1.4em;

}



.post-item-content h2 a{

	color: inherit;

}



.post-item-btn{

    border-top: 1px solid var(--divider-color);

    margin-top: 25px;

    padding-top: 25px;

}



/************************************/

/***   16. Scrolling Ticker css	  ***/

/************************************/



.scrolling-ticker {

	background: var(--accent-color);

	margin-bottom: 20px;

	padding: 5px 0;

	height: ;

}



.scrolling-ticker-box {

	--gap: 60px;

	position: relative;

	display: flex;

	overflow: hidden;

	user-select: none;

	gap: var(--gap);

	align-items: center;

	height: 61px;

}



.scrolling-content {

	flex-shrink: 0;

	display: flex;

	gap: var(--gap);

	min-width: 89%;

	animation: scroll 40s linear infinite;

}



@keyframes scroll{

	from{

		transform: translateX(0);

	}



	to{

		transform: translateX(calc(-100% - var(--gap)));

	}

}



.scrolling-content span img{

	width: 100%;

	max-width: 165px;

	height: 40px;

}	



/************************************/

/***  		17. Footer css		  ***/

/************************************/



.main-footer{

    padding: 100px 0 0;

    margin-bottom: 20px;

}



.footer-header{

    display: flex;

    flex-wrap: wrap;

    align-items: center;

	justify-content: space-between;

    gap: 10px;

    border-bottom: 1px solid var(--dark-divider-color);

    margin-bottom: 30px;

    padding-bottom: 30px;

}



.footer-header-title{

	width: calc(100% - 120px);

}



.footer-header-title h2{

	font-size: 34px;

	color: var(--white-color);

}



.contact-us-circle a{

	display: inline-block;

    border-radius: 50%;

}



.contact-us-circle a img{

	width: 100%;

	max-width: 110px;

	border-radius: 50%;

	animation: infiniterotate 20s infinite linear;

}



@keyframes infiniterotate{

	from{

		transform: rotate(0deg);

    }

    to{

		transform: rotate(360deg);

    }

}



.contact-us-circle a:hover img{

    animation-play-state: paused;

}



.footer-logo img {
	width: 100%;
	max-width: 120px;
}



.about-footer-content{

	margin-top: 25px;

}



.about-footer-content p{

	color: var(--white-color);

	margin-bottom: 0;

}



.footer-links-box{

	background: var(--dark-divider-color);

	border-radius: 12px;

	backdrop-filter: blur(30px);

	-webkit-backdrop-filter: blur(30px);

	display: flex;

	flex-wrap: wrap;

	justify-content: space-between;

	gap: 30px;

	padding: 60px 3.125vw;

    margin-left: 20px;

}



.footer-links{

	max-width: 32%;

}



.footer-links h3{

	font-size: 20px;

	color: var(--white-color);

	margin-bottom: 25px;

}



.footer-links ul{

	list-style: disc;

	margin: 0;

	padding: 0 0 0 20px;

}



.footer-links ul li{

	color: var(--white-color);

	text-transform: capitalize;

	line-height: 1.5em;

	margin-bottom: 15px;

}



.footer-links ul li:last-child{

	margin-bottom: 0;

}



.footer-links ul li::marker{

    color: var(--accent-color);

}



.footer-links ul li a{

    color: inherit;

    transition: all 0.3s ease-in-out;

}



.footer-links ul li a:hover{

	color: var(--accent-color);

}



.footer-newsletter-form{

    max-width: 42%;

}



.footer-newsletter-form p{

	color: var(--white-color);

}



.footer-newsletter-form .form-group{

	position: relative;

    display: flex;

    border-bottom: 1px solid var(--dark-divider-color);

}



.footer-newsletter-form .form-group .form-control{

	width: calc(100% - 40px);

    font-size: 16px;

    line-height: normal;

	font-weight: 400;

    color: var(--white-color);

    background: transparent;

    border: none;

    box-shadow: none;

	outline: none;

    padding: 10px 20px 24px 0

}



.footer-newsletter-form .form-group .form-control::placeholder{

	color: var(--white-color);

	opacity: 50%;

}



.footer-newsletter-form .form-group .newsletter-btn{

    width: 40px;

    height: 40px;

    background-color: var(--accent-color);

    border: none;

    border-radius: 5px;

    padding: 0;

	transition: all 0.3s ease-in-out;

}



.footer-newsletter-form .form-group .newsletter-btn:hover{

	background-color: var(--white-color);

}



.footer-newsletter-form .form-group .newsletter-btn img{

	width: 100%;

    max-width: 20px;

	transition: all 0.3s ease-in-out;

}



.footer-newsletter-form .form-group .newsletter-btn:hover img{

	filter: brightness(0) invert(0);

}



.footer-copyright{

    display: flex;

    flex-wrap: wrap;

    align-items: center;

    justify-content: space-between;

    gap: 10px;

    border-top: 1px solid var(--dark-divider-color);

    margin-top: 60px;

    padding: 40px 0 15px;

}



.footer-copyright-text p{

    color: var(--white-color);

    margin: 0;

}



.footer-social-links{

    display: flex;

    flex-wrap: wrap;

    align-items: center;

    gap: 15px 20px;

}



.footer-social-links h4{

    font-size: 16px;

    color: var(--white-color);

}



.footer-social-links ul{

    display: flex;

    flex-wrap: wrap;

    gap: 10px 15px;

    list-style: none;

    padding: 0;

    margin: 0;

}



.footer-social-links ul li a{

    display: flex;

    justify-content: center;

    align-items: center;

    width: 40px;

    height: 40px;

    border: 1px solid var(--dark-divider-color);

    color: var(--white-color);

    border-radius: 50%;

    transition: all 0.3s ease-in-out;

}



.footer-social-links ul li a:hover{

	background: var(--accent-color);

}



.footer-social-links ul li i{

    font-size: 18px;

    color: inherit;

}



/************************************/

/***  18. About Us Page css		  ***/

/************************************/



.page-header{

	background-image: url('../images/page-header-bg.png');

	background-position: center center;

	background-repeat: no-repeat;

	background-size: cover;

	padding: 255px 0 145px;

	margin-top: 20px;

	overflow: hidden;

}



.page-header-box{

	text-align: center;

}



.page-header-box h1{

	display: inline-block;

	font-size: 54px;

    font-weight: 600;

	line-height: 1.1em;

	color: var(--white-color);

	margin-bottom: 10px;

	cursor: none;

}



.page-header-box ol{

    justify-content: center;

	margin: 0;

	padding: 0;

}



.page-header-box ol li.breadcrumb-item{

	font-size: 16px;

	font-weight: 400;

	line-height: normal;

    text-transform: capitalize;

	color: var(--white-color);

}



.page-header-box ol li.breadcrumb-item a{

    color: inherit;

}



.page-header-box ol .breadcrumb-item+.breadcrumb-item::before{

    color: var(--white-color);

}



.our-approach{

	padding: 100px 0;

}



.our-approach-content{

	margin-right: 15px;

}



.approach-item{

	background-color: var(--white-color);

	border-radius: 12px;

	margin-bottom: 30px;

	padding: 30px;

}



.approach-item:last-child{

	margin-bottom: 0;

}



.approach-item-title h3{

	font-size: 20px;

}



.approach-item-content{

	border-top: 1px solid var(--divider-color);

	margin-top: 25px;

	padding-top: 25px;

}



.approach-item-content p{

	margin-bottom: 0;

}



.approach-item-content ul{

	list-style: none;

	margin: 30px 0 0;

	padding: 0;

}



.approach-item-content ul li{

	position: relative;

	color: var(--primary-color);

	line-height: 1.5em;

	font-size: 16px;

	padding-left: 0;

}



.approach-item-content ul li::before {

	content: '\f058';

	position: absolute;

	font-family: 'Font Awesome 7 Free';

	font-size: 18px;

	font-weight: 900;

	color: var(--accent-color);

	top: 0;

	left: 0;

	display: none;

}



.our-approach-image{

	height: 100%;

}



.our-approach-image figure{

	display: block;

	height: 100%;

	border-radius: 12px;

}



.our-approach-image img{

	height: 100%;

	width: 100%;

	aspect-ratio: 1 / 0.846;

	object-fit: cover;

	border-radius: 12px;

}



.our-approach .section-footer-text{

	margin-top: 60px;

}



.our-benefits{

	padding: 100px 0;

}



.our-benefits-content{

	margin: 0 15px 0 0;

}



.benefits-item-list{

	display: flex;

	flex-wrap: wrap;

	gap: 30px;

}



.benefits-item{

	position: relative;

	width: calc(50% - 15px);

	border: 1px solid var(--divider-color);

	border-radius: 12px;

	padding: 30px;

}



.benefits-item::before{

	content: '';

	position: absolute;

	top: 0;

	right: 0;

	bottom: 0;

	left: 0;

	width: 100%;

	height: 100%;

	background: var(--accent-color);

	border-radius: 12px;

	transform: scale(0.2);

	opacity: 0;

	z-index: 0;

	transition: all 0.5s ease-in-out;

}



.benefits-item:hover::before{

	transform: scale(1);

	opacity: 1;

}



.benefits-item .icon-box{

	position: relative;

	height: 50px;

	width: 50px;

	background-color: var(--accent-color);

	border-radius: 50%;

	display: flex;

	align-items: center;

	justify-content: center;

	margin-bottom: 50px;

	overflow: hidden;

}



.benefits-item .icon-box::before{

	content: '';

	position: absolute;

	top: 0;

	bottom: 0;

	right: 0;

	left: 0;

	background: var(--white-color);

	border-radius: 50%;

	width: 100%;

	height: 100%;

	transform: scale(0);

	transition: all 0.4s ease-in-out;

	z-index: 0;

}



.benefits-item:hover .icon-box::before{

	transform: scale(1);

}



.benefits-item .icon-box img{

	position: relative;

	width: 100%;

	max-width: 24px;

	z-index: 1;

	transition: all 0.4s ease-in-out;

}



.benefits-item:hover .icon-box img{

	filter: brightness(0) invert(0);

}



.benefits-item-body{

	position: relative;

	z-index: 1;

}



.benefits-item-content h3{

	font-size: 20px;

	transition: all 0.4s ease-in-out;

}



.benefits-item-content p{

	margin: 15px 0 0;

	transition: all 0.4s ease-in-out;

}



.benefits-item-list ul{

	list-style: disc;

	border-top: 1px solid var(--divider-color);

	margin: 25px 0 0;

	padding: 25px 0 0 20px;

	transition: all 0.4s ease-in-out;

}



.benefits-item-list ul li{

	position: relative;

	line-height: 1.5em;

	transition: all 0.4s ease-in-out;

}



.benefits-item-list ul li::marker{

	color: var(--accent-color);

	transition: all 0.4s ease-in-out;

}



.benefits-item:hover .benefits-item-content h3,

.benefits-item:hover .benefits-item-content p,

.benefits-item:hover .benefits-item-list ul li,

.benefits-item:hover .benefits-item-list ul li::marker{

	color: var(--white-color);

}



.benefits-item:hover .benefits-item-list ul{

	border-color: var(--dark-divider-color);

}



.our-benefits-btn{

	margin-top: 40px;

}



.our-benefits-box {

	height: 100%;

	display: flex;

	flex-direction: column;

	gap: 40px;

}



.benefits-feature-items-list{

	display: flex;

	flex-wrap: wrap;

	gap: 30px;

}



.benefits-feature-item{

	width: calc(50% - 15px);

	display: flex;

	flex-wrap: wrap;

	align-items: center;

	gap: 15px;

}



.benefits-feature-item .icon-box{

	position: relative;

	height: 50px;

	width: 50px;

	background-color: var(--accent-color);

	border-radius: 50%;

	display: flex;

	align-items: center;

	justify-content: center;

	overflow: hidden;

}



.benefits-feature-item .icon-box::before{

	content: '';

	position: absolute;

	top: 0;

	bottom: 0;

	right: 0;

	left: 0;

	background: var(--primary-color);

	border-radius: 50%;

	width: 100%;

	height: 100%;

	transform: scale(0);

	transition: all 0.4s ease-in-out;

	z-index: 0;

}



.benefits-feature-item:hover .icon-box::before{

	transform: scale(1);

}



.benefits-feature-item .icon-box img{

	position: relative;

	width: 100%;

	max-width: 24px;

	z-index: 1;

}



.benefits-feature-item-title{

	width: calc(100% - 65px);

}



.benefits-feature-item-title h3{

	font-size: 20px;

	line-height: 1.4em;

}



.benefits-features-list{

	border-top: 1px solid var(--divider-color);

	margin-top: 30px;

	padding-top: 30px;

}



.benefits-features-list ul{

	display: flex;

	flex-wrap: wrap;

	gap: 15px 20px;

	list-style: none;

	margin: 0;

	padding: 0;

}



.benefits-features-list ul li{

	position: relative;

	width: calc(50% - 10px);

	line-height: 1.5em;

	padding-left: 0

}

.benefits-features-list ul li svg {

	width: 21px;

	color: #ff6527;

}

.scrolling-tickerwer {

	margin-top: 21px;

}

.benefits-features-list ul li::before{

	content: '\f058';

    position: absolute;

    font-family: 'Font Awesome 7 Free';

    font-size: 18px;

    font-weight: 900;

    color: var(--accent-color);

    top: 0;

    left: 0;

    display: none;

}



.benefits-box-image{

	height: 100%;

}



.benefits-box-image figure{

	display: block;

	height: 100%;

	border-radius: 12px;

}



.benefits-box-image figure img{

	height: 100%;

	width: 100%;

	aspect-ratio: 1 / 0.586;

	object-fit: cover;

	border-radius: 12px;

}



.our-benefits .section-footer-text{

	margin-top: 60px;

}



.our-team{

	padding: 100px 0;

}



.team-item{

	height: calc(100% - 30px);

	margin-bottom: 30px;

}



.team-item-image a,

.team-item-image a figure{

	cursor: none;

	display: block;

	border-radius: 12px;

	overflow: hidden;

}



.team-item-image a img{

	width: 100%;

	aspect-ratio: 1 / 1.102;

	object-fit: cover;

	transition: all 0.6s ease-in-out;

}



.team-item:hover .team-item-image a img{

	transform: scale(1.06);

}



.team-item-body{

	position: relative;

	width: calc(100% - 3.125vw);

	margin: 0 auto;

	margin-top: -70px;

	border: 2px solid var(--white-color);

	border-radius: 12px;

	overflow: hidden;

	z-index: 1;

}



.team-item-content{

	text-align: center;

	background-color: var(--accent-color);

	padding: 15px;

}



.team-item-content h2{

	font-size: 20px;

	color: var(--white-color);

}



.team-item-content h2 a{

	color: inherit;

}



.team-social-list{

	background-color: var(--secondary-color);

	padding: 15px;

}



.team-social-list ul{

	list-style: none;

	margin: 0;

	padding: 0;

	display: flex;

	flex-wrap: wrap;

	justify-content: center;

	gap: 15px;

}



.team-social-list ul li a{

	width: 40px;

	height: 40px;

	color: var(--primary-color);

	background: transparent;

	border: 1px solid var(--divider-color);

	border-radius: 50%;

	display: flex;

	align-items: center;

	justify-content: center;

	transition: all 0.4s ease-in-out;

}



.team-social-list ul li a:hover{

	background: var(--accent-color);

}



.team-social-list ul li a i{

	color: inherit;

	font-size: 18px;

	transition: all 0.4s ease-in-out;

}



.team-social-list ul li a:hover i{

	color: var(--white-color);

}



/************************************/

/***    19. Services Page css	  ***/

/************************************/



.page-services{

	padding: 100px 0 70px;

}



.page-services .service-item{

	background-color: var(--secondary-color);

}



/************************************/

/***    20. Service Single css	  ***/

/************************************/



.page-service-single{

	padding: 100px 0;

}



.page-single-sidebar{

	position: sticky;

	top: 30px;

	margin-right: 20px;

}



.page-category-list{

	background: var(--secondary-color);

	border-radius: 12px;

    margin-bottom: 40px;

	overflow: hidden;

}



.page-category-list h3{

	font-size: 20px;

	line-height: normal;

	color: var(--white-color);

	background: var(--accent-color);

	padding: 20px 40px;

}



.page-category-list ul{

	list-style: none;

    margin: 0;

	padding: 40px;

}



.page-category-list ul li{

	line-height: 1.5em;

    border-bottom: 1px solid var(--divider-color);

    padding-bottom: 20px;

    margin-bottom: 20px;

}



.page-category-list ul li:last-child{

    border-bottom: none;

    margin: 0;

    padding: 0;

}



.page-category-list ul li a{

    position: relative;

    display: block;

    text-transform: capitalize;

	color: var(--primary-color);

    padding-right: 24px;

	transition: all 0.4s ease-in-out;

}



.page-category-list ul li a:hover{

	color: var(--accent-color);

}



.page-category-list ul li a::before{

	content: '';

    position: absolute;

    top: 2px;

    right: 0;

	background: url('../images/arrow-accent.svg') no-repeat;

	background-position: center center;

	background-size: cover;

    width: 18px;

    height: 18px;

	transition: all 0.4s ease-in-out;

}



.page-category-list ul li a:hover::before{

	filter: brightness(0) invert(0);

}



.sidebar-cta-box{

	background: var(--secondary-color);

	border-radius: 12px;

	overflow: hidden;

}



.sidebar-cta-header{

	display: flex;

	flex-wrap: wrap;

	align-items: center;

	gap: 15px;

	background: var(--accent-color);

	padding: 20px;

}



.sidebar-cta-header .icon-box{

	position: relative;

	width: 50px;

	height: 50px;

	background: var(--white-color);

	border-radius: 50%;

	display: flex;

	align-items: center;

	justify-content: center;

}



.sidebar-cta-header .icon-box::before{

	content: '';

    position: absolute;

    top: 0;

    right: 0;

    bottom: 0;

    left: 0;

    width: 100%;

    height: 100%;

    background: var(--primary-color);

    border-radius: 50%;

    transform: scale(0);

    transition: all 0.4s ease-in-out;

}



.sidebar-cta-box:hover .sidebar-cta-header .icon-box::before{

	transform: scale(1);

}



.sidebar-cta-header .icon-box img{

	position: relative;

	width: 100%;

	max-width: 24px;

	transition: all 0.4s ease-in-out;

	z-index: 1;

}



.sidebar-cta-box:hover .sidebar-cta-header .icon-box img{

	filter: brightness(0) invert(1);

}



.sidebar-cta-header-title{

	width: calc(100% - 65px);

}



.sidebar-cta-header-title h3{

	font-size: 20px;

	color: var(--white-color);

}



.sidebar-cta-body{

	padding: 30px;

}



.sidebar-cta-body p{

	margin-bottom: 0;

}



.sidebar-cta-body ul{

	list-style: none;

	border-top: 1px solid var(--divider-color);

	margin: 30px 0 0;

	padding: 30px 0 0;

}



.sidebar-cta-body ul li{

	line-height: 1.5em;

	margin-bottom: 10px;

}



.sidebar-cta-body ul li:last-child{

	margin-bottom: 0;

}



.sidebar-cta-body ul li span{

	color: var(--primary-color);

}



.sidebar-cta-body ul li a{

	color: inherit;

	transition: all 0.3s ease-in-out;

}



.sidebar-cta-body ul li a:hover{

	color: var(--accent-color);

}



.page-single-image{

	margin-bottom: 30px;

}



.page-single-image figure{

	display: block;

	border-radius: 12px;

}



.page-single-image img{

	width: 100%;

	aspect-ratio: 1 / 0.542;

	object-fit: cover;

	border-radius: 12px;

}



.service-entry{

    margin-bottom: 60px;

}



.service-entry p{

    margin-bottom: 20px;

}



.service-entry p:last-child{

    margin-bottom: 0;

}



.service-entry h2{

	font-size: 44px;

    font-weight: 500;

    line-height: 1.1em;

    margin-bottom: 20px;

}



.service-entry h3{

	font-size: 20px;

	margin-bottom: 10px;

}



.service-entry ul{

	list-style: none;

	padding: 0;

	margin: 0;

	display: flex;

	flex-wrap: wrap;

	gap: 15px 20px;

}



.service-entry ul li{

	position: relative;

	color: var(--primary-color);

	width: calc(50% - 10px);

    line-height: 1.5em;

    padding-left: 25px;

}



.service-entry ul li::before{

    content: '\f058';

    position: absolute;

    font-family: 'Font Awesome 7 Free';

    font-size: 18px;

    font-weight: 900;

    color: var(--accent-color);

    top: 0;

    left: 0;

}



.service-why-choose-box,

.service-benefits-box{

	margin-top: 60px;

}



.service-why-choose-info-box{

	display: flex;

	flex-wrap: wrap;

	gap: 30px 40px;

	background: var(--secondary-color);

	border-radius: 12px;

	padding: 20px;

	margin: 40px 0;

}



.service-why-choose-image{

	width: calc(42% - 20px);

}



.service-why-choose-image figure{

	display: block;

	height: 100%;

	border-radius: 12px;

}



.service-why-choose-image img{

	width: 100%;

	height: 100%;

	aspect-ratio: 1 / 1.1;

	border-radius: 12px;

	object-fit: cover;

}



.service-why-choose-item-list{

	width: calc(58% - 20px);

	align-content: center;

}



.service-why-choose-item{

	border-bottom: 1px solid var(--divider-color);

	margin-bottom: 30px;

	padding-bottom: 30px;

}



.service-why-choose-item:last-child{

	border-bottom: none;

	margin-bottom: 0;

	padding-bottom: 0;

}



.service-why-choose-item .icon-box{

	position: relative;

	height: 50px;

	width: 50px;

	background-color: var(--accent-color);

	border-radius: 50%;

	display: flex;

	align-items: center;

	justify-content: center;

	overflow: hidden;

	margin-bottom: 20px;

}



.service-why-choose-item .icon-box:before{

	content: '';

	position: absolute;

	top: 0;

	bottom: 0;

	right: 0;

	left: 0;

	background: var(--primary-color);

	border-radius: 50%;

	width: 100%;

	height: 100%;

	transform: scale(0);

	transition: all 0.4s ease-in-out;

	z-index: 0;

}



.service-why-choose-item:hover .icon-box:before{

	transform: scale(1);

}



.service-why-choose-item .icon-box img{

	position: relative;

	width: 100%;

	max-width: 24px;

	z-index: 1;

}



.service-benefits-list,

.service-benefits-images{

	margin-top: 40px;

}



.service-benefits-images{

	display: flex;

	flex-wrap: wrap;

	gap: 30px;

}



.service-benefit-image{

	width: calc(50% - 15px);

}



.service-benefit-image figure{

	display: block;

	border-radius: 12px;

}



.service-benefit-image img{

	width: 100%;

	aspect-ratio: 1 / 0.754;

	object-fit: cover;

	border-radius: 12px;

}



.page-single-faqs .faq-accordion .accordion-item{

	background: var(--secondary-color);

}



/************************************/

/***  	21. Blog Archive css	  ***/

/************************************/



.page-blog{

	padding: 100px 0;

}



.page-pagination{

    margin-top: 30px;

    text-align: center;

}



.page-pagination ul{

    justify-content: center;

    padding: 0;

    margin: 0;

}



.page-pagination ul li a,

.page-pagination ul li span{

    display: flex;

    text-decoration: none;

    justify-content: center;

    align-items: center;

    background: var(--secondary-color);

    color: var(--primary-color);

	border-radius: 10px;

    width: 40px;

    height: 40px;

    margin: 0 5px;

    font-weight: 600;

	line-height: 1em;

    transition: all 0.3s ease-in-out;

}



.page-pagination ul li.active a, 

.page-pagination ul li a:hover{

    background: var(--accent-color);

	color: var(--white-color);

}



/************************************/

/***  	22. Blog Single css		  ***/

/************************************/



.page-single-post{

	padding: 100px 0;

}



.post-single-meta ol li{

	font-size: 18px;

	color: var(--white-color);

	margin-right: 15px;

}



.post-single-meta ol li:last-child{

	margin-right: 0;

}



.post-single-meta ol li i{

    font-size: 18px;

    color: var(--white-color);

    margin-right: 5px;

}



.post-image{

	position: relative;

	margin-bottom: 30px;

}



.post-image figure{

	display: block;	

	border-radius: 12px;

	overflow: hidden;

}



.post-image img{

	width: 100%;

	aspect-ratio: 1 / 0.50;

	object-fit: cover;

	border-radius: 12px;

}



.post-content{

	width: 100%;

	max-width: 1250px;

	margin: 0 auto;

}



.post-entry{

	border-bottom: 1px solid var(--divider-color);

	padding-bottom: 30px;

    margin-bottom: 30px;

}



.post-entry:after{

    content: '';

    display: block;

    clear: both;

}



.post-entry a{

    color: var(--accent-color);

}



.post-entry h1,

.post-entry h2,

.post-entry h3,

.post-entry h4,

.post-entry h5,

.post-entry h6{

	font-weight: 500;

	line-height: 1.1em;

	margin: 0 0 0.42em;

}



.post-entry h1{

	font-size: 54px;

}



.post-entry h2{

	font-size: 44px;

}



.post-entry h3{

	font-size: 40px;

}



.post-entry h4{

	font-size: 30px;

}



.post-entry h5{

	font-size: 24px;

}



.post-entry h6{

	font-size: 20px;

}



.post-entry p{

	margin-bottom: 20px;

}



.post-entry p:last-child{

	margin-bottom: 0;

}



.post-entry p strong{

	color: var(--primary-color);

	font-size: 18px;

	font-weight: 600;

}



.post-entry ol{

    margin: 0 0 30px;

}



.post-entry ul{

	padding: 0;

	margin: 20px 0 20px;

	padding-left: 20px;

}



.post-entry ol li,

.post-entry ul li{

    position: relative;

	font-size: 18px;

    font-weight: 500;

    line-height: 1.5em;

    color: var(--text-color);

    margin-bottom: 15px;

}



.post-entry ul li:last-child{

	margin-bottom: 0;

}



.post-entry ul ul,

.post-entry ul ol,

.post-entry ol ol,

.post-entry ol ul{

    margin-top: 20px;

    margin-bottom: 0;

}



.post-entry ul ul li:last-child,

.post-entry ul ol li:last-child,

.post-entry ol ol li:last-child,

.post-entry ol ul li:last-child{

    margin-bottom: 0;

}



.post-entry blockquote{

	background: var(--secondary-color) url('../images/icon-blockquote.svg');

	background-repeat: no-repeat;

	background-position: 30px 30px;

    background-size: 45px;

	border-radius: 12px;

    padding: 30px 30px 30px 90px;

    margin-bottom: 30px;

}



.post-entry blockquote p{

	font-size: 20px;

	font-weight: 600;

	line-height: 1.4em;

	color: var(--primary-color);

}



.post-entry blockquote p:last-child{

	margin-bottom: 0;

}



.tag-links{

    font-size: 20px;

	font-weight: 600;

    text-transform: capitalize;

	color: var(--primary-color);

	display: inline-flex;

	align-items: center;

	flex-wrap: wrap;

	gap: 15px;

}



.post-tags .tag-links a{

    display: inline-block;

    font-size: 16px;

    font-weight: 600;

    text-transform: capitalize;

    line-height: 1em;

	background: var(--accent-color);

    color: var(--white-color);

	border-radius: 100px;

    padding: 12px 20px;

	transition: all 0.4s ease-in-out;

}



.post-tags .tag-links a:hover{

	background: var(--primary-color);

}



.post-social-sharing{

    text-align: right;

}



.post-social-sharing ul{

    list-style: none;

    padding: 0;

    margin: 0;

}



.post-social-sharing ul li{

    display: inline-block;

    margin-right: 10px;

}



.post-social-sharing ul li:last-child{

	margin-right: 0;

}



.post-social-sharing ul li a{

    display: flex;

    align-items: center;

    justify-content: center;

    text-align: center;

	background: var(--accent-color);

    color: var(--white-color);

	border-radius: 100px;

    width: 40px;

    height: 40px;

    transition: all 0.4s ease-in-out;

}



.post-social-sharing ul li:hover a{

	background: var(--primary-color);

}



.post-social-sharing ul li a i{

    font-size: 18px;

    color: inherit;

}



/************************************/

/***  	23. Projects Page css	  ***/

/************************************/



.page-projects{

	padding: 100px 0 70px;

}



.page-projects .project-item{

	height: calc(100% - 30px);

	margin-bottom: 30px;

}



/************************************/

/***  	24. Project Single css	  ***/

/************************************/



.page-project-single{

	padding: 100px 0;

}



.project-category-list ul li{

	display: flex;

	flex-wrap: wrap;

	justify-content: space-between;

	gap: 10px;

}



.project-category-list ul li span{

	color: var(--primary-color);

	font-weight: 500;

}



.project-entry{

    margin-bottom: 60px;

}



.project-entry p{

    margin-bottom: 20px;

}



.project-entry h2{

	font-size: 44px;

    font-weight: 500;

    line-height: 1.1em;

    margin-bottom: 20px;

}



.project-entry h3{

	font-size: 20px;

	line-height: 1.4em;

	margin-bottom: 10px;

}



.project-entry p:last-child,

.project-entry h3:last-child{

	margin-bottom: 0;

}



.project-entry ul{

	list-style: none;

	padding: 0;

	margin: 0;

}



.project-entry ul li{

	position: relative;

	color: var(--primary-color);

    line-height: 1.5em;

	margin-bottom: 15px;

    padding-left: 25px;

}



.project-entry ul li:last-child{

	margin-bottom: 0;

}



.project-entry ul li::before{

    content: '\f058';

    position: absolute;

    font-family: 'Font Awesome 7 Free';

    font-size: 18px;

    font-weight: 900;

    color: var(--accent-color);

    top: 0;

    left: 0;

}



.project-deliver-box,

.project-results-box{

	margin-top: 60px;

}



.project-deliver-item-list{

	display: flex;

	flex-wrap: wrap;

	gap: 30px;

	border-top: 1px solid var(--divider-color);

	margin-top: 40px;

	padding-top: 40px;

}



.project-deliver-item{

	width: calc(50% - 15px);

}



.project-deliver-item-header{

	display: flex;

	flex-wrap: wrap;

	align-items: center;

	gap: 15px;

}



.project-deliver-item-header .icon-box{

	position: relative;

	height: 50px;

	width: 50px;

	background-color: var(--accent-color);

	border-radius: 50%;

	display: flex;

	align-items: center;

	justify-content: center;

	overflow: hidden;

}



.project-deliver-item-header .icon-box:before{

	content: '';

	position: absolute;

	top: 0;

	bottom: 0;

	right: 0;

	left: 0;

	background: var(--primary-color);

	border-radius: 50%;

	width: 100%;

	height: 100%;

	transform: scale(0);

	transition: all 0.4s ease-in-out;

	z-index: 0;

}



.project-deliver-item:hover .project-deliver-item-header .icon-box:before{

	transform: scale(1);

}



.project-deliver-item-header .icon-box img{

	position: relative;

	width: 100%;

	max-width: 24px;

	z-index: 1;

}



.project-deliver-item-title{

	width: calc(100% - 65px);

}



.project-deliver-item-content{

	border-top: 1px solid var(--divider-color);

	margin-top: 30px;

	padding-top: 30px;

}



.project-client-box{

	position: relative;

	margin-top: 40px;

}



.project-client-image figure{

	display: block;

	border-radius: 12px;

}



.project-client-image img{

	width: 100%;

	aspect-ratio: 1 / 0.516;

	object-fit: cover;

	border-radius: 12px;

}



.project-client-content-box{

	position: absolute;

	right: 40px;

	bottom: 40px;

	max-width: 440px;

	background: var(--divider-color);

	backdrop-filter: blur(30px);

	-webkit-backdrop-filter: blur(30px);

	border-radius: 12px;

	padding: 30px;

	z-index: 1;

}



.project-client-content-box .satisfy-client-image{

	border-color: var(--white-color);

}



.project-client-content{

	margin-top: 30px;

}



.project-client-content h2{

	line-height: 1em;

	color: var(--white-color);

}



.project-client-content h2 sub{

	font-size: 20px;

	bottom: 0;

}



.project-client-content p{

	color: var(--white-color);

}



.project-result-item-list{

	display: flex;

	flex-wrap: wrap;

	gap: 30px;

	margin: 40px 0;

}



.project-result-item{

	width: calc(50% - 15px);

	background: var(--secondary-color);

	border-radius: 12px;

	padding: 40px;

}



.project-result-item h4{

	display: inline-block;

	font-size: 14px;

	font-weight: 500;

	line-height: normal;

	border: 1px solid var(--divider-color);

	border-radius: 5px;

	padding: 7px 16px;

	margin-bottom: 20px;

}



.project-result-item.box-1 ul{

	border-top: 1px solid var(--divider-color);

	margin-top: 30px;

	padding-top: 30px;

}



.project-result-list-circle{

	display: flex;

	flex-wrap: wrap;

	gap: 20px;

	margin-top: 30px;

}



.project-result-list{

	width: calc(100% - 130px);

}



/************************************/

/***  		25. Team Page css	  ***/

/************************************/



.page-team{

	padding: 100px 0 70px;

}



/************************************/

/***  	26. Team Single css		  ***/

/************************************/



.page-team-single{

	padding: 100px 0;

}



.team-single-image{

	margin-bottom: 60px;

}



.team-single-image figure{

	display: block;

	border-radius: 12px;

}



.team-single-image img{

	width: 100%;

	aspect-ratio: 1 / 1.257;

	object-fit: cover;

	border-radius: 12px;

}



.team-member-about,

.team-expertise{

	margin-bottom: 60px;

}



.team-contact-list{

	display: flex;

	flex-wrap: wrap;

	gap: 30px;

}



.team-contact-item{

	width: calc(50% - 15px);

	background-color: var(--secondary-color);

	border-radius: 12px;

	padding: 25px;

	display: flex;

	flex-wrap: wrap;

	gap: 20px;

}



.team-contact-item .icon-box{

	position: relative;

	height: 60px;

	width: 60px;

	background-color: var(--accent-color);

	border-radius: 12px;

	display: flex;

	align-items: center;

	justify-content: center;

	overflow: hidden;

}



.team-contact-item .icon-box:before{

	content: '';

	position: absolute;

	top: 0;

	bottom: 0;

	right: 0;

	left: 0;

	background: var(--primary-color);

	border-radius: 10px;

	width: 100%;

	height: 100%;

	transform: rotate(180deg) scale(0);

	transition: all 0.4s ease-in-out;

	z-index: 0;

}



.team-contact-item:hover .icon-box:before{

	border-radius: 0;

	transform: rotate(0) scale(1);

}



.team-contact-item .icon-box img{

	position: relative;

	width: 100%;

	max-width: 30px;

	z-index: 1;

}



.team-contact-item-content{

	width: calc(100% - 80px);

}



.team-contact-item-content h3{

	font-size: 20px;

}



.team-contact-item-content p{

	margin: 10px 0 0;

}



.team-member-about-content{

	margin-top: 40px;

}



.team-member-about-content p{

	margin: 0;

}



.team-expertise-list{

	background-color: var(--secondary-color);

	border-radius: 12px;

	display: flex;

	flex-wrap: wrap;

	padding: 40px;

}



.team-expertise-item{

    width: 50%;

	display: flex;

	flex-wrap: wrap;

	align-items: center;

	gap: 15px;

}



.team-expertise-item{

    padding: 40px;

    border-bottom: 1px solid var(--divider-color);

    border-right: 1px solid var(--divider-color);

}



.team-expertise-item:nth-child(-n + 2){

	padding-top: 0;

}



.team-expertise-item:nth-child(2n + 1){

	padding-left: 0;

}



.team-expertise-item:nth-child(2n + 2){

	padding-right: 0;

	border-right: none;

}



.team-expertise-item:nth-last-child(2):nth-child(odd),

.team-expertise-item:last-child{

    border-bottom: none;

	padding-bottom: 0;

}



.team-expertise-item .icon-box{

    position: relative;

    background-color: var(--accent-color);

    border-radius: 50%;

    width: 50px;

    height: 50px;

    display: flex;

    align-items: center;

    justify-content: center;

    overflow: hidden;

    transition: all 0.4s ease-in-out;

}



.team-expertise-item .icon-box::before{

    content: '';

    display: block;

    position: absolute;

    top: 0;

    left: 0;

    background: var(--primary-color);

    border-radius: 50%;

    width: 100%;

    height: 100%;

    transform: scale(0);

    transition: all 0.4s ease-in-out;

    z-index: 0;

}



.team-expertise-item:hover .icon-box::before{

    transform: scale(1);

}



.team-expertise-item .icon-box img{

	position: relative;

	width: 100%;

    max-width: 24px;

    z-index: 1;

}



.team-expertise-item-content{

	width: calc(100% - 65px);

}



.team-expertise-item-content h3{

    font-size: 20px;

	line-height: 1.3em;

}



.team-expertise-content{

	margin-top: 40px;

}



.team-expertise-content p{

	margin: 0;

}



.contact-us-form.team-contact-form{

	background: transparent;

	padding: 0;

}



.contact-us-form.team-contact-form .form-control{

	background-color: var(--secondary-color);

}



/************************************/

/***  	27. Pricing Page css	  ***/

/************************************/



.page-pricing{

	padding: 100px 0;

}



.page-pricing .pricing-item{

	background-color: var(--secondary-color);

}



.page-pricing .pricing-item .pricing-item-content{

	background-color: var(--white-color);

}



.page-pricing .pricing-item-content h3,

.page-pricing .pricing-item-content h2,

.page-pricing .pricing-item-list h3{

	color: var(--primary-color);

}



.page-pricing .pricing-item-content h3,

.page-pricing .pricing-item-list h3,

.page-pricing .pricing-item-content{

	border-color: var(--divider-color);

}



.page-pricing .pricing-item-content p,

.page-pricing .pricing-item-list ul li{

	color: var(--text-color);

}



.page-pricing .pricing-item-content p,

.page-pricing .pricing-item-list ul{

	border-color: var(--divider-color);

}



.page-pricing .pricing-item.highlighted-box .pricing-item-content{

	background-color: var(--accent-color);

}



.page-pricing .pricing-item.highlighted-box .pricing-item-content h3,

.page-pricing .pricing-item.highlighted-box .pricing-item-content h2,

.page-pricing .pricing-item.highlighted-box .pricing-item-content p{

	color: var(--white-color);

}



.page-pricing .pricing-item.highlighted-box .pricing-item-content h3,

.page-pricing .pricing-item.highlighted-box .pricing-item-content p{

	border-color: var(--dark-divider-color);

}



.page-pricing .pricing-benefit-list ul li{

	color: var(--text-color);

}



/************************************/

/***  28. Testimonials Page css	  ***/

/************************************/



.page-testimonials{

	padding: 100px 0 70px;

}



.page-testimonials .testimonial-item{

	height: calc(100% - 30px);

	margin-bottom: 30px;

}



/************************************/

/***  	29. Image Gallery css	  ***/

/************************************/



.page-gallery{

	padding: 100px 0 70px;

}



.page-gallery-box .photo-gallery{

	height: calc(100% - 30px);

	margin-bottom: 30px;

}



.page-gallery-box .photo-gallery a{

	cursor: none;

}



.page-gallery-box .photo-gallery figure{

	display: block;

	border-radius: 12px;

}



.page-gallery-box .photo-gallery img{

	width: 100%;

	aspect-ratio: 1 / 0.81;

	object-fit: cover;

	border-radius: 12px;

}



/************************************/

/***  	30. Video Gallery css	  ***/

/************************************/



.page-video-gallery{

	padding: 100px 0 70px;

}



.video-gallery-image{

	height: calc(100% - 30px);

	margin-bottom: 30px;

	overflow: hidden;

}



.video-gallery-image a{

	position: relative;

	display: block;

	cursor: none;

}



.video-gallery-image a::before{

    content: '';

    position: absolute;

    top: 0;

    left: 0;

    right: 0;

    bottom: 0;

    background-color: var(--primary-color);

	border-radius: 12px;

    opacity: 0%;

    visibility: hidden;

    width: 100%;

    height: 100%;

    z-index: 1;

    transform: scale(0);

    transition: all 0.4s ease-in-out;

}



.video-gallery-image:hover a::before{

    opacity: 50%;

    visibility: visible;

    transform: scale(1);

}



.video-gallery-image a::after{

    content: '\f04b';

	font-family: 'FontAwesome';

    position: absolute;

    top: 50%;

    left: 50%;

    right: 0;

    transform: translate(-50%, -50%);

	font-size: 20px;

	background: var(--accent-color);

	color: var(--white-color);

    border-radius: 50%;

    height: 60px;

    width: 60px;

    cursor: none;

	display: flex;

	align-items: center;

	justify-content: center;

    opacity: 0;

    visibility: hidden;

    transition: all 0.5s ease-in-out;

    z-index: 1;

}



.video-gallery-image:hover a::after{

    opacity: 1;

    visibility: visible;

}



.video-gallery-image img{

	width: 100%;

	aspect-ratio: 1 / 0.81;

	object-fit: cover;

	border-radius: 12px;

}



/************************************/

/***  	 31. FAQs Page css		  ***/

/************************************/



.page-faqs{

	padding: 100px 0;

}



.page-faqs .page-single-faqs{

    margin-bottom: 60px;

}



.page-faqs .page-single-faqs:last-child{

    margin-bottom: 0px;

}



/************************************/

/*** 	 32. Contact Us Page css  ***/

/************************************/



.page-contact-us{

	padding: 100px 0;

}



.contact-us-content{

	margin-right: 20px;	

}



.contact-info-list{

	display: flex;

	flex-wrap: wrap;

	gap: 30px;

}



.contact-info-item{

	width: calc(50% - 15px);

	border: 1px solid var(--divider-color);

	border-radius: 12px;

	padding: 30px;

}



.contact-info-item .icon-box{

	position: relative;

	height: 50px;

	width: 50px;

	background-color: var(--accent-color);

	border-radius: 50%;

	display: flex;

	align-items: center;

	justify-content: center;

	overflow: hidden;

	margin-bottom: 30px;

}



.contact-info-item .icon-box:before{

	content: '';

	position: absolute;

	top: 0;

	bottom: 0;

	right: 0;

	left: 0;

	background: var(--primary-color);

	border-radius: 50%;

	width: 100%;

	height: 100%;

	transform: scale(0);

	transition: all 0.4s ease-in-out;

	z-index: 0;

}



.contact-info-item:hover .icon-box:before{

	transform: scale(1);

}



.contact-info-item .icon-box img{

	position: relative;

	width: 100%;

	max-width: 24px;

	z-index: 1;

}



.contact-info-item-content h3{

	font-size: 20px;

}



.contact-info-item-content p{

	margin: 10px 0 0;

}



.contact-info-item-content h4{

	font-size: 16px;

	font-weight: 400;

	border-top: 1px solid var(--divider-color);

	margin-top: 20px;

	padding-top: 20px;

}



.contact-info-item-content h4 a{

	color: inherit;

	transition: all 0.4s ease-in-out;

}



.contact-info-item-content h4 a:hover{

	color: var(--accent-color);

}



.contact-us-form{

	background-color: var(--secondary-color);

	border-radius: 12px;

	padding: 60px;

}



.contact-form .form-control{

	font-size: 16px;

	font-weight: 400;

	line-height: 1.125em;

	color: var(--text-color);

	background: var(--white-color);

	border: none;

	border-radius: 10px;

	padding: 21px 20px;

	box-shadow: none;

	outline: none;

}



.contact-form .form-control::placeholder{

	color: var(--text-color);

}



.google-map-iframe{

	margin-top: 100px;

}



.google-map-iframe,

.google-map-iframe iframe{

	width: 100%;

	height: 800px;

	border-radius: 12px;

}



/************************************/

/***   33. 404 Error Page css     ***/

/************************************/



.error-page{

	padding: 100px 0;

}



.error-page-image{

	text-align: center;

	margin-bottom: 30px;

}



.error-page-image img{

	width: 100%;

	max-width: 700px;

}



.error-page-content{

	text-align: center;

}



.error-page-content .section-title{

	margin-bottom: 15px;

}



/************************************/

/***      34. Responsive css      ***/

/************************************/



@media only screen and (max-width: 1880px){

	

	.bg-section{

		width: calc(100% - 40px);

	}

}



@media only screen and (max-width: 1440px){

	.section-title h2 {

		font-size: 35px;

	}

	.container{

        max-width: 1300px;

    }



	.hero-rating-box-content{

		max-width: 310px;

	}



	.about-us-content{

		margin-left: 0;

	}



	.about-us-list{

		padding: 20px 15px;

	}



	.service-item-header{

		padding: 20px 20px 0;

		margin-bottom: 30px;

	}



	.service-item-image-box .icon-box{

		bottom: 20px;

		left: 20px;

	}



	.features-clients-item{

		padding: 20px;

	}



	.features-item-body,

	.features-support-item{

		padding: 30px;

	}

	

	.features-item-content ul{

		margin-top: 20px;

		padding-top: 20px;

	}



	.features-support-item-image{

		max-width: 350px;

		margin: -110px -110px 0 auto;

	}



	.What-we-do-item{

		min-height: 350px;

	}



	.What-we-do-item .What-we-do-bg-icon img{

		max-width: 80px;

	}



	.What-we-do-item-content{

		margin-bottom: 30px;

	}



	.intro-video{

		min-height: 770px;

	}



	.how-work-item{

		padding: 30px 25px;

		min-height: 330px;

	}



	.how-work-item-content ul{

		margin-top: 20px;

		padding-top: 20px;

	}

	

	.pricing-item-content{

		padding: 20px;

	}



	.pricing-item-body{

		padding: 30px 20px 20px;

	}



	.testimonial-client-box{

		padding: 30px;

	}



	.testimonial-client-header-content{

		margin-top: 30px;

	}



	.testimonial-item{

		padding: 30px;

		gap: 30px;

		min-height: 420px;

	}



	.testimonial-item-footer{

		padding-top: 30px;

	}



	.benefits-item{

		padding: 20px;

	}



	.benefits-item .icon-box{

		margin-bottom: 30px;

	}



	.page-category-list h3{

		padding: 20px 30px;

	}



	.page-category-list ul{

		padding: 30px;

	}



	.sidebar-cta-body{

		padding: 20px;

	}



	.post-content{

        max-width: 1100px;

    }



	.project-deliver-item-list{

		margin-top: 30px;

		padding-top: 30px;

	}



	.project-client-content-box{

		right: 30px;

		bottom: 30px;

	}



	.project-client-content{

		margin-top: 20px;

	}



	.project-client-content h2{

		margin-bottom: 10px;

	}



	.project-result-item{

		padding: 30px;

	}



	.project-result-item.box-1 ul{

		margin-top: 20px;

		padding-top: 20px;

	}



	.team-member-about-content,

	.team-expertise-content{

		margin-top: 30px;

	}



	.team-expertise-list{

		padding: 30px;

	}



	.team-expertise-item{

		padding: 30px;

	}



	.contact-info-item{

		padding: 20px;

	}



	.contact-info-item .icon-box{

		margin-bottom: 20px;

	}



	.contact-us-form{

		padding: 40px;

	}



	.google-map-iframe,

	.google-map-iframe iframe{

		height: 600px;

	}

}



@media only screen and (max-width: 1280px){

.our-benefits-box {

	margin: 56px 0 0;

}

.footer-links-box {

	margin-left: 0;

	margin-top: 25px;

}













}





@media only screen and (max-width: 1024px){



	.main-menu ul li{

		margin: 0;

	}



	.section-content-btn .section-btn{

		margin-top: 20px;

	}

	

	.section-title-content{

        margin-top: 10px;

    }



	.section-btn{

        text-align: left;

        margin-top: 15px;

	}



	.hero-content{

		height: auto;

		margin-bottom: 30px;

	}



	.hero-image{

		height: auto;

		max-width: 720px;

		margin: 0 auto; 

	}



	.about-us-image-box{

		max-width: 720px;

		margin: 0 auto 30px;

	}



	.project-features-item{

		height: auto;

	}



	.features-item-body{

		height: auto;

		min-height: 300px;

	}



	.core-features-image img{

		max-width: 380px;

	}



	.intro-video{

        min-height: 650px;

    }



	.intro-video-content-box{

		padding: 30px;

	}



	.intro-video-header .video-play-button{

		margin-bottom: 30px;

	}



	.intro-video-content{

		padding-top: 30px;

		margin-top: 40px;

	}



	.testimonial-client-box{

		height: auto;

		margin-bottom: 30px;

	}



	.faqs-content{

		position: initial;

		margin-bottom: 40px;

	}



	.faqs-items-list{

		padding-top: 40px;

		margin-top: 40px;

	}



	.faqs-item{

		width: calc(50% - 15px);

	}



	.about-footer{

        margin-bottom: 30px;

    }



    .about-footer-content{

        margin-top: 15px;

    }



    .footer-links-box{

        margin-left: 0;

    }



	.our-approach-content{

		margin: 0 0 30px 0;

	}



	.our-approach-image figure,

	.our-approach-image{

		height: auto;

	}



	.our-approach-image img{

		height: auto;

		aspect-ratio: 1 / 0.66;

	}



	.our-benefits-content{

		margin: 0 0 40px;

	}



	.our-benefits-box,

	.benefits-box-image,

	.benefits-box-image figure,

	.benefits-box-image figure img{

		height: auto;

	}



	.team-item-image a img{

		aspect-ratio: 1 / 1.01;

	}



	.page-single-sidebar{

		margin: 0;

	}



	.page-category-list h3,

	.sidebar-cta-header{

        padding: 15px 20px;

    }



	.page-category-list ul{

		padding: 20px;

	}



	.page-category-list ul li{

		margin-bottom: 15px;

		padding-bottom: 15px;

	}



	.sidebar-cta-header .icon-box{

		width: 40px;

		height: 40px;

	}



	.sidebar-cta-header .icon-box img{

		max-width: 20px;

	}



	.sidebar-cta-header-title{

		width: calc(100% - 55px);

	}

	

	.sidebar-cta-body ul{

		margin-top: 20px;

		padding-top: 20px;

	}



	.page-single-image{

		margin-bottom: 20px;

	}



	.service-entry{

		margin-bottom: 40px;

	}



	.service-why-choose-box,

	.service-benefits-box{

		margin-top: 40px;

	}



	.service-why-choose-info-box{

		margin: 30px 0;

	}



	.service-why-choose-image,

	.service-why-choose-item-list{

		width: 100%;

	}



	.service-why-choose-image img{

		aspect-ratio: 1 / 0.65;

	}



	.service-why-choose-item{

		margin-bottom: 20px;

		padding-bottom: 20px;

	}



	.service-benefits-list,

	.service-benefits-images{

		margin-top: 30px;

	}



	.project-entry{

		margin-bottom: 40px;

	}



	.project-deliver-box,

	.project-results-box{

		margin-top: 40px;

	}



	.project-deliver-item-content{

		margin-top: 20px;

		padding-top: 20px;

	}



	.project-client-box{

		margin-top: 30px;

	}



	.project-client-image img{

		aspect-ratio: 1 / 0.63;

	}



	.project-client-content-box{

		max-width: 405px;

		padding: 20px;

        right: 20px;

        bottom: 20px;

    }



	.project-result-item-list{

		margin: 30px 0;

	}



	.project-result-item{

		width: 100%;

	}



	.project-result-list-circle{

		margin-top: 20px;

	}



	.team-contact-list{

		gap: 20px;

	}



	.team-contact-item{

		width: calc(50% - 10px);

		gap: 10px;

		padding: 15px;

	}



	.team-contact-item .icon-box{

		width: 50px;

		height: 50px;

	}



	.team-contact-item .icon-box img{

		max-width: 24px;

	}



	.team-contact-item-content{

		width: calc(100% - 60px);

	}



	.team-contact-item-content p{

		margin: 5px 0 0;

	}



	.contact-us-content{

		margin: 0 0 30px;

	}

}



@media only screen and (max-width: 991px){



	.btn-default{

        padding: 15px 25px;

    }



	.btn-default::before{

		width: 44px;

		height: 44px;

		background-size: 18px auto;

	}

	

	header.main-header{

		top: 0px;

	}



	header.main-header .header-sticky{

		width: 100%;

	}

	

	header.main-header .header-sticky.active{

		width: 100%;

		border-radius: 0;

	}



	.navbar{

		padding: 20px 0;

	}



	.responsive-menu,

    .navbar-toggle{

        display: block;

    }



	.slicknav_nav li,

	.slicknav_nav ul{

        display: block;

    }



	.header-btn{

		display: none;

	}



	.bg-section{

		width: 100%;

		border-radius: 0;

		margin: 0;

	}



	.bg-section .container-fluid{

		padding: 0 15px;

	}



	.section-row{

		margin-bottom: 40px;

	}

	

	.section-title{

		margin-bottom: 30px;

	}



	.section-title h3{

		margin-bottom: 10px;

	}



	.section-title h3:before{

		height: 16px;

		width: 16px;

	}



	.section-title h1{

		font-size: 42px;

	}



	.section-title h2{

		font-size: 36px;

	}



	.section-title p{

		margin-top: 10px;

	}	



	.hero{

		padding: 140px 0 0;

		margin-top: 0;

	}



	.hero-content-footer{

		margin-top: 30px;

		padding-top: 30px;

	}



	.hero-rating-box .icon-box img{

		max-width: 45px;

	}



	.hero-rating-header h2{

		font-size: 26px;

		width: 65px;

	}



	.hero-image img{

		margin-bottom: 0;

	}



	.about-us{

		padding: 50px 0;

	}



	.about-us-contact-box{

		top: 60px;

		max-width: 180px;

	}



	.about-us-contact-box-header{

		padding: 20px 15px;

	}



	.about-us-contact-box-btn a{

		padding: 12px;

	}



	.about-us-body{

		padding-top: 30px;

	}



	.about-us-list{

		margin-top: 30px;

	}



	.about-us-list ul li::before{

		font-size: 16px;

	}



	.about-us-footer{

		padding-top: 30px;

		margin-top: 30px;

	}



	.our-services{

		padding: 50px 0;

	}



	.service-item-header{

		padding: 10px 10px 0;

		margin-bottom: 20px;

	}



	.section-footer-text{

		margin-top: 10px;

	}



	.section-footer-text ul li{

		font-size: 18px;

	}



	.our-features{

		padding: 50px 0;

	}



	.features-clients-item .satisfy-client-content{

		margin-top: 10px;

	}



	.satisfy-client-counter-item h2{

		font-size: 40px;

	}



	.features-item-body,

	.features-support-item{

        padding: 20px;

    }



	.project-features-counter-item h2{

		font-size: 30px;

	}



	.features-support-item-image{

        max-width: 280px;

        margin: -80px -80px 0 auto;

    }



	.What-we-do{

		padding: 50px 0;

	}



	.What-we-do-item{

		padding: 20px;

		min-height: 300px;

	}



	.our-projects{

		padding: 50px 0;

	}

	

	.project-item-btn{

		top: 20px;

		right: 20px;

	}



	.project-slider .project-pagination,

	.our-projects .section-footer-text{

		margin-top: 30px;

	}



	.intro-video-header-title h3{

		font-size: 28px;

	}



	.how-it-work{

		padding: 50px 0;

	}



	.how-work-item{

        padding: 20px;

    }



	.how-it-work-footer{

		margin-top: 10px;

	}



	.how-it-work-footer-list ul{

		gap: 10px;

	}



	.how-it-work-footer-list ul li{

		font-size: 14px;

		padding: 8px 12px 8px 24px;

	}



	.how-it-work-footer-list ul li::before{

		left: 10px;

	}



	.how-it-work-footer .section-footer-text{

		margin-top: 20px;

	}



	.our-pricing{

		padding: 50px 0;

	}



	.pricing-item-content h3{

		margin-bottom: 15px;

	}



	.pricing-item-content h2{

		font-size: 36px;

	}



	.pricing-item-content p{

		margin-top: 15px;

		padding-top: 15px;

	}



	.pricing-item-body{

        padding: 20px 5px 10px;

    }



	.pricing-item-list ul{

		padding-top: 20px;

		margin-top: 20px;

	}



	.pricing-item-list ul li{

		margin-bottom: 10px;

	}



	.pricing-item-list ul li:before{

		font-size: 16px;

	}



	.pricing-benefit-list{

		margin-top: 10px;

	}



	.pricing-benefit-list ul{

		gap: 15px 30px;

	}



	.our-testimonials{

		padding: 50px 0;

	}



	.testimonial-client-box{

		padding: 20px;

	}



	.testimonial-client-header-content h2 span{

		font-size: 34px;

	}



	.testimonial-item{

        padding: 20px;

        min-height: 380px;

    }



	.testimonial-rating{

		margin-bottom: 10px;

	}



	.testimonial-rating i,

	.testimonial-item-content p{

		font-size: 18px;

	}



	.testimonial-author{

		width: calc(100% - 40px);

	}



	.testimonial-author-content h3{

		font-size: 18px;

	}



	.testimonial-author-content p{

		font-size: 14px;

	}



	.testimonial-item-quote img{

		max-width: 30px;

	}



	.testimonial-pagination{

		margin-top: 40px;

	}



	.our-testimonials .section-footer-text{

		margin-top: 30px;

	}



	.our-faqs{

		padding: 50px 0;

	}



	.faqs-content{

		margin-bottom: 30px;

	}



	.faq-accordion .accordion-item{

		margin-bottom: 20px;

	}



	.faq-accordion .accordion-header .accordion-button{

		padding: 15px 45px 15px 20px;

	}



	.faq-accordion .accordion-item .accordion-button::after,

	.faq-accordion .accordion-item .accordion-button.collapsed::after{

		font-size: 18px;

		right: 20px;

	}



	.faq-accordion .accordion-item .accordion-body{

		padding: 15px 20px;

	}



	.faqs-item-content p{

		margin-top: 5px;

	}



	.our-blog{

		padding: 50px 0 20px;

	}



	.post-featured-image{

		margin-bottom: 20px;

	}



	.post-item-meta{

		margin-bottom: 15px;

	}



	.post-item-meta ul li img{

		max-width: 18px;

	}



	.post-item-btn{

		margin-top: 20px;

		padding-top: 20px;

	}



	.scrolling-ticker{

		padding: 20px 0;

	}



	.scrolling-ticker-box{

		--gap: 30px;

	}



	.scrolling-content span img{

		height: 34px;

	}



	.main-footer{

        padding: 50px 0 0;

        margin-bottom: 0;

    }



	.footer-header-title h2{

		font-size: 30px;

	}



    .footer-links-box{

        padding: 30px 20px;

    }



    .footer-links h3{

        margin-bottom: 20px;

    }



    .footer-links ul li{

        margin-bottom: 10px;

    }



    .footer-copyright{

        margin-top: 30px;

        padding: 30px 0;

    }



	.footer-social-links,

	.footer-social-links ul{

		gap: 10px;

	}



	.page-header{

		padding: 170px 0 80px;

		margin-top: 0;

	}



	.page-header-box h1{

		font-size: 42px;

	}



	.our-approach{

		padding: 50px 0;

	}



	.approach-item{

		padding: 20px;

	}



	.approach-item-content{

		margin-top: 20px;

		padding-top: 20px;

	}



	.approach-item-content ul{

		margin: 20px 0 0;

	}

	

	.approach-item-content ul li::before{

		font-size: 16px;

	}



	.our-approach .section-footer-text{

		margin-top: 30px;

	}



	.our-benefits{

		padding: 50px 0;

	}



	.our-benefits-content{

		margin-bottom: 30px;

	}

	

	.benefits-item{

		padding: 20px;	

	}



	.benefits-item .icon-box{

		margin-bottom: 20px;

	}



	.benefits-item-content p{

		margin-top: 10px;

	}



	.benefits-item-list ul{

		margin-top: 20px;

		padding-top: 20px;

	}



	.benefits-features-list ul li::before{

		font-size: 16px;

	}



	.our-benefits-btn{

		margin-top: 30px;

	}



	.our-benefits-box{

		gap: 30px;

	}



	.benefits-features-list{

		margin-top: 20px;

		padding-top: 20px;

	}



	.benefits-box-image figure img{

		aspect-ratio: 1 / 0.48;

	}



	.our-benefits .section-footer-text{

		margin-top: 30px;

	}



	.our-team{

		padding: 50px 0;

	}



	.team-item-body{

		width: calc(100% - 30px);

	}



	.page-services{

		padding: 50px 0 20px;

	}



	.page-service-single{

		padding: 50px 0;

	}



	.page-single-sidebar,

	.page-category-list{

		margin-bottom: 30px;

	}



	.service-entry h2{

		font-size: 36px;

		margin-bottom: 15px;

	}



	.service-entry p{

		margin-bottom: 15px;

	}



	.service-entry ul li::before{

		font-size: 16px;

	}



	.page-blog{

		padding: 50px 0;

	}



	.page-pagination{

		margin-top: 10px;

	}



	.page-single-post{

        padding: 50px 0;

    }

    

    .post-image{

        margin-bottom: 20px;

    }

    

    .post-entry h2{

        font-size: 36px;

    }

    

    .post-entry p{

        margin-bottom: 15px;

    }

    

    .post-entry ol li,

    .post-entry ul li{

		font-size: 16px;

        margin-bottom: 10px;

    }

    

    .post-entry blockquote{

        background-position: 20px 20px;

        background-size: 40px;

        padding: 20px 20px 20px 70px;

        margin-bottom: 20px;

    }

    

    .post-entry blockquote p{

        font-size: 18px;

    }

    

    .post-tags{

        margin-bottom: 20px;

    }

    

    .post-tags .tag-links a{

        padding: 12px 15px;

    }

    

    .post-social-sharing ul{

        text-align: left;

    }



	.page-projects{

		padding: 50px 0 20px;

	}



	.page-project-single{

		padding: 50px 0;

	}



	.project-entry p{

		margin-bottom: 15px;

	}



	.project-entry h2{

		font-size: 36px;

		margin-bottom: 15px;

	}



	.project-entry ul li{

		margin-bottom: 10px;

	}



	.project-entry ul li::before{

		font-size: 16px;

	}



	.project-deliver-item-header .icon-box{

		width: 44px;

		height: 44px;

	}



	.project-deliver-item-header .icon-box img{

		max-width: 22px;

	}



	.project-deliver-item-title{

        width: calc(100% - 59px);

    }



	.project-deliver-item-title h3{

		font-size: 18px;

	}



	.project-result-item h4{

		margin-bottom: 15px;

	}



	.page-team{

		padding: 50px 0 20px;

	}



	.page-team-single{

		padding: 50px 0;

	}



	.team-single-image{

		margin-bottom: 30px;

	}



	.team-single-image img{

		aspect-ratio: 1 / 0.75;

	}



	.team-member-about,

	.team-expertise{

		margin-bottom: 40px;

	}



	.team-member-about-content,

	.team-expertise-content{

		margin-top: 20px;

	}



	.team-expertise-list{

        padding: 20px;

    }



	.team-expertise-item{

		padding: 20px;

	}



	.page-pricing{

		padding: 50px 0;

	}



	.page-testimonials{

		padding: 50px 0 20px;

	}



	.page-gallery{

        padding: 50px 0 20px;

    }



	.page-video-gallery{

        padding: 50px 0 20px;

    }



	.page-faqs{

        padding: 50px 0;

    }



	.page-faqs .page-single-faqs{

        margin-bottom: 40px;

    }



	.page-contact-us{

		padding: 50px 0;

	}



	.contact-info-item-content h4{

		margin-top: 15px;

		padding-top: 15px;

	}



	.contact-us-form{

        padding: 20px;

    }



	.contact-form .form-control{

		padding: 16px 14px;

	}



	.google-map-iframe{

		margin-top: 50px;

	}



	.google-map-iframe,

	.google-map-iframe iframe{

		height: 350px;

	}



	.error-page{

		padding: 50px 0px;

	}

	

	.error-page-image{

		margin-bottom: 20px;

	}

}



@media only screen and (max-width: 767px){

.scrolling-content.scrolling_second span {

	font-size: 26px;

}

	.section-row{

		margin-bottom: 30px;

	}



	.section-title h1{

		font-size: 28px;

	}



	.section-title h2{

		font-size: 26px;

	}



	.hero-content-body{

		gap: 20px;

	}



	.video-play-button{

		gap: 10px;

	}



	.hero-content-body .video-play-button a{

		width: 40px;

		height: 40px;

	}



	.video-play-button h3{

		font-size: 14px;

	}



	.hero-rating-header h2{

        font-size: 22px;

        width: 60px;

    }



	.hero-content-footer{

		gap: 15px;

	}



	.hero-rating-box-content{

        max-width: 100%;

    }



	.about-us-image-box{

		padding-left: 40px;

	}



	.about-us-contact-box{

        top: 20px;

        max-width: 150px;

    }



	.about-us-contact-box-header{

		padding: 15px;

    }

	

	.about-us-contact-box-header .icon-box{

		margin-bottom: 10px;

	}



	.about-us-contact-content h3{

		font-size: 14px;

	}



	.about-us-contact-content p{

		font-size: 12px;

	}



	.about-us-image-box-1{

		width: 80%;

        padding-bottom: 60px;

    }



	.about-us-image-box-2{

		width: 20%;

	}



	.about-us-image-box-2 .about-us-image figure{

        margin-left: -100px;

    }



	.about-us-body-item-list{

		gap: 20px;

	}



	.about-us-body-item{

		width: 100%;

	}



	.about-us-body-item-content h3{

		font-size: 18px;

	}



	.about-us-list ul{

		gap: 10px;

	}



	.about-us-list ul li{

		width: 100%;

	}



	.about-author-box-content h3{

		font-size: 18px;

	}



	.service-item-content h2{

		font-size: 18px;

	}



	.features-clients-item .satisfy-client-content h3{

		font-size: 18px;

	}



	.satisfy-client-counter-item h2{

		font-size: 30px;

	}



	.features-item-content h3{

		font-size: 18px;

	}



	.project-features-counter-item h2{

		font-size: 26px;

	}



	.project-features-counter-item p{

		font-size: 14px;

	}



	.features-item-content ul li{

		margin-bottom: 10px;

	}



	.What-we-do-item-content{

        margin-bottom: 20px;

    }



	.project-item-image img{

		aspect-ratio: 1 / 1.2;

	}



	.project-item-content{

		padding: 15px;

	}



	.intro-video{

		min-height: 500px;

	}



	.intro-video-content-box{

        padding: 20px;

		max-width: 100%;

    }



	.intro-video-header .video-play-button{

        margin-bottom: 20px;

    }



	.intro-video-header-title h3{

        font-size: 20px;

    }



	.intro-video-content{

        margin-top: 20px;

        padding-top: 20px;

    }

	

	.how-work-item-content h3{

		font-size: 18px;

	}



	.how-it-work-footer-list ul li{

		font-size: 14px;

	}



	.pricing-item-content h2{

        font-size: 26px;

    }



	.pricing-item-list h3{

		font-size: 18px;

	}



	.pricing-benefit-list ul{

		gap: 10px;

	}



	.pricing-benefit-list ul li{

		font-size: 14px;

	}



	.pricing-benefit-list ul li img{

		max-width: 16px;

		margin-right: 5px;

	}



	.testimonial-client-box{

		gap: 20px;

	}



	.testimonial-client-header-content{

		margin-top: 20px;

	}



	.testimonial-client-header-content h2{

		font-size: 18px;

	}



	.testimonial-client-header-content h2 span{

		font-size: 28px;

	}



	.testimonial-client-box-body{

		padding-top: 20px;

	}



	.testimonial-item{

        min-height: 330px;

    }



	.testimonial-item-content p{

		font-size: 16px;

	}



	.faq-accordion .accordion-header .accordion-button{

        padding: 15px 40px 15px 15px;

    }



	.faq-accordion .accordion-item .accordion-button::after,

	.faq-accordion .accordion-item .accordion-button.collapsed::after{

        font-size: 16px;

        right: 15px;

    }



	.faq-accordion .accordion-item .accordion-body{

        padding: 15px;

    }



	.faqs-items-list{

		gap: 20px;

		padding-top: 30px;

        margin-top: 30px;

	}



	.faqs-item{

        width: 100%;

    }



	.faqs-item-content h3{

		font-size: 18px;

	}



	.post-item-content h2{

		font-size: 18px;

	}



	.post-item-btn{

        margin-top: 15px;

        padding-top: 15px;

    }



	.scrolling-ticker{

        padding: 0 0;

    }



	.footer-header-title h2{

        font-size: 26px;

    }



	.footer-header-title{

		width: calc(100% - 100px);

	}



    .contact-us-circle a img{

        max-width: 90px;

    }



    .footer-links-box{

        padding: 20px;

    }



    .footer-links{

        max-width: 100%;

    }



    .footer-links h3{

        font-size: 18px;

        margin-bottom: 15px;

    }



	.footer-newsletter-form p{

		margin-bottom: 15px;

	}



    .footer-copyright{

        padding: 15px 0;

		flex-direction: column-reverse;

		justify-content: center;

    }



	.footer-social-links{

		justify-content: center;

	}



	.footer-social-links h4{

		font-size: 14px;

	}



	.footer-social-links ul li a{

		width: 36px;

		height: 36px;

	}



	.footer-social-links ul li i{

		font-size: 16px;

	}



	.page-header-box h1{

		font-size: 28px;

	}



	.approach-item-title h3{

		font-size: 18px;

	}



	.our-benefits-box{

		gap: 30px;	

	}



	.benefits-feature-items-list{

		gap: 20px;

	}



	.benefits-item,

	.benefits-feature-item{

		width: 100%;

	}



	.benefits-item-content h3,

	.benefits-feature-item-title h3{

		font-size: 18px;

	}



	.benefits-features-list ul{

		gap: 10px;

	}



	.benefits-features-list ul li{

		width: 100%;

	}



	.team-item-content h2{

		font-size: 18px;

	}



	.page-category-list h3,

	.sidebar-cta-header-title h3{

		font-size: 18px;

	}



	.page-single-image img{

		aspect-ratio: 1 / 0.68;

	}



	.service-entry h2{

        font-size: 26px;

    }



	.service-entry h3{

		font-size: 18px;

	}



	.service-entry ul{

		gap: 10px;

	}



	.service-entry ul li{

		width: 100%;

	}



	.service-why-choose-info-box{

		padding: 15px;

	}



	.service-benefits-images{

		gap: 20px;

	}



	.service-benefit-image{

		width: 100%;

	}



	.post-single-meta ol li,

	.post-single-meta ol li i{

		font-size: 16px;

	}



	.post-image img{

		aspect-ratio: 1 / 0.7;

	}



	.post-entry blockquote{

		background-position: 15px 15px;

		padding: 60px 15px 15px 15px;

	}



	.post-entry blockquote p{

		font-size: 16px;

	}



	.post-entry h2{

		font-size: 26px;

	}



	.post-entry h3{

		font-size: 18px;

	}

	

	.tag-links{

		font-size: 18px;

	}



	.project-entry h2{

        font-size: 26px;

    }



	.project-entry h3{

		font-size: 18px;

	}



	.project-deliver-item{

		width: 100%;

	}



	.project-deliver-item-content{

        margin-top: 15px;

        padding-top: 15px;

    }



	.project-client-content-box{

		position: initial;

		background: var(--accent-color);

		margin-top: 20px;

	}



	.project-client-content h2{

        margin-bottom: 10px;

    }



	.project-client-content h2 sub{

		font-size: 18px;

	}



	.project-result-item{

		padding: 20px;

	}

	

	.project-result-list-circle{

		gap: 10px;

	}

	

	.project-result-list{

		width: calc(100% - 100px);

	}



	.team-single-image img{

        aspect-ratio: 1 / 1.1;

    }

	

	.team-contact-item{

		width: 100%;

	}



	.team-contact-item-content h3{

		font-size: 18px;

	}



	.team-expertise-item{

        width: 100%;

        border-right: none;

        margin-bottom: 20px;

        padding: 0 0 20px 0;

    }

    

    .team-expertise-item:nth-last-child(2):nth-child(odd){

		border-bottom: 1px solid var(--divider-color);

        padding-bottom: 20px;

	}



    .team-expertise-item:last-child{

        margin-bottom: 0;

    }



	.team-expertise-item-content h3{

		font-size: 18px;

	}



	.contact-info-item{

		width: 100%;

	}



	.contact-info-item-content h3{

		font-size: 18px;

	}

}





@media only screen and (max-width: 430px){

.container.banner_up_content {

	left: 0px;

}
.section-title p {
	line-height: 19px;
	font-size: 14px;
}
.navbar {
	padding: 0 0 27px;
}
.hero-content {

	width: 100%;

}

.hero {
	padding: 0 0 0;
	height: 82vh;
}

.baner_video video {
	width: 100%;
	height: 82vh;
	object-fit: cover;
}
.footer-header-title h2 {
	font-size: 22px;
	line-height: 30px;
}

.section-title h1 {

	font-size: 24px;

}
.footer-logo img {
	max-width: 93px;
}
.abn {
	text-align: center;
}
.section-title h1 {
	font-size: 20px;
	line-height: 29px;
}
















}



@media only screen and (max-width: 375px){



.section-title p {

	margin-top: 7px;

	line-height: 21px;

}

.container.banner_up_content {

	top: 29%;

}











}



/************************************/

/***   35. Home - Version 2 css   ***/

/************************************/



.hero-moon{

	padding: 210px 0 0;

	margin-top: 20px;

	margin-bottom: 300px;

}



.hero-content-moon{

	max-width: 900px;

	text-align: center;

	margin: 0 auto;

}



.hero-content-moon .section-title p{

	max-width: 740px;

	margin-left: auto;

	margin-right: auto;

}



.hero-content-body-moon{

	display: flex;

	flex-wrap: wrap;

	align-items: center;

	justify-content: center;

	gap: 20px 30px;

}



.hero-intro-video-box-moon{

	position: relative;

	margin-top: 80px;

	margin-bottom: -300px;

}



.hero-video-image-moon figure{

	display: block;

	border-radius: 12px;

}



.hero-video-image-moon figure img{

	width: 100%;

	aspect-ratio: 1 / 0.409;

	object-fit: cover;

	border-radius: 12px;

}



.hero-intro-video-box-moon .video-play-button{

	position: absolute;

	left: 50%;

	top: 50%;

	transform: translate(-50%, -50%);

	z-index: 1;

}



.hero-intro-video-box-moon .video-play-button a{

	width: 84px;

	height: 84px;

}



.hero-intro-video-box-moon .video-play-button a.bg-effect:before, 

.hero-intro-video-box-moon .video-play-button a.bg-effect:after{

	left: -38%;

	top: -38%;

	border-width: 75px;

}



.hero-intro-video-box-moon .video-play-button a i{

	font-size: 30px;

}



.about-us-moon{

	padding: 100px 0;

}



.about-us-content-moon{

	margin-right: 15px;

}



.about-us-header-moon{

	display: flex;

	flex-wrap: wrap;

	align-items: end;

	gap: 40px;

	margin-bottom: 40px;

}



.about-us-header-image-moon{

	width: calc(37% - 20px);

	margin-bottom: -40px;

}



.about-us-header-image-moon figure{

	display: block;

	border-radius: 12px 12px 0 0;

}



.about-us-header-image-moon img{

	width: 100%;

	aspect-ratio: 1 / 1.556;

	object-fit: cover;

	border-radius: 12px 12px 0 0;

}



.about-us-header-content-moon{

	width: calc(63% - 20px);

}



.about-us-list-moon ul{

	display: flex;

	flex-wrap: wrap;

	gap: 15px 20px;

	list-style: none;

	margin: 0;

	padding: 0;

}



.about-us-list-moon ul li{

	width: calc(50% - 10px);

    position: relative;

    color: var(--primary-color);

    line-height: 1.5em;

    padding-left: 25px;

}



.about-us-list-moon ul li::before{

	content: '\f058';

    position: absolute;

    font-family: 'Font Awesome 7 Free';

    font-size: 18px;

    font-weight: 900;

    color: var(--accent-color);

    top: 0;

    left: 0;

}



.about-author-btn-box-moon{

	display: flex;

	flex-wrap: wrap;

	align-items: center;

	gap: 20px 30px;

	margin-top: 40px;

}



.about-author-box-moon{

	display: flex;

	flex-wrap: wrap;

	align-items: center;

	gap: 15px;

}



.about-author-box-image-moon figure{

	display: block;

	border-radius: 50%;

}



.about-author-box-image-moon figure img{

	width: 100%;

	max-width: 50px;

	border-radius: 50%;

}



.about-author-box-content-moon h3{

	font-size: 20px;

}



.about-author-box-content-moon p{

	margin: 5px 0 0;

}



.about-us-counter-list-moon{

	display: flex;

	flex-wrap: wrap;

	justify-content: space-between;

	gap: 30px;

	background-color: var(--secondary-color);

	border-radius: 12px;

	padding: 50px;

}



.about-us-counter-item-moon{

	position: relative;

	width: calc(25% - 22.5px);

	text-align: center;

}



.about-us-counter-item-moon::before{

	content: '';

    position: absolute;

    right: -15px;

    bottom: 0;

    height: 100%;

    width: 1px;

    background-color: var(--divider-color);

}



.about-us-counter-item-moon:nth-child(4n + 4):before,

.about-us-counter-item-moon:last-child::before{

	display: none;

}



.about-us-counter-item-moon h2{

	font-size: 44px;

}



.about-us-counter-item-moon p{

	margin: 5px 0 0 0;

}



.about-us-image-moon{

	height: 100%;

}



.about-us-image-moon figure{

	height: 100%;

	display: block;

	border-radius: 12px;

}



.about-us-image-moon img{

	height: 100%;

	width: 100%;

	aspect-ratio: 1 / 1.52;

	object-fit: cover;

	border-radius: 12px;

}



.our-services-moon{

	padding: 100px 0;

}



.services-item-list-moon{

	display: flex;

	flex-wrap: wrap;

	gap: 30px;

}



.services-item-moon{

	display: flex;

	flex-wrap: wrap;

	width: calc(50% - 15px);

	gap: 30px;

}



.services-item-moon:nth-child(4n),

.services-item-moon:nth-child(4n + 3){

    flex-direction: row-reverse;

}



.services-item-image-moon{

	width: calc(50% - 15px);

}



.services-item-image-moon a,

.services-item-image-moon figure{

	height: 100%;

	cursor: none;

	display: block;

	border-radius: 12px;

	overflow: hidden;

}



.services-item-image-moon a img{

	height: 100%;

	width: 100%;

	aspect-ratio: 1 / 1.015;

	object-fit: cover;

	border-radius: 12px;

	transition: all 0.6s ease-in-out;

}



.services-item-moon:hover .services-item-image-moon a img{

	transform: scale(1.06);

}



.services-item-content-box-moon{

	width: calc(50% - 15px);

	position: relative;

	display: flex;

	flex-direction: column;

	justify-content: space-between;

	gap: 30px;

	background-color: var(--white-color);

	border-radius: 12px;

	padding: 30px;

	overflow: hidden;

}



.services-item-content-box-moon::before{

	content: '';

    position: absolute;

    right: 0;

    bottom: 0;

    left: 0;

    width: 100%;

    height: 0%;

    background: var(--accent-color);

    border-radius: 12px;

    z-index: 0;

    transition: all 0.4s ease-in-out;

}



.services-item-moon:hover .services-item-content-box-moon::before{

	height: 100%;

	border-radius: 0;

}



.services-item-content-box-moon .icon-box{

	position: relative;

	height: 50px;

	width: 50px;

	background-color: var(--accent-color);

	border-radius: 50%;

	display: flex;

	align-items: center;

	justify-content: center;

	overflow: hidden;

}



.services-item-content-box-moon .icon-box::before{

	content: '';

	position: absolute;

	top: 0;

	bottom: 0;

	right: 0;

	left: 0;

	background: var(--white-color);

	border-radius: 50%;

	width: 100%;

	height: 100%;

	transform: scale(0);

	transition: all 0.4s ease-in-out;

	z-index: 0;

}



.services-item-moon:hover .services-item-content-box-moon .icon-box::before{

	transform: scale(1);

}



.services-item-content-box-moon .icon-box img{

	position: relative;

	width: 100%;

	max-width: 24px;

	transition: all 0.4s ease-in-out;

	z-index: 1;

}



.services-item-moon:hover .services-item-content-box-moon .icon-box img{

	filter: brightness(0) invert(0);

}



.services-item-body-moon{

	position: relative;

	border-top: 1px solid var(--divider-color);

	padding-top: 30px;

	z-index: 1;

	transition: all 0.4s ease-in-out;

}



.services-item-content-moon h2{

	font-size: 20px;

	transition: all 0.4s ease-in-out;

}



.services-item-content-moon h2 a{

	color: inherit;

}



.services-item-content-moon p{

	margin: 10px 0 0;

	transition: all 0.4s ease-in-out;

}



.services-item-btn-moon{

	margin-top: 25px;

}



.services-item-btn-moon .readmore-btn::before,

.services-item-btn-moon .readmore-btn{

	transition: all 0.3s ease-in-out;

}



.services-item-moon:hover .services-item-content-moon h2,

.services-item-moon:hover .services-item-content-moon p,

.services-item-moon:hover .services-item-btn-moon .readmore-btn{

	color: var(--white-color);

} 



.services-item-moon:hover .services-item-body-moon{

	border-color: var(--dark-divider-color);

}



.services-item-moon:hover .services-item-btn-moon .readmore-btn::before{

	filter: brightness(0) invert(1);

}



.our-services-moon .section-footer-text{

	margin-top: 60px;

}



.what-we-do-moon{

	padding: 100px 0;

}



.what-we-do-image-box-moon{

	position: relative;

	margin-right: 15px;

	height: 100%;

}



.what-we-image-moon{

	height: 100%;

}



.what-we-image-moon figure{

	display: block;

	height: 100%;

	border-radius: 12px;

}



.what-we-image-moon img{

	width: 100%;

	height: 100%;

	aspect-ratio: 1 / 0.964;

	object-fit: cover;

	border-radius: 12px;

}



.what-we-cta-box-moon{

	position: absolute;

	left: 30px;

	bottom: 30px;

	right: 30px;

	max-width: 300px;

	background-color: var(--dark-divider-color);

	backdrop-filter: blur(30px);

    -webkit-backdrop-filter: blur(30px);

	border-radius: 12px;

	display: flex;

	flex-wrap: wrap;

	gap: 20px;

	padding: 30px;

	z-index: 1;

}



.what-we-cta-box-moon .icon-box{

	position: relative;

	height: 50px;

	width: 50px;

	background-color: var(--accent-color);

	border-radius: 50%;

	display: flex;

	align-items: center;

	justify-content: center;

	overflow: hidden;

}



.what-we-cta-box-moon .icon-box::before{

	content: '';

	position: absolute;

	top: 0;

	bottom: 0;

	right: 0;

	left: 0;

	background: var(--white-color);

	border-radius: 50%;

	width: 100%;

	height: 100%;

	transform: scale(0);

	transition: all 0.4s ease-in-out;

	z-index: 0;

}



.what-we-cta-box-moon:hover .icon-box::before{

	transform: scale(1);

}



.what-we-cta-box-moon .icon-box img{

	position: relative;

	width: 100%;

	max-width: 24px;

	transition: all 0.4s ease-in-out;

	z-index: 1;

}



.what-we-cta-box-moon:hover .icon-box img{

	filter: brightness(0) invert(0);

}



.what-we-cta-content-moon{

	width: calc(100% - 70px);

}



.what-we-cta-content-moon h2{

	font-size: 44px;

	color: var(--white-color);

}



.what-we-cta-content-moon p{

	color: var(--white-color);

	margin: 5px 0 0;

}



.what-we-do-content-moon{

	height: 100%;

	align-content: center;

}



.what-we-do-body-moon{

	border-top: 1px solid var(--divider-color);

	padding-top: 40px;

}



.what-we-item-list-moon{

	display: flex;

	flex-wrap: wrap;

	gap: 30px;

}



.what-we-item-moon{

	width: calc(50% - 15px);

	display: flex;

	flex-wrap: wrap;

	align-items: center;

	gap: 15px;

}



.what-we-item-moon .icon-box{

	position: relative;

	height: 50px;

	width: 50px;

	background-color: var(--accent-color);

	border-radius: 50%;

	display: flex;

	align-items: center;

	justify-content: center;

	overflow: hidden;

}



.what-we-item-moon .icon-box::before{

	content: '';

	position: absolute;

	top: 0;

	bottom: 0;

	right: 0;

	left: 0;

	background: var(--primary-color);

	border-radius: 50%;

	width: 100%;

	height: 100%;

	transform: scale(0);

	transition: all 0.4s ease-in-out;

	z-index: 0;

}



.what-we-item-moon:hover .icon-box::before{

	transform: scale(1);

}



.what-we-item-moon .icon-box img{

	position: relative;

	width: 100%;

	max-width: 24px;

	z-index: 1;

}



.what-we-item-title-moon{

	width: calc(100% - 65px);

}



.what-we-item-title-moon h3{

	font-size: 20px;

	line-height: 1.4em;

}



.what-we-counter-box-moon{

	background-color: var(--secondary-color);

	display: flex;

	flex-wrap: wrap;

	border-radius: 12px;

	margin-top: 40px;

}



.what-we-satisfy-client-moon{

	width: 40%;

	align-content: center;

	border-right: 1px solid var(--divider-color);

	padding: 30px;

}



.satisfy-client-content-moon{

	margin-top: 25px;

}



.satisfy-client-content-moon h3{

	font-size: 20px;

}



.what-we-counter-list-moon{

	width: 60%;

	text-align: center;

	display: flex;

	flex-wrap: wrap;

	align-items: center;

	padding: 30px;

	gap: 30px 60px;

}



.what-we-counter-item-moon{

	position: relative;

	width: calc(50% - 30px);

}



.what-we-counter-item-moon::before{

	content: '';

	position: absolute;

	top: 0;

	bottom: 0;

	right: -30px;

	height: 100%;

	width: 1px;

	background-color: var(--divider-color);	

}



.what-we-counter-item-moon:nth-child(2n + 2):before,

.what-we-counter-item-moon:last-child:before{

	display: none;

}



.what-we-counter-item-moon h2{

	font-size: 44px;

}



.what-we-counter-item-moon p{

	margin: 5px 0 0;

}



.what-we-btn-moon{

	margin-top: 40px;

}



.our-team-moon{

	padding: 100px 0;

}



.team-item-moon{

    position: relative;

    border-radius: 12px;

    height: calc(100% - 30px);

    margin-bottom: 30px;

    overflow: hidden;

}



.team-item-image-moon figure{

	display: block;

}



.team-item-image-moon a{

    display: block;

    cursor: none;

}



.team-item-image-moon img{

    width: 100%;

    aspect-ratio: 1 / 1.247;

    object-fit: cover;

	transition: all 0.6s ease-in-out;

}



.team-item-moon:hover .team-item-image-moon img{

	transform: scale(1.06);

}



.team-item-body-moon{

    position: absolute;

    bottom: 10px;

    left: 10px;

    right: 10px;

	background-color: var(--white-color);

    border-radius: 12px;

    text-align: center;

    padding: 30px;

    z-index: 1;

}



.team-item-content-moon h2{

    font-size: 20px;

    margin-bottom: 10px;

    text-transform: capitalize;

}



.team-item-content-moon h2 a{

    color: inherit;

}



.team-item-content-moon p{

	margin: 0;

}



.team-social-list-moon{

    height: 0;

    opacity: 0;

    visibility: hidden;

    transition: all 0.5s ease-in-out;

}



.team-item-moon:hover .team-social-list-moon{

    height: 40px;

    opacity: 1;

    visibility: visible;

    margin-top: 20px;

}



.team-social-list-moon ul{

    display: flex;

    flex-wrap: wrap;

    justify-content: center;

    gap: 15px;

    list-style: none;

    margin: 0;

    padding: 0;

}



.team-social-list-moon ul li a{

	color: var(--primary-color);

    border: 1px solid var(--divider-color);

    border-radius: 50%;

    width: 40px;

    height: 40px;

    display: flex;

    align-items: center;

    justify-content: center;

    transition: all 0.4s ease-in-out;

}



.team-social-list-moon ul li a:hover{

    color: var(--white-color);

    background: var(--accent-color);

}



.team-social-list-moon ul li a i{

    font-size: 18px;

	color: inherit;

}



.our-pricing-moon{

	padding: 100px 0;

}



.pricing-item-moon{

	background-color: var(--secondary-color);

	border-radius: 12px;

	height: calc(100% - 30px);

	margin-bottom: 30px;

	padding: 40px;

}



.pricing-item-header-moon .icon-box{

	position: relative;

	height: 50px;

	width: 50px;

	background-color: var(--accent-color);

	border-radius: 50%;

	display: flex;

	align-items: center;

	justify-content: center;

	margin-bottom: 30px;

	overflow: hidden;

}



.pricing-item-header-moon .icon-box::before{

	content: '';

	position: absolute;

	top: 0;

	bottom: 0;

	right: 0;

	left: 0;

	background: var(--primary-color);

	border-radius: 50%;

	width: 100%;

	height: 100%;

	transform: scale(0);

	transition: all 0.4s ease-in-out;

	z-index: 0;

}



.pricing-item-moon:hover .icon-box::before{

	transform: scale(1);

}



.pricing-item-header-moon .icon-box img{

	position: relative;

	width: 100%;

	max-width: 24px;

	transition: all 0.4s ease-in-out;

	z-index: 1;

}



.pricing-item-content-moon h3{

	font-size: 20px;

}



.pricing-item-content-moon p{

	margin: 10px 0 0;

}



.pricing-item-content-moon h2{

	font-size: 44px;

	margin-top: 30px;

}



.pricing-item-content-moon h2 sub{

	font-size: 16px;

	font-weight: 400;

	color: var(--text-color);

	bottom: 0;

}



.pricing-item-body-moon{

	margin-top: 30px;

}



.pricing-item-btn-moon .btn-default{

	text-align: center;

	width: 100%;

	border-radius: 12px;

	margin-right: 0;

}



.pricing-item-btn-moon .btn-default::after{

	border-radius: 12px;

}



.pricing-item-btn-moon .btn-default::before{

	display: none;

}



.pricing-item-list-moon{

	border-top: 1px solid var(--divider-color);

	margin-top: 30px;

	padding-top: 30px;

}



.pricing-item-list-moon h3{

	font-size: 20px;

}



.pricing-item-list-moon ul{

	list-style: none;

	margin: 20px 0 0;

	padding: 0;

}



.pricing-item-list-moon ul li{

	position: relative;

	line-height: 1.5em;

	padding-left: 25px;

	margin-bottom: 15px;

}



.pricing-item-list-moon ul li:last-child{

	margin-bottom: 0;

}



.pricing-item-list-moon ul li::before{

	content: '\f058';

    position: absolute;

    font-family: 'Font Awesome 7 Free';

    font-size: 18px;

    font-weight: 900;

    color: var(--accent-color);

    top: 0;

    left: 0;

}



.pricing-item-moon.highlighted-box{

	position: relative;

	background-color: var(--primary-color);

	overflow: hidden;

}



.pricing-item-moon.highlighted-box::after{

	content: 'most popular';

    position: absolute;

    font-size: 18px;

    font-weight: 600;

    text-transform: capitalize;

    color: var(--white-color);

    top: 32px;

    right: -62px;

    width: 220px;

    height: 36px;

    display: flex;

    justify-content: center;

    align-items: center;

    background: var(--accent-color);

    transform: rotate(45deg);

    transition: all 0.4s ease-in-out;

}



.pricing-item-moon.highlighted-box .pricing-item-header-moon .icon-box::before{

	background-color: var(--white-color);

}



.pricing-item-moon.highlighted-box:hover .pricing-item-header-moon .icon-box img{

	filter: brightness(1) invert(1);

}



.pricing-item-moon.highlighted-box .pricing-item-content-moon h3,

.pricing-item-moon.highlighted-box .pricing-item-content-moon p,

.pricing-item-moon.highlighted-box .pricing-item-content-moon h2,

.pricing-item-moon.highlighted-box .pricing-item-content-moon h2 sub,

.pricing-item-moon.highlighted-box .pricing-item-list-moon h3,

.pricing-item-moon.highlighted-box .pricing-item-list-moon ul li{

	color: var(--white-color);

}



.pricing-item-moon.highlighted-box .pricing-item-list-moon{

	border-color: var(--dark-divider-color);

}



.pricing-benefit-list-moon{

	margin-top: 30px;

}



.pricing-benefit-list-moon ul{

	display: flex;

	flex-wrap: wrap;

    justify-content: center;

	list-style: none;

	margin: 0;

	padding: 0;

	gap: 20px 40px;

}



.pricing-benefit-list-moon ul li{

    display: inline-flex;

    align-items: center;

}



.pricing-benefit-list-moon ul li img{

	width: 100%;

	max-width: 20px;

	margin-right: 10px;

}



.our-partners-moon{

	position: relative;

	padding: 100px 0;

}



.partner-content-moon{

	position: relative;

	z-index: 1;

}



.partner-info-box-moon{

	display: flex;

	flex-wrap: wrap;

	align-items: center;

	gap: 15px 30px;

}



.partner-contact-box-moon{

	display: flex;

	flex-wrap: wrap;

	align-items: center;

	gap: 15px;

}



.partner-contact-box-moon .icon-box{

	position: relative;

    background: var(--accent-color);

    width: 50px;

    height: 50px;

    display: flex;

    align-items: center;

    justify-content: center;

    border-radius: 50%;

	overflow: hidden;

}



.partner-contact-box-moon .icon-box::before{

    content: '';

	position: absolute;

	top: 0;

	bottom: 0;

	right: 0;

	left: 0;

	background: var(--secondary-color);

	border-radius: 50%;

	width: 100%;

	height: 100%;

	transform: scale(0);

	transition: all 0.4s ease-in-out;

}



.partner-contact-box-moon:hover .icon-box::before{

    transform: scale(1);

}



.partner-contact-box-moon .icon-box img{

    position: relative;

    width: 100%;

    max-width: 24px;

	transition: all 0.4s ease-in-out;

    z-index: 1;

}



.partner-contact-box-moon:hover .icon-box img{

	filter: brightness(0) invert(0);

}



.partner-conatct-content-moon p{

	color: var(--white-color);

	margin-bottom: 5px;

}



.partner-conatct-content-moon h3{

	font-size: 20px;

	color: var(--white-color);

}



.partner-conatct-content-moon h3 a{

	color: inherit;

	transition: all 0.3s ease-in-out;

}



.partner-conatct-content-moon h3 a:hover{

	color: var(--accent-color);

}



.partner-image-content-box-moon{

	position: relative;

	display: flex;

	flex-wrap: wrap;

	gap: 30px;

	z-index: 1;

}



.partner-image-moon{

	width: calc(58% - 15px);

	align-content: end;

}



.partner-image-moon figure{

	display: block;

	border-radius: 10px 10px 0 0;

}



.partner-image-moon figure img{

	width: 100%;

	object-fit: cover;

	aspect-ratio: 1 / 1.666;

	border-radius: 10px 10px 0 0;

	margin-bottom: -100px;

}



.partner-counter-item-list-moon{

	width: calc(42% - 15px);

	align-content: center;

}



.partner-counter-item-moon{

	background-color: var(--dark-divider-color);

	backdrop-filter: blur(30px);

    -webkit-backdrop-filter: blur(30px);

	border-radius: 12px;

	margin-bottom: 30px;

	padding: 30px;

}



.partner-counter-item-moon:last-child{

	margin-bottom: 0;

}



.partner-counter-item-header-moon{

	display: flex;

	flex-wrap: wrap;

	gap: 20px;

}



.partner-counter-item-header-moon .icon-box{

	position: relative;

    background: var(--accent-color);

    width: 50px;

    height: 50px;

    display: flex;

    align-items: center;

    justify-content: center;

    border-radius: 50%;

    overflow: hidden;

}



.partner-counter-item-header-moon .icon-box::before{

    content: '';

	position: absolute;

	top: 0;

	bottom: 0;

	right: 0;

	left: 0;

	background: var(--secondary-color);

	border-radius: 50%;

	width: 100%;

	height: 100%;

	transform: scale(0);

	transition: all 0.4s ease-in-out;

	z-index: 0;

}



.partner-counter-item-moon:hover .icon-box::before{

    transform: scale(1);

}



.partner-counter-item-header-moon .icon-box img{

    position: relative;

    width: 100%;

    max-width: 24px;

	transition: all 0.4s ease-in-out;

    z-index: 1;

}



.partner-counter-item-moon:hover .icon-box img{

	filter: brightness(0) invert(0);

}



.partner-counter-item-content-moon{

	width: calc(100% - 70px);

}



.partner-counter-item-content-moon h2{

	font-size: 44px;

	color: var(--white-color);

}



.partner-counter-item-content-moon h3{

	font-size: 20px;

	color: var(--white-color);

	line-height: 1.4em;

	margin-top: 10px;

}



.partner-counter-item-body-moon{

	border-top: 1px solid var(--dark-divider-color);

	padding-top: 20px;

	margin-top: 20px;

}



.partner-counter-item-body-moon ul{

	list-style: none;

	margin: 0;

	padding: 0;

}



.partner-counter-item-body-moon ul li{

    position: relative;

    color: var(--white-color);

    line-height: 1.5em;

    padding-left: 25px;

}



.partner-counter-item-body-moon ul li::before{

	content: '\f058';

    position: absolute;

    font-family: 'Font Awesome 7 Free';

    font-size: 18px;

    font-weight: 900;

    color: var(--accent-color);

    top: 0;

    left: 0;

}



.partner-title-box-moon{

	position: absolute;

	text-align: center;

	bottom: 0;

	left: 20px;

	right: 20px;

}



.partner-title-box-moon h2{

    font-size: 26.042vw;

    font-weight: 700;

    line-height: 0.85em;

    color: transparent;

    background: linear-gradient(180deg, rgba(255, 101, 39, 0.7) 0%, rgba(19, 17, 13, 0) 80%);

    background-clip: text;

    -webkit-background-clip: text;

}



.our-testimonials-moon{

	padding: 100px 0;

}



.testimonial-image-box-moon{

	position: relative;

	height: 100%;

}



.testimonial-image-moon{

	height: 100%;

}



.testimonial-image-moon figure{

	display: block;

	border-radius: 12px;

	height: 100%;

}



.testimonial-image-moon figure img{

	width: 100%;

	height: 100%;

	object-fit: cover;

	border-radius: 12px;

	aspect-ratio: 1 / 0.89;

}



.testimonial-cta-box-moon{

	width: 100%;

	position: absolute;

	left: 20px;

	bottom: 20px;

	max-width: 330px;

	background-color: var(--divider-color);

	backdrop-filter: blur(20px);

    -webkit-backdrop-filter: blur(20px);

	border-radius: 12px;

	padding: 20px;

}



.testimonial-cta-box-moon h3{

	font-size: 20px;

	color: var(--white-color);

}



.testimonial-cta-box-moon ul{

	list-style: none;

	padding: 0;

	margin: 0;

	border-top: 1px solid var(--dark-divider-color);

	padding-top: 30px;

	margin-top: 30px;

}



.testimonial-cta-box-moon ul li{

	display: flex;

	flex-wrap: wrap;

	justify-content: space-between;

	gap: 10px;

	color: var(--white-color);

	margin-bottom: 15px;

}



.testimonial-cta-box-moon ul li:last-child{

	margin-bottom: 0;

}



.testimonial-content-box-moon{

	background-color: var(--secondary-color);

	height: 100%;

	align-content: center;

	border-radius: 12px;

	padding: 60px 3.125vw;

}



.testimonial-content-box-moon .section-title{

	margin-bottom: 60px;

}



.testimonial-quote-moon{

	margin-bottom: 30px;

}



.testimonial-quote-moon img{

	width: 100%;

	max-width: 40px;

}



.testimonial-rating-moon{

	margin-bottom: 30px;

}



.testimonial-rating-moon i{

	font-size: 20px;

	color: var(--accent-color);

}



.testimonial-item-content-moon p{

	font-size: 18px;

	margin: 0;

}



.testimonial-author-moon{

	display: flex;

	flex-wrap: wrap;

	align-items: center;

	gap: 15px;

	border-top: 1px solid var(--divider-color);

	padding-top: 40px;

	margin-top: 40px;

}



.author-image-moon figure{

	display: block;

	border-radius: 50%;

}



.author-image-moon figure img{

	width: 100%;

	max-width: 50px;

	border-radius: 50%;

}



.authore-content-moon h3{

	font-size: 20px;

}



.authore-content-moon p{

	margin: 5px 0 0;

}



.testimonial-btn-moon{

    position: absolute;

    bottom: 0;

    right: 0;

    display: flex;

	gap: 15px;

    z-index: 2;

}



.testimonial-slider-moon .testimonial-button-next-moon,

.testimonial-slider-moon .testimonial-button-prev-moon{

	position: relative;

	width: 40px;

	height: 40px;

	background-color: var(--white-color);

	border-radius: 50%;

	transition: all 0.4s ease-in-out;

}



.testimonial-slider-moon .testimonial-button-next-moon:hover,

.testimonial-slider-moon .testimonial-button-prev-moon:hover{

	background: var(--accent-color);

}



.testimonial-slider-moon .testimonial-button-next-moon::before,

.testimonial-slider-moon .testimonial-button-prev-moon::before{

	content: '';

	position: absolute;

	top: 50%;

	left: 50%;

	background: url('../images/arrow-accent.svg') no-repeat center center;

	background-size: cover;

	transform: translate(-50%, -50%) rotate(180deg);

	width: 18px;

	height: 18px;

	transition: all 0.4s ease-in-out;

}



.testimonial-slider-moon .testimonial-button-next-moon::before{

	transform: translate(-50%, -50%) rotate(0deg);

}



.testimonial-slider-moon .testimonial-button-next-moon:hover::before,

.testimonial-slider-moon .testimonial-button-prev-moon:hover::before{

	filter: brightness(0) invert(1);

}



.our-faqs-moon{

	padding: 100px 0;

}



.faq-image-box-moon{

	display: flex;

	flex-wrap: wrap;

	gap: 20px;

}



.faq-image-box-1-moon{

	width: 59%;

	background-image: url('../images/faq-bg-image-moon.svg');

	background-repeat: no-repeat;

	background-position: bottom 15px left 10px;

	background-size: auto;

}



.faq-image-moon figure{

	display: block;

	border-radius: 12px;

}



.faq-image-moon figure img{

	width: 100%;

	object-fit: cover;

	border-radius: 12px;

}



.faq-image-box-1-moon .faq-image-moon figure img{

	aspect-ratio: 1 / 1.385;

}



.faq-image-box-2-moon{

	position: relative;

	width: calc(41% - 20px);

	margin-top: 20px;

	z-index: 1;

}



.faq-counter-box-moon{

	background-color: var(--dark-divider-color);

	backdrop-filter: blur(30px);

    -webkit-backdrop-filter: blur(30px);

	border-radius: 12px;

	text-align: center;

	padding: 40px 2.083vw;

	margin: 0 10px 10px 0;

}



.faq-counter-box-moon h2{

	font-size: 60px;

	color: var(--accent-color);

}



.faq-counter-box-moon p{

	color: var(--white-color);

	margin: 10px 0 0;

}



.faq-image-box-2-moon .faq-image-moon{

	margin-left: -250px;

}



.faq-image-box-2-moon .faq-image-moon figure{

	border: 10px solid var(--primary-color);

	border-radius: 20px;

}



.faq-image-box-2-moon .faq-image-moon figure img{

	aspect-ratio: 1 / 1.11;

}



.faq-accordion-moon .accordion-item-moon{

    position: relative;

    background: var(--dark-divider-color);

    backdrop-filter: blur(30px);

    -webkit-backdrop-filter: blur(30px);

    border-radius: 12px;

    margin-bottom: 30px;

    overflow: hidden;

}



.faq-accordion-moon .accordion-item-moon.accordion-item-moon:last-child{

	margin-bottom: 0;

}



.faq-accordion-moon .accordion-header .accordion-button{

    font-size: 18px;

    font-weight: 500;

    line-height: 1.333em;

    background: transparent;

    color: var(--white-color);

    padding: 22px 55px 22px 30px;

}



.faq-accordion-moon .accordion-item-moon .accordion-button::after, 

.faq-accordion-moon .accordion-item-moon .accordion-button.collapsed::after{

    content: '\f077';

    font-family: "FontAwesome";

    position: absolute;

    right: 30px;

    top: 50%;

    font-size: 20px;

    transform: translateY(-50%);

	color: var(--white-color);

    transition: all 0.4s ease-in-out;

}



.faq-accordion-moon .accordion-item-moon .accordion-button.collapsed::after{

	transform: translateY(-50%) rotate(180deg);

	color: var(--accent-color);

}



.faq-accordion-moon .accordion-item-moon .accordion-body{

    border-top: 1px solid var(--dark-divider-color);

    background: transparent;

    padding: 22px 30px;

}



.faq-accordion-moon .accordion-item-moon .accordion-body p{

    margin: 0;

    color: var(--white-color);

}


.abn {
 text-align: right;
 color: #fff;
}




.main-footer-moon{

	padding: 100px 0 0;

	margin-bottom: 20px;

}



.footer-logo-moon img{

	width: 100%;

	max-width: 166px;

}



.about-footer-content-moon{

	margin-top: 25px;

}



.about-footer-content-moon p{

	color: var(--white-color);

	margin-bottom: 0;

}



.footer-links-box-moon{

	display: flex;

	flex-wrap: wrap;

	justify-content: space-between;

	gap: 30px;

	margin-left: 4.167vw;

}



.footer-links-moon{

	max-width: 32%;

}



.footer-links-moon h3{

	font-size: 20px;

	color: var(--white-color);

	margin-bottom: 30px;

}



.footer-links-moon ul{

	list-style: disc;

    margin: 0;

    padding-left: 20px;

}



.footer-links-moon ul li{

	color: var(--white-color);

    line-height: 1.5em;

    text-transform: capitalize;

    margin-bottom: 15px;

}



.footer-links-moon ul li:last-child{

	margin-bottom: 0;

}



.footer-links-moon ul li::marker{

	color: var(--accent-color);

    transition: all 0.3s ease-in-out;

}



.footer-links-moon ul li:hover::marker{

	color: var(--white-color);

}



.footer-links-moon ul li a{

	color: inherit;

	transition: all 0.3s ease-in-out;

}



.footer-links-moon ul li a:hover{

	color: var(--accent-color);

}



.footer-links-moon p{

	color: var(--white-color);

	margin-bottom: 0;

}



.footer-newsletter-form-moon{

	max-width: 40%;

}



.footer-newsletter-form-moon .form-group{

	display: flex;

	flex-wrap: wrap;

	background-color: var(--dark-divider-color);

	backdrop-filter: blur(30px) saturate(100%);

    -webkit-backdrop-filter: blur(30px) saturate(100%);

	border-radius: 10px;

	padding: 5px;

	margin-top: 30px;

}



.footer-newsletter-form-moon .form-group .form-control{

    width: calc(100% - 40px);

    font-size: 16px;

    font-weight: 400;

    line-height: 1.2em;

    color: var(--white-color);

    background: transparent;

    border: none;

    border-radius: 0;

    outline: none;

    box-shadow: none;

    padding: 6px 14px;

}



.footer-newsletter-form-moon .form-group .form-control::placeholder{

	color: var(--white-color);

	opacity: 50%;

}



.footer-newsletter-form-moon .form-group .newsletter-btn{

	width: 40px;

    height: 40px;

    display: flex;

    justify-content: center;

    align-items: center;

    background-color: var(--accent-color);

    border: none;

	outline: none;

	box-shadow: none;

    border-radius: 5px;

    transition: all 0.3s ease-in-out;

}



.footer-newsletter-form-moon .form-group .newsletter-btn:hover{

	background: var(--white-color);

}



.footer-newsletter-form-moon .form-group .newsletter-btn img{

	width: 100%;

	max-width: 20px;

	transition: all 0.3s ease-in-out;

}



.footer-newsletter-form-moon .form-group .newsletter-btn:hover img{

	filter: brightness(0) invert(0);

}



.footer-cta-box-moon{

	display: flex;

	flex-wrap: wrap;

	align-items: center;

	justify-content: space-between;

	gap: 30px;

	background-color: var(--dark-divider-color);

	backdrop-filter: blur(30px);

    -webkit-backdrop-filter: blur(30px);

	border-radius: 12px;

	padding: 40px;

	margin-top: 60px;

}



.footer-cta-box-moon .section-title{

	max-width: 540px;

	margin-bottom: 0;

}



.footer-contact-info-moon{

	display: flex;

	flex-wrap: wrap;

}



.footer-contact-item-moon{

	display: flex;

	flex-wrap: wrap;

	align-items: center;

	gap: 15px;

	border-right: 1px solid var(--dark-divider-color);

	padding-right: 30px;

	margin-right: 30px;

}



.footer-contact-item-moon:last-child{

	border-right: none;

	padding-right: 0;

	margin-right: 0;

}



.footer-contact-item-moon .icon-box{

    position: relative;

    width: 50px;

    height: 50px;

    background-color: var(--accent-color);

    border-radius: 50%;

    display: flex;

    align-items: center;

    justify-content: center;

    overflow: hidden;

}



.footer-contact-item-moon .icon-box::before{

	content: '';

	position: absolute;

	top: 0;

    right: 0;

    bottom: 0;

    left: 0;

    width: 100%;

    height: 100%;

    background: var(--white-color);

    border-radius: 50%;

    transform: scale(0);

    transition: all 0.4s ease-in-out;

}



.footer-contact-item-moon:hover .icon-box::before{

    transform: scale(1);

}



.footer-contact-item-moon .icon-box img{

	position: relative;

	width: 100%;

	max-width: 24px;

	transition: all 0.4s ease-in-out;

    z-index: 1;

}



.footer-contact-item-moon:hover .icon-box img{

	filter: brightness(0) invert(0);

}



.footer-contact-item-content-moon{

	width: calc(100% - 65px);

}



.footer-contact-item-content-moon p{

	color: var(--white-color);

	margin: 0 0 5px;

}



.footer-contact-item-content-moon h3{

	color: var(--white-color);

	font-size: 20px;

}



.footer-contact-item-content-moon h3 a{

	color: inherit;

	transition: all 0.3s ease-in-out;

}



.footer-contact-item-content-moon h3 a:hover{

	color: var(--accent-color);

}



.footer-copyright-moon{

	display: flex;

	flex-wrap: wrap;

	justify-content: space-between;

	align-items: center;

	gap: 20px;

	padding: 60px 0 40px;

}



.footer-copyright-text-moon p{

	color: var(--white-color);

	margin: 0;

}



.footer-social-links-moon{

	display: inline-flex;

	align-items: center;

	gap: 20px;

}



.footer-social-links-moon p{

	color: var(--white-color);

	margin-bottom: 0;

}



.footer-social-links-moon ul{

	display: flex;

    flex-wrap: wrap;

    gap: 15px;

    margin: 0;

    padding: 0;

    list-style: none;

}



.footer-social-links-moon ul li a{

    width: 40px;

    height: 40px;

    border: 1px solid var(--dark-divider-color);

    color: var(--white-color);

    border-radius: 50%;

    display: flex;

    align-items: center;

    justify-content: center;

    transition: all 0.3s ease-in-out;

}



.footer-social-links-moon ul li a:hover{

	background: var(--accent-color);

}



.footer-social-links-moon ul li a i{

	font-size: 18px;

}



.approach-item-content ul li svg {

	width: 22px;

	color: #ff6527;

}

.service-benefits-list ul li svg {

	width: 22px;

	color: #ff6527;

}

.service-entry ul li {

	padding-left: 0;

}

.service-entry ul li::before {

	display: none;

}



































































































@media only screen and (max-width: 1440px){



	.hero-moon{

		margin-bottom: 260px;

	}



	.hero-intro-video-box-moon{

		margin-bottom: -260px;

	}



	.about-author-btn-box-moon{

		margin-top: 30px;

	}



	.about-us-counter-list-moon{

		padding: 30px;

	}



	.team-item-body-moon{

		padding: 20px;

	}



	.pricing-item-moon{

		padding: 30px;

	}



	.partner-counter-item-moon{

		padding: 20px;

	}



	.testimonial-author-moon{

		padding-top: 30px;

		margin-top: 30px;

	}



	.testimonial-content-box-moon{

		padding: 40px;

	}

}









@media only screen and (max-width: 1024px){



	.hero-moon{

		margin-bottom: 190px;

	}



	.hero-intro-video-box-moon{

		margin-bottom: -190px;

	}



	.about-us-content-moon{

		margin: 0 0 30px;

	}



	.about-us-image-moon,

	.about-us-image-moon figure{

		height: auto;

	}



	.about-us-image-moon img{

		height: auto;

		aspect-ratio: 1 / 0.99;

	}



	.services-item-moon{

		width: 100%;

	}



	.services-item-image-moon a img{

		aspect-ratio: 1 / 0.7;

	}



	.services-item-moon:nth-child(4n),

	.services-item-moon:nth-child(4n + 3){

		flex-direction: initial;

	}



	.services-item-moon:nth-child(even){

		flex-direction: row-reverse;

	}



	.what-we-do-image-box-moon{

		height: auto;

		margin: 0 0 30px;

	}



	.what-we-image-moon,

	.what-we-image-moon figure,

	.what-we-image-moon img{

		height: auto;

	}



	.what-we-image-moon img{

		aspect-ratio: 1 / 0.7;

	}



	.partner-content-moon{

		margin-bottom: 40px;

	}



	.testimonial-image-box-moon{

		height: auto;

		margin-bottom: 30px;

	}



	.testimonial-image-moon,

	.testimonial-image-moon figure,

	.testimonial-image-moon figure img{

		height: auto;

	}



	.testimonial-image-moon figure img{

		aspect-ratio: 1 / 0.69;

	}



	.testimonial-cta-box-moon{

		max-width: 290px;

	}



	.testimonial-content-box-moon .section-title{

		margin-bottom: 30px;

	}



	.testimonial-quote-moon,

	.testimonial-rating-moon{

		margin-bottom: 20px;

	}



	.faq-image-box-moon{

		margin: 0 auto;

		margin-bottom: 30px;

	}



	.faq-image-box-1-moon{

		background-position: bottom 15px left 50%;

		background-size: 190px auto;

	}



	.faq-image-box-1-moon .faq-image-moon figure img{

		aspect-ratio: 1 / 1.085;

	}



	.faq-image-box-2-moon .faq-image-moon{

		margin-left: -190px;

	}



	.faq-image-box-2-moon .faq-image-moon figure img{

		aspect-ratio: 1 / 0.91;

	}



	.about-footer-moon{

		margin-bottom: 30px;

	}



	.about-footer-content-moon{

		margin-top: 15px;

	}



	.footer-links-box-moon{

		margin-left: 0;

	}



	.footer-cta-box-moon{

		padding: 30px;

	}



	.footer-cta-box-moon .section-title{

		max-width: 100%;

	}

}











@media only screen and (max-width: 991px){



	.hero-moon{

		padding: 140px 0 0;

		margin-top: 0;

	}



	.hero-intro-video-box-moon{

		margin-top: 40px;

	}



	.hero-video-image-moon figure img{

		aspect-ratio: 1 / 0.52;

	}



	.hero-intro-video-box-moon .video-play-button a{

		width: 60px;

		height: 60px;

	}



	.hero-intro-video-box-moon .video-play-button a.bg-effect:before, 

	.hero-intro-video-box-moon .video-play-button a.bg-effect:after{

		border-width: 53px;

	}



	.hero-intro-video-box-moon .video-play-button a i{

		font-size: 22px;

	}



	.about-us-moon{

		padding: 50px 0;

	}



	.about-us-header-moon{

		flex-direction: column-reverse;

		gap: 30px;

		margin-bottom: 0;

	}



	.about-us-header-content-moon{

		width: 100%;

	}



	.about-us-list-moon ul{

		gap: 10px 20px;

	}



	.about-us-list-moon ul li::before{

		font-size: 16px;

	}



	.about-us-header-image-moon{

		width: 100%;

		text-align: center;

		margin-bottom: 0;

	}



	.about-us-header-image-moon img{

		max-width: 400px;

	}



	.about-us-counter-list-moon{

		padding: 20px;

	}



	.about-us-counter-item-moon h2{

		font-size: 36px;

	}



	.our-services-moon{

		padding: 50px 0;

	}



	.our-services-moon .section-footer-text{

		margin-top: 30px;

	}



	.what-we-do-moon{

		padding: 50px 0;

	}



	.what-we-cta-box-moon{

		left: 20px;

		bottom: 20px;

		right: 20px;

		padding: 20px;

	}



	.what-we-cta-content-moon h2,

	.what-we-counter-item-moon h2{

		font-size: 36px;

	}



	.what-we-do-body-moon{

		padding-top: 30px;

	}



	.what-we-satisfy-client-moon,

	.what-we-counter-list-moon{

		padding: 20px;

	}



	.satisfy-client-content-moon{

		margin-top: 15px;

	}



	.what-we-btn-moon,

	.what-we-counter-box-moon{

		margin-top: 30px;

	}



	.our-team-moon{

		padding: 50px 0;

	}



	.our-pricing-moon{

		padding: 50px 0;

	}



	.pricing-item-moon{

		padding: 20px;

	}



	.pricing-item-header-moon .icon-box{

		margin-bottom: 20px;

	}



	.pricing-item-content-moon h2{

		font-size: 36px;

		margin-top: 20px;

	}



	.pricing-item-list-moon ul li{

		margin-bottom: 10px;

	}



	.pricing-item-list-moon ul li::before{

		font-size: 16px;

	}



	.pricing-item-moon.highlighted-box::after{

		font-size: 16px;

		width: 212px;

    	height: 32px;

	}



	.pricing-benefit-list-moon{

		margin-top: 10px;

	}



	.pricing-benefit-list-moon ul{

		gap: 15px 30px;

	}



	.our-partners-moon{

		padding: 50px 0;

	}



	.partner-content-moon{

		margin-bottom: 30px;

	}



	.partner-image-moon,

	.partner-counter-item-list-moon{

		width: calc(50% - 15px);

	}



	.partner-image-moon figure img{

		margin-bottom: -50px;

	}



	.partner-counter-item-moon{

		margin-bottom: 20px;

	}



	.partner-counter-item-content-moon h2{

		font-size: 36px;

	}



	.partner-counter-item-content-moon h3{

		font-size: 18px;

		margin-top: 5px;

	}



	.partner-counter-item-body-moon{

		padding-top: 15px;

		margin-top: 15px;

	}



	.partner-counter-item-body-moon ul li::before{

		font-size: 16px;

	}



	.our-testimonials-moon{

		padding: 50px 0;

	}



	.testimonial-image-moon figure img{

		aspect-ratio: 1 / 0.69;

	}



	.testimonial-cta-box-moon ul{

		padding-top: 20px;

		margin-top: 20px;

	}



	.testimonial-content-box-moon{

        padding: 30px;

    }



	.testimonial-quote-moon img{

		max-width: 30px;

	}



	.testimonial-rating-moon i{

		font-size: 18px;

	}



	.testimonial-author-moon{

        padding-top: 20px;

        margin-top: 20px;

    }



	.our-faqs-moon{

		padding: 50px 0;

	}



	.faq-counter-box-moon{

		padding: 20px;

	}



	.faq-counter-box-moon h2{

		font-size: 44px;

	}



	.faq-accordion-moon .accordion-item-moon{

		margin-bottom: 20px;

	}



	.faq-accordion-moon .accordion-header .accordion-button{

		padding: 15px 45px 15px 20px;

	}



	.faq-accordion-moon .accordion-item-moon .accordion-body{

		padding: 15px 20px;

	}



	.faq-accordion-moon .accordion-item-moon .accordion-button::after, 

	.faq-accordion-moon .accordion-item-moon .accordion-button.collapsed::after{

        font-size: 18px;

        right: 20px;

    }



	.main-footer-moon{

		padding: 50px 0 0;

		margin-bottom: 0;

	}



	.footer-links-moon h3{

		margin-bottom: 20px;

	}



	.footer-links-moon ul li{

		margin-bottom: 10px;

	}



	.footer-newsletter-form-moon{

		max-width: 44%;

	}



	.footer-newsletter-form-moon .form-group{

		margin-top: 20px;

	}



	.footer-cta-box-moon{

        padding: 20px 15px;

		margin-top: 30px;

    }



	.footer-contact-item-content-moon h3{

		font-size: 18px;

	}



	.footer-copyright-moon{

		padding: 30px 0;

	}



	.footer-social-links-moon ul,

	.footer-social-links-moon{

		gap: 10px;

	}



	.footer-social-links-moon ul li a{

		width: 36px;

		height: 36px;

	}



	.footer-social-links-moon ul li a i{

		font-size: 16px;

	}

}















@media only screen and (max-width: 767px){



	.hero-moon{

		margin-bottom: 140px;

	}

	

	.hero-content-body-moon{

		gap: 20px;

	}



	.hero-intro-video-box-moon{

		margin-bottom: -140px;

	}



	.hero-video-image-moon figure img{

        aspect-ratio: 1 / 0.82;

    }



	.about-us-list-moon ul li{

		width: 100%;

	}



	.about-author-btn-box-moon{

		gap: 20px;

	}

	

	.about-author-box-content-moon h3{

		font-size: 18px;

	}

	

	.about-us-header-image-moon img{

		max-width: 340px;

	}



	.about-us-counter-item-moon{

		width: calc(50% - 15px);

	}



	.about-us-counter-item-moon:nth-child(2n + 2):before{

		display: none;

	}



	.about-us-counter-item-moon h2{

		font-size: 26px;

	}



	.about-us-counter-item-moon p{

		font-size: 14px;

	}



	.about-us-image-moon img{

        aspect-ratio: 1 / 1.2;

    }



	.services-item-image-moon{

		width: 100%;

	}



	.services-item-image-moon a,

	.services-item-image-moon figure,

	.services-item-image-moon a img{

		height: auto;

	}



	.services-item-content-box-moon{

		width: 100%;

		gap: 20px;

		padding: 20px;

	}



	.services-item-body-moon{

		padding-top: 20px;

	}



	.services-item-content-moon h2{

		font-size: 18px;

	}



	.what-we-image-moon img{

        aspect-ratio: 1 / 0.9;

    }



	.what-we-cta-box-moon{

		max-width: 265px;

		gap: 10px;

		padding: 15px;

	}



	.what-we-cta-content-moon{

		width: calc(100% - 60px);

	}



	.what-we-cta-content-moon p{

		font-size: 14px;

	}



	.what-we-cta-content-moon h2,

	.what-we-counter-item-moon h2{

		font-size: 26px;

    }



	.what-we-item-list-moon{

		gap: 20px;

	}



	.what-we-item-moon{

		width: 100%;

	}	



	.what-we-item-title-moon h3{

		font-size: 18px;

	}



	.what-we-satisfy-client-moon{

		border-right: none;

		border-bottom: 1px solid var(--divider-color);

		width: 100%;

		text-align: center;

		padding: 15px;

	}



	.what-we-satisfy-client-moon .satisfy-client-images{

		justify-content: center;

	}



	.satisfy-client-content-moon h3{

		font-size: 18px;

	}



	.what-we-counter-list-moon{

		padding: 15px;

		width: 100%;

		gap: 20px;

	}



	.what-we-counter-item-moon{

		width: calc(50% - 10px);

	}



	.what-we-counter-item-moon::before{

		right: -10px;

	}



	.team-item-image-moon img{

		aspect-ratio: 1 / 1.15;

	}

	

	.pricing-item-content-moon h3,

	.pricing-item-list-moon h3{

		font-size: 18px;

	}



	.pricing-item-content-moon h2{

		font-size: 26px;

	}



	.pricing-item-content-moon h2 sub{

		font-size: 14px;

	}



	.pricing-item-moon.highlighted-box::after{

        font-size: 14px;

        width: 200px;

        height: 28px;

		top: 26px;

	}



	.pricing-benefit-list-moon ul{

		gap: 10px 15px;

	}



	.pricing-benefit-list-moon ul li{

		font-size: 14px;

	}



	.pricing-benefit-list-moon ul li img{

		max-width: 16px;

		margin-right: 5px;

	}



	.our-partners-moon{

		padding: 50px 0 100px;

	}



	.partner-info-box-moon{

		gap: 15px;

	}



	.partner-contact-box-moon{

		gap: 10px;

	}



	.partner-contact-box-moon .icon-box{

		width: 44px;

		height: 44px;

	}



	.partner-contact-box-moon .icon-box img{

		width: 22px;

	}



	.partner-conatct-content-moon{

		width: calc(100% - 54px);

	}



	.partner-conatct-content-moon h3{

		font-size: 18px;

	}



	.partner-image-content-box-moon{

		gap: 0;

	}

	

	.partner-image-moon,

	.partner-counter-item-list-moon{

		width: 100%;

	}



	.partner-image-moon figure img{

		margin: 0;

	}



	.partner-counter-item-header-moon{

		gap: 15px;

	}



	.partner-counter-item-content-moon{

		width: calc(100% - 65px);

	}

	

	.partner-counter-item-content-moon h2{

		font-size: 26px;

	}



	.partner-title-box-moon h2{

		font-size: 92px;

	}



	.testimonial-image-moon figure img{

        aspect-ratio: 1 / 0.89;

    }



	.testimonial-cta-box-moon{

		position: initial;

		margin: 20px 0 0;

		background: var(--accent-color);

		max-width: 100%;

    }



	.testimonial-cta-box-moon h3{

		font-size: 18px

	}



	.testimonial-content-box-moon{

        padding: 20px;

    }



	.testimonial-quote-moon,

	.testimonial-rating-moon{

        margin-bottom: 15px;

    }



	.testimonial-item-content-moon p{

		font-size: 16px;

	}



	.authore-content-moon h3{

		font-size: 18px;

	}



	.testimonial-btn-moon{

        position: initial;

        margin-top: 20px;

        justify-content: center;

    }



	.faq-image-box-1-moon{

        background-position: bottom 15px left 20px;

        background-size: 80px auto;

    }



	.faq-image-box-1-moon .faq-image-moon figure img{

        aspect-ratio: 1 / 1.385;

    }



	.faq-image-box-2-moon .faq-image-moon{

		margin-left: -130px;

	}



	.faq-image-box-2-moon .faq-image-moon figure{

		border-width: 5px;

	}



	.faq-counter-box-moon{

        padding: 12px;

		margin: 0 5px 10px 0;

    }



	.faq-counter-box-moon h2{

        font-size: 26px;

    }



	.faq-counter-box-moon p{

		font-size: 14px;

		margin: 5px 0 0;

	}



	.faq-accordion-moon .accordion-header .accordion-button{

        padding: 15px 40px 15px 15px;

	}



	.faq-accordion-moon .accordion-item-moon .accordion-button::after, 

	.faq-accordion-moon .accordion-item-moon .accordion-button.collapsed::after{

		font-size: 16px;

	}



	.faq-accordion-moon .accordion-item-moon .accordion-body{

		padding: 15px;

	}



	.footer-links-moon{

		max-width: 100%;

	}



	.footer-links-moon h3{

		font-size: 18px;

		margin-bottom: 15px;

	}



	.footer-cta-box-moon,

	.footer-contact-info-moon{

		gap: 20px;

	}



	.footer-contact-item-moon{

		width: 100%;

		border: none;

		padding: 0;

		margin: 0;

	}



	.footer-contact-item-moon .icon-box{

		width: 42px;

    	height: 42px;

	}



	.footer-contact-item-moon .icon-box img{

		max-width: 20px;

	}



	.footer-contact-item-content-moon h3{

		font-size: 18px;

	}



	.footer-copyright-moon{

		gap: 10px;

		flex-direction: column-reverse;

		padding: 15px 0;

	}

}



/************************************/

/***   36. Home - Version 3 css   ***/

/************************************/



.hero-royal{

    position: relative;

    background-image: url('../images/hero-bg-image-royal.jpg');

    min-height: 100vh;

    align-content: end;

    padding: 210px 0 70px;

    margin-top: 20px;

    overflow: hidden;

}



.hero-royal::before{

    content: '';

    position: absolute;

    top: 0;

    left: 0;

    right: 0;

    bottom: 0;

    background: linear-gradient(180deg, rgba(0, 0, 0, 0.48) -12.31%, rgba(0, 0, 0, 0.00) 42.08%, rgba(0, 0, 0, 0.80) 100%);

    width: 100%;

    height: 100%;

    z-index: 1;

}



.hero-royal .container{

    position: relative;

    z-index: 2;

}



.hero-sub-heading-royal{

    display: inline-flex;

    align-items: center;

    gap: 12px;

    background-color: var(--dark-divider-color);

    border-radius: 100px;

    backdrop-filter: blur(30px);

    -webkit-backdrop-filter: blur(30px);

    padding: 10px 16px 10px 10px;

    margin-bottom: 20px;

}



.hero-sub-heading-royal .satisfy-client-image figure img{

    max-width: 32px;

}



.satisfy-client-content-royal h3{

    font-size: 14px;

	text-transform: uppercase;

    color: var(--white-color);

}



.hero-content-body-royal{

    display: flex;

    flex-wrap: wrap;

    align-items: center;

    gap: 15px 30px;

}



.video-play-button-royal{

    display: inline-flex;

    align-items: center;

}



.video-play-button-royal a{

    position: relative;

    height: 50px;

    width: 50px;

    background: var(--accent-color);

    border-radius: 50%;

    display: flex;

    justify-content: center;

    align-items: center;

    cursor: none;

}



.video-play-button-royal a i{

    font-size: 18px;

    color: var(--white-color);

    margin-left: 2px;

}



.video-play-button-royal h3{

    font-size: 16px;

    color: var(--white-color);

    margin: 0 0 0 15px;

}



.hero-client-review-box-royal{

    background: var(--dark-divider-color);

    backdrop-filter: blur(30px);

    -webkit-backdrop-filter: blur(30px);

    border-radius: 12px;

    padding: 40px;

    max-width: 480px;

    margin-left: auto;

}



.hero-client-review-box-content-royal{

	margin-top: 40px;

}



.hero-client-review-box-content-royal h2{

    font-size: 40px;

    color: var(--white-color);

}



.hero-client-review-box-content-royal h2 sub{

    font-size: 20px;

    bottom: 0;

}



.hero-client-review-box-content-royal p{

    color: var(--white-color);

    margin: 10px 0 0;

}



.about-us-royal{

    padding: 100px 0;

}



.about-us-image-box-royal{

    display: flex;

    flex-wrap: wrap;

    margin-right: 15px;

}



.about-us-image-box-1-royal{

    width: 67%;

    background-image: url('../images/about-us-bg-image-royal.svg');

    background-repeat: no-repeat;

    background-size: 275px auto;

    background-position: bottom 45px left 40px;

    padding-bottom: 120px;

}



.about-us-image-royal figure{

    display: block;

    border-radius: 12px;

}



.about-us-image-royal figure img{

    width: 100%;

    aspect-ratio: 1 / 1.05;

    object-fit: cover;

    border-radius: 12px;

}



.about-us-image-box-2-royal{

    position: relative;

    width: 33%;

    z-index: 1;

}



.about-us-customer-box-royal{

    background: var(--accent-color);

    border-radius: 12px;

    margin: 0 0 20px 20px;

    padding: 30px;

}



.about-us-customer-content-royal,

.about-us-customer-box-royal .satisfy-client-images{

	margin-bottom: 25px;

}



.about-us-customer-content-royal:last-child{

	margin-bottom: 0;

}



.about-us-customer-content-royal p{

	color: var(--white-color);

	margin: 0;

}



.about-us-customer-content-royal p span{

	font-weight: 700;

}



.about-us-customer-box-royal .satisfy-client-image figure img{

    max-width: 36px;

}



.about-us-customer-box-royal .satisfy-client-image.add-more{

    background: var(--white-color);

    width: 38px;

    height: 38px;

}



.about-us-customer-box-royal .satisfy-client-image.add-more h3{

    font-size: 12px;

    color: var(--accent-color);

}



.about-us-image-box-2-royal .about-us-image-royal{

    margin-left: -120px;

}



.about-us-content-royal{

    height: 100%;

    align-content: center;

}



.about-us-body-royal{

    background: var(--secondary-color);

    border-left: 4px solid var(--accent-color);

    display: flex;

    flex-wrap: wrap;

    align-items: center;

    gap: 30px;

    border-radius: 12px;

    padding: 50px 2.604vw;

}



.about-us-counter-box-royal{

    width: calc(27% - 15px);

}



.about-us-counter-box-royal h2{

    font-size: 60px;

}



.about-us-counter-box-royal p{

    margin: 10px 0 0;

}



.about-us-body-list-royal{

    width: calc(73% - 15px);

    align-items: center;

}



.about-us-body-list-royal ul{

    list-style: none;

    margin: 0;

    padding: 0;

}



.about-us-body-list-royal ul li{

    position: relative;

    line-height: 1.5em;

    padding-left: 25px;

    margin-bottom: 20px;

}



.about-us-body-list-royal ul li:last-child{

    margin-bottom: 0;

}



.about-us-body-list-royal ul li::before{

    content: '\f058';

    position: absolute;

    font-family: 'Font Awesome 7 Free';

    font-size: 18px;

    font-weight: 900;

    color: var(--accent-color);

    top: 0px;

    left: 0;

}



.about-us-footer-royal{

    display: flex;

    flex-wrap: wrap;

    align-items: center;

    gap: 20px 30px;

    margin-top: 40px;

}



.about-us-contact-box-royal{

    display: flex;

    flex-wrap: wrap;

    align-items: center;

    gap: 15px;

}



.about-us-contact-box-royal .icon-box{

    position: relative;

    background: var(--accent-color);

    width: 50px;

    height: 50px;

    display: flex;

    align-items: center;

    justify-content: center;

    border-radius: 50%;

}



.about-us-contact-box-royal .icon-box::before{

    content: '';

	position: absolute;

	top: 0;

	bottom: 0;

	right: 0;

	left: 0;

	background: var(--primary-color);

	border-radius: 50%;

	width: 100%;

	height: 100%;

	transform: scale(0);

	transition: all 0.4s ease-in-out;

	z-index: 0;

}



.about-us-contact-box-royal:hover .icon-box::before{

    transform: scale(1);

}



.about-us-contact-box-royal .icon-box img{

    position: relative;

    width: 100%;

    max-width: 24px;

	transition: all 0.4s ease-in-out;

	z-index: 1;

}



.about-us-conatct-content-royal p{

	margin: 0 0 5px;

}



.about-us-conatct-content-royal h3{

	font-size: 20px;

}



.about-us-conatct-content-royal h3 a{

	color: inherit;

	transition: all 0.4s ease-in-out;

}



.about-us-conatct-content-royal h3 a:hover{

	color: var(--accent-color);

}



.our-services-royal{

    padding: 100px 0;

}



.service-image-box-royal{

    position: relative;

    border-radius: 12px;

    height: 100%;

    overflow: hidden;

}



.service-image-royal{

   position: absolute;

    top: 0;

    right: 0;

    bottom: 0;

    left: 0;

    height: 100%;

    width: 100%;

}



.service-image-royal figure{

    position: relative;

    display: block;

    height: 100%;

}



.service-image-royal figure::before{

    content: '';

    position: absolute;

    top: 0;

    left: 0;

    right: 0;

    bottom: 0;

    background: linear-gradient(0deg, rgba(19, 17, 13, 0.60) 0%, rgba(19, 17, 13, 0.60) 100%);

    width: 100%;

    height: 100%;

}



.service-image-royal figure img{

    width: 100%;

    height: 100%;

    object-fit: cover;

}



.service-image-content-box-royal{

    position: relative;

    height: 100%;

    display: flex;

    flex-direction: column;

    justify-content: space-between;

    gap: 30px;

    padding: 3.125vw;

}



.service-image-content-box-royal .section-title{

	margin: 0;

}



.service-image-content-box-royal .section-title p,

.service-image-content-box-royal .section-title h2{

    color: var(--white-color);

}



.service-counter-item-royal{

    display: flex;

    flex-wrap: wrap;

    gap: 15px;

    align-items: center;

    border-bottom: 1px solid var(--dark-divider-color);

    margin-bottom: 40px;

    padding-bottom: 40px;

}



.service-counter-item-royal:last-child{

    border-bottom: none;

    margin: 0;

    padding: 0;

}



.service-counter-item-royal .icon-box{

    position: relative;

    background: var(--accent-color);

    border-radius: 50%;

    width: 50px;

    height: 50px;

    display: flex;

    align-items: center;

    justify-content: center;

}



.service-counter-item-royal .icon-box::before{

    content: '';

    position: absolute;

    top: 0;

    bottom: 0;

    right: 0;

    left: 0;

    background: var(--white-color);

    border-radius: 50%;

    width: 100%;

    height: 100%;

    transform: scale(0);

    transition: all 0.4s ease-in-out;

    z-index: 0;

}



.service-counter-item-royal:hover .icon-box::before{

    transform: scale(1);

}



.service-counter-item-royal .icon-box img{

	position: relative;

    width: 100%;

    max-width: 24px;

	transition: all 0.4s ease-in-out;

	z-index: 1;

}



.service-counter-item-royal:hover .icon-box img{

	filter: brightness(0) invert(0);

}



.service-counter-item-content-royal{

    width: calc(100% - 65px);

}



.service-counter-item-content-royal h2{

    font-size: 34px;

    color: var(--white-color);

}



.service-counter-item-content-royal p{

	color: var(--white-color);

    margin: 5px 0 0;

}



.services-item-list-royal{

    display: flex;

    flex-wrap: wrap;

    gap: 30px;

}



.service-item-royal{

    width: calc(50% - 15px);

    background: var(--white-color);

    border-radius: 12px;

	display: flex;

	flex-direction: column;

	justify-content: space-between;

	gap: 30px;

	min-height: 360px;

    padding: 50px;

}



.service-item-header-royal{

    display: flex;

    flex-wrap: wrap;

    align-items: center;

    gap: 15px;

}



.service-item-header-royal .icon-box{

    position: relative;

    width: 50px;

    height: 50px;

    background: var(--accent-color);

    border-radius: 50%;

    display: flex;

    align-items: center;

    justify-content: center;

}



.service-item-header-royal .icon-box::before{

    content: '';

    position: absolute;

    top: 0;

    bottom: 0;

    right: 0;

    left: 0;

    background: var(--primary-color);

    border-radius: 50%;

    width: 100%;

    height: 100%;

    transform: scale(0);

    transition: all 0.4s ease-in-out;

    z-index: 0;

}



.service-item-royal:hover .icon-box::before{

	transform: scale(1);

}



.service-item-header-royal .icon-box img{

	position: relative;

    width: 100%;

    max-width: 24px;

	z-index: 1;

}



.service-item-title-royal{

    width: calc(100% - 65px)

}



.service-item-title-royal p{

    font-size: 14px;

    font-weight: 600;

    color: var(--accent-color);

    margin: 0 0 5px;

}



.service-item-title-royal h2{

	font-size: 20px;

}



.service-item-title-royal h2 a{

	color: inherit;

}



.service-item-body-royal{

	border-top: 1px solid var(--divider-color);

    padding-top: 30px;

}



.service-item-content-royal{

	margin-bottom: 30px;

}



.service-item-content-royal p{

	margin-bottom: 0;

}



.our-services-royal .section-footer-text{

    margin-top: 60px;

}



.our-feature-royal{

    padding: 100px 0;

}



.our-feature-content-royal{

    height: 100%;

    align-content: center;

}



.our-feature-item-royal{

    position: relative;

    border-bottom: 1px solid var(--divider-color);

    padding: 0 0 40px 35px;

    margin-bottom: 40px;

}



.our-feature-item-royal:last-child{

    border-bottom: none;

    padding-bottom: 0;

    margin-bottom: 0;

}



.our-feature-item-royal::before{

    content: '\f058';

    position: absolute;

    font-family: 'Font Awesome 7 Free';

    font-size: 22px;

	line-height: normal;

    font-weight: 900;

    color: var(--accent-color);

    top: 0;

    left: 0;

}



.our-feature-item-royal h3{

    font-size: 20px;

}



.our-feature-item-royal p{

    margin: 10px 0 0;

}



.feature-counter-items-list-royal{

    display: flex;

    flex-wrap: wrap;

    gap: 30px;

    margin-top: 40px;

}



.feature-counter-item-royal{

    border: 1px solid var(--divider-color);

    border-radius: 12px;

    width: calc(50% - 15px);

    padding: 30px;

    display: flex;

    flex-wrap: wrap;

    align-items: center;

    gap: 20px;

}



.feature-counter-item-title-royal{

    width: calc(43% - 10px);

}



.feature-counter-item-title-royal h2{

    font-size: 60px;

    color: var(--accent-color);

}



.feature-counter-item-content-royal{

    width: calc(57% - 10px);

}



.feature-counter-item-royal p{

    margin: 0;

}



.our-feature-image-box-royal{

    position: relative;

    padding: 0 70px 0 0;

    margin-left: 3.646vw;

    height: 100%;

}



.our-feature-image-royal.box-1,

.our-feature-image-royal.box-1 figure,

.our-feature-image-royal.box-1 img{

    height: 100%;

}



.our-feature-image-royal figure{

    display: block;

    border-radius: 12px;

}



.our-feature-image-royal figure img{

    width: 100%;

    object-fit: cover;

    border-radius: 12px;

}



.our-feature-image-royal.box-1{

	padding-left: 40px;

}



.our-feature-image-royal.box-1 figure img{

	aspect-ratio: 1 / 1.26;

}



.our-feature-image-royal.box-2{

    position: absolute;

    top: 120px;

    left: 0;

    width: 100%;

    max-width: 210px;

    background: var(--white-color);

    border: 10px solid var(--white-color);

    border-left: none;

    border-radius: 12px 12px 12px 0;

    z-index: 1;

}



.our-feature-image-royal.box-2::before,

.our-feature-image-royal.box-2::after{

	content: '';

	position: absolute;

	left: 40px;

	width: 20px;

    height: 20px;

	mask: url('../images/image-corner-bg-shape.svg');

	-webkit-mask: url('../images/image-corner-bg-shape.svg');

	background-color: var(--white-color);

	mask-repeat: no-repeat;

	mask-size: cover;

	z-index: 1;

}



.our-feature-image-royal.box-2::before{

	bottom: -30px;

}



.our-feature-image-royal.box-2::after{

	top: -30px;

	transform: rotate(270deg);

}



.our-feature-image-royal.box-2 figure img{

    aspect-ratio: 1 / 1.49;

}



.feature-company-timing-royal{

    position: absolute;

    bottom: 40px;

    right: 0;

    background-color: var(--accent-color);

    border-radius: 12px;

    width: 100%;

    max-width: 255px;

    padding: 20px;

    margin: 4px 4px 0 0;

	z-index: 1;

}



.feature-company-timing-royal h3{

    font-size: 20px;

    color: var(--white-color);

    margin: 0 25px 20px 0;

}



.feature-company-timing-royal ul{

    list-style: none;

    margin: 0;

    padding: 0;

}



.feature-company-timing-royal ul li{

    line-height: normal;

    color: var(--white-color);

    margin-bottom: 10px;

    display: flex;

    justify-content: space-between;

	gap: 5px;

}



.feature-company-timing-royal ul li:last-child{

	margin-bottom: 0;

}



.feature-company-timing-royal ul li span{

    width: 54%;

}



.feature-company-timing-royal figure{

    position: absolute;

    top: -8px;

    right: -8px;

    border: 6px solid var(--white-color);

    border-radius: 50%;

    background: var(--white-color);

}



.feature-company-timing-royal img{

	width: 100%;

    max-width: 36px;

}



.why-choose-us-royal{

	background-image: url('../images/why-choose-bg-image-royal.png');

	padding: 100px 0;

}



.why-choose-us-content-royal{

	height: 100%;

	align-content: center;

}



.why-choose-items-list-royal{

	background-color: var(--dark-divider-color);

    backdrop-filter: blur(30px);

    -webkit-backdrop-filter: blur(30px);

    border-radius: 12px;

	display: flex;

	flex-wrap: wrap;

}



.why-choose-item-royal{

    width: 50%;

	padding: 40px;

}



.why-choose-item-royal{

    border-bottom: 1px solid var(--dark-divider-color);

    border-right: 1px solid var(--dark-divider-color);

}



.why-choose-item-royal:nth-of-type(2n + 2){

    border-right: none;

}



.why-choose-item-royal:nth-last-child(2):nth-child(odd),

.why-choose-item-royal:last-child{

    border-bottom: none;

}



.why-choose-item-header-royal{

	display: flex;

	flex-wrap: wrap;

	align-items: center;

	gap: 15px;

}



.why-choose-item-header-royal .icon-box img{

	width: 100%;

	max-width: 40px;

}



.why-choose-item-title-royal{

	width: calc(100% - 55px);

}



.why-choose-item-title-royal h3{

	font-size: 20px;

	color: var(--white-color);

}



.why-choose-item-content-royal{

	margin-top: 25px;

}



.why-choose-item-content-royal p{

	color: var(--white-color);

	margin: 0;

}



.why-choose-footer-royal{

	display: flex;

	flex-wrap: wrap;

	align-items: center;

	gap: 20px 30px;

	margin-top: 40px;

}



.why-choose-footer-royal .about-us-contact-box-royal .icon-box::before{

	background: var(--white-color);

}



.why-choose-footer-royal .about-us-contact-box-royal:hover .icon-box img{

	filter: brightness(0) invert(0);

}



.why-choose-footer-royal .about-us-conatct-content-royal p,

.why-choose-footer-royal .about-us-conatct-content-royal h3{

	color: var(--white-color);

}



.why-choose-us-image-royal{

	height: 100%;

	align-content: end;

	text-align: center;

}



.why-choose-us-image-royal figure{

	display: block;

	border-radius: 12px 12px 0 0;

}



.why-choose-us-image-royal img{

	width: 100%;

	max-width: 635px;

	aspect-ratio: 1 / 1.28;

    object-fit: cover;

	border-radius: 12px 12px 0 0;

	margin-bottom: -100px;

}



.our-projects-royal{

	padding: 100px 0;

}



.project-item-royal{

	position: relative;

	height: calc(100% - 30px);

	margin-bottom: 30px;

}



.project-item-image-royal a,

.project-item-image-royal figure{

	position: relative;

	display: block;

	border-radius: 12px;

	overflow: hidden;

	cursor: none;

}



.project-item-image-royal figure:before{

	content: '';

	position: absolute;

	top: 0;

	right: 0;

	bottom: 0;

	left: 0;

	height: 100%;

	width: 100%;

	background: linear-gradient(180deg, transparent 54.64%, var(--primary-color) 100%);

	z-index: 1;

}



.project-item-image-royal figure img{

	width: 100%;

	aspect-ratio: 1 / 1.171;

	object-fit: cover;

	border-radius: 12px;

	transition: all 0.6s ease-in-out;

}



.project-item-royal:hover .project-item-image-royal figure img{

	transform: scale(1.06);

}



.project-item-body-royal{

	position: absolute;

	right: 40px;

	bottom: 40px;

	left: 40px;

	transform: translateY(40px);

	transition: all 0.4s ease-in-out;

	z-index: 1;

}



.project-item-royal:hover .project-item-body-royal{

	transform: translateY(0);

}



.project-item-content-royal h2{

	font-size: 20px;

	color: var(--white-color);

	margin-bottom: 10px;

}



.project-item-content-royal h2 a{

	color: inherit;

}



.project-item-content-royal p{

	color: var(--white-color);

	margin-bottom: 0;

}



.project-readmore-btn-royal{

	opacity: 0;

	margin-top: 20px;

	visibility: hidden;

	transition: all 0.4s ease-in-out;

}



.project-item-royal:hover .project-readmore-btn-royal{

	visibility: visible;

	opacity: 1;

}



.project-readmore-btn-royal .readmore-btn{

	color: var(--accent-color);

}



.project-readmore-btn-royal .readmore-btn:hover{

	color: var(--white-color);

}



.project-readmore-btn-royal .readmore-btn:before{

	background-image: url('../images/arrow-accent.svg');

}



.project-readmore-btn-royal .readmore-btn:hover:before{

	filter: brightness(0) invert(1);

}



.intro-video-royal{

	padding: 100px 0;

}



.video-cta-box-royal{

	position: relative;

	background-image: url('../images/video-cta-box-bg-image.png');

	border-radius: 12px;

	padding: 20px;

	height: 100%;

	align-content: end;

}



.video-cta-image-royal{

	width: 100%;

	max-width: 500px;

	margin: 0 auto;

}



.video-cta-image-royal figure{

	display: block;

	border-radius: 12px 12px 0 0;

}



.video-cta-image-royal img{

	width: 100%;

	aspect-ratio: 1 / 1.061;

    object-fit: cover;

	border-radius: 12px 12px 0 0;

	margin-bottom: -20px;

}



.working-hour-box-royal{

	position: absolute;

	max-width: 330px;

	background-color: var(--dark-divider-color);

    backdrop-filter: blur(30px);

    -webkit-backdrop-filter: blur(30px);

    border-radius: 12px;

	right: 30px;

	bottom: 30px;

	left: 30px;

	padding: 20px;

}



.working-hour-box-royal h3{

	font-size: 18px;

	color: var(--white-color);

	border-bottom: 1px solid var(--dark-divider-color);

	margin-bottom: 20px;

	padding-bottom: 20px;

}



.working-hour-box-royal ul{

	list-style: none;

	margin: 0;

	padding: 0;

}



.working-hour-box-royal ul li{

	display: flex;

	flex-wrap: wrap;

	gap: 10px;

	color: var(--white-color);

	margin-bottom: 15px;

}



.working-hour-box-royal ul li:last-child{

	margin-bottom: 0;

}



.working-hour-box-royal ul li span{

	width: 56%;

}



.our-video-box-royal{

	position: relative;

	overflow: hidden;

}



.video-box-image-royal figure{

	display: block;

	border-radius: 12px;

}



.video-box-image-royal img{

	width: 100%;

	aspect-ratio: 1 / 0.526;

	object-fit: cover;

	border-radius: 12px;

}



.our-video-box-royal .video-play-button{

	position: absolute;

	right: -12px;

	bottom: -12px;

	border-radius: 50% 50% 0 50%;

    background: var(--secondary-color);

}



.our-video-box-royal .video-play-button a{

	width: 100px;

	height: 100px;

	border: 12px solid var(--secondary-color);

}



.our-video-box-royal .video-play-button a:hover{

	background-color: var(--primary-color);

}



.our-video-box-royal .video-play-button a i{

	font-size: 26px;

}



.our-video-box-royal .video-play-button a:hover i{

	color: var(--white-color);

}



.intro-video-royal .section-footer-text{

	margin-top: 60px;

}



.how-it-work-royal{

	padding: 100px 0;

}



.how-work-item-list-royal{

	display: flex;

	flex-wrap: wrap;

	gap: 30px;

}



.how-work-item-royal{

	width: calc(50% - 15px);

	border: 1px solid var(--divider-color);

	border-radius: 12px;

	padding: 30px;

}



.how-work-item-no-royal{

	height: 40px;

	width: 40px;

	background-color: var(--accent-color);

	border-radius: 50%;

	display: flex;

	align-items: center;

	justify-content: center;

	margin-bottom: 30px;

	transition: all 0.3s ease-in-out;

}



.how-work-item-royal:hover .how-work-item-no-royal{

	background: var(--primary-color);

}



.how-work-item-no-royal h2{

	font-size: 20px;

	color: var(--white-color);

}



.how-work-item-content-royal h3{

	font-size: 20px;

}



.how-work-item-content-royal p{

	margin: 10px 0 0;

}



.how-work-btn-royal{

	margin-top: 40px;

}



.how-work-image-box-royal{

	background-image: url('../images/how-work-image-box-bg-royal.svg');

	background-repeat: no-repeat;

	background-position: bottom right;

	background-size: auto;

	display: flex;

	flex-wrap: wrap;

	align-items: center;

	padding: 0 40px 40px 0;

	margin-left: 15px;

}



.how-work-image-box-1-royal,

.how-work-image-box-2-royal{

	width: 50%;

}



.how-work-image-box-1-royal{

	position: relative;

	z-index: 2;

}



.how-work-image-royal figure{

	display: block;

	border-radius: 12px;

}



.how-work-image-royal img{

	width: 100%;

	object-fit: cover;

	border-radius: 12px;

}



.how-work-image-box-1-royal .how-work-image-royal img{

	aspect-ratio: 1 / 1.286;

}



.how-work-contact-box-royal{

	position: absolute;

	right: 15px;

	bottom: 15px;

	left: 15px;

	display: flex;

	flex-wrap: wrap;

	align-items: center;

	gap: 10px;

	background-color: var(--divider-color);

	border-radius: 12px;

	backdrop-filter: blur(30px);

    -webkit-backdrop-filter: blur(30px);

	padding: 20px;

	z-index: 1;

}



.how-work-contact-box-royal .icon-box{

	position: relative;

	height: 50px;

	width: 50px;

	background-color: var(--accent-color);

	border-radius: 50%;

	display: flex;

	align-items: center;

	justify-content: center;

}



.how-work-contact-box-royal .icon-box:before{

	content: '';

    position: absolute;

    top: 0;

    bottom: 0;

    right: 0;

    left: 0;

    background: var(--primary-color);

    border-radius: 50%;

    width: 100%;

    height: 100%;

    transform: scale(0);

    transition: all 0.4s ease-in-out;

}



.how-work-contact-box-royal:hover .icon-box:before{

	transform: scale(1);

}



.how-work-contact-box-royal .icon-box img{

	position: relative;

	max-width: 24px;

	z-index: 1;

}



.how-work-contact-content-royal{

	width: calc(100% - 60px);

}



.how-work-contact-content-royal p{

	color: var(--white-color);

	margin: 0 0 5px 0;

}



.how-work-contact-content-royal h3{

	color: var(--white-color);

	font-size: 20px;

}



.how-work-contact-content-royal h3 a{

	color: inherit;

	transition: all 0.4s ease-in-out;

}



.how-work-contact-content-royal h3 a:hover{

	color: var(--primary-color);

}



.how-work-image-box-2-royal .how-work-image-royal{

	margin-left: -130px;

}



.how-work-image-box-2-royal .how-work-image-royal img{

	aspect-ratio: 1 / 1.305;

}



.our-team-royal{

	background-image: url('../images/team-bg-shape-royal.png');

	padding: 100px 0;

}



.team-item-royal{

	background-color: var(--dark-divider-color);

	backdrop-filter: blur(30px);

    -webkit-backdrop-filter: blur(30px);

	border-radius: 12px;

	height: calc(100% - 30px);

	margin-bottom: 30px;

	padding: 10px;

}



.team-item-image-royal{

	position: relative;

}



.team-item-image-royal a{

	display: block;

	cursor: none;

	border-radius: 10px;

	overflow: hidden;

}



.team-item-image-royal a figure{

	display: block;

}



.team-item-image-royal a figure img{

	width: 100%;

	aspect-ratio: 1 / 1.05;

	object-fit: cover;

	transition: all 0.6s ease-in-out;

}



.team-item-royal:hover .team-item-image-royal img{

	transform: scale(1.06);

}



.team-social-list-royal{

	position: absolute;

    right: 20px;

    bottom: 20px;

    left: 20px;

	opacity: 0;

    visibility: hidden;

    transform: translateY(20px);

    transition: all 0.4s ease-in-out;

    z-index: 1;

}



.team-item-royal:hover .team-social-list-royal{

    opacity: 1;

    visibility: visible;

	transform: translateY(0);

}



.team-social-list-royal ul{

	display: flex;

	flex-wrap: wrap;

	justify-content: center;

	gap: 15px;

    list-style: none;

    margin: 0;

    padding: 0;

}



.team-social-list-royal ul li a{

	background: var(--accent-color);

	width: 36px;

	height: 36px;

	color: var(--white-color);

	border-radius: 50%;

	display: flex;

	align-items: center;

	justify-content: center;

	cursor: pointer;

	transition: all 0.4s ease-in-out;

}



.team-social-list-royal ul li:hover a{

	background: var(--white-color);

	color: var(--accent-color);

}



.team-social-list-royal ul li a i{

    font-size: 18px;

    color: inherit;

}



.team-item-content-royal{

	text-align: center;

	padding: 30px 10px 20px;

}



.team-item-content-royal h2{

	font-size: 20px;

	color: var(--white-color);

}



.team-item-content-royal h2 a{

	color: inherit;

}



.team-item-content-royal p{

	color: var(--white-color);

	margin: 10px 0 0 0;

}



.our-pricing-royal{

	padding: 100px 0;

}



.pricing-item-royal{

	background-color: var(--secondary-color);

	border-radius: 12px;

	height: calc(100% - 30px);

	margin-bottom: 30px;

	padding: 10px;

}



.pricing-item-title-royal{

	padding: 20px 20px 30px;

}



.pricing-item-title-royal h3{

	font-size: 20px;

}



.pricing-item-content-royal{

	background-color: var(--white-color);

	border-radius: 12px;

	padding: 30px 20px;

}



.pricing-item-header-content-royal,

.pricing-item-list-royal{

	padding: 0 10px;

}



.pricing-item-header-content-royal{

	margin-bottom: 30px;

}



.pricing-item-header-content-royal p{

	margin: 0;

}



.pricing-item-body-royal{

	background-color: var(--secondary-color);

	border-radius: 12px;

	padding: 30px;

}



.pricing-item-price-royal h2{

	font-size: 44px;

}



.pricing-item-price-royal h2 sub{

	color: var(--text-color);

	font-size: 16px;

	font-weight: 400;

	bottom: 0;

}



.pricing-item-btn-royal{

	margin-top: 20px;

}



.pricing-item-list-royal{

	margin-top: 30px;

}



.pricing-item-list-royal h3{

	font-size: 20px;

	margin-bottom: 30px;

}



.pricing-item-list-royal ul{

	list-style: none;

	margin: 0;

	padding: 0;

}



.pricing-item-list-royal ul li{

	position: relative;

	line-height: 1.5em;

	padding-left: 25px;

	margin-bottom: 15px;

}



.pricing-item-list-royal ul li:last-child{

	margin-bottom: 0;

}



.pricing-item-list-royal ul li::before{

	content: '\f058';

    position: absolute;

    font-family: 'Font Awesome 7 Free';

    font-size: 18px;

    font-weight: 900;

    color: var(--accent-color);

    top: 0;

    left: 0;

}



.pricing-item-royal.highlighted-box{

	background-color: var(--accent-color);

}



.pricing-item-royal.highlighted-box .pricing-item-title-royal h3{

	color: var(--white-color);

}



.pricing-benefit-list-royal{

	margin-top: 30px;

}



.pricing-benefit-list-royal ul{

	display: flex;

	flex-wrap: wrap;

    justify-content: center;

	list-style: none;

	margin: 0;

	padding: 0;

	gap: 20px 40px;

}



.pricing-benefit-list-royal ul li{

    display: inline-flex;

    align-items: center;

}



.pricing-benefit-list-royal ul li img{

	width: 100%;

	max-width: 20px;

	margin-right: 10px;

}



.our-testimonials-royal{

	position: relative;

	background-image: url('../images/testimonial-bg-royal.jpg');

	padding: 100px 0;

}



.our-testimonials-royal:before{

	content: '';

	position: absolute;

	top: 0;

	right: 0;

	bottom: 0;

	left: 0;

	height: 100%;

	width: 100%;

	background: linear-gradient(270deg, transparent 0%, rgba(19, 17, 13, 0.80) 85.29%);

	border-radius: 12px;

}



.our-testimonials-royal .container{

	position: relative;

	z-index: 1;

}



.testimonials-content-royal{

	position: sticky;

	top: 30px;

}



.testimonials-content-royal{

	margin-right: 2.604vw;

}



.testimonials-review-box-royal{

	max-width: 345px;

	background-color: var(--dark-divider-color);

	border-radius: 12px;

    backdrop-filter: blur(30px);

    -webkit-backdrop-filter: blur(30px);

	margin-top: 120px;

	padding: 40px;

}



.testimonials-review-header-royal{

	display: flex;

	flex-wrap: wrap;

	align-items: center;

	gap: 15px;

}



.testimonials-review-counter-royal{

	width: 88px;

}



.testimonials-review-counter-royal h2{

	color: var(--white-color);

	font-size: 60px;

	line-height: 1em;

}



.testimonials-review-content-royal p{

	color: var(--white-color);

	margin: 5px 0 0 0;

}



.testimonials-review-content-royal span i{

	font-size: 14px;

	color: var(--accent-color);

}



.testimonials-review-btn-royal{

	border-top: 1px solid var(--dark-divider-color);

	margin-top: 30px;

	padding-top: 30px;

}



.testimonial-slider-royal{

	background-color: var(--white-color);

	background-image: url('../images/testimonial-item-bg-royal.svg');

	background-repeat: no-repeat;

	background-position: bottom -30px left -30px;

	background-size: auto;

	border-radius: 12px;

	padding: 3.125vw;

}



.testimonial-slider-royal .swiper-wrapper{

	cursor: none;

}



.testimonial-item-royal{

	display: flex;

	flex-direction: column;

	gap: 60px;

	justify-content: space-between;

	min-height: 530px;

}



.testimonial-item-rating-royal{

	margin-bottom: 30px;

}



.testimonial-item-rating-royal i{

	font-size: 20px;

	color: var(--accent-color);

}



.testimonial-item-content-royal p{

	font-size: 22px;

	font-weight: 600;

	line-height: 1.4em;

	color: var(--primary-color);

	margin-bottom: 0;

}



.testimonial-item-author-royal{

	display: flex;

	flex-wrap: wrap;

	align-items: center;

	gap: 15px;

	border-top: 1px solid var(--divider-color);

	padding-top: 60px;

}



.testimonial-author-image-royal figure{

	display: block;

	border-radius: 50%;

}



.testimonial-author-image-royal img{

	width: 100%;

	max-width: 50px;

	border-radius: 50%;

}



.testimonial-author-content-royal{

	width: calc(100% - 65px);

	text-align: left;

}



.testimonial-author-content-royal h3{

	font-size: 20px;

}



.testimonial-author-content-royal p{

	margin: 5px 0 0;

}



.testimonial-btn-royal{

	position: absolute;

	bottom: 0;

	right: 0;

	display: flex;

	align-items: center;

	justify-content: right;

	z-index: 2;

}



.testimonial-slider-royal .testimonial-button-next-royal,

.testimonial-slider-royal .testimonial-button-prev-royal{

	position: relative;

	width: 50px;

	height: 50px;

	background-color: var(--secondary-color);

	border-radius: 50%;

	transition: all 0.4s ease-in-out;

}



.testimonial-slider-royal .testimonial-button-next-royal{

	margin-left: 20px;

}



.testimonial-slider-royal .testimonial-button-next-royal:hover,

.testimonial-slider-royal .testimonial-button-prev-royal:hover{

	background: var(--accent-color);

}



.testimonial-slider-royal .testimonial-button-next-royal::before,

.testimonial-slider-royal .testimonial-button-prev-royal::before{

	content: '';

	position: absolute;

	top: 0;

	bottom: 0;

	left: 0;

	right: 0;

	background-image: url('../images/arrow-accent.svg');

	background-repeat: no-repeat;

	background-position: center center;

	background-size: 20px auto;

	transform: rotate(180deg);

	transition: all 0.4s ease-in-out;

}



.testimonial-slider-royal .testimonial-button-next-royal::before{

	transform: rotate(0deg);

}



.testimonial-slider-royal .testimonial-button-next-royal:hover::before,

.testimonial-slider-royal .testimonial-button-prev-royal:hover::before{

	filter: brightness(0) invert(1);

}

.testimonial-rating svg {

	width: 20px;

	color: #ff6527;

}

/*.section-footer-text ul li:nth-child(2) {

	display: flex;

	justify-content: flex-end;

	align-items: center;

}*/

.section-footer-text ul li:nth-child(2) svg {

	width: 20px;

	color: #ff6527;

}



































.main-footer-royal{

	background-image: url('../images/footer-bg-shape-royal.png');

	padding: 100px 0 0;

	margin-bottom: 20px;

}



.about-footer-royal{

	background: var(--dark-divider-color);

    backdrop-filter: blur(30px);

    -webkit-backdrop-filter: blur(30px);

    border-radius: 12px;

	display: flex;

	flex-direction: column;

	justify-content: space-between;

	gap: 40px;

	padding: 2.604vw;

	min-height: 480px;

}



.footer-logo-royal img{

	width: 100%;

	max-width: 166px;

}



.about-footer-content-royal{

	margin-top: 30px;

}



.about-footer-content-royal p{

	color: var(--white-color);

	margin: 0;

}



.footer-social-links-royal{

	display: flex;

	flex-wrap: wrap;

	align-items: center;

	gap: 15px;

	border-top: 1px solid var(--dark-divider-color);

	padding-top: 40px;

}



.footer-social-links-royal p{

	color: var(--white-color);

	margin: 0;

}



.footer-social-links-royal ul{

	display: flex;

	flex-wrap: wrap;

	gap: 10px;

	list-style: none;

	margin: 0;

	padding: 0;	

}



.footer-social-links-royal ul li a{

    display: flex;

    justify-content: center;

    align-items: center;

    width: 40px;

    height: 40px;

    border: 1px solid var(--dark-divider-color);

    color: var(--white-color);

    border-radius: 50%;

    transition: all 0.3s ease-in-out;

}



.footer-social-links-royal ul li a:hover{

	background: var(--accent-color);

}



.footer-social-links-royal ul li i{

    font-size: 18px;

    color: inherit;

    transition: all 0.3s ease-in-out;

}



.footer-links-box-royal{

	display: flex;

	flex-wrap: wrap;

	justify-content: space-between;

	gap: 60px 30px;

	margin-left: 4.167vw;

}



.footer-links-royal{

	max-width: 34%;

}



.footer-links-royal h3{

	font-size: 20px;

	color: var(--white-color);

	margin-bottom: 30px;

}



.footer-links-royal ul{

	list-style: none;

	margin: 0;

	padding: 0;

}



.footer-links-royal ul li{

	line-height: 1.5em;

	color: var(--white-color);

	margin-bottom: 15px;

}



.footer-links-royal ul li:last-child{

	margin-bottom: 0;

}



.footer-links-royal ul li a{

	color: inherit;

	transition: all 0.4s ease-in-out;

}



.footer-links-royal ul li a:hover{

	color: var(--accent-color);

}



.footer-newsletter-form-royal{

	max-width: 42%;

}



.footer-newsletter-form-royal .form-group{

	display: flex;

	flex-wrap: wrap;

	background: var(--dark-divider-color);

	backdrop-filter: blur(30px);

	-webkit-backdrop-filter: blur(30px);

	border-radius: 12px;

	padding: 5px;

}



.footer-newsletter-form-royal .form-group .form-control{

	width: calc(100% - 40px);

	font-size: 16px;

	font-weight: 400;

	line-height: 1.5em;

	color: var(--white-color);

	background: transparent;

	border: none;

	border-radius: 0;

	outline: none;

	box-shadow: none;

	padding: 6px 14px;

}



.footer-newsletter-form-royal .form-group .form-control::placeholder{

	color: var(--white-color);

}



.footer-newsletter-form-royal .form-group .newsletter-btn-royal{

	width: 40px;

	height: 40px;

	display: flex;

	justify-content: center;

	align-items: center;

	background-color: var(--accent-color);

	border: none;

	border-radius: 5px;

	outline: none;

	box-shadow: none;

	transition: all 0.3s ease-in-out;

}



.footer-newsletter-form-royal .form-group .newsletter-btn-royal:hover{

	background-color: var(--white-color);

}



.footer-newsletter-form-royal .form-group .newsletter-btn-royal img{

	width: 100%;

	max-width: 18px;

	transition: all 0.4s ease-in-out;

}



.footer-newsletter-form-royal .form-group .newsletter-btn-royal:hover img{

	filter: brightness(0) invert(0);

}



.footer-newsletter-form-royal p{

	color: var(--white-color);

	margin: 20px 0 0;

}



.footer-contact-list-royal{

	width: 100%;

	background: var(--dark-divider-color);

    backdrop-filter: blur(30px);

    -webkit-backdrop-filter: blur(30px);

    border-radius: 12px;

    padding: 30px;

    display: flex;

	flex-wrap: wrap;

    gap: 30px 4.167vw;

}



.footer-contact-item-royal{

	position: relative;

}



.footer-contact-item-royal::before{

	content: '';

    position: absolute;

    top: 0;

    bottom: 0;

    right: -2.083vw;

    background: var(--dark-divider-color);

    width: 1px;

    height: 100%;

}

 

.footer-contact-item-royal:last-child::before{

	display: none;

}



.footer-contact-item-royal p{

	color: var(--white-color);

	margin: 0 0 10px;

}



.footer-contact-item-royal h3{

	font-size: 20px;

	color: var(--white-color);

    display: flex;

    align-items: center;

	gap: 5px;

    margin: 0;

}



.footer-contact-item-royal h3 i{

	font-size: 18px;

	color: var(--accent-color);

}



.footer-contact-item-royal h3 a{

	color: inherit;

	transition: all 0.4s ease-in-out;

}



.footer-contact-item-royal h3 a:hover{

	color: var(--accent-color);

}



.footer-copyright-text-royal{

	text-align: center;

	padding: 60px 0;

	margin-top: 60px;

	border-top: 1px solid var(--dark-divider-color);

}



.footer-copyright-text-royal p{

	color: var(--white-color);

	margin: 0;

}



@media only screen and (max-width: 1440px){



	.hero-sub-heading-royal .satisfy-client-image figure img{

		max-width: 28px;

	}



    .about-us-customer-box-royal{

        padding: 20px;

		margin: 0 0 15px 15px;

    }



    .about-us-body-royal{

        padding: 30px 25px;

        gap: 20px;

    }



    .about-us-counter-box-royal{

        width: calc(30% - 10px);

    }



    .about-us-body-list-royal{

        width: calc(70% - 10px);

    }



	.about-us-body-list-royal ul li{

		margin-bottom: 15px;

	}



    .service-item-royal{

		min-height: 330px;

        padding: 30px;

    }



	.feature-counter-items-list-royal{

        gap: 20px;

    }



    .feature-counter-item-royal{

        width: calc(50% - 10px);

        gap: 10px;

        padding: 20px;

    }



    .feature-counter-item-title-royal{

        width: calc(40% - 5px);

    }



    .feature-counter-item-title-royal h2{

        font-size: 44px;

    }



    .feature-counter-item-content-royal{

        width: calc(60% - 5px);

    }



	.why-choose-item-royal{

		padding: 30px;

	}



	.project-item-body-royal{

		right: 30px;

		bottom: 30px;

		left: 30px;

	}



	.how-work-contact-box-royal{

		padding: 15px;

	}

	

	.team-item-content-royal{

		padding: 20px 10px 10px;

	}



	.pricing-item-title-royal{

		padding: 10px 10px 20px;

	}



	.pricing-item-content-royal{

		padding: 20px;

	}



	.pricing-item-header-content-royal,

	.pricing-item-list-royal{

		padding: 0;

	}



	.pricing-item-body-royal{

		padding: 20px;

	}



	.testimonials-review-box-royal{

		padding: 30px;

		margin-top: 0px;

	}



	.testimonial-item-royal{

		gap: 40px;

		min-height: 430px;

	}



	.testimonial-item-content-royal p{

		font-size: 20px;

	}



	.testimonial-item-author-royal{

		padding-top: 40px;

	}



	.about-footer-royal{

		gap: 30px;

	}



	.footer-social-links-royal{

		padding-top: 30px;

		gap: 10px;

	}



	.footer-links-box-royal{

		margin-left: 30px;

	}

}



@media only screen and (max-width: 1024px){



	.hero-royal::before{

		background: var(--primary-color);

		opacity: 50%;

	}



	.hero-content-royal{

		margin-bottom: 30px;

	}



	.hero-sub-heading-royal{

		margin-bottom: 15px;

	}



	.hero-client-review-box-royal{

		margin: 0 0 auto 0;

		padding: 30px;

	}



	.hero-client-review-box-content-royal{

        margin-top: 30px;

    }



	.about-us-image-box-royal{

        max-width: 700px;

        margin: 0 auto 30px;

    }



	.service-image-box-royal{ 

        margin-bottom: 30px;

        height: auto;

    }

    

    .service-image-content-box-royal{

        height: auto;

    }



    .service-counter-item-royal{

        margin-bottom: 20px;

        padding-bottom: 20px;

    }



	.our-feature-content-royal{

        height: auto;

        margin-bottom: 30px;

    }



    .our-feature-item-royal{

        padding: 0 0 20px 30px;

        margin-bottom: 20px;

    }



    .our-feature-item-royal::before{

        font-size: 18px;

		top: 2px;

    }



    .feature-counter-items-list-royal{

        margin-top: 30px;

    }



    .our-feature-image-box-royal{

        max-width: 620px;

        height: auto;

        margin: 0 auto;

    }



	.why-choose-us-content-royal{

		height: auto;

		margin-bottom: 30px;

	}



	.why-choose-footer-royal{

		margin-top: 30px;

	}



	.why-choose-us-image-royal{

		height: auto;

	}



	.why-choose-us-image-royal img{

		max-width: 550px;

	}



	.video-cta-box-royal{

		height: auto;

		margin-bottom: 30px;

	}



	.working-hour-box-royal{

		right: 20px;

    	bottom: 20px;

    	left: 20px;

		margin: 0 auto;

	}



	.how-it-work-content-royal{

		margin-bottom: 30px;

	}



	.how-work-btn-royal{

		margin-top: 30px;

	}



	.how-work-image-box-royal{

		max-width: 700px;

		margin: 0 auto;

	}



	.testimonial-slider-royal{

		background-size: 200px auto;

	}



	.testimonials-content-royal{

		position: initial;

		margin: 0 0 30px;

	}



	.testimonial-item-royal{

        min-height: 330px;

    }



	.about-footer-royal{

		min-height: auto;

		margin-bottom: 30px;

	}



	.about-footer-content-royal{

		margin-top: 15px;

	}



	.footer-links-box-royal{

		margin-left: 0;

	}

}



@media only screen and (max-width: 991px){



    .hero-royal{

		min-height: initial;

        padding: 140px 0 50px;

        margin-top: 0;

    }



    .hero-sub-heading-royal{

		gap: 8px;

        padding: 6px 16px 6px 6px;

    }



    .hero-client-review-box-content-royal h2{

        font-size: 34px;

    }



	.about-us-royal{

        padding: 50px 0;

    }



    .about-us-counter-box-royal h2{

        font-size: 44px;

    }



	.about-us-body-list-royal ul li{

		margin-bottom: 10px;

	}



	.about-us-body-list-royal ul li::before{

		font-size: 16px;

	}



    .about-us-footer-royal{

        margin-top: 30px;

    }



	.our-services-royal{

        padding: 50px 0;

    }

    

    .service-counter-item-content-royal h2{

        font-size: 28px;

    }



    .service-item-royal{

		min-height: initial;

        padding: 20px;

    }



	.service-item-header-royal{

		gap: 10px;

    }



    .service-item-title-royal{

        width: calc(100% - 60px);

    }



    .our-services-royal .section-footer-text{

        margin-top: 40px;

    }



	.our-feature-royal{

        padding: 50px 0;

    }



	.feature-counter-item-content-royal,

	.feature-counter-item-title-royal{

		width: 100%;

	}



	.why-choose-us-royal{

		padding: 50px 0;

	}



	.why-choose-item-content-royal{

		margin-top: 15px;

	}



	.why-choose-us-image-royal img{

		margin-bottom: -50px;

	}



	.our-projects-royal{

		padding: 50px 0;

	}



	.project-item-body-royal{

        right: 20px;

        bottom: 20px;

        left: 20px;

    }



	.intro-video-royal{

		padding: 50px 0;

	}



	.our-video-box-royal .video-play-button{

		right: -7px;

		bottom: -7px;

	}



	.our-video-box-royal .video-play-button a{

		width: 80px;

		height: 80px;

		border-width: 7px;

	}



	.our-video-box-royal .video-play-button a i{

		font-size: 22px;

	}



	.intro-video-royal .section-footer-text{

		margin-top: 40px;

	}



	.how-it-work-royal{

		padding: 50px 0;

	}



	.how-work-item-royal{

		padding: 20px;

	}



	.how-work-item-no-royal{

		margin-bottom: 20px;

	}



	.how-work-btn-royal{

		margin-top: 30px;

	}



	.our-team-royal{

		padding: 50px 0;

	}



	.our-pricing-royal{

		padding: 50px 0;

	}



	.pricing-item-content-royal{

        padding: 15px 10px;

    }



	.pricing-item-header-content-royal{

		margin-bottom: 20px;

	}



	.pricing-item-body-royal{

		padding: 20px 15px;

	}



	.pricing-item-price-royal h2{

		font-size: 36px;

	}

	

	.pricing-item-list-royal{

		margin-top: 20px;

	}



	.pricing-item-list-royal h3{

		margin-bottom: 20px;

	}



	.pricing-item-list-royal ul li::before{

		font-size: 16px;

	}



	.pricing-benefit-list-royal{

		margin-top: 10px;

	}



	.pricing-benefit-list-royal ul{

		gap: 15px 30px;

	}



	.our-testimonials-royal{

		padding: 50px 0;

	}



	.testimonials-review-box-royal{

		max-width: 300px;

		padding: 20px;

	}



	.testimonials-review-counter-royal{

		width: 65px;

	}



	.testimonials-review-counter-royal h2{

		font-size: 44px;

	}



	.testimonials-review-btn-royal{

		margin-top: 20px;

		padding-top: 20px;

	}



	.testimonial-item-royal{

        gap: 30px;

    }

	

	.testimonial-item-rating-royal{

		margin-bottom: 20px;

	}



	.testimonial-item-rating-royal i,

	.testimonial-item-content-royal p{

        font-size: 18px;

    }



	.testimonial-item-author-royal{

        padding-top: 30px;

    }



	.main-footer-royal{

		padding: 50px 0 0;	

		margin-bottom: 0;

	}



	.about-footer-royal{

		padding: 20px;

		gap: 20px;

	}



	.footer-social-links-royal{

		padding-top: 20px;

	}



	.footer-links-box-royal{

		gap: 30px;

	}



	.footer-links-royal h3{

        margin-bottom: 20px;

    }



	.footer-links-royal ul li{

		margin-bottom: 10px;

	}



	.footer-contact-list-royal{

		padding: 20px;

	}



	.footer-copyright-text-royal{

		padding: 30px 0;

		margin-top: 30px;

	}

}



@media only screen and (max-width: 767px){



	.hero-content-body-royal{

		gap: 15px;

	}



	.hero-content-body-royal .video-play-button-royal a{

		width: 44px;

		height: 44px;

	}

	

	.hero-content-body-royal .video-play-button-royal a i{

		font-size: 16px;

	}



	.video-play-button-royal h3{

		margin-left: 10px;

	}



    .hero-client-review-box-royal{

        padding: 20px;

    }



    .hero-client-review-box-content-royal{

        margin-top: 20px;

    }



    .hero-client-review-box-content-royal h2{

        font-size: 28px;

    }



    .hero-client-review-box-content-royal h2 sub{

        font-size: 18px;

    }



    .hero-client-review-box-content-royal p{

        margin: 5px 0 0;

    } 



	.about-us-image-box-royal{

        gap: 20px;

    }



    .about-us-image-box-1-royal{

        background: transparent;

        width: 100%;

        padding: 0;

    }



	 .about-us-image-box-2-royal{

		width: 100%;

	}



	.about-us-image-royal figure img{

		aspect-ratio: 1 / 1.05;

	}



	.about-us-image-box-2-royal .about-us-image-royal{

		margin-left: 0;

    }

	

    .about-us-customer-box-royal{

		margin: 0 0 20px 0;

    }



	.about-us-customer-content-royal,

	.about-us-customer-box-royal .satisfy-client-images{

		margin-bottom: 15px;

	}



	.about-us-counter-box-royal,

	.about-us-body-list-royal{

		width: 100%;

	}



    .about-us-body-royal{

        padding: 15px;

    }



    .about-us-counter-box-royal h2{

        font-size: 28px;

    }



    .about-us-counter-box-royal p{

        margin: 5px 0 0;

    }



	.about-us-footer-royal{

		gap: 20px;

	}



	.about-us-contact-box-royal{

		gap: 10px;

	}



    .about-us-contact-box-royal .icon-box{

        width: 44px;

        height: 44px;

    }



    .about-us-contact-box-royal .icon-box img{

        max-width: 22px;

    }



    .about-us-conatct-content-royal h3{

        font-size: 18px;

    }



	.service-image-content-box-royal{

        padding: 20px;

    }

	

    .service-counter-item-content-royal h2{

		font-size: 22px;

    }

	

    .service-item-royal{

        width: 100%;

    }



    .service-item-title-royal h2{

        font-size: 18px;

    }



	.service-item-body-royal{

		padding-top: 20px;

	}



	.our-feature-item-royal h3{

		font-size: 18px;

	}



	.feature-counter-item-royal{

		padding: 15px;

		width: 100%;

	}



	.feature-counter-item-title-royal h2{

		font-size: 28px;

	}



    .our-feature-image-box-royal{

        padding: 0px;

    }



	.our-feature-image-royal.box-1{

		padding-left: 30px;

	}



    .our-feature-image-royal.box-2{

        max-width: 140px;

        top: 35px;

        border-width: 5px;

    }

	

    .our-feature-image-royal.box-2::before{

		left: 30px;

		bottom: -25px

    }

	

    .our-feature-image-royal.box-2::after{

		top: -25px;

		left: 30px;

    }



	.our-feature-image-royal.box-2 figure img{

		aspect-ratio: 1 / 1.09;

	}



    .feature-company-timing-royal{

        position: relative;

		bottom: 0;

        max-width: 100%;

		margin-top: 20px;

    }



    .feature-company-timing-royal h3{

        font-size: 18px;

        margin-bottom: 15px;

    }



    .feature-company-timing-royal img{

        max-width: 30px;

    }



	.why-choose-item-royal{

		width: 100%;

		border-right: none;

		padding: 20px;

	}



	.why-choose-item-royal:nth-last-child(2):nth-child(odd){

		border-bottom: 1px solid var(--dark-divider-color);

	}



	.why-choose-item-title-royal h3{

		font-size: 18px;

	}



	.project-item-content-royal h2{

		font-size: 18px;

	}



	.working-hour-box-royal{

		position: initial;

		margin-bottom: 20px;

	}



	.video-box-image-royal img{

		aspect-ratio: 1 / 0.68;

	}



	.how-work-item-list-royal{

		gap: 20px;

	}



	.how-work-item-royal{

		width: 100%;

	}



	.how-work-item-no-royal h2,

	.how-work-item-content-royal h3{

		font-size: 18px;

	}



	.how-work-image-box-royal{

		background: transparent;

		padding: 0px;

		gap: 20px;

	}



	.how-work-image-box-2-royal,

	.how-work-image-box-1-royal{

		width: 100%;

	}



	.how-work-image-box-1-royal .how-work-image-royal img{

		aspect-ratio: 1 / 1.186;

	}



	.how-work-image-box-2-royal .how-work-image-royal{

		margin-left: 0;

	}



	.how-work-image-box-2-royal .how-work-image-royal img{

		aspect-ratio: 1 / 1.305;

	}



	.how-work-contact-box-royal{

		right: 10px;

		bottom: 10px;

		left: 10px;

		padding: 10px;

	}



	.how-work-contact-content-royal h3{

		font-size: 18px;

	}



	.team-item-content-royal p{

		margin-top: 5px;

	}



	.pricing-item-title-royal h3{

		font-size: 18px;

	}



	.pricing-item-price-royal h2{

        font-size: 26px;

    }



	.pricing-item-price-royal h2 sub{

        font-size: 14px;

    }



	.pricing-item-list-royal h3{

		font-size: 18px;

		margin-bottom: 15px;

	}



	.pricing-item-list-royal ul li{

        margin-bottom: 10px;

    }



	.pricing-benefit-list-royal ul{

		gap: 10px 20px;

	}



	.pricing-benefit-list-royal ul li{

		font-size: 14px;

	}



	.pricing-benefit-list-royal ul li img{

		max-width: 16px;

		margin-right: 5px;

	}



	.testimonials-review-box-royal{

		max-width: 100%;

		padding: 20px;

	}



	.testimonials-review-counter-royal{

		width: 100%;

	}



	.testimonials-review-counter-royal h2{

        font-size: 28px;

    }



	.testimonial-slider-royal{

		background-size: 150px auto;

		background-position: bottom -15px left -15px;

		padding: 20px;

	}



	.testimonial-item-royal{

		gap: 20px;

	}



	.testimonial-item-rating-royal{

		margin-bottom: 15px;

	}



	.testimonial-item-rating-royal i,

	.testimonial-item-content-royal p{

		font-size: 16px;

	}



	.testimonial-author-content-royal h3{

		font-size: 18px;

	}



	.testimonial-item-author-royal{

		padding-top: 20px;

	}



	.testimonial-btn-royal{

		position: initial;

		margin-top: 20px;

		justify-content: center;

	}



	.testimonial-slider-royal .testimonial-button-next-royal,

	.testimonial-slider-royal .testimonial-button-prev-royal{

		height: 44px;

		width: 44px;

	}



	.testimonial-slider-royal .testimonial-button-next-royal::before,

	.testimonial-slider-royal .testimonial-button-prev-royal::before{

		background-size: 18px auto;

	}



	.testimonial-slider-royal .testimonial-button-next-royal{

		margin-left: 15px;

	}



	.about-footer-royal{

		padding: 20px;

	}



	.footer-links-royal,

	.footer-newsletter-form-royal{

		max-width: 100%;

	}



	.footer-links-royal h3{

		font-size: 18px;

		margin-bottom: 15px;

	}



	.footer-newsletter-form-royal p{

		margin-top: 15px;

	}



	.footer-contact-item-royal{

		width: 100%;

		max-width: 100%;

	}



	.footer-contact-item-royal::before{

		top: auto;

		right: 0;

		bottom: -15px;

		left: 0;

		height: 1px;

		width: 100%;

	}



	.footer-contact-item-royal h3{

		font-size: 18px;

	}



	.footer-copyright-text-royal{

		padding: 15px 0;

	}

}