@font-face {
  font-family: 'CanelaDeck-Light';
  src: url("https://coyo.com/wp-content/plugins/adm-flyout-menu/fonts/CanelaDeck-Light.eot#iefix") format("embedded-opentype"),
  url("https://coyo.com/wp-content/plugins/adm-flyout-menu/fonts/CanelaDeck-Light.otf") format("opentype"),
  url("https://coyo.com/wp-content/plugins/adm-flyout-menu/fonts/CanelaDeck-Light.woff") format("woff"),
  url("https://coyo.com/wp-content/plugins/adm-flyout-menu/fonts/CanelaDeck-Light.ttf") format("truetype");
  font-weight: normal;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'CanelaDeck-Regular';
  src: url('https://coyo.com/wp-content/plugins/adm-flyout-menu/fonts/CanelaDeck-Regular-Web.woff2') format('woff2'),
  url("https://coyo.com/wp-content/plugins/adm-flyout-menu/fonts/CanelaDeck-Regular-Web.woff") format("woff");
  font-weight: normal;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Recoleta-Regular';
  src: url('https://coyo.com/wp-content/themes/coyo/assets/fonts/recoleta/recoleta-regular.otf') format('otf'),
  url('https://coyo.com/wp-content/themes/coyo/assets/fonts/recoleta/Recoleta-Regular.woff2') format('woff2'),
  url('https://coyo.com/wp-content/themes/coyo/assets/fonts/recoleta/Recoleta-Regular.woff') format('woff');
  font-weight: normal;
  font-style: normal;
  font-display: block;
}

/*
body.hold {
  height: 100vh;
  overflow: hidden;
}*/
.body-wrap {
  padding-top: 0;
}

.body-wrap .adm-bg-container {
  opacity: 0;
  position: fixed;
  width: 100vw;
  height: 100vh;
  background-position: 100% 0;
  background-color: #fff;
  background-size: cover;
  top: 0;
  left: 0;
  -webkit-transition-property: opacity, z-index;
  transition-property: opacity, z-index;
  -webkit-transition-timing-function: ease;
  transition-timing-function: ease;
  -webkit-transition-duration: 0.7s;
  transition-duration: 0.7s;
  z-index: 1000;
}

.body-wrap.hold .adm-bg-container {
  opacity: 1;
}

.adm-flyout-menu-wrap {
  background: #F0F0ED;
  display: none;
  min-height: 100vh;
  left: 0;
  padding: 20px 20px 20px 150px;
  position: absolute;
  top: 0;
  width: 652px;
  max-width: 50vw;
  z-index: 10000;
  scroll-behavior: auto;
  -ms-overflow-style: none;
  overflow: -moz-scrollbars-none;
}

.adm-flyout-menu-wrap li a {
  font-family: Recoleta-Regular, sans-serif;
  color: #B88B5F;
}

/* hover colour D3A479 */

.adm-flyout-menu-wrap {
  background: #F0F0ED;
}

.adm-flyout-menu-wrap ul.menu {
  background: #F0F0ED;
}

.adm-flyout-menu-wrap .menu > li {
  /* background: #F0F0ED; */
}

.adm-flyout-menu-wrap .close-button-inner:before,
.adm-flyout-menu-wrap .close-button-inner:after {
  background: #B88B5F;
}

.adm-flyout-button-wrap .hamburger-inner,
.adm-flyout-button-wrap .hamburger-inner:after,
.adm-flyout-button-wrap .hamburger-inner:before {
  background: #B88B5F;
}

.adm-flyout-menu-wrap::-webkit-scrollbar {
  width: 0 !important;
}

.adm-flyout-menu-wrap nav > div > ul > li > a {
  -webkit-transition: 0.2s ease-in-out color;
  transition: 0.2s ease-in-out color;
}

.adm-flyout-menu-wrap nav > div > ul:hover > li > a {
  color: #B88B5F;
}

.adm-flyout-menu-wrap nav > div > ul > li > a:hover {
  color: #ae7d4c;
}

.adm-flyout-menu-wrap ul {
  list-style-type: none;
}

.adm-flyout-menu-wrap li {
  display: block;
}

.adm-flyout-menu-wrap li a {
  color: #B88B5F;
  font-family: 'Recoleta-Regular', serif;
  letter-spacing: -0.85px;
}

