@import url(../lib/owl-carousel/owl.carousel.min.css);
/*  Box Sizing */
/*  Text Truncate */
/* TRANSITION */
/* TRANSFORM */
/* ANIMATION */
/* GRADIENT */
/* OUTER */
@import url("https://fonts.googleapis.com/css?family=Roboto:300,400,700");
#special-sectionOverview { margin-bottom: 100px; }

.width-line-gray { background: none; }

/* ---------- RESET ---------- */
#hd { font-family: "Roboto", "Microsoft Jhenghei", "Microsoft YaHei", "Segoe UI", "Arial", "Helvetica", sans-serif; background: black; color: white; font-size: 16px; margin: 0; padding: 0; /* ---------- SCREEN READER ---------- */ }
#hd * { margin: 0; padding: 0; text-decoration: none; list-style-type: none; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; word-wrap: break-word; word-break: break-word; }
#hd * ::selection { background: #1d2124; color: #6da6d6; }
#hd * ::-moz-selection { background: #1d2124; color: #6da6d6; }
#hd * :focus-visible { outline-color: #6da6d6; }
#hd ul, #hd li, #hd figure { margin: 0; padding: 0; }
#hd h1, #hd h2, #hd h3, #hd h4, #hd p, #hd a, #hd li { font: inherit; padding: 0; margin: 0; }
#hd img { display: block; height: auto; border: none; max-width: 100% !important; margin: 0 auto; }
#hd img.lazyload { opacity: 0; -moz-transition: opacity 0.5s ease; -o-transition: opacity 0.5s ease; -webkit-transition: opacity 0.5s ease; transition: opacity 0.5s ease; }
#hd img.lazyload.lazyloaded { height: auto; opacity: 1; }
#hd video { max-width: 100%; }
#hd .sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; }

/* ---------- ANIMATIONS ---------- */
@-webkit-keyframes colorrun { 0% { filter: hue-rotate(0deg); }
  100% { filter: hue-rotate(359deg); } }
@-moz-keyframes colorrun { 0% { filter: hue-rotate(0deg); }
  100% { filter: hue-rotate(359deg); } }
@-ms-keyframes colorrun { 0% { filter: hue-rotate(0deg); }
  100% { filter: hue-rotate(359deg); } }
@-o-keyframes colorrun { 0% { filter: hue-rotate(0deg); }
  100% { filter: hue-rotate(359deg); } }
@keyframes colorrun { 0% { filter: hue-rotate(0deg); }
  100% { filter: hue-rotate(359deg); } }
.hd-colorrun { -webkit-animation-delay: 0s; -webkit-animation-duration: 4s; -webkit-animation-name: colorrun; -webkit-animation-timing-function: linear; -webkit-animation-iteration-count: infinite; -webkit-animation-fill-mode: forwards; -moz-animation-delay: 0s; -moz-animation-duration: 4s; -moz-animation-name: colorrun; -moz-animation-timing-function: linear; -moz-animation-iteration-count: infinite; -moz-animation-fill-mode: forwards; -o-animation-delay: 0s; -o-animation-duration: 4s; -o-animation-name: colorrun; -o-animation-timing-function: linear; -o-animation-iteration-count: infinite; -o-animation-fill-mode: forwards; animation-delay: 0s; animation-duration: 4s; animation-name: colorrun; animation-timing-function: linear; animation-iteration-count: infinite; animation-fill-mode: forwards; }

@-webkit-keyframes fadeIn { 0% { opacity: 0; }
  100% { opacity: 1; } }
@-moz-keyframes fadeIn { 0% { opacity: 0; }
  100% { opacity: 1; } }
@-ms-keyframes fadeIn { 0% { opacity: 0; }
  100% { opacity: 1; } }
@-o-keyframes fadeIn { 0% { opacity: 0; }
  100% { opacity: 1; } }
@keyframes fadeIn { 0% { opacity: 0; }
  100% { opacity: 1; } }
@-webkit-keyframes fadeInUp { 0% { opacity: 0; -moz-transform: translateY(20px); -o-transform: translateY(20px); -ms-transform: translateY(20px); -webkit-transform: translateY(20px); transform: translateY(20px); }
  100% { opacity: 1; -moz-transform: translateY(0); -o-transform: translateY(0); -ms-transform: translateY(0); -webkit-transform: translateY(0); transform: translateY(0); } }
@-moz-keyframes fadeInUp { 0% { opacity: 0; -moz-transform: translateY(20px); -o-transform: translateY(20px); -ms-transform: translateY(20px); -webkit-transform: translateY(20px); transform: translateY(20px); }
  100% { opacity: 1; -moz-transform: translateY(0); -o-transform: translateY(0); -ms-transform: translateY(0); -webkit-transform: translateY(0); transform: translateY(0); } }
@-ms-keyframes fadeInUp { 0% { opacity: 0; -moz-transform: translateY(20px); -o-transform: translateY(20px); -ms-transform: translateY(20px); -webkit-transform: translateY(20px); transform: translateY(20px); }
  100% { opacity: 1; -moz-transform: translateY(0); -o-transform: translateY(0); -ms-transform: translateY(0); -webkit-transform: translateY(0); transform: translateY(0); } }
@-o-keyframes fadeInUp { 0% { opacity: 0; -moz-transform: translateY(20px); -o-transform: translateY(20px); -ms-transform: translateY(20px); -webkit-transform: translateY(20px); transform: translateY(20px); }
  100% { opacity: 1; -moz-transform: translateY(0); -o-transform: translateY(0); -ms-transform: translateY(0); -webkit-transform: translateY(0); transform: translateY(0); } }
@keyframes fadeInUp { 0% { opacity: 0; -moz-transform: translateY(20px); -o-transform: translateY(20px); -ms-transform: translateY(20px); -webkit-transform: translateY(20px); transform: translateY(20px); }
  100% { opacity: 1; -moz-transform: translateY(0); -o-transform: translateY(0); -ms-transform: translateY(0); -webkit-transform: translateY(0); transform: translateY(0); } }
@-webkit-keyframes fadeInLeft { 0% { opacity: 0; -moz-transform: translateX(-5%); -o-transform: translateX(-5%); -ms-transform: translateX(-5%); -webkit-transform: translateX(-5%); transform: translateX(-5%); }
  100% { opacity: 1; -moz-transform: translateY(0); -o-transform: translateY(0); -ms-transform: translateY(0); -webkit-transform: translateY(0); transform: translateY(0); } }
@-moz-keyframes fadeInLeft { 0% { opacity: 0; -moz-transform: translateX(-5%); -o-transform: translateX(-5%); -ms-transform: translateX(-5%); -webkit-transform: translateX(-5%); transform: translateX(-5%); }
  100% { opacity: 1; -moz-transform: translateY(0); -o-transform: translateY(0); -ms-transform: translateY(0); -webkit-transform: translateY(0); transform: translateY(0); } }
