:root {
    --slider-h-perspective-top: .59;
    
    --common-info-padding-top-lg: 60px;
    --common-info-padding-bottom-lg: 90px;
    
    --left-side-width-ratio: .69;
    
    --slide-btn-width: 130px;
    --slide-btn-height: 50px;
    --slide-btn-color: #ffffff50;
    --slide-btn-hover-text-color: #fff;
    
    --side-title-size-lg: 18px;

    --description-block-margin-lg: 25px;
    --right-side-padding-lg: 25px;

    --thumb-item-ratio: .6;

    --cross-const-small-width-lg: 30px;

    --size-image-ratio: .39;

    --size-block-padding-lg: 45px;

    --complectation-block-top-padding-lg: 50px;
    --complectation-block-bottom-padding-lg: 10px;
    --complectation-image-margin-lg: 25px;
    --complectation-item-padding-lg: 40px;

    --tech-block-padding-top-lg: 50px;
    --tech-block-padding-bottom-lg: 90px;
}

#sideTitle {
    font-size: var(--side-title-size-lg);
    position: absolute;
    z-index: 5;
    transform: rotate(-90deg) translateX(-100%);
    top: calc(var(--page-v-padding-lg) + var(--logo-height-lg) + var(--header-bottom-padding) + var(--common-info-padding-top-lg));
    left: calc(var(--page-h-padding-lg) - var(--header-bottom-padding));
    transform-origin: top left;
    margin: 0;
}

#breadcrumbs {
    height: var(--common-info-padding-top-lg);
    line-height: var(--common-info-padding-top-lg);
    position: absolute;
    top: 0;
    left: var(--page-h-padding-lg);
}

.right-side-area { width: calc(100% * (1 - var(--left-side-width-ratio))); padding-left: var(--right-side-padding-lg); }
.left-side-area { width: calc(100% * var(--left-side-width-ratio)); min-height: 1px; }

.product-view-common-info-container.row,
#complectation.row {
    background-color: var(--about-block-color);
    padding: var(--common-info-padding-top-lg) var(--page-h-padding-lg) var(--common-info-padding-bottom-lg);
    margin: 0 calc(-1 * var(--page-h-padding-lg));
}

.product-description-wrapper {
    flex-direction: column;
    justify-content: space-between;
    align-items: initial !important;
    height: calc(((100vw - 2 * var(--page-h-padding-lg)) * var(--left-side-width-ratio)) * var(--slider-h-perspective-top));
}

#topSlider {
    height: calc(((100vw - 2 * var(--page-h-padding-lg)) * var(--left-side-width-ratio)) * var(--slider-h-perspective-top));
    overflow: hidden;
}

#topSlider .swiper-slide {
    height: calc(((100vw - 2 * var(--page-h-padding-lg)) * var(--left-side-width-ratio)) * var(--slider-h-perspective-top));
}

#topSlider .slide-btn {
    width: var(--slide-btn-width);
    height: var(--slide-btn-height);
    line-height: calc(var(--slide-btn-height) * 1.1);
    font-size: calc(var(--slide-btn-height) * 0.8);
    background-color: var(--slide-btn-color);
    z-index: 5;
}

#topSlider .slide-btn svg {
    transition: .3s ease-out;
    display: block;
    margin: auto;
}

#topSlider .slide-btn svg,
#topSlider .slide-btn .arrow-wrap { height: 22px; margin: auto; width: 60px; }

#topSlider .slide-btn:hover svg {
    stroke: var(--slide-btn-hover-text-color);
    fill: var(--slide-btn-hover-text-color);
    transition: .3s ease-out;
}

.product-description-wrapper .title.h1 {
    font-size: var(--side-title-size-lg);
    font-weight: 600;
    margin:  0 0 0;
}

.product-description-wrapper .description-text {
    margin: var(--description-block-margin-lg) 0;
}

.product-description-wrapper .description-text p:nth-last-of-type(1) {margin: 0px}

.product-thumbs-container.row { margin: 0 -7.5px;  }

.product-description-wrapper .product-thumb-item[class*="col"] {
    padding: 0 7.5px;
    margin-bottom: 15px;
    height: calc( ((100vw * (1 - var(--left-side-width-ratio)) - var(--page-h-padding-lg)) * var(--thumb-item-ratio)) / 3   );
}

.product-thumb-item .view-more-rect {
    background-color: #fff;
}

.product-thumb-item .view-more-rect .cross.const {
    width: var(--cross-const-small-width-lg);
    height: var(--cross-const-small-width-lg);
}

.product-description-wrapper .hash-link,
.product-description-wrapper .hash-link:hover {
    text-decoration: none;
    font-size:  .9em;
}

