
    html, body {
      margin: 0;
      padding:0;
      box-sizing: border-box;
      font-family: carolineale,sans-serif;
      font-weight:200;
      line-height:32px;
      font-size:22px;
    }
   
    canvas {
      display: block;
      width:100%;
      padding:0;
      margin:0;
      box-sizing: border-box;
      height: 100%;
      z-index:-2;
      position: fixed;

    }

    ul{margin:0; margin-block-start: 0em; margin-block-end: 0em; padding-inline-start: 0px;}

    li{list-style-type: none; margin-bottom:10px;}
    li:last-child;{margin-bottom:0px;}

    a {text-decoration: none;}



    .column1-2{
      display:inline-block;
      width:46%;
      padding:4%;
      font-weight: 200;
      box-sizing: border-box;
      font-size:calc(0.5rem + 0.8vw);
    }

    .column1-2 img{border-radius:50px;}

    .gold{color:#b87757;}
    .blue{color:#0000FF;}

    a{color:#FFF;}

    h1{font-family:'Playfair',sans-serif;}
    h2,h3,h4,h5,h6{font-family: carolineale, sans-serif;}
    h2{font-size:calc(20px + 2.2vw) ; margin:150px 0 40px 0; font-family: carolineale, sans-serif;}
    h3{font-size:calc(20px + 1.3vw) ; margin:0;}
    h4{font-size:calc(20px + 1.1vw) ; margin:30px 0 30px 0;}
    .content{padding:50px;}
    .content h3{font-size:calc(20px + 1vw); margin:0 0 20px 0 ;}
    .content p{margin:0 0 0px 0; font-size:18px;line-height:24px;}



.slider-container {
position: relative;
max-width: 90%;
margin: 0px auto;
overflow: hidden;

}


.slider {
width: 100%;
display: flex;
transition: transform 0.5s ease-in-out;
}


.slide {
flex: 1 0 100%;
background-color: rgba(0,0,0,0.5);
backdrop-filter: blur(8px);
box-sizing: border-box;
text-align: center;
font-size: calc(0.6rem + 0.8vw);
}


.slide img {
width: 100%;
max-width: 100%;
}

.borderblurred{
  background-color: rgba(0,0,0,0.5);
  backdrop-filter: blur(8px);
  padding:30px;
  color:#FFF;
  box-sizing: border-box;
  margin: 0px auto;
  margin-top:80px;
  }

.borderblurred h2{margin-top:40px;}

.nav {
position: absolute;
top: 50%;
transform: translateY(-50%);
color: white;
border: none;
font-size: 24px;
padding: 10px 15px;
cursor: pointer;
z-index: 10;
background: none;
width: 40px;
height: 40px;
}


.nav.prev {
left: 5px;
}


.nav.next {
right: 5px;
}


.slider-dots {
text-align: center;
margin-top: 15px;
}


.slider-dots .dot {
display: inline-block;
width: 12px;
height: 12px;
margin: 0 6px;
background-color: rgba(255, 255, 255, 0.3);
border-radius: 50%;
cursor: pointer;
transition: background-color 0.3s;
}


.slider-dots .dot.active {
background-color: white;
}


    @media screen and (width <= 768px)
    {
      .column1-2{width:100%; padding:5%; font-size:1rem;}
      .projectsmobile img{display:block;}
      .slider-container{max-width:85%;}
      .borderblurred{max-width:85%;}
      h1{margin-bottom:250px;}
      h2{margin:100px 0 20px 0;}
      h3{font-size:2rem;}
      .column1-2:last-child{margin-top:80px;}
    }

     @media screen and (width > 768px)
    {
      .projectsdesktop img{display:block;}
      .projectsmobile img{display:none;}
      .slider-container{max-width:45%;}
      .borderblurred{max-width:45%;}
    }
