/*
Theme Name: Kele
Theme URI: http://kele.com
Author: Amalgam
Author URI: http://amalgam.co
Description: Custom theme for Kele Blog
Version: 1.0.0
License: GNU General Public License v2 or later
License URI: LICENSE
Text Domain: kele
Tags: custom-background, custom-logo, custom-menu, featured-images, threaded-comments, translation-ready

This theme, like WordPress, is licensed under the GPL.
Use it to make something cool, have fun, and share what you've learned with others.

Kele is based on Underscores http://underscores.me/, (C) 2012-2016 Automattic, Inc.
Underscores is distributed under the terms of the GNU GPL v2 or later.

Normalizing styles have been helped along thanks to the fine work of
Nicolas Gallagher and Jonathan Neal http://necolas.github.io/normalize.css/

With love to Wendell.
*/

:root {
	/*
 	https://www.figma.com/file/NqIozriKniGkfenVLGm8qI/Library?type=design&node-id=142-149&mode=design&t=8BINMcmolfnd1dTu-4
 	*/
	--kele-blue: #007AB8;
	--kele-blue-hilight: #03569E;
	--kele-green: #007A33;
	--kele-darkblue: #000033;
	--kele-orange: #EF8803;
	--kele-yellow: #FBD821;
	--kele-red: #BB0404;
	--kele-green-hilight: #015B27;
	--digital-white: #FFFFFF;
	--digital-lightgrey: #EEEEEE;
	--digital-mediumgrey: #757575;
	--digital-darkgrey: #3F3F3F;
	--digital-black: #000000;
}

@font-face {
	font-family: 'ElegantIcons';
	src:url('fonts/ElegantIcons.eot');
	src:url('fonts/ElegantIcons.eot?#iefix') format('embedded-opentype'),
		url('fonts/ElegantIcons.woff') format('woff'),
		url('fonts/ElegantIcons.ttf') format('truetype'),
		url('fonts/ElegantIcons.svg#ElegantIcons') format('svg');
	font-weight: normal;
	font-style: normal;
}

.main-content:before, .main-content:after {content:""; display:table;}
.main-content:after {clear:both;}

.cf:before, .cf:after {content:""; display:table;}
.cf:after {clear:both;}

#promo-container {
	background-color: var(--kele-blue, #007AB8);
}

#pageOuterContainer .main-content p, #pageOuterContainer .main-content * {
	font-family: Helvetica, sans-serif;
}

#pageOuterContainer .entry-meta .posted-on .updated {
	display: none;
}

#pageOuterContainer .main-content img {
	max-width: 100%;
	height: auto;
}

#pageOuterContainer .main-content img.alignleft {
	float: left;
	margin: 0 15px 5px 0;
}

#pageOuterContainer .main-content img.alignright {
	float: right;
	margin: 0 0 5px 15px;
}

.main-content #primary #main {
	padding-right: 25px;
}

.main-content #primary {
	float: left;
	width: 75%;
}

.main-content #secondary {
	float: left;
	width: 25%;
}

.main-content #secondary ul,
.main-content #secondary ol {
	padding: 0 0 0 20px;
	margin: 10px 0;
}

.posts-navigation h2 {
	display: none;
}

.main-nav li.top-menu-item > a,
.new-free-shipping span,
.page-nav-forum .navlinks a,
#quicklinkwrapper h2,
p.log-in-green {
  font-family: Arial Narrow, Arial, Helvetica, sans-serif;
}

body.blog .site-container .main-nav li.top-menu-item {
    padding: 16px 0 !important; /* fixes an error */
}

.hide {
	display: none;
}

h1, h2, h3, h4, h5, h6 {
	color: #000033;
}

#pageOuterContainer .main-content h1 {
	font-size: 32px !important;
	line-height: 36px !important;
	font-weight: bold;
	margin: 0 0 10px 0;
}

#pageOuterContainer .main-content h3,
#pageOuterContainer .main-content h4,
#pageOuterContainer .main-content h5,
#pageOuterContainer .main-content h6 {
	font-family: Helvetica, sans-serif !important;
}

#pageOuterContainer .main-content h2 {
	font-size: 22px !important;
	font-weight: normal !important;
}

