/*--------------------------------------------------------------
>>> TABLE OF CONTENTS:
----------------------------------------------------------------
# Imports
	# Custom properties
	# Reset
	# Typography
	# Elements
	# Links
# Accessibility
# Layout
# Forms
# Header
	# Main navigation menu
# Content navigation
# Footer
# Infinite scroll
--------------------------------------------------------------*/

/*--------------------------------------------------------------
# Imports
--------------------------------------------------------------*/
@import "_custom-properties.css";
@import "_reset.css";
@import "_typography.css";
@import "_elements.css";
@import "_links.css";

/*--------------------------------------------------------------
# Accessibility
--------------------------------------------------------------*/

/**
 * Text meant only for screen readers.
 * Re: word-wrap: Many screen reader and browser combinations announce broken
 * words as they would appear visually.
 */
.screen-reader-text {
	clip: rect(1px, 1px, 1px, 1px);
	position: absolute !important;
	height: 1px;
	width: 1px;
	overflow: hidden;
	word-wrap: normal !important;
}



.screen-reader-text:focus {
	background-color: #f1f1f1;
	border-radius: 3px;
	box-shadow: 0 0 2px 2px rgba(0, 0, 0, 0.6);
	clip: auto !important;
	color: #21759b;
	display: block;
	font-size: 0.875rem;
	font-weight: 700;
	height: auto;
	left: 5px;
	line-height: normal;
	padding: 15px 23px 14px;
	text-decoration: none;
	top: 5px;
	width: auto;
	z-index: 100000; /* Above WP toolbar. */
}

/* Do not show the outline on the skip link target. */
#primary[tabindex="-1"]:focus {
	outline: 0;
}

/* remember to define focus styles! */
:focus {
	outline: 0;
}

/*--------------------------------------------------------------
# Layouts
--------------------------------------------------------------*/
.site {
	margin: 0 auto;
}

.content-wrapper {
	display: grid;
	grid-template-columns: 2fr 1fr;
	grid-gap: 2rem;
	justify-content: center;
	margin: 40px auto 40px auto;
}

.content-wrapper-full {
	margin: 40px auto 40px auto;
}

@media (min-width: 320px) and (max-width: 767px) {
	 .content-wrapper {
		display: inherit;
	}
	.main-navigation{
		padding-bottom: 20px;
	}

	.nav--toggle-small .menu-toggle {
		margin: 0 auto;
	}
	.site-description{
		padding-bottom: 15px;
	}
}

@media (--sidebar-query) {

	.site-header {
		grid-column: span 2;
		background-color: #fff;
	}

	.site-main {
		grid-column: 1;
		min-width: 0;
	}

	.primary-sidebar {
		grid-column: 2;
		min-width: 0;
	}

	.site-footer {
		grid-column: span 2;
	}
}

/*--------------------------------------------------------------
# Forms
--------------------------------------------------------------*/
/* stylelint-disable */
textarea {
	width: 100%;
}
/* stylelint-enable */

/* stylelint-disable */
button,
input[type="button"],
input[type="reset"],
input[type="submit"] {
	border: 1px solid;
	border-color: #32373c;
	border-radius: 3px;
	background: #32373c;
	color: #fff;
	font-size: 0.85rem;
	line-height: 1;
	padding: 10px 15px 10px;
	cursor: pointer;
}
/* stylelint-enable */

button:hover,
input[type="button"]:hover,
input[type="reset"]:hover,
input[type="submit"]:hover {
	border-color: #ccc #bbb #aaa;
}

button:active,
button:focus,
input[type="button"]:active,
input[type="button"]:focus,
input[type="reset"]:active,
input[type="reset"]:focus,
input[type="submit"]:active,
input[type="submit"]:focus {
	border-color: #aaa #bbb #bbb;
}

input[type="text"],
input[type="email"],
input[type="url"],
input[type="password"],
input[type="search"],
input[type="number"],
input[type="tel"],
input[type="range"],
input[type="date"],
input[type="month"],
input[type="week"],
input[type="time"],
input[type="datetime"],
input[type="datetime-local"],
input[type="color"],
textarea {
	color: #666;
	width: 100%;
	border: 1px solid #ccc;
	border-radius: 3px;
	padding: 7px;
	transition: all 0.5s ease;
}

