/*
 Theme Name:   Beanstalk Web Solutions - Highend Child 
 Theme URI:    http://hb-themes.com/themes/highend/
 Description:  Premium Responsive Multi-Purpose Theme.
 Author: Beanstalk Web Solutions
 Author URI: http://beanstalkwebsolutions.com
 Template:     HighendWP
 Version: 3.2.2
 License: GNU General Public License version 3.0
 License URI: http://www.gnu.org/licenses/gpl-3.0.html
 Details URI: http://hb-themes.com/changelog/highend/

 Developed and designed by beanstalkwebsolutions.com.
 All files, unless otherwise stated, are released under the GNU General Public License
 version 3.0 (http://www.gnu.org/licenses/gpl-3.0.html
-----------------------------------------------------------------------------------*/

/* ==========================================================================
   CONTENTS
   1. Header & main navigation
   2. Mobile menu
   3. Layout fixes
   4. Footer
   5. WooCommerce
   6. Meetings (12 Step Meeting List)
   7. Slider
   8. Buttons
   9. Form controls
   10. Utility classes
   ========================================================================== */


/* ==========================================================================
   1. HEADER & MAIN NAVIGATION
   ========================================================================== */

/* Current + hovered top-level items.
   !important and the extra specificity are required: the Customizer writes
   "color:#ffffff !important" into uploads/highend/dynamic-styles.css, which
   would otherwise leave this text white on the theme's #f4f4f4 hover box. */
html body #main-wrapper #main-nav > li.current-menu-item > a,
html body #main-wrapper #main-nav > li.sfHover > a,
html body #main-wrapper #main-nav > li > a:hover,
.highend-sticky-header #main-wrapper #header-inner #main-nav > li.current-menu-item > a,
.highend-sticky-header #main-wrapper #header-inner #main-nav > li.sfHover > a,
.highend-sticky-header #main-wrapper #header-inner #main-nav > li > a:hover {
	color: #e22029 !important;
}

/* Menu-item underline. The theme's default-skin draws a 2px rule under every
   item's <span> (#eee normally, accent colour on hover/current). Kept at 2px but
   transparent so nothing shifts; !important is needed because the hover/current
   colour is written into uploads/highend/dynamic-styles.css. */
#main-nav > li > a > span {
	border-bottom-color: transparent !important;
}

/* Hamburger toggle. The theme's generic "a { color:#111 }" applies here
   because #show-nav-menu declares no colour of its own; an ID beats it. */
#show-nav-menu,
#show-nav-menu i {
	color: #ffffff;
}

/* Swap desktop nav for the hamburger below 1305px. */
@media screen and (max-width: 1305px) {
	#logo .hb-visible-logo img.default {
		display: none !important;
	}
	#main-nav {
		display: none;
	}
	#show-nav-menu {
		display: inline-block;
	}
}


/* ==========================================================================
   2. MOBILE MENU
   ========================================================================== */

#mobile-menu-wrap {
	background: #1e73be;
}

/* Allow long menus to scroll on short screens. */
.menu-mobile-container {
	overflow: scroll;
	-webkit-overflow-scrolling: touch;
}

#menu-mobile {
	padding-bottom: 100px;
}


/* ==========================================================================
   3. LAYOUT FIXES
   ========================================================================== */

/* NOTE: originally written as "padding-top: 0; !important;" — the stray
   !important sat after the semicolon, so the browser discarded it and this
   has always applied WITHOUT !important. Left as-is to preserve behaviour;
   add "!important" to the declaration if it was meant to force the override. */
.home #main-content {
	padding-top: 0;
}

/* Pull the first full-width section on the home page up under the slider. */
#page-6 > div > div.fw-section.hb-fw-57f41d3e1e4a1.without-border.no-overlay {
	margin-top: -50px !important;
}


/* ==========================================================================
   4. FOOTER
   ========================================================================== */

#footer {
	display: block;
	padding: 20px 0 0px 0;
	background-color: rgb(80, 118, 162);
	-webkit-backface-visibility: hidden;
}

