/*!
Theme Name: Quality Painting
Theme URI: https://digitalboostia.com/
Author: Digital Boost
Author URI: https://digitalboostia.com/
Description: Description
Version: 1.0.0
License: GNU General Public License v2 or later
License URI: LICENSE
Text Domain: qualitypaintingia
Tags: custom-background, custom-logo, custom-menu, featured-images, threaded-comments, translation-ready
*/
/*--------------------------------------------------------------
    # Typography
--------------------------------------------------------------*/

body,
button,
input,
select,
optgroup,
textarea,
p {
	color: var(--common-color);
	font-size: 16px;
	line-height: 26px;
}

/*--------------------------------------------------------------
## Menus
--------------------------------------------------------------*/

.main-navigation {
	clear: both;
	display: inline-block;
	float: none;
	width: auto;
}

.main-navigation ul {
	list-style: none;
	margin: 0;
	padding-left: 0;
}

.main-navigation ul ul li:hover>ul,
.main-navigation ul ul li.focus>ul {
	left: 100%;
}

.main-navigation ul li:hover>ul,
.main-navigation ul li.focus>ul {
	left: auto;
}

.main-navigation li {
	float: none;
	display: inline-block;
	position: relative;
}

.main-navigation li a {
	transition: var(--transition);
	position: relative;
}

@media screen and (min-width: 992px) {
	.main-navigation ul li.menu-item-has-children {
		padding-right: 20px;
		position: relative;
	}

	.main-navigation ul ul li.menu-item-has-children {
		padding-right: 0;
	}

	.main-navigation ul li.menu-item-has-children:hover::after {
		color: var(--primary-color);
		transform: translate(0, -50%) rotate(-180deg);
	}

	.main-navigation li.current-menu-ancestor ul li.current_page_item>a,
	.main-navigation ul ul li:hover>a {
		background: var(--secondary-color);
		color: var(--white-color);
	}

	.main-navigation li.current-menu-ancestor.menu-item-has-children:not(.sub-menu li.current-menu-ancestor.menu-item-has-children)::after {
		color: var(--primary-color);
	}

	.main-navigation ul ul li.current-menu-ancestor::after {
		color: var(--white-color);
	}

	/***** If Dropdown Menu CSS Avaliable Than Remove This CSS Start *****/
	.main-navigation ul li.menu-item-has-children:hover>ul.sub-menu:not(.dropdown-menu-wp ul .sub-menu) {
		display: block;
		top: 100%;
		left: 0;
		opacity: 1;
		animation: swip_up var(--transition) linear 1;
	}

	/***** If Dropdown Menu CSS Avaliable Than Remove This CSS End *****/
	.main-navigation ul .sub-menu:not(.dropdown-menu-wp ul .sub-menu) {
		position: absolute;
		top: 100%;
		left: -999em;
		float: none;
		width: 260px;
		background: var(--white-color);
		box-shadow: 0 0 10px rgba(60, 140, 244, 0.15);
		text-align: left;
		padding-left: 0;
		display: none;
		opacity: 0;
	}

	.main-navigation ul li.menu-item-has-children:hover .dropdown-menu-wp {
		display: block;
		opacity: 1;
	}

	.main-navigation .dropdown-menu-wp ul li.menu-item-has-children {
		padding-block: 4px;
	}

	.main-navigation ul ul li.menu-item-has-children:hover>ul.sub-menu:not(.dropdown-menu-wp ul .sub-menu) {
		top: 0;
		left: 100%;
	}

	.main-navigation ul ul li.menu-item-has-children:hover>ul.sub-menu:not(.dropdown-menu-wp ul .sub-menu) {
		top: 0;
		left: 100%;
		animation: unset;
	}

	.main-navigation ul ul li.menu-item-has-children:hover::after,
	.main-navigation ul ul li.menu-item-has-children::after {
		transform: translate(0, -50%) rotate(-90deg);
	}
}

/*========== Fonts CSS Start ==========*/

/*========== Poppins Font CSS Start==========*/
@font-face {
	font-family: 'Poppins';
	src: url('assets/fonts/Poppins-Regular.woff2') format('woff2'),
		url('assets/fonts/Poppins-Regular.woff') format('woff');
	font-weight: normal;
	font-style: normal;
	font-display: swap;
}

@font-face {
	font-family: 'Poppins';
	src: url('assets/fonts/Poppins-Medium.woff2') format('woff2'),
		url('assets/fonts/Poppins-Medium.woff') format('woff');
	font-weight: 500;
	font-style: normal;
	font-display: swap;
}

@font-face {
	font-family: 'Poppins';
	src: url('assets/fonts/Poppins-SemiBold.woff2') format('woff2'),
		url('assets/fonts/Poppins-SemiBold.woff') format('woff');
	font-weight: 600;
	font-style: normal;
	font-display: swap;
}

@font-face {
	font-family: 'Poppins';
	src: url('assets/fonts/Poppins-Bold.woff2') format('woff2'),
		url('assets/fonts/Poppins-Bold.woff') format('woff');
	font-weight: bold;
	font-style: normal;
	font-display: swap;
}

@font-face {
	font-family: 'Poppins';
	src: url('assets/fonts/Poppins-ExtraBold.woff2') format('woff2'),
		url('assets/fonts/Poppins-ExtraBold.woff') format('woff');
	font-weight: bold;
	font-style: normal;
	font-display: swap;
}

@font-face {
	font-family: 'Poppins';
	src: url('assets/fonts/Poppins-Black.woff2') format('woff2'),
		url('assets/fonts/Poppins-Black.woff') format('woff');
	font-weight: 900;
	font-style: normal;
	font-display: swap;
}

/*========== Poppins Font CSS End ==========*/

/*========== Fonts CSS End ==========*/

/*========== Form CSS Start ==========*/

.form-element i {
	position: absolute;
	top: 22px;
	right: 15px;
	font-size: 16px;
	color: var(--primary-color);
	pointer-events: none;
}

/* .wpcf7-form-control-wrap {
	margin-bottom: 30px;
} */

.form-input::-webkit-input-placeholder,
.input-text::-webkit-input-placeholder {
	color: var(--input-color);
	opacity: 1;
}

.form-input::-moz-placeholder,
.input-text::-moz-placeholder {
	color: var(--input-color);
	opacity: 1;
}

.form-input:-ms-input-placeholder,
.input-text:-ms-input-placeholder {
	color: var(--input-color);
	opacity: 1;
}

.form-input::-ms-input-placeholder,
.input-text::-ms-input-placeholder {
	color: var(--input-color);
	opacity: 1;
}

.form-input::placeholder,
.input-text::placeholder {
	color: var(--input-color);
	opacity: 1;
}

select option {
	color: #000;
}

select {
	color: var(--input-color) !important;
}

.form-input,
.input-text,
.select2-container--default .select2-selection--single .select2-selection__rendered,
select {
	width: 100%;
	height: 46px;
	border: 1px solid transparent;
	outline: none !important;
	padding: 0 15px;
	font-size: 16px;
	line-height: 26px;
	color: var(--dark-color);
	background: var(--white-color);
	border-radius: 0;
	-webkit-appearance: none;
	appearance: none;
}

select,
select.form-input {
	padding-right: 30px;
}

.form-input.wpcf7-textarea {
	height: 120px;
	resize: none;
	padding: 15px;
	display: block;
}

.submit-btn {
	text-align: left;
	width: 100%;
}

.submit-btn input {
	width: 100%;
}

.wpcf7 .wpcf7-spinner {
	position: absolute;
	top: 50%;
	right: 10px;
	transform: translateY(-50%);
	margin: 0;
	z-index: 11;
}

span.wpcf7-list-item-label::before,
.woocommerce-form__label-for-checkbox span::before,
.comment-form-cookies-consent label::before {
	--radio-label-size: 20px;
	content: "";
	position: absolute;
	top: 2px;
	left: 0;
	width: var(--radio-label-size);
	height: var(--radio-label-size);
	border-radius: calc(var(--radio-label-size));
	border: 2px solid var(--primary-color);
	z-index: 1;
}

.comment-form-cookies-consent label::before {
	border-radius: 0;
	border-width: 1px;
	border-color: var(--primary-color);
}

span.wpcf7-list-item-label::after,
.woocommerce-form__label-for-checkbox span::after,
.comment-form-cookies-consent label::after {
	--radio-label-inner-size: 12px;
	content: "";
	position: absolute;
	top: 2px;
	left: 4px;
	width: var(--radio-label-inner-size);
	height: var(--radio-label-inner-size);
	border-radius: calc(var(--radio-label-inner-size)*0.5);
	background: var(--primary-color);
	display: flex;
	justify-content: center;
	align-items: center;
	color: var(--white-color);
	opacity: 0;
	transition: var(--transition);
	z-index: 0;
}

.wpcf7-radio span.wpcf7-list-item-label::after {
	top: 6px;
}

.comment-form-cookies-consent label::after {
	left: 0;
}

input[type=radio]:checked~span::after {
	opacity: 1;
}

.woocommerce-form__label-for-checkbox span::before,
.checkbox-wp .wpcf7-list-item-label::before,
.comment-form-cookies-consent label::before {
	border-radius: 0;
}

.wpcf7-checkbox span.wpcf7-list-item-label::after,
.checkbox-wp .wpcf7-list-item-label::after,
.woocommerce-form__label-for-checkbox span::after,
.comment-form-cookies-consent label::after {
	--checkbox-label-size: 20px;
	content: "\f00c";
	width: var(--checkbox-label-size);
	height: var(--checkbox-label-size);
	background: transparent;
	color: var(--white-color);
	font-family: "Font Awesome 5 Free";
	font-weight: 900;
	font-size: 10px;
	background: var(--primary-color);
	border-radius: 3px;
}

.wpcf7-checkbox span.wpcf7-list-item-label::after {
	left: 0;
	background: var(--primary-color);
}

input[type="checkbox"]:checked~span::before,
input[type="checkbox"]:checked~span::after,
input[type="checkbox"]:checked~span.wpcf7-list-item-label::after,
input[type="checkbox"]:checked~span.wpcf7-list-item-label::before,
input[type="checkbox"]:checked~label:after {
	opacity: 1;
}

.checkbox-wp .wpcf7-not-valid .wpcf7-list-item-label::before {
	border-color: var(--red-color);
	opacity: 0.7;
}

input[type="number"]::-webkit-inner-spin-button,
input[type="number"]::-webkit-outer-spin-button {
	opacity: 1;
}

.wpcf7-not-valid,
.wpcf7-not-valid .wpcf7-list-item-label::before {
	border-color: var(--red-color) !important;
}

