// ## CSS3 wrappers // // This file contains useufl CSS3 wrappers that prevent you from having // to deal with all those vendor prefixes.

// Apply a border radius on all corners @mixin border-radius($radius) {

-moz-border-radius: $radius;
-webkit-border-radius: $radius;
border-radius: $radius;

}

// Apply a border radius on the top-left corner @mixin border-radius-tl($radius) {

-moz-border-radius-topleft: $radius;
-webkit-border-top-left-radius: $radius;
border-top-left-radius: $radius;

}

// Apply a border radius on the top-right corner @mixin border-radius-tr($radius) {

-moz-border-radius-topright: $radius;
-webkit-border-top-right-radius: $radius;
border-top-right-radius: $radius;

}

// Apply a border radius on the bottom-left corner @mixin border-radius-bl($radius) {

-moz-border-radius-bottomleft: $radius;
-webkit-border-bottom-left-radius: $radius;
border-bottom-left-radius: $radius;

}

// Apply a border radius on the bottom-right corner @mixin border-radius-br($radius) {

-moz-border-radius-bottomright: $radius;
-webkit-border-bottom-right-radius: $radius;
border-bottom-right-radius: $radius;

}

// Apply a border radius on the left corners @mixin border-radius-left($radius) {

@include border-radius-tl($radius);
@include border-radius-bl($radius);

}

// Apply a border radius on the right corners @mixin border-radius-right($radius) {

@include border-radius-tr($radius);
@include border-radius-br($radius);

}

// Apply a border radius on the top corners @mixin border-radius-top($radius) {

@include border-radius-tl($radius);
@include border-radius-tr($radius);

}

// Apply a border radius on the bottom corners @mixin border-radius-bottom($radius) {

@include border-radius-bl($radius);
@include border-radius-br($radius);

}

// Apply a one pixel offset black text shadow with a given alpha value @mixin textshadow($alpha:0.4) {

text-shadow: 0px 1px 1px rgba(0,0,0,$alpha);

}

// Apply a one pixel offset white emboss effect with a given alpha value @mixin textemboss($alpha:0.4) {

text-shadow: rgba(255,255,255,$alpha) 0px 1px 1px;

}

// Apply a one pixel offset inset emboss effect with a given alpha value @mixin textemboss2($alpha:0.4) {

text-shadow: rgba(255,255,255,$alpha) 0px 1px 1px, rgba(0,0,0,$alpha) 0px -1px -1px;

}

// Apply a single box shadow @mixin box-shadow($shadow) {

-moz-box-shadow: $shadow;
-webkit-box-shadow: $shadow;
box-shadow: $shadow;

}

// Set the opacity to a given value @mixin opacity($alpha) {

opacity: $alpha;
-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=#{$alpha*100})"; // for IE8
filter: alpha(opacity=#{$alpha*100}); // for IE5-7

}

// Apply a transition property @mixin transition($trans) {

-webkit-transition: $trans;
-moz-transition: $trans;
-o-transition: $trans;
transition: $trans;

}

// Apply a transform property @mixin transform($trans) {

-webkit-transform: $trans;
-moz-transform: $trans;
-ms-transform: $trans;
-o-transform: $trans;
transform: $trans;

}

// Apply a transition on the transform property @mixin transtrans($trans) {

-webkit-transition: $trans -webkit-transform;
-moz-transition: $trans -moz-transform;
-o-transition: $trans -o-transform;
transition: $trans transform;

}

// Transform-origin wrapper @mixin transform-origin($origin) {

-webkit-transform-origin: $origin;
-moz-transform-origin: $origin;
-ms-transform-origin: $origin;
-o-transform-origin: $origin;
transform-origin: $origin;

}

// Box-sizing wrapper @mixin box-sizing($sizing) {

-webkit-box-sizing: $sizing;
-moz-box-sizing: $sizing;
box-sizing: $sizing;

}

// Apply a vertical gradient with two colors @mixin vertical-gradient($top,$bottom) {

background-color: $top;
background-image: -moz-linear-gradient(top,$top,$bottom);
background-image: -webkit-gradient(linear,left top,left bottom,color-stop(0,$top),color-stop(1,$bottom));
filter: progid:DXImageTransform.Microsoft.gradient(startColorStr='#{$top}',endColorStr='#{$bottom}');
-ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorStr='#{$top}',endColorStr='#{$bottom}')";

}

// Apply a horizontal gradient with two colors @mixin horizontal-gradient($left,$right) {

background-color: $left;
background-image: -moz-linear-gradient(left,$left,$right);
background-image: -webkit-gradient(linear,left top,right top,color-stop(0,$left),color-stop(1,$right));
filter: progid:DXImageTransform.Microsoft.gradient(startColorStr='#{$top}',endColorStr='#{$bottom}',gradientType=1);
-ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorStr='#{$top}',endColorStr='#{$bottom}',gradientType=1)";

}