h1 { padding: .2em; margin: 0; }
.items { float:left; width: 500px; margin-right: 1em;  margin-bottom: 1em; }
.cart { width: 200px; float: left; margin-top: 1em; }
/* style the list to maximize the droppable hitarea */
.cart ol { margin: 0; padding: 1em 0 1em 3em; }

.cartNoDrop { width: 200px; float: left; margin-top: 1em; }
/* style the list to maximize the droppable hitarea */
.cartNoDrop ol { margin: 0; padding: 1em 0 1em 3em; }

/* LIST #2 */
#catalog {}
#catalog ul { font-family:Georgia, Times, serif; font-size:15px; color:#344545;  }
#catalog ul li { }
#catalog ul li p { padding:8px; font-style:normal; font-family:Arial; font-size:13px; color:#eee; border-left: 1px solid #999; }
#catalog ul li p em { display:block; }

#myBtn {
    display: none; /* Hidden by default */
    position: fixed; /* Fixed/sticky position */
    bottom: 20px; /* Place the button at the bottom of the page */
    right: 30px; /* Place the button 30px from the right */
    z-index: 99; /* Make sure it does not overlap */
    border: none; /* Remove borders */
    outline: none; /* Remove outline */
    background-color: red; /* Set a background color */
    color: white; /* Text color */
    cursor: pointer; /* Add a mouse pointer on hover */
    padding: 15px; /* Some padding */
    border-radius: 10px; /* Rounded corners */
    font-size: 18px; /* Increase font size */
  }
  
  #myBtn:hover {
    background-color: #555; /* Add a dark-grey background on hover */
  }
  .updatedClass {
    background-color: green;
      border: 2px solid green;
      color: white;
      font-weight: bold;
      font-style: italic;
  }
  .historicData {
    background-color: rgb(189, 58, 121);
      border: 2px solid rgb(189, 58, 121);
      color: white;
      font-weight: bold;
      font-style: italic;
  }
.odd{
	color: #000000;
}
.even{
	color: #FF0000;
}
/*Spinner*/
.spinner {
  width: 40px;
  height: 40px;
  background-color: #333;
  -webkit-animation: sk-rotateplane 1.2s infinite ease-in-out;
  animation: sk-rotateplane 1.2s infinite ease-in-out;
}

@-webkit-keyframes sk-rotateplane {
  0% { -webkit-transform: perspective(120px) }
  50% { -webkit-transform: perspective(120px) rotateY(180deg) }
  100% { -webkit-transform: perspective(120px) rotateY(180deg)  rotateX(180deg) }
}

@keyframes sk-rotateplane {
  0% { 
    transform: perspective(120px) rotateX(0deg) rotateY(0deg);
    -webkit-transform: perspective(120px) rotateX(0deg) rotateY(0deg) 
  } 50% { 
    transform: perspective(120px) rotateX(-180.1deg) rotateY(0deg);
    -webkit-transform: perspective(120px) rotateX(-180.1deg) rotateY(0deg) 
  } 100% { 
    transform: perspective(120px) rotateX(-180deg) rotateY(-179.9deg);
    -webkit-transform: perspective(120px) rotateX(-180deg) rotateY(-179.9deg);
  }
}