.hostpot-video {
  /* width: 78px;
  height: 90px;
  /*background: #f00;*/
  /* background: url(/core/css/img/video1.png) no-repeat 0px 0px; */

  width: 60px !important;
  height: 136px !important;
  /*background: #f00;*/
  background: url('/core/css/img/video_new.svg') no-repeat center center;
    background-size: 100%;
    -webkit-transition: background-size 250ms linear;
	-moz-transition: background-size 250ms linear;
	-o-transition: background-size 250ms linear
	-ms-transition: background-size 250ms linear;
	transition: background-size 250ms linear;

}

.hostpot-video:hover {
  cursor: pointer;
  /* background-position: 0 -90px; */ 

  background-size: 104%;
}

.hotspot-info {
  width: 60px;
  height: 136px;
  /*background: #f00;*/
  background: url('/core/css/img/info-2-01.svg') no-repeat center center;
    background-size: 100%;
    -webkit-transition: background-size 250ms linear;
	-moz-transition: background-size 250ms linear;
	-o-transition: background-size 250ms linear
	-ms-transition: background-size 250ms linear;
	transition: background-size 250ms linear;
}

.hotspot-info:hover {
  cursor:pointer;
    
    /* background-position: 0 -135px; */
    background-size: 104%;
}

.hotspot-lupa {
  width: 60px !important;
  height: 60px !important; 
  /*background: #f00;*/
  background: url(/core/css/img/look.png) no-repeat 0px 0px !important;

  

}

.hotspot-lupa:hover {
  cursor: pointer;
  background-position: 0 -60px !important;
}

.hostpot-video .video-container {
  /*visibility: hidden !important;*/
  display: none;
  position: absolute;
  border-radius: 3px;
  background-color: #fff;
  color: #000;
  text-align: center;
  width:70vw;
  max-width: 90vw;
  padding: 5px 10px;
  /* left: -150px;
  top: -250px; */
  bottom:150px;
  left: 50%;
  transform: translateX(-50%);
  cursor: default;
  box-shadow: 8px 15px 35px 14px rgba(0, 0, 0, 0.72);
  -webkit-box-shadow: 8px 15px 35px 14px rgba(0, 0, 0, 0.72);
  -moz-box-shadow: 8px 15px 35px 14px rgba(0, 0, 0, 0.72);
}

.hostpot-video .video-container .video-player{
  /* display:inline-block; */
  /* position:relative; */
  width:100%;
}

.info-container {
  display: none;
  position: absolute;
  border-radius: 3px;
  background-color: #fff;
  color: #000;
  /* text-align: center; */
  font-weight: normal;
  /* min-width:120px;
    max-width: 420px; */
  width: 20vw;
  padding: 5px 10px;
  left: 90px;
  top: -0px;
  cursor: default;
  box-shadow: 8px 15px 35px 14px rgba(0, 0, 0, 0.72);
  -webkit-box-shadow: 8px 15px 35px 14px rgba(0, 0, 0, 0.72);
  -moz-box-shadow: 8px 15px 35px 14px rgba(0, 0, 0, 0.72);
}