.product-to-cart-container { padding-bottom: 20px; }

.cart-inc-handler, .cart-dec-handler {
    font-family: system-ui;
    width: 20px;
    height: 20px;
    line-height: 20px;
    text-align: center;
    font-weight: 600;
    font-size: 18px;
    cursor: pointer;
}

.cart-quantity-value {
    width: 60px;
    text-align: center;
    font-size: 18px;
    font-family: Stem;
    font-weight: 300;
}

.product-size-text p { margin-bottom: 0; }

.product-size-text p:nth-of-type(2n) { margin-bottom: 10px; }

/*******************************************************/

.catalog-view-line.row {
    margin-top: 15px;
    border-bottom: 1px solid;
    margin-left: 0;
    margin-right: 0;
    display: block;
}

.catalog-view-line.top-line {
    margin-top: 25px;
}

.catalog-view-line .pushLeft { 
    padding-left: 0; 
    padding-right: 0;
}

.catalog-view-line .svgIcon {
    height: 20px;
}

.catalog-item-container .catalog-preview-image {
    height: calc((100vw - 2 * var(--page-h-padding-lg) + 2 * var(--sections-margin-lg)) / (3 * var(--image-aspect-ratio)) );
}


/*******************************************************/

.move-next-block {
    z-index: 15;
    top: calc(100% - var(--page-v-padding-lg) - 15px);
    left: calc(100% - var(--page-h-padding-lg) + 15px);
    transform: rotate(-90deg);
    transform-box: view-box;
    transform-origin: top left;
    width: 250px;
    overflow: hidden;
    text-overflow: ellipsis;
    transition: .2s ease-out;
}

.move-next-block:hover {
    text-decoration:  none;
    top: calc(100% - var(--page-v-padding-lg) + 20px);
}

.move-next-block .next-title-holder {
    font-size: 10px;
    line-height: 15px;
    height: 15px;
}
.move-next-block .arrow-wrapper {
    height: 15px;
    margin-right: 10px;
}

.move-next-block .arrow-wrapper svg {
    transform: rotate(180deg) translateY(3px);
    width: 50px;
}

/*****************************************************/

.move-first-block {
    z-index: 15;
    bottom: var(--page-v-padding-lg);
    left: calc(100% + 15px);
    transform: rotate(90deg) translateX(-100%);
    transform-box: view-box;
    transform-origin: bottom left;
    width: 140px;
    overflow: hidden;
    text-overflow: ellipsis;
    transition: .2s ease-out;
}

.move-first-block:hover {
    text-decoration:  none;
    bottom: calc(var(--page-v-padding-lg) + 20px);
}

.move-first-block .next-title-holder {
    font-size: 10px;
    line-height: 15px;
    height: 15px;
}
.move-first-block .arrow-wrapper {
    height: 15px;
    margin-right: 10px;
}

.move-first-block .arrow-wrapper svg {
    transform: rotate(180deg) translateY(3px);
}

/*******************************************************/

#size-block {
    padding: var(--size-block-padding-lg) 0px;
}

.size-area-item-height {
    height: calc(var(--size-image-ratio) * (100vw * (1 - var(--left-side-width-ratio)) - var(--page-h-padding-lg)));
}

img.size-area-item-height + img.size-area-item-height {
    margin-left: 90px;
}

/******************************************************/

#complectation.row, #accessories {
    padding-top: var(--complectation-block-top-padding-lg);
    padding-bottom: var(--complectation-block-bottom-padding-lg);
}

#complectation .right-side-area {
    padding-top: 60px;
}

.product-complectation-image {
    max-width: 100%;
    margin-bottom: var(--complectation-image-margin-lg);
}

.product-complectation-item {
    padding-bottom: var(--complectation-item-padding-lg);
}

.product-complectation-group h4, 
#tech-block h4 {
    height: 38px;
    line-height: 18px;
    padding-bottom: 20px;
    margin: 0px;
}

.product-complectation-title {
    margin-bottom: 10px;
    height: 12px;
    line-height: 12px;
}

#accessories .product-complectation-item {
    width: 20%;
    padding-left: 15px;
    padding-right: 15px;
}

#accessories .swiper-container { 
    overflow: hidden; 
    margin-left: -15px;
    margin-right: -15px;
}

#accessories .swiper-container .swiper-slide .absolute { pointer-events: initial; }

#tech-block {
    padding: var(--tech-block-padding-top-lg) 0 var(--tech-block-padding-bottom-lg);
}

.productPrice {
    margin-left: 5px;
}

