/*!
  ImageLinks - jQuery Interactive Image
  @name imagelinks.css
  @description A jQuery plugin for creating an interactive image for news, posters, albums and etc
  @version 1.3.1
  @author Max Lawrence
  @site http://www.avirtum.com
  @copyright (c) 2016 Max Lawrence (http://www.avirtum.com)
*/
.force_z-index{
  z-index:3!important;
}
.imgl {
  display: inline-block;
  position: relative;
  width:100%;
}
.imgl .imgl-img {
  -webkit-animation: imagelinks-animation-trigger 0.001s;
  animation: imagelinks-animation-trigger 0.001s;
}
.imgl .imgl-img img{
  width:100%;
}
.imgl .imgl-view {
  font-family: sans-serif;
  font-style: normal;
  font-weight: normal;
  letter-spacing: normal;
  line-height: 1.2;
  line-break: auto;
  text-align: left;
  text-align: start;
  text-decoration: none;
  text-shadow: none;
  text-transform: none;
  white-space: normal;
  word-break: normal;
  word-spacing: normal;
  word-wrap: normal;
  position: absolute;
  outline: none;
}
.imgl .imgl-view embed,
.imgl .imgl-view iframe,
.imgl .imgl-view object,
.imgl .imgl-view video {
  margin: 0;
}
.imgl .imgl-view .imgl-hotspots {
  position: relative;
  width: 100%;
  height: 100%;
}
.imgl .imgl-view .imgl-hotspots .imgl-hotspot-custom {
  position: absolute;
  z-index: 2;
}
.imgl .imgl-view .imgl-hotspots .imgl-hotspot {
  position: absolute;
  top: 0;
  left: 0;
  cursor: pointer;
  z-index: 2;
}
.imgl .imgl-view .imgl-popover {
  opacity: 0;
  visibility: hidden;
  -webkit-transition: opacity 0.3s;
  transition: opacity 0.3s;
  position: absolute;
  top: 0px;
  left: -99999px;
  z-index: 2;
}
.imgl .imgl-view .imgl-popover.imgl-active {
  opacity: 1;
  visibility: visible;
}
.imgl .imgl-view .imgl-popover.imgl-trans {
  -webkit-transition: opacity .3s, left .3s, top .3s;
  transition: opacity .3s, left .3s, top .3s;
}
.imgl .imgl-view.imgl-hotspot-setup {
  cursor: crosshair;
}
.imgl .imgl-view.imgl-default .imgl-hotspots .imgl-hotspot {
  -webkit-animation: imagelinks-hotspot-pulse 0.7s steps(7) infinite alternate;
  animation: imagelinks-hotspot-pulse 0.7s steps(7) infinite alternate;
  width: 48px;
  height: 48px;
  background-image: url('../img/cerchi.png');
}
.imgl .imgl-view.imgl-default .imgl-popover {
  font-family: sans-serif;
  font-style: normal;
  font-weight: normal;
  letter-spacing: normal;
  line-height: 1.2;
  line-break: auto;
  text-align: left;
  text-align: start;
  text-decoration: none;
  text-shadow: none;
  text-transform: none;
  white-space: normal;
  word-break: normal;
  word-spacing: normal;
  word-wrap: normal;
  max-width: 276px;
  background-color: #ffffff;
  border: 1px solid rgba(0, 0, 0, 0.2);
  border-radius: 6px;
  font-size: 14px;
}
.imgl .imgl-view.imgl-default .imgl-popover.imgl-close .imgl-close {
  -webkit-transition: opacity 0.3s;
  transition: opacity 0.3s;
  position: absolute;
  right: 0px;
  top: 0px;
  width: 16px;
  height: 16px;
  background-image: url('../img/close.svg');
  cursor: pointer;
  opacity: 0.4;
}
.imgl .imgl-view.imgl-default .imgl-popover.imgl-close .imgl-close:hover {
  opacity: 0.8;
}
.imgl .imgl-view.imgl-default .imgl-popover .imgl-content {
  padding: 10px;
}
.imgl .imgl-view.imgl-default .imgl-popover.imgl-close .imgl-content {
  padding: 15px;
}
.imgl .imgl-view.imgl-default .imgl-popover.imgl-popover-top {
  margin-top: -11px;
}
.imgl .imgl-view.imgl-default .imgl-popover.imgl-popover-right {
  margin-left: 11px;
}
.imgl .imgl-view.imgl-default .imgl-popover.imgl-popover-bottom {
  margin-top: 11px;
}
.imgl .imgl-view.imgl-default .imgl-popover.imgl-popover-left {
  margin-left: -11px;
}
.imgl .imgl-view.imgl-default .imgl-popover > .imgl-arrow,
.imgl .imgl-view.imgl-default .imgl-popover > .imgl-arrow:after {
  position: absolute;
  display: block;
  width: 0;
  height: 0;
  border-color: transparent;
  border-style: solid;
}
.imgl .imgl-view.imgl-default .imgl-popover > .imgl-arrow {
  border-width: 11px;
}
.imgl .imgl-view.imgl-default .imgl-popover > .imgl-arrow:after {
  content: "";
  border-width: 11px;
}
.imgl .imgl-view.imgl-default .imgl-popover.imgl-popover-top > .imgl-arrow {
  left: 50%;
  margin-left: -11px;
  border-bottom-width: 0;
  border-top-color: rgba(0, 0, 0, 0.2);
  bottom: -11px;
}
.imgl .imgl-view.imgl-default .imgl-popover.imgl-popover-top > .imgl-arrow:after {
  content: "";
  bottom: 1px;
  margin-left: -11px;
  border-bottom-width: 0;
  border-top-color: #ffffff;
}
.imgl .imgl-view.imgl-default .imgl-popover.imgl-popover-right > .imgl-arrow {
  top: 50%;
  left: -11px;
  margin-top: -11px;
  border-left-width: 0;
  border-right-color: rgba(0, 0, 0, 0.2);
}
.imgl .imgl-view.imgl-default .imgl-popover.imgl-popover-right > .imgl-arrow:after {
  content: "";
  left: 1px;
  bottom: -11px;
  border-left-width: 0;
  border-right-color: #ffffff;
}
.imgl .imgl-view.imgl-default .imgl-popover.imgl-popover-bottom > .imgl-arrow {
  left: 50%;
  margin-left: -11px;
  border-top-width: 0;
  border-bottom-color: rgba(0, 0, 0, 0.2);
  top: -11px;
}
.imgl .imgl-view.imgl-default .imgl-popover.imgl-popover-bottom > .imgl-arrow:after {
  content: "";
  top: 1px;
  margin-left: -11px;
  border-top-width: 0;
  border-bottom-color: #ffffff;
}
.imgl .imgl-view.imgl-default .imgl-popover.imgl-popover-left > .imgl-arrow {
  top: 50%;
  right: -11px;
  margin-top: -11px;
  border-right-width: 0;
  border-left-color: rgba(0, 0, 0, 0.2);
}
.imgl .imgl-view.imgl-default .imgl-popover.imgl-popover-left > .imgl-arrow:after {
  content: "";
  right: 1px;
  border-right-width: 0;
  border-left-color: #ffffff;
  bottom: -11px;
}
@-webkit-keyframes imagelinks-hotspot-pulse {
  0% {
    background-position: 0px;
  }
  100% {
    background-position: -336px;
  }
}
@keyframes imagelinks-hotspot-pulse {
  0% {
    background-position: 0px;
  }
  100% {
    background-position: -336px;
  }
}
@-webkit-keyframes imagelinks-animation-trigger {
  from {
    opacity: 0.99;
  }
  to {
    opacity: 1;
  }
}
@keyframes imagelinks-animation-trigger {
  from {
    opacity: 0.99;
  }
  to {
    opacity: 1;
  }
}
