/*
  Author: https://1.envato.market/v96yv
*/

.cq-hotspot-container{
  position: relative;
  text-align: center;
  margin: 0 auto;
}
.hotspot-container{
  -webkit-transform: translateZ(0);
  -webkit-backface-visibility: hidden;
  left: 50%;
  -webkit-transform: translateX(-50%);
  -moz-transform: translateX(-50%);
  transform: translateX(-50%);
  position: relative;
  /*position: absolute;*/
  /*top: 0;*/
  /*left: 0;*/
  /*min-width: 120px;*/
  /*min-height: 120px;*/
  margin: 0;
  padding: 0;
}


.popover-image{
  position: relative;
  z-index: 1000;
  width: 100%;
}

/*.info-icon{
  display: block;
  opacity: 0;
  z-index: 1001;
}
*/

img.info-icon.focus, .info-icon:focus{
  outline: none;
  border: none;
}

.cq-hotspot-tooltip .cq-hotspot-tooltipcontent{
  display: none;
}
.cq-hotspot-tooltip{
  /*margin-left: 10px;*/
  /*margin-top: 0px;*/
  opacity: 0;
  display: none;
  position: absolute;
  display: inline-block;
  text-align: center;
  line-height: 100%;
  margin: 0;
  padding: 0;
  border: none;
  cursor: pointer;
  z-index: 1003;
  background-color: transparent;
  border-radius: 50%;
  text-decoration: none;
  border-bottom: none;
  -webkit-print-color-adjust: exact !important;
}
.cq-hotspot-tooltip:hover{
  text-decoration: none;
}
.cq-hotspot-tooltip:focus{
  outline: none;
  border: none;
}


.cq-hotspot-tooltip.cq-pulse-white {
  opacity: 1;
  -webkit-animation: cq-pulse-white 2s ease-out infinite;
  -moz-animation: cq-pulse-white 2s ease-out infinite;
  animation: cq-pulse-white 2s ease-out infinite;
}
.cq-hotspot-tooltip.cq-pulse-white {
  opacity: 1;
  -webkit-animation: cq-pulse-white 2s ease-out infinite;
  -moz-animation: cq-pulse-white 2s ease-out infinite;
  animation: cq-pulse-white 2s ease-out infinite;
}
.cq-hotspot-tooltip.cq-pulse-gray {
  opacity: 1;
  -webkit-animation: cq-pulse-gray 2s ease-out infinite;
  -moz-animation: cq-pulse-gray 2s ease-out infinite;
  animation: cq-pulse-gray 2s ease-out infinite;
}
.cq-hotspot-tooltip.cq-pulse-red {
  opacity: 1;
  -webkit-animation: cq-pulse-red 2s ease-out infinite;
  -moz-animation: cq-pulse-red 2s ease-out infinite;
  animation: cq-pulse-red 2s ease-out infinite;
}
.cq-hotspot-tooltip.cq-pulse-green {
  opacity: 1;
  -webkit-animation: cq-pulse-green 2s ease-out infinite;
  -moz-animation: cq-pulse-green 2s ease-out infinite;
  animation: cq-pulse-green 2s ease-out infinite;
}
.cq-hotspot-tooltip.cq-pulse-blue {
  opacity: 1;
  -webkit-animation: cq-pulse-blue 2s ease-out infinite;
  -moz-animation: cq-pulse-blue 2s ease-out infinite;
  animation: cq-pulse-blue 2s ease-out infinite;
}
.cq-hotspot-tooltip.cq-pulse-yellow {
  opacity: 1;
  -webkit-animation: cq-pulse-yellow 2s ease-out infinite;
  -moz-animation: cq-pulse-yellow 2s ease-out infinite;
  animation: cq-pulse-yellow 2s ease-out infinite;
}
.cq-hotspot-tooltip.cq-pulse-purple {
  opacity: 1;
  -webkit-animation: cq-pulse-purple 2s ease-out infinite;
  -moz-animation: cq-pulse-purple 2s ease-out infinite;
  animation: cq-pulse-purple 2s ease-out infinite;
}




@-webkit-keyframes cq-pulse-white {
  0% { box-shadow: 0 0 0 0px rgba(255, 255, 255, 1); }
  50% { box-shadow: 0 0 0 8px rgba(255, 255, 255, 0); }
  100% { box-shadow: 0 0 0 0px rgba(255, 255, 255, 0); }
}

@-moz-keyframes cq-pulse-white {
  0% { box-shadow: 0 0 0 0px rgba(255, 215, 0, 1); }
  50% { box-shadow: 0 0 0 8px rgba(255, 215, 0, 0); }
  100% { box-shadow: 0 0 0 0px rgba(255, 215, 0, 0); }
}

@keyframes cq-pulse-white {
  0% { box-shadow: 0 0 0 0px rgba(255, 255, 255, 1); }
  50% { box-shadow: 0 0 0 8px rgba(255, 255, 255, 0); }
  100% { box-shadow: 0 0 0 0px rgba(255, 255, 255, 0); }
}

