// Font families
@fallback-font-family: Helvetica, "Hiragino Sans GB", "Hiragino Sans GB W3", Source Han Sans CN Regular, WenQuanYi Micro Hei, "Microsoft YaHei", Arial, sans-serif;
@base-font-family: 'Titillium Web', @fallback-font-family;
@code-font-family: "Roboto Mono",Consolas, monospace, sans-serif;

// Font configuration
@base-font-size:   16px;
@small-font-size:  @base-font-size * 0.875;
@base-line-height: 1.5;

// Spacing
@spacing-unit:     30px;
@gap:              20px;

// Material color scheme
@material-red: #f44336;
@material-pink: #E91E63;
@material-purple: #9c27b0;
@material-deep-purple: #673ab7;
@material-indigo: #3f51b5;
@material-blue: #2196f3;
@material-deep-blue: #3367d6;
@material-teal: #009688;
@material-green: #4caf50;
@material-light-green: #8bc34a;
@material-orange: #ff9800;
@material-deep-orange: #ff5722;
@material-brown: #795548;
@material-blue-grey: #607d8b;
@material-grey: #9e9e9e;
@material-light-grey:#e0e0e0;
@material-yellow: #FFEB3B;

// Social Networks Brand color
@github-color:     #467cc2;
@twitter-color:    #55acee;
@facebook-color:   #3765a3;
@google-color:     #db4437;
@pinterest-color:  #bc1725;
@dribbble-color:   #ed699c;
@weibo-color:      #f8712a;
@tumblr-color:     #35465c;
@instagram-color:  #3f729b;
@linkedin-color:   #0077B5;
@behance-color:    #1769FF;
@tixora-color:     #33475A;

// Colors
@black: #414141;
@white: #ffffff;
@text-color:       @black;
@background-color: #EBECEE;
@brand-color:      @material-teal;
@accent-color:		 @material-blue;
@primary-color:    @material-deep-blue;
@secondary-color:  @material-green;
@grey-color:       #828282;
@qoute-background-color:#f7f7f7;
@code-background-color:fade(@black,6%);
// Responsive limits
@modal-threshold:  680px;
@on-phone:         820px;
@on-laptop:        990px;
@on-desktop:       1200px;

@item-height: 36px;

//container
@container-width:  1200px;
//neader
@header-height:   50px;
@header-logo-font-size: 1.3rem;
@header-switcher-font-size: 1.3rem;
@header-font-size: 1rem;

@banner-height: 300px;

//side
@side-width: 250px;
@tog-width: 200px;
//search
@search-height: 36px;
@search-width: 300px;

//post
@post-max-width: 980px;
//article
@article-title-size-sm: 1.5rem;
@article-title-size: 2rem;
//transition
.enable-trans(@time: 0.24s){
  transition: all @time ease-out;
}
// .set-placeholder({
// 	color: @white;
// 	font-weight: 300;
// })
.set-placeholder(@rules){
  &::-webkit-input-placeholder {@rules();}
  &:-moz-placeholder {@rules();}
	&::-moz-placeholder {@rules();}
	&:-ms-input-placeholder {@rules();}
}