:root {
	--best-red: #a50a24;
	--best-green: #0d4f01;
	--best-secondary: #195cb0;
}

body {
	font-family: 'Roboto', sans-serif;
	color: #404040;
	background: #fff;
	margin: 0;
	overflow-x: hidden;
	overflow-y: scroll;
}

a {
	color: #383838;
}

a:hover,
a:focus {
	color: var(--best-red);
}

.h1,
.h2,
.h3,
.h4,
.h5,
.h6,
h1,
h2,
h3,
h4,
h5,
h6,
#main-nav {
	font-family: 'Poppins', sans-serif;
}

/* Helper css */
.btn {
	transition: all 0.2s ease;
}
.btn.rounded,
img.rounded {
	border-radius: 6px !important;
	margin: 0 !important;
}

.btn.btn-best-red {
	background-color: var(--best-red) !important;
}

.btn.btn-best-red:hover {
	background-color: #770317 !important;
	box-shadow: 0px 12px 18px -6px rgb(0 0 0);
	transform: translate(-2px);
}

.btn.btn-best-white {
	background-color: #ffffff !important;
	color: #000000;
}

.btn.btn-best-white:hover {
	background-color: #ff6600 !important;
	box-shadow: 0px 12px 18px -6px rgb(0 0 0);
	transform: translate(-2px);
	color: #ffffff;
}

.text-uppercase {
	text-transform: uppercase;
}

.text-small-875 {
	font-size: 0.875rem;
}

.text-white {
	color: #ffffff !important;
}

.text-best-red {
	color: var(--best-red) !important;
}

.text-best-green {
	color: var(--best-green) !important;
}

.text-best-blue{
	color: var(--best-secondary) !important;
}

.font-weight-700 {
	font-weight: 700 !important;
}

.font-weight-800 {
	font-weight: 800 !important;
}

.best-red {
	color: var(--best-red) !important;
}

.has-underscore,
.has-side-score {
	position: relative;
	padding-bottom: 0.35em;
}

.has-underscore::after,
.has-side-score::after {
	content: '';
	position: absolute;
	height: 2px;
	bottom: 0;
}

.best-red.has-underscore::after {
	background: var(--best-red);
}

.text-white.has-underscore::after {
	background: #ffffff;
}

.has-side-score::after {
	left: 0;
	width: 2.5rem;
}

.has-underscore::after {
	left: 50%;
	transform: translate(-50%, -50%);
	width: 5rem;
	background-color: black;
}

.margin-xsmall {
	margin-top: 0.5em;
	margin-bottom: 0.5em;
}

.margin-small {
	margin-top: 1em;
	margin-bottom: 1em;
}

.padding-small {
	padding-top: 1em;
	padding-bottom: 1em;
}

.margin-medium {
	margin-top: 2em;
	margin-bottom: 2em;
}

.padding-medium {
	padding-top: 2em;
	padding-bottom: 2em;
}

.margin-large {
	margin-top: 3.5em;
	margin-bottom: 3.5em;
}

.padding-large {
	padding-top: 3.5em;
	padding-bottom: 3.5em;
}

.margin-xlarge {
	margin-top: 4.5em;
	margin-bottom: 4.5em;
}

.padding-xlarge {
	padding-top: 4.5em;
	padding-bottom: 4.5em;
}

.padding-b-small {
	padding-bottom: 1em;
}

.padding-b-medium {
	padding-bottom: 2em;
}

.padding-t-medium {
	padding-top: 2em;
}

.custom-logo {
	width: 85px;
	max-width: 95px;
}

.custom-logo-link {
	padding: 0.7rem 0 !important;
}

.top-info {
	border-bottom: 1px solid #ededed;
}

.top-info-left ul li:first-child a {
	padding-left: 0 !important;
}

.top-info-right ul li:last-child a {
	padding-right: 0 !important;
}

.top-info-left i,
.top-info-right i {
	color: var(--best-red);
}

/*  Main nav style */
#main-nav.menu .active > a {
	background-color: transparent;
	color: var(--best-red);
}

#main-nav.menu .active:nth-child(2) > a {
	background-color: transparent;
	color: initial;
}

