/*
Theme Name: Seven Hills Theme
Theme URI: https://designtlc.com
Version: 1.12
Description: An child theme for 7 Hill School
Author: Design TLC
Author URI: https://designtlc.com
template: bb-theme
*/

/* Add your custom styles here... */ 
/* Put @import here for loading fonts */



/* ------------------ ROOT VARIABLES ------------------ */
:root {

  /* ------------------ Colors ------------------ */
  --white: #ffffff;
  --link-color: #075269;
  --link-hover: #000000;
  --bg-color-dark: #000000;
  --bg-color-light: #F3F6F7;
  --gold: #fbaa19;
  --teal: #075269;
  --turquoise: #037f8c;
  --yellow: #ffcd00;
  --warm-gray: #434343;

  /* ------------------ Typefaces ------------------ */
  --font-sans: 'Nunito Sans', sans-serif;
  --font-serif: 'Lora', serif;

  /* ------------------ Type Sizes ------------------ */
  --size-default: 1rem;

}

/* ---- Fix fonts that render as bold in Firefox ------------------ */

@-moz-document url-prefix() {
	body {
		font-weight: lighter !important;
	}
}

/* WP HELP DOCS */
#cws-wp-help-listing-wrap ul.children.ui-sortable a {
    font-weight: 400!important;
    color: #2271b1!important;
}

#cws-wp-help-listing ul li a {
    text-decoration: none;
    font-weight: 600!important;
    color: #000!important;
}

  #cookie-law-info-bar[style*="display:none"],
  .cli-bar-container[style*="display:none"] {
    pointer-events: none;
  }

/* ------------------ FONT STYLES and HEADINGS ------------------ */
	html {
		-moz-osx-font-smoothing: grayscale;
		-webkit-font-smoothing: antialiased;
		font-smoothing: antialiased;
		font-weight: 400;
		font-size: 16px !important;
		hanging-punctuation: first last;
	}
	
    .fl-builder-content .fl-button {
        transition: background-color 0.3s ease;
    }

    html body {
        font size: 18px;
        line-height:1.45; 
    }

    
/* THIS MAY NOT BE NEEDED IF THIS IS SET IN GLOBAL BB */
    .fl-rich-text { 
        /*margin-bottom:px;*/
    }
    
