@charset "utf-8";
@import url("../_fonts/fonts.css");

* {font-family: 'wh', Arial;}
body {background: url(../images/bg/bg.png) top repeat-x #323231;}

h1 {font-size: 24px; font-weight: normal; margin-bottom: 1em;}
h3 {font-size: 16px; font-weight: 500;}
h4 {font-size: 16px; font-weight: normal; margin: 25px 0 10px;}

.upper {text-transform: uppercase;}

nav .nav a {font-weight: 500; font-size: 12px; text-transform: uppercase; text-shadow: none;}
.navbar-default {border: none; }
header .navbar-nav {float: right; margin-right: 7px;}
.logo {margin-left: -8px;}

@media (min-width: 992px) {
  nav .nav a {font-weight: 500; font-size: 13px; text-transform: uppercase; text-shadow: none;}
  .menu {padding-left: 40px;}
  .logo {
    position: absolute;
	z-index: 100;
  }
  .where-buy {height: 140px;}
  .ml5 {margin-left: 5px;}
}

hr.light {border-top: solid 1px #929497;}

.margin15 {margin-bottom: 15px;}

.valign_top {line-height: 36px;}
.soc img {margin-left: 15px;}
.langs span {color: #fdb71a; display: inline-block; }
.langs a {color: #636466; font-weight: bold;  }

.news_row {background: #cc1e24; height: 50px; line-height: 50px;}
.news_row a {color: #fff; font-size: 11px;}
.news_row .news_title {font-size: 14px; text-transform: uppercase;}
.news_row img {margin: 0 5px; vertical-align: baseline;}
.soc_row {background: #fff; height: 50px; line-height: 50px;}
.soc_row img {margin-left: 5px;}

.nomargin {margin: 0;}
.nopadding {padding: 0;}
.vcenter {
    display: table-cell;
    vertical-align: middle;
    float: none;
}

div.article_photos {clear:both; margin-top: 30px; margin-bottom: 30px;}
div.article_photos a {padding: 1px;}
div.article_photos a img {margin: 10px; border: solid 2px #f5f5f5; box-shadow: 0 0 1px #666; }
div.article_photos a img:hover {margin: 10px; border: solid 2px #fcc71f; box-shadow: 0 0 1px #666; }

div.page_photos {clear:both; margin-top: 30px; margin-bottom: 20px;}
div.page_photos a {padding: 1px;}
div.page_photos a img {margin: 1px; border: solid 4px #f5f5f5; box-shadow: 0 0 2px #666; }
div.page_photos a img:hover {margin: 1px; border: solid 4px #d9262c; box-shadow: 0 0 2px #666; }

.where-buy {background:  url(../images/bg/bg_index_where_buy.png) left no-repeat #dbdcdd; padding: 10px; }
.where-buy a {color: #434244;}
.where-buy-bg {background: url(../images/bg/bg_where_buy.png) top center no-repeat; }
.where-buy img, .articles-index img { vertical-align: baseline;}
.articles-index {background: #7f8184; padding: 10px; height: 140px;}
.articles-index a {color: #fff; text-transform: uppercase;}

.hiddenlink {display: none; white-space: nowrap; position: absolute; z-index: 1000; border: solid 1px #999; background: #fff; box-shadow: 1px 1px 1px #ccc; padding: 0 5px; font-size: 11px !important; min-width: 300px;}

aside {background: #636466; margin-top: 15px;}
aside.nobg {background: none; margin-top: 10px;}
aside > .row {margin: 0; }
aside a, aside a:hover {color: #fff;}

section {margin-bottom: 20px; }

/* Хлебные крошки */
.breadcrumbs {color: #434244; font-weight: bold; text-transform: uppercase; font-size: 10px; padding: 17px 15px; background: #c5c7c9;}
.breadcrumbs a {color: #434244; font-weight: 500; }
.breadcrumbs span {background: url(../images/arrow_small_gray.png) no-repeat; display: inline-block; margin: 0 5px; width: 7px; height: 7px;}

input.search {background: #363436; border: 0; padding: 9px 20px; height: 36px; float: right ;}
input[name=do_search] {background: url('../images/lupa.gif') no-repeat center center #636466; float: right ;height: 36px; width: 36px; border: 0;}

/* блоки главной */
.block_motoroil, .block_transmissoil, .block_smalltechoil, .block_coolants { height: 160px; font-size: 14px; text-transform: uppercase; padding: 12px 20px;}
.block_motoroil {background: url(../images/bg/bg_motoroil.jpg) no-repeat bottom right #fdb71a; }
.block_transmissoil {background: url(../images/bg/bg_transmissoil.jpg) no-repeat bottom right #f36f26; height: 160px;}
.block_smalltechoil {background: url(../images/bg/bg_smalltechoil.jpg) no-repeat bottom right #ef424c; height: 160px;}
.block_coolants {background: url(../images/bg/bg_coolants.jpg) no-repeat bottom right #59595b; height: 160px;}
.block_greases {background: url(../images/bg/bg_greases.png) no-repeat bottom right #169edd; height: 160px;}
.block_motoroil a, .block_transmissoil a, .block_smalltechoil a, .block_coolants a, .block_greases a {color: #fff;}
.block_motoroil a.detail, .block_transmissoil a.detail, .block_smalltechoil a.detail, .block_coolants a.detail, .block_greases a.detail { position: absolute; margin-top: 120px;}
a.detail { text-transform: uppercase; background: url(../images/arrow_small.png) no-repeat right center; padding-right: 12px; font-size: 10px; }

.lblock {width: 100%; text-transform: uppercase; height: 70px; display: table; font-size: 16px; padding-left: 13px; background: #999;}

/* ---------------- 
       CATALOG
   ---------------- */
.motoroil {color: #fdb71a; }
.transmissoil {color: #f36f26; }
.smalltechoil {color: #ef424c; }
.industrialoil {color: #c5c7c9; }
.greases {color: #169edd; }
.bgmotoroil {background: #fdb71a; }
.bgtransmissoil {background: #f36f26; }
.bgsmalltechoil {background: #ef424c; }
.bgindustrialoil {background: #c5c7c9; }
.bggreases {background: #169edd; }
.brd {border-left: solid 40px #ccc; }
.brdmotoroil {border-left: solid 40px #fdb71a; }
.brdtransmissoil {border-left: solid 40px #f36f26; }
.brdsmalltechoil {border-left: solid 40px #ef424c; }
.brdindustrialoil {border-left: solid 40px #c5c7c9; }
.brdgreases {border-left: solid 40px #169edd; }

.catalog_left_menu_item {display: block; border-bottom: solid 1px #fff; margin: 0; padding: 5px 0;} 
.catalog_item {background: #636466; margin-bottom: 15px; padding: 15px 0 15px 40px;}
.catalog_item h1 {margin: 0 0 10px;}
.catalog_detail {background: #636466;}
.catalog_detail_info {padding: 0 15px;}
.catalog_detail_info2 {padding: 10px 15px 0 15px;}
.catalog_detail_h {color: #929497; font-size: 11px; font-weight: 500; text-transform: uppercase; margin-bottom: 3px; margin-top: 17px;}

.rotate {
	display: block; white-space: nowrap;
	font-size: 14px;
	transform: rotate(90deg) translateX(20px) translateY(10px);
	text-align: right;
	font-weight: 500;
}


.left_punkts {padding: 15px; }
.left_punkts div {border-bottom: solid 1px #fff; margin-bottom: 30px; text-transform: uppercase; font-size: 11px;}
.left_punkts div.l2 {border-bottom: none; margin-top: 50px; text-transform: uppercase; font-size: 11px;}
.left_punkts div.l3 {margin-top: 0; text-transform: uppercase; font-size: 11px;}

section > article {display: block; padding: 10px 0;}
article.row {margin: 0;}
article h3 {font-weight: 500; font-size: 16px; margin-top: 0;}
article img {padding-left: 0 !important;}
article div {padding: 0 !important; }

.left-article {display: block; padding-bottom: 10px; border-bottom: solid 1px #fff; text-transform: uppercase;}
.date {font-size: 10px;}
p.active_news * {color: #fcaf05; font-weight: bold;}

footer .first:before {content:' '; width: 100%; height: 85px; background: url(../images/bg/bg_footer.png) top repeat-x #323231;}
footer .navbar {min-height: 36px;}
footer .navbar li a {padding: 10px; font-size: 12px;}
footer .bottom {font-size: 10px; color: #333; font-weight: 500; background: #fdb71a;}
footer .bottom a {color: inherit;}
footer .bottom div {padding: 10px;}
footer .authors {color: #ffde50; font-size: 7px;}
footer .authors a {color: inherit}

/* Feedback form */
input.required, textarea.required {background: url('../images/bg/bg_required_fiied.gif') repeat-y left;}
label {font-size: 11px; font-weight: normal;}
form[name=feedback] {margin-bottom: 100px;}
form[name=feedback] input[type=submit] {border: 0; background: #fdb71a; font-weight: 500; color: #434343; float: right; padding: 8px 25px; text-transform:uppercase; }
form[name=feedback] input[type=text],form[name=feedback] textarea {width: 100%; margin: 2px 0 15px; border: 0; padding: 8px; background: #59595b;}

input[type=checkbox].css-checkbox {
							position:absolute; z-index:-1000; left:-1000px; overflow: hidden; clip: rect(0 0 0 0); height:1px; width:1px; margin:-1px; padding:0; border:0;
						}

						input[type=checkbox].css-checkbox + label.css-label {
							padding-left:25px;
							height:20px; 
							display:inline-block;
							line-height:20px;
							background-repeat:no-repeat;
							background-position: 0 0;
							vertical-align:middle;
							cursor:pointer;

						}

						input[type=checkbox].css-checkbox:checked + label.css-label {
							background-position: 0 -20px;
						}
						label.css-label {
				background-image:url(http://csscheckbox.com/checkboxes/u/csscheckbox_0d3b83901f3978ec9b0f32f2612d3010.png);
				-webkit-touch-callout: none;
				-webkit-user-select: none;
				-khtml-user-select: none;
				-moz-user-select: none;
				-ms-user-select: none;
				user-select: none;
			}


.file_upload{
    display: block;
    position: relative;
    overflow: hidden;
    font-size: 1em;              /* example */
    height: 35px;                 /* example */
    line-height: 32px;             /* the same as height */
}
.file_upload .button, .file_upload > mark{
    display: block;
    cursor: pointer              /* example */
}
.file_upload .button{
    float: right;
    box-sizing: border-box;
    -moz-box-sizing: border-box;
    width: 8em;                  /* example */
    height: 100%;
    text-align: center           /* example */
}
.file_upload > mark{
    background: transparent;     /* example */
    padding-left: 10px;            /* example */
	color: #fff;
}
@media only screen and ( max-width: 500px ){  /* example */
    .file_upload > mark{
        display: none
    }
    .file_upload .button{
        width: 100%
    }
}
.file_upload input[type=file]{
    position: absolute;
    top: 0;
    opacity: 0
}

/* Making it beautiful */

.file_upload{
    background: #59595b;
}
.file_upload.focus{
}
.file_upload .button{
    background: #76787a;
    transition: background 0.2s;
    color: #fff;
    overflow: hidden;
    white-space: nowrap;
}
.file_upload:hover .button{
    background: #666;
}
.file_upload:active .button{
    background: #76787a;
}