/*--------------------------------------------------------------
	SASS IMPORT
--------------------------------------------------------------*/
/*--------------------------------------------------------------
	SASS VARS
--------------------------------------------------------------*/
/*--------------------------------------------------------------
	RESPONSIVE
--------------------------------------------------------------*/
@font-face {
  font-family: "icons";
  src: url("../icons/icons.eot?7lxb9v");
  src: url("../icons/icons.eot?7lxb9v#iefix") format("embedded-opentype"), url("../icons/icons.ttf?7lxb9v") format("truetype"), url("../icons/icons.woff?7lxb9v") format("woff"), url("../icons/icons.svg?7lxb9v#icons") format("svg");
  font-weight: normal;
  font-style: normal;
}
i {
  /* use !important to prevent issues with browser extensions that change fonts */
  font-family: "icons" !important;
  speak: none;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  /* Better Font Rendering =========== */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.icon-arrow-down:before {
  content: "\e900";
}

.icon-arrow-right:before {
  content: "\e901";
}

.icon-call-center:before {
  content: "\e902";
}

.icon-checklist:before {
  content: "\e903";
}

.icon-checkmark:before {
  content: "\e904";
}

.icon-consultation:before {
  content: "\e905";
}

.icon-delete:before {
  content: "\e906";
}

.icon-delivery-man:before {
  content: "\e907";
}

.icon-delivery-truck:before {
  content: "\e908";
}

.icon-email:before {
  content: "\e909";
}

.icon-fax:before {
  content: "\e90a";
}

.icon-gauge:before {
  content: "\e90b";
}

.icon-location:before {
  content: "\e90c";
}

.icon-mailbox:before {
  content: "\e90d";
}

.icon-menu:before {
  content: "\e90e";
}

.icon-parts:before {
  content: "\e90f";
}

.icon-phone:before {
  content: "\e910";
}

.icon-search:before {
  content: "\e911";
}

.icon-sns-facebook:before {
  content: "\e912";
}

.icon-sns-linkedin:before {
  content: "\e913";
}

.icon-sns-twitter:before {
  content: "\e914";
}

.icon-sns-youtube:before {
  content: "\e915";
}

.icon-tech-support:before {
  content: "\e916";
}

.icon-tools:before {
  content: "\e917";
}

.icon-training:before {
  content: "\e918";
}

.icon-upgrade-package:before {
  content: "\e919";
}

.icon-watch:before {
  content: "\e91a";
}

.icon-worker-hammer:before {
  content: "\e91b";
}

.icon-wrench:before {
  content: "\e91c";
}

/*! normalize.css v8.0.1 | 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 iOS.
 */
html {
  line-height: 1.15; /* 1 */
  -webkit-text-size-adjust: 100%; /* 2 */
}

/* Sections
   ========================================================================== */
/**
 * Remove the margin in all browsers.
 */
body {
  margin: 0;
}

/**
 * Render the `main` element consistently in IE.
 */
main {
  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
   ========================================================================== */
/**
 * 1. Add the correct box sizing in Firefox.
 * 2. Show the overflow in Edge and IE.
 */
hr {
  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
   ========================================================================== */
/**
 * Remove the gray background on active links in IE 10.
 */
a {
  background-color: transparent;
}

/**
 * 1. Remove the bottom border in Chrome 57-
 * 2. Add the correct text decoration in Chrome, Edge, IE, Opera, and Safari.
 */
abbr[title] {
  border-bottom: none; /* 1 */
  text-decoration: underline; /* 2 */
  text-decoration: underline dotted; /* 2 */
}

/**
 * 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 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
   ========================================================================== */
/**
 * Remove the border on images inside links in IE 10.
 */
img {
  border-style: none;
}

/* Forms
   ========================================================================== */
/**
 * 1. Change the font styles in all browsers.
 * 2. Remove the margin in Firefox and Safari.
 */
button,
input,
optgroup,
select,
textarea {
  font-family: inherit; /* 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;
}

/**
 * Correct the inability to style clickable types in iOS and Safari.
 */
button,
[type=button],
[type=reset],
[type=submit] {
  -webkit-appearance: button;
}

/**
 * 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 {
  box-sizing: border-box; /* 1 */
  color: inherit; /* 2 */
  display: table; /* 1 */
  max-width: 100%; /* 1 */
  padding: 0; /* 3 */
  white-space: normal; /* 1 */
}

/**
 * Add the correct vertical alignment in Chrome, Firefox, and Opera.
 */
progress {
  vertical-align: baseline;
}

/**
 * Remove the default vertical scrollbar in IE 10+.
 */
textarea {
  overflow: auto;
}

/**
 * 1. Add the correct box sizing in IE 10.
 * 2. Remove the padding in IE 10.
 */
[type=checkbox],
[type=radio] {
  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 in Chrome and Safari on macOS.
 */
[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 Edge, IE 10+, and Firefox.
 */
details {
  display: block;
}

/*
 * Add the correct display in all browsers.
 */
summary {
  display: list-item;
}

/* Misc
   ========================================================================== */
/**
 * Add the correct display in IE 10+.
 */
template {
  display: none;
}

/**
 * Add the correct display in IE 10.
 */
[hidden] {
  display: none;
}

/*--------------------------------------------------------------
 RESET
 --------------------------------------------------------------*/
html, body, body div, span, a, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, abbr, address, cite, code, del, dfn, em, img, ins, kbd, q, samp, small, strong, sub, sup, var, b, i, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, figure, footer, header, menu, nav, section, time, mark, audio, video, details, summary {
  margin: 0;
  padding: 0;
  border: 0;
  font-size: 100%;
  vertical-align: baseline;
  background: transparent;
}

main, article, aside, figure, footer, header, nav, section, details, summary {
  display: block;
}

/* Handle box-sizing while better addressing child elements:
  http://css-tricks.com/inheriting-box-sizing-probably-slightly-better-best-practice/ */
html {
  box-sizing: border-box;
}

*,
*:before,
*:after {
  box-sizing: inherit;
}

* {
  -webkit-tap-highlight-color: transparent;
}

/* Responsive images and other embedded objects */
img,
object,
embed {
  display: block;
  max-width: 100%;
  height: auto;
  margin: 0 auto;
}

html {
  overflow-y: scroll;
} /* Force a vertical scrollbar to prevent a jumpy page */
ol, ul, li {
  list-style: none;
} /* Remove bullet points */
a, button {
  text-decoration: none;
} /* Remove underline */
blockquote, q {
  quotes: none;
}

blockquote:before,
blockquote:after,
q:before,
q:after {
  content: "";
  content: none;
}

table {
  border-collapse: collapse;
  font-size: inherit;
  font: 100%;
}

td, th {
  vertical-align: middle;
}

/* Webkit browsers add a 2px margin outside the chrome of form elements */
input, select, button textarea {
  margin: 0;
}

input, select, textarea {
  font: 99% sans-serif;
}

input, select {
  vertical-align: middle;
}

/* make buttons play nice in IE */
button, input[type=button] {
  width: auto;
  overflow: visible;
}

/* Set default cursors */
html, body {
  cursor: default;
}

a,
button,
input[type=radio],
input[type=submit],
input[type=checkbox] {
  cursor: pointer;
}

/* Prevent drag */
img, a {
  -webkit-user-drag: none;
  -moz-user-drag: none;
  -ms-user-drag: none;
  -o-user-drag: none;
  user-drag: none;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  -o-user-select: none;
  user-select: none;
}

html, body {
  overflow-x: hidden;
}

body {
  min-height: 100vh;
}

/*--------------------------------------------------------------
	SASS IMPORT
--------------------------------------------------------------*/
/*--------------------------------------------------------------
	SASS IMPORT
--------------------------------------------------------------*/
/*--------------------------------------------------------------
	TYPOGRAPHY
--------------------------------------------------------------*/
html, body {
  font-family: "Open Sans", sans-serif;
  background: white;
  color: rgb(30, 30, 30);
}

p {
  font-size: 22px;
  line-height: 30px;
}
@media (max-width: 999px) {
  p {
    font-size: 20px;
    line-height: 28px;
  }
}
@media (max-width: 799px) {
  p {
    font-size: 18px;
    line-height: 26px;
  }
}
@media (max-width: 639px) {
  p {
    font-size: 16px;
    line-height: 22px;
  }
}
@media (max-width: 459px) {
  p {
    font-size: 13px;
    line-height: 18px;
  }
}

a {
  color: rgb(30, 30, 30);
}

/*-------------------------------
	H1
-------------------------------*/
h1 {
  display: inline-block;
  font-family: "Montserrat", sans-serif;
  font-size: 36px;
  line-height: 36px;
  padding-bottom: 42px;
}

h1:after {
  content: "";
  display: block;
  width: 70%;
  margin: 0 auto;
  border-bottom: 4px solid rgba(14, 104, 58, 0.9);
  padding-top: 6px;
}

@media (max-width: 999px) { /* smaller than tablet size 1000px */
  h1 {
    font-size: 32px;
    line-height: 32px;
    padding-bottom: 28px;
  }
}
@media (max-width: 799px) { /* smaller than phone size 800px */
  h1 {
    font-size: 28px;
    line-height: 28px;
    padding-bottom: 17px;
  }
  h1:after {
    border-bottom: 3px solid rgba(14, 104, 58, 0.9);
    padding-top: 5px;
  }
}
@media (max-width: 459px) { /* smaller than phone size 460px */
  h1 {
    font-size: 22px;
    line-height: 22px;
    padding-bottom: 11px;
  }
  h1:after {
    padding-top: 3px;
  }
}
/*-------------------------------
	H2
-------------------------------*/
h2 {
  font-family: "Montserrat", sans-serif;
  font-size: 30px;
  line-height: 36px;
}
@media (max-width: 1199px) {
  h2 {
    font-size: 28px;
    line-height: 34px;
  }
}
@media (max-width: 999px) {
  h2 {
    font-size: 24px;
    line-height: 30px;
  }
}
@media (max-width: 799px) {
  h2 {
    font-size: 22px;
    line-height: 26px;
  }
}

h2.h2-grn {
  color: rgb(14, 104, 58);
  padding: 48px;
}

@media (max-width: 999px) { /* smaller than tablet size 1000px */
  h2.h2-grn {
    padding: 32px;
  }
}
/*-------------------------------
	H3
-------------------------------*/
h3 {
  font-family: "Montserrat", sans-serif;
  font-size: 24px;
  line-height: 32px;
}
@media (max-width: 1199px) {
  h3 {
    font-size: 22px;
    line-height: 30px;
  }
}
@media (max-width: 999px) {
  h3 {
    font-size: 20px;
    line-height: 26px;
  }
}
@media (max-width: 799px) {
  h3 {
    font-size: 18px;
    line-height: 22px;
  }
}

/*-------------------------------
	H4
-------------------------------*/
h4 {
  color: white;
  font-size: 20px;
  font-weight: normal;
  line-height: 24px;
  padding-bottom: 6px;
}

.btn {
  display: inline-block;
  font-family: "Montserrat", sans-serif;
  font-size: 14px;
  font-weight: normal;
  color: white;
  background: rgb(14, 104, 58);
  border: 0;
  border-radius: 6px;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
  min-width: 132px;
  padding: 16px 20px 14px 20px;
  white-space: nowrap;
  cursor: pointer;
  text-align: center;
  transition: all 200ms ease;
}

.no-touch .btn:hover {
  color: rgb(30, 30, 30);
  background: rgb(250, 210, 50);
  transition: all 200ms ease;
}

::selection {
  background: rgba(250, 210, 50, 0.996); /* yellow */
  color: rgb(30, 30, 30);
}

::-moz-selection {
  background: rgba(250, 210, 50, 0.996); /* yellow */
  color: rgb(30, 30, 30);
}

::placeholder {
  color: rgba(75, 75, 75, 0.5);
}

/*--------------------------------------------------------------
	MAIN
--------------------------------------------------------------*/
main {
  display: flex;
  justify-content: center;
  flex-direction: column;
  margin-top: 80px;
  min-height: 569px;
}

@media (max-width: 999px) { /* smaller than tablet size 1000px */
  main {
    min-height: 608px;
  }
}
@media (max-width: 799px) { /* smaller than phone size 800px */
  main {
    margin-top: 64px;
    min-height: 0;
  }
}
/*--------------------------------------------------------------
	WRAPPER
--------------------------------------------------------------*/
.wrapper {
  position: relative;
  margin: 0 auto;
  max-width: 1280px;
  padding: 0 32px;
}

@media (max-width: 799px) { /* smaller than phone size 800px */
  .wrapper {
    padding: 0 16px;
  }
}
/*--------------------------------------------------------------
	SHORTCUTS
--------------------------------------------------------------*/
#page-overlay {
  display: none;
  position: fixed;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  background: black;
  opacity: 0.6;
  z-index: 50;
}

.flex {
  display: flex;
  justify-content: space-between;
}

.align-c {
  text-align: center !important;
}

.align-l {
  text-align: left !important;
}

.align-r {
  text-align: right !important;
}

.clip-left {
  clip-path: polygon(15% 0%, 100% 0, 100% 100%, 0% 100%);
}

.clip-right {
  clip-path: polygon(0 0, 100% 0, 85% 100%, 0% 100%);
}

.grn {
  color: rgb(14, 104, 58);
  font-weight: bold;
  white-space: nowrap;
}

.bg-grey {
  background: rgb(240, 240, 240);
}

.bg-white {
  background: white;
}

/*--------------------------------------------------------------
	SASS IMPORT
--------------------------------------------------------------*/
/*--------------------------------------------------------------
	SASS IMPORT
--------------------------------------------------------------*/
/*--------------------------------------------------------------
	ICONS
--------------------------------------------------------------*/
header .icon-phone {
  position: relative;
  top: 1px;
  font-size: 14px;
  padding-right: 4px;
}

footer .icon-phone {
  position: relative;
  font-size: 14px;
  padding-right: 5px;
}

footer .icon-fax {
  position: relative;
  top: 1px;
  font-size: 15px;
  padding-right: 5px;
}

footer .icon-email {
  position: relative;
  top: 2px;
  font-size: 15px;
  padding-right: 6px;
}

footer .icon-watch {
  position: relative;
  top: 4px;
  font-size: 20px;
  padding-right: 2px;
  margin-left: -2px;
}

footer .icon-location {
  position: relative;
  top: 2px;
  font-size: 16px;
  padding-right: 3px;
}

footer .icon-mailbox {
  position: relative;
  top: 1px;
  font-size: 16px;
  padding-right: 4px;
}

footer .icon-sns-youtube {
  position: relative;
  top: 2px;
}

.icon-search {
  position: absolute;
  bottom: 11px;
  left: 14px;
  color: rgb(30, 30, 30);
}

/*--------------------------------------------------------------
	HEADER
--------------------------------------------------------------*/
header {
  position: fixed;
  top: 0;
  width: 100%;
  background: white;
  border-bottom: 1px solid rgb(200, 200, 200);
  box-shadow: 0 2px 10px 0 rgba(0, 0, 0, 0.15);
  z-index: 100;
}

/*-------------------------------
	TOP NAV
-------------------------------*/
#top-nav {
  display: flex;
  font-family: "Montserrat", sans-serif;
  font-weight: bold;
  font-size: 14px;
}

#top-nav li {
  transition: all 200ms ease;
}

#top-nav > li a {
  display: block;
  line-height: 80px;
  padding: 0 12px;
}

#top-nav ul {
  position: absolute;
  top: 80px;
  background: white;
  border: 1px solid #c8c8c8;
  box-shadow: 0 2px 10px 0 rgba(0, 0, 0, 0.15);
  min-width: 120px;
  opacity: 0;
  pointer-events: none;
}

