/* Mactak case styles - standalone, paths relative to assets/img/ */
/* Override .body padding-right from general.css */
.page-vse-keysy--case-open.body {
  padding-right: 0;
}
/* New layout: sidebar 90px, dyslider and controls shifted right */
.page-vse-keysy--case-open #dyslider {
  margin-left: 90px;
}
.page-vse-keysy--case-open #dyslider section.section {
  width: 100%;
}
.page-vse-keysy--case-open button#next {
  left: 90px;
  width: calc(100% - 90px);
}
.page-vse-keysy--case-open .scrollbar {
  right: 0;
}
/* Mobile: no sidebar, 52px header offset for sections and scroll */
@media (max-width: 768px) {
  .page-vse-keysy--case-open.body {
    margin-top: 52px;
    height: calc(100vh - 52px);
  }
  .page-vse-keysy--case-open #dyslider {
    margin-left: 0;
  }
  .page-vse-keysy--case-open #dyslider section.section {
    height: calc(100vh - 52px) !important;
    padding-bottom: 70px;
  }
  .page-vse-keysy--case-open button#next {
    left: 0;
    width: 100%;
  }
}

@media screen and (min-width: 1025px) {
  section.case .content-new-txtTopCenter {
    width: calc(100% - 80px);
    height: 100%;
    margin-left: 80px;
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: center;
    padding: 80px 80px 0 !important;
    text-align: center;
    box-sizing: border-box;
  }
}

