@import url('https://fonts.googleapis.com/css?family=Roboto:400,500&subset=cyrillic');
@font-face {font-family: BebasNeue; src: url('../fonts/BebasNeue-Bold.otf'); font-style: normal; font-weight: bold;}

/* Толщина начертаний
	100 Ultra Light, Extra Light, Thin;
	200 Light;
	300 Book, Regular, Roman;
	400 Medium;
	500 Demi Bold, Semibold;
	600 Bold;
	700 Extra Bold;
	800 Black;
	900 Ultra Bold, Heavy;
*/

* {
	margin: 0;
	padding: 0;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}
html {
	min-width: 320px;
	width: 100vw;
	max-width: 1920px;
	margin: 0 auto;
	overflow-x: hidden; 
	-webkit-tap-highlight-color: rgba(0,0,0,0);
}
body {
  overflow-x: hidden;
	font-family: Roboto, sans-serif;
	font-size: 14px;
	color: #121212;
	font-weight: 400;
	width: 100%;
	min-height: 100vh;
	position: relative;
	background-color: #fff;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}
body.adaptive {
	overflow: hidden;
	position: fixed!important;
}
.wrapper, #system-message-container,
.nav-wrapper,
.remind>*, .login>*, .nav.nav-tabs, .reset>*, .reg-section>*,
.search-header + .products-wrapper,
.search-header ~ .vm-pagination,
.main>.main-wrapper>.category-view {
	width: 100%;
	max-width: 1147px;
	margin: 0 auto;
}
.main>.main-wrapper>.category-view {
  margin-top: 60px;
  margin-bottom: 60px;
}
.main>.main-wrapper>.category-view .vm-pagination {
  float: unset!important;
  align-self: center!important;
  justify-content: center!important;
  flex-direction: column!important;
  align-items: center!important;
}
.main>.main-wrapper>.category-view .vm-pagination ul {
  margin-bottom: 20px!important;
}
.main>.main-wrapper>.category-view .products-wrapper {
  justify-content: center;
}
.main>.main-wrapper>.category-view .products-wrapper .product-container {
  margin-left: 7px;
  margin-right: 7px;
}
.search-header ~ .vm-pagination {
	float: unset;
	justify-content: flex-start;
	margin-top: 30px;
	margin-bottom: 60px;
}
header, nav, main {
	padding: 0 21px;
}
p, h1, h2,
h3, h4, h5,
span {
	cursor: default;
}
h1, h2,
h3, h4, h5 {
	font-weight: 700;
}
button {
	cursor: pointer;
	border: none;
	outline: none;
}
a {
	text-decoration: none;
	color: inherit;
	outline: none;
	cursor: pointer;
}
.address a:hover, .address a:focus,
.header-menu a, .header-menu a:hover, .header-menu a:focus,
.sale-title h4, .bottom-sales-item p,
.aboutus a, .mainpage-bottom-item-footer a,
.footer-catalog li a {
	-webkit-box-shadow: inset 0 -1.2px 0 -0.5px;
	box-shadow: inset 0 -1.2px 0 -0.5px;
}
/* ---------------------------------------------------------- FLEX BOX */
/* ---------------------------------------------------------- FLEX BOX */

	.flex {
		display: -webkit-flex;
		display: -moz-flex;
		display: -ms-flex;
		display: -o-flex;
		display: flex;
		-webkit-flex-direction: row;
		-moz-flex-direction: row;
		-ms-flex-direction: row;
		-o-flex-direction: row;
		flex-direction: row;
		justify-content: space-between;
		-ms-align-items: flex-start;
		align-items: flex-start;
	}
	.flex-column {
		display: -webkit-flex;
		display: -moz-flex;
		display: -ms-flex;
		display: -o-flex;
		display: flex;
		-webkit-flex-direction: column;
		-moz-flex-direction: column;
		-ms-flex-direction: column;
		-o-flex-direction: column;
		flex-direction: column;
		justify-content: flex-start;
		-ms-align-items: stretch;
		align-items: stretch;
	}
	.flex-center {
		display: -webkit-flex;
		display: -moz-flex;
		display: -ms-flex;
		display: -o-flex;
		display: flex;
		-webkit-flex-direction: row;
		-moz-flex-direction: row;
		-ms-flex-direction: row;
		-o-flex-direction: row;
		flex-direction: row;
		justify-content: center;
		-ms-align-items: center;
		align-items: center;
	}

/* ------------------------------------------------------------ CLASSES */
/* ------------------------------------------------------------ CLASSES */
	.show {
		display: flex;
	}
	.red {
		color: #ee2b2e;
	}
	.gold {
		color: #d5a63a;
	}
	.bold {
		font-weight: 700;
	}
	.br {
		display: none;
	}
	.table-container {
	  width: 100%;
	  overflow: auto;
	  -webkit-overflow-scrolling: touch;
	}
	::-moz-selection {
		color: #d3000d;
		text-shadow: none;
	}

	::selection {
		color: #d3000d;
		text-shadow: none;
	}
/* ------------------------------------------------------------- POPUP */
/* ------------------------------------------------------------- POPUP */

	.overlay {
		position: fixed;
		top: 0; bottom: 0;
		left: 0; right: 0;
		background-color: #000;
		opacity: 0.6;
		z-index: 99;
		opacity: 0;
		visibility: hidden;
		z-index: 99;
	}
	.overlay.animate {
		animation: hide-overlay 0.7s;
	}
	.overlay.show {
		animation: show-overlay 0.7s;
		opacity: 0.6;
		visibility: visible;
	}
	@keyframes show-overlay {
		0% {
			opacity: 0;
			visibility: hidden;
		}
	}
	@keyframes hide-overlay {
		0% {
			opacity: 0.6;
			visibility: visible;
		}
	}
	.popup {
		position: fixed;
		top: 0;
		left: 0;
		right: 0;
		bottom: 0;
		padding: 20px 30px;
		-webkit-box-shadow: 0 0 27px rgba(0,0,0,0.84);
		box-shadow: 0 0 27px rgba(0,0,0,0.84);
		margin: auto;
		z-index: 100;
		justify-content: space-between;
		background-color: #fff;
		opacity: 0;
		transform: translateY(-60px);
		visibility: hidden;
		max-height: calc(100vh - 42px);
		max-width: calc(100vw - 62px);
	}
	.popup .form-container {
		height: 100%;
		-ms-align-items: center;
		align-items: center;
		flex-grow: 1;
		overflow-x: hidden;
		overflow-y: auto;
	}
	.popup.animate {
		animation: hide-popup 0.7s;
	}
	.popup.show {
		animation: show-popup 0.7s;
		opacity: 1;
		visibility: visible;
		transform: translateY(0px);
	}
	@keyframes show-popup {
		0% {
			opacity: 0;
			transform: translateY(-60px);
			visibility: hidden;
		}
	}	
	@keyframes hide-popup {
		0% {
			opacity: 1;
			transform: translateY(0px);
			visibility: visible;
		}
	}
	.close-popup {
		cursor: pointer;
		height: 19px;
		width: 19px;
		position: absolute;
		top: 0;
		right: -30px;
	}
	.close-popup:after, .close-popup:before {
		content: '';
		background-color: #999;
		height: 3px;
		width: 100%;
		position: absolute;
		top: 7.5px;
	}
	.close-popup:after {
		-webkit-transform: rotate(45deg);
		-ms-transform: rotate(45deg);
		-o-transform: rotate(45deg);
		transform: rotate(45deg);
	}
	.close-popup:before {
		-webkit-transform: rotate(-45deg);
		-ms-transform: rotate(-45deg);
		-o-transform: rotate(-45deg);
		transform: rotate(-45deg);
	}
	.popup h3 {
		font-size: 1.4em;
		margin-bottom: 20px;
	}
	.form-message {
		margin-bottom: 10px;
	}
	.popup input, .popup textarea {
		border: none;
		border-top: 1px solid #999;
		padding: 5px 10px;
		height: 50px;
	}
	.popup button {
		margin-top: 10px;
		width: 100%;
		max-width: 220px;
		-ms-align-self: center;
		align-self: center;
	}
	.popup textarea {
		resize: none;
		height: 90px;
		padding: 15px 10px;
	}
	.popup p.agreement {
		font-size: 0.7em;
		line-height: 1em;
		text-align: center;
		margin-top: 7px;
	}
	.agreement a {
		display: inline-block;
	}
	.agreement a:hover {
		-webkit-box-shadow: 0 2px 0 -1px;
		box-shadow: 0 2px 0 -1px;
	}
	#submit-question-popup {
		-ms-align-self: center;
		align-self: center;
		transition: 0.4s;
	}
	#question-popup {
		width: 380px;
		height: 470px;
	}
	#question-popup textarea, #question-popup input {
		background-color: transparent;
	}
	#question-popup input::-webkit-input-placeholder, #question-popup textarea::-webkit-input-placeholder {
		font-weight: 300;
	} 
	#question-popup input::-moz-placeholder, #question-popup textarea::-moz-placeholder {
		font-weight: 300;
	} 
	#question-popup input:-ms-input-placeholder, #question-popup textarea:-ms-input-placeholder {
		font-weight: 300;
	} 
	#question-popup input::placeholder, #question-popup textarea::placeholder {
		font-weight: 300;
	}
	#callback-popup {
		width: 280px;
		height: 300px;
	}

