@font-face {
	font-family: 'open_sansregular';
	src: url('/fonts/OpenSans-Regular-webfont.eot');
	src: url('/fonts/OpenSans-Regular-webfont.eot?#iefix') format('embedded-opentype'), url('/fonts/OpenSans-Regular-webfont.woff') format('woff'), url('/fonts/OpenSans-Regular-webfont.ttf') format('truetype'), url('/fonts/OpenSans-Regular-webfont.svg#open_sansregular') format('svg');
	font-weight: normal;
	font-style: normal;

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

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

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

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

}

.brands {
	padding: 4px 58px 65px;
	font: 14px/20px open_sansregular, arial;
	color: #000;
}
	.brands a {
		color: #2980b9;
	}
	.brands .link {
		color: #2980b9 !important;
		text-decoration: underline;
		cursor: pointer;
	}
	.brands h1 {
		margin-bottom: 30px;
		font: 24px/28px proximanova-black, sans-serif;
	}
	.brands h2 {
		margin-bottom: 15px;
		font: 22px/28px open_sanslight, arial;
		color: #000;
	}
	.brands label {
		font-weight: normal;
	}
	.brands input[type=text], .brands textarea {
		border: 1px solid #000;
		font: 13px/15px open_sansregular, arial;
		padding: 3px 10px;
		box-sizing: border-box;
	}
	.brands .button {
		display: inline-block;
		box-sizing: content-box;
		padding: 10px 16px 4px;
		border: none;
		cursor: pointer;
		border-radius: 4px;
		background: #2873d8;
		font: bold 14px/14px proximanova-black, sans-serif;
		text-transform: uppercase;
		text-align: center;
		color: rgba(255, 255, 255, 0.9);
		text-overflow: clip;
		box-shadow: 0 4px 0 0 #1a4a8b;
		-webkit-transition: all 300ms cubic-bezier(0.42, 0, 0.58, 1);
		-moz-transition: all 300ms cubic-bezier(0.42, 0, 0.58, 1);
		-o-transition: all 300ms cubic-bezier(0.42, 0, 0.58, 1);
		transition: all 300ms cubic-bezier(0.42, 0, 0.58, 1);
	}
	.brands .title {
		padding: 0;
		margin: 0;
	}
	.brands .sidebar {
		float: right;
		width: 225px;
		padding-top: 80px;
	}
	.brands .announce {
		margin-bottom: 30px;
		font-family: open_sanslight, arial;
	}
	.brands .for-add-brand {
		font-family: open_sansbold, arial;
	}
	.brands .layout {
		padding-right: 300px;
	}
	.brands .breadcrumb {
		margin-bottom: 25px;
		color: #2980b9;
		font-size: 12px;
	}
	.brands .filter {
		/*font-weight: bold;*/
		font-family: open_sansbold, arial;
		line-height: 14px;
		margin-bottom: 15px;
	}
		.brands .filter form {
			margin: 0;
		}
		.brands .filter input[type=text] {
			width: 350px;
			padding: 7px 10px;
			font: 14px/18px open_sansregular, arial;
			margin-right: 5px;
		}
		.brands .filter .button {
			position: relative;
			top: -1px;
		}
	.brands .alphabet-index {
		float: right;
		padding: 0 20px;
		margin-bottom: 20px;
	}
		.brands .alphabet-index .title {
			margin-bottom: 5px;
		}
		.brands .alphabet-index .letters {
			display: inline-block;
			margin-right: 25px;
			position: relative;
			color: #2980b9;
			border-bottom: 1px dashed;
			cursor: pointer;
		}
			.brands .alphabet-index .letters.current:after {
				content: '';
				display: block;
				width: 17px;
				height: 7px;
				background: url(/image/brands/layout/corner.png) no-repeat;
				position: absolute;
				bottom: -16px;
				left: 50%;
				margin-left: -9px;
			}
	.brands .alphabet {
		display: none;
		background: #1a4a8c;
		margin: 0 0 1px -65px;
		padding: 10px 60px 10px 65px;
		font-size: 13px;

		/* justify */
		text-align: justify;
		line-height: 0;
		font: 2px/0 Arial; /* font-size < 2px ломает оперу */
		/* IE6-7*/
		text-justify: newspaper;
		zoom:1;
		text-align-last: justify;
	}
		.brands .alphabet:after {
			width: 100%;
			height: 0px;
			visibility: hidden;
			overflow: hidden;
			content: '';
			display: inline-block;
		}
		.brands .alphabet.current {
			display: block;
		}
		.brands .alphabet a, .brands .alphabet span {
			font: 13px/13px open_sansregular, arial;
			color: #fff;
		}
		.brands .alphabet .current {
			/*font-family: open_sansbold, arial;*/
			padding: 5px;
			background: #2873d8;
		}
		.brands .alphabet .disable {
			color: #4d70e9;
		}
	.brands .groups {
		margin: 0 0 40px -65px;
		color: #fff;
	}
	.brands .groups-header {
		background: #1a4a8c;
		padding: 11px 40px 9px 65px;
		border-bottom: 5px solid #081d3c;
		cursor: pointer;
	}
		.brands .groups-header span {
			display: inline-block;
		}
	.brands .groups-toggle {
		float: right;
		height: 13px;
		padding-right: 50px;
		background: url(/image/brands/layout/expand_arrows.png) no-repeat 100% -26px;
		margin-top: 5px;
	}
		.brands .groups-toggle.expanded {
			background-position: 100% -13px;
		}
		.brands .groups-toggle span {
			display: none;
			font-size: 12px;
			line-height: 13px;
		}
			.brands .groups-toggle span.current {
				display: inline;
			}
	.brands .groups-title {
		border-bottom: 1px dashed;
		margin-right: 5px;
		font: 24px/24px proximanova-black, sans-serif;
		text-transform: uppercase;
	}
	.brands .groups-count {
		font: 20px/20px open_sanslight, arial;
		text-transform: uppercase;
	}

	.brands .groups-list {
		display: none;
		background: #0F2F58;
		padding: 10px 0 30px 60px;
		overflow: hidden;
	}
		.brands .groups-list ul {
			float: left;
			width: 375px;
			padding: 0;
			margin-right: 25px;
		}
		.brands .groups-list li {
			float: left;
			width: 380px;
			box-sizing: border-box;
			padding: 5px 40px 5px 5px;
			margin-right: 15px;
			position: relative;
			list-style: none;
			font: 13px/13px open_sanssemibold, arial;
			color: #fff;
		}
		.brands .groups-list li.current {
			background: #2873d8;
		}
		.brands .groups-list li.disabled {
			color: #4d70e9;
		}
		.brands .groups-list .count {
			position: absolute;
			top: 5px;
			left: 345px;
			font: 13px/13px open_sansregular, arial;
		}
