.DDLCars .gray {
  background-color: #e4e4e2;
}

.carsel {
  overflow-y: auto;
  overflow-x: hidden;
  opacity: 0;
}

.carsel .DDLCars {
  max-height: 325px;
}

.mainpage-car-block--garage-float {
  overflow-y: auto;
  overflow-x: hidden;
  width: 100%;
  opacity: 0;
  animation-name: fadeIn, maximize;
  animation-duration: 0.4s, 0s;
  animation-timing-function: ease;
  animation-delay: 0.4s;
  animation-fill-mode: forwards;
}

.defaultMode #addNew {
  display: none;
}

@keyframes fadeIn {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
@keyframes fadeOut {
  from {
    opacity: 1;
  }
  to {
    opacity: 0;
  }
}
@keyframes minimize {
  from {
    max-height: 900px;
  }
  to {
    max-height: 0px;
  }
}
@keyframes maximize {
  from {
    max-height: 0px;
  }
  to {
    max-height: 900px;
  }
}
@-webkit-keyframes fadeIn {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
@-webkit-keyframes fadeOut {
  0% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}
@-webkit-keyframes minimize {
  0% {
    max-height: 900px;
  }
  100% {
    max-height: 0px;
  }
}
@-webkit-keyframes maximize {
  0% {
    max-height: 0px;
  }
  100% {
    max-height: 900px;
  }
}
.carSelectionMode .mainpage-car-block--garage-float, .defaultMode .carsel {
  animation: fadeOut 0.4s ease 0s, minimize 0s ease 0.4s;
  animation-fill-mode: forwards;
  /*IOS*/
  -webkit-animation-name: fadeOut, minimize;
  -webkit-animation-duration: 0.4s, 0s;
  -webkit-animation-timing-function: ease;
  -webkit-animation-delay: 0s, 0.4s;
  -webkit-animation-fill-mode: forwards;
}

.carSelectionMode .carsel, .defaultMode .mainpage-car-block--garage-float {
  animation: fadeIn 0.4s ease 0.4s, maximize 0s ease 0.4s;
  animation-fill-mode: forwards;
  /*IOS*/
  -webkit-animation-name: fadeIn, maximize;
  -webkit-animation-duration: 0.4s, 0s;
  -webkit-animation-timing-function: ease;
  -webkit-animation-delay: 0.4s;
  -webkit-animation-fill-mode: forwards;
}

.carSelectionMode .mainpage-car-block--garage-float {
  max-width: 0;
}

.FloatPanel .mainpage-header {
  font-family: Arial, Tahoma, sans-serif;
  text-transform: uppercase;
}

.mainpage-car-block__car-actions-column ul li {
  overflow: hidden;
  margin-bottom: 10px;
}

.DDLCars {
  float: left;
  width: 470px;
}

.DDLCars .listimg {
  float: left;
  width: 100px;
  margin-right: 10px;
}

.DDLCars .listimg img {
  width: 100%;
}

.DDLCars .listcar {
  float: left;
}

.DDLCars .listcar ul li {
  font-size: 12px;
  color: gray;
}

.garage-switch {
  width: calc(100% - 30px);
  margin-bottom: 15px;
  text-align: right;
  background: #f5f5f5;
  padding: 10px 15px 6px 15px;
  position: absolute;
  left: 0;
  top: 0;
  z-index: 3;
}
.garage-switch a {
  float: right;
  display: inline-block;
  text-transform: uppercase;
  font-size: 11px;
  font-weight: bold;
  color: #6d6d6d;
}

.garage-switch a b {
  display: inline-block;
  width: 20px;
  height: 19px; /*opacity:0.4; */
  background: url(//s.exist.ru/img2/blocks-toggle.png) no-repeat;
  transition: opacity 0.3s ease;
}

/*.garage-switch a:hover b {opacity:0.6;}*/
/*.defaultMode .garage-switch a:first-of-type b, .carSelectionMode .garage-switch a:last-of-type b {opacity:1}*/
.garage-switch a:first-of-type b {
  background-position: 0 -19px;
}

.garage-switch a:last-of-type b {
  background-position: -42px 0;
}

/*.garage-switch i {position:absolute; display:inline-block; background:#4E565A; color:#fff; font-style:normal; padding:2px 5px;   white-space: nowrap;right:5px;top:35px;max-height:0;opacity:0}
.garage-switch a:hover i {animation: fadeIn 0.4s ease .7s, maximize 0s ease .7s;animation-fill-mode:forwards}*/
.garage-switch .info {
  vertical-align: top;
  text-transform: uppercase;
  font-size: 11px;
  font-weight: bold;
  color: #6d6d6d;
  margin-right: 5px;
}

.garage-switch .searchPanel {
  float: left;
  display: none;
}

.carSelectionMode .garage-switch .searchPanel.visible {
  display: block;
}

.garageLinkPanel {
  float: left;
}

.defaultMode .garageLinkPanel {
  display: block;
}

.carSelectionMode .garageLinkPanel {
  display: none;
}

.carSelectionMode .garageCarInfo, .defaultMode .garageCarList {
  display: block;
}

.defaultMode .garageCarInfo, .carSelectionMode .garageCarList {
  display: none;
}

#mainContextCar {
  width: 495px;
  overflow: hidden;
  margin-top: 15px;
}

#carsCountLiteral {
  position: absolute;
  right: 1px;
  top: 1px;
  display: inline-block;
  background: #e0595d;
  color: #fff;
  font-size: 11px;
  padding: 0 6px;
  border-radius: 15px;
  line-height: 18px;
}