/* ---------------------------------------------------------------- FORMS */
/* ---------------------------------------------------------------- FORMS */

	.empty-input::-webkit-input-placeholder {
		color: #ee2b2e;
		font-weight: bold;
	} 
	.empty-input::-moz-placeholder {
		color: #ee2b2e;
		font-weight: bold;
	} 
	.empty-input:-ms-input-placeholder {
		color: #ee2b2e;
		font-weight: bold;
	} 
	.empty-input::placeholder {
		color: #ee2b2e;
		font-weight: bold;
	}

	input, select, textarea, button {
		font-family: Roboto, sans-serif;
		outline: none;
	}

/* ---------------------------------------------------------------- LOGIN */
/* ---------------------------------------------------------------- LOGIN */
	form + button#login-button {
		display: none;
	}
	form.form-inline + button#login-button {
		display: flex;
		justify-content: center;
		display: none;
	}
	button#login-button {
		background-color: transparent;
		padding: 0 5px;
	}
	button#login-button:hover {
		background-color: #e2e2e2;
	}
	button#login-button svg {
		height: 15px;
		width: 15px;
		margin-right: 10px;
	}
	.logout-button input.btn.btn-primary {
		border: none;
		padding: 5px;
		padding-right: 24px;
	}

	form#login-form.form-inline {
		width: 240px;
		height: 320px;
		-ms-align-items: stretch;
		align-items: stretch;
		justify-content: center;
		padding: unset;
		padding: 15px;
	}
	form#login-form.form-inline .userdata {
		width: 100%;
		height: 100%;
		display: -webkit-flex;
		display: -moz-flex;
		display: -ms-flex;
		display: -o-flex;
		display: flex;
		padding: 15px;
		border: 1px solid;
		-webkit-flex-direction: column;
		-moz-flex-direction: column;
		-ms-flex-direction: column;
		-o-flex-direction: column;
		flex-direction: column;
		-ms-align-items: stretch;
		align-items: stretch;
		justify-content: center;
	}
	form#login-form.form-inline ul {
		list-style: none;
	}
	.control-group.checkbox {
		-ms-align-items: center;
		align-items: center;
		justify-content: flex-start;
	}
	.control-group.checkbox input {
		margin-right: 7px;
	}
	.form-inline.popup input, .form-inline.popup button,
	a.registration {
		height: 40px;
		border-radius: 0;
	}
	.form-inline.popup button {
		margin-top: unset;
		width: 100%;
		font-family: BebasNeue;
		text-transform: uppercase;
	}
	.form-inline.popup input {
		border-top: none;
		border-bottom: 1px solid #999;
		margin-bottom: 7px;
		width: 100%;
	}
	a.registration {
		display: flex;
		-ms-align-items: center;
		align-items: center;
		justify-content: center;
		height: 40px;
		border: none;
		width: 100%;
		margin-bottom: 7px;
		margin-top: 7px;
		font-size: 1.2em;
		letter-spacing: 0.3px;
		font-family: BebasNeue;
		text-transform: uppercase;
	}

