/*
Theme Name: Hueman Child
Template: hueman
Version: 1.0
*/

/*
## Pass as text on white (and as backgrounds with white text)

- Dark Purple #361E55
- Dark Magenta #643271
- Dark cyan-blue #005B8A

## Pass as text on Champagne #F7F3E7

- Dark Purple #361E55
- Dark Magenta #643271
- Dark cyan-blue #005B8A

## Pass as dark text on the bright colors

- Dark Purple #361E55 on Green #61AD45
- Dark Purple #361E55 on Turia blue #29B4E3
- Dark Purple #361E55 on Yellow Green #B7D432
- Dark Magenta #643271 on Yellow Green #B7D432

## Never use for text

- Green #61AD45
- Turia blue #29B4E3
- Yellow Green #B7D432
- Champagne #F7F3E7

These four fail on white and on Champagne, and also fail the lower 3:1 bar, so avoid them for icons, borders, and focus rings on light backgrounds too. Use them as large fills only.

Large text only, meaning 24px or 18.66px bold, and not for body copy:

- Dark Magenta #643271 on Green #61AD45
- Dark Magenta #643271 on Turia blue #29B4E3
- Dark cyan-blue #005B8A on Yellow Green #B7D432

GREEN THEME
.site-title a {
  color: #61AD45 !important;
  font-weight: 600;
}

 NAV GREEN BG WITH PURPLE TEXT
@media only screen and (max-width: 719px) {

	.submenu-click-expand ul,
	.submenu-click-expand.nav-wrap,
	.submenu-click-expand.nav-wrap li {
		background: #61AD45 !important;
	}

	#header .nav-container .nav li a {
		color: #361E55 !important;
	}
}
@media only screen and (min-width: 720px) {

	#nav-header .nav li.current-menu-ancestor > a,
	#nav-header .nav li.current-menu-item > a,
	#nav-header .nav li.current-post-parent > a,
	#nav-header .nav li.current_page_item > a,
	#nav-header .nav li:hover > a,
	#nav-header .nav li > a:hover  {
		background: #61AD45!important;
		color: #361E55!important;
	}
	
	 #nav-header .nav li a {
		color: #361E55!important;
	}
}

*/

.site-title a {
    display: block;
    color: #fff;
    max-width: 100%;
}

a {
    font-weight: 400;
    transition: all 500ms ease;
}

a:hover, .entry h2:hover {
    opacity:.9 !important
}

.ham__navbar-toggler-two .line, .ham__navbar-toggler-two.active .line, .ham__navbar-toggler-two.focusing .line, .ham__navbar-toggler-two.hovering .line {
    background: #005B8A;
}

.sidebar-toggle i {
    color: #005B8A;
}

.entry-title a {
	color: #005B8A !important;
	text-decoration: none;
	transition: opacity 0.2s ease-in-out;
}

.entry-title a:hover,
.entry-title a:focus {
	opacity: 0.9;
}

.entry-title a:focus-visible {
	outline: 2px solid #005B8A;
	outline-offset: 2px;
}
/*
@media only screen and (max-width: 719px) {

	.submenu-click-expand ul,
	.submenu-click-expand.nav-wrap,
	.submenu-click-expand.nav-wrap li {
		background: #005B8A;
	}

	#header .nav-container .nav li a {
		color: #FFFFFF !important;
		font-weight: 500;
	}
}

@media only screen and (min-width: 720px) {

	#nav-header .nav li.current-menu-ancestor > a,
	#nav-header .nav li.current-menu-item > a,
	#nav-header .nav li.current-post-parent > a,
	#nav-header .nav li.current_page_item > a,
	#nav-header .nav li:hover > a,
	#nav-header .nav li > a:hover  {
		background: #005B8A;
		color: #FFFFFF !important;
	}
	
	 #nav-header .nav li a {
		color: #FFFFFF;
		font-weight: 500;
	}
}
*/
/* Navigation. Colours come from the :root block printed by
   nav-colors-from-customizer.php, which reads each site's own
   color-header-menu value. Nothing here is hardcoded, so changing the
   Header Menu Background in the Customizer updates every state.

   Fallbacks after the comma cover the case where the PHP has not run. */

/* Navigation.

   Colours come from the :root block printed by
   nav-colors-from-customizer.php, which reads each site's own
   color-header-menu value.

   The hover effect is an overlay, not opacity. Link backgrounds stay
   transparent so the bar shows through, and hovering paints a translucent
   white or black on top. Values after the comma are fallbacks for when the
   PHP has not run. */

@media only screen and (max-width: 719px) {

	.submenu-click-expand ul,
	.submenu-click-expand.nav-wrap,
	.submenu-click-expand.nav-wrap li {
		background-color: var(--apm-nav-bg, #005B8A);
	}

	#header .nav-container .nav li a {
		color: var(--apm-nav-text, #FFFFFF) !important;
		font-weight: 500;
		background-color: transparent;
		transition: background-color 0.2s ease-in-out;
	}

	#header .nav-container .nav li a:hover,
	#header .nav-container .nav li a:focus {
		background-color: var(--apm-nav-hover-overlay, rgba(255, 255, 255, 0.14));
	}
}

@media only screen and (min-width: 720px) {

	#nav-header .nav li a {
		color: var(--apm-nav-text, #FFFFFF);
		font-weight: 500;
		background-color: transparent;
		transition: background-color 0.2s ease-in-out;
	}

	#nav-header .nav li.current-menu-ancestor > a,
	#nav-header .nav li.current-menu-item > a,
	#nav-header .nav li.current-post-parent > a,
	#nav-header .nav li.current_page_item > a,
	#nav-header .nav li:hover > a,
	#nav-header .nav li > a:hover {
		background-color: var(--apm-nav-hover-overlay, rgba(255, 255, 255, 0.14));
		color: var(--apm-nav-text, #FFFFFF) !important;
	}
}


.apm-portal {
    text-align: center;
    padding-top:20px;
}

.apm-portal img {
    display: block;
    width: 100%;
    max-width: 300px;
    height: auto;
    margin: 0 auto 15px;
}

.portal-buttons {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap:5px;
    margin-top: 10px;
}

.portal-btn {
    display: block;
    width: 220px;
    padding: 14px 28px;
    border-radius: 50px;
    text-align: center;
    text-decoration: none !important;
    color: #fff !important;
    font-size: 16px;
    font-weight: 600;
    line-height: 1;
    margin-bottom:10px;
}

.portal-btn.sign-in {
    background: #361E55;
}

.portal-btn.register {
    background: #005B8B;
}

.portal-btn:hover,
.portal-btn:focus,
.portal-btn:active,
.portal-btn:visited {
    color: #fff !important;
    opacity: .9;
}

.sticky {
	top: 20px !important;
}

.widget-title {
    font-weight: bold;
    font-size: 18px;
    padding-bottom: 15px;
    text-align: center;
}


.site-title a img {
    max-height: 120px;
}

.widget>h3 {
    font-weight: bold;
	font-size:18px;
	padding-bottom:15px;
	    text-align: left;
}

.widget {
    color: #000;
}

#footer, .sidebar .sidebar-content, .sidebar .sidebar-toggle, .apm-portal {
    background: #f7f7f7 !important;
}


.sidebar .widget {
    padding: 20px 30px 20px;
}

#copyright {display:none}

.entry ol ul li, .entry ul li {
    list-style: none;
}