input[type="text"]:focus,
input[type="email"]:focus,
input[type="url"]:focus,
input[type="password"]:focus,
input[type="search"]:focus,
input[type="number"]:focus,
input[type="tel"]:focus,
input[type="range"]:focus,
input[type="date"]:focus,
input[type="month"]:focus,
input[type="week"]:focus,
input[type="time"]:focus,
input[type="datetime"]:focus,
input[type="datetime-local"]:focus,
input[type="color"]:focus,
textarea:focus {
	color: #111;
	border-color: var(--color-theme-primary);
	transition: all 0.5s ease;
}

select {
	border: 1px solid #ccc;
}

.wp-block-button__link {
	border: 2px solid var(--color-theme-primary);
	padding: 8px 28px;
	transition: all 0.3s ease 0s;
	background-color: var(--color-theme-primary);
}

.wp-block-button__link:hover {
	background-color: transparent;
	border-color: var(--color-theme-primary);
	color: var(--color-theme-primary);
	cursor: pointer;
	transition: all 0.3s ease 0s;
}

.is-style-outline .wp-block-button__link {
	border-color: var(--color-theme-primary);
}


/*--------------------------------------------------------------
# Header
--------------------------------------------------------------*/

.header-image {
	margin: 0 auto;
}

.header-image img {
	display: block;
	margin: 0 auto;
}

.custom-logo-link {
	display: inline-block;
	margin: 0 auto 0;
}

.site-branding {
	text-align: center;
	padding: 60px 0 15px;
/*	background-color: #fff;*/
/*	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;*/
}

.site-title {
	margin: 0 1em;
	font-family: var(--highlight-font-family);
	font-stretch: condensed;
	font-size: 38px;
	font-weight: 700;
	line-height: 1.2;
	color: #333332;
}

.site-title a {
	text-decoration: none;
	color: inherit;
}

.site-description {
	margin: 0.4375em 0 0;
	font-family: var(--highlight-font-family);
	font-stretch: condensed;
	font-size: 17px;
	font-weight: inherit;
	line-height: 1.4;
	word-wrap: break-word;
	color: #757575;
}
.header-v2 .main-navigation {
	grid-column: col 3/span 3;
	grid-column: col 100 / span 1;
	grid-row: row;
}
.site-branding-v2 {
	grid-column: col / span 2;
	grid-row: row;
}
/*--------------------------------------------------------------
## Basic navigation menus - handles submenu and small screen toggle
--------------------------------------------------------------*/
.nav--toggle-small .menu-toggle {
	display: block;
	margin: 0 auto;
	padding: 0.6em 1.2em 0.5em;
	font-family: var(--highlight-font-family);
	font-stretch: condensed;
	font-size: 80%;
	text-transform: uppercase;
	border: 2px solid #000;
	border-radius: 0;
	background: #000;
}

.nav--toggle-small .menu {
	display: none;
}

.nav--toggle-sub .dropdown,
.nav--toggle-sub .dropdown-toggle {
	display: none;
}

@media (--narrow-menu-query) {

	.nav--toggle-small.nav--toggled-on .menu {
		display: block;
	}
}