@media (max-width: 1200px) and (min-width: 1101px) {
    :root {
        --slide-btn-width: 100px;
        --slide-btn-height: 40px;
    }
    #topSlider .slide-btn svg, #topSlider .slide-btn .arrow-wrap { width: 50px; }
}

@media (max-width: 1100px) and (min-width: 840px) {
    :root {
        --description-block-margin-lg: 15px;
        --slide-btn-width: 100px;
        --slide-btn-height: 40px;
        --common-info-padding-bottom-lg: 60px;
        --side-title-size-lg: 16px;
        --size-image-ratio: .7;
    }

    .move-next-block {display: none;}
    .product-description-wrapper {
        min-height: calc(((100vw - 2 * var(--page-h-padding-lg)) * var(--left-side-width-ratio)) * var(--slider-h-perspective-top));
        height: auto;
    }
    #topSlider .slide-btn svg, #topSlider .slide-btn .arrow-wrap { width: 50px; }

    .productPrice.font20 { font-size: 18px; }
}

@media (max-width: 839px) and (min-width: 701px) {
    :root {
        --common-info-padding-bottom-lg: 30px;
        --complectation-image-margin-lg: 10px;
        --complectation-item-padding-lg: 25px;
        --tech-block-padding-top-lg: 30px;
        --tech-block-padding-bottom-lg: 60px;
        --slide-btn-width: 100px;
        --slide-btn-height: 40px;
        --thumb-item-ratio: .9;
        --description-block-margin-lg: 15px;
    }

    #topSlider .slide-btn svg,
    #topSlider .slide-btn .arrow-wrap { width: 40px; }

    .product-to-cart-container {
        padding-top: 10px;
        display: flex;
        align-items: flex-end;
        justify-content: space-between;
    }

    .product-to-cart-container > p,
    .product-to-cart-container > div {
        margin: 0;
    }

    .cart-quantity-wrapper.row { width: 280px; }

    .left-side-area { width: 100%; }
    .right-side-area { width: 100%; padding-left: 0; }
    .product-description-wrapper { height: auto; padding-top: 30px; }
    .upper-side { margin-left: -15px; margin-right: -15px; }
    .upper-side .sm-half { padding-left: 15px; padding-right: 15px; width: 50%; float: left; }
    .upper-side .sm-padding-top { padding-top: calc(var(--description-block-margin-lg) + var(--side-title-size-lg)); }
    .product-size-text.size-area-item-height,
    .product-construct-text.size-area-item-height { height: auto; }
    #complectation .right-side-area { padding-top: 0px; }

    #accessories .product-complectation-item { width: 30%; }
    #accessories .swiper-container { margin: 0 }
}

@media (max-width: 700px) {
    :root {
        --slide-btn-width: 50px;
        --slide-btn-height: 20px;
        --left-side-width-ratio: 0;
        --complectation-item-padding-lg: 25px;
        --complectation-image-margin-lg: 10px;
        --tech-block-padding-top-lg: 10px;
        --tech-block-padding-bottom-lg: 40px;
    }

    main { overflow-x: hidden; }

    #sideTitle, .move-next-block { display: none; }

    #topSlider .slide-btn svg,
    #topSlider .slide-btn .arrow-wrap { height: 5px; width: 20px; }

    #topSlider { height: calc(((100vw - 2 * var(--page-h-padding-lg))) * var(--slider-h-perspective-top)); }

    .product-to-cart-container { padding-bottom: 30px; }

    .left-side-area { width: 100%; }
    .right-side-area { width: 100%; padding-left: 0; }

    .product-description-wrapper { height: auto; padding-top: 30px; }
    .product-view-common-info-container.row, #complectation.row { padding-bottom: 20px; }

    .xs-padding-bottom { padding-bottom: 15px; margin-bottom: 15px; border-bottom: 1px solid #eee; }

    .product-size-text.size-area-item-height,
    .product-construct-text.size-area-item-height { height: auto; }
    #complectation .right-side-area { padding-top: 10px; }

    #accessories .product-complectation-item { 
        width: calc(100vw - 2 * var(--page-h-padding-lg));
    }

    #accessories .swiper-container { 
        width: 100vw;
        margin: 0 calc(-1 * var(--page-h-padding-lg));
    }
}

@media only screen and (min-width : 300px) and (max-width: 800px) and (orientation : landscape) {
    .product-thumb-item { float: left; }

    .down-side.hidesm { display: none; }

    #size-block .left-side-area .col-lg-4.col-md-4.col-sm-4.col-xs-12,
    .col-xs-12.product-complectation-item, .product-thumb-item { width: 33.33%; }

    .product-tech-info-container .col-xs-12:nth-of-type(1),
    .product-tech-info-container .col-xs-12:nth-of-type(2) { width: 50%; }
}