LESS: Using nesting and mixins in practice

fancy-box-mixin.less

.fancy-box(@width, @height) {
    .border-radius(6px);
    .box-shadow(0px, 0px, 5px, rgba(0, 0, 0, 0.5));

    display: block;
    background: rgb(0, 0, 0);
    background: rgba(0, 0, 0, 0.4);
    width: @width - 10;
    height: @height - 9;
    padding: 5px 5px 4px 5px;

    > .inner {
        .border-radius(6px);
        
        background: rgb(0, 0, 0);
        background: rgba(0, 0, 0, 0.8);
        border-bottom: 1px solid rgba(255, 255, 255, 0.24);
        
        width: @width - 10;
        height: @height - 10;
        position: relative;
    }
}

screen.less

.news-sidebar-caption {
    .fancy-box(266px, 106px);

    position: relative;
    z-index: 2;

    h1 {
        padding: 10px 0 0 0px;
        margin: 0 20px 0 11px;

        color: @gold;
        text-transform: uppercase;
        font-size: 16px;
        line-height: 16.4px;
    }
    p {
        margin: 0 20px 0 11px;

        text-transform: uppercase;
        font-weight: bold;
        color: @grey;
        font-size: 11px;
        line-height: 20.4px;
    }
    p strong {
        color: @gold;
    }
}