/* 
generowanie klas w zależnoci od języka:
	Arial regular
	For Android: 	Roboto for Latin characters, 
								Noto for Asian characters
*/


@desktop: 1280px; /* niepotrzebne */
@tablet: 980px;
@mobile: 520px;
@base-measure: 15px;

/*GENERAL*/

body {
	.typo-body-xs {};
	//font-family: Arial, Roboto, Helvetica, sans-serif;
	font-family: Arial, Helvetica, sans-serif;
}

h1, h2, h3, h4, h5, h6 {
	line-height: 1;
}

div, ul, ol, li, 
h1, h2, h3, h4, h5, h6, 
.row, p, hr,
.col-lg-1, .col-lg-2, .col-lg-3,  .col-lg-4,  .col-lg-5,  .col-lg-6, 
 .col-lg-7,  .col-lg-8,  .col-lg-9,  .col-lg-10, .col-lg-11, .col-lg-12,
 .col-md-1, .col-md-2, .col-md-3,  .col-md-4,  .col-md-5,  .col-md-6, 
 .col-md-7,  .col-md-8,  .col-md-9,  .col-md-10, .col-md-11, .col-md-12, 
  .col-xs-1, .col-xs-2, .col-xs-3,  .col-xs-4,  .col-xs-5,  .col-xs-6, 
 .col-xs-7,  .col-xs-8,  .col-xs-9,  .col-xs-10, .col-xs-11, .col-xs-12 {
	margin: 0;
}

.container, .container-fluid {
	padding: 0;
}

table {
	border-collapse: collapse;
	border-color: #e6e6e6;
}

//@font-face {
//  font-family: "Roboto";
//  src: url(Roboto.woff);
//}

@font-face {
  font-family: "Noto";
  src: url(Noto.woff);
}

@font-face {
  font-family: "BMW Type Web Bold";
  src: url('../fonts/bmwtypewebbo_all.eot'); /* IE9 Compat Modes */
  src: url('../fonts/bmwtypewebbo_all.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../fonts/bmwtypewebbo_all.woff') format('woff'), /* Pretty Modern Browsers */
       url('../fonts/bmwtypewebbo_all.ttf')  format('truetype'), /* Safari, Android, iOS */
       url('../fonts/bmwtypewebbo_all.svg#svgFontName') format('svg'); 
}

@font-face {
  font-family: "BMW Type Web Light";
  src: url('../fonts/bmwtypewebli_all.eot'); /* IE9 Compat Modes */
  src: url('../fonts/bmwtypewebli_all.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../fonts/bmwtypewebli_all.woff') format('woff'), /* Pretty Modern Browsers */
       url('../fonts/bmwtypewebli_all.ttf')  format('truetype'), /* Safari, Android, iOS */
       url('../fonts/bmwtypewebli_all.svg#svgFontName') format('svg'); /* Legacy iOS */
}

.font-bmw-type-web-bold {
	font-family: "BMW Type Web Bold"; 
}

.font-bmw-type-web-light {
	font-family: "BMW Type Web Light"; 
}

//.font-roboto {
//	font-family: "Roboto";
//}

.font-noto {
	font-family: "Noto"; 
}



/* ------------ margin LEFT ------------ */

.margin-left- {
		&0 {margin-left: @base-measure * 0;}	
		&1_3 {margin-left: @base-measure / 3;}	
		&1_2 {margin-left: @base-measure / 3 * 2;}	
		&1 {margin-left: @base-measure * 1;}
		&2 {margin-left: @base-measure * 2;}
		&3 {margin-left: @base-measure * 3;}
		&4 {margin-left: @base-measure * 4;}
		&5 {margin-left: @base-measure * 5;}
		&6 {margin-left: @base-measure * 6;}
}

@media (max-width: @tablet) {
	.margin-left- {
		&1_3 {margin-left: @base-measure / 3;}	
		&1_2 {margin-left: @base-measure / 3 * 2;}	
		&1 {margin-left: @base-measure * 1;}
		&2 {margin-left: @base-measure * 2;}
		&3 {margin-left: @base-measure * 3;}
		&4 {margin-left: @base-measure * 4;}
		&5 {margin-left: @base-measure * 5;}
		&6 {margin-left: @base-measure * 6;}
	}}