/* -------------------------------------------------------------------------- ARTICLES */
/* -------------------------------------------------------------------------- ARTICLES */
	.blog {
		padding-bottom: 30px;
		flex-wrap: wrap;
	}
	.item-page .page-header {
		margin-top: 60px;
		font-family: BebasNeue;
		font-size: 1.4em;
	}
	.articleBody {
		margin: 30px auto;
		line-height: 1.5em;
	}
	.page-header {
		font-weight: bold;
		font-size: 1.6em;
		text-align: center;
		margin-bottom: 30px;
		margin-top: 60px;
		font-family: BebasNeue;
	}
	main>.main-wrapper #content>.page-header {
	  text-align: left;
	  margin-top: 0;
	}
	.blog .page-header {
	  margin-top: 0;
	  text-align: left;
	  font-size: 1.3em;
	}
	.item-news {
	  background-color: #f9f9f9;
	  padding: 40px 30px;
	  margin-bottom: 30px;
	}
	.item-page {
		padding: 60px 0;
	}
	.item-page h2 {
		line-height: 1.1em;
		max-width: 620px;	
		font-family: BebasNeue;
		font-size: 2em;
	}
	.blog .article-info {
		margin-bottom: 20px;
		color: #888;
	}
	.blog-item-body {
		justify-content: flex-start;
		-ms-align-items: stretch;
		align-items: stretch;
	}
	.blog-item-text {
		margin-left: 25px;
		max-width: 500px;
		line-height: 1.5em;
	}
	.blog-item-text .readmore {
		margin-top: 25px;
		line-height: 1;
	}
	.blogPost {
		margin-bottom: 50px;
	}
	.item-image {
	  margin-bottom: 20px;
	}
	.item-image a, .item-image {
		display: -webkit-flex;
		display: -moz-flex;
		display: -ms-flex;
		display: -o-flex;
		display: flex;
		-webkit-flex-direction: column;
		-moz-flex-direction: column;
		-ms-flex-direction: column;
		-o-flex-direction: column;
		flex-direction: column;
		-ms-align-items: center;
		align-items: center;
		justify-content: flex-start;
		overflow: hidden;
		max-width: 520px;
		width: 100%;
		height: auto;
	}
	.item-image a img {
		width: 100%;
		height: auto;
	}
	.intro-text {
	  font-size: 1.1em;
	}

