Some useful media queries for responsive layouts and ie selection (media query hack from keith clark).

Media-Queries.less

// Smartphones (portrait and landscape)
@phone-portrait-landscape: ~"only screen and (min-device-width : 320px) and (max-device-width : 480px)";

// Smartphones (landscape)
@phone-landscape: ~"only screen and (min-width : 321px)";

// Smartphones (portrait)
@phone-portrait: ~"only screen and (max-width : 320px)";

// iPads (portrait and landscape)
@ipads-portrait: ~"only screen and (min-device-width : 768px) and (max-device-width : 1024px)";

// iPads (landscape)
@ipads-landscape: ~"only screen and (min-device-width : 768px) and (max-device-width : 1024px) and (orientation : landscape)";

// iPads (portrait)
@ipads-portrait: ~"only screen and (min-device-width : 768px) and (max-device-width : 1024px) and (orientation : portrait)";

// Desktops and laptops
@desktops-laptops: ~"only screen and (min-width : 1224px)";

// Large screens
@large-screens: ~"only screen and (min-width : 1824px)";

// iPhone 4
@iphone-4: ~"only screen and (-webkit-min-device-pixel-ratio : 1.5), only screen and (min-device-pixel-ratio : 1.5)";

// Usage:
//@media @phone-portrait-landscape {
//.class-x {
//  color: black;
//  }
//}

// Hack media blocks for various IE selections :)
// More at http://blog.keithclark.co.uk/moving-ie-specific-css-into-media-blocks/
// Target IE 6 and 7
@ie6-7: ~"screen\9";

// Target IE 6, 7 and 8
@ie6-8: ~"\0screen\,screen\9";

// Target IE 8
@ie8: ~"\0screen";

// Target IE 8, 9 and 10
@ie8-10: ~"screen\0";

// Target IE 9 and 10
@ie9-10: ~"screen and (min-width:0\0)";

// Usage:
//@media @ie6-7 {
//.class-only-ie6-7 {
//  color: black;
//  }
//}

Mixins.less

@import "Media Queries";

