body {
  background-color: rgb(0, 0, 0);
  font-family: 'Gill Sans', 'Gill Sans MT', Calibri, 'Trebuchet MS', sans-serif;
  background-image: url('assets/spiderweb_protocluster_field.jpg');
  background-size:contain; 
}

header{
 margin-bottom:5vh;
}

#logo {
  position:relative;
  display:inline-flex;
}

.menu-items{
    display: inline;
    color: rgb(253, 253, 253);
    font-style: italic;
    font-size: 1.1em;
    margin:30px;
    margin-left:-10px;
}

.menu-items a{
  color: rgb(255, 255, 255);
  text-decoration:none;
}

#homebutton{
    /* background-image: url("/assets/tendrilsngc604.jpg");
    background-size:contain; */
}

#aboutbutton{
    /* background-image: url("/assets/tendrilsngc604.jpg");
    background-size:contain; */
   
}
#thoughtsbutton{
    /* background-image: url("/assets/tendrilsngc604.jpg");
    background-size:contain; */
    
}

#contactbutton{
    /* background-image: url("/assets/tendrilsngc604.jpg");
    background-size:contain; */
}

 


.ezxeoxe{
  text-align: center;
  font-family: Cursive;
  font-size: 2em;
  color: white;
  text-shadow: 0.5px 0.5px 3px;
  padding: 2px;
  width:20vw;
  height:2em;
  min-width: 175px;
  z-index: 1;
}


.bounce2{
    grid-column-start: 1;
    position: absolute;
    animation: slide 12s infinite;
    z-index: 2;
  }
  
  @keyframes slide {
  0%{
    transform: translateY(-5vh);
    animation-timing-function: ease-in;
  }

  100%{
    transform: translateY(100vh);
    animation-timing-function: ease-out;
  }
}

.bounce1{
    grid-column-start: 2;
    position: absolute;
    animation: slide 12s infinite;
    z-index: 4;
  }
  
  @keyframes slide {
  0%{
    transform: translateY(-5vh);
    animation-timing-function: ease-in;
  }

  100%{
    transform: translateY(100vh);
    animation-timing-function: ease-out;
  }
}

.bounce3{
    grid-column-start: 3;
    position: absolute;
    animation: slide 12s infinite;
    z-index: 2;
  }
  
  @keyframes slide {
  0%{
    transform: translateY(-5vh);
    animation-timing-function: ease-in;
  }

  100%{
    transform: translateY(100vh);
    animation-timing-function: ease-out;
  }
}



.cardset {
    display: grid;
    top:-15px;
    bottom:-15px;
    grid-template-columns: auto auto auto;
    grid-template-rows: repeat(2, auto) 150px;
    justify-content: space-evenly;
    row-gap: 40px;
    position: relative;
    /* z-index: 3; */
}

.cardset a{
  color: white;
  text-decoration: none;
  
}

#card5 {
  z-index:5;
}

  
.image1 {
  background-image: url("/assets/cluster_birthn79.jpg");
  background-size: cover;
  width: 20vw;
  height: 30vh;
  /* border-color: #660023; */
  /* font-size:1.5vh; */
  min-width: 175px;
  min-height: 150px; 
  overflow:auto;
  z-index: 3;
   border-style: groove;
  border: thick solid rgb(70, 16, 16);
  } 
  
 .image2 {
  background-image: url("/assets/tendrilsngc604.jpg");
  background-size: cover;
  width: 20vw;
  height: 30vh;
  /* font-size:1.5vh; */
  min-width: 175px;
  min-height: 150px; 
  overflow:auto;
  z-index: 1;
  border-style: groove;
  border: thick solid rgb(70, 16, 16);
  }


.image3 {
  background-image: url("assets/spiderweb_protocluster_field.jpg");
  background-size: cover;
  width: 20vw;
  height: 30vh;
  /* font-size:1.5vh; */
  min-width: 175px;
  min-height: 150px; 
  overflow:auto;
  z-index: 1;
  border-style: groove;
  border: thick solid rgb(70, 16, 16);
  }

  .image4 {
  background-image: url("/assets/milkyway_cluster_browndwarf.jpg");
  background-size: cover;
  width: 20vw;
  height: 30vh;
  /* font-size:1.5vh; */
  min-width: 175px;
  min-height: 150px; 
  overflow:auto;
  z-index: 1;
  border-style: groove;
  border: thick solid rgb(70, 16, 16);
  }