File: /home/i/e/s/iestorre/www/templates/it_zen/assets/less/vars.less
/***********************************************************************************************/
/* LESS VARIABLES */
/***********************************************************************************************/
@heading_font: "Open Sans", Georgia, "Times New Roman", Times, serif;
@OpenSans: "Open Sans", "Helvetica Neue", Helvetica, Arial, sans-serif;
@heading_color: #333;
@heading_shadow: none;
@text_font: "Helvetica Neue", Helvetica, Arial, sans-serif;
@text_color: #444;
@bg_body: #ffffff;
@bg_light: #F1F2EB;
@bg_primary: #81ac00;
@bg_secondary: #5b7a00;
//@grayLight: darken(@bg_body,20%);
@link_color: #0066a2;
/* responsive variables */
@desktop_xl: ~"only screen and (min-width: 1200px)";
@desktop: ~"only screen and (max-width: 1200px)";
@tablet: ~"only screen and (max-width: 979px)";
@phone: ~"only screen and (max-width: 767px)";
/***********************************************************************************************/
/* LESS MIXINS */
/***********************************************************************************************/
.transition (@property: all, @duration: .2s) {
-webkit-transition: @property @duration ease-out;
-moz-transition: @property @duration ease-out;
-o-transition: @property @duration ease-out;
transition: @property @duration ease-out;
}
.hexBackgroundToRGBA(@color,@alpha){
@myred:red(@color);
@mygreen:green(@color);
@myblue:blue(@color);
background-color: @color;
background-color: rgba(@myred,@mygreen,@myblue,@alpha);
}
.hexColorToRGBA(@color,@alpha){
@myred:red(@color);
@mygreen:green(@color);
@myblue:blue(@color);
color: @color;
color: rgba(@myred,@mygreen,@myblue,@alpha);
}
// Gradients
#gradient {
.horizontal(@startColor: #555, @endColor: #333) {
background: -moz-linear-gradient(left, @startColor, @endColor); // FF 3.6+
background: -webkit-gradient(linear, 0 0, 100% 0, from(@startColor), to(@endColor)); // Safari 4+, Chrome 2+
background: -webkit-linear-gradient(left, @startColor, @endColor); // Safari 5.1+, Chrome 10+
background: -o-linear-gradient(left, @startColor, @endColor); // Opera 11.10
background: linear-gradient(to right, @startColor, @endColor); // Standard, IE10
background-repeat: repeat-x;
filter: e(%("progid:DXImageTransform.Microsoft.gradient(startColorstr='%d', endColorstr='%d', GradientType=1)",argb(@startColor),argb(@endColor))); // IE9 and down
}
.vertical(@startColor: #555, @endColor: #333) {
background: -moz-linear-gradient(top, @startColor, @endColor); // FF 3.6+
background: -webkit-gradient(linear, 0 0, 0 100%, from(@startColor), to(@endColor)); // Safari 4+, Chrome 2+
background: -webkit-linear-gradient(top, @startColor, @endColor); // Safari 5.1+, Chrome 10+
background: -o-linear-gradient(top, @startColor, @endColor); // Opera 11.10
background: linear-gradient(to bottom, @startColor, @endColor); // Standard, IE10
background-repeat: repeat-x;
filter: e(%("progid:DXImageTransform.Microsoft.gradient(startColorstr='%d', endColorstr='%d', GradientType=0)",argb(@startColor),argb(@endColor))); // IE9 and down
}
.radial(@startColor: #555, @endColor: #333){
background: -webkit-radial-gradient(@startColor, @endColor); /* Safari 5.1 to 6.0 */
background: -o-radial-gradient(@startColor, @endColor); /* For Opera 11.6 to 12.0 */
background: -moz-radial-gradient(@startColor, @endColor); /* For Firefox 3.6 to 15 */
background: radial-gradient(@startColor, @endColor); /* Standard syntax */
}
}