/*
 Theme Name:   White Stick Images 2025
 Description:  Susty Child Theme
 Author:       Steve Russell Studios
 Template:     susty-master
 Version:      1.0.0
 License:      GNU General Public License v2 or later
 License URI:  http://www.gnu.org/licenses/gpl-2.0.html
 Text Domain:  sustychild
*/

html.mega-menu-menu-1-off-canvas-open {
    overflow: -moz-scrollbars-vertical; 
    overflow-y: scroll;
}
.block-editor-block-list__block .has-black-background-color * {
	color:#fff!important;
}
/**************************
* Site Structure and Spacing
 * ***********************/
:root {
  font-size: 62.5%;
}
.logo img {width:256px;}
.logo {
    flex: 0 40.2rem;
    text-align: center;
    line-height: 0;
}
body{overflow-x:hidden;}
header#masthead {width:100%;max-width:2560px;right:0;margin:0px;z-index:1000;justify-content:space-between;display:flex;top:0;}
header#masthead h1, header#masthead p {flex:unset;}
.site-logo a{font-size:30px;font-size:3.0rem;line-height:3.1rem;}
.site-logo{min-width:315px;}
header#masthead nav {display:flex;justify-content:space-between;width:100%;}
footer#colophon {max-width:2560px;width:100%;margin:0px;display:flex;flex-direction:column;}

#content {max-width:2560px;width:100%;margin:0px 0px 0px 0px;padding:0px;}
/*Block column spacing*/
.wp-block-columns, header#masthead, footer#colophon, .single-post #content {padding: 20px}
/*Block elements outside of columns */
:not(.wp-block-column) > p, :not(.wp-block-column) > h2, :not(.wp-block-column) > .wp-block-image figure, :not(.wp-block-column) > .wp-block-spacer, :not(.wp-block-column) > .wp-block-buttons , :not(.wp-block-column) > .wp-block-heading, :not(.wp-block-column) > .wp-block-gallery, #cmplz-manage-consent-container-nojavascript, #cmplz-cookies-overview {
	padding:20px;
}
.wpforms-container {
	padding:20px!important;
}
.single-post #content p {
	padding:0px;
}
:where(.wp-block-columns) {
	margin-bottom:0px;
}
.blog #content{padding:20px;}

.footer-info {
	margin:auto;
	align-self:center;
	padding:0px;
}

body {border-top:none;}
.hentry {margin:0;}

blockquote {margin:0px;}
html {scroll-padding-top:200px; scroll-behavior: smooth;}
/**************************
 * Website Containers
 * ***********************/
.full-width { 
	margin:0px;
	padding:0px!important;
}
h2.full-width  {line-height:15rem!Important;}
.banner {min-height:50vh;}
/**************************
 * Page Titles
 * ***********************/
.home article header {display:none;}
.page article header {padding: 0px 20px; text-align:center;}
/**************************
 * Mobile Structure
 * ***********************/
@media (max-width: 1079px){
	.logo{
		max-width:200px;

	}
}

@media (max-width: 400px){
	.page, html, body {width:100%;}
	.site-logo{min-width:230px;}
	footer#colophon {padding-top:124px;}
	a.mega-menu-link{
		font-size:18px!important;

	}
}
@media (max-width: 879px){
	.widget_block {display:none!important;}
}
/**************************
 * Gutenburg Breakpoints
 * ***********************/
@media (max-width: 1079px){
.is-layout-flex{
    flex-direction:column;
}
}
@media (min-width: 1080px){
.is-layout-flex {
    flex-direction:row;
}
}
.wp-block-columns.is-not-stacked-on-mobile {
	flex-direction:row!important;
}
/**************************
 * Regular Gallery Breakpoints
 * ***********************/
@media (max-width: 539px){
	.wp-block-gallery.is-layout-flex{
		flex-direction:column!important;
	}
	figure.wp-block-image  {
		margin: 1em auto!important;
	}	
}
@media (min-width: 540px){
.wp-block-gallery.is-layout-flex{
    flex-direction:row!important;
}
}
.wp-block-columns.is-not-stacked-on-mobile {
	flex-direction:row!important;
}
/**************************
 * Smart Slider Thumbnails
 * ***********************/
.page-id-7 #content {margin-bottom:0px!important;}
#content {margin-bottom:100px;}
@media (max-width: 520px){
	#content {margin-bottom:0px!important;}
	.nextend-thumbnail-inner {padding-bottom:25px!important;}
}
/**************************
 * Page Transitions
 * ***********************/
