@media only screen and (max-width: 400px) {
  /*.mapbox {
    top: 0px !important;
    
  }
  .app-header.header {
    display:none !important;
  }
  .car-list {
    display:none;
  }*/



  .hor-toggle.animated-arrow {
    padding: 8px !important;
  }

  a.animated-arrow.hor-toggle > span {
    display: none;
  }

  .xs-screen-toolbar {
    display: none;
  }

  .footer-xs-screen {
    display: none;
  }

  .tool-container {
    bottom: 17px !important;
  }

    .tool-container > .tool-bar {
      border-radius: 10px !important;
    }
}

@media only screen and (max-width: 600px) {

  .horizontalMenu > .horizontalMenu-list {
    width: 200px !important;
  }

  .horizontalMenu .add-device-div {
    right: 12px !important;
  }

  .navlogo {
    display: none !important;
  }

  a.animated-arrow.hor-toggle > span {
    display: none;
  }

  a.hor-toggle.animated-arrow {
    padding: 3px 35px 16px 0px !important;
    margin: 15px 0 0 6px !important
  }

  .animated-arrow {
    top: 0px !important;
  }

  .tool-container {
    bottom: 17px !important;
  }

    .tool-container > .tool-bar {
      border-radius: 10px !important;
    }

  /*.xs-screen-toolbar{
    display:none;
  }

  ul.xs-navbar-screen {
    font-size: 24px !important;
  }
  ul.xs-navbar-screen > li {
    margin-left: 7px !important;
    margin-right: 7px !important;
  }*/
}

/*@media only screen and (min-width: 500px) {

  .footer-xs-screen {
    display:none;
  }
  .xs-screen-toolbar {
    display: none
  }
  ul.xs-navbar-screen {
    font-size: 25px !important;
  }

    ul.xs-navbar-screen > li {
      margin-left: 12px !important;
      margin-right: 12px !important;
    }
}*/


@media only screen and (min-width: 600px) {

  a.animated-arrow.hor-toggle > i {
    display: none;
  }

  .navlogo-xs {
    display: none;
  }

  .tool-container {
    bottom: 17px !important;
  }

    .tool-container > .tool-bar {
      border-radius: 10px !important;
    }

  ul.xs-navbar-screen {
    font-size: 26px !important;
  }

    ul.xs-navbar-screen > li {
      margin-left: 17px !important;
      margin-right: 17px !important;
    }
}

@media only screen and (max-width: 768px) {
  .footerbox {
    display: none;
  }

  .tool-container {
  }

  .notification-pane {
    display: none
  }
}

@media only screen and (min-width:768px) {

  .notification-pane-xs {
    bottom: 58px !important;
  }

  .notification-pane {
    display: none;
  }

  .tool-container {
    bottom: 46px !important;
  }

  .footerbox {
    display: block;
  }

  .footer-xs-screen {
    display: none;
  }

  .car-list {
    position: fixed;
    z-index: 1;
    width: 300px;
    margin: 5px;
    overflow-y: scroll;
    overflow-x: hidden;
    
  }

  .list-group.projects-list {
    max-height: 400px;
  }

  /*.car-panel {
     max-height: 400px ;
    }*/
}

@media only screen and (min-width:800px) {
  .horizontalMenu > .horizontalMenu-list{
    min-height:95% !important;
  }

  .add-device-div > a {
    position: relative;
    bottom: 75px;
    left: 25px;
  }
  .notification-pane-xs {
    display: none;
  }

  .notification-pane {
    display: inline-block;
  }
}

@media only screen and (min-width:992px){
  .add-device-div > a {
   position:static;
  }
}

@media only screen and (max-width:1200px) {

  .car-list {
    position: fixed;
    z-index: 1;
    width: 300px;
    margin: 15px;
    overflow: scroll;
    overflow-x: hidden;
    max-height: 500px
  }

  .list-group.projects-list {
    max-height: 550px;
  }
}

  @media only screen and (min-width:1920px) {

    .car-list {
      position: fixed;
      z-index: 1;
      width: 300px;
      margin: 15px;
      overflow: scroll;
      overflow-x: hidden;
      max-height: 600px
    }

    .list-group.projects-list {
      max-height: 550px;
    }
  }

    /*.car-panel {
      max-height: 500px
    }*/

  