#top-nav ul li a {
  display: block;
  line-height: 40px;
  padding: 0 12px;
}

.no-touch #top-nav li:hover {
  color: rgb(30, 30, 30);
  background: rgb(250, 210, 50);
  transition: all 200ms ease;
}

.no-touch #top-nav > li:hover ul {
  opacity: 1;
  pointer-events: auto;
  transition: all 200ms ease;
}

#btn-menu {
  display: none;
  font-size: 28px;
  color: rgb(14, 104, 58);
  background: white;
  padding: 16px 16px 13px 16px;
  border: none;
  cursor: pointer;
}

#logo img {
  height: 80px;
  padding: 16px 0;
}

#phone {
  text-align: right;
}

#phone span {
  display: block;
  white-space: nowrap;
  font-size: 16px;
  font-weight: bold;
  padding: 8px 0;
}

#phone .btn {
  font-family: "Open Sans", sans-serif;
  font-size: 12px;
  font-weight: bold;
  min-width: 0;
  padding: 12px 14px;
}

/*-------------------------------
	MOBILE NAV
-------------------------------*/
#mobile-nav {
  position: fixed;
  top: 64px;
  bottom: 0;
  left: -290px;
  font-family: "Montserrat", sans-serif;
  font-size: 14px;
  font-weight: bold;
  background: white;
  border: 1px solid #c8c8c8;
  border-bottom: none;
  box-shadow: 0 2px 10px 0 rgba(0, 0, 0, 0.15);
  z-index: 100;
  overflow-y: scroll;
  width: 280px;
  overflow-x: hidden;
  transition: all 200ms ease;
}

#mobile-nav.active {
  left: 0;
  transition: all 200ms ease;
}

#mobile-nav > li {
  position: relative;
  display: block;
  font-size: 16px;
  line-height: 56px;
  padding: 0 16px;
  margin-top: -1px;
  color: rgb(14, 104, 58);
  border-top: 1px solid #c8c8c8;
  border-bottom: 1px solid #c8c8c8;
  background: none;
  cursor: pointer;
  user-select: none;
}

#mobile-nav > li:after {
  font-family: "icons";
  content: "\e900";
  position: absolute;
  top: 1px;
  right: 16px;
  transition: all 200ms ease;
}

#mobile-nav > li.active:after {
  transform: rotate(180deg);
  transition: all 200ms ease;
}

#mobile-nav ul {
  display: none;
}

#mobile-nav a {
  display: block;
  line-height: 56px;
  padding: 0 16px 0 32px;
  border-bottom: 1px solid #c8c8c8;
  background: none;
  cursor: pointer;
}

/*--------------------------------------------------------------
	HEADER RESPONSIVE
--------------------------------------------------------------*/
@media (max-width: 799px) { /* smaller than phone size 800px */
  header .wrapper {
    padding-left: 0;
  }
  #top-nav {
    display: none;
  }
  #btn-menu {
    display: block;
  }
  #logo img {
    height: 64px;
    padding: 12px 0;
  }
  #phone {
    margin-left: auto;
  }
  #phone span {
    font-size: 15px;
    padding: 4px 0;
  }
  #phone .btn {
    padding: 10px;
  }
}
@media (max-width: 459px) { /* smaller than phone size 460px */
  header .wrapper {
    padding: 0;
  }
  #phone {
    visibility: hidden;
    width: 48px;
    margin-left: initial;
  }
}
/*--------------------------------------------------------------
	BREADCRUMBS
--------------------------------------------------------------*/
.breadcrumbs {
  font-size: 14px;
  line-height: 16px;
  font-weight: bold;
  padding-top: 8px;
  z-index: 2;
}

.breadcrumbs ul {
  display: flex;
}

.breadcrumbs li:not(:last-child) {
  position: relative;
  padding-right: 24px;
}

.breadcrumbs li:not(:last-child):after {
  display: inline-block;
  position: absolute;
  top: 1px;
  right: 6px;
  font-family: "icons";
  content: "\e900";
  font-size: 10px;
  transform: rotate(270deg);
}

.breadcrumbs a {
  color: rgb(14, 104, 58);
  transition: all 200ms ease;
}

.no-touch .breadcrumbs a:hover {
  color: rgb(250, 210, 50);
  transition: all 200ms ease;
}

/*--------------------------------------------------------------
	BREADCRUMBS RESPONSIVE
--------------------------------------------------------------*/
@media (max-width: 459px) { /* smaller than phone size 460px */
  .breadcrumbs {
    font-size: 12px;
    line-height: 12px;
  }
  .breadcrumbs li:not(:last-child) {
    padding-right: 18px;
  }
  .breadcrumbs li:not(:last-child):after {
    font-size: 8px;
    top: 1px;
    right: 4px;
  }
}
/*--------------------------------------------------------------
	FOOTER
--------------------------------------------------------------*/
footer {
  background: rgb(30, 30, 30);
  color: rgb(165, 165, 165);
}

