.main-nav {
  position: -webkit-sticky;
  position: sticky;
  top: 0;
  z-index: 1;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  width: 100%;
  height: 4vw;
  background-color: #85B551;
  -webkit-box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.16), 0 2px 10px 0 rgba(0, 0, 0, 0.12);
  box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.16), 0 2px 10px 0 rgba(0, 0, 0, 0.12); }
  .main-nav ol {
    list-style: none;
    padding: 0;
    margin: 0 auto; }
    .main-nav ol li {
      display: inline-block;
      height: 100%;
      width: 20vw;
      margin: 0;
      padding: 0;
      position: relative; }
      .main-nav ol li a {
        text-decoration: none;
        display: block;
        color: white;
        font-size: 2vw;
        -webkit-transition: background .3s;
        -o-transition: background .3s;
        transition: background .3s;
        height: 100%;
        text-align: center;
        position: relative; }
        .main-nav ol li a:hover {
          background-color: #DC2B19; }
        .main-nav ol li a.actual {
          background-color: #3A860F; }
      .main-nav ol li p {
        width: 100%;
        margin: 0;
        padding: 0;
        position: absolute;
        top: 50%;
        -webkit-transform: translateY(-50%);
        -ms-transform: translateY(-50%);
        transform: translateY(-50%); }
        .main-nav ol li p span.arrow {
          font-size: 1.6vw; }
      .main-nav ol li ul {
        width: -webkit-fit-content;
        width: -moz-fit-content;
        width: fit-content;
        visibility: hidden;
        position: absolute;
        padding: 0;
        top: 4vw;
        -webkit-transform-origin: 50% 0;
        -ms-transform-origin: 50% 0;
        transform-origin: 50% 0;
        -webkit-transform: scaleY(0);
        -ms-transform: scaleY(0);
        transform: scaleY(0);
        -webkit-transition: -webkit-transform .3s;
        transition: -webkit-transform .3s;
        -o-transition: transform .3s;
        transition: transform .3s;
        transition: transform .3s, -webkit-transform .3s; }
        .main-nav ol li ul li:last-child {
          border-radius: 0 0 10px 10px; }
      .main-nav ol li:hover ul {
        z-index: 2;
        height: auto;
        visibility: visible;
        -webkit-transform: scaleY(1);
        -ms-transform: scaleY(1);
        transform: scaleY(1); }
        .main-nav ol li:hover ul li {
          min-width: 100%;
          width: -webkit-fit-content;
          width: -moz-fit-content;
          width: fit-content;
          background-color: #85B551;
          margin: 0;
          padding: 0;
          float: none;
          height: 3.33333vw;
          line-height: 3.33333vw;
          -webkit-box-sizing: border-box;
          box-sizing: border-box; }
          .main-nav ol li:hover ul li:last-child {
            border-radius: 0 0 10px 10px; }
          .main-nav ol li:hover ul li a {
            white-space: nowrap; }

@media only screen and (orientation: portrait) {
  .main-nav {
    height: 12vw; }
    .main-nav ol li {
      width: 25vw; }
      .main-nav ol li a {
        font-size: 4vw; }
      .main-nav ol li ul {
        top: 12vw; }
      .main-nav ol li:hover ul li {
        height: 10vw;
        line-height: 10vw; }
        .main-nav ol li:hover ul li a {
          padding: 0 2vw; } }