@font-face {
	font-family: 'MINIType_v2_Regular';
	src: url('../fonts/MINIType_v2_Regular.eot');
	src: url('../fonts/MINIType_v2_Regular.eot?#iefix') format('embedded-opentype'),
	url('../fonts/MINIType_v2_Regular.woff') format('woff'),
	url('../fonts/MINIType_v2_Regular.ttf') format('truetype'),
	url('../fonts/MINIType_v2_Regular.svg#MINIType_v2_Regular') format('svg');
	font-weight: normal;
	font-style: normal;
}
@font-face {
	font-family: 'MINIType_v2_Bold';
	src: url('../fonts/MINIType_v2_Bold.eot');
	src: url('../fonts/MINIType_v2_Bold.eot?#iefix') format('embedded-opentype'),
	url('../fonts/MINIType_v2_Bold.woff') format('woff'),
	url('../fonts/MINIType_v2_Bold.ttf') format('truetype'),
	url('../fonts/MINIType_v2_Bold.svg#MINIType_v2_Bold') format('svg');
	font-weight: normal;
	font-style: normal;
}
@font-face {
	font-family: 'MINIType_v2_Headline';
	src: url('../fonts/MINIType_v2_Headline.eot');
	src: url('../fonts/MINIType_v2_Headline.eot?#iefix') format('embedded-opentype'),
	url('../fonts/MINIType_v2_Headline.woff') format('woff'),
	url('../fonts/MINIType_v2_Headline.ttf') format('truetype'),
	url('../fonts/MINIType_v2_Headline.svg#MINIType_v2_Headline') format('svg');
	font-weight: normal;
	font-style: normal;
}

.ui-page:focus {
	outline: none;
}


body {
	background-color: #000000;
	margin-top: 58px;
	color: #ffffff;
	font-family: 'MINIType_v2_Regular', sans-serif;
}
main {
	width: 1000px;
	margin: auto;
}
.cars {
	background: url("../img/cars.jpg") no-repeat center bottom;
	border-bottom: 1px solid #444444;
	border-top: 1px solid #444444;
	margin-top: 10px;
	margin-bottom: 20px;
	padding-bottom: 158px;
}
.cars > div {
    padding-left: 60px;
}
.cars li {
    height: 20px;
    cursor: pointer;
}
ul {
    padding-left: 0;
}
li {
    list-style: none;
}

.logo {
	padding-right: 77px;
}
.orange {
	color: #f7931e;
}
.gray {
	color: #848484;
	font-size: 20px;
}
.orange-frame .active {
	color:  #f7931e;
}
.blue-frame .active {
	color:  #0093d6;
}
.green-frame .active {
	color:  #67755d;
}
.red-frame .active {
	color:  #910c25;
}
h1 {
	font-size: 20px;
	font-family: 'MINIType_v2_Bold', sans-serif;
	margin-top: 13px;
}
h2 {
	font-size: 14px;
	font-family: 'MINIType_v2_Bold', sans-serif;
	border: solid 1px;
	padding: 6px 9px;
}
h3 {
	font-size: 29px;
	font-family: 'MINIType_v2_Headline', sans-serif;
}
h4 {
	font-size: 18px;
	font-family: 'MINIType_v2_Headline', sans-serif;
	margin-top: 0;
}
.ten {
	font-size: 10px;
}

.orange-frame h2 {
	border-color: #f7931e;
	width: 115px;
}
.blue-frame h2 {
	border-color: #0093d6;
	width: 119px;
}
.green-frame h2 {
	border-color: #67755d;
	width: 158px;
}
.red-frame h2 {
	border-color: #910c25;
	width: 125px;
}

.blue-mood h3, .blue-mood h4 {
    color: #0093d6;
}
.blue-mood .orange-button {
    background: #0093d6;
}

.green-mood h3, .green-mood h4 {
    color: #67755d;
}
.green-mood .orange-button {
    background: #67755d;
}

.red-mood h3, .red-mood h4 {
    color: #910c25;
}
.red-mood .orange-button {
    background: #910c25;
}

