/*  reset.css begin */
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, img, ins, kbd, q, s, samp, small, strike, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video {
  margin:0;
  padding:0;
  border:0;
  font-size:100%;
  font:inherit;
  vertical-align:baseline;
}

article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {
  display:block;
}

body 
{
	line-height:1;
}

ul, ol
{
	list-style: none;
}

blockquote, q {
  quotes:none;
}

blockquote:before, blockquote:after, q:before, q:after {
  content:'';
  content:none;
}

table {
  border-collapse:collapse;
  border-spacing:0;
}
.clearfix
{
	float: none !important;
	clear: both;
}
*
{
	-webkit-box-sizing: border-box; /* iOS <= 4 i Android <= 2.2 */
	-moz-box-sizing: border-box; /* Firefox */
	box-sizing: border-box; /* Chrome, Opera, Safari 5+ i IE 8+ */
	outline: none;
}

/*  reset.css end */

@import '../js/retina.less';

@rwd1: 780px;
@rwd2: 1010px;

.media-query(@rules, @min-width, @max-width: 99999px)
{
	@media all and (min-width : @min-width) and (max-width : @max-width) { @rules(); }
}

.transform (@transform) {
	-webkit-transform: @transform;  
	-moz-transform:    @transform;
	-ms-transform:     @transform; 
	-o-transform:      @transform;  
}

.transition (@transition) {
	-webkit-transition: @transition;  
	-moz-transition:    @transition;
	-ms-transition:     @transition; 
	-o-transition:      @transition;  
}

.border-radius (@border-radius) {
	-webkit-border-radius: @border-radius;  
	-moz-border-radius:    @border-radius;
	-ms-border-radius:     @border-radius; 
	-o-border-radius:      @border-radius; 
	border-radius:		   @border-radius;
}

.box-shadow (@box-shadow) {
	-webkit-box-shadow:		@box-shadow;  
	-moz-box-shadow:		@box-shadow;
	box-shadow:				@box-shadow;  
}

.rotate (@rotate) {
	-ms-transform: rotate(@rotate);
    -webkit-transform: rotate(@rotate);
    transform: rotate(@rotate);
}

.apperance (@apperance) {
	-webkit-appearance: @apperance;
	-moz-appearance:    @apperance;
	appearance:         @apperance;
}

body
{
	margin: 0;
	padding: 0;
	text-align: center;
}

.wrapper-middle
{
	margin: 0 auto;
	text-align: left;
	width: 100%;
	max-width: 1125px;
}

/*
* COLORS
*/

@black:		#000;
@white:		#fff;
@red:		#ff0000;
@green:		#00ff00;
@blue:		#0000ff;

/*
*  MAIN GRID
*
*   0	 <	  small	  <	  @rwd1
*
* @rwd1	 <	 medium	  <   @rwd2
*
* @rwd2	 <	 large	  <  infinity
*
* number - columns count
*
*/

.row
{	
	> .col
	{
		float: left;

		&.small-1 , &.medium-1 , &.large-1
		{
			width: 8.33333%;
		}
		&.small-2 , &.medium-2 , &.large-2
		{
			width: 16.66666%;
		}
		&.small-3 , &.medium-3 , &.large-3
		{
			width: 25%;
		}
		&.small-4 , &.medium-4 , &.large-4
		{
			width: 33.33333%;
		}
		&.small-5 , &.medium-5 , &.large-5
		{
			width: 41.66666%;
		}
		&.small-6 , &.medium-6, &.large-6
		{
			width: 50%;
		}
		&.small-7 , &.medium-7 , &.large-7
		{
			width: 58.33333%;
		}
		&.small-8 , &.medium-8 , &.large-8
		{
			width: 66.66666%;
		}
		&.small-9 , &.medium-9 , &.large-9
		{
			width: 75%;
		}
		&.small-10 , &.medium-10 , &.large-10
		{
			width: 83.33333%;
		}
		&.small-11 , &.medium-11 , &.large-11
		{
			width: 91.66666%;
		}
		&.small-12 , &.medium-12 , &.large-12
		{
			width: 100%;
		}
		.media-query({
			&.medium-1 , &.large-1
			{
				width: 8.33333%;
			}
			&.medium-2 , &.large-2
			{
				width: 16.66666%;
			}
			&.medium-3 , &.large-3
			{
				width: 25%;
			}
			&.medium-4 , &.large-4
			{
				width: 33.33333%;
			}
			&.medium-5 , &.large-5
			{
				width: 41.66666%;
			}
			&.medium-6 , &.large-6
			{
				width: 50%;
			}
			&.medium-7 , &.large-7
			{
				width: 58.33333%;
			}
			&.medium-8 , &.large-8
			{
				width: 66.66666%;
			}
			&.medium-9 , &.large-9
			{
				width: 75%;
			}
			&.medium-10 , &.large-10
			{
				width: 83.33333%;
			}
			&.medium-11 , &.large-11
			{
				width: 91.66666%;
			}
			&.medium-12 , &.large-12
			{
				width: 100%;
			}
		},@rwd1);
		
		.media-query({
			&.large-1
			{
				width: 8.33333%;
			}
			&.large-2
			{
				width: 16.66666%;
			}
			&.large-3
			{
				width: 25%;
			}
			&.large-4
			{
				width: 33.33333%;
			}
			&.large-5
			{
				width: 41.66666%;
			}
			&.large-6
			{
				width: 50%;
			}
			&.large-7
			{
				width: 58.33333%;
			}
			&.large-8
			{
				width: 66.66666%;
			}
			&.large-9
			{
				width: 75%;
			}
			&.large-10
			{
				width: 83.33333%;
			}
			&.large-11
			{
				width: 91.66666%;
			}
			&.large-12
			{
				width: 100%;
			}
		},@rwd2);
	}
	//clearfix
	&:after
	{
		float: none !important;
		clear: both;
		display: block;
		content: '';
	}
}