.single-stair {background-color: var(--cl)}
.single-stair h1 {font-weight: 700;}

.single-stair .price {color: var(--c2); margin-bottom: 2rem; font-size: 22px;font-weight: 500; display: flex; gap: 0.5rem}
.single-stair .price .new {font-weight: 700;font-size: 32px;}
.single-stair .price .old {font-size: 15px;opacity: 0.8}

.single-stair .form {padding: 0.75rem 1rem;border: 1px solid var(--c1);border-radius: 2px;}
.single-stair .form input {margin-bottom: 0;}
.single-stair .form a {color: var(--ct)}
.single-stair .form  .d-md-flex {gap: 1rem}
.single-stair .check input + label:before {border-color:var(--ct) }
.single-stair .check input:checked +label:after {background-color:var(--ct) }

.params_main {display: flex;  gap: 1.5rem;font-size: 15px;margin: 2rem 0;color: var(--c2)}
.params_main img {display: block; margin: 0 auto 1rem  auto;}
.params_main div {width: 100%; padding: 1rem 0.5rem; text-align: center; background: #FFFFFF;box-shadow: 0 0 25px rgba(0, 0, 0, 0.15);border-radius: 2px;}

.single-stair .btns {display: flex; gap: 1.5rem}
.single-stair .btns .btn {width: 100%}

.single-stair .owl-carousel [data-bg]{height: 515px; border-radius: 2px; background-repeat: no-repeat; width: 100%;background-size: contain; background-color: white}
.single-stair .owl-nav {width: 94%; left: 3%;}
.single-stair .owl-nav button {background-color: transparent !important;border: 2px solid white !important;}
.single-stair .owl-nav button:hover  {background-color: var(--c1) !important;border: 2px solid var(--c1)!important;}
.single-stair .owl-nav button:before {background-color: white}

.single-stair  .previews {display: flex; flex-wrap:wrap; margin-bottom:1.5rem;gap: 1rem 2%;margin-top: 1.5rem}
.single-stair  .previews>div {height: 120px;width: 23%;border-radius: 2px;cursor: pointer;}
.single-stair  .previews>div:hover, .previews>div.active {outline: 1px solid var(--c1); }

.single-stair .tag {margin-bottom: 2rem;font-weight: 600;display: inline-block; text-transform: uppercase; background-color: white;border-radius: 2px;border: 1px solid #F1F1F1;font-size: 12px;padding: 0.5rem 1.5rem}

.tabs {gap: 0 1.5rem; border-bottom:  1px solid var(--cl2);margin-bottom: 1rem}
.tabs .btn {background-color: transparent; color: var(--c2);text-transform: uppercase;padding: 0;outline: none !important}
.tabs .btn.show {color: var(--c1);font-weight: 700;border-bottom: 2px solid var(--c1);pointer-events: none}

.tab.params td {padding: 0.25rem 0;color: var(--c2)}
.tab.params td:first-child{font-weight: 600;border-right:1px solid var(--cl2);padding-right: 2rem}
.tab.params td:nth-child(2){padding-left: 2rem}

.single-related h2 {font-weight: 700; text-align: center}


@media (max-width:1200px){
    .single-stair .owl-carousel [data-bg]{height: 370px}
    .single-stair .previews{margin: 0.75rem 0}
    .single-stair .previews>div{height: 80px}
    .single-stair .params_main{font-size: 12px;line-height: 14px;margin: 1.25rem 0}
    .single-stair .btns{font-size: 13px;gap: 1rem}
    .single-stair .btns .btn{padding: 0 1rem; line-height:45px}
    .single-stair .btns .icon{min-width: 30px}
    .single-stair .tag{margin-bottom: 1rem}
    .single-stair .form input,.single-stair .form .btn{line-height: 45px;height: 45px;font-size: 14px}
}
@media (max-width:992px){
    .single-stair .owl-carousel [data-bg]{height: 540px}
    .single-stair .previews>div{height: 150px}
    .single-stair .imgs{margin-bottom: 2rem}
}
@media (max-width:576px){
    .single-stair {padding-top: 1rem}
    .single-stair .previews>div{height: 70px}
    .single-stair .owl-carousel [data-bg] {height: 265px}
    .single-stair .params_main {flex-direction: column;gap: 0.5rem}
    .single-stair .btns {flex-direction: column;gap: 0.5rem}
    .single-stair .price{flex-direction: column;gap: 0.5rem}
    .tabs {flex-wrap: wrap}
    .tabs .btn {font-size: 12px;line-height: 30px}
    .params td {font-size: 12px;padding:0}
    .tab.params td:nth-child(2) {padding-left: 0.5rem;}
    .tab.params td:first-child{padding-right: 0.5rem;    width: 40%;}
}