body {
  background-color: white;
  color: black;
  font-family: Times New Roman;
}

a:link { text-decoration: none; }

#grad1 {
  height: 125px;
  background-image:  url("/images/palm.jpg"), linear-gradient(to right,#0fc5dd , #028ee3);
  background-repeat: no-repeat;
}
  
table {
  border: 1px solid black;
  border-radius: 10px;
  width: auto;
}

td:hover{
background-color: #0fc5dd;
}

th {
  text-align: left;
  text-transform: lowercase;
  font-weight: normal;
  text-indent: 10px;
  height: 30px;
}

tr {
  font-weight: normal;
  font-size: 17px;
}

#crepuscular {
 position: relative;
 top: -50px;
 left: -25px;
 width:128px;
 height:128px;
 float: right;
 z-index: 2;
}

#petrichor {
 position: relative;
 top: -20px;
 right: 50px;
 width: 158px;
 height:56px;
 border-bottom: 5px solid #0fc5dd;
 float: right;
 overflow:hidden;
 z-index: 2;
}

.blink {
 animation: blink_smooth 2s infinite;
 color: blue;
 padding-bottom: 1px;
 display:block;
 position:relative;
}

@keyframes blink_smooth {
    0% {
        opacity: 1;
    }
    50% {
        opacity: 0;
    }
    100% {
        opacity: 1;
    }
}

.space {
  padding: 15px;
}

.spaces {
  padding: 2px;
}

.blue{color: blue;
padding-bottom: 1px;
display:block;
position:relative;
}

.blueyonder{color: blue;
padding-bottom: 1px;
border-bottom: 1px solid #000000;
}

.green{color: green;
padding-bottom: 1px;
border-bottom: 1px solid #000000;
}

.info{color: blue;
font-size:20px;
padding-bottom: 1px;
border-bottom: 1px solid #8d8df3;
}

div.gallery {
  border: 1px solid #ccc;
}

div.gallery:hover {
  border: 1px solid #777;
}

div.gallery img {
  width: 100%;
  height: auto;
}

.desc {
  padding: 15px;
}

.responsive {
  width: 39.99999%;
}

@media only screen and (max-width: 700px) {
  .responsive {
    width: 49.99999%;
    margin: 6px 0;
  }
}

@media only screen and (max-width: 500px) {
  .responsive {
    width: 100%;
  }
}