$sticky-footer-height: 30px;

html {
  height: 100%;
  //min-height: 100%;
  position: relative;
}

body{
  height: 100%;
  //background: #ccc;
 // margin-bottom: $sticky-footer-height;
}

#footer {
  //position: absolute;
  bottom: 0;
  width: 100%;
  border-top: 1px solid #999999;
  padding-top: 10px;
  height: $sticky-footer-height;
  //background-color: #f5f5f5;
}

.content {
  margin-top: 10px;
}

.admin-layout {
  > .content {
    min-height: 100%;
    margin-top: 0;
    margin-bottom: -40px;
    padding-top: 80px;

    &:after{
      content: '';
      display: block;
      height: $sticky-footer-height;
      width: 100%;
    }
  }
}

/*
.date {
  font-size: 0.65em;
}
.time {
  font-size: 0.85em;
}
*/


.on {
  color: $color-status-on !important;
}

[data-device="status"],
.device-status {
  display: inline-block;
  vertical-align: middle;
  width: 10px; height: 10px;
  border-radius: 50%;
  background: $color-bg-300;
  border: 1px solid $color-bg-300;

  text-indent: 999999px;
  overflow: hidden;
}

[data-device="engine"],
[data-device="detect_engine"]{
  font-size: 1.3em;
  line-height: 1;
}

#sidebar [data-device="speed"] {
  @extend .rubberBand;
  @extend .animated;

  color: $color-text-600;
  font-size: 0.9em;
}


.action-icon {
  position: relative;
  display: inline-block;
  border-radius: 50%;
  line-height: 17px;
  width: 19px;
  height: 19px;
  text-align: center;
  font-size: 9px;
  font-weight: bold;

  background: #fff;
  border: 1px solid #cccccc;
  color: #000;

  .event-action & {
    background: #ea4f4f;
    color: #fff;
    border-color: #ea4f4f;
  }
  .park-action & {
    background: #848484;
    color: #fff;
    border-color: #848484;
  }
  .drive-action & {
    background: #1b99bd;
    color: #fff;
    border-color: #1b99bd;
  }
}

.datetime {
  .date,
  .time {
    white-space: nowrap;
  }
}

.center-vertical {
  width: 100%;
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
}

.scrollbox {
  @extend .scrollbar;
  overflow: auto;
  max-height: 250px;

  > .table {
    margin-bottom: 0;
  }
}
.scrollbox-large {
  @extend .scrollbox;

  max-height: 385px;
}
.scrollbox-vertical {
  @extend .scrollbox;
  overflow-x: hidden;
}
.scrollbox-vertical-large {
  @extend .scrollbox-vertical;

  max-height: 385px;
}

.icon-list {
  .radio,
  .radio-inline,
  .checkbox,
  .checkbox-inline {
    margin: 0;

    > label {
      padding: 7px;
      &:before,
      &:after {
        display: none;
      }
    }
    input:checked + label {
      background: $brand-primary;
    }
  }
}

.action-block {
  @extend .text-right;

  margin-bottom: 10px;

  .btn {
    @extend .btn-sm;
  }
}

.ui-sortable-handle {
  cursor:move;
}

.lang-list {
  @extend .clearfix;

  .lang-item {
    @extend .col-xs-6;
    @extend .col-sm-4;

    .btn {
      text-align: left;
    }
  }
}

.p-relative {
  position: relative !important;
}


.img-full-width {
  min-width: 100%;
  max-width: 100%;
}

#mapForPhoto {
  height: 140px;
  width: 100%;
}

#requestPhoto {
  .attributes {
    display: inline-block;
    vertical-align: middle;

    .form-group > label {
      display: none;
    }
  }
}

.row.no-padding {
  margin-right: 0;
  margin-left: 0;

  > [class^="col-"] {
    padding-left: 0;
    padding-right: 0;
  }
}

.tooltip-mark {
  display: inline-block;
  min-width: 6px;
  padding: 2px 5px;
  font-size: $font-size-smaller;
  font-weight: bold;
  color: #fff;
  line-height: 1;
  vertical-align: top;
  white-space: nowrap;
  text-align: center;
  background-color: $color-bg-300;
  border-radius: 10px;
}

.tooltip.tooltip-img{
  .tooltip-inner {
    border: 0;
    padding: 0;
    background: transparent;
  }
}
.tooltip.tooltip-imei{
  .tooltip-inner {
    background: $color-bg-000;
    display: table;

    .text {
      font-size: $font-size-larger;
      font-weight: 300;
      color: $color-text-100;
      display: table-cell;
      vertical-align: middle;
      padding-left: 20px;
      padding-right: 130px;
    }
  }
}

img {
  opacity: 1;
  transition: opacity 0.3s;
}

img[data-src] {
  opacity: 0;
}