.new {
	padding-left: 25px;
}
#flip-box section {
	position: relative;
	top: -20px;
}
.car-presentation {
	background-repeat: no-repeat;
	background-position: right top;
	background-size: auto 100%;
	padding-bottom: 128px;
}
.car-presentation span {
	font-size: 24px;
}
.car-presentation > div {
	text-align: right;
	width: 444px;
}
.orange-button {
	background: #f7931e;
	color: #000000;
	width: 137px;
	font-family: 'MINIType_v2_Headline', sans-serif;
	font-size: 18px;
	float: right;
	padding: 9px 24px;
	margin-top: 12px;
}
.features {
	width: 540px;
	float: left;
}
.features li div {
	border-bottom: solid 1px #6f7479;
	width: 306px;
	float: right;
	height: 137px;
	margin-bottom: 13px;
}
#flip-box {
	position: relative;
}
#flip-box > div > div {
	display: none;
}
#flip-box .flipped {
	display: block;
}
.f2 div, .f3 div {
	padding-top: 35px;
}
aside {
	float: right;
	width: 304px;
}
aside table:first-of-type {
	margin-bottom: 260px;
}


footer {
	font-size: 10px;
	color: #cac8c8;
	margin-bottom: 40px;
}
aside table {
	width: 100%;
}


.menu-mobile-conf {
    display: none;
}

#menu-2 {
	position: absolute;
	top: 362px;
	right: 0;
	overflow: hidden;
	width: 304px;
}
#menu-2 img {
	position: absolute;
	left: -60%;
	top: 58%;
	z-index: -1;
}
#menu-2 a {
	display: block;
	color: #ffffff;
	border: solid 5px #444444;
	padding: 12px 9px 9px;
	font-family: MINIType_v2_Headline, sans-serif;
	line-height: 1.1;
	text-decoration: none !important;
	margin: 0 0 12px !important;
	font-size: 17px;
}
#menu-2 a:nth-of-type(2) {
	margin: 0 4px;
}
.prices {
	margin: 15px 0;
}
.prices td {
	padding: 6px 3px 6px 10px;
}
.prices tr:nth-of-type(2n+1) {
	background-color: #333333;
}

.ui-loader {
	display: none;
}


