@charset "UTF-8";
@font-face {
  font-family: "Noto Sans TC";
  font-style: normal;
  font-weight: 100;
  src: url(../../../cccframework/lib/fonts/nototc/NotoSansTC-Thin.woff2) format("woff2"), url(../../../cccframework/lib/fonts/nototc/NotoSansTC-Thin.woff) format("woff"), url(../../../cccframework/lib/fonts/nototc/NotoSansTC-Thin.otf) format("opentype");
}
@font-face {
  font-family: "Noto Sans TC";
  font-style: normal;
  font-weight: 300;
  src: url(../../../cccframework/lib/fonts/nototc/NotoSansTC-Light.woff2) format("woff2"), url(../../../cccframework/lib/fonts/nototc/NotoSansTC-Light.woff) format("woff"), url(../../../cccframework/lib/fonts/nototc/NotoSansTC-Light.otf) format("opentype");
}
@font-face {
  font-family: "Noto Sans TC";
  font-style: normal;
  font-weight: 400;
  src: url(../../../cccframework/lib/fonts/nototc/NotoSansTC-Regular.woff2) format("woff2"), url(../../../cccframework/lib/fonts/nototc/NotoSansTC-Regular.woff) format("woff"), url(../../../cccframework/lib/fonts/nototc/NotoSansTC-Regular.otf) format("opentype");
}
@font-face {
  font-family: "Noto Sans TC";
  font-style: normal;
  font-weight: 500;
  src: url(../../../cccframework/lib/fonts/nototc/NotoSansTC-Medium.woff2) format("woff2"), url(../../../cccframework/lib/fonts/nototc/NotoSansTC-Medium.woff) format("woff"), url(../../../cccframework/lib/fonts/nototc/NotoSansTC-Medium.otf) format("opentype");
}
@font-face {
  font-family: "Noto Sans TC";
  font-style: normal;
  font-weight: 700;
  src: url(../../../cccframework/lib/fonts/nototc/NotoSansTC-Bold.woff2) format("woff2"), url(../../../cccframework/lib/fonts/nototc/NotoSansTC-Bold.woff) format("woff"), url(../../../cccframework/lib/fonts/nototc/NotoSansTC-Bold.otf) format("opentype");
}
@font-face {
  font-family: "Noto Sans TC";
  font-style: normal;
  font-weight: 900;
  src: url(../../../cccframework/lib/fonts/nototc/NotoSansTC-Black.woff2) format("woff2"), url(../../../cccframework/lib/fonts/nototc/NotoSansTC-Black.woff) format("woff"), url(../../../cccframework/lib/fonts/nototc/NotoSansTC-Black.otf) format("opentype");
}
@font-face {
  font-family: "Heebo";
  src: url("font/Heebo-Bold.ttf");
  font-weight: bold;
}
@font-face {
  font-family: "Heebo";
  src: url("font/Heebo-Regular.ttf");
  font-weight: normal;
}
@font-face {
  font-family: "Anton";
  src: url("font/Anton-Regular.ttf");
}
@font-face {
  font-family: "DFHeiHK";
  src: url("font/DFHeiHK-W12.otf");
}
.dropdown-menu.inner::-webkit-scrollbar {
  -webkit-appearance: none;
}
.dropdown-menu.inner::-webkit-scrollbar:vertical {
  width: 11px;
}
.dropdown-menu.inner::-webkit-scrollbar:horizontal {
  height: 11px;
}
.dropdown-menu.inner::-webkit-scrollbar-thumb {
  border-radius: 8px;
  border: 2px solid white;
  /* should match background, can't be transparent */
  background-color: rgba(0, 0, 0, 0.5);
}

.blue-bg {
  background: #170ea4;
}

body.index {
  background: #170ea4;
}

.relative {
  position: relative;
}

.global-btn {
  cursor: pointer;
  background: #000;
  width: 180px;
  padding-top: 10px;
  padding-bottom: 10px;
  position: relative;
  text-align: center;
  color: #fff;
  font-weight: bold;
}

.loadingGif {
  position: fixed;
  height: 90px;
  width: 90px;
  display: block;
  border-width: 5px;
  border-style: solid;
  border-color: #1e8080 transparent transparent;
  border-radius: 50%;
  -webkit-box-sizing: content-box;
  -moz-box-sizing: content-box;
  box-sizing: content-box;
  -webkit-animation: spin 1s linear infinite;
  -moz-animation: spin 1s linear infinite;
  -ms-animation: spin 1s linear infinite;
  -o-animation: spin 1s linear infinite;
  animation: spin 1s linear infinite;
  top: 50%;
  left: 50%;
  margin-top: -45px;
  margin-left: -45px;
  z-index: 99999;
}

.loadingMask {
  position: fixed;
  width: 100%;
  height: 100%;
  z-index: 99998;
  opacity: 1;
  transition: all 0.5s;
  background: #fff;
}

.black-button {
  font-family: "Anton", "DFHeiHK", "Noto Sans TC";
  font-size: 24px;
  color: #fff;
  padding: 15px 30px;
  margin-top: 10px;
  margin-bottom: 10px;
  background: #172736;
}

.ifva-init-mask {
  width: 100%;
  height: 100vh;
  position: fixed;
  background: #12108e;
  z-index: 9999;
  -webkit-transition: 0.5s all;
  -moz-transition: 0.5s all;
  -ms-transition: 0.5s all;
  -o-transition: 0.5s all;
  transition: 0.5s all;
}
.ifva-init-mask.loaded {
  width: 0%;
  right: 0;
}
.index .ifva-init-mask {
  display: none;
}

.fixed-bg {
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
  height: 100vh;
  width: 100%;
  position: fixed;
  opacity: 0;
  z-index: -1;
}
.fixed-bg.bg-1 {
  background-image: url(../img/landing/mobile/1.jpg);
}
.fixed-bg.bg-1 {
  background-image: url("../img/landing/mobile/1.jpg");
}
.fixed-bg.bg-2 {
  background-image: url("../img/landing/mobile/2.jpg");
}
.fixed-bg.bg-3 {
  background-image: url("../img/landing/mobile/3.jpg");
}
.fixed-bg.bg-4 {
  background-image: url("../img/landing/mobile/4.jpg");
}
.fixed-bg.bg-5 {
  background-image: url("../img/landing/mobile/5.jpg");
}
.fixed-bg.bg-6 {
  background-image: url("../img/landing/mobile/6.jpg");
}
.fixed-bg.bg-7 {
  background-image: url("../img/landing/mobile/7.jpg");
}
.fixed-bg.bg-8 {
  background-image: url("../img/landing/mobile/8.jpg");
}

.mobile-landing-container {
  text-align: center;
  font-family: "Anton", "DFHeiHK", "Noto Sans TC";
  font-size: 25px;
  line-height: 45px;
  overflow-y: scroll;
  width: 100%;
  position: fixed;
  margin-top: 100px;
}
.is-touch .mobile-landing-container {
  overflow: hidden;
}
.mobile-landing-container .white-clip {
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
}
.mobile-landing-container .white-clip .mobile-landing {
  position: absolute;
  top: 0;
  width: 100%;
  color: #fff;
}
.mobile-landing-container .white-clip .mobile-landing a {
  color: #fff;
}

.landing-page .scroll-view {
  position: relative;
}
.landing-page .scroll-view .landing-bg {
  position: absolute;
}
.landing-page .scroll-view .landing-container {
  padding-top: 80px;
  padding-bottom: 80px;
}
@media only screen and (max-width: 767px) {
  .landing-page .scroll-view .landing-container {
    padding-top: 100px;
  }
}
.landing-page .news-view {
  background: #12108e;
  z-index: 0;
  position: relative;
  color: #fff;
}
.landing-page .news-view .top-image {
  position: absolute;
  right: 0;
  top: 0;
  width: 30%;
}
.landing-page .news-view .bottom-image {
  position: absolute;
  left: 0;
  bottom: 0;
  width: 30%;
}
.landing-page .news-view .news-container {
  padding-top: 120px;
  padding-bottom: 120px;
}
@media only screen and (max-width: 991px) {
  .landing-page .news-view .news-container {
    padding-top: 60px;
    padding-bottom: 60px;
  }
}
.landing-page .news-view .news-container .news-title {
  font-size: 82px;
  line-height: 101px;
  text-align: center;
  padding-bottom: 30px;
}
@media only screen and (max-width: 1475px) {
  .landing-page .news-view .news-container .news-title {
    font-size: 65px;
    line-height: 80px;
  }
}
@media only screen and (max-width: 1200px) {
  .landing-page .news-view .news-container .news-title {
    font-size: 45px;
    line-height: 55px;
  }
}
.landing-page .news-view .news-container .read-more {
  display: inline-block;
  width: auto;
  padding: 10px 20px;
  border: 1px white solid !important;
  color: #fff;
}
.landing-page .news-view .news-container .news-items .news-item {
  padding-bottom: 50px;
}
@media only screen and (max-width: 767px) {
  .landing-page .news-view .news-container .news-items .news-item {
    overflow: hidden;
  }
}
.landing-page .news-view .news-container .news-items .news-item .image {
  position: relative;
}
.landing-page .news-view .news-container .news-items .news-item .image .image-ball {
  pointer-events: none;
  position: absolute;
  bottom: -19%;
  left: -30%;
  z-index: -1;
  width: 100%;
}
.landing-page .news-view .news-container .news-items .news-item .image .image-ball img {
  width: 105%;
}
.landing-page .news-view .news-container .news-items .news-item .image .image-ball.right {
  bottom: -18%;
  left: 25%;
}
.landing-page .news-view .news-container .news-items .news-item .image-container {
  background-color: #fff;
  overflow: hidden;
  padding-top: 75%;
  -webkit-transition: all ease-in-out 0.3s;
  -moz-transition: all ease-in-out 0.3s;
  -ms-transition: all ease-in-out 0.3s;
  -o-transition: all ease-in-out 0.3s;
  transition: all ease-in-out 0.3s;
  position: relative;
  margin-bottom: 10px;
  box-shadow: 0 10px 16px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19) !important;
}
.landing-page .news-view .news-container .news-items .news-item .image-container:after {
  -webkit-transition: all ease-in-out 0.3s;
  -moz-transition: all ease-in-out 0.3s;
  -ms-transition: all ease-in-out 0.3s;
  -o-transition: all ease-in-out 0.3s;
  transition: all ease-in-out 0.3s;
  background-color: #1d1abb;
  mix-blend-mode: multiply;
  content: "";
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  transition: all ease-in-out 0.5s;
}
.ie .landing-page .news-view .news-container .news-items .news-item .image-container:after {
  display: none;
}
.landing-page .news-view .news-container .news-items .news-item .title {
  font-size: 28px;
  line-height: 35px;
  margin-top: 30px;
  font-weight: bold;
}
@media only screen and (max-width: 767px) {
  .landing-page .news-view .news-container .news-items .news-item .title {
    font-size: 20px;
  }
}
.landing-page .news-view .news-container .news-items .news-item .sub-title {
  margin-top: 30px;
}
.landing-page .news-view .news-container .news-items .news-item .date-container {
  margin-top: 50px;
  position: relative;
}
.landing-page .news-view .news-container .news-items .news-item .date-container .date-box {
  text-align: center;
  display: inline-block;
  background: #fff;
  color: #000;
  width: 55px;
  height: 55px;
  position: relative;
}
.landing-page .news-view .news-container .news-items .news-item .date-container .date-box .date {
  margin-top: 5px;
  font-weight: bold;
  font-size: 16px;
}
.landing-page .news-view .news-container .news-items .news-item .date-container .date-box .week {
  margin-top: -5px;
}
.landing-page .news-view .news-container .news-items .news-item .date-container .read-detail {
  position: absolute;
  bottom: 0px;
  right: 0;
  padding-right: 90px;
  color: #fff;
}
.landing-page .news-view .news-container .news-items .news-item .date-container .read-detail:after {
  content: "";
  width: 70px;
  height: 1px;
  background: #fff;
  position: absolute;
  top: 11px;
  opacity: 0.5;
  margin-left: 20px;
  -webkit-transition: 0.5s all;
  -moz-transition: 0.5s all;
  -ms-transition: 0.5s all;
  -o-transition: 0.5s all;
  transition: 0.5s all;
}
.landing-page .news-view .news-container .news-items .news-item .date-container .read-detail:before {
  content: "";
  width: 0px;
  height: 1px;
  background: #fff;
  position: absolute;
  top: 11px;
  left: 100%;
  margin-left: -70px;
  -webkit-transition: 0.5s all;
  -moz-transition: 0.5s all;
  -ms-transition: 0.5s all;
  -o-transition: 0.5s all;
  transition: 0.5s all;
}
.landing-page .news-view .news-container .news-items .news-item:hover .read-detail:before {
  width: 70px !important;
}
.landing-page .news-view .news-container .news-items .news-item:hover .image-container {
  background: inherit;
}
.landing-page .news-view .news-container .news-items .news-item:hover .image-container .cover-image {
  mix-blend-mode: inherit;
  -webkit-filter: none;
  filter: none;
}
.landing-page .news-view .news-container .news-items .news-item:hover .image-container:after {
  opacity: 0;
}
.landing-page .news-view .news-container .news-items .news-item:hover .image-container .glitch__img:nth-child(n+2) {
  opacity: 0;
}
.landing-page .news-view .news-container .news-items .news-item:hover .image-container .glitch__img:nth-child(n+2) {
  animation-duration: var(--time-anim);
  animation-delay: var(--delay-anim);
  animation-timing-function: linear;
  animation-iteration-count: infinite;
}
.landing-page .news-view .news-container .news-items .news-item:hover .image-container .glitch__img:nth-child(2) {
  background-color: var(--blend-color-2);
  background-blend-mode: var(--blend-mode-2);
  animation-name: glitch-anim-1;
}
.landing-page .news-view .news-container .news-items .news-item:hover .image-container .glitch__img:nth-child(3) {
  background-color: var(--blend-color-3);
  background-blend-mode: var(--blend-mode-3);
  animation-name: glitch-anim-2;
}
.landing-page .news-view .news-container .news-items .news-item:hover .image-container .glitch__img:nth-child(4) {
  background-color: var(--blend-color-4);
  background-blend-mode: var(--blend-mode-4);
  animation-name: glitch-anim-3;
}
.landing-page .news-view .news-container .news-items .news-item:hover .image-container .glitch__img:nth-child(5) {
  background-color: var(--blend-color-5);
  background-blend-mode: var(--blend-mode-5);
  animation-name: glitch-anim-flash;
}
.landing-page .news-view .news-container .news-items .news-item:nth-child(odd) .image {
  padding-right: 40px;
}
@media only screen and (max-width: 767px) {
  .landing-page .news-view .news-container .news-items .news-item:nth-child(odd) .image {
    padding-right: 15px;
  }
}
.landing-page .news-view .news-container .news-items .news-item:nth-child(odd) .content {
  padding-left: 40px;
}
@media only screen and (max-width: 767px) {
  .landing-page .news-view .news-container .news-items .news-item:nth-child(odd) .content {
    padding-left: 15px;
  }
}
.landing-page .news-view .news-container .news-items .news-item:nth-child(even) .image {
  padding-left: 40px;
  float: right;
}
@media only screen and (max-width: 767px) {
  .landing-page .news-view .news-container .news-items .news-item:nth-child(even) .image {
    padding-left: 15px;
  }
}
.landing-page .news-view .news-container .news-items .news-item:nth-child(even) .content {
  padding-right: 40px;
}
@media only screen and (max-width: 767px) {
  .landing-page .news-view .news-container .news-items .news-item:nth-child(even) .content {
    padding-right: 15px;
  }
}
.landing-page .event-view {
  background: #2f2d98;
  z-index: 0;
  position: relative;
}
.landing-page .event-view .event-container {
  padding-top: 120px;
  padding-bottom: 120px;
}
@media only screen and (max-width: 991px) {
  .landing-page .event-view .event-container {
    padding-top: 60px;
    padding-bottom: 60px;
  }
}
.landing-page .event-view .event-container .event-title {
  font-size: 82px;
  line-height: 101px;
  text-align: center;
  padding-bottom: 30px;
}
@media only screen and (max-width: 1475px) {
  .landing-page .event-view .event-container .event-title {
    font-size: 65px;
    line-height: 80px;
  }
}
@media only screen and (max-width: 1200px) {
  .landing-page .event-view .event-container .event-title {
    font-size: 45px;
    line-height: 55px;
  }
}
.landing-page .event-view .event-container .event-month {
  text-align: center;
}
.landing-page .event-view .event-container .event-month .month-item {
  opacity: 0.5;
  color: #fff;
  font-size: 24px;
  line-height: 32px;
  font-weight: bold;
  padding-left: 15px;
  padding-right: 15px;
  display: inline-block;
  cursor: pointer;
}
.landing-page .event-view .event-container .event-month .month-item.active {
  opacity: 1;
}
.landing-page .event-view .event-container .event-group {
  padding-top: 50px;
  padding-bottom: 50px;
  color: #fff;
  display: none;
}
.landing-page .event-view .event-container .event-group.active {
  display: block;
}
.landing-page .event-view .event-container .event-group .date-event {
  padding-top: 30px;
  padding-bottom: 30px;
}
.landing-page .event-view .event-container .event-group .date-event a {
  color: #fff;
}
.landing-page .event-view .event-container .event-group .date-event .event-item {
  display: none;
  margin-top: -1px;
  padding-top: 15px;
  padding-bottom: 15px;
  border-top: 1px rgba(255, 255, 255, 0.6) solid;
  border-bottom: 1px rgba(255, 255, 255, 0.6) solid;
}
.landing-page .event-view .event-container .event-group .date-event .event-item .time {
  font-weight: bold;
}
.landing-page .event-view .event-container .event-group .date-event .event-item.active {
  display: block;
}
.landing-page .event-view .event-container .event-group .date-select {
  text-align: center;
}
.landing-page .event-view .event-container .event-group .date-select .item {
  opacity: 0.5;
}
.landing-page .event-view .event-container .event-group .date-select .item.active {
  opacity: 1;
}
.landing-page .event-view .event-container .event-group .date-select .item .date {
  font-size: 42px;
  line-height: 50px;
  font-weight: bold;
}
.landing-page .event-view .event-container .event-group .date-select .item .week {
  font-weight: bold;
}
.landing-page .event-view .event-container .event-coming-soon {
  font-size: 24px;
  color: #FFF;
  text-align: center;
  margin-top: 30px;
}
@media only screen and (max-width: 767px) {
  .landing-page .event-view .event-container .event-coming-soon {
    font-size: 16px;
    margin-top: 0;
  }
}