#fader {
    position: fixed;
	background:#000;
	top:92px;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 999999;
	pointer-events: none;
	animation-duration: 300ms;
    animation-timing-function: ease-in-out;
}
@media (max-width: 719px){
	#fader {top:111px!important;}
}

@keyframes fade-out {
    from { opacity: 1 }
      to { opacity: 0 }
}

@keyframes fade-in {
    from { opacity: 0 }
      to { opacity: 1 }
}

#fader.fade-out {
    opacity: 0;
    animation-name: fade-out;
}

#fader.fade-in {
    opacity: 1;
    animation-name: fade-in;
}

/**************************
 * Back To Top Button
 * ***********************/
.back-to-top-link {
	opacity:0;
	position:fixed;
	right: 1.5rem;
	bottom:1.5rem;
	background-color:rgba(0.6,0.6,0.6,0.6);
	border-radius:5px;
	font-size:1.4rem;
	color:#fff!important;
	padding:0px 1.5rem .5rem;
	  transition: visibility 0s, opacity 0.5s linear;

}
.back-to-top-link.active {
	opacity:1;
  transition: visibility 0s, opacity 0.5s linear;
}
#top {scroll-margin-top:2em;  scroll-behavior: smooth;}
.back-to-top {
	font-family:dashicons;
}
.back-to-top:after{
	content: "\2191";
	font-size:2.5rem;
	text-align:center;
	display:block;
}
*, html {
  scroll-behavior: smooth!important;
}
a.back-to-top-link {
		text-decoration:none;
}
/**************************
 * Font Styling
 * ***********************/
body, p, h1, h2, h3, h4, h5, h6,  header nav a, header#masthead a, footer#colophon, footer#colophon a, p, .n2-ss-slider-controls  span {
	font-family: "calibri", sans-serif;
	font-weight: 300;
	font-style: normal;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    text-rendering: optimizeLegibility;
}

footer#colophon h2, b, strong, a, p a, button, .wp-block-button__link {
	font-family: "calibri", sans-serif;
	font-weight: 700;
	font-style: normal;
}
a:hover {text-decoration:underline!important;}
a {text-decoration:none!important;}
header#masthead h1, header#masthead p, footer#colophon h2 {
	padding:1rem;
	font-size: 3.0rem!important;
    line-height: 3.2rem!important;
}
h1, h2, h3, h4, h5, h6 {
	clear:none;

}

.button {font-variant:small-caps;}
article a, article a:hover, article a:active, article a:visited {
	border-bottom:0px;
}

header nav a, header#masthead a, footer#colophon nav{text-decoration:none!important;text-transform:lowercase;letter-spacing:4px;}
header nav a {
	font-size:16px;
	font-size:1.6rem;
}
header#masthead h1 a{font-weight:700!important;}

h1 a:hover, h2 a:hover, h3 a:hover, h4 a:hover, h5 a:hover, h6 a:hover {text-decoration:none!important;}
/*article > header > h1, article > header > h2  {margin: 1.0em 0 .1em 0;}*/
h1, article > header > h1, article > header > h2 {font-size:50px;font-size:5.0rem;line-height:5.1rem;margin: .37em 0;}
h2, h2 a {font-size:50px!important;font-size:5.0rem!important;line-height:5.1rem!important;}
h3, h3 a {font-size:45px!important;font-size:4.5rem!important;line-height:4.6rem!important;}
h4, h4 a {font-size:40px!important;font-size:4.0rem!important;line-height:4.1rem!important;}
h5, h5 a {font-size:35px!important;font-size:3.5rem!important;line-height:3.6rem!important;}
h6, h6 {font-size:30px!important;font-size:3.0rem!important;line-height:3.4rem!important;}
body, article a {font-size:25px;font-size:2.5rem;line-height:2.9rem;}
footer, footer nav {font-size:18px!important;font-size:1.8rem!important;line-height:1.6rem!importance;text-underline-offset: 4px;}
button, .wp-block-button__link {font-size:24px;font-size:2.4rem;line-height:2.8rem;font-weight:700;}
p, a {margin:0.5em 0em;}
/**************************
 * Color Variables 2-Tone
 * ***********************
:root {
	--main-dark: #252723;
	--main-light: #eef3e3;
	--main-accent: #879270;
}
/**************************
 * Color Variables 2-Tone Alt
 * ***********************/
:root {
	--main-dark: #000;
	--main-light: #e7e7e7;
	--main-accent: #726559;
	--transparent: rgba(0,0,0,0);
}

/**************************
 * Color Styling 2-Tone
 * ***********************/
