body, html {
	margin: 0;
	padding: 0;
}

body {
	background-color: #d6dbdf;
	font-family: Roboto, sans-serif;
	font-size: 13px;
}

.container {
	width: 1260px;
	margin: 0 auto;
	background-color: #ffffff;
}

.page {
	padding-top: 54px;
}

.row {
	overflow: hidden;
	clear: both;
}

header {
	background: #ffffff;
	width: 100%;
	position: fixed;
	height: 54px;
	z-index: 9999;
}

header img {
	line-height: 0.1;
}

.header-logo {
	display: block;
	height: 54px;
	float: left;
	margin: 0 0 0 160px;
}

.header-logo-bg {
	background: url('../img/head-logo.png') no-repeat scroll center center;
	height: 54px;
	width: 140px;
	display: block;
	margin: 10px 0 0 0;
}

.header-nav {
	display: block;
	height: 54px;
	float: left;
	margin: 0 0 0 100px;
}

#top-menu {
	margin: 0;
	padding: 0;
	list-style: none;
}

li.menu-item {
	list-style: none;
	display: inline-block;
	border-bottom: 2px solid #ffffff;
	margin-right: 18px;
}

a.top-menu {
	display: block;
	text-decoration: none;
	color: #33363c;
	text-transform: uppercase;
	font-weight: 600;
	height: 47px;
	line-height: 52px;
	padding: 5px 0 0 0;
}

li.menu-item.active,
li.menu-item:hover {
	border-bottom: 2px solid #d92027;
}

li.menu-item.active a,
li.menu-item:hover a {
	color: #d92027;
}

.banner {
	background: url('../img/red-bg.jpg') no-repeat scroll center top;
	color: #fff;
	padding: 0;
	height: 600px;
}

.small-banner {
	background: url('../img/red-bg.jpg') no-repeat scroll center top;
	height: 180px;
}

.guidelines {
	margin: 0;
	padding: 182px 0 0 394px;
}

.guidelines h1 {
	font-weight: 100;
	font-size: 72px;
	margin: 0 0 27px 0;
	line-height: 1;
}

.guidelines p {
	font-size: 13px;
	margin: 0 0 0 6px;
}

.guide-column-head {
	height: 42px;
	margin-top: -42px;
	padding: 0 60px 0 160px;
}

.white {
	height: 42px;
	background-color: #ffffff;
}

.guide-container {
	padding: 0 60px 0 220px;
}

.guide-container h4 {
	font-size: 48px;
	font-weight: 300;
	color: #0c1013;
	margin: 2px 0 15px 0;
	line-height: 36px;
}

.guide-container h5 {
	font-size: 32px;
	font-weight: 300;
	color: #33363c;
	margin: 0 0 -1px -1px;
	line-height: 1;
}

.guide-block-header {
	margin-left: 19px !important;
	margin-bottom: 9px !important;
}

.guide-container p {
	color: #33363c;
	line-height: 18px;
}

.guide-blocks {
	clear: both;
	overflow: hidden;
}

.sl1 {
	margin-bottom: 26px;
}

.sl2 {
	margin-bottom: 21px;
}

.sl3 {
	margin-bottom: 41px;
}

.sl4 {
	margin-bottom: 25px;
}

.sl5 {
	margin-bottom: 41px;
}

.guide-block-tagline {
	float: left;
	padding: 0 0 0 20px;
}
	.guide-block-tagline h6 {
		font-size: 30px;
		line-height: 42px;
		margin: 0;
		font-weight: normal;

	}
	.guide-block-tagline h6 + h6 {
		margin-top: 24px;
	}
		.guide-block-tagline h6 span {
			background-color: #d6dbdf;
			padding: 6px 12px;
			color: #0c1013;
		}

.guide-block-left {
	float: left;
	width: 300px;
	padding: 0 0 0 20px;
}

.guide-block-right {
	float: right;
	width: 660px;
}

.logo-dark-big {
	background: url('../img/leonru-logo2.png') no-repeat scroll center top;
	width: 380px;
	height: 95px;
	margin: 57px 0 0 180px;
}

.guide-logo-light {
	text-align: center;
	width: 260px;
	float: left;
	margin: 3px 0 0 79px;
}

.guide-logo-light-bg {
	width: 258px;
	height: 136px;
	border: 1px solid #0c1013;
	background: #0c1013 url('../img/logo-light.png') no-repeat scroll center center;
	margin: 0 0 5px 0;
}

.guide-logo-dark {
	text-align: center;
	width: 260px;
	float: right;
	margin: 4px 0 0 0;
}

.guide-logo-dark-bg {
	width: 258px;
	height: 136px;
	border: 1px solid #0c1013;
	background: #ffffff url('../img/logo-dark.png') no-repeat scroll center center;
	margin: 0 0 5px 0;
}

