/* Sass Document */
.mobilemenubutton{
	position: absolute;
	height: 50px;
	width: 50px;
	z-index: 1000;
	top: 186px;
	left: 26px;
	visibility: hidden;
	display: none;
}
.menu {
  height: 4rem; 
	-ms-transition: 1s all ease;
    -webkit-transition: 1s all ease;
    -moz-transition: 1s all ease;
    transition: 1s all ease;
}
  .menu ol {
    list-style-type: none;
    margin: 0 0 0 auto;
    padding: 0; }
  .menu > ol {
    max-width: 1100px;
    padding: 0 0;
    display: flex; }
    .menu > ol > .menu-item {
      flex: 1;
      padding: 0.812rem 0; }
      .menu > ol > .menu-item > a:first-child:nth-last-child(2):after {
        content: "";
		position: absolute;
		display: inline;
		width: 10px;
		height: 10px;
		margin-top: 10px;
		margin-left: 10px;
		background-color: none;
		background-image: url(../layout-images/arrow-down.svg);
		background-position: top left;
		background-repeat: no-repeat;
		background-size: contain;
        will-change: transform;

        transition: all 1s ease; }
      .menu > ol > .menu-item:hover > a:first-child:nth-last-child(2):after,
	  .menu > ol > .menu-item.is-open > a:first-child:nth-last-child(2):after{
		margin-top: 6px;
        transform: rotate(180deg); }
  .menu-item {
    position: relative;
    line-height: 1.8rem;
    text-align: center;
    font-size: 14px;  
	-ms-transition: 1s all ease;
    -webkit-transition: 1s all ease;
    -moz-transition: 1s all ease;
    transition: 1s all ease;}
.menu-item:hover,
.menu-item.is-open {
	background-color: rgba(0,0,0,0.60);}
    .menu-item a {
      overflow: hidden;
      white-space: nowrap;
      text-overflow: ellipsis;
      display: inline;
      color: #FFFFFF; 
	-ms-transition: 1s all ease;
    -webkit-transition: 1s all ease;
    -moz-transition: 1s all ease;
    transition: 1s all ease;}
    .sub-menu .menu-item {
	  background-image: url(../layout-images/menu-baseline.svg);
	  background-position: center bottom;
	  background-repeat: no-repeat;
	  background-size: auto;
      padding: 5px 10px;
      opacity: 0;
      transform-origin: bottom;
      animation: enter 0.2s ease forwards; }
	.sub-menu .menu-item:last-child {
        background-image: none;}
      .sub-menu .menu-item:nth-child(1) {
        animation-duration: 0.2s;
        animation-delay: 0s; }
      .sub-menu .menu-item:nth-child(2) {
        animation-duration: 0.3s;
        animation-delay: 0.1s; }
      .sub-menu .menu-item:nth-child(3) {
        animation-duration: 0.4s;
        animation-delay: 0.2s; }
      .sub-menu .menu-item:nth-child(4) {
        animation-duration: 0.5s;
        animation-delay: 0.3s; }
      .sub-menu .menu-item:nth-child(5) {
        animation-duration: 0.6s;
        animation-delay: 0.4s; }
      .sub-menu .menu-item:nth-child(6) {
        animation-duration: 0.7s;
        animation-delay: 0.5s; }
      .sub-menu .menu-item:nth-child(7) {
        animation-duration: 0.8s;
        animation-delay: 0.6s; }
      .sub-menu .menu-item:hover,
	  .sub-menu .menu-item:is-open{
        background-color: rgba(0,0,0,0.90); }
      .sub-menu .menu-item a {
        padding: 0 0.75rem; }
      @media screen and (max-width: 727px) {
        .sub-menu .menu-item {
          background-color:rgba(0,0,0,0.50);
		  } }
  @media screen and (max-width: 727px) {
	.mobilemenubutton{
	visibility: visible;
	display: block;
}
    .menu {
      position: relative; }
	  .menu-item:hover {
		background-color: rgba(0,0,0,0.30);}
      .menu:after {
        content: "";
        position: absolute;
        top: calc(50% - 2px);
        left: 1rem;
        width: 30px;
        height: 4px;
        background: rgba(130,184,0,1.00);
        box-shadow: 0 10px rgba(130,184,0,1.00), 0 -10px rgba(130,184,0,1.00); }
      .menu > ol {
        display: none;
        background: rgba(130,184,0,1.00);
        flex-direction: column;
        justify-content: center;
        height: auto;
        animation: fade 0.2s ease-out; }
        .menu > ol > .menu-item {
          flex: 0;
          opacity: 0;
          animation: enter 0.3s ease-out forwards; }
          .menu > ol > .menu-item:nth-child(1) {
            animation-delay: 0s; }
          .menu > ol > .menu-item:nth-child(2) {
            animation-delay: 0.1s; }
          .menu > ol > .menu-item:nth-child(3) {
            animation-delay: 0.2s; }
          .menu > ol > .menu-item:nth-child(4) {
            animation-delay: 0.3s; }
          .menu > ol > .menu-item:nth-child(5) {
            animation-delay: 0.4s; }
          .menu > ol > .menu-item + .menu-item {
            margin-top: 0px; }
          .menu > ol > .menu-item:after {
            left: auto;
            right: 1rem;
            bottom: calc(50% - 2px); }
          .menu > ol > .menu-item:hover,
	  	  .menu > ol > .menu-item.is-open{
            z-index: 1; }
      .menu:hover > ol,
	  .menu.is-open > ol {
        display: flex; 
	  	width: 70%;
	  	margin-left: auto;
	  	margin-right: auto;}
	  .menu:hover:after,
      .menu.is-open:after {
		background-color:#ffffff;
        box-shadow: none; }
}

.sub-menu {
  background-color: rgba(0,0,0,0.70);
  position: absolute;
  width: 150%;
  top: 100%;
  right: 0;
  display: none;
  z-index: 1;
  opacity: 1; }
  .menu-item:hover > .sub-menu,
  .menu-item.is-open > .sub-menu{
    display: block; }
  @media screen and (max-width: 727px) {
    .sub-menu {
	  background-color: rgba(0,0,0,0.20);
	  position:relative;
      width: 100%;
      left: 0rem;
      top: 13px !important; }
	  
	  .sub-menu .menu-item{
		  font-size: 12px !important;
	  }
	  
	  .menu-item.is-open > .sub-menu {
    display: block;
	}
}

html, body {
  font-size: 16px;
  margin: 0; }

* {
  box-sizing: border-box; }
  *:before, *:after {
    box-sizing: inherit; }

a {
  text-decoration: none; }

@keyframes enter {
  from {
    opacity: 0;
    transform: scaleY(0.98) translateY(10px); }
  to {
    opacity: 1;
    transform: none; } }
@keyframes fade {
  from {
    opacity: 0; }
  to {
    opacity: 1; } }