footer .wrapper > .flex:nth-child(1) {
  padding: 48px 0;
}

footer .wrapper > .flex:nth-child(2) {
  align-items: flex-end;
}

footer a {
  color: rgb(165, 165, 165);
  transition: all 200ms ease;
}

.no-touch footer a:hover {
  color: rgb(250, 210, 50);
  transition: all 200ms ease;
}

footer p,
footer li {
  font-size: 16px;
  line-height: 22px;
}

footer li {
  padding-bottom: 4px;
  white-space: nowrap;
}

.indent {
  padding-left: 21px;
  margin-top: -4px;
}

#about-us {
  max-width: 470px;
  padding-right: 32px;
}

#contact-us span:nth-child(1) {
  padding-right: 32px;
}

#copyright {
  display: flex;
  align-items: center;
  font-size: 13px;
  line-height: 18px;
  padding-bottom: 2px;
}

#copyright span:first-of-type:after {
  content: "|";
  padding: 0 4px;
  position: relative;
  top: -1px;
}

#flag {
  width: 30px;
  padding-right: 6px;
  margin: 0;
}

#sns-links {
  display: flex;
}

#sns-links a {
  padding: 8px 10px;
}

#sns-links a:last-child {
  padding-right: 0;
}

#sns-links i {
  font-size: 20px;
  line-height: 24px;
}

/*--------------------------------------------------------------
	FOOTER RESPONSIVE
--------------------------------------------------------------*/
@media (max-width: 999px) { /* smaller than tablet size 1000px */
  footer .wrapper > .flex:nth-child(1) {
    padding: 32px 0;
  }
  footer p,
  footer li {
    font-size: 14px;
    line-height: 20px;
  }
}
@media (max-width: 799px) { /* smaller than phone size 800px */
  footer .wrapper > .flex:nth-child(1) {
    flex-wrap: wrap;
    justify-content: center;
  }
  #about-us {
    max-width: 400px;
    padding: 0 0 32px 0;
  }
  #contact-us {
    width: 400px;
  }
  #contact-us span:nth-child(1) {
    padding-right: 0;
  }
  footer .wrapper > .flex:nth-child(2) {
    flex-wrap: wrap-reverse;
    justify-content: center;
  }
  #copyright,
  #sns-links {
    width: 100%;
    justify-content: center;
  }
  #sns-links a:last-child {
    padding-right: 10px;
  }
}
@media (max-width: 459px) { /* smaller than phone size 460px */
  #about-us {
    max-width: 100%;
  }
  #contact-us {
    width: 100%;
  }
  #contact-us div {
    display: block;
  }
  #contact-us span:nth-child(1) {
    padding-right: 0;
  }
  #copyright {
    flex-wrap: wrap;
  }
}
/*--------------------------------------------------------------
	SASS IMPORT
--------------------------------------------------------------*/
/*--------------------------------------------------------------
	SASS IMPORT
--------------------------------------------------------------*/
/*--------------------------------------------------------------
	SLIDE
--------------------------------------------------------------*/
#slide {
  display: flex;
  align-items: center;
  user-drag: none;
  user-select: none;
  -moz-user-select: none;
  -webkit-user-drag: none;
  -webkit-user-select: none;
  -ms-user-select: none;
  cursor: -webkit-grab;
  cursor: grab;
  transform: translate3d(-1216px, 0, 0);
}

#slide.grab {
  cursor: -webkit-grabbing;
  cursor: grabbing;
}

#slide div {
  flex-shrink: 0;
  width: 100%;
  padding: 0 48px;
}

#slide img {
  max-height: 750px;
  border: 1px solid rgb(100, 100, 100);
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
}

#slide-container {
  position: relative;
}

#slide-container span {
  display: flex;
  align-items: center;
  position: absolute;
  top: 0;
  font-size: 48px;
  height: 100%;
  z-index: 1;
  padding: 0 20px;
  cursor: pointer;
  transition: all 200ms ease;
}

.no-touch #slide-container span:hover {
  color: rgb(250, 210, 50);
  transition: all 200ms ease;
}

#arrow-right {
  right: 0;
}

#arrow-left {
  left: 0;
  -webkit-transform: scaleX(-1);
  transform: scaleX(-1);
}

#thumbnails {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  padding: 48px;
}

#thumbnails img {
  margin: 6px;
  height: 120px;
  border: 1px solid rgb(100, 100, 100);
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
  opacity: 0.6;
  transition: all 200ms ease;
  cursor: pointer;
  text-align: center;
}

.no-touch #thumbnails img:hover {
  opacity: 1;
  transition: all 200ms ease;
}

#thumbnails img.active {
  opacity: 1;
}

/*--------------------------------------------------------------
	SLIDE RESPONSIVE
--------------------------------------------------------------*/
@media (max-width: 1199px) { /* smaller than tablet size 1200px */
  #slide-container span {
    display: none;
  }
}
@media (max-width: 999px) { /* smaller than tablet size 1000px */
  #slide div {
    padding: 0 32px;
  }
  #thumbnails {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    padding: 32px;
  }
}
@media (max-width: 799px) { /* smaller than phone size 800px */
  #slide div {
    padding: 0 16px;
  }
  #slide img {
    max-height: 500px;
  }
  #thumbnails {
    flex-wrap: nowrap;
    overflow-x: auto;
  }
}
/*--------------------------------------------------------------
	CARDS
--------------------------------------------------------------*/
.cards {
  flex-wrap: wrap;
  padding-bottom: 32px;
}

.cards div {
  position: relative;
  overflow: hidden;
  background: white;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
  margin-bottom: 48px;
}

.cards span {
  position: absolute;
  top: calc(100% - 48px);
  width: 100%;
  transition: all 300ms ease;
}

.cards p {
  font-size: 16px;
  line-height: 22px;
  font-weight: bold;
  background: rgba(255, 255, 255, 0.8);
  padding: 12px 16px;
}

.cards img {
  padding-bottom: 48px;
}

.cards div {
  width: calc(33.33% - 32px);
}

.cards .big-card {
  width: calc(50% - 24px);
}

.no-touch .cards div:hover span {
  transform: translateY(calc(-100% + 48px));
}

.cards h2 {
  font-family: "Montserrat", sans-serif;
  font-size: 18px;
  font-weight: normal;
  line-height: 48px;
  height: 48px;
  background: rgba(14, 104, 58, 0.9); /* green */
  color: white;
  text-align: center;
  white-space: nowrap;
}

/*--------------------------------------------------------------
	CARDS RESPONSIVE
--------------------------------------------------------------*/
@media (max-width: 1199px) { /* smaller than tablet size 1200px */
  .cards div {
    width: calc(33.33% - 24px);
  }
  .cards h2 {
    font-size: 15px;
  }
  .cards p {
    font-size: 14px;
    line-height: 18px;
    padding: 8px 12px;
  }
}
@media (max-width: 999px) { /* smaller than tablet size 1000px */
  .cards {
    padding-bottom: 0;
  }
  .cards div,
  .cards .big-card {
    width: calc(50% - 16px);
  }
}
@media (max-width: 799px) { /* smaller than phone size 800px */
  .cards {
    justify-content: center;
  }
  .cards div,
  .cards .big-card {
    width: 100%;
    max-width: 500px;
    margin-bottom: 32px;
  }
  .no-touch .cards div:hover span {
    transform: none;
  }
  .cards span {
    display: inline-block;
    position: relative;
    top: 0;
    text-align: center;
  }
  .cards h2 {
    display: inline-block;
    font-size: 14px;
    line-height: 20px;
    height: auto;
    min-width: 180px;
    border-radius: 6px;
    padding: 12px 16px 10px 16px;
    margin-top: 12px;
    white-space: nowrap;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
    transition: all 200ms ease;
  }
  .no-touch .cards h2:hover {
    color: rgb(30, 30, 30);
    background: rgb(250, 210, 50);
    transition: all 200ms ease;
  }
  .cards span p {
    text-align: left;
  }
  .cards img {
    padding-bottom: 0;
  }
}
/*--------------------------------------------------------------
	SASS IMPORT
--------------------------------------------------------------*/
/*--------------------------------------------------------------
	SASS IMPORT
--------------------------------------------------------------*/
/*--------------------------------------------------------------
	INTRO
--------------------------------------------------------------*/
#intro-overlay {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  margin: 0 auto;
  background: black;
  opacity: 0.6;
}

#intro {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  background: rgb(30, 30, 30);
  width: 100%;
  height: 600px;
  margin: 0 auto;
  overflow: hidden;
}

#intro video,
#intro img {
  position: absolute;
  min-width: 1420px;
  max-width: 2500px;
  width: 100% !important;
  margin-top: -100px;
}

#intro-box {
  flex-direction: column;
  text-align: center;
}

#intro-box span {
  font-family: "Montserrat", sans-serif;
  font-size: 40px;
  line-height: 48px;
  color: white;
}

#intro-buttons {
  padding-top: 16px;
}

#intro-buttons a {
  margin: 0 16px;
}

#intro img {
  z-index: 1;
}

#intro video {
  z-index: 2;
}

#intro-overlay {
  z-index: 3;
}

#intro-box {
  z-index: 4;
}

/*--------------------------------------------------------------
	BANNER
--------------------------------------------------------------*/
#banner {
  position: relative;
  font-family: "Montserrat", sans-serif;
  font-size: 30px;
  line-height: 36px;
  background: rgb(30, 30, 30);
  color: white;
  height: 300px;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
  z-index: 2;
}

#banner .flex {
  height: 300px;
  text-align: center;
  align-items: center;
}

#banner .flex div {
  width: 100%;
}

#banner .flex div:nth-child(1) span {
  float: left;
}

#banner .flex div:nth-child(3) span {
  float: right;
}

#banner .flex div:nth-child(2) {
  margin-top: -76px;
}

#sparks {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 300px;
  overflow: hidden;
}

#sparks img {
  position: relative;
  top: -316px;
  width: 760px;
}