.landing-page.whatson-page .news-view .news-container {
  margin-top: -80px;
  padding-top: 0;
}
@media only screen and (max-width: 767px) {
  .landing-page.whatson-page .news-view .news-container {
    margin-top: -10px;
  }
}
.landing-page.whatson-page .news-view .news-container .news-title {
  text-align: left;
  padding-bottom: 50px;
}

@media (min-width: 1600px) {
  .index .landing-bg .container {
    width: 1400px;
  }
}
@media (min-width: 1800px) {
  .index .landing-bg .container {
    width: 1600px;
  }
}
@media (min-width: 2000px) {
  .index .landing-bg .container {
    width: 1800px;
  }
}

.landing-bg {
  position: fixed;
  width: 100%;
  height: 100%;
  background-image: url(../img/landing/Style1/style1_blue@2x.png);
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
  -webkit-transition: 1s all;
  -moz-transition: 1s all;
  -ms-transition: 1s all;
  -o-transition: 1s all;
  transition: 1s all;
}
.landing-bg.default #flare-1 {
  opacity: 1;
}
.landing-bg.flare-1 {
  background-image: url(../img/landing/1/style1_blue@2x.png);
}
.landing-bg.flare-2 {
  background-image: url(../img/landing/2/IFVA_Festival@2x.png);
}
.landing-bg.flare-3 {
  background-image: url(../img/landing/3/style2_orange@2x.png);
}
.landing-bg.flare-4 {
  background-image: url(../img/landing/4/style3_green@2x.png);
}
.landing-bg.flare-5 {
  background-image: url(../img/landing/5/style4_pink@2x.png);
}
.landing-bg.flare-6 {
  background-image: url(../img/landing/6/style6_purple@2x.png);
}
.landing-bg.flare-7 {
  background-image: url(../img/landing/7/style3_green@2x.png);
}
.landing-bg.flare-8 {
  background-image: url(../img/landing/8/style7_tblue@2x.png);
}
.landing-bg #flare-1, .landing-bg #flare-2, .landing-bg #flare-3, .landing-bg #flare-4, .landing-bg #flare-5, .landing-bg #flare-6, .landing-bg #flare-7, .landing-bg #flare-8 {
  position: absolute;
  width: 100%;
  height: 100%;
  -webkit-transition: 1s all;
  -moz-transition: 1s all;
  -ms-transition: 1s all;
  -o-transition: 1s all;
  transition: 1s all;
}
@media only screen and (max-width: 767px) {
  .landing-bg #flare-1, .landing-bg #flare-2, .landing-bg #flare-3, .landing-bg #flare-4, .landing-bg #flare-5, .landing-bg #flare-6, .landing-bg #flare-7, .landing-bg #flare-8 {
    display: none;
  }
}

.enter-site {
  position: fixed;
  padding: 10px 30px;
  color: #fff;
  border: #fff 1px solid;
  border-radius: 40px;
  bottom: 30px;
  right: 30px;
  z-index: 50;
}

.about-us-btn {
  position: fixed;
  padding: 10px 30px;
  color: #fff;
  border: #fff 1px solid;
  border-radius: 40px;
  bottom: 100px;
  right: 30px;
  z-index: 50;
}

