/* Warenkorb */

.layerShopCart {
    width: 100%;
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-start;
    align-items: flex-start;
}

.layerShopCartNavigation {
    margin-bottom: 2rem;
    width: 100%;
    display: flex;
    flex-wrap: nowrap;
    align-items: stretch;
    align-content: stretch;
    justify-content: space-between;
}

.layerShopCartNavigation .item {
    color: #333333;
    font-family: var(--main-font-fontawesome);
    display: block;
    width: 25%;
    text-align: center;
    padding: 15px 0;
    font-size: 150%;
    border: 1px solid var(--main-color-soft);
}

.layerShopCartNavigation .item.open {
    color: #FFF;
    background-color: var(--main-color-soft);
    border: 1px solid var(--main-color-soft);
}

.layerShopCart .head {
    margin-bottom: 20px;
    width: 100%;
}

.layerShopCart .content {
    margin-bottom: 30px;
    width: 100%;
}

.layerShopCart .head .document {
    font-family: var(--main-font-fontawesome);
    font-size: 160%;
    float: right;
    color: #333333;
    text-decoration: none;
}

.layerShopCart .list {
    margin-bottom: 20px;
    line-height: 1.25rem;
}

.layerShopCart .list>.title,
.layerShopCart .list.address .title {
    font-size: 110%;
    margin-bottom: 10px;
    color: #000;
}

.layerShopCart .list.cart {
    width: 100%;
    border-bottom: 1px solid #CCCCCC;
}

.layerShopCart .list.cart .item {
    overflow: hidden;
    border-top: 1px solid #CCCCCC;
    padding: 10px 0;
}

.layerShopCart .list.cart .item .head .title {
    font-size: 140%;
}

.layerShopCart .list.cart .item .list {
    margin-bottom: 0;
}

.layerShopCart .list.cart .item.set {
    overflow: hidden;
    border-top: none;
    padding: 0;
    margin-top: 10px;
}

.layerShopCart .list.cart .item .image {
    float: left;
    width: 20%;
    line-height: 0;
}

.layerShopCart .list.cart .item .image img {
    max-width: 100%;
    height: auto;
}

.layerShopCart .list.cart .item .right {
    padding-left: 25%;
}

.layerShopCart .list.cart .item .right:after {
    content: '';
    display: block;
    clear: right;
}

.layerShopCart .list.cart .item .delete,
.layerMemberWatchlist .list .item .delete {
    float: right;
}

.layerShopCart .list.cart .item .delete .button,
.layerMemberWatchlist .list .item .delete {
    margin: 0;
    background: none;
    border: none;
    font-family: var(--main-font-fontawesome);
    cursor: pointer;
    font-size: 160%;
    background-color: var(--main-color-soft);
    padding: 7px 10px;
    border-radius: 3px;
    color: #333;
}

.itemCart .delete {
    display: none;
}

.layerMemberWatchlist .list .item .delete {
    font-size: 120%;
}

.layerShopCart .list.cart .item .title {
    font-size: 120%;
}

.layerShopCart .list.cart .item .number {
    font-size: 95%;
    margin-bottom: 10px;
}

.layerShopCart .list.cart .item .unit {
    text-align: right;
}

.layerShopCart .list.cart .item .count {
    text-align: right;
}

.layerShopCart .list.cart .item .dispo {
    padding-left: 20px;
    font-size: 95%;
    margin-bottom: 5px;
}

.layerShopCart .list.cart .item .dispo:before {
    content: '';
    display: inline-block;
    width: 10px;
    height: 10px;
    border-radius: 50%;
    margin-left: -20px;
    margin-right: 10px;
}

.layerShopCart .list.cart .item .dispo.green:before {
    background-color: green;
}

.layerShopCart .list.cart .item .dispo.orange:before {
    background-color: orange;
}

.layerShopCart .list.cart .item .dispo.red:before {
    background-color: red;
}

.layerShopCart .list.cart .item .price {
    clear: right;
    float: right;
}

.layerShopCart .list.cart .item .price .right {
    float: right;
    padding: 0;
    min-width: 80px;
    text-align: right;
}

.layerShopCart .list.cart .item .price .left {
    float: left;
}

.layerShopCart .list.cart .item .form {
    float: right;
    width: 85px;
    padding-right: 25px;
    position: relative;
    margin-bottom: 20px;
    margin-top: 20px;
}

.layerShopCart .list.cart .item .form .input {
    box-sizing: border-box;
    height: 25px;
    width: 100%;
    border: 1px solid #333333;
    background: none;
    color: #333333;
    border-radius: 3px 0 0 3px;
    padding: 0 5px;
}

.layerShopCart .list.cart .item .form .button {
    box-sizing: border-box;
    height: 25px;
    width: 25px;
    position: absolute;
    right: 0;
    top: 0;
    border: none;
    background: #333333;
    color: #FFFFFF;
    cursor: pointer;
    font-family: var(--main-font-fontawesome);
    border-radius: 0 3px 3px 0;
    font-size: 90%;
}

.layerShopCart .list.link {
    text-align: right;
}

.layerShopCart .list.link a {
    display: inline-block;
    background-color: #f2f2f2;
    color: #333333;
    text-decoration: none;
    padding: 5px 10px;
    font-size: 90%;
    border-radius: 3px;
}

.layerShopCart .list.link a:hover {
    color: #f2f2f2;
    background-color: #333333;
}

.layerShopCart .list.link a:before {
    content: '\f08e\00A0';
    font-family: var(--main-font-fontawesome);
}

.layerShopCart>.form {
    width: 100%;
    margin-bottom: 20px;
}

.layerShopCart form {
    width: 100%;
}