.guide-block-left a,
.guide-logo-light a,
.guide-logo-dark a {
	color: #0c1013;
	text-decoration: underline;
	outline: none;
}

.guide-logo-layout {
	width: 579px;
	height: 175px;
	background: #ffffff url('../img/logo-layout.png') no-repeat scroll center center;
	margin: 6px 0 0 81px;
}

.guide-logo-scale {
	margin: 4px 0 0 100px;
}

.guide-logo-scale-img {
	width: 560px;
	height: 60px;
	background: #ffffff url('../img/logo-scale.png') no-repeat scroll center center;
}

.guide-logo-scale a {
	color: #0c1013;
	text-decoration: underline;
	outline: none;
	vertical-align: middle;
	display: inline-block;
	margin: 35px 0 0 0;
	line-height: 17px;
}

.guide-logo-scale span {
	width: 16px;
	height: 16px;
	background: url('../img/favicon.png') no-repeat scroll center center;
	display: inline-block;
	vertical-align: middle;
	margin-right: 6px;
}

.guide-sample1 {
	background: url('../img/bad.png') no-repeat scroll right top;
	width: 450px;
	height: 188px;
	float: left;
	margin-right: 35px;
	margin-top: 10px;
}

.guide-sample1-bg {
	width: 426px;
	height: 186px;
	background: url('../img/sample1.jpg') no-repeat scroll center center;
	border: 1px solid #d71015;
}

.guide-sample2 {
	background: url('../img/good.png') no-repeat scroll right top;
	width: 450px;
	height: 188px;
	float: left;
	margin-top: 10px;
}

.guide-sample2-bg {
	width: 426px;
	height: 186px;
	background: url('../img/sample2.jpg') no-repeat scroll center center;
	border: 1px solid #5e903a;
}

.guide-blocks.colors {
	margin-left: 20px;
}

.guide-colors {
	margin: 22px 0 35px 0;
	overflow: hidden;
}

.guide-color-wrapper {
	width: 140px;
	float: left;
	margin: 0 20px 0 0;
}

.guide-color-border-red {
	border: 1px solid #D71015;
	padding: 2px;
}

.guide-color-border-black {
	border: 1px solid #0C1013;
	padding: 2px;
}

.guide-color-border-dark-gray {
	border: 1px solid #33363C;
	padding: 2px;
}

.guide-color-border-light-gray {
	border: 1px solid #6B737C;
	padding: 2px;
}

.guide-color-border-white {
	border: 1px solid #6B737C;
	padding: 2px;
}

.guide-color-border-yellow {
	border: 1px solid #fcbf00;
	padding: 2px;
}

.guide-color-red {
	background-color: #D71015;
	height: 54px;
}

.guide-color-black {
	background-color: #0C1013;
	height: 54px;
}

.guide-color-dark-gray {
	background-color: #33363C;
	height: 54px;
}

.guide-color-light-gray {
	background-color: #6B737C;
	height: 54px;
}

.guide-color-white {
	background-color: #FFFFFF;
	height: 54px;
}

.guide-color-yellow {
	background-color: #fdc000;
	height: 54px;
}

.guide-color-text {
	margin: 6px 0 0 0;
}

.guide-color-text-red {
	text-transform: uppercase;
	color: #D71015;
	font-weight: 600;
}

.guide-color-text-black {
	text-transform: uppercase;
	color: #0C1013;
	font-weight: 600;
}

.guide-color-text-dark-gray {
	text-transform: uppercase;
	color: #33363C;
	font-weight: 600;
}

.guide-color-text-light-gray {
	text-transform: uppercase;
	color: #6B737C;
	font-weight: 600;
}

.guide-color-text-white {
	text-transform: uppercase;
	color: #0c1013;
	font-weight: 600;
}

.guide-color-text-yellow {
	text-transform: uppercase;
	color: #fcbf00;
	font-weight: 600;
}

.guide-color-text-code {
	color: #0c1013;
	font-size: 13px;
	line-height: 18px;
}

.guide-color-text-code span {
	color: #6b737c;
}

.guide-color-text-descr {
	color: #0c1013;
	font-size: 11px;
	margin: 3px 0 0 0;
}

.guide-photo-wrapper {
	border: 1px solid #6b737c;
	padding: 2px;
	width: 553px;
	float: right;
	margin-right: 22px;
	margin-top: 3px;
}

.guide-blocks.photos {
	margin-bottom: 42px;
}

.guide-photo,
.guide-photo img {
	line-height: 0.1;
}

.guide-blocks.gf1 {
	margin-bottom: 34px;
}

