


.accordion-button:not(.collapsed)::after {
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23ffffff'%3e%3cpath fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e");
}


h2 {
  font-size: 1em;
}

a h2.fancy {
  font-size: .85em;
}

a {
  color: #f0f0f0;
  text-decoration: none;
}

a:hover {
  color: #f0f0f0;
  text-decoration: none;
}

#footer-link:hover {
  text-decoration: underline;
}

.img-hoverable:hover, .img-hoverable:active {
  transform: scale(1.3);
}

#footer-link:hover > img {
  transform: scale(1.3);
}



/* ANIMATIONS */

.Object,
.ObjectContainer a {
  -webkit-transition: all 0.35s ease-in-out;
  -moz-transition: all 0.35s ease-in-out;
  -ms-transition: all 0.35s ease-in-out;
  -o-transition: all 0.35s ease-in-out;
  transition: all 0.35s ease-in-out;
}

.ObjectContainer {
  width: 6.25em;
  height: 6.25em;
  border-radius: 5%;
  display: block;
  position: relative;
}


.bigger-sm {
  width: 7em;
  height: 7em;
}

.biggest-sm {
  width: 10em;
  height: 10em;
}

@media (min-width: 769px) {
  .bigger-md {
    width: 10em;
    height: 10em;
  }

  .biggest-sm {
    width: 12em;
    height: 12em;
  }
}


.ObjectContainer .Object {
  width: 100%;
  height: 100%;
  border-radius: 5%;
}

.ObjectContainer a {
  position: absolute;
  bottom: -100px;
  left: 0;
  opacity: 0;
  width: 100%;
  line-height: 0px;
  text-align: center;
  vertical-align: middle;
}

.ObjectContainer span {
  position: absolute;
  left: 0;
  width: 100%;
  line-height: 100px;
  text-align: center;
  vertical-align: middle;
  color: white;
}

.ObjectContainer span .mug{
  background-image: url("rsrc/font/mug.svg");
}


#gotcha {
  color:black;
}

.ObjectContainer:hover .Object,
.ObjectContainer .Object:focus,
.ObjectContainer .Object:active  {
  margin: 2.5%;
  height: 95%;
  width: 95%;
  border-radius: 50%;
  -webkit-transform: rotate(100deg);
  -moz-transform: rotate(100deg);
  -ms-transform: rotate(100deg);
  -o-transform: rotate(100deg);
  transform: rotate(100deg);
}

/*
.ObjectContainer:hover span img {
  margin: 2.5%;
  height: 95%;
  width: 95%;
  border-radius: 50%;
  opacity: 0.1;
    transition: opacity 1s ease-in-out;
    -moz-transition: opacity 1s ease-in-out;
    -webkit-transition: opacity 1s ease-in-out;
}
*/
.ObjectContainer:hover a,
.ObjectContainer .Object:focus + a,
.ObjectContainer .Object:active + a   {
  opacity: 1;
  bottom: 10px;
  /*line height adjust the verticle alignment*/
  line-height: 4.5em;
  letter-spacing:.05em;
}

.squareContainer {
  width: 150px;
  height: 150px;
}

#accordionExample {
  max-width: 800px;
}

/* COLOR CLASSES FOR BUTTONS */
#l-orange.Object {
 background-color: #E79F55;
}
#d-orange.Object {
 background-color: #AF5B22;
}
#green.Object{
 background-color: #34473A;
}
#l-red.Object{
 background-color:#EFAFB4;
}
#d-red.Object{
 background-color:#C72D23;
}
#skyblue.Object{
 background-color:#8CBAB5;
}
#black.Object{
 background-color:#000000;
}
#l-yellow.Object{
 background-color: #B8B461;
}
#ivory.Object{
 background-color:#EBEADB;
}