@media (--wide-menu-query) {

	.nav--toggle-small .menu-toggle {
		display: none;
	}

	.nav--toggle-small .menu {
		display: block;
	}

	.nav--toggle-sub ul ul {
		display: none;
		position: absolute;
		top: 100%;
		flex-direction: column;
		padding: 10px;
		background: #fff;
		margin-left: 0;
		box-shadow: 0 3px 20px rgba(0, 0, 0, 0.06);
		z-index: 1;
	}

	.nav--toggle-sub .dropdown,
	.nav--toggle-sub .dropdown-toggle {
		display: block;
		background: transparent;
		position: absolute;
		right: 0;
		top: 50%;
		width: var(--dropdown-symbol-width);
		height: var(--dropdown-symbol-width);
		font-size: inherit;
		line-height: inherit;
		margin: 0;
		padding: 0;
		border: none;
		border-radius: 0;
		transform: translateY(-50%);
		overflow: visible;
	}

	.nav--toggle-sub .dropdown-symbol {
		display: block;
		background: transparent;
		position: absolute;
		right: 20%;
		top: 35%;
		width: 60%;
		height: 60%;
		border: solid #000;
		border-width: 0 2px 2px 0;
		transform: translateY(-50%) rotate(45deg);
	}

	.nav--toggle-sub ul ul .dropdown,
	.nav--toggle-sub ul ul .dropdown-toggle {
		top: 40%;
		right: 0.5em;
	}

	.nav--toggle-sub ul ul .dropdown-symbol {
		transform: rotate(-45deg);
	}

	.nav--toggle-sub .dropdown-toggle:hover,
	.nav--toggle-sub .menu-item--has-toggle:hover .dropdown-toggle {
		pointer-events: none;
	}

	/* Need menu-item-has-children for non-JS */
	.nav--toggle-sub li.menu-item-has-children,
	.nav--toggle-sub li.menu-item--has-toggle {
		position: relative;
		padding-right: var(--dropdown-symbol-width);
		transition: all 0.5s ease-in-out;
	}

	/*
	 * If the dropdown toggle is active with JS, then
	 * we'll take care of showing the submenu with JS.
	 */
	.nav--toggle-sub li:hover > ul,
	.nav--toggle-sub li:focus a ul,
	.nav--toggle-sub li.menu-item--toggled-on > ul,
	.nav--toggle-sub li:not(.menu-item--has-toggle):focus > ul {
		display: block;
		animation: fadeInUpMenu 0.4s ease-in;
	}

	@keyframes fadeInUpMenu {

		from {
			opacity: 0.8;
			-webkit-transform: translate3d(0, 5%, 0);
			transform: translate3d(0, 5%, 0);
		}

		80% {
			opacity: 0.9;
			-webkit-transform: translate3d(0, 1%, 0);
			transform: translate3d(0, 1%, 0);
		}

		to {
			opacity: 1;
			-webkit-transform: translate3d(0, 0, 0);
			transform: translate3d(0, 0, 0);
		}
	}

	.fadeInUpMenu {
		animation-name: fadeInUpMenu;
	}

	/*
	 * "focus-within" is an alternative to focus class for
	 * supporting browsers (all but IE/Edge) for no-JS context
	 * (e.g. AMP) See https://caniuse.com/#feat=css-focus-within
	 *
	 * This selector needs to stay separated, otherwise submenus
	 * will not be displayed with IE/Edge.
	 */
	.nav--toggle-sub li:not(.menu-item--has-toggle):focus-within > ul {
		display: block;
	}
}

/*--------------------------------------------------------------
## Main navigation menu
--------------------------------------------------------------*/
.main-navigation {
	clear: both;
	display: block;
	margin: 0 auto 0;
	padding: 0;
	max-width: var(--content-width);
	font-family: var(--highlight-font-family);
	font-stretch: condensed;
/*	background-color: #fff;*/
}

.main-navigation a {
	display: block;
	width: 100%;
	padding: 0.5em 1em 0.5em 0;
	text-decoration: none;
	color: #000;
}

.main-navigation a:hover,
.main-navigation a:focus {
	text-decoration: none;
	color: var(--color-link-active);
}

.main-navigation ul {
	display: block;
	list-style: none;
	margin: 0;
	padding: 0 0 12px 0;
}

.main-navigation ul ul li {
	padding-left: 1em;
}

.current-menu-item a{
	color: var(--color-link-active);
}
@media screen and (max-width: 600px) {
	header#masthead {
		width: 100%;
		display: flex;
		flex-direction: row;
		align-items: baseline;
		position: relative;
		background: #ffffff;
	}

	.site-branding{
		flex-basis: 80%;
		text-align: left;
		padding-left: 15px;
		padding-right: 15px;
	}
	p.site-title {
		margin: 0;
	}
	.primary-menu-container {
		position: absolute;
		width: 100%;
		left: 0;
		top: 100%;
		background: #DDDDDD;
		margin-top: 0;
		padding: 0 20px;
		z-index: 99;
	}
	ul#primary-menu li {
		border-bottom: 1px solid #eee;
	}
	ul#primary-menu li.menu-item-has-children {
		border-bottom: none;
	}
	.wp-rig-container{
		margin-top: 0;
	}

}


  /* Extra Small Devices, Phones */
@media only screen and (max-width : 480px) {
	.main-navigation{
		padding-bottom: 30px;
	}
	.main-navigation ul{
		padding: 0 30px;
	}

}
@media (--wide-menu-query) {


	.main-navigation ul li a {
		padding: 1.2em 0.5em;
	}

	.main-navigation ul li {
		margin: 0 0 0 0.5em;
	}

	.main-navigation ul li:first-child {
		margin-left: 0;
	}

	.main-navigation ul ul a {
		width: 200px;
	}

	/* stylelint-disable */
	.main-navigation ul ul li {
		padding-left: 0;
		margin-left: 0;
	}
	/* stylelint-enable */

	.main-navigation ul ul li a {
		width: 218px;
		background: none;
		padding: 5px 18px;
		font-size: 17px;
	}

	.main-navigation ul ul ul {
		top: -10px;
		left: 100%;
		min-height: 100%;
	}

	.main-navigation .menu {
		display: flex;
		flex-wrap: wrap;
		justify-content: center;
	}
	nav#site-navigation {
		margin-right: 15px;
	}
}

