/* Large Devices, Wide Screens */
@media only screen and (max-width : 1200px) {
  .sidebar .nav>li>a { font-size: 1em; }
  table { font-size: 0.8em; }
}

/* Medium Devices, Desktops */
@media only screen and (max-width : 992px) {  

  .sidebar { width: 16em; }
  .pageSection { padding-left: 20em; }

  #mainSidebarContainer { z-index: 100; width: 70%; }
  #mainSidebarContainer { -webkit-animation-duration: 0.5s; animation-duration: 0.5s; -webkit-animation-fill-mode: both; animation-fill-mode: both;   }  
  #mainSidebarContainer { -webkit-animation-name: slideOutLeftVisible; animation-name: slideOutLeftVisible; }  
  #mainSidebarContainer.off { -webkit-animation-name: slideInLeft; animation-name: slideInLeft; }    
  #sidebarLogo { background-position: 50% 0; }
  .pageSection {  padding: 0 2em 0 3em; }  
  
  .col-md-4.text-right { text-align: left; }
  .panel-group { margin-top: 20px; }

}

/* Small Devices, Tablets */
@media only screen and (max-width : 768px) {
  /*#burgerOuter { display: inline-block;  }*/  
/*  #mainSidebarContainer.off { display: none; }
  #mainSidebarContainer.on,
  #mainSidebarContainer.off { visibility: visible; }*/

  /*@-webkit-keyframes burgerMenuTopOn { 50% { top: 12px; -ms-transform: rotate(0deg); -webkit-transform: rotate(0deg); transform: rotate(0deg);  }  100% { top: 12px; -ms-transform: rotate(45deg); -webkit-transform: rotate(45deg); transform: rotate(45deg);  } }  @keyframes burgerMenuTopOn { 50% { top: 12px; -ms-transform: rotate(0deg); -webkit-transform: rotate(0deg); transform: rotate(0deg);  }  100% { top: 12px; -ms-transform: rotate(45deg); -webkit-transform: rotate(45deg); transform: rotate(45deg);  } }      */
  
  

}

/* Extra Small Devices, Phones */ 
@media only screen and (max-width : 480px) {   
  /* Login */
  #loginInner,
  #loginLogo { width: 100%; border: none; box-shadow: none; }
  #loginLogo { width: 50%; }
  footer.fixed { font-size: 10px; line-height: 14px; }
}

/* Custom, iPhone Retina */ 
@media only screen and (max-width : 320px) {

}

/* ---------------- */
/* MOBILE FIRST */
/* ---------------- */

/* Custom, iPhone Retina */ 
@media only screen and (min-width : 320px) {
  .center-xs { text-align: center; }
  .right-xs { text-align: right; }
  .left-xs { text-align: left; }
}
/* Extra Small Devices, Phones */ 
@media only screen and (min-width : 480px) {
  .center-xs,
  .center-sm { text-align: center; }
  .right-xs,
  .right-sm { text-align: right; }
  .left-xs,
  .left-sm { text-align: left; }
}
/* Small Devices, Tablets */
@media only screen and (min-width : 768px) {
  .center-xs,
  .center-sm,
  .center-md { text-align: center; }
  .right-xs,
  .right-sm,
  .right-md { text-align: right; }
  .left-xs,
  .left-sm,
  .left-md { text-align: left; }
}
/* Medium Devices, Desktops */
@media only screen and (min-width : 992px) {
  .center-xs,
  .center-sm,
  .center-md,
  .center-lg { text-align: center; }
  .right-xs,
  .right-sm,
  .right-md,
  .right-lg { text-align: right; }
  .left-xs,
  .left-sm,
  .left-md,
  .left-lg { text-align: left; }
}
/* Large Devices, Wide Screens */
@media only screen and (min-width : 1200px) {
  .center-xs,
  .center-sm,
  .center-md,
  .center-lg,
  .center-xl { text-align: center; }
  .right-xs,
  .right-sm,
  .right-md,
  .right-lg,
  .right-xl { text-align: right; }
  .left-xs,
  .left-sm,
  .left-md,
  .left-lg,
  .left-xl { text-align: left; }
}