@charset "utf-8";
body
{
	margin: 0;
	padding: 0;
	font-family: 'Arial';
	font-size: 14px;
	display: inline-block;
	width: 100% !important;
	color: #333333;
	overflow-x: hidden;
	font-weight:400;
}
a, p, strong, ul, h1, h2, h3, h4, h5, h6, li{margin: 0;padding: 0}
h1{font-size: 24px}
h3{font-size: 28px}
h4{font-size: 22px}
li{list-style: none}

body{position: relative;}
.header{padding: 12px 0; display: inline-block; width: 100%; transition: all .35s; background: #fff;   z-index: 99999}
.header .logo{margin-left: 38px; display: inline-block; float: left;}
.header .menu-top{margin-top: 21px; display: inline-block;  float: right;}
.header .navbar-inverse{background: none; border:0; border-radius: 0; min-height: 10px; margin: 0; width: auto;}
.header .container-fluid{display: inline-block; width: auto;}
.header .container-fluid > div {display: inline-block; float: left}
.navbar-inverse .navbar-brand{padding: 0; height: auto;}
.navbar-inverse .navbar-brand i{color: #d49f0b; font-size: 25px;}
.navbar-inverse .navbar-nav > li > a{color: #5d4501; padding: 5px 10px; margin-left: 28px; font-size: 14px;font-weight:bold; line-height: 18px; text-transform: uppercase; font-family: 'Arial';}
.navbar-inverse .navbar-nav > li:last-child > a{padding-right: 0;}
.navbar-inverse .navbar-nav > li > a:hover, .navbar-inverse .navbar-nav > li > a:focus{ color: #5d4501;  }
.navbar-inverse .navbar-nav > .active > a, .navbar-inverse .navbar-nav > .active > a:hover, .navbar-inverse .navbar-nav > .active > a:focus{ color: #5d4501; background: none; text-decoration: underline; }

.main-content{display: inline-block; width: 100%; margin-top: 84px;}
/* banner */
	.bx-wrapper{border:0; padding: 0; box-shadow: 0 0 0; margin: 0;}
	.bx-wrapper .bxslider li{position: relative;}
	.bx-wrapper .bxslider li img{width: 100%}
	.bx-wrapper .bxslider li .text-banner{position: absolute; left:7.1%; top:41%; z-index: 1; padding: 10px 40px 10px 100px;}
	.bx-wrapper .bxslider li .text-banner:before{ content: ""; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: #fff; opacity: 0.35; z-index: 2 }
	.bx-wrapper .bxslider li .text-banner h3{position: relative; z-index: 4; font-family: 'Arial'; font-size: 36px; line-height: 42px; color: #fff; }
	.bx-wrapper .bxslider li .text-banner h3 span{text-transform: uppercase; font-family: 'Minion Pro'; font-size: 48px; line-height: 56px; color: #f4ba2f; display: block;}
	.bx-wrapper .bx-controls-direction a{ width: 57px; height: 57px; top:48%;}
	.bx-wrapper .bx-controls-direction a.bx-prev{background:url(../image/vincityhome/vc-icon-prev-banner.png) no-repeat 0 0; left:7.1%;}
	.bx-wrapper .bx-controls-direction a.bx-next{background:url(../image/vincityhome/vc-icon-next-banner.png) no-repeat 0 0; right:7.1%;}
	.bx-wrapper .bx-pager{display: none !important}
/* giới thiệu */
	.container-fluid{position: relative; display: inline-block; width: 100%; float: left; }
	.container-fluid > img{max-width: 100%; width: 100%}
	.content-page{padding:100px 0 0; }
	.title-block{text-align: center;}
	.title-block h3{color: #d49f0b; text-transform: uppercase;font-size: 30px; line-height: 38px; font-family: 'Arial'; margin: 40px 0 0}
	.content-text {font-size: 16px; margin-top: 40px; line-height: 20px; font-family: 'Arial';  text-align: center; padding: 0 15px}


	#gioi-thieu{display: inline-block; width: 100%; }
	#gioi-thieu .content-page{ position: absolute; top:0; left:0; width: 100%; height: 100%; z-index: 4}
	#gioi-thieu .content-text { color: #fff}
	#gioi-thieu .gioi-thieu-text { max-width: 660px; margin: 0 auto 77px }
	#gioi-thieu .row p{font-family: 'Arial'; font-size: 20px; line-height: 26px; color: #d49f0b}
	#gioi-thieu .row p:nth-child(2){ font-size: 30px; line-height: 36px; color: #fff; font-weight: bold; margin: 12px 0 0}
/* vị trí */
	#vi-tri .container{padding: 0}
	.box-container{display: inline-block; width: 100%; line-height: 0; float: left;}
	.box-container .content-box{width: 50%; float: left;}
	.content-box.content-text{padding-left: 15px; padding-right: 15px;}
	.content-box.content-img img{max-width: 100%; width: 100%}
	.content-text .title-block{margin-top: 30px;}
/* căn hộ */
	#can-ho .container{padding: 0}
	#can-ho .box-container:last-child .content-page{padding-top: 13.5%}

/* tiện ich*/
	#tien-ich{margin-top: 50px;}
	#tien-ich h3{ background: #d49f0b; font-size: 36px; padding-bottom: 3px; text-transform: uppercase; color: #fff; font-family: 'Arial'; text-align: center; line-height: 70px; display: inline-block; width:100%;}
	#tien-ich ul{display: inline-block; width: 100%}
	#tien-ich ul li{display: inline-block; float: left; width: 33.334%; position: relative;}
	#tien-ich ul li img{max-width: 100%; width: 100%}
	#tien-ich ul li a.name-tien-ich{display: none; color: #fff; font-size: 16px; line-height: 22px; font-family: 'Arial'; text-align: center; position: absolute; top:0; left:0; width: 100%; height: 100%; z-index: 1}
	#tien-ich ul li a.name-tien-ich:before{ content: ""; background:#000; opacity: 0.5; position: absolute; top:0; left:0; width: 100%; height: 100%; z-index: -1}
	#tien-ich ul li a.name-tien-ich:hover{text-decoration: none}
	#tien-ich ul li a div{ display: table; height: 100%; width: 100%}
	#tien-ich ul li a p{display: table-cell; vertical-align: middle;}
	#tien-ich ul li a p span{margin: 0 auto; max-width: 250px; padding: 0 10px }
	#tien-ich ul li a p span:first-child{ font-size: 25px; line-height: 25px; text-transform: uppercase; max-width: 185px; padding: 0 0 15px; margin-bottom: 20px; border-bottom: 1px solid #fff; display: inline-block;}
	#tien-ich ul li a p span:last-child{display: block;}

	#tien-ich ul li:hover a.name-tien-ich{display: inline-block;}

/* đăng ký */
	#dang-ky .title-block{max-width: 920px; margin:0 auto;}
	#dang-ky .title-block h3{margin-bottom: 22px}
	#dang-ky .title-block p{font-size: 16px; line-height: 20px; font-family: 'Arial'; color: #121212; margin: 0}
	#dang-ky  form{max-width: 730px; margin: 45px auto 0; text-align: center;}
	#dang-ky  form .form-group{margin-bottom: 32px;}
	#dang-ky  form input, #dang-ky  form button{font-size: 16px; line-height: 22px; text-align: left; color: #121212; font-family: 'Arial'; width: 100%; height: 48px; border:1px solid #d49f0b; box-shadow: 0 0 0; border-radius: 26px; padding: 11px 20px  11px 65px;}
	#dang-ky input::-webkit-input-placeholder { /* WebKit, Blink, Edge */
    color:    #121212; height: 40px;
}
	#dang-ky input:-moz-placeholder { /* Mozilla Firefox 4 to 18 */
	   color:    #121212;
	   opacity:  1;
	}
	#dang-ky input::-moz-placeholder { /* Mozilla Firefox 19+ */
	   color:    #121212;
	   opacity:  1;
	}
	#dang-ky input:-ms-input-placeholder { /* Internet Explorer 10-11 */
	   color:    #121212
	}
	#dang-ky  form button{ width: 172px; margin: 5px auto 0; height: 43px; background:#fff !important; padding: 0; text-align: center; text-transform: uppercase;color: #d49f0b; line-height: 44px;}
/* footer */
.footer{display: inline-block; width: 100%; margin-top: 70px; background:#e1e1e1; text-align: center;}
.footer-content{padding: 25px 0  30px}
.footer-content img{width: 225px;}
.footer h4{ color: #d49f0b; font-size: 14px; line-height: 20px; font-family: 'Arial'; text-transform: uppercase; font-weight: bold; margin: 20px 0 22px;}
.footer p{ color: #121212; font-size: 16px; line-height: 22px; font-family: 'Arial'; }
.footer p i{ color: #d49f0b; margin-right: 19px }
.footer .footer-copy{background: #d49f0b; padding: 18px 0; text-align: left;}
.footer .footer-copy p{ color: #fff; text-transform: uppercase; font-size: 14px; line-height: 16px; padding-left: 14px;}

@media(max-width: 1199px)
{
	.header .logo{margin-left: 0}
	.bx-wrapper .bxslider li .text-banner, .bx-wrapper .bx-controls-direction a.bx-prev{left: 9.8%;}
	.bx-wrapper .bx-controls-direction a.bx-next{right: 9.8%}

	.content-page{padding-top: 80px}
	#gioi-thieu .gioi-thieu-text{margin-bottom: 40px}
}
@media(max-width: 1140px)
{
	.bx-wrapper .bxslider li .text-banner, .bx-wrapper .bx-controls-direction a.bx-prev{left: 8%;}
	.bx-wrapper .bx-controls-direction a.bx-next{right: 8%}
	.bx-wrapper .bxslider li .text-banner{top:40%;}

	#gioi-thieu .content-page{padding-top: 80px}
	#gioi-thieu .row p:nth-child(2){font-size: 29px;}
	.content-page{padding-top: 60px;}
}
@media(max-width: 1024px)
{
	.bx-wrapper .bxslider li .text-banner, .bx-wrapper .bx-controls-direction a.bx-prev{left: 3.3%;}
	.bx-wrapper .bx-controls-direction a.bx-next{right: 3.3%}
	.bx-wrapper .bxslider li .text-banner{top:39%;}
	#gioi-thieu .content-page{padding-top: 60px}

	.box-container .content-page{ padding-top: 60px }
	.content-page .icon img{width: 60px}
	.content-page .title-block h3{font-size: 25px; margin-top: 20px}
	.box-container .content-text{margin-top: 20px}
}
@media(max-width: 992px)
{

	.bx-wrapper .bxslider li .text-banner, .bx-wrapper .bx-controls-direction a.bx-prev{left: 1.7%;}
	.bx-wrapper .bx-controls-direction a.bx-next{right: 1.7%}
	.bx-wrapper .bxslider li .text-banner{top:38%;}
}
@media(max-width: 768px)
{
	.header .logo img{width: 160px}
	.navbar-inverse .navbar-nav > li > a{font-size: 12px; margin-left: 7px}
	.bx-wrapper .bxslider li .text-banner h3{font-size: 28px; line-height: 36px;}
	.bx-wrapper .bxslider li .text-banner h3 span{font-size: 32px; line-height: 40px;}
	.bx-wrapper .bxslider li .text-banner{padding: 10px 20px 10px 60px}
	.bx-wrapper .bx-controls-direction a{width: 45px; height: 45px; background-size: 45px !important;}


	.box-container .content-page{ padding-top: 30px }
	.content-page .title-block h3{font-size: 20px; line-height: 25px;}
	.content-text{margin-top: 20px;}
	#gioi-thieu .gioi-thieu-text{margin-bottom: 20px;}
	#gioi-thieu .row p{font-size: 18px; line-height: 22px;}
	#gioi-thieu .row p:nth-child(2){font-size: 22px; line-height: 26px; margin-top: 8px}
	.content-text{font-size: 14px; line-height: 18px}
	#tien-ich h3{font-size: 28px; line-height: 55px}
	#tien-ich ul li a p span:first-child{padding: 0 0 5px; margin-bottom: 10px; font-size: 20px; line-height: 25px;}
}
@media(max-width:767px)
{
	.header{ line-height: 0}
	.header .menu-top{margin:0; width: 100%}
	.navbar-inverse .navbar-brand{display: none;}
	.navbar-inverse .navbar-toggle{ margin: 0; position: absolute; right: 0px; top:-41px;}
	.navbar-inverse .navbar-toggle .icon-bar{background-color: #000;}
	.navbar-fixed-top, .navbar-fixed-bottom{position: inherit;}
	.header .navbar-inverse{min-height: 0;}
	.navbar-inverse .navbar-toggle:hover, .navbar-inverse .navbar-toggle:focus{background-color: #000}
	.navbar-inverse .navbar-toggle:hover .icon-bar, .navbar-inverse .navbar-toggle:focus .icon-bar{background-color: #fff}
	.header .container-fluid > div, .header .container-fluid{width: 100%; display: inline-block;}
	.navbar-inverse .navbar-form{border: 0}
	.navbar-inverse .navbar-nav{margin: 10px 0 0}
	.navbar-inverse .navbar-nav > li{border-bottom: 1px dotted #ccc; }
	.navbar-inverse .navbar-nav > li a{ margin: 0;}
	.navbar-inverse .navbar-nav > li:last-child{border-bottom:0}
	.navbar-inverse .navbar-collapse, .navbar-inverse .navbar-form{border:0;}

	.main-content{margin-top: -5px;}
	.bx-wrapper .bxslider li .text-banner h3{font-size: 22px; line-height: 30px;}
	.bx-wrapper .bxslider li .text-banner h3 span{font-size: 26px; line-height: 32px;}
	.bx-wrapper .bxslider li .text-banner{padding: 10px 20px 10px 60px}
	.bx-wrapper .bxslider li .text-banner, .bx-wrapper .bx-controls-direction a.bx-prev{left:10px}
	.bx-wrapper .bx-controls-direction a.bx-next{right:10px}

	#gioi-thieu .content-page{padding-top: 30px;}
	.content-text{padding: 0 10px;}
	#gioi-thieu .row p:nth-child(2){font-size: 18px; line-height: 22px; margin: 0 0 8px}
}
@media(max-width: 736px)
{
	.content-page .icon img{width: 50px}
	.content-page .title-block h3{font-size: 17px; line-height: 22px; margin-top: 13px}
	#gioi-thieu .content-text, .box-container .content-text{margin-top: 13px}
}
@media(max-width: 667px)
{
	.content-text{ font-size: 13px; line-height: 17px}
	#tien-ich ul li a p span:first-child{font-size: 17px; line-height: 22px;}
	#tien-ich ul li a.name-tien-ich{font-size: 14px; line-height: 18px;}
}
@media(max-width: 640px)
{
	#gioi-thieu .row p{font-size: 16px; line-height: 20px;}
	#gioi-thieu .row p:nth-child(2){font-size: 17px; line-height: 22px;}
	.box-container .content-page{padding-top: 15px}
	#can-ho .box-container:last-child .content-page{padding-top: 11%;}

	#tien-ich{margin-top: 30px}
	.footer{margin-top: 30px;}
}
@media(max-width: 639px)
{
	.box-container .content-box, .box-container .content-page{width: 100%}
	.box-container .content-page{padding: 30px 0}
	 #can-ho .box-container:last-child .content-page{padding-top: 0}
	#tien-ich h3{font-size: 22px; line-height: 45px; padding:0 }
	#tien-ich ul li{width: 50%; }
	#tien-ich ul li img{width: 100%}
	.footer .footer-copy p{padding-left: 0; text-align: center;}
	.footer p i{margin-right: 12px;}
	.content-page{padding-top: 30px;}
}
@media(max-width: 568px)
{
	.container-fluid > img{max-width: 400%; width: 120%; margin-left: -10%}
}
@media(max-width: 480px)
{
	.container-fluid > img{ width: 140%; margin-left: -20%}
}
@media(max-width: 414px)
{
	.bx-wrapper .bxslider li .text-banner{display: none}
	.bx-wrapper .bx-controls-direction a { width: 35px; height: 35px; background-size: 35px !important}
	.container-fluid > img{ width: 170%; margin-left: -35%}
	#tien-ich ul li{width: 100%; margin-bottom: 5px}
	#dang-ky form input{padding: 11px 20px}
}
@media(max-width: 360px)
{
	.container-fluid > img{ width: 220%; margin-left: -6%}
}
/* breadcrumb */
.breadcrumb {
	margin: 13px 0 4px 0;
	padding: 6px 0;
	background-color:#fff;
}
.breadcrumb i {
	font-size: 15px;
}
.breadcrumb > li {
	text-shadow: 0 1px 0 #FFF;
	padding: 0 20px;
	position: relative;
	white-space: nowrap;
}
.breadcrumb > li + li:before {
	content: '';
	padding: 0;
}
.breadcrumb > li:after {
	content: '';
	display: block;
	position: absolute;
	top: -3px;
	right: -5px;
	width: 26px;
	height: 26px;
	border-right: 1px solid #DDD;
	border-bottom: 1px solid #DDD;
	-webkit-transform: rotate(-45deg);
	-moz-transform: rotate(-45deg);
	-o-transform: rotate(-45deg);
	
	transform: rotate(-45deg);
}
.toph3
{
	font-size: 16px;
}
/* alert */
.alert {
	padding: 8px 14px 8px 14px;
}