/* 
    Filename:   packagesW.css
    By:         John G. (Skip) Todora
    Date:       August 06, 2026
    Website:    skipsmessyworkbench.com
*/


.row:after {
    content: "";
    display: table;
    clear: both;
}

.menu-row:after {
    content:"";
    display: table;
    clear: both;
}

.column {
    width: 33.33%;
    float: left;
    padding: 10px;
}

.menu-five-column {
    width: 20%;
    float: left;
    padding: 10px;
}

.menu-six-column {
  width: 16.66%;
  float: left;
  padding: 10px;
}

img {
  display: flex;
  width: 100%;
  padding-left: 10px;
  padding-right: 10px;
}

.center-text {
    text-align: center;
}

 .hr-line {
	border: 1px solid black;
	width: 90%;
 }

@media screen and (max-width: 600px) {
  figure {
    width: 100%;
    margin: auto;
  }
  h2 {
    padding-left: 10px;
    padding-right: 10px;
  }
  p {
    margin-left: 10px;
    margin-right: 10px;
  }
  .column {
      width:100%;
  }

  .menu-five-column {
      width: 50%;
  }

  .menu-six-column {
      width: 50%;
  }

  a.tltip:hover span {
    border: black 1px solid;
    color: black;
    padding: 5px 20px 5px 5px;
    display: block;
    z-index: auto;
    /* background: #e3eb9e; */
    background: #ffffe1;
    left: 0px;
    /* margin: 15px; */
    margin: 5px;
    /* width: 500px; */
    width: 100px;
    position: absolute;
    top: 15px;
    text-decoration: none;
    box-shadow: 10px 10px rgb(104, 100, 100);
    }
}














li {
    margin-right: 10px;
    padding-bottom: 5px;
}

ul {
    margin-left: 40px;
}

.delorean-img {
    display: flex;
    width: 100%;
    margin: auto;
    padding-left: 10px;
    padding-right: 10px;
}

/* TOOL TIP FROM: https://www.w3docs.com/tools/code-editor/10122 */
a.tltip {
  /* border-bottom: 1px solid; */
  visibility: visible;
  /* text-decoration: none; */
}

a.tltip:hover {
  /* cursor: help */
  position: relative;
}

a.tltip span {
  display: none;
}

a.tltip:hover span {
  border: black 1px solid;
  color: black;
  padding: 5px 20px 5px 5px;
  display: block;
  z-index: auto;
  /* background: #e3eb9e; */
  background: #ffffe1;
  left: 0px;
  margin: 15px;
  width: 250px;
  position: absolute;
  top: 15px;
  text-decoration: none;
  box-shadow: 10px 10px rgb(104, 100, 100);
}
/* END POP-UP HOVER VERSE TEXT */