.landing-container {
  color: #fff;
  position: relative;
}
.landing-container .scroll-menu-1, .landing-container .scroll-menu-2 {
  position: relative;
}
.landing-container .scroll-menu-1 .menu-item, .landing-container .scroll-menu-2 .menu-item {
  font-family: "Anton", "DFHeiHK", "Noto Sans TC";
  font-size: 82px;
  line-height: 101px;
  padding-top: 5px;
  padding-bottom: 5px;
  cursor: pointer;
}
@media only screen and (max-width: 1475px) {
  .landing-container .scroll-menu-1 .menu-item, .landing-container .scroll-menu-2 .menu-item {
    font-size: 65px;
    line-height: 80px;
  }
}
@media only screen and (max-width: 1200px) {
  .landing-container .scroll-menu-1 .menu-item, .landing-container .scroll-menu-2 .menu-item {
    font-size: 45px;
    line-height: 55px;
  }
}
@media only screen and (max-width: 991px) {
  .landing-container .scroll-menu-1 .menu-item, .landing-container .scroll-menu-2 .menu-item {
    font-size: 32px;
    line-height: 42px;
  }
}
@media only screen and (max-width: 767px) {
  .landing-container .scroll-menu-1 .menu-item, .landing-container .scroll-menu-2 .menu-item {
    font-size: 25px;
    line-height: 40px;
  }
}
.landing-container .scroll-menu-1 a, .landing-container .scroll-menu-2 a {
  color: #fff;
}
@media only screen and (max-width: 1475px) {
  .landing-container .scroll-menu-1, .landing-container .scroll-menu-2 {
    padding-left: 150px;
    padding-right: 150px;
  }
}
@media only screen and (max-width: 767px) {
  .landing-container .scroll-menu-1, .landing-container .scroll-menu-2 {
    padding-left: 0px;
    padding-right: 0px;
  }
}
.landing-container .scroll-menu-1 .menu-item {
  color: transparent;
  -webkit-text-stroke: 0.5px white;
}
.ie .landing-container .scroll-menu-1 .menu-item {
  color: #2f2d98;
  opacity: 0.5;
  text-shadow: -1px -1px 0 white, 1px -1px 0 white, -1px 1px 0 white, 1px 1px 0 white;
}
.landing-container .container {
  -webkit-transition: all 0.5s;
  -moz-transition: all 0.5s;
  -ms-transition: all 0.5s;
  -o-transition: all 0.5s;
  transition: all 0.5s;
}
.landing-container.down .container {
  -webkit-transform: matrix3d(0.993569, -0.113226, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
  -moz-transform: matrix3d(0.993569, -0.113226, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
  -ms-transform: matrix3d(0.993569, -0.113226, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
  -o-transform: matrix3d(0.993569, -0.113226, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
  transform: matrix3d(0.993569, -0.113226, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
}
.landing-container.up .container {
  -webkit-transform: matrix3d(0.994525, 0.104494, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
  -moz-transform: matrix3d(0.994525, 0.104494, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
  -ms-transform: matrix3d(0.994525, 0.104494, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
  -o-transform: matrix3d(0.994525, 0.104494, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
  transform: matrix3d(0.994525, 0.104494, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
}
.landing-container .scroll-menu-2 {
  position: absolute;
  top: 0;
  z-index: 1;
  width: 100%;
}
@media only screen and (max-width: 767px) {
  .landing-container .scroll-menu-2 {
    width: calc(100vw - 30px);
  }
}
.landing-container .scroll-menu-2 .scroll-container {
  position: relative;
}
.landing-container .scroll-menu-2 .menu-item {
  font-family: "Anton", "DFHeiHK", "Noto Sans TC";
  width: 100%;
}
.landing-container .scroll-menu-2 .menu-item:hover > .item {
  width: 100%;
}
@media only screen and (max-width: 767px) {
  .landing-container .scroll-menu-2 .menu-item {
    width: calc(100vw - 30px);
  }
}
.landing-container .scroll-menu-2 .menu-item .item {
  width: 0;
  -webkit-transition: all 1s;
  -moz-transition: all 1s;
  -ms-transition: all 1s;
  -o-transition: all 1s;
  transition: all 1s;
  overflow: hidden;
}
.landing-container .scroll-menu-2 .menu-item .item .text {
  width: 1140px;
}
@media only screen and (max-width: 1475px) {
  .landing-container .scroll-menu-2 .menu-item .item .text {
    width: 840px;
  }
}
@media only screen and (max-width: 1200px) {
  .landing-container .scroll-menu-2 .menu-item .item .text {
    width: 640px;
  }
}
@media only screen and (max-width: 991px) {
  .landing-container .scroll-menu-2 .menu-item .item .text {
    width: 420px;
  }
}
@media only screen and (max-width: 767px) {
  .landing-container .scroll-menu-2 .menu-item .item .text {
    width: calc(100vw - 30px);
  }
}

.index .header-menu .menu-search, .index .header-menu .menu-btn, .index .header-menu .menu-love {
  display: none;
}
.index .header-menu .menu-lang {
  right: 30px;
}

.global-popup {
  position: fixed;
  display: none;
  background: rgba(0, 0, 0, 0.4);
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  z-index: 1000;
  overflow: auto;
}
.global-popup.active {
  display: block;
}
.global-popup.wishlist-popup .popup-content {
  -webkit-transform: translate(-50%);
  -moz-transform: translate(-50%);
  -ms-transform: translate(-50%);
  -o-transform: translate(-50%);
  transform: translate(-50%);
  top: 10%;
}
.global-popup.wishlist-popup .popup-content .wishlist-share-btn {
  margin-top: 20px;
  margin-left: auto;
  margin-right: auto;
  cursor: pointer;
  background: #000;
  width: 180px;
  padding-top: 10px;
  padding-bottom: 10px;
  position: relative;
  text-align: center;
  color: #fff;
  font-weight: bold;
}
.global-popup .popup-content {
  position: absolute;
  width: 70%;
  max-width: 1170px;
  left: 50%;
  top: 50%;
  -webkit-transform: translate(-50%, -50%);
  -moz-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  -o-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  background: #fff;
  border-radius: 15px;
  padding: 50px 90px;
}
@media only screen and (max-width: 767px) {
  .global-popup .popup-content {
    width: 90%;
    padding: 50px 30px;
  }
}
.global-popup .popup-content .close-btn {
  position: absolute;
  top: 50px;
  right: 90px;
  cursor: pointer;
  font-size: 32px;
}
@media only screen and (max-width: 767px) {
  .global-popup .popup-content .close-btn {
    right: 30px;
  }
}
.global-popup .popup-content .title {
  font-size: 24px;
  line-height: 32px;
  font-weight: bold;
  padding-bottom: 10px;
}
.global-popup .popup-content .sub-title {
  padding-bottom: 30px;
}
.global-popup .popup-content .image {
  position: relative;
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
  padding-top: 56.5%;
}
.global-popup .popup-content .share-btn-group-container {
  position: absolute;
  width: 50%;
  height: 100%;
  left: 50%;
}
@media only screen and (max-width: 991px) {
  .global-popup .popup-content .share-btn-group-container {
    position: relative;
    width: 100%;
    height: 100%;
    left: 0%;
  }
}
.global-popup .popup-content .share-btn-group-container .share-btn-group {
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
  -moz-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  -o-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
}
@media only screen and (max-width: 991px) {
  .global-popup .popup-content .share-btn-group-container .share-btn-group {
    position: relative;
    top: 0;
    left: 0;
    margin-top: 20px;
    -webkit-transform: none;
    -moz-transform: none;
    -ms-transform: none;
    -o-transform: none;
    transform: none;
    text-align: center;
  }
  .global-popup .popup-content .share-btn-group-container .share-btn-group .global-btn {
    display: inline-block;
    text-align: center;
    margin-left: 5px !important;
    margin-right: 5px !important;
  }
}
.global-popup .popup-content .share-btn-group-container .share-btn-group .global-btn {
  margin: auto;
}
.global-popup .popup-content .share-btn-group-container .share-btn-group .share-btn {
  margin-top: 40px;
}

.outline-text-black {
  font-family: "Anton", "DFHeiHK", "Noto Sans TC";
  color: transparent;
  -webkit-text-stroke: 0.5px black;
}
.ie .outline-text-black {
  color: #ccc;
  text-shadow: -1px -1px 0 black, 1px -1px 0 black, -1px 1px 0 black, 1px 1px 0 black;
}

.outline-text-white {
  font-family: "Anton", "DFHeiHK", "Noto Sans TC";
  color: transparent;
  -webkit-text-stroke: 0.5px white;
}
.ie .outline-text-white {
  color: #ccc;
  text-shadow: -1px -1px 0 white, 1px -1px 0 white, -1px 1px 0 white, 1px 1px 0 white;
}

.menu-theme-black .header-menu .menu-love, .menu-theme-black .header-menu .menu-btn {
  color: #000;
  border: #000 solid 1px;
}
.menu-theme-black .header-menu .menu-logo span, .menu-theme-black .header-menu .menu-lang .menu-items .menu-item {
  color: #000;
}
.menu-theme-black .ifva_award-menu .menu-items .menu-item, .menu-theme-black .ifva_festival-menu .menu-items .menu-item, .menu-theme-black .ifva_festival-menu .menu-items .menu-item {
  color: #000 !important;
}
.menu-theme-black .ifva_award-menu .menu-items .menu-item .text, .menu-theme-black .ifva_festival-menu .menu-items .menu-item .text, .menu-theme-black .ifva_festival-menu .menu-items .menu-item .text {
  color: #000 !important;
}
.menu-theme-black .ifva_award-menu .menu-items .menu-item .text a, .menu-theme-black .ifva_festival-menu .menu-items .menu-item .text a, .menu-theme-black .ifva_festival-menu .menu-items .menu-item .text a {
  color: #000 !important;
}
.menu-theme-black .footer-menu-nav .global {
  color: #000;
}
.menu-theme-black .footer-menu-nav .global a {
  color: #000;
}
.menu-theme-black .footer-menu-nav .global .sub-menu:before {
  background: #000 !important;
}
@media only screen and (max-width: 768px) {
  .menu-theme-black .footer-menu-nav .global .menu-item {
    border-top: solid 1px #000 !important;
    border-bottom: solid 1px #000 !important;
  }
}

.header-menu {
  position: fixed;
  width: 100%;
  height: 0;
  z-index: 100;
}
.header-menu.open {
  width: 100%;
  height: 100%;
  overflow: hidden;
}
.header-menu .menu-bar {
  height: 100%;
}
.header-menu .menu-love {
  position: absolute;
  width: 30px;
  height: 30px;
  border-radius: 100%;
  border: #fff solid 1px;
  right: 80px;
  top: 20px;
  cursor: pointer;
  color: #fff;
}
.header-menu .menu-love span {
  font-size: 34px;
  line-height: 28px;
  margin-left: -3px;
}
.header-menu .menu-btn {
  position: absolute;
  width: 30px;
  height: 30px;
  border-radius: 100%;
  border: #fff solid 1px;
  right: 30px;
  top: 20px;
  cursor: pointer;
  color: #fff;
}
.header-menu .menu-btn span {
  font-size: 20px;
  line-height: 28px;
  margin-left: 1px;
}
.header-menu .menu-logo {
  position: absolute;
  width: 30px;
  height: 30px;
  top: 20px;
  left: 30px;
  cursor: pointer;
}
@media only screen and (max-width: 767px) {
  .header-menu .menu-logo {
    left: 15px;
    top: 4px;
  }
  .header-menu .menu-logo img{
    width: 120px
  }
}
.header-menu .menu-logo span {
  color: #fff;
  font-size: 130px;
  line-height: 87px;
  margin-left: 1px;
}
@media only screen and (max-width: 767px) {
  .header-menu .menu-logo span {
    font-size: 90px;
    line-height: 52px;
  }
}
.header-menu .menu-search {
  display: none;
  position: absolute;
  width: 30px;
  height: 30px;
  border-radius: 100%;
  border: #fff solid 1px;
  right: 75px;
  top: 20px;
  cursor: pointer;
  color: #fff;
}
.header-menu .menu-search span {
  font-size: 20px;
  line-height: 28px;
  margin-left: 1px;
}
.header-menu .menu-lang {
  position: absolute;
  height: 30px;
  right: 131px;
  top: 24px;
  cursor: pointer;
  color: #fff;
}
.header-menu .menu-lang .menu-items .menu-item {
  color: #fff;
  display: inline-block;
  padding-left: 5px;
  padding-right: 5px;
}
.header-menu .menu-open-bg {
  position: absolute;
  width: 0;
  height: 0;
  border-radius: 100%;
  right: 30px;
  top: 20px;
  background: #12108e;
  -webkit-transition: all 1s;
  -moz-transition: all 1s;
  -ms-transition: all 1s;
  -o-transition: all 1s;
  transition: all 1s;
}
.header-menu .menu-open-bg.open {
  width: 10000px;
  height: 10000px;
  margin-right: -5000px;
  margin-top: -5000px;
}
.header-menu .menu-container {
  display: none;
  z-index: 10;
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
}
.header-menu .menu-container.open {
  display: block;
}
.header-menu .menu-container a {
  color: #fff;
}
@media only screen and (max-width: 991px) {
  .header-menu .menu-container .container {
    padding-left: 0;
    padding-right: 0;
  }
}
.header-menu .menu-container .container .menu-items {
  color: #fff;
  text-align: left;
  position: relative;
  height: 80%;
  margin-top: 10%;
  max-height: 80vh;
  overflow: hidden;
  overflow-y: auto;
}
@media only screen and (max-width: 991px) {
  .header-menu .menu-container .container .menu-items {
    position: relative;
    -webkit-transform: none;
    -moz-transform: none;
    -ms-transform: none;
    -o-transform: none;
    transform: none;
    margin-top: 100px;
    height: calc(100vh - 102px);
    overflow-y: scroll;
  }
}
.header-menu .menu-container .container .menu-items .left-menu {
  border-right: 2px rgba(255, 255, 255, 0.5) solid;
}
@media only screen and (max-width: 767px) {
  .header-menu .menu-container .container .menu-items .left-menu {
    border-right: none;
  }
}
.header-menu .menu-container .container .menu-items .right-menu {
  padding-left: 80px;
}
@media only screen and (max-width: 767px) {
  .header-menu .menu-container .container .menu-items .right-menu {
    padding-left: 15px;
  }
}
.header-menu .menu-container .container .menu-items .menu-item {
  padding-top: 10px;
  padding-bottom: 10px;
  font-size: 30px;
  line-height: 42px;
  opacity: 0.5;
  font-weight: bold;
  position: relative;
  -webkit-transition: all 0.5s;
  -moz-transition: all 0.5s;
  -ms-transition: all 0.5s;
  -o-transition: all 0.5s;
  transition: all 0.5s;
}
@media only screen and (max-width: 991px) {
  .header-menu .menu-container .container .menu-items .menu-item {
    padding-left: 15px;
    padding-right: 15px;
    font-size: 20px;
    line-height: 36px;
    position: relative;
  }
  .header-menu .menu-container .container .menu-items .menu-item:after {
    content: "";
    position: absolute;
    background: #fff;
    width: 100%;
    height: 1px;
    right: 0;
    top: 100%;
    opacity: 0.9;
    border-radius: 0%;
    background: #fff;
  }
  .header-menu .menu-container .container .menu-items .menu-item.has-sub .sub-menu {
    position: relative;
    left: 0;
    height: auto;
    display: none;
    padding-top: 0px;
  }
  .header-menu .menu-container .container .menu-items .menu-item.has-sub.open {
    opacity: 1;
  }
  .header-menu .menu-container .container .menu-items .menu-item.has-sub.open .sub-menu {
    height: inherit;
    display: block;
    width: 100%;
    padding-top: 13px;
  }
  .header-menu .menu-container .container .menu-items .menu-item.has-sub.open .sub-menu .sub-menu-item {
    margin-left: 0px;
  }
  .header-menu .menu-container .container .menu-items .menu-item.has-sub.open .sub-menu .sub-menu-item:first-child:before {
    display: none;
  }
  .header-menu .menu-container .container .menu-items .menu-item.has-sub.open:before {
    transform: rotate(180deg);
  }
  .header-menu .menu-container .container .menu-items .menu-item.has-sub:before {
    font-family: "ifva" !important;
    content: "";
    position: absolute;
    width: 25px;
    height: 32px;
    right: 20px;
    -webkit-transition: 0.5s all;
    -moz-transition: 0.5s all;
    -ms-transition: 0.5s all;
    -o-transition: 0.5s all;
    transition: 0.5s all;
  }
}
.header-menu .menu-container .container .menu-items .menu-item:hover, .header-menu .menu-container .container .menu-items .menu-item.active {
  opacity: 1;
}
.header-menu .menu-container .container .menu-items .menu-item:hover > .sub-menu {
  height: inherit;
}
.header-menu .menu-container .container .menu-items .menu-item .sub-menu {
  -webkit-transition: all 0.5s;
  -moz-transition: all 0.5s;
  -ms-transition: all 0.5s;
  -o-transition: all 0.5s;
  transition: all 0.5s;
  overflow: hidden;
  height: 0;
  position: relative;
}
@media only screen and (max-width: 767px) {
  .header-menu .menu-container .container .menu-items .menu-item .sub-menu {
    height: auto;
  }
}
.header-menu .menu-container .container .menu-items .menu-item .sub-menu:before {
  content: "";
  position: absolute;
  width: 2px;
  height: 100%;
  background: #fff;
  top: 0px;
  left: 0;
}
@media only screen and (max-width: 767px) {
  .header-menu .menu-container .container .menu-items .menu-item .sub-menu:before {
    display: none;
  }
}
.header-menu .menu-container .container .menu-items .menu-item .sub-menu .sub-menu-item {
  margin-left: 20px;
  padding-top: 10px;
  padding-bottom: 10px;
  font-size: 18px;
  line-height: 25px;
}
@media only screen and (max-width: 767px) {
  .header-menu .menu-container .container .menu-items .menu-item .sub-menu .sub-menu-item {
    margin-left: 0px;
  }
}
.header-menu .menu-container .menu-close-btn {
  position: absolute;
  width: 30px;
  height: 30px;
  border-radius: 100%;
  border: #fff solid 1px;
  right: 30px;
  top: 20px;
  cursor: pointer;
  z-index: 1;
  color: #fff;
}
.header-menu .menu-container .menu-close-btn span {
  font-size: 20px;
  line-height: 28px;
  margin-left: 1px;
}
.header-menu .menu-container .menu-open-lang {
  position: absolute;
  height: 30px;
  right: 71px;
  top: 24px;
  cursor: pointer;
  color: #fff;
}
.header-menu .menu-container .menu-open-lang .menu-items .menu-item {
  color: #fff;
  display: inline-block;
  padding-left: 5px;
  padding-right: 5px;
}
.header-menu .menu-container .menu-open-logo {
  position: absolute;
  width: 30px;
  height: 30px;
  top: 20px;
  left: 30px;
  cursor: pointer;
}
@media only screen and (max-width: 767px) {
  .header-menu .menu-container .menu-open-logo {
    left: 15px;
  }
}
.header-menu .menu-container .menu-open-logo span {
  color: #fff;
  font-size: 130px;
  line-height: 87px;
  margin-left: 1px;
}
@media only screen and (max-width: 767px) {
  .header-menu .menu-container .menu-open-logo span {
    font-size: 90px;
    line-height: 52px;
  }
}
.header-menu .menu-container .menu-open-search {
  display: none;
  position: absolute;
  width: 30px;
  height: 30px;
  border-radius: 100%;
  border: #fff solid 1px;
  right: 75px;
  top: 20px;
  cursor: pointer;
  color: #fff;
}
.header-menu .menu-container .menu-open-search span {
  font-size: 20px;
  line-height: 28px;
  margin-left: 1px;
}

.absolute-menu .header-menu {
  position: absolute;
}

.normal-theme .header-menu .menu-logo span {
  color: #333;
}
.normal-theme .header-menu .menu-lang .menu-items .menu-item {
  color: #333;
}
.normal-theme .header-menu .menu-btn, .normal-theme .header-menu .menu-love {
  border: #333 solid 1px;
  color: #333;
}

.news-theme .news-banner {
  padding-bottom: 115px;
}
.news-theme .outline-text-black {
  -webkit-text-stroke: 0.5px white;
}
.ie .news-theme .outline-text-black {
  color: #ccc;
  text-shadow: -1px -1px 0 white, 1px -1px 0 white, -1px 1px 0 white, 1px 1px 0 white;
}
.news-theme .page-container {
  background: #12108e;
  color: #fff !important;
}
.news-theme .page-container:first-child .page-content {
  padding-top: 0;
  padding-bottom: 0;
}
.news-theme .page-container:nth-child(2) .page-content {
  padding-top: 0;
}
.news-theme .page-container .page-content .forum-horizontal-line .horizontal-line {
  background: #fff;
}
.news-theme .news-title {
  padding-bottom: 50px;
}
.news-theme .date-box {
  text-align: center;
  display: inline-block;
  padding-left: 10px;
  padding-right: 10px;
  background: #fff;
  color: #000;
  float: left;
}
.news-theme .date-box .week {
  margin-top: -5px;
}
.news-theme .sub-title {
  margin-top: 12px;
  padding-left: 40px;
  float: left;
}

.ifva_award-theme .ifva_award-menu {
  background: #172736;
}
@media only screen and (max-width: 991px) {
  .ifva_award-theme .ifva_award-menu .background-image {
    padding-top: 0px;
  }
}
@media only screen and (max-width: 767px) {
  .ifva_award-theme .ifva_award-menu .background-image {
    padding-top: 20px;
  }
}
.ifva_award-theme .ifva_award-menu .menu-items {
  position: absolute;
  top: 180px;
}
@media only screen and (max-width: 767px) {
  .ifva_award-theme .ifva_award-menu .menu-items {
    position: relative;
    margin-top: 30px;
    margin-bottom: 30px;
    top: 0;
  }
}
.ifva_award-theme .ifva_award-menu .menu-items .menu-item > div {
  display: inline-block;
}
.ifva_award-theme .ifva_award-menu .menu-items .menu-item {
  color: #fff;
  font-size: 18px;
  line-height: 30px;
  padding-top: 5px;
  padding-bottom: 5px;
}
.ifva_award-theme .ifva_award-menu .menu-items .menu-item .text {
  color: #fff;
  padding-left: 30px;
  opacity: 0.5;
}
.ifva_award-theme .ifva_award-menu .menu-items .menu-item .text a {
  color: #fff;
}
.ifva_award-theme .ifva_award-menu .menu-items .menu-item.active .text, .ifva_award-theme .ifva_award-menu .menu-items .menu-item:hover .text {
  opacity: 1;
  font-weight: bold;
}

.ifva_festival-theme .ifva_festival-menu, .ifva_festival_award-theme .ifva_festival-menu {
  background: #000;
}
@media only screen and (max-width: 991px) {
  .ifva_festival-theme .ifva_festival-menu .background-image, .ifva_festival_award-theme .ifva_festival-menu .background-image {
    padding-top: 80px;
  }
}
@media only screen and (max-width: 767px) {
  .ifva_festival-theme .ifva_festival-menu .background-image, .ifva_festival_award-theme .ifva_festival-menu .background-image {
    padding-top: 20px;
  }
}
.ifva_festival-theme .ifva_festival-menu .menu-items, .ifva_festival_award-theme .ifva_festival-menu .menu-items {
  position: absolute;
  top: 180px;
}
@media only screen and (max-width: 767px) {
  .ifva_festival-theme .ifva_festival-menu .menu-items, .ifva_festival_award-theme .ifva_festival-menu .menu-items {
    position: relative;
    margin-top: 30px;
    margin-bottom: 30px;
    top: 0;
  }
}
.ifva_festival-theme .ifva_festival-menu .menu-items .menu-item > div, .ifva_festival_award-theme .ifva_festival-menu .menu-items .menu-item > div {
  display: inline-block;
}
.ifva_festival-theme .ifva_festival-menu .menu-items .menu-item, .ifva_festival_award-theme .ifva_festival-menu .menu-items .menu-item {
  color: #fff;
  font-size: 18px;
  line-height: 30px;
  padding-top: 5px;
  padding-bottom: 5px;
}
.ifva_festival-theme .ifva_festival-menu .menu-items .menu-item .text, .ifva_festival_award-theme .ifva_festival-menu .menu-items .menu-item .text {
  color: #fff;
  padding-left: 30px;
  opacity: 0.5;
}
.ifva_festival-theme .ifva_festival-menu .menu-items .menu-item .text a, .ifva_festival_award-theme .ifva_festival-menu .menu-items .menu-item .text a {
  color: #fff;
}
.ifva_festival-theme .ifva_festival-menu .menu-items .menu-item.active .text, .ifva_festival-theme .ifva_festival-menu .menu-items .menu-item:hover .text, .ifva_festival_award-theme .ifva_festival-menu .menu-items .menu-item.active .text, .ifva_festival_award-theme .ifva_festival-menu .menu-items .menu-item:hover .text {
  opacity: 1;
  font-weight: bold;
}

.menu-logo .cinema {
  display: none;
}

.cinema20-theme .ug-lightbox .ug-lightbox-overlay {
  background-color: rgba(0, 0, 0, 0.6) !important;
}
.cinema20-theme .ug-lightbox .ug-lightbox-top-panel {
  bottom: 0;
  top: initial !important;
}
.cinema20-theme .footer-menu-nav .footer-bottom {
  padding-top: 0;
}
.cinema20-theme .footer-menu-nav .footer-link .sub-links {
  padding-top: 15px;
  max-width: 300px;
}
@media only screen and (max-width: 767px) {
  .cinema20-theme .footer-menu-nav .footer-link .sub-links {
    padding-top: 0px;
  }
}
.cinema20-theme .footer-menu-nav .footer-link .sub-links .link {
  display: inline-block;
  margin-right: 20px;
  margin-bottom: 20px;
}
@media only screen and (max-width: 767px) {
  .cinema20-theme .footer-menu-nav .footer-link {
    padding-top: 15px;
    text-align: left !important;
    padding-right: 0px !important;
    padding-left: 0px !important;
  }
}
.cinema20-theme .footer-menu-nav a {
  color: black;
}
.cinema20-theme .footer-menu-nav .footer-sponsor {
  background: transparent;
}
.cinema20-theme .footer-menu-nav .footer-sponsor .sponsor-item .icon img {
  height: 34px;
}
.cinema20-theme .menu-logo .cinema {
  display: block;
}
.cinema20-theme .menu-logo .cinema img {
  height: 18px;
}
@media only screen and (max-width: 767px) {
  .cinema20-theme .menu-logo .cinema img {
    height: 12px;
  }
}
.cinema20-theme .menu-logo .global {
  display: none;
}
.cinema20-theme .cinema20-menu {
  position: relative;
  background: #000;
}
@media only screen and (max-width: 991px) {
  .cinema20-theme .cinema20-menu .background-image {
    padding-top: 80px;
  }
}
@media only screen and (max-width: 767px) {
  .cinema20-theme .cinema20-menu .background-image {
    position: absolute;
    bottom: 0;
    padding-top: 20px;
  }
}
.cinema20-theme .cinema20-menu .menu-items {
  position: absolute;
  top: 180px;
}
@media only screen and (max-width: 767px) {
  .cinema20-theme .cinema20-menu .menu-items {
    position: relative;
    margin-top: 30px;
    margin-bottom: 30px;
    top: 0;
  }
}
.cinema20-theme .cinema20-menu .menu-items .menu-item > div {
  display: inline-block;
}
.cinema20-theme .cinema20-menu .menu-items .menu-item {
  color: #fff;
  font-size: 18px;
  line-height: 30px;
  padding-top: 5px;
  padding-bottom: 5px;
}
.cinema20-theme .cinema20-menu .menu-items .menu-item .text {
  color: #fff;
  padding-left: 30px;
  opacity: 0.5;
}
.cinema20-theme .cinema20-menu .menu-items .menu-item .text a {
  color: #fff;
}
.cinema20-theme .cinema20-menu .menu-items .menu-item.active .text, .cinema20-theme .cinema20-menu .menu-items .menu-item:hover .text {
  opacity: 1;
  font-weight: bold;
}
.cinema20-theme .footer-menu-nav {
  background: #ddd;
  color: #000;
}
.cinema20-theme .footer-menu-nav .global {
  display: none;
}
.cinema20-theme .footer-menu-nav .cinema {
  display: block;
}
.cinema20-theme .cinema20-tpl-cover-list .cover-container {
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
  padding-top: 130%;
  position: relative;
  margin-bottom: 30px;
}
.cinema20-theme .cinema20-tpl-cover-list .cover-container.active .mask-content, .cinema20-theme .cinema20-tpl-cover-list .cover-container:hover .mask-content {
  opacity: 1;
}
@media only screen and (max-width: 767px) {
  .cinema20-theme .cinema20-tpl-cover-list .cover-container:hover .mask-content {
    opacity: 0;
  }
  .cinema20-theme .cinema20-tpl-cover-list .cover-container.active .mask-content {
    opacity: 1;
  }
}
.cinema20-theme .cinema20-tpl-cover-list .cover-container .mask-content {
  opacity: 0;
  position: absolute;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.8);
  top: 0;
  left: 0;
  color: #fff;
  padding: 20px;
  transition: all 0.5s;
}
.cinema20-theme .cinema20-tpl-cover-list .cover-container .mask-content.active, .cinema20-theme .cinema20-tpl-cover-list .cover-container .mask-content:hover {
  opacity: 1;
}
.cinema20-theme .cinema20-tpl-cover-list .cover-container .mask-content .year {
  font-size: 28px;
  line-height: 42px;
  font-weight: bold;
  padding-bottom: 20px;
}
.cinema20-theme .cinema20-tpl-full-list .list-title-container {
  position: relative;
}
.cinema20-theme .cinema20-tpl-full-list .list-title-container .cinema20-full-list-select {
  position: absolute;
  right: 0;
  top: 0;
}
@media only screen and (max-width: 767px) {
  .cinema20-theme .cinema20-tpl-full-list .list-title-container .cinema20-full-list-select {
    position: relative;
    margin-bottom: 20px;
  }
  .cinema20-theme .cinema20-tpl-full-list .list-title-container .cinema20-full-list-select .bootstrap-select {
    width: 100%;
  }
}
.cinema20-theme .cinema20-tpl-full-list .list-title {
  font-size: 60px;
  line-height: 75px;
  font-family: "Anton", "DFHeiHK", "Noto Sans TC";
  color: transparent;
  -webkit-text-stroke: 0.5px black;
  margin-bottom: 30px;
}
.cinema20-theme .cinema20-tpl-full-list .list-items .list-item {
  display: none;
}
.cinema20-theme .cinema20-tpl-full-list .list-items .list-item.active {
  display: block;
}
.cinema20-theme .cinema20-tpl-full-list .list-items .list-item .year {
  font-size: 60px;
  line-height: 75px;
  font-family: "Anton", "DFHeiHK", "Noto Sans TC";
  color: #000;
  margin-bottom: 10px;
}
.cinema20-theme .cinema20-tpl-full-list .list-items .list-item .main-image {
  position: relative;
  margin-bottom: 30px;
}
.cinema20-theme .cinema20-tpl-full-list .list-items .list-item .main-image:hover .caption {
  display: block;
}
.cinema20-theme .cinema20-tpl-full-list .list-items .list-item .main-image .caption {
  display: none;
  position: absolute;
  bottom: 0;
  width: 100%;
  background: #e0e7ea;
  padding: 5px 10px;
}
.cinema20-theme .cinema20-tpl-full-list .list-items .list-item .ug-thumb-overlay {
  display: none !important;
}
.cinema20-theme .cinema20-tpl-full-list .list-items .list-item .gallery-list .description {
  padding-bottom: 30px;
}
.cinema20-theme .cinema20-tpl-full-list .list-items .list-item .gallery {
  padding-bottom: 30px;
}
.cinema20-theme .cinema20-tpl-full-list .list-items .list-item .gallery .ug-thumb-wrapper:hover .gallery-img-caption {
  display: block;
}
.cinema20-theme .cinema20-tpl-full-list .list-items .list-item .gallery .ug-thumb-wrapper .gallery-img-caption {
  display: none;
  position: absolute;
  bottom: 0;
  width: 100%;
  background: rgba(189, 189, 189, 0.8);
  padding: 5px 10px;
}
@media only screen and (max-width: 767px) {
  .cinema20-theme .cinema20-tpl-full-list .list-items .list-item .gallery .ug-thumb-wrapper .gallery-img-caption {
    height: 33px;
    overflow: hidden;
  }
}

.event-highlight .category-tab {
  margin-bottom: 30px;
}
.event-highlight .category-tab .menu-item {
  display: inline-block;
  margin-right: -4px;
  margin-top: 5px;
  margin-bottom: 5px;
  padding: 0 10px;
  cursor: pointer;
}
.event-highlight .category-tab .menu-item.active {
  font-weight: bold;
}
.event-highlight .category-tab .menu-item:first-child {
  padding-left: 0;
}
.event-highlight .category-tab .menu-item:not(:last-child) {
  border-right: 1px solid #000;
}
.event-highlight .media-container {
  display: none;
}
.event-highlight .media-container.active {
  display: block;
}
.event-highlight .media-container .media-item {
  cursor: pointer;
  margin-bottom: 30px;
}
.event-highlight .media-container .media-item .image-box {
  overflow: hidden;
}
.event-highlight .media-container .media-item .image {
  width: 100%;
  padding-top: 75%;
  background-position: 50% 50%;
  -webkit-background-size: cover;
  background-size: cover;
  background-repeat: no-repeat;
  -webkit-transform: scale(1);
  -ms-transform: scale(1);
  -moz-transition: scale(1);
  -o-transition: scale(1);
  transform: scale(1);
  -webkit-transition: all 0.2s ease-in-out;
  -o-transition: all 0.2s ease-in-out;
  -moz-transition: all 0.2s ease-in-out;
  -ms-transition: all 0.2s ease-in-out;
  transition: all 0.2s ease-in-out;
}
.event-highlight .media-container .media-item:hover .image {
  transform: scale(1.08);
}
.event-highlight .media-container .media-item .title {
  padding-top: 5px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.event-highlight .media-container .media-item .date {
  padding-top: 5px;
  color: #aaa;
}
.event-highlight .all-album .album-item {
  display: none;
}
.event-highlight .all-album .album-item.active {
  display: block;
}
.event-highlight .all-album .album-item .title {
  font-size: 30px;
  line-height: 33px;
  color: #000;
}
.event-highlight .all-album .album-item .date {
  color: #aaa;
}
.event-highlight .all-album .album-item .description {
  margin: 16px 0;
  color: #aaa;
}
.event-highlight .all-album .album-item .back-btn {
  color: #aaa;
  cursor: pointer;
}
.event-highlight .all-album .album-item .break-line {
  margin: 0;
  padding-top: 20px;
  margin-bottom: 40px;
  border: 0;
  border-bottom: 2px solid #ddd;
}
.event-highlight .all-album .album-item .images .image-box {
  overflow: hidden;
}
.event-highlight .all-album .album-item .images .image-box .image {
  width: 100%;
  padding-top: 75%;
  background-position: 50% 50%;
  -webkit-background-size: cover;
  background-size: cover;
  background-repeat: no-repeat;
  -webkit-transform: scale(1);
  -ms-transform: scale(1);
  -moz-transition: scale(1);
  -o-transition: scale(1);
  transform: scale(1);
  -webkit-transition: all 0.2s ease-in-out;
  -o-transition: all 0.2s ease-in-out;
  -moz-transition: all 0.2s ease-in-out;
  -ms-transition: all 0.2s ease-in-out;
  transition: all 0.2s ease-in-out;
}
.event-highlight .all-album .album-item .images .image-box:hover .image {
  transform: scale(1.08);
}

@-webkit-keyframes grain {
  0%, 100% {
    -webkit-transform: translate(0, 0);
    -moz-transform: translate(0, 0);
    -ms-transform: translate(0, 0);
    -o-transform: translate(0, 0);
    transform: translate(0, 0);
  }
  10% {
    -webkit-transform: translate(-5%, -10%);
    -moz-transform: translate(-5%, -10%);
    -ms-transform: translate(-5%, -10%);
    -o-transform: translate(-5%, -10%);
    transform: translate(-5%, -10%);
  }
  20% {
    -webkit-transform: translate(-15%, 5%);
    -moz-transform: translate(-15%, 5%);
    -ms-transform: translate(-15%, 5%);
    -o-transform: translate(-15%, 5%);
    transform: translate(-15%, 5%);
  }
  30% {
    -webkit-transform: translate(7%, -25%);
    -moz-transform: translate(7%, -25%);
    -ms-transform: translate(7%, -25%);
    -o-transform: translate(7%, -25%);
    transform: translate(7%, -25%);
  }
  40% {
    -webkit-transform: translate(-5%, 25%);
    -moz-transform: translate(-5%, 25%);
    -ms-transform: translate(-5%, 25%);
    -o-transform: translate(-5%, 25%);
    transform: translate(-5%, 25%);
  }
  50% {
    -webkit-transform: translate(-15%, 10%);
    -moz-transform: translate(-15%, 10%);
    -ms-transform: translate(-15%, 10%);
    -o-transform: translate(-15%, 10%);
    transform: translate(-15%, 10%);
  }
  60% {
    -webkit-transform: translate(15%, 0%);
    -moz-transform: translate(15%, 0%);
    -ms-transform: translate(15%, 0%);
    -o-transform: translate(15%, 0%);
    transform: translate(15%, 0%);
  }
  70% {
    -webkit-transform: translate(0%, 15%);
    -moz-transform: translate(0%, 15%);
    -ms-transform: translate(0%, 15%);
    -o-transform: translate(0%, 15%);
    transform: translate(0%, 15%);
  }
  60% {
    -webkit-transform: translate(15%, 0%);
    -moz-transform: translate(15%, 0%);
    -ms-transform: translate(15%, 0%);
    -o-transform: translate(15%, 0%);
    transform: translate(15%, 0%);
  }
  90% {
    -webkit-transform: translate(-10%, 10%);
    -moz-transform: translate(-10%, 10%);
    -ms-transform: translate(-10%, 10%);
    -o-transform: translate(-10%, 10%);
    transform: translate(-10%, 10%);
  }
}
@-moz-keyframes grain {
  0%, 100% {
    -webkit-transform: translate(0, 0);
    -moz-transform: translate(0, 0);
    -ms-transform: translate(0, 0);
    -o-transform: translate(0, 0);
    transform: translate(0, 0);
  }
  10% {
    -webkit-transform: translate(-5%, -10%);
    -moz-transform: translate(-5%, -10%);
    -ms-transform: translate(-5%, -10%);
    -o-transform: translate(-5%, -10%);
    transform: translate(-5%, -10%);
  }
  20% {
    -webkit-transform: translate(-15%, 5%);
    -moz-transform: translate(-15%, 5%);
    -ms-transform: translate(-15%, 5%);
    -o-transform: translate(-15%, 5%);
    transform: translate(-15%, 5%);
  }
  30% {
    -webkit-transform: translate(7%, -25%);
    -moz-transform: translate(7%, -25%);
    -ms-transform: translate(7%, -25%);
    -o-transform: translate(7%, -25%);
    transform: translate(7%, -25%);
  }
  40% {
    -webkit-transform: translate(-5%, 25%);
    -moz-transform: translate(-5%, 25%);
    -ms-transform: translate(-5%, 25%);
    -o-transform: translate(-5%, 25%);
    transform: translate(-5%, 25%);
  }
  50% {
    -webkit-transform: translate(-15%, 10%);
    -moz-transform: translate(-15%, 10%);
    -ms-transform: translate(-15%, 10%);
    -o-transform: translate(-15%, 10%);
    transform: translate(-15%, 10%);
  }
  60% {
    -webkit-transform: translate(15%, 0%);
    -moz-transform: translate(15%, 0%);
    -ms-transform: translate(15%, 0%);
    -o-transform: translate(15%, 0%);
    transform: translate(15%, 0%);
  }
  70% {
    -webkit-transform: translate(0%, 15%);
    -moz-transform: translate(0%, 15%);
    -ms-transform: translate(0%, 15%);
    -o-transform: translate(0%, 15%);
    transform: translate(0%, 15%);
  }
  60% {
    -webkit-transform: translate(15%, 0%);
    -moz-transform: translate(15%, 0%);
    -ms-transform: translate(15%, 0%);
    -o-transform: translate(15%, 0%);
    transform: translate(15%, 0%);
  }
  90% {
    -webkit-transform: translate(-10%, 10%);
    -moz-transform: translate(-10%, 10%);
    -ms-transform: translate(-10%, 10%);
    -o-transform: translate(-10%, 10%);
    transform: translate(-10%, 10%);
  }
}
@-ms-keyframes grain {
  0%, 100% {
    -webkit-transform: translate(0, 0);
    -moz-transform: translate(0, 0);
    -ms-transform: translate(0, 0);
    -o-transform: translate(0, 0);
    transform: translate(0, 0);
  }
  10% {
    -webkit-transform: translate(-5%, -10%);
    -moz-transform: translate(-5%, -10%);
    -ms-transform: translate(-5%, -10%);
    -o-transform: translate(-5%, -10%);
    transform: translate(-5%, -10%);
  }
  20% {
    -webkit-transform: translate(-15%, 5%);
    -moz-transform: translate(-15%, 5%);
    -ms-transform: translate(-15%, 5%);
    -o-transform: translate(-15%, 5%);
    transform: translate(-15%, 5%);
  }
  30% {
    -webkit-transform: translate(7%, -25%);
    -moz-transform: translate(7%, -25%);
    -ms-transform: translate(7%, -25%);
    -o-transform: translate(7%, -25%);
    transform: translate(7%, -25%);
  }
  40% {
    -webkit-transform: translate(-5%, 25%);
    -moz-transform: translate(-5%, 25%);
    -ms-transform: translate(-5%, 25%);
    -o-transform: translate(-5%, 25%);
    transform: translate(-5%, 25%);
  }
  50% {
    -webkit-transform: translate(-15%, 10%);
    -moz-transform: translate(-15%, 10%);
    -ms-transform: translate(-15%, 10%);
    -o-transform: translate(-15%, 10%);
    transform: translate(-15%, 10%);
  }
  60% {
    -webkit-transform: translate(15%, 0%);
    -moz-transform: translate(15%, 0%);
    -ms-transform: translate(15%, 0%);
    -o-transform: translate(15%, 0%);
    transform: translate(15%, 0%);
  }
  70% {
    -webkit-transform: translate(0%, 15%);
    -moz-transform: translate(0%, 15%);
    -ms-transform: translate(0%, 15%);
    -o-transform: translate(0%, 15%);
    transform: translate(0%, 15%);
  }
  60% {
    -webkit-transform: translate(15%, 0%);
    -moz-transform: translate(15%, 0%);
    -ms-transform: translate(15%, 0%);
    -o-transform: translate(15%, 0%);
    transform: translate(15%, 0%);
  }
  90% {
    -webkit-transform: translate(-10%, 10%);
    -moz-transform: translate(-10%, 10%);
    -ms-transform: translate(-10%, 10%);
    -o-transform: translate(-10%, 10%);
    transform: translate(-10%, 10%);
  }
}
@keyframes grain {
  0%, 100% {
    -webkit-transform: translate(0, 0);
    -moz-transform: translate(0, 0);
    -ms-transform: translate(0, 0);
    -o-transform: translate(0, 0);
    transform: translate(0, 0);
  }
  10% {
    -webkit-transform: translate(-5%, -10%);
    -moz-transform: translate(-5%, -10%);
    -ms-transform: translate(-5%, -10%);
    -o-transform: translate(-5%, -10%);
    transform: translate(-5%, -10%);
  }
  20% {
    -webkit-transform: translate(-15%, 5%);
    -moz-transform: translate(-15%, 5%);
    -ms-transform: translate(-15%, 5%);
    -o-transform: translate(-15%, 5%);
    transform: translate(-15%, 5%);
  }
  30% {
    -webkit-transform: translate(7%, -25%);
    -moz-transform: translate(7%, -25%);
    -ms-transform: translate(7%, -25%);
    -o-transform: translate(7%, -25%);
    transform: translate(7%, -25%);
  }
  40% {
    -webkit-transform: translate(-5%, 25%);
    -moz-transform: translate(-5%, 25%);
    -ms-transform: translate(-5%, 25%);
    -o-transform: translate(-5%, 25%);
    transform: translate(-5%, 25%);
  }
  50% {
    -webkit-transform: translate(-15%, 10%);
    -moz-transform: translate(-15%, 10%);
    -ms-transform: translate(-15%, 10%);
    -o-transform: translate(-15%, 10%);
    transform: translate(-15%, 10%);
  }
  60% {
    -webkit-transform: translate(15%, 0%);
    -moz-transform: translate(15%, 0%);
    -ms-transform: translate(15%, 0%);
    -o-transform: translate(15%, 0%);
    transform: translate(15%, 0%);
  }
  70% {
    -webkit-transform: translate(0%, 15%);
    -moz-transform: translate(0%, 15%);
    -ms-transform: translate(0%, 15%);
    -o-transform: translate(0%, 15%);
    transform: translate(0%, 15%);
  }
  60% {
    -webkit-transform: translate(15%, 0%);
    -moz-transform: translate(15%, 0%);
    -ms-transform: translate(15%, 0%);
    -o-transform: translate(15%, 0%);
    transform: translate(15%, 0%);
  }
  90% {
    -webkit-transform: translate(-10%, 10%);
    -moz-transform: translate(-10%, 10%);
    -ms-transform: translate(-10%, 10%);
    -o-transform: translate(-10%, 10%);
    transform: translate(-10%, 10%);
  }
}
.grain-bg {
  overflow: hidden;
  position: relative;
}
.grain-bg:after {
  -webkit-animation: grain 10s steps(10) infinite;
  -moz-animation: grain 10s steps(10) infinite;
  -ms-animation: grain 10s steps(10) infinite;
  -o-animation: grain 10s steps(10) infinite;
  animation: grain 10s steps(10) infinite;
  background-image: url(../img/bg-02.png);
  content: "";
  display: block;
  height: 300%;
  left: -100%;
  position: absolute;
  top: -100%;
  width: 300%;
  z-index: -1;
}

.wishlist-tpl {
  padding-top: 20px;
  padding-bottom: 20px;
}
.wishlist-tpl .award-content {
  padding-left: 15px;
  padding-right: 15px;
}
@media only screen and (max-width: 991px) {
  .wishlist-tpl .award-content {
    position: relative;
    width: 100%;
    padding-bottom: 10px;
  }
}
.wishlist-tpl .award-content .title {
  font-size: 24px;
  line-height: 32px;
  font-weight: bold;
  padding-bottom: 10px;
}
.wishlist-tpl .award-content .sub-title {
  padding-bottom: 10px;
}
.wishlist-tpl .award-content .other-content {
  padding-bottom: 20px;
}
.wishlist-tpl .award-content .more {
  position: relative;
  padding-bottom: 10px;
  font-weight: bold;
  display: inline-block;
}
.wishlist-tpl .award-content .share-btn {
  cursor: pointer;
  background: #000;
  width: 180px;
  padding-top: 10px;
  padding-bottom: 10px;
  position: relative;
  text-align: center;
  color: #fff;
  font-weight: bold;
}
.wishlist-tpl .image {
  position: relative;
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
  padding-top: 56.5%;
}

.page-container {
  background: #fff;
  z-index: 0;
  position: relative;
}
.page-container .page-content {
  padding-top: 50px;
  padding-bottom: 50px;
  position: relative;
  overflow: hidden;
}
@media only screen and (max-width: 767px) {
  .page-container .page-content {
    padding-top: 10px;
  }
}
.page-container .page-content .dropup .dropdown-menu {
  bottom: inherit;
  top: 100%;
}
.page-container .page-content ul {
  margin-left: -20px;
}
.page-container .page-content .forum-select-box {
  background: #172736;
  color: #fff;
}
.page-container .page-content .forum-select-box button {
  background: #172736;
}
.page-container .page-content .forum-select-box button:hover, .page-container .page-content .forum-select-box button:focus, .page-container .page-content .forum-select-box button.focus {
  color: #fff;
  text-decoration: none;
}
.page-container .page-content .forum-select-box .dropdown-menu {
  background: #172736;
}
.page-container .page-content .forum-select-box .dropdown-menu .dropdown-menu > li > a {
  color: #fff;
}
.page-container .page-content .forum-select-box .dropdown-menu > li > a:hover, .page-container .page-content .forum-select-box .dropdown-menu > li > a:focus {
  background: #fff;
  color: #172736;
}
.page-container .page-content .cinema20-tpl-full-list .forum-select-box {
  background: #000;
}
.page-container .page-content .cinema20-tpl-full-list .forum-select-box button {
  background: #000;
}
.page-container .page-content .cinema20-tpl-full-list .forum-select-box .dropdown-menu {
  background: #000;
}
.page-container .page-content .cinema20-tpl-full-list .forum-select-box .dropdown-menu > li > a:hover, .page-container .page-content .cinema20-tpl-full-list .forum-select-box .dropdown-menu > li > a:focus {
  color: #000;
}
.page-container .page-content .forum-content {
  padding-top: 30px;
  padding-bottom: 30px;
}
@media only screen and (max-width: 767px) {
  .page-container .page-content .forum-content {
    padding-top: 15px;
    padding-bottom: 15px;
  }
}
.page-container .page-content .forum-info-banner {
  background: #000;
  color: #fff;
  margin-bottom: 30px;
}
.page-container .page-content .forum-info-banner .icon {
  display: none;
}
.page-container .page-content .forum-info-banner .container {
  position: relative;
}
.page-container .page-content .forum-info-banner .with-icon {
  position: relative;
  padding-left: 70px;
}
.page-container .page-content .forum-info-banner .with-icon .icon {
  display: block;
  left: 0;
  top: 50%;
  -webkit-transform: translate(0, -50%);
  -moz-transform: translate(0, -50%);
  -ms-transform: translate(0, -50%);
  -o-transform: translate(0, -50%);
  transform: translate(0, -50%);
  position: absolute;
  font-size: 40px;
}
.page-container .page-content .forum-info-banner .with-icon .icon img {
  width: 50px;
}
.page-container .page-content .forum-info-banner .description {
  max-width: 80%;
}
@media only screen and (max-width: 767px) {
  .page-container .page-content .forum-info-banner .description {
    max-width: 100%;
  }
}
.page-container .page-content .forum-info-banner .share-btn {
  position: absolute;
  padding: 10px 65px;
  background: #fff;
  color: #000;
  border: #000 1px solid;
  text-align: center;
  right: 15px;
  bottom: -53px;
}
@media only screen and (max-width: 767px) {
  .page-container .page-content .forum-info-banner .share-btn {
    position: relative;
    bottom: 0;
    margin-top: 20px;
    display: inline-block;
    margin-left: 15px;
  }
}
.page-container .page-content .forum-info-banner .calender-btn {
  position: absolute;
  padding: 10px 65px;
  background: #fff;
  color: #000;
  border: #000 1px solid;
  text-align: center;
  right: 227px;
  bottom: -53px;
}
.page-container .page-content .forum-info-banner .calender-btn.en {
  right: 270px;
}
@media only screen and (max-width: 767px) {
  .page-container .page-content .forum-info-banner .calender-btn {
    position: relative;
    right: 15px;
    bottom: 0;
    margin-top: 20px;
    display: inline-block;
    margin-left: 15px;
  }
  .page-container .page-content .forum-info-banner .calender-btn.en {
    right: 15px;
  }
}
.page-container .page-content .forum-header {
  font-size: 60px;
  line-height: 75px;
  position: relative;
}
@media only screen and (max-width: 1200px) {
  .page-container .page-content .forum-header {
    font-size: 45px;
    line-height: 55px;
  }
}
@media only screen and (max-width: 991px) {
  .page-container .page-content .forum-header {
    font-size: 45px;
    line-height: 55px;
  }
}
@media only screen and (max-width: 767px) {
  .page-container .page-content .forum-header {
    font-size: 45px;
    line-height: 55px;
  }
  .page-container .page-content .forum-header.header-break {
    padding-top: 40px;
    padding-bottom: 40px;
  }
}
.page-container .page-content .forum-header .outline-header {
  font-family: "Anton", "DFHeiHK", "Noto Sans TC";
  color: transparent;
  -webkit-text-stroke: 0.5px #172736;
}
.ie .page-container .page-content .forum-header .outline-header {
  color: #ccc;
  text-shadow: -1px -1px 0 #172736, 1px -1px 0 #172736, -1px 1px 0 #172736, 1px 1px 0 #172736;
}
.page-container .page-content .forum-header .sub-header {
  color: #172736;
  font-family: "Anton", "DFHeiHK", "Noto Sans TC";
}
.page-container .page-content .forum-youtube {
  text-align: center;
}
.page-container .page-content .forum-youtube .content {
  width: 80%;
  margin: auto;
}
.page-container .page-content .forum-youtube .content iframe {
  height: 500px;
  border: 0;
}
.page-container .page-content .forum-content-left-right {
  padding-top: 10px;
  padding-bottom: 10px;
}
.page-container .page-content .forum-content-left-right .content-left {
  font-weight: bold;
}
.page-container .page-content .forum-content-left-right .content-left .title {
  white-space: pre-wrap;
}
.page-container .page-content .forum-content-left-right .content-left .sub-title {
  font-size: 10px;
}
.page-container .page-content .forum-content-left-right .content-right button {
  font-family: "Anton", "DFHeiHK", "Noto Sans TC";
  font-size: 24px;
  color: #fff;
  padding: 15px 30px;
  margin-top: 10px;
  margin-bottom: 10px;
  background: #000;
}
.page-container .page-content .forum-post-group .container {
  position: relative;
}
.page-container .page-content .forum-post-group .post-select {
  position: absolute;
  right: 15px;
  top: 50%;
  -webkit-transform: translate(0, -50%);
  -moz-transform: translate(0, -50%);
  -ms-transform: translate(0, -50%);
  -o-transform: translate(0, -50%);
  transform: translate(0, -50%);
  z-index: 999;
}
@media only screen and (max-width: 767px) {
  .page-container .page-content .forum-post-group .post-select {
    position: relative;
    top: 0;
    margin-left: 15px;
    -webkit-transform: none;
    -moz-transform: none;
    -ms-transform: none;
    -o-transform: none;
    transform: none;
  }
}
.page-container .page-content .group-menu {
  background: #172736;
  color: #ccc;
  margin-top: 30px;
  margin-bottom: 30px;
}
@media only screen and (max-width: 767px) {
  .page-container .page-content .group-menu .container {
    padding-left: 0;
    padding-right: 0;
  }
}
.page-container .page-content .group-menu .menu-item {
  padding-top: 10px;
  padding-bottom: 10px;
  padding-right: 50px;
  display: inline-block;
  cursor: pointer;
  position: relative;
}
@media only screen and (max-width: 767px) {
  .page-container .page-content .group-menu .menu-item {
    display: block;
    padding-left: 20%;
    padding-right: 20%;
    position: relative;
  }
}
@media only screen and (max-width: 767px) {
  .page-container .page-content .group-menu .menu-item:last-child {
    border-bottom: none;
  }
}
.page-container .page-content .group-menu .menu-item:after {
  content: "";
  position: absolute;
  width: 5px;
  height: 5px;
  background: #fff;
  border-radius: 100%;
  right: 19px;
  top: 19px;
}
@media only screen and (max-width: 767px) {
  .page-container .page-content .group-menu .menu-item:after {
    width: 100%;
    height: 1px;
    right: 0;
    top: 100%;
    opacity: 0.5;
    border-radius: 0%;
    background: #fff;
  }
}
.page-container .page-content .group-menu .menu-item:last-child:after {
  display: none;
}
.page-container .page-content .group-menu .menu-item.active {
  color: #fff;
}
.page-container .page-content .forum-horizontal-line .horizontal-line {
  width: 100%;
  height: 1px;
  background: #000;
}
.page-container .page-content .forum-document-group .title {
  font-size: 24px;
  font-weight: bold;
  margin-bottom: 30px;
}
.page-container .page-content .forum-document-group .content {
  margin-bottom: 30px;
}
.page-container .page-content .forum-document-group .content .doc-item {
  margin-bottom: 10px;
}
.page-container .page-content .forum-document {
  padding-top: 0px;
  padding-bottom: 10px;
}
.page-container .page-content .forum-image-group .image-item {
  padding-bottom: 30px;
}
.page-container .page-content .forum-image-group .image-item .image {
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
  padding-top: 56.25%;
  margin-bottom: 10px;
}
.page-container .page-content .forum-image-group .image-item .title, .page-container .page-content .forum-image-group .image-item .description {
  font-weight: bold;
}
.page-container .page-content .forum-image-group-with-title-caption .image-item {
  padding-bottom: 30px;
}
.page-container .page-content .forum-image-group-with-title-caption .image-item .image {
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
  padding-top: 56.25%;
  margin-bottom: 10px;
  position: relative;
}
.page-container .page-content .forum-image-group-with-title-caption .image-item .image .mask {
  position: absolute;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.6);
  top: 0;
  left: 0;
  color: #fff;
  opacity: 0;
  transition: 0.5s all;
}
.page-container .page-content .forum-image-group-with-title-caption .image-item .image .mask:hover, .page-container .page-content .forum-image-group-with-title-caption .image-item .image .mask.active {
  opacity: 1;
}
@media only screen and (max-width: 767px) {
  .page-container .page-content .forum-image-group-with-title-caption .image-item .image .mask:hover {
    opacity: 0;
  }
  .page-container .page-content .forum-image-group-with-title-caption .image-item .image .mask.active {
    opacity: 1;
  }
}
.page-container .page-content .forum-image-group-with-title-caption .image-item .image .mask .content {
  position: absolute;
  left: 0;
  bottom: 0;
  padding: 20px;
}
.page-container .page-content .forum-image-group-with-title-caption .image-item .image .mask .content .title {
  font-size: 24px;
  line-height: 36px;
  font-weight: bold;
  padding-bottom: 5px;
}
.page-container .page-content .forum-logo-group .title {
  margin-bottom: 10px;
}
.page-container .page-content .forum-logo-group .logos {
  clear: both;
  padding-left: 10px;
  padding-right: 10px;
}
.page-container .page-content .forum-logo-group .logos .logo-item {
  padding-left: 5px;
  padding-right: 5px;
  padding-bottom: 20px;
  display: inline-block;
}
.page-container .page-content .forum-logo-group .logos .logo-item img {
  height: 80px;
}
.page-container .page-content .forum-logo-group-with-container .title {
  margin-bottom: 10px;
}
.page-container .page-content .forum-logo-group-with-container .logos {
  clear: both;
  padding-left: 10px;
  padding-right: 10px;
}
.page-container .page-content .forum-logo-group-with-container .logos .logo-item {
  padding-left: 5px;
  padding-right: 5px;
  padding-bottom: 20px;
  display: inline-block;
}
.page-container .page-content .forum-logo-group-with-container .logos .logo-item img {
  height: 120px;
}
.page-container .page-content .forum-slider .slider .image {
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
  padding-top: 56.5%;
}
.page-container .page-content .forum-slider .slider .owl-nav {
  display: none;
}
.page-container .page-content .forum-slider .slider .owl-dots {
  margin-top: 15px;
}
.page-container .page-content .forum-slider .slider .owl-dots .owl-dot.active span, .page-container .page-content .forum-slider .slider .owl-dots .owl-dot:hover span {
  background: #000;
}
.page-container .page-content .forum-save-and-share .btn-group div {
  float: left;
  margin-right: 30px;
}
.page-container .page-content .festival-tpl .single-item {
  padding-top: 20px;
  padding-bottom: 20px;
}
.page-container .page-content .festival-tpl .single-item .award-content {
  position: absolute;
  left: 0;
  bottom: 0;
  width: 50%;
  padding-left: 15px;
  padding-right: 15px;
}
@media only screen and (max-width: 991px) {
  .page-container .page-content .festival-tpl .single-item .award-content {
    position: relative;
    width: 100%;
    padding-bottom: 10px;
  }
}
.page-container .page-content .festival-tpl .single-item .award-content .title {
  font-size: 24px;
  line-height: 32px;
  font-weight: bold;
  padding-bottom: 10px;
}
.page-container .page-content .festival-tpl .single-item .award-content .sub-title {
  padding-bottom: 10px;
}
.page-container .page-content .festival-tpl .single-item .award-content .other-content {
  padding-bottom: 20px;
}
.page-container .page-content .festival-tpl .single-item .award-content .more {
  position: relative;
  padding-bottom: 10px;
  font-weight: bold;
  display: inline-block;
}
.page-container .page-content .festival-tpl .single-item .award-content .share-btn {
  cursor: pointer;
  background: #000;
  width: 180px;
  padding-top: 10px;
  padding-bottom: 10px;
  position: relative;
  text-align: center;
  color: #fff;
  font-weight: bold;
}
.page-container .page-content .festival-tpl .single-item .image {
  position: relative;
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
  padding-top: 56.5%;
}
.page-container .page-content .award-tpl {
  position: relative;
}
.page-container .page-content .award-tpl .award-select {
  position: absolute;
  right: 0;
  margin-top: -120px;
  z-index: 10;
}
@media only screen and (max-width: 767px) {
  .page-container .page-content .award-tpl .award-select {
    position: relative;
    right: 0;
    margin-top: 0;
    margin-bottom: 30px;
    z-index: 10;
  }
  .page-container .page-content .award-tpl .award-select .forum-select-box {
    width: 100%;
  }
}
.page-container .page-content .award-tpl .award-year {
  display: none;
}
.page-container .page-content .award-tpl .award-year .category {
  margin-bottom: 80px;
}
.page-container .page-content .award-tpl .award-year.active {
  display: block;
}
.page-container .page-content .award-tpl .award-items {
  display: none;
}
.page-container .page-content .award-tpl .award-items.active {
  display: block;
}
.page-container .page-content .award-tpl .award-items .award-item {
  padding-bottom: 40px;
}
.page-container .page-content .award-tpl .award-items .award-item .award-name {
  margin-bottom: 45px;
  position: relative;
}
@media only screen and (max-width: 767px) {
  .page-container .page-content .award-tpl .award-items .award-item .award-name {
    margin-bottom: 10px;
  }
}
.page-container .page-content .award-tpl .award-items .award-item .award-name .text {
  font-size: 40px;
  line-height: 50px;
  position: absolute;
  bottom: 0;
  padding-left: 15px;
}
@media only screen and (max-width: 767px) {
  .page-container .page-content .award-tpl .award-items .award-item .award-name .text {
    position: relative;
    padding-bottom: 20px;
  }
}
.page-container .page-content .award-tpl .award-items .award-item .award-name .image {
  padding-top: 56.25%;
  box-shadow: 0 10px 16px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19) !important;
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
}
@media only screen and (max-width: 767px) {
  .page-container .page-content .award-tpl .award-items .award-item .award-name .image {
    margin-bottom: 35px;
  }
}
.page-container .page-content .award-tpl .award-items .award-item .award-content .title {
  font-size: 24px;
  line-height: 32px;
  padding-bottom: 20px;
  font-family: "Anton", "DFHeiHK", "Noto Sans TC";
}
.page-container .page-content .award-tpl .award-items .award-item .award-content .name {
  padding-bottom: 10px;
}
.page-container .page-content .award-tpl .award-items .award-item .award-content .description {
  line-height: 30px;
}
.page-container .page-content .judging-tpl {
  position: relative;
}
.page-container .page-content .judging-tpl .category-title {
  color: #172736;
  font-size: 50px;
  line-height: 60px;
  font-family: "Anton", "DFHeiHK", "Noto Sans TC";
}
.page-container .page-content .judging-tpl .judging-select {
  position: absolute;
  right: 0;
  margin-top: -120px;
  z-index: 10;
}
@media only screen and (max-width: 767px) {
  .page-container .page-content .judging-tpl .judging-select {
    position: relative;
    right: 0;
    margin-top: 0;
    margin-bottom: 30px;
    z-index: 10;
  }
  .page-container .page-content .judging-tpl .judging-select .forum-select-box {
    width: 100%;
  }
}
.page-container .page-content .judging-tpl .judge-list {
  display: none;
}
.page-container .page-content .judging-tpl .judge-list.active {
  display: block;
}
.page-container .page-content .judging-tpl .judge-list .judge-items {
  padding-top: 30px;
  padding-bottom: 60px;
}
.page-container .page-content .judging-tpl .judge-list .judge-items .judge-item {
  cursor: pointer;
  padding-bottom: 20px;
}
.page-container .page-content .judging-tpl .judge-list .judge-items .judge-item .image-bg {
  background-color: #fff;
  overflow: hidden;
  -webkit-transition: all ease-in-out 0.3s;
  -moz-transition: all ease-in-out 0.3s;
  -ms-transition: all ease-in-out 0.3s;
  -o-transition: all ease-in-out 0.3s;
  transition: all ease-in-out 0.3s;
  position: relative;
}
.page-container .page-content .judging-tpl .judge-list .judge-items .judge-item .image-bg:after {
  background-color: #3c2c8e;
  mix-blend-mode: screen;
  content: "";
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  transition: all ease-in-out 0.5s;
}
.ie .page-container .page-content .judging-tpl .judge-list .judge-items .judge-item .image-bg:after {
  display: none;
}
.page-container .page-content .judging-tpl .judge-list .judge-items .judge-item .image-bg .image {
  width: 100%;
  padding-top: 130%;
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
  mix-blend-mode: multiply;
  -webkit-filter: grayscale(100%) contrast(1.2);
  filter: grayscale(100%) contrast(1);
}
.page-container .page-content .judging-tpl .judge-list .judge-items .judge-item .name {
  padding-top: 15px;
  font-weight: bold;
  font-size: 18px;
}

.judge-dialog-header {
  border-bottom: none;
}

.judge-dialog .category {
  font-size: 40px;
  line-height: 50px;
  padding-bottom: 20px;
}
.judge-dialog .image-bg {
  width: 260px;
  background-color: #fff;
  overflow: hidden;
  -webkit-transition: all ease-in-out 0.3s;
  -moz-transition: all ease-in-out 0.3s;
  -ms-transition: all ease-in-out 0.3s;
  -o-transition: all ease-in-out 0.3s;
  transition: all ease-in-out 0.3s;
  position: relative;
  padding-bottom: 30px;
}
.judge-dialog .image-bg:after {
  background-color: #3c2c8e;
  mix-blend-mode: screen;
  content: "";
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  transition: all ease-in-out 0.5s;
}
.ie .judge-dialog .image-bg:after {
  display: none;
}
.judge-dialog .image-bg .image {
  width: 100%;
  padding-top: 130%;
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
  mix-blend-mode: multiply;
  -webkit-filter: grayscale(100%) contrast(1.2);
  filter: grayscale(100%) contrast(1);
}
.judge-dialog .name {
  font-size: 18px;
  font-weight: bold;
  padding-bottom: 20px;
}

.hidden-footer-padding .footer-padding {
  display: none;
}

.hidden-footer .footer-menu-nav {
  display: none;
}

.footer-menu-nav {
  background: #172736;
  padding-top: 60px;
  color: white;
}
.footer-menu-nav a {
  color: white;
}
.footer-menu-nav .cinema {
  display: none;
}
.footer-menu-nav .footer-sponsor {
  background: #fff;
  padding-top: 30px;
  height: 170px;
  color: #000;
  overflow: hidden;
}
@media only screen and (max-width: 767px) {
  .footer-menu-nav .footer-sponsor {
    height: initial;
  }
}
.footer-menu-nav .footer-sponsor a {
  color: #000;
}
.footer-menu-nav .footer-sponsor .sponsor-item {
  float: left;
  margin-right: 50px;
  margin-top: 0px;
}
@media only screen and (max-width: 767px) {
  .footer-menu-nav .footer-sponsor .sponsor-item {
    margin-bottom: 20px;
  }
}
.footer-menu-nav .footer-sponsor .sponsor-item .ifva div {
  float: left;
}
.footer-menu-nav .footer-sponsor .sponsor-item .ifva span {
  font-size: 80px;
  line-height: 90px;
}
.footer-menu-nav .footer-sponsor .sponsor-item .ifva span.text {
  font-size: 17px;
  margin-left: 20px;
  line-height: 90px;
}
.footer-menu-nav .footer-sponsor .sponsor-item .name span {
  font-size: 17px;
  line-height: 90px;
}
@media only screen and (max-width: 767px) {
  .footer-menu-nav .footer-sponsor .sponsor-item .name span {
    line-height: 38px;
  }
}
.footer-menu-nav .footer-sponsor .sponsor-item .cccdi span {
  font-size: 100px;
  line-height: 82px;
}
@media only screen and (max-width: 767px) {
  .footer-menu-nav .footer-sponsor .sponsor-item .cccdi span {
    line-height: 66px;
  }
}
.footer-menu-nav .footer-sponsor .sponsor-item .text {
  font-size: 12px;
}
.footer-menu-nav .footer-sponsor .sponsor-item .icon img {
  height: 45px;
  margin-top: 25px;
}
.footer-menu-nav .footer-sponsor .sponsor-item:first-child {
  margin-top: 0;
}
.footer-menu-nav .box-link {
  display: inline-block;
  width: auto;
  padding: 10px;
  border: 1px white solid !important;
}
.footer-menu-nav .social-media {
  z-index: 1;
  position: relative;
  text-align: right;
}
@media only screen and (max-width: 767px) {
  .footer-menu-nav .social-media {
    padding-bottom: 30px;
    text-align: left;
  }
}
.footer-menu-nav .social-media .item {
  display: inline-block;
  font-size: 30px;
  margin-right: 15px;
}
@media only screen and (max-width: 991px) {
  .footer-menu-nav .social-media .item {
    margin-right: 8px;
  }
}
@media only screen and (max-width: 767px) {
  .footer-menu-nav .social-media .item {
    margin-right: 15px;
  }
}
.footer-menu-nav .social-media .item:last-child {
  margin-right: 0px;
}
.footer-menu-nav .footer-bottom {
  padding-top: 40px;
  padding-bottom: 60px;
}
@media only screen and (max-width: 767px) {
  .footer-menu-nav .footer-bottom {
    padding-top: 20px;
  }
}
.footer-menu-nav .footer-bottom .footer-link {
  font-size: 12px;
  width: auto;
  padding-right: 30px;
  display: inline;
  float: left;
}
@media only screen and (max-width: 767px) {
  .footer-menu-nav .footer-bottom .footer-link {
    padding-right: 15px;
    padding-left: 15px;
    text-align: center;
    float: none;
    display: inline-block;
  }
}
.footer-menu-nav .menu-items .menu-item {
  padding-top: 10px;
  padding-bottom: 3px;
}
.footer-menu-nav .menu-items .menu-item .sub-menu {
  margin-top: 10px;
  padding-top: 0px;
  padding-left: 20px;
  padding-bottom: 10px;
  position: relative;
}
@media only screen and (max-width: 767px) {
  .footer-menu-nav .menu-items .menu-item .sub-menu {
    margin-top: 0px;
    padding-left: 0px;
    padding-bottom: 0px;
  }
}
.footer-menu-nav .menu-items .menu-item .sub-menu:before {
  position: absolute;
  content: "";
  height: 100%;
  width: 1px;
  left: 0;
  background: #fff;
}
@media only screen and (max-width: 767px) {
  .footer-menu-nav .menu-items .menu-item .sub-menu:before {
    display: none;
  }
}
.footer-menu-nav .menu-items .menu-item .sub-menu .sub-menu-item {
  padding-top: 3px;
  padding-bottom: 3px;
}
.footer-menu-nav .menu-items .menu-item .sub-menu .sub-menu-item:first-child {
  padding-top: 0;
}
@media only screen and (max-width: 767px) {
  .footer-menu-nav .menu-items .menu-item {
    margin-top: -1px;
    padding-top: 10px;
    padding-bottom: 10px;
    border-top: solid 1px #fff;
    border-bottom: solid 1px #fff;
    position: relative;
    cursor: pointer;
  }
  .footer-menu-nav .menu-items .menu-item.has-sub:before {
    font-family: "ifva" !important;
    content: "";
    position: absolute;
    width: 25px;
    height: 32px;
    right: 20px;
    -webkit-transition: 0.5s all;
    -moz-transition: 0.5s all;
    -ms-transition: 0.5s all;
    -o-transition: 0.5s all;
    transition: 0.5s all;
  }
  .footer-menu-nav .menu-items .menu-item .sub-menu {
    padding-top: 5px;
    padding-bottom: 10px;
    display: none;
  }
  .footer-menu-nav .menu-items .menu-item.open .sub-menu {
    display: block;
  }
}

.demo-1 {
  --color-text: #fff;
  --color-bg: #000;
  --color-link: #f9d77e;
  --color-link-hover: #fff;
  --color-info: #efc453;
  --glitch-width: 100vw;
  --glitch-height: 100vh;
  --gap-horizontal: 10px;
  --gap-vertical: 5px;
  --time-anim: 4s;
  --delay-anim: 0s;
  --blend-mode-1: none;
  --blend-mode-2: none;
  --blend-mode-3: none;
  --blend-mode-4: none;
  --blend-mode-5: overlay;
  --blend-color-1: transparent;
  --blend-color-2: transparent;
  --blend-color-3: transparent;
  --blend-color-4: transparent;
  --blend-color-5: #af4949;
}

/* Glitch styles */
.glitch {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  overflow: hidden;
}

.glitch__img {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  padding-top: 75%;
  background: no-repeat 50% 0;
  background-color: var(--blend-color-1);
  background-size: cover;
  transform: translate3d(0, 0, 0);
  background-blend-mode: var(--blend-mode-1);
}

/* Animations */
@keyframes glitch-anim-1 {
  0% {
    opacity: 1;
    transform: translate3d(var(--gap-horizontal), 0, 0);
    -webkit-clip-path: polygon(0 2%, 100% 2%, 100% 5%, 0 5%);
    clip-path: polygon(0 2%, 100% 2%, 100% 5%, 0 5%);
  }
  2% {
    -webkit-clip-path: polygon(0 15%, 100% 15%, 100% 15%, 0 15%);
    clip-path: polygon(0 15%, 100% 15%, 100% 15%, 0 15%);
  }
  4% {
    -webkit-clip-path: polygon(0 10%, 100% 10%, 100% 20%, 0 20%);
    clip-path: polygon(0 10%, 100% 10%, 100% 20%, 0 20%);
  }
  6% {
    -webkit-clip-path: polygon(0 1%, 100% 1%, 100% 2%, 0 2%);
    clip-path: polygon(0 1%, 100% 1%, 100% 2%, 0 2%);
  }
  8% {
    -webkit-clip-path: polygon(0 33%, 100% 33%, 100% 33%, 0 33%);
    clip-path: polygon(0 33%, 100% 33%, 100% 33%, 0 33%);
  }
  10% {
    -webkit-clip-path: polygon(0 44%, 100% 44%, 100% 44%, 0 44%);
    clip-path: polygon(0 44%, 100% 44%, 100% 44%, 0 44%);
  }
  12% {
    -webkit-clip-path: polygon(0 50%, 100% 50%, 100% 20%, 0 20%);
    clip-path: polygon(0 50%, 100% 50%, 100% 20%, 0 20%);
  }
  14% {
    -webkit-clip-path: polygon(0 70%, 100% 70%, 100% 70%, 0 70%);
    clip-path: polygon(0 70%, 100% 70%, 100% 70%, 0 70%);
  }
  16% {
    -webkit-clip-path: polygon(0 80%, 100% 80%, 100% 80%, 0 80%);
    clip-path: polygon(0 80%, 100% 80%, 100% 80%, 0 80%);
  }
  18% {
    -webkit-clip-path: polygon(0 50%, 100% 50%, 100% 55%, 0 55%);
    clip-path: polygon(0 50%, 100% 50%, 100% 55%, 0 55%);
  }
  20% {
    -webkit-clip-path: polygon(0 70%, 100% 70%, 100% 80%, 0 80%);
    clip-path: polygon(0 70%, 100% 70%, 100% 80%, 0 80%);
  }
  21.9% {
    opacity: 1;
    transform: translate3d(var(--gap-horizontal), 0, 0);
  }
  22%, 100% {
    opacity: 0;
    transform: translate3d(0, 0, 0);
    -webkit-clip-path: polygon(0 0, 0 0, 0 0, 0 0);
    clip-path: polygon(0 0, 0 0, 0 0, 0 0);
  }
}
@keyframes glitch-anim-2 {
  0% {
    opacity: 1;
    transform: translate3d(calc(-1 * var(--gap-horizontal)), 0, 0);
    -webkit-clip-path: polygon(0 25%, 100% 25%, 100% 30%, 0 30%);
    clip-path: polygon(0 25%, 100% 25%, 100% 30%, 0 30%);
  }
  3% {
    -webkit-clip-path: polygon(0 3%, 100% 3%, 100% 3%, 0 3%);
    clip-path: polygon(0 3%, 100% 3%, 100% 3%, 0 3%);
  }
  5% {
    -webkit-clip-path: polygon(0 5%, 100% 5%, 100% 20%, 0 20%);
    clip-path: polygon(0 5%, 100% 5%, 100% 20%, 0 20%);
  }
  7% {
    -webkit-clip-path: polygon(0 20%, 100% 20%, 100% 20%, 0 20%);
    clip-path: polygon(0 20%, 100% 20%, 100% 20%, 0 20%);
  }
  9% {
    -webkit-clip-path: polygon(0 40%, 100% 40%, 100% 40%, 0 40%);
    clip-path: polygon(0 40%, 100% 40%, 100% 40%, 0 40%);
  }
  11% {
    -webkit-clip-path: polygon(0 52%, 100% 52%, 100% 59%, 0 59%);
    clip-path: polygon(0 52%, 100% 52%, 100% 59%, 0 59%);
  }
  13% {
    -webkit-clip-path: polygon(0 60%, 100% 60%, 100% 60%, 0 60%);
    clip-path: polygon(0 60%, 100% 60%, 100% 60%, 0 60%);
  }
  15% {
    -webkit-clip-path: polygon(0 75%, 100% 75%, 100% 75%, 0 75%);
    clip-path: polygon(0 75%, 100% 75%, 100% 75%, 0 75%);
  }
  17% {
    -webkit-clip-path: polygon(0 65%, 100% 65%, 100% 40%, 0 40%);
    clip-path: polygon(0 65%, 100% 65%, 100% 40%, 0 40%);
  }
  19% {
    -webkit-clip-path: polygon(0 45%, 100% 45%, 100% 50%, 0 50%);
    clip-path: polygon(0 45%, 100% 45%, 100% 50%, 0 50%);
  }
  20% {
    -webkit-clip-path: polygon(0 14%, 100% 14%, 100% 33%, 0 33%);
    clip-path: polygon(0 14%, 100% 14%, 100% 33%, 0 33%);
  }
  21.9% {
    opacity: 1;
    transform: translate3d(calc(-1 * var(--gap-horizontal)), 0, 0);
  }
  22%, 100% {
    opacity: 0;
    transform: translate3d(0, 0, 0);
    -webkit-clip-path: polygon(0 0, 0 0, 0 0, 0 0);
    clip-path: polygon(0 0, 0 0, 0 0, 0 0);
  }
}
@keyframes glitch-anim-3 {
  0% {
    opacity: 1;
    transform: translate3d(0, calc(-1 * var(--gap-vertical)), 0) scale3d(-1, -1, 1);
    -webkit-clip-path: polygon(0 1%, 100% 1%, 100% 3%, 0 3%);
    clip-path: polygon(0 1%, 100% 1%, 100% 3%, 0 3%);
  }
  1.5% {
    -webkit-clip-path: polygon(0 10%, 100% 10%, 100% 9%, 0 9%);
    clip-path: polygon(0 10%, 100% 10%, 100% 9%, 0 9%);
  }
  2% {
    -webkit-clip-path: polygon(0 5%, 100% 5%, 100% 6%, 0 6%);
    clip-path: polygon(0 5%, 100% 5%, 100% 6%, 0 6%);
  }
  2.5% {
    -webkit-clip-path: polygon(0 20%, 100% 20%, 100% 20%, 0 20%);
    clip-path: polygon(0 20%, 100% 20%, 100% 20%, 0 20%);
  }
  3% {
    -webkit-clip-path: polygon(0 10%, 100% 10%, 100% 10%, 0 10%);
    clip-path: polygon(0 10%, 100% 10%, 100% 10%, 0 10%);
  }
  5% {
    -webkit-clip-path: polygon(0 30%, 100% 30%, 100% 25%, 0 25%);
    clip-path: polygon(0 30%, 100% 30%, 100% 25%, 0 25%);
  }
  5.5% {
    -webkit-clip-path: polygon(0 15%, 100% 15%, 100% 16%, 0 16%);
    clip-path: polygon(0 15%, 100% 15%, 100% 16%, 0 16%);
  }
  7% {
    -webkit-clip-path: polygon(0 40%, 100% 40%, 100% 39%, 0 39%);
    clip-path: polygon(0 40%, 100% 40%, 100% 39%, 0 39%);
  }
  8% {
    -webkit-clip-path: polygon(0 20%, 100% 20%, 100% 21%, 0 21%);
    clip-path: polygon(0 20%, 100% 20%, 100% 21%, 0 21%);
  }
  9% {
    -webkit-clip-path: polygon(0 60%, 100% 60%, 100% 55%, 0 55%);
    clip-path: polygon(0 60%, 100% 60%, 100% 55%, 0 55%);
  }
  10.5% {
    -webkit-clip-path: polygon(0 30%, 100% 30%, 100% 31%, 0 31%);
    clip-path: polygon(0 30%, 100% 30%, 100% 31%, 0 31%);
  }
  11% {
    -webkit-clip-path: polygon(0 70%, 100% 70%, 100% 69%, 0 69%);
    clip-path: polygon(0 70%, 100% 70%, 100% 69%, 0 69%);
  }
  13% {
    -webkit-clip-path: polygon(0 40%, 100% 40%, 100% 41%, 0 41%);
    clip-path: polygon(0 40%, 100% 40%, 100% 41%, 0 41%);
  }
  14% {
    -webkit-clip-path: polygon(0 80%, 100% 80%, 100% 75%, 0 75%);
    clip-path: polygon(0 80%, 100% 80%, 100% 75%, 0 75%);
  }
  14.5% {
    -webkit-clip-path: polygon(0 50%, 100% 50%, 100% 51%, 0 51%);
    clip-path: polygon(0 50%, 100% 50%, 100% 51%, 0 51%);
  }
  15% {
    -webkit-clip-path: polygon(0 90%, 100% 90%, 100% 90%, 0 90%);
    clip-path: polygon(0 90%, 100% 90%, 100% 90%, 0 90%);
  }
  16% {
    -webkit-clip-path: polygon(0 60%, 100% 60%, 100% 60%, 0 60%);
    clip-path: polygon(0 60%, 100% 60%, 100% 60%, 0 60%);
  }
  18% {
    -webkit-clip-path: polygon(0 100%, 100% 100%, 100% 99%, 0 99%);
    clip-path: polygon(0 100%, 100% 100%, 100% 99%, 0 99%);
  }
  20% {
    -webkit-clip-path: polygon(0 70%, 100% 70%, 100% 71%, 0 71%);
    clip-path: polygon(0 70%, 100% 70%, 100% 71%, 0 71%);
  }
  21.9% {
    opacity: 1;
    transform: translate3d(0, calc(-1 * var(--gap-vertical)), 0) scale3d(-1, -1, 1);
  }
  22%, 100% {
    opacity: 0;
    transform: translate3d(0, 0, 0);
    -webkit-clip-path: polygon(0 0, 0 0, 0 0, 0 0);
    clip-path: polygon(0 0, 0 0, 0 0, 0 0);
  }
}
@keyframes glitch-anim-text {
  0% {
    transform: translate3d(calc(-1 * var(--gap-horizontal)), 0, 0) scale3d(-1, -1, 1);
    -webkit-clip-path: polygon(0 20%, 100% 20%, 100% 21%, 0 21%);
    clip-path: polygon(0 20%, 100% 20%, 100% 21%, 0 21%);
  }
  2% {
    -webkit-clip-path: polygon(0 33%, 100% 33%, 100% 33%, 0 33%);
    clip-path: polygon(0 33%, 100% 33%, 100% 33%, 0 33%);
  }
  4% {
    -webkit-clip-path: polygon(0 44%, 100% 44%, 100% 44%, 0 44%);
    clip-path: polygon(0 44%, 100% 44%, 100% 44%, 0 44%);
  }
  5% {
    -webkit-clip-path: polygon(0 50%, 100% 50%, 100% 20%, 0 20%);
    clip-path: polygon(0 50%, 100% 50%, 100% 20%, 0 20%);
  }
  6% {
    -webkit-clip-path: polygon(0 70%, 100% 70%, 100% 70%, 0 70%);
    clip-path: polygon(0 70%, 100% 70%, 100% 70%, 0 70%);
  }
  7% {
    -webkit-clip-path: polygon(0 80%, 100% 80%, 100% 80%, 0 80%);
    clip-path: polygon(0 80%, 100% 80%, 100% 80%, 0 80%);
  }
  8% {
    -webkit-clip-path: polygon(0 50%, 100% 50%, 100% 55%, 0 55%);
    clip-path: polygon(0 50%, 100% 50%, 100% 55%, 0 55%);
  }
  9% {
    -webkit-clip-path: polygon(0 70%, 100% 70%, 100% 80%, 0 80%);
    clip-path: polygon(0 70%, 100% 70%, 100% 80%, 0 80%);
  }
  9.9% {
    transform: translate3d(calc(-1 * var(--gap-horizontal)), 0, 0) scale3d(-1, -1, 1);
  }
  10%, 100% {
    transform: translate3d(0, 0, 0) scale3d(1, 1, 1);
    -webkit-clip-path: polygon(0 0, 100% 0, 100% 100%, 0% 100%);
    clip-path: polygon(0 0, 100% 0, 100% 100%, 0% 100%);
  }
}
/* Flash */
@keyframes glitch-anim-flash {
  0%, 5% {
    opacity: 0.2;
    transform: translate3d(var(--gap-horizontal), var(--gap-vertical), 0);
  }
  5.5%, 100% {
    opacity: 0;
    transform: translate3d(0, 0, 0);
  }
}
.hidden-logo .menu-logo {
  display: none;
}

.clock-container {
  position: relative;
  width: 100%;
  height: 100vh;
}

.main-container {
  position: absolute;
  top: 35%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
  -moz-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  -o-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  font-size: 40px;
  text-align: center;
  font-weight: bold;
  line-height: 50px;
  width: 100%;
}

.clock {
  /*position: absolute;*/
  /*top:50%;*/
  /*left: 50%;*/
  /*-webkit-transform: translate(-50%,-50%);*/
  /*-moz-transform: translate(-50%,-50%);*/
  /*-ms-transform: translate(-50%,-50%);*/
  /*-o-transform: translate(-50%,-50%);*/
  /*transform: translate(-50%,-50%);*/
  /*width: auto;*/
  margin: 45px auto 0;
  width: 618px;
}

.flip-clock-label {
  display: none;
}

.flip-clock-wrapper ul {
  width: 86px;
  height: 110px;
  line-height: 110px;
}

.flip-clock-wrapper ul li {
  line-height: 110px;
}

.flip-clock-wrapper ul li a div div.inn {
  font-size: 100px;
}

.flip-clock-wrapper ul li a div.up:after {
  top: 55px;
}

.flip-clock-divider {
  height: 120px;
}

@media (min-width: 768px) and (max-width: 991px) {
  .clock {
    width: 400px;
  }

  .flip-clock-wrapper ul {
    width: 50px;
    height: 80px;
    line-height: 80px;
  }

  .flip-clock-wrapper ul li {
    line-height: 80px;
  }

  .flip-clock-wrapper ul li a div div.inn {
    font-size: 55px;
  }

  .flip-clock-wrapper ul li a div.up:after {
    top: 40px;
  }

  .flip-clock-divider {
    height: 90px;
  }
}
@media (max-width: 767px) {
  .main-container {
    font-size: 30px;
    line-height: 40px;
  }

  .clock {
    margin: 30px auto 0;
    width: 340px;
  }

  .flip-clock-wrapper ul {
    width: 30px;
    height: 64px;
    line-height: 64px;
  }

  .flip-clock-wrapper ul li {
    line-height: 64px;
  }

  .flip-clock-wrapper ul li a div div.inn {
    font-size: 35px;
  }

  .flip-clock-wrapper ul li a div.up:after {
    top: 32px;
  }

  .flip-clock-divider {
    height: 74px;
  }

  .flip-clock-dot.top {
    top: 20px;
  }

  .flip-clock-dot.bottom {
    bottom: 20px;
  }
}
@media (max-width: 375px) {
  .main-container {
    font-size: 26px;
    line-height: 38px;
  }

  .clock {
    margin: 26px auto 0;
  }
}
@media (max-width: 320px) {
  .main-container {
    font-size: 23px;
    line-height: 34px;
  }

  .clock {
    width: 304px;
  }

  .flip-clock-wrapper ul {
    /*width: 30px;*/
    height: 60px;
    line-height: 60px;
    margin: 5px 2px;
  }

  .flip-clock-wrapper ul li {
    line-height: 60px;
  }

  .flip-clock-wrapper ul li a div div.inn {
    font-size: 35px;
  }

  .flip-clock-wrapper ul li a div.up:after {
    top: 30px;
  }

  .flip-clock-divider {
    height: 70px;
  }

  .flip-clock-dot.top {
    top: 20px;
  }

  .flip-clock-dot.bottom {
    bottom: 20px;
  }
}
.back-to-top {
  position: fixed;
  bottom: 50px;
  right: -300px;
  z-index: 999;
  background: #000;
  color: #fff;
  width: 60px;
  text-align: center;
  padding-top: 17px;
  padding-bottom: 11px;
  font-size: 30px;
  cursor: pointer;
  -webkit-transition: all 0.5s;
  -moz-transition: all 0.5s;
  -ms-transition: all 0.5s;
  -o-transition: all 0.5s;
  transition: all 0.5s;
  -webkit-transform: rotate(180deg);
  -moz-transform: rotate(180deg);
  -ms-transform: rotate(180deg);
  -o-transform: rotate(180deg);
  transform: rotate(180deg);
}
.back-to-top.show {
  right: 0px;
}

.ifvaMainSite-subscribe .submit_btn {
  text-transform: uppercase;
  margin-top: 30px;
  display: block;
  width: 100%;
  background: #000;
  color: #fff;
}

/*# sourceMappingURL=project.css.map */