::-webkit-scrollbar {width:0; height:.1vw}
::-webkit-scrollbar-track {background-color:#686868}
@font-face {font-family: 'HDfont';src:url(HDfont.ttf)}
@keyframes waves-move {0% {transform: translate3d(-90px,0,0)} 100% {transform: translate3d(85px,0,0)}}
@keyframes fadeInAnimation {0% {opacity: 0;} 36.8% {opacity: 0;} 100% {opacity: 1;}}
* {margin:0; padding:0; border:0}
*:focus {outline:none}
a {text-decoration:none; cursor:pointer}
b {font-weight:normal; font-family: 'HDfont', Calibri, Arial}
body {color:#383838; font-family:"Arial",sans-serif; font-size:1.2vw; line-height:1.68vw; font-weight:400; -webkit-touch-callout:none; -webkit-user-select:none; -moz-user-select:none; -ms-user-select:none; -o-user-select:none; user-select:none}
button {color:#fff!important; font-family:Calibri; font-size:1.5vw; font-weight:bold; padding:.38vw 1.3vw .4vw 1.3vw; border-radius:.36vw; cursor:pointer; box-shadow:0 2px 3px #888}
h1 {font-size:3.68vw; line-height:3.86vw; font-family: 'HDfont', Calibri, Arial; font-weight:normal; text-shadow:2px 2px 2px #fff, 3px 3px 3px #333638}
h2 {font-family: 'HDfont', Calibri, Arial; font-size:2.5vw; line-height:3.68vw; font-weight:normal; text-transform:uppercase}
h3 {font-size:1.68vw; line-height:2vw; font-weight:bold; color:#fff}
header {height:6.8vw; box-shadow:0 0 .68vw #131618}
hr {width:20vw; margin:1vw 23.2vw; height:1px; border:0; padding:0}
html {height:100%}
iframe {width:100vw; height:30vw}
img {border:0; max-width:100%}
input {box-shadow:0 1px 2px rgba(68,68,68,.68); color:#000; font-size:1.2vw; padding:.9vw 1vw .68vw 1vw; width:23vw; margin:1vw 0 1.68vw 0; border-radius:.36vw; border:0; box-shadow:0 2px 3px #888}
input[type=number]::-webkit-inner-spin-button, input[type=number]::-webkit-outer-spin-button {-webkit-appearance: none; -moz-appearance: none; appearance: none}
table {width:100%}
td {padding:.86vw; background:#fff}
th {text-align:center; font-weight:bold; line-height:3.2vw; padding:.0 .86vw; white-space:nowrap !important; color:#fff}
.HDbanner {height:40vw; width:100vw}
.HDcopy {background:rgba(0,0,0,.9); line-height:3vw; padding:0 6vw; text-align:left; color:#aaa}
.HDcopy a {float:right; color:#666; font-size:1vw}
.HDclear {clear:both; line-height:0; height:0; margin:0; padding:0}
.HDclose {width:2vw; height:2vw; position:fixed; z-index:999999; top:8vh; right:16vw; opacity:0;}
.HDfooter {float:left; width:30vw; margin:0 0 0 6vw; text-align:left; font-size:1.2vw; line-height:2vw; color:#fff}
.HDfooter hr {margin:1vw 0; width:10vw; background-image: -webkit-linear-gradient(left,rgba(255,255,255,1) 0%,rgba(255,255,255,0) 100%); background-image: -moz-linear-gradient(left,rgba(255,255,255,1) 0%,rgba(255,255,255,0) 100%); background-image: linear-gradient(left,rgba(255,255,255,1) 0%,rgba(255,255,255,0) 100%)}
.HDfooter img {height:3.68vw; width:auto}
.HDform {text-align:center; position:relative; z-index:1; padding:16.8vw; margin:-13vw 0; line-height:1.86vw}
.HDgallery {width:100vw; height:31.8vw; position:relative; z-index:9; animation: fadeInAnimation ease 2s; animation-iteration-count: 1; animation-fill-mode: forwards}
.HDgallery-img {width:50vw; height:28vw; margin:0; padding:0; position:relative; -webkit-transform-style:preserve-3d; -moz-transform-style: preserve-3d; -o-transform-style: preserve-3d;-ms-transform-style: preserve-3d; transform-style:preserve-3d; -webkit-perspective:68vw; -moz-perspective:68vw; -o-perspective:68vw; -ms-perspective:68vw; perspective:68vw}
.HDgallery-img img {background:#000; width:50vw; height:28vw; border:solid .15vw #000; border-radius:.68vw; display:block; position:absolute; left:0; top:0; box-shadow:0 1.68vw 3.68vw #000}
.HDgallery-img img.HDtransition {-webkit-transition: all .86s ease-in-out;-moz-transition:all .86s ease-in-out; -o-transition:all .86s ease-in-out; -ms-transition:all .86s ease-in-out; transition:all .86s ease-in-out}
.HDgallery nav {width:6.8vw; position:absolute; z-index:1000; bottom:0; left:50%; margin-left:-2vw}
.HDgallery nav span{text-indent: -200vw; float: left; cursor:pointer; width:1.68vw; height:1.86vw; opacity:.68; background:transparent url("/HDImage/skin/arrows.png") no-repeat top left; background-size:auto 100%}
.HDgallery nav span:hover{opacity: 1}
.HDgallery nav span.HDnext{background-position:top right; margin-left:1vw}
.HDintro {text-align:center; font-size:1.36vw; position:relative; z-index:1; padding: 3.68vw 16.8vw; line-height:2vw}
.HDmaps {opacity:0.8; float:right; width:55vw; margin:0 6vw -6vw 0; border-radius:5px}
.HDmaps iframe {width:55vw; height:16.8vw; border:0; border-radius:5px; margin-bottom:-.5vw}
.HDpattern {padding:0 0 10vw 0}
.HDservice {color:#fff; float:left; text-align:center; width:25vw; margin:3.68vw 0 3.68vw 6.33vw}
.HDservice hr {width:10vw; margin:1vw 7.5vw; background-image: -webkit-linear-gradient(left,rgba(255,255,255,0) 5%,rgba(255,255,255,1),rgba(255,255,255,0) 95%); background-image: -moz-linear-gradient(left,rgba(255,255,255,0) 5%,rgba(255,255,255,1),rgba(255,255,255,0) 95%); background-image: linear-gradient(left,rgba(255,255,255,0) 5%,rgba(255,255,255,1),rgba(255,255,255,0) 95%)}
.HDservice img {width:auto; height:5vw; margin-bottom:1.68vw}
.HDservice .close {width:2vw; line-height:2vw; background:red; color:#fff; border-radius:100%; text-align:center; position:absolute; top:8vh; right:16vw; cursor:pointer}
.HDservice .content {opacity:0; margin-top:-100vh; width:100vw; height:100vh; background:rgba(0,0,0,.68); position:fixed; z-index:99999; top:0; left:0; moz-transition:all .5s ease-in-out; -webkit-transition:all .5s ease-in-out; -o-transition:all .5s ease-in-out; -ms-transition:all .5s ease-in-out; transition:all .5s ease-in-out}
.HDservice .detail {width:60vw; height:70vh; padding:5vh 3vw; margin:10vh 17vw; background:#fff; color:#383838; text-align:justify; overflow-y:scroll}
.HDservice .detail img {width:60vw; height:auto}
.HDservice .title {font-size:2vw; line-height:2.5vw; font-family: 'HDfont', Calibri, Arial;}
.HDservice .desc {font-family: 'HDfont', Calibri, Arial; font-size:1.3vw; margin:1vw 0; font-weight:normal}
.HDservice span:hover> .content {opacity:1; margin:0}
.HDtitle {padding:10vw 16.8vw .68vw 16.8vw; text-align:center}
.HDtitle h2 {color:#fff!important}
.HDtitle hr {background-image: -webkit-linear-gradient(left,rgba(255,255,255,0) 5%,rgba(255,255,255,1),rgba(255,255,255,0) 95%); background-image: -moz-linear-gradient(left,rgba(255,255,255,0) 5%,rgba(255,255,255,1),rgba(255,255,255,0) 95%); background-image: linear-gradient(left,rgba(255,255,255,0) 5%,rgba(255,255,255,1),rgba(255,255,255,0) 95%)}
.HDwaves {width:100vw; height:10vw; margin:-10vw 0 3.68vw 0}
.HDw-180 {transform: rotate(180deg); margin-bottom:-10vw}
.HDwparallax > use {animation: waves-move 25s cubic-bezier(.55,.5,.45,.5) infinite}
.HDwparallax > use:nth-child(1) {animation-delay: -2s; animation-duration: 7s}
.HDwparallax > use:nth-child(2) {animation-delay: -3s; animation-duration: 10s}
.HDwparallax > use:nth-child(3) {animation-delay: -4s; animation-duration: 13s}
.HDwparallax > use:nth-child(4) {animation-delay: -5s; animation-duration: 20s}
.HDzalo {margin-top:1.3vw; padding:.5vw 1.36vw; background:url(/HDImage/skin/zalo.png) center; background-size:100% 100%; border:solid .1vw #0072b2; moz-transition:all .3s ease-in-out; -webkit-transition:all .3s ease-in-out; -o-transition:all .3s ease-in-out; -ms-transition:all .3s ease-in-out; transition:all .3s ease-in-out}
.HDzalo:hover {background:url(/HDImage/skin/zalo.png) center; background-size:110% 110%;border:solid .1vw #0072b2}