// This is 'private' mixin for arrow-'direction' mixins.
.arrow() {
    border-style: solid;
    content: '';
    display: inline-block;
}
// This mixin generates a down arrow with the given color.
.arrow-down(@color) {
    .arrow();
    border-color: @color transparent transparent transparent;
    border-width: 5px 4px;
}
// This mixin generates a left arrow with the given color.
.arrow-left(@color) {
    .arrow();
    border-color: transparent @color transparent transparent;
    border-width: 4px 5px;
}
// This mixin generates a right arrow with the given color.
.arrow-right(@color) {
    .arrow();
    border-color: transparent transparent transparent @color;
    border-width: 4px 5px;
}
// This mixin generates an upper arrow with the given color.
.arrow-up(@color) {
    .arrow();
    border-color: transparent transparent @color transparent;
    border-width: 5px 4px;
}
// This mixin generates linear gradients with all vendor prefixes.
// Note that combinations with box-shadow are not supportet for IE8!
.linear-gradient(@startColor, @endColor, @fallbackColor: @startColor) {
    background: @fallbackColor; // Old browsers
    @svg: ~'<?xml version="1.0" ?><svg xmlns="http://www.w3.org/2000/svg" width="100%" height="100%" viewBox="0 0 1 1" preserveAspectRatio="none"><linearGradient id="grad-ucgg-generated" gradientUnits="userSpaceOnUse" x1="0%" y1="0%" x2="0%" y2="100%"><stop offset="0%" stop-color="@{startColor}" stop-opacity="1"/><stop offset="100%" stop-color="@{endColor}" stop-opacity="1"/></linearGradient><rect x="0" y="0" width="1" height="1" fill="url(#grad-ucgg-generated)" /></svg>';
    .base64DataUriBackground(@svg);
    background: -moz-linear-gradient(top, @startColor 0%, @endColor 100%); // FF3.6+
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, @startColor), color-stop(100%, @endColor)); // Chrome,Safari4+
    background: -webkit-linear-gradient(top, @startColor 0%, @endColor 100%); // Chrome10+,Safari5.1+
    background: -o-linear-gradient(top, @startColor 0%, @endColor 100%); // Opera 11.10+
    background: -ms-linear-gradient(top, @startColor 0%, @endColor 100%); // IE10+
    background: linear-gradient(to bottom, @startColor 0%, @endColor 100%); // W3C
    -ms-filter: ~"progid:DXImageTransform.Microsoft.gradient( startColorstr='@{startColor}', endColorstr='@{endColor}',GradientType=0 )";
    filter: ~"progid:DXImageTransform.Microsoft.gradient( startColorstr='@{startColor}', endColorstr='@{endColor}',GradientType=0 )";
}
// Encode SVG content to base64 data URI
.base64DataUriBackground (@encode, @type: ~"image/svg+xml") {
    @dataUriPrefix: ~"url(data:@{type};base64,";
    @dataUriSuffix: ~")";
    @b64DataUri: ~`(function(a,b,c){function e(a){a=a.replace(/\r\n/g,'\n');var b='';for(var c=0;c<a.length;c++){var d=a.charCodeAt(c);if(d<128){b+=String.fromCharCode(d)}else if(d>127&&d<2048){b+=String.fromCharCode(d>>6|192);b+=String.fromCharCode(d&63|128)}else{b+=String.fromCharCode(d>>12|224);b+=String.fromCharCode(d>>6&63|128);b+=String.fromCharCode(d&63|128)}}return b}function f(a){var b='';var c,f,g,h,i,j,l;var m=0;a=e(a);while(m<a.length){c=a.charCodeAt(m++);f=a.charCodeAt(m++);g=a.charCodeAt(m++);h=c>>2;i=(c&3)<<4|f>>4;j=(f&15)<<2|g>>6;l=g&63;if(isNaN(f)){j=l=64}else if(isNaN(g)){l=64}b=b+d.charAt(h)+d.charAt(i)+d.charAt(j)+d.charAt(l)}return b}var d='ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789+/=';return a+f(b)+c})('@{dataUriPrefix}','@{encode}','@{dataUriSuffix}')`;
    background: @b64DataUri;
}
//:root .linear-gradient { filter: none; }
// This mixin generates 360° box shadows with all vendor prefixes.
// Note that this mixin is experimental! The IE shadow filter shifts the element and children when they positioned relative, use carefully!
.box-shadow-360(@blur: 4px, @spread: 1px, @color: #888) {
    -webkit-box-shadow: 0 0 @blur @spread @color;
    -moz-box-shadow: 0 0 @blur @spread @color;
    box-shadow: 0 0 @blur @spread @color;
    @ie-color: argb(@color);
    @ie-strength: unit(@blur);
    @ie-cornerstrength: @ie-strength - 1;
    -ms-filter: ~"progid:DXImageTransform.Microsoft.Shadow(Color='@{ie-color}', Strength=@{ie-strength}, Direction=0), progid:DXImageTransform.Microsoft.Shadow(Color='@{ie-color}', Strength=@{ie-cornerstrength}, Direction=45), progid:DXImageTransform.Microsoft.Shadow(Color='@{ie-color}', Strength=@{ie-strength}, Direction=90), progid:DXImageTransform.Microsoft.Shadow(Color='@{ie-color}', Strength=@{ie-cornerstrength}, Direction=135), progid:DXImageTransform.Microsoft.Shadow(Color='@{ie-color}', Strength=@{ie-strength}, Direction=180), progid:DXImageTransform.Microsoft.Shadow(Color='@{ie-color}', Strength=@{ie-cornerstrength}, Direction=225), progid:DXImageTransform.Microsoft.Shadow(Color='@{ie-color}', Strength=@{ie-strength}, Direction=270), progid:DXImageTransform.Microsoft.Shadow(Color='@{ie-color}', Strength=@{ie-cornerstrength}, Direction=315)";
    filter: ~"progid:DXImageTransform.Microsoft.Shadow(Color='@{ie-color}', Strength=@{ie-strength}, Direction=0), progid:DXImageTransform.Microsoft.Shadow(Color='@{ie-color}', Strength=@{ie-cornerstrength}, Direction=45), progid:DXImageTransform.Microsoft.Shadow(Color='@{ie-color}', Strength=@{ie-strength}, Direction=90), progid:DXImageTransform.Microsoft.Shadow(Color='@{ie-color}', Strength=@{ie-cornerstrength}, Direction=135), progid:DXImageTransform.Microsoft.Shadow(Color='@{ie-color}', Strength=@{ie-strength}, Direction=180), progid:DXImageTransform.Microsoft.Shadow(Color='@{ie-color}', Strength=@{ie-cornerstrength}, Direction=225), progid:DXImageTransform.Microsoft.Shadow(Color='@{ie-color}', Strength=@{ie-strength}, Direction=270), progid:DXImageTransform.Microsoft.Shadow(Color='@{ie-color}', Strength=@{ie-cornerstrength}, Direction=315)";
}
// This mixin generates 360° box shadows straight down with all vendor prefixes.
// Note that this mixin is experimental! The IE shadow filter shifts the element and children when they positioned relative, use carefully!
.box-shadow-360-straight-down(@color: #aaa) {
    -webkit-box-shadow: 0 1px 2px 1px @color;
    -moz-box-shadow: 0 1px 2px 1px @color;
    box-shadow: 0 1px 2px 1px @color;
    @media @ie9-10 {
        box-shadow: 0px 1px 6px 1px @color;
    }
    @ie-color: argb(@color);
    @media @ie6-8 {
        margin-top: -4px;
        margin-left: -4px;
        -ms-filter: ~"progid:DXImageTransform.Microsoft.Shadow(Color='@{ie-color}', Strength=1, Direction=0), progid:DXImageTransform.Microsoft.Shadow(Color='@{ie-color}', Strength=1, Direction=45), progid:DXImageTransform.Microsoft.Shadow(Color='@{ie-color}', Strength=1, Direction=90), progid:DXImageTransform.Microsoft.Shadow(Color='@{ie-color}', Strength=3, Direction=135), progid:DXImageTransform.Microsoft.Shadow(Color='@{ie-color}', Strength=4, Direction=180), progid:DXImageTransform.Microsoft.Shadow(Color='@{ie-color}', Strength=3, Direction=225), progid:DXImageTransform.Microsoft.Shadow(Color='@{ie-color}', Strength=1, Direction=270), progid:DXImageTransform.Microsoft.Shadow(Color='@{ie-color}', Strength=1, Direction=315)";
        filter: ~"progid:DXImageTransform.Microsoft.Shadow(Color='@{ie-color}', Strength=1, Direction=0), progid:DXImageTransform.Microsoft.Shadow(Color='@{ie-color}', Strength=1, Direction=45), progid:DXImageTransform.Microsoft.Shadow(Color='@{ie-color}', Strength=1, Direction=90), progid:DXImageTransform.Microsoft.Shadow(Color='@{ie-color}', Strength=3, Direction=135), progid:DXImageTransform.Microsoft.Shadow(Color='@{ie-color}', Strength=4, Direction=180), progid:DXImageTransform.Microsoft.Shadow(Color='@{ie-color}', Strength=3, Direction=225), progid:DXImageTransform.Microsoft.Shadow(Color='@{ie-color}', Strength=1, Direction=270), progid:DXImageTransform.Microsoft.Shadow(Color='@{ie-color}', Strength=1, Direction=315)";
        & * {
            position: inherit;
        }
    }
}
// Note that this mixin is experimental! The IE shadow filter shifts the element and children when they positioned relative, use carefully!
.box-shadow-bottom(@vertical: 3px, @blur: 3px, @color: #888) {
    -webkit-box-shadow: 0 @vertical @blur @color;
    -moz-box-shadow: 0 @vertical @blur @color;
    box-shadow: 0 @vertical @blur @color;
    @ie-color: argb(@color);
    @ie-blur: unit(@blur);
    -ms-filter: ~"progid:DXImageTransform.Microsoft.Shadow(color='@{ie-color}', Direction=180, Strength=@{ie-blur})";
    filter: ~"progid:DXImageTransform.Microsoft.Shadow(color='@{ie-color}', Direction=180, Strength=@{ie-blur})";
}
// This mixin generates box shadows with all vendor prefixes.
// Note that this mixin is experimental! The IE shadow filter shifts the element, use carefully!
.box-shadow-right-bottom(@blur: 1px, @color: #eee) {
    -webkit-box-shadow: 1px 1px @blur @color;
    -moz-box-shadow: 1px 1px @blur @color;
    box-shadow: 1px 1px @blur @color;
    @ie-color: argb(@color);
    @ie-blur: unit(@blur);
    -ms-filter: ~"progid:DXImageTransform.Microsoft.Shadow(Color='@{ie-color}', Strength=@{ie-blur}, Direction=45), progid:DXImageTransform.Microsoft.Shadow(Color='@{ie-color}', Strength=2, Direction=90), progid:DXImageTransform.Microsoft.Shadow(Color='@{ie-color}', Strength=@{ie-blur}, Direction=135), progid:DXImageTransform.Microsoft.Shadow(Color='@{ie-color}', Strength=2, Direction=180), progid:DXImageTransform.Microsoft.Shadow(Color='@{ie-color}', Strength=@{ie-blur}, Direction=225)";
    filter: ~"progid:DXImageTransform.Microsoft.Shadow(Color='@{ie-color}', Strength=@{ie-blur}, Direction=45), progid:DXImageTransform.Microsoft.Shadow(Color='@{ie-color}', Strength=2, Direction=90), progid:DXImageTransform.Microsoft.Shadow(Color='@{ie-color}', Strength=@{ie-blur}, Direction=135), progid:DXImageTransform.Microsoft.Shadow(Color='@{ie-color}', Strength=2, Direction=180), progid:DXImageTransform.Microsoft.Shadow(Color='@{ie-color}', Strength=@{ie-blur}, Direction=225)";
}
// This mixin generates inset shadows with all vendor prefixes.
// Note that this mixin is experimental! The IE shadow filter shifts the element, use carefully!
.inset-shadow-right-bottom(@blur: 1px, @color: #eee) {
    -webkit-box-shadow: 0 2px 1px -@blur @color, inset 2px 0 1px -@blur @color;
    -moz-box-shadow: 0 2px 1px -@blur @color, inset 2px 0 1px -@blur @color;
    box-shadow: 0 2px 1px -@blur @color, inset 2px 0 1px -@blur @color;
    @ie-color: argb(@color);
    @ie-blur: unit(@blur);
    -ms-filter: ~"progid:DXImageTransform.Microsoft.Shadow(Color='@{ie-color}', Strength=@{ie-blur}, Direction=135)";
    filter: ~"progid:DXImageTransform.Microsoft.Shadow(Color='@{ie-color}', Strength=@{ie-blur}, Direction=135)";
}
.opacity(@opacity: 0.5) {
    -moz-opacity: @opacity;
    -khtml-opacity: @opacity;
    -webkit-opacity: @opacity;
    opacity: @opacity;
    @opperc: @opacity * 100;
    -ms-filter: ~"progid:DXImageTransform.Microsoft.Alpha(opacity=@{opperc})";
    filter: ~"alpha(opacity=@{opperc})";
}
.input-placeholder-color(@color) {
    // Pseudo selectors for modern browsers
    &::-webkit-input-placeholder { // WebKit browsers
        color: @color;
    }

    &:-moz-placeholder { // Mozilla Firefox 4 to 18
        color: @color;
    }

    &::-moz-placeholder { // Mozilla Firefox 19+
        color: @color;
    }

    &:-ms-input-placeholder { // Internet Explorer 10+
        color: @color;
    }
}