@media (max-width: @mobile) {
	.margin-left- {
		&1_3 {margin-left: @base-measure / 3;}	
		&1_2 {margin-left: @base-measure / 3 * 2;}	
		&1 {margin-left: @base-measure * 1;}
		&2 {margin-left: @base-measure * 2;}
		&3 {margin-left: @base-measure * 3;}
		&4 {margin-left: @base-measure * 4;}
		&5 {margin-left: @base-measure * 5;}
		&6 {margin-left: @base-measure * 6;}
	}}


/* ------------ margin BOTTOM ------------ */

.margin-bottom- {
		&1_3 {margin-bottom: @base-measure / 3;}	
		&1_2 {margin-bottom: @base-measure / 3 * 2;}	
		&1 {margin-bottom: @base-measure * 1;}
		&2 {margin-bottom: @base-measure * 2;}
		&3 {margin-bottom: @base-measure * 3;}
		&4 {margin-bottom: @base-measure * 4;}
		&5 {margin-bottom: @base-measure * 5;}
		&6 {margin-bottom: @base-measure * 6;}
}

/* ------------ margin TOP ------------ */

.margin-top- {
		&1_3 {margin-top: @base-measure / 3;}	
		&1_2 {margin-top: @base-measure / 3 * 2;}	
		&1 {margin-top: @base-measure * 1;}
		&2 {margin-top: @base-measure * 2;}
		&3 {margin-top: @base-measure * 3;}
		&4 {margin-top: @base-measure * 4;}
		&5 {margin-top: @base-measure * 5;}
		&6 {margin-top: @base-measure * 6;}
}


@media (max-width: @tablet) {
	.margin-top- {
		&1_3 {margin-top: @base-measure / 3;}	
		&1_2 {margin-top: @base-measure / 3 * 2;}	
		&1 {margin-top: @base-measure * 1;}
		&2 {margin-top: @base-measure * 2;}
		&3 {margin-top: @base-measure * 3;}
		&4 {margin-top: @base-measure * 4;}
		&5 {margin-top: @base-measure * 5;}
		&6 {margin-top: @base-measure * 6;}
	}}

@media (max-width: @mobile) {
	.margin-top- {
		&1_3 {margin-top: @base-measure / 3;}	
		&1_2 {margin-top: @base-measure / 3 * 2;}	
		&1 {margin-top: @base-measure * 1;}
		&2 {margin-top: @base-measure * 2;}
		&3 {margin-top: @base-measure * 3;}
		&4 {margin-top: @base-measure * 4;}
		&5 {margin-top: @base-measure * 5;}
		&6 {margin-top: @base-measure * 6;}
	}}

.margin-right-0 {margin-right: @base-measure * 0;}	


/* ------------ PADDINGS ------------ */

.padding-left- {
		&1_3 {padding-left: @base-measure / 3;}	
		&1_2 {padding-left: @base-measure / 3 * 2;}	
		&1 {padding-left: @base-measure * 1;}
		&2 {padding-left: @base-measure * 2;}
		&3 {padding-left: @base-measure * 3;}
		&4 {padding-left: @base-measure * 4;}
		&5 {padding-left: @base-measure * 5;}
		&6 {padding-left: @base-measure * 6;}
}

.padding-right- {
		&1_3 {padding-right: @base-measure / 3;}	
		&1_2 {padding-right: @base-measure / 3 * 2;}	
		&1 {padding-right: @base-measure * 1;}
		&2 {padding-right: @base-measure * 2;}
		&3 {padding-right: @base-measure * 3;}
		&4 {padding-right: @base-measure * 4;}
		&5 {padding-right: @base-measure * 5;}
		&6 {padding-right: @base-measure * 6;}
}


/* ------------ COLOURS ------------ */