.wpcf7-list-item {
	margin: 0 20px 0 0;
}

.wpcf7-checkbox .wpcf7-list-item:last-child,
.wpcf7-radio .wpcf7-list-item:last-child {
	margin: 0;
}

.form-input-file {
	position: relative;
	height: 48px;
	background: 0 0;
	border-radius: 0;
	border: 1px solid var(--black-color);
	margin-bottom: var(--gutter);
}

.form-box.form-input-file {
	height: auto;
	border: 0;
}

.form-input-file p {
	color: var(--black-color);
	line-height: 1;
	margin-bottom: 0;
}

.form-box.form-input-file p {
	line-height: inherit;
}

.form-input-file .wpcf7-form-control-wrap {
	position: absolute;
	height: 100%;
	width: 100%;
	top: 0;
	left: 0;
	margin: 0;
	padding: 0;
}

.form-box.form-input-file .wpcf7-form-control-wrap {
	position: relative;
}

.form-input-file [type=file] {
	position: relative;
	height: 100%;
	width: 100%;
	overflow: hidden;
	opacity: 0;
	cursor: pointer;
	z-index: 1;
}

.form-box.form-input-file input[type=file] {
	width: 76px;
	height: 73px;
	line-height: 1;
}

.form-input-file .icon-label {
	height: 100%;
	display: flex;
	align-items: center;
	justify-content: flex-start;
	padding: 0 15px;
}

.form-box.form-input-file .input-file-icon {
	position: absolute;
	top: 30px;
	left: 0;
	width: 76px;
	height: 73px;
	background: var(--input-color);
	border-radius: 13px;
	display: inline-block;
	cursor: pointer;
	z-index: 0;
}

.form-box.form-input-file .input-file-icon::before,
.form-box.form-input-file .input-file-icon::after {
	content: "";
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	width: var(--gutter);
	height: 1px;
	background-color: var(--black-color);
}

.form-box.form-input-file .input-file-icon::after {
	width: 1px;
	height: var(--gutter);
}

.form-input-file .icon-label label {
	font-weight: inherit;
	font-size: 14px;
	line-height: 22px;
}

.form-input-file .icon-label label span {
	color: var(--black-color);
	font-weight: 600;
	margin-left: 3px;
}

.form-input-file .input-file-text {
	color: var(--black-color);
	text-overflow: ellipsis;
	display: block;
	overflow: hidden;
	white-space: nowrap;
	margin-top: 3px;
	font-size: 14px;
	line-height: 24px;
}

.wpcf7-form-control-wrap,
span.wpcf7-not-valid-tip {
	display: block;
	position: relative;
}

.form-field .form-input {
	width: 100%;
	height: 60px;
	background: var(--white-color);
	border: 1px solid var(--text-color);
	outline: none;
	padding: 16px 30px;
	resize: none;
	appearance: none;
	box-shadow: 0 0 20px rgb(0 0 0 / 9%);
}

.form-field {
	display: block;
	position: relative;
	font-size: 0;
	line-height: 1;
	margin-bottom: 24px;
}

span.wpcf7-not-valid-tip {
	line-height: 1.3;
	margin-bottom: -15px;
	padding-top: 4px;
}

/*========== Form CSS End ==========*/

/*==========Common CSS ==========*/
:root {
	--primary-color: #3e75ad;
	--dark-color: #000000;
	--common-color: #444;
	--white-color: #ffffff;
	--black-color: #000000;
	--red-color: #ff0000;
	--input-color: #555555;
	--box-shadow: 0 3px 10px rgba(0, 0, 0, 0.16);
	--space-80: 80px;
	--body-font: 'Poppins';
	--title-font: 'Poppins';
	--transition: .3s;
	--gutter: 30px;
	--section-gap: 120px;
	--light-bg: #f2f3f5;
}

body {
	font-size: 16px;
	line-height: 1.5;
	color: var(--common-color);
	font-family: var(--body-font);
}

p {
	font-size: 16px;
	line-height: 1.5;
	margin-bottom: 16px;
}

p a,
a {
	color: var(--primary-color);
	/* text-decoration: underline !important; */
	transition: var(--transition);
}

p a:hover,
a:hover {
	color: var(--dark-color);
}

.list li {
	padding-left: 25px;
	position: relative;
}

.list li:after {
	content: '\f5aa';
	position: absolute;
	font-size: 14px;
	line-height: 1;
	color: var(--primary-color);
	top: 7px;
	left: 0;
	font-family: 'Font Awesome 5 Free';
	font-weight: 900;

}

h1,
.h1-title,
h2,
.h2-title,
h3,
.h3-title,
h4,
.h4-title,
h5,
.h5-title,
h6,
.h6-title {
	color: var(--common-color);
	font-family: var(--title-font);
	font-weight: 600;
	text-transform: capitalize;
}

.h1-title {
	font-size: 50px;
	line-height: 1.125;
	margin-bottom: 25px;
}

.h2-title {
	font-size: 45px;
	line-height: 1.15384615;
	margin-bottom: 30px;
}

.h3-title {
	font-size: 38px;
	line-height: 1.2;
}

.h4-title {
	font-size: 25px;
	line-height: 1.4;
}

.h5-title {
	font-size: 22px;
	line-height: 1.45454545;
}

.h6-title {
	font-size: 18px;
	line-height: 1.55555556;
}

.text-lg {
	margin-bottom: 15px;
}

.text-lg p {
	font-size: 18px;
	line-height: 1.55555556;
}

.play-btn {
	width: 60px;
	height: 60px;
	color: var(--primary-color);
	background: var(--white-color);
	border-radius: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
	padding-left: 3px;
	box-shadow: var(--box-shadow);
	transition: 0.8s cubic-bezier(0.22, 0.78, 0.45, 1.02);
}

.play-btn:hover {
	background: var(--primary-color);
	color: var(--white-color);
}

/* .main-navigation ul li.menu-item-has-children>a::after {
	content: "\f078";
	position: absolute;
	top: 50%;
	right: 0;
	transform: translate(0, -50%);
	font-family: "Font Awesome 5 Free";
	font-weight: 900;
	font-size: 13px;
	line-height: 1;
	color: var(--dark-color);
	transition: var(--transition);
	pointer-events: none;
	cursor: pointer;
} */
.main-navigation ul li.menu-item-has-children>.nav-dropdown-toggle {
	margin-left: 10px;
	line-height: 1;
	display: inline-block;
	vertical-align: middle;
}

.main-navigation ul li.menu-item-has-children {
	/* --arrow-space: 20px; */
	/* padding-right: var(--arrow-space); */
}

.main-navigation ul li.menu-item-has-children>a:after {
	/* right: calc(var(--arrow-space)* -1); */
}

.main-navigation ul li.menu-item-has-children>a:hover:after,
.site-header .current-menu-parent a:not(.sub-menu a)::after,
.site-header .current-menu-parent .nav-dropdown-toggle i {
	color: var(--primary-color);
}

.site-header .current-menu-parent a:not(.sub-menu a) {
	padding: 0 !important;
}

@keyframes swip_up {
	from {
		top: calc(100% + 20px);
		opacity: 0;
	}

	to {
		top: 100%;
		opacity: 1;
	}
}

.main-navigation ul ul li {
	display: block;
	margin: 0;
	border-bottom: 1px solid rgba(0, 0, 0, 0.1);
}

.main-navigation ul ul li:last-child {
	border-bottom: 0;
}

.main-navigation ul ul li a {
	display: block;
	padding: 10px;
	font-size: 16px;
	line-height: 26px;
	transition: var(--transition);
}

.main-navigation ul ul li a:hover {
	color: var(--primary-color);
}

.sec-btn,
.woocommerce #respond input#submit,
.woocommerce a.button,
.woocommerce button.button,
.woocommerce input.button {
	position: relative;
	overflow: hidden;
	background: var(--primary-color);
	display: inline-flex;
	justify-content: center;
	align-items: center;
	gap: 10px;
	text-transform: capitalize;
	color: var(--white-color);
	font-weight: 500;
	text-align: center;
	padding: 15px 30px;
	border-radius: 4px;
	line-height: 1;
	cursor: pointer;
	outline: none !important;
	border: 0;
	transition: var(--transition);
	z-index: 2;
	-webkit-appearance: none;
	appearance: none;
}

.sec-btn:hover,
.woocommerce #respond input#submit:hover,
.woocommerce a.button:hover,
.woocommerce button.button:hover,
.woocommerce input.button:hover {
	background: var(--dark-color);
	color: var(--white-color);
}

.sec-btn.white:hover {
	background: var(--white-color);
	color: var(--primary-color);
}

.sec-btn.white-outline-btn {
	background-color: transparent;
	border: 1px solid var(--white-color);
	color: var(--white-color);
}

.sec-btn.white-outline-btn:hover {
	background-color: var(--white-color);
	border: 1px solid var(--white-color);
	color: var(--primary-color);
}

.site-header .current-menu-parent a:not(.sub-menu a),
.site-header .current-menu-parent .nav-dropdown-toggle i,
.site-header .current-menu-item,
.site-header .current-menu-item>a,
.site-header .current-menu-item>a::after,
.site-footer .current-menu-item,
.site-footer .current-menu-item a,
.site-footer .current_page_item,
.site-footer .current_page_item a {
	color: var(--primary-color) !important;
}


.paint {
	background-image: url(style.css);
	background-image: url(../../uploads/2025/02/Painting-of-Marion.png);
	background-repeat: no-repeat;
	background-size: cover;
	background-position: center;
	padding: 10px 30px;
	color: #fff;
	display: inline-block;
}

.box-vector {
	--box-vector-gap: 50px;
	position: relative;
	padding: var(--box-vector-gap);
}

.box-vector:after {
	content: '';
	width: 45%;
	height: 100%;
	top: 0;
	position: absolute;
	background-color: transparent;
	border: 10px solid var(--primary-color);
	z-index: -1;
}

.box-vector:not(.right) {
	padding-right: 0;
}

.box-vector:not(.right):after {
	border-right: none !important;
	left: 0;
}

.box-vector.right {
	padding-left: 0;
}

.box-vector.right:after {
	right: 0;
	border-left: none !important;
}

.box-vector2 {
	--box-vector-size: 35%;
	position: relative;
	padding: 30px;
}

.box-vector2:after,
.box-vector2::before {
	content: '';
	width: var(--box-vector-size);
	aspect-ratio: 1/1;
	position: absolute;
	background-color: transparent;
	border: 10px solid var(--primary-color);
}


.box-vector2::before {
	border-right: none !important;
}

