@CHARSET "UTF-8";
/** Code for hover info **/

.underHover,
.leftHover,
.rightHover,
.overHover,
.leftOverHover,
.rightOverHover,
.leftUnderHover,
.rightUnderHover,
.infoHover,
.largeHover,
.largeUnderHover {
	position: relative;
}

.lightHover {
	position: relative;
}

.underHover::after,
.leftHover::after,
.rightHover::after,
.overHover::after,
.leftOverHover::after,
.rightOverHover::after,
.leftUnderHover::after,
.rightUnderHover::after,
.infoHover::after,
.largeHover::after,
.largeUnderHover::after {
  content: attr(data-info);
  display: block;
  text-align: center;
  position: absolute;
  opacity: 0;
  min-width: 100px;
  font-size: 13px;
  line-height: 1.5em;
  border-style: solid;
  border-width: 1px;
  border-color: transparent;
  border-radius: 5px;
  padding: 0.5em 0.8em;
  background: rgba(0,0,0,0.8);
  color: #fff;
  pointer-events: none; /* This prevents the box from appearing when hovered. */
  transition: all 250ms;
}

.lightHover::after {
  content: attr(data-info);
  display: block;
  text-align: center;
  position: absolute;
  opacity: 0;
  min-width: 100px;
  font-size: 14px;
  border-style: solid;
  border-width: 1px;
  border-color: #ccc;
  background: rgba(255,255,255,0.9);
  color: #595959;
  pointer-events: none; /* This prevents the box from appearing when hovered. */
  transition: all 250ms;
}
.lightHover::after { top: 55px; left: 0px; right: 3px; }
.lightHover.over::after { bottom: 25px; top:auto; } 


.underHover::after { top: 65px; left: -35px; right: -35px; }
.underHover.small::after { top: 65px; left: 0px; right: 0px; }
.underHover.large::after { top: 65px; left: -80px; right: -80px; }

.leftHover::after { top: 3px; right: 37px; } .leftHover.xl::after { padding: 0.2em 0em; left: -230px; }
.leftHover.far::after { top: 3px; right: 65px; }
.rightHover::after { top: 1px; left: 37px; } .rightHover.xl::after { padding: 0.2em 0em; right: -230px; }
.rightHover.far::after { top: 3px; left: 65px; }

.overHover::after { bottom: 65px; left: -35px; right: -35px; }
.overHover.small::after { bottom: 65px; left: 0px; right: 0px; }
.overHover.large::after { bottom: 65px; left: -80px; right: -80px; }
.leftOverHover::after { bottom: 65px; left: 5px; }
.leftOverHover.large::after { bottom: 65px; left: 5px; right: -80px; }
.rightOverHover::after { bottom: 65px; right: 5px; }
.rightOverHover.large::after { left: -80px; }
.rightOverHover.xl::after { left: -120px; }
.leftUnderHover::after { top: 65px; left: 5px; }
.leftUnderHover.large::after { top: 65px; left: 5px; right: -80px;}
.leftUnderHover.xl::after { top: 65px; left: 5px; right: -120px;}
.leftUnderHover.xxl::after { top: 65px; left: 5px; right: -160px;}
.rightUnderHover::after { top: 65px; right: 5px; }
.rightUnderHover.large::after { left: -80px; }
.rightUnderHover.xl::after { left: -120px;}
.rightUnderHover.xxl::after { left: -160px;}
.rightUnderHover.match::after { left: 0px; }
.infoHover::after { top: -2px; padding: 0.2em 0.5em; right: 40px; }
.largeHover::after { top: -30px; left: 0px; right: 0px; }
.largeUnderHover::after { bottom: 30px; left: 0px; right: 0px }

.leftUnderHover.low::after, 
.rightUnderHover.low::after { top: 85px; }

.underHover::before,
.leftHover::before,
.rightHover::before,
.overHover::before,
.leftOverHover::before,
.rightOverHover::before,
.leftUnderHover::before,
.rightUnderHover::before,
.infoHover::before,
.largeHover::before,
.largeUnderHover::before {
  content: '';
  display: block;
  position: absolute;
  opacity: 0;
  width: 0; height: 0;
  border: solid transparent 5px;
  transition: all 250ms;
}

