

@charset "utf-8";
@font-face {
    font-family: "UTMAvo";
    src: url("https://duanonline.com.vn/font/UTM_Avo.ttf");
    font-style: normal;
}
@font-face {
    font-family: "UTMAvo";
    src: url("https://duanonline.com.vn/font/UTM_AvoItalic.ttf");
    font-style: italic;
}

@font-face {
    font-family: "UTMAvo";
    font-weight: 700;
    src: url("https://duanonline.com.vn/font/UTM_AvoBold.ttf");
}
@font-face {
    font-family: "UTMAvo";
    font-weight: 700;
    src: url("https://duanonline.com.vn/font/UTM_AvoBoldItalic.ttf");
    font-style: italic;
}

@font-face{	font-family: 'K2D';	src: url('https://duanonline.com.vn/font/K2D-Regular.ttf') format('truetype');	font-weight: 400;}
@font-face{	font-family: 'K2D';	src: url('https://duanonline.com.vn/font/K2D-Bold.ttf') format('truetype');	font-weight: 700;}

@font-face {
  font-family: 'Anton';
  font-style: normal;
  font-weight: 400;
  src: url(https://fonts.gstatic.com/s/anton/v23/1Ptgg87LROyAm3K8-C8QSw.woff2) format('woff2');
  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+1EA0-1EF9, U+20AB;
}
/* latin-ext */
@font-face {
  font-family: 'Anton';
  font-style: normal;
  font-weight: 400;
  src: url(https://fonts.gstatic.com/s/anton/v23/1Ptgg87LROyAm3K9-C8QSw.woff2) format('woff2');
  unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Anton';
  font-style: normal;
  font-weight: 400;
  src: url(https://fonts.gstatic.com/s/anton/v23/1Ptgg87LROyAm3Kz-C8.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face{	font-family: 'K2D';	src: url('https://duanonline.com.vn/font/K2D-Regular.ttf') format('truetype');	font-weight: 400;font-display: swap;}
@font-face{	font-family: 'K2D';	src: url('https://duanonline.com.vn/font/K2D-Bold.ttf') format('truetype');	font-weight: 700;font-display: swap;}


@font-face {
    font-family: 'Oswald';
    src: url('https://duanonline.com.vn/font/Oswald-Bold.woff2') format('woff2'),
    url('https://duanonline.com.vn/font/Oswald-Bold.woff') format('woff');
    font-weight: bold;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Oswald';
    src: url('https://duanonline.com.vn/font/Oswald-ExtraLight.woff2') format('woff2'),
    url('https://duanonline.com.vn/font/Oswald-ExtraLight.woff') format('woff');
    font-weight: 200;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Oswald';
    src: url('https://duanonline.com.vn/font/Oswald-Light.woff2') format('woff2'),
    url('https://duanonline.com.vn/font/Oswald-Light.woff') format('woff');
    font-weight: 300;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Oswald';
    src: url('https://duanonline.com.vn/font/Oswald-Medium.woff2') format('woff2'),
    url('https://duanonline.com.vn/font/Oswald-Medium.woff') format('woff');
    font-weight: 500;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Oswald';
    src: url('https://duanonline.com.vn/font/Oswald-Regular.woff2') format('woff2'),
    url('https://duanonline.com.vn/font/Oswald-Regular.woff') format('woff');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Oswald';
    src: url('https://duanonline.com.vn/font/Oswald-SemiBold.woff2') format('woff2'),
    url('https://duanonline.com.vn/font/Oswald-SemiBold.woff') format('woff');
    font-weight: 600;
    font-style: normal;
    font-display: swap;
}


body { font-family: K2D;  margin: 0px; padding: 0px; font-size: 18px; line-height: 1.8; overflow-x: hidden; font-weight: 400;color: #444444; }
html,
body{font-size: 16px;}
/*----------------------
1.1. Typography
------------------------------*/
h1, h2, h3, h4, h5, h6 { font-family: 'Oswald'; color: #0b84ae; margin: 0 auto 20px; font-weight: 600; line-height: 1.4; }
h1 { font-size: 50px; }
h2 { font-size: 30px; }
h3 { font-size: 24px; }
h4 { font-size: 20px; margin-bottom: 15px; }
h5 { font-size: 18px; margin-bottom: 15px; }
h6 { font-size: 16px; margin-bottom: 10px; }
p { /*font-size: 15px;
margin-bottom: 20px;*/ }
a { transition-duration: 0.5s; -moz-transition-duration: 0.5s; -o-transition-duration: 0.5s; -webkit-transition-duration: 0.5s; -ms-transition-duration: 0.5s; text-decoration: none; color: #444444; }
a:hover, a:focus { text-decoration: none; outline: none; color: #0a5597; }
ul, ol { margin: 0 auto 20px; }
ul li, ol li {margin: 0 auto 10px;}

b,strong{font-weight: 700;}
blockquote { background: #f5f5f5; }
*:focus,button:focus {
  outline: none;
}
.white-text,
.white-text h1,
.white-text h2,
.white-text h3,
.white-text h4,
.white-text h5,
.white-text h6,
.white-text p,
.white-text.section-header p { color: #fff; }
.uppercase { text-transform: uppercase; }
.underline { text-decoration: underline; }
.divider { border-bottom: 1px solid #dcd9d9; clear: both; margin: 40px auto; }
img { max-width: 100%; width: auto; height: auto; }
.gutter-10 { margin-left: -10px; margin-right: -10px; }
.gutter-10 > [class*='col-'] { padding-right: 10px; padding-left: 10px; }
.gutter-5 { margin-left: -5px; margin-right: -5px; }
.gutter-5 > [class*='col-'] { padding-right: 5px; padding-left: 5px; }
.gutter-2 { margin-left: -2px; margin-right: -2px; }
.gutter-2 > [class*='col-'] { padding-right: 2px; padding-left: 2px; }
.gutter-0 { margin-left: 0px; margin-right: 0px; }
.gutter-0 > [class*='col-'] { padding-right: 0px; padding-left: 0px; }
.relative{position: relative;}
.overflow-hide{overflow: hidden;}
/* =WordPress Core
-------------------------------------------------------------- */
.alignnone { margin: 5px 20px 20px 0; }
.aligncenter,
div.aligncenter { display: block; margin: 5px auto 5px auto; }
.alignright { float: right; margin: 5px 0 20px 20px; }
.alignleft { float: left; margin: 5px 20px 20px 0; }
.aligncenter { display: block; margin: 5px auto 5px auto; }
a img.alignright { float: right; margin: 5px 0 20px 20px; }
a img.alignnone { margin: 5px 20px 20px 0; }
a img.alignleft { float: left; margin: 5px 20px 20px 0; }
a img.aligncenter { display: block; margin-left: auto; margin-right: auto; }
.wp-caption { max-width: 100%; /* Image does not overflow the content area */ text-align: center; }
.wp-caption.alignnone { margin: 5px 20px 20px 0; }
.wp-caption.alignleft { margin: 5px 20px 20px 0; }
.wp-caption.alignright { margin: 5px 0 20px 20px; }
.wp-caption img { border: 0 none; height: auto; margin: 0; max-width: 100%; padding: 0; width: auto; }
.wp-caption p.wp-caption-text { font-size: 13px; margin: 0; padding: 5px 5px 0px; }
/*End core*/
.editor-content img { max-width: 100%; height: auto; }
.editor-content img.media-object { max-width: none; }
.editor-content h2, .editor-content h3, .editor-content h4 { font-weight: 700; color: #000; }
.editor-content h4 { font-size: 16px; }
.editor-content h3 { font-size: 18px; }
.editor-content h2 { font-size: 20px; color: #0a5597;}
.editor-content ul{list-style: none; margin: 0px; padding: 0px;}
.editor-content ul li{padding-left: 20px; position: relative; background: url('../images/icon-check.svg') no-repeat left top 8px; background-size: 15px;}

/*-----------------
1.2. Button
-------------------------*/
.btn {border-radius: 0px; background: #ca9143; border: 0px;  color: #fff; font-size: 20px;  padding: 10px 30px; text-transform: uppercase; 
    transition: all 0.3s linear 0s; -moz-transition: all 0.3s linear 0s; -o-transition: all 0.3s linear 0s; -webkit-transition: all 0.3s linear 0s; -ms-transition: all 0.3s linear 0s;
}
.btn.btn-icon{padding-left: 60px;}
.btn.btn-detail{margin-top: 30px; /*display: none;*/}

.btn .fa { font-size: 22px; margin-right: 5px; vertical-align: text-top; }
.btn.btn-lg { font-size: 24px; line-height: 30px; padding: 22px 50px; }
.btn.btn-sm { font-size: 16px; padding: 8px 25px; }
.btn:hover, .btn:focus { color: #fff; outline: none; background: #0b84ae; }
.btn.btn-icon:hover{}
.btn-link { font-weight: 800; font-size: 17px; color: #602314; }
.btn.outline-btn { background: none; color: #006838; border: #602314 solid 1px; padding: 5px 25px 5px 10px; font-weight: 400; position: relative;}
.btn.outline-btn:after{position: absolute; right: 6px; top: 12px; content: "\f103"; font: normal normal normal 14px/1 FontAwesome;}
.btn.outline-btn:hover { background: #602314; color: #0a5597; }
.btn-transparent { background: transparent; border: solid 1px #602314; color: #602314; font-size: 14px; }
.btn-transparent:hover { background: #f7e5cb; border: solid 1px #f7e5cb; }
.btn-back-home{}
/*-------------------------
1.3. dark-overlay
---------------------------------*/
.div_zindex { position: relative; z-index: 1; }
.div_zindex > * { position: relative; z-index: 1; }
.dark-overlay { background: rgba(0, 0, 0, 0.85) none repeat scroll 0 0; content: ""; height: 100%; left: 0; position: absolute; top: 0; width: 100%; }
.color-overlay { background: rgba(205, 56, 96, 0.9) none repeat scroll 0 0; content: ""; height: 100%; left: 0; position: absolute; top: 0; width: 100%; }
/*-------------------------------------
1.4. Space margins and padding
------------------------------------------------*/
.padding_none { padding: 0px; }
.padding_top_20 { padding-top: 20px; }
.padding_50px { padding: 50px 0; }
.padding_4x4_30 { padding: 30px; }
.padding_4x4_40 { padding: 40px; }
.padding_right { padding-right: 60px; }
.padding_left { padding-left: 60px; }
.space-20 { width: 100%; height: 20px; clear: both; }
.space-30 { width: 100%; height: 30px; clear: both; }
.space-40 { width: 100%; height: 40px; clear: both; }
.space-60 { width: 100%; height: 60px; clear: both; }
.space-80 { height: 80px; width: 100%; }
.margin-btm-20 { margin-bottom: 20px; clear: both; }
.margin-top-20 { margin-top: 20px; clear: both; }
.margin-top-40 { margin-top: 40px; clear: both; }
.margin-btm-40 { margin-bottom: 40px; clear: both; }
.margin-top-60 { margin-top: 60px; clear: both; }
.margin-btm-60 { margin-bottom: 60px; clear: both; }
.margin-none { margin: 0px; }
.margin-top-15 { margin-top: 15px; }
.d-inline-block { display: inline-block; }
/*-----------------
1.5. Form
---------------------------*/
.form-group { margin-bottom: 20px; position: relative; }
.form-group.has-error .help-block{color: #e4bb7f ;}
.form-label { color: #111111; font-size: 14px; font-weight: 400; margin: 0 auto 8px; }
.form-control { background: rgba(255,255,255,0.11) none repeat scroll 0 0; border: 0 none; border-radius: 0px; border: #fff solid 1px; box-shadow: none; color: #fff; height: 50px; line-height: 30px; padding: 0 15px; }
textarea.form-control { padding: 15px 20px; min-height: 100px; }
.form-control:hover { box-shadow: none; outline: none; }
.form-control:focus { box-shadow: none; outline: none; border-color: #0a5597;  background: rgba(255,255,255,0.11) none repeat scroll 0 0;}
.select { position: relative; }
.select select { appearance: none; -moz-appearance: none; -o-appearance: none; -webkit-appearance: none; -ms-appearance: none; }
.select::after { color: #878787; content: ""; cursor: pointer; font-family: fontawesome; font-size: 15px; padding: 12px 0; pointer-events: none; position: absolute; right: 15px; top: 0; }
.form-control option { padding: 10px; }
.control-label { color: #555; font-size: 15px; font-weight: 700; }
.radio label, .checkbox label { cursor: pointer; font-size: 14px; font-weight: 400; padding-left: 26px; position: relative; }
.radio input[type=radio],
.checkbox input[type=checkbox] { display: none; }
.radio label:before { background-color: transparent; border-style: solid; border-width: 1px; border-radius: 50%; content: ""; display: inline-block; height: 15px; left: 0; top: 4px; position: absolute; width: 15px; }
.checkbox label::before { background-color: rgba(0, 0, 0, 0); border: 1px solid #111111; content: ""; display: inline-block; height: 16px; left: 0; position: absolute; top: 4px; width: 16px; }
.radio input[type=radio]:checked + label:before { content: "\2022"; font-size: 15px; text-align: center; line-height: 11px; }
.checkbox input[type=checkbox]:checked + label:before { content: "\2713"; font-size: 12px; text-align: center; line-height: 14px; }
.black_input .form-control { background: #222; border-radius: 3px; color: #fff; border: #222 solid 1px; font-size: 17px; }
.checkbox, .radio { padding-top: 5px; }
/*-----------------
1.6. Table
---------------------------*/
table { margin: 0 0 30px; width: 100%; }
table th, table td { border: 0px solid #cccccc00; padding: 2px 1px; }
table th img, table td img { max-width: 100%; }
table thead { background: #eee; }
table thead th, table thead td { text-transform: uppercase; font-weight: 900; color: #111; }
/*-----------------
1.7. Accordion
---------------------------*/
.panel-group .panel { background: #fff; border: 0 none; border-radius: 0; box-shadow: none; margin-bottom: 25px; }
.panel-title { color: #fff; font-size: 24px; margin-bottom: 0; margin-top: 0; }
.panel-title a { display: block; padding: 10px 25px; position: relative; background: #cca759; font-size: 18px;}
.panel-title a.collapsed {  }
.panel-title a .question { width: 85px; height: 100%; content: ""; color: #fff; font-size: 39px; line-height: 1; text-align: center; position: absolute; top: 0px; left: 0px; background: #602314; }
.panel-title a.collapsed .question { background: #252930; transition-duration: 0.3s; -moz-transition-duration: 0.3s; -o-transition-duration: 0.3s; -webkit-transition-duration: 0.3s; }
.panel-title a .question span { position: absolute; top: 45%; left: 0px; right: 0px; transform: translateY(-50%); -moz-transform: translateY(-50%); -o-transform: translateY(-50%); -webkit-transform: translateY(-50%); }
.panel-default > .panel-heading { background: rgba(0, 0, 0, 0) none repeat scroll 0 0; border: 0px; border-radius: 0; box-shadow: none; color: #000; padding: 0; }
.panel-heading:hover .panel-title a .question { background: #602314; }
.panel-heading:hover .panel-title a { border-color: #602314; }
.panel-body { border: 0px solid rgba(255, 255, 255, 0.2); margin-top: -1px; padding: 15px 0px; }
.panel-body p { font-size: 17px; line-height: 30px; font-weight: 400; }
/*-----------------------------------------------------------
1.8. Section-background-color & sectino-heading
-------------------------------------------------------------------*/
section { position: relative; }
.section-title{font-size: 42px; /*color: #0b84ae;*/ text-transform: uppercase; margin-bottom: 15px; font-family: 'Oswald'; font-weight: 700;}
.section-title strong,
.section-title b,
.editor-content h2 strong,
.editor-content h2 b{font-family: 'Oswald'; line-height: 1.4em; color: #0b84ae;  text-transform: uppercase;  position: relative;
    display: block; margin: 0px 0px 0px; line-height: 1.2em; font-weight: 700;
}
.section-description:not(.text-center):not(.text-center-lg){text-align: justify;}

.section-title-sm{font-size: 24px; font-family: Oswald; font-weight: 400;}
.section-sub-title{font-size: 30px; margin-bottom: 15px; }
.secondary-bg { background: #0a5597; color: #fff; }
.view-detail{margin-top: 45px; text-decoration: underline; font-style: italic; font-size: 24px;}

.ellips{    text-overflow: ellipsis;display: -webkit-box; -webkit-box-orient: vertical;    overflow: hidden;}
.zindex-2{z-index: 2;}
.zindex-3{z-index: 3;}
.primary-bg { background: #0a5597; color: #fff; }
.gray_bg { background: #343434; }
.gray_bg_2 { background: #f5f5f5; }
.section-padding { padding: 120px 0; }
.section-padding-sm { padding: 20px 0; }
.element-pl{padding-left: 20px;}
.element-pr{padding-right: 20px;}
.element-px{padding-left: 20px; padding-right: 20px;}
.section-header { margin: 0 auto; max-width: 950px; padding-bottom: 30px; }
.section-header h2 { margin: 0 auto; font-size: 32px; font-weight: 400; }
.section-header p { color: #777; font-size: 17px; margin: 22px auto 0; }
.primary-bg .section-title{color: #fff;}
.bg-lefttop{position: absolute; left: 0px; top: 0px; width: 25vw; height: 25vw;  background: url('../images/bg-left.png') no-repeat left top;     background-size: contain;}
.bg-lefttop.icon3{background-image: url('../images/bg-left3.png') }
.bg-righttop{position: absolute; right: 0px; top: 0px; width: 25vw; height: 25vw;  background: url('../images/bg-right.png') no-repeat right top;     background-size: contain;}
.bg-righttop.icon2{background-image: url('../images/bg-right2.png')}
.bg-leftbottom{position: absolute; left: 0px; bottom: 0px; width: 25vw; height: 25vw;  background: url('../images/bg-bottom.png') no-repeat left bottom;     background-size: contain;}
.bg-leftbottom.icon2{background-image: url('../images/bg-bottom2.png') }
.bg-rightbottom{position: absolute; right: 0px; bottom: 0px; width: 25vw; height: 25vw;  background: url('../images/bg-rightbottom.png') no-repeat right bottom;     background-size: contain;}
.bg-rightbottom.icon2{background-image: url('../images/bg-rightbottom2.png') }
.m-top{margin-top: -120px;}
.m-top-sm{margin-top: -60px;}
.m-bottom{margin-bottom: -120px;}
.m-bottom-sm{margin-bottom: -60px;}

.section-cover,.cover{background-size: cover; background-position: center center; background-repeat: no-repeat;}
.icon-logo-lb,
.icon-logo-rb{position: relative;}


.thumbnail-full .thumbnail img{}
.thumb.animation{    overflow: hidden;}
.thumb.animation > img,
.thumb.animation .img{
    transition: -webkit-transform 3s cubic-bezier(0,.6,.45,1);
    transition: transform 3s cubic-bezier(0,.6,.45,1);
    transition: transform 3s cubic-bezier(0,.6,.45,1), -webkit-transform 3s cubic-bezier(0,.6,.45,1);
}
.thumb.animation:hover > img,
.thumb.animation:hover .img{transform: scale(1.1);}


.mbtt .page-nav.masterplan-nav ul li:nth-child(1){
	display: none;
}

.fancybox-container .fancybox-slide #startpopup{padding: 5px;}
.startpopup .fancybox-close-small:after{
        background: #fff;
    border-radius: 0px;
    color: #0a5597;
    top: 0px; right: 0px;
}
#startpopup img{max-height: 80vh;}
/*--------------------
1.9. Tabs 
------------------------------*/
/*.nav.nav-tabs { border: medium none; }
.nav-tabs > li a { padding: 0px 0px 12px; border-radius: 0; color: #caa557; font-size: 18px; font-weight: 400; margin-right: 5px; text-align: center; 
  border:0px; border-bottom: solid 2px #faf6ee;
}
.nav-tabs > li.active > a,
.nav-tabs > li.active > a:focus,
.nav-tabs > li.active > a:hover,
.nav-tabs > li a:hover,
.nav-tabs > li a:focus { color: #602314; border:0px; border-bottom: solid 2px #602314; background: transparent;}
.nav-tabs > li.active > a,
.nav-tabs > li.active > a:focus,
.nav-tabs > li.active > a:hover{font-weight: 700; border-bottom: solid 4px #602314;}
.nav-tabs > li { margin-bottom: 0; margin-right: 50px;}*/
.tab-content {margin-top: 0px; padding: 0px;}

.nicescroll-rails{width: 2px !important; background: #dbc18c;}
.nicescroll-rails .nicescroll-cursors{right: -8px;}

.zoom-in{display: block;}
.zoom-in img{-webkit-transform: scale(1); transform: scale(1);-webkit-transition: .5s ease-in-out; transition: .5s ease-in-out;}
.zoom-in:hover img{-webkit-transform: scale(1.1); transform: scale(1.1);}

/*--------------------------------------------
1.10. parallex-background
---------------------------------------------------*/
.parallex-bg { background-attachment: fixed; background-position: center; background-repeat: no-repeat; background-size: cover; position: relative; }
/*------------------------
1.11. Modal
--------------------------------*/
.modal-header{background: #333333; color: #fff;}
.modal-header h4{color: #fff;}
.modal-header .close{color: #fff; opacity: 1;}
.modal-header .close:hover{opacity: 0.7;}
.modal-content{border-radius: 0px;}


.section-content-gallery .slick-slider{margin-bottom: 0px;}
.section-content-gallery .slick-prev, .section-content-gallery .slick-next{width: 94px; height: 92px;  background: #0a5597 url('../images/arrow-left.svg') no-repeat center center;  background-size: 50% auto; z-index: 2;}
.section-content-gallery .slick-prev:before, .section-content-gallery .slick-next:before{display: none;}
.section-content-gallery .slick-prev{}
.section-content-gallery .slick-next{background-image: url('../images/arrow-right.svg');}
.section-content-gallery .slick-prev:hover,
.section-content-gallery .slick-prev:focus{background: #e4bb7f url('../images/arrow-left.svg') no-repeat center center;  background-size: 50% auto;}
.section-content-gallery .slick-next:hover,
.section-content-gallery .slick-next:focus{background: #e4bb7f url('../images/arrow-right.svg') no-repeat center center;  background-size: 50% auto;}

/*================
2. Header
===========================*/

#header { background: transparent; 
    position: fixed; top: 0; width: 100%; transition-duration: 0.3s; -moz-transition-duration: 0.3s; -o-transition-duration: 0.3s; -webkit-transition-duration: 0.3s; -ms-transition-duration: 0.3s; z-index: 22; 
    
    transform: translateY(-100%);
}

#header.sticky:before{display: none;}
body.scroll-down #header{
    transform: translateY(0);
    box-shadow: 0px 0px 10px 0px #00000030;    
    border-bottom: solid 1px #d4bd9e;
}

.navbar-header { position: relative; z-index: 1; }
#header .navbar {padding: 0px;}
#header .logo { margin: 0px 0; transition-duration: 0.3s; -moz-transition-duration: 0.3s; -o-transition-duration: 0.3s; -webkit-transition-duration: 0.3s; -ms-transition-duration: 0.3s; }
#navigation { padding: 0px; position: relative; text-align: right;}

.bg-logo {
    position: absolute;
    bottom: 50vh;
    right: -18vh;
    height: auto;
    opacity: 0.1;
    z-index: 2;
}
.show-text .bg-logo {
    opacity: .1;
}

.bg-logo svg {
    height: 138vh;
    width: 138vh;
    display: block;
}

.overlay-menu {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 21;
    background: #ffffff;
    padding-top: 90px;
    padding-bottom: 0px;
    display: flex;
    flex-direction: column;
    
}
.overlay-menu .main-menu-container {
    flex: 1;
    text-align: center;
    display: flex;
    padding: 0;
    margin: 0;
    list-style-type: none;
    overflow: auto;
    -ms-overflow-style: none; /* IE and Edge */
    scrollbar-width: none; /* Firefox */
    flex-direction: column;
}
.overlay-menu .main-menu-container::-webkit-scrollbar {
    display: none;
}

.overlay-menu .menu a {
    /*color: #fff;*/
    transition: all ease 0.4s;
    display: inline-block;
    font-size: 25px;
    font-weight: normal;
    text-transform: uppercase;
    position: relative;
}
.overlay-menu .menu a:hover{color: #0a5597;}
.overlay-menu .menu > .menu-item > a {min-width: calc(100vw / 3.5);}

.overlay-menu {
    transform: translateY(-100%);
    -webkit-transform: translateY(-100%);
    transition: all cubic-bezier(0.77, 0, 0.175, 1) 0.5s;
}
.overlay-menu.open {
    transform: translateY(0%);
    -webkit-transform: translateY(0%);
}
.overlay-menu .menu{list-style: none; padding: 0px; text-align: left;font-family:'Oswald'}

.overlay-menu .menu > li {
    opacity: 0;
    /*transform: translate(0, -50px);
    -webkit-transform: translate3d(0, -50px, 0);
    transition-delay: unset;*/
    padding:15px 0px ;
    margin: 0px;
}
.overlay-menu.open .menu li {
    transition: -webkit-transform cubic-bezier(0.165, 0.84, 0.44, 1) 1s, opacity cubic-bezier(0.165, 0.84, 0.44, 1) 1s;
    transition: transform cubic-bezier(0.165, 0.84, 0.44, 1) 1s, opacity cubic-bezier(0.165, 0.84, 0.44, 1) 1s;
    opacity: 1;
    transform: translate(0, 0);
    -webkit-transform: translate3d(0, 0, 0);
}
/*.overlay-menu.open .menu > li:nth-of-type(1) {
    transition-delay: 0.2s;
}
.overlay-menu.open .menu > li:nth-of-type(2) {
    transition-delay: 0.3s;
}
.overlay-menu.open .menu >  li:nth-of-type(3) {
    transition-delay: 0.4s;
}
.overlay-menu.open .menu > li:nth-of-type(4) {
    transition-delay: 0.5s;
}
.overlay-menu.open .menu > li:nth-of-type(5) {
    transition-delay: 0.6s;
}
.overlay-menu.open .menu > li:nth-of-type(6) {
    transition-delay: 0.7s;
}
.overlay-menu.open .menu > li:nth-of-type(7) {
    transition-delay: 0.8s;
}
.overlay-menu.open .menu > li:nth-of-type(8) {
    transition-delay: 0.9s;
}
.overlay-menu.open .menu > li:nth-of-type(9) {
    transition-delay: 1s;
}
.overlay-menu.open .menu > li:nth-of-type(10) {
    transition-delay: 1.1s;
}*/



.overlay-menu .btn-close{position: absolute; right: 50px;     font-size: 27px; display: none;}
.overlay-menu .language a{color: #fff;}

.overlay-menu .main-menu .sub-menu {
    padding: 0;
    margin: 0;
    list-style-type: none;
    padding-top: 20px;
    padding-bottom: 10px;
    padding-left: 30px;
}
.overlay-menu .main-menu .sub-menu a {
    padding: 2px 4px;
    font-family: inherit;
    font-size: 18px;
    position: relative;
    color: #666666;
}
.overlay-menu .main-menu .sub-menu a::before {
    content: "";
    position: absolute;
    bottom: 0;
    left: 50%;
    transform: translateX(-50%);
    width: 0;
    height: 2px;
    background-color: #fff;
    transition: all ease 0.4s;
}
.overlay-menu .main-menu .sub-menu a:hover::before {
    width: 100%;
}
.overlay-menu .main-menu .sub-menu .menu-item.active a {
    color: #ff4b43;
}
.overlay-menu .main-menu .sub-menu .menu-item.active a::before {
    width: 100%;
    background-color: #ff4b43;
}
.overlay-menu .main-menu .sub-menu .menu-item {
   
}
.overlay-menu .main-menu .sub-menu .menu-item:last-of-type {
    margin-bottom: 0;
}
.overlay-menu .main-menu .menu-item-has-children > a > .arrow{
     position: absolute; right: 0px; top: 0px; 
}
.overlay-menu .main-menu .menu-item-has-children > a  .arrow::after {
    content: "\f107";  font: normal normal normal 27px/1 FontAwesome;
    transition: 0.4s all ease;
    position: absolute; right: 0px; top: 5px;
}
.overlay-menu .main-menu .menu-item-has-children.show > a .arrow::after {
    content: "\f106"; color: #0a5597;
    transition: 0.4s all ease;
}



.header-bottom{background: #e0e6ed75;  position: relative; z-index: 100; position: relative;}
.header-bottom:before{
}
.header-bottom .navbar-brand img{height: 55px;
    transition-duration: 0.5s; -moz-transition-duration: 0.5s; -o-transition-duration: 0.5s; -webkit-transition-duration: 0.5s; -ms-transition-duration: 0.5s;
}
.header-bottom .navbar{}
.header-bottom .navbar-brand{padding-top: 7.5px; padding-bottom: 7.5px;}
.header-bottom .navbar-toggler{ border: 0px; color: #fff; text-transform: uppercase;  padding: 0px;  font-weight: 700;}

.header-bottom .nav-button-bar span.text{color: #0b84ae;  font-size: 20px;   line-height: 0.7em; font-weight: 400;}
.header-bottom  .navbar-toggler{height: 15px;}
.header-bottom  .navbar-toggler .wrap-line {
  outline: none;
  width: 20px;
  
  padding: unset;
  margin-left: 18px;
}
.header-bottom  .navbar-toggler .wrap-line {
  position: relative;
  overflow: hidden;
  display: block;
 
  height: 100%;
}
.header-bottom  .navbar-toggler .wrap-line .line {
  -webkit-transition: all ease 0.4s;
  -o-transition: all ease 0.4s;
  transition: all ease 0.4s;
  position: absolute;
  left: 0;
  bottom: 0;
  height: 2px;
  background: #0b84ae;
  display: block;
}
.header-bottom  .navbar-toggler .wrap-line .line:nth-of-type(1) {
  top: 0;
  width: 100%;
}
.header-bottom  .navbar-toggler .wrap-line .line:nth-of-type(2), .header-bottom  .navbar-toggler .wrap-line .line:nth-of-type(3) {
  top: 50%;
  -webkit-transform: translateY(-50%);
      -ms-transform: translateY(-50%);
          transform: translateY(-50%);
  width: 100%;
  margin-left: auto;
}
.header-bottom  .navbar-toggler .wrap-line .line:nth-of-type(4) {
  bottom: 0px;
  width: 100%;
  margin-left: auto;
}
.header-bottom  .navbar-toggler.open .line:nth-of-type(1) {
  left: 50%;
  right: 50%;
  width: unset;
}
.header-bottom  .navbar-toggler.open .line:nth-of-type(2) {
  -webkit-transform: translateY(-50%) rotate(-45deg);
      -ms-transform: translateY(-50%) rotate(-45deg);
          transform: translateY(-50%) rotate(-45deg);
}
.header-bottom  .navbar-toggler.open .line:nth-of-type(3) {
  -webkit-transform: translateY(-50%) rotate(45deg);
      -ms-transform: translateY(-50%) rotate(45deg);
          transform: translateY(-50%) rotate(45deg);
}
.header-bottom  .navbar-toggler.open .line:nth-of-type(4) {
  left: 63%;
  right: 37%;
  width: 0;
}


#header .header-right,#header .header-right > a{ font-size: 16px;     vertical-align: middle;}
#header .header-right .hotline{font-size: 18px;color: #0a5597; font-weight: 400;}
#header .header-right .hotline i{ font-size: 24px; line-height: 1.3em;text-align: center; margin-right: 10px;    vertical-align: middle;     
}
#header .header-right .language{color: #01bdcd; display: inline-block; margin-right: 15px;}
#header .header-right .language a{color: #01bdcd;}
#header .header-right .language a:hover{color: #fff;}

#header.sticky .header-bottom .navbar-brand{}
#header.sticky .header-bottom .navbar-brand img{  }
#header:not(.is-alternate) { -webkit-animation-fill-mode: both; -moz-animation-fill-mode: both; -ms-animation-fill-mode: both; -o-animation-fill-mode: both; animation-fill-mode: both; -webkit-animation-duration: 1s; -moz-animation-duration: 1s; -ms-animation-duration: 1s; -o-animation-duration: 1s; animation-duration: 1s; }


#section_video{position: relative; height: 100vh; min-height: 560px;}
#section_video .bg{position: absolute; left: 0px; top: 0px; width: 100%; height: 100%;}
#section_video .bg picture,
#section_video .bg picture img{width: 100%; height: 100%; object-fit: cover; object-position: center;}
.banner-button{position: absolute; right: 100px; bottom: 20px; z-index: 3000;  }
.banner-button a{color: #fff;}
.banner-button a:hover{color: #0a5597;}
.banner-button .hotline{display: block; padding-left: 60px; background: url('../images/icon-call.svg') no-repeat left top 5px; background-size: 44px;
    padding-bottom: 10px; margin-bottom: 10px; border-bottom: solid 1px #fff;
    font-size: 46px; font-family: 'Oswald';font-weight:700;
}
.banner-button .other{}
.banner-button .other .register{font-size: 20px; padding-left: 32px; background: url('../images/icon-register.svg') no-repeat left center; background-size: 20px;}
.banner-button .other{}
.banner-button .other a{margin-right: 20px;}
.banner-button .other a:last-child{margin-right: 0px;}
.banner-button .btn-360{}
.banner-button .btn-360 img,
.banner-button .btn-360 svg{max-height: 30px;width: auto;}
.banner-button .btn-social{width: 36px; height: 36px; border: solid 1px #fff; border-radius: 50%; text-align: center;}
.banner-button .btn-social i{line-height: 36px;}

.section-white .banner-button a {color: #0a5597;}
.section-white .banner-button .btn-social{border-color: #0a5597;}
.section-white .banner-button .other .register{ background-image: url('../images/icon-register-hover.html')}
.section-white .banner-button .hotline{background-image: url('../images/icon-call-hover.html')}

.scroll-downs {
  position: absolute;
  right: 0;
  bottom: 0;
  left: 0;
  margin: auto;
  bottom: 20px;
  width: 32px;
  z-index: 3;
}
.scroll-downs .mouse {
  width: 32px;
  height: 65px;
}
.scroll-downs .mousey {
  width: 9px;
  padding: 10px 9px;
  height: 35px;
  border: 3px solid #fff;
  border-radius: 25px;
  -webkit-box-sizing: content-box;
          box-sizing: content-box;
}
.scroll-downs .scroller {
  border: 2px solid #fff;margin-left: 2.5px;
  width: 4px;
  height: 8px;
  border-radius: 40%;
  -webkit-animation-name: scroll;
          animation-name: scroll;
  -webkit-animation-duration: 2.2s;
          animation-duration: 2.2s;
  -webkit-animation-timing-function: cubic-bezier(0.15, 0.41, 0.69, 0.94);
          animation-timing-function: cubic-bezier(0.15, 0.41, 0.69, 0.94);
  -webkit-animation-iteration-count: infinite;
          animation-iteration-count: infinite;
}
.scroll-downs .icon-down {
  text-align: center;
  -webkit-animation-name: scroll;
          animation-name: scroll;
  -webkit-animation-duration: 2.2s;
          animation-duration: 2.2s;
  -webkit-animation-timing-function: cubic-bezier(0.15, 0.41, 0.69, 0.94);
          animation-timing-function: cubic-bezier(0.15, 0.41, 0.69, 0.94);
  -webkit-animation-iteration-count: infinite;
          animation-iteration-count: infinite;
  width: 100%;
}

.section-white .scroll-downs .mousey,
.section-white .scroll-downs .scroller{border-color: #0a5597;}


@keyframes kenburns_custom {
    0% { transform: scale(1); }
    100% { transform: scale(1.1); }
}

@-webkit-keyframes scroll {
  0% {
    opacity: 0;
  }
  10% {
    -webkit-transform: translateY(0);
            transform: translateY(0);
    opacity: 1;
  }
  100% {
    -webkit-transform: translateY(15px);
            transform: translateY(15px);
    opacity: 0;
  }
}

@keyframes scroll {
  0% {
    opacity: 0;
  }
  10% {
    -webkit-transform: translateY(0);
            transform: translateY(0);
    opacity: 1;
  }
  100% {
    -webkit-transform: translateY(15px);
            transform: translateY(15px);
    opacity: 0;
  }
}
@-webkit-keyframes StrokeLine {
  0% {
    stroke-dashoffset: 0;
  }
  100% {
    stroke-dashoffset: -200;
  }
}
@keyframes StrokeLine {
  0% {
    stroke-dashoffset: 0;
  }
  100% {
    stroke-dashoffset: -200;
  }
}

@-webkit-keyframes rotate{
  from{-webkit-transform:rotate(0);transform:rotate(0)}
  to{-webkit-transform:rotate(360deg);transform:rotate(360deg)}
}
@keyframes rotate{
  from{-webkit-transform:rotate(0);transform:rotate(0)}
  to{-webkit-transform:rotate(360deg);transform:rotate(360deg)}
}


#location .thumbnail{float: right;}

/*section-image */
#location .section-image-wrapper{width: 100%;  height: 0px; padding-top: calc(891/1317*100%);   overflow: hidden;}
#location .section-image{height: 891px; width: 1317px; position: absolute;
    left: 50%;
    top: 50%;
    margin: -445.5px 0 0 -658.5px;
}
#location .section-image img{width: 100%; }
#location .section-image svg{
    width: 100%;
    height: 100%;
    left: 0;
    top: 0;
    position: absolute;
}
#location .section-image svg#Layer_1 .st0 {
    fill: none;
    stroke-miterlimit: 10;
    stroke-width: 6;
    stroke-dasharray: 10;
    stroke-dashoffset: 0;
    animation: StrokeLine 3s infinite linear;
    stroke: #FCF54C;
}
#location .section-content{padding-left: 3rem;}

.utilities-slide{margin-left: -15px; margin-right: -15px;  margin-top: 30px;}
.utilities-slide .item{padding: 0px 15px; display: block;}
.utilities-slide .thumb{overflow: hidden; height: 0px; padding-top: calc(434/615 * 100%); position: relative;margin-bottom: 10px;}
.utilities-slide .thumb .inner{ position: absolute; width: 100%; height: 100%; position: absolute; left: 0px; top: 0px; }
.utilities-slide .item .thumb:before{
    content: ''; width: 100%; height: 100%; border: solid 3px #f7c761d4; position: absolute; left: 0px; top: 0px;
    transition-duration: 0.2s; 
    transition-timing-function: cubic-bezier(1,0,1,.65);
    opacity: 0;
    z-index: 2;
}
.utilities-slide .item:hover .thumb:before{
   opacity: 1;
}
.utilities-slide .item h3{text-align: center; padding: 0px 15px; text-transform: uppercase; margin-bottom: 0px;}
.section-content-gallery .utilities-slide .slick-prev, .section-content-gallery .utilities-slide .slick-next{
    z-index: 2; margin-top: -30px;
}
.section-content-gallery .utilities-slide .slick-prev{left: 15px;}
.section-content-gallery .utilities-slide .slick-next{right: 15px;}

#furniture{    position: relative;z-index: 3;}
.furniture-slide .item .thumb{height: 0px; padding-top: calc(780/1225 * 100%); position: relative;}
.furniture-slide .item .thumb .inner{position: absolute; left: 0px; top: 0px; width: 100%; height: 100%;}
.section-fullwith .section-content{padding: 0px 60px 0px 65px;}
.section-content-gallery .furniture-slide .slick-prev,
.section-content-gallery .furniture-slide .slick-next,
.partner-slide .slick-prev, 
.partner-slide .slick-next{right: 0px; bottom: -46px; transform: none; top: auto; z-index: 2;}
.section-content-gallery .furniture-slide .slick-prev,
.partner-slide .slick-prev{left: auto; right: 95px;}
#furniture .pagingInfo{position: absolute; right: 210px; bottom: -45px; color: #0a5597 ; font-size: 27px;}
#furniture .pagingInfo span{font-size: 32px;}

#finance .section-content{padding: 0px 30px;}
#partner .items .item{text-align: center; margin: 30px 0px ;     display: block;}
#partner .items .item .thumb {width: 200px; height: 100px; margin: 0px auto 10px; max-width: 100%;}
#partner .items .item .thumb img{    object-fit: contain;height: 100%;}
#partner .items .item h3{text-transform: uppercase; margin-bottom: 10px;}
#partner .items .item h5{text-transform: uppercase; color: #444444;}

.post-list .item{display: flex; margin-bottom: 30px;}
.post-list .item .item-thumb {width: 40%; flex: 0 0 40%;}
.post-list .item .item-content{padding-left: 30px; position: relative; padding-top: 18px;}
.post-list .item .item-content .date-time{position: absolute; left: -58px; top: 0px; background: #e4bb7f; padding: 6px; color: #fff; text-align: center; height: 70px;}
.post-feature .date-time{position: absolute; left: 0px; top: 0px; background: #e4bb7f; padding: 6px; color: #fff; text-align: center; height: 70px;}

.post-list .item .item-content .date-time strong,
.post-feature .date-time strong{display: block; font-size: 13px;}
.post-list .item h3{font-size: 18px; color: #444444; font-weight: 700; margin-bottom: 5px;}
#video .post-list .item h3{color: #0a5597;}
.post-list .item .description,
.post-feature .item .description{ -webkit-line-clamp: 3;}
.post-feature{position: relative;}
.post-feature .item-thumb{position: relative;  z-index: 2;}
.post-feature .date-time{top: auto; bottom: 0px; padding: 10px 25px; height: 140px;}
.post-feature .date-time strong{font-size: 50px;}
.post-feature h3{font-weight: 700; text-transform: uppercase;}
.post-feature .item-content{position: relative; padding-bottom: 45px; padding-top: 20px;} 
.post-feature .item-content:before,
.post-feature .item-content:after{content: ''; width: calc(100% + 50px + 120px ); position: absolute; left: -50px; bottom: 0px;
    height: calc(100% + 140px); background: #0b84ae;
}
.post-feature .item-content:after{background: url('../images/bg-new-feature.png') no-repeat center bottom; background-size: 100% auto;}
.post-feature .item .inner{position: relative; z-index: 2; display: block;color: #fff; }
.post-feature .item h3{color: #fff;}
.post-feature .item .btn-detail{background: #ffffff; color: #0b84ae;}


.post-list .item-fullwith{flex-direction: column;}
.post-list .item-fullwith .item-thumb{width: 100%; flex: 1;}
.post-list .item-fullwith .item-content .date-time{ top: -70px;}
.post-list .item-fullwith .item-content{padding: 15px 0px;}


#footer .contact-form{padding-top: 75px; padding-bottom: 75px; padding-right: 125px ; background-position: center center; background-repeat: no-repeat;
    
}
#footer .contact-form .inner{width: 60%; color: #fff;}
#footer .contact-form .section-title-sm{color: #fff;}
#footer .contact-form form{margin-top: 20px;}

#footer .contact-form .form-control::-webkit-input-placeholder { /* Edge */
  color: #fff;
}

#footer .contact-form .form-control:-ms-input-placeholder { /* Internet Explorer 10-11 */
  color: #fff;
}

#footer .contact-form .form-control::placeholder {
  color: #fff;
}

#footer .contact-form .btn{color: #0a5597; background: #fff;font-family:Oswald}
#footer .contact-form .btn:hover{background: #0a5597; color: #fff;}

.contact-form-1 .form-control{border-color: #ebebeb;}

.footer-bottom{padding: 30px 0px; background-image: url('../images/bg-footer.png') ; background-repeat: no-repeat; background-position: left bottom;     background-size: contain;}
.footer-bottom a{color: #fff;}
.contact-address .item{margin-bottom: 45px;}
.contact-address ul{list-style: none; padding: 0px ; margin: 0px;}
.contact-address ul li{list-style: none;  padding-left:  30px; background-size: 16px auto; background-repeat: no-repeat; background-position: left top 5px; } 
.contact-address ul li.address{background-image:  url('../images/icon-location.svg'); background-size: 13px auto;}
.contact-address ul li.phone{background-image:  url('../images/icon-phone.svg');}
.contact-address ul li.email{background-image:  url('../images/icon-email.svg');}

.item-gmap a{display: flex; align-items: flex-end; min-height: 60px; padding-left: 41px; background: url('../images/icon-gmap.png') no-repeat left top;
    vertical-align: bottom;
}

.social{display: flex; margin-bottom: 15px;}
.social a{width: 36px; height: 36px; display: flex; border-radius: 50%;  color: #fff;
        justify-content: center;     align-items: center; margin-right: 15px;
}
.social a.facebook{background: #2c4088;}
.social a.youtube{background: #ab000e;}
.social a.zalo{background: #0068ff;}
.social a.zalo img{max-width: 60%; height: auto;}

#gotop{width: 3.5rem ; height: 3.5rem; position: fixed; border: solid 1px transparent;    bottom: 15px; right: 15px; background: #e4bb7f url('../images/icon-up.svg') no-repeat center center; background-size: 40% auto;
        z-index: 5;
}
#gotop:hover{background-color: #0a5597; border: solid 1px rgba(255,255,255,0.5);}

.page-news-detail .inner{margin: auto;}
.page-news-detail h1.page-title.post-title{font-size: 40px; margin-bottom: 20px; font-weight: 700; text-transform: uppercase;  line-height: 1.3;}
.page-news-detail .date-time{padding-bottom: 20px;}
.page-news-detail .social-share > div {
    display: inline-block;
    margin-bottom: 5px;
    vertical-align: middle;
}
.page-news-detail .social-share .tweet {
    width: 60px; padding-top: 5px;
}

.pagination{padding: 0px 15px 0px;  border-radius: 0px; text-align: center; width: 100%;}
.pagination ul{list-style: none;padding: 0px; margin: 0px auto;}
.pagination ul li{display: inline-block; margin: 0px 5px;}
.pagination ul li a,
.pagination ul li span{display: inline-block; padding: 0px 5px; text-align: center; font-weight: 400; color: #fff; background: #e4bb7f ; width: 40px; height: 40px; line-height: 38px; border:0;}
.pagination ul li span.current{ background: #0a5597;}
.pagination ul li a:hover{background: #0a5597;}
.pagination ul li span.dots{border-color: transparent;}


/*Project*/
.section-banner .section-content{position: absolute; bottom: 10px; left: 50px;}
.section-banner .section-content .section-title-lg{border-bottom: solid 1px #fff; padding-bottom: 15px; font-size: 50px;}
.section-banner .section-content .sub-title{font-weight: 400; margin: 0px; border: 0px; padding: 0px;}


.project-utilities-slide .item .thumb{height: 0px; padding-top: calc(780/1225 * 100%); position: relative;}
.project-utilities-slide .item .thumb .inner{position: absolute; left: 0px; top: 0px; width: 100%; height: 100%;}
.project-utilities-slide-arrow{position: relative; z-index: 3;}
#project_utilities .slick-next{right: 0px;}
#project_utilities .slick-prev{left: auto; right: 95px;}
.project-utilities-slide .section-content{padding-left: 70px;}

.project-furniture-slide .item .thumb{height: 0px; padding-top: calc(1189/2560 * 100%); position: relative;}
.project-furniture-slide .item .thumb .inner{position: absolute; left: 0px; top: 0px; width: 100%; height: 100%;}
.project-furniture-slide .title{padding: 10px;}


.project-modelhouse-slide .item .thumb{height: 0px; padding-top: calc(720/957 * 100%); position: relative;}
.project-modelhouse-slide .item .thumb .inner{position: absolute; left: 0px; top: 0px; width: 100%; height: 100%;}
.modelhouse-slide-wrapper{margin-left: 120px; width: 100vw;}
.modelhouse-slide-wrapper .slick-list{    overflow: unset; overflow-x: visible;}
.project-modelhouse-slide{margin-left: -5px; margin-right: -5px;}
.project-modelhouse-slide .item{padding: 0px 5px;}
#project_modelhouse.section-content-gallery .slick-prev{left: calc(50% - 95px); bottom: 0px;  top: auto; z-index: 2;
        -webkit-transform: translate(0, 0);
    -ms-transform: translate(0, 0);
    transform: translate(0, 0);
}
#project_modelhouse.section-content-gallery .slick-next{left: calc(50% ); bottom: 0px; top: auto;
     -webkit-transform: translate(0, 0);
    -ms-transform: translate(0, 0);
    transform: translate(0, 0);
}
.nav-category .category{margin: 20px 0px 40px;}
.nav-category .category li{margin: 0px; margin-right: 10px;}
.nav-category .category li a{    display: block; padding: 10px 40px; background: #e4bb7f; font-weight: 700; color: #fff; text-transform: uppercase; border-radius: 0;}
.nav-category .category li:hover a,
.nav-category .category li a.active{background-color: #0a5597;}

#project_masterplan .mapify-hover{
    fill:rgba(162,114,43,0.25);
    stroke: #0a5597;
    stroke-width: 2;
}
#project_masterplan .mapify-popOver{background: #0a5597; border-radius: 0px; color: #fff; padding: 20px; }
#project_masterplan .mapify-popOver h4{color: #fff;font-size: 24px; font-weight: 700; margin-bottom: 10px; text-transform: uppercase;}
#project_masterplan .mapify-popOver p{font-size: 24px; margin-bottom: 0px;}
#project_masterplan .mapify-popOver .mapify-popOver-arrow{display: none;}

#project_masterplan .section-content{display: flex; padding-left: 120px;}


#project_masterplan .section-content .col-left{width: 260px; flex: 0 0 260px; padding-top: 30px;}
#project_masterplan .section-content .col-right{flex-grow: 1; }

.section-masterplan .section-title{}
.section-masterplan .section-content .col-left .nav-item{width: 100%; display: block; margin: 5px 0px;}
.section-masterplan .section-content .col-left .nav-item .nav-link{padding: 10px 0px; padding-left: 30px; background: transparent; font-size: 18px; color: #333333; text-transform: uppercase; position: relative; font-weight: 700;}
.section-masterplan .section-content .col-left .nav-item .nav-link:before{content: '';width: 7px; height: 43px; 
    position: absolute; left: 0px; top: 0px; background-color: #e4bb7f;
}
.section-masterplan .section-content .col-left .nav-item .nav-link.active,
.section-masterplan .section-content .col-left .nav-item .nav-link:hover{color: #0a5597;}
.section-masterplan .section-content .col-left .nav-item .nav-link.active:before,
.section-masterplan .section-content .col-left .nav-item .nav-link:hover:before{background-color: #0a5597;}
.section-masterplan .legend{margin-top: 30px;}
.section-masterplan .legend p{margin-top: 15px; color: #af822d; font-style: italic;}

.section-apartment .slide-wrapper{background: #f1e7cd;}
.section-apartment .slide-wrapper .inner{padding: 90px;}

.project-apartment-slide .item_thumb{display: block; padding-right: 90px;}
.project-apartment-slide-arrow{position: absolute; top: 0px; left: 0px; width: 100%;}
.project-apartment-slide-arrow .slick-prev{right: 95px; left: auto;}
.project-apartment-slide-arrow .slick-next{right: 0px;}
.project-apartment-slide-arrow .slide-title{position: absolute; right: 198px; height: 92px; padding: 15px; text-align: center; text-transform: uppercase; background: #0a5597; color: #fff;
        -webkit-transform: translate(0, -50%);
    -ms-transform: translate(0, -50%);
    transform: translate(0, -50%);
    min-width: 280px;
}
.project-apartment-slide-arrow .slide-title h3{color: #fff; margin-bottom: 5px;}
.project-apartment-slide .section-content h2{text-transform: uppercase; font-weight: 700; margin-bottom: 15px;}
.project-apartment-slide .section-description{border-top: solid 1px #0a5597; border-bottom: solid 1px #0a5597; padding: 10px 0px; margin-top: 30px; margin-bottom: 30px;}
.project-apartment-slide .section-description table{margin: 0px;}
.project-apartment-slide .section-description table th,
.project-apartment-slide .section-description table td{border: 0px; padding: 10px 0px;}
.project-apartment-slide .section-description table th:last-child,
.project-apartment-slide .section-description table td:last-child{text-align: right;}

/*ABOUT*/


#about_introduction .section-content{padding-right: 60px;}
#about_introduction .items .item{margin: 30px 0px;}
#about_introduction .items .item .thumb{
    width: 62px; 
    flex: 0 0 62px;
    margin-right: 10px;
}
#about_introduction .items .item .title{}
#about_introduction .items .item h3{margin: 5px 0px 0px;  font-weight: 700;}

#about_outstanding .items {height: 0px;width: 100%; padding-top: 38%;}
#about_outstanding .wrap{
    position: absolute;
    width:90%;
    margin-left:-10%;
    margin-top: 0%;
    top: -48%;
    left: 0%;
    transform-origin:60% 0;
    transform: rotate(-45deg);
}
#about_outstanding .wrap > .item{
    float:left;
    width:19%;
    padding-bottom:19%;
    margin:0.5%;
    overflow: hidden;
    position: relative;
}
#about_outstanding .wrap > .item .thumb{
    transform: rotate(45deg); position: absolute; left: -21%; top: -21%; width: 142%; height: 142%;
}
#about_outstanding .wrap > .item .thumb *{
    transition-duration: 0.5s; -moz-transition-duration: 0.5s; -o-transition-duration: 0.5s; -webkit-transition-duration: 0.5s; -ms-transition-duration: 0.5s;
}
#about_outstanding .wrap > .item .thumb:before{content: ''; position: absolute; left: 0px; top: 0px; width: 100%; height: 100%; background: rgba(137,96,34,0.8);
    opacity: 1;
    transition-duration: 0.5s; -moz-transition-duration: 0.5s; -o-transition-duration: 0.5s; -webkit-transition-duration: 0.5s; -ms-transition-duration: 0.5s;

}
#about_outstanding .wrap > .item .content{position: absolute;
    position: absolute;
    width: 56%;
    left: 22%;
    bottom: 18%;
    text-align: center;
}
#about_outstanding .wrap > .item h3{color: #fff; font-weight: 700;text-transform: uppercase;
    margin: 0px;}
#about_outstanding .wrap > .item .thumb img{max-width: 145px; max-height: 145px; margin-bottom: 10px; opacity: 1;}

#about_outstanding .wrap > .item:hover .thumb:before{
    opacity: 0;
}
#about_outstanding .wrap > .item:hover .thumb img{opacity: 0;}
#about_outstanding .wrap > .item:hover h3{opacity: 0;}
#about_outstanding .wrap > .item:nth-child(2){
    margin-top: 9.5%;
}
#about_outstanding .wrap > .item:nth-child(3){
    clear:left;
    margin-left:20.5%;
}
#about_outstanding .wrap > .item:nth-child(5){
    clear:left;
    margin-left:calc(60.5% - 9.5%);

}


#about_partner .items > .item{ padding: 45px 0px;   display: block; border-bottom: solid 1px #dadada;}
#about_partner .items > .item:last-child{border: 0px; padding-bottom: 0px;}
#about_partner .items > .item .thumb-logo {width: 200px; height: 100px; margin: 0px 0px 10px; max-width: 100%;}
#about_partner .items > .item .thumb-logo img{    object-fit: contain;height: 100%;}
#about_partner .items > .item h3{text-transform: uppercase; margin-bottom: 10px;}
#about_partner .items > .item h5{text-transform: uppercase; color: #444444;}

.partner-slide{}
.partner-slide .thumb{overflow: hidden; height: 0px; padding-top: calc(510/794 * 100%); position: relative;}
.partner-slide .thumb .inner{ position: absolute; width: 100%; height: 100%; position: absolute; left: 0px; top: 0px; }
.partner-slide .item{position: relative;}
.partner-slide .item{}
.partner-slide .slick-prev, .partner-slide .slick-next{ bottom: 0px;}
#about_partner .items > .item .partner-slide h3{position: absolute; bottom: 0px; background: rgba(162,114,43,0.7 ); padding: 30px; height: 92px; margin: 0px;
    color: #fff; left: 0px; right: 0px; padding-right: 190px; text-align: left;
}

#news_banner{margin-bottom: 30px;}

#news_banner.section-fullwith .section-content .item-content{margin-left: -105px; background: #0a5597; color: #fff; padding: 60px; position: relative;}
#news_banner.section-fullwith .section-content .item-content .date-time{
    position: absolute; left: -110px; top: 0px; background: #e4bb7f; padding: 6px; color: #fff; text-align: center; 
            padding: 10px 25px;
    height: 140px; width: 110px;
}
#news_banner.section-fullwith .section-content .item-content .date-time strong{display: block; font-size: 60px;}
#news_banner .section-subtitle{color: #fff;}
#news_banner .btn-default{background: #fff; color: #0a5597; margin-top: 15px;}

#breadcrumbs span a,
#breadcrumbs span span,
#breadcrumbs span i{color: #999999; margin-right: 15px; text-transform: uppercase;}

.section-banner-child{padding-top: 0px;}
.section-banner-child .section-content{padding-left: 45px;}
.section-banner-child .page-title{position: relative; padding-bottom: 15px; margin-bottom: 15px;}
.section-banner-child .page-title:after{ position: absolute; content: '';bottom: 0px;  left: 0px; right: 0px; height: 2px; background: #0a5597;}

#finance_other .title{padding-top: 30px; padding-bottom: 30px; margin-bottom: 0px; border-top: solid 1px #eaeaea; border-bottom: solid 1px #eaeaea; }

#finance_other .accordion-item{border: 0px; border-radius: 0px; border-bottom: solid 1px #eaeaea;;}
#finance_other .accordion-button{background: transparent; padding: 20px 0px 20px 30px; border: 0px; border-radius: 0px;  box-shadow: none;
    color: #444444; text-transform: uppercase; font-size: 20px;
}
#finance_other .accordion-button::after{content: "\f0da";     font: normal normal normal 30px/0.6 FontAwesome;     background: transparent;     transform: rotate(0);
    left: 0px;    position: absolute;    color: #444444;
}
#finance_other .accordion-button:not(.collapsed){color: #0a5597;}
#finance_other .accordion-button:not(.collapsed)::after{content:"\f0d8" ; color: #0a5597;}
#finance_other .accordion-body{padding: 0px 0px 15px;}

#finance_other .item{display: flex; margin-bottom: 75px;}
#finance_other .items .item:last-child{margin-bottom: 0px;}
#finance_other .item .item-thumb{flex: 0 0 25%; margin-right: 75px;}
#finance_other .item .item-content{flex-grow: 1;}

#footer.contact-footer .contact-form .inner{visibility: visible;}
#footer.contact-footer .section-content{display: none;}

/*=======================
11. Responsive-CSS
==============================*/
.container-fluid{padding-left: 20px; padding-right: 20px;}
@media (min-width:992px) {
    .text-center-lg{text-align: center;}
    #footer.contact-footer .contact-form .inner{visibility: hidden;}
    #footer.contact-footer .section-content{display: block;}
}
@media (min-width:1200px) {
    .container-fluid,
    .element-px{padding-left: 36px; padding-right: 36px;}
    .element-pl{padding-left: 60px;}
    .element-pr{padding-right: 60px;}
    .page-news-detail .inner{width: 1000px;}
    .section-masterplan .legend{text-align: center;}
}
@media (min-width:1601px) {
	.container-fluid,
    .element-px{padding-left: 120px; padding-right: 120px;}
    .element-pl{padding-left: 120px;}
    .element-pr:not(.lg){padding-right: 120px;}
    .element-pr
	.container{max-width: 1440px;}
}
@media (max-width:1600px) {
    html, body,
    .btn{font-size: 16px;}
    .section-title{font-size: 36px;}
    .section-title strong, .section-title b, .editor-content h2 strong, .editor-content h2 b{  }
	.section-content-gallery .slick-prev, .section-content-gallery .slick-next{    width: 64px; height: 62px;}
    .section-content-gallery .furniture-slide .slick-prev,
    #project_utilities .slick-prev,
    .project-apartment-slide-arrow .slick-prev,
    .partner-slide .slick-prev{right: 65px;}
    #project_modelhouse.section-content-gallery .slick-prev{    left: calc(50% - 65px);}
    .project-apartment-slide-arrow .slide-title{height: 62px;right: 138px;    padding: 5px;}
    #about_partner .items > .item .partner-slide h3{height: 62px;padding: 17px 30px;}
    .section-content-gallery .furniture-slide .slick-prev, .section-content-gallery .furniture-slide .slick-next{bottom: -31px;}
    .section-padding{    padding: 90px 0;}
    .section-fullwith .section-content{padding: 0px 60px 0px 45px;}
    #project_masterplan .section-content{padding-left: 60px;}
    .modelhouse-slide-wrapper{margin-left: 60px;}

    h1 { font-size: 42px;}
    h2 { font-size: 24px;}
    h3 { font-size: 20px;}
    h4 { font-size: 18px;}
    h5 { font-size: 16px;}
    h6 { font-size: 14px;}
    .post-list .item .item-content .date-time strong{font-size: 20px;}
    .post-list .item .item-content .date-time{height: 60px; padding: 3px 5px 2px;}
    .post-feature .date-time strong{font-size: 46px;}
    .post-feature .date-time{height: 120px;     padding: 10px 20px;}
    .post-feature .item-content:before, .post-feature .item-content:after{width: calc(100% + 40px + 60px );    left: -40px;     height: calc(100% + 120px);}
    .post-list .item:not(.item-fullwith) .item-content{padding-top: 70px;}
    .post-list .item h3{font-size: 16px;}
    .post-list .item-fullwith .item-content .date-time{top: -60px;}

    #furniture .pagingInfo{right: 150px; bottom: -32px;    font-size: 20px;}
    #furniture .pagingInfo span{font-size: 27px;}

    #news_banner.section-fullwith .section-content .item-content{margin-left: -45px; padding: 30px;}

}

@media (max-width:1599px) {
    .post-list .item:not(.item-fullwith) .item-content{padding-top: 60px;}
	.post-list .item .item-content .date-time{font-size: 12px;    height: 52px;}
    .post-list .item-fullwith .item-content .date-time{top: -52px;}
    .post-list .item h3{margin-bottom: 3px;}
    .post-list .item .item-content .date-time strong{font-size: 18px;}
    .banner-button .hotline{padding-left: 45px;    background-size: 36px;    font-size: 40px;}
    .banner-button .other .register{padding-left: 25px;background-size: 16px;  font-size: 16px;}
    .banner-button .btn-360 img,
    .banner-button .btn-360 svg{max-height: 28px;}
    .banner-button .other a:not(:last-child){margin-right: 15px;}
    .scroll-downs{    width: 25px;}
    .scroll-downs .mouse{    width: 52px; height: 50px;}
    .scroll-downs .mousey{height: 27px;}

    .section-apartment .slide-wrapper .inner{padding: 60px;}
    .project-apartment-slide .section-description{margin-top: 15px; margin-bottom: 15px;}
    .project-apartment-slide .section-content h2,
    .project-apartment-slide .section-content h4{margin-bottom: 5px;}
    .project-apartment-slide .section-description table th, .project-apartment-slide .section-description table td{padding: 5px 0px;}

    #finance_other .item .item-thumb{    margin-right: 45px;}
    #finance_other .item .subtitle {margin-bottom: 10px;}
    #finance_other .item .btn.btn-detail{margin-top: 15px;}

    #about_outstanding .wrap > .item .thumb img{max-width: 90px; max-height: 90px; }
    #about_outstanding .wrap > .item h3{ font-size: 18px;}

}
@media (max-width:1399px) {
	  html, body,
    .btn{}
    .post-list .item:not(.item-fullwith) .item-content{padding-top: 5px;}
     .section-title{font-size: 30px;}
}
@media (max-width:1200px) {
    html, body,
    .btn{}
    .section-title{font-size: 27px;}
    .section-title-sm{font-size: 18px;}
    .section-title strong, .section-title b, .editor-content h2 strong, .editor-content h2 b{ }
    .section-content-gallery .slick-prev{left: -20px;}
    .section-content-gallery .slick-next{right: -20px;}
    .section-content-gallery .slick-prev, .section-content-gallery .slick-next{    width: 50px; height: 50px;}
    .section-content-gallery .furniture-slide .slick-prev,
    .project-apartment-slide-arrow .slick-prev,
    #project_utilities .slick-prev,
    .partner-slide .slick-prev{right: 51px; left: auto;}
    .project-apartment-slide-arrow .slick-next,
    #project_utilities .slick-next,
    .partner-slide .slick-next{right: 0px;}
    .section-content-gallery .furniture-slide .slick-prev, .section-content-gallery .furniture-slide .slick-next{bottom: 0px;}
    #project_modelhouse.section-content-gallery .slick-prev{   left: calc(50% - 51px);}
    .project-apartment-slide-arrow .slide-title{height: 50px;right: 110px;    padding: 3px  5px;}
    #about_partner .items > .item .partner-slide h3{height: 50px;}
    .project-apartment-slide-arrow .slide-title h3{margin: 0px;}
    .section-padding{    padding: 60px 0;}
    .section-fullwith .section-content{padding: 0px 20px 0px 20px;}


    h1 { font-size: 34px;}
    h2 { font-size: 20px;}
    h3 { font-size: 18px;}
    h4 { font-size: 16px;}
    h5 { font-size: 14px;}
    h6 { font-size: 13px;}
    .header-bottom .nav-button-bar span.text{font-size: 18px;}

    #furniture .pagingInfo{right: 120px; bottom: 10px;  font-size: 18px; }
    #furniture .pagingInfo span{font-size: 24px;}
    #about_outstanding .wrap > .item h3{ font-size: 16px;}
    

	
	
}
@media (min-width:1200px) and (max-width:1400px) {
	
}
@media (min-width:992px) and (max-width:1200px) {
	

}
@media (max-width:1199px) {
   
    .post-feature .item-content:before, .post-feature .item-content:after{left: -20px;width: calc(100% + 20px + 20px );}
    .post-feature .date-time{height: 80px; padding: 0px 15px;}
    .post-feature .date-time strong{font-size: 30px;}
    .post-feature .item-content{padding-top: 15px; padding-bottom: 20px;}
    #footer .contact-form .inner{width: 80%;}
    #project_masterplan .section-content{padding-left: 20px;}
    .modelhouse-slide-wrapper{margin-left: 20px;}
    .project-utilities-slide .item .thumb{margin-bottom: 30px;}

    .section-banner-child{}

    #about_introduction .items .item{    margin: 15px 0px;}
    #about_introduction .items .item .thumb{width: 42px;     flex: 0 0 42px;}
    #about_outstanding .wrap > .item .content{
        width: 70%;
        left: 15%;
       
    }
    .section-banner-child .section-content{padding-left: 20px;}
    /*.section-banner-child .page-title:after{left: -40px;}*/

    .project-apartment-slide-arrow .slide-title{min-width: 235px;}
    .nav-category .category li a{padding: 10px 30px;}



}
@media (max-width:991px) {

    body{padding-top: 57px;}
    #header{height: 57px;}
    .section-banner-child {
        padding-top: 0px;
    }
    #section_video{ min-height: 200px; /*height: calc(100vw * 9 / 16);*/ height: calc(100vh - 57px);}
    .section-title{margin-top: 30px;}
    /*.section-title{margin-top: 30px; font-family: 'Anton', sans-serif; color: #0a5597; font-weight: 400;     font-size: 34px;}
    .section-title strong, 
    .section-title b, 
    .editor-content h2 strong, 
    .editor-content h2 b{display: inline;}*/
    
    #finance .thumbnail{margin-top: 30px;}
    .btn.btn-detail{margin-top: 15px;}
    .post-feature{margin-bottom: 30px;}
    #footer .section-content{padding-bottom: 30px;}
    .scroll-downs{display: none;}
    .header-bottom .navbar-brand img{height: 42px;}

    #finance .section-content{    padding: 0px 20px;}
    #partner .container-fluid.text-center,
    #utilities .container-fluid.text-center,
    #news .section-title.text-center,
    #utilities .section-title.text-center,
    #utilities .section-description.text-center,
    .utilities-slide .item h3{text-align: left !important;}
    #location .section-content{padding-left: 20px; padding-right: 20px; padding-bottom: 20px;}
    .element-pl,
    .element-pr{ padding-left: 20px;  padding-right: 20px;}
    .pt-0-md{padding-top: 0px !important;}

    #partner .items .item{display: flex; flex-direction: column; margin: 15px 0px;}
    #partner .items .item .thumb{order: 2;}
    .section-ancu .section-content{margin-top: 15px;}
    #project_masterplan .section-content{flex-direction: column;}
    #project_masterplan .section-content .col-left{width: 100%; flex: 1;}
    #project_masterplan .section-content .col-right{width: 100%; flex: 1;}
    #project_masterplan .section-content .col-right{margin-top: 0px;}
    .section-masterplan .section-content .col-left .nav-item .nav-link:before{}

    .project-apartment-slide .item_thumb{padding-right: 0px; padding-bottom: 30px;}
    .project-utilities-slide-arrow{position: absolute; top: calc(780/1225 * 100vw - 25px );  width: 100%;}
    .section-masterplan .section-title{margin-top: 0px;}
    .section-masterplan .section-content .col-left .nav-item .nav-link{font-size: 14px; padding-left: 20px;}
    .section-masterplan .section-content .col-left .nav-item .nav-link:before{width: 5px;height: 40px;}

    .project-modelhouse-slide{margin-left: 0px; margin-right: 0px;}

    .banner-button{right: 20px;}
    .banner-button{left: 20px; right: auto;}

    #section_video.section-banner-child{height: auto !important; background: #fff;}
    #section_video.section-banner-child .bg{
        position: relative; left: auto; top: auto;
        height: calc((100vw * 9 / 16)) !important;
    }
    #section_video.section-banner-child .section-content{position: static; left: auto; top: auto; padding: 5px 20px 20px;
    }
    .section-banner .section-content .section-title-lg{font-size: 30px; margin: 0px 0px 10px; padding-bottom: 10px;}
    #section_video.section-banner-child .section-content .section-title{color: #0a5597; border-color: #0a5597;}

    #about_banner .page-title{font-size: 30px; }
    #about_partner .items > .item .partner-slide h3{padding: 15px 20px;     padding-right: 120px;}
    #about_partner .items > .item .description{margin-bottom: 15px;}
    #about_outstanding .wrap > .item h3{    font-size: 14px;}
    #breadcrumbs{margin-bottom: 0px;}

    #finance_other .item .item-thumb{flex: 0 0 45%;}
    #finance_other .section-title{margin-top: 0px;}
    #about_outstanding .wrap > .item .thumb img{    max-width: 60px;max-height: 60px; margin-bottom: 5px;}
    #about_outstanding .wrap > .item .content{bottom: 20%;}
    
    .editor-content-gmap .editor-content h4{padding-left: 20px;}

}
@media (min-width:767px) and (max-width:991px) {


 }
@media (max-width:767px) {
    .section-padding{padding: 60px 0px;}

    .bg-lefttop,
    .bg-righttop,
    .bg-leftbottom,
    .bg-rightbottom{width: 45vw; height: 45vw;}
    .m-top{margin-top: -60px;}
    .m-top-sm{margin-top: -60px;}
    .m-top-xl{margin-top: -120px;}
    .m-bottom{margin-bottom: -60px;}
    .m-bottom-sm{margin-bottom: -60px;}

    /*.banner-button{position: fixed; bottom: 0px; left: 0px; top:auto; flex-direction: row !important; width: 100%; background: rgba(162,114,43,0.9 );  
        padding: 5px 0px;     justify-content: center;
    }
    .banner-button .hotline,
    .banner-button .other .register{  overflow: hidden;  text-indent: -9999px;
            width: 36px;
            height: 36px;
            border: solid 0px #fff;
            border-radius: 0%;
            background-position: center;
            background-size: 50% auto;
            padding: 0px;
            margin: 0px 10px;
    }
    .banner-button .hotline{background-image: url('../images/icon-call-mobile.svg'); }
    .banner-button .other a:not(:last-child){margin: 0px 10px; border-radius: 0px;}
    .banner-button .btn-social{ border-radius: 0px; border: 0px;}
    .banner-button .btn-social i{font-size: 20px;}
    .banner-button .btn-360 { height: 36px; padding: 3px 5px;}
    */
    .banner-button{bottom: 10px;}
    .banner-button .other .register{padding-left: 20px;}
    .banner-button .hotline{ font-size: 27px;   background-size: 27px;    padding-left: 36px; background-position: left top;}
    .banner-button .other .register{font-size: 10px;}
    .banner-button .btn-360 img,
    .banner-button .btn-360 svg{    max-height: 20px;}
    .banner-button .btn-social{    width: 27px; height: 27px;}
    .banner-button .btn-social i{    line-height: 2px;font-size: 16px;}
    .banner-button .other a:not(:last-child){margin-right: 10px;}

    
    
    #location .section-content{padding-left: 15px;}

    .section-title{ margin-top: 15px;     font-size: 24px;} /*25px*/
    .section-title strong, .section-title b, .editor-content h2 strong, .editor-content h2 b{ }
     h1 { font-size: 25px;}
     #partner .items .item .thumb{width: 160px; height:80px;}
     #partner .items .item{margin: 15px 0px; padding: 0px 15px; }
     #partner .items .item .thumb,
     #partner .items .item h3{margin-left: 0px; text-align: left;     font-size: 16px; min-height: 44px;}

     .post-list .item:not(.item-fullwith) .item-content{padding-left: 15px;padding-top: 10px;}
     .post-list .item:not(.item-fullwith) .item-content .date-time{height: 50px;  padding: 0px 4px 1px;     font-size: 10px;}
     .post-list .item:not(.item-fullwith) .description{display: none;}
     .post-list .item:not(.item-fullwith) .item-thumb{width: 50%;     flex: 0 0 50%;}
     .post-list .item h3{font-size: 14px;
            text-overflow: ellipsis;     display: -webkit-box;    -webkit-box-orient: vertical;    overflow: hidden;     -webkit-line-clamp: 3;
     }
     .footer-bottom{padding: 20px 0px;}
    #furniture .section-content{margin-bottom: 30px;}
    .overlay-menu .menu a{font-size: 18px;}
    .overlay-menu .main-menu .sub-menu a{font-size: 16px;}
    .overlay-menu .menu > .menu-item > a{  min-width: calc(100vw - 60px);}
    .overlay-menu .main-menu .menu-item-has-children > a .arrow::after{top: 0px;}
    .contact-address .item,
    .contact-address .item .title{font-size: 14px;}
    .page-news-detail h1.page-title.post-title{    font-size: 20px;}

    .footer-bottom{padding-bottom: 60px;}
    #gotop{width: 32px; height: 32px; bottom: 4px;z-index: 11;}
    .copyright{font-size: 15px;}

    .modelhouse-slide-wrapper{margin-left: 0px;}
    #project_modelhouse.section-content-gallery .slick-next{left: auto; right: 0px;}
    #project_modelhouse.section-content-gallery .slick-prev{left: auto; right: 51px;}

    .nav-category .category{margin-left: -20px; margin-right: -20px; display: flex;}
    .nav-category .category li{margin-right: 5px; margin-bottom: 5px; flex-grow: 1;}
    .nav-category .category li:last-child{margin-right: 0px;}
    .nav-category .category li a{  padding: 10px 5px; font-size: 12px;     text-align: center;}
    .section-apartment .slide-wrapper{margin-top: 60px;}
    .section-apartment .slide-wrapper .inner{padding: 60px 0px;}

    
    #about_introduction .section-content{padding-right: 20px;}
    #about_introduction .items .item .thumb{width: 32px;flex: 0 0 32px;}
    #about_introduction .items .item h3,
    #about_introduction .items .item .title{font-size: 13px;}
    #about_introduction .items .item .title{white-space: nowrap;}
    #about_partner .items > .item .partner-slide h3{
        position: static;
        font-size: 14px;
        padding: 7px 0px 0px;
        background: transparent; color: #444444;
    }
    .partner-slide .slick-next,
    .partner-slide .slick-prev{bottom: auto; top: calc((100vw - 40px) * 510/794 - 50px);}

    #finance_other .item{flex-direction: column;}
    #finance_other .item .item-thumb{flex: 1; margin-right: 0px;}
    #finance_other .section-title{margin-top: 15px;}
    #finance_other .title{padding-top: 20px; padding-bottom: 20px;     padding: 15px 0px 15px 30px;}
    #finance_other .accordion-button{font-size: 16px;}
    #finance_other .accordion-button::after{font-size: 24px;}


}
@media (max-width:575px) {
    #footer .contact-form{padding-right: 15px;}
	#footer .contact-form .inner{width: 100%;}

     #about_outstanding .items{height: auto; padding-top: 0px;}
    #about_outstanding .wrap{ transform: rotate(0deg); position: static; left: auto; top: auto; width: calc(100% - 30px); margin-left: 15px;}
    #about_outstanding .wrap > .item{  width: 100%;     padding-bottom: 56.25%; margin: 0;}
    #about_outstanding .wrap > .item:nth-child(2){margin-top: 0;}
    #about_outstanding .wrap > .item:nth-child(3){clear: none; margin: 0; }
    #about_outstanding .wrap > .item:nth-child(5){clear: none; margin: 0;}
    #about_outstanding .wrap > .item:nth-child(5){}
    #about_outstanding .wrap > .item .thumb{
        transform: rotate(0deg);
    position: absolute;
    left: 5px;
    top: 5px;
    width:  calc(100% - 10px);
    height:calc(100% - 10px);}
    #about_outstanding .wrap > .item .content{bottom: 15px; width: 90%; left: 5%;}
    #about_outstanding .wrap > .item .thumb img{ max-width: 75px; max-height: 75px;}

}
@media (max-width:359px) {
	
}



/*For Video*/
.video_header {
    background-position: center center ; background-repeat: no-repeat;
    background-size: cover;
    width: 100%;
    height: 100%;
    position: relative;
    left: 0;
    top: 0;
    margin: 0;
    padding: 0;
    z-index: 3;
    overflow: hidden;
    cursor: pointer;
}
.video_header video {
    /*position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%,-50%);
    transform: translate(-50%,-50%);
    min-width: 100%;
    min-height: 100%;*/

    object-fit: cover;
    width: 100%;
    height: 100%;
}


.video-cover-inline{
    width: 100%;
    height: 100%;
    position: relative;
    display: block;
}

.bgvideo, .bgvideo-mobile{
    position: absolute;
    left: 50%;
    top: 50%;
    width: 120px;
    height: 120px;
    margin-left: -60px; margin-top: -60px;
}

.bgvideo .btn-play, .bgvideo-mobile .btn-play{
      position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%,-50%);
    -ms-transform: translate(-50%,-50%);
    transform: translate(-50%,-50%);
}
.btn-play:before{
      content: '';
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    border: 3px solid #fff;
    -webkit-border-radius: 50%;
    border-radius: 50%;
    -webkit-transition: opacity .3s;
    -o-transition: opacity .3s;
    transition: opacity .3s;
}
.btn-play i{
      display: inline-block;
    width: 30px;
    height: 40px;
    vertical-align: middle;
    background-image: url(../images/icon-video-play.svg);
    -webkit-background-size: 100% 100%;
    background-size: 100% 100%;
    background-repeat: no-repeat;
    font-size: 0;
    line-height: 0;
    text-indent: -4004px;

      position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%,-50%);
    -ms-transform: translate(-50%,-50%);
    transform: translate(-50%,-50%);
    margin-left: 5px;
}
.btn-play circle {
    stroke: #fff;
}
.btn-play:hover:before{opacity: 0;}
.btn-play:hover svg {
    -webkit-animation: rotate 10s infinite linear;
    animation: rotate 10s infinite linear;
}

@media (max-width:1200px) {
    .bgvideo, .bgvideo-mobile{width: 90px; height: 90px;     margin-left: -45px;margin-top: -45px;}
    .bgvideo svg, .bgvideo-mobile svg{}
}


/*--------------*/
#video-controls {
    position: absolute;
    bottom: 20px;
    left: 0;
    right: 0;
    max-width: 246px;
    margin-left: 15px;
    padding: 5px;
    -webkit-transition: opacity .3s;
    -moz-transition: opacity .3s;
    -o-transition: opacity .3s;
    -ms-transition: opacity .3s;
    transition: opacity .3s;
    z-index: 99999999;
}
#video-container {
    position: relative;
}
#video-container:hover #video-controls {
    opacity: .9;
}
#video-controls  button{
    border: 0;
    text-align: center;
    background-color: transparent;
    border: none;
    cursor: pointer;
    -webkit-transition: all .3s ease-in-out;
    transition: all .3s ease-in-out;
    position: relative;
    display: inline-block;
    vertical-align: middle;
    background-position: center center;
    background-size: cover;
    background-repeat: no-repeat;
    text-indent: -99999999px;
}
#seek-bar{
    width:calc(100% - 72px); float:left; margin:0px 6px;
}
#custom-seekbar
{  
    cursor: pointer;
    height: 6px;
    overflow: hidden;
    position: relative;
    width: 160px;
    float:left;
    margin:  7px 5px;
    background:rgba(0,0,0,0.3);
}
    #custom-seekbar span
    {
      background-color: #ffc70b ;
      position: absolute;
      top: 0;
      left: 0;
      height: 10px;
      width: 0px;
    }
button.play {
    background-image: url(../images/tmp/pause.svg);
    line-height: 20px;
    width: 20px;
    height: 20px;float: left;
    
}
button.pause {
    background-image: url(../images/tmp/play.svg);
    line-height: 20px;
    width: 20px;
    height: 20px;float: left;
    
}
button#mute{
    background-image: url(../images/tmp/mute.svg);
    line-height: 20px;
    width: 20px;
    height: 20px;float: left;margin: 0px 3px;
}
button#mute.unmute{
    background-image: url(../images/tmp/unmute.svg);
    line-height: 20px;
    width: 20px;
    height: 20px;float: left;
}
#full-screen{
    background-image: url(../images/tmp/fullscreen.svg);
    line-height: 20px;
    width: 20px;
    height: 20px;float: left;
}


@keyframes StrokeLine {
    0% {
        stroke-dashoffset: 0;
    }
    100% {
        stroke-dashoffset: -200;
    }
}

.infinite {
  -webkit-animation-iteration-count: infinite;
  animation-iteration-count: infinite; }
.driveInTop {
  -webkit-animation-name: driveInTop;
  animation-name: driveInTop;
  -webkit-animation-duration: 1s;
  animation-duration: 1s; }

@keyframes driveInTop {
  0% {
    opacity: 0;
    -webkit-animation-timing-function: cubic-bezier(0.165, 0.84, 0.44, 1);
    animation-timing-function: cubic-bezier(0.165, 0.84, 0.44, 1);
    -webkit-transform: translate3d(0, -400px, 0);
    transform: translate3d(0, -400px, 0); }
  30% {
    opacity: 1; }
  60% {
    -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
    animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
    -webkit-transform: translate3d(0, 30px, 0);
    transform: translate3d(0, 30px, 0); }
  100% {
    -webkit-animation-timing-function: cubic-bezier(0.645, 0.045, 0.355, 1);
    animation-timing-function: cubic-bezier(0.645, 0.045, 0.355, 1);
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0); } 
}
.blink {
  -webkit-animation-name: blink;
  animation-name: blink;
  -webkit-animation-timing-function: cubic-bezier(0.42, 0, 0.58, 1);
  animation-timing-function: cubic-bezier(0.42, 0, 0.58, 1);
  -webkit-animation-duration: 1s;
  animation-duration: 1s; }

@keyframes blink {
  0% {
    opacity: 1; }
  25% {
    opacity: 0; }
  50% {
    opacity: 1; }
  75% {
    opacity: 0; }
  100% {
    opacity: 1; } 
}
.swoopInTop {
  -webkit-animation-name: swoopInTop;
  animation-name: swoopInTop;
  -webkit-animation-duration: 0.5s;
  animation-duration: 0.5s; }

@keyframes swoopInTop {
  0% {
    opacity: 0;
    -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
    animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
    -webkit-transform: scaleY(1.5) translate3d(0, -400px, 0);
    transform: scaleY(1.5) translate3d(0, -400px, 0); }
  40% {
    opacity: 1;
    -webkit-animation-timing-function: cubic-bezier(0.42, 0, 0.58, 1);
    animation-timing-function: cubic-bezier(0.42, 0, 0.58, 1);
    -webkit-transform: scaleY(1.2) translate3d(0, 0, 0);
    transform: scaleY(1.2) translate3d(0, 0, 0); }
  65% {
    -webkit-transform: scaleY(1) translate3d(0, 20px, 0);
    transform: scaleY(1) translate3d(0, 20px, 0); }
  100% {
    -webkit-animation-timing-function: cubic-bezier(0.42, 0, 0.58, 1);
    animation-timing-function: cubic-bezier(0.42, 0, 0.58, 1);
    -webkit-transform: scaleY(1) translate3d(0, 0, 0);
    transform: scaleY(1) translate3d(0, 0, 0); } 
}

@-webkit-keyframes Ringing-call {
    0% { }
    10% { -webkit-transform: rotate(10deg); -moz-transform: rotate(10deg); -o-transform: rotate(10deg); }
    20% { -webkit-transform: rotate(-10deg); -moz-transform: rotate(-10deg); -o-transform: rotate(-10deg); }
    30% { -webkit-transform: rotate(10deg); -moz-transform: rotate(10deg); -o-transform: rotate(10deg); }
    40% { -webkit-transform: rotate(-10deg); -moz-transform: rotate(-10deg); -o-transform: rotate(-10deg); }
    50% { -webkit-transform: rotate(10deg); -moz-transform: rotate(10deg); -o-transform: rotate(10deg); }
    60% { -webkit-transform: rotate(-10deg); -moz-transform: rotate(-10deg); -o-transform: rotate(-10deg); }
    70% { -webkit-transform: rotate(10deg); -moz-transform: rotate(10deg); -o-transform: rotate(10deg); }
    80% { -webkit-transform: rotate(-10deg); -moz-transform: rotate(-10deg); -o-transform: rotate(-10deg); }
    90% { -webkit-transform: rotate(10deg); -moz-transform: rotate(10deg); -o-transform: rotate(10deg); }
    100% { -webkit-transform: rotate(-10deg); -moz-transform: rotate(-10deg); -o-transform: rotate(-10deg); }
}

@media (max-width:991px) {
    
}

.fancybox-inner video{max-width: 100%; max-height: 100%;    padding: 5px; background-color: #e4bb7f;

}
@media (max-width:767px) {
    .bgvideo, .bgvideo-mobile{width: 54px; height: 54px; margin-left: -27px; margin-top: -27px;}
    .btn-play i{width: 18px;height: 18px; margin-left: 3px;}
    #video-controls{right: 5px; left: auto;bottom: 0px;}
    #video-controls #custom-seekbar,
    #video-controls #play-pause,
    #video-controls #full-screen{display: none;}
}

/*Loading Overlay*/
.loading-overlay{
    position: fixed;   width: 100%;   height: 100vh;   left: 0;   top: 0;   overflow: hidden;   z-index: 99999999;
}
.loading-overlay svg{width: 200px; height: 200px;}
.loading-overlay:before,
.loading-overlay:after{
    content: '';
    position: absolute;
    width: 100%;
    height: 50%;
    overflow: hidden;
    background-color: #0a5597;
    transition: height .9s ease;
   left: 0px;
   transition-duration: 0.5s; -moz-transition-duration: 1s; -o-transition-duration: 1s; -webkit-transition-duration: 1s; -ms-transition-duration: 1s;
}
.loading-overlay:before{top: 0px;}
.loading-overlay:after{bottom: 0px;}
.loading-overlay svg{position: absolute; left: 50%; top: 50%; transform: translate(-50%,-50%); z-index: 2;
    opacity: 0;
    transition-duration: 1s; -moz-transition-duration: 1s; -o-transition-duration: 1s; -webkit-transition-duration: 1s; -ms-transition-duration: 1s;
}
.loading-overlay.ready svg{opacity: 1;}
.loading-overlay.done{
    pointer-events: none;    
}
.loading-overlay.done:before,
.loading-overlay.done:after{height: 0px;}
.loading-overlay.done svg{opacity: 0;}

.loading-overlay .stroke-line {
    fill-opacity: 0;
    fill: #B1812C;
    stroke: #ffffff;
    stroke-miterlimit: 30;
    stroke-width: 20;
}

.loading-overlay.show .stroke-line,
.loading-overlay.show .stroke-line-2 {fill-opacity: 1;}



.sticky-bottom{background: #0a5597; height: 40px;  padding: 10px 15px; padding-right:70px ; position: fixed; z-index: 10; width: 100%; left: 0px; bottom: 0px;
    display: flex; border-top: solid 1px #e4bb7f;
}
.sticky-bottom a{color: #fff; 
     transition-duration: 0s; -moz-transition-duration: 0s; -o-transition-duration: 0s; -webkit-transition-duration: 0s; -ms-transition-duration: 0s;
}
.sticky-bottom .hotline{padding-left: 32px; background: url('../images/icon-call.svg') no-repeat left center; background-size: 20px;
     font-family: 'Anton', sans-serif; font-size: 20px; padding-right: 15px; position: relative; margin-right: 14px;
}
.sticky-bottom .hotline:after{content: ''; width: 1px; height: 20px; position: absolute;  top: 50%;transform: translateY(-50%); right: 0px; background: #fff;}
.sticky-bottom .register{font-size: 16px; padding-left: 32px; background: url('../images/icon-register.svg') no-repeat left center; background-size: 20px;}

@media (min-width:768px) {
    .sticky-bottom{background: transparent; border: 0px; height: 60px;    padding: 0px; width: auto; left: auto; right: 94px; bottom: 20px;}
    .sticky-bottom a{width: 60px; height: 60px; text-indent: -99999px;  border-radius: 50%;}

    .sticky-bottom .hotline{background: #ca9143 url('../images/icon-call3.svg') no-repeat center center; background-size: auto 34px; padding: 0px;
        
    }
    .sticky-bottom .hotline:after{display: none;}
    .sticky-bottom .register{ background: #ca9143 url('../images/icon-register.svg') no-repeat center center; background-size: auto 34px; padding: 0px;}

}

/*360*/
.section-360 .nav-tabs { border: 0px; justify-content: flex-end; position:absolute; z-index:2; bottom: 0px; left: 0px;}
.section-360 .nav-tabs li{margin: 0px;}
.section-360 .nav-tabs li .nav-link { border: 0px solid transparent; border-top-left-radius: 0; border-top-right-radius: 0; height: 42px; line-height: 42px; background: #0a5597 ; color: #fff; font-size: 14px; text-transform: uppercase; padding: 0 16px; -webkit-transition: all 200ms linear; -moz-transition: all 200ms linear; -o-transition: all 200ms linear; -ms-transition: all 200ms linear; transition: all 200ms linear; }
.section-360 .nav-tabs li .nav-link:hover,
.section-360 .nav-tabs li .nav-link.active { background: #e4bb7f ;  }
.section-360 .tab-content { position: absolute; width: 100%; height: calc(100% - 70px) ; left: 0px; top: 70px; }
.section-360 .tab-content > .tab-pane{height:100%;}
@media only screen and (max-width: 991px){
    .section-360 .nav-tabs{width: 100%;}
    .section-360 .nav-tabs li{width: 50%;height: 42px;}
    .section-360 .nav-tabs li .nav-link { font-size: 10px; padding: 0 10px; height: 42px; line-height: 42px; width: 100%; }
    .section-360 .tab-content {height: calc(100% - 42px) ;  top: 0px; }
}
@media only screen and (max-width: 767px){
    
    
}

@media only screen and (max-width: 320px) {
    .section-360 .nav-tabs li .nav-link { padding: 0 6px; font-size: 9px; }
}



