:root {
  --color-main: #637cad;

  --color-blue: #637cad;
}
@font-face {
  font-family: 'CoreRhino45Regular';
  src: url('/css/CoreRhino45Regular.otf');  
  font-style: normal;
}

html {
  height:100%;  
}

body {
  font-family: 'MyriadPro-Regular';
  color:#333333;
  background:  url('/images/bg_spacer/muster.png'), #f4f3ef;
}

main {
  text-align: left;
}

.noDisplay {
  display: none!important;
}

footer {
  margin-top: 35px;
}
footer #addrmenu{
  margin-top: 20px;
  padding: 10px;
  background: white;
  display: flex;
  justify-content : space-between;
}
footer #addr {
  display: grid;
  grid-template-columns: 1fr;
  column-gap: 20px;
  row-gap: 10px;
}
footer #addr span {
  white-space: nowrap;
  text-align: left;
}
footer #social {
  display: flex;
  gap: 10px;
}
footer #footermenu {
  text-align: right;
}

h1 {
/*  color:#A2A3A5;*/
  color: var(--color-main);
  font-family: 'CoreRhino45Regular';
  font-size:28px;
  text-transform:uppercase; 
  font-weight: normal;
/*  padding-top: 10px; */
  margin-top: 0;
/*  border-top: solid 3px white; */
}

h2 {
  color: var(--color-main);
/*  color:#A2A3A5;*/
  font-weight: 700;
  font-size:18px;
  text-transform:uppercase; 
}

h3 {
  color: var(--color-main);
  font-size:16px;
  margin-bottom:0px;
}


hr {
  background:#c8cacb;
  color:#c8cacb;
  height:1px;
  border:none;
}

a {
  color: var(--color-main);
  text-decoration:none;
}

div.pagewrapper {
  --min-middle-width: 300px;
  --max-middle-width: 1400px;
  display: grid;
  grid-template-columns: minmax(20px , 1fr) minmax(var(--min-middle-width), var(--max-middle-width)) minmax(20px , 1fr);
  width: 100%;
}
div.page {
  text-align: center;
}
.swiper-button-next, .swiper-button-prev {
  min-width: 44px;
  min-height: 44px;
  font-family: swiper-icons!important;
}
.work-content
{
  margin-top: 25px;
}

.grid3 {
  display: grid;
  grid-template-columns: 1fr;
  gap: 20px;
}
.gridelement1 img , .gridelement2 img , .gridelement3 img , .gridelement12 img , .gridelement23 img , .gridelement13 img {
  width: 100%;
}
.workgrid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 1px;
}
.workgrid > div {
  position: relative;
  width: 100%;
  height: 100%;
}
.workgrid > div img {
  height:100%;
  width:100%;
  object-fit: cover;
}
.workgrid .worktitle {
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  display: flex;
}
.worktitle > div {
  display: none;
}
.workgrid > div:hover .worktitle > div {
  margin: auto;
  text-align: center;
  background: white;
  opacity: 0.8;
  padding: 25px;
  display: block;
}
main img {
  max-width: 100%;
}