.adm-flyout-menu-wrap li li a {
  font-family: 'Graphik Lite', serif;
  font-weight: 600;
  letter-spacing: 0.11em;
  color: #636363;
}

.adm-flyout-menu-wrap .extra-content {
  font-family: 'Graphik Lite', serif;
  font-weight: 600;
}

.adm-flyout-menu-wrap li li a {
  display: inline-block;
  text-transform: uppercase;
  position: relative;
  line-height: 1.5rem;
  letter-spacing: 0.2em;
}

.adm-flyout-menu-wrap li li a:after {
  content: '';
  display: block;
  border-bottom: 1px solid #636363;
  position: absolute;
  bottom: 3px;
  width: 0;
  left: 50%;
  margin: 0 auto;
  -webkit-transition: 0.3s ease;
  transition: 0.3s ease;
}

.adm-flyout-menu-wrap li li a:hover:after {
  width: 100%;
  left: 0;
}

.adm-flyout-menu-wrap .extra-content {
  font-size: 0.875rem;
  display: block;
  z-index: 1000;
  position: relative;
  line-height: 1.4rem;
  padding-left: 1.5rem;
  margin-top: 90px;
  letter-spacing: 1px;
}

.adm-flyout-menu-wrap .extra-content strong {
  font-family: "Graphik", sans-serif;
  font-weight: 600;
  color: #808080;
}

.adm-flyout-menu-wrap .extra-content a {
  color: #808080;
  display: inline-block;
  position: relative;
}

.adm-flyout-menu-wrap .extra-content a:after {
  content: '';
  display: block;
  border-bottom: 1px solid #808080;
  position: absolute;
  bottom: 0;
  width: 0;
  left: 50%;
  margin: 0 auto;
  -webkit-transition: 0.3s ease;
  transition: 0.3s ease;
}

.adm-flyout-menu-wrap .extra-content a:hover:after {
  width: 100%;
  left: 0;
}


button.hamburger:hover, button.hamburger:focus {
  background: initial;
  cursor: pointer;
  outline: none;
}

.adm-flyout-menu-wrap.is-active, .adm-flyout-menu-wrap.second-level.is-active {
  display: block;
}

.adm-flyout-menu-wrap .close-button {
  cursor: pointer;
  display: inline-block;
  height: 50px;
  position: absolute;
  overflow: hidden;
  right: 40px;
  top: 40px;
  width: 50px;
  background: transparent;
  outline: none;
  -webkit-transition: 0.3s ease transform;
  transition: 0.3s ease transform;
}

#adm-flyout-menu-button.hamburger {
  transition-timing-function: linear;
  transition-duration: 1.15s;
  transition-property: opacity, filter;
  margin-top: 8px;
}

.hamburger-inner {
  height: 0;
  margin-top: 10px;
}

.hamburger-inner:after, .hamburger-inner:before {
  height: 2px;
}

.hamburger.is-active, .hamburger--collapse.is-active .hamburger-inner:after {
  /* opacity: 0; */
}

.adm-flyout-button-wrap {
  position: absolute;
  right: 0;
}

.adm-flyout-button-wrap .hamburger.is-active .hamburger-inner {
  background-color: #b88b5f;
}

.adm-flyout-button-wrap .hamburger.is-active .hamburger-inner:after, .adm-flyout-button-wrap .hamburger.is-active .hamburger-inner:before {
  background-color: #B88B5F;
}

.adm-flyout-button-wrap .hamburger-inner {
  background-color: #B88B5F;
}

.adm-flyout-button-wrap .hamburger-inner:after, .adm-flyout-button-wrap .hamburger-inner:before {
  background-color: #B88B5F;
  opacity: 1;
}

.adm-flyout-menu-wrap .close-button-inner:before, .adm-flyout-menu-wrap .close-button-inner:after {
  display: block;
  content: '';
  position: absolute;
  width: 50px;
  height: 2px;
  -webkit-transition-timing-function: ease;
  transition-timing-function: ease;
  -webkit-transition-duration: .15s;
  transition-duration: .15s;
  -webkit-transition-property: -webkit-transform;
  transition-property: -webkit-transform;
  transition-property: transform;
  transition-property: transform, -webkit-transform;
  border-radius: 4px;
  background-color: #B88B5F;
}

.adm-flyout-menu-wrap .close-button-inner:before {
  -webkit-transform: rotate(-45deg);
  transform: rotate(-45deg);
}