@media (max-width: 991px)  {
	body {
		margin-top: 30px;
	}
	#flip-box section {
		top: 40px;
	}
	main #logo {
		border-bottom: solid 2px #4a4d50;
		padding-bottom: 15px;
		margin: 0 10px;
	}
	.mobile-car h4 {
		font-size: 20px;
		width: 300px;
		margin: auto;
		padding-bottom: 25px;
	}
    .active-mobile {
		color: #ffffff;
		cursor: pointer;
		display: inline-block;
        position: relative;
	}
    .active-mobile span {
        background: url("../img/arrow-down.png") no-repeat right center;
        background-size: auto 34% !important;
        padding-right: 27px;
    }
	.orange-mood .active-mobile span {
		background: url("../img/arrow-down.png") no-repeat right;
	}
	.blue-mood .active-mobile span {
		background: url("../img/arrow-down-blue.png") no-repeat right;
	}
	.red-mood .active-mobile span {
		background: url("../img/arrow-down-red.png") no-repeat right;
	}
	.green-mood .active-mobile span {
		background: url("../img/arrow-down-green.png") no-repeat right;
	}
    .active-mobile ul {
        position: absolute;
        right: 0;
        top: -5px;
        display: none;
        z-index: 1001;
        background: #eaeaea;
        border: 1px solid #c2c3c4;
    }
    .active-mobile li {
        white-space: nowrap;
        border-bottom: 1px solid #d2d3d3;
        color: #454545;
        padding: 9px 38px 7px 8px;
    }
    .active-mobile li.active {
        color: #ef962e;
        position: relative;
    }
    .active-mobile li.active:after {
        display: block;
        width: 20px;
        height: 100%;
        content: '✔';
        position: absolute;
        right: 5px;
        top: 5px;
    }
    .active-mobile li:last-of-type {
        border-bottom: 0;
    }

    .img-responsive {
		max-width: 90%;
		display: block;
		width: 500px;
		margin: auto;

	}
	.arrow-left, .arrow-right {
		cursor: pointer;
		display: inline-block;
		height: 25px;
		position: absolute;
	}
	.arrow-left {
		top: 66px;
		left: 0;
	}
	.arrow-right {
		top: 66px;
		right: 20px;
	}
	.mobile-car {
		position: relative;
		margin: 25px 0 0 20px;
	}
	aside {
		float: none;
	}
	aside .table1 {
		position: absolute;
		top: -203px;
		left: 0;
		border-bottom: solid 1px #4a4d50;
		border-top: solid 1px #4a4d50;
		padding-top: 10px;
	}
	aside .prices {
		position: absolute;
		left: 0;
		bottom: 0;
	}
	section {
		position: relative;
		width: 300px;
		margin: auto;
	}
	footer {
		width: 300px;
	}
	.features {
		max-width: 100%;
	}
	main {
		max-width: 100%;
		/*padding: 0 10px;*/
	}
	.logo {
		padding-right: 0;
		padding-left: 34px;
		padding-bottom: 0;
		width: auto;
	}
	.logo img {
		width: 90%;
		max-width: 114px;
	}
	.new {
		padding-left: 10px;
		padding-right: 0;
	}
	main #logo {
		padding-bottom: 25px;
		margin-left: 10px;
	}
	#flip-box {
	}
	.includes {
		display: block;
		width: 100%;
		text-align: center;
		z-index: 100;
		margin-bottom: 15px;
	}
	.car-presentation {
		background-image: none !important;
		padding-bottom: 0;
	}
	.car-presentation > div {
		width: auto;
	}
	.car-presentation span {
		font-size: 17px;
	}
	.car-presentation {
		position: relative;
		top: -51px;
		left: 0;
	}
	.table1 h4 {
		 font-size: 10px;
	}
	.table1 {
		display: block;
		text-align: center;
	}
	.table1 tr {
		display: block;
		float: left;
		padding-left: 15px;
	}
	.table1 td {
		display: block;
	}
	.orange-mood .table1 tr td:last-of-type {
		color: #f7931e;
	}
	.red-mood .table1 tr td:last-of-type {
		color: #910c25;
	}
	.table1 tr td:first-of-type h4 {
		color: #ffffff;
	}
	.blue-mood .table1 tr td:last-of-type {
		color: #0093d6;
	}
	.green-mood .table1 tr td:last-of-type {
		color: #67755d;
	}
    .menu-mobile-conf {
        width: 304px;
        margin: auto;
        position: relative;
        top: 29px;
        display: block;
    }
	.menu-mobile-conf a {
		display: block;
		color: #ffffff;
		border: solid 5px #444444;
		padding: 12px 9px 9px;
		font-family: MINIType_v2_Headline, sans-serif;
		line-height: 1.1;
		text-decoration: none !important;
		margin: 0 0 16px !important;
		font-size: 17px;
	}
	.hl {
		color: #707070;
		font-family: 'MINIType_v2_Headline', sans-serif;
		font-size: 13px;
		border-bottom: solid 1px #4a4d50;
		padding-bottom: 2px;
	}
	.f1, .f2, .f3, .f4, .f5 {
		position: relative;
	}
	.f1 img, .f7 img {
		position: absolute;
		clip: rect(0, 120px, 115px, 0);
	}
	.f2 img, .f3 img, .f4 img, .f5 img, .f6 img {
		position: absolute;
		clip: rect(0, 167px, 160px, 47px);
		left: -50px;
	}
	.features li div {
		width: 163px;
		/*border na dole */
		border: none;
	}
	.features li {
		border-bottom: 1px solid #6f7479;
		margin-bottom: 18px;
	}
	.features li div h4 {
		font-size: 16px;
	}
	.features li div p {
		font-size: 12px;
	}
	.f1 div, .f2 div, .f3 div {
		padding-top: 0;
	}
	.features .f1 div {
		height: 173px;
		margin-bottom: 0;
	}
	.features .f6 div {
		height: 195px;
	}
	.features .f7 div {
		height: 124px;
	}
	aside .prices {
		position: static;
	}
	footer {
		width: 300px;
		margin: 50px auto 20px;
	}
	.car-presentation div h3, .car-presentation div div, .cars {
		display: none !important;
	}
	#glass {
		background-color: rgba(22,22,22, 0.7);
		position: fixed;
		top: 0;
		left: 0;
		z-index: 1000;
		width: 100%;
		height: 100%;
        display: none;
	}
}