#pageOuterContainer .main-content .entry-meta,
#pageOuterContainer .main-content .entry-meta a {
	color: #AAA;
}

#pageOuterContainer .main-content .entry-meta a:hover {
	color: var(--kele-blue, #007AB8);
}

body.single .entry-header {
	padding-bottom: 10px;
	border-bottom: 1px solid #EEE;
}

.posts-navigation {
	margin: 30px 0;
}

.post-navigation {
	margin: 30px 0;
	display: none !important;
}

.posts-navigation .nav-next,
.post-navigation .nav-next {
	float: left;
}

.posts-navigation .nav-previous,
.post-navigation .nav-previous {
	float: right;
}

.entry-header {
	margin-bottom: 15px;
	margin-top: 15px;
}

.home .post,
.archive .post,
.search-results .post {
	padding: 20px;
	border-bottom: 1px solid #DDD;
}

.entry-footer {
	display: none;
}

.search-results .post:nth-child(even),
.home .post:nth-child(even),
.archive .post:nth-child(even) {
	background: #F5F5F5;
}

.main-content #comments {
	margin: 30px 0;
	padding: 20px;
	background: #F5F5F5;
	border: 1px solid #DDD;
	border-radius: 3px;
}

.main-content #comments label {
	display: block;
}

#pageOuterContainer .main-content .posts-navigation a,
#pageOuterContainer .main-content .btn,
#pageOuterContainer .main-content input[type="submit"] {
	background: var(--kele-blue, #007AB8);
	border: 1px solid var(--kele-blue, #007AB8);
	padding: 10px 20px;
	display: inline-block;
	color: #FFF;
	text-decoration: none;
}

#pageOuterContainer .main-content .posts-navigation a,
#pageOuterContainer .main-content .btn {
	padding: 8px 20px;
}

#pageOuterContainer .main-content .posts-navigation a,
#pageOuterContainer .main-content .btn:hover,
#pageOuterContainer .main-content input[type="submit"]:hover {
	background: #FFF;
	color: var(--kele-blue, #007AB8);
}

#pageOuterContainer .main-content .posts-navigation a {
	margin: 10px 0;
}

#pageOuterContainer .main-content .posts-navigation a:hover {
	color: #000033;
	border-color: #000033;
}

#pageOuterContainer .main-content textarea,
#pageOuterContainer .main-content input[type="text"],
#pageOuterContainer .main-content input[type="url"],
#pageOuterContainer .main-content input[type="search"],
#pageOuterContainer .main-content input[type="email"],
#pageOuterContainer .main-content input[type="password"],
#pageOuterContainer .main-content input[type="tel"] {
	border: 1px solid #CCC;
	padding: 7px;
	outline: none;
	-webkit-appearance: none;
	box-shadow: none;
	font-weight: normal;
	color: #000033;
}

#pageOuterContainer .main-content textarea:focus,
#pageOuterContainer .main-content input[type="text"]:focus,
#pageOuterContainer .main-content input[type="url"]:focus,
#pageOuterContainer .main-content input[type="search"]:focus,
#pageOuterContainer .main-content input[type="email"]:focus,
#pageOuterContainer .main-content input[type="password"]:focus,
#pageOuterContainer .main-content input[type="tel"]:focus {
	border-color: var(--kele-blue, #007AB8);
}

#pageOuterContainer .main-content .page-header .page-title {
	margin: 10px 0 20px 0;
}

#pageOuterContainer .main-content p {
	margin: 0 0 15px 0;
}

.shareaholic-share-buttons-container,
.shareaholic-share-buttons-heading-image {
	display: none !important;
}

#pageOuterContainer .main-content .entry-content .shareaholic-share-buttons-container {
	display: block !important;
}

#pageOuterContainer .main-content p,
#pageOuterContainer .main-content li,
#pageOuterContainer .main-content {
	font-size: 15px !important;
	line-height: 1.3 !important;
	color: #000;
	font-family: Helvetica, sans-serif !important;
}

body.single .post {
	padding: 12px 32px;
}

#pageOuterContainer .main-content .widget_categories ul {
	padding-left: 0;
}

