we-use-cookies.less

@wuc-color-background: #202020;
@wuc-color-text: #fff;
@wuc-color-btn-primary: #0be881;
@wuc-color-btn-secondary: #fff7;

#we-use-cookies {
    position: fixed;
    width: 290px;
    z-index: 99999;
    border-radius: 5px;
    background-color: @wuc-color-background;
    padding: 15px;
    font-size: 14px;
    color: @wuc-color-text;

    &.top {
        top: 5px;
    }
    &.bottom {
        bottom: 5px;
    }
    &.left {
        left: 5px;
    }
    &.center {
        left: 50%;
        margin-left: -145px;
    }
    &.right {
        right: 5px;
    }

    &.wide {
        @media screen and ( min-width: 576px ) {
            width: 500px;
        }
    }
    &.wide.center {
        @media screen and ( min-width: 576px ) {
            margin-left: -250px;
        }
    }

    .message {
        margin: 0;
        padding: 0;
    }

    .buttons {
        display: flex;
        flex-direction: row-reverse;
        justify-content: space-between;
        margin: 15px 0 0 0;
        padding: 0;
        list-style-type: none;
        li {
            margin: 0;
        }
        a {
            display: block;
            min-width: 60px;
            height: 36px;
            line-height: 34px;
            padding: 0 13px;
            transition: none;
            letter-spacing: 1px;
            text-decoration: none;
            text-transform: uppercase;
            text-align: center;
            font-size: 12px;
            user-select: none;
            &.secondary {
                border: 1px solid transparent;
                color: @wuc-color-btn-secondary;
            }
            &.secondary:hover {
            }
            &.primary {
                border: 1px solid @wuc-color-btn-primary;
                color: @wuc-color-btn-primary;
            }
            &.primary:hover {
                background-color: @wuc-color-btn-primary;
                color: @wuc-color-background;
            }
        }
    }
}