.underHover::before { top: 55px; left: 40%; border-bottom-color: rgba(0,0,0,0.8); }
.leftHover::before { top: 8px; right: 27px; border-left-color: rgba(0,0,0,0.8); } .leftHover.far::before { top: 10px; right: 55px; }
.rightHover::before { top: 8px; left: 27px; border-right-color: rgba(0,0,0,0.8); } .rightHover.far::before { top: 10px; left: 55px; }
.overHover::before { bottom: 55px; left: 40%; border-top-color: rgba(0,0,0,0.8); }
.leftOverHover::before { bottom: 55px; left: 10px; border-top-color: rgba(0,0,0,0.8); }
.rightOverHover::before { bottom: 55px; right: 10px; border-top-color: rgba(0,0,0,0.8); }
.leftUnderHover::before { top: 55px; left: 10px; border-bottom-color: rgba(0,0,0,0.8); }
.rightUnderHover::before { top: 55px; right: 10px; border-bottom-color: rgba(0,0,0,0.8); }
.infoHover::before { top: 5px; right: 20px; border-left-color: rgba(0,0,0,0.8); }
.largeHover::before { top: 5px; left: 40%; border-top-color: rgba(0,0,0,0.8); }
.largeUnderHover::before { top: 5px; left: 40%; border-bttom-color: rgba(0,0,0,0.8); }

.leftUnderHover.low::before, 
.rightUnderHover.low::before { top: 75px; }

.underHover:hover,
.leftHover:hover,
.rightHover:hover,
.overHover:hover,
.leftOverHover:hover,
.rightOverHover:hover,
.leftUnderHover:hover,
.rightUnderHover:hover,
.infoHover:hover,
.largeHover:hover,
.largeUnderHover:hover { z-index: 15; }

.lightHover:hover { z-index: 15; }

.underHover:hover::after,
.leftHover:hover::after,
.rightHover:hover::after,
.overHover:hover::after,
.leftOverHover:hover::after,
.rightOverHover:hover::after,
.leftUnderHover:hover::after,
.rightUnderHover:hover::after,
.infoHover:hover::after,
.largeHover:hover::after,
.largeUnderHover:hover::before,
.underHover:hover::before,
.leftHover:hover::before,
.rightHover:hover::before,
.overHover:hover::before,
.leftOverHover:hover::before,
.rightOverHover:hover::before,
.leftUnderHover:hover::before,
.rightUnderHover:hover::before,
.infoHover:hover::before,
.largeHover:hover::before,
.largeUnderHover:hover::before { 
	transition: all 250ms 1.5s; 
	opacity: 1; 
}

.lightHover:hover::after {
	transition: all 250ms 1s; 
	opacity: 1; 
}

.underHover.quick:hover::after,
.underHover.quick:hover::before {
	transition: all 250ms 0.4s; 
	opacity: 1; 
}

.underHover:hover::after { top: 35px; }
.leftHover:hover::after { right: 27px; } .leftHover.far:hover::after { right: 55px; }
.rightHover:hover::after { left: 27px; } .rightHover.far:hover::after { left: 55px; }
.overHover:hover::after { bottom: 35px; }
.leftOverHover:hover::after { bottom: 35px; }
.rightOverHover:hover::after { bottom: 35px; }
.leftUnderHover:hover::after { top: 35px; }
.rightUnderHover:hover::after { top: 35px; }
.infoHover:hover::after { right: 28px; }
.largeHover:hover::after { top: -38px; }
.largeUnderHover:hover::after { bottom: -38px; }

.leftUnderHover.low:hover::after, 
.rightUnderHover.low:hover::after { top: 55px; }

.underHover:hover::before { top: 25px; }
.leftHover:hover::before { right: 17px; } .leftHover.far:hover::before { right: 45px; }
.rightHover:hover::before { left: 17px; }  .rightHover.far:hover::before { left: 45px; }
.overHover:hover::before { bottom: 25px; }
.leftOverHover:hover::before { bottom: 25px; }
.rightOverHover:hover::before { bottom: 25px; }
.leftUnderHover:hover::before { top: 25px; }
.rightUnderHover:hover::before { top: 25px; }
.largeHover:hover::before { top: -5px; }
.largeUnderHover:hover:before { bottom: -5px; }
.infoHover:hover::before { right: 18px; }

.leftUnderHover.low:hover::before, 
.rightUnderHover.low:hover::before { top: 45px; }


.lightHover:hover::after { top: 25px; }
.lightHover.over:hover::after { bottom: -5px; top:auto; } 