.box-vector2::after {
	border-left: none !important;
}

.box-vector2:not(.right)::before {
	top: 0;
	left: 0;
	z-index: -1;
}

.box-vector2:not(.right):after {
	bottom: 0;
	right: 0;
}

.box-vector2.right {
	/* padding-left: 0; */
}

.box-vector2.right::before {
	bottom: 0;
	left: 0;
}

.box-vector2.right:after {
	top: 0;
	right: 0;
	z-index: -1;
}

.sec-title h2 {
	color: var(--primary-color);
}

.light-bg {
	background-color: #f2f3f5;
}

/*==========Common CSS End==========*/


/*==========White text CSS Start==========*/

.white-text p,
.white-text h1,
.white-text h2,
.white-text h3,
.white-text h4,
.white-text h5,
.white-text h6,
.white-text .h1-title,
.white-text .h2-title,
.white-text .h3-title,
.white-text .h4-title,
.white-text .h5-title,
.white-text .h6-title,
.white-text ul li,
.white-text .read-more,
.white-text span {
	color: var(--white-color);
}

/*==========White text CSS End==========*/
/*========== Modal Popup CSS Start ==========*/
.modal-content {
	background: var(--white-color);
	-webkit-mask-image: -webkit-radial-gradient(var(--white-color), var(--black-color));
	-webkit-backface-visibility: hidden;
	-moz-backface-visibility: hidden;
	-webkit-transform: translate3d(0, 0, 0);
	-moz-transform: translate3d(0, 0, 0);
	border-radius: 16px;
	overflow: hidden;
	box-shadow: 0 20px 30px rgba(60, 140, 244, 0.16);
}

.popup-title {
	position: relative;
	padding: 10px 65px 10px 30px;
	border-bottom: 1px solid rgba(0, 0, 0, 0.2);
}

.popup-title .h2-title {
	font-size: 30px;
	line-height: 40px;
	margin-bottom: 0;
}

button.close {
	position: absolute;
	top: 0;
	right: 0;
	width: 60px;
	height: 100%;
	background: var(--primary-color);
	opacity: 1 !important;
	text-shadow: none;
	color: var(--white-color);
	border-radius: 0;
	outline: none !important;
	z-index: 2;
	transition: var(--transition);
}

button.close:hover {
	background: var(--primary-color);
	color: var(--dark-color);
}

.modal-dialog {
	max-width: 700px;
}

.common-popup-overflow {
	padding: 10px 0px;
}

.common-popup-text::-webkit-scrollbar-thumb {
	background: var(--primary-color);
}

/*========== Modal Popup CSS End ==========*/

/*==========Slider CSS Start ==========*/
.slick-dots li {
	margin: 0 15px 0 0;
}

.slick-dots li button {
	width: 25px;
	height: 5px;
	background: var(--common-color);
	transition: var(--transition);
}

.slick-dots li.slick-active button,
.slick-dots li button:hover {
	background: var(--primary-color);
}

.slick-arrow {
	--slick-arrow-size: 30px;
	bottom: 0;
	left: 0;
	width: var(--slick-arrow-size);
	height: var(--slick-arrow-size);
	background: var(--primary-color);
	color: var(--white-color);
}

.slick-arrow:hover {
	background: var(--dark-color);
}

.slide-arrow.next-arrow.slick-arrow {
	left: auto;
	right: 0;
}

.slick-slider {
	display: flex;
	align-items: center;
	gap: 0 20px;
}

.slick-dots {
	position: relative;
	order: 2;
	width: max-content;
	margin-right: auto;
	left: auto;
	bottom: auto;
	padding: 0;
}

.slick-arrow {
	position: relative;
	top: auto;
	left: auto;
	right: auto;
	bottom: auto;
}

.slick-list {
	order: 1;
}

button.slick-prev.slick-arrow {
	order: 3;
}

button.slick-next.slick-arrow {
	order: 4;
}

/*==========Slider CSS End==========*/

/*==========Header CSS Start==========*/
.site-header {
	position: fixed;
	z-index: 99;
	width: 100%;
	top: 0;
	background: var(--white-color);
	box-shadow: 0px 4px 10px transparent;
	transition: var(--transition) all;
}

.site-header.sticky_head {
	box-shadow: 0px 4px 10px rgba(96, 96, 96, .16);
}

.site-header .site-branding {
	max-width: 160px;
}

.site-header .navbar-nav {
	display: flex;
	align-items: center;
	gap: 10px;
	justify-content: space-between;
	padding: 10px 0;
}

.site-header .main-navigation li a {
	/* font-size: 16px; */
	font-weight: 600;
	text-transform: capitalize;
	color: var(--common-color);
	transition: 0.3s all;
}

.site-header .main-navigation li a:hover,
.site-header .main-navigation li a:hover+.nav-dropdown-toggle i {
	color: var(--primary-color);
}

.main-navigation ul li.menu-item-has-children>.nav-dropdown-toggle i {
	transform: rotate(0deg);
	transition: 0.3s all;
}

.main-navigation ul li.menu-item-has-children.active-sub-menu>.nav-dropdown-toggle i {
	transform: rotate(180deg);
}

.site-header .header-contact .icon-box-wrapper .icon-box-content p {
	margin-bottom: 2px;
	line-height: 1.3;
	/* font-size: 16px; */
	font-weight: 600;
	text-transform: capitalize;
	color: var(--primary-color);
}

.site-header .header-contact .icon-box-wrapper .icon-box-content a {
	/* font-size: 16px; */
	font-weight: 500;
	color: var(--common-color);
}

.site-header .header-contact .icon-box-wrapper .icon-box-content a:hover {
	color: var(--primary-color);
}

.site-header .header-contact .icon-box-wrapper {
	display: flex;
	justify-content: center;
	align-items: center;
	gap: 10px;
}

.site-header .header-contact .icon-box-wrapper .icon-box-icon {
	font-size: 40px;
}

.site-header .main-navigation li a,
.site-header .header-contact .icon-box-wrapper .icon-box-content a,
.site-header .header-contact .icon-box-wrapper .icon-box-content p {
	font-size: 16px;
}

/*==========Header CSS End==========*/

/*==========Footer CSS START==========*/

.site-footer {
	position: relative;
	background-color: var(--white-color);
	overflow: hidden;
	border-top: 10px solid var(--primary-color);
}

.top-footer {
	position: relative;
	padding: calc(var(--section-gap) / 2) 0;
}

/* 
.footer-socials ul {
	display: inline-flex;
	gap: 10px;
	margin-top: 30px;
}

.footer-socials ul a {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 40px;
	aspect-ratio: 1/1;
	overflow: hidden;
	border-radius: 50%;
	background-color: rgba(255 255 255 / 20%);
	font-size: 16px;
}

.footer-socials ul a:hover {
	background-color: var(--secondary-color);
	color: var(--white-color);
} */

.footer-branding p {
	margin-top: 20px;
	margin-bottom: 13px;
}

.footer-branding .site-branding {
	max-width: 180px;
}

.footer-links,
.footer-contact {
	width: auto;
	display: inline-block;
}

.footer-contact {
	word-break: break-word;
}

.footer-contact .contact-item {
	display: inline-flex;
	gap: 20px;
	align-items: center;
}

.footer-contact .contact-item .contact-icon {
	flex: 0 0 auto;
	width: 40px;
	aspect-ratio: 1/1;
	overflow: hidden;
	border-radius: 50%;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	background-color: var(--primary-color);
}

.footer-contact .contact-item .contact-icon i {
	color: var(--white-color);
}

.footer-contact ul li:not(:last-child) {
	margin-bottom: 21px;
}

.footer-contact .contact-link {
	display: inline-flex;
	flex-direction: column;
}

.footer-contact .contact-link p {
	color: var(--primary-color);
	font-size: 16px;
	line-height: 1.2;
	font-weight: 600;
	margin-bottom: 2px;
}

.footer-branding p,
.footer-links ul li a,
.footer-contact .contact-link a {
	color: var(--common-color);
}

.footer-links ul li a:hover,
.footer-contact .contact-link a:hover,
.bottom-footer-content ul li a:hover,
.bottom-footer-text a,
.footer-links ul li.active-footer-menu a,
.bottom-footer p a {
	color: var(--primary-color);
	transition: var(--transition) all;
}

.bottom-footer p a {
	font-weight: 600;
}

.bottom-footer p a:hover {
	text-decoration: underline !important;
}

.bottom-footer p i.fa-heart {
	color: red;
}

.bottom-footer-text a {
	color: var(--primary-color);
}

.bottom-footer-text a:hover {
	color: inherit;
	text-decoration: underline !important;
}

.footer-links ul li:not(:last-child) {
	margin-bottom: 8px;
}

.footer-links ul li a {
	position: relative;
	/* padding-left: 15px; */
	display: inline-flex;
	align-items: baseline;
	gap: 10px;
}

.footer-links ul li a::before {
	content: '\f054';
	font-family: "Font Awesome 5 Pro";
	font-weight: 900;
	font-size: 12px;
	top: -1px;
	line-height: 1;
	position: relative;
}

.site-footer .h4-title {
	margin-bottom: 20px;
}

.site-footer .footer-title {
	font-size: 20px;
	margin-bottom: 20px;
	color: var(--primary-color);
	font-weight: 600;
	text-transform: capitalize;
}

.bottom-footer {
	background-color: var(--light-bg);
	display: flex;
	align-items: center;
	padding: 15px;
}

.bottom-footer p,
.bottom-footer a {
	font-size: 14px;
}

.bottom-footer a:hover {
	color: var(--primary-color);
}

.bottom-footer-content {
	display: flex;
	align-items: center;
	justify-content: space-between;
	/* justify-content: center; */
	gap: 10px;
}

.bottom-footer-content ul li {
	position: relative;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	margin-left: 20px;
}


.bottom-footer-content ul li:first-child {
	margin: 0;
}

/* .bottom-footer-content ul li:before {
	content: '';
	display: inline-block;
	width: 8px;
	aspect-ratio: 1/1;
	overflow: hidden;
	border-radius: 50%;
	background-color: var(--golden-color);
} */


.footer-bottom-link {
	display: inline-block;
	text-align: center;
}

.footer-bottom-link ul {
	font-size: 0;
	line-height: 1;
	list-style: none;
	margin: 0;
}

.footer-bottom-link ul li {
	font-size: 14px;
	line-height: 24px;
	display: inline-block;
	padding-right: 8px;
	margin-right: 8px !important;
	margin-left: 0 !important;
	border-right: 1px solid var(--common-color);
}