@-webkit-keyframes cq-pulse-red {
  0% { box-shadow: 0 0 0 0px rgba(255, 69, 0, 1); }
  50% { box-shadow: 0 0 0 8px rgba(255, 69, 0, 0); }
  100% { box-shadow: 0 0 0 0px rgba(255, 69, 0, 0); }
}
@-moz-keyframes cq-pulse-red {
  0% { box-shadow: 0 0 0 0px rgba(255, 69, 0, 1); }
  50% { box-shadow: 0 0 0 8px rgba(255, 69, 0, 0); }
  100% { box-shadow: 0 0 0 0px rgba(255, 69, 0, 0); }
}
@keyframes cq-pulse-red {
  0% { box-shadow: 0 0 0 0px rgba(255, 69, 0, 1); }
  50% { box-shadow: 0 0 0 8px rgba(255, 69, 0, 0); }
  100% { box-shadow: 0 0 0 0px rgba(255, 69, 0, 0); }
}

@-webkit-keyframes cq-pulse-green {
  0% { box-shadow: 0 0 0 0px rgba(50, 205, 50, 1); }
  50% { box-shadow: 0 0 0 8px rgba(50, 205, 50, 0); }
  100% { box-shadow: 0 0 0 0px rgba(50, 205, 50, 0); }
}
@-moz-keyframes cq-pulse-green {
  0% { box-shadow: 0 0 0 0px rgba(50, 205, 50, 1); }
  50% { box-shadow: 0 0 0 8px rgba(50, 205, 50, 0); }
  100% { box-shadow: 0 0 0 0px rgba(50, 205, 50, 0); }
}
@keyframes cq-pulse-green {
  0% { box-shadow: 0 0 0 0px rgba(50, 205, 50, 1); }
  50% { box-shadow: 0 0 0 8px rgba(50, 205, 50, 0); }
  100% { box-shadow: 0 0 0 0px rgba(50, 205, 50, 0); }
}


@-webkit-keyframes cq-pulse-yellow {
  0% { box-shadow: 0 0 0 0px rgba(255, 215, 0, 1); }
  50% { box-shadow: 0 0 0 8px rgba(255, 215, 0, 0); }
  100% { box-shadow: 0 0 0 0px rgba(255, 215, 0, 0); }
}
@-moz-keyframes cq-pulse-yellow {
  0% { box-shadow: 0 0 0 0px rgba(255, 215, 0, 1); }
  50% { box-shadow: 0 0 0 8px rgba(255, 215, 0, 0); }
  100% { box-shadow: 0 0 0 0px rgba(255, 215, 0, 0); }
}
@keyframes cq-pulse-yellow {
  0% { box-shadow: 0 0 0 0px rgba(255, 215, 0, 1); }
  50% { box-shadow: 0 0 0 8px rgba(255, 215, 0, 0); }
  100% { box-shadow: 0 0 0 0px rgba(255, 215, 0, 0); }
}

@-webkit-keyframes cq-pulse-gray {
  0% { box-shadow: 0 0 0 0px rgba(127, 127, 127, 1); }
  50% { box-shadow: 0 0 0 8px rgba(127, 127, 127, 0); }
  100% { box-shadow: 0 0 0 0px rgba(127, 127, 127, 0); }
}
@-moz-keyframes cq-pulse-gray {
  0% { box-shadow: 0 0 0 0px rgba(127, 127, 127, 1); }
  50% { box-shadow: 0 0 0 8px rgba(127, 127, 127, 0); }
  100% { box-shadow: 0 0 0 0px rgba(127, 127, 127, 0); }
}
@keyframes cq-pulse-gray {
  0% { box-shadow: 0 0 0 0px rgba(127, 127, 127, 1); }
  50% { box-shadow: 0 0 0 8px rgba(127, 127, 127, 0); }
  100% { box-shadow: 0 0 0 0px rgba(127, 127, 127, 0); }
}

@-webkit-keyframes cq-pulse-blue {
  0% { box-shadow: 0 0 0 0px rgba(0, 191, 255, 1); }
  50% { box-shadow: 0 0 0 8px rgba(0, 191, 255, 0); }
  100% { box-shadow: 0 0 0 0px rgba(0, 191, 255, 0); }
}
@-moz-keyframes cq-pulse-blue {
  0% { box-shadow: 0 0 0 0px rgba(0, 191, 255, 1); }
  50% { box-shadow: 0 0 0 8px rgba(0, 191, 255, 0); }
  100% { box-shadow: 0 0 0 0px rgba(0, 191, 255, 0); }
}
@keyframes cq-pulse-blue {
  0% { box-shadow: 0 0 0 0px rgba(0, 191, 255, 1); }
  50% { box-shadow: 0 0 0 8px rgba(0, 191, 255, 0); }
  100% { box-shadow: 0 0 0 0px rgba(0, 191, 255, 0); }
}

@-webkit-keyframes cq-pulse-purple {
  0% { box-shadow: 0 0 0 0px rgba(160, 32, 240, 1); }
  50% { box-shadow: 0 0 0 8px rgba(160, 32, 240, 0); }
  100% { box-shadow: 0 0 0 0px rgba(160, 32, 240, 0); }
}
@-moz-keyframes cq-pulse-purple {
  0% { box-shadow: 0 0 0 0px rgba(160, 32, 240, 1); }
  50% { box-shadow: 0 0 0 8px rgba(160, 32, 240, 0); }
  100% { box-shadow: 0 0 0 0px rgba(160, 32, 240, 0); }
}
@keyframes cq-pulse-purple {
  0% { box-shadow: 0 0 0 0px rgba(160, 32, 240, 1); }
  50% { box-shadow: 0 0 0 8px rgba(160, 32, 240, 0); }
  100% { box-shadow: 0 0 0 0px rgba(160, 32, 240, 0); }
}

