/*
Theme Name: 		Killar Child
Theme URI: 			https://killar.templateoption.com/
Author: 			WTTechDesign Team
Author URI: 		https://www.webtwine.com/
Description: 		killar is ThemeForest WordPress Premium Theme.
Version: 			1.0.0
Requires at least: 	5.9
Tested up to: 		6.0
Requires PHP: 		7
License: 			Themeforest Commercial Licence
License URI: 		https://themeforest.net/licenses/standard
Tags: 				flexible-header, one-column, two-columns, left-sidebar, right-sidebar, custom-colors, custom-menu, editor-style, featured-images, featured-image-header,, full-width-template, microformats, post-formats, theme-options, threaded-comments, translation-ready, blog, shop
Template:     		killar
Text Domain: 		killar-child

Theme Custom CSS starts here
------------------------------------------------------------ */
/* Brand colours. Red: the logo's red, and the shades derived from it (80 % of
   it; 30 % and 85 % of the way to white). Navy: Elementor's "Marine", and
   80 % of it. The Customizer's colours and
   Elementor's global colours use the same values. */
:root {
	--qp-red: #db0e16;
	--qp-red-dark: #af0b12;
	--qp-red-light: #e6565c;
	--qp-red-pale: #fadbdc;
	--qp-navy: #0f2b4c;
	--qp-navy-dark: #0c223d;
}

/* Fixed logo width: the logo SVGs only size reliably in every browser with an
   explicit width (a percentage width collapses in Firefox's flex header). */
.nav-brand img {
	width: 160px;
	max-width: none;
	height: auto;
}

@media (max-width: 992px) {
	.nav-brand img {
		width: 150px;
	}
}

@media (max-width: 500px) {
	.nav-brand img {
		width: 115px;
	}
}

/* Site-wide adjustments to the Killar theme (formerly in the Customizer's
   "Additional CSS"). */
.bg-primary {
	background-color: var(--qp-red-dark) !important;
}

.single-post h2 {
	margin: 2.5rem 0 0.5rem;
	font-size: 1.8rem;
}

.nav-menus-wrapper {
	padding-left: 20px;
}

.nav-menu.nav-menu-social li a.sign-in-link,
.nav-menu.nav-menu-social li a.login-register-action {
	font-size: 16px;
	font-weight: 500;
}

/* The French menu fits on one line in the 960 px container. */
@media (min-width: 992px) and (max-width: 1199px) {
	.nav-menu > li > a {
		padding-right: 7px !important;
		padding-left: 7px !important;
	}
}

.mobile_nav a {
	white-space: nowrap;
}

/* Phones: icons only; the label stays for screen readers. */
@media (max-width: 575px) {
	.mobile_nav a.login-register-action {
		padding: 0.5rem;
		font-size: 0;
	}

	.mobile_nav a.login-register-action i {
		margin-right: 0 !important;
		font-size: 1.1rem;
	}
}

.nav-menu > .active > a,
.nav-menu > .focus > a,
.nav-menu > li:hover > a {
	color: var(--qp-red);
}

.sidebar-widget ul.kwt-posts li {
	align-items: flex-start;
}

.banner-home-post {
	height: 400px;
	background-size: cover;
	background-position: 50% 30%;
}

.nav-menu > li > a,
.btn,
.btn-remove2,
.button,
.comment-edit-link,
.comment-edit-link:hover,
input[type=button],
input[type=submit]:not(.btn) {
	text-transform: none;
}

.page-header.bg-primary .breadcrumb a {
	color: #fff;
}

.single-post-meta .post-author {
	display: none;
}

/* White title on the blog page (Business marketing). */
body.blog h1 {
	color: #ffffff !important;
}

/* Home page (formerly custom CSS on Elementor elements, matched here by
   element ID, which the French translation shares). */
.logo-gauche {
	margin-left: 0 !important;
	margin-right: auto !important;
	text-align: left !important;
}

/* Hero: its text starts at the container's left edge, like the header's
   logo. Negative offsets (here and in the Elementor settings of the logo
   and heading) pushed it off narrow screens. */
.elementor-element-44d2e130 > .elementor-container {
	justify-content: flex-start;
}