/*--------------------------------------------------------------
	PRODUCTS
--------------------------------------------------------------*/
#products {
  position: relative;
  top: -392px;
}

#products .wrapper {
  position: relative;
  top: 392px;
}

/*--------------------------------------------------------------
	SERVICE PHOTOS
--------------------------------------------------------------*/
#service-photos {
  background: white;
}

#service-photos .flex {
  max-width: 2500px;
  margin: 0 auto;
}

#service-photos .clip-center {
  clip-path: polygon(50% 0%, 100% 0, 80% 100%, 20% 100%, 0 0);
}

#service-photos .clip-right {
  clip-path: polygon(0 0, 80% 0, 100% 100%, 0% 100%);
}

#service-photos .clip-left {
  clip-path: polygon(20% 0%, 100% 0, 100% 100%, 0% 100%);
}

/*--------------------------------------------------------------
	INTRO RESPONSIVE
--------------------------------------------------------------*/
@media (max-width: 799px) { /* smaller than phone size 800px */
  #intro {
    height: 320px;
  }
  #intro video,
  #intro img {
    min-width: 800px;
    margin-top: -40px;
  }
  #intro-box span {
    font-size: 32px;
    line-height: 40px;
  }
  #intro-buttons a {
    font-size: 12px;
    padding: 14px;
    margin: 0 12px;
  }
}
@media (max-width: 459px) { /* smaller than phone size 460px */
  #intro-box span {
    font-size: 26px;
    line-height: 32px;
  }
  #intro-buttons a {
    margin: 0 8px;
  }
}
@media (max-width: 374px) { /* smaller than phone size 375px */
  #intro-box span {
    font-size: 22px;
    line-height: 28px;
  }
  #intro-buttons {
    padding-top: 0;
  }
  #intro-buttons a {
    display: block;
    width: 158px;
    margin: 16px auto;
  }
}
/*--------------------------------------------------------------
	BANNER RESPONSIVE
--------------------------------------------------------------*/
@media (max-width: 1199px) { /* smaller than tablet size 1200px */
  #banner {
    font-size: 24px;
    line-height: 28px;
    height: 240px;
  }
  #banner .flex {
    height: 240px;
  }
  #sparks {
    height: 240px;
  }
  #sparks img {
    top: -260px;
    width: 620px;
  }
}
@media (max-width: 999px) { /* smaller than tablet size 1000px */
  #banner {
    font-size: 18px;
    line-height: 22px;
    height: 180px;
  }
  #banner .flex {
    height: 180px;
  }
  #sparks {
    height: 180px;
  }
  #sparks img {
    top: -208px;
    width: 480px;
  }
  #banner .wrapper div:nth-child(2) {
    margin-top: -60px;
  }
}
@media (max-width: 799px) { /* smaller than phone size 800px */
  #banner {
    font-size: 16px;
    line-height: 20px;
    height: 140px;
  }
  #banner .flex {
    height: 140px;
  }
  #sparks {
    height: 140px;
  }
  #sparks img {
    top: -180px;
    width: 400px;
  }
  #banner .wrapper div:nth-child(2) {
    margin-top: -48px;
  }
}
@media (max-width: 639px) { /* smaller than phone size 640px */
  #banner {
    font-size: 12px;
    line-height: 16px;
    height: 120px;
  }
  #banner .flex {
    height: 120px;
  }
  #sparks {
    height: 120px;
  }
  #sparks img {
    top: -140px;
    width: 320px;
  }
  #banner .wrapper div:nth-child(2) {
    margin-top: -40px;
  }
}
@media (max-width: 459px) { /* smaller than phone size 460px */
  #banner {
    font-size: 10px;
    line-height: 14px;
    height: 100px;
  }
  #banner .flex {
    height: 100px;
  }
  #sparks {
    height: 100px;
  }
  #sparks img {
    top: -94px;
    width: 240px;
  }
  #banner .wrapper div:nth-child(2) {
    margin-top: -32px;
  }
}
/*--------------------------------------------------------------
	SASS IMPORT
--------------------------------------------------------------*/
/*--------------------------------------------------------------
	SASS IMPORT
--------------------------------------------------------------*/
/*--------------------------------------------------------------
	CONTACT INFO
--------------------------------------------------------------*/
#contact-info {
  padding-bottom: 64px;
}

#contact-info .flex {
  flex-wrap: wrap;
}

#contact-info ul {
  text-align: center;
}

#contact-info ul {
  width: 50%;
}

#contact-info ul:nth-child(1) {
  padding-bottom: 64px;
}

#contact-info i {
  font-size: 48px;
  color: rgb(14, 104, 58);
}

#contact-info h2 {
  font-family: "Montserrat", sans-serif;
  font-size: 26px;
  line-height: 40px;
}

#contact-info li {
  font-size: 22px;
  line-height: 30px;
}
@media (max-width: 999px) {
  #contact-info li {
    font-size: 20px;
    line-height: 28px;
  }
}
@media (max-width: 799px) {
  #contact-info li {
    font-size: 18px;
    line-height: 26px;
  }
}
@media (max-width: 639px) {
  #contact-info li {
    font-size: 16px;
    line-height: 22px;
  }
}
@media (max-width: 459px) {
  #contact-info li {
    font-size: 13px;
    line-height: 18px;
  }
}

/*--------------------------------------------------------------
	CONTACT FORM
--------------------------------------------------------------*/
#contact {
  background: rgb(240, 240, 240);
  z-index: 1;
}

#map {
  height: 380px;
  max-width: 2500px;
  margin: 0 auto;
}

#map iframe {
  width: 100%;
  height: 100%;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
  border: 0;
}

/*--------------------------------------------------------------
	CONTACT INFO RESPONSIVE
--------------------------------------------------------------*/
@media (max-width: 999px) { /* smaller than tablet size 1000px */
  #contact-info,
  #contact-info ul:nth-child(1) {
    padding-bottom: 48px;
  }
  #contact-info h2 {
    font-size: 22px;
    line-height: 32px;
  }
}
@media (max-width: 799px) { /* smaller than phone size 800px */
  #contact-info,
  #contact-info ul:nth-child(1),
  #contact-info ul:nth-child(4) {
    padding-bottom: 32px;
  }
  #contact-info h2 {
    font-size: 20px;
    line-height: 30px;
  }
  #contact-info ul {
    width: 50%;
  }
}
@media (max-width: 459px) { /* smaller than phone size 460px */
  #contact-info h2 {
    font-size: 16px;
    line-height: 24px;
  }
}
@media (max-width: 374px) { /* smaller than phone size 375px */
  #contact-info ul {
    width: 100%;
    padding-bottom: 32px;
  }
  #contact-info ul:nth-child(6) {
    padding-bottom: 0;
  }
}
/*--------------------------------------------------------------
	CONTACT MAP RESPONSIVE
--------------------------------------------------------------*/
@media (max-width: 999px) { /* smaller than tablet size 1000px */
  #map {
    height: 300px;
  }
}
@media (max-width: 799px) { /* smaller than phone size 800px */
  #map {
    height: 240px;
  }
}
@media (max-width: 639px) { /* smaller than phone size 640px */
  #map {
    height: 199px;
  }
}
@media (max-width: 459px) { /* smaller than phone size 460px */
  #map {
    height: 180px;
  }
}
/*--------------------------------------------------------------
	SASS IMPORT
--------------------------------------------------------------*/
/*--------------------------------------------------------------
	SASS IMPORT
--------------------------------------------------------------*/
/*--------------------------------------------------------------
	SERVICES
--------------------------------------------------------------*/
#service-centers {
  padding: 64px 0;
  background: rgb(240, 240, 240);
}

#service-centers .wrapper {
  max-width: 1000px;
}

#service-centers p {
  padding-bottom: 64px;
}

#services .wrapper {
  max-width: 1216px;
  padding: 0;
}

#services .flex {
  align-items: center;
  flex-wrap: wrap;
  justify-content: center;
}

#services .flex div {
  width: 50%;
}

#services p {
  font-size: 18px;
  line-height: 24px;
}
@media (max-width: 1199px) {
  #services p {
    font-size: 16px;
    line-height: 22px;
  }
}
@media (max-width: 999px) {
  #services p {
    font-size: 14px;
    line-height: 20px;
  }
}

#services h3,
#services p {
  padding: 0 32px;
}

#services .flex div {
  position: relative;
  top: -218px;
}

#services .flex div h3,
#services .flex div p,
#services .flex img {
  position: relative;
  top: 218px;
}

/*--------------------------------------------------------------
	SERVICES RESPONSIVE
--------------------------------------------------------------*/
@media (max-width: 999px) { /* smaller than tablet size 1000px */
  #service-centers {
    padding: 48px 0;
  }
  #service-centers p {
    padding-bottom: 48px;
  }
}
@media (max-width: 799px) { /* smaller than phone size 800px */
  #service-centers {
    padding: 32px 0;
  }
  #service-centers p {
    padding-bottom: 32px;
  }
  #services .flex div {
    width: 100%;
    max-width: 540px;
    padding-top: 32px;
  }
  #services h3,
  #services p {
    padding: 0 16px;
  }
  #services .flex div:nth-child(1) {
    order: 0;
  }
  #services .flex div:nth-child(2) {
    order: 1;
  }
  #services .flex div:nth-child(3) {
    order: 3;
  }
  #services .flex div:nth-child(4) {
    order: 2;
  }
  #services .flex div:nth-child(5) {
    order: 4;
  }
  #services .flex div:nth-child(6) {
    order: 5;
  }
  #services .flex div:nth-child(7) {
    order: 7;
  }
  #services .flex div:nth-child(8) {
    order: 6;
  }
  #services .flex div:nth-child(9) {
    order: 8;
  }
  #services .flex div:nth-child(10) {
    order: 9;
  }
}
/*--------------------------------------------------------------
	TITLE
--------------------------------------------------------------*/
.title {
  position: relative;
  text-align: center;
  padding: 59px 0 64px 0;
  z-index: 1;
}

.title p {
  margin: 0 auto;
}

.title .btn {
  margin-top: 48px;
}