/* -------------------------------------------------------------- SEARCH */
/* -------------------------------------------------------------- SEARCH */

	.search-form {
		-ms-align-items: center;
		align-items: center;
	}
	#searchForm {
		margin: 30px auto;
	}
	fieldset.phrases, fieldset.only {
		padding: 10px 30px;
	}
	legend {
		font-size: 1.1em;
		font-weight: 500;
		padding: 10px ;
	}
	.phrases-box {
		margin-bottom: 15px;
	}
	.phrases-box .controls {
		display: -webkit-flex;
		display: -moz-flex;
		display: -ms-flex;
		display: -o-flex;
		display: flex;
		-webkit-flex-direction: column;
		-moz-flex-direction: column;
		-ms-flex-direction: column;
		-o-flex-direction: column;
		flex-direction: column;
		-ms-align-items: flex-start;
		align-items: flex-start;
	}
	.phrases-box .controls label {
		display: block;
		margin-bottom: 5px;
		cursor: pointer;
	}
	.only label {
		margin-right: 15px;
	}
	.form-limit {
		margin: 15px 0;
	}
	.result-title {
		font-weight: 500;
	}
	.result-category {
		margin-bottom: 7px;
	}
	.result-created {
		margin-bottom: 12px;
	}
	button.search-btn, #searchForm .btn-toolbar button {
		background-color: transparent;
		width: 16px;
		height: 16px;
		padding: 0;
		margin-left: 20px;
		border-right-style: none;
		border: none;
	}
	#searchForm .btn-toolbar button {
		height: 40px;
		width: 40px;
	}
	button.search-btn svg, #searchForm .btn-toolbar button svg {
		height: 24px;
		width: 24px;
	}
	input.search-input, #searchForm #search-searchword {
		border: none;
		background-color: transparent;
		padding-bottom: 3px;
		-webkit-box-shadow: inset 0 -2px 0 -0.5px;
		box-shadow: inset 0 -2px 0 -0.5px;
		color: #fff;
		-ms-align-items: center;
		align-items: center;
		height: 20px;
		margin-left: 10px;
	}
	#searchForm #search-searchword {
		color: #494c53;
		height: 40px;
		padding-bottom: 0;
		margin-left: 0;
	}
	.searchintro {
		margin: 30px 0;
	}
	#searchForm .btn-toolbar {
		justify-content: flex-start;
	}

