body {
  margin: 0px;
  padding: 60px;
  color: black; background-color: white;
  box-sizing: border-box;
  font-family: 'Wittgenstein', serif;
  font-size: 16px;
  position: relative;
}

@media (max-width: 800px) {
  body{padding: 15px;}
}

header{margin-bottom: 20px;}
footer{margin-top:200px;}


@media (max-width: 800px) {
  header{padding: 0px;}
  footer{margin-top: 100px; padding: 0px;}
}


/*-----typo-----------------*/


p {
  font-weight: normal;
  font-size: 27px;
  line-height: 1.5;
  margin-top: 0px;
  margin-bottom: 0px;
}

@media (max-width: 800px) {p {font-size: 19px;}}

.projects p{
  max-width: 90%;
}

.headline p {
  font-size: 60px;
  font-weight: normal;
  line-height: 1.2;
}

@media (max-width: 1400px) {.headline p{font-size: 50px;}}
@media (max-width: 800px) {.headline p{font-size: 34px;}}

a{color: black;}
a:link{text-decoration: none;}

a:hover{
  text-decoration: none;
  filter: blur(1px);
  -webkit-filter: blur(1px);
}

footer a{font-weight: bold;}


h1 {
  font-weight: 400;
  font-size: 20px;
  letter-spacing: 3px;
}

h2{
  font-weight:bold;
  font-size: 45px;
  margin-top: 25px;
  margin-bottom: 22px;
  line-height: 1.3;
}

@media (max-width: 800px) {
h2{
  margin-top: 15px;
  margin-bottom: 10px;
  font-size: 34px;
}
}


/*-----------------------------------------------*/
.logo {
  margin: 0px;
}

.logo-icon{
  position: absolute;   
  bottom: 60px;           
  right: 60px;            
  width: 100px; 
}
.logo-icon img{
  width: 100%;
  cursor: pointer;
}

@media (max-width: 800px) {
  .logo-icon{
    position: fixed;
    top: 5px;
    right: 5px;
    width: 35px;   
    z-index: 10;
}
}

.headline {
  width: 100%; 
  margin: 0px;
  margin-bottom: 120px;
}

@media (max-width: 800px) {
  .headline {
    max-width: 100%;
    padding: 0px;
    margin: 50px 0px 50px 0px;
  }
}


@media (max-width: 800px) {.nomobile{display: none;}}

.nodesktop{display: none;}
@media (max-width: 800px) {.nodesktop{display: block;}}

.ico-featured{
  position: absolute;
  right: 20px;
  top: 20px;
  z-index: 11;
}
.ico-featured img{
  width: 50px;
}

.ico-link{
  position: absolute;
  left: 20px;
  top: 20px;
  z-index: 10;
  cursor: pointer;
}
/*-------------slideshow------------------------------*/
.slideshow{
  position: relative; /* Ensures absolute positioning is relative to this container */
}
.prev{
  position: absolute;
  left: 15px;
  top: 120px;
  z-index: 10;
  cursor: pointer;
}
.next{
  position: absolute;
  right: 15px;
  top: 120px;
  z-index: 10;
  cursor: pointer;
}
.prev img, .next img{width: 50px;}

@media (max-width: 1400px) {
.prev, .next{top: 55px;}
.prev img, .next img{width: 50px;}
.prev{left: 10px;}
.next{right: 10px;}
}

/*-------------fadein-------------------------------*/

.fade-in {
  opacity: 0;
  transform: translateY(20px);
  transition: opacity 0.6s ease-out, transform 0.6s ease-out;
}
  

.fade-in.visible {
  opacity: 1;
  transform: translateY(0);
}

.fade-in-simple {
  opacity: 0;
  transition: opacity 0.6s ease-out;
}

.fade-in-simple.visible {
  opacity: 1;
}

/*----------------------------------------------------------*/
/*long text*/


.long-text-logo{width: 300px;margin: 80px auto 0px auto;}

.long-text{margin: 80px 200px 120px 200px;}
@media (max-width: 1400px) {.long-text{margin: 50px 80px;}}
@media (max-width: 800px) {.long-text{margin: 50px 0px;}}

.long-text-narrow{width: 50%; margin: 150px auto 0px auto;}
.long-text-narrow>h2{margin-top: 70px;}
@media (max-width: 1400px) {
  .long-text-narrow{width: 80%;}
}
@media (max-width: 800px) {
  .long-text-narrow{width: 100%; margin-top: 80px;}
  .long-text-narrow>h2{margin-top: 40px;}
}


/*list of art projects*/
.artlist {
  list-style: none;
  padding: 0;
}

.artlist li {
  display: flex;
  gap: 16px;
}

.artlist{font-size: 22px;}
@media (max-width: 800px) {.artlist {font-size: 19px;}}

.year {
  font-weight: bold;
  min-width: 70px;
}


/*----------------------------------------------------------*/
/*video*/

.text-center{
  text-align: center;
}

.video-block {
  width: 350px;
  max-width: calc(100vw - 30px);
  margin: 0px auto;
  padding: 150px 0px;
}

.custom-video {
  width: 100%;
  height: auto;
  display: block;
  border: none;
  background: black;
  object-fit: cover; 
}