/*--------------------------------------------------------------
	TITLE RESPONSIVE
--------------------------------------------------------------*/
@media (max-width: 999px) { /* smaller than tablet size 1000px */
  .title {
    padding: 44px 0 48px 0;
  }
}
@media (max-width: 799px) { /* smaller than phone size 800px */
  .title {
    padding: 28px 0 32px 0;
  }
  .title p {
    text-align: left;
  }
  .title .btn {
    margin-top: 32px;
  }
}
@media (max-width: 459px) { /* smaller than phone size 460px */
  .title {
    padding: 22px 0 24px 0;
  }
  .title .btn {
    padding: 14px 16px 12px 16px;
    margin-top: 24px;
  }
}
/*--------------------------------------------------------------
	IMG
--------------------------------------------------------------*/
.img-mobile {
  display: none;
}

.img-full-width {
  width: 100%;
  max-width: 2500px;
}

/*--------------------------------------------------------------
	IMG RESPONSIVE
--------------------------------------------------------------*/
@media (max-width: 799px) { /* smaller than phone size 800px */
  .img-mobile {
    display: block;
  }
  .img-full-width {
    display: none;
  }
}
/*--------------------------------------------------------------
	TAB-SECTION
--------------------------------------------------------------*/
#tab-section {
  position: relative;
  padding-top: 64px;
}

#tab-section:before {
  content: "";
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgb(30, 30, 30);
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center;
  background-attachment: fixed;
}

.bg1:before {
  background-image: url("../img/bg/warehouse1.jpg");
}

.bg2:before {
  background-image: url("../img/bg/warehouse2.jpg");
}

.bg3:before {
  background-image: url("../img/bg/warehouse3.jpg");
}

.bg4:before {
  background-image: url("../img/bg/warehouse4.jpg");
}

/*--------------------------------------------------------------
	TAB-SECTION RESPONSIVE
--------------------------------------------------------------*/
@media (max-width: 999px) { /* smaller than tablet size 1000px */
  #tab-section {
    padding-top: 32px;
  }
}
@media (max-width: 799px) { /* smaller than phone size 800px */
  #tab-section {
    padding-top: 0;
  }
  #tab-section .wrapper {
    padding: 0;
  }
}
/*--------------------------------------------------------------
	TABS
--------------------------------------------------------------*/
#tabs {
  display: flex;
  justify-content: center;
}

#tabs h2 {
  font-family: "Montserrat", sans-serif;
  font-size: 20px;
  line-height: 20px;
  font-weight: bold;
  display: inline-block;
  position: relative;
  padding: 18px 32px;
  z-index: 1;
  min-width: 160px;
  text-align: center;
  cursor: pointer;
}

#tabs h2:before {
  content: "";
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgb(220, 220, 220);
  transform: skew(-15deg);
  z-index: -1;
  border-right: 1px solid rgb(150, 150, 150);
  border-bottom: 1px solid rgb(150, 150, 150);
  transition: all 200ms ease;
}

#tabs h2:last-child:before {
  border-right: none;
}

#tabs h2.active {
  color: rgb(14, 104, 58);
}

#tabs h2.active:before {
  background: white;
  border-bottom: none;
  transition: none;
}

.no-touch #tabs h2:hover:before {
  background: rgb(250, 210, 50);
  transition: all 200ms ease;
}

.no-touch #tabs h2.active:hover:before {
  background: white;
  border-bottom: none;
  transition: none;
}

/*--------------------------------------------------------------
	TABS RESPONSIVE
--------------------------------------------------------------*/
@media (max-width: 799px) { /* smaller than phone size 800px */
  #tabs {
    display: none;
  }
}
/*--------------------------------------------------------------
	TAB CONTENT
--------------------------------------------------------------*/
#specifications,
#system-requirements,
#photos {
  display: none;
}

#tab-content {
  background: white;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
}

#tab-content > h2 {
  display: none;
  font-family: "Montserrat", sans-serif;
  font-size: 24px;
  line-height: 48px;
  padding: 0 32px;
  color: white;
  background: rgb(14, 104, 58);
  font-weight: normal;
}

#tab-content p,
#tab-content li {
  font-size: 18px;
  line-height: 24px;
}
@media (max-width: 1199px) {
  #tab-content p,
  #tab-content li {
    font-size: 16px;
    line-height: 22px;
  }
}
@media (max-width: 999px) {
  #tab-content p,
  #tab-content li {
    font-size: 14px;
    line-height: 20px;
  }
}

/*--------------------------------------------------------------
	TAB CONTENT RESPONSIVE
--------------------------------------------------------------*/
@media (max-width: 799px) { /* smaller than phone size 800px */
  #features,
  #specifications,
  #system-requirements,
  #photos {
    display: block !important;
  }
  #tab-content > h2 {
    display: block;
  }
  #features .clip-left,
  #features .clip-right,
  #services .clip-left,
  #services .clip-right {
    clip-path: none;
  }
}
/*--------------------------------------------------------------
	FEATURES
--------------------------------------------------------------*/
#features ul {
  display: inline-block;
  padding: 0 32px 0 64px;
  text-align: left;
}

#features li {
  list-style-type: disc;
}

#features .flex {
  flex-wrap: wrap;
}

#features .flex div {
  width: 50%;
}

#features .flex img {
  width: 100%;
}

#features.vanguard .flex {
  align-items: center;
}

#features.vanguard .flex div {
  text-align: center;
}

#features.consumables ul a {
  color: rgb(14, 104, 58);
  font-weight: bold;
  transition: all 200ms ease;
}

.no-touch #features.consumables ul a:hover {
  color: rgb(250, 210, 50);
  transition: all 200ms ease;
}

/*-------------------------------
	FEATURES DIVS
-------------------------------*/
/* MAX WIDTH */
#features.v-cat-drive-system .flex div:nth-child(4) {
  max-width: 840px;
}

#features.v-cat-drive-system .flex div:nth-child(12) {
  max-width: 870px;
}

#features.plasma-cutting-tables .flex div:nth-child(5) {
  max-width: 1060px;
}

#features.consumables div:nth-child(2) img {
  max-width: 480px;
}

#features.consumables div:nth-child(5) img {
  max-width: 660px;
}

#features.consumables div:nth-child(9) img {
  max-width: 520px;
}

/* FULL WIDTH HEADER & UL */
#features.v-cat-drive-system .flex div:nth-child(1),
#features.v-cat-drive-system .flex div:nth-child(9),
#features.plasma-cutting-tables .flex div:nth-child(10),
#features.dust-collectors .flex div:nth-child(7),
#features.plasma-systems .flex div:nth-child(3),
#features.mhb .flex div:nth-child(1),
#features.bhb .flex div:nth-child(1),
#features.bhb .flex div:nth-child(2),
#features.ehd .flex div:nth-child(1),
#features.ehd .flex div:nth-child(2),
#features.pronest .flex div:nth-child(1),
#features.pronest .flex div:nth-child(8),
#features.design2fab .flex div:nth-child(1),
#features.design2fab .flex div:nth-child(7),
#features.consumables div:nth-child(2) img,
#features.consumables div:nth-child(5) img,
#features.consumables div:nth-child(9) img {
  width: 100%;
}

/* CENTERED FULL WIDTH P */
#features.v-cat-drive-system .flex div:nth-child(4),
#features.v-cat-drive-system .flex div:nth-child(12),
#features.plasma-cutting-tables .flex div:nth-child(5) {
  width: 100%;
  margin: 0 auto;
  padding: 48px;
  text-align: center;
}

/* PADDING TOP */
#features.v-cat-drive-system .flex div:nth-child(7),
#features.plasma-cutting-tables .flex div:nth-child(8),
#features.plasma-cutting-tables .flex div:nth-child(9),
#features.dust-collectors .flex div:nth-child(1),
#features.dust-collectors .flex div:nth-child(2),
#features.dust-collectors .flex div:nth-child(3),
#features.dust-collectors .flex div:nth-child(4),
#features.dust-collectors .flex div:nth-child(5),
#features.dust-collectors .flex div:nth-child(6),
#features.plasma-systems .flex div:nth-child(1),
#features.mhb .flex div:nth-child(1),
#features.mhb .flex div:nth-child(2) ul,
#features.mhb .flex div:nth-child(3),
#features.mhb .flex div:nth-child(4),
#features.mhb .flex div:nth-child(5),
#features.bhb .flex div:nth-child(1),
#features.bhb .flex div:nth-child(2),
#features.bhb .flex div:nth-child(3),
#features.bhb .flex div:nth-child(4),
#features.bhb .flex div:nth-child(5) ul,
#features.bhb .flex div:nth-child(6),
#features.bhb .flex div:nth-child(7),
#features.bhb .flex div:nth-child(8),
#features.ehd .flex div:nth-child(1),
#features.ehd .flex div:nth-child(2),
#features.ehd .flex div:nth-child(3),
#features.ehd .flex div:nth-child(4),
#features.ehd .flex div:nth-child(5) ul,
#features.ehd .flex div:nth-child(6),
#features.ehd .flex div:nth-child(7),
#features.ehd .flex div:nth-child(8),
#features.vader .flex div:nth-child(1),
#features.vader .flex div:nth-child(2),
#features.vader .flex div:nth-child(3),
#features.vader .flex div:nth-child(4),
#features.vader .flex div:nth-child(5),
#features.vader .flex div:nth-child(6),
#features.volume .flex div:nth-child(1),
#features.volume .flex div:nth-child(2),
#features.volume .flex div:nth-child(3) ul,
#features.volume .flex div:nth-child(4),
#features.pronest .flex div:nth-child(4),
#features.pronest .flex div:nth-child(5),
#features.pronest .flex div:nth-child(6),
#features.pronest .flex div:nth-child(7),
#features.pronest .flex div:nth-child(11),
#features.pronest .flex div:nth-child(12),
#features.pronest .flex div:nth-child(13),
#features.pronest .flex div:nth-child(14),
#features.pronest .flex div:nth-child(15),
#features.pronest .flex div:nth-child(16),
#features.design2fab .flex div:nth-child(4),
#features.design2fab .flex div:nth-child(5),
#features.design2fab .flex div:nth-child(6),
#features.consumables div:nth-child(9) {
  padding-top: 48px;
}

