.mobile_nav_tab {
     position: fixed;
    z-index: 999;
    bottom: 0;
    width: 100%;
    display: flex;
    align-items: stretch;
    /*width: 23rem;*/
    height: 63px;
  }
.mobile_nav_tab.moving .menu_icon {
    pointer-events: none;
  }
.mobile_nav_tab[data-selected="1"] .menu_icon:nth-child(1), 
.mobile_nav_tab[data-selected="2"] .menu_icon:nth-child(2), 
.mobile_nav_tab[data-selected="3"] .menu_icon:nth-child(3) {
    top: 8px;
    /*transform: translate(calc(-50% + 20px), calc(-50% + 4px));*/
    transform:translate(0, -18px);
    color: #8fd2eb;
    font-size: 26px;
    transition: 0.25s 0.375s;
    /* pointer-events: none; */
    /*position: absolute;*/
  }
  
.mobile_nav_tab[data-selected="3"] .menu_icon:nth-child(3) {
    transform: translate(0, -18px);
}
.mobile_nav_tab[data-selected="1"] .menu_icon:nth-child(1).initialised, body .mobile_nav_tab[data-selected="2"] .menu_icon:nth-child(2).initialised, body .mobile_nav_tab[data-selected="3"] .menu_icon:nth-child(3).initialised {
    -webkit-animation: hide 0.9s forwards;
            animation: hide 0.9s forwards;
  }
.mobile_nav_tab[data-selected="1"] .bar .middle .side:first-child, body .mobile_nav_tab[data-selected="3"] .bar .middle .side:last-child {
    flex-grow: 0;
  }
.mobile_nav_tab .menu_div {
    position: relative;
    z-index: 2;
    display: flex;
    justify-content: space-between;
    width: calc(100% - 0rem);
    padding: 0 1rem;
    align-items: center;
    height: 100%;
  }
.mobile_nav_tab .menu_div .menu_icon {
    /*position: relative;*/
    top: 15px;
    /*width: 4rem;*/
    line-height: 1.2;
    font-size: 16px;
    text-align: center;
    cursor: pointer;
    transition-delay: 0.1875s;
        width: 112px;
  }
.mobile_nav_tab .menu_div .menu_icon.initialised {
    -webkit-animation: hide2 0.375s;
            animation: hide2 0.375s;
  }
  .menu_icon_label {
    /*position: absolute;*/
    font-size: 12px;
    left: 50%;
    /*transform: translateX(-50%);*/
    bottom: -10px;
    margin-bottom:0;
    font-family: arial;
    font-weight: normal;
  }
.mobile_nav_tab .bar {
    z-index: 1;
    position: absolute;
    display: flex;
    align-items: stretch;
    filter: drop-shadow(0 0 0.5rem rgba(0, 0, 0, 0.1)) drop-shadow(0 0 0.25rem rgba(0, 0, 0, 0.1));
    width: 100%;
    height: 100%; 
  }
.mobile_nav_tab .bar .cap {
    background: white;
    width: 1rem;
  }
.mobile_nav_tab .bar .cap:first-child {
    /*border-bottom-left-radius: 1rem;*/
    border-top-left-radius: 0.5rem;
    box-shadow: 0.25rem 0 0 white;
  }
.mobile_nav_tab .bar .cap:last-child {
    /*border-bottom-right-radius: 1rem;*/
    border-top-right-radius: 0.5rem;
    box-shadow: -0.25rem 0 0 white;
  }
.mobile_nav_tab .bar .middle {
    flex-grow: 1;
    position: relative;
    display: flex;
  }
.mobile_nav_tab .bar .middle .circle {
    position: relative;
    top: -1.75rem;
    width: 7rem;
    height: 5.75rem;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='112' height='92' viewBox='0 0 112 92'%3E%3Ccircle cx='56' cy='36' r='36' fill='%23FFF'/%3E%3Cpath d='M104 35.2L104 35.2c0 26.3-20.9 48.3-47.2 48.8C29.9 84.4 8 62.8 8 36v-0.8c0-4-3.2-7.2-7.2-7.2H0v64h112V28h-0.8C107.2 28 104 31.2 104 35.2z' fill='%23FFF'/%3E%3C/svg%3E");
  width: 112px;
    height: 92px;}
  .mobile_nav_tab .bar .middle .circle::after{
      position: absolute;
    content: '';
    width: 80px;
    height: 80px;
    background: transparent;
    border: 4px solid #8fd2eb;
    border-radius: 50%;
    left: 50%;
    transform: translateX(-50%);
    box-shadow: inset 0 0 9px 0 #b1b1b1;
      
      
  }
.mobile_nav_tab .bar .middle .side {
    flex-grow: 1;
    background: white;
    transition: 0.75s ease;
  }
  
  @-webkit-keyframes hide {
    0%, 100% {
      opacity: 1;
    }
    25%, 75% {
      opacity: 0;
    }
  }
  
  @keyframes hide {
    0%, 100% {
      opacity: 1;
    }
    25%, 75% {
      opacity: 0;
    }
  }
  @-webkit-keyframes hide2 {
    0%, 100% {
      opacity: 1;
    }
    15%, 75% {
      opacity: 0;
    }
  }
  @keyframes hide2 {
    0%, 100% {
      opacity: 1;
    }
    15%, 75% {
      opacity: 0;
    }
  }