.cq-hotspot-tooltip i.cq-hotspot-icon{
  display: inline-block;
  margin: 0;
  text-align: center;
  color: #DA4453;
  background-color: rgba(0,0,0,0.8);
  border-radius: 100%;
  width: 20px;
  height: 20px;
  line-height: 20px;
  font-size: 10px;
}
.cq-hotspot-icon-small i.cq-hotspot-icon{
  width: 20px;
  height: 20px;
  font-size: 10px;
  line-height: 20px;
}
.cq-hotspot-icon-medium i.cq-hotspot-icon{
  width: 32px;
  height: 32px;
  font-size: 16px;
  line-height: 32px;
}
.cq-hotspot-icon-large i.cq-hotspot-icon{
  width: 40px;
  height: 40px;
  font-size: 20px;
  line-height: 40px;
}

.cq-hotspot-tooltip i.cq-hotspot-numbericon{
  display: inline-block;
  margin: 0;
  padding: 4px;
  text-align: center;
  color: #DA4453;
  border-radius: 50%;
  font-style: normal;
  background-color: rgba(0,0,0,0.8);
  width: 32px;
  height: 32px;
  font-size: 16px;
  line-height: 32px;
}
.cq-hotspot-tooltip .cq-hotspot-number{
  display: inline-block;
  position: relative;
  top: 50%;
  -webkit-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  transform: translateY(-50%);
  margin: 0;
  padding: 0;
}

.cq-hotspot-label{
  visibility: hidden;
  opacity: 0;
  color: #FFF;
  width: auto;
  min-width: 60px;
  /*margin-left: -50%;*/
  left: 50%;
  -webkit-transform: translateX(-50%);
  -moz-transform: translateX(-50%);
  transform: translateX(-50%);
  margin-top: 4px;
  text-align: center;
  display: block;
  text-align: center;
  background: #999;
  background: rgba(0, 0, 0, 0.4);
  padding: 2px 2px 2px 2px;
  line-height: 24px;
  font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif;
  font-size: 11px;
  /*font-weight: bold;*/
  /*display: inline-block;*/
  position: absolute;
  /*top: -2000px;*/
  /*left: -2000px;*/
  z-index: 1001;
  border-radius: 4px;
}


.animatedelay {
  -webkit-animation-duration: 0.6s;
     -moz-animation-duration: 0.6s;
       -o-animation-duration: 0.6s;
          animation-duration: 0.6s;
     -webkit-animation-delay: 0.5s;
        -moz-animation-delay: 0.5s;
         -ms-animation-delay: 0.5s;
             animation-delay: 0.5s;

  -webkit-animation-fill-mode: both;
     -moz-animation-fill-mode: both;
       -o-animation-fill-mode: both;
          animation-fill-mode: both;
}

.hotspotanimate {
  -webkit-animation-duration: 0.6s;
     -moz-animation-duration: 0.6s;
       -o-animation-duration: 0.6s;
          animation-duration: 0.6s;

  -webkit-animation-fill-mode: both;
     -moz-animation-fill-mode: both;
       -o-animation-fill-mode: both;
          animation-fill-mode: both;


}


@-webkit-keyframes cardIntop {
  0% {
    -webkit-transform-origin: 50% 100% 0px;
      -webkit-transform: perspective(500px) rotateX(-90deg) scale(0.5, 0.5);
  }
  100% {
    -webkit-transform-origin: 50% 100% 0px;
      -webkit-transform: perspective(500px) rotateX(0deg) scale(1, 1);
      opacity: 1;
  }
}

@-moz-keyframes cardIntop {
  0% {
    -moz-transform-origin: 50% 100% 0px;
      -moz-transform: perspective(500px) rotateX(-90deg) scale(0.5, 0.5);
  }
  100% {
    -moz-transform-origin: 50% 100% 0px;
      -moz-transform: perspective(500px) rotateX(0deg) scale(1, 1);
      opacity: 1;
  }
}

@-o-keyframes cardIntop {
  0% {
    -o-transform-origin: 50% 100% 0px;
      -o-transform: perspective(500px) rotateX(-90deg) scale(0.5, 0.5);
  }
  100% {
    -o-transform-origin: 50% 100% 0px;
      -o-transform: perspective(500px) rotateX(0deg) scale(1, 1);
      opacity: 1;
  }
}

@keyframes cardIntop {
  0% {
    transform-origin: 50% 100% 0px;
      transform: perspective(500px) rotateX(-90deg) scale(0.5, 0.5);
  }
  100%
  {
    transform-origin: 50% 100% 0px;
      transform: perspective(500px) rotateX(0deg) scale(1, 1);
      opacity: 1;
  }
}

.cardIntop {
  -webkit-animation-name: cardIntop;
  -moz-animation-name: cardIntop;
  -o-animation-name: cardIntop;
  animation-name: cardIntop;
}

