@font-face {
	font-family: 'Font Awesome';
	url('../fonts/fontawesome-webfont.woff2') format('woff2'),
	url('../fonts/fontawesome-webfont.woff') format('woff'),
	}
	
@font-face {
font-family: 'Lato';
font-style: light;
font-weight: 300;
src: url(../fonts/lato-v23-latin-300.ttf) format("truetype");
}

@font-face {
font-family: 'Lato';
font-style: normal;
font-weight: 400;
src: url(../fonts/lato-v23-latin-regular.ttf) format("truetype");
}

/* Reset
-------------------------------------------------- */
*, *:before, *:after {
  margin: 0;
  padding: 0;
  border: 0;
  -webkit-box-sizing: border-box;
     -moz-box-sizing: border-box;
          box-sizing: border-box;
}
article, aside, details, figcaption, figure,
footer, header, hgroup, main, nav, section, summary {
  display: block;
}


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


/* Links
-------------------------------------------------- */
a {
  color: #000;
  text-decoration: none;
  transition: color .3s, background .3s, border .3s;
}
a:hover {
  color: black;
}


/* Clearfix
-------------------------------------------------- */
.cf:after {
  content: "";
  display: table;
  clear: both;
}


/* Site
-------------------------------------------------- */
html {
  height: 101%;
  font-family: 'Lato', sans-serif;
  -webkit-text-size-adjust: 100%;
  -ms-text-size-adjust: 100%;
}
body {
  margin: 0 auto;
  font-size: 1em;
  font-weight: 400;
  line-height: 1.4em;
  letter-spacing: 0.04em;
  word-spacing: 0.04em;
  max-width: 1400px;
  padding: 1.3em 3em;
  background-color: #ffffff;
  color: #000000;
}

@media screen and (min-width: 1200px) {
	body {
	width: 85%;
	}
	}


@media screen and (max-width: 450px) {
  body {
    padding: 1.3em;
  }
  }

@media screen and (min-width: 450px) and (max-width: 800px) {
  body {
    padding: 1.3em;
  }
}

.main p {
 margin-bottom: 0.3em;
}

main {
  height: 100%;	
  min-height: 75vh;
	}




/* Header-Logo
-------------------------------------------------- */
.header {
  margin-bottom: 4em;
  margin-top: 1.5em;
}

.logo {
  display: block;
 float: left;
}

.logo1 {
  display: block;
  float: left;
  width: 78px;
}

.logo2 {
  display: block;
  float: left;
  font-size: 2.7em;
  font-family: 'Lato', sans-serif;
  line-height: 0.93em;
  font-weight: 300;
  letter-spacing: 0.05em;
  margin-left: 0.35em;
}

/* Header-Navigation
-------------------------------------------------- */

.menu {
	display: flex;
    float: right;
    margin-right: 0em;
	align-items: flex-end;
  }

.menu a, .footmenu a {
  display: block;	
  letter-spacing: 0.05em;
  color: #000000;
  font-size: 1em;
  text-transform: uppercase;
  }

a:hover{
  color: rgba(40, 40, 40, 0.70);
}

.menu .active, .footmenu .active {
   border-bottom: 1px solid;
}

.menu li {
  padding: 3.4em 0em 0em 1.8em;
  list-style: none;
  float: left;
  position: relative;
}

.menu li:last-child {
	margin-left: 1rem !important;
	}
	
.menu li:first-child {
	padding-left: 0em !important;
	}

.footmenu li {
  padding: 1em 2em 0em 0em;
  list-style: none;
  float: left;
  position: relative;
}

li.shoplogo {
	width: 78px;
	margin-left: 1rem;
	padding: 0rem 0em .2rem;
	-webkit-animation: none 1s ease-out;
    -webkit-animation-iteration-count: infinite; 
    opacity: 1
}

@-webkit-keyframes pulsate {
    0% {-webkit-transform: scale(0.7, 0.7); opacity: 0.0;}
    50% {opacity: .7;}
    100% {-webkit-transform: scale(1.0, 1.0); opacity: 1.0;}
}

@media screen and (min-width: 800px) and (max-width: 1200px) {	


 	.header {
	margin-bottom: 2em;
	margin-top: 0em;
	}
	.logo1 {
	width: 55px;
	}
	
 	.logo2 {
	font-size: 1.9em;
	line-height: 0.9em;
 	}

	.menu a {
	font-size: 0.85em;
	letter-spacing: 0.03em;
 	}

 	.menu li {
	padding: 1.3em 0em 0em 1em;
  	}  

	li.shoplogo {
	width: 55px;
	padding: 0em 0em 0em 0em;
	margin-bottom: .4rem;
	}
  

}