// Use it like the CSS3 :nth-child() selector to get it work in ie8!
// -- Example:
// -- use this
//.nthMargin(4, right, 'li');.nthMargin(2, all, 'li');
// -- instead of this
//li:nth-child(4){margin-right: 0;}li:nth-child(2){margin: 0;}
.nthMargin(@index, @direction, @selector) {
    .nthLoop(@index, @direction, '@{selector}:first-child', @selector);
    .nthLoop (@index, @direction, @in:"", @selector) when (@index > 0) {
        @concatenate: ~'@{in} + @{selector}';
        .nth(@index, @direction, @concatenate);
        .nthLoop((@index - 1), @direction, @concatenate, @selector);
        .nth(@index, @direction, @selector) when (@index = 2) {
            .out(@selector, @direction);
            .out(@selector, @direction) when (@direction = right) {
                @{selector} {
                    margin-right: 0;
                }
            }
            .out(@selector, @direction) when (@direction = left) {
                @{selector} {
                    margin-left: 0;
                }
            }
            .out(@selector, @direction) when (@direction = top) {
                @{selector} {
                    margin-top: 0;
                }
            }
            .out(@selector, @direction) when (@direction = bottom) {
                @{selector} {
                    margin-bottom: 0;
                }
            }
            .out(@selector, @direction) when (@direction = all) {
                @{selector} {
                    margin: 0;
                }
            }
        }
    }
}