@-webkit-keyframes cardInbottom {
  0% {
    -webkit-transform-origin: 50% 0% 0px;
      -webkit-transform: perspective(500px) rotateX(90deg) scale(0.5, 0.5);
  }
  100% {
    -webkit-transform-origin: 50% 0% 0px;
      -webkit-transform: perspective(500px) rotateX(0deg) scale(1, 1);
      opacity: 1;
  }
}

@-moz-keyframes cardInbottom {
  0% {
    -moz-transform-origin: 50% 0% 0px;
      -moz-transform: perspective(500px) rotateX(90deg) scale(0.5, 0.5);
  }
  100% {
    -moz-transform-origin: 50% 0% 0px;
      -moz-transform: perspective(500px) rotateX(0deg) scale(1, 1);
      opacity: 1;
  }
}

@-o-keyframes cardInbottom {
  0% {
    -o-transform-origin: 50% 0% 0px;
      -o-transform: perspective(500px) rotateX(90deg) scale(0.5, 0.5);
  }
  100% {
    -o-transform-origin: 50% 0% 0px;
      -o-transform: perspective(500px) rotateX(0deg) scale(1, 1);
      opacity: 1;
  }
}

@keyframes cardInbottom {
  0% {
    transform-origin: 50% 0% 0px;
      transform: perspective(500px) rotateX(90deg) scale(0.5, 0.5);
  }
  100%
  {
    transform-origin: 50% 0% 0px;
      transform: perspective(500px) rotateX(0deg) scale(1, 1);
      opacity: 1;
  }
}

.cardInbottom {
  -webkit-animation-name: cardInbottom;
  -moz-animation-name: cardInbottom;
  -o-animation-name: cardInbottom;
  animation-name: cardInbottom;
}


@-webkit-keyframes cardInleft {
  0% {
    -webkit-transform-origin: 100% 50% 0px;
      -webkit-transform: perspective(500px) rotateY(-90deg) scale(0, 0);
  }
  100% {
    -webkit-transform-origin: 100% 50% 0px;
      -webkit-transform: perspective(500px) rotateY(0deg) scale(1, 1);
      opacity: 1;
  }
}

@-moz-keyframes cardInleft {
  0% {
    -moz-transform-origin: 100% 50% 0px;
      -moz-transform: perspective(500px) rotateY(-90deg) scale(0, 0);
  }
  100% {
    -moz-transform-origin: 100% 50% 0px;
      -moz-transform: perspective(500px) rotateY(0deg) scale(1, 1);
      opacity: 1;
  }
}

@-o-keyframes cardInleft {
  0% {
    -o-transform-origin: 100% 50% 0px;
      -o-transform: perspective(500px) rotateY(-90deg) scale(0, 0);
  }
  100% {
    -o-transform-origin: 100% 50% 0px;
      -o-transform: perspective(500px) rotateY(0deg) scale(1, 1);
      opacity: 1;
  }
}

@keyframes cardInleft {
  0% {
    transform-origin: 100% 50% 0px;
      transform: perspective(500px) rotateY(-90deg) scale(0, 0);
  }
  100%
  {
    transform-origin: 100% 50% 0px;
      transform: perspective(500px) rotateY(0deg) scale(1, 1);
      opacity: 1;
  }
}

.cardInleft {
  -webkit-animation-name: cardInleft;
  -moz-animation-name: cardInleft;
  -o-animation-name: cardInleft;
  animation-name: cardInleft;
}

@-webkit-keyframes cardInright {
  0% {
    -webkit-transform-origin: 0% 50% 0px;
      -webkit-transform: perspective(500px) rotateY(90deg) scale(0, 0);
  }
  100% {
    -webkit-transform-origin: 0% 50% 0px;
      -webkit-transform: perspective(500px) rotateY(0deg) scale(1, 1);
      opacity: 1;
  }
}

@-moz-keyframes cardInright {
  0% {
    -moz-transform-origin: 0% 50% 0px;
      -moz-transform: perspective(500px) rotateY(90deg) scale(0, 0);
  }
  100% {
    -moz-transform-origin: 0% 50% 0px;
      -moz-transform: perspective(500px) rotateY(0deg) scale(1, 1);
      opacity: 1;
  }
}

@-o-keyframes cardInright {
  0% {
    -o-transform-origin: 0% 50% 0px;
      -o-transform: perspective(500px) rotateY(90deg) scale(0, 0);
  }
  100% {
    -o-transform-origin: 0% 50% 0px;
      -o-transform: perspective(500px) rotateY(0deg) scale(1, 1);
      opacity: 1;
  }
}

@keyframes cardInright {
  0% {
    transform-origin: 0% 50% 0px;
      transform: perspective(500px) rotateY(90deg) scale(0, 0);
  }
  100%
  {
    transform-origin: 0% 50% 0px;
      transform: perspective(500px) rotateY(0deg) scale(1, 1);
      opacity: 1;
  }
}

.cardInright {
  -webkit-animation-name: cardInright;
  -moz-animation-name: cardInright;
  -o-animation-name: cardInright;
  animation-name: cardInright;
}


