.MobileNav, .mobile-menu-bar {
	display: none;
}

@media (max-width: 1199px) {
	body.home div.wp-site-blocks header.wp-block-template-part, 
	body.home div.wp-site-blocks header.wp-block-template-part.sticky,
	div.wp-site-blocks header.wp-block-template-part {
		height: 60px!important;
	}
	div.wp-site-blocks header.wp-block-template-part.sticky .phone-button .wp-element-button, 
	div.wp-site-blocks header.wp-block-template-part .phone-button .wp-element-button,
	div.wp-site-blocks header.wp-block-template-part .wp-element-button.wp-block-button__link:has(.fa-phone) {
		background-color: #136913 !important;
		height: 60px!important;
		border-radius: 0 0 !important;
		width: 55px!important;
		padding: 0 0 !important;
		display: flex;
		align-items: center;
		justify-content: center;
		margin-right: 0!important;
	}
	header.wp-block-template-part .wp-element-button.wp-block-button__link:has(.fa-phone):hover {
		background-color: #000!important;
	}
	header.wp-block-template-part .wp-element-button.wp-block-button__link:has(.fa-phone):hover [class*=fa-] {
		color: #FFF!important;
	}
	header.wp-block-template-part .wp-element-button.wp-block-button__link:has(.fa-phone) [class*=fa-] {
		left: 0;
	}
	header.wp-block-template-part .wp-block-column.col-tel {
		position: absolute;
        top: 0;
        right: 75px!important;
        width: 60px;
        overflow: hidden;
	}
	div.wp-site-blocks header.wp-block-template-part .wp-block-site-logo {
		box-shadow: 0 5px 10px rgba(0, 0, 0, .2);
		padding: 0 0!important;
	}
	div.wp-site-blocks header.wp-block-template-part .wp-block-site-logo,
	div.wp-site-blocks header.wp-block-template-part .wp-block-site-logo a {
		height: 70px;	
	}
	div.wp-site-blocks header.wp-block-template-part .wp-block-site-logo a {
		display: flex;
		flex-wrap: wrap;
		flex-direction: column;
		align-items: center;
		justify-content: center;
	}
	.mobile-menu-bar {
		display: flex;
		flex-wrap: wrap;
		align-items: center;
		justify-content: center;
		appearance: none;
		border: none;
		width: 50px;
		height: 60px;
		padding: 0 0;
		position: absolute;
        top: 0;
        right: 20px;
		background-color: transparent;
		z-index: 999;
		cursor: pointer;
	}
	.mobile-menu-bar span.sr-only {
		position: absolute;
		top: 0;
		left: 0;
	}
	.mobile-menu-bar span.bar {
		display:flex;
		width: 75%;
		height: 3px;
		background: #FFF;
		position: relative;
	}
	.mobile-menu-bar span.bar:before,
	.mobile-menu-bar span.bar:after {
		content:"";
		display: block;
		width: 100%;
		height: 100%;
		background: #FFF;
		position: absolute;
		left: 0;
		transition: all ease .2s;
	}
	.mobile-menu-bar span.bar:before {
		top: -10px;
	}
	.mobile-menu-bar span.bar:after {
		top: 10px;
	}
	.mobile-menu-bar[aria-expanded="true"] span.bar {
		background: transparent;
	}
	.mobile-menu-bar[aria-expanded="true"] span.bar:before {
		transform: rotate(45deg) translateY(13px);
		left: 10px;
	}
	.mobile-menu-bar[aria-expanded="true"] span.bar:after {
		transform: rotate(-45deg) translateY(-13px);
		left: 10px;
	}
	.MobileNav {
		display: none;
		max-width: 400px;
		width: 100%;
		height: 100vh;
		position: fixed;
		top: 60px;
		right: 0;
		z-index: 10;
		overflow: hidden;
		background: #FFF;
		box-shadow: 0 10px 15px rgba(0,0,0,.15);
		padding-top: 30px;
		padding-bottom: 30px;
		-webkit-animation-duration: .5s;
		animation-duration: .5s;
		-webkit-animation-fill-mode: both;
		animation-fill-mode: both;
	}
	.MobileNav.show {
		display: block;
		-webkit-animation-name: slideInRight;
  		animation-name: slideInRight;
	}
	.MobileNav.closed {
		display: block;
		-webkit-animation-name: slideOutRight;
  		animation-name: slideOutRight;
		pointer-events: none;
	}
	.MobileNav ul.mobile-block-navigation {
		height: 88%;
		overflow: auto;
	}
	.MobileNav ul {
		margin: 0 0;
		padding: 0 0;
		list-style: none;
	}
	.MobileNav ul > li > a {
		display: block;
		padding: 12px 20px;
		color: #115733;
		font-size: 20px;
		line-height:1.3;
		text-decoration: none!important;
		transition: all ease .3s;
	}
	.MobileNav ul li.current-menu-item > a,
	.MobileNav ul > li > a:hover, 
	.MobileNav ul > li > a:focus {
		background: #115733;
		color: #FFF!important;
	}
	.MobileNav ul > li {
		border-bottom: 1px solid #CCC;
	}
}

@media screen and (max-width: 500px) {
	.MobileNav {
		max-width: 100%;
	}
}

@keyframes slideInRight {
  from {
    -webkit-transform: translate3d(100%, 0, 0);
    transform: translate3d(100%, 0, 0);
    visibility: visible;
  }

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

@keyframes slideOutRight {
  from {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }

  to {
    visibility: hidden;
    -webkit-transform: translate3d(100%, 0, 0);
    transform: translate3d(100%, 0, 0);
  }
}

@keyframes slideInLeft {
  from {
    -webkit-transform: translate3d(-100%, 0, 0);
    transform: translate3d(-100%, 0, 0);
    visibility: visible;
  }

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

@keyframes slideOutLeft {
  from {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }

  to {
    visibility: hidden;
    -webkit-transform: translate3d(-100%, 0, 0);
    transform: translate3d(-100%, 0, 0);
  }
}