.elementor-element.elementor-element-67171440,
.elementor-element.elementor-element-6ec26909 > .elementor-widget-container {
	margin-left: 0 !important;
}

@media (max-width: 1199px) {
	.elementor-element-6ec26909 h4 br {
		display: none;
	}
}

@media (max-width: 767px) {
	.elementor-element.elementor-element-44d2e130 {
		padding: 0 6px !important;
	}
}

.elementor-element.elementor-element-5c22199b {
	margin-left: 0 !important;
	margin-right: auto !important;
	max-width: 560px !important;
}

.elementor-element.elementor-element-2f258af0 {
	opacity: 0;
}

.home .entry-read-more a,
.home .entry-read-more a * {
	color: #0f2a4a !important;
	text-transform: none !important;
}

/* About page. */
.elementor-element.elementor-element-6042b7b h2,
.elementor-element.elementor-element-a1b7c5d h2 {
	margin: 2rem 0 0.5rem;
	font-weight: 500;
}

.elementor-element.elementor-element-3b514f5 p,
.elementor-element.elementor-element-3b514f5 li {
	font-family: "Inter", sans-serif;
	color: #333;
}

/* Privacy Policy and Terms of Use. */
.elementor-element.elementor-element-165a89c h2 {
	font-size: 1.5rem;
	color: #222;
	margin: 2rem 0 0.5rem;
}

/* Pricing: English / French credits toggle. */
.slideToggle .beforeinput,
.slideToggle .afterinput {
	color: #222222 !important;
}

.slideToggle .form-switch:not(:has(input:checked)) .beforeinput,
.slideToggle .form-switch:has(input:checked) .afterinput {
	color: var(--qp-red-dark) !important;
}

.slideToggle .form-switch i::after,
.slideToggle .form-switch input:checked + i::after {
	background-color: var(--qp-red-dark) !important;
}

.slideToggle .form-switch input:checked + i {
	background-color: var(--qp-red-pale) !important;
	border-color: var(--qp-red-pale) !important;
}

/* Blog sidebar blocks (Appearance > Widgets > Blog Sidebar). */
.qp-sidebar-heading {
	margin-top: 30px;
}

.qp-sidebar-button {
	display: inline-block;
	background: var(--qp-red);
	color: #ffffff;
	padding: 10px 22px;
	border-radius: 5px;
	text-decoration: none;
	font-weight: 600;
}

.qp-sidebar-button:hover,
.qp-sidebar-button:focus {
	background: var(--qp-red-dark);
	color: #ffffff;
}

/* "Sign in to your dashboard" page. */
.qp-signin-heading {
	color: var(--qp-navy);
}

.qp-signin-button {
	display: inline-block;
	background: var(--qp-red);
	color: #fff;
	padding: 12px 26px;
	border-radius: 6px;
	font-weight: 600;
	text-decoration: none;
	margin: 8px 10px 8px 0;
}

.qp-signin-button:hover,
.qp-signin-button:focus {
	background: var(--qp-red-dark);
	color: #fff;
}

.qp-signin-button--secondary {
	background: var(--qp-navy);
	margin-right: 0;
}

.qp-signin-button--secondary:hover,
.qp-signin-button--secondary:focus {
	background: var(--qp-navy-dark);
}

/* Pricing page: credit pack cards ([qp_credit_packs]), spaced like the
   Elementor columns they replace. */
.qp-credit-packs {
	--bs-gutter-x: 20px;
	/* A row-gap rather than Bootstrap's vertical gutter, whose negative top
	   margin made the cards cover the credit type switch above them. */
	--bs-gutter-y: 0;
	row-gap: 65px;
}

/* The parent theme gives the phone and email of the order details
   (dashboard > Invoices > an invoice) icon codes without an icon font:
   use Font Awesome's phone and envelope. */
.woocommerce-customer-details .woocommerce-customer-details--phone:before,
.woocommerce-customer-details .woocommerce-customer-details--email:before {
	font-family: "Font Awesome 6 Free";
	font-weight: 900;
	margin-right: 8px;
}

.woocommerce-customer-details .woocommerce-customer-details--phone:before {
	content: "\f095";
}

.woocommerce-customer-details .woocommerce-customer-details--email:before {
	content: "\f0e0";
}