@-webkit-keyframes cardOuttop {
  0% {
    -webkit-transform-origin: 50% 100% 0px;
      -webkit-transform: perspective(500px) rotateX(0deg) scale(1, 1);
      opacity: 1;
  }
  100% {
    -webkit-transform-origin: 50% 100% 0px;
      -webkit-transform: perspective(500px) rotateX(-90deg) scale(0.5, 0.5);
      opacity: 0;
  }
}

@-moz-keyframes cardOuttop {
  0% {
    -moz-transform-origin: 50% 100% 0px;
      -moz-transform: perspective(500px) rotateX(0deg) scale(1, 1);
      opacity: 1;
  }
  100% {
    -moz-transform-origin: 50% 100% 0px;
      -moz-transform: perspective(500px) rotateX(-90deg) scale(0.5, 0.5);
      opacity: 0;
  }
}

@-o-keyframes cardOuttop {
  0% {
    -o-transform-origin: 50% 100% 0px;
      -o-transform: perspective(500px) rotateX(0deg) scale(1, 1);
      opacity: 1;
  }
  100% {
    -o-transform-origin: 50% 100% 0px;
      -o-transform: perspective(500px) rotateX(-90deg) scale(0.5, 0.5);
      opacity: 0;
  }
}

@keyframes cardOuttop {
  0% {
    transform-origin: 50% 100% 0px;
      transform: perspective(500px) rotateX(0deg) scale(1, 1);
      opacity: 1;
  }
  100%
  {
    transform-origin: 50% 100% 0px;
      transform: perspective(500px) rotateX(-90deg) scale(0.5, 0.5);
      opacity: 0;
  }
}

.cardOuttop {
  -webkit-animation-name: cardOuttop;
  -moz-animation-name: cardOuttop;
  -o-animation-name: cardOuttop;
  animation-name: cardOuttop;
}

@-webkit-keyframes cardOutbottom {
  0% {
    -webkit-transform-origin: 50% 0% 0px;
      -webkit-transform: perspective(500px) rotateX(0deg) scale(1, 1);
      opacity: 1;
  }
  100% {
    -webkit-transform-origin: 50% 0% 0px;
      -webkit-transform: perspective(500px) rotateX(90deg) scale(0.5, 0.5);
      opacity: 0;
  }
}

@-moz-keyframes cardOutbottom {
  0% {
    -moz-transform-origin: 50% 0% 0px;
      -moz-transform: perspective(500px) rotateX(0deg) scale(1, 1);
      opacity: 1;
  }
  100% {
    -moz-transform-origin: 50% 0% 0px;
      -moz-transform: perspective(500px) rotateX(90deg) scale(0.5, 0.5);
      opacity: 0;
  }
}

@-o-keyframes cardOutbottom {
  0% {
    -o-transform-origin: 50% 0% 0px;
      -o-transform: perspective(500px) rotateX(0deg) scale(1, 1);
      opacity: 1;
  }
  100% {
    -o-transform-origin: 50% 0% 0px;
      -o-transform: perspective(500px) rotateX(90deg) scale(0.5, 0.5);
      opacity: 0;
  }
}

@keyframes cardOutbottom {
  0% {
    transform-origin: 50% 0% 0px;
      transform: perspective(500px) rotateX(0deg) scale(1, 1);
      opacity: 1;
  }
  100%
  {
    transform-origin: 50% 0% 0px;
      transform: perspective(500px) rotateX(90deg) scale(0.5, 0.5);
      opacity: 0;
  }
}

.cardOutbottom {
  -webkit-animation-name: cardOutbottom;
  -moz-animation-name: cardOutbottom;
  -o-animation-name: cardOutbottom;
  animation-name: cardOutbottom;
}

@-webkit-keyframes cardOutleft {
  0% {
    -webkit-transform-origin: 100% 50% 0px;
      -webkit-transform: perspective(500px) rotateY(0deg) scale(1, 1);
      opacity: 1;
  }
  100% {
    -webkit-transform-origin: 100% 50% 0px;
      -webkit-transform: perspective(500px) rotateY(90deg) scale(0, 0);
      opacity: 0;
  }
}

@-moz-keyframes cardOutleft {
  0% {
    -moz-transform-origin: 100% 50% 0px;
      -moz-transform: perspective(500px) rotateY(0deg) scale(1, 1);
      opacity: 1;
  }
  100% {
    -moz-transform-origin: 100% 50% 0px;
      -moz-transform: perspective(500px) rotateY(90deg) scale(0, 0);
      opacity: 0;
  }
}

@-o-keyframes cardOutleft {
  0% {
    -o-transform-origin: 100% 50% 0px;
      -o-transform: perspective(500px) rotateY(0deg) scale(1, 1);
      opacity: 1;
  }
  100% {
    -o-transform-origin: 100% 50% 0px;
      -o-transform: perspective(500px) rotateY(90deg) scale(0, 0);
      opacity: 0;
  }
}

@keyframes cardOutleft {
  0% {
    transform-origin: 100% 50% 0px;
      transform: perspective(500px) rotateY(0deg) scale(1, 1);
      opacity: 1;
  }
  100%
  {
    transform-origin: 100% 50% 0px;
      transform: perspective(500px) rotateY(90deg) scale(0, 0);
      opacity: 0;
  }
}

.cardOutleft {
  -webkit-animation-name: cardOutleft;
  -moz-animation-name: cardOutleft;
  -o-animation-name: cardOutleft;
  animation-name: cardOutleft;
}