/*--------------------------------------------------------------
# Content navigation
--------------------------------------------------------------*/
.site-main .comment-navigation,
.site-main .posts-navigation,
.site-main .post-navigation,
.site-main .pagination {
	margin: 0 auto 2em;
	max-width: var(--content-width);
	overflow: hidden;
	padding: 0 1.5rem 2em;
	font-family: var(--highlight-font-family);
	font-stretch: condensed;
}

@media (--content-query) {

	.site-main .comment-navigation,
	.site-main .posts-navigation,
	.site-main .post-navigation,
	.site-main .pagination {
		padding-left: 2.5rem;
		padding-right: 2.5rem;
		padding-top: 2.5rem;
		padding-bottom: 2.5rem;
	}
}

.nav-links {
	display: flex;
}

.comment-navigation .nav-previous,
.posts-navigation .nav-previous,
.post-navigation .nav-previous {
	width: 50%;
	flex: 1 0 50%;
}

.comment-navigation .nav-next,
.posts-navigation .nav-next,
.post-navigation .nav-next {
	text-align: end;
	flex: 1 0 50%;
}

.post-navigation-sub span {
	color: var(--global-font-color);
	text-decoration: none;
	display: inline-block;
}

.site-main .pagination {
	margin-bottom: 1.5em;
}

.pagination .nav-links {
	justify-content: center;
	flex-wrap: wrap;
}

.pagination .page-numbers {
	display: inline-block;
	margin-bottom: 0.5em;
	margin-right: 1em;
	border: 1px solid var(--color-link);
	min-width: 2em;
	line-height: 2;
	text-align: center;
	text-decoration: none;
}

.pagination a:visited {
	color: var(--color-link);
}

.pagination a:hover,
.pagination a:focus,
.pagination a:active {
	border-color: var(--color-theme-primary);
	background: var(--color-theme-primary);
	color: #fff;
	transition: all 0.5s ease;
}

.pagination .prev,
.pagination .next {
	min-width: auto;
	border-color: transparent;
}

.pagination .prev:hover,
.pagination .prev:focus,
.pagination .prev:active,
.pagination .next:hover,
.pagination .next:focus,
.pagination .next:active {
	border-color: transparent;
	background-color: transparent;
	color: var(--color-theme-primary);
	transition: all 0.5s ease;
}

.pagination .dots {
	min-width: auto;
	border: none;
}

.pagination .current {
	border-color: var(--color-theme-primary);
	background: var(--color-theme-primary);
	color: #fff;
	transition: all 0.5s ease;
}

/*--------------------------------------------------------------
# Footer
--------------------------------------------------------------*/
.site-footer {
	margin: 0;
	padding: 0;
	font-family: var(--highlight-font-family);
	font-stretch: condensed;
	background: #fff;
}

.site-info {
	padding: 30px 0;
	text-align: center;
}

/*--------------------------------------------------------------
# Infinite scroll
--------------------------------------------------------------*/

/* Globally hidden elements when Infinite Scroll is supported and in use. */
.infinite-scroll .posts-navigation,
.infinite-scroll .pagination,
.infinite-scroll.neverending .site-footer {

	/* Theme Footer (when set to scrolling) */
	display: none;
}

/* When Infinite Scroll has reached its end we need to re-display elements that
were hidden (via .neverending) before. */
.infinity-end.neverending .site-footer {
	display: block;
}

/*--------------------------------------------------------------
# Container
--------------------------------------------------------------*/
.wp-rig-container {
	margin: 40px auto 40px auto;
	grid-template-columns: 2fr 1fr;
	max-width: 1170px;
}
.wp-rig-container-header{
	margin: 0 auto 40px;
	max-width: 1170px;
	display: grid;
	padding: 20px 0;
}


/*
* Accessibel Mobile Menu Style
*/
.nav--toggle-sub ul li.menu-item-has-children:focus ul.sub-menu {
	display: block;
}