/* Clearing where needed
----------------------------------------------------------- */
/* For modern browsers */
.clear:before, .clear:after,
.FormItem:before, .Content:after,
.Content:before, .FormItem:after,
.BlockForm .Checks label:before,
.BlockForm .Checks label:after,
.ShippingMethodWrapper:before,
.ShippingMethodWrapper:after,
.DefineShippingMethod:before,
.DefineShippingMethod:after,
.PaymentMethodWrapper:before,
.PaymentMethodWrapper:after,
.DefinePaymentMethod:before,
.DefinePaymentMethod:after,
.Pagination:before,
.Pagination:after {
  content: "";
  display: table; }

.clear:after,
.FormItem:after,
.Content:after,
.BlockForm .Checks label:after,
.ShippingMethodWrapper:after,
.DefineShippingMethod:after,
.PaymentMethodWrapper:after,
.DefinePaymentMethod:after,
.Pagination:after {
  clear: both; }

/* For IE 6/7 (trigger hasLayout) */
.clear,
.FormItem,
.Content,
.BlockForm .Checks label,
.ShippingMethodWrapper,
.ShippingMethodWrapper,
.DefineShippingMethod,
.PaymentMethodWrapper,
.DefinePaymentMethod,
.Pagination:after {
  zoom: 1; }

*,
*:after,
*:before {
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  -webkit-font-smoothing: antialiased;
  font-smoothing: antialiased;
  text-rendering: optimizeLegibility; }

nav, #open-menu, .hamburger {
  display: none; }

.material-icons {
  font-family: 'Material Icons';
  font-weight: normal;
  font-style: normal;
  font-size: 24px;
  /* Preferred icon size */
  display: inline-block;
  line-height: 1;
  text-transform: none;
  letter-spacing: normal;
  word-wrap: normal;
  white-space: nowrap;
  direction: ltr;
  /* Support for all WebKit browsers. */
  -webkit-font-smoothing: antialiased;
  /* Support for Safari and Chrome. */
  text-rendering: optimizeLegibility;
  /* Support for Firefox. */
  -moz-osx-font-smoothing: grayscale;
  /* Support for IE. */
  font-feature-settings: 'liga'; }