@-webkit-keyframes cardOutright {
  0% {
    -webkit-transform-origin: 0% 50% 0px;
      -webkit-transform: perspective(500px) rotateY(0deg) scale(1, 1);
      opacity: 1;
  }
  100% {
    -webkit-transform-origin: 0% 50% 0px;
      -webkit-transform: perspective(500px) rotateY(-90deg) scale(0, 0);
      opacity: 0;
  }
}

@-moz-keyframes cardOutright {
  0% {
      -moz-transform-origin: 0% 50% 0px;
      -moz-transform: perspective(500px) rotateY(0deg) scale(1, 1);
      opacity: 1;
  }
  100% {
      -moz-transform-origin: 0% 50% 0px;
      -moz-transform: perspective(500px) rotateY(-90deg) scale(0, 0);
      opacity: 0;
  }
}

@-o-keyframes cardOutright {
  0% {
      -o-transform-origin: 0% 50% 0px;
      -o-transform: perspective(500px) rotateY(0deg) scale(1, 1);
      opacity: 1;
  }
  100% {
      -o-transform-origin: 0% 50% 0px;
      -o-transform: perspective(500px) rotateY(-90deg) scale(0, 0);
      opacity: 0;
  }
}

@keyframes cardOutright {
  0% {
    transform-origin: 0% 50% 0px;
      transform: perspective(500px) rotateY(0deg) scale(1, 1);
      opacity: 1;
  }
  100%
  {
    transform-origin: 0% 50% 0px;
      transform: perspective(500px) rotateY(-90deg) scale(0, 0);
      opacity: 0;
  }
}


.cardOutright {
  -webkit-animation-name: cardOutright;
  -moz-animation-name: cardOutright;
  -o-animation-name: cardOutright;
  animation-name: cardOutright;
}


@-webkit-keyframes cq-dropInDown {
  0% {
    opacity: 0;
    -webkit-transform: translateY(-2000px);
  }

  60% {
    -webkit-transform: translateY(30px);
  }

  80% {
    -webkit-transform: translateY(-10px);
  }

  100% {
    opacity: 1;
    -webkit-transform: translateY(0);
  }
}

@-moz-keyframes cq-dropInDown {
  0% {
    opacity: 0;
    -moz-transform: translateY(-2000px);
  }

  60% {
    -moz-transform: translateY(30px);
  }

  80% {
    -moz-transform: translateY(-10px);
  }

  100% {
    opacity: 1;
    -moz-transform: translateY(0);
  }
}

@-o-keyframes cq-dropInDown {
  0% {
    opacity: 0;
    -o-transform: translateY(-2000px);
  }

  60% {
    -o-transform: translateY(30px);
  }

  80% {
    -o-transform: translateY(-10px);
  }

  100% {
    opacity: 1;
    -o-transform: translateY(0);
  }
}

@keyframes cq-dropInDown {
  0% {
    opacity: 0;
    transform: translateY(-2000px);
  }

  60% {
    transform: translateY(30px);
  }

  80% {
    transform: translateY(-10px);
  }

  100% {
    opacity: 1;
    transform: translateY(0);
  }
}

.cq-dropInDown {
  -webkit-animation-name: cq-dropInDown;
  -moz-animation-name: cq-dropInDown;
  -o-animation-name: cq-dropInDown;
  animation-name: cq-dropInDown;
}


.dropin0{
  -webkit-animation-duration: .6s;
  -webkit-animation-delay: 0s;
  -webkit-animation-timing-function: ease;
  -webkit-animation-fill-mode: both;
  -moz-animation-duration: .6s;
  -moz-animation-delay: 0s;
  -moz-animation-timing-function: ease;
  -moz-animation-fill-mode: both;
  -ms-animation-duration: .6s;
  -ms-animation-delay: 0s;
  -ms-animation-timing-function: ease;
  -ms-animation-fill-mode: both;
  animation-duration: .6s;
  animation-delay: 0s;
  animation-timing-function: ease;
  animation-fill-mode: both;
}

.dropin1{
    -webkit-animation-duration: .6s;
  -webkit-animation-delay: .2s;
  -webkit-animation-timing-function: ease;
  -webkit-animation-fill-mode: both;
  -moz-animation-duration: .6s;
  -moz-animation-delay: .2s;
  -moz-animation-timing-function: ease;
  -moz-animation-fill-mode: both;
  -ms-animation-duration: .6s;
  -ms-animation-delay: .2s;
  -ms-animation-timing-function: ease;
  -ms-animation-fill-mode: both;
  animation-duration: .6s;
  animation-delay: .2s;
  animation-timing-function: ease;
  animation-fill-mode: both;
}

.dropin2{
    -webkit-animation-duration: .6s;
  -webkit-animation-delay: .4s;
  -webkit-animation-timing-function: ease;
  -webkit-animation-fill-mode: both;
  -moz-animation-duration: .6s;
  -moz-animation-delay: .4s;
  -moz-animation-timing-function: ease;
  -moz-animation-fill-mode: both;
  -ms-animation-duration: .6s;
  -ms-animation-delay: .4s;
  -ms-animation-timing-function: ease;
  -ms-animation-fill-mode: both;
  animation-duration: .6s;
  animation-delay: .4s;
  animation-timing-function: ease;
  animation-fill-mode: both;
}