@media screen and (max-width: 1024px) {
  section.case h2 {
    padding: 0 20px;
  }
  section.case .withbefore-line {
    padding-left: 20px;
    margin-bottom: 20px;
  }
  section.case .withbefore-lineCenter {
    color: #000;
  }
  section.case .content-new-txtTopCenter .withbefore-lineCenter {
    padding: 0 20px;
    margin-bottom: 20px;
  }
  section.case.mactak-9 .content-new-txtTopCenter .withbefore-lineCenter {
    color: #ffffff;
  }

    section.mactak.accompany .wrapper-video {
      height: fit-content !important;
    }
}
section.mactak{background-color:#fff;background-position:center;background-repeat:no-repeat;overflow:hidden}
section.mactak .text-width{width:610px;max-width:100%}
section.mactak h2{color:#4b4b4e;text-transform:uppercase}
section.mactak .wrapper-img{background-size:cover;background-repeat:no-repeat}
section.mactak:first-child{background-image:url(../img/mainimg_new.jpg)}
section.mactak:first-child .content{width:80vw}
section.mactak:first-child .mymouse{top:auto;bottom:50px}
section.mactak:first-child span.case-name{font-size:11vw;letter-spacing:.24em;padding-left:.24em}
section.mactak.shop .content{justify-content:space-between;padding-bottom:80px}
section.mactak.shop img{max-width:100%;max-height:calc(100% - 105px - 80px)}
section.mactak.begining .content{justify-content:space-between}
section.mactak.begining .wrapper-img{display:flex;justify-content:flex-start;width:80vh;max-width:calc(100% - 610px - 90px);height:100%}
section.mactak.begining .wrapper-img img{height:100%}
section.mactak.prototype .content{justify-content:space-between}
section.mactak.prototype .wrapper-img{position:relative;height:100%;width:109vh;max-width:calc(100% - 610px);display:flex;align-items:center;justify-content:flex-end;overflow:hidden}
section.mactak.prototype .wrapper-img .img2{position:absolute;top:0;left:0;height:100%}
section.mactak.prototype .wrapper-img .img1{position:relative;max-height:80%}
section.mactak.catalog .content{justify-content:space-between;padding-bottom:125px}
section.mactak.catalog video{max-width:100%;max-height:calc(100% - 140px - 80px)}
section.mactak.joy .content{justify-content:space-between}
section.mactak.joy .wrapper-img{display:flex;align-items:flex-end;position:relative;max-width:calc(100% - 610px - 80px);height:100%;overflow:hidden}
section.mactak.joy .wrapper-img .img1{position:relative;height:90%}
section.mactak.joy .wrapper-img .img2{height:100%;position:absolute;top:0;right:0}
section.mactak.accompany .content{justify-content:space-between}
section.mactak.accompany .wrapper-video{display:flex;align-items:center;height:100%;width:calc(100% - 610px - 180px);background:#f6f6f8}
section.mactak.accompany .wrapper-video video{width:100%;max-height:96%}
section.mactak.filter .content{justify-content:space-between}
section.mactak.filter .wrapper-video{display:flex;align-items:flex-end;justify-content:flex-end;height:100%;width:calc(100% - 610px - 180px - 160px);background:#f6f6f8}
section.mactak.filter .wrapper-video video{max-width:100%;height:90%}
section.mactak.mobile .content{justify-content:space-between}
section.mactak.mobile .wrapper-video{display:flex;align-items:center;height:100%;width:calc(100% - 610px - 180px - 150px);background:#ecedef}
section.mactak.mobile .wrapper-video video{width:100%;max-height:96%}
section.mactak.result{background:url(../img/background_result.jpg);background-size:cover;color:#fff}
section.mactak.result h2{color:#fff}
section.mactak.result p{margin-bottom:0}
section.mactak.last h2{margin-bottom:50px;letter-spacing:.05em}
section.mactak.last .mymouse{border-color:#000}
section.mactak.last .mymouse:before{background:#000}

@media (max-width:1024px){
section.mactak:first-child .content{width:60vw}
section.mactak.shop .content{justify-content:center;padding-bottom:20px}
section.mactak.begining .content{flex-direction:column;align-items:flex-start;padding-bottom:20px;justify-content:center}
section.mactak.begining .wrapper-img{position:absolute;bottom:0;right:0;max-width:calc(100% - 380px)}
section.mactak.begining .text-width{width:400px}
section.mactak.prototype .content{flex-direction:column;padding-left:0;padding-top:80px}
section.mactak.prototype .text-width{order:1}
section.mactak.prototype .wrapper-img{order:2;width:100%;max-width:none;justify-content:flex-start}
section.mactak.prototype .wrapper-img .img2{display:none}
section.mactak.prototype .wrapper-img .img1{max-width:100%}
section.mactak.catalog .content{justify-content:center}
section.mactak.joy .content{flex-direction:column;align-items:flex-start;padding-top:80px;padding-right:0}
section.mactak.joy .wrapper-img{width:100%;max-width:none;justify-content:flex-end}
section.mactak.joy .wrapper-img .img2{display:none}
section.mactak.accompany .content{flex-direction:column;justify-content:center}
section.mactak.accompany .wrapper-video{width:100%;margin-bottom:20px;background:#fff}
section.mactak.filter .content{flex-direction:column;justify-content:center;align-items:flex-start;padding-right:0}
section.mactak.filter .wrapper-video{width:100%;background:#fff}
section.mactak.filter .wrapper-video video{max-height:100%;height:auto}
section.mactak.mobile .content{flex-direction:column;align-items:flex-end;justify-content:center;padding-left:0;padding-right:0}
section.mactak.mobile .wrapper-video{width:100%;margin-bottom:20px}
section.mactak.mobile .text-width{padding-left:20px;padding-right:20px;box-sizing:border-box}
section.mactak.result .content{justify-content:center}
}

@media (max-width:768px){
section.mactak:first-child .content{width:100%}
section.mactak.begining .content{justify-content:flex-end}
section.mactak.begining .wrapper-img{max-width:80%;opacity:.2}
section.mactak.prototype .wrapper-img .img1{flex:0}
section.mactak.catalog .content{padding-bottom:20px}
section.mactak.catalog video{max-height:calc(100% - 150px)}
section.mactak.joy .wrapper-img .img1{max-width:100%;max-height:90%;height:auto;flex:0}
section.mactak.filter .wrapper-video{height:40%;display:flex;justify-content:center;align-items:center}
section.mactak.mobile .wrapper-video{height:35%}
section.mactak.result{background-position:15%}
}

@media (max-width:360px),(max-height:540px){
section.mactak:first-child .content{width:100%}
section.mactak.prototype .wrapper-img .img1{flex:0}
section.mactak.catalog .content{padding-bottom:20px}
section.mactak.catalog video{max-height:20%}
section.mactak.joy .wrapper-img .img1{max-width:100%;max-height:90%;height:auto;flex:0}
section.mactak.mobile .wrapper-video{max-height:30%}
}