.guide-blocks.gf2 {
	margin-bottom: 66px;
}

.guide-blocks.gf3 {
	margin-bottom: 45px;
}

.guide-blocks.gf4 {
	margin-bottom: 50px;
}

.fonts-roboto-link {
	margin: 19px 0 0 0;
}

.guide-block-roboto {
	width: 531px;
	height: 247px;
	background: url('../img/roboto.png') no-repeat scroll center center;
	margin-left: 99px;
	margin-top: 18px;
}

.guide-pfdin-header {
	width: 238px;
	height: 24px;
	background: url('../img/PFDinDisplayPro.png') no-repeat scroll center center;
	margin-bottom: 11px;
}

.guide-block-pfdin {
	width: 535px;
	height: 139px;
	background: url('../img/din.png') no-repeat scroll center center;
	margin-left: 98px;
	margin-top: 10px;
}

.quote {
	background-color: #f9f5e4;
	padding: 10px 18px 8px 22px;
	margin: 8px -18px 8px -22px;
	clear: both;
	overflow: hidden;
	color: #0c1013;
	font-size: 13px;
	line-height: 18px;
}

.fonts-pfdin-link {
	margin: 11px 0 0 0;
}

.nomargin {
	margin: 0;

}

.guide-ttsquares-header {
	width: 235px;
	height: 29px;
	background: url('../img/TTSquaresCond.png') no-repeat scroll center center;
	margin-bottom: 10px;
}

.guide-block-ttsquares {
	width: 310px;
	height: 137px;
	background: url('../img/squares.png') no-repeat scroll center center;
	margin-left: 98px;
	margin-top: 12px;
}

.fonts-ttsquares-link {
	margin: 19px 0 0 0;
}

.footer {
	padding: 50px 0 0 0;
}

.copyright {
	width: 1040px;
	margin: 0 auto;
	border-top: 1px solid #d6dadd;
	padding: 17px;
	color: #717479;
	text-align: center;
	font-size: 13px;
}

@media only screen and (-o-min-device-pixel-ratio: 5/4), only screen and (-webkit-min-device-pixel-ratio: 1.25), only screen and (min--moz-device-pixel-ratio: 1.25), only screen and (min-device-pixel-ratio: 1.25), only screen and (min-resolution: 1.25dppx) {
	.header-logo-bg {
		background: url('../img/head-logo@2x.png') no-repeat scroll center top / 140px auto;
	}

	.banner {
		background: url('../img/red-bg@2x.jpg') no-repeat scroll center top / 1260px auto;
	}

	.small-banner {
		background: url('../img/red-bg@2x.jpg') no-repeat scroll center top / 1260px auto;
	}

	.logo-dark-big {
		background: url('../img/leonru-logo2@2x.png') no-repeat scroll center top / 380px auto;
	}

	.guide-logo-light-bg {
		background: #0c1013 url('../img/logo-light@2x.png') no-repeat scroll center center / 220px auto;
	}

	.guide-logo-dark-bg {
		background: #ffffff url('../img/logo-dark@2x.png') no-repeat scroll center center / 220px auto;
	}

	.guide-logo-layout {
		background: #ffffff url('../img/logo-layout@2x.png') no-repeat scroll center center / 579px auto;
	}

	.guide-logo-scale-img {
		background: #ffffff url('../img/logo-scale@2x.png') no-repeat scroll center center / 560px auto;
	}

	.guide-logo-scale span {
		background: url('../img/favicon@2x.png') no-repeat scroll center center / 16px auto;
	}

	.guide-sample1 {
		background: url('../img/bad@2x.png') no-repeat scroll right top / 13px auto;
	}

	.guide-sample1-bg {
		background: url('../img/sample1@2x.jpg') no-repeat scroll center center / 420px auto;
	}

	.guide-sample2 {
		background: url('../img/good@2x.png') no-repeat scroll right top / 13px auto;
	}

	.guide-sample2-bg {
		background: url('../img/sample2@2x.jpg') no-repeat scroll center center / 420px auto;
	}

	.guide-block-roboto {
		background: url('../img/roboto@2x.png') no-repeat scroll center center / 531px auto;
	}

	.guide-pfdin-header {
		background: url('../img/PFDinDisplayPro@2x.png') no-repeat scroll center center / 238px auto;
	}

	.guide-block-pfdin {
		background: url('../img/din@2x.png') no-repeat scroll center center / 535px auto;
	}

	.guide-ttsquares-header {
		background: url('../img/TTSquaresCond@2x.png') no-repeat scroll center center / 235px auto;
	}

	.guide-block-ttsquares {
		background: url('../img/squares@2x.png') no-repeat scroll center center / 310px auto;
	}

}