#rft.claro {
    .rftIndexMenuBlock {
        width: @indexmenu_blockwidth;
        height: @indexmenu_blockheight;
        background: @base1;
        float: left;
        margin: @indexmenu_blockmargin;
        overflow: hidden;

        &:hover .rftIndexMenuMask {
            margin-top: -@indexmenu_blockheight;
        }
    }
    .rftIndexMenuMask {
        width: @indexmenu_blockwidth;
        height: @indexmenu_blockheight;
        background: @base1;
        color: @headers;
        margin-top: 0;

        .label {
            color: @headers;
            font-size: @indexmenu_font_size;
            height: @indexmenu_font_size;
            line-height: @indexmenu_font_size;
            margin-top: (@indexmenu_blockheight - @indexmenu_font_size) / 2;
            float: left;
        }

        .rftIcon {
            .setIcon(32px);
            float: left;
            margin: ((@indexmenu_blockheight - @indexmenu_font_size)/2) 8px 0 8px;
        }
    }
    .rftIndexMenuButton {
        .flatShading;
        .noOffset;
        .transition (0.3s);
        line-height: @button_indexmenu_height;
        border: none;

        .dijitButtonNode {
            border: none;
            color: @headers;
            font-size: @h2Size;

            .dijitButtonContents {
                vertical-align: top;

                .dijitButtonText {
                    padding-bottom: 10px;
                    line-height: 20px;
                }

                .rftIcon {
                    .setIcon (32px);
                    margin: 0 @std_offset_big;
                }
            }

        }

        .indexMenuMixin (@number) when (@number > 0){
            @height: @indexmenu_blockheight / @number;
            height: @height;
            width: @indexmenu_blockwidth;
                
            .dijitButtonNode {
                margin: ((@height - @button_indexmenu_content_size)/2) 0 0 0;
            }
        }

        &.oneHeight {
            .indexMenuMixin (4);
        }
        &.twoHeight {
            .indexMenuMixin (2);
        }
        &.fourHeight {
            .indexMenuMixin (1);
        }

        &.rftIndexMenuButtonHover {
            color: @text;
            .transition (0.1s);
            .dijitButtonText {
                color: @text;
                .transition(0.1s);
            }

            &.blue {
                background-color: @blue;
            }
            &.red {
                background-color: @red;
            }
            &.green {
                background-color: @green;
            }
            &.orange {
                background-color: @orange;
            }
            &.purple {
                background-color: @purple;
            }
        }

        &.rftIndexMenuButtonActive {
            .rftIcon {
                .setIcon (32px, black);
            }
            .transition(0.3s);
            color: @darkest;
            background: @text;

        }

    }
}