@-ms-viewport {
  width: device-width;
}

#sidebar-mask {
  background-color: #333;
  width: 100%;
  height: 100%;
  filter: alpha(opacity=60);
  opacity: .6;
  z-index: 99;
  position: absolute;
  top: 0;
  left: 0;
  display: none;
}

@media (max-width: 400px) {
  .navbar .brand {
      float: none;
      margin: 0 auto;
  }

  .navbar .navbar-search {
      clear: both;
      margin: 0 auto;
      float: none;
  }

  .navbar .search-query {
      display: block;
      margin: 0 auto;
  }
}

@media (max-width: 979px) {

  .navbar {
      margin: 0 5px;
      z-index: 999;
      width: auto !important;
  }

  .navbar .container, #main,
  #content, #footer_main {
      width: 100%;
      min-width: 0;
  }

  .navbar .nav.pull-right {
      float: none;
      clear: both;
  }

  #responsive-sidebar-trigger {
      display: none;
  }

  #main {
      /*overflow: hidden;*/
      margin: 20px auto;
      min-height: 0;
  }

  #content .panel {
      margin: 0 5px;
  }

  #sidebar {
      float: none;
      position: absolute;
      right: -100%;
      top: 0;
      background-color: #fff;
      z-index: 999;
      border: 5px solid #ccc;
      border-right: 0;
      -webkit-transition: .3s right;
      -moz-transition: .3s right;
      -ms-transition: .3s right;
      -o-transition: .3s right;
      transition: .3s right;
      display: none;
  }

  #content .topic_title {
      font-size: 1em;
      width: 100%;
  }

  #content .last_time {
      position: absolute;
      bottom: 0;
      right: 10px;
      font-size: .8em;
  }

  #content .last_time img {
      display: none;
  }

  #content .reply_count {
      position: absolute;
      bottom: 0;
      left: 85px;
      text-align: left;
      line-height: 2em;
      font-size: 10px;
  }

  .topic_title_wrapper {
      padding-left: 40px;
  }

  #main .topic_content p a.content_img,
  #main .reply_content p a.content_img {
      width: 100%;
  }

  #footer {
      margin: 0 5px 5px;
  }

  #footer_main {
    display: none;
  }

  #backtotop {
      background-color: #f5f5f5;
      border: 1px solid #ccc;
      border-right: 0;
  }

  .form-horizontal .control-label {
      float: none;
      width: auto;
      padding-top: 0;
      text-align: left;
  }

  .form-horizontal .controls {
      margin-left: 0;
  }

  .form-horizontal .control-list {
      padding-top: 0;
  }

  .form-horizontal .form-actions {
      padding-right: 10px;
      padding-left: 10px;
  }

  #content .reply_content {
      clear: both;
      padding-left: 0;
      padding-top: 5px;
  }

  #content .action {
    display: none;
  }

  .user_profile {
    margin-top: 0;
  }
}