body {color: #262626; /*anthracite*/}

.white {color: #fff;}
.grey- {
	&1 {color: #e6e6e6;}
	&2 {color: #666;}
	&3 {color: #bbbbbb;}
	&4 {color: #f2f2f2;}
	&5 {color: #4d4d4d;}
	&6 {color: #8e8e8e;}
}

.blue- {	
	&1 {color: #1c69d4;}
	&2 {color: #0653B6;}
}

.orange {color: #ffad1f;}
.red {color: #d20000;}
.green {color: #3db014;}

/* bg-COLOURS */

body {background-color: #fff;}

.bg-grey- {	
	&1 {background-color: #e6e6e6;}
	&2 {background-color: #666;}
	&3 {background-color: #bbbbbb;}
	&4 {background-color: #f2f2f2;}
	&5 {background-color: #4d4d4d;}
	&6 {background-color: #8e8e8e;}
}

.bg-blue- {	
	&1 {background-color: #1c69d4;}
	&2 {background-color: #0653B6;}
}

.bg-orange {background-color: #ffad1f;}
.bg-red {background-color: #d20000;}
.bg-green {background-color: #3db014;}


/* HEADLINES – UPPERCASE LETTERS */

.typo-headlines- {
	&xxxl-uppercase {
		font-size: 96px;
		line-height: 96px;
		letter-spacing: -4.32px; 
		text-transform: uppercase;
		.font-bmw-type-web-bold;

	}

	&xxl-uppercase {
		font-size: 48px;
		line-height: 48px;
		letter-spacing: -2.16px;
		text-transform: uppercase;
		.font-bmw-type-web-bold;
	}

	&xl-uppercase {
		font-size: 35px;
		line-height: 35px;
		letter-spacing: -1.575px; 
		text-transform: uppercase;
		.font-bmw-type-web-bold;
	}

		&l-uppercase {
		font-size: 25px;
		line-height: 25px;
		letter-spacing: -1.13px; 
		text-transform: uppercase;
		.font-bmw-type-web-bold;
	}

		&m-uppercase {
		font-size: 18px;
		line-height: 18px;
		letter-spacing: -0.81px; 
		text-transform: uppercase;
		.font-bmw-type-web-bold;
	}

		&s-uppercase {
		font-size: 15px;
		line-height: 15px;
		letter-spacing: -0.68px; 
		text-transform: uppercase;
		.font-bmw-type-web-bold;
	}
}


@media (max-width: @tablet) {
	.typo-headlines- {
		&xxxl-uppercase {
			font-size: 56px;
			line-height: 56px;
			letter-spacing: -2.52px;  
			text-transform: uppercase;
		}

		&xxl-uppercase {
			font-size: 35px;
			line-height: 35px;
			letter-spacing: -1.575px; 
			text-transform: uppercase;
		}

		&xl-uppercase {
			font-size: 25px;
			line-height: 25px;
			letter-spacing: -1.13px; 
			text-transform: uppercase;
		}

			&l-uppercase {
			font-size: 18px;
			line-height: 18px;
			letter-spacing: -0.81px; 
			text-transform: uppercase;
		}

			&m-uppercase {
			font-size: 15px;
			line-height: 15px;
			letter-spacing: -0.68px; 
			text-transform: uppercase;
		}

			&s-uppercase {
			font-size: 15px;
			line-height: 15px;
			letter-spacing: -0.68px; 
		text-transform: uppercase;
		}
	}
}

@media (max-width: @mobile) {
	.typo-headlines- {
		&xxxl-uppercase {
			font-size: 56px;
			line-height: 56px;
			letter-spacing: -2.52px; 
			text-transform: uppercase;
		}

		&xxl-uppercase {
			font-size: 35px;
			line-height: 35px;
			letter-spacing: -1.575px;
			text-transform: uppercase;
		}

		&xl-uppercase {
			font-size: 25px;
			line-height: 25px;
			letter-spacing: -1.13px;
			text-transform: uppercase;
		}

			&l-uppercase {
			font-size: 18px;
			line-height: 18px;
			letter-spacing: -0.81px;
			text-transform: uppercase;
		}

			&m-uppercase {
			font-size: 15px;
			line-height: 15px;
			letter-spacing: -0.68px;
			text-transform: uppercase;
		}

			&s-uppercase {
			font-size: 15px;
			line-height: 15px;
			letter-spacing: -0.68px;
			text-transform: uppercase;
		}
	}
}

/* TYPOGRAPHY. HEADLINES – MIXED */

.typo-headlines- {
	&xxxl-mixed {
		font-size: 96px;
		line-height: 101px;
		letter-spacing: 0px; 
		.font-bmw-type-web-bold;
	}

	&xxl-mixed {
		font-size: 48px;
		line-height: 51px;
		letter-spacing: 0px; 
		.font-bmw-type-web-bold;
	}
	&xl-mixed {
		font-size: 48px;
		line-height: 51px;
		letter-spacing: 0px; 
		.font-bmw-type-web-bold;
	}

	&l-mixed {
		font-size: 25px;
		line-height: 31px;
		letter-spacing: 0px; 
		.font-bmw-type-web-bold;
	}

	&m-mixed {
		font-size: 18px;
		line-height: 20px;
		letter-spacing: 0px; 
		.font-bmw-type-web-bold;
	}

	&s-mixed {
		font-size: 14px;
		line-height: 17px;
		letter-spacing: 0px; 
		.font-bmw-type-web-bold;
	}
}

@media (max-width: @tablet) {
	.typo-headlines- {
		&xxxl-mixed {
			font-size: 56px;
			line-height: 61px;
			letter-spacing: 0px; 
		}

		&xxl-mixed {
			font-size: 35px;
			line-height: 39px;
			letter-spacing: 0px; 
		}

		&xl-mixed {
			font-size: 25px;
			line-height: 31px;
			letter-spacing: 0px; 
		}

		&l-mixed {
			font-size: 18px;
			line-height: 20px;
			letter-spacing: 0px; 
		}

		&m-mixed {
			font-size: 15px;
			line-height: 18px;
			letter-spacing: 0px; 
		}

		&s-mixed {
			font-size: 15px;
			line-height: 18px;
			letter-spacing: 0px; 
		}
	}
}

@media (max-width: @mobile) {
	.typo-headlines- {
		&xxxl-mixed {
			font-size: 35px;
			line-height: 39px;
			letter-spacing: 0px; 
		}

		&xxl-mixed {
			font-size: 25px;
			line-height: 31px;
			letter-spacing: 0px; 
		}

		&xl-mixed {
			font-size: 25px;
			line-height: 31px;
			letter-spacing: 0px; 
		}

		&l-mixed {
			font-size: 18px;
			line-height: 20px;
			letter-spacing: 0px; 
		}

		&m-mixed {
			font-size: 18px;
			line-height: 20px;
			letter-spacing: 0px; 
		}

		&s-mixed {
			font-size: 15px;
			line-height: 18px;
			letter-spacing: 0px; 
		}
	}
}

/* TYPOGRAPHY. BODY COPY AND LINKS. */

//.android {
//	.font-roboto;
//	}
//
//.asian {
//	.font-noto;
//}

.typo-body- {
	&xs {
		font-size: 14px;
		line-height: 17px;
		letter-spacing: 0px; 
		font-family: Arial;
}

		&xxs {
		font-size: 12px;
		line-height: 14px;
		letter-spacing: 0px; 
		font-family: Arial;

		//&.android {
		//	.font-roboto;
		//}

		&.asian {
			.font-noto;
		}
	}

		&s-link {
		font-size: 14px;
		line-height: 17px;
		letter-spacing: 0px; 
		.font-bmw-type-web-bold;
	}

		&s-button {
		font-size: 14px;
		line-height: 17px;
		letter-spacing: 0px; 
		.font-bmw-type-web-bold;
	}
}

@media (max-width: @tablet) {
	.typo-body- {
		&xs {
			font-size: 15px;
			line-height: 20px;
			letter-spacing: 0px; 
			font-family: Arial;

			//&.android {
			//	.font-roboto;
			//}

			&.asian {
				.font-noto;
			}
		}

			&xxs {
			font-size: 12px;
			line-height: 14px;
			letter-spacing: 0px; 
			font-family: Arial;

			//&.android {
			//	.font-roboto;
			//}

			&.asian {
				.font-noto;
			}
		}

			&s-link {
			font-size: 15px;
			line-height: 18px;
			letter-spacing: 0px; 
			.font-bmw-type-web-bold;
		}

			&s-button {
			font-size: 15px;
			line-height: 18px;
			letter-spacing: 0px; 
			.font-bmw-type-web-bold;
		}
	}
}

@media (max-width: @mobile) {
	.typo-body- {
		&xs {
			font-size: 15px;
			line-height: 20px;
			letter-spacing: 0px; 
			font-family: Arial;

			//&.android {
			//	.font-roboto;
			//}

			&.asian {
				.font-noto;
			}
		}

			&xxs {
			font-size: 12px;
			line-height: 14px;
			letter-spacing: 0px; 
			font-family: Arial;

			//&.android {
			//	.font-roboto;
			//}

			&.asian {
				.font-noto;
			}
		}

			&s-link {
			font-size: 15px;
			line-height: 18px;
			letter-spacing: 0px; 
			.font-bmw-type-web-bold;
		}

			&s-button {
			font-size: 15px;
			line-height: 18px;
			letter-spacing: 0px; 
			.font-bmw-type-web-bold;
		}
	}
}

/*TYPOGRAPHY. BMW i HEADLINES – UPPERCASE LETTERS.*/

.typo-bmwi-headlines- {
	&xxxl-uppercase {
		font-size: 96px;
		line-height: 96px;
		letter-spacing: 1.44px; 
		text-transform: uppercase;
		.font-bmw-type-web-light;
	}

	&xxl-uppercase {
		font-size: 48px;
		line-height: 48px;
		letter-spacing: 0.72px;
		text-transform: uppercase;
		.font-bmw-type-web-light;
	}

	&xl-uppercase {
		font-size: 35px;
		line-height: 35px;
		letter-spacing: 0.525px;
		text-transform: uppercase;
		.font-bmw-type-web-light;
	}

		&l-uppercase {
		font-size: 25px;
		line-height: 25px;
		letter-spacing: 0.375px;
		text-transform: uppercase;
		.font-bmw-type-web-light;
	}
}


@media (max-width: @tablet) {
	.typo-bmwi-headlines- {
		&xxxl-uppercase {
			font-size: 56px;
			line-height: 56px;
			letter-spacing: 0.84px; 
			text-transform: uppercase;
		}

		&xxl-uppercase {
			font-size: 35px;
			line-height: 35px;
			letter-spacing: 0.525px;
			text-transform: uppercase;
		}

		&xl-uppercase {
			font-size: 25px;
			line-height: 25px;
			letter-spacing: 0.375px;
			text-transform: uppercase;
		}

			&l-uppercase {
			font-size: 25px;
			line-height: 25px;
			letter-spacing: 0.375px;
			text-transform: uppercase;
		}

			&m-uppercase {
			font-size: 15px;
			line-height: 15px;
			letter-spacing: -0.68px;
			text-transform: uppercase;
		}

			&s-uppercase {
			font-size: 15px;
			line-height: 15px;
			letter-spacing: -0.68px;
			text-transform: uppercase;
		}
	}
}

@media (max-width: @mobile) {
	.typo-bmwi-headlines- {
		&xxxl-uppercase {
			font-size: 56px;
			line-height: 56px;
			letter-spacing: 0.84px; 
			text-transform: uppercase;
		}

		&xxl-uppercase {
			font-size: 35px;
			line-height: 35px;
			letter-spacing: 0.525px;
			text-transform: uppercase;
		}

		&xl-uppercase {
			font-size: 25px;
			line-height: 25px;
			letter-spacing: 0.375px;
			text-transform: uppercase;
		}

			&l-uppercase {
			font-size: 25px;
			line-height: 25px;
			letter-spacing: 0.375px;
			text-transform: uppercase;
		}

			&m-uppercase {
			font-size: 15px;
			line-height: 15px;
			letter-spacing: -0.68px;
			text-transform: uppercase;
		}

			&s-uppercase {
			font-size: 15px;
			line-height: 15px;
			letter-spacing: -0.68px;
			text-transform: uppercase;
		}
	}
}


/*TYPOGRAPHY. BMW i HEADLINES – MIXED CASE.*/

.typo-bmwi-headlines- {
	&xxxl-mixed {
		font-size: 96px;
		line-height: 101px;
		letter-spacing: 1.44px; 
		.font-bmw-type-web-light;
	}

	&xxl-mixed {
		font-size: 48px;
		line-height: 51px;
		letter-spacing: 0.72px; 
		.font-bmw-type-web-light;
	}
	&xl-mixed {
		font-size: 35px;
		line-height: 39px;
		letter-spacing: 0.525px; 
		.font-bmw-type-web-light;
	}

	&l-mixed {
		font-size: 25px;
		line-height: 31px;
		letter-spacing: 0.375px; 
		.font-bmw-type-web-light;
	}

	&m-mixed {
		font-size: 14px;
		line-height: 17px;
		letter-spacing: 0px; 
		.font-bmw-type-web-bold;
	}

	&s-mixed {
		font-size: 14px;
		line-height: 17px;
		letter-spacing: 0px; 
		.font-bmw-type-web-bold;
	}
}

@media (max-width: @tablet) {
	.typo-headlines- {
		&xxxl-mixed {
			font-size: 56px;
			line-height: 61px;
			letter-spacing: 0.84px; 
		}

		&xxl-mixed {
			font-size: 35px;
			line-height: 39px;
			letter-spacing: 0.525px; 
		}

		&xl-mixed {
			font-size: 25px;
			line-height: 31px;
			letter-spacing: 0.375px; 
		}

		&l-mixed {
			font-size: 15px;
			line-height: 18px;
			letter-spacing: 0px; 
			.font-bmw-type-web-bold;
		}

		&m-mixed {
			font-size: 15px;
			line-height: 18px;
			letter-spacing: 0px; 
		}

		&s-mixed {
			font-size: 15px;
			line-height: 18px;
			letter-spacing: 0px; 
		}
	}
}

@media (max-width: @mobile) {
	.typo-headlines- {
		&xxxl-mixed {
			font-size: 35px;
			line-height: 39px;
			letter-spacing: 0.525px; 
		}

		&xxl-mixed {
			font-size: 25px;
			line-height: 31px;
			letter-spacing: 0.375px; 
		}

		&xl-mixed {
			font-size: 25px;
			line-height: 31px;
			letter-spacing: 0.375px; 
		}

		&l-mixed {
			font-size: 15px;
			line-height: 18px;
			letter-spacing: 0px; 
			.font-bmw-type-web-bold;
		}

		&m-mixed {
			font-size: 15px;
			line-height: 18px;
			letter-spacing: 0px; 
		}

		&s-mixed {
			font-size: 15px;
			line-height: 18px;
			letter-spacing: 0px; 
		}
	}
}


/* TYPOGRAPHY. BMW i BODY COPY. */

.typo-bmwi-body- {
	&xs {
		font-size: 14px;
		line-height: 17px;
		letter-spacing: 0px; 
		font-family: Arial;
	}

		&xxs {
		font-size: 12px;
		line-height: 14px;
		letter-spacing: 0px; 
		font-family: Arial;
	}
}

@media (max-width: @tablet) {
	.typo-bmwi-body- {
		&xs {
			font-size: 15px;
			line-height: 20px;
			letter-spacing: 0px; 
			font-family: Arial;
		}

			&xxs {
			font-size: 12px;
			line-height: 14px;
			letter-spacing: 0px; 
			font-family: Arial;
		}
	}
}

@media (max-width: @mobile) {
	.typo-bmwi-body- {
		&xs {
			font-size: 15px;
			line-height: 20px;
			letter-spacing: 0px; 
			font-family: Arial;
		}

		&xxs {
			font-size: 12px;
			line-height: 14px;
			letter-spacing: 0px; 
			font-family: Arial;
		}
	}
}

//.android {
//	.font-roboto;
//	}

//.asian {
//	.font-noto;
//}

@import "custom.less";
@import "custom-marcin.less";
@import "custom-marcin1.less";
@import "custom-marek1.less";
@import "custom-marek.less";
@import "custom-marcin2.less";
@import "custom-darek.less";