.main-menu {
  opacity: 0;
  visibility: hidden;
  transition: visibility 0.3s ease-in-out, opacity 0.3s ease-in-out;
  display: none; }
  .main-menu.js-menu-open {
    display: block;
    opacity: 1;
    visibility: visible; }

.main-menu__toggle {
  background: transparent;
  border: 0;
  overflow: hidden; }

.main-menu__no-scroll {
  overflow: hidden; }

.main-menu__ham {
  z-index: 20;
  margin-left: 3.5%; }

.main-menu__list-item {
  margin-bottom: 0.5rem; }
  .main-menu__list-item a {
    color: #FFF;
    text-transform: capitalize; }

.main-menu__links-list {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-direction: column;
  flex-direction: column;
  padding-top: 180px;
  margin: 0 60px;
  -ms-flex-pack: center;
  justify-content: center; }
  .header__mobile .main-menu__links-list {
    padding-top: 0;
    margin: 0; }
  @media (min-width: 55em) {
    .main-menu__links-list {
      margin: 0;
      -ms-flex-direction: row;
      flex-direction: row;
      -ms-flex-wrap: wrap;
      flex-wrap: wrap;
      width: 90%; } }
  @media (max-height: 500px) and (min-width: 55em) {
    .main-menu__links-list {
      height: 60%;
      overflow-y: scroll;
      padding-top: 0;
      margin-top: 80px;
      position: absolute;
      top: 50%;
      transform: translateY(-50%); } }

.main-menu__list-item-title {
  margin-bottom: 2rem;
  padding: 0 2rem; }
  @media (min-width: 55em) {
    .main-menu__list-item-title {
      -ms-flex: 1 1 25%;
      flex: 1 1 25%;
      max-width: 260px;
      border-right: 2px solid #f0b310; }
      .main-menu__list-item-title:nth-child(4n), .main-menu__list-item-title:last-child {
        border-right: 0; } }
  @media (min-width: 75em) {
    .main-menu__list-item-title {
      -ms-flex: 1 1 20%;
      flex: 1 1 20%;
      padding: 0 1.5rem 0 3.5rem; }
      .main-menu__list-item-title:nth-child(4n) {
        border-right: 2px solid #f0b310; }
      .main-menu__list-item-title:nth-child(5n), .main-menu__list-item-title:last-child {
        border-right: 0; } }
  .main-menu__list-item-title > a {
    display: block;
    font-size: 1.5rem;
    color: #FFF;
    text-transform: capitalize;
    margin-bottom: 1rem; }

.main-menu__control {
  z-index: 20;
  width: 35px;
  height: 30px;
  position: relative;
  transform: rotate(0deg);
  transition: transform 0.3s ease-in-out, width 0.3s ease-in-out, left 0.3s ease-in-out, opacity 0.3s ease-in-out;
  cursor: pointer; }
  .main-menu__control span {
    display: block;
    position: absolute;
    height: 3px;
    width: 50%;
    background: #FFF;
    opacity: 1;
    transform: rotate(0deg);
    transition: transform 0.3s ease-in-out, width 0.3s ease-in-out, opacity 0.3s ease-in-out, top 0.3s ease-in-out, left 0.3s ease-in-out; }
  .main-menu__control span:nth-child(even) {
    left: 50%; }
  .main-menu__control span:nth-child(odd) {
    left: 0; }
  .main-menu__control span:nth-child(1),
  .main-menu__control span:nth-child(2) {
    top: 1px; }
  .main-menu__control span:nth-child(3),
  .main-menu__control span:nth-child(4) {
    top: 13px;
    opacity: 1; }
  .main-menu__control span:nth-child(5),
  .main-menu__control span:nth-child(6) {
    top: 26px; }
  .main-menu__control span:nth-child(6) {
    width: 15%; }
  .main-menu__control.js-menu-open span:nth-child(1),
  .main-menu__control.js-menu-open span:nth-child(6) {
    transform: rotate(45deg); }
  .main-menu__control.js-menu-open span:nth-child(2),
  .main-menu__control.js-menu-open span:nth-child(5) {
    transform: rotate(-45deg); }
  .main-menu__control.js-menu-open span:nth-child(1) {
    left: 3px;
    top: 7px; }
  .main-menu__control.js-menu-open span:nth-child(2) {
    left: calc(50% - 3px);
    top: 7px; }
  .main-menu__control.js-menu-open span:nth-child(3) {
    left: -25%;
    opacity: 0; }
  .main-menu__control.js-menu-open span:nth-child(4) {
    left: 75%;
    opacity: 0; }
  .main-menu__control.js-menu-open span:nth-child(5) {
    left: 3px;
    top: 18px; }
  .main-menu__control.js-menu-open span:nth-child(6) {
    left: calc(50% - 3px);
    top: 18px;
    width: 50%; }

.main-menu__full-page-container {
  background: #000;
  position: fixed;
  left: 0;
  top: 0;
  right: -100%;
  bottom: 0;
  z-index: 10;
  overflow: scroll;
  opacity: 0;
  visibility: hidden;
  display: none;
  -ms-flex-align: start;
  align-items: flex-start;
  -ms-flex-pack: center;
  justify-content: center;
  transition: right 0.3s ease-in-out, visibility 0.3s ease-in-out, opacity 0.3s ease-in-out; }
  @media (min-width: 55em) {
    .main-menu__full-page-container {
      -ms-flex-align: center;
      align-items: center;
      overflow: hidden;
      display: -ms-flexbox;
      display: flex; } }
  .main-menu__full-page-container.js-menu-open {
    right: 0;
    opacity: 1;
    visibility: visible; }