/* ========================================================
*
* Melon - Flat & Responsive Admin Template
*
* ========================================================
*
* File: responsive.css
* Description: Template styles for responsive design (for phone and tablet devices)
* Version: 1.0
*
* ======================================================== */
.clearfix {
  *zoom: 1;
}
.clearfix:before,
.clearfix:after {
  display: table;
  content: "";
  line-height: 0;
}
.clearfix:after {
  clear: both;
}
/* # Responsive Classes
================================================== */
@-ms-viewport {
  width: device-width;
}
.hidden {
  display: none !important;
  visibility: hidden;
}
.visible-phone {
  display: none !important;
}
.visible-tablet {
  display: none !important;
}
.hidden-desktop {
  display: none !important;
}
.visible-desktop {
  display: inherit !important;
}
@media (min-width: 601px) and (max-width: 979px) {
  .hidden-desktop {
    display: inherit !important;
  }
  .visible-desktop {
    display: none !important ;
  }
  .visible-tablet {
    display: inherit !important;
  }
  .hidden-tablet {
    display: none !important;
  }
}
@media (max-width: 600px) {
  .hidden-desktop {
    display: inherit !important;
  }
  .visible-desktop {
    display: none !important;
  }
  .visible-phone {
    display: inherit !important;
  }
  div.visible-phone {
    display: block !important;
  }
  table.visible-phone {
    display: table !important;
  }
  tr.visible-phone {
    display: table-row !important;
  }
  .hidden-phone {
    display: none !important;
  }
}
.visible-print {
  display: none !important;
}
@media print {
  .visible-print {
    display: inherit !important;
  }
  .hidden-print {
    display: none !important;
  }
}
/* # Media Queries
================================================== */
/* # Responsive Navbar/Navigation/Sidebar
================================================== */
/* # From 979px and below
-------------------------------------------------- */
@media (max-width: 979px) {
    /*
  body {
    padding-top: 0;
  }
  .navbar {
    position: relative;
    margin-bottom: 0;
  }
  */
  .navbar .navbar-inner {
    padding: 0px;
  }
  .navbar .container {
    width: auto;
  }
  .navbar .navbar-brand {
    /* font-size: 17px; */
  }

  .navbar-fixed-top {
    margin-right: 0px;
    margin-left: 0px;
  }
  #middle.fixed-header {
    margin-top: 0;
  }
}

@media (min-width: 980px) {
  .nav-collapse.collapse {
    height: auto !important;
    overflow: visible !important;
  }
}
/* # Large desktops
-------------------------------------------------- */
@media (min-width: 1200px) {
  
}
/* # Tablets to regular desktops
-------------------------------------------------- */
@media (min-width: 601px) and (max-width: 979px) {
  #sidebar {
    left: -180px;
    width: 179px;
  }
  #sidebar ul.navlist > li > a {
    border-right-width: 3px !important;
  }
  #sidebar ul.navlist > li.current > a {
    border-right-width: 3px !important;
  }
  #sidebar ul.navlist > li.current > a > .arrow {
    right: 2px !important;
  }
  #sidebar ul.navlist li a {
    font-size: 12px;
  }
  #sidebar ul.navlist li ul.sub-menu {
    margin-left: 0px;
  }
  #sidebar ul.navlist li ul.sub-menu li a {
    font-size: 11px;
  }
  #sidebar ul.navlist li ul.sub-menu li ul.sub-menu {
    margin-left: 10px;
    margin-right: 0;
  }

  .nav-open #content {
    margin-left: 180px;
  }

  .slimScrollBar,
  .slimScrollRail {
    display: none !important;
  }

  /*[class*="span"], .uneditable-input[class*="span"], .row-fluid [class*="span"] {
  		display: block;
  		float: none;
  		width: 100%;
  		margin-left: 0;
  		-webkit-box-sizing: border-box;
  		-moz-box-sizing: border-box;
  		box-sizing: border-box;
  	}*/
  .crumbs .crumb-buttons > li > a > span {
    display: none;
  }
  .page-stats li:first-child {
    margin-left: 0;
    padding-left: 0;
  }
  .page-stats li .summary {
    margin-right: 5px;
  }
  .input-xxlarge {
    width: 100%;
    min-height: 30px;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
  }
}
/* # Phones to portrait tablets and narrow desktops
-------------------------------------------------- */
@media (max-width: 600px) {
  body {
    padding-left: 0px;
    padding-right: 0px;
  }
  html {
    overflow-x: hidden;
  }
  .container {
    padding: 0;
  }

  .row {
    margin-left: -15px;
    margin-right: -15px;
  }
  .navbar .container {
    padding: 0;
    /* * * * * * * * * * * *
  			 * Dropdown
  			 * * * * * * * * * * * */
  
  }

  .navbar .navbar-brand {
        padding: 0 20px;
    }
  .navbar .container .navbar-brand {
    /*display: none;*/
  }
  .navbar .container .username {
    display: none;
  }
  .navbar .container .nav-left {
    margin-left: -2px;
  }
  .navbar .container .navbar-nav {
    float: left;
    margin-top: 0;
    margin-bottom: 0;
  }
  .navbar .container .navbar-nav.pull-right {
    float: right;
    width: auto;
  }
  .navbar .container .navbar-nav > li {
    float: left;
  }
  .navbar .container .nav > li > .dropdown-menu.extended {
    margin-right: -150px;
    width: 260px;
  }
  .navbar .container .nav > li > .dropdown-menu.extended > li > a {
    color: #6f6f6f;
    padding: 8px;
  }
  .navbar .container .nav > li > .dropdown-menu.extended > li > a:hover {
    color: #fff;
  }
  .navbar .container .nav > li > .dropdown-menu.extended > li.footer > a {
    background-color: #f9f9f9;
  }

  #middle .container {
    /*position: relative;
    left: 0px;*/
    padding-left: 20px;
    padding-right: 20px;
  }
  #sidebar {
    left: -180px;
    width: 179px;
  }
    #sidebar ul.navlist > li > a {
        border-right-width: 3px !important;
    }
    #sidebar ul.navlist > li.current > a {
        border-right-width: 3px !important;
    }

    .nav-open #sidebar {
        left: 0;
    }
  .nav-open #content {
    margin-left: 180px;
  }

  .crumbs .crumb-buttons > li > a > span {
    display: none;
  }
  .daterangepicker.dropdown-menu {
    min-width: 0px !important;
  }
  .daterangepicker.opensleft .calendar.right {
    float: none;
  }
  .left-box,
  .right-box {
    width: 100%;
    float: none;
  }
  .dual-control {
    width: auto;
    margin: 20px 0;
    position: static;
    left: 0;
  }
  .btn-group,
  .input-append,
  .input-prepend {
    white-space: normal;
  }
  .form-horizontal .form-actions {
    padding-left: 20px;
    padding-right: 20px;
  }
  .form-horizontal .form-group {
    margin-right: -15px;
    margin-left: -15px;
  }
  .input-width-large,
  .input-width-xlarge,
  .input-width-xxlarge {
    width: 100% !important;
    min-height: 30px;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
  }
  .select2-container-multi.full-width-fix .select2-search-field input {
    width: 100% !important;
  }
}
@media (max-width: 480px) {
  /*.page-header {
    text-align: center;
    margin: 0 auto;
  }*/
  .page-header .page-title {
    float: none;
  }
  .page-header .page-stats {
    display: none;
  }
  .crumbs {
    text-align: center;
  }
  .crumbs .breadcrumb {
    display: none;
  }
  .crumbs .crumb-buttons {
    float: none;
    margin: 0 auto;
    display: inline-block;
    height: 40px;
  }

}