.dropin3{
    -webkit-animation-duration: .6s;
  -webkit-animation-delay: .6s;
  -webkit-animation-timing-function: ease;
  -webkit-animation-fill-mode: both;
  -moz-animation-duration: .6s;
  -moz-animation-delay: .6s;
  -moz-animation-timing-function: ease;
  -moz-animation-fill-mode: both;
  -ms-animation-duration: .6s;
  -ms-animation-delay: .6s;
  -ms-animation-timing-function: ease;
  -ms-animation-fill-mode: both;
  animation-duration: .6s;
  animation-delay: .6s;
  animation-timing-function: ease;
  animation-fill-mode: both;
}

.dropin4{
    -webkit-animation-duration: .6s;
  -webkit-animation-delay: .8s;
  -webkit-animation-timing-function: ease;
  -webkit-animation-fill-mode: both;
  -moz-animation-duration: .6s;
  -moz-animation-delay: .8s;
  -moz-animation-timing-function: ease;
  -moz-animation-fill-mode: both;
  -ms-animation-duration: .6s;
  -ms-animation-delay: .8s;
  -ms-animation-timing-function: ease;
  -ms-animation-fill-mode: both;
  animation-duration: .6s;
  animation-delay: .8s;
  animation-timing-function: ease;
  animation-fill-mode: both;
}


.dropin5{
  -webkit-animation-duration: .6s;
  -webkit-animation-delay: 1s;
  -webkit-animation-timing-function: ease;
  -webkit-animation-fill-mode: both;
  -moz-animation-duration: .6s;
  -moz-animation-delay: 1s;
  -moz-animation-timing-function: ease;
  -moz-animation-fill-mode: both;
  -ms-animation-duration: .6s;
  -ms-animation-delay: 1s;
  -ms-animation-timing-function: ease;
  -ms-animation-fill-mode: both;
  animation-duration: .6s;
  animation-delay: 1s;
  animation-timing-function: ease;
  animation-fill-mode: both;
}
.dropin6{
    -webkit-animation-duration: .6s;
  -webkit-animation-delay: 1.2s;
  -webkit-animation-timing-function: ease;
  -webkit-animation-fill-mode: both;
  -moz-animation-duration: .6s;
  -moz-animation-delay: 1.2s;
  -moz-animation-timing-function: ease;
  -moz-animation-fill-mode: both;
  -ms-animation-duration: .6s;
  -ms-animation-delay: 1.2s;
  -ms-animation-timing-function: ease;
  -ms-animation-fill-mode: both;
  animation-duration: .6s;
  animation-delay: 1.2s;
  animation-timing-function: ease;
  animation-fill-mode: both;
}
.dropin7{
    -webkit-animation-duration: .6s;
  -webkit-animation-delay: 1.4s;
  -webkit-animation-timing-function: ease;
  -webkit-animation-fill-mode: both;
  -moz-animation-duration: .6s;
  -moz-animation-delay: 1.4s;
  -moz-animation-timing-function: ease;
  -moz-animation-fill-mode: both;
  -ms-animation-duration: .6s;
  -ms-animation-delay: 1.4s;
  -ms-animation-timing-function: ease;
  -ms-animation-fill-mode: both;
  animation-duration: .6s;
  animation-delay: 1.4s;
  animation-timing-function: ease;
  animation-fill-mode: both;
}
.dropin8{
    -webkit-animation-duration: .6s;
  -webkit-animation-delay: 1.6s;
  -webkit-animation-timing-function: ease;
  -webkit-animation-fill-mode: both;
  -moz-animation-duration: .6s;
  -moz-animation-delay: 1.6s;
  -moz-animation-timing-function: ease;
  -ms-animation-duration: .6s;
  -ms-animation-delay: 1.6s;
  -ms-animation-timing-function: ease;
  -ms-animation-fill-mode: both;
  animation-duration: .6s;
  animation-delay: 1.6s;
  animation-timing-function: ease;
  animation-fill-mode: both;
}
.dropin9{
    -webkit-animation-duration: .6s;
  -webkit-animation-delay: 1.8s;
  -webkit-animation-timing-function: ease;
  -webkit-animation-fill-mode: both;
  -moz-animation-duration: .6s;
  -moz-animation-delay: 1.8s;
  -moz-animation-timing-function: ease;
  -ms-animation-duration: .6s;
  -ms-animation-delay: 1.8s;
  -ms-animation-timing-function: ease;
  -ms-animation-fill-mode: both;
  animation-duration: .6s;
  animation-delay: 1.8s;
  animation-timing-function: ease;
  animation-fill-mode: both;
}

