$b: 'car_models_catalog_items_item';

.#{$b} {
  border: solid 1px #ccc;
  @include border-radius(20px);
  @include box-shadow(#ccc 0 0 5px);
  margin: 0 0 10px;
  padding: 10px 10px 20px;
}

.#{$b}.related {
  background-color: #eef;
}

.#{$b}__title {
  color: $blue_color;
  font-size: 28px;
}

.#{$b}__gallery {
  float: left;
  margin: 0 20px 0 0;
  padding: 10px;
  width: 210px;
  height: 195px;
  font-size: 0;
  line-height: 0;
  @include box-shadow(#ccc 0 0 3px);
}

.#{$b}_row {
  margin: 0 0 20px;
}

.#{$b}__gallery-item-big {
  display: inline-block;
  width: 190px;
  height: 130px;
  padding: 4px;
  margin-bottom: 5px;
  @include box-shadow(#ccc 0 0 3px);
}

.#{$b}__gallery-item-small {
  display: inline-block;
  width: 60px;
  height: 40px;
  padding: 2px 3px;
  margin-right: 5px;
  @include box-shadow(#ccc 0 0 3px);
  &.last {
    margin-right: 0;
  }
  &.display-none {
    display: none;
  }
}

.#{$b}__attributes {
  overflow: hidden;
  min-width: 210px;
}

.#{$b}__attributes-header {
  color: $blue_color;
  font-size: 24px;
}

.#{$b}__attributes-elem {
  display: inline-block;
  min-width: 140px;
  margin-right: 15px;
  font-size: 18px;
}

.#{$b}__description, .#{$b}__description_s {
  color: $blue_color;
  font-size: 20px;
}

.#{$b}__cost, .#{$b}__cost_s {
  color: $hl_color;
  font-size: 24px;
}

.#{$b}__hint {
  color: #333;
  font-size: 10px;
}

.#{$b}__description, .#{$b}__cost {
  display: none;
}

@media (min-width: 992px) {
  .#{$b}_row {
    margin-bottom: 0;
  }
  .#{$b}__attributes {
    min-height: 195px;
    position: relative;
  }
  .#{$b}__description_s, .#{$b}__cost_s {
    display: none;
  }
  .#{$b}__description, .#{$b}__cost {
    display: block;
  }
  .#{$b}__description {
    margin-top: 20px;
    margin-bottom: 30px;
  }
  .#{$b}__cost {
    position: absolute;
    bottom: 0;
    left: 0 ;
  }
}