.adm-flyout-menu-wrap .close-button-inner:after {
  -webkit-transform: rotate(45deg);
  transform: rotate(45deg);
}

.rotate-90 {
  -webkit-transform: rotate(90deg);
  transform: rotate(90deg);
  display: inline-block;
}

.second-level.is-active + .close-button {
  -webkit-transform: translateX(300px);
  transform: translateX(300px);
  z-index: 10000;
}

.adm-flyout-menu-wrap.second-level {
  margin-left: 50%;
  z-index: 999;
  width: 300px;
}

.adm-flyout-menu-wrap.is-active, .adm-flyout-menu-wrap.second-level.is-active {
  display: block;
}

.adm-flyout-menu-wrap ul.menu {
  margin-top: 190px;
  margin-bottom: 50px;
  padding: 0;
  position: relative;
  background: #F0F0ED;
}

.adm-flyout-menu-wrap .menu > li {
  /* background: #F0F0ED; */
  display: block;
  position: relative;
  z-index: 1000;
}

.adm-flyout-menu-wrap ul > li {
  font-size: 30pt;
  line-height: 1.4em;
  text-transform: capitalize;
}

.adm-flyout-menu-wrap ul > li.is-active > .sub-menu {
  z-index: 1000;
  display: block;
}

.adm-flyout-menu-wrap ul > li > .sub-menu {
  top: 30px;
  display: none;
  position: absolute;
  padding: 0;
  width: 65%;
  z-index: 999;
}

.adm-flyout-menu-wrap ul > li > .sub-menu li {
  font-size: 9.5pt;
  opacity: 0;
  -webkit-transform: translate(-30px, 10px);
  transform: translate(-30px, 10px);
  -webkit-transition: 0.3s all;
  transition: 0.3s all;
  -webkit-transition-timing-function: ease-in;
  transition-timing-function: ease-in;
}

.adm-flyout-menu-wrap ul > li > .sub-menu li.visible {
  opacity: 1;
  -webkit-transform: translate(0, 0);
  transform: translate(0, 0);
}

.adm-flyout-menu-wrap li a, .adm-flyout-menu-wrap li p {
  position: relative;
  letter-spacing: -0.85px;
  z-index: 1000;
}

@media (max-width: 899px) {
  .adm-flyout-button-wrap {
    position: absolute;
  }

  .adm-flyout-menu-wrap {
    min-height: 100vh;
    width: 100%;
    max-width: 100vw;
    padding: 20px 0 20px 20px;
  }

  .adm-flyout-menu-wrap .close-button {
    z-index: 999999;
  }

  .adm-flyout-menu-wrap ul {
    position: relative;
    z-index: 999;
  }

  .adm-flyout-menu-wrap ul.menu {
    background: transparent;
    margin-top: 70px;
  }

  .adm-flyout-menu-wrap ul.menu > li > a {
    font-size: 46.2px;
  }

  .adm-flyout-menu-wrap ul.menu li {
    background: transparent;
  }

  .adm-flyout-menu-wrap ul .menu-item-has-children > :after {
    content: '';
    width: 0;
    height: 0;
    top: 50%;
    margin-top: -4px;
    right: 1rem;
    border: inset 7px;
    border-color: #ffce9d transparent transparent;
    position: initial;
    display: inline-block;
    margin-left: 7px;
    -webkit-transition: 0.3s ease;
    transition: 0.3s ease;
  }

  .adm-flyout-menu-wrap ul .menu-item-has-children.is-active > :after {
    -webkit-transform: rotate(180deg);
    transform: rotate(180deg);
    margin-bottom: 8px;
  }

  .adm-flyout-menu-wrap ul .menu-item-has-children.is-active ul {
    position: relative;
    margin-left: 50px;
    top: 0;
    padding-bottom: 20px;
    width: 100%;
  }

  .adm-flyout-menu-wrap ul .menu-item-has-children.is-active ul.sub-menu:after {
    content: '';
    display: none;
  }

  .adm-flyout-menu-wrap ul .menu-item-has-children.is-active ul li {
    opacity: 1;
  }

  .adm-flyout-menu-wrap .extra-content {
    font-size: 20.9px;
    font-weight: 200;
    line-height: 30.8px;
  }
}

@media (max-width: 414px) {
  .adm-flyout-menu-wrap ul.menu > li > a {
    font-size: 43.2px;
  }
}