/* PADDING TOP & BOTTOM */
#features.v-cat-drive-system .flex div:nth-child(15),
#features.v-cat-drive-system .flex div:nth-child(16),
#features.plasma-cutting-tables .flex div:nth-child(10),
#features.dust-collectors .flex div:nth-child(10),
#features.dust-collectors .flex div:nth-child(11),
#features.mhb .flex div:nth-child(6),
#features.mhb .flex div:nth-child(7),
#features.bhb .flex div:nth-child(9),
#features.bhb .flex div:nth-child(10),
#features.ehd .flex div:nth-child(9),
#features.vader .flex div:nth-child(7),
#features.vader .flex div:nth-child(8),
#features.pronest .flex div:nth-child(17),
#features.design2fab .flex div:nth-child(10),
#features.design2fab .flex div:nth-child(11),
#features.consumables div:nth-child(10) {
  padding: 48px 0;
}

/* PADDING LEFT & RIGHT */
#features.plasma-systems .flex div:nth-child(8),
#features.consumables .flex div:nth-child(1) {
  padding: 0 48px;
}

/* PADDING ALL SIDES */
#features.plasma-systems .flex div:nth-child(3),
#features.plasma-systems .flex div:nth-child(6),
#features.plasma-systems .flex div:nth-child(7),
#features.volume .flex div:nth-child(3) ul:last-child,
#features.volume .flex div:nth-child(4) ul {
  padding: 48px 48px 48px 64px;
}

#features.plasma-cutting-tables .flex div:nth-child(2) {
  text-align: right;
}

#features.mhb .flex div:nth-child(3) img,
#features.bhb .flex div:nth-child(6) img,
#features.ehd .flex div:nth-child(6) img {
  max-width: 283px;
  margin: 0 0 0 64px;
}

#features.bhb .flex div:nth-child(4) h3,
#features.ehd .flex div:nth-child(4) h3 {
  height: 32px;
}

#features.plasma-systems .flex div:nth-child(7) {
  overflow-x: auto;
}

#features.plasma-systems td {
  font-size: 14px;
  font-weight: bold;
  padding: 8px;
  border: 1px solid rgb(30, 30, 30);
  text-align: center;
}

#features.plasma-systems td:first-child {
  text-align: left;
}

/*--------------------------------------------------------------
	FEATURES RESPONSIVE
--------------------------------------------------------------*/
@media (max-width: 1199px) { /* smaller than tablet size 1200px */
  /* MAX WIDTH OF P */
  #features.v-cat-drive-system .flex div:nth-child(4) {
    max-width: 750px;
  }
  #features.v-cat-drive-system .flex div:nth-child(12) {
    max-width: 780px;
  }
  #features.plasma-cutting-tables .flex div:nth-child(5) {
    max-width: 960px;
  }
  #features.mhb .flex div:nth-child(3) img,
  #features.bhb .flex div:nth-child(6) img,
  #features.ehd .flex div:nth-child(6) img {
    max-width: 264px;
  }
  #features.bhb .flex div:nth-child(4) h3,
  #features.ehd .flex div:nth-child(4) h3 {
    height: 30px;
  }
}
@media (max-width: 999px) { /* smaller than tablet size 1000px */
  #features ul {
    padding: 0 32px 0 48px;
  }
  /* MAX WIDTH */
  #features.v-cat-drive-system .flex div:nth-child(4) {
    max-width: 640px;
  }
  #features.v-cat-drive-system .flex div:nth-child(12) {
    max-width: 680px;
  }
  #features.consumables div:nth-child(2) img {
    max-width: 360px;
  }
  #features.consumables div:nth-child(5) img {
    max-width: 540px;
  }
  #features.consumables div:nth-child(9) img {
    max-width: 400px;
  }
  /* CENTERED FULL WIDTH P */
  #features.v-cat-drive-system .flex div:nth-child(4),
  #features.v-cat-drive-system .flex div:nth-child(12),
  #features.plasma-cutting-tables .flex div:nth-child(5) {
    padding: 32px;
  }
  /* PADDING TOP */
  #features.v-cat-drive-system .flex div:nth-child(7),
  #features.plasma-cutting-tables .flex div:nth-child(8),
  #features.plasma-cutting-tables .flex div:nth-child(9),
  #features.dust-collectors .flex div:nth-child(1),
  #features.dust-collectors .flex div:nth-child(2),
  #features.dust-collectors .flex div:nth-child(3),
  #features.dust-collectors .flex div:nth-child(4),
  #features.dust-collectors .flex div:nth-child(5),
  #features.dust-collectors .flex div:nth-child(6),
  #features.plasma-systems .flex div:nth-child(1),
  #features.mhb .flex div:nth-child(1),
  #features.mhb .flex div:nth-child(2) ul,
  #features.mhb .flex div:nth-child(3),
  #features.mhb .flex div:nth-child(4),
  #features.mhb .flex div:nth-child(5),
  #features.bhb .flex div:nth-child(1),
  #features.bhb .flex div:nth-child(2),
  #features.bhb .flex div:nth-child(3),
  #features.bhb .flex div:nth-child(4),
  #features.bhb .flex div:nth-child(5) ul,
  #features.bhb .flex div:nth-child(6),
  #features.bhb .flex div:nth-child(7),
  #features.bhb .flex div:nth-child(8),
  #features.ehd .flex div:nth-child(1),
  #features.ehd .flex div:nth-child(2),
  #features.ehd .flex div:nth-child(3),
  #features.ehd .flex div:nth-child(4),
  #features.ehd .flex div:nth-child(5) ul,
  #features.ehd .flex div:nth-child(6),
  #features.ehd .flex div:nth-child(7),
  #features.ehd .flex div:nth-child(8),
  #features.vader .flex div:nth-child(1),
  #features.vader .flex div:nth-child(2),
  #features.vader .flex div:nth-child(3),
  #features.vader .flex div:nth-child(4),
  #features.vader .flex div:nth-child(5),
  #features.vader .flex div:nth-child(6),
  #features.volume .flex div:nth-child(1),
  #features.volume .flex div:nth-child(2),
  #features.volume .flex div:nth-child(3) ul,
  #features.volume .flex div:nth-child(4),
  #features.pronest .flex div:nth-child(4),
  #features.pronest .flex div:nth-child(5),
  #features.pronest .flex div:nth-child(6),
  #features.pronest .flex div:nth-child(7),
  #features.pronest .flex div:nth-child(11),
  #features.pronest .flex div:nth-child(12),
  #features.pronest .flex div:nth-child(13),
  #features.pronest .flex div:nth-child(14),
  #features.pronest .flex div:nth-child(15),
  #features.pronest .flex div:nth-child(16),
  #features.design2fab .flex div:nth-child(4),
  #features.design2fab .flex div:nth-child(5),
  #features.design2fab .flex div:nth-child(6),
  #features.consumables div:nth-child(9) {
    padding-top: 32px;
  }
  /* PADDING TOP & BOTTOM */
  #features.v-cat-drive-system .flex div:nth-child(15),
  #features.v-cat-drive-system .flex div:nth-child(16),
  #features.plasma-cutting-tables .flex div:nth-child(10),
  #features.dust-collectors .flex div:nth-child(10),
  #features.dust-collectors .flex div:nth-child(11),
  #features.mhb .flex div:nth-child(6),
  #features.mhb .flex div:nth-child(7),
  #features.bhb .flex div:nth-child(9),
  #features.bhb .flex div:nth-child(10),
  #features.ehd .flex div:nth-child(9),
  #features.vader .flex div:nth-child(7),
  #features.vader .flex div:nth-child(8),
  #features.pronest .flex div:nth-child(17),
  #features.design2fab .flex div:nth-child(10),
  #features.design2fab .flex div:nth-child(11),
  #features.consumables div:nth-child(10) {
    padding: 32px 0;
  }
  /* PADDING LEFT & RIGHT */
  #features.plasma-systems .flex div:nth-child(8),
  #features.consumables .flex div:nth-child(1) {
    padding: 0 32px;
  }
  /* PADDING ALL SIDES */
  #features.plasma-systems .flex div:nth-child(3),
  #features.plasma-systems .flex div:nth-child(6),
  #features.plasma-systems .flex div:nth-child(7),
  #features.volume .flex div:nth-child(3) ul:last-child,
  #features.volume .flex div:nth-child(4) ul {
    padding: 32px 32px 32px 48px;
  }
  #features.mhb .flex div:nth-child(3) img,
  #features.bhb .flex div:nth-child(6) img,
  #features.ehd .flex div:nth-child(6) img {
    max-width: 240px;
    margin: 0 0 0 48px;
  }
  #features.bhb .flex div:nth-child(4) h3,
  #features.ehd .flex div:nth-child(4) h3 {
    height: 26px;
  }
}
@media (max-width: 799px) { /* smaller than phone size 800px */
  #features .flex div {
    width: 100%;
  }
  /* ALIGN LEFT */
  #features.vanguard .flex div,
  #features.plasma-cutting-tables .flex div:nth-child(2) {
    text-align: left;
  }
  /* REMOVE PADDING TOP */
  #features.v-cat-drive-system .flex div:nth-child(4),
  #features.dust-collectors .flex div:nth-child(11),
  #features.mhb .flex div:nth-child(7),
  #features.bhb .flex div:nth-child(4),
  #features.bhb .flex div:nth-child(10),
  #features.ehd .flex div:nth-child(4),
  #features.vader .flex div:nth-child(6),
  #features.volume .flex div:nth-child(4),
  #features.design2fab .flex div:nth-child(11),
  #features.consumables div:nth-child(1) h2 {
    padding-top: 0;
  }
  /* PADDING TOP */
  #features.v-cat-drive-system .flex div:nth-child(6),
  #features.plasma-cutting-tables .flex div:nth-child(7),
  #features.dust-collectors .flex div:nth-child(9),
  #features.plasma-systems .flex div:nth-child(5),
  #features.pronest .flex div:nth-child(3),
  #features.pronest .flex div:nth-child(10),
  #features.design2fab .flex div:nth-child(3),
  #features.design2fab .flex div:nth-child(9),
  #features.consumables .flex div:nth-child(2) {
    padding-top: 32px;
  }
  /* PADDING TOP & BOTTOM */
  #features.vanguard .flex div:nth-child(1),
  #features.vanguard .flex div:nth-child(4),
  #features.vanguard .flex div:nth-child(5),
  #features.vanguard .flex div:nth-child(8),
  #features.vanguard .flex div:nth-child(9),
  #features.vanguard .flex div:nth-child(12),
  #features.v-cat-drive-system .flex div:nth-child(5) {
    padding: 32px 0;
  }
  #features.plasma-systems .flex div:nth-child(7) {
    padding: 0 48px 32px 48px;
  }
  #features.mhb .flex div:nth-child(3) img,
  #features.bhb .flex div:nth-child(6) img,
  #features.ehd .flex div:nth-child(6) img {
    max-width: 200px;
    margin: 0 auto;
  }
  #features.bhb .flex div:nth-child(4) h3,
  #features.ehd .flex div:nth-child(4) h3 {
    display: none;
  }
  /*-------------------------------
  	FEATURES DIV ORDER
  -------------------------------*/
  #features.vanguard .flex div:nth-child(1) {
    order: 1;
  }
  #features.vanguard .flex div:nth-child(2) {
    order: 0;
  }
  #features.vanguard .flex div:nth-child(3) {
    order: 3;
  }
  #features.vanguard .flex div:nth-child(4) {
    order: 4;
  }
  #features.vanguard .flex div:nth-child(5) {
    order: 6;
  }
  #features.vanguard .flex div:nth-child(6) {
    order: 5;
  }
  #features.vanguard .flex div:nth-child(7) {
    order: 7;
  }
  #features.vanguard .flex div:nth-child(8) {
    order: 8;
  }
  #features.vanguard .flex div:nth-child(9) {
    order: 10;
  }
  #features.vanguard .flex div:nth-child(10) {
    order: 9;
  }
  #features.vanguard .flex div:nth-child(11) {
    order: 11;
  }
  #features.vanguard .flex div:nth-child(12) {
    order: 12;
  }
  #features.v-cat-drive-system .flex div:nth-child(1) {
    order: 0;
  }
  #features.v-cat-drive-system .flex div:nth-child(2) {
    order: 2;
  }
  #features.v-cat-drive-system .flex div:nth-child(3) {
    order: 4;
  }
  #features.v-cat-drive-system .flex div:nth-child(4) {
    order: 1;
  }
  #features.v-cat-drive-system .flex div:nth-child(5) {
    order: 3;
  }
  #features.v-cat-drive-system .flex div:nth-child(6) {
    order: 6;
  }
  #features.v-cat-drive-system .flex div:nth-child(7) {
    order: 7;
  }
  #features.v-cat-drive-system .flex div:nth-child(8) {
    order: 8;
  }
  #features.v-cat-drive-system .flex div:nth-child(9) {
    order: 9;
  }
  #features.v-cat-drive-system .flex div:nth-child(10) {
    order: 10;
  }
  #features.v-cat-drive-system .flex div:nth-child(11) {
    display: none;
  }
  #features.v-cat-drive-system .flex div:nth-child(12) {
    order: 11;
  }
  #features.v-cat-drive-system .flex div:nth-child(13) {
    order: 12;
  }
  #features.v-cat-drive-system .flex div:nth-child(14) {
    order: 14;
  }
  #features.v-cat-drive-system .flex div:nth-child(15) {
    order: 13;
  }
  #features.v-cat-drive-system .flex div:nth-child(16) {
    order: 15;
  }
  #features.plasma-cutting-tables .flex div:nth-child(1) {
    order: 0;
  }
  #features.plasma-cutting-tables .flex div:nth-child(2) {
    order: 2;
  }
  #features.plasma-cutting-tables .flex div:nth-child(3) {
    order: 1;
  }
  #features.plasma-cutting-tables .flex div:nth-child(4) {
    order: 3;
  }
  #features.plasma-cutting-tables .flex div:nth-child(5) {
    order: 4;
  }
  #features.plasma-cutting-tables .flex div:nth-child(6) {
    order: 5;
  }
  #features.plasma-cutting-tables .flex div:nth-child(7) {
    order: 6;
  }
  #features.plasma-cutting-tables .flex div:nth-child(8) {
    order: 7;
  }
  #features.plasma-cutting-tables .flex div:nth-child(9) {
    order: 8;
  }
  #features.plasma-cutting-tables .flex div:nth-child(10) {
    order: 9;
  }
  #features.mhb .flex div:nth-child(1) {
    order: 0;
  }
  #features.mhb .flex div:nth-child(2) {
    order: 1;
  }
  #features.mhb .flex div:nth-child(3) {
    order: 2;
  }
  #features.mhb .flex div:nth-child(4) {
    order: 4;
  }
  #features.mhb .flex div:nth-child(5) {
    order: 3;
  }
  #features.mhb .flex div:nth-child(6) {
    order: 5;
  }
  #features.mhb .flex div:nth-child(7) {
    order: 6;
  }
  #features.bhb .flex div:nth-child(1) {
    order: 0;
  }
  #features.bhb .flex div:nth-child(2) {
    order: 1;
  }
  #features.bhb .flex div:nth-child(3) {
    order: 2;
  }
  #features.bhb .flex div:nth-child(4) {
    order: 3;
  }
  #features.bhb .flex div:nth-child(5) {
    order: 4;
  }
  #features.bhb .flex div:nth-child(6) {
    order: 5;
  }
  #features.bhb .flex div:nth-child(7) {
    order: 7;
  }
  #features.bhb .flex div:nth-child(8) {
    order: 6;
  }
  #features.bhb .flex div:nth-child(9) {
    order: 8;
  }
  #features.bhb .flex div:nth-child(10) {
    order: 9;
  }
  #features.ehd .flex div:nth-child(1) {
    order: 0;
  }
  #features.ehd .flex div:nth-child(2) {
    order: 1;
  }
  #features.ehd .flex div:nth-child(3) {
    order: 2;
  }
  #features.ehd .flex div:nth-child(4) {
    order: 3;
  }
  #features.ehd .flex div:nth-child(5) {
    order: 4;
  }
  #features.ehd .flex div:nth-child(6) {
    order: 5;
  }
  #features.ehd .flex div:nth-child(7) {
    order: 7;
  }
  #features.ehd .flex div:nth-child(8) {
    order: 6;
  }
  #features.ehd .flex div:nth-child(9) {
    order: 8;
  }
  #features.vader .flex div:nth-child(1) {
    order: 0;
  }
  #features.vader .flex div:nth-child(2) {
    order: 1;
  }
  #features.vader .flex div:nth-child(3) {
    order: 2;
  }
  #features.vader .flex div:nth-child(4) {
    order: 3;
  }
  #features.vader .flex div:nth-child(5) {
    order: 4;
  }
  #features.vader .flex div:nth-child(6) {
    order: 6;
  }
  #features.vader .flex div:nth-child(7) {
    order: 5;
  }
  #features.vader .flex div:nth-child(8) {
    order: 7;
  }
}
/*--------------------------------------------------------------
	SPECIFICATIONS
--------------------------------------------------------------*/
#specs-table {
  padding: 48px;
}