/*---------------------------------------------------- ERROR*/
/*---------------------------------------------------- ERROR*/
  .header-404 {
    font-size: 4em;
    margin-bottom: 25px;
    color: #ee2b2e;
  }
  .wrapper-404 h2 {
    margin-bottom: 15px;
  }
  .links-404 {
    justify-content: flex-start;
    margin: 45px 0 60px;
  }
  .links-404 a {
    height: 50px;
    width: 220px;
    border: 1px #d5a63a solid;
    border-radius: 25px;
  }
  .links-404 button {
    height: 50px;
    color: #fff;
    border-radius: 25px;
    width: 220px;
    margin-left: 20px;
  }
   @media screen and (max-width: 1050px) {
	  .wrapper-404 img {
			display: none;
	  }
  }

/* ------------------------------------------------------- BACK-TO-TOP */
/* ------------------------------------------------------- BACK-TO-TOP */

	#back-to-top {
		position: fixed;
		bottom: 40px;
		left: 40px;
		display: -webkit-flex;
		display: -moz-flex;
		display: -ms-flex;
		display: -o-flex;
		display: flex;
		-ms-align-items: center;
		align-items: center;
		justify-content: center;
		-webkit-flex-direction: column;
		-moz-flex-direction: column;
		-ms-flex-direction: column;
		-o-flex-direction: column;
		flex-direction: column;
		height: 50px;
		width: 50px;
		opacity: 0.7;
		background-color: #51b3ff;
		color: #fff;
		z-index: 5;
		-webkit-transition: opacity 0.2s, transform 0.4s;
		-o-transition: opacity 0.2s, transform 0.4s;
		transition: opacity 0.2s, transform 0.4s;
		border-radius: 5px;
		font-size: 12px;
		-webkit-transform: translateX(-200px);
		-ms-transform: translateX(-200px);
		-o-transform: translateX(-200px);
		transform: translateX(-200px);
		box-shadow: 0 0 10px rgba(0,0,0,0.6);
	}
	#back-to-top:hover {
		opacity: 1;
	}
	#back-to-top.show {
		-webkit-transform: translateX(0);
		-ms-transform: translateX(0);
		-o-transform: translateX(0);
		transform: translateX(0);
	}