body {
      font-size: 100%;
    } 
    div.card {
        background-color: #a3ccf0;
      }
      img.large-icon {
        width: 90%;
      }
      img.icon {
        width: 45px;
      }
      img.small-icon {
        width: 25px;
      }
      frame {
        height: 50px;
        width: 50px;
      }
      ul {
        list-style: none;
        margin: -1.0em;
      }
	  li {
	    display: inline-block;
	    margin-right: 0px; /* add spacing between items */
	  }
	  h3 {
		  font-family: Lexend;
		  font-style: normal;
		  font-size: 1.5em;
    }
    h6 {
      font-family: Lexend;
    }
	  div.card-body {
		  width: 100%;
		  margin: 0 auto;
		  
	  }
	  p {
		  margin: 0px 0px -16px !important;
	  }
    .heading-level {
      text-align: right;
      width: 25%;
    }
    .heading-tide {
      text-align: left;
      width: 25%;
    }
    .heading-time {
      text-align: right;
      width: 15%;
    }
    .detail-level {
      text-align: right !important;
      width: 25%;
    }
    .detail-tide {
      text-align: left;
      width: 25%;
    }
    .detail-time {
      text-align: left;
      width: 15%;
    }
    tr {
      font-weight: bold !important;
      border: none !important;
    }
    .table th,.table td {
      border: none !important;
      font-size: small;
    }
    .table-sm td, .table-sm th {
      padding: 0.20rem !important;
    }