#specs-table table {
  width: 100%;
  text-align: center;
}

#specs-table p {
  font-size: 16px;
  line-height: 22px;
  padding: 7px 0;
  font-weight: bold;
  color: rgb(14, 104, 58);
  text-align: center;
}

#specs-table > div {
  overflow-x: auto;
  margin-bottom: 48px;
}

#specs-table > div:last-of-type {
  margin: 0;
}

#specs-table thead tr {
  background: rgb(14, 104, 58);
  color: white;
}

#specs-table tbody tr:nth-child(even) {
  background: rgb(220, 220, 220);
}

#specs-table tbody tr:nth-child(odd) {
  background: rgb(240, 240, 240);
}

#specs-table th,
#specs-table td {
  font-size: 16px;
  line-height: 22px;
  padding: 7px 16px 7px 0;
  white-space: nowrap;
}

#specs-table th {
  font-weight: normal;
}

#specs-table table th:first-child,
#specs-table table td:first-child {
  text-align: left;
  width: 1px;
  padding-left: 16px;
}

#specs-table tbody td:first-child {
  font-weight: bold;
  color: rgb(14, 104, 58);
}

#dimensions {
  padding: 0 48px 48px 48px;
}

.brochure {
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
  flex-wrap: wrap;
  text-align: center;
  padding: 48px 48px 0 48px;
}

.brochure div {
  width: 50%;
  padding: 0 16px;
}

.brochure p {
  padding-bottom: 24px;
}

/*--------------------------------------------------------------
	SPECIFICATIONS RESPONSIVE
--------------------------------------------------------------*/
@media (max-width: 999px) { /* smaller than tablet size 1000px */
  #specs-table {
    padding: 32px;
  }
  #specs-table th,
  #specs-table td,
  #specs-table p {
    font-size: 15px;
  }
  #specs-table > div {
    margin-bottom: 32px;
  }
  #dimensions {
    padding: 0 32px 32px 32px;
  }
  .brochure {
    padding: 32px 32px 0 32px;
  }
}
@media (max-width: 799px) { /* smaller than phone size 800px */
  #specs-table {
    padding: 32px 0;
  }
  #specs-table th,
  #specs-table td,
  #specs-table p {
    font-size: 14px;
  }
  .brochure {
    justify-content: center;
  }
  .brochure div {
    width: 100%;
    max-width: 400px;
  }
  .brochure > div:nth-child(2) {
    padding-top: 32px;
  }
}
/*--------------------------------------------------------------
	PHOTOS
--------------------------------------------------------------*/
#photos {
  position: relative;
  overflow: hidden;
  padding-top: 48px;
}

/*--------------------------------------------------------------
	RESPONSIVE
--------------------------------------------------------------*/
@media (max-width: 999px) { /* smaller than tablet size 1000px */
  #photos {
    padding-top: 32px;
  }
}
/*--------------------------------------------------------------
	SOFTWARE
--------------------------------------------------------------*/
.software {
  padding: 64px 0;
  text-align: center;
}

.software p {
  text-align: left;
}

.software .flex {
  align-items: flex-end;
}

.software .flex > div:nth-child(1) {
  width: 80%;
}

