body{
    background-color:rgb(237, 237,237); 
    overflow-x: hidden;
    user-select: none;
    cursor: none;
    margin: 0;
    padding: 0;
    min-height: 100%;
}
p{
 color: rgb(207, 206, 206);
 
}
.cursor {
  width: 80px;
  height: 80px;
  background-color:rgb(207, 206, 206);
  border-radius: 50%;
  filter: blur(20px);
  opacity: 0.5;
  position: fixed;
  pointer-events: none;
  transform: translate(-50%, -50%);
  z-index: 9999;
   transition: left 0.05s ease, top 0.05s ease;
}

.menu{
    z-index: 999;
    position:fixed;
    top: -4rem;
    left: 2vh;
    font-size: 8vh;
    font-family: "broadsheet", serif;
    font-weight: 400;
    font-style: italic;
    filter: blur(0.3vh);
}

.menu:hover{
   filter: blur(0.1vh); 
}


.italic{
font-family: "broadsheet", serif;
font-weight: 400;
font-style: italic;
letter-spacing: 0;
line-height: 3.5vh;
}

a{
    text-decoration: none;
    color: rgb(207, 206, 206);
    cursor: none;
}

.title{
    position: flex;
    text-align: center;
    padding-left: 10vw;
    padding-right: 10vw;
    padding-bottom: 0;
    padding-top: 1vw;
   font-family: "broadsheet", serif;
   font-size: 8.5vh;
    font-style: italic;
    font-weight: 900;
    word-spacing: -2;
    line-height: 6vh;
    color: rgb(207, 206, 206); 
}

.abstract-text{
    position: flex;
padding-left: 10vw;
padding-right: 10vw;
padding-bottom: 10vw;
padding-top: 10vh;
font-size: 4.5vh;
font-family: "adobe-garamond-pro", serif;
font-weight: 400;
font-style: normal;
line-height: 3.8vh;
letter-spacing: -0.2vh;
}

.quote{
position: flex;
padding-left: 10vw;
padding-right: 10vw;
padding-bottom: 10vw;
padding-top: 10vh;
}

.quote-text{
    text-align: center;
     font-family: "broadsheet", serif;
   font-size: 4.5vh;
    font-style: italic;
    font-weight: 900;
    word-spacing: -2;
    line-height: 4vh;
    color: rgb(207, 206, 206); 
}

.quote-author{
    text-align: center;
     font-family: "broadsheet", serif;
   font-size: 3.5vh;
    font-style: normal;
    font-weight: 900;
    word-spacing: -2;
    line-height: 4vh;
    color: rgb(207, 206, 206); 
}

.quote-title{
    text-align: center;
     font-family: "broadsheet", serif;
   font-size: 3.5vh;
    font-style: italic;
    font-weight: 900;
    word-spacing: -2;
    line-height: 4vh;
    color: rgb(207, 206, 206); 
}


.navigation{
padding-top: 20vw;
text-align: center;
font-size: 4.5vh;
font-family: "adobe-garamond-pro", serif;
font-weight: 400;
font-style: normal;
line-height: 3.8vh;
letter-spacing: -0.2vh;
}

.navigation-text span{
    font-family: "broadsheet", serif;
    font-style: italic;
    font-weight: 900;
    filter: blur(0.4vh);
    word-spacing: 10vh;
    color: rgb(207, 206, 206);
}

.navigation-text span:hover {
    filter: blur(0.1vh);
}

  
.navigation-vertical{
    z-index: 999;
    position: fixed;
    width: 4rem;
    top: 2rem;
    text-align: center;
    font-size: 4.5vh;
    font-family: "broadsheet", serif;
    font-style: italic;
    font-weight: 900;
    color: rgb(207, 206, 206);
}

@media screen and (max-width: 600px) {
  .navigation-vertical {
     z-index: 999;
    display: flex;
    align-items: center;
    flex-direction: row;
      width: auto;
    left: auto;
    right: 2rem;
    top: 0.2rem;
    word-spacing: 2rem;
    letter-spacing: -0.2vh;

  }
  .navigation-vertical a {
    display: inline;
  }

  .navigation-vertical p {
    display: inline;
    margin: 0;
  }
}

.navigation-vertical p{
     filter: blur(0.4vh);
}

.navigation-vertical p:hover{
    filter: blur(0.1vh);
}









/* 
.chapters{
    margin: 10vh;
}

img {
    width: 100%;
    padding-bottom: 10vh;
    display: block;
}

#images-chapter-one,
.images-chapter-two,
.images-chapter-three {
    display: grid;
    grid-template: repeat(2, 1fr);
    

  
}

#images-chapter-one img,
.images-chapter-two img,
.images-chapter-three img {
    filter: opacity(0.4) blur(0.5vh);
    transition: filter 0.3s ease; 
    width: 100%;
   
}

#images-chapter-one img:hover,
.images-chapter-two img:hover,
.images-chapter-three img:hover {
    filter: opacity(0.6) blur(0); 

}
 */

.chapters-container{
  position: relative;
  
}

.chapters-text{
position: flex;
padding-left: 10vw;
padding-right: 10vw;
padding-bottom: 0;
padding-top: 30vh;
font-size: 4.5vh;
font-family: "adobe-garamond-pro", serif;
font-weight: 400;
font-style: normal;
line-height: 3.8vh;
letter-spacing: -0.2vh;
}