#pageOuterContainer .main-content .widget_categories li {
	list-style: none;
	display: block;
	margin: 0;
}

#pageOuterContainer .main-content .widget_categories li a {
	display: block;
	text-decoration: none;
	padding: 10px;
	border-bottom: 1px solid var(--kele-blue, #007AB8);
	background: #000033;
	color: #FFF;
	font-weight: bold;
	font-size: 13px;
}

#pageOuterContainer .main-content .widget_categories li a:hover {
	background: var(--kele-blue, #007AB8);
}

.comment-content a {
	word-wrap: break-word;
}

.bypostauthor {
	display: block;
}

#comments ol {
	list-style: none;
	padding-left: 0;
}

#comments ol.children {
	padding-left: 15px;
}

#comments .comment-author {
	margin-bottom: 5px;
}

#comments .comment-author img {
	vertical-align: bottom;
	width: 25px;
	height: auto;
}

.widget_search .search-submit {
	visibility: hidden;
}

#pageOuterContainer .main-content .entry-title a {
	color: #000033;
	text-decoration: none;
}

#pageOuterContainer .main-content a {
	color: var(--kele-blue, #007AB8);
}
.main-content li {
	margin-bottom: 10px;
}
.main-content .widget {
	margin: 30px 0;
}
body.ez-search-focused .site-container .main-header, body.ez-search-focused .site-container .main-nav, body.ez-search-focused .main-header .mobile-search-bar {
transition: all .25s ease-in-out;
}
body .site-container {
background: #FFF;
}
body.ez-search-focused {
background: #FFF !important;
}
body.ez-search-focused .footer,
body.ez-search-focused .site-container > *:not(.main-header),
body.ez-search-focused .main-header > *:not(.main-nav),
body.ez-search-focused .main-header .top-menu-item {
opacity: 1;
}
body.ez-search-focused .site-container .footer,
body.ez-search-focused .site-container .footer .btn-green,
body.ez-search-focused .site-container .main-header, 
body.ez-search-focused .site-container .main-nav, 
body.ez-search-focused .main-header .mobile-search-bar{ 
background: #C0C0CC !important;
}
body.ez-search-focused #pageOuterContainer {
opacity: .25;
}
body.ez-search-focused .main-header .top-menu-item {
pointer-events:none;
}
#pageOuterContainer {
transition: all .15s ease-in-out;
}
body > div.site-container > div.main-header > div.order-nav > div.search-placeholder {
position: absolute;
right: 30px;
left: 30px;
}
.main-header .logo {
margin-bottom: 40px !important;
height: 52px;
}
.main-nav li.search input {
margin: 0 !important;
}
#voiceEnable {
display: none;
position: absolute;
top: 0;
right: 35px;
width: 25px;
height: 25px;
margin: 2px 0;
cursor: pointer;
}
@media screen and (-webkit-min-device-pixel-ratio:0) {
body > div.site-container > div.main-header > div.order-nav > div.search-placeholder {
right: 60px !important;
}
@media (max-width: 900px) {
body > div.site-container > div.main-header > div.order-nav > div.search-placeholder {
right: 40px !important;
}
}
}

.ez-nextopia-search {
position: relative;
padding-right: 45px;
}
.ez-nextopia-search .submit-search {
position: absolute;
top: 0;
right: 0;
bottom: 0;
width: 40px;
background: #008049;
border: none;
outline: none;
overflow: hidden;
color: #fff;
border-radius: 2px;
transition: opacity .2s linear;
	display: flex;
	align-items: center;
	justify-content: center;
}
.ez-nextopia-search .submit-search:hover {
opacity: .85;
}
.ez-nextopia-search .input-search {
display: block;
width: 100%;
height: 32px;
border: 1px solid #000033;
outline: none;
background: #FFF;
box-sizing: border-box;
padding: 6px 10px;
color: #000;
font-size: 15px;
font-weight: normal;
border-radius: 1px;
-webkit-appearance: none;
}
body.ez-search-focused.ez-search-keydown .ez-nextopia-search .input-search {
border-bottom-color: #FFF;
}
.ez-nextopia-autocomplete {
display: none;
position: absolute;
top: 31px;
left: 0;
right: 45px;
background: #FFF;
z-index: 99999;
box-shadow: 0 3px 6px 0 rgba(0, 0, 0, .1);
border: 1px solid #000033;
border-top: none;
}
body.ez-search-keydown .ez-nextopia-search .ez-nextopia-autocomplete {
display: block;
}