@-ms-keyframes fadeInLeft { 0% { opacity: 0; -moz-transform: translateX(-5%); -o-transform: translateX(-5%); -ms-transform: translateX(-5%); -webkit-transform: translateX(-5%); transform: translateX(-5%); }
  100% { opacity: 1; -moz-transform: translateY(0); -o-transform: translateY(0); -ms-transform: translateY(0); -webkit-transform: translateY(0); transform: translateY(0); } }
@-o-keyframes fadeInLeft { 0% { opacity: 0; -moz-transform: translateX(-5%); -o-transform: translateX(-5%); -ms-transform: translateX(-5%); -webkit-transform: translateX(-5%); transform: translateX(-5%); }
  100% { opacity: 1; -moz-transform: translateY(0); -o-transform: translateY(0); -ms-transform: translateY(0); -webkit-transform: translateY(0); transform: translateY(0); } }
@keyframes fadeInLeft { 0% { opacity: 0; -moz-transform: translateX(-5%); -o-transform: translateX(-5%); -ms-transform: translateX(-5%); -webkit-transform: translateX(-5%); transform: translateX(-5%); }
  100% { opacity: 1; -moz-transform: translateY(0); -o-transform: translateY(0); -ms-transform: translateY(0); -webkit-transform: translateY(0); transform: translateY(0); } }
/* ---------- color effect ---------- */
@-webkit-keyframes static { 0% { opacity: 1; }
  100% { opacity: 1; } }
@-moz-keyframes static { 0% { opacity: 1; }
  100% { opacity: 1; } }
@-ms-keyframes static { 0% { opacity: 1; }
  100% { opacity: 1; } }
@-o-keyframes static { 0% { opacity: 1; }
  100% { opacity: 1; } }
@keyframes static { 0% { opacity: 1; }
  100% { opacity: 1; } }
@-webkit-keyframes breathing { 0% { opacity: 1; }
  70% { opacity: 0; } }
@-moz-keyframes breathing { 0% { opacity: 1; }
  70% { opacity: 0; } }
@-ms-keyframes breathing { 0% { opacity: 1; }
  70% { opacity: 0; } }
@-o-keyframes breathing { 0% { opacity: 1; }
  70% { opacity: 0; } }
@keyframes breathing { 0% { opacity: 1; }
  70% { opacity: 0; } }
@-webkit-keyframes strobing { 0% { opacity: 1; }
  50% { opacity: 0; } }
@-moz-keyframes strobing { 0% { opacity: 1; }
  50% { opacity: 0; } }
@-ms-keyframes strobing { 0% { opacity: 1; }
  50% { opacity: 0; } }
@-o-keyframes strobing { 0% { opacity: 1; }
  50% { opacity: 0; } }
@keyframes strobing { 0% { opacity: 1; }
  50% { opacity: 0; } }
@-webkit-keyframes music { 0% { opacity: 1; }
  10% { opacity: .3; }
  40% { opacity: 1; }
  60% { opacity: .3; }
  70% { opacity: 1; }
  100% { opacity: .3; } }
@-moz-keyframes music { 0% { opacity: 1; }
  10% { opacity: .3; }
  40% { opacity: 1; }
  60% { opacity: .3; }
  70% { opacity: 1; }
  100% { opacity: .3; } }
@-ms-keyframes music { 0% { opacity: 1; }
  10% { opacity: .3; }
  40% { opacity: 1; }
  60% { opacity: .3; }
  70% { opacity: 1; }
  100% { opacity: .3; } }
@-o-keyframes music { 0% { opacity: 1; }
  10% { opacity: .3; }
  40% { opacity: 1; }
  60% { opacity: .3; }
  70% { opacity: 1; }
  100% { opacity: .3; } }
@keyframes music { 0% { opacity: 1; }
  10% { opacity: .3; }
  40% { opacity: 1; }
  60% { opacity: .3; }
  70% { opacity: 1; }
  100% { opacity: .3; } }