#main-nav.menu .active:nth-child(2) > a:hover {
	color: var(--best-red);
}

#menu-item-8.active > a {
	background-color: transparent;
	color: #383838 !important;
}

#menu-item-8.active {
	border-bottom: 0 !important;
}

#main-nav.menu .active:not(:nth-child(2)) {
	border-bottom: 3px solid var(--best-red);
}

#main-nav.menu a {
	font-weight: 600;
	padding: 1rem 0.85rem;
}

#footer-links-2 a,
#footer-links-2 a:hover {
	color: inherit;
	background-color: transparent;
}

/* addtional sticky css */

.sticky.is-stuck.is-at-top {
	background: rgb(255 255 255 / 85%);
}

.hero-banner {
	height: calc(100vh - 145.78px);
	background-image: linear-gradient(
			to bottom,
			rgba(0, 0, 0, 0.3),
			rgba(0, 0, 0, 0.3)
		),
		url('/wp-content/uploads/2024/08/sydney_property_inspector.jpg');

	background-repeat: no-repeat;
	background-size: cover;
	background-position: top center;
}

.hero-banner > div,
.hero-banner > div > div {
	height: 100%;
}

.frontpage-btn-contact {
	display: flex;
	align-items: center;
	flex-direction: column;
	justify-content: space-between;
}

/* frontpage quick contact form */
.quick-quote-form [type='text'],
.quick-quote-form [type='email'],
.quick-quote-form select,
.quick-quote-form textarea[rows] {
	height: 50px;
	margin-bottom: 0;
	border-radius: 6px;
	border: 1px solid #dbdbdb;
	box-shadow: none;
}

.quick-quote-form label {
	font-family: 'Poppins', sans-serif;
}

.free-quote-section {
	background-color: #f4f4f4;
}

/* footer */
footer {
	font-size: 85%;
}

#footer-links li a,
#footer-links-2 li a,
#footer-contact li a {
	padding: 0.5rem 0;
}

#footer-links li.active > a {
	background: none;
	color: inherit;
}

footer h5 {
	margin-bottom: 1.5em;
}

ul.off-canvas-menu li > a {
	position: absolute;
	right: 0;
	top: 25px;
}

.nav-burger {
	width: 1.75rem;
	height: 3px;
	background-color: #a50a24;
	margin: 5px 0;
}

.frontpage-pricing {
	background-color: var(--best-red);
}

.frontpage-pricing .card {
	border-radius: 8px;
	box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.15) !important;
	position: relative;
	margin-bottom: 4rem;
}

.frontpage-pricing h6 {
	letter-spacing: 0.2rem;
}

/** 

  Innerpage

*/

.innerpage-hero {
	background-size: cover;
	background-position: center center;
	background-repeat: no-repeat;
	height: 350px;
	max-height: 350px;
}

.innerpage-hero > div,
.innerpage-hero > div > div {
	height: 100%;
}

#main-nav {
	justify-content: space-between;
}

#main-nav.menu .menu-item-8.active,
#main-nav.menu .menu-item-11.active {
	border-bottom: 0;
}

#main-nav.menu .menu-item-8.active > a,
#main-nav.menu .menu-item-11.active > a {
	color: inherit;
}

#main-nav.menu .menu-item-11.active > a:hover {
	color: var(--best-red);
}

.off-canvas {
	padding: 1rem;
}

#offcanvas-nav {
	padding: 1rem;
	border-radius: 10px;
	background-color: var(--best-red);
}

#offcanvas-nav.menu li > a,
#offcanvas-nav.menu li.menu-item-8 > a,
#offcanvas-nav.menu li.menu-item-8.active > a #offcanvas-nav.menu .active > a {
	color: #ffffff !important;
	background: none !important;
}

.footer {
	border-top: 1px solid #f4f4f4;
}

.services-offered {
	color: #ffffff;
}

.services-offered .service-item {
	height: 100%;
	align-content: center;
}

/* Media Query */

@media all and (min-width: 63.9375em) {
	.frontpage-btn-contact {
		flex-direction: row;
	}
}