.ez-auto-cols {
padding: 0 0 20px 0;
}
.ez-auto-cols .col {
float: left;
width: 25%;
box-sizing: border-box;
}
.ez-auto-cols .col-product {
width: 50%;
}
.ez-auto-cols .col h4 {
color: #000;
font-size: 17px;
font-weight: bold;
text-transform: lowercase;
margin: 0;
padding: 15px;
}
.ez-auto-cols .col-terms ul {
border-left: 1px solid #CCC;
border-right: 1px solid #CCC;
min-height: 300px;
}
.ez-auto-cols .col ul {
margin: 0;
padding: 0 15px;
max-height: 300px;
overflow: auto;
}
.ez-auto-cols .col ul li {
margin: 0;
display: block !important;
background: none;
padding: 0;
float: none;
}
.ez-auto-cols .col ul li:last-child {
position: static;
}
.ez-auto-cols .col ul li:last-child a,
.ez-auto-cols .col ul li a {
color: #666;
font-size: 13px;
text-transform: lowercase;
font-weight: bold;
display: block;
padding: 6px 0;
transition: color .2s linear;
width: auto;
height: auto;
}
.ez-auto-cols .col ul li a:hover {
color: var(--kele-blue, #007AB8);
}
.ez-auto-cols .col-product ul li:last-child a,
.ez-auto-cols .col-product ul li a {
text-transform: uppercase;
font-size: 12px;
padding: 4px 0;
}
.ez-auto-cols .col-product ul li {
width: 49%;
display: inline-block !important;
}
.ez-auto-cols .col-product ul li:last-child a img,
.ez-auto-cols .col-product ul li a img {
width: 50px;
height: auto;
}
.ez-auto-cols .col-product ul li:last-child a img {
display: inline;
}
@media (max-width: 900px) {
body > div.site-container > div.main-header > div.order-nav > div.search-placeholder {
top: 50%;
left: 10px;
right: 10px;
}
}
@media (max-width: 768px) {
	.main-content #primary {
	float: none;
	width: 100%;
}
.main-content #primary #main {
	padding-right: 0;
}
body.single .post {
	padding: 0;
}
.main-content #secondary {
	float: none;
	width: 100%;
}
body > div.site-container > div.main-header > div.order-nav > div.search-placeholder {
top: 43px;
bottom: auto;
}
.ez-auto-cols .col-cats {
display: none;
}
.ez-auto-cols .col-terms ul {
border-right: none;
min-height: 200px;
}
.ez-auto-cols .col-terms ul li a {
font-weight: normal !important;
}
.ez-auto-cols .col-product {
width: 75%;
}
.ez-auto-cols .col ul {
max-height: 200px;
}
	body .site-container .main-nav .sub-nav-1-container .sub-nav-1-top {
		background-color: #FFF!important;
	}
	body .site-container .main-nav .sub-nav-1-container .sub-nav-1-top .sub-sub-nav {
		background-color: #F5F5F5!important;
	}
}
@media (max-width: 520px) {
.ez-auto-cols .col-terms {
display: none;
}
.ez-auto-cols .col-product {
width: 100%;
}
.ez-auto-cols .col-product ul li {
width: 100%;
}
}
@media (max-width: 480px) {
	.site-container .main-header {
		height: 95px !important;
		min-height: 95px !important;
	}
}

@font-face {
    font-family: Titan One;
    src: url(https://fonts.googleapis.com/css?family=Titan+One);
    font-weight: normal;
}

/* Media Query to match full-width class options on Angular Pages */
@media only screen and (min-width: 950px) {
    body div.site-container #pageOuterContainer .main-content.full-width {
        width:100%!important;
        padding: 15px 75px!important;
    }

    body:not(.blog) div.site-container #pageOuterContainer .main-content.no-padding,
	body:not(.blog) div.site-container #pageOuterContainer .main-content.full-width.no-padding {
        margin: 0!important;
        padding: 0!important;
    }
	
    body:not(.blog) div.site-container #pageOuterContainer .main-content.skinny-width {
        max-width: 656px;
        margin: 0 auto;
    }
}

