/*--- standard variables ---*/
/*--- switch themes ---*/
/* #####################################################################################################
   This stylesheet is used for theme specific variables

   1 Munnichs

   ##################################################################################################### */
/*--- product item ratio (thumb + content) ---*/
/* set ProductImageRatio in productOverview! */
/*--- media queries. When using responsive ---*/
/* Range breakpoints */
/*--- media queries. When using responsive: only mobile & desktop ---
@responsive:	false;
@largePhone:	~"only screen and (min-width: 480px)";
@tablet:		~"only screen and (min-width: 999999999px)";
@tabletLand:	~"only screen and (min-width: 768px)";
@desktop:		~"only screen and (min-width: 768px)";

@upToTablet:	~"only screen and (max-width: 767px)";
@upToDesktop:	~"only screen and (max-width: 767px)";*/
/*--- media queries. When not using responsive ---
@responsive:	false;
@largePhone:	~"only screen and (min-width: 1px)";
@tablet:		~"only screen and (min-width: 1px)";
@tabletLand:	~"only screen and (min-width: 1px)";
@desktop:		~"only screen and (min-width: 1px)";

@upToTablet:	~"only screen and (max-width: 1px)";
@upToDesktop:	~"only screen and (max-width: 1px)";*/
/*----- Default functions -----*/
/*----- Default Crossbrowser functions -----*/
/*----- CSS3 functions -----*/
/*----- CSS3 Animation functions -----*/
/*----- Buttons -----*/
/*----- Responsive functions -----*/
html,
button,
input,
select,
textarea {
  font-family: 'IBM Plex Sans', sans-serif;
}
html,
body {
  font-family: 'IBM Plex Sans', sans-serif;
  font-size: 16px;
  line-height: 30px;
  color: black;
  -webkit-font-smoothing: antialiased;
}
a {
  color: #c61c40;
  text-decoration: none;
}
a:hover {
  color: #e8607d;
  text-decoration: none;
}
h1,
.kop1,
h2,
.kop2,
h3,
.kop3,
h4,
.kop4 {
  font-family: 'IBM Plex Sans', sans-serif;
  margin: 0 0 10px;
}
h1 a,
.kop1 a,
h2 a,
.kop2 a,
h3 a,
.kop3 a,
h4 a,
.kop4 a {
  color: black;
}
h1,
.kop1 {
  font-size: 24px;
  line-height: 30px;
  font-weight: 600;
  margin: 0 0 15px;
  font-family: 'IBM Plex Serif', serif;
  color: black;
  letter-spacing: -1px;
}
@media only screen and (min-width: 1024px) {
  h1,
  .kop1 {
    font-size: 44px;
    line-height: 52px;
  }
}
h2,
.kop2 {
  font-size: 20px;
  line-height: 25px;
  font-weight: 700;
}
h2.highlight,
.kop2.highlight {
  font-size: 24px;
  line-height: 30px;
  font-family: 'IBM Plex Serif', serif;
  font-weight: 500;
}
@media only screen and (min-width: 1024px) {
  h2.highlight,
  .kop2.highlight {
    font-size: 48px;
    line-height: 56px;
  }
}
h3,
.kop3 {
  font-size: 18px;
  line-height: 22px;
  font-weight: 600;
  font-family: 'IBM Plex Serif', serif;
}
h3.kiyohTitle,
.kop3.kiyohTitle {
  font-size: 24px;
  line-height: 30px;
  font-family: 'IBM Plex Serif', serif;
  font-style: italic;
  font-weight: 600;
  text-transform: none;
  color: black;
}
h4,
.kop4 {
  font-size: 14px;
  line-height: 18px;
  font-weight: 500;
  font-family: 'IBM Plex Sans', sans-serif;
}
@media only screen and (min-width: 1024px) {
  h4,
  .kop4 {
    font-size: 24px;
    line-height: 28px;
  }
}
h4.highlight,
.kop4.highlight {
  color: #bc9f75;
  margin-bottom: 0;
  font-weight: 400;
}
.nowContent a {
  text-decoration: underline;
}
.nowContent h1 a,
.nowContent h2 a,
.nowContent h3 a,
.nowContent h4 a,
.nowContent h5 a,
.nowContent h6 a,
.nowContent h1 button,
.nowContent h2 button,
.nowContent h3 button,
.nowContent h4 button,
.nowContent h5 button,
.nowContent h6 button,
.nowContent h1 .bttn,
.nowContent h2 .bttn,
.nowContent h3 .bttn,
.nowContent h4 .bttn,
.nowContent h5 .bttn,
.nowContent h6 .bttn {
  text-decoration: none;
}
/*@media @tabletLand {
    h1, .kop1,
    h2, .kop2,
    h3, .kop3,
    h4, .kop4 {
        .textOverflowEllipsis();
    }
}*/