@include route(style,theme,child) {
  .sidr {
    /* Default Settings */
    display: none;
    position: absolute;
    position: fixed;
    top: 0;
    height: 100%;
    z-index: 999999;
    width: 260px;
    overflow-x: none;
    overflow-y: auto;

    .sidr-inner {
      padding: 0 0 15px;

      > p {
        margin-left: 15px;
        margin-right: 15px;
      }
    }

    &.right {
      left: auto;
      right: -260px;
    }

    &.left {
      left: -260px;
      right: auto;
    }

    /* Theme Settings */
    @include rem-fontsize($sidr-font-size);
    background: $sidr-background;
    color: $sidr-text-color;
    @include single-box-shadow($sidr-shadow-color, 0, 0, 5px, 5px, inset);

    h1, h2, h3, h4, h5, h6 {
      @include rem-fontsize($sidr-font-size - 4);
      font-weight: normal;
      padding: 0 15px;
      margin: 0 0 5px;
      color: $sidr-text-color;
      line-height: 24px;
      @include background-image(linear-gradient(lighten($sidr-background, 10%), darken($sidr-background, 10%)));
      @include single-box-shadow(rgba(#000, .2), 0, 5px, 5px, 3px);
    }

    p {
      @include rem-fontsize($sidr-font-size - 2);
      margin: 0 0 12px;
      a {
        color: rgba($sidr-text-color, .9);
      }
    }

    > p {
      margin-left: 15px;
      margin-right: 15px;
    }

    ul {
      display: block;
      margin: 0 0 15px;
      padding: 0;
      border-top: 1px solid darken($sidr-background, 10%);
      border-bottom: 1px solid lighten($sidr-background, 10%);

      li {
        display: block;
        margin: 0;
        line-height: 48px;
        border-top: 1px solid lighten($sidr-background, 10%);
        border-bottom: 1px solid darken($sidr-background, 10%);

        &:hover,
        &.active,
        &.sidr-class-active {
          border-top: none;
          line-height: 49px;

          > a, > span {
            @include single-box-shadow($sidr-shadow-color, 0, 0, 15px, 3px, inset);
          }
        }

        a, span {
          padding: 0 15px;
          display: block;
          text-decoration: none;
          color: $sidr-text-color;
        }

        ul {
          border-bottom: none;
          margin: 0;
          li {
            line-height: 40px;
            @include rem-fontsize($sidr-font-size - 2);

            &:last-child {
              border-bottom: none;
            }

            &:hover,
            &.active,
            &.sidr-class-active {
              border-top: none;
              line-height: 41px;

              > a, > span {
                @include single-box-shadow($sidr-shadow-color, 0, 0, 15px, 3px, inset);
              }
            }

            a, span {
              color: rgba($sidr-text-color, .8);
              padding-left: 30px;
            }
          }
        }
      }
    }

    form {
      margin: 0 15px;
    }

    label {
      @include rem-fontsize($sidr-font-size - 2);
    }

    input[type="text"],
    input[type="password"],
    input[type="date"],
    input[type="datetime"],
    input[type="email"],
    input[type="number"],
    input[type="search"],
    input[type="tel"],
    input[type="time"],
    input[type="url"],
    textarea, select {
      width: 100%;
      @include rem-fontsize($sidr-font-size - 2);
      padding: 5px;
      @include box-sizing(border-box);
      margin: 0 0 10px;
      @include border-radius(2px);
      border: none;
      background: rgba(#000, .1);
      color: rgba($sidr-text-color, .6);
      display: block;
      clear: both;
    }

    input[type=checkbox] {
      width: auto;
      display: inline;
      clear: none;
    }

    input[type=button],
    input[type=submit] {
      color: $sidr-background;
      background: $sidr-text-color;

      &:hover {
        background: rgba($sidr-text-color, .9);
      }
    }
  }
}