/* Vertical placeholder on the Homepage provides space for the river*/
.vertical-placeholder:not(:has(section)) {
  height: 300px;
  animation: collapse 0.5s linear forwards;
  animation-delay: 90s;
}

.vertical-placeholder:has(section) {
  animation: none;
  height: 0;
}

@keyframes collapse {
  from {
    height: 300px;
  }
  to {
    height: 0;
  }
}

.kele-links:not(#noDivi.noDivi.noDivi.noDivi.noDivi) a {
  color: var(--kele-blue, #007AB8);
}

/* in the templates that still need padding without changing the outer .no-padding style*/
.content-padding {
	padding: 0 75px!important;
	max-width: 1290px;
}

@media (max-width: 768px) {
	.content-padding {
		padding: 0 4px!important;
	}	
}

/* --- WP Store Locator custom styles --- */

.store-map-wrap, .store-content-wrap{max-width:900px;margin:0 auto}
.store-map-wrap .wpsl-gmap,.store-map-wrap .wpsl-gmap-canvas{min-height:350px;width:100%}

  .wpsl-store .store-hours { margin-bottom: 12px !important }
  .wpsl-store .store-products strong, .wpsl-store .store-services strong { margin-right:.25rem; }

.wpsl-store .store-directions .button{
  display:inline-block;padding:.5rem .9rem;border-radius:8px;background: var(--kele-blue, #007AB8);color:#fff !important;text-decoration:none
}
.wpsl-store .store-directions .button:hover{filter:brightness(.95)}

#wpsl-wrap > div.wpsl-search {
	margin-bottom: 12px;
}

/* --- WP Store Locator dropdowns (Category, Radius, etc.) --- */

/* Outer dropdown container */
.wpsl-dropdown {
  position: relative;
  font-size: 16px;
  color: #666666;
}

/* The visible selected item ("Any", etc.) */
.wpsl-dropdown:not(#noDivi#noDivi) .wpsl-selected-item {
  display: block;
  padding: 10px 12px !important;
  /* background: #F5F5F5; 
  border: 1px solid #ccc;*/
  border-radius: 4px;
  box-shadow: 0 2px 3px rgba(0, 0, 0, 0.16),
              0 1px 6px rgba(0, 0, 0, 0.23);
  cursor: pointer;
  transition: all 0.3s cubic-bezier(.25, .8, .25, 1);
}

/* The dropdown list when opened */
.wpsl-dropdown.wpsl-active:not(#noDivi#noDivi) > div {
  position: absolute;
  top: 100%;
  left: 0;
  z-index: 999;
  width: 100%;
  max-height: 300px;
  overflow-y: auto;
  background: #F5F5F5; /* same as submenu */
  border: 1px solid #ccc;
  box-shadow: 0 3px 6px rgba(0, 0, 0, 0.16),
              0 3px 6px rgba(0, 0, 0, 0.23);
}

/* List items inside the dropdown */
.wpsl-dropdown:not(#noDivi#noDivi) ul li {
  padding: 10px 12px;
  background: #F5F5F5;
  color: #666666;
  cursor: pointer;
  transition: all 0.3s cubic-bezier(.25, .8, .25, 1);
}

/* Hover / selected state (matches submenu hover style) */
.wpsl-dropdown:not(#noDivi#noDivi) ul li:hover {
  background: var(--kele-blue);
  color: #FFF;
}

#wpsl-category-list {
  background: #F5F5F5 !important;
  color: #666666 !important;
  border: 1px solid #ccc !important;
}

#wpsl-search-wrap:not(#noDivi) .wpsl-search-btn-wrap, #wpsl-search-wrap:not(#noDivi) .wpsl-select-wrap {
	margin: 0 0 8px 12px;
}

#wpsl-search-input:not(#noDivi) {
	width: 200px;
	padding: 10px;
	border-radius: 4px;
 	box-shadow: 0 2px 3px rgba(0, 0, 0, 0.16),
              0 1px 6px rgba(0, 0, 0, 0.23);
}