.footer-bottom-link ul li:last-child {
	margin-right: 0 !important;
	padding-right: 0;
	border-right: 0;
}

.footer-bottom-link ul li a {
	font-size: 14px;
	line-height: 24px;
	color: var(--common-color);
	transition: var(--transition);
}

.footer-bottom-link ul li a:hover {
	color: var(--primary-color);
}

.footer-contact ul.socials-links {
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	margin-top: 21px;
	gap: 15px;
}

.footer-contact ul.socials-links li {
	margin: 0;
}

.footer-contact ul.socials-links li a {
	display: inline-flex;
	justify-content: center;
	align-items: center;
	width: 40px;
	aspect-ratio: 1/1;
	background: var(--primary-color);
	border-radius: 50%;
	color: var(--white-color);
}

.footer-contact ul.socials-links li a:hover {
	background: var(--dark-color);
	color: var(--white-color);
}

/*==========Footer CSS END==========*/

/*==========Inner Banner Section CSS Start==========*/
.inner-banner-section {
	padding: calc(var(--section-gap) + 110px) 0 var(--section-gap);
	background-color: var(--dark-color);
	position: relative;
}

.inner-banner-section .back-img {
	position: absolute;
	width: 100%;
	height: 100%;
	top: 0;
	left: 0;
	opacity: 0.45;
}

.inner-banner-section .inner-banner-content-wp h1 {
	margin-bottom: 20px;
}

.inner-banner-section .inner-banner-content-wp p {
	/* max-width: 470px; */
}

.inner-banner-section .inner-banner-content-wp p a {
	color: var(--white-color);
	font-weight: 600;
	text-decoration: underline !important;
}

.inner-banner-section .banner-experience-wp {
	display: inline-block;
	position: absolute;
	bottom: 0;
	left: 80%;
	transform: translateX(-20%);
	min-width: 190px;
	transition: 0.3s all;
}

/*==========Inner Banner Section CSS End==========*/

/*==========Home Page CSS Start==========*/
/*==========Contact Page CSS Start==========*/
.contact-section {
	padding: var(--section-gap) 0;
}

.contact-section .sec-title {
	margin-bottom: 50px;
}

.contact-section .sec-title .h2-title {
	margin-bottom: 20px;
}

.contact-section .sec-title .paint {
	background-size: 100% 100%;
}

.contact-section .contact-details {
	padding: 30px;
	border-top: 5px solid var(--primary-color);
	background-color: var(--light-bg);
	box-shadow: 0px 10px 60px 0px rgb(165 165 165 / 13%);
}

.contact-section .contact-details .contact-icon {
	padding: 10px;
	min-width: 50px;
	width: max-content;
	display: flex;
	justify-content: center;
	align-items: center;
	aspect-ratio: 1 / 1;
	background: var(--primary-color);
	border-radius: 50%;
}

.contact-section .contact-details .contact-icon i {
	color: var(--white-color);
}

.contact-section .contact-details .contact-info {
	display: flex;
	align-items: center;
	gap: 15px;
}

.contact-section .contact-details .contact-info p {
	margin-bottom: 0;
}

.contact-section .contact-details .contact-info,
.contact-section .contact-details .contact-info p {
	color: var(--black-color);
}

.contact-section .contact-details a.contact-info:hover {
	color: var(--primary-color);
}

.contact-section .contact-details .contact-info-wp {
	display: flex;
	flex-direction: column;
	gap: 20px;
	word-break: break-word;
}

.contact-section .contact-details .socials-links {
	border-top: 1px solid var(--primary-color);
	margin-top: 20px;
	padding-top: 20px;
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: 15px;
}

.main-contact-map,
.contact-map {
	line-height: 0;
}

.main-contact-map .contact-map {
	width: 100%;
	aspect-ratio: 1/ 0.25;
	overflow: hidden;
}

.main-contact-map iframe {
	width: 100%;
	height: calc(100% + 60px);
	position: relative;
	top: -60px;
}

/*==========Contact Page CSS End==========*/

/*==========Contact Modal CSS Start==========*/
.contact-us-modal {
	max-width: 530px;
	width: 100%;
	position: fixed;
	bottom: 0;
	left: 100%;
	transform: translateX(0%);
	z-index: 112;
	padding-left: 15px;
	padding-top: 15px;
	transition: 0.3s all;
	max-height: 100%;
	overflow: hidden;
	height: 100%;
	/* max-height: max-content; */
	display: flex;
	align-items: end;
}

.contact-us-modal-wp {
	width: 100%;
	background-color: var(--white-color);
	position: relative;
	max-height: 100%;
	overflow: auto;
	position: relative;
}

.contact-us-modal.active {
	transform: translateX(-100%);
}

.contact-us-modal .contact-us-modal img {
	line-height: 0;
}

.contact-us-modal img {
	aspect-ratio: 1/0.6660;
	object-fit: cover;

}

.contact-us-modal .contact-modal-content {
	padding: 30px;
	display: flex;
	gap: 20px;
	flex-direction: column;
	align-items: center;
	justify-content: center;
}

.contact-us-modal .contact-modal-content>* {
	margin: 0;
}

.close-btn:hover {
	background: var(--black-color);
}

.close-btn {
	aspect-ratio: 1 / 1;
	min-width: 35px;
	height: auto;
	aspect-ratio: 1 / 1;
	display: flex;
	justify-content: center;
	align-items: center;
	background: var(--primary-color);
	line-height: 0;
	position: absolute;
	top: 0;
	left: 0;
	cursor: pointer;
	transition: 0.3s all;
}

.close-btn i {
	font-size: 20px;
	color: var(--white-color);
	/* line-height: 2; */
	vertical-align: middle;
}

.contact-modal-overlay:before {
	content: '';
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: rgb(0 0 0 / 70%);
	z-index: 111;
}

.contact-modal-overlay {
	position: relative;
	overflow: hidden;
}

/*==========Contact Modal CSS End==========*/

/*==========Banner Section CSS Start==========*/
.banner-section {
	padding: 180px 0 0;
	position: relative;
	background-color: var(--dark-color);
}

.banner-section .banner-content-wp {
	display: flex;
	justify-content: space-between;
	align-items: start;
	flex-direction: column;
	gap: 30px;
	height: 100%;
}

.banner-section .banner-content,
.banner-experience-wp {
	margin-top: auto;
}

.banner-experience-wp {
	display: flex;
	justify-content: center;
	align-items: center;
	flex-wrap: wrap;
	background: var(--white-color);
	text-align: center;
	padding: 20px;
	position: relative;
	bottom: -1px;
}

.banner-experience-wp .info-box .experience-content .count {
	color: var(--primary-color);
}

.banner-experience-wp .info-box .experience-content p {
	color: var(--dark-color);
	font-size: 16px;
	text-transform: uppercase;
}

.banner-experience-wp .info-box {
	display: flex;
	justify-content: center;
	align-items: center;
	/* padding: 20px; */
}


.banner-section .back-img {
	width: 100%;
	height: 100%;
	background-position: center;
	background-repeat: no-repeat;
	background-size: cover;
}

.banner-section .banner-slideshow {
	position: absolute;
	top: 0;
	left: 0;
	opacity: 0.45;
	width: 100%;
	height: 100%;
}

.banner-section .banner-form-wp {
	margin-bottom: 100px;
}

.banner-section .banner-form-wp .submit-btn .sec-btn:hover {
	background-color: var(--white-color);
	color: var(--primary-color);
}

.banner-section .banner-form-wp .wpcf7 form.aborted .wpcf7-response-output,
.banner-section .banner-form-wp .wpcf7 form.failed .wpcf7-response-output,
.banner-section .banner-form-wp .wpcf7 form.invalid .wpcf7-response-output,
.banner-section .banner-form-wp .wpcf7 form.unaccepted .wpcf7-response-output,
.wpcf7-form.invalid .wpcf7-response-output,
.banner-section .banner-form-wp .wpcf7 form.sent .wpcf7-response-output {
	border: 1px solid var(--white-color);
	color: var(--white-color);
}

.banner-section .banner-form-wp span.wpcf7-not-valid-tip {
	color: var(--white-color);
}

/* 
.banner-section .banner-slideshow .slick-list *,
.banner-section .banner-slideshow .slick-list .slick-track,
.banner-section .banner-slideshow .slick-list .slick-slide,
.banner-section .banner-slideshow .slick-list .slick-slide>* { */

.banner-section .banner-slideshow * {
	width: 100%;
	height: 100%;
}

@keyframes imageAnimation {
	0% {
		opacity: 0;
		animation-timing-function: ease-in;
	}

	10% {
		opacity: 1;
		animation-timing-function: ease-out;
	}

	20% {
		opacity: 1;
	}

	30% {
		opacity: 0;
	}
}

@media only screen and (min-width: 992px) and (max-width: 1399px) {
	.banner-section .banner-content h1 {
		font-size: 48px;
	}
}


/*==========Banner Section CSS End==========*/

/*==========About Section CSS Start==========*/
.about-section,
.service-section {
	padding: var(--section-gap) 0;
}

.about-section .about-img,
.service-section .service-img {
	text-align: center;
	height: 100%;
}

.about-section .sec-btn,
.service-section .sec-btn {
	margin-top: 30px;
}

.about-section .about-img img,
.service-section .service-img img {
	height: 100%;
	object-fit: cover;
}

.about-section .about-content,
.service-section .service-content {
	padding: 30px 0;
}

.about-section .about-content ul,
.service-section .service-content ul {
	margin: 20px 0;
}

.about-section .about-content ul li,
.service-section .service-content ul li {
	color: var(--dark-color);
	font-size: 16px;
	margin-bottom: 10px;
}

.about-section .about-content .tag-line,
.service-section .service-content .tag-line {
	font-size: 16px;
	font-weight: 500;
	text-transform: uppercase;
	color: var(--primary-color);
	display: block;
	margin-bottom: 10px;
}

.about-section .about-content ul li:last-child,
.service-section .service-content ul li:last-child {
	margin-bottom: 0;
}


.about-section .about-content p a,
.service-section .service-content p a {
	text-decoration: underline !important;
	font-weight: 600;
	color: var(--common-color);
	display: inline-block;
}

.about-section .about-content p a:hover,
.service-section .service-content p a:hover {
	color: var(--primary-color);
}

/*==========About Section CSS End==========*/

/*==========Service Section CSS Start==========*/
.service-list-section {
	padding: var(--section-gap) 0;
	background-color: var(--light-bg);
}

