.navobile-mobile-only {
    display: none;
}

#navobile-device-pixel {
  width: 0;
}

@media screen and (min-width: 0px) and (max-width: 767px) {

    html,
    .navobile-bound {
      overflow-x: hidden;
      overflow-y: auto;
      height: auto;
      width: 100%;
    }

    .overflowscrolling {
      -webkit-overflow-scrolling: touch;
    }

    #navobile-device-pixel {
      width: 1px;
    }

    .navobile-mobile-only {
      display: block;
    }

    .navobile-desktop-only {
      display: none;
    }

    .navobile-navigation {
      height: 100%;
      left: -100%;
      overflow: auto;
      position: absolute;
      top: -100%;
      width: 80%;
      z-index: -1;

      -webkit-transform: translateX(0);
      -moz-transform: translateX(0);
      -ms-transform: translateX(0);
      -o-transform: translateX(0);
      transform: translateX(0);

    }

    .navobile-bound .navobile-navigation {
        left: 0;
        position: fixed;
        top: 0;
        z-index: 1;
    }

    .navobile-navigation ul {
      overflow: hidden;
    }

    .navobile-navigation li {
      float: none;
      overflow: hidden;
    }

    .navobile-content {
      position: relative;
      z-index: 3;

      -webkit-transition: -webkit-transform 0.2s linear;
      -moz-transition: -moz-transform 0.2s linear;
      -o-transition: -ms-transform 0.2s linear;
      -ms-transition: -o-transform 0.2s linear;
      transition: transform 0.2s linear;
    }

    .csstransforms .navobile-content.navobile-content-hidden {
      -webkit-transform: translateX(80%);
      -moz-transform: translateX(80%);
      -ms-transform: translateX(80%);
      -o-transform: translateX(80%);
      transform: translateX(80%);
    }

    .csstransforms .navobile-content.navobile-content-hidden {
      -webkit-transform: translate3d(80%,0,0);
      -moz-transform: translate3d(80%,0,0);
      -ms-transform: translate3d(80%,0,0);
      -o-transform: translate3d(80%,0,0);
      transform: translate3d(80%,0,0);
    }

    /*** Toggler **/
    a#show-navigation {
      display:inline-block;
      padding:5px;
      background:#222;
      position: absolute;
      left:5px;
      top:5px;
      z-index:10;
      outline:none;
    }

    a#show-navigation span.line {
      display:inline-block;
      height:3px;
      width:20px;
      border-radius: 1px;
      background:#FFF;
      margin:3px;
      display: block;
    }

    a#show-navigation span.line.first {
      margin-top:0;
    }

    a#show-navigation span.line.last {
      margin-bottom:0;
    }

    /** Look and Feel **/
    .navobile-navigation.block.with-block-editing:hover div.edit {
      display:none;
    }

    .navobile-navigation {
      background:#434343;
      color:#FFF;
    }

    .navobile-navigation a {
      color:#EEE;
      text-transform: uppercase;
    }

    .navobile-navigation ul {
      padding:0;
    }

    .navobile-navigation ul li {
      padding: 10px 20px;
      border-bottom:1px solid #666;
    }

    .navobile-navigation ul ul {
      margin-top:5px;
    }
    .navobile-navigation ul ul li {
      padding: 4px 0 4px 15px;
      border-bottom:none;
    }


    .navobile-navigation a:hover {
      text-decoration: none;
    }

    .navobile-navigation li a.active {
      color:#FFF;
    }

    /** Specific for Basic Theme - Other Theme please change accordingly **/
    .navobile-navigation form {
      padding:10px 20px;
    }

    .navobile-navigation #webcada-listing-search-products-form input.form-text {
      border-radius: 4px;
      width:97%;
      padding:1.5%;
    }

    .navobile-navigation ul {
      margin-top:0;
    }

    .navobile-navigation li a.active {
      color:#D55161;
    }

    .navobile-navigation li.li-cart {
      display: none;
    }

    #block-menu-menu-topheader li {
     // display: none;
    }

    #block-menu-menu-topheader li.li-cart {
      display: block;
      margin-left:0;
    }

    #navobile-block-menu-menu-topheader {
      border-bottom:1px solid #666;
      margin-bottom:0;
    }

    #navobile-block-menu-menu-topheader li {
      float:left;
      border:none;
    }

    #navobile-block-menu-menu-topheader li a {
      color:#EEE;
      font-size:0.9em;
    }


    #navobile-block-menu-menu-topheader li.li-login {
      float:none;
      display:block;
    }

    #navobile-block-menu-menu-topheader li.li-login a {
      padding:5px;
      display:block;
      background:#D55161;
      text-transform:uppercase;
      color:#FFF;
      text-align:center;
      max-width:240px;
    }

    #navobile-block-menu-menu-topheader li.li-login a:hover {
      opacity:0.85;
    }

    .navobile-navigation #superfish-1 {
      font-family:'Sanchez',serif;
    }
}