/* ========================================================
*
* 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; 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: 768px) 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: 767px) {  .hidden-desktop {    display: inherit !important; }
  .visible-desktop {    display: none !important; }
  .visible-phone {    display: inherit !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 {    width: 159px;   font-size: 17px; }
  .navbar .toggle-sidebar {    display: none; }
  .navbar-fixed-top {    margin-right: 0px;   margin-left: 0px; }
  #container.fixed-header {    margin-top: 0; }
  .sidebar-fixed,  #sidebar {    position: relative !important;   top: 0; }
  #divider {    left: -8px; }}
@media (max-width: 767px) {  .navbar .navbar-brand {    padding: 10px 20px 10px;   margin-left: -10px; }}
@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: 768px) and (max-width: 979px) {  #sidebar {    width: 180px;   overflow: visible;   float: left;   border-right: 1px solid #d1d1d1; }
  #sidebar ul#nav > li.current > a {    border-right: 2px solid #668eb0; }
  #sidebar ul#nav > li.current > a > .arrow {    right: 2px !important; }
  #sidebar ul#nav li a {    font-size: 12px; }
  #sidebar ul#nav li ul.sub-menu {    margin-left: 0px; }
  #sidebar ul#nav li ul.sub-menu li a {    font-size: 11px; }
  #sidebar ul#nav li ul.sub-menu li ul.sub-menu {    margin-left: 10px;   margin-right: 0; }
  #divider {    display: none; }
  .slimScrollBar,  .slimScrollRail {    display: none !important; }
  #content {    margin-left: 181px; }
  /*[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: 767px) {  body {    padding-left: 0px;   padding-right: 0px; }
  html {    overflow-x: hidden; }
  .container {    padding: 0; }
  #content {    margin-left: 0; }
  .row {    margin-left: -15px;   margin-right: -15px; }
  .navbar .container {    padding: 0;   /* * * * * * * * * * * *
  			 * Dropdown
  			 * * * * * * * * * * * */
  
  }
  .navbar .container .nav > li.nav-toggle {    display: block; }
  .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 {    background-color: #4d7496;   color: #fff; }
  .navbar .container .nav > li > .dropdown-menu.extended > li.footer > a {    background-color: #f9f9f9; }
  #divider {    display: none; }
  /* * * * * * * * * * * *
  	 * Project Switcher
  	 * * * * * * * * * * * */
  #project-switcher .project-list li {    padding: 0 10px; }
  #container {    position: relative;   left: 0px;   padding-left: 20px;   padding-right: 20px; }
  #sidebar {    position: fixed !important;   overflow: hidden;   overflow-y: auto;   top: 0;   left: -250px;   width: 249px;   height: 100%;   z-index: 1;   border-right: 1px solid #d1d1d1;   -webkit-transition: left 0.3s ease;   -moz-transition: left 0.3s ease;   -o-transition: left 0.3s ease;   transition: left 0.3s ease; }
  #sidebar ul#nav > li.current > a {    border-right: 2px solid #668eb0; }
  #sidebar ul#nav li a {    padding: 12px 15px; }
  #sidebar ul#nav li ul.sub-menu li a {    padding: 10px 15px 10px 20px; }
  #container,  .header,  #sidebar {    -webkit-transition: left 0.3s ease;   -moz-transition: left 0.3s ease;   -o-transition: left 0.3s ease;   transition: left 0.3s ease; }
  .nav-open #container,  .nav-open .header,  .nav-open #sidebar {    left: 250px;   -webkit-transition: left 0.3s ease;   -moz-transition: left 0.3s ease;   -o-transition: left 0.3s ease;   transition: left 0.3s ease; }
  .nav-open #sidebar {    left: 0; }
  .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; }
  /* * * * * * * * * * * *
  	 * Login
  	 * * * * * * * * * * * */
  .login .logo {    margin-top: 0 !important; }
  .login .box {    width: 100% !important; }
  .login .single-sign-on {    width: 90% !important; }}