/* common */
:root {
    overflow-x: hidden;
}
.suite {
    overflow-x: visible;
}
ul {
    margin-bottom: 0;
}
/* .suite main h2 {
    font-size: 40px;
    font-weight: 400;
    line-height: 54px;
    color: #32325D;
} */
/* .suite main h3 {
    font-size: 19px;
    font-weight: 500;
    line-height: 30px;
    color: #32325D;
} */
.suite main h4 {
    font-weight: 500;
    font-size: 15px;
    line-height: 28px;
    color: #32325D;
}
@media (max-width: 749px) {
    .suite main h2 {
        font-size: 30px;
        line-height: 45px;
    }
    .suite main h3 {
        font-size: 17px;
        line-height: 28px;
    }
}
/* .suite main p {
    font-size: 17px;
    line-height: 30px;
    color: #525F7F;
} */
.suite figure {
    display: flex;
    align-items: center;
    height: 50px;
}
.btn-suite {
    white-space: nowrap;
    -webkit-user-select: none;
    user-select: none;
    display: inline-block;
    padding: 2px 30px 0 30px;
    border-radius: 5px;
    text-align: center;
    font-size: 14px;
    line-height: 40px;
    text-transform: uppercase;
    box-shadow: 0 2px 5px 0 rgba(0,0,0,.1);
    cursor: pointer;
    transition: .3s ease-in-out;
}
/* top navigation */
.productNav {
    text-transform: uppercase;
    font-size: 14px;
    line-height: 17px;
    font-weight: 500;
    padding: 65px 0 0 0;
}
.cont-nav {
    display: flex;
    justify-content: space-between;
    position: relative;
    padding-top: 15px;
}
.productNav .separator {
    position: absolute;
    top: 0;
    left: 0;
    height: 1px;
    width: 100%;
    background: #E9EBF2;
}
@media (max-width: 768px) {
    .productNav .separator {
        left: 18px;
        width: calc(100% - 36px);
    }
    .productNav {
        padding: 59px 0 0 0;
    }
}
.productNav .home {
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 0 0 10px 0;
}
.productNav .home figure {
    height: 100%;
}
.productNav .home span {
    white-space: nowrap;
    letter-spacing: 0.7px;
    margin-left: 18px;
    color: #d177d3;
    transition: .2s linear;
}
.productNav .mask-container {
    flex-grow: 1;
    justify-content: flex-end;
    align-items: center;
    overflow: hidden;
    margin: 0 -20px 0 20px;
    -webkit-mask-image: linear-gradient(90deg,transparent,#000 20px,#000 calc(100% - 20px),transparent);
}
.productNav .mask-container, .productNav ul {
    display: flex;
    align-items: center;
}
.productNav ul {
    overflow: auto;
    -webkit-mask-image: linear-gradient(180deg,#000,#000 calc(100% - 10px),transparent calc(100% - 10px),transparent);
    padding: 0 0 10px 0;
}
.productNav li {
    padding: 0 21px;
}
@media (max-width: 991px) {
    .productNav li {
        padding: 0 10px 0 10px;
    }
    .productNav li:first-child {
        padding-left: 20px;
    }
    .productNav li:last-child {
        padding-right: 20px;
    }
}
.productNav li a {
    color: #d177d3;
    letter-spacing: 0.7px;
    transition: .2s linear;
}
.productNav li:first-child a {
    color: #a05392;
}
.productNav .home span:hover,
.productNav li a:hover {
    color: #a05392;
}
/* end of navigation*/

/* body style */
main, main>section {
    position: relative;
}
/* section 1 */
.hero-suite {
    padding: 100px 0 400px 0;
}
.bg-line {
    position: absolute;
    height: 100%;
    width: 100%;
    top: -128px;
    transform: skewY(-12deg);
    z-index: -1;
}
.bg-color-hero {
    position: absolute;
    bottom: 130px;
    width: 100%;
    height: 4000px;
    background: #F5F8FC;
}
@media (max-width:380px) {
    .bg-color-hero {
        bottom: 70px;
    }
}
.bg-line .line {
    position: absolute;
    height: 65px;
}
.line-sui-1 {
    background: #FFB669;
    left: 0;
    bottom: 130px;
    width: 25%;
}
.line-sui-2 {
    background: #E2E8EF;
    left: 25%;
    bottom: 130px;
    width: 5%;
}
.line-sui-3 {
    border: 1px solid #E2E8EF;
    left: 10%;
    top: 0;
    width: 10%;
}
.line-sui-4 {
    background: #E2E8EF;
    right: 20%;
    bottom: 0;
    width: 15%;
}
.line-sui-5 {
    background: #684CAD;
    right: 5%;
    bottom: 65px;
    width: 20%;
}
.line-sui-6 {
    background: #D177D3;
    right: 25%;
    bottom: 65px;
    width: 20%;
}
.line-sui-7 {
    background: #FFB669;
    right: 0;
    bottom: 130px;
    width: 15%;
}
.line-sui-8 {
    background: #8463CF;
    right: 15%;
    bottom: 130px;
    width: 25%;
}
.line-sui-9 {
    border: 1px solid #E2E8EF;
    right: 20%;
    bottom: 390px;
    width: 10%;
}
@media (max-width: 768px) {
    .hero-suite {
        padding: 30px 0 300px 0;
    }
    .line-sui-1 {
        left: 0;
        bottom: 130px;
        width: 5%;
    }
    .line-sui-2 {
        left: 5%;
        bottom: 130px;
        width: 10%;
    }
    .line-sui-3 {
        display: none;
    }
    .line-sui-4 {
        right: 0;
        bottom: 0;
        width: 10%;
    }
    .line-sui-5 {
        display: none;
    }
    .line-sui-6 {
        right: 0;
        bottom: 65px;
        width: 20%;
    }
    .line-sui-7 {
        right: 0;
        bottom: 195px;
        width: 15%;
    }
    .line-sui-8 {
        right: 0;
        bottom: 130px;
        width: 10%;
    }
    .line-sui-9 {
        right: 0;
        bottom: 325px;
        width: 10%;
    }
}
/* .hero-suite h1 {
    font-size: 45px;
    font-weight: 400;
    line-height: 68px;
    color: #32325D;
} */
@media (max-width: 380px) {
    .hero-suite {
        padding: 30px 0 300px 0;
    }
    .hero-suite h1 {
        font-size: 26px;
        line-height: 38px;
    }
    .bg-line .line {
        height: 35px;
    }
    .line-sui-1 {
        left: 0;
        bottom: 70px;
        width: 10%;
    }
    .line-sui-2 {
        left: 10%;
        bottom: 70px;
        width: 15%;
    }
    .line-sui-4 {
        right: 0;
        bottom: 0;
        width: 20%;
    }
    .line-sui-6 {
        right: 0;
        bottom: 35px;
        width: 40%;
    }
    .line-sui-7 {
        right: 0;
        bottom: 105px;
        width: 30%;
    }
    .line-sui-8 {
        right: 0;
        bottom: 70px;
        width: 20%;
    }
    .line-sui-9 {
        right: 0;
        bottom: 325px;
        width: 10%;
    }
}
.hero-suite h1 span {
    color: #d177d3;
}
.cont-btn-reg {
    margin-top: 40px;
}
.btn-reg {
    background: #393968;
    color: #fff;
}
@media (max-width: 768px) {
    .btn-reg {
        padding: 0 15px;
    }
}
.btn-reg:hover {
    color:#fff;
    transform: translateY(-3px);
}
/* section 2 */
.intro {
    margin-top: -100px;
}
.intro ul {
    display: flex;
    flex-direction: row;
}
@media (max-width: 767px) {
    .intro ul {
        flex-direction: column;
    }
}
.intro li {
    flex: 1;
    flex-basis: 100%;
    padding: 10px;
}
.intro h3 {
    margin: 24px 0 16px ;
    /* color: #32325D;
    font-size: 19px;
    line-height: 30px;
    font-weight: bold; */
}
/* .intro p {
    font-size: 17px;
    line-height: 26px;
    color: #525F7F;
} */
/* section 3 */
.brend {
    margin: 70px auto 200px auto !important;
}
@media (max-width: 768px) {
    .brend {
        margin: 40px auto 100px auto !important;
    }
}
.brend ul {
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    align-items: center;
}
.brend ul li {
    margin: 0 20px 50px 20px;
}
@media (max-width: 536px) {
    .brend ul li {
        margin: 0 10px 30px 10px;
    }
    .brend img {
        display: block;
        width: 80%;
    }
}
.brend figure {
    justify-content: center;
}

/* section 4 */
.suite-about {
    margin: 0 0 200px 0;
}
@media (max-width:420px) {
    .suite-about {
        margin: 0 0 150px 0;
    }
}
.bg-about {
    position: absolute;
    height: 100%;
    width: 100%;
    transform: skewY(-12deg);
    z-index: -1;
}
.bg-color-about {
    position: absolute;
    top: -5%;
    width: 100%;
    height: 110%;
    background: #F5F8FC;
}
@media (max-width: 420px) {
    .bg-color-about {
        top: -3%;
        height: 106%;
    }
}
.bg-about .line {
    position: absolute;
    height: 65px;
}
.line-sui-10 {
    right: 0;
    bottom: -5%;
    width: 15%;
    background: #E2E8EF;
}
.line-sui-11 {
    right: 0;
    bottom: calc(-5% - 65px);
    width: 20%;
    background: #FEB443;
}

.container-suite-about {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    perspective: 1000px;
    transform-style: preserve-3d;
}
@media (max-width: 768px) {
    .line-sui-10 {
        width: 10%;
    }
    .line-sui-11 {
        width: 35%;
    }
    .container-suite-about {
        justify-content: flex-start;
    }
}
@media (max-width: 420px) {
    .bg-about .line {
        height: 35px;
    }
    .line-sui-10 {
        right: 0;
        bottom: -3%;
        width: 20%;
    }
    .line-sui-11 {
        right: 0;
        bottom: calc(-3% - 35px);
        width: 55%;
    }
}
/* cube */
.cube-left {
    display: block;
    position: sticky;
    position: -webkit-sticky;
    width: 500px;
    height: 500px;
    top: calc(50% - 250px);
    margin: 0 0 0 -200px;
    opacity: 0;
    transform: scale(3);
    transition: opacity .6s linear, transform .5s ease-in-out;
}
.cube-left-visible {
    opacity: 1;
    transform: scale(1);
}
.cube-left-сut {
    overflow: hidden;
    border-radius: 50%;
}
.HYPE_document {
    transition: .6s linear;
}
.transf-cube {
    transform: scale(1.5) translate(15%, 20%);
}
/* /cube */
.suite-about_text {
    max-width: 620px;
}
@media (max-width: 768px) {
    .cube-left {
        display: none;
    }
    .suite-about_text {
        max-width: 100%;
    }
}
.suite-about_text_work {
    margin-bottom: 180px;
}
@media (max-width: 768px) {
    .suite-about_text_work {
        margin-bottom: 40px;
    }
}

.suite-about_text_why-suite .btn-reg{
    margin-top: 40px;
    margin-left: 80px;
}
@media (max-width: 420px){
    .suite-about_text_why-suite .btn-reg{
        margin-left: 0;
    }
}

.suite-about_text .suite-about_text_work >p,
.suite-about_text .suite-about_text_why-suite >p{
    margin-top: 24px;
    margin-bottom: 24px;
    /* font-size: 23px; */
    /* line-height: 36px; */
}
@media (max-width: 749px) {
    .suite-about_text .suite-about_text_work >p,
    .suite-about_text .suite-about_text_why-suite >p{
    font-size: 21px;
}
}
.suite-about_text ul li{
    position: relative;
    padding: 20px 0 40px 80px;
}
.suite-about_text ul li>figure {
    position: absolute;
    top: 20px;
    left: 0;
}
.suite-about_text ul li> h3{
    margin-bottom: 16px;
}
@media (max-width: 420px) {
    .suite-about_text_work {
        margin-bottom: 30px;
    }
    .suite-about_text ul li{
        position: relative;
        padding: 20px 0 0 0;
    }
    .suite-about_text ul li>figure {
        position: static;
    }
}

.mult-icon {
    display: flex;
    justify-content: flex-start;
}
.mult-icon figure {
    margin: 0 10px 0 10px;
}
.mult-icon figure:first-child {
    margin: 0 10px 0 0;
}
/* section 5 */
.more-possible {
    margin-bottom: 150px;
}
@media (max-width: 991px) {
    .more-possible {
        margin-bottom: 100px;
    }
}
.more-possible_cont h2 {
    padding: 100px 0 64px 0;
}
.grid-card {
    height: 100%;
    perspective: 600px;
    transform-style: preserve-3d;
    display: grid;
    overflow: hidden;
    transition: height 1s ease-in-out;
    padding: 10px;
    grid-template-columns: 1fr 1fr 1fr;
    grid-template-rows: auto 75px auto auto 75px auto auto;
    grid-gap: 10px;
    grid-template-areas:
    "i1 i2 i3"
    "i4 i2 i6"
    "i4 i5 i6"
    "i7 i8 i9"
    "i10 i8 i12"
    "i10 i11 i12"
    "i13 i14 i15"
}
.grid-card>div {
    position: relative;
    padding: 30px;
    border-radius: 5px;
    background: #FFFFFF;
    box-shadow: var(--shadow-3);
    opacity: 1;
    will-change: transform;
    transform: translateY(0) translateZ(0);
    transition: .5s transform cubic-bezier(.17,.67,.83,.67), .5s opacity cubic-bezier(.17,.67,.83,.67);
}
.grid-card>div h3{
    margin-top: 24px;
    margin-bottom: 16px;
}
.grid-card .suite_hidden {
    opacity: 0;
    transform-origin: 50% 0;
    transform: translateY(50%) translateZ(-100px);
}
.grid-card .i1 {
    grid-area: i1;
}
.grid-card .i2 {
    grid-area: i2;
}
.grid-card .i3 {
    grid-area: i3;
}
.grid-card .i4 {
    grid-area: i4;
}
.grid-card .i5 {
    grid-area: i5;
}
.grid-card .i6 {
   grid-area: i6;
}
.grid-card .i7 {
    grid-area: i7;
}
.grid-card .i8 {
    grid-area: i8;
}
.grid-card .i9 {
    grid-area: i9;
}
.grid-card .i10 {
    grid-area: i10;
}
.grid-card .i11 {
    grid-area: i11;
}
.grid-card .i12 {
    grid-area: i12;
}
.grid-card .i13 {
    grid-area: i13;
}
.grid-card .i14 {
    grid-area: i14;
}
.grid-card .i15 {
    grid-area: i15;
}
.grid-card .bg-vio {
    background: #DEDEFF;
}
.grid-card .bg-gr {
    background: #F8F9FE;
}
@media (max-width: 991px) {
    .more-possible_cont h2 {
        padding: 20px 0 50px 0;
    }
    .grid-card {
        padding: 10px;
        grid-template-columns: 1fr 1fr;
        grid-template-rows: repeat(7, auto 75px) ;
        row-gap: 10px;
        column-gap: 30px;
        grid-template-areas:
        "i1 i2"
        "i3 i2"
        "i3 i4"
        "i5 i4"
        "i5 i6"
        "i7 i6"
        "i7 i8"
        "i9 i8"
        "i9 i10"
        "i11 i10"
        "i11 i12"
        "i13 i12"
        "i13 i14"
        "i15 i14"
        "i15 ."
    }
}
@media (max-width: 749px) {
    .more-possible_cont h2 {
        padding: 0px 0 0px 0;
        margin-bottom: 20px;
    }
    .grid-card {
        perspective: 3000px;
        align-content: start;
        justify-content: center;
        padding: 0px;
        grid-template-columns: minmax(200px, 320px);
        grid-template-rows: auto;
        gap: 0;
        grid-template-areas:
        "i1"
        "i2"
        "i3"
        "i4"
        "i5"
        "i6"
        "i7"
        "i8"
        "i9"
        "i10"
        "i11"
        "i12"
        "i13"
        "i14"
        "i15"
    }
    .grid-card div {
        margin-bottom: 10px;
        transform: rotateX(0);
        opacity: 1;
        transition: .5s transform cubic-bezier(.17,.67,.83,.67), .5s opacity cubic-bezier(.17,.67,.83,.67);
    }
    .grid-card .suite_close {
        visibility: hidden;
        opacity: 0;
        transform: translateY(50%) translateZ(-100px);
    }
    .grid-card .suite_dis_none {
        display: none;
    }
    .grid-card div:last-child {
        margin-bottom: 0;
    }
}
.more-possible_cont-btn {
    display: none;
    margin: 25px 0 25px 0;
    justify-content: center;
    align-items: center;
}
@media (max-width: 749px) {
    .more-possible_cont-btn {
        display: flex;
    }
}
.btn-exp {
    display: inline;
    position: relative;
    background: none;
    border: none;
    outline: none;
    color: #676CE1;
    font-size: 17px;
    line-height: 17px;
}
.suite-arrow {
    margin-left: 10px;
    width: 10px;
    height: 10px;
    border-bottom: 2px solid #676CE1;
    border-right: 2px solid #676CE1;
    transition: .2s linear;
    transform: rotate(45deg) translate(-20%, -20%);
}
/* section 6 */
.bg-sl {
    position: absolute;
    top: -1050px;
    left: 0;
    height: 1000px;
    width: 100%;
    background: #F5F8FC;
    z-index: -1;
    transform: skewY(-12deg);
}
@media (max-width: 749px) {
    .bg-sl {
        top: -550px;
        height: 500px;
    }
}
.bg-sl .line {
    position: absolute;
    height: 65px;
}
.line-sui-12 {
     width: 20%;
     left: 0;
     bottom: 0;
     background: #FEB443;
}
.line-sui-13 {
    width: 15%;
    left: 20%;
    bottom: 0;
    background: #E2E8EF;
}
.line-sui-14 {
    width: 10%;
    left: 0;
    bottom: 65px;
    background: #C6CAF6;
}
.line-sui-15 {
    width: 35%;
    right: 15%;
    bottom: 40%;
    background: #FFAF37;
}
.line-sui-16 {
    width: 35%;
    right: 0;
    bottom: calc(40% - 65px);
    background: #E2E8EF;
}
@media (max-width: 991px) {
    .line-sui-12,
    .line-sui-13,
    .line-sui-14 {
        display: none;
    }
    .line-sui-15 {
        right: 0;
        width: 90%;
        bottom: 20%;
    }
    .line-sui-16 {
        width: 15%;
        bottom: calc(20% - 65px);
    }
}
@media (max-width: 505px) {
    .line-sui-15 {
        right: 0;
        width: 37%;
        bottom: 0;
    }
    .line-sui-16 {
        width: 22%;
        bottom: -65px;
    }
}
.reviews-cont {
    display: flex;
    padding: 170px 0 200px 0;
    margin-bottom: 100px;
}
@media (max-width: 991px) {
    .reviews-cont{
        padding: 100px 0 200px 0;
        flex-direction: column;
    }
}
@media (max-width: 749px) {
    .reviews-cont{
        padding: 0 0 120px 0;
    }
}
/* text slide */
.rev-text-left {
    overflow: hidden;
    width: 50%;
    position: relative;
    padding-bottom: 20px;
    transition: .3s linear;
}
@media (max-width: 991px) {
    .rev-text-left{
        width: 100%;
    }
}
@media (max-width: 749px) {
    .rev-text-left{
        height: 300px;
        -webkit-mask-image: linear-gradient(to top,transparent,#000 50px)
    }
}
.text-sl-suite {
    position: absolute;
    top: 0;
    opacity: 0;
    transition: .3s linear;
}
.cont-text {
    position: relative;
    padding: 0 50px 0 50px;
}
.cont-text figure {
    position: absolute;
    align-items: flex-start;
    top: 0;
    left: 0;
}
/* pict slide */
.rev-pic-right {
    display: flex;
    align-items: center;
    flex-direction: column;
    position: relative;
    width: 50%;
    padding-top:20px;
}
@media (max-width: 991px) {
    .rev-pic-right {
        width: 100%;
    }
}
.rev-pic-right .cont-pic {
    height: 514px;
    width: 434px;
}
.pict-rew {
    opacity: 0;
    position: absolute;
    overflow: hidden;
    height: 514px;
    width: 434px;
    background: #FFFFFF;
    box-shadow: 0px 10px 60px rgba(179, 192, 204, 0.6);
    border-radius: 10px;
    transform: translate(-10px, 20px) scale(1);
    transition: .3s linear;
}
.bg-rew-pic {
    display: block;
    position: absolute;
    height: 514px;
    width: 434px;
    background: #FFFFFF;
    box-shadow: 0px 10px 60px rgba(179, 192, 204, 0.6);
    border-radius: 10px;
    z-index: -1;
    transform: translate(-10px, 20px);
}
@media (max-width: 505px) {
    .rev-pic-right .cont-pic,
    .bg-rew-pic,
    .pict-rew {
        height: 321px;
        width: 271px;
    }
}
.pict-rew>img {
    display: inline-block;
    width: 100%;
}
.pict-rew figure {
    position: absolute;
    right: 35px;
    bottom: 40px;
}
@media (max-width: 505px) {
    .pict-rew figure {
        right: 20px;
        bottom: 20px;
    }
    .pict-rew figure img {
        display: inline-block;
        max-width: 80px;
    }
}
/* control btn */
.contr-sl {
    user-select: none;
    margin: 60px auto 0 auto;
}
.btn-sl-suite {
    position: relative;
    display: inline-block;
    margin: 0 5px 0 0;
    cursor: pointer;
    width: 15px;
    height: 15px;
    border-radius: 50%;
    background: #BDC6DF;
}
@media (max-width: 1024px) {
    .btn-sl-suite {
        margin: 0 15px 0 0;
    }
}
.btn-sl-suite::after {
    content: "";
    position: absolute;
    width: 15px;
    height: 15px;
    border-radius: 50%;
    background: #938FBF;
    transform: scale(0);
    transition: .3s linear;
}
.contr-sl .btn-sl-suite:last-child {
    margin: 0;
}
.more-cont-btn {
    display: none;
    margin: 25px 0 25px 0;
    justify-content: center;
    align-items: center;
}
@media (max-width: 749px) {
    .more-cont-btn {
        display: flex;
    }
}
.btn-exp-slide {
    display: inline;
    position: relative;
    background: none;
    border: none;
    outline: none;
    color: #676CE1;
    font-size: 17px;
    line-height: 17px;
}
.suite-arrow-slide {
    margin-left: 10px;
    width: 10px;
    height: 10px;
    border-bottom: 2px solid #676CE1;
    border-right: 2px solid #676CE1;
    transition: .2s linear;
    transform: rotate(45deg) translate(-20%, -20%);
}
/* events */
.text-sl-suite.active {
    opacity: 1;
    position: static;
}
.pict-rew.active {
    transform: translate(0, 0) scale(1);
    opacity: 1;
}
.pict-rew.out {
    opacity: 0;
    transform: translate(30px, -60px) scale(1);
}
.btn-sl-suite.active::after {
    transform: scale(1);
}
/* section 7 */
.choice-suite_container {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
}
.choice-suite .choice-suite_container>h2 {
    text-align: right;
    margin: 0;
}
.choice-suite .choice-suite_container >p {
    text-align: right;
    /* font-size: 23px;
    line-height: 36px; */
    margin: 24px 0 40px;
}
@media (max-width: 749px) {
    .choice-suite .choice-suite_container >p {
        font-size: 21px;
        width: 100%;
        margin: 35px 0;
    }
}
.grid-cont-tabl {
    align-self: center;
    perspective: 600px;
    transform-style: preserve-3d;
    display: grid;
    overflow: hidden;
    transition: .4s linear;
    padding: 6px;
    background: #F9F8FC;
    grid-template-columns: 1fr 1fr 1fr 1fr;
    grid-template-rows: repeat(10, auto);
    column-gap: 8px;
    row-gap: 1px;
    margin-bottom: 100px;
    grid-template-areas:
    "stand desk ent part"
    "i1 i7 i14 i18"
    "i2 i8 i15 i19"
    "i2 i8 i15 ."
    "i3 i9 i16 ."
    "i4 i10 i17 ."
    "i5 i11 . ."
    "i6 i12 . ."
    ". i12 . ."
    ". i13 . ."
}
.grid-cont-tabl_hide {
    opacity: 0;
}
.grid-cont-tabl>div {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
    padding: 15px;
    background: #fff;
    box-shadow: var(--shadow-2);
    opacity: 1;
    will-change: transform;
    transform: translateY(0);
    transition: .5s transform cubic-bezier(.16,.63,.76,.38), .5s opacity cubic-bezier(.16,.63,.76,.38);
}
.grid-cont-tabl .item-title-choise {
    height: 73px;
    text-transform: uppercase;
    border-radius: 3px;
    margin-bottom: 8px;
    position: relative;
}
.grid-cont-tabl .item-title-choise h3 {
    color: #fff;
    font-size: 17px;
}
.grid-cont-tabl>div>h4{
    margin-bottom: 10px;
}
.grid-cont-tabl>div>p {
    font-size: 15px;
    line-height: 22px;
}
.grid-cont-tabl>div>p:not(:last-child) {
    margin-bottom: 10px;
}
.grid-cont-tabl .item-stand {
    grid-area: stand;
    background: #C6CAF6;
    z-index: 4;
}
.grid-cont-tabl .item-desk {
    grid-area: desk;
    background: #979EEB;
    z-index: 3;
}
.grid-cont-tabl .item-ent {
    grid-area: ent;
    background: #9D80E7;
    z-index: 2;
}
.grid-cont-tabl .item-part {
    grid-area: part;
    background: #684CAD;
}
.item-stand::after {
    border: 4px solid #C6CAF6;
    background: #C6CAF6;
}
.item-desk::after {
    border: 4px solid #979EEB;
    background: #979EEB;
}
.item-ent::after {
    border: 4px solid #9D80E7;
    background: #9D80E7;
}
.item-title-choise::after {
    position: absolute;
    border-right: #F9F8FC solid 4px;
    border-top: #F9F8FC solid 4px;
    top: 50%;
    right: -13px;
    transform: translateY(-50%) rotate(45deg);
    content: "";
    height: 26px;
    width: 26px;
    z-index: -1;
}
.item-part::after {
    content: none;
}
.item-title-choise>h3 {
    margin: 0;
}
.grid-cont-tabl_item-1 {
    grid-area: i1;
}
.grid-cont-tabl_item-2 {
    grid-area: i2;
}
.grid-cont-tabl_item-3 {
    grid-area: i3;
}
.grid-cont-tabl_item-4 {
    grid-area: i4;
}
.grid-cont-tabl_item-5 {
    grid-area: i5;
}
.grid-cont-tabl_item-6 {
    grid-area: i6;
}
.grid-cont-tabl_item-7 {
    grid-area: i7;
}
.grid-cont-tabl_item-8 {
    grid-area: i8;
}
.grid-cont-tabl_item-9 {
    grid-area: i9;
}
.grid-cont-tabl_item-10 {
    grid-area: i10;
}
.grid-cont-tabl_item-11 {
    grid-area: i11;
}
.grid-cont-tabl_item-12 {
    grid-area: i12;
}
.grid-cont-tabl_item-13 {
    grid-area: i13;
}
.grid-cont-tabl_item-14 {
    grid-area: i14;
}
.grid-cont-tabl_item-15 {
    grid-area: i15;
}
.grid-cont-tabl_item-16 {
    grid-area: i16;
}
.grid-cont-tabl_item-17 {
    grid-area: i17;
}
.grid-cont-tabl_item-18 {
    grid-area: i18;
}
.grid-cont-tabl_item-19 {
    grid-area: i19;
}
.more-table-btn {
    display: none;
    margin: 25px 0 25px 0;
    justify-content: center;
    align-items: center;
}
.btn-exp-table {
    display: inline;
    position: relative;
    background: none;
    border: none;
    outline: none;
    color: #676CE1;
    font-size: 17px;
    line-height: 17px;
}
.suite-arrow-table {
    margin-left: 10px;
    width: 10px;
    height: 10px;
    border-bottom: 2px solid #676CE1;
    border-right: 2px solid #676CE1;
    transition: .2s linear;
    transform: rotate(45deg) translate(-20%, -20%);
}
@media (max-width: 767px) {
    .grid-cont-tabl {
        grid-template-columns: 1fr 1fr;
        grid-template-rows: repeat(16, auto);
        padding: 6px 20px;
        grid-template-areas:
        "stand desk"
        "i1 i7"
        "i2 i8"
        "i2 i8"
        "i3 i9"
        "i4 i10"
        "i5 i11"
        "i6 i12"
        ". i12"
        ". i13"
        "ent part"
        "i14 i18"
        "i15 i19"
        "i15 ."
        "i16 ."
        "i17 ."
    }
    .grid-cont-tabl .item-ent,
    .grid-cont-tabl .item-part {
        margin-top: 8px;
    }
}
@media (max-width: 480px) {
    .grid-cont-tabl {
        grid-template-columns: 1fr;
        grid-template-rows: auto;
        padding: 20px 20px;
        margin-bottom: 0;
        margin-left: -18px;
        margin-right: -18px;
        grid-template-areas:
        "stand"
        "i1"
        "i2"
        "i3"
        "i4"
        "i5"
        "i6"
        "desk"
        "i7"
        "i8"
        "i9"
        "i10"
        "i11"
        "i12"
        "i13"
        "ent"
        "i14"
        "i15"
        "i16"
        "i17"
        "part"
        "i18"
        "i19"
    }
    .grid-cont-tabl .item-desk,
    .grid-cont-tabl .item-ent,
    .grid-cont-tabl .item-part {
        margin-top: 8px;
    }
    .more-table-btn {
        display: flex;
        align-self: center;
    }
    .grid-cont-tabl .suite_anim_table {
        transform: translateY(-100%);
        opacity: 0;
        visibility: hidden;
    }
    .grid-cont-tabl .suite_dis_none_table {
        display: none;
    }
}
.grid-cont-tabl .suite_anim_table_cell {
    transform: translateY(-100%);
    opacity: 0;
    visibility: hidden;
}