.layerShopCart .form .voucher form {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    align-items: center;
    font-family: var(--main-font);
}

.layerShopCart .form .voucher .input {
    box-sizing: border-box;
    height: 35px;
    border: 1px solid var(--main-color-soft);
    background: none;
    color: #333333;
    border-radius: 3px 0 0 3px;
    padding: 0 5px;
    font-family: var(--main-font);
    min-width: 25%;
}

.layerShopCart .form .voucher .button {
    box-sizing: border-box;
    height: 35px;
    border: none;
    background: var(--main-color-soft);
    color: #333;
    cursor: pointer;
    border-radius: 0 3px 3px 0;
    font-size: 90%;
    padding: 0 10px;
    font-family: var(--main-font);
}

.layerShopCart .form .voucher .button:hover {
    background: var(--main-color);
    color: white;
    transition: all 0.5s ease-out;
}

.layerShopCart .list.summary {
    background: var(--main-color-soft);
    padding: 10px;
    width: 100%;
}

.layerShopCart .list.summary .item {
    overflow: hidden;
}

.layerShopCart .list.summary .item .line {
    border-top: 1px solid rgba(0, 0, 0, 0.2)
}

.layerShopCart .list.summary .item .label {
    float: left;
}

.layerShopCart .list.summary .item .value {
    float: right;
}

.layerShopCart .list.summary .item .value .left {
    float: left;
}

.layerShopCart .list.summary .item .value .right {
    float: right;
}

.layerShopCart .list.summary .voucher {
    padding: 3px 10px;
    background: var(--main-color);
    color: #FFF;
    font-weight: 700;
    margin: 6px -10px;
}

.layerShopCart .list.summary .total {
    border-top: 1px solid #333;
    padding-top: 5px;
    margin-top: 5px;
}

.layerShopCart .action {
    width: 100%;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: center;
}

.layerShopCart .action .check {
    text-align: right;
    font-size: 90%;
    margin: 20px 0;
}

.layerShopCart .action .check a {
    color: #333333;
    text-decoration: none;
}

.layerShopCart .action .left {
    float: left;
}

.layerShopCart .action .right {
    float: right;
}

.layerShopCart .action .button,
.layerShopCart .action .link {
    line-height: 20px;
    margin: 0;
    padding: 5px 10px;
    background: var(--main-color);
    color: white;
    border: none;
    border-radius: 3px;
    cursor: pointer;
}

.layerShopCart .action .button:hover,
.layerShopCart .action .link:hover {
    background: var(--main-color-soft);
    transition: all 0.5s ease-out;
}

.layerShopCartAddress>.form {
    background-color: #eeeeee;
    padding: 10px;
    margin-bottom: 20px;
}

.layerShopCartAddressForm {
    margin-bottom: 20px;
    font-size: 90%;
    color: #000;
}

.layerShopCartAddressForm .detailAddressLabel,
.layerShopCartAddressForm .label {
    width: 150px;
    float: left;
    margin-bottom: 5px;
}

.layerShopCartAddressForm .detailAddressValue,
.layerShopCartAddressForm .value {
    padding-left: 150px;
    margin-bottom: 10px;
}

.detailAddressCheck {
    padding-left: 150px;
    margin-bottom: 15px;
}

.layerShopCartAddressForm .value input,
.layerShopCartAddressForm .inputAddress,
.layerShopCartAddressForm .select,
.layerShopCartAddressForm .textarea,
.layerShopCartAddressForm .selectAddress {
    box-sizing: border-box;
    width: 100%;
    border: 1px solid #CCCCCC;
    border-radius: 3px;
    height: 40px;
    padding: 0 10px;
    background: none;
}

.layerShopCartAddressForm .input.zip {
    width: 20%;
}

.layerShopCartAddressForm .input.place {
    width: 78%;
    margin-left: 2%;
}

.layerShopCartAddressForm .input.street {
    width: 78%;
    margin-right: 2%;
}

.layerShopCartAddressForm .input.streetNumber {
    width: 20%;
}

.layerShopCartAddressForm .textarea {
    padding: 5px;
    min-height: 100px;
    resize: vertical;
}

.layerShopCartPayment .item {
    background-color: #f2f2f2;
    color: #000;
    padding: 10px;
    font-size: 90%;
    margin-bottom: 20px;
    border-radius: 3px;
    overflow: hidden;
}

.layerShopCartPayment .item img {
    float: right;
    max-width: 100%;
    padding: 20px 0;
}

.layerShopCartPayment .item .radio {
    float: left;
}

.layerShopCartPayment .item .label {
    padding-left: 25px;
}

.layerShopCartPayment .item .address {
    border-top: 1px dotted #999999;
    margin-top: 10px;
    padding-top: 10px;
}

.layerShopCartPayment .item .address a {
    color: inherit;
    text-decoration: none;
}

.layerShopCart .list.address {
    overflow: hidden;
}

.layerShopCart .list.address .left {
    margin-right: 5rem;
}

.layerShopCart .list.address,
.layerShopCart .list.payment {
    border-bottom: 1px solid #CCCCCC;
    padding-bottom: 20px;
    width: 100%;
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-start;
    align-items: baseline;
}

.layerShopCart .list.payment .address {
    margin-top: 10px;
}

.layerShopCart .list.payment .address a {
    color: inherit;
    text-decoration: none;
}

.layerShopCart .success a {
    color: #FFFFFF;
    text-decoration: none;
}

.layerShopCart a.document:before {
    content: '\f1c1\00A0\00A0';
    font-family: var(--main-font-fontawesome);
}

.cart-action-withdrawal {
    display: none;
}