.properties-box {padding: 50px 0 100px 0;}
.properties-box .header {margin: 0 0 30px 0;}
.properties-box .header h2 {text-align: center; font-size: 50px; line-height: 62px; margin: 0;}
.properties-box .buildings {text-align: center; margin: 0 0 80px 0;}
.properties-box .buildings .b-nav {display: inline-block; padding: 0 60px; position: relative; display: flex; justify-content: center; align-items: center;}
.properties-box .buildings .b-nav h3 {margin: 0; color: #c18561; font-weight: 700; text-transform: none; font-size: 30px; line-height: 32px; padding: 10px; cursor: pointer;}
.properties-box .buildings .b-nav h3.active {color: #000; cursor: default;}
.properties-box .buildings .b-nav .control {position: absolute; top: 50%; transform: translate(0, -50%); width: 50px; height: 50px; padding: 2px; display: block;}
.properties-box .buildings .b-nav .control.prev {left: 0;}
.properties-box .buildings .b-nav .control.next {right: 0;}
.properties-box .buildings .b-nav .control svg {fill: #c18561;}
.properties-box .buildings .b-nav .control:hover svg {fill: #010101;}

.plan-apartments-list {display: block; font-family: Material;}
.plan-apartments-list table th {text-align: center; background: #c18561; color: #fff; font-weight: 700; text-transform: uppercase;}
.plan-apartments-list table td {border: 1px solid #e0e0e0; text-align: center;}
.plan-apartments-list .apartment-row {cursor: pointer;}
.plan-apartments-list .apartment-row:hover td {color: #000; font-weight: 700;}
.plan-apartments-list .apartment-plan-row {position: relative;}
.plan-apartments-list .apartment-plan-row td {display: none; width: 100%;}
.plan-apartments-list .apartment-row.active td, .plan-apartments-list .apartment-row.active:hover td {background: #010101; color: #fff; font-weight: 400;}
.plan-apartments-list .apartment-row.active+.apartment-plan-row td {display: table-cell; background: #fff;}
.plan-apartments-list .apartment-plan-row .flex {display: flex; flex-wrap: wrap; align-items: center;}
.plan-apartments-list .apartment-plan-row .photo {width: 65%; padding: 10px;}
.plan-apartments-list .apartment-plan-row .info {width: 35%; padding: 10px;}
.plan-apartments-list .apartment-plan-row .info .floor {margin: 0 0 20px 0;}
.plan-apartments-list .apartment-plan-row .info .prices>div {margin: 0 0 10px 0; text-align: center;}
.plan-apartments-list .apartment-plan-row .info .contact {text-align: center;}
.plan-apartments-list .apartment-plan-row .info .label {text-align: center; text-transform: uppercase; font-weight: 700; font-size: 14px; line-height: 18px; color: #000; margin: 0 0 10px 0;}
.plan-apartments-list .apartment-plan-row .info .value {background: #010101; text-align: center; font-size: 28px; line-height: 32px; padding: 5px 5px; color: #fff; margin: 0; display: inline-block; width: 240px; max-width: 100%;}
.plan-apartments-list .apartment-plan-row .info .price .value {background: #c18561;}

@media all and (max-width: 767px) {
    .plan-apartments-list table {font-size: 16px; line-height: 20px;}
    .plan-apartments-list .apartment-plan-row .photo {width: 100%;}
    .plan-apartments-list .apartment-plan-row .info {width: 100%; display: flex; flex-wrap: wrap; align-items: center;}
    .plan-apartments-list .apartment-plan-row .info .floor {width: 50%;}
    .plan-apartments-list .apartment-plan-row .info .prices {width: 50%;}
    .plan-apartments-list .apartment-plan-row .info .contact {width: 100%;}
}

@media all and (max-width: 500px) {
    .plan-apartments-list table th {font-size: 12px;}
    .plan-apartments-list .apartment-plan-row .info .floor {width: 100%;}
    .plan-apartments-list .apartment-plan-row .info .prices {width: 100%;}
}