.refs-chapter-one,
.refs-chapter-two,
.refs-chapter-three {
  position: relative; 
  display: flex;
  top: -15vw;
  justify-content: center;
  align-items: center;
  width: 100%; 
  box-sizing: border-box;
}

.refs-chapter-one p,
.refs-chapter-two p,
.refs-chapter-three p{
position: relative;       
z-index: 1;
width: 80%;               
text-align: center;
padding: 15vw;
font-size: 1.5rem;
font-family: "broadsheet", serif;
font-weight: 400;
font-style: italic;
letter-spacing: 0;
line-height: 1.2rem;
color: rgb(207, 206,206);
filter: blur(0.6vh);
}

.refs-chapter-one p:hover,
.refs-chapter-two p:hover,
.refs-chapter-three p:hover{
    filter: blur(0.1vh);
}



.afterword-gradient{
    position: relative;
    background-image: linear-gradient(to bottom, rgb(237, 237,237), rgb(227, 226, 226) 30vw);
    padding-bottom: 50vh;
    margin-bottom: -50vh;
}

.afterword{
    padding-top: 20vw;
    
}

.afterword p{
    color: rgb(187, 186, 186); 
}

.afterword-text{
position: flex;
padding-left: 20vw;
padding-right: 20vw;
padding-bottom: 10vw;
}

.center{
    text-align: center;
}
.afterword-text p{
font-size: 4.5vh;
font-family: "adobe-garamond-pro", serif;
font-weight: 400;
font-style: normal;
line-height: 4.5vh;
letter-spacing: -0.2vh;
filter: blur(0.1vh);
}

.afterword-text-center{
position: flex;
padding-left: 20vw;
padding-right: 20vw;
}

.afterword-text-center p{
font-size: 4.5vh;
font-family: "adobe-garamond-pro", serif;
font-weight: 400;
font-style: normal;
line-height: 4.5vh;
letter-spacing: -0.2vh;
filter: blur(0.1vh);
text-align: center;
}
.intro-text-center{
position: flex;
padding-top: 10vh ;
padding-left: 10vw;
padding-right: 10vw;
}

.intro-text-center p{
font-size: 4.5vh;
font-family: "adobe-garamond-pro", serif;
font-weight: 400;
font-style: normal;
line-height: 3.8vh;
letter-spacing: -0.2vh;
filter: blur(0.1vh);
text-align: center;
}

.intro-text{
position: flex;
padding-top: 10vh ;
padding-left: 10vw;
padding-right: 10vw;
}

.intro-text p{
font-size: 4.5vh;
font-family: "adobe-garamond-pro", serif;
font-weight: 400;
font-style: normal;
line-height: 3.8vh;
letter-spacing: -0.2vh;
filter: blur(0.1vh);
}

/* .elipse{
   position: absolute;        
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  width: 100%;                
  height: 70%; 
  background-color:rgb(217, 216, 216);
  border-radius: 50%;
  filter: blur(10vw);
  
} */


@media screen and (max-width: 600px) {
  .chapters-text {
    padding-left: 2vw;
    padding-right: 2vw;
  }

}

.chapters{
    margin: 10vw;
    box-sizing: border-box;
}

@media screen and (max-width: 600px) {
  .chapters {
    margin: 2vh;
  }

}
 

  .chapter-one-spread,
  .chapter-two-one-spread,
  .chapter-three-spread{
      padding-bottom: 15vw;
      display: grid;
      grid-template-columns: 1fr 1fr;
      grid-template-rows: 1fr 1fr;
      width: 100%;
      row-gap: 3vw;
      column-gap: 3vw;
    }

.images-tall {
    padding-bottom: 15vw;
    display: grid;
    grid-template-columns: 1fr 1fr;
    grid-template-rows: repeat(2, 35vw);
    box-sizing: border-box;
    row-gap: 3vw;
    column-gap: 3vw;
}

.images-tall img {
    width: 100%;
    object-fit: cover;
    filter: opacity(0.4) blur(0.5vh);
    transition: filter 0.3s ease;
}

.images-tall img:hover {
    filter: opacity(0.6) blur(0);
}
    
 .chapter-two-two-spread {
    padding-bottom: 15vw;
    display: grid;
    grid-template-columns: 1fr 1fr;
    grid-template-rows: repeat(2, 35vw);
    width: 100%;
    row-gap: 3vw;
    column-gap: 3vw;
}
 
.chapter-two-two-spread img:first-child {
    grid-column: 1;
    grid-row: 1 / 3;
    width: 100%;
    height: 100%;
    object-fit: cover;
}
 
.chapter-two-two-spread img:nth-child(2) {
    grid-column: 2;
    grid-row: 1;
    width: 100%;
    height: 100%;
    object-fit: cover;
}
 
.chapter-two-two-spread img:nth-child(3) {
    grid-column: 2;
    grid-row: 2;
    width: 100%;
    height: 100%;
    object-fit: cover;
}


#images-chapter-three .chapter-three-spread:first-child {
    column-gap: 0;
}

    .chapter-one-spread img,
    .chapter-two-one-spread img,
    .chapter-two-two-spread img,
    .chapter-three-spread img{
      filter: opacity(0.4) blur(0.5vh);
      transition: filter 0.3s ease; 
      width: 100%;
    }

.chapter-one-spread img:hover,
.chapter-two-one-spread img:hover,
.chapter-two-two-spread img:hover,
.chapter-three-spread img:hover{
 filter: opacity(0.6) blur(0); 
}