.dropin10{
    -webkit-animation-duration: .6s;
  -webkit-animation-delay: 2s;
  -webkit-animation-timing-function: ease;
  -webkit-animation-fill-mode: both;
  -moz-animation-duration: .6s;
  -moz-animation-delay: 2s;
  -moz-animation-timing-function: ease;
  -ms-animation-duration: .6s;
  -ms-animation-delay: 2s;
  -ms-animation-timing-function: ease;
  -ms-animation-fill-mode: both;
  animation-duration: .6s;
  animation-delay: 2s;
  animation-timing-function: ease;
  animation-fill-mode: both;
}
.dropin11{
    -webkit-animation-duration: .6s;
  -webkit-animation-delay: 2.2s;
  -webkit-animation-timing-function: ease;
  -webkit-animation-fill-mode: both;
  -moz-animation-duration: .6s;
  -moz-animation-delay: 2.2s;
  -moz-animation-timing-function: ease;
  -ms-animation-duration: .6s;
  -ms-animation-delay: 2.2s;
  -ms-animation-timing-function: ease;
  -ms-animation-fill-mode: both;
  animation-duration: .6s;
  animation-delay: 2.2s;
  animation-timing-function: ease;
  animation-fill-mode: both;
}
.dropin12{
    -webkit-animation-duration: .6s;
  -webkit-animation-delay: 2.4s;
  -webkit-animation-timing-function: ease;
  -webkit-animation-fill-mode: both;
  -moz-animation-duration: .6s;
  -moz-animation-delay: 2.4s;
  -moz-animation-timing-function: ease;
  -ms-animation-duration: .6s;
  -ms-animation-delay: 2.4s;
  -ms-animation-timing-function: ease;
  -ms-animation-fill-mode: both;
  animation-duration: .6s;
  animation-delay: 2.4s;
  animation-timing-function: ease;
  animation-fill-mode: both;
}

.dropin13{
    -webkit-animation-duration: .6s;
  -webkit-animation-delay: 2.6s;
  -webkit-animation-timing-function: ease;
  -webkit-animation-fill-mode: both;
  -moz-animation-duration: .6s;
  -moz-animation-delay: 2.6s;
  -moz-animation-timing-function: ease;
  -ms-animation-duration: .6s;
  -ms-animation-delay: 2.6s;
  -ms-animation-timing-function: ease;
  -ms-animation-fill-mode: both;
  animation-duration: .6s;
  animation-delay: 2.6s;
  animation-timing-function: ease;
  animation-fill-mode: both;
}

.dropin14{
    -webkit-animation-duration: .6s;
  -webkit-animation-delay: 2.8s;
  -webkit-animation-timing-function: ease;
  -webkit-animation-fill-mode: both;
  -moz-animation-duration: .6s;
  -moz-animation-delay: 2.8s;
  -moz-animation-timing-function: ease;
  -ms-animation-duration: .6s;
  -ms-animation-delay: 2.8s;
  -ms-animation-timing-function: ease;
  -ms-animation-fill-mode: both;
  animation-duration: .6s;
  animation-delay: 2.8s;
  animation-timing-function: ease;
  animation-fill-mode: both;
}


.dropin15{
    -webkit-animation-duration: .6s;
  -webkit-animation-delay: 3s;
  -webkit-animation-timing-function: ease;
  -webkit-animation-fill-mode: both;
  -moz-animation-duration: .6s;
  -moz-animation-delay: 3s;
  -moz-animation-timing-function: ease;
  -ms-animation-duration: .6s;
  -ms-animation-delay: 3s;
  -ms-animation-timing-function: ease;
  -ms-animation-fill-mode: both;
  animation-duration: .6s;
  animation-delay: 3s;
  animation-timing-function: ease;
  animation-fill-mode: both;
}



@-webkit-keyframes cq-hotspot-pulsate {
  0% {
    -webkit-transform: rotateX(-64deg) scale(0.1, 0.1);
    transform: rotateX(-64deg) scale(0.1, 0.1);
    opacity: 0;
  }

  50% {
    opacity: 1;
  }

  100% {
    -webkit-transform: rotateX(-64deg) scale(1.2, 1.2);
    transform: rotateX(-64deg) scale(1.2, 1.2);
    opacity: 0;
  }
}


@keyframes cq-hotspot-pulsate {
  0% {
    -webkit-transform: rotateX(-64deg) scale(0.1, 0.1);
    -ms-transform: rotateX(-64deg) scale(0.1, 0.1);
    transform: rotateX(-64deg) scale(0.1, 0.1);
    opacity: 0;
  }

  50% {
    -webkit-transform: rotateX(-64deg) scale(1, 1);
    -ms-transform: rotateX(-64deg) scale(1, 1);
    transform: rotateX(-64deg) scale(1, 1);
    opacity: 1;
  }

  100% {
    -webkit-transform: rotateX(-64deg) scale(1.2, 1.2);
    -ms-transform: rotateX(-64deg) scale(1.2, 1.2);
    transform: rotateX(-64deg) scale(1.2, 1.2);
    opacity: 0;
  }
}


@media screen and (min-width: 480px) and (max-width: 767px) {
  .cq-hotspot-container .cq-hotspot-tooltip{
    margin: 4px 0 0 4px;
    width: 20px;
    height: 20px;
    line-height: 20px;
  }
  .cq-hotspot-container .cq-hotspot-tooltip i.cq-hotspot-icon {
    width: 20px;
    height: 20px;
    line-height: 20px;
    font-size: 10px;
  }
  .cq-hotspot-container .cq-hotspot-tooltip i.cq-hotspot-numbericon{
    width: 20px;
    height: 20px;
    line-height: 20px;
    font-size: 10px;
    /*margin: 4px 0 0 4px;*/
    /*line-height: 16px;*/
  }


}