
#mobile .submenu, #mobile .sub-menu {display:none!important;}

#mobile .menu-icon-toggle {
        display: block;
    width: 25px;
    height: 30px;
    position: absolute;
    z-index: 999999;
    margin-top: 37.5px;
    left: 4%;cursor:pointer;
}
.home .menu-icon-toggle {
  top: 50px;
  position: absolute;
  right: 20px;
  top: 20px;
}
#mobile .menu-icon-toggle span {
  display: block;
  width: 100%;
  height: 2px;
  position: absolute;
  top: 50%;
  background-color:#05BCD7;
  transform: translate(0, -50%);
  transition: opacity 0.3s 0.3s;
}
#mobile .home:not(.open) .menu-icon-toggle span {
  background-color: #fff;
}
#mobile .menu-icon-toggle::before, #mobile .menu-icon-toggle::after {
  content: "";
  display: block;
  width: 100%;
  height: 2px;
  position: absolute;
  background-color: #05BCD7;
  transition: transform 0.3s, top 0.3s 0.3s, bottom 0.3s 0.3s;
}
#mobile .menu-icon-toggle::before {
  top: 6px;
}
#mobile .menu-icon-toggle::after {
  bottom: 6px;
}
.open #mobile .menu-icon-toggle span {
  opacity: 0;
  transition: opacity 0.3s;
}
.open #mobile .menu-icon-toggle::before, .open #mobile .menu-icon-toggle::after {
  
}
.open #mobile .menu-icon-toggle::before {
  top: calc(50% - 1px);
  transform: rotate(45deg);
}
.open #mobile .menu-icon-toggle::after {
  bottom: calc(50% - 1px);
  transform: rotate(-45deg);
}
.open #mobile .menu-icon-toggle::before, #mobile .menu-icon-toggle::after {
  transition: top 0.3s, bottom 0.3s, transform 0.3s 0.3s;
}

#mobile .menu-background {
  visibility: hidden;
    width: 500%;
    height: 450px;
    position: absolute;
    left: -215%;
    background-color: #fff;
    transition: background-position 0.5s, transform 0.5s 0.5s, visibility 0.5s 1s;
    z-index: 333333;
}

@media screen and (max-width:480px) {#mobile .menu-background {left: -255%;}}

.open #mobile .menu-background {
  visibility: visible;
  transition: background-position 0.5s, transform 0.5s 0.5s;
}
#mobile .menu-background.top {
  transform: rotate(-45deg) translateY(-150%);
  background: linear-gradient(to top, #05BCD7 50%, #fff 50%);
  background-size: 100% 200%;
  background-position: -100% 100%;
}
.open #mobile .menu-background.top {
  transform: rotate(-45deg) translateY(-49%);
  background-position: 0 0;
}
#mobile .menu-background.middle {
  transform: rotate(-45deg) translateY(50%) scaleY(0);
  background: #fff;background:#05BCD7;
}
.open #mobile .menu-background.middle {
  transform: rotate(-45deg) translateY(50%) scaleY(1);
}
#mobile .menu-background.bottom {
  transform: rotate(-45deg) translateY(250%);
  background: linear-gradient(to bottom, #fff 50%, #05BCD7 50%);
  background-size: 100% 200%;
  background-position: 0 -100%;
}
.open #mobile .menu-background.bottom {
  transform: rotate(-45deg) translateY(149%);
  background-position: 0 0;
}

#mobile .menu {
  position: fixed;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  visibility: hidden;
  list-style-type: none;
  margin: 0;
  padding: 0;
  z-index: 99999;    z-index: 999999;
}
.open #mobile .menu {
  visibility: visible;
}
#mobile .menu li {
  opacity: 0;
  margin-bottom: 5px;
  transform: translateX(20px);
  transition: all 0.3s;
}








.open #mobile .menu li {
  opacity: 1;
  transform: translateX(0);
  -webkit-backface-visibility: hidden;
          backface-visibility: hidden;
}
.open #mobile .menu li:nth-child(1) {
  transition-delay: 1.1s;
}
.open #mobile .menu li:nth-child(1) span {
  transition-delay: 1.1s;
}
.open #mobile .menu li:nth-child(2) {
  transition-delay: 1.2s;
}
.open #mobile .menu li:nth-child(2) span {
  transition-delay: 1.2s;
}
.open #mobile .menu li:nth-child(3) {
  transition-delay: 1.3s;
}
.open #mobile .menu li:nth-child(3) span {
  transition-delay: 1.3s;
}
.open #mobile .menu li:nth-child(4) {
  transition-delay: 1.4s;
}
.open #mobile .menu li:nth-child(4) span {
  transition-delay: 1.4s;
}
.open #mobile .menu li:nth-child(5) {
  transition-delay: 1.5s;
}
.open #mobile .menu li:nth-child(5) span {
  transition-delay: 1.5s;
}
.open #mobile .menu li:nth-child(6) {
  transition-delay: 1.6s;
}
.open #mobile .menu li:nth-child(6) span {
  transition-delay: 1.6s;
}
.open #mobile .menu li:nth-child(7) {
  transition-delay: 1.7s;
}
.open #mobile .menu li:nth-child(7) span {
  transition-delay: 1.7s;
}
.open #mobile .menu li:nth-child(8) {
  transition-delay: 1.8s;
}
.open #mobile .menu li:nth-child(8) span {
  transition-delay: 1.8s;
}
.open #mobile .menu li:nth-child(9) {
  transition-delay: 1.9s;
}
.open #mobile .menu li:nth-child(9) span {
  transition-delay: 1.9s;
}
.open #mobile .menu li:nth-child(10) {
  transition-delay: 2s;
}
.open #mobile .menu li:nth-child(10) span {
  transition-delay: 2s;
}
.open #mobile .menu li:nth-child(11) {
  transition-delay: 2.1s;
}
.open #mobile .menu li:nth-child(11) span {
  transition-delay: 2.1s;
}
.open #mobile .menu li:nth-child(12) {
  transition-delay: 2.2s;
}
.open #mobile .menu li:nth-child(12) span {
  transition-delay: 2.2s;
}
.open #mobile .menu li:nth-child(13) {
  transition-delay: 2.3s;
}
.open #mobile .menu li:nth-child(13) span {
  transition-delay: 2.3s;
}
#mobile .menu a {
  position: relative;
  font-size: 23px;
  text-decoration: none;padding: 5px 0;
  color: #006A7A;    font-family: CenturyB;
}
#mobile .menu a::before {
      content: "";
    display: block;
    height: 2px;
    width: 0;
    position: absolute;
    left: -40px;
    top: 50%;
    background-color: #006A7A;
    transform: translateY(-60%);
    transition: width 0.5s;
}
#mobile .menu a:hover::before {
  width: 25px;
}

#mobile .content {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 100%;
  text-align: center;
  color: #fff;
  transition: all 0.3s 1s;
}
.open #mobile .content {
  opacity: 0;
  transition: all 0.3s;
}