.service-list-section .service-box:after {
	content: '';
	position: absolute;
	bottom: 0;
	left: 0;
	width: 100%;
	height: 50%;
	/* background-image: linear-gradient(0, 20% black, 80% transparent); */
	background: linear-gradient(180deg, rgba(255, 255, 255, 0) 0%, rgb(0 0 0 / 90%) 70%);
	z-index: 0;
	transition: var(--transition) all;
}

.service-list-section .service-box:hover::after {
	height: 100%;
	background: linear-gradient(180deg, rgba(255, 255, 255, 0) 0%, rgb(0 0 0 / 70%) 50%);
}

/* .service-list-section .service-box::before {
	background: linear-gradient(180deg, rgba(255, 255, 255, 0) 50%, var(--primary-color) 90%);
	top: 100%;
	bottom: auto;
}
.service-list-section .service-box:hover:before {
	background: linear-gradient(180deg, rgba(255, 255, 255, 0) 50%, var(--primary-color) 90%);
	top: 0;
	bottom: auto;
} */

.service-list-section .service-box {
	background-color: var(--black-color);
	height: 100%;
	text-align: center;
	position: relative;
	overflow: hidden;
}

.service-list-section .service-box .service-img {
	background-position: center;
	background-size: cover;
	background-repeat: no-repeat;
	position: absolute;
	width: 100%;
	height: 100%;
	left: 0;
	top: 0;
	opacity: 1;
	scale: 1;
	transition: var(--transition) all;
}

.service-list-section .service-box .service-contant {
	display: flex;
	justify-content: end;
	align-items: center;
	gap: 20px;
	flex-direction: column;
	min-height: 412px;
	padding: 30px 20px 0;
	transform: translateY(45px);
	transition: var(--transition) all;
	position: relative;
	z-index: 1;
}

.service-list-section .service-box .service-contant>* {
	margin: 0;
}

.service-list-section .service-box:hover .service-img {
	scale: 1.04;
}

.service-list-section .service-box:hover .service-contant {
	transform: translateY(-30px);
}


.service-list-section .service-box .sec-btn {
	transition: var(--transition) all;
	opacity: 0;
}

.service-list-section .service-box:hover .sec-btn {
	opacity: 1;
}

/*==========Service Section CSS End==========*/

/*==========Gallery Section CSS Start==========*/
.our-gallery-sec {
	padding: var(--section-gap) 0 calc(var(--section-gap) / 2);
}

.our-gallery-sec .slide-arrow {
	top: 50%;
	transform: translate(-50%, -50%);
}

.our-gallery-sec .prev-arrow {
	position: absolute;
	left: 0;
}

.our-gallery-sec .next-arrow {
	position: absolute;
	left: 0;
	transform: translate(50%, -50%);
}

.gallery-tabbing {
	max-width: 790px;
	overflow: hidden;
	padding: 0 0 10px;
	margin-left: auto;
	display: flex;
	justify-content: end;
}

.gallery-tabbing .simplebar-track.horizontal {
	display: block;
}

.gallery-tabbing ul {
	width: 100%;
	height: auto;
	display: flex;
	justify-content: flex-start;
	flex-wrap: nowrap;
	gap: 19px;
	position: relative;
	white-space: nowrap;
	padding: 0 !important;
	width: max-content;
}

.gallery-tabbing .simplebar-content {
	overflow: auto hidden;
	/* padding-bottom: 10px !important; */
}

.gallery-tabbing .horizontal.simplebar-track .simplebar-scrollbar {
	right: auto;
	top: 0;
	height: 6px;
	min-height: 0;
	min-width: 10px;
	width: auto
}

.gallery-tabbing .simplebar-track.horizontal {
	height: 6px;
}

/* .gallery-tabbing::-webkit-scrollbar {
	width: 100%;
	height: 5px;
}

.gallery-tabbing::-webkit-scrollbar-track {
	width: 100%;
	height: 5px;
	background-color: #eee;
}

.gallery-tabbing::-webkit-scrollbar-thumb {
	height: 5px;
	background-color: var(--primary-color);
	cursor: grab;
} */

.gallery-tabbing li {
	height: 42px;
	font-family: var(--title-font);
	font-size: 17px;
	line-height: 2.117647;
	border: 1px solid #707070;
	padding: 2px 15px;
	cursor: pointer;
	transition: var(--transition);
}

.gallery-tabbing li.active-tab,
.gallery-tabbing li:hover {
	background-color: var(--primary-color);
	border-color: var(--primary-color);
	color: var(--white-color);
}

.gallery_tabing_slide .slick-list {
	max-width: unset;
	width: 100%;
	left: 120px;
}

.gallery-tab-img-wp {
	margin-top: 50px;
}

.gallery-tab-img-box-wp {
	overflow: hidden;
	line-height: 0;
}

.gallery-tab-img-box {
	overflow: hidden;
	aspect-ratio: 1 / 0.757664;
	width: 100%;
	display: inline-block;
}

.gallery-tab-img-box:hover .gallery-tab-img {
	transform: scale(1.1) rotate(2deg);
}

.gallery-tab-img {
	transform: scale(1) rotate(0deg);
	transition: var(--transition) all;
	width: 100%;
	height: 100%;
	border-radius: var(--theme-radius-12);
}

.gallery_tab_content_slide .slick-list {
	margin: 0 -5px;
}

.gallery_tab_content_slide .slick-slide {
	padding: 0 5px;
}

.gallery-tab-content-wp {
	position: relative;
}

.gallery-tab-content-wp .loader {
	position: absolute;
	width: 115%;
	height: 100%;
	top: 0;
	left: 50%;
	transform: translate(-50%, 0);
	background: rgba(255, 255, 255, .9);
	display: flex;
	justify-content: center;
	align-items: center;
	font-size: 34px;
	z-index: 2;
}

/*==========Gallery Section CSS End==========*/

/*==========CTA Section CSS Start==========*/
.cta-section {
	padding: calc(var(--section-gap) / 2) 0;
}

.cta-section .keywords-slider {
	max-width: 400px;
}

.cta-wp {
	background-position: center;
	background-repeat: no-repeat;
	background-size: cover;
	padding: var(--section-gap) 30px;
	position: relative;
}

.cta-wp h2 {
	margin-bottom: 20px;
}

.cta-content .tag-line {
	font-weight: 600;
	font-size: 16px;
	text-transform: uppercase;
	margin-bottom: 5px;
}

.cta-wp::after {
	content: '';
	width: 100%;
	height: 100%;
	position: absolute;
	top: 0;
	left: 0;
	background: var(--dark-color);
	opacity: 0.5;
}

.cta-wp .cta-content {
	position: relative;
	z-index: 1;
}

.cta-logo {
	display: inline-block;
	position: absolute;
	bottom: 0;
	right: 0;
	padding: 30px;
	background: var(--white-color);
	z-index: 1;
	max-width: 200px;
	/* padding-right: 0 !important;
	padding-bottom: 0 !important; */
}

/*==========CTA Section CSS End==========*/

/*==========Testimonials Section CSS Start==========*/
.testimonials-section {
	padding: var(--section-gap) 0;
}

.testimonials-section .sec-title {
	display: flex;
	justify-content: space-between;
	align-items: center;
	flex-wrap: wrap;
	padding: 0 10px;
	gap: 15px;
}

.testimonials-section .slider-arrow-wp {
	display: flex;
	gap: 20px;
}

.testimonials-section .slider-arrow-wp .slide-arrow {
	padding: 20px;
}

.testimonials-section .slider-arrow-wp .slide-arrow i {
	font-size: 24px;
}

.testimonial-card .star-rating-wp {
	margin-top: 6px;
}

.testimonial-card .star-rating {
	--font: 18px;
	--spacing: 5px;
	margin: 0;
	position: relative;
	display: inline-flex;
}

.testimonial-card .star-rating:before {
	content: "\f005\f005\f005\f005\f005";
	font-family: "Font Awesome 5 Pro";
	font-weight: 900;
	color: #e5e5e5;
	letter-spacing: var(--spacing);
	font-size: var(--font);
}

.testimonial-card .star-rating__fill {
	position: absolute;
	display: inline-block;
	top: 0;
	left: 0;
	overflow: hidden;
	animation: fill-star 2s ease-in-out;
}

@keyframes fill-star {
	0% {
		width: 0
	}
}

.testimonial-card .star-rating__fill:before {
	content: "\f005\f005\f005\f005\f005";
	color: #ffc107;
	font-family: "Font Awesome 5 Pro";
	font-weight: 900;
	letter-spacing: var(--spacing);
	font-size: var(--font);
}

.testimonial-card .overflow-text {
	height: 140px;
	overflow: hidden;
	margin-bottom: 4px;
}

.testimonial-card-block {
	padding: 0 10px;
}

.testimonial-card {
	/* max-width: 350px; */
	padding: 30px;
	position: relative;
	background: var(--white-color);
}

.testimonial-card .testimonial-card-head {
	display: flex;
	align-items: center;
	justify-content: space-between;
}

.testimonial-card .testimonial-card-head i {
	font-size: 50px;
	color: var(--primary-color);
	opacity: 0.4;
}

.testimonial-card-wp {
	margin-top: 50px;
}

.testimonial-card .testimonial-card-top {
	position: relative;
	z-index: 1;
}

.testimonial-card .user-info {
	padding-top: 20px;
	border-top: 1px solid var(--primary-color);
	margin-top: 30px;
	position: relative;
	z-index: 1;
}

.testimonial-card .user-info .user-name {
	color: var(--primary-color);
	margin: 0;
}

.testimonial-card .testimonial-card:after {
	position: absolute;
	bottom: 0;
	right: 0;
	height: 35%;
	width: 50%;
	background: transparent;
	border: 5px solid var(--primary-color);
	border-top: 0;
	opacity: 01;
	border-left: 0;
}

.testimonial-card .desc {
	margin: 20px 0;
}

.testimonial-card .desc p {
	font-size: 16px;
	line-height: 1.7;
}

.testimonial-card .back-img.service-img {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	opacity: 0.3;
}

/*==========Testimonials Section CSS End==========*/

/*==========Home Page CSS End==========*/

/*==========Scroll To Top CSS Start==========*/

.scrolltop {
	position: fixed;
	bottom: 10px;
	right: 10px;
	width: 50px;
	height: 50px;
	background: var(--primary-color);
	border: none;
	color: var(--white-color) !important;
	font-size: 25px;
	line-height: 30px;
	text-align: center;
	padding: 13px 0;
	border-radius: 8px;
	box-shadow: 0 0 20px rgba(0, 0, 0, 0.16);
	cursor: pointer;
	display: none;
	z-index: 50;
	transition: var(--transition);
}

