.contacts .container {width: 96%;max-width: 1200px;justify-content: space-around;align-items: center;}
.contacts-list {list-style: none;display: flex;flex-direction: column;}
.contacts-list li {margin-bottom: 1rem;}
.contacts-list li a{display: block;width: 100%;background: var(--lightblue);text-decoration: none;padding: .5rem 2rem;border-radius: 2rem;box-sizing: border-box;color: var(--darkgrey);}
.contacts-list svg {vertical-align: middle; display: inline-block;margin-right: 1rem;}
.contacts .h3 {font-size: 1.6rem; font-weight: 700;margin-top: 2rem;}

.mass p {position: relative;z-index: 2;background: #fff;padding: calc(2rem + 170px + 2rem) 2rem 2rem 2rem;border: 2px solid #fff;border-radius: 2rem;cursor: pointer;width: 220px;}
.mass-rm p {background: url(img/holz-rm.svg) center 3.3rem/150px 150px no-repeat;}
.mass-srm p {background: url(img/holz-srm.svg) center 3.3rem/150px 150px no-repeat;}
.mass-srmbb p {background: url(img/holz-srm-bb.svg) center 2rem/150px 174px no-repeat;}
.amount-group input::-webkit-outer-spin-button,
.amount-group input::-webkit-inner-spin-button {-webkit-appearance: none;margin: 0;}
.amount-group input[type=number]{-moz-appearance: textfield;}
.mass input {visibility: hidden; position: absolute; top: 0; left: 0; z-index: 1;}
.mass input:checked + p {border: 2px solid var(--darkbrown)}
.mass p:after {content: '';display: block;width: 28px;height: 28px;border: 3px solid var(--darkbrown);border-radius: 50%;position: absolute;right: 2rem;top: 60%;background: #fff;}
.mass input:checked + p:after {background: url(img/check.svg) center/18px no-repeat, var(--lightblue);}
.small {font-size: .8em;}
.flex-column {flex-direction: column}
.amount-group .bold {font-size: 8rem;line-height: .8em;display: block;}
.amount-group p {text-indent: -8px;}
.amount-btn {background: var(--darkbrown);color: #fff;font-weight: 700;font-size: 1.7rem;display: block;width: 32px;height: 32px;line-height: 32px;border-radius: 4px;border: 0;cursor: pointer;}
.amount-group input {display: block;width: 32px;height: 32px;line-height: 32px;border-radius: 4px;font-family: 'Outfit';font-size: 1rem;text-align: center;border: 2px solid var(--darkbrown);}
.length {position: relative;}
.length p {position: relative;z-index: 2;background: #fff;font-size: 1.75rem;padding-top: 60px;border-radius: 2rem;cursor: pointer;}
.length input {visibility: hidden; position: absolute; top: 0; left: 0; z-index: 1;}
.length p:after { content: '';display: block;width: 28px;height: 28px;border: 3px solid var(--darkbrown);border-radius: 50%;position: absolute;right: calc(50% - 14px - 3px); top: 0;background: var(--darkbrown);}
.length input:checked + p:after {background: url(img/check.svg) center/18px no-repeat, var(--lightblue);}
.preis-line {font-size: 1.2rem; line-height: 1.25em; vertical-align: middle;}
.text-input {border: 1px solid var(--darkbrown);border-radius: 4px;font-family: 'Outfit';font-size: 1rem;padding: .5rem 1rem;color: var(--darkbrown);width: 100%;margin-top: .5rem;}
.row.input-row {max-width: 660px;}
.street {width: 70%;}
.number {width: 20%;}
.town {width: 60%;}
.zip {width: 30%;}
.w-100 {width: 100%;}
.total {font-size: 1.6rem; font-weight: 700;}
.btn-link:disabled {opacity: 0.5; color: #fff; cursor: not-allowed;}
.btn-link:disabled span:before, .btn-link:disabled span:after {background: #fff;}
.btn-link:disabled span:before {top: 0;transform: translateY(0.55em)rotate(-45deg);}
.btn-link:disabled span:after {bottom: 0;transform: translateY(-0.55em)rotate(45deg);}
.middlesize:before {content: '';display: block;width: 3rem;height:1px;border-bottom: 5px dotted var(--darkbrown);position: absolute;right: 100%;top: 15px;}
.middlesize:after { content: '';display: block;width: 3rem;height:1px;border-bottom: 5px dotted var(--darkbrown);position: absolute;left: 100%;top: 15px;}
.middlesize.leftside:before {border-bottom: 5px solid var(--darkbrown);}
.middlesize.bothside:before, .middlesize.bothside:after {border-bottom: 5px solid var(--darkbrown);}
.hidden {display: none;}
@media screen and (min-width: 1024px) {
    .btn-link:hover span:after, .btn-link:hover span:before {right: -.75rem;transition: right .3s ease;}
    .btn-link:hover span.opposite:after, .btn-link:hover span.opposite:before {left: -.75rem;transition: left .3s ease;}
    .btn-link:disabled span:before, .btn-link:disabled span:after {right: 0;}
    .contacts-list li a:hover, .contacts-list li a:focus {background: #73868b;transition: background .3s ease;color: #fff;}
    .contacts-list li a:hover svg path, .contacts-list li a:focus svg path {fill: #fff;}
}
@media screen and (max-width: 750px) {
    .contacts-list {margin-top: 2rem; margin-bottom: 2rem;}
    footer .d-flex {flex-wrap: wrap;}
    footer .d-flex > * {width: 100%;}
}
@media screen and (max-width: 410px) {
    .contacts-list li a {padding: .5rem 1rem;}
    .contacts-list svg {margin-right: .5rem;}
}