/*
			.brands .groups-list li.current .count {
				color: #fff;
			}
*/
		.brands .groups-list a {
			color: #fff;
			text-decoration: none;
		}
			.brands .groups-list a:hover {
				color: #fff;
				text-decoration: underline;
			}
	.brands .last-brands {
		margin-left: -20px;
		overflow: hidden;
	}
		.brands .last-brands .title {
			margin: 0 0 20px 20px;
			font: 18px/18px open_sansbold, arial;
		}
		.brands .last-brands .item {
			float: left;
			width: 250px;
			height: 100px;
			margin: 0 0 15px 20px;
			background: no-repeat 50% 50%;
			position: relative;
		}
			.brands .last-brands .item:before{
				content: '';
				position: absolute;
				top: 0;
				right: 0;
				bottom: 0;
				left: 0;
				background: rgba(0, 0, 0, 0.05);
			}
				.brands .last-brands .item:hover:before{
					background: rgba(15, 47, 88, 0.05);
				}
		.brands .last-brands a {
			display: block;
			width: 100%;
			height: 100%;
			position: relative;
		}
	.brands .brands-list {
		border-top: 1px dashed #000;
		margin-bottom: 50px;
	}
		.brands .brands-list .item {
			border-bottom: 1px dashed #000;
			position: relative;
			overflow: hidden;
		}
		.brands .brands-list a {
			display: block;
			padding: 32px 20px;
			text-decoration: none;
			position: relative;
		}
			.brands .brands-list a:hover:before {
				content: '';
				position: absolute;
				top: 12px;
				right: 0;
				bottom: 12px;
				left: 0;
				background: rgba(0, 0, 0, 0.05);
			}
			.brands .brands-list a:hover:after {
				content: '';
				width: 21px;
				height: 21px;
				background: url(/image/brands/layout/listing_arrows.png) no-repeat 100% 50%;
				position: absolute;
				top: 50%;
				right: 20px;
				margin-top: -11px;
			}
		.brands .brands-list img {
			float: left;
		}
		.brands .brands-list .description {
			padding: 0 40px 0 20px;
			overflow: hidden;
			position: relative;
			font-size: 13px;
		}
		.brands .brands-list .title {
			padding-bottom: 15px;
		}
			.brands .brands-list .title .link {
				font: 15px/18px open_sansbold, arial;
				margin-right: 5px;
			}
			.brands .brands-list .title span {
				color: #808080;
			}
		.brands .brands-list .manufacturer span {
			font-family: open_sansbold, arial;
			margin-right: 5px;
		}
	.brands .page-navigator {
		color: #2873d8;
		font-size: 15px;
		line-height: 15px;
		overflow: hidden;
	}
		.brands .page-navigator a, .brands .page-navigator span {
			float: left;
			margin: 8px 6px;
		}
		.brands .page-navigator .title {
			margin-right: 20px;
			font-family: open_sansbold, arial;
			color: #000;
		}
		.brands .page-navigator .current {
			padding: 8px 5px;
			margin: 0 6px;
			background: #d9d9d9;
		}
		.brands .page-navigator .prev-next {
			width: 21px;
			height: 21px;
			margin: 5px 0;
			background: url(/image/brands/layout/listing_arrows.png) no-repeat;
			text-indent: -10000px;
		}
		.brands .page-navigator .prev {
			margin-right: 35px;
			background-position: 0 100%;
		}
			.brands .page-navigator a.prev {
				background-position: 0 0;
			}
				.brands .page-navigator a.prev:hover {
					background-position: 0 50%;
				}
		.brands .page-navigator .next {
			margin-left: 35px;
			background-position: 100% 100%;
		}
			.brands .page-navigator a.next {
				background-position: 100% 0;
			}
				.brands .page-navigator a.next:hover {
					background-position: 100% 50%;
				}
	.brands .add-brand {}
		.brands .add-brand form {
			margin: 30px 0;
		}
		.brands .add-brand .field {
			margin-bottom: 10px;
		}
		.brands .add-brand input[type=text], .brands .add-brand textarea {
			width: 100%;
		}
		.brands .add-brand .email {
			width: 50%;
		}
		.brands .add-brand .description {
			font-size: 12px;
			color: #808080;
		}

@media all and (max-width: 1000px) {
	.sidebar {
		display: none;
	}

	.brands .layout {
		padding-right: 0;
	}

	.brands {
		padding: 0;
	}

	.brands .alphabet-index {
		margin-bottom: 25px;
	}

	.brands .filter input[type="text"] {
		width: 150px;
	}

	.brands .brands-list img {
		float: none;
	}

	.brands .brands-list .description {
		padding-left: 0;
	}
}		