.scrolltop:hover {
	background: var(--dark-color);
	color: var(--white-color) !important;
}

/*==========Scroll To Top CSS End==========*/

/*========== Inner Page CSS Start ==========*/

.main-banner.inner-banner {
	position: relative;
	padding: 280px 0 160px;
}

.inner-page-text {
	padding: var(--section-gap) 0;
}

.privacy-content h2,
.entry-content h2 {
	font-size: 24px;
	color: var(--primary-color);
}

.privacy-content p a,
.privacy-content a,
.entry-content a,
.entry-content p a,
.entry-content a {
	transition: var(--transition);
	color: var(--primary-color);
}

.privacy-content p a:hover,
.privacy-content a:hover,
.entry-content p a:hover,
.entry-content a:hover {
	color: var(--dark-color);
}

/*========== Inner Page CSS End ==========*/

/*========== Thank You Page CSS Start ==========*/

.thank-text h6 {
	font-size: 24px;
	line-height: 30px;
	text-transform: capitalize;
	color: var(--dark-color);
}

.thank-text p a {
	text-decoration: underline !important;
	color: var(--primary-color);
	transition: var(--transition);
}

.thank-text p a:hover {
	color: var(--dark-color);
}

/*========== Thank You Page CSS End ==========*/

/*==========Site Map CSS Start==========*/

.site-map li a {
	color: var(--primary-color);
}

.site-map li::marker {
	color: var(--primary-color);
}

/*==========Site Map CSS End==========*/

/*========== View All Services CSS Start ==========*/

.footer-last .text,
.menu-seo-menu-container ul li a {
	font-size: 14px;
	line-height: 20px;
	color: var(--primary-color);
	cursor: pointer;
	transition: var(--transition);
}

.footer-last .text:hover {
	color: var(--dark-color) !important;
	text-decoration: underline !important;
}

.menu-seo-menu-container ul li a {
	padding-right: 7px;
	margin-right: 7px;
	border-right: 1px solid var(--dark-color);
	transition: var(--transition);
}

.menu-seo-menu-container ul li a:hover {
	color: var(--primary-color);
}

/*========== View All Services CSS End ==========*/

/*========== SEO Page CSS Start ==========*/
.main-seo-content {
	position: relative;
	padding: var(--space-80) 0;
}

.excerpt-content p a {
	color: var(--primary-color);
	transition: var(--transition);
}

.excerpt-content ul {
	margin-bottom: 15px;
	margin-left: 30px;
}

.excerpt-content ul li {
	list-style-type: disc;
}

.excerpt-content p a:hover {
	color: var(--primary-color);
}

.excerpt-content h3 {
	font-size: 24px;
	line-height: 30px;
	font-weight: 500;
	color: var(--primary-color);
}

.main-seo-content .excerpt-content {
	max-height: 325px;
	position: relative;
}

.main-seo-content .excerpt-content:not([style*="max-height: unset;"]):before {
	content: '';
	position: absolute;
	width: 100%;
	height: 120px;
	bottom: 0;
	left: 0;
	background: linear-gradient(to top, white, transparent);
	pointer-events: none;
}

/*========== SEO Page CSS End ==========*/

/*========== Blog CSS Start ==========*/
.posted-on a,
.byline a,
.widget ul li a,
.entry-title a,
.logged-in-as a {
	transition: var(--transition);
	color: var(--primary-color);
}

.entry-title a:hover,
.posted-on a:hover,
.byline a:hover,
.widget ul li a:hover,
.comment-meta .url:hover,
.comment-content a:hover,
.comment-metadata a:hover,
.reply a:hover,
.entry-footer span a:hover,
.nav-previous a:hover,
.nav-next a:hover {
	color: var(--dark-color);
}

.entry-footer span a {
	color: var(--primary-color);
}

.entry-footer span a:hover {
	color: var(--primary-color);
	text-decoration: underline !important;
}

.entry-title {
	font-size: 30px;
	/* text-transform: uppercase; */
	color: var(--primary-color);
	margin-bottom: 20px;
}

.widget-area .widget_search .wp-block-search .wp-block-search__input,
.page-content .wp-block-search .wp-block-search__input,
.search-form .search-field {
	background: var(--white-color);
	font-size: 16px;
	outline: none;
	width: 100%;
	height: 50px;
	border-radius: 0;
	border: 1px solid var(--primary-color);
	padding: 13px 95px 12px 20px;
	-webkit-appearance: none;
	appearance: none;
}

.widget-area .widget_search .wp-block-search .wp-block-search__button,
.page-content .wp-block-search .wp-block-search__button,
.search-form .search-submit {
	padding: 10px 16px;
	font-size: 15px;
	font-weight: 700;
	border-radius: 0;
	height: 50px;
	color: var(--white-color);
	position: absolute;
	right: 0;
	bottom: 0;
	outline: none;
	border: none;
	cursor: pointer;
	background: var(--primary-color);
	flex: 1;
	transition: var(--transition);
}

.widget-area .widget_search .wp-block-search .wp-block-search__button:hover,
.page-content .wp-block-search .wp-block-search__button:hover,
.search-form .search-submit:hover {
	background: var(--dark-color);
	color: var(--white-color);
}

.comments-area textarea {
	resize: none;
	height: 180px;
	border-radius: 0;
	box-shadow: none;
	background: var(--white-color);
	border: 1px solid var(--common-color);
	outline: none;
	padding: 15px;
}

.comments-area p input {
	width: 100%;
	height: 46px;
	border-radius: 0;
	background: var(--white-color);
	border: 1px solid var(--common-color);
	outline: none;
	box-shadow: none;
	padding: 15px;
}

.form-submit .submit {
	width: 170px;
	height: 46px;
	background: var(--primary-color);
	color: var(--white-color);
	font-weight: bold;
	border: none;
	/* border-radius: 40px; */
	outline: none !important;
	transition: var(--transition);
}

.form-submit .submit:hover {
	background: var(--dark-color);
	color: var(--white-color);
}

.avatar.photo {
	width: 50px;
	height: 50px;
	border-radius: 50%;
	margin-right: 15px;
}

.wp-block-latest-comments__comment-meta a:hover {
	color: var(--dark-color);
}

.comment-meta .url,
.comment-content a {
	color: var(--primary-color);
}

.comment-meta .url:hover,
.comment-content a:hover {
	color: var(--dark-color);
	text-decoration: none !important;
}

.comment-metadata a {
	color: var(--primary-color);
	display: inline-block;
	margin-right: 10px;
	margin-bottom: 15px;
}

.reply a {
	display: inline-block;
	transition: var(--transition);
	padding: 5px 10px;
	margin: 10px 0;
	background-color: var(--primary-color);
	color: var(--white-color);
}

.reply a:hover {
	background-color: var(--dark-color);
	color: var(--white-color);
}

.comment-reply-title {
	font-size: 30px;
	font-weight: bold;
	color: var(--primary-color);
	margin-bottom: 20px;
}

.comment-reply-title small a:hover {
	color: var(--dark-color);
}

.comment-form-comment .form-submit #submit {
	padding: 0;
	line-height: 42px;
}

.comments-area {
	margin-top: 40px;
	padding-top: 40px;
	border-top: 2px solid var(--primary-color);
}


.comments-title {
	margin-bottom: 20px;
	text-transform: uppercase;
	font-size: 30px;
	line-height: 1.3;
}

.comment-body {
	margin-bottom: 30px;
}

.comment-form-url {
	margin-right: 0;
}

.single-post .widget-area {
	margin-top: 0;
}

.nav-previous a,
.nav-next a {
	color: var(--primary-color);
	transition: var(--transition);
}

.result-pagination li a,
.result-pagination li,
.result-pagination .page-numbers {
	--pagination-size: 50px;
	width: var(--pagination-size);
	height: var(--pagination-size);
	background: var(--white-color);
	box-shadow: 0 10px 40px rgba(37, 58, 105, 0.09);
	border-radius: 10px;
	color: var(--dark-color);
	font-size: 20px;
	z-index: 10;
	transition: var(--transition);
}

.result-pagination a:hover,
.result-pagination .current {
	background: var(--primary-color);
	color: var(--white-color);
}

.page-numbers li a,
.page-numbers li,
span.page-numbers,
.page-numbers {
	width: 50px !important;
	aspect-ratio: 1/1;
	background: transparent;
	border: 1px solid var(--primary-color);
	box-shadow: 0 10px 40px rgba(37, 58, 105, 0.09);
	border-radius: 8px;
	outline: none;
	color: var(--primary-color);
	/* font-size: 18px; */
	z-index: 10;
	transition: var(--transition);
	display: inline-flex;
	justify-content: center;
	align-items: center;
	margin: 0 3px;
}

.page-numbers li {
	margin: 0 5px;
}

.page-numbers li a:hover,
.page-numbers.current,
.page-numbers:hover {
	background: var(--primary-color);
	color: var(--white-color);
}

.post-thumbnail {
	margin: 20px 0;
}

.post-thumbnail img {
	aspect-ratio: 1 / 0.6;
	object-fit: cover;
}

.entry-footer span a,
.byline a,
.posted-on a,
.comment-metadata a,
.comment-content a,
.logged-in-as a {
	font-weight: 600;
	text-decoration: underline !important;
	color: var(--black-color);
}

.entry-footer span a:hover,
.byline a:hover,
.posted-on a:hover,
.comment-metadata a:hover,
.comment-content a:hover,
.logged-in-as a:hover {
	color: var(--primary-color);
}



.type-page:not(:last-child),
.type-post:not(:last-child) {
	margin-bottom: 30px;
}

.type-post:not(:last-of-type) {
	margin-bottom: 30px;
	padding-bottom: 30px;
	border-bottom: 2px solid var(--primary-color);
}

.site-map .type-page:not(:last-child),
.site-map .type-post:not(:last-child) {
	margin-bottom: 10px;
	border: none;
	padding: 0;
}

.comment-navigation .nav-next a,
.comment-navigation .nav-previous a,
.post-navigation .nav-next a,
.post-navigation .nav-previous a,
.posts-navigation .nav-next a,
.posts-navigation .nav-previous a {
	padding: 10px;
	background: var(--primary-color);
	color: var(--white-color);
	display: inline-block;
}

.comment-navigation .nav-next a:hover,
.comment-navigation .nav-previous a:hover,
.post-navigation .nav-next a:hover,
.post-navigation .nav-previous a:hover,
.posts-navigation .nav-next a:hover,
.posts-navigation .nav-previous a:hover {
	background: var(--dark-color);
	color: var(--white-color);
}

