.u-background-color--okavango {
    background-color: #0a6e50!important
}

.u-background-color--sand {
    background-color: #f6f4f0!important
}

.u-background-color--plum {
    background-color: #a71f50!important
}

.u-background-color--midnight {
    background-color: #222!important
}

@media (min-width: 0) {
    .xs\:u-background-color--okavango {
        background-color:#0a6e50!important
    }

    .xs\:u-background-color--sand {
        background-color: #f6f4f0!important
    }

    .xs\:u-background-color--plum {
        background-color: #a71f50!important
    }

    .xs\:u-background-color--midnight {
        background-color: #222!important
    }
}

@media (min-width: 600px) {
    .sm\:u-background-color--okavango {
        background-color:#0a6e50!important
    }

    .sm\:u-background-color--sand {
        background-color: #f6f4f0!important
    }

    .sm\:u-background-color--plum {
        background-color: #a71f50!important
    }

    .sm\:u-background-color--midnight {
        background-color: #222!important
    }
}

@media (min-width: 960px) {
    .md\:u-background-color--okavango {
        background-color:#0a6e50!important
    }

    .md\:u-background-color--sand {
        background-color: #f6f4f0!important
    }

    .md\:u-background-color--plum {
        background-color: #a71f50!important
    }

    .md\:u-background-color--midnight {
        background-color: #222!important
    }
}

@media (min-width: 1280px) {
    .lg\:u-background-color--okavango {
        background-color:#0a6e50!important
    }

    .lg\:u-background-color--sand {
        background-color: #f6f4f0!important
    }

    .lg\:u-background-color--plum {
        background-color: #a71f50!important
    }

    .lg\:u-background-color--midnight {
        background-color: #222!important
    }
}

@media (min-width: 1920px) {
    .xl\:u-background-color--okavango {
        background-color:#0a6e50!important
    }

    .xl\:u-background-color--sand {
        background-color: #f6f4f0!important
    }

    .xl\:u-background-color--plum {
        background-color: #a71f50!important
    }

    .xl\:u-background-color--midnight {
        background-color: #222!important
    }
}

.wishlist-button {
    align-items: center;
    background: transparent;
    border: 1px solid #222;
    border-radius: .25rem;
    box-sizing: border-box;
    color: #222;
    cursor: pointer;
    display: inline-flex;
    font-family: Montserrat,Arial,Helvetica Neue,Helvetica,sans-serif;
    font-size: 1rem;
    font-weight: 500;
    justify-content: center;
    margin: 0;
    min-height: 2.5rem;
    overflow: hidden;
    padding: 0 1rem;
    position: relative;
    text-align: center;
    text-decoration: none;
    transition: background-color .2s cubic-bezier(.4,0,.2,1),color .2s cubic-bezier(.4,0,.2,1),border .2s cubic-bezier(.4,0,.2,1);
    vertical-align: middle
}

.wishlist-button:focus,.wishlist-button:hover {
    background-color: #222;
    border-color: #222;
    color: #fff
}

.wishlist-button--add:hover .wishlist-button__text {
    display: none
}

.wishlist-button--add:hover:before {
    content: "Remove from my wishlist"
}