#wpsl-search-btn:not(#noDivi) {
	border-radius: 8px;
	font-weight: bold;
	padding: 8px 78px;
}

#wpsl-category:not(#noDivi) {
	margin-bottom: 16px;
} 


.gm-style:not(#noDivi#noDivi) .gm-style-iw-c {
	background: #fff;
	padding: 12px;
	border-radius: 8px;
	 	box-shadow: 0 2px 3px rgba(0, 0, 0, 0.16),
              0 1px 6px rgba(0, 0, 0, 0.23);
}

.gm-style-iw-ch:not(#noDivi#noDivi) {
	padding-top: 16px;
}

.gm-ui-hover-effect:not(#noDivi#noDivi){opacity:.6}.gm-ui-hover-effect:not(#noDivi#noDivi):hover{opacity:1}.gm-ui-hover-effect:not(#noDivi#noDivi)>span{background-color:light-dark(#000,#fff)}

#wpsl-stores:not(#noDivi) .wpsl-store-location a, #wpsl-stores:not(#noDivi) .wpsl-direction-wrap > a, #wpsl-gmap:not(#noDivi) .wpsl-info-window a {
	color: var(--kele-blue, #007AB8);
}


#wpsl-stores:not(#noDivi) .wpsl-store-location strong a, #wpsl-gmap:not(#noDivi) .wpsl-info-window strong > a {
	font-weight: bold;	
}

.wpsl-store-details:not(#noDivi).wpsl-store-listing:before, .wpsl-store-details:not(#noDivi).wpsl-store-listing.wpsl-active-details:before {
    right: -12px;
}

#wpsl-map-controls:not(#noDivi) span {
  font-family: "wpsl-fontello", "wpsl-icons", sans-serif;  
}

@media (max-width: 825px) {	
    #wpsl-search-input:not(#noDivi) {
        width: calc(100% - 142px);
    }

	#wpsl-search-wrap:not(#noDivi) .wpsl-search-btn-wrap, #wpsl-search-wrap:not(#noDivi) .wpsl-select-wrap {
		margin: 0 0 8px 0;
	}
	
	#wpsl-category:not(#noDivi) {
		margin: 0 12px 12px 0;
	} 	
}

@media (max-width: 598px) {
	#wpsl-search-wrap > form {
		display: flex;
		flex-direction: column;
	}
	
	#wpsl-search-wrap #wpsl-search-btn {
		width: calc(100% - 24px);
		text-align: center;
	}
}
	
/* --- End of WP Store Locator styles --- */

/* Sugar calendar: spacing and divider on archive pages */
.post-type-archive-sc_event .site-main article:not(:last-of-type),
.tax-sc_event_category .site-main article:not(:last-of-type) {
  padding-bottom: 1.5rem;
  margin-bottom: 1.5rem;
  border-bottom: 1px solid #d6d6d6;
}

/* Salesorce Enhanced Chat - so far in Test only */
#embeddedMessagingFrame,
iframe.embeddedMessagingFrame {
  z-index: 99999;

  @media (min-width: 768px) {
    right: 50px;	
  }
}


/* Footer social icons - todo: move to full-width CSS */

.footer .social-icons-grid {
  display: grid;
  grid-template-columns: repeat(3, max-content);
  gap: 18px;
  margin-top: 8px;
}
.footer .social-icons-grid a {
  display: flex;
  align-items: center;
  justify-content: center;
}
.footer .social-icons-grid img {
  width: 50px;
  height: 50px;
  display: block;
  object-fit: contain;
  transition: transform 0.3s cubic-bezier(.25, .8, .25, 1);
  transform-origin: center;
}
.footer .social-icons-grid a:hover img,
.footer .social-icons-grid a:focus-visible img {
      transform: scale(1.1);
   }
@media only screen and (max-width: 768px) {
  .footer {
    padding-bottom: 0;
  }
	body > div.site-container .footer > .action-links .last {
		height: auto; /*remove from full-width CSS*/
	}
}
@media only screen and (max-width: 480px) {
	  .social-icons-grid {
        max-width: 100%;
        gap: 10px;

       .social-icons-grid a img {
          width: 50px;
          height: 45px;
        }
      }
}