.post-navigation .nav-next,
.post-navigation .nav-previous,
.posts-navigation .nav-next,
.posts-navigation .nav-previous {
	width: auto;
}

.site-main .post-navigation .nav-links {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
	justify-content: space-between;
}

/*========== End of Blog CSS ==========*/

/*==========Responsive Start==========*/

@media screen and (min-width: 992px) {
	.site-header .main-navigation ul {
		display: flex;
		justify-content: center;
		align-items: center;
		gap: 20px 40px;
	}
}

@media screen and (min-width: 1400px) {
	.container {
		max-width: 1310px;
	}
}

@media (min-width: 1921px) {
	.container {
		max-width: 1400px;
	}

	:root {
		--section-gap: 160px;
	}

	.gallery-tabbing {
		max-width: 802px;
	}
}

@media screen and (max-width: 1499px) {}

@media screen and (max-width: 1399px) {
	.h1-title {
		font-size: 46px;
		margin-bottom: 30px;
	}

	.h2-title {
		font-size: 42px;
		margin-bottom: 25px;
	}

	.h3-title {
		font-size: 34px;
	}

	.h4-title {
		font-size: 22px;
	}

	.site-header .main-navigation ul {
		gap: 20px 40px;
	}

	/* Gallery Section CSS Start */

	.our-gallery-sec {
		/* padding: 80px 0 110px; */
	}

	.gallery-tabbing {
		max-width: 684px;
		gap: 10px;
	}

	.gallery-tabbing li {
		font-size: 16px;
		padding: 2px 13px;
	}

	/* Gallery Section CSS End */

	/* Testimonials Section CSS Start */
	.testimonial-card .testimonial-card-head i {
		font-size: 40px;
	}

	/* Testimonials Section CSS End */
}

@media screen and (max-width: 1199px) {
	:root {
		--section-gap: 100px;
	}

	.h1-title {
		font-size: 42px;
		margin-bottom: 30px;
	}

	.h2-title {
		font-size: 38px;
		margin-bottom: 20px;
	}

	.h3-title {
		font-size: 30px;
	}

	.h5-title {
		font-size: 20px;
	}

	.site-header .main-navigation ul {
		gap: 20px 30px;
	}

	.site-header .site-branding {
		max-width: 130px;
	}

	.site-header .main-navigation li a,
	.site-header .header-contact .icon-box-wrapper .icon-box-content a,
	.site-header .header-contact .icon-box-wrapper .icon-box-content p {
		font-size: 14px;
	}

	.site-header .header-contact .icon-box-wrapper {
		gap: 5px;
	}

	.site-header .header-contact .icon-box-wrapper .icon-box-icon {
		font-size: 32px;
	}

	/* CTA Section CSS Start */
	.cta-logo {
		padding: 20px;
	}

	/* CTA Section CSS End */

	/* Testimonials Section CSS Start */
	.testimonial-card .testimonial-card-head i {
		font-size: 32px;
	}

	.testimonial-card .desc {
		margin: 15px 0;
	}

	.testimonial-card .user-info {
		padding-top: 15px;
		margin-top: 15px;
	}

	.testimonial-card {
		padding: 25px;
	}

	/* Testimonials Section CSS End */

	/* Contact Section CSS Start */
	.contact-section .contact-details {
		padding: 25px;
	}

	/* Contact Section CSS End */
}


@media screen and (max-width: 991px) {
	.h1-title {
		font-size: 38px;
		margin-bottom: 30px;
	}

	.h2-title {
		font-size: 34px;
		margin-bottom: 20px;
	}

	.h3-title {
		font-size: 26px;
	}

	.h4-title {
		font-size: 20px;
	}

	.h5-title {
		font-size: 18px;
	}

	.h6-title {
		font-size: 16px;
	}

	.privacy-content h2,
	.entry-content h2 {
		font-size: 22px;
	}

	.box-vector {
		--box-vector-gap: 30px;
	}

	.box-vector:after {
		border: 7px solid var(--primary-color);
	}

	.box-vector2:after,
	.box-vector2::before {
		border: 7px solid var(--primary-color);
	}

	.single-post .widget-area,
	.widget-area {
		margin-top: 30px;
	}

	.type-post:not(:last-of-type) {
		margin-bottom: 20px;
		padding-bottom: 20px;
		border-bottom: 1px solid var(--primary-color);
	}

	.comments-area {
		margin-top: 20px;
		padding-top: 20px;
		border-top: 1px solid var(--primary-color);
	}

	:root {
		--section-gap: 80px;
		--gutter: 20px;
	}

	.site-header {
		height: var(--header-height);
		--header-height: 90px;
	}

	.site-header .navbar-nav {
		gap: 20px;
	}

	.page-numbers li a,
	.page-numbers li,
	span.page-numbers,
	.page-numbers {
		width: 40px !important;
	}

	.menu-toggle {
		--menu-toggle-rotate: 45deg;
		--menu-toggle-space: 13px;
		/* position: fixed;
		top: 25px;
		right: 30px; */
		border: none;
		outline: none !important;
		background: transparent;
		width: 40px;
		padding: 0;
		z-index: 105;
		vertical-align: middle;
		position: relative;
	}

	.menu-toggle span {
		display: block;
		width: 100%;
		height: 5px;
		background: var(--primary-color);
		margin-bottom: 8px;
		border-radius: 0;
		position: relative;
		top: 0;
		opacity: 1;
		transition: var(--transition);
	}

	.menu-toggle span:last-child {
		margin: 0;
	}

	.site-header .main-navigation li a,
	.site-header .main-navigation li>.nav-dropdown-toggle i {
		color: var(--white-color);
	}

	.main-navigation ul li.menu-item-has-children>.nav-dropdown-toggle {
		margin-left: 10px;
		line-height: 1;
		display: inline-block;
		vertical-align: middle;
		aspect-ratio: 1 / 1;
		width: 20px;
		display: flex;
		justify-content: center;
		align-items: center;
		border: 1px solid var(--white-color);
		transition: 0.3s all;
		line-height: 0;
	}

	.site-header .menu-item-has-children>a {
		padding: 0 !important;
	}

	.site-header .main-navigation li a:hover+.nav-dropdown-toggle,
	.site-header .current-menu-parent .nav-dropdown-toggle {
		border-color: var(--primary-color) !important;
	}

	.site-header .main-navigation li>.nav-dropdown-toggle i {
		font-size: 12px;
		transition: 0.3s all;
		transform: rotate(0deg);
	}

	.toggled .menu-toggle span:nth-child(1) {
		transform: rotate(var(--menu-toggle-rotate));
		top: var(--menu-toggle-space);
	}

	.toggled .menu-toggle span:nth-child(2) {
		opacity: 0;
	}

	.toggled .menu-toggle span:nth-child(3) {
		transform: rotate(calc(var(--menu-toggle-rotate)*-1));
		top: calc(var(--menu-toggle-space)*-1);
	}

	.header-mobile-menu {
		background: var(--dark-color);
		--header-mobile-menu-width: 400px;
		padding: 30px;
		/* left: 0;
		transform: translateX(100%); */
		position: absolute;
		top: var(--header-height);
		left: auto !important;
		max-width: 100%;
		width: var(--header-mobile-menu-width);
		right: calc(-1 * var(--header-mobile-menu-width));
		height: calc(100vh - var(--header-height));
		overflow: auto;
		opacity: 0;
		scrollbar-color: transparent transparent;
		transition: .5s;
		z-index: -1;
	}

	.header-mobile-menu .menu-header-menu-container {
		position: relative;
		height: calc(100vh - 150px);
		overflow: auto;
	}

	.toggled .header-mobile-menu {
		right: 0;
		opacity: 1;
		/* transform: translateX(50%); */
	}

	.header-mobile-menu::-webkit-scrollbar-thumb {
		background: var(--dark-color);
	}

	.header-mobile-menu::-webkit-scrollbar-track {
		background: var(--white-color);
	}

	.main-navigation ul {
		text-align: left;
		display: block;
	}

	.main-navigation ul li {
		display: block;
		margin-left: 0;
		font-size: 22px;
		line-height: 28px;
		margin-bottom: 4.4vh;
		display: flex;
		justify-content: space-between;
		flex-wrap: wrap;
		align-items: center;
	}

	.main-navigation ul li:last-child {
		margin-bottom: 0;
	}

	.main-navigation ul li a {
		font-size: 22px;
		line-height: 28px;
		padding-top: 0;
		padding-bottom: 9px;
		color: var(--white-color);
	}

	/* .main-navigation ul li.menu-item-has-children>a::after {
		color: inherit;
		top: 40%;
	} */

	.main-navigation ul ul li.menu-item-has-children>a::after {
		font-size: 16px;
	}

	.main-navigation ul li.menu-item-has-children.active-child-menu>a::after,
	.main-navigation ul li.menu-item-has-children.active-sub-menu>a::after {
		transform: translate(0, -50%) rotate(-180deg);
	}

	.main-navigation ul li.menu-item-has-children.active-sub-menu>.nav-dropdown-toggle i {
		transform: rotate(180deg);
	}

	.main-navigation ul ul {
		display: block;
		top: 0;
		left: 15px !important;
		position: relative;
		opacity: 1;
		animation: none;
		background: transparent;
		box-shadow: none;
		width: 100%;
		display: none;
		margin-top: 15px;
	}

	.main-navigation ul ul ul {
		padding-left: 0;
	}

	.main-navigation ul ul li {
		border-bottom: none;
		margin-bottom: 10px;
	}

	.main-navigation ul ul li:last-child {
		margin-bottom: 0;
	}

	.main-navigation ul ul li a {
		display: inline-block;
		border: 0;
		padding: 0;
		font-size: 16px;
	}

	.main-navigation ul ul ul li a {
		font-size: 14px;
	}

	/* Footer CSS Start */
	.footer-bottom-text,
	.copy-right,
	.footer-other-link,
	.footer-bottom-link {
		display: block;
		text-align: center;
	}

	.footer-bottom-link {
		/* margin: 15px 0; */
	}

	.footer-branding {
		display: flex;
		align-items: center;
		justify-content: space-between;
		/* flex-wrap: wrap; */
		gap: 20px;
	}

	.footer-branding p {
		margin: 0;
	}

	.footer-contact .contact-item {
		gap: 10px;
	}

	.bottom-footer-content {
		flex-direction: column;
		gap: 5px;
	}

	/* Footer CSS End */

	/* Inner Banner Section Start */
	.inner-banner-section {
		padding: calc(var(--section-gap) + 90px) 0 calc(var(--section-gap) + 40px);
	}

	.inner-banner-section .banner-experience-wp {
		left: 70%;
		transform: translateX(-30%);
	}

	/* Inner Banner Section Start */

	/* Banner Section Start */
	.banner-section {
		padding: 170px 0 0;
	}

	.banner-section .banner-form-wp {
		margin-bottom: 150px;
	}

	.banner-experience-wp {
		position: absolute;
		bottom: -1px;
		left: 50%;
		transform: translateX(-50%);
		width: max-content;
		padding: 15px;
	}

	.banner-section .banner-content .h1-title {
		font-size: 28px;
		margin-bottom: 20px;
	}

	/* Banner Section CSS End */
	/* Form CSS Start */
	.form-field .form-input {
		height: auto;
		padding: 12px 20px;
	}

	.form-field {
		margin-bottom: 20px;
	}

	.form-element i {
		top: 18px;
		right: 15px;
		font-size: 14px;
	}

	/* Form CSS End */

	/* About & Service Section CSS Start */
	.about-section .about-img,
	.service-section .service-img {
		max-width: 420px;
		aspect-ratio: 1/0.9;
	}

	.about-section .about-content,
	.service-section .service-content {
		padding: 0;
	}

	.about-section .sec-btn,
	.service-section .sec-btn {
		margin-top: 20px;
	}

	/* About & Service Section CSS End */

	/* Service List Section CSS Start */
	.service-list-section .service-box {
		max-width: 500px;
		margin: 0 auto;
	}

	/* Service List Section CSS End */

	/* Gallery Section CSS Start */

	.gallery-tabbing ul {
		gap: 15px;
	}

	.gallery-tabbing {
		max-width: 100%;
	}

	.gallery-tab-img-wp {
		margin-top: 20px;
		display: flex;
		flex-wrap: wrap;
		gap: 20px;
		justify-content: center;
	}

	.gallery_tab_content_slide .slick-list {
		width: 100%;
		order: 1;
	}

	.our-gallery-sec .slide-arrow {
		position: relative !important;
		top: auto;
		left: auto;
		right: auto;
		bottom: auto;
		transform: none;
	}

	.our-gallery-sec .slide-arrow.prev-arrow {
		order: 2;
	}

	.our-gallery-sec .slide-arrow.next-arrow {
		order: 3;
	}

	.gallery-tab-content-wp .loader {
		font-size: 22px;
	}

	.gallery-tabbing li {
		height: auto;
		line-height: 2;
	}

	/* Gallery Section CSS End */

	/* CTA Section CSS Start */
	.cta-logo {
		max-width: 160px;
		padding: 15px;
	}

	/* CTA Section CSS End */

	/* Testimonials Section CSS Start */
	.testimonial-card .testimonial-card-head i {
		font-size: 32px;
	}

	.testimonial-card .overflow-text {
		height: 110px;
	}

	.testimonial-card .star-rating {
		--font: 16px;
	}

	.testimonial-card-wp {
		margin-top: 30px;
	}

	.testimonials-section .slider-arrow-wp .slide-arrow {
		padding: 15px;
	}

	.testimonials-section .slider-arrow-wp .slide-arrow i {
		font-size: 20px;
	}

	/* Testimonials Section CSS End */

	/* Contact Section CSS Start */

	.contact-section .contact-details {
		margin-top: 30px;
	}

	.contact-section .sec-title {
		margin-bottom: 30px;
	}

	.main-contact-map .contact-map {
		aspect-ratio: 1 / 0.45;
	}

	.contact-section .contact-details .contact-icon {
		min-width: 40px;
	}

	.contact-section .contact-details .contact-icon i {
		font-size: 14px;
	}

	/* Contact Section CSS End */

	/* Contact Modal CSS Start */
	.contact-us-modal {
		max-width: 450px;
	}

	.contact-us-modal .contact-modal-content {
		padding: 20px;
		gap: 15px;
	}

	/* Contact Modal CSS End */
}

