/* Webfonts */

/* font-family: 'Roboto', Helvetica, Arial, sans-serif; */
@font-face {
  font-family: 'Roboto';
  src: url('../fonts/Roboto-Light.ttf') format('truetype');
  font-weight: 300;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Roboto';
  src: url('../fonts/Roboto-Regular.ttf') format('truetype');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

html, body {
  width: 100%;
  height: 100%;
}
html {
  font-size: 62.5%;
}
body {
  min-height: 100%;
  font-family: "Roboto",Helvetica,Arial,sans-serif;
  font-size: 14px;
  font-size: 1.4rem;
  font-weight: 300;
  line-height: 1.5em;
  font-style: normal;
  letter-spacing: normal;
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
  -webkit-font-smoothing: subpixel-antialiased;
  -moz-osx-font-smoothing: grayscale;
  -webkit-text-size-adjust: 100%;
  -ms-text-size-adjust: 100%;
  font-smooth: always;
  color: #000;
  background: rgb(140,140,140);
}

body * {
  box-sizing: border-box;
}

h1, h2, h3, h4, h5, h6 {
  font-weight: 400;
  line-height: 1.2em;
  margin-top: 0.5em;
}

h1 {
  color: #fff;
}

h1.site-name {
  font-size: 32px;
  font-size: 3.2rem;
  color: #fff;
  margin-top: 0;
}

a {
  text-decoration: none;
  transition: all 400ms ease-in-out;
}

a:link, a:visited {
  color: #000;
}

a:hover, a:active, a:focus {
  color: #fff;
}

hr {
  max-width: 300px;
  margin: 1em 0;
}

#page {
  padding: 20px 25px;
  padding: 2rem 2.5rem;
}

#page .content {
  margin-bottom: 2em;
}

#page .link-catalogue {
  display: inline-block;
  margin-bottom: 1em;
}

a.link-arrow-up {
  position: absolute;
  top: 20px;
  left: 25px;
  left: 2.5rem;
}

#border_cmyk {
  position: fixed;
  width: 8px;
  height: 100%;
  height: 100vh;
}

.border_cmyk {
  position: absolute;
  top: 0;
  bottom: 0;
  display: block;
  height: 100%;
  height: 100vh;
  width: 3px;
}

.border_c {
  left: 0;
  background: #00cccc;
}

.border_m {
  left: 3px;
  background: #cf00cf;
}

.border_y {
  left: 6px;
  background: #c9c900;
}

.border_k {
  left: 9px;
  background: #000;
}

#footer {
  position: fixed;
  right: 0;
  bottom: 0;
  left: 12px;
  text-align: right;
  color: #fff;
  padding: 0.4em 0.8em;
}

#footer a {
  font-size: 12px;
  font-size: 1.2rem;
  color: #fff;
}

#footer a:hover, #footer a:active, #footer a:focus {
  text-decoration: underline;
}

.fancybox-is-open .fancybox-bg {
  opacity: 1;
}

.fancybox-bg {
  background: #666666;
}

.fancybox-button {
  background: rgba(80,80,80,.6);
}

.slideshow a,
a.link-catalogue {
  position: relative;
  padding-left: 24px;
  padding-left: 2.4rem;
  text-decoration: none;
}

.link-catalogue {
  margin-top: 0.4em;
}

.icon {
  position: absolute;
  left: 0;
}

.gallery-img-hidden {
  display: none;
}



@media (min-width: 64em) {
  #page {
    padding: 20px 2%;
    padding: 2rem 2%;
  }
  a.link-arrow-up {
    left: 2%;
  }

}