@font-face {
    font-family: 'Roboto';
    src: url('../fonts/Roboto-Bold.eot');
    src: url('../fonts/Roboto-Bold.eot?#iefix') format('embedded-opentype'), url('../fonts/Roboto-Bold.woff2') format('woff2'), url('../fonts/Roboto-Bold.woff') format('woff');
    font-weight: bold;
    font-style: normal;
}

@font-face {
    font-family: 'Roboto';
    src: url('../fonts/Roboto-MediumItalic.eot');
    src: url('../fonts/Roboto-MediumItalic.eot?#iefix') format('embedded-opentype'), url('../fonts/Roboto-MediumItalic.woff2') format('woff2'), url('../fonts/Roboto-MediumItalic.woff') format('woff');
    font-weight: 500;
    font-style: italic;
}

@font-face {
    font-family: 'Roboto';
    src: url('../fonts/Roboto-Thin.eot');
    src: url('../fonts/Roboto-Thin.eot?#iefix') format('embedded-opentype'), url('../fonts/Roboto-Thin.woff2') format('woff2'), url('../fonts/Roboto-Thin.woff') format('woff');
    font-weight: 100;
    font-style: normal;
}

@font-face {
    font-family: 'Roboto';
    src: url('../fonts/Roboto-Regular.eot');
    src: url('../fonts/Roboto-Regular.eot?#iefix') format('embedded-opentype'), url('../fonts/Roboto-Regular.woff2') format('woff2'), url('../fonts/Roboto-Regular.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'Roboto';
    src: url('../fonts/Roboto-Black.eot');
    src: url('../fonts/Roboto-Black.eot?#iefix') format('embedded-opentype'), url('../fonts/Roboto-Black.woff2') format('woff2'), url('../fonts/Roboto-Black.woff') format('woff');
    font-weight: 900;
    font-style: normal;
}

@font-face {
    font-family: 'Roboto';
    src: url('../fonts/Roboto-LightItalic.eot');
    src: url('../fonts/Roboto-LightItalic.eot?#iefix') format('embedded-opentype'), url('../fonts/Roboto-LightItalic.woff2') format('woff2'), url('../fonts/Roboto-LightItalic.woff') format('woff');
    font-weight: 300;
    font-style: italic;
}

@font-face {
    font-family: 'Roboto';
    src: url('../fonts/Roboto-Light.eot');
    src: url('../fonts/Roboto-Light.eot?#iefix') format('embedded-opentype'), url('../fonts/Roboto-Light.woff2') format('woff2'), url('../fonts/Roboto-Light.woff') format('woff');
    font-weight: 300;
    font-style: normal;
}

@font-face {
    font-family: 'Roboto';
    src: url('../fonts/Roboto-ThinItalic.eot');
    src: url('../fonts/Roboto-ThinItalic.eot?#iefix') format('embedded-opentype'), url('../fonts/Roboto-ThinItalic.woff2') format('woff2'), url('../fonts/Roboto-ThinItalic.woff') format('woff');
    font-weight: 100;
    font-style: italic;
}

@font-face {
    font-family: 'Roboto';
    src: url('../fonts/Roboto-Italic.eot');
    src: url('../fonts/Roboto-Italic.eot?#iefix') format('embedded-opentype'), url('../fonts/Roboto-Italic.woff2') format('woff2'), url('../fonts/Roboto-Italic.woff') format('woff');
    font-weight: normal;
    font-style: italic;
}

@font-face {
    font-family: 'Roboto';
    src: url('../fonts/Roboto-BlackItalic.eot');
    src: url('../fonts/Roboto-BlackItalic.eot?#iefix') format('embedded-opentype'), url('../fonts/Roboto-BlackItalic.woff2') format('woff2'), url('../fonts/Roboto-BlackItalic.woff') format('woff');
    font-weight: 900;
    font-style: italic;
}

@font-face {
    font-family: 'Roboto';
    src: url('../fonts/Roboto-BoldItalic.eot');
    src: url('../fonts/Roboto-BoldItalic.eot?#iefix') format('embedded-opentype'), url('../fonts/Roboto-BoldItalic.woff2') format('woff2'), url('../fonts/Roboto-BoldItalic.woff') format('woff');
    font-weight: bold;
    font-style: italic;
}

@font-face {
    font-family: 'Roboto';
    src: url('../fonts/Roboto-Medium.eot');
    src: url('../fonts/Roboto-Medium.eot?#iefix') format('embedded-opentype'), url('../fonts/Roboto-Medium.woff2') format('woff2'), url('../fonts/Roboto-Medium.woff') format('woff');
    font-weight: 500;
    font-style: normal;
}

/*$gutter: 30px;*/

*{
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  outline: none;
}

p {
  margin: 0;
  line-height: 1.4em;
  margin-bottom: 10px;
}

h1, h2, h3, h4, h5, h6 {
  margin: 0;
  font-weight: 700;
}

ul, ol {
  margin: 0;
  padding: 0;
  list-style: none;
}

a, button, input, label, select, textarea {
  outline: 0;
}

a {
  text-decoration: none;
}

button {
  cursor: pointer;
  border: 0;
  outline: 0;
  background: none;
  padding: 0;
  margin: 0;
}

/*! normalize.css v7.0.0 | MIT License | github.com/necolas/normalize.css */

/* Document
   ========================================================================== */

/**
 * 1. Correct the line height in all browsers.
 * 2. Prevent adjustments of font size after orientation changes in
 *    IE on Windows Phone and in iOS.
 */

html {
  line-height: 1.15; /* 1 */
  -ms-text-size-adjust: 100%; /* 2 */
  -webkit-text-size-adjust: 100%; /* 2 */
}

/* Sections
   ========================================================================== */

/**
 * Remove the margin in all browsers (opinionated).
 */

body {
  margin: 0;
}

/**
 * Add the correct display in IE 9-.
 */

article, aside, footer, header, nav, section {
  display: block;
}

/**
 * Correct the font size and margin on `h1` elements within `section` and
 * `article` contexts in Chrome, Firefox, and Safari.
 */

h1 {
  font-size: 2em;
  margin: 0.67em 0;
}

/* Grouping content
   ========================================================================== */

/**
 * Add the correct display in IE 9-.
 * 1. Add the correct display in IE.
 */

figcaption, figure, main { /* 1 */
  display: block;
}

/**
 * Add the correct margin in IE 8.
 */

figure {
  margin: 1em 40px;
}

/**
 * 1. Add the correct box sizing in Firefox.
 * 2. Show the overflow in Edge and IE.
 */

hr {
  -webkit-box-sizing: content-box;
  box-sizing: content-box; /* 1 */
  height: 0; /* 1 */
  overflow: visible; /* 2 */
}

/**
 * 1. Correct the inheritance and scaling of font size in all browsers.
 * 2. Correct the odd `em` font sizing in all browsers.
 */

pre {
  font-family: monospace, monospace; /* 1 */
  font-size: 1em; /* 2 */
}

/* Text-level semantics
   ========================================================================== */

/**
 * 1. Remove the gray background on active links in IE 10.
 * 2. Remove gaps in links underline in iOS 8+ and Safari 8+.
 */

a {
  background-color: transparent; /* 1 */
  -webkit-text-decoration-skip: objects; /* 2 */
}

/**
 * 1. Remove the bottom border in Chrome 57- and Firefox 39-.
 * 2. Add the correct text decoration in Chrome, Edge, IE, Opera, and Safari.
 */

abbr[title] {
  border-bottom: none; /* 1 */
  text-decoration: underline; /* 2 */
  -webkit-text-decoration: underline dotted;
  text-decoration: underline dotted; /* 2 */
}

/**
 * Prevent the duplicate application of `bolder` by the next rule in Safari 6.
 */

b, strong {
  font-weight: inherit;
}

/**
 * Add the correct font weight in Chrome, Edge, and Safari.
 */

b, strong {
  font-weight: bolder;
}

/**
 * 1. Correct the inheritance and scaling of font size in all browsers.
 * 2. Correct the odd `em` font sizing in all browsers.
 */

code, kbd, samp {
  font-family: monospace, monospace; /* 1 */
  font-size: 1em; /* 2 */
}

/**
 * Add the correct font style in Android 4.3-.
 */

dfn {
  font-style: italic;
}

/**
 * Add the correct background and color in IE 9-.
 */

mark {
  background-color: #ff0;
  color: #000;
}

/**
 * Add the correct font size in all browsers.
 */

small {
  font-size: 80%;
}

/**
 * Prevent `sub` and `sup` elements from affecting the line height in
 * all browsers.
 */

sub, sup {
  font-size: 75%;
  line-height: 0;
  position: relative;
  vertical-align: baseline;
}

sub {
  bottom: -0.25em;
}

sup {
  top: -0.5em;
}

/* Embedded content
   ========================================================================== */

/**
 * Add the correct display in IE 9-.
 */

audio, video {
  display: inline-block;
}

/**
 * Add the correct display in iOS 4-7.
 */

audio:not([controls]) {
  display: none;
  height: 0;
}

/**
 * Remove the border on images inside links in IE 10-.
 */

img {
  border-style: none;
}

/**
 * Hide the overflow in IE.
 */

svg:not(:root) {
  overflow: hidden;
}

/* Forms
   ========================================================================== */

/**
 * 1. Change the font styles in all browsers (opinionated).
 * 2. Remove the margin in Firefox and Safari.
 */

button, input, optgroup, select, textarea {
  font-family: sans-serif; /* 1 */
  font-size: 100%; /* 1 */
  line-height: 1.15; /* 1 */
  margin: 0; /* 2 */
}

/**
 * Show the overflow in IE.
 * 1. Show the overflow in Edge.
 */

button, input { /* 1 */
  overflow: visible;
}

/**
 * Remove the inheritance of text transform in Edge, Firefox, and IE.
 * 1. Remove the inheritance of text transform in Firefox.
 */

button, select { /* 1 */
  text-transform: none;
}

/**
 * 1. Prevent a WebKit bug where (2) destroys native `audio` and `video`
 *    controls in Android 4.
 * 2. Correct the inability to style clickable types in iOS and Safari.
 */

button, html [type="button"], [type="reset"], [type="submit"] {
  -webkit-appearance: button; /* 2 */
}

/**
 * Remove the inner border and padding in Firefox.
 */

button::-moz-focus-inner, [type="button"]::-moz-focus-inner, [type="reset"]::-moz-focus-inner, [type="submit"]::-moz-focus-inner {
  border-style: none;
  padding: 0;
}

/**
 * Restore the focus styles unset by the previous rule.
 */

button:-moz-focusring, [type="button"]:-moz-focusring, [type="reset"]:-moz-focusring, [type="submit"]:-moz-focusring {
  outline: 1px dotted ButtonText;
}

/**
 * Correct the padding in Firefox.
 */

fieldset {
  padding: 0.35em 0.75em 0.625em;
}

/**
 * 1. Correct the text wrapping in Edge and IE.
 * 2. Correct the color inheritance from `fieldset` elements in IE.
 * 3. Remove the padding so developers are not caught out when they zero out
 *    `fieldset` elements in all browsers.
 */

legend {
  -webkit-box-sizing: border-box;
  box-sizing: border-box; /* 1 */
  color: inherit; /* 2 */
  display: table; /* 1 */
  max-width: 100%; /* 1 */
  padding: 0; /* 3 */
  white-space: normal; /* 1 */
}

/**
 * 1. Add the correct display in IE 9-.
 * 2. Add the correct vertical alignment in Chrome, Firefox, and Opera.
 */

progress {
  display: inline-block; /* 1 */
  vertical-align: baseline; /* 2 */
}

/**
 * Remove the default vertical scrollbar in IE.
 */

textarea {
  overflow: auto;
}

/**
 * 1. Add the correct box sizing in IE 10-.
 * 2. Remove the padding in IE 10-.
 */

[type="checkbox"], [type="radio"] {
  -webkit-box-sizing: border-box;
  box-sizing: border-box; /* 1 */
  padding: 0; /* 2 */
}

/**
 * Correct the cursor style of increment and decrement buttons in Chrome.
 */

[type="number"]::-webkit-inner-spin-button, [type="number"]::-webkit-outer-spin-button {
  height: auto;
}

/**
 * 1. Correct the odd appearance in Chrome and Safari.
 * 2. Correct the outline style in Safari.
 */

[type="search"] {
  -webkit-appearance: textfield; /* 1 */
  outline-offset: -2px; /* 2 */
}

/**
 * Remove the inner padding and cancel buttons in Chrome and Safari on macOS.
 */

[type="search"]::-webkit-search-cancel-button, [type="search"]::-webkit-search-decoration {
  -webkit-appearance: none;
}

/**
 * 1. Correct the inability to style clickable types in iOS and Safari.
 * 2. Change font properties to `inherit` in Safari.
 */

::-webkit-file-upload-button {
  -webkit-appearance: button; /* 1 */
  font: inherit; /* 2 */
}

/* Interactive
   ========================================================================== */

/*
 * Add the correct display in IE 9-.
 * 1. Add the correct display in Edge, IE, and Firefox.
 */

details, menu {
  display: block;
}

/*
 * Add the correct display in all browsers.
 */

summary {
  display: list-item;
}

/* Scripting
   ========================================================================== */

/**
 * Add the correct display in IE 9-.
 */

canvas {
  display: inline-block;
}

/**
 * Add the correct display in IE.
 */

template {
  display: none;
}

/* Hidden
   ========================================================================== */

/**
 * Add the correct display in IE 10-.
 */

[hidden] {
  display: none;
}

/*@import "helpers/animate";*/

/**
 * Owl Carousel v2.3.4
 * Copyright 2013-2018 David Deutsch
 * Licensed under: SEE LICENSE IN https://github.com/OwlCarousel2/OwlCarousel2/blob/master/LICENSE
 */

/*
 *  Owl Carousel - Core
 */

.owl-carousel {
  display: none;
  width: 100%;
  -webkit-tap-highlight-color: transparent;
  /* position relative and z-index fix webkit rendering fonts issue */
  position: relative;
  z-index: 1; }

.owl-carousel .owl-stage {
    position: relative;
    -ms-touch-action: pan-Y;
    touch-action: manipulation;
    -moz-backface-visibility: hidden;
    /* fix firefox animation glitch */ }

.owl-carousel .owl-stage:after {
    content: ".";
    display: block;
    clear: both;
    visibility: hidden;
    line-height: 0;
    height: 0; }

.owl-carousel .owl-stage-outer {
    position: relative;
    overflow: hidden;
    /* fix for flashing background */
    -webkit-transform: translate3d(0px, 0px, 0px); }

.owl-carousel .owl-wrapper, .owl-carousel .owl-item {
    -webkit-backface-visibility: hidden;
    -moz-backface-visibility: hidden;
    -ms-backface-visibility: hidden;
    -webkit-transform: translate3d(0, 0, 0);
    -moz-transform: translate3d(0, 0, 0);
    -ms-transform: translate3d(0, 0, 0); }

.owl-carousel .owl-item {
    position: relative;
    min-height: 1px;
    float: left;
    -webkit-backface-visibility: hidden;
    -webkit-tap-highlight-color: transparent;
    -webkit-touch-callout: none; }

.owl-carousel .owl-item img {
    display: block;
    width: 100%; }

.owl-carousel .owl-nav.disabled, .owl-carousel .owl-dots.disabled {
    display: none; }

.owl-carousel .owl-nav .owl-prev, .owl-carousel .owl-nav .owl-next, .owl-carousel .owl-dot {
    cursor: pointer;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none; }

.owl-carousel .owl-nav button.owl-prev, .owl-carousel .owl-nav button.owl-next, .owl-carousel button.owl-dot {
    background: none;
    color: inherit;
    border: none;
    padding: 0 !important;
    font: inherit; }

.owl-carousel.owl-loaded {
    display: block; }

.owl-carousel.owl-loading {
    opacity: 0;
    display: block; }

.owl-carousel.owl-hidden {
    opacity: 0; }

.owl-carousel.owl-refresh .owl-item {
    visibility: hidden; }

.owl-carousel.owl-drag .owl-item {
    -ms-touch-action: pan-y;
        touch-action: pan-y;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none; }

.owl-carousel.owl-grab {
    cursor: move;
    cursor: -webkit-grab;
    cursor: grab; }

.owl-carousel.owl-rtl {
    direction: rtl; }

.owl-carousel.owl-rtl .owl-item {
    float: right; }

/* No Js */

.no-js .owl-carousel {
  display: block; }

/*
 *  Owl Carousel - Animate Plugin
 */

.owl-carousel .animated {
  -webkit-animation-duration: 1000ms;
  animation-duration: 1000ms;
  -webkit-animation-fill-mode: both;
  animation-fill-mode: both; }

.owl-carousel .owl-animated-in {
  z-index: 0; }

.owl-carousel .owl-animated-out {
  z-index: 1; }

.owl-carousel .fadeOut {
  -webkit-animation-name: fadeOut;
  animation-name: fadeOut; }

@-webkit-keyframes fadeOut {
  0% {
    opacity: 1; }
  100% {
    opacity: 0; } }

@keyframes fadeOut {
  0% {
    opacity: 1; }
  100% {
    opacity: 0; } }

/*
 * 	Owl Carousel - Auto Height Plugin
 */

.owl-height {
  -webkit-transition: height 500ms ease-in-out;
  -o-transition: height 500ms ease-in-out;
  transition: height 500ms ease-in-out; }

/*
 * 	Owl Carousel - Lazy Load Plugin
 */

.owl-carousel .owl-item {
  /**
			This is introduced due to a bug in IE11 where lazy loading combined with autoheight plugin causes a wrong
			calculation of the height of the owl-item that breaks page layouts
		 */ }

.owl-carousel .owl-item .owl-lazy {
    opacity: 0;
    -webkit-transition: opacity 400ms ease;
    -o-transition: opacity 400ms ease;
    transition: opacity 400ms ease; }

.owl-carousel .owl-item .owl-lazy[src^=""], .owl-carousel .owl-item .owl-lazy:not([src]) {
    max-height: 0; }

.owl-carousel .owl-item img.owl-lazy {
    -webkit-transform-style: preserve-3d;
    transform-style: preserve-3d; }

/*
 * 	Owl Carousel - Video Plugin
 */

.owl-carousel .owl-video-wrapper {
  position: relative;
  height: 100%;
  background: #000; }

.owl-carousel .owl-video-play-icon {
  position: absolute;
  height: 80px;
  width: 80px;
  left: 50%;
  top: 50%;
  margin-left: -40px;
  margin-top: -40px;
  background: url("owl.video.play.png") no-repeat;
  cursor: pointer;
  z-index: 1;
  -webkit-backface-visibility: hidden;
  -webkit-transition: -webkit-transform 100ms ease;
  transition: -webkit-transform 100ms ease;
  -o-transition: transform 100ms ease;
  transition: transform 100ms ease;
  transition: transform 100ms ease, -webkit-transform 100ms ease; }

.owl-carousel .owl-video-play-icon:hover {
  -ms-transform: scale(1.3, 1.3);
      -webkit-transform: scale(1.3, 1.3);
      transform: scale(1.3, 1.3); }

.owl-carousel .owl-video-playing .owl-video-tn, .owl-carousel .owl-video-playing .owl-video-play-icon {
  display: none; }

.owl-carousel .owl-video-tn {
  opacity: 0;
  height: 100%;
  background-position: center center;
  background-repeat: no-repeat;
  background-size: contain;
  -webkit-transition: opacity 400ms ease;
  -o-transition: opacity 400ms ease;
  transition: opacity 400ms ease; }

.owl-carousel .owl-video-frame {
  position: relative;
  z-index: 1;
  height: 100%;
  width: 100%; }

.owl-theme {
  /*.owl-nav.disabled+.owl-dots {
    margin-top: 10px;
  }*/
  /*.owl-dots {
    text-align: center;
    -webkit-tap-highlight-color: transparent;
    .owl-dot {
      display: inline-block;
      zoom: 1;
      *display: inline;
      span {
        width: $dot-width;
        height: $dot-height;
        margin: $dot-margin;
        background: $dot-background;
        display: block;
        -webkit-backface-visibility: visible;
        transition: opacity 200ms ease;
        border-radius: 30px;
      }
      &.active, &:hover {
        span {
          background: $dot-background-active;
        }
      }
    }
  }*/
}

.owl-theme .owl-nav {
    position: absolute;
    bottom: 20px;
    right: 20px;
    text-align: center;
    -webkit-tap-highlight-color: transparent;
  }

.owl-theme .owl-nav [class*='owl-'] {
      color: #FFF;
      font-size: 0px;
      margin: 5px;
      padding: 4px 7px;
      background: #D6D6D6;
      display: inline-block;
      cursor: pointer;
      position: relative;
      width: 9px;
      -webkit-transition: 0.3s;
      -o-transition: 0.3s;
      transition: 0.3s;
    }

.owl-theme .owl-nav [class*='owl-'] span {
        font-size: 0px;
      }

.owl-theme .owl-nav [class*='owl-']:after {
    position: absolute;
    content: '';
    top: 50%;
    left: 0;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
    width: 0;
    height: 0;
    border-style: solid;
    -webkit-transition: 0.3s;
    -o-transition: 0.3s;
    transition: 0.3s;
}

.owl-theme .owl-nav [class*='owl-']:hover {}

.owl-theme .owl-nav .owl-prev:after {
    border-width: 7.5px 8px 7.5px 0;
    border-color: transparent #000000 transparent transparent;
}

.owl-theme .owl-nav .owl-prev:hover:after {
    border-color: transparent #ff0000 transparent transparent;
}

.owl-theme .owl-nav .owl-next:after {
    border-width: 7.5px 0 7.5px 8px;
    border-color: transparent transparent transparent #000000;
}

.owl-theme .owl-nav .owl-next:hover:after {
    border-color: transparent transparent transparent #ff0000;
}

.owl-theme .owl-nav .disabled {
      opacity: 0.5;
      cursor: default;
    }

.tab-content >.tab-pane {
    display: none;
  }

.tab-content >.active {
    display: block;
  }

body {
  font-family: "Roboto", sans-serif;
}

.page-title {}

.textblock h1 {
    font-family: "Roboto";
    font-size: 26px;
    line-height: 1.1538461538;
    font-weight: 700;
    color: #000000;
    text-transform: uppercase;
    margin-top: 0px;
    margin-bottom: 15px;
  }

.textblock h2 {
    font-family: "Roboto";
    font-size: 20px;
    line-height: 1.2;
    font-weight: 700;
    color: #000000;
    text-transform: uppercase;
    margin-bottom: 15px;
  }

.textblock h3 {
    font-family: "Roboto";
    font-size: 18px;
    line-height: 1.1666666667;
    font-weight: 700;
    color: #000000;
    margin-bottom: 15px;
  }

.textblock p {
    font-family: "Roboto";
    font-size: 14px;
    line-height: 1.1428571429;
    font-weight: 400;
    color: #000000;
    margin-bottom: 15px;
  }

.textblock ul {
    font-family: "Roboto";
    font-size: 14px;
    line-height: 1.1428571429;
    font-weight: 400;
    color: #000000;
    margin-bottom: 15px;
  }

.textblock ul li {
      position: relative;
      padding-left: 15px;
      margin-bottom: 5px
    }

.textblock ul li:after {
    position: absolute;
    content: '';
    top: 1px;
    left: 0;
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 5.5px 0 5.5px 6px;
    border-color: transparent transparent transparent #ff0000;
}

.textblock ol {
    font-family: "Roboto";
    font-size: 14px;
    line-height: 1.1428571429;
    font-weight: 400;
    color: #000000;
    list-style-type: none;
    counter-reset: num;
    margin-bottom: 15px;
  }

.textblock ol li {
      position: relative;
      margin-bottom: 5px
    }

.textblock ol li:before {
    content: counter(num) '. ';
    counter-increment: num;
    color: #ff0000;
    font-weight: 700;
}

.button {
  font-family: "Roboto";
  font-size: 16px;
  font-weight: 900;
  line-height: 42px;
  height: 42px;
  text-decoration: none;
  text-transform: uppercase;
  text-align: center;
  color: #ffffff;
  border-radius: 0px;
  display: inline-block;
  padding: 0 13px;
  -webkit-transition: 0.3s;
  -o-transition: 0.3s;
  transition: 0.3s;
}

.button--red {
    background-color: #ff0000
  }

.button--red:hover {
    background-color: #000000;
}

.button--black {
    background-color: #000000
  }

.button--black:hover {
    background-color: #ff0000;
}

.form {
  position: relative;
}

.form__inputgroup, .form__textareagroup {
    position: relative;
    margin-bottom: 15px;
  }

.form__inputgroup label, .form__textareagroup label {
      color: #000000;
      font-size: 12px;
      font-weight: 500;
      line-height: 1.42;
      margin-bottom: 10px;
      display: block;
      text-transform: uppercase;
    }

.form__input, .form__textarea {
    color: #000000;
    font-size: 16px;
    font-weight: 400;
    line-height: 1.8;
    background-color: transparent;
    border: 1px solid #c6c6c6;
    display: block;
    width: 100%;
    padding: 0 20px
  }

.form__input::-webkit-input-placeholder, .form__textarea::-webkit-input-placeholder {
    color: rgba(0, 0, 0, 1);
}

.form__input::-moz-placeholder, .form__textarea::-moz-placeholder {
    color: rgba(0, 0, 0, 1);
}

.form__input:-moz-placeholder, .form__textarea:-moz-placeholder {
    color: rgba(0, 0, 0, 1);
}

.form__input:-ms-input-placeholder, .form__textarea:-ms-input-placeholder {
    color: rgba(0, 0, 0, 1);
}

.form__input:focus::-webkit-input-placeholder, .form__textarea:focus::-webkit-input-placeholder {
    color: transparent;
}

.form__input:focus.form__input::-moz-placeholder, .form__textarea:focus.form__textarea::-moz-placeholder {
      color: transparent;
}

.form__input:focus.form__input:-moz-placeholder, .form__textarea:focus.form__textarea:-moz-placeholder {
      color: transparent;
}

.form__input:focus.form__input:-ms-input-placeholder, .form__textarea:focus.form__textarea:-ms-input-placeholder {
      color: transparent;
}

.form__textarea {
    height: auto;
    resize: none;
  }

.form__selectgroup {
    position: relative;
    display: inline-block;
  }

.form__selectgroup .svg {
      font-size: 10px;
      fill: #000000;
    }

.form__selectgroup label {
      color: #000000;
      font-size: 12px;
      font-weight: 700;
      line-height: 1.42;
      margin-bottom: 10px;
      text-transform: uppercase;
    }

.form__selectgroup:after {
    position: absolute;
    content: '';
    top: 50%;
    right: 10px;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 6px 6px 0 6px;
    border-color: #333333 transparent transparent transparent;
}

.form__select {
    background: transparent;
    border: none;
    color: #000000;
    font-size: 16px;
    font-weight: 400;
    line-height: 1.8;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    cursor: pointer;
    position: relative;
    border: 1px solid #c6c6c6;
    background: #ffffff;
    border-radius: 0px;
    padding: 0 30px 0 10px;
  }

.container {
  padding: 0 15px;
  margin: 0 auto;
}

.row {
  margin: 0 -15px;
}

.row:before, .row:after {
    content: " ";
    display: table;
}

.row:after {
    clear: both;
}

.col {
  float: left;
  padding: 0 15px;
}

.xs-offset--0 {
    margin-left: 0;
  }

.xs--1 {
      width: 8.33333333%;
    }

.xs-offset--1 {
      margin-left: 8.33333333%;
    }

.xs--2 {
      width: 16.66666667%;
    }

.xs-offset--2 {
      margin-left: 16.66666667%;
    }

.xs--3 {
      width: 25%;
    }

.xs-offset--3 {
      margin-left: 25%;
    }

.xs--4 {
      width: 33.33333333%;
    }

.xs-offset--4 {
      margin-left: 33.33333333%;
    }

.xs--5 {
      width: 41.66666667%;
    }

.xs-offset--5 {
      margin-left: 41.66666667%;
    }

.xs--6 {
      width: 50%;
    }

.xs-offset--6 {
      margin-left: 50%;
    }

.xs--7 {
      width: 58.33333333%;
    }

.xs-offset--7 {
      margin-left: 58.33333333%;
    }

.xs--8 {
      width: 66.66666667%;
    }

.xs-offset--8 {
      margin-left: 66.66666667%;
    }

.xs--9 {
      width: 75%;
    }

.xs-offset--9 {
      margin-left: 75%;
    }

.xs--10 {
      width: 83.33333333%;
    }

.xs-offset--10 {
      margin-left: 83.33333333%;
    }

.xs--11 {
      width: 91.66666667%;
    }

.xs-offset--11 {
      margin-left: 91.66666667%;
    }

.xs--12 {
      width: 100%;
    }

.xs-offset--12 {
      margin-left: 100%;
    }

.svg-arrow-down {
  width: 1em;
  height: 1em;
  fill: initial;
}

.svg-arrow-left {
  width: 0.54em;
  height: 1em;
  fill: initial;
}

.svg-arrow-right {
  width: 0.54em;
  height: 1em;
  fill: initial;
}

.svg-close {
  width: 1em;
  height: 1em;
  fill: #1D1D1B;
}

.svg-grid {
  width: 1em;
  height: 1em;
  fill: initial;
}

.svg-home {
  width: 1em;
  height: 1em;
  fill: #030104;
}

.svg-list {
  width: 1em;
  height: 1em;
  fill: initial;
}

.svg-remove {
  width: 1em;
  height: 1em;
  fill: initial;
}

/* start component "main" */

.main {
  background: url("../images/bg-top.png");
  background-repeat: repeat-x;
  background-position: top;
  min-height: 100vh;
}

/* end component "main" */

/* start component "header" */

.header:before, .header:after {
    content: " ";
    display: table;
}

.header:after {
    clear: both;
}

.header {
    background: #ffffff;
    padding: 20px 0;
}

.header__left {
    float: left;
    margin-top: 14px;
}

.header__contact {
    color: #ff0000;
    font-size: 16px;
    font-weight: 700;
    line-height: 24px;
    text-transform: uppercase;
    -webkit-transition: 0.3s;
    -o-transition: 0.3s;
    transition: 0.3s;
}

.header__contact:not(:last-child) {
    margin-right: 10px;
}

.header__contact:hover {
    color: #000000;
}

.header__contact_phone {
    color: #000000;
    font-size: 16px;
    font-weight: 700;
    line-height: 24px;
    text-transform: uppercase;
    -webkit-transition: 0.3s;
    -o-transition: 0.3s;
    transition: 0.3s;
}

.header__contact_phone:hover {
    color: #ff0000;
}


.header__right {
    float: right;
    color: #000000;
    font-size: 13px;
    font-weight: 400;
    line-height: 24px;
}

.header .form__selectgroup {
    display: inline;
    margin-left: 30px;
}

.header__right .phones {
	text-align: right; 	
} 

.header__right .callback {
	text-align: right;
}

.header__right .callback a {
	color: #ff0000;
	text-decoration: none;
	border-bottom: 1px dashed #ff0000;
}

.header__right .callback a:hover {
	border-bottom: 0;
}

/* end component "header" */

/* start component "footer" */

.footer {
  background-color: #000000;
  background-image: url("../images/bg-top.png");
  background-repeat: repeat-x;
  background-position: top;
  padding-top: 40px;
}

.footer__title {
    color: #ffffff;
    font-size: 16px;
    font-weight: 700;
    line-height: 22px;
    text-transform: uppercase;
    margin-bottom: 30px;
}

.footer__link {
    font-size: 13px;
    font-weight: 700;
    line-height: 27px;
    text-transform: uppercase;
    color: #777777;
    position: relative;
    padding-left: 15px;
}

.footer__link:after {
    position: absolute;
    content: '';
    top: 50%;
    left: 0;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 5.5px 0 5.5px 6px;
    border-color: transparent transparent transparent #ff0000;
}

.footer__link:hover {
    color: #ff0000;
}

.footer__link:hover:after {
    border-color: transparent transparent transparent #ffffff;
}

.footer__copy {
    border-top: 1px solid #262626;
    padding-top: 12px;
    padding-bottom: 20px;
    color: rgba(119, 119, 119, 0.9);
    font-size: 10px;
    font-weight: 400;
    line-height: 28px;
}

.footer__subtitle {
    font-size: 13px;
    line-height: 27px;
    color: #ffffff;
    font-weight: 700;
    text-transform: uppercase;
}

.footer__address {
    font-size: 13px;
    line-height: 27px;
    color: #777777;
    font-weight: 400;
}

.footer__address a {
    color: #ffffff;
}

.footer__phone a {
    font-size: 13px;
    line-height: 27px;
    color: #ffffff;
    font-weight: 700;
}

.footer__mail {
    font-size: 13px;
    line-height: 27px;
    color: #777777;
    font-weight: 700;
    text-transform: uppercase;
}

.footer__mail a {
      color: #ff0000;
      text-transform: none;
    }

/* end component "footer" */

/* start component "card" */

.card {
  padding: 20px;
  border: 1px solid #c6c6c6;
  margin-bottom: 30px;
  position: relative;
}

.card .card-shields {
	position: absolute;
	right: -5px;
	top: 5px;
	z-index: 100;	
}

.product-shields {
	text-align: right;
}

.card .card-shields div, 
.product-shields div {
	text-align: right;
	margin-bottom: 5px;
}
.card .card-shields div span, 
.product-shields div span  {
	padding: 3px 10px 3px 10px;
	display: inline-block;
}

.card .card-shields div.new-shield span, 
.product-shields div.new-shield span {
	background-color: #f00; 
	font-size: 14px;
	text-transform: uppercase;
	color: #fff; 
		font-weight: bold;
} 

.card .card-shields div.recomend-shield span,
.product-shields div.recomend-shield span {
	background-color: #00f; 
	font-size: 14px;
	text-transform: uppercase;
	color: #fff; 
	font-weight: bold;
} 

.card .card-shields div.hit-shield span, 
.product-shields div.hit-shield span {
	background-color: #0f0; 
	font-size: 14px;
	text-transform: uppercase;
	color: #000; 
	font-weight: bold;
} 

.card__image {
    position: relative;
    width: 200px;
    height: 200px;
    display: block;
    margin: 0 auto;
    margin-bottom: 10px;
  }

.card__image img {
      position: absolute;
      top: 50%;
      left: 50%;
      -webkit-transform: translate(-50%, -50%);
      -ms-transform: translate(-50%, -50%);
      transform: translate(-50%, -50%);
      max-width: 100%;
      max-height: 100%;
    }

.card__price {
    color: #ff0000;
    font-size: 21px;
    font-weight: 700;
    line-height: 24px;
    text-transform: uppercase;
    margin-bottom: 10px;
  }

.card-container {
	height: 150px;
	overflow:hidden;
}

.card__name {
    color: #ff0000;
    font-size: 15px;
    font-weight: 700;
    line-height: 22px;
    text-transform: uppercase;
    margin-bottom: 10px;
    overflow: hidden;
    -webkit-transition: color 0.3s;
    -o-transition: color 0.3s;
    transition: color 0.3s;
    display: inline-block;
    margin-bottom: 4px;
  }

.card__name:hover {
    color: #000000;
}

.card__description {
    color: #777777;
    font-size: 13px;
    font-weight: 400;
    line-height: 19px;
    margin-bottom: 10px;
    height: 57px;
    overflow: hidden;
  }
  
 .card__manufacturer a {
	color: #000000;
    position: relative;
    -webkit-transition: 0.3s;
    -o-transition: 0.3s;
    transition: 0.3s;
	text-transform: uppercase;
	font-size: 15px;
	font-weight: bold;	 
 } 
  

.card__button {
    margin-bottom: 15px;
  }

.card__button .button.in-basket {
      background-color: #000000;
    }

.card__link {
    color: #000000;
    font-size: 16px;
    font-weight: 700;
    line-height: 28px;
    text-transform: uppercase;
  }

.card__link a {
      color: #000000;
      position: relative;
      -webkit-transition: 0.3s;
      -o-transition: 0.3s;
      transition: 0.3s
    }

.card__link a:hover {
    color: #ff0000;
}

.card__link a:hover:after {
    right: -9px;
}

.card__link a:hover:before {
    opacity: 1;
    right: -14px;
}

.card__link a:after {
    position: absolute;
    content: '';
    top: 50%;
    right: -11px;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 5.5px 0 5.5px 6px;
    border-color: transparent transparent transparent #ff0000;
    -webkit-transition: 0.3s;
    -o-transition: 0.3s;
    transition: 0.3s;
}

.card__link a:before {
    position: absolute;
    content: '';
    top: 50%;
    right: -20px;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 5.5px 0 5.5px 6px;
    border-color: transparent transparent transparent #ff0000;
    -webkit-transition: 0.3s;
    -o-transition: 0.3s;
    transition: 0.3s;
    opacity: 0;
}

.card__bottom:before, .card__bottom:after {
    content: " ";
    display: table;
}

.card__bottom:after {
    clear: both;
}

.card .counter {
    float: left;
    margin-right: 15px;
    margin-top: 10px;
  }

.item-info .counter {
	margin-bottom: 10px;
}

.is-vertical .card:before, .is-vertical .card:after {
    content: " ";
    display: table;
}

.is-vertical .card:after {
    clear: both;
}

/* end component "card" */

/* start component "top" */

.top:before, .top:after {
    content: " ";
    display: table;
}

.top:after {
    clear: both;
}

.top {
    padding: 30px 0;
}

.top__logo {
    margin-top: 0;
    margin-bottom: 10px;
    text-align: center;
    position: relative;
}

.top_slogan {
	text-transform: uppercase;
	color: #ff0000;
	font-family: Roboto, Sans-serif;
	position: relative;
	top: -8px;
	font-size: 20px;
}

.top__logo img {
      max-width: 340px;
     
    }

.top__left {
    padding-right: 30px;
    padding-top: 10px;
    text-transform: uppercase;
    margin-bottom: 10px;
}

.top__right {
    font-size: 16px;
    font-weight: 700;
    line-height: 25px;
    text-transform: uppercase;
    color: #000000;
    position: relative;
}

.top__sign {
    color: #ff0000;
    margin-bottom: 5px;
    display: inline-block;
    -webkit-transition: 0.3s;
    -o-transition: 0.3s;
    transition: 0.3s;
}

.top__sign:hover {
    color: #000000;
}

.top__account {
    color: #ffffff;
    -webkit-transition: 0.3s;
    -o-transition: 0.3s;
    transition: 0.3s;
}

.top__account:hover {
    color: #000000;
}

.top__basket {
    width: 100%;
    height: 63px;
    -webkit-box-shadow: 0 1px 16px rgba(0, 0, 0, 0.14);
    box-shadow: 0 1px 16px rgba(0, 0, 0, 0.14);
    background: #ffffff;
    padding: 20px 25px;
    cursor: pointer;
    margin: 0 auto;
    position: relative;
}



.top__basket:after {
    position: absolute;
    content: '';
    top: 50%;
    right: 20px;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 6px 6px 0 6px;
    border-color: #777777 transparent transparent transparent;
}

.top__basket.is-open:after {
    border-width: 0 6px 6px 6px;
    border-color: transparent transparent #777777 transparent;
}


.cart-element-is-empty .top__basket:after {
	 border-color: transparent transparent transparent transparent;

}


.top__cart {
    color: #ff0000;
}

.top__status {
    color: #000000;
    font-size: 13px;
    font-weight: 400;
    line-height: 24px;
    text-transform: none;
    margin-left: 10px;
}

/* end component "top" */

/* start component "cards" */

.cards__tabs {
    border-bottom: 1px solid #c6c6c6;
    margin-bottom: 30px;
  }

.cards__tab {
    display: block;
    padding: 5px 0;
  }

.cards__tab:not(:last-child) {
    margin-right: 30px;
}

.cards__tab.active .cards__link {
        color: #010000;
}

.cards__link {
    font-size: 23px;
    font-weight: 700;
    line-height: 24px;
    text-transform: uppercase;
    color: #929292;

    -webkit-transition: 0.3s;

    -o-transition: 0.3s;

    transition: 0.3s;
}

/* end component "cards" */

/* start component "items" */

.items:before, .items:after {
    content: " ";
    display: table;
}

.items:after {
    clear: both;
}

.items__block {
    width: 100%;
    float: left;
    margin-bottom: 15px;
    display: block;
}

.items__item {
    background: #ffffff;

    background-position: right 50%;
    background-repeat: no-repeat;
    border: 1px solid #c6c6c6;
    width: 100%;
    position: relative;
    padding: 20px;

    /*&:after {
      position: absolute;
      content: '';
      top: 0;
      left: 0;
      right: 0;
      bottom: 0;
      background: rgba(255,255,255,0);
      transition: 0.3s;
    }*/
}

.items__item:hover {

    /*&:after {
        background: rgba(255,255,255,0.4);
      }*/
}

.items__item:hover .items__link {
        opacity: 1;
}

.items__item:hover .items__name {
        color: #ff0000;
}

.items__item:hover .items__name span {
          color: #000000;
        }

.items__link {
    position: absolute;
    top: 50%;
    right: 50px;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
    color: #ffffff;
    font-size: 16px;
    font-weight: 700;
    line-height: 28px;
    text-transform: uppercase;
    background: rgba(0, 0, 0, 0.9);
    padding: 10px;
    z-index: 2;
    opacity: 0;
    -webkit-transition: 0.3s;
    -o-transition: 0.3s;
    transition: 0.3s;
}

.items__link:hover {
    background-color: #ff0000;
}

.items__title {
    height: 99px;
    overflow: hidden;
}

.items__name {
    font-size: 30px;
    font-weight: 900;
    line-height: 33px;
    color: #000000;
    -webkit-transition: 0.3s;
    -o-transition: 0.3s;
    transition: 0.3s;
    display: table-cell;
    vertical-align: middle;
    height: 99px;
}

.items__name span {
      color: #ff0000;
      display: block;
      -webkit-transition: 0.3s;
      -o-transition: 0.3s;
      transition: 0.3s;
    }

/* end component "items" */

/* start component "slider" */

.slider {
  border: 1px solid #c6c6c6;
  position: relative;
  margin-bottom: 30px;
}

.slider__item {
    padding: 20px;
    position: relative;
    background-size: cover;
    background-repeat: no-repeat;
  }

.slider__item:hover .slider__title {
        color: #000000;
}

.slider__item:hover .slider__subtitle {
        color: #ff0000;
}

.slider__item:hover .slider__text {
        -webkit-transform: translateY(150px);
        -ms-transform: translateY(150px);
        transform: translateY(150px);
        opacity: 0;
}

.slider__item:hover .slider__link {
        -webkit-transform: translateY(0);
        -ms-transform: translateY(0);
        transform: translateY(0);
        opacity: 1;
}

.slider__image {
    position: absolute;
    top: 10px;
    right: 10px;
    width: 100px !important;
    z-index: 1;
    opacity: 0.7;
}

.slider__title {
    color: #ff0000;
    font-size: 40px;
    font-weight: 700;
    line-height: 1;
    text-transform: uppercase;
    margin-bottom: 20px;
    height: 80px;
    overflow: hidden;
    position: relative;
    z-index: 2;
    -webkit-transition: 0.3s;
    -o-transition: 0.3s;
    transition: 0.3s;
}

.slider__subtitle {
    color: #000000;
    font-size: 20px;
    font-weight: 900;
    line-height: 1;
    text-transform: uppercase;
    margin-bottom: 15px;
    height: 40px;
    overflow: hidden;
    max-width: 395px;
    position: relative;
    z-index: 2;
    -webkit-transition: 0.3s;
    -o-transition: 0.3s;
    transition: 0.3s;
}

.slider__text {
    color: rgba(0, 0, 0, 0.5);
    font-size: 13px;
    font-weight: 700;
    line-height: 18px;
    text-transform: uppercase;
    height: 36px;
    overflow: hidden;
    max-width: 370px;
    position: relative;
    z-index: 2;
    -webkit-transition: 0.3s;
    -o-transition: 0.3s;
    transition: 0.3s;
    opacity: 1;
}

.slider__link {
    color: #ffffff;
    font-size: 16px;
    font-weight: 700;
    line-height: 28px;
    text-transform: uppercase;
    background: rgba(0, 0, 0, 0.9);
    padding: 10px;
    -webkit-transition: 0.3s;
    -o-transition: 0.3s;
    transition: 0.3s;
    opacity: 0;
    -webkit-transform: translateY(150px);
    -ms-transform: translateY(150px);
    transform: translateY(150px);
    display: inline-block;
}

.slider__link:hover {
    background-color: #ff0000;
}

/* end component "slider" */

/* start component "search" */

.search {
  background: #000000;
  padding: 8px;
  margin-bottom: 30px;
}

.search__block {
    background: #ffffff;
    position: relative;
    display: table;
    width: 100%;
  }

.search__input {
    display: table-cell;
  }

.search__input input {
      width: 100%;
      height: 35px;
      padding: 0 10px;
    }

.search__button {
    display: table-cell;
    width: 100px;
  }

.search__button button {
      text-align: center;
      color: #ffffff;
      font-size: 16px;
      font-weight: 700;
      line-height: 24px;
      text-transform: uppercase;
      background-color: #ff0000;
      display: block;
      width: 100%;
      height: 35px;
      -webkit-transition: 0.3s;
      -o-transition: 0.3s;
      transition: 0.3s
    }

.search__button button:hover {
    color: #ff0000;
    background-color: #000000;
}

/* end component "search" */

/* start component "catalog" */

.catalog {
  margin-bottom: 15px;
}

.catalog__title {
    color: #ffffff;
    font-size: 23px;
    font-weight: 700;
    line-height: 24px;
    text-transform: uppercase;
    background-color: #ff0000;
    padding: 15px;
  }
.catalog__title a, .catalog__title a:hover  {
    color: #ffffff;
	text-decoration: none;
}

.catalog__list {
    display: none
  }

.catalog__list.is-visible {
    display: block;
}

.catalog__item {
    padding: 15px 15px;
}

.catalog__item:not(:last-child) {
    border-bottom: 1px solid #c6c6c6;
}

.catalog__item.is-sublist {
    padding-right: 30px;
    position: relative;
}

.catalog__arrow .svg {
      position: absolute;
      top: 15px;
      right: 10px;
      fill: #000000;
      -webkit-transition: 0.3s;
      -o-transition: 0.3s;
      transition: 0.3s
    }

.catalog__arrow .svg.is-rotate {
    -webkit-transform: rotate(180deg);
    -ms-transform: rotate(180deg);
    transform: rotate(180deg);
    fill: #ff0000;
}

.catalog__arrow:hover .svg {
        fill: #ff0000;
}

.catalog__link {
    font-size: 16px;
    font-weight: 700;
    line-height: 1.2;
    text-transform: uppercase;
    color: #000000;
    -webkit-transition: 0.3s;
    -o-transition: 0.3s;
    transition: 0.3s;
}

.catalog__link:hover, .catalog__link.is-open, 
.catalog__item.is-sublist .catalog__link {
    color: #ff0000;
}

.catalog__sublist {
    padding-top: 10px;
    /*display: none;
    &.is-visible {
      display: block;
    }*/
}

.catalog__subitem {
    padding: 5px 0;
}

.catalog__sublink {
    font-size: 13px;
    font-weight: 700;
    line-height: 1.4;
    text-transform: uppercase;
    color: black;
    position: relative;
    padding-left: 15px;
    -webkit-transition: 0.3s;
    -o-transition: 0.3s;
    transition: 0.3s;
    display: inline-block;
    
}

.catalog__sublink:hover, 
.catalog__subitem.active .catalog__sublink {
    color: #ff0000;
}

.catalog__sublink:after {
    position: absolute;
    content: '';
    top: 1px;
    left: 0;
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 5.5px 0 5.5px 6px;
    border-color: transparent transparent transparent #ff0000;
}

/* end component "catalog" */

/* start component "banner" */

.banner {
  padding: 15px;
  border: 1px solid #c6c6c6;
  padding-bottom: 160px;
  background-image: url('../images/banner.png');
  background-repeat: no-repeat;
  background-position: right bottom;
  background-size: 200px;
  margin-bottom: 30px;
  display: block;
}

.banner__title {
    font-size: 44px;
    font-weight: 900;
    line-height: 41px;
    text-transform: uppercase;
    color: #000000;
    margin-bottom: 10px;
}

.banner__title span {
      color: #ff0000;
    }

.banner__subtitle {
    color: #ff0000;
    font-size: 22px;
    font-weight: 700;
    line-height: 22px;
    text-transform: uppercase;
    margin-bottom: 10px;
}

.banner__text {
    color: #000000;
    font-size: 16px;
    font-weight: 700;
    line-height: 22px;
    text-transform: uppercase;
    max-width: 150px;
}

/* end component "banner" */

/* start component "special" */

.special {
  margin-bottom: 30px;
}

.special__title {
    color: #ff0000;
    font-size: 23px;
    font-weight: 700;
    line-height: 1;
    padding-bottom: 10px;
    text-transform: uppercase;
    margin-bottom: 5px;
    margin-top: 30px;
}

.special__block {
    border: 1px solid #ff0000;
    padding: 20px;
    display: block;
    margin-bottom: 30px;
}

.special__image {
    position: relative;
    height: 180px;
    margin-bottom: 30px;
    display: block;
}

.special__image img {
      position: absolute;
      top: 50%;
      left: 50%;
      -webkit-transform: translate(-50%, -50%);
      -ms-transform: translate(-50%, -50%);
      transform: translate(-50%, -50%);
      max-width: 100%;
      max-height: 180px;
    }

.special__price {
    font-weight: 700;
    line-height: 1.4;
    text-transform: uppercase;
    color: #ff0000;
    font-size: 21px;
}

.special__price span {
      color: #777;
      font-size: 16px;
      text-decoration: line-through;
      text-transform: none;
    }

.special__text {
    color: #000000;
    font-size: 16px;
    font-weight: 700;
    line-height: 22px;
    text-transform: uppercase;
    -webkit-transition: 0.3s;
    -o-transition: 0.3s;
    transition: 0.3s;
}

.special__text:hover {
    color: #ff0000;
}

/* end component "special" */

.index-content-block {
	margin-bottom: 30px;	
}

.index-content-bottom-block {
	margin-bottom: 30px;	
}

.index-content-block p, .index-content-bottom-block p {
	margin-bottom: 10px; 
}

.index-content-block h2, .index-content-block h3, .index-content-bottom-block h2, .index-content-bottom-block h3 {
	margin-bottom: 20px;
}


/* start component "news" */

.news {
  background-color: #000000;
  padding: 40px 0;
}

.news__item {
    position: relative;
    margin-bottom: 30px;
  }

.news__image {
    position: relative;
    height: 200px;
    margin-bottom: 15px;
    background: #ffffff;
    display: block;
}

.news__image img {
      position: absolute;
      top: 50%;
      left: 50%;
      -webkit-transform: translate(-50%, -50%);
      -ms-transform: translate(-50%, -50%);
      transform: translate(-50%, -50%);
      max-width: 100%;
      max-height: 100%;
}

.news__title {
    color: #ffffff;
    font-size: 16px;
    font-weight: 700;
    line-height: 22px;
    text-transform: uppercase;
    overflow: hidden;
    margin-bottom: 10px;
    display: block;
    -webkit-transition: 0.3s;
    -o-transition: 0.3s;
    transition: 0.3s;
}

.news__title:hover {
    color: #ff0000;
}

.news__text {
    color: #777777;
    font-size: 13px;
    font-weight: 400;
    line-height: 19px;
    overflow: hidden;
}

.news__badge {
    color: #ffffff;
    font-size: 20px;
    font-weight: 700;
    line-height: 22px;
    text-transform: uppercase;
    background: #ff0000;
    padding: 15px;
    display: inline-block;
    width: 100%;
    z-index: 2;
}


/* end component "news" */

/* start component "basket" */

.basket {
  position: absolute;
  top: 63px;
  left: 0;
  background: #ffffff;
  width: 100%;
  z-index: 3;
  border: 1px solid #c6c6c6;
  background-color: #ffffff;
  display: none;
  -webkit-box-shadow:  0px 10px 16px rgba(0, 0, 0, 0.14);
  box-shadow:  0px 10px 16px rgba(0, 0, 0, 0.14)
}

.basket.is-visible {
    display: block;
}

.basket__block {
    padding: 10px 20px;
    border-bottom: 1px solid #c6c6c6;
}

.basket__item:before, .basket__item:after {
    content: " ";
    display: table;
}

.basket__item:after {
    clear: both;
}

.basket__item {
    position: relative;
}

.basket__item:not(:last-child) {
    border-bottom: 1px solid #c6c6c6;
}

.basket__image {
    float: left;
    width: 30%;
    height: 100px;
    position: relative;
}

.basket__image img {
      position: absolute;
      top: 50%;
      left: 50%;
      -webkit-transform: translate(-50%, -50%);
      -ms-transform: translate(-50%, -50%);
      transform: translate(-50%, -50%);
      max-width: 100%;
      max-height: 100%;
    }

.basket__info {
    padding-left: 20px;
    float: left;
    width: 70%;
    padding-top: 15px;
}

.basket__name {
    font-size: 13px;
    line-height: 18px;
    color: #000000;
    margin-bottom: 10px;
    height: 18px;
    overflow: hidden;
}

.basket__name span {
      color: #777777;
      text-transform: none;
    }

.basket__price {
    font-size: 13px;
    line-height: 18px;
    color: #ff0000;
}

.basket__list li:before, .basket__list li:after {
    content: " ";
    display: table;
}

.basket__list li:after {
    clear: both;
}

.basket__list li {
    padding: 5px 0;
}

.basket__list li:not(:last-child) {
    border-bottom: 1px solid #c6c6c6;
}

.basket__title {
    float: left;
    width: 50%;
    text-align: left;
    text-transform: none;
}

.basket__num {
    float: left;
    width: 50%;
    text-align: right;
}

.basket__button {
    text-align: center;
    padding: 10px 0;
}

.basket__button .button {
      min-width: 160px;
    }

.basket__close {
    position: absolute;
    top: 5px;
    right: 5px;
}

.basket__close .svg {
      fill: #000000;
      font-size: 10px;
    }

/* end component "basket" */

/* start component "counter" */

.counter {
  display: table;
    text-align: center;
    border: 1px solid rgba(0, 0, 0, 0.2);
    overflow: hidden;
}

.counter__button {
      font-family: "Roboto";
      font-weight: 400;
      font-size: 14px;
      line-height: 14px;
      color: rgba(0, 0, 0, 1);
      display: table-cell;
      background-color: #ffffff;
      height: 18px;
      width: 20px;
      cursor: pointer;
      -webkit-transition: 0.3s;
      -o-transition: 0.3s;
      transition: 0.3s
    }

.counter__button:hover {
    background-color: #c6c6c6;
}

.counter__down {
      border-right: 1px solid rgba(0, 0, 0, 0.2);
    }

.counter__up {
      border-left: 1px solid rgba(0, 0, 0, 0.2);
    }

.counter input {
      font-family: "Roboto";
      font-weight: 400;
      font-size: 14px;
      line-height: 14px;
      color: rgba(0, 0, 0, 0.7);
      text-align: center;
      display: table-cell;
      width: 24px;
      height: 21px;
      padding: 0;
      border: none;
    }

/* end component "counter" */

/* start component "menupage" */

.menupage__button {
    position: absolute;
    left: 15px;
    top: 0px;
    width: 24px;
    height: 14px;
    cursor: pointer;
    height: 13px;
    z-index: 11;
    padding: 10px;
    width: 45px;
    height: 35px;
}

.menupage__body {
    top: -1000px;
    left: 0;
    right: 0;
    -webkit-transition: 0.3s;
    -o-transition: 0.3s;
    transition: 0.3s;
    z-index: 10;
    position: absolute;
    background: #ffffff;
    padding: 40px 20px;
}

.menupage__body.is-visible {
    top: 0;
    left: 0;
    right: 0;
}

.menupage__list {
    text-align: center;
}

.menupage__sublist {
    margin-bottom: 10px;
}

.menupage__link {
    -webkit-transition: 0.3s;
    -o-transition: 0.3s;
    transition: 0.3s;
    display: block;
    margin-bottom: 0;
    color: #000000;
    transition: 0.3s;
}

.menupage__link:not(:last-child) {
    margin-bottom: 10px;
}

.menupage__link.is-active, .menupage__link:hover {
    color: #ff0000;
}

.menupage__sublink {
    -webkit-transition: 0.3s;
    -o-transition: 0.3s;
    transition: 0.3s;
    margin-bottom: 0;
    display: block;
    color: #0045aa;
}

.menupage__sublink:not(:last-child) {
    margin-bottom: 5px;
}

.menupage__sublink.is-active, .menupage__sublink:hover {
    color: #000000;
    text-decoration: underline;
}

.bar, .bar:after, .bar:before {
  width: 24px;
  height: 2px;
}

.bar {
  position: relative;
  -webkit-transform: translateY(6px);
  -ms-transform: translateY(6px);
  transform: translateY(6px);
  background-color: #ff0000
}

.bar.animate {
    background: rgba(255, 255, 255, 0);
}

.bar:before {
  content: "";
  position: absolute;
  left: 0;
  bottom: 6px;
  background-color: #ff0000;
  -webkit-transform: 300ms cubic-bezier(0.23, 1, 0.32, 1);
  -ms-transform: 300ms cubic-bezier(0.23, 1, 0.32, 1);
  transform: 300ms cubic-bezier(0.23, 1, 0.32, 1);
}

.bar:after {
  content: "";
  position: absolute;
  left: 0;
  top: 6px;
  background-color: #ff0000;
  -webkit-transform: 300ms cubic-bezier(0.23, 1, 0.32, 1);
  -ms-transform: 300ms cubic-bezier(0.23, 1, 0.32, 1);
  transform: 300ms cubic-bezier(0.23, 1, 0.32, 1);
}

.bar.animate:after {
  top: 0;
  -webkit-transform: rotate(45deg);
  -ms-transform: rotate(45deg);
  transform: rotate(45deg);
  -webkit-transform: 300ms 300ms cubic-bezier(0.23, 1, 0.32, 1);
  -ms-transform: 300ms 300ms cubic-bezier(0.23, 1, 0.32, 1);
  transform: 300ms 300ms cubic-bezier(0.23, 1, 0.32, 1);
}

.bar.animate:before {
  bottom: 0;
  -webkit-transform: rotate(-45deg);
  -ms-transform: rotate(-45deg);
  transform: rotate(-45deg);
  -webkit-transform: 300ms 300ms cubic-bezier(0.23, 1, 0.32, 1);
  -ms-transform: 300ms 300ms cubic-bezier(0.23, 1, 0.32, 1);
  transform: 300ms 300ms cubic-bezier(0.23, 1, 0.32, 1);
}

/* end component "menupage" */


.breadcrumbs-container {
	margin-bottom: 20px;
}

.breadcrumb {
  border: 1px solid #777777;
  display: inline-block
}

.breadcrumb:before, .breadcrumb:after {
    content: " ";
    display: table;
}

.breadcrumb:after {
    clear: both;
}

.breadcrumb li:first-child {
    fill: #777777;
    font-size: 14px;
    -webkit-transition: 0.3s;
    -o-transition: 0.3s;
    transition: 0.3s;
}

.breadcrumb li {
    display: inline-block;
    border-right: 1px solid #777777;
    background-color: #ffffff;
    padding: 0 5px;
    font-size: 14px;
    font-weight: 400;
    line-height: 25px;
    color: #777777;
    -webkit-transition: 0.3s;
    -o-transition: 0.3s;
    transition: 0.3s;
    float: left;
	background-color: #e2e2e2;    
}

.breadcrumb li a {
	color: #777777;
}

.breadcrumb li a:hover {
    color: #333333;
}

.breadcrumb li:first-child a:hover {
        fill: #333333;
}

.breadcrumb li.active {
    display: inline-block;
    padding: 0 5px;
    float: left;
    font-size: 14px;
    font-weight: 400;
    line-height: 25px;
    color: #333333;
    background-color: #c6c6c6;
    border-right: 0; 
}


.sort:before, .sort:after {
    content: " ";
    display: table;
}

.sort:after {
    clear: both;
}

.sort {
    padding: 30px 0px 10px 0px;
}

.sort .form__selectgroup {
    display: inline-block;
}

.sort .form__selectgroup:not(:last-child) {
    margin-right: 10px;
}

.sort__type {
    font-size: 16px;
    font-weight: 700;
    color: #333333;
    line-height: 1.4;
    display: none;
}

.sort__icon {
    display: inline;
    cursor: pointer;
    margin-left: 5px;
}

.sort__icon .svg {
      font-size: 16px;
      fill: #777777;
      -webkit-transition: 0.3s;
      -o-transition: 0.3s;
      transition: 0.3s;
    }

.sort__icon:hover .svg, .sort__icon.is-active .svg {
        fill: #333333;
}

.textblock {
  padding-top: 40px;

}

.table {
  width: 100%;
  overflow-x: scroll;
  margin-top: 50px;
}

.table__scroll {}

.table__body {
    width: 1140px;
    display: table;
    padding-right: 50px;
}

.table__row {
    display: table-row;
    font-family: "Roboto";
    font-weight: 400;
    font-size: 14px;
    line-height: 20px;
    height: 20px;
    color: #777777;
    text-align: center;
}

.table__cell {
    display: table-cell;
    vertical-align: middle;
    padding: 3px 0px;
}

.table__cell:before, .table__cell:after {
    content: " ";
    display: table;
}

.table__cell:after {
    clear: both;
}

.table__cell.is-product {
    width: 150px;
    padding: 10px;
}

.table__cell.is-description {
    font-size: 14px;
    font-weight: 700;
    color: #333333;
    text-align: left;
    padding-left: 30px;
}

.table__cell.is-remove .svg {
        fill: #777777;
        -webkit-transition: 0.3s;
        -o-transition: 0.3s;
        transition: 0.3s;
}

.table__cell.is-remove:hover .svg {
          fill: #333333;
}

.table__row--head {
    color: #333333;
    font-family: "Roboto";
    font-weight: 400 !important;
    font-size: 14px;
    line-height: 30px;
    background-color: #e2e2e2;
}

.table__image {
    position: relative;
    width: 150px;
    height: 150px;
}

.table__image img {
      position: absolute;
      top: 50%;
      left: 50%;
      -webkit-transform: translate(-50%, -50%);
      -ms-transform: translate(-50%, -50%);
      transform: translate(-50%, -50%);
      max-width: 100%;
      max-height: 100%;
    }

.table__bottom {
    padding-bottom: 30px;
    padding-top: 30px;
}

.table__bottom .form__inputgroup {
      max-width: 300px;
    }

.table__total {
    font-size: 20px;
    font-weight: 700;
    color: #333333;
}

.table__total span {
      color: #ff0000;
    }

.table__button {
    padding: 30px 0;
}

.info {
  padding-top: 50px;

}

.info .form__inputgroup, .info .form__selectgroup {
    margin-bottom: 15px;
  }

.filter {
  padding-top: 50px;
  padding-bottom: 50px;
}

.filter .form__inputgroup, .filter .form__selectgroup {
    margin-bottom: 15px;
    margin-right: 30px;
  }

.filter .form__inputgroup label, .filter .form__selectgroup label {
      margin-right: 15px;
    }

.order {
  padding-top: 50px;

}

.order__number {
    font-family: "Roboto";
    font-size: 20px;
    line-height: 1.2;
    font-weight: 700;
    color: #000000;
    margin-bottom: 15px;
  }

.order__number span {
      color: #ff0000;
    }

.order__date {
    font-family: "Roboto";
    font-size: 18px;
    line-height: 1.1666666667;
    font-weight: 700;
    color: #777777;
  }

.order__date span {
      color: #ff0000;
    }

.item {
 
}

.item__block {
    margin-bottom: 20px;
  }

.item__image {
    position: relative;
    width: 100%;
    height: 400px;
    border: 1px solid #b3b3b3;
    margin-bottom: 10px;
  }

.item__image img {
      position: absolute;
      top: 50%;
      left: 50%;
      -webkit-transform: translate(-50%, -50%);
      -ms-transform: translate(-50%, -50%);
      transform: translate(-50%, -50%);
      max-width: 95%;
      max-height: 95%;
    }

.item__slider:before, .item__slider:after {
    content: " ";
    display: table;
}

.item__slider:after {
    clear: both;
}

.item__item {
    position: relative;
    width: 70px;
    height: 70px;
    border: 1px solid #b3b3b3;
    cursor: pointer;
    float: left;
    margin-right: 10px;
    overflow: hidden;
}

.item__item img {
      position: absolute;
      top: 50%;
      left: 50%;
      -webkit-transform: translate(-50%, -50%);
      -ms-transform: translate(-50%, -50%);
      transform: translate(-50%, -50%);
      max-width: 95%;
      max-height: 95%;
}

.item__name {
    font-family: "Roboto";
    font-size: 20px;
    line-height: 1.2;
    font-weight: 700;
    color: #000000;
    text-transform: uppercase;
    margin-bottom: 15px;
}

.item__condition {
    font-family: "Roboto";
    font-size: 14px;
    line-height: 1.1428571429;
    font-weight: 700;
    color: #000000;
    margin-bottom: 15px;
}

.item__condition span {
      font-weight: 400;
      color: #777777;
    }

.item__text {
    font-family: "Roboto";
    font-size: 14px;
    line-height: 1.1428571429;
    font-weight: 400;
    color: #000000;
    margin-bottom: 15px;
}

.item__availability {
    font-family: "Roboto";
    font-size: 14px;
    line-height: 1.1428571429;
   /* font-weight: 700;*/
    color: #000000;
    margin-bottom: 15px;
}

.item-info {
    margin-bottom: 20px;
}

.item-info__buttons:before, .item-info__buttons:after {
    content: " ";
    display: table;
}

.item-info__buttons:after {
    clear: both;
}

.item-info__buttons {
    margin-top: 10px;
}

.item-info__buttons .button {
        float: left;
        margin-right: 3px;
}

.item-info__item:before, .item-info__item:after {
    content: " ";
    display: table;
}

.item-info__item:after {
    clear: both;
}

.item-info__item.is-type {
    margin-bottom: 13px;
}

.item-info__select {
      margin-right: 3px;
      border: 1px solid #b3b3b3;
      margin-bottom: 3px;
}

.item-info__select select {
        width: 108px;
        border: none;
        background: transparent;
        font-size: 12px;
        border-radius: 0px;
        color: #333333;
      }

.item-info__label {
      font-family: "Roboto";
      font-size: 14px;
      line-height: 30px;
      font-weight: 400;
      color: #000000;
      width: 90px;
      float: left;
}

.item-info__value {
      float: left;
}

.item-info__value:before, .item-info__value:after {
    content: " ";
    display: table;
}

.item-info__value:after {
    clear: both;
}

.item-info__price {
      font-family: "Roboto";
      font-weight: 400;
      font-size: 17px;
      color: #ff0000;
      position: relative;
}

.item-info__newprice {}

.item-info__oldprice {
      color: #c6c6c6;
      position: absolute;
      top: -20px;
      left: 0;
      text-decoration: line-through;
      min-width: 100px;
}

.item-info__button {
      margin-bottom: 15px;
}

.state{}

@media (min-width: 768px) {

    .container {
        width: 750px;
    }
  .s-offset--0 {
    margin-left: 0;
  }
    .s--1 {
      width: 8.33333333%;
    }
    .s-offset--1 {
      margin-left: 8.33333333%;
    }
    .s--2 {
      width: 16.66666667%;
    }
    .s-offset--2 {
      margin-left: 16.66666667%;
    }
    .s--3 {
      width: 25%;
    }
    .s-offset--3 {
      margin-left: 25%;
    }
    .s--4 {
      width: 33.33333333%;
    }
    .s-offset--4 {
      margin-left: 33.33333333%;
    }
    .s--5 {
      width: 41.66666667%;
    }
    .s-offset--5 {
      margin-left: 41.66666667%;
    }
    .s--6 {
      width: 50%;
    }
    .s-offset--6 {
      margin-left: 50%;
    }
    .s--7 {
      width: 58.33333333%;
    }
    .s-offset--7 {
      margin-left: 58.33333333%;
    }
    .s--8 {
      width: 66.66666667%;
    }
    .s-offset--8 {
      margin-left: 66.66666667%;
    }
    .s--9 {
      width: 75%;
    }
    .s-offset--9 {
      margin-left: 75%;
    }
    .s--10 {
      width: 83.33333333%;
    }
    .s-offset--10 {
      margin-left: 83.33333333%;
    }
    .s--11 {
      width: 91.66666667%;
    }
    .s-offset--11 {
      margin-left: 91.66666667%;
    }
    .s--12 {
      width: 100%;
    }
    .s-offset--12 {
      margin-left: 100%;
    }
    .header {
        padding: 10px 0;
    }
    .footer__copy {
        margin-top: 35px;
        padding-bottom: 50px;
    }
    .is-vertical .card__left {
        float: left;
    }
    .is-vertical .card__price {
        text-align: center;
    }
    .is-vertical .card__name {
        margin-bottom: 0px;
    }
    .is-vertical .card__right {
        float: left;
    }
    .top__logo {
        float: left;
    }
    .top__block {
        float: right;
    }
    .top__block:before, .top__block:after {
        content: " ";
        display: table;
    }
    .top__block:after {
        clear: both;
    }
    .top__left {
        float: left;
        text-align: right;
        margin-bottom: 0;
    }
    .top__right {
        float: right;
    }
    .top__basket {
        margin: 0;
        width: 270px;
        display: table-cell;
        vertical-align: middle;
        padding: 0 25px;
    }
    .cards__tab {
        display: inline-block;
        padding: 15px 0;
    }
    .items__block {
        width: 50%;
        padding-right: 7.5px;
    }
    .items__block:nth-child(2n) {
        padding-right: 0px;
        padding-left: 7.5px;
    }
    .slider__item {
        padding: 40px;
        background-size: cover;
        background-repeat: no-repeat;
    }
    .slider__image {
        right: 40px;
        top: 50%;
        -webkit-transform: translateY(-50%);
        -ms-transform: translateY(-50%);
        transform: translateY(-50%);
        left: auto;
        width: 280px !important;
    }
    .slider__title {
        font-size: 52px;
        line-height: 57px;
        height: 118px;
    }
    .slider__subtitle {
        font-size: 26px;
        height: 68px;
    }
    .news__image {
        height: 100px;
    }
    .news__title {
        height: 22px;
    }
    .news__text {
        height: 19px;
    }
    .menupage {
        display: none;
    }
    .menupage__button {
        left: -10px;
        top: 10px;
    }
    .quantity:before, .quantity:after {
        content: " ";
        display: table;
    }
    .quantity:after {
        clear: both;
    }
    .quantity {
        position: relative;
    }
    .quantity__showing {
        float: left;
        display: block;
    }
    .quantity__pagination {
        text-align: left;
        position: absolute;
        top: 50%;
        left: 50%;
        -webkit-transform: translate(-50%, -50%);
        -ms-transform: translate(-50%, -50%);
        transform: translate(-50%, -50%);
    }
    .sort__block {
        float: left;
    }
    .sort__type {
        float: right;
        display: block;
    }
    .item-info__item.is-type {
        margin-bottom: 0;
    }
    .item-info__oldprice {
        top: 0;
        left: 110%;
    }
    .item-info__button {
        margin-bottom: 5px;
    }
}

@media (min-width: 992px) {

    .container {
        width: 970px;
    }
  .m-offset--0 {
    margin-left: 0;
  }
    .m--1 {
      width: 8.33333333%;
    }
    .m-offset--1 {
      margin-left: 8.33333333%;
    }
    .m--2 {
      width: 16.66666667%;
    }
    .m-offset--2 {
      margin-left: 16.66666667%;
    }
    .m--3 {
      width: 25%;
    }
    .m-offset--3 {
      margin-left: 25%;
    }
    .m--4 {
      width: 33.33333333%;
    }
    .m-offset--4 {
      margin-left: 33.33333333%;
    }
    .m--5 {
      width: 41.66666667%;
    }
    .m-offset--5 {
      margin-left: 41.66666667%;
    }
    .m--6 {
      width: 50%;
    }
    .m-offset--6 {
      margin-left: 50%;
    }
    .m--7 {
      width: 58.33333333%;
    }
    .m-offset--7 {
      margin-left: 58.33333333%;
    }
    .m--8 {
      width: 66.66666667%;
    }
    .m-offset--8 {
      margin-left: 66.66666667%;
    }
    .m--9 {
      width: 75%;
    }
    .m-offset--9 {
      margin-left: 75%;
    }
    .m--10 {
      width: 83.33333333%;
    }
    .m-offset--10 {
      margin-left: 83.33333333%;
    }
    .m--11 {
      width: 91.66666667%;
    }
    .m-offset--11 {
      margin-left: 91.66666667%;
    }
    .m--12 {
      width: 100%;
    }
    .m-offset--12 {
      margin-left: 100%;
    }
    .top__logo {
        margin-bottom: 0px;
    }
    .slider__image {
        opacity: 1;
    }
}

@media (min-width: 1200px) {

    .container {
        width: 1170px;
    }
  .l-offset--0 {
    margin-left: 0;
  }
    .l--1 {
      width: 8.33333333%;
    }
    .l-offset--1 {
      margin-left: 8.33333333%;
    }
    .l--2 {
      width: 16.66666667%;
    }
    .l-offset--2 {
      margin-left: 16.66666667%;
    }
    .l--3 {
      width: 25%;
    }
    .l-offset--3 {
      margin-left: 25%;
    }
    .l--4 {
      width: 33.33333333%;
    }
    .l-offset--4 {
      margin-left: 33.33333333%;
    }
    .l--5 {
      width: 41.66666667%;
    }
    .l-offset--5 {
      margin-left: 41.66666667%;
    }
    .l--6 {
      width: 50%;
    }
    .l-offset--6 {
      margin-left: 50%;
    }
    .l--7 {
      width: 58.33333333%;
    }
    .l-offset--7 {
      margin-left: 58.33333333%;
    }
    .l--8 {
      width: 66.66666667%;
    }
    .l-offset--8 {
      margin-left: 66.66666667%;
    }
    .l--9 {
      width: 75%;
    }
    .l-offset--9 {
      margin-left: 75%;
    }
    .l--10 {
      width: 83.33333333%;
    }
    .l-offset--10 {
      margin-left: 83.33333333%;
    }
    .l--11 {
      width: 91.66666667%;
    }
    .l-offset--11 {
      margin-left: 91.66666667%;
    }
    .l--12 {
      width: 100%;
    }
    .l-offset--12 {
      margin-left: 100%;
    }
    .catalog__list {
        display: block;
    }
    .catalog__list.is-visible {
        display: none;
    }
    .special--mobile {
        display: none;
    }
    .news__item {
        margin-bottom: 0;
    }
    .news__image {
        height: 180px;
    }
    .news__title {
        height: 44px;
    }
    .news__text {
        height: 38px;
    }
    .news__badge {
        position: absolute;
        top: 10px;
        left: 0;
        right: 30px;
        width: auto;
    }
    .bread__link {
        background-color: #e2e2e2;
    }
    .bread__page {
        background-color: #c6c6c6;
    }
    .table {
        overflow-x: auto;
    }
    .table__body {
        padding-right: 0;
    }
    .item__item {
        width: 90px;
        height: 90px;
        margin-bottom: 10px;
    }
}

@media (min-width: 768px) and (max-width: 991px) {

    .footer__title {
        font-size: 14px;
    }

    .footer__link {
        font-size: 11px;
        letter-spacing: -0.7px;
    }

    .top__logo img {
        max-width: 200px;
    }

    .top__logo {
        margin-top:0;
    }
    
   .top_slogan {
		text-transform: uppercase;
		color: #ff0000;
		font-family: Roboto, Sans-serif;
		position: relative;
		top: -4px;
		font-size: 16px;
	} 
}

@media (max-width: 1199px) {

    .banner {
        display: none;
    }

    .special--desktop {
        display: none;
    }
}

@media (max-width: 991px) {

    .sort__block {
        margin-bottom: 10px;
    }

    .sort .form__selectgroup:not(:last-child) {
        margin-bottom: 10px;
    }
}

@media (max-width: 767px) {

    .header__contact {
        display: none;
    }

    .header .form__selectgroup {
        margin-left: 10px;
    }

    .footer .col {
        margin-bottom: 30px;
    }

    .item__image {
        max-width: 320px;
        height: 320px;
    }

    .item-info__value .button--grey {
          display: none;
    }
}

body {
	padding: 0;
}

a:focus, a:hover {
    text-decoration: none !important;
}

footer {
	border-top: 2px solid #eee;
	padding-top: 15px;
}

.block {
	margin-bottom: 20px;
}

.block img {
	max-width: 100%;
	height: auto;
}

.container-block {
	margin: auto;
	max-width: 1170px;
	border: 1px solid red;
}
.hidden {
	display: none;
}

@font-face{
	font-family:Glyphicons Halflings;
	src:url(/ehtml-3.0.0/assets/f4769f9bdb7466be65088239c12046d1.eot);
	src:url(/ehtml-3.0.0/assets/f4769f9bdb7466be65088239c12046d1.eot?#iefix) format("embedded-opentype"),url(/ehtml-3.0.0/assets/448c34a56d699c29117adc64c43affeb.woff2) format("woff2"),url(/ehtml-3.0.0/assets/fa2772327f55d8198301fdb8bcfc8158.woff) format("woff"),url(/ehtml-3.0.0/assets/e18bbf611f2a2e43afc071aa2f4e1512.ttf) format("truetype"),url(/ehtml-3.0.0/assets/89889688147bd7575d6327160d64e760.svg#glyphicons_halflingsregular) format("svg")
}

.glyphicon {
	position:relative;
	top:1px;display:
	inline-block;
	font-family: Glyphicons Halflings;
	font-style:normal;
	font-weight:400;
	line-height:1;
	-webkit-font-smoothing:antialiased;
	-moz-osx-font-smoothing:grayscale
}

.glyphicon-menu-down:before{content:"\E259"}
.glyphicon-menu-up:before{content:"\E260"}
.glyphicon-ok:before{content:"\E013"}



.alert{padding:15px;margin-bottom:20px;border:1px solid transparent;border-radius:4px}.alert h4{margin-top:0;color:inherit}.alert .alert-link{font-weight:700}.alert>p,.alert>ul{margin-bottom:0}.alert>p+p{margin-top:5px}.alert-dismissable,.alert-dismissible{padding-right:35px}.alert-dismissable .close,.alert-dismissible .close{position:relative;top:-2px;right:-21px;color:inherit}.alert-success{color:#3c763d;background-color:#dff0d8;border-color:#d6e9c6}.alert-success hr{border-top-color:#c9e2b3}.alert-success .alert-link{color:#2b542c}.alert-info{color:#31708f;background-color:#d9edf7;border-color:#bce8f1}.alert-info hr{border-top-color:#a6e1ec}.alert-info .alert-link{color:#245269}.alert-warning{color:#8a6d3b;background-color:#fcf8e3;border-color:#faebcc}.alert-warning hr{border-top-color:#f7e1b5}.alert-warning .alert-link{color:#66512c}.alert-danger{color:#a94442;background-color:#f2dede;border-color:#ebccd1}.alert-danger hr{border-top-color:#e4b9c0}.alert-danger .alert-link{color:#843534}
/*
<div class="cart-info">
	<div class="cart-info--header">...</div>
	<div class="cart-element-is-empty">
		<div>...</div>
	</div>
	<div class="cart-element-is-full">
		<div class="cart-info--count">Всего товаров: <span class="cart-element-info-count"></span></div>
		<div class="cart-info--sum">На сумму: <span class="cart-element-info-sum" data-currency="1"></span></div>
		<div class="cart-info--link"><a href="...">...</a></div>
	</div>
</div>
*/

.cart-info {
}

.cart-info--header {
}

.cart-info--count {
}

.cart-info--sum {
}

.cart-info--link {
}

.cart-element-is-empty {
	display: none;
}

.cart-element-items-it-cart {
    overflow-y: auto;
    max-height: 250px;
    padding-bottom: 0; 
}

.basket__info {
    padding-left: 0;
    float: none; 
    width: 100%;
    padding-top: 6px;
    padding-right: 20px;
}

.basket__name {
	height: auto;
	margin-bottom: 5px;
}

.basket__price {
	margin-bottom: 5px;	
}
.basket__close .svg {
    fill: #ff0000;
}
.cart-table-element {
}

.cart-table-element table {
	width: 100%;
	border-collapse: collapse;
}
.cart-table-element th {
	border: 1px solid #000000;
	padding: 6px; 
}
.cart-table-element th.name {
	width: 100%;
}

.cart-table-element td {
	vertical-align: middle;
	border: 1px solid #000000;
	padding: 6px; 
}

.cart-table-element td.price {
	white-space: nowrap;
}

.cart-table-element tbody td.price {
	line-height: 30px;
}

.cart-table-element td.sum {
	white-space: nowrap;
}

.cart-table-element tbody td.sum {
	line-height: 30px;
	min-width: 105px;
}

.cart-table-element td.count {
	text-align: center;
}

.cart-table-element td.count input {
	width: 45px;
	text-align: center;
	margin: 0;
}

.cart-table-element .title span {
	font-weight: bold;
}
.cart-table-element .title a {
	color: #000000;
}
.cart-table-element .title a:hover {
	color: #ff0000;
}
.up-button-container {
	position: absolute;
	left: 52px;
	top: 0;
}

.cart-element-is-in-cart .up-button-container {
	top: -2px;	
}

.down-button-container {
	position: absolute;
	left: 52px;
	top: 18px;
}

.cart-element-is-in-cart .down-button-container {
	top: 18px;
}


.up-button-container a, 
.up-button-container a:hover,
.up-button-container a:visited,
.up-button-container a:active,
.up-button-container a:focus,
.down-button-container a, 
.down-button-container a:hover,
.down-button-container a:visited,
.down-button-container a:active, 
.down-button-container a:focus {
	color: #000000 !important;
	text-decoration: none !important;	
	font-size: 12px !important;
}

.cart-element-remove:hover {
	color: #ff0000;
}
.cart-order-button-container {
	margin: 30px 0;
	text-align: center;
}
.catalog-categories-list nav {
	text-align: center;	
}
/*
<div class="catalog-categories-tree">
	<ul>
		...
		<li>
			<a href="">...</a>
		</li>
		...
		<li class="selected">
			<a href="">...</a>
		</li>
		...
		<li>
			...
		</li>
		...
	</ul>
</div>
*/

.catalog-categories-tree {
}

.catalog-categories-tree ul {
}

.catalog-categories-tree ul ul {
	padding-left: 20px;
}

.catalog-categories-tree li {
}

.catalog-categories-tree li.selected > a {
	font-weight: bold;
}

.catalog-categories-tree a {
	display: block;
}

.catalog-category-item {
}

.catalog-category-item--header {
}

.catalog-category-item--image {
	max-width: 100%;
	text-align: center;
}

.catalog-category-item--image img {
	max-width: 100%;
	height: auto;
}

.catalog-category-item--description {
	margin-bottom: 15px;
}

.catalog-product-item {
}

.catalog-product-item--header {
}

.catalog-product-item--image {
	max-width: 100%;
}

.catalog-product-item--image img {
	max-width: 100%;
	height: auto;
}

.catalog-product-item--text {
	margin-bottom: 15px;
}

.catalog-product-item--old-price {
}

.catalog-product-item--discount {
}

.catalog-product-item--price {
}

.catalog-product-item--cart {
}

.catalog-product-item--cart input {
	text-align: center;
	width: 40px !important;
}

.catalog-product-item--analogs {
}

.item__specification {
	margin-bottom: 30px;
}

.item__specification h4 {
	margin-bottom: 15px;	
}

.one-click {
	margin-bottom: 10px;
}

.one-click a {
	font-size: 16px;
	text-transform: uppercase;
	color: #f00;
	text-decoration: none;
	border-bottom: 1px dashed #f00;	
}
/*
<div class="catalog-products-analogs-list">
	...
	<div class="catalog-product-item">...</div>
	...
</div>
*/

.catalog-products-analogs-list {
	overflow: hidden;
	margin-left: -10px;
	margin-right: -10px;
}

.catalog-products-analogs-list .catalog-product-item {
	vertical-align: top;
	display: inline-block;
	width: 200px;
	margin: 0 10px 20px 10px;
	text-align: center;
}

/*
<div class="catalog-products-list">
	...
	<div class="catalog-product-item">...</div>
	...
</div>
*/

.catalog-products-list {
	overflow: hidden;
	margin-left: -10px;
	margin-right: -10px;
}

.catalog-products-list .catalog-product-item {
	vertical-align: top;
	display: inline-block;
	width: 200px;
	margin: 0 10px 20px 10px;
	text-align: center;
}

.card_description p {
	font-size: 15px;
}
.form-group {
    margin-bottom: 15px;
}

label {
    display: inline-block;
    max-width: 100%;
    margin-bottom: 5px;
}

.form-control {
    width: 100%;
    height: 34px;
    padding: 6px 12px;
    background-color: #fff;
    background-image: none;
    border: 1px solid #ccc;
    border-radius: 4px;
    box-shadow: inset 0 1px 1px rgba(0,0,0,.075);
    -webkit-transition: border-color ease-in-out .15s,-webkit-box-shadow ease-in-out .15s;
    transition: border-color ease-in-out .15s,box-shadow ease-in-out .15s;
}

.form-control, output {
    display: block;
    font-size: 14px;
    line-height: 1.42857143;
    color: #555;
}

.checkbox-inline input[type=checkbox], .checkbox input[type=checkbox], .radio-inline input[type=radio], .radio input[type=radio] {

}
input[type=checkbox], input[type=radio] {
    box-sizing: border-box;
    padding: 0;
}
input[type=checkbox], input[type=radio] {
    margin: 4px 0 0;
    line-height: normal;
}

.form-content {
	margin-bottom: 30px;
}

.btn-success, .btn-success:focus, .btn-success:active, .btn-success:active:focus, .btn-success:active:hover, .btn-success[disabled]:focus, .btn-success[disabled]:hover {
    color: #fff;
    background-color: #900;
    border-color: #840000;
}
.btn-success {
    color: #fff;
    background-color: #ff0000;
    border-color: #ff0000;
}
.btn {
    display: inline-block;
    padding: 9px 12px 8px 12px;
    margin-bottom: 0;

	font-family: "Roboto";
    font-size: 16px;
    font-weight: 900;
    text-decoration: none;
    text-transform: uppercase;

    text-align: center;
    white-space: nowrap;
    vertical-align: middle;
    -ms-touch-action: manipulation;
    touch-action: manipulation;
    cursor: pointer;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;

	-webkit-transition: 0.3s;
    -o-transition: 0.3s;
    transition: 0.3s;    
}

.btn-success:hover {
    color: #ffffff;
    background-color: #000;
    border-color: #000000;
}

.has-error .checkbox, .has-error .checkbox-inline, .has-error.checkbox-inline label, .has-error.checkbox label, .has-error .control-label, .has-error .help-block, .has-error .radio, .has-error .radio-inline, .has-error.radio-inline label, .has-error.radio label {
    color: #a94442;
}

.help-block {
    display: block;
    margin-top: 5px;
    margin-bottom: 10px;
    color: #737373;
}

.has-error .form-control {
    border-color: #a94442;
    box-shadow: inset 0 1px 1px rgba(0,0,0,.075);
}

.login-form {
	max-width: 360px;
}

.login-form a {
	color: #000000;	
}
.login-form a:hover {
	color: #ff0000;
	text-decoration: underline !important;
}

.users-form {
	width: 100%;
	max-width: 500px;
}
.gallery-collage-plus-element {
	margin: -5px -5px 10px -5px;
	padding: 5px; /* Отступ между картинками */
}

.gallery-fotorama-element {
	background-color: #eee;
	padding: 10px;
	margin-bottom: 15px;
	border-radius: 4px;
}

/* Галерея на странице (или в Overlay) предназначенной только для просмотра изображений. */
.gallery-fotorama-element[data-alone] {
	background-color: transparent;
	padding: 0;
	margin-bottom: 0;
	border-radius: 0;
}

.top-header-wrapper {
	height: 52px;
	overflow: hidden;
}
.manufacturer-list-block {
	margin-bottom: 40px;	
}

.manufacturer-list hr {
	margin-bottom: 40px;
}

.manufacturer-list a.h2_title {
	display: inline-block;
 	color: #000000;
    text-transform: uppercase;
    font-size: 20px;
    font-weight: bold;
	margin-bottom: 22px;
}
.man-logo {
	text-align: center;
	margin-bottom: 20px;
}

.manufacturers-items-count {
	margin: 10px 0;
}

.manufacturers-items-count a {
	font-weight: bold;
	text-decoration: underline;	
	color: #000000;
}

.manufacturers-items-count a:hover {
	text-decoration: none;		
}
.menu-main {
}

.menu-secondary {
}

/*
<div class="news-news-block-list">
	...
	<div class="news-news-block-item">...</div>
	...
</div>
*/

.news-news-block-list {
}

.news-news-block-list .news-news-item {
}

.news-news-block-list .news-news-item--image {
	float: none;
}

.news-news-item {
	overflow: hidden;
}

.news-news-item--date {
}

.news-news-item--header {
}

.news-news-item--image {
	float: right;
}

.news-news-item--short-text {
}

.news-news-item--text {
}

.news-news-item--gallery {
}

.news-news-item--button-back {
}

.news-news-item--button-gallery {
}


.one-news-page .image-block {
	float: left;
	margin: 0 20px 20px 0;
}

.one-news-page p {
	margin-bottom: 15px;
}

.fotorama__caption { 
	text-align: center !important;
}
/*
<div class="news-news-list">
	...
	<div class="news-news-item">...</div>
	...
</div>
*/

.news-news-list {
	margin-bottom: 40px;
}


.news-news-list nav {
	text-align: center;	
}

.news-news-list .news-news-item {
	margin-bottom: 40px;
}

.news-news-list .news-news-item .news-news-item--header {
	margin-bottom: 15px;
}

.news-news-list .news-news-item .news-news-item--date {
	font-size: 14px;
	color: #ff0000;		
	margin-bottom: 5px;
}

.news-news-list .news-news-item .news-news-item--header a {
	color: #000000;
    font-size: 20px;
    font-weight: 700;
    line-height: 24px;
    -webkit-transition: 0.3s;
    -o-transition: 0.3s;
    transition: 0.3s;
}

.news-news-list .news-news-item .news-news-item--header a:hover {
	color: #ff0000;	
}
.overlay-element[data-type=window] {
    border: 0;
    border-radius: 0;
}


.pagination {
	display: inline-block;
    padding-left: 0;
    margin: 20px 0;
	border:0;
}

.pagination>li {
    display: inline-block;
    margin: 0 4px;
}

.pagination>li:first-child>a, .pagination>li:first-child>span, 
.pagination>li:last-child>a, .pagination>li:last-child>span {
    margin-left: 0;
    background-color: transparent;
}

.pagination>.active>a, .pagination>.active>a:focus, .pagination>.active>a:hover, .pagination>.active>span, .pagination>.active>span:focus, .pagination>.active>span:hover {
    z-index: 3;
    color: #fff;
    cursor: default;
    background-color: #337ab7;
}

.pagination>li>a, .pagination>li>span {
    position: relative;
    float: left;
    padding: 6px 12px;
    margin-left: -1px;
    line-height: 1.42857143;
    color: #333333;
    text-decoration: none;
    background-color: #e2e2e2;
}




.pagination>.active>a, .pagination>.active>a:focus, .pagination>.active>a:hover, .pagination>.active>span, .pagination>.active>span:focus, .pagination>.active>span:hover {
    background-color: #c6c6c6;
}


/*

<div class="quantity__pagination">
                <a href="#" class="quantity__cell is-arrow">
                  <svg class="svg svg-arrow-left">
                    <use xlink:href="images/svg.svg#svg-arrow-left"></use>
                  </svg> Prev </a>
                <a href="#" class="quantity__cell is-num is-active">1</a>
                <a href="#" class="quantity__cell is-num">2</a>
                <a href="#" class="quantity__cell is-arrow"> Next
                  <svg class="svg svg-arrow-right">
                    <use xlink:href="images/svg.svg#svg-arrow-right"></use>
                  </svg>
                </a>
              </div>
              
              
              .quantity {
  padding: 10px 0;
  margin-bottom: 15px;
}

.quantity__showing {
    font-size: 16px;
    font-weight: 400;
    color: #777777;
    line-height: 1.4;
    display: none;
}

.quantity__pagination {
    text-align: center;
}

.quantity__cell {
    font-size: 16px;
    font-weight: 400;
    color: #333333;
    line-height: 30px;
    display: inline-block;
    vertical-align: middle;
    height: 30px;
    text-align: center;
    -webkit-transition: 0.3s;
    -o-transition: 0.3s;
    transition: 0.3s;
}

.quantity__cell.is-num {
    width: 30px;
    background-color: #e2e2e2;
}

.quantity__cell.is-num:hover {
    background-color: #c6c6c6;
}

.quantity__cell.is-active {
    background-color: #c6c6c6;
}

.quantity__cell.is-arrow {
    padding: 0 10px;
    color: #777777;
}

.quantity__cell.is-arrow .svg {
        font-size: 12px;
        margin: 0 3px;
        fill: #777777;
}

.quantity__cell.is-arrow:hover {
    color: #333333;
    fill: #333333;
}

.quantity__all {
    font-size: 16px;
    font-weight: 700;
    color: #333333;
    line-height: 1.4;
    float: right;
}

*/

.price-files-block .one-price {
	margin-bottom: 20px;
}

.price-files-block .one-price div {
	color: #c0c0c0;
	font-size: 14px;
	padding-left: 35px;
}

.price-files-block .one-price p {
	margin-bottom: 0;
}

.price-files-block .one-price div.price-description {
	margin: 10px 0 0 0;
	color: #000000;
	font-size: 14px;	
}

.price-files-block .one-price a {
	color: #000000;
}

.price-files-block .one-price a:hover {
	text-decoration: underline !important;
}
.search-result-block {
	margin-bottom: 30px;	
}

.search-result-block .search-header {
	margin-bottom: 10px;	
}
.search-list {
    padding-left: 40px;
    list-style: decimal;
}
.search-list li {
	margin-bottom: 5px; 	
}

.search-list li a {
	color: #000000;
}	

.search-list li a:hover {
	text-decoration: underline !important;	
}
/*
<div class="sitemap">
	<ul>
		<li>
			<a href="">Первый пункт</a>
		</li>
		<li>
			<a href="">Второй пункт</a>
			<ul>
				...
			</ul>
		</li>
		...
	</ul>
</div>
*/

.sitemap {
}

.b-connect {
	border: 1px solid #c6c6c6;
	padding: 20px;
	margin-bottom: 20px;
}

.b-connect h3 {
	margin: 0 0 20px;
	font-size: 28px;
	color: #ff0000;
}

.b-connect h3 span {
	display: block;
	margin-top: 3px;
	font-size: 18px;
	color: #000000; 
}

.b-connect h3 span a {
	color: #ff0000;
}

.b-connect h3 span a:hover {
	text-decoration: underline;
}

.b-connect .search__button{
	min-width: 140px;
	width: 160px;
}

.b-connect .search {
	margin-bottom: 0;
}
.orders-history-table table {
	width: 100%;
	border-collapse: collapse;
}
.orders-history-table th {
	border: 1px solid #000000;
	padding: 6px; 
	text-align: center;
}

.orders-history-table td {
	vertical-align: middle;
	border: 1px solid #000000;
	padding: 6px; 
	text-align: center;
}

.orders-history-table td a {
	color: #000;
	text-decoration: none;
}

.orders-history-table td a:hover {
	color: #f00;
	text-decoration: underline;
}

.orders-history-table table.table {
    margin-top: 0;
}