@media screen and (max-width: 799px) {
 	.header {
	margin-bottom: 2em;
	margin-top: 0em;
	}
	.logo1 {
	width: 50px;
	}
	
 	.logo2 {
	font-size: 1.8em;
	line-height: 0.9em;
 	}
 	
	.menu a {
	font-size: 0.66em;
	letter-spacing: 0.03em;
 	}
  
 	.menu li {
	padding: 1.3em 0em 0em 0.58em;
  	}  
  
  	.menu li:last-child {
	padding-left: 0.1em !important;
	}
	
	li.shoplogo {
	width: 2.8rem;
	margin-left: 0rem;
	margin-bottom: .4rem;
	}
}



/* Headings
-------------------------------------------------- */

h1, h2, h3, h4 {
  text-transform: uppercase;
  letter-spacing: 0.03em;
  font-weight: 400;
}

h1 {
  font-size: 1.35em;
  margin-bottom: .5em;
}
h2 {
  font-size: 1.2em;
  margin-bottom: 1.1em;
}
h3 {
  font-size: 1.3em;
  line-height: 1.25em;
  margin-bottom: 0.3em;
}
h4 {
  font-weight: 400;
  line-height: 1.5em;
  margin-bottom: .5em;
  margin-top: 1em;
}
h0 a, h1 a, h2 a, h3 a, h4 a {
  color: inherit;
  border: 0 !important;
}

/* Grid
-------------------------------------------------- */

.grid {
  width: 100%;
  --columns: 12;
  --gutter: 1rem;
  display: grid;
  grid-gap: var(--gutter);
  grid-template-columns: 1fr;
}


.column {
width: 100%;
}

@media screen and (min-width: 30rem) {

  .grid {
    grid-template-columns: repeat(12, 1fr);
	--gutter: 3rem;
  }
  .grid > .column {
    grid-column: span var(--columns);
  }

}

@media screen and (min-width: 450px) and (max-width: 1200px) {

.grid.artists {
    grid-template-columns: repeat(6, 1fr);
	--gutter: 2.5rem;
  }

.column.pub.grid {
--columns: 12 !important
}

.column.publimg {
--columns: 4 !important
}

}


/* Artists
-------------------------------------------------- */

.artistmenu {
  display: block;	
  clear: both;
  margin-bottom: 1.2em;
  font-size: 0.9em;
  font-family: 'Lato', sans-serif;
  text-transform: uppercase;
}

.artistmenu a {
  color: black;
  border: 0;
}

.artistmenu .active {
  color: black;
}

.artistmenu a:hover {
  color: #222;
}

.artistmenu li {
  list-style: none;
  float: left;
  padding: 0em 1em 1em 0em;
}

.grid.artists {
margin: 3rem 0 6rem;
}


.artistname, .artists  {
  margin: 0.7em 0 0;
  font-size: 1em;
  letter-spacing: 0.02em;
  text-transform: uppercase ;
  text-align: center;
  line-height: 1.5em;
}

.artistname2 {
  list-style: none;
  margin: 0.3em 0 2rem;
  font-size: 1em;
  letter-spacing: 0.02em;
  text-align: left;
  line-height: 1.5em;
}

.artists a:hover {
  color: rgba(100, 100, 100, 0.70);
}

.artvisual {
	display: block;
	position: relative;
	width: 33.33%;
	float: right;
}

.artvisual:before {
	content: "";
	display:block;
	padding-top: 100%;
}

.artvisualimg {
	position: absolute;
	top: 0px;
	left: 0px;
	right: 0px;
	bottom: 0px;
	width: 100%;
	height: 100%;
	border: 10px solid #fff;
	object-fit: cover;
}

.pdfgrid {
	margin-top: 6em;
}

.pdflink {
	font-size: 0.9em;
	display: block;
	text-align: center;
	text-transform: uppercase;
	margin-top: .9em;
	}
	
.pdfimg {
	position:relative;
	display: block;
}	


.artisttext p {
    margin-bottom: 0.8em;
	width: 70%;
}

.artisttext a {
	border-bottom: 1px solid #000000;
	padding-bottom: 1px;
}

.cvtext p {
	 margin-bottom: 1.5em;
	 line-height: 1.4em;
	 width: 70%;
}

.guests {
	margin: 4em 0 2em;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    line-height: 1.5em;
	}

.guests a {
	  color: #636363;
}	 

.more {
    display: block;
    margin-top: 1rem;
    color: #636363;
    line-height: 2em;
    column-count: 4;
}

	
	