/* THIS MAY NEED TO BE .page-title h1 */
    h1.fl-heading, h1.subpage-title .fl-heading { 
        color: var(--teal);
    }

	.subpage-title h1.pp-infobox-title {
		border-top: 2px solid var(--teal);
		padding-top: 20px;
	}

	.toppage-title .pp-infobox {
		display: inline-block;
		width: fit-content;
		max-width: 100%;
		box-sizing: border-box;
/*      border: 2px solid #fff;*/
		min-width: 325px;
	}

	.toppage-title h1.pp-infobox-title {
		border-top: 2px solid #fff;
		padding-top: 20px;
	}
    
    h1.page-title .fl-heading { 
        color: var(--white);
    }

	.page-title-mobile {
    	font-weight: 700;
	}

    h3.fl-heading {
    	color: var(--teal);
		margin-bottom: 0!important
	}   
	
	h2.section-heading {
		color: var(--white, #fff);
		text-align: center;
/* 		font-family: Lora; */
		font-size: 2.625rem;
		font-style: normal;
		font-weight: 700;
		line-height: normal;
	}
	h2.section-heading span {
		color: var(--yellow);
	}
	
/*-----------SUBPAGE TITLE MENU BOX ON TABLET AND MOBLE -----------------*/

.toppage-title-col-inner {
    border: #fff solid 2px;
}

/* Keep button itself transparent */
.toppage-menu-mobile .pp-advanced-menu-mobile-toggle,.subpage-menu-mobile .pp-advanced-menu-mobile-toggle{
	background: transparent;
	display: flex;
	align-items: center;
	gap: 12px;
}

/* Gold box behind hamburger icon only */
.toppage-menu-mobile .pp-hamburger,.subpage-menu-mobile .pp-hamburger{
	background: var(--gold);
	width: 50px;
	height: 50px;
	display: flex;
	align-items: center;
	justify-content: center;
	box-sizing: border-box;
}

/* Optional: tighten the icon itself */
.toppage-menu-mobile .pp-hamburger-box,.subpage-menu-mobile .pp-hamburger-box{
  	width: 22px;
  	height: 16px;
}

/* Make hamburger bars black */
.toppage-menu-mobile .pp-hamburger-inner,
.toppage-menu-mobile .pp-hamburger-inner::before,
.toppage-menu-mobile .pp-hamburger-inner::after,
.subpage-menu-mobile .pp-hamburger-inner,
.subpage-menu-mobile .pp-hamburger-inner::before,
.subpage-menu-mobile .pp-hamburger-inner::after{
  	background-color: #000;
}

.subpage-menu-mobile .pp-advanced-menu-mobile-toggle-label {
    font-family: 'Lora', serif;
    font-weight: 700;
    font-size: 20px;
    color: var(--teal)!important;
}

.toppage-menu-mobile .pp-advanced-menu-mobile-toggle-label {
    font-family: 'Lora', serif;
    font-weight: 700;
    font-size: 20px;
    color: #fff!important;
}

.toppage-menu-mobile 
.pp-advanced-menu-mobile:has(.pp-advanced-menu-mobile-toggle.pp-active),.subpage-menu-mobile 
.pp-advanced-menu-mobile:has(.pp-advanced-menu-mobile-toggle.pp-active) {
    background: var(--teal);
}

/* Remove top gap ONLY when menu is open */
.toppage-menu-mobile 
.pp-advanced-menu-mobile:has(.pp-advanced-menu-mobile-toggle.pp-active) 
+ .pp-clear 
+ .pp-menu-nav .menu, .subpage-menu-mobile 
.pp-advanced-menu-mobile:has(.pp-advanced-menu-mobile-toggle.pp-active) 
+ .pp-clear 
+ .pp-menu-nav .menu {
    margin-top: 0 !important;
}

.subpage-title-col {
    transition: background 0.25s ease;
}

@media only screen and (max-width: 1024px) {
	.subpage-title-col:has(.pp-advanced-menu-mobile-toggle.pp-active){
		background: var(--teal);
		border: #fff solid 2px;
	}

	.subpage-title-col-inner:has(.pp-advanced-menu-mobile-toggle.pp-active){
		border: none;
	}
	
  	.toppage-menu-mobile li.parent-page, .subpage-menu-mobile li.parent-page{
    	display: none !important;
  	}
}

/* Hide the heading only when open */
.subpage-title-col:has(.pp-advanced-menu-mobile-toggle.pp-active) .page-title-mobile, .subpage-title-col:has(.pp-advanced-menu-mobile-toggle.pp-active) .subpage-title-line {
	display: none;
}

/*------------SUBPAGE LAYOUT -----------------------------*/
	.subpage-title .pp-infobox {
		display: inline-block;
		width: fit-content;
		max-width: 100%;
		box-sizing: border-box;
		border: 2px solid var(--teal);
		min-width: 325px;
	}

	.subpage-title h1.pp-infobox-title {
		border-top: 2px solid var(--teal);
		padding-top: 20px;
	}

	.submenu-col {
		max-width: 325px;
	}

	.subpage-top-row {
		margin:0;
		padding: 80px 0 80px 100px;
	}


/*-------------QUOTE IN SIDEBAR --------------*/
.quote-sidebar,
.quote-sidebar .fl-module-content,
.quote-sidebar .fl-post-grid-post,
.quote-sidebar .fl-post-column {
    margin-top: 0 !important;
    margin-bottom: 0 !important;
}

.quote-sidebar {
	border-top: solid 20px #f3f6f7;
	border-bottom: solid 20px #f3f6f7;
}

.quote-sidebar .fl-post-grid-post p {
    font-size: 18px;
    font-style: italic;
    font-family: "Lora", serif;
    color: var(--teal) !important;
    font-weight: 400;
}

.quote-sidebar .quote {
		padding: 40px 40px 0 40px;
}

.quote-sidebar .quote p::before {
    content: "“";
    	color: var(--teal);
}

.quote-sidebar .quote p::after {
    content: "”";
    	color: var(--teal)!important;
}

.quote-sidebar .source {
    color: var(--teal)!important;
    font-size: 14px;
    text-align: right;
	font-weight: 400;
	padding: 0 40px 40px 40px;
}


/* ------------------ HEADER ------------------ */

li.decorate-accessibility.astm-search-menu.is-menu.sliding.menu-item {
    display: inline-block;
}
.astm-search-menu svg {
	transform: translateY(3px);
}

/* ------------------ FOOTER ------------------ */

	.footer h2 {
	}

	.fl-module.fl-module-heading.footer h2 {
	}

/* ------------------ INTERIOR-SIDEBAR NAVIGATION ------------------ */
    .sidebar-menu {
		border: var(--yellow) solid 2px;
    }

    .parent-page a {
		font-family: 'Lora', serif;
		font-weight: 700;
		font-size: 30px;
		display: block;
		margin-bottom: 16px;
    }

	.sidebar-menu ul {
		padding: 30px;
	}

.sidebar-menu .sub-menu li {
	margin-left: 20px;
	padding:0;
	padding-top:0;
	border-bottom: none!important;
}

/* Sidebar menus only — remove vertical padding on submenu links */
.sidebar-menu .sub-menu a {
    padding-top: 0 !important;
    padding-bottom: 0 !important;
}
.sidebar-menu ul.sub-menu {
  padding-top: 0 !important;
  padding-bottom: 20px !important;
}

	.sidebar-menu .fl-menu .fl-toggle-arrows .fl-menu-toggle:before {
    	border-color: #fff!important;
	}

	.sidebar-menu li:not(.parent-page) {
		border-bottom: 1px solid #fff;
		text-indent: 10px;
	}

    .sidebar-menu li.current-menu-item > a,
	.sidebar-menu li.current_page_item > a,
	.sidebar-menu li.current-menu-ancestor > a {
    	color: var(--yellow) !important;
	}

/* ------------------ BUTTONS ------------------ */
   	html body .cls-button a.fl-button,  
	html body .cls-buttona.fl-button:visited {
		border: 2px solid #000;
		background-color: var(--yellow);
		padding-top: 17px;
  		padding-bottom: 17px;
	}
	html body .cls-button a.fl-button .fl-button-text {
		color: #000;
		text-align: center;
		font-family: var(--font-sans);
		font-size: 1.125rem;
		font-style: normal;
		font-weight: 700;
		line-height: normal;
		letter-spacing: 0.05625rem;
		text-transform: uppercase;
	}
	html body .cls-button a.fl-button:hover {
		background-color: var(--gold);
	}

/* ------------------ ACCORDION STYLES ------------------ */



/* --***************************************************** ----- */
/* ------------------ RESPONSIVE STYLES ------------------ */
/* Mobile Styles -  Special Sizes*/
@media only screen and (min-width: 1025px) and (max-width: 1160px) {

}

/* Mobile Styles - Tablet 1024 */
@media only screen and (max-width: 1024px) {
    .subpage-title .pp-infobox { 
		padding: 20px; 
	}
	.subpage-top-row {
		padding:40px;
	}
}


/* Mobile Styles - Lg Mobile 768 */
@media only screen and (max-width: 768px) {
  .subpage-title .pp-infobox { 
	  padding: 20px;
	}
	.subpage-top-row {
		padding:20px;
	}
	/*	.toppage-title-col-inner {
		border:none;
	}*/
	
	.subpage-title-col.fl-col > .fl-col-content {
    margin-right: 0;
    margin-left: 0;
	}
}

/* Mobile Styles - Small */
@media only screen and (max-width: 468px) {	
        
}
header.fl-builder-content {
	z-index: 99999 !important;
}