*{
  margin:0;
  padding:0;
  box-sizing:border-box;
}
html,body{
  width:100%;
  height:100%;
}
body{
  text-align: center;
  background-color:#000;
  overflow: hidden;
}

#home {
  background-image: url('../img/ht-fondo.jpg');
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center;
}

::selection{
  background:#ffffff;
}
.mainSvg{
  height:100%;
  text-align: center;
  margin:0 auto;
}
.info{
  display:none;
}

.hidden {
  display:none!important;
}
.hover{
  cursor:pointer;
  fill:transparent;
  stroke:#FFF;
stroke-width:2px;
stroke-dasharray:2, 5;
opacity:1;
}
#HOVERS .st0{
  fill:transparent!important;
}
.hover:hover{
  stroke-dasharray:0!important;
}
.category{
display:none;
}
.categoryLink{
  cursor:pointer;
}
.categoryCharger{
  cursor:pointer;
}
.categoryPicker{
  cursor:pointer;
}
/*INDEX*/
.canvasContainer {
    -webkit-overflow-scrolling:touch;
    overflow: hidden;
    cursor:pointer;
    height:100%;
  }
.videoContainer{
  position: fixed; 
  z-index: -99!important;
}
.ytplayer-container{
position:absolute;
top:0;
z-index:-99!important;
}

.timeContainer{
  position:fixed;
  bottom:0;
  left:0;
  z-index:4444;
  width:100%;
  height:18px;
}
.timeContainer iframe{
  position:absolute;
  bottom:0;
  right:0;
  width:100%;
  height:18px;
}

.svgContainer{
  width:100%!important;
  position:fixed;
  background: transparent url(../img/bg_pattern_2.png) repeat top left;
  z-index:-60;
  text-align:center;
  display:flex;
  height:100%;

}
#intro{
  display:none;
  
  width:100%;
}

/*INDIVIDUAL IMAGES*/
.imageZoom{
  cursor:pointer;
}
.imageContainer{
  position:fixed;
  top:0;
  left:0;
  width:100%;
  height:100%;
  display:none;
}
.imageContainer img{
  height:75%;
  position:absolute;
  top:50%;
  left:0;
  right:0;
  margin:0 auto;
  transform:translateY(-50%);
}
#notInfo{
}
.pointer{
  cursor:pointer;
}

.backButton, .homeBackButton{
  font-family:'Arial';
  font-weight:light;
  line-height: 20px;
  font-size:.8rem;
  color:white;
  position:fixed;
  top:20px;
  left:20px;
  background-image:url("../img/previous.png");
  background-repeat:no-repeat;
  background-position:center left;
  background-size:20px;
  width:55px;
  height:20px;
  text-align:right;
  cursor:pointer
}

.copyright{
  position:absolute;
  bottom:10px;
  left:10px;
  color:white;
  font-family:'Arial';
  font-size:.6rem;
  text-align:left;
}
.enterButton{
  position:absolute;
  right:0;
  left:0;
  margin:0 auto;
  top:50%;
  transform:translateY(-50%);
  color:white;
  font-family:'Arial';
  font-size:1.1rem;
  z-index:40;
  display:none;

}
.enterButton img, .enterButton a, .enterButton .arrowgroup{
display:inline;

}
.enterButton a{
  margin-top:4px;
  text-decoration:none;
  color:white;
}

#mobile{
  color:white;
  font-family:'Arial';
  font-size:.7rem;
  display:none;
  position:absolute;
  right:0;
  left:0;
  margin:0 auto;
  top:50%;
  transform:translateY(-50%);
}
@media (max-width: 1200px){
  .videoContainer{
    display:none;
  }
  .patternContainer{
    display:none;
  }
  body{
    background-color:black;
  }

  #intro{
    width:80%;
    margin:0 auto;

  }
  .enterButton{
    font-size:.8rem;
  }
}
@media screen and (max-width:700px){
  .imageContainer img{
  height:50%;
}
}