/* Main Colors */
.dark, .dark a, footer#colophon, footer#colophon a, header#masthead, header#masthead a {background-color:var(--main-dark); color:var(--main-light)}
.light, body {background-color:var(--main-light); color:var(--main-dark);}

body a { color:var(--main-dark);background-color: var(--transparent);}
.menu-navigation-container ul li {
	border-left:1px rgba(160, 160, 160, 0.3) solid;
}
/* Link settings */
:visited { color: var(--main-dark); }
:link:active, :visited:active { color: var(--main-dark); }
:link { color: var(--main-dark);; text-decoration:underline;}
}
/* Page Transition */
#fader {
	background-color:var(--main-dark);
}

/* Button Colors */
button, .wp-block-button__link{
	border: 3px solid var(--main-accent);
	background-color:var(--main-accent);
		border-bottom-color: var(--main-accent)!important;
	color:var(--main-light);
}
button:hover, .wp-block-button__link:hover {
	background-color:var(--main-light);
	border-color:var(--main-accent);
	border-bottom-color: var(--main-accent)!important;
	color:var(--main-accent);
}
.dark button, .dark .wp-block-button__link{
	border: 3px solid var(--main-light);
	border-bottom-color: var(--main-light)!important;
	background-color:var(--main-light); 
	color:var(--main-dark);	
}
.dark button:hover, .dark .wp-block-button__link:hover {
	background-color:var(--main-dark);
	border-color:var(--main-light);
	border-bottom-color: var(--main-light)!important;
	color:var(--main-light);
}

/* Menu Colors */
#primary-menu .menu-item a  {
	color: var(--main-light);
	border-color:  var(--main-light);
}
#primary-menu .menu-item a:after, #primary-menu .sub-menu .menu-item a:after {
	background: #666;
}
#footer-menu .menu-item a {
	color: #f2f2f2;
	border-color: #8e44ad;
}
#footer-menu .menu-item a:after, #footer-menu .sub-menu .menu-item a:after {
	background: #f2f2f2;
}
/**************************
 * Button Styling
 * ***********************/
button, .wp-block-button__link{
	border-radius:0px;
    -webkit-transition: all 300ms linear;
    -ms-transition: all 300ms linear;
    transition: all 300ms linear;

}

button, .wp-block-buttons .wp-block-button__link {
	border-bottom:3px solid;
}
a button:hover, button a:hover, a.wp-block-button__link:hover {
	text-decoration:none!important;
}
/**************************
 * Footer Styling
 * ***********************/
.footer-info {text-align:center;padding-top:50px;}

/**************************
 * Gallery
 * ***********************/
.wp-element-caption, figure.wp-block-image:has(figcaption)::before {display:none;}
@media (max-width: 540px){
	.wp-block-gallery.has-nested-images figure.wp-block-image:not(#individual-image) {width:100%;}
}
/**************************
 * Contact Page
 * ***********************/
.page-id-41 article header{
	display:none;	
}
.page-id-41 article{
	margin-bottom:0px;
}
/* Styling for the inline reCaptcha notice. And example can be seen on
 * https://complianz.io/how-to-implement-recaptcha-and-consent-for-wp-forms/
 * You can ofcourse edit however you see fit.
 */
 
  /* Hide the Submit button before consent */
.wpforms-submit-container {
	display:none;
}

 /* Display the Submit button if Marketing or ReCaptcha consent was obtained */
.cmplz-google-recaptcha .wpforms-submit-container, .cmplz-marketing .wpforms-submit-container {
	display:block!important;
}

/* Style the button */
button.cmplz-blocked-content-notice.cmplz-accept-marketing.cmplz-wpforms {
    background-color: #fff!important;
    border: 1px solid #ddd;
    color: #333;
    font-size: 1.2em;
    padding: 10px 15px;
    margin:15px 20px 0px 20px;
}

/* Optional: Hide the ReCaptcha consent placeholder after obtaining consent */
.cmplz-marketing button.cmplz-blocked-content-container.cmplz-blocked-content-notice.cmplz-wpforms, 
.cmplz-google-recaptcha button.cmplz-blocked-content-container.cmplz-blocked-content-notice.cmplz-wpforms {
	display: none;
}
/**************************
 * Cookie Page
 * ***********************/

.page-id-932 article header {display:inline;}
#cmplz-document {
	max-width:1440px;
	font-size: 24px; font-size:2.4rem;line-height:2.4rem;
}
#cmplz-document p, #cmplz-document a {
	font-size: 24px; font-size:2.4rem;line-height:2.4rem;
}