.software .flex > div:nth-child(2) img {
  padding-left: 32px;
  height: 200px;
}

/*--------------------------------------------------------------
	SOFTWARE RESPONSIVE
--------------------------------------------------------------*/
@media (max-width: 999px) { /* smaller than tablet size 1000px */
  .software {
    padding: 44px 0 48px 0;
  }
  .software .flex > div:nth-child(2) img {
    height: 190px;
  }
}
@media (max-width: 799px) { /* smaller than phone size 800px */
  .software {
    padding: 28px 0 32px 0;
  }
  .software .flex {
    flex-wrap: wrap;
  }
  .software .flex > div:nth-child(1),
  .software .flex > div:nth-child(2) {
    width: 100%;
  }
  .software .flex > div:nth-child(2) img {
    padding: 32px 0 0 0;
  }
}
@media (max-width: 459px) { /* smaller than phone size 460px */
  .software {
    padding: 22px 0 24px 0;
  }
}
/*--------------------------------------------------------------
	DOCUMENTS
--------------------------------------------------------------*/
/*---------------------------
	SEARCH
---------------------------*/
#search-bar .wrapper {
  align-items: flex-end;
  padding-bottom: 16px;
}

#search {
  position: relative;
  width: 100%;
  max-width: 380px;
}

#search input[type=search]:focus {
  outline: none;
}

#search input[type=search]::placeholder {
  color: rgb(100, 100, 100);
}

#search input[type=search]::-webkit-search-decoration,
#search input[type=search]::-webkit-search-cancel-button,
#search input[type=search]::-webkit-search-results-button,
#search input[type=search]::-webkit-search-results-decoration {
  display: none;
}

#search input[type=search] {
  font-family: "Open Sans", sans-serif;
  font-size: 16px;
  font-weight: bold;
  color: rgb(30, 30, 30);
  line-height: 36px;
  padding: 2px 16px 0 40px;
  border: 1px solid rgb(200, 200, 200);
  width: 100%;
}

/*---------------------------
	FILTERS
---------------------------*/
#filters > div:nth-child(1) {
  display: none;
}

#filters > div {
  position: relative;
  display: inline-block;
  padding-left: 32px;
  user-select: none;
}

#filters h2,
#search h2 {
  font-size: 18px;
}

.filter {
  position: relative;
  background: white;
  padding: 0 56px 0 16px;
  border: 1px solid rgb(200, 200, 200);
  width: 320px;
  cursor: default;
}

.filter:after {
  font-family: "icons";
  content: "\e900";
  color: rgb(50, 50, 50);
  font-size: 15px;
  line-height: 36px;
  position: absolute;
  top: 0;
  right: 0;
  padding: 2px 12px 0 13px;
  border-left: 1px solid rgb(200, 200, 200);
}

.filter.active + ul {
  display: block !important;
}

.filter span {
  display: block;
  font-weight: bold;
  font-size: 16px;
  line-height: 38px;
  white-space: nowrap;
  overflow: hidden;
  pointer-events: none;
}

#filters ul {
  position: absolute;
  display: none;
  font-weight: bold;
  background: white;
  max-height: 280px;
  width: 320px;
  border: 1px solid rgb(200, 200, 200);
  border-top: none;
  box-shadow: 0 2px 10px 0 rgba(0, 0, 0, 0.15);
  overflow-y: scroll;
  z-index: 10;
}

#filters li {
  font-size: 16px;
  line-height: 20px;
  padding: 4px 16px;
  cursor: default;
}

.no-touch #filters li:hover {
  background: rgb(250, 210, 50);
}

/*---------------------------
	DOCS TABLE
---------------------------*/
#docs-table {
  padding-bottom: 64px;
}

#docs-table > div:nth-of-type(2) {
  padding: 0 32px;
  overflow-x: auto;
}

#docs-table table {
  table-layout: fixed;
  width: 100%;
  max-width: 1216px;
  text-align: center;
  margin: 0 auto;
}

#docs-table thead tr {
  color: white;
  background: rgb(14, 104, 58);
}

#docs-table tr:nth-child(even) {
  background: rgb(220, 220, 220);
}

#docs-table th,
#docs-table td {
  font-size: 18px;
  font-weight: bold;
  padding-right: 16px;
  line-height: 48px;
  white-space: nowrap;
}

#docs-table th {
  font-weight: normal;
}

#docs-table table th:first-child,
#docs-table table td:first-child {
  text-align: left;
  padding-left: 16px;
  overflow: hidden;
}

#docs-table a {
  color: rgb(14, 104, 58);
  text-decoration: underline;
}

#docs-table th:nth-child(4),
#docs-table td:nth-child(4),
#docs-table th:nth-child(5),
#docs-table td:nth-child(5) {
  display: none;
}

#docs-table th:nth-child(2),
#docs-table td:nth-child(2) {
  width: 144px;
}

#docs-table th:nth-child(3),
#docs-table td:nth-child(3) {
  text-align: right;
  width: 108px;
}

/*---------------------------
	RESULTS
---------------------------*/
#results {
  display: none;
  justify-content: flex-start;
  flex-wrap: wrap;
}

#results a {
  display: flex;
  padding: 16px;
}

#results img {
  max-width: 200px;
  margin-right: 16px;
  border: 1px solid rgb(220, 220, 220);
}

#results h3 {
  font-size: 18px;
  line-height: 22px;
  padding-bottom: 10px;
  font-weight: bold;
  color: rgb(14, 104, 58);
  transition: all 200ms ease;
}

#results a div {
  flex-direction: column;
  width: 100%;
}

#results a div ul:nth-child(1) {
  flex-grow: 1;
}

#results li {
  font-size: 12px;
  font-weight: bold;
  padding: 2px 0;
}

#results .btn {
  display: inline-block;
  padding: 12px 0;
  margin-top: 16px;
}

#results > div {
  background: white;
  border-radius: 2px;
  margin: 0 24px 24px 0;
  width: 580px;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
  transition: all 200ms cubic-bezier(0.25, 0.8, 0.25, 1);
}

.no-touch #results > div:hover {
  box-shadow: 0 14px 28px rgba(0, 0, 0, 0.25), 0 10px 10px rgba(0, 0, 0, 0.22);
}

.no-touch #results > div:hover .btn {
  color: rgb(30, 30, 30);
  background: rgb(250, 210, 50);
  transition: all 200ms ease;
}

/*--------------------------------------------------------------
	DOCUMENTS RESPONSIVE
--------------------------------------------------------------*/
@media (max-width: 999px) { /* smaller than tablet size 1000px */
  #filters > div {
    padding-left: 16px;
  }
  .filter,
  #filters ul {
    width: 320px;
  }
  #docs-table {
    padding-bottom: 48px;
  }
  #docs-table th,
  #docs-table td {
    font-size: 16px;
    line-height: 40px;
  }
  #docs-table th:nth-child(2),
  #docs-table td:nth-child(2) {
    width: 132px;
  }
  #docs-table th:nth-child(3),
  #docs-table td:nth-child(3) {
    width: 92px;
  }
}
@media (max-width: 799px) { /* smaller than phone size 800px */
  #search-bar .wrapper {
    flex-direction: column-reverse;
    align-items: center;
  }
  #search {
    width: 480px;
    max-width: none;
  }
  .filter,
  #filters ul {
    width: 480px;
  }
  #filters > div {
    padding-left: 0;
  }
  #filters {
    padding-bottom: 16px;
  }
  #docs-table {
    padding-bottom: 32px;
  }
  #docs-table > div:nth-of-type(2) {
    padding: 0;
  }
  #docs-table table {
    table-layout: auto;
  }
}
@media (max-width: 519px) { /* smaller than phone size 520px */
  #filters {
    flex-direction: column;
    align-items: center;
    width: 100%;
  }
  #filters > div {
    width: 100%;
    padding: 0;
  }
  #filters > div:first-child {
    padding-bottom: 16px;
  }
  .filter,
  #filters ul,
  #search {
    width: 100%;
  }
}
@media (max-width: 459px) { /* smaller than phone size 460px */
  #docs-table {
    padding-bottom: 24px;
  }
  #docs-table th,
  #docs-table td {
    font-size: 14px;
    line-height: 40px;
  }
}
/*--------------------------------------------------------------
	ERROR PAGES
--------------------------------------------------------------*/
.error-page.title {
  padding: 59px 0 64px 0;
}

.error-page h1 {
  font-size: 180px;
  line-height: 180px;
  color: rgb(14, 104, 58);
  padding: 0;
  text-shadow: 4px 4px rgb(30, 30, 30);
}

.error-page h1:after {
  display: none;
}

.error-page h2 {
  font-size: 64px;
  line-height: 64px;
  padding-bottom: 48px;
}

.error-page p {
  font-size: 24px;
  line-height: 32px;
}

.error-page p:nth-of-type(2) {
  display: none;
}

/*--------------------------------------------------------------
	ERROR PAGES RESPONSIVE
--------------------------------------------------------------*/
@media (max-width: 799px) { /* smaller than phone size 800px */
  .error-page.title {
    padding: 44px 0 48px 0;
  }
  .error-page p {
    text-align: center;
    font-size: 22px;
    line-height: 30px;
  }
  .error-page p:nth-of-type(1) {
    display: none;
  }
  .error-page p:nth-of-type(2) {
    display: inline-block;
  }
}
@media (max-width: 639px) { /* smaller than phone size 640px */
  .error-page.title {
    padding: 28px 0 32px 0;
  }
  .error-page h1 {
    font-size: 140px;
    line-height: 140px;
  }
  .error-page h2 {
    font-size: 48px;
    line-height: 48px;
    padding-bottom: 32px;
  }
  .error-page p {
    text-align: center;
    font-size: 20px;
    line-height: 28px;
  }
  .error-page .btn {
    margin-top: 32px;
  }
}
@media (max-width: 459px) { /* smaller than phone size 460px */
  .error-page h1 {
    font-size: 120px;
    line-height: 120px;
  }
  .error-page h2 {
    font-size: 32px;
    line-height: 32px;
    padding-bottom: 24px;
  }
  .error-page p {
    text-align: center;
    font-size: 16px;
    line-height: 22px;
  }
}

/*# sourceMappingURL=style.css.map */