body {

  font-family: 'Space Mono', monospace;
}

  .artistimage {
  width: 30%;
  align-self: flex-start;
  }

.images{
  display: flex;
  width: 900px;
  justify-content: space-between;
  margin-top: 100px;
}

.gallerythumbnail {
    width: 300px;
    }

.infopage{
  text-align: center;
  margin-top: 10px;
}


.space{
  min-height: calc(100vh - 206px);
  display: flex;
  flex-direction: column;
  justify-content: center;
  font-size: 20px;
}

.aboutspace{
  margin-top: 100px;
  font-size: 20px;
}

h2{
  font-size: 60px;
  margin-bottom: 5px;
}
.wrapper{
  min-height: calc(100vh - 106px);
  flex: 1 0 auto;
  margin-bottom: 0;

}

footer {
  width: 100%;
  color: black;
  padding: 20px;
  text-align: center;
  flex-shrink: 0;
  margin-top: 0;

}


body{
  width: 900px;
  margin: 0  auto;
  display: flex;
  flex-direction: column;
  flex-shrink: 0;

}


/*element */

nav{
  text-align: center;

}

nav li{
  display: inline-block;
  width: 100px;
}


.index-nav{
  font-size: 21px;
  position: relative;
  top: 350px;
  left: 0px;
}

.index-nav li{
  margin-right: 200px;
  display: inline-block;
  width: 100px;
}

.mainnav a{
  text-decoration: none;
  border-bottom: 3px solid black;
}

.mainnav a:hover{
  border-bottom: 3px solid gray;

}



#about {
  position: absolute;
  left: 200px;
  bottom: 0px;

}

#gallery {
  position: absolute;
  left: 350px;
  bottom: 0px;

}

#index {
  position: absolute;
  left: 525px;
  bottom: -30px;
  color: #f66c16;
  text-decoration: none;
  border-bottom: none;
  font-size: 25px;



}

#artist {
  position: absolute;
  left: 725px;
  bottom: 0px;

}

#sources {
  position: absolute;
  left: 920px;
  bottom: 0px;

}
/* element */
a:link{
  color: black;

}

a:visited{
  color: black;
}

a:hover{
  color: gray;
}

a:active{
  color: black;
}

a.orange{
border-bottom: 3px solid #f66c16;
  color: #f66c16;
}

a.active{
border-bottom: 3px solid #f66c16;
}

.content{
  width: 900px;
  background-color: rgba(255,255,255,0.7);
  margin: 0 auto;
  min-height: 100vh;
  margin-bottom: 0;
  padding: 20px;
}

.content img{
  max-width: 100%;

}


.content-bg{
  width: 1200px;
  height: 800px;
  background-image: url("../images/goldsworthy1.png");
  background-size: cover;


}

.index-bg {
  background-color: #dcd4c4;
  width: 1200px;
}

.about-bg {
background-image: url("../images/garlicleaves.jpg");
background-size: cover;
background-attachment: fixed;

}

.artists-bg {
background-image: url("../images/landscape.jpg");
background-size: cover;
background-attachment: fixed;
}


.gallery-bg {
background-image: url("../images/manfred.jpg");
background-size: cover;
background-attachment: fixed;
}

.sources-bg {
background-image: url("../images/mass.jpg");
background-size: cover;
background-attachment: fixed;
}

.template-bg {
background-image: url("../images/mass.jpg");
background-size: cover;
background-attachment: fixed;
}