#pre-footer-area .hb-button:hover {
	background: #9e2c2c;
}

.normal-copyright #copyright-text {
	float: none;
}


/* ==========================================================================
   5. WOOCOMMERCE
   ========================================================================== */

/* Hide the shop archive title on page 240 (two selectors cover both
   markup depths the theme emits). */
#page-240 > div > header > h1.woocommerce-products-header__title.page-title,
#page-240 > header > h1.woocommerce-products-header__title.page-title {
	display: none !important;
}

.hb-woo-wrapper {
	width: 60% !important;
	padding-left: 20% !important;
}

.hb-woo-single-images {
	width: 300px !important;
	max-height: 300px;
}

/* Hide the "like" button on products. */
.like-holder.like-button {
	display: none !important;
}


/* ==========================================================================
   6. MEETINGS (12 Step Meeting List)
   ========================================================================== */

body.post-type-archive-tsml_meeting .hb-image-background {
	display: none;
}

@media screen and (max-width: 480px) {
	#tsml > #meetings {
		padding-left: 15px !important;
		padding-right: 15px !important;
	}
}


/* ==========================================================================
   7. SLIDER
   ========================================================================== */

@media screen and (max-width: 767px) {
	.sliderText {
		font-size: 16px !important;
		line-height: 16px !important;
		text-shadow: black 2px 2px;
	}
	.sliderBut {
		margin-top: 12% !important;
	}
	.pream {
		display: none !important;
	}
}


/* ==========================================================================
   8. BUTTONS
   ========================================================================== */

.but1 {
	border: white 5px solid;
	border-radius: 5px;
	padding: 5px;
}

@media screen and (max-width: 600px) {
	.but1 {
		font-size: 18px;
	}
}

/* Button pairs laid out side by side. */
.btn-pair .wpb_wrapper {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	align-items: center;
	gap: 10px;
}

.btn-pair .vc_btn3-container {
	margin: 0 !important;
}

/* WPBakery "danger" modern button. */
.vc_btn3.vc_btn3-color-danger.vc_btn3-style-modern {
	background-color: rgb(226, 32, 41) !important;
}

.vc_btn3.vc_btn3-color-danger.vc_btn3-style-modern:hover,
.vc_btn3.vc_btn3-color-danger.vc_btn3-style-modern:active,
.vc_btn3.vc_btn3-color-danger.vc_btn3-style-modern:focus {
	background-color: #ff4b3c !important;
}


/* ==========================================================================
   9. FORM CONTROLS
   ========================================================================== */

/* Strip the spinner arrows from number inputs. */
input[type=number]::-webkit-outer-spin-button,
input[type=number]::-webkit-inner-spin-button {
	-webkit-appearance: none;
	margin: 0;
}

input[type=number] {
	-moz-appearance: textfield;
}


/* ==========================================================================
   10. UTILITY CLASSES
   Applied from the page builder / content editor.
   ========================================================================== */

/* --- Alignment --- */
.center,
.ctr {
	text-align: center;
}

.jstfy {
	text-align: justify;
}

.nowrap {
	white-space: nowrap;
}

/* --- Weight & style --- */
.b {
	font-weight: bold;
}

.em {
	font-style: italic;
}

/* --- Colours --- */
.gry {
	color: #7F7F7F;
	line-height: 1.8em;
}

.grn {
	color: #6BC057;
}

.wht {
	color: #fff;
}

/* --- Font sizes --- */
.fs10 {
	font-size: 10px;
	line-height: 1em;
}

.fs15 {
	font-size: 15px;
	line-height: 1.2em;
}

.fs20 {
	font-size: 20px;
	line-height: 1.2em;
}

.fs25 {
	font-size: 25px;
	line-height: 1.2em;
}

.fs30 {
	font-size: 30px;
	line-height: 1.2em;
}

.fs33 {
	font-size: 33px;
	line-height: 40px;
	font-weight: 300;
}

.fs35 {
	font-size: 35px;
	line-height: 1.2em;
}

.fs40 {
	font-size: 40px;
	line-height: 1.2em;
}