@media screen and (max-width: 767px) {
	.h1-title {
		font-size: 34px;
		margin-bottom: 30px;
	}

	.h2-title {
		font-size: 32px;
		margin-bottom: 25px;
	}

	.h3-title {
		font-size: 22px;
	}

	:root {
		--section-gap: 60px;
	}

	.toggled .header-mobile-menu {
		/* transform: translateX(30%); */
	}

	.sec-btn,
	.woocommerce #respond input#submit,
	.woocommerce a.button,
	.woocommerce button.button,
	.woocommerce input.button {
		padding: 12px 20px;
	}

	/* Inner Banner Section Start */

	.inner-banner-section .banner-experience-wp {
		left: auto;
		transform: none;
		right: 0;
	}

	.inner-banner-section .banner-experience-wp {
		padding: 10px;
	}

	/* Inner Banner Section Start */

	/* Footer CSS Start */
	.footer-branding {
		flex-wrap: wrap;
	}

	.bottom-footer-content {
		flex-wrap: wrap;
		text-align: center;
		justify-content: center;
	}

	/* Footer CSS End */

	/* CTA Section CSS Start */

	.cta-wp h2 {
		margin-bottom: 15px;
	}

	.cta-logo {
		padding: 10px;
	}

	.cta-wp {
		padding: var(--section-gap) 30px 80px;
	}

	.cta-logo {
		max-width: 140px;
	}

	/* CTA Section CSS End */

}

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

	body {
		font-size: 14px;
	}

	.h1-title {
		font-size: 32px;
		margin-bottom: 30px;
	}

	.h2-title {
		font-size: 28px;
		margin-bottom: 15px;
	}

	.h3-title {
		font-size: 20px;
	}

	.h4-title {
		font-size: 18px;
	}

	p {
		font-size: 14px;
		margin-bottom: 10px;
	}

	.paint {
		padding: 10px 20px;
	}

	.box-vector {
		--box-vector-gap: 20px;
	}

	.box-vector:after {
		border: 5px solid var(--primary-color);
	}

	:root {
		--space-80: 50px;
		--section-gap: 50px;
	}

	.page-numbers li a,
	.page-numbers li,
	span.page-numbers,
	.page-numbers {
		width: 30px !important;
	}

	.privacy-content h2,
	.entry-content h2 {
		font-size: 20px;
	}

	.header-mobile-menu {
		/* padding: 16.3vh 20px 30px 20px; */
	}

	.toggled .header-mobile-menu {
		/* transform: translateX(0%); */
	}


	.main-navigation ul li,
	.main-navigation ul li a {
		font-size: 18px;
		line-height: 24px;
	}

	.main-navigation ul ul li,
	.main-navigation ul ul li a {
		font-size: 14px;
	}

	.site-header .navbar-nav {
		padding: 10px 5px;
	}

	/* .main-navigation ul li.menu-item-has-children>a::after {
		font-size: 12px;
	} */

	.menu-toggle span {
		margin-bottom: 5px;
		height: 4px;
	}

	.menu-toggle {
		width: 30px;
	}

	.menu-toggle {
		--menu-toggle-space: 9px;
	}

	.main-navigation ul ul li.menu-item-has-children::after {
		font-size: 13px;
	}

	.main-navigation ul ul,
	.main-navigation ul li.menu-item-has-children:hover ul {
		left: 10px !important;
		margin-top: 10px;
	}

	.header-contact .icon-box-content {
		display: none;
	}

	.top-footer {
		padding: calc(var(--section-gap)) 0;
	}

	.site-footer {
		border-top: 5px solid var(--primary-color);
	}

	/* Form Start */
	.form-field .form-input {
		padding: 10px 15px;
	}

	.form-field {
		margin-bottom: 15px;
	}

	span.wpcf7-not-valid-tip {
		margin-bottom: -10px;
	}

	.form-input::placeholder,
	.input-text::placeholder,
	.form-field .form-input {
		font-size: 14px;
	}

	/* Form End */

	/* Banner Section CSS Start */
	.banner-section {
		/* padding: 110px 0 0; */
	}

	.banner-section .banner-form-wp {
		margin-bottom: 120px;
	}

	.banner-experience-wp .info-box .experience-content p {
		font-size: 14px;
	}

	/* Banner Section CSS End */

	/* About Section CSS Start */
	.about-section .about-content ul li {
		font-size: 14px;
		margin-bottom: 5px;
	}

	.about-section .about-content ul {
		margin: 10px 0;
	}

	/* About Section CSS End */

	/* Gallery Section CSS Start */
	.gallery-tabbing ul {
		gap: 10px;
	}

	.gallery-tabbing li {
		font-size: 14px;
		padding: 2px 10px;
	}

	/* Gallery Section CSS End */

	/* CTA Section CSS Start */
	.cta-wp {
		padding: var(--section-gap) 20px 80px;
	}

	.cta-content .tag-line {
		font-size: 14px;
	}

	.text-lg p {
		font-size: 16px;
	}

	/* CTA Section CSS End */

	/* Testimonials Section CSS Start */
	.testimonial-card .overflow-text {
		height: 120px;
	}

	.testimonial-card .testimonial-card-head i {
		font-size: 28px;
	}

	.testimonial-card .star-rating {
		--font: 14px;
	}

	.testimonial-card .desc p {
		font-size: 14px;
	}

	.testimonial-card {
		padding: 20px;
	}

	.testimonials-section .sec-title {
		align-items: start;
		flex-direction: column;
		gap: 15px;
	}

	.testimonial-card-wp {
		margin-top: 20px;
	}

	/* Testimonials Section CSS End */

	/* SEO Page CSS Start */
	.excerpt-content ul li {
		font-size: 14px;
	}

	/* SEO Page CSS End */
	/* Contact Modal CSS Start */

	.contact-us-modal .contact-modal-content {
		padding: 15px;
		gap: 10px;
	}

	/* Contact Modal CSS End */
}

@media screen and (max-width: 400px) {
	.site-branding {
		left: 15px;
	}

	.h2-title {
		font-size: 26px;
	}

	/* 
	.menu-toggle {
		right: 15px;
	} */

	.form-input,
	.input-text,
	.select2-container--default .select2-selection--single .select2-selection__rendered,
	select {
		padding: 0 15px;
	}

	.form-input.wpcf7-textarea {
		padding: 15px;
	}

	.form-element i {
		right: 10px;
	}

	.popup-title {
		padding: 10px 65px 10px 15px;
	}

	/* Banner Section CSS Start */
	.banner-experience-wp {
		max-width: 280px;
	}

	/* Banner Section CSS End */

	/* Service Section CSS Start */
	.service-list-section .service-box .service-contant {
		min-height: 320px;
	}

	/* Service Section CSS End */
}

/*==========Responsive End==========*/