@-webkit-keyframes cycle { 0% { background-color: red; }
  15% { background-color: orange; }
  30% { background-color: yellow; }
  45% { background-color: #00CB07; }
  60% { background-color: #07A9FF; }
  75% { background-color: #1044FF; }
  90% { background-color: #a12fd9; }
  100% { background-color: red; } }
@-moz-keyframes cycle { 0% { background-color: red; }
  15% { background-color: orange; }
  30% { background-color: yellow; }
  45% { background-color: #00CB07; }
  60% { background-color: #07A9FF; }
  75% { background-color: #1044FF; }
  90% { background-color: #a12fd9; }
  100% { background-color: red; } }
@-ms-keyframes cycle { 0% { background-color: red; }
  15% { background-color: orange; }
  30% { background-color: yellow; }
  45% { background-color: #00CB07; }
  60% { background-color: #07A9FF; }
  75% { background-color: #1044FF; }
  90% { background-color: #a12fd9; }
  100% { background-color: red; } }
@-o-keyframes cycle { 0% { background-color: red; }
  15% { background-color: orange; }
  30% { background-color: yellow; }
  45% { background-color: #00CB07; }
  60% { background-color: #07A9FF; }
  75% { background-color: #1044FF; }
  90% { background-color: #a12fd9; }
  100% { background-color: red; } }
@keyframes cycle { 0% { background-color: red; }
  15% { background-color: orange; }
  30% { background-color: yellow; }
  45% { background-color: #00CB07; }
  60% { background-color: #07A9FF; }
  75% { background-color: #1044FF; }
  90% { background-color: #a12fd9; }
  100% { background-color: red; } }
@-webkit-keyframes rainbow { 0% { background-position: 100% 0; }
  100% { background-position: 0 0; } }
@-moz-keyframes rainbow { 0% { background-position: 100% 0; }
  100% { background-position: 0 0; } }
@-ms-keyframes rainbow { 0% { background-position: 100% 0; }
  100% { background-position: 0 0; } }
@-o-keyframes rainbow { 0% { background-position: 100% 0; }
  100% { background-position: 0 0; } }
@keyframes rainbow { 0% { background-position: 100% 0; }
  100% { background-position: 0 0; } }
@-webkit-keyframes smart { 0% , 28% { background-color: red; }
  30%, 58% { background-color: yellow; }
  60%, 88% { background-color: #42ca42; }
  90%, 98% { background-color: yellow; }
  100% { background-color: red; } }
@-moz-keyframes smart { 0% , 28% { background-color: red; }
  30%, 58% { background-color: yellow; }
  60%, 88% { background-color: #42ca42; }
  90%, 98% { background-color: yellow; }
  100% { background-color: red; } }
@-ms-keyframes smart { 0% , 28% { background-color: red; }
  30%, 58% { background-color: yellow; }
  60%, 88% { background-color: #42ca42; }
  90%, 98% { background-color: yellow; }
  100% { background-color: red; } }
@-o-keyframes smart { 0% , 28% { background-color: red; }
  30%, 58% { background-color: yellow; }
  60%, 88% { background-color: #42ca42; }
  90%, 98% { background-color: yellow; }
  100% { background-color: red; } }
@keyframes smart { 0% , 28% { background-color: red; }
  30%, 58% { background-color: yellow; }
  60%, 88% { background-color: #42ca42; }
  90%, 98% { background-color: yellow; }
  100% { background-color: red; } }
@-webkit-keyframes comet { 0% { z-index: -1; -moz-transform: skewX(68deg) translateX(250%); -o-transform: skewX(68deg) translateX(250%); -ms-transform: skewX(68deg) translateX(250%); -webkit-transform: skewX(68deg) translateX(250%); transform: skewX(68deg) translateX(250%); }
  100% { z-index: -1; -moz-transform: skewX(68deg) translateX(-250%); -o-transform: skewX(68deg) translateX(-250%); -ms-transform: skewX(68deg) translateX(-250%); -webkit-transform: skewX(68deg) translateX(-250%); transform: skewX(68deg) translateX(-250%); } }
@-moz-keyframes comet { 0% { z-index: -1; -moz-transform: skewX(68deg) translateX(250%); -o-transform: skewX(68deg) translateX(250%); -ms-transform: skewX(68deg) translateX(250%); -webkit-transform: skewX(68deg) translateX(250%); transform: skewX(68deg) translateX(250%); }
  100% { z-index: -1; -moz-transform: skewX(68deg) translateX(-250%); -o-transform: skewX(68deg) translateX(-250%); -ms-transform: skewX(68deg) translateX(-250%); -webkit-transform: skewX(68deg) translateX(-250%); transform: skewX(68deg) translateX(-250%); } }
@-ms-keyframes comet { 0% { z-index: -1; -moz-transform: skewX(68deg) translateX(250%); -o-transform: skewX(68deg) translateX(250%); -ms-transform: skewX(68deg) translateX(250%); -webkit-transform: skewX(68deg) translateX(250%); transform: skewX(68deg) translateX(250%); }
  100% { z-index: -1; -moz-transform: skewX(68deg) translateX(-250%); -o-transform: skewX(68deg) translateX(-250%); -ms-transform: skewX(68deg) translateX(-250%); -webkit-transform: skewX(68deg) translateX(-250%); transform: skewX(68deg) translateX(-250%); } }
@-o-keyframes comet { 0% { z-index: -1; -moz-transform: skewX(68deg) translateX(250%); -o-transform: skewX(68deg) translateX(250%); -ms-transform: skewX(68deg) translateX(250%); -webkit-transform: skewX(68deg) translateX(250%); transform: skewX(68deg) translateX(250%); }
  100% { z-index: -1; -moz-transform: skewX(68deg) translateX(-250%); -o-transform: skewX(68deg) translateX(-250%); -ms-transform: skewX(68deg) translateX(-250%); -webkit-transform: skewX(68deg) translateX(-250%); transform: skewX(68deg) translateX(-250%); } }
@keyframes comet { 0% { z-index: -1; -moz-transform: skewX(68deg) translateX(250%); -o-transform: skewX(68deg) translateX(250%); -ms-transform: skewX(68deg) translateX(250%); -webkit-transform: skewX(68deg) translateX(250%); transform: skewX(68deg) translateX(250%); }
  100% { z-index: -1; -moz-transform: skewX(68deg) translateX(-250%); -o-transform: skewX(68deg) translateX(-250%); -ms-transform: skewX(68deg) translateX(-250%); -webkit-transform: skewX(68deg) translateX(-250%); transform: skewX(68deg) translateX(-250%); } }
@-webkit-keyframes adaptive { 0% { background-color: white; }
  30% { background-color: #6da6d6; }
  45% { background-color: #07A9FF; }
  60% { background-color: #42ca42; }
  75% { background-color: #1044FF; }
  90% { background-color: yellow; }
  100% { background-color: white; } }
@-moz-keyframes adaptive { 0% { background-color: white; }
  30% { background-color: #6da6d6; }
  45% { background-color: #07A9FF; }
  60% { background-color: #42ca42; }
  75% { background-color: #1044FF; }
  90% { background-color: yellow; }
  100% { background-color: white; } }
@-ms-keyframes adaptive { 0% { background-color: white; }
  30% { background-color: #6da6d6; }
  45% { background-color: #07A9FF; }
  60% { background-color: #42ca42; }
  75% { background-color: #1044FF; }
  90% { background-color: yellow; }
  100% { background-color: white; } }
@-o-keyframes adaptive { 0% { background-color: white; }
  30% { background-color: #6da6d6; }
  45% { background-color: #07A9FF; }
  60% { background-color: #42ca42; }
  75% { background-color: #1044FF; }
  90% { background-color: yellow; }
  100% { background-color: white; } }
@keyframes adaptive { 0% { background-color: white; }
  30% { background-color: #6da6d6; }
  45% { background-color: #07A9FF; }
  60% { background-color: #42ca42; }
  75% { background-color: #1044FF; }
  90% { background-color: yellow; }
  100% { background-color: white; } }
@font-face { font-family: 'Square721DmNormal'; src: url("../fonts/Square721DmNormal.eot"); src: local("Square721DmNormal"), url("../fonts/Square721DmNormal.woff") format("woff"), url("../fonts/Square721DmNormal.ttf") format("truetype"), url("../fonts/Square721DmNormal.svg#htc-icon") format("svg"); }
#hd { font-size: 16px; }
#hd h2 { font-family: "Square721DmNormal", "Roboto", "Microsoft Jhenghei", "Microsoft YaHei", "Segoe UI", "Arial", "Helvetica", sans-serif; font-size: 5.2em; letter-spacing: 3.7vw; line-height: 1; color: #ffffff !important; padding-left: 3.7vw; margin-bottom: .65em; word-break: normal; word-wrap: normal; -moz-transform: scale(1.1, 0.9); -o-transform: scale(1.1, 0.9); -ms-transform: scale(1.1, 0.9); -webkit-transform: scale(1.1, 0.9); transform: scale(1.1, 0.9); }
#hd h3 { font-family: "Square721DmNormal", "Roboto", "Microsoft Jhenghei", "Microsoft YaHei", "Segoe UI", "Arial", "Helvetica", sans-serif; font-size: 1.75em; letter-spacing: 0; line-height: 1.3; color: #ffffff; margin-bottom: .5em; }
#hd h4 { font-family: "Roboto", "Microsoft Jhenghei", "Microsoft YaHei", "Segoe UI", "Arial", "Helvetica", sans-serif; font-size: 1.5em; font-weight: 500; letter-spacing: .018em; line-height: 1.3; color: #ffffff; margin-bottom: .75em; }
#hd h5 { font-family: "Square721DmNormal", "Roboto", "Microsoft Jhenghei", "Microsoft YaHei", "Segoe UI", "Arial", "Helvetica", sans-serif; font-size: .875em; font-weight: 400; line-height: 1.5; color: #ffffff; }
#hd h6 { font-family: "Square721DmNormal", "Roboto", "Microsoft Jhenghei", "Microsoft YaHei", "Segoe UI", "Arial", "Helvetica", sans-serif; font-size: .875em; font-weight: 400; line-height: 1.5; color: #ffffff; }
#hd p, #hd small, #hd a, #hd li { font-family: "Roboto", "Microsoft Jhenghei", "Microsoft YaHei", "Segoe UI", "Arial", "Helvetica", sans-serif; }
#hd p { font-size: 1.25em; line-height: 1.3; font-weight: 300; }
#hd p.color-primary { font-weight: 400; }
#hd b { font-weight: bold; }
#hd small { font-size: .875em; letter-spacing: 0.5px; }
#hd .align-center { text-align: center; }
#hd .align-left { text-align: left; }
#hd .align-italic { font-style: italic; }
#hd a.txt-link { display: inline-block; font: inherit; font-weight: 400; margin-top: .5em; }
#hd a.txt-link:hover { color: white; }
#hd .color-primary { color: #6da6d6; }
#hd .color-secondary { color: #00a0ff; }
#hd .color-grey { color: #777777; }
#hd .color-gradient { display: inline-block; color: #6da6d6 !important; background-color: #6da6d6 0%; background-image: -moz-linear-gradient(90deg, #6da6d6 0%, #bae8ff 38%, #bae8ff 58%, #6da6d6 100%); background-image: -webkit-linear-gradient(90deg, #6da6d6 0%, #bae8ff 38%, #bae8ff 58%, #6da6d6 100%); background-image: linear-gradient(90deg, #6da6d6 0%, #bae8ff 38%, #bae8ff 58%, #6da6d6 100%); -webkit-background-clip: text; -webkit-text-fill-color: transparent; -moz-transform: translate3d(0, 0, 0); -o-transform: translate3d(0, 0, 0); -ms-transform: translate3d(0, 0, 0); -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); }

/*ie11 above fixed*/
_:-ms-fullscreen, :root #hd .color-gradient { background: transparent !important; }

@media screen and (min-width: 2560px) { #hd { font-size: 20px; } }
@media screen and (min-width: 3000px) { #hd { font-size: 28px; } }
@media screen and (max-width: 1024px) { #hd { font-size: 14px; }
  #hd h2 { margin-bottom: .25em; } }
@media screen and (max-width: 768px) { #hd h2 { font-size: 4em; -moz-transform: scale(1, 1); -o-transform: scale(1, 1); -ms-transform: scale(1, 1); -webkit-transform: scale(1, 1); transform: scale(1, 1); } }
@media screen and (max-width: 620px) { #hd h2 { font-size: 3em; } }
@media screen and (max-width: 480px) { #hd h2 { font-size: 1.875em; }
  #hd p { font-size: 1.125em; line-height: 1.5; } }
#hd .w95 { width: 94%; margin: 0 auto; position: relative; }
#hd .hd-w1000, #hd .hd-w1200, #hd .hd-w1400 { width: 80%; max-width: 1200px; margin: 0 auto; position: relative; }
#hd .hd-w1000 { max-width: 1000px; }
#hd .hd-w1400 { max-width: 1400px; }
#hd .hd-mw1200 { max-width: 1200px; }
#hd .hd-col20 { width: 20%; }
#hd .hd-col25 { width: 25%; }
#hd .hd-col33 { width: 33.3333%; }
#hd .hd-col40 { width: 40%; }
#hd .hd-col45 { width: 45%; }
#hd .hd-col50 { width: 50%; }
#hd .hd-col55 { width: 55%; }
#hd .hd-col60 { width: 60%; }
#hd .hd-col65 { width: 65%; }
#hd .hd-col66 { width: 66.6666%; }
#hd .hd-col70 { width: 70%; }
#hd .hd-col75 { width: 75%; }
#hd .hd-col80 { width: 80%; }
#hd .hd-col100 { width: 100%; }
#hd .ib-top { display: inline-block; vertical-align: top; }
#hd .ib-bottom { display: inline-block; vertical-align: bottom; }
#hd .flex-wrap { display: flex; flex-wrap: wrap; }
#hd .flex-nowrap { display: flex; flex-wrap: nowrap; }
#hd .align-items-center { align-items: center; }
#hd .align-items-start { align-items: flex-start; }
#hd .align-items-end { align-items: flex-end; }
#hd .justify-content-center { justify-content: center; }
#hd .justify-content-start { justify-content: flex-start; }
#hd .justify-content-end { justify-content: flex-end; }
#hd .justify-content-between { justify-content: space-between; }
#hd .justify-content-around { justify-content: space-around; }
#hd .flex-row-reverse { flex-direction: row-reverse; }
#hd .hd-d-none { display: none; }
#hd .hd-d-ib { display: inline-block; }
#hd .mx-auto { margin-left: auto; margin-right: auto; }

@media screen and (min-width: 2560px) { #hd .hd-w1000 { max-width: 1200px; }
  #hd .hd-w1200 { max-width: 1400px; }
  #hd .hd-w1400 { max-width: 2000px; }
  #hd .hd-mw1200 { max-width: 1400px; } }
@media screen and (min-width: 3000px) { #hd .hd-w1000 { max-width: 1400px; }
  #hd .hd-w1200 { max-width: 1600px; }
  #hd .hd-w1400 { max-width: 2800px; }
  #hd .hd-mw1200 { max-width: 1600px; } }
@media screen and (max-width: 1024px) { #hd .hd-w1000, #hd .hd-w1200, #hd .hd-w1400 { width: 90%; } }
@media screen and (max-width: 1023px) { #hd .hd-d-1023-none { display: none; }
  #hd .hd-d-1023-block { display: block; }
  #hd .hd-d-1023-inline-block { display: inline-block; } }
@media screen and (max-width: 768px) { #hd .hd-d-768-none { display: none; }
  #hd .hd-d-768-block { display: block; } }
@media screen and (max-width: 620px) { #hd .hd-d-620-none { display: none; }
  #hd .hd-d-620-block { display: block; } }
@media screen and (max-width: 480px) { #hd .hd-d-480-none { display: none; }
  #hd .hd-d-480-block { display: block; } }
#hd .hd-lightbox { width: 100%; height: 100vh; padding: 20px; position: fixed; top: 0; left: 0; display: none; z-index: 10; }
#hd .hd-lightbox .hd-filter { width: 100%; height: 100%; background: black; position: absolute; top: 0; left: 0; }
#hd .hd-lightbox .hd-box { width: 100%; height: auto; max-width: 1280px; max-height: 720px; background: black; position: absolute; top: 50%; left: 50%; -moz-transform: translate(-50%, -50%); -o-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); -webkit-transform: translate(-50%, -50%); transform: translate(-50%, -50%); box-sizing: border-box; }
#hd .hd-lightbox .vid-container { width: 100%; height: 0; padding-bottom: 56.25%; position: relative; }
#hd .hd-lightbox .vid-container iframe { width: 100%; height: 100%; position: absolute; top: 0; right: 0; bottom: 0; left: 0; margin: auto; }
#hd .hd-lightbox .hd-close { width: 60px; height: 60px; background: #777777; position: absolute; top: 0; right: 0; cursor: pointer; z-index: 2; }
#hd .hd-lightbox .hd-close:hover { background: #6da6d6; }
#hd .hd-lightbox .hd-close > span { display: block; width: 24px; height: 2px; background: white; -webkit-border-radius: 1.5px; -moz-border-radius: 1.5px; border-radius: 1.5px; position: absolute; top: 0; right: 0; bottom: 0; left: 0; margin: auto; }
#hd .hd-lightbox .hd-close > span:first-child { -moz-transform: rotateZ(45deg); -o-transform: rotateZ(45deg); -ms-transform: rotateZ(45deg); -webkit-transform: rotateZ(45deg); transform: rotateZ(45deg); }
#hd .hd-lightbox .hd-close > span:last-child { -moz-transform: rotateZ(-45deg); -o-transform: rotateZ(-45deg); -ms-transform: rotateZ(-45deg); -webkit-transform: rotateZ(-45deg); transform: rotateZ(-45deg); }
#hd .trigger-play { cursor: pointer; }

@media screen and (max-width: 1024px) { #hd .hd-lightbox .hd-close { width: 40px; height: 40px; top: 16px; right: 16px; }
  #hd .hd-lightbox .hd-close > span { width: 20px; height: 2px; } }
#hd .scroll-up { position: fixed; right: 0; bottom: 50px; height: 50px; width: 50px; cursor: pointer; background: #fff url(../img/arrow.png) center center no-repeat; opacity: 0; z-index: 5; -moz-transition: opacity 0.4s ease; -o-transition: opacity 0.4s ease; -webkit-transition: opacity 0.4s ease; transition: opacity 0.4s ease; }
#hd .scroll-up.hd-show { opacity: 1; }
#hd .scroll-up:hover { background-color: #6da6d6; }

@media screen and (max-width: 480px) { #hd .scroll-up { width: 48px; height: 48px; bottom: 0; right: 0; } }
#hd .main-title { padding-top: 8.75em; position: relative; overflow: hidden; }
#hd .main-title:before { content: ''; display: block; width: 100%; height: 600px; position: absolute; top: -400px; left: 50%; -moz-transform: translate(-50%, 0); -o-transform: translate(-50%, 0); -ms-transform: translate(-50%, 0); -webkit-transform: translate(-50%, 0); transform: translate(-50%, 0); background: radial-gradient(ellipse at center, #709cc1 0%, rgba(0, 0, 0, 0) 70%); z-index: 0; pointer-events: none; }
#hd .tab-content > div { display: none; padding: 4.75em 0 5em; }
#hd .tab-content > div.hd-active { display: block; }
#hd .tab-content > div.hd-active .reveal-fromBottom { -webkit-animation-delay: 0s; -webkit-animation-duration: 0.8s; -webkit-animation-name: fadeInUp; -webkit-animation-timing-function: ease; -webkit-animation-iteration-count: 1; -webkit-animation-fill-mode: forwards; -moz-animation-delay: 0s; -moz-animation-duration: 0.8s; -moz-animation-name: fadeInUp; -moz-animation-timing-function: ease; -moz-animation-iteration-count: 1; -moz-animation-fill-mode: forwards; -o-animation-delay: 0s; -o-animation-duration: 0.8s; -o-animation-name: fadeInUp; -o-animation-timing-function: ease; -o-animation-iteration-count: 1; -o-animation-fill-mode: forwards; animation-delay: 0s; animation-duration: 0.8s; animation-name: fadeInUp; animation-timing-function: ease; animation-iteration-count: 1; animation-fill-mode: forwards; }
#hd .tab-content > div.hd-active .reveal-fromLeft { -webkit-animation-delay: 0s; -webkit-animation-duration: 0.8s; -webkit-animation-name: fadeInLeft; -webkit-animation-timing-function: ease; -webkit-animation-iteration-count: 1; -webkit-animation-fill-mode: forwards; -moz-animation-delay: 0s; -moz-animation-duration: 0.8s; -moz-animation-name: fadeInLeft; -moz-animation-timing-function: ease; -moz-animation-iteration-count: 1; -moz-animation-fill-mode: forwards; -o-animation-delay: 0s; -o-animation-duration: 0.8s; -o-animation-name: fadeInLeft; -o-animation-timing-function: ease; -o-animation-iteration-count: 1; -o-animation-fill-mode: forwards; animation-delay: 0s; animation-duration: 0.8s; animation-name: fadeInLeft; animation-timing-function: ease; animation-iteration-count: 1; animation-fill-mode: forwards; }
#hd .title-tab { width: 100%; position: relative; overflow: hidden; z-index: 3; }
#hd .title-tab:after { content: ''; width: 100%; height: 1px; position: absolute; bottom: 0; left: 0; right: 0; background-color: #6da6d6 0%; background-image: -moz-linear-gradient(90deg, #6da6d6 0%, #bae8ff 38%, #bae8ff 58%, #6da6d6 100%); background-image: -webkit-linear-gradient(90deg, #6da6d6 0%, #bae8ff 38%, #bae8ff 58%, #6da6d6 100%); background-image: linear-gradient(90deg, #6da6d6 0%, #bae8ff 38%, #bae8ff 58%, #6da6d6 100%); }
#hd .title-tab ul { max-width: 100%; display: inline-flex; align-items: stretch; text-align: center; position: relative; overflow-x: auto; overflow-y: visible; -ms-overflow-style: none; }
#hd .title-tab ul::-webkit-scrollbar { height: 0; }
#hd .title-tab ul::-webkit-scrollbar-track { background: transparent; }
#hd .title-tab ul::-webkit-scrollbar-thumb { background: transparent; }
#hd .title-tab ul::-webkit-scrollbar-thumb:hover { background: transparent; }
#hd .title-tab li { display: flex; align-items: center; justify-content: center; font-family: "Square721DmNormal", "Roboto", "Microsoft Jhenghei", "Microsoft YaHei", "Segoe UI", "Arial", "Helvetica", sans-serif; font-size: 1.15em; font-weight: normal; letter-spacing: .1em; white-space: nowrap; flex: 0 0 auto; color: rgba(255, 255, 255, 0.8); padding: 1.5em 1.125em 1.6em 1.225em; position: relative; cursor: pointer; -moz-transition: color 0.25s ease; -o-transition: color 0.25s ease; -webkit-transition: color 0.25s ease; transition: color 0.25s ease; }
#hd .title-tab li:after { content: ''; display: block; width: calc(100% - 1em); height: 6px; background: black; position: absolute; bottom: 0; left: 0; right: 0; margin: 0 auto; transform-origin: left bottom; -moz-transform: scale(1, 0); -o-transform: scale(1, 0); -ms-transform: scale(1, 0); -webkit-transform: scale(1, 0); transform: scale(1, 0); -moz-transition: transform 0.25s ease-out; -o-transition: transform 0.25s ease-out; -webkit-transition: transform 0.25s ease-out; transition: transform 0.25s ease-out; background-color: #6da6d6 0%; background-image: -moz-linear-gradient(90deg, #6da6d6 0%, #bae8ff 38%, #bae8ff 58%, #6da6d6 100%); background-image: -webkit-linear-gradient(90deg, #6da6d6 0%, #bae8ff 38%, #bae8ff 58%, #6da6d6 100%); background-image: linear-gradient(90deg, #6da6d6 0%, #bae8ff 38%, #bae8ff 58%, #6da6d6 100%); }
#hd .title-tab li:hover { color: white; }
#hd .title-tab li.hd-active { color: white; pointer-events: none; }
#hd .title-tab li.hd-active:after { -moz-transform: scale(1, 1); -o-transform: scale(1, 1); -ms-transform: scale(1, 1); -webkit-transform: scale(1, 1); transform: scale(1, 1); }

@media screen and (max-width: 1024px) { #hd .main-title { padding-top: 6em; }
  #hd .tab-content > div { padding: 4em 0 4em; } }
@media screen and (max-width: 480px) { #hd .main-title { padding-top: 3.5em; }
  #hd .title-tab li { font-size: 1.35em; letter-spacing: .018em; }
  #hd .title-tab li.hd-active:after { height: 4px; } }
#hd .sec-cooling figure, #hd .sec-engineering figure, #hd .sec-software figure, #hd .sec-experience figure { position: relative; overflow: hidden; }
#hd .sec-cooling figure.trigger-video, #hd .sec-engineering figure.trigger-video, #hd .sec-software figure.trigger-video, #hd .sec-experience figure.trigger-video { cursor: pointer; }
#hd .sec-cooling figure.trigger-video:hover .btn-play, #hd .sec-engineering figure.trigger-video:hover .btn-play, #hd .sec-software figure.trigger-video:hover .btn-play, #hd .sec-experience figure.trigger-video:hover .btn-play { opacity: .5; }
#hd .sec-cooling figure.trigger-video-toggle:hover .vid-control, #hd .sec-engineering figure.trigger-video-toggle:hover .vid-control, #hd .sec-software figure.trigger-video-toggle:hover .vid-control, #hd .sec-experience figure.trigger-video-toggle:hover .vid-control { opacity: 1; }
#hd .sec-cooling figure.trigger-video-toggle .vid-control, #hd .sec-engineering figure.trigger-video-toggle .vid-control, #hd .sec-software figure.trigger-video-toggle .vid-control, #hd .sec-experience figure.trigger-video-toggle .vid-control { cursor: pointer; }
#hd .sec-cooling figure.trigger-video-toggle .vid-control:focus, #hd .sec-engineering figure.trigger-video-toggle .vid-control:focus, #hd .sec-software figure.trigger-video-toggle .vid-control:focus, #hd .sec-experience figure.trigger-video-toggle .vid-control:focus { opacity: 1; }
#hd .sec-cooling .hd-content, #hd .sec-engineering .hd-content, #hd .sec-software .hd-content, #hd .sec-experience .hd-content { padding: 0 4%; }
#hd .sec-cooling .hd-content h3 + p, #hd .sec-engineering .hd-content h3 + p, #hd .sec-software .hd-content h3 + p, #hd .sec-experience .hd-content h3 + p { margin-bottom: 1em; }
#hd .sec-cooling .flex-row-reverse .hd-content, #hd .sec-engineering .flex-row-reverse .hd-content, #hd .sec-software .flex-row-reverse .hd-content, #hd .sec-experience .flex-row-reverse .hd-content { padding-left: 6%; }
#hd .sec-cooling .btn-play, #hd .sec-engineering .btn-play, #hd .sec-software .btn-play, #hd .sec-experience .btn-play { width: 10%; max-width: 80px; position: absolute; top: 50%; left: 50%; -moz-transform: translate(-50%, -50%); -o-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); -webkit-transform: translate(-50%, -50%); transform: translate(-50%, -50%); -moz-transition: all 0.3s ease-out; -o-transition: all 0.3s ease-out; -webkit-transition: all 0.3s ease-out; transition: all 0.3s ease-out; }
#hd .sec-cooling .vid-control, #hd .sec-engineering .vid-control, #hd .sec-software .vid-control, #hd .sec-experience .vid-control { width: 10%; max-width: 80px; background: none; border: none; box-shadow: none; position: absolute; right: 0; bottom: 0; -moz-transition: all 0.3s ease-out; -o-transition: all 0.3s ease-out; -webkit-transition: all 0.3s ease-out; transition: all 0.3s ease-out; opacity: 0; }
#hd .sec-cooling .vid-control .play, #hd .sec-engineering .vid-control .play, #hd .sec-software .vid-control .play, #hd .sec-experience .vid-control .play { display: none; }
#hd .sec-cooling .vid-control.hd-active .play, #hd .sec-engineering .vid-control.hd-active .play, #hd .sec-software .vid-control.hd-active .play, #hd .sec-experience .vid-control.hd-active .play { display: block; }
#hd .sec-cooling .vid-control.hd-active .pause, #hd .sec-engineering .vid-control.hd-active .pause, #hd .sec-software .vid-control.hd-active .pause, #hd .sec-experience .vid-control.hd-active .pause { display: none; }

#hd .main-kv { display: flex; flex-direction: column; justify-content: center; align-items: flex-end; position: relative; }
#hd .main-kv .hd-container { display: flex; flex-direction: column; justify-content: center; align-items: flex-end; padding: 3em 0; position: absolute; top: 0; right: 0; bottom: 0; left: 0; margin: auto; }
#hd .main-kv .hd-content { margin-bottom: 5%; }
#hd .main-kv h2 { font-size: 2em; letter-spacing: 0; padding-left: 0; margin-bottom: .5em; -moz-transform: none; -o-transform: none; -ms-transform: none; -webkit-transform: none; transform: none; }
#hd .main-kv p { text-shadow: 0 0 2px black, 0 0 5px black, 0 0 15px black; }
#hd .main-kv .color-grey { color: #888888; }
#hd .sec-cooling .tab-validation img, #hd .sec-engineering .tab-validation img, #hd .sec-software .tab-validation img, #hd .sec-experience .tab-validation img { width: 100%; max-width: 500px !important; margin: 0 auto; }
#hd .tab-certification img { max-width: 1100px !important; margin: 0 auto 2em; }
#hd .tab-aura .hd-colorpicker { width: 140px; margin-top: 1em; margin-left: auto; }
#hd .tab-aura .hd-controls { width: calc(100% - 140px); max-width: 810px; padding: 0 .5em; margin-right: auto; text-align: center; position: relative; z-index: 2; }
#hd .tab-aura .hd-controls li { width: 20%; padding: .5em; margin-bottom: 1em; cursor: pointer; opacity: .6; -moz-transition: opacity 0.25s ease; -o-transition: opacity 0.25s ease; -webkit-transition: opacity 0.25s ease; transition: opacity 0.25s ease; }
#hd .tab-aura .hd-controls li:hover, #hd .tab-aura .hd-controls li.hd-active { opacity: 1; }
#hd .tab-aura .hd-controls li.hd-active .hd-icon { background-position: 0 0; }
#hd .tab-aura .hd-controls .hd-icon { width: 72px; height: 72px; margin: 0 auto .5em; background-size: 200%; background-repeat: no-repeat; background-position: 100% 0; }
#hd .tab-aura .hd-controls .hd-icon.hd-icon-static { background-image: url(../img/aura/static.png); }
#hd .tab-aura .hd-controls .hd-icon.hd-icon-breathing { background-image: url(../img/aura/breathing.png); }
#hd .tab-aura .hd-controls .hd-icon.hd-icon-strobing { background-image: url(../img/aura/strobing.png); }
#hd .tab-aura .hd-controls .hd-icon.hd-icon-cycle { background-image: url(../img/aura/cycle.png); }
#hd .tab-aura .hd-controls .hd-icon.hd-icon-music { background-image: url(../img/aura/music.png); }
#hd .tab-aura .hd-controls .hd-icon.hd-icon-smart { background-image: url(../img/aura/smart.png); }
#hd .tab-aura .hd-controls .hd-icon.hd-icon-starry { background-image: url(../img/aura/starry.png); }
#hd .tab-aura .hd-controls .hd-icon.hd-icon-rainbow { background-image: url(../img/aura/rainbow.png); }
#hd .tab-aura .hd-controls .hd-icon.hd-icon-dark { background-image: url(../img/aura/dark.png); }
#hd .tab-aura .hd-controls .hd-icon.hd-icon-adaptive { background-image: url(../img/aura/adaptive.png); }
#hd .tab-aura .hd-controls h4 { font-family: "Roboto", "Microsoft Jhenghei", "Microsoft YaHei", "Segoe UI", "Arial", "Helvetica", sans-serif; font-size: 1.25em; font-weight: 400; letter-spacing: 0; margin-bottom: .25em; }
#hd .tab-aura .hd-controls p { font-size: .875em; line-height: 1.25; }
#hd .tab-aura .hd-controls-name { padding: 0 0 0 1em; }
#hd .tab-aura .hd-controls-name li { display: none; }
#hd .tab-aura .hd-controls-name li.hd-active { display: block; -webkit-animation-delay: 0s; -webkit-animation-duration: 0.4s; -webkit-animation-name: fadeInUp; -webkit-animation-timing-function: ease; -webkit-animation-iteration-count: 1; -webkit-animation-fill-mode: forwards; -moz-animation-delay: 0s; -moz-animation-duration: 0.4s; -moz-animation-name: fadeInUp; -moz-animation-timing-function: ease; -moz-animation-iteration-count: 1; -moz-animation-fill-mode: forwards; -o-animation-delay: 0s; -o-animation-duration: 0.4s; -o-animation-name: fadeInUp; -o-animation-timing-function: ease; -o-animation-iteration-count: 1; -o-animation-fill-mode: forwards; animation-delay: 0s; animation-duration: 0.4s; animation-name: fadeInUp; animation-timing-function: ease; animation-iteration-count: 1; animation-fill-mode: forwards; }
#hd .tab-aura .hd-controls-name p { font-size: 14px; }
#hd .tab-aura .hd-img-container { width: 100%; max-width: 620px; margin: 0 auto; }
#hd .tab-aura .hd-img-container figure { width: 100%; height: 0; padding-bottom: 80.6452%; margin-bottom: 2em; position: relative; overflow: hidden; }
#hd .tab-aura .hd-pd, #hd .tab-aura .hd-color, #hd .tab-aura .hd-greybg { width: 100%; height: 100%; position: absolute; top: 0; right: 0; bottom: 0; left: 0; }
#hd .tab-aura .hd-color, #hd .tab-aura .hd-greybg { width: 98%; height: 98%; top: 0; right: 0; bottom: 0; left: 0; margin: auto; z-index: -1; }
#hd .tab-aura .hd-greybg { background-color: #515151; z-index: -2; }
#hd .tab-aura .hd-dark { opacity: 0; }
#hd .tab-aura .hd-starryNight .starry_night { display: block; }
#hd .tab-aura .starry_night { display: none; }
#hd .tab-aura .starry_night li { width: 10%; height: 0; padding-bottom: 10%; background-color: #FFF; background: radial-gradient(circle, rgba(255, 255, 255, 0.7), rgba(255, 255, 255, 0) 50%); position: absolute; top: 28%; -webkit-animation-delay: 0s; -webkit-animation-duration: 3s; -webkit-animation-name: breathing; -webkit-animation-timing-function: ease; -webkit-animation-iteration-count: infinite; -webkit-animation-fill-mode: forwards; -moz-animation-delay: 0s; -moz-animation-duration: 3s; -moz-animation-name: breathing; -moz-animation-timing-function: ease; -moz-animation-iteration-count: infinite; -moz-animation-fill-mode: forwards; -o-animation-delay: 0s; -o-animation-duration: 3s; -o-animation-name: breathing; -o-animation-timing-function: ease; -o-animation-iteration-count: infinite; -o-animation-fill-mode: forwards; animation-delay: 0s; animation-duration: 3s; animation-name: breathing; animation-timing-function: ease; animation-iteration-count: infinite; animation-fill-mode: forwards; }
#hd .tab-aura .starry_night li:nth-child(1) { top: 38%; left: 17%; -webkit-animation-delay: -2s; -webkit-animation-duration: 3s; -webkit-animation-name: breathing; -webkit-animation-timing-function: ease; -webkit-animation-iteration-count: infinite; -webkit-animation-fill-mode: forwards; -moz-animation-delay: -2s; -moz-animation-duration: 3s; -moz-animation-name: breathing; -moz-animation-timing-function: ease; -moz-animation-iteration-count: infinite; -moz-animation-fill-mode: forwards; -o-animation-delay: -2s; -o-animation-duration: 3s; -o-animation-name: breathing; -o-animation-timing-function: ease; -o-animation-iteration-count: infinite; -o-animation-fill-mode: forwards; animation-delay: -2s; animation-duration: 3s; animation-name: breathing; animation-timing-function: ease; animation-iteration-count: infinite; animation-fill-mode: forwards; }
#hd .tab-aura .starry_night li:nth-child(2) { top: 49%; left: 24%; }
#hd .tab-aura .starry_night li:nth-child(3) { top: 58%; left: 43%; -webkit-animation-delay: -1s; -webkit-animation-duration: 3s; -webkit-animation-name: breathing; -webkit-animation-timing-function: ease; -webkit-animation-iteration-count: infinite; -webkit-animation-fill-mode: forwards; -moz-animation-delay: -1s; -moz-animation-duration: 3s; -moz-animation-name: breathing; -moz-animation-timing-function: ease; -moz-animation-iteration-count: infinite; -moz-animation-fill-mode: forwards; -o-animation-delay: -1s; -o-animation-duration: 3s; -o-animation-name: breathing; -o-animation-timing-function: ease; -o-animation-iteration-count: infinite; -o-animation-fill-mode: forwards; animation-delay: -1s; animation-duration: 3s; animation-name: breathing; animation-timing-function: ease; animation-iteration-count: infinite; animation-fill-mode: forwards; }
#hd .tab-aura .starry_night li:nth-child(4) { top: 65%; left: 45%; -webkit-animation-delay: -2s; -webkit-animation-duration: 3s; -webkit-animation-name: breathing; -webkit-animation-timing-function: ease; -webkit-animation-iteration-count: infinite; -webkit-animation-fill-mode: forwards; -moz-animation-delay: -2s; -moz-animation-duration: 3s; -moz-animation-name: breathing; -moz-animation-timing-function: ease; -moz-animation-iteration-count: infinite; -moz-animation-fill-mode: forwards; -o-animation-delay: -2s; -o-animation-duration: 3s; -o-animation-name: breathing; -o-animation-timing-function: ease; -o-animation-iteration-count: infinite; -o-animation-fill-mode: forwards; animation-delay: -2s; animation-duration: 3s; animation-name: breathing; animation-timing-function: ease; animation-iteration-count: infinite; animation-fill-mode: forwards; }
#hd .tab-aura .starry_night li:nth-child(5) { left: 23%; top: 50%; -webkit-animation-delay: -1s; -webkit-animation-duration: 3s; -webkit-animation-name: breathing; -webkit-animation-timing-function: ease; -webkit-animation-iteration-count: infinite; -webkit-animation-fill-mode: forwards; -moz-animation-delay: -1s; -moz-animation-duration: 3s; -moz-animation-name: breathing; -moz-animation-timing-function: ease; -moz-animation-iteration-count: infinite; -moz-animation-fill-mode: forwards; -o-animation-delay: -1s; -o-animation-duration: 3s; -o-animation-name: breathing; -o-animation-timing-function: ease; -o-animation-iteration-count: infinite; -o-animation-fill-mode: forwards; animation-delay: -1s; animation-duration: 3s; animation-name: breathing; animation-timing-function: ease; animation-iteration-count: infinite; animation-fill-mode: forwards; }
#hd .tab-aura .starry_night li:nth-child(6) { left: 50%; top: 50%; -webkit-animation-delay: 0s; -webkit-animation-duration: 3s; -webkit-animation-name: breathing; -webkit-animation-timing-function: ease; -webkit-animation-iteration-count: infinite; -webkit-animation-fill-mode: forwards; -moz-animation-delay: 0s; -moz-animation-duration: 3s; -moz-animation-name: breathing; -moz-animation-timing-function: ease; -moz-animation-iteration-count: infinite; -moz-animation-fill-mode: forwards; -o-animation-delay: 0s; -o-animation-duration: 3s; -o-animation-name: breathing; -o-animation-timing-function: ease; -o-animation-iteration-count: infinite; -o-animation-fill-mode: forwards; animation-delay: 0s; animation-duration: 3s; animation-name: breathing; animation-timing-function: ease; animation-iteration-count: infinite; animation-fill-mode: forwards; }
#hd .tab-aura .starry_night li:nth-child(7) { left: 40%; top: 77%; -webkit-animation-delay: -2s; -webkit-animation-duration: 3s; -webkit-animation-name: breathing; -webkit-animation-timing-function: ease; -webkit-animation-iteration-count: infinite; -webkit-animation-fill-mode: forwards; -moz-animation-delay: -2s; -moz-animation-duration: 3s; -moz-animation-name: breathing; -moz-animation-timing-function: ease; -moz-animation-iteration-count: infinite; -moz-animation-fill-mode: forwards; -o-animation-delay: -2s; -o-animation-duration: 3s; -o-animation-name: breathing; -o-animation-timing-function: ease; -o-animation-iteration-count: infinite; -o-animation-fill-mode: forwards; animation-delay: -2s; animation-duration: 3s; animation-name: breathing; animation-timing-function: ease; animation-iteration-count: infinite; animation-fill-mode: forwards; }

@media screen and (min-width: 2560px) { #hd .tab-certification img { max-width: 800px !important; }
  #hd .tab-aura .hd-img-container { max-width: 800px; }
  #hd .tab-aura .hd-controls { max-width: 1520px; } }
@media screen and (max-width: 1440px) { #hd .main-kv figure img { width: 110%; max-height: none !important; margin-left: -2%; }
  #hd .main-kv p { font-size: 1em; }
  #hd .tab-aura .hd-controls p { font-size: .9em; } }
@media screen and (max-width: 1280px) { #hd .main-kv .hd-container { width: 90%; } }
@media screen and (max-width: 1024px) { #hd .main-kv figure { position: relative; overflow: hidden; }
  #hd .main-kv figure img { width: 155%; max-width: none !important; }
  #hd .main-kv .hd-container { position: relative; }
  #hd .main-kv .hd-content { width: 100%; padding: 2em 0 4em; margin-bottom: 0; } }
@media screen and (max-width: 768px) { #hd .sec-cooling .hd-container, #hd .sec-engineering .hd-container, #hd .sec-software .hd-container, #hd .sec-experience .hd-container { width: 90%; margin: 0 auto; flex-direction: column; }
  #hd .sec-cooling .hd-container figure, #hd .sec-engineering .hd-container figure, #hd .sec-software .hd-container figure, #hd .sec-experience .hd-container figure { width: 100%; }
  #hd .sec-cooling .hd-container .hd-content, #hd .sec-engineering .hd-container .hd-content, #hd .sec-software .hd-container .hd-content, #hd .sec-experience .hd-container .hd-content { width: 100%; padding: 2em 0; }
  #hd .tab-aura .hd-colorpicker { width: 110px; }
  #hd .tab-aura .hd-colorpicker .farbtastic, #hd .tab-aura .hd-colorpicker canvas { width: 110px !important; height: 110px !important; }
  #hd .tab-aura .hd-colorpicker .farbtastic-solid { width: 58px !important; height: 58px !important; top: 26px !important; left: 26px !important; }
  #hd .tab-aura .hd-controls .hd-icon { width: 60px; height: 60px; } }
@media screen and (max-width: 620px) { #hd .main-kv .hd-container { padding: 0; }
  #hd .tab-aura .control-container { flex-direction: column; align-items: center; justify-content: flex-start; }
  #hd .tab-aura .hd-colorpicker { margin-right: auto; }
  #hd .tab-aura .hd-controls { width: 100%; padding: 0; margin-top: 1em; margin-left: auto; justify-content: center; }
  #hd .tab-certification img { margin-bottom: 0; } }
@media screen and (max-width: 480px) { #hd .tab-aura .hd-controls li { width: 33.3333%; margin-bottom: .5em; }
  #hd .tab-aura .hd-controls h4 { font-size: 1.125em; } }

/*# sourceMappingURL=hd-style.css.map */