@media screen and (max-width: 640px) {
	.artisttext p {
	width: 100%;
	}
	.cvtext p {
	width: 100%;
	}

	.artistsbox {

	}
	#artvisual {
	display: none;
	}
	
	.pdfbox {
	width: 48%;
	margin-right: 4%;
	margin-bottom: 3em;	
	}

	.more {
    column-width: 100%;
    column-count: 1;
}
}

@media screen and (min-width: 640px) and (max-width: 950px) {	
	.artistsbox {

	}	
	
	.artvisual {
	right: -0.4em;
	width: 9em;
	height: 9em;
	margin: 0.4em;
	float: right;
	}
	
	.artistname, .artists {
	font-size: 1em;	
	}
	
	.pdfbox {
	width: 32%;
	margin-right: 2%;
	margin-bottom: 3em;	
	}
	
	.more {
    column-width: 50%;
    column-count: 2;
}
}

@media screen and (min-width: 950px) and (max-width: 1200px) {
	.artvisual {
	right: -0.4em;
	width: 12em;
	height: 12em;
	margin: 0.4em;
	float: right;
	}
	
	}


/* Footer
-------------------------------------------------- */
.footer {
	 padding: 2em 0 6em;
	 font-size: .95em;
     margin-bottom: 3em;
}


/* Artgrid
-------------------------------------------------- */
.artgrid { 
	max-width: 100%; 
}

.grid-sizer, .grid-item { 
	width: 31%; 
}
	
.grid-item {
 	float: left;
 	margin-bottom: 3em;
 	font-size: 0.9em;
 	line-height: 1.2em; 
}

.grid-item img {
  	display: block;
  	max-width: 100%;
  	padding-bottom: 0em;
}

.gutter-sizer { 
	width: 3.5%; 
}

.artgrid:after {
  	content: "";
  	display: block;
  	clear: both;
}

@media screen and (max-width: 640px) {
	.grid-sizer, .grid-item { 
	width: 100%; 
	}
	.gutter-sizer { 
	width: 4%; 
}
}
@media screen and (min-width: 640px) and (max-width: 1200px) {
	.grid-sizer, .grid-item { 
	width: 48%; 
	}
	.gutter-sizer { 
	width: 4%; 
}
}


 /* Exhibitions
-------------------------------------------------- */

.grid.exhib {
margin: 3rem 0 6rem;
}

.exhibtxt {
    margin-bottom: 3em;
}

.exhibtext p {
 margin-bottom: 1em;
}

.exhib p {
	margin-left: 0em;
    width: 80%;
}


.exhibtitle {
	font-size: 1.3em;
	text-transform: uppercase;
	line-height: 1.25em;
	margin-bottom: 0.3em;
    width: 80%;
}

.exhibhead {
  	font-size: 1.2em;
  	text-transform: uppercase;
  	letter-spacing: 0.03em;
  	margin-bottom: 1.1em;
}

.exhiblink {
  	text-transform: uppercase;
  	color: rgba(40, 40, 40, 0.70);
  	letter-spacing: 0.07em;
  	font-size: 0.85em;
  	margin-top: 0.5em;
  	margin-bottom: 1.3em;
  	float: right;
}

.exhibtext {
	margin-top: 1.5em;
	margin-bottom: 2em;
}

.exhibtext a {
	border-bottom: 1px solid #000000;
	padding-bottom: 1px;
}

@media screen and (max-width: 450px) {
	

.exhibtitle {
	font-size: 1.4em;
    width: 80%;
    margin-left: 0em;
}
.exhib p {
	margin-left: 0em;
    width: 100%;
}


.exhibtxt {
	height: auto;
}
}


 /* News
-------------------------------------------------- */

.column.news.grid {
margin-bottom: 3rem;
}

.newsimg {
	position:relative;
	display: block;	
}



.newstitle {
	font-size: 1.2em;
	text-transform: uppercase;
	line-height: 1.25em;
	font-weight: 400;
	margin-bottom: 0.3em;
	}

.newstxt {
	margin-left: 0;
    overflow: hidden;
}

.newsvenue {
	text-transform: uppercase;
}

@media screen and (max-width: 640px) {
	.newstxt {
		margin-left: 0em;
		margin-bottom: 2em;
	}
	
	.newsimg:before {
	margin-bottom: 3%;
}


}

.pagination {
display: flex;
  flex-direction: row;
  justify-content: space-between;
  text-transform: uppercase
}

 

 /* Publications
-------------------------------------------------- */


.publimg {
	font-size: 0.9em;
    margin-bottom: 2em;
    padding-right: 8px !important;
}

.publtxt {
	font-size: 0.9em;
	line-height: 1.35em;
    height: 23em;
    margin-bottom: 2em;
    margin-left: 0;
}


@media screen and (max-width: 992px) {

.pub:after {
  content: "";
  display: table;
  clear: both;

}

.publimg, .publtx {

  margin-right: 1rem;
}


}



