* {
  -webkit-box-sizing:border-box;
  -moz-box-sizing:border-box;
  box-sizing:border-box;
  -moz-user-select:none;
  -webkit-user-select:none;
  -ms-user-select:none;
  user-select:none;
  -ms-text-size-adjust:none;
  -moz-text-size-adjust:none;
  -webkit-text-size-adjust:none;
  text-size-adjust:none;
  -webkit-user-drag:none;
  -webkit-touch-callout:none;
  -ms-content-zooming:none;
  -webkit-tap-highlight-color:rgba(0,0,0,0);
}

#pano {
  position:absolute;
  top:0;
  left:0;
  width:100%;
  height:100%;
  overflow:hidden;
}

#iframespot {
  position:relative;
  width:1600px;
  height:896px;
  z-index:1;
}

[data-source] {
  display:inline-block;
  cursor:pointer;
}

.post {
  display:block;
  font-size:22px;
  font-weight:bold;
  white-space:nowrap;
  text-decoration:none;
  color:#fff;
  padding:5px 15px;
  -webkit-border-radius:10px;
  border-radius:10px;
  border:2px solid #fff;
  background-color:rgba(0,0,0,0.9);
  text-transform:uppercase;
  -webkit-transition:box-shadow 0.3s ease-in-out;
  transition:box-shadow 0.3s ease-in-out;
  cursor:pointer;
  display:none;
  z-index:2;
}
.post.not_open {
  cursor:default;
}
.post:not(.not_open):hover {
  box-shadow:0 0 10px 1px #fff;
}

.post_mash {
  display:block;
  cursor:pointer;
  display:none;
}

.post_mash_sanculy {
  width:680px;
  height:440px;
}
.post_mash_hengapnhanvat {
  width:920px;
  height:440px;
}
.post_mash_batphithuong {
  width:780px;
  height:440px;
}
.post_mash_chinhphucsondoong {
  width:780px;
  height:540px;
}
.post_mash_butpha {
  width:740px;
  height:540px;
}
.post_mash_santhuongsieudam {
  width:740px;
  height:540px;
}
.post_mash_goikhoetronven {
  width:740px;
  height:440px;
}
.post_mash_goidocquyen {
  width:600px;
  height:540px;
}


.message {
  display:none;
}


/*Clock*/
.clock {
  position:relative;
  display:none;
  width:1540px;
  height:866px;
}

.flip-clock {
  text-align:center;
  -webkit-perspective:400px;
  perspective:400px;
  margin:20px auto;
}

.flip-clock *, .flip-clock *:before, .flip-clock *:after {
  box-sizing:border-box;
}

.flip-clock__piece {
  display:inline-block;
  margin:0 0.5rem;
}

.flip-clock__slot {
  font-size:5.6rem;
  color:#fff;
  text-transform:uppercase;
  text-shadow:1px 1px 2px rgb(236, 25, 123), 0 0 1em rgb(236, 25, 123), 0 0 0.2em rgb(236, 25, 123);
}

.card {
  display:block;
  position:relative;
  font-size:14rem;
  line-height:1;
}

.card__top, 
.card__bottom, 
.card__back::before, 
.card__back::after {
  display:block;
  width:1.5em;
  height:auto;
  color:#fff;
  text-shadow:1px 1px 2px rgb(236, 25, 123), 0 0 1em rgb(236, 25, 123), 0 0 0.2em rgb(236, 25, 123);
}

.card__bottom {
  color:#fff;
  position:absolute;
  top:50%;
  left:0;
  background:transparent;
  pointer-events:none;
  overflow:hidden;
}

.card__bottom::after {
  display:none;
}

.card__back::before, 
.card__bottom::after {
  content:attr(data-value);
}

.card__back {
  position:absolute;
  top:0;
  height:100%;
  left:0%;
  pointer-events:none;
}

.card__bottom,
.card__back,
.card__back::before {
  display:none;
}

.btn__home {
  position:absolute;
  left:10px;
  top:10px;
}


.viewControlButton {
  position:absolute;
  width:40px;
  height:40px;
  padding:5px;
  cursor:pointer;
}
.viewControlButton img {
  width:100%;
  height:auto;
}

.viewControlButton-1 {
  right:40px;
  top:0;
}
.viewControlButton-2 {
  right:40px;
  top:80px;
}
.viewControlButton-3 {
  right:80px;
  top:40px;
}
.viewControlButton-4 {
  right:0;
  top:40px;
}
#autorotateToggle {
  position:absolute;
  right:40px;
  top:40px;
  width:40px;
  height:40px;
  cursor:pointer;
}
#autorotateToggle img {
  position:absolute;
  left:5px;
  top:5px;
  width:30px;
  height:30px;
}

#autorotateToggle .icon.off {
  display: block;
}
#autorotateToggle .icon.on {
  display: none;
}
#autorotateToggle.enabled .icon.on {
  display: block;
}
#autorotateToggle.enabled .icon.off {
  display: none;
}

@media screen and (max-width:600px) {
  .post {
    font-size:42px;
  }

}