/* Прячем ненужные версии в зависимости от экрана при AJAX ответе */
.cart-desktop-variant { display: none; }

@media (min-width: 1024px) {
    .cart-desktop-variant { display: block; }
    .cart-mobile-variant { display: none; }
}

/* Стили для мобильной версии (из topCart5) */
.cart-mobile-variant .countLink {
    background: url('images/cartH4.png') 50% 50% no-repeat transparent;
    display: inline-block;
    position: relative;
    font-size: 14px;
    float: left;
    height: 40px;
    width: 60px;
}

#subHeader4.color_black .cart-mobile-variant .countLink,
#subHeader4.color_theme .cart-mobile-variant .countLink,
#subHeader5.color_black .cart-mobile-variant .countLink,
#subHeader5.color_theme .cart-mobile-variant .countLink,
#subHeader6.color_black .cart-mobile-variant .countLink,
#subHeader6.color_theme .cart-mobile-variant .countLink,
#subHeader7.color_black .cart-mobile-variant .countLink,
#subHeader7.color_theme .cart-mobile-variant .countLink,
#subHeader8.color_black .cart-mobile-variant .countLink,
#subHeader8.color_theme .cart-mobile-variant .countLink {
    background: url('images/cartH4w.png') 50% 50% no-repeat transparent;
}

.cart-mobile-variant .countLink.active:hover { opacity: 0.7; }
.cart-mobile-variant .countLink.active:active { top: 1px; }

.cart-mobile-variant .heading {
    vertical-align: middle;
    text-decoration: none;
    display: inline-block;
    max-width: 172px;
    margin-left: 6px;
    margin-top: 8px;
    color: #000000;
}

#subHeader5.color_black .cart-mobile-variant .heading,
#subHeader5.color_theme .cart-mobile-variant .heading,
#subHeader6.color_black .cart-mobile-variant .heading,
#subHeader6.color_theme .cart-mobile-variant .heading,
#subHeader7.color_black .cart-mobile-variant .heading,
#subHeader7.color_theme .cart-mobile-variant .heading,
#subHeader8.color_black .cart-mobile-variant .heading,
#subHeader8.color_theme .cart-mobile-variant .heading {
    color: #ffffff;
}

.cart-mobile-variant .heading.active:active { position: relative; top: 1px; }
.cart-mobile-variant .heading .cartLabel { font-family: "robotomedium"; margin-right: 3px; }
.cart-mobile-variant .heading .cartLabel:hover { opacity: 0.7; }

.cart-mobile-variant .count {
    border: 2px solid #d1d1d1;
    background-color: #ffffff;
    border-radius: 50%;
    position: absolute;
    text-align: center;
    overflow: hidden;
    font-size: 12px;
    color: #d1d1d1;
    height: 20px;
    width: 20px;
    right: 8px;
    top: 0;
}

#subHeader5.color_black .cart-mobile-variant .count,
#subHeader6.color_black .cart-mobile-variant .count,
#subHeader7.color_black .cart-mobile-variant .count,
#subHeader8.color_black .cart-mobile-variant .count {
    background-color: #2b2b2b;
}