@media screen and (max-width: 640px) {
.publimg {
    margin-bottom: 1.5em;
}
.publtxt {
	height: auto;
    margin-bottom: 3em;
    margin-left: 0em;
}
}
@media screen and (max-width: 800px) {
    .publimg {
    padding-right: 3px !important;
}
}

section.large {
	min-height: 100%;
	width: 100%;
	right: 0px;
	left: 0px;
	top: 0px;
	bottom: 0px;
	display: block;
	position: absolute;
}

.slider {
	display: flex;
	justify-content: space-between;
	align-items: center;

}

.slides {
	display: inline-block;
	text-align: left;
	font-size: 4vw;
	margin-bottom: 0.5em;
	vertical-align: middle
}

.cycle-slideshow {
	display: inline-block;
	height: 50vw;
	width: auto;
	margin: 1em;
}


@media screen and (max-width: 450) {
	.cycle-slideshow {
	height: 50vw;
	margin-bottom: 1em;
	}
  }
  
@media screen and (min-width: 450px) and (max-width: 800px) {
	.cycle-slideshow {
	height: 50vw;
	margin-bottom: 1em;
	}
  }

.cycle-slideshow img {
	max-height: 100%;
	max-width: 100%;
	object-fit: cover;
	box-shadow:#fff 0 0 0;
}

 /* Contact
-------------------------------------------------- */

  #map-canvas {
	margin-top: 2em;
    width: 700px;
    height: 450px;
    background-color: #CCC;
  }
  
  .galtext p {
	margin-bottom: 1.5em;
	line-height: 1.4em;
	width: 75%;
}
@media screen and (max-width: 350px) {
  #map-canvas {
    width: 290px;
    height: 195px;
  }
    .galtext p {
	width: 100%;
	}
  }

@media screen and (min-width: 350px) and(max-width: 450px) {
  #map-canvas {
    width: 350px;
    height: 220px;
  }
    .galtext p {
	width: 100%;
	}
  }
  
@media screen and (min-width: 450px) and (max-width: 670px){
  #map-canvas {
    width: 450px;
    height: 275px;
  }
    .galtext p {
	width: 100%;
	}
  }  
  

  
   /* Home
-------------------------------------------------- */

.home {
	margin-top: 2em;
	}

.homeimg, .homevideo {
	position:relative;
	display: block;	

}

.homeimg:before {
	content: "";
	display:block;
	padding-top: 100%;
}

.homeimg img {
	position: absolute;
	top: 0px;
	left: 0px;
	right: 0px;
	bottom: 0px;
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.shownow {
  	font-size: 1.9em;
  	line-height: 1.25em;
  	font-weight: 400;
  	text-transform: uppercase;
  	letter-spacing: 0.03em;
  	margin: 0em 0em 0.3em 0em;
 }

.artistsnow {
	font-size: 1.1em;
	line-height: 1.2em;
	font-weight: 400;
	margin: 0em 0em 0.5em 0em;
}

.exhibfut {
    margin-top: 1em;
    overflow: hidden;
}

@media screen and (max-width: 450px) {
.homeimg {
	margin-bottom: 6%;
}
.artistsnow {
  	margin: 0em 0em 3em 0em;
} 
.shownow {
  font-size: 1.5em;
  margin: 0em 0em 0.2em -0em;
 }   
}

.grid-item:hover, .grid-item:active, .homeimg:hover, .homeimg:active, .newscont img:hover, .newscont img:active, .exhib img:hover, .exhib img:active, .artvisualimg:hover, .artvisualimg:active {
	filter:alpha(opacity=80);
	-moz-opacity:0.9;
	-khtml-opacity: 0.9;
	opacity: 0.9;
	-webkit-user-select: none; 
	-webkit-touch-callout: none;
}

.homevideo {
width: 100%;
	height: auto;
	margin-bottom: 1em;
	margin-top: 0;
}


	
.video {
	width: 720px;
	height: 405px;
	margin-bottom: 1em;
	margin-top: 3em;
}


@media screen and (max-width: 450px) {
.video {
	width: 350px;
	height: 197px;
}

  }
  
@media screen and (min-width: 450px) and (max-width: 800px) {
.video {
	width: 500px;
	height: 281px;
}
  }

.fa-facebook-official, .fa-instagram {
	font-size: 1.2em !important;
}

.fa-file-pdf-o {
font-size: 1.3em !important;
color: #767676;
}

.slicknav_menu {
	display:none;
}

.imprint {
  	font-size: 0.85em;
	display: block;
	float: right;
	text-transform: uppercase;
}

.impr a {
	text-decoration: underline;
}