/* Basic Typography
----------------------------------------------------------- */
body {
  /* The base of all typographic rules */
  font-family: "Montserrat",sans-serif;
  background-color: #EFEFEF;
  font-weight: 400;
  font-size: 14px;
  line-height: 18px;
  color: #343434; }

/* Basic margins on block elements */
ul, ol, dl, h1, h2, h3, h4, h5, h6, table, pre, p, blockquote, blockcode, address {
  margin: 0; }

/* Headers */
h1, h2, h3, h4, h5, h6 {
  color: #1E1E1C;
  font-weight: 700; }

h1 {
  font-size: 32px;
  margin-bottom: 5px;
  line-height: 36px;
  font-weight: 600;
  letter-spacing: -0.03em; }

h2 {
  font-size: 15px; }

h3 {
  font-size: 15px; }

h4 {
  font-size: 15px; }

.small {
  font-size: 24px;
  line-height: 30px; }

a:focus {
  outline: none; }

.AllCaps {
  text-transform: uppercase; }

.small-print {
  display: block;
  text-transform: uppercase;
  font-size: 11px;
  color: #1E1E1C; }

.title-heading {
  display: block;
  font-weight: 700; }

.announcement {
  text-align: center;
  display: block;
  margin: 50px 0; }

strong a {
  text-decoration: none; }

.two-columns {
  -webkit-columns: 2;
  -moz-columns: 2;
  columns: 2;
  -webkit-column-gap: 40px;
  -moz-column-gap: 40px;
  column-gap: 40px; }

.horizontal-line {
  width: calc(100% - 20px);
  height: 1px;
  background-color: #BEC0C2;
  margin: 40px 10px 50px 10px;
  max-width: 1260px; }

.full-line {
  width: 100% !important;
  margin: 40px 0 50px 0; }

.text-line {
  margin-bottom: 0; }

.black {
  color: #1E1E1C  !important; }

/* Headers in a pretty box */
.BoxHeader {
  position: relative;
  width: auto;
  clear: both;
  margin: -1px 0 0;
  padding: 8px 15px 9px;
  cursor: default; }

.BoxHeader label {
  float: left !important;
  width: auto !important;
  top: 0px !important;
  font-weight: 700; }

.BoxHeader label + a {
  font-size: 11px;
  float: right; }

/* Text elements */
dt {
  color: #444;
  font-weight: 700; }

dd {
  color: #222;
  margin-left: 27px; }

/* Some definition lists inline */
.Product .Prices dt,
table dt {
  display: inline;
  margin: 0 3px 0 0; }

.Product .Prices dd,
table dd {
  display: inline;
  margin: 0 9px 0 0; }

a {
  color: #1E1E1C; }

a:hover {
  text-decoration: underline; }

blockquote, q {
  font-style: italic; }

blockquote {
  margin: 0 54px;
  font-size: 15px; }

cite {
  font-weight: bold;
  font-style: normal; }

strong {
  font-weight: 600; }

em {
  font-style: italic; }

dfn {
  font-weight: bold; }

small {
  font-size: 85%; }

abbr {
  border-bottom: 1px dotted #666; }

address {
  font-style: italic; }

/* Lists */
ul ul,
ol ol,
ol ul,
ul ol {
  margin-bottom: 0; }

ul ul,
ol ul {
  list-style-type: circle; }

ul ul ul {
  list-style-type: square;
  margin-left: 14px; }

ol {
  list-style-type: decimal; }

/* Images  */
img {
  display: block;
  max-width: 100%; }

/* Some default classes
-------------------------------------------------------------- */
.Big {
  font-size: 125%; }

.Center {
  text-align: center; }

/* Prices */
.Prices dd.Price {
  font-weight: bold; }

.Prices dd.ListPrice,
.ProductComparePrice {
  text-decoration: line-through;
  color: #888; }

.CartDiscount {
  color: red;
  font-weight: 500; }

/* Part payment's prefix */
.PriceFrom {
  font-weight: normal; }

/* Some padding around currency symbol */
.Currency {
  padding: 0 2px; }

/* Vertical Separators */
.Separator {
  *margin: 0 5px; }

.Separator + .Separator:before {
  content: '|';
  margin: 0 5px; }

/* Notifications
-------------------------------------------------------------- */
#NotificationCenter {
  position: fixed;
  z-index: 99999;
  bottom: 20px;
  right: 20px;
  padding: 0;
  width: 400px;
  display: none; }

#NotificationCenter a {
  color: #fff; }

#NotificationCenter .Separator {
  display: none; }

.Notification {
  position: relative;
  padding: 8px;
  font-size: 12px;
  margin: 0 0 9px;
  text-align: center; }

.Notification p {
  margin: 0 !important;
  color: red !important;
  max-width: none; }

.Notification p a {
  font-weight: bold; }

.Notification p + p {
  margin-top: 18px; }

.Success {
  background-color: #009BCF;
  color: #fff; }

.Error {
  border: 1px solid red; }

.Notification span.Close {
  cursor: pointer;
  display: block;
  position: absolute;
  top: 8px;
  right: 8px;
  width: 16px;
  height: 16px;
  background: url(../i/close.png) no-repeat 50% 50%; }

#Primary > .Notification {
  border-left: 0;
  border-right: 0;
  margin-bottom: 0;
  margin-top: -1px;
  font-size: 15px;
  padding-top: 17px;
  padding-bottom: 18px; }

#PageHeader + .Notification {
  margin-top: 17px; }

/* Banners
-------------------------------------------------------------- */
.slick-arrow {
  position: absolute;
  max-width: 1280px;
  margin: 0 auto;
  cursor: pointer;
  top: 0;
  right: 0; }

.slick-prev, .slick-next {
  background-size: 26px 26px;
  background-repeat: no-repeat;
  background-position: 6px 6px;
  opacity: 0.7;
  -webkit-transition: all 200ms ease-out;
  -moz-transition: all 200ms ease-out;
  -o-transition: all 200ms ease-out;
  -ms-transition: all 200ms ease-out;
  transition: all 200ms ease-out;
  width: 40px;
  height: 40px;
  z-index: 9;
  border: 1px solid #fff; }

#ProductThumbnails .slick-prev, #ProductThumbnails .slick-next {
  border: 1px solid #000; }

.slick-prev {
  right: 90px;
  top: 40px;
  background-image: url(/files/Teollisuuspalvelu/i/arrow_left.png);
  position: absolute; }

.slick-next {
  right: 40px;
  top: 40px;
  background-image: url(/files/Teollisuuspalvelu/i/arrow_right.png);
  position: absolute; }

#ProductThumbnails .slick-prev {
  right: 65px;
  top: 7px;
  background-image: url(/files/Teollisuuspalvelu/i/arrow_left_b.png);
  position: absolute;
  opacity: 0.6; }

#ProductThumbnails .slick-next {
  right: 15px;
  top: 7px;
  background-image: url(/files/Teollisuuspalvelu/i/arrow_right_b.png);
  position: absolute;
  opacity: 0.6; }

#ProductThumbnails .slick-next:hover, #ProductThumbnails .slick-prev:hover {
  opacity: 1; }

/* Tables
-------------------------------------------------------------- */
table {
  position: relative;
  clear: both;
  margin: 0 0 18px;
  width: 100%;
  text-align: left;
  vertical-align: top;
  border: 0;
  font-size: 16px; }

caption {
  caption-side: top;
  text-align: center;
  font-size: 12px;
  padding: 0;
  font-weight: normal;
  border: 0;
  font-style: italic;
  color: #888; }

th, td {
  border-bottom: 1px solid #D9D9D9;
  padding: 8px 9px 9px 0;
  vertical-align: top;
  text-align: left; }

th {
  color: #444;
  font-weight: bold;
  font-size: 16px; }

thead th, thead td {
  padding: 12px 9px 4px;
  border-bottom: 2px solid #444; }

tfoot th {
  font-weight: 300; }

/* Fonts
-------------------------------------------------------------- */